diff --git a/README.md b/README.md index 7cd02b9..6cbae1b 100644 --- a/README.md +++ b/README.md @@ -2,6 +2,8 @@ Blazor toast notifications shell using Tailwindcss v2.0+ +> **Requires .NET 9.0 or later.** + Thank you to Chris Sanity for the base functionality through Blazored.Toasts. This is basically a fork of his work. This version uses Tailwindcss instead of bootstrap. There are a few base styles included, however, With TailBlazor being so incredibly low level there is the option to load entire render fragments in instead to give unlimited customization to toasts @@ -50,7 +52,17 @@ Add this to the top of your MainLayout.razor component. `` -### 4. Using basic components +### 4. Enable interactive rendering + +TailBlazor.Toast is ready for Blazor's interactive *Auto* render mode. When the component is rendered it automatically lights up on the client regardless of whether the host app is prerendering for WebAssembly, Server, or switching between them at runtime. For standalone pages or layouts you can optionally opt into Auto mode explicitly by adding the following directive: + +``` +@rendermode InteractiveAuto +``` + +The included sample app shows this directive in `App.razor` for reference. + +### 5. Using basic components Edit the TailBlazorToasts component in mainlayout with your base settings @@ -77,7 +89,7 @@ Edit the TailBlazorToasts component in mainlayout with your base settings ``` -#### 5. Create your custom toast component +#### 6. Create your custom toast component You can create the template that you'll use for some or all of your toasts using tailwind. @@ -112,7 +124,7 @@ Here is a basic example. Create a folder named `Toasts` and create a component c ``` -#### 5. Use your toast component +#### 6. Use your toast component Go to Index and inject your toast service diff --git a/samples/TailBlazor.ToastServer/App.razor b/samples/TailBlazor.ToastServer/App.razor index e10dd75..6e21789 100644 --- a/samples/TailBlazor.ToastServer/App.razor +++ b/samples/TailBlazor.ToastServer/App.razor @@ -1,10 +1,13 @@ - - - - - - -

Sorry, there's nothing at this address.

- - - +@using Microsoft.AspNetCore.Components.Web +@rendermode InteractiveAuto + + + + + + + +

Sorry, there's nothing at this address.

