react-native-gesture-handler 1.2.1 → 1.4.1

package/Gestures.js

@@ -0,0 +1,278 @@
+import PropTypes from 'prop-types';
+import React from 'react';
+
+import createHandler from './createHandler';
+import GestureHandlerPropTypes from './GestureHandlerPropTypes';
+import PlatformConstants from './PlatformConstants';
+
+export const TapGestureHandler = createHandler(
+  'TapGestureHandler',
+  {
+    ...GestureHandlerPropTypes,
+    maxDurationMs: PropTypes.number,
+    maxDelayMs: PropTypes.number,
+    numberOfTaps: PropTypes.number,
+    maxDeltaX: PropTypes.number,
+    maxDeltaY: PropTypes.number,
+    maxDist: PropTypes.number,
+    minPointers: PropTypes.number,
+  },
+  {}
+);
+
+export const FlingGestureHandler = createHandler(
+  'FlingGestureHandler',
+  {
+    ...GestureHandlerPropTypes,
+    numberOfPointers: PropTypes.number,
+    direction: PropTypes.number,
+  },
+  {}
+);
+
+class ForceTouchFallback extends React.Component {
+  componentDidMount() {
+    console.warn(
+      'ForceTouchGestureHandler is not available on this platform. Please use ForceTouchGestureHandler.forceTouchAvailable to conditionally render other components that would provide a fallback behavior specific to your usecase'
+    );
+  }
+  render() {
+    return this.props.children;
+  }
+}
+
+export const ForceTouchGestureHandler =
+  PlatformConstants && PlatformConstants.forceTouchAvailable
+    ? createHandler(
+        'ForceTouchGestureHandler',
+        {
+          ...GestureHandlerPropTypes,
+          minForce: PropTypes.number,
+          maxForce: PropTypes.number,
+          feedbackOnActivation: PropTypes.bool,
+        },
+        {}
+      )
+    : ForceTouchFallback;
+
+ForceTouchGestureHandler.forceTouchAvailable =
+  (PlatformConstants && PlatformConstants.forceTouchAvailable) || false;
+
+export const LongPressGestureHandler = createHandler(
+  'LongPressGestureHandler',
+  {
+    ...GestureHandlerPropTypes,
+    minDurationMs: PropTypes.number,
+    maxDist: PropTypes.number,
+  },
+  {}
+);
+
+function validatePanGestureHandlerProps(props) {
+  if (props.minDeltaX && props.activeOffsetX) {
+    throw new Error(
+      `It's not supported use minDeltaX with activeOffsetXStart or activeOffsetXEnd`
+    );
+  }
+  if (props.maxDeltaX && props.failOffsetX) {
+    throw new Error(
+      `It's not supported use minDeltaX with activeOffsetXStart or activeOffsetXEnd`
+    );
+  }
+  if (props.minDeltaY && props.activeOffsetY) {
+    throw new Error(
+      `It's not supported use minDeltaX with activeOffsetYStart or activeOffsetYEnd`
+    );
+  }
+  if (props.maxDeltaY && props.failOffsetY) {
+    throw new Error(
+      `It's not supported use minDeltaX with activeOffsetYStart or activeOffsetYEnd`
+    );
+  }
+  if (
+    Array.isArray(props.activeOffsetX) &&
+    (props.activeOffsetX[0] > 0 || props.activeOffsetX[1] < 0)
+  ) {
+    throw new Error(
+      `First element of activeOffsetX should be negative, a the second one should be positive`
+    );
+  }
+
+  if (
+    Array.isArray(props.activeOffsetY) &&
+    (props.activeOffsetY[0] > 0 || props.activeOffsetY[1] < 0)
+  ) {
+    throw new Error(
+      `First element of activeOffsetY should be negative, a the second one should be positive`
+    );
+  }
+
+  if (
+    Array.isArray(props.failOffsetX) &&
+    (props.failOffsetX[0] > 0 || props.failOffsetX[1] < 0)
+  ) {
+    throw new Error(
+      `First element of failOffsetX should be negative, a the second one should be positive`
+    );
+  }
+
+  if (
+    Array.isArray(props.failOffsetY) &&
+    (props.failOffsetY[0] > 0 || props.failOffsetY[1] < 0)
+  ) {
+    throw new Error(
+      `First element of failOffsetY should be negative, a the second one should be positive`
+    );
+  }
+}
+
+function transformPanGestureHandlerProps(props) {
+  const res = { ...props };
+  if (props.minDeltaX !== undefined) {
+    delete res['minDeltaX'];
+    res.activeOffsetXStart = -props.minDeltaX;
+    res.activeOffsetXEnd = props.minDeltaX;
+  }
+  if (props.maxDeltaX !== undefined) {
+    delete res['maxDeltaX'];
+    res.failOffsetXStart = -props.maxDeltaX;
+    res.failOffsetXEnd = props.maxDeltaX;
+  }
+  if (props.minOffsetX !== undefined) {
+    delete res['minOffsetX'];
+    if (props.minOffsetX < 0) {
+      res.activeOffsetXStart = props.minOffsetX;
+    } else {
+      res.activeOffsetXEnd = props.minOffsetX;
+    }
+  }
+
+  if (props.minDeltaY !== undefined) {
+    delete res['minDeltaY'];
+    res.activeOffsetYStart = -props.minDeltaY;
+    res.activeOffsetYEnd = props.minDeltaY;
+  }
+  if (props.maxDeltaY !== undefined) {
+    delete res['maxDeltaY'];
+    res.failOffsetYStart = -props.maxDeltaY;
+    res.failOffsetYEnd = props.maxDeltaY;
+  }
+
+  if (props.minOffsetY !== undefined) {
+    delete res['minOffsetY'];
+    if (props.minOffsetY < 0) {
+      res.activeOffsetYStart = props.minOffsetY;
+    } else {
+      res.activeOffsetYEnd = props.minOffsetY;
+    }
+  }
+
+  if (props.activeOffsetX !== undefined) {
+    delete res['activeOffsetX'];
+    if (Array.isArray(props.activeOffsetX)) {
+      res.activeOffsetXStart = props.activeOffsetX[0];
+      res.activeOffsetXEnd = props.activeOffsetX[1];
+    } else if (props.activeOffsetX < 0) {
+      res.activeOffsetXStart = props.activeOffsetX;
+    } else {
+      res.activeOffsetXEnd = props.activeOffsetX;
+    }
+  }
+
+  if (props.activeOffsetY !== undefined) {
+    delete res['activeOffsetY'];
+    if (Array.isArray(props.activeOffsetY)) {
+      res.activeOffsetYStart = props.activeOffsetY[0];
+      res.activeOffsetYEnd = props.activeOffsetY[1];
+    } else if (props.activeOffsetY < 0) {
+      res.activeOffsetYStart = props.activeOffsetY;
+    } else {
+      res.activeOffsetYEnd = props.activeOffsetY;
+    }
+  }
+
+  if (props.failOffsetX !== undefined) {
+    delete res['failOffsetX'];
+    if (Array.isArray(props.failOffsetX)) {
+      res.failOffsetXStart = props.failOffsetX[0];
+      res.failOffsetXEnd = props.failOffsetX[1];
+    } else if (props.failOffsetX < 0) {
+      res.failOffsetXStart = props.failOffsetX;
+    } else {
+      res.failOffsetXEnd = props.failOffsetX;
+    }
+  }
+
+  if (props.failOffsetY !== undefined) {
+    delete res['failOffsetY'];
+    if (Array.isArray(props.failOffsetY)) {
+      res.failOffsetYStart = props.failOffsetY[0];
+      res.failOffsetYEnd = props.failOffsetY[1];
+    } else if (props.failOffsetY < 0) {
+      res.failOffsetYStart = props.failOffsetY;
+    } else {
+      res.failOffsetYEnd = props.failOffsetY;
+    }
+  }
+
+  return res;
+}
+
+function managePanProps(props) {
+  if (__DEV__) {
+    validatePanGestureHandlerProps(props);
+  }
+  return transformPanGestureHandlerProps(props);
+}
+
+export const PanGestureHandler = createHandler(
+  'PanGestureHandler',
+  {
+    ...GestureHandlerPropTypes,
+    activeOffsetY: PropTypes.oneOfType([
+      PropTypes.number,
+      PropTypes.arrayOf(PropTypes.number),
+    ]),
+    activeOffsetX: PropTypes.oneOfType([
+      PropTypes.number,
+      PropTypes.arrayOf(PropTypes.number),
+    ]),
+    failOffsetY: PropTypes.oneOfType([
+      PropTypes.number,
+      PropTypes.arrayOf(PropTypes.number),
+    ]),
+    failOffsetX: PropTypes.oneOfType([
+      PropTypes.number,
+      PropTypes.arrayOf(PropTypes.number),
+    ]),
+    minDist: PropTypes.number,
+    minVelocity: PropTypes.number,
+    minVelocityX: PropTypes.number,
+    minVelocityY: PropTypes.number,
+    minPointers: PropTypes.number,
+    maxPointers: PropTypes.number,
+    avgTouches: PropTypes.bool,
+  },
+  {},
+  managePanProps,
+  {
+    activeOffsetYStart: true,
+    activeOffsetYEnd: true,
+    activeOffsetXStart: true,
+    activeOffsetXEnd: true,
+    failOffsetYStart: true,
+    failOffsetYEnd: true,
+    failOffsetXStart: true,
+    failOffsetXEnd: true,
+  }
+);
+export const PinchGestureHandler = createHandler(
+  'PinchGestureHandler',
+  GestureHandlerPropTypes,
+  {}
+);
+export const RotationGestureHandler = createHandler(
+  'RotationGestureHandler',
+  GestureHandlerPropTypes,
+  {}
+);

