Improve docs of onResponderGrant and expose via Pressability (faceboo…

…k#38195)

Summary:
Pull Request resolved: facebook#38195

`onResponderGrant`'s return value drives the `blockNativeResponder` value for the `setIsJSResponder` native callback. On Android this is used to call `requestDisallowInterceptTouchEvent`, which can be used to prevent a scrollview from activating while another responder is active.

Changelog: [Improved] Exposed ability to block native responder in Pressability. Pressables using `cancelable={false}` will now prevent scrolling and other native gestures from activating.

Reviewed By: yungsters

Differential Revision: D47225928

fbshipit-source-id: 27f1c677436da3add301ecdcda6b018b9038829e

packages/react-native/Libraries/Components/View/ViewPropTypes.js

@@ -164,8 +164,8 @@ type GestureResponderEventProps = $ReadOnly<{|
    * `View.props.onResponderGrant: (event) => {}`, where `event` is a synthetic
    * touch event as described above.
    *
-   * PanResponder includes a note `// TODO: t7467124 investigate if this can be removed` that
-   * should help fixing this return type.
+   * Return true from this callback to prevent any other native components from
+   * becoming responder until this responder terminates (Android-only).
    *
    * See https://reactnative.dev/docs/view#onrespondergrant
    */

packages/react-native/Libraries/Pressability/Pressability.js

@@ -134,6 +134,8 @@ export type PressabilityConfig = $ReadOnly<{|
   /**
    * Returns whether a long press gesture should cancel the press gesture.
    * Defaults to true.
+   *
+   * @deprecated
    */
   onLongPressShouldCancelPress_DEPRECATED?: ?() => boolean,
 
@@ -142,6 +144,8 @@ export type PressabilityConfig = $ReadOnly<{|
    *
    * Returns whether to yield to a lock termination request (e.g. if a native
    * scroll gesture attempts to steal the responder lock).
+   *
+   * @deprecated
    */
   onResponderTerminationRequest_DEPRECATED?: ?() => boolean,
 
@@ -163,7 +167,7 @@ export type EventHandlers = $ReadOnly<{|
   onMouseLeave?: (event: MouseEvent) => void,
   onPointerEnter?: (event: PointerEvent) => void,
   onPointerLeave?: (event: PointerEvent) => void,
-  onResponderGrant: (event: PressEvent) => void,
+  onResponderGrant: (event: PressEvent) => void | boolean,
   onResponderMove: (event: PressEvent) => void,
   onResponderRelease: (event: PressEvent) => void,
   onResponderTerminate: (event: PressEvent) => void,
@@ -464,7 +468,7 @@ export default class Pressability {
         return !disabled;
       },
 
-      onResponderGrant: (event: PressEvent): void => {
+      onResponderGrant: (event: PressEvent): void | boolean => {
         event.persist();
 
         this._cancelPressOutDelayTimeout();
@@ -490,6 +494,8 @@ export default class Pressability {
         this._longPressDelayTimeout = setTimeout(() => {
           this._handleLongPress(event);
         }, delayLongPress + delayPressIn);
+
+        return this._config.cancelable === false;
       },
 
       onResponderMove: (event: PressEvent): void => {