{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "jsonforms-slider-control",
  "description": "JSONForms slider renderer for numeric fields with minimum/maximum defined in schema.",
  "dependencies": [
    "@jsonforms/core",
    "@jsonforms/react"
  ],
  "registryDependencies": [
    "https://mksingh.dev/r/typography.json",
    "slider"
  ],
  "files": [
    {
      "path": "registry/forms/renderers/slider-control.tsx",
      "content": "import { useState } from 'react';\n\nimport { ControlProps, isRangeControl, rankWith } from '@jsonforms/core';\nimport { withJsonFormsControlProps } from '@jsonforms/react';\n\nimport Typography from '~/components/ui/typography';\nimport { Label } from '~/components/ui/label';\nimport { Slider } from '~/components/ui/slider';\nimport { shouldShowError } from '~/components/forms/utils';\n\nconst SliderControlRenderer = (props: ControlProps) => {\n    const { label, data, handleChange, path, visible, enabled, schema, errors, config } = props;\n    const [touched, setTouched] = useState(false);\n\n    if (!visible) return null;\n\n    const min = schema.minimum ?? 0;\n    const max = schema.maximum ?? 100;\n    const step = schema.multipleOf ?? 1;\n    const current = data ?? min;\n\n    return (\n        <div className=\"flex flex-col gap-2 py-2\" onBlur={() => setTouched(true)}>\n            {label && (\n                <div className=\"flex items-center justify-between\">\n                    <Label className=\"text-xs font-medium text-foreground\">{label}</Label>\n                    <span className=\"text-xs tabular-nums text-muted-foreground\">{current}</span>\n                </div>\n            )}\n            <Slider\n                min={min}\n                max={max}\n                step={step}\n                value={[current]}\n                onValueChange={value => handleChange(path, Array.isArray(value) ? value[0] : value)}\n                disabled={!enabled}\n            />\n            {shouldShowError(config, touched) && errors && <Typography variant=\"error\">{errors.split(\"\\n\")[0]}</Typography>}\n        </div>\n    );\n};\n\nexport const sliderControlTester = rankWith(12, isRangeControl);\nexport default withJsonFormsControlProps(SliderControlRenderer);\n",
      "type": "registry:component",
      "target": "components/forms/renderers/slider-control.tsx"
    }
  ],
  "type": "registry:component"
}