react-native-gesture-handler 2.18.0 → 2.19.0

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

@@ -1,2 +1,2 @@
 export declare const DEFAULT_TOUCH_SLOP = 15;
-export declare const MINIMAL_FLING_VELOCITY = 0.1;
+export declare const MINIMAL_RECOGNIZABLE_MAGNITUDE = 0.1;

package/lib/typescript/web/handlers/GestureHandler.d.ts

@@ -3,10 +3,10 @@ import { State } from '../../State';
 import { Config, AdaptedEvent } from '../interfaces';
 import EventManager from '../tools/EventManager';
 import PointerTracker from '../tools/PointerTracker';
-import { GestureHandlerDelegate } from '../tools/GestureHandlerDelegate';
 import IGestureHandler from './IGestureHandler';
 import { MouseButton } from '../../handlers/gestureHandlerCommon';
 import { PointerType } from '../../PointerType';
+import { GestureHandlerDelegate } from '../tools/GestureHandlerDelegate';
 export default abstract class GestureHandler implements IGestureHandler {
     private lastSentState;
     protected currentState: State;

package/lib/typescript/web/handlers/LongPressGestureHandler.d.ts

@@ -6,6 +6,7 @@ export default class LongPressGestureHandler extends GestureHandler {
     private minDurationMs;
     private defaultMaxDistSq;
     private maxDistSq;
+    private numberOfPointers;
     private startX;
     private startY;
     private startTime;
@@ -19,8 +20,10 @@ export default class LongPressGestureHandler extends GestureHandler {
     protected resetConfig(): void;
     protected onStateChange(_newState: State, _oldState: State): void;
     protected onPointerDown(event: AdaptedEvent): void;
+    protected onPointerAdd(event: AdaptedEvent): void;
     protected onPointerMove(event: AdaptedEvent): void;
     protected onPointerUp(event: AdaptedEvent): void;
+    protected onPointerRemove(event: AdaptedEvent): void;
     private tryBegin;
     private tryActivate;
     private checkDistanceFail;

package/lib/typescript/web/handlers/NativeViewGestureHandler.d.ts

@@ -10,6 +10,7 @@ export default class NativeViewGestureHandler extends GestureHandler {
     private minDistSq;
     init(ref: number, propsRef: React.RefObject<unknown>): void;
     updateGestureConfig({ enabled, ...props }: Config): void;
+    private restoreViewStyles;
     protected resetConfig(): void;
     protected onPointerDown(event: AdaptedEvent): void;
     protected onPointerAdd(event: AdaptedEvent): void;

package/lib/typescript/web/interfaces.d.ts

@@ -17,7 +17,7 @@ export interface Handler {
 }
 type ConfigArgs = number | boolean | HitSlop | UserSelect | TouchAction | ActiveCursor | Directions | Handler[] | null | undefined;
 export interface Config extends Record<string, ConfigArgs> {
-    enabled?: boolean;
+    enabled: boolean;
     simultaneousHandlers?: Handler[] | null;
     waitFor?: Handler[] | null;
     blocksHandlers?: Handler[] | null;

package/lib/typescript/web/tools/GestureHandlerDelegate.d.ts

@@ -19,5 +19,6 @@ export interface GestureHandlerDelegate<TComponent, THandler> {
     onEnd(): void;
     onCancel(): void;
     onFail(): void;
+    onEnabledChange(enabled: boolean): void;
     destroy(config: Config): void;
 }

package/lib/typescript/web/tools/GestureHandlerWebDelegate.d.ts

@@ -2,9 +2,11 @@ import type IGestureHandler from '../handlers/IGestureHandler';
 import { GestureHandlerDelegate, MeasureResult } from './GestureHandlerDelegate';
 import { Config } from '../interfaces';
 export declare class GestureHandlerWebDelegate implements GestureHandlerDelegate<HTMLElement, IGestureHandler> {
+    private isInitialized;
     private view;
     private gestureHandler;
     private eventManagers;
+    private defaultViewStyles;
     getView(): HTMLElement;
     init(viewRef: number, handler: IGestureHandler): void;
     isPointerInBounds({ x, y }: {
@@ -19,6 +21,10 @@ export declare class GestureHandlerWebDelegate implements GestureHandlerDelegate
     private removeContextMenuListeners;
     private disableContextMenu;
     private enableContextMenu;
+    private setUserSelect;
+    private setTouchAction;
+    private setContextMenu;
+    onEnabledChange(enabled: boolean): void;
     onBegin(): void;
     onActivate(): void;
     onEnd(): void;

package/lib/typescript/web/tools/KeyboardEventManager.d.ts

@@ -0,0 +1,13 @@
+import { AdaptedEvent, EventTypes } from '../interfaces';
+import EventManager from './EventManager';
+export default class KeyboardEventManager extends EventManager<HTMLElement> {
+    private activationKeys;
+    private cancelationKeys;
+    private isPressed;
+    private keyDownCallback;
+    private keyUpCallback;
+    private dispatchEvent;
+    registerListeners(): void;
+    unregisterListeners(): void;
+    protected mapEvent(event: KeyboardEvent, eventType: EventTypes): AdaptedEvent;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-gesture-handler",
-  "version": "2.18.0",
+  "version": "2.19.0",
   "description": "Experimental implementation of a new declarative API for gesture handling in react-native",
   "scripts": {
     "prepare": "bob build && husky install",
@@ -11,7 +11,7 @@
     "ts-check": "yarn tsc --noEmit",
     "format:js": "prettier --write --list-different './{src,example,FabricExample,MacOSExample}/**/*.{js,jsx,ts,tsx}'",
     "format:android": "node ./scripts/format-android.js",
-    "format:ios": "find apple/ -iname *.h -o -iname *.m -o -iname *.cpp -o -iname *.mm | xargs clang-format -i",
+    "format:apple": "find apple/ -iname *.h -o -iname *.m -o -iname *.cpp -o -iname *.mm | xargs clang-format -i",
     "lint:js": "eslint --ext '.js,.ts,.tsx' src/ example/src FabricExample/src MacOSExample/src && yarn prettier --check './{src,example,FabricExample,MacOSExample}/**/*.{js,jsx,ts,tsx}'",
     "lint:js-root": "eslint --ext '.js,.ts,.tsx' src/ && yarn prettier --check './src/**/*.{js,jsx,ts,tsx}'",
     "lint:android": "./android/gradlew -p android spotlessCheck -q",
@@ -114,7 +114,7 @@
   "lint-staged": {
     "./{src,example,FabricExample,MacOSExample}/**/*.{ts,tsx}": "yarn format:js",
     "android/**/*.kt": "yarn format:android",
-    "apple/**/*.{h,m,mm,cpp}": "yarn format:ios",
+    "apple/**/*.{h,m,mm,cpp}": "yarn format:apple",
     "src/specs/*.ts": "yarn sync-architectures"
   },
   "release-it": {

package/src/PointerType.ts

@@ -2,5 +2,6 @@ export enum PointerType {
   TOUCH,
   STYLUS,
   MOUSE,
+  KEY,
   OTHER,
 }

package/src/components/Pressable/Pressable.tsx

@@ -22,13 +22,34 @@ import {
 } from './utils';
 import { PressabilityDebugView } from '../../handlers/PressabilityDebugView';
 import { GestureTouchEvent } from '../../handlers/gestureHandlerCommon';
+import { INT32_MAX } from '../../utils';
 
 const DEFAULT_LONG_PRESS_DURATION = 500;
 
 export default function Pressable(props: PressableProps) {
-  const [pressedState, setPressedState] = useState(
-    props.testOnly_pressed ?? false
-  );
+  const {
+    testOnly_pressed,
+    hitSlop,
+    pressRetentionOffset,
+    delayHoverIn,
+    onHoverIn,
+    delayHoverOut,
+    onHoverOut,
+    delayLongPress,
+    unstable_pressDelay,
+    onPress,
+    onPressIn,
+    onPressOut,
+    onLongPress,
+    style,
+    children,
+    android_disableSound,
+    android_ripple,
+    disabled,
+    ...remainingProps
+  } = props;
+
+  const [pressedState, setPressedState] = useState(testOnly_pressed ?? false);
 
   const pressableRef = useRef<View>(null);
 
@@ -39,18 +60,16 @@ export default function Pressable(props: PressableProps) {
 
   const normalizedHitSlop: Insets = useMemo(
     () =>
-      typeof props.hitSlop === 'number'
-        ? numberAsInset(props.hitSlop)
-        : props.hitSlop ?? {},
-    [props.hitSlop]
+      typeof hitSlop === 'number' ? numberAsInset(hitSlop) : hitSlop ?? {},
+    [hitSlop]
   );
 
   const normalizedPressRetentionOffset: Insets = useMemo(
     () =>
-      typeof props.pressRetentionOffset === 'number'
-        ? numberAsInset(props.pressRetentionOffset)
-        : props.pressRetentionOffset ?? {},
-    [props.pressRetentionOffset]
+      typeof pressRetentionOffset === 'number'
+        ? numberAsInset(pressRetentionOffset)
+        : pressRetentionOffset ?? {},
+    [pressRetentionOffset]
   );
 
   const hoverInTimeout = useRef<number | null>(null);
@@ -65,29 +84,29 @@ export default function Pressable(props: PressableProps) {
           if (hoverOutTimeout.current) {
             clearTimeout(hoverOutTimeout.current);
           }
-          if (props.delayHoverIn) {
+          if (delayHoverIn) {
             hoverInTimeout.current = setTimeout(
-              () => props.onHoverIn?.(gestureToPressableEvent(event)),
-              props.delayHoverIn
+              () => onHoverIn?.(gestureToPressableEvent(event)),
+              delayHoverIn
             );
             return;
           }
-          props.onHoverIn?.(gestureToPressableEvent(event));
+          onHoverIn?.(gestureToPressableEvent(event));
         })
         .onFinalize((event) => {
           if (hoverInTimeout.current) {
             clearTimeout(hoverInTimeout.current);
           }
-          if (props.delayHoverOut) {
+          if (delayHoverOut) {
             hoverOutTimeout.current = setTimeout(
-              () => props.onHoverOut?.(gestureToPressableEvent(event)),
-              props.delayHoverOut
+              () => onHoverOut?.(gestureToPressableEvent(event)),
+              delayHoverOut
             );
             return;
           }
-          props.onHoverOut?.(gestureToPressableEvent(event));
+          onHoverOut?.(gestureToPressableEvent(event));
         }),
-    [props]
+    [delayHoverIn, delayHoverOut, onHoverIn, onHoverOut]
   );
 
   const pressDelayTimeoutRef = useRef<number | null>(null);
@@ -108,12 +127,12 @@ export default function Pressable(props: PressableProps) {
 
       deferredEventPayload.current = null;
 
-      props.onPressIn?.(event);
+      onPressIn?.(event);
       isPressCallbackEnabled.current = true;
       pressDelayTimeoutRef.current = null;
       setPressedState(true);
     },
-    [props]
+    [onPressIn]
   );
 
   const pressOutHandler = useCallback(
@@ -126,7 +145,7 @@ export default function Pressable(props: PressableProps) {
         return;
       }
 
-      if (props.unstable_pressDelay && pressDelayTimeoutRef.current !== null) {
+      if (unstable_pressDelay && pressDelayTimeoutRef.current !== null) {
         // When delay is preemptively finished by lifting touches,
         // we want to immediately activate it's effects - pressInHandler,
         // even though we are located at the pressOutHandler
@@ -135,14 +154,14 @@ export default function Pressable(props: PressableProps) {
       }
 
       if (deferredEventPayload.current) {
-        props.onPressIn?.(deferredEventPayload.current);
+        onPressIn?.(deferredEventPayload.current);
         deferredEventPayload.current = null;
       }
 
-      props.onPressOut?.(event);
+      onPressOut?.(event);
 
       if (isPressCallbackEnabled.current) {
-        props.onPress?.(event);
+        onPress?.(event);
       }
 
       if (longPressTimeoutRef.current) {
@@ -155,7 +174,7 @@ export default function Pressable(props: PressableProps) {
       isPressCallbackEnabled.current = true;
       setPressedState(false);
     },
-    [pressInHandler, props]
+    [onPress, onPressIn, onPressOut, pressInHandler, unstable_pressDelay]
   );
 
   const handlingOnTouchesDown = useRef<boolean>(false);
@@ -169,7 +188,7 @@ export default function Pressable(props: PressableProps) {
       }
 
       if (hasPassedBoundsChecks.current) {
-        props.onLongPress?.(gestureTouchToPressableEvent(event));
+        onLongPress?.(gestureTouchToPressableEvent(event));
         isPressCallbackEnabled.current = false;
       }
 
@@ -178,19 +197,19 @@ export default function Pressable(props: PressableProps) {
         longPressTimeoutRef.current = null;
       }
     },
-    [props]
+    [onLongPress]
   );
 
   const longPressTimeoutRef = useRef<number | null>(null);
   const longPressMinDuration =
-    (props.delayLongPress ?? DEFAULT_LONG_PRESS_DURATION) +
-    (props.unstable_pressDelay ?? 0);
+    (delayLongPress ?? DEFAULT_LONG_PRESS_DURATION) +
+    (unstable_pressDelay ?? 0);
 
   const pressAndTouchGesture = useMemo(
     () =>
       Gesture.LongPress()
-        .minDuration(Number.MAX_SAFE_INTEGER) // Stops long press from blocking native gesture
-        .maxDistance(Number.MAX_SAFE_INTEGER) // Stops long press from cancelling after set distance
+        .minDuration(INT32_MAX) // Stops long press from blocking native gesture
+        .maxDistance(INT32_MAX) // Stops long press from cancelling after set distance
         .cancelsTouchesInView(false)
         .onTouchesDown((event) => {
           handlingOnTouchesDown.current = true;
@@ -224,10 +243,10 @@ export default function Pressable(props: PressableProps) {
               );
             }
 
-            if (props.unstable_pressDelay) {
+            if (unstable_pressDelay) {
               pressDelayTimeoutRef.current = setTimeout(() => {
                 pressInHandler(gestureTouchToPressableEvent(event));
-              }, props.unstable_pressDelay);
+              }, unstable_pressDelay);
             } else {
               pressInHandler(gestureTouchToPressableEvent(event));
             }
@@ -275,7 +294,7 @@ export default function Pressable(props: PressableProps) {
       normalizedHitSlop,
       pressInHandler,
       pressOutHandler,
-      props.unstable_pressDelay,
+      unstable_pressDelay,
     ]
   );
 
@@ -333,7 +352,7 @@ export default function Pressable(props: PressableProps) {
     normalizedPressRetentionOffset
   );
 
-  const isPressableEnabled = props.disabled !== true;
+  const isPressableEnabled = disabled !== true;
 
   const gestures = [pressAndTouchGesture, hoverGesture, buttonGesture];
 
@@ -353,40 +372,41 @@ export default function Pressable(props: PressableProps) {
 
   const gesture = Gesture.Simultaneous(...gestures);
 
-  const defaultRippleColor = props.android_ripple ? undefined : 'transparent';
+  const defaultRippleColor = android_ripple ? undefined : 'transparent';
 
   // `cursor: 'pointer'` on `RNButton` crashes iOS
   const pointerStyle: StyleProp<ViewStyle> =
     Platform.OS === 'web' ? { cursor: 'pointer' } : {};
 
   const styleProp =
-    typeof props.style === 'function'
-      ? props.style({ pressed: pressedState })
-      : props.style;
+    typeof style === 'function' ? style({ pressed: pressedState }) : style;
 
   const childrenProp =
-    typeof props.children === 'function'
-      ? props.children({ pressed: pressedState })
-      : props.children;
+    typeof children === 'function'
+      ? children({ pressed: pressedState })
+      : children;
 
   const flattenedStyles = StyleSheet.flatten(styleProp ?? {});
 
   const [innerStyles, outerStyles] = splitStyles(flattenedStyles);
 
   return (
-    <View style={outerStyles}>
+    <View {...remainingProps} style={outerStyles}>
       <GestureDetector gesture={gesture}>
         <NativeButton
           ref={pressableRef}
-          testID={props.testID}
           hitSlop={appliedHitSlop}
           enabled={isPressableEnabled}
-          touchSoundDisabled={props.android_disableSound ?? undefined}
+          touchSoundDisabled={android_disableSound ?? undefined}
           rippleColor={processColor(
-            props.android_ripple?.color ?? defaultRippleColor
+            android_ripple?.color ?? defaultRippleColor
           )}
-          rippleRadius={props.android_ripple?.radius ?? undefined}
-          style={[StyleSheet.absoluteFill, pointerStyle, innerStyles]}>
+          rippleRadius={android_ripple?.radius ?? undefined}
+          style={[
+            { width: '100%', height: '100%' },
+            pointerStyle,
+            innerStyles,
+          ]}>
           {childrenProp}
           {__DEV__ ? (
             <PressabilityDebugView color="red" hitSlop={normalizedHitSlop} />

package/src/components/Pressable/index.ts

@@ -1,2 +1,2 @@
-export { PressableProps } from './PressableProps';
+export type { PressableProps } from './PressableProps';
 export { default } from './Pressable';

package/src/components/ReanimatedSwipeable.tsx

@@ -199,6 +199,26 @@ const Swipeable = forwardRef<SwipeableMethods, SwipeableProps>(
     props: SwipeableProps,
     ref: ForwardedRef<SwipeableMethods>
   ) {
+    const {
+      leftThreshold,
+      rightThreshold,
+      onSwipeableOpenStartDrag,
+      onSwipeableCloseStartDrag,
+      enableTrackpadTwoFingerGesture,
+      enabled,
+      containerStyle,
+      childrenContainerStyle,
+      animationOptions,
+      overshootLeft,
+      overshootRight,
+      onSwipeableWillOpen,
+      onSwipeableWillClose,
+      onSwipeableOpen,
+      onSwipeableClose,
+      testID,
+      ...remainingProps
+    } = props;
+
     const rowState = useSharedValue<number>(0);
 
     const userDrag = useSharedValue<number>(0);
@@ -240,8 +260,8 @@ const Swipeable = forwardRef<SwipeableMethods, SwipeableProps>(
       overshootFriction = defaultProps.overshootFriction,
     } = props;
 
-    const overshootLeftProp = props.overshootLeft;
-    const overshootRightProp = props.overshootRight;
+    const overshootLeftProp = overshootLeft;
+    const overshootRightProp = overshootRight;
 
     const calculateCurrentOffset = useCallback(() => {
       'worklet';
@@ -317,45 +337,40 @@ const Swipeable = forwardRef<SwipeableMethods, SwipeableProps>(
 
     const dispatchImmediateEvents = useCallback(
       (fromValue: number, toValue: number) => {
-        if (toValue > 0 && props.onSwipeableWillOpen) {
-          props.onSwipeableWillOpen('left');
-        } else if (toValue < 0 && props.onSwipeableWillOpen) {
-          props.onSwipeableWillOpen('right');
-        } else if (props.onSwipeableWillClose) {
+        if (toValue > 0 && onSwipeableWillOpen) {
+          onSwipeableWillOpen('left');
+        } else if (toValue < 0 && onSwipeableWillOpen) {
+          onSwipeableWillOpen('right');
+        } else if (onSwipeableWillClose) {
           const closingDirection = fromValue > 0 ? 'left' : 'right';
-          props.onSwipeableWillClose(closingDirection);
+          onSwipeableWillClose(closingDirection);
         }
       },
-      [
-        props,
-        props.onSwipeableWillClose,
-        props.onSwipeableWillOpen,
-        swipeableMethods,
-      ]
+      [onSwipeableWillClose, onSwipeableWillOpen]
     );
 
     const dispatchEndEvents = useCallback(
       (fromValue: number, toValue: number) => {
-        if (toValue > 0 && props.onSwipeableOpen) {
-          props.onSwipeableOpen('left', swipeableMethods.current);
-        } else if (toValue < 0 && props.onSwipeableOpen) {
-          props.onSwipeableOpen('right', swipeableMethods.current);
-        } else if (props.onSwipeableClose) {
+        if (toValue > 0 && onSwipeableOpen) {
+          onSwipeableOpen('left', swipeableMethods.current);
+        } else if (toValue < 0 && onSwipeableOpen) {
+          onSwipeableOpen('right', swipeableMethods.current);
+        } else if (onSwipeableClose) {
           const closingDirection = fromValue > 0 ? 'left' : 'right';
-          props.onSwipeableClose(closingDirection, swipeableMethods.current);
+          onSwipeableClose(closingDirection, swipeableMethods.current);
         }
       },
-      [props, props.onSwipeableClose, props.onSwipeableOpen, swipeableMethods]
+      [onSwipeableClose, onSwipeableOpen]
     );
 
-    const animationOptionsProp = props.animationOptions;
+    const animationOptionsProp = animationOptions;
 
     const animateRow = useCallback(
       (fromValue: number, toValue: number, velocityX?: number) => {
         'worklet';
         rowState.value = Math.sign(toValue);
 
-        const springConfig = {
+        const translationSpringConfig = {
           duration: 1000,
           dampingRatio: 0.9,
           stiffness: 500,
@@ -364,9 +379,14 @@ const Swipeable = forwardRef<SwipeableMethods, SwipeableProps>(
           ...animationOptionsProp,
         };
 
+        const progressSpringConfig = {
+          ...translationSpringConfig,
+          velocity: 0,
+        };
+
         appliedTranslation.value = withSpring(
           toValue,
-          springConfig,
+          translationSpringConfig,
           (isFinished) => {
             if (isFinished) {
               runOnJS(dispatchEndEvents)(fromValue, toValue);
@@ -376,23 +396,27 @@ const Swipeable = forwardRef<SwipeableMethods, SwipeableProps>(
 
         const progressTarget = toValue === 0 ? 0 : 1;
 
-        // Velocity is in px, while progress is in %
-        springConfig.velocity = 0;
-
         showLeftProgress.value =
-          leftWidth.value > 0 ? withSpring(progressTarget, springConfig) : 0;
+          leftWidth.value > 0
+            ? withSpring(progressTarget, progressSpringConfig)
+            : 0;
         showRightProgress.value =
-          rightWidth.value > 0 ? withSpring(progressTarget, springConfig) : 0;
+          rightWidth.value > 0
+            ? withSpring(progressTarget, progressSpringConfig)
+            : 0;
 
         runOnJS(dispatchImmediateEvents)(fromValue, toValue);
       },
       [
-        showLeftProgress,
+        rowState,
+        animationOptionsProp,
         appliedTranslation,
-        dispatchEndEvents,
+        showLeftProgress,
+        leftWidth.value,
+        showRightProgress,
+        rightWidth.value,
         dispatchImmediateEvents,
-        animationOptionsProp,
-        rowState,
+        dispatchEndEvents,
       ]
     );
 
@@ -483,8 +507,8 @@ const Swipeable = forwardRef<SwipeableMethods, SwipeableProps>(
       </Animated.View>
     );
 
-    const leftThresholdProp = props.leftThreshold;
-    const rightThresholdProp = props.rightThreshold;
+    const leftThresholdProp = leftThreshold;
+    const rightThresholdProp = rightThreshold;
 
     const handleRelease = (
       event: GestureStateChangeEvent<PanGestureHandlerEventPayload>
@@ -535,9 +559,6 @@ const Swipeable = forwardRef<SwipeableMethods, SwipeableProps>(
       }
     });
 
-    const onSwipeableOpenStartDrag = props.onSwipeableOpenStartDrag;
-    const onSwipeableCloseStartDrag = props.onSwipeableCloseStartDrag;
-
     const panGesture = Gesture.Pan()
       .onUpdate((event: GestureUpdateEvent<PanGestureHandlerEventPayload>) => {
         userDrag.value = event.translationX;
@@ -564,10 +585,8 @@ const Swipeable = forwardRef<SwipeableMethods, SwipeableProps>(
         }
       );
 
-    if (props.enableTrackpadTwoFingerGesture) {
-      panGesture.enableTrackpadTwoFingerGesture(
-        props.enableTrackpadTwoFingerGesture
-      );
+    if (enableTrackpadTwoFingerGesture) {
+      panGesture.enableTrackpadTwoFingerGesture(enableTrackpadTwoFingerGesture);
     }
 
     panGesture.activeOffsetX([
@@ -580,7 +599,7 @@ const Swipeable = forwardRef<SwipeableMethods, SwipeableProps>(
       swipeableMethods,
     ]);
 
-    panGesture.enabled(props.enabled !== false);
+    panGesture.enabled(enabled !== false);
 
     const animatedStyle = useAnimatedStyle(
       () => ({
@@ -590,12 +609,10 @@ const Swipeable = forwardRef<SwipeableMethods, SwipeableProps>(
       [appliedTranslation, rowState]
     );
 
-    const containerStyle = props.containerStyle;
-    const childrenContainerStyle = props.childrenContainerStyle;
-
-    return (
+    const swipeableComponent = (
       <GestureDetector gesture={panGesture} touchAction="pan-y">
         <Animated.View
+          {...remainingProps}
           onLayout={onRowLayout}
           style={[styles.container, containerStyle]}>
           {leftElement}
@@ -608,6 +625,12 @@ const Swipeable = forwardRef<SwipeableMethods, SwipeableProps>(
         </Animated.View>
       </GestureDetector>
     );
+
+    return testID ? (
+      <View testID={testID}>{swipeableComponent}</View>
+    ) : (
+      swipeableComponent
+    );
   }
 );
 

package/src/components/Swipeable.tsx

@@ -222,6 +222,12 @@ type SwipeableState = {
   rowWidth?: number;
 };
 
+/**
+ * @deprecated use Reanimated version of Swipeable instead
+ *
+ * This component allows for implementing swipeable rows or similar interaction.
+ */
+
 export default class Swipeable extends Component<
   SwipeableProps,
   SwipeableState

package/src/handlers/LongPressGestureHandler.ts

@@ -8,6 +8,7 @@ import {
 export const longPressGestureHandlerProps = [
   'minDurationMs',
   'maxDist',
+  'numberOfPointers',
 ] as const;
 
 export interface LongPressGestureConfig {
@@ -24,6 +25,11 @@ export interface LongPressGestureConfig {
    * will fail to recognize the gesture. The default value is 10.
    */
   maxDist?: number;
+
+  /**
+   * Determine exact number of points required to handle the long press gesture.
+   */
+  numberOfPointers?: number;
 }
 
 export interface LongPressGestureHandlerProps