@uipath/apollo-react 3.64.0-pr431.cb6b0b8 → 3.65.0

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

@@ -10,54 +10,7 @@ import { TaskIcon, TaskItemTypeValues } from "../TaskIcon/index.js";
 import { StageConnectionEdge } from "./StageConnectionEdge.js";
 import { StageEdge } from "./StageEdge.js";
 import { StageNode } from "./StageNode.js";
-import { StageNodeWrapper } from "./StageNode.stories.utils.js";
 import { StageHeaderChipType } from "./StageNode.types.js";
-const DefaultCanvasDecorator = ({ initialNodes, initialEdges = [] })=>{
-    const [nodes, _setNodes, onNodesChange] = useNodesState(initialNodes);
-    const [edges, setEdges, onEdgesChange] = useEdgesState(initialEdges);
-    const onConnect = useCallback((connection)=>{
-        setEdges((eds)=>addEdge(connection, eds));
-    }, [
-        setEdges
-    ]);
-    const nodeTypes = useMemo(()=>({
-            stage: StageNodeWrapper
-        }), []);
-    const edgeTypes = useMemo(()=>({
-            stage: StageEdge
-        }), []);
-    const defaultEdgeOptions = useMemo(()=>({
-            type: 'stage'
-        }), []);
-    return /*#__PURE__*/ jsx("div", {
-        style: {
-            width: '100vw',
-            height: '100vh'
-        },
-        children: /*#__PURE__*/ jsx(ReactFlowProvider, {
-            children: /*#__PURE__*/ jsx(BaseCanvas, {
-                nodes: nodes,
-                edges: edges,
-                onNodesChange: onNodesChange,
-                onEdgesChange: onEdgesChange,
-                onConnect: onConnect,
-                nodeTypes: nodeTypes,
-                edgeTypes: edgeTypes,
-                mode: "design",
-                connectionMode: ConnectionMode.Strict,
-                defaultEdgeOptions: defaultEdgeOptions,
-                connectionLineComponent: StageConnectionEdge,
-                elevateEdgesOnSelect: true,
-                children: /*#__PURE__*/ jsx(Panel, {
-                    position: "bottom-right",
-                    children: /*#__PURE__*/ jsx(CanvasPositionControls, {
-                        translations: DefaultCanvasTranslations
-                    })
-                })
-            })
-        })
-    });
-};
 const meta = {
     title: 'Canvas/StageNode',
     component: StageNode,
@@ -67,6 +20,10 @@ const meta = {
     decorators: [
         (Story, context)=>{
             if (context.parameters?.useCustomRender) return /*#__PURE__*/ jsx(Story, {});
+            const StageNodeWrapper = (props)=>/*#__PURE__*/ jsx(StageNode, {
+                    ...props,
+                    ...props.data
+                });
             const initialNodes = context.parameters?.nodes || [
                 {
                     id: '1',
@@ -86,9 +43,51 @@ const meta = {
                 }
             ];
             const initialEdges = context.parameters?.edges || [];
-            return /*#__PURE__*/ jsx(DefaultCanvasDecorator, {
-                initialNodes: initialNodes,
-                initialEdges: initialEdges
+            const [nodes, _setNodes, onNodesChange] = useNodesState(initialNodes);
+            const [edges, setEdges, onEdgesChange] = useEdgesState(initialEdges);
+            const onConnect = useCallback((connection)=>{
+                setEdges((eds)=>addEdge(connection, eds));
+            }, [
+                setEdges
+            ]);
+            const nodeTypes = useMemo(()=>({
+                    stage: StageNodeWrapper
+                }), [
+                StageNodeWrapper
+            ]);
+            const edgeTypes = useMemo(()=>({
+                    stage: StageEdge
+                }), []);
+            const defaultEdgeOptions = useMemo(()=>({
+                    type: 'stage'
+                }), []);
+            return /*#__PURE__*/ jsx("div", {
+                style: {
+                    width: '100vw',
+                    height: '100vh'
+                },
+                children: /*#__PURE__*/ jsx(ReactFlowProvider, {
+                    children: /*#__PURE__*/ jsx(BaseCanvas, {
+                        nodes: nodes,
+                        edges: edges,
+                        onNodesChange: onNodesChange,
+                        onEdgesChange: onEdgesChange,
+                        onConnect: onConnect,
+                        nodeTypes: nodeTypes,
+                        edgeTypes: edgeTypes,
+                        mode: "design",
+                        connectionMode: ConnectionMode.Strict,
+                        defaultEdgeOptions: defaultEdgeOptions,
+                        connectionLineComponent: StageConnectionEdge,
+                        elevateEdgesOnSelect: true,
+                        children: /*#__PURE__*/ jsx(Panel, {
+                            position: "bottom-right",
+                            children: /*#__PURE__*/ jsx(CanvasPositionControls, {
+                                translations: DefaultCanvasTranslations
+                            })
+                        })
+                    })
+                })
             });
         }
     ],
@@ -164,7 +163,7 @@ const DocumentIcon = ()=>/*#__PURE__*/ jsxs("svg", {
         strokeWidth: "1.5",
         children: [
             /*#__PURE__*/ jsx("path", {
-                d: "M14 2H6C4.9 2 4 2.9 4 4V20C4 21.1 4.9 22 6 22H18C19.1 22 20 21.1 20 20V8L14 2Z"
+                d: "M14 2H6C4.9 2 4 2.9 4 4V20C20 21.1 4.9 22 6 22H18C19.1 22 20 21.1 20 20V8L14 2Z"
             }),
             /*#__PURE__*/ jsx("path", {
                 d: "M14 2V8H20"
@@ -1275,9 +1274,17 @@ const initialTasks = [
     ]
 ];
 const DraggableTaskReorderingStory = ()=>{
+    const StageNodeWrapper = useMemo(()=>function(props) {
+            return /*#__PURE__*/ jsx(StageNode, {
+                ...props,
+                ...props.data
+            });
+        }, []);
     const nodeTypes = useMemo(()=>({
             stage: StageNodeWrapper
-        }), []);
+        }), [
+        StageNodeWrapper
+    ]);
     const edgeTypes = useMemo(()=>({
             stage: StageEdge
         }), []);
@@ -1446,9 +1453,17 @@ const availableTaskOptions = [
     }
 ];
 const AddAndReplaceTasksStory = ()=>{
+    const StageNodeWrapper = useMemo(()=>function(props) {
+            return /*#__PURE__*/ jsx(StageNode, {
+                ...props,
+                ...props.data
+            });
+        }, []);
     const nodeTypes = useMemo(()=>({
             stage: StageNodeWrapper
-        }), []);
+        }), [
+        StageNodeWrapper
+    ]);
     const edgeTypes = useMemo(()=>({
             stage: StageEdge
         }), []);
@@ -1689,25 +1704,20 @@ const AddAndReplaceTasks = {
     args: {}
 };
 const InlineTitleEditStory = ()=>{
+    const StageNodeWrapper = useMemo(()=>function(props) {
+            return /*#__PURE__*/ jsx(StageNode, {
+                ...props,
+                ...props.data
+            });
+        }, []);
     const nodeTypes = useMemo(()=>({
             stage: StageNodeWrapper
-        }), []);
+        }), [
+        StageNodeWrapper
+    ]);
     const edgeTypes = useMemo(()=>({
             stage: StageEdge
         }), []);
-    const setNodesRef = useRef(null);
-    const createTitleChangeHandler = useCallback((nodeId)=>(newTitle)=>{
-            setNodesRef.current((nds)=>nds.map((node)=>node.id === nodeId ? {
-                        ...node,
-                        data: {
-                            ...node.data,
-                            stageDetails: {
-                                ...node.data.stageDetails,
-                                label: newTitle
-                            }
-                        }
-                    } : node));
-        }, []);
     const initialNodes = useMemo(()=>[
             {
                 id: 'editable-stage',
@@ -1739,8 +1749,7 @@ const InlineTitleEditStory = ()=>{
                     },
                     onTaskAdd: ()=>{
                         window.alert('Add task functionality - this would open a dialog to add a new task');
-                    },
-                    onStageTitleChange: createTitleChangeHandler('editable-stage')
+                    }
                 }
             },
             {
@@ -1766,16 +1775,36 @@ const InlineTitleEditStory = ()=>{
                     },
                     onTaskAdd: ()=>{
                         window.alert('Add task functionality - this would open a dialog to add a new task');
-                    },
-                    onStageTitleChange: createTitleChangeHandler('long-title-stage')
+                    }
                 }
             }
