@uipath/apollo-react 4.12.0 → 4.12.1-pr556.9394355

package/dist/canvas/utils/createPreviewGraph.cjs

@@ -0,0 +1,94 @@
+"use strict";
+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, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    PREVIEW_EDGE_STYLE: ()=>PREVIEW_EDGE_STYLE,
+    createPreviewGraph: ()=>createPreviewGraph,
+    reparentPreviewNodeToContainer: ()=>reparentPreviewNodeToContainer,
+    inferParentId: ()=>inferParentId
+});
+const external_constants_cjs_namespaceObject = require("../constants.cjs");
+const external_NodeUtils_cjs_namespaceObject = require("./NodeUtils.cjs");
+const PREVIEW_EDGE_STYLE = {
+    strokeDasharray: '5,5',
+    opacity: 0.8,
+    stroke: 'var(--canvas-selection-indicator)',
+    strokeWidth: 2
+};
+function inferParentId(sourceId, targetId, nodes) {
+    const sourceNode = nodes.find((node)=>node.id === sourceId);
+    const targetNode = nodes.find((node)=>node.id === targetId);
+    if (!sourceNode || !targetNode) return;
+    if (sourceNode.parentId && sourceNode.parentId === targetNode.parentId) return sourceNode.parentId;
+    if (targetNode.parentId && targetNode.parentId === sourceNode.id) return sourceNode.id;
+    if (sourceNode.parentId && sourceNode.parentId === targetNode.id) return targetNode.id;
+}
+function reparentPreviewNodeToContainer(previewNode, containerId, reactFlowInstance) {
+    const containerNode = reactFlowInstance.getNode(containerId);
+    if (!containerNode) return null;
+    const containerAbsolutePosition = (0, external_NodeUtils_cjs_namespaceObject.getAbsolutePosition)(containerNode, reactFlowInstance.getNodes());
+    return {
+        ...previewNode,
+        position: {
+            x: previewNode.position.x - containerAbsolutePosition.x,
+            y: previewNode.position.y - containerAbsolutePosition.y
+        },
+        parentId: containerId,
+        extent: 'parent'
+    };
+}
+function createPreviewGraph({ preview, target, targetHandleId, reactFlowInstance, containerId, removedEdgeIds, trailingEdgeId = `${external_constants_cjs_namespaceObject.PREVIEW_NODE_ID}-${target}`, trailingEdgeStyle = PREVIEW_EDGE_STYLE }) {
+    const previewNode = containerId ? reparentPreviewNodeToContainer(preview.node, containerId, reactFlowInstance) : preview.node;
+    if (!previewNode) return null;
+    return {
+        node: previewNode,
+        edges: [
+            preview.edge,
+            {
+                id: trailingEdgeId,
+                source: external_constants_cjs_namespaceObject.PREVIEW_NODE_ID,
+                sourceHandle: 'output',
+                target,
+                targetHandle: targetHandleId,
+                type: 'default',
+                style: trailingEdgeStyle
+            }
+        ],
+        removedEdgeIds
+    };
+}
+exports.PREVIEW_EDGE_STYLE = __webpack_exports__.PREVIEW_EDGE_STYLE;
+exports.createPreviewGraph = __webpack_exports__.createPreviewGraph;
+exports.inferParentId = __webpack_exports__.inferParentId;
+exports.reparentPreviewNodeToContainer = __webpack_exports__.reparentPreviewNodeToContainer;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "PREVIEW_EDGE_STYLE",
+    "createPreviewGraph",
+    "inferParentId",
+    "reparentPreviewNodeToContainer"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});

package/dist/canvas/utils/createPreviewGraph.d.ts

@@ -0,0 +1,24 @@
+import { type Edge, type Node, type ReactFlowInstance } from '../xyflow/react.ts';
+export interface PreviewGraph {
+    node: Node;
+    edges: Edge[];
+    removedEdgeIds?: string[];
+}
+export declare const PREVIEW_EDGE_STYLE: Edge['style'];
+export interface CreatePreviewGraphOptions {
+    preview: {
+        node: Node;
+        edge: Edge;
+    };
+    target: string;
+    targetHandleId?: string | null;
+    reactFlowInstance: ReactFlowInstance;
+    containerId?: string;
+    removedEdgeIds?: string[];
+    trailingEdgeId?: string;
+    trailingEdgeStyle?: Edge['style'];
+}
+export declare function inferParentId(sourceId: string, targetId: string, nodes: Node[]): string | undefined;
+export declare function reparentPreviewNodeToContainer(previewNode: Node, containerId: string, reactFlowInstance: ReactFlowInstance): Node | null;
+export declare function createPreviewGraph({ preview, target, targetHandleId, reactFlowInstance, containerId, removedEdgeIds, trailingEdgeId, trailingEdgeStyle, }: CreatePreviewGraphOptions): PreviewGraph | null;
+//# sourceMappingURL=createPreviewGraph.d.ts.map

