vft 0.0.249 → 0.0.252

package/es/components/select/useSelect.js

@@ -1,349 +1,443 @@
-import { isArray as H, isObject as N, isFunction as ae } from "@vft/utils";
 import "../form/index.js";
-import { UPDATE_MODEL_EVENT as Qe, CHANGE_EVENT as qe } from "../../constants/event.js";
-import { useResizeObserver as ke } from "@vueuse/core";
-import { debugWarn as Ge } from "../../utils/error.js";
+import { EVENT_CODE as xt } from "../../constants/aria.js";
+import { UPDATE_MODEL_EVENT as Ot, CHANGE_EVENT as It } from "../../constants/event.js";
+import { useResizeObserver as p } from "@vueuse/core";
+import { isArray as w, isFunction as z, isObject as ee, isNumber as pt, isUndefined as wt } from "@vft/utils";
+import { debugWarn as te } from "../../utils/error.js";
 import "../../utils/ns-cover.js";
-import { escapeStringRegexp as $e } from "../../utils/vue/data-helper.js";
-import { isNil as ue, debounce as je, isEqual as ie, get as b } from "lodash-es";
-import { reactive as Je, ref as r, computed as i, watch as y, nextTick as f, onMounted as Xe } from "vue";
-import { useNamespace as oe } from "../../hooks/use-namespace/index.js";
+import { escapeStringRegexp as yt } from "../../utils/vue/data-helper.js";
+import { debounce as Ct, get as A, isEqual as _, findLastIndex as Et } from "lodash-es";
+import { reactive as Tt, ref as m, computed as o, toRaw as St, watch as T, nextTick as h, watchEffect as Se, onMounted as Rt } from "vue";
+import { useNamespace as Re } from "../../hooks/use-namespace/index.js";
 import "../../hooks/use-model-toggle/index.js";
 import "@popperjs/core";
 import "../../hooks/use-z-index/index.js";
