From 6915c9c2a5084ff9612dc5b6a51c9105d91c6bdb Mon Sep 17 00:00:00 2001
From: austaras <austaras@outlook.com>
Date: Thu, 18 Aug 2022 17:26:11 +0800
Subject: [PATCH] fix(whiteboard): only allow pan when middle button is pressed

---
 libs/components/board-state/src/tldraw-app.ts | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/libs/components/board-state/src/tldraw-app.ts b/libs/components/board-state/src/tldraw-app.ts
index e4b7a8a34f..5dd9ad09b2 100644
--- a/libs/components/board-state/src/tldraw-app.ts
+++ b/libs/components/board-state/src/tldraw-app.ts
@@ -3841,7 +3841,7 @@ export class TldrawApp extends StateManager<TDSnapshot> {
 
     private get_viewbox_from_svg = (svgStr: string | ArrayBuffer | null) => {
         if (typeof svgStr === 'string') {
-            let viewBox = new DOMParser().parseFromString(svgStr, 'text/xml');
+            const viewBox = new DOMParser().parseFromString(svgStr, 'text/xml');
             return viewBox.children[0].getAttribute('viewBox');
         }
 
@@ -4125,7 +4125,7 @@ export class TldrawApp extends StateManager<TDSnapshot> {
     };
 
     onPointerDown: TLPointerEventHandler = (info, e) => {
-        if (e.buttons === 4) {
+        if (e.button === 1) {
             this.patchState({
                 settings: {
                     forcePanning: true,
@@ -4142,6 +4142,13 @@ export class TldrawApp extends StateManager<TDSnapshot> {
     };
 
     onPointerUp: TLPointerEventHandler = (info, e) => {
+        if (e.button === 1) {
+            this.patchState({
+                settings: {
+                    forcePanning: false,
+                },
+            });
+        }
         this.isPointing = false;
         this.updateInputs(info, e);
         this.currentTool.onPointerUp?.(info, e);