@pascal-app/editor 1.0.4 → 1.0.5

package/src/components/tools/distribution/run-direction-feedback.test.ts

@@ -0,0 +1,60 @@
+import { describe, expect, test } from 'bun:test'
+import { resolveRunDirectionCandidates, run3DDirectionCandidates } from './run-direction-feedback'
+
+describe('distribution run direction feedback', () => {
+  test('shows eight world-axis and diagonal candidates from a free start', () => {
+    const candidates = resolveRunDirectionCandidates([0, 0, 0], [2, 0, 1], null, 'free')
+
+    expect(candidates).toHaveLength(8)
+    expect(candidates.some((candidate) => candidate.active)).toBe(false)
+  })
+
+  test('highlights the winning angle-locked candidate', () => {
+    const candidates = resolveRunDirectionCandidates([0, 0, 0], [2, 0, 1], null, 'angle')
+    const active = candidates.find((candidate) => candidate.active)
+
+    expect(active?.direction[0]).toBeCloseTo(Math.SQRT1_2)
+    expect(active?.direction[2]).toBeCloseTo(Math.SQRT1_2)
+  })
+
+  test('uses the connected run direction and its valid forward turns', () => {
+    const candidates = resolveRunDirectionCandidates(
+      [0, 0, 0],
+      [2, 0, 0],
+      [Math.SQRT1_2, 0, Math.SQRT1_2],
+      'angle',
+    )
+
+    expect(candidates).toHaveLength(9)
+    expect(candidates[0]?.direction[0]).toBeCloseTo(Math.SQRT1_2)
+    expect(candidates[0]?.direction[2]).toBeCloseTo(Math.SQRT1_2)
+  })
+
+  test('offers vertical, lateral, and rising directions from a horizontal run', () => {
+    const directions = run3DDirectionCandidates([1, 0, 0])
+
+    expect(directions).toContainEqual([0, 1, 0])
+    expect(directions).toContainEqual([0, -1, 0])
+    expect(directions).toContainEqual([0, 0, 1])
+    expect(directions).toContainEqual([0, 0, -1])
+    const rising = directions.find(
+      (direction) => direction[0] > 0 && direction[1] > 0 && direction[2] === 0,
+    )
+    const falling = directions.find(
+      (direction) => direction[0] > 0 && direction[1] < 0 && direction[2] === 0,
+    )
+    expect(rising?.[0]).toBeCloseTo(Math.SQRT1_2)
+    expect(rising?.[1]).toBeCloseTo(Math.SQRT1_2)
+    expect(falling?.[0]).toBeCloseTo(Math.SQRT1_2)
+    expect(falling?.[1]).toBeCloseTo(-Math.SQRT1_2)
+  })
+
+  test('switches to an up/down candidate pair for vertical routing', () => {
+    const candidates = resolveRunDirectionCandidates([1, 2, 3], [1, 0.5, 3], null, 'vertical')
+
+    expect(candidates).toEqual([
+      { direction: [0, 1, 0], active: false },
+      { direction: [0, -1, 0], active: true },
+    ])
+  })
+})

package/src/components/tools/distribution/run-direction-feedback.tsx

