@pascal-app/editor 0.4.0

package/src/hooks/use-auto-save.ts

@@ -0,0 +1,194 @@
+'use client'
+
+import { useScene } from '@pascal-app/core'
+import { type MutableRefObject, useCallback, useEffect, useRef, useState } from 'react'
+import { type SceneGraph, saveSceneToLocalStorage } from '../lib/scene'
+
+const AUTOSAVE_DEBOUNCE_MS = 1000
+
+export type SaveStatus = 'idle' | 'pending' | 'saving' | 'saved' | 'paused' | 'error'
+
+interface UseAutoSaveOptions {
+  onSave?: (scene: SceneGraph) => Promise<void>
+  onDirty?: () => void
+  onSaveStatusChange?: (status: SaveStatus) => void
+  isVersionPreviewMode?: boolean
+}
+
+/**
+ * Generic autosave hook. Subscribes to the scene store and debounces saves.
+ * Falls back to localStorage when no `onSave` is provided.
+ *
+ * ⚠️  Mount in exactly ONE component (the Editor).
+ */
+export function useAutoSave({
+  onSave,
+  onDirty,
+  onSaveStatusChange,
+  isVersionPreviewMode = false,
+}: UseAutoSaveOptions): { saveStatus: SaveStatus; isLoadingSceneRef: MutableRefObject<boolean> } {
+  const [saveStatus, _setSaveStatus] = useState<SaveStatus>('idle')
+
+  const saveTimeoutRef = useRef<NodeJS.Timeout | undefined>(undefined)
+  const isSavingRef = useRef(false)
+  const isLoadingSceneRef = useRef(false)
+  const pendingSaveRef = useRef(false)
+  const executeSaveRef = useRef<(() => Promise<void>) | null>(null)
+  const hasDirtyChangesRef = useRef(false)
+
+  // Keep latest callback/value refs so the stable subscription always uses current values
+  const onSaveRef = useRef(onSave)
+  const onDirtyRef = useRef(onDirty)
+  const onSaveStatusChangeRef = useRef(onSaveStatusChange)
+  const isVersionPreviewModeRef = useRef(isVersionPreviewMode)
+
+  useEffect(() => {
+    onSaveRef.current = onSave
+  }, [onSave])
+  useEffect(() => {
+    onDirtyRef.current = onDirty
+  }, [onDirty])
+  useEffect(() => {
+    onSaveStatusChangeRef.current = onSaveStatusChange
+  }, [onSaveStatusChange])
+  useEffect(() => {
+    isVersionPreviewModeRef.current = isVersionPreviewMode
+  }, [isVersionPreviewMode])
+
+  const setSaveStatus = useCallback((status: SaveStatus) => {
+    _setSaveStatus(status)
+    onSaveStatusChangeRef.current?.(status)
+  }, [])
+
+  // Stable subscription to scene changes
+  useEffect(() => {
+    let lastNodesSnapshot = JSON.stringify(useScene.getState().nodes)
+
+    async function executeSave() {
+      if (isLoadingSceneRef.current || isVersionPreviewModeRef.current) {
+        pendingSaveRef.current = true
+        setSaveStatus('paused')
+        return
+      }
+
+      const { nodes, rootNodeIds } = useScene.getState()
+      const sceneGraph = { nodes, rootNodeIds } as SceneGraph
+
+      isSavingRef.current = true
+      pendingSaveRef.current = false
+      setSaveStatus('saving')
+
+      try {
+        if (onSaveRef.current) {
+          await onSaveRef.current(sceneGraph)
+        } else {
+          saveSceneToLocalStorage(sceneGraph)
+        }
+        hasDirtyChangesRef.current = false
+        setSaveStatus('saved')
+      } catch {
+        setSaveStatus('error')
+      } finally {
+        isSavingRef.current = false
+
+        if (pendingSaveRef.current) {
+          pendingSaveRef.current = false
+          setSaveStatus('pending')
+          saveTimeoutRef.current = setTimeout(() => {
+            saveTimeoutRef.current = undefined
+            executeSave()
+          }, AUTOSAVE_DEBOUNCE_MS)
+        }
+      }
+    }
+
+    executeSaveRef.current = executeSave
+
+    const unsubscribe = useScene.subscribe((state) => {
+      if (isLoadingSceneRef.current) {
+        lastNodesSnapshot = JSON.stringify(state.nodes)
+        return
+      }
+
+      if (isVersionPreviewModeRef.current) {
+        setSaveStatus('paused')
+        lastNodesSnapshot = JSON.stringify(state.nodes)
+        return
+      }
+
+      const currentNodesSnapshot = JSON.stringify(state.nodes)
+      if (currentNodesSnapshot === lastNodesSnapshot) return
+
+      lastNodesSnapshot = currentNodesSnapshot
+      hasDirtyChangesRef.current = true
+      onDirtyRef.current?.()
+      setSaveStatus('pending')
+
+      if (isSavingRef.current) {
+        pendingSaveRef.current = true
+        return
+      }
+
+      if (saveTimeoutRef.current) clearTimeout(saveTimeoutRef.current)
+
+      saveTimeoutRef.current = setTimeout(() => {
+        saveTimeoutRef.current = undefined
+        executeSave()
+      }, AUTOSAVE_DEBOUNCE_MS)
+    })
+
+    function flushOnExit() {
+      if (!hasDirtyChangesRef.current) return
+      const { nodes, rootNodeIds } = useScene.getState()
+      const sceneGraph = { nodes, rootNodeIds } as SceneGraph
+      if (onSaveRef.current) {
+        onSaveRef.current(sceneGraph).catch(() => {})
+      } else {
+        saveSceneToLocalStorage(sceneGraph)
+      }
+      hasDirtyChangesRef.current = false
+    }
+
+    window.addEventListener('beforeunload', flushOnExit)
+
+    return () => {
+      executeSaveRef.current = null
+      window.removeEventListener('beforeunload', flushOnExit)
+      if (saveTimeoutRef.current) clearTimeout(saveTimeoutRef.current)
+      flushOnExit()
+      unsubscribe()
+    }
+  }, [setSaveStatus])
+
+  // Handle version preview mode transitions
+  useEffect(() => {
+    if (isVersionPreviewMode) {
+      if (saveTimeoutRef.current) {
+        clearTimeout(saveTimeoutRef.current)
+        saveTimeoutRef.current = undefined
+      }
+      if (hasDirtyChangesRef.current) {
+        pendingSaveRef.current = true
+      }
+      setSaveStatus('paused')
+      return
+    }
+
+    if (isSavingRef.current) return
+
+    if (hasDirtyChangesRef.current) {
+      setSaveStatus('pending')
+      if (!saveTimeoutRef.current) {
+        saveTimeoutRef.current = setTimeout(() => {
+          saveTimeoutRef.current = undefined
+          executeSaveRef.current?.()
+        }, AUTOSAVE_DEBOUNCE_MS)
+      }
+      return
+    }
+
+    setSaveStatus('saved')
+  }, [isVersionPreviewMode, setSaveStatus])
+
+  return { saveStatus, isLoadingSceneRef }
+}

