x-next 1.9.0 → 1.10.1

package/dist/es/components/form-select/Select.js

@@ -1,34 +1,32 @@
-import { defineComponent as Ne, toRefs as je, useId as De, computed as i, ref as p, watch as H, nextTick as Re, watchEffect as Te, createVNode as m, mergeProps as A, isVNode as _e } from "vue";
-import { isObject as N, isFunction as y, isArray as Ie, isNumber as Ke, isString as $e, isBoolean as ze, isUndefined as C, isNull as He, isEmptyObject as Me } from "../../_utils/is.js";
-import { getKeyFromValue as M, isGroupOptionInfo as Ue, isValidOption as Ge, hasEmptyStringKey as We } from "./utils.js";
-import { Trigger as U } from "../trigger/index.js";
-import G from "../_components/select-view/select-view.js";
-import Ye from "./SelectDropdown.vue.js";
-import qe from "./SelectOption.vue.js";
-import Je from "./SelectOptionGroup.vue.js";
-import Qe from "../virtual-list-v2/virtual-list.vue.js";
-import { useSelect as Xe } from "./hooks/use-select.js";
-import { useTrigger as Ze } from "../../_hooks/use-trigger.js";
-import { useFormItem as et } from "../../_hooks/use-form-item.js";
-import { useLocale as tt } from "../../locale/index.js";
-import { debounce as at } from "../../_utils/debounce.js";
-import { getClassNameMixin as lt } from "../../_utils/config.js";
-import { omit as nt } from "../../_utils/omit.js";
-import ot from "../../_utils/pick.js";
-function ut(t) {
-  return typeof t == "function" || Object.prototype.toString.call(t) === "[object Object]" && !_e(t);
+import { defineComponent as He, toRefs as Ge, useId as We, computed as r, ref as m, watch as I, onBeforeUnmount as qe, watchEffect as ae, createVNode as y, mergeProps as M, isVNode as Je } from "vue";
+import { isObject as U, isFunction as h, isArray as Qe, isNumber as Xe, isString as Ye, isBoolean as Ze, isUndefined as N, isNull as ea, isEmptyObject as aa } from "../../_utils/is.js";
+import { getKeyFromValue as te, isGroupOptionInfo as le, isValidOption as ta, hasEmptyStringKey as la } from "./utils.js";
+import { Trigger as ue } from "../trigger/index.js";
+import ne from "../_components/select-view/select-view.js";
+import ua from "./SelectDropdown.vue.js";
+import na from "./SelectOption.vue.js";
+import oa from "./SelectOptionGroup.vue.js";
+import ra from "../virtual-list-v2/virtual-list.vue.js";
+import { useSelect as ia } from "./hooks/use-select.js";
+import { useTrigger as ca } from "../../_hooks/use-trigger.js";
+import { useFormItem as da } from "../../_hooks/use-form-item.js";
+import { useLocale as sa } from "../../locale/index.js";
+import { getClassNameMixin as fa } from "../../_utils/config.js";
+import { omit as va } from "../../_utils/omit.js";
+function ma(a) {
+  return typeof a == "function" || Object.prototype.toString.call(a) === "[object Object]" && !Je(a);
 }
-const W = ["id", "aria-label", "aria-labelledby", "aria-describedby"], rt = {
+const pa = /* @__PURE__ */ new Set(["id", "name", "form", "tabindex", "tabIndex", "autofocus", "autoFocus", "autocomplete", "autoComplete"]), oe = (a) => pa.has(a) || a.startsWith("aria-"), ba = {
   value: "value",
   label: "label",
   disabled: "disabled",
   tagProps: "tagProps",
   render: "render"
-}, Bt = /* @__PURE__ */ Ne({
+}, Pa = /* @__PURE__ */ He({
   name: "Select",
   components: {
-    Trigger: U,
-    SelectView: G
+    Trigger: ue,
+    SelectView: ne
   },
   inheritAttrs: !1,
   props: {
@@ -55,7 +53,7 @@ const W = ["id", "aria-label", "aria-labelledby", "aria-describedby"], rt = {
      */
     defaultValue: {
       type: [String, Number, Boolean, Object, Array],
-      default: (t) => t.multiple ? [] : ""
+      default: (a) => a.multiple ? [] : ""
     },
     /**
      * @zh 输入框的值
@@ -126,7 +124,7 @@ const W = ["id", "aria-label", "aria-labelledby", "aria-describedby"], rt = {
      */
     allowSearch: {
       type: [Boolean, Object],
-      default: (t) => !!t.multiple
+      default: (a) => !!a.multiple
     },
     /**
      * @zh 是否允许创建
@@ -321,54 +319,56 @@ const W = ["id", "aria-label", "aria-labelledby", "aria-describedby"], rt = {
     }
   },
   emits: {
-    "update:modelValue": (t) => !0,
-    "update:inputValue": (t) => !0,
-    "update:popupVisible": (t) => !0,
+    focus: (a) => !0,
+    blur: (a) => !0,
+    "update:modelValue": (a) => !0,
+    "update:inputValue": (a) => !0,
+    "update:popupVisible": (a) => !0,
     /**
      * @zh 值发生改变时触发
      * @en Triggered when the value changes
-     * @param { string | number | boolean | Record<string, any> | (string | number | boolean | Record<string, any>)[] } value
+     * @param { string | number | boolean | Record<string, any> | (string | number | boolean | Record<string, any>)[] | undefined } value
      */
-    change: (t) => !0,
+    change: (a) => !0,
     /**
      * @zh 输入框的值发生改变时触发
      * @en Triggered when the value of the input changes
      * @param {string} inputValue
      */
-    inputValueChange: (t) => !0,
+    inputValueChange: (a) => !0,
     /**
      * @zh 下拉框的显示状态改变时触发
      * @en Triggered when the display state of the drop-down box changes
      * @param {boolean} visible
      */
-    popupVisibleChange: (t) => !0,
+    popupVisibleChange: (a) => !0,
     /**
      * @zh 点击清除按钮时触发
      * @en Triggered when the clear button is clicked
      */
-    clear: (t) => !0,
+    clear: (a) => !0,
     /**
      * @zh 点击标签的删除按钮时触发
      * @en Triggered when the delete button of the label is clicked
      * @param {string | number | boolean | Record<string, any> | undefined} removed
      */
-    remove: (t) => !0,
+    remove: (a) => !0,
     /**
      * @zh 用户搜索时触发
      * @en Triggered when the user searches
      * @param {string} inputValue
      */
-    search: (t) => !0,
+    search: (a) => !0,
     /**
      * @zh 下拉菜单发生滚动时触发
      * @en Triggered when the drop-down scrolls
      */
-    dropdownScroll: (t) => !0,
+    dropdownScroll: (a) => !0,
     /**
      * @zh 下拉菜单滚动到底部时触发
      * @en Triggered when the drop-down menu is scrolled to the bottom
      */
-    dropdownReachBottom: (t) => !0,
+    dropdownReachBottom: (a) => !0,
     /**
      * @zh 多选超出限制时触发
      * @en Triggered when multiple selection exceeds the limit
@@ -376,7 +376,7 @@ const W = ["id", "aria-label", "aria-labelledby", "aria-describedby"], rt = {
      * @param {Event} ev
      * @version 2.18.0
      */
-    exceedLimit: (t, o) => !0
+    exceedLimit: (a, n) => !0
   },
   /**
    * @zh 选项为空时的显示内容
@@ -436,249 +436,291 @@ const W = ["id", "aria-label", "aria-labelledby", "aria-describedby"], rt = {
    * @slot trigger
    * @version 2.22.0
    */
-  setup(t, {
-    slots: o,
-    emit: r,
-    attrs: B
+  setup(a, {
+    slots: n,
+    emit: i,
+    attrs: x,
+    expose: re
   }) {
     const {
-      size: Y,
-      disabled: q,
-      error: J,
-      options: Q,
-      filterOption: h,
-      valueKey: f,
-      multiple: j,
-      popupVisible: X,
-      defaultPopupVisible: Z,
-      showExtraOptions: ee,
-      modelValue: te,
-      fieldNames: V,
-      loading: ae,
-      defaultActiveFirstOption: le
-    } = je(t), ne = lt("select"), D = De(), x = `${D}-listbox`, F = (e) => `${D}-option-${encodeURIComponent(e)}`, {
-      formItemCtx: oe,
-      mergedSize: ue,
-      mergedDisabled: w,
-      mergedError: re,
-      eventHandlers: ie
-    } = et({
-      size: Y,
-      disabled: q,
-      error: J
+      size: ie,
+      disabled: ce,
+      error: de,
+      options: se,
+      filterOption: F,
+      valueKey: p,
+      multiple: $,
+      popupVisible: fe,
+      defaultPopupVisible: ve,
+      showExtraOptions: me,
+      modelValue: pe,
+      fieldNames: A,
+      loading: be,
+      defaultActiveFirstOption: ge
+    } = Ge(a), ye = fa("select"), z = We(), P = `${z}-listbox`, k = (e) => `${z}-option-${encodeURIComponent(e)}`, {
+      formItemCtx: he,
+      mergedSize: we,
+      mergedDisabled: c,
+      mergedError: Oe,
+      eventHandlers: Ve
+    } = da({
+      size: ie,
+      disabled: ce,
+      error: de
     }), {
-      t: ce
-    } = tt(), de = i(() => t.virtualListProps ? "div" : "li"), P = i(() => N(t.allowSearch) && !!t.allowSearch.retainInputValue);
-    i(() => {
-      if (y(t.formatLabel))
+      t: Se
+    } = sa(), H = r(() => !!a.virtualListProps && !n.default), Ce = r(() => H.value ? "div" : "li"), L = r(() => U(a.allowSearch) && !!a.allowSearch.retainInputValue);
+    r(() => {
+      if (h(a.formatLabel))
         return (e) => {
-          const l = u.get(e.value);
-          return t.formatLabel(l);
+          const l = o.get(e.value);
+          return a.formatLabel(l);
         };
     });
-    const R = p(), T = p({}), _ = p(), {
-      computedPopupVisible: c,
-      handlePopupVisibleChange: O
-    } = Ze({
-      popupVisible: X,
-      defaultPopupVisible: Z,
-      emit: r
-    }), k = p(t.defaultValue), E = i(() => {
-      const e = t.modelValue ?? k.value;
-      return (Ie(e) ? e : e || Ke(e) || $e(e) || ze(e) ? [e] : []).map((a) => ({
-        value: a,
-        key: M(a, t.valueKey)
+    const G = m(), R = m(), T = m({}), W = m();
+    re({
+      focus: () => {
+        var e;
+        return (e = R.value) == null ? void 0 : e.focus();
+      },
+      blur: () => {
+        var e;
+        return (e = R.value) == null ? void 0 : e.blur();
+      }
+    });
+    const {
+      computedPopupVisible: d,
+      handlePopupVisibleChange: w
+    } = ca({
+      popupVisible: fe,
+      defaultPopupVisible: ve,
+      emit: i
+    }), D = m(a.defaultValue), O = r(() => {
+      const e = a.modelValue ?? D.value;
+      return (Qe(e) ? e : e || Xe(e) || Ye(e) || Ze(e) ? [e] : []).map((t) => ({
+        value: t,
+        key: te(t, a.valueKey)
       }));
     });
-    H(te, (e) => {
-      (C(e) || He(e)) && (k.value = j.value ? [] : e);
+    I(pe, (e) => {
+      (N(e) || ea(e)) && (D.value = $.value ? [] : e);
     });
-    const d = i(() => E.value.map((e) => e.key)), I = i(() => ({
-      ...rt,
-      ...V == null ? void 0 : V.value
-    })), K = p(), se = (e) => {
+    const s = r(() => O.value.map((e) => e.key)), E = r(() => ({
+      ...ba,
+      ...A == null ? void 0 : A.value
+    })), b = m({}), Be = (e) => {
       const l = {};
-      return e.forEach((a) => {
-        l[a] = u.get(a);
+      return e.forEach((t) => {
+        l[t] = o.get(t) ?? b.value[t];
       }), l;
-    }, fe = (e) => {
-      K.value = se(e);
-    }, pe = (e) => y(t.fallbackOption) ? t.fallbackOption(e) : {
-      [I.value.value]: e,
-      [I.value.label]: String(N(e) ? e[f == null ? void 0 : f.value] : e)
-    }, me = () => {
+    }, xe = (e) => {
+      b.value = Be(e);
+    }, K = (e) => o.get(e) ?? b.value[e], Fe = (e) => h(a.fallbackOption) ? a.fallbackOption(e) : {
+      [E.value.value]: e,
+      [E.value.label]: String(U(e) ? e[p == null ? void 0 : p.value] : e)
+    }, Ae = () => {
       const e = [], l = [];
-      if (t.allowCreate || t.fallbackOption) {
-        for (const a of E.value)
-          if (!l.includes(a.key) && a.value !== "") {
-            const n = u.get(a.key);
-            (!n || n.origin === "extraOptions") && (e.push(a), l.push(a.key));
+      if (a.allowCreate || a.fallbackOption) {
+        for (const t of O.value)
+          if (!l.includes(t.key) && t.value !== "") {
+            const u = o.get(t.key);
+            (!u || u.origin === "extraOptions") && (e.push(t), l.push(t.key));
           }
       }
-      if (t.allowCreate && s.value) {
-        const a = M(s.value);
-        if (!l.includes(a)) {
-          const n = u.get(a);
-          (!n || n.origin === "extraOptions") && e.push({
-            value: s.value,
-            key: a
+      if (a.allowCreate && f.value) {
+        const t = te(f.value);
+        if (!l.includes(t)) {
+          const u = o.get(t);
+          (!u || u.origin === "extraOptions") && e.push({
+            value: f.value,
+            key: t
           });
         }
       }
       return e;
-    }, v = p([]), ve = i(() => v.value.map((e) => {
-      var n;
-      let l = pe(e.value);
-      const a = (n = K.value) == null ? void 0 : n[e.key];
-      return !C(a) && !Me(a) && (l = {
+    }, V = m([]), Ee = r(() => V.value.map((e) => {
+      var u;
+      let l = Fe(e.value);
+      const t = (u = b.value) == null ? void 0 : u[e.key];
+      return !N(t) && !aa(t) && (l = h(a.fallbackOption) ? {
+        ...t.raw,
+        ...l
+      } : {
         ...l,
-        ...a
+        ...t.raw,
+        [E.value.value]: e.value,
+        [E.value.label]: t.label
       }), l;
-    }));
-    Re(() => {
-      Te(() => {
-        var l;
-        const e = me();
-        if (e.length !== v.value.length)
-          v.value = e;
-        else if (e.length > 0) {
-          for (let a = 0; a < e.length; a++)
-            if (e[a].key !== ((l = v.value[a]) == null ? void 0 : l.key)) {
-              v.value = e;
-              break;
-            }
-        }
-      });
-    });
-    const $ = p(t.defaultInputValue), s = i(() => t.inputValue ?? $.value);
-    H(c, (e) => {
-      !e && !P.value && s.value && g("");
+    })), q = m(a.defaultInputValue), f = r(() => a.inputValue ?? q.value);
+    let S;
+    const g = () => {
+      S !== void 0 && clearTimeout(S), S = void 0;
+    };
+    qe(g), I(d, (e) => {
+      e || g(), !e && !L.value && f.value && B("");
+    }), I(c, (e) => {
+      e && (g(), w(!1));
     });
-    const be = (e) => {
+    const je = (e) => {
       var l;
-      return t.multiple ? e.map((a) => {
-        var n;
-        return ((n = u.get(a)) == null ? void 0 : n.value) ?? "";
-      }) : ((l = u.get(e[0])) == null ? void 0 : l.value) ?? (We(u) ? void 0 : "");
-    }, b = (e) => {
-      var a, n;
-      const l = be(e);
-      k.value = l, r("update:modelValue", l), r("change", l), (n = (a = ie.value) == null ? void 0 : a.onChange) == null || n.call(a), fe(e);
-    }, g = (e) => {
-      $.value = e, r("update:inputValue", e), r("inputValueChange", e);
-    }, ge = (e, l) => {
-      if (t.multiple) {
-        if (d.value.includes(e)) {
-          const a = d.value.filter((n) => n !== e);
-          b(a);
-        } else if (Be.value.includes(e))
-          if (t.limit > 0 && d.value.length >= t.limit) {
-            const a = u.get(e);
-            r("exceedLimit", a == null ? void 0 : a.value, l);
-          } else {
-            const a = d.value.concat(e);
-            b(a);
+      return a.multiple ? e.map((t) => {
+        var u, v;
+        return ((u = o.get(t)) == null ? void 0 : u.value) ?? ((v = O.value.find((ze) => ze.key === t)) == null ? void 0 : v.value) ?? "";
+      }) : ((l = o.get(e[0])) == null ? void 0 : l.value) ?? (la(o) ? void 0 : "");
+    }, C = (e) => {
+      var t, u;
+      const l = je(e);
+      D.value = l, i("update:modelValue", l), i("change", l), (u = (t = Ve.value) == null ? void 0 : t.onChange) == null || u.call(t), xe(e);
+    }, B = (e) => {
+      q.value = e, i("update:inputValue", e), i("inputValueChange", e);
+    }, Ne = (e, l) => {
+      if (!(c.value || a.loading || !Y.value.includes(e)))
+        if (g(), a.multiple) {
+          if (s.value.includes(e)) {
+            const t = s.value.filter((u) => u !== e);
+            C(t);
+          } else if (Y.value.includes(e))
+            if (a.limit > 0 && s.value.length >= a.limit) {
+              const t = o.get(e);
+              i("exceedLimit", t == null ? void 0 : t.value, l);
+            } else {
+              const t = s.value.concat(e);
+              C(t);
+            }
+          L.value || B("");
+        } else {
+          if (e !== s.value[0] && C([e]), L.value) {
+            const t = o.get(e);
+            t && B(t.label);
           }
-        P.value || g("");
-      } else {
-        if (e !== d.value[0] && b([e]), P.value) {
-          const a = u.get(e);
-          a && g(a.label);
+          w(!1);
         }
-        O(!1);
-      }
-    }, ye = at((e) => {
-      r("search", e);
-    }, t.searchDelay), he = (e) => {
-      e !== s.value && (c.value || O(!0), g(e), t.allowSearch && ye(e));
-    }, Ve = (e) => {
-      const l = u.get(e), a = d.value.filter((n) => n !== e);
-      b(a), r("remove", l == null ? void 0 : l.value);
-    }, we = (e) => {
-      e == null || e.stopPropagation();
-      const l = d.value.filter((a) => {
-        var n;
-        return (n = u.get(a)) == null ? void 0 : n.disabled;
+    }, Pe = (e) => {
+      g(), S = setTimeout(() => {
+        S = void 0, !c.value && a.allowSearch && e === f.value && i("search", e);
+      }, Math.max(0, a.searchDelay));
+    }, ke = (e) => {
+      c.value || e !== f.value && (d.value || w(!0), B(e), a.allowSearch && Pe(e));
+    }, Le = (e) => {
+      const l = K(e);
+      if (c.value || a.loading || l != null && l.disabled) return;
+      g();
+      const t = s.value.filter((u) => u !== e);
+      C(t), i("remove", l == null ? void 0 : l.value);
+    }, Re = (e) => {
+      if (e == null || e.stopPropagation(), c.value || a.loading || !a.allowClear || !ee.value) return;
+      g();
+      const l = s.value.filter((t) => {
+        var u;
+        return (u = K(t)) == null ? void 0 : u.disabled;
       });
-      b(l), g(""), r("clear", e);
-    }, Oe = (e) => {
-      r("dropdownScroll", e);
-    }, Se = (e) => {
-      r("dropdownReachBottom", e);
+      C(l), B(""), i("clear", e);
+    }, J = (e) => {
+      i("dropdownScroll", e);
+    }, Q = (e) => {
+      i("dropdownReachBottom", e);
     }, {
-      validOptions: z,
-      optionInfoMap: u,
-      validOptionInfos: Ce,
-      enabledOptionKeys: Be,
-      activeKey: S,
-      handleKeyDown: xe
-    } = Xe({
-      multiple: j,
-      options: Q,
-      extraOptions: ve,
-      inputValue: s,
-      filterOption: h,
-      showExtraOptions: ee,
-      component: de,
-      valueKey: f,
-      fieldNames: V,
-      loading: ae,
-      disabled: w,
-      popupVisible: c,
-      valueKeys: d,
-      dropdownRef: R,
+      validOptions: X,
+      optionInfoMap: o,
+      validOptionInfos: Te,
+      enabledOptionKeys: Y,
+      activeKey: j,
+      handleKeyDown: Z
+    } = ia({
+      multiple: $,
+      options: se,
+      extraOptions: Ee,
+      inputValue: f,
+      filterOption: F,
+      showExtraOptions: me,
+      component: Ce,
+      valueKey: p,
+      fieldNames: A,
+      loading: be,
+      disabled: c,
+      popupVisible: d,
+      valueKeys: s,
+      dropdownRef: G,
       optionRefs: T,
-      virtualListRef: _,
-      defaultActiveFirstOption: le,
-      onSelect: ge,
-      onPopupVisibleChange: O,
-      getOptionId: F
-    }), Fe = i(() => nt(B, [...W])), Pe = i(() => ({
-      ...ot(B, [...W]),
+      virtualListRef: W,
+      defaultActiveFirstOption: ge,
+      onSelect: Ne,
+      onPopupVisibleChange: w,
+      getOptionId: k
+    });
+    ae(() => {
+      const e = {};
+      for (const t of s.value) {
+        const u = o.get(t), v = u && u.origin !== "extraOptions" ? u : b.value[t];
+        v && (e[t] = v);
+      }
+      const l = b.value;
+      (Object.keys(l).length !== Object.keys(e).length || Object.keys(e).some((t) => l[t] !== e[t])) && (b.value = e);
+    }), ae(() => {
+      const e = Ae();
+      (e.length !== V.value.length || e.some((l, t) => {
+        var u, v;
+        return l.key !== ((u = V.value[t]) == null ? void 0 : u.key) || l.value !== ((v = V.value[t]) == null ? void 0 : v.value);
+      })) && (V.value = e);
+    });
+    const De = r(() => {
+      const e = (l) => l.flatMap((t) => le(t) ? [{
+        ...t,
+        options: []
+      }, ...e(t.options)] : [t]);
+      return e(X.value);
+    }), Ke = r(() => va(x, Object.keys(x).filter(oe))), _e = r(() => ({
+      ...Object.fromEntries(Object.entries(x).filter(([e]) => oe(e))),
       role: "combobox",
       "aria-haspopup": "listbox",
-      "aria-expanded": String(c.value),
-      "aria-controls": x,
-      "aria-activedescendant": c.value && !C(S.value) ? F(S.value) : void 0,
-      "aria-autocomplete": t.allowSearch || t.allowCreate ? "list" : "none",
-      "aria-label": B["aria-label"] ?? (oe.labelId ? void 0 : t.placeholder ?? ce("common.select"))
-    })), ke = i(() => {
+      "aria-expanded": String(d.value),
+      "aria-controls": P,
+      "aria-activedescendant": d.value && !a.loading && !N(j.value) ? k(j.value) : void 0,
+      "aria-autocomplete": a.allowSearch || a.allowCreate ? "list" : "none",
+      "aria-label": x["aria-label"] ?? (he.labelId ? void 0 : a.placeholder ?? Se("common.select"))
+    })), Ie = r(() => {
       const e = [];
-      for (const l of E.value) {
-        const a = u.get(l.key);
-        a && e.push({
-          ...a,
+      for (const l of O.value) {
+        const t = o.get(l.key);
+        t && e.push({
+          ...t,
           value: l.key,
-          label: (a == null ? void 0 : a.label) ?? String(N(l.value) ? l.value[f == null ? void 0 : f.value] : l.value),
-          closable: !(a != null && a.disabled),
-          tagProps: a == null ? void 0 : a.tagProps
+          label: (t == null ? void 0 : t.label) ?? String(U(l.value) ? l.value[p == null ? void 0 : p.value] : l.value),
+          closable: !(t != null && t.disabled),
+          tagProps: t == null ? void 0 : t.tagProps
         });
       }
       return e;
-    }), Ee = (e) => {
-      if (y(o.option)) {
-        const l = o.option;
+    }), ee = r(() => O.value.some(({
+      key: e,
+      value: l
+    }) => {
+      var t;
+      return (l !== "" || o.has(e)) && !((t = K(e)) != null && t.disabled);
+    })), Me = (e) => {
+      if (h(n.option)) {
+        const l = n.option;
         return () => l({
           data: e.raw
         });
       }
-      return y(e.render) ? e.render : () => e.label;
-    }, L = (e) => {
-      if (Ue(e)) {
+      return h(e.render) ? e.render : () => e.label;
+    }, _ = (e) => {
+      if (le(e)) {
         let l;
-        return m(Je, {
+        return y(oa, {
           key: e.key,
           label: e.label
-        }, ut(l = e.options.map((a) => L(a))) ? l : {
+        }, ma(l = e.options.map((t) => _(t))) ? l : {
           default: () => [l]
         });
       }
-      return Ge(e, {
-        inputValue: s.value,
-        filterOption: h == null ? void 0 : h.value
-      }) ? m(qe, {
+      return ta(e, {
+        inputValue: f.value,
+        filterOption: F == null ? void 0 : F.value
+      }) ? y(na, {
         ref: (l) => {
-          l != null && l.$el && (T.value[e.key] = l.$el);
+          l != null && l.$el ? T.value[e.key] = l.$el : delete T.value[e.key];
         },
         key: e.key,
         value: e.value,
@@ -686,61 +728,62 @@ const W = ["id", "aria-label", "aria-labelledby", "aria-describedby"], rt = {
         disabled: e.disabled,
         internal: !0
       }, {
-        default: Ee(e)
+        default: Me(e)
       }) : null;
-    }, Le = () => m(Ye, {
-      ref: R,
-      id: x,
-      multiple: t.multiple,
-      loading: t.loading,
-      empty: Ce.value.length === 0,
-      virtualList: !!t.virtualListProps,
-      scrollbar: t.scrollbar,
-      showHeaderOnEmpty: t.showHeaderOnEmpty,
-      showFooterOnEmpty: t.showFooterOnEmpty,
-      onScroll: Oe,
-      onReachBottom: Se
+    }, Ue = () => y(ua, {
+      ref: G,
+      id: P,
+      multiple: a.multiple,
+      loading: a.loading,
+      empty: Te.value.length === 0,
+      virtualList: H.value,
+      scrollbar: a.scrollbar,
+      showHeaderOnEmpty: a.showHeaderOnEmpty,
+      showFooterOnEmpty: a.showFooterOnEmpty,
+      onScroll: J,
+      onReachBottom: Q
     }, {
       default: () => {
         var e;
-        return [...((e = o.default) == null ? void 0 : e.call(o)) ?? [], ...z.value.map(L)];
+        return [...((e = n.default) == null ? void 0 : e.call(n)) ?? [], ...X.value.map(_)];
       },
-      "virtual-list": () => (
-        // @ts-ignore
-        m(Qe, A(t.virtualListProps, {
-          ref: _,
-          data: z.value
-        }), {
-          item: ({
-            item: e
-          }) => L(e)
-        })
-      ),
+      "virtual-list": () => y(ra, M(a.virtualListProps, {
+        ref: W,
+        data: De.value,
+        itemKey: "key",
+        scrollbar: a.scrollbar,
+        onScroll: J,
+        onReachBottom: Q
+      }), {
+        item: ({
+          item: e
+        }) => _(e)
+      }),
       // 仅在用户真的提供了插槽时才透传，否则 v-slots 对象里的空 key
       // 会让 SelectDropdown 的 $slots.empty 判定为真，从而跳过默认空态
-      ...o.empty ? {
-        empty: o.empty
+      ...n.empty ? {
+        empty: n.empty
       } : {},
-      ...o.header ? {
-        header: o.header
+      ...n.header ? {
+        header: n.header
       } : {},
-      ...o.footer ? {
-        footer: o.footer
+      ...n.footer ? {
+        footer: n.footer
       } : {}
-    }), Ae = ({
+    }), $e = ({
       data: e
     }) => {
-      var l, a;
-      if ((o.label || y(t.formatLabel)) && e) {
-        const n = u.get(e.value);
-        if (n != null && n.raw)
-          return ((l = o.label) == null ? void 0 : l.call(o, {
-            data: n.raw
-          })) ?? ((a = t.formatLabel) == null ? void 0 : a.call(t, n.raw));
+      var l, t;
+      if ((n.label || h(a.formatLabel)) && e) {
+        const u = o.get(e.value);
+        if (u != null && u.raw)
+          return ((l = n.label) == null ? void 0 : l.call(n, {
+            data: u.raw
+          })) ?? ((t = a.formatLabel) == null ? void 0 : t.call(a, u.raw));
       }
       return (e == null ? void 0 : e.label) ?? "";
     };
-    return () => m(U, A({
+    return () => y(ue, M({
       trigger: "click",
       position: "bl",
       popupOffset: 4,
@@ -749,55 +792,61 @@ const W = ["id", "aria-label", "aria-labelledby", "aria-describedby"], rt = {
       preventFocus: !0,
       autoFitPopupWidth: !0,
       autoFitTransformOrigin: !0,
-      disabled: w.value,
-      popupVisible: c.value,
-      unmountOnClose: t.unmountOnClose,
-      clickToClose: !(t.allowSearch || t.allowCreate),
-      popupContainer: t.popupContainer,
-      onPopupVisibleChange: O
-    }, t.triggerProps), {
+      disabled: c.value,
+      popupVisible: d.value,
+      unmountOnClose: a.unmountOnClose,
+      clickToClose: !(a.allowSearch || a.allowCreate),
+      popupContainer: a.popupContainer,
+      onPopupVisibleChange: w,
+      updateAtScroll: !0
+    }, a.triggerProps), {
       default: () => {
         var e;
-        return [((e = o.trigger) == null ? void 0 : e.call(o, {
-          popupVisible: c.value,
-          disabled: w.value,
-          listboxId: x,
-          activeDescendant: c.value && !C(S.value) ? F(S.value) : void 0
-        })) ?? m(G, A({
-          class: ne.block,
-          modelValue: ke.value,
-          inputValue: s.value,
-          multiple: t.multiple,
-          disabled: w.value,
-          error: re.value,
-          loading: t.loading,
-          allowClear: t.allowClear,
-          allowCreate: t.allowCreate,
-          allowSearch: !!t.allowSearch,
-          opened: c.value,
-          maxTagCount: t.maxTagCount,
-          placeholder: t.placeholder,
-          bordered: t.bordered,
-          size: ue.value,
-          tagNowrap: t.tagNowrap,
-          inputAttrs: Pe.value
-        }, Fe.value, {
-          onInputValueChange: he,
-          onRemove: Ve,
-          onClear: we,
-          onKeydown: xe
+        return [((e = n.trigger) == null ? void 0 : e.call(n, {
+          popupVisible: d.value,
+          disabled: c.value,
+          listboxId: P,
+          activeDescendant: d.value && !a.loading && !N(j.value) ? k(j.value) : void 0,
+          onKeydown: Z
+        })) ?? y(ne, M({
+          ref: R,
+          class: ye.block,
+          modelValue: Ie.value,
+          inputValue: f.value,
+          multiple: a.multiple,
+          disabled: c.value,
+          error: Oe.value,
+          loading: a.loading,
+          allowClear: a.allowClear,
+          clearable: ee.value,
+          allowCreate: a.allowCreate,
+          allowSearch: !!a.allowSearch,
+          opened: d.value,
+          maxTagCount: a.maxTagCount,
+          placeholder: a.placeholder,
+          bordered: a.bordered,
+          size: we.value,
+          tagNowrap: a.tagNowrap,
+          inputAttrs: _e.value
+        }, Ke.value, {
+          onInputValueChange: ke,
+          onRemove: Le,
+          onClear: Re,
+          onKeydown: Z,
+          onFocus: (l) => i("focus", l),
+          onBlur: (l) => i("blur", l)
         }), {
-          label: Ae,
-          prefix: o.prefix,
-          "arrow-icon": o["arrow-icon"],
-          "loading-icon": o["loading-icon"],
-          "search-icon": o["search-icon"]
+          label: $e,
+          prefix: n.prefix,
+          "arrow-icon": n["arrow-icon"],
+          "loading-icon": n["loading-icon"],
+          "search-icon": n["search-icon"]
         })];
       },
-      content: Le
+      content: Ue
     });
   }
 });
 export {
-  Bt as default
+  Pa as default
 };