Tabs
Tabbed navigation component with keyboard support.
Basic Usage
Active:
overviewVariants
Default
Underline
Pills
With Badges
Full Width
Keyboard Navigation
- ArrowLeft / ArrowRight - Navigate between tabs
- Home - Go to first tab
- End - Go to last tab
Props
| Prop | Type | Default | Description |
|---|---|---|---|
tabs * | Array<{id, label, icon?, badge?, disabled?}> | - | Tab configuration array |
active | string | - | Active tab ID (bindable) |
variant | 'default' | 'underline' | 'pills' | 'default' | Visual style |
size | 'sm' | 'md' | 'lg' | 'md' | Tab size |
fullWidth | boolean | false | Stretch to fill container |
onchange | function | - | Called when tab changes |