SegmentedControl

One choice out of a few, shown as a joined strip of options. Real radios under the hood — no JavaScript.

Example

Date range

DayWeekMonth

<SegmentedControl name="range" label="Date range" options={["Day", "Week", "Month"]} />

Prop	Type	Default	Description
`name`	`string`	-	Shared radio name; message ids derive from it.
`label`	`string`	-	Legend text.
`options`	`Array<string \| { value; label; disabled? }>`	-	Options as strings or value/label objects.
`value`	`string`	first option	Initially checked value.
`hint / error`	`string`	-	Wired via `aria-describedby` on the fieldset.