@arco-design/mobile-react 2.25.3 → 2.26.0

package/umd/image-preview/index.js

@@ -14,6 +14,7 @@
   "use strict";
 
   var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
   _exports.__esModule = true;
   var _exportNames = {
     methodsGenerator: true
@@ -36,58 +37,62 @@
   });
   _loading = _interopRequireDefault(_loading);
   var _excluded = ["style", "className", "images", "loop", "openIndex", "fit", "noselect", "displayDuration", "spaceBetween", "showLoading", "loadingArea", "errorArea", "showError", "retryTime", "staticLabel", "replaceFallbackWhenLoaded", "scrollBezier", "lazyloadCount", "swipeToClose", "getMinScale", "getMaxScale", "getDoubleClickScale", "getContainer", "getThumbBounds", "renderIndicator", "onChange", "onAfterChange", "onImageClick", "onImageDoubleClick", "onImageLongTap", "close", "onClose", "onTouchStart", "onTouchMove", "onTouchEnd", "indicatorPos"];
+
   function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
   function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
   var MAX_ZOOM = 5;
   var MIN_ZOOM = 0.7;
   var ImagePreview = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     var _imagesStatus$openInd, _imagesStatus$openInd2;
+
     var style = props.style,
-      className = props.className,
-      images = props.images,
-      _props$loop = props.loop,
-      loop = _props$loop === void 0 ? false : _props$loop,
-      openIndex = props.openIndex,
-      fit = props.fit,
-      _props$noselect = props.noselect,
-      noselect = _props$noselect === void 0 ? true : _props$noselect,
-      _props$displayDuratio = props.displayDuration,
-      displayDuration = _props$displayDuratio === void 0 ? 350 : _props$displayDuratio,
-      _props$spaceBetween = props.spaceBetween,
-      spaceBetween = _props$spaceBetween === void 0 ? 0 : _props$spaceBetween,
-      _props$showLoading = props.showLoading,
-      showLoading = _props$showLoading === void 0 ? true : _props$showLoading,
-      loadingArea = props.loadingArea,
-      errorArea = props.errorArea,
-      _props$showError = props.showError,
-      showError = _props$showError === void 0 ? true : _props$showError,
-      retryTime = props.retryTime,
-      staticLabel = props.staticLabel,
-      replaceFallbackWhenLoaded = props.replaceFallbackWhenLoaded,
-      scrollBezier = props.scrollBezier,
-      _props$lazyloadCount = props.lazyloadCount,
-      lazyloadCount = _props$lazyloadCount === void 0 ? 1 : _props$lazyloadCount,
-      _props$swipeToClose = props.swipeToClose,
-      swipeToClose = _props$swipeToClose === void 0 ? true : _props$swipeToClose,
-      getMinScale = props.getMinScale,
-      getMaxScale = props.getMaxScale,
-      getDoubleClickScale = props.getDoubleClickScale,
-      getContainer = props.getContainer,
-      getThumbBounds = props.getThumbBounds,
-      renderIndicator = props.renderIndicator,
-      _onChange = props.onChange,
-      _onAfterChange = props.onAfterChange,
-      onImageClick = props.onImageClick,
-      onImageDoubleClick = props.onImageDoubleClick,
-      onImageLongTap = props.onImageLongTap,
-      close = props.close,
-      onClose = props.onClose,
-      onTouchStart = props.onTouchStart,
-      onTouchMove = props.onTouchMove,
-      onTouchEnd = props.onTouchEnd,
-      _props$indicatorPos = props.indicatorPos,
-      indicatorPos = _props$indicatorPos === void 0 ? 'start' : _props$indicatorPos,
-      otherProps = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+        className = props.className,
+        images = props.images,
+        _props$loop = props.loop,
+        loop = _props$loop === void 0 ? false : _props$loop,
+        openIndex = props.openIndex,
+        fit = props.fit,
+        _props$noselect = props.noselect,
+        noselect = _props$noselect === void 0 ? true : _props$noselect,
+        _props$displayDuratio = props.displayDuration,
+        displayDuration = _props$displayDuratio === void 0 ? 350 : _props$displayDuratio,
+        _props$spaceBetween = props.spaceBetween,
+        spaceBetween = _props$spaceBetween === void 0 ? 0 : _props$spaceBetween,
+        _props$showLoading = props.showLoading,
+        showLoading = _props$showLoading === void 0 ? true : _props$showLoading,
+        loadingArea = props.loadingArea,
+        errorArea = props.errorArea,
+        _props$showError = props.showError,
+        showError = _props$showError === void 0 ? true : _props$showError,
+        retryTime = props.retryTime,
+        staticLabel = props.staticLabel,
+        replaceFallbackWhenLoaded = props.replaceFallbackWhenLoaded,
+        scrollBezier = props.scrollBezier,
+        _props$lazyloadCount = props.lazyloadCount,
+        lazyloadCount = _props$lazyloadCount === void 0 ? 1 : _props$lazyloadCount,
+        _props$swipeToClose = props.swipeToClose,
+        swipeToClose = _props$swipeToClose === void 0 ? true : _props$swipeToClose,
+        getMinScale = props.getMinScale,
+        getMaxScale = props.getMaxScale,
+        getDoubleClickScale = props.getDoubleClickScale,
+        getContainer = props.getContainer,
+        getThumbBounds = props.getThumbBounds,
+        renderIndicator = props.renderIndicator,
+        _onChange = props.onChange,
+        _onAfterChange = props.onAfterChange,
+        onImageClick = props.onImageClick,
+        onImageDoubleClick = props.onImageDoubleClick,
+        onImageLongTap = props.onImageLongTap,
+        close = props.close,
+        onClose = props.onClose,
+        onTouchStart = props.onTouchStart,
+        onTouchMove = props.onTouchMove,
+        onTouchEnd = props.onTouchEnd,
+        _props$indicatorPos = props.indicatorPos,
+        indicatorPos = _props$indicatorPos === void 0 ? 'start' : _props$indicatorPos,
+        otherProps = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
     var system = (0, _helpers.useSystem)();
     var domRef = (0, _react.useRef)(null);
     var imagesRef = (0, _react.useRef)([]);
