hzzt-plus 0.0.3 → 0.0.5

package/dist/index.full.js

@@ -12893,19 +12893,19 @@
     return target;
   };
 
-  const _hoisted_1$b = {
+  const _hoisted_1$6 = {
     key: 0,
     class: "hzzt-title flex align-items-center"
   };
-  const _hoisted_2$a = {
+  const _hoisted_2$6 = {
     key: 0,
     class: "decorative-line"
   };
-  const _hoisted_3$8 = { class: "label-name" };
+  const _hoisted_3$6 = { class: "label-name" };
   const __default__$l = vue.defineComponent({
     name: "HzztTitle"
   });
-  const _sfc_main$t = /* @__PURE__ */ vue.defineComponent({
+  const _sfc_main$u = /* @__PURE__ */ vue.defineComponent({
     ...__default__$l,
     props: {
       label: String,
@@ -12922,10 +12922,10 @@
         return props.label || ((_c = (_b = (_a = slots == null ? void 0 : slots.default) == null ? void 0 : _a.call(slots)) == null ? void 0 : _b[0]) == null ? void 0 : _c.children);
       });
       return (_ctx, _cache) => {
-        return vue.unref(showLabel) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$b, [
-          __props.sideline ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_2$a)) : vue.createCommentVNode("v-if", true),
+        return vue.unref(showLabel) ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1$6, [
+          __props.sideline ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_2$6)) : vue.createCommentVNode("v-if", true),
           vue.renderSlot(_ctx.$slots, "before"),
-          vue.createElementVNode("label", _hoisted_3$8, [
+          vue.createElementVNode("label", _hoisted_3$6, [
             vue.renderSlot(_ctx.$slots, "default", {}, () => [
               vue.createTextVNode(vue.toDisplayString(__props.label), 1)
             ])
@@ -12934,7 +12934,7 @@
       };
     }
   });
-  var Title = /* @__PURE__ */ _export_sfc$1(_sfc_main$t, [["__file", "title.vue"]]);
+  var Title = /* @__PURE__ */ _export_sfc$1(_sfc_main$u, [["__file", "title.vue"]]);
 
   const HzztTitle = withInstall$1(Title);
 
@@ -13144,7 +13144,8 @@
         confirm: "OK",
         clear: "Clear",
         defaultLabel: "color picker",
-        description: "current color is {color}. press enter to select a new color."
+        description: "current color is {color}. press enter to select a new color.",
+        alphaLabel: "pick alpha value"
       },
       datepicker: {
         now: "Now",
@@ -13223,6 +13224,9 @@
         noData: "No data",
         placeholder: "Select"
       },
+      mention: {
+        loading: "Loading"
+      },
       dropdown: {
         toggleDropdown: "Toggle Dropdown"
       },
@@ -13702,7 +13706,7 @@
     vue.onBeforeMount(() => {
       if (!isClient)
         return;
-      if (!cachedContainer && !document.body.querySelector(selector.value)) {
+      if (!cachedContainer || !document.body.querySelector(selector.value)) {
         cachedContainer = createContainer(id.value);
       }
     });
@@ -13813,7 +13817,7 @@
   };
 
   function useCursor(input) {
-    const selectionRef = vue.ref();
+    let selectionInfo;
     function recordCursor() {
       if (input.value == void 0)
         return;
@@ -13822,7 +13826,7 @@
         return;
       const beforeTxt = value.slice(0, Math.max(0, selectionStart));
       const afterTxt = value.slice(Math.max(0, selectionEnd));
-      selectionRef.value = {
+      selectionInfo = {
         selectionStart,
         selectionEnd,
         value,
@@ -13831,10 +13835,10 @@
       };
     }
     function setCursor() {
-      if (input.value == void 0 || selectionRef.value == void 0)
+      if (input.value == void 0 || selectionInfo == void 0)
         return;
       const { value } = input.value;
-      const { beforeTxt, afterTxt, selectionStart } = selectionRef.value;
+      const { beforeTxt, afterTxt, selectionStart } = selectionInfo;
       if (beforeTxt == void 0 || afterTxt == void 0 || selectionStart == void 0)
         return;
       let startPos = value.length;
@@ -13867,13 +13871,19 @@
     });
   };
 
-  function useFocusController(target, { afterFocus, beforeBlur, afterBlur } = {}) {
+  function useFocusController(target, {
+    beforeFocus,
+    afterFocus,
+    beforeBlur,
+    afterBlur
+  } = {}) {
     const instance = vue.getCurrentInstance();
     const { emit } = instance;
     const wrapperRef = vue.shallowRef();
     const isFocused = vue.ref(false);
     const handleFocus = (event) => {
-      if (isFocused.value)
+      const cancelFocus = isFunction$1(beforeFocus) ? beforeFocus(event) : false;
+      if (cancelFocus || isFocused.value)
         return;
       isFocused.value = true;
       emit("focus", event);
@@ -13889,23 +13899,62 @@
       afterBlur == null ? void 0 : afterBlur();
     };
     const handleClick = () => {
-      var _a;
-      (_a = target.value) == null ? void 0 : _a.focus();
+      var _a, _b;
+      if (((_a = wrapperRef.value) == null ? void 0 : _a.contains(document.activeElement)) && wrapperRef.value !== document.activeElement)
+        return;
+      (_b = target.value) == null ? void 0 : _b.focus();
     };
     vue.watch(wrapperRef, (el) => {
       if (el) {
         el.setAttribute("tabindex", "-1");
       }
     });
-    useEventListener(wrapperRef, "click", handleClick);
+    useEventListener(wrapperRef, "focus", handleFocus, true);
+    useEventListener(wrapperRef, "blur", handleBlur, true);
+    useEventListener(wrapperRef, "click", handleClick, true);
     return {
-      wrapperRef,
       isFocused,
+      wrapperRef,
       handleFocus,
       handleBlur
     };
   }
 
+  function useComposition({
+    afterComposition,
+    emit
+  }) {
+    const isComposing = vue.ref(false);
+    const handleCompositionStart = (event) => {
+      emit == null ? void 0 : emit("compositionstart", event);
+      isComposing.value = true;
+    };
+    const handleCompositionUpdate = (event) => {
+      var _a;
+      emit == null ? void 0 : emit("compositionupdate", event);
+      const text = (_a = event.target) == null ? void 0 : _a.value;
+      const lastCharacter = text[text.length - 1] || "";
+      isComposing.value = !isKorean(lastCharacter);
+    };
+    const handleCompositionEnd = (event) => {
+      emit == null ? void 0 : emit("compositionend", event);
+      if (isComposing.value) {
+        isComposing.value = false;
+        vue.nextTick(() => afterComposition(event));
+      }
+    };
+    const handleComposition = (event) => {
+      event.type === "compositionend" ? handleCompositionEnd(event) : handleCompositionUpdate(event);
+    };
+    return {
+      isComposing,
+      handleComposition,
+      handleCompositionStart,
+      handleCompositionUpdate,
+      handleCompositionEnd
+    };
+  }
+
   const emptyValuesContextKey = Symbol("emptyValuesContextKey");
   const DEFAULT_EMPTY_VALUES = ["", void 0, null];
   const DEFAULT_VALUE_ON_CLEAR = void 0;
@@ -13991,7 +14040,7 @@
     name: "ElIcon",
     inheritAttrs: false
   });
-  const _sfc_main$s = /* @__PURE__ */ vue.defineComponent({
+  const _sfc_main$t = /* @__PURE__ */ vue.defineComponent({
     ...__default__$k,
     props: iconProps,
     setup(__props) {
@@ -14016,7 +14065,7 @@
       };
     }
   });
-  var Icon = /* @__PURE__ */ _export_sfc(_sfc_main$s, [["__file", "icon.vue"]]);
+  var Icon = /* @__PURE__ */ _export_sfc(_sfc_main$t, [["__file", "icon.vue"]]);
 
   const ElIcon = withInstall(Icon);
 
@@ -14225,10 +14274,6 @@
       type: String,
       default: void 0
     },
-    label: {
-      type: String,
-      default: void 0
-    },
     tabindex: {
       type: [String, Number],
       default: 0
@@ -14263,14 +14308,11 @@
     compositionend: (evt) => evt instanceof CompositionEvent
   };
 
-  const _hoisted_1$a = ["role"];
-  const _hoisted_2$9 = ["id", "minlength", "maxlength", "type", "disabled", "readonly", "autocomplete", "tabindex", "aria-label", "placeholder", "form", "autofocus"];
-  const _hoisted_3$7 = ["id", "minlength", "maxlength", "tabindex", "disabled", "readonly", "autocomplete", "aria-label", "placeholder", "form", "autofocus", "rows"];
   const __default__$j = vue.defineComponent({
     name: "ElInput",
     inheritAttrs: false
   });
-  const _sfc_main$r = /* @__PURE__ */ vue.defineComponent({
+  const _sfc_main$s = /* @__PURE__ */ vue.defineComponent({
     ...__default__$j,
     props: inputProps,
     emits: inputEmits,
@@ -14321,12 +14363,14 @@
       const input = vue.shallowRef();
       const textarea = vue.shallowRef();
       const hovering = vue.ref(false);
-      const isComposing = vue.ref(false);
       const passwordVisible = vue.ref(false);
       const countStyle = vue.ref();
       const textareaCalcStyle = vue.shallowRef(props.inputStyle);
       const _ref = vue.computed(() => input.value || textarea.value);
       const { wrapperRef, isFocused, handleFocus, handleBlur } = useFocusController(_ref, {
+        beforeFocus() {
+          return inputDisabled.value;
+        },
         afterBlur() {
           var _a;
           if (props.validateEvent) {
@@ -14431,24 +14475,12 @@
       const handleChange = (event) => {
         emit("change", event.target.value);
       };
-      const handleCompositionStart = (event) => {
-        emit("compositionstart", event);
-        isComposing.value = true;
-      };
-      const handleCompositionUpdate = (event) => {
-        var _a;
-        emit("compositionupdate", event);
-        const text = (_a = event.target) == null ? void 0 : _a.value;
-        const lastCharacter = text[text.length - 1] || "";
-        isComposing.value = !isKorean(lastCharacter);
-      };
-      const handleCompositionEnd = (event) => {
-        emit("compositionend", event);
-        if (isComposing.value) {
-          isComposing.value = false;
-          handleInput(event);
-        }
-      };
+      const {
+        isComposing,
+        handleCompositionStart,
+        handleCompositionUpdate,
+        handleCompositionEnd
+      } = useComposition({ emit, afterComposition: handleInput });
       const handlePasswordVisible = () => {
         passwordVisible.value = !passwordVisible.value;
         focus();
@@ -14501,19 +14533,13 @@
         setNativeInputValue();
         vue.nextTick(resizeTextarea);
       });
-      useDeprecated({
-        from: "label",
-        replacement: "aria-label",
-        version: "2.8.0",
-        scope: "el-input",
-        ref: "https://element-plus.org/en-US/component/input.html"
-      }, vue.computed(() => !!props.label));
       expose({
         input,
         textarea,
         ref: _ref,
         textareaStyle,
         autosize: vue.toRef(props, "autosize"),
+        isComposing,
         focus,
         blur,
         select,
@@ -14581,20 +14607,18 @@
                 readonly: _ctx.readonly,
                 autocomplete: _ctx.autocomplete,
                 tabindex: _ctx.tabindex,
-                "aria-label": _ctx.label || _ctx.ariaLabel,
+                "aria-label": _ctx.ariaLabel,
                 placeholder: _ctx.placeholder,
                 style: _ctx.inputStyle,
                 form: _ctx.form,
                 autofocus: _ctx.autofocus,
-                onCompositionstart: handleCompositionStart,
-                onCompositionupdate: handleCompositionUpdate,
-                onCompositionend: handleCompositionEnd,
+                onCompositionstart: vue.unref(handleCompositionStart),
+                onCompositionupdate: vue.unref(handleCompositionUpdate),
+                onCompositionend: vue.unref(handleCompositionEnd),
                 onInput: handleInput,
-                onFocus: _cache[0] || (_cache[0] = (...args) => vue.unref(handleFocus) && vue.unref(handleFocus)(...args)),
-                onBlur: _cache[1] || (_cache[1] = (...args) => vue.unref(handleBlur) && vue.unref(handleBlur)(...args)),
                 onChange: handleChange,
                 onKeydown: handleKeydown
-              }), null, 16, _hoisted_2$9),
+              }), null, 16, ["id", "minlength", "maxlength", "type", "disabled", "readonly", "autocomplete", "tabindex", "aria-label", "placeholder", "form", "autofocus", "onCompositionstart", "onCompositionupdate", "onCompositionend"]),
               vue.createCommentVNode(" suffix slot "),
               vue.unref(suffixVisible) ? (vue.openBlock(), vue.createElementBlock("span", {
                 key: 1,
@@ -14682,31 +14706,31 @@
               readonly: _ctx.readonly,
               autocomplete: _ctx.autocomplete,
               style: vue.unref(textareaStyle),
-              "aria-label": _ctx.label || _ctx.ariaLabel,
+              "aria-label": _ctx.ariaLabel,
               placeholder: _ctx.placeholder,
               form: _ctx.form,
               autofocus: _ctx.autofocus,
               rows: _ctx.rows,
-              onCompositionstart: handleCompositionStart,
-              onCompositionupdate: handleCompositionUpdate,
-              onCompositionend: handleCompositionEnd,
+              onCompositionstart: vue.unref(handleCompositionStart),
+              onCompositionupdate: vue.unref(handleCompositionUpdate),
+              onCompositionend: vue.unref(handleCompositionEnd),
               onInput: handleInput,
-              onFocus: _cache[2] || (_cache[2] = (...args) => vue.unref(handleFocus) && vue.unref(handleFocus)(...args)),
-              onBlur: _cache[3] || (_cache[3] = (...args) => vue.unref(handleBlur) && vue.unref(handleBlur)(...args)),
+              onFocus: vue.unref(handleFocus),
+              onBlur: vue.unref(handleBlur),
               onChange: handleChange,
               onKeydown: handleKeydown
-            }), null, 16, _hoisted_3$7),
+            }), null, 16, ["id", "minlength", "maxlength", "tabindex", "disabled", "readonly", "autocomplete", "aria-label", "placeholder", "form", "autofocus", "rows", "onCompositionstart", "onCompositionupdate", "onCompositionend", "onFocus", "onBlur"]),
             vue.unref(isWordLimitVisible) ? (vue.openBlock(), vue.createElementBlock("span", {
               key: 0,
               style: vue.normalizeStyle(countStyle.value),
               class: vue.normalizeClass(vue.unref(nsInput).e("count"))
             }, vue.toDisplayString(vue.unref(textLength)) + " / " + vue.toDisplayString(_ctx.maxlength), 7)) : vue.createCommentVNode("v-if", true)
           ], 64))