-import { useAllowCreate as Ye } from "./useAllowCreate.js";
-import { useInput as Ze } from "./useInput.js";
-import { flattenOptions as et } from "./util.js";
-import { useFormItem as tt } from "../form/hooks/use-form-item.js";
-import { useFormSize as lt } from "../form/hooks/use-form-common-props.js";
-const se = "", ce = 11, nt = {
-  larget: 51,
-  default: 42,
-  small: 33
-}, xt = (l, m) => {
-  const P = oe("select"), re = oe("input"), { form: de, formItem: A } = tt(), t = Je({
-    inputValue: se,
-    displayInputValue: se,
-    calculatedWidth: 0,
-    cachedPlaceholder: "",
+import { useComposition as Mt } from "../../hooks/use-composition/index.js";
+import { useFocusController as Wt } from "../../hooks/use-focus-controller/index.js";
+import { useEmptyValues as Ft } from "../../hooks/use-empty-values/index.js";
+import { useAllowCreate as Lt } from "./useAllowCreate.js";
+import { useProps as Nt } from "./useProps.js";
+import { useFormItem as Dt, useFormItemInputId as Ht } from "../form/hooks/use-form-item.js";
+import { useFormSize as Bt } from "../form/hooks/use-form-common-props.js";
+const il = (t, v) => {
+  const $ = Re("select"), Me = Re("input"), { form: le, formItem: S } = Dt(), { inputId: We } = Ht(t, {
+    formItemContext: S
+  }), { aliasProps: ne, getLabel: g, getValue: d, getDisabled: R, getOptions: Fe } = Nt(t), { valueOnClear: Le, isEmptyValue: ae } = Ft(t), l = Tt({
+    inputValue: "",
     cachedOptions: [],
     createdOptions: [],
-    createdLabel: "",
-    createdSelected: !1,
-    currentPlaceholder: "",
     hoveringIndex: -1,
-    comboBoxHovering: !1,
-    isOnComposition: !1,
-    isSilentBlur: !1,
-    isComposing: !1,
-    inputLength: 20,
-    selectWidth: 200,
-    initialInputHeight: 0,
+    inputHovering: !1,
+    selectionWidth: 0,
+    collapseItemWidth: 0,
     previousQuery: null,
     previousValue: void 0,
-    query: "",
     selectedLabel: "",
-    softFocus: !1,
-    tagInMultiLine: !1
-  }), fe = r(-1), B = r(-1), me = r(null), d = r(null), O = r(null), g = r(null), x = r(null), S = r(null), V = r(null), o = r(!1), I = i(() => l.disabled || de?.disabled), he = i(() => {
-    const e = s.value.length * 34;
-    return e > l.height ? l.height : e;
-  }), w = i(() => !ue(l.modelValue)), ve = i(() => {
-    const e = l.multiple ? Array.isArray(l.modelValue) && l.modelValue.length > 0 : w.value;
-    return l.clearable && !I.value && t.comboBoxHovering && e;
-  }), D = i(
-    () => l.remote && l.filterable ? "" : "icon-arrow-up"
-  ), ge = i(
-    () => D.value && P.is("reverse", o.value)
-  ), Ve = i(() => A?.validateState || ""), Ie = "validateIcon", _ = i(() => l.remote ? 300 : 0), L = i(() => {
-    const e = s.value;
-    return l.loading ? l.loadingText || "加载中" : l.remote && t.inputValue === "" && e.length === 0 ? !1 : l.filterable && t.inputValue && e.length > 0 ? l.noMatchText || "无匹配数据" : e.length === 0 ? l.noDataText || "暂无数据" : null;
-  }), s = i(() => {
-    const e = (n) => {
-      const u = t.inputValue, a = new RegExp($e(u), "i");
-      return u ? a.test(n.label || "") : !0;
-    };
-    return l.loading ? [] : et(
-      // @ts-ignore
-      l.options.concat(t.createdOptions).map((n) => {
-        if (H(n.options)) {
-          const u = n.options.filter(e);
-          if (u.length > 0)
-            return {
-              ...n,
-              options: u
-            };
-        } else if (l.remote || e(n))
-          return n;
-        return null;
-      }).filter((n) => n !== null)
-    );
-  }), pe = i(
-    () => s.value.every((e) => e.disabled)
-  ), z = lt(), K = i(
-    () => z.value === "small" ? "small" : "default"
-  ), be = i(() => {
-    const e = S.value, n = K.value || "default", u = e ? Number.parseInt(getComputedStyle(e).paddingLeft) : 0, a = e ? Number.parseInt(getComputedStyle(e).paddingRight) : 0;
-    return t.selectWidth - a - u - nt[n];
-  }), U = () => {
-    B.value = x.value?.offsetWidth || 200;
-  }, ye = i(() => ({
-    width: `${t.calculatedWidth === 0 ? ce : Math.ceil(t.calculatedWidth) + ce}px`
-  })), xe = i(() => H(l.modelValue) ? l.modelValue.length === 0 && !t.displayInputValue : l.filterable ? t.displayInputValue.length === 0 : !0), Se = i(() => {
-    const e = l.placeholder || "请选择";
-    return l.multiple || ue(l.modelValue) ? e : t.selectedLabel;
-  }), Ce = i(() => g.value?.popperRef?.contentRef), Q = i(() => {
-    if (l.multiple) {
-      const e = l.modelValue.length;
-      if (l.modelValue.length > 0)
-        return s.value.findIndex(
-          (n) => n.value === l.modelValue[e - 1]
+    menuVisibleOnFocus: !1,
+    isBeforeHide: !1
+  }), M = m(-1), G = m(), y = m(), W = m(), Q = m(), V = m(), Ne = m(), De = m(), b = m(), ie = m(), F = m(), {
+    isComposing: oe,
+    handleCompositionStart: He,
+    handleCompositionEnd: Be,
+    handleCompositionUpdate: Pe
+  } = Mt({
+    afterComposition: (e) => Ee(e)
+  }), x = o(() => t.disabled || !!le?.disabled), { wrapperRef: ue, isFocused: se, handleBlur: Ke } = Wt(V, {
+    disabled: x,
+    afterFocus() {
+      t.automaticDropdown && !u.value && (u.value = !0, l.menuVisibleOnFocus = !0);
+    },
+    beforeBlur(e) {
+      return W.value?.isFocusInsideContent(e) || Q.value?.isFocusInsideContent(e);
+    },
+    afterBlur() {
+      u.value = !1, l.menuVisibleOnFocus = !1, t.validateEvent && S?.validate?.("blur").catch((e) => te(e));
+    }
+  }), ce = o(() => me("")), L = o(() => t.loading ? !1 : t.options.length > 0 || l.createdOptions.length > 0), s = m([]), u = m(!1), ke = o(() => le?.statusIcon ?? !1), ze = o(() => {
+    const e = s.value.length * t.itemHeight;
+    return e > t.height ? t.height : e;
+  }), N = o(() => t.multiple ? w(t.modelValue) && t.modelValue.length > 0 : !ae(t.modelValue)), Ae = o(() => t.clearable && !x.value && l.inputHovering && N.value), de = o(
+    () => t.remote && t.filterable ? "" : "ico-ep:arrow-down"
+  ), _e = o(
+    () => de.value && $.is("reverse", u.value)
+  ), $e = o(() => S?.validateState || ""), Ge = "validateIcon", re = o(() => t.remote ? 300 : 0), fe = o(() => t.loading ? t.loadingText || "加载中" : t.remote && !l.inputValue && !L.value ? !1 : t.filterable && l.inputValue && L.value && s.value.length === 0 ? t.noMatchText || "无匹配数据" : L.value ? null : t.noDataText || "暂无数据"), me = (e) => {
+    const n = new RegExp(yt(e), "i"), { filterMethod: a, remoteMethod: i } = St(t), c = t.filterable && z(a), f = t.filterable && t.remote && z(i), P = (O) => c || f ? !0 : e ? n.test(g(O) || "") : !0;
+    return t.loading ? [] : [...l.createdOptions, ...t.options].reduce((O, I) => {
+      const K = Fe(I);
+      if (w(K)) {
+        const k = K.filter(P);
+        k.length > 0 && O.push(
+          {
+            label: g(I),
+            type: "Group"
+          },
+          ...k
         );
-    } else if (l.modelValue)
-      return s.value.findIndex(
-        (e) => e.value === l.modelValue
-      );
+      } else (t.remote || P(I)) && O.push(I);
+      return O;
+    }, []);
+  }, he = () => {
+    s.value = me(l.inputValue);
+  }, ve = o(() => {
+    const e = /* @__PURE__ */ new Map();
+    return ce.value.forEach((n, a) => {
+      e.set(r(d(n)), { option: n, index: a });
+    }), e;
+  }), D = o(() => {
+    const e = /* @__PURE__ */ new Map();
+    return s.value.forEach((n, a) => {
+      e.set(r(d(n)), { option: n, index: a });
+    }), e;
+  }), Qe = o(
+    () => s.value.every((e) => R(e))
+  ), ge = Bt(), Ue = o(
+    () => ge.value === "small" ? "small" : "default"
+  ), C = () => {
+    if (pt(t.fitInputWidth)) {
+      M.value = t.fitInputWidth;
+      return;
+    }
+    const e = G.value?.offsetWidth || 200;
+    !t.fitInputWidth && L.value ? h(() => {
+      M.value = Math.max(e, je());
+    }) : M.value = e;
+  }, je = () => {
+    const n = document.createElement("canvas").getContext("2d"), a = $.be("dropdown", "item"), c = (b.value?.listRef?.innerRef || document).querySelector(`.${a}`);
+    if (c === null || n === null) return 0;
+    const f = getComputedStyle(c), P = Number.parseFloat(f.paddingLeft) + Number.parseFloat(f.paddingRight);
+    return n.font = `bold ${f.font.replace(
+      new RegExp(`\\b${f.fontWeight}\\b`),
+      ""
+    )}`, s.value.reduce((I, K) => {
+      const k = n.measureText(g(K));
+      return Math.max(k.width, I);
+    }, 0) + P;
+  }, qe = () => {
+    if (!y.value) return 0;
+    const e = window.getComputedStyle(y.value);
+    return Number.parseFloat(e.gap || "6px");
+  }, Je = o(() => {
+    const e = qe();
+    return { maxWidth: `${F.value && t.maxCollapseTags === 1 ? l.selectionWidth - l.collapseItemWidth - e : l.selectionWidth}px` };
+  }), Xe = o(() => ({ maxWidth: `${l.selectionWidth}px` })), Ye = o(() => w(t.modelValue) ? t.modelValue.length === 0 && !l.inputValue : t.filterable ? !l.inputValue : !0), Ze = o(() => {
+    const e = t.placeholder || "请选择";
+    return t.multiple || !N.value ? e : l.selectedLabel;
+  }), et = o(() => W.value?.popperRef?.contentRef), tt = o(() => {
+    if (t.multiple) {
+      const e = t.modelValue.length;
+      if (t.modelValue.length > 0 && D.value.has(t.modelValue[e - 1])) {
+        const { index: n } = D.value.get(
+          t.modelValue[e - 1]
+        );
+        return n;
+      }
+    } else if (!ae(t.modelValue) && D.value.has(t.modelValue)) {
+      const { index: e } = D.value.get(t.modelValue);
+      return e;
+    }
     return -1;
-  }), q = i({
+  }), lt = o({
     get() {
-      return o.value && L.value !== !1;
+      return u.value && fe.value !== !1;
     },
     set(e) {
-      o.value = e;
+      u.value = e;
     }
-  }), Oe = i(
-    () => t.cachedOptions.slice(0, l.maxCollapseTags)
-  ), we = i(
-    () => t.cachedOptions.slice(l.maxCollapseTags)
-  ), {
-    createNewOption: k,
-    removeNewOption: T,
-    selectNewOption: G,
-    clearAllNewOption: R
-  } = Ye(l, t), {
-    handleCompositionStart: Le,
-    handleCompositionUpdate: Te,
-    handleCompositionEnd: Re
-  } = Ze((e) => ne(e)), $ = () => {
-    d.value?.focus?.(), g.value?.updatePopper();
-  }, E = () => {
-    if (!l.automaticDropdown && !I.value)
-      return t.isComposing && (t.softFocus = !0), f(() => {
-        o.value = !o.value, d.value?.focus?.();
-      });
-  }, j = () => (l.filterable && t.inputValue !== t.selectedLabel && (t.query = t.selectedLabel), X(t.inputValue), f(() => {
-    k(t.inputValue);
-  })), J = je(j, _.value), X = (e) => {
-    t.previousQuery !== e && (t.previousQuery = e, l.filterable && ae(l.filterMethod) ? l.filterMethod(e) : l.filterable && l.remote && ae(l.remoteMethod) && l.remoteMethod(e));
-  }, Ee = (e) => {
-    ie(l.modelValue, e) || m(qe, e);
-  }, p = (e) => {
-    m(Qe, e), Ee(e), t.previousValue = e?.toString();
-  }, Me = (e = [], n) => {
-    if (!N(n))
+  }), nt = o(() => t.multiple ? t.collapseTags ? l.cachedOptions.slice(0, t.maxCollapseTags) : l.cachedOptions : []), at = o(() => t.multiple ? t.collapseTags ? l.cachedOptions.slice(t.maxCollapseTags) : [] : []), {
+    createNewOption: Ve,
+    removeNewOption: U,
+    selectNewOption: be,
+    clearAllNewOption: j
+  } = Lt(t, l), q = () => {
+    x.value || (l.menuVisibleOnFocus ? l.menuVisibleOnFocus = !1 : u.value = !u.value);
+  }, xe = () => {
+    l.inputValue.length > 0 && !u.value && (u.value = !0), Ve(l.inputValue), h(() => {
+      J(l.inputValue);
+    });
+  }, Oe = Ct(xe, re.value), J = (e) => {
+    l.previousQuery === e || oe.value || (l.previousQuery = e, t.filterable && z(t.filterMethod) ? t.filterMethod(e) : t.filterable && t.remote && z(t.remoteMethod) && t.remoteMethod(e), t.defaultFirstOption && (t.filterable || t.remote) && s.value.length ? h(it) : h(gt));
+  }, it = () => {
+    const e = s.value.filter(
+      (i) => !i.disabled && i.type !== "Group"
+    ), n = e.find((i) => i.created), a = e[0];
+    l.hoveringIndex = X(
+      s.value,
+      n || a
+    );
+  }, ot = (e) => {
+    _(t.modelValue, e) || v(It, e);
+  }, E = (e) => {
+    v(Ot, e), ot(e), l.previousValue = t.multiple ? String(e) : e, h(() => {
+      if (t.multiple && w(t.modelValue)) {
+        const n = l.cachedOptions.slice(), a = t.modelValue.map(
+          (i) => Te(i, n)
+        );
+        _(l.cachedOptions, a) || (l.cachedOptions = a);
+      } else
+        B(!0);
+    });
+  }, X = (e = [], n) => {
+    if (!ee(n))
       return e.indexOf(n);
-    const u = l.valueKey;
-    let a = -1;
-    return e.some((c, Ue) => b(c, u) === b(n, u) ? (a = Ue, !0) : !1), a;
-  }, h = (e) => N(e) ? b(e, l.valueKey) : e, We = (e) => N(e) ? e.label : e, M = () => f(() => {
-    if (!d.value) return;
-    const e = S.value;
-    x.value.height = e.offsetHeight, o.value && L.value !== !1 && g.value?.updatePopper?.();
-  }), Y = () => {
-    if (Fe(), U(), g.value?.updatePopper?.(), l.multiple)
-      return M();
-  }, Fe = () => {
-    const e = S.value;
-    e && (t.selectWidth = e.getBoundingClientRect().width);
-  }, Z = (e, n, u = !0) => {
-    if (l.multiple) {
-      let a = l.modelValue.slice();
-      const c = Me(a, h(e));
-      c > -1 ? (a = [
-        ...a.slice(0, c),
-        ...a.slice(c + 1)
-      ], t.cachedOptions.splice(c, 1), T(e)) : (l.multipleLimit <= 0 || a.length < l.multipleLimit) && (a = [...a, h(e)], t.cachedOptions.push(e), G(e), v(n)), p(a), e.created && (t.query = "", X(""), t.inputLength = 20), l.filterable && !l.reserveKeyword && (d.value.focus?.(), C("")), l.filterable && (t.calculatedWidth = V.value.getBoundingClientRect().width), M(), _e();
+    const a = t.valueKey;
+    let i = -1;
+    return e.some((c, f) => A(c, a) === A(n, a) ? (i = f, !0) : !1), i;
+  }, r = (e) => ee(e) ? A(e, t.valueKey) : e, Ie = () => {
+    C();
+  }, pe = () => {
+    l.selectionWidth = Number.parseFloat(
+      window.getComputedStyle(y.value).width
+    );
+  }, ut = () => {
+    l.collapseItemWidth = F.value.getBoundingClientRect().width;
+  }, Y = () => {
+    W.value?.updatePopper?.();
+  }, we = () => {
+    Q.value?.updatePopper?.();
+  }, ye = (e) => {
+    if (t.multiple) {
+      let n = t.modelValue.slice();
+      const a = X(n, d(e));
+      a > -1 ? (n = [
+        ...n.slice(0, a),
+        ...n.slice(a + 1)
+      ], l.cachedOptions.splice(a, 1), U(e)) : (t.multipleLimit <= 0 || n.length < t.multipleLimit) && (n = [...n, d(e)], l.cachedOptions.push(e), be(e)), E(n), e.created && J(""), t.filterable && !t.reserveKeyword && (l.inputValue = "");
     } else
-      fe.value = n, t.selectedLabel = e.label, p(h(e)), o.value = !1, t.isComposing = !1, t.isSilentBlur = u, G(e), e.created || R(), v(n);
-  }, He = (e, n) => {
-    const { valueKey: u } = l, a = l.modelValue.indexOf(b(n, u));
-    if (a > -1 && !I.value) {
-      const c = [
-        ...l.modelValue.slice(0, a),
-        ...l.modelValue.slice(a + 1)
-      ];
-      return t.cachedOptions.splice(a, 1), p(c), m("remove-tag", b(n, u)), t.softFocus = !0, T(n), f($);
+      l.selectedLabel = g(e), E(d(e)), u.value = !1, be(e), e.created || j();
+    H();
+  }, st = (e, n) => {
+    let a = t.modelValue.slice();
+    const i = X(a, d(n));
+    i > -1 && !x.value && (a = [
+      ...t.modelValue.slice(0, i),
+      ...t.modelValue.slice(i + 1)
+    ], l.cachedOptions.splice(i, 1), E(a), v("remove-tag", d(n)), U(n)), e.stopPropagation(), H();
+  }, H = () => {
+    V.value?.focus();
+  }, ct = () => {
+    if (u.value) {
+      u.value = !1, h(() => V.value?.blur());
+      return;
     }
-    e.stopPropagation();
-  }, Ne = (e) => {
-    const n = t.isComposing;
-    t.isComposing = !0, t.softFocus ? t.softFocus = !1 : n || m("focus", e);
-  }, ee = (e) => (t.softFocus = !1, f(() => {
-    d.value?.blur?.(), V.value && (t.calculatedWidth = V.value.getBoundingClientRect().width), t.isSilentBlur ? t.isSilentBlur = !1 : t.isComposing && m("blur", e), t.isComposing = !1;
-  })), Pe = () => {
-    t.displayInputValue.length > 0 ? C("") : o.value = !1;
-  }, Ae = (e) => {
-    if (t.displayInputValue.length === 0) {
+    V.value?.blur();
+  }, dt = () => {
+    l.inputValue.length > 0 ? l.inputValue = "" : u.value = !1;
+  }, rt = (e) => Et(
+    e,
+    (n) => !l.cachedOptions.some(
+      (a) => d(a) === n && R(a)
+    )
+  ), ft = (e) => {
+    if (t.multiple && e.code !== xt.delete && l.inputValue.length === 0) {
       e.preventDefault();
-      const n = l.modelValue.slice();
-      n.pop(), T(t.cachedOptions.pop()), p(n);
+      const n = t.modelValue.slice(), a = rt(n);
+      if (a < 0) return;
+      const i = n[a];
+      n.splice(a, 1);
+      const c = l.cachedOptions[a];
+      l.cachedOptions.splice(a, 1), U(c), E(n), v("remove-tag", i);
     }
-  }, Be = () => {
+  }, mt = () => {
     let e;
-    return H(l.modelValue) ? e = [] : e = void 0, t.softFocus = !0, l.multiple ? t.cachedOptions = [] : t.selectedLabel = "", o.value = !1, p(e), m("clear"), R(), f($);
-  }, C = (e) => {
-    t.displayInputValue = e, t.inputValue = e;
-  }, te = (e, n = void 0) => {
-    const u = s.value;
-    if (!["forward", "backward"].includes(e) || I.value || u.length <= 0 || pe.value)
+    w(t.modelValue) ? e = [] : e = Le.value, l.selectedLabel = "", u.value = !1, E(e), v("clear"), j(), H();
+  }, Ce = (e, n = void 0) => {
+    const a = s.value;
+    if (!["forward", "backward"].includes(e) || x.value || a.length <= 0 || Qe.value || oe.value)
       return;
-    if (!o.value)
-      return E();
-    n === void 0 && (n = t.hoveringIndex);
-    let a = -1;
-    e === "forward" ? (a = n + 1, a >= u.length && (a = 0)) : e === "backward" && (a = n - 1, (a < 0 || a >= u.length) && (a = u.length - 1));
-    const c = u[a];
-    if (c.disabled || c.type === "Group")
-      return te(e, a);
-    v(a), W(a);
-  }, De = () => {
-    if (o.value)
-      ~t.hoveringIndex && s.value[t.hoveringIndex] && Z(
-        s.value[t.hoveringIndex],
-        t.hoveringIndex,
-        !1
-      );
-    else return E();
-  }, v = (e) => {
-    t.hoveringIndex = e;
-  }, le = () => {
-    t.hoveringIndex = -1;
-  }, _e = () => {
-    const e = d.value;
-    e && e.focus?.();
-  }, ne = (e) => {
-    const n = e.target.value;
-    if (C(n), t.displayInputValue.length > 0 && !o.value && (o.value = !0), t.calculatedWidth = V.value.getBoundingClientRect().width, l.multiple && M(), l.remote)
-      J();
+    if (!u.value)
+      return q();
+    wt(n) && (n = l.hoveringIndex);
+    let i = -1;
+    e === "forward" ? (i = n + 1, i >= a.length && (i = 0)) : e === "backward" && (i = n - 1, (i < 0 || i >= a.length) && (i = a.length - 1));
+    const c = a[i];
+    if (R(c) || c.type === "Group")
+      return Ce(e, i);
+    l.hoveringIndex = i, Z(i);
+  }, ht = () => {
+    if (u.value)
+      ~l.hoveringIndex && s.value[l.hoveringIndex] && ye(s.value[l.hoveringIndex]);
+    else return q();
+  }, vt = (e) => {
+    l.hoveringIndex = e ?? -1;
+  }, gt = () => {
+    t.multiple ? l.hoveringIndex = s.value.findIndex(
+      (e) => t.modelValue.some(
+        (n) => r(n) === r(d(e))
+      )
+    ) : l.hoveringIndex = s.value.findIndex((e) => r(d(e)) === r(t.modelValue));
+  }, Ee = (e) => {
+    if (l.inputValue = e.target.value, t.remote)
+      Oe();
     else
-      return j();
-  }, ze = () => (o.value = !1, ee()), Ke = () => (t.inputValue = t.displayInputValue, f(() => {
-    ~Q.value && (v(Q.value), W(t.hoveringIndex));
-  })), W = (e) => {
-    O.value.scrollToItem(e);
-  }, F = () => {
-    if (le(), l.multiple)
-      if (l.modelValue.length > 0) {
-        let e = !1;
-        t.cachedOptions.length = 0, t.previousValue = l.modelValue.toString(), l.modelValue.forEach((n) => {
-          const u = s.value.findIndex(
-            (a) => h(a) === n
-          );
-          ~u && (t.cachedOptions.push(
-            s.value[u]
-          ), e || v(u), e = !0);
-        });
+      return xe();
+  }, Vt = (e) => {
+    if (u.value = !1, se.value) {
+      const n = new FocusEvent("focus", e);
+      Ke(n);
+    }
+  }, bt = () => (l.isBeforeHide = !1, h(() => {
+    ~tt.value && Z(l.hoveringIndex);
+  })), Z = (e) => {
+    b.value.scrollToItem(e);
+  }, Te = (e, n) => {
+    const a = r(e);
+    if (ve.value.has(a)) {
+      const { option: i } = ve.value.get(a);
+      return i;
+    }
+    if (n && n.length) {
+      const i = n.find(
+        (c) => r(d(c)) === a
+      );
+      if (i)
+        return i;
+    }
+    return {
+      [ne.value.value]: e,
+      [ne.value.label]: e
+    };
+  }, B = (e = !1) => {
+    if (t.multiple)
+      if (t.modelValue.length > 0) {
+        const n = l.cachedOptions.slice();
+        l.cachedOptions.length = 0, l.previousValue = t.modelValue.toString();
+        for (const a of t.modelValue) {
+          const i = Te(a, n);
+          l.cachedOptions.push(i);
+        }
       } else
-        t.cachedOptions = [], t.previousValue = void 0;
-    else if (w.value) {
-      t.previousValue = l.modelValue;
-      const e = s.value, n = e.findIndex(
-        (u) => h(u) === h(l.modelValue)
+        l.cachedOptions = [], l.previousValue = void 0;
+    else if (N.value) {
+      l.previousValue = t.modelValue;
+      const n = s.value, a = n.findIndex(
+        (i) => r(d(i)) === r(t.modelValue)
       );
-      ~n ? (t.selectedLabel = e[n].label, v(n)) : t.selectedLabel = `${l.modelValue}`;
+      ~a ? l.selectedLabel = g(n[a]) : (!l.selectedLabel || e) && (l.selectedLabel = r(t.modelValue));
     } else
-      t.selectedLabel = "", t.previousValue = void 0;
-    R(), U();
+      l.selectedLabel = "", l.previousValue = void 0;
+    j(), C();
   };
-  return y(o, (e) => {
-    m("visible-change", e), e ? g.value.update?.() : (t.displayInputValue = "", t.previousQuery = null, k(""));
-  }), y(
-    () => l.modelValue,
+  return T(
+    () => t.fitInputWidth,
+    () => {
+      C();
+    }
+  ), T(u, (e) => {
+    e ? (t.persistent || C(), J("")) : (l.inputValue = "", l.previousQuery = null, l.isBeforeHide = !0, Ve("")), v("visible-change", e);
+  }), T(
+    () => t.modelValue,
     (e, n) => {
-      (!e || e.toString() !== t.previousValue) && F(), !ie(e, n) && l.validateEvent && A?.validate?.("change").catch((u) => Ge(u));
+      (!e || w(e) && e.length === 0 || t.multiple && !_(e.toString(), l.previousValue) || !t.multiple && r(e) !== r(l.previousValue)) && B(!0), !_(e, n) && t.validateEvent && S?.validate?.("change").catch((i) => te(i));
     },
     {
       deep: !0
     }
-  ), y(
-    () => l.options,
+  ), T(
+    () => t.options,
     () => {
-      const e = d.value;
-      (!e || e && document.activeElement !== e) && F();
+      const e = V.value;
+      (!e || e && document.activeElement !== e) && B();
     },
     {
-      deep: !0
+      deep: !0,
+      flush: "post"
     }
-  ), y(s, () => f(O.value?.resetScrollTop)), y(
-    () => q.value,
-    (e) => {
-      e || le();
+  ), T(
+    () => s.value,
+    () => (C(), b.value && h(b.value.resetScrollTop))
+  ), Se(() => {
+    l.isBeforeHide || he();
+  }), Se(() => {
+    const { valueKey: e, options: n } = t, a = /* @__PURE__ */ new Map();
+    for (const i of n) {
+      const c = d(i);
+      let f = c;
+      if (ee(f) && (f = A(c, e)), a.get(f)) {
+        te(
+          "ElSelectV2",
+          "The option values you provided seem to be duplicated, which may cause some problems, please check."
+        );
+        break;
+      } else
+        a.set(f, !0);
     }
-  ), Xe(() => {
-    F();
-  }), ke(x, Y), {
+  }), Rt(() => {
+    B();
+  }), p(G, Ie), p(y, pe), p(b, Y), p(ue, Y), p(ie, we), p(F, ut), {
     // data exports
-    collapseTagSize: K,
-    currentPlaceholder: Se,
-    expanded: o,
-    emptyText: L,
-    popupHeight: he,
-    debounce: _,
+    inputId: We,
+    collapseTagSize: Ue,
+    currentPlaceholder: Ze,
+    expanded: u,
+    emptyText: fe,
+    popupHeight: ze,
+    debounce: re,
+    allOptions: ce,
     filteredOptions: s,
-    iconComponent: D,
-    iconReverse: ge,
-    inputWrapperStyle: ye,
-    popperSize: B,
-    dropdownMenuVisible: q,
-    hasModelValue: w,
-    // readonly,
-    shouldShowPlaceholder: xe,
-    selectDisabled: I,
-    selectSize: z,
-    showClearBtn: ve,
-    states: t,
-    tagMaxWidth: be,
-    nsSelect: P,
-    nsInput: re,
+    iconComponent: de,
+    iconReverse: _e,
+    tagStyle: Je,
+    collapseTagStyle: Xe,
+    popperSize: M,
+    dropdownMenuVisible: lt,
+    hasModelValue: N,
+    shouldShowPlaceholder: Ye,
+    selectDisabled: x,
+    selectSize: ge,
+    needStatusIcon: ke,
+    showClearBtn: Ae,
+    states: l,
+    isFocused: se,
+    nsSelect: $,
+    nsInput: Me,
     // refs items exports
-    calculatorRef: V,
-    controlRef: me,
-    inputRef: d,
-    menuRef: O,
-    popper: g,
-    selectRef: x,
-    selectionRef: S,
-    popperRef: Ce,
-    validateState: Ve,
-    validateIcon: Ie,
-    showTagList: Oe,
-    collapseTagList: we,
+    inputRef: V,
+    menuRef: b,
+    tagMenuRef: ie,
+    tooltipRef: W,
+    tagTooltipRef: Q,
+    selectRef: G,
+    wrapperRef: ue,
+    selectionRef: y,
+    prefixRef: Ne,
+    suffixRef: De,
+    collapseItemRef: F,
+    popperRef: et,
+    validateState: $e,
+    validateIcon: Ge,
+    showTagList: nt,
+    collapseTagList: at,
     // methods exports
-    debouncedOnInputChange: J,
-    deleteTag: He,
-    getLabel: We,
-    getValueKey: h,
-    handleBlur: ee,
-    handleClear: Be,
-    handleClickOutside: ze,
-    handleDel: Ae,
-    handleEsc: Pe,
-    handleFocus: Ne,
-    handleMenuEnter: Ke,
-    handleResize: Y,
-    toggleMenu: E,
-    scrollTo: W,
-    onInput: ne,
-    onKeyboardNavigate: te,
-    onKeyboardSelect: De,
-    onSelect: Z,
-    onHover: v,
-    onUpdateInputValue: C,
-    handleCompositionStart: Le,
-    handleCompositionEnd: Re,
-    handleCompositionUpdate: Te
+    debouncedOnInputChange: Oe,
+    deleteTag: st,
+    getLabel: g,
+    getValue: d,
+    getDisabled: R,
+    getValueKey: r,
+    handleClear: mt,
+    handleClickOutside: Vt,
+    handleDel: ft,
+    handleEsc: dt,
+    focus: H,
+    blur: ct,
+    handleMenuEnter: bt,
+    handleResize: Ie,
+    resetSelectionWidth: pe,
+    updateTooltip: Y,
+    updateTagTooltip: we,
+    updateOptions: he,
+    toggleMenu: q,
+    scrollTo: Z,
+    onInput: Ee,
+    onKeyboardNavigate: Ce,
+    onKeyboardSelect: ht,
+    onSelect: ye,
+    onHover: vt,
+    handleCompositionStart: He,
+    handleCompositionEnd: Be,
+    handleCompositionUpdate: Pe
   };
 };
 export {
-  xt as default
+  il as default
 };