Sfoglia il codice sorgente

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
Colby McHenry 1 settimana fa
parent
commit
77dc0ad2eb

+ 7 - 1
ui/src/components/screens/ScreenNode.svelte

@@ -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
ui/src/components/steps/StepNode.svelte

@@ -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.' : ''}`}
 >