@@ -107,22 +112,28 @@
     var lastScaleRef = (0, _react.useRef)(0);
     var closingRef = (0, _react.useRef)(false);
     var isInitialMount = (0, _react.useRef)(false);
+
     var _useState = (0, _react.useState)({}),
-      showPlaceholders = _useState[0],
-      setPlaceholders = _useState[1];
+        showPlaceholders = _useState[0],
+        setPlaceholders = _useState[1];
+
     var _useRefState = (0, _helpers.useRefState)([]),
-      imagesStatus = _useRefState[0],
-      imagesStatusRef = _useRefState[1],
-      setImagesStatus = _useRefState[2];
+        imagesStatus = _useRefState[0],
+        imagesStatusRef = _useRefState[1],
+        setImagesStatus = _useRefState[2];
+
     var _useState2 = (0, _react.useState)(null),
-      transImageInfo = _useState2[0],
-      setTransImageInfo = _useState2[1];
+        transImageInfo = _useState2[0],
+        setTransImageInfo = _useState2[1];
+
     var openLoaded = (_imagesStatus$openInd = imagesStatus[openIndex]) == null ? void 0 : _imagesStatus$openInd.loaded;
     var openAnimated = (_imagesStatus$openInd2 = imagesStatus[openIndex]) == null ? void 0 : _imagesStatus$openInd2.animated;
     var visible = openIndex >= 0 && openIndex < images.length;
+
     var _useWindowSize = (0, _helpers.useWindowSize)(true),
