@pascal-app/nodes 1.0.7 → 1.1.1

package/dist/duct-fitting/definition.js

@@ -1,135 +1,4 @@
-import { ductBodySlots } from '@pascal-app/core';
-import { ductBodyPaint } from '../shared/duct-body-paint.js';
-import { rotateFittingNode } from '../shared/fitting-rotation.js';
-import { ductFittingToolOptions } from '../shared/fitting-tool-options.js';
-import { buildDuctFittingFloorplan } from './floorplan.js';
-import { buildDuctFittingGeometry } from './geometry.js';
-import { ductFittingParametrics } from './parametrics.js';
-import { getDuctFittingPorts } from './ports.js';
-import { DuctFittingNode } from './schema.js';
-/**
- * Phase 2 of the HVAC node system — duct fittings (elbow / tee / reducer)
- * and the first kind to expose typed ports (`def.ports`).
- *
- * Composition: `def.geometry` only, same as duct-segment. Ports are the
- * architectural payload: placement tools snap onto them, and a later
- * slice walks them to build the supply/return system graph.
- */
-export const ductFittingDefinition = {
-    kind: 'duct-fitting',
-    schemaVersion: 3,
-    schema: DuctFittingNode,
-    category: 'utility',
-    distributionRole: 'fitting',
-    snapProfile: 'item',
-    defaults: () => ({
-        object: 'node',
-        parentId: null,
-        visible: true,
-        metadata: {},
-        position: [0, 0, 0],
-        rotation: [0, 0, 0],
-        damperAngle: 0,
-        panelWidth: 0.25,
-        panelHeight: 0.15,
-        fittingType: 'elbow',
-        shape: 'rect',
-        width: 14,
-        height: 8,
-        shape2: 'rect',
-        width2: 14,
-        height2: 8,
-        angle: 90,
-        branchAngle: 90,
-        diameter: 12,
-        diameter2: 12,
-        ductMaterial: 'sheet-metal',
-        system: 'supply',
-    }),
-    capabilities: {
-        selectable: { hitVolume: 'bbox' },
-        // `cursorAttached`: a fitting is a small connector — an offset-
-        // preserving drag reads as the mesh trailing the mouse, so pin its
-        // origin to the cursor instead.
-        movable: { axes: ['x', 'y', 'z'], gridSnap: true, cursorAttached: true },
-        duplicable: true,
-        deletable: true,
-        slots: () => ductBodySlots(),
-        paint: ductBodyPaint,
-    },
-    parametrics: ductFittingParametrics,
-    geometry: buildDuctFittingGeometry,
-    geometryKey: (n) => JSON.stringify([
-        n.fittingType,
-        n.damperAngle,
-        n.panelWidth,
-        n.panelHeight,
-        // The mitered elbow + flange profiles swap width/height roles based
-        // on where world-up sits in the local frame, so orientation is a
-        // geometry input.
-        n.rotation,
-        n.shape,
-        n.inletShape,
-        n.outletShape,
-        n.width,
-        n.height,
-        n.shape2,
-        n.width2,
-        n.height2,
-        n.angle,
-        n.branchAngle,
-        n.diameter,
-        n.diameter2,
-        n.ductMaterial,
-        n.system,
-        n.slots,
-    ]),
-    ports: getDuctFittingPorts,
-    floorplan: buildDuctFittingFloorplan,
-    // R/T rotate a selected fitting ±45° around the shared active axis.
-    // The default editor rotate only knows Y; fittings need X/Z for
-    // risers, so this overrides it. Alt-cycling of the axis + the axis
-    // badge live in `./selection.tsx`.
-    keyboardActions: {
-        r: {
-            appliesTo: (node) => node.type === 'duct-fitting',
-            run: (node) => rotateFittingNode(node, 1),
-        },
-        t: {
-            appliesTo: (node) => node.type === 'duct-fitting',
-            run: (node) => rotateFittingNode(node, -1),
-        },
-        axisCycling: true,
-    },
-    // Alt-cycles the active rotation axis while a fitting is selected.
-    // Editor-only (drives `useEditor.rotationAxis`), so it mounts via the
-    // editor's SelectionAffordanceManager rather than `def.system`.
-    affordanceTools: {
-        selection: () => import('./selection.js'),
-        // Ghost-preview duplicate / move. Duplicate is pure drag-to-place: a
-        // translucent copy of the fitting (built from its real geometry, at its
-        // own rotation, so an elbow / riser stays properly aligned) follows the
-        // cursor and only lands on the commit click. Takes priority over
-        // `capabilities.movable` in the MoveTool dispatcher.
-        move: () => import('./move-tool.js'),
-    },
-    toolOptions: ductFittingToolOptions,
-    tool: () => import('./tool.js'),
-    toolHints: [
-        { key: 'Click', label: 'Place fitting' },
-        { key: 'Hover a duct end', label: 'Snap onto the run' },
-        { key: 'R / T', label: 'Rotate ±45°' },
-        { key: 'Alt', label: 'Switch rotation axis (Y → X → Z)' },
-        { key: 'Esc', label: 'Exit' },
-    ],
-    presentation: {
-        label: 'Duct Fitting',
-        description: 'Elbow, tee, reducer, or square-to-round transition connecting duct runs.',
-        icon: { kind: 'url', src: '/icons/duct-fitting.webp' },
-        paletteSection: 'structure',
-        paletteOrder: 91,
-    },
-    mcp: {
-        description: 'A duct fitting (elbow, tee, reducer, or square-to-round transition) with typed connection ports. Position is level-local meters; rotation is an XYZ euler in radians.',
-    },
-};
+import { composeNodeDefinition } from '../definition-contributions.js';
+import { ductFittingEditContribution } from './definition.edit.js';
+import { ductFittingRenderDefinition } from './definition.render.js';
+export const ductFittingDefinition = composeNodeDefinition(ductFittingRenderDefinition, ductFittingEditContribution);

