import { j as t } from "../../../_virtual/jsx-runtime.js";
import { useState as l, useEffect as u } from "react";
import O from "../../../icons/AlertTriangle.js";
import { getId as R } from "../../../utils/index.js";
import { Wrapper as q, LabelWrapper as z, Label as D, Text as E, Border as G, SupportingText as H, ErrorMessage as J, AssistMessage as K } from "../styles.js";
import { getCharacterCount as N } from "../utils.js";
import { TextAreaInput as P } from "./styles.js";
function v({
  autoComplete: C = !1,
  disabled: e = !1,
  label: r,
  id: d,
  name: n,
  placeholder: L,
  required: A = !0,
  showCharCount: g = !1,
  width: S,
  maxChar: m,
  minChar: y,
  hasError: a = !1,
  errorText: x,
  touched: i,
  assistText: s,
  optionalText: B = "Optional",
  variant: I,
  onChange: T,
  onKeyUp: k,
  onBlur: w,
  onFocus: M,
  value: o,
  ...c
}) {
  const [W, j] = l(0), [f, $] = l(!1);
  u(() => {
    o && typeof o == "string" && j(o.length);
  }, []), u(() => {
    $(typeof i > "u" ? a : a && i);
  }, [a, i]);
  function F(h) {
    j(h.target.value.length), T(h);
  }
  const p = R(c["data-testid"]);
  return /* @__PURE__ */ t.jsxs(q, { "data-testid": p("text-area"), width: S, children: [
    /* @__PURE__ */ t.jsxs(z, { disabled: e, hasLabel: !!(r != null && r.length), children: [
      r && /* @__PURE__ */ t.jsx(D, { htmlFor: d || `input-${n}`, disabled: e, children: r }),
      !A && !g && /* @__PURE__ */ t.jsx(E, { children: B }),
      g && /* @__PURE__ */ t.jsx(E, { "data-testid": p("character-count"), children: N(W, m) })
    ] }),
    /* @__PURE__ */ t.jsx(G, { hasError: f, disabled: e, children: /* @__PURE__ */ t.jsx(
      P,
      {
        id: d || `input-${n}`,
        name: n,
        placeholder: L,
        variant: I,
        autoComplete: C ? "on" : "off",
        disabled: e,
        maxLength: m,
        minLength: y,
        value: String(o),
        onChange: F,
        onKeyUp: k,
        onBlur: w,
        onFocus: M,
        "data-testid": p(),
        "data-trackid": c["data-trackid"],
        "aria-label": c["aria-label"] || r
      }
    ) }),
    /* @__PURE__ */ t.jsxs(H, { children: [
      !!x && f && !e && /* @__PURE__ */ t.jsxs(J, { children: [
        /* @__PURE__ */ t.jsx(O, { width: 20, height: 20 }),
        x
      ] }),
      !f && (typeof s == "string" ? /* @__PURE__ */ t.jsx(K, { children: s }) : s)
    ] })
  ] });
}
export {
  v as TextArea
};