-        ], [
-        createTitleChangeHandler
-    ]);
+        ], []);
     const [nodes, setNodes, onNodesChange] = useNodesState(initialNodes);
-    setNodesRef.current = setNodes;
     const [edges, setEdges, onEdgesChange] = useEdgesState([]);
+    const createTitleChangeHandler = useCallback((nodeId)=>(newTitle)=>{
+            setNodes((nds)=>nds.map((node)=>node.id === nodeId ? {
+                        ...node,
+                        data: {
+                            ...node.data,
+                            stageDetails: {
+                                ...node.data.stageDetails,
+                                label: newTitle
+                            }
+                        }
+                    } : node));
+        }, [
+        setNodes
+    ]);
+    const nodesWithHandlers = useMemo(()=>nodes.map((node)=>({
+                ...node,
+                data: {
+                    ...node.data,
+                    onStageTitleChange: createTitleChangeHandler(node.id)
+                }
+            })), [
+        nodes,
+        createTitleChangeHandler
+    ]);
     const onConnect = useCallback((connection)=>setEdges((eds)=>addEdge(connection, eds)), [
         setEdges
     ]);
@@ -1786,7 +1815,7 @@ const InlineTitleEditStory = ()=>{
         },
         children: /*#__PURE__*/ jsx(ReactFlowProvider, {
             children: /*#__PURE__*/ jsx(BaseCanvas, {
-                nodes: nodes,
+                nodes: nodesWithHandlers,
                 edges: edges,
                 onNodesChange: onNodesChange,
                 onEdgesChange: onEdgesChange,
@@ -1877,33 +1906,20 @@ const loadedTaskOptionsWithChildren = [
     }
 ];
 const AddTaskLoadingStory = ()=>{
+    const StageNodeWrapper = useMemo(()=>function(props) {
+            return /*#__PURE__*/ jsx(StageNode, {
+                ...props,
+                ...props.data
+            });
+        }, []);
     const nodeTypes = useMemo(()=>({
             stage: StageNodeWrapper
-        }), []);
+        }), [
+        StageNodeWrapper
+    ]);
     const edgeTypes = useMemo(()=>({
             stage: StageEdge
         }), []);
-    const setNodesRef = useRef(null);
-    const timeoutRef = useRef(void 0);
-    const handleAddTaskFromToolbox = useCallback((nodeId, _taskItem)=>{
-        clearTimeout(timeoutRef.current);
-        setNodesRef.current((nds)=>nds.map((n)=>n.id === nodeId ? {
-                    ...n,
-                    data: {
-                        ...n.data,
-                        addTaskLoading: true
-                    }
-                } : n));
-        timeoutRef.current = setTimeout(()=>{
-            setNodesRef.current((nds)=>nds.map((n)=>n.id === nodeId ? {
-                        ...n,
-                        data: {
-                            ...n.data,
-                            addTaskLoading: false
-                        }
-                    } : n));
-        }, 2000);
-    }, []);
     const initialNodes = useMemo(()=>[
             {
                 id: 'loading-stage-empty',
@@ -1919,10 +1935,7 @@ const AddTaskLoadingStory = ()=>{
                         tasks: []
                     },
                     addTaskLoading: true,
-                    taskOptions: [],
-                    onAddTaskFromToolbox: (taskItem)=>{
-                        handleAddTaskFromToolbox('loading-stage-empty', taskItem);
-                    }
+                    taskOptions: []
                 }
             },
             {
@@ -1947,17 +1960,11 @@ const AddTaskLoadingStory = ()=>{
                         ]
                     },
                     addTaskLoading: false,
-                    taskOptions: loadedTaskOptionsWithChildren,
-                    onAddTaskFromToolbox: (taskItem)=>{
-                        handleAddTaskFromToolbox('loading-stage-children', taskItem);
-                    }
+                    taskOptions: loadedTaskOptionsWithChildren
                 }
             }