-      windowWidth = _useWindowSize.windowWidth,
-      windowHeight = _useWindowSize.windowHeight;
+        windowWidth = _useWindowSize.windowWidth,
+        windowHeight = _useWindowSize.windowHeight;
+
     (0, _react.useImperativeHandle)(ref, function () {
       return {
         dom: domRef.current,
@@ -139,6 +150,7 @@
         carouselRef.current && carouselRef.current.changeIndex(openIndex, true);
         setImagesStatus(images.map(function (_, index) {
           var _imagesStatusRef$curr;
+
           return {
             firstLoaded: ((_imagesStatusRef$curr = imagesStatusRef.current[index]) == null ? void 0 : _imagesStatusRef$curr.firstLoaded) || false,
             animated: index !== openIndex
@@ -149,18 +161,18 @@
         // 移除长按事件监听
         // @en Remove long press event listener
         longTimerRef.current && clearTimeout(longTimerRef.current);
-        longTapCheckingRef.current = false;
-        // 图片状态重置
+        longTapCheckingRef.current = false; // 图片状态重置
         // @en Reset image state
+
         setImagesStatus(imagesStatusRef.current.map(function (status) {
           return (0, _extends5.default)({}, status, {
             animated: false,
             loaded: false
           });
         }));
-        transformersRef.current = [];
-        // 移除过渡图片
+        transformersRef.current = []; // 移除过渡图片
         // @en Remove transition image
+
         removeChild(document.querySelector('.image-preview-fake-trans-image'));
         setTransImageInfo(null);
         setPlaceholders({});
@@ -169,6 +181,7 @@
           mounted && onClose && onClose();
         }, displayDuration);
       }
+
       isInitialMount.current = true;
     }, [visible]);
     (0, _react.useEffect)(function () {
@@ -200,31 +213,36 @@
         transformer && transformer.setMaxScale(getImageMaxScale(index));
       });
     }, [getMaxScale]);
+
     function removeChild(child) {
       try {
         child && document.body.removeChild(child);
       } catch (e) {}
-    }
-
-    // 监听滑动到上下边缘后还在往外滑动的操作，则关闭弹窗
+    } // 监听滑动到上下边缘后还在往外滑动的操作，则关闭弹窗
     // @en Monitor the operation of sliding out after sliding to the upper and lower edges, then close the popup
+
+
     function handlePreventCallback(_, dir) {
       if (!isTransforming() && dir === 'y') {
         touchingSideDisRef.current += 1;
       }
     }
-
     /**
      * 缩放插件初始化
      * @en Zoom plugin initialization
      */
