[SvelteFlow] panOnScroll shift+scroll horizontal does not work after clicking canvas

[Everduin94]

Describe the Bug

Horizontal scroll via the mouse wheel when panOnScroll=true is broken in svelte flow after focusing / clicking the canvas

Your Example Website or App

Reproduction: https://stackblitz.com/edit/hhoaya?file=src%2Fexample%2FApp.svelte

Steps to Reproduce the Bug or Issue

Steps to reproduce:

• Hover your mouse over the canvas. Hold shift, scroll. The canvas will scroll horizontal. Works as expected
• Click the canvas. Hold shift, scroll. The canvas will not scroll horizontal.
• Click outside the canvas. Hold shift, scroll. The canvas will scroll horizontal again.

Expected behavior

It should always scroll horizontally when holding shift and scrolling 😅

Screenshots or Videos

No response

Platform

• OS: MacOS
• Browser: Chome
• Version: "@xyflow/svelte": "0.1.3"

Additional context

No response

[peterkogo]

Holding shift activates the selection box, but weird that it stops panning by scrolling. Definitely a bug, thanks!

[Everduin94]

@peterkogo - Just to clarify. Doesn't shift+mouse-down+drag activate the selection box?

If shift+scroll is not meant for scrolling horizontally (like in figma, obsidian, excalidraw, native overflow-x) what is the key-bind for scrolling horizontally 😅? panOnScrollMode references moving both directions / horizontally. Is this only possible on a trackpad and not with a mouse scroll wheel?

[peterkogo]

Sorry, haven't used a mouse without a horizontal scroll wheel in a while. Totally forgot that shift+scroll is horizontal scrolling... Now I understand the problem. I guess we are doing preventDefault when pressing down the shift button for drawing selectionBox. If you set selectionKey to something other than "Shift" it works.

[Everduin94]

haven't used a mouse without a horizontal scroll wheel in a while

I read this and thought "Wow, I didn't even know that existed". So I googled mouse with horizontal scroll wheel, only to find my exact mouse was the first mouse that popped up. I never realize that thingy on the side was a horizontal scroll 🤣.

Thanks for the selectionKey workaround! I'll give that a shot!