fix: prevent browser from scrolling when panning (#4489)

src/components/App.tsx

@@ -1765,6 +1765,7 @@ class App extends React.Component<AppProps, AppState> {
       if (event.key === KEYS.SPACE && gesture.pointers.size === 0) {
         isHoldingSpace = true;
         setCursor(this.canvas, CURSOR_TYPE.GRABBING);
+        event.preventDefault();
       }
 
       if (event.key === KEYS.G || event.key === KEYS.S) {
@@ -2731,6 +2732,7 @@ class App extends React.Component<AppProps, AppState> {
       return false;
     }
     isPanning = true;
+    event.preventDefault();
 
     let nextPastePrevented = false;
     const isLinux = /Linux/.test(window.navigator.platform);

src/packages/excalidraw/CHANGELOG.md

@@ -66,6 +66,7 @@ Please add the latest change on the top under the correct section.
 
 ### Fixes
 
+- Panning the canvas using `mousewheel-drag` and `space-drag` now prevents the browser from scrolling the container/page [#4489](https://github.com/excalidraw/excalidraw/pull/4489).
 - Scope drag and drop events to Excalidraw container to prevent overriding host application drag and drop events.
 
 ### Build