@pascal-app/editor 1.0.3 → 1.0.5

package/src/components/editor/floor-region-webgpu-materials.test.ts

@@ -0,0 +1,12 @@
+import { expect, test } from 'bun:test'
+import { readFileSync } from 'node:fs'
+
+test('the floor region preview draws with WebGPU node materials, not drei fat lines', () => {
+  const source = readFileSync(new URL('./floor-region-controls.tsx', import.meta.url), 'utf8')
+  expect(source).not.toMatch(/@react-three\/drei/)
+  expect(source).not.toMatch(/<Line\b|<lineBasicMaterial\b|<meshBasicMaterial\b|\bLineMaterial\b/)
+  expect(source).toMatch(
+    /import\s*\{[^}]*\bLineBasicNodeMaterial\b[^}]*\bMeshBasicNodeMaterial\b[^}]*\}\s*from\s*['"]three\/webgpu['"]/,
+  )
+  expect(source).toContain('<lineSegments')
+})

package/src/components/editor/floor-surface.test.ts

@@ -0,0 +1,165 @@
+import { afterEach, expect, test } from 'bun:test'
+import { type AnyNode, sceneRegistry, useScene } from '@pascal-app/core'
+import * as THREE from 'three'
+import { FloorSurface } from './floor-surface'
+
+const GROUND = 'level_ground'
+const UPPER = 'level_upper'
+
+function node(id: string, type: string, parentId: string | null, extra: object = {}) {
+  return { id, type, parentId, visible: true, ...extra } as unknown as AnyNode
+}
+
+// A flat slab whose top is at `top`, spanning x/z from -5 to 5.
+function slabMesh(top: number, thickness = 0.2) {
+  const mesh = new THREE.Mesh(
+    new THREE.BoxGeometry(10, thickness, 10),
+    new THREE.MeshBasicMaterial({ side: THREE.DoubleSide }),
+  )
+  mesh.position.set(0, top - thickness / 2, 0)
+  return mesh
+}
+
+function register(id: string, type: string, object: THREE.Object3D) {
+  sceneRegistry.nodes.set(id, object)
+  sceneRegistry.byType[type]!.add(id)
+  object.updateMatrixWorld(true)
+}
+
+function scene(nodes: AnyNode[]) {
+  useScene.setState({ nodes: Object.fromEntries(nodes.map((n) => [n.id, n])) as never })
+}
+
+function topAt(surface: FloorSurface, x = 0, z = 0, levelY = 0) {
+  void surface.revision
+  return surface.topAt(x, z, levelY)
+}
+
+afterEach(() => sceneRegistry.clear())
+
+test('the highest floor of the active level under the camera counts, nothing else', () => {
+  scene([
+    node(GROUND, 'level', null, { level: 0 }),
+    node(UPPER, 'level', null, { level: 1 }),
+    node('slab_base', 'slab', GROUND),
+    node('slab_platform', 'slab', GROUND),
+    node('slab_upper', 'slab', UPPER),
+    node('wall_a', 'wall', GROUND),
+    node('ceiling_a', 'ceiling', GROUND),
+  ])
+  register('slab_base', 'slab', slabMesh(0.05))
+  register('slab_platform', 'slab', slabMesh(0.5))
+  register('slab_upper', 'slab', slabMesh(2.76))
+  register('wall_a', 'wall', slabMesh(2.5, 2.5))
+  register('ceiling_a', 'ceiling', slabMesh(2.5, 0.05))
+
+  const surface = new FloorSurface()
+  surface.levelId = GROUND
+  // The raised platform, not the base slab below it, nor the wall, ceiling or
+  // the level above.
+  expect(topAt(surface)).toBeCloseTo(0.5, 6)
+  // Off every slab: nothing under the camera.
+  expect(topAt(surface, 20, 20)).toBeNull()
+
+  surface.levelId = UPPER
+  expect(topAt(surface, 0, 0, 2.71)).toBeCloseTo(2.76, 6)
+})
+
+test('hidden slabs and items standing on a slab are not the floor', () => {
+  scene([
+    node(GROUND, 'level', null, { level: 0 }),
+    node('slab_base', 'slab', GROUND),
+    node('slab_hidden', 'slab', GROUND, { visible: false }),
+    node('item_table', 'item', 'slab_base'),
+  ])
+  const base = slabMesh(0.05)
+  register('slab_base', 'slab', base)
+  register('slab_hidden', 'slab', slabMesh(0.9))
+  const table = slabMesh(0.75 - 0.05, 0.05)
+  base.add(table)
+  register('item_table', 'item', table)
+
+  const surface = new FloorSurface()
+  surface.levelId = GROUND
+  expect(topAt(surface)).toBeCloseTo(0.05, 6)
+})
+
+test('on the ground level the site ground counts; on other levels it does not', () => {
+  scene([
+    node(GROUND, 'level', null, { level: 0 }),
+    node(UPPER, 'level', null, { level: 1 }),
+    node('site_a', 'site', null),
+  ])
+  const site = new THREE.Group()
+  site.add(slabMesh(-0.05, 0.01))
+  register('site_a', 'site', site)
+
+  const surface = new FloorSurface()
+  surface.levelId = GROUND
+  expect(topAt(surface, 3, 3)).toBeCloseTo(-0.05, 6)
+  surface.levelId = UPPER
+  expect(topAt(surface, 3, 3, 2.71)).toBeNull()
+})
+
+test('rebuilding a slab in place moves the revision so a cached answer is refreshed', () => {
+  scene([node(GROUND, 'level', null, { level: 0 }), node('slab_base', 'slab', GROUND)])
+  const slab = slabMesh(0.05)
+  register('slab_base', 'slab', slab)
+  const surface = new FloorSurface()
+  surface.levelId = GROUND
+  const before = surface.revision
+  slab.position.y += 0.4
+  slab.updateMatrixWorld(true)
+  expect(surface.revision).not.toBe(before)
+  expect(topAt(surface)).toBeCloseTo(0.45, 6)
+})
+
+test('a platform moved horizontally into a cached camera position refreshes the floor', () => {
+  scene([node(GROUND, 'level', null, { level: 0 }), node('slab_platform', 'slab', GROUND)])
+  const slab = slabMesh(1)
+  slab.position.x = 20
+  register('slab_platform', 'slab', slab)
+  const surface = new FloorSurface()
+  surface.levelId = GROUND
+  expect(topAt(surface)).toBeNull()
+  const before = surface.revision
+  slab.position.x = 0
+  slab.updateMatrixWorld(true)
+  expect(surface.revision).not.toBe(before)
+  expect(topAt(surface)).toBeCloseTo(1, 6)
+})
+
+test('resizing and hiding a mounted platform invalidate a cached floor height', () => {
+  scene([node(GROUND, 'level', null, { level: 0 }), node('slab_platform', 'slab', GROUND)])
+  const slab = slabMesh(1)
+  register('slab_platform', 'slab', slab)
+  const surface = new FloorSurface()
+  surface.levelId = GROUND
+  expect(topAt(surface)).toBeCloseTo(1, 6)
+  let before = surface.revision
+  slab.scale.y = 2
+  slab.updateMatrixWorld(true)
+  expect(surface.revision).not.toBe(before)
+  expect(topAt(surface)).toBeCloseTo(1.1, 6)
+  before = surface.revision
+  slab.visible = false
+  expect(surface.revision).not.toBe(before)
+  expect(topAt(surface)).toBeNull()
+})
+
+test('a floor mesh mounted or replaced after its site keeps the active surface current', () => {
+  scene([node(GROUND, 'level', null, { level: 0 }), node('site_a', 'site', null)])
+  const site = new THREE.Group()
+  register('site_a', 'site', site)
+  const surface = new FloorSurface()
+  surface.levelId = GROUND
+  expect(topAt(surface)).toBeNull()
+  const floor = slabMesh(0.05)
+  site.add(floor)
+  site.updateMatrixWorld(true)
+  expect(topAt(surface)).toBeCloseTo(0.05, 6)
+  site.remove(floor)
+  site.add(slabMesh(0.5))
+  site.updateMatrixWorld(true)
+  expect(topAt(surface)).toBeCloseTo(0.5, 6)
+})

