Comfy-Org
diff --git a/‎src/composables/canvas/useSelectionToolboxPosition.ts‎
Lines changed: 14 additions & 8 deletions b/‎src/composables/canvas/useSelectionToolboxPosition.ts‎
Lines changed: 14 additions & 8 deletions
diff --git a/‎src/renderer/extensions/vueNodes/composables/useNodeEventHandlers.ts‎
Lines changed: 87 additions & 36 deletions b/‎src/renderer/extensions/vueNodes/composables/useNodeEventHandlers.ts‎
Lines changed: 87 additions & 36 deletions
@@ -66,6 +66,14 @@ export function useSelectionToolboxPosition(
     lgCanvas.canvas
   )
 
+  // Unified dragging state - combines both LiteGraph and Vue node dragging
+  const isDragging = computed((): boolean => {
+    const litegraphDragging = canvasStore.canvas?.state?.draggingItems ?? false
+    const vueNodeDragging =
+      shouldRenderVueNodes.value && layoutStore.isDraggingVueNodes.value
+    return litegraphDragging || vueNodeDragging
+  })
+
   /**
    * Update position based on selection
    */
@@ -77,6 +85,12 @@ export function useSelectionToolboxPosition(
       return
     }
 
+    // Don't show toolbox while dragging
+    if (isDragging.value) {
+      visible.value = false
+      return
+    }
+
     visible.value = true
 
     // Get bounds for all selected items
@@ -241,14 +255,6 @@ export function useSelectionToolboxPosition(
     })
   }
 
