Split types (#3750)

## Description

This PR splits `types.ts` file into multiple files to improve
readability.

## Test plan

1. `yarn ts-check`
2. `yarn lint-js`
3. `yarn circular-dependency-check`

Author: m-bert

packages/react-native-gesture-handler/src/v3/LogicDetector.tsx

@@ -4,15 +4,15 @@ import { findNodeHandle, Platform } from 'react-native';
 import { useDetectorContext } from './NativeDetector/useDetectorContext';
 import { NativeDetectorProps } from './NativeDetector/NativeDetector';
 import { isComposedGesture } from './hooks/utils/relationUtils';
-import { GestureEvents } from './types';
+import { DetectorCallbacks } from './types';
 
 export function LogicDetector<THandlerData, TConfig>(
   props: NativeDetectorProps<THandlerData, TConfig>
 ) {
   const { register, unregister } = useDetectorContext();
   const viewRef = useRef(null);
   const [viewTag, setViewTag] = useState<number>(-1);
-  const logicMethods = useRef(props.gesture.gestureEvents);
+  const logicMethods = useRef(props.gesture.detectorCallbacks);
 
   const handleRef = useCallback((node: any) => {
     viewRef.current = node;
@@ -31,8 +31,8 @@ export function LogicDetector<THandlerData, TConfig>(
   }, []);
 
   useEffect(() => {
-    logicMethods.current = props.gesture.gestureEvents;
-  }, [props.gesture.gestureEvents]);
+    logicMethods.current = props.gesture.detectorCallbacks;
+  }, [props.gesture.detectorCallbacks]);
 
   useEffect(() => {
     if (viewTag === -1) {
@@ -60,7 +60,7 @@ export function LogicDetector<THandlerData, TConfig>(
       Object.assign(logicProps, { viewRef });
     }
 
-    register(logicProps, logicMethods as RefObject<GestureEvents<unknown>>);
+    register(logicProps, logicMethods as RefObject<DetectorCallbacks<unknown>>);
 
     return () => {
       unregister(viewTag);

packages/react-native-gesture-handler/src/v3/NativeDetector/NativeDetector.tsx

@@ -5,7 +5,7 @@ import { tagMessage } from '../../utils';
 import {
   LogicChildren,
   Gesture,
-  GestureEvents,
+  DetectorCallbacks,
   GestureHandlerEvent,
 } from '../types';
 import { DetectorContext } from './useDetectorContext';
@@ -29,9 +29,9 @@ export function NativeDetector<THandlerData, TConfig>({
   children,
 }: NativeDetectorProps<THandlerData, TConfig>) {
   const [logicChildren, setLogicChildren] = useState<LogicChildren[]>([]);
-  const logicMethods = useRef<Map<number, RefObject<GestureEvents<unknown>>>>(
-    new Map()
-  );
+  const logicMethods = useRef<
+    Map<number, RefObject<DetectorCallbacks<unknown>>>
+  >(new Map());
 
   const NativeDetectorComponent = gesture.config.dispatchesAnimatedEvents
     ? AnimatedNativeDetector
@@ -40,7 +40,7 @@ export function NativeDetector<THandlerData, TConfig>({
       : HostGestureDetector;
 
   const register = useCallback(
-    (child: LogicChildren, methods: RefObject<GestureEvents<unknown>>) => {
+    (child: LogicChildren, methods: RefObject<DetectorCallbacks<unknown>>) => {
       setLogicChildren((prev) => {
         const index = prev.findIndex((c) => c.viewTag === child.viewTag);
         if (index !== -1) {
@@ -74,10 +74,10 @@ export function NativeDetector<THandlerData, TConfig>({
 
   configureRelations(gesture);
 
-  const handleGestureEvent = (key: keyof GestureEvents<THandlerData>) => {
+  const handleGestureEvent = (key: keyof DetectorCallbacks<THandlerData>) => {
     return (e: GestureHandlerEvent<THandlerData>) => {
-      if (gesture.gestureEvents[key]) {
-        gesture.gestureEvents[key](e);
+      if (gesture.detectorCallbacks[key]) {
+        gesture.detectorCallbacks[key](e);
       }
 
       logicMethods.current.forEach((ref) => {
@@ -90,12 +90,12 @@ export function NativeDetector<THandlerData, TConfig>({
   };
 
   const getHandlers = useCallback(
-    (key: keyof GestureEvents<unknown>) => {
+    (key: keyof DetectorCallbacks<unknown>) => {
       const handlers: ((e: GestureHandlerEvent<THandlerData>) => void)[] = [];
 
-      if (gesture.gestureEvents[key]) {
+      if (gesture.detectorCallbacks[key]) {
         handlers.push(
-          gesture.gestureEvents[key] as (
+          gesture.detectorCallbacks[key] as (
             e: GestureHandlerEvent<unknown>
           ) => void
         );
@@ -112,7 +112,7 @@ export function NativeDetector<THandlerData, TConfig>({
 
       return handlers;
     },
-    [logicChildren, gesture.gestureEvents]
+    [logicChildren, gesture.detectorCallbacks]
   );
 
   const reanimatedEventHandler = Reanimated?.useComposedEventHandler(
@@ -136,7 +136,7 @@ export function NativeDetector<THandlerData, TConfig>({
         onGestureHandlerEvent={handleGestureEvent('onGestureHandlerEvent')}
         // @ts-ignore This is a type mismatch between RNGH types and RN Codegen types
         onGestureHandlerAnimatedEvent={
-          gesture.gestureEvents.onGestureHandlerAnimatedEvent
+          gesture.detectorCallbacks.onGestureHandlerAnimatedEvent
         }
         // @ts-ignore This is a type mismatch between RNGH types and RN Codegen types
         onGestureHandlerTouchEvent={handleGestureEvent(

packages/react-native-gesture-handler/src/v3/NativeDetector/useDetectorContext.ts

@@ -1,10 +1,10 @@
 import { createContext, RefObject, useContext } from 'react';
-import { GestureEvents, LogicChildren } from '../types';
+import { DetectorCallbacks, LogicChildren } from '../types';
 
 type DetectorContextType = {
   register: (
     child: LogicChildren,
-    methods: RefObject<GestureEvents<unknown>>
+    methods: RefObject<DetectorCallbacks<unknown>>
   ) => void;
   unregister: (child: number) => void;
 };

packages/react-native-gesture-handler/src/v3/hooks/relations/useComposedGesture.ts

@@ -47,56 +47,57 @@ export function useComposedGesture(
 
   const onGestureHandlerStateChange = (event: StateChangeEvent<unknown>) => {
     for (const gesture of gestures) {
-      if (gesture.gestureEvents.onGestureHandlerStateChange) {
-        gesture.gestureEvents.onGestureHandlerStateChange(event);
+      if (gesture.detectorCallbacks.onGestureHandlerStateChange) {
+        gesture.detectorCallbacks.onGestureHandlerStateChange(event);
       }
     }
   };
 
   const onGestureHandlerEvent = (event: UpdateEvent<unknown>) => {
     for (const gesture of gestures) {
-      if (gesture.gestureEvents.onGestureHandlerEvent) {
-        gesture.gestureEvents.onGestureHandlerEvent(event);
+      if (gesture.detectorCallbacks.onGestureHandlerEvent) {
+        gesture.detectorCallbacks.onGestureHandlerEvent(event);
       }
     }
   };
 
   const onGestureHandlerTouchEvent = (event: TouchEvent) => {
     for (const gesture of gestures) {
-      if (gesture.gestureEvents.onGestureHandlerTouchEvent) {
-        gesture.gestureEvents.onGestureHandlerTouchEvent(event);
+      if (gesture.detectorCallbacks.onGestureHandlerTouchEvent) {
+        gesture.detectorCallbacks.onGestureHandlerTouchEvent(event);
       }
     }
   };
 
   const onReanimatedStateChange = Reanimated?.useComposedEventHandler(
     gestures.map(
-      (gesture) => gesture.gestureEvents.onReanimatedStateChange || null
+      (gesture) => gesture.detectorCallbacks.onReanimatedStateChange || null
     )
   );
 
   const onReanimatedUpdateEvent = Reanimated?.useComposedEventHandler(
     gestures.map(
-      (gesture) => gesture.gestureEvents.onReanimatedUpdateEvent || null
+      (gesture) => gesture.detectorCallbacks.onReanimatedUpdateEvent || null
     )
   );
 
   const onReanimatedTouchEvent = Reanimated?.useComposedEventHandler(
     gestures.map(
-      (gesture) => gesture.gestureEvents.onReanimatedTouchEvent || null
+      (gesture) => gesture.detectorCallbacks.onReanimatedTouchEvent || null
     )
   );
 
   let onGestureHandlerAnimatedEvent;
 
   const gesturesWithAnimatedEvent = gestures.filter(
     (gesture) =>
-      gesture.gestureEvents.onGestureHandlerAnimatedEvent !== undefined
+      gesture.detectorCallbacks.onGestureHandlerAnimatedEvent !== undefined
   );
 
   if (gesturesWithAnimatedEvent.length > 0) {
     onGestureHandlerAnimatedEvent =
-      gesturesWithAnimatedEvent[0].gestureEvents.onGestureHandlerAnimatedEvent;
+      gesturesWithAnimatedEvent[0].detectorCallbacks
+        .onGestureHandlerAnimatedEvent;
 
     if (__DEV__ && gesturesWithAnimatedEvent.length > 1) {
       console.warn(
@@ -111,7 +112,7 @@ export function useComposedGesture(
     tags,
     type,
     config,
-    gestureEvents: {
+    detectorCallbacks: {
       onGestureHandlerStateChange,
       onGestureHandlerEvent,
       onGestureHandlerTouchEvent,

packages/react-native-gesture-handler/src/v3/hooks/useGesture.ts

@@ -99,7 +99,7 @@ export function useGesture<THandlerData, TConfig>(
     tag,
     type,
     config,
-    gestureEvents: {
+    detectorCallbacks: {
       onGestureHandlerStateChange,
       onGestureHandlerEvent,
       onGestureHandlerTouchEvent,