-        ], 16, _hoisted_1$a);
+        ], 16, ["role"]);
       };
     }
   });
-  var Input = /* @__PURE__ */ _export_sfc(_sfc_main$r, [["__file", "input.vue"]]);
+  var Input = /* @__PURE__ */ _export_sfc(_sfc_main$s, [["__file", "input.vue"]]);
 
   const ElInput = withInstall(Input);
 
@@ -14756,7 +14780,7 @@
   });
 
   const COMPONENT_NAME$2 = "Thumb";
-  const _sfc_main$q = /* @__PURE__ */ vue.defineComponent({
+  const _sfc_main$r = /* @__PURE__ */ vue.defineComponent({
     __name: "thumb",
     props: thumbProps,
     setup(__props) {
@@ -14875,7 +14899,7 @@
       };
     }
   });
-  var Thumb = /* @__PURE__ */ _export_sfc(_sfc_main$q, [["__file", "thumb.vue"]]);
+  var Thumb = /* @__PURE__ */ _export_sfc(_sfc_main$r, [["__file", "thumb.vue"]]);
 
   const barProps = buildProps({
     always: {
@@ -14888,7 +14912,7 @@
     }
   });
 
-  const _sfc_main$p = /* @__PURE__ */ vue.defineComponent({
+  const _sfc_main$q = /* @__PURE__ */ vue.defineComponent({
     __name: "bar",
     props: barProps,
     setup(__props, { expose }) {
@@ -14946,7 +14970,7 @@
       };
     }
   });
-  var Bar = /* @__PURE__ */ _export_sfc(_sfc_main$p, [["__file", "bar.vue"]]);
+  var Bar = /* @__PURE__ */ _export_sfc(_sfc_main$q, [["__file", "bar.vue"]]);
 
   const scrollbarProps = buildProps({
     height: {
@@ -15002,7 +15026,7 @@
   const __default__$i = vue.defineComponent({
     name: COMPONENT_NAME$1
   });
-  const _sfc_main$o = /* @__PURE__ */ vue.defineComponent({
+  const _sfc_main$p = /* @__PURE__ */ vue.defineComponent({
     ...__default__$i,
     props: scrollbarProps,
     emits: scrollbarEmits,
@@ -15011,6 +15035,8 @@
       const ns = useNamespace("scrollbar");
       let stopResizeObserver = void 0;
       let stopResizeListener = void 0;
+      let wrapScrollTop = 0;
+      let wrapScrollLeft = 0;
       const scrollbarRef = vue.ref();
       const wrapRef = vue.ref();
       const resizeRef = vue.ref();
@@ -15037,6 +15063,8 @@
         var _a;
         if (wrapRef.value) {
           (_a = barRef.value) == null ? void 0 : _a.handleScroll(wrapRef.value);
+          wrapScrollTop = wrapRef.value.scrollTop;
+          wrapScrollLeft = wrapRef.value.scrollLeft;
           emit("scroll", {
             scrollTop: wrapRef.value.scrollTop,
             scrollLeft: wrapRef.value.scrollLeft
@@ -15089,6 +15117,10 @@
         scrollbarElement: scrollbarRef,
         wrapElement: wrapRef
       }));
+      vue.onActivated(() => {
+        wrapRef.value.scrollTop = wrapScrollTop;
+        wrapRef.value.scrollLeft = wrapScrollLeft;
+      });
       vue.onMounted(() => {
         if (!props.native)
           vue.nextTick(() => {
@@ -15144,7 +15176,7 @@
       };
     }
   });
-  var Scrollbar = /* @__PURE__ */ _export_sfc(_sfc_main$o, [["__file", "scrollbar.vue"]]);
+  var Scrollbar = /* @__PURE__ */ _export_sfc(_sfc_main$p, [["__file", "scrollbar.vue"]]);
 
   const ElScrollbar = withInstall(Scrollbar);
 
@@ -15173,7 +15205,7 @@
     name: "ElPopper",
     inheritAttrs: false
   });
-  const _sfc_main$n = /* @__PURE__ */ vue.defineComponent({
+  const _sfc_main$o = /* @__PURE__ */ vue.defineComponent({
     ...__default__$h,
     props: popperProps,
     setup(__props, { expose }) {
@@ -15197,7 +15229,7 @@
       };
     }
   });
-  var Popper = /* @__PURE__ */ _export_sfc(_sfc_main$n, [["__file", "popper.vue"]]);
+  var Popper = /* @__PURE__ */ _export_sfc(_sfc_main$o, [["__file", "popper.vue"]]);
 
   const popperArrowProps = buildProps({
     arrowOffset: {
@@ -15210,7 +15242,7 @@
     name: "ElPopperArrow",
     inheritAttrs: false
   });
-  const _sfc_main$m = /* @__PURE__ */ vue.defineComponent({
+  const _sfc_main$n = /* @__PURE__ */ vue.defineComponent({
     ...__default__$g,
     props: popperArrowProps,
     setup(__props, { expose }) {
@@ -15237,7 +15269,7 @@
       };
     }
   });
-  var ElPopperArrow = /* @__PURE__ */ _export_sfc(_sfc_main$m, [["__file", "arrow.vue"]]);
+  var ElPopperArrow = /* @__PURE__ */ _export_sfc(_sfc_main$n, [["__file", "arrow.vue"]]);
 
   const NAME = "ElOnlyChild";
   const OnlyChild = vue.defineComponent({
@@ -15328,7 +15360,7 @@
     name: "ElPopperTrigger",
     inheritAttrs: false
   });
-  const _sfc_main$l = /* @__PURE__ */ vue.defineComponent({
+  const _sfc_main$m = /* @__PURE__ */ vue.defineComponent({
     ...__default__$f,
     props: popperTriggerProps,
     setup(__props, { expose }) {
@@ -15354,6 +15386,15 @@
         return ariaHaspopup.value ? `${props.open}` : void 0;
       });
       let virtualTriggerAriaStopWatch = void 0;
+      const TRIGGER_ELE_EVENTS = [
+        "onMouseenter",
+        "onMouseleave",
+        "onClick",
+        "onKeydown",
+        "onFocus",
+        "onBlur",
+        "onContextmenu"
+      ];
       vue.onMounted(() => {
         vue.watch(() => props.virtualRef, (virtualEl) => {
           if (virtualEl) {
@@ -15366,15 +15407,7 @@
           virtualTriggerAriaStopWatch == null ? void 0 : virtualTriggerAriaStopWatch();
           virtualTriggerAriaStopWatch = void 0;
           if (isElement(el)) {
-            [
-              "onMouseenter",
-              "onMouseleave",
-              "onClick",
-              "onKeydown",
-              "onFocus",
-              "onBlur",
-              "onContextmenu"
-            ].forEach((eventName) => {
+            TRIGGER_ELE_EVENTS.forEach((eventName) => {
               var _a;
               const handler = props[eventName];
               if (handler) {
@@ -15408,6 +15441,16 @@
       vue.onBeforeUnmount(() => {
         virtualTriggerAriaStopWatch == null ? void 0 : virtualTriggerAriaStopWatch();
         virtualTriggerAriaStopWatch = void 0;
+        if (triggerRef.value && isElement(triggerRef.value)) {
+          const el = triggerRef.value;
+          TRIGGER_ELE_EVENTS.forEach((eventName) => {
+            const handler = props[eventName];
+            if (handler) {
+              el.removeEventListener(eventName.slice(2).toLowerCase(), handler);
+            }
+          });
+          triggerRef.value = void 0;
+        }
       });
       expose({
         triggerRef
@@ -15427,7 +15470,7 @@
       };
     }
   });
-  var ElPopperTrigger = /* @__PURE__ */ _export_sfc(_sfc_main$l, [["__file", "trigger.vue"]]);
+  var ElPopperTrigger = /* @__PURE__ */ _export_sfc(_sfc_main$m, [["__file", "trigger.vue"]]);
 
   const FOCUS_AFTER_TRAPPED = "focus-trap.focus-after-trapped";
   const FOCUS_AFTER_RELEASED = "focus-trap.focus-after-released";
@@ -15577,7 +15620,7 @@
     });
   };
 
-  const _sfc_main$k = vue.defineComponent({
+  const _sfc_main$l = vue.defineComponent({
     name: "ElFocusTrap",
     inheritAttrs: false,
     props: {
@@ -15807,6 +15850,12 @@
         if (props.trapped) {
           stopTrap();
         }
+        if (forwardRef.value) {
+          forwardRef.value.removeEventListener("keydown", onKeydown);
+          forwardRef.value.removeEventListener("focusin", onFocusIn);
+          forwardRef.value.removeEventListener("focusout", onFocusOut);
+          forwardRef.value = void 0;
+        }
       });
       return {
         onKeydown
@@ -15816,7 +15865,7 @@
   function _sfc_render$4(_ctx, _cache, $props, $setup, $data, $options) {
     return vue.renderSlot(_ctx.$slots, "default", { handleKeydown: _ctx.onKeydown });
   }
-  var ElFocusTrap = /* @__PURE__ */ _export_sfc(_sfc_main$k, [["render", _sfc_render$4], ["__file", "focus-trap.vue"]]);
+  var ElFocusTrap = /* @__PURE__ */ _export_sfc(_sfc_main$l, [["render", _sfc_render$4], ["__file", "focus-trap.vue"]]);
 
   const POSITIONING_STRATEGIES = ["fixed", "absolute"];
   const popperCoreConfigProps = buildProps({
@@ -16107,7 +16156,7 @@
   const __default__$e = vue.defineComponent({
     name: "ElPopperContent"
   });
-  const _sfc_main$j = /* @__PURE__ */ vue.defineComponent({
+  const _sfc_main$k = /* @__PURE__ */ vue.defineComponent({
     ...__default__$e,
     props: popperContentProps,
     emits: popperContentEmits,
@@ -16201,8 +16250,8 @@
           style: vue.unref(contentStyle),
           class: vue.unref(contentClass),
           tabindex: "-1",
-          onMouseenter: _cache[0] || (_cache[0] = (e) => _ctx.$emit("mouseenter", e)),
-          onMouseleave: _cache[1] || (_cache[1] = (e) => _ctx.$emit("mouseleave", e))
+          onMouseenter: (e) => _ctx.$emit("mouseenter", e),
+          onMouseleave: (e) => _ctx.$emit("mouseleave", e)
         }), [
           vue.createVNode(vue.unref(ElFocusTrap), {
             trapped: vue.unref(trapped),
@@ -16220,11 +16269,11 @@
             ]),
             _: 3
           }, 8, ["trapped", "focus-trap-el", "focus-start-el", "onFocusAfterTrapped", "onFocusAfterReleased", "onFocusin", "onFocusoutPrevented", "onReleaseRequested"])
-        ], 16);
+        ], 16, ["onMouseenter", "onMouseleave"]);
       };
     }
   });
-  var ElPopperContent = /* @__PURE__ */ _export_sfc(_sfc_main$j, [["__file", "content.vue"]]);
+  var ElPopperContent = /* @__PURE__ */ _export_sfc(_sfc_main$k, [["__file", "content.vue"]]);
 
   const ElPopper = withInstall(Popper);
 
@@ -16309,7 +16358,7 @@
   const __default__$d = vue.defineComponent({
     name: "ElTooltipTrigger"
   });
-  const _sfc_main$i = /* @__PURE__ */ vue.defineComponent({
+  const _sfc_main$j = /* @__PURE__ */ vue.defineComponent({
     ...__default__$d,
     props: useTooltipTriggerProps,
     setup(__props, { expose }) {
@@ -16369,7 +16418,33 @@
       };
     }
   });
-  var ElTooltipTrigger = /* @__PURE__ */ _export_sfc(_sfc_main$i, [["__file", "trigger.vue"]]);
+  var ElTooltipTrigger = /* @__PURE__ */ _export_sfc(_sfc_main$j, [["__file", "trigger.vue"]]);
+
+  const teleportProps = buildProps({
+    to: {
+      type: definePropType([String, Object]),
+      required: true
+    },
+    disabled: Boolean
+  });
+
+  const _sfc_main$i = /* @__PURE__ */ vue.defineComponent({
+    __name: "teleport",
+    props: teleportProps,
+    setup(__props) {
+      return (_ctx, _cache) => {
+        return _ctx.disabled ? vue.renderSlot(_ctx.$slots, "default", { key: 0 }) : (vue.openBlock(), vue.createBlock(vue.Teleport, {
+          key: 1,
+          to: _ctx.to
+        }, [
+          vue.renderSlot(_ctx.$slots, "default")
+        ], 8, ["to"]));
+      };
+    }
+  });
+  var Teleport = /* @__PURE__ */ _export_sfc(_sfc_main$i, [["__file", "teleport.vue"]]);
+
+  const ElTeleport = withInstall(Teleport);
 
   const __default__$c = vue.defineComponent({
     name: "ElTooltipContent",
@@ -16383,7 +16458,7 @@
       const { selector } = usePopperContainerId();
       const ns = useNamespace("tooltip");
       const contentRef = vue.ref(null);
-      const destroyed = vue.ref(false);
+      let stopHandle;
       const {
         controlled,
         id,
@@ -16403,7 +16478,7 @@
         return props.persistent;
       });
       vue.onBeforeUnmount(() => {
-        destroyed.value = true;
+        stopHandle == null ? void 0 : stopHandle();
       });
       const shouldRender = vue.computed(() => {
         return vue.unref(persistentRef) ? true : vue.unref(open);
@@ -16463,7 +16538,6 @@
           onClose();
         }
       };
-      let stopHandle;
       vue.watch(() => vue.unref(open), (val) => {
         if (!val) {
           stopHandle == null ? void 0 : stopHandle();
@@ -16479,65 +16553,66 @@
         contentRef
       });
       return (_ctx, _cache) => {
-        return vue.openBlock(), vue.createBlock(vue.Teleport, {
+        return vue.openBlock(), vue.createBlock(vue.unref(ElTeleport), {
           disabled: !_ctx.teleported,
           to: vue.unref(appendTo)
-        }, [
-          vue.createVNode(vue.Transition, {
-            name: vue.unref(transitionClass),
-            onAfterLeave: onTransitionLeave,
-            onBeforeEnter,
-            onAfterEnter: onAfterShow,
-            onBeforeLeave
-          }, {
-            default: vue.withCtx(() => [
-              vue.unref(shouldRender) ? vue.withDirectives((vue.openBlock(), vue.createBlock(vue.unref(ElPopperContent), vue.mergeProps({
-                key: 0,
-                id: vue.unref(id),
-                ref_key: "contentRef",
-                ref: contentRef
-              }, _ctx.$attrs, {
-                "aria-label": _ctx.ariaLabel,
-                "aria-hidden": vue.unref(ariaHidden),
-                "boundaries-padding": _ctx.boundariesPadding,
-                "fallback-placements": _ctx.fallbackPlacements,
-                "gpu-acceleration": _ctx.gpuAcceleration,
-                offset: _ctx.offset,
-                placement: _ctx.placement,
-                "popper-options": _ctx.popperOptions,
-                strategy: _ctx.strategy,
-                effect: _ctx.effect,
-                enterable: _ctx.enterable,
-                pure: _ctx.pure,
-                "popper-class": _ctx.popperClass,
-                "popper-style": [_ctx.popperStyle, vue.unref(contentStyle)],
-                "reference-el": _ctx.referenceEl,
-                "trigger-target-el": _ctx.triggerTargetEl,
-                visible: vue.unref(shouldShow),
-                "z-index": _ctx.zIndex,
-                onMouseenter: vue.unref(onContentEnter),
-                onMouseleave: vue.unref(onContentLeave),
-                onBlur,
-                onClose: vue.unref(onClose)
-              }), {
-                default: vue.withCtx(() => [
-                  !destroyed.value ? vue.renderSlot(_ctx.$slots, "default", { key: 0 }) : vue.createCommentVNode("v-if", true)
-                ]),
-                _: 3
-              }, 16, ["id", "aria-label", "aria-hidden", "boundaries-padding", "fallback-placements", "gpu-acceleration", "offset", "placement", "popper-options", "strategy", "effect", "enterable", "pure", "popper-class", "popper-style", "reference-el", "trigger-target-el", "visible", "z-index", "onMouseenter", "onMouseleave", "onClose"])), [
-                [vue.vShow, vue.unref(shouldShow)]
-              ]) : vue.createCommentVNode("v-if", true)
-            ]),
-            _: 3
-          }, 8, ["name"])
-        ], 8, ["disabled", "to"]);
+        }, {
+          default: vue.withCtx(() => [
+            vue.createVNode(vue.Transition, {
+              name: vue.unref(transitionClass),
+              onAfterLeave: onTransitionLeave,
+              onBeforeEnter,
+              onAfterEnter: onAfterShow,
+              onBeforeLeave
+            }, {
+              default: vue.withCtx(() => [
+                vue.unref(shouldRender) ? vue.withDirectives((vue.openBlock(), vue.createBlock(vue.unref(ElPopperContent), vue.mergeProps({
+                  key: 0,
+                  id: vue.unref(id),
+                  ref_key: "contentRef",
+                  ref: contentRef
+                }, _ctx.$attrs, {
+                  "aria-label": _ctx.ariaLabel,
+                  "aria-hidden": vue.unref(ariaHidden),
+                  "boundaries-padding": _ctx.boundariesPadding,
+                  "fallback-placements": _ctx.fallbackPlacements,
+                  "gpu-acceleration": _ctx.gpuAcceleration,
+                  offset: _ctx.offset,
+                  placement: _ctx.placement,
+                  "popper-options": _ctx.popperOptions,
+                  strategy: _ctx.strategy,
+                  effect: _ctx.effect,
+                  enterable: _ctx.enterable,
+                  pure: _ctx.pure,
+                  "popper-class": _ctx.popperClass,
+                  "popper-style": [_ctx.popperStyle, vue.unref(contentStyle)],
+                  "reference-el": _ctx.referenceEl,
+                  "trigger-target-el": _ctx.triggerTargetEl,
+                  visible: vue.unref(shouldShow),
+                  "z-index": _ctx.zIndex,
+                  onMouseenter: vue.unref(onContentEnter),
+                  onMouseleave: vue.unref(onContentLeave),
+                  onBlur,
+                  onClose: vue.unref(onClose)
+                }), {
+                  default: vue.withCtx(() => [
+                    vue.renderSlot(_ctx.$slots, "default")
+                  ]),
+                  _: 3
+                }, 16, ["id", "aria-label", "aria-hidden", "boundaries-padding", "fallback-placements", "gpu-acceleration", "offset", "placement", "popper-options", "strategy", "effect", "enterable", "pure", "popper-class", "popper-style", "reference-el", "trigger-target-el", "visible", "z-index", "onMouseenter", "onMouseleave", "onClose"])), [
+                  [vue.vShow, vue.unref(shouldShow)]
+                ]) : vue.createCommentVNode("v-if", true)
+              ]),
+              _: 3
+            }, 8, ["name"])
+          ]),
+          _: 3
+        }, 8, ["disabled", "to"]);
       };
     }
   });
   var ElTooltipContent = /* @__PURE__ */ _export_sfc(_sfc_main$h, [["__file", "content.vue"]]);
 
-  const _hoisted_1$9 = ["innerHTML"];
-  const _hoisted_2$8 = { key: 1 };
   const __default__$b = vue.defineComponent({
     name: "ElTooltip"
   });
@@ -16679,7 +16754,7 @@
                   _ctx.rawContent ? (vue.openBlock(), vue.createElementBlock("span", {
                     key: 0,
                     innerHTML: _ctx.content
-                  }, null, 8, _hoisted_1$9)) : (vue.openBlock(), vue.createElementBlock("span", _hoisted_2$8, vue.toDisplayString(_ctx.content), 1))
+                  }, null, 8, ["innerHTML"])) : (vue.openBlock(), vue.createElementBlock("span", { key: 1 }, vue.toDisplayString(_ctx.content), 1))
                 ]),
                 _ctx.showArrow ? (vue.openBlock(), vue.createBlock(vue.unref(ElPopperArrow), {
                   key: 0,
@@ -16744,6 +16819,10 @@
       return false;
     });
     const handleClick = (evt) => {
+      if (_disabled.value || props.loading) {
+        evt.stopPropagation();
+        return;
+      }
       if (props.nativeType === "reset") {
         form == null ? void 0 : form.resetFields();
       }
@@ -17864,14 +17943,17 @@
   withNoopInstall(ButtonGroup);
 
   const nodeList$1 = /* @__PURE__ */ new Map();
-  let startClick;
   if (isClient) {
+    let startClick;
     document.addEventListener("mousedown", (e) => startClick = e);
     document.addEventListener("mouseup", (e) => {
-      for (const handlers of nodeList$1.values()) {
-        for (const { documentHandler } of handlers) {
-          documentHandler(e, startClick);
+      if (startClick) {
+        for (const handlers of nodeList$1.values()) {
+          for (const { documentHandler } of handlers) {
+            documentHandler(e, startClick);
+          }
         }
+        startClick = void 0;
       }
     });
   }
@@ -18020,6 +18102,9 @@
       const handleClick = (event) => {
         emit("click", event);
       };
+      const handleVNodeMounted = (vnode) => {
+        vnode.component.subTree.component.bum = null;
+      };
       return (_ctx, _cache) => {
         return _ctx.disableTransitions ? (vue.openBlock(), vue.createElementBlock("span", {
           key: 0,
@@ -18045,7 +18130,8 @@
         ], 6)) : (vue.openBlock(), vue.createBlock(vue.Transition, {
           key: 1,
           name: `${vue.unref(ns).namespace.value}-zoom-in-center`,
-          appear: ""
+          appear: "",
+          onVnodeMounted: handleVNodeMounted
         }, {
           default: vue.withCtx(() => [
             vue.createElementVNode("span", {
@@ -18116,7 +18202,6 @@
       default: null
     },
     name: String,
-    label: String,
     placeholder: String,
     precision: {
       type: Number,
@@ -18136,8 +18221,6 @@
     [UPDATE_MODEL_EVENT]: (val) => isNumber(val) || isNil(val)
   };
 
-  const _hoisted_1$8 = ["aria-label", "onKeydown"];
-  const _hoisted_2$7 = ["aria-label", "onKeydown"];
   const __default__$7 = vue.defineComponent({
     name: "ElInputNumber"
   });
@@ -18366,13 +18449,6 @@
         const innerInput = (_a = input.value) == null ? void 0 : _a.input;
         innerInput == null ? void 0 : innerInput.setAttribute("aria-valuenow", `${(_b = data.currentValue) != null ? _b : ""}`);
       });
-      useDeprecated({
-        from: "label",
-        replacement: "aria-label",
-        version: "2.8.0",
-        scope: "el-input-number",
-        ref: "https://element-plus.org/en-US/component/input-number.html"
-      }, vue.computed(() => !!props.label));
       expose({
         focus,
         blur
@@ -18386,8 +18462,8 @@
             vue.unref(ns).is("without-controls", !_ctx.controls),
             vue.unref(ns).is("controls-right", vue.unref(controlsAtRight))
           ]),
-          onDragstart: _cache[0] || (_cache[0] = vue.withModifiers(() => {
-          }, ["prevent"]))
+          onDragstart: vue.withModifiers(() => {
+          }, ["prevent"])
         }, [
           _ctx.controls ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("span", {
             key: 0,
@@ -18404,7 +18480,7 @@
                 _: 1
               })
             ])
-          ], 42, _hoisted_1$8)), [
+          ], 42, ["aria-label", "onKeydown"])), [
             [vue.unref(vRepeatClick), decrease]
           ]) : vue.createCommentVNode("v-if", true),
           _ctx.controls ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("span", {
@@ -18422,7 +18498,7 @@
                 _: 1
               })
             ])
-          ], 42, _hoisted_2$7)), [
+          ], 42, ["aria-label", "onKeydown"])), [
             [vue.unref(vRepeatClick), increase]
           ]) : vue.createCommentVNode("v-if", true),
           vue.createVNode(vue.unref(ElInput), {
@@ -18439,7 +18515,7 @@
             max: _ctx.max,
             min: _ctx.min,
             name: _ctx.name,
-            "aria-label": _ctx.label || _ctx.ariaLabel,
+            "aria-label": _ctx.ariaLabel,
             "validate-event": false,
             onKeydown: [
               vue.withKeys(vue.withModifiers(increase, ["prevent"]), ["up"]),
@@ -18450,7 +18526,7 @@
             onInput: handleInput,
             onChange: handleInputChange
           }, null, 8, ["id", "step", "model-value", "placeholder", "readonly", "disabled", "size", "max", "min", "name", "aria-label", "onKeydown"])
-        ], 34);
+        ], 42, ["onDragstart"]);
       };
     }
   });
