Ctrl + Click recursively expand/collapse node library folder (#613)

src/components/sidebar/tabs/NodeLibrarySidebarTab.vue

@@ -29,14 +29,7 @@
         :pt="{
           nodeLabel: 'node-lib-tree-node-label',
           nodeContent: ({ props }) => ({
-            onClick: () => {
+            onClick: (e: MouseEvent) => onNodeContentClick(e, props.node)
-              if (!props.node.key) return
-              if (props.node.type === 'folder') {
-                toggleNode(props.node.key)
-              } else {
-                insertNode(props.node.data)
-              }
-            }
           }),
           nodeChildren: ({ props }) => ({
             'data-comfy-node-name': props.node?.data?.name,
@@ -233,11 +226,19 @@ const handleNodeHover = async (
   }
 }
 
-const toggleNode = (id: string) => {
+const toggleNode = (node: TreeNode) => {
-  if (id in expandedKeys.value) {
+  if (node.key in expandedKeys.value) {
-    delete expandedKeys.value[id]
+    delete expandedKeys.value[node.key]
   } else {
-    expandedKeys.value[id] = true
+    expandedKeys.value[node.key] = true
+  }
+}
+
+const toggleNodeRecursive = (node: TreeNode) => {
+  if (node.key in expandedKeys.value) {
+    collapseNode(node)
+  } else {
+    expandNode(node)
   }
 }
 
@@ -270,6 +271,29 @@ const expandNode = (node: TreeNode) => {
     }
   }
 }
+
+const collapseNode = (node: TreeNode) => {
+  if (node.children && node.children.length) {
+    delete expandedKeys.value[node.key]
+
+    for (let child of node.children) {
+      collapseNode(child)
+    }
+  }
+}
+
+const onNodeContentClick = (e: MouseEvent, node: TreeNode) => {
+  if (!node.key) return
+  if (node.type === 'folder') {
+    if (e.ctrlKey) {
+      toggleNodeRecursive(node)
+    } else {
+      toggleNode(node)
+    }
+  } else {
+    insertNode(node.data)
+  }
+}
 </script>
 
 <style>