element-plus 2.5.3 → 2.5.4

package/dist/index.full.js

@@ -1,4 +1,4 @@
-/*! Element Plus v2.5.3 */
+/*! Element Plus v2.5.4 */
 
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue')) :
@@ -8641,7 +8641,7 @@
   function isValidElementNode(node) {
     return vue.isVNode(node) && !isFragment(node) && !isComment(node);
   }
-  const getNormalizedProps$1 = (node) => {
+  const getNormalizedProps = (node) => {
     if (!vue.isVNode(node)) {
       return {};
     }
@@ -8721,7 +8721,7 @@
     });
   };
 
-  const useDraggable = (targetRef, dragRef, draggable) => {
+  const useDraggable = (targetRef, dragRef, draggable, overflow) => {
     let transform = {
       offsetX: 0,
       offsetY: 0
@@ -8742,8 +8742,12 @@
       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
@@ -11563,7 +11567,7 @@
 
   const ElConfigProvider = withInstall(ConfigProvider);
 
-  const version$1 = "2.5.3";
+  const version$1 = "2.5.4";
 
   const makeInstaller = (components = []) => {
     const install = (app, options) => {
@@ -23474,20 +23478,16 @@
   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,
@@ -23517,7 +23517,7 @@
         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),
@@ -24259,6 +24259,11 @@
     checked: {
       type: Boolean,
       default: false
+    },
+    type: {
+      type: String,
+      values: ["primary", "success", "info", "warning", "danger"],
+      default: "primary"
     }
   });
   const checkTagEmits = {
@@ -24276,7 +24281,11 @@
     setup(__props, { emit }) {
       const props = __props;
       const ns = useNamespace("check-tag");
-      const containerKls = vue.computed(() => [ns.b(), ns.is("checked", props.checked)]);
+      const containerKls = vue.computed(() => [
+        ns.b(),
+        ns.is("checked", props.checked),
+        ns.m(props.type || "primary")
+      ]);
       const handleChange = () => {
         const checked = !props.checked;
         emit(CHANGE_EVENT, checked);
@@ -29011,7 +29020,7 @@
     },
     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];
@@ -29385,11 +29394,8 @@
     closeIcon: {
       type: iconPropType
     },
-    customClass: {
-      type: String,
-      default: ""
-    },
     draggable: Boolean,
+    overflow: Boolean,
     fullscreen: Boolean,
     showClose: {
       type: Boolean,
@@ -29427,12 +29433,12 @@
         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 = vue.computed(() => props.draggable);
-      useDraggable(dialogRef, headerRef, draggable);
+      const overflow = vue.computed(() => props.overflow);
+      useDraggable(dialogRef, headerRef, draggable, overflow);
       return (_ctx, _cache) => {
         return vue.openBlock(), vue.createElementBlock("div", {
           ref: vue.unref(composedDialogRef),
@@ -29443,7 +29449,7 @@
           vue.createElementVNode("header", {
             ref_key: "headerRef",
             ref: headerRef,
-            class: vue.normalizeClass(vue.unref(ns).e("header"))
+            class: vue.normalizeClass([vue.unref(ns).e("header"), { "show-close": _ctx.showClose }])
           }, [
             vue.renderSlot(_ctx.$slots, "header", {}, () => [
               vue.createElementVNode("span", {
@@ -29740,14 +29746,6 @@
         version: "3.0.0",
         ref: "https://element-plus.org/en-US/component/dialog.html#slots"
       }, vue.computed(() => !!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"
-      }, vue.computed(() => !!props.customClass));
       const ns = useNamespace("dialog");
       const dialogRef = vue.ref();
       const headerRef = vue.ref();
@@ -29831,11 +29829,11 @@
                           ref_key: "dialogContentRef",
                           ref: dialogContentRef
                         }, _ctx.$attrs, {
-                          "custom-class": _ctx.customClass,
                           center: _ctx.center,
                           "align-center": _ctx.alignCenter,
                           "close-icon": _ctx.closeIcon,
                           draggable: vue.unref(draggable),
+                          overflow: _ctx.overflow,
                           fullscreen: _ctx.fullscreen,
                           "show-close": _ctx.showClose,
                           title: _ctx.title,
@@ -29861,7 +29859,7 @@
                               vue.renderSlot(_ctx.$slots, "footer")
                             ])
                           } : void 0
-                        ]), 1040, ["custom-class", "center", "align-center", "close-icon", "draggable", "fullscreen", "show-close", "title", "aria-level", "onClose"])) : vue.createCommentVNode("v-if", true)
+                        ]), 1040, ["center", "align-center", "close-icon", "draggable", "overflow", "fullscreen", "show-close", "title", "aria-level", "onClose"])) : vue.createCommentVNode("v-if", true)
                       ]),
                       _: 3
                     }, 8, ["trapped", "onFocusAfterTrapped", "onFocusAfterReleased", "onFocusoutPrevented", "onReleaseRequested"])
