Slider

Playground

Verwende <Slider />, um einen Slider darzustellen.

Dem Slider können optional ein Min-, Max- und Default-Wert sowie die Step-Größe mitgegeben werden. Der Default-Wert kann über das Property showInitialMarker auf dem Slider markiert werden. Außerdem werden diverse Formate und Einheiten unterstützt (s. Intel.NumberFormat ).

import {
  Label,
  Slider,
} from "@mittwald/flow-react-components";

<Slider
  formatOptions={{
    style: "unit",
    unit: "gigabyte",
  }}
  minValue={50}
  maxValue={750}
  defaultValue={150}
  step={50}
  showInitialMarker
>
  <Label>Speicherplatz</Label>
</Slider>

Kombiniere mit ...

React Hook Form

Weitere Details zur Formularlogik und -validierung sind in der Component Form (React Hook Form) zu finden.