element-plus 2.2.19 → 2.2.20

package/dist/index.full.js

@@ -1,4 +1,4 @@
-/*! Element Plus v2.2.19 */
+/*! Element Plus v2.2.20 */
 
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue')) :
@@ -7522,6 +7522,12 @@
   const isPropAbsent = (prop) => {
     return isNil(prop);
   };
+  const isStringNumber = (val) => {
+    if (!isString(val)) {
+      return false;
+    }
+    return !Number.isNaN(Number(val));
+  };
 
   const escapeStringRegexp = (string = "") => string.replace(/[|\\{}()[\]^$+*?.]/g, "\\$&").replace(/-/g, "\\x2d");
   const capitalize = (str) => capitalize$1(str);
@@ -7589,10 +7595,10 @@
   function addUnit(value, defaultUnit = "px") {
     if (!value)
       return "";
-    if (isString(value)) {
-      return value;
-    } else if (isNumber(value)) {
+    if (isNumber(value) || isStringNumber(value)) {
       return `${value}${defaultUnit}`;
+    } else if (isString(value)) {
+      return value;
     }
   }
 
@@ -8695,12 +8701,16 @@
     const vNodes = isArray(children) ? children : [children];
     const result = [];
     vNodes.forEach((child) => {
+      var _a;
       if (isArray(child)) {
         result.push(...flattedChildren(child));
       } else if (vue.isVNode(child) && isArray(child.children)) {
         result.push(...flattedChildren(child.children));
       } else {
         result.push(child);
+        if (vue.isVNode(child) && ((_a = child.component) == null ? void 0 : _a.subTree)) {
+          result.push(...flattedChildren(child.component.subTree));
+        }
       }
     });
     return result;
@@ -11072,7 +11082,7 @@
     };
   };
 
-  const version$1 = "2.2.19";
+  const version$1 = "2.2.20";
 
   const makeInstaller = (components = []) => {
     const install = (app, options) => {
@@ -11121,9 +11131,9 @@
     return target;
   };
 
-  const COMPONENT_NAME$k = "ElAffix";
+  const COMPONENT_NAME$l = "ElAffix";
   const __default__$1w = vue.defineComponent({
-    name: COMPONENT_NAME$k
+    name: COMPONENT_NAME$l
   });
   const _sfc_main$2f = /* @__PURE__ */ vue.defineComponent({
     ...__default__$1w,
@@ -11156,7 +11166,7 @@
       const affixStyle = vue.computed(() => {
         if (!fixed.value)
           return {};
-        const offset = props.offset ? `${props.offset}px` : 0;
+        const offset = props.offset ? addUnit(props.offset) : 0;
         return {
           height: `${rootHeight.value}px`,
           width: `${rootWidth.value}px`,
@@ -11199,7 +11209,7 @@
         if (props.target) {
           target.value = (_a = document.querySelector(props.target)) != null ? _a : void 0;
           if (!target.value)
-            throwError(COMPONENT_NAME$k, `Target is not existed: ${props.target}`);
+            throwError(COMPONENT_NAME$l, `Target is not existed: ${props.target}`);
         } else {
           target.value = document.documentElement;
         }
@@ -11580,7 +11590,7 @@
 
   const _hoisted_1$13 = ["role"];
   const _hoisted_2$G = ["id", "type", "disabled", "formatter", "parser", "readonly", "autocomplete", "tabindex", "aria-label", "placeholder", "form"];
-  const _hoisted_3$l = ["id", "tabindex", "disabled", "readonly", "autocomplete", "aria-label", "placeholder", "form"];
+  const _hoisted_3$k = ["id", "tabindex", "disabled", "readonly", "autocomplete", "aria-label", "placeholder", "form"];
   const __default__$1t = vue.defineComponent({
     name: "ElInput",
     inheritAttrs: false
@@ -11971,7 +11981,7 @@
               onBlur: handleBlur,
               onChange: handleChange,
               onKeydown: handleKeydown
-            }), null, 16, _hoisted_3$l),
+            }), null, 16, _hoisted_3$k),
             vue.unref(isWordLimitVisible) ? (vue.openBlock(), vue.createElementBlock("span", {
               key: 0,
               style: vue.normalizeStyle(countStyle.value),
@@ -12031,7 +12041,7 @@
     always: Boolean
   });
 
-  const COMPONENT_NAME$j = "Thumb";
+  const COMPONENT_NAME$k = "Thumb";
   const _sfc_main$2b = /* @__PURE__ */ vue.defineComponent({
     __name: "thumb",
     props: thumbProps,
@@ -12040,7 +12050,7 @@
       const scrollbar = vue.inject(scrollbarContextKey);
       const ns = useNamespace("scrollbar");
       if (!scrollbar)
-        throwError(COMPONENT_NAME$j, "can not inject scrollbar context");
+        throwError(COMPONENT_NAME$k, "can not inject scrollbar context");
       const instance = vue.ref();
       const thumb = vue.ref();
       const thumbState = vue.ref({});
@@ -13225,8 +13235,7 @@
       {
         name: "computeStyles",
         options: {
-          gpuAcceleration,
-          adaptive: gpuAcceleration
+          gpuAcceleration
         }
       }
     ];
@@ -13502,13 +13511,6 @@
     ...useTooltipContentProps,
     ...useTooltipTriggerProps,
     ...popperArrowProps,
-    openDelay: {
-      type: Number
-    },
-    visibleArrow: {
-      type: Boolean,
-      default: void 0
-    },
     showArrow: {
       type: Boolean,
       default: true
@@ -13771,14 +13773,6 @@
     setup(__props, { expose, emit }) {
       const props = __props;
       usePopperContainer();
-      const compatShowAfter = vue.computed(() => {
-        if (!isUndefined(props.openDelay)) ;
-        return props.openDelay || props.showAfter;
-      });
-      const compatShowArrow = vue.computed(() => {
-        if (!isUndefined(props.visibleArrow)) ;
-        return isBoolean(props.visibleArrow) ? props.visibleArrow : props.showArrow;
-      });
       const id = useId();
       const popperRef = vue.ref();
       const contentRef = vue.ref();
@@ -13796,7 +13790,7 @@
         toggleReason
       });
       const { onOpen, onClose } = useDelayedToggle({
-        showAfter: compatShowAfter,
+        showAfter: vue.toRef(props, "showAfter"),
         hideAfter: vue.toRef(props, "hideAfter"),
         open: show,
         close: hide
@@ -13895,7 +13889,7 @@
               "raw-content": _ctx.rawContent,
               "reference-el": _ctx.referenceEl,
               "trigger-target-el": _ctx.triggerTargetEl,
-              "show-after": vue.unref(compatShowAfter),
+              "show-after": _ctx.showAfter,
               strategy: _ctx.strategy,
               teleported: _ctx.teleported,
               transition: _ctx.transition,
@@ -13910,7 +13904,7 @@
                     innerHTML: _ctx.content
                   }, null, 8, _hoisted_1$12)) : (vue.openBlock(), vue.createElementBlock("span", _hoisted_2$F, vue.toDisplayString(_ctx.content), 1))
                 ]),
-                vue.unref(compatShowArrow) ? (vue.openBlock(), vue.createBlock(vue.unref(ElPopperArrow), {
+                _ctx.showArrow ? (vue.openBlock(), vue.createBlock(vue.unref(ElPopperArrow), {
                   key: 0,
                   "arrow-offset": _ctx.arrowOffset
                 }, null, 8, ["arrow-offset"])) : vue.createCommentVNode("v-if", true)
@@ -13997,10 +13991,10 @@
 
   const _hoisted_1$11 = ["aria-expanded", "aria-owns"];
   const _hoisted_2$E = { key: 0 };
-  const _hoisted_3$k = ["id", "aria-selected", "onClick"];
-  const COMPONENT_NAME$i = "ElAutocomplete";
+  const _hoisted_3$j = ["id", "aria-selected", "onClick"];
+  const COMPONENT_NAME$j = "ElAutocomplete";
   const __default__$1k = vue.defineComponent({
-    name: COMPONENT_NAME$i,
+    name: COMPONENT_NAME$j,
     inheritAttrs: false
   });
   const _sfc_main$20 = /* @__PURE__ */ vue.defineComponent({
@@ -14062,7 +14056,7 @@
             suggestions.value = suggestionList;
             highlightedIndex.value = props.highlightFirstItem ? 0 : -1;
           } else {
-            throwError(COMPONENT_NAME$i, "autocomplete suggestions must be an array");
+            throwError(COMPONENT_NAME$j, "autocomplete suggestions must be an array");
           }
         };
         loading.value = true;
@@ -14260,7 +14254,7 @@
                       vue.renderSlot(_ctx.$slots, "default", { item }, () => [
                         vue.createTextVNode(vue.toDisplayString(item[_ctx.valueKey]), 1)
                       ])
-                    ], 10, _hoisted_3$k);
+                    ], 10, _hoisted_3$j);
                   }), 128))
                 ]),
                 _: 3
@@ -14498,9 +14492,9 @@
     };
   };
 