@@ -0,0 +1,251 @@
+'use client'
+
+import { EDITOR_LAYER } from '@pascal-app/editor'
+import { useThree } from '@react-three/fiber'
+import { useMemo } from 'react'
+import { OrthographicCamera, Quaternion, Vector3 } from 'three'
+import type { RunPoint } from './distribution-run-tool'
+
+export type RunDirectionMode = 'free' | 'angle' | 'snap' | 'vertical'
+
+export type RunDirectionCandidate = {
+  direction: RunPoint
+  active: boolean
+}
+
+type RunVector = readonly [number, number, number]
+
+const WORLD_DIRECTIONS: RunPoint[] = Array.from({ length: 8 }, (_, index) => {
+  const angle = (index * Math.PI) / 4
+  return [Math.cos(angle), 0, Math.sin(angle)]
+})
+
+function horizontalDirection(direction: RunVector): RunPoint | null {
+  const length = Math.hypot(direction[0], direction[2])
+  return length < 1e-6 ? null : [direction[0] / length, 0, direction[2] / length]
+}
+
+function normalizedDirection(direction: RunVector): RunPoint | null {
+  const length = Math.hypot(direction[0], direction[1], direction[2])
+  if (length < 1e-6) return null
+  const normalized = direction.map((component) => component / length) as RunPoint
+  return normalized.map((component) => (Math.abs(component) < 1e-12 ? 0 : component)) as RunPoint
+}
+
+function cross(a: RunVector, b: RunVector): RunPoint {
+  return [a[1] * b[2] - a[2] * b[1], a[2] * b[0] - a[0] * b[2], a[0] * b[1] - a[1] * b[0]]
+}
+
+export function run3DDirectionCandidates(sourceDirection: RunVector): RunPoint[] {
+  const source = normalizedDirection(sourceDirection)
+  if (!source) return []
+  const reference: RunPoint = Math.abs(source[1]) < 0.95 ? [0, 1, 0] : [1, 0, 0]
+  const lateral = normalizedDirection(cross(source, reference))
+  if (!lateral) return [source]
+  const upright = normalizedDirection(cross(lateral, source))
+  if (!upright) return [source]
+
+  const candidates: RunPoint[] = [source]
+  for (const perpendicular of [upright, lateral]) {
+    for (const sign of [1, -1] as const) {
+      const turn: RunPoint = [
+        perpendicular[0] * sign,
+        perpendicular[1] * sign,
+        perpendicular[2] * sign,
+      ].map((component) => (Math.abs(component) < 1e-12 ? 0 : component)) as RunPoint
+      candidates.push(turn)
+      const diagonal = normalizedDirection([
+        source[0] + turn[0],
+        source[1] + turn[1],
+        source[2] + turn[2],
+      ])
+      if (diagonal) candidates.push(diagonal)
+    }
+  }
+  return candidates
+}
+
+export function runHorizontalDirectionCandidates(sourceDirection: RunVector | null): RunPoint[] {
+  if (!sourceDirection) return WORLD_DIRECTIONS
+  const source = horizontalDirection(sourceDirection)
+  if (!source) return WORLD_DIRECTIONS
+  const angle = Math.atan2(source[2], source[0])
+  return [-Math.PI / 2, -Math.PI / 4, 0, Math.PI / 4, Math.PI / 2].map((offset) => [
+    Math.cos(angle + offset),
+    0,
+    Math.sin(angle + offset),
+  ])
+}
+
+export function resolveRunDirectionCandidates(
+  start: RunPoint,
+  cursor: RunPoint,
+  sourceDirection: RunVector | null,
+  mode: RunDirectionMode,
+): RunDirectionCandidate[] {
+  const delta: RunPoint = [cursor[0] - start[0], cursor[1] - start[1], cursor[2] - start[2]]
+  if (mode === 'vertical') {
+    const activeSign = delta[1] < 0 ? -1 : 1
+    return ([1, -1] as const).map((sign) => ({
+      direction: [0, sign, 0],
+      active: sign === activeSign,
+    }))
+  }
+
+  const directions = sourceDirection
+    ? run3DDirectionCandidates(sourceDirection)
+    : runHorizontalDirectionCandidates(null)
+  let activeIndex = -1
+  const pointerDirection = normalizedDirection(delta)
+  if (pointerDirection && mode === 'angle') {
+    let bestDot = Number.NEGATIVE_INFINITY
+    for (let index = 0; index < directions.length; index++) {
+      const direction = directions[index]!
+      const dot =
+        direction[0] * pointerDirection[0] +
+        direction[1] * pointerDirection[1] +
+        direction[2] * pointerDirection[2]
+      if (dot > bestDot) {
+        bestDot = dot
+        activeIndex = index
+      }
+    }
+  }
+  return directions.map((direction, index) => ({ direction, active: index === activeIndex }))
+}
+
+export function RunDirectionFeedback({
+  start,
+  cursor,
+  sourceDirection,
+  mode,
+  snapped,
+  onDirectionSelect,
+}: {
+  start: RunPoint
+  cursor: RunPoint
+  sourceDirection: RunVector | null
+  mode: RunDirectionMode
+  snapped: boolean
+  onDirectionSelect?: (direction: RunPoint) => void
+}) {
+  const candidates = useMemo(
+    () => resolveRunDirectionCandidates(start, cursor, sourceDirection, mode),
+    [cursor, mode, sourceDirection, start],
+  )
+  const distance = Math.hypot(cursor[0] - start[0], cursor[1] - start[1], cursor[2] - start[2])
+  const candidateLength = Math.min(1.8, Math.max(0.7, distance * 0.7))
+  const activeColor = snapped ? '#22c55e' : '#818cf8'
+
+  return (
+    <group>
+      {candidates.map((candidate, index) => (
+        <DirectionRay
+          active={candidate.active}
+          color={candidate.active ? activeColor : '#818cf8'}
+          direction={candidate.direction}
+          key={`${index}:${candidate.direction.join(':')}`}
+          length={candidate.active ? Math.max(distance, candidateLength) : candidateLength}
+          origin={start}
+          onDirectionSelect={onDirectionSelect}
+        />
+      ))}
+      {distance > 0.01 && mode !== 'angle' && mode !== 'vertical' && (
+        <DirectionRay
+          active
+          color={activeColor}
+          direction={[
+            (cursor[0] - start[0]) / distance,
+            (cursor[1] - start[1]) / distance,
+            (cursor[2] - start[2]) / distance,
+          ]}
+          length={distance}
+          origin={start}
+          onDirectionSelect={onDirectionSelect}
+        />
+      )}
+    </group>
+  )
+}
+
+function DirectionRay({
+  origin,
+  direction,
+  length,
+  active,
+  color,
+  onDirectionSelect,
+}: {
+  origin: RunPoint
+  direction: RunPoint
+  length: number
+  active: boolean
+  color: string
+  onDirectionSelect?: (direction: RunPoint) => void
+}) {
+  const { camera } = useThree()
+  const zoomScale = camera instanceof OrthographicCamera ? 1 / camera.zoom : 1
+  const placement = useMemo(() => {
+    const axis = new Vector3(direction[0], direction[1], direction[2]).normalize()
+    const start = new Vector3(origin[0], origin[1] + 0.015, origin[2])
+    const end = start.clone().addScaledVector(axis, length)
+    return {
+      midpoint: start.clone().add(end).multiplyScalar(0.5).toArray() as RunPoint,
+      tip: end.toArray() as RunPoint,
+      rotation: new Quaternion().setFromUnitVectors(new Vector3(0, 1, 0), axis),
+    }
+  }, [direction, length, origin])
+  const radius = (active ? 0.012 : 0.006) * zoomScale
+  const arrowLength = (active ? 0.1 : 0.07) * zoomScale
+  const arrowRadius = (active ? 0.04 : 0.025) * zoomScale
+  const opacity = active ? 0.9 : 0.18
+
+  return (
+    <group>
+      <mesh
+        layers={EDITOR_LAYER}
+        position={placement.midpoint}
+        quaternion={placement.rotation}
+        scale={[radius, length, radius]}
+        renderOrder={active ? 4 : 2}
+        onPointerDown={(event) => {
+          if (!onDirectionSelect) return
+          event.stopPropagation()
+          event.nativeEvent.stopImmediatePropagation()
+          onDirectionSelect([...direction])
+        }}
+      >
+        <cylinderGeometry args={[1, 1, 1, 8]} />
+        <meshBasicMaterial
+          color={color}
+          depthTest={false}
+          depthWrite={false}
+          opacity={opacity}
+          transparent
+        />
+      </mesh>
+      <mesh
+        layers={EDITOR_LAYER}
+        position={placement.tip}
+        quaternion={placement.rotation}
+        scale={[arrowRadius, arrowLength, arrowRadius]}
+        renderOrder={active ? 4 : 2}
+        onPointerDown={(event) => {
+          if (!onDirectionSelect) return
+          event.stopPropagation()
+          event.nativeEvent.stopImmediatePropagation()
+          onDirectionSelect([...direction])
+        }}
+      >
+        <coneGeometry args={[1, 1, 10]} />
+        <meshBasicMaterial
+          color={color}
+          depthTest={false}
+          depthWrite={false}
+          opacity={opacity}
+          transparent
+        />
+      </mesh>
+    </group>
+  )
+}

