Blazor Dialog

Dialog component as a service for Blazor!

Features

• Call a dialog procedurally as a service and await for the result !
• Open any component as a dialog.
• Can use dialogs as normal components (if you don't want to use as a service).
• Build-in modal dialog with optional helper components (Header, Body, Footer).
• Option to use completely custom markup/css (without using the build-in opinionated css and html).

Samples / Demo

You can find code samples and demos here.

Installation

1. Add the nuget package in your Blazor project

> dotnet add package BlazorDialog

OR

PM> Install-Package BlazorDialog

Nuget package page can be found here.

2. Add the following line in your Blazor project in either Startup.cs (blazor server-side) or Program.cs (blazor wasm)

- Blazor server-side: Startup.cs

public class Startup
{
    public void ConfigureServices(IServiceCollection services)
    {
        // other code
        services.AddBlazorDialog();
        // other code
    }
}

- Blazor wasm: Program.cs

public class Program
{
    public static async Task Main(string[] args)
    {
       // other code
        builder.Services.AddBlazorDialog();
        // other code
    }
}

3. Add the following line in your _Imports.razor

@using BlazorDialog

4. Add the following line in your MainLayout.razor or App.razor (must be rendered once in a central spot)

<DialogOutput/>

5. Reference the css file

Add the following static file reference in your _Host.cshtml (server-side blazor) or in your index.html (client-side blazor). Make sure that there is a call to app.UseStaticFiles(); in your server project's Startup.cs.

<link href="_content/BlazorDialog/styles.min.css" rel="stylesheet" />

⚠️ Breaking changes ⚠️

Release Notes