-  const COMPONENT_NAME$h = "ElBacktop";
+  const COMPONENT_NAME$i = "ElBacktop";
   const __default__$1i = vue.defineComponent({
-    name: COMPONENT_NAME$h
+    name: COMPONENT_NAME$i
   });
   const _sfc_main$1_ = /* @__PURE__ */ vue.defineComponent({
     ...__default__$1i,
@@ -14509,7 +14503,7 @@
     setup(__props, { emit }) {
       const props = __props;
       const ns = useNamespace("backtop");
-      const { handleClick, visible } = useBackTop(props, emit, COMPONENT_NAME$h);
+      const { handleClick, visible } = useBackTop(props, emit, COMPONENT_NAME$i);
       const backTopStyle = vue.computed(() => ({
         right: `${props.right}px`,
         bottom: `${props.bottom}px`
@@ -18390,9 +18384,32 @@
   });
   var DateTable$1 = /* @__PURE__ */ _export_sfc(_sfc_main$1Q, [["__file", "date-table.vue"]]);
 
+  const adjacentMonth = (start, end) => {
+    const firstMonthLastDay = start.endOf("month");
+    const lastMonthFirstDay = end.startOf("month");
+    const isSameWeek = firstMonthLastDay.isSame(lastMonthFirstDay, "week");
+    const lastMonthStartDay = isSameWeek ? lastMonthFirstDay.add(1, "week") : lastMonthFirstDay;
+    return [
+      [start, firstMonthLastDay],
+      [lastMonthStartDay.startOf("week"), end]
+    ];
+  };
+  const threeConsecutiveMonth = (start, end) => {
+    const firstMonthLastDay = start.endOf("month");
+    const secondMonthFirstDay = start.add(1, "month").startOf("month");
+    const secondMonthStartDay = firstMonthLastDay.isSame(secondMonthFirstDay, "week") ? secondMonthFirstDay.add(1, "week") : secondMonthFirstDay;
+    const secondMonthLastDay = secondMonthStartDay.endOf("month");
+    const lastMonthFirstDay = end.startOf("month");
+    const lastMonthStartDay = secondMonthLastDay.isSame(lastMonthFirstDay, "week") ? lastMonthFirstDay.add(1, "week") : lastMonthFirstDay;
+    return [
+      [start, firstMonthLastDay],
+      [secondMonthStartDay.startOf("week"), secondMonthLastDay],
+      [lastMonthStartDay.startOf("week"), end]
+    ];
+  };
   const useCalendar = (props, emit, componentName) => {
-    const solts = vue.useSlots();
-    const { t, lang } = useLocale();
+    const slots = vue.useSlots();
+    const { lang } = useLocale();
     const selectedDay = vue.ref();
     const now = dayjs().locale(lang.value);
     const realSelectedDay = vue.computed({
@@ -18429,12 +18446,7 @@
     });
     const date = vue.computed(() => {
       if (!props.modelValue) {
-        if (realSelectedDay.value) {
-          return realSelectedDay.value;
-        } else if (validatedRange.value.length) {
-          return validatedRange.value[0][0];
-        }
-        return now;
+        return realSelectedDay.value || (validatedRange.value.length ? validatedRange.value[0][0] : now);
       } else {
         return dayjs(props.modelValue).locale(lang.value);
       }
@@ -18443,10 +18455,6 @@
     const nextMonthDayjs = vue.computed(() => date.value.add(1, "month").date(1));
     const prevYearDayjs = vue.computed(() => date.value.subtract(1, "year").date(1));
     const nextYearDayjs = vue.computed(() => date.value.add(1, "year").date(1));
-    const i18nDate = vue.computed(() => {
-      const pickedMonth = `el.datepicker.month${date.value.format("M")}`;
-      return `${date.value.year()} ${t("el.datepicker.year")} ${t(pickedMonth)}`;
-    });
     const calculateValidatedDateRange = (startDayjs, endDayjs) => {
       const firstDay = startDayjs.startOf("week");
       const lastDay = endDayjs.endOf("week");
@@ -18455,26 +18463,9 @@
       if (firstMonth === lastMonth) {
         return [[firstDay, lastDay]];
       } else if (firstMonth + 1 === lastMonth) {
-        const firstMonthLastDay = firstDay.endOf("month");
-        const lastMonthFirstDay = lastDay.startOf("month");
-        const isSameWeek = firstMonthLastDay.isSame(lastMonthFirstDay, "week");
-        const lastMonthStartDay = isSameWeek ? lastMonthFirstDay.add(1, "week") : lastMonthFirstDay;
-        return [
-          [firstDay, firstMonthLastDay],
-          [lastMonthStartDay.startOf("week"), lastDay]
-        ];
+        return adjacentMonth(firstDay, lastDay);
       } else if (firstMonth + 2 === lastMonth || (firstMonth + 1) % 11 === lastMonth) {
-        const firstMonthLastDay = firstDay.endOf("month");
-        const secondMonthFirstDay = firstDay.add(1, "month").startOf("month");
-        const secondMonthStartDay = firstMonthLastDay.isSame(secondMonthFirstDay, "week") ? secondMonthFirstDay.add(1, "week") : secondMonthFirstDay;
-        const secondMonthLastDay = secondMonthStartDay.endOf("month");
-        const lastMonthFirstDay = lastDay.startOf("month");
-        const lastMonthStartDay = secondMonthLastDay.isSame(lastMonthFirstDay, "week") ? lastMonthFirstDay.add(1, "week") : lastMonthFirstDay;
-        return [
-          [firstDay, firstMonthLastDay],
-          [secondMonthStartDay.startOf("week"), secondMonthLastDay],
-          [lastMonthStartDay.startOf("week"), lastDay]
-        ];
+        return threeConsecutiveMonth(firstDay, lastDay);
       } else {
         return [];
       }
@@ -18502,16 +18493,14 @@
       version: "2.3.0",
       ref: "https://element-plus.org/en-US/component/calendar.html#slots",
       type: "Slot"
-    }, vue.computed(() => !!solts.dateCell));
+    }, vue.computed(() => !!slots.dateCell));
     return {
       calculateValidatedDateRange,
       date,
       realSelectedDay,
       pickDay,
       selectDate,
-      validatedRange,
-      t,
-      i18nDate
+      validatedRange
     };
   };
 
@@ -18530,9 +18519,9 @@
     [INPUT_EVENT]: (value) => isDate(value)
   };
 
-  const COMPONENT_NAME$g = "ElCalendar";
+  const COMPONENT_NAME$h = "ElCalendar";
   const __default__$1a = vue.defineComponent({
-    name: COMPONENT_NAME$g
+    name: COMPONENT_NAME$h
   });
   const _sfc_main$1P = /* @__PURE__ */ vue.defineComponent({
     ...__default__$1a,
@@ -18547,10 +18536,13 @@
         pickDay,
         realSelectedDay,
         selectDate,
-        t,
-        i18nDate,
         validatedRange
       } = useCalendar(props, emit);
+      const { t } = useLocale();
+      const i18nDate = vue.computed(() => {
+        const pickedMonth = `el.datepicker.month${date.value.format("M")}`;
+        return `${date.value.year()} ${t("el.datepicker.year")} ${t(pickedMonth)}`;
+      });
       expose({
         selectedDay: realSelectedDay,
         pickDay,
@@ -18762,12 +18754,208 @@
     change: (current, prev) => [current, prev].every(isNumber)
   };
 
-  const _hoisted_1$V = ["onMouseenter", "onMouseleave"];
-  const _hoisted_2$A = ["onMouseenter", "onClick"];
-  const _hoisted_3$j = { key: 0 };
   const THROTTLE_TIME = 300;
+  const useCarousel = (props, emit, componentName) => {
+    const {
+      children: items,
+      addChild: addItem,
+      removeChild: removeItem
+    } = useOrderedChildren(vue.getCurrentInstance(), "ElCarouselItem");
+    const activeIndex = vue.ref(-1);
+    const timer = vue.ref(null);
+    const hover = vue.ref(false);
+    const root = vue.ref();
+    const arrowDisplay = vue.computed(() => props.arrow !== "never" && !vue.unref(isVertical));
+    const hasLabel = vue.computed(() => {
+      return items.value.some((item) => item.props.label.toString().length > 0);
+    });
+    const isCardType = vue.computed(() => props.type === "card");
+    const isVertical = vue.computed(() => props.direction === "vertical");
+    const throttledArrowClick = throttle((index) => {
+      setActiveItem(index);
+    }, THROTTLE_TIME, { trailing: true });
+    const throttledIndicatorHover = throttle((index) => {
+      handleIndicatorHover(index);
+    }, THROTTLE_TIME);
+    function pauseTimer() {
+      if (timer.value) {
+        clearInterval(timer.value);
+        timer.value = null;
+      }
+    }
+    function startTimer() {
+      if (props.interval <= 0 || !props.autoplay || timer.value)
+        return;
+      timer.value = setInterval(() => playSlides(), props.interval);
+    }
+    const playSlides = () => {
+      if (activeIndex.value < items.value.length - 1) {
+        activeIndex.value = activeIndex.value + 1;
+      } else if (props.loop) {
+        activeIndex.value = 0;
+      }
+    };
+    function setActiveItem(index) {
+      if (isString(index)) {
+        const filteredItems = items.value.filter((item) => item.props.name === index);
+        if (filteredItems.length > 0) {
+          index = items.value.indexOf(filteredItems[0]);
+        }
+      }
+      index = Number(index);
+      if (Number.isNaN(index) || index !== Math.floor(index)) {
+        return;
+      }
+      const itemCount = items.value.length;
+      const oldIndex = activeIndex.value;
+      if (index < 0) {
+        activeIndex.value = props.loop ? itemCount - 1 : 0;
+      } else if (index >= itemCount) {
+        activeIndex.value = props.loop ? 0 : itemCount - 1;
+      } else {
+        activeIndex.value = index;
+      }
+      if (oldIndex === activeIndex.value) {
+        resetItemPosition(oldIndex);
+      }
+      resetTimer();
+    }
+    function resetItemPosition(oldIndex) {
+      items.value.forEach((item, index) => {
+        item.translateItem(index, activeIndex.value, oldIndex);
+      });
+    }
+    function itemInStage(item, index) {
+      var _a, _b, _c, _d;
+      const _items = vue.unref(items);
+      const itemCount = _items.length;
+      if (itemCount === 0 || !item.states.inStage)
+        return false;
+      const nextItemIndex = index + 1;
+      const prevItemIndex = index - 1;
+      const lastItemIndex = itemCount - 1;
+      const isLastItemActive = _items[lastItemIndex].states.active;
+      const isFirstItemActive = _items[0].states.active;
+      const isNextItemActive = (_b = (_a = _items[nextItemIndex]) == null ? void 0 : _a.states) == null ? void 0 : _b.active;
+      const isPrevItemActive = (_d = (_c = _items[prevItemIndex]) == null ? void 0 : _c.states) == null ? void 0 : _d.active;
+      if (index === lastItemIndex && isFirstItemActive || isNextItemActive) {
+        return "left";
+      } else if (index === 0 && isLastItemActive || isPrevItemActive) {
+        return "right";
+      }
+      return false;
+    }
+    function handleMouseEnter() {
+      hover.value = true;
+      if (props.pauseOnHover) {
+        pauseTimer();
+      }
+    }
+    function handleMouseLeave() {
+      hover.value = false;
+      startTimer();
+    }
+    function handleButtonEnter(arrow) {
+      if (vue.unref(isVertical))
+        return;
+      items.value.forEach((item, index) => {
+        if (arrow === itemInStage(item, index)) {
+          item.states.hover = true;
+        }
+      });
+    }
+    function handleButtonLeave() {
+      if (vue.unref(isVertical))
+        return;
+      items.value.forEach((item) => {
+        item.states.hover = false;
+      });
+    }
+    function handleIndicatorClick(index) {
+      activeIndex.value = index;
+    }
+    function handleIndicatorHover(index) {
+      if (props.trigger === "hover" && index !== activeIndex.value) {
+        activeIndex.value = index;
+      }
+    }
+    function prev() {
+      setActiveItem(activeIndex.value - 1);
+    }
+    function next() {
+      setActiveItem(activeIndex.value + 1);
+    }
+    function resetTimer() {
+      pauseTimer();
+      startTimer();
+    }
+    vue.watch(() => activeIndex.value, (current, prev2) => {
+      resetItemPosition(prev2);
+      if (prev2 > -1) {
+        emit("change", current, prev2);
+      }
+    });
+    vue.watch(() => props.autoplay, (autoplay) => {
+      autoplay ? startTimer() : pauseTimer();
+    });
+    vue.watch(() => props.loop, () => {
+      setActiveItem(activeIndex.value);
+    });
+    vue.watch(() => props.interval, () => {
+      resetTimer();
+    });
+    vue.watch(() => items.value, () => {
+      if (items.value.length > 0)
+        setActiveItem(props.initialIndex);
+    });
+    const resizeObserver = vue.shallowRef();
+    vue.onMounted(() => {
+      resizeObserver.value = useResizeObserver(root.value, () => {
+        resetItemPosition();
+      });
+      startTimer();
+    });
+    vue.onBeforeUnmount(() => {
+      pauseTimer();
+      if (root.value && resizeObserver.value)
+        resizeObserver.value.stop();
+    });
+    vue.provide(carouselContextKey, {
+      root,
+      isCardType,
+      isVertical,
+      items,
+      loop: props.loop,
+      addItem,
+      removeItem,
+      setActiveItem
+    });
+    return {
+      root,
+      activeIndex,
+      arrowDisplay,
+      hasLabel,
+      hover,
+      isCardType,
+      items,
+      handleButtonEnter,
+      handleButtonLeave,
+      handleIndicatorClick,
+      handleMouseEnter,
+      handleMouseLeave,
+      setActiveItem,
+      prev,
+      next,
+      throttledArrowClick,
+      throttledIndicatorHover
+    };
+  };
+
+  const _hoisted_1$V = ["onMouseenter", "onClick"];
+  const _hoisted_2$A = { key: 0 };
+  const COMPONENT_NAME$g = "ElCarousel";
   const __default__$18 = vue.defineComponent({
-    name: "ElCarousel"
+    name: COMPONENT_NAME$g
   });
   const _sfc_main$1N = /* @__PURE__ */ vue.defineComponent({
     ...__default__$18,
@@ -18775,20 +18963,26 @@
     emits: carouselEmits,
     setup(__props, { expose, emit }) {
       const props = __props;
-      const ns = useNamespace("carousel");
       const {
-        children: items,
-        addChild: addItem,
-        removeChild: removeItem
-      } = useOrderedChildren(vue.getCurrentInstance(), "ElCarouselItem");
-      const activeIndex = vue.ref(-1);
-      const timer = vue.ref(null);
-      const hover = vue.ref(false);
-      const root = vue.ref();
-      const arrowDisplay = vue.computed(() => props.arrow !== "never" && !vue.unref(isVertical));
-      const hasLabel = vue.computed(() => {
-        return items.value.some((item) => item.props.label.toString().length > 0);
-      });
+        root,
+        activeIndex,
+        arrowDisplay,
+        hasLabel,
+        hover,
+        isCardType,
+        items,
+        handleButtonEnter,
+        handleButtonLeave,
+        handleIndicatorClick,
+        handleMouseEnter,
+        handleMouseLeave,
+        setActiveItem,
+        prev,
+        next,
+        throttledArrowClick,
+        throttledIndicatorHover
+      } = useCarousel(props, emit);
+      const ns = useNamespace("carousel");
       const carouselClasses = vue.computed(() => {
         const classes = [ns.b(), ns.m(props.direction)];
         if (vue.unref(isCardType)) {
@@ -18798,7 +18992,7 @@
       });
       const indicatorsClasses = vue.computed(() => {
         const classes = [ns.e("indicators"), ns.em("indicators", props.direction)];
-        if (hasLabel.value) {
+        if (vue.unref(hasLabel)) {
           classes.push(ns.em("indicators", "labels"));
         }
         if (props.indicatorPosition === "outside" || vue.unref(isCardType)) {
@@ -18806,167 +19000,6 @@
         }
         return classes;
       });
-      const isCardType = vue.computed(() => props.type === "card");
-      const isVertical = vue.computed(() => props.direction === "vertical");
-      const throttledArrowClick = throttle((index) => {
-        setActiveItem(index);
-      }, THROTTLE_TIME, { trailing: true });
-      const throttledIndicatorHover = throttle((index) => {
-        handleIndicatorHover(index);
-      }, THROTTLE_TIME);
-      function pauseTimer() {
-        if (timer.value) {
-          clearInterval(timer.value);
-          timer.value = null;
-        }
-      }
-      function startTimer() {
-        if (props.interval <= 0 || !props.autoplay || timer.value)
-          return;
-        timer.value = setInterval(() => playSlides(), props.interval);
-      }
-      const playSlides = () => {
-        if (activeIndex.value < items.value.length - 1) {
-          activeIndex.value = activeIndex.value + 1;
-        } else if (props.loop) {
-          activeIndex.value = 0;
-        }
-      };
-      function setActiveItem(index) {
-        if (isString(index)) {
-          const filteredItems = items.value.filter((item) => item.props.name === index);
-          if (filteredItems.length > 0) {
-            index = items.value.indexOf(filteredItems[0]);
-          }
-        }
-        index = Number(index);
-        if (Number.isNaN(index) || index !== Math.floor(index)) {
-          return;
-        }
-        const itemCount = items.value.length;
-        const oldIndex = activeIndex.value;
-        if (index < 0) {
-          activeIndex.value = props.loop ? itemCount - 1 : 0;
-        } else if (index >= itemCount) {
-          activeIndex.value = props.loop ? 0 : itemCount - 1;
-        } else {
-          activeIndex.value = index;
-        }
-        if (oldIndex === activeIndex.value) {
-          resetItemPosition(oldIndex);
-        }
-        resetTimer();
-      }
-      function resetItemPosition(oldIndex) {
-        items.value.forEach((item, index) => {
-          item.translateItem(index, activeIndex.value, oldIndex);
-        });
-      }
-      function itemInStage(item, index) {
-        var _a, _b, _c, _d;
-        const _items = vue.unref(items);
-        const itemCount = _items.length;
-        if (itemCount === 0 || !item.states.inStage)
-          return false;
-        const nextItemIndex = index + 1;
-        const prevItemIndex = index - 1;
-        const lastItemIndex = itemCount - 1;
-        const isLastItemActive = _items[lastItemIndex].states.active;
-        const isFirstItemActive = _items[0].states.active;
-        const isNextItemActive = (_b = (_a = _items[nextItemIndex]) == null ? void 0 : _a.states) == null ? void 0 : _b.active;
-        const isPrevItemActive = (_d = (_c = _items[prevItemIndex]) == null ? void 0 : _c.states) == null ? void 0 : _d.active;
-        if (index === lastItemIndex && isFirstItemActive || isNextItemActive) {
-          return "left";
-        } else if (index === 0 && isLastItemActive || isPrevItemActive) {
-          return "right";
-        }
-        return false;
-      }
-      function handleMouseEnter() {
-        hover.value = true;
-        if (props.pauseOnHover) {
-          pauseTimer();
-        }
-      }
-      function handleMouseLeave() {
-        hover.value = false;
-        startTimer();
-      }
-      function handleButtonEnter(arrow) {
-        if (vue.unref(isVertical))
-          return;
-        items.value.forEach((item, index) => {
-          if (arrow === itemInStage(item, index)) {
-            item.states.hover = true;
-          }
-        });
-      }
-      function handleButtonLeave() {
-        if (vue.unref(isVertical))
-          return;
-        items.value.forEach((item) => {
-          item.states.hover = false;
-        });
-      }
-      function handleIndicatorClick(index) {
-        activeIndex.value = index;
-      }
-      function handleIndicatorHover(index) {
-        if (props.trigger === "hover" && index !== activeIndex.value) {
-          activeIndex.value = index;
-        }
-      }
-      function prev() {
-        setActiveItem(activeIndex.value - 1);
-      }
-      function next() {
-        setActiveItem(activeIndex.value + 1);
-      }
-      function resetTimer() {
-        pauseTimer();
-        startTimer();
-      }
-      vue.watch(() => activeIndex.value, (current, prev2) => {
-        resetItemPosition(prev2);
-        if (prev2 > -1) {
-          emit("change", current, prev2);
-        }
-      });
-      vue.watch(() => props.autoplay, (autoplay) => {
-        autoplay ? startTimer() : pauseTimer();
-      });
-      vue.watch(() => props.loop, () => {
-        setActiveItem(activeIndex.value);
-      });
-      vue.watch(() => props.interval, () => {
-        resetTimer();
-      });
-      vue.watch(() => items.value, () => {
-        if (items.value.length > 0)
-          setActiveItem(props.initialIndex);
-      });
-      const resizeObserver = vue.shallowRef();
-      vue.onMounted(() => {
-        resizeObserver.value = useResizeObserver(root.value, () => {
-          resetItemPosition();
-        });
-        startTimer();
-      });
-      vue.onBeforeUnmount(() => {
-        pauseTimer();
-        if (root.value && resizeObserver.value)
-          resizeObserver.value.stop();
-      });
-      vue.provide(carouselContextKey, {
-        root,
-        isCardType,
-        isVertical,
-        items,
-        loop: props.loop,
-        addItem,
-        removeItem,
-        setActiveItem
-      });
       expose({
         setActiveItem,
         prev,
@@ -18977,8 +19010,8 @@
           ref_key: "root",
           ref: root,
           class: vue.normalizeClass(vue.unref(carouselClasses)),
-          onMouseenter: vue.withModifiers(handleMouseEnter, ["stop"]),
-          onMouseleave: vue.withModifiers(handleMouseLeave, ["stop"])
+          onMouseenter: _cache[6] || (_cache[6] = vue.withModifiers((...args) => vue.unref(handleMouseEnter) && vue.unref(handleMouseEnter)(...args), ["stop"])),
+          onMouseleave: _cache[7] || (_cache[7] = vue.withModifiers((...args) => vue.unref(handleMouseLeave) && vue.unref(handleMouseLeave)(...args), ["stop"]))
         }, [
           vue.createElementVNode("div", {
             class: vue.normalizeClass(vue.unref(ns).e("container")),
@@ -18993,9 +19026,9 @@
                 vue.withDirectives(vue.createElementVNode("button", {
                   type: "button",
                   class: vue.normalizeClass([vue.unref(ns).e("arrow"), vue.unref(ns).em("arrow", "left")]),
-                  onMouseenter: _cache[0] || (_cache[0] = ($event) => handleButtonEnter("left")),
-                  onMouseleave: handleButtonLeave,
-                  onClick: _cache[1] || (_cache[1] = vue.withModifiers(($event) => vue.unref(throttledArrowClick)(activeIndex.value - 1), ["stop"]))
+                  onMouseenter: _cache[0] || (_cache[0] = ($event) => vue.unref(handleButtonEnter)("left")),
+                  onMouseleave: _cache[1] || (_cache[1] = (...args) => vue.unref(handleButtonLeave) && vue.unref(handleButtonLeave)(...args)),
+                  onClick: _cache[2] || (_cache[2] = vue.withModifiers(($event) => vue.unref(throttledArrowClick)(vue.unref(activeIndex) - 1), ["stop"]))
                 }, [
                   vue.createVNode(vue.unref(ElIcon), null, {
                     default: vue.withCtx(() => [
@@ -19006,7 +19039,7 @@
                 ], 34), [
                   [
                     vue.vShow,
-                    (_ctx.arrow === "always" || hover.value) && (props.loop || activeIndex.value > 0)
+                    (_ctx.arrow === "always" || vue.unref(hover)) && (props.loop || vue.unref(activeIndex) > 0)
                   ]
                 ])
               ]),
@@ -19021,9 +19054,9 @@
                 vue.withDirectives(vue.createElementVNode("button", {
                   type: "button",
                   class: vue.normalizeClass([vue.unref(ns).e("arrow"), vue.unref(ns).em("arrow", "right")]),
-                  onMouseenter: _cache[2] || (_cache[2] = ($event) => handleButtonEnter("right")),
-                  onMouseleave: handleButtonLeave,
-                  onClick: _cache[3] || (_cache[3] = vue.withModifiers(($event) => vue.unref(throttledArrowClick)(activeIndex.value + 1), ["stop"]))
+                  onMouseenter: _cache[3] || (_cache[3] = ($event) => vue.unref(handleButtonEnter)("right")),
+                  onMouseleave: _cache[4] || (_cache[4] = (...args) => vue.unref(handleButtonLeave) && vue.unref(handleButtonLeave)(...args)),
+                  onClick: _cache[5] || (_cache[5] = vue.withModifiers(($event) => vue.unref(throttledArrowClick)(vue.unref(activeIndex) + 1), ["stop"]))
                 }, [
                   vue.createVNode(vue.unref(ElIcon), null, {
                     default: vue.withCtx(() => [
@@ -19034,7 +19067,7 @@
                 ], 34), [
                   [
                     vue.vShow,
-                    (_ctx.arrow === "always" || hover.value) && (props.loop || activeIndex.value < vue.unref(items).length - 1)
+                    (_ctx.arrow === "always" || vue.unref(hover)) && (props.loop || vue.unref(activeIndex) < vue.unref(items).length - 1)
                   ]
                 ])
               ]),
@@ -19052,20 +19085,20 @@
                 class: vue.normalizeClass([
                   vue.unref(ns).e("indicator"),
                   vue.unref(ns).em("indicator", _ctx.direction),
-                  vue.unref(ns).is("active", index === activeIndex.value)
+                  vue.unref(ns).is("active", index === vue.unref(activeIndex))
                 ]),
                 onMouseenter: ($event) => vue.unref(throttledIndicatorHover)(index),
-                onClick: vue.withModifiers(($event) => handleIndicatorClick(index), ["stop"])
+                onClick: vue.withModifiers(($event) => vue.unref(handleIndicatorClick)(index), ["stop"])
               }, [
                 vue.createElementVNode("button", {
                   class: vue.normalizeClass(vue.unref(ns).e("button"))
                 }, [
-                  vue.unref(hasLabel) ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_3$j, vue.toDisplayString(item.props.label), 1)) : vue.createCommentVNode("v-if", true)
+                  vue.unref(hasLabel) ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_2$A, vue.toDisplayString(item.props.label), 1)) : vue.createCommentVNode("v-if", true)
                 ], 2)
-              ], 42, _hoisted_2$A);
+              ], 42, _hoisted_1$V);
             }), 128))
           ], 2)) : vue.createCommentVNode("v-if", true)
-        ], 42, _hoisted_1$V);
+        ], 34);
       };
     }
   });