package/src/hooks/use-contextual-tools.ts

@@ -0,0 +1,52 @@
+import { type AnyNodeId, useScene } from '@pascal-app/core'
+import { useViewer } from '@pascal-app/viewer'
+import { useMemo } from 'react'
+import useEditor, { type StructureTool } from '../store/use-editor'
+
+export function useContextualTools() {
+  const selection = useViewer((s) => s.selection)
+  const nodes = useScene((s) => s.nodes)
+  const phase = useEditor((s) => s.phase)
+  const structureLayer = useEditor((s) => s.structureLayer)
+
+  return useMemo(() => {
+    // If we are in the zones layer, only zone tool is relevant
+    if (structureLayer === 'zones') {
+      return ['zone'] as StructureTool[]
+    }
+
+    // Default tools when nothing is selected
+    const defaultTools: StructureTool[] = ['wall', 'slab', 'ceiling', 'roof', 'door', 'window']
+
+    if (selection.selectedIds.length === 0) {
+      return defaultTools
+    }
+
+    // Get types of selected nodes
+    const selectedTypes = new Set(
+      selection.selectedIds.map((id) => nodes[id as AnyNodeId]?.type).filter(Boolean),
+    )
+
+    // If a wall is selected, prioritize wall-hosted elements
+    if (selectedTypes.has('wall')) {
+      return ['window', 'door', 'wall'] as StructureTool[]
+    }
+
+    // If a slab is selected, prioritize slab editing
+    if (selectedTypes.has('slab')) {
+      return ['slab', 'wall'] as StructureTool[]
+    }
+
+    // If a ceiling is selected, prioritize ceiling editing
+    if (selectedTypes.has('ceiling')) {
+      return ['ceiling'] as StructureTool[]
+    }
+
+    // If a roof is selected, prioritize roof editing
+    if (selectedTypes.has('roof')) {
+      return ['roof'] as StructureTool[]
+    }
+
+    return defaultTools
+  }, [selection.selectedIds, nodes, structureLayer])
+}

