vant 3.2.7 → 3.2.8

package/lib/vant.es.js

@@ -61,31 +61,37 @@ function doubleRaf(fn2) {
 function isWindow(val) {
   return val === window;
 }
-function makeDOMRect(width, height) {
+function makeDOMRect(width2, height2) {
   return {
     top: 0,
     left: 0,
-    right: width,
-    bottom: height,
-    width,
-    height
+    right: width2,
+    bottom: height2,
+    width: width2,
+    height: height2
   };
 }
 var useRect = (elementOrRef) => {
   var element = unref(elementOrRef);
   if (isWindow(element)) {
-    var width = element.innerWidth;
-    var height = element.innerHeight;
-    return makeDOMRect(width, height);
+    var width2 = element.innerWidth;
+    var height2 = element.innerHeight;
+    return makeDOMRect(width2, height2);
   }
   if (element && element.getBoundingClientRect) {
     return element.getBoundingClientRect();
   }
   return makeDOMRect(0, 0);
 };
-function useToggle(defaultValue = false) {
+function useToggle(defaultValue) {
+  if (defaultValue === void 0) {
+    defaultValue = false;
+  }
   var state = ref(defaultValue);
-  var toggle = (value = !state.value) => {
+  var toggle = function(value) {
+    if (value === void 0) {
+      value = !state.value;
+    }
     state.value = value;
   };
   return [state, toggle];
@@ -254,7 +260,10 @@ function useCountDown(options) {
       tick();
     }
   };
-  var reset = (totalTime = options.time) => {
+  var reset = function(totalTime) {
+    if (totalTime === void 0) {
+      totalTime = options.time;
+    }
     pause();
     remain.value = totalTime;
   };
@@ -293,7 +302,10 @@ function onMountedOrActivated(hook) {
     }
   });
 }
-function useEventListener(type, listener, options = {}) {
+function useEventListener(type, listener, options) {
+  if (options === void 0) {
+    options = {};
+  }
   if (!inBrowser) {
     return;
   }
@@ -330,7 +342,10 @@ function useEventListener(type, listener, options = {}) {
     });
   }
 }
-function useClickAway(target, listener, options = {}) {
+function useClickAway(target, listener, options) {
+  if (options === void 0) {
+    options = {};
+  }
   if (!inBrowser) {
     return;
   }
@@ -347,15 +362,22 @@ function useClickAway(target, listener, options = {}) {
     target: document
   });
 }
+var width;
+var height;
 function useWindowSize() {
-  var width = ref(inBrowser ? window.innerWidth : 0);
-  var height = ref(inBrowser ? window.innerHeight : 0);
-  var onResize = () => {
-    width.value = window.innerWidth;
-    height.value = window.innerHeight;
-  };
-  useEventListener("resize", onResize);
-  useEventListener("orientationchange", onResize);
+  if (!width) {
+    width = ref(0);
+    height = ref(0);
+    var update = () => {
+      if (inBrowser) {
+        width.value = window.innerWidth;
+        height.value = window.innerHeight;
+      }
+    };
+    update();
+    useEventListener("resize", update);
+    useEventListener("orientationchange", update);
+  }
   return {
     width,
     height
@@ -367,7 +389,10 @@ function isElement$1(node) {
   var ELEMENT_NODE_TYPE = 1;
   return node.tagName !== "HTML" && node.tagName !== "BODY" && node.nodeType === ELEMENT_NODE_TYPE;
 }
-function getScrollParent$1(el, root = defaultRoot) {
+function getScrollParent$1(el, root) {
+  if (root === void 0) {
+    root = defaultRoot;
+  }
   var node = el;
   while (node && node !== root && isElement$1(node)) {
     var {
@@ -380,7 +405,10 @@ function getScrollParent$1(el, root = defaultRoot) {
   }
   return root;
 }
-function useScrollParent(el, root = defaultRoot) {
+function useScrollParent(el, root) {
+  if (root === void 0) {
+    root = defaultRoot;
+  }
   var scrollParent = ref();
   onMounted(() => {
     if (el.value) {
@@ -2739,21 +2767,21 @@ function endComposing(_ref2) {
 function resizeTextarea(input, autosize) {
   var scrollTop = getRootScrollTop();
   input.style.height = "auto";
-  var height = input.scrollHeight;
+  var height2 = input.scrollHeight;
   if (isObject$1(autosize)) {
     var {
       maxHeight,
       minHeight
     } = autosize;
     if (maxHeight !== void 0) {
-      height = Math.min(height, maxHeight);
+      height2 = Math.min(height2, maxHeight);
     }
     if (minHeight !== void 0) {
-      height = Math.max(height, minHeight);
+      height2 = Math.max(height2, minHeight);
     }
   }
-  if (height) {
-    input.style.height = height + "px";
+  if (height2) {
+    input.style.height = height2 + "px";
     setRootScrollTop(scrollTop);
   }
 }
@@ -4446,11 +4474,11 @@ function getTrueValue(value) {
 }
 var getMonthEndDay = (year, month) => 32 - new Date(year, month - 1, 32).getDate();
 var useHeight = (element) => {
-  var height = ref();
+  var height2 = ref();
   onMounted(() => nextTick(() => {
-    height.value = useRect(element).height;
+    height2.value = useRect(element).height;
   }));
-  return height;
+  return height2;
 };
 var [name$14] = createNamespace("calendar-day");
 var CalendarDay = defineComponent({
@@ -4600,7 +4628,7 @@ var CalendarMonth = defineComponent({
     var [visible, setVisible] = useToggle();
     var daysRef = ref();
     var monthRef = ref();
-    var height = useHeight(monthRef);
+    var height2 = useHeight(monthRef);
     var title = computed(() => formatMonthTitle(props.date));
     var rowHeight = computed(() => addUnit(props.rowHeight));
     var offset2 = computed(() => {
@@ -4755,7 +4783,7 @@ var CalendarMonth = defineComponent({
     }, [renderMark(), (shouldRender.value ? days : placeholders).value.map(renderDay)]);
     useExpose({
       getTitle,
-      getHeight: () => height.value,
+      getHeight: () => height2.value,
       setVisible,
       scrollIntoView,
       disabledDays
@@ -4957,12 +4985,12 @@ var _Calendar = defineComponent({
       if (bottom2 > heightSum && top2 > 0) {
         return;
       }
-      var height = 0;
+      var height2 = 0;
       var currentMonth;
       var visibleRange = [-1, -1];
       for (var i = 0; i < months.value.length; i++) {
         var month = monthRefs.value[i];
-        var visible = height <= bottom2 && height + heights[i] >= top2;
+        var visible = height2 <= bottom2 && height2 + heights[i] >= top2;
         if (visible) {
           visibleRange[1] = i;
           if (!currentMonth) {
@@ -4977,7 +5005,7 @@ var _Calendar = defineComponent({
             });
           }
         }
-        height += heights[i];
+        height2 += heights[i];
       }
       months.value.forEach((month2, index2) => {
         var visible2 = index2 >= visibleRange[0] - 1 && index2 <= visibleRange[1] + 1;
@@ -5560,13 +5588,13 @@ var _Sticky = defineComponent({
     var rootStyle = computed(() => {
       var {
         fixed,
-        height,
-        width
+        height: height2,
+        width: width2
       } = state;
       if (fixed) {
         return {
-          width: width + "px",
-          height: height + "px"
+          width: width2 + "px",
+          height: height2 + "px"
         };
       }
     });
@@ -6220,9 +6248,9 @@ var _Tabs = defineComponent({
           lineStyle.transitionDuration = props.duration + "s";
         }
         if (isDef(lineHeight)) {
-          var height = addUnit(lineHeight);
-          lineStyle.height = height;
-          lineStyle.borderRadius = height;
+          var height2 = addUnit(lineHeight);
+          lineStyle.height = height2;
+          lineStyle.borderRadius = height2;
         }
         state.lineStyle = lineStyle;
       });
@@ -6278,12 +6306,6 @@ var _Tabs = defineComponent({
         disabled
       } = children[index2];
       var name2 = getTabName(children[index2], index2);
-      emit("click-tab", {
-        name: name2,
-        title,
-        event,
-        disabled
-      });
       if (disabled) {
         emit("disabled", name2, title);
       } else {
@@ -6297,6 +6319,12 @@ var _Tabs = defineComponent({
         emit("click", name2, title);
         route(item);
       }
+      emit("click-tab", {
+        name: name2,
+        title,
+        event,
+        disabled
+      });
     };
     var onStickyScroll = (params) => {
       stickyFixed = params.isFixed;
@@ -6753,6 +6781,7 @@ var _Cascader = defineComponent({
       "class": bem$T("options")
     }, [options.map((option) => renderOption(option, selectedOption, tabIndex))]);
     var renderTab = (tab, tabIndex) => {
+      var _slots$optionsTop, _slots$optionsBottom;
       var {
         options,
         selected
@@ -6765,9 +6794,11 @@ var _Cascader = defineComponent({
           unselected: !selected
         })
       }, {
-        default: () => [slots["options-top"] ? slots["options-top"]({
-          tabIndex: activeTab.value
-        }) : null, renderOptions(options, selected, tabIndex)]
+        default: () => [(_slots$optionsTop = slots["options-top"]) == null ? void 0 : _slots$optionsTop.call(slots, {
+          tabIndex
+        }), renderOptions(options, selected, tabIndex), (_slots$optionsBottom = slots["options-bottom"]) == null ? void 0 : _slots$optionsBottom.call(slots, {
+          tabIndex
+        })]
       });
     };
     var renderTabs = () => createVNode(Tabs, {
@@ -8729,7 +8760,7 @@ var VanDialog = defineComponent({
     };
     return () => {
       var {
-        width,
+        width: width2,
         title,
         theme,
         message,
@@ -8739,7 +8770,7 @@ var VanDialog = defineComponent({
         "role": "dialog",
         "class": [bem$B([theme]), className],
         "style": {
-          width: addUnit(width)
+          width: addUnit(width2)
         },
         "aria-labelledby": title || message,
         "onUpdate:show": updateShow
@@ -10232,7 +10263,12 @@ function getBestSelectionFromSrcset(el, scale) {
   }
   return bestSelectedSrc;
 }
-var getDPR = (scale = 1) => inBrowser ? window.devicePixelRatio || scale : scale;
+var getDPR = function(scale) {
+  if (scale === void 0) {
+    scale = 1;
+  }
+  return inBrowser ? window.devicePixelRatio || scale : scale;
+};
 function supportWebp() {
   if (!inBrowser)
     return false;
@@ -10250,7 +10286,10 @@ function supportWebp() {
 function throttle(action, delay) {
   var timeout = null;
   var lastRun = 0;
-  return function(...args) {
+  return function() {
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
     if (timeout) {
       return;
     }
@@ -10299,9 +10338,10 @@ function isObject(obj) {
 function noop() {
 }
 class ImageCache {
-  constructor({
-    max
-  }) {
+  constructor(_ref) {
+    var {
+      max
+    } = _ref;
     this.options = {
       max: max || 100
     };
@@ -10323,18 +10363,19 @@ class ImageCache {
   }
 }
 class ReactiveListener {
-  constructor({
-    el,
-    src,
-    error,
-    loading,
-    bindType,
-    $parent,
-    options,
-    cors,
-    elRenderer,
-    imageCache
-  }) {
+  constructor(_ref) {
+    var {
+      el,
+      src,
+      error,
+      loading,
+      bindType,
+      $parent,
+      options,
+      cors,
+      elRenderer,
+      imageCache
+    } = _ref;
     this.el = el;
     this.src = src;
     this.error = error;
@@ -10373,11 +10414,12 @@ class ReactiveListener {
   record(event) {
     this.performanceData[event] = Date.now();
   }
-  update({
-    src,
-    loading,
-    error
-  }) {
+  update(_ref2) {
+    var {
+      src,
+      loading,
+      error
+    } = _ref2;
     var oldSrc = this.src;
     this.src = src;
     this.loading = loading;
@@ -10414,7 +10456,10 @@ class ReactiveListener {
       this.state.loading = false;
     });
   }
-  load(onFinish = noop) {
+  load(onFinish) {
+    if (onFinish === void 0) {
+      onFinish = noop;
+    }
     if (this.attempt > this.options.attempt - 1 && this.state.error) {
       onFinish();
       return;
@@ -10488,22 +10533,23 @@ var DEFAULT_OBSERVER_OPTIONS = {
 };
 function Lazy() {
   return class Lazy {
-    constructor({
-      preLoad,
-      error,
-      throttleWait,
-      preLoadTop,
-      dispatchEvent,
-      loading,
-      attempt,
-      silent = true,
-      scale,
-      listenEvents,
-      filter,
-      adapter,
-      observer,
-      observerOptions
-    }) {
+    constructor(_ref) {
+      var {
+        preLoad,
+        error,
+        throttleWait,
+        preLoadTop,
+        dispatchEvent,
+        loading,
+        attempt,
+        silent = true,
+        scale,
+        listenEvents,
+        filter,
+        adapter,
+        observer,
+        observerOptions
+      } = _ref;
       this.mode = modeType.event;
       this.ListenerQueue = [];
       this.TargetIndex = 0;
@@ -10533,7 +10579,10 @@ function Lazy() {
       this.lazyLoadHandler = throttle(this._lazyLoadHandler.bind(this), this.options.throttleWait);
       this.setMode(this.options.observer ? modeType.observer : modeType.event);
     }
-    config(options = {}) {
+    config(options) {
+      if (options === void 0) {
+        options = {};
+      }
       Object.assign(this.options, options);
     }
     performance() {
@@ -10692,6 +10741,7 @@ function Lazy() {
       this.options.ListenEvents.forEach((evt) => (start2 ? on : off)(el, evt, this.lazyLoadHandler));
     }
     _initEvent() {
+      var _this = this;
       this.Event = {
         listeners: {
           loading: [],
@@ -10705,9 +10755,12 @@ function Lazy() {
         this.Event.listeners[event].push(func);
       };
       this.$once = (event, func) => {
-        var on2 = (...args) => {
-          this.$off(event, on2);
-          func.apply(this, args);
+        var on2 = function() {
+          _this.$off(event, on2);
+          for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+            args[_key] = arguments[_key];
+          }
+          func.apply(_this, args);
         };
         this.$on(event, on2);
       };
@@ -10874,12 +10927,13 @@ var defaultOptions = {
   selector: "img"
 };
 class LazyContainer {
-  constructor({
-    el,
-    binding,
-    vnode,
-    lazy
-  }) {
+  constructor(_ref) {
+    var {
+      el,
+      binding,
+      vnode,
+      lazy
+    } = _ref;
     this.el = null;
     this.vnode = vnode;
     this.binding = binding;
@@ -10891,10 +10945,11 @@ class LazyContainer {
       binding
     });
   }
-  update({
-    el,
-    binding
-  }) {
+  update(_ref2) {
+    var {
+      el,
+      binding
+    } = _ref2;
     this.el = el;
     this.options = Object.assign({}, defaultOptions, binding.value);
     var imgs = this.getImgs();
@@ -10920,9 +10975,10 @@ class LazyContainer {
   }
 }
 class LazyContainerManager {
-  constructor({
-    lazy
-  }) {
+  constructor(_ref3) {
+    var {
+      lazy
+    } = _ref3;
     this.lazy = lazy;
     this._queue = [];
   }
@@ -11025,7 +11081,10 @@ var LazyImage = (lazyManager) => ({
       this.getRect();
       return inBrowser && this.rect.top < window.innerHeight * lazyManager.options.preLoad && this.rect.bottom > 0 && this.rect.left < window.innerWidth * lazyManager.options.preLoad && this.rect.right > 0;
     },
-    load(onFinish = noop) {
+    load(onFinish) {
+      if (onFinish === void 0) {
+        onFinish = noop;
+      }
       if (this.state.attempt > this.options.attempt - 1 && this.state.error) {
         onFinish();
         return;
@@ -11035,9 +11094,10 @@ var LazyImage = (lazyManager) => ({
       } = this.options;
       loadImageAsync({
         src
-      }, ({
-        src: src2
-      }) => {
+      }, (_ref) => {
+        var {
+          src: src2
+        } = _ref;
         this.renderSrc = src2;
         this.state.loaded = true;
       }, () => {
@@ -11049,7 +11109,10 @@ var LazyImage = (lazyManager) => ({
   }
 });
 var Lazyload = {
-  install(app, options = {}) {
+  install(app, options) {
+    if (options === void 0) {
+      options = {};
+    }
     var LazyClass = Lazy();
     var lazy = new LazyClass(options);
     var lazyContainer = new LazyContainerManager({
@@ -11202,11 +11265,11 @@ var _List = defineComponent({
 });
 var List = withInstall(_List);
 function usePlaceholder(contentRef, bem2) {
-  var height = useHeight(contentRef);
+  var height2 = useHeight(contentRef);
   return (renderContent) => createVNode("div", {
     "class": bem2("placeholder"),
     "style": {
-      height: height.value ? height.value + "px" : void 0
+      height: height2.value ? height2.value + "px" : void 0
     }
   }, [renderContent()]);
 }
@@ -11975,17 +12038,18 @@ var _Pagination = defineComponent({
 });
 var Pagination = withInstall(_Pagination);
 var [name$j, bem$j] = createNamespace("password-input");
+var passwordInputProps = {
+  info: String,
+  mask: truthProp,
+  value: makeStringProp(""),
+  gutter: numericProp,
+  length: makeNumericProp(6),
+  focused: Boolean,
+  errorInfo: String
+};
 var _PasswordInput = defineComponent({
   name: name$j,
-  props: {
-    info: String,
-    mask: truthProp,
-    value: makeStringProp(""),
-    gutter: numericProp,
-    length: makeNumericProp(6),
-    focused: Boolean,
-    errorInfo: String
-  },
+  props: passwordInputProps,
   emits: ["focus"],
   setup(props, _ref) {
     var {
@@ -12047,17 +12111,19 @@ var _PasswordInput = defineComponent({
   }
 });
 var PasswordInput = withInstall(_PasswordInput);
-function getBoundingClientRect(element) {
+function getBoundingClientRect(element, includeScale) {
   var rect = element.getBoundingClientRect();
+  var scaleX = 1;
+  var scaleY = 1;
   return {
-    width: rect.width,
-    height: rect.height,
-    top: rect.top,
-    right: rect.right,
-    bottom: rect.bottom,
-    left: rect.left,
-    x: rect.left,
-    y: rect.top
+    width: rect.width / scaleX,
+    height: rect.height / scaleY,
+    top: rect.top / scaleY,
+    right: rect.right / scaleX,
+    bottom: rect.bottom / scaleY,
+    left: rect.left / scaleX,
+    x: rect.left / scaleX,
+    y: rect.top / scaleY
   };
 }
 function getWindow(node) {
@@ -12123,13 +12189,20 @@ function isScrollParent(element) {
   var _getComputedStyle = getComputedStyle(element), overflow = _getComputedStyle.overflow, overflowX = _getComputedStyle.overflowX, overflowY = _getComputedStyle.overflowY;
   return /auto|scroll|overlay|hidden/.test(overflow + overflowY + overflowX);
 }
+function isElementScaled(element) {
+  var rect = element.getBoundingClientRect();
+  var scaleX = rect.width / element.offsetWidth || 1;
+  var scaleY = rect.height / element.offsetHeight || 1;
+  return scaleX !== 1 || scaleY !== 1;
+}
 function getCompositeRect(elementOrVirtualElement, offsetParent, isFixed) {
   if (isFixed === void 0) {
     isFixed = false;
   }
+  var isOffsetParentAnElement = isHTMLElement(offsetParent);
+  isHTMLElement(offsetParent) && isElementScaled(offsetParent);
   var documentElement = getDocumentElement(offsetParent);
   var rect = getBoundingClientRect(elementOrVirtualElement);
-  var isOffsetParentAnElement = isHTMLElement(offsetParent);
   var scroll = {
     scrollLeft: 0,
     scrollTop: 0
@@ -12159,19 +12232,19 @@ function getCompositeRect(elementOrVirtualElement, offsetParent, isFixed) {
 }
 function getLayoutRect(element) {
   var clientRect = getBoundingClientRect(element);
-  var width = element.offsetWidth;
-  var height = element.offsetHeight;
-  if (Math.abs(clientRect.width - width) <= 1) {
-    width = clientRect.width;
+  var width2 = element.offsetWidth;
+  var height2 = element.offsetHeight;
+  if (Math.abs(clientRect.width - width2) <= 1) {
+    width2 = clientRect.width;
   }
-  if (Math.abs(clientRect.height - height) <= 1) {
-    height = clientRect.height;
+  if (Math.abs(clientRect.height - height2) <= 1) {
+    height2 = clientRect.height;
   }
   return {
     x: element.offsetLeft,
     y: element.offsetTop,
-    width,
-    height
+    width: width2,
+    height: height2
   };
 }
 function getParentNode(element) {
@@ -12424,7 +12497,8 @@ function popperGenerator(generatorOptions) {
     var isDestroyed = false;
     var instance2 = {
       state,
-      setOptions: function setOptions(options2) {
+      setOptions: function setOptions(setOptionsAction) {
+        var options2 = typeof setOptionsAction === "function" ? setOptionsAction(state.options) : setOptionsAction;
         cleanupModifierEffects();
         state.options = Object.assign({}, defaultOptions2, state.options, options2);
         state.scrollParents = {
@@ -12519,7 +12593,7 @@ function popperGenerator(generatorOptions) {
 var passive = {
   passive: true
 };
-function effect(_ref) {
+function effect$1(_ref) {
   var state = _ref.state, instance2 = _ref.instance, options = _ref.options;
   var _options$scroll = options.scroll, scroll = _options$scroll === void 0 ? true : _options$scroll, _options$resize = options.resize, resize = _options$resize === void 0 ? true : _options$resize;
   var window2 = getWindow(state.elements.popper);
@@ -12549,7 +12623,7 @@ var eventListeners = {
   phase: "write",
   fn: function fn() {
   },
-  effect,
+  effect: effect$1,
   data: {}
 };
 function popperOffsets(_ref) {
@@ -12585,7 +12659,7 @@ function roundOffsetsByDPR(_ref) {
 }
 function mapToStyles(_ref2) {
   var _Object$assign2;
-  var popper = _ref2.popper, popperRect = _ref2.popperRect, placement = _ref2.placement, offsets = _ref2.offsets, position = _ref2.position, gpuAcceleration = _ref2.gpuAcceleration, adaptive = _ref2.adaptive, roundOffsets = _ref2.roundOffsets;
+  var popper = _ref2.popper, popperRect = _ref2.popperRect, placement = _ref2.placement, variation = _ref2.variation, offsets = _ref2.offsets, position = _ref2.position, gpuAcceleration = _ref2.gpuAcceleration, adaptive = _ref2.adaptive, roundOffsets = _ref2.roundOffsets;
   var _ref3 = roundOffsets === true ? roundOffsetsByDPR(offsets) : typeof roundOffsets === "function" ? roundOffsets(offsets) : offsets, _ref3$x = _ref3.x, x = _ref3$x === void 0 ? 0 : _ref3$x, _ref3$y = _ref3.y, y = _ref3$y === void 0 ? 0 : _ref3$y;
   var hasX = offsets.hasOwnProperty("x");
   var hasY = offsets.hasOwnProperty("y");
@@ -12598,18 +12672,18 @@ function mapToStyles(_ref2) {
     var widthProp = "clientWidth";
     if (offsetParent === getWindow(popper)) {
       offsetParent = getDocumentElement(popper);
-      if (getComputedStyle(offsetParent).position !== "static") {
+      if (getComputedStyle(offsetParent).position !== "static" && position === "absolute") {
         heightProp = "scrollHeight";
         widthProp = "scrollWidth";
       }
     }
     offsetParent = offsetParent;
-    if (placement === top) {
+    if (placement === top || (placement === left || placement === right) && variation === end) {
       sideY = bottom;
       y -= offsetParent[heightProp] - popperRect.height;
       y *= gpuAcceleration ? 1 : -1;
     }
-    if (placement === left) {
+    if (placement === left || (placement === top || placement === bottom) && variation === end) {
       sideX = right;
       x -= offsetParent[widthProp] - popperRect.width;
       x *= gpuAcceleration ? 1 : -1;
@@ -12620,7 +12694,7 @@ function mapToStyles(_ref2) {
   }, adaptive && unsetSides);
   if (gpuAcceleration) {
     var _Object$assign;
-    return Object.assign({}, commonStyles, (_Object$assign = {}, _Object$assign[sideY] = hasY ? "0" : "", _Object$assign[sideX] = hasX ? "0" : "", _Object$assign.transform = (win.devicePixelRatio || 1) < 2 ? "translate(" + x + "px, " + y + "px)" : "translate3d(" + x + "px, " + y + "px, 0)", _Object$assign));
+    return Object.assign({}, commonStyles, (_Object$assign = {}, _Object$assign[sideY] = hasY ? "0" : "", _Object$assign[sideX] = hasX ? "0" : "", _Object$assign.transform = (win.devicePixelRatio || 1) <= 1 ? "translate(" + x + "px, " + y + "px)" : "translate3d(" + x + "px, " + y + "px, 0)", _Object$assign));
   }
   return Object.assign({}, commonStyles, (_Object$assign2 = {}, _Object$assign2[sideY] = hasY ? y + "px" : "", _Object$assign2[sideX] = hasX ? x + "px" : "", _Object$assign2.transform = "", _Object$assign2));
 }
@@ -12629,6 +12703,7 @@ function computeStyles(_ref4) {
   var _options$gpuAccelerat = options.gpuAcceleration, gpuAcceleration = _options$gpuAccelerat === void 0 ? true : _options$gpuAccelerat, _options$adaptive = options.adaptive, adaptive = _options$adaptive === void 0 ? true : _options$adaptive, _options$roundOffsets = options.roundOffsets, roundOffsets = _options$roundOffsets === void 0 ? true : _options$roundOffsets;
   var commonStyles = {
     placement: getBasePlacement(state.placement),
+    variation: getVariation(state.placement),
     popper: state.elements.popper,
     popperRect: state.rects.popper,
     gpuAcceleration
@@ -12680,7 +12755,7 @@ function applyStyles(_ref) {
     });
   });
 }
-function effect$1(_ref2) {
+function effect(_ref2) {
   var state = _ref2.state;
   var initialStyles = {
     popper: {
@@ -12723,7 +12798,7 @@ var applyStyles$1 = {
   enabled: true,
   phase: "write",
   fn: applyStyles,
-  effect: effect$1,
+  effect,
   requires: ["computeStyles"]
 };
 var defaultModifiers = [eventListeners, popperOffsets$1, computeStyles$1, applyStyles$1];
@@ -12978,8 +13053,8 @@ var _Progress = defineComponent({
         height: addUnit(strokeWidth)
       };
       var portionStyle = {
-        background: background.value,
-        transform: "scaleX(" + +percentage / 100 + ")"
+        width: percentage + "%",
+        background: background.value
       };
       return createVNode("div", {
         "class": bem$h(),
@@ -14509,8 +14584,8 @@ var _SwipeCell = defineComponent({
       var offset2 = Math.abs(state.offset);
       var THRESHOLD = 0.15;
       var threshold = opened ? 1 - THRESHOLD : THRESHOLD;
-      var width = side === "left" ? leftWidth.value : rightWidth.value;
-      if (width && offset2 > width * threshold) {
+      var width2 = side === "left" ? leftWidth.value : rightWidth.value;
+      if (width2 && offset2 > width2 * threshold) {
         open(side);
       } else {
         close(side);
@@ -15284,7 +15359,7 @@ var _Uploader = defineComponent({
   }
 });
 var Uploader = withInstall(_Uploader);
-var version = "3.2.7";
+var version = "3.2.8";
 function install(app) {
   var components = [ActionBar, ActionBarButton, ActionBarIcon, ActionSheet, AddressEdit, AddressList, Area, Badge, Button, Calendar, Card, Cascader, Cell, CellGroup, Checkbox, CheckboxGroup, Circle, Col, Collapse, CollapseItem, ConfigProvider, ContactCard, ContactEdit, ContactList, CountDown, Coupon, CouponCell, CouponList, DatetimePicker, Dialog, Divider, DropdownItem, DropdownMenu, Empty, Field, Form, Grid, GridItem, Icon, Image$1, ImagePreview, IndexAnchor, IndexBar, List, Loading, Locale, NavBar, NoticeBar, Notify, NumberKeyboard, Overlay, Pagination, PasswordInput, Picker, Popover, Popup, Progress, PullRefresh, Radio, RadioGroup, Rate, Row, Search, ShareSheet, Sidebar, SidebarItem, Skeleton, Slider, Step, Stepper, Steps, Sticky, SubmitBar, Swipe, SwipeCell, SwipeItem, Switch, Tab, Tabbar, TabbarItem, Tabs, Tag, Toast, TreeSelect, Uploader];
   components.forEach((item) => {