package/dist/canvas/utils/createPreviewGraph.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createPreviewGraph.d.ts","sourceRoot":"","sources":["../../../src/canvas/utils/createPreviewGraph.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,IAAI,EACT,KAAK,IAAI,EACT,KAAK,iBAAiB,EACvB,MAAM,0CAA0C,CAAC;AAIlD,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,IAAI,CAAC;IACX,KAAK,EAAE,IAAI,EAAE,CAAC;IACd,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;CAC3B;AAED,eAAO,MAAM,kBAAkB,EAAE,IAAI,CAAC,OAAO,CAK5C,CAAC;AAEF,MAAM,WAAW,yBAAyB;IACxC,OAAO,EAAE;QAAE,IAAI,EAAE,IAAI,CAAC;QAAC,IAAI,EAAE,IAAI,CAAA;KAAE,CAAC;IACpC,MAAM,EAAE,MAAM,CAAC;IACf,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B,iBAAiB,EAAE,iBAAiB,CAAC;IACrC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,EAAE,CAAC;IAC1B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,iBAAiB,CAAC,EAAE,IAAI,CAAC,OAAO,CAAC,CAAC;CACnC;AAED,wBAAgB,aAAa,CAC3B,QAAQ,EAAE,MAAM,EAChB,QAAQ,EAAE,MAAM,EAChB,KAAK,EAAE,IAAI,EAAE,GACZ,MAAM,GAAG,SAAS,CAkBpB;AAED,wBAAgB,8BAA8B,CAC5C,WAAW,EAAE,IAAI,EACjB,WAAW,EAAE,MAAM,EACnB,iBAAiB,EAAE,iBAAiB,GACnC,IAAI,GAAG,IAAI,CAoBb;AAED,wBAAgB,kBAAkB,CAAC,EACjC,OAAO,EACP,MAAM,EACN,cAAc,EACd,iBAAiB,EACjB,WAAW,EACX,cAAc,EACd,cAA+C,EAC/C,iBAAsC,GACvC,EAAE,yBAAyB,GAAG,YAAY,GAAG,IAAI,CAuBjD"}

package/dist/canvas/utils/createPreviewGraph.js

@@ -0,0 +1,51 @@
+import { PREVIEW_NODE_ID } from "../constants.js";
+import { getAbsolutePosition } from "./NodeUtils.js";
+const PREVIEW_EDGE_STYLE = {
+    strokeDasharray: '5,5',
+    opacity: 0.8,
+    stroke: 'var(--canvas-selection-indicator)',
+    strokeWidth: 2
+};
+function inferParentId(sourceId, targetId, nodes) {
+    const sourceNode = nodes.find((node)=>node.id === sourceId);
+    const targetNode = nodes.find((node)=>node.id === targetId);
+    if (!sourceNode || !targetNode) return;
+    if (sourceNode.parentId && sourceNode.parentId === targetNode.parentId) return sourceNode.parentId;
+    if (targetNode.parentId && targetNode.parentId === sourceNode.id) return sourceNode.id;
+    if (sourceNode.parentId && sourceNode.parentId === targetNode.id) return targetNode.id;
+}
+function reparentPreviewNodeToContainer(previewNode, containerId, reactFlowInstance) {
+    const containerNode = reactFlowInstance.getNode(containerId);
+    if (!containerNode) return null;
+    const containerAbsolutePosition = getAbsolutePosition(containerNode, reactFlowInstance.getNodes());
+    return {
+        ...previewNode,
+        position: {
+            x: previewNode.position.x - containerAbsolutePosition.x,
+            y: previewNode.position.y - containerAbsolutePosition.y
+        },
+        parentId: containerId,
+        extent: 'parent'
+    };
+}
+function createPreviewGraph({ preview, target, targetHandleId, reactFlowInstance, containerId, removedEdgeIds, trailingEdgeId = `${PREVIEW_NODE_ID}-${target}`, trailingEdgeStyle = PREVIEW_EDGE_STYLE }) {
+    const previewNode = containerId ? reparentPreviewNodeToContainer(preview.node, containerId, reactFlowInstance) : preview.node;
+    if (!previewNode) return null;
+    return {
+        node: previewNode,
+        edges: [
+            preview.edge,
+            {
+                id: trailingEdgeId,
+                source: PREVIEW_NODE_ID,
+                sourceHandle: 'output',
+                target,
+                targetHandle: targetHandleId,
+                type: 'default',
+                style: trailingEdgeStyle
+            }
+        ],
+        removedEdgeIds
+    };
+}
+export { PREVIEW_EDGE_STYLE, createPreviewGraph, inferParentId, reparentPreviewNodeToContainer };

