{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "comment-composer",
  "type": "registry:ui",
  "title": "Comment composer",
  "description": "Comment box with a three row textarea and a Comment button that stays disabled until there is text. Submits the trimmed value and clears the field.",
  "dependencies": [],
  "registryDependencies": [
    "https://ui.minidev.pro/r/button.json",
    "https://ui.minidev.pro/r/textarea.json",
    "utils"
  ],
  "files": [
    {
      "path": "registry/ui/comment-composer.tsx",
      "type": "registry:ui",
      "target": "components/ui/comment-composer.tsx",
      "content": "\"use client\"\nimport * as React from \"react\"\nimport { cn } from \"@/lib/utils\"\nimport { Button } from \"@/components/ui/button\"\nimport { Textarea } from \"@/components/ui/textarea\"\n\nfunction CommentComposer({\n  onSubmit,\n  placeholder = \"Add a comment…\",\n  className,\n}: {\n  onSubmit?: (value: string) => void\n  placeholder?: string\n  className?: string\n}) {\n  const [value, setValue] = React.useState(\"\")\n  return (\n    <div data-slot=\"comment-composer\" className={cn(\"space-y-2\", className)}>\n      <Textarea\n        aria-label=\"Comment\"\n        placeholder={placeholder}\n        value={value}\n        onChange={(e) => setValue(e.target.value)}\n        rows={3}\n      />\n      <div className=\"flex justify-end\">\n        <Button\n          type=\"button\"\n          size=\"sm\"\n          disabled={!value.trim()}\n          onClick={() => {\n            onSubmit?.(value.trim())\n            setValue(\"\")\n          }}\n        >\n          Comment\n        </Button>\n      </div>\n    </div>\n  )\n}\nexport { CommentComposer }\n"
    }
  ]
}