diff --git a/apps/basic-example/tsconfig.json b/apps/basic-example/tsconfig.json index f01a4d3d9e..e471c9b5a1 100644 --- a/apps/basic-example/tsconfig.json +++ b/apps/basic-example/tsconfig.json @@ -17,7 +17,8 @@ "../../packages/react-native-gesture-handler/src/jestUtils/index.ts" ] }, - "types": ["jest"] + "types": ["jest","../../packages/react-native-gesture-handler/src/global.d.ts"] + }, "include": ["src/**/*.ts", "src/**/*.tsx"] } diff --git a/apps/common-app/tsconfig.json b/apps/common-app/tsconfig.json index e1cd719874..952ae8b2fa 100644 --- a/apps/common-app/tsconfig.json +++ b/apps/common-app/tsconfig.json @@ -18,7 +18,8 @@ "react-native-gesture-handler/jest-utils": [ "../../packages/react-native-gesture-handler/src/jestUtils/index.ts" ] - } + }, + "types": ["../../packages/react-native-gesture-handler/src/global.d.ts"] }, "include": ["src/**/*.ts", "src/**/*.tsx", "index.ts"] } diff --git a/apps/expo-example/tsconfig.json b/apps/expo-example/tsconfig.json index a2ccc08345..2ab85a77b9 100644 --- a/apps/expo-example/tsconfig.json +++ b/apps/expo-example/tsconfig.json @@ -17,7 +17,9 @@ "react-native-gesture-handler/jest-utils": [ "../../packages/react-native-gesture-handler/src/jestUtils/index.ts" ] - } + }, + "types": ["../../packages/react-native-gesture-handler/src/global.d.ts"] + }, "include": ["src/**/*.ts", "src/**/*.tsx", "App.tsx"], "exclude": ["metro.config.js", "android", "ios", ".bundle", "node_modules"] diff --git a/apps/macos-example/tsconfig.json b/apps/macos-example/tsconfig.json index 3a7b4ed3b3..0540f05f77 100644 --- a/apps/macos-example/tsconfig.json +++ b/apps/macos-example/tsconfig.json @@ -17,7 +17,9 @@ "react-native-gesture-handler/jest-utils": [ "../../packages/react-native-gesture-handler/src/jestUtils/index.ts" ] - } + }, + "types": ["../../packages/react-native-gesture-handler/src/global.d.ts"] + }, "include": ["src/**/*.ts", "src/**/*.tsx", "index.ts"], "exclude": ["metro.config.js", "macos", ".bundle", "node_modules"] diff --git a/packages/react-native-gesture-handler/src/global.d.ts b/packages/react-native-gesture-handler/src/global.d.ts new file mode 100644 index 0000000000..b20e3072ae --- /dev/null +++ b/packages/react-native-gesture-handler/src/global.d.ts @@ -0,0 +1,13 @@ +export {}; + +declare global { + // eslint-disable-next-line no-var + var _setGestureStateSync: + | ((handlerTag: number, state: number) => void) + | undefined; + + // eslint-disable-next-line no-var + var _setGestureStateAsync: + | ((handlerTag: number, state: number) => void) + | undefined; +} diff --git a/packages/react-native-gesture-handler/src/handlers/gestures/gestureStateManager.ts b/packages/react-native-gesture-handler/src/handlers/gestures/gestureStateManager.ts index 22147c5b52..3cca92e8b1 100644 --- a/packages/react-native-gesture-handler/src/handlers/gestures/gestureStateManager.ts +++ b/packages/react-native-gesture-handler/src/handlers/gestures/gestureStateManager.ts @@ -10,12 +10,6 @@ export interface GestureStateManagerType { handlerTag: number; } -// Declare methods to keep the TS happy -declare const globalThis: { - _setGestureStateSync?: (handlerTag: number, state: State) => void; - _setGestureStateAsync?: (handlerTag: number, state: State) => void; -}; - const wrappedSetGestureState = (handlerTag: number, state: State) => { 'worklet'; diff --git a/packages/react-native-gesture-handler/src/index.ts b/packages/react-native-gesture-handler/src/index.ts index ad32ac2dc6..1e657867dd 100644 --- a/packages/react-native-gesture-handler/src/index.ts +++ b/packages/react-native-gesture-handler/src/index.ts @@ -68,7 +68,7 @@ export type { SimultaneousGestureType as LegacySimultaneousGesture, ExclusiveGestureType as LegacyExclusiveGesture, } from './handlers/gestures/gestureComposition'; -export type { GestureStateManagerType as GestureStateManager } from './handlers/gestures/gestureStateManager'; +export type { GestureStateManagerType as LegacyGestureStateManager } from './handlers/gestures/gestureStateManager'; export { NativeViewGestureHandler } from './handlers/NativeViewGestureHandler'; export type { LegacyRawButtonProps, diff --git a/packages/react-native-gesture-handler/src/v3/gestureStateManager.ts b/packages/react-native-gesture-handler/src/v3/gestureStateManager.ts new file mode 100644 index 0000000000..6b862e96a8 --- /dev/null +++ b/packages/react-native-gesture-handler/src/v3/gestureStateManager.ts @@ -0,0 +1,43 @@ +import { State } from '../State'; +import { tagMessage } from '../utils'; + +export type GestureStateManagerType = { + begin(handlerTag: number): void; + activate(handlerTag: number): void; + fail(handlerTag: number): void; + end(handlerTag: number): void; +}; + +const setGestureState = (handlerTag: number, state: State) => { + 'worklet'; + + if (globalThis._setGestureStateSync) { + globalThis._setGestureStateSync(handlerTag, state); + } else if (globalThis._setGestureStateAsync) { + globalThis._setGestureStateAsync(handlerTag, state); + } else { + throw new Error(tagMessage('Failed to set gesture state')); + } +}; + +export const GestureStateManager: GestureStateManagerType = { + begin(handlerTag: number) { + 'worklet'; + setGestureState(handlerTag, State.BEGAN); + }, + + activate(handlerTag: number) { + 'worklet'; + setGestureState(handlerTag, State.ACTIVE); + }, + + fail(handlerTag: number) { + 'worklet'; + setGestureState(handlerTag, State.FAILED); + }, + + end(handlerTag: number) { + 'worklet'; + setGestureState(handlerTag, State.END); + }, +}; diff --git a/packages/react-native-gesture-handler/src/v3/gestureStateManager.web.ts b/packages/react-native-gesture-handler/src/v3/gestureStateManager.web.ts new file mode 100644 index 0000000000..907d75939b --- /dev/null +++ b/packages/react-native-gesture-handler/src/v3/gestureStateManager.web.ts @@ -0,0 +1,32 @@ +import { State } from '../State'; +import NodeManager from '../web/tools/NodeManager'; +import { GestureStateManagerType } from './gestureStateManager'; + +export const GestureStateManager: GestureStateManagerType = { + begin(handlerTag: number): void { + 'worklet'; + NodeManager.getHandler(handlerTag).begin(); + }, + + activate(handlerTag: number): void { + 'worklet'; + const handler = NodeManager.getHandler(handlerTag); + // Force going from UNDETERMINED to ACTIVE through BEGAN to preserve + // the correct state transition flow. + if (handler.state === State.UNDETERMINED) { + handler.begin(); + } + + handler.activate(true); + }, + + fail(handlerTag: number): void { + 'worklet'; + NodeManager.getHandler(handlerTag).fail(); + }, + + end(handlerTag: number): void { + 'worklet'; + NodeManager.getHandler(handlerTag).end(); + }, +}; diff --git a/packages/react-native-gesture-handler/src/v3/index.ts b/packages/react-native-gesture-handler/src/v3/index.ts index 1c5b0baaf8..4902aae885 100644 --- a/packages/react-native-gesture-handler/src/v3/index.ts +++ b/packages/react-native-gesture-handler/src/v3/index.ts @@ -72,3 +72,5 @@ export { } from './components'; export type { ComposedGesture } from './types'; + +export { GestureStateManager } from './gestureStateManager'; diff --git a/packages/react-native-gesture-handler/tsconfig.json b/packages/react-native-gesture-handler/tsconfig.json index 5eb83bab6f..8591d593fc 100644 --- a/packages/react-native-gesture-handler/tsconfig.json +++ b/packages/react-native-gesture-handler/tsconfig.json @@ -4,7 +4,7 @@ "outDir": "lib/typescript", "paths": { "react-native-gesture-handler": ["./src"] - } + }, "types": ["./src/global.d.ts", "jest"] }, "include": ["src/**/*.ts", "src/**/*.tsx", "jestSetup.js"] }