- bit BlazorUI
Home Docs

MessageBar

A banner (MessageBar) displays errors, warnings, or important information about an open app or file. For example, if a file failed to upload an error message bar should appear.

Usage

Basic
Different types of BitMessageBar.
Info (default) MessageBar. Visit our website.
Success MessageBar. Visit our website.
Warning MessageBar. Visit our website.
Customization
There are multiple options to customize.
Dismiss option enabled by adding OnDismiss parameter.
MessageBar with single line and action buttons.MessageBar with single line and action buttons.
MessageBar defaults to multiline. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi luctus, purus a lobortis tristique, odio augue pharetra metus, ac placerat nunc mi nec dui. Vestibulum aliquam et nunc semper scelerisque. Curabitur vitae orci nec quam condimentum porttitor et sed lacus. Vivamus ac efficitur leo. Cras faucibus mauris libero, ac placerat erat euismod et. Donec pulvinar commodo odio sit amet faucibus. In hac habitasse platea dictumst. Duis eu ante commodo, condimentum nibh pellentesque, laoreet enim. Fusce massa lorem, ultrices eu mi a, fermentum suscipit magna. Integer porta purus pulvinar, hendrerit felis eget, condimentum mauris.
RTL
اطلاعات (پیش فرض) نوار پیام. به وبسایت ما سر بزنید.
نوار پیام موفق. به وبسایت ما سر بزنید.
نوار پیام هشدار. به وبسایت ما سر بزنید.

Implementation

BitMessageBar parameters
Name
Type
Default value
Description
Actions RenderFragment? null The content of the action to show on the message bar.
ChildContent RenderFragment? null The content of message bar.
DismissButtonAriaLabel string? null Aria label on dismiss button if onDismiss is defined.
IsMultiline bool true Determines if the message bar is multi lined. If false, and the text overflows over buttons or to another line, it is clipped.
MessageBarType BitMessageBarType BitMessageBarType.Info The type of message bar to render.
DismissIconName string Clear Custom Fabric icon name to replace the dismiss icon. If unset, default will be the Fabric Clear icon.
MessageBarIconName string? null Custom icon to replace the message bar icon. If unset, default will be the icon set by messageBarType.
OnDismiss EventCallback Whether the message bar has a dismiss button and its callback. If null, dismiss button won't show.
OverflowButtonAriaLabel string? null Aria label on overflow button if truncated is true.
Role string? null Custom role to apply to the message bar.
Truncated bool false Determines if the message bar text is truncated. If true, a button will render to toggle between a single line view and multiline view. This parameter is for single line message bars with no buttons only in a limited space scenario.
BitComponentBase parameters
Name
Type
Default value
Description
AriaLabel string? null The aria-label of the control for the benefit of screen readers.
Class string? null Custom CSS class for the root element of the component.
Dir BitDir? null Determines the component direction.
HtmlAttributes Dictionary<string, object> new Dictionary<string, object>() Capture and render additional attributes in addition to the component's parameters.
Id string? null Custom id attribute for the root element. if null the UniqueId will be used instead.
IsEnabled bool true Whether or not the component is enabled.
Style string? null Custom CSS style for the root element of the component.
Visibility BitVisibility BitVisibility.Visible Whether the component is visible, hidden or collapsed.
BitComponentBase public members
Name
Type
Default value
Description
UniqueId Guid Guid.NewGuid() The readonly unique id of the root element. it will be assigned to a new Guid at component instance construction.
RootElement ElementReference The ElementReference of the root element.
BitMessageBarType enum
Name
Value
Description
Info 0 Info styled MessageBar.
Warning 1 Warning styled MessageBar.
Error 2 Error styled MessageBar.
Blocked 3 Blocked styled MessageBar.
SevereWarning 4 SevereWarning styled MessageBar.
Success 5 Success styled MessageBar.
BitVisibility enum
Name
Value
Description
Visible 0 The content of the component is visible.
Hidden 1 The content of the component is hidden, but the space it takes on the page remains (visibility:hidden).
Collapsed 2 The component is hidden (display:none).
BitDir enum
Name
Value
Description
Ltr 0 Ltr (left to right) is to be used for languages that are written from the left to the right (like English).
Rtl 1 Rtl (right to left) is to be used for languages that are written from the right to the left (like Arabic).
Auto 2 Auto lets the user agent decide. It uses a basic algorithm as it parses the characters inside the element until it finds a character with a strong directionality, then applies that directionality to the whole element.