element-plus 2.8.1 → 2.8.2

package/dist/index.full.js

@@ -1,4 +1,4 @@
-/*! Element Plus v2.8.1 */
+/*! Element Plus v2.8.2 */
 
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue')) :
@@ -9695,7 +9695,7 @@
     vue.onBeforeMount(() => {
       if (!isClient)
         return;
-      if (!cachedContainer && !document.body.querySelector(selector.value)) {
+      if (!cachedContainer || !document.body.querySelector(selector.value)) {
         cachedContainer = createContainer(id.value);
       }
     });
@@ -11559,7 +11559,7 @@
 
   const ElConfigProvider = withInstall(ConfigProvider);
 
-  const version$1 = "2.8.1";
+  const version$1 = "2.8.2";
 
   const makeInstaller = (components = []) => {
     const install = (app, options) => {
@@ -13916,6 +13916,9 @@
       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) {
@@ -20895,7 +20898,7 @@
       }
     });
     const validatedRange = vue.computed(() => {
-      if (!props.range)
+      if (!props.range || !isArray$1(props.range) || props.range.length !== 2 || props.range.some((item) => !isDate$1(item)))
         return [];
       const rangeArrDayjs = props.range.map((_) => dayjs(_).locale(lang.value));
       const [startDayjs, endDayjs] = rangeArrDayjs;
@@ -23683,6 +23686,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,
@@ -23708,7 +23714,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", {
@@ -24416,6 +24423,7 @@
 
   const checkTagProps = buildProps({
     checked: Boolean,
+    disabled: Boolean,
     type: {
       type: String,
       values: ["primary", "success", "info", "warning", "danger"],
@@ -24437,12 +24445,16 @@
     setup(__props, { emit }) {
       const props = __props;
       const ns = useNamespace("check-tag");
+      const isDisabled = vue.computed(() => props.disabled);
       const containerKls = vue.computed(() => [
         ns.b(),
         ns.is("checked", props.checked),
+        ns.is("disabled", isDisabled.value),
         ns.m(props.type || "primary")
       ]);
       const handleChange = () => {
+        if (isDisabled.value)
+          return;
         const checked = !props.checked;
         emit(CHANGE_EVENT, checked);
         emit("update:checked", checked);
@@ -34714,7 +34726,7 @@
       cachedOptions: /* @__PURE__ */ new Map(),
       disabledOptions: /* @__PURE__ */ new Map(),
       optionValues: [],
-      selected: props.multiple ? [] : {},
+      selected: [],
       selectionWidth: 0,
       calculatorWidth: 0,
       collapseItemWidth: 0,
@@ -34745,7 +34757,10 @@
     } = useComposition({
       afterComposition: (e) => onInput(e)
     });
-    const { wrapperRef, isFocused, handleBlur } = useFocusController(inputRef, {
+    const { wrapperRef, isFocused } = useFocusController(inputRef, {
+      beforeFocus() {
+        return selectDisabled.value;
+      },
       afterFocus() {
         if (props.automaticDropdown && !expanded.value) {
           expanded.value = true;
@@ -34930,7 +34945,7 @@
         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 = "";
@@ -34972,13 +34987,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;
@@ -35150,17 +35159,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) {
@@ -35488,9 +35495,21 @@
       "blur"
     ],
     setup(props, { emit }) {
-      const API = useSelect$3(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$3(_props, emit);
       vue.provide(selectKey, vue.reactive({
-        props,
+        props: _props,
         states: API.states,
         optionsArray: API.optionsArray,
         handleOptionSelect: API.handleOptionSelect,
@@ -35500,7 +35519,8 @@
         setSelected: API.setSelected
       }));
       return {
-        ...API
+        ...API,
+        modelValue
       };
     }
   });
@@ -36391,9 +36411,10 @@
       const { t } = useLocale();
       const ns = useNamespace("pagination");
       const vnodeProps = vue.getCurrentInstance().vnode.props || {};
+      const _globalSize = useGlobalSize();
       const _size = vue.computed(() => {
         var _a;
-        return props.small ? "small" : (_a = props.size) != null ? _a : useGlobalSize().value;
+        return props.small ? "small" : (_a = props.size) != null ? _a : _globalSize.value;
       });
       useDeprecated({
         from: "small",
@@ -39985,6 +40006,9 @@
       afterComposition: (e) => onInput(e)
     });
     const { wrapperRef, isFocused } = useFocusController(inputRef, {
+      beforeFocus() {
+        return selectDisabled.value;
+      },
       afterFocus() {
         if (props.automaticDropdown && !expanded.value) {
           expanded.value = true;
@@ -40409,12 +40433,9 @@
         return onInputChange();
       }
     };
-    const handleClickOutside = (event) => {
+    const handleClickOutside = () => {
       expanded.value = false;
-      if (isFocused.value) {
-        const _event = new FocusEvent("focus", event);
-        handleBlur(_event);
-      }
+      isFocused.value && blur();
     };
     const handleMenuEnter = () => {
       states.isBeforeHide = false;
@@ -47481,7 +47502,8 @@
         columnIndex > -1 && owner.value.store.commit("insertColumn", columnConfig.value, isSubColumn.value ? parent2.columnConfig.value : null, updateColumnOrder);
       });
       vue.onBeforeUnmount(() => {
-        const columnIndex = columnConfig.value.getColumnIndex();
+        const getColumnIndex = columnConfig.value.getColumnIndex;
+        const columnIndex = getColumnIndex ? getColumnIndex() : -1;
         columnIndex > -1 && owner.value.store.commit("removeColumn", columnConfig.value, isSubColumn.value ? parent.columnConfig.value : null, updateColumnOrder);
       });
       instance.columnId = columnId.value;
@@ -47574,8 +47596,15 @@
   };
 
   function useColumns(props, columns, fixed) {
+    const _columns = vue.computed(() => vue.unref(columns).map((column, index) => {
+      var _a, _b;
+      return {
+        ...column,
+        key: (_b = (_a = column.key) != null ? _a : column.dataKey) != null ? _b : index
+      };
+    }));
     const visibleColumns = vue.computed(() => {
-      return vue.unref(columns).filter((column) => !column.hidden);
+      return vue.unref(_columns).filter((column) => !column.hidden);
     });
     const fixedColumnsOnLeft = vue.computed(() => vue.unref(visibleColumns).filter((column) => column.fixed === "left" || column.fixed === true));
     const fixedColumnsOnRight = vue.computed(() => vue.unref(visibleColumns).filter((column) => column.fixed === "right"));
@@ -47603,8 +47632,7 @@
       return vue.unref(fixedColumnsOnLeft).length || vue.unref(fixedColumnsOnRight).length;
     });
     const columnsStyles = vue.computed(() => {
-      const _columns = vue.unref(columns);
-      return _columns.reduce((style, column) => {
+      return vue.unref(_columns).reduce((style, column) => {
         style[column.key] = calcColumnStyle(column, vue.unref(fixed), props.fixed);
         return style;
       }, {});
@@ -47613,7 +47641,7 @@
       return vue.unref(visibleColumns).reduce((width, column) => width + column.width, 0);
     });
     const getColumn = (key) => {
-      return vue.unref(columns).find((column) => column.key === key);
+      return vue.unref(_columns).find((column) => column.key === key);
     };
     const getColumnStyle = (key) => {
       return vue.unref(columnsStyles)[key];
@@ -47636,7 +47664,7 @@
       (_a = props.onColumnSort) == null ? void 0 : _a.call(props, { column: getColumn(key), key, order });
     }
     return {
-      columns,
+      columns: _columns,
       columnsStyles,
       columnsTotalWidth,
       fixedColumnsOnLeft,
@@ -49705,11 +49733,34 @@
         };
       };
       const update = () => barStyle.value = getBarStyle();
+      const saveObserver = [];
+      const observerTabs = () => {
+        var _a;
+        saveObserver.forEach((observer) => observer.stop());
+        saveObserver.length = 0;
+        const list = (_a = instance.parent) == null ? void 0 : _a.refs;
+        if (!list)
+          return;
+        for (const key in list) {
+          if (key.startsWith("tab-")) {
+            const _el = list[key];
+            if (_el) {
+              saveObserver.push(useResizeObserver(_el, update));
+            }
+          }
+        }
+      };
       vue.watch(() => props.tabs, async () => {
         await vue.nextTick();
         update();
+        observerTabs();
       }, { immediate: true });
-      useResizeObserver(barRef, () => update());
+      const barObserever = useResizeObserver(barRef, () => update());
+      vue.onBeforeUnmount(() => {
+        saveObserver.forEach((observer) => observer.stop());
+        saveObserver.length = 0;
+        barObserever.stop();
+      });
       expose({
         ref: barRef,
         update
@@ -52780,8 +52831,9 @@
           tree.ctx.emit("node-collapse", props.node.data, props.node, instance);
           props.node.collapse();
         } else {
-          props.node.expand();
-          ctx.emit("node-expand", props.node.data, props.node, instance);
+          props.node.expand(() => {
+            ctx.emit("node-expand", props.node.data, props.node, instance);
+          });
         }
       };
       const handleCheckChange = (value, ev) => {
@@ -53515,6 +53567,14 @@
       }, (data) => getNodeValByProp("children", data));
       return options;
     });
+    const getChildCheckedKeys = () => {
+      var _a;
+      return (_a = tree.value) == null ? void 0 : _a.getCheckedKeys().filter((checkedKey) => {
+        var _a2;
+        const node = (_a2 = tree.value) == null ? void 0 : _a2.getNode(checkedKey);
+        return !isNil(node) && isEmpty(node.childNodes);
+      });
+    };
     return {
       ...pick(vue.toRefs(props), Object.keys(ElTree.props)),
       ...attrs,
@@ -53570,7 +53630,8 @@
           emit(UPDATE_MODEL_EVENT, props.multiple ? checkedKeys : checkedKeys.includes(dataValue) ? dataValue : void 0);
         } else {
           if (props.multiple) {
-            emit(UPDATE_MODEL_EVENT, cachedKeys.concat(tree.value.getCheckedKeys(true)));
+            const childKeys = getChildCheckedKeys();
+            emit(UPDATE_MODEL_EVENT, cachedKeys.concat(childKeys));
           } else {
             const firstLeaf = treeFind([data], (data2) => !isValidArray(getNodeValByProp("children", data2)) && !getNodeValByProp("disabled", data2), (data2) => getNodeValByProp("children", data2));
             const firstLeafKey = firstLeaf ? getNodeValByProp("value", firstLeaf) : void 0;
@@ -53591,6 +53652,20 @@
         });
         (_a = select.value) == null ? void 0 : _a.focus();
       },
+      onNodeExpand: (data, node, e) => {
+        var _a;
+        (_a = attrs.onNodeExpand) == null ? void 0 : _a.call(attrs, data, node, e);
+        vue.nextTick(() => {
+          if (!props.checkStrictly && props.lazy && props.multiple && node.checked) {
+            const dataMap = {};
+            const uncachedCheckedKeys = tree.value.getCheckedKeys();
+            treeEach([tree.value.store.root], (node2) => dataMap[node2.key] = node2, (node2) => node2.childNodes);
+            const cachedKeys = toValidArray(props.modelValue).filter((item) => !(item in dataMap) && !uncachedCheckedKeys.includes(item));
+            const childKeys = getChildCheckedKeys();
+            emit(UPDATE_MODEL_EVENT, cachedKeys.concat(childKeys));
+          }
+        });
+      },
       cacheOptions
     };
   };
@@ -54131,34 +54206,26 @@
       return ((_a = props.props) == null ? void 0 : _a.label) || TreeOptionsEnum.LABEL;
     });
     const flattenTree = vue.computed(() => {
+      var _a;
       const expandedKeys = expandedKeySet.value;
       const hiddenKeys = hiddenNodeKeySet.value;
       const flattenNodes = [];
-      const nodes = tree.value && tree.value.treeNodes || [];
-      function traverse() {
-        const stack = [];
-        for (let i = nodes.length - 1; i >= 0; --i) {
-          stack.push(nodes[i]);
-        }
-        while (stack.length) {
-          const node = stack.pop();
-          if (!node)
-            continue;
-          if (!hiddenKeys.has(node.key)) {
-            flattenNodes.push(node);
-          }
-          if (expandedKeys.has(node.key)) {
-            const children = node.children;
-            if (children) {
-              const length = children.length;
-              for (let i = length - 1; i >= 0; --i) {
-                stack.push(children[i]);
-              }
-            }
+      const nodes = ((_a = tree.value) == null ? void 0 : _a.treeNodes) || [];
+      const stack = [];
+      for (let i = nodes.length - 1; i >= 0; --i) {
+        stack.push(nodes[i]);
+      }
+      while (stack.length) {
+        const node = stack.pop();
+        if (hiddenKeys.has(node.key))
+          continue;
+        flattenNodes.push(node);
+        if (node.children && expandedKeys.has(node.key)) {
+          for (let i = node.children.length - 1; i >= 0; --i) {
+            stack.push(node.children[i]);
           }
         }
       }
-      traverse();
       return flattenNodes;
     });
     const isNotEmpty = vue.computed(() => {
@@ -54236,7 +54303,16 @@
       }
     }
     function setExpandedKeys(keys) {
-      expandedKeySet.value = new Set(keys);
+      const expandedKeys = /* @__PURE__ */ new Set();
+      const nodeMap = tree.value.treeNodeMap;
+      keys.forEach((k) => {
+        let node = nodeMap.get(k);
+        while (node && !expandedKeys.has(node.key)) {
+          expandedKeys.add(node.key);
+          node = node.parent;
+        }
+      });
+      expandedKeySet.value = expandedKeys;
     }
     function handleNodeClick(node, e) {
       emit(NODE_CLICK, node.data, node, e);
@@ -57559,6 +57635,7 @@
       const props = __props;
       const passInputProps = vue.computed(() => pick(props, Object.keys(inputProps)));
       const ns = useNamespace("mention");
+      const disabled = useFormDisabled();
       const contentId = useId();
       const elInputRef = vue.ref();
       const tooltipRef = vue.ref();
@@ -57637,6 +57714,9 @@
         }
       };
       const { wrapperRef } = useFocusController(elInputRef, {
+        beforeFocus() {
+          return disabled.value;
+        },
         afterFocus() {
           syncAfterCursorMove();
         },
@@ -57731,6 +57811,7 @@
             ref_key: "elInputRef",
             ref: elInputRef,
             "model-value": _ctx.modelValue,
+            disabled: vue.unref(disabled),
             role: vue.unref(dropdownVisible) ? "combobox" : void 0,
             "aria-activedescendant": vue.unref(dropdownVisible) ? vue.unref(hoveringId) || "" : void 0,
             "aria-controls": vue.unref(dropdownVisible) ? vue.unref(contentId) : void 0,
@@ -57750,7 +57831,7 @@
                 ])
               };
             })
-          ]), 1040, ["model-value", "role", "aria-activedescendant", "aria-controls", "aria-expanded", "aria-label", "aria-autocomplete", "aria-haspopup"]),
+          ]), 1040, ["model-value", "disabled", "role", "aria-activedescendant", "aria-controls", "aria-expanded", "aria-label", "aria-autocomplete", "aria-haspopup"]),
           vue.createVNode(vue.unref(ElTooltip), {
             ref_key: "tooltipRef",
             ref: tooltipRef,
@@ -57776,7 +57857,7 @@
                   ref_key: "dropdownRef",
                   ref: dropdownRef,
                   options: vue.unref(filteredOptions),
-                  disabled: _ctx.disabled,
+                  disabled: vue.unref(disabled),
                   loading: _ctx.loading,
                   "content-id": vue.unref(contentId),
                   "aria-label": _ctx.ariaLabel,
@@ -58587,6 +58668,18 @@
       }
       normalized.appendTo = appendTo;
     }
