@pascal-app/editor 0.7.0 → 0.9.1

package/src/components/tools/ceiling/move-ceiling-tool.tsx

@@ -1,257 +0,0 @@
-'use client'
-
-import { type AnyNodeId, emitter, type GridEvent, useScene, type CeilingNode } from '@pascal-app/core'
-import { useViewer } from '@pascal-app/viewer'
-import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
-import { markToolCancelConsumed } from '../../../hooks/use-keyboard'
-import { sfxEmitter } from '../../../lib/sfx-bus'
-import useEditor from '../../../store/use-editor'
-import { CursorSphere } from '../shared/cursor-sphere'
-import { BufferGeometry, DoubleSide, Path, Shape, ShapeGeometry, Vector3 } from 'three'
-
-function snap(value: number) {
-  return Math.round(value * 2) / 2
-}
-
-function translatePolygon(
-  polygon: Array<[number, number]>,
-  deltaX: number,
-  deltaZ: number,
-): Array<[number, number]> {
-  return polygon.map(([x, z]) => [x + deltaX, z + deltaZ] as [number, number])
-}
-
-function getPolygonCenter(polygon: Array<[number, number]>): [number, number] {
-  if (polygon.length === 0) return [0, 0]
-  let sumX = 0
-  let sumZ = 0
-  for (const [x, z] of polygon) {
-    sumX += x
-    sumZ += z
-  }
-  return [sumX / polygon.length, sumZ / polygon.length]
-}
-
-export const MoveCeilingTool: React.FC<{ node: CeilingNode }> = ({ node }) => {
-  const activatedAtRef = useRef<number>(Date.now())
-  const originalPolygonRef = useRef(node.polygon.map(([x, z]) => [x, z] as [number, number]))
-  const originalHolesRef = useRef(
-    (node.holes ?? []).map((hole) => hole.map(([x, z]) => [x, z] as [number, number])),
-  )
-  const dragAnchorRef = useRef<[number, number] | null>(null)
-  const previousGridPosRef = useRef<[number, number] | null>(null)
-  const previousCursorPosRef = useRef<[number, number, number] | null>(null)
-  const previousDeltaRef = useRef<[number, number] | null>(null)
-  const previewRef = useRef<{
-    polygon: Array<[number, number]>
-    holes: Array<Array<[number, number]>>
-  } | null>(null)
-
-  const [cursorLocalPos, setCursorLocalPos] = useState<[number, number, number]>(() => {
-    const center = getPolygonCenter(node.polygon)
-    return [center[0], node.height ?? 2.5, center[1]]
-  })
-  const [previewPolygon, setPreviewPolygon] = useState<Array<[number, number]>>(node.polygon)
-  const [previewHoles, setPreviewHoles] = useState<Array<Array<[number, number]>>>(node.holes ?? [])
-
-  const exitMoveMode = useCallback(() => {
-    useEditor.getState().setMovingNode(null)
-  }, [])
-
-  useEffect(() => {
-    const originalPolygon = originalPolygonRef.current
-    const originalHoles = originalHolesRef.current
-
-    useScene.temporal.getState().pause()
-    let wasCommitted = false
-
-    const applyPreview = (
-      polygon: Array<[number, number]>,
-      holes: Array<Array<[number, number]>>,
-    ) => {
-      previewRef.current = { polygon, holes }
-      setPreviewPolygon(polygon)
-      setPreviewHoles(holes)
-      const center = getPolygonCenter(polygon)
-      const nextCursorPos: [number, number, number] = [center[0], node.height ?? 2.5, center[1]]
-      if (
-        !previousCursorPosRef.current ||
-        previousCursorPosRef.current[0] !== nextCursorPos[0] ||
-        previousCursorPosRef.current[1] !== nextCursorPos[1] ||
-        previousCursorPosRef.current[2] !== nextCursorPos[2]
-      ) {
-        previousCursorPosRef.current = nextCursorPos
-        setCursorLocalPos(nextCursorPos)
-      }
-      useScene.getState().updateNode(node.id, { polygon, holes })
-      useScene.getState().markDirty(node.id as AnyNodeId)
-    }
-
-    const restoreOriginal = () => {
-      setPreviewPolygon(originalPolygon)
-      setPreviewHoles(originalHoles)
-      useScene.getState().updateNode(node.id, {
-        holes: originalHoles,
-        polygon: originalPolygon,
-      })
-      useScene.getState().markDirty(node.id as AnyNodeId)
-    }
-
-    const onGridMove = (event: GridEvent) => {
-      const localX = snap(event.localPosition[0])
-      const localZ = snap(event.localPosition[2])
-
-      if (
-        previousGridPosRef.current &&
-        (localX !== previousGridPosRef.current[0] || localZ !== previousGridPosRef.current[1])
-      ) {
-        sfxEmitter.emit('sfx:grid-snap')
-      }
-      previousGridPosRef.current = [localX, localZ]
-
-      const anchor = dragAnchorRef.current ?? [localX, localZ]
-      dragAnchorRef.current = anchor
-
-      const deltaX = localX - anchor[0]
-      const deltaZ = localZ - anchor[1]
-
-      if (
-        previousDeltaRef.current &&
-        previousDeltaRef.current[0] === deltaX &&
-        previousDeltaRef.current[1] === deltaZ
-      ) {
-        return
-      }
-      previousDeltaRef.current = [deltaX, deltaZ]
-
-      applyPreview(
-        translatePolygon(originalPolygon, deltaX, deltaZ),
-        originalHoles.map((hole) => translatePolygon(hole, deltaX, deltaZ)),
-      )
-    }
-
-    const onGridClick = (event: GridEvent) => {
-      if (Date.now() - activatedAtRef.current < 150) {
-        event.nativeEvent?.stopPropagation?.()
-        return
-      }
-
-      const preview = previewRef.current ?? { polygon: originalPolygon, holes: originalHoles }
-
-      wasCommitted = true
-
-      // Restore original baseline while paused so the next resume+update
-      // registers as a single tracked change (undo reverts to original).
-      useScene.getState().updateNode(node.id, {
-        polygon: originalPolygon,
-        holes: originalHoles,
-      })
-
-      useScene.temporal.getState().resume()
-      useScene.getState().updateNode(node.id, preview)
-      useScene.getState().markDirty(node.id as AnyNodeId)
-      useScene.temporal.getState().pause()
-
-      sfxEmitter.emit('sfx:item-place')
-      useViewer.getState().setSelection({ selectedIds: [node.id] })
-      exitMoveMode()
-      event.nativeEvent?.stopPropagation?.()
-    }
-
-    const onCancel = () => {
-      restoreOriginal()
-      useViewer.getState().setSelection({ selectedIds: [node.id] })
-      useScene.temporal.getState().resume()
-      markToolCancelConsumed()
-      exitMoveMode()
-    }
-
-    emitter.on('grid:move', onGridMove)
-    emitter.on('grid:click', onGridClick)
-    emitter.on('tool:cancel', onCancel)
-
-    return () => {
-      if (!wasCommitted) {
-        restoreOriginal()
-      }
-      useScene.temporal.getState().resume()
-      emitter.off('grid:move', onGridMove)
-      emitter.off('grid:click', onGridClick)
-      emitter.off('tool:cancel', onCancel)
-    }
-  }, [exitMoveMode, node.height, node.id])
-
-  const previewFillGeometry = useMemo(
-    () => createCeilingPreviewGeometry(previewPolygon, previewHoles),
-    [previewHoles, previewPolygon],
-  )
-
-  const previewOutlineGeometry = useMemo(
-    () => createCeilingOutlineGeometry(previewPolygon),
-    [previewPolygon],
-  )
-
-  return (
-    <group>
-      <mesh geometry={previewFillGeometry} position={[0, (node.height ?? 2.5) + 0.012, 0]}>
-        <meshBasicMaterial
-          color="#f5f5f4"
-          depthWrite={false}
-          opacity={0.3}
-          side={DoubleSide}
-          transparent
-        />
-      </mesh>
-      <line geometry={previewOutlineGeometry} position={[0, (node.height ?? 2.5) + 0.02, 0]}>
-        <lineBasicMaterial color="#ffffff" depthWrite={false} opacity={0.95} transparent />
-      </line>
-      <CursorSphere position={cursorLocalPos} showTooltip={false} />
-    </group>
-  )
-}
-
-function createCeilingPreviewGeometry(
-  polygon: Array<[number, number]>,
-  holes: Array<Array<[number, number]>>,
-): BufferGeometry {
-  if (polygon.length < 3) return new BufferGeometry()
-
-  const shape = new Shape()
-  const [firstX, firstZ] = polygon[0]!
-  shape.moveTo(firstX, -firstZ)
-
-  for (let i = 1; i < polygon.length; i++) {
-    const [x, z] = polygon[i]!
-    shape.lineTo(x, -z)
-  }
-  shape.closePath()
-
-  for (const holePolygon of holes) {
-    if (holePolygon.length < 3) continue
-    const hole = new Path()
-    const [hx, hz] = holePolygon[0]!
-    hole.moveTo(hx, -hz)
-    for (let i = 1; i < holePolygon.length; i++) {
-      const [x, z] = holePolygon[i]!
-      hole.lineTo(x, -z)
-    }
-    hole.closePath()
-    shape.holes.push(hole)
-  }
-
-  const geometry = new ShapeGeometry(shape)
-  geometry.rotateX(-Math.PI / 2)
-  geometry.computeVertexNormals()
-  return geometry
-}
-
-function createCeilingOutlineGeometry(polygon: Array<[number, number]>): BufferGeometry {
-  const geometry = new BufferGeometry()
-  if (polygon.length < 2) return geometry
-
-  const points = polygon.map(([x, z]) => new Vector3(x, 0, z))
-  const [firstX, firstZ] = polygon[0]!
-  points.push(new Vector3(firstX, 0, firstZ))
-  geometry.setFromPoints(points)
-  return geometry
-}

