Component · Containers
a horizontal switch between sibling views; tab-list coordinates its tabs.
Example
Where available
Using it
the same component, named idiomatically per target. one CSS contract underneath, so they render identically.
| Target | Reference | Package |
|---|---|---|
| React | <TabList> | @design-foundry/lucent-react |
| Angular | <lucent-tab-list> | @design-foundry/lucent |
| Web Components | <lucent-tab-list> | @design-foundry/lucent-wc |
| Blazor | <LucentTabList> | DesignFoundry.Lucent |
API
| Prop | Type | Default | Description |
|---|---|---|---|
| tab-list · active-tab | string | — | value of the active tab. |
| tab · value | string | — | identity emitted on change. |
| tab · label / icon | string | — | tab content. |
| tab · disabled | boolean | false | non-selectable. |