react-native-gesture-handler 2.22.1 → 2.23.0

package/src/web/tools/GestureHandlerOrchestrator.ts

@@ -5,7 +5,7 @@ import type IGestureHandler from '../handlers/IGestureHandler';
 import PointerTracker from './PointerTracker';
 
 export default class GestureHandlerOrchestrator {
-  private static instance: GestureHandlerOrchestrator;
+  private static _instance: GestureHandlerOrchestrator;
 
   private gestureHandlers: IGestureHandler[] = [];
   private awaitingHandlers: IGestureHandler[] = [];
@@ -26,9 +26,9 @@ export default class GestureHandlerOrchestrator {
 
   private cleanHandler(handler: IGestureHandler): void {
     handler.reset();
-    handler.setActive(false);
-    handler.setAwaiting(false);
-    handler.setActivationIndex(Number.MAX_VALUE);
+    handler.active = false;
+    handler.awaiting = false;
+    handler.activationIndex = Number.MAX_VALUE;
   }
 
   public removeHandlerFromOrchestrator(handler: IGestureHandler): void {
@@ -41,7 +41,7 @@ export default class GestureHandlerOrchestrator {
 
     if (indexInAwaitingHandlers >= 0) {
       this.awaitingHandlers.splice(indexInAwaitingHandlers, 1);
-      this.awaitingHandlersTags.delete(handler.getTag());
+      this.awaitingHandlersTags.delete(handler.handlerTag);
     }
   }
 
@@ -51,7 +51,7 @@ export default class GestureHandlerOrchestrator {
     for (let i = this.gestureHandlers.length - 1; i >= 0; --i) {
       const handler = this.gestureHandlers[i];
 
-      if (this.isFinished(handler.getState()) && !handler.isAwaiting()) {
+      if (this.isFinished(handler.state) && !handler.awaiting) {
         this.cleanHandler(handler);
         handlersToRemove.add(handler);
       }
@@ -65,7 +65,7 @@ export default class GestureHandlerOrchestrator {
   private hasOtherHandlerToWaitFor(handler: IGestureHandler): boolean {
     const hasToWaitFor = (otherHandler: IGestureHandler) => {
       return (
-        !this.isFinished(otherHandler.getState()) &&
+        !this.isFinished(otherHandler.state) &&
         this.shouldHandlerWaitForOther(handler, otherHandler)
       );
     };
@@ -79,7 +79,7 @@ export default class GestureHandlerOrchestrator {
     const shouldBeCancelled = (otherHandler: IGestureHandler) => {
       return (
         this.shouldHandlerWaitForOther(handler, otherHandler) &&
-        otherHandler.getState() === State.END
+        otherHandler.state === State.END
       );
     };
 
@@ -97,7 +97,7 @@ export default class GestureHandlerOrchestrator {
       return;
     }
 
-    const handlerState = handler.getState();
+    const handlerState = handler.state;
 
     if (handlerState === State.CANCELLED || handlerState === State.FAILED) {
       return;
@@ -129,7 +129,7 @@ export default class GestureHandlerOrchestrator {
   private cleanupAwaitingHandlers(handler: IGestureHandler): void {
     const shouldWait = (otherHandler: IGestureHandler) => {
       return (
-        !otherHandler.isAwaiting() &&
+        !otherHandler.awaiting &&
         this.shouldHandlerWaitForOther(otherHandler, handler)
       );
     };
@@ -137,12 +137,12 @@ export default class GestureHandlerOrchestrator {
     for (const otherHandler of this.awaitingHandlers) {
       if (shouldWait(otherHandler)) {
         this.cleanHandler(otherHandler);
-        this.awaitingHandlersTags.delete(otherHandler.getTag());
+        this.awaitingHandlersTags.delete(otherHandler.handlerTag);
       }
     }
 
     this.awaitingHandlers = this.awaitingHandlers.filter((otherHandler) =>
-      this.awaitingHandlersTags.has(otherHandler.getTag())
+      this.awaitingHandlersTags.has(otherHandler.handlerTag)
     );
   }
 
@@ -152,7 +152,7 @@ export default class GestureHandlerOrchestrator {
     oldState: State,
     sendIfDisabled?: boolean
   ): void {
-    if (!handler.isEnabled() && !sendIfDisabled) {
+    if (!handler.enabled && !sendIfDisabled) {
       return;
     }
 
@@ -162,7 +162,7 @@ export default class GestureHandlerOrchestrator {
       for (const otherHandler of this.awaitingHandlers) {
         if (
           !this.shouldHandlerWaitForOther(otherHandler, handler) ||
-          !this.awaitingHandlersTags.has(otherHandler.getTag())
+          !this.awaitingHandlersTags.has(otherHandler.handlerTag)
         ) {
           continue;
         }
@@ -174,7 +174,7 @@ export default class GestureHandlerOrchestrator {
 
         otherHandler.cancel();
 
-        if (otherHandler.getState() === State.END) {
+        if (otherHandler.state === State.END) {
           // Handle edge case, where discrete gestures end immediately after activation thus
           // their state is set to END and when the gesture they are waiting for activates they
           // should be cancelled, however `cancel` was never sent as gestures were already in the END state.
@@ -182,14 +182,14 @@ export default class GestureHandlerOrchestrator {
           otherHandler.sendEvent(State.CANCELLED, State.BEGAN);
         }
 
-        otherHandler.setAwaiting(false);
+        otherHandler.awaiting = false;
       }
     }
 
     if (newState === State.ACTIVE) {
       this.tryActivate(handler);
     } else if (oldState === State.ACTIVE || oldState === State.END) {
-      if (handler.isActive()) {
+      if (handler.active) {
         handler.sendEvent(newState, oldState);
       } else if (
         oldState === State.ACTIVE &&
@@ -214,11 +214,11 @@ export default class GestureHandlerOrchestrator {
   }
 
   private makeActive(handler: IGestureHandler): void {
-    const currentState = handler.getState();
+    const currentState = handler.state;
 
-    handler.setActive(true);
-    handler.setShouldResetProgress(true);
-    handler.setActivationIndex(this.activationIndex++);
+    handler.active = true;
+    handler.shouldResetProgress = true;
+    handler.activationIndex = this.activationIndex++;
 
     for (let i = this.gestureHandlers.length - 1; i >= 0; --i) {
       if (this.shouldHandlerBeCancelledBy(this.gestureHandlers[i], handler)) {
@@ -228,7 +228,7 @@ export default class GestureHandlerOrchestrator {
 
     for (const otherHandler of this.awaitingHandlers) {
       if (this.shouldHandlerBeCancelledBy(otherHandler, handler)) {
-        otherHandler.setAwaiting(false);
+        otherHandler.awaiting = false;
       }
     }
 
@@ -241,11 +241,11 @@ export default class GestureHandlerOrchestrator {
       }
     }
 
-    if (!handler.isAwaiting()) {
+    if (!handler.awaiting) {
       return;
     }
 
-    handler.setAwaiting(false);
+    handler.awaiting = false;
 
     this.awaitingHandlers = this.awaitingHandlers.filter(
       (otherHandler) => otherHandler !== handler
@@ -258,10 +258,10 @@ export default class GestureHandlerOrchestrator {
     }
 
     this.awaitingHandlers.push(handler);
-    this.awaitingHandlersTags.add(handler.getTag());
+    this.awaitingHandlersTags.add(handler.handlerTag);
 
-    handler.setAwaiting(true);
-    handler.setActivationIndex(this.activationIndex++);
+    handler.awaiting = true;
+    handler.activationIndex = this.activationIndex++;
   }
 
   public recordHandlerIfNotPresent(handler: IGestureHandler): void {
@@ -271,9 +271,9 @@ export default class GestureHandlerOrchestrator {
 
     this.gestureHandlers.push(handler);
 
-    handler.setActive(false);
-    handler.setAwaiting(false);
-    handler.setActivationIndex(Number.MAX_SAFE_INTEGER);
+    handler.active = false;
+    handler.awaiting = false;
+    handler.activationIndex = Number.MAX_SAFE_INTEGER;
   }
 
   private shouldHandlerWaitForOther(
@@ -306,7 +306,7 @@ export default class GestureHandlerOrchestrator {
       return false;
     }
 
-    if (handler.isAwaiting() || handler.getState() === State.ACTIVE) {
+    if (handler.awaiting || handler.state === State.ACTIVE) {
       // For now it always returns false
       return handler.shouldBeCancelledByOther(otherHandler);
     }
@@ -316,7 +316,7 @@ export default class GestureHandlerOrchestrator {
 
     if (
       !PointerTracker.shareCommonPointers(handlerPointers, otherPointers) &&
-      handler.getDelegate().getView() !== otherHandler.getDelegate().getView()
+      handler.delegate.view !== otherHandler.delegate.view
     ) {
       return this.checkOverlap(handler, otherHandler);
     }
@@ -335,11 +335,11 @@ export default class GestureHandlerOrchestrator {
     // TODO: Find better way to handle that issue, for example by activation order and handler cancelling
 
     const isPointerWithinBothBounds = (pointer: number) => {
-      const point = handler.getTracker().getLastAbsoluteCoords(pointer);
+      const point = handler.tracker.getLastAbsoluteCoords(pointer);
 
       return (
-        handler.getDelegate().isPointerInBounds(point) &&
-        otherHandler.getDelegate().isPointerInBounds(point)
+        handler.delegate.isPointerInBounds(point) &&
+        otherHandler.delegate.isPointerInBounds(point)
       );
     };
 
@@ -361,8 +361,8 @@ export default class GestureHandlerOrchestrator {
   public cancelMouseAndPenGestures(currentHandler: IGestureHandler): void {
     this.gestureHandlers.forEach((handler: IGestureHandler) => {
       if (
-        handler.getPointerType() !== PointerType.MOUSE &&
-        handler.getPointerType() !== PointerType.STYLUS
+        handler.pointerType !== PointerType.MOUSE &&
+        handler.pointerType !== PointerType.STYLUS
       ) {
         return;
       }
@@ -377,16 +377,16 @@ export default class GestureHandlerOrchestrator {
         //
         // However, handler will receive manually created onPointerEnter that is triggered in EventManager in onPointerMove method.
         // There may be possibility to use that fact to make handler respond properly to first mouse click
-        handler.getTracker().resetTracker();
+        handler.tracker.resetTracker();
       }
     });
   }
 
-  public static getInstance(): GestureHandlerOrchestrator {
-    if (!GestureHandlerOrchestrator.instance) {
-      GestureHandlerOrchestrator.instance = new GestureHandlerOrchestrator();
+  public static get instance(): GestureHandlerOrchestrator {
+    if (!GestureHandlerOrchestrator._instance) {
+      GestureHandlerOrchestrator._instance = new GestureHandlerOrchestrator();
     }
 
-    return GestureHandlerOrchestrator.instance;
+    return GestureHandlerOrchestrator._instance;
   }
 }

package/src/web/tools/GestureHandlerWebDelegate.ts

@@ -22,7 +22,8 @@ export class GestureHandlerWebDelegate
   implements GestureHandlerDelegate<HTMLElement, IGestureHandler>
 {
   private isInitialized = false;
-  private view!: HTMLElement;
+  private _view!: HTMLElement;
+
   private gestureHandler!: IGestureHandler;
   private eventManagers: EventManager<unknown>[] = [];
   private defaultViewStyles: DefaultViewStyles = {
@@ -30,14 +31,10 @@ export class GestureHandlerWebDelegate
     touchAction: '',
   };
 
-  getView(): HTMLElement {
-    return this.view;
-  }
-
   init(viewRef: number, handler: IGestureHandler): void {
     if (!viewRef) {
       throw new Error(
-        `Cannot find HTML Element for handler ${handler.getTag()}`
+        `Cannot find HTML Element for handler ${handler.handlerTag}`
       );
     }
 
@@ -51,7 +48,7 @@ export class GestureHandlerWebDelegate
       touchAction: this.view.style.touchAction,
     };
 
-    const config = handler.getConfig();
+    const config = handler.config;
 
     this.setUserSelect(config.enabled);
     this.setTouchAction(config.enabled);
@@ -88,12 +85,12 @@ export class GestureHandlerWebDelegate
   }
 
   tryResetCursor() {
-    const config = this.gestureHandler.getConfig();
+    const config = this.gestureHandler.config;
 
     if (
       config.activeCursor &&
       config.activeCursor !== 'auto' &&
-      this.gestureHandler.getState() === State.ACTIVE
+      this.gestureHandler.state === State.ACTIVE
     ) {
       this.view.style.cursor = 'auto';
     }
@@ -132,7 +129,7 @@ export class GestureHandlerWebDelegate
   }
 
   private setUserSelect(isHandlerEnabled: boolean) {
-    const { userSelect } = this.gestureHandler.getConfig();
+    const { userSelect } = this.gestureHandler.config;
 
     this.view.style['userSelect'] = isHandlerEnabled
       ? (userSelect ?? 'none')
@@ -144,7 +141,7 @@ export class GestureHandlerWebDelegate
   }
 
   private setTouchAction(isHandlerEnabled: boolean) {
-    const { touchAction } = this.gestureHandler.getConfig();
+    const { touchAction } = this.gestureHandler.config;
 
     this.view.style['touchAction'] = isHandlerEnabled
       ? (touchAction ?? 'none')
@@ -157,7 +154,7 @@ export class GestureHandlerWebDelegate
   }
 
   private setContextMenu(isHandlerEnabled: boolean) {
-    const config = this.gestureHandler.getConfig();
+    const config = this.gestureHandler.config;
 
     if (isHandlerEnabled) {
       this.addContextMenuListeners(config);
@@ -174,6 +171,21 @@ export class GestureHandlerWebDelegate
     this.setUserSelect(enabled);
     this.setTouchAction(enabled);
     this.setContextMenu(enabled);
+
+    if (enabled) {
+      this.eventManagers.forEach((manager) => {
+        // It may look like managers will be registered twice when handler is mounted for the first time.
+        // However, `init` method is called AFTER `updateGestureConfig` - it means that delegate has not
+        // been initialized yet, so this code won't be executed.
+        //
+        // Also, because we use defined functions, not lambdas, they will not be registered multiple times.
+        manager.registerListeners();
+      });
+    } else {
+      this.eventManagers.forEach((manager) => {
+        manager.unregisterListeners();
+      });
+    }
   }
 
   onBegin(): void {
@@ -181,7 +193,7 @@ export class GestureHandlerWebDelegate
   }
 
   onActivate(): void {
-    const config = this.gestureHandler.getConfig();
+    const config = this.gestureHandler.config;
 
     if (
       (!this.view.style.cursor || this.view.style.cursor === 'auto') &&
@@ -210,4 +222,11 @@ export class GestureHandlerWebDelegate
       manager.unregisterListeners();
     });
   }
+
+  public get view() {
+    return this._view;
+  }
+  public set view(value: HTMLElement) {
+    this._view = value;
+  }
 }

package/src/web/tools/InteractionManager.ts

@@ -3,7 +3,7 @@ import { State } from '../../State';
 import { Config, Handler } from '../interfaces';
 
 export default class InteractionManager {
-  private static instance: InteractionManager;
+  private static _instance: InteractionManager;
   private readonly waitForRelations: Map<number, number[]> = new Map();
   private readonly simultaneousRelations: Map<number, number[]> = new Map();
   private readonly blocksHandlersRelations: Map<number, number[]> = new Map();
@@ -13,7 +13,7 @@ export default class InteractionManager {
   private constructor() {}
 
   public configureInteractions(handler: IGestureHandler, config: Config) {
-    this.dropRelationsForHandlerWithTag(handler.getTag());
+    this.dropRelationsForHandlerWithTag(handler.handlerTag);
 
     if (config.waitFor) {
       const waitFor: number[] = [];
@@ -27,7 +27,7 @@ export default class InteractionManager {
         }
       });
 
-      this.waitForRelations.set(handler.getTag(), waitFor);
+      this.waitForRelations.set(handler.handlerTag, waitFor);
     }
 
     if (config.simultaneousHandlers) {
@@ -40,7 +40,7 @@ export default class InteractionManager {
         }
       });
 
-      this.simultaneousRelations.set(handler.getTag(), simultaneousHandlers);
+      this.simultaneousRelations.set(handler.handlerTag, simultaneousHandlers);
     }
 
     if (config.blocksHandlers) {
@@ -53,7 +53,7 @@ export default class InteractionManager {
         }
       });
 
-      this.blocksHandlersRelations.set(handler.getTag(), blocksHandlers);
+      this.blocksHandlersRelations.set(handler.handlerTag, blocksHandlers);
     }
   }
 
@@ -62,12 +62,12 @@ export default class InteractionManager {
     otherHandler: IGestureHandler
   ): boolean {
     const waitFor: number[] | undefined = this.waitForRelations.get(
-      handler.getTag()
+      handler.handlerTag
     );
 
     return (
       waitFor?.find((tag: number) => {
-        return tag === otherHandler.getTag();
+        return tag === otherHandler.handlerTag;
       }) !== undefined
     );
   }
@@ -77,11 +77,11 @@ export default class InteractionManager {
     otherHandler: IGestureHandler
   ): boolean {
     const simultaneousHandlers: number[] | undefined =
-      this.simultaneousRelations.get(handler.getTag());
+      this.simultaneousRelations.get(handler.handlerTag);
 
     return (
       simultaneousHandlers?.find((tag: number) => {
-        return tag === otherHandler.getTag();
+        return tag === otherHandler.handlerTag;
       }) !== undefined
     );
   }
@@ -91,12 +91,12 @@ export default class InteractionManager {
     otherHandler: IGestureHandler
   ): boolean {
     const waitFor: number[] | undefined = this.blocksHandlersRelations.get(
-      handler.getTag()
+      handler.handlerTag
     );
 
     return (
       waitFor?.find((tag: number) => {
-        return tag === otherHandler.getTag();
+        return tag === otherHandler.handlerTag;
       }) !== undefined
     );
   }
@@ -108,7 +108,7 @@ export default class InteractionManager {
     // We check constructor name instead of using `instanceof` in order do avoid circular dependencies
     const isNativeHandler =
       otherHandler.constructor.name === 'NativeViewGestureHandler';
-    const isActive = otherHandler.getState() === State.ACTIVE;
+    const isActive = otherHandler.state === State.ACTIVE;
     const isButton = otherHandler.isButton?.() === true;
 
     return isNativeHandler && isActive && !isButton;
@@ -126,11 +126,11 @@ export default class InteractionManager {
     this.blocksHandlersRelations.clear();
   }
 
-  public static getInstance(): InteractionManager {
-    if (!this.instance) {
-      this.instance = new InteractionManager();
+  public static get instance(): InteractionManager {
+    if (!this._instance) {
+      this._instance = new InteractionManager();
     }
 
-    return this.instance;
+    return this._instance;
   }
 }

package/src/web/tools/NodeManager.ts

@@ -28,7 +28,7 @@ export default abstract class NodeManager {
     }
 
     this.gestures[handlerTag] = handler;
-    this.gestures[handlerTag].setTag(handlerTag);
+    this.gestures[handlerTag].handlerTag = handlerTag;
   }
 
   public static dropGestureHandler(handlerTag: number): void {
@@ -42,7 +42,7 @@ export default abstract class NodeManager {
     delete this.gestures[handlerTag];
   }
 
-  public static getNodes() {
+  public static get nodes() {
     return { ...this.gestures };
   }
 }

package/src/web/tools/PointerTracker.ts

@@ -13,7 +13,7 @@ const MAX_POINTERS = 20;
 
 export default class PointerTracker {
   private velocityTracker = new VelocityTracker();
-  private trackedPointers: Map<number, TrackerElement> = new Map<
+  private readonly _trackedPointers: Map<number, TrackerElement> = new Map<
     number,
     TrackerElement
   >();
@@ -72,7 +72,7 @@ export default class PointerTracker {
     this.lastMovedPointerId = event.pointerId;
 
     this.velocityTracker.add(event);
-    const [velocityX, velocityY] = this.velocityTracker.getVelocity();
+    const [velocityX, velocityY] = this.velocityTracker.velocity;
 
     element.velocityX = velocityX;
     element.velocityY = velocityY;
@@ -189,24 +189,6 @@ export default class PointerTracker {
     return sum;
   }
 
-  public getTrackedPointersCount(): number {
-    return this.trackedPointers.size;
-  }
-
-  public getTrackedPointersID(): number[] {
-    const keys: number[] = [];
-
-    this.trackedPointers.forEach((_value, key) => {
-      keys.push(key);
-    });
-
-    return keys;
-  }
-
-  public getData(): Map<number, TrackerElement> {
-    return this.trackedPointers;
-  }
-
   public resetTracker(): void {
     this.velocityTracker.reset();
     this.trackedPointers.clear();
@@ -223,4 +205,22 @@ export default class PointerTracker {
   ): boolean {
     return stPointers.some((pointerId) => ndPointers.includes(pointerId));
   }
+
+  public get trackedPointersCount(): number {
+    return this.trackedPointers.size;
+  }
+
+  public get trackedPointersIDs() {
+    const keys: number[] = [];
+
+    this.trackedPointers.forEach((_value, key) => {
+      keys.push(key);
+    });
+
+    return keys;
+  }
+
+  public get trackedPointers() {
+    return this._trackedPointers;
+  }
 }

package/src/web/tools/Vector.ts

@@ -30,7 +30,7 @@ export default class Vector {
     return new Vector(velocity.x, velocity.y);
   }
 
-  get magnitude() {
+  public get magnitude() {
     return this._magnitude;
   }
 

package/src/web/tools/VelocityTracker.ts

@@ -84,7 +84,7 @@ export default class VelocityTracker {
     return null;
   }
 
-  public getVelocity(): [number, number] {
+  public get velocity(): [number, number] {
     const estimate = this.getVelocityEstimate();
     if (estimate !== null) {
       return estimate;