-        ], [
-        handleAddTaskFromToolbox
-    ]);
-    const [nodes, setNodes, onNodesChange] = useNodesState(initialNodes);
-    setNodesRef.current = setNodes;
+        ], []);
+    const [nodesState, setNodes, onNodesChange] = useNodesState(initialNodes);
     const [edges, setEdges, onEdgesChange] = useEdgesState([]);
     useEffect(()=>{
         const timeout = setTimeout(()=>{
@@ -1974,7 +1981,41 @@ const AddTaskLoadingStory = ()=>{
     }, [
         setNodes
     ]);
+    const timeoutRef = useRef(void 0);
     useEffect(()=>()=>clearTimeout(timeoutRef.current), []);
+    const handleAddTaskFromToolbox = useCallback((nodeId, _taskItem)=>{
+        clearTimeout(timeoutRef.current);
+        setNodes((nds)=>nds.map((n)=>n.id === nodeId ? {
+                    ...n,
+                    data: {
+                        ...n.data,
+                        addTaskLoading: true
+                    }
+                } : n));
+        timeoutRef.current = setTimeout(()=>{
+            setNodes((nds)=>nds.map((n)=>n.id === nodeId ? {
+                        ...n,
+                        data: {
+                            ...n.data,
+                            addTaskLoading: false
+                        }
+                    } : n));
+        }, 2000);
+    }, [
+        setNodes
+    ]);
+    const nodesWithHandler = useMemo(()=>nodesState.map((node)=>({
+                ...node,
+                data: {
+                    ...node.data,
+                    onAddTaskFromToolbox: (taskItem)=>{
+                        handleAddTaskFromToolbox(node.id, taskItem);
+                    }
+                }
+            })), [
+        nodesState,
+        handleAddTaskFromToolbox
+    ]);
     const onConnect = useCallback((connection)=>setEdges((eds)=>addEdge(connection, eds)), [
         setEdges
     ]);
@@ -1985,7 +2026,7 @@ const AddTaskLoadingStory = ()=>{
         },
         children: /*#__PURE__*/ jsx(ReactFlowProvider, {
             children: /*#__PURE__*/ jsx(BaseCanvas, {
-                nodes: nodes,
+                nodes: nodesWithHandler,
                 edges: edges,
                 onNodesChange: onNodesChange,
                 onEdgesChange: onEdgesChange,

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

@@ -34,7 +34,7 @@ export interface StageHeaderChip {
     tooltip?: React.ReactNode;
     onClick?: () => void;
 }
-export interface StageNodeBaseProps {
+export interface StageNodeProps extends NodeProps {
     dragging: boolean;
     selected: boolean;
     id: string;
@@ -76,10 +76,8 @@ export interface StageNodeBaseProps {
     onTaskReorder?: (reorderedTasks: StageTaskItem[][]) => void;
     onReplaceTaskFromToolbox?: (newTask: ListItem, groupIndex: number, taskIndex: number) => void;
     onTaskPlay?: (taskId: string) => Promise<void>;
+    hideParallelOptions?: boolean;
 }
-export interface StageNodeProps extends NodeProps, StageNodeBaseProps {
-}
-export type StageNodeInnerProps = StageNodeBaseProps & Pick<NodeProps, 'width'>;
 export interface StageTaskExecution {
     status?: StageTaskStatus;
     message?: string;
@@ -90,10 +88,5 @@ export interface StageTaskExecution {
     badgeStatus?: 'warning' | 'info' | 'error';
     retryCount?: number;
 }
-export interface StageTaskDragOverlayProps {
-    activeTask: StageTaskItem | undefined;
-    isActiveTaskParallel: boolean;
-    taskWidthStyle: React.CSSProperties | undefined;
-}
 export {};
 //# sourceMappingURL=StageNode.types.d.ts.map

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

@@ -30,7 +30,7 @@ __webpack_require__.d(__webpack_exports__, {
     getContextMenuItems: ()=>getContextMenuItems
 });
 const GroupModificationUtils_cjs_namespaceObject = require("../../utils/GroupModificationUtils.cjs");
-const getContextMenuItems = (isParallelGroup, groupIndex, tasksLength, taskIndex, _taskGroupLength, isAboveParallel, isBelowParallel, reGroupTaskFunction)=>{
+const getContextMenuItems = (isParallelGroup, groupIndex, tasksLength, taskIndex, _taskGroupLength, isAboveParallel, isBelowParallel, reGroupTaskFunction, hideParallelOptions = false)=>{
     const CONTEXT_MENU_ITEMS = {
         MOVE_UP: getMenuItem('move-up', 'Move up', ()=>reGroupTaskFunction(GroupModificationUtils_cjs_namespaceObject.GroupModificationType.TASK_GROUP_UP, groupIndex, taskIndex)),
         MOVE_DOWN: getMenuItem('move-down', 'Move down', ()=>reGroupTaskFunction(GroupModificationUtils_cjs_namespaceObject.GroupModificationType.TASK_GROUP_DOWN, groupIndex, taskIndex)),
@@ -48,7 +48,8 @@ const getContextMenuItems = (isParallelGroup, groupIndex, tasksLength, taskIndex
     if (groupIndex > 0) items.push(CONTEXT_MENU_ITEMS.MOVE_UP);
     if (groupIndex < tasksLength - 1) items.push(CONTEXT_MENU_ITEMS.MOVE_DOWN);
     if (items.length) items.push(CONTEXT_MENU_ITEMS.DIVIDER);
-    if (isParallelGroup) items.push(CONTEXT_MENU_ITEMS.UNGROUP_ALL, CONTEXT_MENU_ITEMS.SPLIT_TASK, CONTEXT_MENU_ITEMS.DIVIDER, CONTEXT_MENU_ITEMS.REMOVE_GROUP, CONTEXT_MENU_ITEMS.REMOVE_TASK);
+    if (isParallelGroup && !hideParallelOptions) items.push(CONTEXT_MENU_ITEMS.UNGROUP_ALL, CONTEXT_MENU_ITEMS.SPLIT_TASK, CONTEXT_MENU_ITEMS.DIVIDER, CONTEXT_MENU_ITEMS.REMOVE_GROUP, CONTEXT_MENU_ITEMS.REMOVE_TASK);
+    else if (isParallelGroup || hideParallelOptions) items.push(CONTEXT_MENU_ITEMS.REMOVE_TASK);
     else {
         if (groupIndex > 0) items.push(isAboveParallel ? CONTEXT_MENU_ITEMS.ADD_TO_PARALLEL_GROUP_ABOVE : CONTEXT_MENU_ITEMS.CREATE_PARALLEL_GROUP_ABOVE);
         if (groupIndex < tasksLength - 1) items.push(isBelowParallel ? CONTEXT_MENU_ITEMS.ADD_TO_PARALLEL_GROUP_BELOW : CONTEXT_MENU_ITEMS.CREATE_PARALLEL_GROUP_BELOW);

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

@@ -1,7 +1,7 @@
 import type { ReactNode } from 'react';
 import { GroupModificationType } from '../../utils/GroupModificationUtils';
 import type { NodeMenuAction, NodeMenuItem } from '../NodeContextMenu';
-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 const getContextMenuItems: (isParallelGroup: boolean, groupIndex: number, tasksLength: number, taskIndex: number, _taskGroupLength: number, isAboveParallel: boolean, isBelowParallel: boolean, reGroupTaskFunction: (groupModificationType: GroupModificationType, groupIndex: number, taskIndex: number) => void, hideParallelOptions?: boolean) => NodeMenuItem[];
 export declare function getMenuItem(id: string | undefined, label: string | undefined, onClick: () => void, isDisabled?: boolean): NodeMenuItem;
 export declare const getDivider: () => 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,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;AAED,eAAO,MAAM,UAAU,QAAO,YAI7B,CAAC;AAEF,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,EACT,6BAA2B,KAC1B,YAAY,EAmFd,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;AAED,eAAO,MAAM,UAAU,QAAO,YAI7B,CAAC;AAEF,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,5 +1,5 @@
 import { GroupModificationType } from "../../utils/GroupModificationUtils.js";
-const getContextMenuItems = (isParallelGroup, groupIndex, tasksLength, taskIndex, _taskGroupLength, isAboveParallel, isBelowParallel, reGroupTaskFunction)=>{
+const getContextMenuItems = (isParallelGroup, groupIndex, tasksLength, taskIndex, _taskGroupLength, isAboveParallel, isBelowParallel, reGroupTaskFunction, hideParallelOptions = false)=>{
     const CONTEXT_MENU_ITEMS = {
         MOVE_UP: getMenuItem('move-up', 'Move up', ()=>reGroupTaskFunction(GroupModificationType.TASK_GROUP_UP, groupIndex, taskIndex)),
         MOVE_DOWN: getMenuItem('move-down', 'Move down', ()=>reGroupTaskFunction(GroupModificationType.TASK_GROUP_DOWN, groupIndex, taskIndex)),
@@ -17,7 +17,8 @@ const getContextMenuItems = (isParallelGroup, groupIndex, tasksLength, taskIndex
     if (groupIndex > 0) items.push(CONTEXT_MENU_ITEMS.MOVE_UP);
     if (groupIndex < tasksLength - 1) items.push(CONTEXT_MENU_ITEMS.MOVE_DOWN);
     if (items.length) items.push(CONTEXT_MENU_ITEMS.DIVIDER);
-    if (isParallelGroup) items.push(CONTEXT_MENU_ITEMS.UNGROUP_ALL, CONTEXT_MENU_ITEMS.SPLIT_TASK, CONTEXT_MENU_ITEMS.DIVIDER, CONTEXT_MENU_ITEMS.REMOVE_GROUP, CONTEXT_MENU_ITEMS.REMOVE_TASK);
+    if (isParallelGroup && !hideParallelOptions) items.push(CONTEXT_MENU_ITEMS.UNGROUP_ALL, CONTEXT_MENU_ITEMS.SPLIT_TASK, CONTEXT_MENU_ITEMS.DIVIDER, CONTEXT_MENU_ITEMS.REMOVE_GROUP, CONTEXT_MENU_ITEMS.REMOVE_TASK);
+    else if (isParallelGroup || hideParallelOptions) items.push(CONTEXT_MENU_ITEMS.REMOVE_TASK);
     else {
         if (groupIndex > 0) items.push(isAboveParallel ? CONTEXT_MENU_ITEMS.ADD_TO_PARALLEL_GROUP_ABOVE : CONTEXT_MENU_ITEMS.CREATE_PARALLEL_GROUP_ABOVE);
         if (groupIndex < tasksLength - 1) items.push(isBelowParallel ? CONTEXT_MENU_ITEMS.ADD_TO_PARALLEL_GROUP_BELOW : CONTEXT_MENU_ITEMS.CREATE_PARALLEL_GROUP_BELOW);

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

@@ -41,30 +41,24 @@ var apollo_core_default = /*#__PURE__*/ __webpack_require__.n(apollo_core_namesp
 const index_cjs_namespaceObject = require("../../../material/index.cjs");
 const external_react_namespaceObject = require("react");
 const external_StageNodeTaskUtilities_cjs_namespaceObject = require("./StageNodeTaskUtilities.cjs");
-const TaskMenuComponent = ({ taskId, getContextMenuItems, onMenuOpenChange, taskRef }, ref)=>{
+const TaskMenuComponent = ({ taskId, contextMenuItems, onMenuOpenChange, onMenuOpen, taskRef }, ref)=>{
+    const [isMenuOpen, setIsMenuOpen] = (0, external_react_namespaceObject.useState)(false);
     const [anchorElement, setAnchorElement] = (0, external_react_namespaceObject.useState)(null);
     const menuAnchorRef = (0, external_react_namespaceObject.useRef)(null);
-    const isMenuOpen = null !== anchorElement;
-    const [menuItems, setMenuItems] = (0, external_react_namespaceObject.useState)([]);
     const handleMenuClose = (0, external_react_namespaceObject.useCallback)(()=>{
+        setIsMenuOpen(false);
         setAnchorElement(null);
         onMenuOpenChange?.(false);
     }, [
         onMenuOpenChange
     ]);
-    const handleMenuItemClick = (0, external_react_namespaceObject.useCallback)((item)=>{
-        item.onClick();
-        handleMenuClose();
-    }, [
-        handleMenuClose
-    ]);
     const openMenu = (0, external_react_namespaceObject.useCallback)((anchor)=>{
         setAnchorElement(anchor);
-        setMenuItems((0, external_StageNodeTaskUtilities_cjs_namespaceObject.transformMenuItems)(getContextMenuItems(), handleMenuItemClick));
+        setIsMenuOpen(true);
+        onMenuOpen?.();
         onMenuOpenChange?.(true);
     }, [
-        getContextMenuItems,
-        handleMenuItemClick,
+        onMenuOpen,
         onMenuOpenChange
     ]);
     const handleMenuClick = (0, external_react_namespaceObject.useCallback)((e)=>{
@@ -92,6 +86,16 @@ const TaskMenuComponent = ({ taskId, getContextMenuItems, onMenuOpenChange, task
     const handleMenuMouseDown = (0, external_react_namespaceObject.useCallback)((e)=>{
         e.stopPropagation();
     }, []);
+    const handleMenuItemClick = (0, external_react_namespaceObject.useCallback)((item)=>{
+        item.onClick();
+        handleMenuClose();
+    }, [
+        handleMenuClose
+    ]);
+    const transformedMenuItems = (0, external_react_namespaceObject.useMemo)(()=>(0, external_StageNodeTaskUtilities_cjs_namespaceObject.transformMenuItems)(contextMenuItems, handleMenuItemClick), [
+        contextMenuItems,
+        handleMenuItemClick
+    ]);
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(jsx_runtime_namespaceObject.Fragment, {
         children: [
             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_cjs_namespaceObject.ApIconButton, {
@@ -114,7 +118,7 @@ const TaskMenuComponent = ({ taskId, getContextMenuItems, onMenuOpenChange, task
             }),
             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_cjs_namespaceObject.ApMenu, {
                 isOpen: isMenuOpen,
-                menuItems: menuItems,
+                menuItems: transformedMenuItems,
                 anchorEl: anchorElement,
                 onClose: handleMenuClose,
                 anchorOrigin: {

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

@@ -4,8 +4,9 @@ export interface TaskMenuHandle {
 }
 interface TaskMenuProps {
     taskId: string;
-    getContextMenuItems: () => NodeMenuItem[];
+    contextMenuItems: NodeMenuItem[];
     onMenuOpenChange?: (isOpen: boolean) => void;
+    onMenuOpen?: () => void;
     taskRef?: React.RefObject<HTMLElement | null>;
 }
 export declare const TaskMenu: import("react").NamedExoticComponent<TaskMenuProps & import("react").RefAttributes<TaskMenuHandle>>;

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

@@ -1 +1 @@
-{"version":3,"file":"TaskMenu.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/TaskMenu.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAkB,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAGvE,MAAM,WAAW,cAAc;IAC7B,iBAAiB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;CAC/D;AAED,UAAU,aAAa;IACrB,MAAM,EAAE,MAAM,CAAC;IACf,mBAAmB,EAAE,MAAM,YAAY,EAAE,CAAC;IAC1C,gBAAgB,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7C,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;CAC/C;AAiHD,eAAO,MAAM,QAAQ,qGAAsC,CAAC"}
+{"version":3,"file":"TaskMenu.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/TaskMenu.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAkB,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAIvE,MAAM,WAAW,cAAc;IAC7B,iBAAiB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAC;CAC/D;AAED,UAAU,aAAa;IACrB,MAAM,EAAE,MAAM,CAAC;IACf,gBAAgB,EAAE,YAAY,EAAE,CAAC;IACjC,gBAAgB,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7C,UAAU,CAAC,EAAE,MAAM,IAAI,CAAC;IACxB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;CAC/C;AAqHD,eAAO,MAAM,QAAQ,qGAAsC,CAAC"}

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

@@ -1,32 +1,26 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import apollo_core, { Spacing } from "@uipath/apollo-core";
 import { ApIcon, ApIconButton, ApMenu } from "../../../material/index.js";
-import { forwardRef, memo, useCallback, useImperativeHandle, useRef, useState } from "react";
+import { forwardRef, memo, useCallback, useImperativeHandle, useMemo, useRef, useState } from "react";
 import { transformMenuItems } from "./StageNodeTaskUtilities.js";
-const TaskMenuComponent = ({ taskId, getContextMenuItems, onMenuOpenChange, taskRef }, ref)=>{
+const TaskMenuComponent = ({ taskId, contextMenuItems, onMenuOpenChange, onMenuOpen, taskRef }, ref)=>{
+    const [isMenuOpen, setIsMenuOpen] = useState(false);
     const [anchorElement, setAnchorElement] = useState(null);
     const menuAnchorRef = useRef(null);
-    const isMenuOpen = null !== anchorElement;
-    const [menuItems, setMenuItems] = useState([]);
     const handleMenuClose = useCallback(()=>{
+        setIsMenuOpen(false);
         setAnchorElement(null);
         onMenuOpenChange?.(false);
     }, [
         onMenuOpenChange
     ]);
-    const handleMenuItemClick = useCallback((item)=>{
-        item.onClick();
-        handleMenuClose();
-    }, [
-        handleMenuClose
-    ]);
     const openMenu = useCallback((anchor)=>{
         setAnchorElement(anchor);
-        setMenuItems(transformMenuItems(getContextMenuItems(), handleMenuItemClick));
+        setIsMenuOpen(true);
+        onMenuOpen?.();
         onMenuOpenChange?.(true);
     }, [
-        getContextMenuItems,
-        handleMenuItemClick,
+        onMenuOpen,
         onMenuOpenChange
     ]);
     const handleMenuClick = useCallback((e)=>{
@@ -54,6 +48,16 @@ const TaskMenuComponent = ({ taskId, getContextMenuItems, onMenuOpenChange, task
     const handleMenuMouseDown = useCallback((e)=>{
         e.stopPropagation();
     }, []);
+    const handleMenuItemClick = useCallback((item)=>{
+        item.onClick();
+        handleMenuClose();
+    }, [
+        handleMenuClose
+    ]);
+    const transformedMenuItems = useMemo(()=>transformMenuItems(contextMenuItems, handleMenuItemClick), [
+        contextMenuItems,
+        handleMenuItemClick
+    ]);
     return /*#__PURE__*/ jsxs(Fragment, {
         children: [
             /*#__PURE__*/ jsx(ApIconButton, {
@@ -76,7 +80,7 @@ const TaskMenuComponent = ({ taskId, getContextMenuItems, onMenuOpenChange, task
             }),
             /*#__PURE__*/ jsx(ApMenu, {
                 isOpen: isMenuOpen,
-                menuItems: menuItems,
+                menuItems: transformedMenuItems,
                 anchorEl: anchorElement,
                 onClose: handleMenuClose,
                 anchorOrigin: {

package/package.json

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