@pascal-app/nodes 0.1.1

package/dist/fence/tool.js

@@ -0,0 +1,563 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { calculateLevelMiters, collectAlignmentAnchors, emitter, getTwoPointFenceCurveTangents, getWallMiterBoundaryPoints, resolveAlignment, sampleFenceSpline, useScene, } from '@pascal-app/core';
+import { CursorSphere, createFenceOnCurrentLevel, createSplineFenceOnCurrentLevel, EDITOR_LAYER, formatAngleRadians, formatLinearMeasurement, getAngleArcToSegmentReference, getAngleToSegmentReference, getSegmentAngleReferenceAtPoint, getSegmentGridStep, isAlignmentGuideActive, isAngleSnapActive, isGridSnapActive, isMagneticSnapActive, markToolCancelConsumed, snapFenceDraftPoint, snapScalarToGrid, triggerSFX, useAlignmentGuides, useEditor, useFenceCurveDraft, useSegmentDraftChain, } from '@pascal-app/editor';
+import { getSceneTheme, useViewer } from '@pascal-app/viewer';
+import { Html } from '@react-three/drei';
+import { useEffect, useMemo, useRef, useState } from 'react';
+import { BoxGeometry, BufferGeometry, DoubleSide, Vector3 } from 'three';
+const FENCE_PREVIEW_HEIGHT = 1.8;
+const FENCE_PREVIEW_THICKNESS = 0.08;
+/** Figma-style alignment-snap threshold (meters), matching the move tools. */
+const ALIGNMENT_THRESHOLD_M = 0.08;
+// HUD label heights are measured from the top of the preview bar, so they
+// track whatever height a seeded preset draws at (`previewHeight`).
+const DRAFT_LABEL_Y_OFFSET = 0.22;
+const DRAFT_ANGLE_LABEL_Y_OFFSET = 0.08;
+const DRAFT_ANGLE_ARC_Y_OFFSET = 0.012;
+const DRAFT_ANGLE_ARC_MIN_RADIUS = 0.32;
+const DRAFT_ANGLE_ARC_MAX_RADIUS = 0.72;
+const DRAFT_ANGLE_ARC_SEGMENTS = 24;
+function clamp(value, min, max) {
+    return Math.min(max, Math.max(min, value));
+}
+function distanceSquared(a, b) {
+    const dx = a[0] - b[0];
+    const dz = a[1] - b[1];
+    return dx * dx + dz * dz;
+}
+function pointMatches(a, b, tolerance = 1e-5) {
+    return distanceSquared(a, b) <= tolerance * tolerance;
+}
+function toFencePlanPoint(point) {
+    return [point.x, point.y];
+}
+function toMiterWall(segment) {
+    return {
+        object: 'node',
+        id: segment.id,
+        type: 'wall',
+        name: 'Fence reference',
+        parentId: null,
+        visible: true,
+        metadata: {},
+        children: [],
+        start: segment.start,
+        end: segment.end,
+        thickness: segment.thickness,
+        curveOffset: segment.curveOffset,
+        frontSide: 'unknown',
+        backSide: 'unknown',
+    };
+}
+function buildDraftFenceSegment(start, end, thickness) {
+    return {
+        id: 'fence_draft',
+        start,
+        end,
+        thickness,
+    };
+}
+function getSegmentEndpointKind(point, segment) {
+    if (pointMatches(point, segment.start))
+        return 'start';
+    if (pointMatches(point, segment.end))
+        return 'end';
+    return null;
+}
+function getFenceFaceAngleCandidates(point, segment, miterData) {
+    const endpoint = getSegmentEndpointKind(point, segment);
+    const reference = getSegmentAngleReferenceAtPoint(point, segment);
+    if (!(endpoint && reference))
+        return [];
+    const boundaryPoints = getWallMiterBoundaryPoints(toMiterWall(segment), miterData);
+    if (!boundaryPoints)
+        return [];
+    const points = endpoint === 'start'
+        ? [boundaryPoints.startLeft, boundaryPoints.startRight]
+        : [boundaryPoints.endLeft, boundaryPoints.endRight];
+    return points.map((facePoint, index) => ({
+        index,
+        point: toFencePlanPoint(facePoint),
+        vector: reference.vector,
+    }));
+}
+function getMatchingFaceAnglePairs(draftCandidates, connectedCandidates) {
+    const candidates = [];
+    for (const draftCandidate of draftCandidates) {
+        for (const connectedCandidate of connectedCandidates) {
+            candidates.push({
+                draft: draftCandidate,
+                connected: connectedCandidate,
+                distance: distanceSquared(draftCandidate.point, connectedCandidate.point),
+            });
+        }
+    }
+    candidates.sort((a, b) => a.distance - b.distance);
+    const exactPairs = candidates.filter((pair) => pair.distance <= 1e-6);
+    const sourcePairs = exactPairs.length > 0 ? exactPairs : candidates.slice(0, 1);
+    const usedDraftIndexes = new Set();
+    const usedConnectedIndexes = new Set();
+    const pairs = [];
+    for (const pair of sourcePairs) {
+        if (usedDraftIndexes.has(pair.draft.index) || usedConnectedIndexes.has(pair.connected.index)) {
+            continue;
+        }
+        usedDraftIndexes.add(pair.draft.index);
+        usedConnectedIndexes.add(pair.connected.index);
+        pairs.push(pair);
+        if (pairs.length === 2)
+            break;
+    }
+    return pairs;
+}
+function getAngleSource(endpointPoint, endpointDraftVector, connectedReference, facePairs) {
+    if (facePairs.length === 0) {
+        return {
+            arcCenter: endpointPoint,
+            connectedVector: connectedReference.vector,
+            draftVector: endpointDraftVector,
+        };
+    }
+    const arc = getAngleArcToSegmentReference(endpointDraftVector, connectedReference);
+    const angleDirection = arc
+        ? [Math.cos(arc.midAngle), Math.sin(arc.midAngle)]
+        : [endpointDraftVector[0], endpointDraftVector[1]];
+    const bestPair = facePairs
+        .map((pair) => {
+        const arcCenter = [
+            (pair.draft.point[0] + pair.connected.point[0]) / 2,
+            (pair.draft.point[1] + pair.connected.point[1]) / 2,
+        ];
+        const fromEndpoint = [
+            arcCenter[0] - endpointPoint[0],
+            arcCenter[1] - endpointPoint[1],
+        ];
+        return {
+            pair,
+            score: fromEndpoint[0] * angleDirection[0] + fromEndpoint[1] * angleDirection[1],
+        };
+    })
+        .sort((a, b) => b.score - a.score)[0]?.pair ?? facePairs[0];
+    return {
+        arcCenter: [
+            (bestPair.draft.point[0] + bestPair.connected.point[0]) / 2,
+            (bestPair.draft.point[1] + bestPair.connected.point[1]) / 2,
+        ],
+        connectedVector: bestPair.connected.vector,
+        draftVector: bestPair.draft.vector,
+    };
+}
+function getDraftAngleLabels(start, end, segments, baseY, previewHeight, previewThickness) {
+    const draftFromStart = [end[0] - start[0], end[1] - start[1]];
+    const draftFromEnd = [start[0] - end[0], start[1] - end[1]];
+    const draftSegment = buildDraftFenceSegment(start, end, previewThickness);
+    const miterData = calculateLevelMiters([...segments, draftSegment].map(toMiterWall));
+    const endpoints = [
+        { id: 'start', point: start, draftVector: draftFromStart },
+        { id: 'end', point: end, draftVector: draftFromEnd },
+    ];
+    const labels = [];
+    for (const endpoint of endpoints) {
+        const connectedSegment = segments.find((segment) => Boolean(getSegmentAngleReferenceAtPoint(endpoint.point, segment)));
+        if (!connectedSegment)
+            continue;
+        const connectedReference = getSegmentAngleReferenceAtPoint(endpoint.point, connectedSegment);
+        if (!connectedReference)
+            continue;
+        const draftFaceCandidates = getFenceFaceAngleCandidates(endpoint.point, draftSegment, miterData);
+        const connectedFaceCandidates = getFenceFaceAngleCandidates(endpoint.point, connectedSegment, miterData);
+        const facePairs = getMatchingFaceAnglePairs(draftFaceCandidates, connectedFaceCandidates);
+        const { arcCenter, connectedVector, draftVector } = getAngleSource(endpoint.point, endpoint.draftVector, connectedReference, facePairs);
+        const angle = getAngleToSegmentReference(draftVector, {
+            ...connectedReference,
+            vector: connectedVector,
+        });
+        if (angle === null)
+            continue;
+        const arc = getAngleArcToSegmentReference(draftVector, {
+            ...connectedReference,
+            vector: connectedVector,
+        });
+        if (!arc || arc.angle < 0.01)
+            continue;
+        const draftLength = Math.hypot(draftVector[0], draftVector[1]);
+        const referenceLength = Math.hypot(connectedVector[0], connectedVector[1]);
+        const radius = clamp(Math.min(draftLength, referenceLength) * 0.28, DRAFT_ANGLE_ARC_MIN_RADIUS, DRAFT_ANGLE_ARC_MAX_RADIUS);
+        labels.push({
+            id: endpoint.id,
+            label: formatAngleRadians(angle),
+            position: [
+                arcCenter[0] + Math.cos(arc.midAngle) * (radius + 0.16),
+                baseY + previewHeight + DRAFT_ANGLE_LABEL_Y_OFFSET,
+                arcCenter[1] + Math.sin(arc.midAngle) * (radius + 0.16),
+            ],
+            arc: {
+                center: arcCenter,
+                radius,
+                startAngle: arc.startAngle,
+                endAngle: arc.endAngle,
+                y: baseY + previewHeight + DRAFT_ANGLE_ARC_Y_OFFSET,
+            },
+        });
+    }
+    return labels;
+}
+function getDraftMeasurementState(start, end, segments, unit, baseY, previewHeight, previewThickness) {
+    const dx = end[0] - start[0];
+    const dz = end[1] - start[1];
+    const length = Math.hypot(dx, dz);
+    if (length < 0.01)
+        return null;
+    return {
+        lengthLabel: formatLinearMeasurement(length, unit),
+        lengthPosition: [
+            (start[0] + end[0]) / 2,
+            baseY + previewHeight + DRAFT_LABEL_Y_OFFSET,
+            (start[1] + end[1]) / 2,
+        ],
+        angleLabels: getDraftAngleLabels(start, end, segments, baseY, previewHeight, previewThickness),
+    };
+}
+function getReferenceSegments(walls, fences) {
+    return [
+        ...walls.map((wall) => ({
+            id: wall.id,
+            start: wall.start,
+            end: wall.end,
+            curveOffset: wall.curveOffset,
+            thickness: wall.thickness,
+        })),
+        ...fences.map((fence) => ({
+            id: fence.id,
+            start: fence.start,
+            end: fence.end,
+            curveOffset: fence.curveOffset,
+            thickness: fence.thickness,
+        })),
+    ];
+}
+function updateFencePreview(mesh, start, end, previewHeight, previewThickness) {
+    const direction = new Vector3(end.x - start.x, 0, end.z - start.z);
+    const length = direction.length();
+    if (length < 0.01) {
+        mesh.visible = false;
+        return;
+    }
+    mesh.visible = true;
+    direction.normalize();
+    const geometry = new BoxGeometry(length, previewHeight, previewThickness);
+    const angle = Math.atan2(direction.z, direction.x);
+    mesh.position.set((start.x + end.x) / 2, start.y + previewHeight / 2, (start.z + end.z) / 2);
+    mesh.rotation.y = -angle;
+    if (mesh.geometry) {
+        mesh.geometry.dispose();
+    }
+    mesh.geometry = geometry;
+}
+function getCurrentLevelElements() {
+    const currentLevelId = useViewer.getState().selection.levelId;
+    const { nodes } = useScene.getState();
+    if (!currentLevelId)
+        return { walls: [], fences: [] };
+    const levelNode = nodes[currentLevelId];
+    if (levelNode?.type !== 'level')
+        return { walls: [], fences: [] };
+    const children = levelNode.children.map((childId) => nodes[childId]);
+    return {
+        walls: children.filter((n) => n?.type === 'wall'),
+        fences: children.filter((n) => n?.type === 'fence'),
+    };
+}
+export const FenceTool = () => {
+    const fenceMode = useEditor((s) => s.continuationByContext.fence);
+    if (fenceMode === 'curved') {
+        return _jsx(SplineFenceDraft, {});
+    }
+    return _jsx(StraightFenceTool, {});
+};
+const StraightFenceTool = () => {
+    const unit = useViewer((state) => state.unit);
+    const isDark = useViewer((state) => getSceneTheme(state.sceneTheme).appearance === 'dark');
+    // A placed preset seeds `toolDefaults.fence` before the tool mounts, so
+    // the draft preview is drawn at the preset's height / thickness rather
+    // than the generic fallbacks. Read through refs so the live event
+    // handlers below see the latest values without re-subscribing.
+    const fenceDefaults = useEditor((s) => s.toolDefaults.fence);
+    const previewHeight = typeof fenceDefaults?.height === 'number' ? fenceDefaults.height : FENCE_PREVIEW_HEIGHT;
+    const previewThickness = typeof fenceDefaults?.thickness === 'number' ? fenceDefaults.thickness : FENCE_PREVIEW_THICKNESS;
+    const previewHeightRef = useRef(previewHeight);
+    previewHeightRef.current = previewHeight;
+    const previewThicknessRef = useRef(previewThickness);
+    previewThicknessRef.current = previewThickness;
+    const cursorRef = useRef(null);
+    const previewRef = useRef(null);
+    const startingPoint = useRef(new Vector3(0, 0, 0));
+    const endingPoint = useRef(new Vector3(0, 0, 0));
+    const buildingState = useRef(0);
+    const [draftMeasurement, setDraftMeasurement] = useState(null);
+    const measurementColor = isDark ? '#ffffff' : '#111111';
+    const measurementShadowColor = isDark ? '#111111' : '#ffffff';
+    // Scope seeded defaults to this tool session: clear on deactivation so a
+    // later manual fence draw isn't drawn with a stale preset's parameters.
+    // Unmount-only (empty deps) — the [unit] effect below must not clear it.
+    useEffect(() => () => useEditor.getState().setToolDefaults('fence', null), []);
+    useEffect(() => {
+        let previousFenceEnd = null;
+        // Alignment candidates — anchors of every alignable object. Refreshed
+        // after each segment commits (the new fence becomes a candidate too).
+        let alignmentCandidates = collectAlignmentAnchors(useScene.getState().nodes, '');
+        const refreshAlignmentCandidates = () => {
+            alignmentCandidates = collectAlignmentAnchors(useScene.getState().nodes, '');
+        };
+        // Align the drafted point onto another object's nearest real anchor and
+        // publish the guide. Returns the possibly snapped point.
+        const alignPoint = (point, options) => {
+            // Figma alignment lines onto existing corners / edges are DISPLAYED in
+            // every mode except Off (isAlignmentGuideActive); the magnetic pull onto
+            // them is applied only in 'lines' mode (isMagneticSnapActive).
+            if (!isAlignmentGuideActive() || alignmentCandidates.length === 0) {
+                useAlignmentGuides.getState().clear();
+                return point;
+            }
+            const ar = resolveAlignment({
+                moving: [{ nodeId: '__fence-draft__', kind: 'corner', x: point[0], z: point[1] }],
+                candidates: alignmentCandidates,
+                threshold: ALIGNMENT_THRESHOLD_M,
+            });
+            useAlignmentGuides.getState().set(ar.guides);
+            return ar.snap && options?.applySnap !== false && isMagneticSnapActive()
+                ? [point[0] + ar.snap.dx, point[1] + ar.snap.dz]
+                : point;
+        };
+        const stopDrafting = () => {
+            buildingState.current = 0;
+            previewRef.current.visible = false;
+            setDraftMeasurement(null);
+            useSegmentDraftChain.getState().clear('fence');
+            useAlignmentGuides.getState().clear();
+        };
+        const onGridMove = (event) => {
+            if (!(cursorRef.current && previewRef.current))
+                return;
+            const { walls, fences } = getCurrentLevelElements();
+            const localPoint = [event.localPosition[0], event.localPosition[2]];
+            // While drafting, the segment locks to 15° rays from its start.
+            // Snapping is governed by the snapping mode (`'off'` is the bypass);
+            // there is no Shift hold-to-bypass. Alignment follows the magnetic snap
+            // mode, not Alt (continuation is cycled through the HUD / C).
+            if (buildingState.current === 1) {
+                const angleLocked = isAngleSnapActive();
+                const snappedLocal = alignPoint(snapFenceDraftPoint({
+                    point: localPoint,
+                    walls,
+                    fences,
+                    start: angleLocked ? [startingPoint.current.x, startingPoint.current.z] : undefined,
+                    angleSnap: angleLocked,
+                    magnetic: isMagneticSnapActive(),
+                }), { applySnap: !angleLocked });
+                endingPoint.current.set(snappedLocal[0], event.localPosition[1], snappedLocal[1]);
+                cursorRef.current.position.copy(endingPoint.current);
+                const currentFenceEnd = [snappedLocal[0], snappedLocal[1]];
+                if (previousFenceEnd &&
+                    (currentFenceEnd[0] !== previousFenceEnd[0] || currentFenceEnd[1] !== previousFenceEnd[1])) {
+                    triggerSFX('sfx:grid-snap');
+                }
+                previousFenceEnd = currentFenceEnd;
+                updateFencePreview(previewRef.current, startingPoint.current, endingPoint.current, previewHeightRef.current, previewThicknessRef.current);
+                setDraftMeasurement(getDraftMeasurementState([startingPoint.current.x, startingPoint.current.z], snappedLocal, getReferenceSegments(walls, fences), unit, startingPoint.current.y, previewHeightRef.current, previewThicknessRef.current));
+            }
+            else {
+                const snappedPoint = alignPoint(snapFenceDraftPoint({
+                    point: localPoint,
+                    walls,
+                    fences,
+                    magnetic: isMagneticSnapActive(),
+                }));
+                cursorRef.current.position.set(snappedPoint[0], event.localPosition[1], snappedPoint[1]);
+                setDraftMeasurement(null);
+            }
+        };
+        const onGridClick = (event) => {
+            if (!previewRef.current)
+                return;
+            if (buildingState.current === 1 && event.nativeEvent.detail >= 2) {
+                stopDrafting();
+                return;
+            }
+            const { walls, fences } = getCurrentLevelElements();
+            const localClick = [event.localPosition[0], event.localPosition[2]];
+            if (buildingState.current === 0) {
+                const snappedStart = alignPoint(snapFenceDraftPoint({
+                    point: localClick,
+                    walls,
+                    fences,
+                    magnetic: isMagneticSnapActive(),
+                }));
+                startingPoint.current.set(snappedStart[0], event.localPosition[1], snappedStart[1]);
+                endingPoint.current.copy(startingPoint.current);
+                buildingState.current = 1;
+                triggerSFX('sfx:structure-build-start');
+                previewRef.current.visible = true;
+                setDraftMeasurement(null);
+            }
+            else {
+                const angleLocked = isAngleSnapActive();
+                const snappedEnd = alignPoint(snapFenceDraftPoint({
+                    point: localClick,
+                    walls,
+                    fences,
+                    start: angleLocked ? [startingPoint.current.x, startingPoint.current.z] : undefined,
+                    angleSnap: angleLocked,
+                    magnetic: isMagneticSnapActive(),
+                }), { applySnap: !angleLocked });
+                const dx = snappedEnd[0] - startingPoint.current.x;
+                const dz = snappedEnd[1] - startingPoint.current.z;
+                if (dx * dx + dz * dz < 0.01 * 0.01)
+                    return;
+                const createdFence = createFenceOnCurrentLevel([startingPoint.current.x, startingPoint.current.z], snappedEnd);
+                if (!createdFence)
+                    return;
+                // The new segment is now a real node — make it an alignment target
+                // for the next segment, and drop the just-shown guide.
+                refreshAlignmentCandidates();
+                useAlignmentGuides.getState().clear();
+                // Single mode commits one segment per click: stop drafting so the next
+                // click starts a fresh segment instead of chaining off this endpoint.
+                if (useEditor.getState().getContinuation('fence') === 'single') {
+                    stopDrafting();
+                    return;
+                }
+                const nextStart = createdFence.end;
+                // Publish the resolved chain start so the 2D floor-plan draft
+                // chains its next segment from the same point (its own snap
+                // pipeline can resolve a slightly different endpoint).
+                useSegmentDraftChain.getState().setChainStart('fence', [nextStart[0], nextStart[1]]);
+                startingPoint.current.set(nextStart[0], event.localPosition[1], nextStart[1]);
+                endingPoint.current.copy(startingPoint.current);
+                cursorRef.current?.position.copy(startingPoint.current);
+                previewRef.current.visible = false;
+                buildingState.current = 1;
+                setDraftMeasurement(null);
+            }
+        };
+        const onCancel = () => {
+            if (buildingState.current === 1) {
+                markToolCancelConsumed();
+                stopDrafting();
+            }
+        };
+        emitter.on('grid:move', onGridMove);
+        emitter.on('grid:click', onGridClick);
+        emitter.on('tool:cancel', onCancel);
+        return () => {
+            emitter.off('grid:move', onGridMove);
+            emitter.off('grid:click', onGridClick);
+            emitter.off('tool:cancel', onCancel);
+            useSegmentDraftChain.getState().clear('fence');
+            useAlignmentGuides.getState().clear();
+        };
+    }, [unit]);
+    return (_jsxs("group", { children: [_jsx(CursorSphere, { height: previewHeight, ref: cursorRef }), _jsxs("mesh", { layers: EDITOR_LAYER, ref: previewRef, renderOrder: 1, visible: false, children: [_jsx("shapeGeometry", {}), _jsx("meshBasicMaterial", { color: "#ffffff", depthTest: false, depthWrite: false, opacity: 0.45, side: DoubleSide, transparent: true })] }), draftMeasurement && (_jsxs(_Fragment, { children: [_jsx(DraftMeasurementLabel, { color: measurementColor, label: draftMeasurement.lengthLabel, position: draftMeasurement.lengthPosition, shadowColor: measurementShadowColor }), draftMeasurement.angleLabels.map((angleLabel) => (_jsxs("group", { children: [_jsx(DraftAngleArc, { arc: angleLabel.arc, color: measurementColor }), _jsx(DraftMeasurementLabel, { color: measurementColor, label: angleLabel.label, position: angleLabel.position, shadowColor: measurementShadowColor })] }, angleLabel.id)))] }))] }));
+};
+const SPLINE_PREVIEW_COLOR = '#8381ed';
+const SPLINE_PREVIEW_SEGMENTS = 40;
+const SplineFenceDraft = () => {
+    const previewHeight = typeof useEditor.getState().toolDefaults.fence?.height === 'number'
+        ? useEditor.getState().toolDefaults.fence?.height
+        : FENCE_PREVIEW_HEIGHT;
+    const [draftPoints, setDraftPoints] = useState([]);
+    const [cursor, setCursor] = useState(null);
+    const draftRef = useRef(draftPoints);
+    draftRef.current = draftPoints;
+    // Mirror the draft length into the HUD store so the "finish curve" hint only
+    // shows once drafting has started; always clear it when the tool unmounts.
+    useEffect(() => {
+        useFenceCurveDraft.getState().setPointCount(draftPoints.length);
+    }, [draftPoints]);
+    useEffect(() => () => useFenceCurveDraft.getState().reset(), []);
+    useEffect(() => () => useEditor.getState().setToolDefaults('fence', null), []);
+    useEffect(() => {
+        const snapPoint = (local) => {
+            const step = isGridSnapActive() ? getSegmentGridStep() : 0;
+            if (step <= 0)
+                return local;
+            return [snapScalarToGrid(local[0], step), snapScalarToGrid(local[1], step)];
+        };
+        const commit = () => {
+            const points = draftRef.current;
+            if (points.length >= 2) {
+                const created = createSplineFenceOnCurrentLevel(points);
+                if (created) {
+                    triggerSFX('sfx:item-place');
+                    // Once the new curve fence is selected for direct editing, leave
+                    // placement mode so the toolbar matches the active interaction.
+                    useViewer.getState().setSelection({ selectedIds: [created.id] });
+                    useEditor.getState().setTool(null);
+                    useEditor.getState().setMode('select');
+                }
+            }
+            setDraftPoints([]);
+            setCursor(null);
+        };
+        const onMove = (event) => {
+            setCursor(snapPoint([event.localPosition[0], event.localPosition[2]]));
+        };
+        const onClick = (event) => {
+            if (event.nativeEvent.detail >= 2) {
+                commit();
+                return;
+            }
+            const point = snapPoint([event.localPosition[0], event.localPosition[2]]);
+            triggerSFX('sfx:grid-snap');
+            setDraftPoints((prev) => [...prev, point]);
+        };
+        const onKeyDown = (event) => {
+            if (event.key === 'Enter')
+                commit();
+        };
+        const onCancel = () => {
+            if (draftRef.current.length === 0)
+                return;
+            markToolCancelConsumed();
+            setDraftPoints((prev) => prev.slice(0, -1));
+        };
+        emitter.on('grid:move', onMove);
+        emitter.on('grid:click', onClick);
+        emitter.on('tool:cancel', onCancel);
+        window.addEventListener('keydown', onKeyDown);
+        return () => {
+            emitter.off('grid:move', onMove);
+            emitter.off('grid:click', onClick);
+            emitter.off('tool:cancel', onCancel);
+            window.removeEventListener('keydown', onKeyDown);
+        };
+    }, []);
+    const previewPoints = cursor ? [...draftPoints, cursor] : draftPoints;
+    const curveGeometry = useMemo(() => {
+        if (previewPoints.length < 2)
+            return null;
+        const sampled = sampleFenceSpline(previewPoints, getTwoPointFenceCurveTangents(previewPoints), SPLINE_PREVIEW_SEGMENTS);
+        return new BufferGeometry().setFromPoints(sampled.map((point) => new Vector3(point.x, previewHeight, point.y)));
+    }, [previewHeight, previewPoints]);
+    return (_jsxs("group", { children: [cursor && _jsx(CursorSphere, { height: previewHeight, position: [cursor[0], 0, cursor[1]] }), draftPoints.map((point, index) => (_jsxs("mesh", { layers: EDITOR_LAYER, position: [point[0], previewHeight, point[1]], children: [_jsx("sphereGeometry", { args: [0.07, 16, 12] }), _jsx("meshBasicMaterial", { color: SPLINE_PREVIEW_COLOR, depthTest: false })] }, `fence-spline-pt-${index}`))), curveGeometry && (_jsx("line", { frustumCulled: false, geometry: curveGeometry, layers: EDITOR_LAYER, renderOrder: 2, children: _jsx("lineBasicNodeMaterial", { color: SPLINE_PREVIEW_COLOR, depthTest: false, depthWrite: false, linewidth: 2, opacity: 0.95, transparent: true }) }))] }));
+};
+function DraftAngleArc({ arc, color }) {
+    const geometry = useMemo(() => {
+        const segmentCount = Math.max(8, Math.ceil((Math.abs(arc.endAngle - arc.startAngle) / Math.PI) * DRAFT_ANGLE_ARC_SEGMENTS));
+        const points = Array.from({ length: segmentCount + 1 }, (_, index) => {
+            const t = index / segmentCount;
+            const angle = arc.startAngle + (arc.endAngle - arc.startAngle) * t;
+            return new Vector3(arc.center[0] + Math.cos(angle) * arc.radius, arc.y, arc.center[1] + Math.sin(angle) * arc.radius);
+        });
+        return new BufferGeometry().setFromPoints(points);
+    }, [arc]);
+    return (_jsx("line", { frustumCulled: false, geometry: geometry, layers: EDITOR_LAYER, renderOrder: 2, children: _jsx("lineBasicNodeMaterial", { color: color, depthTest: false, depthWrite: false, linewidth: 2, opacity: 0.95, transparent: true }) }));
+}
+function DraftMeasurementLabel({ color, label, position, shadowColor, }) {
+    return (_jsx(Html, { center: true, position: position, style: { pointerEvents: 'none', userSelect: 'none' }, zIndexRange: [100, 0], children: _jsx("div", { className: "whitespace-nowrap font-bold font-mono text-[15px]", style: {
+                color,
+                textShadow: `-1.5px -1.5px 0 ${shadowColor}, 1.5px -1.5px 0 ${shadowColor}, -1.5px 1.5px 0 ${shadowColor}, 1.5px 1.5px 0 ${shadowColor}, 0 0 4px ${shadowColor}, 0 0 4px ${shadowColor}`,
+            }, children: label }) }));
+}
+export default FenceTool;

