Conversation
There was a problem hiding this comment.
Pull request overview
Updates Gesture Handler 3 migration and documentation content around button components, including a rewrite of the Buttons docs page and additional notes in the GH3 upgrade guide.
Changes:
- Reworked
buttons.mdxcontent/structure (addedRawButton, reorganized props, moved accessibility section). - Updated “Upgrading to 3” guide and migration skill docs with notes about legacy buttons /
PureNativeButton. - Minor formatting adjustments (spacing) in the GH3 migration skill doc.
Reviewed changes
Copilot reviewed 3 out of 3 changed files in this pull request and generated 6 comments.
| File | Description |
|---|---|
| skills/gesture-handler-3-migration/SKILL.md | Adds migration guidance around buttons and mentions PureNativeButton. |
| packages/docs-gesture-handler/docs/guides/upgrading-to-3.mdx | Updates upgrade guidance and legacy buttons mapping table. |
| packages/docs-gesture-handler/docs/components/buttons.mdx | Major rewrite/restructure of the Buttons documentation page. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
|
|
||
| The implementation of buttons has been updated, resolving most button-related issues. They have also been internally rewritten to utilize the new hook API. The legacy JS implementations of button components are still accessible but have been renamed with the prefix `Legacy`, e.g., `RectButton` is now available as `LegacyRectButton`. Those still use the new native component under the hood. | ||
|
|
||
| `PureNativeButton` has been removed. If encountered, inform the user that it has been removed and let them decide how to handle that case. They can achieve similar funcionality with other buttons. |
There was a problem hiding this comment.
We probably want to suggest possible solutions it can propose to the user
There was a problem hiding this comment.
I think it depends on their use case. Using PureNativeButton should be rare case anyway and I'm not sure if simply saying "change it to RawButton" will work, as it has Native gesture pre-applied. So I'm not sure if there's a panacea for that specific case. cc @j-piasecki
| - [`BorderlessButton`](#borderlessbutton) | ||
|
|
||
| On top of that all the buttons are wrapped with `NativeViewGestureHandler` and therefore allow for all the [common gesture handler properties](/docs/gestures/use-native-gesture#properties-common-to-all-gestures) and `NativeViewGestureHandler`'s [extra properties](/docs/gestures/use-native-gesture#properties-specific-to-nativegesture) to be applied to them. | ||
| On top of that all the buttons are wrapped with [`Native`](/docs/gestures/use-native-gesture) gesture and therefore allow for all its [properties](/docs/gestures/use-native-gesture#config) to be applied to them. |
There was a problem hiding this comment.
| On top of that all the buttons are wrapped with [`Native`](/docs/gestures/use-native-gesture) gesture and therefore allow for all its [properties](/docs/gestures/use-native-gesture#config) to be applied to them. | |
| On top of that all the buttons are wrapped with [`Native gesture`](/docs/gestures/use-native-gesture) and therefore allow for all its [properties](/docs/gestures/use-native-gesture#config) to be applied to them. |
| </GifGallery> | ||
|
|
||
| Gesture handler library provides native components that can act as buttons. These can be treated as a replacement to `TouchableHighlight` or `TouchableOpacity` from RN core. Gesture handler's buttons recognize touches in native which makes the recognition process deterministic, allows for rendering ripples on Android in highly performant way (`TouchableNativeFeedback` requires that touch event does a roundtrip to JS before we can update ripple effect, which makes ripples lag a bit on older phones), and provides native and platform default interaction for buttons that are placed in a scrollable container (in which case the interaction is slightly delayed to prevent button from highlighting when you fling). | ||
| The Gesture Handler library offers native components that function as buttons, serving as alternatives to `TouchableHighlight` or `TouchableOpacity` from the core React Native framework. These buttons process touch recognition natively, which ensures a deterministic response. This capability significantly enhances performance; for example, it allows for immediate ripple effects on Android, unlike `TouchableNativeFeedback`, which requires a touch event roundtrip to JavaScript that can cause delays, especially noticeable on older devices. Additionally, these components handle default platform interactions natively, particularly in scrollable containers where interactions are smartly delayed to prevent unintended highlighting during a fling. |
There was a problem hiding this comment.
Do we mention pressable anywhere? If not, then this may be the right place to do so.
There was a problem hiding this comment.
It has it's own docs page 😅
There was a problem hiding this comment.
Yes, but I think it still deserves to be mentioned in this introduction, after all it also functions as a button.
## Description This PR removes `PureNativeButton` from public API. > [!NOTE] > Docs for this are already present in #3968 ## Test plan Check that it is not possible to import it from package.
Description
This PR updates Buttons entry in docs.
Test plan
Read docs 🤓