@uipath/apollo-react 4.24.4 → 4.25.1

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

@@ -48,43 +48,13 @@ const StageContainer = styled.div`
 const StageHeader = styled.div`
   position: relative;
   display: flex;
-  justify-content: space-between;
+  flex-direction: column;
   padding: ${Spacing.SpacingS} ${Spacing.SpacingBase};
   border-bottom: solid 1px var(--canvas-border-de-emp);
   background: ${(props)=>props.isException ? 'var(--color-background-secondary)' : 'var(--canvas-background)'};
   border-radius: ${Spacing.SpacingBase} ${Spacing.SpacingBase} 0 0;
   overflow: hidden;
 `;
-const StageTitleContainer = styled.div`
-  display: block;
-  border-radius: 4px;
-  height: 100%;
-  width: 100%;
-  box-sizing: border-box;
-  border: ${(props)=>props.isEditing ? '1px solid var(--canvas-border-de-emp)' : 'none'};
-`;
-const StageTitleInput = styled.input`
-  font-family: inherit;
-  font-size: inherit;
-  font-weight: inherit;
-  cursor: text;
-  border: none;
-  background: transparent;
-  text-overflow: ellipsis;
-  border-radius: 2px;
-  width: 100%;
-  min-width: 100px;
-  padding: ${Padding.PadS} 0px;
-
-  &:focus {
-    outline: none;
-  }
-
-  &:hover {
-    cursor: ${(props)=>props.isStageTitleEditable ? 'text' : 'pointer'};
-    background: ${(props)=>props.isEditing || props.isStageTitleEditable ? 'var(--canvas-background-secondary)' : 'transparent'};
-  }
-`;
 const StageContent = styled.div`
   padding: 15px ${STAGE_CONTENT_PADDING_X}px ${Spacing.SpacingBase} ${STAGE_CONTENT_PADDING_X}px;
   border-radius: 0 0 ${Spacing.SpacingBase} ${Spacing.SpacingBase};
