Skip to content

Commit b09afc0

Browse files
authored
[General] Replace enabled with disabled prop on Clickable (#4057)
## Description Replaces the existing `enabled` button with `disabled`. This aligns the API with RN's Pressable and seems more natural to use. ## Test plan Verify that the new prop works on existing examples.
1 parent d3631c4 commit b09afc0

3 files changed

Lines changed: 9 additions & 2 deletions

File tree

apps/common-app/src/new_api/components/touchable_stress/index.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -116,7 +116,7 @@ export default function TouchableStress() {
116116
activeUnderlayOpacity={0.105}
117117
style={[styles.startButton, isRunning && styles.startButtonBusy]}
118118
onPress={start}
119-
enabled={!isRunning}>
119+
disabled={isRunning}>
120120
<Text style={styles.startButtonText}>
121121
{isRunning ? `Running ${currentRun}/${N}...` : 'Start test'}
122122
</Text>

packages/react-native-gesture-handler/src/v3/components/Touchable/Touchable.tsx

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,7 @@ export const Touchable = (props: TouchableProps) => {
3030
onPressOut,
3131
onActiveStateChange,
3232
children,
33+
disabled = false,
3334
ref,
3435
...rest
3536
} = props;
@@ -115,6 +116,7 @@ export const Touchable = (props: TouchableProps) => {
115116
{...rest}
116117
{...rippleProps}
117118
ref={ref ?? null}
119+
enabled={!disabled}
118120
onBegin={onBegin}
119121
onActivate={onActivate}
120122
onDeactivate={onDeactivate}

packages/react-native-gesture-handler/src/v3/components/Touchable/TouchableProps.ts

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ type PressableAndroidRippleConfig = {
1515

1616
type RippleProps = 'rippleColor' | 'rippleRadius' | 'borderless' | 'foreground';
1717

18-
export type TouchableProps = Omit<ButtonProps, RippleProps> &
18+
export type TouchableProps = Omit<ButtonProps, RippleProps | 'enabled'> &
1919
Omit<BaseButtonProps, keyof RawButtonProps> & {
2020
/**
2121
* Configuration for the ripple effect on Android.
@@ -31,4 +31,9 @@ export type TouchableProps = Omit<ButtonProps, RippleProps> &
3131
* Called when pointer is released from the component.
3232
*/
3333
onPressOut?: ((event: CallbackEventType) => void) | undefined;
34+
35+
/**
36+
* Whether the component should ignore touches. By default set to false.
37+
*/
38+
disabled?: boolean | undefined;
3439
};

0 commit comments

Comments
 (0)