package/dist/duct-fitting/definition.render.d.ts

@@ -0,0 +1,6 @@
+import type { NodeRenderDefinition } from '../definition-contributions.js';
+import { DuctFittingNode } from './schema.js';
+export declare const ductFittingRenderDefinition: NodeRenderDefinition<typeof DuctFittingNode> & {
+    kind: 'duct-fitting';
+};
+//# sourceMappingURL=definition.render.d.ts.map

package/dist/duct-fitting/definition.render.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"definition.render.d.ts","sourceRoot":"","sources":["../../src/duct-fitting/definition.render.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAA;AAIvE,OAAO,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAE1C,eAAO,MAAM,2BAA2B,EAAE,oBAAoB,CAAC,OAAO,eAAe,CAAC,GAAG;IACvF,IAAI,EAAE,cAAc,CAAA;CAiFrB,CAAA"}

package/dist/duct-fitting/definition.render.js

@@ -0,0 +1,84 @@
+import { ductBodySlots } from '@pascal-app/core';
+import { buildDuctFittingFloorplan } from './floorplan.js';
+import { buildDuctFittingGeometry } from './geometry.js';
+import { getDuctFittingPorts } from './ports.js';
+import { DuctFittingNode } from './schema.js';
+export const ductFittingRenderDefinition = {
+    kind: 'duct-fitting',
+    schemaVersion: 3,
+    schema: DuctFittingNode,
+    category: 'utility',
+    distributionRole: 'fitting',
+    defaults: () => ({
+        object: 'node',
+        parentId: null,
+        visible: true,
+        metadata: {},
+        position: [0, 0, 0],
+        rotation: [0, 0, 0],
+        damperAngle: 0,
+        panelWidth: 0.25,
+        panelHeight: 0.15,
+        fittingType: 'elbow',
+        shape: 'rect',
+        width: 14,
+        height: 8,
+        shape2: 'rect',
+        width2: 14,
+        height2: 8,
+        angle: 90,
+        branchAngle: 90,
+        diameter: 12,
+        diameter2: 12,
+        ductMaterial: 'sheet-metal',
+        system: 'supply',
+    }),
+    capabilities: {
+        selectable: { hitVolume: 'bbox' },
+        // `cursorAttached`: a fitting is a small connector — an offset-
+        // preserving drag reads as the mesh trailing the mouse, so pin its
+        // origin to the cursor instead.
+        movable: { axes: ['x', 'y', 'z'], gridSnap: true, cursorAttached: true },
+        duplicable: true,
+        deletable: true,
+        slots: () => ductBodySlots(),
+    },
+    geometry: buildDuctFittingGeometry,
+    geometryKey: (n) => JSON.stringify([
+        n.fittingType,
+        n.damperAngle,
+        n.panelWidth,
+        n.panelHeight,
+        // The mitered elbow + flange profiles swap width/height roles based
+        // on where world-up sits in the local frame, so orientation is a
+        // geometry input.
+        n.rotation,
+        n.shape,
+        n.inletShape,
+        n.outletShape,
+        n.width,
+        n.height,
+        n.shape2,
+        n.width2,
+        n.height2,
+        n.angle,
+        n.branchAngle,
+        n.diameter,
+        n.diameter2,
+        n.ductMaterial,
+        n.system,
+        n.slots,
+    ]),
+    ports: getDuctFittingPorts,
+    floorplan: buildDuctFittingFloorplan,
+    presentation: {
+        label: 'Duct Fitting',
+        description: 'Elbow, tee, reducer, or square-to-round transition connecting duct runs.',
+        icon: { kind: 'url', src: '/icons/duct-fitting.webp' },
+        paletteSection: 'structure',
+        paletteOrder: 91,
+    },
+    mcp: {
+        description: 'A duct fitting (elbow, tee, reducer, or square-to-round transition) with typed connection ports. Position is level-local meters; rotation is an XYZ euler in radians.',
+    },
+};

