flow-lib-creomnia 1.0.16 → 1.0.17-dev.1

package/lib/modules/common/components/HorizontalDrawer/index.js

@@ -26,22 +26,37 @@ const HorizontalDrawer = ({ Content, HeaderContent, open, onClose }) => {
             return "40%";
         return "35%";
     };
-    const handleDrag = (event) => {
-        const maxWidthPercent = 90;
-        const minWidthPercent = 30;
-        const newWidthPercent = ((window.innerWidth - event.clientX) * 100) / window.innerWidth;
-        if (newWidthPercent < minWidthPercent || newWidthPercent > maxWidthPercent) {
-            return;
-        }
-        setDrawerWidth(`${newWidthPercent}%`);
-    };
     const DraggerElement = () => {
         return ((0, jsx_runtime_1.jsx)(material_1.Box, { onMouseDown: (e) => {
                 e.preventDefault();
-                window.addEventListener("mousemove", handleDrag);
-                window.addEventListener("mouseup", () => {
-                    window.removeEventListener("mousemove", handleDrag);
-                });
+                // Capture the drawer paper + its positioned host (canvas
+                // Box) at drag start. We can't rely on `event.target` during
+                // mousemove because the cursor is over the canvas, not the
+                // drawer; closing over `host` here keeps the math correct
+                // both in the main editor (host = NodesFlow Box ≈ viewport)
+                // and inside a modal (host = the same canvas Box, just
+                // rendered inside a smaller window).
+                const dragger = e.currentTarget;
+                const drawerEl = dragger.closest(".MuiDrawer-paper");
+                const host = drawerEl?.parentElement;
+                const onMove = (ev) => {
+                    const rect = host?.getBoundingClientRect();
+                    const hostRight = rect?.right ?? window.innerWidth;
+                    const hostWidth = rect?.width ?? window.innerWidth;
+                    const maxWidthPercent = 90;
+                    const minWidthPercent = 30;
+                    const newWidthPercent = ((hostRight - ev.clientX) * 100) / hostWidth;
+                    if (newWidthPercent < minWidthPercent || newWidthPercent > maxWidthPercent) {
+                        return;
+                    }
+                    setDrawerWidth(`${newWidthPercent}%`);
+                };
+                const onUp = () => {
+                    window.removeEventListener("mousemove", onMove);
+                    window.removeEventListener("mouseup", onUp);
+                };
+                window.addEventListener("mousemove", onMove);
+                window.addEventListener("mouseup", onUp);
             }, sx: {
                 display: "flex",
                 alignItems: "center",
@@ -55,10 +70,18 @@ const HorizontalDrawer = ({ Content, HeaderContent, open, onClose }) => {
     };
     return ((0, jsx_runtime_1.jsx)(material_1.Drawer, { variant: "persistent", open: open, anchor: "right", sx: {
             flexShrink: 0,
+            // Anchor paper to its positioned ancestor (the NodesFlow Box,
+            // which sets `position: relative`) rather than the viewport.
+            // The top offset is read from `--drawer-top-offset` so the
+            // main flow editor can leave room for the app header (66px,
+            // default), while a host like `ToolFlowConfigModal` can set
+            // it to `0` and have the drawer fill the entire canvas.
             "& .MuiDrawer-paper": {
+                position: "absolute",
                 width: drawerWidth || getDefaultWidth(),
-                height: "calc(100% - 66px)",
-                marginTop: "66px",
+                height: "calc(100% - var(--drawer-top-offset, 66px))",
+                marginTop: "var(--drawer-top-offset, 66px)",
+                right: 0,
                 borderTopLeftRadius: "16px",
                 boxShadow: "0px 9px 46px 0px #00000014",
                 border: "none",

package/lib/modules/flow/components/NodesFlow/index.js

@@ -31,6 +31,6 @@ const NodesFlow = ({ theme, nodes, menuTabs, addNewNodeCallback, permissions, dr
         addNewNodeCallback,
     }), [nodeDrawers, menuTabs, addNewNodeCallback, processedNodeIds]);
     const containerRef = (0, react_1.useRef)(null);
-    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: permissions.canRead && ((0, jsx_runtime_1.jsx)(ThemeContext_1.ThemeContextProvider, { themContextValue: theme, children: (0, jsx_runtime_1.jsx)(react_dnd_1.DndProvider, { backend: react_dnd_html5_backend_1.HTML5Backend, children: (0, jsx_runtime_1.jsx)(material_1.Box, { ref: containerRef, style: { height: "100%", width: "100%", background: theme?.palette.background.default || colors_1.Colors.DIRTY_WHITE }, children: (0, jsx_runtime_1.jsx)(SettingsContext_1.NodeSettingsProvider, { permissions: permissions, drawerProps: drawerProps, children: (0, jsx_runtime_1.jsx)(FlowPosition_1.FlowPositionProvider, { children: (0, jsx_runtime_1.jsx)(FlowSandbox_1.default, { permissions: permissions, connectionDrawers: connectionDrawers, nodeDrawers: nodeDrawers, containerRef: containerRef, processedNodeIds: processedNodeIds, failedNodeId: failedNodeId, failedNodeColor: failedNodeColor, onRedirect: onRedirect, onUpdateNodePosition: onUpdateNodePosition, emptyMenuItemsComponent: emptyMenuItemsComponent, searchPlaceholder: searchPlaceholder }) }) }) }) }) })) }));
+    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: permissions.canRead && ((0, jsx_runtime_1.jsx)(ThemeContext_1.ThemeContextProvider, { themContextValue: theme, children: (0, jsx_runtime_1.jsx)(react_dnd_1.DndProvider, { backend: react_dnd_html5_backend_1.HTML5Backend, children: (0, jsx_runtime_1.jsx)(material_1.Box, { ref: containerRef, style: { position: "relative", height: "100%", width: "100%", background: theme?.palette.background.default || colors_1.Colors.DIRTY_WHITE }, children: (0, jsx_runtime_1.jsx)(SettingsContext_1.NodeSettingsProvider, { permissions: permissions, drawerProps: drawerProps, children: (0, jsx_runtime_1.jsx)(FlowPosition_1.FlowPositionProvider, { children: (0, jsx_runtime_1.jsx)(FlowSandbox_1.default, { permissions: permissions, connectionDrawers: connectionDrawers, nodeDrawers: nodeDrawers, containerRef: containerRef, processedNodeIds: processedNodeIds, failedNodeId: failedNodeId, failedNodeColor: failedNodeColor, onRedirect: onRedirect, onUpdateNodePosition: onUpdateNodePosition, emptyMenuItemsComponent: emptyMenuItemsComponent, searchPlaceholder: searchPlaceholder }) }) }) }) }) })) }));
 };
 exports.default = NodesFlow;

package/lib/modules/node/contexts/SettingsContext/index.js

@@ -48,8 +48,13 @@ const NodeSettingsProvider = ({ children, permissions: { canUpdate, canDelete },
         }, config_1.Config.CLEAR_NODE_DELAY);
     };
     const onSaveNode = async () => {
+        // `onSave` is allowed to be sync OR async — host apps that wrap a
+        // server call in an async handler need to surface validation errors
+        // BEFORE the drawer closes. Awaiting handles both cases: a sync
+        // `false` short-circuits, a `Promise<false>` resolves and short-
+        // circuits, anything else closes the drawer.
         const result = await node?.settings?.footer?.onSave?.(node?.id);
-        if (result !== true)
+        if (result === false)
             return;
         handleClose();
     };

package/lib/modules/node/enums/index.d.ts

@@ -8,5 +8,6 @@ export declare enum NodeTypeEnum {
 }
 export declare enum NodeMenuItemType {
     EXTENSION = "extension",
-    AI_AGENT = "ai-agent"
+    AI_AGENT = "ai-agent",
+    S2S_AGENT = "s2s-agent"
 }

package/lib/modules/node/enums/index.js

@@ -14,4 +14,5 @@ var NodeMenuItemType;
 (function (NodeMenuItemType) {
     NodeMenuItemType["EXTENSION"] = "extension";
     NodeMenuItemType["AI_AGENT"] = "ai-agent";
+    NodeMenuItemType["S2S_AGENT"] = "s2s-agent";
 })(NodeMenuItemType || (exports.NodeMenuItemType = NodeMenuItemType = {}));

package/lib/modules/node/types/index.d.ts

@@ -5,7 +5,7 @@ export type NodesFooterType = {
     saveText?: string;
     cancelText?: string;
     deleteText?: string;
-    onSave?: (nodeId: string) => void | boolean | Promise<void | boolean>;
+    onSave?: (nodeId: string) => void | false;
     onCancel?: (nodeId: string) => void;
     onDelete?: (nodeId: string) => void;
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "flow-lib-creomnia",
-  "version": "1.0.16",
+  "version": "1.0.17-dev.1",
   "description": "",
   "main": "lib/index.js",
   "types": "lib/index.d.ts",