@pascal-app/editor 0.9.1 → 1.0.0-beta.1

package/src/components/editor-2d/renderers/floorplan-label-angle.ts

@@ -0,0 +1,106 @@
+export function resolveFloorplanLabelAngle(
+  angleRadians: number,
+  sceneRotationDeg: number,
+  screenUpright = false,
+): number {
+  if (screenUpright) return -sceneRotationDeg
+
+  let localAngleDeg = (angleRadians * 180) / Math.PI
+  let screenAngleDeg = localAngleDeg + sceneRotationDeg
+  screenAngleDeg = ((((screenAngleDeg + 180) % 360) + 360) % 360) - 180
+  if (screenAngleDeg > 90) localAngleDeg -= 180
+  else if (screenAngleDeg <= -90) localAngleDeg += 180
+  return ((((localAngleDeg + 180) % 360) + 360) % 360) - 180
+}
+
+export function shouldUpdateFloorplanLabelRotation(
+  previousRotationDeg: number | null,
+  nextRotationDeg: number,
+  minimumDeltaDeg = 1,
+): boolean {
+  if (previousRotationDeg === null) return true
+  const deltaDeg = ((((nextRotationDeg - previousRotationDeg + 180) % 360) + 360) % 360) - 180
+  return Math.abs(deltaDeg) >= minimumDeltaDeg
+}
+
+export function resolveFloorplanAnnotationUpdate({
+  layoutInputsChanged,
+  previousRotationDeg,
+  nextRotationDeg,
+}: {
+  layoutInputsChanged: boolean
+  previousRotationDeg: number | null
+  nextRotationDeg: number
+}): {
+  resolveCollisions: boolean
+  updateLabelPresentation: boolean
+} {
+  return {
+    resolveCollisions: layoutInputsChanged,
+    updateLabelPresentation:
+      layoutInputsChanged ||
+      shouldUpdateFloorplanLabelRotation(previousRotationDeg, nextRotationDeg),
+  }
+}
+
+export function resolveFloorplanAnnotationLabelTransform({
+  angleRadians,
+  sceneRotationDeg,
+  screenUpright,
+  beforeRotation,
+  afterRotation,
+  layoutDx = 0,
+  layoutDy = 0,
+}: {
+  angleRadians: number
+  sceneRotationDeg: number
+  screenUpright: boolean
+  beforeRotation: string
+  afterRotation: string
+  layoutDx?: number
+  layoutDy?: number
+}): {
+  defaultTransform: string
+  transform: string
+} {
+  const degrees = resolveFloorplanLabelAngle(angleRadians, sceneRotationDeg, screenUpright)
+  const defaultTransform = [beforeRotation, `rotate(${degrees})`, afterRotation]
+    .filter(Boolean)
+    .join(' ')
+  return {
+    defaultTransform,
+    transform:
+      layoutDx === 0 && layoutDy === 0
+        ? defaultTransform
+        : `${defaultTransform} translate(${layoutDx} ${layoutDy})`,
+  }
+}
+
+export function updateSvgFloorplanLabelOrientations(
+  labels: Iterable<SVGGElement>,
+  sceneRotationDeg: number,
+): number {
+  let updated = 0
+
+  for (const label of labels) {
+    const angleRadians = Number(label.dataset.floorplanAnnotationAngleRadians)
+    if (!Number.isFinite(angleRadians)) continue
+
+    const { defaultTransform, transform } = resolveFloorplanAnnotationLabelTransform({
+      angleRadians,
+      sceneRotationDeg,
+      screenUpright: label.dataset.floorplanAnnotationScreenUpright === 'true',
+      beforeRotation: label.dataset.floorplanAnnotationTransformBeforeRotation ?? '',
+      afterRotation: label.dataset.floorplanAnnotationTransformAfterRotation ?? '',
+      layoutDx: Number(label.dataset.floorplanAnnotationLayoutDx ?? 0),
+      layoutDy: Number(label.dataset.floorplanAnnotationLayoutDy ?? 0),
+    })
+    if (label.getAttribute('transform') === transform) continue
+
+    label.dataset.floorplanAnnotationDefaultTransform = defaultTransform
+    label.setAttribute('transform', transform)
+    updated += 1
+  }
+
+  return updated
+}

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