package/src/components/tools/column/column-tool.tsx

@@ -1,97 +0,0 @@
-import '../../../three-types'
-
-import {
-  COLUMN_PRESETS,
-  ColumnNode,
-  type ColumnNode as ColumnNodeType,
-  type ColumnPresetId,
-  emitter,
-  type GridEvent,
-  type LevelNode,
-  useScene,
-} from '@pascal-app/core'
-import { useEffect, useRef, useState } from 'react'
-import type { Group } from 'three'
-import { sfxEmitter } from '../../../lib/sfx-bus'
-import useEditor from '../../../store/use-editor'
-import { CursorSphere } from '../shared/cursor-sphere'
-
-const COLUMN_ICON = (
-  // eslint-disable-next-line @next/next/no-img-element
-  <img
-    alt="Column"
-    src="/icons/column.png"
-    style={{ width: '100%', height: '100%', objectFit: 'contain' }}
-  />
-)
-
-const roundToHalf = (value: number) => Math.round(value * 2) / 2
-const DEFAULT_COLUMN_PRESET_ID = 'basicPillar' satisfies ColumnPresetId
-
-function createColumnFromPreset(presetId: ColumnPresetId, position: [number, number, number]) {
-  const { label, ...preset } = COLUMN_PRESETS[presetId]
-  return ColumnNode.parse({
-    name: label,
-    position,
-    rotation: 0,
-    ...preset,
-  })
-}
-
-type ColumnToolProps = {
-  currentLevelId: LevelNode['id'] | null
-  onPlaced?: (nodeId: ColumnNodeType['id']) => void
-}
-
-export const ColumnTool: React.FC<ColumnToolProps> = ({ currentLevelId, onPlaced }) => {
-  const [, setCursorPosition] = useState<[number, number, number] | null>(null)
-  const cursorRef = useRef<Group>(null)
-
-  useEffect(() => {
-    if (!currentLevelId) return
-
-    const onGridMove = (event: GridEvent) => {
-      const nextPosition: [number, number, number] = [
-        roundToHalf(event.localPosition[0]),
-        0,
-        roundToHalf(event.localPosition[2]),
-      ]
-      setCursorPosition(nextPosition)
-      cursorRef.current?.position.set(nextPosition[0], event.localPosition[1], nextPosition[2])
-    }
-
-    const onGridClick = (event: GridEvent) => {
-      const position: [number, number, number] = [
-        roundToHalf(event.localPosition[0]),
-        0,
-        roundToHalf(event.localPosition[2]),
-      ]
-      const column = createColumnFromPreset(DEFAULT_COLUMN_PRESET_ID, position)
-      useScene.getState().createNode(column, currentLevelId)
-      onPlaced?.(column.id)
-      sfxEmitter.emit('sfx:structure-build')
-      useEditor.getState().setTool(null)
-      useEditor.getState().setMode('select')
-    }
-
-    emitter.on('grid:move', onGridMove)
-    emitter.on('grid:click', onGridClick)
-
-    return () => {
-      emitter.off('grid:move', onGridMove)
-      emitter.off('grid:click', onGridClick)
-    }
-  }, [currentLevelId, onPlaced])
-
-  if (!currentLevelId) return null
-
-  return (
-    <CursorSphere
-      color="#a78bfa"
-      height={2.8}
-      ref={cursorRef}
-      showTooltip
-      tooltipContent={COLUMN_ICON}
-    />
-  )
-}

