{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "autosize-textarea-dependecies",
  "title": "Autosize Textarea Dependencies",
  "description": "component for the Autosize Textarea Dependencies",
  "files": [
    {
      "path": "app/registry/spectrumui/autosize-textarea.tsx",
      "content": "\"use client\";\nimport * as React from \"react\";\nimport { cn } from \"@/lib/utils\";\nimport { useImperativeHandle } from \"react\";\n\ninterface UseAutosizeTextAreaProps {\n  textAreaRef: HTMLTextAreaElement | null;\n  minHeight?: number;\n  maxHeight?: number;\n  triggerAutoSize: string;\n}\n\nexport const useAutosizeTextArea = ({\n  textAreaRef,\n  triggerAutoSize,\n  maxHeight = Number.MAX_SAFE_INTEGER,\n  minHeight = 0,\n}: UseAutosizeTextAreaProps) => {\n  const [init, setInit] = React.useState(true);\n  React.useEffect(() => {\n    // We need to reset the height momentarily to get the correct scrollHeight for the textarea\n    const offsetBorder = 2;\n    if (textAreaRef) {\n      if (init) {\n        textAreaRef.style.minHeight = `${minHeight + offsetBorder}px`;\n        if (maxHeight > minHeight) {\n          textAreaRef.style.maxHeight = `${maxHeight}px`;\n        }\n        setInit(false);\n      }\n      textAreaRef.style.height = `${minHeight + offsetBorder}px`;\n      const scrollHeight = textAreaRef.scrollHeight;\n      // We then set the height directly, outside of the render loop\n      // Trying to set this with state or a ref will product an incorrect value.\n      if (scrollHeight > maxHeight) {\n        textAreaRef.style.height = `${maxHeight}px`;\n      } else {\n        textAreaRef.style.height = `${scrollHeight + offsetBorder}px`;\n      }\n    }\n  }, [textAreaRef, triggerAutoSize, init, minHeight, maxHeight]);\n};\n\nexport type AutosizeTextAreaRef = {\n  textArea: HTMLTextAreaElement;\n  maxHeight: number;\n  minHeight: number;\n};\n\ntype AutosizeTextAreaProps = {\n  maxHeight?: number;\n  minHeight?: number;\n} & React.TextareaHTMLAttributes<HTMLTextAreaElement>;\n\nexport const AutosizeTextarea = React.forwardRef<\n  AutosizeTextAreaRef,\n  AutosizeTextAreaProps\n>(\n  (\n    {\n      maxHeight = Number.MAX_SAFE_INTEGER,\n      minHeight = 52,\n      className,\n      onChange,\n      value,\n      ...props\n    }: AutosizeTextAreaProps,\n    ref: React.Ref<AutosizeTextAreaRef>,\n  ) => {\n    const textAreaRef = React.useRef<HTMLTextAreaElement | null>(null);\n    const [triggerAutoSize, setTriggerAutoSize] = React.useState(\"\");\n\n    useAutosizeTextArea({\n      textAreaRef: textAreaRef.current,\n      triggerAutoSize: triggerAutoSize,\n      maxHeight,\n      minHeight,\n    });\n\n    useImperativeHandle(ref, () => ({\n      textArea: textAreaRef.current as HTMLTextAreaElement,\n      focus: () => textAreaRef?.current?.focus(),\n      maxHeight,\n      minHeight,\n    }));\n\n    React.useEffect(() => {\n      setTriggerAutoSize(value as string);\n    }, [props?.defaultValue, value]);\n\n    return (\n      <textarea\n        {...props}\n        value={value}\n        ref={textAreaRef}\n        className={cn(\n          \"flex w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50\",\n          className,\n        )}\n        onChange={(e) => {\n          setTriggerAutoSize(e.target.value);\n          onChange?.(e);\n        }}\n      />\n    );\n  },\n);\nAutosizeTextarea.displayName = \"AutosizeTextarea\";\n",
      "type": "registry:component",
      "target": "components/spectrumui/autosize-textarea.tsx"
    }
  ],
  "type": "registry:component"
}