{ "$schema": "https://ui.shadcn.com/schema/registry-item.json", "name": "checkbox-form-single", "type": "registry:example", "author": "shadcn (https://ui.shadcn.com)", "registryDependencies": [ "checkbox", "form" ], "files": [ { "path": "examples/checkbox-form-single.tsx", "content": "\"use client\"\n\nimport Link from \"next/link\"\nimport { zodResolver } from \"@hookform/resolvers/zod\"\nimport { useForm } from \"react-hook-form\"\nimport { z } from \"zod\"\n\nimport { toast } from \"@/registry/default/hooks/use-toast\"\nimport { Button } from \"@/registry/default/ui/button\"\nimport { Checkbox } from \"@/registry/default/ui/checkbox\"\nimport {\n Form,\n FormControl,\n FormDescription,\n FormField,\n FormItem,\n FormLabel,\n} from \"@/registry/default/ui/form\"\n\nconst FormSchema = z.object({\n mobile: z.boolean().default(false).optional(),\n})\n\nexport default function CheckboxReactHookFormSingle() {\n const form = useForm>({\n resolver: zodResolver(FormSchema),\n defaultValues: {\n mobile: true,\n },\n })\n\n function onSubmit(data: z.infer) {\n toast({\n title: \"You submitted the following values:\",\n description: (\n
\n          {JSON.stringify(data, null, 2)}\n        
\n ),\n })\n }\n\n return (\n
\n \n (\n \n \n \n \n
\n \n Use different settings for my mobile devices\n \n \n You can manage your mobile notifications in the{\" \"}\n mobile settings page.\n \n
\n
\n )}\n />\n \n \n \n )\n}\n", "type": "registry:example", "target": "" } ] }