@element-plus/nightly 0.0.20240727 → 0.0.20240728

package/dist/index.full.js

@@ -1,4 +1,4 @@
-/*! Element Plus v0.0.20240727 */
+/*! Element Plus v0.0.20240728 */
 
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue')) :
@@ -11199,7 +11199,7 @@
   };
 
   function useCursor(input) {
-    const selectionRef = vue.ref();
+    let selectionInfo;
     function recordCursor() {
       if (input.value == void 0)
         return;
@@ -11208,7 +11208,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,
@@ -11217,10 +11217,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;
@@ -11321,6 +11321,41 @@
     };
   }
 
+  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 SCOPE$3 = "use-empty-values";
   const DEFAULT_EMPTY_VALUES = ["", void 0, null];
@@ -11495,7 +11530,7 @@
 
   const ElConfigProvider = withInstall(ConfigProvider);
 
-  const version$1 = "0.0.20240727";
+  const version$1 = "0.0.20240728";
 
   const makeInstaller = (components = []) => {
     const install = (app, options) => {
@@ -13853,7 +13888,6 @@
       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);
@@ -13963,24 +13997,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();
@@ -14118,12 +14140,12 @@
                 style: _ctx.inputStyle,
                 form: _ctx.form,
                 autofocus: _ctx.autofocus,
-                onCompositionstart: handleCompositionStart,
-                onCompositionupdate: handleCompositionUpdate,
-                onCompositionend: handleCompositionEnd,
+                onCompositionstart: _cache[0] || (_cache[0] = (...args) => vue.unref(handleCompositionStart) && vue.unref(handleCompositionStart)(...args)),
+                onCompositionupdate: _cache[1] || (_cache[1] = (...args) => vue.unref(handleCompositionUpdate) && vue.unref(handleCompositionUpdate)(...args)),
+                onCompositionend: _cache[2] || (_cache[2] = (...args) => vue.unref(handleCompositionEnd) && vue.unref(handleCompositionEnd)(...args)),
                 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)),
+                onFocus: _cache[3] || (_cache[3] = (...args) => vue.unref(handleFocus) && vue.unref(handleFocus)(...args)),
+                onBlur: _cache[4] || (_cache[4] = (...args) => vue.unref(handleBlur) && vue.unref(handleBlur)(...args)),
                 onChange: handleChange,
                 onKeydown: handleKeydown
               }), null, 16, _hoisted_2$J),
@@ -14219,12 +14241,12 @@
               form: _ctx.form,
               autofocus: _ctx.autofocus,
               rows: _ctx.rows,
-              onCompositionstart: handleCompositionStart,
-              onCompositionupdate: handleCompositionUpdate,
-              onCompositionend: handleCompositionEnd,
+              onCompositionstart: _cache[5] || (_cache[5] = (...args) => vue.unref(handleCompositionStart) && vue.unref(handleCompositionStart)(...args)),
+              onCompositionupdate: _cache[6] || (_cache[6] = (...args) => vue.unref(handleCompositionUpdate) && vue.unref(handleCompositionUpdate)(...args)),
+              onCompositionend: _cache[7] || (_cache[7] = (...args) => vue.unref(handleCompositionEnd) && vue.unref(handleCompositionEnd)(...args)),
               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: _cache[8] || (_cache[8] = (...args) => vue.unref(handleFocus) && vue.unref(handleFocus)(...args)),
+              onBlur: _cache[9] || (_cache[9] = (...args) => vue.unref(handleBlur) && vue.unref(handleBlur)(...args)),
               onChange: handleChange,
               onKeydown: handleKeydown
             }), null, 16, _hoisted_3$l),
@@ -23843,6 +23865,13 @@
       const { t } = useLocale();
       const { form, formItem } = useFormItem();
       const { valueOnClear } = useEmptyValues(props);
+      const { isComposing, handleComposition } = useComposition({
+        afterComposition(event) {
+          var _a;
+          const text = (_a = event.target) == null ? void 0 : _a.value;
+          handleInput(text);
+        }
+      });
       const tooltipRef = vue.ref(null);
       const input = vue.ref(null);
       const tagWrapper = vue.ref(null);
@@ -23857,13 +23886,12 @@
       const presentTags = vue.ref([]);
       const allPresentTags = vue.ref([]);
       const suggestions = vue.ref([]);
-      const isOnComposition = vue.ref(false);
       const cascaderStyle = vue.computed(() => {
         return attrs.style;
       });
       const isDisabled = vue.computed(() => props.disabled || (form == null ? void 0 : form.disabled));
       const inputPlaceholder = vue.computed(() => props.placeholder || t("el.cascader.placeholder"));
