Skip to content

Commit a5fc2c6

Browse files
authored
[General] Rename gesture hooks to include Gesture suffix (#3828)
## Description Renames all gesture hooks so that they include `Gesture` suffix. While `usePinch` or `useLongPress` are relatively self-explanatory, `useNative` or `useManual` are confusing. ## Test plan Static checks
1 parent 2f5c443 commit a5fc2c6

File tree

14 files changed

+56
-50
lines changed

14 files changed

+56
-50
lines changed

apps/basic-example/src/NativeDetector.tsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { Animated, Button, useAnimatedValue } from 'react-native';
33
import {
44
GestureHandlerRootView,
55
GestureDetector,
6-
usePan,
6+
usePanGesture,
77
} from 'react-native-gesture-handler';
88

99
export default function App() {
@@ -17,7 +17,7 @@ export default function App() {
1717
}
1818
);
1919

20-
const gesture = usePan({
20+
const gesture = usePanGesture({
2121
onUpdate: event,
2222
});
2323

apps/basic-example/src/Text.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,27 +5,27 @@ import {
55
GestureDetector,
66
InterceptingGestureDetector,
77
VirtualGestureDetector,
8-
useTap,
8+
useTapGesture,
99
} from 'react-native-gesture-handler';
1010

1111
import { COLORS } from './colors';
1212

1313
function NativeDetectorExample() {
14-
const tapAll = useTap({
14+
const tapAll = useTapGesture({
1515
onStart: () => {
1616
'worklet';
1717
console.log('Tapped on text!');
1818
},
1919
});
2020

21-
const tapFirstPart = useTap({
21+
const tapFirstPart = useTapGesture({
2222
onStart: () => {
2323
'worklet';
2424
console.log('Tapped on first part!');
2525
},
2626
});
2727

28-
const tapSecondPart = useTap({
28+
const tapSecondPart = useTapGesture({
2929
onStart: () => {
3030
'worklet';
3131
console.log('Tapped on second part!');

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

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -44,8 +44,8 @@ import {
4444
} from '../handlers/gestureHandlerCommon';
4545
import {
4646
PanGestureStateChangeEvent,
47-
usePan,
48-
useTap,
47+
usePanGesture,
48+
useTapGesture,
4949
} from '../v3/hooks/gestures';
5050
import { GestureDetector } from '../v3/detectors';
5151

@@ -499,7 +499,7 @@ const DrawerLayout = forwardRef<DrawerLayoutMethods, DrawerLayoutProps>(
499499
[animateDrawer]
500500
);
501501

502-
const overlayDismissGesture = useTap({
502+
const overlayDismissGesture = useTapGesture({
503503
maxDistance: 25,
504504
onEnd: () => {
505505
'worklet';
@@ -522,7 +522,7 @@ const DrawerLayout = forwardRef<DrawerLayoutMethods, DrawerLayoutProps>(
522522
[drawerWidth, isFromLeft]
523523
);
524524

525-
const panGesture = usePan({
525+
const panGesture = usePanGesture({
526526
activeCursor: activeCursor,
527527
mouseButton: mouseButton,
528528
hitSlop: drawerOpened ? fillHitSlop : edgeHitSlop,

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

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -19,8 +19,8 @@ import {
1919
import {
2020
PanGestureStateChangeEvent,
2121
PanGestureUpdateEvent,
22-
usePan,
23-
useTap,
22+
usePanGesture,
23+
useTapGesture,
2424
} from '../../v3/hooks/gestures';
2525
import { GestureDetector } from '../../v3/detectors';
2626

@@ -454,7 +454,7 @@ const Swipeable = (props: SwipeableProps) => {
454454

455455
const dragStarted = useSharedValue<boolean>(false);
456456

457-
const tapGesture = useTap({
457+
const tapGesture = useTapGesture({
458458
shouldCancelWhenOutside: true,
459459
enabled: shouldEnableTap,
460460
simultaneousWith: simultaneousWithExternalGesture,
@@ -468,7 +468,7 @@ const Swipeable = (props: SwipeableProps) => {
468468
},
469469
});
470470

471-
const panGesture = usePan({
471+
const panGesture = usePanGesture({
472472
enabled: enabled !== false,
473473
enableTrackpadTwoFingerGesture: enableTrackpadTwoFingerGesture,
474474
activeOffsetX: [-dragOffsetFromRightEdge, dragOffsetFromLeftEdge],

packages/react-native-gesture-handler/src/v3/hooks/gestures/fling/useFling.ts renamed to packages/react-native-gesture-handler/src/v3/hooks/gestures/fling/useFlingGesture.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ export type FlingGesture = SingleGesture<
3838
FlingGestureProperties
3939
>;
4040

41-
export function useFling(config: FlingGestureConfig): FlingGesture {
41+
export function useFlingGesture(config: FlingGestureConfig): FlingGesture {
4242
const flingConfig = useClonedAndRemappedConfig<
4343
FlingHandlerData,
4444
FlingGestureProperties,

packages/react-native-gesture-handler/src/v3/hooks/gestures/hover/useHover.ts renamed to packages/react-native-gesture-handler/src/v3/hooks/gestures/hover/useHoverGesture.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -71,7 +71,7 @@ function transformHoverProps(
7171

7272
const HoverPropsMapping = new Map<string, string>();
7373

74-
export function useHover(config: HoverGestureConfig): HoverGesture {
74+
export function useHoverGesture(config: HoverGestureConfig): HoverGesture {
7575
const hoverConfig = useClonedAndRemappedConfig<
7676
HoverHandlerData,
7777
HoverGestureProperties,

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

Lines changed: 27 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -2,111 +2,111 @@ import type {
22
FlingGestureStateChangeEvent,
33
FlingGestureUpdateEvent,
44
FlingGesture,
5-
} from './fling/useFling';
5+
} from './fling/useFlingGesture';
66
import type {
77
HoverGestureStateChangeEvent,
88
HoverGestureUpdateEvent,
99
HoverGesture,
10-
} from './hover/useHover';
10+
} from './hover/useHoverGesture';
1111
import type {
1212
LongPressGestureStateChangeEvent,
1313
LongPressGestureUpdateEvent,
1414
LongPressGesture,
15-
} from './longPress/useLongPress';
15+
} from './longPress/useLongPressGesture';
1616
import type {
1717
ManualGestureStateChangeEvent,
1818
ManualGestureUpdateEvent,
1919
ManualGesture,
20-
} from './manual/useManual';
20+
} from './manual/useManualGesture';
2121
import type {
2222
NativeGestureStateChangeEvent,
2323
NativeGestureUpdateEvent,
2424
NativeGesture,
25-
} from './native/useNative';
25+
} from './native/useNativeGesture';
2626
import type {
2727
PanGestureStateChangeEvent,
2828
PanGestureUpdateEvent,
2929
PanGesture,
30-
} from './pan/usePan';
30+
} from './pan/usePanGesture';
3131
import type {
3232
PinchGestureStateChangeEvent,
3333
PinchGestureUpdateEvent,
3434
PinchGesture,
35-
} from './pinch/usePinch';
35+
} from './pinch/usePinchGesture';
3636
import type {
3737
RotationGestureStateChangeEvent,
3838
RotationGestureUpdateEvent,
3939
RotationGesture,
40-
} from './rotation/useRotation';
40+
} from './rotation/useRotationGesture';
4141
import type {
4242
TapGestureStateChangeEvent,
4343
TapGestureUpdateEvent,
4444
TapGesture,
45-
} from './tap/useTap';
45+
} from './tap/useTapGesture';
4646

47-
export type { TapGestureConfig } from './tap/useTap';
47+
export type { TapGestureConfig } from './tap/useTapGesture';
4848
export type { TapGesture, TapGestureStateChangeEvent, TapGestureUpdateEvent };
49-
export { useTap } from './tap/useTap';
49+
export { useTapGesture } from './tap/useTapGesture';
5050

51-
export type { FlingGestureConfig } from './fling/useFling';
51+
export type { FlingGestureConfig } from './fling/useFlingGesture';
5252
export type {
5353
FlingGesture,
5454
FlingGestureStateChangeEvent,
5555
FlingGestureUpdateEvent,
5656
};
57-
export { useFling } from './fling/useFling';
57+
export { useFlingGesture } from './fling/useFlingGesture';
5858

59-
export type { LongPressGestureConfig } from './longPress/useLongPress';
59+
export type { LongPressGestureConfig } from './longPress/useLongPressGesture';
6060
export type {
6161
LongPressGesture,
6262
LongPressGestureStateChangeEvent,
6363
LongPressGestureUpdateEvent,
6464
};
65-
export { useLongPress } from './longPress/useLongPress';
65+
export { useLongPressGesture } from './longPress/useLongPressGesture';
6666

67-
export type { PinchGestureConfig } from './pinch/usePinch';
67+
export type { PinchGestureConfig } from './pinch/usePinchGesture';
6868
export type {
6969
PinchGesture,
7070
PinchGestureStateChangeEvent,
7171
PinchGestureUpdateEvent,
7272
};
73-
export { usePinch } from './pinch/usePinch';
73+
export { usePinchGesture } from './pinch/usePinchGesture';
7474

75-
export type { RotationGestureConfig } from './rotation/useRotation';
75+
export type { RotationGestureConfig } from './rotation/useRotationGesture';
7676
export type {
7777
RotationGesture,
7878
RotationGestureStateChangeEvent,
7979
RotationGestureUpdateEvent,
8080
};
81-
export { useRotation } from './rotation/useRotation';
81+
export { useRotationGesture } from './rotation/useRotationGesture';
8282

83-
export type { HoverGestureConfig } from './hover/useHover';
83+
export type { HoverGestureConfig } from './hover/useHoverGesture';
8484
export type {
8585
HoverGesture,
8686
HoverGestureStateChangeEvent,
8787
HoverGestureUpdateEvent,
8888
};
89-
export { useHover } from './hover/useHover';
89+
export { useHoverGesture } from './hover/useHoverGesture';
9090

91-
export type { ManualGestureConfig } from './manual/useManual';
91+
export type { ManualGestureConfig } from './manual/useManualGesture';
9292
export type {
9393
ManualGesture,
9494
ManualGestureStateChangeEvent,
9595
ManualGestureUpdateEvent,
9696
};
97-
export { useManual } from './manual/useManual';
97+
export { useManualGesture } from './manual/useManualGesture';
9898

99-
export type { NativeViewGestureConfig } from './native/useNative';
99+
export type { NativeViewGestureConfig } from './native/useNativeGesture';
100100
export type {
101101
NativeGesture,
102102
NativeGestureStateChangeEvent,
103103
NativeGestureUpdateEvent,
104104
};
105-
export { useNative } from './native/useNative';
105+
export { useNativeGesture } from './native/useNativeGesture';
106106

107-
export type { PanGestureConfig } from './pan/usePan';
107+
export type { PanGestureConfig } from './pan/usePanGesture';
108108
export type { PanGesture, PanGestureStateChangeEvent, PanGestureUpdateEvent };
109-
export { usePan } from './pan/usePan';
109+
export { usePanGesture } from './pan/usePanGesture';
110110

111111
export type SingleGesture =
112112
| TapGesture

packages/react-native-gesture-handler/src/v3/hooks/gestures/longPress/useLongPress.ts renamed to packages/react-native-gesture-handler/src/v3/hooks/gestures/longPress/useLongPressGesture.ts

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -66,7 +66,9 @@ function transformLongPressProps(
6666
return config;
6767
}
6868

69-
export function useLongPress(config: LongPressGestureConfig): LongPressGesture {
69+
export function useLongPressGesture(
70+
config: LongPressGestureConfig
71+
): LongPressGesture {
7072
const longPressConfig = useClonedAndRemappedConfig<
7173
LongPressHandlerData,
7274
LongPressGestureProperties,

packages/react-native-gesture-handler/src/v3/hooks/gestures/manual/useManual.ts renamed to packages/react-native-gesture-handler/src/v3/hooks/gestures/manual/useManualGesture.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ export type ManualGesture = SingleGesture<
3131
ManualGestureProperties
3232
>;
3333

34-
export function useManual(config: ManualGestureConfig): ManualGesture {
34+
export function useManualGesture(config: ManualGestureConfig): ManualGesture {
3535
const manualConfig = useClonedAndRemappedConfig<
3636
ManualHandlerData,
3737
ManualGestureProperties,

packages/react-native-gesture-handler/src/v3/hooks/gestures/native/useNative.ts renamed to packages/react-native-gesture-handler/src/v3/hooks/gestures/native/useNativeGesture.ts

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,9 @@ export type NativeGesture = SingleGesture<
3737
NativeViewGestureProperties
3838
>;
3939

40-
export function useNative(config: NativeViewGestureConfig): NativeGesture {
40+
export function useNativeGesture(
41+
config: NativeViewGestureConfig
42+
): NativeGesture {
4143
const nativeConfig = useClonedAndRemappedConfig<
4244
NativeViewHandlerData,
4345
NativeViewGestureProperties,

0 commit comments

Comments
 (0)