Skip to content

Commit 08b5853

Browse files
G07chaj-piasecki
andauthored
fix: export Touchable* component props (#2556)
## Description Touchable* components contain types that aren't compatible with React Native's it might be necessary for consumer to import and use them instead. ## Test plan Compiled my branch and tested imports with `lib` output. --------- Co-authored-by: Jakub Piasecki <jakubpiasecki67@gmail.com>
1 parent 8bbef20 commit 08b5853

File tree

6 files changed

+28
-15
lines changed

6 files changed

+28
-15
lines changed

src/components/touchables/TouchableHighlight.tsx

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import GenericTouchable, {
77
import {
88
StyleSheet,
99
View,
10-
TouchableHighlightProps,
10+
TouchableHighlightProps as RNTouchableHighlightProps,
1111
ColorValue,
1212
ViewProps,
1313
} from 'react-native';
@@ -21,11 +21,14 @@ interface State {
2121
};
2222
}
2323

24+
export type TouchableHighlightProps = RNTouchableHighlightProps &
25+
GenericTouchableProps;
26+
2427
/**
2528
* TouchableHighlight follows RN's implementation
2629
*/
2730
export default class TouchableHighlight extends Component<
28-
TouchableHighlightProps & GenericTouchableProps,
31+
TouchableHighlightProps,
2932
State
3033
> {
3134
static defaultProps = {
@@ -35,7 +38,7 @@ export default class TouchableHighlight extends Component<
3538
underlayColor: 'black',
3639
};
3740

38-
constructor(props: TouchableHighlightProps & GenericTouchableProps) {
41+
constructor(props: TouchableHighlightProps) {
3942
super(props);
4043
this.state = {
4144
extraChildStyle: null,

src/components/touchables/TouchableNativeFeedback.android.tsx

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import {
22
Platform,
3-
TouchableNativeFeedbackProps,
3+
TouchableNativeFeedbackProps as RNTouchableNativeFeedbackProps,
44
ColorValue,
55
} from 'react-native';
66
import * as React from 'react';
@@ -14,15 +14,16 @@ export type TouchableNativeFeedbackExtraProps = {
1414
foreground?: boolean;
1515
};
1616

17+
export type TouchableNativeFeedbackProps = RNTouchableNativeFeedbackProps &
18+
GenericTouchableProps;
19+
1720
/**
1821
* TouchableNativeFeedback behaves slightly different than RN's TouchableNativeFeedback.
1922
* There's small difference with handling long press ripple since RN's implementation calls
2023
* ripple animation via bridge. This solution leaves all animations' handling for native components so
2124
* it follows native behaviours.
2225
*/
23-
export default class TouchableNativeFeedback extends Component<
24-
TouchableNativeFeedbackProps & GenericTouchableProps
25-
> {
26+
export default class TouchableNativeFeedback extends Component<TouchableNativeFeedbackProps> {
2627
static defaultProps = {
2728
...GenericTouchable.defaultProps,
2829
useForeground: true,

src/components/touchables/TouchableOpacity.tsx

Lines changed: 6 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import {
33
Easing,
44
StyleSheet,
55
View,
6-
TouchableOpacityProps,
6+
TouchableOpacityProps as RNTouchableOpacityProps,
77
} from 'react-native';
88
import GenericTouchable, {
99
TOUCHABLE_STATE,
@@ -12,16 +12,15 @@ import GenericTouchable, {
1212
import * as React from 'react';
1313
import { Component } from 'react';
1414

15-
interface GHTouchableOpacityProps {
16-
useNativeAnimations?: boolean;
17-
}
15+
export type TouchableOpacityProps = RNTouchableOpacityProps &
16+
GenericTouchableProps & {
17+
useNativeAnimations?: boolean;
18+
};
1819

1920
/**
2021
* TouchableOpacity bases on timing animation which has been used in RN's core
2122
*/
22-
export default class TouchableOpacity extends Component<
23-
TouchableOpacityProps & GenericTouchableProps & GHTouchableOpacityProps
24-
> {
23+
export default class TouchableOpacity extends Component<TouchableOpacityProps> {
2524
static defaultProps = {
2625
...GenericTouchable.defaultProps,
2726
activeOpacity: 0.2,

src/components/touchables/TouchableWithoutFeedback.tsx

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,10 @@ import * as React from 'react';
22
import { PropsWithChildren } from 'react';
33
import GenericTouchable, { GenericTouchableProps } from './GenericTouchable';
44

5+
export type TouchableWithoutFeedbackProps = GenericTouchable;
6+
57
const TouchableWithoutFeedback = React.forwardRef<
6-
GenericTouchable,
8+
TouchableWithoutFeedbackProps,
79
PropsWithChildren<GenericTouchableProps>
810
>((props, ref) => <GenericTouchable ref={ref} {...props} />);
911

src/components/touchables/index.ts

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,6 @@
1+
export type { TouchableHighlightProps } from './TouchableHighlight';
2+
export type { TouchableOpacityProps } from './TouchableOpacity';
3+
export type { TouchableWithoutFeedbackProps } from './TouchableWithoutFeedback';
14
export { default as TouchableNativeFeedback } from './TouchableNativeFeedback';
25
export { default as TouchableWithoutFeedback } from './TouchableWithoutFeedback';
36
export { default as TouchableOpacity } from './TouchableOpacity';

src/index.ts

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -94,6 +94,11 @@ export {
9494
BorderlessButton,
9595
PureNativeButton,
9696
} from './components/GestureButtons';
97+
export type {
98+
TouchableHighlightProps,
99+
TouchableOpacityProps,
100+
TouchableWithoutFeedbackProps,
101+
} from './components/touchables';
97102
export {
98103
TouchableHighlight,
99104
TouchableNativeFeedback,

0 commit comments

Comments
 (0)