package/src/components/tools/column/move-column-tool.tsx

@@ -1,105 +0,0 @@
-import '../../../three-types'
-
-import {
-  type AnyNodeId,
-  ColumnNode,
-  type ColumnNode as ColumnNodeType,
-  emitter,
-  type GridEvent,
-  sceneRegistry,
-  useLiveTransforms,
-  useScene,
-} from '@pascal-app/core'
-import { useCallback, useEffect, useState } from 'react'
-import { markToolCancelConsumed } from '../../../hooks/use-keyboard'
-import { sfxEmitter } from '../../../lib/sfx-bus'
-import useEditor from '../../../store/use-editor'
-import { CursorSphere } from '../shared/cursor-sphere'
-
-const roundToHalf = (value: number) => Math.round(value * 2) / 2
-
-export function MoveColumnTool({ node }: { node: ColumnNodeType }) {
-  const [previewPosition, setPreviewPosition] = useState<[number, number, number]>(node.position)
-
-  const exitMoveMode = useCallback(() => {
-    useEditor.getState().setMovingNode(null)
-  }, [])
-
-  useEffect(() => {
-    useScene.temporal.getState().pause()
-    let committed = false
-
-    const applyPreview = (position: [number, number, number]) => {
-      setPreviewPosition(position)
-      useLiveTransforms.getState().set(node.id, {
-        position,
-        rotation: node.rotation,
-      })
-      sceneRegistry.nodes.get(node.id)?.position.set(position[0], position[1], position[2])
-    }
-
-    const onGridMove = (event: GridEvent) => {
-      applyPreview([roundToHalf(event.localPosition[0]), 0, roundToHalf(event.localPosition[2])])
-    }
-
-    const onGridClick = (event: GridEvent) => {
-      const position: [number, number, number] = [
-        roundToHalf(event.localPosition[0]),
-        0,
-        roundToHalf(event.localPosition[2]),
-      ]
-      const nodeId = (node as { id?: ColumnNodeType['id'] }).id
-
-      if (nodeId && useScene.getState().nodes[nodeId]) {
-        committed = true
-        useLiveTransforms.getState().clear(nodeId)
-        useScene.temporal.getState().resume()
-        useScene.getState().updateNode(nodeId, { position })
-      } else if (node.parentId) {
-        const column = ColumnNode.parse({
-          ...node,
-          id: undefined,
-          metadata: {},
-          position,
-        })
-        committed = true
-        useScene.temporal.getState().resume()
-        useScene.getState().createNode(column, node.parentId as AnyNodeId)
-      }
-
-      useLiveTransforms.getState().clear(node.id)
-      sfxEmitter.emit('sfx:item-place')
-      exitMoveMode()
-      event.nativeEvent?.stopPropagation?.()
-    }
-
-    const onCancel = () => {
-      useLiveTransforms.getState().clear(node.id)
-      sceneRegistry.nodes
-        .get(node.id)
-        ?.position.set(node.position[0], node.position[1], node.position[2])
-      useScene.temporal.getState().resume()
-      markToolCancelConsumed()
-      exitMoveMode()
-    }
-
-    emitter.on('grid:move', onGridMove)
-    emitter.on('grid:click', onGridClick)
-    emitter.on('tool:cancel', onCancel)
-
-    return () => {
-      emitter.off('grid:move', onGridMove)
-      emitter.off('grid:click', onGridClick)
-      emitter.off('tool:cancel', onCancel)
-      useLiveTransforms.getState().clear(node.id)
-      if (!committed) {
-        sceneRegistry.nodes
-          .get(node.id)
-          ?.position.set(node.position[0], node.position[1], node.position[2])
-        useScene.temporal.getState().resume()
-      }
-    }
-  }, [exitMoveMode, node])
-
-  return <CursorSphere color="#a78bfa" height={node.height} position={previewPosition} />
-}

