Slider
ფასის ერთი მნიშვნელობის ან დიაპაზონის არჩევა.
მაგალითი
import { Slider } from "@llc-conciergia/ui/slider";
<Slider
aria-label="ფასის დიაპაზონი"
defaultValue={[100, 300]}
min={50}
max={500}
step={10}
showValue
thumbLabels={["მინიმალური ფასი", "მაქსიმალური ფასი"]}
format={{ style: "currency", currency: "GEL", currencyDisplay: "narrowSymbol", maximumFractionDigits: 0 }}
className="w-64"
/>ინსტალაცია
pnpm add @llc-conciergia/uiimport { Slider } from "@llc-conciergia/ui/slider";npx @llc-conciergia/cli add slidernpx shadcn@latest add https://ui.conciergia.co/r/slider.jsonProps
| Prop | ტიპი | ნაგულისხმევი | აღწერა |
|---|---|---|---|
| Slider: value / defaultValue | number | readonly number[] | — | ერთი მნიშვნელობა ან დიაპაზონი. |
| Slider: onValueChange / onValueCommitted | Base UI callbacks | — | ცვლილება და საბოლოო მნიშვნელობა. |
| Slider: min / max / step | number | 0 / 100 / 1 | ქვედა/ზედა ზღვარი და ნაბიჯი. |
| Slider: orientation | horizontal | vertical | horizontal | მიმართულება. |
| Slider: showValue | boolean | false | ფორმატირებული მიმდინარე მნიშვნელობა. |
| Slider: format / locale | Intl.NumberFormatOptions / Intl.LocalesArgument | — | ფორმატირება; ენა მოდის LocaleProvider-იდან. |
| Slider: thumbLabels | string[] | — | დიაპაზონის თითოეული სახელურის სახელი. |
| Slider: aria-label / aria-labelledby | string | — | გადაეცემა ყველა სახელურს. |
| Slider: disabled / name / ref / className / … | Base UI Slider.Root props | — | Root-ის დანარჩენი ატრიბუტები. |