@cldemo/ui-kit 1.0.0

package/buildLibs/utils/Web/ClInputTag.js

@@ -0,0 +1,854 @@
+import { defineComponent as he, inject as Te, ref as k, reactive as ge, computed as U, watch as Y, onMounted as ye, nextTick as V, openBlock as f, createElementBlock as y, withModifiers as Se, normalizeStyle as we, normalizeClass as me, createElementVNode as ae, createVNode as $, createBlock as fe, Fragment as W, toRaw as Ce, unref as xe, renderList as Le, toDisplayString as be, createCommentVNode as De, provide as Ve, withCtx as Ie } from "vue";
+import { C as l } from "../Shared/base-PQGakkrl.js";
+import { _ as Ke } from "../Shared/List.vue_vue_type_script_setup_true_lang-DzmylhZ6.js";
+import { _ as He } from "../Shared/Index.vue_vue_type_script_setup_true_lang-CejRfZxl.js";
+import { _ as Me } from "../Shared/Index.vue_vue_type_script_setup_true_lang-CNa69faz.js";
+import { _ as Oe } from "../Shared/Index.vue_vue_type_script_setup_true_lang-C4rRquU-.js";
+import { _ as Be } from "../Shared/Index.vue_vue_type_script_setup_true_lang-DWw1B8Z2.js";
+import { _ as Fe } from "../Shared/Index.vue_vue_type_script_setup_true_lang-DKAxas3I.js";
+import { C as re } from "../Shared/index-BnerInzC.js";
+import { _ as Je } from "../Shared/Index.vue_vue_type_script_setup_true_lang-B_jfFc6B.js";
+import { _ as Ee } from "../Shared/One.vue_vue_type_script_setup_true_lang-BuNRS-9u.js";
+import { C as $e } from "../Shared/Ing-C_3NkQxd.js";
+import { u as Ae } from "../Shared/language-DxTlvFs2.js";
+const Ne = { key: 0 }, je = { key: 1 }, _e = { class: "inputTag-operate" }, ke = /* @__PURE__ */ he({
+  name: "ClInputTagInput",
+  __name: "Input",
+  props: {
+    value: String,
+    placeholder: String,
+    disabled: {
+      type: Boolean,
+      default: !1
+    },
+    isClean: {
+      type: Boolean,
+      default: !0
+    },
+    multiple: {
+      type: Boolean,
+      default: !1
+    },
+    isCopy: {
+      type: Boolean,
+      default: !1
+    },
+    isCopyMultipleWrap: {
+      type: Boolean,
+      default: !0
+    },
+    copyJoinKey: {
+      type: String,
+      default: ","
+    },
+    minHeight: String,
+    joinKey: {
+      type: String,
+      default: ","
+    },
+    isDropdownLayer: {
+      type: Boolean,
+      default: !0
+    },
+    textMaxHeight: String,
+    tagsMaxHeight: String,
+    isShowNum: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  emits: ["onInit", "onChange", "onChangeInput", "onFocus"],
+  setup(s, { expose: Z, emit: ee }) {
+    const t = s, K = ee, H = Te("$InputTagTop"), T = k(null), h = k(null), C = k(null), g = ge({
+      isFocus: !1
+    }), M = k([]), m = k([]), I = k(""), p = U(() => !l.isEmpty(m.value) || !l.isEmpty(I.value)), B = U(() => t.isClean && !t.disabled && p.value), L = U(() => ({
+      "dropdownLayer-text-container": t.isDropdownLayer,
+      "inputTag-container": !0,
+      "inputTag-multiple": t.multiple,
+      "inputTag-focus": g.isFocus
+    })), F = U(() => {
+      const i = {};
+      return t.multiple && (l.isEmpty(t.minHeight) || (i["min-height"] = t.minHeight)), i;
+    }), b = U(() => {
+      const i = {}, { multiple: u, tagsMaxHeight: x } = t;
+      return u && x && !l.isEmpty(x) && (i["max-height"] = x), i;
+    }), A = () => {
+      let i = "";
+      if (t.multiple) {
+        const u = t.copyJoinKey + (t.isCopyMultipleWrap ? `
+` : "");
+        i = m.value.join(u);
+      } else
+        i = I.value;
+      return i;
+    }, v = () => t.multiple ? m.value.join(t.joinKey) : I.value, N = (i = "tag") => {
+      const u = v();
+      K("onChange", u, i);
+    }, q = () => {
+      V(() => {
+        K("onInit");
+      });
+    }, X = (i) => {
+      K("onChangeInput", i);
+    }, z = (i) => {
+      K("onFocus", i);
+    }, P = (i) => {
+      if (i && !l.isEmpty(i) && i !== v())
+        if (t.multiple) {
+          const u = [], x = [];
+          l.split(i, t.joinKey).forEach((D) => {
+            const O = l.trim(D);
+            !l.isEmpty(O) && !l.isExistValue(x, O) && (u.push({ id: `inputTag_${l.getRandom(8)}`, name: O }), x.push(O));
+          }), M.value = u, m.value = l.getArrUnique(x);
+        } else
+          I.value = i;
+      else
+        M.value = [], m.value = [], I.value = "";
+    }, G = (i) => {
+      const u = l.trim(i);
+      T.value.addInfo({
+        id: `inputTag_${l.getRandom(8)}`,
+        name: u
+      }), h.value.initHeight(), h.value.setValue();
+    }, R = () => {
+      t.multiple ? h.value && h.value.focus() : C.value && C.value.focus();
+    }, Q = (i) => {
+      if (t.multiple) {
+        const u = Ce(m.value);
+        l.split(i, t.joinKey).forEach((x) => {
+          const D = l.trim(x);
+          l.isEmpty(D) || (G(D), l.isExistValue(u, D) || u.push(D));
+        }), m.value = l.getArrUnique(u);
+      } else
+        I.value = i;
+      R(), N("drop");
+    };
+    Y(
+      () => t.value,
+      (i, u) => {
+        i !== u && i !== v() && P(i), h.value && (h.value.setValue(""), h.value.initHeight());
+      }
+    ), Y(
+      () => t.disabled,
+      () => {
+        h.value && (h.value.setValue(""), h.value.initHeight());
+      }
+    );
+    const o = () => {
+      P(t.value), q();
+    };
+    ye(() => {
+      V(() => {
+        o();
+      });
+    });
+    const c = (i) => {
+      if (t.multiple) {
+        const u = h.value.getParentElement();
+        u.contains(i.target) || u === i.target || R();
+      }
+    }, E = (i) => {
+      l.isEmpty(H.getListHoverVaueKeydown()) && (i.preventDefault(), i.stopPropagation());
+    }, j = (i) => {
+      const u = i.target.value;
+      if (l.isEmpty(H.getListHoverVaueKeydown())) {
+        if (i.preventDefault(), i.stopPropagation(), !l.isEmpty(u)) {
+          const x = Ce(m.value);
+          let D = [];
+          l.isExistValue(u, `
+`) ? l.split(u, `
+`).forEach((O) => {
+            l.isEmpty(O) || D.push(...l.split(O, t.joinKey));
+          }) : D = l.split(u, t.joinKey), D.forEach((O) => {
+            const te = l.trim(O);
+            l.isEmpty(te) || (G(te), l.isExistValue(x, te) || x.push(te));
+          }), m.value = l.getArrUnique(x), N();
+        }
+      } else
+        h.value.initHeight(), h.value.setValue();
+    }, J = () => {
+      g.isFocus = !0;
+    }, ne = () => {
+      g.isFocus = !1;
+    }, ue = () => {
+      const i = T.value.getData();
+      m.value = i.map((u) => u.name), N();
+    }, le = () => {
+      M.value = [], m.value = [], I.value = "", N(), R();
+    }, se = (i) => {
+      X(i);
+    }, ie = () => {
+      z(I.value);
+    };
+    return Z({
+      getValue: () => v(),
+      setValue: (i) => {
+        P(i);
+      },
+      focus: () => {
+        R();
+      },
+      updateValue: (i) => {
+        Q(i);
+      }
+    }), (i, u) => (f(), y("div", {
+      class: me(L.value),
+      style: we(F.value),
+      onClick: Se(c, ["stop"])
+    }, [
+      s.multiple ? (f(), y("div", Ne, [
+        ae("div", {
+          class: "inputTag-tags",
+          style: we(b.value)
+        }, [
+          $(Oe, {
+            ref_key: "refElTag",
+            ref: T,
+            disabled: s.disabled,
+            list: M.value,
+            onOnRemove: ue
+          }, null, 8, ["disabled", "list"])
+        ], 4),
+        $(Me, {
+          ref_key: "refElTextarea",
+          ref: h,
+          height: "20px",
+          heightMax: s.textMaxHeight,
+          disabled: s.disabled,
+          placeholder: s.disabled ? "" : s.placeholder,
+          isClean: !1,
+          isAutoHeight: !0,
+          onOnKeydownEnter: E,
+          onOnKeyupEnter: j,
+          onOnFocus: J,
+          onOnBlur: ne,
+          onOnChangeDelay: se
+        }, null, 8, ["heightMax", "disabled", "placeholder"])
+      ])) : (f(), y("div", je, [
+        $(Be, {
+          ref_key: "refElInput",
+          ref: C,
+          value: I.value,
+          "onUpdate:value": u[0] || (u[0] = (x) => I.value = x),
+          placeholder: s.placeholder,
+          isClean: !1,
+          disabled: s.disabled,
+          onOnFocus: ie,
+          onOnChangeDelay: se
+        }, null, 8, ["value", "placeholder", "disabled"])
+      ])),
+      ae("div", _e, [
+        s.isShowNum && s.multiple && m.value.length > 1 ? (f(), fe(He, {
+          key: 0,
+          num: m.value.length
+        }, null, 8, ["num"])) : (f(), y(W, { key: 1 }, [], 64)),
+        B.value ? (f(), y("i", {
+          key: 2,
+          class: "inputTag-clear clIconFont clIcon-close-circle-fill inputTag-operate-btn",
+          onClick: Se(le, ["stop"])
+        })) : (f(), y(W, { key: 3 }, [], 64)),
+        s.isCopy && p.value ? (f(), fe(Fe, {
+          key: 4,
+          className: "inputTag-operate-btn",
+          textLabel: A()
+        }, null, 8, ["textLabel"])) : (f(), y(W, { key: 5 }, [], 64))
+      ])
+    ], 6));
+  }
+}), Pe = { class: "dropdownLayer-list-container" }, Re = {
+  key: 0,
+  class: "dropdownLayer-list-search"
+}, Ue = {
+  key: 2,
+  class: "dropdownLayer-list-checkboxAll"
+}, We = { key: 0 }, qe = ["onClick"], ze = {
+  key: 0,
+  class: "dropdownLayer-list-checkbox"
+}, Ge = ["innerHTML"], Qe = { key: 1 }, Xe = {
+  key: 0,
+  class: "dropdownLayer-list-empty"
+}, Ye = {
+  key: 1,
+  class: "inputTag-load"
+}, Ze = /* @__PURE__ */ he({
+  name: "ClDropdownlayerSearchList",
+  __name: "Dropdown",
+  props: {
+    isSearch: {
+      type: Boolean,
+      default: !1
+    },
+    searchValue: String,
+    searchPlaceholder: String,
+    searchKey: {
+      type: Array,
+      default: () => ["name"]
+    },
+    searchKeyType: {
+      type: String,
+      default: "||"
+    },
+    isMultiple: {
+      type: Boolean,
+      default: !1
+    },
+    isCheckBoxAll: {
+      type: Boolean,
+      default: !1
+    },
+    showDropDownTextFormat: String,
+    originalData: {
+      type: Array,
+      default: () => []
+    },
+    keyIndex: String,
+    isOpen: {
+      type: Boolean,
+      default: !1
+    },
+    selectId: {
+      type: Array,
+      default: () => []
+    },
+    isShowEmptyLabel: {
+      type: Boolean,
+      default: !0
+    },
+    serverCallback: Function,
+    isShowLoading: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  emits: ["onChange", "onSearchResult"],
+  setup(s, { expose: Z, emit: ee }) {
+    const t = s, K = ee, { optPageLanguage: H, getPageLanguage: T } = Ae();
+    T("common");
+    const h = Te("$InputTagTop"), C = k(null), g = k(null);
+    let M = 0, m = !0, I = 0;
+    const p = { start: -1, end: -1, limit: 50 }, B = ge({
+      isRunLoading: !1
+    }), L = `dropdownLayer-list-${t.keyIndex}`, F = k(""), b = k([]), A = k([]);
+    let v = l.getListClone(t.originalData), N = !1;
+    const q = {
+      isScrollLoadIng: !1
+    }, X = U(() => {
+      let e = !1;
+      return A.value.length > 0 && t.selectId.length >= A.value.length && (e = l.isContainArr(t.selectId, A.value)), e;
+    }), z = (e, a) => {
+      K("onChange", e, a);
+    }, P = (e, a) => {
+      K("onSearchResult", { search: e, isEmpty: a });
+    }, G = async (e) => {
+      let a = [];
+      if (t.serverCallback)
+        t.isShowLoading && (B.isRunLoading = !0), a = await t.serverCallback({ search: e, offset: 0 }), V(() => {
+          B.isRunLoading = !1, h.convertListToJson(a), V(() => {
+            R(e, a);
+          });
+        });
+      else if (l.isEmpty(e))
+        a = t.originalData;
+      else {
+        const n = e.toLowerCase(), r = t.searchKey.length, S = t.searchKey;
+        t.originalData.forEach((d) => {
+          const w = [];
+          for (let _ = 0; _ < r; _++)
+            d[S[_]].toLowerCase().indexOf(n) > -1 && w.push(!0);
+          if (w.length > 0)
+            switch (t.searchKeyType) {
+              case "||":
+                a.push(d);
+                break;
+              case "&&":
+                w.length === r && a.push(d);
+                break;
+            }
+        }), R(e, a);
+      }
+    }, R = (e, a) => {
+      v = a, b.value = o(0, p.limit), g.value.scrollTop = 0, E(0, p.limit), Q(), F.value = "", P(e, a.length === 0);
+    }, Q = () => {
+      const e = [];
+      v.forEach((a) => {
+        const n = a.id.toString();
+        a.isDisabled ? l.isExistValue(t.selectId, n) && e.push(n) : e.push(n);
+      }), A.value = e;
+    }, o = (e, a) => {
+      const n = [], r = v.length, S = e < 0 ? 0 : e, d = a <= r ? a : r;
+      if (S < d)
+        for (let w = S; w < d; w++)
+          n.push(v[w]);
+      return n;
+    }, c = (e, a) => {
+      let n = 0, r = 0;
+      switch (a) {
+        case "prev":
+          n = e - p.limit, r = e;
+          break;
+        case "next":
+          n = e, r = n + p.limit;
+          break;
+      }
+      return o(n, r);
+    }, E = (e, a) => {
+      let n = p.start;
+      (n === -1 || e < n) && (n = e), n = n <= 0 ? 0 : n;
+      let r = p.end;
+      (n === -1 || a > r) && (r = a), r = a <= v.length ? a : v.length, p.start = n, p.end = r;
+    }, j = () => {
+      let e = -1, a = -1;
+      l.isEmpty(t.selectId) || v.some((S, d) => {
+        const w = S.id.toString(), _ = l.isExistValue(t.selectId, w);
+        return _ && (e = d, a = w), _;
+      });
+      let n = 0, r = 0;
+      e === -1 ? (M = 0, n = 0, r = p.limit) : (n = e - p.limit * 1, r = e + p.limit * 1), b.value = o(n, r), E(n, r), a !== -1 && b.value.some((S, d) => {
+        const w = S.id.toString() === a;
+        return w && (M = d), w;
+      });
+    }, J = (e) => {
+      V(() => {
+        if (e > 0) {
+          const a = g.value.children[0].children[e];
+          g.value.scrollTop = a.offsetTop > 180 ? a.offsetTop - 50 : 0;
+        } else
+          g.value.scrollTop = 0;
+      });
+    }, ne = () => {
+      m && (m = !1, j(), V(() => {
+        C.value && C.value.setValue(""), l.isEmpty(t.searchValue) && g.value && J(M);
+      }));
+    }, ue = async (e) => {
+      const a = e.target, n = a.scrollTop, r = a.offsetHeight, S = a.children[0].offsetHeight;
+      if (n > I) {
+        if (n + r + 100 > S && !q.isScrollLoadIng) {
+          if (q.isScrollLoadIng = !0, p.end >= v.length && t.serverCallback) {
+            const d = {
+              offset: v.length
+            };
+            l.isEmpty(t.searchValue) || (d.search = t.searchValue);
+            const w = await t.serverCallback(d);
+            v.push(...w), Q(), h.convertListToJson(w);
+          }
+          if (p.end < v.length) {
+            const d = c(p.end, "next");
+            b.value.push(...d), E(p.start, p.end + p.limit);
+          }
+          q.isScrollLoadIng = !1;
+        }
+      } else if (n < 130 && p.start > 0) {
+        const d = c(p.start, "prev"), w = d.length;
+        w > 0 && (b.value.unshift(...d), E(p.start - p.limit, p.end), V(() => {
+          let _ = 0;
+          for (let oe = 0; oe < w; oe++)
+            _ += g.value.children[0].children[oe].offsetHeight;
+          g.value.scrollTop += _;
+        }));
+      }
+      I = n;
+    }, le = () => {
+      N || (N = !0, V(() => {
+        g.value && g.value.addEventListener("scroll", ue);
+      }));
+    }, se = (e) => l.isEmpty(t.showDropDownTextFormat) ? e.name : l.convertStringFormat(t.showDropDownTextFormat, e), ie = (e) => {
+      const a = [];
+      return t.isMultiple ? (t.selectId.forEach((n) => {
+        n !== e && a.push(n);
+      }), l.isExistValue(t.selectId, e) || a.push(e)) : a.push(e), a;
+    }, ce = (e) => {
+      const a = b.value;
+      let n = -1;
+      if (a.length > 0) {
+        const r = F.value;
+        r.length > 0 ? (a.forEach((S, d) => {
+          S.id.toString() === r && (n = d);
+        }), n += e, n < 0 ? n = 0 : n >= a.length && (n = a.length - 1)) : n = 0;
+      }
+      F.value = a[n].id.toString(), J(n);
+    }, de = (e) => {
+      let a = e.keyCode;
+      if (!l.isUndefined(a))
+        switch (a = a.toString(), a) {
+          case "13":
+            e.preventDefault(), e.stopPropagation();
+            break;
+          case "38":
+            e.preventDefault(), e.stopPropagation(), ce(-1);
+            break;
+          case "40":
+            e.preventDefault(), e.stopPropagation(), ce(1);
+            break;
+        }
+    }, pe = (e) => {
+      let a = e.keyCode;
+      if (!l.isUndefined(a))
+        switch (a = a.toString(), a) {
+          case "27":
+            break;
+          case "13":
+            const n = F.value, r = ie(n);
+            z(r, { id: n, isSelect: t.selectId.indexOf(n) > -1 });
+            break;
+        }
+    }, ve = () => {
+      ne(), Q(), le();
+      const { searchValue: e } = t;
+      e && !l.isEmpty(e) && G(e);
+    };
+    Y(
+      () => t.isOpen,
+      (e) => {
+        le(), e && ne();
+      }
+    ), Y(
+      () => t.originalData,
+      (e) => {
+        m = !0, v = l.getListClone(e), Q();
+      }
+    ), Y(
+      () => t.searchValue,
+      (e) => {
+        e && G(e);
+      }
+    ), ye(() => {
+      ve();
+    });
+    const i = (e) => {
+      G(e);
+    }, u = (e) => {
+      if (t.isMultiple) {
+        const a = [], n = [], r = [];
+        A.value.forEach((d) => {
+          e.value ? l.isExistValue(t.selectId, d) || n.push(d) : l.isExistValue(t.selectId, d) && r.push(d), a.push(d);
+        });
+        const S = l.getArrClone(t.selectId);
+        r.length > 0 && r.forEach((d) => {
+          S.splice(S.indexOf(d), 1);
+        }), n.length > 0 && S.push(...n), z(S, { id: a, isSelect: e.value });
+      }
+    }, x = (e) => {
+      if (!e.isDisabled) {
+        const a = e.id.toString(), n = ie(a);
+        z(n, { id: a, isSelect: t.selectId.indexOf(a) > -1 });
+      }
+    }, D = () => {
+    }, O = () => {
+    };
+    return Z({
+      initOpenShow: (e) => {
+        e ? (re.onListener(window, "keydown", de, !0), re.onListener(window, "keyup", pe, !0)) : (re.offListener(window, "keydown", de, !0), re.offListener(window, "keyup", pe, !0));
+      },
+      getHoverKeydown: () => F.value
+    }), (e, a) => (f(), y("div", Pe, [
+      B.isRunLoading ? (f(), y("div", Ye, [
+        $($e, {
+          isLoadIng: B.isRunLoading
+        }, null, 8, ["isLoadIng"])
+      ])) : (f(), y(W, { key: 0 }, [
+        s.isSearch ? (f(), y("div", Re, [
+          $(Je, {
+            ref_key: "refElSearch",
+            ref: C,
+            onOnChange: i
+          }, null, 512)
+        ])) : (f(), y(W, { key: 1 }, [], 64)),
+        s.isMultiple && s.isCheckBoxAll ? (f(), y("div", Ue, [
+          $(Ee, {
+            forId: `${L}-cb-all`,
+            label: xe(H).checkboxAll,
+            value: X.value,
+            onOnChange: u
+          }, null, 8, ["forId", "label", "value"])
+        ])) : (f(), y(W, { key: 3 }, [], 64)),
+        ae("div", {
+          class: "dropdownLayer-list-body",
+          ref_key: "refElList",
+          ref: g
+        }, [
+          b.value.length > 0 ? (f(), y("ul", We, [
+            (f(!0), y(W, null, Le(b.value, (n, r) => (f(), y("li", {
+              key: `${L}-${r}-${n.id}`,
+              class: me({
+                "option-selected": s.selectId.indexOf(n.id.toString()) > -1,
+                "option-disabled": n.isDisabled,
+                "option-hoverKeydown": F.value === n.id.toString()
+              }),
+              onClick: (S) => x(n),
+              onMouseenter: D,
+              onMouseleave: O
+            }, [
+              ae("div", null, [
+                s.isMultiple ? (f(), y("div", ze, [
+                  $(Ee, {
+                    name: `${L}-cb`,
+                    forId: `${L}-cb-${n.id}`,
+                    value: s.selectId.indexOf(n.id.toString()) > -1,
+                    isDisabled: n.isDisabled
+                  }, null, 8, ["name", "forId", "value", "isDisabled"])
+                ])) : (f(), y(W, { key: 1 }, [], 64)),
+                ae("div", {
+                  class: "dropdownLayer-list-title",
+                  innerHTML: se(n)
+                }, null, 8, Ge)
+              ])
+            ], 42, qe))), 128))
+          ])) : (f(), y("ul", Qe, [
+            s.isShowEmptyLabel ? (f(), y("li", Xe, be(xe(H).noResultsText), 1)) : De("", !0)
+          ]))
+        ], 512)
+      ], 64))
+    ]));
+  }
+}), ht = /* @__PURE__ */ he({
+  name: "ClInputTag",
+  __name: "Index",
+  props: {
+    value: String,
+    className: {
+      type: String,
+      default: ""
+    },
+    placeholder: String,
+    disabled: {
+      type: Boolean,
+      default: !1
+    },
+    isClean: {
+      type: Boolean,
+      default: !0
+    },
+    multiple: {
+      type: Boolean,
+      default: !0
+    },
+    isCopy: {
+      type: Boolean,
+      default: !1
+    },
+    isCopyMultipleWrap: {
+      type: Boolean,
+      default: !0
+    },
+    copyJoinKey: {
+      type: String,
+      default: ","
+    },
+    minHeight: {
+      type: String,
+      default: "70px"
+    },
+    joinKey: {
+      type: String,
+      default: ","
+    },
+    isAutofill: {
+      type: Boolean,
+      default: !1
+    },
+    list: {
+      type: Array,
+      default: () => []
+    },
+    searchKey: {
+      type: Array,
+      default: () => ["name"]
+    },
+    searchKeyType: {
+      type: String,
+      default: "||"
+      // || or &&
+    },
+    showDropDownTextFormat: String,
+    serverCallback: Function,
+    isFocusShowDrop: {
+      type: Boolean,
+      default: !1
+    },
+    textMaxHeight: String,
+    tagsMaxHeight: String,
+    isShowNum: {
+      type: Boolean,
+      default: !1
+    },
+    isShowLoading: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  emits: ["onInit", "update:value", "onChange"],
+  setup(s, { expose: Z, emit: ee }) {
+    const t = s, K = ee, H = k(null), T = k(null), h = k(null), C = ge({
+      keyIndex: `inputTag-${l.getRandom(8)}`,
+      searchValue: "",
+      dropdownSelectId: [],
+      isUseData: !1
+    }), g = {
+      listNameJson: {},
+      listIdJson: {}
+    }, M = U(() => {
+      let o = "panel-inputTag box-width ";
+      const { className: c, disabled: E } = t;
+      return c && !l.isEmpty(c) && (o += c), E && (o += " inputTag-disabled "), o;
+    }), m = U(() => {
+      let o = "inputTag-dropdown ";
+      return C.isUseData || (o += " inputTag-dropdown-nodata "), o;
+    }), I = (o, c = "") => {
+      K("update:value", o), K("onChange", o, c);
+    }, p = () => {
+      V(() => {
+        K("onInit");
+      });
+    }, B = (o) => {
+      const c = l.isEmpty(o), E = c ? {} : l.getJsonByList(o, "name"), j = c ? {} : l.getJsonByList(o, "id");
+      g.listNameJson = l.getJsonMerge(g.listNameJson, E), g.listIdJson = l.getJsonMerge(g.listIdJson, j);
+    }, L = (o) => {
+      if (H.value) {
+        if (o && !H.value.checkCurrentIsOpen()) {
+          const c = [], E = T.value.getValue(), j = l.isEmpty(E) ? [] : l.split(E, t.joinKey);
+          j.length > 0 && j.forEach((J) => {
+            l.isExistJsonKey(g.listNameJson, J) && c.push(g.listNameJson[J].id.toString());
+          }), C.dropdownSelectId = c, C.isUseData = !l.isEmpty(t.list);
+        } else
+          C.isUseData = !0;
+        H.value.setOpen(o), o && V(() => {
+          H.value.initCompleteOpen();
+        });
+      }
+    }, F = () => {
+      t.list.length > 0 && B(t.list);
+    };
+    ye(() => {
+      V(() => {
+        F();
+      });
+    }), Y(
+      () => t.list,
+      (o) => {
+        B(o);
+      }
+    );
+    const b = () => {
+      p();
+    }, A = (o) => {
+      t.disabled || V(() => {
+        h.value && h.value.initOpenShow(o);
+      });
+    }, v = (o) => {
+      C.searchValue = o;
+      let c = !0;
+      (o.indexOf(`
+`) > -1 || o.indexOf(t.joinKey) > -1) && (c = !1), L(c ? !l.isEmpty(o) : !1), t.multiple || I(o, "input");
+    }, N = (o) => {
+      L(!o.isEmpty && !l.isEmpty(o.search));
+    }, q = (o, c) => {
+      const E = [];
+      (l.isArray(c.id) ? c.id : [c.id]).forEach((J) => {
+        l.isExistJsonKey(g.listIdJson, J) && E.push(g.listIdJson[J].name);
+      }), t.multiple || (C.searchValue = ""), T.value.updateValue(E.join(t.joinKey), c.isSelect);
+    }, X = (o, c) => {
+      I(o, c), t.isAutofill && L(!1);
+    }, z = (o) => {
+      t.isAutofill && t.isFocusShowDrop && (C.searchValue = o, L(!l.isEmpty(o)));
+    };
+    Ve("$InputTagTop", {
+      getListHoverVaueKeydown: () => {
+        let o = "";
+        return h.value && (o = h.value.getHoverKeydown()), o;
+      },
+      convertListToJson: B,
+      setDropdownOpen: L
+    });
+    const P = () => T.value.getValue();
+    return Z({
+      getValue: P,
+      getValueData: () => P().split(",").map((c) => ({ name: c })),
+      setValue: (o) => {
+        T.value.setValue(o);
+      },
+      focus: () => {
+        T.value.focus();
+      }
+    }), (o, c) => s.isAutofill ? (f(), fe(Ke, {
+      key: 0,
+      ref_key: "refElDropdownLayer",
+      ref: H,
+      classParent: M.value,
+      classDropDown: m.value,
+      onOnChangeOpen: A
+    }, {
+      labelCustom: Ie(() => [
+        $(ke, {
+          ref_key: "refElInput",
+          ref: T,
+          value: s.value,
+          placeholder: s.placeholder,
+          disabled: s.disabled,
+          isClean: s.isClean,
+          multiple: s.multiple,
+          minHeight: s.minHeight,
+          joinKey: s.joinKey,
+          isCopy: s.isCopy,
+          isCopyMultipleWrap: s.isCopyMultipleWrap,
+          copyJoinKey: s.copyJoinKey,
+          isDropdownLayer: !0,
+          textMaxHeight: s.textMaxHeight,
+          tagsMaxHeight: s.tagsMaxHeight,
+          isShowNum: s.isShowNum,
+          onOnChange: X,
+          onOnChangeInput: v,
+          onOnInit: b,
+          onOnFocus: z
+        }, null, 8, ["value", "placeholder", "disabled", "isClean", "multiple", "minHeight", "joinKey", "isCopy", "isCopyMultipleWrap", "copyJoinKey", "textMaxHeight", "tagsMaxHeight", "isShowNum"])
+      ]),
+      dropdown: Ie(() => [
+        $(Ze, {
+          ref_key: "refElList",
+          ref: h,
+          isSearch: !1,
+          searchValue: C.searchValue,
+          searchKey: s.searchKey,
+          searchKeyType: s.searchKeyType,
+          isMultiple: !1,
+          showDropDownTextFormat: s.showDropDownTextFormat,
+          isShowEmptyLabel: !1,
+          originalData: s.list,
+          selectId: C.dropdownSelectId,
+          serverCallback: s.serverCallback,
+          isShowLoading: s.isShowLoading,
+          onOnSearchResult: N,
+          onOnChange: q
+        }, null, 8, ["searchValue", "searchKey", "searchKeyType", "showDropDownTextFormat", "originalData", "selectId", "serverCallback", "isShowLoading"])
+      ]),
+      _: 1
+    }, 8, ["classParent", "classDropDown"])) : (f(), y("div", {
+      key: 1,
+      class: me(M.value)
+    }, [
+      $(ke, {
+        ref_key: "refElInput",
+        ref: T,
+        value: s.value,
+        placeholder: s.placeholder,
+        disabled: s.disabled,
+        isClean: s.isClean,
+        multiple: s.multiple,
+        minHeight: s.minHeight,
+        joinKey: s.joinKey,
+        isCopy: s.isCopy,
+        isCopyMultipleWrap: s.isCopyMultipleWrap,
+        copyJoinKey: s.copyJoinKey,
+        isDropdownLayer: !1,
+        textMaxHeight: s.textMaxHeight,
+        tagsMaxHeight: s.tagsMaxHeight,
+        isShowNum: s.isShowNum,
+        onOnChange: X,
+        onOnInit: b
+      }, null, 8, ["value", "placeholder", "disabled", "isClean", "multiple", "minHeight", "joinKey", "isCopy", "isCopyMultipleWrap", "copyJoinKey", "textMaxHeight", "tagsMaxHeight", "isShowNum"])
+    ], 2));
+  }
+});
+export {
+  ht as default
+};
+//# sourceMappingURL=ClInputTag.js.map