+
+
     function initTransformer(index) {
       var _imagesRef$current$in;
+
       var imageDom = (_imagesRef$current$in = imagesRef.current[index]) == null ? void 0 : _imagesRef$current$in.dom;
       var wrapDom = imageDom == null ? void 0 : imageDom.parentElement;
+
       if (!imageDom || !wrapDom) {
         return;
       }
+
       if (transformersRef.current[index]) {
         transformersRef.current[index].setDom(wrapDom);
       } else {
@@ -243,15 +261,16 @@
           },
           onTransform: function onTransform() {
             var _transformersRef$curr, _imagesStatusRef$curr2, _imagesStatusRef$curr3;
+
             // 图片放大再缩小，解决ios图片放大后模糊的问题
             // @en The image is zoomed in and then zoomed out to solve the problem of blurring after zooming in on ios images
             var img = imageDomsRef.current[index];
             var trans = ((_transformersRef$curr = transformersRef.current[index]) == null ? void 0 : _transformersRef$curr.getTransform == null ? void 0 : _transformersRef$curr.getTransform()) || {};
             var width = (_imagesStatusRef$curr2 = imagesStatusRef.current[index]) == null ? void 0 : _imagesStatusRef$curr2.originWidth;
             var height = (_imagesStatusRef$curr3 = imagesStatusRef.current[index]) == null ? void 0 : _imagesStatusRef$curr3.originHeight;
-            var scale = trans.scale || 1;
-            // 判断下只有图片缩放发生改变时重写图片样式
+            var scale = trans.scale || 1; // 判断下只有图片缩放发生改变时重写图片样式
             // @en It is judged that only the image style is rewritten when the zoom of the image changes.
+
             if (img && width && height && lastScaleRef.current !== scale) {
               lastScaleRef.current = scale;
               var atCenter = !imageHasOverflow(img) ? ' translateY(-50%)' : '';
@@ -270,18 +289,23 @@
           onZoomEnd: function onZoomEnd(_1, _2, pinchStartCenter) {
             setPlaceholders(function (holders) {
               var _extends2;
+
               return (0, _extends5.default)({}, holders, (_extends2 = {}, _extends2[index] = false, _extends2));
             });
             var image = imageDomsRef.current[index];
             var transformer = transformersRef.current[index];
+
             if (!image || !transformer || transformer.getTransform().scale < 1) {
               return;
             }
+
             var imageRect = image.getBoundingClientRect();
+
             if (imageRect.width > windowWidth && imageRect.height > windowHeight) {
               if (pinchStartCenter && pinchStartCenter.length) {
                 transformer.setCenter.apply(transformer, pinchStartCenter);
               }
+
               transformer.setFixedX(false);
               transformer.setFixedY(false);
             } else if (imageRect.height <= windowHeight) {
@@ -300,19 +324,24 @@
           maxScale: getImageMaxScale(index)
         });
       }
+
       setOriginBoundary(index);
     }
+
     function imageHasOverflow(img) {
       return Boolean(img && !img.classList.contains('preview-fit-contain-y'));
     }
+
     function setOriginBoundary(index) {
       var imageEle = imagesRef.current[index];
-      var imageDom = imageEle == null ? void 0 : imageEle.dom;
-      // 边界范围变为图片范围和容器范围的并集
+      var imageDom = imageEle == null ? void 0 : imageEle.dom; // 边界范围变为图片范围和容器范围的并集
       // @en The bounding range becomes the union of the image range and the container range
+
       if (imageDom != null && imageDom.parentElement && imageEle != null && imageEle.image) {
         var _rect = imageEle.image.getBoundingClientRect();
+
         var eleRect = imageDom.parentElement.getBoundingClientRect();
+
         if (transformersRef.current[index]) {
           transformersRef.current[index].setBoundary({
             left: Math.min(_rect.left, eleRect.left),
@@ -323,111 +352,137 @@
         }
       }
     }
-
     /**
      * 获取最小缩放倍数
      * @en Get the minimum zoom factor
      */
+
+
     function getImageMinScale(index) {
       var currentIndex = index === void 0 ? innerIndexRef.current : index;
       var imageDom = imageDomsRef.current[currentIndex];
+
       if (!imageDom) {
         return 1;
       }
+
       if (getMinScale) {
         return getMinScale(imageDom, currentIndex);
       }
+
       return MIN_ZOOM;
     }
-
     /**
      * 获取最大缩放倍数
      * @en Get the maximum zoom factor
      */
+
+
     function getImageMaxScale(index) {
       var currentIndex = index === void 0 ? innerIndexRef.current : index;
       var imageDom = imageDomsRef.current[currentIndex];
+
       if (!imageDom) {
         return 1;
       }
+
       if (getMaxScale) {
         return getMaxScale(imageDom, currentIndex);
       }
+
       var imageWidth = imageDom.naturalWidth;
       var imageHeight = imageDom.naturalHeight;
       var maxScale = 1;
+
       if (imageWidth > imageHeight) {
         maxScale = imageWidth / windowWidth * MAX_ZOOM;
       } else {
         maxScale = Math.max(MAX_ZOOM, imageWidth / windowWidth);
       }
+
       return maxScale;
     }
-
     /**
      * 计算双击时图片缩放倍数
      * @en Calculate the zoom factor of the image when double-clicking
      */
+
+
     function getImageDoubleClickScale(currentScale) {
       var index = innerIndexRef.current;
       var imageDom = imageDomsRef.current[index];
+
       if (!imageDom) {
         return 1;
       }
+
       var maxScale = getImageMaxScale(index);
+
       if (getDoubleClickScale) {
         return getDoubleClickScale(currentScale, maxScale, imageDom, index);
       }
+
       var imageWidth = imageDom.naturalWidth;
       var imageHeight = imageDom.naturalHeight;
       var fitScale = imageWidth > imageHeight ? imageWidth / windowWidth * windowHeight / imageHeight : 1;
       var dblScale = 2;
+
       if (fitScale >= 2) {
         dblScale = Math.min(maxScale, fitScale);
       }
+
       var current = Number(currentScale.toFixed(3));
       var dbl = Number(dblScale.toFixed(3));
       return current >= 1 && current < dbl ? dbl : 1;
     }
-
     /**
      * 还原缩放至原始位置
      * @en Revert zoom to original position
      */
+
+
     function restoreTransformer(index) {
       var transformer = transformersRef.current[index];
+
       if (transformer) {
         transformer.restore();
       }
     }
-
     /**
      * 是否正处于缩放状态
      * @en Whether it is zooming
      */
+
+
     function isTransforming(index) {
       var _transformersRef$curr2;
+
       var currentIndex = index === void 0 ? innerIndexRef.current : index;
       return (_transformersRef$curr2 = transformersRef.current[currentIndex]) == null ? void 0 : _transformersRef$curr2.busy == null ? void 0 : _transformersRef$curr2.busy();
     }
-
     /**
      * 是否已经放大过
      * @en Whether is has been zoomed in
      */
+
+
     function isTransformed() {
       var _transformersRef$curr3;
+
       return (_transformersRef$curr3 = transformersRef.current[innerIndexRef.current]) == null ? void 0 : _transformersRef$curr3.dirty == null ? void 0 : _transformersRef$curr3.dirty();
     }
+
     function isTapStop() {
       var _transformersRef$curr4;
+
       return (_transformersRef$curr4 = transformersRef.current[innerIndexRef.current]) == null ? void 0 : _transformersRef$curr4.isTapStop == null ? void 0 : _transformersRef$curr4.isTapStop();
     }
-
     /**
      * 计算距离左右侧的距离，如果为0说明到边缘了，可以进行正常轮播操作
      * @en Calculate the distance from the left and right sides. If it is 0, it means that the edge is reached, and the normal rotation operation can be performed.
      */
+
+
     function transformTouchSide() {
       var transformer = transformersRef.current[innerIndexRef.current];
       var toLeft = transformer == null ? void 0 : transformer.toLeft == null ? void 0 : transformer.toLeft();
@@ -438,20 +493,23 @@
         right: !toRight
       };
     }
+
     function handleImageWrapTouchStart(e) {
       if (onTouchStart && onTouchStart(e, innerIndexRef.current)) {
         return true;
       }
+
       var touches = e.touches;
       touchStartXRef.current = e.touches && e.touches[0] ? e.touches[0].clientX : 0;
       movedRef.current = false;
-      dblClickingRef.current = false;
-      // 单点长按才触发长按
+      dblClickingRef.current = false; // 单点长按才触发长按
       // @en A single long press triggers a long press
+
       if (touches.length === 1) {
         if (!closingRef.current) {
           longTapCheckingRef.current = true;
         }
+
         longTimerRef.current = window.setTimeout(function () {
           if (longTapCheckingRef.current) {
             longTapCheckingRef.current = false;
@@ -462,61 +520,72 @@
       } else {
         longTapCheckingRef.current = false;
       }
+
       if (isTapStop()) {
         movedRef.current = true;
-      }
-      // 缩放状态下，未到边缘时不触发轮播手势
+      } // 缩放状态下，未到边缘时不触发轮播手势
       // @en In the zoomed state, the carousel gesture is not triggered when the edge is not reached
+
+
       if (isTransforming()) {
         startTouchingSideRef.current = transformTouchSide().side;
         return !startTouchingSideRef.current;
       }
     }
+
     function handleImageWrapTouchMove(e) {
       movedRef.current = true;
       longTapCheckingRef.current = false;
       longTimerRef.current && clearTimeout(longTimerRef.current);
+
       if (onTouchMove && onTouchMove(e, innerIndexRef.current)) {
         return true;
       }
+
       var evt = e.changedTouches[0];
       var touchMoveX = evt.clientX || 0;
-      var posDisX = touchMoveX - touchStartXRef.current;
-      // 缩放状态下，到边缘时如果还在往外滑动，则触发轮播手势
+      var posDisX = touchMoveX - touchStartXRef.current; // 缩放状态下，到边缘时如果还在往外滑动，则触发轮播手势
       // @en In the zoomed state, if it is still swiped out when reaching the edge, the carousel gesture is triggered
+
       if (isTransforming()) {
         var sideInfo = transformTouchSide();
         return !startTouchingSideRef.current || !(sideInfo.left && posDisX > 0 || sideInfo.right && posDisX < 0);
       }
     }
+
     function handleImageWrapTouchEnd(e) {
       if (onTouchEnd && onTouchEnd(e, innerIndexRef.current)) {
         return true;
-      }
-      // 滑动到上下边缘后还在往外滑动，则关闭弹窗
+      } // 滑动到上下边缘后还在往外滑动，则关闭弹窗
       // @en After sliding to the upper and lower edges and still sliding outwards, close the popup box
       // needClose为触发touchmove的次数，6和3是相对值，表示判断在往外滑动的敏感度，当未放大时对向外滑动手势更敏感
       // @en needClose is the number of times the touchmove is triggered, 6 and 3 are relative values, indicating the sensitivity of judging the outward sliding, and it is more sensitive to the outward sliding gesture when it is not zoomed in
+
+
       var needClose = swipeToClose && touchingSideDisRef.current >= (isTransformed() ? 6 : 3);
       touchingSideDisRef.current = 0;
       longTapCheckingRef.current = false;
       longTimerRef.current && clearTimeout(longTimerRef.current);
+
       if (needClose) {
         goClose(e);
         return true;
-      }
-      // 缩放状态下，未到边缘时不触发轮播手势
+      } // 缩放状态下，未到边缘时不触发轮播手势
       // @en In the zoomed state, the carousel gesture is not triggered when the edge is not reached
+
+
       if (isTransforming() && !transformTouchSide().side) {
         return true;
       }
     }
+
     function handleImageClick(e) {
       if (movedRef.current) {
         return;
-      }
-      // 300ms内再次点击则触发doubleClick，否则触发click
+      } // 300ms内再次点击则触发doubleClick，否则触发click
       // @en Click again within 300ms to trigger doubleClick, otherwise trigger click
+
+
       dblTimerRef.current = window.setTimeout(function () {
         if (!dblClickingRef.current) {
           if (!onImageClick || !onImageClick(innerIndexRef.current, e)) {
@@ -525,29 +594,35 @@
         }
       }, 300);
     }
+
     function handleImageDoubleClick(e) {
       if (dblClickingRef.current) {
         // 防止重复触发dblclick
         return;
       }
+
       dblClickingRef.current = true;
+
       if (dblTimerRef.current) {
         clearTimeout(dblTimerRef.current);
         dblTimerRef.current = null;
       }
+
       var index = innerIndexRef.current;
-      onImageDoubleClick && onImageDoubleClick(index, e);
-      // 双击时根据配置放大或缩小
+      onImageDoubleClick && onImageDoubleClick(index, e); // 双击时根据配置放大或缩小
       // @en Zoom in or out according to configuration when double-clicking
+
       var transformer = transformersRef.current[index];
+
       if (transformer) {
         var trans = transformer.getTransform();
         var rate = trans.scale || 1;
         var dblScale = getImageDoubleClickScale(rate);
+
         if (dblScale === 1) {
-          var img = imageDomsRef.current[index];
-          // 长图双击还原缩放特殊处理，因为transform和scroll不能完全同步，所以先zoomTo到原点再restore
+          var img = imageDomsRef.current[index]; // 长图双击还原缩放特殊处理，因为transform和scroll不能完全同步，所以先zoomTo到原点再restore
           // @en Double-click the long image to restore zoom special processing, because transform and scroll cannot be completely synchronized, so first zoomTo to the origin and then restore
+
           if (imageHasOverflow(img)) {
             transformer.zoomToScreenCenter(1, [windowWidth / 2, windowHeight / 2], {
               duration: 200,
@@ -567,48 +642,57 @@
         }
       }
     }
+
     var handleClick = (0, _helpers.useSingleAndDoubleClick)(handleImageClick, handleImageDoubleClick);
+
     function goClose(e) {
       if (closingRef.current) {
         return;
       }
+
       closingRef.current = true;
       close(e);
     }
-
     /**
      * 更改指定图片状态
      * @en Change specified image status
      */
+
+
     function setImagesStatusByIndex(index, data) {
       var newStatus = imagesStatusRef.current.slice();
       newStatus[index] = (0, _extends5.default)({}, newStatus[index] || {}, data);
       setImagesStatus(newStatus);
     }
-
     /**
      * 缩略图放大过渡动画设置
      * @en Set thumbnail zoom transition animation
      */
+
+
     function setDisplayAnimation(index) {
       var _imagesStatusRef$curr4;
+
       var firstLoaded = (_imagesStatusRef$curr4 = imagesStatusRef.current[index]) == null ? void 0 : _imagesStatusRef$curr4.firstLoaded;
-      var fallbackSrc = replaceFallbackWhenLoaded && firstLoaded ? images[index].src : images[index].fallbackSrc;
-      // 用户设置了getThumbBounds和images的fallbackSrc属性才有放大过渡效果
+      var fallbackSrc = replaceFallbackWhenLoaded && firstLoaded ? images[index].src : images[index].fallbackSrc; // 用户设置了getThumbBounds和images的fallbackSrc属性才有放大过渡效果
       // @en Set the fallbackSrc attribute of getThumbBounds and images to have a zoom-in transition effect
+
       if (!getThumbBounds || !images[index] || !fallbackSrc) {
         resetAnimation(index);
         return;
-      }
-      // 获取缩略图的rect，如果没获取到就取消放大过渡效果
+      } // 获取缩略图的rect，如果没获取到就取消放大过渡效果
       // @en Get the rect of the thumbnail, if it is gotten, cancel the zoom transition effect
+
+
       var thumbBounds = getThumbBounds(index);
+
       if (!thumbBounds || !thumbBounds.width || !thumbBounds.height) {
         resetAnimation(index);
         return;
-      }
-      // 伪造一个fixed的图做小图放大效果
+      } // 伪造一个fixed的图做小图放大效果
       // @en Forge a fixed image to make a small image enlargement effect
+
+
       var transImage = new Image();
       transImageRef.current = transImage;
       transImage.classList.add('image-preview-fake-trans-image');
@@ -618,23 +702,25 @@
       transImage.style.opacity = '0';
       transImage.style.transitionDuration = displayDuration + "ms";
       transImage.style.webkitTransitionDuration = displayDuration + "ms";
-      document.body.appendChild(transImage);
-      // 拿到放大之后的位置rect，没拿到就取消小图放大效果
+      document.body.appendChild(transImage); // 拿到放大之后的位置rect，没拿到就取消小图放大效果
       // @en Get the zoomed-in position rect, and cancel the zoom-in effect if not getting it
+
       getNewImageBounds(index, fallbackSrc, transImage, function (rect) {
         if (!rect || !rect.width || !rect.height) {
           removeChild(transImage);
           resetAnimation(index);
           return;
-        }
-        // 通过小图rect变换到大图rect加transition做放大效果
+        } // 通过小图rect变换到大图rect加transition做放大效果
         // @en Transform the small image rect to the large image rect and add transition to make a magnification effect
+
+
         (0, _mobileUtils.nextTick)(function () {
           transImage.style.opacity = '1';
           setImageBounds(transImage, rect, thumbBounds);
           setTimeout(function () {
             setPlaceholders(function (holders) {
               var _extends3;
+
               return (0, _extends5.default)({}, holders, (_extends3 = {}, _extends3[index] = true, _extends3));
             });
           }, Math.max(0, displayDuration - 80));
@@ -644,22 +730,24 @@
         });
       });
     }
-
     /**
      * 取消小图放大过渡效果
      * @en Cancel the thumbnail zoom transition effect
      */
+
+
     function resetAnimation(index) {
       setImagesStatusByIndex(index, {
         animated: true
       });
       setTransImageInfo(null);
     }
-
     /**
      * 根据rect设置图片的位置
      * @en Set the position of the image according to the rect
      */
+
+
     function setImageBounds(image, rect, thumbRect) {
       // 这里为保持原有比例，只设置宽度变化，高度会随宽度等比变化
       image.style.width = thumbRect.width + "px";
@@ -669,16 +757,18 @@
       image.style.transformOrigin = 'left top';
       image.style.webkitTransformOrigin = 'left top';
     }
-
     /**
      * 计算放大之后的位置rect
      * @en Calculate the position rect after zooming in
      */
+
+
     function getNewImageBounds(index, transSrc, transImage, callback) {
       if (!transSrc) {
         callback(null);
         return;
       }
+
       setTransImageInfo({
         src: transSrc,
         fit: images[index].fit,
@@ -694,11 +784,12 @@
         }
       });
     }
-
     /**
      * @en 渲染轮播+图片展示
      * Rendering carousel + displaying image
      */
+
+
     function renderContent(carouselProps, allImages, getImageProps) {
       return /*#__PURE__*/_react.default.createElement(_carousel.default, (0, _extends5.default)({
         autoPlay: false,
@@ -718,25 +809,29 @@
           boxHeight: windowHeight,
           bottomOverlap: null
         }, getImageProps(image, index))));
+
         return image.extraNode ? /*#__PURE__*/_react.default.createElement("div", {
           className: "preview-image-wrap-container",
           key: "outer-" + index
         }, innerNode, image.extraNode) : innerNode;
       }));
     }