@@ -18465,15 +18541,12 @@
     const select = vue.inject(selectKey);
     const selectGroup = vue.inject(selectGroupKey, { disabled: false });
     const itemSelected = vue.computed(() => {
-      if (select.props.multiple) {
-        return contains(select.props.modelValue, props.value);
-      } else {
-        return contains([select.props.modelValue], props.value);
-      }
+      return contains(castArray(select.props.modelValue), props.value);
     });
     const limitReached = vue.computed(() => {
+      var _a;
       if (select.props.multiple) {
-        const modelValue = select.props.modelValue || [];
+        const modelValue = castArray((_a = select.props.modelValue) != null ? _a : []);
         return !itemSelected.value && modelValue.length >= select.props.multipleLimit && select.props.multipleLimit > 0;
       } else {
         return false;
@@ -18514,7 +18587,7 @@
     });
     vue.watch(() => props.value, (val, oldVal) => {
       const { remote, valueKey } = select.props;
-      if (!isEqual(val, oldVal)) {
+      if (val !== oldVal) {
         select.onOptionDestroy(oldVal, instance.proxy);
         select.onOptionCreate(instance.proxy);
       }
@@ -18592,7 +18665,7 @@
         select.onOptionDestroy(key, vm);
       });
       function selectOptionClick() {
-        if (props.disabled !== true && states.groupDisabled !== true) {
+        if (!isDisabled.value) {
           select.handleOptionSelect(vm);
         }
       }
@@ -18613,7 +18686,6 @@
       };
     }
   });