package/NativeViewGestureHandler.js

@@ -0,0 +1,14 @@
+import PropTypes from 'prop-types';
+
+import createHandler from './createHandler';
+import GestureHandlerPropTypes from './GestureHandlerPropTypes';
+
+const NativeViewGestureHandler = createHandler('NativeViewGestureHandler', {
+  ...GestureHandlerPropTypes,
+
+  // If changed, add changes to NATIVE_WRAPPER_PROPS_FILTER as well
+  shouldActivateOnStart: PropTypes.bool,
+  disallowInterruption: PropTypes.bool,
+});
+
+export default NativeViewGestureHandler;

package/PlatformConstants.web.js

@@ -1,3 +1,5 @@
 export default {
-  forceTouchAvailable: false,
+  get forceTouchAvailable() {
+    return false;
+  },
 };

package/RNGestureHandler.podspec

@@ -10,7 +10,7 @@ Pod::Spec.new do |s|
   s.homepage     = "https://github.com/kmagiera/react-native-gesture-handler"
   s.license      = "MIT"
   s.author       = { package["author"]["name"] => package["author"]["email"] }
-  s.platforms    = { :ios => "7.0", :tvos => "9.0" }
+  s.platforms    = { :ios => "9.0", :tvos => "9.0" }
   s.source       = { :git => "https://github.com/kmagiera/react-native-gesture-handler", :tag => "#{s.version}" }
   s.source_files = "ios/**/*.{h,m}"
 

