react-native-gesture-handler 2.26.0 → 2.27.1

package/lib/typescript/web_hammer/PanGestureHandler.js

@@ -0,0 +1,151 @@
+import Hammer from '@egjs/hammerjs';
+import { MULTI_FINGER_PAN_MAX_PINCH_THRESHOLD, MULTI_FINGER_PAN_MAX_ROTATION_THRESHOLD, } from './constants';
+import DraggingGestureHandler from './DraggingGestureHandler';
+import { isValidNumber, isnan, TEST_MIN_IF_NOT_NAN, VEC_LEN_SQ } from './utils';
+import { State } from '../State';
+class PanGestureHandler extends DraggingGestureHandler {
+    get name() {
+        return 'pan';
+    }
+    get NativeGestureClass() {
+        return Hammer.Pan;
+    }
+    getHammerConfig() {
+        return {
+            ...super.getHammerConfig(),
+            direction: this.getDirection(),
+        };
+    }
+    getState(type) {
+        const nextState = super.getState(type);
+        // Ensure that the first state sent is `BEGAN` and not `ACTIVE`
+        if (this.previousState === State.UNDETERMINED &&
+            nextState === State.ACTIVE) {
+            return State.BEGAN;
+        }
+        return nextState;
+    }
+    getDirection() {
+        const config = this.getConfig();
+        const { activeOffsetXStart, activeOffsetXEnd, activeOffsetYStart, activeOffsetYEnd, minDist, } = config;
+        let directions = [];
+        let horizontalDirections = [];
+        if (!isnan(minDist)) {
+            return Hammer.DIRECTION_ALL;
+        }
+        if (!isnan(activeOffsetXStart)) {
+            horizontalDirections.push(Hammer.DIRECTION_LEFT);
+        }
+        if (!isnan(activeOffsetXEnd)) {
+            horizontalDirections.push(Hammer.DIRECTION_RIGHT);
+        }
+        if (horizontalDirections.length === 2) {
+            horizontalDirections = [Hammer.DIRECTION_HORIZONTAL];
+        }
+        directions = directions.concat(horizontalDirections);
+        let verticalDirections = [];
+        if (!isnan(activeOffsetYStart)) {
+            verticalDirections.push(Hammer.DIRECTION_UP);
+        }
+        if (!isnan(activeOffsetYEnd)) {
+            verticalDirections.push(Hammer.DIRECTION_DOWN);
+        }
+        if (verticalDirections.length === 2) {
+            verticalDirections = [Hammer.DIRECTION_VERTICAL];
+        }
+        directions = directions.concat(verticalDirections);
+        if (!directions.length) {
+            return Hammer.DIRECTION_NONE;
+        }
+        if (directions[0] === Hammer.DIRECTION_HORIZONTAL &&
+            directions[1] === Hammer.DIRECTION_VERTICAL) {
+            return Hammer.DIRECTION_ALL;
+        }
+        if (horizontalDirections.length && verticalDirections.length) {
+            return Hammer.DIRECTION_ALL;
+        }
+        return directions[0];
+    }
+    getConfig() {
+        if (!this.hasCustomActivationCriteria) {
+            // Default config
+            // If no params have been defined then this config should emulate the native gesture as closely as possible.
+            return {
+                minDistSq: 10,
+            };
+        }
+        return this.config;
+    }
+    shouldFailUnderCustomCriteria({ deltaX, deltaY }, criteria) {
+        return ((!isnan(criteria.failOffsetXStart) &&
+            deltaX < criteria.failOffsetXStart) ||
+            (!isnan(criteria.failOffsetXEnd) && deltaX > criteria.failOffsetXEnd) ||
+            (!isnan(criteria.failOffsetYStart) &&
+                deltaY < criteria.failOffsetYStart) ||
+            (!isnan(criteria.failOffsetYEnd) && deltaY > criteria.failOffsetYEnd));
+    }
+    shouldActivateUnderCustomCriteria({ deltaX, deltaY, velocity }, criteria) {
+        return ((!isnan(criteria.activeOffsetXStart) &&
+            deltaX < criteria.activeOffsetXStart) ||
+            (!isnan(criteria.activeOffsetXEnd) &&
+                deltaX > criteria.activeOffsetXEnd) ||
+            (!isnan(criteria.activeOffsetYStart) &&
+                deltaY < criteria.activeOffsetYStart) ||
+            (!isnan(criteria.activeOffsetYEnd) &&
+                deltaY > criteria.activeOffsetYEnd) ||
+            TEST_MIN_IF_NOT_NAN(VEC_LEN_SQ({ x: deltaX, y: deltaY }), criteria.minDistSq) ||
+            TEST_MIN_IF_NOT_NAN(velocity.x, criteria.minVelocityX) ||
+            TEST_MIN_IF_NOT_NAN(velocity.y, criteria.minVelocityY) ||
+            TEST_MIN_IF_NOT_NAN(VEC_LEN_SQ(velocity), criteria.minVelocitySq));
+    }
+    shouldMultiFingerPanFail({ pointerLength, scale, deltaRotation, }) {
+        if (pointerLength <= 1) {
+            return false;
+        }
+        // Test if the pan had too much pinching or rotating.
+        const deltaScale = Math.abs(scale - 1);
+        const absDeltaRotation = Math.abs(deltaRotation);
+        if (deltaScale > MULTI_FINGER_PAN_MAX_PINCH_THRESHOLD) {
+            // > If the threshold doesn't seem right.
+            // You can log the value which it failed at here:
+            return true;
+        }
+        if (absDeltaRotation > MULTI_FINGER_PAN_MAX_ROTATION_THRESHOLD) {
+            // > If the threshold doesn't seem right.
+            // You can log the value which it failed at here:
+            return true;
+        }
+        return false;
+    }
+    updateHasCustomActivationCriteria(criteria) {
+        return (isValidNumber(criteria.minDistSq) ||
+            isValidNumber(criteria.minVelocityX) ||
+            isValidNumber(criteria.minVelocityY) ||
+            isValidNumber(criteria.minVelocitySq) ||
+            isValidNumber(criteria.activeOffsetXStart) ||
+            isValidNumber(criteria.activeOffsetXEnd) ||
+            isValidNumber(criteria.activeOffsetYStart) ||
+            isValidNumber(criteria.activeOffsetYEnd));
+    }
+    isGestureEnabledForEvent(props, _recognizer, inputData) {
+        if (this.shouldFailUnderCustomCriteria(inputData, props)) {
+            return { failed: true };
+        }
+        const velocity = { x: inputData.velocityX, y: inputData.velocityY };
+        if (this.hasCustomActivationCriteria &&
+            this.shouldActivateUnderCustomCriteria({ deltaX: inputData.deltaX, deltaY: inputData.deltaY, velocity }, props)) {
+            if (this.shouldMultiFingerPanFail({
+                pointerLength: inputData.maxPointers,
+                scale: inputData.scale,
+                deltaRotation: inputData.deltaRotation,
+            })) {
+                return {
+                    failed: true,
+                };
+            }
+            return { success: true };
+        }
+        return { success: false };
+    }
+}
+export default PanGestureHandler;

