editor: stabilize floorplan and camera interactions (#545)

* Add roof surface placement support for items

Items (e.g. solar panels) can now be placed on sloped roof surfaces.
The placement system computes euler rotation from the roof surface
normal so items sit flush on the slope instead of going inside.

- Add roofStrategy to placement-strategies with enter/move/click/leave
- Wire roof:enter/move/click/leave events in the placement coordinator
- Add calculateRoofRotation in placement-math using surface normals
- Support full 3D cursor rotation for sloped surfaces
- Items on roofs are parented to the level with world-space rotation

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

* fixed conflict

* fix(viewer): keep outlines during camera movement

* fix(editor): prevent floorplan clipping during rotation

* fix(editor): keep compass rotation in sync

Stream live headings in 2D and 3D, and defer restoring the compositor rotation preview until the committed floor-plan state is ready to paint so pointer release cannot snap back.

* fix(editor): stabilize floorplan and camera sync

* fix floorplan registry scale subscriptions

---------

Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>

packages/editor/src/components/editor-2d/floorplan-render-context.test.ts

@@ -11,4 +11,17 @@ describe('floorplan render context', () => {
     expect(scale.read).toBe(read)
     expect(read()).toBe(0.01)
   })
+
+  test('notifies selected-handle renderers when a hidden floorplan becomes visible', () => {
+    const scale = createFloorplanRenderScaleReference(30)
+    let renderedCurveHandleRadius = 8 * scale.read()
+    const unsubscribe = scale.subscribe(() => {
+      renderedCurveHandleRadius = 8 * scale.read()
+    })
+
+    scale.update(0.02)
+
+    expect(renderedCurveHandleRadius).toBe(0.16)
+    unsubscribe()
+  })
 })

packages/editor/src/components/editor-2d/floorplan-render-context.tsx

@@ -1,7 +1,15 @@
 'use client'
 
 import type { FloorplanPalette } from '@pascal-app/core'
-import { createContext, type ReactNode, useContext, useMemo, useRef } from 'react'
+import {
+  createContext,
+  type ReactNode,
+  useContext,
+  useLayoutEffect,
+  useMemo,
+  useRef,
+  useSyncExternalStore,
+} from 'react'
 
 /**
  * Per-frame render context shared between the legacy `floorplan-panel.tsx`
@@ -40,6 +48,7 @@ export type FloorplanStaticRenderContextValue = Omit<
 > & {
   getSceneRotationDeg: () => number
   getUnitsPerPixel: () => number
+  subscribeUnitsPerPixel: (listener: () => void) => () => void
 }
 
 const FloorplanStaticRenderContext = createContext<FloorplanStaticRenderContextValue | null>(null)
@@ -48,6 +57,7 @@ const FloorplanUnitsPerPixelContext = createContext(1)
 
 export type FloorplanRenderScaleReference = {
   read: () => number
+  subscribe: (listener: () => void) => () => void
   update: (unitsPerPixel: number) => void
 }
 
@@ -55,10 +65,17 @@ export function createFloorplanRenderScaleReference(
   initialUnitsPerPixel: number,
 ): FloorplanRenderScaleReference {
   let unitsPerPixel = initialUnitsPerPixel
+  const listeners = new Set<() => void>()
   return {
     read: () => unitsPerPixel,
+    subscribe: (listener) => {
+      listeners.add(listener)
+      return () => listeners.delete(listener)
+    },
     update: (nextUnitsPerPixel) => {
+      if (Object.is(unitsPerPixel, nextUnitsPerPixel)) return
       unitsPerPixel = nextUnitsPerPixel
+      for (const listener of listeners) listener()
     },
   }
 }
@@ -78,11 +95,20 @@ export function FloorplanRenderProvider({
   if (!renderScaleReference.current) {
     renderScaleReference.current = createFloorplanRenderScaleReference(unitsPerPixel)
   }
-  renderScaleReference.current.update(unitsPerPixel)
   const getUnitsPerPixel = renderScaleReference.current.read
+  const subscribeUnitsPerPixel = renderScaleReference.current.subscribe
+  useLayoutEffect(() => {
+    renderScaleReference.current?.update(unitsPerPixel)
+  }, [unitsPerPixel])
   const staticValue = useMemo<FloorplanStaticRenderContextValue>(
-    () => ({ palette, hatchPatternId, getSceneRotationDeg, getUnitsPerPixel }),
+    () => ({
-    [palette, hatchPatternId, getSceneRotationDeg, getUnitsPerPixel],
+      palette,
+      hatchPatternId,
+      getSceneRotationDeg,
+      getUnitsPerPixel,
+      subscribeUnitsPerPixel,
+    }),
+    [palette, hatchPatternId, getSceneRotationDeg, getUnitsPerPixel, subscribeUnitsPerPixel],
   )
   return (
     <FloorplanStaticRenderContext.Provider value={staticValue}>
@@ -124,6 +150,18 @@ export function useFloorplanStaticRender(): FloorplanStaticRenderContextValue |
   return useContext(FloorplanStaticRenderContext)
 }
 
+const subscribeToNoFloorplanScale = () => () => {}
+const readDefaultFloorplanScale = () => 1
+
+export function useFloorplanStaticUnitsPerPixel(): number {
+  const staticValue = useContext(FloorplanStaticRenderContext)
+  return useSyncExternalStore(
+    staticValue?.subscribeUnitsPerPixel ?? subscribeToNoFloorplanScale,
+    staticValue?.getUnitsPerPixel ?? readDefaultFloorplanScale,
+    staticValue?.getUnitsPerPixel ?? readDefaultFloorplanScale,
+  )
+}
+
 export function useFloorplanSceneRotation(): number {
   return useContext(FloorplanSceneRotationContext)
 }

packages/editor/src/components/editor-2d/renderers/floorplan-registry-layer.test.ts

@@ -19,6 +19,7 @@ import {
   collectFloorplanDependencyNodes,
   collectFloorplanLinkedLevelNodes,
   computeAffectedSiblingIds,
+  floorplanAffordanceReshapeScope,
   floorplanHandleDoubleClickAffordance,
   InteractiveGeometry,
   isFloorplanOpeningPlacementState,
@@ -26,6 +27,17 @@ import {
   subscribeFloorplanAffordanceToolCancel,
 } from './floorplan-registry-layer'
 
+describe('floorplan affordance ownership', () => {
+  test('keeps the wall center curve drag owned by the floorplan dispatcher', () => {
+    expect(floorplanAffordanceReshapeScope('wall-curve', 'wall_1', undefined)).toEqual({
+      kind: 'reshaping',
+      nodeId: 'wall_1',
+      reshape: 'curve',
+      driver: 'floorplan',
+    })
+  })
+})
+
 function cabinetRun(id: string, children: string[] = [], parentId: string | null = 'level_test') {
   return {
     id,

packages/editor/src/components/editor-2d/renderers/floorplan-registry-layer.tsx

@@ -28,6 +28,7 @@ import {
 } from '@pascal-app/core'
 import { useViewer } from '@pascal-app/viewer'
 import {
+  type ComponentProps,
   memo,
   type MouseEvent as ReactMouseEvent,
   type PointerEvent as ReactPointerEvent,
@@ -90,7 +91,11 @@ import {
   startFloorplanGroupMove,
   startFloorplanGroupRotate,
 } from '../floorplan-group-move'
-import { useFloorplanSceneRotation, useFloorplanStaticRender } from '../floorplan-render-context'
+import {
+  useFloorplanSceneRotation,
+  useFloorplanStaticRender,
+  useFloorplanStaticUnitsPerPixel,
+} from '../floorplan-render-context'
 import {
   floorplanAnnotationObstacleMode,
   isFloorplanAnnotationObstacleGeometry,
@@ -144,6 +149,13 @@ const DIRECT_DRAG_THRESHOLD_PX = 4
 const DIRECT_ROTATE_EPSILON = 1e-6
 const DIRECT_ROTATE_RADIANS_PER_PIXEL = Math.PI / 180
 
+const ScaleAwareFloorplanGroupSelectionBox = memo(function ScaleAwareFloorplanGroupSelectionBox(
+  props: Omit<ComponentProps<typeof FloorplanGroupSelectionBox>, 'unitsPerPixel'>,
+) {
+  const unitsPerPixel = useFloorplanStaticUnitsPerPixel()
+  return <FloorplanGroupSelectionBox {...props} unitsPerPixel={unitsPerPixel} />
+})
+
 /**
  * Snapshot of node fields captured at drag-start, used by the single-undo
  * dance to revert untracked before re-applying as a single tracked
@@ -237,7 +249,7 @@ export function subscribeFloorplanAffordanceToolCancel(
 // affordances return `null` (no polygon/wall snapping chip). Keyed off the
 // affordance name the kinds register (`move-vertex` / `move-edge` / `add-vertex`
 // / `curve` / `move-endpoint`).
-function affordanceReshapeScope(
+export function floorplanAffordanceReshapeScope(
   affordance: string,
   nodeId: string,
   payload: unknown,
@@ -245,30 +257,30 @@ function affordanceReshapeScope(
   if (affordance.includes('vertex') || affordance.includes('edge')) {
     const holeIndex = (payload as { holeIndex?: number } | undefined)?.holeIndex
     return holeIndex !== undefined
-      ? holeEditScope({ nodeId, holeIndex })
+      ? holeEditScope({ nodeId, holeIndex, driver: 'floorplan' })
-      : boundaryReshapeScope(nodeId)
+      : boundaryReshapeScope(nodeId, 'floorplan')
   }
   if (affordance.includes('curve')) {
-    return curveReshapeScope(nodeId)
+    return curveReshapeScope(nodeId, 'floorplan')
   }
   if (affordance.includes('control-point')) {
     const index = (payload as { index?: number } | undefined)?.index ?? 0
-    return controlPointReshapeScope(nodeId, index)
+    return controlPointReshapeScope(nodeId, index, 'floorplan')
   }
   if (affordance.includes('tangent')) {
     const target = payload as { index?: number; side?: 'in' | 'out' } | undefined
-    return tangentReshapeScope(nodeId, target?.index ?? 0, target?.side ?? 'out')
+    return tangentReshapeScope(nodeId, target?.index ?? 0, target?.side ?? 'out', 'floorplan')
   }
   if (affordance.includes('endpoint')) {
     const endpoint = (payload as { endpoint?: 'start' | 'end' } | undefined)?.endpoint ?? 'end'
-    return endpointReshapeScope(nodeId, endpoint)
+    return endpointReshapeScope(nodeId, endpoint, 'floorplan')
   }
   // Roof-segment width/depth resize — a no-angle dimension edit, so the
   // no-angle 'polygon' snap set (grid / lines / off) via a boundary scope.
   // Matched exactly so a still-legacy `*-resize` affordance on another kind
   // doesn't get a chip its snap math can't honour yet.
   if (affordance === 'roof-segment-resize') {
-    return boundaryReshapeScope(nodeId)
+    return boundaryReshapeScope(nodeId, 'floorplan')
   }
   // 2D corner rotate-arrow (column / elevator / roof-segment / shelf / spawn /
   // stair). Begin the same handle-drag scope the 3D rotate gizmo uses, label-
@@ -1092,7 +1104,7 @@ export const FloorplanRegistryLayer = memo(function FloorplanRegistryLayer() {
       // the right chip during the edit AND `getActiveSnapContext()` resolves the
       // polygon / wall mode-set the affordance's snap math reads. Torn down on
       // release / cancel below. `null` for resize / rotate (no snapping chip).
-      const reshapeScope = affordanceReshapeScope(affordance, nodeId, payload)
+      const reshapeScope = floorplanAffordanceReshapeScope(affordance, nodeId, payload)
       if (reshapeScope) {
         useInteractionScope.getState().begin(reshapeScope)
       }
@@ -1338,7 +1350,6 @@ export const FloorplanRegistryLayer = memo(function FloorplanRegistryLayer() {
   const entries = floorplanData.entries
   if (entries.length === 0) return null
 
-  const unitsPerPixel = renderCtx?.getUnitsPerPixel() ?? 1
   const palette = renderCtx?.palette
 
   return (
@@ -1406,7 +1417,6 @@ export const FloorplanRegistryLayer = memo(function FloorplanRegistryLayer() {
             unit={unit}
             metricNotation={metricNotation}
             wallDimensionReference={wallDimensionReference}
-            unitsPerPixel={unitsPerPixel}
             visibilityRootId={entry.ctxOverrides ? undefined : (levelId as AnyNodeId)}
             ctxOverrides={entry.ctxOverrides}
           />
@@ -1459,7 +1469,6 @@ export const FloorplanRegistryLayer = memo(function FloorplanRegistryLayer() {
             unit={unit}
             metricNotation={metricNotation}
             wallDimensionReference={wallDimensionReference}
-            unitsPerPixel={unitsPerPixel}
             visibilityRootId={entry.ctxOverrides ? undefined : (levelId as AnyNodeId)}
             ctxOverrides={entry.ctxOverrides}
           />
@@ -1469,11 +1478,10 @@ export const FloorplanRegistryLayer = memo(function FloorplanRegistryLayer() {
       {/* Dashed group bbox — shows what a group drag carries along while a
           multi-selection exists, rides the live delta mid-drag, and doubles
           as the group's whole-area drag handle. */}
