x-next 1.8.4 → 1.10.0

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

@@ -1,8 +1,8 @@
-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 { defineComponent as Ne, toRefs as Re, useId as je, computed as i, ref as p, watch as U, nextTick as De, watchEffect as Te, createVNode as m, mergeProps as L, 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 { getKeyFromValue as G, isGroupOptionInfo as Ue, isValidOption as Ge, hasEmptyStringKey as We } from "./utils.js";
+import { Trigger as W } from "../trigger/index.js";
+import Y 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";
@@ -13,12 +13,12 @@ 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";
+import { omit as ot } from "../../_utils/omit.js";
+import nt from "../../_utils/pick.js";
 function ut(t) {
   return typeof t == "function" || Object.prototype.toString.call(t) === "[object Object]" && !_e(t);
 }
-const W = ["id", "aria-label", "aria-labelledby", "aria-describedby"], rt = {
+const q = ["id", "aria-label", "aria-labelledby", "aria-describedby"], rt = {
   value: "value",
   label: "label",
   disabled: "disabled",
@@ -27,8 +27,8 @@ const W = ["id", "aria-label", "aria-labelledby", "aria-describedby"], rt = {
 }, Bt = /* @__PURE__ */ Ne({
   name: "Select",
   components: {
-    Trigger: U,
-    SelectView: G
+    Trigger: W,
+    SelectView: Y
   },
   inheritAttrs: !1,
   props: {
@@ -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: (t, n) => !0
   },
   /**
    * @zh 选项为空时的显示内容
@@ -437,38 +437,38 @@ const W = ["id", "aria-label", "aria-labelledby", "aria-describedby"], rt = {
    * @version 2.22.0
    */
   setup(t, {
-    slots: o,
+    slots: n,
     emit: r,
     attrs: B
   }) {
     const {
-      size: Y,
-      disabled: q,
-      error: J,
-      options: Q,
+      size: J,
+      disabled: Q,
+      error: X,
+      options: Z,
       filterOption: h,
       valueKey: f,
-      multiple: j,
-      popupVisible: X,
-      defaultPopupVisible: Z,
-      showExtraOptions: ee,
-      modelValue: te,
+      multiple: R,
+      popupVisible: ee,
+      defaultPopupVisible: te,
+      showExtraOptions: ae,
+      modelValue: le,
       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,
+      loading: oe,
+      defaultActiveFirstOption: ne
+    } = Re(t), ue = lt("select"), j = je(), x = `${j}-listbox`, F = (e) => `${j}-option-${encodeURIComponent(e)}`, {
+      formItemCtx: re,
+      mergedSize: ie,
       mergedDisabled: w,
-      mergedError: re,
-      eventHandlers: ie
+      mergedError: ce,
+      eventHandlers: de
     } = et({
-      size: Y,
-      disabled: q,
-      error: J
+      size: J,
+      disabled: Q,
+      error: X
     }), {
-      t: ce
-    } = tt(), de = i(() => t.virtualListProps ? "div" : "li"), P = i(() => N(t.allowSearch) && !!t.allowSearch.retainInputValue);
+      t: se
+    } = tt(), fe = i(() => t.virtualListProps ? "div" : "li"), P = i(() => N(t.allowSearch) && !!t.allowSearch.retainInputValue);
     i(() => {
       if (y(t.formatLabel))
         return (e) => {
@@ -476,69 +476,69 @@ const W = ["id", "aria-label", "aria-labelledby", "aria-describedby"], rt = {
           return t.formatLabel(l);
         };
     });
-    const R = p(), T = p({}), _ = p(), {
+    const D = p(), T = p({}), _ = p(), {
       computedPopupVisible: c,
       handlePopupVisibleChange: O
     } = Ze({
-      popupVisible: X,
-      defaultPopupVisible: Z,
+      popupVisible: ee,
+      defaultPopupVisible: te,
       emit: r
-    }), k = p(t.defaultValue), E = i(() => {
+    }), k = p(t.defaultValue), A = 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)
+        key: G(a, t.valueKey)
       }));
     });
-    H(te, (e) => {
-      (C(e) || He(e)) && (k.value = j.value ? [] : e);
+    U(le, (e) => {
+      (C(e) || He(e)) && (k.value = R.value ? [] : e);
     });
-    const d = i(() => E.value.map((e) => e.key)), I = i(() => ({
+    const d = i(() => A.value.map((e) => e.key)), I = i(() => ({
       ...rt,
       ...V == null ? void 0 : V.value
-    })), K = p(), se = (e) => {
+    })), K = p(), pe = (e) => {
       const l = {};
       return e.forEach((a) => {
         l[a] = u.get(a);
       }), l;
-    }, fe = (e) => {
-      K.value = se(e);
-    }, pe = (e) => y(t.fallbackOption) ? t.fallbackOption(e) : {
+    }, me = (e) => {
+      K.value = pe(e);
+    }, ve = (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 = () => {
+    }, be = () => {
       const e = [], l = [];
       if (t.allowCreate || t.fallbackOption) {
-        for (const a of E.value)
+        for (const a of A.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));
+            const o = u.get(a.key);
+            (!o || o.origin === "extraOptions") && (e.push(a), l.push(a.key));
           }
       }
       if (t.allowCreate && s.value) {
-        const a = M(s.value);
+        const a = G(s.value);
         if (!l.includes(a)) {
-          const n = u.get(a);
-          (!n || n.origin === "extraOptions") && e.push({
+          const o = u.get(a);
+          (!o || o.origin === "extraOptions") && e.push({
             value: s.value,
             key: a
           });
         }
       }
       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];
+    }, v = p([]), ge = i(() => v.value.map((e) => {
+      var o;
+      let l = ve(e.value);
+      const a = (o = K.value) == null ? void 0 : o[e.key];
       return !C(a) && !Me(a) && (l = {
         ...l,
         ...a
       }), l;
     }));
-    Re(() => {
+    De(() => {
       Te(() => {
         var l;
-        const e = me();
+        const e = be();
         if (e.length !== v.value.length)
           v.value = e;
         else if (e.length > 0) {
@@ -551,25 +551,25 @@ const W = ["id", "aria-label", "aria-labelledby", "aria-describedby"], rt = {
       });
     });
     const $ = p(t.defaultInputValue), s = i(() => t.inputValue ?? $.value);
-    H(c, (e) => {
+    U(c, (e) => {
       !e && !P.value && s.value && g("");
     });
-    const be = (e) => {
+    const ye = (e) => {
       var l;
       return t.multiple ? e.map((a) => {
-        var n;
-        return ((n = u.get(a)) == null ? void 0 : n.value) ?? "";
+        var o;
+        return ((o = u.get(a)) == null ? void 0 : o.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);
+      var a, o;
+      const l = ye(e);
+      k.value = l, r("update:modelValue", l), r("change", l), (o = (a = de.value) == null ? void 0 : a.onChange) == null || o.call(a), me(e);
     }, g = (e) => {
       $.value = e, r("update:inputValue", e), r("inputValueChange", e);
-    }, ge = (e, l) => {
+    }, he = (e, l) => {
       if (t.multiple) {
         if (d.value.includes(e)) {
-          const a = d.value.filter((n) => n !== e);
+          const a = d.value.filter((o) => o !== e);
           b(a);
         } else if (Be.value.includes(e))
           if (t.limit > 0 && d.value.length >= t.limit) {
@@ -587,64 +587,64 @@ const W = ["id", "aria-label", "aria-labelledby", "aria-describedby"], rt = {
         }
         O(!1);
       }
-    }, ye = at((e) => {
+    }, Ve = 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);
+    }, t.searchDelay), we = (e) => {
+      e !== s.value && (c.value || O(!0), g(e), t.allowSearch && Ve(e));
+    }, Oe = (e) => {
+      const l = u.get(e), a = d.value.filter((o) => o !== e);
       b(a), r("remove", l == null ? void 0 : l.value);
-    }, we = (e) => {
+    }, Se = (e) => {
       e == null || e.stopPropagation();
       const l = d.value.filter((a) => {
-        var n;
-        return (n = u.get(a)) == null ? void 0 : n.disabled;
+        var o;
+        return (o = u.get(a)) == null ? void 0 : o.disabled;
       });
       b(l), g(""), r("clear", e);
-    }, Oe = (e) => {
+    }, z = (e) => {
       r("dropdownScroll", e);
-    }, Se = (e) => {
+    }, H = (e) => {
       r("dropdownReachBottom", e);
     }, {
-      validOptions: z,
+      validOptions: M,
       optionInfoMap: u,
       validOptionInfos: Ce,
       enabledOptionKeys: Be,
       activeKey: S,
       handleKeyDown: xe
     } = Xe({
-      multiple: j,
-      options: Q,
-      extraOptions: ve,
+      multiple: R,
+      options: Z,
+      extraOptions: ge,
       inputValue: s,
       filterOption: h,
-      showExtraOptions: ee,
-      component: de,
+      showExtraOptions: ae,
+      component: fe,
       valueKey: f,
       fieldNames: V,
-      loading: ae,
+      loading: oe,
       disabled: w,
       popupVisible: c,
       valueKeys: d,
-      dropdownRef: R,
+      dropdownRef: D,
       optionRefs: T,
       virtualListRef: _,
-      defaultActiveFirstOption: le,
-      onSelect: ge,
+      defaultActiveFirstOption: ne,
+      onSelect: he,
       onPopupVisibleChange: O,
       getOptionId: F
-    }), Fe = i(() => nt(B, [...W])), Pe = i(() => ({
-      ...ot(B, [...W]),
+    }), Fe = i(() => ot(B, [...q])), Pe = i(() => ({
+      ...nt(B, [...q]),
       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"))
+      "aria-label": B["aria-label"] ?? (re.labelId ? void 0 : t.placeholder ?? se("common.select"))
     })), ke = i(() => {
       const e = [];
-      for (const l of E.value) {
+      for (const l of A.value) {
         const a = u.get(l.key);
         a && e.push({
           ...a,
@@ -655,21 +655,21 @@ const W = ["id", "aria-label", "aria-labelledby", "aria-describedby"], rt = {
         });
       }
       return e;
-    }), Ee = (e) => {
-      if (y(o.option)) {
-        const l = o.option;
+    }), Ae = (e) => {
+      if (y(n.option)) {
+        const l = n.option;
         return () => l({
           data: e.raw
         });
       }
       return y(e.render) ? e.render : () => e.label;
-    }, L = (e) => {
+    }, E = (e) => {
       if (Ue(e)) {
         let l;
         return m(Je, {
           key: e.key,
           label: e.label
-        }, ut(l = e.options.map((a) => L(a))) ? l : {
+        }, ut(l = e.options.map((a) => E(a))) ? l : {
           default: () => [l]
         });
       }
@@ -686,10 +686,10 @@ const W = ["id", "aria-label", "aria-labelledby", "aria-describedby"], rt = {
         disabled: e.disabled,
         internal: !0
       }, {
-        default: Ee(e)
+        default: Ae(e)
       }) : null;
-    }, Le = () => m(Ye, {
-      ref: R,
+    }, Ee = () => m(Ye, {
+      ref: D,
       id: x,
       multiple: t.multiple,
       loading: t.loading,
@@ -698,49 +698,49 @@ const W = ["id", "aria-label", "aria-labelledby", "aria-describedby"], rt = {
       scrollbar: t.scrollbar,
       showHeaderOnEmpty: t.showHeaderOnEmpty,
       showFooterOnEmpty: t.showFooterOnEmpty,
-      onScroll: Oe,
-      onReachBottom: Se
+      onScroll: z,
+      onReachBottom: H
     }, {
       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)) ?? [], ...M.value.map(E)];
       },
-      "virtual-list": () => (
-        // @ts-ignore
-        m(Qe, A(t.virtualListProps, {
-          ref: _,
-          data: z.value
-        }), {
-          item: ({
-            item: e
-          }) => L(e)
-        })
-      ),
+      "virtual-list": () => m(Qe, L(t.virtualListProps, {
+        ref: _,
+        data: M.value,
+        scrollbar: t.scrollbar,
+        onScroll: z,
+        onReachBottom: H
+      }), {
+        item: ({
+          item: e
+        }) => 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 = ({
+    }), Le = ({
       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));
+      if ((n.label || y(t.formatLabel)) && e) {
+        const o = u.get(e.value);
+        if (o != null && o.raw)
+          return ((l = n.label) == null ? void 0 : l.call(n, {
+            data: o.raw
+          })) ?? ((a = t.formatLabel) == null ? void 0 : a.call(t, o.raw));
       }
       return (e == null ? void 0 : e.label) ?? "";
     };
-    return () => m(U, A({
+    return () => m(W, L({
       trigger: "click",
       position: "bl",
       popupOffset: 4,
@@ -754,22 +754,23 @@ const W = ["id", "aria-label", "aria-labelledby", "aria-describedby"], rt = {
       unmountOnClose: t.unmountOnClose,
       clickToClose: !(t.allowSearch || t.allowCreate),
       popupContainer: t.popupContainer,
-      onPopupVisibleChange: O
+      onPopupVisibleChange: O,
+      updateAtScroll: !0
     }, t.triggerProps), {
       default: () => {
         var e;
-        return [((e = o.trigger) == null ? void 0 : e.call(o, {
+        return [((e = n.trigger) == null ? void 0 : e.call(n, {
           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,
+        })) ?? m(Y, L({
+          class: ue.block,
           modelValue: ke.value,
           inputValue: s.value,
           multiple: t.multiple,
           disabled: w.value,
-          error: re.value,
+          error: ce.value,
           loading: t.loading,
           allowClear: t.allowClear,
           allowCreate: t.allowCreate,
@@ -778,23 +779,23 @@ const W = ["id", "aria-label", "aria-labelledby", "aria-describedby"], rt = {
           maxTagCount: t.maxTagCount,
           placeholder: t.placeholder,
           bordered: t.bordered,
-          size: ue.value,
+          size: ie.value,
           tagNowrap: t.tagNowrap,
           inputAttrs: Pe.value
         }, Fe.value, {
-          onInputValueChange: he,
-          onRemove: Ve,
-          onClear: we,
+          onInputValueChange: we,
+          onRemove: Oe,
+          onClear: Se,
           onKeydown: xe
         }), {
-          label: Ae,
-          prefix: o.prefix,
-          "arrow-icon": o["arrow-icon"],
-          "loading-icon": o["loading-icon"],
-          "search-icon": o["search-icon"]
+          label: Le,
+          prefix: n.prefix,
+          "arrow-icon": n["arrow-icon"],
+          "loading-icon": n["loading-icon"],
+          "search-icon": n["search-icon"]
         })];
       },
-      content: Le
+      content: Ee
     });
   }
 });