package/src/hooks/use-grid-events.ts

@@ -0,0 +1,106 @@
+import { type EventSuffix, emitter, type GridEvent } from '@pascal-app/core'
+import { useViewer } from '@pascal-app/viewer'
+import { useThree } from '@react-three/fiber'
+import { useEffect, useRef } from 'react'
+import { Plane, Raycaster, Vector2, Vector3 } from 'three'
+
+/**
+ * Custom grid events hook that uses manual raycasting instead of mesh events.
+ * This ensures grid events work even when other meshes block pointer events with stopPropagation.
+ */
+export function useGridEvents(gridY: number) {
+  const { camera, gl } = useThree()
+  const raycaster = useRef(new Raycaster())
+  const pointer = useRef(new Vector2())
+  const groundPlane = useRef(new Plane(new Vector3(0, 1, 0), 0))
+  const intersectionPoint = useRef(new Vector3())
+
+  // Update ground plane when grid Y changes
+  useEffect(() => {
+    groundPlane.current.constant = -gridY
+  }, [gridY])
+
+  useEffect(() => {
+    const canvas = gl.domElement
+
+    const getIntersection = (nativeEvent: MouseEvent | PointerEvent): Vector3 | null => {
+      // Convert mouse position to normalized device coordinates (-1 to +1)
+      const rect = canvas.getBoundingClientRect()
+      pointer.current.x = ((nativeEvent.clientX - rect.left) / rect.width) * 2 - 1
+      pointer.current.y = -((nativeEvent.clientY - rect.top) / rect.height) * 2 + 1
+
+      // Update raycaster
+      raycaster.current.setFromCamera(pointer.current, camera)
+
+      // Intersect with ground plane
+      if (raycaster.current.ray.intersectPlane(groundPlane.current, intersectionPoint.current)) {
+        return intersectionPoint.current.clone()
+      }
+
+      return null
+    }
+
+    const emit = (suffix: EventSuffix, nativeEvent: MouseEvent | PointerEvent) => {
+      const point = getIntersection(nativeEvent)
+      if (!point) return
+
+      const eventKey = `grid:${suffix}` as `grid:${EventSuffix}`
+      const payload: GridEvent = {
+        position: [point.x, point.y, point.z],
+        nativeEvent: nativeEvent as any, // Type compatibility with ThreeEvent
+      }
+
+      emitter.emit(eventKey, payload)
+    }
+
+    const handlePointerDown = (e: PointerEvent) => {
+      if (useViewer.getState().cameraDragging) return
+      if (e.button !== 0) return
+      emit('pointerdown', e)
+    }
+
+    const handlePointerUp = (e: PointerEvent) => {
+      if (useViewer.getState().cameraDragging) return
+      if (e.button !== 0) return
+      emit('pointerup', e)
+    }
+
+    const handleClick = (e: PointerEvent) => {
+      if (useViewer.getState().cameraDragging) return
+      if (e.button !== 0) return
+      emit('click', e)
+    }
+
+    const handlePointerMove = (e: PointerEvent) => {
+      // Emit move even if camera is dragging, so tools like PolygonEditor still work
+      emit('move', e)
+    }
+
+    const handleDoubleClick = (e: MouseEvent) => {
+      if (useViewer.getState().cameraDragging) return
+      emit('double-click', e)
+    }
+
+    const handleContextMenu = (e: MouseEvent) => {
+      if (useViewer.getState().cameraDragging) return
+      emit('context-menu', e)
+    }
+
+    // Attach listeners to canvas
+    canvas.addEventListener('pointerdown', handlePointerDown)
+    canvas.addEventListener('pointerup', handlePointerUp)
+    canvas.addEventListener('click', handleClick)
+    canvas.addEventListener('pointermove', handlePointerMove)
+    canvas.addEventListener('dblclick', handleDoubleClick)
+    canvas.addEventListener('contextmenu', handleContextMenu)
+
+    return () => {
+      canvas.removeEventListener('pointerdown', handlePointerDown)
+      canvas.removeEventListener('pointerup', handlePointerUp)
+      canvas.removeEventListener('click', handleClick)
+      canvas.removeEventListener('pointermove', handlePointerMove)
+      canvas.removeEventListener('dblclick', handleDoubleClick)
+      canvas.removeEventListener('contextmenu', handleContextMenu)
+    }
+  }, [camera, gl])
+}

