{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "textarea",
  "type": "registry:ui",
  "title": "Textarea",
  "description": "Accessible React textarea component for Tile UI.",
  "devDependencies": [
    "sass"
  ],
  "registryDependencies": [
    "@tile-ui/core",
    "@tile-ui/utils",
    "@tile-ui/styles"
  ],
  "files": [
    {
      "path": "packages/react/src/components/textarea/textarea.tsx",
      "type": "registry:ui",
      "target": "components/ui/textarea/textarea.tsx",
      "content": "import React, { useId } from 'react';\nimport { getTextareaIds, getTextareaAriaProps } from '../lib/core';\nimport type { TextareaBaseProps } from '../lib/core';\nimport styles from './textarea.module.scss';\n\nexport interface TextareaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement>, TextareaBaseProps {}\n\nconst Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(({ className = '', label, error, helperText, required, id: providedId, ...props }, ref) => {\n\tconst generatedId = useId();\n\tconst id = providedId || generatedId;\n\tconst ids = getTextareaIds(id);\n\tconst ariaProps = getTextareaAriaProps(ids, error, helperText);\n\n\treturn (\n\t\t<div className={styles.textareaWrapper}>\n\t\t\t{label && (\n\t\t\t\t<label htmlFor={id} className={`${styles.label} ${required ? styles.required : ''}`}>\n\t\t\t\t\t{label}\n\t\t\t\t</label>\n\t\t\t)}\n\t\t\t<textarea ref={ref} id={id} className={`${styles.textarea} ${error ? styles.error : ''} ${className}`} {...ariaProps} {...props} />\n\t\t\t{error && (\n\t\t\t\t<span id={ids.error} className={styles.errorText}>\n\t\t\t\t\t{error}\n\t\t\t\t</span>\n\t\t\t)}\n\t\t\t{!error && helperText && (\n\t\t\t\t<span id={ids.helper} className={styles.helperText}>\n\t\t\t\t\t{helperText}\n\t\t\t\t</span>\n\t\t\t)}\n\t\t</div>\n\t);\n});\n\nTextarea.displayName = 'Textarea';\n\nexport { Textarea };\nexport default Textarea;\n"
    },
    {
      "path": "packages/styles/scss/components/textarea.module.scss",
      "type": "registry:file",
      "target": "components/ui/textarea/textarea.module.scss",
      "content": "@use '../../../styles/variables/colors' as *;\n\n.textareaWrapper {\n\tdisplay: flex;\n\tflex-direction: column;\n\tgap: var(--tile-textarea-label-gap, #{$spacing-1});\n\twidth: 100%;\n}\n\n.textarea {\n\tdisplay: flex;\n\tmin-height: var(--tile-textarea-min-height, 5rem);\n\twidth: 100%;\n\tborder-radius: var(--tile-textarea-radius, #{$radius});\n\tborder: var(--tile-textarea-border-width, 1px) solid var(--tile-textarea-border, #{$border});\n\tbackground-color: var(--tile-textarea-background, #{$background});\n\tpadding: var(--tile-textarea-padding, #{$spacing-3} #{$spacing-3});\n\tfont-size: var(--tile-textarea-font-size, #{$text-sm});\n\tbox-shadow: var(--tile-textarea-shadow, none);\n\tcolor: $foreground;\n\ttransition: all $transition-fast;\n\toutline: none;\n\tresize: vertical;\n\tfont-family: inherit;\n\tline-height: var(--tile-textarea-line-height, #{$leading-normal});\n\n\t&::placeholder {\n\t\tcolor: var(--tile-textarea-placeholder, #{$muted-foreground});\n\t}\n\n\t&:focus {\n\t\toutline: none;\n\t\tborder-color: var(--tile-textarea-focus-border, #{$ring});\n\t\tbox-shadow: var(--tile-textarea-focus-shadow, 0 0 0 3px color-mix(in srgb, #{$ring} 50%, transparent));\n\t}\n\n\t&:disabled,\n\t&.disabled {\n\t\tpointer-events: none;\n\t\topacity: var(--tile-textarea-disabled-opacity, 0.5);\n\t\tcursor: not-allowed;\n\t\tbackground-color: var(--tile-textarea-disabled-background, #{$field-disabled});\n\t\tcolor: var(--tile-textarea-disabled-color, #{$foreground});\n\t}\n\n\t&.error {\n\t\tborder-color: $destructive;\n\t\tbox-shadow: var(--tile-textarea-error-shadow, none);\n\n\t\t&:focus {\n\t\t\tborder-color: $destructive;\n\t\t\tbox-shadow: var(--tile-textarea-error-focus-shadow, 0 0 0 1px #{$destructive});\n\t\t}\n\t}\n}\n\n.label {\n\tdisplay: block;\n\tfont-size: var(--tile-textarea-label-font-size, #{$text-sm});\n\tfont-weight: $font-medium;\n\tcolor: $foreground;\n\tline-height: $leading-normal;\n\n\t&.required::after {\n\t\tcontent: ' *';\n\t\tcolor: $destructive;\n\t}\n}\n\n.helperText {\n\tfont-size: var(--tile-textarea-description-font-size, #{$text-xs});\n\tcolor: var(--tile-textarea-description-color, #{$muted-foreground});\n\tline-height: var(--tile-textarea-description-line-height, #{$leading-normal});\n}\n\n.errorText {\n\tfont-size: var(--tile-textarea-description-font-size, #{$text-xs});\n\tcolor: $destructive;\n\tline-height: var(--tile-textarea-description-line-height, #{$leading-normal});\n}\n"
    },
    {
      "path": "packages/react/src/components/textarea/index.ts",
      "type": "registry:ui",
      "target": "components/ui/textarea/index.ts",
      "content": "export { Textarea, type TextareaProps } from './textarea';\n"
    }
  ]
}