package/lib/typescript/web_hammer/PinchGestureHandler.d.ts

@@ -11,4 +11,3 @@ declare class PinchGestureHandler extends IndiscreteGestureHandler {
     };
 }
 export default PinchGestureHandler;
-//# sourceMappingURL=PinchGestureHandler.d.ts.map

package/lib/typescript/web_hammer/PinchGestureHandler.js

@@ -0,0 +1,19 @@
+import Hammer from '@egjs/hammerjs';
+import IndiscreteGestureHandler from './IndiscreteGestureHandler';
+class PinchGestureHandler extends IndiscreteGestureHandler {
+    get name() {
+        return 'pinch';
+    }
+    get NativeGestureClass() {
+        return Hammer.Pinch;
+    }
+    transformNativeEvent({ scale, velocity, center }) {
+        return {
+            focalX: center.x,
+            focalY: center.y,
+            velocity,
+            scale,
+        };
+    }
+}
+export default PinchGestureHandler;

package/lib/typescript/web_hammer/PressGestureHandler.d.ts

@@ -81,4 +81,3 @@ declare class PressGestureHandler extends DiscreteGestureHandler {
     }>;
 }
 export default PressGestureHandler;
-//# sourceMappingURL=PressGestureHandler.d.ts.map

package/lib/typescript/web_hammer/PressGestureHandler.js