package/src/components/tools/door/door-math.ts

@@ -1,110 +0,0 @@
-import {
-  type AnyNodeId,
-  type DoorNode,
-  getScaledDimensions,
-  type ItemNode,
-  useScene,
-  type WallNode,
-  type WindowNode,
-} from '@pascal-app/core'
-
-/**
- * Converts wall-local (X along wall, Y = height above wall base) to world XYZ.
- */
-export function wallLocalToWorld(
-  wallNode: WallNode,
-  localX: number,
-  localY: number,
-  levelYOffset = 0,
-  slabElevation = 0,
-): [number, number, number] {
-  const wallAngle = Math.atan2(
-    wallNode.end[1] - wallNode.start[1],
-    wallNode.end[0] - wallNode.start[0],
-  )
-  return [
-    wallNode.start[0] + localX * Math.cos(wallAngle),
-    slabElevation + localY + levelYOffset,
-    wallNode.start[1] + localX * Math.sin(wallAngle),
-  ]
-}
-
-/**
- * Clamps door center X so it stays fully within wall bounds.
- * Y is always height/2 — doors sit at floor level.
- */
-export function clampToWall(
-  wallNode: WallNode,
-  localX: number,
-  width: number,
-  height: number,
-): { clampedX: number; clampedY: number } {
-  const dx = wallNode.end[0] - wallNode.start[0]
-  const dz = wallNode.end[1] - wallNode.start[1]
-  const wallLength = Math.sqrt(dx * dx + dz * dz)
-
-  const clampedX = Math.max(width / 2, Math.min(wallLength - width / 2, localX))
-  const clampedY = height / 2 // Doors always sit at floor level
-  return { clampedX, clampedY }
-}
-
-/**
- * Checks if a proposed door position overlaps any existing wall children.
- * Handles item, window, and door types.
- */
-export function hasWallChildOverlap(
-  wallId: string,
-  clampedX: number,
-  clampedY: number,
-  width: number,
-  height: number,
-  ignoreId?: string,
-): boolean {
-  const nodes = useScene.getState().nodes
-  const wallNode = nodes[wallId as AnyNodeId] as WallNode | undefined
-  if (!wallNode) return true
-  const halfW = width / 2
-  const halfH = height / 2
-  const newBottom = clampedY - halfH
-  const newTop = clampedY + halfH
-  const newLeft = clampedX - halfW
-  const newRight = clampedX + halfW
-
-  for (const childId of Array.isArray(wallNode.children) ? wallNode.children : []) {
-    if (childId === ignoreId) continue
-    const child = nodes[childId as AnyNodeId]
-    if (!child) continue
-
-    let childLeft: number, childRight: number, childBottom: number, childTop: number
-
-    if (child.type === 'item') {
-      const item = child as ItemNode
-      if (item.asset.attachTo !== 'wall' && item.asset.attachTo !== 'wall-side') continue
-      const [w, h] = getScaledDimensions(item)
-      childLeft = item.position[0] - w / 2
-      childRight = item.position[0] + w / 2
-      childBottom = item.position[1]
-      childTop = item.position[1] + h
-    } else if (child.type === 'window') {
-      const win = child as WindowNode
-      childLeft = win.position[0] - win.width / 2
-      childRight = win.position[0] + win.width / 2
-      childBottom = win.position[1] - win.height / 2
-      childTop = win.position[1] + win.height / 2
-    } else if (child.type === 'door') {
-      const door = child as DoorNode
-      childLeft = door.position[0] - door.width / 2
-      childRight = door.position[0] + door.width / 2
-      childBottom = door.position[1] - door.height / 2
-      childTop = door.position[1] + door.height / 2
-    } else {
-      continue
-    }
-
-    const xOverlap = newLeft < childRight && newRight > childLeft
-    const yOverlap = newBottom < childTop && newTop > childBottom
-    if (xOverlap && yOverlap) return true
-  }
-
-  return false
-}