@pascal-app/editor 1.0.0-beta.5 → 1.0.0

package/src/components/editor/selection-manager.tsx

@@ -11,6 +11,7 @@ import {
   getSelectableKinds,
   type ItemNode,
   isRegistrySelectable,
+  isSelectionHighlightEnabled,
   type NodeEvent,
   nodeRegistry,
   type RoofEvent,
@@ -31,6 +32,7 @@ import {
   createMaterial,
   createMaterialFromPresetRef,
   getRoofMaterialArray,
+  registerMaterialCacheCleanup,
   useViewer,
 } from '@pascal-app/viewer'
 import { useThree } from '@react-three/fiber'
@@ -39,10 +41,14 @@ import { type BufferGeometry, Color, type Material, type Mesh, type Object3D, Ve
 import {
   canDirectMoveNode,
   canDirectRotateNode,
+  pointerEventHitsEditorHandle,
+  resolveDirectManipulationNode,
   resolveDirectRotationDragDelta,
   resolveDirectRotationPatch,
+  shouldStartDirectMoveDrag,
 } from '../../lib/direct-manipulation'
 import { createEditorApi } from '../../lib/editor-api'
+import { selectionEnabled } from '../../lib/interaction/scope'
 import {
   type ActivePaintMaterial,
   buildRoofSegmentSurfaceMaterialPatch,
@@ -50,6 +56,11 @@ import {
   hasActivePaintMaterial,
   resolveActivePaintMaterialFromSelection,
 } from '../../lib/material-paint'
+import {
+  combinePaintPreviews,
+  createPaintPreviewOwner,
+  type PaintPreviewCleanup,
+} from '../../lib/paint-preview-owner'
 import {
   availablePaintScopes,
   commitPaintScopeFanout,
@@ -112,8 +123,6 @@ type SelectableNodeType =
   | 'window'
   | 'door'
 
-type PaintPreviewCleanup = () => void
-
 type PaintInteraction = {
   key: string
   apply: (() => void) | null
@@ -805,6 +814,7 @@ export const SelectionManager = () => {
     if (mode !== 'material-paint') return
     if (movingNode || isCurveReshape) return
 
+    const previewOwner = createPaintPreviewOwner()
     let activePreview: { key: string; restore: PaintPreviewCleanup } | null = null
     // The last hover event, replayed when the application scope cycles so the
     // preview + chip update under a stationary cursor (Shift fires no pointer move).
@@ -826,7 +836,7 @@ export const SelectionManager = () => {
         selectedMaterialTarget: useEditor.getState().selectedMaterialTarget,
       })
 
-    const getPaintInteraction = (event: NodeEvent): PaintInteraction | null => {
+    const resolvePaintInteraction = (event: NodeEvent): PaintInteraction | null => {
       const eraser = useEditor.getState().paintEraser
       const activePaintMaterial = resolveActivePaintMaterial()
       const node = event.node
@@ -949,27 +959,29 @@ export const SelectionManager = () => {
                   // paint capability builds the preview; restores combine.
                   const restores: PaintPreviewCleanup[] = []
                   const sceneNodes = useScene.getState().nodes
-                  for (const target of scopeTargets) {
-                    const targetNode = sceneNodes[target.nodeId]
-                    const targetRoot = getRegisteredNodeObject(target.nodeId)
-                    const targetCap = targetNode
-                      ? nodeRegistry.get(targetNode.type)?.capabilities?.paint
-                      : null
-                    if (!(targetNode && targetRoot && targetCap)) continue
-                    const restore = targetCap.applyPreview({
-                      node: targetNode,
-                      role: target.role,
-                      material: paintSpec.material,
-                      materialPreset: paintSpec.materialPreset,
-                      root: targetRoot,
-                    })
-                    if (restore) restores.push(restore)
+                  try {
+                    for (const target of scopeTargets) {
+                      const targetNode = sceneNodes[target.nodeId]
+                      const targetRoot = getRegisteredNodeObject(target.nodeId)
+                      const targetCap = targetNode
+                        ? nodeRegistry.get(targetNode.type)?.capabilities?.paint
+                        : null
+                      if (!(targetNode && targetRoot && targetCap)) continue
+                      const restore = targetCap.applyPreview({
+                        node: targetNode,
+                        role: target.role,
+                        material: paintSpec.material,
+                        materialPreset: paintSpec.materialPreset,
+                        root: targetRoot,
+                      })
+                      if (restore) restores.push(restore)
+                    }
+                  } catch (error) {
+                    combinePaintPreviews(restores)()
+                    throw error
                   }
                   if (restores.length === 0) return null
-                  return () => {
-                    for (let index = restores.length - 1; index >= 0; index -= 1)
-                      restores[index]?.()
-                  }
+                  return combinePaintPreviews(restores)
                 }
               : () => previewCursor('not-allowed'),
         }
@@ -1069,6 +1081,9 @@ export const SelectionManager = () => {
       return null
     }
 
+    const getPaintInteraction = (event: NodeEvent) =>
+      previewOwner.wrap(resolvePaintInteraction(event))
+
     const onEnter = (event: NodeEvent) => {
       // A host-driven drag (handle resize/rotate) sets `inputDragging`.
       // useNodeEvents now emits hover events during such a drag so surface
@@ -1239,8 +1254,10 @@ export const SelectionManager = () => {
     if (movingNode || isCurveReshape) return
 
     const onPointerDown = (event: NodeEvent) => {
+      if (!selectionEnabled(useInteractionScope.getState().scope)) return
       const pointer = pointerEventFromNodeEvent(event)
       if (pointer.button !== 0) return
+      const handleOwnsPointer = pointerEventHitsEditorHandle(event.nativeEvent)
 
       // Plain press on a transformable member of a multi-selection arms the
       // group move — dragging slides the whole selection on the ground plane
@@ -1248,6 +1265,7 @@ export const SelectionManager = () => {
       // group-move gizmo cross). A plain click (no drag) still falls through
       // to the normal click handling, which collapses to the pressed node.
       if (
+        !handleOwnsPointer &&
         !(pointer.shiftKey || pointer.altKey || isCommandModifier(pointer)) &&
         armGroupMove3d({
           nodeId: event.node.id as AnyNodeId,
@@ -1263,8 +1281,6 @@ export const SelectionManager = () => {
         return
       }
 
-      if (!isCommandModifier(pointer)) return
-
       const eventNode = useScene.getState().nodes[event.node.id as AnyNodeId] ?? event.node
       const node = resolveCanvasSelectionNode({
         node: eventNode,
@@ -1272,18 +1288,26 @@ export const SelectionManager = () => {
         selectedIds: useViewer.getState().selection.selectedIds,
       })
       if (!canDirectMoveNode(node)) return
-      // Sole selection only: per-node direct manipulation stands down for a
-      // multi-selection (the group sessions own plain drags there, and Cmd is
-      // the selection-toggle key — a wobbly Cmd+click must not yank one
-      // member out of the group).
       const currentSelectedIds = useViewer.getState().selection.selectedIds
-      if (currentSelectedIds.length !== 1 || currentSelectedIds[0] !== node.id) return
+      const allowPlainDrag = nodeRegistry.get(node.type)?.capabilities?.movable?.directDrag === true
+      if (
+        !shouldStartDirectMoveDrag({
+          allowPlainDrag,
+          commandModifier: isCommandModifier(pointer),
+          handleOwnsPointer,
+          nodeId: node.id,
+          selectedIds: currentSelectedIds,
+        })
+      ) {
+        return
+      }
 
       const startX = pointer.clientX
       const startY = pointer.clientY
       const pointerId = pointer.pointerId
       const pointerTarget = pointer.target instanceof EventTarget ? pointer.target : null
       let engaged = false
+      let engagedTargetId: AnyNodeId | null = null
 
       const cleanup = () => {
         window.removeEventListener('pointermove', onMove)
@@ -1305,8 +1329,9 @@ export const SelectionManager = () => {
         useViewer.getState().setInputDragging(true)
         swallowNextClick()
         createEditorApi().engageMoveDrag(node)
+        engagedTargetId = (getMovingNode()?.id as AnyNodeId | undefined) ?? null
         requestAnimationFrame(() => {
-          if (getMovingNode()?.id !== node.id) return
+          if (!getMovingNode()) return
           pointerTarget?.dispatchEvent(
             new PointerEvent('pointermove', {
               altKey: moveEvent.altKey,
@@ -1330,7 +1355,7 @@ export const SelectionManager = () => {
         if (engaged) {
           requestAnimationFrame(() => {
             const editor = useEditor.getState()
-            if (getMovingNode()?.id !== node.id || !editor.placementDragMode) return
+            if (getMovingNode()?.id !== engagedTargetId || !editor.placementDragMode) return
             editor.setMovingNode(null)
           })
         }
@@ -1392,7 +1417,7 @@ export const SelectionManager = () => {
       if (key === prevKey) return
       prevKey = key
       let wantsMove = false
-      if (hoveredId && !getMovingNode()) {
+      if (hoveredId && !getMovingNode() && selectionEnabled(useInteractionScope.getState().scope)) {
         if (sole === hoveredId) {
           const node = useScene.getState().nodes[sole as AnyNodeId]
           wantsMove = !!node && canDirectMoveNode(node)
@@ -1557,6 +1582,7 @@ export const SelectionManager = () => {
       // body click so only the reshape tool handles the release. (Scoped to
       // `endpoint`: hole-edit relies on node clicks to exit, just below.)
       const activeScope = useInteractionScope.getState().scope
+      if (activeScope.kind === 'mesh-editing') return
       if (activeScope.kind === 'reshaping' && activeScope.reshape === 'endpoint') return
 
       if (dispatchSceneAction(event.node, getEventObject(event))) {
@@ -1655,9 +1681,16 @@ export const SelectionManager = () => {
         const hasModifier = nativeEvent.shiftKey || isCommandModifier(nativeEvent)
         const isAlreadySole =
           selectedIdsBeforeRouting.length === 1 && selectedIdsBeforeRouting[0] === nodeToSelect.id
-        if (!hasModifier && isAlreadySole && !getMovingNode() && canDirectMoveNode(nodeToSelect)) {
+        if (
+          useEditor.getState().mode !== 'delete' &&
+          !hasModifier &&
+          isAlreadySole &&
+          !getMovingNode() &&
+          canDirectMoveNode(nodeToSelect)
+        ) {
           sfxEmitter.emit('sfx:item-pick')
-          useEditor.getState().setMovingNode(nodeToSelect as never)
+          const moveTarget = resolveDirectManipulationNode(nodeToSelect, useScene.getState().nodes)
+          useEditor.getState().setMovingNode(moveTarget as never)
           useViewer.getState().setSelection({ selectedIds: [] })
           return
         }
@@ -1773,6 +1806,7 @@ export const SelectionManager = () => {
     const onGridClick = (event: GridEvent) => {
       if (clickHandledRef.current) return
       if (boxSelectHandled) return
+      if (useInteractionScope.getState().scope.kind === 'mesh-editing') return
       const nativeEvent = event.nativeEvent
       if (nativeEvent?.metaKey || nativeEvent?.ctrlKey || nativeEvent?.shiftKey) return
       const { phase, structureLayer } = useEditor.getState()
@@ -1804,6 +1838,7 @@ export const SelectionManager = () => {
     if (movingNode || isCurveReshape) return
 
     const onEnter = (event: NodeEvent) => {
+      if (useInteractionScope.getState().scope.kind === 'mesh-editing') return
       // A host-driven drag (handle resize/rotate, box-select) sets
       // `inputDragging`. useNodeEvents still emits hover events during it so
       // surface move tools keep tracking — but the select-hover outline must
@@ -1852,6 +1887,7 @@ export const SelectionManager = () => {
     }
 
     const onDoubleClick = (event: NodeEvent) => {
+      if (useInteractionScope.getState().scope.kind === 'mesh-editing') return
       let node = resolveCanvasSelectionNode({
         node: resolveSelectModeNodeTarget(event),
         nodes: useScene.getState().nodes,
@@ -2119,6 +2155,7 @@ const SelectionMaterialSync = () => {
   const previewSelectedIds = useViewer((s) => s.previewSelectedIds)
   const hoveredId = useViewer((s) => s.hoveredId)
   const hoverHighlightMode = useViewer((s) => s.hoverHighlightMode)
+  const registryVersion = useRegistryVersion()
   const geometryRevision = useViewer((s) => s.geometryRevision)
   const activeHighlightKindsRef = useRef(new Map<string, HighlightKind>())
   const highlightedMaterialsRef = useRef(
@@ -2141,6 +2178,10 @@ const SelectionMaterialSync = () => {
         continue
       }
 
+      if (node && !isSelectionHighlightEnabled(node.type)) {
+        continue
+      }
+
       const rootObject = sceneRegistry.nodes.get(id)
       if (!rootObject) {
         continue
@@ -2196,6 +2237,7 @@ const SelectionMaterialSync = () => {
   }, [])
 
   useEffect(() => {
+    void registryVersion
     void geometryRevision
     const nextHighlightKinds = new Map<string, HighlightKind>()
 
@@ -2211,6 +2253,7 @@ const SelectionMaterialSync = () => {
     syncSelectionMaterials()
   }, [
     geometryRevision,
+    registryVersion,
     hoverHighlightMode,
     hoveredId,
     previewSelectedIds,
@@ -2251,7 +2294,7 @@ const SelectionMaterialSync = () => {
   }, [])
 
   useEffect(() => {
-    return () => {
+    const clearHighlights = () => {
       for (const [mesh, entry] of highlightedMaterialsRef.current.entries()) {
         if (mesh.material === entry.highlightedMaterial) {
           mesh.material = entry.originalMaterial
@@ -2261,6 +2304,11 @@ const SelectionMaterialSync = () => {
 
       highlightedMaterialsRef.current.clear()
     }
+    const unsubscribe = registerMaterialCacheCleanup(clearHighlights)
+    return () => {
+      unsubscribe()
+      clearHighlights()
+    }
   }, [])
 
   return null
@@ -2272,11 +2320,13 @@ const EditorOutlinerSync = () => {
   const previewSelectedIds = useViewer((s) => s.previewSelectedIds)
   const hoveredId = useViewer((s) => s.hoveredId)
   const geometryRevision = useViewer((s) => s.geometryRevision)
+  const registryVersion = useRegistryVersion()
   const outliner = useViewer((s) => s.outliner)
   const nodes = useScene((s) => s.nodes)
 
   useEffect(() => {
     void geometryRevision
+    void registryVersion
     let idsToHighlight: string[] = []
 
     // 1. Determine what should be highlighted based on Phase
@@ -2311,7 +2361,8 @@ const EditorOutlinerSync = () => {
     // 2. Sync with the imperative outliner arrays (mutate in place to keep references)
     outliner.selectedObjects.length = 0
     for (const id of idsToHighlight) {
-      if (!nodes[id as AnyNodeId]) continue
+      const node = nodes[id as AnyNodeId]
+      if (!(node && isSelectionHighlightEnabled(node.type))) continue
       const obj = sceneRegistry.nodes.get(id)
       if (obj?.parent) outliner.selectedObjects.push(obj)
     }
@@ -2322,14 +2373,25 @@ const EditorOutlinerSync = () => {
         useViewer.setState({ hoveredId: null })
       } else {
         const hoveredNode = nodes[hoveredId as AnyNodeId]
-        const obj =
-          hoveredNode?.type === 'roof-segment'
-            ? (getHoveredRoofSegmentOutlineProxy(hoveredId) ?? sceneRegistry.nodes.get(hoveredId))
-            : sceneRegistry.nodes.get(hoveredId)
-        if (obj?.parent) outliner.hoveredObjects.push(obj)
+        if (hoveredNode && isSelectionHighlightEnabled(hoveredNode.type)) {
+          const obj =
+            hoveredNode.type === 'roof-segment'
+              ? (getHoveredRoofSegmentOutlineProxy(hoveredId) ?? sceneRegistry.nodes.get(hoveredId))
+              : sceneRegistry.nodes.get(hoveredId)
+          if (obj?.parent) outliner.hoveredObjects.push(obj)
+        }
       }
     }
-  }, [geometryRevision, phase, previewSelectedIds, selection, hoveredId, outliner, nodes])
+  }, [
+    geometryRevision,
+    registryVersion,
+    phase,
+    previewSelectedIds,
+    selection,
+    hoveredId,
+    outliner,
+    nodes,
+  ])
 
   return null
 }