@@ -140,7 +110,8 @@ const StageTask = styled.div`
   gap: ${Spacing.SpacingXs};
   padding: ${Padding.PadS} ${Padding.PadM};
   background: var(--canvas-background);
-  border: 1px solid var(--canvas-border-de-emp);
+  border: 1px ${({ isPlaceholder })=>isPlaceholder ? 'dashed' : 'solid'}
+    var(--canvas-border-de-emp);
   border-radius: ${Spacing.SpacingXs};
   color: var(--canvas-foreground);
   transition: all 0.2s ease;
@@ -259,4 +230,4 @@ const StageTaskDragPlaceholder = styled.div`
   height: 100%;
   width: ${({ isTargetParallel })=>isTargetParallel ? 'var(--stage-task-width-parallel, 216px)' : 'var(--stage-task-width, 246px)'};
 `;
-export { INDENTATION_WIDTH, STAGE_BORDER_WIDTH, STAGE_CONTENT_INSET, STAGE_CONTENT_PADDING_X, StageAdditionalTasksHeaderSection, StageAdditionalTasksSection, StageChip, StageContainer, StageContent, StageHeader, StageHeaderChipsRow, StageParallelBracket, StageParallelLabel, StageTask, StageTaskDragPlaceholder, StageTaskDragPlaceholderWrapper, StageTaskGroupContainer, StageTaskIcon, StageTaskList, StageTaskRetryDuration, StageTaskWrapper, StageTitleContainer, StageTitleInput };
+export { INDENTATION_WIDTH, STAGE_BORDER_WIDTH, STAGE_CONTENT_INSET, STAGE_CONTENT_PADDING_X, StageAdditionalTasksHeaderSection, StageAdditionalTasksSection, StageChip, StageContainer, StageContent, StageHeader, StageHeaderChipsRow, StageParallelBracket, StageParallelLabel, StageTask, StageTaskDragPlaceholder, StageTaskDragPlaceholderWrapper, StageTaskGroupContainer, StageTaskIcon, StageTaskList, StageTaskRetryDuration, StageTaskWrapper };

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

@@ -15,11 +15,13 @@ declare enum ElementStatusValues {
 }
 export type StageStatus = `${ElementStatusValues}`;
 export type StageTaskStatus = `${ElementStatusValues}`;
+export type StageSlaIcon = 'warning' | 'error';
 export interface StageTaskItem {
     id: string;
     label: string;
     icon?: React.ReactElement;
     isAdhoc?: boolean;
+    isPlaceholder?: boolean;
     taskGroupType?: 'sequential' | 'event-driven' | 'adhoc';
     hasEntryCondition?: boolean;
 }
@@ -52,14 +54,14 @@ export interface StageNodeBaseProps {
         selectedTaskId?: string;
         headerChips?: StageHeaderChip[];
     };
-    addTaskLabel?: string;
-    replaceTaskLabel?: string;
     taskOptions?: ListItem[];
     execution?: {
         stageStatus: {
             status?: StageStatus;
             label?: string;
             duration?: string;
+            slaText?: string;
+            slaIcon?: StageSlaIcon;
         };
         taskStatus: Record<string, StageTaskExecution>;
     };

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/StageNodeAdhocTaskGroups.cjs

@@ -30,8 +30,10 @@ const jsx_runtime_namespaceObject = require("react/jsx-runtime");
 const external_react_namespaceObject = require("react");
 const external_AdhocTask_cjs_namespaceObject = require("./AdhocTask.cjs");
 const external_StageNode_styles_cjs_namespaceObject = require("./StageNode.styles.cjs");
+const external_useStageNodeLabels_cjs_namespaceObject = require("./useStageNodeLabels.cjs");
 const StageNodeAdhocTaskGroupsInner = ({ props, adhocTasks, isReadOnly, selectedTaskId, marginTop, handleTaskClick, generateReplaceTaskMenuItemForTask, generateDeleteTaskMenuItemForTask })=>{
     const { execution, onTaskGroupModification, onReplaceTaskFromToolbox, onTaskPlay, loadingTaskIds } = props;
+    const labels = (0, external_useStageNodeLabels_cjs_namespaceObject.useStageNodeLabels)();
     const getAdhocContextMenuItems = (0, external_react_namespaceObject.useCallback)((taskId)=>{
         const items = [];
         const replaceTaskMenuItem = generateReplaceTaskMenuItemForTask(taskId, false);
@@ -52,7 +54,7 @@ const StageNodeAdhocTaskGroupsInner = ({ props, adhocTasks, isReadOnly, selected
             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StageNode_styles_cjs_namespaceObject.StageAdditionalTasksHeaderSection, {
                 children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
                     className: "text-xs font-bold text-foreground-muted",
-                    children: "Ad hoc tasks"
+                    children: labels.adhocTasks
                 })
             }),
             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StageNode_styles_cjs_namespaceObject.StageTaskList, {

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

@@ -1 +1 @@
-{"version":3,"file":"StageNodeAdhocTaskGroups.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageNodeAdhocTaskGroups.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAOvD,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAqFxE,eAAO,MAAM,wBAAwB,8LA1ElC;IACD,KAAK,EAAE,cAAc,CAAC;IACtB,UAAU,EAAE,cAAc,EAAE,CAAC;IAC7B,UAAU,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,SAAS,EAAE,MAAM,CAAC;IAClB,eAAe,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,EAAE,aAAa,EAAE,MAAM,KAAK,IAAI,CAAC;IACtE,kCAAkC,EAAE,CAClC,MAAM,EAAE,MAAM,EACd,UAAU,EAAE,OAAO,KAChB,YAAY,GAAG,SAAS,CAAC;IAC9B,iCAAiC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,YAAY,GAAG,SAAS,CAAC;CACjF,oDA8D0E,CAAC"}
+{"version":3,"file":"StageNodeAdhocTaskGroups.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageNodeAdhocTaskGroups.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAOvD,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAuFxE,eAAO,MAAM,wBAAwB,8LA3ElC;IACD,KAAK,EAAE,cAAc,CAAC;IACtB,UAAU,EAAE,cAAc,EAAE,CAAC;IAC7B,UAAU,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,SAAS,EAAE,MAAM,CAAC;IAClB,eAAe,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,EAAE,aAAa,EAAE,MAAM,KAAK,IAAI,CAAC;IACtE,kCAAkC,EAAE,CAClC,MAAM,EAAE,MAAM,EACd,UAAU,EAAE,OAAO,KAChB,YAAY,GAAG,SAAS,CAAC;IAC9B,iCAAiC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,YAAY,GAAG,SAAS,CAAC;CACjF,oDA+D0E,CAAC"}

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

@@ -2,8 +2,10 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { memo, useCallback } from "react";
 import { AdhocTaskItem } from "./AdhocTask.js";
 import { StageAdditionalTasksHeaderSection, StageAdditionalTasksSection, StageTaskList } from "./StageNode.styles.js";
+import { useStageNodeLabels } from "./useStageNodeLabels.js";
 const StageNodeAdhocTaskGroupsInner = ({ props, adhocTasks, isReadOnly, selectedTaskId, marginTop, handleTaskClick, generateReplaceTaskMenuItemForTask, generateDeleteTaskMenuItemForTask })=>{
     const { execution, onTaskGroupModification, onReplaceTaskFromToolbox, onTaskPlay, loadingTaskIds } = props;
+    const labels = useStageNodeLabels();
     const getAdhocContextMenuItems = useCallback((taskId)=>{
         const items = [];
         const replaceTaskMenuItem = generateReplaceTaskMenuItemForTask(taskId, false);
@@ -24,7 +26,7 @@ const StageNodeAdhocTaskGroupsInner = ({ props, adhocTasks, isReadOnly, selected
             /*#__PURE__*/ jsx(StageAdditionalTasksHeaderSection, {
                 children: /*#__PURE__*/ jsx("span", {
                     className: "text-xs font-bold text-foreground-muted",
-                    children: "Ad hoc tasks"
+                    children: labels.adhocTasks
                 })
             }),
             /*#__PURE__*/ jsx(StageTaskList, {

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

@@ -38,14 +38,16 @@ const external_StageNodeAdhocTaskGroups_cjs_namespaceObject = require("./StageNo
 const external_StageNodeEventDrivenTaskGroups_cjs_namespaceObject = require("./StageNodeEventDrivenTaskGroups.cjs");
 const external_StageNodeSequentialTaskGroups_cjs_namespaceObject = require("./StageNodeSequentialTaskGroups.cjs");
 const external_StageNodeTaskUtilities_cjs_namespaceObject = require("./StageNodeTaskUtilities.cjs");
+const external_useStageNodeLabels_cjs_namespaceObject = require("./useStageNodeLabels.cjs");
 const StageNodeAllTaskGroupsInner = ({ props, isReadOnly, taskWidthStyle, taskStateReference, setSelectedNodeId, handleTaskAddClick, setIsReplacingTask })=>{
     const { id, stageDetails, onTaskAdd, onAddTaskFromToolbox, onTaskClick, onTaskGroupModification, onTaskReorder, onReplaceTaskFromToolbox } = props;
+    const labels = (0, external_useStageNodeLabels_cjs_namespaceObject.useStageNodeLabels)();
     const allTasks = (0, external_react_namespaceObject.useMemo)(()=>stageDetails?.tasks || [], [
         stageDetails?.tasks
     ]);
     const { sequentialTaskGroups, sequentialTasks, adhocTaskGroups, adhocTasks, eventDrivenTaskGroups, eventDrivenTasks } = (0, useStageTasksByGroups_cjs_namespaceObject.useStageTasksByGroups)(allTasks);
     const selectedTaskId = stageDetails?.selectedTaskId;
-    const defaultContent = stageDetails?.defaultContent || (isReadOnly ? 'No tasks' : 'Add first task');
+    const defaultContent = stageDetails?.defaultContent || (isReadOnly ? labels.noTasks : labels.addFirstTask);
     const handleReorderSequentialTasks = (0, external_react_namespaceObject.useCallback)((newTasks)=>{
         if (!onTaskReorder) return;
         onTaskReorder([
@@ -78,7 +80,7 @@ const StageNodeAllTaskGroupsInner = ({ props, isReadOnly, taskWidthStyle, taskSt
             break;
         }
         if (void 0 === groupIndex || void 0 === taskIndex) return;
-        return (0, external_StageNodeTaskUtilities_cjs_namespaceObject.getMenuItem)('replace-task', 'Replace task', ()=>{
+        return (0, external_StageNodeTaskUtilities_cjs_namespaceObject.getMenuItem)('replace-task', labels.replaceTask, ()=>{
             taskStateReference.current = {
                 isParallel,
                 groupIndex,
@@ -92,7 +94,8 @@ const StageNodeAllTaskGroupsInner = ({ props, isReadOnly, taskWidthStyle, taskSt
         allTasks,
         onTaskClick,
         setIsReplacingTask,
-        taskStateReference
+        taskStateReference,
+        labels.replaceTask
     ]);
     const generateDeleteTaskMenuItemForTask = (0, external_react_namespaceObject.useCallback)((taskId)=>{
         if (!onTaskGroupModification) return;
@@ -104,10 +107,11 @@ const StageNodeAllTaskGroupsInner = ({ props, isReadOnly, taskWidthStyle, taskSt
             break;
         }
         if (void 0 === groupIndex || void 0 === taskIndex) return;
-        return (0, external_StageNodeTaskUtilities_cjs_namespaceObject.getMenuItem)('remove-task', 'Delete task', ()=>onTaskGroupModification(external_utils_index_cjs_namespaceObject.GroupModificationType.REMOVE_TASK, groupIndex, taskIndex));
+        return (0, external_StageNodeTaskUtilities_cjs_namespaceObject.getMenuItem)('remove-task', labels.deleteTask, ()=>onTaskGroupModification(external_utils_index_cjs_namespaceObject.GroupModificationType.REMOVE_TASK, groupIndex, taskIndex));
     }, [
         allTasks,
-        onTaskGroupModification
+        onTaskGroupModification,
+        labels.deleteTask
     ]);
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StageNode_styles_cjs_namespaceObject.StageContent, {
         children: 0 === sequentialTaskGroups.length && 0 === adhocTaskGroups.length && 0 === eventDrivenTaskGroups.length ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_cjs_namespaceObject.Column, {

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

@@ -1 +1 @@
-{"version":3,"file":"StageNodeAllTaskGroups.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageNodeAllTaskGroups.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,aAAa,EAAQ,KAAK,SAAS,EAAwB,MAAM,OAAO,CAAC;AAIvF,OAAO,KAAK,EAAE,cAAc,EAAiB,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAqM3F,eAAO,MAAM,sBAAsB,8JAvLhC;IACD,KAAK,EAAE,cAAc,CAAC;IACtB,UAAU,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,aAAa,CAAC;IAC/B,kBAAkB,EAAE,SAAS,CAAC,kBAAkB,CAAC,CAAC;IAClD,iBAAiB,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,kBAAkB,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACtD,kBAAkB,EAAE,CAAC,eAAe,EAAE,OAAO,KAAK,IAAI,CAAC;CACxD,6CA+KsE,CAAC"}
+{"version":3,"file":"StageNodeAllTaskGroups.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageNodeAllTaskGroups.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,aAAa,EAAQ,KAAK,SAAS,EAAwB,MAAM,OAAO,CAAC;AAIvF,OAAO,KAAK,EAAE,cAAc,EAAiB,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AA8M3F,eAAO,MAAM,sBAAsB,8JA/LhC;IACD,KAAK,EAAE,cAAc,CAAC;IACtB,UAAU,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,aAAa,CAAC;IAC/B,kBAAkB,EAAE,SAAS,CAAC,kBAAkB,CAAC,CAAC;IAClD,iBAAiB,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,kBAAkB,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IACtD,kBAAkB,EAAE,CAAC,eAAe,EAAE,OAAO,KAAK,IAAI,CAAC;CACxD,6CAuLsE,CAAC"}

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

@@ -10,14 +10,16 @@ import { StageNodeAdhocTaskGroups } from "./StageNodeAdhocTaskGroups.js";
 import { StageNodeEventDrivenTaskGroups } from "./StageNodeEventDrivenTaskGroups.js";
 import { StageNodeSequentialTaskGroups } from "./StageNodeSequentialTaskGroups.js";
 import { getMenuItem } from "./StageNodeTaskUtilities.js";
+import { useStageNodeLabels } from "./useStageNodeLabels.js";
 const StageNodeAllTaskGroupsInner = ({ props, isReadOnly, taskWidthStyle, taskStateReference, setSelectedNodeId, handleTaskAddClick, setIsReplacingTask })=>{
     const { id, stageDetails, onTaskAdd, onAddTaskFromToolbox, onTaskClick, onTaskGroupModification, onTaskReorder, onReplaceTaskFromToolbox } = props;
+    const labels = useStageNodeLabels();
     const allTasks = useMemo(()=>stageDetails?.tasks || [], [
         stageDetails?.tasks
     ]);
     const { sequentialTaskGroups, sequentialTasks, adhocTaskGroups, adhocTasks, eventDrivenTaskGroups, eventDrivenTasks } = useStageTasksByGroups(allTasks);
     const selectedTaskId = stageDetails?.selectedTaskId;
-    const defaultContent = stageDetails?.defaultContent || (isReadOnly ? 'No tasks' : 'Add first task');
+    const defaultContent = stageDetails?.defaultContent || (isReadOnly ? labels.noTasks : labels.addFirstTask);
     const handleReorderSequentialTasks = useCallback((newTasks)=>{
         if (!onTaskReorder) return;
         onTaskReorder([
@@ -50,7 +52,7 @@ const StageNodeAllTaskGroupsInner = ({ props, isReadOnly, taskWidthStyle, taskSt
             break;
         }
         if (void 0 === groupIndex || void 0 === taskIndex) return;
-        return getMenuItem('replace-task', 'Replace task', ()=>{
+        return getMenuItem('replace-task', labels.replaceTask, ()=>{
             taskStateReference.current = {
                 isParallel,
                 groupIndex,
@@ -64,7 +66,8 @@ const StageNodeAllTaskGroupsInner = ({ props, isReadOnly, taskWidthStyle, taskSt
         allTasks,
         onTaskClick,
         setIsReplacingTask,
-        taskStateReference
+        taskStateReference,
+        labels.replaceTask
     ]);
     const generateDeleteTaskMenuItemForTask = useCallback((taskId)=>{
         if (!onTaskGroupModification) return;
@@ -76,10 +79,11 @@ const StageNodeAllTaskGroupsInner = ({ props, isReadOnly, taskWidthStyle, taskSt
             break;
         }
         if (void 0 === groupIndex || void 0 === taskIndex) return;
-        return getMenuItem('remove-task', 'Delete task', ()=>onTaskGroupModification(GroupModificationType.REMOVE_TASK, groupIndex, taskIndex));
+        return getMenuItem('remove-task', labels.deleteTask, ()=>onTaskGroupModification(GroupModificationType.REMOVE_TASK, groupIndex, taskIndex));
     }, [
         allTasks,
-        onTaskGroupModification
+        onTaskGroupModification,
+        labels.deleteTask
     ]);
     return /*#__PURE__*/ jsx(StageContent, {
         children: 0 === sequentialTaskGroups.length && 0 === adhocTaskGroups.length && 0 === eventDrivenTaskGroups.length ? /*#__PURE__*/ jsx(Column, {

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

@@ -30,8 +30,10 @@ const jsx_runtime_namespaceObject = require("react/jsx-runtime");
 const external_react_namespaceObject = require("react");
 const external_EventDrivenTask_cjs_namespaceObject = require("./EventDrivenTask.cjs");
 const external_StageNode_styles_cjs_namespaceObject = require("./StageNode.styles.cjs");
+const external_useStageNodeLabels_cjs_namespaceObject = require("./useStageNodeLabels.cjs");
 const StageNodeEventDrivenTaskGroupsInner = ({ props, eventDrivenTasks, isReadOnly, selectedTaskId, marginTop, handleTaskClick, generateReplaceTaskMenuItemForTask, generateDeleteTaskMenuItemForTask })=>{
     const { execution, onTaskGroupModification, onReplaceTaskFromToolbox, loadingTaskIds } = props;
+    const labels = (0, external_useStageNodeLabels_cjs_namespaceObject.useStageNodeLabels)();
     const getEventDrivenContextMenuItems = (0, external_react_namespaceObject.useCallback)((taskId)=>{
         const items = [];
         const replaceTaskMenuItem = generateReplaceTaskMenuItemForTask(taskId, false);
@@ -52,7 +54,7 @@ const StageNodeEventDrivenTaskGroupsInner = ({ props, eventDrivenTasks, isReadOn
             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StageNode_styles_cjs_namespaceObject.StageAdditionalTasksHeaderSection, {
                 children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
                     className: "text-xs font-bold text-foreground-muted",
-                    children: "Event-driven tasks"
+                    children: labels.eventDrivenTasks
                 })
             }),
             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StageNode_styles_cjs_namespaceObject.StageTaskList, {

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

@@ -1 +1 @@
-{"version":3,"file":"StageNodeEventDrivenTaskGroups.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageNodeEventDrivenTaskGroups.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAOvD,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AA8ExE,eAAO,MAAM,8BAA8B,oMAnExC;IACD,KAAK,EAAE,cAAc,CAAC;IACtB,gBAAgB,EAAE,cAAc,EAAE,CAAC;IACnC,UAAU,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,SAAS,EAAE,MAAM,CAAC;IAClB,eAAe,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,EAAE,aAAa,EAAE,MAAM,KAAK,IAAI,CAAC;IACtE,kCAAkC,EAAE,CAClC,MAAM,EAAE,MAAM,EACd,UAAU,EAAE,OAAO,KAChB,YAAY,GAAG,SAAS,CAAC;IAC9B,iCAAiC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,YAAY,GAAG,SAAS,CAAC;CACjF,oDAuDsF,CAAC"}
+{"version":3,"file":"StageNodeEventDrivenTaskGroups.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageNodeEventDrivenTaskGroups.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAOvD,OAAO,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAgFxE,eAAO,MAAM,8BAA8B,oMApExC;IACD,KAAK,EAAE,cAAc,CAAC;IACtB,gBAAgB,EAAE,cAAc,EAAE,CAAC;IACnC,UAAU,EAAE,OAAO,CAAC;IACpB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,SAAS,EAAE,MAAM,CAAC;IAClB,eAAe,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,EAAE,aAAa,EAAE,MAAM,KAAK,IAAI,CAAC;IACtE,kCAAkC,EAAE,CAClC,MAAM,EAAE,MAAM,EACd,UAAU,EAAE,OAAO,KAChB,YAAY,GAAG,SAAS,CAAC;IAC9B,iCAAiC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,YAAY,GAAG,SAAS,CAAC;CACjF,oDAwDsF,CAAC"}

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

@@ -2,8 +2,10 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { memo, useCallback } from "react";
 import { EventDrivenTaskItem } from "./EventDrivenTask.js";
 import { StageAdditionalTasksHeaderSection, StageAdditionalTasksSection, StageTaskList } from "./StageNode.styles.js";
+import { useStageNodeLabels } from "./useStageNodeLabels.js";
 const StageNodeEventDrivenTaskGroupsInner = ({ props, eventDrivenTasks, isReadOnly, selectedTaskId, marginTop, handleTaskClick, generateReplaceTaskMenuItemForTask, generateDeleteTaskMenuItemForTask })=>{
     const { execution, onTaskGroupModification, onReplaceTaskFromToolbox, loadingTaskIds } = props;
+    const labels = useStageNodeLabels();
     const getEventDrivenContextMenuItems = useCallback((taskId)=>{
         const items = [];
         const replaceTaskMenuItem = generateReplaceTaskMenuItemForTask(taskId, false);
@@ -24,7 +26,7 @@ const StageNodeEventDrivenTaskGroupsInner = ({ props, eventDrivenTasks, isReadOn
             /*#__PURE__*/ jsx(StageAdditionalTasksHeaderSection, {
                 children: /*#__PURE__*/ jsx("span", {
                     className: "text-xs font-bold text-foreground-muted",
-                    children: "Event-driven tasks"
+                    children: labels.eventDrivenTasks
                 })
             }),
             /*#__PURE__*/ jsx(StageTaskList, {

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

@@ -38,6 +38,18 @@ const external_ExecutionStatusIcon_index_cjs_namespaceObject = require("../Execu
 const ExecutionStatusIcon_cjs_namespaceObject = require("../ExecutionStatusIcon/ExecutionStatusIcon.cjs");
 const external_StageNode_styles_cjs_namespaceObject = require("./StageNode.styles.cjs");
 const external_StageNode_types_cjs_namespaceObject = require("./StageNode.types.cjs");
+const external_StageTitleInput_cjs_namespaceObject = require("./StageTitleInput.cjs");
+const external_useStageNodeLabels_cjs_namespaceObject = require("./useStageNodeLabels.cjs");
+const SLA_ICON_CONFIG = {
+    warning: {
+        icon: 'triangle-alert',
+        iconColor: 'var(--canvas-warning-icon)'
+    },
+    error: {
+        icon: 'circle-alert',
+        iconColor: 'var(--canvas-error-icon)'
+    }
+};
 const CHIP_ICONS = {
     [external_StageNode_types_cjs_namespaceObject.StageHeaderChipType.Entry]: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_icons_index_cjs_namespaceObject.EntryConditionIcon, {
         w: apollo_core_namespaceObject.Icon.IconXs,
@@ -61,183 +73,127 @@ const CHIP_ICONS = {
     })
 };
 const StageNodeHeaderInner = ({ props, isReadOnly, isException, status, handleTaskAddClick })=>{
-    const { id, stageDetails, execution, addTaskLabel = 'Add task', onTaskAdd, onAddTaskFromToolbox, onStageTitleChange, loadingTaskIds } = props;
+    const labels = (0, external_useStageNodeLabels_cjs_namespaceObject.useStageNodeLabels)();
+    const { id, stageDetails, execution, onTaskAdd, onAddTaskFromToolbox, onStageTitleChange, loadingTaskIds } = props;
     const isAddTaskDisabled = (loadingTaskIds?.size ?? 0) > 0;
     const icon = stageDetails?.icon;
     const statusLabel = execution?.stageStatus?.label;
     const stageDuration = execution?.stageStatus?.duration;
-    const isStageTitleEditable = !!onStageTitleChange && !isReadOnly;
-    const [isStageTitleEditing, setIsStageTitleEditing] = (0, external_react_namespaceObject.useState)(false);
-    const stageTitleRef = (0, external_react_namespaceObject.useRef)(null);
-    const [label, setLabel] = (0, external_react_namespaceObject.useState)(props.stageDetails.label);
-    (0, external_react_namespaceObject.useEffect)(()=>{
-        setLabel(props.stageDetails.label);
-    }, [
-        props.stageDetails.label
-    ]);
-    const handleStageTitleChange = (0, external_react_namespaceObject.useCallback)((e)=>{
-        setIsStageTitleEditing(true);
-        setLabel(e.target.value);
-    }, []);
-    const handleStageTitleClickToSave = (0, external_react_namespaceObject.useCallback)((e)=>{
-        if (isStageTitleEditing && !stageTitleRef.current?.contains(e.target)) {
-            setIsStageTitleEditing(false);
-            if (onStageTitleChange) {
-                if ('' === label.trim()) setLabel('Untitled Stage');
-                onStageTitleChange(label);
-            }
-        }
-    }, [
-        isStageTitleEditing,
-        onStageTitleChange,
-        label
-    ]);
-    (0, external_react_namespaceObject.useEffect)(()=>{
-        if (isStageTitleEditing) document.addEventListener('click', handleStageTitleClickToSave);
-        return ()=>{
-            document.removeEventListener('click', handleStageTitleClickToSave);
-        };
-    }, [
-        handleStageTitleClickToSave,
-        isStageTitleEditing
-    ]);
-    const handleStageTitleBlurToSave = (0, external_react_namespaceObject.useCallback)(()=>{
-        if (isStageTitleEditing) {
-            setIsStageTitleEditing(false);
-            if (onStageTitleChange) {
-                if ('' === label.trim()) setLabel('Untitled Stage');
-                onStageTitleChange(label);
-            }
-        }
-    }, [
-        isStageTitleEditing,
-        onStageTitleChange,
-        label
-    ]);
-    const handleStageTitleKeyDown = (0, external_react_namespaceObject.useCallback)((e)=>{
-        if ('Enter' === e.key) {
-            setIsStageTitleEditing(false);
-            if (onStageTitleChange) onStageTitleChange(label);
-        }
-        if ('Escape' !== e.key) e.stopPropagation();
-    }, [
-        onStageTitleChange,
-        label
-    ]);
+    const slaText = execution?.stageStatus?.slaText;
+    const slaIcon = execution?.stageStatus?.slaIcon;
+    const slaIndicator = slaIcon ? SLA_ICON_CONFIG[slaIcon] : void 0;
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_StageNode_styles_cjs_namespaceObject.StageHeader, {
         isException: isException,
         "data-testid": `stage-header-${id}`,
         children: [
-            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(index_cjs_namespaceObject.Row, {
-                gap: apollo_core_namespaceObject.Spacing.SpacingMicro,
-                align: "center",
-                flex: 1,
-                minW: 0,
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+                className: "flex items-start justify-between gap-1",
                 children: [
-                    icon,
-                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(index_cjs_namespaceObject.Column, {
-                        py: 2,
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(index_cjs_namespaceObject.Row, {
+                        gap: apollo_core_namespaceObject.Spacing.SpacingMicro,
+                        align: "center",
                         flex: 1,
                         minW: 0,
                         children: [
-                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
-                                className: (0, apollo_wind_namespaceObject.cn)('text-sm', !isStageTitleEditing && 'font-bold'),
-                                children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_CanvasTooltip_cjs_namespaceObject.CanvasTooltip, {
-                                    content: label,
-                                    placement: "top",
-                                    delay: true,
-                                    children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StageNode_styles_cjs_namespaceObject.StageTitleContainer, {
-                                        isEditing: isStageTitleEditing,
-                                        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StageNode_styles_cjs_namespaceObject.StageTitleInput, {
-                                            name: "Stage Title",
-                                            isStageTitleEditable: isStageTitleEditable,
-                                            value: label,
-                                            ref: stageTitleRef,
-                                            isEditing: isStageTitleEditing,
-                                            ...onStageTitleChange && {
-                                                onFocus: ()=>setIsStageTitleEditing(true),
-                                                onInput: handleStageTitleChange,
-                                                onKeyDown: handleStageTitleKeyDown,
-                                                onBlur: handleStageTitleBlurToSave
-                                            },
-                                            readOnly: !isStageTitleEditable
-                                        })
+                            icon,
+                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StageTitleInput_cjs_namespaceObject.StageTitleInput, {
+                                stageId: id,
+                                label: stageDetails.label,
+                                onChange: isReadOnly ? void 0 : onStageTitleChange,
+                                className: "flex-1 min-w-0"
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(index_cjs_namespaceObject.Row, {
+                        gap: apollo_core_namespaceObject.Spacing.SpacingMicro,
+                        align: "start",
+                        py: apollo_core_namespaceObject.Padding.PadS,
+                        children: [
+                            status && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_CanvasTooltip_cjs_namespaceObject.CanvasTooltip, {
+                                content: statusLabel,
+                                placement: "top",
+                                children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(apollo_wind_namespaceObject.Button, {
+                                    variant: "ghost",
+                                    size: "icon",
+                                    className: "h-6 w-6",
+                                    "aria-label": statusLabel,
+                                    children: 'NotExecuted' === status ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(icon_registry_cjs_namespaceObject.CanvasIcon, {
+                                        icon: "hourglass",
+                                        size: 20,
+                                        color: (0, ExecutionStatusIcon_cjs_namespaceObject.getExecutionStatusColor)('NotExecuted')
+                                    }) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_ExecutionStatusIcon_index_cjs_namespaceObject.ExecutionStatusIcon, {
+                                        status: status,
+                                        size: 20
                                     })
                                 })
                             }),
-                            stageDuration && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
-                                className: "text-xs text-foreground-muted",
-                                children: stageDuration
-                            }),
-                            stageDetails.headerChips && stageDetails.headerChips.length > 0 && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StageNode_styles_cjs_namespaceObject.StageHeaderChipsRow, {
-                                children: stageDetails.headerChips.map((chip)=>{
-                                    const button = /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_StageNode_styles_cjs_namespaceObject.StageChip, {
-                                        type: "button",
-                                        "aria-label": 'string' == typeof chip.tooltip ? chip.tooltip : chip.type,
-                                        onClick: (e)=>{
-                                            e.stopPropagation();
-                                            chip.onClick?.();
-                                        },
-                                        children: [
-                                            CHIP_ICONS[chip.type],
-                                            void 0 !== chip.count && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
-                                                className: "text-xs",
-                                                children: chip.count
-                                            })
-                                        ]
-                                    }, chip.type);
-                                    if (chip.tooltip) return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_CanvasTooltip_cjs_namespaceObject.CanvasTooltip, {
-                                        placement: "bottom",
-                                        content: chip.tooltip,
-                                        children: button
-                                    }, chip.type);
-                                    return button;
+                            (onTaskAdd || onAddTaskFromToolbox) && !isReadOnly && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_CanvasTooltip_cjs_namespaceObject.CanvasTooltip, {
+                                content: labels.addTask,
+                                placement: "top",
+                                children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(apollo_wind_namespaceObject.Button, {
+                                    variant: "ghost",
+                                    size: "icon",
+                                    className: "h-6 w-6",
+                                    onClick: handleTaskAddClick,
+                                    "aria-label": labels.addTask,
+                                    disabled: isAddTaskDisabled,
+                                    children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(icon_registry_cjs_namespaceObject.CanvasIcon, {
+                                        icon: "plus",
+                                        size: 20
+                                    })
                                 })
                             })
                         ]
                     })
                 ]
             }),
-            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(index_cjs_namespaceObject.Row, {
-                gap: apollo_core_namespaceObject.Spacing.SpacingMicro,
-                align: "start",
-                py: apollo_core_namespaceObject.Padding.PadS,
+            (slaText || stageDetails.headerChips && stageDetails.headerChips.length > 0) && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+                className: "mt-1 flex flex-wrap items-center justify-between gap-2",
                 children: [
-                    status && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_CanvasTooltip_cjs_namespaceObject.CanvasTooltip, {
-                        content: statusLabel,
-                        placement: "top",
-                        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(apollo_wind_namespaceObject.Button, {
-                            variant: "ghost",
-                            size: "icon",
-                            className: "h-6 w-6",
-                            "aria-label": statusLabel,
-                            children: 'NotExecuted' === status ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(icon_registry_cjs_namespaceObject.CanvasIcon, {
-                                icon: "hourglass",
-                                size: 20,
-                                color: (0, ExecutionStatusIcon_cjs_namespaceObject.getExecutionStatusColor)('NotExecuted')
-                            }) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_ExecutionStatusIcon_index_cjs_namespaceObject.ExecutionStatusIcon, {
-                                status: status,
-                                size: 20
-                            })
-                        })
+                    slaText && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("span", {
+                        className: "inline-flex items-center gap-1 text-xs text-foreground-muted",
+                        "data-testid": `stage-sla-${id}`,
+                        "data-sla-icon": slaIcon,
+                        children: [
+                            slaIndicator && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(icon_registry_cjs_namespaceObject.CanvasIcon, {
+                                icon: slaIndicator.icon,
+                                size: 16,
+                                color: slaIndicator.iconColor
+                            }),
+                            slaText
+                        ]
                     }),
-                    (onTaskAdd || onAddTaskFromToolbox) && !isReadOnly && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_CanvasTooltip_cjs_namespaceObject.CanvasTooltip, {
-                        content: addTaskLabel,
-                        placement: "top",
-                        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(apollo_wind_namespaceObject.Button, {
-                            variant: "ghost",
-                            size: "icon",
-                            className: "h-6 w-6",
-                            onClick: handleTaskAddClick,
-                            "aria-label": addTaskLabel,
-                            disabled: isAddTaskDisabled,
-                            children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(icon_registry_cjs_namespaceObject.CanvasIcon, {
-                                icon: "plus",
-                                size: 20
-                            })
+                    stageDetails.headerChips && stageDetails.headerChips.length > 0 && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
+                        className: "flex flex-wrap items-center gap-1",
+                        children: stageDetails.headerChips.map((chip)=>{
+                            const button = /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_StageNode_styles_cjs_namespaceObject.StageChip, {
+                                type: "button",
+                                "aria-label": 'string' == typeof chip.tooltip ? chip.tooltip : chip.type,
+                                onClick: (e)=>{
+                                    e.stopPropagation();
+                                    chip.onClick?.();
+                                },
+                                children: [
+                                    CHIP_ICONS[chip.type],
+                                    void 0 !== chip.count && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                                        className: "text-xs",
+                                        children: chip.count
+                                    })
+                                ]
+                            }, chip.type);
+                            if (chip.tooltip) return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_CanvasTooltip_cjs_namespaceObject.CanvasTooltip, {
+                                placement: "bottom",
+                                content: chip.tooltip,
+                                children: button
+                            }, chip.type);
+                            return button;
                         })
                     })
                 ]
+            }),
+            stageDuration && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                className: "mt-1 text-xs text-foreground-muted",
+                children: stageDuration
             })
         ]
     });