{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "textarea-6",
  "type": "registry:component",
  "title": "Textarea 6",
  "description": "Textarea 6. A multi-line input field that allows users to enter longer blocks of text, such as messages, descriptions, or comments.",
  "dependencies": [
    "react-icons"
  ],
  "registryDependencies": [
    "label",
    "textarea"
  ],
  "files": [
    {
      "path": "components/watermelon/textarea-6.tsx",
      "type": "registry:component",
      "content": "import { useId } from 'react';\n\nimport { FaPen } from 'react-icons/fa';\n\nimport { Textarea } from '@/components/base-ui/textarea';\nimport { Label } from '@/components/base-ui/label';\n\nconst Textarea6 = () => {\n  const id = useId();\n\n  return (\n    <div className=\"w-full max-w-sm space-y-2\">\n      <Label htmlFor={id}>Write a note</Label>\n      <div className=\"group relative\">\n        <div className=\"text-muted-foreground pointer-events-none absolute top-2.5 left-0 flex origin-bottom items-center justify-center pl-3 transition-transform duration-200 group-focus-within:rotate-12 peer-disabled:opacity-50\">\n          <FaPen className=\"size-4\" />\n          <span className=\"sr-only\">Note</span>\n        </div>\n        <Textarea\n          id={id}\n          placeholder=\"Jot down your thoughts...\"\n          className=\"peer focus-visible:ring-primary/20 focus-visible:border-primary/50 rounded-sm pl-9 shadow-sm focus-visible:ring-2\"\n        />\n      </div>\n    </div>\n  );\n};\n\nexport default Textarea6;\n"
    }
  ]
}
