Merge branch 'main' into creilly11235/vertex-sidebar-registry

Author: creilly11235

packages/apollo-react/CHANGELOG.md

@@ -1,3 +1,9 @@
+## [@uipath/apollo-react-v3.70.3](https://github.com/UiPath/apollo-ui/compare/@uipath/apollo-react@3.70.2...@uipath/apollo-react@3.70.3) (2026-04-09)
+
+### Bug Fixes
+
+* **apollo-react:** clamp node header and subheader text to prevent overflow ([374b758](https://github.com/UiPath/apollo-ui/commit/374b75872a7a514674ea81a5d2e1b73ad39b5b03))
+
 ## [@uipath/apollo-react-v3.70.1](https://github.com/UiPath/apollo-ui/compare/@uipath/apollo-react@3.70.0...@uipath/apollo-react@3.70.1) (2026-04-08)
 
 ### Bug Fixes

packages/apollo-react/package.json

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

packages/apollo-react/src/canvas/components/BaseNode/BaseNode.styles.ts

@@ -292,16 +292,19 @@ export const BaseHeader = styled.div<{ shape?: NodeShape; backgroundColor?: stri
     `}
   line-height: 1.4;
   margin-bottom: 2px;
+  overflow: hidden;
   ${({ shape }) =>
     shape === 'rectangle'
       ? css`
           width: 100%;
           white-space: nowrap;
-          overflow: hidden;
           text-overflow: ellipsis;
         `
       : css`
           word-break: break-word;
+          display: -webkit-box;
+          -webkit-box-orient: vertical;
+          -webkit-line-clamp: 3;
         `}
 `;
 
@@ -310,16 +313,18 @@ export const BaseSubHeader = styled.div<{ shape?: NodeShape }>`
   color: var(--uix-canvas-foreground-de-emp);
   line-height: 1.3;
   word-break: break-word;
+  overflow: hidden;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
   ${({ shape }) =>
     shape === 'rectangle'
       ? css`
           width: 100%;
-          display: -webkit-box;
-          -webkit-box-orient: vertical;
           -webkit-line-clamp: 2;
-          overflow: hidden;
         `
-      : ''}
+      : css`
+          -webkit-line-clamp: 5;
+`}
 `;
 
 export const EditableLabel = styled.textarea<{

packages/apollo-react/src/canvas/components/StageNode/StageNode.stories.tsx

@@ -1061,6 +1061,20 @@ const AddAndReplaceTasksStory = () => {
       data: {
         stageDetails: {
           label: 'Add, Replace, and Group Tasks',
+          isReadOnly: false,
+          tasks: initialTasksForAddReplace,
+        },
+        taskOptions: availableTaskOptions,
+      },
+    },
+    {
+      id: 'readonly-stage',
+      type: 'stage',
+      position: { x: 720, y: 96 },
+      data: {
+        stageDetails: {
+          label: 'ReadOnly Stage',
+          isReadOnly: true,
           tasks: initialTasksForAddReplace,
         },
         taskOptions: availableTaskOptions,

packages/apollo-react/src/canvas/components/StageNode/StageNode.test.tsx

@@ -847,6 +847,42 @@ describe('StageNode - hideParallelOptions', () => {
   });
 });
 
+describe('StageNode - ReadOnly Mode', () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+
+  it('should not render task kebab menu when isReadOnly is true', () => {
+    const onTaskGroupModification = vi.fn();
+    const tasks: StageTaskItem[][] = [
+      [createTask('task-1', 'Task 1')],
+      [createTask('task-2', 'Task 2')],
+    ];
+
+    renderStageNode({
+      onTaskGroupModification,
+      stageDetails: { ...defaultProps.stageDetails, tasks, isReadOnly: true },
+    });
+
+    expect(screen.queryByTestId('task-menu-button-task-1')).not.toBeInTheDocument();
+    expect(screen.queryByTestId('task-menu-button-task-2')).not.toBeInTheDocument();
+  });
+
+  it('should not render adhoc task kebab menu when isReadOnly is true', () => {
+    const onTaskGroupModification = vi.fn();
+    const adhocTask = createTask('adhoc-1', 'Adhoc Task 1');
+    adhocTask.isAdhoc = true;
+    const tasks: StageTaskItem[][] = [[adhocTask]];
+
+    renderStageNode({
+      onTaskGroupModification,
+      stageDetails: { ...defaultProps.stageDetails, tasks, isReadOnly: true },
+    });
+
+    expect(screen.queryByTestId('task-menu-button-adhoc-1')).not.toBeInTheDocument();
+  });
+});
+
 describe('StageNode - Header Chips', () => {
   beforeEach(() => {
     vi.clearAllMocks();

packages/apollo-react/src/canvas/components/StageNode/StageNode.tsx

@@ -758,9 +758,10 @@ const StageNodeInner = (props: StageNodeProps) => {
                                         : undefined
                                     }
                                     isDragDisabled={!onTaskReorder}
-                                    {...(hasContextMenu && {
-                                      getContextMenuItems: buildContextMenuItems,
-                                    })}
+                                    {...(hasContextMenu &&
+                                      !isReadOnly && {
+                                        getContextMenuItems: buildContextMenuItems,
+                                      })}
                                   />
                                 );
                               })}
@@ -800,10 +801,11 @@ const StageNodeInner = (props: StageNodeProps) => {
                           isSelected={selectedTaskId === task.id}
                           onTaskClick={handleTaskClick}
                           onTaskPlay={onTaskPlay}
-                          {...((onTaskGroupModification || onReplaceTaskFromToolbox) && {
-                            getContextMenuItems: () =>
-                              getAdhocContextMenuItems(groupIndex, taskIndex, task.id),
-                          })}
+                          {...((onTaskGroupModification || onReplaceTaskFromToolbox) &&
+                            !isReadOnly && {
+                              getContextMenuItems: () =>
+                                getAdhocContextMenuItems(groupIndex, taskIndex, task.id),
+                            })}
                         />
                       );
                     })}