@pascal-app/editor 0.9.2 → 1.0.0-beta.1

package/src/components/editor-2d/floorplan-group-move.tsx

@@ -6,6 +6,7 @@ import {
   bboxCornerAnchors,
   collectAlignmentAnchors,
   DEFAULT_ANGLE_STEP,
+  type FloorplanGeometry,
   type FloorplanPalette,
   pauseSceneHistory,
   pauseSpaceDetection,
@@ -22,13 +23,16 @@ import { GROUP_MOVE_DRAG_LABEL, GROUP_ROTATE_DRAG_LABEL } from '../../lib/contex
 import { applyFloorplanAlignment } from '../../lib/floorplan/apply-alignment'
 import { clientToPlan } from '../../lib/floorplan/plan-coords'
 import { isHistoryShortcut } from '../../lib/history'
+import { formatLinearMeasurement } from '../../lib/measurements'
 import { sfxEmitter } from '../../lib/sfx-bus'
 import useAlignmentGuides from '../../store/use-alignment-guides'
 import useEditor, {
   isAlignmentGuideActive,
+  isAngleSnapActive,
   isGridSnapActive,
   isMagneticSnapActive,
 } from '../../store/use-editor'
+import useFloorplanMode from '../../store/use-floorplan-mode'
 import useInteractionScope, { useMovingNode } from '../../store/use-interaction-scope'
 import {
   classifyParticipant,
@@ -44,6 +48,8 @@ import {
 } from '../editor/group-transform-shared'
 import { swallowNextClick } from '../editor/handles/use-handle-drag'
 import { useMeshSettleEpoch } from '../editor/use-mesh-settle-epoch'
+import { useFloorplanSceneRotation } from './floorplan-render-context'
+import { FloorplanDimensionRenderer } from './renderers/floorplan-dimension-renderer'
 
 // 2D sibling of the 3D body-drag group move (`group-move-3d.ts`): dragging
 // any selected element of a multi-selection slides the whole selection
@@ -441,9 +447,9 @@ export function startFloorplanGroupRotate(event: {
     let delta = angleOf([plan[0], plan[1]]) - initialAngle
     while (delta > Math.PI) delta -= 2 * Math.PI
     while (delta < -Math.PI) delta += 2 * Math.PI
-    // 15° increments by default; Shift rotates freely — the same contract
-    // as the 3D group rotate gizmo (and the HUD hint its scope surfaces).
-    if (!e.shiftKey) delta = Math.round(delta / DEFAULT_ANGLE_STEP) * DEFAULT_ANGLE_STEP
+    if (isAngleSnapActive()) {
+      delta = Math.round(delta / DEFAULT_ANGLE_STEP) * DEFAULT_ANGLE_STEP
+    }
 
     const entries = rotateGroupPatches(starts, links, pivot, delta)
     const patchById = new Map(entries)
@@ -586,11 +592,15 @@ export const FloorplanGroupSelectionBox = memo(function FloorplanGroupSelectionB
 }) {
   const selectedIds = useViewer((s) => s.selection.selectedIds)
   const levelId = useViewer((s) => s.selection.levelId)
+  const unit = useViewer((s) => s.unit)
+  const metricNotation = useViewer((s) => s.metricNotation)
   const nodes = useScene((s) => s.nodes)
   const delta = useFloorplanGroupDrag((s) => s.delta)
   const liveRotation = useFloorplanGroupDrag((s) => s.rotation)
   const movingNode = useMovingNode()
   const mode = useEditor((s) => s.mode)
+  const floorplanMode = useFloorplanMode((s) => s.mode)
+  const sceneRotationDeg = useFloorplanSceneRotation()
 
   // While a selection modifier is held the box steps aside so clicks reach
   // the entries underneath (toggle membership) instead of starting a drag.
@@ -613,6 +623,7 @@ export const FloorplanGroupSelectionBox = memo(function FloorplanGroupSelectionB
   // which lag the `nodes` commit by a frame or two.
   const meshEpoch = useMeshSettleEpoch(nodes)
   const box = useMemo(() => {
+    void meshEpoch
     if (selectedIds.length < 2 || !levelId) return null
     const participantIds = selectedIds.filter(
       (id) => classifyParticipant(nodes[id as AnyNodeId], levelId, nodes) !== null,
@@ -630,7 +641,6 @@ export const FloorplanGroupSelectionBox = memo(function FloorplanGroupSelectionB
       width: Math.abs(max.x - min.x),
       depth: Math.abs(max.z - min.z),
     }
-    // biome-ignore lint/correctness/useExhaustiveDependencies: meshEpoch re-measures settled meshes
   }, [selectedIds, levelId, nodes, meshEpoch])
 
   if (!box || movingNode || mode === 'delete') return null
@@ -638,6 +648,27 @@ export const FloorplanGroupSelectionBox = memo(function FloorplanGroupSelectionB
   const pad = 6 * unitsPerPixel
   const stroke = palette?.selectedStroke ?? '#3b82f6'
   const interactive = !modifierHeld && !!onPointerDown
+  const dimensionOffset = pad + 0.28
+  const widthDimension = {
+    kind: 'dimension',
+    start: [box.x, box.z + box.depth],
+    end: [box.x + box.width, box.z + box.depth],
+    offsetNormal: [0, 1],
+    offsetDistance: dimensionOffset,
+    extensionOvershoot: 0.08,
+    text: formatLinearMeasurement(box.width, unit, metricNotation),
+    stroke,
+  } satisfies Extract<FloorplanGeometry, { kind: 'dimension' }>
+  const depthDimension = {
+    kind: 'dimension',
+    start: [box.x + box.width, box.z],
+    end: [box.x + box.width, box.z + box.depth],
+    offsetNormal: [1, 0],
+    offsetDistance: dimensionOffset,
+    extensionOvershoot: 0.08,
+    text: formatLinearMeasurement(box.depth, unit, metricNotation),
+    stroke,
+  } satisfies Extract<FloorplanGeometry, { kind: 'dimension' }>
   // Mid-gesture the box rides the live delta (group move) or spins around the
   // rotation pivot (corner rotate) — SVG rotate() is degrees around a plan
   // point, and positive matches the atan2 x→z sense on the y-down plan.
@@ -664,6 +695,18 @@ export const FloorplanGroupSelectionBox = memo(function FloorplanGroupSelectionB
         x={box.x - pad}
         y={box.z - pad}
       />
+      {floorplanMode === 'default' ? (
+        <g pointerEvents="none">
+          <FloorplanDimensionRenderer
+            geometry={widthDimension}
+            sceneRotationDeg={sceneRotationDeg}
+          />
+          <FloorplanDimensionRenderer
+            geometry={depthDimension}
+            sceneRotationDeg={sceneRotationDeg}
+          />
+        </g>
+      ) : null}
       {/* Corner rotate handles — the 2D counterpart of the 3D rotate gizmo:
           drag a corner to spin the group (15° steps, Shift = free). */}
       {interactive && onRotatePointerDown

package/src/components/editor-2d/floorplan-measurement-tool-layer.tsx

@@ -786,6 +786,7 @@ export function FloorplanMeasurementToolLayer() {
   const draftLevelId = useMeasurementDraft((state) => state.levelId)
   const activeLevelId = useViewer((state) => state.selection.levelId)
   const unit = useViewer((state) => state.unit)
+  const metricNotation = useViewer((state) => state.metricNotation)
 
   useEffect(() => {
     if (active) {
@@ -1224,7 +1225,7 @@ export function FloorplanMeasurementToolLayer() {
         angle: Math.atan2(end[2] - start[2], end[0] - start[0]),
         point: [(start[0] + end[0]) / 2, 0, (start[2] + end[2]) / 2],
         screenUpright: false,
-        text: formatLinearMeasurement(measurementDistance(start, end), unit),
+        text: formatLinearMeasurement(measurementDistance(start, end), unit, metricNotation),
       }
     } else if (kind === 'angle' && livePoints.length >= 3) {
       const anglePoints = livePoints.slice(0, 3) as [
@@ -1248,7 +1249,7 @@ export function FloorplanMeasurementToolLayer() {
           text:
             kind === 'area'
               ? `A ${formatAreaLabel(measurementArea(livePoints), unit)}`
-              : `P ${formatLinearMeasurement(measurementPerimeter(livePoints), unit)}`,
+              : `P ${formatLinearMeasurement(measurementPerimeter(livePoints), unit, metricNotation)}`,
         }
       }
     } else if (kind === 'volume' && center && baseNormal) {
@@ -1280,7 +1281,11 @@ export function FloorplanMeasurementToolLayer() {
             (segmentStart[1] + segmentEnd[1]) / 2,
             (segmentStart[2] + segmentEnd[2]) / 2,
           ],
-          text: formatLinearMeasurement(measurementDistance(segmentStart, segmentEnd), unit),
+          text: formatLinearMeasurement(
+            measurementDistance(segmentStart, segmentEnd),
+            unit,
+            metricNotation,
+          ),
         }
       }
     }
@@ -1298,7 +1303,18 @@ export function FloorplanMeasurementToolLayer() {
       polygonPoints,
       segmentLabel,
     }
-  }, [axisGuide, baseNormal, extrusionHeight, hover, kind, points, stage, unit, vertexDrag])
+  }, [
+    axisGuide,
+    baseNormal,
+    extrusionHeight,
+    hover,
+    kind,
+    metricNotation,
+    points,
+    stage,
+    unit,
+    vertexDrag,
+  ])
 
   if (smartActive) return <FloorplanQuickMeasureLayer />
   if (!active || (draftLevelId && draftLevelId !== activeLevelId)) return null
@@ -1595,7 +1611,7 @@ export function FloorplanMeasurementToolLayer() {
           text={`${hover.semantic.label}${
             hover.semantic.length === null
               ? ''
-              : ` · ${formatLinearMeasurement(hover.semantic.length, unit)}`
+              : ` · ${formatLinearMeasurement(hover.semantic.length, unit, metricNotation)}`
           }`}
           textColor={labelText}
           unitsPerPixel={unitsPerPixel}

package/src/components/editor-2d/floorplan-registered-tool-layer.tsx

@@ -0,0 +1,72 @@
+'use client'
+
+import { createSceneApi, nodeRegistry, useScene } from '@pascal-app/core'
+import { useViewer } from '@pascal-app/viewer'
+import { type ComponentType, lazy, Suspense, useCallback, useMemo } from 'react'
+import {
+  type FloorplanToolContext,
+  getFloorplanNodeExtension,
+} from '../../lib/floorplan/floorplan-extension'
+import {
+  type FloorplanMode,
+  isFloorplanToolAvailableInMode,
+} from '../../lib/floorplan/floorplan-mode'
+import useEditor from '../../store/use-editor'
+import useFloorplanMode from '../../store/use-floorplan-mode'
+
+const lazyToolCache = new WeakMap<() => Promise<unknown>, ComponentType<FloorplanToolContext>>()
+
+function registeredFloorplanTool(
+  tool: string | null,
+  mode: FloorplanMode,
+): ComponentType<FloorplanToolContext> | null {
+  if (!tool) return null
+  const extension = getFloorplanNodeExtension(nodeRegistry.get(tool))
+  if (!isFloorplanToolAvailableInMode(extension?.availableModes, mode)) return null
+  const loader = extension?.tool
+  if (!loader) return null
+  const cached = lazyToolCache.get(loader)
+  if (cached) return cached
+  const component = lazy(loader)
+  lazyToolCache.set(loader, component)
+  return component
+}
+
+export function FloorplanRegisteredToolLayer() {
+  const mode = useEditor((state) => state.mode)
+  const tool = useEditor((state) => state.tool)
+  const floorplanMode = useFloorplanMode((state) => state.mode)
+  const gridSnapStep = useEditor((state) => state.gridSnapStep)
+  const toolDefaults = useEditor((state) =>
+    state.tool ? (state.toolDefaults[state.tool] ?? null) : null,
+  )
+  const activeLevelId = useViewer((state) => state.selection.levelId)
+  const unit = useViewer((state) => state.unit)
+  const metricNotation = useViewer((state) => state.metricNotation)
+  const sceneApi = useMemo(() => createSceneApi(useScene), [])
+  const selectNode = useCallback(
+    (id: Parameters<FloorplanToolContext['selectNode']>[0]) =>
+      useViewer.getState().setSelection({ selectedIds: [id] }),
+    [],
+  )
+  const finishTool = useCallback(() => {
+    useEditor.getState().setTool(null)
+    useEditor.getState().setMode('select')
+  }, [])
+  if (mode !== 'build') return null
+  const Tool = registeredFloorplanTool(tool, floorplanMode)
+  return Tool ? (
+    <Suspense fallback={null}>
+      <Tool
+        activeLevelId={activeLevelId}
+        finishTool={finishTool}
+        gridSnapStep={gridSnapStep}
+        metricNotation={metricNotation}
+        sceneApi={sceneApi}
+        selectNode={selectNode}
+        toolDefaults={toolDefaults}
+        unit={unit}
+      />
+    </Suspense>
+  ) : null
+}

package/src/components/editor-2d/floorplan-registry-action-menu.tsx

@@ -15,16 +15,27 @@ import {
   type WallNode,
 } from '@pascal-app/core'
 import { useViewer } from '@pascal-app/viewer'
-import { useEffect, useState } from 'react'
+import { type MouseEvent, useEffect, useState } from 'react'
 import { createPortal } from 'react-dom'
 import { useShallow } from 'zustand/react/shallow'
+import { useReducedMotion } from '../../hooks/use-reduced-motion'
+import { resolveMoveActionNode } from '../../lib/direct-manipulation'
+import { getFloorplanNodeExtension } from '../../lib/floorplan/floorplan-extension'
 import {
   createFreshPlacementSubtree,
   duplicatesAsFreshSubtree,
+  prepareFreshPlacementRootDuplicate,
 } from '../../lib/fresh-planar-placement'
+import { curveReshapeScope } from '../../lib/interaction/scope'
+import { playBlockedQuickActionFeedback } from '../../lib/quick-action-feedback'
+import { collectQuickActionNodeScope } from '../../lib/quick-action-nodes'
 import { sfxEmitter } from '../../lib/sfx-bus'
+import { cn } from '../../lib/utils'
 import useEditor from '../../store/use-editor'
-import { useMovingNode } from '../../store/use-interaction-scope'
+import useInteractionScope, {
+  useIsCurveReshape,
+  useMovingNode,
+} from '../../store/use-interaction-scope'
 import { NodeActionMenu } from '../editor/node-action-menu'
 import { IconRefGlyph } from '../ui/icon-ref'
 
@@ -80,26 +91,9 @@ function collectQuickActionNodes(
 ): Record<AnyNodeId, AnyNode> | null {
   if (!selectedId) return null
   const selected = nodes[selectedId as AnyNodeId]
-  if (!selected || !nodeRegistry.get(selected.type)?.quickActions) return null
-
-  const collected: Record<AnyNodeId, AnyNode> = { [selected.id as AnyNodeId]: selected }
-  const add = (id: string | null | undefined) => {
-    if (!id) return
-    const node = nodes[id as AnyNodeId]
-    if (node) collected[node.id as AnyNodeId] = node
-  }
-  const addChildren = (node: AnyNode | undefined) => {
-    for (const childId of (node as { children?: readonly string[] } | undefined)?.children ?? []) {
-      add(childId)
-    }
-  }
-
-  add(selected.parentId ?? null)
-  addChildren(selected)
-  const parent = selected.parentId ? nodes[selected.parentId as AnyNodeId] : undefined
-  addChildren(parent)
-
-  return collected
+  const def = selected ? nodeRegistry.get(selected.type) : undefined
+  if (!def?.quickActions) return null
+  return collectQuickActionNodeScope(nodes, selectedId, def.quickActionNodeScope)
 }
 
 /**
@@ -118,23 +112,27 @@ function collectQuickActionNodes(
  *    `<FloorplanRegistryMoveOverlay>` / dispatcher picks the right path.
  *    Walls are excluded — their move is reached via the side-arrow
  *    handles emitted from `def.floorplan`, not via a menu button.
+ *  - Curve (wall only): enters curve reshape mode. The selected wall's
+ *    midpoint curve handle remains visible so it can be dragged in plan.
  *  - Add hole (slab + ceiling only): inserts a small default-square
  *    hole at the polygon centroid via `updateNode`. Mirrors the legacy
  *    `handleAddHole` in `floating-action-menu.tsx`.
- *  - Duplicate: deep-clones the node, marks it new, sets it as the
- *    movingNode (placement cursor) — same UX pattern as 3D duplicate.
+ *  - Duplicate: creates a fresh subtree when the kind opts in, otherwise a
+ *    root-only copy, then hands that real draft to the placement cursor.
  *  - Delete: calls `deleteNode(id)`. Cascade is handled by the registry's
  *    `relations.cascadeDelete` if declared on the def.
  *
- * Hidden while in a move state (so we don't show buttons over a ghost).
+ * Hidden while moving or curving so the menu does not compete with the active affordance.
  */
 export function FloorplanRegistryActionMenu() {
+  const reducedMotion = useReducedMotion()
   // Sole selection only — a multi-selection gets the group menu
   // (`FloorplanGroupActionMenu`), whose actions target the whole selection.
   const selectedId = useViewer((s) =>
     s.selection.selectedIds.length === 1 ? s.selection.selectedIds[0] : undefined,
   ) as AnyNodeId | undefined
   const movingNode = useMovingNode()
+  const isCurveReshape = useIsCurveReshape()
   const setMovingNode = useEditor((s) => s.setMovingNode)
   const setMovingNodeOrigin = useEditor((s) => s.setMovingNodeOrigin)
   // Gate on floorplan hover so this 2D menu never coexists with the 3D
@@ -150,10 +148,28 @@ export function FloorplanRegistryActionMenu() {
   // Only show for registered kinds (skip legacy kinds — they have their
   // own FloorplanActionMenuLayer entries).
   const selectedKind = useScene((s) => (selectedId ? (s.nodes[selectedId]?.type ?? null) : null))
+  const canCurve = useScene((s) => {
+    if (!selectedId) return false
+    const selectedNode = s.nodes[selectedId]
+    if (!selectedNode) return false
+    const definition = nodeRegistry.get(selectedNode.type)
+    const canCurveNode = getFloorplanNodeExtension(definition)?.actionMenu?.canCurve
+    return (
+      !!definition?.floorplanAffordances?.curve &&
+      !!canCurveNode?.({
+        node: selectedNode as never,
+        nodes: s.nodes,
+      })
+    )
+  })
   const def = selectedKind ? nodeRegistry.get(selectedKind) : null
   const isRegistryKind = !!def
   const isVisible =
-    isRegistryKind && def?.presentation?.actionMenu !== false && !movingNode && isFloorplanHovered
+    isRegistryKind &&
+    def?.presentation?.actionMenu !== false &&
+    !movingNode &&
+    !isCurveReshape &&
+    isFloorplanHovered
   const isWall = selectedKind === 'wall'
   const quickActionNodes = useScene(
     useShallow((s) => collectQuickActionNodes(s.nodes, selectedId ?? null)),
@@ -241,7 +257,8 @@ export function FloorplanRegistryActionMenu() {
 
   const handleMove = () => {
     sfxEmitter.emit('sfx:item-pick')
-    setMovingNode(node as never)
+    const sceneNodes = useScene.getState().nodes
+    setMovingNode(resolveMoveActionNode(node, sceneNodes) as never)
     // 2D-owned move: `FloorplanRegistryMoveOverlay` runs the whole gesture.
     // Mark the origin (after `setMovingNode`, which resets it to null) so
     // `ToolManager` keeps the 3D affordance mover from also adopting the node
@@ -294,38 +311,40 @@ export function FloorplanRegistryActionMenu() {
     )
   }
 
+  const handleCurve = () => {
+    if (!canCurve) return
+    sfxEmitter.emit('sfx:item-pick')
+    useInteractionScope.getState().begin(curveReshapeScope(node.id))
+  }
+
   const handleDuplicate = () => {
     if (!node.parentId) return
     sfxEmitter.emit('sfx:item-pick')
     useScene.temporal.getState().pause()
-    if (duplicatesAsFreshSubtree(node as AnyNode)) {
-      const draftId = createFreshPlacementSubtree(node.id as AnyNodeId)
-      const draft = draftId ? useScene.getState().nodes[draftId] : null
-      if (draft) {
+    let draftId: AnyNodeId | null = null
+    try {
+      if (duplicatesAsFreshSubtree(node as AnyNode)) {
+        draftId = createFreshPlacementSubtree(node.id as AnyNodeId)
+        const draft = draftId ? useScene.getState().nodes[draftId] : null
+        if (!draft) return
         setMovingNode(draft as never)
-        setMovingNodeOrigin('2d')
-        useScene.temporal.getState().resume()
-        return
+      } else {
+        const cloned = prepareFreshPlacementRootDuplicate(node as AnyNode)
+        const parsed = def.schema.parse(cloned) as AnyNode
+        draftId = parsed.id as AnyNodeId
+        useScene.getState().createNode(parsed, node.parentId as AnyNodeId)
+        setMovingNode(parsed as never)
+      }
+      setMovingNodeOrigin('2d')
+      useViewer.getState().setSelection({ selectedIds: [] })
+    } catch (error) {
+      if (draftId && useScene.getState().nodes[draftId]) {
+        useScene.getState().deleteNode(draftId)
       }
+      console.error('Failed to duplicate node', error)
+    } finally {
       useScene.temporal.getState().resume()
-      return
     }
-    const cloned = structuredClone(node) as AnyNode & { id?: AnyNodeId }
-    delete (cloned as { id?: AnyNodeId }).id
-    const prevMeta =
-      cloned.metadata && typeof cloned.metadata === 'object' && !Array.isArray(cloned.metadata)
-        ? (cloned.metadata as Record<string, unknown>)
-        : {}
-    // Mark fresh + hand to the placement cursor so the copy follows the
-    // pointer and only lands on the next click — same gesture for every
-    // kind. Polyline runs (duct / pipe / lineset) ride the same path:
-    // `FloorplanRegistryMoveOverlay` translates their whole `path`, so they
-    // no longer need the old "offset + drop already-placed" special case.
-    cloned.metadata = { ...prevMeta, isNew: true }
-    const parsed = def.schema.parse(cloned) as AnyNode
-    useScene.getState().createNode(parsed, node.parentId as AnyNodeId)
-    setMovingNode(parsed as never)
-    useScene.temporal.getState().resume()
   }
 
   const handleDelete = () => {
@@ -334,8 +353,13 @@ export function FloorplanRegistryActionMenu() {
     useViewer.getState().setSelection({ selectedIds: [] })
   }
 
-  const handleQuickAction = (action: NodeQuickAction) => {
-    if (action.disabled) return
+  const handleQuickAction = (action: NodeQuickAction, event: MouseEvent<HTMLButtonElement>) => {
+    if (action.disabled) {
+      if (action.blockedFeedback) {
+        playBlockedQuickActionFeedback(event.currentTarget, reducedMotion)
+      }
+      return
+    }
     const run = () => action.run({ node, sceneApi: createSceneApi(useScene) })
     const result = action.history === 'single' ? runAsSingleSceneHistoryStep(useScene, run) : run()
     if (result?.selectedIds) useViewer.getState().setSelection({ selectedIds: result.selectedIds })
@@ -356,6 +380,7 @@ export function FloorplanRegistryActionMenu() {
     >
       <NodeActionMenu
         onAddHole={canAddHole ? handleAddHole : undefined}
+        onCurve={canCurve ? handleCurve : undefined}
         onDelete={canDelete ? handleDelete : undefined}
         onDuplicate={canDuplicate ? handleDuplicate : undefined}
         onMove={canMove ? handleMove : undefined}
@@ -370,18 +395,27 @@ export function FloorplanRegistryActionMenu() {
         >
           {quickActions.map((action) => (
             <button
+              aria-disabled={action.disabled || undefined}
               aria-label={action.title ?? action.label}
-              className="tooltip-trigger flex items-center gap-1.5 rounded-md px-2 py-1.5 text-xs text-muted-foreground transition-colors hover:bg-accent/60 hover:text-foreground disabled:cursor-not-allowed disabled:opacity-40 disabled:hover:bg-transparent disabled:hover:text-muted-foreground"
-              disabled={action.disabled}
+              className={cn(
+                'tooltip-trigger flex items-center rounded-md px-2 py-1.5 text-xs text-muted-foreground transition-colors hover:bg-accent/60 hover:text-foreground',
+                action.disabled &&
+                  'cursor-not-allowed opacity-40 hover:bg-transparent hover:text-muted-foreground',
+              )}
+              disabled={action.disabled && !action.blockedFeedback}
               key={action.id}
-              onClick={() => handleQuickAction(action)}
+              onClick={(event) => handleQuickAction(action, event)}
               title={action.title ?? action.label}
               type="button"
             >
-              <span className="flex h-3.5 w-3.5 shrink-0 items-center justify-center text-current">
-                <QuickActionIcon action={action} />
+              <span className="flex items-center gap-1.5" data-quick-action-feedback>
+                <span className="flex h-3.5 w-3.5 shrink-0 items-center justify-center text-current">
+                  <QuickActionIcon action={action} />
+                </span>
+                <span className="whitespace-nowrap leading-none" data-quick-action-label>
+                  {action.label}
+                </span>
               </span>
-              <span className="whitespace-nowrap leading-none">{action.label}</span>
             </button>
           ))}
         </div>

package/src/components/editor-2d/floorplan-registry-move-overlay.tsx

@@ -197,6 +197,10 @@ export function FloorplanRegistryMoveOverlay() {
 
       const commitFinalStateOrRevert = () => {
         const commitValid = session.canCommit()
+        const freshPlacement = isFreshPlacementMetadata(
+          (useScene.getState().nodes[movingNode.id] as { metadata?: unknown } | undefined)
+            ?.metadata,
+        )
 
         // Claim ownership of the drag teardown so the 3D move tool's
         // unmount-time cleanup skips its restore-from-snapshot — see
@@ -210,6 +214,29 @@ export function FloorplanRegistryMoveOverlay() {
         // planner). For those we still do Phase 1 (revert to baseline)
         // and Phase 2's resume — but Phase 2's write is delegated, and
         // we skip the snapshot-diff finalUpdates path.
+        if (commitValid && freshPlacement) {
+          session.commit?.()
+          const stagedNode = useScene.getState().nodes[movingNode.id]
+          const committedId = stagedNode
+            ? commitFreshPlacementSubtree(
+                movingNode.id as AnyNodeId,
+                {
+                  metadata: stripPlacementMetadataFlags(stagedNode.metadata),
+                  visible: true,
+                } as Partial<AnyNode>,
+              )
+            : null
+          if (historyPaused) {
+            resumeSceneHistory(useScene)
+            historyPaused = false
+          }
+          if (committedId) {
+            sfxEmitter.emit('sfx:item-place')
+            useViewer.getState().setSelection({ selectedIds: [committedId] })
+          }
+          return
+        }
+
         if (commitValid && session.commit) {
           useScene.getState().updateNodes(snapshotsToUpdates(snapshots))
           if (historyPaused) {

package/src/components/editor-2d/floorplan-render-context.test.ts

@@ -0,0 +1,27 @@
+import { describe, expect, test } from 'bun:test'
+import { createFloorplanRenderScaleReference } from './floorplan-render-context'
+
+describe('floorplan render context', () => {
+  test('updates the live scale without changing the registry-facing reader', () => {
+    const scale = createFloorplanRenderScaleReference(0.02)
+    const read = scale.read
+
+    scale.update(0.01)
+
+    expect(scale.read).toBe(read)
+    expect(read()).toBe(0.01)
+  })
+
+  test('notifies selected-handle renderers when a hidden floorplan becomes visible', () => {
+    const scale = createFloorplanRenderScaleReference(30)
+    let renderedCurveHandleRadius = 8 * scale.read()
+    const unsubscribe = scale.subscribe(() => {
+      renderedCurveHandleRadius = 8 * scale.read()
+    })
+
+    scale.update(0.02)
+
+    expect(renderedCurveHandleRadius).toBe(0.16)
+    unsubscribe()
+  })
+})