@pascal-app/editor 0.8.0 → 0.9.2

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

@@ -12,6 +12,8 @@ const FLOORPLAN_MEASUREMENT_END_TICK = 0.18
 export type LinearMeasurementOverlay = {
   dashedExtensions?: boolean
   id: string
+  dimensionPathEnd?: string | null
+  dimensionPathStart?: string | null
   dimensionLineEnd: { x1: number; y1: number; x2: number; y2: number }
   dimensionLineStart: { x1: number; y1: number; x2: number; y2: number }
   extensionStart: { x1: number; y1: number; x2: number; y2: number }
@@ -34,6 +36,7 @@ type FloorplanMeasurementPalette = {
 type FloorplanMeasurementLineProps = {
   palette: FloorplanMeasurementPalette
   segment: { x1: number; y1: number; x2: number; y2: number }
+  path?: string | null
   isSelected?: boolean
   dashed?: boolean
   stroke?: string
@@ -42,6 +45,7 @@ type FloorplanMeasurementLineProps = {
 function FloorplanMeasurementLine({
   palette,
   segment,
+  path,
   isSelected,
   dashed = false,
   stroke,
@@ -50,7 +54,20 @@ function FloorplanMeasurementLine({
     ? FLOORPLAN_MEASUREMENT_LINE_OPACITY
     : FLOORPLAN_MEASUREMENT_LINE_OPACITY * 0.4
 
-  return (
+  return path ? (
+    <path
+      d={path}
+      fill="none"
+      shapeRendering="geometricPrecision"
+      stroke={stroke ?? palette.measurementStroke}
+      strokeDasharray={dashed ? FLOORPLAN_MEASUREMENT_EXTENSION_DASH : undefined}
+      strokeLinecap="round"
+      strokeLinejoin="round"
+      strokeOpacity={lineOpacity}
+      strokeWidth={FLOORPLAN_MEASUREMENT_LINE_WIDTH}
+      vectorEffect="non-scaling-stroke"
+    />
+  ) : (
     <line
       shapeRendering="geometricPrecision"
       stroke={stroke ?? palette.measurementStroke}
@@ -111,12 +128,26 @@ type FloorplanMeasurementsLayerProps = {
   className: string
   measurements: LinearMeasurementOverlay[]
   palette: FloorplanMeasurementPalette
+  sceneRotationDeg?: number
+}
+
+function normalizeReadableScreenAngle(angleDeg: number) {
+  let normalized = ((((angleDeg + 180) % 360) + 360) % 360) - 180
+
+  if (normalized > 90) {
+    normalized -= 180
+  } else if (normalized <= -90) {
+    normalized += 180
+  }
+
+  return normalized
 }
 
 export const FloorplanMeasurementsLayer = memo(function FloorplanMeasurementsLayer({
   className,
   measurements,
   palette,
+  sceneRotationDeg = 0,
 }: FloorplanMeasurementsLayerProps) {
   if (measurements.length === 0) {
     return null
@@ -124,79 +155,90 @@ export const FloorplanMeasurementsLayer = memo(function FloorplanMeasurementsLay
 
   return (
     <>
-      {measurements.map((measurement) => (
-        <g
-          className={className}
-          key={measurement.id}
-          pointerEvents="none"
-          style={{ userSelect: 'none' }}
-        >
-          <FloorplanMeasurementLine
-            dashed={measurement.dashedExtensions ?? true}
-            isSelected={measurement.isSelected}
-            palette={palette}
-            segment={measurement.extensionStart}
-            stroke={measurement.extensionStroke}
-          />
-          <FloorplanMeasurementLine
-            isSelected={measurement.isSelected}
-            palette={palette}
-            segment={measurement.dimensionLineStart}
-            stroke={measurement.stroke}
-          />
-          <FloorplanMeasurementLine
-            isSelected={measurement.isSelected}
-            palette={palette}
-            segment={measurement.dimensionLineEnd}
-            stroke={measurement.stroke}
-          />
-          <FloorplanMeasurementLine
-            dashed={measurement.dashedExtensions ?? true}
-            isSelected={measurement.isSelected}
-            palette={palette}
-            segment={measurement.extensionEnd}
-            stroke={measurement.extensionStroke}
-          />
-          {measurement.showTicks !== false ? (
-            <>
-              <FloorplanMeasurementTick
-                angleDeg={measurement.labelAngleDeg}
+      {measurements.map((measurement) =>
+        (() => {
+          const screenLabelAngleDeg = normalizeReadableScreenAngle(
+            measurement.labelAngleDeg + sceneRotationDeg,
+          )
+          const localLabelAngleDeg = screenLabelAngleDeg - sceneRotationDeg
+
+          return (
+            <g
+              className={className}
+              key={measurement.id}
+              pointerEvents="none"
+              style={{ userSelect: 'none' }}
+            >
+              <FloorplanMeasurementLine
+                dashed={measurement.dashedExtensions ?? true}
+                isSelected={measurement.isSelected}
+                palette={palette}
+                segment={measurement.extensionStart}
+                stroke={measurement.extensionStroke}
+              />
+              <FloorplanMeasurementLine
                 isSelected={measurement.isSelected}
                 palette={palette}
+                path={measurement.dimensionPathStart}
+                segment={measurement.dimensionLineStart}
                 stroke={measurement.stroke}
-                x={measurement.dimensionLineStart.x1}
-                y={measurement.dimensionLineStart.y1}
               />
-              <FloorplanMeasurementTick
-                angleDeg={measurement.labelAngleDeg}
+              <FloorplanMeasurementLine
                 isSelected={measurement.isSelected}
                 palette={palette}
+                path={measurement.dimensionPathEnd}
+                segment={measurement.dimensionLineEnd}
                 stroke={measurement.stroke}
-                x={measurement.dimensionLineEnd.x2}
-                y={measurement.dimensionLineEnd.y2}
               />
-            </>
-          ) : null}
-          <text
-            dominantBaseline="central"
-            fill={measurement.labelFill ?? palette.measurementStroke}
-            fillOpacity={
-              measurement.isSelected
-                ? FLOORPLAN_MEASUREMENT_LABEL_OPACITY
-                : FLOORPLAN_MEASUREMENT_LABEL_OPACITY * 0.4
-            }
-            fontFamily="ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace"
-            fontSize={FLOORPLAN_MEASUREMENT_LABEL_FONT_SIZE}
-            fontWeight="600"
-            textAnchor="middle"
-            transform={`rotate(${measurement.labelAngleDeg} ${measurement.labelX} ${measurement.labelY}) translate(0, -0.04)`}
-            x={measurement.labelX}
-            y={measurement.labelY}
-          >
-            {measurement.label}
-          </text>
-        </g>
-      ))}
+              <FloorplanMeasurementLine
+                dashed={measurement.dashedExtensions ?? true}
+                isSelected={measurement.isSelected}
+                palette={palette}
+                segment={measurement.extensionEnd}
+                stroke={measurement.extensionStroke}
+              />
+              {measurement.showTicks !== false ? (
+                <>
+                  <FloorplanMeasurementTick
+                    angleDeg={localLabelAngleDeg}
+                    isSelected={measurement.isSelected}
+                    palette={palette}
+                    stroke={measurement.stroke}
+                    x={measurement.dimensionLineStart.x1}
+                    y={measurement.dimensionLineStart.y1}
+                  />
+                  <FloorplanMeasurementTick
+                    angleDeg={localLabelAngleDeg}
+                    isSelected={measurement.isSelected}
+                    palette={palette}
+                    stroke={measurement.stroke}
+                    x={measurement.dimensionLineEnd.x2}
+                    y={measurement.dimensionLineEnd.y2}
+                  />
+                </>
+              ) : null}
+              <text
+                dominantBaseline="central"
+                fill={measurement.labelFill ?? palette.measurementStroke}
+                fillOpacity={
+                  measurement.isSelected
+                    ? FLOORPLAN_MEASUREMENT_LABEL_OPACITY
+                    : FLOORPLAN_MEASUREMENT_LABEL_OPACITY * 0.4
+                }
+                fontFamily="ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace"
+                fontSize={FLOORPLAN_MEASUREMENT_LABEL_FONT_SIZE}
+                fontWeight="600"
+                textAnchor="middle"
+                transform={`rotate(${localLabelAngleDeg} ${measurement.labelX} ${measurement.labelY}) translate(0, -0.04)`}
+                x={measurement.labelX}
+                y={measurement.labelY}
+              >
+                {measurement.label}
+              </text>
+            </g>
+          )
+        })(),
+      )}
     </>
   )
 })

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

@@ -0,0 +1,62 @@
+'use client'
+
+import {
+  type AnyNode,
+  type AnyNodeId,
+  type FloorplanGeometry,
+  type GeometryContext,
+  nodeRegistry,
+  useScene,
+} from '@pascal-app/core'
+import { memo } from 'react'
+import usePlacementPreview from '../../../store/use-placement-preview'
+import { FloorplanGeometryRenderer } from './floorplan-geometry-renderer'
+
+/**
+ * Renders a faint, non-interactive ghost of the node being placed by a
+ * registry placement tool (e.g. column), following the cursor in the floor
+ * plan. The 3D view shows a translucent mesh preview; in 2D that mesh is
+ * hidden (canvas `display:none`), so without this the user only saw the grid
+ * cursor dot + alignment guides — no sense of the footprint they were about
+ * to drop. The placement tool publishes a transient, already-positioned +
+ * aligned node to `usePlacementPreview`; we build its `def.floorplan`
+ * footprint with a minimal (unselected) context and render it.
+ *
+ * Mounted inside the floor-plan scene `<g>` so the geometry's level-local
+ * meters get the same world→SVG transform every other entry does.
+ */
+export const FloorplanPlacementPreviewLayer = memo(function FloorplanPlacementPreviewLayer() {
+  const node = usePlacementPreview((s) => s.node)
+  const parentNode = usePlacementPreview((s) => s.parentNode)
+  if (!node) return null
+
+  const builder = nodeRegistry.get(node.type)?.floorplan
+  if (!builder) return null
+
+  // Minimal, unselected context — preview never shows selection chrome
+  // (move handles / resize arrows / hatch live behind `viewState.selected`).
+  // `resolve` reads the scene lazily (a builder rarely calls it for a ghost,
+  // and `parent: null` short-circuits the elevator's level walk) so the layer
+  // never subscribes to / bulk-reads the nodes map during render.
+  // `parentNode` is the synthetic wall for an off-wall door/window ghost so
+  // its builder draws the real swing-arc / pane symbol (see use-placement-preview).
+  const ctx = {
+    resolve: (id: AnyNodeId) => useScene.getState().nodes[id],
+    children: [],
+    siblings: [],
+    parent: parentNode ?? null,
+    viewState: undefined,
+  } as unknown as GeometryContext
+
+  const geometry = (builder as (n: AnyNode, c: GeometryContext) => FloorplanGeometry | null)(
+    node,
+    ctx,
+  )
+  if (!geometry) return null
+
+  return (
+    <g data-floorplan-placement-preview opacity={0.5} pointerEvents="none">
+      <FloorplanGeometryRenderer geometry={geometry} />
+    </g>
+  )
+})

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

@@ -0,0 +1,308 @@
+import { beforeEach, describe, expect, mock, test } from 'bun:test'
+import type {
+  AnyNode,
+  AnyNodeId,
+  FloorplanAffordanceSession,
+  LiveNodeOverrides,
+} from '@pascal-app/core'
+import { type AnyNodeDefinition, emitter, nodeRegistry, registerNode } from '@pascal-app/core'
+import { z } from 'zod'
+import {
+  cancelFloorplanAffordanceDrag,
+  collectFloorplanDependencyNodes,
+  computeAffectedSiblingIds,
+  floorplanHandleDoubleClickAffordance,
+  subscribeFloorplanAffordanceToolCancel,
+} from './floorplan-registry-layer'
+
+function cabinetRun(id: string, children: string[] = [], parentId: string | null = 'level_test') {
+  return {
+    id,
+    type: 'cabinet',
+    object: 'node',
+    parentId,
+    visible: true,
+    metadata: {},
+    children,
+    position: [0, 0, 0],
+    rotation: 0,
+    width: 1.2,
+    depth: 0.58,
+    carcassHeight: 0.72,
+    plinthHeight: 0.1,
+    showPlinth: true,
+    withCountertop: true,
+    countertopThickness: 0.02,
+  } as AnyNode
+}
+
+function cabinetModule(id: string, parentId: string, children: string[] = []) {
+  return {
+    id,
+    type: 'cabinet-module',
+    object: 'node',
+    parentId,
+    visible: true,
+    metadata: {},
+    children,
+    position: [0, 0.1, 0],
+    rotation: 0,
+    width: 0.6,
+    depth: 0.58,
+    carcassHeight: 0.72,
+    plinthHeight: 0.1,
+    showPlinth: true,
+    countertopThickness: 0.02,
+  } as AnyNode
+}
+
+function isCabinetNode(node: AnyNode | undefined): boolean {
+  return node?.type === 'cabinet' || node?.type === 'cabinet-module'
+}
+
+function childIdsOf(node: AnyNode | undefined): AnyNodeId[] {
+  return Array.isArray((node as { children?: unknown } | undefined)?.children)
+    ? ((node as { children: AnyNodeId[] }).children ?? [])
+    : []
+}
+
+function cabinetAffectedIds({
+  node,
+  nodes,
+  liveOverrides,
+}: {
+  node: AnyNode
+  nodes: Record<AnyNodeId, AnyNode>
+  liveOverrides: Map<string, Record<string, unknown>>
+}): readonly AnyNodeId[] {
+  const affected = new Set<AnyNodeId>()
+  const visited = new Set<AnyNodeId>()
+  const queue: AnyNodeId[] = [node.id as AnyNodeId]
+
+  while (queue.length > 0) {
+    const id = queue.pop()!
+    if (visited.has(id)) continue
+    visited.add(id)
+    const current = nodes[id]
+    if (!isCabinetNode(current)) continue
+    affected.add(id)
+
+    const parentIds = [
+      current?.parentId as AnyNodeId | undefined,
+      (liveOverrides.get(id) as { parentId?: AnyNodeId } | undefined)?.parentId,
+    ]
+    for (const parentId of parentIds) {
+      const parent = parentId ? nodes[parentId] : undefined
+      if (parentId && isCabinetNode(parent)) queue.push(parentId)
+    }
+    for (const childId of childIdsOf(current)) {
+      if (isCabinetNode(nodes[childId])) queue.push(childId)
+    }
+  }
+
+  return Array.from(affected)
+}
+
+function registerCabinetFloorplanDefinition(kind: 'cabinet' | 'cabinet-module') {
+  registerNode({
+    kind,
+    schemaVersion: 1,
+    schema: z.object({ type: z.literal(kind) }) as never,
+    category: 'utility',
+    defaults: () => ({}) as never,
+    floorplanAffectedIds: cabinetAffectedIds,
+  } as unknown as AnyNodeDefinition)
+}
+
+describe('floorplan affordance cancellation', () => {
+  test('tool:cancel reverts the drag and makes a later pointerup inert', () => {
+    const releasePointerCapture = mock(() => {})
+    const commit = mock(() => {})
+    const session: FloorplanAffordanceSession = {
+      affectedIds: ['wall_a', 'wall_b'],
+      apply: () => {},
+      canCommit: () => true,
+      commit,
+    }
+    const snapshots = [{ id: 'wall_a' as AnyNodeId, data: { width: 1 } }]
+    const drag = {
+      pointerId: 7,
+      captureTarget: {
+        hasPointerCapture: mock(() => true),
+        releasePointerCapture,
+      } as unknown as Element,
+      handleId: 'wall_a:endpoint',
+      session,
+      snapshots,
+      historyPaused: true,
+      lastPlanPoint: [0, 0] as [number, number],
+    }
+    const dragRef = { current: drag }
+    const restoreSnapshots = mock(() => {})
+    const resumeHistory = mock(() => {})
+    const clearPreview = mock(() => {})
+    const clearSnapFeedback = mock(() => {})
+    const endReshapeScope = mock(() => {})
+    const clearDragFeedback = mock(() => {})
+    const consumeToolCancel = mock(() => {})
+
+    const unsubscribe = subscribeFloorplanAffordanceToolCancel(
+      () =>
+        cancelFloorplanAffordanceDrag(dragRef, {
+          restoreSnapshots,
+          resumeHistory,
+          clearPreview,
+          clearSnapFeedback,
+          endReshapeScope,
+          clearDragFeedback,
+        }),
+      consumeToolCancel,
+    )
+
+    try {
+      emitter.emit('tool:cancel')
+      emitter.emit('tool:cancel')
+    } finally {
+      unsubscribe()
+    }
+
+    expect(dragRef.current).toBeNull()
+    expect(releasePointerCapture).toHaveBeenCalledWith(7)
+    expect(restoreSnapshots).toHaveBeenCalledWith(snapshots)
+    expect(resumeHistory).toHaveBeenCalledTimes(1)
+    expect(clearPreview).toHaveBeenCalledTimes(2)
+    expect(clearPreview).toHaveBeenNthCalledWith(1, 'wall_a')
+    expect(clearPreview).toHaveBeenNthCalledWith(2, 'wall_b')
+    expect(clearSnapFeedback).toHaveBeenCalledTimes(1)
+    expect(endReshapeScope).toHaveBeenCalledWith(drag)
+    expect(clearDragFeedback).toHaveBeenCalledTimes(1)
+    expect(consumeToolCancel).toHaveBeenCalledTimes(1)
+    expect(drag.historyPaused).toBe(false)
+
+    const activeDrag = dragRef.current
+    if (activeDrag?.pointerId === 7) activeDrag.session.commit?.()
+    expect(commit).toHaveBeenCalledTimes(0)
+  })
+})
+
+describe('floorplan vertex double-click routing', () => {
+  test('routes polygon vertex handles to the kind-owned delete affordance', () => {
+    expect(
+      floorplanHandleDoubleClickAffordance({
+        kind: 'endpoint-handle',
+        point: [1, 2],
+        state: 'idle',
+        affordance: 'move-vertex',
+        payload: { vertexIndex: 2 },
+      }),
+    ).toBe('delete-vertex')
+
+    expect(
+      floorplanHandleDoubleClickAffordance({
+        kind: 'endpoint-handle',
+        point: [1, 2],
+        state: 'idle',
+        affordance: 'move-endpoint',
+        payload: { endpoint: 'end' },
+      }),
+    ).toBeNull()
+  })
+})
+
+describe('computeAffectedSiblingIds', () => {
+  beforeEach(() => {
+    nodeRegistry._reset()
+    registerCabinetFloorplanDefinition('cabinet')
+    registerCabinetFloorplanDefinition('cabinet-module')
+  })
+
+  test('propagates cabinet live overrides through the cabinet family', () => {
+    const run = cabinetRun('cabinet_run', ['cabinet-module_main', 'cabinet-module_corner'])
+    const module = cabinetModule('cabinet-module_main', run.id)
+    const cornerModule = cabinetModule('cabinet-module_corner', run.id, ['cabinet_child-run'])
+    const childRun = cabinetRun('cabinet_child-run', ['cabinet-module_child'], cornerModule.id)
+    const childModule = cabinetModule('cabinet-module_child', childRun.id)
+    const nodes = {
+      [run.id]: run,
+      [module.id]: module,
+      [cornerModule.id]: cornerModule,
+      [childRun.id]: childRun,
+      [childModule.id]: childModule,
+    } as Record<string, AnyNode>
+
+    const affected = computeAffectedSiblingIds(
+      [run.id as AnyNodeId],
+      nodes,
+      new Map([[run.id, { position: [2, 0, 3] }]]),
+    )
+
+    expect(affected).toEqual(
+      new Set([run.id, module.id, cornerModule.id, childRun.id, childModule.id] as AnyNodeId[]),
+    )
+  })
+
+  test('propagates a live-moving cabinet module back to its owning run', () => {
+    const run = cabinetRun('cabinet_run', ['cabinet-module_main', 'cabinet-module_child'])
+    const module = cabinetModule('cabinet-module_main', run.id)
+    const sibling = cabinetModule('cabinet-module_child', run.id)
+    const nodes = {
+      [run.id]: run,
+      [module.id]: module,
+      [sibling.id]: sibling,
+    } as Record<string, AnyNode>
+
+    const affected = computeAffectedSiblingIds(
+      [module.id as AnyNodeId],
+      nodes,
+      new Map([[module.id, { position: [1.2, 0.1, 0.3] }]]),
+    )
+
+    expect(affected).toEqual(new Set([module.id, run.id, sibling.id] as AnyNodeId[]))
+  })
+})
+
+describe('collectFloorplanDependencyNodes', () => {
+  test('includes referenced hosts and their transform-owning parents', () => {
+    const level = {
+      id: 'level_test',
+      type: 'level',
+      parentId: null,
+      children: ['roof_test'],
+    } as unknown as AnyNode
+    const roof = {
+      id: 'roof_test',
+      type: 'roof',
+      parentId: level.id,
+      children: [],
+      position: [0, 0, 0],
+      rotation: 0,
+    } as unknown as AnyNode
+    const measurement = {
+      id: 'measurement_test',
+      type: 'measurement',
+      parentId: level.id,
+    } as unknown as AnyNode
+    const definition = {
+      floorplanDependencies: () => [roof.id],
+    } as unknown as AnyNodeDefinition
+
+    expect(
+      collectFloorplanDependencyNodes(
+        definition,
+        measurement,
+        {
+          [level.id]: level,
+          [roof.id]: roof,
+          [measurement.id]: measurement,
+        },
+        new Map<string, LiveNodeOverrides>([
+          [roof.id, { position: [3, 0, 2] }],
+          [level.id, { visible: false }],
+        ]),
+      ),
+    ).toEqual([
+      expect.objectContaining({ id: roof.id, position: [3, 0, 2] }),
+      expect.objectContaining({ id: level.id, visible: false }),
+    ])
+  })
+})