npm - @uipath/apollo-react - Versions diffs - 3.58.1 → 3.59.0 - Mend

@uipath/apollo-react 3.58.1 → 3.59.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (20) hide show

package/dist/canvas/components/BaseNode/BaseNode.stories.cjs CHANGED Viewed

@@ -25,9 +25,9 @@ var __webpack_exports__ = {};
 __webpack_require__.r(__webpack_exports__);
 __webpack_require__.d(__webpack_exports__, {
     CustomizedSizes: ()=>CustomizedSizes,
-    Loading: ()=>Loading,
     ValidationStates: ()=>ValidationStates,
     Default: ()=>Default,
+    Adornments: ()=>Adornments,
     default: ()=>BaseNode_stories,
     DynamicHandles: ()=>DynamicHandles
 });
@@ -850,65 +850,6 @@ function DynamicHandlesStory() {
         ]
     });
 }
-function createLoadingGrid() {
-    const shapes = [
-        {
-            type: 'uipath.blank-node',
-            shape: 'square',
-            label: 'Square'
-        },
-        {
-            type: 'uipath.control-flow.terminate',
-            shape: 'circle',
-            label: 'Circle'
-        },
-        {
-            type: 'uipath.agent',
-            shape: 'rectangle',
-            label: 'Rectangle'
-        }
-    ];
-    return shapes.map((config, index)=>(0, external_storybook_utils_index_cjs_namespaceObject.createNode)({
-            id: `loading-${config.shape}`,
-            type: config.type,
-            position: {
-                x: 96 + 192 * index,
-                y: 96
-            },
-            data: {
-                nodeType: config.type,
-                version: '1.0.0',
-                loading: true,
-                display: {
-                    label: config.label,
-                    subLabel: 'Loading...',
-                    shape: config.shape
-                }
-            }
-        }));
-}
-function LoadingStory() {
-    const initialNodes = (0, external_react_namespaceObject.useMemo)(()=>createLoadingGrid(), []);
-    const { canvasProps } = (0, external_storybook_utils_index_cjs_namespaceObject.useCanvasStory)({
-        initialNodes
-    });
-    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_BaseCanvas_index_cjs_namespaceObject.BaseCanvas, {
-        ...canvasProps,
-        mode: "design",
-        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
-                })
-            }),
-            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_storybook_utils_index_cjs_namespaceObject.StoryInfoPanel, {
-                title: "Loading State",
-                description: "Nodes in skeleton loading state for circle, square, and rectangle shapes."
-            })
-        ]
-    });
-}
 const Default = {
     name: 'Default',
     render: ()=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(DefaultStory, {})
@@ -980,6 +921,169 @@ function ValidationStatesStory() {
         ]
     });
 }
