element-plus 2.5.3 → 2.5.4

package/dist/index.full.mjs

@@ -1,6 +1,6 @@
-/*! Element Plus v2.5.3 */
+/*! Element Plus v2.5.4 */
 
-import { getCurrentScope, onScopeDispose, unref, readonly, shallowRef, watchEffect, ref, watch, getCurrentInstance, onMounted, nextTick, computed as computed$1, defineComponent, openBlock, createElementBlock, createElementVNode, warn, isVNode, Fragment, Comment, onBeforeUnmount, isRef, inject, onUnmounted, h as h$1, Teleport, onBeforeMount, provide, renderSlot, normalizeClass, normalizeStyle, mergeProps, useSlots, createBlock, Transition, withCtx, withDirectives, resolveDynamicComponent, createCommentVNode, createTextVNode, toDisplayString, createVNode, vShow, toRef, reactive, toRefs, onUpdated, TransitionGroup, useAttrs as useAttrs$1, withModifiers, cloneVNode, Text as Text$1, onDeactivated, renderList, withKeys, createSlots, normalizeProps, toRaw as toRaw$1, vModelCheckbox, vModelRadio, resolveComponent, onBeforeUpdate, vModelText, toHandlers, guardReactiveProps, markRaw, effectScope, resolveDirective, render, camelize as camelize$1, createApp, shallowReactive } from 'vue';
+import { getCurrentScope, onScopeDispose, unref, readonly, shallowRef, watchEffect, ref, watch, getCurrentInstance, onMounted, nextTick, computed as computed$1, defineComponent, openBlock, createElementBlock, createElementVNode, warn, isVNode, Fragment, Comment, onBeforeUnmount, isRef, inject, onUnmounted, h as h$1, Teleport, onBeforeMount, provide, renderSlot, normalizeClass, normalizeStyle, mergeProps, useSlots, createBlock, Transition, withCtx, withDirectives, resolveDynamicComponent, createCommentVNode, createTextVNode, toDisplayString, createVNode, vShow, toRef, reactive, toRefs, onUpdated, TransitionGroup, useAttrs as useAttrs$1, withModifiers, cloneVNode, Text as Text$1, onDeactivated, renderList, withKeys, createSlots, normalizeProps, toRaw as toRaw$1, vModelCheckbox, vModelRadio, resolveComponent, onBeforeUpdate, vModelText, toHandlers, guardReactiveProps, markRaw, effectScope, resolveDirective, render, createApp, shallowReactive } from 'vue';
 
 const FOCUSABLE_ELEMENT_SELECTORS = `a[href],button:not([disabled]),button:not([hidden]),:not([tabindex="-1"]),input:not([disabled]),input:not([type="hidden"]),select:not([disabled]),textarea:not([disabled])`;
 const isVisible = (element) => {
@@ -8637,7 +8637,7 @@ function isComment(node) {
 function isValidElementNode(node) {
   return isVNode(node) && !isFragment(node) && !isComment(node);
 }
-const getNormalizedProps$1 = (node) => {
+const getNormalizedProps = (node) => {
   if (!isVNode(node)) {
     return {};
   }
@@ -8717,7 +8717,7 @@ const useDeprecated = ({ from, replacement, scope, version, ref, type = "API" },
   });
 };
 
-const useDraggable = (targetRef, dragRef, draggable) => {
+const useDraggable = (targetRef, dragRef, draggable, overflow) => {
   let transform = {
     offsetX: 0,
     offsetY: 0
@@ -8738,8 +8738,12 @@ const useDraggable = (targetRef, dragRef, draggable) => {
     const maxLeft = clientWidth - targetLeft - targetWidth + offsetX;
     const maxTop = clientHeight - targetTop - targetHeight + offsetY;
     const onMousemove = (e2) => {
-      const moveX = Math.min(Math.max(offsetX + e2.clientX - downX, minLeft), maxLeft);
-      const moveY = Math.min(Math.max(offsetY + e2.clientY - downY, minTop), maxTop);
+      let moveX = offsetX + e2.clientX - downX;
+      let moveY = offsetY + e2.clientY - downY;
+      if (!(overflow == null ? void 0 : overflow.value)) {
+        moveX = Math.min(Math.max(moveX, minLeft), maxLeft);
+        moveY = Math.min(Math.max(moveY, minTop), maxTop);
+      }
       transform = {
         offsetX: moveX,
         offsetY: moveY
@@ -11559,7 +11563,7 @@ const ConfigProvider = defineComponent({
 
 const ElConfigProvider = withInstall(ConfigProvider);
 
-const version$1 = "2.5.3";
+const version$1 = "2.5.4";
 
 const makeInstaller = (components = []) => {
   const install = (app, options) => {
@@ -23470,20 +23474,16 @@ const ElCascaderPanel = _CascaderPanel;
 const tagProps = buildProps({
   type: {
     type: String,
-    values: ["success", "info", "warning", "danger", ""],
-    default: ""
+    values: ["primary", "success", "info", "warning", "danger"],
+    default: "primary"
   },
   closable: Boolean,
   disableTransitions: Boolean,
   hit: Boolean,
-  color: {
-    type: String,
-    default: ""
-  },
+  color: String,
   size: {
     type: String,
-    values: componentSizes,
-    default: ""
+    values: componentSizes
   },
   effect: {
     type: String,
@@ -23513,7 +23513,7 @@ const _sfc_main$1I = /* @__PURE__ */ defineComponent({
       return [
         ns.b(),
         ns.is("closable", closable),
-        ns.m(type),
+        ns.m(type || "primary"),
         ns.m(tagSize.value),
         ns.m(effect),
         ns.is("hit", hit),
@@ -24255,6 +24255,11 @@ const checkTagProps = buildProps({
   checked: {
     type: Boolean,
     default: false
+  },
+  type: {
+    type: String,
+    values: ["primary", "success", "info", "warning", "danger"],
+    default: "primary"
   }
 });
 const checkTagEmits = {
@@ -24272,7 +24277,11 @@ const _sfc_main$1G = /* @__PURE__ */ defineComponent({
   setup(__props, { emit }) {
     const props = __props;
     const ns = useNamespace("check-tag");
-    const containerKls = computed$1(() => [ns.b(), ns.is("checked", props.checked)]);
+    const containerKls = computed$1(() => [
+      ns.b(),
+      ns.is("checked", props.checked),
+      ns.m(props.type || "primary")
+    ]);
     const handleChange = () => {
       const checked = !props.checked;
       emit(CHANGE_EVENT, checked);
@@ -29007,7 +29016,7 @@ var ElDescriptionsCell = defineComponent({
   },
   render() {
     var _a, _b, _c, _d, _e, _f, _g;
-    const item = getNormalizedProps$1(this.cell);
+    const item = getNormalizedProps(this.cell);
     const directives = (((_a = this.cell) == null ? void 0 : _a.dirs) || []).map((dire) => {
       const { dir, arg, modifiers, value } = dire;
       return [dir, value, arg, modifiers];
@@ -29381,11 +29390,8 @@ const dialogContentProps = buildProps({
   closeIcon: {
     type: iconPropType
   },
-  customClass: {
-    type: String,
-    default: ""
-  },
   draggable: Boolean,
+  overflow: Boolean,
   fullscreen: Boolean,
   showClose: {
     type: Boolean,
@@ -29423,12 +29429,12 @@ const _sfc_main$1i = /* @__PURE__ */ defineComponent({
       ns.is("fullscreen", props.fullscreen),
       ns.is("draggable", props.draggable),
       ns.is("align-center", props.alignCenter),
-      { [ns.m("center")]: props.center },
-      props.customClass
+      { [ns.m("center")]: props.center }
     ]);
     const composedDialogRef = composeRefs(focusTrapRef, dialogRef);
     const draggable = computed$1(() => props.draggable);
-    useDraggable(dialogRef, headerRef, draggable);
+    const overflow = computed$1(() => props.overflow);
+    useDraggable(dialogRef, headerRef, draggable, overflow);
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
         ref: unref(composedDialogRef),
@@ -29439,7 +29445,7 @@ const _sfc_main$1i = /* @__PURE__ */ defineComponent({
         createElementVNode("header", {
           ref_key: "headerRef",
           ref: headerRef,
-          class: normalizeClass(unref(ns).e("header"))
+          class: normalizeClass([unref(ns).e("header"), { "show-close": _ctx.showClose }])
         }, [
           renderSlot(_ctx.$slots, "header", {}, () => [
             createElementVNode("span", {
@@ -29736,14 +29742,6 @@ const _sfc_main$1h = /* @__PURE__ */ defineComponent({
       version: "3.0.0",
       ref: "https://element-plus.org/en-US/component/dialog.html#slots"
     }, computed$1(() => !!slots.title));
-    useDeprecated({
-      scope: "el-dialog",
-      from: "custom-class",
-      replacement: "class",
-      version: "2.3.0",
-      ref: "https://element-plus.org/en-US/component/dialog.html#attributes",
-      type: "Attribute"
-    }, computed$1(() => !!props.customClass));
     const ns = useNamespace("dialog");
     const dialogRef = ref();
     const headerRef = ref();
@@ -29827,11 +29825,11 @@ const _sfc_main$1h = /* @__PURE__ */ defineComponent({
                         ref_key: "dialogContentRef",
                         ref: dialogContentRef
                       }, _ctx.$attrs, {
-                        "custom-class": _ctx.customClass,
                         center: _ctx.center,
                         "align-center": _ctx.alignCenter,
                         "close-icon": _ctx.closeIcon,
                         draggable: unref(draggable),
+                        overflow: _ctx.overflow,
                         fullscreen: _ctx.fullscreen,
                         "show-close": _ctx.showClose,
                         title: _ctx.title,
@@ -29857,7 +29855,7 @@ const _sfc_main$1h = /* @__PURE__ */ defineComponent({
                             renderSlot(_ctx.$slots, "footer")
                           ])
                         } : void 0
-                      ]), 1040, ["custom-class", "center", "align-center", "close-icon", "draggable", "fullscreen", "show-close", "title", "aria-level", "onClose"])) : createCommentVNode("v-if", true)
+                      ]), 1040, ["center", "align-center", "close-icon", "draggable", "overflow", "fullscreen", "show-close", "title", "aria-level", "onClose"])) : createCommentVNode("v-if", true)
                     ]),
                     _: 3
                   }, 8, ["trapped", "onFocusAfterTrapped", "onFocusAfterReleased", "onFocusoutPrevented", "onReleaseRequested"])
@@ -29977,14 +29975,6 @@ const _sfc_main$1f = /* @__PURE__ */ defineComponent({
       version: "3.0.0",
       ref: "https://element-plus.org/en-US/component/drawer.html#slots"
     }, computed$1(() => !!slots.title));
-    useDeprecated({
-      scope: "el-drawer",
-      from: "custom-class",
-      replacement: "class",
-      version: "2.3.0",
-      ref: "https://element-plus.org/en-US/component/drawer.html#attributes",
-      type: "Attribute"
-    }, computed$1(() => !!props.customClass));
     const drawerRef = ref();
     const focusStartRef = ref();
     const ns = useNamespace("drawer");
@@ -29998,6 +29988,9 @@ const _sfc_main$1f = /* @__PURE__ */ defineComponent({
       titleId,
       bodyId,
       onModalClick,
+      onOpenAutoFocus,
+      onCloseAutoFocus,
+      onFocusoutPrevented,
       onCloseRequested,
       handleClose
     } = useDialog(props, drawerRef);
@@ -30033,6 +30026,9 @@ const _sfc_main$1f = /* @__PURE__ */ defineComponent({
                   trapped: unref(visible),
                   "focus-trap-el": drawerRef.value,
                   "focus-start-el": focusStartRef.value,
+                  onFocusAfterTrapped: unref(onOpenAutoFocus),
+                  onFocusAfterReleased: unref(onCloseAutoFocus),
+                  onFocusoutPrevented: unref(onFocusoutPrevented),
                   onReleaseRequested: unref(onCloseRequested)
                 }, {
                   default: withCtx(() => [
@@ -30044,7 +30040,7 @@ const _sfc_main$1f = /* @__PURE__ */ defineComponent({
                       "aria-labelledby": !_ctx.title ? unref(titleId) : void 0,
                       "aria-describedby": unref(bodyId)
                     }, _ctx.$attrs, {
-                      class: [unref(ns).b(), _ctx.direction, unref(visible) && "open", _ctx.customClass],
+                      class: [unref(ns).b(), _ctx.direction, unref(visible) && "open"],
                       style: unref(isHorizontal) ? "width: " + unref(drawerSize) : "height: " + unref(drawerSize),
                       role: "dialog",
                       onClick: _cache[1] || (_cache[1] = withModifiers(() => {
@@ -30109,7 +30105,7 @@ const _sfc_main$1f = /* @__PURE__ */ defineComponent({
                     ], 16, _hoisted_1$C)
                   ]),
                   _: 3
-                }, 8, ["trapped", "focus-trap-el", "focus-start-el", "onReleaseRequested"])
+                }, 8, ["trapped", "focus-trap-el", "focus-start-el", "onFocusAfterTrapped", "onFocusAfterReleased", "onFocusoutPrevented", "onReleaseRequested"])
               ]),
               _: 3
             }, 8, ["mask", "overlay-class", "z-index", "onClick"]), [
@@ -33217,19 +33213,26 @@ var Menu = defineComponent({
         activeIndex.value = val;
       }
     };
+    const calcMenuItemWidth = (menuItem) => {
+      const computedStyle = getComputedStyle(menuItem);
+      const marginLeft = Number.parseInt(computedStyle.marginLeft, 10);
+      const marginRight = Number.parseInt(computedStyle.marginRight, 10);
+      return menuItem.offsetWidth + marginLeft + marginRight || 0;
+    };
     const calcSliceIndex = () => {
       var _a, _b;
       if (!menu.value)
         return -1;
       const items2 = Array.from((_b = (_a = menu.value) == null ? void 0 : _a.childNodes) != null ? _b : []).filter((item) => item.nodeName !== "#comment" && (item.nodeName !== "#text" || item.nodeValue));
       const moreItemWidth = 64;
-      const paddingLeft = Number.parseInt(getComputedStyle(menu.value).paddingLeft, 10);
-      const paddingRight = Number.parseInt(getComputedStyle(menu.value).paddingRight, 10);
+      const computedMenuStyle = getComputedStyle(menu.value);
+      const paddingLeft = Number.parseInt(computedMenuStyle.paddingLeft, 10);
+      const paddingRight = Number.parseInt(computedMenuStyle.paddingRight, 10);
       const menuWidth = menu.value.clientWidth - paddingLeft - paddingRight;
       let calcWidth = 0;
       let sliceIndex2 = 0;
       items2.forEach((item, index) => {
-        calcWidth += item.offsetWidth || 0;
+        calcWidth += calcMenuItemWidth(item);
         if (calcWidth <= menuWidth - moreItemWidth) {
           sliceIndex2 = index + 1;
         }
@@ -33758,10 +33761,10 @@ function useOption$1(props, states) {
   const select = inject(selectKey);
   const selectGroup = inject(selectGroupKey, { disabled: false });
   const itemSelected = computed$1(() => {
-    if (!select.props.multiple) {
-      return isEqual$1(props.value, select.props.modelValue);
-    } else {
+    if (select.props.multiple) {
       return contains(select.props.modelValue, props.value);
+    } else {
+      return contains([select.props.modelValue], props.value);
     }
   });
   const limitReached = computed$1(() => {
@@ -34472,8 +34475,6 @@ const useSelect$3 = (props, emit) => {
   const toggleMenu = () => {
     if (selectDisabled.value)
       return;
-    if (props.filterable && props.remote && isFunction$1(props.remoteMethod))
-      return;
     if (states.menuVisibleOnFocus) {
       states.menuVisibleOnFocus = false;
     } else {
@@ -35147,11 +35148,13 @@ const _sfc_main$S = defineComponent({
       const children2 = [];
       if (isArray$1(node.children)) {
         node.children.forEach((child) => {
-          var _a;
+          var _a, _b;
           if (child.type && child.type.name === "ElOption" && child.component && child.component.proxy) {
             children2.push(child.component.proxy);
           } else if ((_a = child.children) == null ? void 0 : _a.length) {
             children2.push(...flattedChildren(child));
+          } else if ((_b = child.component) == null ? void 0 : _b.subTree) {
+            children2.push(...flattedChildren(child.component.subTree));
           }
         });
       }
@@ -39443,8 +39446,6 @@ const useSelect$1 = (props, emit) => {
   const toggleMenu = () => {
     if (selectDisabled.value)
       return;
-    if (props.filterable && props.remote && isFunction$1(props.remoteMethod))
-      return;
     if (states.menuVisibleOnFocus) {
       states.menuVisibleOnFocus = false;
     } else {
@@ -42590,7 +42591,7 @@ function createTablePopper(props, popperContent, trigger, table) {
       removePopper == null ? void 0 : removePopper();
     }
   });
-  vm.appContext = table.appContext;
+  vm.appContext = { ...table.appContext, ...table };
   const container = document.createElement("div");
   render(vm, container);
   vm.component.exposed.onOpen();
@@ -49285,6 +49286,14 @@ const Tabs = defineComponent({
       ref: "https://element-plus.org/en-US/component/tabs.html#attributes",
       type: "Attribute"
     }, computed$1(() => !!props.activeName));
+    useDeprecated({
+      from: '"addIcon"',
+      replacement: '"add-icon"',
+      scope: "ElTabs",
+      version: "2.6.0",
+      ref: "https://element-plus.org/en-US/component/tabs.html#slots",
+      type: "Slot"
+    }, computed$1(() => !!slots.addIcon));
     watch(() => props.activeName, (modelValue) => setCurrentName(modelValue));
     watch(() => props.modelValue, (modelValue) => setCurrentName(modelValue));
     watch(currentName, async () => {
@@ -49302,7 +49311,8 @@ const Tabs = defineComponent({
       currentName
     });
     return () => {
-      const addSlot = slots.addIcon;
+      const addSlot = slots["add-icon"] || slots["addIcon"];
+      const isCamelCase = addSlot && slots["addIcon"];
       const newButton = props.editable || props.addable ? createVNode("span", {
         "class": ns.e("new-tab"),
         "tabindex": "0",
@@ -49311,7 +49321,7 @@ const Tabs = defineComponent({
           if (ev.code === EVENT_CODE.enter)
             handleTabAdd();
         }
-      }, [addSlot ? renderSlot(slots, "addIcon") : createVNode(ElIcon, {
+      }, [addSlot ? renderSlot(slots, isCamelCase ? "addIcon" : "add-icon") : createVNode(ElIcon, {
         "class": ns.is("icon-plus")
       }, {
         default: () => [createVNode(plus_default, null, null)]
@@ -53930,6 +53940,9 @@ const uploadProps = buildProps({
   onExceed: {
     type: definePropType(Function),
     default: NOOP
+  },
+  crossorigin: {
+    type: definePropType(String)
   }
 });
 
@@ -53950,6 +53963,9 @@ const uploadListProps = buildProps({
     type: String,
     values: uploadListTypes,
     default: "text"
+  },
+  crossorigin: {
+    type: definePropType(String)
   }
 });
 const uploadListEmits = {
@@ -53957,7 +53973,7 @@ const uploadListEmits = {
 };
 
 const _hoisted_1$7 = ["onKeydown"];
-const _hoisted_2$5 = ["src"];
+const _hoisted_2$5 = ["src", "crossorigin"];
 const _hoisted_3$2 = ["onClick"];
 const _hoisted_4$1 = ["title"];
 const _hoisted_5 = ["onClick"];
@@ -54011,6 +54027,7 @@ const _sfc_main$b = /* @__PURE__ */ defineComponent({
                   key: 0,
                   class: normalizeClass(unref(nsUpload).be("list", "item-thumbnail")),
                   src: file.url,
+                  crossorigin: _ctx.crossorigin,
                   alt: ""
                 }, null, 10, _hoisted_2$5)) : createCommentVNode("v-if", true),
                 file.status === "uploading" || _ctx.listType !== "picture-card" ? (openBlock(), createElementBlock("div", {
@@ -54594,6 +54611,7 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
           disabled: unref(disabled),
           "list-type": _ctx.listType,
           files: unref(uploadFiles),
+          crossorigin: _ctx.crossorigin,
           "handle-preview": _ctx.onPreview,
           onRemove: unref(handleRemove)
         }, createSlots({
@@ -54617,7 +54635,7 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
               renderSlot(_ctx.$slots, "file", { file })
             ])
           } : void 0
-        ]), 1032, ["disabled", "list-type", "files", "handle-preview", "onRemove"])) : createCommentVNode("v-if", true),
+        ]), 1032, ["disabled", "list-type", "files", "crossorigin", "handle-preview", "onRemove"])) : createCommentVNode("v-if", true),
         !unref(isPictureCard) || unref(isPictureCard) && !_ctx.showFileList ? (openBlock(), createBlock(UploadContent, mergeProps({
           key: 1,
           ref_key: "uploadRef",
@@ -54636,6 +54654,7 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
           disabled: unref(disabled),
           "list-type": _ctx.listType,
           files: unref(uploadFiles),
+          crossorigin: _ctx.crossorigin,
           "handle-preview": _ctx.onPreview,
           onRemove: unref(handleRemove)
         }, createSlots({ _: 2 }, [
@@ -54645,7 +54664,7 @@ const _sfc_main$8 = /* @__PURE__ */ defineComponent({
               renderSlot(_ctx.$slots, "file", { file })
             ])
           } : void 0
-        ]), 1032, ["disabled", "list-type", "files", "handle-preview", "onRemove"])) : createCommentVNode("v-if", true)
+        ]), 1032, ["disabled", "list-type", "files", "crossorigin", "handle-preview", "onRemove"])) : createCommentVNode("v-if", true)
       ]);
     };
   }
@@ -55106,48 +55125,6 @@ function isInViewPort(element) {
   const { top, right, bottom, left } = element.getBoundingClientRect();
   return top >= 0 && left >= 0 && right <= viewWidth && bottom <= viewHeight;
 }
-const isSameProps = (a, b) => {
-  if (Object.keys(a).length !== Object.keys(b).length)
-    return false;
-  for (const key in a) {
-    if (a[key] !== b[key]) {
-      return false;
-    }
-  }
-  return true;
-};
-function isSameSteps(a, b) {
-  if (a.length !== b.length)
-    return false;
-  for (const [index] of a.entries()) {
-    if (isSameProps(a[index], b[index])) {
-      return false;
-    }
-  }
-  return true;
-}
-const getNormalizedProps = (node, booleanKeys) => {
-  var _a;
-  if (!isVNode(node)) {
-    return {};
-  }
-  const raw = node.props || {};
-  const type = ((_a = node.type) == null ? void 0 : _a.props) || {};
-  const props = {};
-  Object.keys(type).forEach((key) => {
-    if (hasOwn(type[key], "default")) {
-      props[key] = type[key].default;
-    }
-  });
-  Object.keys(raw).forEach((key) => {
-    const cameKey = camelize$1(key);
-    props[cameKey] = raw[key];
-    if (booleanKeys.includes(cameKey) && props[cameKey] === "") {
-      props[cameKey] = true;
-    }
-  });
-  return props;
-};
 const useFloating = (referenceRef, contentRef, arrowRef, placement, strategy, offset$1, zIndex, showArrow) => {
   const x = ref();
   const y = ref();
@@ -55439,14 +55416,14 @@ var ElTourSteps = defineComponent({
       default: 0
     }
   },
-  emits: ["update-steps"],
+  emits: ["update-total"],
   setup(props, { slots, emit }) {
-    let cachedSteps = [];
+    let cacheTotal = 0;
     return () => {
       var _a, _b;
       const children = (_a = slots.default) == null ? void 0 : _a.call(slots);
-      const filteredSteps = [];
       const result = [];
+      let total = 0;
       function filterSteps(children2) {
         if (!isArray$1(children2))
           return;
@@ -55454,18 +55431,17 @@ var ElTourSteps = defineComponent({
           var _a2;
           const name = (_a2 = (item == null ? void 0 : item.type) || {}) == null ? void 0 : _a2.name;
           if (name === "ElTourStep") {
-            const booleanKeys = ["showArrow", "mask", "scrollIntoViewOptions"];
-            filteredSteps.push(getNormalizedProps(item, booleanKeys));
             result.push(item);
+            total += 1;
           }
         });
       }
       if (children.length) {
         filterSteps(flattedChildren((_b = children[0]) == null ? void 0 : _b.children));
       }
-      if (!isSameSteps(filteredSteps, cachedSteps)) {
-        cachedSteps = filteredSteps;
-        emit("update-steps", filteredSteps);
+      if (cacheTotal !== total) {
+        cacheTotal = total;
+        emit("update-total", total);
       }
       if (result.length) {
         return result[props.current];
@@ -55550,39 +55526,44 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
   setup(__props, { emit }) {
     const props = __props;
     const ns = useNamespace("tour");
-    const steps = ref([]);
+    const total = ref(0);
+    const currentStep = ref();
     const current = useVModel(props, "current", emit, {
       passive: true
     });
-    const total = computed$1(() => steps.value.length);
-    const currentStep = computed$1(() => steps.value[current.value] || {});
-    const currentTarget = computed$1(() => currentStep.value.target);
+    const currentTarget = computed$1(() => {
+      var _a;
+      return (_a = currentStep.value) == null ? void 0 : _a.target;
+    });
     const kls = computed$1(() => [
       ns.b(),
       mergedType.value === "primary" ? ns.m("primary") : ""
     ]);
-    const mergedPlacement = computed$1(() => currentStep.value.placement || props.placement);
-    const mergedContentStyle = computed$1(() => {
+    const mergedPlacement = computed$1(() => {
       var _a;
-      return (_a = currentStep.value.contentStyle) != null ? _a : props.contentStyle;
+      return ((_a = currentStep.value) == null ? void 0 : _a.placement) || props.placement;
+    });
+    const mergedContentStyle = computed$1(() => {
+      var _a, _b;
+      return (_b = (_a = currentStep.value) == null ? void 0 : _a.contentStyle) != null ? _b : props.contentStyle;
     });
     const mergedMask = computed$1(() => {
-      var _a;
-      return (_a = currentStep.value.mask) != null ? _a : props.mask;
+      var _a, _b;
+      return (_b = (_a = currentStep.value) == null ? void 0 : _a.mask) != null ? _b : props.mask;
     });
     const mergedShowMask = computed$1(() => !!mergedMask.value && props.modelValue);
     const mergedMaskStyle = computed$1(() => isBoolean(mergedMask.value) ? void 0 : mergedMask.value);
     const mergedShowArrow = computed$1(() => {
-      var _a;
-      return !!currentTarget.value && ((_a = currentStep.value.showArrow) != null ? _a : props.showArrow);
+      var _a, _b;
+      return !!currentTarget.value && ((_b = (_a = currentStep.value) == null ? void 0 : _a.showArrow) != null ? _b : props.showArrow);
     });
     const mergedScrollIntoViewOptions = computed$1(() => {
-      var _a;
-      return (_a = currentStep.value.scrollIntoViewOptions) != null ? _a : props.scrollIntoViewOptions;
+      var _a, _b;
+      return (_b = (_a = currentStep.value) == null ? void 0 : _a.scrollIntoViewOptions) != null ? _b : props.scrollIntoViewOptions;
     });
     const mergedType = computed$1(() => {
-      var _a;
-      return (_a = currentStep.value.type) != null ? _a : props.type;
+      var _a, _b;
+      return (_b = (_a = currentStep.value) == null ? void 0 : _a.type) != null ? _b : props.type;
     });
     const { nextZIndex } = useZIndex();
     const nowZIndex = nextZIndex();
@@ -55596,17 +55577,18 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
         current.value = 0;
       }
     });
-    const onUpdateSteps = (v) => {
-      steps.value = v;
-    };
     const onEscClose = () => {
       if (props.closeOnPressEscape) {
         emit("update:modelValue", false);
         emit("close", current.value);
       }
     };
+    const onUpdateTotal = (val) => {
+      total.value = val;
+    };
     const slots = useSlots();
     provide(tourKey, {
+      currentStep,
       current,
       total,
       showClose: toRef(props, "showClose"),
@@ -55652,7 +55634,7 @@ const _sfc_main$4 = /* @__PURE__ */ defineComponent({
               default: withCtx(() => [
                 createVNode(unref(ElTourSteps), {
                   current: unref(current),
-                  onUpdateSteps
+                  onUpdateTotal
                 }, {
                   default: withCtx(() => [
                     renderSlot(_ctx.$slots, "default")
@@ -55680,18 +55662,19 @@ const tourStepProps = buildProps({
   description: String,
   showClose: {
     type: Boolean,
-    default: true
+    default: void 0
   },
   closeIcon: {
     type: iconPropType
   },
   showArrow: {
     type: Boolean,
-    default: true
+    default: void 0
   },
   placement: tourContentProps.placement,
   mask: {
-    type: definePropType([Boolean, Object])
+    type: definePropType([Boolean, Object]),
+    default: void 0
   },
   contentStyle: {
     type: definePropType([Object])
@@ -55703,7 +55686,8 @@ const tourStepProps = buildProps({
     type: definePropType(Object)
   },
   scrollIntoViewOptions: {
-    type: definePropType([Boolean, Object])
+    type: definePropType([Boolean, Object]),
+    default: void 0
   },
   type: {
     type: definePropType(String)
@@ -55725,6 +55709,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
     const { Close } = CloseComponents;
     const { t } = useLocale();
     const {
+      currentStep,
       current,
       total,
       showClose,
@@ -55737,6 +55722,11 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
       onFinish: tourOnFinish,
       onChange
     } = inject(tourKey);
+    watch(props, (val) => {
+      currentStep.value = val;
+    }, {
+      immediate: true
+    });
     const mergedShowClose = computed$1(() => {
       var _a;
       return (_a = props.showClose) != null ? _a : showClose.value;
@@ -55745,6 +55735,11 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
       var _a, _b;
       return (_b = (_a = props.closeIcon) != null ? _a : closeIcon.value) != null ? _b : Close;
     });
+    const filterButtonProps = (btnProps) => {
+      if (!btnProps)
+        return;
+      return omit(btnProps, ["children", "onClick"]);
+    };
     const onPrev = () => {
       var _a, _b;
       current.value -= 1;
@@ -55793,7 +55788,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
           }, 8, ["class"])
         ], 2)) : createCommentVNode("v-if", true),
         createElementVNode("header", {
-          class: normalizeClass(unref(ns).e("header"))
+          class: normalizeClass([unref(ns).e("header"), { "show-close": unref(showClose) }])
         }, [
           renderSlot(_ctx.$slots, "header", {}, () => [
             createElementVNode("span", {
@@ -55833,7 +55828,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
               key: 0,
               size: "small",
               type: unref(mergedType)
-            }, _ctx.prevButtonProps, { onClick: onPrev }), {
+            }, filterButtonProps(_ctx.prevButtonProps), { onClick: onPrev }), {
               default: withCtx(() => {
                 var _a, _b;
                 return [
@@ -55846,11 +55841,11 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
               key: 1,
               size: "small",
               type: unref(mergedType) === "primary" ? "default" : "primary"
-            }, _ctx.nextButtonProps, { onClick: onNext }), {
+            }, filterButtonProps(_ctx.nextButtonProps), { onClick: onNext }), {
               default: withCtx(() => {
                 var _a, _b;
                 return [
-                  createTextVNode(toDisplayString(((_b = (_a = _ctx.nextButtonProps) == null ? void 0 : _a.children) != null ? _b : unref(current) === unref(total) - 1) ? unref(t)("el.tour.finish") : unref(t)("el.tour.next")), 1)
+                  createTextVNode(toDisplayString((_b = (_a = _ctx.nextButtonProps) == null ? void 0 : _a.children) != null ? _b : unref(current) === unref(total) - 1 ? unref(t)("el.tour.finish") : unref(t)("el.tour.next")), 1)
                 ];
               }),
               _: 1
@@ -56771,6 +56766,7 @@ const _sfc_main$1 = defineComponent({
     },
     center: Boolean,
     draggable: Boolean,
+    overflow: Boolean,
     roundButton: {
       default: false,
       type: Boolean
@@ -56881,7 +56877,8 @@ const _sfc_main$1 = defineComponent({
       }
     });
     const draggable = computed$1(() => props.draggable);
-    useDraggable(rootRef, headerRef, draggable);
+    const overflow = computed$1(() => props.overflow);
+    useDraggable(rootRef, headerRef, draggable, overflow);
     onMounted(async () => {
       await nextTick();
       if (props.closeOnHashChange) {
@@ -57051,7 +57048,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
                   _ctx.title !== null && _ctx.title !== void 0 ? (openBlock(), createElementBlock("div", {
                     key: 0,
                     ref: "headerRef",
-                    class: normalizeClass(_ctx.ns.e("header"))
+                    class: normalizeClass([_ctx.ns.e("header"), { "show-close": _ctx.showClose }])
                   }, [
                     createElementVNode("div", {
                       class: normalizeClass(_ctx.ns.e("title"))