fix: change onTransform type

react-component · Jun 7, 2023 · 25d9c04 · 25d9c04
1 parent 9acc3c2
commit 25d9c04
Show file tree

Hide file tree

Showing 4 changed files with 12 additions and 12 deletions.
diff --git a/README.md b/README.md
@@ -79,10 +79,10 @@ export default () => (
   visible?: boolean;
   scaleStep?: number;
   onVisibleChange?: (visible: boolean, prevVisible: boolean) => void;
-  onTransform: (
+  onTransform: (params: {
     transform: { x: number, y: number, rotate: number, scale: number, flipX: boolean, flipY: boolean },
     action: 'flipY' | 'flipX' | 'rotateLeft' | 'rotateRight' | 'zoomIn' | 'zoomOut' | 'close' | 'switch' | 'wheel' | 'doubleClick' | 'move' | 'dragRebound'
-  ) => void;
+  )} => void;
   getContainer?: string | HTMLElement | (() => HTMLElement) | false;
   toolbarRender?: (params: {
     originalNode: React.ReactNode;
@@ -138,10 +138,10 @@ export default () => (
   visible?: boolean;
   scaleStep?: number;
   onVisibleChange?: (visible, prevVisible, current: number) => void;
-  onTransform: (
+  onTransform: (params: {
     transform: { x: number, y: number, rotate: number, scale: number, flipX: boolean, flipY: boolean },
     action: 'flipY' | 'flipX' | 'rotateLeft' | 'rotateRight' | 'zoomIn' | 'zoomOut' | 'close' | 'switch' | 'wheel' | 'doubleClick' | 'move' | 'dragRebound'
-  ) => void;
+  )} => void;
   getContainer?: string | HTMLElement | (() => HTMLElement) | false;
   countRender?: (current: number, total: number) => string;
   current?: number;

diff --git a/src/Preview.tsx b/src/Preview.tsx
@@ -55,7 +55,7 @@ export interface PreviewProps extends Omit<IDialogPropTypes, 'onClose'> {
   countRender?: (current: number, total: number) => string;
   scaleStep?: number;
   onClose?: (e: React.SyntheticEvent<Element>) => void;
-  onTransform?: (transform: TransformType, action: TransformAction) => void;
+  onTransform?: (params: { transform: TransformType; action: TransformAction }) => void;
   toolbarRender?: (params: toolbarRenderType) => React.ReactNode;
 }
 

diff --git a/src/hooks/useImageTransform.ts b/src/hooks/useImageTransform.ts
@@ -38,7 +38,7 @@ const initialTransform = {
 
 export default function useImageTransform(
   imgRef: React.MutableRefObject<HTMLImageElement>,
-  onTransform: (transform: TransformType, action: TransformAction) => void,
+  onTransform: (params: { transform: TransformType; action: TransformAction }) => void,
 ) {
   const frame = useRef(null);
   const queue = useRef<TransformType[]>([]);
@@ -47,7 +47,7 @@ export default function useImageTransform(
   const resetTransform = (action: TransformAction) => {
     setTransform(initialTransform);
     if (onTransform && !isEqual(initialTransform, transform)) {
-      onTransform(initialTransform, action);
+      onTransform({ transform: initialTransform, action });
     }
   };
 
@@ -63,7 +63,7 @@ export default function useImageTransform(
           });
           frame.current = null;
 
-          onTransform?.(memoState, action);
+          onTransform?.({ transform: memoState, action });
           return memoState;
         });
       });

diff --git a/tests/preview.test.tsx b/tests/preview.test.tsx
@@ -832,16 +832,16 @@ describe('Preview', () => {
     });
 
     expect(onTransform).toBeCalledTimes(1);
-    expect(onTransform).toBeCalledWith(
-      {
+    expect(onTransform).toBeCalledWith({
+      transform: {
         flipY: true,
         flipX: false,
         rotate: 0,
         scale: 1,
         x: 0,
         y: 0,
       },
-      'flipY',
-    );
+      action: 'flipY',
+    });
   });
 });