@@ -0,0 +1,133 @@
+import Hammer from '@egjs/hammerjs';
+import { State } from '../State';
+import { CONTENT_TOUCHES_DELAY, CONTENT_TOUCHES_QUICK_TAP_END_DELAY, } from './constants';
+import DiscreteGestureHandler from './DiscreteGestureHandler';
+import { fireAfterInterval, isValidNumber, isnan } from './utils';
+class PressGestureHandler extends DiscreteGestureHandler {
+    visualFeedbackTimer;
+    initialEvent = null;
+    get name() {
+        return 'press';
+    }
+    get minDurationMs() {
+        // @ts-ignore FIXME(TS)
+        return isnan(this.config.minDurationMs) ? 5 : this.config.minDurationMs;
+    }
+    get maxDist() {
+        return isnan(this.config.maxDist) ? 9 : this.config.maxDist;
+    }
+    get NativeGestureClass() {
+        return Hammer.Press;
+    }
+    shouldDelayTouches = true;
+    simulateCancelEvent(inputData) {
+        // Long press never starts so we can't rely on the running event boolean.
+        this.hasGestureFailed = true;
+        this.cancelEvent(inputData);
+    }
+    updateHasCustomActivationCriteria({ shouldCancelWhenOutside, maxDistSq, }) {
+        return shouldCancelWhenOutside || !isValidNumber(maxDistSq);
+    }
+    getState(type) {
+        return {
+            [Hammer.INPUT_START]: State.BEGAN,
+            [Hammer.INPUT_MOVE]: State.ACTIVE,
+            [Hammer.INPUT_END]: State.END,
+            [Hammer.INPUT_CANCEL]: State.CANCELLED,
+        }[type];
+    }
+    getConfig() {
+        if (!this.hasCustomActivationCriteria) {
+            // Default config
+            // If no params have been defined then this config should emulate the native gesture as closely as possible.
+            return {
+                shouldCancelWhenOutside: true,
+                maxDistSq: 10,
+            };
+        }
+        return this.config;
+    }
+    getHammerConfig() {
+        return {
+            ...super.getHammerConfig(),
+            // threshold: this.maxDist,
+            time: this.minDurationMs,
+        };
+    }
+    onGestureActivated(ev) {
+        this.onGestureStart(ev);
+    }
+    shouldDelayTouchForEvent({ pointerType }) {
+        // Don't disable event for mouse input
+        return this.shouldDelayTouches && pointerType === 'touch';
+    }
+    onGestureStart(ev) {
+        this.isGestureRunning = true;
+        clearTimeout(this.visualFeedbackTimer);
+        this.initialEvent = ev;
+        this.visualFeedbackTimer = fireAfterInterval(() => {
+            this.sendGestureStartedEvent(this.initialEvent);
+            this.initialEvent = null;
+        }, this.shouldDelayTouchForEvent(ev) && CONTENT_TOUCHES_DELAY);
+    }
+    sendGestureStartedEvent(ev) {
+        clearTimeout(this.visualFeedbackTimer);
+        this.visualFeedbackTimer = null;
+        this.sendEvent({
+            ...ev,
+            eventType: Hammer.INPUT_MOVE,
+            isFirst: true,
+        });
+    }
+    forceInvalidate(event) {
+        super.forceInvalidate(event);
+        clearTimeout(this.visualFeedbackTimer);
+        this.visualFeedbackTimer = null;
+        this.initialEvent = null;
+    }
+    onRawEvent(ev) {
+        super.onRawEvent(ev);
+        if (this.isGestureRunning) {
+            if (ev.isFinal) {
+                let timeout;
+                if (this.visualFeedbackTimer) {
+                    // Aesthetic timing for a quick tap.
+                    // We haven't activated the tap right away to emulate iOS `delaysContentTouches`
+                    // Now we must send the initial activation event and wait a set amount of time before firing the end event.
+                    timeout = CONTENT_TOUCHES_QUICK_TAP_END_DELAY;
+                    this.sendGestureStartedEvent(this.initialEvent);
+                    this.initialEvent = null;
+                }
+                fireAfterInterval(() => {
+                    this.sendEvent({
+                        ...ev,
+                        eventType: Hammer.INPUT_END,
+                        isFinal: true,
+                    });
+                    // @ts-ignore -- this should explicitly support undefined
+                    this.onGestureEnded();
+                }, timeout);
+            }
+            else {
+                this.sendEvent({
+                    ...ev,
+                    eventType: Hammer.INPUT_MOVE,
+                    isFinal: false,
+                });
+            }
+        }
+    }
+    updateGestureConfig({ shouldActivateOnStart = false, disallowInterruption = false, shouldCancelWhenOutside = true, minDurationMs = Number.NaN, maxDist = Number.NaN, minPointers = 1, maxPointers = 1, ...props }) {
+        return super.updateGestureConfig({
+            shouldActivateOnStart,
+            disallowInterruption,
+            shouldCancelWhenOutside,
+            minDurationMs,
+            maxDist,
+            minPointers,
+            maxPointers,
+            ...props,
+        });
+    }
+}
+export default PressGestureHandler;

