From ecd21ceebb605760294ecd4c668915ff96fc77a6 Mon Sep 17 00:00:00 2001
From: braks <78412429+bcakmakoglu@users.noreply.github.com>
Date: Fri, 1 Nov 2024 14:52:10 +0100
Subject: [PATCH] fix(core): allow pan on drag for other mouse btns if left is
 disabled

Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com>
---
 packages/core/src/container/Viewport/Viewport.vue | 15 +++++++++++++--
 1 file changed, 13 insertions(+), 2 deletions(-)

diff --git a/packages/core/src/container/Viewport/Viewport.vue b/packages/core/src/container/Viewport/Viewport.vue
index ba0aff8b..a8fffcde 100644
--- a/packages/core/src/container/Viewport/Viewport.vue
+++ b/packages/core/src/container/Viewport/Viewport.vue
@@ -66,7 +66,11 @@ const selectionKeyPressed = useKeyPress(selectionKeyCode)
 
 const zoomKeyPressed = useKeyPress(zoomActivationKeyCode)
 
-const shouldPanOnDrag = toRef(() => !selectionKeyPressed.value && (panKeyPressed.value || panOnDrag.value))
+const shouldPanOnDrag = toRef(
+  () =>
+    (!selectionKeyPressed.value || (selectionKeyPressed.value && selectionKeyCode.value === true)) &&
+    (panKeyPressed.value || panOnDrag.value),
+)
 
 const shouldPanOnScroll = toRef(() => panKeyPressed.value || panOnScroll.value)
 
@@ -226,9 +230,16 @@ onMounted(() => {
       return false
     }
 
+    const leftMouseBtnPanAllowed =
+      eventButton !== 0 || (selectionKeyCode.value === true && Array.isArray(panOnDrag.value) && !panOnDrag.value.includes(0))
+
     // We only allow right clicks if pan on drag is set to right-click
     const buttonAllowed =
-      (Array.isArray(shouldPanOnDrag.value) && shouldPanOnDrag.value.includes(eventButton)) || !eventButton || eventButton <= 1
+      leftMouseBtnPanAllowed &&
+      ((Array.isArray(panOnDrag.value) && panOnDrag.value.includes(eventButton)) ||
+        (selectionKeyCode.value === true && Array.isArray(panOnDrag.value) && !panOnDrag.value.includes(0)) ||
+        !eventButton ||
+        eventButton <= 1)
 
     // default filter for d3-zoom
     return (!event.ctrlKey || event.type === 'wheel') && buttonAllowed