Back to Tabs
View full API on Tabs
Tabs
Visual variants
Underline and pill tab strips.
Underline variant panel.
Pill variant panel.
API
| Prop | Type | Default | Description |
|---|---|---|---|
| tabs | TabItem[] | — | Tab definitions with title, content, disabled, icon, and badge. |
| activeTab / defaultActiveTab | number | — | Controlled / uncontrolled active tab index. |
| onTabChange | (index: number) => void | — | Fires when the active tab changes. |
| variant | "underline" | "pill" | "outline" | pill | Visual style for the tab strip. |
| orientation | "horizontal" | "vertical" | horizontal | Tab list layout; switches arrow-key axis. |
| fullHeader | boolean | false | Stretch tabs to fill the header width. |
| firstLastNavControl | boolean | false | Show jump-to-first/last tab buttons. |
| className | string | — | Merged onto the root tabs container. |
| id (TabItem) | string | — | Optional stable id for the tab panel. |
| iconClassName (TabItem) | string | — | Extra classes on the tab icon. |
| badgeVariant (TabItem) | Badge variant | — | Visual style for the tab count badge. |