Components / Navigation
Stepper
A multi-step progress indicator, horizontal or vertical.
@ruckc/truss-ui Navigation
Import
import { Stepper } from '@ruckc/truss-ui';Playground
orientation
current
API
| Prop | Type | Default | Description |
|---|---|---|---|
steps required | ({ id: string; label: string; description?: string; optional?: boolean; error?: boolean })[] | — | The steps: `{ id, label, description?, optional?, error? }[]`. |
current bindable | number | 0 | Zero-based active step. |
orientation | 'horizontal' | 'vertical' | 'horizontal' | Layout direction. |
clickable | boolean | true | Allow jumping back to completed steps. |
panel snippet | Snippet<[index: number, api: { next: () => void; prev: () => void; first: boolean; last: boolean }]> | — | Content for the active step, with navigation helpers. |