+    if (isBoolean(messageConfig.grouping) && !normalized.grouping) {
+      normalized.grouping = messageConfig.grouping;
+    }
+    if (isNumber(messageConfig.duration) && normalized.duration === 3e3) {
+      normalized.duration = messageConfig.duration;
+    }
+    if (isNumber(messageConfig.offset) && normalized.offset === 16) {
+      normalized.offset = messageConfig.offset;
+    }
+    if (isBoolean(messageConfig.showClose) && !normalized.showClose) {
+      normalized.showClose = messageConfig.showClose;
+    }
     return normalized;
   };
   const closeMessage = (instance) => {
@@ -58636,9 +58729,6 @@
   const message = (options = {}, context) => {
     if (!isClient)
       return { close: () => void 0 };
-    if (isNumber(messageConfig.max) && instances.length >= messageConfig.max) {
-      return { close: () => void 0 };
-    }
     const normalized = normalizeOptions(options);
     if (normalized.grouping && instances.length) {
       const instance2 = instances.find(({ vnode: vm }) => {
@@ -58651,6 +58741,9 @@
         return instance2.handler;
       }
     }
+    if (isNumber(messageConfig.max) && instances.length >= messageConfig.max) {
+      return { close: () => void 0 };
+    }
     const instance = createMessage(normalized, context);
     instances.push(instance);
     return instance.handler;