Pressability: Setup Insertion Effect Experiment (#54292)

Summary:
Pull Request resolved: #54292

Sets up a feature flag to experiment with using `useInsertionEffect` in `Pressability`, instead of `useEffect.

Using `useInsertionEffect` enables `Pressability` to behave more predictability in component trees with `<Activity mode="hidden">` because the events are scheduled more similarly to platform controls (e.g. focus and blur events will still fire even when "hidden").

Changelog:
[Internal]

Reviewed By: javache

Differential Revision: D85612742

fbshipit-source-id: c2faab25bfcf7f964521e680eb3c4132c1087ef4

Author: yungsters

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

@@ -8,15 +8,26 @@
  * @format
  */
 
+import * as ReactNativeFeatureFlags from '../../src/private/featureflags/ReactNativeFeatureFlags';
 import Pressability, {
   type EventHandlers,
   type PressabilityConfig,
 } from './Pressability';
-import {useEffect, useRef} from 'react';
+import {useEffect, useInsertionEffect, useRef} from 'react';
 
 declare function usePressability(config: PressabilityConfig): EventHandlers;
 declare function usePressability(config: null | void): null | EventHandlers;
 
+// Experiments with using `useInsertionEffect` instead of `useEffect`, which
+// changes whether `Pressability` is configured or reset when inm a hidden
+// Activity. With `useInsertionEffect`, `Pressability` behaves more like a
+// platform control (e.g. Pointer Events), especially with respect to events
+// like focus and blur.
+const useConfigurationEffect =
+  ReactNativeFeatureFlags.configurePressabilityDuringInsertion()
+    ? useInsertionEffect
+    : useEffect;
+
 /**
  * Creates a persistent instance of `Pressability` that automatically configures
  * itself and resets. Accepts null `config` to support lazy initialization. Once
@@ -40,15 +51,15 @@ export default function usePressability(
 
   // On the initial mount, this is a no-op. On updates, `pressability` will be
   // re-configured to use the new configuration.
-  useEffect(() => {
+  useConfigurationEffect(() => {
     if (config != null && pressability != null) {
       pressability.configure(config);
     }
   }, [config, pressability]);
 
   // On unmount, reset pending state and timers inside `pressability`. This is
   // a separate effect because we do not want to reset when `config` changes.
-  useEffect(() => {
+  useConfigurationEffect(() => {
     if (pressability != null) {
       return () => {
         pressability.reset();

packages/react-native/scripts/featureflags/ReactNativeFeatureFlags.config.js

@@ -924,6 +924,17 @@ const definitions: FeatureFlagDefinitions = {
       },
       ossReleaseStage: 'none',
     },
+    configurePressabilityDuringInsertion: {
+      defaultValue: false,
+      metadata: {
+        dateAdded: '2025-10-27',
+        description:
+          'Configure Pressability during insertion and no longer unmount when hidden.',
+        expectedReleaseValue: true,
+        purpose: 'experimentation',
+      },
+      ossReleaseStage: 'none',
+    },
     deferFlatListFocusChangeRenderUpdate: {
       defaultValue: false,
       metadata: {

packages/react-native/src/private/featureflags/ReactNativeFeatureFlags.js

@@ -4,7 +4,7 @@
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  *
- * @generated SignedSource<<9bb9145e823dae3447fa8fbb31676b37>>
+ * @generated SignedSource<<d8ae80ae606b6cf56ea06866b5e5ac99>>
  * @flow strict
  * @noformat
  */
@@ -31,6 +31,7 @@ export type ReactNativeFeatureFlagsJsOnly = $ReadOnly<{
   jsOnlyTestFlag: Getter<boolean>,
   animatedShouldDebounceQueueFlush: Getter<boolean>,
   animatedShouldUseSingleOp: Getter<boolean>,
+  configurePressabilityDuringInsertion: Getter<boolean>,
   deferFlatListFocusChangeRenderUpdate: Getter<boolean>,
   disableMaintainVisibleContentPosition: Getter<boolean>,
   enableAccessToHostTreeInFabric: Getter<boolean>,
@@ -147,6 +148,11 @@ export const animatedShouldDebounceQueueFlush: Getter<boolean> = createJavaScrip
  */
 export const animatedShouldUseSingleOp: Getter<boolean> = createJavaScriptFlagGetter('animatedShouldUseSingleOp', false);
 
+/**
+ * Configure Pressability during insertion and no longer unmount when hidden.
+ */
+export const configurePressabilityDuringInsertion: Getter<boolean> = createJavaScriptFlagGetter('configurePressabilityDuringInsertion', false);
+
 /**
  * Use the deferred cell render update mechanism for focus change in FlatList.
  */