-  const _hoisted_1$7 = ["id", "aria-disabled", "aria-selected"];
   function _sfc_render$3(_ctx, _cache, $props, $setup, $data, $options) {
     return vue.withDirectives((vue.openBlock(), vue.createElementBlock("li", {
       id: _ctx.id,
@@ -18621,13 +18693,13 @@
       role: "option",
       "aria-disabled": _ctx.isDisabled || void 0,
       "aria-selected": _ctx.itemSelected,
-      onMouseenter: _cache[0] || (_cache[0] = (...args) => _ctx.hoverItem && _ctx.hoverItem(...args)),
-      onClick: _cache[1] || (_cache[1] = vue.withModifiers((...args) => _ctx.selectOptionClick && _ctx.selectOptionClick(...args), ["stop"]))
+      onMouseenter: _ctx.hoverItem,
+      onClick: vue.withModifiers(_ctx.selectOptionClick, ["stop"])
     }, [
       vue.renderSlot(_ctx.$slots, "default", {}, () => [
         vue.createElementVNode("span", null, vue.toDisplayString(_ctx.currentLabel), 1)
       ])
-    ], 42, _hoisted_1$7)), [
+    ], 42, ["id", "aria-disabled", "aria-selected", "onMouseenter", "onClick"])), [
       [vue.vShow, _ctx.visible]
     ]);
   }
