@@ -2302,20 +2302,41 @@ const WorkflowContent = React.memo(() => {
23022302 window . removeEventListener ( 'remove-from-subflow' , handleRemoveFromSubflow as EventListener )
23032303 } , [ blocks , edgesForDisplay , getNodeAbsolutePosition , collaborativeBatchUpdateParent ] )
23042304
2305+ /** Handles node changes - applies changes and resolves parent-child selection conflicts. */
2306+ const onNodesChange = useCallback (
2307+ ( changes : NodeChange [ ] ) => {
2308+ selectedIdsRef . current = null
2309+ setDisplayNodes ( ( nds ) => {
2310+ const updated = applyNodeChanges ( changes , nds )
2311+ const hasSelectionChange = changes . some ( ( c ) => c . type === 'select' )
2312+ if ( ! hasSelectionChange ) return updated
2313+ const resolved = resolveParentChildSelectionConflicts ( updated , blocks )
2314+ selectedIdsRef . current = resolved . filter ( ( node ) => node . selected ) . map ( ( node ) => node . id )
2315+ return resolved
2316+ } )
2317+ const selectedIds = selectedIdsRef . current as string [ ] | null
2318+ if ( selectedIds !== null ) {
2319+ syncPanelWithSelection ( selectedIds )
2320+ }
2321+ } ,
2322+ [ blocks ]
2323+ )
2324+
23052325 /**
2306- * Updates container dimensions in displayNodes during drag or keyboard movement.
2326+ * Updates container dimensions in displayNodes during drag.
2327+ * This allows live resizing of containers as their children are dragged.
23072328 */
2308- const updateContainerDimensionsDuringMove = useCallback (
2309- ( movedNodeId : string , movedNodePosition : { x : number ; y : number } ) => {
2310- const parentId = blocks [ movedNodeId ] ?. data ?. parentId
2329+ const updateContainerDimensionsDuringDrag = useCallback (
2330+ ( draggedNodeId : string , draggedNodePosition : { x : number ; y : number } ) => {
2331+ const parentId = blocks [ draggedNodeId ] ?. data ?. parentId
23112332 if ( ! parentId ) return
23122333
23132334 setDisplayNodes ( ( currentNodes ) => {
23142335 const childNodes = currentNodes . filter ( ( n ) => n . parentId === parentId )
23152336 if ( childNodes . length === 0 ) return currentNodes
23162337
23172338 const childPositions = childNodes . map ( ( node ) => {
2318- const nodePosition = node . id === movedNodeId ? movedNodePosition : node . position
2339+ const nodePosition = node . id === draggedNodeId ? draggedNodePosition : node . position
23192340 const { width, height } = getBlockDimensions ( node . id )
23202341 return { x : nodePosition . x , y : nodePosition . y , width, height }
23212342 } )
@@ -2346,34 +2367,6 @@ const WorkflowContent = React.memo(() => {
23462367 [ blocks , getBlockDimensions ]
23472368 )
23482369
2349- /** Handles node changes - applies changes and resolves parent-child selection conflicts. */
2350- const onNodesChange = useCallback (
2351- ( changes : NodeChange [ ] ) => {
2352- selectedIdsRef . current = null
2353- setDisplayNodes ( ( nds ) => {
2354- const updated = applyNodeChanges ( changes , nds )
2355- const hasSelectionChange = changes . some ( ( c ) => c . type === 'select' )
2356- if ( ! hasSelectionChange ) return updated
2357- const resolved = resolveParentChildSelectionConflicts ( updated , blocks )
2358- selectedIdsRef . current = resolved . filter ( ( node ) => node . selected ) . map ( ( node ) => node . id )
2359- return resolved
2360- } )
2361- const selectedIds = selectedIdsRef . current as string [ ] | null
2362- if ( selectedIds !== null ) {
2363- syncPanelWithSelection ( selectedIds )
2364- }
2365-
2366- // Handle position changes (e.g., from keyboard arrow key movement)
2367- // Update container dimensions when child nodes are moved
2368- for ( const change of changes ) {
2369- if ( change . type === 'position' && 'position' in change && change . position ) {
2370- updateContainerDimensionsDuringMove ( change . id , change . position )
2371- }
2372- }
2373- } ,
2374- [ blocks , updateContainerDimensionsDuringMove ]
2375- )
2376-
23772370 /**
23782371 * Effect to resize loops when nodes change (add/remove/position change).
23792372 * Runs on structural changes only - not during drag (position-only changes).
@@ -2618,7 +2611,7 @@ const WorkflowContent = React.memo(() => {
26182611
26192612 // If the node is inside a container, update container dimensions during drag
26202613 if ( currentParentId ) {
2621- updateContainerDimensionsDuringMove ( node . id , node . position )
2614+ updateContainerDimensionsDuringDrag ( node . id , node . position )
26222615 }
26232616
26242617 // Check if this is a starter block - starter blocks should never be in containers
@@ -2735,7 +2728,7 @@ const WorkflowContent = React.memo(() => {
27352728 blocks ,
27362729 getNodeAbsolutePosition ,
27372730 getNodeDepth ,
2738- updateContainerDimensionsDuringMove ,
2731+ updateContainerDimensionsDuringDrag ,
27392732 highlightContainerNode ,
27402733 ]
27412734 )
0 commit comments