@uipath/apollo-react 4.44.0 → 4.45.0

package/dist/canvas/components/NodePropertiesPanel/fields/TextField.cjs

@@ -27,9 +27,9 @@ __webpack_require__.d(__webpack_exports__, {
     TextField: ()=>TextField_TextField
 });
 const jsx_runtime_namespaceObject = require("react/jsx-runtime");
-const index_cjs_namespaceObject = require("../../../layouts/index.cjs");
+const apollo_wind_namespaceObject = require("@uipath/apollo-wind");
 const external_react_namespaceObject = require("react");
-const external_NodePropertiesPanel_styles_cjs_namespaceObject = require("../NodePropertiesPanel.styles.cjs");
+const inputBase = 'w-full px-3 py-2 text-[13px] font-mono border border-(--canvas-border) rounded bg-(--canvas-background) text-(--canvas-foreground) outline-none transition-colors placeholder:text-(--canvas-foreground-de-emp) focus:border-(--canvas-primary) disabled:opacity-50 disabled:cursor-not-allowed';
 const TextField_TextField = /*#__PURE__*/ (0, external_react_namespaceObject.memo)(function({ field, value, onChange, error }) {
     const [localValue, setLocalValue] = (0, external_react_namespaceObject.useState)(value || '');
     const debounceTimer = (0, external_react_namespaceObject.useRef)(null);
@@ -61,43 +61,47 @@ const TextField_TextField = /*#__PURE__*/ (0, external_react_namespaceObject.mem
         field.debounce,
         onChange
     ]);
-    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(index_cjs_namespaceObject.Column, {
-        gap: 4,
+    const inputId = `field-${field.key}`;
+    return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+        className: "flex flex-col gap-1",
         children: [
-            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_NodePropertiesPanel_styles_cjs_namespaceObject.FieldLabel, {
+            /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("label", {
+                htmlFor: inputId,
+                className: "text-[13px] text-(--canvas-foreground-de-emp)",
                 children: field.label
             }),
-            'textarea' === field.type ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_NodePropertiesPanel_styles_cjs_namespaceObject.TextArea, {
-                className: "nodrag",
+            'textarea' === field.type ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("textarea", {
+                id: inputId,
+                className: (0, apollo_wind_namespaceObject.cn)('nodrag resize-y', inputBase, error && 'border-(--canvas-error)'),
                 value: localValue,
                 onChange: handleChange,
                 placeholder: field.placeholder,
                 disabled: field.disabled,
-                rows: field.rows || 3,
-                hasError: !!error
-            }) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_NodePropertiesPanel_styles_cjs_namespaceObject.InputWrapper, {
+                rows: field.rows || 3
+            }) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
+                className: "flex items-center gap-2",
                 children: [
-                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_NodePropertiesPanel_styles_cjs_namespaceObject.TextInput, {
-                        className: "nodrag",
+                    /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("input", {
+                        id: inputId,
+                        className: (0, apollo_wind_namespaceObject.cn)('nodrag flex-1', inputBase, error && 'border-(--canvas-error)'),
                         type: "text",
                         value: localValue,
                         onChange: handleChange,
                         placeholder: field.placeholder,
-                        disabled: field.disabled,
-                        hasError: !!error,
-                        style: {
-                            flex: 1
-                        }
+                        disabled: field.disabled
                     }),
-                    field.suffix && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_NodePropertiesPanel_styles_cjs_namespaceObject.InputSuffix, {
+                    field.suffix && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                        className: "shrink-0 text-[13px] text-(--canvas-foreground-de-emp) whitespace-nowrap",
                         children: field.suffix
                     })
                 ]
             }),
-            field.helpText && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_NodePropertiesPanel_styles_cjs_namespaceObject.FieldHelpText, {
+            field.helpText && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                className: "text-[12px] text-(--canvas-foreground-de-emp) block",
                 children: field.helpText
             }),
-            error && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_NodePropertiesPanel_styles_cjs_namespaceObject.FieldError, {
+            error && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
+                className: "text-[12px] text-(--canvas-error-text) block",
                 children: error
             })
         ]

