@pascal-app/editor 1.0.5 → 1.0.7

package/src/components/editor/footprint-height-handle.tsx

@@ -10,7 +10,6 @@ import {
   useScene,
 } from '@pascal-app/core'
 import { useViewer } from '@pascal-app/viewer'
-import { Html } from '@react-three/drei'
 import { type ThreeEvent, useFrame, useThree } from '@react-three/fiber'
 import { useRef, useState } from 'react'
 import { type Group, Plane, Vector2, Vector3 } from 'three'
@@ -26,6 +25,7 @@ import { runRoomHandleDrag } from '../../lib/room-handle-drag'
 import useEditor, { isGridSnapActive } from '../../store/use-editor'
 import useInteractionScope from '../../store/use-interaction-scope'
 import { suppressBoxSelectForPointer } from '../tools/select/box-select-state'
+import { Html } from './localized-html'
 import { ElevationArrows, outlineCentroid, useHandleScale } from './room-handles'
 
 export const FOOTPRINT_HEIGHT_DRAG_LABEL = 'footprint-height'

package/src/components/editor/grid.tsx

@@ -15,7 +15,8 @@ import { MeshBasicNodeMaterial } from 'three/webgpu'
 import { useCeilingEvents } from '../../hooks/use-ceiling-events'
 import { useGridEvents } from '../../hooks/use-grid-events'
 import { getPlacementSurface, usesOrientedPlacementPlane } from '../../lib/active-placement-surface'
-import { gridLocalNormal, gridLocalPoint } from '../../lib/grid-frame'
+import { gridLocalNormal, gridLocalPoint, layHorizontalGrid } from '../../lib/grid-frame'
+import { getActiveGridPose } from '../../lib/world-grid-snap'
 import useEditor, { getActiveSnapContext, isGridSnapActive } from '../../store/use-editor'
 import { getMovingNode } from '../../store/use-interaction-scope'
 
@@ -27,10 +28,9 @@ export const EDITOR_GRID_INPUT_NAME = 'pascal-editor-grid-input'
 const PLACEMENT_REVEAL_RADIUS = 12
 
 const UP = new Vector3(0, 1, 0)
-// PlaneGeometry faces +Z; this is the orientation that lays it flat (its normal
-// → world +Y), equivalent to the old `rotation-x={-π/2}`.
+// PlaneGeometry faces +Z; the oriented (wall-plane) lattice turns this normal
+// into the host's. The flat lattice is laid by `layHorizontalGrid`.
 const PLANE_LOCAL_NORMAL = new Vector3(0, 0, 1)
