BPT

Tab

The BptTab component provides a tabbed interface with contained and bar modes, icon support, alignment options, tab positions, visibility control, and customizable styling.

Tab Parameters
#6c757d
#ffffff
Welcome Home

This tab demonstrates icon support alongside rich HTML content. Each tab can include any valid Blazor content as its body.

Icons are passed via the <Icon> render fragment and can be SVGs, icon fonts, or any markup.
Current Configuration
📋 [+]
<BptTab
    Mode="BptTabMode.Contained"
    Alignment="BptTabAlignment.Start"
    Position="BptTabPosition.Top"
    OnTabChanged="HandleTabChanged">
    <BptTabItem Text="Home">
        <Icon>...</Icon>
        <ChildContent>...</ChildContent>
    </BptTabItem>
    <BptTabItem Text="Profile">
        <Icon>...</Icon>
        <ChildContent>...</ChildContent>
    </BptTabItem>
    <BptTabItem Text="Conditional" Visible="true">...</BptTabItem>
    <BptTabItem Text="Settings">...</BptTabItem>
    <BptTabItem Text="Disabled" Enabled="false">...</BptTabItem>
</BptTab>

@code {
    private void HandleTabChanged(BptTabChangedEventArgs args)
    {
        Console.WriteLine($"Tab changed: index {args.TabIndex}, text {args.Text}");
    }
}
An unhandled error has occurred. Reload 🗙

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.