@pascal-app/editor 1.0.6 → 1.0.7

package/src/lib/world-grid-snap.test.ts

@@ -1,14 +1,26 @@
 import { afterEach, describe, expect, test } from 'bun:test'
-import { BuildingNode, LevelNode, useScene } from '@pascal-app/core'
+import { BuildingNode, LevelNode, snapWorldXZToBuildingLocal, useScene } from '@pascal-app/core'
 import { useViewer } from '@pascal-app/viewer'
-import { getActiveBuildingId } from './world-grid-snap'
+import useEditor from '../store/use-editor'
+import useInteractionScope from '../store/use-interaction-scope'
+import {
+  getActiveBuildingId,
+  getActiveGridPose,
+  resolveAlignmentForActiveBuilding,
+  resolveAlignmentForFloorplanView,
+  snapBuildingLocalToWorldGrid,
+  snapWorldXZForActiveBuilding,
+} from './world-grid-snap'
 
 const originalNodes = useScene.getState().nodes
 const originalSelection = useViewer.getState().selection
+const originalPhase = useEditor.getState().phase
 
 afterEach(() => {
   useScene.setState({ nodes: originalNodes } as never)
   useViewer.setState({ selection: originalSelection } as never)
+  useEditor.setState({ phase: originalPhase })
+  useInteractionScope.getState().end()
 })
 
 describe('getActiveBuildingId', () => {
@@ -46,3 +58,128 @@ describe('getActiveBuildingId', () => {
     expect(getActiveBuildingId()).toBe(building.id)
   })
 })