package/src/components/tools/distribution/run-port-snap.test.ts

@@ -0,0 +1,79 @@
+import { expect, test } from 'bun:test'
+import { PerspectiveCamera, Vector3 } from 'three'
+import type { ScenePort } from './ports'
+import { findScreenPort } from './run-port-snap'
+
+const low: ScenePort = {
+  nodeId: 'pipe-segment_low',
+  id: 'end',
+  position: [0, 0, 0],
+  diameter: 0.1,
+  direction: [1, 0, 0],
+}
+const high: ScenePort = {
+  nodeId: 'duct-segment_high',
+  id: 'start',
+  position: [0, 3, 0],
+  diameter: 0.1,
+  direction: [1, 0, 0],
+}
+const camera = new PerspectiveCamera(50, 1, 0.1, 100)
+camera.position.set(0, 2, 10)
+camera.lookAt(0, 2, 0)
+camera.updateMatrixWorld()
+const project = (point: ScenePort['position']) => {
+  const projected = new Vector3(...point).project(camera)
+  if (projected.z < -1 || projected.z > 1) return null
+  return { x: (projected.x + 1) * 400, y: (1 - projected.y) * 400, depth: projected.z }
+}
+
+test('picks an elevated socket under the pointer independently of the drawing plane', () => {
+  const screen = project(high.position)!
+  const hit = findScreenPort([low, high], [screen.x + 5, screen.y - 3], project, null)
+  expect(hit?.port).toBe(high)
+  expect(hit?.port.position).toEqual([0, 3, 0])
+})
+
+test('uses a pixel threshold rather than attracting distant sockets', () => {
+  const screen = project(high.position)!
+  expect(findScreenPort([high], [screen.x + 17, screen.y], project, null)).toBeNull()
+})
+
+test('excludes the source before ranking and keeps other sockets on that item eligible', () => {
+  const other = { ...high, id: 'end' }
+  const screen = project(high.position)!
+  expect(findScreenPort([high, other], [screen.x, screen.y], project, high)?.port).toBe(other)
+})
+
+test('ignores occluded, clipped and invalid projections', () => {
+  const behind = { ...high, position: [0, 2, 20] as const }
+  expect(findScreenPort([behind], [400, 400], project, null)).toBeNull()
+  expect(findScreenPort([high], [400, 400], () => null, null)).toBeNull()
+  expect(findScreenPort([high], [NaN, NaN], project, null)).toBeNull()
+})
+
+test('chooses the front socket when projected points coincide', () => {
+  const far = { ...high, id: 'far' }
+  const near = { ...high, position: [0, 3, 1] as const }
+  expect(
+    findScreenPort(
+      [far, near],
+      [10, 10],
+      (point) => ({
+        x: 10,
+        y: 10,
+        depth: point[2] === 1 ? 1 : 5,
+      }),
+      null,
+    )?.port,
+  ).toBe(near)
+})
+
+test('supports a rotated and zoomed floorplan projection while retaining socket elevation', () => {
+  const planProject = (point: ScenePort['position']) => ({
+    x: -point[2] * 40 + 300,
+    y: point[0] * 40 + 200,
+    depth: 0,
+  })
+  expect(findScreenPort([high], [302, 203], planProject, null)?.port.position[1]).toBe(3)
+})