package/dist/duct-fitting/floorplan.js

@@ -1,5 +1,5 @@
 import { MeshStandardMaterial } from 'three';
-import { INCHES_TO_METERS } from '../duct-segment/geometry.js';
+import { INCHES_TO_METERS } from '../duct-segment/profile.js';
 import { accessoryFloorplan } from '../shared/accessory-floorplan.js';
 import { buildDuctAccessory } from './accessory-geometry.js';
 import { buildDuctFittingGeometry } from './geometry.js';

package/dist/duct-fitting/geometry.js

@@ -1,6 +1,7 @@
 import { DUCT_BODY_SLOT_ID } from '@pascal-app/core';
 import { BufferGeometry, CylinderGeometry, DoubleSide, Euler, Float32BufferAttribute, Group, Mesh, SphereGeometry, TorusGeometry, Vector3, } from 'three';
-import { buildOvalSection, buildRectSection, buildSection, createDuctMaterial, INCHES_TO_METERS, } from '../duct-segment/geometry.js';
+import { buildOvalSection, buildRectSection, buildSection, createDuctMaterial, } from '../duct-segment/geometry.js';
+import { INCHES_TO_METERS } from '../duct-segment/profile.js';
 import { buildDuctAccessory } from './accessory-geometry.js';
 import { adapterShape, localFittingPorts } from './ports.js';
 const RADIAL_SEGMENTS = 24;

