diff --git a/components/dialog/header.md b/components/dialog/header.md index ad51e95aa..4c242eb6d 100644 --- a/components/dialog/header.md +++ b/components/dialog/header.md @@ -26,10 +26,6 @@ You can control the close action via the `ShowCloseButton` parameter. Its defaul The following example demonstrates how to set up the title through a template. The close action button is also hidden. ->caption The result from the code snippet. - -![Blazor Dialog Header](images/dialog-header.png) - >caption Title template and no close button in the Telerik Dialog. ````CSHTML diff --git a/components/dialog/images/alert-first-look.gif b/components/dialog/images/alert-first-look.gif deleted file mode 100644 index c28ed4750..000000000 Binary files a/components/dialog/images/alert-first-look.gif and /dev/null differ diff --git a/components/dialog/images/confirm-first-look.gif b/components/dialog/images/confirm-first-look.gif deleted file mode 100644 index 2a2098363..000000000 Binary files a/components/dialog/images/confirm-first-look.gif and /dev/null differ diff --git a/components/dialog/images/dialog-header.PNG b/components/dialog/images/dialog-header.PNG deleted file mode 100644 index 56811ec62..000000000 Binary files a/components/dialog/images/dialog-header.PNG and /dev/null differ diff --git a/components/dialog/images/dialog-visibility.gif b/components/dialog/images/dialog-visibility.gif deleted file mode 100644 index 1e03062e7..000000000 Binary files a/components/dialog/images/dialog-visibility.gif and /dev/null differ diff --git a/components/dialog/images/prompt-first-look.gif b/components/dialog/images/prompt-first-look.gif deleted file mode 100644 index 42b40c5af..000000000 Binary files a/components/dialog/images/prompt-first-look.gif and /dev/null differ diff --git a/components/dialog/predefined.md b/components/dialog/predefined.md index 16312945f..21bf60b7e 100644 --- a/components/dialog/predefined.md +++ b/components/dialog/predefined.md @@ -10,9 +10,12 @@ position: 2 # Predefined Dialogs - Alert, Confirm, Prompt -Telerik UI for Blazor provides styled substitutes to the standard confirm, alert, and prompt dialogs. These Blazor popup messages match the Theme of the components to make it obvious to the user that the modal dialog is coming from your application. +Telerik UI for Blazor provides styled substitutes to the standard alert, confirm, and prompt dialogs of the browser. These Blazor popup messages match the Theme of the components to make it obvious to the user that the modal dialog is coming from your application. -To use these dialogs (popup messages), receive a cascading parameter of type `Telerik.Blazor.DialogFactory`. It exposes the methods you can use in your method calls. + +## Using Predefined Dialogs + +To use the alert, confirm, and prompt dialogs (popup messages), receive a cascading parameter of type `Telerik.Blazor.DialogFactory`. This object exposes the methods you can use to display the predefined dialogs.
@@ -21,14 +24,28 @@ To use these dialogs (popup messages), receive a cascading parameter of type `Te public DialogFactory Dialogs { get; set; } ```` -The predefined dialogs can only be used inside child Razor components of the [`TelerikRootComponent`]({%slug rootcomponent-overview%}). This is easily achieved in standard Blazor apps where the `TelerikRootComponent` resides inside the layout file. When [using UI for Blazor in ASP.NET apps]({%slug telerik-blazor-in-asp-net-app%}), an additional child component is needed. - There are three available ready-made dialogs: * [Alert](#alert) * [Confirm](#confirm) * [Prompt](#prompt) +### TelerikRootComponent Dependency + +The `DialogFactory` cascading parameter can only be consumed inside child Razor components of the [`TelerikRootComponent`]({%slug rootcomponent-overview%}#purpose). This is easily achieved in standard Blazor apps where the `TelerikRootComponent` resides inside the layout file. + +* To show predefined dialogs in `MainLayout.razor`, [add the `TelerikRootComponent` in a parent layout]({%slug rootcomponent-overview%}#using-telerikrootcomponent). +* When [using UI for Blazor in ASP.NET apps]({%slug telerik-blazor-in-asp-net-app%}), an additional child component is needed. + +### Using await + +The `DialogFactory` methods must be awaited. Do not use them with [discard variables (`_`)](https://learn.microsoft.com/en-us/dotnet/csharp/fundamentals/functional/discards). If you don't need to await the user response, then [use the `