Component
Stepper
A pill-shaped pair of minus/plus buttons, with an optional value displayed between them, bounded by a min and max.
Standalone
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 | - |