Navigation

Tabs

Inline page-level tabs with an underline accent and optional badges for counts. Controlled: pass the active id and an onchange handler.

Basic

Active tab: all

The active tab's count takes the same light brand tint as every other brand chip and reads at 4.5:1 or better in both themes.

Prop	Type	Default	Description
`items` required	`Array<{ id, label, count? }>`	no default	Tab definitions. id is the value passed to onchange. Count is rendered as a soft badge.
`active` required	`string`	no default	The currently selected tab id.
`onchange` required	`(id: string) => void`	no default	Fires when the user selects a tab.
`inHeader`	`boolean`	`false`	For a strip in a SplitPane's header row: it draws no rule of its own and its tabs take the row's height.
`class`	`string`	no default	Extra classes on the wrapper.