vant 4.8.0 → 4.8.2

package/lib/tree-select/TreeSelect.d.ts

@@ -65,7 +65,7 @@ declare const _default: import("vue").DefineComponent<{
         type: PropType<Numeric | Numeric[]>;
         default: number;
     };
-}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("clickItem" | "clickNav" | "update:activeId" | "update:mainActiveIndex")[], "clickItem" | "clickNav" | "update:activeId" | "update:mainActiveIndex", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
+}, () => import("vue/jsx-runtime").JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("clickItem" | "clickNav" | "update:activeId" | "update:mainActiveIndex")[], "clickItem" | "clickNav" | "update:activeId" | "update:mainActiveIndex", import("vue").PublicProps, Readonly<ExtractPropTypes<{
     max: {
         type: (NumberConstructor | StringConstructor)[];
         default: number;

package/lib/tree-select/index.css

@@ -1 +1 @@
-:root{--van-tree-select-font-size: var(--van-font-size-md);--van-tree-select-nav-background: var(--van-background);--van-tree-select-content-background: var(--van-background-2);--van-tree-select-nav-item-padding: 14px var(--van-padding-sm);--van-tree-select-item-height: 48px;--van-tree-select-item-active-color: var(--van-primary-color);--van-tree-select-item-disabled-color: var(--van-gray-5);--van-tree-select-item-selected-size: 16px}.van-tree-select{position:relative;display:flex;font-size:var(--van-tree-select-font-size)}.van-tree-select__nav{flex:1;overflow-y:auto;background:var(--van-tree-select-nav-background);-webkit-overflow-scrolling:touch}.van-tree-select__nav-item{padding:var(--van-tree-select-nav-item-padding)}.van-tree-select__content{flex:2;overflow-y:auto;background:var(--van-tree-select-content-background);-webkit-overflow-scrolling:touch}.van-tree-select__item{position:relative;padding:0 32px 0 var(--van-padding-md);font-weight:var(--van-font-bold);line-height:var(--van-tree-select-item-height);-webkit-user-select:none;user-select:none;cursor:pointer}.van-tree-select__item--active{color:var(--van-tree-select-item-active-color)}.van-tree-select__item:active{background-color:var(--van-active-color)}.van-tree-select__item--disabled{color:var(--van-tree-select-item-disabled-color);cursor:not-allowed}.van-tree-select__item--disabled:active{background-color:transparent}.van-tree-select__selected{position:absolute;top:50%;right:var(--van-padding-md);margin-top:calc(var(--van-padding-xs) * -1);font-size:var(--van-tree-select-item-selected-size)}
+:root,:host{--van-tree-select-font-size: var(--van-font-size-md);--van-tree-select-nav-background: var(--van-background);--van-tree-select-content-background: var(--van-background-2);--van-tree-select-nav-item-padding: 14px var(--van-padding-sm);--van-tree-select-item-height: 48px;--van-tree-select-item-active-color: var(--van-primary-color);--van-tree-select-item-disabled-color: var(--van-gray-5);--van-tree-select-item-selected-size: 16px}.van-tree-select{position:relative;display:flex;font-size:var(--van-tree-select-font-size)}.van-tree-select__nav{flex:1;overflow-y:auto;background:var(--van-tree-select-nav-background);-webkit-overflow-scrolling:touch}.van-tree-select__nav-item{padding:var(--van-tree-select-nav-item-padding)}.van-tree-select__content{flex:2;overflow-y:auto;background:var(--van-tree-select-content-background);-webkit-overflow-scrolling:touch}.van-tree-select__item{position:relative;padding:0 32px 0 var(--van-padding-md);font-weight:var(--van-font-bold);line-height:var(--van-tree-select-item-height);-webkit-user-select:none;user-select:none;cursor:pointer}.van-tree-select__item--active{color:var(--van-tree-select-item-active-color)}.van-tree-select__item:active{background-color:var(--van-active-color)}.van-tree-select__item--disabled{color:var(--van-tree-select-item-disabled-color);cursor:not-allowed}.van-tree-select__item--disabled:active{background-color:transparent}.van-tree-select__selected{position:absolute;top:50%;right:var(--van-padding-md);margin-top:calc(var(--van-padding-xs) * -1);font-size:var(--van-tree-select-item-selected-size)}

package/lib/tree-select/index.d.ts

@@ -23,7 +23,7 @@ export declare const TreeSelect: import("../utils").WithInstall<import("vue").De
         type: import("vue").PropType<import("../utils").Numeric | import("../utils").Numeric[]>;
         default: number;
     };
-}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("clickItem" | "clickNav" | "update:activeId" | "update:mainActiveIndex")[], "clickItem" | "clickNav" | "update:activeId" | "update:mainActiveIndex", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+}, () => import("vue/jsx-runtime").JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("clickItem" | "clickNav" | "update:activeId" | "update:mainActiveIndex")[], "clickItem" | "clickNav" | "update:activeId" | "update:mainActiveIndex", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     max: {
         type: (NumberConstructor | StringConstructor)[];
         default: number;

package/lib/uploader/Uploader.d.ts

@@ -127,7 +127,7 @@ declare const _default: import("vue").DefineComponent<{
         type: PropType<UploaderMaxSize>;
         default: number;
     };
-}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "delete" | "oversize" | "clickUpload" | "closePreview" | "clickPreview" | "clickReupload")[], "update:modelValue" | "delete" | "oversize" | "clickUpload" | "closePreview" | "clickPreview" | "clickReupload", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<ExtractPropTypes<{
+}, () => import("vue/jsx-runtime").JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("delete" | "update:modelValue" | "oversize" | "clickUpload" | "closePreview" | "clickPreview" | "clickReupload")[], "delete" | "update:modelValue" | "oversize" | "clickUpload" | "closePreview" | "clickPreview" | "clickReupload", import("vue").PublicProps, Readonly<ExtractPropTypes<{
     name: {
         type: (NumberConstructor | StringConstructor)[];
         default: string;

package/lib/uploader/UploaderPreviewItem.d.ts

@@ -15,7 +15,7 @@ declare const _default: import("vue").DefineComponent<{
     reupload: BooleanConstructor;
     previewSize: PropType<Numeric | [Numeric, Numeric]>;
     beforeDelete: PropType<Interceptor>;
-}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("delete" | "reupload" | "preview")[], "delete" | "reupload" | "preview", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+}, () => import("vue/jsx-runtime").JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("delete" | "reupload" | "preview")[], "delete" | "reupload" | "preview", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     name: (NumberConstructor | StringConstructor)[];
     item: {
         type: PropType<UploaderFileListItem>;

package/lib/uploader/index.css

@@ -1 +1 @@
-:root{--van-uploader-size: 80px;--van-uploader-icon-size: 24px;--van-uploader-icon-color: var(--van-gray-4);--van-uploader-text-color: var(--van-text-color-2);--van-uploader-text-font-size: var(--van-font-size-sm);--van-uploader-upload-background: var(--van-gray-1);--van-uploader-upload-active-color: var(--van-active-color);--van-uploader-delete-color: var(--van-white);--van-uploader-delete-icon-size: 14px;--van-uploader-delete-background: rgba(0, 0, 0, .7);--van-uploader-file-background: var(--van-background);--van-uploader-file-icon-size: 20px;--van-uploader-file-icon-color: var(--van-gray-7);--van-uploader-file-name-padding: 0 var(--van-padding-base);--van-uploader-file-name-margin-top: var(--van-padding-xs);--van-uploader-file-name-font-size: var(--van-font-size-sm);--van-uploader-file-name-text-color: var(--van-gray-7);--van-uploader-mask-text-color: var(--van-white);--van-uploader-mask-background: rgba(50, 50, 51, .88);--van-uploader-mask-icon-size: 22px;--van-uploader-mask-message-font-size: var(--van-font-size-sm);--van-uploader-mask-message-line-height: var(--van-line-height-xs);--van-uploader-loading-icon-size: 22px;--van-uploader-loading-icon-color: var(--van-white);--van-uploader-disabled-opacity: var(--van-disabled-opacity);--van-uploader-border-radius: 0px}.van-uploader{position:relative;display:inline-block}.van-uploader__wrapper{display:flex;flex-wrap:wrap}.van-uploader__wrapper--disabled{opacity:var(--van-uploader-disabled-opacity)}.van-uploader__input{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;cursor:pointer;opacity:0}.van-uploader__input-wrapper{position:relative}.van-uploader__input:disabled{cursor:not-allowed}.van-uploader__upload{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box;width:var(--van-uploader-size);height:var(--van-uploader-size);margin:0 var(--van-padding-xs) var(--van-padding-xs) 0;background:var(--van-uploader-upload-background);border-radius:var(--van-uploader-border-radius)}.van-uploader__upload:active{background-color:var(--van-uploader-upload-active-color)}.van-uploader__upload--readonly:active{background-color:var(--van-uploader-upload-background)}.van-uploader__upload-icon{color:var(--van-uploader-icon-color);font-size:var(--van-uploader-icon-size)}.van-uploader__upload-text{margin-top:var(--van-padding-xs);color:var(--van-uploader-text-color);font-size:var(--van-uploader-text-font-size)}.van-uploader__preview{position:relative;margin:0 var(--van-padding-xs) var(--van-padding-xs) 0;cursor:pointer}.van-uploader__preview-image{display:block;width:var(--van-uploader-size);height:var(--van-uploader-size);overflow:hidden;border-radius:var(--van-uploader-border-radius)}.van-uploader__preview-delete{position:absolute;top:0;right:0}.van-uploader__preview-delete--shadow{width:var(--van-uploader-delete-icon-size);height:var(--van-uploader-delete-icon-size);background:var(--van-uploader-delete-background);border-radius:0 0 0 12px}.van-uploader__preview-delete-icon{position:absolute;top:0;right:0;color:var(--van-uploader-delete-color);font-size:var(--van-uploader-delete-icon-size);transform:scale(.7) translate(10%,-10%)}.van-uploader__preview-cover{position:absolute;top:0;right:0;bottom:0;left:0}.van-uploader__mask{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--van-uploader-mask-text-color);background:var(--van-uploader-mask-background);border-radius:var(--van-uploader-border-radius)}.van-uploader__mask-icon{font-size:var(--van-uploader-mask-icon-size)}.van-uploader__mask-message{margin-top:6px;padding:0 var(--van-padding-base);font-size:var(--van-uploader-mask-message-font-size);line-height:var(--van-uploader-mask-message-line-height)}.van-uploader__loading{width:var(--van-uploader-loading-icon-size);height:var(--van-uploader-loading-icon-size);color:var(--van-uploader-loading-icon-color)}.van-uploader__file{display:flex;flex-direction:column;align-items:center;justify-content:center;width:var(--van-uploader-size);height:var(--van-uploader-size);background:var(--van-uploader-file-background)}.van-uploader__file-icon{color:var(--van-uploader-file-icon-color);font-size:var(--van-uploader-file-icon-size)}.van-uploader__file-name{box-sizing:border-box;width:100%;margin-top:var(--van-uploader-file-name-margin-top);padding:var(--van-uploader-file-name-padding);color:var(--van-uploader-file-name-text-color);font-size:var(--van-uploader-file-name-font-size);text-align:center}
+:root,:host{--van-uploader-size: 80px;--van-uploader-icon-size: 24px;--van-uploader-icon-color: var(--van-gray-4);--van-uploader-text-color: var(--van-text-color-2);--van-uploader-text-font-size: var(--van-font-size-sm);--van-uploader-upload-background: var(--van-gray-1);--van-uploader-upload-active-color: var(--van-active-color);--van-uploader-delete-color: var(--van-white);--van-uploader-delete-icon-size: 14px;--van-uploader-delete-background: rgba(0, 0, 0, .7);--van-uploader-file-background: var(--van-background);--van-uploader-file-icon-size: 20px;--van-uploader-file-icon-color: var(--van-gray-7);--van-uploader-file-name-padding: 0 var(--van-padding-base);--van-uploader-file-name-margin-top: var(--van-padding-xs);--van-uploader-file-name-font-size: var(--van-font-size-sm);--van-uploader-file-name-text-color: var(--van-gray-7);--van-uploader-mask-text-color: var(--van-white);--van-uploader-mask-background: rgba(50, 50, 51, .88);--van-uploader-mask-icon-size: 22px;--van-uploader-mask-message-font-size: var(--van-font-size-sm);--van-uploader-mask-message-line-height: var(--van-line-height-xs);--van-uploader-loading-icon-size: 22px;--van-uploader-loading-icon-color: var(--van-white);--van-uploader-disabled-opacity: var(--van-disabled-opacity);--van-uploader-border-radius: 0px}.van-uploader{position:relative;display:inline-block}.van-uploader__wrapper{display:flex;flex-wrap:wrap}.van-uploader__wrapper--disabled{opacity:var(--van-uploader-disabled-opacity)}.van-uploader__input{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;cursor:pointer;opacity:0}.van-uploader__input-wrapper{position:relative}.van-uploader__input:disabled{cursor:not-allowed}.van-uploader__upload{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box;width:var(--van-uploader-size);height:var(--van-uploader-size);margin:0 var(--van-padding-xs) var(--van-padding-xs) 0;background:var(--van-uploader-upload-background);border-radius:var(--van-uploader-border-radius)}.van-uploader__upload:active{background-color:var(--van-uploader-upload-active-color)}.van-uploader__upload--readonly:active{background-color:var(--van-uploader-upload-background)}.van-uploader__upload-icon{color:var(--van-uploader-icon-color);font-size:var(--van-uploader-icon-size)}.van-uploader__upload-text{margin-top:var(--van-padding-xs);color:var(--van-uploader-text-color);font-size:var(--van-uploader-text-font-size)}.van-uploader__preview{position:relative;margin:0 var(--van-padding-xs) var(--van-padding-xs) 0;cursor:pointer}.van-uploader__preview-image{display:block;width:var(--van-uploader-size);height:var(--van-uploader-size);overflow:hidden;border-radius:var(--van-uploader-border-radius)}.van-uploader__preview-delete{position:absolute;top:0;right:0}.van-uploader__preview-delete--shadow{width:var(--van-uploader-delete-icon-size);height:var(--van-uploader-delete-icon-size);background:var(--van-uploader-delete-background);border-radius:0 0 0 12px}.van-uploader__preview-delete-icon{position:absolute;top:0;right:0;color:var(--van-uploader-delete-color);font-size:var(--van-uploader-delete-icon-size);transform:scale(.7) translate(10%,-10%)}.van-uploader__preview-cover{position:absolute;top:0;right:0;bottom:0;left:0}.van-uploader__mask{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--van-uploader-mask-text-color);background:var(--van-uploader-mask-background);border-radius:var(--van-uploader-border-radius)}.van-uploader__mask-icon{font-size:var(--van-uploader-mask-icon-size)}.van-uploader__mask-message{margin-top:6px;padding:0 var(--van-padding-base);font-size:var(--van-uploader-mask-message-font-size);line-height:var(--van-uploader-mask-message-line-height)}.van-uploader__loading{width:var(--van-uploader-loading-icon-size);height:var(--van-uploader-loading-icon-size);color:var(--van-uploader-loading-icon-color)}.van-uploader__file{display:flex;flex-direction:column;align-items:center;justify-content:center;width:var(--van-uploader-size);height:var(--van-uploader-size);background:var(--van-uploader-file-background)}.van-uploader__file-icon{color:var(--van-uploader-file-icon-color);font-size:var(--van-uploader-file-icon-size)}.van-uploader__file-name{box-sizing:border-box;width:100%;margin-top:var(--van-uploader-file-name-margin-top);padding:var(--van-uploader-file-name-padding);color:var(--van-uploader-file-name-text-color);font-size:var(--van-uploader-file-name-font-size);text-align:center}