@@ -19079,7 +19112,113 @@
     }
   });
 
-  const CARD_SCALE = 0.83;
+  const useCarouselItem = (props, componentName) => {
+    const carouselContext = vue.inject(carouselContextKey);
+    const instance = vue.getCurrentInstance();
+    const CARD_SCALE = 0.83;
+    const hover = vue.ref(false);
+    const translate = vue.ref(0);
+    const scale = vue.ref(1);
+    const active = vue.ref(false);
+    const ready = vue.ref(false);
+    const inStage = vue.ref(false);
+    const animating = vue.ref(false);
+    const { isCardType, isVertical } = carouselContext;
+    function processIndex(index, activeIndex, length) {
+      const lastItemIndex = length - 1;
+      const prevItemIndex = activeIndex - 1;
+      const nextItemIndex = activeIndex + 1;
+      const halfItemIndex = length / 2;
+      if (activeIndex === 0 && index === lastItemIndex) {
+        return -1;
+      } else if (activeIndex === lastItemIndex && index === 0) {
+        return length;
+      } else if (index < prevItemIndex && activeIndex - index >= halfItemIndex) {
+        return length + 1;
+      } else if (index > nextItemIndex && index - activeIndex >= halfItemIndex) {
+        return -2;
+      }
+      return index;
+    }
+    function calcCardTranslate(index, activeIndex) {
+      var _a;
+      const parentWidth = ((_a = carouselContext.root.value) == null ? void 0 : _a.offsetWidth) || 0;
+      if (inStage.value) {
+        return parentWidth * ((2 - CARD_SCALE) * (index - activeIndex) + 1) / 4;
+      } else if (index < activeIndex) {
+        return -(1 + CARD_SCALE) * parentWidth / 4;
+      } else {
+        return (3 + CARD_SCALE) * parentWidth / 4;
+      }
+    }
+    function calcTranslate(index, activeIndex, isVertical2) {
+      const rootEl = carouselContext.root.value;
+      if (!rootEl)
+        return 0;
+      const distance = (isVertical2 ? rootEl.offsetHeight : rootEl.offsetWidth) || 0;
+      return distance * (index - activeIndex);
+    }
+    const translateItem = (index, activeIndex, oldIndex) => {
+      var _a;
+      const _isCardType = vue.unref(isCardType);
+      const carouselItemLength = (_a = carouselContext.items.value.length) != null ? _a : Number.NaN;
+      const isActive = index === activeIndex;
+      if (!_isCardType && !isUndefined(oldIndex)) {
+        animating.value = isActive || index === oldIndex;
+      }
+      if (!isActive && carouselItemLength > 2 && carouselContext.loop) {
+        index = processIndex(index, activeIndex, carouselItemLength);
+      }
+      const _isVertical = vue.unref(isVertical);
+      active.value = isActive;
+      if (_isCardType) {
+        inStage.value = Math.round(Math.abs(index - activeIndex)) <= 1;
+        translate.value = calcCardTranslate(index, activeIndex);
+        scale.value = vue.unref(active) ? 1 : CARD_SCALE;
+      } else {
+        translate.value = calcTranslate(index, activeIndex, _isVertical);
+      }
+      ready.value = true;
+    };
+    function handleItemClick() {
+      if (carouselContext && vue.unref(isCardType)) {
+        const index = carouselContext.items.value.findIndex(({ uid }) => uid === instance.uid);
+        carouselContext.setActiveItem(index);
+      }
+    }
+    vue.onMounted(() => {
+      carouselContext.addItem({
+        props,
+        states: vue.reactive({
+          hover,
+          translate,
+          scale,
+          active,
+          ready,
+          inStage,
+          animating
+        }),
+        uid: instance.uid,
+        translateItem
+      });
+    });
+    vue.onUnmounted(() => {
+      carouselContext.removeItem(instance.uid);
+    });
+    return {
+      active,
+      animating,
+      hover,
+      inStage,
+      isVertical,
+      translate,
+      isCardType,
+      scale,
+      ready,
+      handleItemClick
+    };
+  };
+
   const __default__$17 = vue.defineComponent({
     name: "ElCarouselItem"
   });
