@uva-glass/component-library/dist/components/TextArea/TextArea.js

React components UvA

import { jsxs as r, jsx as _ } from "react/jsx-runtime";
import { useRef as u, useState as i } from "react";
import { c as x } from "../../clsx-OuTLNxxd.js";
import '../../assets/TextArea.css';const t = {
  "text-area__wrapper": "_text-area__wrapper_13ivw_1",
  "text-area__header": "_text-area__header_13ivw_7",
  "text-area__label": "_text-area__label_13ivw_13",
  "text-area__word-count": "_text-area__word-count_13ivw_20",
  "text-area__word-count--alert": "_text-area__word-count--alert_13ivw_25",
  "text-area": "_text-area_13ivw_1"
};
function h({ onChange: l, label: c, maxCharacters: a = 0 }) {
  const e = u(null), [n, o] = i(0), s = () => {
    e.current && (e.current.style.height = "auto", e.current.style.height = `${e.current.scrollHeight}px`, o(e.current.value.length), l(e.current.value.trim()));
  };
  return /* @__PURE__ */ r("div", { className: t["text-area__wrapper"], children: [
    /* @__PURE__ */ r("div", { className: t["text-area__header"], children: [
      /* @__PURE__ */ _("span", { className: t["text-area__label"], children: c }),
      a > 0 && /* @__PURE__ */ r("div", { className: t["text-area__word-count"], children: [
        /* @__PURE__ */ _("span", { className: x({ [t["text-area__word-count--alert"]]: n === a }), children: n }),
        " / ",
        a
      ] })
    ] }),
    /* @__PURE__ */ _(
      "textarea",
      {
        ref: e,
        className: t["text-area"],
        maxLength: a > 0 ? a : void 0,
        onInput: s
      }
    )
  ] });
}
export {
  h as TextArea
};
//# sourceMappingURL=TextArea.js.map