+const ADORNMENT_ROWS = [
+    {
+        key: 'breakpoint',
+        label: 'Breakpoint (top-left)'
+    },
+    {
+        key: 'status-completed',
+        label: 'Status: Completed (top-right)'
+    },
+    {
+        key: 'status-inprogress',
+        label: 'Status: InProgress (top-right)'
+    },
+    {
+        key: 'status-failed',
+        label: 'Status: Failed (top-right)'
+    },
+    {
+        key: 'start-point',
+        label: 'Start Point (bottom-left)'
+    },
+    {
+        key: 'square-dashed',
+        label: 'Square Dashed (bottom-right)'
+    },
+    {
+        key: 'all',
+        label: 'All Adornments'
+    },
+    {
+        key: 'multi-exec',
+        label: 'Multi-execution (count: 5)'
+    }
+];
+function createAdornmentGrid() {
+    const nodes = [];
+    ADORNMENT_ROWS.forEach((row, rowIndex)=>{
+        SHAPES.forEach((shape, colIndex)=>{
+            const label = 'rectangle' === shape ? 'Invoice approval agent' : 'Header';
+            const nodeType = 'rectangle' === shape ? 'uipath.agent' : 'uipath.blank-node';
+            nodes.push((0, external_storybook_utils_index_cjs_namespaceObject.createNode)({
+                id: `adorn-${row.key}-${shape}`,
+                type: nodeType,
+                position: {
+                    x: GRID_CONFIG.startX + colIndex * GRID_CONFIG.gapX,
+                    y: GRID_CONFIG.startY + rowIndex * GRID_CONFIG.gapY
+                },
+                data: {
+                    nodeType,
+                    version: '1.0.0',
+                    display: {
+                        label,
+                        subLabel: row.label,
+                        shape
+                    }
+                }
+            }));
+        });
+    });
+    return nodes;
+}
+function getAdornmentExecutionState(key) {
+    switch(key){
+        case 'breakpoint':
+            return {
+                status: 'None',
+                debug: true
+            };
+        case 'status-completed':
+            return {
+                status: 'Completed'
+            };
+        case 'status-inprogress':
+            return {
+                status: 'InProgress'
+            };
+        case 'status-failed':
+            return {
+                status: 'Failed'
+            };
+        case 'start-point':
+            return {
+                status: 'None',
+                isExecutionStartPoint: true
+            };
+        case 'square-dashed':
+            return {
+                status: 'None',
+                isOutputPinned: true
+            };
+        case 'all':
+            return {
+                status: 'Completed',
+                debug: true,
+                isExecutionStartPoint: true,
+                isOutputPinned: true
+            };
+        case 'multi-exec':
+            return {
+                status: 'Completed',
+                count: 5
+            };
+        default:
+            return;
+    }
+}
+function AdornmentsStory() {
+    const initialNodes = (0, external_react_namespaceObject.useMemo)(()=>createAdornmentGrid(), []);
+    const { canvasProps } = (0, external_storybook_utils_index_cjs_namespaceObject.useCanvasStory)({
+        initialNodes
+    });
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_BaseCanvas_index_cjs_namespaceObject.BaseCanvas, {
+        ...canvasProps,
+        mode: "design",
+        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
+                })
+            }),
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_storybook_utils_index_cjs_namespaceObject.StoryInfoPanel, {
+                title: "Adornments",
+                description: "Grid showing all adornment types across shapes. Each row demonstrates a different adornment: breakpoint (top-left), execution status (top-right), execution start point (bottom-left), square dashed (bottom-right), and all combined."
+            })
+        ]
+    });
+}
+const Adornments = {
+    name: 'Adornments',
+    decorators: [
+        (Story)=>{
+            const registry = (0, external_react_namespaceObject.useMemo)(()=>{
+                const reg = new external_core_index_cjs_namespaceObject.NodeTypeRegistry();
+                reg.registerManifest(sampleManifest.nodes, sampleManifest.categories);
+                return reg;
+            }, []);
+            const contextValue = (0, external_react_namespaceObject.useMemo)(()=>({
+                    registry
+                }), [
+                registry
+            ]);
+            return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_core_index_cjs_namespaceObject.NodeRegistryContext.Provider, {
+                value: contextValue,
+                children: Story()
+            });
+        },
+        (0, external_storybook_utils_index_cjs_namespaceObject.withCanvasProviders)({
+            executionState: {
+                getNodeExecutionState: (nodeId)=>{
+                    const parts = nodeId.split('-');
+                    const key = parts.slice(1, -1).join('-');
+                    return getAdornmentExecutionState(key);
+                },
+                getEdgeExecutionState: ()=>void 0
+            },
+            validationState: {
+                getElementValidationState: ()=>void 0
+            }
+        })
+    ],
+    render: ()=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(AdornmentsStory, {})
+};
 const ValidationStates = {
     name: 'Validation States',
     decorators: [
@@ -1027,21 +1131,17 @@ const ValidationStates = {
     ],
     render: ()=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ValidationStatesStory, {})
 };
-const Loading = {
-    name: 'Loading',
-    render: ()=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(LoadingStory, {})
-};
+exports.Adornments = __webpack_exports__.Adornments;
 exports.CustomizedSizes = __webpack_exports__.CustomizedSizes;
 exports.Default = __webpack_exports__.Default;
 exports.DynamicHandles = __webpack_exports__.DynamicHandles;
-exports.Loading = __webpack_exports__.Loading;
 exports.ValidationStates = __webpack_exports__.ValidationStates;
 exports["default"] = __webpack_exports__["default"];
 for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "Adornments",
     "CustomizedSizes",
     "Default",
     "DynamicHandles",
-    "Loading",
     "ValidationStates",
     "default"
 ].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];

package/dist/canvas/components/BaseNode/BaseNode.stories.d.ts CHANGED Viewed

@@ -6,6 +6,6 @@ type Story = StoryObj<typeof meta>;
 export declare const Default: Story;
 export declare const CustomizedSizes: Story;
 export declare const DynamicHandles: Story;
+export declare const Adornments: Story;
 export declare const ValidationStates: Story;
-export declare const Loading: Story;
 //# sourceMappingURL=BaseNode.stories.d.ts.map

