paradigmxyz/flux

feat: make horizontal panning easier for mouse users

ghgoodreau opened this issue · 2 comments

Is your feature request related to a problem? Please describe.
When utilizing a keyboard and mouse, there isn't an intuitive way to pan horizontally, unless I'm missing something. Feels great on a trackpad but you don't have that freedom with a mouse currently.

Describe the solution you'd like
Change panActivationKeyCode={null} to panActivationKeyCode="Space" within the <ReactFlow /> component to allow users to click and hold Spacebar + drag the mouse to pan around the screen. The prop can also be removed if preferred since the default for this behavior is Space.

Happy to contribute this change myself once a decision is made!

Describe alternatives you've considered
Open to other Keybinds, suggestions, or to be educated on the design decision (or the mouse pan method I'm missing). panActivationKeyCode="Shift" + Drag is another viable option, it doesn't seem to override the multi-select behavior.

Additional context
https://reactflow.dev/docs/guides/panning-and-zooming/

When utilizing a keyboard and mouse, there isn't an intuitive way to pan horizontally

ahh good catch. i only use a trackpad so wouldnt have caught this hehe

in terms of which key to use, are there any major apps we can look to like Figma? would like to use something that ppl might already have a muscle memory for.

The docs use the term "Figma-like" to describe the space + drag combo. The only problem I see with this is the user has to click out of a text box before they start using it, otherwise they will accidentally edit a node (most noticeable on GPT nodes since they change color).

The alternative is shift or something similar which won't trigger an accidental input