@@ -18682,31 +18754,6 @@
   }
   var ElSelectMenu = /* @__PURE__ */ _export_sfc(_sfc_main$a, [["render", _sfc_render$2], ["__file", "select-dropdown.vue"]]);
 
-  function useInput(handleInput) {
-    const isComposing = vue.ref(false);
-    const handleCompositionStart = () => {
-      isComposing.value = true;
-    };
-    const handleCompositionUpdate = (event) => {
-      const text = event.target.value;
-      const lastCharacter = text[text.length - 1] || "";
-      isComposing.value = !isKorean(lastCharacter);
-    };
-    const handleCompositionEnd = (event) => {
-      if (isComposing.value) {
-        isComposing.value = false;
-        if (isFunction$1(handleInput)) {
-          handleInput(event);
-        }
-      }
-    };
-    return {
-      handleCompositionStart,
-      handleCompositionUpdate,
-      handleCompositionEnd
-    };
-  }
-
   const MINIMUM_INPUT_WIDTH = 11;
   const useSelect = (props, emit) => {
     const { t } = useLocale();
@@ -18719,7 +18766,7 @@
       cachedOptions: /* @__PURE__ */ new Map(),
       disabledOptions: /* @__PURE__ */ new Map(),
       optionValues: [],
-      selected: props.multiple ? [] : {},
+      selected: [],
       selectionWidth: 0,
       calculatorWidth: 0,
       collapseItemWidth: 0,
@@ -18742,7 +18789,18 @@
     const tagMenuRef = vue.ref(null);
     const collapseItemRef = vue.ref(null);
     const scrollbarRef = vue.ref(null);
-    const { wrapperRef, isFocused, handleFocus, handleBlur } = useFocusController(inputRef, {
+    const {
+      isComposing,
+      handleCompositionStart,
+      handleCompositionUpdate,
+      handleCompositionEnd
+    } = useComposition({
+      afterComposition: (e) => onInput(e)
+    });
+    const { wrapperRef, isFocused } = useFocusController(inputRef, {
+      beforeFocus() {
+        return selectDisabled.value;
+      },
       afterFocus() {
         if (props.automaticDropdown && !expanded.value) {
           expanded.value = true;
@@ -18767,7 +18825,7 @@
     const { valueOnClear, isEmptyValue } = useEmptyValues(props);
     const selectDisabled = vue.computed(() => props.disabled || (form == null ? void 0 : form.disabled));
     const hasModelValue = vue.computed(() => {
-      return props.multiple ? isArray$1(props.modelValue) && props.modelValue.length > 0 : !isEmptyValue(props.modelValue);
+      return isArray$1(props.modelValue) ? props.modelValue.length > 0 : !isEmptyValue(props.modelValue);
     });
     const showClose = vue.computed(() => {
       return props.clearable && !selectDisabled.value && states.inputHovering && hasModelValue.value;
@@ -18834,10 +18892,11 @@
       }
     });
     const shouldShowPlaceholder = vue.computed(() => {
-      if (isArray$1(props.modelValue)) {
-        return props.modelValue.length === 0 && !states.inputValue;
+      if (props.multiple && !isUndefined(props.modelValue)) {
+        return castArray(props.modelValue).length === 0 && !states.inputValue;
       }
-      return props.filterable ? !states.inputValue : true;
+      const value = isArray$1(props.modelValue) ? props.modelValue[0] : props.modelValue;
+      return props.filterable || isUndefined(value) ? !states.inputValue : true;
     });
     const currentPlaceholder = vue.computed(() => {
       var _a;
@@ -18900,7 +18959,7 @@
       updateOptions();
     });
     const handleQueryChange = (val) => {
-      if (states.previousQuery === val) {
+      if (states.previousQuery === val || isComposing.value) {
         return;
       }
       states.previousQuery = val;
@@ -18923,16 +18982,17 @@
     };
     const setSelected = () => {
       if (!props.multiple) {
-        const option = getOption(props.modelValue);
+        const value = isArray$1(props.modelValue) ? props.modelValue[0] : props.modelValue;
+        const option = getOption(value);
         states.selectedLabel = option.currentLabel;
-        states.selected = option;
+        states.selected = [option];
         return;
       } else {
         states.selectedLabel = "";
       }
       const result = [];
-      if (isArray$1(props.modelValue)) {
-        props.modelValue.forEach((value) => {
+      if (!isUndefined(props.modelValue)) {
+        castArray(props.modelValue).forEach((value) => {
           result.push(getOption(value));
         });
       }
@@ -18967,13 +19027,7 @@
       return newOption;
     };
     const updateHoveringIndex = () => {
-      if (!props.multiple) {
-        states.hoveringIndex = optionsArray.value.findIndex((item) => {
-          return getValueKey(item) === getValueKey(states.selected);
-        });
-      } else {
-        states.hoveringIndex = optionsArray.value.findIndex((item) => states.selected.some((selected) => getValueKey(selected) === getValueKey(item)));
-      }
+      states.hoveringIndex = optionsArray.value.findIndex((item) => states.selected.some((selected) => getValueKey(selected) === getValueKey(item)));
     };
     const resetSelectionWidth = () => {
       states.selectionWidth = selectionRef.value.getBoundingClientRect().width;
@@ -19021,7 +19075,7 @@
       if (e.code === EVENT_CODE.delete)
         return;
       if (e.target.value.length <= 0) {
-        const value = props.modelValue.slice();
+        const value = castArray(props.modelValue).slice();
         const lastNotDisabledIndex = getLastNotDisabledIndex(value);
         if (lastNotDisabledIndex < 0)
           return;
@@ -19035,7 +19089,7 @@
     const deleteTag = (event, tag) => {
       const index = states.selected.indexOf(tag);
       if (index > -1 && !selectDisabled.value) {
-        const value = props.modelValue.slice();
+        const value = castArray(props.modelValue).slice();
         value.splice(index, 1);
         emit(UPDATE_MODEL_EVENT, value);
         emitChange(value);
@@ -19061,8 +19115,9 @@
       focus();
     };
     const handleOptionSelect = (option) => {
+      var _a;
       if (props.multiple) {
-        const value = (props.modelValue || []).slice();
+        const value = castArray((_a = props.modelValue) != null ? _a : []).slice();
         const optionIndex = getValueIndex(value, option.value);
         if (optionIndex > -1) {
           value.splice(optionIndex, 1);
@@ -19131,11 +19186,6 @@
         states.options.delete(key);
       }
     };
-    const {
-      handleCompositionStart,
-      handleCompositionUpdate,
-      handleCompositionEnd
-    } = useInput((e) => onInput(e));
     const popperRef = vue.computed(() => {
       var _a, _b;
       return (_b = (_a = tooltipRef.value) == null ? void 0 : _a.popperRef) == null ? void 0 : _b.contentRef;
@@ -19149,17 +19199,15 @@
       (_a = inputRef.value) == null ? void 0 : _a.focus();
     };
     const blur = () => {
-      handleClickOutside();
+      var _a;
+      (_a = inputRef.value) == null ? void 0 : _a.blur();
     };
     const handleClearClick = (event) => {
       deleteSelected(event);
     };
-    const handleClickOutside = (event) => {
+    const handleClickOutside = () => {
       expanded.value = false;
-      if (isFocused.value) {
-        const _event = new FocusEvent("focus", event);
-        vue.nextTick(() => handleBlur(_event));
-      }
+      isFocused.value && blur();
     };
     const handleEsc = () => {
       if (states.inputValue.length > 0) {
@@ -19209,7 +19257,7 @@
         expanded.value = true;
         return;
       }
-      if (states.options.size === 0 || filteredOptionsCount.value === 0)
+      if (states.options.size === 0 || states.filteredOptionsCount === 0 || isComposing.value)
         return;
       if (!optionsAllDisabled.value) {
         if (direction === "next") {
@@ -19247,12 +19295,6 @@
     const inputStyle = vue.computed(() => ({
       width: `${Math.max(states.calculatorWidth, MINIMUM_INPUT_WIDTH)}px`
     }));
-    if (props.multiple && !isArray$1(props.modelValue)) {
-      emit(UPDATE_MODEL_EVENT, []);
-    }
-    if (!props.multiple && isArray$1(props.modelValue)) {
-      emit(UPDATE_MODEL_EVENT, "");
-    }
     useResizeObserver(selectionRef, resetSelectionWidth);
     useResizeObserver(calculatorRef, resetCalculatorWidth);
     useResizeObserver(menuRef, updateTooltip);
@@ -19305,10 +19347,8 @@
       onOptionCreate,
       onOptionDestroy,
       handleMenuEnter,
-      handleFocus,
       focus,
       blur,
-      handleBlur,
       handleClearClick,
       handleClickOutside,
       handleEsc,
@@ -19475,7 +19515,6 @@
     name: COMPONENT_NAME,
     componentName: COMPONENT_NAME,
     components: {
-      ElInput,
       ElSelectMenu,
       ElOption: Option,
       ElOptions,
@@ -19496,9 +19535,21 @@
       "blur"
     ],
     setup(props, { emit }) {
-      const API = useSelect(props, emit);
+      const modelValue = vue.computed(() => {
+        const { modelValue: rawModelValue, multiple } = props;
+        const fallback = multiple ? [] : void 0;
+        if (isArray$1(rawModelValue)) {
+          return multiple ? rawModelValue : fallback;
+        }
+        return multiple ? fallback : rawModelValue;
+      });
+      const _props = vue.reactive({
+        ...vue.toRefs(props),
+        modelValue
+      });
+      const API = useSelect(_props, emit);
       vue.provide(selectKey, vue.reactive({
-        props,
+        props: _props,
         states: API.states,
         optionsArray: API.optionsArray,
         handleOptionSelect: API.handleOptionSelect,
@@ -19508,13 +19559,11 @@
         setSelected: API.setSelected
       }));
       return {
-        ...API
+        ...API,
+        modelValue
       };
     }
   });
-  const _hoisted_1$6 = ["id", "name", "disabled", "autocomplete", "readonly", "aria-activedescendant", "aria-controls", "aria-expanded", "aria-label"];
-  const _hoisted_2$6 = ["textContent"];
-  const _hoisted_3$6 = { key: 1 };
   function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
     const _component_el_tag = vue.resolveComponent("el-tag");
     const _component_el_tooltip = vue.resolveComponent("el-tooltip");
@@ -19527,9 +19576,8 @@
     return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
       ref: "selectRef",
       class: vue.normalizeClass([_ctx.nsSelect.b(), _ctx.nsSelect.m(_ctx.selectSize)]),
-      [vue.toHandlerKey(_ctx.mouseEnterEventName)]: _cache[16] || (_cache[16] = ($event) => _ctx.states.inputHovering = true),
-      onMouseleave: _cache[17] || (_cache[17] = ($event) => _ctx.states.inputHovering = false),
-      onClick: _cache[18] || (_cache[18] = vue.withModifiers((...args) => _ctx.toggleMenu && _ctx.toggleMenu(...args), ["prevent", "stop"]))
+      [vue.toHandlerKey(_ctx.mouseEnterEventName)]: ($event) => _ctx.states.inputHovering = true,
+      onMouseleave: ($event) => _ctx.states.inputHovering = false
     }, [
       vue.createVNode(_component_el_tooltip, {
         ref: "tooltipRef",
@@ -19547,7 +19595,7 @@
         "gpu-acceleration": false,
         persistent: _ctx.persistent,
         onBeforeShow: _ctx.handleMenuEnter,
-        onHide: _cache[15] || (_cache[15] = ($event) => _ctx.states.isBeforeHide = false)
+        onHide: ($event) => _ctx.states.isBeforeHide = false
       }, {
         default: vue.withCtx(() => {
           var _a;
@@ -19560,7 +19608,8 @@
                 _ctx.nsSelect.is("hovering", _ctx.states.inputHovering),
                 _ctx.nsSelect.is("filterable", _ctx.filterable),
                 _ctx.nsSelect.is("disabled", _ctx.selectDisabled)
-              ])
+              ]),
+              onClick: vue.withModifiers(_ctx.toggleMenu, ["prevent"])
             }, [
               _ctx.$slots.prefix ? (vue.openBlock(), vue.createElementBlock("div", {
                 key: 0,
@@ -19689,7 +19738,7 @@
                   vue.withDirectives(vue.createElementVNode("input", {
                     id: _ctx.inputId,
                     ref: "inputRef",
-                    "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.states.inputValue = $event),
+                    "onUpdate:modelValue": ($event) => _ctx.states.inputValue = $event,
                     type: "text",
                     name: _ctx.name,
                     class: vue.normalizeClass([_ctx.nsSelect.e("input"), _ctx.nsSelect.is(_ctx.selectSize)]),
@@ -19705,21 +19754,19 @@
                     "aria-label": _ctx.ariaLabel,
                     "aria-autocomplete": "none",
                     "aria-haspopup": "listbox",
-                    onFocus: _cache[1] || (_cache[1] = (...args) => _ctx.handleFocus && _ctx.handleFocus(...args)),
-                    onBlur: _cache[2] || (_cache[2] = (...args) => _ctx.handleBlur && _ctx.handleBlur(...args)),
                     onKeydown: [
-                      _cache[3] || (_cache[3] = vue.withKeys(vue.withModifiers(($event) => _ctx.navigateOptions("next"), ["stop", "prevent"]), ["down"])),
-                      _cache[4] || (_cache[4] = vue.withKeys(vue.withModifiers(($event) => _ctx.navigateOptions("prev"), ["stop", "prevent"]), ["up"])),
-                      _cache[5] || (_cache[5] = vue.withKeys(vue.withModifiers((...args) => _ctx.handleEsc && _ctx.handleEsc(...args), ["stop", "prevent"]), ["esc"])),
-                      _cache[6] || (_cache[6] = vue.withKeys(vue.withModifiers((...args) => _ctx.selectOption && _ctx.selectOption(...args), ["stop", "prevent"]), ["enter"])),
-                      _cache[7] || (_cache[7] = vue.withKeys(vue.withModifiers((...args) => _ctx.deletePrevTag && _ctx.deletePrevTag(...args), ["stop"]), ["delete"]))
+                      vue.withKeys(vue.withModifiers(($event) => _ctx.navigateOptions("next"), ["stop", "prevent"]), ["down"]),
+                      vue.withKeys(vue.withModifiers(($event) => _ctx.navigateOptions("prev"), ["stop", "prevent"]), ["up"]),
+                      vue.withKeys(vue.withModifiers(_ctx.handleEsc, ["stop", "prevent"]), ["esc"]),
+                      vue.withKeys(vue.withModifiers(_ctx.selectOption, ["stop", "prevent"]), ["enter"]),
+                      vue.withKeys(vue.withModifiers(_ctx.deletePrevTag, ["stop"]), ["delete"])
                     ],
-                    onCompositionstart: _cache[8] || (_cache[8] = (...args) => _ctx.handleCompositionStart && _ctx.handleCompositionStart(...args)),
-                    onCompositionupdate: _cache[9] || (_cache[9] = (...args) => _ctx.handleCompositionUpdate && _ctx.handleCompositionUpdate(...args)),
-                    onCompositionend: _cache[10] || (_cache[10] = (...args) => _ctx.handleCompositionEnd && _ctx.handleCompositionEnd(...args)),
-                    onInput: _cache[11] || (_cache[11] = (...args) => _ctx.onInput && _ctx.onInput(...args)),
-                    onClick: _cache[12] || (_cache[12] = vue.withModifiers((...args) => _ctx.toggleMenu && _ctx.toggleMenu(...args), ["stop"]))
-                  }, null, 46, _hoisted_1$6), [
+                    onCompositionstart: _ctx.handleCompositionStart,
+                    onCompositionupdate: _ctx.handleCompositionUpdate,
+                    onCompositionend: _ctx.handleCompositionEnd,
+                    onInput: _ctx.onInput,
+                    onClick: vue.withModifiers(_ctx.toggleMenu, ["stop"])
+                  }, null, 46, ["id", "onUpdate:modelValue", "name", "disabled", "autocomplete", "readonly", "aria-activedescendant", "aria-controls", "aria-expanded", "aria-label", "onKeydown", "onCompositionstart", "onCompositionupdate", "onCompositionend", "onInput", "onClick"]), [
                     [vue.vModelText, _ctx.states.inputValue]
                   ]),
                   _ctx.filterable ? (vue.openBlock(), vue.createElementBlock("span", {
@@ -19728,7 +19775,7 @@
                     "aria-hidden": "true",
                     class: vue.normalizeClass(_ctx.nsSelect.e("input-calculator")),
                     textContent: vue.toDisplayString(_ctx.states.inputValue)
-                  }, null, 10, _hoisted_2$6)) : vue.createCommentVNode("v-if", true)
+                  }, null, 10, ["textContent"])) : vue.createCommentVNode("v-if", true)
                 ], 2)) : vue.createCommentVNode("v-if", true),
                 _ctx.shouldShowPlaceholder ? (vue.openBlock(), vue.createElementBlock("div", {
                   key: 2,
@@ -19744,7 +19791,7 @@
                     value: _ctx.modelValue
                   }, () => [
                     vue.createElementVNode("span", null, vue.toDisplayString(_ctx.currentPlaceholder), 1)
-                  ]) : (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$6, vue.toDisplayString(_ctx.currentPlaceholder), 1))
+                  ]) : (vue.openBlock(), vue.createElementBlock("span", { key: 1 }, vue.toDisplayString(_ctx.currentPlaceholder), 1))
                 ], 2)) : vue.createCommentVNode("v-if", true)
               ], 2),
               vue.createElementVNode("div", {
@@ -19762,7 +19809,11 @@
                 }, 8, ["class"])) : vue.createCommentVNode("v-if", true),
                 _ctx.showClose && _ctx.clearIcon ? (vue.openBlock(), vue.createBlock(_component_el_icon, {
                   key: 1,
-                  class: vue.normalizeClass([_ctx.nsSelect.e("caret"), _ctx.nsSelect.e("icon")]),
+                  class: vue.normalizeClass([
+                    _ctx.nsSelect.e("caret"),
+                    _ctx.nsSelect.e("icon"),
+                    _ctx.nsSelect.e("clear")
+                  ]),
                   onClick: _ctx.handleClearClick
                 }, {
                   default: vue.withCtx(() => [
@@ -19780,7 +19831,7 @@
                   _: 1
                 }, 8, ["class"])) : vue.createCommentVNode("v-if", true)
               ], 2)
-            ], 2)
+            ], 10, ["onClick"])
           ];
         }),
         content: vue.withCtx(() => [
@@ -19789,11 +19840,11 @@
               _ctx.$slots.header ? (vue.openBlock(), vue.createElementBlock("div", {
                 key: 0,
                 class: vue.normalizeClass(_ctx.nsSelect.be("dropdown", "header")),
-                onClick: _cache[13] || (_cache[13] = vue.withModifiers(() => {
-                }, ["stop"]))
+                onClick: vue.withModifiers(() => {
+                }, ["stop"])
               }, [
                 vue.renderSlot(_ctx.$slots, "header")
-              ], 2)) : vue.createCommentVNode("v-if", true),
+              ], 10, ["onClick"])) : vue.createCommentVNode("v-if", true),
               vue.withDirectives(vue.createVNode(_component_el_scrollbar, {
                 id: _ctx.contentId,
                 ref: "scrollbarRef",
@@ -19838,18 +19889,18 @@
               _ctx.$slots.footer ? (vue.openBlock(), vue.createElementBlock("div", {
                 key: 3,
                 class: vue.normalizeClass(_ctx.nsSelect.be("dropdown", "footer")),
-                onClick: _cache[14] || (_cache[14] = vue.withModifiers(() => {
-                }, ["stop"]))
+                onClick: vue.withModifiers(() => {
+                }, ["stop"])
               }, [
                 vue.renderSlot(_ctx.$slots, "footer")
-              ], 2)) : vue.createCommentVNode("v-if", true)
+              ], 10, ["onClick"])) : vue.createCommentVNode("v-if", true)
             ]),
             _: 3
           }, 512)
         ]),
         _: 3