package/src/components/editor/floor-surface.ts

@@ -0,0 +1,182 @@
+import { type AnyNode, type AnyNodeId, sceneRegistry, useScene } from '@pascal-app/core'
+import { BATCHED_LAYER, SCENE_LAYER } from '@pascal-app/viewer'
+import { type Intersection, type Mesh, type Object3D, Raycaster, Vector3 } from 'three'
+
+// Drawn by the scene pass or by a merged batch that stands in for the mesh.
+const DRAWN_LAYERS_MASK = (1 << SCENE_LAYER) | (1 << BATCHED_LAYER)
+// High enough above any level's floor that a raised platform is below it.
+const CAST_HEIGHT = 50
+const down = new Vector3(0, -1, 0)
+const origin = new Vector3()
+
+function isMesh(object: Object3D): object is Mesh {
+  return (object as Mesh).isMesh === true
+}
+
+function isDrawn(mesh: Mesh) {
+  if ((mesh.layers.mask & DRAWN_LAYERS_MASK) === 0) return false
+  for (let current: Object3D | null = mesh; current; current = current.parent) {
+    if (!current.visible) return false
+  }
+  return true
+}
+
+function levelOf(nodes: Record<AnyNodeId, AnyNode>, id: string): AnyNode | null {
+  let node: AnyNode | undefined = nodes[id as AnyNodeId]
+  while (node) {
+    if (node.type === 'level') return node
+    node = node.parentId ? nodes[node.parentId as AnyNodeId] : undefined
+  }
+  return null
+}
+
+/**
+ * The walkable surface of the active level: its floor slabs and plates
+ * (raised platforms and sunken floors included) and, on the ground level, the
+ * site's ground and terrain. Walls, items, ceilings, roofs and other levels
+ * are not in it. The mesh list is rebuilt only when the scene, the registry
+ * or the level changes; `revision` moves with it and with any geometry or
+ * transform change, so callers can cache answers between moves.
+ */
+export class FloorSurface {
+  /** The level whose floors count. */
+  levelId: string | null = null
+  private readonly raycaster = new Raycaster()
+  private readonly hits: Intersection[] = []
+  private meshes: Mesh[] = []
+  private objects: { object: Object3D; children: Object3D[] }[] = []
+  private builtFor: { registry: number; nodes: unknown; levelId: string | null } | null = null
+  private meshStates: {
+    geometry: Mesh['geometry']
+    position: unknown
+    positionVersion: number
+    index: unknown
+    indexVersion: number
+    matrix: number[]
+    drawn: boolean
+  }[] = []
+  private version = 0
+
+  get revision() {
+    this.refresh()
+    return this.version
+  }
+
+  /** Height of the highest floor surface at `x`/`z`, or null over nothing. */
+  topAt(x: number, z: number, levelY: number): number | null {
+    origin.set(x, levelY + CAST_HEIGHT, z)
+    this.raycaster.set(origin, down)
+    this.raycaster.far = Number.POSITIVE_INFINITY
+    let top: number | null = null
+    for (const mesh of this.meshes) {
+      if (!isDrawn(mesh)) continue
+      this.hits.length = 0
+      mesh.raycast(this.raycaster, this.hits)
+      for (const hit of this.hits) if (top === null || hit.point.y > top) top = hit.point.y
+    }
+    this.hits.length = 0
+    return top
+  }
+
+  private refresh() {
+    const nodes = useScene.getState().nodes
+    const registry = sceneRegistry.revision
+    const built = this.builtFor
+    let structureChanged = false
+    for (const { object, children } of this.objects) {
+      if (object.children.length !== children.length) {
+        structureChanged = true
+        break
+      }
+      for (let i = 0; i < children.length; i++) {
+        if (object.children[i] === children[i]) continue
+        structureChanged = true
+        break
+      }
+      if (structureChanged) break
+    }
+    if (
+      !built ||
+      built.registry !== registry ||
+      built.nodes !== nodes ||
+      built.levelId !== this.levelId ||
+      structureChanged
+    ) {
+      this.builtFor = { registry, nodes, levelId: this.levelId }
+      this.meshes = this.collect(nodes)
+      this.meshStates = this.meshes.map((mesh) => ({
+        geometry: mesh.geometry,
+        position: null,
+        positionVersion: -1,
+        index: null,
+        indexVersion: -1,
+        matrix: mesh.matrixWorld.elements.slice(),
+        drawn: isDrawn(mesh),
+      }))
+      this.version += 1
+    }
+    // Geometry is rebuilt after the node change that caused it, in place.
+    let changed = false
+    for (let i = 0; i < this.meshes.length; i++) {
+      const mesh = this.meshes[i]!
+      const state = this.meshStates[i]!
+      const position = mesh.geometry.getAttribute('position')
+      const positionVersion = position && 'version' in position ? position.version : 0
+      const index = mesh.geometry.index
+      const indexVersion = index?.version ?? 0
+      const drawn = isDrawn(mesh)
+      if (
+        state.geometry !== mesh.geometry ||
+        state.position !== position ||
+        state.positionVersion !== positionVersion ||
+        state.index !== index ||
+        state.indexVersion !== indexVersion ||
+        state.drawn !== drawn
+      ) {
+        state.geometry = mesh.geometry
+        state.position = position
+        state.positionVersion = positionVersion
+        state.index = index
+        state.indexVersion = indexVersion
+        state.drawn = drawn
+        changed = true
+      }
+      for (let j = 0; j < 16; j++) {
+        const value = mesh.matrixWorld.elements[j]!
+        if (state.matrix[j] === value) continue
+        state.matrix[j] = value
+        changed = true
+      }
+    }
+    if (changed) this.version += 1
+  }
+
+  private collect(nodes: Record<AnyNodeId, AnyNode>) {
+    const meshes: Mesh[] = []
+    this.objects = []
+    const level = this.levelId ? nodes[this.levelId as AnyNodeId] : undefined
+    if (level?.type !== 'level') return meshes
+
+    const nodeObjects = new Set(sceneRegistry.nodes.values())
+    const collect = (object: Object3D, root: Object3D) => {
+      // A slab's hosted items and a site's buildings are not its surface.
+      if (object !== root && nodeObjects.has(object)) return
+      this.objects.push({ object, children: object.children.slice() })
+      if (isMesh(object)) meshes.push(object)
+      for (const child of object.children) collect(child, root)
+    }
+    for (const id of sceneRegistry.byType.slab ?? []) {
+      if (nodes[id as AnyNodeId]?.visible === false) continue
+      if (levelOf(nodes, id)?.id !== level.id) continue
+      const object = sceneRegistry.nodes.get(id)
+      if (object) collect(object, object)
+    }
+    if (level.level === 0) {
+      for (const id of sceneRegistry.byType.site ?? []) {
+        const object = sceneRegistry.nodes.get(id)
+        if (object) collect(object, object)
+      }
+    }
+    return meshes
+  }
+}