+
+// A building the site planner set on its lot: turned and offset. The plan only
+// carries the level, as it often does (`selection.buildingId` null).
+const YAW = (17 * Math.PI) / 180
+const POSITION: [number, number, number] = [12.37, 0, -8.91]
+
+function selectTurnedBuilding() {
+  const level = LevelNode.parse({})
+  const building = BuildingNode.parse({
+    position: POSITION,
+    rotation: [0, YAW, 0],
+    children: [level.id],
+  })
+  useScene.setState({
+    nodes: { [building.id]: building, [level.id]: { ...level, parentId: building.id } },
+  } as never)
+  useViewer.setState({
+    selection: { buildingId: null, levelId: level.id, zoneId: null, selectedIds: [] },
+  } as never)
+  return building
+}
+
+describe("grid snap on the building's own lattice", () => {
+  test('a turned, offset building snaps square to itself, not to the world grid', () => {
+    selectTurnedBuilding()
+    expect(snapBuildingLocalToWorldGrid([1.26, 3.74], 0.5)).toEqual([1.5, 3.5])
+    expect(snapBuildingLocalToWorldGrid([1.26, 3.74], 0)).toEqual([1.26, 3.74])
+  })
+
+  test('an unturned building at the origin keeps the world grid, which is its lattice', () => {
+    const building = BuildingNode.parse({})
+    useScene.setState({ nodes: { [building.id]: building } } as never)
+    useViewer.setState({
+      selection: { buildingId: building.id, levelId: null, zoneId: null, selectedIds: [] },
+    } as never)
+    expect(snapBuildingLocalToWorldGrid([1.26, 3.74], 0.5)).toEqual([1.5, 3.5])
+    expect(snapWorldXZForActiveBuilding(1.26, 3.74, 0.5)).toEqual({
+      world: [1.5, 3.5],
+      local: [1.5, 3.5],
+    })
+  })
+
+  test('a world cursor lands on the building lattice, in both frames', () => {
+    selectTurnedBuilding()
+    const { world, local } = snapWorldXZForActiveBuilding(15.2, -4.4, 0.5)
+    const raw = snapWorldXZToBuildingLocal(15.2, -4.4, POSITION, YAW, 0).local
+    expect(local).toEqual(snapBuildingLocalToWorldGrid(raw, 0.5))
+    const back = snapWorldXZToBuildingLocal(world[0], world[1], POSITION, YAW, 0).local
+    expect(back[0]).toBeCloseTo(local[0], 9)
+    expect(back[1]).toBeCloseTo(local[1], 9)
+  })
+})
+
+describe('resolveAlignmentForFloorplanView', () => {
+  test("aligns on a turned building's own axes and returns building-local guides", () => {
+    selectTurnedBuilding()
+    const result = resolveAlignmentForFloorplanView({
+      moving: [{ nodeId: 'moving', kind: 'corner', x: 2.05, z: 1 }],
+      candidates: [{ nodeId: 'wall', kind: 'corner', x: 2, z: 5 }],
+      threshold: 0.08,
+    })
+    expect(result.snap?.dx).toBeCloseTo(-0.05, 9)
+    expect(result.snap?.dz).toBeCloseTo(0, 9)
+    expect(result.guides).toHaveLength(1)
+    expect(result.guides[0]?.axis).toBe('x')
+    expect(result.guides[0]?.anchor).toEqual({ x: 2, z: 5 })
+  })
+})
+
+describe('resolveAlignmentForActiveBuilding', () => {
+  test("aligns on a turned building's own axes; guide ends come back in world coords", () => {
+    selectTurnedBuilding()
+    const result = resolveAlignmentForActiveBuilding({
+      moving: [{ nodeId: 'moving', kind: 'corner', x: 2.05, z: 1 }],
+      candidates: [{ nodeId: 'wall', kind: 'corner', x: 2, z: 5 }],
+      threshold: 0.08,
+    })
+    expect(result.snap?.dx).toBeCloseTo(-0.05, 9)
+    expect(result.snap?.dz).toBeCloseTo(0, 9)
+    const anchor = result.guides[0]?.anchor
+    const ends = [result.guides[0]?.from, result.guides[0]?.to]
+    // The candidate end sits at the anchor's world position.
+    const world = ends.find(
+      (end) =>
+        end &&
+        Math.abs(end.x - (POSITION[0] + 2 * Math.cos(YAW) + 5 * Math.sin(YAW))) < 1e-9 &&
+        Math.abs(end.z - (POSITION[2] - 2 * Math.sin(YAW) + 5 * Math.cos(YAW))) < 1e-9,
+    )
+    expect(anchor).toEqual({ x: 2, z: 5 })
+    expect(world).toBeDefined()
+  })
+})
+
+describe('getActiveGridPose (the frame the 3D grid is drawn in)', () => {
+  test("is the active building's pose while working in it", () => {
+    useEditor.setState({ phase: 'building' })
+    selectTurnedBuilding()
+    expect(getActiveGridPose()).toEqual({ position: POSITION, rotationY: YAW })
+  })
+
+  test('is the world grid for site work and while the building itself moves', () => {
+    const building = selectTurnedBuilding()
+    useEditor.setState({ phase: 'site' })
+    expect(getActiveGridPose()).toBeNull()
+
+    useEditor.setState({ phase: 'building' })
+    useInteractionScope.getState().begin({
+      kind: 'moving',
+      node: building,
+      nodeId: building.id,
+      nodeType: 'building',
+      view: '3d',
+    })
+    expect(getActiveGridPose()).toBeNull()
+  })
+
+  test('is the world grid with no building', () => {
+    useEditor.setState({ phase: 'building' })
+    useScene.setState({ nodes: {} } as never)
+    useViewer.setState({
+      selection: { buildingId: null, levelId: null, zoneId: null, selectedIds: [] },
+    } as never)
+    expect(getActiveGridPose()).toBeNull()
+  })
+})

package/src/lib/world-grid-snap.ts

