import { defineComponent as M, ref as g, reactive as R, computed as h, watch as F, onMounted as P, nextTick as v, openBlock as x, createElementBlock as E, normalizeStyle as z, normalizeClass as A, withDirectives as $, createElementVNode as U, vModelText as j, withModifiers as q, createCommentVNode as G } from "vue";
import { C as n } from "./base-PQGakkrl.js";
const J = ["name", "placeholder", "disabled"], ee = /* @__PURE__ */ M({
  name: "ClInputTextarea",
  __name: "Index",
  props: {
    value: {
      type: String,
      default: ""
    },
    className: {
      type: String,
      default: ""
    },
    width: {
      type: String,
      default: ""
    },
    height: {
      type: String,
      default: "100px"
    },
    name: {
      type: String,
      default: ""
    },
    placeholder: {
      type: String,
      default: ""
    },
    disabled: {
      type: Boolean,
      default: !1
    },
    isClean: {
      type: Boolean,
      default: !1
    },
    isAutoHeight: {
      type: Boolean,
      default: !1
    },
    changDelayTime: {
      type: Number,
      default: 200
    },
    heightMax: {
      type: String,
      default: ""
    }
  },
  emits: ["update:value", "onChange", "onInit", "onKeydownEnter", "onKeyupEnter", "onFocus", "onBlur", "onChangeDelay"],
  setup(p, { expose: C, emit: D }) {
    const a = p, o = D, u = g(null), r = R({
      height: a.height || "100px"
    }), s = g(a.value || ""), l = {
      lastValue: a.value || "",
      prevDelayValue: a.value || "",
      valueDelayRun: !1
    }, V = h(() => {
      let e = a.name;
      return n.isEmpty(e) && (e = `textarea_${n.getRandom(8)}`), e;
    }), T = h(() => a.isClean && !a.disabled && !n.isEmpty(s.value)), k = h(() => {
      const e = {
        "panel-textarea": !0,
        "box-width": !0,
        "textarea-clean": a.isClean
      };
      return a.className && !n.isEmpty(a.className) && a.className.split(" ").forEach((t) => {
        n.isEmpty(t) || (e[t] = !0);
      }), e;
    }), _ = h(() => {
      const { width: e, heightMax: t } = a, i = {};
      return n.isEmpty(e) || (i.width = e), n.isEmpty(r.height) || (i.height = r.height), t && !n.isEmpty(t) && (i["max-height"] = t), i;
    }), m = () => {
      if (a.isAutoHeight) {
        const e = u.value;
        if (e) {
          e.style.height = a.height || "100px";
          const t = e.scrollHeight + e.scrollTop + (e.offsetHeight - e.clientHeight);
          e.style.height = "100%", r.height = t > 0 ? `${t}px` : a.height || "100px";
        }
      }
    }, y = () => {
      u.value?.focus();
    }, d = (e) => {
      e !== l.lastValue && (l.lastValue = e, o("update:value", e), o("onChange", e), w(e));
    };
    let c;
    const w = (e) => {
      c && (clearTimeout(c), c = null), l.valueDelayRun = !0, c = setTimeout(() => {
        l.valueDelayRun = !1, l.prevDelayValue !== e && (l.prevDelayValue = e, o("onChangeDelay", e));
      }, a.changDelayTime || 200);
    }, B = () => {
      v(() => {
        o("onInit");
      });
    };
    F(
      () => a.value,
      (e, t) => {
        e !== t && (s.value = e || "", l.lastValue = e || "", m(), l.valueDelayRun || (l.prevDelayValue = e || ""));
      }
    ), P(() => {
      v(() => {
        B();
      });
    });
    const I = (e) => {
      const t = e.target.value;
      m(), d(t);
    }, S = (e) => {
      e.key === "Enter" && o("onKeydownEnter", e);
    }, H = (e) => {
      e.key === "Enter" && o("onKeyupEnter", e);
    }, N = () => {
      s.value = "", d(""), y();
    }, b = () => {
      o("onFocus");
    }, K = () => {
      o("onBlur");
    }, f = () => n.trim(s.value);
    return C({
      getValue: f,
      getValueData: () => ({ value: f(), show: s.value }),
      setValue: (e) => {
        const t = n.isEmpty(e) ? "" : e;
        l.lastValue = t, l.prevDelayValue = t, s.value = t, m();
      },
      initHeight: () => {
        r.height = a.height || "100px";
      },
      focus: () => {
        y();
      },
      getParentElement: () => u.value?.parentElement || null
    }), (e, t) => (x(), E("div", {
      class: A(k.value),
      style: z(_.value)
    }, [
      $(U("textarea", {
        ref_key: "refElTextarea",
        ref: u,
        class: "form-control text-area",
        "onUpdate:modelValue": t[0] || (t[0] = (i) => s.value = i),
        name: V.value,
        placeholder: p.placeholder,
        disabled: p.disabled,
        onInput: I,
        onKeydown: S,
        onKeyup: H,
        onFocus: b,
        onBlur: K
      }, null, 40, J), [
        [j, s.value]
      ]),
      T.value ? (x(), E("i", {
        key: 0,
        class: "textarea-clear-icon clIconFont clIcon-close-circle-fill",
        onClick: q(N, ["stop"])
      })) : G("", !0)
    ], 6));
  }
});
export {
  ee as _
};
//# sourceMappingURL=Index.vue_vue_type_script_setup_true_lang-CNa69faz.js.map
