vant 3.3.7 → 3.4.3

package/es/swipe/Swipe.js

@@ -1,15 +1,12 @@
 import { createVNode as _createVNode } from "vue";
-import { ref, watch, reactive, computed, onMounted, onActivated, onDeactivated, onBeforeUnmount, defineComponent } from 'vue'; // Utils
-
-import { clamp, isHidden, truthProp, numericProp, windowWidth, windowHeight, preventDefault, createNamespace, makeNumericProp } from '../utils'; // Composables
-
-import { doubleRaf, useChildren, usePageVisibility } from '@vant/use';
-import { useTouch } from '../composables/use-touch';
-import { useExpose } from '../composables/use-expose';
-import { onPopupReopen } from '../composables/on-popup-reopen'; // Types
-
-var [name, bem] = createNamespace('swipe');
-var swipeProps = {
+import { ref, watch, reactive, computed, onMounted, onActivated, onDeactivated, onBeforeUnmount, defineComponent, nextTick } from "vue";
+import { clamp, isHidden, truthProp, numericProp, windowWidth, windowHeight, preventDefault, createNamespace, makeNumericProp } from "../utils";
+import { doubleRaf, useChildren, usePageVisibility } from "@vant/use";
+import { useTouch } from "../composables/use-touch";
+import { useExpose } from "../composables/use-expose";
+import { onPopupReopen } from "../composables/on-popup-reopen";
+const [name, bem] = createNamespace("swipe");
+const swipeProps = {
   loop: truthProp,
   width: numericProp,
   height: numericProp,
@@ -23,19 +20,17 @@ var swipeProps = {
   showIndicators: truthProp,
   stopPropagation: truthProp
 };
-export var SWIPE_KEY = Symbol(name);
-export default defineComponent({
+const SWIPE_KEY = Symbol(name);
+var stdin_default = defineComponent({
   name,
   props: swipeProps,
-  emits: ['change'],
-
-  setup(props, _ref) {
-    var {
-      emit,
-      slots
-    } = _ref;
-    var root = ref();
-    var state = reactive({
+  emits: ["change"],
+  setup(props, {
+    emit,
+    slots
+  }) {
+    const root = ref();
+    const state = reactive({
       rect: null,
       width: 0,
       height: 0,
@@ -43,121 +38,95 @@ export default defineComponent({
       active: 0,
       swiping: false
     });
-    var touch = useTouch();
-    var {
+    const touch = useTouch();
+    const {
       children,
       linkChildren
     } = useChildren(SWIPE_KEY);
-    var count = computed(() => children.length);
-    var size = computed(() => state[props.vertical ? 'height' : 'width']);
-    var delta = computed(() => props.vertical ? touch.deltaY.value : touch.deltaX.value);
-    var minOffset = computed(() => {
+    const count = computed(() => children.length);
+    const size = computed(() => state[props.vertical ? "height" : "width"]);
+    const delta = computed(() => props.vertical ? touch.deltaY.value : touch.deltaX.value);
+    const minOffset = computed(() => {
       if (state.rect) {
-        var base = props.vertical ? state.rect.height : state.rect.width;
+        const base = props.vertical ? state.rect.height : state.rect.width;
         return base - size.value * count.value;
       }
-
       return 0;
     });
-    var maxCount = computed(() => Math.ceil(Math.abs(minOffset.value) / size.value));
-    var trackSize = computed(() => count.value * size.value);
-    var activeIndicator = computed(() => (state.active + count.value) % count.value);
-    var isCorrectDirection = computed(() => {
-      var expect = props.vertical ? 'vertical' : 'horizontal';
+    const maxCount = computed(() => Math.ceil(Math.abs(minOffset.value) / size.value));
+    const trackSize = computed(() => count.value * size.value);
+    const activeIndicator = computed(() => (state.active + count.value) % count.value);
+    const isCorrectDirection = computed(() => {
+      const expect = props.vertical ? "vertical" : "horizontal";
       return touch.direction.value === expect;
     });
-    var trackStyle = computed(() => {
-      var style = {
-        transitionDuration: (state.swiping ? 0 : props.duration) + "ms",
-        transform: "translate" + (props.vertical ? 'Y' : 'X') + "(" + state.offset + "px)"
+    const trackStyle = computed(() => {
+      const style = {
+        transitionDuration: `${state.swiping ? 0 : props.duration}ms`,
+        transform: `translate${props.vertical ? "Y" : "X"}(${state.offset}px)`
       };
-
       if (size.value) {
-        var mainAxis = props.vertical ? 'height' : 'width';
-        var crossAxis = props.vertical ? 'width' : 'height';
-        style[mainAxis] = trackSize.value + "px";
-        style[crossAxis] = props[crossAxis] ? props[crossAxis] + "px" : '';
+        const mainAxis = props.vertical ? "height" : "width";
+        const crossAxis = props.vertical ? "width" : "height";
+        style[mainAxis] = `${trackSize.value}px`;
+        style[crossAxis] = props[crossAxis] ? `${props[crossAxis]}px` : "";
       }
-
       return style;
     });
-
-    var getTargetActive = pace => {
-      var {
+    const getTargetActive = (pace) => {
+      const {
         active
       } = state;
-
       if (pace) {
         if (props.loop) {
           return clamp(active + pace, -1, count.value);
         }
-
         return clamp(active + pace, 0, maxCount.value);
       }
-
       return active;
     };
-
-    var getTargetOffset = function (targetActive, offset) {
-      if (offset === void 0) {
-        offset = 0;
-      }
-
-      var currentPosition = targetActive * size.value;
-
+    const getTargetOffset = (targetActive, offset = 0) => {
+      let currentPosition = targetActive * size.value;
       if (!props.loop) {
         currentPosition = Math.min(currentPosition, -minOffset.value);
       }
-
-      var targetOffset = offset - currentPosition;
-
+      let targetOffset = offset - currentPosition;
       if (!props.loop) {
         targetOffset = clamp(targetOffset, minOffset.value, 0);
       }
-
       return targetOffset;
     };
-
-    var move = _ref2 => {
-      var {
-        pace = 0,
-        offset = 0,
-        emitChange
-      } = _ref2;
-
+    const move = ({
+      pace = 0,
+      offset = 0,
+      emitChange
+    }) => {
       if (count.value <= 1) {
         return;
       }
-
-      var {
+      const {
         active
       } = state;
-      var targetActive = getTargetActive(pace);
-      var targetOffset = getTargetOffset(targetActive, offset); // auto move first and last swipe in loop mode
-
+      const targetActive = getTargetActive(pace);
+      const targetOffset = getTargetOffset(targetActive, offset);
       if (props.loop) {
         if (children[0] && targetOffset !== minOffset.value) {
-          var outRightBound = targetOffset < minOffset.value;
+          const outRightBound = targetOffset < minOffset.value;
           children[0].setOffset(outRightBound ? trackSize.value : 0);
         }
-
         if (children[count.value - 1] && targetOffset !== 0) {
-          var outLeftBound = targetOffset > 0;
+          const outLeftBound = targetOffset > 0;
           children[count.value - 1].setOffset(outLeftBound ? -trackSize.value : 0);
         }
       }
-
       state.active = targetActive;
       state.offset = targetOffset;
-
       if (emitChange && targetActive !== active) {
-        emit('change', activeIndicator.value);
+        emit("change", activeIndicator.value);
       }
     };
-
-    var correctPosition = () => {
+    const correctPosition = () => {
       state.swiping = true;
-
       if (state.active <= -1) {
         move({
           pace: count.value
@@ -167,10 +136,8 @@ export default defineComponent({
           pace: -count.value
         });
       }
-    }; // swipe to prev item
-
-
-    var prev = () => {
+    };
+    const prev = () => {
       correctPosition();
       touch.reset();
       doubleRaf(() => {
@@ -180,10 +147,8 @@ export default defineComponent({
           emitChange: true
         });
       });
-    }; // swipe to next item
-
-
-    var next = () => {
+    };
+    const next = () => {
       correctPosition();
       touch.reset();
       doubleRaf(() => {
@@ -194,107 +159,85 @@ export default defineComponent({
         });
       });
     };
-
-    var autoplayTimer;
-
-    var stopAutoplay = () => clearTimeout(autoplayTimer);
-
-    var autoplay = () => {
+    let autoplayTimer;
+    const stopAutoplay = () => clearTimeout(autoplayTimer);
+    const autoplay = () => {
       stopAutoplay();
-
       if (props.autoplay > 0 && count.value > 1) {
         autoplayTimer = setTimeout(() => {
           next();
           autoplay();
         }, +props.autoplay);
       }
-    }; // initialize swipe position
-
-
-    var initialize = function (active) {
-      if (active === void 0) {
-        active = +props.initialSwipe;
-      }
-
+    };
+    const initialize = (active = +props.initialSwipe) => {
       if (!root.value) {
         return;
       }
-
-      if (!isHidden(root)) {
-        var _props$width, _props$height;
-
-        var rect = {
-          width: root.value.offsetWidth,
-          height: root.value.offsetHeight
-        };
-        state.rect = rect;
-        state.width = +((_props$width = props.width) != null ? _props$width : rect.width);
-        state.height = +((_props$height = props.height) != null ? _props$height : rect.height);
-      }
-
-      if (count.value) {
-        active = Math.min(count.value - 1, active);
+      const cb = () => {
+        var _a, _b;
+        if (!isHidden(root)) {
+          const rect = {
+            width: root.value.offsetWidth,
+            height: root.value.offsetHeight
+          };
+          state.rect = rect;
+          state.width = +((_a = props.width) != null ? _a : rect.width);
+          state.height = +((_b = props.height) != null ? _b : rect.height);
+        }
+        if (count.value) {
+          active = Math.min(count.value - 1, active);
+        }
+        state.active = active;
+        state.swiping = true;
+        state.offset = getTargetOffset(active);
+        children.forEach((swipe) => {
+          swipe.setOffset(0);
+        });
+        autoplay();
+      };
+      if (isHidden(root)) {
+        nextTick().then(cb);
+      } else {
+        cb();
       }
-
-      state.active = active;
-      state.swiping = true;
-      state.offset = getTargetOffset(active);
-      children.forEach(swipe => {
-        swipe.setOffset(0);
-      });
-      autoplay();
     };
-
-    var resize = () => initialize(state.active);
-
-    var touchStartTime;
-
-    var onTouchStart = event => {
-      if (!props.touchable) return;
+    const resize = () => initialize(state.active);
+    let touchStartTime;
+    const onTouchStart = (event) => {
+      if (!props.touchable)
+        return;
       touch.start(event);
       touchStartTime = Date.now();
       stopAutoplay();
       correctPosition();
     };
-
-    var onTouchMove = event => {
+    const onTouchMove = (event) => {
       if (props.touchable && state.swiping) {
-        touch.move(event); // if user starting to touchmove, prevent the event bubbling to
-        // avoid affecting the parent components
-
-        var shouldPrevent = isCorrectDirection.value || touch.offsetY.value > touch.offsetX.value === props.vertical;
-
-        if (shouldPrevent) {
-          preventDefault(event, props.stopPropagation);
-        }
-
+        touch.move(event);
         if (isCorrectDirection.value) {
+          preventDefault(event, props.stopPropagation);
           move({
             offset: delta.value
           });
         }
       }
     };
-
-    var onTouchEnd = () => {
+    const onTouchEnd = () => {
       if (!props.touchable || !state.swiping) {
         return;
       }
-
-      var duration = Date.now() - touchStartTime;
-      var speed = delta.value / duration;
-      var shouldSwipe = Math.abs(speed) > 0.25 || Math.abs(delta.value) > size.value / 2;
-
+      const duration = Date.now() - touchStartTime;
+      const speed = delta.value / duration;
+      const shouldSwipe = Math.abs(speed) > 0.25 || Math.abs(delta.value) > size.value / 2;
       if (shouldSwipe && isCorrectDirection.value) {
-        var offset = props.vertical ? touch.offsetY.value : touch.offsetX.value;
-        var pace = 0;
-
+        const offset = props.vertical ? touch.offsetY.value : touch.offsetX.value;
+        let pace = 0;
         if (props.loop) {
           pace = offset > 0 ? delta.value > 0 ? -1 : 1 : 0;
         } else {
-          pace = -Math[delta.value > 0 ? 'ceil' : 'floor'](delta.value / size.value);
+          pace = -Math[delta.value > 0 ? "ceil" : "floor"](delta.value / size.value);
         }
-
         move({
           pace,
           emitChange: true
@@ -304,27 +247,19 @@ export default defineComponent({
           pace: 0
         });
       }
-
       state.swiping = false;
       autoplay();
     };
-
-    var swipeTo = function (index, options) {
-      if (options === void 0) {
-        options = {};
-      }
-
+    const swipeTo = (index, options = {}) => {
       correctPosition();
       touch.reset();
       doubleRaf(() => {
-        var targetIndex;
-
+        let targetIndex;
         if (props.loop && index === count.value) {
           targetIndex = state.active === 0 ? 0 : index;
         } else {
           targetIndex = index % count.value;
         }
-
         if (options.immediate) {
           doubleRaf(() => {
             state.swiping = false;
@@ -332,43 +267,39 @@ export default defineComponent({
         } else {
           state.swiping = false;
         }
-
         move({
           pace: targetIndex - state.active,
           emitChange: true
         });
       });
     };
-
-    var renderDot = (_, index) => {
-      var active = index === activeIndicator.value;
-      var style = active ? {
+    const renderDot = (_, index) => {
+      const active = index === activeIndicator.value;
+      const style = active ? {
         backgroundColor: props.indicatorColor
-      } : undefined;
+      } : void 0;
       return _createVNode("i", {
         "style": style,
-        "class": bem('indicator', {
+        "class": bem("indicator", {
           active
         })
       }, null);
     };
-
-    var renderIndicator = () => {
+    const renderIndicator = () => {
       if (slots.indicator) {
         return slots.indicator({
-          active: activeIndicator.value
+          active: activeIndicator.value,
+          total: count.value
         });
       }
-
       if (props.showIndicators && count.value > 1) {
         return _createVNode("div", {
-          "class": bem('indicators', {
+          "class": bem("indicators", {
             vertical: props.vertical
           })
-        }, [Array(count.value).fill('').map(renderDot)]);
+        }, [Array(count.value).fill("").map(renderDot)]);
       }
     };
-
     useExpose({
       prev,
       next,
@@ -382,12 +313,12 @@ export default defineComponent({
       count,
       activeIndicator
     });
-    watch(() => props.initialSwipe, value => initialize(+value));
+    watch(() => props.initialSwipe, (value) => initialize(+value));
     watch(count, () => initialize(state.active));
     watch(() => props.autoplay, autoplay);
     watch([windowWidth, windowHeight], resize);
-    watch(usePageVisibility(), visible => {
-      if (visible === 'visible') {
+    watch(usePageVisibility(), (visible) => {
+      if (visible === "visible") {
         autoplay();
       } else {
         stopAutoplay();
@@ -398,19 +329,25 @@ export default defineComponent({
     onPopupReopen(() => initialize(state.active));
     onDeactivated(stopAutoplay);
     onBeforeUnmount(stopAutoplay);
-    return () => _createVNode("div", {
-      "ref": root,
-      "class": bem()
-    }, [_createVNode("div", {
-      "style": trackStyle.value,
-      "class": bem('track', {
-        vertical: props.vertical
-      }),
-      "onTouchstart": onTouchStart,
-      "onTouchmove": onTouchMove,
-      "onTouchend": onTouchEnd,
-      "onTouchcancel": onTouchEnd
-    }, [slots.default == null ? void 0 : slots.default()]), renderIndicator()]);
+    return () => {
+      var _a;
+      return _createVNode("div", {
+        "ref": root,
+        "class": bem()
+      }, [_createVNode("div", {
+        "style": trackStyle.value,
+        "class": bem("track", {
+          vertical: props.vertical
+        }),
+        "onTouchstart": onTouchStart,
+        "onTouchmove": onTouchMove,
+        "onTouchend": onTouchEnd,
+        "onTouchcancel": onTouchEnd
+      }, [(_a = slots.default) == null ? void 0 : _a.call(slots)]), renderIndicator()]);
+    };
   }
-
-});
+});
+export {
+  SWIPE_KEY,
+  stdin_default as default
+};

package/es/swipe/index.css

@@ -1 +1 @@
-:root{--van-swipe-indicator-size:6px;--van-swipe-indicator-margin:var(--van-padding-sm);--van-swipe-indicator-active-opacity:1;--van-swipe-indicator-inactive-opacity:0.3;--van-swipe-indicator-active-background-color:var(--van-primary-color);--van-swipe-indicator-inactive-background-color:var(--van-border-color)}.van-swipe{position:relative;overflow:hidden;transform:translateZ(0);cursor:-webkit-grab;cursor:grab;-webkit-user-select:none;user-select:none}.van-swipe__track{display:flex;height:100%}.van-swipe__track--vertical{flex-direction:column}.van-swipe__indicators{position:absolute;bottom:var(--van-swipe-indicator-margin);left:50%;display:flex;transform:translateX(-50%)}.van-swipe__indicators--vertical{top:50%;bottom:auto;left:var(--van-swipe-indicator-margin);flex-direction:column;transform:translateY(-50%)}.van-swipe__indicators--vertical .van-swipe__indicator:not(:last-child){margin-bottom:var(--van-swipe-indicator-size)}.van-swipe__indicator{width:var(--van-swipe-indicator-size);height:var(--van-swipe-indicator-size);background-color:var(--van-swipe-indicator-inactive-background-color);border-radius:100%;opacity:var(--van-swipe-indicator-inactive-opacity);transition:opacity var(--van-animation-duration-fast),background-color var(--van-animation-duration-fast)}.van-swipe__indicator:not(:last-child){margin-right:var(--van-swipe-indicator-size)}.van-swipe__indicator--active{background-color:var(--van-swipe-indicator-active-background-color);opacity:var(--van-swipe-indicator-active-opacity)}
+:root{--van-swipe-indicator-size: 6px;--van-swipe-indicator-margin: var(--van-padding-sm);--van-swipe-indicator-active-opacity: 1;--van-swipe-indicator-inactive-opacity: .3;--van-swipe-indicator-active-background-color: var(--van-primary-color);--van-swipe-indicator-inactive-background-color: var(--van-border-color)}.van-swipe{position:relative;overflow:hidden;transform:translateZ(0);cursor:-webkit-grab;cursor:grab;-webkit-user-select:none;user-select:none}.van-swipe__track{display:flex;height:100%}.van-swipe__track--vertical{flex-direction:column}.van-swipe__indicators{position:absolute;bottom:var(--van-swipe-indicator-margin);left:50%;display:flex;transform:translate(-50%)}.van-swipe__indicators--vertical{top:50%;bottom:auto;left:var(--van-swipe-indicator-margin);flex-direction:column;transform:translateY(-50%)}.van-swipe__indicators--vertical .van-swipe__indicator:not(:last-child){margin-bottom:var(--van-swipe-indicator-size)}.van-swipe__indicator{width:var(--van-swipe-indicator-size);height:var(--van-swipe-indicator-size);background-color:var(--van-swipe-indicator-inactive-background-color);border-radius:100%;opacity:var(--van-swipe-indicator-inactive-opacity);transition:opacity var(--van-animation-duration-fast),background-color var(--van-animation-duration-fast)}.van-swipe__indicator:not(:last-child){margin-right:var(--van-swipe-indicator-size)}.van-swipe__indicator--active{background-color:var(--van-swipe-indicator-active-background-color);opacity:var(--van-swipe-indicator-active-opacity)}

package/es/swipe/index.d.ts

@@ -33,34 +33,41 @@ export declare const Swipe: import("../utils").WithInstall<import("vue").DefineC
         type: BooleanConstructor;
         default: true;
     };
-}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "change"[], "change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("@vue/runtime-core").ComponentCustomProps, Readonly<{
-    loop?: unknown;
-    width?: unknown;
-    height?: unknown;
-    vertical?: unknown;
-    autoplay?: unknown;
-    duration?: unknown;
-    touchable?: unknown;
-    lazyRender?: unknown;
-    initialSwipe?: unknown;
-    indicatorColor?: unknown;
-    showIndicators?: unknown;
-    stopPropagation?: unknown;
-} & {
-    autoplay: string | number;
-    loop: boolean;
-    vertical: boolean;
-    duration: string | number;
-    lazyRender: boolean;
-    touchable: boolean;
-    initialSwipe: string | number;
-    showIndicators: boolean;
-    stopPropagation: boolean;
-} & {
-    width?: string | number | undefined;
-    height?: string | number | undefined;
-    indicatorColor?: string | undefined;
-}> & {
+}, () => JSX.Element, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "change"[], "change", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    loop: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    width: (NumberConstructor | StringConstructor)[];
+    height: (NumberConstructor | StringConstructor)[];
+    vertical: BooleanConstructor;
+    autoplay: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    duration: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    touchable: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    lazyRender: BooleanConstructor;
+    initialSwipe: {
+        type: (NumberConstructor | StringConstructor)[];
+        default: number;
+    };
+    indicatorColor: StringConstructor;
+    showIndicators: {
+        type: BooleanConstructor;
+        default: true;
+    };
+    stopPropagation: {
+        type: BooleanConstructor;
+        default: true;
+    };
+}>> & {
     onChange?: ((...args: any[]) => any) | undefined;
 }, {
     autoplay: string | number;
@@ -76,3 +83,8 @@ export declare const Swipe: import("../utils").WithInstall<import("vue").DefineC
 export default Swipe;
 export type { SwipeProps };
 export type { SwipeInstance, SwipeToOptions } from './types';
+declare module 'vue' {
+    interface GlobalComponents {
+        VanSwipe: typeof Swipe;
+    }
+}

package/es/swipe/index.js

@@ -1,4 +1,8 @@
-import { withInstall } from '../utils';
-import _Swipe from './Swipe';
-export var Swipe = withInstall(_Swipe);
-export default Swipe;
+import { withInstall } from "../utils";
+import _Swipe from "./Swipe";
+const Swipe = withInstall(_Swipe);
+var stdin_default = Swipe;
+export {
+  Swipe,
+  stdin_default as default
+};

package/es/swipe/style/index.js

@@ -1,2 +1,2 @@
-import '../../style/base.css';
-import '../index.css';
+import "../../style/base.css";
+import "../index.css";

package/es/swipe/style/less.js

@@ -1,2 +1,2 @@
-import '../../style/base.less';
-import '../index.less';
+import "../../style/base.less";
+import "../index.less";

package/es/swipe/types.js

@@ -1 +0,0 @@
-export {};