package/dist/guide/definition.d.ts

@@ -0,0 +1,10 @@
+import { type NodeDefinition } from '@pascal-app/core';
+import { GuideNode } from './schema';
+/**
+ * Guide — Stage A. Measurement reference annotations placed by the
+ * user (linear / area / arc). `GuideSystem` handles per-frame
+ * positioning; the renderer mounts the visual marker + dimensioning
+ * HUD via `<Html>`.
+ */
+export declare const guideDefinition: NodeDefinition<typeof GuideNode>;
+//# sourceMappingURL=definition.d.ts.map

package/dist/guide/definition.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"definition.d.ts","sourceRoot":"","sources":["../../src/guide/definition.ts"],"names":[],"mappings":"AAAA,OAAO,EAAgC,KAAK,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAEpF,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAA;AAEpC;;;;;GAKG;AACH,eAAO,MAAM,eAAe,EAAE,cAAc,CAAC,OAAO,SAAS,CAgD5D,CAAA"}

package/dist/guide/definition.js

@@ -0,0 +1,52 @@
+import { GuideNode as GuideNodeSchema } from '@pascal-app/core';
+import { guideParametrics } from './parametrics';
+import { GuideNode } from './schema';
+/**
+ * Guide — Stage A. Measurement reference annotations placed by the
+ * user (linear / area / arc). `GuideSystem` handles per-frame
+ * positioning; the renderer mounts the visual marker + dimensioning
+ * HUD via `<Html>`.
+ */
+export const guideDefinition = {
+    kind: 'guide',
+    // Floorplan image reference: stripped from the bake, re-added live from
+    // scene_graph in the viewer (see plans → Part D; glb-reference-nodes.tsx).
+    bake: 'strip',
+    schemaVersion: 1,
+    schema: GuideNode,
+    category: 'site',
+    defaults: () => {
+        const stub = GuideNodeSchema.parse({ id: 'guide_default', type: 'guide' });
+        const { id: _id, type: _type, ...rest } = stub;
+        return rest;
+    },
+    capabilities: {
+        selectable: { hitVolume: 'bbox' },
+        duplicable: false,
+        deletable: true,
+        // Guides are scene-specific measurement annotations — saving them
+        // as reusable catalog items has no meaning.
+        presettable: false,
+    },
+    parametrics: guideParametrics,
+    // No dirty consumer rebuilds this kind — see NodeDefinition.dirtyTracking.
+    dirtyTracking: false,
+    renderer: {
+        kind: 'parametric',
+        module: () => import('./renderer'),
+    },
+    system: {
+        module: () => import('./system'),
+        priority: 5,
+    },
+    presentation: {
+        label: 'Guide',
+        description: 'A measurement / reference annotation (linear, area, or arc).',
+        icon: { kind: 'url', src: '/icons/blueprint.webp' },
+        paletteSection: 'site',
+        paletteOrder: 30,
+    },
+    mcp: {
+        description: 'A measurement reference guide annotation.',
+    },
+};

