Expose more props from button (#4953)

src/components/Button.tsx

@@ -1,6 +1,8 @@
 import React from 'react'
 import {
   AccessibilityProps,
+  GestureResponderEvent,
+  MouseEvent,
   Pressable,
   PressableProps,
   StyleProp,
@@ -65,7 +67,15 @@ type NonTextElements =
 
 export type ButtonProps = Pick<
   PressableProps,
-  'disabled' | 'onPress' | 'testID' | 'onLongPress' | 'hitSlop'
+  | 'disabled'
+  | 'onPress'
+  | 'testID'
+  | 'onLongPress'
+  | 'hitSlop'
+  | 'onHoverIn'
+  | 'onHoverOut'
+  | 'onPressIn'
+  | 'onPressOut'
 > &
   AccessibilityProps &
   VariantProps & {
@@ -115,30 +125,50 @@ export const Button = React.forwardRef<View, ButtonProps>(
       focused: false,
     })
 
-    const onPressIn = React.useCallback(() => {
+    const onPressInOuter = rest.onPressIn
-      setState(s => ({
+    const onPressIn = React.useCallback(
-        ...s,
+      (e: GestureResponderEvent) => {
-        pressed: true,
+        setState(s => ({
-      }))
+          ...s,
-    }, [setState])
+          pressed: true,
-    const onPressOut = React.useCallback(() => {
+        }))
-      setState(s => ({
+        onPressInOuter?.(e)
-        ...s,
+      },
-        pressed: false,
+      [setState, onPressInOuter],
-      }))
+    )
-    }, [setState])
+    const onPressOutOuter = rest.onPressOut
-    const onHoverIn = React.useCallback(() => {
+    const onPressOut = React.useCallback(
-      setState(s => ({
+      (e: GestureResponderEvent) => {
-        ...s,
+        setState(s => ({
-        hovered: true,
+          ...s,
-      }))
+          pressed: false,
-    }, [setState])
+        }))
-    const onHoverOut = React.useCallback(() => {
+        onPressOutOuter?.(e)
-      setState(s => ({
+      },
-        ...s,
+      [setState, onPressOutOuter],
-        hovered: false,
+    )
-      }))
+    const onHoverInOuter = rest.onHoverIn
-    }, [setState])
+    const onHoverIn = React.useCallback(
+      (e: MouseEvent) => {
+        setState(s => ({
+          ...s,
+          hovered: true,
+        }))
+        onHoverInOuter?.(e)
+      },
+      [setState, onHoverInOuter],
+    )
+    const onHoverOutOuter = rest.onHoverOut
+    const onHoverOut = React.useCallback(
+      (e: MouseEvent) => {
+        setState(s => ({
+          ...s,
+          hovered: false,
+        }))
+        onHoverOutOuter?.(e)
+      },
+      [setState, onHoverOutOuter],
+    )
     const onFocus = React.useCallback(() => {
       setState(s => ({
         ...s,