package/dist/canvas/components/BaseNode/BaseNode.stories.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BaseNode.stories.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/BaseNode/BaseNode.stories.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAmBvD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAyMrD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,YAAY,CAqB5B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;~~AAkcnC~~,eAAO,MAAM,OAAO,EAAE,KAGrB,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAG7B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAG5B,CAAC;~~AAmEF~~,eAAO,MAAM,~~gBAAgB~~,EAAE,~~KAuC9B~~,CAAC;AAEF,eAAO,MAAM,~~OAAO~~,EAAE,~~KAGrB~~,CAAC"}
1	+ {"version":3,"file":"BaseNode.stories.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/BaseNode/BaseNode.stories.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAmBvD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAyMrD,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,YAAY,CAqB5B,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAmZnC,eAAO,MAAM,OAAO,EAAE,KAGrB,CAAC;AAEF,eAAO,MAAM,eAAe,EAAE,KAG7B,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,KAG5B,CAAC;AA0KF,eAAO,MAAM,UAAU,EAAE,KAiCxB,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAuC9B,CAAC"}

package/dist/canvas/components/BaseNode/BaseNode.stories.js CHANGED Viewed

@@ -817,65 +817,6 @@ function DynamicHandlesStory() {
         ]
     });
 }
-function createLoadingGrid() {
-    const shapes = [
-        {
-            type: 'uipath.blank-node',
-            shape: 'square',
-            label: 'Square'
-        },
-        {
-            type: 'uipath.control-flow.terminate',
-            shape: 'circle',
-            label: 'Circle'
-        },
-        {
-            type: 'uipath.agent',
-            shape: 'rectangle',
-            label: 'Rectangle'
-        }
-    ];
-    return shapes.map((config, index)=>createNode({
-            id: `loading-${config.shape}`,
-            type: config.type,
-            position: {
-                x: 96 + 192 * index,
-                y: 96
-            },
-            data: {
-                nodeType: config.type,
-                version: '1.0.0',
-                loading: true,
-                display: {
-                    label: config.label,
-                    subLabel: 'Loading...',
-                    shape: config.shape
-                }
-            }
-        }));
-}
-function LoadingStory() {
-    const initialNodes = useMemo(()=>createLoadingGrid(), []);
-    const { canvasProps } = useCanvasStory({
-        initialNodes
-    });
-    return /*#__PURE__*/ jsxs(BaseCanvas, {
-        ...canvasProps,
-        mode: "design",
-        children: [
-            /*#__PURE__*/ jsx(Panel, {
-                position: "bottom-right",
-                children: /*#__PURE__*/ jsx(CanvasPositionControls, {
-                    translations: DefaultCanvasTranslations
-                })
-            }),
-            /*#__PURE__*/ jsx(StoryInfoPanel, {
-                title: "Loading State",
-                description: "Nodes in skeleton loading state for circle, square, and rectangle shapes."
-            })
-        ]
-    });
-}
 const Default = {
     name: 'Default',
     render: ()=>/*#__PURE__*/ jsx(DefaultStory, {})
@@ -947,6 +888,169 @@ function ValidationStatesStory() {
         ]
     });
 }
