@pascal-app/editor 1.0.1 → 1.0.3

package/src/components/editor-2d/renderers/floorplan-draft-wall-measurement.tsx

@@ -0,0 +1,166 @@
+'use client'
+
+import type { WallPlanPoint } from '@pascal-app/core'
+
+/** Length plate + angle arcs for a drafted wall segment, in plan space. */
+export type DraftWallMeasurement = {
+  lengthLabel: string
+  midpoint: WallPlanPoint
+  direction: WallPlanPoint
+  angleLabels: {
+    id: string
+    label: string
+    center: WallPlanPoint
+    radius: number
+    startAngle: number
+    endAngle: number
+    midAngle: number
+  }[]
+}
+
+export function FloorplanDraftWallMeasurement({
+  measurement,
+  measurementStroke,
+  labelBackground,
+  labelText,
+  sceneRotationDeg,
+  unitsPerPixel,
+}: {
+  measurement: DraftWallMeasurement
+  measurementStroke: string
+  labelBackground: string
+  labelText: string
+  sceneRotationDeg: number
+  unitsPerPixel: number
+}) {
+  const stroke = measurementStroke
+  const labelBg = labelBackground
+
+  const upx = unitsPerPixel
+  const fontSize = Math.max(upx * 10, 0.08)
+  const padX = upx * 6
+  const padY = upx * 3
+
+  // Length plate: rotates to follow the wall direction, but flips 180°
+  // when its on-screen orientation would read upside-down (same trick as
+  // `floorplan-registry-layer.tsx` for dimension labels).
+  const wallAngleDeg =
+    (Math.atan2(measurement.direction[1], measurement.direction[0]) * 180) / Math.PI
+  let labelAngleDeg = wallAngleDeg
+  let screenDeg = wallAngleDeg + sceneRotationDeg
+  screenDeg = ((((screenDeg + 180) % 360) + 360) % 360) - 180
+  if (screenDeg > 90) labelAngleDeg -= 180
+  else if (screenDeg <= -90) labelAngleDeg += 180
+
+  // Push the plate perpendicular to the wall so the dashed footprint
+  // stays visible underneath.
+  const perpX = -measurement.direction[1]
+  const perpY = measurement.direction[0]
+  const offset = upx * 18
+  const cx = measurement.midpoint[0] + perpX * offset
+  const cy = measurement.midpoint[1] + perpY * offset
+
+  const lengthTextWidth = measurement.lengthLabel.length * upx * 6.2
+  const lengthPlateW = lengthTextWidth + padX * 2
+  const lengthPlateH = fontSize + padY * 2
+
+  const arcSampleCount = 32
+
+  return (
+    <g pointerEvents="none">
+      <g transform={`translate(${cx} ${cy}) rotate(${labelAngleDeg})`}>
+        <rect
+          fill={labelBg}
+          height={lengthPlateH}
+          opacity={0.92}
+          rx={upx * 3}
+          ry={upx * 3}
+          stroke={stroke}
+          strokeWidth={upx * 0.5}
+          vectorEffect="non-scaling-stroke"
+          width={lengthPlateW}
+          x={-lengthPlateW / 2}
+          y={-lengthPlateH / 2}
+        />
+        <text
+          dominantBaseline="middle"
+          fill={labelText}
+          fontFamily="ui-monospace, SFMono-Regular, Menlo, monospace"
+          fontSize={fontSize}
+          fontWeight={600}
+          textAnchor="middle"
+          x={0}
+          y={0}
+        >
+          {measurement.lengthLabel}
+        </text>
+      </g>
+
+      {measurement.angleLabels.map((arc) => {
+        // Sample the arc as a polyline — avoids the SVG arc command's
+        // sweep-flag direction quirks across negative/positive sweeps.
+        const points: string[] = []
+        for (let i = 0; i <= arcSampleCount; i += 1) {
+          const t = i / arcSampleCount
+          const a = arc.startAngle + (arc.endAngle - arc.startAngle) * t
+          const px = arc.center[0] + Math.cos(a) * arc.radius
+          const py = arc.center[1] + Math.sin(a) * arc.radius
+          points.push(`${px},${py}`)
+        }
+
+        const aFontSize = Math.max(upx * 9, 0.075)
+        const aPadX = upx * 5
+        const aPadY = upx * 2.5
+        const aTextWidth = arc.label.length * upx * 6.2
+        const aPlateW = aTextWidth + aPadX * 2
+        const aPlateH = aFontSize + aPadY * 2
+
+        const labelDist = arc.radius + upx * 16
+        const lx = arc.center[0] + Math.cos(arc.midAngle) * labelDist
+        const ly = arc.center[1] + Math.sin(arc.midAngle) * labelDist
+
+        return (
+          <g key={`draft-angle-${arc.id}`}>
+            <polyline
+              fill="none"
+              points={points.join(' ')}
+              stroke={stroke}
+              strokeLinecap="round"
+              strokeLinejoin="round"
+              strokeOpacity={0.95}
+              strokeWidth={upx * 1.2}
+              vectorEffect="non-scaling-stroke"
+            />
+            <g transform={`translate(${lx} ${ly})`}>
+              <rect
+                fill={labelBg}
+                height={aPlateH}
+                opacity={0.92}
+                rx={upx * 3}
+                ry={upx * 3}
+                stroke={stroke}
+                strokeWidth={upx * 0.5}
+                vectorEffect="non-scaling-stroke"
+                width={aPlateW}
+                x={-aPlateW / 2}
+                y={-aPlateH / 2}
+              />
+              <text
+                dominantBaseline="middle"
+                fill={labelText}
+                fontFamily="ui-monospace, SFMono-Regular, Menlo, monospace"
+                fontSize={aFontSize}
+                fontWeight={600}
+                textAnchor="middle"
+                x={0}
+                y={0}
+              >
+                {arc.label}
+              </text>
+            </g>
+          </g>
+        )
+      })}
+    </g>
+  )
+}