@@ -19089,16 +19228,18 @@
     setup(__props) {
       const props = __props;
       const ns = useNamespace("carousel");
-      const carouselContext = vue.inject(carouselContextKey);
-      const instance = vue.getCurrentInstance();
-      const hover = vue.ref(false);
-      const translate = vue.ref(0);
-      const scale = vue.ref(1);
-      const active = vue.ref(false);
-      const ready = vue.ref(false);
-      const inStage = vue.ref(false);
-      const animating = vue.ref(false);
-      const { isCardType, isVertical } = carouselContext;
+      const {
+        active,
+        animating,
+        hover,
+        inStage,
+        isVertical,
+        translate,
+        isCardType,
+        scale,
+        ready,
+        handleItemClick
+      } = useCarouselItem(props);
       const itemStyle = vue.computed(() => {
         const translateType = `translate${vue.unref(isVertical) ? "Y" : "X"}`;
         const _translate = `${translateType}(${vue.unref(translate)}px)`;
@@ -19108,109 +19249,28 @@
           transform
         };
       });
-      function processIndex(index, activeIndex, length) {
-        const lastItemIndex = length - 1;
-        const prevItemIndex = activeIndex - 1;
-        const nextItemIndex = activeIndex + 1;
-        const halfItemIndex = length / 2;
-        if (activeIndex === 0 && index === lastItemIndex) {
-          return -1;
-        } else if (activeIndex === lastItemIndex && index === 0) {
-          return length;
-        } else if (index < prevItemIndex && activeIndex - index >= halfItemIndex) {
-          return length + 1;
-        } else if (index > nextItemIndex && index - activeIndex >= halfItemIndex) {
-          return -2;
-        }
-        return index;
-      }
-      function calcCardTranslate(index, activeIndex) {
-        var _a;
-        const parentWidth = ((_a = carouselContext.root.value) == null ? void 0 : _a.offsetWidth) || 0;
-        if (inStage.value) {
-          return parentWidth * ((2 - CARD_SCALE) * (index - activeIndex) + 1) / 4;
-        } else if (index < activeIndex) {
-          return -(1 + CARD_SCALE) * parentWidth / 4;
-        } else {
-          return (3 + CARD_SCALE) * parentWidth / 4;
-        }
-      }
-      function calcTranslate(index, activeIndex, isVertical2) {
-        const rootEl = carouselContext.root.value;
-        if (!rootEl)
-          return 0;
-        const distance = (isVertical2 ? rootEl.offsetHeight : rootEl.offsetWidth) || 0;
-        return distance * (index - activeIndex);
-      }
-      const translateItem = (index, activeIndex, oldIndex) => {
-        var _a;
-        const _isCardType = vue.unref(isCardType);
-        const carouselItemLength = (_a = carouselContext.items.value.length) != null ? _a : Number.NaN;
-        const isActive = index === activeIndex;
-        if (!_isCardType && !isUndefined(oldIndex)) {
-          animating.value = isActive || index === oldIndex;
-        }
-        if (!isActive && carouselItemLength > 2 && carouselContext.loop) {
-          index = processIndex(index, activeIndex, carouselItemLength);
-        }
-        const _isVertical = vue.unref(isVertical);
-        active.value = isActive;
-        if (_isCardType) {
-          inStage.value = Math.round(Math.abs(index - activeIndex)) <= 1;
-          translate.value = calcCardTranslate(index, activeIndex);
-          scale.value = vue.unref(active) ? 1 : CARD_SCALE;
-        } else {
-          translate.value = calcTranslate(index, activeIndex, _isVertical);
-        }
-        ready.value = true;
-      };
-      function handleItemClick() {
-        if (carouselContext && vue.unref(isCardType)) {
-          const index = carouselContext.items.value.findIndex(({ uid }) => uid === instance.uid);
-          carouselContext.setActiveItem(index);
-        }
-      }
-      vue.onMounted(() => {
-        carouselContext.addItem({
-          props,
-          states: vue.reactive({
-            hover,
-            translate,
-            scale,
-            active,
-            ready,
-            inStage,
-            animating
-          }),
-          uid: instance.uid,
-          translateItem
-        });
-      });
-      vue.onUnmounted(() => {
-        carouselContext.removeItem(instance.uid);
-      });
       return (_ctx, _cache) => {
         return vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
           class: vue.normalizeClass([
             vue.unref(ns).e("item"),
-            vue.unref(ns).is("active", active.value),
-            vue.unref(ns).is("in-stage", inStage.value),
-            vue.unref(ns).is("hover", hover.value),
-            vue.unref(ns).is("animating", animating.value),
+            vue.unref(ns).is("active", vue.unref(active)),
+            vue.unref(ns).is("in-stage", vue.unref(inStage)),
+            vue.unref(ns).is("hover", vue.unref(hover)),
+            vue.unref(ns).is("animating", vue.unref(animating)),
             { [vue.unref(ns).em("item", "card")]: vue.unref(isCardType) }
           ]),
           style: vue.normalizeStyle(vue.unref(itemStyle)),
-          onClick: handleItemClick
+          onClick: _cache[0] || (_cache[0] = (...args) => vue.unref(handleItemClick) && vue.unref(handleItemClick)(...args))
         }, [
           vue.unref(isCardType) ? vue.withDirectives((vue.openBlock(), vue.createElementBlock("div", {
             key: 0,
             class: vue.normalizeClass(vue.unref(ns).e("mask"))
           }, null, 2)), [
-            [vue.vShow, !active.value]
+            [vue.vShow, !vue.unref(active)]
           ]) : vue.createCommentVNode("v-if", true),
           vue.renderSlot(_ctx.$slots, "default")
         ], 6)), [
-          [vue.vShow, ready.value]
+          [vue.vShow, vue.unref(ready)]
         ]);
       };
     }