+const ADORNMENT_ROWS = [
+    {
+        key: 'breakpoint',
+        label: 'Breakpoint (top-left)'
+    },
+    {
+        key: 'status-completed',
+        label: 'Status: Completed (top-right)'
+    },
+    {
+        key: 'status-inprogress',
+        label: 'Status: InProgress (top-right)'
+    },
+    {
+        key: 'status-failed',
+        label: 'Status: Failed (top-right)'
+    },
+    {
+        key: 'start-point',
+        label: 'Start Point (bottom-left)'
+    },
+    {
+        key: 'square-dashed',
+        label: 'Square Dashed (bottom-right)'
+    },
+    {
+        key: 'all',
+        label: 'All Adornments'
+    },
+    {
+        key: 'multi-exec',
+        label: 'Multi-execution (count: 5)'
+    }
+];
+function createAdornmentGrid() {
+    const nodes = [];
+    ADORNMENT_ROWS.forEach((row, rowIndex)=>{
+        SHAPES.forEach((shape, colIndex)=>{
+            const label = 'rectangle' === shape ? 'Invoice approval agent' : 'Header';
+            const nodeType = 'rectangle' === shape ? 'uipath.agent' : 'uipath.blank-node';
+            nodes.push(createNode({
+                id: `adorn-${row.key}-${shape}`,
+                type: nodeType,
+                position: {
+                    x: GRID_CONFIG.startX + colIndex * GRID_CONFIG.gapX,
+                    y: GRID_CONFIG.startY + rowIndex * GRID_CONFIG.gapY
+                },
+                data: {
+                    nodeType,
+                    version: '1.0.0',
+                    display: {
+                        label,
+                        subLabel: row.label,
+                        shape
+                    }
+                }
+            }));
+        });
+    });
+    return nodes;
+}
+function getAdornmentExecutionState(key) {
+    switch(key){
+        case 'breakpoint':
+            return {
+                status: 'None',
+                debug: true
+            };
+        case 'status-completed':
+            return {
+                status: 'Completed'
+            };
+        case 'status-inprogress':
+            return {
+                status: 'InProgress'
+            };
+        case 'status-failed':
+            return {
+                status: 'Failed'
+            };
+        case 'start-point':
+            return {
+                status: 'None',
+                isExecutionStartPoint: true
+            };
+        case 'square-dashed':
+            return {
+                status: 'None',
+                isOutputPinned: true
+            };
+        case 'all':
+            return {
+                status: 'Completed',
+                debug: true,
+                isExecutionStartPoint: true,
+                isOutputPinned: true
+            };
+        case 'multi-exec':
+            return {
+                status: 'Completed',
+                count: 5
+            };
+        default:
+            return;
+    }
+}
+function AdornmentsStory() {
+    const initialNodes = useMemo(()=>createAdornmentGrid(), []);
+    const { canvasProps } = useCanvasStory({
+        initialNodes
+    });
+    return /*#__PURE__*/ jsxs(BaseCanvas, {
+        ...canvasProps,
+        mode: "design",
+        children: [
+            /*#__PURE__*/ jsx(Panel, {
+                position: "bottom-right",
+                children: /*#__PURE__*/ jsx(CanvasPositionControls, {
+                    translations: DefaultCanvasTranslations
+                })
+            }),
+            /*#__PURE__*/ jsx(StoryInfoPanel, {
+                title: "Adornments",
+                description: "Grid showing all adornment types across shapes. Each row demonstrates a different adornment: breakpoint (top-left), execution status (top-right), execution start point (bottom-left), square dashed (bottom-right), and all combined."
+            })
+        ]
+    });
+}
+const Adornments = {
+    name: 'Adornments',
+    decorators: [
+        (Story)=>{
+            const registry = useMemo(()=>{
+                const reg = new NodeTypeRegistry();
+                reg.registerManifest(sampleManifest.nodes, sampleManifest.categories);
+                return reg;
+            }, []);
+            const contextValue = useMemo(()=>({
+                    registry
+                }), [
+                registry
+            ]);
+            return /*#__PURE__*/ jsx(NodeRegistryContext.Provider, {
+                value: contextValue,
+                children: Story()
+            });
+        },
+        withCanvasProviders({
+            executionState: {
+                getNodeExecutionState: (nodeId)=>{
+                    const parts = nodeId.split('-');
+                    const key = parts.slice(1, -1).join('-');
+                    return getAdornmentExecutionState(key);
+                },
+                getEdgeExecutionState: ()=>void 0
+            },
+            validationState: {
+                getElementValidationState: ()=>void 0
+            }
+        })
+    ],
+    render: ()=>/*#__PURE__*/ jsx(AdornmentsStory, {})
+};
 const ValidationStates = {
     name: 'Validation States',
     decorators: [
@@ -994,8 +1098,4 @@ const ValidationStates = {
     ],
     render: ()=>/*#__PURE__*/ jsx(ValidationStatesStory, {})
 };
-const Loading = {
-    name: 'Loading',
-    render: ()=>/*#__PURE__*/ jsx(LoadingStory, {})
-};
-export { CustomizedSizes, Default, DynamicHandles, Loading, ValidationStates, BaseNode_stories as default };
+export { Adornments, CustomizedSizes, Default, DynamicHandles, ValidationStates, BaseNode_stories as default };

package/dist/canvas/components/StageNode/DraggableTask.cjs CHANGED Viewed

@@ -127,8 +127,11 @@ const TaskContent = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(({ ta
                         taskExecution?.status && (taskExecution.message ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApTooltip, {
                             content: taskExecution.message,
                             placement: "top",
-                            children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_ExecutionStatusIcon_index_cjs_namespaceObject.ExecutionStatusIcon, {
-                                status: taskExecution.status
+                            children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApIconButton, {
+                                size: "small",
+                                children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_ExecutionStatusIcon_index_cjs_namespaceObject.ExecutionStatusIcon, {
+                                    status: taskExecution.status
+                                })
                             })
                         }) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_ExecutionStatusIcon_index_cjs_namespaceObject.ExecutionStatusIcon, {
                             status: taskExecution.status
@@ -229,7 +232,6 @@ const DraggableTaskComponent = ({ task, taskExecution, isSelected, isParallel, c
         status: taskExecution?.status,
         isParallel: isParallel,
         isDragEnabled: !isDragDisabled,
-        isMenuOpen: isMenuOpen,
         onClick: handleClick,
         ...contextMenuItems.length > 0 && {
             onContextMenu: handleContextMenu

package/dist/canvas/components/StageNode/DraggableTask.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DraggableTask.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/DraggableTask.tsx"],"names":[],"mappings":"~~AAaA~~,OAAO,KAAK,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAgClF,eAAO,MAAM,WAAW,4EAA8C,gBAAgB,~~6CAsEpF~~,CAAC;~~AAqHH~~,eAAO,MAAM,aAAa,~~0KAxGvB~~,kBAAkB,~~6CAwGoC~~,CAAC"}
1	+ {"version":3,"file":"DraggableTask.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/DraggableTask.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAE,kBAAkB,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAgClF,eAAO,MAAM,WAAW,4EAA8C,gBAAgB,6CAwEpF,CAAC;AAoHH,eAAO,MAAM,aAAa,0KAvGvB,kBAAkB,6CAuGoC,CAAC"}

package/dist/canvas/components/StageNode/DraggableTask.js CHANGED Viewed

@@ -3,7 +3,7 @@ import { useSortable } from "@dnd-kit/sortable";
 import { CSS } from "@dnd-kit/utilities";
 import { FontVariantToken, Padding, Spacing } from "@uipath/apollo-core";
 import { Column, Row } from "../../layouts/index.js";
-import { ApBadge, ApTooltip, ApTypography, BadgeSize } from "../../../material/index.js";
+import { ApBadge, ApIconButton, ApTooltip, ApTypography, BadgeSize } from "../../../material/index.js";
 import { memo, useCallback, useMemo, useRef, useState } from "react";
 import { ExecutionStatusIcon } from "../ExecutionStatusIcon/index.js";
 import { INDENTATION_WIDTH, StageTask, StageTaskDragPlaceholder, StageTaskDragPlaceholderWrapper, StageTaskIcon, StageTaskRetryDuration, StageTaskWrapper } from "./StageNode.styles.js";
@@ -98,8 +98,11 @@ const TaskContent = /*#__PURE__*/ memo(({ task, taskExecution, isDragging })=>/*
                         taskExecution?.status && (taskExecution.message ? /*#__PURE__*/ jsx(ApTooltip, {
                             content: taskExecution.message,
                             placement: "top",
-                            children: /*#__PURE__*/ jsx(ExecutionStatusIcon, {
-                                status: taskExecution.status
+                            children: /*#__PURE__*/ jsx(ApIconButton, {
+                                size: "small",
+                                children: /*#__PURE__*/ jsx(ExecutionStatusIcon, {
+                                    status: taskExecution.status
+                                })
                             })
                         }) : /*#__PURE__*/ jsx(ExecutionStatusIcon, {
                             status: taskExecution.status
@@ -200,7 +203,6 @@ const DraggableTaskComponent = ({ task, taskExecution, isSelected, isParallel, c
         status: taskExecution?.status,
         isParallel: isParallel,
         isDragEnabled: !isDragDisabled,
-        isMenuOpen: isMenuOpen,
         onClick: handleClick,
         ...contextMenuItems.length > 0 && {
             onContextMenu: handleContextMenu

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

@@ -309,6 +309,50 @@ const Default = {
                             }
                         }))
                 }
+            },
+            {
+                id: '2',
+                type: 'stage',
+                position: {
+                    x: 752,
+                    y: 96
+                },
+                width: 304,
+                data: {
+                    onReplaceTaskFromToolbox: ()=>{},
+                    stageDetails: {
+                        label: 'Validation - Failed',
+                        isReadOnly: true,
+                        tasks: [
+                            [
+                                {
+                                    id: '1',
+                                    label: 'Data Validation',
+                                    icon: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(VerificationIcon, {})
+                                }
+                            ],
+                            [
+                                {
+                                    id: '2',
+                                    label: 'Compliance Check',
+                                    icon: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(DocumentIcon, {})
+                                }
+                            ]
+                        ]
+                    },
+                    execution: {
+                        stageStatus: {
+                            label: 'error message',
+                            status: 'Failed'
+                        },
+                        taskStatus: {
+                            2: {
+                                status: 'Failed',
+                                message: 'Compliance requirements not met'
+                            }
+                        }
+                    }
+                }
             }
         ]
     },

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

	@@ -1 +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;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;AAkVF,eAAO,MAAM,kBAAkB,EAAE,KAOhC,CAAC;AAiJF,eAAO,MAAM,cAAc,EAAE,KAO5B,CAAC"}
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;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,KAwFrB,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;AAkVF,eAAO,MAAM,kBAAkB,EAAE,KAOhC,CAAC;AAiJF,eAAO,MAAM,cAAc,EAAE,KAO5B,CAAC"}

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

@@ -273,6 +273,50 @@ const Default = {
                             }
                         }))
                 }
+            },
+            {
+                id: '2',
+                type: 'stage',
+                position: {
+                    x: 752,
+                    y: 96
+                },
+                width: 304,
+                data: {
+                    onReplaceTaskFromToolbox: ()=>{},
+                    stageDetails: {
+                        label: 'Validation - Failed',
+                        isReadOnly: true,
+                        tasks: [
+                            [
+                                {
+                                    id: '1',
+                                    label: 'Data Validation',
+                                    icon: /*#__PURE__*/ jsx(VerificationIcon, {})
+                                }
+                            ],
+                            [
+                                {
+                                    id: '2',
+                                    label: 'Compliance Check',
+                                    icon: /*#__PURE__*/ jsx(DocumentIcon, {})
+                                }
+                            ]
+                        ]
+                    },
+                    execution: {
+                        stageStatus: {
+                            label: 'error message',
+                            status: 'Failed'
+                        },
+                        taskStatus: {
+                            2: {
+                                status: 'Failed',
+                                message: 'Compliance requirements not met'
+                            }
+                        }
+                    }
+                }
             }
         ]
     },

package/dist/canvas/components/StageNode/StageNode.styles.cjs CHANGED Viewed

@@ -203,10 +203,6 @@ const StageTask = styled_default().div`
   height: ${({ isDragEnabled })=>isDragEnabled ? '100%' : 'auto'};
   .task-menu-icon-button {
-    display: ${({ isMenuOpen })=>isMenuOpen ? 'flex' : 'none'};
-  }
-  &:hover .task-menu-icon-button {
     display: flex;
   }

package/dist/canvas/components/StageNode/StageNode.styles.d.ts CHANGED Viewed

@@ -67,7 +67,6 @@ export declare const StageTask: import("@emotion/styled").StyledComponent<{
     selected?: boolean;
     isParallel?: boolean;
     isDragEnabled?: boolean;
-    isMenuOpen?: boolean;
 }, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export declare const StageTaskIcon: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;

package/dist/canvas/components/StageNode/StageNode.styles.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StageNode.styles.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageNode.styles.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAErD,eAAO,MAAM,iBAAiB,KAAK,CAAC;AACpC,eAAO,MAAM,uBAAuB,KAAK,CAAC;AAC1C,eAAO,MAAM,kBAAkB,IAAI,CAAC;AACpC,eAAO,MAAM,mBAAmB,QAAuD,CAAC;AAExF,eAAO,MAAM,cAAc;;;;eACd,OAAO;aACT,WAAW;YACZ,MAAM;yGAqDf,CAAC;AAEF,eAAO,MAAM,WAAW;;;;kBAA8B,OAAO;yGAS5D,CAAC;AAEF,eAAO,MAAM,mBAAmB;;;;gBAA4B,OAAO;yGAKlE,CAAC;AAEF,eAAO,MAAM,eAAe;;;;gBACd,OAAO;2BACI,OAAO;YACtB,MAAM;kHAsBf,CAAC;AAEF,eAAO,MAAM,YAAY;;;yGAQxB,CAAC;AAEF,eAAO,MAAM,aAAa;;;yGAKzB,CAAC;AAEF,eAAO,MAAM,cAAc;;;;iBAA6B,OAAO;yGAM9D,CAAC;AAEF,eAAO,MAAM,kBAAkB;;;yGAa9B,CAAC;AAEF,eAAO,MAAM,oBAAoB;;;yGAMhC,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;;iBAA6B,OAAO;yGAKhE,CAAC;AAEF,eAAO,MAAM,SAAS;;;;aACX,WAAW;eACT,OAAO;iBACL,OAAO;oBACJ,OAAO;~~iBACV~~,~~OAAO;yGAiErB,~~CAAC;AAEF,eAAO,MAAM,aAAa;;;yGAYzB,CAAC;AAEF,eAAO,MAAM,sBAAsB;;;;aAAyB,SAAS,GAAG,MAAM,GAAG,OAAO;yGAoBvF,CAAC;AAEF,eAAO,MAAM,+BAA+B;;;yGAG3C,CAAC;AAEF,eAAO,MAAM,wBAAwB;;;;uBAAmC,OAAO;yGAW9E,CAAC"}
1	+ {"version":3,"file":"StageNode.styles.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageNode.styles.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAErD,eAAO,MAAM,iBAAiB,KAAK,CAAC;AACpC,eAAO,MAAM,uBAAuB,KAAK,CAAC;AAC1C,eAAO,MAAM,kBAAkB,IAAI,CAAC;AACpC,eAAO,MAAM,mBAAmB,QAAuD,CAAC;AAExF,eAAO,MAAM,cAAc;;;;eACd,OAAO;aACT,WAAW;YACZ,MAAM;yGAqDf,CAAC;AAEF,eAAO,MAAM,WAAW;;;;kBAA8B,OAAO;yGAS5D,CAAC;AAEF,eAAO,MAAM,mBAAmB;;;;gBAA4B,OAAO;yGAKlE,CAAC;AAEF,eAAO,MAAM,eAAe;;;;gBACd,OAAO;2BACI,OAAO;YACtB,MAAM;kHAsBf,CAAC;AAEF,eAAO,MAAM,YAAY;;;yGAQxB,CAAC;AAEF,eAAO,MAAM,aAAa;;;yGAKzB,CAAC;AAEF,eAAO,MAAM,cAAc;;;;iBAA6B,OAAO;yGAM9D,CAAC;AAEF,eAAO,MAAM,kBAAkB;;;yGAa9B,CAAC;AAEF,eAAO,MAAM,oBAAoB;;;yGAMhC,CAAC;AAEF,eAAO,MAAM,gBAAgB;;;;iBAA6B,OAAO;yGAKhE,CAAC;AAEF,eAAO,MAAM,SAAS;;;;aACX,WAAW;eACT,OAAO;iBACL,OAAO;oBACJ,OAAO;yGA6DxB,CAAC;AAEF,eAAO,MAAM,aAAa;;;yGAYzB,CAAC;AAEF,eAAO,MAAM,sBAAsB;;;;aAAyB,SAAS,GAAG,MAAM,GAAG,OAAO;yGAoBvF,CAAC;AAEF,eAAO,MAAM,+BAA+B;;;yGAG3C,CAAC;AAEF,eAAO,MAAM,wBAAwB;;;;uBAAmC,OAAO;yGAW9E,CAAC"}

package/dist/canvas/components/StageNode/StageNode.styles.js CHANGED Viewed

@@ -147,10 +147,6 @@ const StageTask = styled.div`
   height: ${({ isDragEnabled })=>isDragEnabled ? '100%' : 'auto'};
   .task-menu-icon-button {
-    display: ${({ isMenuOpen })=>isMenuOpen ? 'flex' : 'none'};
-  }
-  &:hover .task-menu-icon-button {
     display: flex;
   }

package/dist/canvas/utils/adornment-resolver.cjs CHANGED Viewed

@@ -70,7 +70,7 @@ function ExecutionStatusIndicatorInternal({ status, count }) {
         ]
     });
 }
