@pascal-app/editor 1.0.1 → 1.0.4

package/src/components/editor/group-rotate-handle.tsx

@@ -13,11 +13,13 @@ import {
 import { useViewer } from '@pascal-app/viewer'
 import { createPortal, type ThreeEvent, useThree } from '@react-three/fiber'
 import { useEffect, useMemo, useRef, useState } from 'react'
-import { OrthographicCamera, Plane, Vector2, Vector3 } from 'three'
+import { OrthographicCamera, Plane, type Ray, Vector2, Vector3 } from 'three'
 import { GROUP_MOVE_DRAG_LABEL, GROUP_ROTATE_DRAG_LABEL } from '../../lib/contextual-help'
 import { isHistoryShortcut } from '../../lib/history'
 import { sfxEmitter } from '../../lib/sfx-bus'
-import useEditor from '../../store/use-editor'
+import { intersectSpatialDragPlane } from '../../lib/spatial-drag-plane'
+import { getSpatialPointerId, spatialPointerInput } from '../../lib/spatial-pointer-input'
+import useEditor, { isAngleSnapActive } from '../../store/use-editor'
 import useInteractionScope, {
   useActiveHandleDrag,
   useMovingNode,
@@ -28,7 +30,7 @@ import {
   classifyParticipant,
   collectParticipants,
   computeGroupBox,
-  expandToComponent,
+  computeGroupPlanBox,
   levelFrame,
   rotateGroupPatches,
   type Vec3,
@@ -79,14 +81,6 @@ export function GroupRotateHandle() {
     [selectedIds, levelId, nodes],
   )
 
-  // Gate on the explicit selection (so a single connected wall still gets the
-  // per-node handles), but transform the full connected wall/fence component so
-  // attached structure rotates rigidly as one piece.
-  const fullIds = useMemo(
-    () => expandToComponent(participantIds, nodes, levelId),
-    [participantIds, levelId, nodes],
-  )
-
   const shouldRender =
     participantIds.length >= 2 &&
     mode !== 'delete' &&
@@ -98,7 +92,13 @@ export function GroupRotateHandle() {
 
   if (!shouldRender) return null
   // Remount when the moving set changes so the rest pivot re-seeds cleanly.
-  return <GroupRotateHandleInner ids={fullIds} key={fullIds.join(',')} meshEpoch={meshEpoch} />
+  return (
+    <GroupRotateHandleInner
+      ids={participantIds}
+      key={participantIds.join(',')}
+      meshEpoch={meshEpoch}
+    />
+  )
 }
 
 function GroupRotateHandleInner({ ids, meshEpoch }: { ids: string[]; meshEpoch: number }) {
@@ -125,22 +125,28 @@ function GroupRotateHandleInner({ ids, meshEpoch }: { ids: string[]; meshEpoch:
   const baseScale = zoom * ARROW_SCALE * 1.05
   const scale = (isHovered ? 1.12 : 1) * baseScale
 
-  // World-space bounding box of the selected meshes. Levels are axis-aligned in
-  // XZ, so world XZ coincides with each node's level-local placement — letting
-  // us rotate `position` / `start` / `end` directly against the pivot without
-  // per-node frame conversion.
-  //   - `pivot`  = bbox center (XZ), Y at the group's base → the rotation origin
-  //   - `corner` = front-right bbox corner at mid-height → where the gizmo sits
+  // Both rest points come from the level-frame box (the dashed boxes' box, also
+  // keyboard R/T's pivot), carried to world so they stay on it under a rotated
+  // building; the world mesh box only supplies heights.
+  //   - `pivot`  = box center, Y at the group's base → the rotation origin
+  //   - `corner` = far box corner at mid-height → where the gizmo sits
   const rest = useMemo(() => {
     void meshEpoch
     const box = computeGroupBox(ids)
     if (!box) return null
-    const pivot = new Vector3((box.min.x + box.max.x) / 2, box.min.y, (box.min.z + box.max.z) / 2)
-    const corner = new Vector3(
-      box.max.x + CORNER_OFFSET,
-      (box.min.y + box.max.y) / 2,
-      box.max.z + CORNER_OFFSET,
-    )
+    const levelId = useViewer.getState().selection.levelId
+    const { matrix } = levelFrame(levelId)
+    const plan = computeGroupPlanBox(ids, levelId)
+    const pivot = plan
+      ? new Vector3((plan.minX + plan.maxX) / 2, 0, (plan.minZ + plan.maxZ) / 2).applyMatrix4(
+          matrix,
+        )
+      : new Vector3((box.min.x + box.max.x) / 2, 0, (box.min.z + box.max.z) / 2)
+    pivot.y = box.min.y
+    const corner = plan
+      ? new Vector3(plan.maxX + CORNER_OFFSET, 0, plan.maxZ + CORNER_OFFSET).applyMatrix4(matrix)
+      : new Vector3(box.max.x + CORNER_OFFSET, 0, box.max.z + CORNER_OFFSET)
+    corner.y = (box.min.y + box.max.y) / 2
     return { pivot, corner }
   }, [ids, meshEpoch])
 
@@ -163,6 +169,12 @@ function GroupRotateHandleInner({ ids, meshEpoch }: { ids: string[]; meshEpoch:
     if (event.button !== 0) return
     event.stopPropagation()
     suppressBoxSelectForPointer(event)
+    const spatialPointerId = getSpatialPointerId(event.nativeEvent)
+    const spatialRay = spatialPointerId ? event.ray.clone() : null
+    const pointerTarget = event.object as typeof event.object & {
+      releasePointerCapture?: (pointerId: number) => void
+      setPointerCapture?: (pointerId: number) => void
+    }
 
     frozenRest.current = { pivot: rest.pivot.clone(), corner: rest.corner.clone() }
     const center = rest.pivot.clone()
@@ -213,11 +225,15 @@ function GroupRotateHandleInner({ ids, meshEpoch }: { ids: string[]; meshEpoch:
       )
     }
 
-    setNDC(event.nativeEvent.clientX, event.nativeEvent.clientY)
-    raycaster.setFromCamera(ndc, camera)
+    if (!spatialRay) {
+      setNDC(event.nativeEvent.clientX, event.nativeEvent.clientY)
+      raycaster.setFromCamera(ndc, camera)
+    }
     const hit = new Vector3()
-    if (!raycaster.ray.intersectPlane(plane, hit)) return
+    if (!intersectSpatialDragPlane(spatialRay ?? raycaster.ray, plane, hit)) return
     const initialAngle = angleOf(hit)
+    if (spatialPointerId) pointerTarget.setPointerCapture?.(event.pointerId)
+    let altKey = event.nativeEvent.altKey
 
     document.body.style.cursor = 'grabbing'
     sfxEmitter.emit('sfx:item-pick')
@@ -230,15 +246,14 @@ function GroupRotateHandleInner({ ids, meshEpoch }: { ids: string[]; meshEpoch:
     })
     setIsDragging(true)
 
-    const onMove = (e: PointerEvent) => {
-      setNDC(e.clientX, e.clientY)
-      raycaster.setFromCamera(ndc, camera)
+    const applyRay = (ray: Ray, freeRotation = false) => {
       const moveHit = new Vector3()
-      if (!raycaster.ray.intersectPlane(plane, moveHit)) return
+      if (!intersectSpatialDragPlane(ray, plane, moveHit)) return
       let delta = angleOf(moveHit) - initialAngle
       while (delta > Math.PI) delta -= 2 * Math.PI
       while (delta < -Math.PI) delta += 2 * Math.PI
-      if (!e.shiftKey) delta = Math.round(delta / DEFAULT_ANGLE_STEP) * DEFAULT_ANGLE_STEP
+      if (!freeRotation && isAngleSnapActive())
+        delta = Math.round(delta / DEFAULT_ANGLE_STEP) * DEFAULT_ANGLE_STEP
 
       // Shared rigid-rotation math (also used by the keyboard group R/T);
       // see `rotateGroupPatches` for the orbit/yaw handedness contract.
@@ -286,8 +301,14 @@ function GroupRotateHandleInner({ ids, meshEpoch }: { ids: string[]; meshEpoch:
         })
       }
     }
+    const onMove = (e: PointerEvent) => {
+      setNDC(e.clientX, e.clientY)
+      raycaster.setFromCamera(ndc, camera)
+      applyRay(raycaster.ray, e.altKey)
+    }
 
     const affectedIds: AnyNodeId[] = [...starts.map((s) => s.id), ...links.map((l) => l.id)]
+    let releaseSpatialCapture: (() => void) | null = null
     const clearLivePreviews = () => {
       const overrides = useLiveNodeOverrides.getState()
       const liveTransforms = useLiveTransforms.getState()
@@ -303,6 +324,10 @@ function GroupRotateHandleInner({ ids, meshEpoch }: { ids: string[]; meshEpoch:
       window.removeEventListener('pointerup', onUp)
       window.removeEventListener('pointercancel', onCancel)
       window.removeEventListener('keydown', onKeyDown, true)
+      window.removeEventListener('keyup', onKeyUp, true)
+      releaseSpatialCapture?.()
+      releaseSpatialCapture = null
+      if (spatialPointerId) pointerTarget.releasePointerCapture?.(event.pointerId)
       if (document.body.style.cursor === 'grabbing') document.body.style.cursor = ''
       useScene.temporal.getState().resume()
       useViewer.getState().setInputDragging(false)
@@ -352,12 +377,19 @@ function GroupRotateHandleInner({ ids, meshEpoch }: { ids: string[]; meshEpoch:
     // Escape / ⌘Z abort the rotate — capture phase so they win over the global
     // use-keyboard arms (⌘Z must never history-jump under a live pointer).
     const onKeyDown = (e: KeyboardEvent) => {
+      if (e.key === 'Alt') {
+        altKey = true
+        return
+      }
       if (e.key !== 'Escape' && !isHistoryShortcut(e)) return
       e.preventDefault()
       e.stopPropagation()
       swallowNextClick()
       onCancel()
     }
+    const onKeyUp = (e: KeyboardEvent) => {
+      if (e.key === 'Alt') altKey = false
+    }
 
     dragCleanupRef.current = () => {
       clearLivePreviews()
@@ -366,10 +398,22 @@ function GroupRotateHandleInner({ ids, meshEpoch }: { ids: string[]; meshEpoch:
     for (const id of affectedIds) {
       useLiveTransforms.getState().clear(id)
     }
-    window.addEventListener('pointermove', onMove)
-    window.addEventListener('pointerup', onUp)
-    window.addEventListener('pointercancel', onCancel)
+    if (spatialPointerId && spatialRay) {
+      releaseSpatialCapture = spatialPointerInput.capture(spatialPointerId, {
+        onMove: (ray) => {
+          spatialRay.copy(ray)
+          applyRay(spatialRay, altKey)
+        },
+        onRelease: onUp,
+        onCancel,
+      })
+    } else {
+      window.addEventListener('pointermove', onMove)
+      window.addEventListener('pointerup', onUp)
+      window.addEventListener('pointercancel', onCancel)
+    }
     window.addEventListener('keydown', onKeyDown, true)
+    window.addEventListener('keyup', onKeyUp, true)
   }
 
   return createPortal(
@@ -398,6 +442,7 @@ function GroupRotateHandleInner({ ids, meshEpoch }: { ids: string[]; meshEpoch:
           onPointerDown={activate}
           onPointerEnter={onHoverEnter}
           onPointerLeave={onHoverLeave}
+          {...({ pointerEventsOrder: 10 } as Record<string, unknown>)}
           scale={baseScale}
         />
         <mesh
@@ -407,6 +452,7 @@ function GroupRotateHandleInner({ ids, meshEpoch }: { ids: string[]; meshEpoch:
           onPointerDown={activate}
           onPointerEnter={onHoverEnter}
           onPointerLeave={onHoverLeave}
+          {...({ pointerEventsOrder: 10 } as Record<string, unknown>)}
           renderOrder={1010}
           scale={scale}
         />

package/src/components/editor/group-selection-box-3d.tsx

@@ -12,7 +12,7 @@ import { armGroupMove3d } from './group-move-3d'
 import {
   classifyParticipant,
   computeGroupBox,
-  expandToComponent,
+  computeGroupPlanBox,
   levelFrame,
 } from './group-transform-shared'
 import { useMeshSettleEpoch } from './use-mesh-settle-epoch'
@@ -24,8 +24,8 @@ const BOX_PAD = 0.06
 
 /**
  * 3D sibling of the 2D dashed group selection box: a dashed wireframe around
- * the multi-selection's transformable participants (expanded to the welded
- * wall/fence component) that doubles as the group's whole-volume drag
+ * the multi-selection's transformable participants that doubles as the
+ * group's whole-volume drag
  * handle — move cursor across it, press-drag anywhere on it slides the group,
  * a plain click picks it up. Holding a selection modifier passes the press
  * through so members inside can still be toggled. Rides the live drag delta
@@ -55,22 +55,30 @@ export function GroupSelectionBox3D() {
   const box = useMemo(() => {
     void meshEpoch
     if (participantIds.length === 0) return null
-    const fullIds = expandToComponent(participantIds, nodes, levelId)
-    const world = computeGroupBox(fullIds)
-    if (!world) return null
-    const size = new THREE.Vector3()
-    world.getSize(size)
-    const center = new THREE.Vector3()
-    world.getCenter(center)
+    // Aligned with the building like the 2D box: level-frame footprint, world
+    // height span, turned by the level's rotation.
+    const world = computeGroupBox(participantIds)
+    const { matrix } = levelFrame(levelId)
+    const plan = computeGroupPlanBox(participantIds, levelId)
+    if (!(world && plan)) return null
+    const center = new THREE.Vector3(
+      (plan.minX + plan.maxX) / 2,
+      0,
+      (plan.minZ + plan.maxZ) / 2,
+    ).applyMatrix4(matrix)
+    center.y = (world.min.y + world.max.y) / 2
+    const quaternion = new THREE.Quaternion()
+    matrix.decompose(new THREE.Vector3(), quaternion, new THREE.Vector3())
     return {
-      size: [size.x + 2 * BOX_PAD, size.y + 2 * BOX_PAD, size.z + 2 * BOX_PAD] as [
-        number,
-        number,
-        number,
-      ],
+      size: [
+        plan.maxX - plan.minX + 2 * BOX_PAD,
+        world.max.y - world.min.y + 2 * BOX_PAD,
+        plan.maxZ - plan.minZ + 2 * BOX_PAD,
+      ] as [number, number, number],
       center,
+      quaternion,
     }
-  }, [participantIds, nodes, levelId, meshEpoch])
+  }, [participantIds, levelId, meshEpoch])
 
   // Dashed wireframe. Built per box size (rare — selection / commit changes)
   // because LineDashedMaterial measures dashes along the line, so scaling a
@@ -156,7 +164,7 @@ export function GroupSelectionBox3D() {
   ]
 
   return (
-    <group position={position}>
+    <group position={position} quaternion={box.quaternion}>
       <primitive object={edges} />
       {/* Invisible whole-volume hit target — the box IS the drag handle. */}
       <mesh

package/src/components/editor/group-transform-shared.test.ts

@@ -1,9 +1,24 @@
 import { beforeAll, describe, expect, test } from 'bun:test'
-import { type AnyNode, type AnyNodeDefinition, nodeRegistry, registerNode } from '@pascal-app/core'
+import {
+  type AnyNode,
+  type AnyNodeDefinition,
+  type AnyNodeId,
+  CeilingNode,
+  LevelNode,
+  nodeRegistry,
+  registerNode,
+  SlabNode,
+  sceneRegistry,
+  useScene,
+  WallNode,
+} from '@pascal-app/core'
+import { BoxGeometry, Group, Mesh } from 'three'
 import { z } from 'zod'
 import {
   classifyParticipant,
   collectParticipants,
+  computeGroupPlanBox,
+  groupPlanBounds,
   planBoundsCenter,
   rotateGroupPatches,
   rotateGroupSnapshots,
@@ -472,3 +487,113 @@ describe('group transform participants', () => {
     ])
   })
 })
+
+describe('group plan bounds', () => {
+  const withNodes = (nodes: AnyNode[], run: () => void) => {
+    const saved = useScene.getState().nodes
+    useScene.setState({ nodes: Object.fromEntries(nodes.map((n) => [n.id, n])) as typeof saved })
+    try {
+      run()
+    } finally {
+      useScene.setState({ nodes: saved })
+    }
+  }
+
+  test('a placed object measures its built mesh in the level frame, or falls back to its anchor', () => {
+    const level = new Group()
+    level.position.set(10, 0, -4)
+    level.rotation.y = Math.PI / 5
+    const item = new Mesh(new BoxGeometry(1, 1, 1))
+    item.position.set(2, 0.5, 0)
+    level.add(item)
+    level.updateWorldMatrix(true, true)
+    const registry = sceneRegistry.nodes as unknown as Map<string, unknown>
+    registry.set('item_plan_bounds_test', item)
+    const start = {
+      id: 'item_plan_bounds_test' as AnyNodeId,
+      kind: 'vec3' as const,
+      position: [2, 0, 0] as [number, number, number],
+      rotation: [0, 0, 0] as [number, number, number],
+    }
+    try {
+      const frameInv = level.matrixWorld.clone().invert()
+      const built = groupPlanBounds([start], frameInv)
+      expect(built?.minX).toBeCloseTo(1.5)
+      expect(built?.maxX).toBeCloseTo(2.5)
+      expect(built?.minZ).toBeCloseTo(-0.5)
+      expect(built?.maxZ).toBeCloseTo(0.5)
+      // Unbuilt while the 3D scene is paused: the placeholder must not count.
+      item.geometry.userData.placeholder = true
+      expect(groupPlanBounds([start], frameInv)).toEqual({ minX: 2, minZ: 0, maxX: 2, maxZ: 0 })
+    } finally {
+      registry.delete('item_plan_bounds_test')
+    }
+  })
+
+  test('hugs the selected wall outlines; a connected wall stays outside', () => {
+    const level = LevelNode.parse({ children: [] })
+    const bottom = WallNode.parse({
+      parentId: level.id,
+      start: [0, 0],
+      end: [2.4, 0],
+      thickness: 0.2,
+    })
+    const side = WallNode.parse({
+      parentId: level.id,
+      start: [2.4, 0],
+      end: [2.4, 5.3],
+      thickness: 0.2,
+    })
+    const neighbour = WallNode.parse({
+      parentId: level.id,
+      start: [2.4, 5.3],
+      end: [8, 5.3],
+      thickness: 0.2,
+    })
+    withNodes([level, bottom, side, neighbour], () => {
+      const plan = computeGroupPlanBox([bottom.id, side.id], level.id)
+      expect(plan?.minX).toBeCloseTo(0)
+      expect(plan?.maxX).toBeCloseTo(2.5)
+      expect(plan?.minZ).toBeCloseTo(-0.1)
+      expect(plan?.maxZ).toBeLessThan(5.5)
+      expect(plan?.maxX).toBeLessThan(8)
+    })
+  })
+
+  test('two walls with the room floor and ceiling: the box is the drawn outlines, never the meshes', () => {
+    // A user's selection whose box came out 13 m wide in 2D-only view.
+    const level = LevelNode.parse({ id: 'level_vvkg048zziz9ktiy', children: [] })
+    const room: [number, number][] = [
+      [-3.6221682640435353, -9.037533979512114],
+      [-6.21504662384804, -8.29671159099654],
+      [-5.712152486161543, -6.5365821090938],
+      [-5.712152486161543, -5],
+      [-8.223564365687542, -5],
+      [-8.223564365687542, -6.5365821090938],
+      [-10.712152486161543, -6.5365821090938],
+      [-11.712152486161543, -8.5365821090938],
+      [-4.119274126357038, -10.777404497609373],
+    ]
+    const wall15 = WallNode.parse({
+      parentId: level.id,
+      start: [-10.712152486161543, -6.5365821090938],
+      end: [-11.712152486161543, -8.5365821090938],
+    })
+    const wall12 = WallNode.parse({
+      parentId: level.id,
+      start: [-11.712152486161543, -8.5365821090938],
+      end: [-6.712152486161543, -10.0365821090938],
+    })
+    const slab = SlabNode.parse({ parentId: level.id, polygon: room, elevation: 0.05 })
+    const ceiling = CeilingNode.parse({ parentId: level.id, polygon: room, height: 2.49 })
+    withNodes([level, wall15, wall12, slab, ceiling], () => {
+      const plan = computeGroupPlanBox([wall15.id, ceiling.id, slab.id, wall12.id], level.id)!
+      expect(plan.minX).toBeLessThan(-11.71)
+      expect(plan.minX).toBeGreaterThan(-11.95)
+      expect(plan.maxX).toBeCloseTo(-3.62, 1)
+      expect(plan.minZ).toBeCloseTo(-10.78, 1)
+      expect(plan.maxZ).toBeCloseTo(-5, 1)
+      expect(plan.maxX - plan.minX).toBeLessThan(8.4)
+    })
+  })
+})

package/src/components/editor/group-transform-shared.ts

@@ -1,11 +1,15 @@
 import {
   type AnyNode,
   type AnyNodeId,
+  calculateLevelMiters,
+  getWallPlanFootprint,
   nodeRegistry,
   resolveBuildingForLevel,
   sceneRegistry,
+  useScene,
+  type WallNode,
 } from '@pascal-app/core'
-import { Box3, Matrix4 } from 'three'
+import { Box3, type BufferGeometry, Matrix4, type Object3D, Vector3 } from 'three'
 
 // Shared plumbing for the group transform gizmos (rotate + move). Both operate
 // on the same multi-selection: classify each participant by how its placement
@@ -242,48 +246,6 @@ export function collectParticipants(
   return { starts, links }
 }
 
-// Grow a selection to the full connected component of walls/fences: any
-// endpoint node transitively reachable through shared junctions from a selected
-// endpoint node joins in, so the whole rigid structure transforms as one piece
-// (rather than tearing/stretching at the boundary). Non-endpoint selections
-// (items, columns) pass through unchanged.
-export function expandToComponent(
-  selectedIds: string[],
-  sceneNodes: Record<string, AnyNode | undefined>,
-  levelId: string | null,
-): string[] {
-  const endpoints: { id: string; start: Vec2; end: Vec2 }[] = []
-  for (const [id, node] of Object.entries(sceneNodes)) {
-    if (classifyParticipant(node, levelId, sceneNodes) === 'endpoint') {
-      const n = node as AnyNode & { start: Vec2; end: Vec2 }
-      endpoints.push({ id, start: [n.start[0], n.start[1]], end: [n.end[0], n.end[1]] })
-    }
-  }
-  const included = new Set(selectedIds)
-  if (!endpoints.some((e) => included.has(e.id))) return selectedIds
-
-  let changed = true
-  while (changed) {
-    changed = false
-    for (const e of endpoints) {
-      if (included.has(e.id)) continue
-      const touches = endpoints.some(
-        (o) =>
-          included.has(o.id) &&
-          (nearPoint(e.start, o.start) ||
-            nearPoint(e.start, o.end) ||
-            nearPoint(e.end, o.start) ||
-            nearPoint(e.end, o.end)),
-      )
-      if (touches) {
-        included.add(e.id)
-        changed = true
-      }
-    }
-  }
-  return Array.from(included)
-}
-
 // Per-node field patch, keyed for `useLiveNodeOverrides.setMany` during a live
 // preview and for the single batched `updateNodes` on commit.
 export type GroupPatch = readonly [AnyNodeId, Record<string, unknown>]
@@ -389,9 +351,24 @@ export function rotateGroupSnapshots(
 
 export type GroupPlanBounds = { minX: number; minZ: number; maxX: number; maxZ: number }
 
-// Level-frame XZ extents of the participant DATA — the mesh-free sibling of
-// `computeGroupBox`, used when meshes aren't mounted yet.
-function participantExtents(starts: ParticipantStart[]): GroupPlanBounds | null {
+const planCorner = new Vector3()
+const planMatrix = new Matrix4()
+
+/**
+ * The selection's footprint in the level frame — the plan's own coordinates,
+ * measured from node data wherever the plan draws from data: walls by their
+ * mitered outline, polygon hosts (slab, ceiling, zone) by their polygon, fences
+ * by their run. Only placed objects (items, columns, stairs…) measure their
+ * meshes: bounds go through `frameInv × matrixWorld` (a world box can't be
+ * carried into a rotated building's frame), placeholders — unbuilt while the
+ * 3D scene is paused in 2D-only view — are skipped, and a node with no built
+ * mesh falls back to its anchor.
+ */
+export function groupPlanBounds(
+  starts: ParticipantStart[],
+  frameInv: Matrix4,
+): GroupPlanBounds | null {
+  const nodes = useScene.getState().nodes
   let minX = Number.POSITIVE_INFINITY
   let minZ = Number.POSITIVE_INFINITY
   let maxX = Number.NEGATIVE_INFINITY
@@ -402,43 +379,72 @@ function participantExtents(starts: ParticipantStart[]): GroupPlanBounds | null
     maxX = Math.max(maxX, x)
     maxZ = Math.max(maxZ, z)
   }
+  const miters = new Map<string | null, ReturnType<typeof calculateLevelMiters>>()
+  const wallOutline = (wall: WallNode) => {
+    const levelId = wall.parentId ?? null
+    let levelMiters = miters.get(levelId)
+    if (!levelMiters) {
+      levelMiters = calculateLevelMiters(
+        Object.values(nodes).filter(
+          (node): node is WallNode => node?.type === 'wall' && (node.parentId ?? null) === levelId,
+        ),
+      )
+      miters.set(levelId, levelMiters)
+    }
+    return getWallPlanFootprint(wall, levelMiters)
+  }
+  const measureMeshes = (id: string) => {
+    const obj = sceneRegistry.nodes.get(id as AnyNodeId)
+    if (!obj) return false
+    obj.updateWorldMatrix(true, true)
+    let found = false
+    obj.traverse((child: Object3D) => {
+      const geometry = (child as Object3D & { geometry?: BufferGeometry }).geometry
+      if (!child.visible || !geometry || geometry.userData.placeholder) return
+      // Always fresh: geometries rebuilt in place keep a stale cached box.
+      geometry.computeBoundingBox()
+      const bounds = geometry.boundingBox
+      if (!bounds || bounds.isEmpty()) return
+      planMatrix.multiplyMatrices(frameInv, child.matrixWorld)
+      for (let corner = 0; corner < 8; corner++) {
+        planCorner
+          .set(
+            corner & 1 ? bounds.max.x : bounds.min.x,
+            corner & 2 ? bounds.max.y : bounds.min.y,
+            corner & 4 ? bounds.max.z : bounds.min.z,
+          )
+          .applyMatrix4(planMatrix)
+        reach(planCorner.x, planCorner.z)
+      }
+      found = true
+    })
+    return found
+  }
   for (const s of starts) {
+    const node = nodes[s.id]
     if (s.kind === 'endpoint') {
+      const outline = node?.type === 'wall' ? wallOutline(node) : []
+      if (outline.length > 0) {
+        for (const point of outline) reach(point.x, point.y)
+        continue
+      }
       reach(s.start[0], s.start[1])
       reach(s.end[0], s.end[1])
+      const path = (node as { path?: unknown } | undefined)?.path
+      if (isVec2Array(path)) for (const [x, z] of path) reach(x, z)
     } else if (s.kind === 'polygon') {
-      for (const [x, z] of s.polygon) {
-        reach(x, z)
-      }
-    } else {
+      for (const [x, z] of s.polygon) reach(x, z)
+    } else if (!measureMeshes(s.id)) {
       reach(s.position[0], s.position[2])
     }
   }
-  if (!Number.isFinite(minX)) return null
-  return { minX, minZ, maxX, maxZ }
+  return Number.isFinite(minX) ? { minX, minZ, maxX, maxZ } : null
 }
 
-// The one footprint every group transform measures itself against: the
-// selection's mounted meshes (world box, converted into the level frame) with
-// the participant DATA extents as the fallback when the meshes aren't up yet
-// (Duplicate picks up its clones a frame before their renderers mount). Anchor
-// points alone sit metres inside a wide selection's real footprint, so a
-// gesture that pivots on the data extents orbits a different point than the
-// idle keyboard rotate and the rotate gizmos, which both use the mesh box.
-export function groupPlanBounds(
-  box: Box3 | null,
-  starts: ParticipantStart[],
-  frameInv: Matrix4,
-): GroupPlanBounds | null {
-  if (!box) return participantExtents(starts)
-  const min = box.min.clone().applyMatrix4(frameInv)
-  const max = box.max.clone().applyMatrix4(frameInv)
-  return {
-    minX: Math.min(min.x, max.x),
-    minZ: Math.min(min.z, max.z),
-    maxX: Math.max(min.x, max.x),
-    maxZ: Math.max(min.z, max.z),
-  }
+/** `groupPlanBounds` for a selection: the dashed boxes and gizmos measure this. */
+export function computeGroupPlanBox(ids: string[], levelId: string | null): GroupPlanBounds | null {
+  const { starts } = collectParticipants(ids, useScene.getState().nodes, levelId)
+  return groupPlanBounds(starts, levelFrame(levelId).inverse)
 }
 
 export const planBoundsCenter = (b: GroupPlanBounds): Vec2 => [