Pull in upstream fixes to expose hover props on Pressable

Libraries/Components/Pressable/Pressable.js

@@ -25,13 +25,11 @@ import type {
 import {PressabilityDebugView} from '../../Pressability/PressabilityDebug';
 import usePressability from '../../Pressability/usePressability';
 import {normalizeRect, type RectOrSize} from '../../StyleSheet/Rect';
-import type {ColorValue} from '../../StyleSheet/StyleSheet';
 import type {
   LayoutEvent,
-  MouseEvent, // TODO(macOS GH#774)
+  MouseEvent,
   PressEvent,
 } from '../../Types/CoreEventTypes';
-import type {DraggedTypesType} from '../View/DraggedType'; // TODO(macOS GH#774)
 import View from '../View/View';
 
 type ViewStyleProp = $ElementType<React.ElementConfig<typeof View>, 'style'>;
@@ -65,6 +63,16 @@ type Props = $ReadOnly<{|
    */
   children: React.Node | ((state: StateCallbackType) => React.Node),
 
+  /**
+   * Duration to wait after hover in before calling `onHoverIn`.
+   */
+  delayHoverIn?: ?number,
+
+  /**
+   * Duration to wait after hover out before calling `onHoverOut`.
+   */
+  delayHoverOut?: ?number,
+
   /**
    * Duration (in milliseconds) from `onPressIn` before `onLongPress` is called.
    */
@@ -91,6 +99,16 @@ type Props = $ReadOnly<{|
    */
   onLayout?: ?(event: LayoutEvent) => void,
 
+  /**
+   * Called when the hover is activated to provide visual feedback.
+   */
+  onHoverIn?: ?(event: MouseEvent) => mixed,
+
+  /**
+   * Called when the hover is deactivated to undo visual feedback.
+   */
+  onHoverOut?: ?(event: MouseEvent) => mixed,
+
   /**
    * Called when a long-tap gesture is detected.
    */
@@ -146,8 +164,6 @@ type Props = $ReadOnly<{|
   acceptsFirstMouse?: ?boolean,
   enableFocusRing?: ?boolean,
   tooltip?: ?string,
-  onMouseEnter?: (event: MouseEvent) => void,
-  onMouseLeave?: (event: MouseEvent) => void,
   onDragEnter?: (event: MouseEvent) => void,
   onDragLeave?: (event: MouseEvent) => void,
   onDrop?: (event: MouseEvent) => void,
@@ -167,11 +183,13 @@ function Pressable(props: Props, forwardedRef): React.Node {
     android_disableSound,
     android_ripple,
     children,
+    delayHoverIn,
+    delayHoverOut,
     delayLongPress,
     disabled,
     focusable,
-    onMouseEnter, // [TODO(macOS GH#774)
-    onMouseLeave, // ]TODO(macOS GH#774)
+    onHoverIn,
+    onHoverOut,
     onLongPress,
     onPress,
     onPressIn,
@@ -208,10 +226,12 @@ function Pressable(props: Props, forwardedRef): React.Node {
       hitSlop,
       pressRectOffset: pressRetentionOffset,
       android_disableSound,
+      delayHoverIn,
+      delayHoverOut,
       delayLongPress,
       delayPressIn: unstable_pressDelay,
-      onHoverIn: onMouseEnter, // [TODO(macOS GH#774)
-      onHoverOut: onMouseLeave, // ]TODO(macOS GH#774)
+      onHoverIn,
+      onHoverOut,
       onLongPress,
       onPress,
       onPressIn(event: PressEvent): void {
@@ -237,11 +257,13 @@ function Pressable(props: Props, forwardedRef): React.Node {
     [
       android_disableSound,
       android_rippleConfig,
+      delayHoverIn,
+      delayHoverOut,
       delayLongPress,
       disabled,
       hitSlop,
-      onMouseEnter, // [TODO(macOS GH#774)
-      onMouseLeave, // ]TODO(macOS GH#774)
+      onHoverIn,
+      onHoverOut,
       onLongPress,
       onPress,
       onPressIn,

packages/rn-tester/js/examples/Pressable/PressableExample.js

@@ -99,8 +99,8 @@ function PressableFeedbackEvents() {
           testID="pressable_feedback_events_button"
           accessibilityLabel="pressable feedback events"
           accessibilityRole="button"
-          onMouseEnter={() => appendEvent('mouseEnter')} // [TODO(macOS GH#774)
-          onMouseLeave={() => appendEvent('mouseLeave')} // ]TODO(macOS GH#774)
+          onHoverIn={() => appendEvent('hoverIn')} // [TODO(macOS GH#774)
+          onHoverOut={() => appendEvent('hoverOut')} // ]TODO(macOS GH#774)
           onPress={() => appendEvent('press')}
           onPressIn={() => appendEvent('pressIn')}
           onPressOut={() => appendEvent('pressOut')}