{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "switch-form",
  "registryDependencies": [
    "https://taki-ui.com/r/button.json",
    "https://taki-ui.com/r/field.json",
    "https://taki-ui.com/r/switch.json"
  ],
  "files": [
    {
      "path": "registry/new-york/examples/switch-form.tsx",
      "content": "\"use client\"\n\nimport { zodResolver } from \"@hookform/resolvers/zod\"\nimport { Controller, useForm } from \"react-hook-form\"\nimport { toast } from \"sonner\"\nimport { z } from \"zod\"\n\nimport { Button } from \"@/registry/new-york/ui/button\"\nimport {\n  Field,\n  FieldDescription,\n  FieldLabel,\n} from \"@/registry/new-york/ui/field\"\nimport { Switch } from \"@/registry/new-york/ui/switch\"\n\nconst FormSchema = z.object({\n  marketing_emails: z.boolean().default(false).optional(),\n  security_emails: z.boolean(),\n})\n\nexport default function SwitchForm() {\n  const form = useForm<z.infer<typeof FormSchema>>({\n    resolver: zodResolver(FormSchema),\n    defaultValues: {\n      security_emails: true,\n    },\n  })\n\n  function onSubmit(data: z.infer<typeof FormSchema>) {\n    toast(\"You submitted the following values\", {\n      description: (\n        <pre className=\"mt-2 w-[320px] rounded-md bg-neutral-950 p-4\">\n          <code className=\"text-white\">{JSON.stringify(data, null, 2)}</code>\n        </pre>\n      ),\n    })\n  }\n\n  return (\n    <form onSubmit={form.handleSubmit(onSubmit)} className=\"w-full space-y-6\">\n      <div>\n        <h3 className=\"mb-4 text-lg font-medium\">Email Notifications</h3>\n        <div className=\"space-y-4\">\n          <Controller\n            control={form.control}\n            name=\"marketing_emails\"\n            render={({ field }) => {\n              const switchId = \"switch-form-marketing-emails\"\n              return (\n                <Field\n                  orientation=\"horizontal\"\n                  className=\"items-center justify-between rounded-lg border p-3 shadow-sm\"\n                >\n                  <div className=\"space-y-0.5\">\n                    <FieldLabel htmlFor={switchId}>Marketing emails</FieldLabel>\n                    <FieldDescription>\n                      Receive emails about new products, features, and more.\n                    </FieldDescription>\n                  </div>\n                  <Switch\n                    id={switchId}\n                    checked={!!field.value}\n                    onCheckedChange={(checked) =>\n                      field.onChange(checked === true)\n                    }\n                  />\n                </Field>\n              )\n            }}\n          />\n          <Controller\n            control={form.control}\n            name=\"security_emails\"\n            render={({ field }) => {\n              const switchId = \"switch-form-security-emails\"\n              return (\n                <Field\n                  orientation=\"horizontal\"\n                  className=\"items-center justify-between rounded-lg border p-3 shadow-sm\"\n                >\n                  <div className=\"space-y-0.5\">\n                    <FieldLabel htmlFor={switchId}>Security emails</FieldLabel>\n                    <FieldDescription>\n                      Receive emails about your account security.\n                    </FieldDescription>\n                  </div>\n                  <Switch\n                    id={switchId}\n                    checked={!!field.value}\n                    onCheckedChange={(checked) =>\n                      field.onChange(checked === true)\n                    }\n                    disabled\n                    aria-readonly\n                  />\n                </Field>\n              )\n            }}\n          />\n        </div>\n      </div>\n      <Button type=\"submit\">Submit</Button>\n    </form>\n  )\n}\n",
      "type": "registry:example"
    }
  ],
  "type": "registry:example"
}