package/RNGestureHandlerModule.web.js

@@ -0,0 +1,49 @@
+import { Direction } from './web/constants';
+import FlingGestureHandler from './web/FlingGestureHandler';
+import LongPressGestureHandler from './web/LongPressGestureHandler';
+import NativeViewGestureHandler from './web/NativeViewGestureHandler';
+import * as NodeManager from './web/NodeManager';
+import PanGestureHandler from './web/PanGestureHandler';
+import PinchGestureHandler from './web/PinchGestureHandler';
+import RotationGestureHandler from './web/RotationGestureHandler';
+import TapGestureHandler from './web/TapGestureHandler';
+
+const Gestures = {
+  PanGestureHandler,
+  RotationGestureHandler,
+  PinchGestureHandler,
+  TapGestureHandler,
+  NativeViewGestureHandler,
+  LongPressGestureHandler,
+  FlingGestureHandler,
+  // ForceTouchGestureHandler,
+};
+
+export default {
+  Direction,
+  handleSetJSResponder(tag, blockNativeResponder) {
+    console.warn('handleSetJSResponder: ', tag, blockNativeResponder);
+  },
+  handleClearJSResponder() {
+    console.warn('handleClearJSResponder: ');
+  },
+  createGestureHandler(handlerName, handlerTag, config) {
+    if (!(handlerName in Gestures))
+      throw new Error(`react-native-gesture-handler: ${handlerName} is not supported on web.`);
+    const GestureClass = Gestures[handlerName];
+    NodeManager.createGestureHandler(handlerTag, new GestureClass());
+    this.updateGestureHandler(handlerTag, config);
+  },
+  attachGestureHandler(handlerTag, newView) {
+    NodeManager.getHandler(handlerTag).setView(newView);
+  },
+  updateGestureHandler(handlerTag, newConfig) {
+    NodeManager.getHandler(handlerTag).updateGestureConfig(newConfig);
+  },
+  getGestureHandlerNode(handlerTag) {
+    return NodeManager.getHandler(handlerTag);
+  },
+  dropGestureHandler(handlerTag) {
+    NodeManager.dropGestureHandler(handlerTag);
+  },
+};

