Prevent browser context menu on custom right-click menus

Always prevent the default browser context menu and stop event propagation on right-click interactions and custom menus. This ensures that only the application's custom context menus are shown and avoids interference from the browser's native context menu.

js/CanvasInteractions.js

@@ -90,9 +90,10 @@ export class CanvasInteractions {
         }
         // 2. Inne przyciski myszy
         if (e.button === 2) { // Prawy przycisk myszy
+            e.preventDefault(); // Always prevent right-click default behavior
+            e.stopPropagation(); // Stop event propagation
             const clickedLayerResult = this.canvas.canvasLayers.getLayerAtPosition(worldCoords.x, worldCoords.y);
             if (clickedLayerResult && this.canvas.canvasSelection.selectedLayers.includes(clickedLayerResult.layer)) {
-                e.preventDefault();
                 this.canvas.canvasLayers.showBlendModeMenu(viewCoords.x, viewCoords.y);
             }
             return;
@@ -207,7 +208,9 @@ export class CanvasInteractions {
         }
     }
     handleContextMenu(e) {
+        // Always prevent browser context menu - we handle all right-click interactions ourselves
         e.preventDefault();
+        e.stopPropagation();
     }
     handleWheel(e) {
         e.preventDefault();

js/CanvasLayers.js

@@ -639,6 +639,11 @@ export class CanvasLayers {
             container.appendChild(slider);
             content.appendChild(container);
         });
+        // Add contextmenu event listener to the menu itself to prevent browser context menu
+        menu.addEventListener('contextmenu', (e) => {
+            e.preventDefault();
+            e.stopPropagation();
+        });
         const container = this.canvas.canvas.parentElement || document.body;
         container.appendChild(menu);
         const closeMenu = (e) => {

src/CanvasInteractions.ts

@@ -131,9 +131,11 @@ export class CanvasInteractions {
         
         // 2. Inne przyciski myszy
         if (e.button === 2) { // Prawy przycisk myszy
+            e.preventDefault(); // Always prevent right-click default behavior
+            e.stopPropagation(); // Stop event propagation
+            
             const clickedLayerResult = this.canvas.canvasLayers.getLayerAtPosition(worldCoords.x, worldCoords.y);
             if (clickedLayerResult && this.canvas.canvasSelection.selectedLayers.includes(clickedLayerResult.layer)) {
-                e.preventDefault();
                 this.canvas.canvasLayers.showBlendModeMenu(viewCoords.x, viewCoords.y);
             }
             return;
@@ -263,7 +265,9 @@ export class CanvasInteractions {
     }
 
     handleContextMenu(e: MouseEvent): void {
+        // Always prevent browser context menu - we handle all right-click interactions ourselves
         e.preventDefault();
+        e.stopPropagation();
     }
 
     handleWheel(e: WheelEvent): void {

src/CanvasLayers.ts

@@ -739,6 +739,12 @@ export class CanvasLayers {
             content.appendChild(container);
         });
 
+        // Add contextmenu event listener to the menu itself to prevent browser context menu
+        menu.addEventListener('contextmenu', (e: MouseEvent) => {
+            e.preventDefault();
+            e.stopPropagation();
+        });
+
         const container = this.canvas.canvas.parentElement || document.body;
         container.appendChild(menu);