Component
Stepper
A pill-shaped pair of minus/plus buttons, with an optional value displayed between them, bounded by a min and max.
The primitive
1
stepper.tsx
<NativeStepper value={value} onValueChange={setValue} min={1} max={10} showValue />Example
Attached to a row in an order summary, adjusting quantity without needing a separate input field.
Quantity
1
stepper-example.tsx
<NativeRow label="Quantity" right={<NativeStepper value={value} onValueChange={setValue} min={1} max={10} showValue />} />Capabilities
| Prop | Type | Description |
|---|---|---|
| valuerequired | number | — |
| onValueChangerequired | (value: number) => void | — |
| min | number | — |
| max | number | — |
| step | number | — |
| disabled | boolean | — |
| showValue | boolean | Show the current value between the +/- buttons |
| className | string | — |