@@ -21000,12 +21060,6 @@
 
   const ElTag = withInstall(Tag);
 
-  const DEFAULT_INPUT_HEIGHT = 40;
-  const INPUT_HEIGHT_MAP = {
-    large: 36,
-    default: 32,
-    small: 28
-  };
   const popperOptions = {
     modifiers: [
       {
@@ -21119,6 +21173,7 @@
       const isOnComposition = vue.ref(false);
       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 ? "" : inputPlaceholder.value);
       const realSize = useSize();
       const tagSize = vue.computed(() => ["small"].includes(realSize.value) ? "small" : "default");
       const multiple = vue.computed(() => !!props.props.multiple);
@@ -21136,7 +21191,7 @@
       const presentText = vue.computed(() => {
         const { showAllLevels, separator } = props;
         const nodes = checkedNodes.value;
-        return nodes.length ? multiple.value ? " " : nodes[0].calcText(showAllLevels, separator) : "";
+        return nodes.length ? multiple.value ? "" : nodes[0].calcText(showAllLevels, separator) : "";
       });
       const checkedValue = vue.computed({
         get() {
@@ -21397,10 +21452,9 @@
       });
       vue.watch(presentText, syncPresentTextValue, { immediate: true });
       vue.onMounted(() => {
-        var _a;
-        const inputEl = (_a = input.value) == null ? void 0 : _a.$el;
-        inputInitialHeight = (inputEl == null ? void 0 : inputEl.offsetHeight) || INPUT_HEIGHT_MAP[realSize.value] || DEFAULT_INPUT_HEIGHT;
-        useResizeObserver(inputEl, updateStyle);
+        const inputInner = input.value.input;
+        inputInitialHeight = inputInner.offsetHeight;
+        useResizeObserver(inputInner, updateStyle);
       });
       return {
         popperOptions,
@@ -21413,6 +21467,7 @@
         popperVisible,
         inputHover,
         inputPlaceholder,
+        currentPlaceholder,
         filtering,
         presentText,
         checkedValue,
@@ -21502,7 +21557,7 @@
             ref: "input",
             modelValue: _ctx.inputValue,
             "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => _ctx.inputValue = $event),
-            placeholder: _ctx.searchInputValue ? "" : _ctx.inputPlaceholder,
+            placeholder: _ctx.currentPlaceholder,
             readonly: _ctx.readonly,
             disabled: _ctx.isDisabled,
             "validate-event": false,
@@ -21843,6 +21898,46 @@
     [CHANGE_EVENT]: emitChangeFn
   };
 
+  const useCollapse = (props, emit) => {
+    const activeNames = vue.ref(castArray$1(props.modelValue));
+    const setActiveNames = (_activeNames) => {
+      activeNames.value = _activeNames;
+      const value = props.accordion ? activeNames.value[0] : activeNames.value;
+      emit(UPDATE_MODEL_EVENT, value);
+      emit(CHANGE_EVENT, value);
+    };
+    const handleItemClick = (name) => {
+      if (props.accordion) {
+        setActiveNames([activeNames.value[0] === name ? "" : name]);
+      } else {
+        const _activeNames = [...activeNames.value];
+        const index = _activeNames.indexOf(name);
+        if (index > -1) {
+          _activeNames.splice(index, 1);
+        } else {
+          _activeNames.push(name);
+        }
+        setActiveNames(_activeNames);
+      }
+    };
+    vue.watch(() => props.modelValue, () => activeNames.value = castArray$1(props.modelValue), { deep: true });
+    vue.provide(collapseContextKey, {
+      activeNames,
+      handleItemClick
+    });
+    return {
+      activeNames,
+      setActiveNames
+    };
+  };
+  const useCollapseDOM = () => {
+    const ns = useNamespace("collapse");
+    const rootKls = vue.computed(() => ns.b());
+    return {
+      rootKls
+    };
+  };
+
   const __default__$Z = vue.defineComponent({
     name: "ElCollapse"
   });
@@ -21852,42 +21947,15 @@
     emits: collapseEmits,
     setup(__props, { expose, emit }) {
       const props = __props;
-      const ns = useNamespace("collapse");
-      const activeNames = vue.ref(castArray$1(props.modelValue));
-      const setActiveNames = (_activeNames) => {
-        activeNames.value = _activeNames;
-        const value = props.accordion ? activeNames.value[0] : activeNames.value;
-        emit(UPDATE_MODEL_EVENT, value);
-        emit(CHANGE_EVENT, value);
-      };
-      const handleItemClick = (name) => {
-        if (props.accordion) {
-          setActiveNames([
-            (activeNames.value[0] || activeNames.value[0] === 0) && activeNames.value[0] === name ? "" : name
-          ]);
-        } else {
-          const _activeNames = [...activeNames.value];
-          const index = _activeNames.indexOf(name);
-          if (index > -1) {
-            _activeNames.splice(index, 1);
-          } else {
-            _activeNames.push(name);
-          }
-          setActiveNames(_activeNames);
-        }
-      };
-      vue.watch(() => props.modelValue, () => activeNames.value = castArray$1(props.modelValue), { deep: true });
-      vue.provide(collapseContextKey, {
-        activeNames,
-        handleItemClick
-      });
+      const { activeNames, setActiveNames } = useCollapse(props, emit);
+      const { rootKls } = useCollapseDOM();
       expose({
         activeNames,
         setActiveNames
       });
       return (_ctx, _cache) => {
         return vue.openBlock(), vue.createElementBlock("div", {
-          class: vue.normalizeClass(vue.unref(ns).b()),
+          class: vue.normalizeClass(vue.unref(rootKls)),
           role: "tablist",
           "aria-multiselectable": "true"
         }, [
@@ -21987,8 +22055,73 @@
     disabled: Boolean
   });
 
+  const useCollapseItem = (props) => {
+    const collapse = vue.inject(collapseContextKey);
+    const focusing = vue.ref(false);
+    const isClick = vue.ref(false);
+    const id = vue.ref(generateId());
+    const isActive = vue.computed(() => collapse == null ? void 0 : collapse.activeNames.value.includes(props.name));
+    const handleFocus = () => {
+      setTimeout(() => {
+        if (!isClick.value) {
+          focusing.value = true;
+        } else {
+          isClick.value = false;
+        }
+      }, 50);
+    };
+    const handleHeaderClick = () => {
+      if (props.disabled)
+        return;
+      collapse == null ? void 0 : collapse.handleItemClick(props.name);
+      focusing.value = false;
+      isClick.value = true;
+    };
+    const handleEnterClick = () => {
+      collapse == null ? void 0 : collapse.handleItemClick(props.name);
+    };
+    return {
+      focusing,
+      id,
+      isActive,
+      handleFocus,
+      handleHeaderClick,
+      handleEnterClick
+    };
+  };
+  const useCollapseItemDOM = (props, { focusing, isActive, id }) => {
+    const ns = useNamespace("collapse");
+    const rootKls = vue.computed(() => [
+      ns.b("item"),
+      ns.is("active", vue.unref(isActive)),
+      ns.is("disabled", props.disabled)
+    ]);
+    const headKls = vue.computed(() => [
+      ns.be("item", "header"),
+      ns.is("active", vue.unref(isActive)),
+      { focusing: vue.unref(focusing) && !props.disabled }
+    ]);
+    const arrowKls = vue.computed(() => [
+      ns.be("item", "arrow"),
+      ns.is("active", vue.unref(isActive))
+    ]);
+    const itemWrapperKls = vue.computed(() => ns.be("item", "wrap"));
+    const itemContentKls = vue.computed(() => ns.be("item", "content"));
+    const scopedContentId = vue.computed(() => ns.b(`content-${vue.unref(id)}`));
+    const scopedHeadId = vue.computed(() => ns.b(`head-${vue.unref(id)}`));
+    return {
+      arrowKls,
+      headKls,
+      rootKls,
+      itemWrapperKls,
+      itemContentKls,
+      scopedContentId,
+      scopedHeadId
+    };
+  };
+
   const _hoisted_1$N = ["aria-expanded", "aria-controls", "aria-describedby"];
-  const _hoisted_2$v = ["id", "tabindex", "onKeypress"];
+  const _hoisted_2$v = ["id", "tabindex"];
   const _hoisted_3$g = ["id", "aria-hidden", "aria-labelledby"];
   const __default__$X = vue.defineComponent({
     name: "ElCollapseItem"
@@ -21998,67 +22131,51 @@
     props: collapseItemProps,
     setup(__props, { expose }) {
       const props = __props;
-      const collapse = vue.inject(collapseContextKey);
-      const ns = useNamespace("collapse");
-      const focusing = vue.ref(false);
-      const isClick = vue.ref(false);
-      const id = vue.ref(generateId());
-      const isActive = vue.computed(() => collapse == null ? void 0 : collapse.activeNames.value.includes(props.name));
-      const handleFocus = () => {
-        setTimeout(() => {
-          if (!isClick.value) {
-            focusing.value = true;
-          } else {
-            isClick.value = false;
-          }
-        }, 50);
-      };
-      const handleHeaderClick = () => {
-        if (props.disabled)
-          return;
-        collapse == null ? void 0 : collapse.handleItemClick(props.name);
-        focusing.value = false;
-        isClick.value = true;
-      };
-      const handleEnterClick = () => {
-        collapse == null ? void 0 : collapse.handleItemClick(props.name);
-      };
+      const {
+        focusing,
+        id,
+        isActive,
+        handleFocus,
+        handleHeaderClick,
+        handleEnterClick
+      } = useCollapseItem(props);
+      const {
+        arrowKls,
+        headKls,
+        rootKls,
+        itemWrapperKls,
+        itemContentKls,
+        scopedContentId,
+        scopedHeadId
+      } = useCollapseItemDOM(props, { focusing, isActive, id });
       expose({
         isActive
       });
       return (_ctx, _cache) => {
         return vue.openBlock(), vue.createElementBlock("div", {
-          class: vue.normalizeClass([
-            vue.unref(ns).b("item"),
-            vue.unref(ns).is("active", vue.unref(isActive)),
-            vue.unref(ns).is("disabled", _ctx.disabled)
-          ])
+          class: vue.normalizeClass(vue.unref(rootKls))
         }, [
           vue.createElementVNode("div", {
             role: "tab",
             "aria-expanded": vue.unref(isActive),
-            "aria-controls": vue.unref(ns).b(`content-${id.value}`),
-            "aria-describedby": vue.unref(ns).b(`content-${id.value}`)
+            "aria-controls": vue.unref(scopedContentId),
+            "aria-describedby": vue.unref(scopedContentId)
           }, [
             vue.createElementVNode("div", {
-              id: vue.unref(ns).b(`head-${id.value}`),
-              class: vue.normalizeClass([
-                vue.unref(ns).be("item", "header"),
-                vue.unref(ns).is("active", vue.unref(isActive)),
-                { focusing: focusing.value && !_ctx.disabled }
-              ]),
+              id: vue.unref(scopedHeadId),
+              class: vue.normalizeClass(vue.unref(headKls)),
               role: "button",
               tabindex: _ctx.disabled ? -1 : 0,
-              onClick: handleHeaderClick,
-              onKeypress: vue.withKeys(vue.withModifiers(handleEnterClick, ["stop", "prevent"]), ["space", "enter"]),
-              onFocus: handleFocus,
-              onBlur: _cache[0] || (_cache[0] = ($event) => focusing.value = false)
+              onClick: _cache[0] || (_cache[0] = (...args) => vue.unref(handleHeaderClick) && vue.unref(handleHeaderClick)(...args)),
+              onKeypress: _cache[1] || (_cache[1] = vue.withKeys(vue.withModifiers((...args) => vue.unref(handleEnterClick) && vue.unref(handleEnterClick)(...args), ["stop", "prevent"]), ["space", "enter"])),
+              onFocus: _cache[2] || (_cache[2] = (...args) => vue.unref(handleFocus) && vue.unref(handleFocus)(...args)),
+              onBlur: _cache[3] || (_cache[3] = ($event) => focusing.value = false)
             }, [
               vue.renderSlot(_ctx.$slots, "title", {}, () => [
                 vue.createTextVNode(vue.toDisplayString(_ctx.title), 1)
               ]),
               vue.createVNode(vue.unref(ElIcon), {
-                class: vue.normalizeClass([vue.unref(ns).be("item", "arrow"), vue.unref(ns).is("active", vue.unref(isActive))])
+                class: vue.normalizeClass(vue.unref(arrowKls))
               }, {
                 default: vue.withCtx(() => [
                   vue.createVNode(vue.unref(arrow_right_default))
@@ -22070,14 +22187,14 @@
           vue.createVNode(vue.unref(_CollapseTransition), null, {
             default: vue.withCtx(() => [
               vue.withDirectives(vue.createElementVNode("div", {
-                id: vue.unref(ns).b(`content-${id.value}`),
-                class: vue.normalizeClass(vue.unref(ns).be("item", "wrap")),
+                id: vue.unref(scopedContentId),
+                class: vue.normalizeClass(vue.unref(itemWrapperKls)),
                 role: "tabpanel",
                 "aria-hidden": !vue.unref(isActive),
-                "aria-labelledby": vue.unref(ns).b(`head-${id.value}`)
+                "aria-labelledby": vue.unref(scopedHeadId)
               }, [
                 vue.createElementVNode("div", {
-                  class: vue.normalizeClass(vue.unref(ns).be("item", "content"))
+                  class: vue.normalizeClass(vue.unref(itemContentKls))
                 }, [
                   vue.renderSlot(_ctx.$slots, "default")
                 ], 2)
@@ -25756,12 +25873,12 @@
     const { t } = useLocale();
     const leftPrevYear = () => {
       leftDate.value = leftDate.value.subtract(1, "year");
-      if (!unlinkPanels) {
+      if (!unlinkPanels.value) {
         rightDate.value = rightDate.value.subtract(1, "year");
       }
     };
     const rightNextYear = () => {
-      if (!unlinkPanels) {
+      if (!unlinkPanels.value) {
         leftDate.value = leftDate.value.add(1, "year");
       }
       rightDate.value = rightDate.value.add(1, "year");
@@ -27635,7 +27752,8 @@
     },
     buttonProps: {
       type: definePropType(Object)
-    }
+    },
+    teleported: useTooltipContentProps.teleported
   });
   const dropdownItemProps = buildProps({
     command: {
@@ -27833,7 +27951,7 @@
         "virtual-triggering": _ctx.splitButton,
         disabled: _ctx.disabled,
         transition: `${_ctx.ns.namespace.value}-zoom-in-top`,
-        teleported: "",
+        teleported: _ctx.teleported,
         pure: "",
         persistent: "",
         onBeforeShow: _ctx.handleBeforeShowTooltip,
@@ -27886,7 +28004,7 @@
             }, 8, ["id", "tabindex"])
           ])
         } : void 0
-      ]), 1032, ["role", "effect", "popper-options", "hide-after", "placement", "popper-class", "reference-element", "trigger", "trigger-keys", "trigger-target-el", "show-after", "virtual-ref", "virtual-triggering", "disabled", "transition", "onBeforeShow", "onShow", "onBeforeHide"]),
+      ]), 1032, ["role", "effect", "popper-options", "hide-after", "placement", "popper-class", "reference-element", "trigger", "trigger-keys", "trigger-target-el", "show-after", "virtual-ref", "virtual-triggering", "disabled", "transition", "teleported", "onBeforeShow", "onShow", "onBeforeHide"]),
       _ctx.splitButton ? (vue.openBlock(), vue.createBlock(_component_el_button_group, { key: 0 }, {
         default: vue.withCtx(() => [
           vue.createVNode(_component_el_button, vue.mergeProps({ ref: "referenceElementRef" }, _ctx.buttonProps, {
@@ -28625,6 +28743,8 @@
           }
           return result;
         } catch (e) {
+          if (e instanceof Error)
+            throw e;
           const invalidFields = e;
           if (props.scrollToError) {
             scrollToField(Object.keys(invalidFields)[0]);
@@ -30994,7 +31114,7 @@
       const increase = () => {
         if (props.readonly || inputNumberDisabled.value || maxDisabled.value)
           return;
-        const value = props.modelValue || 0;
+        const value = Number(displayValue.value) || 0;
         const newVal = ensurePrecision(value);
         setCurrentValue(newVal);
         emit(INPUT_EVENT, data.currentValue);
@@ -31002,7 +31122,7 @@
       const decrease = () => {
         if (props.readonly || inputNumberDisabled.value || minDisabled.value)
           return;
-        const value = props.modelValue || 0;
+        const value = Number(displayValue.value) || 0;
         const newVal = ensurePrecision(value, -1);
         setCurrentValue(newVal);
         emit(INPUT_EVENT, data.currentValue);
@@ -32758,10 +32878,10 @@
       if (!val) {
         if (props.filterable) {
           if (isFunction(props.filterMethod)) {
-            props.filterMethod();
+            props.filterMethod("");
           }
           if (isFunction(props.remoteMethod)) {
-            props.remoteMethod();
+            props.remoteMethod("");
           }
         }
         input.value && input.value.blur();
@@ -32832,7 +32952,7 @@
       flush: "post"
     });
     vue.watch(() => states.hoverIndex, (val) => {
-      if (typeof val === "number" && val > -1) {
+      if (isNumber(val) && val > -1) {
         hoverOption.value = optionsArray.value[val] || {};
       } else {
         hoverOption.value = {};
@@ -32861,7 +32981,7 @@
     const handleQueryChange = async (val) => {
       if (states.previousQuery === val || states.isOnComposition)
         return;
-      if (states.previousQuery === null && (typeof props.filterMethod === "function" || typeof props.remoteMethod === "function")) {
+      if (states.previousQuery === null && (isFunction(props.filterMethod) || isFunction(props.remoteMethod))) {
         states.previousQuery = val;
         return;
       }
@@ -32880,10 +33000,10 @@
           resetInputHeight();
         });
       }
-      if (props.remote && typeof props.remoteMethod === "function") {
+      if (props.remote && isFunction(props.remoteMethod)) {
         states.hoverIndex = -1;
         props.remoteMethod(val);
-      } else if (typeof props.filterMethod === "function") {
+      } else if (isFunction(props.filterMethod)) {
         props.filterMethod(val);
         vue.triggerRef(groupQueryChange);
       } else {
@@ -33039,7 +33159,7 @@
     const deleteSelected = (event) => {
       event.stopPropagation();
       const value = props.multiple ? [] : "";
-      if (typeof value !== "string") {
+      if (!isString(value)) {
         for (const item of states.selected) {
           if (item.isDisabled)
             value.push(item.value);
@@ -38142,7 +38262,7 @@
       selectWidth: 200,
       initialInputHeight: 0,
       previousQuery: null,
-      previousValue: "",
+      previousValue: void 0,
       query: "",
       selectedLabel: "",
       softFocus: false,
@@ -38331,7 +38451,7 @@
     const update = (val) => {
       emit(UPDATE_MODEL_EVENT, val);
       emitChange(val);
-      states.previousValue = val.toString();
+      states.previousValue = val == null ? void 0 : val.toString();
     };
     const getValueIndex = (arr = [], value) => {
       if (!isObject$1(value)) {
@@ -38497,7 +38617,7 @@
       if (isArray(props.modelValue)) {
         emptyValue = [];
       } else {
-        emptyValue = "";
+        emptyValue = void 0;
       }
       states.softFocus = true;
       if (props.multiple) {
@@ -38617,7 +38737,7 @@
           });
         } else {
           states.cachedOptions = [];
-          states.previousValue = "";
+          states.previousValue = void 0;
         }
       } else {
         if (hasModelValue.value) {
@@ -38632,7 +38752,7 @@
           }
         } else {
           states.selectedLabel = "";
-          states.previousValue = "";
+          states.previousValue = void 0;
         }
       }
       clearAllNewOption();
@@ -41175,26 +41295,27 @@
     let changed = false;
     const index = statusArr.indexOf(row);
     const included = index !== -1;
-    const addRow = () => {
-      statusArr.push(row);
-      changed = true;
-    };
-    const removeRow = () => {
-      statusArr.splice(index, 1);
+    const toggleStatus = (type) => {
+      if (type === "add") {
+        statusArr.push(row);
+      } else {
+        statusArr.splice(index, 1);
+      }
       changed = true;
+      if (isArray(row.children)) {
+        row.children.forEach((item) => {
+          toggleRowStatus(statusArr, item, newVal != null ? newVal : !included);
+        });
+      }
     };
-    if (typeof newVal === "boolean") {
+    if (isBoolean(newVal)) {
       if (newVal && !included) {
-        addRow();
+        toggleStatus("add");
       } else if (!newVal && included) {
-        removeRow();
+        toggleStatus("remove");
       }
     } else {
-      if (included) {
-        removeRow();
-      } else {
-        addRow();
-      }
+      included ? toggleStatus("remove") : toggleStatus("add");
     }
     return changed;
   }
@@ -41287,22 +41408,29 @@
     scrollContainer == null ? void 0 : scrollContainer.addEventListener("scroll", removePopper);
     return popperInstance;
   }
+  function getCurrentColumns(column) {
+    if (column.children) {
+      return flatMap(column.children, getCurrentColumns);
+    } else {
+      return [column];
+    }
+  }
+  function getColSpan(colSpan, column) {
+    return colSpan + column.colSpan;
+  }
   const isFixedColumn = (index, fixed, store, realColumns) => {
     let start = 0;
     let after = index;
+    const columns = store.states.columns.value;
     if (realColumns) {
-      if (realColumns[index].colSpan > 1) {
-        return {};
-      }
-      for (let i = 0; i < index; i++) {
-        start += realColumns[i].colSpan;
-      }
-      after = start + realColumns[index].colSpan - 1;
+      const curColumns = getCurrentColumns(realColumns[index]);
+      const preColumns = columns.slice(0, columns.indexOf(curColumns[0]));
+      start = preColumns.reduce(getColSpan, 0);
+      after = start + curColumns.reduce(getColSpan, 0) - 1;
     } else {
       start = index;
     }
     let fixedLayout;
-    const columns = store.states.columns;
     switch (fixed) {
       case "left":
         if (after < store.states.fixedLeafColumnsLength.value) {
@@ -41310,14 +41438,14 @@
         }
         break;
       case "right":
-        if (start >= columns.value.length - store.states.rightFixedLeafColumnsLength.value) {
+        if (start >= columns.length - store.states.rightFixedLeafColumnsLength.value) {
           fixedLayout = "right";
         }
         break;
       default:
         if (after < store.states.fixedLeafColumnsLength.value) {
           fixedLayout = "left";
-        } else if (start >= columns.value.length - store.states.rightFixedLeafColumnsLength.value) {
+        } else if (start >= columns.length - store.states.rightFixedLeafColumnsLength.value) {
           fixedLayout = "right";
         }
     }
@@ -41329,11 +41457,11 @@
   };
   const getFixedColumnsClass = (namespace, index, fixed, store, realColumns, offset = 0) => {
     const classes = [];
-    const { direction, start } = isFixedColumn(index, fixed, store, realColumns);
+    const { direction, start, after } = isFixedColumn(index, fixed, store, realColumns);
     if (direction) {
       const isLeft = direction === "left";
       classes.push(`${namespace}-fixed-column--${direction}`);
-      if (isLeft && start + offset === store.states.fixedLeafColumnsLength.value - 1) {
+      if (isLeft && after + offset === store.states.fixedLeafColumnsLength.value - 1) {
         classes.push("is-last-column");
       } else if (!isLeft && start - offset === store.states.columns.value.length - store.states.rightFixedLeafColumnsLength.value) {
         classes.push("is-first-column");
@@ -41345,7 +41473,11 @@
     return offset + (column.realWidth === null || Number.isNaN(column.realWidth) ? Number(column.width) : column.realWidth);
   }
   const getFixedColumnOffset = (index, fixed, store, realColumns) => {
-    const { direction, start = 0 } = isFixedColumn(index, fixed, store, realColumns);
+    const {
+      direction,
+      start = 0,
+      after = 0
+    } = isFixedColumn(index, fixed, store, realColumns);
     if (!direction) {
       return;
     }
@@ -41353,9 +41485,9 @@
     const isLeft = direction === "left";
     const columns = store.states.columns.value;
     if (isLeft) {
-      styles.left = columns.slice(0, index).reduce(getOffset, 0);
+      styles.left = columns.slice(0, start).reduce(getOffset, 0);
     } else {
-      styles.right = columns.slice(start + 1).reverse().reduce(getOffset, 0);
+      styles.right = columns.slice(after + 1).reverse().reduce(getOffset, 0);
     }
     return styles;
   };
@@ -41741,7 +41873,17 @@
       if (!rowKey.value)
         throw new Error("[ElTable] prop row-key is required");
     };
+    const updateChildFixed = (column) => {
+      var _a2;
+      (_a2 = column.children) == null ? void 0 : _a2.forEach((childColumn) => {
+        childColumn.fixed = column.fixed;
+        updateChildFixed(childColumn);
+      });
+    };
     const updateColumns = () => {
+      _columns.value.forEach((column) => {
+        updateChildFixed(column);
+      });
       fixedColumns.value = _columns.value.filter((column) => column.fixed === true || column.fixed === "left");
       rightFixedColumns.value = _columns.value.filter((column) => column.fixed === "right");
       if (fixedColumns.value.length > 0 && _columns.value[0] && _columns.value[0].type === "selection" && !_columns.value[0].fixed) {
@@ -43041,13 +43183,13 @@
           column
         });
       }
-      const fixedStyle = column.isSubColumn ? null : getFixedColumnOffset(columnIndex, column.fixed, props.store, row);
+      const fixedStyle = getFixedColumnOffset(columnIndex, column.fixed, props.store, row);
       ensurePosition(fixedStyle, "left");
       ensurePosition(fixedStyle, "right");
       return Object.assign({}, headerCellStyles, fixedStyle);
     };
     const getHeaderCellClass = (rowIndex, columnIndex, row, column) => {
-      const fixedClasses = column.isSubColumn ? [] : getFixedColumnsClass(ns.b(), columnIndex, column.fixed, props.store, row);
+      const fixedClasses = getFixedColumnsClass(ns.b(), columnIndex, column.fixed, props.store, row);
       const classes = [
         column.id,
         column.order,
@@ -43445,13 +43587,13 @@
           column
         });
       }
-      const fixedStyle = column.isSubColumn ? null : getFixedColumnOffset(columnIndex, props == null ? void 0 : props.fixed, props.store);
+      const fixedStyle = getFixedColumnOffset(columnIndex, props == null ? void 0 : props.fixed, props.store);
       ensurePosition(fixedStyle, "left");
       ensurePosition(fixedStyle, "right");
       return Object.assign({}, cellStyles, fixedStyle);
     };
     const getCellClass = (rowIndex, columnIndex, row, column, offset) => {
-      const fixedClasses = column.isSubColumn ? [] : getFixedColumnsClass(ns.b(), columnIndex, props == null ? void 0 : props.fixed, props.store, void 0, offset);
+      const fixedClasses = getFixedColumnsClass(ns.b(), columnIndex, props == null ? void 0 : props.fixed, props.store, void 0, offset);
       const classes = [column.id, column.align, column.className, ...fixedClasses];
       const cellClassName = parent == null ? void 0 : parent.props.cellClassName;
       if (typeof cellClassName === "string") {
@@ -47747,19 +47889,6 @@
     }
   });
 
-  const getTabPanes = (vm) => {
-    const nodes = flattedChildren(vm.subTree);
-    return nodes.filter((n) => {
-      var _a;
-      return vue.isVNode(n) && ((_a = n.type) == null ? void 0 : _a.name) === "ElTabPane" && !!n.component;
-    });
-  };
-  const getOrderedPanes = (vm, panes) => {
-    const nodes = getTabPanes(vm);
-    const uids = nodes.map((n) => n.component.uid);
-    return uids.map((uid) => panes[uid]).filter((p) => !!p);
-  };
-
   const tabsProps = buildProps({
     type: {
       type: String,
@@ -47805,11 +47934,13 @@
       expose
     }) {
       var _a, _b;
-      const vm = vue.getCurrentInstance();
       const ns = useNamespace("tabs");
+      const {
+        children: panes,
+        addChild: registerPane,
+        removeChild: unregisterPane
+      } = useOrderedChildren(vue.getCurrentInstance(), "ElTabPane");
       const nav$ = vue.ref();
-      const panes = vue.shallowReactive({});
-      const orderedPanes = vue.shallowRef([]);
       const currentName = vue.ref((_b = (_a = props.modelValue) != null ? _a : props.activeName) != null ? _b : "0");
       const changeCurrentName = (value) => {
         currentName.value = value;
@@ -47861,22 +47992,12 @@
         await vue.nextTick();
         (_a2 = nav$.value) == null ? void 0 : _a2.scrollToActiveTab();
       });
-      {
-        const registerPane = (pane) => {
-          panes[pane.uid] = pane;
-          orderedPanes.value = getOrderedPanes(vm, panes);
-        };
-        const unregisterPane = (uid) => {
-          delete panes[uid];
-          orderedPanes.value = getOrderedPanes(vm, panes);
-        };
-        vue.provide(tabsRootContextKey, {
-          props,
-          currentName,
-          registerPane,
-          unregisterPane
-        });
-      }
+      vue.provide(tabsRootContextKey, {
+        props,
+        currentName,
+        registerPane,
+        unregisterPane
+      });
       expose({
         currentName
       });
@@ -47901,7 +48022,7 @@
           "currentName": currentName.value,
           "editable": props.editable,
           "type": props.type,
-          "panes": orderedPanes.value,
+          "panes": panes.value,
           "stretch": props.stretch,
           "onTabClick": handleTabClick,
           "onTabRemove": handleTabRemove
@@ -51947,7 +52068,6 @@
   });
 
   const _hoisted_1$6 = ["aria-expanded", "aria-disabled", "aria-checked", "data-key", "onClick"];
-  const DEFAULT_ICON = "caret-right";
   const __default__$7 = vue.defineComponent({
     name: "ElTreeNode"
   });
@@ -51965,7 +52085,7 @@
       });
       const icon = vue.computed(() => {
         var _a;
-        return (_a = tree == null ? void 0 : tree.props.icon) != null ? _a : DEFAULT_ICON;
+        return (_a = tree == null ? void 0 : tree.props.icon) != null ? _a : caret_right_default;
       });
       const handleClick = (e) => {
         emit("click", props.node, e);
@@ -52845,6 +52965,8 @@
       props.onChange(file, uploadFiles.value);
     };
     const handleStart = (file) => {
+      if (isNil(file.uid))
+        file.uid = genFileId();
       const uploadFile = {
         name: file.name,
         percentage: 0,