-      const currentPlaceholder = vue.computed(() => searchInputValue.value || presentTags.value.length > 0 || isOnComposition.value ? "" : inputPlaceholder.value);
+      const currentPlaceholder = vue.computed(() => searchInputValue.value || presentTags.value.length > 0 || isComposing.value ? "" : inputPlaceholder.value);
       const realSize = useFormSize();
       const tagSize = vue.computed(() => ["small"].includes(realSize.value) ? "small" : "default");
       const multiple = vue.computed(() => !!props.props.multiple);
@@ -24050,19 +24078,8 @@
         updatePopperPosition();
         emit("expandChange", value);
       };
-      const handleComposition = (event) => {
-        var _a;
-        const text = (_a = event.target) == null ? void 0 : _a.value;
-        if (event.type === "compositionend") {
-          isOnComposition.value = false;
-          vue.nextTick(() => handleInput(text));
-        } else {
-          const lastCharacter = text[text.length - 1] || "";
-          isOnComposition.value = !isKorean(lastCharacter);
-        }
-      };
       const handleKeyDown = (e) => {
-        if (isOnComposition.value)
+        if (isComposing.value)
           return;
         switch (e.code) {
           case EVENT_CODE.enter:
@@ -24222,10 +24239,10 @@
             vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
               class: vue.normalizeClass(vue.unref(cascaderKls)),
               style: vue.normalizeStyle(vue.unref(cascaderStyle)),
-              onClick: _cache[5] || (_cache[5] = () => togglePopperVisible(vue.unref(readonly) ? void 0 : true)),
+              onClick: _cache[8] || (_cache[8] = () => togglePopperVisible(vue.unref(readonly) ? void 0 : true)),
               onKeydown: handleKeyDown,
-              onMouseenter: _cache[6] || (_cache[6] = ($event) => inputHover.value = true),
-              onMouseleave: _cache[7] || (_cache[7] = ($event) => inputHover.value = false)
+              onMouseenter: _cache[9] || (_cache[9] = ($event) => inputHover.value = true),
+              onMouseleave: _cache[10] || (_cache[10] = ($event) => inputHover.value = false)
             }, [
               vue.createVNode(vue.unref(ElInput), {
                 ref_key: "input",
@@ -24239,9 +24256,9 @@
                 size: vue.unref(realSize),
                 class: vue.normalizeClass(vue.unref(inputClass)),
                 tabindex: vue.unref(multiple) && _ctx.filterable && !vue.unref(isDisabled) ? -1 : void 0,
-                onCompositionstart: handleComposition,
-                onCompositionupdate: handleComposition,
-                onCompositionend: handleComposition,
+                onCompositionstart: vue.unref(handleComposition),
+                onCompositionupdate: vue.unref(handleComposition),
+                onCompositionend: vue.unref(handleComposition),
                 onFocus: handleFocus,
                 onBlur: handleBlur,
                 onInput: handleInput
@@ -24268,7 +24285,7 @@
                   }, 8, ["class"]))
                 ]),
                 _: 1
-              }, 8, ["modelValue", "placeholder", "readonly", "disabled", "size", "class", "tabindex"]),
+              }, 8, ["modelValue", "placeholder", "readonly", "disabled", "size", "class", "tabindex", "onCompositionstart", "onCompositionupdate", "onCompositionend"]),
               vue.unref(multiple) ? (vue.openBlock(), vue.createElementBlock("div", {
                 key: 0,
                 ref_key: "tagWrapper",
@@ -24344,9 +24361,9 @@
                   onInput: _cache[3] || (_cache[3] = (e) => handleInput(searchInputValue.value, e)),
                   onClick: _cache[4] || (_cache[4] = vue.withModifiers(($event) => togglePopperVisible(true), ["stop"])),
                   onKeydown: vue.withKeys(handleDelete, ["delete"]),
-                  onCompositionstart: handleComposition,
-                  onCompositionupdate: handleComposition,
-                  onCompositionend: handleComposition,
+                  onCompositionstart: _cache[5] || (_cache[5] = (...args) => vue.unref(handleComposition) && vue.unref(handleComposition)(...args)),
+                  onCompositionupdate: _cache[6] || (_cache[6] = (...args) => vue.unref(handleComposition) && vue.unref(handleComposition)(...args)),
+                  onCompositionend: _cache[7] || (_cache[7] = (...args) => vue.unref(handleComposition) && vue.unref(handleComposition)(...args)),
                   onFocus: handleFocus,
                   onBlur: handleBlur
                 }, null, 42, _hoisted_2$z)), [
@@ -24362,13 +24379,13 @@
               ref_key: "cascaderPanelRef",
               ref: cascaderPanelRef,
               modelValue: vue.unref(checkedValue),
-              "onUpdate:modelValue": _cache[8] || (_cache[8] = ($event) => vue.isRef(checkedValue) ? checkedValue.value = $event : null),
+              "onUpdate:modelValue": _cache[11] || (_cache[11] = ($event) => vue.isRef(checkedValue) ? checkedValue.value = $event : null),
               options: _ctx.options,
               props: props.props,
               border: false,
               "render-label": _ctx.$slots.default,
               onExpandChange: handleExpandChange,
-              onClose: _cache[9] || (_cache[9] = ($event) => _ctx.$nextTick(() => togglePopperVisible(false)))
+              onClose: _cache[12] || (_cache[12] = ($event) => _ctx.$nextTick(() => togglePopperVisible(false)))
             }, null, 8, ["modelValue", "options", "props", "render-label"]), [
               [vue.vShow, !filtering.value]
             ]),
