fix(ui): a double-click on a box no longer zooms the canvas

The flow canvas zooms on any double-click that reaches its pane, including one bubbling up from a step or screen box. A box's double-click is a navigation, not a zoom: it is stopped at the box in the capture phase (the delegated handler runs at the root, after the pane), so the picture keeps its fit while the pane's own double-click still zooms.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01REFyW9hmNrxhwN5wxRoAkC
This commit is contained in:
Colby McHenry
2026-08-29 11:21:42 -05:00
co-authored by Claude Fable 5
parent 435a7fd37a
commit 77dc0ad2eb
2 changed files with 14 additions and 2 deletions
+7 -1
View File
@@ -56,7 +56,13 @@
class:unreached={info.unreached}
style={`width:${layout.width}px;height:${layout.height}px`}
onclick={() => node.onSelect(info.id)}
ondblclick={() => node.onOpen?.(info.id)}
ondblclickcapture={(e) => {
// The flow canvas zooms on a double-click that reaches its pane; a
// double-click on a box is a navigation, not a zoom — stop it here,
// at the target, before it bubbles. The pane's own double-click keeps zooming.
e.stopPropagation();
node.onOpen?.(info.id);
}}
aria-pressed={node.selected}
title={(info.origin
? `${info.label} navigates, but no screen reaches it within the walk. In ${info.sub}.`
+7 -1
View File
@@ -79,7 +79,13 @@
class:anchor={step.anchor}
style={`width:${layout.width}px;height:${layout.height}px`}
onclick={() => node.onSelect(info.id)}
ondblclick={() => node.onStart?.(info.id)}
ondblclickcapture={(e) => {
// The flow canvas zooms on a double-click that reaches its pane; a
// double-click on a box is a navigation, not a zoom — stop it here,
// at the target, before it bubbles. The pane's own double-click keeps zooming.
e.stopPropagation();
node.onStart?.(info.id);
}}
aria-pressed={node.selected}
title={`${info.label}${step.anchor ? 'where this picture starts; ' : ''}${kindWord(step.kind, node.project, step)}. ${info.sub}.${cutNote}${node.onStart && !step.anchor ? ' Double-click to start here.' : ''}`}
>