package/lib/typescript/web_hammer/RotationGestureHandler.d.ts

@@ -11,4 +11,3 @@ declare class RotationGestureHandler extends IndiscreteGestureHandler {
     };
 }
 export default RotationGestureHandler;
-//# sourceMappingURL=RotationGestureHandler.d.ts.map

package/lib/typescript/web_hammer/RotationGestureHandler.js

@@ -0,0 +1,20 @@
+import Hammer from '@egjs/hammerjs';
+import { DEG_RAD } from './constants';
+import IndiscreteGestureHandler from './IndiscreteGestureHandler';
+class RotationGestureHandler extends IndiscreteGestureHandler {
+    get name() {
+        return 'rotate';
+    }
+    get NativeGestureClass() {
+        return Hammer.Rotate;
+    }
+    transformNativeEvent({ rotation, velocity, center }) {
+        return {
+            rotation: (rotation - (this.initialRotation ?? 0)) * DEG_RAD,
+            anchorX: center.x,
+            anchorY: center.y,
+            velocity,
+        };
+    }
+}
+export default RotationGestureHandler;

package/lib/typescript/web_hammer/TapGestureHandler.d.ts

@@ -55,4 +55,3 @@ declare class TapGestureHandler extends DiscreteGestureHandler {
     onWaitingEnded(_gesture: any): void;
 }
 export default TapGestureHandler;
-//# sourceMappingURL=TapGestureHandler.d.ts.map

package/lib/typescript/web_hammer/TapGestureHandler.js

