{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "switch-14",
  "type": "registry:component",
  "title": "Switch 14",
  "description": "Switch 14. A toggle control that allows users to switch between two states, typically on or off.",
  "dependencies": [
    "react-icons"
  ],
  "registryDependencies": [
    "label",
    "switch"
  ],
  "files": [
    {
      "path": "components/watermelon/switch-14.tsx",
      "type": "registry:component",
      "content": "import { FiCloud } from 'react-icons/fi';\n\nimport { Label } from '@/components/base-ui/label';\nimport { Switch } from '@/components/base-ui/switch';\n\nconst Switch14 = () => {\n  return (\n    <div className=\"border-input relative flex w-full items-start gap-2 rounded-md border bg-neutral-100 p-4 transition-all duration-200 ease-out outline-none has-data-[state=checked]:shadow-[0_5px_1px_0_var(--color-neutral-700),inset_0_2px_1px_0_rgba(0,0,0,0.1)] has-data-[state=checked]:ring-2 has-data-[state=checked]:ring-neutral-700 dark:bg-neutral-900 dark:has-data-[state=checked]:shadow-[0_5px_1px_0_var(--color-neutral-400),inset_0_2px_1px_0_rgba(255,255,255,0.1)] dark:has-data-[state=checked]:ring-neutral-400\">\n      <Switch\n        id=\"cloud-backup\"\n        className=\"order-1 bg-black after:absolute after:inset-0 data-[size=default]:h-4 data-[size=default]:w-6 [&_span]:group-data-[size=default]/switch:size-3 data-[state=checked]:[&_span]:translate-x-2.5 data-[state=checked]:[&_span]:rtl:-translate-x-2.5\"\n        aria-describedby=\"cloud-backup-description\"\n      />\n      <div className=\"flex grow gap-3\">\n        <FiCloud className=\"text-muted-foreground size-4 shrink-0\" />\n        <div className=\"grid grow gap-2\">\n          <Label htmlFor=\"cloud-backup\">Cloud Backup</Label>\n          <p\n            id=\"cloud-backup-description\"\n            className=\"text-muted-foreground text-xs\"\n          >\n            Securely store your files, photos, and documents in the cloud.\n          </p>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nexport default Switch14;\n"
    }
  ]
}
