npm - @uipath/apollo-react - Versions diffs - 3.71.0-pr482.ae381a7 → 3.71.1 - Mend

@uipath/apollo-react 3.71.0-pr482.ae381a7 → 3.71.1

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 (138) hide show

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

@@ -32,14 +32,12 @@ const sortable_namespaceObject = require("@dnd-kit/sortable");
 const apollo_core_namespaceObject = require("@uipath/apollo-core");
 const index_cjs_namespaceObject = require("../../layouts/index.cjs");
 const react_cjs_namespaceObject = require("../../xyflow/react.cjs");
-const apollo_wind_namespaceObject = require("@uipath/apollo-wind");
+const external_material_index_cjs_namespaceObject = require("../../../material/index.cjs");
 const external_react_namespaceObject = require("react");
 const external_icons_index_cjs_namespaceObject = require("../../icons/index.cjs");
 const GroupModificationUtils_cjs_namespaceObject = require("../../utils/GroupModificationUtils.cjs");
-const icon_registry_cjs_namespaceObject = require("../../utils/icon-registry.cjs");
 const ConnectedHandlesContext_cjs_namespaceObject = require("../BaseCanvas/ConnectedHandlesContext.cjs");
 const useButtonHandles_cjs_namespaceObject = require("../ButtonHandle/useButtonHandles.cjs");
-const external_CanvasTooltip_cjs_namespaceObject = require("../CanvasTooltip.cjs");
 const external_ExecutionStatusIcon_index_cjs_namespaceObject = require("../ExecutionStatusIcon/index.cjs");
 const external_FloatingCanvasPanel_index_cjs_namespaceObject = require("../FloatingCanvasPanel/index.cjs");
 const external_NodeContextMenu_index_cjs_namespaceObject = require("../NodeContextMenu/index.cjs");
@@ -65,13 +63,13 @@ const CHIP_ICONS = {
         w: apollo_core_namespaceObject.Icon.IconXs,
         h: apollo_core_namespaceObject.Icon.IconXs
     }),
-    [external_StageNode_types_cjs_namespaceObject.StageHeaderChipType.CaseExit]: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(icon_registry_cjs_namespaceObject.CanvasIcon, {
-        icon: "x",
-        size: 16
+    [external_StageNode_types_cjs_namespaceObject.StageHeaderChipType.CaseExit]: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApIcon, {
+        name: "close",
+        size: apollo_core_namespaceObject.Icon.IconXs
     }),
-    [external_StageNode_types_cjs_namespaceObject.StageHeaderChipType.CaseCompletion]: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(icon_registry_cjs_namespaceObject.CanvasIcon, {
-        icon: "check",
-        size: 16
+    [external_StageNode_types_cjs_namespaceObject.StageHeaderChipType.CaseCompletion]: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApIcon, {
+        name: "check-mark",
+        size: apollo_core_namespaceObject.Icon.IconXs
     })
 };
 const StageNodeInner = (props)=>{
@@ -513,9 +511,10 @@ const StageNodeInner = (props)=>{
                                         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, {
+                                            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApTypography, {
+                                                variant: isStageTitleEditing ? apollo_core_namespaceObject.FontVariantToken.fontSizeM : apollo_core_namespaceObject.FontVariantToken.fontSizeMBold,
+                                                color: "var(--uix-canvas-foreground)",
+                                                children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApTooltip, {
                                                     content: label,
                                                     placement: "top",
                                                     delay: true,
@@ -538,8 +537,9 @@ const StageNodeInner = (props)=>{
                                                     })
                                                 })
                                             }),
-                                            stageDuration && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
-                                                className: "text-xs text-foreground-muted",
+                                            stageDuration && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApTypography, {
+                                                variant: apollo_core_namespaceObject.FontVariantToken.fontSizeS,
+                                                color: "var(--uix-canvas-foreground-de-emp)",
                                                 children: stageDuration
                                             }),
                                             stageDetails.headerChips && stageDetails.headerChips.length > 0 && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StageNode_styles_cjs_namespaceObject.StageHeaderChipsRow, {
@@ -553,13 +553,13 @@ const StageNodeInner = (props)=>{
                                                         },
                                                         children: [
                                                             CHIP_ICONS[chip.type],
-                                                            void 0 !== chip.count && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
-                                                                className: "text-xs",
+                                                            void 0 !== chip.count && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApTypography, {
+                                                                variant: apollo_core_namespaceObject.FontVariantToken.fontSizeS,
                                                                 children: chip.count
                                                             })
                                                         ]
                                                     }, chip.type);