@@ -0,0 +1,142 @@
+import Hammer from '@egjs/hammerjs';
+import DiscreteGestureHandler from './DiscreteGestureHandler';
+import { isnan } from './utils';
+class TapGestureHandler extends DiscreteGestureHandler {
+    _shouldFireEndEvent = null;
+    _timer;
+    _multiTapTimer; // TODO unused?
+    get name() {
+        return 'tap';
+    }
+    get NativeGestureClass() {
+        return Hammer.Tap;
+    }
+    get maxDelayMs() {
+        // @ts-ignore TODO(TS) trace down config
+        return isnan(this.config.maxDelayMs) ? 300 : this.config.maxDelayMs;
+    }
+    simulateCancelEvent(inputData) {
+        if (this.isGestureRunning) {
+            this.cancelEvent(inputData);
+        }
+    }
+    onGestureActivated(ev) {
+        if (this.isGestureRunning) {
+            this.onSuccessfulTap(ev);
+        }
+    }
+    onSuccessfulTap = (ev) => {
+        if (this._getPendingGestures().length) {
+            this._shouldFireEndEvent = ev;
+            return;
+        }
+        if (ev.eventType === Hammer.INPUT_END) {
+            this.sendEvent({ ...ev, eventType: Hammer.INPUT_MOVE });
+        }
+        // When handler gets activated it will turn into State.END immediately.
+        this.sendEvent({ ...ev, isFinal: true });
+        this.onGestureEnded(ev);
+    };
+    onRawEvent(ev) {
+        super.onRawEvent(ev);
+        // Attempt to create a touch-down event by checking if a valid tap hasn't started yet, then validating the input.
+        if (!this.hasGestureFailed &&
+            !this.isGestureRunning &&
+            // Prevent multi-pointer events from misfiring.
+            !ev.isFinal) {
+            // Tap Gesture start event
+            const gesture = this.hammer.get(this.name);
+            // @ts-ignore TODO(TS) trace down config
+            if (gesture.options.enable(gesture, ev)) {
+                clearTimeout(this._multiTapTimer);
+                this.onStart(ev);
+                this.sendEvent(ev);
+            }
+        }
+        if (ev.isFinal && ev.maxPointers > 1) {
+            setTimeout(() => {
+                // Handle case where one finger presses slightly
+                // after the first finger on a multi-tap event
+                if (this.isGestureRunning) {
+                    this.cancelEvent(ev);
+                }
+            });
+        }
+        if (this.hasGestureFailed) {
+            return;
+        }
+        // Hammer doesn't send a `cancel` event for taps.
+        // Manually fail the event.
+        if (ev.isFinal) {
+            // Handle case where one finger presses slightly
+            // after the first finger on a multi-tap event
+            if (ev.maxPointers > 1) {
+                setTimeout(() => {
+                    if (this.isGestureRunning) {
+                        this.cancelEvent(ev);
+                    }
+                });
+            }
+            // Clear last timer
+            clearTimeout(this._timer);
+            // Create time out for multi-taps.
+            this._timer = setTimeout(() => {
+                this.hasGestureFailed = true;
+                this.cancelEvent(ev);
+            }, this.maxDelayMs);
+        }
+        else if (!this.hasGestureFailed && !this.isGestureRunning) {
+            // Tap Gesture start event
+            const gesture = this.hammer.get(this.name);
+            // @ts-ignore TODO(TS) trace down config
+            if (gesture.options.enable(gesture, ev)) {
+                clearTimeout(this._multiTapTimer);
+                this.onStart(ev);
+                this.sendEvent(ev);
+            }
+        }
+    }
+    getHammerConfig() {
+        return {
+            ...super.getHammerConfig(),
+            event: this.name,
+            // @ts-ignore TODO(TS) trace down config
+            taps: isnan(this.config.numberOfTaps) ? 1 : this.config.numberOfTaps,
+            interval: this.maxDelayMs,
+            time: 
+            // @ts-ignore TODO(TS) trace down config
+            isnan(this.config.maxDurationMs) || this.config.maxDurationMs == null
+                ? 250
+                : // @ts-ignore TODO(TS) trace down config
+                    this.config.maxDurationMs,
+        };
+    }
+    updateGestureConfig({ shouldCancelWhenOutside = true, maxDeltaX = Number.NaN, maxDeltaY = Number.NaN, numberOfTaps = 1, minDurationMs = 525, maxDelayMs = Number.NaN, 
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars -- TODO possibly forgotten to use in updateGestureConfig?
+    maxDurationMs = Number.NaN, maxDist = 2, minPointers = 1, maxPointers = 1, ...props }) {
+        return super.updateGestureConfig({
+            shouldCancelWhenOutside,
+            numberOfTaps,
+            maxDeltaX,
+            maxDeltaY,
+            minDurationMs,
+            maxDelayMs,
+            maxDist,
+            minPointers,
+            maxPointers,
+            ...props,
+        });
+    }
+    onGestureEnded(...props) {
+        clearTimeout(this._timer);
+        // @ts-ignore TODO(TS) check how onGestureEnded works
+        super.onGestureEnded(...props);
+    }
+    onWaitingEnded(_gesture) {
+        if (this._shouldFireEndEvent) {
+            this.onSuccessfulTap(this._shouldFireEndEvent);
+            this._shouldFireEndEvent = null;
+        }
+    }
+}
+export default TapGestureHandler;

package/lib/typescript/web_hammer/constants.d.ts

@@ -37,4 +37,3 @@ export declare const HammerDirectionNames: {
     4: string;
     2: string;
 };
-//# sourceMappingURL=constants.d.ts.map

package/lib/typescript/web_hammer/constants.js