-      <FloorplanGroupSelectionBox
+      <ScaleAwareFloorplanGroupSelectionBox
         onPointerDown={handleGroupBoxPointerDown}
         onRotatePointerDown={handleGroupBoxRotatePointerDown}
         palette={palette}
-        unitsPerPixel={unitsPerPixel}
       />
       {/* Transient live-rotation readout — drawn last so the wedge + degree
           chip sit above all handle chrome while a rotate-arrow is dragged. */}
@@ -1482,7 +1490,6 @@ export const FloorplanRegistryLayer = memo(function FloorplanRegistryLayer() {
           overlay={rotationOverlay}
           palette={palette}
           sceneRotationDeg={sceneRotationDeg}
-          unitsPerPixel={unitsPerPixel}
         />
       ) : null}
     </g>
@@ -1805,7 +1812,6 @@ type FloorplanRegistryEntryProps = {
   unit: 'metric' | 'imperial'
   metricNotation: 'meters' | 'millimeters'
   wallDimensionReference: FloorplanWallDimensionReference
-  unitsPerPixel: number
   visibilityRootId: AnyNodeId | undefined
 }
 
@@ -1847,7 +1853,6 @@ const FloorplanRegistryEntry = memo(function FloorplanRegistryEntry({
   unit,
   metricNotation,
   wallDimensionReference,
-  unitsPerPixel,
   visibilityRootId,
 }: FloorplanRegistryEntryProps): React.ReactElement | null {
   const live = useLiveTransforms((s) => (floorplanVisible ? s.transforms.get(nodeId) : undefined))
@@ -1997,7 +2002,6 @@ const FloorplanRegistryEntry = memo(function FloorplanRegistryEntry({
         onMoveHandlePointerDown={handleMoveHandlePointerDown}
         palette={palette}
         sceneRotationDeg={sceneRotationDeg}
-        unitsPerPixel={unitsPerPixel}
       />
     </g>
   )
@@ -2270,7 +2274,7 @@ export function getFloorplanLevelData(
 
 type InteractiveGeometryProps = {
   geometry: FloorplanGeometry
-  unitsPerPixel: number
+  unitsPerPixel?: number
   palette: FloorplanPalette | undefined
   hatchPatternId: string | undefined
   hoveredHandleId: string | null
@@ -2298,7 +2302,7 @@ type InteractiveGeometryProps = {
 
 export const InteractiveGeometry = memo(function InteractiveGeometry({
   geometry,
-  unitsPerPixel,
+  unitsPerPixel: unitsPerPixelOverride,
   palette,
   hatchPatternId,
   hoveredHandleId,
@@ -2312,6 +2316,9 @@ export const InteractiveGeometry = memo(function InteractiveGeometry({
   onHandlePointerDown,
   onMoveHandlePointerDown,
 }: InteractiveGeometryProps): React.ReactElement {
+  const liveUnitsPerPixel = useFloorplanStaticUnitsPerPixel()
+  const unitsPerPixel = unitsPerPixelOverride ?? liveUnitsPerPixel
+
   return renderInteractive(geometry, 0)
 
   function renderInteractive(g: FloorplanGeometry, keyHint: number): React.ReactElement {
@@ -3519,7 +3526,7 @@ const ROTATION_WEDGE_SEGMENTS = 48
 export function RotationAngleOverlay({
   overlay,
   palette,
-  unitsPerPixel,
+  unitsPerPixel: unitsPerPixelOverride,
   sceneRotationDeg,
 }: {
   overlay: RotationOverlayState
@@ -3527,9 +3534,11 @@ export function RotationAngleOverlay({
     FloorplanPalette,
     'measurementLabelBackground' | 'measurementLabelText' | 'measurementStroke'
   >
-  unitsPerPixel: number
+  unitsPerPixel?: number
   sceneRotationDeg: number
 }): React.ReactElement {
+  const liveUnitsPerPixel = useFloorplanStaticUnitsPerPixel()
+  const unitsPerPixel = unitsPerPixelOverride ?? liveUnitsPerPixel
   const { pivot, startAngle, endAngle, radius, sweep } = overlay
   const span = endAngle - startAngle
   const count = Math.max(8, Math.ceil((Math.abs(span) / Math.PI) * ROTATION_WEDGE_SEGMENTS))

packages/editor/src/components/editor/custom-camera-controls.tsx

@@ -25,6 +25,8 @@ import {
   type CameraPoseApplicationPlan,
   normalizeCameraPose,
   planCameraPoseApplication,
+  publishInitialCameraPose,
+  releaseCameraPoseEventSuppression,
   stepCameraPoseInterpolation,
   withCameraPoseDistance,
 } from '../../lib/camera-pose'
@@ -609,6 +611,10 @@ export const CustomCameraControls = () => {
     publishCurrentPose()
   }, [publishCurrentPose])
 
+  useEffect(() => {
+    publishInitialCameraPose(publishCurrentPose)
+  }, [publishCurrentPose])
+
   useFrame((_, delta) => {
     if (isFirstPersonMode || !controls.current) return
 
@@ -645,12 +651,12 @@ export const CustomCameraControls = () => {
         } catch {
           if (activePoseInterpolation.current === activePose) {
             activePoseInterpolation.current = null
-            suppressPoseEvents.current = false
+            releaseCameraPoseEventSuppression(suppressPoseEvents, publishCurrentPose)
           }
         }
         if (step.settled && activePoseInterpolation.current === activePose) {
           activePoseInterpolation.current = null
-          suppressPoseEvents.current = false
+          releaseCameraPoseEventSuppression(suppressPoseEvents, publishCurrentPose)
         }
       }
     }

packages/editor/src/components/editor/floorplan-camera-sync.test.ts

@@ -1,5 +1,6 @@
 import { describe, expect, test } from 'bun:test'
 import type { CameraPose } from '@pascal-app/core'
+import { publishInitialCameraPose } from '../../lib/camera-pose'
 import type { NavigationSyncPose } from '../../store/use-editor'
 import {
   cameraPoseToFloorplanNavigationPose,
@@ -105,7 +106,7 @@ describe('floorplan camera sync', () => {
     expect(applied[0]?.position[2]).toBeCloseTo(20)
   })
 
-  test('does not publish floor-plan rotation below one degree', () => {
+  test('publishes sub-degree camera rotation for a real-time compass', () => {
     const published: Array<Omit<NavigationSyncPose, 'revision'>> = []
     const bridge = createFloorplanCameraSyncBridge({
       applyCameraPose: () => {},
@@ -114,14 +115,11 @@ describe('floorplan camera sync', () => {
 
     bridge.receiveCameraPose(cameraPoseAtAzimuth(0))
     bridge.receiveCameraPose(cameraPoseAtAzimuth((0.9 * Math.PI) / 180))
-    expect(published).toHaveLength(1)
-
-    bridge.receiveCameraPose(cameraPoseAtAzimuth(Math.PI / 180))
     expect(published).toHaveLength(2)
-    expect(published[1]?.azimuth).toBeCloseTo(Math.PI / 180)
+    expect(published[1]?.azimuth).toBeCloseTo((0.9 * Math.PI) / 180)
   })
 
-  test('keeps the previous floor-plan angle when a sub-degree rotation arrives with a pan', () => {
+  test('keeps a sub-degree camera rotation when it arrives with a pan', () => {
     const published: Array<Omit<NavigationSyncPose, 'revision'>> = []
     const bridge = createFloorplanCameraSyncBridge({
       applyCameraPose: () => {},
@@ -134,11 +132,11 @@ describe('floorplan camera sync', () => {
     expect(published).toHaveLength(2)
     expect(published[1]).toMatchObject({
       target: [1, 1, 0],
-      azimuth: 0,
     })
+    expect(published[1]?.azimuth).toBeCloseTo((0.5 * Math.PI) / 180)
   })
 
-  test('does no floor-plan synchronization in 3D-only mode and catches up once when visible', () => {
+  test('keeps streaming live camera headings in 3D-only mode', () => {
     const published: Array<Omit<NavigationSyncPose, 'revision'>> = []
     const applied: CameraPose[] = []
     const bridge = createFloorplanCameraSyncBridge({
@@ -158,11 +156,13 @@ describe('floorplan camera sync', () => {
       viewWidth: 8,
     })
 
-    expect(published).toEqual([])
-    expect(applied).toEqual([])
-
-    bridge.setActive(true)
     expect(published).toEqual([
+      {
+        source: '3d',
+        target: cameraPose.target,
+        azimuth: 0,
+        viewWidth: 12,
+      },
       {
         source: '3d',
         target: latestPose.target,
@@ -171,9 +171,13 @@ describe('floorplan camera sync', () => {
       },
     ])
     expect(applied).toEqual([])
+
+    bridge.setActive(true)
+    expect(published).toHaveLength(2)
+    expect(applied).toEqual([])
   })
 
-  test('waits for a generic camera reference before applying an early 2D pose', () => {
+  test('applies 2D-first navigation on initial load without a 3D interaction', () => {
     const applied: CameraPose[] = []
     const bridge = createFloorplanCameraSyncBridge({
       applyCameraPose: (pose) => applied.push(pose),
@@ -189,7 +193,7 @@ describe('floorplan camera sync', () => {
     })
     expect(applied).toEqual([])
 
-    bridge.receiveCameraPose(cameraPose)
+    publishInitialCameraPose(() => bridge.receiveCameraPose(cameraPose))
     expect(applied).toHaveLength(1)
   })
 

packages/editor/src/components/editor/floorplan-camera-sync.ts

@@ -10,7 +10,7 @@ import useEditor, {
 } from '../../store/use-editor'
 
 const POSITION_EPSILON = 0.001
-const AZIMUTH_EPSILON = Math.PI / 180
+const AZIMUTH_EPSILON = 1e-4
 const VIEW_WIDTH_EPSILON = 0.001
 
 type FloorplanNavigationSnapshot = Omit<NavigationSyncPoseInput, 'source'>
@@ -151,18 +151,8 @@ export function createFloorplanCameraSyncBridge({
   }
 
   const publishCameraNavigationPose = (pose: CameraPose) => {
-    let navigationPose = cameraPoseToFloorplanNavigationPose(pose)
+    const navigationPose = cameraPoseToFloorplanNavigationPose(pose)
     if (!navigationPose) return
-    if (
-      lastPublishedNavigation &&
-      Math.abs(angleDeltaRadians(lastPublishedNavigation.azimuth, navigationPose.azimuth)) <
-        AZIMUTH_EPSILON
-    ) {
-      navigationPose = {
-        ...navigationPose,
-        azimuth: lastPublishedNavigation.azimuth,
-      }
-    }
     const nextSnapshot = navigationSnapshot(navigationPose)
     if (
       lastPublishedNavigation &&
@@ -178,8 +168,7 @@ export function createFloorplanCameraSyncBridge({
   return {
     receiveCameraPose: (pose) => {
       latestCameraPose = pose
-      if (!active) return
+      if (active && applyPendingNavigationPose()) return
-      if (applyPendingNavigationPose()) return
 
       publishCameraNavigationPose(pose)
     },

packages/editor/src/components/editor/floorplan-navigation-presentation.test.ts

@@ -4,10 +4,40 @@ import {
   canZoomFloorplanDuringNavigation,
   createFloorplanNavigationSyncScheduler,
   finalizeFloorplanNavigation,
+  flushFloorplanRotationPresentationRestore,
+  getFloorplanRotationOverscanViewBox,
+  queueFloorplanRotationPresentationRestore,
   resolveFloorplanPresentationViewBox,
+  setFloorplanCompassRotation,
 } from './floorplan-navigation-presentation'
 
 describe('floorplan navigation presentation', () => {
+  test('keeps the viewport inside the painted floorplan surface throughout rotation', () => {
+    const viewport = { minX: -80, minY: -45, width: 160, height: 90 }
+    const overscan = getFloorplanRotationOverscanViewBox(viewport)
+    const viewportCorners: Array<[number, number]> = [
+      [-80, -45],
+      [80, -45],
+      [80, 45],
+      [-80, 45],
+    ]
+
+    for (let degrees = 0; degrees < 360; degrees += 1) {
+      const radians = (-degrees * Math.PI) / 180
+      const cos = Math.cos(radians)
+      const sin = Math.sin(radians)
+
+      for (const [x, y] of viewportCorners) {
+        const localX = x * cos - y * sin
+        const localY = x * sin + y * cos
+        expect(localX).toBeGreaterThanOrEqual(overscan.minX - 1e-10)
+        expect(localX).toBeLessThanOrEqual(overscan.minX + overscan.width + 1e-10)
+        expect(localY).toBeGreaterThanOrEqual(overscan.minY - 1e-10)
+        expect(localY).toBeLessThanOrEqual(overscan.minY + overscan.height + 1e-10)
+      }
+    }
+  })
+
   test('keeps the imperative viewBox authoritative during navigation', () => {
     const reactViewBox = { minX: 0, minY: 0, width: 100, height: 50 }
     const imperativeViewBox = { minX: 25, minY: 10, width: 40, height: 20 }
@@ -30,6 +60,42 @@ describe('floorplan navigation presentation', () => {
     expect(canApplyFloorplanNavigationSync(false)).toBe(true)
   })
 
+  test('updates the compass presentation on every live rotation frame', () => {
+    const compass = { style: { transform: '' } }
+
+    setFloorplanCompassRotation(compass, 0.25)
+    expect(compass.style.transform).toBe('rotate(0.25deg)')
+
+    setFloorplanCompassRotation(compass, 0.5)
+    expect(compass.style.transform).toBe('rotate(0.5deg)')
+  })
+
+  test('keeps the rotation preview in place until the committed state is ready to paint', () => {
+    const pending = { current: null }
+    const svg = {
+      style: {
+        transform: 'rotate(42deg)',
+        transformOrigin: 'center',
+        willChange: 'transform',
+      },
+    }
+    const presentation = {
+      svg,
+      svgStyle: {
+        transform: '',
+        transformOrigin: '',
+        willChange: '',
+      },
+    }
+
+    queueFloorplanRotationPresentationRestore(pending, presentation)
+    expect(svg.style.transform).toBe('rotate(42deg)')
+
+    flushFloorplanRotationPresentationRestore(pending)
+    expect(svg.style.transform).toBe('')
+    expect(pending.current).toBeNull()
+  })
+
   test('commits every active navigation channel before teardown', () => {
     const calls: string[] = []
     const rotationState = { angle: 42 }

packages/editor/src/components/editor/floorplan-navigation-presentation.ts

@@ -5,6 +5,63 @@ export type FloorplanPresentationViewBox = {
   height: number
 }
 
+export function setFloorplanCompassRotation(
+  compass: { style: { transform: string } } | null,
+  rotationDeg: number,
+): void {
+  if (compass) {
+    compass.style.transform = `rotate(${rotationDeg}deg)`
+  }
+}
+
+type FloorplanRotationPresentation = {
+  svg: {
+    style: {
+      transform: string
+      transformOrigin: string
+      willChange: string
+    }
+  }
+  svgStyle: {
+    transform: string
+    transformOrigin: string
+    willChange: string
+  }
+}
+
+export function queueFloorplanRotationPresentationRestore<
+  Presentation extends FloorplanRotationPresentation,
+>(pending: { current: Presentation | null }, presentation: Presentation): void {
+  pending.current = presentation
+}
+
+export function flushFloorplanRotationPresentationRestore<
+  Presentation extends FloorplanRotationPresentation,
+>(pending: { current: Presentation | null }): void {
+  const presentation = pending.current
+  if (!presentation) return
+
+  presentation.svg.style.transform = presentation.svgStyle.transform
+  presentation.svg.style.transformOrigin = presentation.svgStyle.transformOrigin
+  presentation.svg.style.willChange = presentation.svgStyle.willChange
+  pending.current = null
+}
+
+export function getFloorplanRotationOverscanViewBox(
+  viewBox: FloorplanPresentationViewBox,
+): FloorplanPresentationViewBox {
+  const size = Math.hypot(viewBox.width, viewBox.height)
+  const centerX = viewBox.minX + viewBox.width / 2
+  const centerY = viewBox.minY + viewBox.height / 2
+
+  return {
+    minX: centerX - size / 2,
+    minY: centerY - size / 2,
+    width: size,
+    height: size,
+  }
+}
+
 export function resolveFloorplanPresentationViewBox(
   reactViewBox: FloorplanPresentationViewBox,
   imperativeViewBox: FloorplanPresentationViewBox | null,

packages/editor/src/components/editor/floorplan-panel.tsx

@@ -203,7 +203,11 @@ import {
   type FloorplanNavigationSyncScheduler,
   type FloorplanPresentationViewBox,
   finalizeFloorplanNavigation,
+  flushFloorplanRotationPresentationRestore,
+  getFloorplanRotationOverscanViewBox,
+  queueFloorplanRotationPresentationRestore,
   resolveFloorplanPresentationViewBox,
+  setFloorplanCompassRotation,
 } from './floorplan-navigation-presentation'
 import { useFloorplanBackgroundPlacement } from './use-floorplan-background-placement'
 import { useFloorplanHitTesting } from './use-floorplan-hit-testing'
@@ -358,12 +362,6 @@ type FloorplanNavigationSyncPresentationState = {
   }
 }
 
-function restoreFloorplanRotationPresentation(rotationState: FloorplanRotationState) {
-  rotationState.svg.style.transform = rotationState.svgStyle.transform
-  rotationState.svg.style.transformOrigin = rotationState.svgStyle.transformOrigin
-  rotationState.svg.style.willChange = rotationState.svgStyle.willChange
-}
-
 function restoreFloorplanNavigationSyncPresentation(
   presentationState: FloorplanNavigationSyncPresentationState,
 ) {
@@ -5343,6 +5341,7 @@ export function FloorplanPanel({
   const floorplanContentRef = useRef<SVGGElement>(null)
   const panStateRef = useRef<PanState | null>(null)
   const floorplanRotationStateRef = useRef<FloorplanRotationState | null>(null)
+  const pendingFloorplanRotationRestoreRef = useRef<FloorplanRotationState | null>(null)
   const floorplanSpacePanPressedRef = useRef(false)
   const floorplanNavigationClickSuppressedRef = useRef(false)
   const guideInteractionRef = useRef<GuideInteractionState | null>(null)
@@ -6611,12 +6610,14 @@ export function FloorplanPanel({
       const nextHeight = nextViewport.width / svgAspectRatio
       const nextMinX = nextViewport.centerX - nextViewport.width / 2
       const nextMinY = nextViewport.centerY - nextHeight / 2
-      floorplanImperativeViewBoxRef.current = {
+      const nextViewBox = {
         minX: nextMinX,
         minY: nextMinY,
         width: nextViewport.width,
         height: nextHeight,
       }
+      const nextPaintViewBox = getFloorplanRotationOverscanViewBox(nextViewBox)
+      floorplanImperativeViewBoxRef.current = nextViewBox
       hasUserAdjustedViewportRef.current = true
       latestViewportRef.current = nextViewport
       svgRef.current?.setAttribute(
@@ -6625,10 +6626,10 @@ export function FloorplanPanel({
       )
       const background = floorplanBackgroundRef.current
       if (background) {
-        background.setAttribute('x', String(nextMinX))
+        background.setAttribute('x', String(nextPaintViewBox.minX))
-        background.setAttribute('y', String(nextMinY))
+        background.setAttribute('y', String(nextPaintViewBox.minY))
-        background.setAttribute('width', String(nextViewport.width))
+        background.setAttribute('width', String(nextPaintViewBox.width))
-        background.setAttribute('height', String(nextHeight))
+        background.setAttribute('height', String(nextPaintViewBox.height))
       }
     },
     [svgAspectRatio],
@@ -7134,9 +7135,7 @@ export function FloorplanPanel({
           nextDeg = targetDeg
         }
         latestFloorplanUserRotationDegRef.current = nextDeg
-        if (compassNeedleRef.current) {
+        setFloorplanCompassRotation(compassNeedleRef.current, nextDeg)
-          compassNeedleRef.current.style.transform = `rotate(${nextDeg}deg)`
-        }
         if (nextDeg !== targetDeg) {
           hiddenCompassAnimationRef.current = requestAnimationFrame(tick)
         }
@@ -7167,9 +7166,7 @@ export function FloorplanPanel({
           // owns the needle, so any local animation yields to it.
           cancelHiddenCompassAnimation()
           latestFloorplanUserRotationDegRef.current = nextDeg
-          if (compassNeedleRef.current) {
+          setFloorplanCompassRotation(compassNeedleRef.current, nextDeg)
-            compassNeedleRef.current.style.transform = `rotate(${nextDeg}deg)`
-          }
         } else {
           animateHiddenCompassNeedle(nextDeg)
         }
@@ -7213,8 +7210,11 @@ export function FloorplanPanel({
   // state; this layout effect restores the authoritative ref value before
   // the browser paints so the needle never visibly snaps to a stale angle.
   useLayoutEffect(() => {
-    if (!isFloorplanOpen && compassNeedleRef.current) {
+    if (!isFloorplanOpen) {
-      compassNeedleRef.current.style.transform = `rotate(${latestFloorplanUserRotationDegRef.current}deg)`
+      setFloorplanCompassRotation(
+        compassNeedleRef.current,
+        latestFloorplanUserRotationDegRef.current,
+      )
     }
   })
 
@@ -7328,6 +7328,7 @@ export function FloorplanPanel({
     floorplanImperativeViewBoxRef.current,
     floorplanViewportInteractionInProgressRef.current,
   )
+  const presentationPaintViewBox = getFloorplanRotationOverscanViewBox(presentationViewBox)
   const floorplanWorldUnitsPerPixel = useMemo(() => {
     const widthUnitsPerPixel = viewBox.width / Math.max(surfaceSize.width, 1)
     const heightUnitsPerPixel = viewBox.height / Math.max(surfaceSize.height, 1)
@@ -7603,7 +7604,11 @@ export function FloorplanPanel({
     [surfaceSize.width, viewBox.width],
   )
   const gridBounds = useMemo(
-    () => getRotatedViewBoxBounds(viewBox, floorplanSceneRotationDeg),
+    () =>
+      getRotatedViewBoxBounds(
+        getFloorplanRotationOverscanViewBox(viewBox),
+        floorplanSceneRotationDeg,
+      ),
     [floorplanSceneRotationDeg, viewBox],
   )
 
@@ -8177,6 +8182,7 @@ export function FloorplanPanel({
       hasUserAdjustedViewportRef.current = true
       latestFloorplanUserRotationDegRef.current = nextUserRotationDeg
       latestViewportRef.current = nextViewport
+      setFloorplanCompassRotation(compassNeedleRef.current, nextUserRotationDeg)
       // Transform the already-painted SVG as one compositor layer. Mutating the
       // scene rotation/viewBox here forces the heavy vector plan to rerasterize.
       rotationState.svg.style.transform = `rotate(${nextUserRotationDeg - rotationState.initialUserRotationDeg}deg)`
@@ -8348,7 +8354,7 @@ export function FloorplanPanel({
     (rotationState: FloorplanRotationState) => {
       floorplanViewportInteractionInProgressRef.current = false
       floorplanImperativeViewBoxRef.current = null
-      restoreFloorplanRotationPresentation(rotationState)
+      queueFloorplanRotationPresentationRestore(pendingFloorplanRotationRestoreRef, rotationState)
       setFloorplanUserRotationDeg((current) =>
         current === rotationState.latestUserRotationDeg
           ? current
@@ -8368,6 +8374,10 @@ export function FloorplanPanel({
     [publishFloorplanNavigationPose],
   )
 
+  useLayoutEffect(() => {
+    flushFloorplanRotationPresentationRestore(pendingFloorplanRotationRestoreRef)
+  })
+
   // Finalize imperative navigation when the floorplan closes so reopening
   // restores the last visible pose instead of stale React state.
   useEffect(() => {
@@ -11877,6 +11887,7 @@ export function FloorplanPanel({
             style={{
               cursor:
                 floorplanNavigationCursor ?? (referenceScaleDraft ? 'crosshair' : EDITOR_CURSOR),
+              overflow: 'visible',
             }}
             viewBox={`${presentationViewBox.minX} ${presentationViewBox.minY} ${presentationViewBox.width} ${presentationViewBox.height}`}
           >
@@ -11916,11 +11927,11 @@ export function FloorplanPanel({
             </defs>
             <rect
               fill={palette.surface}
-              height={presentationViewBox.height}
+              height={presentationPaintViewBox.height}
               ref={floorplanBackgroundRef}
-              width={presentationViewBox.width}
+              width={presentationPaintViewBox.width}
-              x={presentationViewBox.minX}
+              x={presentationPaintViewBox.minX}
-              y={presentationViewBox.minY}
+              y={presentationPaintViewBox.minY}
             />
 
             <g

packages/editor/src/components/tools/tool-manager.tsx

@@ -17,6 +17,8 @@ import {
   useEditingHole,
   useEndpointReshape,
   useIsCurveReshape,
+  useIsFloorplanDrivenReshape,
+  useIsToolDrivenReshape,
   useMovingNode,
   useReshapingNode,
   useTangentReshape,
@@ -103,6 +105,8 @@ export const ToolManager: React.FC = () => {
   const controlPointReshape = useControlPointReshape()
   const tangentReshape = useTangentReshape()
   const isCurveReshape = useIsCurveReshape()
+  const isToolDrivenReshape = useIsToolDrivenReshape()
+  const isFloorplanDrivenReshape = useIsFloorplanDrivenReshape()
   const reshapingNode = useReshapingNode()
   // The endpoint affordance tool's `target` is kind-specific
   // (`{ wall | fence, endpoint }`); rebuild it from the (frozen) reshaped node +
@@ -173,6 +177,7 @@ export const ToolManager: React.FC = () => {
     mode === 'select' &&
     isSoleSelection &&
     selectedSlabId !== undefined &&
+    !isFloorplanDrivenReshape &&
     !editingSlabHoleIsManual
 
   // Show slab hole editor when editing a hole on the selected slab
@@ -180,6 +185,7 @@ export const ToolManager: React.FC = () => {
     selectedSlabId !== undefined &&
     editingHole !== null &&
     editingHole.nodeId === selectedSlabId &&
+    !isFloorplanDrivenReshape &&
     editingSlabHoleIsManual
 
   // Show ceiling boundary editor when in structure/select mode with a ceiling selected (but not editing a hole)
@@ -188,13 +194,15 @@ export const ToolManager: React.FC = () => {
     mode === 'select' &&
     isSoleSelection &&
     selectedCeilingId !== undefined &&
+    !isFloorplanDrivenReshape &&
     (!editingHole || editingHole.nodeId !== selectedCeilingId)
 
   // Show ceiling hole editor when editing a hole on the selected ceiling
   const showCeilingHoleEditor =
     selectedCeilingId !== undefined &&
     editingHole !== null &&
-    editingHole.nodeId === selectedCeilingId
+    editingHole.nodeId === selectedCeilingId &&
+    !isFloorplanDrivenReshape
 
   // Show zone boundary editor when in structure/select mode with a zone selected
   // Hide when editing a slab or ceiling to avoid overlapping handles
@@ -202,6 +210,7 @@ export const ToolManager: React.FC = () => {
     phase === 'structure' &&
     mode === 'select' &&
     selectedZoneId !== null &&
+    !isFloorplanDrivenReshape &&
     !showSlabBoundaryEditor &&
     !showCeilingBoundaryEditor
 
@@ -301,7 +310,8 @@ export const ToolManager: React.FC = () => {
               </Suspense>
             ) : null
           })()}
-        {endpointTarget &&
+        {isToolDrivenReshape &&
+          endpointTarget &&
           reshapingNode &&
           (() => {
             const RegistryAffordance = getRegistryAffordanceTool(
@@ -314,7 +324,8 @@ export const ToolManager: React.FC = () => {
               </Suspense>
             ) : null
           })()}
-        {isCurveReshape &&
+        {isToolDrivenReshape &&
+          isCurveReshape &&
           reshapingNode &&
           (() => {
             const RegistryAffordance = getRegistryAffordanceTool(reshapingNode.type, 'curve')
@@ -324,7 +335,8 @@ export const ToolManager: React.FC = () => {
               </Suspense>
             ) : null
           })()}
-        {controlPointTarget &&
+        {isToolDrivenReshape &&
+          controlPointTarget &&
           (() => {
             const RegistryAffordance = getRegistryAffordanceTool('fence', 'move-control-point')
             return RegistryAffordance ? (
@@ -333,7 +345,8 @@ export const ToolManager: React.FC = () => {
               </Suspense>
             ) : null
           })()}
-        {tangentTarget &&
+        {isToolDrivenReshape &&
+          tangentTarget &&
           (() => {
             const RegistryAffordance = getRegistryAffordanceTool('fence', 'move-tangent')
             return RegistryAffordance ? (

packages/editor/src/components/tools/wall/wall-drafting.test.ts

@@ -86,7 +86,7 @@ describe('createWallOnCurrentLevel', () => {
     useEditor.getState().setSnappingMode('wall', 'lines')
     useInteractionScope
       .getState()
-      .begin({ kind: 'reshaping', nodeId: 'wall_a', reshape: 'endpoint' })
+      .begin({ kind: 'reshaping', nodeId: 'wall_a', reshape: 'endpoint', driver: 'tool' })
     seedLevel([makeWall([0, 0], [4, 0], 'wall_a')])
     useScene.temporal.getState().clear()
     useScene.temporal.getState().resume()

packages/editor/src/lib/camera-pose.test.ts

@@ -2,6 +2,8 @@ import { describe, expect, test } from 'bun:test'
 import {
   normalizeCameraPose,
   planCameraPoseApplication,
+  publishInitialCameraPose,
+  releaseCameraPoseEventSuppression,
   stepCameraPoseInterpolation,
   withCameraPoseDistance,
 } from './camera-pose'
@@ -163,6 +165,28 @@ describe('camera pose', () => {
     })
   })
 
+  test('publishes the initial pose before any camera control update event', () => {
+    let publishCount = 0
+
+    publishInitialCameraPose(() => {
+      publishCount += 1
+    })
+
+    expect(publishCount).toBe(1)
+  })
+
+  test('publishes the settled pose when programmatic interpolation releases suppression', () => {
+    const suppression = { current: true }
+    let publishCount = 0
+
+    releaseCameraPoseEventSuppression(suppression, () => {
+      publishCount += 1
+    })
+
+    expect(suppression.current).toBe(false)
+    expect(publishCount).toBe(1)
+  })
+
   test('retargets the bounded interpolation owner to the latest pose', () => {
     const first = stepCameraPoseInterpolation(
       [0, 0, 0],

packages/editor/src/lib/camera-pose.ts

@@ -17,6 +17,18 @@ export type CameraPoseInterpolationStep = {
   target: [number, number, number]
 }
 
+export function publishInitialCameraPose(publishCurrentPose: () => void): void {
+  publishCurrentPose()
+}
+
+export function releaseCameraPoseEventSuppression(
+  suppression: { current: boolean },
+  publishCurrentPose: () => void,
+): void {
+  suppression.current = false
+  publishCurrentPose()
+}
+
 function finiteVectorTuple(value: unknown): [number, number, number] | null {
   if (
     !(

packages/editor/src/lib/interaction/overlay-policy.test.ts

@@ -17,7 +17,7 @@ const ACTIVE_SCOPES: ActiveInteractionScope[] = [
   { kind: 'moving', node: mockNode('i1', 'item'), nodeId: 'i1', nodeType: 'item', view: '2d' },
   { kind: 'handle-drag', nodeId: 'w1', handle: 'height' },
   { kind: 'drafting', tool: 'wall' },
-  { kind: 'reshaping', nodeId: 's1', reshape: 'hole', holeIndex: 0 },
+  { kind: 'reshaping', nodeId: 's1', reshape: 'hole', driver: 'tool', holeIndex: 0 },
   { kind: 'box-select' },
   { kind: 'painting' },
 ]

packages/editor/src/lib/interaction/scope.ts

@@ -13,6 +13,7 @@
 import type { AnyNode } from '@pascal-app/core'
 
 export type InteractionView = '2d' | '3d'
+export type ReshapeDriver = 'tool' | 'floorplan'
 
 // Endpoint/curve/hole/boundary edits are all "reshape the selected node" — one
 // node, one in-flight reshape. Grouping them as sub-states of `reshaping`
@@ -47,6 +48,8 @@ export type InteractionScope =
       kind: 'reshaping'
       nodeId: string
       reshape: ReshapeKind
+      // Floorplan affordances own their commit and must not mount a second 3D reshape tool.
+      driver: ReshapeDriver
       holeIndex?: number
       endpoint?: 'start' | 'end'
       index?: number
@@ -126,12 +129,14 @@ export function editingHoleInfo(
 export function holeEditScope(target: {
   nodeId: string
   holeIndex: number
+  driver?: ReshapeDriver
 }): ActiveInteractionScope {
   return {
     kind: 'reshaping',
     nodeId: target.nodeId,
     reshape: 'hole',
     holeIndex: target.holeIndex,
+    driver: target.driver ?? 'tool',
   }
 }
 
@@ -142,6 +147,14 @@ export function isCurveReshape(scope: InteractionScope): boolean {
   return scope.kind === 'reshaping' && scope.reshape === 'curve'
 }
 
+export function isToolDrivenReshape(scope: InteractionScope): boolean {
+  return scope.kind === 'reshaping' && scope.driver === 'tool'
+}
+
+export function isFloorplanDrivenReshape(scope: InteractionScope): boolean {
+  return scope.kind === 'reshaping' && scope.driver === 'floorplan'
+}
+
 // The legacy `movingWallEndpoint` / `movingFenceEndpoint` flags minus the node
 // itself (consumers fetch the node from the scene by `nodeId`; it is stable for
 // the duration of the drag).
@@ -181,31 +194,43 @@ export function reshapingNodeId(scope: InteractionScope): string | null {
 }
 
 // Builders so producers don't re-spell the discriminator at every call site.
-export function curveReshapeScope(nodeId: string): ActiveInteractionScope {
+export function curveReshapeScope(
-  return { kind: 'reshaping', nodeId, reshape: 'curve' }
+  nodeId: string,
+  driver: ReshapeDriver = 'tool',
+): ActiveInteractionScope {
+  return { kind: 'reshaping', nodeId, reshape: 'curve', driver }
 }
 
 export function endpointReshapeScope(
   nodeId: string,
   endpoint: 'start' | 'end',
+  driver: ReshapeDriver = 'tool',
 ): ActiveInteractionScope {
-  return { kind: 'reshaping', nodeId, reshape: 'endpoint', endpoint }
+  return { kind: 'reshaping', nodeId, reshape: 'endpoint', endpoint, driver }
 }
 
-export function controlPointReshapeScope(nodeId: string, index: number): ActiveInteractionScope {
+export function controlPointReshapeScope(
-  return { kind: 'reshaping', nodeId, reshape: 'control-point', index }
+  nodeId: string,
+  index: number,
+  driver: ReshapeDriver = 'tool',
+): ActiveInteractionScope {
+  return { kind: 'reshaping', nodeId, reshape: 'control-point', index, driver }
 }
 
 export function tangentReshapeScope(
   nodeId: string,
   index: number,
   side: 'in' | 'out',
+  driver: ReshapeDriver = 'tool',
 ): ActiveInteractionScope {
-  return { kind: 'reshaping', nodeId, reshape: 'tangent', index, side }
+  return { kind: 'reshaping', nodeId, reshape: 'tangent', index, side, driver }
 }
 
 // Dragging a polygon vertex/edge (slab / ceiling boundary). Drives the snapping
 // HUD (no-angle 'polygon' set) and keeps the idle select hints off-screen.
-export function boundaryReshapeScope(nodeId: string): ActiveInteractionScope {
+export function boundaryReshapeScope(
-  return { kind: 'reshaping', nodeId, reshape: 'boundary' }
+  nodeId: string,
+  driver: ReshapeDriver = 'tool',
+): ActiveInteractionScope {
+  return { kind: 'reshaping', nodeId, reshape: 'boundary', driver }
 }

packages/editor/src/store/use-interaction-scope.test.ts

@@ -2,10 +2,12 @@ import { afterEach, describe, expect, test } from 'bun:test'
 import type { AnyNode } from '@pascal-app/core'
 import {
   type ActiveInteractionScope,
+  curveReshapeScope,
   editingHoleInfo,
   handleDragInfo,
   isActive,
   isIdle,
+  isToolDrivenReshape,
   scopeNodeId,
   selectionEnabled,
 } from '../lib/interaction/scope'
@@ -137,7 +139,13 @@ describe('derived flag views are leak-free (no parallel flags)', () => {
 
   test('editingHoleInfo mirrors a hole reshape and clears on end', () => {
     const s = useInteractionScope.getState()
-    s.begin({ kind: 'reshaping', nodeId: 'slab_1', reshape: 'hole', holeIndex: 2 })
+    s.begin({
+      kind: 'reshaping',
+      nodeId: 'slab_1',
+      reshape: 'hole',
+      driver: 'tool',
+      holeIndex: 2,
+    })
     expect(editingHoleInfo(scope())).toEqual({ nodeId: 'slab_1', holeIndex: 2 })
     s.end()
     expect(editingHoleInfo(scope())).toBeNull()
@@ -145,16 +153,27 @@ describe('derived flag views are leak-free (no parallel flags)', () => {
 
   test('a non-hole reshape never reads as an editing hole', () => {
     const s = useInteractionScope.getState()
-    s.begin({ kind: 'reshaping', nodeId: 'wall_1', reshape: 'curve' })
+    s.begin({ kind: 'reshaping', nodeId: 'wall_1', reshape: 'curve', driver: 'tool' })
     expect(editingHoleInfo(scope())).toBeNull()
   })
 
+  test('a floorplan-owned curve drag does not activate the registry reshape tool', () => {
+    expect(isToolDrivenReshape(curveReshapeScope('wall_1', 'floorplan'))).toBe(false)
+    expect(isToolDrivenReshape(curveReshapeScope('wall_1', 'tool'))).toBe(true)
+  })
+
   test('switching interactions never leaks the prior derived view', () => {
     const s = useInteractionScope.getState()
     s.begin({ kind: 'handle-drag', nodeId: 'wall_1', handle: 'height' })
     // Single-owner replacement: the handle-drag view must vanish the instant a
     // different interaction begins — the two cannot be simultaneously active.
-    s.begin({ kind: 'reshaping', nodeId: 'slab_1', reshape: 'hole', holeIndex: 0 })
+    s.begin({
+      kind: 'reshaping',
+      nodeId: 'slab_1',
+      reshape: 'hole',
+      driver: 'tool',
+      holeIndex: 0,
+    })
     expect(handleDragInfo(scope())).toBeNull()
     expect(editingHoleInfo(scope())).toEqual({ nodeId: 'slab_1', holeIndex: 0 })
   })

packages/editor/src/store/use-interaction-scope.ts

@@ -13,6 +13,8 @@ import {
   IDLE_SCOPE,
   type InteractionScope,
   isCurveReshape,
+  isFloorplanDrivenReshape,
+  isToolDrivenReshape,
   movingNodeOf,
   reshapingNodeId,
   tangentReshapeInfo,
@@ -84,6 +86,12 @@ export const getIsCurveReshape = (): boolean => isCurveReshape(useInteractionSco
 // recovered by reading the reshaped node's type from `useReshapingNode`.
 export const useIsCurveReshape = (): boolean => useInteractionScope((s) => isCurveReshape(s.scope))
 
+export const useIsToolDrivenReshape = (): boolean =>
+  useInteractionScope((s) => isToolDrivenReshape(s.scope))
+
+export const useIsFloorplanDrivenReshape = (): boolean =>
+  useInteractionScope((s) => isFloorplanDrivenReshape(s.scope))
+
 // Replaces the legacy `movingWallEndpoint` / `movingFenceEndpoint` payloads,
 // minus the node (fetch it from `useReshapingNode`).
 export const useEndpointReshape = (): { nodeId: string; endpoint: 'start' | 'end' } | null =>

packages/nodes/src/wall/floorplan-affordances.test.ts

@@ -0,0 +1,50 @@
+import { afterEach, describe, expect, test } from 'bun:test'
+import { type AnyNodeId, useLiveNodeOverrides, useScene, WallNode } from '@pascal-app/core'
+import { wallCurveAffordance } from './floorplan-affordances'
+
+globalThis.requestAnimationFrame ??= (callback) => {
+  callback(0)
+  return 0
+}
+globalThis.cancelAnimationFrame ??= () => {}
+
+const modifiers = {
+  shiftKey: false,
+  altKey: false,
+  ctrlKey: false,
+  metaKey: false,
+}
+
+describe('wall center curve handle release', () => {
+  afterEach(() => {
+    useLiveNodeOverrides.getState().clearAll()
+  })
+
+  test('persists the previewed curve offset after commit clears the override', () => {
+    const wall = WallNode.parse({
+      id: 'wall_curve-release',
+      parentId: null,
+      start: [0, 0],
+      end: [4, 0],
+    })
+    useScene.setState({ nodes: { [wall.id]: wall } as never })
+
+    const session = wallCurveAffordance.start({
+      node: wall,
+      payload: { wallId: wall.id },
+      nodes: useScene.getState().nodes,
+      initialPlanPoint: [2, 0],
+      gridSnapStep: 0.1,
+    })
+    session.apply({ planPoint: [2, 1], modifiers })
+
+    expect((useScene.getState().nodes[wall.id] as typeof wall).curveOffset ?? 0).toBe(0)
+    expect(useLiveNodeOverrides.getState().get(wall.id as AnyNodeId)?.curveOffset).not.toBe(0)
+
+    expect(session.canCommit()).toBe(true)
+    session.commit?.()
+
+    expect((useScene.getState().nodes[wall.id] as typeof wall).curveOffset).not.toBe(0)
+    expect(useLiveNodeOverrides.getState().get(wall.id as AnyNodeId)).toBeUndefined()
+  })
+})

packages/viewer/src/components/viewer/post-processing.tsx

@@ -526,7 +526,6 @@ const PostProcessingPasses = ({
       let visualAlpha = contentAlpha
       if (outlineEnabled) {
         const outlineNode = mergedOutline(scene, camera, {
-          enabled: () => !useViewer.getState().cameraDragging,
           primaryObjects: outliner.selectedObjects,
           secondaryObjects: outliner.hoveredObjects,
           primaryEdgeThickness: uniform(1),

packages/viewer/src/lib/merged-outline-node.test.ts

@@ -5,18 +5,20 @@ import { Object3D, PerspectiveCamera, Scene } from 'three'
 import { mergedOutline } from './merged-outline-node'
 
 describe('merged outline rendering', () => {
-  test('skips outline work while the pass is disabled', () => {
+  test('keeps selected outlines active during camera interaction', () => {
-    const outline = mergedOutline(new Scene(), new PerspectiveCamera(), {
+    const cameraInteractionActive = true
-      enabled: () => false,
+    const params = {
+      enabled: () => !cameraInteractionActive,
       primaryObjects: [new Object3D()],
-    })
+    }
+    const outline = mergedOutline(new Scene(), new PerspectiveCamera(), params)
     const frame = {
       get renderer(): never {
-        throw new Error('outline renderer should not be touched')
+        throw new Error('outline renderer was reached')
       },
     }
 
-    expect(() => outline.updateBefore(frame)).not.toThrow()
+    expect(() => outline.updateBefore(frame)).toThrow('outline renderer was reached')
     outline.dispose()
   })
 })

packages/viewer/src/lib/merged-outline-node.ts

@@ -125,7 +125,6 @@ export class MergedOutlineNode extends TempNode {
   primaryEdgeGlowNode: any
   secondaryEdgeGlowNode: any
   downSampleRatio: number
-  enabled: () => boolean
   updateBeforeType: string
 
   private readonly _depthRT: RenderTarget
@@ -190,7 +189,6 @@ export class MergedOutlineNode extends TempNode {
       primaryEdgeGlow?: any
       secondaryEdgeGlow?: any
       downSampleRatio?: number
-      enabled?: () => boolean
     } = {},
   ) {
     super('vec4')
@@ -203,7 +201,6 @@ export class MergedOutlineNode extends TempNode {
       primaryEdgeGlow = float(0),
       secondaryEdgeGlow = float(0),
       downSampleRatio = 2,
-      enabled = () => true,
     } = params
 
     this.scene = scene
@@ -215,7 +212,6 @@ export class MergedOutlineNode extends TempNode {
     this.primaryEdgeGlowNode = nodeObject(primaryEdgeGlow)
     this.secondaryEdgeGlowNode = nodeObject(secondaryEdgeGlow)
     this.downSampleRatio = downSampleRatio
-    this.enabled = enabled
     this.updateBeforeType = NodeUpdateType.FRAME
 
     this._depthRT = new RenderTarget()
@@ -305,9 +301,8 @@ export class MergedOutlineNode extends TempNode {
   }
 
   updateBefore(frame: any) {
-    const enabled = this.enabled()
+    const hasPrimary = this.primaryObjects.length > 0
-    const hasPrimary = enabled && this.primaryObjects.length > 0
+    const hasSecondary = this.secondaryObjects.length > 0
-    const hasSecondary = enabled && this.secondaryObjects.length > 0
     const hasAny = hasPrimary || hasSecondary
 
     // Fast-path: nothing to render and nothing was rendered last frame either,

wiki/architecture/interaction-scope.md

@@ -22,22 +22,28 @@ scope is exactly one interaction at a time, and `idle` carries no payload.
 | `kind` | Payload | What |
 |---|---|---|
 | `idle` | — | Nothing in flight. The only state where selection/hover picking is meaningful. |
-| `placing` | `nodeId`, `nodeType`, `view`, `pressDrag` | Placing a fresh node (catalog/preset/build tool). `pressDrag` = gizmo press-drag (commit on release) vs click-to-place. |
+| `placing` | `node`, `nodeId`, `nodeType`, `view`, `pressDrag` | Placing a fresh node (catalog/preset/build tool). `node` carries the not-yet-committed draft; `pressDrag` = gizmo press-drag (commit on release) vs click-to-place. |
-| `moving` | `nodeId`, `nodeType`, `view` | Moving an existing node. |
+| `moving` | `node`, `nodeId`, `nodeType`, `view` | Moving an existing node. |
 | `handle-drag` | `nodeId`, `handle` | Dragging a resize/translate/rotate handle of a selected node. |
 | `drafting` | `tool` | Click-to-click drafting of a polyline/polygon kind (wall/fence/slab/…). |
-| `reshaping` | `nodeId`, `reshape`, `holeIndex?` | Reshaping a selected node's geometry. `reshape` is `curve \| hole \| endpoint \| boundary`. |
+| `reshaping` | `nodeId`, `reshape`, `driver`, `holeIndex?`, `endpoint?`, `index?`, `side?` | Reshaping a selected node's geometry. `driver` identifies the interaction body that owns preview and commit. |
 | `box-select` | — | Marquee selection drag. |
 | `painting` | — | Material paint application. |
 
-`reshaping` groups endpoint/curve/hole/boundary edits as sub-states of one scope
+`reshaping` groups endpoint/curve/hole/boundary/control-point/tangent edits as
-(rather than four sibling kinds) — there is one node and one in-flight reshape,
+sub-states of one scope — there is one node and one in-flight reshape, so
-so "curving and hole-editing at once" stays unrepresentable. `view` is `'2d' | '3d'`.
+"curving and hole-editing at once" stays unrepresentable. Its `driver` is
+`'tool' | 'floorplan'`: framework tools own tool-driven interactions, while a
+floor-plan affordance owns the complete preview/commit lifecycle of a
+floorplan-driven interaction. The driver prevents both interaction bodies from
+mounting for the same gesture. Placing and moving use `view: '2d' | '3d'`.
 
 ### Helpers
 
 - `isIdle(scope)` / `isActive(scope)` — `idle` vs anything else (`ActiveInteractionScope`).
 - `scopeNodeId(scope)` — the node a scope acts on, or `null`. `drafting`/`box-select`/`painting`/`idle` target no single existing node.
+- `isToolDrivenReshape(scope)` / `isFloorplanDrivenReshape(scope)` — narrow
+  reshape ownership so only the matching interaction body mounts.
 - `selectionEnabled(scope)` — true only while `idle`. During any active interaction the pointer belongs to that interaction's body, not to selecting a different object; the picking choke point must not route a hover/click to selection while this is false.
 
 ---
@@ -176,6 +182,10 @@ independent flag clear can't stomp an unrelated scope) to keep the scope in sync
 ## Rules
 
 - **One owner, one scope.** Only `useInteractionScope` writes the scope, and only via `begin`/`update`/`end`/`endIf`. Never reconstruct interaction state from a private combination of flags.
+- **One reshape driver.** A floorplan-driven reshape is previewed and committed
+  by its floor-plan affordance; a tool-driven reshape is owned by the framework
+  tool. Gate interaction bodies with the driver so both cannot act on one
+  gesture.
 - **`end` is atomic and payload-free.** Never leave a `nodeId`/payload behind on idle; commit-vs-revert logic belongs in the interaction body before `end`.
 - **`update` cannot change `kind`.** Switching interactions is a `begin`, not a patch.
 - **Hot-set and overlay policy are pure derivations of the scope** (and, for the hot-set, the candidate metadata). Don't branch overlay/picking behaviour on legacy flags — branch on the scope.