From b895a24030e75700438e64f92eda3c1b6cd01ba2 Mon Sep 17 00:00:00 2001
From: Matt Bierner <12821956+mjbvz@users.noreply.github.com>
Date: Wed, 28 Jan 2026 13:15:08 -0800
Subject: [PATCH] A bit more polish on mermaid chat items

- Remove context menu for open in editor since there's a button now
- Faster pinch zoom
- Only pan when holding alt/option
- Fix transparent button on hover
---
 .../chat-webview-src/mermaidWebview.ts        | 24 ++++++++++++-------
 extensions/mermaid-chat-features/package.json |  4 ----
 .../src/chatOutputRenderer.ts                 |  1 +
 3 files changed, 17 insertions(+), 12 deletions(-)

diff --git a/extensions/mermaid-chat-features/chat-webview-src/mermaidWebview.ts b/extensions/mermaid-chat-features/chat-webview-src/mermaidWebview.ts
index a2fb1081995..fb11ad44e5c 100644
--- a/extensions/mermaid-chat-features/chat-webview-src/mermaidWebview.ts
+++ b/extensions/mermaid-chat-features/chat-webview-src/mermaidWebview.ts
@@ -35,7 +35,7 @@ export class PanZoomHandler {
 		this.content = content;
 		this.content.style.transformOrigin = '0 0';
 		this.container.style.overflow = 'hidden';
-		this.container.style.cursor = 'grab';
+		this.container.style.cursor = 'default';
 		this.setupEventListeners();
 	}
 
@@ -77,11 +77,11 @@ export class PanZoomHandler {
 		if ((e.key === 'Alt' || e.key === 'Shift') && !this.isPanning) {
 			e.preventDefault();
 			if (e.altKey && !e.shiftKey) {
-				this.container.style.cursor = 'zoom-in';
+				this.container.style.cursor = 'grab';
 			} else if (e.altKey && e.shiftKey) {
 				this.container.style.cursor = 'zoom-out';
 			} else {
-				this.container.style.cursor = 'grab';
+				this.container.style.cursor = 'default';
 			}
 		}
 	}
@@ -91,11 +91,11 @@ export class PanZoomHandler {
 			return;
 		}
 		if (e.altKey && !e.shiftKey) {
-			this.container.style.cursor = 'zoom-in';
+			this.container.style.cursor = 'grab';
 		} else if (e.altKey && e.shiftKey) {
 			this.container.style.cursor = 'zoom-out';
 		} else {
-			this.container.style.cursor = 'grab';
+			this.container.style.cursor = 'default';
 		}
 	}
 
@@ -118,9 +118,15 @@ export class PanZoomHandler {
 	}
 
 	private handleWheel(e: WheelEvent): void {
+		// Only zoom when Alt is held (or ctrlKey for pinch-to-zoom gestures)
 		// ctrlKey is set by browsers for pinch-to-zoom gestures
 		const isPinchZoom = e.ctrlKey;
 
+		if (!e.altKey && !isPinchZoom) {
+			// Allow normal scrolling when Alt is not held
+			return;
+		}
+
 		if (isPinchZoom || e.altKey) {
 			// Pinch gesture or Alt + two-finger drag = zoom
 			e.preventDefault();
@@ -131,7 +137,9 @@ export class PanZoomHandler {
 			const mouseY = e.clientY - rect.top;
 
 			// Calculate zoom (scroll up = zoom in, scroll down = zoom out)
-			const delta = -e.deltaY * this.zoomFactor;
+			// Pinch gestures have smaller deltaY values, so use a higher factor
+			const effectiveZoomFactor = isPinchZoom ? this.zoomFactor * 5 : this.zoomFactor;
+			const delta = -e.deltaY * effectiveZoomFactor;
 			const newScale = Math.min(this.maxScale, Math.max(this.minScale, this.scale * (1 + delta)));
 
 			// Zoom toward mouse position
@@ -146,7 +154,7 @@ export class PanZoomHandler {
 	}
 
 	private handleMouseDown(e: MouseEvent): void {
-		if (e.button !== 0) {
+		if (e.button !== 0 || !e.altKey) {
 			return;
 		}
 		e.preventDefault();
@@ -182,7 +190,7 @@ export class PanZoomHandler {
 	private handleMouseUp(): void {
 		if (this.isPanning) {
 			this.isPanning = false;
-			this.container.style.cursor = 'grab';
+			this.container.style.cursor = 'default';
 			this.saveState();
 		}
 	}
diff --git a/extensions/mermaid-chat-features/package.json b/extensions/mermaid-chat-features/package.json
index 6a447e16d57..f09aa5e82cd 100644
--- a/extensions/mermaid-chat-features/package.json
+++ b/extensions/mermaid-chat-features/package.json
@@ -62,10 +62,6 @@
           "command": "_mermaid-chat.resetPanZoom",
           "when": "webviewId == 'vscode.chat-mermaid-features.chatOutputItem'"
         },
-        {
-          "command": "_mermaid-chat.openInEditor",
-          "when": "webviewId == 'vscode.chat-mermaid-features.chatOutputItem'"
-        },
         {
           "command": "_mermaid-chat.copySource",
           "when": "webviewId == 'vscode.chat-mermaid-features.chatOutputItem' || webviewId == 'vscode.chat-mermaid-features.preview'"
diff --git a/extensions/mermaid-chat-features/src/chatOutputRenderer.ts b/extensions/mermaid-chat-features/src/chatOutputRenderer.ts
index 810fa2011b1..4bf4d9de7e7 100644
--- a/extensions/mermaid-chat-features/src/chatOutputRenderer.ts
+++ b/extensions/mermaid-chat-features/src/chatOutputRenderer.ts
@@ -105,6 +105,7 @@ class MermaidChatOutputRenderer implements vscode.ChatOutputRenderer {
 						opacity: 1;
 					}
 					.open-in-editor-btn:hover {
+						opacity: 1;
 						background: var(--vscode-toolbar-hoverBackground);
 					}
 				</style>