+
     function getImageClass(index) {
       var _ref = imagesStatus[index] || {},
-        loaded = _ref.loaded,
-        animated = _ref.animated;
+          loaded = _ref.loaded,
+          animated = _ref.animated;
+
       return (0, _mobileUtils.cls)('preview-image', {
         'preview-hidden': index === openIndex && (!loaded || !animated)
       });
     }
-
     /**
      * 每张图片的样式
      * @en style of each image
      */
+
+
     function getImageStyle() {
       // 因为缩放的容器必须是没有transform和transition的纯净元素
       // @en Because the scaled container must be a pure element without transform and transition
@@ -745,29 +840,31 @@
       return {
         overflow: 'visible'
       };
-    }
+    } // 渲染轮播指引器
+
 
-    // 渲染轮播指引器
     function renderPreviewIndicator(currentIndex, total, lastIndex) {
       if (renderIndicator) {
         return renderIndicator(currentIndex, total, lastIndex);
       }
+
       return openLoaded ? /*#__PURE__*/_react.default.createElement(_portal.default, null, /*#__PURE__*/_react.default.createElement("div", {
         className: "image-preview-indicator"
       }, currentIndex + 1, "/", total)) : null;
-    }
-
-    // ios在重设style时图片会消失一下造成闪动，因此在底下垫一张图
+    } // ios在重设style时图片会消失一下造成闪动，因此在底下垫一张图
     // @en In iOS when resetting the style, the image will disappear and cause flickering, so put a image at the bottom
     // 优先过渡图，其次用原图
     // @en Prioritize the transition image, followed by the original image