package/src/components/tools/distribution/run-port-snap.ts

@@ -0,0 +1,25 @@
+import type { ScenePort } from './ports'
+
+export type PortScreenPoint = { x: number; y: number; depth: number }
+
+export function findScreenPort(
+  ports: readonly ScenePort[],
+  pointer: readonly [number, number],
+  project: (point: ScenePort['position']) => PortScreenPoint | null,
+  source: Pick<ScenePort, 'nodeId' | 'id'> | null,
+  radius = 16,
+): { port: ScenePort; screen: PortScreenPoint } | null {
+  let best: { port: ScenePort; screen: PortScreenPoint } | null = null
+  let distance = radius
+  for (const port of ports) {
+    if (source?.nodeId === port.nodeId && source.id === port.id) continue
+    const screen = project(port.position)
+    if (!screen) continue
+    const nextDistance = Math.hypot(screen.x - pointer[0], screen.y - pointer[1])
+    if (!Number.isFinite(nextDistance) || nextDistance > distance) continue
+    if (best && nextDistance === distance && screen.depth >= best.screen.depth) continue
+    best = { port, screen }
+    distance = nextDistance
+  }
+  return best
+}

package/src/components/tools/distribution/run-screen-direction.test.ts

@@ -0,0 +1,23 @@
+import { expect, test } from 'bun:test'
+import { chooseScreenDirection, screenDirectionScore } from './run-screen-direction'
+
+test('picks the visually closest guide including diagonals', () => {
+  const pointer = [75, -60] as const
+  const scores = [
+    [100, 0],
+    [70, -70],
+    [0, -100],
+  ].map((tip) => screenDirectionScore([0, 0], tip as [number, number], pointer))
+  expect(chooseScreenDirection(scores, -1)).toBe(1)
+})
+
+test('small jitter keeps the guide but deliberate movement switches', () => {
+  expect(chooseScreenDirection([12, 10], 0)).toBe(0)
+  expect(chooseScreenDirection([20, 10], 0)).toBe(1)
+})
+
+test('camera-facing and backwards guides do not capture the cursor', () => {
+  expect(screenDirectionScore([0, 0], [0.1, 0.2], [50, 50])).toBe(Infinity)
+  expect(screenDirectionScore([0, 0], [-100, 0], [50, 0])).toBe(Infinity)
+  expect(chooseScreenDirection([Infinity, Infinity], 0)).toBe(-1)
+})