-function PinnedOutputIndicator() {
+function SquareDashedIndicator() {
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_cjs_namespaceObject.ApTooltip, {
         content: "Node output is mocked",
         placement: "bottom",
@@ -79,7 +79,7 @@ function PinnedOutputIndicator() {
                 display: 'inline-flex'
             },
             children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_index_cjs_namespaceObject.NodeIcon, {
-                icon: "pinned-output",
+                icon: "square-dashed",
                 size: 16,
                 color: "var(--color-foreground-emp)"
             })
@@ -148,7 +148,7 @@ const getDefaultAdornments = (context)=>{
         topLeft: hasBreakpoint ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(BreakpointIndicator, {}) : void 0,
         topRight: getTopRight(),
         bottomLeft: isExecutionStartPoint ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ExecutionStartPointIndicator, {}) : void 0,
-        bottomRight: isOutputPinned ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(PinnedOutputIndicator, {}) : void 0
+        bottomRight: isOutputPinned ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(SquareDashedIndicator, {}) : void 0
     };
 };
 function resolveAdornments(context) {

package/dist/canvas/utils/adornment-resolver.js CHANGED Viewed

@@ -37,7 +37,7 @@ function ExecutionStatusIndicatorInternal({ status, count }) {
         ]
     });
 }
-function PinnedOutputIndicator() {
+function SquareDashedIndicator() {
     return /*#__PURE__*/ jsx(ApTooltip, {
         content: "Node output is mocked",
         placement: "bottom",
@@ -46,7 +46,7 @@ function PinnedOutputIndicator() {
                 display: 'inline-flex'
             },
             children: /*#__PURE__*/ jsx(NodeIcon, {
-                icon: "pinned-output",
+                icon: "square-dashed",
                 size: 16,
                 color: "var(--color-foreground-emp)"
             })
@@ -115,7 +115,7 @@ const getDefaultAdornments = (context)=>{
         topLeft: hasBreakpoint ? /*#__PURE__*/ jsx(BreakpointIndicator, {}) : void 0,
         topRight: getTopRight(),
         bottomLeft: isExecutionStartPoint ? /*#__PURE__*/ jsx(ExecutionStartPointIndicator, {}) : void 0,
-        bottomRight: isOutputPinned ? /*#__PURE__*/ jsx(PinnedOutputIndicator, {}) : void 0
+        bottomRight: isOutputPinned ? /*#__PURE__*/ jsx(SquareDashedIndicator, {}) : void 0
     };
 };
 function resolveAdornments(context) {

package/dist/canvas/utils/icon-registry.cjs CHANGED Viewed

@@ -80,11 +80,6 @@ const iconRegistry = {
             w: w ?? 24,
             h: h ?? 24
         }),
-    'pinned-output': ({ w, h, color })=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_cjs_namespaceObject.FlaskRunIcon, {
-            w: w ?? 24,
-            h: h ?? 24,
-            color: color
-        }),
     uipath: ({ w, h })=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_cjs_namespaceObject.UiPathIcon, {
             w: w ?? 24,
             h: h ?? 24

package/dist/canvas/utils/icon-registry.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"icon-registry.d.ts","sourceRoot":"","sources":["../../../src/canvas/utils/icon-registry.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,KAAK,GAAG,EAAiB,MAAM,OAAO,CAAC;AAGhD,MAAM,MAAM,aAAa,GAAG,CAAC,KAAK,EAAE;IAAE,CAAC,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,KAAK,GAAG,CAAC,OAAO,CAAC;~~AAwD~~/F,wBAAgB,OAAO,CAAC,MAAM,EAAE,MAAM,GAAG,aAAa,CAkCrD;AAED,MAAM,WAAW,aAAa;IAC5B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAMD,eAAO,MAAM,QAAQ,qDAInB,CAAC"}
1	+ {"version":3,"file":"icon-registry.d.ts","sourceRoot":"","sources":["../../../src/canvas/utils/icon-registry.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,KAAK,GAAG,EAAiB,MAAM,OAAO,CAAC;AAGhD,MAAM,MAAM,aAAa,GAAG,CAAC,KAAK,EAAE;IAAE,CAAC,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,CAAC,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,KAAK,GAAG,CAAC,OAAO,CAAC;AAqD/F,wBAAgB,OAAO,CAAC,MAAM,EAAE,MAAM,GAAG,aAAa,CAkCrD;AAED,MAAM,WAAW,aAAa;IAC5B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAMD,eAAO,MAAM,QAAQ,qDAInB,CAAC"}

package/dist/canvas/utils/icon-registry.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { jsx } from "react/jsx-runtime";
 import { icons } from "lucide-react";
 import { memo, useMemo } from "react";
-import { AgentDiagramIcon, AgentProject, ApiProject, AutonomousAgentIcon, CodedAgentIcon, ConnectorBuilderProject, ControlFlowIcon, ConversationalAgentIcon, DataAndTools, DecisionIcon, FlaskRunIcon, RpaProject, SwitchIcon, UiPathIcon, WebAppProject } from "../icons/index.js";
+import { AgentDiagramIcon, AgentProject, ApiProject, AutonomousAgentIcon, CodedAgentIcon, ConnectorBuilderProject, ControlFlowIcon, ConversationalAgentIcon, DataAndTools, DecisionIcon, RpaProject, SwitchIcon, UiPathIcon, WebAppProject } from "../icons/index.js";
 const iconRegistry = {
     agent: ({ w, h })=>/*#__PURE__*/ jsx(AgentProject, {
             w: w ?? 29,
@@ -51,11 +51,6 @@ const iconRegistry = {
             w: w ?? 24,
             h: h ?? 24
         }),
-    'pinned-output': ({ w, h, color })=>/*#__PURE__*/ jsx(FlaskRunIcon, {
-            w: w ?? 24,
-            h: h ?? 24,
-            color: color
-        }),
     uipath: ({ w, h })=>/*#__PURE__*/ jsx(UiPathIcon, {
             w: w ?? 24,
             h: h ?? 24

package/package.json CHANGED Viewed

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