Tab-Leiste (Pills)
Segmentierte Pill-Tab-Leiste (Atlassian-Collections-Muster): Leiste auf sunken-Fläche, aktiver Tab als Secondary-Pill — progressive Links, optional zentriert
Beispiele
Segmentierte Pill-Tabs, aktiver Tab als Secondary-Pill
Eigenschaften
| Prop | Typ | Default | Builder-Label |
|---|---|---|---|
| items * | array | — | Tabs |
| centered | boolean | true | Zentriert |
* Pflicht-Prop
Stellschrauben (Komponenten-Tokens)
Ebene 3 — aus dem CSS generiert (Registry). Umverdrahtbar per Hüllen-Komposition, ohne Markup-Eingriff; künftige Regler-Quelle des Component Builders.
| Token | Default |
|---|---|
--tab-bar-action-on-secondary | var(--color-action-on-secondary) |
--tab-bar-action-secondary | var(--color-action-secondary) |
--tab-bar-focus-ring-color | var(--focus-ring-color) |
--tab-bar-focus-ring-offset | var(--focus-ring-offset) |
--tab-bar-focus-ring-width | var(--focus-ring-width) |
--tab-bar-radius-full | var(--radius-full) |
--tab-bar-surface-sunken | var(--color-surface-sunken) |
--tab-bar-text-default | var(--color-text-default) |
Genutzte Design-Tokens
color.action.on-secondarycolor.action.secondarycolor.surface.sunkencolor.text.defaultduration.fasteasing.standardfocus.ring-colorfocus.ring-offsetfocus.ring-widthfont.family.defaultradius.fullsize.1size.2size.6text.lgweight.medium