@pascal-app/editor 1.0.7 → 1.1.1

package/src/components/tools/registry/move-registry-node-tool.tsx

@@ -38,7 +38,7 @@ import {
   useLiveTransforms,
   useScene,
 } from '@pascal-app/core'
-import { useViewer } from '@pascal-app/viewer'
+import { isTypingTarget, useViewer } from '@pascal-app/viewer'
 import { useFrame, useThree } from '@react-three/fiber'
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
 import { type Group, Vector3 } from 'three'
@@ -61,7 +61,6 @@ import {
   surfaceAttachmentUpdates,
   updateSurfaceNode,
 } from '../../../lib/surface-attachment'
-import { isTypingTarget } from '../../../lib/typing-target'
 import useAlignmentGuides from '../../../store/use-alignment-guides'
 import useEditor, {
   getActiveSnappingMode,
@@ -484,6 +483,18 @@ export function MoveRegistryNodeTool({ node: source }: { node: AnyNode }) {
       return Array.isArray(rotation) ? [rotation[0] ?? 0, y, rotation[2] ?? 0] : y
     }
 
+    const resolvePosition = (position: [number, number, number]) => {
+      const nodes = useScene.getState().nodes
+      const current = nodes[node.id] ?? node
+      return (
+        nodeRegistry.get(current.type)?.capabilities?.movable?.resolvePosition?.({
+          node: current,
+          position,
+          nodes,
+        }) ?? position
+      )
+    }
+
     const keepStartingElevation = (position: [number, number, number], yaw: number) => {
       if (!preserveLevelAndElevation) return position
       const rotation = toCommitRotation(yaw)
@@ -534,14 +545,19 @@ export function MoveRegistryNodeTool({ node: source }: { node: AnyNode }) {
     // them through `useLiveNodeOverrides` (transient — no history churn;
     // GeometrySystem merges overrides via getEffectiveNode). Each connected
     // node is re-dirtied so its geometry rebuilds against the new override.
-    const previewConnectivity = (position: [number, number, number], rotationY: number) => {
+    // False, previewing nothing, when the connected joints cannot follow.
+    const previewConnectivity = (
+      position: [number, number, number],
+      rotationY: number,
+    ): boolean => {
       const connectivity = connectivityRef.current
-      if (!connectivity) return
+      if (!connectivity) return true
       const updates = resolveConnectivityUpdates(
         connectivity,
         buildPreviewNode(position, rotationY),
       )
-      if (updates.length === 0) return
+      if (!updates) return false
+      if (updates.length === 0) return true
       useLiveNodeOverrides
         .getState()
         .setMany(updates.map((u) => [u.id, u.data as Record<string, unknown>] as const))
@@ -549,6 +565,7 @@ export function MoveRegistryNodeTool({ node: source }: { node: AnyNode }) {
       for (const u of updates) {
         if (useScene.getState().nodes[u.id]) useScene.getState().markDirty(u.id)
       }
+      return true
     }
 
     const clearConnectivityOverrides = () => {
@@ -1026,7 +1043,11 @@ export function MoveRegistryNodeTool({ node: source }: { node: AnyNode }) {
           },
         ).position
       }
-      position = keepStartingElevation(position, rotationRef.current)
+      position = resolvePosition(keepStartingElevation(position, rotationRef.current))
+      // Carry connected ductwork along (preview only — committed on drop). A
+      // position the connected joints cannot follow holds the last frame,
+      // which is what the drop commits.
+      if (!previewConnectivity(position, rotationRef.current)) return
       const visualPosition = getVisualPosition(position)
       hasMovedRef.current = true
       setCursorPosition(visualPosition)
@@ -1054,8 +1075,6 @@ export function MoveRegistryNodeTool({ node: source }: { node: AnyNode }) {
       })
       syncParentFramePreview(position)
       markMovedNodeDirty()
-      // Carry connected ductwork along (preview only — committed on drop).
-      previewConnectivity(position, rotationRef.current)
 
       const soundStep = {
         coords: [x, z],
@@ -1116,7 +1135,7 @@ export function MoveRegistryNodeTool({ node: source }: { node: AnyNode }) {
       // tool — unless Alt (free place) is held to force placement. Other kinds
       // carry no validity box (`validRef` stays true), so they're never blocked.
       if (!validRef.current && !altRef.current) return
-      const position: [number, number, number] = [...lastCursorRef.current]
+      const position = resolvePosition([...lastCursorRef.current])
 
       const rotation = toCommitRotation(rotationRef.current)
       let committedId = node.id as AnyNodeId
@@ -1171,8 +1190,9 @@ export function MoveRegistryNodeTool({ node: source }: { node: AnyNode }) {
             ? resolveConnectivityUpdates(
                 connectivityRef.current,
                 buildPreviewNode(position, rotationRef.current),
-              ).filter((u) => useScene.getState().nodes[u.id])
+              )?.filter((u) => useScene.getState().nodes[u.id])
             : []
+          if (!connectivityUpdates) return
           const surfaceId = surfaceAttachmentId(effectiveNode)
           itemSurfaceMove?.restore()
           useScene.temporal.getState().resume()
@@ -1298,7 +1318,6 @@ export function MoveRegistryNodeTool({ node: source }: { node: AnyNode }) {
         attachmentRotationRef.current,
       )
       if (nextFreeRotation === null) return
-      sfxEmitter.emit('sfx:item-rotate')
       const hostedPose = itemSurfaceMove?.rotate(nextFreeRotation)
       let position = hostedPose?.position ?? lastCursorRef.current
       if (
@@ -1319,10 +1338,16 @@ export function MoveRegistryNodeTool({ node: source }: { node: AnyNode }) {
         )
         position = canonicalPositionFromPlan(planOrigin[0], position[1], planOrigin[2])
       }
-      position = keepStartingElevation(position, hostedPose?.rotationY ?? nextFreeRotation)
+      const rotationY = hostedPose?.rotationY ?? nextFreeRotation
+      position = keepStartingElevation(position, rotationY)
+      // Rotating the fitting swings its collars — connected ducts follow. A
+      // swing they cannot follow holds the last frame; a surface-hosted node
+      // has already turned with its host, so its drop refuses instead.
+      if (!previewConnectivity(position, rotationY) && !hostedPose) return
+      sfxEmitter.emit('sfx:item-rotate')
       lastCursorRef.current = position
-      freeRotationRef.current = hostedPose?.rotationY ?? nextFreeRotation
-      rotationRef.current = freeRotationRef.current
+      freeRotationRef.current = rotationY
+      rotationRef.current = rotationY
       setCursorRotationY(previewRotationY(rotationRef.current))
       const visualPosition = getVisualPosition(position)
       setCursorPosition(visualPosition)
@@ -1335,8 +1360,6 @@ export function MoveRegistryNodeTool({ node: source }: { node: AnyNode }) {
         })
       syncParentFramePreview(position)
       markMovedNodeDirty()
-      // Rotating the fitting swings its collars — connected ducts follow.
-      previewConnectivity(position, rotationRef.current)
       // Rotation changes the footprint's collision span — re-check validity.
       if (!itemSurfaceMove?.hosted && itemSurfaceMove?.rejection && lastSurfaceEvent)
         onItemMove(lastSurfaceEvent)

package/src/components/tools/shared/cursor-sphere.tsx

@@ -1,4 +1,5 @@
 import { type MessageDescriptor, usePascalI18n } from '@pascal-app/core'
+import { LocalizedHtml as Html } from '@pascal-app/viewer/ui'
 import type { ThreeElements } from '@react-three/fiber'
 import { forwardRef } from 'react'
 import { CircleGeometry, CylinderGeometry, type Group, SphereGeometry } from 'three'
@@ -8,7 +9,6 @@ import { EDITOR_LAYER } from '../../../lib/constants'
 import { wallCursorIcon } from '../../../lib/tool-cursor-icon'
 import useEditor from '../../../store/use-editor'
 import useWallSnapIndicator from '../../../store/use-wall-snap-indicator'
-import { Html } from '../../editor/localized-html'
 
 interface CursorSphereProps extends Omit<ThreeElements['group'], 'ref'> {
   color?: string

package/src/components/tools/shared/draft-measurement-label.tsx

@@ -1,6 +1,6 @@
 'use client'
 
-import { Html } from '../../editor/localized-html'
+import { LocalizedHtml as Html } from '@pascal-app/viewer/ui'
 
 /** Lift of a draft's readout above the top of what it measures, in metres. */
 export const DRAFT_LABEL_Y_OFFSET = 0.22

package/src/components/tools/shared/placement-box.tsx

@@ -2,17 +2,13 @@
 
 import '../../../three-types'
 
+import { formatLinearMeasurement, type LinearUnit, type MetricNotation } from '@pascal-app/core'
+import { LocalizedHtml as Html } from '@pascal-app/viewer/ui'
 import { useEffect, useMemo } from 'react'
 import { PlaneGeometry } from 'three'
 import { distance, smoothstep, uv, vec2 } from 'three/tsl'
 import { LineBasicNodeMaterial, MeshBasicNodeMaterial } from 'three/webgpu'
 import { EDITOR_LAYER } from '../../../lib/constants'
-import {
-  formatLinearMeasurement,
-  type LinearUnit,
-  type MetricNotation,
-} from '../../../lib/measurements'
-import { Html } from '../../editor/localized-html'
 import { createLineGeometry, getBoxEdgePoints } from './placement-box-geometry'
 
 const VALID_COLOR = 0x22_c5_5e // green-500

package/src/components/tools/shared/placement-coordinate-input.tsx

@@ -0,0 +1,94 @@
+'use client'
+
+import { usePascalI18n } from '@pascal-app/core'
+import { type PlacementTypingField, usePlacementTyping } from '../../../store/use-placement-typing'
+
+export type PlacementCoordinateInputProps = {
+  /** What each empty field stands for; defaults to the session's `fieldDefaults`. */
+  placeholders?: readonly string[]
+}
+
+/**
+ * The typed-entry HUD, one box per field of the session. It only displays the
+ * session: keys reach the active tool's own handler (`routePlacementTypingKey`),
+ * so the same HUD can sit in the 3D view and the plan at once without
+ * competing for focus. Clicking a field makes it the active one.
+ */
+export function PlacementCoordinateInput({ placeholders }: PlacementCoordinateInputProps) {
+  const i18n = usePascalI18n()
+  const isActive = usePlacementTyping((state) => state.isActive)
+  const labels = usePlacementTyping((state) => state.labels)
+  const fields = usePlacementTyping((state) => state.fields)
+  const fieldDefaults = usePlacementTyping((state) => state.fieldDefaults)
+  const activeField = usePlacementTyping((state) => state.activeField)
+
+  if (!isActive) return null
+
+  return (
+    <div
+      data-placement-coordinate-entry
+      onClick={(event) => event.stopPropagation()}
+      onPointerDown={(event) => event.stopPropagation()}
+      style={{
+        alignItems: 'center',
+        background: 'rgba(15, 23, 42, 0.94)',
+        border: '1px solid rgba(148, 163, 184, 0.55)',
+        borderRadius: 6,
+        boxShadow: '0 4px 14px rgba(15, 23, 42, 0.28)',
+        color: '#f8fafc',
+        display: 'flex',
+        gap: 6,
+        padding: '5px 7px',
+        pointerEvents: 'auto',
+        userSelect: 'none',
+        whiteSpace: 'nowrap',
+      }}
+    >
+      {labels.map((descriptor, index) => {
+        const field = index as PlacementTypingField
+        const label = i18n._(descriptor)
+        const active = field === activeField
+        const value = fields[field]
+        return (
+          <div
+            data-placement-coordinate-field={descriptor.id}
+            key={descriptor.id}
+            onPointerDown={(event) => {
+              event.stopPropagation()
+              usePlacementTyping.getState().setActiveField(field)
+            }}
+            style={{
+              alignItems: 'center',
+              display: 'flex',
+              flexDirection: 'column',
+              fontFamily: 'ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace',
+              fontSize: 9,
+              gap: 2,
+              textTransform: 'uppercase',
+            }}
+          >
+            <span style={{ color: active ? '#a5b4fc' : '#94a3b8' }}>{label}</span>
+            <span
+              aria-label={label}
+              role="status"
+              style={{
+                background: active ? '#eef2ff' : '#e2e8f0',
+                borderRadius: 3,
+                color: value ? '#0f172a' : '#64748b',
+                fontSize: 12,
+                fontWeight: 600,
+                minWidth: 76,
+                outline: active ? '2px solid #818cf8' : 'none',
+                padding: '3px 5px',
+                textAlign: 'right',
+                textTransform: 'none',
+              }}
+            >
+              {value || placeholders?.[field] || fieldDefaults[field] || '\u00a0'}
+            </span>
+          </div>
+        )
+      })}
+    </div>
+  )
+}

package/src/components/tools/shared/placement-dimension-guides.tsx

@@ -1,13 +1,13 @@
 'use client'
 
 import { useViewer } from '@pascal-app/viewer'
+import { LocalizedHtml as Html } from '@pascal-app/viewer/ui'
 import { useLayoutEffect, useMemo } from 'react'
 import { BufferGeometry, Float32BufferAttribute, Line as ThreeLine } from 'three'
 import { LineBasicNodeMaterial } from 'three/webgpu'
 import { EDITOR_LAYER } from '../../../lib/constants'
 import type { PlacementPreviewDimension } from '../../../store/use-placement-preview'
 import usePlacementPreview from '../../../store/use-placement-preview'
-import { Html } from '../../editor/localized-html'
 import { formatMeasurement } from '../../editor/measurement-pill'
 
 const DIMENSION_COLOR = 0x63_66_f1

package/src/components/tools/shared/segment-angle.ts

@@ -83,10 +83,6 @@ function getCurveTangentAtPoint(point: PlanPoint, segment: SegmentAngleLike): Pl
   return best.tangent
 }
 
-export function formatAngleRadians(angle: number) {
-  return `${Math.round((angle * 180) / Math.PI)}°`
-}
-
 export function getAngleBetweenVectors(first: PlanPoint, second: PlanPoint): number | null {
   const firstLength = Math.hypot(first[0], first[1])
   const secondLength = Math.hypot(second[0], second[1])

package/src/components/tools/site/terrain-brush-cursor.tsx

@@ -10,6 +10,7 @@ import {
   useLiveTerrain,
 } from '@pascal-app/core'
 import { useViewer } from '@pascal-app/viewer'
+import { LocalizedHtml as Html } from '@pascal-app/viewer/ui'
 import { useFrame, useThree } from '@react-three/fiber'
 import { type MutableRefObject, useEffect, useMemo, useRef } from 'react'
 import {
@@ -24,7 +25,6 @@ import { EDITOR_LAYER } from '../../../lib/constants'
 import { sculptFieldForSite, terrainPointInsideSite } from '../../../lib/terrain-sculpt'
 import { brushRingColor } from '../../../lib/terrain-verb-color'
 import useEditor from '../../../store/use-editor'
-import { Html } from '../../editor/localized-html'
 import { formatMeasurement } from '../../editor/measurement-pill'
 
 /** Segments in the cursor ring. 64 reads as a circle at any usable brush size. */

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

@@ -41,7 +41,6 @@ import { FloorRegionControls3D } from '../editor/floor-region-controls'
 import { OpenWallEnds3DLayer } from '../editor/open-wall-ends-3d-layer'
 import { OpeningGuides3DLayer } from '../editor/opening-guides-3d-layer'
 import { WallSnapBeaconLayer } from '../editor/wall-snap-beacon-layer'
-import { ElevatorTool } from './elevator/elevator-tool'
 import { MoveTool } from './item/move-tool'
 import { WallPaintRegionTool } from './paint-region/wall-paint-region-tool'
 import { RegistryToolProvider } from './registry-tool-context'
@@ -305,21 +304,6 @@ export const ToolManager: React.FC = () => {
   const handlePlacedNodeSelected = (nodeId: AnyNodeId) => {
     setSelection({ selectedIds: [nodeId] })
   }
-  const handlePlacedElevatorSelected = (
-    nodeId: AnyNodeId,
-    elevatorBuildingId: BuildingNode['id'],
-  ) => {
-    // Preserve the active level. `setSelection`'s hierarchy guard nulls
-    // `levelId` whenever `buildingId` is passed without an explicit
-    // `levelId` — which deselected the current floor plan the moment an
-    // elevator was placed. Pass the current level through so the floor
-    // plan stays selected.
-    setSelection({
-      buildingId: elevatorBuildingId,
-      levelId: activeLevelId ?? null,
-      selectedIds: [nodeId],
-    })
-  }
 
   return (
     <RegistryToolProvider value={registryToolContext}>
@@ -463,14 +447,7 @@ export const ToolManager: React.FC = () => {
             <RegistryToolComponent />
           </Suspense>
         )}
-        {!movingNode && !useRegistryTool && showBuildTool && tool === 'elevator' && (
-          <ElevatorTool
-            buildingId={buildingId as BuildingNode['id'] | null}
-            levelId={activeLevelId ?? null}
-            onPlaced={handlePlacedElevatorSelected}
-          />
-        )}
-        {!movingNode && BuildToolComponent && tool !== 'elevator' ? <BuildToolComponent /> : null}
+        {!movingNode && BuildToolComponent ? <BuildToolComponent /> : null}
         {/* Figma-style alignment guides published by the move / placement
             tools above. Lives inside the building-local group so the
             building-local guide coords render at the right world position. */}

package/src/components/tools/wall/wall-typed-entry.test.ts

@@ -0,0 +1,99 @@
+import { describe, expect, test } from 'bun:test'
+import {
+  formatWallDraftHeading,
+  resolveTypedWallEnd,
+  wallDraftHeadingDegrees,
+} from './wall-typed-entry'
+
+const metric = { bareUnit: 'm', system: 'metric' } as const
+
+function expectPoint(actual: [number, number] | null, expected: [number, number]) {
+  expect(actual).not.toBeNull()
+  expect(actual![0]).toBeCloseTo(expected[0], 10)
+  expect(actual![1]).toBeCloseTo(expected[1], 10)
+}
+
+describe('resolveTypedWallEnd — length only', () => {
+  test('keeps the pointer direction and replaces the distance', () => {
+    expectPoint(resolveTypedWallEnd([0, 0], [3, 4], ['1', ''], metric), [0.6, 0.8])
+    expectPoint(resolveTypedWallEnd([0, 0], [-30, -40], ['5', ''], metric), [-3, -4])
+  })
+
+  test('reads the whole field, not the length the pointer last showed', () => {
+    expectPoint(resolveTypedWallEnd([0, 0], [1, 0], ['12', ''], metric), [12, 0])
+  })
+
+  test('honours unit suffixes and the bare unit', () => {
+    expectPoint(resolveTypedWallEnd([1, 1], [11, 1], ['250cm', ''], metric), [3.5, 1])
+    expectPoint(
+      resolveTypedWallEnd([0, 0], [0, 9], ['2500', ''], { bareUnit: 'mm', system: 'metric' }),
+      [0, 2.5],
+    )
+    expectPoint(
+      resolveTypedWallEnd([0, 0], [9, 0], ["10'", ''], { bareUnit: 'in', system: 'imperial' }),
+      [3.048, 0],
+    )
+  })
+
+  test('has no endpoint without a usable length or a direction', () => {
+    expect(resolveTypedWallEnd([0, 0], [1, 0], ['', ''], metric)).toBeNull()
+    expect(resolveTypedWallEnd([0, 0], [1, 0], ['abc', ''], metric)).toBeNull()
+    expect(resolveTypedWallEnd([0, 0], [1, 0], ['0', ''], metric)).toBeNull()
+    expect(resolveTypedWallEnd([2, 2], [2, 2], ['5', ''], metric)).toBeNull()
+  })
+})
+
+describe('resolveTypedWallEnd — angle', () => {
+  test('angle only locks the heading; the pointer projection sets the length', () => {
+    // 90° runs along +Z; a pointer at (1, 3) projects to 3 m along it.
+    expectPoint(resolveTypedWallEnd([0, 0], [1, 3], ['', '90'], metric), [0, 3])
+    // (3, 4) projects to 7/√2 along 45°, landing 3.5 out on each axis.
+    expectPoint(resolveTypedWallEnd([1, 1], [4, 5], ['', '45'], metric), [4.5, 4.5])
+  })
+
+  test('angle only quantises the projected length to the step', () => {
+    expectPoint(resolveTypedWallEnd([0, 0], [0.2, 2.37], ['', '90'], metric, 0.5), [0, 2.5])
+  })
+
+  test('angle only never flips the wall behind its start', () => {
+    expectPoint(resolveTypedWallEnd([0, 0], [-4, 0.1], ['', '0'], metric), [0, 0])
+  })
+
+  test('length and angle fix the endpoint whatever the pointer does', () => {
+    expectPoint(resolveTypedWallEnd([2, 1], [-50, 80], ['4', '180'], metric), [-2, 1])
+    expectPoint(resolveTypedWallEnd([0, 0], [0, 0], ['2', '270'], metric), [0, -2])
+    expectPoint(resolveTypedWallEnd([0, 0], [5, 5], ['1', '-90'], metric), [0, -1])
+  })
+
+  test('accepts degree and radian suffixes', () => {
+    expectPoint(resolveTypedWallEnd([0, 0], [9, 9], ['2', '90°'], metric), [0, 2])
+    expectPoint(resolveTypedWallEnd([0, 0], [9, 9], ['2', `${Math.PI}rad`], metric), [-2, 0])
+  })
+
+  test('an unreadable angle leaves the direction to the pointer', () => {
+    expectPoint(resolveTypedWallEnd([0, 0], [0, 4], ['2', 'x'], metric), [0, 2])
+    expect(resolveTypedWallEnd([0, 0], [0, 4], ['', 'x'], metric)).toBeNull()
+  })
+})
+
+describe('wallDraftHeadingDegrees', () => {
+  test('measures from +X towards +Z in [0, 360)', () => {
+    expect(wallDraftHeadingDegrees([0, 0], [1, 0])).toBeCloseTo(0, 10)
+    expect(wallDraftHeadingDegrees([0, 0], [0, 1])).toBeCloseTo(90, 10)
+    expect(wallDraftHeadingDegrees([0, 0], [-1, 0])).toBeCloseTo(180, 10)
+    expect(wallDraftHeadingDegrees([0, 0], [0, -1])).toBeCloseTo(270, 10)
+    expect(wallDraftHeadingDegrees([1, 1], [1, 1])).toBeNull()
+  })
+
+  test('round-trips through a typed angle', () => {
+    const heading = wallDraftHeadingDegrees([0, 0], [-3, -4])!
+    expectPoint(resolveTypedWallEnd([0, 0], [0, 0], ['5', String(heading)], metric), [-3, -4])
+  })
+
+  test('labels the live heading in the same convention, wrapping 360° to 0°', () => {
+    expect(formatWallDraftHeading([0, 0], [0, 1])).toBe('90°')
+    expect(formatWallDraftHeading([0, 0], [1, -1])).toBe('315°')
+    expect(formatWallDraftHeading([0, 0], [1, -0.001])).toBe('0°')
+    expect(formatWallDraftHeading([0, 0], [0, 0])).toBe('')
+  })
+})

package/src/components/tools/wall/wall-typed-entry.ts

@@ -0,0 +1,70 @@
+import { formatAngleRadians } from '@pascal-app/core'
+import { type ParseMeasurementOptions, parseMeasurement } from '../../../lib/measurement-parser'
+import type { PlacementTypingValues } from '../../../store/use-placement-typing'
+import type { WallPlanPoint } from './wall-drafting'
+
+/**
+ * Heading of a wall draft in degrees, the way the 15° angle snap measures it:
+ * from the building's +X axis towards +Z (`atan2(dz, dx)`), in [0, 360).
+ * On an unrotated plan +Z points down the screen, so 90 runs straight down.
+ */
+export function wallDraftHeadingDegrees(start: WallPlanPoint, end: WallPlanPoint): number | null {
+  const dx = end[0] - start[0]
+  const dz = end[1] - start[1]
+  if (Math.hypot(dx, dz) <= 1e-6) return null
+  const degrees = (Math.atan2(dz, dx) * 180) / Math.PI
+  return ((degrees % 360) + 360) % 360
+}
+
+/** The draft's live heading as the angle field's placeholder, e.g. `90°`. */
+export function formatWallDraftHeading(start: WallPlanPoint, end: WallPlanPoint): string {
+  const degrees = wallDraftHeadingDegrees(start, end)
+  if (degrees === null) return ''
+  return formatAngleRadians(((Math.round(degrees) % 360) * Math.PI) / 180)
+}
+
+/**
+ * The endpoint a typed wall draft commits to. Field 0 is the length, field 1
+ * the heading (see `wallDraftHeadingDegrees`); an empty field is left to the
+ * pointer:
+ * - length only: the pointer steers the direction, the length is exact;
+ * - angle only: the direction is locked, the pointer's projection onto it sets
+ *   the length (quantised to `lengthStep` when one is given);
+ * - both: the endpoint is fully determined and the pointer is ignored.
+ *
+ * Returns null when no field holds a usable value or the pointer gives no
+ * direction to follow, so the caller keeps the pointer's own endpoint.
+ */
+export function resolveTypedWallEnd(
+  start: WallPlanPoint,
+  pointer: WallPlanPoint,
+  fields: Readonly<PlacementTypingValues>,
+  lengthOptions: ParseMeasurementOptions,
+  lengthStep = 0,
+): WallPlanPoint | null {
+  const typedLength = fields[0].trim()
+    ? parseMeasurement(fields[0], { kind: 'length', unitId: 'm' }, lengthOptions)
+    : null
+  const length = typedLength !== null && typedLength > 0 ? typedLength : null
+  const typedAngle = fields[1].trim()
+    ? parseMeasurement(fields[1], { kind: 'angle', unitId: 'rad' }, { bareUnit: 'deg' })
+    : null
+
+  const dx = pointer[0] - start[0]
+  const dz = pointer[1] - start[1]
+  if (typedAngle === null) {
+    if (length === null) return null
+    const pointerLength = Math.hypot(dx, dz)
+    if (pointerLength <= 1e-6) return null
+    return [start[0] + (dx / pointerLength) * length, start[1] + (dz / pointerLength) * length]
+  }
+
+  const dirX = Math.cos(typedAngle)
+  const dirZ = Math.sin(typedAngle)
+  let distance = length
+  if (distance === null) {
+    const projected = Math.max(0, dx * dirX + dz * dirZ)
+    distance = lengthStep > 0 ? Math.round(projected / lengthStep) * lengthStep : projected
+  }
+  return [start[0] + dirX * distance, start[1] + dirZ * distance]
+}

package/src/components/ui/action-menu/camera-actions.tsx

@@ -4,8 +4,8 @@ import { emitter, usePascalI18n } from '@pascal-app/core'
 import Image from 'next/image'
 import useEditor from '../../../store/use-editor'
 import { visibleScene } from '../../../store/view-layout'
-import { ActionButton } from './action-button'
-import { FollowPascalToggle } from './follow-pascal-toggle'
+import { ActionButton } from '@pascal-app/viewer/ui'
+import { FollowPascalToggle } from '@pascal-app/viewer/ui'
 
 export function CameraActions({ hideOrbit = false }: { hideOrbit?: boolean }) {
   const i18n = usePascalI18n()

package/src/components/ui/action-menu/control-modes.tsx

@@ -9,7 +9,7 @@ import Image from 'next/image'
 import { Fragment } from 'react'
 import { cn } from './../../../lib/utils'
 import useEditor from './../../../store/use-editor'
-import { ActionButton } from './action-button'
+import { ActionButton } from '@pascal-app/viewer/ui'
 import { MeasurementControl } from './measurement-control'
 import { PointAskButton } from './point-ask-button'
 

package/src/components/ui/action-menu/follow-pascal-pill.tsx

@@ -3,7 +3,7 @@
 import { usePascalI18n } from '@pascal-app/core'
 import { AnimatePresence, motion } from 'motion/react'
 import { useReducedMotion } from '../../../hooks/use-reduced-motion'
-import useFollowPascal from '../../../store/use-follow-pascal'
+import { useFollowPascal } from '@pascal-app/viewer/ui'
 
 /**
  * Offered while a build plays and the person has the camera: one press and the camera goes back to

package/src/components/ui/action-menu/index.tsx

@@ -3,8 +3,8 @@
 import { useScene } from '@pascal-app/core'
 import { useViewer } from '@pascal-app/viewer'
 import { motion } from 'motion/react'
-import { TooltipProvider } from './../../../components/ui/primitives/tooltip'
-import { useIsMobile } from './../../../hooks/use-mobile'
+import { TooltipProvider } from '@pascal-app/viewer/ui'
+import { useIsMobile } from '@pascal-app/viewer/ui'
 import { useReducedMotion } from './../../../hooks/use-reduced-motion'
 import { shouldShowEditingControls } from './../../../lib/interaction/overlay-policy'
 import { cn } from './../../../lib/utils'
@@ -12,7 +12,7 @@ import useEditor from './../../../store/use-editor'
 import { CameraActions } from './camera-actions'
 import { ControlModes } from './control-modes'
 import { FollowPascalPill } from './follow-pascal-pill'
-import { type ActionMenuPlacement, ActionMenuPlacementProvider } from './placement'
+import { type ActionMenuPlacement, ActionMenuPlacementProvider } from '@pascal-app/viewer/ui'
 import { SecondaryToggles } from './view-toggles'
 
 // Mobile bottom offset matches the viewer's overlap behind the sheet's

package/src/components/ui/action-menu/measurement-control.tsx

@@ -27,9 +27,9 @@ import { cn } from '../../../lib/utils'
 import useEditor from '../../../store/use-editor'
 import { VIEW_2D } from '../../../store/view-layout'
 import useFloorplanMode from '../../../store/use-floorplan-mode'
-import { Popover, PopoverContent, PopoverTrigger } from '../primitives/popover'
-import { ActionButton } from './action-button'
-import { useActionMenuPopupSide } from './placement'
+import { Popover, PopoverContent, PopoverTrigger } from '@pascal-app/viewer/ui'
+import { ActionButton } from '@pascal-app/viewer/ui'
+import { useActionMenuPopupSide } from '@pascal-app/viewer/ui'
 
 const measurementOptions = [
   { kind: 'distance', label: /* i18n */ { id: 'editor.actionMenu.measurementControl.distance', message: 'Distance' }, icon: Ruler },

package/src/components/ui/action-menu/placement.ts

@@ -1,20 +1,2 @@
-import { createContext, useContext } from 'react'
-
-/** Viewport edge the action menu docks to. */
-export type ActionMenuPlacement = 'bottom' | 'top'
-
 /** Where chrome under a top-docked menu starts: below the host toolbar row and the menu itself. */
 export const TOP_MENU_CLEARANCE = '7.25rem'
-
-const ActionMenuPlacementContext = createContext<ActionMenuPlacement>('bottom')
-
-export const ActionMenuPlacementProvider = ActionMenuPlacementContext.Provider
-
-export function useActionMenuPlacement(): ActionMenuPlacement {
-  return useContext(ActionMenuPlacementContext)
-}
-
-/** Side tooltips and popovers open toward, away from the docked edge. */
-export function useActionMenuPopupSide(): 'top' | 'bottom' {
-  return useActionMenuPlacement() === 'top' ? 'bottom' : 'top'
-}

package/src/components/ui/action-menu/point-ask-button.tsx

@@ -6,7 +6,7 @@ import { cn } from '../../../lib/utils'
 import useEditor from '../../../store/use-editor'
 import { usePointAsk } from '../../../store/use-point-ask'
 import { isViewVisible, VIEW_3D } from '../../../store/view-layout'
-import { ActionButton } from './action-button'
+import { ActionButton } from '@pascal-app/viewer/ui'
 
 /**
  * Point and ask (key C): the toolbar's way into the mode where hovering names what Pascal would