{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "radio-group-form",
  "registryDependencies": [
    "https://taki-ui.com/r/button.json",
    "https://taki-ui.com/r/field.json",
    "https://taki-ui.com/r/radio-group.json"
  ],
  "files": [
    {
      "path": "registry/new-york/examples/radio-group-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  FieldError,\n  FieldLegend,\n  FieldSet,\n} from \"@/registry/new-york/ui/field\"\nimport { Radio, RadioGroup } from \"@/registry/new-york/ui/radio-group\"\n\nconst FormSchema = z.object({\n  type: z.enum([\"all\", \"mentions\", \"none\"], {\n    required_error: \"You need to select a notification type.\",\n  }),\n})\n\nexport default function RadioGroupForm() {\n  const form = useForm<z.infer<typeof FormSchema>>({\n    resolver: zodResolver(FormSchema),\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-2/3 space-y-6\">\n      <Controller\n        control={form.control}\n        name=\"type\"\n        render={({ field, fieldState }) => {\n          const legendId = \"radio-group-form-type\"\n          return (\n            <FieldSet\n              data-invalid={fieldState.invalid}\n              aria-labelledby={legendId}\n              className=\"space-y-3\"\n            >\n              <FieldLegend id={legendId} className=\"text-base\">\n                Notify me about...\n              </FieldLegend>\n              <RadioGroup\n                value={field.value}\n                onValueChange={(value) => {\n                  field.onChange(value)\n                  field.onBlur()\n                }}\n                aria-invalid={fieldState.invalid}\n                className=\"flex flex-col gap-3\"\n              >\n                <Field orientation=\"horizontal\" className=\"items-center gap-3\">\n                  <Radio value=\"all\" />\n                  <span className=\"font-normal\">All new messages</span>\n                </Field>\n                <Field orientation=\"horizontal\" className=\"items-center gap-3\">\n                  <Radio value=\"mentions\" />\n                  <span className=\"font-normal\">\n                    Direct messages and mentions\n                  </span>\n                </Field>\n                <Field orientation=\"horizontal\" className=\"items-center gap-3\">\n                  <Radio value=\"none\" />\n                  <span className=\"font-normal\">Nothing</span>\n                </Field>\n              </RadioGroup>\n              {fieldState.invalid && <FieldError errors={[fieldState.error]} />}\n            </FieldSet>\n          )\n        }}\n      />\n      <Button type=\"submit\">Submit</Button>\n    </form>\n  )\n}\n",
      "type": "registry:example"
    }
  ],
  "type": "registry:example"
}