+ + + diff --git a/samples/TailBlazor.ToastServer/Shared/MainLayout.razor b/samples/TailBlazor.ToastServer/Shared/MainLayout.razor index 0383a53..63c486b 100644 --- a/samples/TailBlazor.ToastServer/Shared/MainLayout.razor +++ b/samples/TailBlazor.ToastServer/Shared/MainLayout.razor @@ -1,6 +1,6 @@ @namespace TailBlazor.ToastServer.Shared @using TailBlazor.Toast -@using Toast.Configuration +@using TailBlazor.Toast.Configuration @inherits LayoutComponentBase diff --git a/samples/TailBlazor.ToastServer/TailBlazor.ToastServer.csproj b/samples/TailBlazor.ToastServer/TailBlazor.ToastServer.csproj index 5ab7688..ffefff2 100644 --- a/samples/TailBlazor.ToastServer/TailBlazor.ToastServer.csproj +++ b/samples/TailBlazor.ToastServer/TailBlazor.ToastServer.csproj @@ -1,8 +1,10 @@ - - net5.0 - + + net9.0 + enable + enable + diff --git a/samples/TailBlazor.ToastServer/_Imports.razor b/samples/TailBlazor.ToastServer/_Imports.razor index 31e738d..e741fb3 100644 --- a/samples/TailBlazor.ToastServer/_Imports.razor +++ b/samples/TailBlazor.ToastServer/_Imports.razor @@ -1,13 +1,13 @@ -@using System.Net.Http -@using Microsoft.AspNetCore.Authorization -@using Microsoft.AspNetCore.Components.Authorization -@using Microsoft.AspNetCore.Components.Forms -@using Microsoft.AspNetCore.Components.Routing -@using Microsoft.AspNetCore.Components.Web -@using Microsoft.AspNetCore.Components.Web.Virtualization -@using Microsoft.JSInterop -@using TailBlazor.ToastServer -@using TailBlazor.ToastServer.Shared -@using TailBlazor.ToastServer.Toasts -@using TailBlazor.Toast.Services -@using TailBlazor.Toast \ No newline at end of file +@using System.Net.Http +@using Microsoft.AspNetCore.Authorization +@using Microsoft.AspNetCore.Components.Authorization +@using Microsoft.AspNetCore.Components.Forms +@using Microsoft.AspNetCore.Components.Routing +@using Microsoft.AspNetCore.Components.Web +@using Microsoft.AspNetCore.Components.Web.Virtualization +@using Microsoft.JSInterop +@using TailBlazor.ToastServer +@using TailBlazor.ToastServer.Shared +@using TailBlazor.ToastServer.Toasts +@using TailBlazor.Toast.Services +@using TailBlazor.Toast diff --git a/src/TailBlazor.Toast/Configuration/ToastInstance.cs b/src/TailBlazor.Toast/Configuration/ToastInstance.cs index cf43f83..c4a09bf 100644 --- a/src/TailBlazor.Toast/Configuration/ToastInstance.cs +++ b/src/TailBlazor.Toast/Configuration/ToastInstance.cs @@ -7,6 +7,6 @@ internal class ToastInstance { public Guid Id { get; set; } public DateTime TimeStamp { get; set; } - public ToastSettings ToastSettings { get; set; } + public ToastSettings ToastSettings { get; set; } = default!; } } \ No newline at end of file diff --git a/src/TailBlazor.Toast/Configuration/ToastSettings.cs b/src/TailBlazor.Toast/Configuration/ToastSettings.cs index f39ee07..621bf1f 100644 --- a/src/TailBlazor.Toast/Configuration/ToastSettings.cs +++ b/src/TailBlazor.Toast/Configuration/ToastSettings.cs @@ -34,9 +34,9 @@ public ToastSettings( IncludeIcons = includeIcons; } - public string Heading { get; set; } - public RenderFragment Message { get; set; } - public string Class { get; set; } + public string? Heading { get; set; } + public RenderFragment Message { get; set; } = default!; + public string? Class { get; set; } public HeroIcons.HeroIcon? Icon { get; set; } public HeroIcons.IconStyle? IconStyle { get; set; } public bool ShowProgressBar { get; set; } diff --git a/src/TailBlazor.Toast/CountdownTimer.cs b/src/TailBlazor.Toast/CountdownTimer.cs index 6533749..f63c363 100644 --- a/src/TailBlazor.Toast/CountdownTimer.cs +++ b/src/TailBlazor.Toast/CountdownTimer.cs @@ -5,13 +5,13 @@ namespace TailBlazor.Toast { internal class CountdownTimer : IDisposable { - private Timer _timer; - private int _timeout; - private int _countdownTotal; + private Timer? _timer; + private readonly int _timeout; + private readonly int _countdownTotal; private int _percentComplete; - internal Action OnTick; - internal Action OnElapsed; + internal Action? OnTick; + internal Action? OnElapsed; internal CountdownTimer(int timeout) { @@ -23,11 +23,12 @@ internal CountdownTimer(int timeout) internal void Start() { - _timer.Start(); + _timer?.Start(); } private void SetupTimer() { + _timer?.Dispose(); _timer = new Timer(_timeout); _timer.Elapsed += HandleTick; _timer.AutoReset = false; @@ -51,6 +52,11 @@ private void HandleTick(object sender, ElapsedEventArgs args) public void Dispose() { + if (_timer is null) + { + return; + } + _timer.Dispose(); _timer = null; } diff --git a/src/TailBlazor.Toast/ServiceCollectionExtensions.cs b/src/TailBlazor.Toast/ServiceCollectionExtensions.cs index 0ee1aa9..6021603 100644 --- a/src/TailBlazor.Toast/ServiceCollectionExtensions.cs +++ b/src/TailBlazor.Toast/ServiceCollectionExtensions.cs @@ -7,13 +7,17 @@ namespace TailBlazor.Toast { public static class ServiceCollectionExtensions { - public static IServiceCollection AddTailBlazorToast(this IServiceCollection services, Action? configureOptions = null ) + public static IServiceCollection AddTailBlazorToast(this IServiceCollection services, Action? configureOptions = null) { - services.Configure(options => - { - options.IncludeIcons = true; - configureOptions?.Invoke(options); - }); + ArgumentNullException.ThrowIfNull(services); + + services.AddOptions() + .Configure(options => + { + options.IncludeIcons = true; + configureOptions?.Invoke(options); + }); + return services.AddScoped(); } } diff --git a/src/TailBlazor.Toast/Services/IToastService.cs b/src/TailBlazor.Toast/Services/IToastService.cs index 3346151..55d0fbe 100644 --- a/src/TailBlazor.Toast/Services/IToastService.cs +++ b/src/TailBlazor.Toast/Services/IToastService.cs @@ -10,11 +10,11 @@ public interface IToastService /// /// Toast configuration options /// - public ToastOptions _options { get; } + public ToastOptions Options { get; } /// /// A event that will be invoked when showing a toast /// - event Action OnShow; + event Action? OnShow; /// /// Shows a toast using the supplied fragment diff --git a/src/TailBlazor.Toast/Services/ToastService.cs b/src/TailBlazor.Toast/Services/ToastService.cs index 1750f7b..9d6a184 100644 --- a/src/TailBlazor.Toast/Services/ToastService.cs +++ b/src/TailBlazor.Toast/Services/ToastService.cs @@ -11,7 +11,7 @@ public class ToastService : IToastService /// /// Toast configuration options /// - public ToastOptions _options { get; set; } + public ToastOptions Options { get; } /// /// ToastService parameterized constructor @@ -19,7 +19,7 @@ public class ToastService : IToastService /// Toast configuration options public ToastService(IOptions options) { - _options = options.Value; + Options = options.Value; } /// /// A event that will be invoked when showing a toast @@ -29,13 +29,13 @@ public ToastService(IOptions options) /// /// A event that will be invoked when showing a toast /// - public event Action OnShow; + public event Action? OnShow; /// /// Shows a toast using the fragment /// /// RenderFragment of toast to display - public void ShowToast(RenderFragment toast) => OnShow?.Invoke(ToastLevel.Custom, toast, String.Empty, null); + public void ShowToast(RenderFragment toast) => OnShow?.Invoke(ToastLevel.Custom, toast, string.Empty, null); /// /// Shows a toast using the supplied settings diff --git a/src/TailBlazor.Toast/TailBlazor.Toast.csproj b/src/TailBlazor.Toast/TailBlazor.Toast.csproj index 6f859f1..50717e3 100644 --- a/src/TailBlazor.Toast/TailBlazor.Toast.csproj +++ b/src/TailBlazor.Toast/TailBlazor.Toast.csproj @@ -1,45 +1,45 @@ - - - - net5.0 - TailBlazor.Toast - TailBlazor.Toast - 1.1.3 - Taylor Watson - true - Blazor; TailBlazorcss; TailBlazor css; tailwind; tailwindcss; toast; toasts; - true - snupkg - MIT - https://github.com/TailBlazor/Toast - git - https://github.com/TailBlazor/Toast - - A shell toast system that's base uses TailBlazorcss 2.0. It's heavily inspired off Chris Sainty's Blazored.Toast and all credit goes to him for core functionality. This toast service has no styles, or content. You inject an entire renderfragment into the "ShowToast()" method to be able to create 100% customizable toasts. Finally the ability to create truly interactive toasts and not be limited to: info, success, etc. - - true - true - true - logo.png - MIT - - - - - - - - - - - - - - assets - - - assets - - - - + + + + net9.0 + enable + enable + TailBlazor.Toast + TailBlazor.Toast + 1.1.3 + Taylor Watson + true + Blazor; TailBlazorcss; TailBlazor css; tailwind; tailwindcss; toast; toasts; + true + snupkg + MIT + https://github.com/TailBlazor/Toast + git + https://github.com/TailBlazor/Toast + + A shell toast system that's base uses TailBlazorcss 2.0. It's heavily inspired off Chris Sainty's Blazored.Toast and all credit goes to him for core functionality. This toast service has no styles, or content. You inject an entire renderfragment into the "ShowToast()" method to be able to create 100% customizable toasts. Finally the ability to create truly interactive toasts and not be limited to: info, success, etc. + + true + true + logo.png + + + + + + + + + + + + + + assets + + + assets + + + + diff --git a/src/TailBlazor.Toast/TailBlazorToast.razor b/src/TailBlazor.Toast/TailBlazorToast.razor index 45779a9..963bca2 100644 --- a/src/TailBlazor.Toast/TailBlazorToast.razor +++ b/src/TailBlazor.Toast/TailBlazorToast.razor @@ -1,16 +1,17 @@ @using Microsoft.AspNetCore.Components.Web @using TailBlazor.Toast.Configuration @namespace TailBlazor.Toast +@attribute [RenderModeInteractiveAuto]
- + @if (ToastSettings.Level == Services.ToastLevel.Custom) { @(ToastSettings.Message) } else { -
+
@if (ToastSettings.IncludeIcons) { @@ -23,7 +24,7 @@

@(ToastSettings.Message)

-