package/src/components/tools/distribution/run-screen-direction.ts

@@ -0,0 +1,30 @@
+type Point2 = readonly [number, number]
+
+export function screenDirectionScore(origin: Point2, tip: Point2, pointer: Point2): number {
+  const dx = tip[0] - origin[0],
+    dy = tip[1] - origin[1]
+  const length = Math.hypot(dx, dy)
+  if (length < 2) return Infinity
+  const px = pointer[0] - origin[0],
+    py = pointer[1] - origin[1]
+  const distance = Math.hypot(px, py)
+  if (px * dx + py * dy <= 0 || distance < 4) return Infinity
+  return (
+    Math.hypot(px / distance - dx / length, py / distance - dy / length) * Math.min(distance, 100)
+  )
+}
+
+export function chooseScreenDirection(scores: readonly number[], previous: number): number {
+  let best = -1
+  for (let i = 0; i < scores.length; i++) {
+    if (Number.isFinite(scores[i]) && (best < 0 || scores[i]! < scores[best]!)) best = i
+  }
+  if (
+    best >= 0 &&
+    previous >= 0 &&
+    Number.isFinite(scores[previous]) &&
+    scores[previous]! <= scores[best]! + 4
+  )
+    return previous
+  return best
+}

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

@@ -13,14 +13,13 @@ import { useEffect, useMemo, useRef } from 'react'
 import * as THREE from 'three'
 import { resolveCurrentBuildingId, resolveElevatorSupportY } from '../../../lib/elevator-support'
 import { sfxEmitter } from '../../../lib/sfx-bus'
-
+import { isTypingTarget } from '../../../lib/typing-target'
 import useAlignmentGuides from '../../../store/use-alignment-guides'
 import useEditor, {
   isAlignmentGuideActive,
   isGridSnapActive,
   isMagneticSnapActive,
 } from '../../../store/use-editor'
