@pascal-app/editor 0.6.0 → 0.8.0

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

@@ -0,0 +1,101 @@
+import '../../../three-types'
+
+import {
+  emitter,
+  type GridEvent,
+  type SpawnNode,
+  sceneRegistry,
+  useLiveTransforms,
+  useScene,
+} from '@pascal-app/core'
+import { useCallback, useEffect, useState } from 'react'
+import { Vector3 } from 'three'
+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
+const worldVector = new Vector3()
+
+function getLevelLocalSpawnPosition(node: SpawnNode, event: GridEvent): [number, number, number] {
+  const levelObject = node.parentId ? sceneRegistry.nodes.get(node.parentId) : null
+  if (!levelObject) {
+    return [
+      roundToHalf(event.localPosition[0]),
+      event.localPosition[1],
+      roundToHalf(event.localPosition[2]),
+    ]
+  }
+
+  worldVector.set(event.position[0], event.position[1], event.position[2])
+  levelObject.updateWorldMatrix(true, false)
+  levelObject.worldToLocal(worldVector)
+
+  return [roundToHalf(worldVector.x), worldVector.y, roundToHalf(worldVector.z)]
+}
+
+export const MoveSpawnTool: React.FC<{
+  node: SpawnNode
+  onCommitted?: (nodeId: SpawnNode['id']) => void
+}> = ({ node, onCommitted }) => {
+  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 onGridMove = (event: GridEvent) => {
+      const nextPosition: [number, number, number] = [
+        roundToHalf(event.localPosition[0]),
+        event.localPosition[1],
+        roundToHalf(event.localPosition[2]),
+      ]
+      setPreviewPosition(nextPosition)
+      useLiveTransforms.getState().set(node.id, {
+        position: [...nextPosition],
+        rotation: node.rotation,
+      })
+    }
+
+    const onGridClick = (event: GridEvent) => {
+      const nextPosition = getLevelLocalSpawnPosition(node, event)
+
+      committed = true
+      useScene.temporal.getState().resume()
+      useScene.getState().updateNode(node.id, { position: nextPosition })
+      onCommitted?.(node.id)
+      useLiveTransforms.getState().clear(node.id)
+      sfxEmitter.emit('sfx:item-place')
+      exitMoveMode()
+    }
+
+    const onCancel = () => {
+      useLiveTransforms.getState().clear(node.id)
+      useScene.temporal.getState().resume()
+      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) {
+        useScene.temporal.getState().resume()
+      }
+    }
+  }, [exitMoveMode, node, onCommitted])
+
+  return (
+    <CursorSphere color="#60a5fa" height={2.2} position={previewPosition} showTooltip={false} />
+  )
+}

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