package/dist/canvas/components/NodePropertiesPanel/fields/TextField.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TextField.d.ts","sourceRoot":"","sources":["../../../../../src/canvas/components/NodePropertiesPanel/fields/TextField.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAEhE,UAAU,cAAc;IACtB,KAAK,EAAE,WAAW,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,eAAO,MAAM,SAAS,sDA+EpB,CAAC"}
+{"version":3,"file":"TextField.d.ts","sourceRoot":"","sources":["../../../../../src/canvas/components/NodePropertiesPanel/fields/TextField.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,8BAA8B,CAAC;AAEhE,UAAU,cAAc;IACtB,KAAK,EAAE,WAAW,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAKD,eAAO,MAAM,SAAS,sDAwFpB,CAAC"}

package/dist/canvas/components/NodePropertiesPanel/fields/TextField.js

@@ -1,7 +1,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
-import { Column } from "../../../layouts/index.js";
+import { cn } from "@uipath/apollo-wind";
 import { memo, useCallback, useEffect, useRef, useState } from "react";
-import { FieldError, FieldHelpText, FieldLabel, InputSuffix, InputWrapper, TextArea, TextInput } from "../NodePropertiesPanel.styles.js";
+const inputBase = 'w-full px-3 py-2 text-[13px] font-mono border border-(--canvas-border) rounded bg-(--canvas-background) text-(--canvas-foreground) outline-none transition-colors placeholder:text-(--canvas-foreground-de-emp) focus:border-(--canvas-primary) disabled:opacity-50 disabled:cursor-not-allowed';
 const TextField_TextField = /*#__PURE__*/ memo(function({ field, value, onChange, error }) {
     const [localValue, setLocalValue] = useState(value || '');
     const debounceTimer = useRef(null);
@@ -33,43 +33,47 @@ const TextField_TextField = /*#__PURE__*/ memo(function({ field, value, onChange
         field.debounce,
         onChange
     ]);
-    return /*#__PURE__*/ jsxs(Column, {
-        gap: 4,
+    const inputId = `field-${field.key}`;
+    return /*#__PURE__*/ jsxs("div", {
+        className: "flex flex-col gap-1",
         children: [
-            /*#__PURE__*/ jsx(FieldLabel, {
+            /*#__PURE__*/ jsx("label", {
+                htmlFor: inputId,
+                className: "text-[13px] text-(--canvas-foreground-de-emp)",
                 children: field.label
             }),
-            'textarea' === field.type ? /*#__PURE__*/ jsx(TextArea, {
-                className: "nodrag",
+            'textarea' === field.type ? /*#__PURE__*/ jsx("textarea", {
+                id: inputId,
+                className: cn('nodrag resize-y', inputBase, error && 'border-(--canvas-error)'),
                 value: localValue,
                 onChange: handleChange,
                 placeholder: field.placeholder,
                 disabled: field.disabled,
-                rows: field.rows || 3,
-                hasError: !!error
-            }) : /*#__PURE__*/ jsxs(InputWrapper, {
+                rows: field.rows || 3
+            }) : /*#__PURE__*/ jsxs("div", {
+                className: "flex items-center gap-2",
                 children: [
-                    /*#__PURE__*/ jsx(TextInput, {
-                        className: "nodrag",
+                    /*#__PURE__*/ jsx("input", {
+                        id: inputId,
+                        className: cn('nodrag flex-1', inputBase, error && 'border-(--canvas-error)'),
                         type: "text",
                         value: localValue,
                         onChange: handleChange,
                         placeholder: field.placeholder,
-                        disabled: field.disabled,
-                        hasError: !!error,
-                        style: {
-                            flex: 1
-                        }
+                        disabled: field.disabled
                     }),
-                    field.suffix && /*#__PURE__*/ jsx(InputSuffix, {
+                    field.suffix && /*#__PURE__*/ jsx("span", {
+                        className: "shrink-0 text-[13px] text-(--canvas-foreground-de-emp) whitespace-nowrap",
                         children: field.suffix
                     })
                 ]
             }),
-            field.helpText && /*#__PURE__*/ jsx(FieldHelpText, {
+            field.helpText && /*#__PURE__*/ jsx("span", {
+                className: "text-[12px] text-(--canvas-foreground-de-emp) block",
                 children: field.helpText
             }),
-            error && /*#__PURE__*/ jsx(FieldError, {
+            error && /*#__PURE__*/ jsx("span", {
+                className: "text-[12px] text-(--canvas-error-text) block",
                 children: error
             })
         ]

package/dist/canvas/components/NodePropertiesPanel/index.cjs

@@ -1,34 +1,5 @@
 "use strict";
-var __webpack_modules__ = {
-    "./NodePropertiesPanel?2c94" (module) {
-        module.exports = require("./NodePropertiesPanel.cjs");
-    },
-    "./NodePropertiesPanel.styles" (module) {
-        module.exports = require("./NodePropertiesPanel.styles.cjs");
-    },
-    "./schemas" (module) {
-        module.exports = require("./schemas.cjs");
-    }
-};
-var __webpack_module_cache__ = {};
-function __webpack_require__(moduleId) {
-    var cachedModule = __webpack_module_cache__[moduleId];
-    if (void 0 !== cachedModule) return cachedModule.exports;
-    var module = __webpack_module_cache__[moduleId] = {
-        exports: {}
-    };
-    __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
-    return module.exports;
-}
-(()=>{
-    __webpack_require__.n = (module)=>{
-        var getter = module && module.__esModule ? ()=>module['default'] : ()=>module;
-        __webpack_require__.d(getter, {
-            a: getter
-        });
-        return getter;
-    };
-})();
+var __webpack_require__ = {};
 (()=>{
     __webpack_require__.d = (exports1, definition)=>{
         for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
@@ -51,31 +22,17 @@ function __webpack_require__(moduleId) {
     };
 })();
 var __webpack_exports__ = {};
-(()=>{
-    __webpack_require__.r(__webpack_exports__);
-    __webpack_require__.d(__webpack_exports__, {
-        NodePropertiesPanel: ()=>_NodePropertiesPanel__rspack_import_0.NodePropertiesPanel,
-        agentNodeSchema: ()=>_schemas__rspack_import_2.agentNodeSchema,
-        artifactNodeSchema: ()=>_schemas__rspack_import_2.artifactNodeSchema,
-        defaultNodeSchema: ()=>_schemas__rspack_import_2.defaultNodeSchema,
-        nodeSchemas: ()=>_schemas__rspack_import_2.nodeSchemas,
-        stageNodeSchema: ()=>_schemas__rspack_import_2.stageNodeSchema
-    });
-    var _NodePropertiesPanel__rspack_import_0 = __webpack_require__("./NodePropertiesPanel?2c94");
-    var _NodePropertiesPanel_styles__rspack_import_1 = __webpack_require__("./NodePropertiesPanel.styles");
-    var __rspack_reexport = {};
-    for(const __rspack_import_key in _NodePropertiesPanel_styles__rspack_import_1)if ([
-        "NodePropertiesPanel",
-        "agentNodeSchema",
-        "artifactNodeSchema",
-        "default",
-        "nodeSchemas",
-        "stageNodeSchema",
-        "defaultNodeSchema"
-    ].indexOf(__rspack_import_key) < 0) __rspack_reexport[__rspack_import_key] = ()=>_NodePropertiesPanel_styles__rspack_import_1[__rspack_import_key];
-    __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _schemas__rspack_import_2 = __webpack_require__("./schemas");
-})();
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    NodePropertiesPanel: ()=>external_NodePropertiesPanel_cjs_namespaceObject.NodePropertiesPanel,
+    agentNodeSchema: ()=>external_schemas_cjs_namespaceObject.agentNodeSchema,
+    artifactNodeSchema: ()=>external_schemas_cjs_namespaceObject.artifactNodeSchema,
+    nodeSchemas: ()=>external_schemas_cjs_namespaceObject.nodeSchemas,
+    stageNodeSchema: ()=>external_schemas_cjs_namespaceObject.stageNodeSchema,
+    defaultNodeSchema: ()=>external_schemas_cjs_namespaceObject.defaultNodeSchema
+});
+const external_NodePropertiesPanel_cjs_namespaceObject = require("./NodePropertiesPanel.cjs");
+const external_schemas_cjs_namespaceObject = require("./schemas.cjs");
 exports.NodePropertiesPanel = __webpack_exports__.NodePropertiesPanel;
 exports.agentNodeSchema = __webpack_exports__.agentNodeSchema;
 exports.artifactNodeSchema = __webpack_exports__.artifactNodeSchema;

package/dist/canvas/components/NodePropertiesPanel/index.d.ts

@@ -1,5 +1,4 @@
 export { NodePropertiesPanel } from './NodePropertiesPanel';
-export * from './NodePropertiesPanel.styles';
 export type { AgentNodeConfig, ConfigField, ConfigSection, ConfigurableNode, FieldType, NodeConfigData, NodeConfigSchema, NodePropertiesPanelProps, SelectOption, StageNodeConfig, ValidationRule, } from './NodePropertiesPanel.types';
 export { agentNodeSchema, artifactNodeSchema, defaultNodeSchema, nodeSchemas, stageNodeSchema, } from './schemas';
 //# sourceMappingURL=index.d.ts.map

package/dist/canvas/components/NodePropertiesPanel/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/NodePropertiesPanel/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,cAAc,8BAA8B,CAAC;AAC7C,YAAY,EACV,eAAe,EACf,WAAW,EACX,aAAa,EACb,gBAAgB,EAChB,SAAS,EACT,cAAc,EACd,gBAAgB,EAChB,wBAAwB,EACxB,YAAY,EACZ,eAAe,EACf,cAAc,GACf,MAAM,6BAA6B,CAAC;AACrC,OAAO,EACL,eAAe,EACf,kBAAkB,EAClB,iBAAiB,EACjB,WAAW,EACX,eAAe,GAChB,MAAM,WAAW,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/NodePropertiesPanel/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AAC5D,YAAY,EACV,eAAe,EACf,WAAW,EACX,aAAa,EACb,gBAAgB,EAChB,SAAS,EACT,cAAc,EACd,gBAAgB,EAChB,wBAAwB,EACxB,YAAY,EACZ,eAAe,EACf,cAAc,GACf,MAAM,6BAA6B,CAAC;AACrC,OAAO,EACL,eAAe,EACf,kBAAkB,EAClB,iBAAiB,EACjB,WAAW,EACX,eAAe,GAChB,MAAM,WAAW,CAAC"}

package/dist/canvas/components/NodePropertiesPanel/index.js

@@ -1,4 +1,3 @@
 import { NodePropertiesPanel } from "./NodePropertiesPanel.js";
 import { agentNodeSchema, artifactNodeSchema, defaultNodeSchema, nodeSchemas, stageNodeSchema } from "./schemas.js";
-export * from "./NodePropertiesPanel.styles.js";
 export { NodePropertiesPanel, agentNodeSchema, artifactNodeSchema, defaultNodeSchema, nodeSchemas, stageNodeSchema };

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

@@ -61,7 +61,7 @@ const AdhocTaskItemComponent = ({ task, taskExecution, isSelected, getContextMen
             }),
             getContextMenuItems && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_TaskMenu_cjs_namespaceObject.TaskMenu, {
                 ref: menuRef,
-                taskId: task.id,
+                task: task,
                 getContextMenuItems: getContextMenuItems,
                 disabled: isTaskLoading
             })

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

@@ -4,7 +4,7 @@ interface AdhocTaskItemProps {
     task: StageTaskItem;
     taskExecution?: StageTaskExecution;
     isSelected: boolean;
-    getContextMenuItems?: () => NodeMenuItem[];
+    getContextMenuItems?: (task: StageTaskItem) => NodeMenuItem[];
     onTaskClick: (e: React.MouseEvent, taskId: string) => void;
     onTaskPlay?: (taskId: string) => Promise<void>;
     isTaskLoading?: boolean;

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

@@ -1 +1 @@
-{"version":3,"file":"AdhocTask.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/AdhocTask.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAEvD,OAAO,KAAK,EAAE,kBAAkB,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAI3E,UAAU,kBAAkB;IAC1B,IAAI,EAAE,aAAa,CAAC;IACpB,aAAa,CAAC,EAAE,kBAAkB,CAAC;IACnC,UAAU,EAAE,OAAO,CAAC;IACpB,mBAAmB,CAAC,EAAE,MAAM,YAAY,EAAE,CAAC;IAC3C,WAAW,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3D,UAAU,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC/C,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAgDD,eAAO,MAAM,aAAa,0IAtCvB,kBAAkB,6CAsCoC,CAAC"}
+{"version":3,"file":"AdhocTask.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/AdhocTask.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAEvD,OAAO,KAAK,EAAE,kBAAkB,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAI3E,UAAU,kBAAkB;IAC1B,IAAI,EAAE,aAAa,CAAC;IACpB,aAAa,CAAC,EAAE,kBAAkB,CAAC;IACnC,UAAU,EAAE,OAAO,CAAC;IAGpB,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,aAAa,KAAK,YAAY,EAAE,CAAC;IAC9D,WAAW,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3D,UAAU,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC/C,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAgDD,eAAO,MAAM,aAAa,0IAtCvB,kBAAkB,6CAsCoC,CAAC"}

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

@@ -33,7 +33,7 @@ const AdhocTaskItemComponent = ({ task, taskExecution, isSelected, getContextMen
             }),
             getContextMenuItems && /*#__PURE__*/ jsx(TaskMenu, {
                 ref: menuRef,
-                taskId: task.id,
+                task: task,
                 getContextMenuItems: getContextMenuItems,
                 disabled: isTaskLoading
             })

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

@@ -34,8 +34,7 @@ const external_react_namespaceObject = require("react");
 const external_StageNode_styles_cjs_namespaceObject = require("./StageNode.styles.cjs");
 const external_TaskContent_cjs_namespaceObject = require("./TaskContent.cjs");
 const external_TaskMenu_cjs_namespaceObject = require("./TaskMenu.cjs");
-const DraggableTaskComponent = ({ task, taskExecution, isSelected, isParallel, groupIndex, taskIndex, getContextMenuItems, onTaskClick, isDragDisabled, projectedDepth, isTaskLoading })=>{
-    const zoom = (0, react_cjs_namespaceObject.useStore)((s)=>s.transform[2]);
+const DraggableTaskComponent = ({ task, taskExecution, isSelected, isParallel, getContextMenuItems, onTaskClick, isDragDisabled, projectedDepth, isTaskLoading })=>{
     const taskRef = (0, external_react_namespaceObject.useRef)(null);
     const menuRef = (0, external_react_namespaceObject.useRef)(null);
     const handleClick = (0, external_react_namespaceObject.useCallback)((e)=>{
@@ -47,19 +46,11 @@ const DraggableTaskComponent = ({ task, taskExecution, isSelected, isParallel, g
     const handleContextMenu = (0, external_react_namespaceObject.useCallback)((e)=>{
         menuRef.current?.handleContextMenu(e);
     }, []);
-    const handleGetContextMenuItems = (0, external_react_namespaceObject.useCallback)(()=>{
-        if (!getContextMenuItems) return [];
-        return getContextMenuItems(groupIndex, taskIndex, task.id);
-    }, [
-        getContextMenuItems,
-        groupIndex,
-        taskIndex,
-        task.id
-    ]);
     const { attributes, listeners, setNodeRef, transition, transform, isDragging } = (0, sortable_namespaceObject.useSortable)({
         id: task.id,
         disabled: isDragDisabled
     });
+    const zoom = (0, react_cjs_namespaceObject.useStore)((s)=>transform ? s.transform[2] : 1);
     const style = (0, external_react_namespaceObject.useMemo)(()=>{
         const scaledTransform = transform ? {
             ...transform,
@@ -112,8 +103,8 @@ const DraggableTaskComponent = ({ task, taskExecution, isSelected, isParallel, g
             }),
             getContextMenuItems && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_TaskMenu_cjs_namespaceObject.TaskMenu, {
                 ref: menuRef,
-                taskId: task.id,
-                getContextMenuItems: handleGetContextMenuItems,
+                task: task,
+                getContextMenuItems: getContextMenuItems,
                 disabled: isTaskLoading
             })
         ]

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

@@ -1,3 +1,3 @@
 import type { DraggableTaskProps } from './DraggableTask.types';
-export declare const DraggableTask: import("react").MemoExoticComponent<({ task, taskExecution, isSelected, isParallel, groupIndex, taskIndex, getContextMenuItems, onTaskClick, isDragDisabled, projectedDepth, isTaskLoading, }: DraggableTaskProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const DraggableTask: import("react").MemoExoticComponent<({ task, taskExecution, isSelected, isParallel, getContextMenuItems, onTaskClick, isDragDisabled, projectedDepth, isTaskLoading, }: DraggableTaskProps) => import("react/jsx-runtime").JSX.Element>;
 //# sourceMappingURL=DraggableTask.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"DraggableTask.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/DraggableTask.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AA4HhE,eAAO,MAAM,aAAa,iMArGvB,kBAAkB,6CAqGoC,CAAC"}
+{"version":3,"file":"DraggableTask.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/DraggableTask.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAuHhE,eAAO,MAAM,aAAa,0KAlGvB,kBAAkB,6CAkGoC,CAAC"}

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

@@ -6,8 +6,7 @@ import { memo, useCallback, useMemo, useRef } from "react";
 import { INDENTATION_WIDTH, StageTask, StageTaskDragPlaceholder, StageTaskDragPlaceholderWrapper, StageTaskWrapper } from "./StageNode.styles.js";
 import { TaskContent } from "./TaskContent.js";
 import { TaskMenu } from "./TaskMenu.js";
-const DraggableTaskComponent = ({ task, taskExecution, isSelected, isParallel, groupIndex, taskIndex, getContextMenuItems, onTaskClick, isDragDisabled, projectedDepth, isTaskLoading })=>{
-    const zoom = useStore((s)=>s.transform[2]);
+const DraggableTaskComponent = ({ task, taskExecution, isSelected, isParallel, getContextMenuItems, onTaskClick, isDragDisabled, projectedDepth, isTaskLoading })=>{
     const taskRef = useRef(null);
     const menuRef = useRef(null);
     const handleClick = useCallback((e)=>{
@@ -19,19 +18,11 @@ const DraggableTaskComponent = ({ task, taskExecution, isSelected, isParallel, g
     const handleContextMenu = useCallback((e)=>{
         menuRef.current?.handleContextMenu(e);
     }, []);
-    const handleGetContextMenuItems = useCallback(()=>{
-        if (!getContextMenuItems) return [];
-        return getContextMenuItems(groupIndex, taskIndex, task.id);
-    }, [
-        getContextMenuItems,
-        groupIndex,
-        taskIndex,
-        task.id
-    ]);
     const { attributes, listeners, setNodeRef, transition, transform, isDragging } = useSortable({
         id: task.id,
         disabled: isDragDisabled
     });
+    const zoom = useStore((s)=>transform ? s.transform[2] : 1);
     const style = useMemo(()=>{
         const scaledTransform = transform ? {
             ...transform,
@@ -84,8 +75,8 @@ const DraggableTaskComponent = ({ task, taskExecution, isSelected, isParallel, g
             }),
             getContextMenuItems && /*#__PURE__*/ jsx(TaskMenu, {
                 ref: menuRef,
-                taskId: task.id,
-                getContextMenuItems: handleGetContextMenuItems,
+                task: task,
+                getContextMenuItems: getContextMenuItems,
                 disabled: isTaskLoading
             })
         ]

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

@@ -5,9 +5,7 @@ export interface DraggableTaskProps {
     taskExecution?: StageTaskExecution;
     isSelected: boolean;
     isParallel: boolean;
-    groupIndex: number;
-    taskIndex: number;
-    getContextMenuItems?: (groupIndex: number, taskIndex: number, taskId: string) => NodeMenuItem[];
+    getContextMenuItems?: (task: StageTaskItem) => NodeMenuItem[];
     onTaskClick: (e: React.MouseEvent, taskId: string) => void;
     onTaskPlay?: (taskId: string) => Promise<void>;
     isDragDisabled?: boolean;

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

@@ -1 +1 @@
-{"version":3,"file":"DraggableTask.types.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/DraggableTask.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AACvD,OAAO,KAAK,EAAE,kBAAkB,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAE3E,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,aAAa,CAAC;IACpB,aAAa,CAAC,EAAE,kBAAkB,CAAC;IACnC,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;IAClB,mBAAmB,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,YAAY,EAAE,CAAC;IAChG,WAAW,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3D,UAAU,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC/C,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB"}
+{"version":3,"file":"DraggableTask.types.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/DraggableTask.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AACvD,OAAO,KAAK,EAAE,kBAAkB,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAE3E,MAAM,WAAW,kBAAkB;IACjC,IAAI,EAAE,aAAa,CAAC;IACpB,aAAa,CAAC,EAAE,kBAAkB,CAAC;IACnC,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,EAAE,OAAO,CAAC;IAGpB,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,aAAa,KAAK,YAAY,EAAE,CAAC;IAC9D,WAAW,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3D,UAAU,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IAC/C,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB"}

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

@@ -60,7 +60,7 @@ const EventDrivenTaskItemComponent = ({ task, taskExecution, isSelected, getCont
             }),
             getContextMenuItems && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_TaskMenu_cjs_namespaceObject.TaskMenu, {
                 ref: menuRef,
-                taskId: task.id,
+                task: task,
                 getContextMenuItems: getContextMenuItems,
                 disabled: isTaskLoading
             })

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

@@ -4,7 +4,7 @@ interface EventDrivenTaskItemProps {
     task: StageTaskItem;
     taskExecution?: StageTaskExecution;
     isSelected: boolean;
-    getContextMenuItems?: () => NodeMenuItem[];
+    getContextMenuItems?: (task: StageTaskItem) => NodeMenuItem[];
     onTaskClick: (e: React.MouseEvent, taskId: string) => void;
     isTaskLoading?: boolean;
 }

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

@@ -1 +1 @@
-{"version":3,"file":"EventDrivenTask.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/EventDrivenTask.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAEvD,OAAO,KAAK,EAAE,kBAAkB,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAI3E,UAAU,wBAAwB;IAChC,IAAI,EAAE,aAAa,CAAC;IACpB,aAAa,CAAC,EAAE,kBAAkB,CAAC;IACnC,UAAU,EAAE,OAAO,CAAC;IACpB,mBAAmB,CAAC,EAAE,MAAM,YAAY,EAAE,CAAC;IAC3C,WAAW,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3D,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAgDD,eAAO,MAAM,mBAAmB,8HAvC7B,wBAAwB,6CAuC0C,CAAC"}
+{"version":3,"file":"EventDrivenTask.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/EventDrivenTask.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAEvD,OAAO,KAAK,EAAE,kBAAkB,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAI3E,UAAU,wBAAwB;IAChC,IAAI,EAAE,aAAa,CAAC;IACpB,aAAa,CAAC,EAAE,kBAAkB,CAAC;IACnC,UAAU,EAAE,OAAO,CAAC;IAGpB,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,aAAa,KAAK,YAAY,EAAE,CAAC;IAC9D,WAAW,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,UAAU,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3D,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB;AAgDD,eAAO,MAAM,mBAAmB,8HAvC7B,wBAAwB,6CAuC0C,CAAC"}

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

@@ -32,7 +32,7 @@ const EventDrivenTaskItemComponent = ({ task, taskExecution, isSelected, getCont
             }),
             getContextMenuItems && /*#__PURE__*/ jsx(TaskMenu, {
                 ref: menuRef,
-                taskId: task.id,
+                task: task,
                 getContextMenuItems: getContextMenuItems,
                 disabled: isTaskLoading
             })

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

@@ -84,7 +84,10 @@ function StageEdgeInner({ geometry, sourcePosition, targetPosition, selected, st
         targetPosition,
         borderRadius: 40
     });
-    const { endX, endY, angle } = getArrowFromBezier(pathData, arrowSize);
+    const { endX, endY, angle } = (0, external_react_namespaceObject.useMemo)(()=>getArrowFromBezier(pathData, arrowSize), [
+        pathData,
+        arrowSize
+    ]);
     const arrowLineLength = arrowSize;
     const strokeColor = selected ? 'var(--canvas-selection-indicator)' : stroke;
     const strokeWidthValue = selected ? strokeWidth + 1 : strokeWidth;

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

@@ -1 +1 @@
-{"version":3,"file":"StageEdge.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageEdge.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAkB,MAAM,0CAA0C,CAAC;AAQ1F,eAAO,MAAM,cAAc;;;yGAgB1B,CAAC;AAEF,KAAK,KAAK,GAAG,SAAS,GAAG;IACvB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AA4HF,iBAAS,kBAAkB,CAAC,EAC1B,OAAO,EACP,OAAO,EACP,OAAO,EACP,OAAO,EACP,cAAc,EACd,cAAc,EACd,QAAQ,EACR,KAAK,EACL,MAAM,EACN,WAAW,EACX,SAAS,EACT,GAAG,IAAI,EACR,EAAE,KAAK,2CA0BP;AAED,eAAO,MAAM,SAAS,gEAA2B,CAAC"}
+{"version":3,"file":"StageEdge.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageEdge.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAkB,MAAM,0CAA0C,CAAC;AAQ1F,eAAO,MAAM,cAAc;;;yGAgB1B,CAAC;AAEF,KAAK,KAAK,GAAG,SAAS,GAAG;IACvB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAkIF,iBAAS,kBAAkB,CAAC,EAC1B,OAAO,EACP,OAAO,EACP,OAAO,EACP,OAAO,EACP,cAAc,EACd,cAAc,EACd,QAAQ,EACR,KAAK,EACL,MAAM,EACN,WAAW,EACX,SAAS,EACT,GAAG,IAAI,EACR,EAAE,KAAK,2CA0BP;AAED,eAAO,MAAM,SAAS,gEAA2B,CAAC"}

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

@@ -1,7 +1,7 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import styled from "@emotion/styled";
 import { EdgeLabelRenderer, getSmoothStepPath, useStore } from "../../xyflow/react.js";
-import { memo } from "react";
+import { memo, useMemo } from "react";
 const StageEdgeLabel = styled.div`
   position: absolute;
   color: var(--canvas-foreground);
@@ -45,7 +45,10 @@ function StageEdgeInner({ geometry, sourcePosition, targetPosition, selected, st
         targetPosition,
         borderRadius: 40
     });
-    const { endX, endY, angle } = getArrowFromBezier(pathData, arrowSize);
+    const { endX, endY, angle } = useMemo(()=>getArrowFromBezier(pathData, arrowSize), [
+        pathData,
+        arrowSize
+    ]);
     const arrowLineLength = arrowSize;
     const strokeColor = selected ? 'var(--canvas-selection-indicator)' : stroke;
     const strokeWidthValue = selected ? strokeWidth + 1 : strokeWidth;

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

@@ -120,6 +120,8 @@ const StageNodeInner = (props)=>{
         setSelectedNodeId,
         id
     ]);
+    const handleAddTaskToolboxClose = (0, external_react_namespaceObject.useCallback)(()=>setIsAddingTask(false), []);
+    const handleReplaceTaskToolboxClose = (0, external_react_namespaceObject.useCallback)(()=>setIsReplacingTask(false), []);
     const handleReplaceTaskToolboxItemSelected = (0, external_react_namespaceObject.useCallback)((item)=>{
         onReplaceTaskFromToolbox?.(item, taskStateReference.current.groupIndex, taskStateReference.current.taskIndex);
         setIsReplacingTask(false);
@@ -134,9 +136,7 @@ const StageNodeInner = (props)=>{
     ]);
     return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
         "data-testid": `stage-${id}`,
-        style: {
-            position: 'relative'
-        },
+        className: "relative",
         onClick: handleStageClick,
         onMouseEnter: handleMouseEnter,
         onMouseLeave: handleMouseLeave,
@@ -165,26 +165,24 @@ const StageNodeInner = (props)=>{
                     })
                 ]
             }),
-            onAddTaskFromToolbox && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_cjs_namespaceObject.FloatingCanvasPanel, {
-                open: isAddingTask,
+            onAddTaskFromToolbox && isAddingTask && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_cjs_namespaceObject.FloatingCanvasPanel, {
                 nodeId: id,
                 offset: 15,
                 children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_Toolbox_index_cjs_namespaceObject.Toolbox, {
                     title: labels.addTask,
                     initialItems: taskOptions,
-                    onClose: ()=>setIsAddingTask(false),
+                    onClose: handleAddTaskToolboxClose,
                     onItemSelect: handleAddTaskToolboxItemSelected,
                     onSearch: onTaskToolboxSearch
                 })
             }),
-            onReplaceTaskFromToolbox && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_cjs_namespaceObject.FloatingCanvasPanel, {
-                open: isReplacingTask,
+            onReplaceTaskFromToolbox && isReplacingTask && /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(index_cjs_namespaceObject.FloatingCanvasPanel, {
                 nodeId: id,
                 offset: 15,
                 children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_Toolbox_index_cjs_namespaceObject.Toolbox, {
                     title: labels.replaceTask,
                     initialItems: taskOptions,
-                    onClose: ()=>setIsReplacingTask(false),
+                    onClose: handleReplaceTaskToolboxClose,
                     onItemSelect: handleReplaceTaskToolboxItemSelected,
                     onSearch: onTaskToolboxSearch
                 })

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

@@ -1 +1 @@
-{"version":3,"file":"StageNode.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageNode.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,cAAc,EAAsB,MAAM,mBAAmB,CAAC;AAgM5E,eAAO,MAAM,SAAS,8CA1LS,cAAc,6CA0LmC,CAAC"}
+{"version":3,"file":"StageNode.d.ts","sourceRoot":"","sources":["../../../../src/canvas/components/StageNode/StageNode.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,cAAc,EAAsB,MAAM,mBAAmB,CAAC;AAsM5E,eAAO,MAAM,SAAS,8CAhMS,cAAc,6CAgMmC,CAAC"}

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

@@ -92,6 +92,8 @@ const StageNodeInner = (props)=>{
         setSelectedNodeId,
         id
     ]);
+    const handleAddTaskToolboxClose = useCallback(()=>setIsAddingTask(false), []);
+    const handleReplaceTaskToolboxClose = useCallback(()=>setIsReplacingTask(false), []);
     const handleReplaceTaskToolboxItemSelected = useCallback((item)=>{
         onReplaceTaskFromToolbox?.(item, taskStateReference.current.groupIndex, taskStateReference.current.taskIndex);
         setIsReplacingTask(false);
@@ -106,9 +108,7 @@ const StageNodeInner = (props)=>{
     ]);
     return /*#__PURE__*/ jsxs("div", {
         "data-testid": `stage-${id}`,
-        style: {
-            position: 'relative'
-        },
+        className: "relative",
         onClick: handleStageClick,
         onMouseEnter: handleMouseEnter,
         onMouseLeave: handleMouseLeave,
@@ -137,26 +137,24 @@ const StageNodeInner = (props)=>{
                     })
                 ]
             }),
-            onAddTaskFromToolbox && /*#__PURE__*/ jsx(FloatingCanvasPanel, {
-                open: isAddingTask,
+            onAddTaskFromToolbox && isAddingTask && /*#__PURE__*/ jsx(FloatingCanvasPanel, {
                 nodeId: id,
                 offset: 15,
                 children: /*#__PURE__*/ jsx(Toolbox, {
                     title: labels.addTask,
                     initialItems: taskOptions,
-                    onClose: ()=>setIsAddingTask(false),
+                    onClose: handleAddTaskToolboxClose,
                     onItemSelect: handleAddTaskToolboxItemSelected,
                     onSearch: onTaskToolboxSearch
                 })
             }),
-            onReplaceTaskFromToolbox && /*#__PURE__*/ jsx(FloatingCanvasPanel, {
-                open: isReplacingTask,
+            onReplaceTaskFromToolbox && isReplacingTask && /*#__PURE__*/ jsx(FloatingCanvasPanel, {
                 nodeId: id,
                 offset: 15,
                 children: /*#__PURE__*/ jsx(Toolbox, {
                     title: labels.replaceTask,
                     initialItems: taskOptions,
-                    onClose: ()=>setIsReplacingTask(false),
+                    onClose: handleReplaceTaskToolboxClose,
                     onItemSelect: handleReplaceTaskToolboxItemSelected,
                     onSearch: onTaskToolboxSearch
                 })