Navigation

SegmentedControl

Radio group rendered as connected buttons sharing one rounded chassis. For binary or ternary mode toggles.

Examples

Selected: list

<SegmentedControl
  options={[
    {value: 'list', label: 'List'},
    {value: 'card', label: 'Cards'},
  ]}
  bind:value
  ariaLabel="Layout"
/>

Prop	Type	Default	Description
`options`	`{value, label, icon?, disabled?}[]`	`—`	Option definitions.
`value`	`T`	`—`	Bindable selected value.
`onChange`	`(next: T) => void`	`—`	Optional change callback.
`size`	`'sm' \| 'md'`	`'md'`	Height tier.
`ariaLabel`	`string`	`—`	Accessible label for the radiogroup.

CLI

npx @a3tai/mittsu add segmented-control