feat: add velocity props to improve dismiss behavior

docs/PROPSMETHODS.md

@@ -126,12 +126,22 @@ A number that determines the momentum of the scroll required.
 
 ### `threshold`
 
-Number of pixels that the user must drag the modal before snapping to another position.
+Number of pixels that the user must pass to be able to close the modal.
 
 | Type     | Required | Default |
 | -------- | -------- | ------- |
 | number   | No       | `150`   |
 
+### `velocity`
+
+Number of pixels the user has to pan down fast to close the modal (e.g. When the user is reaching the top of the ScrollView and is immediately panning down to dismiss Modalize. If it reaches the velocity threshold then it instantly closes the modal). The highest the number it is, the more the user will need to pan down and make an important gesture to dismiss the modal.
+
+?> If `velocity` is defined, then the `threshold` props is not used. If you want to use the `threshold` method instead of the `velocity` defines it to `velocity={undefined}`.
+
+| Type               | Required | Default |
+| ------------------ | -------- | ------- |
+| number | undefined | No       | `2800`  |
+
 ### `adjustToContentHeight`
 
 Shrink the modal to your content's height.

src/index.tsx

@@ -75,7 +75,8 @@ export class Modalize<FlatListItem = any, SectionListItem = any> extends React.C
       timing: { duration: 280, easing: Easing.ease },
     },
     dragToss: 0.05,
-    threshold: 150,
+    threshold: 120,
+    velocity: 2800,
   };
 
   private snaps: number[] = [];
@@ -482,11 +483,17 @@ export class Modalize<FlatListItem = any, SectionListItem = any> extends React.C
       onPositionChange,
       panGestureAnimatedValue,
       threshold,
+      velocity,
     } = this.props;
     const { timing } = closeAnimationConfig!;
     const { lastSnap, modalHeight, overlay } = this.state;
     const { velocityY, translationY } = nativeEvent;
     const enableBounces = this.beginScrollYValue > 0 || translationY < 0;
+    const thresholdProps =
+      translationY > (adjustToContentHeight ? (modalHeight || 0) / 3 : threshold);
+    const closeThreshold = velocity
+      ? this.beginScrollYValue <= 20 && velocityY >= velocity
+      : thresholdProps && this.beginScrollYValue === 0;
 
     this.setState({ enableBounces });
 
@@ -514,11 +521,7 @@ export class Modalize<FlatListItem = any, SectionListItem = any> extends React.C
             }
           }
         });
-      } else if (
-        translationY > (adjustToContentHeight ? (modalHeight || 0) / 3 : threshold) &&
-        this.beginScrollYValue === 0 &&
-        !alwaysOpen
-      ) {
+      } else if (closeThreshold && !alwaysOpen) {
         this.willCloseModalize = true;
         this.close();
       }

src/options.ts

@@ -124,11 +124,17 @@ export interface IProps<FlatListItem = any, SectionListItem = any> {
   dragToss: number;
 
   /**
-   * Number of pixels that the user must drag the modal before snapping to another position.
-   * @default 150
+   * Number of pixels that the user must pass to be able to close the modal.
+   * @default 120
    */
   threshold: number;
 
+  /**
+   * Number of pixels the user has to pan down fast to close the modal.
+   * @default 2800
+   */
+  velocity: number | undefined;
+
   /**
    * Shrink the modal to your content's height.
    * @default false