package/lib/uploader/index.d.ts

@@ -60,7 +60,7 @@ export declare const Uploader: import("../utils").WithInstall<import("vue").Defi
         type: import("vue").PropType<import("./types").UploaderMaxSize>;
         default: number;
     };
-}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("update:modelValue" | "delete" | "oversize" | "clickUpload" | "closePreview" | "clickPreview" | "clickReupload")[], "update:modelValue" | "delete" | "oversize" | "clickUpload" | "closePreview" | "clickPreview" | "clickReupload", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+}, () => import("vue/jsx-runtime").JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("delete" | "update:modelValue" | "oversize" | "clickUpload" | "closePreview" | "clickPreview" | "clickReupload")[], "delete" | "update:modelValue" | "oversize" | "clickUpload" | "closePreview" | "clickPreview" | "clickReupload", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     name: {
         type: (NumberConstructor | StringConstructor)[];
         default: string;

package/lib/utils/dom.d.ts

@@ -10,3 +10,4 @@ export declare const stopPropagation: (event: Event) => void;
 export declare function preventDefault(event: Event, isStopPropagation?: boolean): void;
 export declare function isHidden(elementRef: HTMLElement | Ref<HTMLElement | undefined>): boolean;
 export declare const windowWidth: Ref<number>, windowHeight: Ref<number>;
+export declare function getContainingBlock(el: Element): HTMLElement | null;

package/lib/utils/dom.js

@@ -17,6 +17,7 @@ var __copyProps = (to, from, except, desc) => {
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var stdin_exports = {};
 __export(stdin_exports, {
+  getContainingBlock: () => getContainingBlock,
   getElementTop: () => getElementTop,
   getRootScrollTop: () => getRootScrollTop,
   getScrollTop: () => getScrollTop,
@@ -84,3 +85,19 @@ function isHidden(elementRef) {
   return hidden || parentHidden;
 }
 const { width: windowWidth, height: windowHeight } = (0, import_use.useWindowSize)();
+function isContainingBlock(el) {
+  const css = window.getComputedStyle(el);
+  return css.transform !== "none" || css.perspective !== "none" || ["transform", "perspective", "filter"].some(
+    (value) => (css.willChange || "").includes(value)
+  );
+}
+function getContainingBlock(el) {
+  let node = el.parentElement;
+  while (node) {
+    if (node && node.tagName !== "HTML" && node.tagName !== "BODY" && isContainingBlock(node)) {
+      return node;
+    }
+    node = node.parentElement;
+  }
+  return null;
+}

package/lib/vant.cjs.js

@@ -118,6 +118,22 @@ function isHidden(elementRef) {
   return hidden || parentHidden;
 }
 const { width: windowWidth, height: windowHeight } = use.useWindowSize();
+function isContainingBlock(el) {
+  const css = window.getComputedStyle(el);
+  return css.transform !== "none" || css.perspective !== "none" || ["transform", "perspective", "filter"].some(
+    (value) => (css.willChange || "").includes(value)
+  );
+}
+function getContainingBlock(el) {
+  let node = el.parentElement;
+  while (node) {
+    if (node && node.tagName !== "HTML" && node.tagName !== "BODY" && isContainingBlock(node)) {
+      return node;
+    }
+    node = node.parentElement;
+  }
+  return null;
+}
 function addUnit(value) {
   if (isDef(value)) {
     return isNumeric(value) ? `${value}px` : String(value);
@@ -9543,6 +9559,7 @@ const dropdownMenuProps = {
   duration: makeNumericProp(0.2),
   direction: makeStringProp("down"),
   activeColor: String,
+  autoLocate: Boolean,
   closeOnClickOutside: truthProp,
   closeOnClickOverlay: truthProp,
   swipeThreshold: numericProp
@@ -9698,6 +9715,7 @@ var stdin_default$T = vue.defineComponent({
       transition: true,
       showWrapper: false
     });
+    const wrapperRef = vue.ref();
     const {
       parent,
       index
@@ -9786,6 +9804,7 @@ var stdin_default$T = vue.defineComponent({
         offset
       } = parent;
       const {
+        autoLocate,
         zIndex,
         overlay,
         duration,
@@ -9793,12 +9812,20 @@ var stdin_default$T = vue.defineComponent({
         closeOnClickOverlay
       } = parent.props;
       const style = getZIndexStyle(zIndex);
+      let offsetValue = offset.value;
+      if (autoLocate && wrapperRef.value) {
+        const offsetParent = getContainingBlock(wrapperRef.value);
+        if (offsetParent) {
+          offsetValue -= use.useRect(offsetParent).top;
+        }
+      }
       if (direction === "down") {
-        style.top = `${offset.value}px`;
+        style.top = `${offsetValue}px`;
       } else {
-        style.bottom = `${offset.value}px`;
+        style.bottom = `${offsetValue}px`;
       }
       return vue.withDirectives(vue.createVNode("div", vue.mergeProps({
+        "ref": wrapperRef,
         "style": style,
         "class": bem$K([direction]),
         "onClick": onClickWrapper
@@ -10607,18 +10634,20 @@ var stdin_default$N = vue.defineComponent({
         }
       }
     };
-    const checkTap = (event) => {
+    const checkClose = (event) => {
       var _a;
+      const isClickOverlay = event.target === ((_a = swipeItem.value) == null ? void 0 : _a.$el);
+      if (!props2.closeOnClickOverlay && isClickOverlay)
+        return;
+      emit("close");
+    };
+    const checkTap = (event) => {
       if (fingerNum > 1) {
         return;
       }
-      const {
-        offsetX,
-        offsetY
-      } = touch;
       const deltaTime = Date.now() - touchStartTime;
       const TAP_TIME = 250;
-      if (offsetX.value < TAP_OFFSET && offsetY.value < TAP_OFFSET) {
+      if (touch.isTap.value) {
         if (deltaTime < TAP_TIME) {
           if (props2.doubleScale) {
             if (doubleTapTimer) {
@@ -10626,16 +10655,13 @@ var stdin_default$N = vue.defineComponent({
               doubleTapTimer = null;
               toggleScale();
             } else {
-              if (!props2.closeOnClickOverlay && event.target === ((_a = swipeItem.value) == null ? void 0 : _a.$el)) {
-                return;
-              }
               doubleTapTimer = setTimeout(() => {
-                emit("close");
+                checkClose(event);
                 doubleTapTimer = null;
               }, TAP_TIME);
             }
           } else {
-            emit("close");
+            checkClose(event);
           }
         } else if (deltaTime > LONG_PRESS_START_TIME) {
           emit("longPress");
@@ -15048,8 +15074,11 @@ var stdin_default$9 = vue.defineComponent({
       }
       document.body.removeChild(container);
     };
+    const toggle = (isExpanded = !expanded.value) => {
+      expanded.value = isExpanded;
+    };
     const onClickAction = (event) => {
-      expanded.value = !expanded.value;
+      toggle();
       emit("clickAction", event);
     };
     const renderAction = () => vue.createVNode("span", {
@@ -15057,8 +15086,10 @@ var stdin_default$9 = vue.defineComponent({
       "onClick": onClickAction
     }, [actionText.value]);
     vue.onMounted(calcEllipsised);
-    vue.watch(() => [props2.content, props2.rows, props2.position], calcEllipsised);
-    use.useEventListener("resize", calcEllipsised);
+    vue.watch([windowWidth, () => [props2.content, props2.rows, props2.position]], calcEllipsised);
+    useExpose({
+      toggle
+    });
     return () => vue.createVNode("div", {
       "ref": root,
       "class": bem$3()
@@ -16725,7 +16756,7 @@ const Lazyload = {
     });
   }
 };
-const version = "4.8.0";
+const version = "4.8.2";
 function install(app) {
   const components = [
     ActionBar,

package/lib/vant.es.js

@@ -116,6 +116,22 @@ function isHidden(elementRef) {
   return hidden || parentHidden;
 }
 const { width: windowWidth, height: windowHeight } = useWindowSize();
+function isContainingBlock(el) {
+  const css = window.getComputedStyle(el);
+  return css.transform !== "none" || css.perspective !== "none" || ["transform", "perspective", "filter"].some(
+    (value) => (css.willChange || "").includes(value)
+  );
+}
+function getContainingBlock(el) {
+  let node = el.parentElement;
+  while (node) {
+    if (node && node.tagName !== "HTML" && node.tagName !== "BODY" && isContainingBlock(node)) {
+      return node;
+    }
+    node = node.parentElement;
+  }
+  return null;
+}
 function addUnit(value) {
   if (isDef(value)) {
     return isNumeric(value) ? `${value}px` : String(value);
@@ -9541,6 +9557,7 @@ const dropdownMenuProps = {
   duration: makeNumericProp(0.2),
   direction: makeStringProp("down"),
   activeColor: String,
+  autoLocate: Boolean,
   closeOnClickOutside: truthProp,
   closeOnClickOverlay: truthProp,
   swipeThreshold: numericProp
@@ -9696,6 +9713,7 @@ var stdin_default$T = defineComponent({
       transition: true,
       showWrapper: false
     });
+    const wrapperRef = ref();
     const {
       parent,
       index
@@ -9784,6 +9802,7 @@ var stdin_default$T = defineComponent({
         offset
       } = parent;
       const {
+        autoLocate,
         zIndex,
         overlay,
         duration,
@@ -9791,12 +9810,20 @@ var stdin_default$T = defineComponent({
         closeOnClickOverlay
       } = parent.props;
       const style = getZIndexStyle(zIndex);
+      let offsetValue = offset.value;
+      if (autoLocate && wrapperRef.value) {
+        const offsetParent = getContainingBlock(wrapperRef.value);
+        if (offsetParent) {
+          offsetValue -= useRect(offsetParent).top;
+        }
+      }
       if (direction === "down") {
-        style.top = `${offset.value}px`;
+        style.top = `${offsetValue}px`;
       } else {
-        style.bottom = `${offset.value}px`;
+        style.bottom = `${offsetValue}px`;
       }
       return withDirectives(createVNode("div", mergeProps({
+        "ref": wrapperRef,
         "style": style,
         "class": bem$K([direction]),
         "onClick": onClickWrapper
@@ -10605,18 +10632,20 @@ var stdin_default$N = defineComponent({
         }
       }
     };
-    const checkTap = (event) => {
+    const checkClose = (event) => {
       var _a;
+      const isClickOverlay = event.target === ((_a = swipeItem.value) == null ? void 0 : _a.$el);
+      if (!props2.closeOnClickOverlay && isClickOverlay)
+        return;
+      emit("close");
+    };
+    const checkTap = (event) => {
       if (fingerNum > 1) {
         return;
       }
-      const {
-        offsetX,
-        offsetY
-      } = touch;
       const deltaTime = Date.now() - touchStartTime;
       const TAP_TIME = 250;
-      if (offsetX.value < TAP_OFFSET && offsetY.value < TAP_OFFSET) {
+      if (touch.isTap.value) {
         if (deltaTime < TAP_TIME) {
           if (props2.doubleScale) {
             if (doubleTapTimer) {
@@ -10624,16 +10653,13 @@ var stdin_default$N = defineComponent({
               doubleTapTimer = null;
               toggleScale();
             } else {
-              if (!props2.closeOnClickOverlay && event.target === ((_a = swipeItem.value) == null ? void 0 : _a.$el)) {
-                return;
-              }
               doubleTapTimer = setTimeout(() => {
-                emit("close");
+                checkClose(event);
                 doubleTapTimer = null;
               }, TAP_TIME);
             }
           } else {
-            emit("close");
+            checkClose(event);
           }
         } else if (deltaTime > LONG_PRESS_START_TIME) {
           emit("longPress");
@@ -15046,8 +15072,11 @@ var stdin_default$9 = defineComponent({
       }
       document.body.removeChild(container);
     };
+    const toggle = (isExpanded = !expanded.value) => {
+      expanded.value = isExpanded;
+    };
     const onClickAction = (event) => {
-      expanded.value = !expanded.value;
+      toggle();
       emit("clickAction", event);
     };
     const renderAction = () => createVNode("span", {
@@ -15055,8 +15084,10 @@ var stdin_default$9 = defineComponent({
       "onClick": onClickAction
     }, [actionText.value]);
     onMounted(calcEllipsised);
-    watch(() => [props2.content, props2.rows, props2.position], calcEllipsised);
-    useEventListener("resize", calcEllipsised);
+    watch([windowWidth, () => [props2.content, props2.rows, props2.position]], calcEllipsised);
+    useExpose({
+      toggle
+    });
     return () => createVNode("div", {
       "ref": root,
       "class": bem$3()
@@ -16723,7 +16754,7 @@ const Lazyload = {
     });
   }
 };
-const version = "4.8.0";
+const version = "4.8.2";
 function install(app) {
   const components = [
     ActionBar,

package/lib/vant.js

@@ -506,6 +506,22 @@
     return hidden || parentHidden;
   }
   const { width: windowWidth, height: windowHeight } = useWindowSize();
+  function isContainingBlock(el) {
+    const css = window.getComputedStyle(el);
+    return css.transform !== "none" || css.perspective !== "none" || ["transform", "perspective", "filter"].some(
+      (value) => (css.willChange || "").includes(value)
+    );
+  }
+  function getContainingBlock$1(el) {
+    let node = el.parentElement;
+    while (node) {
+      if (node && node.tagName !== "HTML" && node.tagName !== "BODY" && isContainingBlock(node)) {
+        return node;
+      }
+      node = node.parentElement;
+    }
+    return null;
+  }
   function addUnit(value) {
     if (isDef(value)) {
       return isNumeric(value) ? `${value}px` : String(value);
@@ -9979,6 +9995,7 @@
     duration: makeNumericProp(0.2),
     direction: makeStringProp("down"),
     activeColor: String,
+    autoLocate: Boolean,
     closeOnClickOutside: truthProp,
     closeOnClickOverlay: truthProp,
     swipeThreshold: numericProp
@@ -10134,6 +10151,7 @@
         transition: true,
         showWrapper: false
       });
+      const wrapperRef = vue.ref();
       const {
         parent,
         index
@@ -10219,6 +10237,7 @@
           offset: offset2
         } = parent;
         const {
+          autoLocate,
           zIndex,
           overlay,
           duration,
@@ -10226,12 +10245,20 @@
           closeOnClickOverlay
         } = parent.props;
         const style = getZIndexStyle(zIndex);
+        let offsetValue = offset2.value;
+        if (autoLocate && wrapperRef.value) {
+          const offsetParent = getContainingBlock$1(wrapperRef.value);
+          if (offsetParent) {
+            offsetValue -= useRect(offsetParent).top;
+          }
+        }
         if (direction === "down") {
-          style.top = `${offset2.value}px`;
+          style.top = `${offsetValue}px`;
         } else {
-          style.bottom = `${offset2.value}px`;
+          style.bottom = `${offsetValue}px`;
         }
         return vue.withDirectives(vue.createVNode("div", vue.mergeProps({
+          "ref": wrapperRef,
           "style": style,
           "class": bem$K([direction]),
           "onClick": onClickWrapper
@@ -11037,18 +11064,20 @@
           }
         }
       };
-      const checkTap = (event) => {
+      const checkClose = (event) => {
         var _a;
+        const isClickOverlay = event.target === ((_a = swipeItem.value) == null ? void 0 : _a.$el);
+        if (!props2.closeOnClickOverlay && isClickOverlay)
+          return;
+        emit("close");
+      };
+      const checkTap = (event) => {
         if (fingerNum > 1) {
           return;
         }
-        const {
-          offsetX,
-          offsetY
-        } = touch;
         const deltaTime = Date.now() - touchStartTime;
         const TAP_TIME = 250;
-        if (offsetX.value < TAP_OFFSET && offsetY.value < TAP_OFFSET) {
+        if (touch.isTap.value) {
           if (deltaTime < TAP_TIME) {
             if (props2.doubleScale) {
               if (doubleTapTimer) {
@@ -11056,16 +11085,13 @@
                 doubleTapTimer = null;
                 toggleScale();
               } else {
-                if (!props2.closeOnClickOverlay && event.target === ((_a = swipeItem.value) == null ? void 0 : _a.$el)) {
-                  return;
-                }
                 doubleTapTimer = setTimeout(() => {
-                  emit("close");
+                  checkClose(event);
                   doubleTapTimer = null;
                 }, TAP_TIME);
               }
             } else {
-              emit("close");
+              checkClose(event);
             }
           } else if (deltaTime > LONG_PRESS_START_TIME) {
             emit("longPress");
@@ -16278,8 +16304,11 @@
         }
         document.body.removeChild(container);
       };
+      const toggle = (isExpanded = !expanded.value) => {
+        expanded.value = isExpanded;
+      };
       const onClickAction = (event) => {
-        expanded.value = !expanded.value;
+        toggle();
         emit("clickAction", event);
       };
       const renderAction = () => vue.createVNode("span", {
@@ -16287,8 +16316,10 @@
         "onClick": onClickAction
       }, [actionText.value]);
       vue.onMounted(calcEllipsised);
-      vue.watch(() => [props2.content, props2.rows, props2.position], calcEllipsised);
-      useEventListener("resize", calcEllipsised);
+      vue.watch([windowWidth, () => [props2.content, props2.rows, props2.position]], calcEllipsised);
+      useExpose({
+        toggle
+      });
       return () => vue.createVNode("div", {
         "ref": root,
         "class": bem$3()
@@ -17935,7 +17966,7 @@
       });
     }
   };
-  const version = "4.8.0";
+  const version = "4.8.2";
   function install(app) {
     const components = [
       ActionBar,