package/src/components/editor-2d/renderers/floorplan-registry-layer.test.ts

@@ -23,8 +23,10 @@ import {
   collectFloorplanLinkedLevelNodes,
   computeAffectedSiblingIds,
   floorplanAffordanceReshapeScope,
+  floorplanEntryYieldsToTool,
   floorplanHandleDoubleClickAffordance,
   InteractiveGeometry,
+  isFloorplanHierarchyVisible,
   isFloorplanOpeningPlacementState,
   resolveFloorplanHandleUnitsPerPixel,
   siteToFloorplanTransform,
@@ -780,3 +782,50 @@ describe('collectFloorplanLinkedLevelNodes', () => {
     ).toEqual([])
   })
 })
+
+describe('floorplan entry routing while a tool is active', () => {
+  test('build tools get presses on entries, as in 3D; select and delete keep selecting', () => {
+    expect(floorplanEntryYieldsToTool({ mode: 'build', openingPlacement: false })).toBe(true)
+    expect(floorplanEntryYieldsToTool({ mode: 'select', openingPlacement: true })).toBe(true)
+    expect(floorplanEntryYieldsToTool({ mode: 'select', openingPlacement: false })).toBe(false)
+    expect(floorplanEntryYieldsToTool({ mode: 'delete', openingPlacement: false })).toBe(false)
+  })
+})
+
+describe('isFloorplanHierarchyVisible', () => {
+  const node = (id: string, type: string, parentId: string | null, visible = true) =>
+    ({ object: 'node', id, type, parentId, visible, metadata: {} }) as unknown as AnyNode
+  const noOverrides = new Map<string, LiveNodeOverrides>()
+  const visibleUnder = (nodes: Record<string, AnyNode>, rootId: string, id: string) =>
+    isFloorplanHierarchyVisible(nodes[id]!, nodes, noOverrides, rootId as AnyNodeId)
+
+  test('a hidden Site root keeps the nodes on it, linked or detached', () => {
+    const nodes: Record<string, AnyNode> = {
+      site_a: node('site_a', 'site', null, false),
+      building_a: node('building_a', 'building', 'site_a'),
+      level_a: node('level_a', 'level', 'building_a'),
+      wall_a: node('wall_a', 'wall', 'level_a'),
+      wall_b: node('wall_b', 'wall', 'level_a', false),
+      tree_a: node('tree_a', 'trees:tree', null),
+    }
+    expect(visibleUnder(nodes, 'site_a', 'wall_a')).toBe(true)
+    expect(visibleUnder(nodes, 'site_a', 'tree_a')).toBe(true)
+    expect(visibleUnder(nodes, 'site_a', 'wall_b')).toBe(false)
+    expect(visibleUnder(nodes, 'site_a', 'site_a')).toBe(false)
+  })
+
+  test('a hidden building or level root still hides what it hosts', () => {
+    const nodes: Record<string, AnyNode> = {
+      site_a: node('site_a', 'site', null),
+      building_a: node('building_a', 'building', 'site_a', false),
+      level_a: node('level_a', 'level', 'building_a'),
+      wall_a: node('wall_a', 'wall', 'level_a'),
+      elevator_a: node('elevator_a', 'elevator', null),
+    }
+    expect(visibleUnder(nodes, 'site_a', 'wall_a')).toBe(false)
+    expect(visibleUnder(nodes, 'building_a', 'elevator_a')).toBe(false)
+    // A level plan is scoped to its level: the walk stops at the root and
+    // never consults the building above it.
+    expect(visibleUnder(nodes, 'level_a', 'wall_a')).toBe(true)
+  })
+})

