{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "mc-textarea",
  "title": "MicroClub Textarea",
  "description": "A multi-line text input with field integration and block addons for MicroClub UI",
  "dependencies": [],
  "files": [
    {
      "path": "registry/ui/mc-textarea.tsx",
      "content": "'use client';\n\nimport * as React from 'react';\n\nimport { cn } from '@/lib/utils';\n\nexport interface McTextareaProps extends React.ComponentProps<'textarea'> {\n  /** Label rendered above the textarea. */\n  label?: React.ReactNode;\n  /** Help text below the textarea. Replaced by error when present. */\n  description?: React.ReactNode;\n  /** Truthy = error state. ReactNode = renders the message. `true` = red border only. */\n  error?: React.ReactNode;\n  /** Block-start addon (toolbar, controls above the textarea). */\n  addonTop?: React.ReactNode;\n  /** Block-end addon (character count, action buttons below the textarea). */\n  addonBottom?: React.ReactNode;\n}\n\nfunction McTextarea({\n  className,\n  label,\n  description,\n  error,\n  addonTop,\n  addonBottom,\n  id,\n  disabled,\n  required,\n  rows = 3,\n  ...props\n}: McTextareaProps) {\n  const generatedId = React.useId();\n  const textareaId = id ?? generatedId;\n\n  const hasError = !!error;\n  const errorMessage = typeof error === 'boolean' ? null : error;\n  const showError = hasError && !!errorMessage;\n  const showDescription = !hasError && !!description;\n  const messageId = showError\n    ? `${textareaId}-error`\n    : showDescription\n      ? `${textareaId}-description`\n      : undefined;\n\n  const handleGroupClick = (e: React.MouseEvent<HTMLDivElement>) => {\n    const target = e.target as HTMLElement;\n    if (!target.closest('button, a, input, select, textarea, [tabindex]')) {\n      e.currentTarget.querySelector<HTMLTextAreaElement>('[data-slot=\"textarea\"]')?.focus();\n    }\n  };\n\n  return (\n    <div data-slot=\"textarea-root\" className={cn('flex flex-col gap-1.5', className)}>\n      {label && (\n        <label\n          data-slot=\"textarea-label\"\n          htmlFor={textareaId}\n          className=\"text-sm font-medium text-muted-foreground\"\n        >\n          {label}\n        </label>\n      )}\n\n      <div\n        data-slot=\"textarea-group\"\n        data-error={hasError || undefined}\n        data-disabled={disabled || undefined}\n        role=\"group\"\n        onClick={handleGroupClick}\n        className={cn(\n          // Structure\n          'group/textarea flex min-w-0 cursor-text flex-col rounded-lg border border-border bg-input shadow-xs transition-all',\n          // Focus ring\n          'focus-within:ring-4 focus-within:ring-ring',\n          // Error\n          'data-error:border-destructive',\n          'data-error:focus-within:border-destructive data-error:focus-within:ring-destructive/20',\n          'dark:data-error:border-destructive/60 dark:data-error:focus-within:ring-destructive/30',\n          // Disabled\n          'data-disabled:pointer-events-none data-disabled:opacity-50'\n        )}\n      >\n        {addonTop && (\n          <div\n            data-slot=\"textarea-addon\"\n            data-align=\"top\"\n            className={cn(\n              'flex w-full items-center gap-2 border-b border-border px-3.5 py-1.5 text-sm text-muted-foreground select-none',\n              \"[&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0\"\n            )}\n          >\n            {addonTop}\n          </div>\n        )}\n\n        <textarea\n          data-slot=\"textarea\"\n          id={textareaId}\n          disabled={disabled}\n          required={required}\n          rows={rows}\n          aria-invalid={hasError || undefined}\n          aria-describedby={messageId}\n          className=\"min-h-0 w-full resize-none bg-transparent px-3.5 py-2.5 text-sm outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed\"\n          {...props}\n        />\n\n        {addonBottom && (\n          <div\n            data-slot=\"textarea-addon\"\n            data-align=\"bottom\"\n            className={cn(\n              'flex w-full items-center gap-2 border-t border-border px-3.5 py-1.5 text-sm text-muted-foreground select-none',\n              \"[&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0\"\n            )}\n          >\n            {addonBottom}\n          </div>\n        )}\n      </div>\n\n      {showError && (\n        <p\n          data-slot=\"textarea-error\"\n          id={`${textareaId}-error`}\n          role=\"alert\"\n          className=\"text-sm text-destructive\"\n        >\n          {errorMessage}\n        </p>\n      )}\n\n      {showDescription && (\n        <p\n          data-slot=\"textarea-description\"\n          id={`${textareaId}-description`}\n          className=\"text-sm text-muted-foreground\"\n        >\n          {description}\n        </p>\n      )}\n    </div>\n  );\n}\n\nexport { McTextarea };\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:component"
}