From f81b5ef5320b985e513f38ff51f674e919d9d6dd Mon Sep 17 00:00:00 2001
From: oliver <zhoutianjun127@126.com>
Date: Thu, 17 Sep 2026 11:07:45 +0800
Subject: [PATCH] fix: stop canvas zoom when scrolling property tip

Wheel events inside pinned tips and the prop editor no longer bubble to the canvas host.

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 apps/web/src/PropTooltip.tsx               |  4 ++++
 apps/web/src/TopologyCanvas.tsx            | 10 +++++++++-
 apps/web/src/node-props/NodePropEditor.tsx |  6 +++++-
 3 files changed, 18 insertions(+), 2 deletions(-)

diff --git a/apps/web/src/PropTooltip.tsx b/apps/web/src/PropTooltip.tsx
index 537dd8d..07ae23b 100644
--- a/apps/web/src/PropTooltip.tsx
+++ b/apps/web/src/PropTooltip.tsx
@@ -56,6 +56,10 @@ export function PropTooltip({
       onPointerDown={(e) => {
         if (pinned) e.stopPropagation();
       }}
+      onWheel={(e) => {
+        // Keep scroll inside tip; do not zoom/pan the canvas behind.
+        e.stopPropagation();
+      }}
     >
       <div className="prop-tooltip__label">
         {label}
diff --git a/apps/web/src/TopologyCanvas.tsx b/apps/web/src/TopologyCanvas.tsx
index acaf3e1..3f348ef 100644
--- a/apps/web/src/TopologyCanvas.tsx
+++ b/apps/web/src/TopologyCanvas.tsx
@@ -1151,6 +1151,14 @@ export function TopologyCanvas() {
       ref={hostRef}
       style={{ cursor }}
       onWheel={(e) => {
+        const t = e.target as HTMLElement | null;
+        if (
+          t?.closest?.(
+            ".prop-tooltip, .ns-overlay, .ns-editor, .canvas-toolbar, .canvas-controls, .canvas-minimap",
+          )
+        ) {
+          return;
+        }
         e.preventDefault();
         const factor = e.deltaY > 0 ? 0.9 : 1.1;
         setViewport((v) => ({
@@ -1162,7 +1170,7 @@ export function TopologyCanvas() {
         const t = e.target as HTMLElement | null;
         if (
           t?.closest?.(
-            ".canvas-toolbar, .canvas-controls, .canvas-minimap, .edit-overlay, .node-handles, .hover-card, .inspector",
+            ".canvas-toolbar, .canvas-controls, .canvas-minimap, .edit-overlay, .node-handles, .hover-card, .inspector, .prop-tooltip, .ns-overlay, .ns-editor",
           )
         ) {
           return;
diff --git a/apps/web/src/node-props/NodePropEditor.tsx b/apps/web/src/node-props/NodePropEditor.tsx
index ea3866a..5d57787 100644
--- a/apps/web/src/node-props/NodePropEditor.tsx
+++ b/apps/web/src/node-props/NodePropEditor.tsx
@@ -173,7 +173,11 @@ export function NodePropEditor({
         if (variant === "overlay") e.stopPropagation();
       }}
       onWheel={(e) => {
-        if (variant === "overlay") e.stopPropagation();
+        if (variant === "overlay") {
+          e.stopPropagation();
+          // Allow native scroll inside the editor; do not zoom canvas.
+          return;
+        }
       }}
     >
       <div