Merge f56597b into 62d93d3

README.md

@@ -52,7 +52,8 @@ All Event Handlers are called with the below event data.
   deltaY,         // y offset (current.y - initial.y)
   absX,           // absolute deltaX
   absY,           // absolute deltaY
-  velocity,       // √(absX^2 + absY^2) / time
+  velocity,       // √(absX^2 + absY^2) / time - "absolute velocity" (speed)
+  vxvy,           // [ deltaX/time, deltaY/time] - velocity per axis
   dir,            // direction of swipe (Left|Right|Up|Down)
 }
 ```

__tests__/__snapshots__/useSwipeable.spec.tsx.snap

@@ -16,6 +16,7 @@ Object {
     100,
   ],
   "velocity": Any<Number>,
+  "vxvy": Any<Array>,
 }
 `;
 
@@ -35,6 +36,7 @@ Object {
     100,
   ],
   "velocity": Any<Number>,
+  "vxvy": Any<Array>,
 }
 `;
 
@@ -54,6 +56,10 @@ Object {
     100,
   ],
   "velocity": Any<Number>,
+  "vxvy": ArrayContaining [
+    Any<Number>,
+    Any<Number>,
+  ],
 }
 `;
 
@@ -73,5 +79,9 @@ Object {
     100,
   ],
   "velocity": Any<Number>,
+  "vxvy": ArrayContaining [
+    Any<Number>,
+    Any<Number>,
+  ],
 }
 `;

__tests__/useSwipeable.spec.tsx

@@ -114,11 +114,11 @@ describe("useSwipeable", () => {
     expect(swipeFuncs.onSwipedLeft).not.toHaveBeenCalled();
     expect(swipeFuncs.onSwipedRight).not.toHaveBeenCalled();
     expect(swipeFuncs.onSwiped.mock.calls[0][0]).toMatchSnapshot(
-      { velocity: expect.any(Number) },
+      { velocity: expect.any(Number), vxvy: expect.arrayContaining([expect.any(Number), expect.any(Number)]) },
       `useSwipeable onSwiped trackTouch`
     );
     expect(swipeFuncs.onSwiping.mock.calls[0][0]).toMatchSnapshot(
-      { velocity: expect.any(Number) },
+      { velocity: expect.any(Number), vxvy: expect.arrayContaining([expect.any(Number), expect.any(Number)]) },
       `useSwipeable onSwiping trackTouch`
     );
   });
@@ -147,11 +147,11 @@ describe("useSwipeable", () => {
     expect(swipeFuncs.onSwipedDown).not.toHaveBeenCalled();
     expect(swipeFuncs.onSwipedLeft).not.toHaveBeenCalled();
     expect(swipeFuncs.onSwiped.mock.calls[0][0]).toMatchSnapshot(
-      { velocity: expect.any(Number) },
+      { velocity: expect.any(Number), vxvy: expect.any(Array) },
       `useSwipeable onSwiped trackMouse`
     );
     expect(swipeFuncs.onSwiping.mock.calls[0][0]).toMatchSnapshot(
-      { velocity: expect.any(Number) },
+      { velocity: expect.any(Number), vxvy: expect.any(Array) },
       `useSwipeable onSwiping trackMouse`
     );
   });

migration.md

@@ -6,5 +6,6 @@
   - _TODO_ add example for creating one and migrating
 - update calculation of `deltaX` and `deltaY` from `initial - current` to `current - initial`
   - Example: `const deltaX = state.xy[0] - x;` is now `const deltaX = x - state.xy[0];`
+- add new `vxvy` vector which contains velocity per each dimension
 
 ## Migrate Swipeable v5 to v6

src/index.ts

@@ -12,6 +12,7 @@ export type EventData = {
   first: boolean;
   initial: Vector2;
   velocity: number;
+  vxvy: Vector2;
   dir: "Left" | "Right" | "Up" | "Down";
 };
 
@@ -48,6 +49,7 @@ type StateEventData = {
   first: boolean;
   initial: Vector2;
   velocity?: number;
+  vxvy?: Vector2;
   dir?: "Left" | "Right" | "Up" | "Down";
 };
 
@@ -180,6 +182,7 @@ function getHandlers(
       const absY = Math.abs(deltaY);
       const time = (event.timeStamp || 0) - state.start;
       const velocity = Math.sqrt(absX * absX + absY * absY) / (time || 1);
+      const vxvy = [deltaX / (time || 1), deltaY / (time || 1)];
 
       // if swipe is under delta and we have not started to track a swipe: skip update
       if (absX < props.delta && absY < props.delta && !state.swiping)
@@ -194,6 +197,7 @@ function getHandlers(
         deltaX,
         deltaY,
         velocity,
+        vxvy,
         dir,
       } as EventData;