-
 import usePlacementPreview from '../../../store/use-placement-preview'
 import { CursorSphere } from '../shared/cursor-sphere'
 import {
@@ -63,7 +62,7 @@ function resolveDefaultServiceRange(
     .filter((node): node is LevelNode => node?.type === 'level')
     .sort((left, right) => left.level - right.level)
   const selectedLevelIndex = levels.findIndex((level) => level.id === selectedLevelId)
-  const fromIndex = selectedLevelIndex >= 0 ? selectedLevelIndex : 0
+  const fromIndex = Math.max(selectedLevelIndex, 0)
   const fromLevel = levels[fromIndex]
   const toLevel = levels[Math.min(fromIndex + 1, levels.length - 1)] ?? fromLevel
 
@@ -286,9 +285,7 @@ export const ElevatorTool: React.FC<ElevatorToolProps> = ({ buildingId, levelId,
     }
 
     const onKeyDown = (event: KeyboardEvent) => {
-      if (event.target instanceof HTMLInputElement || event.target instanceof HTMLTextAreaElement) {
-        return
-      }
+      if (isTypingTarget(event.target)) return
 
       const ROTATION_STEP = Math.PI / 4
       let rotationDelta = 0

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

@@ -17,6 +17,7 @@ import { markToolCancelConsumed } from '../../../hooks/use-keyboard'
 import { resolveElevatorSupportY } from '../../../lib/elevator-support'
 import { consumePlacementDragRelease } from '../../../lib/placement-drag-release'
 import { sfxEmitter } from '../../../lib/sfx-bus'
+import { isTypingTarget } from '../../../lib/typing-target'
 import useEditor from '../../../store/use-editor'
 import { CursorSphere } from '../shared/cursor-sphere'
 
@@ -217,9 +218,7 @@ export function MoveElevatorTool({
     }
 
     const onKeyDown = (event: KeyboardEvent) => {
-      if (event.target instanceof HTMLInputElement || event.target instanceof HTMLTextAreaElement) {
-        return
-      }
+      if (isTypingTarget(event.target)) return
 
       const ROTATION_STEP = Math.PI / 4
       let rotationDelta = 0

package/src/components/tools/item/item-surface-strategy-resolver.test.ts

@@ -104,75 +104,74 @@ function onHost(ctx: PlacementContext): PlacementContext {
 test.each([
   [4.01, 1, 1.5],
   [4, 1, 1.51],
-] as [
-  number,
-  number,
-  number,
-][])('enter and move accept oversized objects with their centres on the host: %j', (width, height, depth) => {
-  const draft = ItemNode.parse({
-    ...child,
-    asset: { ...asset, dimensions: [width, height, depth] },
-  })
-  const ctx = context(draft)
-  const event = hit()
-  const before = useScene.getState().nodes
-  expect(itemSurfaceStrategy.enter(ctx, event)).not.toBeNull()
-  const expected: {
-    position: [number, number, number]
-    worldPosition: [number, number, number]
-  } =
-    width === 4.01
-      ? {
-          position: [0.5049999999999999, 0.8099999999999996, -0.25],
-          worldPosition: [4.434656461734313, 2.8017166019018256, -3.927442316539199],
-        }
-      : {
-          position: [0.5, 0.8099999999999996, -0.245],
-          worldPosition: [4.4318465044173845, 2.8017248933478855, -3.9175249544338326],
-        }
-  const moved = itemSurfaceStrategy.move(onHost(ctx), event)!
-  expect(moved.nodeUpdate).toEqual({ position: expected.position })
-  expect(moved.cursorPosition).toEqual(expected.worldPosition)
-  expect(moved.cursorRotationY).toBe(ctx.currentCursorRotationY)
-  expect(resolver.mock.calls.map(([args]) => args.checkFootprint)).toEqual([true, true])
-  expect(useScene.getState().nodes).toBe(before)
-})
+] as [number, number, number][])(
+  'enter and move accept oversized objects with their centres on the host: %j',
+  (width, height, depth) => {
+    const draft = ItemNode.parse({
+      ...child,
+      asset: { ...asset, dimensions: [width, height, depth] },
+    })
+    const ctx = context(draft)
+    const event = hit()
+    const before = useScene.getState().nodes
+    expect(itemSurfaceStrategy.enter(ctx, event)).not.toBeNull()
+    const expected: {
+      position: [number, number, number]
+      worldPosition: [number, number, number]
+    } =
+      width === 4.01
+        ? {
+            position: [0.5049999999999999, 0.8099999999999996, -0.25],
+            worldPosition: [4.434656461734313, 2.8017166019018256, -3.927442316539199],
+          }
+        : {
+            position: [0.5, 0.8099999999999996, -0.245],
+            worldPosition: [4.4318465044173845, 2.8017248933478855, -3.9175249544338326],
+          }
+    const moved = itemSurfaceStrategy.move(onHost(ctx), event)!
+    expect(moved.nodeUpdate).toEqual({ position: expected.position })
+    expect(moved.cursorPosition).toEqual(expected.worldPosition)
+    expect(moved.cursorRotationY).toBe(ctx.currentCursorRotationY)
+    expect(resolver.mock.calls.map(([args]) => args.checkFootprint)).toEqual([true, true])
+    expect(useScene.getState().nodes).toBe(before)
+  },
+)
 
-test.each([
-  'grid',
-  'off',
-] as const)('accepted poses match the frozen live capture with snapping %s', (mode) => {
-  useEditor.getState().setSnappingMode('item', mode)
-  const ctx = context()
-  const event = hit()
-  const expected: {
-    position: [number, number, number]
-    worldPosition: [number, number, number]
-    rotationY: number
-  } = {
-    ...(mode === 'grid'
-      ? {
-          position: [0.25, 0.8099999999999996, -0.25],
-          worldPosition: [4.180930399588417, 2.808503845962115, -3.4850883647019826],
-        }
-      : {
-          position: [0.36999999999999966, 0.8099999999999996, -0.39000000000000146],
-          worldPosition: [4.239709121156868, 2.808804018339912, -3.728080076057168],
-        }),
-    rotationY: -0.84936351290154,
-  }
-  const entered = itemSurfaceStrategy.enter(ctx, event)!
-  expect(entered.nodeUpdate).toEqual({
-    position: expected.position,
-    parentId: host.id,
-    rotation: [0.1, expected.rotationY, 0.3],
-  })
-  expect(entered.cursorPosition).toEqual(expected.worldPosition)
-  expect(itemSurfaceStrategy.move(onHost(ctx), event)!.nodeUpdate).toEqual({
-    position: expected.position,
-  })
-  expect(resolver).toHaveBeenCalledTimes(2)
-})
+test.each(['grid', 'off'] as const)(
+  'accepted poses match the frozen live capture with snapping %s',
+  (mode) => {
+    useEditor.getState().setSnappingMode('item', mode)
+    const ctx = context()
+    const event = hit()
+    const expected: {
+      position: [number, number, number]
+      worldPosition: [number, number, number]
+      rotationY: number
+    } = {
+      ...(mode === 'grid'
+        ? {
+            position: [0.25, 0.8099999999999996, -0.25],
+            worldPosition: [4.180930399588417, 2.808503845962115, -3.4850883647019826],
+          }
+        : {
+            position: [0.36999999999999966, 0.8099999999999996, -0.39000000000000146],
+            worldPosition: [4.239709121156868, 2.808804018339912, -3.728080076057168],
+          }),
+      rotationY: -0.84936351290154,
+    }
+    const entered = itemSurfaceStrategy.enter(ctx, event)!
+    expect(entered.nodeUpdate).toEqual({
+      position: expected.position,
+      parentId: host.id,
+      rotation: [0.1, expected.rotationY, 0.3],
+    })
+    expect(entered.cursorPosition).toEqual(expected.worldPosition)
+    expect(itemSurfaceStrategy.move(onHost(ctx), event)!.nodeUpdate).toEqual({
+      position: expected.position,
+    })
+    expect(resolver).toHaveBeenCalledTimes(2)
+  },
+)
 
 test('resolver rejection leaves both enter and move drafts alone', () => {
   resolver.mockReturnValue(null)