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.

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

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

Open
wants to merge 2 commits into
base: main
Choose a base branch
from

Conversation

calebpeterson
Copy link

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

@calebpeterson calebpeterson changed the title Add support for pointer events and the ability to opt-out of pointer capture Add support for pointer events and the ability to opt-out of implicit pointer capturing Jun 22, 2023
@calebpeterson calebpeterson changed the title Add support for pointer events and the ability to opt-out of implicit pointer capturing feat(pointer-events-support): Add support for pointer events and the ability to opt-out of implicit pointer capturing Jun 22, 2023
@calebpeterson
Copy link
Author

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

@moklick
Copy link
Member

moklick commented Jul 24, 2023

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.

@moklick moklick self-assigned this Jul 24, 2023
@calebpeterson
Copy link
Author

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
Copy link
Member

moklick commented Jul 31, 2023

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
Copy link
Author

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
Copy link
Author

@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
Copy link
Member

moklick commented Aug 31, 2023

Hey @calebpeterson

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants