feat: 2D editing — floorplan panel, measurements, command palette (v0.3.0)

* sync: port 2D editing features from monorepo (v0.3.0)

## New Features

### Floorplan Panel (7.5K LOC)
- Full 2D editing interface with wall drawing, measurement, and unit display
- Interactive floorplan view with pan/zoom, grid snapping
- Wall thickness visualization, door/window placement
- Zone and slab polygon editing
- Guide image overlay support
- Metric/imperial unit toggle

### Command Palette Overhaul
- Complete rewrite with new command registry system
- Keyboard shortcuts UI with ShortcutToken component
- Editor-specific commands (floorplan, measurements, camera focus)
- Improved search and action organization

### Wall Measurements
- Real-time wall length labels in 3D view
- Metric/imperial conversion
- Wall measurement UI component

### Enhanced Tools
- Wall drafting utilities (grid snapping, validation)
- Node action menu for quick operations
- Improved polygon editing for zones/slabs/sites
- Roof segment panel for granular roof control

## Package Changes

### @pascal-app/core@0.3.0
- New wall-footprint.ts: 2D wall footprint calculation
- Wall mitering exports for floorplan view
- camera-controls:focus event
- Space detection undo pause/resume
- Mark sibling nodes dirty on deletion (miter recalc)

### @pascal-app/viewer@0.3.0
- ErrorBoundary component for robust item rendering
- Broken item fallback UI
- Wall renderer: mark dirty on mount
- Ground occluder: only lowest level punches through
- Unit state (metric/imperial) in viewer store

### @pascal-app/editor@0.1.0
- 48 file changes (16 new, 32 modified)
- New stores: useCommandRegistry, usePaletteViewRegistry
- Tree node drag-and-drop system
- Level selection utilities
- Enhanced scene graph operations

## Apps/Editor
- GeistPixelSquare font for pixel-perfect UI
- Blueprint icon asset
- Updated layout and globals for font support

## Security
- Zero AI imports or internal package refs
- All monorepo-specific code excluded
- Clean audit: no API keys or secrets

## Testing
- Security audit passed 
- All AI/internal code excluded 
- Version bumps applied 

79 files modified, 16 files added
~2600 insertions, ~1400 deletions

* fix: lint cleanup — suppress intentional dep warnings, fix missing dep, remove stale ignores

- Add biome-ignore for 3 intentional useEffect reset patterns (levelId, selectedGuide, selectedId)
- Fix actual missing dependency: currentBuildingId in handleSiteEditShortcutSelect callback
- Remove 3 stale biome-ignore comments in r3f.d.ts (rule not active)

Build and lint pass clean.

* fix: type errors — polygon area guards, selection cast, readonly keywords, door guard

- ceiling-panel, slab-panel, ceiling-tree-node, slab-tree-node, zone-tree-node:
  guard polygon[i]/polygon[j] array access before arithmetic (TS2532)
- scene.ts: introduce toViewerSelection() helper to cast persisted string IDs
  to branded template literal types expected by useViewer.setSelection (TS2345)
- door-panel: guard early return when node is undefined in setSegmentHeightRatio (TS18048)
- editor-commands: remove 'as const' from inline command object, keywords is mutable string[] (TS2322)

All type checks pass. Build and lint clean.

---------

