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>
This commit is contained in:
oliver 2026-09-17 11:07:45 +08:00
parent 993fcaa2fd
commit f81b5ef532
3 changed files with 18 additions and 2 deletions

View file

@ -56,6 +56,10 @@ export function PropTooltip({
onPointerDown={(e) => { onPointerDown={(e) => {
if (pinned) e.stopPropagation(); if (pinned) e.stopPropagation();
}} }}
onWheel={(e) => {
// Keep scroll inside tip; do not zoom/pan the canvas behind.
e.stopPropagation();
}}
> >
<div className="prop-tooltip__label"> <div className="prop-tooltip__label">
{label} {label}

View file

@ -1151,6 +1151,14 @@ export function TopologyCanvas() {
ref={hostRef} ref={hostRef}
style={{ cursor }} style={{ cursor }}
onWheel={(e) => { 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(); e.preventDefault();
const factor = e.deltaY > 0 ? 0.9 : 1.1; const factor = e.deltaY > 0 ? 0.9 : 1.1;
setViewport((v) => ({ setViewport((v) => ({
@ -1162,7 +1170,7 @@ export function TopologyCanvas() {
const t = e.target as HTMLElement | null; const t = e.target as HTMLElement | null;
if ( if (
t?.closest?.( 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; return;

View file

@ -173,7 +173,11 @@ export function NodePropEditor({
if (variant === "overlay") e.stopPropagation(); if (variant === "overlay") e.stopPropagation();
}} }}
onWheel={(e) => { onWheel={(e) => {
if (variant === "overlay") e.stopPropagation(); if (variant === "overlay") {
e.stopPropagation();
// Allow native scroll inside the editor; do not zoom canvas.
return;
}
}} }}
> >
<div <div