package/dist/canvas/utils/createPreviewNode.cjs

@@ -24,12 +24,15 @@ var __webpack_require__ = {};
 var __webpack_exports__ = {};
 __webpack_require__.r(__webpack_exports__);
 __webpack_require__.d(__webpack_exports__, {
-    applyPreviewToReactFlow: ()=>applyPreviewToReactFlow,
+    applyPreviewGraphToReactFlow: ()=>applyPreviewGraphToReactFlow,
     removePreviewFromReactFlow: ()=>removePreviewFromReactFlow,
+    applyPreviewToReactFlow: ()=>applyPreviewToReactFlow,
+    getOppositePosition: ()=>getOppositePosition,
     createPreviewNode: ()=>createPreviewNode
 });
 const react_cjs_namespaceObject = require("../xyflow/react.cjs");
 const external_constants_cjs_namespaceObject = require("../constants.cjs");
+const external_createPreviewGraph_cjs_namespaceObject = require("./createPreviewGraph.cjs");
 const external_NodeUtils_cjs_namespaceObject = require("./NodeUtils.cjs");
 function getOppositePosition(position) {
     switch(position){
@@ -74,6 +77,12 @@ function calculatePositionFromDrop(dropPosition, handlePosition, previewNodeSize
             };
     }
 }
+function calculateCenteredPosition(centerPosition, previewNodeSize) {
+    return {
+        x: centerPosition.x - previewNodeSize.width / 2,
+        y: centerPosition.y - previewNodeSize.height / 2
+    };
+}
 function computeSpreadOffset(handle, size) {
     const index = handle?.index ?? null;
     const count = handle?.count ?? 1;
@@ -139,7 +148,7 @@ function calculateAutoPosition(sourceNode, handlePosition, previewNodeSize, exis
 function createPreviewNode(sourceNodeId, sourceHandleId, reactFlowInstance, position, data, sourceHandleType = 'source', previewNodeSize = {
     width: external_constants_cjs_namespaceObject.DEFAULT_NODE_SIZE,
     height: external_constants_cjs_namespaceObject.DEFAULT_NODE_SIZE
-}, handlePosition = react_cjs_namespaceObject.Position.Right, ignoredNodeTypes = []) {
+}, handlePosition = react_cjs_namespaceObject.Position.Right, ignoredNodeTypes = [], positionMode = 'drop') {
     const sourceNode = reactFlowInstance.getNode(sourceNodeId);
     if (!sourceNode) {
         console.warn(`Source node ${sourceNodeId} not found`);
@@ -149,7 +158,7 @@ function createPreviewNode(sourceNodeId, sourceHandleId, reactFlowInstance, posi
     const existingNodes = reactFlowInstance.getNodes().filter((n)=>n.id !== external_constants_cjs_namespaceObject.PREVIEW_NODE_ID);
     const internalNode = void 0 === position ? reactFlowInstance.getInternalNode(sourceNodeId) : void 0;
     const handle = internalNode ? (0, external_NodeUtils_cjs_namespaceObject.resolveHandleContext)(internalNode, sourceHandleId, handlePosition) : void 0;
-    const nodePosition = position ? calculatePositionFromDrop(position, handlePosition, previewNodeSize) : calculateAutoPosition(sourceNode, handlePosition, previewNodeSize, existingNodes, void 0, ignoredNodeTypes, handle);
+    const nodePosition = position ? 'center' === positionMode ? calculateCenteredPosition(position, previewNodeSize) : calculatePositionFromDrop(position, handlePosition, previewNodeSize) : calculateAutoPosition(sourceNode, handlePosition, previewNodeSize, existingNodes, void 0, ignoredNodeTypes, handle);
     const handleFacingSource = getOppositePosition(handlePosition);
     const finalData = {
         ...data ?? {}
@@ -179,19 +188,14 @@ function createPreviewNode(sourceNodeId, sourceHandleId, reactFlowInstance, posi
         id: external_constants_cjs_namespaceObject.PREVIEW_EDGE_ID,
         ...previewSourceAndTargetData,
         type: 'default',
-        style: {
-            strokeDasharray: '5,5',
-            opacity: 0.8,
-            stroke: 'var(--canvas-selection-indicator)',
-            strokeWidth: 2
-        }
+        style: external_createPreviewGraph_cjs_namespaceObject.PREVIEW_EDGE_STYLE
     };
     return {
         node: previewNode,
         edge: previewEdge
     };
 }
-function applyPreviewToReactFlow(preview, reactFlowInstance) {
+function applyPreviewGraphToReactFlow(preview, reactFlowInstance) {
     setTimeout(()=>{
         reactFlowInstance.setNodes((nodes)=>[
                 ...nodes.filter((n)=>n.id !== external_constants_cjs_namespaceObject.PREVIEW_NODE_ID).map((n)=>({
@@ -201,21 +205,33 @@ function applyPreviewToReactFlow(preview, reactFlowInstance) {
                 preview.node
             ]);
         reactFlowInstance.setEdges((edges)=>[
-                ...edges.filter((e)=>e.id !== external_constants_cjs_namespaceObject.PREVIEW_EDGE_ID),
-                preview.edge
+                ...edges.filter((edge)=>edge.source !== external_constants_cjs_namespaceObject.PREVIEW_NODE_ID && edge.target !== external_constants_cjs_namespaceObject.PREVIEW_NODE_ID && !preview.removedEdgeIds?.includes(edge.id)),
+                ...preview.edges
             ]);
     }, 0);
 }
+function applyPreviewToReactFlow(preview, reactFlowInstance) {
+    applyPreviewGraphToReactFlow({
+        node: preview.node,
+        edges: [
+            preview.edge
+        ]
+    }, reactFlowInstance);
+}
 function removePreviewFromReactFlow(reactFlowInstance) {
     reactFlowInstance.setNodes((nodes)=>nodes.filter((n)=>n.id !== external_constants_cjs_namespaceObject.PREVIEW_NODE_ID));
-    reactFlowInstance.setEdges((edges)=>edges.filter((e)=>e.id !== external_constants_cjs_namespaceObject.PREVIEW_EDGE_ID));
+    reactFlowInstance.setEdges((edges)=>edges.filter((edge)=>edge.source !== external_constants_cjs_namespaceObject.PREVIEW_NODE_ID && edge.target !== external_constants_cjs_namespaceObject.PREVIEW_NODE_ID));
 }
+exports.applyPreviewGraphToReactFlow = __webpack_exports__.applyPreviewGraphToReactFlow;
 exports.applyPreviewToReactFlow = __webpack_exports__.applyPreviewToReactFlow;
 exports.createPreviewNode = __webpack_exports__.createPreviewNode;
+exports.getOppositePosition = __webpack_exports__.getOppositePosition;
 exports.removePreviewFromReactFlow = __webpack_exports__.removePreviewFromReactFlow;
 for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "applyPreviewGraphToReactFlow",
     "applyPreviewToReactFlow",
     "createPreviewNode",
+    "getOppositePosition",
     "removePreviewFromReactFlow"
 ].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
 Object.defineProperty(exports, '__esModule', {

package/dist/canvas/utils/createPreviewNode.d.ts

@@ -1,14 +1,18 @@
 import { type Edge, type Node, Position, type ReactFlowInstance } from '../xyflow/react.ts';
+import { type PreviewGraph } from './createPreviewGraph';
+export type PreviewNodePositionMode = 'drop' | 'center';
+export declare function getOppositePosition(position: Position): Position;
 export declare function createPreviewNode(sourceNodeId: string, sourceHandleId: string, reactFlowInstance: ReactFlowInstance, position?: {
     x: number;
     y: number;
 }, data?: Record<string, any>, sourceHandleType?: 'source' | 'target', previewNodeSize?: {
     width: number;
     height: number;
-}, handlePosition?: Position, ignoredNodeTypes?: string[]): {
+}, handlePosition?: Position, ignoredNodeTypes?: string[], positionMode?: PreviewNodePositionMode): {
     node: Node;
     edge: Edge;
 } | null;
+export declare function applyPreviewGraphToReactFlow(preview: PreviewGraph, reactFlowInstance: ReactFlowInstance): void;
 export declare function applyPreviewToReactFlow(preview: {
     node: Node;
     edge: Edge;

package/dist/canvas/utils/createPreviewNode.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createPreviewNode.d.ts","sourceRoot":"","sources":["../../../src/canvas/utils/createPreviewNode.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,IAAI,EACT,KAAK,IAAI,EACT,QAAQ,EACR,KAAK,iBAAiB,EACvB,MAAM,0CAA0C,CAAC;AAiMlD,wBAAgB,iBAAiB,CAC/B,YAAY,EAAE,MAAM,EACpB,cAAc,EAAE,MAAM,EACtB,iBAAiB,EAAE,iBAAiB,EACpC,QAAQ,CAAC,EAAE;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,EACnC,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAC1B,gBAAgB,GAAE,QAAQ,GAAG,QAAmB,EAChD,eAAe,GAAE;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAG/C,EACD,cAAc,GAAE,QAAyB,EACzC,gBAAgB,GAAE,MAAM,EAAO,GAC9B;IAAE,IAAI,EAAE,IAAI,CAAC;IAAC,IAAI,EAAE,IAAI,CAAA;CAAE,GAAG,IAAI,CA2FnC;AAMD,wBAAgB,uBAAuB,CACrC,OAAO,EAAE;IAAE,IAAI,EAAE,IAAI,CAAC;IAAC,IAAI,EAAE,IAAI,CAAA;CAAE,EACnC,iBAAiB,EAAE,iBAAiB,GACnC,IAAI,CAcN;AAKD,wBAAgB,0BAA0B,CAAC,iBAAiB,EAAE,iBAAiB,GAAG,IAAI,CAGrF"}
+{"version":3,"file":"createPreviewNode.d.ts","sourceRoot":"","sources":["../../../src/canvas/utils/createPreviewNode.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,IAAI,EACT,KAAK,IAAI,EACT,QAAQ,EACR,KAAK,iBAAiB,EACvB,MAAM,0CAA0C,CAAC;AAElD,OAAO,EAAsB,KAAK,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAQ7E,MAAM,MAAM,uBAAuB,GAAG,MAAM,GAAG,QAAQ,CAAC;AAMxD,wBAAgB,mBAAmB,CAAC,QAAQ,EAAE,QAAQ,GAAG,QAAQ,CAahE;AAiLD,wBAAgB,iBAAiB,CAC/B,YAAY,EAAE,MAAM,EACpB,cAAc,EAAE,MAAM,EACtB,iBAAiB,EAAE,iBAAiB,EACpC,QAAQ,CAAC,EAAE;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,EACnC,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,EAC1B,gBAAgB,GAAE,QAAQ,GAAG,QAAmB,EAChD,eAAe,GAAE;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAG/C,EACD,cAAc,GAAE,QAAyB,EACzC,gBAAgB,GAAE,MAAM,EAAO,EAC/B,YAAY,GAAE,uBAAgC,GAC7C;IAAE,IAAI,EAAE,IAAI,CAAC;IAAC,IAAI,EAAE,IAAI,CAAA;CAAE,GAAG,IAAI,CAwFnC;AAOD,wBAAgB,4BAA4B,CAC1C,OAAO,EAAE,YAAY,EACrB,iBAAiB,EAAE,iBAAiB,GACnC,IAAI,CAmBN;AAKD,wBAAgB,uBAAuB,CACrC,OAAO,EAAE;IAAE,IAAI,EAAE,IAAI,CAAC;IAAC,IAAI,EAAE,IAAI,CAAA;CAAE,EACnC,iBAAiB,EAAE,iBAAiB,GACnC,IAAI,CAQN;AAKD,wBAAgB,0BAA0B,CAAC,iBAAiB,EAAE,iBAAiB,GAAG,IAAI,CAKrF"}

package/dist/canvas/utils/createPreviewNode.js

@@ -1,5 +1,6 @@
 import { Position } from "../xyflow/react.js";
 import { DEFAULT_NODE_SIZE, GRID_SPACING, PREVIEW_EDGE_ID, PREVIEW_NODE_ID } from "../constants.js";
+import { PREVIEW_EDGE_STYLE } from "./createPreviewGraph.js";
 import { getAbsolutePosition, getNonOverlappingPositionForDirection, resolveHandleContext } from "./NodeUtils.js";
 function getOppositePosition(position) {
     switch(position){
@@ -44,6 +45,12 @@ function calculatePositionFromDrop(dropPosition, handlePosition, previewNodeSize
             };
     }
 }
+function calculateCenteredPosition(centerPosition, previewNodeSize) {
+    return {
+        x: centerPosition.x - previewNodeSize.width / 2,
+        y: centerPosition.y - previewNodeSize.height / 2
+    };
+}
 function computeSpreadOffset(handle, size) {
     const index = handle?.index ?? null;
     const count = handle?.count ?? 1;
@@ -109,7 +116,7 @@ function calculateAutoPosition(sourceNode, handlePosition, previewNodeSize, exis
 function createPreviewNode(sourceNodeId, sourceHandleId, reactFlowInstance, position, data, sourceHandleType = 'source', previewNodeSize = {
     width: DEFAULT_NODE_SIZE,
     height: DEFAULT_NODE_SIZE
-}, handlePosition = Position.Right, ignoredNodeTypes = []) {
+}, handlePosition = Position.Right, ignoredNodeTypes = [], positionMode = 'drop') {
     const sourceNode = reactFlowInstance.getNode(sourceNodeId);
     if (!sourceNode) {
         console.warn(`Source node ${sourceNodeId} not found`);
@@ -119,7 +126,7 @@ function createPreviewNode(sourceNodeId, sourceHandleId, reactFlowInstance, posi
     const existingNodes = reactFlowInstance.getNodes().filter((n)=>n.id !== PREVIEW_NODE_ID);
     const internalNode = void 0 === position ? reactFlowInstance.getInternalNode(sourceNodeId) : void 0;
     const handle = internalNode ? resolveHandleContext(internalNode, sourceHandleId, handlePosition) : void 0;
-    const nodePosition = position ? calculatePositionFromDrop(position, handlePosition, previewNodeSize) : calculateAutoPosition(sourceNode, handlePosition, previewNodeSize, existingNodes, void 0, ignoredNodeTypes, handle);
+    const nodePosition = position ? 'center' === positionMode ? calculateCenteredPosition(position, previewNodeSize) : calculatePositionFromDrop(position, handlePosition, previewNodeSize) : calculateAutoPosition(sourceNode, handlePosition, previewNodeSize, existingNodes, void 0, ignoredNodeTypes, handle);
     const handleFacingSource = getOppositePosition(handlePosition);
     const finalData = {
         ...data ?? {}
@@ -149,19 +156,14 @@ function createPreviewNode(sourceNodeId, sourceHandleId, reactFlowInstance, posi
         id: PREVIEW_EDGE_ID,
         ...previewSourceAndTargetData,
         type: 'default',
-        style: {
-            strokeDasharray: '5,5',
-            opacity: 0.8,
-            stroke: 'var(--canvas-selection-indicator)',
-            strokeWidth: 2
-        }
+        style: PREVIEW_EDGE_STYLE
     };
     return {
         node: previewNode,
         edge: previewEdge
     };
 }
-function applyPreviewToReactFlow(preview, reactFlowInstance) {
+function applyPreviewGraphToReactFlow(preview, reactFlowInstance) {
     setTimeout(()=>{
         reactFlowInstance.setNodes((nodes)=>[
                 ...nodes.filter((n)=>n.id !== PREVIEW_NODE_ID).map((n)=>({
@@ -171,13 +173,21 @@ function applyPreviewToReactFlow(preview, reactFlowInstance) {
                 preview.node
             ]);
         reactFlowInstance.setEdges((edges)=>[
-                ...edges.filter((e)=>e.id !== PREVIEW_EDGE_ID),
-                preview.edge
+                ...edges.filter((edge)=>edge.source !== PREVIEW_NODE_ID && edge.target !== PREVIEW_NODE_ID && !preview.removedEdgeIds?.includes(edge.id)),
+                ...preview.edges
             ]);
     }, 0);
 }
+function applyPreviewToReactFlow(preview, reactFlowInstance) {
+    applyPreviewGraphToReactFlow({
+        node: preview.node,
+        edges: [
+            preview.edge
+        ]
+    }, reactFlowInstance);
+}
 function removePreviewFromReactFlow(reactFlowInstance) {
     reactFlowInstance.setNodes((nodes)=>nodes.filter((n)=>n.id !== PREVIEW_NODE_ID));
-    reactFlowInstance.setEdges((edges)=>edges.filter((e)=>e.id !== PREVIEW_EDGE_ID));
+    reactFlowInstance.setEdges((edges)=>edges.filter((edge)=>edge.source !== PREVIEW_NODE_ID && edge.target !== PREVIEW_NODE_ID));
 }
-export { applyPreviewToReactFlow, createPreviewNode, removePreviewFromReactFlow };
+export { applyPreviewGraphToReactFlow, applyPreviewToReactFlow, createPreviewNode, getOppositePosition, removePreviewFromReactFlow };

package/dist/canvas/utils/index.cjs

@@ -36,6 +36,9 @@ var __webpack_modules__ = {
     "./constraint-validator" (module) {
         module.exports = require("./constraint-validator.cjs");
     },
+    "./createPreviewGraph" (module) {
+        module.exports = require("./createPreviewGraph.cjs");
+    },
     "./createPreviewNode" (module) {
         module.exports = require("./createPreviewNode.cjs");
     },
@@ -114,61 +117,65 @@ var __webpack_exports__ = {};
     var __rspack_reexport = {};
     for(const __rspack_import_key in _CssUtil__rspack_import_3)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_CssUtil__rspack_import_3[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _collapse__rspack_import_4 = __webpack_require__("./collapse");
+    var _coded_agents_d3_layout__rspack_import_4 = __webpack_require__("./coded-agents/d3-layout");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _collapse__rspack_import_4)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_collapse__rspack_import_4[__rspack_import_key];
+    for(const __rspack_import_key in _coded_agents_d3_layout__rspack_import_4)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_coded_agents_d3_layout__rspack_import_4[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _coded_agents_d3_layout__rspack_import_5 = __webpack_require__("./coded-agents/d3-layout");
+    var _coded_agents_mermaid_parser__rspack_import_5 = __webpack_require__("./coded-agents/mermaid-parser");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _coded_agents_d3_layout__rspack_import_5)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_coded_agents_d3_layout__rspack_import_5[__rspack_import_key];
+    for(const __rspack_import_key in _coded_agents_mermaid_parser__rspack_import_5)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_coded_agents_mermaid_parser__rspack_import_5[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _coded_agents_mermaid_parser__rspack_import_6 = __webpack_require__("./coded-agents/mermaid-parser");
+    var _collapse__rspack_import_6 = __webpack_require__("./collapse");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _coded_agents_mermaid_parser__rspack_import_6)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_coded_agents_mermaid_parser__rspack_import_6[__rspack_import_key];
+    for(const __rspack_import_key in _collapse__rspack_import_6)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_collapse__rspack_import_6[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
     var _constraint_validator__rspack_import_7 = __webpack_require__("./constraint-validator");
     var __rspack_reexport = {};
     for(const __rspack_import_key in _constraint_validator__rspack_import_7)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_constraint_validator__rspack_import_7[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _createPreviewNode__rspack_import_8 = __webpack_require__("./createPreviewNode");
+    var _createPreviewGraph__rspack_import_8 = __webpack_require__("./createPreviewGraph");
+    var __rspack_reexport = {};
+    for(const __rspack_import_key in _createPreviewGraph__rspack_import_8)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_createPreviewGraph__rspack_import_8[__rspack_import_key];
+    __webpack_require__.d(__webpack_exports__, __rspack_reexport);
+    var _createPreviewNode__rspack_import_9 = __webpack_require__("./createPreviewNode");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _createPreviewNode__rspack_import_8)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_createPreviewNode__rspack_import_8[__rspack_import_key];
+    for(const __rspack_import_key in _createPreviewNode__rspack_import_9)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_createPreviewNode__rspack_import_9[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _export_canvas__rspack_import_9 = __webpack_require__("./export-canvas");
+    var _export_canvas__rspack_import_10 = __webpack_require__("./export-canvas");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _export_canvas__rspack_import_9)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_export_canvas__rspack_import_9[__rspack_import_key];
+    for(const __rspack_import_key in _export_canvas__rspack_import_10)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_export_canvas__rspack_import_10[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _GroupModificationUtils__rspack_import_10 = __webpack_require__("./GroupModificationUtils");
+    var _GroupModificationUtils__rspack_import_11 = __webpack_require__("./GroupModificationUtils");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _GroupModificationUtils__rspack_import_10)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_GroupModificationUtils__rspack_import_10[__rspack_import_key];
+    for(const __rspack_import_key in _GroupModificationUtils__rspack_import_11)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_GroupModificationUtils__rspack_import_11[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _icon_registry__rspack_import_11 = __webpack_require__("./icon-registry");
+    var _icon_registry__rspack_import_12 = __webpack_require__("./icon-registry");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _icon_registry__rspack_import_11)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_icon_registry__rspack_import_11[__rspack_import_key];
+    for(const __rspack_import_key in _icon_registry__rspack_import_12)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_icon_registry__rspack_import_12[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _manifest_resolver__rspack_import_12 = __webpack_require__("./manifest-resolver");
+    var _manifest_resolver__rspack_import_13 = __webpack_require__("./manifest-resolver");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _manifest_resolver__rspack_import_12)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_manifest_resolver__rspack_import_12[__rspack_import_key];
+    for(const __rspack_import_key in _manifest_resolver__rspack_import_13)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_manifest_resolver__rspack_import_13[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _NodeUtils__rspack_import_13 = __webpack_require__("./NodeUtils");
+    var _NodeUtils__rspack_import_14 = __webpack_require__("./NodeUtils");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _NodeUtils__rspack_import_13)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_NodeUtils__rspack_import_13[__rspack_import_key];
+    for(const __rspack_import_key in _NodeUtils__rspack_import_14)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_NodeUtils__rspack_import_14[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _props_helpers__rspack_import_14 = __webpack_require__("./props-helpers");
+    var _props_helpers__rspack_import_15 = __webpack_require__("./props-helpers");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _props_helpers__rspack_import_14)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_props_helpers__rspack_import_14[__rspack_import_key];
+    for(const __rspack_import_key in _props_helpers__rspack_import_15)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_props_helpers__rspack_import_15[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _resource_operations__rspack_import_15 = __webpack_require__("./resource-operations");
+    var _resource_operations__rspack_import_16 = __webpack_require__("./resource-operations");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _resource_operations__rspack_import_15)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_resource_operations__rspack_import_15[__rspack_import_key];
+    for(const __rspack_import_key in _resource_operations__rspack_import_16)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_resource_operations__rspack_import_16[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _Storage__rspack_import_16 = __webpack_require__("./Storage");
+    var _Storage__rspack_import_17 = __webpack_require__("./Storage");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _Storage__rspack_import_16)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_Storage__rspack_import_16[__rspack_import_key];
+    for(const __rspack_import_key in _Storage__rspack_import_17)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_Storage__rspack_import_17[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
-    var _StyleUtil__rspack_import_17 = __webpack_require__("./StyleUtil");
+    var _StyleUtil__rspack_import_18 = __webpack_require__("./StyleUtil");
     var __rspack_reexport = {};
-    for(const __rspack_import_key in _StyleUtil__rspack_import_17)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_StyleUtil__rspack_import_17[__rspack_import_key];
+    for(const __rspack_import_key in _StyleUtil__rspack_import_18)if ("default" !== __rspack_import_key) __rspack_reexport[__rspack_import_key] = ()=>_StyleUtil__rspack_import_18[__rspack_import_key];
     __webpack_require__.d(__webpack_exports__, __rspack_reexport);
 })();
 for(var __rspack_i in __webpack_exports__)exports[__rspack_i] = __webpack_exports__[__rspack_i];

package/dist/canvas/utils/index.d.ts

@@ -2,10 +2,11 @@ export * from './ArrayUtil';
 export * from './auto-layout';
 export * from './CanvasEventBus';
 export * from './CssUtil';
-export * from './collapse';
 export * from './coded-agents/d3-layout';
 export * from './coded-agents/mermaid-parser';
+export * from './collapse';
 export * from './constraint-validator';
+export * from './createPreviewGraph';
 export * from './createPreviewNode';
 export * from './export-canvas';
 export * from './GroupModificationUtils';

package/dist/canvas/utils/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/canvas/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AACjC,cAAc,WAAW,CAAC;AAC1B,cAAc,YAAY,CAAC;AAC3B,cAAc,0BAA0B,CAAC;AACzC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,wBAAwB,CAAC;AACvC,cAAc,qBAAqB,CAAC;AACpC,cAAc,iBAAiB,CAAC;AAChC,cAAc,0BAA0B,CAAC;AACzC,cAAc,iBAAiB,CAAC;AAChC,cAAc,qBAAqB,CAAC;AACpC,cAAc,aAAa,CAAC;AAC5B,cAAc,iBAAiB,CAAC;AAChC,cAAc,uBAAuB,CAAC;AACtC,cAAc,WAAW,CAAC;AAC1B,cAAc,aAAa,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/canvas/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAC;AAC5B,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AACjC,cAAc,WAAW,CAAC;AAC1B,cAAc,0BAA0B,CAAC;AACzC,cAAc,+BAA+B,CAAC;AAC9C,cAAc,YAAY,CAAC;AAC3B,cAAc,wBAAwB,CAAC;AACvC,cAAc,sBAAsB,CAAC;AACrC,cAAc,qBAAqB,CAAC;AACpC,cAAc,iBAAiB,CAAC;AAChC,cAAc,0BAA0B,CAAC;AACzC,cAAc,iBAAiB,CAAC;AAChC,cAAc,qBAAqB,CAAC;AACpC,cAAc,aAAa,CAAC;AAC5B,cAAc,iBAAiB,CAAC;AAChC,cAAc,uBAAuB,CAAC;AACtC,cAAc,WAAW,CAAC;AAC1B,cAAc,aAAa,CAAC"}

package/dist/canvas/utils/index.js

@@ -2,10 +2,11 @@ export * from "./ArrayUtil.js";
 export * from "./auto-layout.js";
 export * from "./CanvasEventBus.js";
 export * from "./CssUtil.js";
-export * from "./collapse.js";
 export * from "./coded-agents/d3-layout.js";
 export * from "./coded-agents/mermaid-parser.js";
+export * from "./collapse.js";
 export * from "./constraint-validator.js";
+export * from "./createPreviewGraph.js";
 export * from "./createPreviewNode.js";
 export * from "./export-canvas.js";
 export * from "./GroupModificationUtils.js";

package/package.json

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