Skip to content

Commit cff6bce

Browse files
m-bertm-bert
committed
Merge branch 'next' into @mbert/components-new-api
2 parents 5f7ec9c + 7feb18d commit cff6bce

36 files changed

Lines changed: 467 additions & 293 deletions

‎packages/react-native-gesture-handler/android/src/main/java/com/swmansion/gesturehandler/react/RNGestureHandlerModule.kt‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -61,14 +61,16 @@ class RNGestureHandlerModule(reactContext: ReactApplicationContext?) :
6161
}
6262

6363
@ReactMethod
64-
override fun createGestureHandler(handlerName: String, handlerTagDouble: Double, config: ReadableMap) {
64+
override fun createGestureHandler(handlerName: String, handlerTagDouble: Double, config: ReadableMap): Boolean {
6565
if (ReanimatedProxy.REANIMATED_INSTALLED && !uiRuntimeDecorated) {
6666
uiRuntimeDecorated = decorateUIRuntime()
6767
}
6868

6969
val handlerTag = handlerTagDouble.toInt()
7070

7171
createGestureHandlerHelper<GestureHandler>(handlerName, handlerTag, config)
72+
73+
return true
7274
}
7375

7476
@ReactMethod

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

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -119,7 +119,7 @@ - (bool)installUIRuntimeBindings
119119
});
120120
}
121121

122-
- (void)createGestureHandler:(NSString *)handlerName handlerTag:(double)handlerTag config:(NSDictionary *)config
122+
- (NSNumber *)createGestureHandler:(NSString *)handlerName handlerTag:(double)handlerTag config:(NSDictionary *)config
123123
{
124124
if (!_checkedIfReanimatedIsAvailable) {
125125
_isReanimatedAvailable = [self.moduleRegistry moduleForName:"ReanimatedModule"] != nil;
@@ -129,9 +129,10 @@ - (void)createGestureHandler:(NSString *)handlerName handlerTag:(double)handlerT
129129
_uiRuntimeDecorated = [self installUIRuntimeBindings];
130130
}
131131

132-
[self addOperationBlock:^(RNGestureHandlerManager *manager) {
133-
[manager createGestureHandler:handlerName tag:[NSNumber numberWithDouble:handlerTag] config:config];
134-
}];
132+
RNGestureHandlerManager *manager = [RNGestureHandlerModule handlerManagerForModuleId:_moduleId];
133+
[manager createGestureHandler:handlerName tag:[NSNumber numberWithDouble:handlerTag] config:config];
134+
135+
return @1;
135136
}
136137

137138
- (void)attachGestureHandler:(double)handlerTag newView:(double)viewTag actionType:(double)actionType

‎packages/react-native-gesture-handler/src/__tests__/RelationsTraversal.test.tsx‎

Lines changed: 46 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,9 @@
11
import { tagMessage } from '../utils';
2-
import { useExclusive, useRace, useSimultaneous } from '../v3/hooks/relations';
2+
import {
3+
useExclusiveGestures,
4+
useMultipleGestures,
5+
useSimultaneousGestures,
6+
} from '../v3/hooks/composition';
37
import { useGesture } from '../v3/hooks/useGesture';
48
import { configureRelations } from '../v3/detectors/utils';
59
import { SingleGesture, SingleGestureName } from '../v3/types';
@@ -27,24 +31,26 @@ describe('Ensure only one leaf node', () => {
2731
);
2832

2933
test('useSimultaneous', () => {
30-
expect(() => useSimultaneous(pan1, pan1)).toThrow(errorMessage);
34+
expect(() => useSimultaneousGestures(pan1, pan1)).toThrow(errorMessage);
3135
});
3236

3337
test('useExclusive', () => {
34-
expect(() => useExclusive(pan1, pan1)).toThrow(errorMessage);
38+
expect(() => useExclusiveGestures(pan1, pan1)).toThrow(errorMessage);
3539
});
3640

3741
test('useRace', () => {
38-
expect(() => useRace(pan1, pan1)).toThrow(errorMessage);
42+
expect(() => useMultipleGestures(pan1, pan1)).toThrow(errorMessage);
3943
});
4044

4145
test('Complex composition', () => {
42-
const exclusive1 = renderHook(() => useExclusive(pan1, pan2)).result
46+
const exclusive1 = renderHook(() => useExclusiveGestures(pan1, pan2)).result
4347
.current;
44-
const exclusive2 = renderHook(() => useExclusive(pan1, pan3)).result
48+
const exclusive2 = renderHook(() => useExclusiveGestures(pan1, pan3)).result
4549
.current;
4650

47-
expect(() => useSimultaneous(exclusive1, exclusive2)).toThrow(errorMessage);
51+
expect(() => useSimultaneousGestures(exclusive1, exclusive2)).toThrow(
52+
errorMessage
53+
);
4854
});
4955
});
5056

