@uipath/apollo-react 3.41.1 → 3.42.1

package/dist/canvas/components/StageNode/StageNode.cjs

@@ -47,7 +47,7 @@ const external_StageNode_styles_cjs_namespaceObject = require("./StageNode.style
 const external_StageNode_utils_cjs_namespaceObject = require("./StageNode.utils.cjs");
 const external_StageNodeTaskUtilities_cjs_namespaceObject = require("./StageNodeTaskUtilities.cjs");
 const StageNodeComponent = (props)=>{
-    const { dragging, selected, id, width, execution, stageDetails, addTaskLabel = 'Add task', addTaskLoading = false, replaceTaskLabel = 'Replace task', taskOptions = [], menuItems, onStageClick, onTaskAdd, onAddTaskFromToolbox, onTaskToolboxSearch, onTaskClick, onTaskGroupModification, onStageTitleChange, onTaskReorder, onTaskReplace } = props;
+    const { dragging, selected, id, width, execution, stageDetails, addTaskLabel = 'Add task', addTaskLoading = false, replaceTaskLabel = 'Replace task', taskOptions = [], menuItems, pendingReplaceTask, onStageClick, onTaskAdd, onAddTaskFromToolbox, onTaskToolboxSearch, onTaskClick, onTaskGroupModification, onStageTitleChange, onTaskReorder, onReplaceTaskFromToolbox } = props;
     const taskWidth = width ? width - external_StageNode_styles_cjs_namespaceObject.STAGE_CONTENT_INSET : void 0;
     const tasks = (0, external_react_namespaceObject.useMemo)(()=>stageDetails?.tasks || [], [
         stageDetails?.tasks
@@ -88,6 +88,20 @@ const StageNodeComponent = (props)=>{
     const connectedHandleIds = (0, ConnectedHandlesContext_cjs_namespaceObject.useConnectedHandles)(id);
     const [isAddingTask, setIsAddingTask] = (0, external_react_namespaceObject.useState)(false);
     const [isReplacingTask, setIsReplacingTask] = (0, external_react_namespaceObject.useState)(false);
+    (0, external_react_namespaceObject.useEffect)(()=>{
+        if (pendingReplaceTask?.groupIndex != null && pendingReplaceTask?.taskIndex != null) {
+            const taskGroup = tasks[pendingReplaceTask.groupIndex];
+            taskStateReference.current = {
+                isParallel: (taskGroup?.length ?? 0) > 1,
+                groupIndex: pendingReplaceTask.groupIndex,
+                taskIndex: pendingReplaceTask.taskIndex
+            };
+            setIsReplacingTask(true);
+        }
+    }, [
+        pendingReplaceTask,
+        tasks
+    ]);
     const [activeDragId, setActiveDragId] = (0, external_react_namespaceObject.useState)(null);
     const [offsetLeft, setOffsetLeft] = (0, external_react_namespaceObject.useState)(0);
     const [overId, setOverId] = (0, external_react_namespaceObject.useState)(null);
@@ -187,7 +201,7 @@ const StageNodeComponent = (props)=>{
     ]);
     const contextMenuItems = (0, external_react_namespaceObject.useCallback)((isParallel, groupIndex, taskIndex, tasksLength, taskGroupLength, isAboveParallel, isBelowParallel)=>{
         const items = [];
-        if (onTaskReplace) items.push((0, external_StageNodeTaskUtilities_cjs_namespaceObject.getMenuItem)('replace-task', 'Replace Task', ()=>setIsReplacingTask(true)));
+        if (onReplaceTaskFromToolbox) items.push((0, external_StageNodeTaskUtilities_cjs_namespaceObject.getMenuItem)('replace-task', 'Replace Task', ()=>setIsReplacingTask(true)));
         if (onTaskGroupModification) {
             const reGroupOptions = (0, external_StageNodeTaskUtilities_cjs_namespaceObject.getContextMenuItems)(isParallel, groupIndex, tasksLength, taskIndex, taskGroupLength, isAboveParallel, isBelowParallel, reGroupTaskFunction);
             return [
@@ -197,7 +211,7 @@ const StageNodeComponent = (props)=>{
         }
         return items;
     }, [
-        onTaskReplace,
+        onReplaceTaskFromToolbox,
         onTaskGroupModification,
         reGroupTaskFunction
     ]);
@@ -237,11 +251,12 @@ const StageNodeComponent = (props)=>{
         id
     ]);
     const handleReplaceTaskToolboxItemSelected = (0, external_react_namespaceObject.useCallback)((item)=>{
-        onTaskReplace?.(item, taskStateReference.current.groupIndex, taskStateReference.current.taskIndex);
+        setIsReplacingTask(true);
+        onReplaceTaskFromToolbox?.(item, taskStateReference.current.groupIndex, taskStateReference.current.taskIndex);
         setIsReplacingTask(false);
         setSelectedNodeId(id);
     }, [
-        onTaskReplace,
+        onReplaceTaskFromToolbox,
         setSelectedNodeId,
         id
     ]);
@@ -512,7 +527,7 @@ const StageNodeComponent = (props)=>{
                                                                     projectedDepth: task.id === activeDragId && projected ? projected.depth : void 0,
                                                                     isDragDisabled: !onTaskReorder,
                                                                     zoom: zoom,
-                                                                    ...(onTaskGroupModification || onTaskReplace) && {
+                                                                    ...(onTaskGroupModification || onReplaceTaskFromToolbox) && {
                                                                         onMenuOpen: ()=>{
                                                                             taskStateReference.current = {
                                                                                 isParallel,
@@ -579,7 +594,7 @@ const StageNodeComponent = (props)=>{
                     onSearch: onTaskToolboxSearch
                 })
             }),
-            onTaskReplace && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_FloatingCanvasPanel_index_cjs_namespaceObject.FloatingCanvasPanel, {
+            onReplaceTaskFromToolbox && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_FloatingCanvasPanel_index_cjs_namespaceObject.FloatingCanvasPanel, {
                 open: isReplacingTask,
                 nodeId: id,
                 offset: 15,

package/dist/canvas/components/StageNode/StageNode.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StageNode.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageNode.tsx"],"names":[],"mappings":"AAsDA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAwnBxD,eAAO,MAAM,SAAS,8CA9mBa,cAAc,6CA8mBA,CAAC"}
+{"version":3,"file":"StageNode.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageNode.tsx"],"names":[],"mappings":"AAsDA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAuoBxD,eAAO,MAAM,SAAS,8CA7nBa,cAAc,6CA6nBA,CAAC"}

package/dist/canvas/components/StageNode/StageNode.js

@@ -19,7 +19,7 @@ import { INDENTATION_WIDTH, STAGE_CONTENT_INSET, StageContainer, StageContent, S
 import { flattenTasks, getProjection, reorderTasks } from "./StageNode.utils.js";
 import { getContextMenuItems, getMenuItem } from "./StageNodeTaskUtilities.js";
 const StageNodeComponent = (props)=>{
-    const { dragging, selected, id, width, execution, stageDetails, addTaskLabel = 'Add task', addTaskLoading = false, replaceTaskLabel = 'Replace task', taskOptions = [], menuItems, onStageClick, onTaskAdd, onAddTaskFromToolbox, onTaskToolboxSearch, onTaskClick, onTaskGroupModification, onStageTitleChange, onTaskReorder, onTaskReplace } = props;
+    const { dragging, selected, id, width, execution, stageDetails, addTaskLabel = 'Add task', addTaskLoading = false, replaceTaskLabel = 'Replace task', taskOptions = [], menuItems, pendingReplaceTask, onStageClick, onTaskAdd, onAddTaskFromToolbox, onTaskToolboxSearch, onTaskClick, onTaskGroupModification, onStageTitleChange, onTaskReorder, onReplaceTaskFromToolbox } = props;
     const taskWidth = width ? width - STAGE_CONTENT_INSET : void 0;
     const tasks = useMemo(()=>stageDetails?.tasks || [], [
         stageDetails?.tasks
@@ -60,6 +60,20 @@ const StageNodeComponent = (props)=>{
     const connectedHandleIds = useConnectedHandles(id);
     const [isAddingTask, setIsAddingTask] = useState(false);
     const [isReplacingTask, setIsReplacingTask] = useState(false);
+    useEffect(()=>{
+        if (pendingReplaceTask?.groupIndex != null && pendingReplaceTask?.taskIndex != null) {
+            const taskGroup = tasks[pendingReplaceTask.groupIndex];
+            taskStateReference.current = {
+                isParallel: (taskGroup?.length ?? 0) > 1,
+                groupIndex: pendingReplaceTask.groupIndex,
+                taskIndex: pendingReplaceTask.taskIndex
+            };
+            setIsReplacingTask(true);
+        }
+    }, [
+        pendingReplaceTask,
+        tasks
+    ]);
     const [activeDragId, setActiveDragId] = useState(null);
     const [offsetLeft, setOffsetLeft] = useState(0);
     const [overId, setOverId] = useState(null);
@@ -159,7 +173,7 @@ const StageNodeComponent = (props)=>{
     ]);
     const contextMenuItems = useCallback((isParallel, groupIndex, taskIndex, tasksLength, taskGroupLength, isAboveParallel, isBelowParallel)=>{
         const items = [];
-        if (onTaskReplace) items.push(getMenuItem('replace-task', 'Replace Task', ()=>setIsReplacingTask(true)));
+        if (onReplaceTaskFromToolbox) items.push(getMenuItem('replace-task', 'Replace Task', ()=>setIsReplacingTask(true)));
         if (onTaskGroupModification) {
             const reGroupOptions = getContextMenuItems(isParallel, groupIndex, tasksLength, taskIndex, taskGroupLength, isAboveParallel, isBelowParallel, reGroupTaskFunction);
             return [
@@ -169,7 +183,7 @@ const StageNodeComponent = (props)=>{
         }
         return items;
     }, [
-        onTaskReplace,
+        onReplaceTaskFromToolbox,
         onTaskGroupModification,
         reGroupTaskFunction
     ]);
@@ -209,11 +223,12 @@ const StageNodeComponent = (props)=>{
         id
     ]);
     const handleReplaceTaskToolboxItemSelected = useCallback((item)=>{
-        onTaskReplace?.(item, taskStateReference.current.groupIndex, taskStateReference.current.taskIndex);
+        setIsReplacingTask(true);
+        onReplaceTaskFromToolbox?.(item, taskStateReference.current.groupIndex, taskStateReference.current.taskIndex);
         setIsReplacingTask(false);
         setSelectedNodeId(id);
     }, [
-        onTaskReplace,
+        onReplaceTaskFromToolbox,
         setSelectedNodeId,
         id
     ]);
@@ -484,7 +499,7 @@ const StageNodeComponent = (props)=>{
                                                                     projectedDepth: task.id === activeDragId && projected ? projected.depth : void 0,
                                                                     isDragDisabled: !onTaskReorder,
                                                                     zoom: zoom,
-                                                                    ...(onTaskGroupModification || onTaskReplace) && {
+                                                                    ...(onTaskGroupModification || onReplaceTaskFromToolbox) && {
                                                                         onMenuOpen: ()=>{
                                                                             taskStateReference.current = {
                                                                                 isParallel,
@@ -551,7 +566,7 @@ const StageNodeComponent = (props)=>{
                     onSearch: onTaskToolboxSearch
                 })
             }),
-            onTaskReplace && /*#__PURE__*/ jsx(FloatingCanvasPanel, {
+            onReplaceTaskFromToolbox && /*#__PURE__*/ jsx(FloatingCanvasPanel, {
                 open: isReplacingTask,
                 nodeId: id,
                 offset: 15,

package/dist/canvas/components/StageNode/StageNode.stories.cjs

@@ -36,12 +36,13 @@ __webpack_require__.d(__webpack_exports__, {
 });
 const jsx_runtime_namespaceObject = require("react/jsx-runtime");
 const react_cjs_namespaceObject = require("../../xyflow/react.cjs");
+const index_cjs_namespaceObject = require("../../../material/components/index.cjs");
 const external_react_namespaceObject = require("react");
 const external_types_cjs_namespaceObject = require("../../types.cjs");
-const index_cjs_namespaceObject = require("../BaseCanvas/index.cjs");
+const GroupModificationUtils_cjs_namespaceObject = require("../../utils/GroupModificationUtils.cjs");
+const external_BaseCanvas_index_cjs_namespaceObject = require("../BaseCanvas/index.cjs");
 const external_CanvasPositionControls_cjs_namespaceObject = require("../CanvasPositionControls.cjs");
 const external_TaskIcon_index_cjs_namespaceObject = require("../TaskIcon/index.cjs");
-const GroupModificationUtils_cjs_namespaceObject = require("../utils/GroupModificationUtils.cjs");
 const external_StageConnectionEdge_cjs_namespaceObject = require("./StageConnectionEdge.cjs");
 const external_StageEdge_cjs_namespaceObject = require("./StageEdge.cjs");
 const external_StageNode_cjs_namespaceObject = require("./StageNode.cjs");
@@ -101,7 +102,7 @@ const meta = {
                     height: '100vh'
                 },
                 children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_cjs_namespaceObject.ReactFlowProvider, {
-                    children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_cjs_namespaceObject.BaseCanvas, {
+                    children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_BaseCanvas_index_cjs_namespaceObject.BaseCanvas, {
                         nodes: nodes,
                         edges: edges,
                         onNodesChange: onNodesChange,
@@ -1286,7 +1287,7 @@ const DraggableTaskReorderingStory = ()=>{
             height: '100vh'
         },
         children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_cjs_namespaceObject.ReactFlowProvider, {
-            children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_cjs_namespaceObject.BaseCanvas, {
+            children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_BaseCanvas_index_cjs_namespaceObject.BaseCanvas, {
                 nodes: nodesWithHandler,
                 edges: edges,
                 onNodesChange: onNodesChange,
@@ -1407,20 +1408,51 @@ const AddAndReplaceTasksStory = ()=>{
     const edgeTypes = (0, external_react_namespaceObject.useMemo)(()=>({
             stage: external_StageEdge_cjs_namespaceObject.StageEdge
         }), []);
-    const [tasks, setTasks] = (0, external_react_namespaceObject.useState)(initialTasksForAddReplace);
+    const [pendingReplaceTask, setPendingReplaceTask] = (0, external_react_namespaceObject.useState)();
+    const [selectedTaskId, setSelectedTaskId] = (0, external_react_namespaceObject.useState)();
+    const [menuAnchorEl, setMenuAnchorEl] = (0, external_react_namespaceObject.useState)(null);
+    const [nodesState, setNodes, onNodesChange] = (0, react_cjs_namespaceObject.useNodesState)([
+        {
+            id: 'add-replace-stage',
+            type: 'stage',
+            position: {
+                x: 320,
+                y: 96
+            },
+            data: {
+                stageDetails: {
+                    label: 'Add, Replace, and Group Tasks',
+                    tasks: initialTasksForAddReplace
+                },
+                taskOptions: availableTaskOptions
+            }
+        }
+    ]);
+    const [edges, setEdges, onEdgesChange] = (0, react_cjs_namespaceObject.useEdgesState)([]);
     const handleAddTask = (0, external_react_namespaceObject.useCallback)((taskItem)=>{
         const newTask = {
             id: `${taskItem.id}-${Date.now()}`,
             label: taskItem.name,
             icon: taskItem.icon?.Component ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(taskItem.icon.Component, {}) : void 0
         };
-        setTasks((prevTasks)=>[
-                ...prevTasks,
-                [
-                    newTask
-                ]
-            ]);
-    }, []);
+        setNodes((prevNodes)=>prevNodes.map((node)=>'add-replace-stage' === node.id ? {
+                    ...node,
+                    data: {
+                        ...node.data,
+                        stageDetails: {
+                            ...node.data.stageDetails,
+                            tasks: [
+                                ...node.data.stageDetails.tasks,
+                                [
+                                    newTask
+                                ]
+                            ]
+                        }
+                    }
+                } : node));
+    }, [
+        setNodes
+    ]);
     const handleReplaceTask = (0, external_react_namespaceObject.useCallback)((taskItem, groupIndex, taskIndex)=>{
         if (groupIndex < 0 || taskIndex < 0) return;
         const listItem = taskItem;
@@ -1429,71 +1461,118 @@ const AddAndReplaceTasksStory = ()=>{
             label: listItem.name,
             icon: listItem.icon?.Component ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(listItem.icon.Component, {}) : void 0
         };
-        setTasks((prevTasks)=>{
-            if (groupIndex >= prevTasks.length) return prevTasks;
-            const currentGroup = prevTasks[groupIndex];
-            if (!currentGroup || taskIndex >= currentGroup.length) return prevTasks;
-            const updatedTasks = prevTasks.map((group, gIdx)=>{
-                if (gIdx === groupIndex) return group.map((task, tIdx)=>tIdx === taskIndex ? replacedTask : task);
-                return group;
-            });
-            return updatedTasks;
-        });
+        setNodes((prevNodes)=>prevNodes.map((node)=>{
+                if ('add-replace-stage' !== node.id) return node;
+                const prevTasks = node.data.stageDetails.tasks;
+                if (groupIndex >= prevTasks.length) return node;
+                const currentGroup = prevTasks[groupIndex];
+                if (!currentGroup || taskIndex >= currentGroup.length) return node;
+                const updatedTasks = prevTasks.map((group, gIdx)=>{
+                    if (gIdx === groupIndex) return group.map((task, tIdx)=>tIdx === taskIndex ? replacedTask : task);
+                    return group;
+                });
+                return {
+                    ...node,
+                    data: {
+                        ...node.data,
+                        stageDetails: {
+                            ...node.data.stageDetails,
+                            tasks: updatedTasks
+                        }
+                    }
+                };
+            }));
+        setPendingReplaceTask(void 0);
     }, [
-        setTasks
+        setNodes
     ]);
     const groupModificationHandlers = (0, external_react_namespaceObject.useMemo)(()=>(0, GroupModificationUtils_cjs_namespaceObject.createGroupModificationHandlers)(), []);
     const handleTaskGroupModification = (0, external_react_namespaceObject.useCallback)((groupModificationType, groupIndex, taskIndex)=>{
         const handler = (0, GroupModificationUtils_cjs_namespaceObject.getHandlerForModificationType)(groupModificationHandlers, groupModificationType);
-        setTasks((prevTasks)=>handler(prevTasks, groupIndex, taskIndex));
+        setNodes((prevNodes)=>prevNodes.map((node)=>{
+                if ('add-replace-stage' !== node.id) return node;
+                const prevTasks = node.data.stageDetails.tasks;
+                const updatedTasks = handler(prevTasks, groupIndex, taskIndex);
+                return {
+                    ...node,
+                    data: {
+                        ...node.data,
+                        stageDetails: {
+                            ...node.data.stageDetails,
+                            tasks: updatedTasks
+                        }
+                    }
+                };
+            }));
     }, [
         groupModificationHandlers,
-        setTasks
+        setNodes
     ]);
-    const nodes = (0, external_react_namespaceObject.useMemo)(()=>[
-            {
-                id: 'add-replace-stage',
-                type: 'stage',
-                position: {
-                    x: 320,
-                    y: 96
-                },
+    const handleTaskClick = (0, external_react_namespaceObject.useCallback)((taskId)=>{
+        setSelectedTaskId(taskId);
+    }, []);
+    const currentTasks = nodesState.find((n)=>'add-replace-stage' === n.id)?.data.stageDetails.tasks || [];
+    const taskMenuItems = (0, external_react_namespaceObject.useMemo)(()=>currentTasks.flatMap((group, groupIndex)=>group.map((task, taskIndex)=>({
+                    title: task.label,
+                    variant: 'item',
+                    startIcon: task.icon,
+                    onClick: ()=>{
+                        setSelectedTaskId(task.id);
+                        setPendingReplaceTask({
+                            groupIndex,
+                            taskIndex
+                        });
+                        setMenuAnchorEl(null);
+                    }
+                }))), [
+        currentTasks
+    ]);
+    const nodesWithMetadata = (0, external_react_namespaceObject.useMemo)(()=>nodesState.map((node)=>'add-replace-stage' === node.id ? {
+                ...node,
                 data: {
+                    ...node.data,
+                    pendingReplaceTask: pendingReplaceTask,
                     stageDetails: {
-                        label: 'Add, Replace, and Group Tasks',
-                        tasks: tasks
+                        ...node.data.stageDetails,
+                        selectedTasks: selectedTaskId ? [
+                            selectedTaskId
+                        ] : void 0
                     },
-                    taskOptions: availableTaskOptions,
                     onAddTaskFromToolbox: handleAddTask,
-                    onTaskReplace: handleReplaceTask,
-                    onTaskGroupModification: handleTaskGroupModification
+                    onReplaceTaskFromToolbox: handleReplaceTask,
+                    onTaskGroupModification: handleTaskGroupModification,
+                    onTaskClick: handleTaskClick
                 }
-            }
-        ], [
-        tasks,
+            } : node), [
+        nodesState,
+        pendingReplaceTask,
+        selectedTaskId,
         handleAddTask,
         handleReplaceTask,
-        handleTaskGroupModification
-    ]);
-    const [nodesState, setNodes, onNodesChange] = (0, react_cjs_namespaceObject.useNodesState)(nodes);
-    const [edges, setEdges, onEdgesChange] = (0, react_cjs_namespaceObject.useEdgesState)([]);
-    (0, external_react_namespaceObject.useEffect)(()=>{
-        setNodes(nodes);
-    }, [
-        nodes,
-        setNodes
+        handleTaskGroupModification,
+        handleTaskClick
     ]);
     const onConnect = (0, external_react_namespaceObject.useCallback)((connection)=>setEdges((eds)=>(0, react_cjs_namespaceObject.addEdge)(connection, eds)), [
         setEdges
     ]);
+    const replaceButtonLabel = (0, external_react_namespaceObject.useMemo)(()=>{
+        if (pendingReplaceTask) {
+            const taskBeingReplaced = currentTasks[pendingReplaceTask.groupIndex]?.[pendingReplaceTask.taskIndex];
+            if (taskBeingReplaced) return `Replacing Task: ${taskBeingReplaced.label}`;
+        }
+        return 'Replace Task';
+    }, [
+        pendingReplaceTask,
+        currentTasks
+    ]);
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
         style: {
             width: '100vw',
             height: '100vh'
         },
         children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_cjs_namespaceObject.ReactFlowProvider, {
-            children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_cjs_namespaceObject.BaseCanvas, {
-                nodes: nodesState,
+            children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_BaseCanvas_index_cjs_namespaceObject.BaseCanvas, {
+                nodes: nodesWithMetadata,
                 edges: edges,
                 onNodesChange: onNodesChange,
                 onEdgesChange: onEdgesChange,
@@ -1512,12 +1591,33 @@ const AddAndReplaceTasksStory = ()=>{
                     y: 0,
                     zoom: 1.5
                 },
-                children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_cjs_namespaceObject.Panel, {
-                    position: "bottom-right",
-                    children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_CanvasPositionControls_cjs_namespaceObject.CanvasPositionControls, {
-                        translations: external_types_cjs_namespaceObject.DefaultCanvasTranslations
+                children: [
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(react_cjs_namespaceObject.Panel, {
+                        position: "top-right",
+                        children: [
+                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_cjs_namespaceObject.ApButton, {
+                                variant: "primary",
+                                label: replaceButtonLabel,
+                                onClick: (e)=>{
+                                    setMenuAnchorEl(e.currentTarget);
+                                }
+                            }),
+                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_cjs_namespaceObject.ApMenu, {
+                                isOpen: Boolean(menuAnchorEl),
+                                anchorEl: menuAnchorEl,
+                                menuItems: taskMenuItems,
+                                onClose: ()=>setMenuAnchorEl(null),
+                                width: 300
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_cjs_namespaceObject.Panel, {
+                        position: "bottom-right",
+                        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_CanvasPositionControls_cjs_namespaceObject.CanvasPositionControls, {
+                            translations: external_types_cjs_namespaceObject.DefaultCanvasTranslations
+                        })
                     })
-                })
+                ]
             })
         })
     });
@@ -1634,7 +1734,7 @@ const AddTaskLoadingStory = ()=>{
             height: '100vh'
         },
         children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(react_cjs_namespaceObject.ReactFlowProvider, {
-            children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_cjs_namespaceObject.BaseCanvas, {
+            children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_BaseCanvas_index_cjs_namespaceObject.BaseCanvas, {
                 nodes: nodesWithHandler,
                 edges: edges,
                 onNodesChange: onNodesChange,

package/dist/canvas/components/StageNode/StageNode.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StageNode.stories.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageNode.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAuBvD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAGxC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,SAAS,CA0FD,CAAC;AAEjC,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AA4CnC,eAAO,MAAM,OAAO,EAAE,KA2DrB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAsE3B,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KA8M7B,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,KA+HvC,CAAC;AAEF,eAAO,MAAM,sBAAsB,EAAE,KAoKpC,CAAC;AA8GF,eAAO,MAAM,uBAAuB,EAAE,KAOrC,CAAC;AAyLF,eAAO,MAAM,kBAAkB,EAAE,KAOhC,CAAC;AAuHF,eAAO,MAAM,cAAc,EAAE,KAO5B,CAAC"}
+{"version":3,"file":"StageNode.stories.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageNode.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAyBvD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAGxC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,SAAS,CA0FD,CAAC;AAEjC,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AA4CnC,eAAO,MAAM,OAAO,EAAE,KA2DrB,CAAC;AAEF,eAAO,MAAM,aAAa,EAAE,KAsE3B,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KA8M7B,CAAC;AAEF,eAAO,MAAM,yBAAyB,EAAE,KA+HvC,CAAC;AAEF,eAAO,MAAM,sBAAsB,EAAE,KAoKpC,CAAC;AA8GF,eAAO,MAAM,uBAAuB,EAAE,KAOrC,CAAC;AA6TF,eAAO,MAAM,kBAAkB,EAAE,KAOhC,CAAC;AAuHF,eAAO,MAAM,cAAc,EAAE,KAO5B,CAAC"}

package/dist/canvas/components/StageNode/StageNode.stories.js

@@ -1,11 +1,12 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { ConnectionMode, Panel, ReactFlowProvider, addEdge, useEdgesState, useNodesState } from "../../xyflow/react.js";
-import { useCallback, useEffect, useMemo, useState } from "react";
+import { ApButton, ApMenu } from "../../../material/components/index.js";
+import { useCallback, useMemo, useState } from "react";
 import { DefaultCanvasTranslations } from "../../types.js";
+import { createGroupModificationHandlers, getHandlerForModificationType } from "../../utils/GroupModificationUtils.js";
 import { BaseCanvas } from "../BaseCanvas/index.js";
 import { CanvasPositionControls } from "../CanvasPositionControls.js";
 import { TaskIcon, TaskItemTypeValues } from "../TaskIcon/index.js";
-import { createGroupModificationHandlers, getHandlerForModificationType } from "../utils/GroupModificationUtils.js";
 import { StageConnectionEdge } from "./StageConnectionEdge.js";
 import { StageEdge } from "./StageEdge.js";
 import { StageNode } from "./StageNode.js";
@@ -1371,20 +1372,51 @@ const AddAndReplaceTasksStory = ()=>{
     const edgeTypes = useMemo(()=>({
             stage: StageEdge
         }), []);
-    const [tasks, setTasks] = useState(initialTasksForAddReplace);
+    const [pendingReplaceTask, setPendingReplaceTask] = useState();
+    const [selectedTaskId, setSelectedTaskId] = useState();
+    const [menuAnchorEl, setMenuAnchorEl] = useState(null);
+    const [nodesState, setNodes, onNodesChange] = useNodesState([
+        {
+            id: 'add-replace-stage',
+            type: 'stage',
+            position: {
+                x: 320,
+                y: 96
+            },
+            data: {
+                stageDetails: {
+                    label: 'Add, Replace, and Group Tasks',
+                    tasks: initialTasksForAddReplace
+                },
+                taskOptions: availableTaskOptions
+            }
+        }
+    ]);
+    const [edges, setEdges, onEdgesChange] = useEdgesState([]);
     const handleAddTask = useCallback((taskItem)=>{
         const newTask = {
             id: `${taskItem.id}-${Date.now()}`,
             label: taskItem.name,
             icon: taskItem.icon?.Component ? /*#__PURE__*/ jsx(taskItem.icon.Component, {}) : void 0
         };
-        setTasks((prevTasks)=>[
-                ...prevTasks,
-                [
-                    newTask
-                ]
-            ]);
-    }, []);
+        setNodes((prevNodes)=>prevNodes.map((node)=>'add-replace-stage' === node.id ? {
+                    ...node,
+                    data: {
+                        ...node.data,
+                        stageDetails: {
+                            ...node.data.stageDetails,
+                            tasks: [
+                                ...node.data.stageDetails.tasks,
+                                [
+                                    newTask
+                                ]
+                            ]
+                        }
+                    }
+                } : node));
+    }, [
+        setNodes
+    ]);
     const handleReplaceTask = useCallback((taskItem, groupIndex, taskIndex)=>{
         if (groupIndex < 0 || taskIndex < 0) return;
         const listItem = taskItem;
@@ -1393,71 +1425,118 @@ const AddAndReplaceTasksStory = ()=>{
             label: listItem.name,
             icon: listItem.icon?.Component ? /*#__PURE__*/ jsx(listItem.icon.Component, {}) : void 0
         };
-        setTasks((prevTasks)=>{
-            if (groupIndex >= prevTasks.length) return prevTasks;
-            const currentGroup = prevTasks[groupIndex];
-            if (!currentGroup || taskIndex >= currentGroup.length) return prevTasks;
-            const updatedTasks = prevTasks.map((group, gIdx)=>{
-                if (gIdx === groupIndex) return group.map((task, tIdx)=>tIdx === taskIndex ? replacedTask : task);
-                return group;
-            });
-            return updatedTasks;
-        });
+        setNodes((prevNodes)=>prevNodes.map((node)=>{
+                if ('add-replace-stage' !== node.id) return node;
+                const prevTasks = node.data.stageDetails.tasks;
+                if (groupIndex >= prevTasks.length) return node;
+                const currentGroup = prevTasks[groupIndex];
+                if (!currentGroup || taskIndex >= currentGroup.length) return node;
+                const updatedTasks = prevTasks.map((group, gIdx)=>{
+                    if (gIdx === groupIndex) return group.map((task, tIdx)=>tIdx === taskIndex ? replacedTask : task);
+                    return group;
+                });
+                return {
+                    ...node,
+                    data: {
+                        ...node.data,
+                        stageDetails: {
+                            ...node.data.stageDetails,
+                            tasks: updatedTasks
+                        }
+                    }
+                };
+            }));
+        setPendingReplaceTask(void 0);
     }, [
-        setTasks
+        setNodes
     ]);
     const groupModificationHandlers = useMemo(()=>createGroupModificationHandlers(), []);
     const handleTaskGroupModification = useCallback((groupModificationType, groupIndex, taskIndex)=>{
         const handler = getHandlerForModificationType(groupModificationHandlers, groupModificationType);
-        setTasks((prevTasks)=>handler(prevTasks, groupIndex, taskIndex));
+        setNodes((prevNodes)=>prevNodes.map((node)=>{
+                if ('add-replace-stage' !== node.id) return node;
+                const prevTasks = node.data.stageDetails.tasks;
+                const updatedTasks = handler(prevTasks, groupIndex, taskIndex);
+                return {
+                    ...node,
+                    data: {
+                        ...node.data,
+                        stageDetails: {
+                            ...node.data.stageDetails,
+                            tasks: updatedTasks
+                        }
+                    }
+                };
+            }));
     }, [
         groupModificationHandlers,
-        setTasks
+        setNodes
     ]);
-    const nodes = useMemo(()=>[
-            {
-                id: 'add-replace-stage',
-                type: 'stage',
-                position: {
-                    x: 320,
-                    y: 96
-                },
+    const handleTaskClick = useCallback((taskId)=>{
+        setSelectedTaskId(taskId);
+    }, []);
+    const currentTasks = nodesState.find((n)=>'add-replace-stage' === n.id)?.data.stageDetails.tasks || [];
+    const taskMenuItems = useMemo(()=>currentTasks.flatMap((group, groupIndex)=>group.map((task, taskIndex)=>({
+                    title: task.label,
+                    variant: 'item',
+                    startIcon: task.icon,
+                    onClick: ()=>{
+                        setSelectedTaskId(task.id);
+                        setPendingReplaceTask({
+                            groupIndex,
+                            taskIndex
+                        });
+                        setMenuAnchorEl(null);
+                    }
+                }))), [
+        currentTasks
+    ]);
+    const nodesWithMetadata = useMemo(()=>nodesState.map((node)=>'add-replace-stage' === node.id ? {
+                ...node,
                 data: {
+                    ...node.data,
+                    pendingReplaceTask: pendingReplaceTask,
                     stageDetails: {
-                        label: 'Add, Replace, and Group Tasks',
-                        tasks: tasks
+                        ...node.data.stageDetails,
+                        selectedTasks: selectedTaskId ? [
+                            selectedTaskId
+                        ] : void 0
                     },
-                    taskOptions: availableTaskOptions,
                     onAddTaskFromToolbox: handleAddTask,
-                    onTaskReplace: handleReplaceTask,
-                    onTaskGroupModification: handleTaskGroupModification
+                    onReplaceTaskFromToolbox: handleReplaceTask,
+                    onTaskGroupModification: handleTaskGroupModification,
+                    onTaskClick: handleTaskClick
                 }
-            }
-        ], [
-        tasks,
+            } : node), [
+        nodesState,
+        pendingReplaceTask,
+        selectedTaskId,
         handleAddTask,
         handleReplaceTask,
-        handleTaskGroupModification
-    ]);
-    const [nodesState, setNodes, onNodesChange] = useNodesState(nodes);
-    const [edges, setEdges, onEdgesChange] = useEdgesState([]);
-    useEffect(()=>{
-        setNodes(nodes);
-    }, [
-        nodes,
-        setNodes
+        handleTaskGroupModification,
+        handleTaskClick
     ]);
     const onConnect = useCallback((connection)=>setEdges((eds)=>addEdge(connection, eds)), [
         setEdges
     ]);
+    const replaceButtonLabel = useMemo(()=>{
+        if (pendingReplaceTask) {
+            const taskBeingReplaced = currentTasks[pendingReplaceTask.groupIndex]?.[pendingReplaceTask.taskIndex];
+            if (taskBeingReplaced) return `Replacing Task: ${taskBeingReplaced.label}`;
+        }
+        return 'Replace Task';
+    }, [
+        pendingReplaceTask,
+        currentTasks
+    ]);
     return /*#__PURE__*/ jsx("div", {
         style: {
             width: '100vw',
             height: '100vh'
         },
         children: /*#__PURE__*/ jsx(ReactFlowProvider, {
-            children: /*#__PURE__*/ jsx(BaseCanvas, {
-                nodes: nodesState,
+            children: /*#__PURE__*/ jsxs(BaseCanvas, {
+                nodes: nodesWithMetadata,
                 edges: edges,
                 onNodesChange: onNodesChange,
                 onEdgesChange: onEdgesChange,
@@ -1476,12 +1555,33 @@ const AddAndReplaceTasksStory = ()=>{
                     y: 0,
                     zoom: 1.5
                 },
-                children: /*#__PURE__*/ jsx(Panel, {
-                    position: "bottom-right",
-                    children: /*#__PURE__*/ jsx(CanvasPositionControls, {
-                        translations: DefaultCanvasTranslations
+                children: [
+                    /*#__PURE__*/ jsxs(Panel, {
+                        position: "top-right",
+                        children: [
+                            /*#__PURE__*/ jsx(ApButton, {
+                                variant: "primary",
+                                label: replaceButtonLabel,
+                                onClick: (e)=>{
+                                    setMenuAnchorEl(e.currentTarget);
+                                }
+                            }),
+                            /*#__PURE__*/ jsx(ApMenu, {
+                                isOpen: Boolean(menuAnchorEl),
+                                anchorEl: menuAnchorEl,
+                                menuItems: taskMenuItems,
+                                onClose: ()=>setMenuAnchorEl(null),
+                                width: 300
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ jsx(Panel, {
+                        position: "bottom-right",
+                        children: /*#__PURE__*/ jsx(CanvasPositionControls, {
+                            translations: DefaultCanvasTranslations
+                        })
                     })
-                })
+                ]
             })
         })
     });

package/dist/canvas/components/StageNode/StageNode.types.d.ts

@@ -1,7 +1,7 @@
 import type { NodeProps } from '../../xyflow/react.ts';
+import type { GroupModificationType } from '../../utils/GroupModificationUtils';
 import type { NodeMenuItem } from '../NodeContextMenu';
 import type { ListItem, ToolboxSearchHandler } from '../Toolbox';
-import type { GroupModificationType } from '../utils/GroupModificationUtils';
 declare enum ElementStatusValues {
     Cancelled = "Cancelled",
     Completed = "Completed",
@@ -23,6 +23,10 @@ export interface StageNodeProps extends NodeProps {
     dragging: boolean;
     selected: boolean;
     id: string;
+    pendingReplaceTask?: {
+        groupIndex: number;
+        taskIndex: number;
+    };
     stageDetails: {
         label: string;
         defaultContent?: string;
@@ -57,7 +61,7 @@ export interface StageNodeProps extends NodeProps {
     onTaskGroupModification?: (groupModificationType: GroupModificationType, groupIndex: number, taskIndex: number) => void;
     onStageTitleChange?: (newTitle: string) => void;
     onTaskReorder?: (reorderedTasks: StageTaskItem[][]) => void;
-    onTaskReplace?: (newTask: ListItem, groupIndex: number, taskIndex: number) => void;
+    onReplaceTaskFromToolbox?: (newTask: ListItem, groupIndex: number, taskIndex: number) => void;
 }
 export interface StageTaskExecution {
     status?: StageTaskStatus;

package/dist/canvas/components/StageNode/StageNode.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StageNode.types.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageNode.types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"StageNode.types.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageNode.types.ts"],"names":[],"mappings":"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"}

package/dist/canvas/components/StageNode/StageNodeTaskUtilities.cjs

@@ -28,7 +28,7 @@ __webpack_require__.d(__webpack_exports__, {
     getContextMenuItems: ()=>getContextMenuItems,
     getMenuItem: ()=>getMenuItem
 });
-const GroupModificationUtils_cjs_namespaceObject = require("../utils/GroupModificationUtils.cjs");
+const GroupModificationUtils_cjs_namespaceObject = require("../../utils/GroupModificationUtils.cjs");
 const getContextMenuItems = (isParallelGroup, groupIndex, tasksLength, taskIndex, _taskGroupLength, isAboveParallel, isBelowParallel, reGroupTaskFunction)=>{
     const CONTEXT_MENU_ITEMS = {
         MOVE_UP: getMenuItem('move-up', 'Move Up', ()=>reGroupTaskFunction(GroupModificationUtils_cjs_namespaceObject.GroupModificationType.TASK_GROUP_UP, groupIndex, taskIndex)),

package/dist/canvas/components/StageNode/StageNodeTaskUtilities.d.ts

@@ -1,6 +1,6 @@
 import type { ReactNode } from 'react';
+import { GroupModificationType } from '../../utils/GroupModificationUtils';
 import type { NodeMenuAction, NodeMenuItem } from '../NodeContextMenu';
-import { GroupModificationType } from '../utils/GroupModificationUtils';
 export declare const getContextMenuItems: (isParallelGroup: boolean, groupIndex: number, tasksLength: number, taskIndex: number, _taskGroupLength: number, isAboveParallel: boolean, isBelowParallel: boolean, reGroupTaskFunction: (groupModificationType: GroupModificationType, groupIndex: number, taskIndex: number) => void) => NodeMenuItem[];
 export declare function getMenuItem(id: string | undefined, label: string | undefined, onClick: () => void, isDisabled?: boolean): NodeMenuItem;
 export interface TransformedMenuItem {

package/dist/canvas/components/StageNode/StageNodeTaskUtilities.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StageNodeTaskUtilities.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageNodeTaskUtilities.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,KAAK,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AACvE,OAAO,EAAE,qBAAqB,EAAE,MAAM,iCAAiC,CAAC;AAIxE,eAAO,MAAM,mBAAmB,GAC9B,iBAAiB,OAAO,EACxB,YAAY,MAAM,EAClB,aAAa,MAAM,EACnB,WAAW,MAAM,EACjB,kBAAkB,MAAM,EACxB,iBAAiB,OAAO,EACxB,iBAAiB,OAAO,EACxB,qBAAqB,CACnB,qBAAqB,EAAE,qBAAqB,EAC5C,UAAU,EAAE,MAAM,EAClB,SAAS,EAAE,MAAM,KACd,IAAI,KACR,YAAY,EAiFd,CAAC;AAEF,wBAAgB,WAAW,CACzB,EAAE,EAAE,MAAM,YAAO,EACjB,KAAK,EAAE,MAAM,YAAU,EACvB,OAAO,EAAE,MAAM,IAAI,EACnB,UAAU,UAAQ,GACjB,YAAY,CAEd;AAQD,MAAM,WAAW,mBAAmB;IAClC,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,OAAO,EAAE,MAAM,GAAG,WAAW,CAAC;IAC9B,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAMD,eAAO,MAAM,kBAAkB,GAC7B,WAAW,YAAY,EAAE,GAAG,SAAS,EACrC,aAAa,CAAC,IAAI,EAAE,cAAc,KAAK,IAAI,KAC1C,mBAAmB,EAwBrB,CAAC"}
+{"version":3,"file":"StageNodeTaskUtilities.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageNodeTaskUtilities.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AACvC,OAAO,EAAE,qBAAqB,EAAE,MAAM,oCAAoC,CAAC;AAC3E,OAAO,KAAK,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAIvE,eAAO,MAAM,mBAAmB,GAC9B,iBAAiB,OAAO,EACxB,YAAY,MAAM,EAClB,aAAa,MAAM,EACnB,WAAW,MAAM,EACjB,kBAAkB,MAAM,EACxB,iBAAiB,OAAO,EACxB,iBAAiB,OAAO,EACxB,qBAAqB,CACnB,qBAAqB,EAAE,qBAAqB,EAC5C,UAAU,EAAE,MAAM,EAClB,SAAS,EAAE,MAAM,KACd,IAAI,KACR,YAAY,EAiFd,CAAC;AAEF,wBAAgB,WAAW,CACzB,EAAE,EAAE,MAAM,YAAO,EACjB,KAAK,EAAE,MAAM,YAAU,EACvB,OAAO,EAAE,MAAM,IAAI,EACnB,UAAU,UAAQ,GACjB,YAAY,CAEd;AAQD,MAAM,WAAW,mBAAmB;IAClC,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,OAAO,EAAE,MAAM,GAAG,WAAW,CAAC;IAC9B,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAMD,eAAO,MAAM,kBAAkB,GAC7B,WAAW,YAAY,EAAE,GAAG,SAAS,EACrC,aAAa,CAAC,IAAI,EAAE,cAAc,KAAK,IAAI,KAC1C,mBAAmB,EAwBrB,CAAC"}

package/dist/canvas/components/StageNode/StageNodeTaskUtilities.js

@@ -1,4 +1,4 @@
-import { GroupModificationType } from "../utils/GroupModificationUtils.js";
+import { GroupModificationType } from "../../utils/GroupModificationUtils.js";
 const getContextMenuItems = (isParallelGroup, groupIndex, tasksLength, taskIndex, _taskGroupLength, isAboveParallel, isBelowParallel, reGroupTaskFunction)=>{
     const CONTEXT_MENU_ITEMS = {
         MOVE_UP: getMenuItem('move-up', 'Move Up', ()=>reGroupTaskFunction(GroupModificationType.TASK_GROUP_UP, groupIndex, taskIndex)),

package/dist/canvas/core/CategoryTree.cjs

@@ -172,6 +172,7 @@ class CategoryTree {
             return nodes;
         };
         const allNodes = collectNodes(this.rootCategories).concat(this.rootNodes);
+        allNodes.sort((a, b)=>a.sortOrder - b.sortOrder);
         return CategoryTree.fromPrebuilt([], allNodes);
     }
     isEmpty() {

package/dist/canvas/core/CategoryTree.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CategoryTree.d.ts","sourceRoot":"","sources":["../../../src/canvas/core/CategoryTree.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAKhF,MAAM,WAAW,gBAAiB,SAAQ,gBAAgB;IACxD,gBAAgB,EAAE,gBAAgB,EAAE,CAAC;IACrC,KAAK,EAAE,YAAY,EAAE,CAAC;CACvB;AAKD,MAAM,WAAW,yBAAyB;IAExC,cAAc,CAAC,EAAE,CAAC,QAAQ,EAAE,gBAAgB,KAAK,OAAO,CAAC;IAEzD,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,OAAO,CAAC;CAC9C;AAMD,MAAM,WAAW,mBAAmB;IAMlC,4BAA4B,CAAC,UAAU,EAAE,MAAM,GAAG,OAAO,CAAC;IAO1D,cAAc,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAAC;CAC3C;AA8BD,qBAAa,YAAY;IACvB,OAAO,CAAC,cAAc,CAAqB;IAC3C,OAAO,CAAC,SAAS,CAAiB;IAClC,OAAO,CAAC,WAAW,CAAgC;gBAQvC,UAAU,EAAE,gBAAgB,EAAE,EAAE,KAAK,EAAE,YAAY,EAAE;IAYjE,MAAM,CAAC,QAAQ,CAAC,IAAI,EAAE,gBAAgB,EAAE,GAAG,GAAG,CAAC,MAAM,EAAE,gBAAgB,CAAC;IAmBxE,MAAM,CAAC,YAAY,CAAC,cAAc,EAAE,gBAAgB,EAAE,EAAE,SAAS,EAAE,YAAY,EAAE,GAAG,YAAY;IAkBhG,SAAS,CACP,UAAU,EAAE,gBAAgB,EAAE,EAC9B,KAAK,EAAE,YAAY,EAAE,GACpB;QAAE,cAAc,EAAE,gBAAgB,EAAE,CAAC;QAAC,SAAS,EAAE,YAAY,EAAE,CAAA;KAAE;IAsFpE,iBAAiB,IAAI,gBAAgB,EAAE;IASvC,YAAY,IAAI,YAAY,EAAE;IAU9B,YAAY,CAAC,UAAU,EAAE,MAAM,GAAG,gBAAgB,GAAG,IAAI;IAWzD,UAAU,CAAC,UAAU,EAAE,MAAM,GAAG,YAAY;IAuB5C,MAAM,CAAC,OAAO,GAAE,yBAA8B,GAAG,YAAY;IA6C7D,cAAc,CAAC,UAAU,EAAE,MAAM,GAAG,YAAY;IAiChD,mBAAmB,CAAC,SAAS,EAAE,mBAAmB,GAAG,YAAY;IAoBjE,iBAAiB,IAAI,YAAY;IA4BjC,OAAO,IAAI,YAAY;IAmBvB,OAAO,IAAI,OAAO;IASlB,gBAAgB,IAAI,gBAAgB,EAAE;IAStC,WAAW,IAAI,YAAY,EAAE;IAa7B,gBAAgB,IAAI,MAAM;IAS1B,YAAY,IAAI,MAAM;CAOvB"}
+{"version":3,"file":"CategoryTree.d.ts","sourceRoot":"","sources":["../../../src/canvas/core/CategoryTree.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAKhF,MAAM,WAAW,gBAAiB,SAAQ,gBAAgB;IACxD,gBAAgB,EAAE,gBAAgB,EAAE,CAAC;IACrC,KAAK,EAAE,YAAY,EAAE,CAAC;CACvB;AAKD,MAAM,WAAW,yBAAyB;IAExC,cAAc,CAAC,EAAE,CAAC,QAAQ,EAAE,gBAAgB,KAAK,OAAO,CAAC;IAEzD,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,OAAO,CAAC;CAC9C;AAMD,MAAM,WAAW,mBAAmB;IAMlC,4BAA4B,CAAC,UAAU,EAAE,MAAM,GAAG,OAAO,CAAC;IAO1D,cAAc,CAAC,QAAQ,EAAE,MAAM,GAAG,OAAO,CAAC;CAC3C;AA8BD,qBAAa,YAAY;IACvB,OAAO,CAAC,cAAc,CAAqB;IAC3C,OAAO,CAAC,SAAS,CAAiB;IAClC,OAAO,CAAC,WAAW,CAAgC;gBAQvC,UAAU,EAAE,gBAAgB,EAAE,EAAE,KAAK,EAAE,YAAY,EAAE;IAYjE,MAAM,CAAC,QAAQ,CAAC,IAAI,EAAE,gBAAgB,EAAE,GAAG,GAAG,CAAC,MAAM,EAAE,gBAAgB,CAAC;IAmBxE,MAAM,CAAC,YAAY,CAAC,cAAc,EAAE,gBAAgB,EAAE,EAAE,SAAS,EAAE,YAAY,EAAE,GAAG,YAAY;IAkBhG,SAAS,CACP,UAAU,EAAE,gBAAgB,EAAE,EAC9B,KAAK,EAAE,YAAY,EAAE,GACpB;QAAE,cAAc,EAAE,gBAAgB,EAAE,CAAC;QAAC,SAAS,EAAE,YAAY,EAAE,CAAA;KAAE;IAsFpE,iBAAiB,IAAI,gBAAgB,EAAE;IASvC,YAAY,IAAI,YAAY,EAAE;IAU9B,YAAY,CAAC,UAAU,EAAE,MAAM,GAAG,gBAAgB,GAAG,IAAI;IAWzD,UAAU,CAAC,UAAU,EAAE,MAAM,GAAG,YAAY;IAuB5C,MAAM,CAAC,OAAO,GAAE,yBAA8B,GAAG,YAAY;IA6C7D,cAAc,CAAC,UAAU,EAAE,MAAM,GAAG,YAAY;IAiChD,mBAAmB,CAAC,SAAS,EAAE,mBAAmB,GAAG,YAAY;IAoBjE,iBAAiB,IAAI,YAAY;IA4BjC,OAAO,IAAI,YAAY;IAoBvB,OAAO,IAAI,OAAO;IASlB,gBAAgB,IAAI,gBAAgB,EAAE;IAStC,WAAW,IAAI,YAAY,EAAE;IAa7B,gBAAgB,IAAI,MAAM;IAS1B,YAAY,IAAI,MAAM;CAOvB"}

package/dist/canvas/core/CategoryTree.js

@@ -144,6 +144,7 @@ class CategoryTree {
             return nodes;
         };
         const allNodes = collectNodes(this.rootCategories).concat(this.rootNodes);
+        allNodes.sort((a, b)=>a.sortOrder - b.sortOrder);
         return CategoryTree.fromPrebuilt([], allNodes);
     }
     isEmpty() {

package/dist/canvas/utils/GroupModificationUtils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GroupModificationUtils.d.ts","sourceRoot":"","sources":["../../../src/canvas/utils/GroupModificationUtils.ts"],"names":[],"mappings":"AAQA,oBAAY,qBAAqB;IAC/B,aAAa,kBAAkB;IAC/B,eAAe,oBAAoB;IACnC,iBAAiB,sBAAsB;IACvC,WAAW,gBAAgB;IAC3B,cAAc,mBAAmB;IACjC,gBAAgB,qBAAqB;IACrC,WAAW,gBAAgB;IAC3B,YAAY,iBAAiB;CAC9B;AAKD,wBAAgB,WAAW,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,CAAC,EAAE,EAAE,CAoBzF;AAKD,wBAAgB,aAAa,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,CAAC,EAAE,EAAE,CAoB3F;AAKD,wBAAgB,eAAe,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,CAAC,EAAE,EAAE,CAmB7F;AAKD,wBAAgB,UAAU,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,CAAC,EAAE,EAAE,CA8BxF;AAKD,wBAAgB,YAAY,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,CAAC,EAAE,EAAE,CAiC1F;AAKD,wBAAgB,cAAc,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,CAAC,EAAE,EAAE,CAiC5F;AAKD,wBAAgB,UAAU,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,CAAC,EAAE,EAAE,CAoBxF;AAKD,wBAAgB,WAAW,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,CAAC,EAAE,EAAE,CAezF;AAMD,wBAAgB,+BAA+B,CAAC,CAAC;yBAExB,CAAC,EAAE,EAAE,cAAc,MAAM,aAAa,MAAM;2BAE1C,CAAC,EAAE,EAAE,cAAc,MAAM,aAAa,MAAM;wBAE/C,CAAC,EAAE,EAAE,cAAc,MAAM,aAAa,MAAM;wBAE5C,CAAC,EAAE,EAAE,cAAc,MAAM,aAAa,MAAM;0BAE1C,CAAC,EAAE,EAAE,cAAc,MAAM,aAAa,MAAM;4BAE1C,CAAC,EAAE,EAAE,cAAc,MAAM,aAAa,MAAM;wBAEhD,CAAC,EAAE,EAAE,cAAc,MAAM,aAAa,MAAM;yBAE3C,CAAC,EAAE,EAAE,cAAc,MAAM,aAAa,MAAM;EAGpE;AAKD,MAAM,MAAM,yBAAyB,CAAC,CAAC,IAAI,UAAU,CAAC,OAAO,+BAA+B,CAAC,CAAC,CAAC,CAAC,CAAC;AAMjG,wBAAgB,6BAA6B,CAAC,CAAC,EAC7C,QAAQ,EAAE,yBAAyB,CAAC,CAAC,CAAC,EACtC,IAAI,EAAE,qBAAqB,GAC1B,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,KAAK,CAAC,EAAE,EAAE,CAwBhE"}

package/dist/canvas/utils/index.cjs

@@ -9,6 +9,9 @@ var __webpack_modules__ = {
     "./CssUtil": function(module) {
         module.exports = require("./CssUtil.cjs");
     },
+    "./GroupModificationUtils": function(module) {
+        module.exports = require("./GroupModificationUtils.cjs");
+    },
     "./NodeUtils": function(module) {
         module.exports = require("./NodeUtils.cjs");
     },
@@ -155,46 +158,52 @@ var __webpack_exports__ = {};
         return _export_canvas__WEBPACK_IMPORTED_MODULE_9__[key];
     }).bind(0, __WEBPACK_IMPORT_KEY__);
     __webpack_require__.d(__webpack_exports__, __WEBPACK_REEXPORT_OBJECT__);
-    var _icon_registry__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__("./icon-registry");
+    var _GroupModificationUtils__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__("./GroupModificationUtils");
+    var __WEBPACK_REEXPORT_OBJECT__ = {};
+    for(var __WEBPACK_IMPORT_KEY__ in _GroupModificationUtils__WEBPACK_IMPORTED_MODULE_10__)if ("default" !== __WEBPACK_IMPORT_KEY__) __WEBPACK_REEXPORT_OBJECT__[__WEBPACK_IMPORT_KEY__] = (function(key) {
+        return _GroupModificationUtils__WEBPACK_IMPORTED_MODULE_10__[key];
+    }).bind(0, __WEBPACK_IMPORT_KEY__);
+    __webpack_require__.d(__webpack_exports__, __WEBPACK_REEXPORT_OBJECT__);
+    var _icon_registry__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__("./icon-registry");
     var __WEBPACK_REEXPORT_OBJECT__ = {};
-    for(var __WEBPACK_IMPORT_KEY__ in _icon_registry__WEBPACK_IMPORTED_MODULE_10__)if ("default" !== __WEBPACK_IMPORT_KEY__) __WEBPACK_REEXPORT_OBJECT__[__WEBPACK_IMPORT_KEY__] = (function(key) {
-        return _icon_registry__WEBPACK_IMPORTED_MODULE_10__[key];
+    for(var __WEBPACK_IMPORT_KEY__ in _icon_registry__WEBPACK_IMPORTED_MODULE_11__)if ("default" !== __WEBPACK_IMPORT_KEY__) __WEBPACK_REEXPORT_OBJECT__[__WEBPACK_IMPORT_KEY__] = (function(key) {
+        return _icon_registry__WEBPACK_IMPORTED_MODULE_11__[key];
     }).bind(0, __WEBPACK_IMPORT_KEY__);
     __webpack_require__.d(__webpack_exports__, __WEBPACK_REEXPORT_OBJECT__);
-    var _manifest_resolver__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__("./manifest-resolver");
+    var _manifest_resolver__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__("./manifest-resolver");
     var __WEBPACK_REEXPORT_OBJECT__ = {};
-    for(var __WEBPACK_IMPORT_KEY__ in _manifest_resolver__WEBPACK_IMPORTED_MODULE_11__)if ("default" !== __WEBPACK_IMPORT_KEY__) __WEBPACK_REEXPORT_OBJECT__[__WEBPACK_IMPORT_KEY__] = (function(key) {
-        return _manifest_resolver__WEBPACK_IMPORTED_MODULE_11__[key];
+    for(var __WEBPACK_IMPORT_KEY__ in _manifest_resolver__WEBPACK_IMPORTED_MODULE_12__)if ("default" !== __WEBPACK_IMPORT_KEY__) __WEBPACK_REEXPORT_OBJECT__[__WEBPACK_IMPORT_KEY__] = (function(key) {
+        return _manifest_resolver__WEBPACK_IMPORTED_MODULE_12__[key];
     }).bind(0, __WEBPACK_IMPORT_KEY__);
     __webpack_require__.d(__webpack_exports__, __WEBPACK_REEXPORT_OBJECT__);
-    var _NodeUtils__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__("./NodeUtils");
+    var _NodeUtils__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__("./NodeUtils");
     var __WEBPACK_REEXPORT_OBJECT__ = {};
-    for(var __WEBPACK_IMPORT_KEY__ in _NodeUtils__WEBPACK_IMPORTED_MODULE_12__)if ("default" !== __WEBPACK_IMPORT_KEY__) __WEBPACK_REEXPORT_OBJECT__[__WEBPACK_IMPORT_KEY__] = (function(key) {
-        return _NodeUtils__WEBPACK_IMPORTED_MODULE_12__[key];
+    for(var __WEBPACK_IMPORT_KEY__ in _NodeUtils__WEBPACK_IMPORTED_MODULE_13__)if ("default" !== __WEBPACK_IMPORT_KEY__) __WEBPACK_REEXPORT_OBJECT__[__WEBPACK_IMPORT_KEY__] = (function(key) {
+        return _NodeUtils__WEBPACK_IMPORTED_MODULE_13__[key];
     }).bind(0, __WEBPACK_IMPORT_KEY__);
     __webpack_require__.d(__webpack_exports__, __WEBPACK_REEXPORT_OBJECT__);
-    var _props_helpers__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__("./props-helpers");
+    var _props_helpers__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__("./props-helpers");
     var __WEBPACK_REEXPORT_OBJECT__ = {};
-    for(var __WEBPACK_IMPORT_KEY__ in _props_helpers__WEBPACK_IMPORTED_MODULE_13__)if ("default" !== __WEBPACK_IMPORT_KEY__) __WEBPACK_REEXPORT_OBJECT__[__WEBPACK_IMPORT_KEY__] = (function(key) {
-        return _props_helpers__WEBPACK_IMPORTED_MODULE_13__[key];
+    for(var __WEBPACK_IMPORT_KEY__ in _props_helpers__WEBPACK_IMPORTED_MODULE_14__)if ("default" !== __WEBPACK_IMPORT_KEY__) __WEBPACK_REEXPORT_OBJECT__[__WEBPACK_IMPORT_KEY__] = (function(key) {
+        return _props_helpers__WEBPACK_IMPORTED_MODULE_14__[key];
     }).bind(0, __WEBPACK_IMPORT_KEY__);
     __webpack_require__.d(__webpack_exports__, __WEBPACK_REEXPORT_OBJECT__);
-    var _resource_operations__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__("./resource-operations");
+    var _resource_operations__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__("./resource-operations");
     var __WEBPACK_REEXPORT_OBJECT__ = {};
-    for(var __WEBPACK_IMPORT_KEY__ in _resource_operations__WEBPACK_IMPORTED_MODULE_14__)if ("default" !== __WEBPACK_IMPORT_KEY__) __WEBPACK_REEXPORT_OBJECT__[__WEBPACK_IMPORT_KEY__] = (function(key) {
-        return _resource_operations__WEBPACK_IMPORTED_MODULE_14__[key];
+    for(var __WEBPACK_IMPORT_KEY__ in _resource_operations__WEBPACK_IMPORTED_MODULE_15__)if ("default" !== __WEBPACK_IMPORT_KEY__) __WEBPACK_REEXPORT_OBJECT__[__WEBPACK_IMPORT_KEY__] = (function(key) {
+        return _resource_operations__WEBPACK_IMPORTED_MODULE_15__[key];
     }).bind(0, __WEBPACK_IMPORT_KEY__);
     __webpack_require__.d(__webpack_exports__, __WEBPACK_REEXPORT_OBJECT__);
-    var _Storage__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__("./Storage");
+    var _Storage__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__("./Storage");
     var __WEBPACK_REEXPORT_OBJECT__ = {};
-    for(var __WEBPACK_IMPORT_KEY__ in _Storage__WEBPACK_IMPORTED_MODULE_15__)if ("default" !== __WEBPACK_IMPORT_KEY__) __WEBPACK_REEXPORT_OBJECT__[__WEBPACK_IMPORT_KEY__] = (function(key) {
-        return _Storage__WEBPACK_IMPORTED_MODULE_15__[key];
+    for(var __WEBPACK_IMPORT_KEY__ in _Storage__WEBPACK_IMPORTED_MODULE_16__)if ("default" !== __WEBPACK_IMPORT_KEY__) __WEBPACK_REEXPORT_OBJECT__[__WEBPACK_IMPORT_KEY__] = (function(key) {
+        return _Storage__WEBPACK_IMPORTED_MODULE_16__[key];
     }).bind(0, __WEBPACK_IMPORT_KEY__);
     __webpack_require__.d(__webpack_exports__, __WEBPACK_REEXPORT_OBJECT__);
-    var _StyleUtil__WEBPACK_IMPORTED_MODULE_16__ = __webpack_require__("./StyleUtil");
+    var _StyleUtil__WEBPACK_IMPORTED_MODULE_17__ = __webpack_require__("./StyleUtil");
     var __WEBPACK_REEXPORT_OBJECT__ = {};
-    for(var __WEBPACK_IMPORT_KEY__ in _StyleUtil__WEBPACK_IMPORTED_MODULE_16__)if ("default" !== __WEBPACK_IMPORT_KEY__) __WEBPACK_REEXPORT_OBJECT__[__WEBPACK_IMPORT_KEY__] = (function(key) {
-        return _StyleUtil__WEBPACK_IMPORTED_MODULE_16__[key];
+    for(var __WEBPACK_IMPORT_KEY__ in _StyleUtil__WEBPACK_IMPORTED_MODULE_17__)if ("default" !== __WEBPACK_IMPORT_KEY__) __WEBPACK_REEXPORT_OBJECT__[__WEBPACK_IMPORT_KEY__] = (function(key) {
+        return _StyleUtil__WEBPACK_IMPORTED_MODULE_17__[key];
     }).bind(0, __WEBPACK_IMPORT_KEY__);
     __webpack_require__.d(__webpack_exports__, __WEBPACK_REEXPORT_OBJECT__);
 })();

package/dist/canvas/utils/index.d.ts

@@ -8,6 +8,7 @@ export * from './coded-agents/mermaid-parser';
 export * from './constraint-validator';
 export * from './createPreviewNode';
 export * from './export-canvas';
+export * from './GroupModificationUtils';
 export * from './icon-registry';
 export * from './manifest-resolver';
 export * from './NodeUtils';

package/dist/canvas/utils/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/canvas/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AACjC,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,0BAA0B,CAAC;AACzC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,wBAAwB,CAAC;AACvC,cAAc,qBAAqB,CAAC;AACpC,cAAc,iBAAiB,CAAC;AAChC,cAAc,iBAAiB,CAAC;AAChC,cAAc,qBAAqB,CAAC;AACpC,cAAc,aAAa,CAAC;AAC5B,cAAc,iBAAiB,CAAC;AAChC,cAAc,uBAAuB,CAAC;AACtC,cAAc,WAAW,CAAC;AAC1B,cAAc,aAAa,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/canvas/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AACjC,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,0BAA0B,CAAC;AACzC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,wBAAwB,CAAC;AACvC,cAAc,qBAAqB,CAAC;AACpC,cAAc,iBAAiB,CAAC;AAChC,cAAc,0BAA0B,CAAC;AACzC,cAAc,iBAAiB,CAAC;AAChC,cAAc,qBAAqB,CAAC;AACpC,cAAc,aAAa,CAAC;AAC5B,cAAc,iBAAiB,CAAC;AAChC,cAAc,uBAAuB,CAAC;AACtC,cAAc,WAAW,CAAC;AAC1B,cAAc,aAAa,CAAC"}

package/dist/canvas/utils/index.js

@@ -8,6 +8,7 @@ export * from "./coded-agents/mermaid-parser.js";
 export * from "./constraint-validator.js";
 export * from "./createPreviewNode.js";
 export * from "./export-canvas.js";
+export * from "./GroupModificationUtils.js";
 export * from "./icon-registry.js";
 export * from "./manifest-resolver.js";
 export * from "./NodeUtils.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uipath/apollo-react",
-  "version": "3.41.1",
+  "version": "3.42.1",
   "description": "Apollo Design System - React component library with Material UI theming",
   "repository": {
     "type": "git",

package/dist/canvas/components/utils/GroupModificationUtils.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"GroupModificationUtils.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/utils/GroupModificationUtils.ts"],"names":[],"mappings":"AAQA,oBAAY,qBAAqB;IAC/B,aAAa,kBAAkB;IAC/B,eAAe,oBAAoB;IACnC,iBAAiB,sBAAsB;IACvC,WAAW,gBAAgB;IAC3B,cAAc,mBAAmB;IACjC,gBAAgB,qBAAqB;IACrC,WAAW,gBAAgB;IAC3B,YAAY,iBAAiB;CAC9B;AAKD,wBAAgB,WAAW,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,CAAC,EAAE,EAAE,CAoBzF;AAKD,wBAAgB,aAAa,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,CAAC,EAAE,EAAE,CAoB3F;AAKD,wBAAgB,eAAe,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,CAAC,EAAE,EAAE,CAmB7F;AAKD,wBAAgB,UAAU,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,CAAC,EAAE,EAAE,CA8BxF;AAKD,wBAAgB,YAAY,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,CAAC,EAAE,EAAE,CAiC1F;AAKD,wBAAgB,cAAc,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,CAAC,EAAE,EAAE,CAiC5F;AAKD,wBAAgB,UAAU,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,CAAC,EAAE,EAAE,CAoBxF;AAKD,wBAAgB,WAAW,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,CAAC,EAAE,EAAE,CAezF;AAMD,wBAAgB,+BAA+B,CAAC,CAAC;yBAExB,CAAC,EAAE,EAAE,cAAc,MAAM,aAAa,MAAM;2BAE1C,CAAC,EAAE,EAAE,cAAc,MAAM,aAAa,MAAM;wBAE/C,CAAC,EAAE,EAAE,cAAc,MAAM,aAAa,MAAM;wBAE5C,CAAC,EAAE,EAAE,cAAc,MAAM,aAAa,MAAM;0BAE1C,CAAC,EAAE,EAAE,cAAc,MAAM,aAAa,MAAM;4BAE1C,CAAC,EAAE,EAAE,cAAc,MAAM,aAAa,MAAM;wBAEhD,CAAC,EAAE,EAAE,cAAc,MAAM,aAAa,MAAM;yBAE3C,CAAC,EAAE,EAAE,cAAc,MAAM,aAAa,MAAM;EAGpE;AAKD,MAAM,MAAM,yBAAyB,CAAC,CAAC,IAAI,UAAU,CAAC,OAAO,+BAA+B,CAAC,CAAC,CAAC,CAAC,CAAC;AAMjG,wBAAgB,6BAA6B,CAAC,CAAC,EAC7C,QAAQ,EAAE,yBAAyB,CAAC,CAAC,CAAC,EACtC,IAAI,EAAE,qBAAqB,GAC1B,CAAC,KAAK,EAAE,CAAC,EAAE,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,KAAK,CAAC,EAAE,EAAE,CAwBhE"}

package/dist/canvas/components/utils/index.cjs

@@ -1,42 +0,0 @@
-"use strict";
-var __webpack_require__ = {};
-(()=>{
-    __webpack_require__.d = (exports1, definition)=>{
-        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
-            enumerable: true,
-            get: definition[key]
-        });
-    };
-})();
-(()=>{
-    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
-})();
-(()=>{
-    __webpack_require__.r = (exports1)=>{
-        if ('undefined' != typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
-            value: 'Module'
-        });
-        Object.defineProperty(exports1, '__esModule', {
-            value: true
-        });
-    };
-})();
-var __webpack_exports__ = {};
-__webpack_require__.r(__webpack_exports__);
-__webpack_require__.d(__webpack_exports__, {
-    createGroupModificationHandlers: ()=>external_GroupModificationUtils_cjs_namespaceObject.createGroupModificationHandlers,
-    GroupModificationType: ()=>external_GroupModificationUtils_cjs_namespaceObject.GroupModificationType,
-    getHandlerForModificationType: ()=>external_GroupModificationUtils_cjs_namespaceObject.getHandlerForModificationType
-});
-const external_GroupModificationUtils_cjs_namespaceObject = require("./GroupModificationUtils.cjs");
-exports.GroupModificationType = __webpack_exports__.GroupModificationType;
-exports.createGroupModificationHandlers = __webpack_exports__.createGroupModificationHandlers;
-exports.getHandlerForModificationType = __webpack_exports__.getHandlerForModificationType;
-for(var __webpack_i__ in __webpack_exports__)if (-1 === [
-    "GroupModificationType",
-    "createGroupModificationHandlers",
-    "getHandlerForModificationType"
-].indexOf(__webpack_i__)) exports[__webpack_i__] = __webpack_exports__[__webpack_i__];
-Object.defineProperty(exports, '__esModule', {
-    value: true
-});

package/dist/canvas/components/utils/index.d.ts

@@ -1,2 +0,0 @@
-export { createGroupModificationHandlers, type GroupModificationHandlers, GroupModificationType, getHandlerForModificationType, } from './GroupModificationUtils';
-//# sourceMappingURL=index.d.ts.map

package/dist/canvas/components/utils/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,+BAA+B,EAC/B,KAAK,yBAAyB,EAC9B,qBAAqB,EACrB,6BAA6B,GAC9B,MAAM,0BAA0B,CAAC"}

package/dist/canvas/components/utils/index.js

@@ -1,2 +0,0 @@
-import { GroupModificationType, createGroupModificationHandlers, getHandlerForModificationType } from "./GroupModificationUtils.js";
-export { GroupModificationType, createGroupModificationHandlers, getHandlerForModificationType };