{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "files": [
    {
      "content": "\"use client\";\n\nimport { toast } from \"sonner\";\nimport { Button } from \"~/registry/ui/button\";\nimport { Field } from \"~/registry/ui/field\";\nimport { Form } from \"~/registry/ui/form\";\nimport { TextField } from \"~/registry/ui/text-field\";\nimport { Textarea } from \"~/registry/ui/textarea\";\n\nexport function ReactAriaFormTextareaDemo() {\n  return (\n    <Form\n      className=\"flex w-full max-w-sm flex-col gap-4\"\n      onSubmit={(e) => {\n        e.preventDefault();\n        const data = Object.fromEntries(new FormData(e.currentTarget));\n        toast(JSON.stringify(data, null, 2));\n        (e.currentTarget as HTMLFormElement).reset();\n      }}\n    >\n      <Field.Root\n        render={\n          <TextField isRequired maxLength={200} minLength={20} name=\"bio\" />\n        }\n      >\n        <Field.Label>Bio</Field.Label>\n        <Textarea\n          className=\"min-h-24\"\n          placeholder=\"Tell us about yourself...\"\n        />\n        <Field.Description>Between 20 and 200 characters.</Field.Description>\n        <Field.Error />\n      </Field.Root>\n      <div className=\"flex gap-2\">\n        <Button type=\"reset\" variant=\"outline\">\n          Reset\n        </Button>\n        <Button type=\"submit\">Submit</Button>\n      </div>\n    </Form>\n  );\n}\n",
      "path": "src/registry/examples/form/react-aria/react-aria-form-textarea-demo.tsx",
      "type": "registry:example"
    }
  ],
  "name": "react-aria-form-textarea-demo",
  "registryDependencies": [
    "@kanpeki/form"
  ],
  "type": "registry:example"
}