@@ -29981,14 +29979,6 @@
         version: "3.0.0",
         ref: "https://element-plus.org/en-US/component/drawer.html#slots"
       }, vue.computed(() => !!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"
-      }, vue.computed(() => !!props.customClass));
       const drawerRef = vue.ref();
       const focusStartRef = vue.ref();
       const ns = useNamespace("drawer");
@@ -30002,6 +29992,9 @@
         titleId,
         bodyId,
         onModalClick,
+        onOpenAutoFocus,
+        onCloseAutoFocus,
+        onFocusoutPrevented,
         onCloseRequested,
         handleClose
       } = useDialog(props, drawerRef);
@@ -30037,6 +30030,9 @@
                     trapped: vue.unref(visible),
                     "focus-trap-el": drawerRef.value,
                     "focus-start-el": focusStartRef.value,
+                    onFocusAfterTrapped: vue.unref(onOpenAutoFocus),
+                    onFocusAfterReleased: vue.unref(onCloseAutoFocus),
+                    onFocusoutPrevented: vue.unref(onFocusoutPrevented),
                     onReleaseRequested: vue.unref(onCloseRequested)
                   }, {
                     default: vue.withCtx(() => [
@@ -30048,7 +30044,7 @@
                         "aria-labelledby": !_ctx.title ? vue.unref(titleId) : void 0,
                         "aria-describedby": vue.unref(bodyId)
                       }, _ctx.$attrs, {
-                        class: [vue.unref(ns).b(), _ctx.direction, vue.unref(visible) && "open", _ctx.customClass],
+                        class: [vue.unref(ns).b(), _ctx.direction, vue.unref(visible) && "open"],
                         style: vue.unref(isHorizontal) ? "width: " + vue.unref(drawerSize) : "height: " + vue.unref(drawerSize),
                         role: "dialog",
                         onClick: _cache[1] || (_cache[1] = vue.withModifiers(() => {
@@ -30113,7 +30109,7 @@
                       ], 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"]), [
@@ -33221,19 +33217,26 @@
           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;
           }
@@ -33762,10 +33765,10 @@
     const select = vue.inject(selectKey);
     const selectGroup = vue.inject(selectGroupKey, { disabled: false });
     const itemSelected = vue.computed(() => {
-      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 = vue.computed(() => {
@@ -34476,8 +34479,6 @@
     const toggleMenu = () => {
       if (selectDisabled.value)
         return;
-      if (props.filterable && props.remote && isFunction$1(props.remoteMethod))
-        return;
       if (states.menuVisibleOnFocus) {
         states.menuVisibleOnFocus = false;
       } else {
@@ -35151,11 +35152,13 @@
         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));
             }
           });
         }
@@ -39447,8 +39450,6 @@
     const toggleMenu = () => {
       if (selectDisabled.value)
         return;
-      if (props.filterable && props.remote && isFunction$1(props.remoteMethod))
-        return;
       if (states.menuVisibleOnFocus) {
         states.menuVisibleOnFocus = false;
       } else {
@@ -42594,7 +42595,7 @@
         removePopper == null ? void 0 : removePopper();
       }
     });
-    vm.appContext = table.appContext;
+    vm.appContext = { ...table.appContext, ...table };
     const container = document.createElement("div");
     vue.render(vm, container);
     vm.component.exposed.onOpen();
@@ -49289,6 +49290,14 @@
         ref: "https://element-plus.org/en-US/component/tabs.html#attributes",
         type: "Attribute"
       }, vue.computed(() => !!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"
+      }, vue.computed(() => !!slots.addIcon));
       vue.watch(() => props.activeName, (modelValue) => setCurrentName(modelValue));
       vue.watch(() => props.modelValue, (modelValue) => setCurrentName(modelValue));
       vue.watch(currentName, async () => {
@@ -49306,7 +49315,8 @@
         currentName
       });
       return () => {
-        const addSlot = slots.addIcon;
+        const addSlot = slots["add-icon"] || slots["addIcon"];
+        const isCamelCase = addSlot && slots["addIcon"];
         const newButton = props.editable || props.addable ? vue.createVNode("span", {
           "class": ns.e("new-tab"),
           "tabindex": "0",
@@ -49315,7 +49325,7 @@
             if (ev.code === EVENT_CODE.enter)
               handleTabAdd();
           }
-        }, [addSlot ? vue.renderSlot(slots, "addIcon") : vue.createVNode(ElIcon, {
+        }, [addSlot ? vue.renderSlot(slots, isCamelCase ? "addIcon" : "add-icon") : vue.createVNode(ElIcon, {
           "class": ns.is("icon-plus")
         }, {
           default: () => [vue.createVNode(plus_default, null, null)]
@@ -53934,6 +53944,9 @@
     onExceed: {
       type: definePropType(Function),
       default: NOOP
+    },
+    crossorigin: {
+      type: definePropType(String)
     }
   });
 
@@ -53954,6 +53967,9 @@
       type: String,
       values: uploadListTypes,
       default: "text"
+    },
+    crossorigin: {
+      type: definePropType(String)
     }
   });
   const uploadListEmits = {
@@ -53961,7 +53977,7 @@
   };
 
   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"];
@@ -54015,6 +54031,7 @@
                     key: 0,
                     class: vue.normalizeClass(vue.unref(nsUpload).be("list", "item-thumbnail")),
                     src: file.url,
+                    crossorigin: _ctx.crossorigin,
                     alt: ""
                   }, null, 10, _hoisted_2$5)) : vue.createCommentVNode("v-if", true),
                   file.status === "uploading" || _ctx.listType !== "picture-card" ? (vue.openBlock(), vue.createElementBlock("div", {
@@ -54598,6 +54615,7 @@
             disabled: vue.unref(disabled),
             "list-type": _ctx.listType,
             files: vue.unref(uploadFiles),
+            crossorigin: _ctx.crossorigin,
             "handle-preview": _ctx.onPreview,
             onRemove: vue.unref(handleRemove)
           }, vue.createSlots({
@@ -54621,7 +54639,7 @@
                 vue.renderSlot(_ctx.$slots, "file", { file })
               ])
             } : void 0
-          ]), 1032, ["disabled", "list-type", "files", "handle-preview", "onRemove"])) : vue.createCommentVNode("v-if", true),
+          ]), 1032, ["disabled", "list-type", "files", "crossorigin", "handle-preview", "onRemove"])) : vue.createCommentVNode("v-if", true),
           !vue.unref(isPictureCard) || vue.unref(isPictureCard) && !_ctx.showFileList ? (vue.openBlock(), vue.createBlock(UploadContent, vue.mergeProps({
             key: 1,
             ref_key: "uploadRef",
@@ -54640,6 +54658,7 @@
             disabled: vue.unref(disabled),
             "list-type": _ctx.listType,
             files: vue.unref(uploadFiles),
+            crossorigin: _ctx.crossorigin,
             "handle-preview": _ctx.onPreview,
             onRemove: vue.unref(handleRemove)
           }, vue.createSlots({ _: 2 }, [
@@ -54649,7 +54668,7 @@
                 vue.renderSlot(_ctx.$slots, "file", { file })
               ])
             } : void 0
-          ]), 1032, ["disabled", "list-type", "files", "handle-preview", "onRemove"])) : vue.createCommentVNode("v-if", true)
+          ]), 1032, ["disabled", "list-type", "files", "crossorigin", "handle-preview", "onRemove"])) : vue.createCommentVNode("v-if", true)
         ]);
       };
     }