@@ -62,8 +68,9 @@ describe('Simple relations', () => {
6268
});
6369

6470
test('useSimultaneous', () => {
65-
const composedGesture = renderHook(() => useSimultaneous(pan1, pan2)).result
66-
.current;
71+
const composedGesture = renderHook(() =>
72+
useSimultaneousGestures(pan1, pan2)
73+
).result.current;
6774

6875
configureRelations(composedGesture);
6976

@@ -76,8 +83,8 @@ describe('Simple relations', () => {
7683
});
7784

7885
test('useExclusive', () => {
79-
const composedGesture = renderHook(() => useExclusive(pan2, pan1)).result
80-
.current;
86+
const composedGesture = renderHook(() => useExclusiveGestures(pan2, pan1))
87+
.result.current;
8188

8289
configureRelations(composedGesture);
8390

@@ -86,8 +93,8 @@ describe('Simple relations', () => {
8693
});
8794

8895
test('useRace', () => {
89-
const composedGesture = renderHook(() => useRace(pan1, pan2)).result
90-
.current;
96+
const composedGesture = renderHook(() => useMultipleGestures(pan1, pan2))
97+
.result.current;
9198

9299
configureRelations(composedGesture);
93100

@@ -222,10 +229,13 @@ describe('Complex relations', () => {
222229

223230
// Test case from description of https://github.com/software-mansion/react-native-gesture-handler/pull/3693
224231
test('Case 1', () => {
225-
const E2 = renderHook(() => useExclusive(tap1, tap2)).result.current;
226-
const S1 = renderHook(() => useSimultaneous(E2, pan1)).result.current;
227-
const S2 = renderHook(() => useSimultaneous(pan2, pan3)).result.current;
228-
const E1 = renderHook(() => useExclusive(S1, S2)).result.current;
232+
const E2 = renderHook(() => useExclusiveGestures(tap1, tap2)).result
233+
.current;
234+
const S1 = renderHook(() => useSimultaneousGestures(E2, pan1)).result
235+
.current;
236+
const S2 = renderHook(() => useSimultaneousGestures(pan2, pan3)).result
237+
.current;
238+
const E1 = renderHook(() => useExclusiveGestures(S1, S2)).result.current;
229239

230240
configureRelations(E1);
231241

@@ -264,10 +274,10 @@ describe('Complex relations', () => {
264274
});
265275

266276
test('Case 2', () => {
267-
const simultaneous = renderHook(() => useSimultaneous(pan1, pan2)).result
268-
.current;
269-
const exclusive = renderHook(() => useExclusive(tap1, simultaneous)).result
270-
.current;
277+
const simultaneous = renderHook(() => useSimultaneousGestures(pan1, pan2))
278+
.result.current;
279+
const exclusive = renderHook(() => useExclusiveGestures(tap1, simultaneous))
280+
.result.current;
271281

272282
configureRelations(exclusive);
273283

@@ -286,8 +296,8 @@ describe('Complex relations', () => {
286296
});
287297

288298
test('Case 3', () => {
289-
const exclusive = renderHook(() => useExclusive(tap1, tap2, tap3)).result
290-
.current;
299+
const exclusive = renderHook(() => useExclusiveGestures(tap1, tap2, tap3))
300+
.result.current;
291301

292302
configureRelations(exclusive);
293303

@@ -335,9 +345,11 @@ describe('Complex relations with external gestures', () => {
335345
})
336346
).result.current;
337347

338-
const S1 = renderHook(() => useSimultaneous(pan1, pan2)).result.current;
339-
const S2 = renderHook(() => useSimultaneous(pan3, pan4)).result.current;
340-
const E = renderHook(() => useExclusive(S1, S2)).result.current;
348+
const S1 = renderHook(() => useSimultaneousGestures(pan1, pan2)).result
349+
.current;
350+
const S2 = renderHook(() => useSimultaneousGestures(pan3, pan4)).result
351+
.current;
352+
const E = renderHook(() => useExclusiveGestures(S1, S2)).result.current;
341353

342354
configureRelations(pan5);
343355
configureRelations(E);
@@ -408,8 +420,8 @@ describe('Complex relations with external gestures', () => {
408420
})
409421
).result.current;
410422

411-
const E = renderHook(() => useExclusive(pan1, pan2)).result.current;
412-
const S = renderHook(() => useSimultaneous(E, pan3)).result.current;
423+
const E = renderHook(() => useExclusiveGestures(pan1, pan2)).result.current;
424+
const S = renderHook(() => useSimultaneousGestures(E, pan3)).result.current;
413425

414426
configureRelations(pan4);
415427
configureRelations(pan5);
@@ -460,8 +472,9 @@ describe('External relations with composed gestures', () => {
460472
})
461473
).result.current;
462474

463-
const composedGesture = renderHook(() => useSimultaneous(pan1, pan2)).result
464-
.current;
475+
const composedGesture = renderHook(() =>
476+
useSimultaneousGestures(pan1, pan2)
477+
).result.current;
465478

466479
const pan3 = renderHook(() =>
467480
useGesture(SingleGestureName.Pan, {
@@ -497,8 +510,9 @@ describe('External relations with composed gestures', () => {
497510
})
498511
).result.current;
499512

500-
const composedGesture = renderHook(() => useSimultaneous(pan1, pan2)).result
501-
.current;
513+
const composedGesture = renderHook(() =>
514+
useSimultaneousGestures(pan1, pan2)
515+
).result.current;
502516

503517
const pan3 = renderHook(() =>
504518
useGesture(SingleGestureName.Pan, {

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

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -436,7 +436,7 @@ const DrawerLayout = forwardRef<DrawerLayoutMethods, DrawerLayoutProps>(
436436
const handleRelease = useCallback(
437437
(event: PanGestureStateChangeEvent) => {
438438
'worklet';
439-
let { translationX: dragX, velocityX, x: touchX } = event.handlerData;
439+
let { translationX: dragX, velocityX, x: touchX } = event;
440440

441441
if (drawerPosition !== DrawerPosition.LEFT) {
442442
// See description in _updateAnimatedEvent about why events are flipped
@@ -550,19 +550,19 @@ const DrawerLayout = forwardRef<DrawerLayoutMethods, DrawerLayoutProps>(
550550
'worklet';
551551
const startedOutsideTranslation = isFromLeft
552552
? interpolate(
553-
event.handlerData.x,
553+
event.x,
554554
[0, drawerWidth, drawerWidth + 1],
555555
[0, drawerWidth, drawerWidth]
556556
)
557557
: interpolate(
558-
event.handlerData.x - containerWidth,
558+
event.x - containerWidth,
559559
[-drawerWidth - 1, -drawerWidth, 0],
560560
[drawerWidth, drawerWidth, 0]
561561
);
562562

563563
const startedInsideTranslation =
564564
sideCorrection *
565-
(event.handlerData.translationX +
565+
(event.translationX +
566566
(drawerOpened ? drawerWidth * -gestureOrientation : 0));
567567

568568
const adjustedTranslation = Math.max(

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

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -405,8 +405,8 @@ const Swipeable = (props: SwipeableProps) => {
405405
const handleRelease = useCallback(
406406
(event: PanGestureStateChangeEvent) => {
407407
'worklet';
408-
const { velocityX } = event.handlerData;
409-
userDrag.value = event.handlerData.translationX;
408+
const { velocityX } = event;
409+
userDrag.value = event.translationX;
410410

411411
const leftThresholdProp = leftThreshold ?? leftWidth.value / 2;
412412
const rightThresholdProp = rightThreshold ?? rightWidth.value / 2;
@@ -479,14 +479,14 @@ const Swipeable = (props: SwipeableProps) => {
479479
onStart: updateElementWidths,
480480
onUpdate: (event: PanGestureUpdateEvent) => {
481481
'worklet';
482-
userDrag.value = event.handlerData.translationX;
482+
userDrag.value = event.translationX;
483483

484484
const direction =
485485
rowState.value === -1
486486
? SwipeDirection.RIGHT
487487
: rowState.value === 1
488488
? SwipeDirection.LEFT
489-
: event.handlerData.translationX > 0
489+
: event.translationX > 0
490490
? SwipeDirection.RIGHT
491491
: SwipeDirection.LEFT;
492492

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

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,12 @@ import { ComponentClass } from 'react';
22
import { tagMessage } from '../../utils';
33
import {
44
GestureCallbacks,
5-
GestureUpdateEvent,
5+
GestureUpdateEventWithHandlerData,
66
SharedValue,
77
} from '../../v3/types';
88

99
export type ReanimatedContext<THandlerData> = {
10-
lastUpdateEvent: GestureUpdateEvent<THandlerData> | undefined;
10+
lastUpdateEvent: GestureUpdateEventWithHandlerData<THandlerData> | undefined;
1111
};
1212

1313
interface WorkletProps {
@@ -24,6 +24,11 @@ type WorkletFunction<
2424
TReturn = unknown,
2525
> = ((...args: TArgs) => TReturn) & WorkletProps;
2626

27+
export type ReanimatedHandler<THandlerData> = {
28+
doDependenciesDiffer: boolean;
29+
context: ReanimatedContext<THandlerData>;
30+
};
31+
2732
let Reanimated:
2833
| {
2934
default: {
@@ -33,10 +38,9 @@ let Reanimated:
3338
options?: unknown
3439
): ComponentClass<P>;
3540
};
36-
useHandler: <THandlerData>(handlers: GestureCallbacks<THandlerData>) => {
37-
doDependenciesDiffer: boolean;
38-
context: ReanimatedContext<THandlerData>;
39-
};
41+
useHandler: <THandlerData>(
42+
handlers: GestureCallbacks<THandlerData>
43+
) => ReanimatedHandler<THandlerData>;
4044
useEvent: <T>(
4145
callback: (event: T) => void,
4246
events: string[],

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

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -62,15 +62,26 @@ export function findNodeHandle(
6262
}
6363
return findNodeHandleRN(node) ?? null;
6464
}
65+
66+
let scheduledOperations: (() => void)[] = [];
6567
let flushOperationsScheduled = false;
6668

6769
export function scheduleFlushOperations() {
6870
if (!flushOperationsScheduled) {
6971
flushOperationsScheduled = true;
7072
ghQueueMicrotask(() => {
73+
for (const operation of scheduledOperations) {
74+
operation();
75+
}
76+
scheduledOperations = [];
7177
RNGestureHandlerModule.flushOperations();
7278

7379
flushOperationsScheduled = false;
7480
});
7581
}
7682
}
83+
84+
export function scheduleOperationToBeFlushed(operation: () => void) {
85+
scheduledOperations.push(operation);
86+
scheduleFlushOperations();
87+
}

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

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -159,8 +159,7 @@ export {
159159
VirtualGestureDetector,
160160
} from './v3/detectors';
161161

162-
export * from './v3/hooks/useGesture';
163-
export * from './v3/hooks/relations';
162+
export * from './v3/hooks/composition';
164163

165164
export type { ComposedGesture } from './v3/types';
166165
export type { GestureTouchEvent as SingleGestureTouchEvent } from './handlers/gestureHandlerCommon';

‎packages/react-native-gesture-handler/src/specs/NativeRNGestureHandlerModule.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ export interface Spec extends TurboModule {
1010
// Record<> is not supported by codegen
1111
// eslint-disable-next-line @typescript-eslint/ban-types
1212
config: Object
13-
) => void;
13+
) => boolean;
1414
attachGestureHandler: (
1515
handlerTag: Double,
1616
newView: Double,

0 commit comments

Comments
 (0)