@@ -0,0 +1,130 @@
+import '../../../three-types'
+
+import {
+  emitter,
+  type GridEvent,
+  type LevelNode,
+  SpawnNode,
+  type SpawnNode as SpawnNodeType,
+  sceneRegistry,
+  useScene,
+} from '@pascal-app/core'
+import { useEffect, useRef, useState } from 'react'
+import type { Group } from 'three'
+import { Vector3 } from 'three'
+import { sfxEmitter } from '../../../lib/sfx-bus'
+import useEditor from '../../../store/use-editor'
+import { CursorSphere } from '../shared/cursor-sphere'
+
+const SPAWN_ICON = (
+  // eslint-disable-next-line @next/next/no-img-element
+  <img
+    alt="Spawn Point"
+    src="/icons/site.png"
+    style={{ width: '100%', height: '100%', objectFit: 'contain' }}
+  />
+)
+
+const roundToHalf = (value: number) => Math.round(value * 2) / 2
+const worldVector = new Vector3()
+
+function getExistingSpawnIds() {
+  const nodes = useScene.getState().nodes
+  return Object.values(nodes)
+    .filter((node) => node.type === 'spawn')
+    .map((node) => node.id)
+    .sort()
+}
+
+function getLevelLocalSpawnPosition(
+  levelId: LevelNode['id'],
+  event: GridEvent,
+): [number, number, number] {
+  const levelObject = sceneRegistry.nodes.get(levelId)
+  if (!levelObject) {
+    return [
+      roundToHalf(event.localPosition[0]),
+      event.localPosition[1],
+      roundToHalf(event.localPosition[2]),
+    ]
+  }
+
+  worldVector.set(event.position[0], event.position[1], event.position[2])
+  levelObject.updateWorldMatrix(true, false)
+  levelObject.worldToLocal(worldVector)
+
+  return [roundToHalf(worldVector.x), worldVector.y, roundToHalf(worldVector.z)]
+}
+
+type SpawnToolProps = {
+  currentLevelId: LevelNode['id'] | null
+  onPlaced?: (spawnId: SpawnNodeType['id']) => void
+}
+
+export const SpawnTool: React.FC<SpawnToolProps> = ({ 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]),
+        event.localPosition[1],
+        roundToHalf(event.localPosition[2]),
+      ]
+      setCursorPosition(nextPosition)
+      cursorRef.current?.position.set(nextPosition[0], nextPosition[1], nextPosition[2])
+    }
+
+    const onGridClick = (event: GridEvent) => {
+      const nextPosition = getLevelLocalSpawnPosition(currentLevelId, event)
+
+      const [existingSpawnId, ...duplicateSpawnIds] = getExistingSpawnIds()
+      if (existingSpawnId) {
+        useScene.getState().updateNode(existingSpawnId, {
+          parentId: currentLevelId,
+          position: nextPosition,
+          rotation: 0,
+        })
+        if (duplicateSpawnIds.length > 0) {
+          useScene.getState().deleteNodes(duplicateSpawnIds)
+        }
+        onPlaced?.(existingSpawnId)
+      } else {
+        const spawn = SpawnNode.parse({
+          name: 'Spawn Point',
+          position: nextPosition,
+          rotation: 0,
+        })
+        useScene.getState().createNode(spawn, currentLevelId)
+        onPlaced?.(spawn.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="#60a5fa"
+      height={2.2}
+      ref={cursorRef}
+      showTooltip
+      tooltipContent={SPAWN_ICON}
+    />
+  )
+}

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

@@ -10,6 +10,7 @@ import useEditor, { type Phase, type Tool } from '../../store/use-editor'
 import { CeilingBoundaryEditor } from './ceiling/ceiling-boundary-editor'
 import { CeilingHoleEditor } from './ceiling/ceiling-hole-editor'
 import { CeilingTool } from './ceiling/ceiling-tool'
+import { ColumnTool } from './column/column-tool'
 import { DoorTool } from './door/door-tool'
 import { CurveFenceTool } from './fence/curve-fence-tool'
 import { FenceTool } from './fence/fence-tool'
@@ -21,6 +22,7 @@ import { SiteBoundaryEditor } from './site/site-boundary-editor'
 import { SlabBoundaryEditor } from './slab/slab-boundary-editor'
 import { SlabHoleEditor } from './slab/slab-hole-editor'
 import { SlabTool } from './slab/slab-tool'
+import { SpawnTool } from './spawn/spawn-tool'
 import { StairTool } from './stair/stair-tool'
 import { CurveWallTool } from './wall/curve-wall-tool'
 import { MoveWallEndpointTool } from './wall/move-wall-endpoint-tool'
@@ -43,6 +45,7 @@ const tools: Record<Phase, Partial<Record<Tool, React.FC>>> = {
     door: DoorTool,
     item: ItemTool,
     zone: ZoneTool,
+    spawn: SpawnTool,
     window: WindowTool,
   },
   furnish: {
@@ -61,8 +64,9 @@ export const ToolManager: React.FC = () => {
   const curvingFence = useEditor((state) => state.curvingFence)
   const editingHole = useEditor((state) => state.editingHole)
   const selectedZoneId = useViewer((state) => state.selection.zoneId)
-  const buildingId = useViewer((state) => state.selection.buildingId)
   const selectedIds = useViewer((state) => state.selection.selectedIds)
+  const buildingId = useViewer((state) => state.selection.buildingId)
+  const activeLevelId = useViewer((state) => state.selection.levelId)
   const nodes = useScene((state) => state.nodes)
 
   // Building transform for the local group — all building-relative tools live inside this group
@@ -123,12 +127,15 @@ export const ToolManager: React.FC = () => {
   const showBuildTool = mode === 'build' && tool !== null
 
   const BuildToolComponent = showBuildTool ? tools[phase]?.[tool] : null
+  const handlePlacedNodeSelected = (nodeId: AnyNodeId) => {
+    useViewer.getState().setSelection({ selectedIds: [nodeId] })
+  }
 
   return (
     <>
-      {showSiteBoundaryEditor && <SiteBoundaryEditor />}
       {/* World-space tools: site boundary and building movement operate in world coordinates */}
-      {movingNode?.type === 'building' && <MoveTool />}
+      {showSiteBoundaryEditor && <SiteBoundaryEditor />}
+      {movingNode?.type === 'building' && <MoveTool onSpawnMoved={handlePlacedNodeSelected} />}
 
       {/* Building-local group: all other tools are relative to the selected building.
           Cursor visuals set positions in building-local space; this group applies the
@@ -152,8 +159,16 @@ export const ToolManager: React.FC = () => {
         {movingFenceEndpoint && <MoveFenceEndpointTool target={movingFenceEndpoint} />}
         {curvingWall && <CurveWallTool node={curvingWall} />}
         {curvingFence && <CurveFenceTool node={curvingFence} />}
-        {movingNode && movingNode.type !== 'building' && <MoveTool />}
-        {!movingNode && BuildToolComponent && <BuildToolComponent />}
+        {movingNode && movingNode.type !== 'building' && (
+          <MoveTool onSpawnMoved={handlePlacedNodeSelected} />
+        )}
+        {!movingNode && BuildToolComponent && tool === 'spawn' ? (
+          <SpawnTool currentLevelId={activeLevelId ?? null} onPlaced={handlePlacedNodeSelected} />
+        ) : !movingNode && showBuildTool && tool === 'column' ? (
+          <ColumnTool currentLevelId={activeLevelId ?? null} onPlaced={handlePlacedNodeSelected} />
+        ) : !movingNode && BuildToolComponent && tool !== 'column' ? (
+          <BuildToolComponent />
+        ) : null}
       </group>
     </>
   )

package/src/components/tools/wall/curve-wall-tool.tsx

@@ -81,15 +81,17 @@ export const CurveWallTool: React.FC<{ node: WallNode }> = ({ node }) => {
         ? event.localPosition[2]
         : snapScalarToGrid(event.localPosition[2], snapStep)
 
-      const offsetFromMidpoint =
-        -(
-          (localX - chord.midpoint.x) * chord.normal.x +
-          (localZ - chord.midpoint.y) * chord.normal.y
-        )
+      const offsetFromMidpoint = -(
+        (localX - chord.midpoint.x) * chord.normal.x +
+        (localZ - chord.midpoint.y) * chord.normal.y
+      )
       const snappedOffset = shiftPressedRef.current
         ? offsetFromMidpoint
         : snapScalarToGrid(offsetFromMidpoint, snapStep)
-      const nextCurveOffset = normalizeWallCurveOffset(node, Math.max(-maxCurveOffset, Math.min(maxCurveOffset, snappedOffset)))
+      const nextCurveOffset = normalizeWallCurveOffset(
+        node,
+        Math.max(-maxCurveOffset, Math.min(maxCurveOffset, snappedOffset)),
+      )
 
       if (
         previousCurveOffsetRef.current !== null &&

package/src/components/tools/wall/move-wall-endpoint-tool.tsx

@@ -9,27 +9,87 @@ import {
   useScene,
   type WallNode,
 } from '@pascal-app/core'
-import { Html } from '@react-three/drei'
 import { useViewer } from '@pascal-app/viewer'
+import { Html } from '@react-three/drei'
 import { useCallback, useEffect, useRef, useState } from 'react'
 import { markToolCancelConsumed } from '../../../hooks/use-keyboard'
 import { sfxEmitter } from '../../../lib/sfx-bus'
 import useEditor, { type MovingWallEndpoint } from '../../../store/use-editor'
 import { CursorSphere } from '../shared/cursor-sphere'
 import {
-  isWallLongEnough,
-  snapWallDraftPoint,
-  type WallPlanPoint,
-} from './wall-drafting'
+  formatAngleRadians,
+  getAngleToSegmentReference,
+  getSegmentAngleReferenceAtPoint,
+} from '../shared/segment-angle'
+import { isWallLongEnough, snapWallDraftPoint, type WallPlanPoint } from './wall-drafting'
 
 function samePoint(a: WallPlanPoint, b: WallPlanPoint) {
   return a[0] === b[0] && a[1] === b[1]
 }
 
+type WallSegmentLike = {
+  id: WallNode['id']
+  start: WallPlanPoint
+  end: WallPlanPoint
+  curveOffset?: number
+}
+
+type AngleLabelState = {
+  label: string
+  position: [number, number, number]
+} | null
+
+function getEndpointAngleLabel(args: {
+  preview: { start: WallPlanPoint; end: WallPlanPoint; curveOffset?: number }
+  walls: WallSegmentLike[]
+  nodeId: WallNode['id']
+}): AngleLabelState {
+  const { preview, walls, nodeId } = args
+  const endpoints = [
+    {
+      point: preview.start,
+    },
+    {
+      point: preview.end,
+    },
+  ]
+  const targetSegment: WallSegmentLike = {
+    id: nodeId,
+    start: preview.start,
+    end: preview.end,
+    curveOffset: preview.curveOffset,
+  }
+
+  for (const endpoint of endpoints) {
+    const targetReference = getSegmentAngleReferenceAtPoint(endpoint.point, targetSegment)
+    if (!targetReference) continue
+
+    const connectedWall = walls.find(
+      (wall) =>
+        wall.id !== nodeId && Boolean(getSegmentAngleReferenceAtPoint(endpoint.point, wall)),
+    )
+    if (!connectedWall) continue
+
+    const connectedReference = getSegmentAngleReferenceAtPoint(endpoint.point, connectedWall)
+    if (!connectedReference) continue
+
+    const angle = getAngleToSegmentReference(targetReference.vector, connectedReference)
+    if (angle === null) continue
+
+    return {
+      label: formatAngleRadians(angle),
+      position: [endpoint.point[0], 0.34, endpoint.point[1]],
+    }
+  }
+
+  return null
+}
+
 type LinkedWallSnapshot = {
   id: WallNode['id']
   start: WallPlanPoint
   end: WallPlanPoint
+  curveOffset?: number
 }
 
 function getLinkedWallSnapshots(args: {
@@ -52,10 +112,12 @@ function getLinkedWallSnapshots(args: {
     }
 
     if (
-      !samePoint(node.start, originalStart) &&
-      !samePoint(node.start, originalEnd) &&
-      !samePoint(node.end, originalStart) &&
-      !samePoint(node.end, originalEnd)
+      !(
+        samePoint(node.start, originalStart) ||
+        samePoint(node.start, originalEnd) ||
+        samePoint(node.end, originalStart) ||
+        samePoint(node.end, originalEnd)
+      )
     ) {
       continue
     }
@@ -64,6 +126,7 @@ function getLinkedWallSnapshots(args: {
       id: node.id,
       start: [...node.start] as WallPlanPoint,
       end: [...node.end] as WallPlanPoint,
+      curveOffset: node.curveOffset,
     })
   }
 
@@ -79,6 +142,7 @@ function getLinkedWallUpdates(
 ) {
   return linkedWalls.map((wall) => ({
     id: wall.id,
+    curveOffset: wall.curveOffset,
     start: samePoint(wall.start, originalStart)
       ? nextStart
       : samePoint(wall.start, originalEnd)
@@ -114,6 +178,7 @@ export const MoveWallEndpointTool: React.FC<{ target: MovingWallEndpoint }> = ({
     }),
   )
   const previewRef = useRef<{ start: WallPlanPoint; end: WallPlanPoint } | null>(null)
+  const [angleLabel, setAngleLabel] = useState<AngleLabelState>(null)
 
   const [cursorLocalPos, setCursorLocalPos] = useState<[number, number, number]>(() => {
     const point = target.endpoint === 'start' ? target.wall.start : target.wall.end
@@ -155,24 +220,43 @@ export const MoveWallEndpointTool: React.FC<{ target: MovingWallEndpoint }> = ({
     const applyPreview = (movingPoint: WallPlanPoint, detachLinkedWalls = false) => {
       const nextStart = target.endpoint === 'start' ? movingPoint : fixedPoint
       const nextEnd = target.endpoint === 'end' ? movingPoint : fixedPoint
+      const linkedUpdates = detachLinkedWalls
+        ? []
+        : getLinkedWallUpdates(
+            linkedOriginalsRef.current,
+            originalStart,
+            originalEnd,
+            nextStart,
+            nextEnd,
+          )
       previewRef.current = { start: nextStart, end: nextEnd }
       setCursorLocalPos([movingPoint[0], 0, movingPoint[1]])
-      applyNodePreview([
-        { id: nodeId, start: nextStart, end: nextEnd },
-        ...(detachLinkedWalls
-          ? []
-          : getLinkedWallUpdates(
-              linkedOriginalsRef.current,
-              originalStart,
-              originalEnd,
-              nextStart,
-              nextEnd,
-            )),
-      ])
+      setAngleLabel(
+        getEndpointAngleLabel({
+          preview: { start: nextStart, end: nextEnd, curveOffset: target.wall.curveOffset },
+          walls: [
+            ...levelWalls.map((wall) => ({
+              id: wall.id,
+              start: wall.start,
+              end: wall.end,
+              curveOffset: wall.curveOffset,
+            })),
+            ...linkedUpdates,
+          ],
+          nodeId,
+        }),
+      )
+      applyNodePreview([{ id: nodeId, start: nextStart, end: nextEnd }, ...linkedUpdates])
     }
 
-    const restoreOriginal = () => {
-      applyNodePreview([{ id: nodeId, start: originalStart, end: originalEnd }, ...linkedOriginalsRef.current])
+    const restoreOriginal = (clearAngleLabel = true) => {
+      applyNodePreview([
+        { id: nodeId, start: originalStart, end: originalEnd },
+        ...linkedOriginalsRef.current,
+      ])
+      if (clearAngleLabel) {
+        setAngleLabel(null)
+      }
     }
 
     const onGridMove = (event: GridEvent) => {
@@ -204,8 +288,9 @@ export const MoveWallEndpointTool: React.FC<{ target: MovingWallEndpoint }> = ({
       }
 
       const preview = previewRef.current ?? { start: originalStart, end: originalEnd }
-      const hasChanged =
-        !samePoint(preview.start, originalStart) || !samePoint(preview.end, originalEnd)
+      const hasChanged = !(
+        samePoint(preview.start, originalStart) && samePoint(preview.end, originalEnd)
+      )
 
       if (hasChanged && isWallLongEnough(preview.start, preview.end)) {
         wasCommitted = true
@@ -235,6 +320,7 @@ export const MoveWallEndpointTool: React.FC<{ target: MovingWallEndpoint }> = ({
       }
 
       useViewer.getState().setSelection({ selectedIds: [nodeId] })
+      setAngleLabel(null)
       exitMoveMode()
       event.nativeEvent?.stopPropagation?.()
     }
@@ -243,6 +329,7 @@ export const MoveWallEndpointTool: React.FC<{ target: MovingWallEndpoint }> = ({
       restoreOriginal()
       useViewer.getState().setSelection({ selectedIds: [nodeId] })
       resumeSceneHistory(useScene)
+      setAngleLabel(null)
       markToolCancelConsumed()
       exitMoveMode()
     }
@@ -285,7 +372,7 @@ export const MoveWallEndpointTool: React.FC<{ target: MovingWallEndpoint }> = ({
 
     return () => {
       if (!wasCommitted) {
-        restoreOriginal()
+        restoreOriginal(false)
       }
       resumeSceneHistory(useScene)
       emitter.off('grid:move', onGridMove)
@@ -307,7 +394,7 @@ export const MoveWallEndpointTool: React.FC<{ target: MovingWallEndpoint }> = ({
       >
         <div className="translate-y-10">
           <div
-            className={`whitespace-nowrap rounded-full border px-2 py-1 text-[11px] font-medium shadow-lg backdrop-blur-md transition-colors ${
+            className={`whitespace-nowrap rounded-full border px-2 py-1 font-medium text-[11px] shadow-lg backdrop-blur-md transition-colors ${
               altPressed
                 ? 'border-amber-500/80 bg-amber-500/15 text-amber-100'
                 : 'border-border bg-background/95 text-muted-foreground'
@@ -317,6 +404,23 @@ export const MoveWallEndpointTool: React.FC<{ target: MovingWallEndpoint }> = ({
           </div>
         </div>
       </Html>
+      {angleLabel && <EndpointAngleLabel label={angleLabel.label} position={angleLabel.position} />}
     </group>
   )
 }
+
+function EndpointAngleLabel({
+  label,
+  position,
+}: {
+  label: string
+  position: [number, number, number]
+}) {
+  return (
+    <Html center position={position} style={{ pointerEvents: 'none' }} zIndexRange={[100, 0]}>
+      <div className="whitespace-nowrap rounded-full border border-border bg-background/95 px-2 py-1 font-mono font-semibold text-[11px] text-foreground shadow-lg backdrop-blur-md">
+        {label}
+      </div>
+    </Html>
+  )
+}

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

@@ -63,10 +63,12 @@ function getLinkedWallSnapshots(args: {
     }
 
     if (
-      !samePoint(node.start, originalStart) &&
-      !samePoint(node.start, originalEnd) &&
-      !samePoint(node.end, originalStart) &&
-      !samePoint(node.end, originalEnd)
+      !(
+        samePoint(node.start, originalStart) ||
+        samePoint(node.start, originalEnd) ||
+        samePoint(node.end, originalStart) ||
+        samePoint(node.end, originalEnd)
+      )
     ) {
       continue
     }

package/src/components/tools/wall/wall-drafting.ts

@@ -3,7 +3,10 @@ import {
   type AnyNodeId,
   type DoorNode,
   getScaledDimensions,
+  getWallCurveFrameAt,
+  getWallCurveLength,
   type ItemNode,
+  isCurvedWall,
   useScene,
   type WallNode,
   WallNode as WallSchema,
@@ -62,10 +65,10 @@ export function snapPointTo45Degrees(
   const snappedAngle = Math.round(angle / angleStep) * angleStep
   const distance = Math.sqrt(dx * dx + dz * dz)
 
-  return snapPointToGrid([
-    start[0] + Math.cos(snappedAngle) * distance,
-    start[1] + Math.sin(snappedAngle) * distance,
-  ], step)
+  return snapPointToGrid(
+    [start[0] + Math.cos(snappedAngle) * distance, start[1] + Math.sin(snappedAngle) * distance],
+    step,
+  )
 }
 
 export function getWallAngleSnapStep(step = getWallGridStep()): number {
@@ -336,11 +339,17 @@ export function findWallSnapTarget(
       continue
     }
 
-    const candidates: Array<WallPlanPoint | null> = [
-      wall.start,
-      wall.end,
-      projectPointOntoWall(point, wall),
-    ]
+    const candidates: Array<WallPlanPoint | null> = [wall.start, wall.end]
+
+    if (isCurvedWall(wall)) {
+      const sampleCount = Math.max(8, Math.ceil(getWallCurveLength(wall) / 0.3))
+      for (let index = 0; index <= sampleCount; index += 1) {
+        const frame = getWallCurveFrameAt(wall, index / sampleCount)
+        candidates.push([frame.point.x, frame.point.y])
+      }
+    } else {
+      candidates.push(projectPointOntoWall(point, wall))
+    }
     for (const candidate of candidates) {
       if (!candidate) {
         continue