feat(pointer-events-support): Add support for pointer events and the ability to opt-out of implicit pointer capturing

[calebpeterson]

Issue

When using a reactflow in a mobile browser, touch enter/move/leave events are not handled.

Solution

• Provide support for the more general pointer enter/move/leave events.
• Provide the ability to opt-out of implicit pointer capturing

Resources

• What is implicit pointer capturing?

[calebpeterson]

@moklick have you had a chance to take a look at this pull request yet?

[moklick]

Hey @calebpeterson

thanks for your PR! we are currently in a feature freeze for v11, because we are already working on the v12 release https://github.com/wbkd/react-flow#-upcoming-changes

I will leave this open as a reminder for myself to check if this is something we should support in the next version.

[calebpeterson]

Thank you so much @moklick!

Should I update anything in this PR to make it easier for you to consider/merge it?

Do you have any idea of a timeline?

[moklick]

I need to check if there are any downsides with this approach. When I see it right, pointer events are enabled by default with this PR. Could this affect the performance?

[calebpeterson]

I hadn't thought about that angle on performance @moklick 🤔

After doing some looking, here's my conclusion:

Since the Nodes/utils.ts#getPointerHandler and Edges/utils.ts#getPointerHandler functions return undefined if there isn't a provided handler (making those properties opt-in) and the additional event handler for onPointerDown is also opt-in based on disablePointerCapture, I don't believe there will be. The additional event handlers are undefined unless the consumer opts-in.

I suppose there are the additional calls to getPointerHandler for each wrapNode/wrapEdge component, but the implementation is a simple ternary (I wonder if the JIT will optimize that away?)

[calebpeterson]

@moklick when you have a minute, may I please have an update on if/when we might be able to get this merged?

I realize it depends on the feature freeze for v12, but wondered how the timeline for that is looking...

Thank you in advance!

[moklick]

Hey @calebpeterson

we are planning to launch in 4 - 6 weeks. Couldn't you already use those events inside your custom nodes?

[moklick]

this is on our list for React Flow 13.