Toasts

This documentation provides a comprehensive reference for the Toasts component, guiding you through its configuration options.
Demos

Screenshot #

Blazor Toasts Component

Toasts Parameters #

Name Type Default Required Description Added Version
AdditionalAttributes Dictionary<string, object>? null Gets or sets additional attributes that will be applied to the component. 1.0.0
AutoHide bool False Gets or sets the auto hide state. 1.0.0
Class string? null Gets or sets the CSS class name(s) to apply to the component. 1.0.0
Delay int 5000 Gets or sets the delay in milliseconds before hiding the toast. 1.0.0
Id string? null Gets or sets the ID. If not set, a unique ID will be generated. 1.0.0
Messages List<ToastMessage>? null Gets or sets the toast messages. 1.0.0
Placement ToastsPlacement TopRight Gets or sets the toast placement. 1.0.0
ShowCloseButton bool True If true, shows the close button. 1.0.0
StackLength int 5 Gets or sets the toast container maximum capacity. When the limit is exceeded, the oldest rendered toasts are dismissed first. 1.0.0
Style string? null Gets or sets the CSS style string that defines the inline styles for the component. 1.0.0

ToastsPlacement Enum #

Name Value Description Added Version
TopLeft 0 Top left 1.0.0
TopCenter 1 Top center 1.0.0
TopRight 2 Top right 1.0.0
MiddleLeft 3 Middle left 1.0.0
MiddleCenter 4 Middle center 1.0.0
MiddleRight 5 Middle right 1.0.0
BottomLeft 6 Bottom left 1.0.0
BottomCenter 7 Bottom center 1.0.0
BottomRight 8 Bottom right 1.0.0

ToastMessage Properties #

Name Type Default Required Description Added Version
AutoHide bool False Gets or sets a value indicating whether the Toast should automatically hide. 1.0.0
Content RenderFragment? null Gets or sets the UI content to be rendered within the component. 1.0.0
CustomIconName string? null Specify custom icons of your own, like fontawesome. Example: 'fas fa-alarm-clock' 1.0.0
HelpText string? null Gets or sets the help text associated with this element. 1.0.0
IconName IconName None Gets or sets the icon to display for the associated element. 1.0.0
Message string? null Gets or sets the message content associated with this instance. 1.0.0
Title string? null Gets or sets the title associated with the object. 1.0.0
Type ToastType Primary Gets or sets the type of toast notification to display. 1.0.0

ToastType Enum #

Name Value Description Added Version
Primary 1 Sets the primary background color to the toast. 1.0.0
Secondary 2 Sets the secondary background color to the toast. 1.0.0
Success 3 Sets the success background color to the toast. 1.0.0
Danger 4 Sets the danger background color to the toast. 1.0.0
Warning 5 Sets the warning background color to the toast. 1.0.0
Info 6 Sets the info background color to the toast. 1.0.0
Light 7 Sets the light background color to the toast. 1.0.0
Dark 8 Sets the dark background color to the toast. 1.0.0

Rejoining the server...

Rejoin failed... trying again in seconds.

Failed to rejoin.
Please retry or reload the page.

The session has been paused by the server.

Failed to resume the session.
Please reload the page.