@accreditation/ui 1.0.0

package/dist/components/atoms/textarea/components/text-area.js

@@ -0,0 +1,299 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+var lucideReact = require('lucide-react');
+var utils = require('../../../../lib/utils');
+var variants = require('../variants');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+const TextAreaContext = React__namespace.createContext(null);
+function useTextAreaContext() {
+  const ctx = React__namespace.useContext(TextAreaContext);
+  if (!ctx) throw new Error("TextAreaInput must be inside TextAreaRoot");
+  return ctx;
+}
+function TextAreaRoot({
+  variant = "outlined",
+  size = "md",
+  status = "default",
+  disabled,
+  allowClear = false,
+  showCount = false,
+  autoResize = false,
+  minRows: minRowsProp,
+  maxRows,
+  fullWidth = true,
+  className,
+  style,
+  children
+}) {
+  const sizeConfig = variants.textAreaSizeMap[size];
+  const minRows = minRowsProp ?? sizeConfig.minRows;
+  const [charCount, setCharCount] = React__namespace.useState(0);
+  const ctx = React__namespace.useMemo(
+    () => ({
+      variant,
+      size,
+      status,
+      disabled,
+      allowClear,
+      showCount,
+      autoResize,
+      minRows,
+      maxRows,
+      charCount,
+      setCharCount
+    }),
+    [variant, size, status, disabled, allowClear, showCount, autoResize, minRows, maxRows, charCount]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(TextAreaContext.Provider, { value: ctx, children: /* @__PURE__ */ jsxRuntime.jsx(
+    "span",
+    {
+      className: utils.cn(
+        variants.textAreaRootBaseClasses,
+        variants.textAreaVariantClasses[variant],
+        variants.textAreaStatusBorderClasses[status],
+        variants.textAreaStatusRingClasses[status],
+        fullWidth ? "w-full" : "w-auto",
+        disabled && "opacity-50 pointer-events-none",
+        className
+      ),
+      style,
+      children
+    }
+  ) });
+}
+TextAreaRoot.displayName = "TextArea.Root";
+const TextAreaInput = React__namespace.forwardRef(function TextAreaInput2({ resize = "vertical", style: styleProp, className, value, defaultValue, onChange, maxLength, ...rest }, ref) {
+  const ctx = useTextAreaContext();
+  const {
+    variant,
+    size,
+    status,
+    disabled,
+    allowClear,
+    autoResize,
+    minRows,
+    maxRows,
+    setCharCount
+  } = ctx;
+  const sizeConfig = variants.textAreaSizeMap[size];
+  const internalRef = React__namespace.useRef(null);
+  const setRef = React__namespace.useCallback(
+    (el) => {
+      internalRef.current = el;
+      if (typeof ref === "function") ref(el);
+      else if (ref) ref.current = el;
+    },
+    [ref]
+  );
+  const isControlled = value !== void 0;
+  const [internal, setInternal] = React__namespace.useState(
+    typeof defaultValue === "string" ? defaultValue : ""
+  );
+  const currentValue = isControlled ? value : internal;
+  React__namespace.useLayoutEffect(() => {
+    setCharCount(currentValue?.length ?? 0);
+  }, [currentValue, setCharCount]);
+  const adjustHeight = React__namespace.useCallback(() => {
+    const el = internalRef.current;
+    if (!el || !autoResize) return;
+    const supportsFieldSizing = CSS.supports("field-sizing", "content");
+    if (supportsFieldSizing) return;
+    el.style.height = "auto";
+    const minH2 = minRows * variants.LINE_HEIGHT_PX + 16;
+    const maxH2 = maxRows ? maxRows * variants.LINE_HEIGHT_PX + 16 : void 0;
+    const target = Math.max(el.scrollHeight, minH2);
+    el.style.height = `${maxH2 ? Math.min(target, maxH2) : target}px`;
+    el.style.overflowY = maxH2 && el.scrollHeight > maxH2 ? "auto" : "hidden";
+  }, [autoResize, minRows, maxRows]);
+  React__namespace.useLayoutEffect(() => {
+    adjustHeight();
+  }, [adjustHeight, currentValue]);
+  const handleChange = React__namespace.useCallback(
+    (e) => {
+      if (!isControlled) setInternal(e.target.value);
+      onChange?.(e);
+    },
+    [isControlled, onChange]
+  );
+  const handleClear = React__namespace.useCallback(() => {
+    const el = internalRef.current;
+    if (!el) return;
+    if (isControlled) {
+      onChange?.({
+        target: { ...el, value: "" },
+        currentTarget: el,
+        nativeEvent: new Event("input")
+      });
+    } else {
+      setInternal("");
+      el.value = "";
+    }
+    setCharCount(0);
+    el.focus();
+  }, [isControlled, onChange, setCharCount]);
+  const hasContent = allowClear && currentValue.length > 0;
+  const minH = minRows * variants.LINE_HEIGHT_PX + 16;
+  const maxH = maxRows ? maxRows * variants.LINE_HEIGHT_PX + 16 : void 0;
+  const fieldSizingStyle = autoResize ? {
+    // field-sizing: content — suportado Chrome 123+, Firefox 129+
+    // TypeScript não conhece a propriedade ainda, cast necessário
+    ["fieldSizing"]: "content",
+    minHeight: minH,
+    ...maxH ? { maxHeight: maxH, overflowY: "auto" } : { overflowY: "hidden" }
+  } : { minHeight: minH, resize };
+  return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "relative inline-flex w-full min-w-0", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "textarea",
+      {
+        ref: setRef,
+        "aria-invalid": status === "error" ? true : void 0,
+        disabled,
+        value: isControlled ? value : void 0,
+        defaultValue: isControlled ? void 0 : defaultValue,
+        maxLength,
+        onChange: handleChange,
+        onInput: autoResize ? adjustHeight : void 0,
+        className: utils.cn(
+          variants.textAreaInputBaseClasses,
+          sizeConfig.paddingClass,
+          sizeConfig.textClass,
+          hasContent && "pr-7",
+          // espaço para botão X
+          className
+        ),
+        style: { ...fieldSizingStyle, ...styleProp },
+        ...rest
+      }
+    ),
+    hasContent && /* @__PURE__ */ jsxRuntime.jsx(
+      "button",
+      {
+        type: "button",
+        "aria-label": "Limpar",
+        tabIndex: -1,
+        onClick: handleClear,
+        className: variants.textAreaClearButtonClasses,
+        children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "size-3.5" })
+      }
+    )
+  ] });
+});
+TextAreaInput.displayName = "TextArea.Input";
+function TextAreaCount({
+  maxLength,
+  className
+}) {
+  const { charCount } = useTextAreaContext();
+  const colorClass = maxLength ? variants.textAreaCountColorClass(charCount, maxLength) : "text-muted-foreground";
+  return /* @__PURE__ */ jsxRuntime.jsx("span", { className: utils.cn(variants.textAreaCountBaseClasses, colorClass, className), children: maxLength ? `${charCount} / ${maxLength}` : charCount });
+}
+TextAreaCount.displayName = "TextArea.Count";
+function TextAreaFooter({ maxLength }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex items-center justify-end px-3 pb-1.5", children: /* @__PURE__ */ jsxRuntime.jsx(TextAreaCount, { maxLength }) });
+}
+const TextArea = React__namespace.forwardRef(
+  function TextArea2({
+    variant = "outlined",
+    size = "md",
+    status = "default",
+    disabled,
+    allowClear = false,
+    showCount = false,
+    autoResize = false,
+    minRows,
+    maxRows,
+    fullWidth = true,
+    resize = "vertical",
+    className,
+    style,
+    maxLength,
+    ...inputProps
+  }, ref) {
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      TextAreaRoot,
+      {
+        variant,
+        size,
+        status,
+        disabled,
+        allowClear,
+        showCount,
+        autoResize,
+        minRows,
+        maxRows,
+        fullWidth,
+        className,
+        style,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            TextAreaInput,
+            {
+              ref,
+              resize,
+              maxLength,
+              ...inputProps
+            }
+          ),
+          showCount && /* @__PURE__ */ jsxRuntime.jsx(TextAreaFooter, { maxLength })
+        ]
+      }
+    );
+  }
+);
+TextArea.displayName = "TextArea";
+Object.assign(TextArea, {
+  Root: TextAreaRoot,
+  Input: TextAreaInput,
+  Count: TextAreaCount
+});
+const TextAreaField = React__namespace.forwardRef(function TextAreaField2({
+  label,
+  hint,
+  required,
+  wrapperClassName,
+  status = "default",
+  id: idProp,
+  ...textAreaProps
+}, ref) {
+  const autoId = React__namespace.useId();
+  const id = idProp ?? autoId;
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: utils.cn("flex flex-col gap-1.5", wrapperClassName), children: [
+    label && /* @__PURE__ */ jsxRuntime.jsxs("label", { htmlFor: id, className: "text-sm font-medium text-foreground", children: [
+      label,
+      required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-1 text-destructive", "aria-hidden": true, children: "*" })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(TextArea, { ref, id, status, ...textAreaProps }),
+    hint && /* @__PURE__ */ jsxRuntime.jsx("span", { className: utils.cn("text-xs", variants.textAreaHintClasses[status]), children: hint })
+  ] });
+});
+TextAreaField.displayName = "TextAreaField";
+const Textarea = TextArea;
+
+exports.TextArea = TextArea;
+exports.TextAreaCount = TextAreaCount;
+exports.TextAreaField = TextAreaField;
+exports.TextAreaInput = TextAreaInput;
+exports.TextAreaRoot = TextAreaRoot;
+exports.Textarea = Textarea;

package/dist/components/atoms/textarea/components/text-area.mjs

@@ -0,0 +1,272 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import * as React from 'react';
+import { X } from 'lucide-react';
+import { cn } from '../../../../lib/utils';
+import { textAreaSizeMap, textAreaInputBaseClasses, textAreaClearButtonClasses, textAreaHintClasses, LINE_HEIGHT_PX, textAreaRootBaseClasses, textAreaVariantClasses, textAreaStatusBorderClasses, textAreaStatusRingClasses, textAreaCountColorClass, textAreaCountBaseClasses } from '../variants';
+
+const TextAreaContext = React.createContext(null);
+function useTextAreaContext() {
+  const ctx = React.useContext(TextAreaContext);
+  if (!ctx) throw new Error("TextAreaInput must be inside TextAreaRoot");
+  return ctx;
+}
+function TextAreaRoot({
+  variant = "outlined",
+  size = "md",
+  status = "default",
+  disabled,
+  allowClear = false,
+  showCount = false,
+  autoResize = false,
+  minRows: minRowsProp,
+  maxRows,
+  fullWidth = true,
+  className,
+  style,
+  children
+}) {
+  const sizeConfig = textAreaSizeMap[size];
+  const minRows = minRowsProp ?? sizeConfig.minRows;
+  const [charCount, setCharCount] = React.useState(0);
+  const ctx = React.useMemo(
+    () => ({
+      variant,
+      size,
+      status,
+      disabled,
+      allowClear,
+      showCount,
+      autoResize,
+      minRows,
+      maxRows,
+      charCount,
+      setCharCount
+    }),
+    [variant, size, status, disabled, allowClear, showCount, autoResize, minRows, maxRows, charCount]
+  );
+  return /* @__PURE__ */ jsx(TextAreaContext.Provider, { value: ctx, children: /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: cn(
+        textAreaRootBaseClasses,
+        textAreaVariantClasses[variant],
+        textAreaStatusBorderClasses[status],
+        textAreaStatusRingClasses[status],
+        fullWidth ? "w-full" : "w-auto",
+        disabled && "opacity-50 pointer-events-none",
+        className
+      ),
+      style,
+      children
+    }
+  ) });
+}
+TextAreaRoot.displayName = "TextArea.Root";
+const TextAreaInput = React.forwardRef(function TextAreaInput2({ resize = "vertical", style: styleProp, className, value, defaultValue, onChange, maxLength, ...rest }, ref) {
+  const ctx = useTextAreaContext();
+  const {
+    variant,
+    size,
+    status,
+    disabled,
+    allowClear,
+    autoResize,
+    minRows,
+    maxRows,
+    setCharCount
+  } = ctx;
+  const sizeConfig = textAreaSizeMap[size];
+  const internalRef = React.useRef(null);
+  const setRef = React.useCallback(
+    (el) => {
+      internalRef.current = el;
+      if (typeof ref === "function") ref(el);
+      else if (ref) ref.current = el;
+    },
+    [ref]
+  );
+  const isControlled = value !== void 0;
+  const [internal, setInternal] = React.useState(
+    typeof defaultValue === "string" ? defaultValue : ""
+  );
+  const currentValue = isControlled ? value : internal;
+  React.useLayoutEffect(() => {
+    setCharCount(currentValue?.length ?? 0);
+  }, [currentValue, setCharCount]);
+  const adjustHeight = React.useCallback(() => {
+    const el = internalRef.current;
+    if (!el || !autoResize) return;
+    const supportsFieldSizing = CSS.supports("field-sizing", "content");
+    if (supportsFieldSizing) return;
+    el.style.height = "auto";
+    const minH2 = minRows * LINE_HEIGHT_PX + 16;
+    const maxH2 = maxRows ? maxRows * LINE_HEIGHT_PX + 16 : void 0;
+    const target = Math.max(el.scrollHeight, minH2);
+    el.style.height = `${maxH2 ? Math.min(target, maxH2) : target}px`;
+    el.style.overflowY = maxH2 && el.scrollHeight > maxH2 ? "auto" : "hidden";
+  }, [autoResize, minRows, maxRows]);
+  React.useLayoutEffect(() => {
+    adjustHeight();
+  }, [adjustHeight, currentValue]);
+  const handleChange = React.useCallback(
+    (e) => {
+      if (!isControlled) setInternal(e.target.value);
+      onChange?.(e);
+    },
+    [isControlled, onChange]
+  );
+  const handleClear = React.useCallback(() => {
+    const el = internalRef.current;
+    if (!el) return;
+    if (isControlled) {
+      onChange?.({
+        target: { ...el, value: "" },
+        currentTarget: el,
+        nativeEvent: new Event("input")
+      });
+    } else {
+      setInternal("");
+      el.value = "";
+    }
+    setCharCount(0);
+    el.focus();
+  }, [isControlled, onChange, setCharCount]);
+  const hasContent = allowClear && currentValue.length > 0;
+  const minH = minRows * LINE_HEIGHT_PX + 16;
+  const maxH = maxRows ? maxRows * LINE_HEIGHT_PX + 16 : void 0;
+  const fieldSizingStyle = autoResize ? {
+    // field-sizing: content — suportado Chrome 123+, Firefox 129+
+    // TypeScript não conhece a propriedade ainda, cast necessário
+    ["fieldSizing"]: "content",
+    minHeight: minH,
+    ...maxH ? { maxHeight: maxH, overflowY: "auto" } : { overflowY: "hidden" }
+  } : { minHeight: minH, resize };
+  return /* @__PURE__ */ jsxs("span", { className: "relative inline-flex w-full min-w-0", children: [
+    /* @__PURE__ */ jsx(
+      "textarea",
+      {
+        ref: setRef,
+        "aria-invalid": status === "error" ? true : void 0,
+        disabled,
+        value: isControlled ? value : void 0,
+        defaultValue: isControlled ? void 0 : defaultValue,
+        maxLength,
+        onChange: handleChange,
+        onInput: autoResize ? adjustHeight : void 0,
+        className: cn(
+          textAreaInputBaseClasses,
+          sizeConfig.paddingClass,
+          sizeConfig.textClass,
+          hasContent && "pr-7",
+          // espaço para botão X
+          className
+        ),
+        style: { ...fieldSizingStyle, ...styleProp },
+        ...rest
+      }
+    ),
+    hasContent && /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        "aria-label": "Limpar",
+        tabIndex: -1,
+        onClick: handleClear,
+        className: textAreaClearButtonClasses,
+        children: /* @__PURE__ */ jsx(X, { className: "size-3.5" })
+      }
+    )
+  ] });
+});
+TextAreaInput.displayName = "TextArea.Input";
+function TextAreaCount({
+  maxLength,
+  className
+}) {
+  const { charCount } = useTextAreaContext();
+  const colorClass = maxLength ? textAreaCountColorClass(charCount, maxLength) : "text-muted-foreground";
+  return /* @__PURE__ */ jsx("span", { className: cn(textAreaCountBaseClasses, colorClass, className), children: maxLength ? `${charCount} / ${maxLength}` : charCount });
+}
+TextAreaCount.displayName = "TextArea.Count";
+function TextAreaFooter({ maxLength }) {
+  return /* @__PURE__ */ jsx("span", { className: "flex items-center justify-end px-3 pb-1.5", children: /* @__PURE__ */ jsx(TextAreaCount, { maxLength }) });
+}
+const TextArea = React.forwardRef(
+  function TextArea2({
+    variant = "outlined",
+    size = "md",
+    status = "default",
+    disabled,
+    allowClear = false,
+    showCount = false,
+    autoResize = false,
+    minRows,
+    maxRows,
+    fullWidth = true,
+    resize = "vertical",
+    className,
+    style,
+    maxLength,
+    ...inputProps
+  }, ref) {
+    return /* @__PURE__ */ jsxs(
+      TextAreaRoot,
+      {
+        variant,
+        size,
+        status,
+        disabled,
+        allowClear,
+        showCount,
+        autoResize,
+        minRows,
+        maxRows,
+        fullWidth,
+        className,
+        style,
+        children: [
+          /* @__PURE__ */ jsx(
+            TextAreaInput,
+            {
+              ref,
+              resize,
+              maxLength,
+              ...inputProps
+            }
+          ),
+          showCount && /* @__PURE__ */ jsx(TextAreaFooter, { maxLength })
+        ]
+      }
+    );
+  }
+);
+TextArea.displayName = "TextArea";
+Object.assign(TextArea, {
+  Root: TextAreaRoot,
+  Input: TextAreaInput,
+  Count: TextAreaCount
+});
+const TextAreaField = React.forwardRef(function TextAreaField2({
+  label,
+  hint,
+  required,
+  wrapperClassName,
+  status = "default",
+  id: idProp,
+  ...textAreaProps
+}, ref) {
+  const autoId = React.useId();
+  const id = idProp ?? autoId;
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-1.5", wrapperClassName), children: [
+    label && /* @__PURE__ */ jsxs("label", { htmlFor: id, className: "text-sm font-medium text-foreground", children: [
+      label,
+      required && /* @__PURE__ */ jsx("span", { className: "ml-1 text-destructive", "aria-hidden": true, children: "*" })
+    ] }),
+    /* @__PURE__ */ jsx(TextArea, { ref, id, status, ...textAreaProps }),
+    hint && /* @__PURE__ */ jsx("span", { className: cn("text-xs", textAreaHintClasses[status]), children: hint })
+  ] });
+});
+TextAreaField.displayName = "TextAreaField";
+const Textarea = TextArea;
+
+export { TextArea, TextAreaCount, TextAreaField, TextAreaInput, TextAreaRoot, Textarea };

