Fix LegacyPressable#4016
Conversation
| * Invoked on mount and layout changes. | ||
| */ | ||
| onLayout?: (event: LayoutChangeEvent) => void; | ||
| onLayout?: ((event: LayoutChangeEvent) => void) | undefined; |
There was a problem hiding this comment.
Pull request overview
This PR restores LegacyPressable behavior by switching it back to using the underlying (older) button implementation, and adjusts web exports to avoid crashes stemming from default-vs-named export differences.
Changes:
- Update
LegacyPressableto useGestureHandlerButton’s underlyingButtonComponentinstead of the newer wrapper implementation. - Export
ButtonComponentfromGestureHandlerButton(native) and align web exports to support named imports. - Fix the common-app buttons example to report
onPresscorrectly.
Reviewed changes
Copilot reviewed 4 out of 4 changed files in this pull request and generated 1 comment.
| File | Description |
|---|---|
| packages/react-native-gesture-handler/src/components/Pressable/Pressable.tsx | Switches LegacyPressable to use the underlying ButtonComponent to restore legacy behavior. |
| packages/react-native-gesture-handler/src/components/GestureHandlerButton.web.tsx | Introduces named export + default export alignment for web button component. |
| packages/react-native-gesture-handler/src/components/GestureHandlerButton.tsx | Exposes the underlying native ButtonComponent for internal reuse (e.g., by LegacyPressable). |
| apps/common-app/src/new_api/components/buttons/index.tsx | Fixes example feedback string so onPress doesn’t report as onLongPress. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
akwasniewski
left a comment
There was a problem hiding this comment.
Looks good.
However, can we choose this opportunity to change button component import names in Pressable? Currently ButtonComponent is imported as
| ViewStyle, | ||
| } from 'react-native'; | ||
| import NativeButton from '../GestureHandlerButton'; | ||
| import { ButtonComponent as NativeButton } from '../GestureHandlerButton'; |
There was a problem hiding this comment.
Just a remark, you don't have to change it if you don't think it's necessary: I think it would be sensible to simply change the name of the ButtonComponent to NativeButton. Also after changes in the ../GestureHandlerButton, the Button imported in the v3 version is the wrapped one, thus aliasing it as PureNativeButton seems weird, we can just remove the alias.
There was a problem hiding this comment.
I think we can leave it as it is for now and leave those renames for other PRs. This one already grew bigger than I expected 😅
Description
LegacyPressabledoes not work as underlying button implementation had changed. Because previous button is still accessible, I've changedLegacyPressableto use it instead of new one, bringing back old behavior.On web it required some changes as buttons are exported as
export default, so simply changing non-web button and import inPressablecaused crash on web.I've also removed
forwardedReffrom web button and fixed button example so it doesn't always indicateonLongPress.Test plan
Tested on expo-example, on examples with
PressableandButtonsexample