package/src/hooks/use-keyboard.ts

@@ -0,0 +1,214 @@
+import { type AnyNodeId, emitter, useScene } from '@pascal-app/core'
+import { useViewer } from '@pascal-app/viewer'
+import { useEffect } from 'react'
+import { sfxEmitter } from '../lib/sfx-bus'
+import useEditor from '../store/use-editor'
+
+// Tools call this in their onCancel handler when they have an active mid-action to cancel,
+// so that the global Escape handler knows not to also switch to select mode.
+let _toolCancelConsumed = false
+export const markToolCancelConsumed = () => {
+  _toolCancelConsumed = true
+}
+
+export const useKeyboard = ({ isVersionPreviewMode = false } = {}) => {
+  useEffect(() => {
+    const handleKeyDown = (e: KeyboardEvent) => {
+      // Don't handle shortcuts if user is typing in an input
+      if (e.target instanceof HTMLInputElement || e.target instanceof HTMLTextAreaElement) {
+        return
+      }
+
+      if (e.key === 'Escape') {
+        // If in walkthrough mode, let WalkthroughControls handle ESC
+        if (useViewer.getState().walkthroughMode) return
+
+        e.preventDefault()
+        _toolCancelConsumed = false
+        emitter.emit('tool:cancel')
+
+        // Only switch to select mode if no tool had an active mid-action to cancel.
+        // (e.g. mid-wall draw or mid-slab polygon should only cancel the action, not exit the tool)
+        if (!_toolCancelConsumed) {
+          const currentPhase = useEditor.getState().phase
+          const currentStructureLayer = useEditor.getState().structureLayer
+
+          useEditor.getState().setEditingHole(null)
+
+          // From zone mode, return to structure select
+          if (currentPhase === 'structure' && currentStructureLayer === 'zones') {
+            useEditor.getState().setStructureLayer('elements')
+            useEditor.getState().setMode('select')
+          } else {
+            // Return to the default select tool while keeping the active building/level context.
+            useEditor.getState().setMode('select')
+          }
+
+          useEditor.getState().setFloorplanSelectionTool('click')
+
+          // Clear selections to close UI panels, but KEEP the active building and level context.
+          useViewer.getState().setSelection({ selectedIds: [], zoneId: null })
+          useEditor.getState().setSelectedReferenceId(null)
+        }
+      } else if (e.key === '1' && !e.metaKey && !e.ctrlKey) {
+        e.preventDefault()
+        useEditor.getState().setPhase('site')
+        useEditor.getState().setMode('select')
+      } else if (e.key === '2' && !e.metaKey && !e.ctrlKey) {
+        e.preventDefault()
+        useEditor.getState().setPhase('structure')
+        useEditor.getState().setMode('select')
+      } else if (e.key === '3' && !e.metaKey && !e.ctrlKey) {
+        e.preventDefault()
+        useEditor.getState().setPhase('furnish')
+        useEditor.getState().setMode('select')
+      } else if (e.key === 'f' && !e.metaKey && !e.ctrlKey) {
+        if (isVersionPreviewMode) return
+        e.preventDefault()
+        useEditor.getState().setPhase('furnish')
+        useEditor.getState().setMode('build')
+      } else if (e.key === 'z' && !e.metaKey && !e.ctrlKey) {
+        if (isVersionPreviewMode) return
+        e.preventDefault()
+        useEditor.getState().setPhase('structure')
+        useEditor.getState().setStructureLayer('zones')
+        useEditor.getState().setMode('build')
+      }
+      if (e.key === 'v' && !e.metaKey && !e.ctrlKey) {
+        e.preventDefault()
+        useEditor.getState().setMode('select')
+        useEditor.getState().setFloorplanSelectionTool('click')
+      } else if (e.key === 'b' && !e.metaKey && !e.ctrlKey) {
+        if (isVersionPreviewMode) return
+        e.preventDefault()
+        useEditor.getState().setPhase('structure')
+        useEditor.getState().setStructureLayer('elements')
+        useEditor.getState().setMode('build')
+      } else if (e.key === 'z' && (e.metaKey || e.ctrlKey)) {
+        if (isVersionPreviewMode) return
+        e.preventDefault()
+        useScene.temporal.getState().undo()
+      } else if (e.key === 'Z' && e.shiftKey && (e.metaKey || e.ctrlKey)) {
+        if (isVersionPreviewMode) return
+        e.preventDefault()
+        useScene.temporal.getState().redo()
+      } else if (e.key === 'ArrowUp' && (e.metaKey || e.ctrlKey)) {
+        e.preventDefault()
+        const { buildingId, levelId } = useViewer.getState().selection
+        if (buildingId) {
+          const building = useScene.getState().nodes[buildingId]
+          if (building && building.type === 'building' && building.children.length > 0) {
+            const currentIdx = levelId ? building.children.indexOf(levelId as any) : -1
+            const nextIdx = currentIdx < building.children.length - 1 ? currentIdx + 1 : currentIdx
+            if (nextIdx !== -1 && nextIdx !== currentIdx) {
+              useViewer.getState().setSelection({ levelId: building.children[nextIdx] as any })
+            } else if (currentIdx === -1) {
+              useViewer.getState().setSelection({ levelId: building.children[0] as any })
+            }
+          }
+        }
+      } else if (e.key === 'ArrowDown' && (e.metaKey || e.ctrlKey)) {
+        e.preventDefault()
+        const { buildingId, levelId } = useViewer.getState().selection
+        if (buildingId) {
+          const building = useScene.getState().nodes[buildingId]
+          if (building && building.type === 'building' && building.children.length > 0) {
+            const currentIdx = levelId ? building.children.indexOf(levelId as any) : -1
+            const prevIdx = currentIdx > 0 ? currentIdx - 1 : currentIdx
+            if (prevIdx !== -1 && prevIdx !== currentIdx) {
+              useViewer.getState().setSelection({ levelId: building.children[prevIdx] as any })
+            } else if (currentIdx === -1) {
+              useViewer
+                .getState()
+                .setSelection({ levelId: building.children[building.children.length - 1] as any })
+            }
+          }
+        }
+      } else if ((e.key === 'r' || e.key === 'R') && !isVersionPreviewMode) {
+        // Rotate selected node clockwise if it supports rotation (items, roofs, etc.)
+        const selectedNodeIds = useViewer.getState().selection.selectedIds as AnyNodeId[]
+        if (selectedNodeIds.length === 1) {
+          const node = useScene.getState().nodes[selectedNodeIds[0]!]
+          if (node && 'rotation' in node) {
+            e.preventDefault()
+            const ROTATION_STEP = Math.PI / 4
+
+            // Handle different rotation types (number for roof, array for items/windows/doors)
+            if (typeof node.rotation === 'number') {
+              useScene.getState().updateNode(node.id, { rotation: node.rotation + ROTATION_STEP })
+            } else if (Array.isArray(node.rotation)) {
+              useScene.getState().updateNode(node.id, {
+                rotation: [node.rotation[0], node.rotation[1] + ROTATION_STEP, node.rotation[2]],
+              })
+            }
+            sfxEmitter.emit('sfx:item-rotate')
+          }
+        }
+      } else if ((e.key === 't' || e.key === 'T') && !isVersionPreviewMode) {
+        // Rotate selected node counter-clockwise
+        const selectedNodeIds = useViewer.getState().selection.selectedIds as AnyNodeId[]
+        if (selectedNodeIds.length === 1) {
+          const node = useScene.getState().nodes[selectedNodeIds[0]!]
+          if (node && 'rotation' in node) {
+            e.preventDefault()
+            const ROTATION_STEP = Math.PI / 4
+
+            if (typeof node.rotation === 'number') {
+              useScene.getState().updateNode(node.id, { rotation: node.rotation - ROTATION_STEP })
+            } else if (Array.isArray(node.rotation)) {
+              useScene.getState().updateNode(node.id, {
+                rotation: [node.rotation[0], node.rotation[1] - ROTATION_STEP, node.rotation[2]],
+              })
+            }
+            sfxEmitter.emit('sfx:item-rotate')
+          }
+        }
+      } else if ((e.key === 'Delete' || e.key === 'Backspace') && !isVersionPreviewMode) {
+        e.preventDefault()
+
+        // Check for a selected reference (guide/scan) first
+        const selectedRefId = useEditor.getState().selectedReferenceId
+        if (selectedRefId) {
+          const refNode = useScene.getState().nodes[selectedRefId as AnyNodeId]
+          if (refNode && (refNode.type === 'guide' || refNode.type === 'scan')) {
+            sfxEmitter.emit('sfx:structure-delete')
+            useScene.getState().deleteNode(selectedRefId as AnyNodeId)
+            useEditor.getState().setSelectedReferenceId(null)
+            return
+          }
+        }
+
+        // Delete selected zone
+        const selectedZoneId = useViewer.getState().selection.zoneId
+        if (selectedZoneId) {
+          sfxEmitter.emit('sfx:structure-delete')
+          useScene.getState().deleteNode(selectedZoneId as AnyNodeId)
+          useViewer.getState().setSelection({ zoneId: null })
+          return
+        }
+
+        const selectedNodeIds = useViewer.getState().selection.selectedIds as AnyNodeId[]
+
+        if (selectedNodeIds.length > 0) {
+          // Play appropriate SFX based on what's being deleted
+          if (selectedNodeIds.length === 1) {
+            const node = useScene.getState().nodes[selectedNodeIds[0]!]
+            if (node?.type === 'item') {
+              sfxEmitter.emit('sfx:item-delete')
+            } else {
+              sfxEmitter.emit('sfx:structure-delete')
+            }
+          } else {
+            sfxEmitter.emit('sfx:structure-delete')
+          }
+
+          useScene.getState().deleteNodes(selectedNodeIds)
+        }
+      }
+    }
+    window.addEventListener('keydown', handleKeyDown)
+    return () => window.removeEventListener('keydown', handleKeyDown)
+  }, [isVersionPreviewMode])
+
+  return null
+}

