react-native-gesture-handler 2.21.2 → 2.22.0

package/src/jestUtils/jestUtils.ts

@@ -78,7 +78,7 @@ try {
 }
 
 type GestureHandlerTestEvent<
-  TEventPayload extends Record<string, unknown> = Record<string, unknown>
+  TEventPayload extends Record<string, unknown> = Record<string, unknown>,
 > = (
   | GestureEvent<TEventPayload>
   | HandlerStateChangeEvent<TEventPayload>
@@ -454,17 +454,15 @@ type AllHandlers =
 // prettier-ignore
 type ClassComponentConstructor<P> = new (props: P) => React.Component<P, any, any>;
 
-type ExtractPayloadFromProps<T> = T extends BaseGestureHandlerProps<
-  infer TPayload
->
-  ? TPayload
-  : never;
-
-type ExtractConfig<T> = T extends BaseGesture<infer TGesturePayload>
-  ? TGesturePayload
-  : T extends ClassComponentConstructor<infer THandlerProps>
-  ? ExtractPayloadFromProps<THandlerProps>
-  : Record<string, unknown>;
+type ExtractPayloadFromProps<T> =
+  T extends BaseGestureHandlerProps<infer TPayload> ? TPayload : never;
+
+type ExtractConfig<T> =
+  T extends BaseGesture<infer TGesturePayload>
+    ? TGesturePayload
+    : T extends ClassComponentConstructor<infer THandlerProps>
+      ? ExtractPayloadFromProps<THandlerProps>
+      : Record<string, unknown>;
 
 export function fireGestureHandler<THandler extends AllGestures | AllHandlers>(
   componentOrGesture: ReactTestInstance | GestureType,

package/src/mountRegistry.ts

@@ -0,0 +1,51 @@
+import { GestureType } from './handlers/gestures/gesture';
+
+interface ReactComponentWithHandlerTag extends React.Component {
+  handlerTag: number;
+}
+
+export type GestureMountListener = (
+  gesture: GestureType | ReactComponentWithHandlerTag
+) => void;
+
+// eslint-disable-next-line @typescript-eslint/no-extraneous-class
+export class MountRegistry {
+  private static mountListeners = new Set<GestureMountListener>();
+  private static unmountListeners = new Set<GestureMountListener>();
+
+  static addMountListener(listener: GestureMountListener): () => void {
+    this.mountListeners.add(listener);
+
+    return () => {
+      this.mountListeners.delete(listener);
+    };
+  }
+
+  static addUnmountListener(listener: GestureMountListener): () => void {
+    this.unmountListeners.add(listener);
+
+    return () => {
+      this.unmountListeners.delete(listener);
+    };
+  }
+
+  static gestureHandlerWillMount(handler: React.Component) {
+    this.mountListeners.forEach((listener) =>
+      listener(handler as ReactComponentWithHandlerTag)
+    );
+  }
+
+  static gestureHandlerWillUnmount(handler: React.Component) {
+    this.unmountListeners.forEach((listener) =>
+      listener(handler as ReactComponentWithHandlerTag)
+    );
+  }
+
+  static gestureWillMount(gesture: GestureType) {
+    this.mountListeners.forEach((listener) => listener(gesture));
+  }
+
+  static gestureWillUnmount(gesture: GestureType) {
+    this.unmountListeners.forEach((listener) => listener(gesture));
+  }
+}

package/src/web/detectors/ScaleGestureDetector.ts

@@ -29,7 +29,7 @@ export default class ScaleGestureDetector implements ScaleGestureListener {
   private spanSlop: number;
   private minSpan: number;
 
-  public constructor(callbacks: ScaleGestureListener) {
+  constructor(callbacks: ScaleGestureListener) {
     this.onScaleBegin = callbacks.onScaleBegin;
     this.onScale = callbacks.onScale;
     this.onScaleEnd = callbacks.onScaleEnd;

package/src/web/handlers/FlingGestureHandler.ts

@@ -26,10 +26,6 @@ export default class FlingGestureHandler extends GestureHandler {
   private maxNumberOfPointersSimultaneously = 0;
   private keyPointer = NaN;
 
-  public init(ref: number, propsRef: React.RefObject<unknown>): void {
-    super.init(ref, propsRef);
-  }
-
   public updateGestureConfig({ enabled = true, ...props }: Config): void {
     super.updateGestureConfig({ enabled: enabled, ...props });
 

package/src/web/handlers/GestureHandler.ts

@@ -43,9 +43,7 @@ export default abstract class GestureHandler implements IGestureHandler {
 
   protected delegate: GestureHandlerDelegate<unknown, IGestureHandler>;
 
-  public constructor(
-    delegate: GestureHandlerDelegate<unknown, IGestureHandler>
-  ) {
+  constructor(delegate: GestureHandlerDelegate<unknown, IGestureHandler>) {
     this.delegate = delegate;
   }
 

package/src/web/handlers/HoverGestureHandler.ts

@@ -1,15 +1,11 @@
 import { State } from '../../State';
-import { AdaptedEvent, Config, StylusData } from '../interfaces';
+import { AdaptedEvent, StylusData } from '../interfaces';
 import GestureHandlerOrchestrator from '../tools/GestureHandlerOrchestrator';
 import GestureHandler from './GestureHandler';
 
 export default class HoverGestureHandler extends GestureHandler {
   private stylusData: StylusData | undefined;
 
-  public init(ref: number, propsRef: React.RefObject<unknown>) {
-    super.init(ref, propsRef);
-  }
-
   protected transformNativeEvent(): Record<string, unknown> {
     return {
       ...super.transformNativeEvent(),
@@ -17,10 +13,6 @@ export default class HoverGestureHandler extends GestureHandler {
     };
   }
 
-  public updateGestureConfig({ enabled = true, ...props }: Config): void {
-    super.updateGestureConfig({ enabled: enabled, ...props });
-  }
-
   protected onPointerMoveOver(event: AdaptedEvent): void {
     GestureHandlerOrchestrator.getInstance().recordHandlerIfNotPresent(this);
 

package/src/web/handlers/LongPressGestureHandler.ts

@@ -101,6 +101,12 @@ export default class LongPressGestureHandler extends GestureHandler {
     this.checkDistanceFail();
   }
 
+  protected onPointerOutOfBounds(event: AdaptedEvent): void {
+    super.onPointerOutOfBounds(event);
+    this.tracker.track(event);
+    this.checkDistanceFail();
+  }
+
   protected onPointerUp(event: AdaptedEvent): void {
     super.onPointerUp(event);
     this.tracker.removeFromTracker(event.pointerId);

package/src/web/handlers/ManualGestureHandler.ts

@@ -1,15 +1,7 @@
-import { AdaptedEvent, Config } from '../interfaces';
+import { AdaptedEvent } from '../interfaces';
 import GestureHandler from './GestureHandler';
 
 export default class ManualGestureHandler extends GestureHandler {
-  public init(ref: number, propsRef: React.RefObject<unknown>) {
-    super.init(ref, propsRef);
-  }
-
-  public updateGestureConfig({ enabled = true, ...props }: Config): void {
-    super.updateGestureConfig({ enabled: enabled, ...props });
-  }
-
   protected onPointerDown(event: AdaptedEvent): void {
     this.tracker.addToTracker(event);
     super.onPointerDown(event);

package/src/web/handlers/NativeViewGestureHandler.ts

@@ -55,10 +55,6 @@ export default class NativeViewGestureHandler extends GestureHandler {
     view.style['WebkitTouchCallout'] = 'auto';
   }
 
-  protected resetConfig(): void {
-    super.resetConfig();
-  }
-
   protected onPointerDown(event: AdaptedEvent): void {
     this.tracker.addToTracker(event);
     super.onPointerDown(event);
@@ -83,7 +79,11 @@ export default class NativeViewGestureHandler extends GestureHandler {
     }
 
     this.begin();
-    if (this.buttonRole) {
+
+    const view = this.delegate.getView() as HTMLElement;
+    const isRNGHText = view.hasAttribute('rnghtext');
+
+    if (this.buttonRole || isRNGHText) {
       this.activate();
     }
   }

package/src/web/handlers/PanGestureHandler.ts

@@ -61,10 +61,6 @@ export default class PanGestureHandler extends GestureHandler {
   private endWheelTimeout = 0;
   private wheelDevice = WheelDevice.UNDETERMINED;
 
-  public init(ref: number, propsRef: React.RefObject<unknown>): void {
-    super.init(ref, propsRef);
-  }
-
   public updateGestureConfig({ enabled = true, ...props }: Config): void {
     this.resetConfig();
 

package/src/web/handlers/PinchGestureHandler.ts

@@ -1,6 +1,6 @@
 import { State } from '../../State';
 import { DEFAULT_TOUCH_SLOP } from '../constants';
-import { AdaptedEvent, Config } from '../interfaces';
+import { AdaptedEvent } from '../interfaces';
 
 import GestureHandler from './GestureHandler';
 import ScaleGestureDetector, {
@@ -55,10 +55,6 @@ export default class PinchGestureHandler extends GestureHandler {
     this.setShouldCancelWhenOutside(false);
   }
 
-  public updateGestureConfig({ enabled = true, ...props }: Config): void {
-    super.updateGestureConfig({ enabled: enabled, ...props });
-  }
-
   protected transformNativeEvent() {
     return {
       focalX: this.scaleGestureDetector.getFocusX(),

package/src/web/handlers/RotationGestureHandler.ts

@@ -1,5 +1,5 @@
 import { State } from '../../State';
-import { AdaptedEvent, Config } from '../interfaces';
+import { AdaptedEvent } from '../interfaces';
 
 import GestureHandler from './GestureHandler';
 import RotationGestureDetector, {
@@ -50,10 +50,6 @@ export default class RotationGestureHandler extends GestureHandler {
     this.setShouldCancelWhenOutside(false);
   }
 
-  public updateGestureConfig({ enabled = true, ...props }: Config): void {
-    super.updateGestureConfig({ enabled: enabled, ...props });
-  }
-
   protected transformNativeEvent() {
     return {
       rotation: this.rotation ? this.rotation : 0,
@@ -158,10 +154,6 @@ export default class RotationGestureHandler extends GestureHandler {
     this.begin();
   }
 
-  public activate(_force?: boolean): void {
-    super.activate();
-  }
-
   protected onReset(): void {
     if (this.currentState === State.ACTIVE) {
       return;

package/src/web/handlers/TapGestureHandler.ts

@@ -31,10 +31,6 @@ export default class TapGestureHandler extends GestureHandler {
 
   private tapsSoFar = 0;
 
-  public init(ref: number, propsRef: React.RefObject<unknown>): void {
-    super.init(ref, propsRef);
-  }
-
   public updateGestureConfig({ enabled = true, ...props }: Config): void {
     super.updateGestureConfig({ enabled: enabled, ...props });
 

package/src/web/tools/GestureHandlerWebDelegate.ts

@@ -135,11 +135,11 @@ export class GestureHandlerWebDelegate
     const { userSelect } = this.gestureHandler.getConfig();
 
     this.view.style['userSelect'] = isHandlerEnabled
-      ? userSelect ?? 'none'
+      ? (userSelect ?? 'none')
       : this.defaultViewStyles.userSelect;
 
     this.view.style['webkitUserSelect'] = isHandlerEnabled
-      ? userSelect ?? 'none'
+      ? (userSelect ?? 'none')
       : this.defaultViewStyles.userSelect;
   }
 
@@ -147,12 +147,12 @@ export class GestureHandlerWebDelegate
     const { touchAction } = this.gestureHandler.getConfig();
 
     this.view.style['touchAction'] = isHandlerEnabled
-      ? touchAction ?? 'none'
+      ? (touchAction ?? 'none')
       : this.defaultViewStyles.touchAction;
 
     // @ts-ignore This one disables default events on Safari
     this.view.style['WebkitTouchCallout'] = isHandlerEnabled
-      ? touchAction ?? 'none'
+      ? (touchAction ?? 'none')
       : this.defaultViewStyles.touchAction;
   }
 

package/src/web_hammer/GestureHandler.ts

@@ -538,7 +538,7 @@ abstract class GestureHandler {
       'activeOffsetYStart',
       'activeOffsetYEnd',
     ] as const;
-    configProps.forEach((prop: typeof configProps[number]) => {
+    configProps.forEach((prop: (typeof configProps)[number]) => {
       if (typeof props[prop] === 'undefined') {
         props[prop] = Number.NaN;
       }

package/src/web_hammer/PressGestureHandler.ts

@@ -87,10 +87,13 @@ class PressGestureHandler extends DiscreteGestureHandler {
     this.isGestureRunning = true;
     clearTimeout(this.visualFeedbackTimer);
     this.initialEvent = ev;
-    this.visualFeedbackTimer = fireAfterInterval(() => {
-      this.sendGestureStartedEvent(this.initialEvent as HammerInputExt);
-      this.initialEvent = null;
-    }, this.shouldDelayTouchForEvent(ev) && CONTENT_TOUCHES_DELAY);
+    this.visualFeedbackTimer = fireAfterInterval(
+      () => {
+        this.sendGestureStartedEvent(this.initialEvent as HammerInputExt);
+        this.initialEvent = null;
+      },
+      this.shouldDelayTouchForEvent(ev) && CONTENT_TOUCHES_DELAY
+    );
   }
 
   sendGestureStartedEvent(ev: HammerInputExt) {