@@ -0,0 +1,42 @@
+import Hammer from '@egjs/hammerjs';
+import { State } from '../State';
+export const CONTENT_TOUCHES_DELAY = 240;
+export const CONTENT_TOUCHES_QUICK_TAP_END_DELAY = 50;
+export const MULTI_FINGER_PAN_MAX_PINCH_THRESHOLD = 0.1;
+export const MULTI_FINGER_PAN_MAX_ROTATION_THRESHOLD = 7;
+export const DEG_RAD = Math.PI / 180;
+// Map Hammer values to RNGH
+export const EventMap = {
+    [Hammer.INPUT_START]: State.BEGAN,
+    [Hammer.INPUT_MOVE]: State.ACTIVE,
+    [Hammer.INPUT_END]: State.END,
+    [Hammer.INPUT_CANCEL]: State.FAILED,
+};
+export const Direction = {
+    RIGHT: 1,
+    LEFT: 2,
+    UP: 4,
+    DOWN: 8,
+};
+export const DirectionMap = {
+    [Hammer.DIRECTION_RIGHT]: Direction.RIGHT,
+    [Hammer.DIRECTION_LEFT]: Direction.LEFT,
+    [Hammer.DIRECTION_UP]: Direction.UP,
+    [Hammer.DIRECTION_DOWN]: Direction.DOWN,
+};
+export const HammerInputNames = {
+    [Hammer.INPUT_START]: 'START',
+    [Hammer.INPUT_MOVE]: 'MOVE',
+    [Hammer.INPUT_END]: 'END',
+    [Hammer.INPUT_CANCEL]: 'CANCEL',
+};
+export const HammerDirectionNames = {
+    [Hammer.DIRECTION_HORIZONTAL]: 'HORIZONTAL',
+    [Hammer.DIRECTION_UP]: 'UP',
+    [Hammer.DIRECTION_DOWN]: 'DOWN',
+    [Hammer.DIRECTION_VERTICAL]: 'VERTICAL',
+    [Hammer.DIRECTION_NONE]: 'NONE',
+    [Hammer.DIRECTION_ALL]: 'ALL',
+    [Hammer.DIRECTION_RIGHT]: 'RIGHT',
+    [Hammer.DIRECTION_LEFT]: 'LEFT',
+};

package/lib/typescript/web_hammer/utils.d.ts

@@ -7,4 +7,3 @@ export declare const VEC_LEN_SQ: ({ x, y }?: {
 }) => number;
 export declare const TEST_MAX_IF_NOT_NAN: (value: number, max: number) => boolean;
 export declare function fireAfterInterval(method: () => void, interval?: number | boolean): number | null;
-//# sourceMappingURL=utils.d.ts.map

package/lib/typescript/web_hammer/utils.js

@@ -0,0 +1,15 @@
+// TODO(TS) remove if not necessary after rewrite
+export const isnan = (v) => Number.isNaN(v);
+// TODO(TS) remove if not necessary after rewrite
+export const isValidNumber = (v) => typeof v === 'number' && !Number.isNaN(v);
+export const TEST_MIN_IF_NOT_NAN = (value, limit) => !isnan(limit) &&
+    ((limit < 0 && value <= limit) || (limit >= 0 && value >= limit));
+export const VEC_LEN_SQ = ({ x = 0, y = 0 } = {}) => x * x + y * y;
+export const TEST_MAX_IF_NOT_NAN = (value, max) => !isnan(max) && ((max < 0 && value < max) || (max >= 0 && value > max));
+export function fireAfterInterval(method, interval) {
+    if (!interval) {
+        method();
+        return null;
+    }
+    return setTimeout(() => method(), interval);
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-gesture-handler",
-  "version": "2.26.0",
+  "version": "2.27.1",
   "description": "Declarative API exposing native platform touch and gesture system to React Native",
   "scripts": {
     "test": "jest",
@@ -16,7 +16,9 @@
     "circular-dependency-check": "yarn madge --extensions js,ts,tsx --circular src",
     "architectures-consistency-check": "node ../../scripts/codegen-check-consistency.js",
     "sync-architectures": "node ../../scripts/codegen-sync-archs.js",
-    "clean": "rm -rf node_modules android/build android/.cxx"
+    "clean": "rm -rf node_modules android/build android/.cxx",
+    "prepack": "cp ../../README.md ./README.md",
+    "postpack": "rm ./README.md"
   },
   "react-native": "src/index.ts",
   "main": "lib/commonjs/index.js",