{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "slider",
  "dependencies": [
    "@base-ui/react"
  ],
  "files": [
    {
      "path": "registry/default/ui/slider.tsx",
      "content": "\"use client\";\n\nimport { Slider as SliderPrimitive } from \"@base-ui/react/slider\";\nimport * as React from \"react\";\nimport { cn } from \"@/registry/default/lib/utils\";\n\nexport function Slider({\n  className,\n  children,\n  defaultValue,\n  value,\n  min = 0,\n  max = 100,\n  ...props\n}: SliderPrimitive.Root.Props): React.ReactElement {\n  const _values = React.useMemo(() => {\n    if (value !== undefined) {\n      return Array.isArray(value) ? value : [value];\n    }\n    if (defaultValue !== undefined) {\n      return Array.isArray(defaultValue) ? defaultValue : [defaultValue];\n    }\n    return [min];\n  }, [value, defaultValue, min]);\n\n  return (\n    <SliderPrimitive.Root\n      className={cn(\"data-[orientation=horizontal]:w-full\", className)}\n      defaultValue={defaultValue}\n      max={max}\n      min={min}\n      thumbAlignment=\"edge\"\n      value={value}\n      {...props}\n    >\n      {children}\n      <SliderPrimitive.Control\n        className=\"flex touch-none select-none data-disabled:pointer-events-none data-[orientation=vertical]:h-full data-[orientation=vertical]:min-h-44 data-[orientation=horizontal]:w-full data-[orientation=horizontal]:min-w-44 data-[orientation=vertical]:flex-col data-disabled:opacity-64\"\n        data-slot=\"slider-control\"\n      >\n        <SliderPrimitive.Track\n          className=\"relative grow select-none before:absolute before:rounded-full before:bg-input data-[orientation=horizontal]:h-1 data-[orientation=vertical]:h-full data-[orientation=horizontal]:w-full data-[orientation=vertical]:w-1 data-[orientation=horizontal]:before:inset-x-0.5 data-[orientation=vertical]:before:inset-x-0 data-[orientation=horizontal]:before:inset-y-0 data-[orientation=vertical]:before:inset-y-0.5\"\n          data-slot=\"slider-track\"\n        >\n          <SliderPrimitive.Indicator\n            className=\"select-none rounded-full bg-primary data-[orientation=horizontal]:ms-0.5 data-[orientation=vertical]:mb-0.5\"\n            data-slot=\"slider-indicator\"\n          />\n          {Array.from({ length: _values.length }, (_, index) => (\n            <SliderPrimitive.Thumb\n              className=\"block size-5 shrink-0 select-none rounded-full border border-input bg-white not-dark:bg-clip-padding shadow-xs/5 outline-none transition-[box-shadow,scale] before:absolute before:inset-0 before:rounded-full before:shadow-[0_1px_--theme(--color-black/4%)] has-focus-visible:ring-[3px] has-focus-visible:ring-ring/24 data-dragging:scale-120 sm:size-4 dark:border-background dark:has-focus-visible:ring-ring/48 [:has(*:focus-visible),[data-dragging]]:shadow-none\"\n              data-slot=\"slider-thumb\"\n              index={index}\n              key={String(index)}\n            />\n          ))}\n        </SliderPrimitive.Track>\n      </SliderPrimitive.Control>\n    </SliderPrimitive.Root>\n  );\n}\n\nexport function SliderValue({\n  className,\n  ...props\n}: SliderPrimitive.Value.Props): React.ReactElement {\n  return (\n    <SliderPrimitive.Value\n      className={cn(\"flex justify-end text-sm\", className)}\n      data-slot=\"slider-value\"\n      {...props}\n    />\n  );\n}\n\nexport { SliderPrimitive };\n",
      "type": "registry:ui"
    }
  ],
  "type": "registry:ui"
}