{"$schema":"https://ui.shadcn.com/schema/registry-item.json","name":"corded-slider","title":"Corded Slider","description":"A Discord-inspired range slider with label and value.","dependencies":["@base-ui/react"],"registryDependencies":["utils","corded-theme"],"files":[{"path":"registry/default/ui/corded-slider.tsx","content":"\"use client\"\n\nimport * as React from \"react\"\nimport { Slider } from \"@base-ui/react/slider\"\n\nimport { cn } from \"@/lib/utils\"\n\nexport type CordedSliderProps = Slider.Root.Props & { label?: string; className?: string }\n\nexport function CordedSlider({ label, className, ...props }: CordedSliderProps) {\n  return <Slider.Root className={cn(\"mana-field gap-3\", className)} {...props}>{label ? <div className=\"flex items-center justify-between\"><Slider.Label className=\"mana-field-label mana-text-sm-semibold\">{label}</Slider.Label><Slider.Value className=\"mana-character-count mana-text-xs-normal rounded-[var(--radius-xs)] bg-[var(--background-mod-subtle)] px-2 py-1\" /></div> : null}<Slider.Control className=\"flex h-5 touch-none items-center\"><Slider.Track className=\"relative h-2 w-full rounded-full bg-[var(--control-secondary-background-default)]\"><Slider.Indicator className=\"rounded-full bg-[var(--control-primary-background-default)]\" /><Slider.Thumb className=\"size-5 rounded-full border-4 border-[var(--background-base-low)] bg-[var(--control-primary-text-default)] shadow-[var(--shadow-low)] outline-none transition-transform hover:scale-110 focus-visible:outline-2 focus-visible:outline-[var(--border-focus)]\" /></Slider.Track></Slider.Control></Slider.Root>\n}\n","type":"registry:ui","target":"components/ui/corded-slider.tsx"}],"type":"registry:ui"}