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(); + }} >
{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; + } }} >