@@ -1,12 +1,18 @@
 /**
- * World-grid snap for tools that consume `grid:move` / `grid:click`.
+ * Grid snap and alignment frames for tools that consume `grid:move` /
+ * `grid:click` inside a building.
  *
- * Tools historically snapped on `event.localPosition` (the cursor in the
- * active building's local frame). After the floor-plan grid was pulled
- * out of the rotated scene group, snapping has to follow the WORLD XZ
- * grid — otherwise a rotated building drags every placement off the
- * visible grid lines. This helper resolves the active building's pose
- * and projects the world snap back into local coords for storage.
+ * A building placed on a lot by the site planner is usually turned (yaw) and
+ * offset. Everything drawn or placed in it — walls, slabs, rooms, furniture,
+ * doors and windows — lives in the building's own frame, and so does the grid
+ * both views draw for it: the floor plan's grid sits inside the rotated scene
+ * group, and the 3D grid is laid on the building (`getActiveGridPose`). The
+ * snaps here follow that lattice, so a wall drawn square to the house stays
+ * square to it and lands on the lattice its neighbours were drawn on. A
+ * world-XZ lattice sits at the building's yaw to the house and off it by the
+ * building's offset, leaving drafted ends a fraction short of the walls they
+ * meet. For an unturned building at the origin the two coincide; outside any
+ * building the world grid is the lattice.
  */
 import {
   type AlignmentAnchor,
@@ -21,6 +27,8 @@ import {
   useScene,
 } from '@pascal-app/core'
 import { useViewer } from '@pascal-app/viewer'
+import useEditor from '../store/use-editor'
+import { getMovingNode } from '../store/use-interaction-scope'
 
 /**
  * Look up the active building's pose, or null when we're at the site root.
@@ -68,13 +76,26 @@ export function getActiveBuildingPose(): BuildingPose | null {
 }
 
 /**
- * Resolve Figma-style alignment for tools whose anchors are in the active
- * building's local frame, but where alignment must run on the WORLD axes
- * (the frame the user sees the grid in). Wraps `resolveAlignmentInBuildingWorld`
- * with the active building lookup so callers don't repeat the boilerplate.
+ * The frame of the lattice the 3D grid is drawn on: the active building's pose
+ * for everything drawn or placed in it, or null — the world XZ grid — for
+ * site work (the site phase, which terrain sculpting also runs in), while a
+ * building itself is being moved (it moves on the site), and with no building.
+ */
+export function getActiveGridPose(): BuildingPose | null {
+  if (useEditor.getState().phase === 'site') return null
+  if (getMovingNode()?.type === 'building') return null
+  return getActiveBuildingPose()
+}
+
+/**
+ * Resolve Figma-style alignment for 3D tools whose anchors are in the active
+ * building's local frame, on the building's own axes (the axes its grid is
+ * drawn on). Wraps `resolveAlignmentInBuildingWorld` with the active building
+ * lookup so callers don't repeat the boilerplate.
  *
  * Returns:
- *   - `guides` in WORLD coords (renderer must live in a world-space group),
+ *   - `guides` with `from` / `to` in WORLD coords (callers bring them back
+ *     with `projectAlignmentGuidesWorldToActiveBuildingLocal`),
  *   - `snap`   in BUILDING-LOCAL coords (ready to add to a local position).
  */
 export function resolveAlignmentForActiveBuilding(args: {
@@ -82,7 +103,24 @@ export function resolveAlignmentForActiveBuilding(args: {
   candidates: readonly AlignmentAnchor[]
   threshold: number
 }): ResolveAlignmentInBuildingResult {
-  return resolveAlignmentInBuildingWorld({ ...args, pose: getActiveBuildingPose() })
+  // Pose `null` resolves in the anchors' own (building-local) frame.
+  const result = resolveAlignmentInBuildingWorld({ ...args, pose: null })
+  const pose = getActiveBuildingPose()
+  if (!pose) return result
+  return {
+    snap: result.snap,
+    guides: result.guides.map((guide) => {
+      const [fromX, fromZ] = poseLocalXZToWorld(guide.from.x, guide.from.z, pose)
+      const [toX, toZ] = poseLocalXZToWorld(guide.to.x, guide.to.z, pose)
+      return { ...guide, from: { x: fromX, z: fromZ }, to: { x: toX, z: toZ } }
+    }),
+  }
+}
+
+function poseLocalXZToWorld(x: number, z: number, pose: BuildingPose): [number, number] {
+  const cos = Math.cos(pose.rotationY)
+  const sin = Math.sin(pose.rotationY)
+  return [pose.position[0] + x * cos + z * sin, pose.position[2] - x * sin + z * cos]
 }
 
 function worldXZToPoseLocal(x: number, z: number, pose: BuildingPose | null): [number, number] {
@@ -97,9 +135,10 @@ function worldXZToPoseLocal(x: number, z: number, pose: BuildingPose | null): [n
 /**
  * Project WORLD-frame alignment guides into the active building's LOCAL frame.
  *
- * The 3D alignment layer is still mounted inside the building-local tool group,
- * so tools that resolve alignment on the world axes (item placement, slab move)
- * need their guides converted before publishing to `useAlignmentGuides`.
+ * The 3D alignment layer is mounted inside the building-local tool group, so
+ * tools that resolve through `resolveAlignmentForActiveBuilding` (item
+ * placement, slab move) convert its guides before publishing to
+ * `useAlignmentGuides`.
  */
 export function projectAlignmentGuidesWorldToActiveBuildingLocal(
   guides: readonly AlignmentGuide[],
@@ -117,119 +156,77 @@ export function projectAlignmentGuidesWorldToActiveBuildingLocal(
 }
 
 /**
- * Baseline rotation the floor-plan view applies on top of the building
- * rotation. Mirrors `FLOORPLAN_VIEW_ROTATION_DEG = 0` in lib/floorplan/geometry.ts —
- * the scene group reads it via `floorplanSceneRotationDeg = FVR - buildingRot`.
- */
-const FLOORPLAN_VIEW_ROTATION_RAD = 0
-
-function rotateAnchorsBy(
-  anchors: readonly AlignmentAnchor[],
-  cos: number,
-  sin: number,
-): AlignmentAnchor[] {
-  return anchors.map((a) => ({
-    nodeId: a.nodeId,
-    kind: a.kind,
-    x: a.x * cos - a.z * sin,
-    z: a.x * sin + a.z * cos,
-  }))
-}
-
-/**
- * Resolve alignment in the 2D floor-plan view frame — the frame the user
- * sees the (always axis-aligned) grid lines in, regardless of how the
- * building has been rotated. Use this from EVERY 2D floor-plan path so
- * alignment guides stay parallel to the visible grid.
+ * Resolve alignment for the 2D floor plan, on the active building's own axes.
+ * Use this from EVERY 2D floor-plan path so alignment guides stay parallel to
+ * the plan's grid.
  *
- * Why it differs from `resolveAlignmentForActiveBuilding`: the 3D viewport
- * shows the world XZ grid, so world-frame alignment matches the visible
- * grid there. The 2D floor plan, however, rotates the scene `<g>` by
- * `floorplanSceneRotationDeg = FVR − buildingRot` and renders the grid
- * OUTSIDE that rotated group — so the visible axes are
- * `R(FVR − buildingRot) · local`. World-frame alignment would land on
- * world axes, which appear diagonal in this view; view-frame alignment
- * lands on the SVG axes the user actually reads.
+ * The floor plan rotates its scene `<g>` by the building's yaw (and the user's
+ * view rotation) and draws both its grid and the alignment-guide layer inside
+ * that group, in building-local metres. So the axes the user reads are the
+ * building's local axes, and guides must come back in local coords: resolving
+ * on world axes would align a turned building's corners on a diagonal to its
+ * walls and draw each guide away from the anchors it matched.
  *
- * Returns guides in view-frame coords (correct input for the floor-plan
- * alignment-guide layer, which is mounted outside the rotated scene
- * group) and a snap delta projected back into building-local (so callers
- * can add it to a local position as-is).
+ * Returns guides and the snap delta in building-local coords (add the delta
+ * to a local position as-is).
  */
 export function resolveAlignmentForFloorplanView(args: {
   moving: readonly AlignmentAnchor[]
   candidates: readonly AlignmentAnchor[]
   threshold: number
 }): ResolveAlignmentInBuildingResult {
-  const pose = getActiveBuildingPose()
-  const buildingRotY = pose?.rotationY ?? 0
-  const rot = FLOORPLAN_VIEW_ROTATION_RAD - buildingRotY
-  const cos = Math.cos(rot)
-  const sin = Math.sin(rot)
-  const result = resolveAlignmentInBuildingWorld({
-    moving: rotateAnchorsBy(args.moving, cos, sin),
-    candidates: rotateAnchorsBy(args.candidates, cos, sin),
-    threshold: args.threshold,
-    // Pose `null` keeps `resolveAlignmentInBuildingWorld` in its no-op
-    // path: it just runs `resolveAlignment` on the already-rotated
-    // anchors and returns the snap delta in the same view frame.
-    pose: null,
-  })
-  if (!result.snap) return result
-  // View-frame delta → local-frame delta (transpose of R(rot)).
-  const { dx, dz } = result.snap
-  return {
-    guides: result.guides,
-    snap: { dx: dx * cos + dz * sin, dz: -dx * sin + dz * cos },
-  }
+  // Pose `null` resolves in the anchors' own (building-local) frame.
+  return resolveAlignmentInBuildingWorld({ ...args, pose: null })
 }
 
 /**
- * Snap a world XZ position to the grid, then express it in the active
- * building's local frame. When no building is active, world == local.
+ * Snap a world XZ position onto the active building's grid lattice (see
+ * `snapBuildingLocalToWorldGrid`) and return the snapped point in both
+ * frames. With no active building, world == local and the world grid is the
+ * lattice.
  */
 export function snapWorldXZForActiveBuilding(
   worldX: number,
   worldZ: number,
   step: number,
 ): { world: [number, number]; local: [number, number] } {
-  const buildingId = useViewer.getState().selection.buildingId
-  const building = buildingId ? useScene.getState().nodes[buildingId] : null
-  if (building?.type !== 'building') {
-    if (step <= 0) return { world: [worldX, worldZ], local: [worldX, worldZ] }
-    const sx = Math.round(worldX / step) * step
-    const sz = Math.round(worldZ / step) * step
-    return { world: [sx, sz], local: [sx, sz] }
+  const pose = getActiveBuildingPose()
+  if (!pose) {
+    const [x, z] = snapBuildingLocalToWorldGrid([worldX, worldZ], step)
+    return { world: [x, z], local: [x, z] }
   }
-  return snapWorldXZToBuildingLocal(
-    worldX,
-    worldZ,
-    building.position,
-    building.rotation[1] ?? 0,
-    step,
-  )
+  const { local } = snapWorldXZToBuildingLocal(worldX, worldZ, pose.position, pose.rotationY, 0)
+  const [x, z] = snapBuildingLocalToWorldGrid(local, step)
+  return { world: poseLocalXZToWorld(x, z, pose), local: [x, z] }
 }
 
 /**
- * Snap a building-local plan point so the resulting position sits on the
- * world XZ grid. The returned point is still in building-local coords —
- * useful as a `gridSnap` callback for snapWallDraftPoint / snapFenceDraftPoint
- * etc., which operate entirely in the local frame.
+ * Snap a plan point in the 3D tools' frame (a grid event's `localPosition`)
+ * onto the lattice the grid is drawn on, one axis at a time with the caller's
+ * per-axis snap (an item snaps its edges by its own size). Inside a building
+ * the point is building-local and the lattice runs along the building's axes;
+ * outside any building it is the world point and the world grid is the
+ * lattice — so no pose is needed either way.
+ */
+export function snapPlanPointToActiveGrid(
+  point: readonly [number, number],
+  snap: (value: number, axis: 0 | 1) => number,
+): [number, number] {
+  return [snap(point[0], 0), snap(point[1], 1)]
+}
+
+/**
+ * Snap a building-local plan point onto the building's own grid lattice:
+ * multiples of `step` along its local axes from its origin, the lattice both
+ * views draw and the wall tool drafts on. Coordinates in and out are
+ * building-local, so it suits a `gridSnap` callback for snapWallDraftPoint /
+ * snapFenceDraftPoint etc. (The name predates the building frame: it used to
+ * snap onto the world XZ grid, at a turned building's yaw to the house.)
  */
 export function snapBuildingLocalToWorldGrid(
   local: readonly [number, number],
   step: number,
 ): [number, number] {
-  const buildingId = useViewer.getState().selection.buildingId
-  const building = buildingId ? useScene.getState().nodes[buildingId] : null
-  if (building?.type !== 'building') {
-    if (step <= 0) return [local[0], local[1]]
-    return [Math.round(local[0] / step) * step, Math.round(local[1] / step) * step]
-  }
-  const rotY = building.rotation[1] ?? 0
-  const cos = Math.cos(rotY)
-  const sin = Math.sin(rotY)
-  const worldX = building.position[0] + local[0] * cos + local[1] * sin
-  const worldZ = building.position[2] - local[0] * sin + local[1] * cos
-  return snapWorldXZToBuildingLocal(worldX, worldZ, building.position, rotY, step).local
+  if (step <= 0) return [local[0], local[1]]
+  return snapPlanPointToActiveGrid(local, (value) => Math.round(value / step) * step)
 }

package/src/store/use-alignment-guides.ts

@@ -6,16 +6,42 @@
 import type { AlignmentGuide } from '@pascal-app/core'
 import { create } from 'zustand'
 
+/**
+ * A wall draft's dashed projection guide, in building-local plan coordinates:
+ * the extension of the wall the draft comes from, a line through another wall's
+ * end on one of the house's axes, or the same through the run's start.
+ */
+export type DraftGuideLine = {
+  kind: 'extension' | 'alignment' | 'run-start'
+  from: [number, number]
+  to: [number, number]
+}
+
+/**
+ * The projection guides of a wall pulled from a selected wall's end (and of
+ * the run it continues): dashed lines, and markers where two of them cross.
+ */
+export type DraftGuides = {
+  lines: DraftGuideLine[]
+  intersections: Array<[number, number]>
+}
+
 type AlignmentGuidesState = {
   guides: AlignmentGuide[]
+  /** A wall draft's projection guides, drawn by the same layers; null when none. */
+  draft: DraftGuides | null
   set(guides: AlignmentGuide[]): void
+  /** Publish a wall draft's projection guides, which take the place of alignment guides. */
+  setDraft(draft: DraftGuides | null): void
   clear(): void
 }
 
 const useAlignmentGuides = create<AlignmentGuidesState>((set) => ({
   guides: [],
+  draft: null,
   set: (guides) => set({ guides }),
-  clear: () => set({ guides: [] }),
+  setDraft: (draft) => set({ guides: [], draft }),
+  clear: () => set({ guides: [], draft: null }),
 }))
 
 export default useAlignmentGuides

package/src/store/use-editor.tsx

@@ -528,6 +528,24 @@ type EditorState = {
   setReferenceFloorOffset: (offset: number) => void
   referenceFloorOpacity: number
   setReferenceFloorOpacity: (opacity: number) => void
+  // The 2D plan's dashed outlines of the walls on the level below / above
+  // the active one. "Below" is set apart for the roof plan, where it traces
+  // the top storey's walls the roof is checked against and starts on, and the
+  // floor plans, where it starts off (`useWallsBelowSetting`). Persisted.
+  showWallsBelow: boolean
+  setShowWallsBelow: (show: boolean) => void
+  showRoofWallsBelow: boolean
+  setShowRoofWallsBelow: (show: boolean) => void
+  showWallsAbove: boolean
+  setShowWallsAbove: (show: boolean) => void
+  // Ceilings drawn solid from above as well as from below. Set apart like
+  // "Walls below": on for the roof level, where the roof is checked over closed
+  // rooms, off for the floor plans, where the camera looks into the rooms
+  // (`useCeilingsSetting`). Persisted.
+  showCeilings: boolean
+  setShowCeilings: (show: boolean) => void
+  showRoofCeilings: boolean
+  setShowRoofCeilings: (show: boolean) => void
   // Development-only camera debug flag for inspecting underside geometry
   allowUndergroundCamera: boolean
   setAllowUndergroundCamera: (enabled: boolean) => void
@@ -605,6 +623,11 @@ type PersistedEditorLayoutState = Pick<
   | 'showReferenceFloor'
   | 'referenceFloorOffset'
   | 'referenceFloorOpacity'
+  | 'showWallsBelow'
+  | 'showRoofWallsBelow'
+  | 'showWallsAbove'
+  | 'showCeilings'
+  | 'showRoofCeilings'
 >
 type PersistedEditorState = PersistedEditorUiState & PersistedEditorLayoutState
 
@@ -640,6 +663,11 @@ export const DEFAULT_PERSISTED_EDITOR_LAYOUT_STATE: PersistedEditorLayoutState =
   showReferenceFloor: false,
   referenceFloorOffset: 1,
   referenceFloorOpacity: 0.35,
+  showWallsBelow: false,
+  showRoofWallsBelow: true,
+  showWallsAbove: false,
+  showCeilings: false,
+  showRoofCeilings: true,
 }
 
 const GRID_SNAP_STEPS: GridSnapStep[] = [0.5, 0.25, 0.1, 0.05]
@@ -899,6 +927,11 @@ export function normalizePersistedEditorLayoutState(
       Number.isFinite(state.referenceFloorOpacity)
         ? Math.min(0.8, Math.max(0.1, state.referenceFloorOpacity))
         : DEFAULT_PERSISTED_EDITOR_LAYOUT_STATE.referenceFloorOpacity,
+    showWallsBelow: state?.showWallsBelow === true,
+    showRoofWallsBelow: state?.showRoofWallsBelow !== false,
+    showWallsAbove: state?.showWallsAbove === true,
+    showCeilings: state?.showCeilings === true,
+    showRoofCeilings: state?.showRoofCeilings !== false,
   }
 }
 
@@ -1568,6 +1601,16 @@ const useEditor = create<EditorState>()(
       referenceFloorOpacity: DEFAULT_PERSISTED_EDITOR_LAYOUT_STATE.referenceFloorOpacity,
       setReferenceFloorOpacity: (opacity) =>
         set({ referenceFloorOpacity: Math.min(0.8, Math.max(0.1, opacity)) }),
+      showWallsBelow: DEFAULT_PERSISTED_EDITOR_LAYOUT_STATE.showWallsBelow,
+      setShowWallsBelow: (show) => set({ showWallsBelow: show }),
+      showRoofWallsBelow: DEFAULT_PERSISTED_EDITOR_LAYOUT_STATE.showRoofWallsBelow,
+      setShowRoofWallsBelow: (show) => set({ showRoofWallsBelow: show }),
+      showWallsAbove: DEFAULT_PERSISTED_EDITOR_LAYOUT_STATE.showWallsAbove,
+      setShowWallsAbove: (show) => set({ showWallsAbove: show }),
+      showCeilings: DEFAULT_PERSISTED_EDITOR_LAYOUT_STATE.showCeilings,
+      setShowCeilings: (show) => set({ showCeilings: show }),
+      showRoofCeilings: DEFAULT_PERSISTED_EDITOR_LAYOUT_STATE.showRoofCeilings,
+      setShowRoofCeilings: (show) => set({ showRoofCeilings: show }),
       allowUndergroundCamera: false,
       setAllowUndergroundCamera: (enabled) => set({ allowUndergroundCamera: enabled }),
       show2dVoronoi: false,
@@ -1672,6 +1715,11 @@ const useEditor = create<EditorState>()(
         showReferenceFloor: state.showReferenceFloor,
         referenceFloorOffset: state.referenceFloorOffset,
         referenceFloorOpacity: state.referenceFloorOpacity,
+        showWallsBelow: state.showWallsBelow,
+        showRoofWallsBelow: state.showRoofWallsBelow,
+        showWallsAbove: state.showWallsAbove,
+        showCeilings: state.showCeilings,
+        showRoofCeilings: state.showRoofCeilings,
       }),
       skipHydration: true,
     },

package/src/store/use-floorplan-annotation-visibility.test.ts

@@ -0,0 +1,64 @@
+import { afterEach, describe, expect, test } from 'bun:test'
+
+const STORAGE_KEY = 'pascal-floorplan-annotation-visibility'
+const savedWindow = Object.getOwnPropertyDescriptor(globalThis, 'window')
+afterEach(() => {
+  if (savedWindow) Object.defineProperty(globalThis, 'window', savedWindow)
+  else Reflect.deleteProperty(globalThis, 'window')
+})
+
+/** A browser's localStorage, seeded with what an earlier session saved. */
+function stubStorage(state?: Record<string, unknown>) {
+  const values = new Map<string, string>(
+    state ? [[STORAGE_KEY, JSON.stringify({ state, version: 0 })]] : [],
+  )
+  const localStorage: Partial<Storage> = {
+    getItem: (key) => values.get(key) ?? null,
+    setItem: (key, value) => void values.set(key, value),
+    removeItem: (key) => void values.delete(key),
+  }
+  Object.defineProperty(globalThis, 'window', { configurable: true, value: { localStorage } })
+  return { read: () => JSON.parse(values.get(STORAGE_KEY) ?? 'null')?.state }
+}
+
+let fresh = 0
+async function loadStore() {
+  const { default: store } = await import(
+    `./use-floorplan-annotation-visibility.ts?load=${++fresh}`
+  )
+  return store as typeof import('./use-floorplan-annotation-visibility').default
+}
+
+describe('Display dimension preferences', () => {
+  test('a first visit shows dimensions and measures walls to both faces', async () => {
+    stubStorage()
+    const store = await loadStore()
+    await store.persist.rehydrate()
+
+    expect(store.getState().showDimensions).toBe(true)
+    expect(store.getState().wallDimensionFaces).toBe('both')
+  })
+
+  test('a stale saved choice, from the retired Wall dimensions option, opens on Both', async () => {
+    stubStorage({ wallDimensionReference: 'stud-faces', wallDimensionFaces: 'centerline' })
+    const store = await loadStore()
+    await store.persist.rehydrate()
+
+    expect(store.getState().wallDimensionFaces).toBe('both')
+    expect(store.getState()).not.toHaveProperty('wallDimensionReference')
+  })
+
+  test('Dimensions and Measure walls come back after a reload', async () => {
+    const storage = stubStorage()
+    const firstSession = await loadStore()
+    await firstSession.persist.rehydrate()
+    firstSession.getState().setShowDimensions(false)
+    firstSession.getState().setWallDimensionFaces('interior')
+    expect(storage.read()).toMatchObject({ showDimensions: false, wallDimensionFaces: 'interior' })
+
+    const nextSession = await loadStore()
+    await nextSession.persist.rehydrate()
+    expect(nextSession.getState().showDimensions).toBe(false)
+    expect(nextSession.getState().wallDimensionFaces).toBe('interior')
+  })
+})