{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "textarea",
  "title": "Textarea",
  "description": "Textarea from the Get IT Done design system.",
  "dependencies": [],
  "registryDependencies": [
    "https://zero-design.itdone.de/r/labels-context.json",
    "https://zero-design.itdone.de/r/recipes.json",
    "https://zero-design.itdone.de/r/utils.json",
    "https://zero-design.itdone.de/r/theme.json"
  ],
  "files": [
    {
      "path": "registry/ui/textarea.tsx",
      "content": "'use client';\n\nimport * as React from 'react';\n\nimport { fieldHaloZero, focusRingField, invalidRing, transitionBase } from '@/lib/recipes';\nimport { cn } from '@/lib/utils';\nimport { usePreset } from '@/components/ui/labels-context';\n\nexport interface TextareaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {\n  clamp?: boolean;\n  // `readonly` sets the native readOnly attribute and the muted Figma read-only surface. Default keeps the plain look.\n  appearance?: 'default' | 'readonly';\n  // Shows \"length / maxLength\" in the bottom right corner. Needs `maxLength`.\n  showCount?: boolean;\n  // Visible rows and minimum height. Replaces the default 10rem minimum when set, e.g. 1 or 2 for a chat composer.\n  minRows?: number;\n}\n\nconst Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(\n  ({ className, clamp, appearance = 'default', showCount = false, minRows: minRowsProp, readOnly, onChange, ...props }, ref) => {\n    const zero = usePreset() === 'zero';\n    // Zero: three visible lines and the control padding instead of the 10rem field.\n    const minRows = minRowsProp ?? (zero ? 3 : undefined);\n    const countId = React.useId();\n    const [innerLength, setInnerLength] = React.useState(() => String(props.defaultValue ?? '').length);\n    const counted = showCount && props.maxLength != null;\n    const length = props.value !== undefined ? String(props.value).length : innerLength;\n\n    const field = (\n      <textarea\n        className={cn(\n          'flex',\n          minRows === undefined ? 'min-h-[10rem]' : 'min-h-0',\n          'w-full',\n          'border',\n          'border-solid',\n          'border-input',\n          'rounded-control',\n          zero ? 'px-control-px-sm py-2' : 'px-4 py-3',\n          'text-foreground',\n          'bg-background',\n          'placeholder:text-textarea-foreground-placeholder',\n          'typography-input-text',\n          // Below sm the field text is at least 16px so iOS Safari does not zoom on focus.\n          'max-sm:text-[max(16px,var(--typo-input-text-size,1rem))]',\n          'leading-normal',\n          transitionBase,\n          'hover:border-border-bold',\n          'hover:shadow-field-hover',\n          !zero && focusRingField,\n          invalidRing,\n          zero && fieldHaloZero,\n          'disabled:cursor-not-allowed',\n          'disabled:opacity-disabled',\n          { 'text-clamp': clamp },\n          { 'leading-clamp': clamp },\n          appearance === 'readonly' && 'bg-muted hover:border-input hover:shadow-none',\n          counted && 'pb-8',\n          className,\n        )}\n        ref={ref}\n        rows={minRows}\n        readOnly={appearance === 'readonly' ? true : readOnly}\n        onChange={(event) => {\n          setInnerLength(event.target.value.length);\n          onChange?.(event);\n        }}\n        {...props}\n        aria-describedby={counted ? [props['aria-describedby'], countId].filter(Boolean).join(' ') : props['aria-describedby']}\n      />\n    );\n\n    if (!counted) return field;\n\n    return (\n      <div className=\"relative w-full\">\n        {field}\n        <span\n          id={countId}\n          data-textarea-count=\"\"\n          className=\"pointer-events-none absolute bottom-3 right-4 typography-input-hint tabular-nums text-input-foreground-hint\"\n        >\n          {length} / {props.maxLength}\n        </span>\n      </div>\n    );\n  },\n);\nTextarea.displayName = 'Textarea';\n\nexport { Textarea };\n",
      "type": "registry:ui"
    }
  ],
  "type": "registry:ui"
}