Components / Actions
SegmentedControl
A compact single-choice switch (radiogroup) with arrow-key navigation.
@ruckc/truss-ui Actions
Import
import { SegmentedControl } from '@ruckc/truss-ui';Playground
size
value
API
| Prop | Type | Default | Description |
|---|---|---|---|
options required | { value: string; label?: string; ariaLabel?: string; icon?: IconSource; disabled?: boolean }[] | — | Name for icon-only options (defaults to the value). |
value bindable | string | — | The current value. Bind it with `bind:value`. |
size | 'sm' | 'md' | 'md' | Control size: `sm` (24px), `md` (32px, default) or `lg` (40px). |
fill | boolean | false | Stretch to fill the available width. |
label | string | 'Options' | Visible label shown above the control. |