HxMessageBox #

Component for displaying message boxes.
Usually used via HxMessageBoxService and HxMessageBoxHost.

HxMessageBox is an implementation component that you use directly only in rare specific cases.
Usually, you use the message box by using the IHxMessageBoxService injected service and its ShowAsync method (or derived extension methods).

Basic usage #

Inject the IHxMessageBoxService into your code and use one of its methods to raise the message box:

Task<MessageBoxButtons> ShowAsync(MessageBoxRequest request) - original method
Task<MessageBoxButtons> ShowAsync(string title, string text, MessageBoxButtons buttons = MessageBoxButtons.Ok, MessageBoxButtons? primaryButton = null, string customButtonText = null) - extension method
Task<bool> ConfirmAsync(string title, string text) - extension method
...or you can add your own extension method

ShowAsync result: None
Confirm result:

@* <HxMessageBoxHost /> is in MainLayout.razor *@

<p>
	<HxButton Text="MessageBox.ShowAsync()..." OnClick="OpenMessageBox" Color="ThemeColor.Primary" />
	<HxButton Text="MessageBox.Confirm()..." OnClick="OpenConfirm" Color="ThemeColor.Primary" />
</p>

<p>
	ShowAsync result: @showResult.ToString("g")<br />
	Confirm result: @confirmResult
</p>

@code
{
	[Inject] protected IHxMessageBoxService MessageBox { get; set; }

	private MessageBoxButtons showResult;
	private bool? confirmResult;

	private async Task OpenMessageBox()
	{
		showResult = await MessageBox.ShowAsync("Info", "This is the text", MessageBoxButtons.OkCancel);
	}

	private async Task OpenConfirm()
	{
		confirmResult = await MessageBox.ConfirmAsync("Confirm", "Do you really want to ...?");
	}
}

Required setup #

You should place the HxMessageBoxHost component in MainLayout.razor (or App.razor) to make it work!

@inherits LayoutComponentBase

<HxMessageBoxHost />

@Body

Register the required services using services.AddHxMessageBoxHost() from Startup.cs (Blazor Server) or Program.cs (Blazor WebAssembly).

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

Customization #

Customize the message box appearance and behavior by using the MessageBoxRequest and its Settings property. This allows you to set custom button texts, define a unique header, and more to suit your specific requirements.

No heading #

If you clear the Title, HeaderTemplate, and set ShowCloseButton="false", the header won't show up.

API #

Parameters #

Name	Type	Description
AdditionalAttributes	`Dictionary<string, object>`	Additional attributes to be splatted onto an underlying `HxModal`.
BodyTemplate	`RenderFragment`	Body (content) template.
Buttons	`MessageBoxButtons`	Buttons to show. The default is `MessageBoxButtons.Ok`.
CustomButtonText	`string`	Text for `MessageBoxButtons.Custom`.
HeaderTemplate	`RenderFragment`	Header template (Header).
ModalSettings	`ModalSettings`	Settings for the underlying `HxModal` component.
PrimaryButton	`MessageBoxButtons?`	Primary button (if you want to override the default).
PrimaryButtonSettings	`ButtonSettings`	Settings for the dialog primary button.
SecondaryButtonSettings	`ButtonSettings`	Settings for dialog secondary button(s).
Settings	`MessageBoxSettings`	Set of settings to be applied to the component instance (overrides `Defaults`, overridden by individual parameters).
ShowCloseButton	`bool?`	Indicates whether to show the close button. The default is taken from the underlying `HxModal` (`true`).
Text	`string`	Content (body) text.
Title	`string`	Title text (Header).

Event callbacks #

Name	Type	Description
OnClosed	`EventCallback<MessageBoxButtons>`	Raised when the message box gets closed. Returns the button clicked.

Methods #

Method	Returns	Description
ShowAsync()	`Task`	Displays the message box.

Static properties #

Property	Type	Description
Defaults	`MessageBoxSettings`	Application-wide defaults for `HxButton` and derived components.

HxMessageBoxHost #

Displays message boxes initiated through IHxMessageBoxService. To be placed in the root application component / main layout.