-const HORIZONTAL_QUATERNION = new Quaternion().setFromUnitVectors(PLANE_LOCAL_NORMAL, UP)
 
 export const Grid = ({
   cellSize = 0.5,
@@ -184,10 +184,10 @@ export const Grid = ({
   useCeilingEvents()
 
   // Track the last world-space cursor hit. The reveal-fade shader reads
-  // `positionLocal.xy` (vertex position on the un-transformed plane), and the
-  // laid-flat orientation maps `positionLocal.y` to world `-Z` relative to the
-  // mesh origin. The cursor is recomputed every frame from the stored world hit
-  // so the reveal stays put regardless of where the mesh origin sits.
+  // `positionLocal.xy` (vertex position on the un-transformed plane), so the
+  // cursor is taken into the plane's frame every frame from the stored world
+  // hit — the reveal stays put wherever the mesh origin sits and however it
+  // is turned.
   const lastWorldCursorRef = useRef<Vector3 | null>(null)
   useEffect(() => {
     const onGridMove = (event: GridEvent) => {
@@ -279,20 +279,29 @@ export const Grid = ({
         setGridY(surfacePoint.y)
       }
     } else {
-      // Horizontal: keep the lattice anchored to world XZ (0,0); only the Y
-      // origin follows the surface height (floor / shelf top). Snap directly —
-      // the old lerp made the grid visibly drift up to a new floor height.
-      // Cursor uniform tracks the world cursor (mirrored on Z for the flat plane).
+      // Horizontal: lay the lattice on the frame the tools snap in — the
+      // active building's yaw and offset, so a turned house's walls sit square
+      // on it, or world XZ (0,0) for site work; only the Y origin follows the
+      // surface height (floor / shelf top). Snap directly — the old lerp made
+      // the grid visibly drift up to a new floor height.
       const targetY = surfacePoint ? surfacePoint.y : levelY
       // Visual mesh rides 1mm above the surface: at exactly the surface Y the
       // lattice is coplanar with the slab top and z-fights it. The event plane
       // (`gridY` → useGridEvents) stays at the true surface height.
-      gridMesh.position.set(0, targetY + 0.001, 0)
-      gridMesh.quaternion.copy(HORIZONTAL_QUATERNION)
+      layHorizontalGrid(
+        getActiveGridPose(),
+        targetY + 0.001,
+        gridMesh.position,
+        gridMesh.quaternion,
+      )
+      // Cursor uniform → plane-local XY, as for the wall plane above.
       const world = lastWorldCursorRef.current
       if (world) {
+        invQuatRef.current.copy(gridMesh.quaternion).invert()
         const local = gridLocalPoint(gridMesh.parent, world, localCursorRef.current)
-        cursorPositionRef.current.set(local.x, -local.z)
+          .sub(gridMesh.position)
+          .applyQuaternion(invQuatRef.current)
+        cursorPositionRef.current.set(local.x, local.y)
       }
       if (lastGridYRef.current !== targetY) {
         lastGridYRef.current = targetY

package/src/components/editor/group-actions.ts

@@ -41,6 +41,7 @@ import useFloorplanMode from '../../store/use-floorplan-mode'
 import useInteractionScope from '../../store/use-interaction-scope'
 import { useFloorplanGroupDrag } from '../editor-2d/floorplan-group-move'
 import {
+  beginGroupWallPush,
   classifyParticipant,
   collectParticipants,
   computeGroupBox,
@@ -185,6 +186,9 @@ export function startGroupPickUp(
     handle: GROUP_MOVE_DRAG_LABEL,
   })
   document.body.style.cursor = 'grabbing'
+  // Walls alone move as their push arrows do; copies (paste, duplicate) are
+  // carried rigidly, joined to nothing yet.
+  const push = opts.scopeToSelection ? null : beginGroupWallPush(starts, levelId)
 
   const applyMove = (e: PointerEvent) => {
     const plan = resolvePlanPoint(e)
@@ -202,7 +206,8 @@ export function startGroupPickUp(
     let dx = snap ? Math.round(rawDx / step) * step : rawDx
     let dz = snap ? Math.round(rawDz / step) * step : rawDz
 
-    if (isAlignmentGuideActive() && candidates.length > 0 && restAnchors.length > 0) {
+    // Pushed walls don't move as one footprint, so they have no box to align.
+    if (!push && isAlignmentGuideActive() && candidates.length > 0 && restAnchors.length > 0) {
       const result = resolveAlignment({
         moving: restAnchors.map((a) => ({ ...a, x: a.x + dx, z: a.z + dz })),
         candidates,
@@ -225,6 +230,10 @@ export function startGroupPickUp(
       sfxEmitter.emit('sfx:grid-snap')
       lastDelta = [dx, dz]
     }
+    if (push) {
+      push.preview([dx, dz])
+      return
+    }
 
     const entries = translateGroupPatches(starts, links, dx, dz)
     const patchById = new Map(entries)
@@ -252,6 +261,8 @@ export function startGroupPickUp(
   // the current delta — the carried group turns exactly like the idle
   // keyboard rotate, and the placement stays a single updateNodes.
   const rotateCarried = (direction: 1 | -1) => {
+    // Pushed walls keep their bearing: there is nothing to turn.
+    if (push) return
     const pivot = { x: restCenter[0], z: restCenter[1] }
     const delta = -direction * (Math.PI / 4)
     const rotated = rotateGroupSnapshots(starts, links, pivot, delta)
@@ -271,6 +282,7 @@ export function startGroupPickUp(
   }
 
   const clearLivePreviews = () => {
+    push?.cancel()
     const overrides = useLiveNodeOverrides.getState()
     const liveTransforms = useLiveTransforms.getState()
     for (const id of affectedIds) {
@@ -303,6 +315,12 @@ export function startGroupPickUp(
   const commit = () => {
     swallowNextClick()
     sfxEmitter.emit('sfx:item-place')
+    if (push) {
+      resumeSceneHistory(useScene)
+      push.commit()
+      teardown()
+      return
+    }
     const overrides = useLiveNodeOverrides.getState()
     const updates: { id: AnyNodeId; data: Partial<AnyNode> }[] = []
     for (const id of affectedIds) {

package/src/components/editor/group-floating-action-menu.tsx

@@ -2,7 +2,6 @@
 
 import { type AnyNodeId, useScene } from '@pascal-app/core'
 import { useViewer } from '@pascal-app/viewer'
-import { Html } from '@react-three/drei'
 import { useFrame } from '@react-three/fiber'
 import { useCallback, useMemo, useRef } from 'react'
 import * as THREE from 'three'
@@ -21,6 +20,7 @@ import {
   computeGroupPlanBox,
   levelFrame,
 } from './group-transform-shared'
+import { Html } from './localized-html'
 import { NodeActionMenu } from './node-action-menu'
 import { useMeshSettleEpoch } from './use-mesh-settle-epoch'
 

package/src/components/editor/group-move-3d.ts

@@ -16,6 +16,7 @@ import { useViewer } from '@pascal-app/viewer'
 import { type Camera, Plane, type Raycaster, Vector2, Vector3 } from 'three'
 import { GROUP_MOVE_DRAG_LABEL } from '../../lib/contextual-help'
 import { isHistoryShortcut } from '../../lib/history'
+import type { WallGroupPush } from '../../lib/room-handle-drag'
 import { sfxEmitter } from '../../lib/sfx-bus'
 import { isTypingTarget } from '../../lib/typing-target'
 import useAlignmentGuides from '../../store/use-alignment-guides'
@@ -29,6 +30,7 @@ import { useFloorplanGroupDrag } from '../editor-2d/floorplan-group-move'
 import { suppressBoxSelectForPointer } from '../tools/select/box-select-state'
 import { startGroupPickUp } from './group-actions'
 import {
+  beginGroupWallPush,
   classifyParticipant,
   collectParticipants,
   computeGroupBox,
@@ -99,6 +101,8 @@ export function armGroupMove3d(args: {
     startLocal: Vector3
     frameInv: ReturnType<typeof levelFrame>['inverse']
     lastDelta: Vec2 | null
+    /** Walls alone: each moves as its push arrow does instead of the rigid slide. */
+    push: WallGroupPush | null
   }
   let session: Session | null = null
 
@@ -179,6 +183,7 @@ export function armGroupMove3d(args: {
       startLocal,
       frameInv,
       lastDelta: null,
+      push: beginGroupWallPush(starts, levelId),
     }
   }
 
@@ -202,8 +207,14 @@ export function armGroupMove3d(args: {
       : moveLocal.z - s.startLocal.z
 
     // Figma-style alignment layered on top: guides display in every mode
-    // except Off; the magnetic pull applies only in 'lines' mode.
-    if (isAlignmentGuideActive() && s.candidates.length > 0 && s.restAnchors.length > 0) {
+    // except Off; the magnetic pull applies only in 'lines' mode. Pushed walls
+    // don't move as one footprint, so they have no box to align.
+    if (
+      !s.push &&
+      isAlignmentGuideActive() &&
+      s.candidates.length > 0 &&
+      s.restAnchors.length > 0
+    ) {
       const result = resolveAlignment({
         moving: s.restAnchors.map((a) => ({ ...a, x: a.x + dx, z: a.z + dz })),
         candidates: s.candidates,
@@ -227,6 +238,10 @@ export function armGroupMove3d(args: {
       sfxEmitter.emit('sfx:grid-snap')
       s.lastDelta = [dx, dz]
     }
+    if (s.push) {
+      s.push.preview([dx, dz])
+      return
+    }
 
     const entries = translateGroupPatches(s.starts, s.links, dx, dz)
     const patchById = new Map(entries)
@@ -255,6 +270,8 @@ export function armGroupMove3d(args: {
   // current delta — the carried group turns exactly like the idle keyboard
   // rotate, and the commit stays a single updateNodes.
   const rotateSession = (s: Session, direction: 1 | -1) => {
+    // Pushed walls keep their bearing: there is nothing to turn.
+    if (s.push) return
     const pivot = { x: s.restCenter[0], z: s.restCenter[1] }
     const delta = -direction * (Math.PI / 4)
     const rotated = rotateGroupSnapshots(s.starts, s.links, pivot, delta)
@@ -276,6 +293,7 @@ export function armGroupMove3d(args: {
   }
 
   const clearLivePreviews = (s: Session) => {
+    s.push?.cancel()
     const overrides = useLiveNodeOverrides.getState()
     const liveTransforms = useLiveTransforms.getState()
     for (const id of s.affectedIds) {
@@ -342,6 +360,13 @@ export function armGroupMove3d(args: {
     }
     swallowNextClick()
     sfxEmitter.emit('sfx:item-place')
+    if (session.push) {
+      resumeSceneHistory(useScene)
+      session.push.commit()
+      session = null
+      teardown()
+      return
+    }
     const overrides = useLiveNodeOverrides.getState()
     const updates: { id: AnyNodeId; data: Partial<AnyNode> }[] = []
     for (const id of session.affectedIds) {

package/src/components/editor/group-selection-box-3d.tsx

@@ -5,6 +5,7 @@ import { useViewer } from '@pascal-app/viewer'
 import { type ThreeEvent, useThree } from '@react-three/fiber'
 import { useEffect, useMemo } from 'react'
 import * as THREE from 'three'
+import { useRoomHandleDrag } from '../../lib/room-handle-drag'
 import useEditor from '../../store/use-editor'
 import { useMovingNode } from '../../store/use-interaction-scope'
 import { useFloorplanGroupDrag } from '../editor-2d/floorplan-group-move'
@@ -38,6 +39,8 @@ export function GroupSelectionBox3D() {
   const mode = useEditor((s) => s.mode)
   const movingNode = useMovingNode()
   const delta = useFloorplanGroupDrag((s) => s.delta)
+  // Pushed walls don't move as one box: the room widths they show take its place.
+  const wallPush = useRoomHandleDrag((s) => s.drag?.kind === 'wall-group-push')
   const { camera, raycaster, gl } = useThree()
 
   const participantIds = useMemo(
@@ -118,7 +121,7 @@ export function GroupSelectionBox3D() {
     return new THREE.Vector3(delta[0], 0, delta[1]).applyMatrix4(matrix).sub(origin)
   }, [delta, levelId])
 
-  if (!box || !edges || movingNode || mode !== 'select') return null
+  if (!box || !edges || movingNode || wallPush || mode !== 'select') return null
 
   const handlePointerDown = (event: ThreeEvent<PointerEvent>) => {
     const native = event.nativeEvent

package/src/components/editor/group-transform-shared.ts

@@ -10,6 +10,7 @@ import {
   type WallNode,
 } from '@pascal-app/core'
 import { Box3, type BufferGeometry, Matrix4, type Object3D, Vector3 } from 'three'
+import { beginWallGroupPush, type WallGroupPush } from '../../lib/room-handle-drag'
 
 // Shared plumbing for the group transform gizmos (rotate + move). Both operate
 // on the same multi-selection: classify each participant by how its placement
@@ -486,6 +487,25 @@ export function rotatePlanBounds(
   return { minX, minZ, maxX, maxZ }
 }
 
+/**
+ * A group move of walls alone moves each wall as its push arrow does
+ * (`planWallGroupPush`) rather than sliding the selection rigidly: null for
+ * any other selection, which keeps the rigid slide. Doors and windows are not
+ * participants (they ride their wall), so they never make a selection mixed.
+ */
+export function beginGroupWallPush(
+  starts: readonly ParticipantStart[],
+  levelId: string | null,
+): WallGroupPush | null {
+  const nodes = useScene.getState().nodes
+  if (!levelId || starts.length === 0) return null
+  if (!starts.every((s) => s.kind === 'endpoint' && nodes[s.id]?.type === 'wall')) return null
+  return beginWallGroupPush(
+    starts.map((s) => s.id),
+    levelId,
+  )
+}
+
 // Rigid group slide: shift every participant (and each linked neighbour's
 // shared endpoint) by the same level-frame XZ delta. Y is untouched; the
 // snapshot's rotation rides along because a mid-gesture R/T turns the