Dialog Service

Setup Required

DialogService uses the AlertDialog component wrapped in DialogHost. Add DialogHost once in your root layout to enable dialogs throughout your app:

<!-- In MainLayout.razor or App.razor -->
<DialogHost />

<!-- Your app content -->
@Body

Service Registration

Register DialogService in your DI container:

// In Program.cs
builder.Services.AddScoped<DialogService>();

Benefits

• Consistent dialog interface across all pages and components
• No need to manage dialog state in each component
• Single DialogHost handles all dialogs - no duplicate overlays
• Built on top of accessible AlertDialog primitive
• Async/await API makes dialog flows easy to read

Delete Confirmation (One-liner)

if (await Dialog.ConfirmDeleteAsync("User Account"))
{
    // User confirmed - delete the item
    await DeleteUser();
}

Custom Dialog

var result = await Dialog.ShowAsync(new DialogOptions
{
    Title = "Save Changes?",
    Message = "Do you want to save your changes?",
    Icon = "save",
    Variant = DialogVariant.Warning,
    Buttons = DialogButtons.YesNoCancel,
    ConfirmText = "Save",
    CancelText = "Don't Save",
    AlternateText = "Cancel"
});

if (result == DialogResult.Confirmed)
{
    await SaveChanges();
}