package/dist/duct-fitting/move-tool.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"move-tool.d.ts","sourceRoot":"","sources":["../../src/duct-fitting/move-tool.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,KAAK,OAAO,EAOb,MAAM,kBAAkB,CAAA;AAyEzB;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC;IAAE,IAAI,EAAE,OAAO,CAAA;CAAE,CAwQ3D,CAAA;eAEc,mBAAmB"}
+{"version":3,"file":"move-tool.d.ts","sourceRoot":"","sources":["../../src/duct-fitting/move-tool.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,KAAK,OAAO,EAOb,MAAM,kBAAkB,CAAA;AAyEzB;;;;;;;;;;;;;;;;GAgBG;AACH,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC;IAAE,IAAI,EAAE,OAAO,CAAA;CAAE,CA+Q3D,CAAA;eAEc,mBAAmB"}

package/dist/duct-fitting/move-tool.js

@@ -185,16 +185,17 @@ export const MoveDuctFittingTool = ({ node }) => {
             if ((isGridSnapActive() || isMagneticSnapActive()) &&
                 (next[0] !== lastPos[0] || next[2] !== lastPos[2]))
                 triggerSFX('sfx:grid-snap');
+            // Detached: keep the followers at their origin (drop any live overrides
+            // from a prior non-detached frame). Otherwise preview the follow; joints
+            // that cannot follow hold the last shown frame.
+            if (detached)
+                connectivity?.clear();
+            else if (connectivity && !connectivity.preview({ position: next }))
+                return;
             lastPos = next;
             lastDetached = detached;
             hasMoved = true;
             setCursorPos(next);
-            // Detached: keep the followers at their origin (drop any live overrides
-            // from a prior non-detached frame). Otherwise preview the follow.
-            if (detached)
-                connectivity?.clear();
-            else
-                connectivity?.preview({ position: next });
         };
         const commit = (event, fromDragRelease = false) => {
             if (committed)
@@ -210,10 +211,21 @@ export const MoveDuctFittingTool = ({ node }) => {
                 event.nativeEvent?.stopPropagation?.();
                 return;
             }
+            const creating = isNew && !useScene.getState().nodes[nodeId];
+            // Fold connected-duct / sibling-run follow-updates into the SAME batch
+            // as the moved fitting so the whole joint is one undo step. Detached
+            // (Alt on the final frame): the joint is broken, so nothing follows.
+            const followUpdates = creating || lastDetached || !connectivity
+                ? []
+                : connectivity.commitUpdates({ position: lastPos });
+            if (!followUpdates) {
+                event.nativeEvent?.stopPropagation?.();
+                return;
+            }
             committed = true;
             useScene.temporal.getState().resume();
             let selectId = nodeId;
-            if (isNew && !useScene.getState().nodes[nodeId]) {
+            if (creating) {
                 const created = DuctFittingNode.parse({
                     ...node,
                     position: lastPos,
@@ -230,12 +242,6 @@ export const MoveDuctFittingTool = ({ node }) => {
                 selectId = created.id;
             }
             else {
-                // Fold connected-duct / sibling-run follow-updates into the SAME batch
-                // as the moved fitting so the whole joint is one undo step. Detached
-                // (Alt on the final frame): the joint is broken, so nothing follows.
-                const followUpdates = lastDetached
-                    ? []
-                    : (connectivity?.commitUpdates({ position: lastPos }) ?? []);
                 const scene = useScene.getState();
                 scene.updateNodes([
                     { id: nodeId, data: { position: lastPos } },

package/dist/duct-fitting/selection.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"selection.d.ts","sourceRoot":"","sources":["../../src/duct-fitting/selection.tsx"],"names":[],"mappings":"AAqQA;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,QAAA,MAAM,8BAA8B,0CA8CnC,CAAA;eA4iBc,8BAA8B"}
+{"version":3,"file":"selection.d.ts","sourceRoot":"","sources":["../../src/duct-fitting/selection.tsx"],"names":[],"mappings":"AA6QA;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AACH,QAAA,MAAM,8BAA8B,0CAgDnC,CAAA;eA+jBc,8BAA8B"}

package/dist/duct-fitting/selection.js

@@ -1,15 +1,17 @@
 'use client';
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { analyzePortConnectivity, pauseSceneHistory, resolveConnectivityUpdates, resumeSceneHistory, sceneRegistry, useScene, } from '@pascal-app/core';
-import { ARROW_COLOR, EDITOR_LAYER, isTypingTarget, swallowNextClick, triggerSFX, useEditor, } from '@pascal-app/editor';
+import { analyzePortConnectivity, pauseSceneHistory, resolveConnectivityUpdates, resumeSceneHistory, sceneRegistry, useLiveNodeOverrides, useScene, } from '@pascal-app/core';
+import { ARROW_COLOR, AXIS_MOVE_DRAG_LABEL, EDITOR_LAYER, isAngleSnapActive, isGridSnapActive, isMagneticSnapActive, isTypingTarget, ROTATE_HANDLE_DRAG_LABEL, swallowNextClick, triggerSFX, useEditor, } from '@pascal-app/editor';
 import { useViewer } from '@pascal-app/viewer';
 import { createPortal, useFrame, useThree } from '@react-three/fiber';
 import { useEffect, useMemo, useState } from 'react';
 import { BufferGeometry, Euler, Float32BufferAttribute, LineSegments, OrthographicCamera, Plane, Quaternion, Raycaster, SphereGeometry, Vector2, Vector3, } from 'three';
 import { LineBasicNodeMaterial, MeshBasicNodeMaterial } from 'three/webgpu';
-import { INCHES_TO_METERS } from '../duct-segment/geometry.js';
+import { INCHES_TO_METERS } from '../duct-segment/profile.js';
 import { autoOffsetInvalidationUpdates } from '../shared/auto-offset-tag.js';
 import { AXIS_VECTORS, cycleRotationAxis, ROTATE_STEP_RAD, } from '../shared/fitting-rotation.js';
+import { useHandleDragScope } from '../shared/handle-drag-scope.js';
+import { createLivePreview } from '../shared/live-preview.js';
 import { HandleCube, MoveChevron, RotateArc } from '../shared/selection-handles.js';
 import { fittingLegLength } from './ports.js';
 /** Stand-off (meters) from the fitting body to each arrow. */
@@ -203,6 +205,9 @@ const DuctFittingSelectionAffordance = () => {
             if (isTypingTarget(e.target))
                 return;
             e.preventDefault();
+            // Mid-drag, Alt is the turn's free-rotation modifier, not an axis switch.
+            if (useViewer.getState().inputDragging)
+                return;
             cycleRotationAxis();
         };
         window.addEventListener('keydown', onKeyDown);
@@ -232,7 +237,9 @@ const DuctFittingSelectionAffordance = () => {
     const mount = target.parent ?? target;
     return createPortal(_jsx(FittingHandles, { fitting: fitting, target: target }), mount, undefined);
 };
-const FittingHandles = ({ fitting, target }) => {
+const FittingHandles = ({ fitting: storedFitting, target, }) => {
+    const override = useLiveNodeOverrides((state) => state.overrides.get(storedFitting.id));
+    const fitting = override ? { ...storedFitting, ...override } : storedFitting;
     const { camera, gl } = useThree();
     const [frame, setFrame] = useState(null);
     // True while the cluster is latched open. Click the center cube to toggle.
@@ -241,6 +248,7 @@ const FittingHandles = ({ fitting, target }) => {
     // pointer handlers own the gesture), exactly like the duct-segment rig.
     const [dragging, setDragging] = useState(false);
     const [sideSign, setSideSign] = useState(1);
+    const claimHandleDrag = useHandleDragScope();
     const makeRay = (clientX, clientY) => {
         const rect = gl.domElement.getBoundingClientRect();
         const ndc = new Vector2(((clientX - rect.left) / rect.width) * 2 - 1, -((clientY - rect.top) / rect.height) * 2 + 1);
@@ -289,13 +297,17 @@ const FittingHandles = ({ fitting, target }) => {
         return axis === 'x' ? local.x : local.z;
     };
     // Follow-updates for runs / fittings mated to this fitting, given a preview
-    // transform. Endpoints whose ports didn't move resolve to a zero delta.
+    // transform. Endpoints whose ports didn't move resolve to a zero delta. Null
+    // when the mated joints cannot follow the transform.
     const connectivityUpdates = (connectivity, transform) => {
         if (!connectivity)
             return [];
         const preview = { ...fitting, ...transform };
         const nodes = useScene.getState().nodes;
-        return resolveConnectivityUpdates(connectivity, preview)
+        const updates = resolveConnectivityUpdates(connectivity, preview);
+        if (!updates)
+            return null;
+        return updates
             .filter((u) => nodes[u.id])
             .map((u) => {
             const node = nodes[u.id];
@@ -314,89 +326,81 @@ const FittingHandles = ({ fitting, target }) => {
      * the fitting's next transform; the fitting writes it and any mated runs
      * follow via port connectivity. Lands as one undo step.
      */
-    const beginDrag = (cursor, makeCompute) => (e) => {
+    const beginDrag = (handle, cursor, makeCompute) => (e) => {
         e.stopPropagation();
-        const initialPosition = [...fitting.position];
-        const initialRotation = [...fitting.rotation];
         const connectivity = analyzePortConnectivity(fitting, useScene.getState().nodes);
+        const livePreview = createLivePreview();
         const compute = makeCompute(e);
         pauseSceneHistory(useScene);
         useViewer.getState().setInputDragging(true);
         setDragging(true);
         document.body.style.cursor = cursor;
+        const releaseScope = claimHandleDrag(fitting.id, handle, () => {
+            swallowNextClick();
+            finish(false);
+        });
         let current = null;
-        const buildBatch = (t) => [
-            {
-                id: fitting.id,
-                data: preserveFittingParameters(fitting, t),
-            },
-            ...connectivityUpdates(connectivity, t),
-        ];
+        const buildBatch = (t) => {
+            const followers = connectivityUpdates(connectivity, t);
+            return (followers && [
+                {
+                    id: fitting.id,
+                    data: preserveFittingParameters(fitting, t),
+                },
+                ...followers,
+            ]);
+        };
         const onMove = (event) => {
             const next = compute(event);
             if (!next)
                 return;
+            // Joints that cannot follow hold the last frame, which release commits.
+            const batch = buildBatch(next);
+            if (!batch)
+                return;
             current = next;
-            useScene.getState().updateNodes(buildBatch(next));
+            livePreview.publish(batch);
         };
         const cleanup = () => {
             window.removeEventListener('pointermove', onMove);
             window.removeEventListener('pointerup', onUp);
-            window.removeEventListener('pointercancel', onUp);
+            window.removeEventListener('pointercancel', onCancel);
+            releaseScope();
             useViewer.getState().setInputDragging(false);
             setDragging(false);
             if (document.body.style.cursor === cursor)
                 document.body.style.cursor = '';
         };
-        const onUp = () => {
-            // Swallow the trailing synthetic click so it doesn't reach the
-            // background-click deselect handler (cleanup drops `inputDragging`
-            // synchronously here).
-            swallowNextClick();
+        const finish = (commit) => {
             cleanup();
-            // Single-undo dance: revert the fitting AND its followers to the
-            // pre-drag state while history is still paused, resume, then re-apply
-            // the final transform as one tracked change.
-            const reverts = (connectivity?.connections ?? []).map((conn) => {
-                if (conn.kind !== 'rigid-node') {
-                    return { id: conn.nodeId, data: { path: conn.startPath } };
-                }
-                const node = useScene.getState().nodes[conn.nodeId];
-                return {
-                    id: conn.nodeId,
-                    data: node?.type === 'duct-fitting'
-                        ? preserveFittingParameters(node, {
-                            position: conn.startPosition,
-                        })
-                        : { position: conn.startPosition },
-                };
-            });
-            useScene.getState().updateNodes([
-                {
-                    id: fitting.id,
-                    data: preserveFittingParameters(fitting, {
-                        position: initialPosition,
-                        rotation: initialRotation,
-                    }),
-                },
-                ...reverts.filter((u) => useScene.getState().nodes[u.id]),
-            ]);
+            livePreview.clear();
             resumeSceneHistory(useScene);
-            if (current) {
+            if (!commit)
+                return;
+            const batch = current && buildBatch(current);
+            if (batch) {
                 const scene = useScene.getState();
                 scene.updateNodes([
-                    ...buildBatch(current),
+                    ...batch,
                     ...autoOffsetInvalidationUpdates(scene.nodes, fitting.id),
                 ]);
             }
         };
+        const onUp = () => {
+            // Swallow the trailing synthetic click so it doesn't reach the
+            // background-click deselect handler (cleanup drops `inputDragging`
+            // synchronously here).
+            swallowNextClick();
+            finish(true);
+        };
+        const onCancel = () => finish(false);
         window.addEventListener('pointermove', onMove);
         window.addEventListener('pointerup', onUp);
-        window.addEventListener('pointercancel', onUp);
+        window.addEventListener('pointercancel', onCancel);
     };
     // Move: translate the fitting along one world axis, anchored to the cursor's
-    // start coord so it doesn't jump on grab. Y is clamped at the floor; Shift
-    // bypasses grid snapping.
+    // start coord so it doesn't jump on grab. Y is clamped at the floor; the
+    // step follows the grid snap mode, and held Alt slides freely.
     const moveCompute = (axis) => (e) => {
         const anchorWorld = toWorld(fitting.position);
         const start = sampleAxis(axis, e.nativeEvent.clientX, e.nativeEvent.clientY, anchorWorld);
@@ -409,7 +413,7 @@ const FittingHandles = ({ fitting, target }) => {
             const s = sampleAxis(axis, event.clientX, event.clientY, anchorWorld);
             if (s === null)
                 return null;
-            const step = event.shiftKey ? 0 : useEditor.getState().gridSnapStep;
+            const step = !event.altKey && isGridSnapActive() ? useEditor.getState().gridSnapStep : 0;
             const delta = snap(s - start, step);
             if (delta === lastDelta)
                 return null;
@@ -451,12 +455,13 @@ const FittingHandles = ({ fitting, target }) => {
             const b = bearing(event.clientX, event.clientY);
             if (b === null)
                 return null;
-            // Snap the turn to 45° steps; Shift = smooth (no snap).
+            // Snap the turn to 45° steps while angle snapping is on; held Alt turns freely.
             const raw = b - startBearing;
-            const delta = event.shiftKey ? raw : Math.round(raw / ROTATE_STEP_RAD) * ROTATE_STEP_RAD;
+            const snapped = !event.altKey && isAngleSnapActive();
+            const delta = snapped ? Math.round(raw / ROTATE_STEP_RAD) * ROTATE_STEP_RAD : raw;
             // Tick the rotate SFX each time a fresh snap step is crossed (snapped
-            // turns only — a smooth Shift-drag has no discrete steps to mark).
-            if (!event.shiftKey) {
+            // turns only — a free turn has no discrete steps to mark).
+            if (snapped) {
                 const step = Math.round(raw / ROTATE_STEP_RAD);
                 if (step !== lastStep) {
                     lastStep = step;
@@ -471,7 +476,7 @@ const FittingHandles = ({ fitting, target }) => {
     const beginDimensionDrag = (dimension, axisLocal, cursor) => (e) => {
         e.stopPropagation();
         const baseValue = fitting[dimension];
-        const initialPatch = { [dimension]: baseValue };
+        const livePreview = createLivePreview();
         const centerWorld = toWorld(fitting.position);
         const axisWorld = axisToWorld(fitting.position, axisLocal);
         const start = sampleAxisParameter(e.nativeEvent.clientX, e.nativeEvent.clientY, centerWorld, axisWorld);
@@ -480,49 +485,56 @@ const FittingHandles = ({ fitting, target }) => {
         useViewer.getState().setInputDragging(true);
         setDragging(true);
         document.body.style.cursor = cursor;
+        const releaseScope = claimHandleDrag(fitting.id, `resize-${dimension}`, () => {
+            swallowNextClick();
+            finish(false);
+        });
         let current = null;
         let lastValue = Number.NaN;
-        const apply = (patch) => {
-            useScene.getState().updateNodes([
-                {
-                    id: fitting.id,
-                    data: preserveFittingParameters(fitting, patch),
-                },
-            ]);
-        };
+        const update = (patch) => [
+            { id: fitting.id, data: preserveFittingParameters(fitting, patch) },
+        ];
         const onMove = (event) => {
             const rawDeltaM = sampleAxisParameter(event.clientX, event.clientY, centerWorld, axisWorld) - start;
             const deltaIn = (rawDeltaM / INCHES_TO_METERS) * 2;
             const nextRaw = baseValue + deltaIn;
-            const nextValue = clamp(event.shiftKey ? nextRaw : snap(nextRaw, RESIZE_STEP_IN), min, max);
+            // A size has no alignment lines to pull to, so either snapping mode
+            // steps it; held Alt sizes freely.
+            const snapped = !event.altKey && (isGridSnapActive() || isMagneticSnapActive());
+            const nextValue = clamp(snapped ? snap(nextRaw, RESIZE_STEP_IN) : nextRaw, min, max);
             if (nextValue === lastValue)
                 return;
             lastValue = nextValue;
             current = { [dimension]: nextValue };
-            if (!event.shiftKey)
+            if (snapped)
                 triggerSFX('sfx:grid-snap');
-            apply(current);
+            livePreview.publish(update(current));
         };
         const cleanup = () => {
             window.removeEventListener('pointermove', onMove);
             window.removeEventListener('pointerup', onUp);
-            window.removeEventListener('pointercancel', onUp);
+            window.removeEventListener('pointercancel', onCancel);
+            releaseScope();
             useViewer.getState().setInputDragging(false);
             setDragging(false);
             if (document.body.style.cursor === cursor)
                 document.body.style.cursor = '';
         };
-        const onUp = () => {
-            swallowNextClick();
+        const finish = (commit) => {
             cleanup();
-            apply(initialPatch);
+            livePreview.clear();
             resumeSceneHistory(useScene);
-            if (current)
-                apply(current);
+            if (commit && current)
+                useScene.getState().updateNodes(update(current));
+        };
+        const onUp = () => {
+            swallowNextClick();
+            finish(true);
         };
+        const onCancel = () => finish(false);
         window.addEventListener('pointermove', onMove);
         window.addEventListener('pointerup', onUp);
-        window.addEventListener('pointercancel', onUp);
+        window.addEventListener('pointercancel', onCancel);
     };
     const extent = useMemo(() => fittingExtentM(fitting), [fitting]);
     const p = fitting.position;
@@ -671,6 +683,6 @@ const FittingHandles = ({ fitting, target }) => {
         return _jsx("group", { ref: setFrame });
     }
     return (_jsxs("group", { ref: setFrame, children: [_jsx(HandleCube, { active: open, onClick: () => setOpen((o) => !o), position: p }), !open &&
-                resizeHandles.map((handle) => (_jsxs("group", { children: [_jsx(DashedResizeGuide, { from: handle.guideFrom, to: handle.guideTo }), _jsx(ResizeSphereHandle, { cursor: handle.cursor, onPointerDown: beginDimensionDrag(handle.key, handle.axis, handle.cursor), position: handle.position })] }, handle.key))), open && (_jsxs(_Fragment, { children: [moveArrows.map((a) => (_jsx(MoveChevron, { cursor: a.cursor, onPointerDown: beginDrag(a.axis === 'y' ? 'ns-resize' : 'grabbing', moveCompute(a.axis)), position: a.position, rotationY: a.rotationY, vertical: a.vertical }, a.key))), rotateArcs.map((arc) => (_jsx(RotateArc, { onPointerDown: beginDrag('grabbing', rotateCompute(arc.axis)), position: arc.position, rotation: arc.rotation }, arc.key)))] }))] }));
+                resizeHandles.map((handle) => (_jsxs("group", { children: [_jsx(DashedResizeGuide, { from: handle.guideFrom, to: handle.guideTo }), _jsx(ResizeSphereHandle, { cursor: handle.cursor, onPointerDown: beginDimensionDrag(handle.key, handle.axis, handle.cursor), position: handle.position })] }, handle.key))), open && (_jsxs(_Fragment, { children: [moveArrows.map((a) => (_jsx(MoveChevron, { cursor: a.cursor, onPointerDown: beginDrag(AXIS_MOVE_DRAG_LABEL, a.axis === 'y' ? 'ns-resize' : 'grabbing', moveCompute(a.axis)), position: a.position, rotationY: a.rotationY, vertical: a.vertical }, a.key))), rotateArcs.map((arc) => (_jsx(RotateArc, { onPointerDown: beginDrag(ROTATE_HANDLE_DRAG_LABEL, 'grabbing', rotateCompute(arc.axis)), position: arc.position, rotation: arc.rotation }, arc.key)))] }))] }));
 };
 export default DuctFittingSelectionAffordance;

package/dist/duct-segment/continuation-handle.d.ts

@@ -0,0 +1,8 @@
+import type { AnyNode, DuctSegmentNode } from '@pascal-app/core';
+import type { ScenePort } from '@pascal-app/editor/distribution';
+import { type RunContinuationHandlePlan } from '../shared/elbow-branch-continuation.js';
+export type DuctEndpoint = 'start' | 'end';
+export declare function ductEndpointPort(duct: DuctSegmentNode, endpoint: DuctEndpoint): ScenePort | null;
+export declare function ductContinuationHandlePoint(duct: DuctSegmentNode, endpoint: DuctEndpoint, gap?: number): [number, number, number] | null;
+export declare function ductContinuationHandlePlan(duct: DuctSegmentNode, endpoint: DuctEndpoint, nodes: Readonly<Record<string, AnyNode>>, gap?: number): RunContinuationHandlePlan | null;
+//# sourceMappingURL=continuation-handle.d.ts.map

package/dist/duct-segment/continuation-handle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"continuation-handle.d.ts","sourceRoot":"","sources":["../../src/duct-segment/continuation-handle.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAA;AAChE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAA;AAChE,OAAO,EACL,KAAK,yBAAyB,EAE/B,MAAM,qCAAqC,CAAA;AAG5C,MAAM,MAAM,YAAY,GAAG,OAAO,GAAG,KAAK,CAAA;AAE1C,wBAAgB,gBAAgB,CAAC,IAAI,EAAE,eAAe,EAAE,QAAQ,EAAE,YAAY,GAAG,SAAS,GAAG,IAAI,CAkBhG;AAED,wBAAgB,2BAA2B,CACzC,IAAI,EAAE,eAAe,EACrB,QAAQ,EAAE,YAAY,EACtB,GAAG,SAAO,GACT,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,GAAG,IAAI,CAQjC;AAED,wBAAgB,0BAA0B,CACxC,IAAI,EAAE,eAAe,EACrB,QAAQ,EAAE,YAAY,EACtB,KAAK,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,EACxC,GAAG,SAAO,GACT,yBAAyB,GAAG,IAAI,CAGlC"}