@pascal-app/editor 1.0.5 → 1.0.7

package/src/components/editor/selection-manager.tsx

@@ -15,7 +15,6 @@ import {
   type NodeEvent,
   nodeRegistry,
   type RoofEvent,
-  type RoofNode,
   type RoofSegmentEvent,
   type RoofSegmentNode,
   resolveLevelId,
@@ -29,7 +28,13 @@ import {
   useScene,
   wallFaceScriptPaintRefusal,
 } from '@pascal-app/core'
-import { getRoofMaterialArray, registerMaterialCacheCleanup, useViewer } from '@pascal-app/viewer'
+import {
+  markHighlight,
+  ROOF_HEEL_MATERIAL_INDEX,
+  registerMaterialCacheCleanup,
+  tintEmissive,
+  useViewer,
+} from '@pascal-app/viewer'
 import { useThree } from '@react-three/fiber'
 import { useCallback, useEffect, useRef } from 'react'
 import { type BufferGeometry, Color, type Material, type Mesh, type Object3D, Vector3 } from 'three'
@@ -57,7 +62,6 @@ import {
 import { selectionEnabled } from '../../lib/interaction/scope'
 import {
   type ActivePaintMaterial,
-  buildRoofSurfaceMaterialPatch,
   hasActivePaintMaterial,
   resolveActivePaintMaterialFromSelection,
 } from '../../lib/material-paint'
@@ -90,7 +94,6 @@ import {
   paintScopeRole,
   paintSurfaceLabel,
   resolvePaintScopeTargets,
-  slotDisplayLabel,
   type WallPaintHit,
 } from '../../lib/paint-scope'
 import {
@@ -248,9 +251,10 @@ function resolveStairMaterialTarget(
 
 function resolveRoofMaterialTarget(
   event: RoofEvent | RoofSegmentEvent,
-): 'top' | 'edge' | 'wall' | null {
+): 'top' | 'edge' | 'wall' | 'heel' | null {
   const materialIndex = getIntersectionMaterialIndex(getEventObject(event), event.faceIndex)
   if (materialIndex === 3) return 'top'
+  if (materialIndex === ROOF_HEEL_MATERIAL_INDEX) return 'heel'
   if (materialIndex === 0) return 'edge'
   if (materialIndex === 1 || materialIndex === 2) return 'wall'
 
@@ -451,14 +455,6 @@ function resolveSelectModeNodeTarget(event: NodeEvent, drill = false): AnyNode {
   return event.node
 }
 
-function previewMeshMaterial(mesh: Mesh, material: Material | Material[]): PaintPreviewCleanup {
-  const previousMaterial = mesh.material
-  mesh.material = material
-  return () => {
-    mesh.material = previousMaterial
-  }
-}
-
 function previewCursor(cursor: string): PaintPreviewCleanup {
   const previousCursor = document.body.style.cursor
   document.body.style.cursor = cursor
@@ -467,33 +463,6 @@ function previewCursor(cursor: string): PaintPreviewCleanup {
   }
 }
 
-function applyRoofPaintPreview(
-  node: RoofNode,
-  role: 'top' | 'edge' | 'wall',
-  material: ActivePaintMaterial,
-): PaintPreviewCleanup | null {
-  const root = getRegisteredNodeObject(node.id)
-  const mesh = root?.getObjectByName('merged-roof') as Mesh | undefined
-  if (!mesh) return null
-
-  const previewNode = {
-    ...node,
-    ...buildRoofSurfaceMaterialPatch(node, role, material.material, material.materialPreset),
-  }
-  const previewMaterial = getRoofMaterialArray(
-    previewNode,
-    useViewer.getState().shading,
-    useViewer.getState().textures,
-    useViewer.getState().colorPreset,
-    useViewer.getState().sceneTheme,
-    null,
-    useScene.getState().materials,
-  )
-  if (!previewMaterial) return null
-
-  return previewMeshMaterial(mesh, previewMaterial)
-}
-
 // Chimney + dormer paint dispatch lives on their NodeDefinition's
 // `capabilities.paint` (see packages/nodes/src/{chimney,dormer}/
 // paint.ts). The generic registry-driven arm in this file consults
@@ -518,16 +487,14 @@ const HIGHLIGHT_PROFILES = {
   delete: {
     color: new Color('#dc2626'),
     blend: 0.76,
-    emissiveBlend: 0.92,
-    emissiveIntensity: 0.46,
+    emissive: 0.92,
   },
   selection: {
     // Keep the real material/texture readable: no albedo tint, just a gentle
     // indigo emissive glow so it reads as selected.
     color: new Color('#818cf8'),
     blend: 0,
-    emissiveBlend: 0.4,
-    emissiveIntensity: 0.12,
+    emissive: 0.12,
   },
 } as const
 
@@ -582,15 +549,7 @@ function createHighlightedMaterial(material: Material, kind: HighlightKind): Mat
     highlightedMaterial.color = highlightedMaterial.color.clone().lerp(profile.color, profile.blend)
   }
 
-  if (highlightedMaterial.emissive instanceof Color) {
-    highlightedMaterial.emissive = highlightedMaterial.emissive
-      .clone()
-      .lerp(profile.color, profile.emissiveBlend)
-    highlightedMaterial.emissiveIntensity = Math.max(
-      highlightedMaterial.emissiveIntensity ?? 0,
-      profile.emissiveIntensity,
-    )
-  }
+  tintEmissive(highlightedMaterial, profile.color, profile.emissive)
 
   if (typeof highlightedMaterial.opacity === 'number' && highlightedMaterial.opacity < 1) {
     highlightedMaterial.transparent = true
@@ -598,7 +557,7 @@ function createHighlightedMaterial(material: Material, kind: HighlightKind): Mat
   }
 
   highlightedMaterial.needsUpdate = true
-  return highlightedMaterial
+  return markHighlight(highlightedMaterial)
 }
 
 function createHighlightedMaterials(
@@ -892,9 +851,7 @@ export const SelectionManager = () => {
 
       // Registry-driven paint dispatch — kinds that declare
       // `capabilities.paint` route hover / click / preview through
-      // their definition. Wall, chimney, and dormer use this; legacy
-      // roof / stair / single-surface arms below stay until they
-      // migrate too.
+      // their definition (wall, chimney, dormer, roof, …).
       const paintCap = nodeRegistry.get(node.type)?.capabilities?.paint
       if (paintCap) {
         const materialIndex = getIntersectionMaterialIndex(getEventObject(event), event.faceIndex)
@@ -1063,51 +1020,7 @@ export const SelectionManager = () => {
         }
       }
 
-      // A segment paints through its definition's `capabilities.paint`; the merged shell's hit is
-      // the roof's, and fans to it.
-      if (node.type === 'roof') {
-        const role = resolveRoofMaterialTarget(event as RoofEvent)
-        if (isPaintPicking()) return pickInteraction(node, role, event, null)
-        const compatible = role !== null && paintEnabled
-        return {
-          key: `roof:${node.id}:${role ?? 'unsupported'}:${eraser ? 'erase' : 'paint'}`,
-          hoveredId: node.id as AnyNodeId,
-          hoverMode: compatible ? (eraser ? 'erase-ready' : 'paint-ready') : 'paint-disabled',
-          // Roof isn't on the slot model (role-specific fields, custom commit),
-          // so it offers only the single surface — but still labels it.
-          paintHover:
-            compatible && role
-              ? {
-                  scopes: ['single'],
-                  slotLabel: slotDisplayLabel(node, role),
-                  nodeNoun: 'roof',
-                }
-              : null,
-          apply:
-            compatible && role
-              ? () => {
-                  useScene
-                    .getState()
-                    .updateNode(
-                      node.id as AnyNodeId,
-                      buildRoofSurfaceMaterialPatch(
-                        node,
-                        role,
-                        paintSpec.material,
-                        paintSpec.materialPreset,
-                      ),
-                    )
-                }
-              : null,
-          preview:
-            compatible && role
-              ? () => applyRoofPaintPreview(node, role, paintSpec)
-              : () => previewCursor('not-allowed'),
-        }
-      }
-
-      // Only `roof` reaches a legacy paint arm (above) — every
-      // other paintable kind declares `capabilities.paint` and returns from the
+      // Every paintable kind declares `capabilities.paint` and returns from the
       // registry-driven dispatch at the top of this function.
 
       const disabledNodeTypes = ['zone']

package/src/components/editor/separator-end-grip.tsx

@@ -0,0 +1,74 @@
+'use client'
+
+import { type SeparatorNode, sceneRegistry } from '@pascal-app/core'
+import { type ThreeEvent, useThree } from '@react-three/fiber'
+import { useState } from 'react'
+import { OrthographicCamera, Plane, Vector2, Vector3 } from 'three'
+import { runSeparatorEndDrag } from '../../lib/separator-edit'
+import { suppressBoxSelectForPointer } from '../tools/select/box-select-state'
+import { HandleArrow } from './handles/handle-arrow'
+
+/**
+ * An invisible wall's 3D end grip, the twin of its end handle on the plan: a
+ * cube at the end, on the floor at `height`. Dragging it moves the end across
+ * that floor (`runSeparatorEndDrag`), the invisible walls joined there
+ * following. Rendered in the level frame.
+ */
+export function SeparatorEndGrip({
+  separator,
+  endpoint,
+  height,
+  levelId,
+}: {
+  separator: SeparatorNode
+  endpoint: 'start' | 'end'
+  height: number
+  levelId: string
+}) {
+  const [hover, setHover] = useState(false)
+  const { camera, raycaster, gl } = useThree()
+  const zoom = camera instanceof OrthographicCamera ? 1 / camera.zoom : 1
+  const [x, z] = separator[endpoint]
+  const onPointerDown = (event: ThreeEvent<PointerEvent>) => {
+    if (event.button !== 0) return
+    event.stopPropagation()
+    suppressBoxSelectForPointer(event)
+    const level = sceneRegistry.nodes.get(levelId)
+    if (!level) return
+    level.updateWorldMatrix(true, false)
+    const toLocal = level.matrixWorld.clone().invert()
+    const floor = new Plane().setFromNormalAndCoplanarPoint(
+      new Vector3(0, 1, 0).transformDirection(level.matrixWorld),
+      new Vector3(x, height, z).applyMatrix4(level.matrixWorld),
+    )
+    runSeparatorEndDrag({
+      separatorId: separator.id,
+      endpoint,
+      levelId,
+      toPlan: (clientX, clientY) => {
+        const rect = gl.domElement.getBoundingClientRect()
+        raycaster.setFromCamera(
+          new Vector2(
+            ((clientX - rect.left) / rect.width) * 2 - 1,
+            -((clientY - rect.top) / rect.height) * 2 + 1,
+          ),
+          camera,
+        )
+        const hit = raycaster.ray.intersectPlane(floor, new Vector3())
+        if (!hit) return null
+        const local = hit.applyMatrix4(toLocal)
+        return [local.x, local.z]
+      },
+    })
+  }
+  return (
+    <HandleArrow
+      cursor="grab"
+      hover={hover}
+      onHoverChange={setHover}
+      onPointerDown={onPointerDown}
+      placement={{ position: [x, height, z], baseScale: zoom }}
+      shape="tracker"
+    />
+  )
+}

package/src/components/editor/site-edge-labels.tsx

@@ -3,7 +3,6 @@
 import type { SiteNode } from '@pascal-app/core'
 import { sceneRegistry, useLiveNodeOverrides, useScene } from '@pascal-app/core'
 import { getSceneTheme, useViewer } from '@pascal-app/viewer'
-import { Html } from '@react-three/drei'
 import { createPortal, useFrame, useThree } from '@react-three/fiber'
 import { useCallback, useMemo, useRef, useState } from 'react'
 import { type Camera, type Object3D, Vector3 } from 'three'
@@ -11,6 +10,7 @@ import { groundHeightAt } from '../../lib/ground-surface'
 import { formatLinearMeasurement } from '../../lib/measurements'
 import { SITE_BOUNDARY_DRAG_LABEL } from '../../lib/site-boundary'
 import { useActiveHandleDrag } from '../../store/use-interaction-scope'
+import { Html } from './localized-html'
 
 type ViewportSize = {
   width: number

package/src/components/editor/thumbnail-generator.test.ts

@@ -205,31 +205,38 @@ describe('a sheet capture session', () => {
     const viewer = useViewer.getState()
     viewer.setWallMode('down')
     viewer.setLevelMode('exploded')
-    viewer.setShading('solid')
+    viewer.setRenderQuality('low')
     viewer.setTextures(false)
     viewer.setColorPreset('white')
+    viewer.setTimeOfDay('night')
+    viewer.setWeather('overcast')
     const view = () => {
-      const { wallMode, levelMode, shading, textures, colorPreset } = useViewer.getState()
-      return { wallMode, levelMode, shading, textures, colorPreset }
+      const { wallMode, levelMode, renderQuality, textures, colorPreset, timeOfDay, weather } =
+        useViewer.getState()
+      return { wallMode, levelMode, renderQuality, textures, colorPreset, timeOfDay, weather }
     }
-    // the shading stays the user's: the capture brings its own AO
+    // the quality stays the user's: the capture brings its own AO
 
     const restore = presentFinished()
     expect(view()).toEqual({
       wallMode: 'up',
       levelMode: 'stacked',
-      shading: 'solid',
+      renderQuality: 'low',
       textures: true,
       colorPreset: 'clay',
+      timeOfDay: 'midday',
+      weather: 'fair',
     })
 
     restore()
     expect(view()).toEqual({
       wallMode: 'down',
       levelMode: 'exploded',
-      shading: 'solid',
+      renderQuality: 'low',
       textures: false,
       colorPreset: 'white',
+      timeOfDay: 'night',
+      weather: 'overcast',
     })
   })
 
@@ -239,6 +246,8 @@ describe('a sheet capture session', () => {
     viewer.setLevelMode('stacked')
     viewer.setTextures(true)
     viewer.setColorPreset('clay')
+    viewer.setTimeOfDay('midday')
+    viewer.setWeather('fair')
     let writes = 0
     const unsubscribe = useViewer.subscribe(() => {
       writes++

package/src/components/editor/thumbnail-generator.tsx

@@ -16,6 +16,7 @@ import {
   GRID_LAYER,
   heroCameraPose,
   holdLiveFrame,
+  itemLightsForCapture,
   pendingSceneBuildCount,
   presentLevelsForCapture,
   refreshIsolation,
@@ -437,13 +438,15 @@ const HOLD_MAX_MS = 300_000
  * What the sheets' pictures are drawn in, whatever the user's view: full-
  * height walls, the storeys stacked at their true heights, the materials'
  * own textures and colours (a white or blueprint palette is a view, not the
- * house). The shading stays the user's: the capture brings its own AO.
+ * house), lit by a fair midday. The shading stays the user's: the capture brings its own AO.
  */
 const FINISHED_PRESENTATION = {
   wallMode: 'up',
   levelMode: 'stacked',
   textures: true,
   colorPreset: 'clay',
+  timeOfDay: 'midday',
+  weather: 'fair',
 } as const
 
 /** The viewer switched to FINISHED_PRESENTATION; the returned function puts the user's view back. */
@@ -470,6 +473,25 @@ export function presentFinished(): () => void {
     viewer.setColorPreset(FINISHED_PRESENTATION.colorPreset)
     restores.push(() => useViewer.getState().setColorPreset(colorPreset))
   }
+  if (
+    viewer.timeOfDay !== FINISHED_PRESENTATION.timeOfDay ||
+    viewer.timeOfDayMinutes !== null ||
+    viewer.skyLive
+  ) {
+    const { timeOfDay, timeOfDayMinutes, skyLive } = viewer
+    viewer.setTimeOfDay(FINISHED_PRESENTATION.timeOfDay)
+    restores.push(() => {
+      const next = useViewer.getState()
+      next.setTimeOfDay(timeOfDay)
+      if (timeOfDayMinutes !== null) next.setTimeOfDayMinutes(timeOfDayMinutes)
+      if (skyLive) next.setSkyLive(true)
+    })
+  }
+  if (viewer.weather !== FINISHED_PRESENTATION.weather) {
+    const weather = viewer.weather
+    viewer.setWeather(FINISHED_PRESENTATION.weather)
+    restores.push(() => useViewer.getState().setWeather(weather))
+  }
   return () => {
     for (const restore of restores.reverse()) restore()
   }
@@ -995,6 +1017,9 @@ export const ThumbnailGenerator = ({ onThumbnailCapture }: ThumbnailGeneratorPro
               } else if (snapLevels || pose || cameraPose) {
                 exteriorGroundForCapture(restore, Boolean(cameraPose || pose), thumbnailCamera)
               }
+              // Last, with the camera where the picture is taken from: the item lights that
+              // matter to it, at full strength.
+              restore(itemLightsForCapture(scene, thumbnailCamera))
             }
             // The scene pass is a FRAME-updated node: it renders once per node
             // frame, and only the animation loop advances that frame. With the

package/src/components/editor/use-floorplan-background-placement.ts

@@ -19,6 +19,8 @@ import { resolveGenericFloorplanGridEventPoint } from '../../lib/floorplan-grid-
 import { snapRegisteredDraftPoint } from '../../lib/registered-draft-snap'
 import { resolveSlabPlanPointSnap } from '../../lib/slab-plan-snap'
 import { commitWallPolygonDraft, wallPolygonDraftWalls } from '../../lib/wall-polygon-draft'
+import { wallDraftIsRun } from '../../lib/wall-pull'
+import { isWallRunFree, snapWallRunDraftPoint } from '../../lib/wall-run-snap'
 import useAlignmentGuides from '../../store/use-alignment-guides'
 import useEditor, { isAngleSnapActive, isMagneticSnapActive } from '../../store/use-editor'
 import usePlacementPreview from '../../store/use-placement-preview'
@@ -52,6 +54,8 @@ type UseFloorplanBackgroundPlacementArgs = {
     wall: WallNode
   } | null
   floorplanOpeningLocalY: number
+  /** An open wall run's start and the direction of its last wall (null before one). */
+  getWallRunContext: () => { runStart: WallPlanPoint | null; reference: WallPlanPoint | null }
   getSnappedFloorplanPoint: (point: WallPlanPoint) => WallPlanPoint
   handleCeilingItemPlacementClick: (
     planPoint: WallPlanPoint,
@@ -72,12 +76,9 @@ type UseFloorplanBackgroundPlacementArgs = {
   isZoneBuildActive: boolean
   levelId: string | null
   registryToolOwnsSnapping: boolean
-  roofDraftStart: WallPlanPoint | null
   setCursorPoint: React.Dispatch<React.SetStateAction<WallPlanPoint | null>>
   setFenceDraftEnd: React.Dispatch<React.SetStateAction<WallPlanPoint | null>>
   setFenceDraftStart: React.Dispatch<React.SetStateAction<WallPlanPoint | null>>
-  setRoofDraftEnd: React.Dispatch<React.SetStateAction<WallPlanPoint | null>>
-  setRoofDraftStart: React.Dispatch<React.SetStateAction<WallPlanPoint | null>>
   snapWallDraftPoint: (args: {
     point: WallPlanPoint
     walls: WallNode[]
@@ -86,6 +87,7 @@ type UseFloorplanBackgroundPlacementArgs = {
     bypassSnap?: boolean
     step?: number
     gridSnap?: (point: WallPlanPoint) => WallPlanPoint
+    captureWallBodies?: boolean
   }) => WallPlanPoint
   snapPolygonDraftPoint: (args: {
     point: WallPlanPoint
@@ -95,10 +97,9 @@ type UseFloorplanBackgroundPlacementArgs = {
   toPoint2D: (point: WallPlanPoint) => { x: number; y: number }
   walls: WallNode[]
   /**
-   * Snap a building-local plan point to the world XZ grid at `step`.
-   * Injected so the hook doesn't have to know the building's rotation
-   * or position — used by wall / fence branches that snap at variable
-   * step.
+   * Snap a building-local plan point onto the building's grid lattice at
+   * `step` (the lattice the plan draws, which turns with the building).
+   * Injected — used by wall / fence branches that snap at variable step.
    */
   worldGridSnap: (point: WallPlanPoint, step: number) => WallPlanPoint
 }
@@ -115,6 +116,7 @@ export function useFloorplanBackgroundPlacement({
   findClosestWallPoint,
   floorplanOpeningLocalY,
   getSnappedFloorplanPoint,
+  getWallRunContext,
   handleCeilingItemPlacementClick,
   handleCeilingPlacementPoint,
   handleSlabPlacementPoint,
@@ -131,12 +133,9 @@ export function useFloorplanBackgroundPlacement({
   isZoneBuildActive,
   levelId,
   registryToolOwnsSnapping,
-  roofDraftStart,
   setCursorPoint,
   setFenceDraftEnd,
   setFenceDraftStart,
-  setRoofDraftEnd,
-  setRoofDraftStart,
   snapWallDraftPoint,
   snapPolygonDraftPoint,
   toPoint2D,
@@ -219,24 +218,14 @@ export function useFloorplanBackgroundPlacement({
       if (isRoofBuildActive) {
         // Footprint placement (polygon context: grid / lines / off, no angle),
         // mode-driven to match the chip. Alt is force/free at commit time;
-        // alignment display/pull follows the active magnetic mode.
+        // alignment display/pull follows the active magnetic mode. The roof
+        // tool snaps the corner it commits and writes the draft rectangle from
+        // it, so the plan shows exactly the roof the click makes.
         const snappedPoint = alignFloorplanDraftPoint(getSnappedFloorplanPoint(planPoint), {
           applySnap: isMagneticSnapActive(),
         })
         emitFloorplanGridEvent('click', snappedPoint, event)
         setCursorPoint(snappedPoint)
-
-        if (roofFootprintSource !== 'draw') {
-          clearRoofPlacementDraft()
-          return true
-        }
-
-        if (roofDraftStart) {
-          clearRoofPlacementDraft()
-        } else {
-          setRoofDraftStart(snappedPoint)
-          setRoofDraftEnd(snappedPoint)
-        }
         return true
       }
 
@@ -254,8 +243,8 @@ export function useFloorplanBackgroundPlacement({
 
       if (isFenceBuildActive) {
         // Fence draft: mode-driven (matches the chip), same as the move
-        // preview. `grid` snaps to the world XZ grid (rotation-safe via the
-        // `gridSnap` callback), `angles` locks 15° rays from the start, `lines`
+        // preview. `grid` snaps to the building's grid lattice (the `gridSnap`
+        // callback), `angles` locks 15° rays from the start, `lines`
         // pulls onto walls / fences / alignment, `off` is free.
         const fenceStep = getSegmentGridStep()
         const fenceAngleSnap = fenceDraftStart !== null && isAngleSnapActive()
@@ -363,30 +352,48 @@ export function useFloorplanBackgroundPlacement({
       // / draftEnd state in the floor plan would never update, leaving
       // the dashed-line draft preview invisible.
       if (isWallBuildActive) {
-        // Wall draft: mode-driven (matches the chip + the move-preview branch).
-        // `grid` snaps to the world XZ grid (rotation-safe via `gridSnap`),
-        // `angles` locks 15° rays from the start, `lines` pulls the endpoint
-        // onto existing wall corners / edges + alignment, `off` is free.
-        const wallStep = getSegmentGridStep()
-        const wallAngleSnap = draftStart !== null && isAngleSnapActive()
-        const wallSnapped = snapWallDraftPoint({
-          point: planPoint,
-          walls: [...walls, ...wallPolygonDraftWalls()],
-          start: draftStart ?? undefined,
-          angleSnap: wallAngleSnap,
-          gridSnap: (p) => worldGridSnap(p, wallStep),
-        })
-        const wallGridBase = worldGridSnap(planPoint, wallStep)
-        const wallLocked = wallSnapped[0] !== wallGridBase[0] || wallSnapped[1] !== wallGridBase[1]
-        let snappedPoint = wallSnapped
-        if (wallLocked) {
-          useAlignmentGuides.getState().clear()
+        // Wall draft, matching the move-preview branch: mode-driven (matches
+        // the chip). `grid` snaps to the building's grid lattice (`gridSnap`),
+        // `angles` locks a Walls segment to 15° rays from its start, `lines`
+        // pulls the point onto existing wall corners / edges + alignment, `off`
+        // is free, and in every mode but `lines` an end aimed into a wall's body
+        // joins that wall. A run's segment (a Polygon side, a pulled run) lands
+        // where the move showed it (`snapWallRunDraftPoint`).
+        let snappedPoint: WallPlanPoint
+        if (draftStart && wallDraftIsRun()) {
+          const run = getWallRunContext()
+          snappedPoint = snapWallRunDraftPoint({
+            point: planPoint,
+            start: draftStart,
+            runStart: run.runStart ?? draftStart,
+            reference: run.reference,
+            walls: [...walls, ...wallPolygonDraftWalls()],
+            free: isWallRunFree(event),
+          }).point
         } else {
-          // Alignment lines are shown in every mode; the pull applies only when
-          // magnetic ('lines') and the segment isn't angle-locked.
-          snappedPoint = alignFloorplanDraftPoint(wallSnapped, {
-            applySnap: isMagneticSnapActive() && !wallAngleSnap,
+          const wallStep = getSegmentGridStep()
+          const wallAngleSnap = draftStart !== null && isAngleSnapActive()
+          const wallSnapped = snapWallDraftPoint({
+            point: planPoint,
+            walls: [...walls, ...wallPolygonDraftWalls()],
+            start: draftStart ?? undefined,
+            angleSnap: wallAngleSnap,
+            gridSnap: (p) => worldGridSnap(p, wallStep),
+            captureWallBodies: true,
           })
+          const wallGridBase = worldGridSnap(planPoint, wallStep)
+          const wallLocked =
+            wallSnapped[0] !== wallGridBase[0] || wallSnapped[1] !== wallGridBase[1]
+          snappedPoint = wallSnapped
+          if (wallLocked) {
+            useAlignmentGuides.getState().clear()
+          } else {
+            // Alignment lines are shown in every mode; the pull applies only when
+            // magnetic ('lines') and the segment isn't angle-locked.
+            snappedPoint = alignFloorplanDraftPoint(wallSnapped, {
+              applySnap: isMagneticSnapActive() && !wallAngleSnap,
+            })
+          }
         }
 
         emitFloorplanGridEvent('click', snappedPoint, event)
@@ -437,12 +444,12 @@ export function useFloorplanBackgroundPlacement({
       activePolygonDraftPoints,
       ceilingDraftPoints,
       clearFencePlacementDraft,
-      clearRoofPlacementDraft,
       clearWallPlacementDraft,
       emitFloorplanGridEvent,
       fenceDraftStart,
       fences,
       findClosestWallPoint,
+      getWallRunContext,
       floorplanOpeningLocalY,
       getSnappedFloorplanPoint,
       handleCeilingItemPlacementClick,
@@ -459,14 +466,10 @@ export function useFloorplanBackgroundPlacement({
       isWallBuildActive,
       isZoneBuildActive,
       levelId,
-      roofDraftStart,
       registryToolOwnsSnapping,
-      roofFootprintSource,
       setCursorPoint,
       setFenceDraftEnd,
       setFenceDraftStart,
-      setRoofDraftEnd,
-      setRoofDraftStart,
       snapWallDraftPoint,
       snapPolygonDraftPoint,
       toPoint2D,