Issue: Tooltip interaction conflicts with parent ScrollView (touch handling)

[zaidmuachrat]

I’m using this chart inside a parent ScrollView in a React Native screen. When tooltip interaction is enabled (long press or touch move), the parent ScrollView starts scrolling, which prevents proper tooltip interaction on the chart.

To work around this, I tried disabling the parent scroll using onTouchStart and onTouchEnd on the chart container. This allows the tooltip to work correctly, but it introduces a new issue: once this is added, the chart view itself can no longer scroll vertically or handle pan gestures properly.

So the behavior is currently one of the following, but not both:

• Tooltip works, but parent ScrollView intercepts gestures
• Tooltip works and parent scroll is disabled, but chart scrolling is blocked

Steps to reproduce

1. Render the chart as a child of a React Native ScrollView
2. Enable tooltip interaction (axis tooltip / long press)
3. Try to long press or move finger on the chart
   → Parent ScrollView starts scrolling
4. Add onTouchStart / onTouchEnd to disable parent scrolling
   → Tooltip works, but chart scrolling no longer works as expected

Expected behavior

The chart should be able to:

• Handle touch interactions for tooltip (long press or move)
• Scroll or pan normally
• Coexist inside a parent ScrollView without gesture conflicts

Actual behavior

Touch handling is fully captured either by the parent ScrollView or blocked entirely when manually disabling scroll.

Question / Request

Is there a recommended or built-in way to handle gesture priority when the chart is nested inside a ScrollView?
For example:

• Using react-native-gesture-handler
• A prop to control gesture handling or pointer events
• Any guidance on integrating tooltips inside scrollable parents

Any suggestion or example would be very helpful.

[zhiqingchen]

Use React Native Gesture Handler