Updated MotiPressable implementation to motified TouchableWithoutFeedback

[agrawal-rohit]

Description

• The box-shadow and elevation stylings do not work correctly with the use of containerStyle property in AnimatedTouchable. However, it does work with the regular style property.
• In addition to the above change, I've updated the entire component itself. I think maintaining 2 different style objects (for the parent and child) might lead to repeated stylings and confusion among people who want to add their own styling. Instead, I've wrapped the underlying Pressable and TouchableWithoutFeedback components with motify and used these as a replacement for the MotiView with a container.

Fixes #149

Type of change

Please delete options that are not relevant.

• Bug fix (non-breaking change which fixes an issue)
• This change requires a documentation update

[vercel]

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://vercel.com/fernandorojo/moti/3yCqPqNFyn5HTU3wgb8F6m2FEsgu
✅ Preview: https://moti-git-fork-agrawal-rohit-master-fernandorojo.vercel.app

[nandorojo]

maintaining two different nodes is important. you need to style the child of the element trapping events. otherwise, hovering an item and scaling it down could affect the actual hovering.

i know it’s a bit counterintuitive, but i separated these two functions purposefully. components shouldn’t animate their own hover/press states often.

take this button:

When you hover it, it changes its style. This change in style could then affect whether or not you're hovering it.

https://www.loom.com/share/fd413dc7a014403c9cf44680218ff830

MotiPressable gets around this by tracking the hover/press state of a container view, and then animating the view under it. Notice in this video that I'm moving the hover interaction to the div wrapping it, which fixes it, since the hoverable area never changes:

https://www.loom.com/share/cbbefe1b7e7f4efd8ff641700df89e08

I should probably add this to the docs to clarify the perspective.

[agrawal-rohit]

Ah I see, that makes sense. Does the use of containerStyle serve a special purpose for the element tracking events?