Skip to content

Commit d63bc83

Browse files
authored
Extract CALLBACK_TYPE to shared module (#4374)
## Description Extracts `CALLBACK_TYPE` from `handlers/gestures/gesture.ts` into a standalone `src/CallbackType.ts` module and renames it to `CallbackType`. ## Test plan Tested on example app
1 parent 35a0aea commit d63bc83

5 files changed

Lines changed: 78 additions & 82 deletions

File tree

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
export const CallbackType = {
2+
UNDEFINED: 0,
3+
BEGAN: 1,
4+
START: 2,
5+
UPDATE: 3,
6+
CHANGE: 4,
7+
END: 5,
8+
FINALIZE: 6,
9+
TOUCHES_DOWN: 7,
10+
TOUCHES_MOVE: 8,
11+
TOUCHES_UP: 9,
12+
TOUCHES_CANCEL: 10,
13+
} as const;
14+
15+
// eslint-disable-next-line @typescript-eslint/no-redeclare -- backward compatibility; it can be used as a type and as a value
16+
export type CallbackType = (typeof CallbackType)[keyof typeof CallbackType];

‎packages/react-native-gesture-handler/src/handlers/gestures/GestureDetector/useAnimatedGesture.ts‎

Lines changed: 27 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { CallbackType } from '../../../CallbackType';
12
import { State } from '../../../State';
23
import { TouchEventType } from '../../../TouchEventType';
34
import { tagMessage } from '../../../utils';
@@ -7,60 +8,57 @@ import type {
78
GestureUpdateEvent,
89
} from '../../gestureHandlerCommon';
910
import type { HandlerCallbacks } from '../gesture';
10-
import { CALLBACK_TYPE } from '../gesture';
1111
import type { GestureStateManagerType } from '../gestureStateManager';
1212
import { GestureStateManager } from '../gestureStateManager';
1313
import { Reanimated } from '../reanimatedWrapper';
1414
import type { AttachedGestureState } from './types';
1515

1616
function getHandler(
17-
type: CALLBACK_TYPE,
17+
type: CallbackType,
1818
gesture: HandlerCallbacks<Record<string, unknown>>
1919
) {
2020
'worklet';
2121
switch (type) {
22-
case CALLBACK_TYPE.BEGAN:
22+
case CallbackType.BEGAN:
2323
return gesture.onBegin;
24-
case CALLBACK_TYPE.START:
24+
case CallbackType.START:
2525
return gesture.onStart;
26-
case CALLBACK_TYPE.UPDATE:
26+
case CallbackType.UPDATE:
2727
return gesture.onUpdate;
28-
case CALLBACK_TYPE.CHANGE:
28+
case CallbackType.CHANGE:
2929
return gesture.onChange;
30-
case CALLBACK_TYPE.END:
30+
case CallbackType.END:
3131
return gesture.onEnd;
32-
case CALLBACK_TYPE.FINALIZE:
32+
case CallbackType.FINALIZE:
3333
return gesture.onFinalize;
34-
case CALLBACK_TYPE.TOUCHES_DOWN:
34+
case CallbackType.TOUCHES_DOWN:
3535
return gesture.onTouchesDown;
36-
case CALLBACK_TYPE.TOUCHES_MOVE:
36+
case CallbackType.TOUCHES_MOVE:
3737
return gesture.onTouchesMove;
38-
case CALLBACK_TYPE.TOUCHES_UP:
38+
case CallbackType.TOUCHES_UP:
3939
return gesture.onTouchesUp;
40-
case CALLBACK_TYPE.TOUCHES_CANCEL:
40+
case CallbackType.TOUCHES_CANCEL:
4141
return gesture.onTouchesCancelled;
4242
}
4343
}
4444

45-
function touchEventTypeToCallbackType(
46-
eventType: TouchEventType
47-
): CALLBACK_TYPE {
45+
function touchEventTypeToCallbackType(eventType: TouchEventType): CallbackType {
4846
'worklet';
4947
switch (eventType) {
5048
case TouchEventType.TOUCHES_DOWN:
51-
return CALLBACK_TYPE.TOUCHES_DOWN;
49+
return CallbackType.TOUCHES_DOWN;
5250
case TouchEventType.TOUCHES_MOVE:
53-
return CALLBACK_TYPE.TOUCHES_MOVE;
51+
return CallbackType.TOUCHES_MOVE;
5452
case TouchEventType.TOUCHES_UP:
55-
return CALLBACK_TYPE.TOUCHES_UP;
53+
return CallbackType.TOUCHES_UP;
5654
case TouchEventType.TOUCHES_CANCEL:
57-
return CALLBACK_TYPE.TOUCHES_CANCEL;
55+
return CallbackType.TOUCHES_CANCEL;
5856
}
59-
return CALLBACK_TYPE.UNDEFINED;
57+
return CallbackType.UNDEFINED;
6058
}
6159

6260
function runWorklet(
63-
type: CALLBACK_TYPE,
61+
type: CallbackType,
6462
gesture: HandlerCallbacks<Record<string, unknown>>,
6563
event: GestureStateChangeEvent | GestureUpdateEvent | GestureTouchEvent,
6664
...args: unknown[]
@@ -136,30 +134,30 @@ export function useAnimatedGesture(
136134
event.oldState === State.UNDETERMINED &&
137135
event.state === State.BEGAN
138136
) {
139-
runWorklet(CALLBACK_TYPE.BEGAN, gesture, event);
137+
runWorklet(CallbackType.BEGAN, gesture, event);
140138
} else if (
141139
(event.oldState === State.BEGAN ||
142140
event.oldState === State.UNDETERMINED) &&
143141
event.state === State.ACTIVE
144142
) {
145-
runWorklet(CALLBACK_TYPE.START, gesture, event);
143+
runWorklet(CallbackType.START, gesture, event);
146144
lastUpdateEvent.value[gesture.handlerTag] = undefined;
147145
} else if (
148146
event.oldState !== event.state &&
149147
event.state === State.END
150148
) {
151149
if (event.oldState === State.ACTIVE) {
152-
runWorklet(CALLBACK_TYPE.END, gesture, event, true);
150+
runWorklet(CallbackType.END, gesture, event, true);
153151
}
154-
runWorklet(CALLBACK_TYPE.FINALIZE, gesture, event, true);
152+
runWorklet(CallbackType.FINALIZE, gesture, event, true);
155153
} else if (
156154
(event.state === State.FAILED || event.state === State.CANCELLED) &&
157155
event.state !== event.oldState
158156
) {
159157
if (event.oldState === State.ACTIVE) {
160-
runWorklet(CALLBACK_TYPE.END, gesture, event, false);
158+
runWorklet(CallbackType.END, gesture, event, false);
161159
}
162-
runWorklet(CALLBACK_TYPE.FINALIZE, gesture, event, false);
160+
runWorklet(CallbackType.FINALIZE, gesture, event, false);
163161
}
164162
} else if (isTouchEvent(event)) {
165163
if (
@@ -178,11 +176,11 @@ export function useAnimatedGesture(
178176
);
179177
}
180178
} else {
181-
runWorklet(CALLBACK_TYPE.UPDATE, gesture, event);
179+
runWorklet(CallbackType.UPDATE, gesture, event);
182180

183181
if (gesture.onChange && gesture.changeEventCalculator) {
184182
runWorklet(
185-
CALLBACK_TYPE.CHANGE,
183+
CallbackType.CHANGE,
186184
gesture,
187185
gesture.changeEventCalculator?.(
188186
event,

‎packages/react-native-gesture-handler/src/handlers/gestures/gesture.ts‎

Lines changed: 11 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { CallbackType } from '../../CallbackType';
12
import { isRemoteDebuggingEnabled } from '../../utils';
23
import type {
34
ActiveCursor,
@@ -91,24 +92,6 @@ export type HandlerCallbacks<EventPayloadT extends Record<string, unknown>> = {
9192
isWorklet: boolean[];
9293
};
9394

94-
export const CALLBACK_TYPE = {
95-
UNDEFINED: 0,
96-
BEGAN: 1,
97-
START: 2,
98-
UPDATE: 3,
99-
CHANGE: 4,
100-
END: 5,
101-
FINALIZE: 6,
102-
TOUCHES_DOWN: 7,
103-
TOUCHES_MOVE: 8,
104-
TOUCHES_UP: 9,
105-
TOUCHES_CANCEL: 10,
106-
} as const;
107-
108-
// Allow using CALLBACK_TYPE as object and type
109-
// eslint-disable-next-line @typescript-eslint/no-redeclare
110-
export type CALLBACK_TYPE = (typeof CALLBACK_TYPE)[keyof typeof CALLBACK_TYPE];
111-
11295
export abstract class Gesture {
11396
/**
11497
* Return array of gestures, providing the same interface for creating and updating
@@ -198,7 +181,7 @@ export abstract class BaseGesture<
198181
*/
199182
onBegin(callback: (event: GestureStateChangeEvent<EventPayloadT>) => void) {
200183
this.handlers.onBegin = callback;
201-
this.handlers.isWorklet[CALLBACK_TYPE.BEGAN] = this.isWorklet(callback);
184+
this.handlers.isWorklet[CallbackType.BEGAN] = this.isWorklet(callback);
202185
return this;
203186
}
204187

@@ -208,7 +191,7 @@ export abstract class BaseGesture<
208191
*/
209192
onStart(callback: (event: GestureStateChangeEvent<EventPayloadT>) => void) {
210193
this.handlers.onStart = callback;
211-
this.handlers.isWorklet[CALLBACK_TYPE.START] = this.isWorklet(callback);
194+
this.handlers.isWorklet[CallbackType.START] = this.isWorklet(callback);
212195
return this;
213196
}
214197

@@ -225,7 +208,7 @@ export abstract class BaseGesture<
225208
) {
226209
this.handlers.onEnd = callback;
227210
// @ts-ignore if callback is a worklet, the property will be available, if not then the check will return false
228-
this.handlers.isWorklet[CALLBACK_TYPE.END] = this.isWorklet(callback);
211+
this.handlers.isWorklet[CallbackType.END] = this.isWorklet(callback);
229212
return this;
230213
}
231214

@@ -241,7 +224,7 @@ export abstract class BaseGesture<
241224
) {
242225
this.handlers.onFinalize = callback;
243226
// @ts-ignore if callback is a worklet, the property will be available, if not then the check will return false
244-
this.handlers.isWorklet[CALLBACK_TYPE.FINALIZE] = this.isWorklet(callback);
227+
this.handlers.isWorklet[CallbackType.FINALIZE] = this.isWorklet(callback);
245228
return this;
246229
}
247230

@@ -252,7 +235,7 @@ export abstract class BaseGesture<
252235
onTouchesDown(callback: TouchEventHandlerType) {
253236
this.config.needsPointerData = true;
254237
this.handlers.onTouchesDown = callback;
255-
this.handlers.isWorklet[CALLBACK_TYPE.TOUCHES_DOWN] =
238+
this.handlers.isWorklet[CallbackType.TOUCHES_DOWN] =
256239
this.isWorklet(callback);
257240

258241
return this;
@@ -265,7 +248,7 @@ export abstract class BaseGesture<
265248
onTouchesMove(callback: TouchEventHandlerType) {
266249
this.config.needsPointerData = true;
267250
this.handlers.onTouchesMove = callback;
268-
this.handlers.isWorklet[CALLBACK_TYPE.TOUCHES_MOVE] =
251+
this.handlers.isWorklet[CallbackType.TOUCHES_MOVE] =
269252
this.isWorklet(callback);
270253

271254
return this;
@@ -278,8 +261,7 @@ export abstract class BaseGesture<
278261
onTouchesUp(callback: TouchEventHandlerType) {
279262
this.config.needsPointerData = true;
280263
this.handlers.onTouchesUp = callback;
281-
this.handlers.isWorklet[CALLBACK_TYPE.TOUCHES_UP] =
282-
this.isWorklet(callback);
264+
this.handlers.isWorklet[CallbackType.TOUCHES_UP] = this.isWorklet(callback);
283265

284266
return this;
285267
}
@@ -291,7 +273,7 @@ export abstract class BaseGesture<
291273
onTouchesCancelled(callback: TouchEventHandlerType) {
292274
this.config.needsPointerData = true;
293275
this.handlers.onTouchesCancelled = callback;
294-
this.handlers.isWorklet[CALLBACK_TYPE.TOUCHES_CANCEL] =
276+
this.handlers.isWorklet[CallbackType.TOUCHES_CANCEL] =
295277
this.isWorklet(callback);
296278

297279
return this;
@@ -464,7 +446,7 @@ export abstract class ContinousBaseGesture<
464446
*/
465447
onUpdate(callback: (event: GestureUpdateEvent<EventPayloadT>) => void) {
466448
this.handlers.onUpdate = callback;
467-
this.handlers.isWorklet[CALLBACK_TYPE.UPDATE] = this.isWorklet(callback);
449+
this.handlers.isWorklet[CallbackType.UPDATE] = this.isWorklet(callback);
468450
return this;
469451
}
470452

@@ -479,7 +461,7 @@ export abstract class ContinousBaseGesture<
479461
) => void
480462
) {
481463
this.handlers.onChange = callback;
482-
this.handlers.isWorklet[CALLBACK_TYPE.CHANGE] = this.isWorklet(callback);
464+
this.handlers.isWorklet[CallbackType.CHANGE] = this.isWorklet(callback);
483465
return this;
484466
}
485467

‎packages/react-native-gesture-handler/src/v3/hooks/callbacks/eventHandler.ts‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1+
import { CallbackType } from '../../../CallbackType';
12
import type { GestureTouchEvent } from '../../../handlers/gestureHandlerCommon';
2-
import { CALLBACK_TYPE } from '../../../handlers/gestures/gesture';
33
import type { ReanimatedContext } from '../../../handlers/gestures/reanimatedWrapper';
44
import { State } from '../../../State';
55
import { TouchEventType } from '../../../TouchEventType';
@@ -37,13 +37,13 @@ function handleStateChangeEvent<
3737
const event = flattenAndFilterEvent(eventWithData);
3838

3939
if (oldState === State.UNDETERMINED && state === State.BEGAN) {
40-
runCallback(CALLBACK_TYPE.BEGAN, callbacks, event);
40+
runCallback(CallbackType.BEGAN, callbacks, event);
4141
} else if (
4242
(oldState === State.BEGAN || oldState === State.UNDETERMINED) &&
4343
state === State.ACTIVE
4444
) {
4545
fillInDefaultValues?.(event as GestureEvent<TExtendedHandlerData>);
46-
runCallback(CALLBACK_TYPE.START, callbacks, event);
46+
runCallback(CallbackType.START, callbacks, event);
4747
} else if (
4848
oldState !== state &&
4949
(state === State.END || state === State.FAILED || state === State.CANCELLED)
@@ -57,13 +57,13 @@ function handleStateChangeEvent<
5757
if (oldState === State.ACTIVE) {
5858
fillInDefaultValues?.(endEvent as GestureEndEvent<TExtendedHandlerData>);
5959
runCallback<THandlerData, TExtendedHandlerData>(
60-
CALLBACK_TYPE.END,
60+
CallbackType.END,
6161
callbacks,
6262
endEvent
6363
);
6464
}
6565
runCallback<THandlerData, TExtendedHandlerData>(
66-
CALLBACK_TYPE.FINALIZE,
66+
CallbackType.FINALIZE,
6767
callbacks,
6868
endEvent
6969
);
@@ -92,7 +92,7 @@ export function handleUpdateEvent<
9292
: eventWithData;
9393

9494
const event = flattenAndFilterEvent(eventWithChanges);
95-
runCallback(CALLBACK_TYPE.UPDATE, handlers, event);
95+
runCallback(CallbackType.UPDATE, handlers, event);
9696

9797
if (context) {
9898
context.lastUpdateEvent = eventWithData;

0 commit comments

Comments
 (0)