(function(){"use strict";try{if(typeof document<"u"){var r=document.createElement("style");r.appendChild(document.createTextNode(".ui-text-area{--contour-color: var(--txt-01);--label-color: var(--txt-01);--contour-border-width: 1px;--contour-box-shadow: none;--label-offset-left-x: 8px;--label-offset-right-x: 8px;--prefix-color: var(--color-placeholder);width:100%;min-height:var(--control-height);position:relative;border-radius:var(--border-radius-control);display:flex;flex-direction:row;align-items:center;outline:none}.ui-text-area__envelope{font-family:var(--font-family-base)}.ui-text-area textarea{min-height:calc(var(--control-height) - 2px);width:100%;padding:10px 12px;border:none;font-size:inherit;background-color:transparent;color:var(--txt-01);caret-color:var(--border-color-focus);cursor:inherit;resize:none;--thumb-color: var(--ic-02);overflow-y:auto}.ui-text-area textarea::-webkit-scrollbar{width:var(--scrollbar-width, 6px);height:5px;background-color:transparent;display:block}.ui-text-area textarea::-webkit-scrollbar-thumb{background:var(--thumb-color);border-radius:5px}.ui-text-area textarea::-webkit-scrollbar-thumb:hover{--thumb-color: var(--border-color-focus)}.ui-text-area textarea:focus{outline:none}.ui-text-area textarea::placeholder{color:var(--color-placeholder)}.ui-text-area label{display:flex;align-items:center;gap:4px;position:absolute;top:0;transform:translateY(-60%);left:var(--label-offset-left-x);padding:0 4px;max-width:calc(100% - 16px);overflow:hidden;white-space:pre;text-overflow:ellipsis;cursor:inherit;color:var(--label-color);font-size:12px;font-weight:500;border-bottom-right-radius:4px;border-bottom-left-radius:4px;background:var(--bg-elevated-01)}.ui-text-area label>span{overflow:hidden;white-space:pre;text-overflow:ellipsis}.ui-text-area__contour{position:absolute;top:0;left:0;right:0;bottom:0;border-radius:var(--border-radius-control);border-width:var(--contour-border-width);border-color:var(--contour-color);border-style:solid;box-shadow:var(--contour-box-shadow);z-index:0;pointer-events:none}.ui-text-area__append{display:flex;flex-direction:row;align-items:center;gap:4px}.ui-text-area__helper{font-size:12px;color:var(--txt-03);padding:2px 0 0;white-space:pre-wrap;text-overflow:ellipsis;font-weight:500;line-height:16px;margin-top:6px}.ui-text-area__error{font-size:12px;color:var(--txt-error);padding:2px 0 0;white-space:pre-wrap;text-overflow:ellipsis;font-weight:500;line-height:16px;margin-top:6px}.ui-text-area:hover{--contour-color: var(--control-hover-color)}.ui-text-area:focus-within:not(.error){--label-color: var(--txt-focus);--contour-color: var(--border-color-focus);--contour-border-width: 2px;--contour-box-shadow: 0 0 0 4px var(--border-color-focus-shadow)}.ui-text-area:focus-within.error{--contour-border-width: 2px;--contour-box-shadow: 0 0 0 4px var(--color-error-shadow)}.ui-text-area.dashed .ui-text-area__contour{border-style:dashed}.ui-text-area.nonEmpty{--prefix-color: var(--txt-01)}.ui-text-area.error{--contour-color: var(--txt-error)}.ui-text-area.disabled{--contour-color: var(--color-dis-01);cursor:not-allowed;pointer-events:none}.ui-text-area.disabled *{color:var(--contour-color)}")),document.head.appendChild(r)}}catch(o){console.error("vite-plugin-css-injected-by-js",o)}})();
import { defineComponent as C, useSlots as S, ref as y, computed as l, onMounted as D, createElementBlock as a, openBlock as o, createElementVNode as s, createCommentVNode as n, normalizeClass as N, withDirectives as $, createVNode as q, createBlock as v, unref as i, toDisplayString as u, withCtx as M, renderSlot as _, vModelText as j } from "vue";

import H from "../PlTooltip/PlTooltip.vue.js";
import P from "../../utils/DoubleContour.vue.js";
import { useLabelNotch as T } from "../../utils/useLabelNotch.js";
import { useValidation as z } from "../../utils/useValidation.js";
import { getErrorMessage as A } from "../../helpers/error.js";
import I from "../PlSvg/PlSvg.vue.js";
import L from "../../assets/images/required.svg.js";
const R = { class: "ui-text-area__envelope" }, U = {
  key: 0,
  ref: "label"
}, x = ["readonly", "rows", "disabled", "placeholder"], F = { class: "ui-text-area__append" }, G = {
  key: 0,
  class: "ui-text-area__error"
}, J = {
  key: 1,
  class: "ui-text-area__helper"
}, K = {
  name: "PlTextArea"
}, te = /* @__PURE__ */ C({
  ...K,
  props: {
    modelValue: {},
    label: {},
    required: { type: Boolean },
    error: {},
    helper: {},
    placeholder: {},
    disabled: { type: Boolean },
    readonly: { type: Boolean },
    dashed: { type: Boolean },
    rows: {},
    autogrow: { type: Boolean },
    rules: {}
  },
  emits: ["update:modelValue"],
  setup(b, { emit: g }) {
    const k = S(), V = g, r = b, p = y(), m = y(), d = l({
      get() {
        return r.modelValue ?? "";
      },
      set(e) {
        V("update:modelValue", e);
      }
    }), w = l(() => !!r.modelValue), B = z(d, r.rules || []);
    T(p);
    const c = l(() => {
      const e = [], t = A(r.error);
      return t && e.push(t), e.push(...B.value.errors), e;
    }), h = l(() => c.value.length > 0), f = () => {
      if (!r.autogrow)
        return;
      const e = m.value;
      e && (e.style.height = "auto", e.style.height = `${e.scrollHeight}px`);
    };
    return D(() => {
      f();
    }), (e, t) => (o(), a("div", R, [
      s("div", {
        ref_key: "root",
        ref: p,
        class: N(["ui-text-area", { error: h.value, disabled: e.disabled, dashed: e.dashed, nonEmpty: w.value }])
      }, [
        e.label ? (o(), a("label", U, [
          e.required ? (o(), v(i(I), {
            key: 0,
            uri: i(L)
          }, null, 8, ["uri"])) : n("", !0),
          s("span", null, u(e.label), 1),
          i(k).tooltip ? (o(), v(i(H), {
            key: 1,
            class: "info",
            position: "top"
          }, {
            tooltip: M(() => [
              _(e.$slots, "tooltip")
            ]),
            _: 3
          })) : n("", !0)
        ], 512)) : n("", !0),
        $(s("textarea", {
          ref_key: "input",
          ref: m,
          "onUpdate:modelValue": t[0] || (t[0] = (E) => d.value = E),
          readonly: e.readonly,
          rows: e.rows,
          disabled: e.disabled,
          placeholder: e.placeholder ?? "...",
          spellcheck: "false",
          onInput: f
        }, null, 40, x), [
          [j, d.value]
        ]),
        s("div", F, [
          _(e.$slots, "append")
        ]),
        q(P, { class: "ui-text-area__contour" })
      ], 2),
      h.value ? (o(), a("div", G, u(c.value.join(" ")), 1)) : e.helper ? (o(), a("div", J, u(e.helper), 1)) : n("", !0)
    ]));
  }
});
export {
  te as default
};
//# sourceMappingURL=PlTextArea.vue.js.map
