Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Create gesturized pressable component #2942

Merged
merged 149 commits into from
Jul 3, 2024
Merged

Create gesturized pressable component #2942

merged 149 commits into from
Jul 3, 2024

Conversation

latekvo
Copy link
Contributor

@latekvo latekvo commented Jun 12, 2024 •
edited by j-piasecki
Loading

This PR adds our own Pressable component

Closes #1221

@latekvo latekvo changed the title initial pressable component Crate gesturized pressable component Jun 13, 2024
j-piasecki
j-piasecki reviewed Jun 14, 2024
View reviewed changes
Pressable/package.json Outdated Show resolved Hide resolved
package.json Outdated Show resolved Hide resolved
src/components/Pressable.tsx Outdated Show resolved Hide resolved
src/components/Pressable.tsx Outdated Show resolved Hide resolved
src/components/Pressable.tsx Outdated Show resolved Hide resolved
src/components/Pressable.tsx Outdated Show resolved Hide resolved
src/components/Pressable.tsx Outdated Show resolved Hide resolved
src/components/Pressable.tsx Outdated Show resolved Hide resolved
src/components/Pressable.tsx Outdated Show resolved Hide resolved
src/components/Pressable.tsx Outdated Show resolved Hide resolved
@latekvo
Copy link
Contributor Author

latekvo commented Jun 14, 2024 •
edited
Loading

Original onBlur and onFocus:
Pressable defaults to blurred state.
When in blurred state, the first click on the pressable calls onFocus.
When in focused state, when the user clicks outside of Pressable, onBlur is called and blurred state is set.
Original onBlur and onFocus is only implemented on Web, and doesn't work on Android

@latekvo
Copy link
Contributor Author

latekvo commented Jun 14, 2024 •
edited
Loading

touchWithinBounds is still up for further investigation and i think i'll remove it all together in favour of dynamically changing hitSlop, if that'll be possible.
onFocus and onBlur still have to be implemented, it may be tricky as the pointer would have to be tracked outside of Pressable, it's likely I'll have to remove it all together, which may not be a big deal, as previously it was a web specific feature anyways.

Other Pressable features seem to all be implemented, but I'll be testing their alignment with the original some more.

What's up for discussion is compatibility with legacy events. None of them are possible to fully recreate within rngh, and they weren't too consistent across web / mobile, but they could be partially imitated to better reflect those returned by the original callbacks.

m-bert
m-bert approved these changes Jul 3, 2024
View reviewed changes
Copy link
Contributor

@m-bert m-bert left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good job! There are few things that we have to polish though - let's do this in follow ups 😅

src/components/Pressable/Pressable.tsx Outdated Show resolved Hide resolved
example/src/release_tests/gesturizedPressable/index.tsx Outdated Show resolved Hide resolved
@latekvo latekvo merged commit 4ce89e3 into main Jul 3, 2024
4 checks passed
@latekvo latekvo deleted the @latekvo/add_gesture_handler_pressable_implementation branch July 3, 2024 12:23
@latekvo latekvo restored the @latekvo/add_gesture_handler_pressable_implementation branch July 3, 2024 12:26
latekvo added a commit that referenced this pull request Jul 3, 2024
@latekvo
Revert "Create gesturized pressable component (#2942)"
5c1c833 
This reverts commit 4ce89e3.
@latekvo latekvo deleted the @latekvo/add_gesture_handler_pressable_implementation branch July 3, 2024 12:27
github-merge-queue bot referenced this pull request in valora-inc/wallet Aug 6, 2024
@renovate
fix(deps): update dependency react-native-gesture-handler to ^2.18.1 (#…
f5d0cdd 
…5714)