package/src/components/editor-2d/renderers/floorplan-registry-layer.tsx

@@ -12,6 +12,7 @@ import {
   type FloorplanPoint,
   type FloorplanScope,
   type GeometryContext,
+  hidesDescendants,
   isNodeKindEnabled,
   isRegistryMovable,
   kindsWithFloorplanScope,
@@ -91,7 +92,7 @@ import { clearSurfacePlanSnapFeedback } from '../../../lib/surface-plan-snap'
 import { paintZoneMembership } from '../../../lib/units'
 import useDirectManipulationFeedback from '../../../store/use-direct-manipulation-feedback'
 import useDrawingView from '../../../store/use-drawing-view'
-import useEditor, { isAngleSnapActive } from '../../../store/use-editor'
+import useEditor, { isAngleSnapActive, type Mode } from '../../../store/use-editor'
 import useFloorplanAnnotationVisibility from '../../../store/use-floorplan-annotation-visibility'
 import useFloorplanMode from '../../../store/use-floorplan-mode'
 import useInteractionScope, {
@@ -456,15 +457,32 @@ export function isFloorplanOpeningPlacementState({
   )
 }
 
-function isFloorplanOpeningPlacementActiveNow(): boolean {
+/**
+ * Whether a press on an entry belongs to the active tool instead of selecting
+ * the entry. Build tools own the plan the way their 3D tools own the canvas,
+ * where selection only runs in select mode: a wall drawn onto another wall
+ * must place its point (T-junction), not select the wall under the cursor.
+ */
+export function floorplanEntryYieldsToTool(state: {
+  mode: Mode
+  openingPlacement: boolean
+}): boolean {
+  return state.mode === 'build' || state.openingPlacement
+}
+
+function floorplanEntryYieldsToToolNow(): boolean {
   const { phase, mode, tool } = useEditor.getState()
   const movingNode = getMovingNode()
-  return isFloorplanOpeningPlacementState({
-    phase,
+  return floorplanEntryYieldsToTool({
     mode,
-    tool,
-    movingNodeHasWallOpeningPlacement:
-      movingNode != null && !!nodeRegistry.get(movingNode.type)?.capabilities?.wallOpeningPlacement,
+    openingPlacement: isFloorplanOpeningPlacementState({
+      phase,
+      mode,
+      tool,
+      movingNodeHasWallOpeningPlacement:
+        movingNode != null &&
+        !!nodeRegistry.get(movingNode.type)?.capabilities?.wallOpeningPlacement,
+    }),
   })
 }
 
@@ -558,13 +576,13 @@ export const FloorplanRegistryLayer = memo(function FloorplanRegistryLayer() {
   const sceneRotationDeg = renderCtx?.getSceneRotationDeg() ?? 0
   const setMovingNode = useEditor((s) => s.setMovingNode)
   const setMovingNodeOrigin = useEditor((s) => s.setMovingNodeOrigin)
-  // Door / window placement (both build and move) needs the SVG's
-  // background click handler to run — it finds the closest wall via
-  // `findClosestWallPoint` and emits `wall:click` for the door / window
-  // tool. When the user clicks *on top of* a wall in this mode, the
+  // Build tools and door / window placement (both build and move) need the
+  // SVG's background handlers to run — wall drafting places its point there,
+  // and opening placement finds the closest wall via `findClosestWallPoint`
+  // and emits `wall:click`. When the user clicks *on top of* a wall, the
   // wall's registry entry would otherwise swallow the click via
-  // `handleClickStop` / `handleSelect`, so the placement never fires.
-  // Pass clicks through in that case.
+  // `handleClickStop` / `handleSelect`, so the tool never sees it. Pass
+  // clicks through in that case (`floorplanEntryYieldsToToolNow`).
   const editorMode = useEditor((s) => s.mode)
   const structureLayer = useEditor((s) => s.structureLayer)
   const floorplanSelectionTool = useEditor((s) => s.floorplanSelectionTool)
@@ -682,9 +700,23 @@ export const FloorplanRegistryLayer = memo(function FloorplanRegistryLayer() {
       const currentSelectedIds = useViewer.getState().selection.selectedIds
       let nextSelectedIds: string[]
       if (options.shouldToggle) {
-        nextSelectedIds = currentSelectedIds.includes(id)
-          ? currentSelectedIds.filter((selectedId) => selectedId !== id)
-          : [...currentSelectedIds, id]
+        if (currentSelectedIds.includes(id)) {
+          // A room's slab and ceiling overlap in the plan and only the slab
+          // takes the click, so removing one removes the other too (a marquee
+          // picks both). 3D keeps single toggles: each is clickable there.
+          const nodes = useScene.getState().nodes
+          const node = nodes[id as AnyNodeId]
+          const counterparts = node
+            ? (getFloorplanNodeExtension(nodeRegistry.get(node.type))?.selectionCounterparts?.({
+                node,
+                nodes,
+              }) ?? [])
+            : []
+          const removed = new Set<string>([id, ...counterparts])
+          nextSelectedIds = currentSelectedIds.filter((selectedId) => !removed.has(selectedId))
+        } else {
+          nextSelectedIds = [...currentSelectedIds, id]
+        }
       } else if (options.isolateMember) {
         nextSelectedIds = [id]
       } else {
@@ -722,7 +754,7 @@ export const FloorplanRegistryLayer = memo(function FloorplanRegistryLayer() {
   )
 
   const handleClickStop = useCallback((event: React.MouseEvent<SVGGElement>) => {
-    if (isFloorplanOpeningPlacementActiveNow()) return
+    if (floorplanEntryYieldsToToolNow()) return
     event.stopPropagation()
   }, [])
 
@@ -733,7 +765,10 @@ export const FloorplanRegistryLayer = memo(function FloorplanRegistryLayer() {
       const node = useScene.getState().nodes[id]
       if (!node || !isRegistryMovable(node.type)) return false
       const currentSelectedIds = useViewer.getState().selection.selectedIds
-      const allowPlainDrag = nodeRegistry.get(node.type)?.capabilities?.movable?.directDrag === true
+      const definition = nodeRegistry.get(node.type)
+      const allowPlainDrag =
+        getFloorplanNodeExtension(definition)?.directDrag === true ||
+        definition?.capabilities?.movable?.directDrag === true
       const commandModifier = event.metaKey || event.ctrlKey
       if (
         !shouldStartDirectMoveDrag({
@@ -980,7 +1015,7 @@ export const FloorplanRegistryLayer = memo(function FloorplanRegistryLayer() {
       // the stores at event time. Commit clears the interaction scope before
       // React paints the next frame; a render-time `undefined` handler leaves
       // a short dead zone where the first post-placement selection is lost.
-      if (isFloorplanOpeningPlacementActiveNow()) return
+      if (floorplanEntryYieldsToToolNow()) return
       if (startDirectMoveDrag(id, event)) return
       if (startDirectRotateDrag(id, event)) return
       if (startGroupMoveDrag(id, event)) return
@@ -3334,15 +3369,26 @@ export function isFloorplanHierarchyVisible(
   liveOverrides: Map<string, LiveNodeOverrides>,
   rootId: AnyNodeId,
 ): boolean {
+  // The root is checked on its own because a site-scoped node can be declared
+  // on the Site without a `parentId` link. A Site's flag never reaches the
+  // nodes on it; see `hidesDescendants`.
   const root = nodes[rootId]
-  if (root && !isFloorplanNodeVisible(root, liveOverrides.get(root.id))) return false
+  if (
+    root &&
+    root.id !== node.id &&
+    hidesDescendants(root) &&
+    !isFloorplanNodeVisible(root, liveOverrides.get(root.id))
+  ) {
+    return false
+  }
 
   let current: AnyNode | undefined = node
   const seen = new Set<AnyNodeId>()
   while (current) {
     if (seen.has(current.id)) return true
     seen.add(current.id)
-    if (!isFloorplanNodeVisible(current, liveOverrides.get(current.id))) return false
+    const reaches = current.id === node.id || hidesDescendants(current)
+    if (reaches && !isFloorplanNodeVisible(current, liveOverrides.get(current.id))) return false
     if (current.id === rootId) return true
     const parentId = current.parentId as AnyNodeId | null
     if (!parentId) return true

package/src/components/systems/zone/zone-system.tsx

@@ -58,9 +58,13 @@ export const ZoneSystem = () => {
       const isDeleteHovered = editorMode === 'delete' && hoveredId === zoneId
 
       // Keep group visible (so <Html> labels stay active), hide/show meshes only.
-      // Show meshes when: in zone mode, selected, or delete-hovered.
-      if (!obj.visible) obj.visible = true
-      const meshVisible = !isCaptureMode && (zoneGeometryVisible || isSelected || isDeleteHovered)
+      // Show meshes when: in zone mode, selected, or delete-hovered. A zone the
+      // author hid (sidebar eye) is the one case where the group itself goes:
+      // otherwise this per-frame write would undo the renderer's `visible` prop.
+      const nodeVisible = zone?.visible !== false
+      if (obj.visible !== nodeVisible) obj.visible = nodeVisible
+      const meshVisible =
+        nodeVisible && !isCaptureMode && (zoneGeometryVisible || isSelected || isDeleteHovered)
       const targetOpacity = isCaptureMode
         ? 0
         : isSelected || isDeleteHovered
@@ -103,7 +107,7 @@ export const ZoneSystem = () => {
       // Labels: visible on the current level (regardless of mode), but never
       // during snapshot capture.
       const showLabel =
-        !isCaptureMode && !zoneLabelsHidden && !!selectedLevelId && isOnSelectedLevel
+        nodeVisible && !isCaptureMode && !zoneLabelsHidden && !!selectedLevelId && isOnSelectedLevel
       const labelOpacity = showLabel ? '1' : '0'
       const labelEl = document.getElementById(`${zoneId}-label`)
       if (labelEl && labelEl.style.opacity !== labelOpacity) {

package/src/components/tools/__fixtures__/hosting.ts

@@ -0,0 +1,10 @@
+import { type AnyNodeDefinition, registerNode } from '@pascal-app/core'
+
+export function registerHostingTestNode(definition: AnyNodeDefinition) {
+  registerNode({
+    ...definition,
+    geometry: () => {
+      throw new Error('Unit-test host geometry must not be rendered')
+    },
+  })
+}

package/src/components/tools/item/item-surface-placement.test.ts

@@ -1,15 +1,9 @@
 import { afterEach, beforeEach, describe, expect, test } from 'bun:test'
-import {
-  type ItemEvent,
-  ItemNode,
-  nodeRegistry,
-  registerNode,
-  sceneRegistry,
-  useScene,
-} from '@pascal-app/core'
+import { type ItemEvent, ItemNode, nodeRegistry, sceneRegistry, useScene } from '@pascal-app/core'
 import { Group, Vector3 } from 'three'
 import useEditor from '../../../store/use-editor'
 import useInteractionScope from '../../../store/use-interaction-scope'
+import { registerHostingTestNode } from '../__fixtures__/hosting'
 import { itemSurfaceStrategy } from './placement-strategies'
 import type { PlacementContext } from './placement-types'
 
@@ -28,7 +22,7 @@ const scopeState = useInteractionScope.getState()
 beforeEach(() => {
   restoreRegistry = nodeRegistry._snapshot()
   nodeRegistry._reset()
-  registerNode({
+  registerHostingTestNode({
     kind: 'item',
     schemaVersion: 1,
     schema: ItemNode,

package/src/components/tools/item/item-surface-strategy-resolver.test.ts

@@ -1,16 +1,10 @@
 import { afterEach, beforeEach, expect, spyOn, test } from 'bun:test'
 import * as core from '@pascal-app/core'
-import {
-  type ItemEvent,
-  ItemNode,
-  nodeRegistry,
-  registerNode,
-  sceneRegistry,
-  useScene,
-} from '@pascal-app/core'
+import { type ItemEvent, ItemNode, nodeRegistry, sceneRegistry, useScene } from '@pascal-app/core'
 import { Group, Vector3 } from 'three'
 import useEditor from '../../../store/use-editor'
 import useInteractionScope from '../../../store/use-interaction-scope'
+import { registerHostingTestNode } from '../__fixtures__/hosting'
 import { itemSurfaceStrategy } from './placement-strategies'
 import type { PlacementContext } from './placement-types'
 
@@ -37,7 +31,7 @@ let resolver: ReturnType<typeof spyOn<typeof core, 'resolveSurfacePlacement'>>
 beforeEach(() => {
   restoreRegistry = nodeRegistry._snapshot()
   nodeRegistry._reset()
-  registerNode({
+  registerHostingTestNode({
     kind: 'item',
     schemaVersion: 1,
     schema: ItemNode,