package/dist/guide/index.d.ts

@@ -0,0 +1,2 @@
+export { guideDefinition } from './definition';
+//# sourceMappingURL=index.d.ts.map

package/dist/guide/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/guide/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA"}

package/dist/guide/index.js

@@ -0,0 +1 @@
+export { guideDefinition } from './definition';

package/dist/guide/parametrics.d.ts

@@ -0,0 +1,3 @@
+import type { GuideNode, ParametricDescriptor } from '@pascal-app/core';
+export declare const guideParametrics: ParametricDescriptor<GuideNode>;
+//# sourceMappingURL=parametrics.d.ts.map

package/dist/guide/parametrics.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"parametrics.d.ts","sourceRoot":"","sources":["../../src/guide/parametrics.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAA;AAEvE,eAAO,MAAM,gBAAgB,EAAE,oBAAoB,CAAC,SAAS,CAE5D,CAAA"}

package/dist/guide/parametrics.js

@@ -0,0 +1,3 @@
+export const guideParametrics = {
+    groups: [],
+};

package/dist/guide/renderer.d.ts

@@ -0,0 +1,6 @@
+import { type GuideNode } from '@pascal-app/core';
+export declare const GuideRenderer: ({ node }: {
+    node: GuideNode;
+}) => import("react").JSX.Element;
+export default GuideRenderer;
+//# sourceMappingURL=renderer.d.ts.map

package/dist/guide/renderer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"renderer.d.ts","sourceRoot":"","sources":["../../src/guide/renderer.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,SAAS,EAAe,MAAM,kBAAkB,CAAA;AAQ9D,eAAO,MAAM,aAAa,GAAI,UAAU;IAAE,IAAI,EAAE,SAAS,CAAA;CAAE,gCAqB1D,CAAA;AAwDD,eAAe,aAAa,CAAA"}