@@ -34212,31 +34229,6 @@
   }
   var ElSelectMenu$1 = /* @__PURE__ */ _export_sfc(_sfc_main$X, [["render", _sfc_render$a], ["__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$1 = 11;
   const useSelect$3 = (props, emit) => {
     const { t } = useLocale();
@@ -34272,6 +34264,14 @@
     const tagMenuRef = vue.ref(null);
     const collapseItemRef = vue.ref(null);
     const scrollbarRef = vue.ref(null);
+    const {
+      isComposing,
+      handleCompositionStart,
+      handleCompositionUpdate,
+      handleCompositionEnd
+    } = useComposition({
+      afterComposition: (e) => onInput(e)
+    });
     const { wrapperRef, isFocused, handleFocus, handleBlur } = useFocusController(inputRef, {
       afterFocus() {
         if (props.automaticDropdown && !expanded.value) {
@@ -34430,7 +34430,7 @@
       updateOptions();
     });
     const handleQueryChange = (val) => {
-      if (states.previousQuery === val) {
+      if (states.previousQuery === val || isComposing.value) {
         return;
       }
       states.previousQuery = val;
@@ -34661,11 +34661,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;
@@ -34739,7 +34734,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") {
@@ -39538,6 +39533,14 @@
     const menuRef = vue.ref(null);
     const tagMenuRef = vue.ref(null);
     const collapseItemRef = vue.ref(null);
+    const {
+      isComposing,
+      handleCompositionStart,
+      handleCompositionEnd,
+      handleCompositionUpdate
+    } = useComposition({
+      afterComposition: (e) => onInput(e)
+    });
     const { wrapperRef, isFocused, handleFocus, handleBlur } = useFocusController(inputRef, {
       afterFocus() {
         if (props.automaticDropdown && !expanded.value) {
@@ -39714,11 +39717,6 @@
       selectNewOption,
       clearAllNewOption
     } = useAllowCreate(props, states);
-    const {
-      handleCompositionStart,
-      handleCompositionUpdate,
-      handleCompositionEnd
-    } = useInput((e) => onInput(e));
     const toggleMenu = () => {
       if (selectDisabled.value)
         return;
@@ -39737,7 +39735,7 @@
     };
     const debouncedOnInputChange = debounce(onInputChange, debounce$1.value);
     const handleQueryChange = (val) => {
-      if (states.previousQuery === val) {
+      if (states.previousQuery === val || isComposing.value) {
         return;
       }
       states.previousQuery = val;
@@ -39912,7 +39910,7 @@
     };
     const onKeyboardNavigate = (direction, hoveringIndex = void 0) => {
       const options = filteredOptions.value;
-      if (!["forward", "backward"].includes(direction) || selectDisabled.value || options.length <= 0 || optionsAllDisabled.value) {
+      if (!["forward", "backward"].includes(direction) || selectDisabled.value || options.length <= 0 || optionsAllDisabled.value || isComposing.value) {
         return;
       }
       if (!expanded.value) {
@@ -58900,6 +58898,7 @@
   exports.useAriaProps = useAriaProps;
   exports.useAttrs = useAttrs;
   exports.useCascaderConfig = useCascaderConfig;
+  exports.useComposition = useComposition;
   exports.useCursor = useCursor;
   exports.useDelayedRender = useDelayedRender;
   exports.useDelayedToggle = useDelayedToggle;