package/dist/components/atoms/textarea/index.d.ts

@@ -0,0 +1,4 @@
+export * from "./components/text-area";
+export * from "./types";
+export * from "./variants";
+//# sourceMappingURL=index.d.ts.map

package/dist/components/atoms/textarea/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/atoms/textarea/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC;AACvC,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC"}

package/dist/components/atoms/textarea/index.js

@@ -0,0 +1,26 @@
+'use strict';
+
+var textArea = require('./components/text-area');
+var types = require('./types');
+var variants = require('./variants');
+
+
+
+Object.keys(textArea).forEach(function (k) {
+	if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
+		enumerable: true,
+		get: function () { return textArea[k]; }
+	});
+});
+Object.keys(types).forEach(function (k) {
+	if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
+		enumerable: true,
+		get: function () { return types[k]; }
+	});
+});
+Object.keys(variants).forEach(function (k) {
+	if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
+		enumerable: true,
+		get: function () { return variants[k]; }
+	});
+});

package/dist/components/atoms/textarea/index.mjs

@@ -0,0 +1,3 @@
+export * from './components/text-area';
+export * from './types';
+export * from './variants';

package/dist/components/atoms/textarea/types.d.ts

@@ -0,0 +1,86 @@
+import type { CSSProperties, ReactNode, TextareaHTMLAttributes } from "react";
+import type { Size, FieldState } from "../../../lib/shared/types";
+export type TextAreaSize = Size;
+export type TextAreaStatus = FieldState;
+export type TextAreaVariant = "outlined" | "ghost" | "filled";
+export type TextAreaResize = "none" | "vertical" | "horizontal" | "both";
+export interface TextAreaContextValue {
+    variant: TextAreaVariant;
+    size: TextAreaSize;
+    status: TextAreaStatus;
+    disabled?: boolean;
+    allowClear: boolean;
+    showCount: boolean;
+    autoResize: boolean;
+    minRows: number;
+    maxRows: number | undefined;
+    /** Contagem atual de caracteres — atualizada pelo TextAreaInput. */
+    charCount: number;
+    setCharCount: (n: number) => void;
+}
+export interface TextAreaRootProps {
+    variant?: TextAreaVariant;
+    size?: TextAreaSize;
+    status?: TextAreaStatus;
+    disabled?: boolean;
+    allowClear?: boolean;
+    /**
+     * Exibe contador de caracteres no rodapé do textarea.
+     * Se `maxLength` estiver definido no `TextAreaInput`, mostra "atual / max".
+     * A cor muda conforme a proximidade do limite.
+     */
+    showCount?: boolean;
+    /**
+     * O textarea cresce com o conteúdo até `maxRows`.
+     * Usa `field-sizing: content` (CSS moderno) com fallback via scrollHeight.
+     */
+    autoResize?: boolean;
+    /** Número mínimo de linhas visíveis. @default varia por size */
+    minRows?: number;
+    /** Número máximo de linhas antes de ativar scroll. Obrigatório com autoResize. */
+    maxRows?: number;
+    /**
+     * `true` por padrão — textarea ocupa 100% da largura do container.
+     * `false` para uso inline (ajuste via className).
+     */
+    fullWidth?: boolean;
+    children: ReactNode;
+    style?: CSSProperties;
+    className?: string;
+}
+export interface TextAreaInputProps extends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, "size"> {
+    /**
+     * Comportamento de redimensionamento manual.
+     * Ignorado quando `autoResize=true` (o componente controla o tamanho).
+     * @default "vertical"
+     */
+    resize?: TextAreaResize;
+    style?: CSSProperties;
+    className?: string;
+}
+export interface TextAreaProps extends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, "size"> {
+    variant?: TextAreaVariant;
+    size?: TextAreaSize;
+    status?: TextAreaStatus;
+    disabled?: boolean;
+    allowClear?: boolean;
+    showCount?: boolean;
+    autoResize?: boolean;
+    minRows?: number;
+    maxRows?: number;
+    fullWidth?: boolean;
+    resize?: TextAreaResize;
+    style?: CSSProperties;
+    className?: string;
+}
+export interface TextAreaFieldProps extends TextAreaProps {
+    /** Label acima do textarea. */
+    label?: ReactNode;
+    /** Texto de hint abaixo do textarea. Colorido conforme `status`. */
+    hint?: ReactNode;
+    /** Exibe asterisco vermelho ao lado do label. */
+    required?: boolean;
+    /** className aplicado ao wrapper externo (label + textarea + hint). */
+    wrapperClassName?: string;
+}
+//# sourceMappingURL=types.d.ts.map