package/src/components/editor/floorplan-background-selection.test.ts

@@ -9,7 +9,6 @@ const baseArgs = {
   isWallBuildActive: false,
   modifierKeys: { meta: false, ctrl: false, shift: false, alt: false },
   planPoint: [0, 0] as [number, number],
-  structureLayer: 'elements',
 }
 
 describe('resolveFloorplanBackgroundSelection', () => {
@@ -87,7 +86,6 @@ describe('resolveFloorplanBackgroundSelection', () => {
       canSelectElementFloorplanGeometry: false,
       canSelectFloorplanZones: true,
       getFloorplanHitIdAtPoint: () => 'zone_1',
-      structureLayer: 'zones',
     })
 
     expect(result).toEqual({
@@ -96,4 +94,15 @@ describe('resolveFloorplanBackgroundSelection', () => {
       zoneId: 'zone_1',
     })
   })
+
+  test('a miss while zones are pickable (unit focus) clears the zone selection', () => {
+    const result = resolveFloorplanBackgroundSelection({
+      ...baseArgs,
+      canSelectElementFloorplanGeometry: false,
+      canSelectFloorplanZones: true,
+      getFloorplanHitIdAtPoint: () => null,
+    })
+
+    expect(result).toEqual({ handled: true, kind: 'clear-zones' })
+  })
 })

