Components
NumericStepper
A numeric stepper allows you to select a quantity of something, such as the number of adult tickets or bikes.
Code examples
<NumericStepper />
Guidelines
A numeric stepper is a component used to make it easy to select a quantity of something. A typical example is the number of tickets of a given type or the number of stroller spots one wishes to reserve.
You can click on the number to enter a value manually if desired, or use the arrow keys to increase or decrease the value.
Code
<NumericStepper />
import { NumericStepper } from "@vygruppen/spor-react";
Props
Name | Type | Required? | Description |
|---|---|---|---|
name | string | The name of the input field | |
value | number | The controlled value | |
onChange | (nextValue: number) => void | Callback for when the value changes via buttons or input field | |
minValue | number | Defaults to 0 | |
maxValue | number | Defaults to 99 | |
stepSize | number | The amount to increment or decrement by. Defaults to 1. | |
showZero | boolean | Whether to display the number 0 when the value is 0. Defaults to false. | |
disabled | boolean | ||
invalid | boolean |