Tabs
Tabs organize content across different screens, data sets, and other interactions.
Basic
<me-tabs value="one">
<me-tab value="one" label="Item One"></me-tab>
<me-tab value="two" label="Item Two"></me-tab>
<me-tab value="three" label="Item Three"></me-tab>
</me-tabs>
Centered
Full Width
On Colored Background (App Bar style)
Secondary Indicator Color
Disabled Tab
API — Tabs
| Attribute | Type | Default | Description |
|---|
value | string | — | The value of the currently selected tab. |
variant | standard | scrollable | fullWidth | standard | Layout variant. |
centered | boolean | false | Center the tab list. |
indicator-color | primary | secondary | inherit | primary | Ink bar color. Use inherit for colored backgrounds. |
API — Tab
| Attribute | Type | Default | Description |
|---|
value | string | index | Value passed to parent Tabs on selection. |
label | string | — | Tab label text (or use slot content). |
disabled | boolean | false | Disables the tab. |
Events
| Event | Detail | Description |
|---|
me-change | { value } | Fired on the Tabs element when the selected tab changes. |