package/State.js

@@ -1,4 +1,4 @@
-export default {
+const State = {
   UNDETERMINED: 0,
   FAILED: 1,
   BEGAN: 2,
@@ -6,3 +6,14 @@ export default {
   ACTIVE: 4,
   END: 5,
 };
+
+State.print = state => {
+  const keys = Object.keys(State);
+  for (let i = 0; i < keys.length; i++) {
+    if (state === State[keys[i]]) {
+      return keys[i];
+    }
+  }
+};
+
+export default State;

package/Swipeable.js

@@ -11,13 +11,6 @@ import { PanGestureHandler, TapGestureHandler, State } from './GestureHandler';
 
 const DRAG_TOSS = 0.05;
 
-// Math.sign polyfill for iOS 8.x
-if (!Math.sign) {
-  Math.sign = function(x) {
-    return Number(x > 0) - Number(x < 0) || +x;
-  };
-}
-
 export type PropType = {
   children: any,
   friction: number,
@@ -25,7 +18,7 @@ export type PropType = {
   rightThreshold?: number,
   overshootLeft?: boolean,
   overshootRight?: boolean,
-  overshootFriction?: number,
+  overshootFriction: number,
   onSwipeableLeftOpen?: Function,
   onSwipeableRightOpen?: Function,
   onSwipeableOpen?: Function,
@@ -88,7 +81,7 @@ export default class Swipeable extends Component<PropType, StateType> {
     );
   }
 
-  componentWillUpdate(props: PropType, state: StateType) {
+  UNSAFE_componentWillUpdate(props: PropType, state: StateType) {
     if (
       this.props.friction !== props.friction ||
       this.props.overshootLeft !== props.overshootLeft ||
@@ -322,7 +315,9 @@ export default class Swipeable extends Component<PropType, StateType> {
         minDeltaX={10}
         onGestureEvent={this._onGestureEvent}
         onHandlerStateChange={this._onHandlerStateChange}>
-        <Animated.View onLayout={this._onRowLayout} style={[styles.container, this.props.containerStyle]}>
+        <Animated.View
+          onLayout={this._onRowLayout}
+          style={[styles.container, this.props.containerStyle]}>
           {left}
           {right}
           <TapGestureHandler
@@ -334,7 +329,7 @@ export default class Swipeable extends Component<PropType, StateType> {
                 {
                   transform: [{ translateX: this._transX }],
                 },
-                this.props.childrenContainerStyle
+                this.props.childrenContainerStyle,
               ]}>
               {children}
             </Animated.View>

package/android/build.gradle

@@ -5,17 +5,13 @@ def safeExtGet(prop, fallback) {
 }
 
 android {
-    compileSdkVersion safeExtGet("compileSdkVersion", 25)
-    buildToolsVersion safeExtGet("buildToolsVersion", '25.0.2')
+    compileSdkVersion safeExtGet("compileSdkVersion", 28)
 
     defaultConfig {
         minSdkVersion safeExtGet('minSdkVersion', 16)
-        targetSdkVersion safeExtGet('targetSdkVersion', 25)
+        targetSdkVersion safeExtGet('targetSdkVersion', 28)
         versionCode 1
         versionName "1.0"
-        ndk {
-            abiFilters "armeabi-v7a", "x86"
-        }
     }
 
     // Include "lib/" as sources, unfortunetely react-native link can't handle
@@ -28,5 +24,5 @@ android {
 
 dependencies {
     //noinspection GradleDynamicVersion
-    compileOnly 'com.facebook.react:react-native:+'
+    implementation 'com.facebook.react:react-native:+'
 }

package/android/lib/src/main/java/com/swmansion/gesturehandler/GestureHandlerOrchestrator.java

@@ -11,7 +11,7 @@ import java.util.ArrayList;
 import java.util.Arrays;
 import java.util.Comparator;
 
-import javax.annotation.Nullable;
+import androidx.annotation.Nullable;
 
 public class GestureHandlerOrchestrator {
 

package/android/lib/src/main/java/com/swmansion/gesturehandler/PanGestureHandler.java

@@ -241,7 +241,7 @@ public class PanGestureHandler extends GestureHandler<PanGestureHandler> {
     }
 
     if (action == MotionEvent.ACTION_UP) {
-      if (state == STATE_ACTIVE) {
+      if (state == STATE_ACTIVE || state == STATE_BEGAN) {
         end();
       } else {
         fail();

package/android/src/main/java/com/swmansion/gesturehandler/react/RNGestureHandlerEnabledRootView.java

@@ -7,7 +7,7 @@ import android.view.MotionEvent;
 import com.facebook.react.ReactInstanceManager;
 import com.facebook.react.ReactRootView;
 
-import javax.annotation.Nullable;
+import androidx.annotation.Nullable;
 
 public class RNGestureHandlerEnabledRootView extends ReactRootView {
 

package/android/src/main/java/com/swmansion/gesturehandler/react/RNGestureHandlerEvent.java

@@ -1,6 +1,6 @@
 package com.swmansion.gesturehandler.react;
 
-import android.support.v4.util.Pools;
+import androidx.core.util.Pools;
 
 import com.facebook.react.bridge.Arguments;
 import com.facebook.react.bridge.WritableMap;
@@ -8,7 +8,7 @@ import com.facebook.react.uimanager.events.Event;
 import com.facebook.react.uimanager.events.RCTEventEmitter;
 import com.swmansion.gesturehandler.GestureHandler;
 
-import javax.annotation.Nullable;
+import androidx.annotation.Nullable;
 
 public class RNGestureHandlerEvent extends Event<RNGestureHandlerEvent> {
 

package/android/src/main/java/com/swmansion/gesturehandler/react/RNGestureHandlerModule.java

@@ -33,7 +33,7 @@ import java.util.ArrayList;
 import java.util.List;
 import java.util.Map;
 
-import javax.annotation.Nullable;
+import androidx.annotation.Nullable;
 
 import static com.swmansion.gesturehandler.GestureHandler.HIT_SLOP_NONE;
 

package/android/src/main/java/com/swmansion/gesturehandler/react/RNGestureHandlerPackage.java

@@ -13,7 +13,7 @@ import java.util.Arrays;
 import java.util.List;
 import java.util.Map;
 
-import javax.annotation.Nullable;
+import androidx.annotation.Nullable;
 
 public class RNGestureHandlerPackage implements ReactPackage {
 

package/android/src/main/java/com/swmansion/gesturehandler/react/RNGestureHandlerRegistry.java

@@ -8,7 +8,7 @@ import com.swmansion.gesturehandler.GestureHandlerRegistry;
 
 import java.util.ArrayList;
 
-import javax.annotation.Nullable;
+import androidx.annotation.Nullable;
 
 public class RNGestureHandlerRegistry implements GestureHandlerRegistry {
 

package/android/src/main/java/com/swmansion/gesturehandler/react/RNGestureHandlerRootInterface.java

@@ -1,6 +1,6 @@
 package com.swmansion.gesturehandler.react;
 
-import javax.annotation.Nullable;
+import androidx.annotation.Nullable;
 
 public interface RNGestureHandlerRootInterface {
   @Nullable RNGestureHandlerRootHelper getRootHelper();

package/android/src/main/java/com/swmansion/gesturehandler/react/RNGestureHandlerRootView.java

@@ -7,7 +7,7 @@ import com.facebook.infer.annotation.Assertions;
 import com.facebook.react.bridge.ReactContext;
 import com.facebook.react.views.view.ReactViewGroup;
 
-import javax.annotation.Nullable;
+import androidx.annotation.Nullable;
 
 public class RNGestureHandlerRootView extends ReactViewGroup {
 

package/android/src/main/java/com/swmansion/gesturehandler/react/RNGestureHandlerRootViewManager.java

@@ -7,7 +7,7 @@ import com.facebook.react.uimanager.ViewGroupManager;
 
 import java.util.Map;
 
-import javax.annotation.Nullable;
+import androidx.annotation.Nullable;
 
 /**
  * React native's view manager used for creating instances of {@link }RNGestureHandlerRootView}. It

package/android/src/main/java/com/swmansion/gesturehandler/react/RNGestureHandlerStateChangeEvent.java

@@ -1,6 +1,6 @@
 package com.swmansion.gesturehandler.react;
 
-import android.support.v4.util.Pools;
+import androidx.core.util.Pools;
 
 import com.facebook.react.bridge.Arguments;
 import com.facebook.react.bridge.WritableMap;
@@ -8,7 +8,7 @@ import com.facebook.react.uimanager.events.Event;
 import com.facebook.react.uimanager.events.RCTEventEmitter;
 import com.swmansion.gesturehandler.GestureHandler;
 
-import javax.annotation.Nullable;
+import androidx.annotation.Nullable;
 
 public class RNGestureHandlerStateChangeEvent extends Event<RNGestureHandlerStateChangeEvent>{
 

package/createHandler.js

@@ -1,16 +1,42 @@
 import React from 'react';
-import { findNodeHandle, NativeModules, Touchable } from 'react-native';
+import {
+  findNodeHandle as findNodeHandleRN,
+  NativeModules,
+  Touchable,
+  Platform,
+} from 'react-native';
 import deepEqual from 'fbjs/lib/areEqual';
 import RNGestureHandlerModule from './RNGestureHandlerModule';
-
 import State from './State';
 
-const { UIManager } = NativeModules;
+function findNodeHandle(node) {
+  if (Platform.OS === 'web') return node;
+  return findNodeHandleRN(node);
+}
+
+const { UIManager = {} } = NativeModules;
+
+const customGHEventsConfig = {
+  onGestureHandlerEvent: { registrationName: 'onGestureHandlerEvent' },
+  onGestureHandlerStateChange: {
+    registrationName: 'onGestureHandlerStateChange',
+  },
+};
+
+// Add gesture specific events to genericDirectEventTypes object exported from UIManager
+// native module.
+// Once new event types are registered with react it is possible to dispatch these
+// events to all kind of native views.
+UIManager.genericDirectEventTypes = {
+  ...UIManager.genericDirectEventTypes,
+  ...customGHEventsConfig,
+};
 
 // Wrap JS responder calls and notify gesture handler manager
 const {
-  setJSResponder: oldSetJSResponder,
-  clearJSResponder: oldClearJSResponder,
+  setJSResponder: oldSetJSResponder = () => {},
+  clearJSResponder: oldClearJSResponder = () => {},
+  getConstants: oldGetConstants = () => ({}),
 } = UIManager;
 UIManager.setJSResponder = (tag, blockNativeResponder) => {
   RNGestureHandlerModule.handleSetJSResponder(tag, blockNativeResponder);
@@ -20,17 +46,17 @@ UIManager.clearJSResponder = () => {
   RNGestureHandlerModule.handleClearJSResponder();
   oldClearJSResponder();
 };
-
-// Add gesture specific events to genericDirectEventTypes object exported from UIManager
-// native module.
-// Once new event types are registered with react it is possible to dispatch these
-// events to all kind of native views.
-UIManager.genericDirectEventTypes = {
-  ...UIManager.genericDirectEventTypes,
-  onGestureHandlerEvent: { registrationName: 'onGestureHandlerEvent' },
-  onGestureHandlerStateChange: {
-    registrationName: 'onGestureHandlerStateChange',
-  },
+// We also add GH specific events to the constants object returned by
+// UIManager.getConstants to make it work with the newest version of RN
+UIManager.getConstants = () => {
+  const constants = oldGetConstants();
+  return {
+    ...constants,
+    genericDirectEventTypes: {
+      ...constants.genericDirectEventTypes,
+      ...customGHEventsConfig,
+    },
+  };
 };
 
 let handlerTag = 1;
@@ -71,6 +97,9 @@ function transformIntoHandlerTags(handlerIDs) {
     handlerIDs = [handlerIDs];
   }
 
+  if (Platform.OS === 'web') {
+    return handlerIDs.map(({ current }) => current).filter(handle => handle);
+  }
   // converts handler string IDs into their numeric tags
   return handlerIDs
     .map(
@@ -184,11 +213,8 @@ export default function createHandler(
       RNGestureHandlerModule.updateGestureHandler(this._handlerTag, newConfig);
     };
 
-    _dropGestureHandler = () => {
-      RNGestureHandlerModule.dropGestureHandler(this._handlerTag);
-    };
-
     componentWillUnmount() {
+      RNGestureHandlerModule.dropGestureHandler(this._handlerTag);
       if (this._updateEnqueued) {
         clearImmediate(this._updateEnqueued);
       }