-  // Unified dragging state - combines both LiteGraph and Vue node dragging
-  const isDragging = computed((): boolean => {
-    const litegraphDragging = canvasStore.canvas?.state?.draggingItems ?? false
-    const vueNodeDragging =
-      shouldRenderVueNodes.value && layoutStore.isDraggingVueNodes.value
-    return litegraphDragging || vueNodeDragging
-  })
-
   watch(isDragging, handleDragStateChange)
 
   onUnmounted(() => {
 
@@ -15,24 +15,7 @@ import { useVueNodeLifecycle } from '@/composables/graph/useVueNodeLifecycle'
 import { useCanvasStore } from '@/renderer/core/canvas/canvasStore'
 import { useCanvasInteractions } from '@/renderer/core/canvas/useCanvasInteractions'
 import { useNodeZIndex } from '@/renderer/extensions/vueNodes/composables/useNodeZIndex'
-import { isLGraphNode } from '@/utils/litegraphUtil'
-
-/**
- * Check if multiple nodes are selected
- * Optimized to return early when 2+ nodes found
- */
-function hasMultipleNodesSelected(selectedItems: unknown[]): boolean {
-  let count = 0
-  for (let i = 0; i < selectedItems.length; i++) {
-    if (isLGraphNode(selectedItems[i])) {
-      count++
-      if (count >= 2) {
-        return true
-      }
-    }
-  }
-  return false
-}
+import { isMultiSelectKey } from '@/renderer/extensions/vueNodes/utils/selectionUtils'
 
 function useNodeEventHandlersIndividual() {
   const canvasStore = useCanvasStore()
@@ -52,24 +35,19 @@ function useNodeEventHandlersIndividual() {
     const node = nodeManager.value.getNode(nodeData.id)
     if (!node) return
 
-    const isMultiSelect = event.ctrlKey || event.metaKey || event.shiftKey
+    const multiSelect = isMultiSelectKey(event)
+    const selectedItemsCount = canvasStore.selectedItems.length
+    const preserveExistingSelection =
+      !multiSelect && node.selected && selectedItemsCount > 1
 
-    if (isMultiSelect) {
-      // Ctrl/Cmd+click -> toggle selection
-      if (node.selected) {
-        canvasStore.canvas.deselect(node)
-      } else {
-        canvasStore.canvas.select(node)
-      }
-    } else {
-      const selectedMultipleNodes = hasMultipleNodesSelected(
-        canvasStore.selectedItems
-      )
-      if (!selectedMultipleNodes) {
-        // Single-select the node
-        canvasStore.canvas.deselectAll()
+    if (multiSelect) {
+      if (!node.selected) {
         canvasStore.canvas.select(node)
       }
+    } else if (!preserveExistingSelection) {
+      // Regular click -> single select
+      canvasStore.canvas.deselectAll()
+      canvasStore.canvas.select(node)
     }
 
     // Bring node to front when clicked (similar to LiteGraph behavior)
@@ -219,6 +197,32 @@ function useNodeEventHandlersIndividual() {
     canvasStore.updateSelectedItems()
   }
 
+  /**
+   * Ensure node is selected for shift-drag operations
+   * Handles special logic for promoting a node to selection when shift-dragging
+   * @param event - The pointer event (for multi-select key detection)
+   * @param nodeData - The node data for the node being dragged
+   * @param wasSelectedAtPointerDown - Whether the node was selected when pointer-down occurred
+   */
+  const ensureNodeSelectedForShiftDrag = (
+    event: PointerEvent,
+    nodeData: VueNodeData,
+    wasSelectedAtPointerDown: boolean
+  ) => {
+    if (wasSelectedAtPointerDown) return
+
+    const multiSelectKeyPressed = isMultiSelectKey(event)
+    if (!multiSelectKeyPressed) return
+
+    if (!canvasStore.canvas || !nodeManager.value) return
+    const node = nodeManager.value.getNode(nodeData.id)
+    if (!node || node.selected) return
+
+    const selectionCount = canvasStore.selectedItems.length
+    const addToSelection = selectionCount > 0
+    selectNodes([nodeData.id], addToSelection)
+  }
+
   /**
    * Deselect specific nodes
    */
@@ -229,14 +233,58 @@ function useNodeEventHandlersIndividual() {
 
     nodeIds.forEach((nodeId) => {
       const node = nodeManager.value?.getNode(nodeId)
-      if (node) {
-        node.selected = false
+      if (node && canvasStore.canvas) {
+        canvasStore.canvas.deselect(node)
       }
     })
 
     canvasStore.updateSelectedItems()
   }
 
+  const deselectNode = (nodeId: string) => {
+    const node = nodeManager.value?.getNode(nodeId)
+    if (node) {
+      canvasStore.canvas?.deselect(node)
+      canvasStore.updateSelectedItems()
+    }
+  }
+
+  const toggleNodeSelectionAfterPointerUp = (
+    nodeId: string,
+    {
+      wasSelectedAtPointerDown,
+      multiSelect
+    }: {
+      wasSelectedAtPointerDown: boolean
+      multiSelect: boolean
+    }
+  ) => {
+    if (!shouldHandleNodePointerEvents.value) return
+
+    if (!canvasStore.canvas || !nodeManager.value) return
+
+    const node = nodeManager.value.getNode(nodeId)
+    if (!node) return
+
+    if (!multiSelect) {
+      const multipleSelected = canvasStore.selectedItems.length > 1
+      if (multipleSelected && wasSelectedAtPointerDown) {
+        canvasStore.canvas.deselectAll()
+        canvasStore.canvas.select(node)
+        canvasStore.updateSelectedItems()
+      }
+      return
+    }
+
+    if (wasSelectedAtPointerDown) {
+      canvasStore.canvas.deselect(node)
+      canvasStore.updateSelectedItems()
+    }
+
+    // No action needed when the node was not previously selected since the pointer-down
+    // handler already added it to the selection.
+  }
+
   return {
     // Core event handlers
     handleNodeSelect,
@@ -248,7 +296,10 @@ function useNodeEventHandlersIndividual() {
 
     // Batch operations
     selectNodes,
-    deselectNodes
+    deselectNodes,
+    deselectNode,
+    ensureNodeSelectedForShiftDrag,
+    toggleNodeSelectionAfterPointerUp
   }
 }