@element-plus/nightly 0.0.20241112 → 0.0.20241114

package/dist/index.full.js

@@ -1,4 +1,4 @@
-/*! Element Plus v0.0.20241112 */
+/*! Element Plus v0.0.20241114 */
 
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue')) :
@@ -9658,9 +9658,8 @@
   };
 
   let registeredEscapeHandlers = [];
-  const cachedHandler = (e) => {
-    const event = e;
-    if (event.key === EVENT_CODE.esc) {
+  const cachedHandler = (event) => {
+    if (event.code === EVENT_CODE.esc) {
       registeredEscapeHandlers.forEach((registeredHandler) => registeredHandler(event));
     }
   };
@@ -11568,7 +11567,7 @@
 
   const ElConfigProvider = withInstall(ConfigProvider);
 
-  const version$1 = "0.0.20241112";
+  const version$1 = "0.0.20241114";
 
   const makeInstaller = (components = []) => {
     const install = (app, options) => {
@@ -15225,9 +15224,9 @@
           return;
         if (focusLayer.paused)
           return;
-        const { key, altKey, ctrlKey, metaKey, currentTarget, shiftKey } = e;
+        const { code, altKey, ctrlKey, metaKey, currentTarget, shiftKey } = e;
         const { loop } = props;
-        const isTabbing = key === EVENT_CODE.tab && !altKey && !ctrlKey && !metaKey;
+        const isTabbing = code === EVENT_CODE.tab && !altKey && !ctrlKey && !metaKey;
         const currentFocusingEl = document.activeElement;
         if (isTabbing && currentFocusingEl) {
           const container = currentTarget;
@@ -15877,7 +15876,7 @@
     },
     triggerKeys: {
       type: definePropType(Array),
-      default: () => [EVENT_CODE.enter, EVENT_CODE.space]
+      default: () => [EVENT_CODE.enter, EVENT_CODE.numpadEnter, EVENT_CODE.space]
     }
   });
 
@@ -19998,6 +19997,8 @@
     emits: ["change", "select-range", "set-option"],
     setup(__props, { emit }) {
       const props = __props;
+      const pickerBase = vue.inject("EP_PICKER_BASE");
+      const { isRange } = pickerBase.props;
       const ns = useNamespace("time");
       const { getHoursList, getMinutesList, getSecondsList } = getTimeLists(props.disabledHours, props.disabledMinutes, props.disabledSeconds);
       let isScrolling = false;
@@ -20022,10 +20023,12 @@
       });
       const timeList = vue.computed(() => {
         const { hours, minutes } = vue.unref(timePartials);
+        const { role, spinnerDate } = props;
+        const compare = !isRange ? spinnerDate : void 0;
         return {
-          hours: getHoursList(props.role),
-          minutes: getMinutesList(hours, props.role),
-          seconds: getSecondsList(hours, minutes, props.role)
+          hours: getHoursList(role, compare),
+          minutes: getMinutesList(hours, role, compare),
+          seconds: getSecondsList(hours, minutes, role, compare)
         };
       });
       const arrowControlTimeList = vue.computed(() => {
@@ -23757,6 +23760,7 @@
             break;
           }
           case EVENT_CODE.enter:
+          case EVENT_CODE.numpadEnter:
             checkNode(target);
             break;
         }
@@ -24274,6 +24278,7 @@
           return;
         switch (e.code) {
           case EVENT_CODE.enter:
+          case EVENT_CODE.numpadEnter:
             togglePopperVisible();
             break;
           case EVENT_CODE.down:
@@ -24328,6 +24333,7 @@
             break;
           }
           case EVENT_CODE.enter:
+          case EVENT_CODE.numpadEnter:
             target.click();
             break;
         }
@@ -26209,6 +26215,7 @@
       function handleKeyDown(event) {
         switch (event.code) {
           case EVENT_CODE.enter:
+          case EVENT_CODE.numpadEnter:
           case EVENT_CODE.space:
             event.preventDefault();
             event.stopPropagation();
@@ -30030,8 +30037,9 @@
       const labelAlign = item.labelAlign ? `is-${item.labelAlign}` : align;
       const className = item.className;
       const labelClassName = item.labelClassName;
+      const width = this.type === "label" ? item.labelWidth || this.descriptions.labelWidth || item.width : item.width;
       const style = {
-        width: addUnit(item.width),
+        width: addUnit(width),
         minWidth: addUnit(item.minWidth)
       };
       const ns = useNamespace("descriptions");
@@ -30170,6 +30178,10 @@
     extra: {
       type: String,
       default: ""
+    },
+    labelWidth: {
+      type: [String, Number],
+      default: ""
     }
   });
 
