Container for HxTab
s for easier implementation of tabbed UI.
Encapsulates HxNav
(NavVariant.Tabs
variant as default) and HxNavLink
s so you don't have to bother with them explicitly.
<HxTabPanel InitialActiveTabId="tab2">
<HxTab Title="First tab">
<Content>This is the first tab.</Content>
</HxTab>
<HxTab Id="tab2">
<TitleTemplate>Second tab</TitleTemplate>
<Content>This is the second tab. This tab is initially active.</Content>
</HxTab>
<HxTab Enabled="false">
<TitleTemplate>Disabled tab</TitleTemplate>
</HxTab>
</HxTabPanel>
You can choose any variant of nav
using the NavVariant
parameter.
NavVariant.Tabs
NavVariant.Pills
NavVariant.Standard
When RenderMode
is set to TabPanelRenderMode.Card
, then the tab navigation is placed in the card header and tab contents go into the card body.
Name | Type | Description |
---|---|---|
ActiveTabId | string |
ID of the active tab (@bindable). |
ActiveTabIdChanged | EventCallback<string> |
Raised when ID of the active tab changes. |
CardSettings | CardSettings |
Card settings for the wrapping card.
Applies only if RenderMode is set to TabPanelRenderMode.Card . |
ChildContent | RenderFragment |
Tabs. |
CssClass | string |
Additional CSS class. |
InitialActiveTabId | string |
ID of the tab which should be active at the very beginning. |
NavVariant | NavVariant |
The visual variant of the nav items.
Default is NavVariant.Tabs . |
RenderMode | TabPanelRenderMode |
Whether to wrap the tab panel in a card with the tab navigation in the header. |
Single tab for HxTabPanel
.
Name | Type | Description |
---|---|---|
Content | RenderFragment |
Content of the tab. |
ContentCssClass | string |
Additional CSS class(es) to be applied to the tab content (pane). |
Enabled | bool? |
When null (default), the Enabled value is received from cascading FormState .
When value is false , input is rendered as disabled.
To set multiple controls as disabled use |
Id | string |
ID of the tab (HxTabPanel.ActiveTabId ).
Autogenerated GUID if not set. |
Order | int |
The order (display index) of the tab. Due to stable sorting used, the order in which the tabs are rendered is preserved when the Order parameter is not set. |
Title | string |
Tab title. |
TitleCssClass | string |
CSS class(es) to be applied to the tab title (navigation). |
TitleTemplate | RenderFragment |
Tab title template. |
Visible | bool |
True for visible tab. Set false when tab should not be visible. |
Name | Type | Description |
---|---|---|
OnTabActivated | EventCallback |
Raised when the tab is activated. |
OnTabDeactivated | EventCallback |
Raised when the tab is deactivated (another tab is activates or when HxTabPanel is disposed). |