alighasami/vue-flow
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(core): disable selection on drag when panning mode is active (#2014)

Browse Source 
* fix(core): disable selection on drag when panning mode is active

Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com>

* chore(changeset): add

---------

Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com>
This commit is contained in:
Braks
2026-01-23 17:56:02 +01:00
parent 8073306b67
commit 8c1d390c8f
2 changed files with 11 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
.changeset/green-games-cough.md Normal file
View File

@@ -0,0 +1,5 @@
---
"@vue-flow/core": patch
---
Disable selection on drag by setting the keycode to `true` when panning mode is active.

10
packages/core/src/container/Viewport/Viewport.vue
View File

@@ -61,9 +61,7 @@ let prevTransform: ViewportTransform = {
}
const panKeyPressed = useKeyPress(panActivationKeyCode)
const selectionKeyPressed = useKeyPress(selectionKeyCode)
const zoomKeyPressed = useKeyPress(zoomActivationKeyCode)
const shouldPanOnDrag = toRef(
@@ -74,7 +72,11 @@ const shouldPanOnDrag = toRef(
const shouldPanOnScroll = toRef(() => panKeyPressed.value || panOnScroll.value)
const isSelecting = toRef(() => selectionKeyPressed.value || (selectionKeyCode.value === true && shouldPanOnDrag.value !== true))
const shouldSelectOnDrag = toRef(() => selectionKeyCode.value === true && shouldPanOnDrag.value !== true)
const isSelecting = toRef(
() => (selectionKeyPressed.value && selectionKeyCode.value !== true) || userSelectionActive.value || shouldSelectOnDrag.value,
)
const connectionInProgress = toRef(() => connectionStartHandle.value !== null)
@@ -229,7 +231,7 @@ onMounted(() => {
}
// if selection key code is true and panOnDrag tries to use left mouse button we prevent it
if (selectionKeyCode.value === true && Array.isArray(panOnDrag.value) && panOnDrag.value.includes(0) && eventButton === 0) {
if (shouldSelectOnDrag.value && Array.isArray(panOnDrag.value) && panOnDrag.value.includes(0) && eventButton === 0) {
return false
}