Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/stavroskasidis/blazordialog

Easy dialog management for Blazor !
https://github.com/stavroskasidis/blazordialog

blazor blazor-component blazor-dialog blazor-wasm blazordialog dialog

Last synced: 5 days ago
JSON representation

Easy dialog management for Blazor !

Awesome Lists containing this project

README

        

# Blazor Dialog

[![Build status](https://dev.azure.com/stavros-kasidis/Blazor%20Dialog/_apis/build/status/Blazor%20Dialog-CI)](https://dev.azure.com/stavros-kasidis/Blazor%20Dialog/_build/latest?definitionId=16) [![Nuget (with prereleases)](https://img.shields.io/nuget/vpre/BlazorDialog.svg?logo=nuget)](https://www.nuget.org/packages/BlazorDialog) [![Nuget](https://img.shields.io/nuget/dt/BlazorDialog.svg?logo=nuget)](https://www.nuget.org/packages/BlazorDialog) [![Donate](https://img.shields.io/badge/Donate-PayPal-green.svg)](https://www.paypal.com/cgi-bin/webscr?cmd=_donations&business=7CRGWPYB5AKJQ&currency_code=EUR&source=url)

Dialog component as a service for [Blazor](https://blazor.net)!

![demo-img](ReadmeResources/dialog-demo.gif)

## 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](https://blazor-dialog-demo.azurewebsites.net/).

## 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](https://www.nuget.org/packages/BlazorDialog).*

**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`**
```csharp
public class Startup
{
public void ConfigureServices(IServiceCollection services)
{
// other code
services.AddBlazorDialog();
// other code
}
}
```

**- Blazor wasm: `Program.cs`**
```csharp
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`**
```csharp
@using BlazorDialog
```

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

```

**5. Reference the css file**

Add the following static file references 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`.

```html

```
```html

```

## ⚠️ Breaking changes ⚠️

Upgrading from 3.2 to 4.0

>- It is required to add a static file reference to the new javascript file.

Upgrading from 0.3 to 1.0

>- Removed `PreventShow` and `PreventHide` from `OnBeforeShow` and `OnBeforeHide` respectively. Too many cases where infinite loops could happen.

## Release Notes

4.0

>- A new javascript file is required to be loaded (see breaking changes).
>- New feature: Allow closing the dialog with a key press (escape by default).

3.2

>- Fix for a bug when the same dialog is presented consecutively, never returning result. Contributed by [thanoskapsalis](https://github.com/thanoskapsalis).

3.1

>- Added `ForceAllowNavigation` and `ForcePreventNavigation` methods to the `Dialog` component to allow/prevent navigation regardless of the `PreventNavigation` parameter.

3.0

>- Migrate to .NET 8.0
>- Add PreventNavigation option to prevent navigation when dialog is open.

2.3

>- Expose dialog options as cascading parameter when using ComponentAsDialog.

2.2

>- Fix for showing the same dialog with the dialog service more than once in the same async function.
>- Upgrade MS packages dependecy to 6.0.26

2.1

>- Minor fix for when returning null dialog results to non nullable result types.

2.0

>- New feature: ShowComponentAsDialog. Check demo app for examples.
>- Upgraded target framework to 6.0

1.6

>- Added a new size option: ExtraExtraLarge.

1.5

>- Added css class parameter to all helper components (header/body/footer).

1.4

>- Added css class parameter to dialog component.

1.3

>- Added base z-index parameter to dialog component.

1.2

>- Added fullscreen mode.

1.1

>- Added support for dialog-in-dialog.

1.0

>- Fixed an infinite loop bug with `OnBeforeShow` event.
>- Fixed css bugs.
>- Removed `PreventShow` and `PreventHide` from `OnBeforeShow` and `OnBeforeHide` respectively. Too many cases where infinite loops could happen.

0.3

>- Upgrated to 3.1.
>- Added new helper components: `DialogHeader`, `DialogBody`, `DialogFooter`

0.1

>- Initial release.