react-native-gesture-handler 2.16.0 → 2.16.1

package/src/components/{GestureHandlerRootView.web.tsx → GestureHandlerRootView.native.tsx}

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { PropsWithChildren } from 'react';
 import { View, ViewProps, StyleSheet } from 'react-native';
+import { maybeInitializeFabric } from '../init';
 import GestureHandlerRootViewContext from '../GestureHandlerRootViewContext';
 
 export interface GestureHandlerRootViewProps
@@ -10,6 +11,11 @@ export default function GestureHandlerRootView({
   style,
   ...rest
 }: GestureHandlerRootViewProps) {
+  // try initialize fabric on the first render, at this point we can
+  // reliably check if fabric is enabled (the function contains a flag
+  // to make sure it's called only once)
+  maybeInitializeFabric();
+
   return (
     <GestureHandlerRootViewContext.Provider value>
       <View style={style ?? styles.container} {...rest} />

package/src/components/GestureHandlerRootView.tsx

@@ -1,7 +1,6 @@
 import * as React from 'react';
 import { PropsWithChildren } from 'react';
 import { View, ViewProps, StyleSheet } from 'react-native';
-import { maybeInitializeFabric } from '../init';
 import GestureHandlerRootViewContext from '../GestureHandlerRootViewContext';
 
 export interface GestureHandlerRootViewProps
@@ -11,11 +10,6 @@ export default function GestureHandlerRootView({
   style,
   ...rest
 }: GestureHandlerRootViewProps) {
-  // try initialize fabric on the first render, at this point we can
-  // reliably check if fabric is enabled (the function contains a flag
-  // to make sure it's called only once)
-  maybeInitializeFabric();
-
   return (
     <GestureHandlerRootViewContext.Provider value>
       <View style={style ?? styles.container} {...rest} />

package/src/getReactNativeVersion.native.ts

@@ -0,0 +1,11 @@
+import pack from 'react-native/package.json';
+
+const [majorStr, minorStr] = pack.version.split('.');
+const REACT_NATIVE_VERSION = {
+  major: parseInt(majorStr, 10),
+  minor: parseInt(minorStr, 10),
+};
+
+export function getReactNativeVersion() {
+  return REACT_NATIVE_VERSION;
+}

package/src/getReactNativeVersion.ts

@@ -1,11 +1,3 @@
-import pack from 'react-native/package.json';
-
-const [majorStr, minorStr] = pack.version.split('.');
-const REACT_NATIVE_VERSION = {
-  major: parseInt(majorStr, 10),
-  minor: parseInt(minorStr, 10),
-};
-
 export function getReactNativeVersion() {
-  return REACT_NATIVE_VERSION;
+  throw new Error('getReactNativeVersion is not supported on web');
 }

package/src/getShadowNodeFromRef.native.ts

@@ -0,0 +1,44 @@
+// Used by GestureDetector (unsupported on web at the moment) to check whether the
+// attached view may get flattened on Fabric. This implementation causes errors
+// on web due to the static resolution of `require` statements by webpack breaking
+// the conditional importing. Solved by making .web file.
+let findHostInstance_DEPRECATED: (ref: unknown) => void;
+let getInternalInstanceHandleFromPublicInstance: (ref: unknown) => {
+  stateNode: { node: unknown };
+};
+
+export function getShadowNodeFromRef(ref: unknown) {
+  // load findHostInstance_DEPRECATED lazily because it may not be available before render
+  if (findHostInstance_DEPRECATED === undefined) {
+    try {
+      // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+      findHostInstance_DEPRECATED =
+        // eslint-disable-next-line @typescript-eslint/no-var-requires, @typescript-eslint/no-unsafe-member-access
+        require('react-native/Libraries/Renderer/shims/ReactFabric').findHostInstance_DEPRECATED;
+    } catch (e) {
+      findHostInstance_DEPRECATED = (_ref: unknown) => null;
+    }
+  }
+
+  // load findHostInstance_DEPRECATED lazily because it may not be available before render
+  if (getInternalInstanceHandleFromPublicInstance === undefined) {
+    try {
+      // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+      getInternalInstanceHandleFromPublicInstance =
+        // eslint-disable-next-line @typescript-eslint/no-var-requires, @typescript-eslint/no-unsafe-member-access
+        require('react-native/Libraries/ReactNative/ReactFabricPublicInstance/ReactFabricPublicInstance')
+          .getInternalInstanceHandleFromPublicInstance ??
+        // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-return
+        ((ref: any) => ref._internalInstanceHandle);
+    } catch (e) {
+      getInternalInstanceHandleFromPublicInstance = (ref: any) =>
+        // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-return
+        ref._internalInstanceHandle;
+    }
+  }
+
+  // @ts-ignore Fabric
+  return getInternalInstanceHandleFromPublicInstance(
+    findHostInstance_DEPRECATED(ref)
+  ).stateNode.node;
+}

package/src/getShadowNodeFromRef.ts

@@ -1,44 +1,7 @@
 // Used by GestureDetector (unsupported on web at the moment) to check whether the
-// attached view may get flattened on Fabric. This implementation causes errors
+// attached view may get flattened on Fabric. Original implementation causes errors
 // on web due to the static resolution of `require` statements by webpack breaking
-// the conditional importing. Solved by making .web file.
-let findHostInstance_DEPRECATED: (ref: unknown) => void;
-let getInternalInstanceHandleFromPublicInstance: (ref: unknown) => {
-  stateNode: { node: unknown };
-};
-
-export function getShadowNodeFromRef(ref: unknown) {
-  // load findHostInstance_DEPRECATED lazily because it may not be available before render
-  if (findHostInstance_DEPRECATED === undefined) {
-    try {
-      // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
-      findHostInstance_DEPRECATED =
-        // eslint-disable-next-line @typescript-eslint/no-var-requires, @typescript-eslint/no-unsafe-member-access
-        require('react-native/Libraries/Renderer/shims/ReactFabric').findHostInstance_DEPRECATED;
-    } catch (e) {
-      findHostInstance_DEPRECATED = (_ref: unknown) => null;
-    }
-  }
-
-  // load findHostInstance_DEPRECATED lazily because it may not be available before render
-  if (getInternalInstanceHandleFromPublicInstance === undefined) {
-    try {
-      // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
-      getInternalInstanceHandleFromPublicInstance =
-        // eslint-disable-next-line @typescript-eslint/no-var-requires, @typescript-eslint/no-unsafe-member-access
-        require('react-native/Libraries/ReactNative/ReactFabricPublicInstance/ReactFabricPublicInstance')
-          .getInternalInstanceHandleFromPublicInstance ??
-        // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-return
-        ((ref: any) => ref._internalInstanceHandle);
-    } catch (e) {
-      getInternalInstanceHandleFromPublicInstance = (ref: any) =>
-        // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-return
-        ref._internalInstanceHandle;
-    }
-  }
-
-  // @ts-ignore Fabric
-  return getInternalInstanceHandleFromPublicInstance(
-    findHostInstance_DEPRECATED(ref)
-  ).stateNode.node;
+// the conditional importing.
+export function getShadowNodeFromRef(_ref: any) {
+  return null;
 }

package/src/handlers/PanGestureHandler.ts

@@ -150,7 +150,9 @@ export interface PanGestureHandlerProps
    * to 0. If only one number `p` is given a range of `(-inf, p)` will be used
    * if `p` is higher or equal to 0 and `(-p, inf)` otherwise.
    */
-  activeOffsetY?: number | number[];
+  activeOffsetY?:
+    | number
+    | [activeOffsetYStart: number, activeOffsetYEnd: number];
 
   /**
    * Range along X axis (in points) where fingers travels without activation of
@@ -160,7 +162,9 @@ export interface PanGestureHandlerProps
    * to 0. If only one number `p` is given a range of `(-inf, p)` will be used
    * if `p` is higher or equal to 0 and `(-p, inf)` otherwise.
    */
-  activeOffsetX?: number | number[];
+  activeOffsetX?:
+    | number
+    | [activeOffsetXStart: number, activeOffsetXEnd: number];
 
   /**
    * When the finger moves outside this range (in points) along Y axis and
@@ -170,7 +174,7 @@ export interface PanGestureHandlerProps
    * to 0. If only one number `p` is given a range of `(-inf, p)` will be used
    * if `p` is higher or equal to 0 and `(-p, inf)` otherwise.
    */
-  failOffsetY?: number | number[];
+  failOffsetY?: number | [failOffsetYStart: number, failOffsetYEnd: number];
 
   /**
    * When the finger moves outside this range (in points) along X axis and
@@ -180,7 +184,7 @@ export interface PanGestureHandlerProps
    * to 0. If only one number `p` is given a range of `(-inf, p)` will be used
    * if `p` is higher or equal to 0 and `(-p, inf)` otherwise.
    */
-  failOffsetX?: number | number[];
+  failOffsetX?: number | [failOffsetXStart: number, failOffsetXEnd: number];
 }
 
 export const panHandlerName = 'PanGestureHandler';

package/src/handlers/PressabilityDebugView.native.tsx

@@ -0,0 +1,2 @@
+// @ts-ignore it's not exported so we need to import it from path
+export { PressabilityDebugView } from 'react-native/Libraries/Pressability/PressabilityDebug';

package/src/handlers/PressabilityDebugView.tsx

@@ -1,2 +1,4 @@
-// @ts-ignore it's not exported so we need to import it from path
-export { PressabilityDebugView } from 'react-native/Libraries/Pressability/PressabilityDebug';
+// PressabilityDebugView is not implemented in react-native-web
+export function PressabilityDebugView() {
+  return null;
+}

package/src/handlers/createHandler.tsx

@@ -341,18 +341,22 @@ export default function createHandler<
         });
 
         const actionType = (() => {
-          if (
-            (this.props?.onGestureEvent &&
-              'current' in this.props.onGestureEvent) ||
-            (this.props?.onHandlerStateChange &&
-              'current' in this.props.onHandlerStateChange)
-          ) {
+          const onGestureEvent = this.props?.onGestureEvent;
+          const isGestureHandlerWorklet =
+            onGestureEvent &&
+            ('current' in onGestureEvent ||
+              'workletEventHandler' in onGestureEvent);
+          const onHandlerStateChange = this.props?.onHandlerStateChange;
+          const isStateChangeHandlerWorklet =
+            onHandlerStateChange &&
+            ('current' in onHandlerStateChange ||
+              'workletEventHandler' in onHandlerStateChange);
+          const isReanimatedHandler =
+            isGestureHandlerWorklet || isStateChangeHandlerWorklet;
+          if (isReanimatedHandler) {
             // Reanimated worklet
             return ActionType.REANIMATED_WORKLET;
-          } else if (
-            this.props?.onGestureEvent &&
-            '__isNative' in this.props.onGestureEvent
-          ) {
+          } else if (onGestureEvent && '__isNative' in onGestureEvent) {
             // Animated.event with useNativeDriver: true
             return ActionType.NATIVE_ANIMATED_EVENT;
           } else {

package/src/handlers/customDirectEventTypes.native.ts

@@ -0,0 +1,2 @@
+// @ts-ignore - its taken straight from RN
+export { customDirectEventTypes } from 'react-native/Libraries/Renderer/shims/ReactNativeViewConfigRegistry';

package/src/handlers/customDirectEventTypes.ts

@@ -1,2 +1,5 @@
-// @ts-ignore - its taken straight from RN
-export { customDirectEventTypes } from 'react-native/Libraries/Renderer/shims/ReactNativeViewConfigRegistry';
+// customDirectEventTypes doesn't exist in react-native-web, therefore importing it
+// directly in createHandler.tsx would end in crash.
+const customDirectEventTypes = {};
+
+export { customDirectEventTypes };

package/src/handlers/gestures/GestureDetector.tsx

@@ -42,7 +42,6 @@ import { isFabric, isJestEnv, tagMessage } from '../../utils';
 import { getReactNativeVersion } from '../../getReactNativeVersion';
 import { getShadowNodeFromRef } from '../../getShadowNodeFromRef';
 import { Platform } from 'react-native';
-import type RNGestureHandlerModuleWeb from '../../RNGestureHandlerModule.web';
 import { onGestureHandlerEvent } from './eventReceiver';
 import { RNRenderer } from '../../RNRenderer';
 import { isNewWebImplementationEnabled } from '../../EnableNewWebImplementation';
@@ -50,6 +49,14 @@ import { nativeViewGestureHandlerProps } from '../NativeViewGestureHandler';
 import GestureHandlerRootViewContext from '../../GestureHandlerRootViewContext';
 import { ghQueueMicrotask } from '../../ghQueueMicrotask';
 
+type AttachGestureHandlerWeb = (
+  handlerTag: number,
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  newView: any,
+  _actionType: ActionType,
+  propsRef: React.RefObject<unknown>
+) => void;
+
 declare const global: {
   isFormsStackingContext: (node: unknown) => boolean | null; // JSI function
 };
@@ -220,9 +227,7 @@ function attachHandlers({
       : ActionType.JS_FUNCTION_NEW_API;
 
     if (Platform.OS === 'web') {
-      (
-        RNGestureHandlerModule.attachGestureHandler as typeof RNGestureHandlerModuleWeb.attachGestureHandler
-      )(
+      (RNGestureHandlerModule.attachGestureHandler as AttachGestureHandlerWeb)(
         gesture.handlerTag,
         viewTag,
         ActionType.JS_FUNCTION_OLD_API, // ignored on web
@@ -625,10 +630,32 @@ const applyTouchActionProp = (
 };
 
 interface GestureDetectorProps {
+  /**
+   * A gesture object containing the configuration and callbacks.
+   * Can be any of:
+   * - base gestures (`Tap`, `Pan`, ...)
+   * - `ComposedGesture` (`Race`, `Simultaneous`, `Exclusive`)
+   */
   gesture: ComposedGesture | GestureType;
   children?: React.ReactNode;
+
+  /**
+   * #### Web only
+   * This parameter allows to specify which `userSelect` property should be applied to underlying view.
+   * Possible values are `"none" | "auto" | "text"`. Default value is set to `"none"`.
+   */
   userSelect?: UserSelect;
+  /**
+   * #### Web only
+   * Specifies whether context menu should be enabled after clicking on underlying view with right mouse button.
+   * Default value is set to `false`.
+   */
   enableContextMenu?: boolean;
+  /**
+   * #### Web only
+   * This parameter allows to specify which `touchAction` property should be applied to underlying view.
+   * Supports all CSS touch-action values (e.g. `"none"`, `"pan-y"`). Default value is set to `"none"`.
+   */
   touchAction?: TouchAction;
 }
 interface GestureDetectorState {
@@ -637,6 +664,22 @@ interface GestureDetectorState {
   previousViewTag: number;
   forceReattach: boolean;
 }
+
+/**
+ * `GestureDetector` is responsible for creating and updating native gesture handlers based on the config of provided gesture.
+ *
+ * ### Props
+ * - `gesture`
+ * - `userSelect` (**Web only**)
+ * - `enableContextMenu` (**Web only**)
+ * - `touchAction` (**Web only**)
+ *
+ * ### Remarks
+ * - Gesture Detector will use first native view in its subtree to recognize gestures, however if this view is used only to group its children it may get automatically collapsed.
+ * - Using the same instance of a gesture across multiple Gesture Detectors is not possible.
+ *
+ * @see https://docs.swmansion.com/react-native-gesture-handler/docs/gestures/gesture-detector
+ */
 export const GestureDetector = (props: GestureDetectorProps) => {
   const rootViewContext = useContext(GestureHandlerRootViewContext);
   if (__DEV__ && !rootViewContext && !isJestEnv() && Platform.OS !== 'web') {

package/src/handlers/gestures/flingGesture.ts

@@ -13,11 +13,22 @@ export class FlingGesture extends BaseGesture<FlingGestureHandlerEventPayload> {
     this.handlerName = 'FlingGestureHandler';
   }
 
+  /**
+   * Determine exact number of points required to handle the fling gesture.
+   * @param pointers
+   */
   numberOfPointers(pointers: number) {
     this.config.numberOfPointers = pointers;
     return this;
   }
 
+  /**
+   * Expressed allowed direction of movement.
+   * Expected values are exported as constants in the Directions object.
+   * Arguments can be combined using `|` operator. Default value is set to `MouseButton.LEFT`.
+   * @param direction
+   * @see https://docs.swmansion.com/react-native-gesture-handler/docs/gestures/fling-gesture/#directionvalue-directions
+   */
   direction(direction: number) {
     this.config.direction = direction;
     return this;

package/src/handlers/gestures/forceTouchGesture.ts

@@ -40,16 +40,30 @@ export class ForceTouchGesture extends ContinousBaseGesture<
     this.handlerName = 'ForceTouchGestureHandler';
   }
 
+  /**
+   * A minimal pressure that is required before gesture can activate.
+   * Should be a value from range [0.0, 1.0]. Default is 0.2.
+   * @param force
+   */
   minForce(force: number) {
     this.config.minForce = force;
     return this;
   }
 
+  /**
+   * A maximal pressure that could be applied for gesture.
+   * If the pressure is greater, gesture fails. Should be a value from range [0.0, 1.0].
+   * @param force
+   */
   maxForce(force: number) {
     this.config.maxForce = force;
     return this;
   }
 
+  /**
+   * Value defining if haptic feedback has to be performed on activation.
+   * @param value
+   */
   feedbackOnActivation(value: boolean) {
     this.config.feedbackOnActivation = value;
     return this;

package/src/handlers/gestures/gesture.ts

@@ -155,6 +155,10 @@ export abstract class BaseGesture<
       : [gesture];
   }
 
+  /**
+   * Sets a `ref` to the gesture object, allowing for interoperability with the old API.
+   * @param ref
+   */
   withRef(ref: React.MutableRefObject<GestureType | undefined>) {
     this.config.ref = ref;
     return this;
@@ -166,18 +170,32 @@ export abstract class BaseGesture<
     return callback.__workletHash !== undefined;
   }
 
+  /**
+   * Set the callback that is being called when given gesture handler starts receiving touches.
+   * At the moment of this callback the handler is in `BEGAN` state and we don't know yet if it will recognize the gesture at all.
+   * @param callback
+   */
   onBegin(callback: (event: GestureStateChangeEvent<EventPayloadT>) => void) {
     this.handlers.onBegin = callback;
     this.handlers.isWorklet[CALLBACK_TYPE.BEGAN] = this.isWorklet(callback);
     return this;
   }
 
+  /**
+   * Set the callback that is being called when the gesture is recognized by the handler and it transitions to the `ACTIVE` state.
+   * @param callback
+   */
   onStart(callback: (event: GestureStateChangeEvent<EventPayloadT>) => void) {
     this.handlers.onStart = callback;
     this.handlers.isWorklet[CALLBACK_TYPE.START] = this.isWorklet(callback);
     return this;
   }
 
+  /**
+   * Set the callback that is being called when the gesture that was recognized by the handler finishes and handler reaches `END` state.
+   * It will be called only if the handler was previously in the `ACTIVE` state.
+   * @param callback
+   */
   onEnd(
     callback: (
       event: GestureStateChangeEvent<EventPayloadT>,
@@ -190,6 +208,10 @@ export abstract class BaseGesture<
     return this;
   }
 
+  /**
+   * Set the callback that is being called when the handler finalizes handling gesture - the gesture was recognized and has finished or it failed to recognize.
+   * @param callback
+   */
   onFinalize(
     callback: (
       event: GestureStateChangeEvent<EventPayloadT>,
@@ -202,6 +224,10 @@ export abstract class BaseGesture<
     return this;
   }
 
+  /**
+   * Set the `onTouchesDown` callback which is called every time a pointer is placed on the screen.
+   * @param callback
+   */
   onTouchesDown(callback: TouchEventHandlerType) {
     this.config.needsPointerData = true;
     this.handlers.onTouchesDown = callback;
@@ -211,6 +237,10 @@ export abstract class BaseGesture<
     return this;
   }
 
+  /**
+   * Set the `onTouchesMove` callback which is called every time a pointer is moved on the screen.
+   * @param callback
+   */
   onTouchesMove(callback: TouchEventHandlerType) {
     this.config.needsPointerData = true;
     this.handlers.onTouchesMove = callback;
@@ -220,6 +250,10 @@ export abstract class BaseGesture<
     return this;
   }
 
+  /**
+   * Set the `onTouchesUp` callback which is called every time a pointer is lifted from the screen.
+   * @param callback
+   */
   onTouchesUp(callback: TouchEventHandlerType) {
     this.config.needsPointerData = true;
     this.handlers.onTouchesUp = callback;
@@ -229,6 +263,10 @@ export abstract class BaseGesture<
     return this;
   }
 
+  /**
+   * Set the `onTouchesCancelled` callback which is called every time a pointer stops being tracked, for example when the gesture finishes.
+   * @param callback
+   */
   onTouchesCancelled(callback: TouchEventHandlerType) {
     this.config.needsPointerData = true;
     this.handlers.onTouchesCancelled = callback;
@@ -238,36 +276,77 @@ export abstract class BaseGesture<
     return this;
   }
 
+  /**
+   * Indicates whether the given handler should be analyzing stream of touch events or not.
+   * @param enabled
+   * @see https://docs.swmansion.com/react-native-gesture-handler/docs/gestures/pan-gesture#enabledvalue-boolean
+   */
   enabled(enabled: boolean) {
     this.config.enabled = enabled;
     return this;
   }
 
+  /**
+   * When true the handler will cancel or fail recognition (depending on its current state) whenever the finger leaves the area of the connected view.
+   * @param value
+   * @see https://docs.swmansion.com/react-native-gesture-handler/docs/gestures/pan-gesture#shouldcancelwhenoutsidevalue-boolean
+   */
   shouldCancelWhenOutside(value: boolean) {
     this.config.shouldCancelWhenOutside = value;
     return this;
   }
 
+  /**
+   * This parameter enables control over what part of the connected view area can be used to begin recognizing the gesture.
+   * When a negative number is provided the bounds of the view will reduce the area by the given number of points in each of the sides evenly.
+   * @param hitSlop
+   * @see https://docs.swmansion.com/react-native-gesture-handler/docs/gestures/pan-gesture#hitslopsettings
+   */
   hitSlop(hitSlop: HitSlop) {
     this.config.hitSlop = hitSlop;
     return this;
   }
 
+  /**
+   * #### Web only
+   * This parameter allows to specify which `cursor` should be used when gesture activates.
+   * Supports all CSS cursor values (e.g. `"grab"`, `"zoom-in"`). Default value is set to `"auto"`.
+   * @param activeCursor
+   */
   activeCursor(activeCursor: ActiveCursor) {
     this.config.activeCursor = activeCursor;
     return this;
   }
 
+  /**
+   * #### Web & Android only
+   * Allows users to choose which mouse button should handler respond to.
+   * Arguments can be combined using `|` operator, e.g. `mouseButton(MouseButton.LEFT | MouseButton.RIGHT)`.
+   * Default value is set to `MouseButton.LEFT`.
+   * @param mouseButton
+   * @see https://docs.swmansion.com/react-native-gesture-handler/docs/gestures/pan-gesture#mousebuttonvalue-mousebutton-web--android-only
+   */
   mouseButton(mouseButton: MouseButton) {
     this.config.mouseButton = mouseButton;
     return this;
   }
 
+  /**
+   * When `react-native-reanimated` is installed, the callbacks passed to the gestures are automatically workletized and run on the UI thread when called.
+   * This option allows for changing this behavior: when `true`, all the callbacks will be run on the JS thread instead of the UI thread, regardless of whether they are worklets or not.
+   * Defaults to `false`.
+   * @param runOnJS
+   */
   runOnJS(runOnJS: boolean) {
     this.config.runOnJS = runOnJS;
     return this;
   }
 
+  /**
+   * Allows gestures across different components to be recognized simultaneously.
+   * @param gestures
+   * @see https://docs.swmansion.com/react-native-gesture-handler/docs/fundamentals/gesture-composition/#simultaneouswithexternalgesture
+   */
   simultaneousWithExternalGesture(...gestures: Exclude<GestureRef, number>[]) {
     for (const gesture of gestures) {
       this.addDependency('simultaneousWith', gesture);
@@ -275,6 +354,11 @@ export abstract class BaseGesture<
     return this;
   }
 
+  /**
+   * Allows to delay activation of the handler until all handlers passed as arguments to this method fail (or don't begin at all).
+   * @param gestures
+   * @see https://docs.swmansion.com/react-native-gesture-handler/docs/fundamentals/gesture-composition/#requireexternalgesturetofail
+   */
   requireExternalGestureToFail(...gestures: Exclude<GestureRef, number>[]) {
     for (const gesture of gestures) {
       this.addDependency('requireToFail', gesture);
@@ -282,6 +366,11 @@ export abstract class BaseGesture<
     return this;
   }
 
+  /**
+   * Works similarily to `requireExternalGestureToFail` but the direction of the relation is reversed - instead of being one-to-many relation, it's many-to-one.
+   * @param gestures
+   * @see https://docs.swmansion.com/react-native-gesture-handler/docs/fundamentals/gesture-composition/#blocksexternalgesture
+   */
   blocksExternalGesture(...gestures: Exclude<GestureRef, number>[]) {
     for (const gesture of gestures) {
       this.addDependency('blocksHandlers', gesture);
@@ -289,11 +378,21 @@ export abstract class BaseGesture<
     return this;
   }
 
+  /**
+   * Sets a `testID` property for gesture object, allowing for querying for it in tests.
+   * @param id
+   */
   withTestId(id: string) {
     this.config.testId = id;
     return this;
   }
 
+  /**
+   * #### iOS only
+   * When `true`, the handler will cancel touches for native UI components (`UIButton`, `UISwitch`, etc) it's attached to when it becomes `ACTIVE`.
+   * Default value is `true`.
+   * @param value
+   */
   cancelsTouchesInView(value: boolean) {
     this.config.cancelsTouchesInView = value;
     return this;
@@ -332,12 +431,21 @@ export abstract class ContinousBaseGesture<
   EventPayloadT extends Record<string, unknown>,
   EventChangePayloadT extends Record<string, unknown>
 > extends BaseGesture<EventPayloadT> {
+  /**
+   * Set the callback that is being called every time the gesture receives an update while it's active.
+   * @param callback
+   */
   onUpdate(callback: (event: GestureUpdateEvent<EventPayloadT>) => void) {
     this.handlers.onUpdate = callback;
     this.handlers.isWorklet[CALLBACK_TYPE.UPDATE] = this.isWorklet(callback);
     return this;
   }
 
+  /**
+   * Set the callback that is being called every time the gesture receives an update while it's active.
+   * This callback will receive information about change in value in relation to the last received event.
+   * @param callback
+   */
   onChange(
     callback: (
       event: GestureUpdateEvent<EventPayloadT & EventChangePayloadT>
@@ -348,6 +456,11 @@ export abstract class ContinousBaseGesture<
     return this;
   }
 
+  /**
+   * When `true` the handler will not activate by itself even if its activation criteria are met.
+   * Instead you can manipulate its state using state manager.
+   * @param manualActivation
+   */
   manualActivation(manualActivation: boolean) {
     this.config.manualActivation = manualActivation;
     return this;