Co-authored-by: Anton Pascal <anton-pascal@users.noreply.github.com>
This commit is contained in:
Anton
2026-03-24 19:48:11 +00:00
committed by GitHub
co-authored by Anton Pascal
parent 3791614a9d
commit f06f2fa1b1
95 changed files with 12378 additions and 1393 deletions
@@ -0,0 +1,16 @@
import type { ErrorInfo, ReactNode } from 'react'
import { Component } from 'react'
export class ErrorBoundary extends Component<
{ children: ReactNode; fallback: ReactNode },
{ hasError: boolean }
> {
state = { hasError: false }
static getDerivedStateFromError() {
return { hasError: true }
}
componentDidCatch(_e: Error, _i: ErrorInfo) {}
render() {
return this.state.hasError ? this.props.fallback : this.props.children
}
}
@@ -20,6 +20,7 @@ import { DoubleSide, MeshStandardNodeMaterial } from 'three/webgpu'
import { useNodeEvents } from '../../../hooks/use-node-events'
import { resolveCdnUrl } from '../../../lib/asset-url'
import { useItemLightPool } from '../../../store/use-item-light-pool'
import { ErrorBoundary } from '../../error-boundary'
import { NodeRenderer } from '../node-renderer'
// Shared materials to avoid creating new instances for every mesh
@@ -47,6 +48,17 @@ const getMaterialForOriginal = (original: Material): MeshStandardNodeMaterial =>
return defaultMaterial
}
const BrokenItemFallback = ({ node }: { node: ItemNode }) => {
const handlers = useNodeEvents(node, 'item')
const [w, h, d] = node.asset.dimensions
return (
<mesh position-y={h / 2} {...handlers}>
<boxGeometry args={[w, h, d]} />
<meshStandardMaterial color="#ef4444" opacity={0.6} transparent wireframe />
</mesh>
)
}
export const ItemRenderer = ({ node }: { node: ItemNode }) => {
const ref = useRef<Group>(null!)
@@ -54,9 +66,11 @@ export const ItemRenderer = ({ node }: { node: ItemNode }) => {
return (
<group position={node.position} ref={ref} rotation={node.rotation} visible={node.visible}>
<Suspense fallback={<PreviewModel node={node} />}>
<ModelRenderer node={node} />
</Suspense>
<ErrorBoundary fallback={<BrokenItemFallback node={node} />}>
<Suspense fallback={<PreviewModel node={node} />}>
<ModelRenderer node={node} />
</Suspense>
</ErrorBoundary>
{node.children?.map((childId) => (
<NodeRenderer key={childId} nodeId={childId} />
))}
@@ -1,5 +1,5 @@
import { useRegistry, type WallNode } from '@pascal-app/core'
import { useRef } from 'react'
import { useRegistry, useScene, type WallNode } from '@pascal-app/core'
import { useLayoutEffect, useRef } from 'react'
import type { Mesh } from 'three'
import { useNodeEvents } from '../../../hooks/use-node-events'
import { NodeRenderer } from '../node-renderer'
@@ -9,6 +9,11 @@ export const WallRenderer = ({ node }: { node: WallNode }) => {
useRegistry(node.id, 'wall', ref)
// Mark dirty on mount so WallSystem rebuilds geometry when wall (re)appears
useLayoutEffect(() => {
useScene.getState().markDirty(node.id)
}, [node.id])
const handlers = useNodeEvents(node, 'wall')
return (
@@ -1,4 +1,4 @@
import { useScene } from '@pascal-app/core'
import { type LevelNode, useScene } from '@pascal-app/core'
import polygonClipping from 'polygon-clipping'
import { useMemo } from 'react'
import * as THREE from 'three'
@@ -20,13 +20,39 @@ export const GroundOccluder = () => {
s.lineTo(-size, size)
s.closePath()
// Collect all polygons for slabs and zones
const levelIndexById = new Map<LevelNode['id'], number>()
let lowestLevelIndex = Number.POSITIVE_INFINITY
Object.values(nodes).forEach((node) => {
if (node.type !== 'level') {
return
}
levelIndexById.set(node.id, node.level)
lowestLevelIndex = Math.min(lowestLevelIndex, node.level)
})
// Only the lowest level should punch through the ground plane.
// Upper-level slabs should still cast shadows, but they should not
// reveal their footprint on the level-zero ground material.
const polygons: [number, number][][] = []
Object.values(nodes).forEach((node) => {
if (node.type === 'slab' && node.polygon && node.polygon.length >= 3) {
polygons.push(node.polygon as [number, number][])
if (!(node.type === 'slab' && node.visible && node.polygon.length >= 3)) {
return
}
if (Number.isFinite(lowestLevelIndex)) {
const parentLevelIndex = node.parentId
? levelIndexById.get(node.parentId as LevelNode['id'])
: undefined
if (parentLevelIndex !== lowestLevelIndex) {
return
}
}
polygons.push(node.polygon as [number, number][])
})
if (polygons.length > 0) {