-                                                    if (chip.tooltip) return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_CanvasTooltip_cjs_namespaceObject.CanvasTooltip, {
+                                                    if (chip.tooltip) return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApTooltip, {
                                                         placement: "bottom",
                                                         content: chip.tooltip,
                                                         children: button
@@ -576,34 +576,31 @@ const StageNodeInner = (props)=>{
                                 align: "start",
                                 py: apollo_core_namespaceObject.Padding.PadS,
                                 children: [
-                                    status && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_CanvasTooltip_cjs_namespaceObject.CanvasTooltip, {
+                                    status && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApTooltip, {
                                         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: /*#__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: status,
                                                 size: 20
                                             })
                                         })
                                     }),
-                                    (onTaskAdd || onAddTaskFromToolbox) && !isReadOnly && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_CanvasTooltip_cjs_namespaceObject.CanvasTooltip, {
+                                    (onTaskAdd || onAddTaskFromToolbox) && !isReadOnly && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApTooltip, {
                                         content: addTaskLabel,
                                         placement: "top",
                                         hide: addTaskLoading,
-                                        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: addTaskLoading,
-                                            children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(icon_registry_cjs_namespaceObject.CanvasIcon, {
-                                                icon: "plus",
-                                                size: 20
+                                        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                                            children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApIconButton, {
+                                                onClick: handleTaskAddClick,
+                                                size: "small",
+                                                label: addTaskLabel,
+                                                disabled: addTaskLoading,
+                                                children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApIcon, {
+                                                    name: "add",
+                                                    size: "20px"
+                                                })
                                             })
                                         })
                                     })
@@ -614,16 +611,17 @@ const StageNodeInner = (props)=>{
                     /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StageNode_styles_cjs_namespaceObject.StageContent, {
                         children: 0 === tasks.length && 0 === adhocTasks.length ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_cjs_namespaceObject.Column, {
                             py: 2,
-                            children: (onTaskAdd || onAddTaskFromToolbox) && !isReadOnly ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(apollo_wind_namespaceObject.Button, {
-                                variant: "link",
+                            children: (onTaskAdd || onAddTaskFromToolbox) && !isReadOnly ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApLink, {
                                 onClick: addTaskLoading ? void 0 : handleTaskAddClick,
+                                variant: apollo_core_namespaceObject.FontVariantToken.fontSizeS,
                                 style: {
                                     maxWidth: 'fit-content',
                                     pointerEvents: addTaskLoading ? 'none' : void 0
                                 },
                                 children: defaultContent
-                            }) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
-                                className: "text-xs text-foreground-muted",
+                            }) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApTypography, {
+                                variant: apollo_core_namespaceObject.FontVariantToken.fontSizeS,
+                                color: "var(--uix-canvas-foreground-de-emp)",
                                 children: defaultContent
                             })
                         }) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(jsx_runtime_namespaceObject.Fragment, {
@@ -652,8 +650,8 @@ const StageNodeInner = (props)=>{
                                                                 isParallel: isParallel,
                                                                 children: [
                                                                     isParallel && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StageNode_styles_cjs_namespaceObject.StageParallelLabel, {
-                                                                        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
-                                                                            className: "text-xs",
+                                                                        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApTypography, {
+                                                                            variant: apollo_core_namespaceObject.FontVariantToken.fontSizeS,
                                                                             children: "Parallel"
                                                                         })
                                                                     }),
@@ -694,8 +692,9 @@ const StageNodeInner = (props)=>{
                                     },
                                     children: [
                                         /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StageNode_styles_cjs_namespaceObject.StageAdhocHeaderSection, {
-                                            children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
-                                                className: "text-xs font-bold text-foreground-muted",
+                                            children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApTypography, {
+                                                variant: apollo_core_namespaceObject.FontVariantToken.fontSizeSBold,
+                                                color: "var(--uix-canvas-foreground-de-emp)",
                                                 children: "Ad hoc tasks"
                                             })
                                         }),

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

	@@ -1 +1 @@
1	- {"version":3,"file":"StageNode.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageNode.tsx"],"names":[],"mappings":"~~AAyDA~~,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;~~AA8vBxD~~,eAAO,MAAM,SAAS,~~8CA1uBS~~,cAAc,~~6CA0uBA~~,CAAC"}
1	+ {"version":3,"file":"StageNode.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageNode.tsx"],"names":[],"mappings":"AA6DA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAwxBxD,eAAO,MAAM,SAAS,8CApwBS,cAAc,6CAowBA,CAAC"}

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

@@ -1,17 +1,15 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { DndContext, KeyboardSensor, PointerSensor, closestCenter, useSensor, useSensors } from "@dnd-kit/core";
 import { SortableContext, sortableKeyboardCoordinates, verticalListSortingStrategy } from "@dnd-kit/sortable";
-import { Icon, Padding, Spacing } from "@uipath/apollo-core";
+import { FontVariantToken, Icon, Padding, Spacing } from "@uipath/apollo-core";
 import { Column, Row } from "../../layouts/index.js";
 import { Position, useStore, useStoreApi } from "../../xyflow/react.js";
-import { Button, cn } from "@uipath/apollo-wind";
+import { ApIcon, ApIconButton, ApLink, ApTooltip, ApTypography } from "../../../material/index.js";
 import { memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { EntryConditionIcon, ExitConditionIcon, ReturnToOriginIcon } from "../../icons/index.js";
 import { GroupModificationType, moveGroupDown, moveGroupUp } from "../../utils/GroupModificationUtils.js";
-import { CanvasIcon } from "../../utils/icon-registry.js";
 import { useConnectedHandles } from "../BaseCanvas/ConnectedHandlesContext.js";
 import { useButtonHandles } from "../ButtonHandle/useButtonHandles.js";
-import { CanvasTooltip } from "../CanvasTooltip.js";
 import { ExecutionStatusIcon } from "../ExecutionStatusIcon/index.js";
 import { FloatingCanvasPanel } from "../FloatingCanvasPanel/index.js";
 import { NodeContextMenu } from "../NodeContextMenu/index.js";
@@ -37,13 +35,13 @@ const CHIP_ICONS = {
         w: Icon.IconXs,
         h: Icon.IconXs
     }),
-    [StageHeaderChipType.CaseExit]: /*#__PURE__*/ jsx(CanvasIcon, {
-        icon: "x",
-        size: 16
+    [StageHeaderChipType.CaseExit]: /*#__PURE__*/ jsx(ApIcon, {
+        name: "close",
+        size: Icon.IconXs
     }),
-    [StageHeaderChipType.CaseCompletion]: /*#__PURE__*/ jsx(CanvasIcon, {
-        icon: "check",
-        size: 16
+    [StageHeaderChipType.CaseCompletion]: /*#__PURE__*/ jsx(ApIcon, {
+        name: "check-mark",
+        size: Icon.IconXs
     })
 };
 const StageNodeInner = (props)=>{
@@ -485,9 +483,10 @@ const StageNodeInner = (props)=>{
                                         flex: 1,
                                         minW: 0,
                                         children: [
-                                            /*#__PURE__*/ jsx("span", {
-                                                className: cn('text-sm', !isStageTitleEditing && 'font-bold'),
-                                                children: /*#__PURE__*/ jsx(CanvasTooltip, {
+                                            /*#__PURE__*/ jsx(ApTypography, {
+                                                variant: isStageTitleEditing ? FontVariantToken.fontSizeM : FontVariantToken.fontSizeMBold,
+                                                color: "var(--uix-canvas-foreground)",
+                                                children: /*#__PURE__*/ jsx(ApTooltip, {
                                                     content: label,
                                                     placement: "top",
                                                     delay: true,
@@ -510,8 +509,9 @@ const StageNodeInner = (props)=>{
                                                     })
                                                 })
                                             }),
-                                            stageDuration && /*#__PURE__*/ jsx("span", {
-                                                className: "text-xs text-foreground-muted",
+                                            stageDuration && /*#__PURE__*/ jsx(ApTypography, {
+                                                variant: FontVariantToken.fontSizeS,
+                                                color: "var(--uix-canvas-foreground-de-emp)",
                                                 children: stageDuration
                                             }),
                                             stageDetails.headerChips && stageDetails.headerChips.length > 0 && /*#__PURE__*/ jsx(StageHeaderChipsRow, {
@@ -525,13 +525,13 @@ const StageNodeInner = (props)=>{
                                                         },
                                                         children: [
                                                             CHIP_ICONS[chip.type],
-                                                            void 0 !== chip.count && /*#__PURE__*/ jsx("span", {
-                                                                className: "text-xs",
+                                                            void 0 !== chip.count && /*#__PURE__*/ jsx(ApTypography, {
+                                                                variant: FontVariantToken.fontSizeS,
                                                                 children: chip.count
                                                             })
                                                         ]
                                                     }, chip.type);
-                                                    if (chip.tooltip) return /*#__PURE__*/ jsx(CanvasTooltip, {
+                                                    if (chip.tooltip) return /*#__PURE__*/ jsx(ApTooltip, {
                                                         placement: "bottom",
                                                         content: chip.tooltip,
                                                         children: button
@@ -548,34 +548,31 @@ const StageNodeInner = (props)=>{
                                 align: "start",
                                 py: Padding.PadS,
                                 children: [
-                                    status && /*#__PURE__*/ jsx(CanvasTooltip, {
+                                    status && /*#__PURE__*/ jsx(ApTooltip, {
                                         content: statusLabel,
                                         placement: "top",
-                                        children: /*#__PURE__*/ jsx(Button, {
-                                            variant: "ghost",
-                                            size: "icon",
-                                            className: "h-6 w-6",
-                                            "aria-label": statusLabel,
+                                        children: /*#__PURE__*/ jsx(ApIconButton, {
+                                            size: "small",
                                             children: /*#__PURE__*/ jsx(ExecutionStatusIcon, {
                                                 status: status,
                                                 size: 20
                                             })
                                         })
                                     }),
-                                    (onTaskAdd || onAddTaskFromToolbox) && !isReadOnly && /*#__PURE__*/ jsx(CanvasTooltip, {
+                                    (onTaskAdd || onAddTaskFromToolbox) && !isReadOnly && /*#__PURE__*/ jsx(ApTooltip, {
                                         content: addTaskLabel,
                                         placement: "top",
                                         hide: addTaskLoading,
-                                        children: /*#__PURE__*/ jsx(Button, {
-                                            variant: "ghost",
-                                            size: "icon",
-                                            className: "h-6 w-6",
-                                            onClick: handleTaskAddClick,
-                                            "aria-label": addTaskLabel,
-                                            disabled: addTaskLoading,
-                                            children: /*#__PURE__*/ jsx(CanvasIcon, {
-                                                icon: "plus",
-                                                size: 20
+                                        children: /*#__PURE__*/ jsx("span", {
+                                            children: /*#__PURE__*/ jsx(ApIconButton, {
+                                                onClick: handleTaskAddClick,
+                                                size: "small",
+                                                label: addTaskLabel,
+                                                disabled: addTaskLoading,
+                                                children: /*#__PURE__*/ jsx(ApIcon, {
+                                                    name: "add",
+                                                    size: "20px"
+                                                })
                                             })
                                         })
                                     })
@@ -586,16 +583,17 @@ const StageNodeInner = (props)=>{
                     /*#__PURE__*/ jsx(StageContent, {
                         children: 0 === tasks.length && 0 === adhocTasks.length ? /*#__PURE__*/ jsx(Column, {
                             py: 2,
-                            children: (onTaskAdd || onAddTaskFromToolbox) && !isReadOnly ? /*#__PURE__*/ jsx(Button, {
-                                variant: "link",
+                            children: (onTaskAdd || onAddTaskFromToolbox) && !isReadOnly ? /*#__PURE__*/ jsx(ApLink, {
                                 onClick: addTaskLoading ? void 0 : handleTaskAddClick,
+                                variant: FontVariantToken.fontSizeS,
                                 style: {
                                     maxWidth: 'fit-content',
                                     pointerEvents: addTaskLoading ? 'none' : void 0
                                 },
                                 children: defaultContent
-                            }) : /*#__PURE__*/ jsx("span", {
-                                className: "text-xs text-foreground-muted",
+                            }) : /*#__PURE__*/ jsx(ApTypography, {
+                                variant: FontVariantToken.fontSizeS,
+                                color: "var(--uix-canvas-foreground-de-emp)",
                                 children: defaultContent
                             })
                         }) : /*#__PURE__*/ jsxs(Fragment, {
@@ -624,8 +622,8 @@ const StageNodeInner = (props)=>{
                                                                 isParallel: isParallel,
                                                                 children: [
                                                                     isParallel && /*#__PURE__*/ jsx(StageParallelLabel, {
-                                                                        children: /*#__PURE__*/ jsx("span", {
-                                                                            className: "text-xs",
+                                                                        children: /*#__PURE__*/ jsx(ApTypography, {
+                                                                            variant: FontVariantToken.fontSizeS,
                                                                             children: "Parallel"
                                                                         })
                                                                     }),
@@ -666,8 +664,9 @@ const StageNodeInner = (props)=>{
                                     },
                                     children: [
                                         /*#__PURE__*/ jsx(StageAdhocHeaderSection, {
-                                            children: /*#__PURE__*/ jsx("span", {
-                                                className: "text-xs font-bold text-foreground-muted",
+                                            children: /*#__PURE__*/ jsx(ApTypography, {
+                                                variant: FontVariantToken.fontSizeSBold,
+                                                color: "var(--uix-canvas-foreground-de-emp)",
                                                 children: "Ad hoc tasks"
                                             })
                                         }),

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

@@ -34,19 +34,7 @@ const StageNodeWrapper = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(
         selected: selected,
         dragging: dragging,
         width: width,
-        ...data,
-        menuItems: [
-            {
-                id: 'menu-item-1',
-                label: 'Menu Item 1',
-                onClick: ()=>alert('Menu Item 1 clicked')
-            },
-            {
-                id: 'menu-item-2',
-                label: 'Menu Item 2',
-                onClick: ()=>alert('Menu Item 2 clicked')
-            }
-        ]
+        ...data
     }));
 exports.StageNodeWrapper = __webpack_exports__.StageNodeWrapper;
 for(var __rspack_i in __webpack_exports__)if (-1 === [

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

	@@ -1 +1 @@
1	- {"version":3,"file":"StageNode.stories.utils.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageNode.stories.utils.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,0CAA0C,CAAC;AAG1E,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAE5D,KAAK,qBAAqB,GAAG,IAAI,CAAC,SAAS,EAAE,MAAM,CAAC,GAAG;IACrD,IAAI,EAAE,kBAAkB,CAAC;CAC1B,CAAC;AAEF,eAAO,MAAM,gBAAgB,gFACe,qBAAqB,~~6CAwBhE~~,CAAC"}
1	+ {"version":3,"file":"StageNode.stories.utils.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageNode.stories.utils.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,0CAA0C,CAAC;AAG1E,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAE5D,KAAK,qBAAqB,GAAG,IAAI,CAAC,SAAS,EAAE,MAAM,CAAC,GAAG;IACrD,IAAI,EAAE,kBAAkB,CAAC;CAC1B,CAAC;AAEF,eAAO,MAAM,gBAAgB,gFACe,qBAAqB,6CAGhE,CAAC"}

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

@@ -6,18 +6,6 @@ const StageNodeWrapper = /*#__PURE__*/ memo(({ id, selected, dragging, width, da
         selected: selected,
         dragging: dragging,
         width: width,
-        ...data,
-        menuItems: [
-            {
-                id: 'menu-item-1',
-                label: 'Menu Item 1',
-                onClick: ()=>alert('Menu Item 1 clicked')
-            },
-            {
-                id: 'menu-item-2',
-                label: 'Menu Item 2',
-                onClick: ()=>alert('Menu Item 2 clicked')
-            }
-        ]
+        ...data
     }));
 export { StageNodeWrapper };

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

@@ -38,15 +38,14 @@ __webpack_require__.d(__webpack_exports__, {
 const jsx_runtime_namespaceObject = require("react/jsx-runtime");
 const apollo_core_namespaceObject = require("@uipath/apollo-core");
 const index_cjs_namespaceObject = require("../../layouts/index.cjs");
-const apollo_wind_namespaceObject = require("@uipath/apollo-wind");
+const external_material_index_cjs_namespaceObject = require("../../../material/index.cjs");
 const external_debounce_namespaceObject = require("debounce");
 var external_debounce_default = /*#__PURE__*/ __webpack_require__.n(external_debounce_namespaceObject);
 const external_react_namespaceObject = require("react");
 const external_icons_index_cjs_namespaceObject = require("../../icons/index.cjs");
-const external_CanvasTooltip_cjs_namespaceObject = require("../CanvasTooltip.cjs");
 const external_ExecutionStatusIcon_index_cjs_namespaceObject = require("../ExecutionStatusIcon/index.cjs");
 const external_StageNode_styles_cjs_namespaceObject = require("./StageNode.styles.cjs");
-const ProcessCanvasIcon = ()=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("svg", {
+const ProcessNodeIcon = ()=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("svg", {
         viewBox: "0 0 24 24",
         fill: "none",
         stroke: "currentColor",
@@ -111,33 +110,27 @@ const TaskPlayButton = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(({
     ]);
     const iconSize = small ? 18 : 22;
     const buttonSize = small ? '20px' : apollo_core_namespaceObject.Spacing.SpacingL;
-    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_CanvasTooltip_cjs_namespaceObject.CanvasTooltip, {
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApTooltip, {
         content: "Trigger task",
         placement: "top",
-        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(apollo_wind_namespaceObject.Button, {
-            variant: "ghost",
-            size: "icon",
+        children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApIconButton, {
             "data-testid": `stage-task-play-${taskId}`,
             onClick: handlePlayClick,
             onMouseDown: (e)=>e.stopPropagation(),
             onKeyDown: (e)=>e.stopPropagation(),
             className: "task-menu-icon-button",
-            style: {
-                color: 'var(--uix-canvas-icon-default)',
-                minWidth: 'unset',
-                width: buttonSize,
-                height: buttonSize,
-                padding: 0,
+            sx: {
+                color: 'var(--uix-canvas-icon-default) !important',
+                minWidth: 'unset !important',
+                width: `${buttonSize} !important`,
+                height: `${buttonSize} !important`,
+                padding: '0 !important',
                 ...small && {
                     marginRight: '-2px'
                 }
             },
-            children: playLoading ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(apollo_wind_namespaceObject.Spinner, {
-                size: "sm",
-                style: {
-                    width: iconSize - 2,
-                    height: iconSize - 2
-                }
+            children: playLoading ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApCircularProgress, {
+                size: iconSize - 2
             }) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_icons_index_cjs_namespaceObject.TimelinePlayIcon, {
                 w: iconSize,
                 h: iconSize
@@ -173,17 +166,23 @@ const TaskContent = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(({ ta
                             },
                             children: [
                                 /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StageNode_styles_cjs_namespaceObject.StageTaskIcon, {
-                                    children: task.icon ?? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ProcessCanvasIcon, {})
+                                    children: task.icon ?? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(ProcessNodeIcon, {})
                                 }),
-                                /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_CanvasTooltip_cjs_namespaceObject.CanvasTooltip, {
+                                /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApTooltip, {
                                     content: task.label,
                                     placement: "top",
                                     smartTooltip: true,
                                     ...isDragging && {
                                         isOpen: false
                                     },
-                                    children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
-                                        className: "text-sm truncate",
+                                    children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApTypography, {
+                                        variant: apollo_core_namespaceObject.FontVariantToken.fontSizeM,
+                                        color: "var(--uix-canvas-foreground)",
+                                        style: {
+                                            overflow: 'hidden',
+                                            textOverflow: 'ellipsis',
+                                            whiteSpace: 'nowrap'
+                                        },
                                         children: task.label
                                     })
                                 })
@@ -196,14 +195,11 @@ const TaskContent = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(({ ta
                                 flexShrink: 0
                             },
                             children: [
-                                hasExecutionStatus && (taskExecution.message ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_CanvasTooltip_cjs_namespaceObject.CanvasTooltip, {
+                                hasExecutionStatus && (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)(apollo_wind_namespaceObject.Button, {
-                                        variant: "ghost",
-                                        size: "icon",
-                                        className: "h-6 w-6",
-                                        "aria-label": taskExecution.message,
+                                    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
                                         })
@@ -231,14 +227,16 @@ const TaskContent = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(({ ta
                         /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(index_cjs_namespaceObject.Row, {
                             gap: '2px',
                             children: [
-                                taskExecution?.duration && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
-                                    className: "text-xs text-foreground-muted",
+                                taskExecution?.duration && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApTypography, {
+                                    variant: apollo_core_namespaceObject.FontVariantToken.fontSizeS,
+                                    color: "var(--uix-canvas-foreground-de-emp)",
                                     children: taskExecution.duration
                                 }),
                                 taskExecution?.retryDuration && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_StageNode_styles_cjs_namespaceObject.StageTaskRetryDuration, {
                                     status: taskExecution.badgeStatus ?? 'warning',
-                                    children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
-                                        className: "text-xs",
+                                    children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApTypography, {
+                                        variant: apollo_core_namespaceObject.FontVariantToken.fontSizeS,
+                                        color: "inherit",
                                         children: `(+${taskExecution.retryDuration})`
                                     })
                                 })
@@ -248,9 +246,10 @@ const TaskContent = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(({ ta
                             align: "center",
                             gap: apollo_core_namespaceObject.Spacing.SpacingXs,
                             children: [
-                                taskExecution?.badge && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(apollo_wind_namespaceObject.Badge, {
-                                    variant: taskExecution.badgeStatus,
-                                    children: generateBadgeText(taskExecution) ?? ''
+                                taskExecution?.badge && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_material_index_cjs_namespaceObject.ApBadge, {
+                                    size: external_material_index_cjs_namespaceObject.BadgeSize.SMALL,
+                                    status: taskExecution.badgeStatus,
+                                    label: generateBadgeText(taskExecution) ?? ''
                                 }),
                                 showPlayButtonSmall && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(TaskPlayButton, {
                                     taskId: task.id,

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

	@@ -1 +1 @@
1	- {"version":3,"file":"TaskContent.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/TaskContent.tsx"],"names":[],"mappings":"~~AASA~~,OAAO,KAAK,EAAE,kBAAkB,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;~~AA8F3E~~,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,aAAa,CAAC;IACpB,aAAa,CAAC,EAAE,kBAAkB,CAAC;IACnC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CAChD;AAED,eAAO,MAAM,WAAW,wFAC4B,gBAAgB,~~6CAmFnE~~,CAAC"}
1	+ {"version":3,"file":"TaskContent.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/TaskContent.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAE,kBAAkB,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AA4F3E,MAAM,WAAW,gBAAgB;IAC/B,IAAI,EAAE,aAAa,CAAC;IACpB,aAAa,CAAC,EAAE,kBAAkB,CAAC;IACnC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CAChD;AAED,eAAO,MAAM,WAAW,wFAC4B,gBAAgB,6CA6FnE,CAAC"}