HxMessenger #

HxToastContainer wrapper for displaying HxToast messages dispatched through IHxMessengerService.

Component is using IHxMessengerService injected service.

Informational messages are automatically hidden after 5 seconds, warning and error messages remain visible until manually closed.

Basic usage #

<HxButton Text="Show information" OnClick="HandleAddInformationButtonClick" Color="ThemeColor.Primary" />
<HxButton Text="Show warning" OnClick="HandleAddWarningButtonClick" Color="ThemeColor.Warning" />
<HxButton Text="Show error" OnClick="HandleAddErrorButtonClick" Color="ThemeColor.Danger" />

@code {
	[Inject] protected IHxMessengerService Messenger { get; set; }

	private void HandleAddInformationButtonClick()
	{
		Messenger.AddInformation(title: "Data encrypted", message: "All your data has been encrypted. To decrypt your data share $100 with all your teammates.");
	}

	private void HandleAddWarningButtonClick()
	{
		Messenger.AddWarning(title: "Bio hazard!", message: "Bio hazard detected in your office!");
	}

	private void HandleAddErrorButtonClick()
	{
		Messenger.AddError(title: "Error", message: "An error occurred during showing messenger message.");
	}
}

You should place the HxMessenger component itself in the layout component (MainLayout.razor) to make it work!

@inherits LayoutComponentBase

<HxMessenger Position="ToastContainerPosition.TopEnd" />

@Body

Call services.AddHxMessenger() in Startup.cs to set up related services.

public void ConfigureServices(IServiceCollection services)
{
	// ...
	services.AddHxMessenger();
	// ...
}

Clearing messages #

Use the messenger.Clear() method (IHxMessengerService) if you want all messages to disappear immediately.

API #

Parameters #

Name Type Description
CssClass string Additional CSS class.
Position ToastContainerPosition Position of the messages. The default value is ToastContainerPosition.None.
An unhandled error has occurred. Reload 🗙