package/src/hooks/use-mobile.ts

@@ -0,0 +1,19 @@
+import * as React from 'react'
+
+const MOBILE_BREAKPOINT = 768
+
+export function useIsMobile() {
+  const [isMobile, setIsMobile] = React.useState<boolean | undefined>(undefined)
+
+  React.useEffect(() => {
+    const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`)
+    const onChange = () => {
+      setIsMobile(window.innerWidth < MOBILE_BREAKPOINT)
+    }
+    mql.addEventListener('change', onChange)
+    setIsMobile(window.innerWidth < MOBILE_BREAKPOINT)
+    return () => mql.removeEventListener('change', onChange)
+  }, [])
+
+  return !!isMobile
+}

package/src/hooks/use-reduced-motion.ts

@@ -0,0 +1,20 @@
+import { useEffect, useState } from 'react'
+
+/**
+ * Returns true when the user has requested reduced motion via OS settings.
+ * Useful for disabling animations (WCAG 2.3.3).
+ */
+export function useReducedMotion(): boolean {
+  const [reducedMotion, setReducedMotion] = useState(false)
+
+  useEffect(() => {
+    const mql = window.matchMedia('(prefers-reduced-motion: reduce)')
+    setReducedMotion(mql.matches)
+
+    const handler = (e: MediaQueryListEvent) => setReducedMotion(e.matches)
+    mql.addEventListener('change', handler)
+    return () => mql.removeEventListener('change', handler)
+  }, [])
+
+  return reducedMotion
+}

package/src/index.tsx

@@ -0,0 +1,33 @@
+export type { EditorProps } from './components/editor'
+export { default as Editor } from './components/editor'
+export { useCommandPalette } from './components/ui/command-palette'
+export { SliderControl } from './components/ui/controls/slider-control'
+export { FloatingLevelSelector } from './components/ui/floating-level-selector'
+export { CATALOG_ITEMS } from './components/ui/item-catalog/catalog-items'
+export { useSidebarStore } from './components/ui/primitives/sidebar'
+export { Slider } from './components/ui/primitives/slider'
+export { SceneLoader } from './components/ui/scene-loader'
+export type { ExtraPanel } from './components/ui/sidebar/icon-rail'
+export {
+  type ProjectVisibility,
+  SettingsPanel,
+  type SettingsPanelProps,
+} from './components/ui/sidebar/panels/settings-panel'
+export type { SitePanelProps } from './components/ui/sidebar/panels/site-panel'
+export type { SidebarTab } from './components/ui/sidebar/tab-bar'
+export type { PresetsAdapter, PresetsTab } from './contexts/presets-context'
+export { PresetsProvider } from './contexts/presets-context'
+export type { SaveStatus } from './hooks/use-auto-save'
+export type { SceneGraph } from './lib/scene'
+export { applySceneGraphToEditor } from './lib/scene'
+export { default as useAudio } from './store/use-audio'
+export { type CommandAction, useCommandRegistry } from './store/use-command-registry'
+export type { FloorplanSelectionTool, SplitOrientation, ViewMode } from './store/use-editor'
+export { default as useEditor } from './store/use-editor'
+export {
+  type PaletteView,
+  type PaletteViewProps,
+  usePaletteViewRegistry,
+} from './store/use-palette-view-registry'
+export { useUploadStore } from './store/use-upload'
+export { ViewerToolbarLeft, ViewerToolbarRight } from './components/ui/viewer-toolbar'

package/src/lib/constants.ts

@@ -0,0 +1,3 @@
+/** Three.js layer used for editor-only objects (helpers, grid, polygon editors).
+ *  The thumbnail camera renders only layer 0, so these are excluded from thumbnails. */
+export const EDITOR_LAYER = 1

package/src/lib/level-selection.ts

@@ -0,0 +1,31 @@
+import type { AnyNodeId, BuildingNode, LevelNode } from '@pascal-app/core'
+import { useScene } from '@pascal-app/core'
+import { useViewer } from '@pascal-app/viewer'
+
+function getAdjacentLevelIdForDeletion(levelId: AnyNodeId): LevelNode['id'] | null {
+  const { nodes } = useScene.getState()
+  const level = nodes[levelId]
+  if (!level || level.type !== 'level' || !level.parentId) return null
+
+  const building = nodes[level.parentId as AnyNodeId]
+  if (!building || building.type !== 'building') return null
+
+  const siblingLevelIds = (building as BuildingNode).children.filter(
+    (childId): childId is LevelNode['id'] => nodes[childId as AnyNodeId]?.type === 'level',
+  )
+  const currentIndex = siblingLevelIds.indexOf(level.id)
+  if (currentIndex === -1) return null
+
+  return siblingLevelIds[currentIndex - 1] ?? siblingLevelIds[currentIndex + 1] ?? null
+}
+
+export function deleteLevelWithFallbackSelection(levelId: AnyNodeId) {
+  const isSelectedLevel = useViewer.getState().selection.levelId === levelId
+  const nextLevelId = getAdjacentLevelIdForDeletion(levelId)
+
+  useScene.getState().deleteNode(levelId)
+
+  if (isSelectedLevel) {
+    useViewer.getState().setSelection({ levelId: nextLevelId })
+  }
+}