{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "switch",
  "type": "registry:ui",
  "title": "Switch",
  "description": "Smooth toggle switch component with accessible state.",
  "dependencies": [],
  "registryDependencies": [],
  "files": [
    {
      "path": "registry/starkui/switch.tsx",
      "content": "\"use client\";\n\nimport * as React from \"react\";\nimport { cn } from \"@/lib/utils\";\n\nexport interface SwitchProps\n  extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, \"onChange\"> {\n  checked?: boolean;\n  onCheckedChange?: (checked: boolean) => void;\n  size?: \"sm\" | \"md\" | \"lg\";\n}\n\nconst sizes = {\n  sm: { track: \"h-5 w-9 p-0.5\", thumb: \"h-4 w-4 data-[state=checked]:translate-x-4\" },\n  md: { track: \"h-6 w-11 p-0.5\", thumb: \"h-5 w-5 data-[state=checked]:translate-x-5\" },\n  lg: { track: \"h-7 w-13 p-1\", thumb: \"h-5 w-5 data-[state=checked]:translate-x-6\" },\n} as const;\n\nexport function Switch({\n  checked: controlledChecked,\n  defaultChecked = false,\n  onCheckedChange,\n  size = \"md\",\n  disabled = false,\n  className,\n  ...props\n}: SwitchProps) {\n  const [internalChecked, setInternalChecked] = React.useState(defaultChecked);\n  const isChecked = controlledChecked ?? internalChecked;\n\n  const toggle = () => {\n    if (disabled) return;\n    const next = !isChecked;\n    if (controlledChecked === undefined) {\n      setInternalChecked(next);\n    }\n    onCheckedChange?.(next);\n  };\n\n  return (\n    <button\n      type=\"button\"\n      role=\"switch\"\n      aria-checked={isChecked}\n      data-state={isChecked ? \"checked\" : \"unchecked\"}\n      disabled={disabled}\n      onClick={toggle}\n      className={cn(\n        \"inline-flex shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors duration-200 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50\",\n        isChecked ? \"bg-foreground\" : \"bg-muted-foreground/30\",\n        sizes[size].track,\n        className\n      )}\n      {...props}\n    >\n      <span\n        data-state={isChecked ? \"checked\" : \"unchecked\"}\n        className={cn(\n          \"pointer-events-none block rounded-full bg-background shadow-md ring-0 transition-transform duration-200 ease-in-out\",\n          sizes[size].thumb\n        )}\n      />\n    </button>\n  );\n}\n",
      "type": "registry:ui",
      "target": "components/ui/switch.tsx"
    }
  ]
}