@@ -55110,48 +55129,6 @@
     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 (!vue.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 = vue.camelize(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 = vue.ref();
     const y = vue.ref();
@@ -55443,14 +55420,14 @@
         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;
@@ -55458,18 +55435,17 @@
             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];
@@ -55554,39 +55530,44 @@
     setup(__props, { emit }) {
       const props = __props;
       const ns = useNamespace("tour");
-      const steps = vue.ref([]);
+      const total = vue.ref(0);
+      const currentStep = vue.ref();
       const current = useVModel(props, "current", emit, {
         passive: true
       });
-      const total = vue.computed(() => steps.value.length);
-      const currentStep = vue.computed(() => steps.value[current.value] || {});
-      const currentTarget = vue.computed(() => currentStep.value.target);
+      const currentTarget = vue.computed(() => {
+        var _a;
+        return (_a = currentStep.value) == null ? void 0 : _a.target;
+      });
       const kls = vue.computed(() => [
         ns.b(),
         mergedType.value === "primary" ? ns.m("primary") : ""
       ]);
-      const mergedPlacement = vue.computed(() => currentStep.value.placement || props.placement);
-      const mergedContentStyle = vue.computed(() => {
+      const mergedPlacement = vue.computed(() => {
         var _a;
-        return (_a = currentStep.value.contentStyle) != null ? _a : props.contentStyle;
+        return ((_a = currentStep.value) == null ? void 0 : _a.placement) || props.placement;
+      });
+      const mergedContentStyle = vue.computed(() => {
+        var _a, _b;
+        return (_b = (_a = currentStep.value) == null ? void 0 : _a.contentStyle) != null ? _b : props.contentStyle;
       });
       const mergedMask = vue.computed(() => {
-        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 = vue.computed(() => !!mergedMask.value && props.modelValue);
       const mergedMaskStyle = vue.computed(() => isBoolean(mergedMask.value) ? void 0 : mergedMask.value);
       const mergedShowArrow = vue.computed(() => {
-        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 = vue.computed(() => {
-        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 = vue.computed(() => {
-        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();
@@ -55600,17 +55581,18 @@
           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 = vue.useSlots();
       vue.provide(tourKey, {
+        currentStep,
         current,
         total,
         showClose: vue.toRef(props, "showClose"),
@@ -55656,7 +55638,7 @@
                 default: vue.withCtx(() => [
                   vue.createVNode(vue.unref(ElTourSteps), {
                     current: vue.unref(current),
-                    onUpdateSteps
+                    onUpdateTotal
                   }, {
                     default: vue.withCtx(() => [
                       vue.renderSlot(_ctx.$slots, "default")
@@ -55684,18 +55666,19 @@
     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])
@@ -55707,7 +55690,8 @@
       type: definePropType(Object)
     },
     scrollIntoViewOptions: {
-      type: definePropType([Boolean, Object])
+      type: definePropType([Boolean, Object]),
+      default: void 0
     },
     type: {
       type: definePropType(String)
@@ -55729,6 +55713,7 @@
       const { Close } = CloseComponents;
       const { t } = useLocale();
       const {
+        currentStep,
         current,
         total,
         showClose,
@@ -55741,6 +55726,11 @@
         onFinish: tourOnFinish,
         onChange
       } = vue.inject(tourKey);
+      vue.watch(props, (val) => {
+        currentStep.value = val;
+      }, {
+        immediate: true
+      });
       const mergedShowClose = vue.computed(() => {
         var _a;
         return (_a = props.showClose) != null ? _a : showClose.value;
@@ -55749,6 +55739,11 @@
         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;
@@ -55797,7 +55792,7 @@
             }, 8, ["class"])
           ], 2)) : vue.createCommentVNode("v-if", true),
           vue.createElementVNode("header", {
-            class: vue.normalizeClass(vue.unref(ns).e("header"))
+            class: vue.normalizeClass([vue.unref(ns).e("header"), { "show-close": vue.unref(showClose) }])
           }, [
             vue.renderSlot(_ctx.$slots, "header", {}, () => [
               vue.createElementVNode("span", {
@@ -55837,7 +55832,7 @@
                 key: 0,
                 size: "small",
                 type: vue.unref(mergedType)
-              }, _ctx.prevButtonProps, { onClick: onPrev }), {
+              }, filterButtonProps(_ctx.prevButtonProps), { onClick: onPrev }), {
                 default: vue.withCtx(() => {
                   var _a, _b;
                   return [
@@ -55850,11 +55845,11 @@
                 key: 1,
                 size: "small",
                 type: vue.unref(mergedType) === "primary" ? "default" : "primary"
-              }, _ctx.nextButtonProps, { onClick: onNext }), {
+              }, filterButtonProps(_ctx.nextButtonProps), { onClick: onNext }), {
                 default: vue.withCtx(() => {
                   var _a, _b;
                   return [
-                    vue.createTextVNode(vue.toDisplayString(((_b = (_a = _ctx.nextButtonProps) == null ? void 0 : _a.children) != null ? _b : vue.unref(current) === vue.unref(total) - 1) ? vue.unref(t)("el.tour.finish") : vue.unref(t)("el.tour.next")), 1)
+                    vue.createTextVNode(vue.toDisplayString((_b = (_a = _ctx.nextButtonProps) == null ? void 0 : _a.children) != null ? _b : vue.unref(current) === vue.unref(total) - 1 ? vue.unref(t)("el.tour.finish") : vue.unref(t)("el.tour.next")), 1)
                   ];
                 }),
                 _: 1
@@ -56775,6 +56770,7 @@
       },
       center: Boolean,
       draggable: Boolean,
+      overflow: Boolean,
       roundButton: {
         default: false,
         type: Boolean
@@ -56885,7 +56881,8 @@
         }
       });
       const draggable = vue.computed(() => props.draggable);
-      useDraggable(rootRef, headerRef, draggable);
+      const overflow = vue.computed(() => props.overflow);
+      useDraggable(rootRef, headerRef, draggable, overflow);
       vue.onMounted(async () => {
         await vue.nextTick();
         if (props.closeOnHashChange) {
@@ -57055,7 +57052,7 @@
                     _ctx.title !== null && _ctx.title !== void 0 ? (vue.openBlock(), vue.createElementBlock("div", {
                       key: 0,
                       ref: "headerRef",
-                      class: vue.normalizeClass(_ctx.ns.e("header"))
+                      class: vue.normalizeClass([_ctx.ns.e("header"), { "show-close": _ctx.showClose }])
                     }, [
                       vue.createElementVNode("div", {
                         class: vue.normalizeClass(_ctx.ns.e("title"))