@@ -8,10 +8,98 @@ import {
   nodeRegistry,
   useScene,
 } from '@pascal-app/core'
-import { memo } from 'react'
+import { useViewer } from '@pascal-app/viewer'
+import { memo, useMemo } from 'react'
 import usePlacementPreview from '../../../store/use-placement-preview'
+import { useFloorplanRender } from '../floorplan-render-context'
 import { FloorplanGeometryRenderer } from './floorplan-geometry-renderer'
 
+export interface FloorplanNodePreviewProps {
+  node: AnyNode
+  parentNode?: AnyNode | null
+  opacity?: number
+  className?: string
+  selected?: boolean
+  highlighted?: boolean
+  hovered?: boolean
+  moving?: boolean
+}
+
+/**
+ * Stateless floor-plan ghost for an already-positioned node. Hosts can use
+ * this to render host-owned placement previews without publishing transient
+ * state into the editor's local placement-preview store.
+ */
+export const FloorplanNodePreview = memo(function FloorplanNodePreview({
+  node,
+  parentNode = null,
+  opacity = 0.5,
+  className,
+  selected = false,
+  highlighted = false,
+  hovered = false,
+  moving = false,
+}: FloorplanNodePreviewProps) {
+  const nodes = useScene((state) => state.nodes)
+  const unit = useViewer((state) => state.unit)
+  const renderContext = useFloorplanRender()
+
+  const geometry = useMemo(() => {
+    const definition = nodeRegistry.get(node.type)
+    const builder = definition?.floorplan
+    if (!builder) return null
+
+    const contextNodes: Record<string, AnyNode> = {
+      ...(nodes as Record<string, AnyNode>),
+      [node.id]: node,
+    }
+    if (parentNode) contextNodes[parentNode.id] = parentNode
+    const resolvedParent =
+      parentNode ?? (node.parentId ? (contextNodes[node.parentId] ?? null) : null)
+    const childIds = (node as AnyNode & { children?: AnyNodeId[] }).children ?? []
+    const children = childIds.flatMap((id) => {
+      const child = contextNodes[id]
+      return child ? [child] : []
+    })
+    const siblings = Object.values(contextNodes).filter(
+      (candidate) =>
+        candidate.id !== node.id &&
+        candidate.type === node.type &&
+        candidate.parentId === node.parentId,
+    )
+    const levelData = definition.computeFloorplanLevelData?.({
+      siblings: [node, ...siblings],
+      nodes: contextNodes,
+    })
+    const ctx: GeometryContext = {
+      resolve: <N = AnyNode>(id: AnyNodeId) => contextNodes[id] as N | undefined,
+      children,
+      siblings,
+      parent: resolvedParent,
+      levelData,
+      viewState: renderContext
+        ? {
+            selected,
+            unit,
+            highlighted,
+            hovered,
+            moving,
+            palette: renderContext.palette,
+          }
+        : undefined,
+    }
+
+    return (builder as (n: AnyNode, c: GeometryContext) => FloorplanGeometry | null)(node, ctx)
+  }, [highlighted, hovered, moving, node, nodes, parentNode, renderContext, selected, unit])
+  if (!geometry) return null
+
+  return (
+    <g className={className} opacity={opacity} pointerEvents="none">
+      <FloorplanGeometryRenderer geometry={geometry} pointerEventsOverride="none" />
+    </g>
+  )
+})
+
 /**
  * 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
@@ -20,40 +108,20 @@ import { FloorplanGeometryRenderer } from './floorplan-geometry-renderer'
  * 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.
+ * footprint with active sibling, level-data, and theme context so kind-specific
+ * shapes match the committed renderer.
  *
  * 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.
-  const ctx = {
-    resolve: (id: AnyNodeId) => useScene.getState().nodes[id],
-    children: [],
-    siblings: [],
-    parent: 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 data-floorplan-placement-preview>
+      <FloorplanNodePreview node={node} parentNode={parentNode} />
     </g>
   )
 })