Forms
SegmentedControl
A segmented picker whose selected pill slides between equal-width segments on the emphasized curve.
SegmentedControl
import { SegmentedControl } from '@anomalia/ui'; Notes
- Equal-width segments mean the pill offset needs no measuring — it lands correctly before fonts load.
- For more than four options, use Tabs or a Select instead.
Examples
Basics
One pill slides between segments instead of each segment fading its own background — the travelling pill is what ties old and new selection together.
Selected: week · grid
API
| Prop | Type | Default | Description |
|---|---|---|---|
value | string | — | Bindable value. |
options | SegmentOption[] | — | `{ value, label, badge?, disabled? }`. |
fullWidth | boolean | false | Stretch to the container. |
Every component also forwards the native attributes of its root element, plus class, so anything not listed here still works.