@pascal-app/editor 1.0.1 → 1.0.4

package/src/lib/typing-target.ts

@@ -0,0 +1,9 @@
+// Keys typed into a field (the room-name combobox, any input, an open dialog)
+// belong to that field, never to a canvas gesture.
+const TYPING_TARGET =
+  'input, textarea, select, [contenteditable]:not([contenteditable="false"]), [role="combobox"], [role="textbox"], [role="dialog"], [role="alertdialog"]'
+
+export function isTypingTarget(target: EventTarget | null) {
+  const element = target as { closest?: (selector: string) => unknown; isContentEditable?: boolean }
+  return !!element && (element.isContentEditable === true || !!element.closest?.(TYPING_TARGET))
+}

package/src/lib/units.ts

@@ -4,7 +4,8 @@ import {
   type BuildingNode,
   type LevelNode,
   pointInPolygon2D,
-  resolveAutoZonePolygon,
+  runAsSingleSceneHistoryStep,
+  sceneRegistry,
   snapWorldXZToBuildingLocal,
   UnitNode,
   useScene,
@@ -12,14 +13,13 @@ import {
 } from '@pascal-app/core'
 import { useViewer } from '@pascal-app/viewer'
 import { useEffect } from 'react'
-import useEditor, { type StructureLayer } from '../store/use-editor'
+import useEditor from '../store/use-editor'
 import { getActiveBuildingPose } from './world-grid-snap'
 
 type Nodes = Readonly<Record<AnyNodeId, AnyNode>>
 
 // Unit focus is a session gesture: the layer the user was on when focus began
 // comes back when focus ends, unless they switched layers by hand meanwhile.
-let restoreLayer: StructureLayer | null = null
 let entering = false
 let leaving = false
 
@@ -49,11 +49,7 @@ export function enterUnitFocus(unitId: UnitNode['id']): void {
     const unit = nodes[unitId]
     if (unit?.type !== 'unit') return
     const editor = useEditor.getState()
-    if (restoreLayer === null) restoreLayer = editor.structureLayer
-    if (editor.phase !== 'structure') editor.setPhase('structure')
-    if (useEditor.getState().structureLayer !== 'zones') {
-      useEditor.getState().setStructureLayer('zones')
-    }
+    if (editor.phase === 'site') editor.setPhase('building')
     const viewer = useViewer.getState()
     if (viewer.focusedUnitId !== unitId) viewer.setFocusedUnit(unitId)
 
@@ -72,19 +68,7 @@ export function enterUnitFocus(unitId: UnitNode['id']): void {
   }
 }
 
-function finishLeave(unitId: UnitNode['id'], keepLayer: boolean) {
-  const layer = restoreLayer
-  restoreLayer = null
-  const editor = useEditor.getState()
-  if (
-    !keepLayer &&
-    layer &&
-    layer !== 'zones' &&
-    editor.phase === 'structure' &&
-    editor.structureLayer === 'zones'
-  ) {
-    editor.setStructureLayer(layer)
-  }
+function finishLeave(unitId: UnitNode['id']) {
   const { selection, setSelection } = useViewer.getState()
   if (selection.selectedIds.length === 1 && selection.selectedIds[0] === unitId) {
     setSelection({ selectedIds: [] })
@@ -92,7 +76,7 @@ function finishLeave(unitId: UnitNode['id'], keepLayer: boolean) {
 }
 
 /** Ends unit focus. Returns false when no unit was focused. */
-export function leaveUnitFocus(options?: { keepLayer?: boolean }): boolean {
+export function leaveUnitFocus(): boolean {
   const viewer = useViewer.getState()
   const unitId = viewer.focusedUnitId
   if (!unitId) return false
@@ -102,7 +86,7 @@ export function leaveUnitFocus(options?: { keepLayer?: boolean }): boolean {
   } finally {
     leaving = false
   }
-  finishLeave(unitId, options?.keepLayer ?? false)
+  finishLeave(unitId)
   return true
 }
 
@@ -124,28 +108,75 @@ export function assignZoneToUnit(zoneId: ZoneNode['id'], unitId: UnitNode['id']
   if (updates.length > 0) updateNodes(updates)
 }
 
+/** The units of the building a zone's level belongs to, and the one listing the zone. */
+export function zoneUnits(
+  nodes: Nodes,
+  zoneId: string,
+): { buildingId: BuildingNode['id'] | null; units: UnitNode[]; current: UnitNode | null } {
+  const zone = nodes[zoneId as AnyNodeId]
+  const level = zone?.parentId ? nodes[zone.parentId as AnyNodeId] : undefined
+  const building = level?.parentId ? nodes[level.parentId as AnyNodeId] : undefined
+  if (building?.type !== 'building') return { buildingId: null, units: [], current: null }
+  const units = building.children.flatMap((id) => {
+    const child = nodes[id as AnyNodeId]
+    return child?.type === 'unit' ? [child] : []
+  })
+  return {
+    buildingId: building.id,
+    units,
+    current: units.find((unit) => unit.members.includes(zoneId as ZoneNode['id'])) ?? null,
+  }
+}
+
+/** Puts a zone in a new unit of its building (named "Unit N"), in one undo step, without focusing it. */
+export function addZoneToNewUnit(zoneId: ZoneNode['id']): UnitNode['id'] | null {
+  const { buildingId, units } = zoneUnits(useScene.getState().nodes, zoneId)
+  if (!buildingId) return null
+  const unit = UnitNode.parse({ name: `Unit ${units.length + 1}` })
+  runAsSingleSceneHistoryStep(useScene, () => {
+    useScene.getState().createNode(unit, buildingId)
+    assignZoneToUnit(zoneId, unit.id)
+  })
+  return unit.id
+}
+
 export function toggleZoneMembership(unitId: UnitNode['id'], zoneId: ZoneNode['id']): void {
   const unit = useScene.getState().nodes[unitId]
   if (unit?.type !== 'unit') return
   assignZoneToUnit(zoneId, unit.members.includes(zoneId) ? null : unitId)
 }
 
+/** How far (m) below a mezzanine's walking surface a hit still counts as on it (its plate and underside). */
+const MEZZANINE_HIT_TOLERANCE = 0.05
+
 /**
  * The zone under a point on the current level, in building-local XZ. A 3D
  * click lands on whatever surface is closest (a floor slab sits above the
  * zone fill), so painting resolves the zone from the hit point instead of the
- * hit mesh. Nested zones resolve to the smallest one.
+ * hit mesh. Nested zones resolve to the smallest one, except that a mezzanine
+ * the hit may be on always wins over its host. With the hit's height (`y`,
+ * level-local) a mezzanine counts only when the hit is on or above its plate —
+ * the host floor under it is the host's; without one (the plan, seen from
+ * above) the mezzanine on top wins.
  */
-export function zoneAtLevelPoint(x: number, z: number): ZoneNode | null {
+export function zoneAtLevelPoint(x: number, z: number, y?: number): ZoneNode | null {
   const levelId = useViewer.getState().selection.levelId
   if (!levelId) return null
   const nodes = useScene.getState().nodes
-  const resolve = (id: AnyNodeId) => nodes[id]
   let best: ZoneNode | null = null
   let bestArea = Number.POSITIVE_INFINITY
+  let bestOnTop = false
   for (const node of Object.values(nodes)) {
     if (node.type !== 'zone' || node.parentId !== levelId) continue
-    const polygon = resolveAutoZonePolygon(node, resolve)
+    // An eligible mezzanine is the surface on top: it beats its host whatever
+    // their areas (a mezzanine may cover its whole host).
+    const onTop = node.floor?.support === 'open'
+    if (y !== undefined && onTop) {
+      const underside = (node.floor!.elevation ?? 0) - (node.floor!.thickness ?? 0.2)
+      if (y < underside - MEZZANINE_HIT_TOLERANCE) continue
+    }
+    if (bestOnTop && !onTop) continue
+    const polygon = node.polygon
     if (!pointInPolygon2D([x, z], polygon)) continue
     let area = 0
     for (let i = 0; i < polygon.length; i++) {
@@ -154,20 +185,30 @@ export function zoneAtLevelPoint(x: number, z: number): ZoneNode | null {
       area += a[0] * b[1] - b[0] * a[1]
     }
     area = Math.abs(area) / 2
-    if (area < bestArea) {
+    if (area < bestArea || (onTop && !bestOnTop)) {
       best = node
       bestArea = area
+      bestOnTop = onTop
     }
   }
   return best
 }
 
-export function zoneAtWorldPoint(worldX: number, worldZ: number): ZoneNode | null {
+/** `worldY` (optional): the hit's height, so a click under a mezzanine picks the host. */
+export function zoneAtWorldPoint(worldX: number, worldZ: number, worldY?: number): ZoneNode | null {
   const pose = getActiveBuildingPose()
   const [x, z] = pose
     ? snapWorldXZToBuildingLocal(worldX, worldZ, pose.position, pose.rotationY, 0).local
     : [worldX, worldZ]
-  return zoneAtLevelPoint(x, z)
+  return zoneAtLevelPoint(x, z, worldY === undefined ? undefined : levelLocalY(worldY))
+}
+
+function levelLocalY(worldY: number): number {
+  const levelId = useViewer.getState().selection.levelId
+  const level = levelId ? sceneRegistry.nodes.get(levelId) : undefined
+  if (!level) return worldY
+  level.updateWorldMatrix(true, false)
+  return worldY - level.matrixWorld.elements[13]!
 }
 
 export const ZONE_PAINT_DELAY_MS = 250
@@ -211,32 +252,29 @@ export function createUnitInBuilding(buildingId: BuildingNode['id']): UnitNode['
 /**
  * Keeps unit focus coherent with the rest of the editor: a focus set from
  * anywhere (the unit inspector calls the viewer store directly) gets the full
- * enter treatment, and focus ends when the user switches layer or phase by
- * hand, selects anything other than the focused unit, or the unit is deleted.
+ * enter treatment, and focus ends when the user goes to site, selects
+ * anything other than the focused unit, or the unit is deleted.
  */
 export function useUnitFocusRules(): void {
   useEffect(() => {
     const unsubscribeViewer = useViewer.subscribe((state, prev) => {
       if (state.focusedUnitId !== prev.focusedUnitId) {
         if (state.focusedUnitId) enterUnitFocus(state.focusedUnitId)
-        else if (prev.focusedUnitId && !leaving) finishLeave(prev.focusedUnitId, false)
+        else if (prev.focusedUnitId && !leaving) finishLeave(prev.focusedUnitId)
         return
       }
       const unitId = state.focusedUnitId
       if (!unitId || state.selection === prev.selection) return
       // Selecting a zone keeps focus: renaming or recolouring a zone row is
-      // part of arranging the unit, and zones live on the layer focus uses.
+      // part of arranging the unit.
       const { selectedIds } = state.selection
       const selectsOther =
         selectedIds.length > 0 && !(selectedIds.length === 1 && selectedIds[0] === unitId)
       if (selectsOther) leaveUnitFocus()
     })
     const unsubscribeEditor = useEditor.subscribe((state, prev) => {
-      if (state.structureLayer === prev.structureLayer && state.phase === prev.phase) return
-      if (!useViewer.getState().focusedUnitId) return
-      if (state.phase !== 'structure' || state.structureLayer !== 'zones') {
-        leaveUnitFocus({ keepLayer: true })
-      }
+      if (state.phase === prev.phase || state.phase === 'building') return
+      if (useViewer.getState().focusedUnitId) leaveUnitFocus()
     })
     const unsubscribeScene = useScene.subscribe((state, prev) => {
       if (state.nodes === prev.nodes) return

package/src/lib/vector-edges.test.ts

@@ -0,0 +1,58 @@
+import { describe, expect, test } from 'bun:test'
+import * as THREE from 'three'
+import { candidateEdges, hideUndrawnMeshes, materialShows } from './vector-edges'
+
+/** A unit box's feature edges: 12, six floats each. */
+const BOX_EDGE_FLOATS = 12 * 6
+
+function sceneWithProxy() {
+  const scene = new THREE.Scene()
+  const house = new THREE.Mesh(new THREE.BoxGeometry(1, 1, 1), new THREE.MeshBasicMaterial())
+  // a utility-pole pick proxy: a tall box that draws nothing
+  const proxy = new THREE.Mesh(
+    new THREE.BoxGeometry(0.5, 10.7, 0.5),
+    new THREE.MeshBasicMaterial({ colorWrite: false, depthWrite: false }),
+  )
+  proxy.position.set(3, 0, 0)
+  scene.add(house, proxy)
+  scene.updateMatrixWorld(true)
+  return { scene, house, proxy }
+}
+
+describe('vector edges skip what draws nothing', () => {
+  test('a pick proxy (colorWrite false) has no lines', () => {
+    const { scene } = sceneWithProxy()
+    const camera = new THREE.OrthographicCamera(-10, 10, 10, -10, 0.1, 100)
+    const world = candidateEdges(scene, camera, 20, 400_000)
+    expect(world).toHaveLength(BOX_EDGE_FLOATS)
+    // every edge is the 1 m box's, none the 10.7 m proxy's
+    for (let i = 1; i < world.length; i += 3)
+      expect(Math.abs(world[i] as number)).toBeLessThanOrEqual(0.5)
+  })
+
+  test('hidden materials, see-through hit boxes and colour-masked colliders all count as undrawn', () => {
+    expect(materialShows(new THREE.MeshBasicMaterial())).toBe(true)
+    expect(materialShows(new THREE.MeshBasicMaterial({ colorWrite: false }))).toBe(false)
+    expect(materialShows(new THREE.MeshBasicMaterial({ visible: false }))).toBe(false)
+    expect(materialShows(new THREE.MeshBasicMaterial({ transparent: true, opacity: 0 }))).toBe(
+      false,
+    )
+    expect(
+      materialShows([
+        new THREE.MeshBasicMaterial({ colorWrite: false }),
+        new THREE.MeshBasicMaterial(),
+      ]),
+    ).toBe(true)
+  })
+
+  test('the depth and normal passes see no pick proxy, and it comes back after', () => {
+    const { scene, house, proxy } = sceneWithProxy()
+    const show = hideUndrawnMeshes(scene)
+    // under the passes' override material the proxy would write depth and
+    // hide the real edges behind it
+    expect(proxy.visible).toBe(false)
+    expect(house.visible).toBe(true)
+    show()
+    expect(proxy.visible).toBe(true)
+  })
+})