package/src/components/editor/floorplan-background-selection.ts

@@ -21,7 +21,6 @@ type ResolveFloorplanBackgroundSelectionArgs = {
   isWallBuildActive: boolean
   modifierKeys: ModifierKeys
   planPoint: WallPlanPoint
-  structureLayer: string
 }
 
 function hasToggleModifier(modifierKeys: ModifierKeys): boolean {
@@ -77,7 +76,6 @@ export function resolveFloorplanBackgroundSelection({
   isWallBuildActive,
   modifierKeys,
   planPoint,
-  structureLayer,
 }: ResolveFloorplanBackgroundSelectionArgs): FloorplanBackgroundSelectionResult {
   if (canSelectFloorplanZones) {
     const zoneId = getFloorplanHitIdAtPoint(planPoint)
@@ -102,7 +100,7 @@ export function resolveFloorplanBackgroundSelection({
   }
 
   if (!isWallBuildActive) {
-    if (structureLayer === 'zones') {
+    if (canSelectFloorplanZones) {
       return {
         handled: true,
         kind: 'clear-zones',

package/src/components/editor/floorplan-mode-coordinator.tsx

@@ -59,7 +59,7 @@ export function FloorplanModeCoordinator() {
       <span>{notice.message}</span>
       {notice.kind === 'switch-to-expert' ? (
         <button
-          className="shrink-0 rounded-md bg-cyan-500/15 px-2.5 py-1 font-medium text-cyan-400 hover:bg-cyan-500/25"
+          className="shrink-0 rounded-md bg-cyan-500/15 px-2.5 py-1 font-medium text-cyan-700 dark:text-cyan-400 hover:bg-cyan-500/25"
           onClick={() => {
             setFloorplanMode('expert')
             dismissNotice()
@@ -71,7 +71,7 @@ export function FloorplanModeCoordinator() {
       ) : null}
       <button
         aria-label="Dismiss"
-        className="shrink-0 rounded p-1 text-muted-foreground hover:bg-white/10 hover:text-foreground"
+        className="shrink-0 rounded p-1 text-muted-foreground hover:bg-black/6 dark:hover:bg-white/10 hover:text-foreground"
         onClick={dismissNotice}
         type="button"
       >