[![Mend
Renovate](https://app.renovatebot.com/images/banner.svg)](https://renovatebot.com)

This PR contains the following updates:

| Package | Change | Age | Adoption | Passing | Confidence |
|---|---|---|---|---|---|
|
[react-native-gesture-handler](https://github.com/software-mansion/react-native-gesture-handler)
| [`^2.17.1` ->
`^2.18.1`](https://renovatebot.com/diffs/npm/react-native-gesture-handler/2.17.1/2.18.1)
|
[![age](https://developer.mend.io/api/mc/badges/age/npm/react-native-gesture-handler/2.18.1?slim=true)](https://docs.renovatebot.com/merge-confidence/)
|
[![adoption](https://developer.mend.io/api/mc/badges/adoption/npm/react-native-gesture-handler/2.18.1?slim=true)](https://docs.renovatebot.com/merge-confidence/)
|
[![passing](https://developer.mend.io/api/mc/badges/compatibility/npm/react-native-gesture-handler/2.17.1/2.18.1?slim=true)](https://docs.renovatebot.com/merge-confidence/)
|
[![confidence](https://developer.mend.io/api/mc/badges/confidence/npm/react-native-gesture-handler/2.17.1/2.18.1?slim=true)](https://docs.renovatebot.com/merge-confidence/)
|

---

### Release Notes

<details>
<summary>software-mansion/react-native-gesture-handler
(react-native-gesture-handler)</summary>

###
[`v2.18.1`](https://github.com/software-mansion/react-native-gesture-handler/releases/tag/2.18.1)

[Compare
Source](https://github.com/software-mansion/react-native-gesture-handler/compare/2.18.0...2.18.1)

#### 🐛 Bug fixes

- Fix build on RN 0.74 by [@&#8203;m-bert](https://github.com/m-bert)
in
[https://github.com/software-mansion/react-native-gesture-handler/pull/3024](https://github.com/software-mansion/react-native-gesture-handler/pull/3024)

#### What's Changed

- Bump ws from 6.2.2 to 6.2.3 in /example by
[@&#8203;dependabot](https://github.com/dependabot) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/3003](https://github.com/software-mansion/react-native-gesture-handler/pull/3003)
- Bump requirejs from 2.3.6 to 2.3.7 by
[@&#8203;dependabot](https://github.com/dependabot) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/3009](https://github.com/software-mansion/react-native-gesture-handler/pull/3009)
- Bump fast-xml-parser from 4.2.5 to 4.4.1 by
[@&#8203;dependabot](https://github.com/dependabot) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/3016](https://github.com/software-mansion/react-native-gesture-handler/pull/3016)
- Bump ws from 6.2.2 to 6.2.3 in /docs by
[@&#8203;dependabot](https://github.com/dependabot) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/3021](https://github.com/software-mansion/react-native-gesture-handler/pull/3021)
- Add documentation page for `Pressable` component by
[@&#8203;latekvo](https://github.com/latekvo) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/2992](https://github.com/software-mansion/react-native-gesture-handler/pull/2992)
- Add docs page for Reanimated Swipeable by
[@&#8203;latekvo](https://github.com/latekvo) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/2962](https://github.com/software-mansion/react-native-gesture-handler/pull/2962)

**Full Changelog**:
software-mansion/react-native-gesture-handler@2.18.0...2.18.1

###
[`v2.18.0`](https://github.com/software-mansion/react-native-gesture-handler/releases/tag/2.18.0)

[Compare
Source](https://github.com/software-mansion/react-native-gesture-handler/compare/2.17.1...2.18.0)

#### ❗ Important changes

- Create a separate component out of the new Swipeable row by
[@&#8203;latekvo](https://github.com/latekvo) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/2936](https://github.com/software-mansion/react-native-gesture-handler/pull/2936)
- Create gesturized pressable component by
[@&#8203;latekvo](https://github.com/latekvo) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/2942](https://github.com/software-mansion/react-native-gesture-handler/pull/2942),
[https://github.com/software-mansion/react-native-gesture-handler/pull/2977](https://github.com/software-mansion/react-native-gesture-handler/pull/2977),
[https://github.com/software-mansion/react-native-gesture-handler/pull/2982](https://github.com/software-mansion/react-native-gesture-handler/pull/2982),
[https://github.com/software-mansion/react-native-gesture-handler/pull/2981](https://github.com/software-mansion/react-native-gesture-handler/pull/2981)
- Support for React Native 0.75 by
[@&#8203;j-piasecki](https://github.com/j-piasecki) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/2966](https://github.com/software-mansion/react-native-gesture-handler/pull/2966)

#### 👍 Improvements

- \[macOS] Add `ForceTouch` warning by
[@&#8203;m-bert](https://github.com/m-bert) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/2954](https://github.com/software-mansion/react-native-gesture-handler/pull/2954)
- Remove shared value read on the JS thread during detector update by
[@&#8203;j-piasecki](https://github.com/j-piasecki) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/2957](https://github.com/software-mansion/react-native-gesture-handler/pull/2957)
- Use a newer constructor for all Gesture Handler events on Android by
[@&#8203;j-piasecki](https://github.com/j-piasecki) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/2967](https://github.com/software-mansion/react-native-gesture-handler/pull/2967)
- Persist rotation and pinch gesture through pointer changes on android
by [@&#8203;coado](https://github.com/coado) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/2983](https://github.com/software-mansion/react-native-gesture-handler/pull/2983)
- \[macOS] Add `NativeViewGestureHandler` by
[@&#8203;m-bert](https://github.com/m-bert) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/3004](https://github.com/software-mansion/react-native-gesture-handler/pull/3004)
- Add `enabled` prop support to swipeable by
[@&#8203;latekvo](https://github.com/latekvo) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/3011](https://github.com/software-mansion/react-native-gesture-handler/pull/3011)

#### 🐛 Bug fixes

- Make handler comparator work only on non-null objects by
[@&#8203;j-piasecki](https://github.com/j-piasecki) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/2964](https://github.com/software-mansion/react-native-gesture-handler/pull/2964)
- fix: bind scope to null to prevent issues with inline requires by
[@&#8203;EvanBacon](https://github.com/EvanBacon) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/2972](https://github.com/software-mansion/react-native-gesture-handler/pull/2972)
- Replace `queueMicrotask` with `requestAnimationFrame` by
[@&#8203;m-bert](https://github.com/m-bert) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/2969](https://github.com/software-mansion/react-native-gesture-handler/pull/2969)
- Resolve circular dependencies on JS side by
[@&#8203;latekvo](https://github.com/latekvo) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/2970](https://github.com/software-mansion/react-native-gesture-handler/pull/2970)
- Fix Android native buttons emitting 2 press events when talkback is
enabled by [@&#8203;latekvo](https://github.com/latekvo) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/3002](https://github.com/software-mansion/react-native-gesture-handler/pull/3002)
- Fix `ScrollView` intercepting touches through out-of-bounds children
by [@&#8203;j-piasecki](https://github.com/j-piasecki) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/3017](https://github.com/software-mansion/react-native-gesture-handler/pull/3017)
- Change `onPress` argument in buttons by
[@&#8203;m-bert](https://github.com/m-bert) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/3006](https://github.com/software-mansion/react-native-gesture-handler/pull/3006)
- \[macOS] Fix handlers not responding after opening context menu by
[@&#8203;m-bert](https://github.com/m-bert) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/3008](https://github.com/software-mansion/react-native-gesture-handler/pull/3008)
- \[iOS | macOS] Fix translation calculation in `LongPress` by
[@&#8203;m-bert](https://github.com/m-bert) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/3013](https://github.com/software-mansion/react-native-gesture-handler/pull/3013)
- Fix cancelling manual activation gestures blocking interactivity on
iOS by [@&#8203;latekvo](https://github.com/latekvo) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/3007](https://github.com/software-mansion/react-native-gesture-handler/pull/3007)

#### 🔢 Miscellaneous

- Bump ws from 6.2.2 to 6.2.3 in /FabricExample by
[@&#8203;dependabot](https://github.com/dependabot) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/2949](https://github.com/software-mansion/react-native-gesture-handler/pull/2949)
- Bump braces from 3.0.2 to 3.0.3 in /MacOSExample by
[@&#8203;dependabot](https://github.com/dependabot) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/2956](https://github.com/software-mansion/react-native-gesture-handler/pull/2956)
- docs: bump `@swmansion/t-rex-ui` to 0.0.12 by
[@&#8203;patrycjakalinska](https://github.com/patrycjakalinska) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/2958](https://github.com/software-mansion/react-native-gesture-handler/pull/2958)
- Bump braces from 3.0.2 to 3.0.3 in /FabricExample by
[@&#8203;dependabot](https://github.com/dependabot) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/2965](https://github.com/software-mansion/react-native-gesture-handler/pull/2965)
- Set consistent prettier version across all package.jsons by
[@&#8203;latekvo](https://github.com/latekvo) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/2971](https://github.com/software-mansion/react-native-gesture-handler/pull/2971)
- Change naming scheme in package.json from camelCase to dash-case by
[@&#8203;latekvo](https://github.com/latekvo) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/2973](https://github.com/software-mansion/react-native-gesture-handler/pull/2973)
- Unify comments and simplify some conditions. by
[@&#8203;m-bert](https://github.com/m-bert) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/2984](https://github.com/software-mansion/react-native-gesture-handler/pull/2984)
- docs: Update Expo installation instructions by
[@&#8203;amandeepmittal](https://github.com/amandeepmittal) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/2991](https://github.com/software-mansion/react-native-gesture-handler/pull/2991)
- Bump fast-loops from 1.1.3 to 1.1.4 in /docs by
[@&#8203;dependabot](https://github.com/dependabot) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/2986](https://github.com/software-mansion/react-native-gesture-handler/pull/2986)
- Remove plural form in docs by
[@&#8203;m-bert](https://github.com/m-bert) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/2995](https://github.com/software-mansion/react-native-gesture-handler/pull/2995)
- Bump fast-loops from 1.1.3 to 1.1.4 in /example by
[@&#8203;dependabot](https://github.com/dependabot) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/2994](https://github.com/software-mansion/react-native-gesture-handler/pull/2994)
- Don't run old arch integrity check on every PR by
[@&#8203;j-piasecki](https://github.com/j-piasecki) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/2998](https://github.com/software-mansion/react-native-gesture-handler/pull/2998)
- docs: fix footer on landing by
[@&#8203;patrycjakalinska](https://github.com/patrycjakalinska) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/2997](https://github.com/software-mansion/react-native-gesture-handler/pull/2997)
- docs: Replace HireUsSection with `@swmansion/t-rex-ui` component by
[@&#8203;patrycjakalinska](https://github.com/patrycjakalinska) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/2996](https://github.com/software-mansion/react-native-gesture-handler/pull/2996)
- Mention `drawerWillShow` in `DrawerLayout` docs by
[@&#8203;m-bert](https://github.com/m-bert) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/3000](https://github.com/software-mansion/react-native-gesture-handler/pull/3000)
- chore: Refactor gradle task to JS scripts by
[@&#8203;maciekstosio](https://github.com/maciekstosio) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/3001](https://github.com/software-mansion/react-native-gesture-handler/pull/3001)
- Update dependencies related to tests by
[@&#8203;j-piasecki](https://github.com/j-piasecki) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/3005](https://github.com/software-mansion/react-native-gesture-handler/pull/3005)
- \[macOS] Switch `hasPointerInside` to `containsPointInView` by
[@&#8203;m-bert](https://github.com/m-bert) in
[https://github.com/software-mansion/react-native-gesture-handler/pull/3012](https://github.com/software-mansion/react-native-gesture-handler/pull/3012)

#### New Contributors

- [@&#8203;coado](https://github.com/coado) made their first
contribution in
[https://github.com/software-mansion/react-native-gesture-handler/pull/2983](https://github.com/software-mansion/react-native-gesture-handler/pull/2983)
- [@&#8203;amandeepmittal](https://github.com/amandeepmittal) made
their first contribution in
[https://github.com/software-mansion/react-native-gesture-handler/pull/2991](https://github.com/software-mansion/react-native-gesture-handler/pull/2991)

**Full Changelog**:
software-mansion/react-native-gesture-handler@2.17.0...2.18.0

</details>

---

### Configuration

📅 **Schedule**: Branch creation - "after 5pm,every weekend" in timezone
America/Los_Angeles, Automerge - "after 5pm,every weekend" in timezone
America/Los_Angeles.

🚦 **Automerge**: Enabled.

♻ **Rebasing**: Whenever PR becomes conflicted, or you tick the
rebase/retry checkbox.

🔕 **Ignore**: Close this PR and you won't be reminded about this update
again.

---

- [ ] <!-- rebase-check -->If you want to rebase/retry this PR, check
this box

---

This PR was generated by [Mend
Renovate](https://www.mend.io/free-developer-tools/renovate/). View the
[repository job
log](https://developer.mend.io/github/valora-inc/wallet).

<!--renovate-debug:eyJjcmVhdGVkSW5WZXIiOiIzNy40NDAuNyIsInVwZGF0ZWRJblZlciI6IjM3LjQ0MC43IiwidGFyZ2V0QnJhbmNoIjoibWFpbiIsImxhYmVscyI6WyJucG0iLCJyZW5vdmF0ZSJdfQ==-->

---------

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Co-authored-by: valora-bot <valorabot@valoraapp.com>
@2lambda123 2lambda123 mentioned this pull request Aug 21, 2024
Merged
@Cabreira97 Cabreira97 mentioned this pull request Aug 23, 2024
Open
@ColeCoffman ColeCoffman mentioned this pull request Aug 30, 2024
Open
@undrthegraveyard undrthegraveyard mentioned this pull request Sep 4, 2024
Closed
@Sachin-UI Sachin-UI mentioned this pull request Sep 9, 2024
Open
@AKJUS AKJUS mentioned this pull request Sep 12, 2024
Open
@ananichoumchoum ananichoumchoum mentioned this pull request Sep 13, 2024
Open
@AKJUS AKJUS mentioned this pull request Sep 13, 2024
Open
This was referenced Sep 14, 2024
Open
Open
This was referenced Sep 16, 2024
Open
Open
@Ruzzel-bcremit Ruzzel-bcremit mentioned this pull request Sep 18, 2024
Open
@AKJUS AKJUS mentioned this pull request Sep 19, 2024
Open
This was referenced Sep 20, 2024
Open
Open
@yingbull yingbull mentioned this pull request Sep 28, 2024
Open
@Adam-1052189 Adam-1052189 mentioned this pull request Sep 28, 2024
Open
@Alaa-1074002 Alaa-1074002 mentioned this pull request Sep 29, 2024
Open
@ColeCoffman ColeCoffman mentioned this pull request Oct 2, 2024
Open
@santiko santiko mentioned this pull request Oct 3, 2024
Open
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@j-piasecki j-piasecki j-piasecki left review comments

@m-bert m-bert m-bert approved these changes

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

Pressable API ?
3 participants
@latekvo @j-piasecki @m-bert