Slider
The slider is a bar that helps the user select a value (slider) or a range value within a preset range of values (ranger).
Usage
import { Slider } from "@momo-webplatform/mobase";
<Slider
defaultValue={[40]}
min={1}
max={50}
step={1}
minStepsBetweenThumbs={1}
/>
Note : use [valueFirst , valueSecond]
for type Ranger
API Reference
Slider
Prop | Type | Default | Required |
min | number | -- | false |
max | number | -- | false |
inverted | enumboolean | -- | false |
defaultValue | number[] | -- | false |
dir | enumDirection | -- | false |
asChild | enumboolean | -- | false |
name | string | -- | false |
disabled | enumboolean | -- | false |
orientation | enumhorizontal | vertical | -- | false |
step | number | -- | false |
minStepsBetweenThumbs | number | -- | false |
value | number[] | -- | false |
onValueChange | (value: number[]) => void | -- | false |
onValueCommit | (value: number[]) => void | -- | false |
Best practices
- Use a slider to allow users to select a range of values.