{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "example-form",
  "title": "Example Form",
  "description": "A contact form with Zod validation.",
  "dependencies": [
    "zod"
  ],
  "registryDependencies": [
    "button",
    "input",
    "label",
    "textarea",
    "card"
  ],
  "files": [
    {
      "path": "registry/new-york/blocks/example-form/example-form.tsx",
      "content": "\"use client\";\n\nimport * as React from \"react\";\nimport { z } from \"zod\";\nimport { Button } from \"@/registry/new-york/ui/button\";\nimport {\n\tCard,\n\tCardContent,\n\tCardDescription,\n\tCardFooter,\n\tCardHeader,\n\tCardTitle,\n} from \"@/registry/new-york/ui/card\";\nimport { Input } from \"@/registry/new-york/ui/input\";\nimport { Label } from \"@/registry/new-york/ui/label\";\nimport { Textarea } from \"@/registry/new-york/ui/textarea\";\n\nconst exampleFormSchema = z.object({\n\tname: z.string().min(1),\n\temail: z.string().email(),\n\tmessage: z.string().min(1),\n});\n\nexport function ExampleForm() {\n\tconst [pending, setPending] = React.useState(false);\n\tconst [state, setState] = React.useState({\n\t\tdefaultValues: {\n\t\t\tname: \"\",\n\t\t\temail: \"\",\n\t\t\tmessage: \"\",\n\t\t},\n\t\tsuccess: false,\n\t\terrors: {\n\t\t\tname: \"\",\n\t\t\temail: \"\",\n\t\t\tmessage: \"\",\n\t\t},\n\t});\n\n\tconst handleSubmit = React.useCallback(\n\t\t(e: React.FormEvent<HTMLFormElement>) => {\n\t\t\te.preventDefault();\n\t\t\tsetPending(true);\n\n\t\t\tconst formData = new FormData(e.target as HTMLFormElement);\n\t\t\tconst data = Object.fromEntries(formData.entries());\n\t\t\tconst result = exampleFormSchema.safeParse(data);\n\n\t\t\tif (!result.success) {\n\t\t\t\tsetState({\n\t\t\t\t\t...state,\n\t\t\t\t\terrors: Object.fromEntries(\n\t\t\t\t\t\tObject.entries(result.error.flatten().fieldErrors).map(\n\t\t\t\t\t\t\t([key, value]) => [key, value?.[0] ?? \"\"],\n\t\t\t\t\t\t),\n\t\t\t\t\t) as Record<keyof typeof state.errors, string>,\n\t\t\t\t});\n\t\t\t\tsetPending(false);\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tsetPending(false);\n\t\t},\n\t\t[state],\n\t);\n\n\treturn (\n\t\t<form onSubmit={handleSubmit} className=\"w-full max-w-sm\">\n\t\t\t<Card>\n\t\t\t\t<CardHeader>\n\t\t\t\t\t<CardTitle>How can we help?</CardTitle>\n\t\t\t\t\t<CardDescription>\n\t\t\t\t\t\tNeed help with your project? We&apos;re here to assist you.\n\t\t\t\t\t</CardDescription>\n\t\t\t\t</CardHeader>\n\t\t\t\t<CardContent className=\"flex flex-col gap-6\">\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName=\"group/field grid gap-2\"\n\t\t\t\t\t\tdata-invalid={!!state.errors?.name}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Label\n\t\t\t\t\t\t\thtmlFor=\"name\"\n\t\t\t\t\t\t\tclassName=\"group-data-[invalid=true]/field:text-destructive\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\tName <span aria-hidden=\"true\">*</span>\n\t\t\t\t\t\t</Label>\n\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\tid=\"name\"\n\t\t\t\t\t\t\tname=\"name\"\n\t\t\t\t\t\t\tplaceholder=\"Lee Robinson\"\n\t\t\t\t\t\t\tclassName=\"group-data-[invalid=true]/field:border-destructive focus-visible:group-data-[invalid=true]/field:ring-destructive\"\n\t\t\t\t\t\t\tdisabled={pending}\n\t\t\t\t\t\t\taria-invalid={!!state.errors?.name}\n\t\t\t\t\t\t\taria-errormessage=\"error-name\"\n\t\t\t\t\t\t\tdefaultValue={state.defaultValues.name}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{state.errors?.name && (\n\t\t\t\t\t\t\t<p id=\"error-name\" className=\"text-destructive text-sm\">\n\t\t\t\t\t\t\t\t{state.errors.name}\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName=\"group/field grid gap-2\"\n\t\t\t\t\t\tdata-invalid={!!state.errors?.email}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Label\n\t\t\t\t\t\t\thtmlFor=\"email\"\n\t\t\t\t\t\t\tclassName=\"group-data-[invalid=true]/field:text-destructive\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\tEmail <span aria-hidden=\"true\">*</span>\n\t\t\t\t\t\t</Label>\n\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\tid=\"email\"\n\t\t\t\t\t\t\tname=\"email\"\n\t\t\t\t\t\t\tplaceholder=\"leerob@acme.com\"\n\t\t\t\t\t\t\tclassName=\"group-data-[invalid=true]/field:border-destructive focus-visible:group-data-[invalid=true]/field:ring-destructive\"\n\t\t\t\t\t\t\tdisabled={pending}\n\t\t\t\t\t\t\taria-invalid={!!state.errors?.email}\n\t\t\t\t\t\t\taria-errormessage=\"error-email\"\n\t\t\t\t\t\t\tdefaultValue={state.defaultValues.email}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{state.errors?.email && (\n\t\t\t\t\t\t\t<p id=\"error-email\" className=\"text-destructive text-sm\">\n\t\t\t\t\t\t\t\t{state.errors.email}\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName=\"group/field grid gap-2\"\n\t\t\t\t\t\tdata-invalid={!!state.errors?.message}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Label\n\t\t\t\t\t\t\thtmlFor=\"message\"\n\t\t\t\t\t\t\tclassName=\"group-data-[invalid=true]/field:text-destructive\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\tMessage <span aria-hidden=\"true\">*</span>\n\t\t\t\t\t\t</Label>\n\t\t\t\t\t\t<Textarea\n\t\t\t\t\t\t\tid=\"message\"\n\t\t\t\t\t\t\tname=\"message\"\n\t\t\t\t\t\t\tplaceholder=\"Type your message here...\"\n\t\t\t\t\t\t\tclassName=\"group-data-[invalid=true]/field:border-destructive focus-visible:group-data-[invalid=true]/field:ring-destructive\"\n\t\t\t\t\t\t\tdisabled={pending}\n\t\t\t\t\t\t\taria-invalid={!!state.errors?.message}\n\t\t\t\t\t\t\taria-errormessage=\"error-message\"\n\t\t\t\t\t\t\tdefaultValue={state.defaultValues.message}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{state.errors?.message && (\n\t\t\t\t\t\t\t<p id=\"error-message\" className=\"text-destructive text-sm\">\n\t\t\t\t\t\t\t\t{state.errors.message}\n\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</CardContent>\n\t\t\t\t<CardFooter>\n\t\t\t\t\t<Button type=\"submit\" size=\"sm\" disabled={pending}>\n\t\t\t\t\t\t{pending ? \"Sending...\" : \"Send Message\"}\n\t\t\t\t\t</Button>\n\t\t\t\t</CardFooter>\n\t\t\t</Card>\n\t\t</form>\n\t);\n}\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:block"
}