• This is not a v0.x issue.
• I have searched the issues of this repository and believe that this is not a duplicate.

Expected Behavior 🤔

The slider should swallow the touch events to other parent controls cannot react to these events and to another action for the same interaction.

Current Behavior 😯

Currently, the events bubbles up to parent controls, which means that if the slider is inside a swipeable area, it will switch tabs instead of changing the value.

Steps to Reproduce 🕹

Link: https://codesandbox.io/s/7zz0209nr1

1. Take any control that listens and reacts to touch events
2. Place the slider inside
3. Try to change the value of the slider with touch gestures

Context 🔦

I'm building an app that has a simple tab control which is swipeable (as in the demo) and sliders inside to change settings. On mobile, it is not possible to use these sliders.

Your Environment 🌎

Addition

In Chrome on Windows, I get the error in the console, the same in Firefox.

react-dom.development.js:1575 [Intervention] Unable to preventDefault inside passive event listener due to target being treated as passive. See https://www.chromestatus.com/features/5093566007214080

I think that preventDefault() would prevent the bubbling of the event and maybe fix this bug and obviously it doesn't work.

Video