Skip to content

Commit b27c7c4

Browse files
j-piaseckij-piasecki
authored
[General] Hide internal fields from gesture events (#3844)
## Description Hides internal fields (`state`, `oldState`, and `handlerTag`) from the Gesture Handler events exposed externally. Those shouldn't be needed when using the v3 api and clutter the events. This also means that update events don't differ from the update events in shape, so they became redundant. ## Test plan Verify that `state`, `oldState`, and `handlerTag` are hidden from events.
1 parent ae41fec commit b27c7c4

18 files changed

Lines changed: 87 additions & 204 deletions

File tree

‎packages/react-native-gesture-handler/apple/RNGestureHandlerDetector.mm‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -95,11 +95,12 @@ - (void)dispatchGestureEvent:(RNGestureHandlerDetectorEventEmitter::OnGestureHan
9595
- (void)dispatchAnimatedGestureEvent:(RNGestureHandlerDetectorEventEmitter::OnGestureHandlerEvent)event
9696
{
9797
if (_eventEmitter != nullptr) {
98-
std::dynamic_pointer_cast<const RNGestureHandlerDetectorEventEmitter>(_eventEmitter)->onGestureHandlerAnimatedEvent({
99-
.state = event.state,
100-
.handlerTag = event.handlerTag,
101-
.handlerData = event.handlerData,
102-
});
98+
std::dynamic_pointer_cast<const RNGestureHandlerDetectorEventEmitter>(_eventEmitter)
99+
->onGestureHandlerAnimatedEvent({
100+
.state = event.state,
101+
.handlerTag = event.handlerTag,
102+
.handlerData = event.handlerData,
103+
});
103104
}
104105
}
105106

‎packages/react-native-gesture-handler/src/components/ReanimatedDrawerLayout.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@ import {
4343
HitSlop,
4444
} from '../handlers/gestureHandlerCommon';
4545
import {
46-
PanGestureStateChangeEvent,
46+
PanGestureEvent,
4747
usePanGesture,
4848
useTapGesture,
4949
} from '../v3/hooks/gestures';
@@ -434,7 +434,7 @@ const DrawerLayout = forwardRef<DrawerLayoutMethods, DrawerLayoutProps>(
434434
);
435435

436436
const handleRelease = useCallback(
437-
(event: PanGestureStateChangeEvent) => {
437+
(event: PanGestureEvent) => {
438438
'worklet';
439439
let { translationX: dragX, velocityX, x: touchX } = event;
440440

‎packages/react-native-gesture-handler/src/components/ReanimatedSwipeable/ReanimatedSwipeable.tsx‎

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -17,8 +17,7 @@ import {
1717
SwipeDirection,
1818
} from './ReanimatedSwipeableProps';
1919
import {
20-
PanGestureStateChangeEvent,
21-
PanGestureUpdateEvent,
20+
PanGestureEvent,
2221
usePanGesture,
2322
useTapGesture,
2423
} from '../../v3/hooks/gestures';
@@ -403,7 +402,7 @@ const Swipeable = (props: SwipeableProps) => {
403402
);
404403

405404
const handleRelease = useCallback(
406-
(event: PanGestureStateChangeEvent) => {
405+
(event: PanGestureEvent) => {
407406
'worklet';
408407
const { velocityX } = event;
409408
userDrag.value = event.translationX;
@@ -477,7 +476,7 @@ const Swipeable = (props: SwipeableProps) => {
477476
block: blocksExternalGesture,
478477
hitSlop: hitSlop,
479478
onActivate: updateElementWidths,
480-
onUpdate: (event: PanGestureUpdateEvent) => {
479+
onUpdate: (event: PanGestureEvent) => {
481480
'worklet';
482481
userDrag.value = event.translationX;
483482

@@ -501,7 +500,7 @@ const Swipeable = (props: SwipeableProps) => {
501500

502501
updateAnimatedEvent();
503502
},
504-
onDeactivate: (event: PanGestureStateChangeEvent) => {
503+
onDeactivate: (event: PanGestureEvent) => {
505504
'worklet';
506505
handleRelease(event);
507506
},

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

Lines changed: 13 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import {
77
StateChangeEventWithHandlerData,
88
} from '../../types';
99
import {
10-
flattenEvent,
10+
flattenAndFilterEvent,
1111
isEventForHandlerWithTag,
1212
maybeExtractNativeEvent,
1313
runCallback,
@@ -24,22 +24,23 @@ export function getStateChangeHandler<THandlerData>(
2424
const eventWithData = maybeExtractNativeEvent(
2525
sourceEvent
2626
) as GestureStateChangeEventWithHandlerData<THandlerData>;
27-
const event = flattenEvent(eventWithData);
27+
const event = flattenAndFilterEvent(eventWithData);
2828

29-
if (!isEventForHandlerWithTag(handlerTag, event)) {
29+
if (!isEventForHandlerWithTag(handlerTag, eventWithData)) {
3030
return;
3131
}
3232

33-
if (event.oldState === State.UNDETERMINED && event.state === State.BEGAN) {
33+
const { state, oldState } = eventWithData;
34+
35+
if (oldState === State.UNDETERMINED && state === State.BEGAN) {
3436
runCallback(CALLBACK_TYPE.BEGAN, callbacks, event);
3537
} else if (
36-
(event.oldState === State.BEGAN ||
37-
event.oldState === State.UNDETERMINED) &&
38-
event.state === State.ACTIVE
38+
(oldState === State.BEGAN || oldState === State.UNDETERMINED) &&
39+
state === State.ACTIVE
3940
) {
4041
runCallback(CALLBACK_TYPE.START, callbacks, event);
41-
} else if (event.oldState !== event.state && event.state === State.END) {
42-
if (event.oldState === State.ACTIVE) {
42+
} else if (oldState !== state && state === State.END) {
43+
if (oldState === State.ACTIVE) {
4344
runCallback(CALLBACK_TYPE.END, callbacks, event, true);
4445
}
4546
runCallback(CALLBACK_TYPE.FINALIZE, callbacks, event, true);
@@ -48,10 +49,10 @@ export function getStateChangeHandler<THandlerData>(
4849
context.lastUpdateEvent = undefined;
4950
}
5051
} else if (
51-
(event.state === State.FAILED || event.state === State.CANCELLED) &&
52-
event.state !== event.oldState
52+
(state === State.FAILED || state === State.CANCELLED) &&
53+
state !== oldState
5354
) {
54-
if (event.oldState === State.ACTIVE) {
55+
if (oldState === State.ACTIVE) {
5556
runCallback(CALLBACK_TYPE.END, callbacks, event, false);
5657
}
5758
runCallback(CALLBACK_TYPE.FINALIZE, callbacks, event, false);

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

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@ import {
88
UpdateEventWithHandlerData,
99
} from '../../types';
1010
import {
11-
flattenEvent,
11+
flattenAndFilterEvent,
1212
isEventForHandlerWithTag,
1313
maybeExtractNativeEvent,
1414
runCallback,
@@ -34,9 +34,9 @@ export function getUpdateHandler<THandlerData>(
3434
)
3535
: eventWithData;
3636

37-
const event = flattenEvent(eventWithChanges);
37+
const event = flattenAndFilterEvent(eventWithChanges);
3838

39-
if (!isEventForHandlerWithTag(handlerTag, event)) {
39+
if (!isEventForHandlerWithTag(handlerTag, eventWithData)) {
4040
return;
4141
}
4242

‎packages/react-native-gesture-handler/src/v3/hooks/gestures/fling/useFlingGesture.ts‎

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,7 @@ import {
44
SingleGesture,
55
SingleGestureName,
66
WithSharedValue,
7-
GestureStateChangeEvent,
8-
GestureUpdateEvent,
7+
GestureEvent,
98
} from '../../../types';
109
import { useGesture } from '../../useGesture';
1110
import { useClonedAndRemappedConfig } from '../../utils';
@@ -28,10 +27,7 @@ type FlingGestureInternalConfig = BaseDiscreteGestureConfig<
2827
export type FlingGestureConfig =
2928
ExcludeInternalConfigProps<FlingGestureInternalConfig>;
3029

31-
export type FlingGestureStateChangeEvent =
32-
GestureStateChangeEvent<FlingHandlerData>;
33-
34-
export type FlingGestureUpdateEvent = GestureUpdateEvent<FlingHandlerData>;
30+
export type FlingGestureEvent = GestureEvent<FlingHandlerData>;
3531

3632
export type FlingGesture = SingleGesture<
3733
FlingHandlerData,

‎packages/react-native-gesture-handler/src/v3/hooks/gestures/hover/useHoverGesture.ts‎

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,7 @@ import {
77
HandlerData,
88
SingleGestureName,
99
WithSharedValue,
10-
GestureStateChangeEvent,
11-
GestureUpdateEvent,
10+
GestureEvent,
1211
} from '../../../types';
1312
import { useGesture } from '../../useGesture';
1413
import {
@@ -40,10 +39,7 @@ type HoverGestureInternalConfig = BaseGestureConfig<
4039
export type HoverGestureConfig =
4140
ExcludeInternalConfigProps<HoverGestureInternalConfig>;
4241

43-
export type HoverGestureStateChangeEvent =
44-
GestureStateChangeEvent<HoverHandlerData>;
45-
46-
export type HoverGestureUpdateEvent = GestureUpdateEvent<HoverHandlerData>;
42+
export type HoverGestureEvent = GestureEvent<HoverHandlerData>;
4743

4844
export type HoverGesture = SingleGesture<
4945
HoverHandlerData,

‎packages/react-native-gesture-handler/src/v3/hooks/gestures/index.ts‎

Lines changed: 27 additions & 89 deletions
Original file line numberDiff line numberDiff line change
@@ -1,111 +1,59 @@
1+
import type { FlingGestureEvent, FlingGesture } from './fling/useFlingGesture';
2+
import type { HoverGestureEvent, HoverGesture } from './hover/useHoverGesture';
13
import type {
2-
FlingGestureStateChangeEvent,
3-
FlingGestureUpdateEvent,
4-
FlingGesture,
5-
} from './fling/useFlingGesture';
6-
import type {
7-
HoverGestureStateChangeEvent,
8-
HoverGestureUpdateEvent,
9-
HoverGesture,
10-
} from './hover/useHoverGesture';
11-
import type {
12-
LongPressGestureStateChangeEvent,
13-
LongPressGestureUpdateEvent,
4+
LongPressGestureEvent,
145
LongPressGesture,
156
} from './longPress/useLongPressGesture';
167
import type {
17-
ManualGestureStateChangeEvent,
18-
ManualGestureUpdateEvent,
8+
ManualGestureEvent,
199
ManualGesture,
2010
} from './manual/useManualGesture';
2111
import type {
22-
NativeGestureStateChangeEvent,
23-
NativeGestureUpdateEvent,
12+
NativeGestureEvent,
2413
NativeGesture,
2514
} from './native/useNativeGesture';
15+
import type { PanGestureEvent, PanGesture } from './pan/usePanGesture';
16+
import type { PinchGestureEvent, PinchGesture } from './pinch/usePinchGesture';
2617
import type {
27-
PanGestureStateChangeEvent,
28-
PanGestureUpdateEvent,
29-
PanGesture,
30-
} from './pan/usePanGesture';
31-
import type {
32-
PinchGestureStateChangeEvent,
33-
PinchGestureUpdateEvent,
34-
PinchGesture,
35-
} from './pinch/usePinchGesture';
36-
import type {
37-
RotationGestureStateChangeEvent,
38-
RotationGestureUpdateEvent,
18+
RotationGestureEvent,
3919
RotationGesture,
4020
} from './rotation/useRotationGesture';
41-
import type {
42-
TapGestureStateChangeEvent,
43-
TapGestureUpdateEvent,
44-
TapGesture,
45-
} from './tap/useTapGesture';
21+
import type { TapGestureEvent, TapGesture } from './tap/useTapGesture';
4622

4723
export type { TapGestureConfig } from './tap/useTapGesture';
48-
export type { TapGesture, TapGestureStateChangeEvent, TapGestureUpdateEvent };
24+
export type { TapGesture, TapGestureEvent };
4925
export { useTapGesture } from './tap/useTapGesture';
5026

5127
export type { FlingGestureConfig } from './fling/useFlingGesture';
52-
export type {
53-
FlingGesture,
54-
FlingGestureStateChangeEvent,
55-
FlingGestureUpdateEvent,
56-
};
28+
export type { FlingGesture, FlingGestureEvent };
5729
export { useFlingGesture } from './fling/useFlingGesture';
5830

5931
export type { LongPressGestureConfig } from './longPress/useLongPressGesture';
60-
export type {
61-
LongPressGesture,
62-
LongPressGestureStateChangeEvent,
63-
LongPressGestureUpdateEvent,
64-
};
32+
export type { LongPressGesture, LongPressGestureEvent };
6533
export { useLongPressGesture } from './longPress/useLongPressGesture';
6634

6735
export type { PinchGestureConfig } from './pinch/usePinchGesture';
68-
export type {
69-
PinchGesture,
70-
PinchGestureStateChangeEvent,
71-
PinchGestureUpdateEvent,
72-
};
36+
export type { PinchGesture, PinchGestureEvent };
7337
export { usePinchGesture } from './pinch/usePinchGesture';
7438

7539
export type { RotationGestureConfig } from './rotation/useRotationGesture';
76-
export type {
77-
RotationGesture,
78-
RotationGestureStateChangeEvent,
79-
RotationGestureUpdateEvent,
80-
};
40+
export type { RotationGesture, RotationGestureEvent };
8141
export { useRotationGesture } from './rotation/useRotationGesture';
8242

8343
export type { HoverGestureConfig } from './hover/useHoverGesture';
84-
export type {
85-
HoverGesture,
86-
HoverGestureStateChangeEvent,
87-
HoverGestureUpdateEvent,
88-
};
44+
export type { HoverGesture, HoverGestureEvent };
8945
export { useHoverGesture } from './hover/useHoverGesture';
9046

9147
export type { ManualGestureConfig } from './manual/useManualGesture';
92-
export type {
93-
ManualGesture,
94-
ManualGestureStateChangeEvent,
95-
ManualGestureUpdateEvent,
96-
};
48+
export type { ManualGesture, ManualGestureEvent };
9749
export { useManualGesture } from './manual/useManualGesture';
9850

9951
export type { NativeViewGestureConfig } from './native/useNativeGesture';
100-
export type {
101-
NativeGesture,
102-
NativeGestureStateChangeEvent,
103-
NativeGestureUpdateEvent,
104-
};
52+
export type { NativeGesture, NativeGestureEvent };
10553
export { useNativeGesture } from './native/useNativeGesture';
10654

10755
export type { PanGestureConfig } from './pan/usePanGesture';
108-
export type { PanGesture, PanGestureStateChangeEvent, PanGestureUpdateEvent };
56+
export type { PanGesture, PanGestureEvent };
10957
export { usePanGesture } from './pan/usePanGesture';
11058

11159
export type SingleGesture =
@@ -119,22 +67,12 @@ export type SingleGesture =
11967
| NativeGesture
12068
| PanGesture;
12169

122-
export type SingleGestureStateChangeEvent =
123-
| TapGestureStateChangeEvent
124-
| FlingGestureStateChangeEvent
125-
| LongPressGestureStateChangeEvent
126-
| RotationGestureStateChangeEvent
127-
| HoverGestureStateChangeEvent
128-
| ManualGestureStateChangeEvent
129-
| NativeGestureStateChangeEvent
130-
| PanGestureStateChangeEvent;
131-
132-
export type SingleGestureUpdateEvent =
133-
| TapGestureUpdateEvent
134-
| FlingGestureUpdateEvent
135-
| LongPressGestureUpdateEvent
136-
| RotationGestureUpdateEvent
137-
| HoverGestureUpdateEvent
138-
| ManualGestureUpdateEvent
139-
| NativeGestureUpdateEvent
140-
| PanGestureUpdateEvent;
70+
export type SingleGestureEvent =
71+
| TapGestureEvent
72+
| FlingGestureEvent
73+
| LongPressGestureEvent
74+
| RotationGestureEvent
75+
| HoverGestureEvent
76+
| ManualGestureEvent
77+
| NativeGestureEvent
78+
| PanGestureEvent;

‎packages/react-native-gesture-handler/src/v3/hooks/gestures/longPress/useLongPressGesture.ts‎

Lines changed: 2 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,7 @@ import {
44
SingleGesture,
55
SingleGestureName,
66
WithSharedValue,
7-
GestureStateChangeEvent,
8-
GestureUpdateEvent,
7+
GestureEvent,
98
} from '../../../types';
109
import { useGesture } from '../../useGesture';
1110
import { useClonedAndRemappedConfig } from '../../utils';
@@ -37,11 +36,7 @@ type LongPressGestureInternalConfig = BaseDiscreteGestureConfig<
3736
LongPressGestureInternalProperties
3837
>;
3938

40-
export type LongPressGestureStateChangeEvent =
41-
GestureStateChangeEvent<LongPressHandlerData>;
42-
43-
export type LongPressGestureUpdateEvent =
44-
GestureUpdateEvent<LongPressHandlerData>;
39+
export type LongPressGestureEvent = GestureEvent<LongPressHandlerData>;
4540

4641
export type LongPressGesture = SingleGesture<
4742
LongPressHandlerData,

‎packages/react-native-gesture-handler/src/v3/hooks/gestures/manual/useManualGesture.ts‎

Lines changed: 2 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,7 @@ import {
33
ExcludeInternalConfigProps,
44
SingleGesture,
55
SingleGestureName,
6-
GestureStateChangeEvent,
7-
GestureUpdateEvent,
6+
GestureEvent,
87
} from '../../../types';
98
import { useGesture } from '../../useGesture';
109
import { useClonedAndRemappedConfig } from '../../utils';
@@ -22,9 +21,7 @@ type ManualGestureInternalConfig = BaseGestureConfig<
2221
export type ManualGestureConfig =
2322
ExcludeInternalConfigProps<ManualGestureInternalConfig>;
2423

25-
export type ManualGestureStateChangeEvent =
26-
GestureStateChangeEvent<ManualHandlerData>;
27-
export type ManualGestureUpdateEvent = GestureUpdateEvent<ManualHandlerData>;
24+
export type ManualGestureEvent = GestureEvent<ManualHandlerData>;
2825

2926
export type ManualGesture = SingleGesture<
3027
ManualHandlerData,

0 commit comments

Comments
 (0)