snapshot of https://github.com/shadcn-ui/ui.git (main, 2026-09-15; blobs > 131072B omitted)

apps/v4/content/docs/components/radix/slider.mdx

@@ -0,0 +1,101 @@
+---
+title: Slider
+description: An input where the user selects a value from within a given range.
+base: radix
+component: true
+links:
+  doc: https://www.radix-ui.com/docs/primitives/components/slider
+  api: https://www.radix-ui.com/docs/primitives/components/slider#api-reference
+---
+
+<ComponentPreview styleName="radix-nova" name="slider-demo" />
+
+## Installation
+
+<CodeTabs>
+
+<TabsList>
+  <TabsTrigger value="cli">Command</TabsTrigger>
+  <TabsTrigger value="manual">Manual</TabsTrigger>
+</TabsList>
+<TabsContent value="cli">
+
+```bash
+npx shadcn@latest add slider
+```
+
+</TabsContent>
+
+<TabsContent value="manual">
+
+<Steps className="mb-0 pt-2">
+
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install radix-ui
+```
+
+<Step>Copy and paste the following code into your project.</Step>
+
+<ComponentSource
+  name="slider"
+  title="components/ui/slider.tsx"
+  styleName="radix-nova"
+/>
+
+<Step>Update the import paths to match your project setup.</Step>
+
+</Steps>
+
+</TabsContent>
+
+</CodeTabs>
+
+## Usage
+
+```tsx
+import { Slider } from "@/components/ui/slider"
+```
+
+```tsx
+<Slider defaultValue={[33]} max={100} step={1} />
+```
+
+## Range
+
+Use an array with two values for a range slider.
+
+<ComponentPreview styleName="radix-nova" name="slider-range" />
+
+## Multiple Thumbs
+
+Use an array with multiple values for multiple thumbs.
+
+<ComponentPreview styleName="radix-nova" name="slider-multiple" />
+
+## Vertical
+
+Use `orientation="vertical"` for a vertical slider.
+
+<ComponentPreview styleName="radix-nova" name="slider-vertical" />
+
+## Controlled
+
+<ComponentPreview styleName="radix-nova" name="slider-controlled" />
+
+## Disabled
+
+Use the `disabled` prop to disable the slider.
+
+<ComponentPreview styleName="radix-nova" name="slider-disabled" />
+
+## RTL
+
+To enable RTL support in shadcn/ui, see the [RTL configuration guide](/docs/rtl).
+
+<ComponentPreview styleName="radix-nova" name="slider-rtl" direction="rtl" />
+
+## API Reference
+
+See the [Radix UI Slider](https://www.radix-ui.com/docs/primitives/components/slider#api-reference) documentation.