Skip to content

Commit 6c7481b

Browse files
authored
Hide incorrectly exposed ReanimatedSwipeable props. (#3820)
## Description As stated in [this comment](#3670 (comment)), some of the `ReanimatedSwipeable` props were incorrectly exposed. Most of them came from `BaseGestureHandlerProps`, but were not actually used in the implementation. I've updated `SwipeableProps` type to include only those that were actually used. I've also moved `hitSlop` from `Animated.View` to `Pan` gesture - it seems that it worked on `iOS`, but not on `android`. Closes #3670 ## Test plan Tested on the **"Swipeable reanimation"** example with `hitSlop={-20}` added.
1 parent cbd97db commit 6c7481b

2 files changed

Lines changed: 24 additions & 9 deletions

File tree

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

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -501,6 +501,7 @@ const Swipeable = (props: SwipeableProps) => {
501501
const panGesture = useMemo(() => {
502502
const pan = Gesture.Pan()
503503
.enabled(enabled !== false)
504+
.hitSlop(hitSlop)
504505
.enableTrackpadTwoFingerGesture(enableTrackpadTwoFingerGesture)
505506
.activeOffsetX([-dragOffsetFromRightEdge, dragOffsetFromLeftEdge])
506507
.onStart(updateElementWidths)
@@ -547,6 +548,7 @@ const Swipeable = (props: SwipeableProps) => {
547548
return pan;
548549
}, [
549550
enabled,
551+
hitSlop,
550552
enableTrackpadTwoFingerGesture,
551553
dragOffsetFromRightEdge,
552554
dragOffsetFromLeftEdge,
@@ -576,7 +578,6 @@ const Swipeable = (props: SwipeableProps) => {
576578
<Animated.View
577579
{...remainingProps}
578580
onLayout={onRowLayout}
579-
hitSlop={hitSlop ?? undefined}
580581
style={[styles.container, containerStyle]}>
581582
{leftElement()}
582583
{rightElement()}

packages/react-native-gesture-handler/src/components/ReanimatedSwipeable/ReanimatedSwipeableProps.ts

Lines changed: 22 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,40 @@
11
import React from 'react';
2-
import type { PanGestureHandlerProps } from '../../handlers/PanGestureHandler';
32
import { SharedValue } from 'react-native-reanimated';
43
import { StyleProp, ViewStyle } from 'react-native';
54
import { RelationPropType } from '../utils';
6-
7-
type SwipeableExcludes = Exclude<
8-
keyof PanGestureHandlerProps,
9-
'onGestureEvent' | 'onHandlerStateChange'
10-
>;
5+
import { HitSlop } from '../../handlers/gestureHandlerCommon';
116

127
export enum SwipeDirection {
138
LEFT = 'left',
149
RIGHT = 'right',
1510
}
1611

17-
export interface SwipeableProps
18-
extends Pick<PanGestureHandlerProps, SwipeableExcludes> {
12+
export interface SwipeableProps {
1913
/**
2014
*
2115
*/
2216
ref?: React.RefObject<SwipeableMethods | null>;
2317

18+
/**
19+
* Sets a `testID` property, allowing for querying `ReanimatedSwipeable` for it in tests.
20+
*/
21+
testID?: string;
22+
23+
children?: React.ReactNode;
24+
25+
/**
26+
* Indicates whether `ReanimatedSwipeable` should be analyzing stream of touch events or not.
27+
* @see https://docs.swmansion.com/react-native-gesture-handler/docs/gestures/pan-gesture#enabledvalue-boolean
28+
*/
29+
enabled?: boolean;
30+
31+
/**
32+
* This parameter enables control over what part of the connected view area can be used to begin recognizing the gesture.
33+
* When a negative number is provided the bounds of the view will reduce the area by the given number of points in each of the sides evenly.
34+
* @see https://docs.swmansion.com/react-native-gesture-handler/docs/gestures/pan-gesture#hitslopsettings
35+
*/
36+
hitSlop?: HitSlop;
37+
2438
/**
2539
* Enables two-finger gestures on supported devices, for example iPads with
2640
* trackpads. If not enabled the gesture will require click + drag, with

0 commit comments

Comments
 (0)