-      }, 8, ["visible", "placement", "teleported", "popper-class", "popper-options", "fallback-placements", "effect", "transition", "persistent", "onBeforeShow"])
-    ], 16)), [
+      }, 8, ["visible", "placement", "teleported", "popper-class", "popper-options", "fallback-placements", "effect", "transition", "persistent", "onBeforeShow", "onHide"])
+    ], 16, ["onMouseleave"])), [
       [_directive_click_outside, _ctx.handleClickOutside, _ctx.popperRef]
     ]);
   }
@@ -20709,11 +20760,84 @@
     }
   }
 
+  const Drag = {
+    mounted(el, binding) {
+      let callback = binding.value;
+      if (!callback) {
+        callback = () => ({});
+      }
+      initMouseEvent(el, callback);
+    },
+    unmounted(el) {
+      el.onmousedown = null;
+      el.onmousemove = null;
+      el.onmouseup = null;
+    }
+  };
+  function initMouseEvent(el, callback) {
+    let startPoint = null;
+    let endPoint = null;
+    let roiDiv = null;
+    const onMousedown = (e) => {
+      if (e.ctrlKey) {
+        startPoint = { x: e.x, y: e.y };
+        document.onselectstart = () => false;
+        document.ondragstart = () => false;
+      } else {
+        removeRoi();
+        startPoint = null;
+        endPoint = null;
+      }
+    };
+    const onMousemove = (e) => {
+      if (e.ctrlKey && startPoint) {
+        endPoint = { x: e.x, y: e.y };
+        removeRoi();
+        createRoi();
+      } else {
+        removeRoi();
+        startPoint = null;
+        endPoint = null;
+        document.onselectstart = null;
+        document.ondragstart = null;
+      }
+    };
+    const onMouseup = () => {
+      if (roiDiv) {
+        callback(roiDiv.getBoundingClientRect());
+      }
+      document.onselectstart = null;
+      document.ondragstart = null;
+      removeRoi();
+      startPoint = null;
+      endPoint = null;
+    };
+    function removeRoi() {
+      if (roiDiv && document.body.contains(roiDiv)) {
+        document.body.removeChild(roiDiv);
+      }
+      roiDiv = null;
+    }
+    function createRoi() {
+      roiDiv = document.createElement("div");
+      const distX = endPoint.x - startPoint.x;
+      const distY = endPoint.y - startPoint.y;
+      const left = startPoint.x < endPoint.x ? startPoint.x : endPoint.x;
+      const top = startPoint.y < endPoint.y ? startPoint.y : endPoint.y;
+      roiDiv.style.cssText = `position: fixed;z-index: 9999;width: ${Math.abs(distX)}px;height: ${Math.abs(distY)}px;border: 1px solid #0655c3;left: ${left}px;top: ${top}px;pointer-events: none;`;
+      document.body.appendChild(roiDiv);
+    }
+    el.onmousedown = onMousedown;
+    el.onmousemove = onMousemove;
+    el.onmouseup = onMouseup;
+  }
+
   const install = installer.install;
   const version = installer.version;
 
   exports.Blur = Blur;
   exports.Download = Download;
+  exports.Drag = Drag;
   exports.Height = Height;
   exports.Highlight = Highlight;
   exports.HzztCollapse = HzztCollapse;