+
+
     function renderImagePlaceholder(src, index, fitCss) {
       var _ref2 = imagesStatus[index] || {},
-        originWidth = _ref2.originWidth,
-        originHeight = _ref2.originHeight,
-        originLeft = _ref2.originLeft,
-        originTop = _ref2.originTop,
-        hasOverflow = _ref2.hasOverflow;
+          originWidth = _ref2.originWidth,
+          originHeight = _ref2.originHeight,
+          originLeft = _ref2.originLeft,
+          originTop = _ref2.originTop,
+          hasOverflow = _ref2.hasOverflow;
+
       var trans = hasOverflow ? {} : (0, _helpers.getStyleWithVendor)({
         transform: 'translateY(-50%)'
       });
@@ -785,6 +882,7 @@
         }, fitObj, trans)
       }) : null;
     }
+
     function renderLoadingArea(index) {
       // loadingArea提出来，放到过渡图上层
       // @en The loadingArea is extracted and placed on the upper layer of the transition image
@@ -796,6 +894,7 @@
         radius: 7
       }))) : loadingArea;
     }
+
     return /*#__PURE__*/_react.default.createElement(_contextProvider.ContextLayout, null, function (_ref3) {
       var prefixCls = _ref3.prefixCls;
       return /*#__PURE__*/_react.default.createElement(_portal.default, {
@@ -860,17 +959,20 @@
               originLeft: imageEle.offsetLeft,
               hasOverflow: imageHasOverflow(imageEle)
             });
+
             if (index === openIndex) {
               initTransformer(index);
             } else {
               setPlaceholders(function (holders) {
                 var _extends4;
+
                 return (0, _extends5.default)({}, holders, (_extends4 = {}, _extends4[index] = true, _extends4));
               });
             }
           },
           onError: function onError() {
             imageDomsRef.current[index] = null;
+
             if (index === openIndex) {
               var transImage = transImageInfo == null ? void 0 : transImageInfo.movingImage;
               removeChild(transImage);
@@ -903,6 +1005,7 @@
       }) : null);
     });
   });
+
   function methodsGenerator(Comp) {
     return {
       /**
@@ -914,8 +1017,8 @@
       open: (0, _methods.open)(Comp)
     };
   }
-  var ImagePreviewWithGlobalContext = (0, _contextProvider.CompWithGlobalContext)(ImagePreview);
 
+  var ImagePreviewWithGlobalContext = (0, _contextProvider.CompWithGlobalContext)(ImagePreview);
   /**
    * 图片预览组件，支持循环轮播、双指/双击缩放、缩略图放大效果。
    * @en The image preview, supports circular rotation, two-finger/double-tap zoom, and thumbnail zoom effects.
@@ -924,6 +1027,8 @@
    * @name 图片预览
    * @name_en ImagePreview
    */
+
   var _default = (0, _mobileUtils.componentWrapper)(ImagePreview, methodsGenerator(ImagePreviewWithGlobalContext));
+
   _exports.default = _default;
 });