@@ -30314,6 +30326,10 @@
       type: [String, Number],
       default: ""
     },
+    labelWidth: {
+      type: [String, Number],
+      default: ""
+    },
     align: {
       type: String,
       default: "left"
@@ -31270,7 +31286,7 @@
     }
   };
   const getFocusIntent = (event, orientation, dir) => {
-    const key = getDirectionAwareKey(event.key, dir);
+    const key = getDirectionAwareKey(event.code, dir);
     if (orientation === "vertical" && [EVENT_CODE.left, EVENT_CODE.right].includes(key))
       return void 0;
     if (orientation === "horizontal" && [EVENT_CODE.up, EVENT_CODE.down].includes(key))
@@ -31443,8 +31459,8 @@
       const handleKeydown = composeEventHandlers((e) => {
         emit("keydown", e);
       }, (e) => {
-        const { key, shiftKey, target, currentTarget } = e;
-        if (key === EVENT_CODE.tab && shiftKey) {
+        const { code, shiftKey, target, currentTarget } = e;
+        if (code === EVENT_CODE.tab && shiftKey) {
           onItemShiftTab();
           return;
         }
@@ -31625,7 +31641,12 @@
       const scrollbar = vue.ref(null);
       const currentTabId = vue.ref(null);
       const isUsingKeyboard = vue.ref(false);
-      const triggerKeys = [EVENT_CODE.enter, EVENT_CODE.space, EVENT_CODE.down];
+      const triggerKeys = [
+        EVENT_CODE.enter,
+        EVENT_CODE.numpadEnter,
+        EVENT_CODE.space,
+        EVENT_CODE.down
+      ];
       const wrapStyle = vue.computed(() => ({
         maxHeight: addUnit(props.maxHeight)
       }));
@@ -31913,8 +31934,7 @@
         return "button";
       });
       const handleKeydown = composeEventHandlers((e) => {
-        const { code } = e;
-        if (code === EVENT_CODE.enter || code === EVENT_CODE.space) {
+        if ([EVENT_CODE.enter, EVENT_CODE.numpadEnter, EVENT_CODE.space].includes(e.code)) {
           e.preventDefault();
           e.stopImmediatePropagation();
           emit("clickimpl", e);
@@ -33589,6 +33609,7 @@
               break;
             }
             case EVENT_CODE.enter:
+            case EVENT_CODE.numpadEnter:
             case EVENT_CODE.space: {
               prevDef = true;
               event.currentTarget.click();
@@ -33642,6 +33663,7 @@
             break;
           }
           case EVENT_CODE.enter:
+          case EVENT_CODE.numpadEnter:
           case EVENT_CODE.space: {
             prevDef = true;
             event.currentTarget.click();
@@ -40131,7 +40153,8 @@
           esc,
           down,
           up,
-          enter
+          enter,
+          numpadEnter
         } = EVENT_CODE;
         if (code !== tab) {
           e.preventDefault();
@@ -40139,21 +40162,18 @@
         }
         switch (code) {
           case tab:
-          case esc: {
+          case esc:
             break;
-          }
-          case down: {
+          case down:
             onForward();
             break;
-          }
-          case up: {
+          case up:
             onBackward();
             break;
-          }
-          case enter: {
+          case enter:
+          case numpadEnter:
             onKeyboardSelect();
             break;
-          }
         }
       };
       return () => {
@@ -40837,7 +40857,8 @@
     });
     vue.watch(() => props.modelValue, (val, oldVal) => {
       var _a;
-      if (!val || props.multiple && val.toString() !== states.previousValue || !props.multiple && getValueKey(val) !== getValueKey(states.previousValue)) {
+      const isValEmpty = !val || isArray$1(val) && val.length === 0;
+      if (isValEmpty || props.multiple && !isEqual$1(val.toString(), states.previousValue) || !props.multiple && getValueKey(val) !== getValueKey(states.previousValue)) {
         initStates(true);
       }
       if (!isEqual$1(val, oldVal) && props.validateEvent) {
@@ -41727,7 +41748,6 @@
     };
   };
 
-  const { left, down, right, up, home, end, pageUp, pageDown } = EVENT_CODE;
   const useTooltip = (props, formatTooltip, showTooltip) => {
     const tooltip = vue.ref();
     const tooltipVisible = vue.ref(false);
@@ -41828,20 +41848,30 @@
     };
     const onKeyDown = (event) => {
       let isPreventDefault = true;
-      if ([left, down].includes(event.key)) {
-        onLeftKeyDown();
-      } else if ([right, up].includes(event.key)) {
-        onRightKeyDown();
-      } else if (event.key === home) {
-        onHomeKeyDown();
-      } else if (event.key === end) {
-        onEndKeyDown();
-      } else if (event.key === pageDown) {
-        onPageDownKeyDown();
-      } else if (event.key === pageUp) {
-        onPageUpKeyDown();
-      } else {
-        isPreventDefault = false;
+      switch (event.code) {
+        case EVENT_CODE.left:
+        case EVENT_CODE.down:
+          onLeftKeyDown();
+          break;
+        case EVENT_CODE.right:
+        case EVENT_CODE.up:
+          onRightKeyDown();
+          break;
+        case EVENT_CODE.home:
+          onHomeKeyDown();
+          break;
+        case EVENT_CODE.end:
+          onEndKeyDown();
+          break;
+        case EVENT_CODE.pageDown:
+          onPageDownKeyDown();
+          break;
+        case EVENT_CODE.pageUp:
+          onPageUpKeyDown();
+          break;
+        default:
+          isPreventDefault = false;
+          break;
       }
       isPreventDefault && event.preventDefault();
     };
@@ -50381,31 +50411,27 @@
           }
         }
       };
-      const changeTab = (e) => {
-        const code = e.code;
-        const {
-          up,
-          down,
-          left,
-          right
-        } = EVENT_CODE;
-        if (![up, down, left, right].includes(code))
-          return;
-        const tabList = Array.from(e.currentTarget.querySelectorAll("[role=tab]:not(.is-disabled)"));
-        const currentIndex = tabList.indexOf(e.target);
-        let nextIndex;
-        if (code === left || code === up) {
-          if (currentIndex === 0) {
-            nextIndex = tabList.length - 1;
-          } else {
-            nextIndex = currentIndex - 1;
-          }
-        } else {
-          if (currentIndex < tabList.length - 1) {
-            nextIndex = currentIndex + 1;
-          } else {
-            nextIndex = 0;
-          }
+      const changeTab = (event) => {
+        let step = 0;
+        switch (event.code) {
+          case EVENT_CODE.left:
+          case EVENT_CODE.up:
+            step = -1;
+            break;
+          case EVENT_CODE.right:
+          case EVENT_CODE.down:
+            step = 1;
+            break;
+          default:
+            return;
+        }
+        const tabList = Array.from(event.currentTarget.querySelectorAll("[role=tab]:not(.is-disabled)"));
+        const currentIndex = tabList.indexOf(event.target);
+        let nextIndex = currentIndex + step;
+        if (nextIndex < 0) {
+          nextIndex = tabList.length - 1;
+        } else if (nextIndex >= tabList.length) {
+          nextIndex = 0;
         }
         tabList[nextIndex].focus({
           preventScroll: true
@@ -50623,7 +50649,7 @@
           "tabindex": "0",
           "onClick": handleTabAdd,
           "onKeydown": (ev) => {
-            if (ev.code === EVENT_CODE.enter)
+            if ([EVENT_CODE.enter, EVENT_CODE.numpadEnter].includes(ev.code))
               handleTabAdd();
           }
         }, [addSlot ? vue.renderSlot(slots, "add-icon") : vue.createVNode(ElIcon, {
@@ -53560,7 +53586,7 @@
         currentItem.click();
       }
       const hasInput = currentItem.querySelector('[type="checkbox"]');
-      if ([EVENT_CODE.enter, EVENT_CODE.space].includes(code) && hasInput) {
+      if ([EVENT_CODE.enter, EVENT_CODE.numpadEnter, EVENT_CODE.space].includes(code) && hasInput) {
         ev.preventDefault();
         hasInput.click();
       }
@@ -58188,55 +58214,60 @@
         emit("update:modelValue", value);
         syncAfterCursorMove();
       };
-      const handleInputKeyDown = (e) => {
+      const handleInputKeyDown = (event) => {
         var _a, _b, _c, _d;
-        if (!("key" in e))
-          return;
-        if ((_a = elInputRef.value) == null ? void 0 : _a.isComposing)
+        if (!("code" in event) || ((_a = elInputRef.value) == null ? void 0 : _a.isComposing))
           return;
-        if (["ArrowLeft", "ArrowRight"].includes(e.key)) {
-          syncAfterCursorMove();
-        } else if (["ArrowUp", "ArrowDown"].includes(e.key)) {
-          if (!visible.value)
-            return;
-          e.preventDefault();
-          const direction = e.key === "ArrowUp" ? "prev" : "next";
-          (_b = dropdownRef.value) == null ? void 0 : _b.navigateOptions(direction);
-        } else if (["Enter"].includes(e.key)) {
-          if (!visible.value)
-            return;
-          e.preventDefault();
-          if ((_c = dropdownRef.value) == null ? void 0 : _c.hoverOption) {
-            (_d = dropdownRef.value) == null ? void 0 : _d.selectHoverOption();
-          } else {
-            visible.value = false;
-          }
-        } else if (["Escape"].includes(e.key)) {
-          if (!visible.value)
-            return;
-          e.preventDefault();
-          visible.value = false;
-        } else if (["Backspace"].includes(e.key)) {
-          if (props.whole && mentionCtx.value) {
-            const { splitIndex, selectionEnd, pattern, prefixIndex, prefix } = mentionCtx.value;
-            const inputEl = getInputEl();
-            if (!inputEl)
+        switch (event.code) {
+          case EVENT_CODE.left:
+          case EVENT_CODE.right:
+            syncAfterCursorMove();
+            break;
+          case EVENT_CODE.up:
+          case EVENT_CODE.down:
+            if (!visible.value)
               return;
-            const inputValue = inputEl.value;
-            const matchOption = props.options.find((item) => item.value === pattern);
-            const isWhole = isFunction$1(props.checkIsWhole) ? props.checkIsWhole(pattern, prefix) : matchOption;
-            if (isWhole && splitIndex !== -1 && splitIndex + 1 === selectionEnd) {
-              e.preventDefault();
-              const newValue = inputValue.slice(0, prefixIndex) + inputValue.slice(splitIndex + 1);
-              emit(UPDATE_MODEL_EVENT, newValue);
-              const newSelectionEnd = prefixIndex;
-              vue.nextTick(() => {
-                inputEl.selectionStart = newSelectionEnd;
-                inputEl.selectionEnd = newSelectionEnd;
-                syncDropdownVisible();
-              });
+            event.preventDefault();
+            (_b = dropdownRef.value) == null ? void 0 : _b.navigateOptions(event.code === EVENT_CODE.up ? "prev" : "next");
+            break;
+          case EVENT_CODE.enter:
+          case EVENT_CODE.numpadEnter:
+            if (!visible.value)
+              return;
+            event.preventDefault();
+            if ((_c = dropdownRef.value) == null ? void 0 : _c.hoverOption) {
+              (_d = dropdownRef.value) == null ? void 0 : _d.selectHoverOption();
+            } else {
+              visible.value = false;
+            }
+            break;
+          case EVENT_CODE.esc:
+            if (!visible.value)
+              return;
+            event.preventDefault();
+            visible.value = false;
+            break;
+          case EVENT_CODE.backspace:
+            if (props.whole && mentionCtx.value) {
+              const { splitIndex, selectionEnd, pattern, prefixIndex, prefix } = mentionCtx.value;
+              const inputEl = getInputEl();
+              if (!inputEl)
+                return;
+              const inputValue = inputEl.value;
+              const matchOption = props.options.find((item) => item.value === pattern);
+              const isWhole = isFunction$1(props.checkIsWhole) ? props.checkIsWhole(pattern, prefix) : matchOption;
+              if (isWhole && splitIndex !== -1 && splitIndex + 1 === selectionEnd) {
+                event.preventDefault();
+                const newValue = inputValue.slice(0, prefixIndex) + inputValue.slice(splitIndex + 1);
+                emit(UPDATE_MODEL_EVENT, newValue);
+                const newSelectionEnd = prefixIndex;
+                vue.nextTick(() => {
+                  inputEl.selectionStart = newSelectionEnd;
+                  inputEl.selectionEnd = newSelectionEnd;
+                  syncDropdownVisible();
+                });
+              }
             }
-          }
         }
       };
       const { wrapperRef } = useFocusController(elInputRef, {