rc-image - npm Package Compare versions

Comparing version 7.4.0 to 7.5.0

es/hooks/useImageTransform.d.ts

@@ -10,3 +10,5 @@ /// <reference types="react" />
 };
-export type TransformAction = 'flipY' | 'flipX' | 'rotateLeft' | 'rotateRight' | 'zoomIn' | 'zoomOut' | 'close' | 'prev' | 'next' | 'wheel' | 'doubleClick' | 'move' | 'dragRebound';
+export type TransformAction = 'flipY' | 'flipX' | 'rotateLeft' | 'rotateRight' | 'zoomIn' | 'zoomOut' | 'close' | 'prev' | 'next' | 'wheel' | 'doubleClick' | 'move' | 'dragRebound' | 'touchZoom';
+export type UpdateTransformFunc = (newTransform: Partial<TransformType>, action: TransformAction) => void;
+export type DispatchZoomChangeFunc = (ratio: number, action: TransformAction, centerX?: number, centerY?: number, isTouch?: boolean) => void;
 export default function useImageTransform(imgRef: React.MutableRefObject<HTMLImageElement>, minScale: number, maxScale: number, onTransform: (info: {
@@ -25,4 +27,4 @@ transform: TransformType;
     resetTransform: (action: TransformAction) => void;
-    updateTransform: (newTransform: Partial<TransformType>, action: TransformAction) => void;
-    dispatchZoomChange: (ratio: number, action: TransformAction, clientX?: number, clientY?: number) => void;
+    updateTransform: UpdateTransformFunc;
+    dispatchZoomChange: DispatchZoomChangeFunc;
 };

es/hooks/useImageTransform.js

@@ -54,4 +54,4 @@ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 
-  /** Scale according to the position of clientX and clientY */
-  var dispatchZoomChange = function dispatchZoomChange(ratio, action, clientX, clientY) {
+  /** Scale according to the position of centerX and centerY */
+  var dispatchZoomChange = function dispatchZoomChange(ratio, action, centerX, centerY, isTouch) {
     var _imgRef$current = imgRef.current,
@@ -67,12 +67,13 @@ width = _imgRef$current.width,
     if (newScale > maxScale) {
+      newScale = maxScale;
       newRatio = maxScale / transform.scale;
-      newScale = maxScale;
     } else if (newScale < minScale) {
-      newRatio = minScale / transform.scale;
-      newScale = minScale;
+      // For mobile interactions, allow scaling down to the minimum scale.
+      newScale = isTouch ? newScale : minScale;
+      newRatio = newScale / transform.scale;
     }
 
     /** Default center point scaling */
-    var mergedClientX = clientX !== null && clientX !== void 0 ? clientX : innerWidth / 2;
-    var mergedClientY = clientY !== null && clientY !== void 0 ? clientY : innerHeight / 2;
+    var mergedCenterX = centerX !== null && centerX !== void 0 ? centerX : innerWidth / 2;
+    var mergedCenterY = centerY !== null && centerY !== void 0 ? centerY : innerHeight / 2;
     var diffRatio = newRatio - 1;
@@ -83,4 +84,4 @@ /** Deviation calculated from image size */
     /** The difference between the click position and the edge of the document */
-    var diffOffsetLeft = diffRatio * (mergedClientX - transform.x - offsetLeft);
-    var diffOffsetTop = diffRatio * (mergedClientY - transform.y - offsetTop);
+    var diffOffsetLeft = diffRatio * (mergedCenterX - transform.x - offsetLeft);
+    var diffOffsetTop = diffRatio * (mergedCenterY - transform.y - offsetTop);
     /** Final positioning */
@@ -87,0 +88,0 @@ var newX = transform.x - (diffOffsetLeft - diffImgX);

es/Operations.js

@@ -82,3 +82,3 @@ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
     type: 'zoomOut',
-    disabled: scale === minScale
+    disabled: scale <= minScale
   }, {
@@ -85,0 +85,0 @@ icon: zoomIn,

es/Preview.js

@@ -12,10 +12,10 @@ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import KeyCode from "rc-util/es/KeyCode";
-import { warning } from "rc-util/es/warning";
 import React, { useContext, useEffect, useRef, useState } from 'react';
 import { PreviewGroupContext } from "./context";
-import getFixScaleEleTransPosition from "./getFixScaleEleTransPosition";
 import useImageTransform from "./hooks/useImageTransform";
+import useMouseEvent from "./hooks/useMouseEvent";
+import useTouchEvent from "./hooks/useTouchEvent";
 import useStatus from "./hooks/useStatus";
 import Operations from "./Operations";
-import { BASE_SCALE_RATIO, WHEEL_MAX_SCALE_RATIO } from "./previewConfig";
+import { BASE_SCALE_RATIO } from "./previewConfig";
 var PreviewImage = function PreviewImage(_ref) {
@@ -76,15 +76,9 @@ var fallback = _ref.fallback,
   var imgRef = useRef();
-  var downPositionRef = useRef({
-    deltaX: 0,
-    deltaY: 0,
-    transformX: 0,
-    transformY: 0
-  });
-  var _useState = useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    isMoving = _useState2[0],
-    setMoving = _useState2[1];
   var groupContext = useContext(PreviewGroupContext);
   var showLeftOrRightSwitches = groupContext && count > 1;
   var showOperationsProgress = groupContext && count >= 1;
+  var _useState = useState(true),
+    _useState2 = _slicedToArray(_useState, 2),
+    enableTransition = _useState2[0],
+    setEnableTransition = _useState2[1];
   var _useImageTransform = useImageTransform(imgRef, minScale, maxScale, onTransform),
@@ -95,10 +89,13 @@ transform = _useImageTransform.transform,
     dispatchZoomChange = _useImageTransform.dispatchZoomChange;
-  var _useState3 = useState(true),
-    _useState4 = _slicedToArray(_useState3, 2),
-    enableTransition = _useState4[0],
-    setEnableTransition = _useState4[1];
+  var _useMouseEvent = useMouseEvent(imgRef, movable, visible, scaleStep, transform, updateTransform, dispatchZoomChange),
+    isMoving = _useMouseEvent.isMoving,
+    onMouseDown = _useMouseEvent.onMouseDown,
+    onWheel = _useMouseEvent.onWheel;
+  var _useTouchEvent = useTouchEvent(imgRef, movable, visible, minScale, transform, updateTransform, dispatchZoomChange),
+    isTouching = _useTouchEvent.isTouching,
+    onTouchStart = _useTouchEvent.onTouchStart,
+    onTouchMove = _useTouchEvent.onTouchMove,
+    onTouchEnd = _useTouchEvent.onTouchEnd;
   var rotate = transform.rotate,
-    scale = transform.scale,
-    x = transform.x,
-    y = transform.y;
+    scale = transform.scale;
   var wrapClassName = classnames(_defineProperty({}, "".concat(prefixCls, "-moving"), isMoving));
@@ -157,60 +154,2 @@ useEffect(function () {
   };
-  var onMouseUp = function onMouseUp() {
-    if (visible && isMoving) {
-      setMoving(false);
-      /** No need to restore the position when the picture is not moved, So as not to interfere with the click */
-      var _downPositionRef$curr = downPositionRef.current,
-        transformX = _downPositionRef$curr.transformX,
-        transformY = _downPositionRef$curr.transformY;
-      var hasChangedPosition = x !== transformX && y !== transformY;
-      if (!hasChangedPosition) {
-        return;
-      }
-      var width = imgRef.current.offsetWidth * scale;
-      var height = imgRef.current.offsetHeight * scale;
-      // eslint-disable-next-line @typescript-eslint/no-shadow
-      var _imgRef$current$getBo = imgRef.current.getBoundingClientRect(),
-        left = _imgRef$current$getBo.left,
-        top = _imgRef$current$getBo.top;
-      var isRotate = rotate % 180 !== 0;
-      var fixState = getFixScaleEleTransPosition(isRotate ? height : width, isRotate ? width : height, left, top);
-      if (fixState) {
-        updateTransform(_objectSpread({}, fixState), 'dragRebound');
-      }
-    }
-  };
-  var onMouseDown = function onMouseDown(event) {
-    // Only allow main button
-    if (!movable || event.button !== 0) return;
-    event.preventDefault();
-    event.stopPropagation();
-    downPositionRef.current = {
-      deltaX: event.pageX - transform.x,
-      deltaY: event.pageY - transform.y,
-      transformX: transform.x,
-      transformY: transform.y
-    };
-    setMoving(true);
-  };
-  var onMouseMove = function onMouseMove(event) {
-    if (visible && isMoving) {
-      updateTransform({
-        x: event.pageX - downPositionRef.current.deltaX,
-        y: event.pageY - downPositionRef.current.deltaY
-      }, 'move');
-    }
-  };
-  var onWheel = function onWheel(event) {
-    if (!visible || event.deltaY == 0) return;
-    // Scale ratio depends on the deltaY size
-    var scaleRatio = Math.abs(event.deltaY / 100);
-    // Limit the maximum scale ratio
-    var mergedScaleRatio = Math.min(scaleRatio, WHEEL_MAX_SCALE_RATIO);
-    // Scale the ratio each time
-    var ratio = BASE_SCALE_RATIO + mergedScaleRatio * scaleStep;
-    if (event.deltaY > 0) {
-      ratio = BASE_SCALE_RATIO / ratio;
-    }
-    dispatchZoomChange(ratio, 'wheel', event.clientX, event.clientY);
-  };
   var onKeyDown = function onKeyDown(event) {
@@ -238,32 +177,2 @@ if (!visible || !showLeftOrRightSwitches) return;
   useEffect(function () {
-    var onTopMouseUpListener;
-    var onTopMouseMoveListener;
-    var onMouseUpListener;
-    var onMouseMoveListener;
-    if (movable) {
-      onMouseUpListener = addEventListener(window, 'mouseup', onMouseUp, false);
-      onMouseMoveListener = addEventListener(window, 'mousemove', onMouseMove, false);
-      try {
-        // Resolve if in iframe lost event
-        /* istanbul ignore next */
-        if (window.top !== window.self) {
-          onTopMouseUpListener = addEventListener(window.top, 'mouseup', onMouseUp, false);
-          onTopMouseMoveListener = addEventListener(window.top, 'mousemove', onMouseMove, false);
-        }
-      } catch (error) {
-        /* istanbul ignore next */
-        warning(false, "[rc-image] ".concat(error));
-      }
-    }
-    return function () {
-      var _onMouseUpListener, _onMouseMoveListener, _onTopMouseUpListener, _onTopMouseMoveListen;
-      (_onMouseUpListener = onMouseUpListener) === null || _onMouseUpListener === void 0 || _onMouseUpListener.remove();
-      (_onMouseMoveListener = onMouseMoveListener) === null || _onMouseMoveListener === void 0 || _onMouseMoveListener.remove();
-      /* istanbul ignore next */
-      (_onTopMouseUpListener = onTopMouseUpListener) === null || _onTopMouseUpListener === void 0 || _onTopMouseUpListener.remove();
-      /* istanbul ignore next */
-      (_onTopMouseMoveListen = onTopMouseMoveListener) === null || _onTopMouseMoveListen === void 0 || _onTopMouseMoveListen.remove();
-    };
-  }, [visible, isMoving, x, y, rotate, movable]);
-  useEffect(function () {
     var onKeyDownListener = addEventListener(window, 'keydown', onKeyDown, false);
@@ -282,3 +191,3 @@ return function () {
       transform: "translate3d(".concat(transform.x, "px, ").concat(transform.y, "px, 0) scale3d(").concat(transform.flipX ? '-' : '').concat(scale, ", ").concat(transform.flipY ? '-' : '').concat(scale, ", 1) rotate(").concat(rotate, "deg)"),
-      transitionDuration: !enableTransition && '0s'
+      transitionDuration: (!enableTransition || isTouching) && '0s'
     },
@@ -289,3 +198,7 @@ fallback: fallback,
     onMouseDown: onMouseDown,
-    onDoubleClick: onDoubleClick
+    onDoubleClick: onDoubleClick,
+    onTouchStart: onTouchStart,
+    onTouchMove: onTouchMove,
+    onTouchEnd: onTouchEnd,
+    onTouchCancel: onTouchEnd
   }));
@@ -292,0 +205,0 @@ return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Dialog, _extends({

lib/hooks/useImageTransform.d.ts

@@ -10,3 +10,5 @@ /// <reference types="react" />
 };
-export type TransformAction = 'flipY' | 'flipX' | 'rotateLeft' | 'rotateRight' | 'zoomIn' | 'zoomOut' | 'close' | 'prev' | 'next' | 'wheel' | 'doubleClick' | 'move' | 'dragRebound';
+export type TransformAction = 'flipY' | 'flipX' | 'rotateLeft' | 'rotateRight' | 'zoomIn' | 'zoomOut' | 'close' | 'prev' | 'next' | 'wheel' | 'doubleClick' | 'move' | 'dragRebound' | 'touchZoom';
+export type UpdateTransformFunc = (newTransform: Partial<TransformType>, action: TransformAction) => void;
+export type DispatchZoomChangeFunc = (ratio: number, action: TransformAction, centerX?: number, centerY?: number, isTouch?: boolean) => void;
 export default function useImageTransform(imgRef: React.MutableRefObject<HTMLImageElement>, minScale: number, maxScale: number, onTransform: (info: {
@@ -25,4 +27,4 @@ transform: TransformType;
     resetTransform: (action: TransformAction) => void;
-    updateTransform: (newTransform: Partial<TransformType>, action: TransformAction) => void;
-    dispatchZoomChange: (ratio: number, action: TransformAction, clientX?: number, clientY?: number) => void;
+    updateTransform: UpdateTransformFunc;
+    dispatchZoomChange: DispatchZoomChangeFunc;
 };

lib/hooks/useImageTransform.js

@@ -61,4 +61,4 @@ "use strict";
 
-  /** Scale according to the position of clientX and clientY */
-  var dispatchZoomChange = function dispatchZoomChange(ratio, action, clientX, clientY) {
+  /** Scale according to the position of centerX and centerY */
+  var dispatchZoomChange = function dispatchZoomChange(ratio, action, centerX, centerY, isTouch) {
     var _imgRef$current = imgRef.current,
@@ -74,12 +74,13 @@ width = _imgRef$current.width,
     if (newScale > maxScale) {
+      newScale = maxScale;
       newRatio = maxScale / transform.scale;
-      newScale = maxScale;
     } else if (newScale < minScale) {
-      newRatio = minScale / transform.scale;
-      newScale = minScale;
+      // For mobile interactions, allow scaling down to the minimum scale.
+      newScale = isTouch ? newScale : minScale;
+      newRatio = newScale / transform.scale;
     }
 
     /** Default center point scaling */
-    var mergedClientX = clientX !== null && clientX !== void 0 ? clientX : innerWidth / 2;
-    var mergedClientY = clientY !== null && clientY !== void 0 ? clientY : innerHeight / 2;
+    var mergedCenterX = centerX !== null && centerX !== void 0 ? centerX : innerWidth / 2;
+    var mergedCenterY = centerY !== null && centerY !== void 0 ? centerY : innerHeight / 2;
     var diffRatio = newRatio - 1;
@@ -90,4 +91,4 @@ /** Deviation calculated from image size */
     /** The difference between the click position and the edge of the document */
-    var diffOffsetLeft = diffRatio * (mergedClientX - transform.x - offsetLeft);
-    var diffOffsetTop = diffRatio * (mergedClientY - transform.y - offsetTop);
+    var diffOffsetLeft = diffRatio * (mergedCenterX - transform.x - offsetLeft);
+    var diffOffsetTop = diffRatio * (mergedCenterY - transform.y - offsetTop);
     /** Final positioning */
@@ -94,0 +95,0 @@ var newX = transform.x - (diffOffsetLeft - diffImgX);

lib/Operations.js

@@ -92,3 +92,3 @@ "use strict";
     type: 'zoomOut',
-    disabled: scale === minScale
+    disabled: scale <= minScale
   }, {
@@ -95,0 +95,0 @@ icon: zoomIn,

lib/Preview.js

@@ -18,7 +18,7 @@ "use strict";
 var _KeyCode = _interopRequireDefault(require("rc-util/lib/KeyCode"));
-var _warning = require("rc-util/lib/warning");
 var _react = _interopRequireWildcard(require("react"));
 var _context = require("./context");
-var _getFixScaleEleTransPosition = _interopRequireDefault(require("./getFixScaleEleTransPosition"));
 var _useImageTransform2 = _interopRequireDefault(require("./hooks/useImageTransform"));
+var _useMouseEvent2 = _interopRequireDefault(require("./hooks/useMouseEvent"));
+var _useTouchEvent2 = _interopRequireDefault(require("./hooks/useTouchEvent"));
 var _useStatus3 = _interopRequireDefault(require("./hooks/useStatus"));
@@ -86,15 +86,9 @@ var _Operations = _interopRequireDefault(require("./Operations"));
   var imgRef = (0, _react.useRef)();
-  var downPositionRef = (0, _react.useRef)({
-    deltaX: 0,
-    deltaY: 0,
-    transformX: 0,
-    transformY: 0
-  });
-  var _useState = (0, _react.useState)(false),
-    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    isMoving = _useState2[0],
-    setMoving = _useState2[1];
   var groupContext = (0, _react.useContext)(_context.PreviewGroupContext);
   var showLeftOrRightSwitches = groupContext && count > 1;
   var showOperationsProgress = groupContext && count >= 1;
+  var _useState = (0, _react.useState)(true),
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    enableTransition = _useState2[0],
+    setEnableTransition = _useState2[1];
   var _useImageTransform = (0, _useImageTransform2.default)(imgRef, minScale, maxScale, onTransform),
@@ -105,10 +99,13 @@ transform = _useImageTransform.transform,
     dispatchZoomChange = _useImageTransform.dispatchZoomChange;
-  var _useState3 = (0, _react.useState)(true),
-    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
-    enableTransition = _useState4[0],
-    setEnableTransition = _useState4[1];
+  var _useMouseEvent = (0, _useMouseEvent2.default)(imgRef, movable, visible, scaleStep, transform, updateTransform, dispatchZoomChange),
+    isMoving = _useMouseEvent.isMoving,
+    onMouseDown = _useMouseEvent.onMouseDown,
+    onWheel = _useMouseEvent.onWheel;
+  var _useTouchEvent = (0, _useTouchEvent2.default)(imgRef, movable, visible, minScale, transform, updateTransform, dispatchZoomChange),
+    isTouching = _useTouchEvent.isTouching,
+    onTouchStart = _useTouchEvent.onTouchStart,
+    onTouchMove = _useTouchEvent.onTouchMove,
+    onTouchEnd = _useTouchEvent.onTouchEnd;
   var rotate = transform.rotate,
-    scale = transform.scale,
-    x = transform.x,
-    y = transform.y;
+    scale = transform.scale;
   var wrapClassName = (0, _classnames2.default)((0, _defineProperty2.default)({}, "".concat(prefixCls, "-moving"), isMoving));
@@ -167,60 +164,2 @@ (0, _react.useEffect)(function () {
   };
-  var onMouseUp = function onMouseUp() {
-    if (visible && isMoving) {
-      setMoving(false);
-      /** No need to restore the position when the picture is not moved, So as not to interfere with the click */
-      var _downPositionRef$curr = downPositionRef.current,
-        transformX = _downPositionRef$curr.transformX,
-        transformY = _downPositionRef$curr.transformY;
-      var hasChangedPosition = x !== transformX && y !== transformY;
-      if (!hasChangedPosition) {
-        return;
-      }
-      var width = imgRef.current.offsetWidth * scale;
-      var height = imgRef.current.offsetHeight * scale;
-      // eslint-disable-next-line @typescript-eslint/no-shadow
-      var _imgRef$current$getBo = imgRef.current.getBoundingClientRect(),
-        left = _imgRef$current$getBo.left,
-        top = _imgRef$current$getBo.top;
-      var isRotate = rotate % 180 !== 0;
-      var fixState = (0, _getFixScaleEleTransPosition.default)(isRotate ? height : width, isRotate ? width : height, left, top);
-      if (fixState) {
-        updateTransform((0, _objectSpread2.default)({}, fixState), 'dragRebound');
-      }
-    }
-  };
-  var onMouseDown = function onMouseDown(event) {
-    // Only allow main button
-    if (!movable || event.button !== 0) return;
-    event.preventDefault();
-    event.stopPropagation();
-    downPositionRef.current = {
-      deltaX: event.pageX - transform.x,
-      deltaY: event.pageY - transform.y,
-      transformX: transform.x,
-      transformY: transform.y
-    };
-    setMoving(true);
-  };
-  var onMouseMove = function onMouseMove(event) {
-    if (visible && isMoving) {
-      updateTransform({
-        x: event.pageX - downPositionRef.current.deltaX,
-        y: event.pageY - downPositionRef.current.deltaY
-      }, 'move');
-    }
-  };
-  var onWheel = function onWheel(event) {
-    if (!visible || event.deltaY == 0) return;
-    // Scale ratio depends on the deltaY size
-    var scaleRatio = Math.abs(event.deltaY / 100);
-    // Limit the maximum scale ratio
-    var mergedScaleRatio = Math.min(scaleRatio, _previewConfig.WHEEL_MAX_SCALE_RATIO);
-    // Scale the ratio each time
-    var ratio = _previewConfig.BASE_SCALE_RATIO + mergedScaleRatio * scaleStep;
-    if (event.deltaY > 0) {
-      ratio = _previewConfig.BASE_SCALE_RATIO / ratio;
-    }
-    dispatchZoomChange(ratio, 'wheel', event.clientX, event.clientY);
-  };
   var onKeyDown = function onKeyDown(event) {
@@ -248,32 +187,2 @@ if (!visible || !showLeftOrRightSwitches) return;
   (0, _react.useEffect)(function () {
-    var onTopMouseUpListener;
-    var onTopMouseMoveListener;
-    var onMouseUpListener;
-    var onMouseMoveListener;
-    if (movable) {
-      onMouseUpListener = (0, _addEventListener.default)(window, 'mouseup', onMouseUp, false);
-      onMouseMoveListener = (0, _addEventListener.default)(window, 'mousemove', onMouseMove, false);
-      try {
-        // Resolve if in iframe lost event
-        /* istanbul ignore next */
-        if (window.top !== window.self) {
-          onTopMouseUpListener = (0, _addEventListener.default)(window.top, 'mouseup', onMouseUp, false);
-          onTopMouseMoveListener = (0, _addEventListener.default)(window.top, 'mousemove', onMouseMove, false);
-        }
-      } catch (error) {
-        /* istanbul ignore next */
-        (0, _warning.warning)(false, "[rc-image] ".concat(error));
-      }
-    }
-    return function () {
-      var _onMouseUpListener, _onMouseMoveListener, _onTopMouseUpListener, _onTopMouseMoveListen;
-      (_onMouseUpListener = onMouseUpListener) === null || _onMouseUpListener === void 0 || _onMouseUpListener.remove();
-      (_onMouseMoveListener = onMouseMoveListener) === null || _onMouseMoveListener === void 0 || _onMouseMoveListener.remove();
-      /* istanbul ignore next */
-      (_onTopMouseUpListener = onTopMouseUpListener) === null || _onTopMouseUpListener === void 0 || _onTopMouseUpListener.remove();
-      /* istanbul ignore next */
-      (_onTopMouseMoveListen = onTopMouseMoveListener) === null || _onTopMouseMoveListen === void 0 || _onTopMouseMoveListen.remove();
-    };
-  }, [visible, isMoving, x, y, rotate, movable]);
-  (0, _react.useEffect)(function () {
     var onKeyDownListener = (0, _addEventListener.default)(window, 'keydown', onKeyDown, false);
@@ -292,3 +201,3 @@ return function () {
       transform: "translate3d(".concat(transform.x, "px, ").concat(transform.y, "px, 0) scale3d(").concat(transform.flipX ? '-' : '').concat(scale, ", ").concat(transform.flipY ? '-' : '').concat(scale, ", 1) rotate(").concat(rotate, "deg)"),
-      transitionDuration: !enableTransition && '0s'
+      transitionDuration: (!enableTransition || isTouching) && '0s'
     },
@@ -299,3 +208,7 @@ fallback: fallback,
     onMouseDown: onMouseDown,
-    onDoubleClick: onDoubleClick
+    onDoubleClick: onDoubleClick,
+    onTouchStart: onTouchStart,
+    onTouchMove: onTouchMove,
+    onTouchEnd: onTouchEnd,
+    onTouchCancel: onTouchEnd
   }));
@@ -302,0 +215,0 @@ return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_rcDialog.default, (0, _extends2.default)({

package.json

 {
   "name": "rc-image",
-  "version": "7.4.0",
+  "version": "7.5.0",
   "description": "React easy to use image component",
@@ -5,0 +5,0 @@ "keywords": [

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

154622

increased by12.73%

Number of package files

72

increased by12.5%

Lines of code

3634

increased by13.85%

No dependency changes