footprint-explainable-ui 0.19.0 → 0.20.0

package/dist/flowchart.cjs

@@ -1286,8 +1286,11 @@ function styleEdge(edge, colors) {
   }
   return styled;
 }
-var nodeTypes = { stageNode: StageNode };
+var DEFAULT_NODE_TYPES = { stageNode: StageNode };
 function toStageNode(node) {
+  if (node.type !== void 0 && node.type !== "stage") {
+    return node;
+  }
   const data = node.data;
   const stageData = {
     label: data.label,
@@ -1369,6 +1372,11 @@ function TraceFlow(props) {
     },
     [onNodeClickRef]
   );
+  const { nodeTypes: userNodeTypes, edgeTypes: userEdgeTypes } = props;
+  const mergedNodeTypes = (0, import_react8.useMemo)(
+    () => userNodeTypes ? { ...DEFAULT_NODE_TYPES, ...userNodeTypes } : DEFAULT_NODE_TYPES,
+    [userNodeTypes]
+  );
   return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
     "div",
     {
@@ -1379,16 +1387,20 @@ function TraceFlow(props) {
         minHeight: 300,
         ...props.style
       },
-      children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
         import_react9.ReactFlow,
         {
           nodes: reactFlowNodes,
           edges: reactFlowEdges,
-          nodeTypes,
+          nodeTypes: mergedNodeTypes,
+          ...userEdgeTypes && { edgeTypes: userEdgeTypes },
           onNodeClick: handleNodeClick,
           fitView: true,
           proOptions: { hideAttribution: true },
-          children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react9.Background, { variant: import_react9.BackgroundVariant.Dots, gap: 20, size: 1 })
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_react9.Background, { variant: import_react9.BackgroundVariant.Dots, gap: 20, size: 1 }),
+            props.children
+          ]
         }
       )
     }
@@ -1728,6 +1740,9 @@ var DEFAULT_COLORS = {
   loop: rawDefaults.colors.warning
 };
 function toStageNodeWithOverlay(node, doneStageIds, activeStageId, errorMessage, executedOrderIds) {
+  if (node.type !== void 0 && node.type !== "stage") {
+    return node;
+  }
   const isDone = doneStageIds.has(node.id);
   const isActive = activeStageId === node.id;
   const wasExecuted = isDone || isActive;
@@ -1792,7 +1807,7 @@ function styleEdgeWithOverlay(edge, doneStageIds, activeStageId, colors) {
   }
   return styled;
 }
-var nodeTypes2 = { stageNode: StageNode };
+var DEFAULT_NODE_TYPES2 = { stageNode: StageNode };
 function TracedFlow({
   graph,
   overlay,
@@ -1801,6 +1816,9 @@ function TracedFlow({
   colors: colorOverrides,
   onNodeClick,
   onSubflowChange,
+  nodeTypes: userNodeTypes,
+  edgeTypes: userEdgeTypes,
+  children,
   className,
   style
 }) {
@@ -1809,6 +1827,10 @@ function TracedFlow({
     () => ({ ...DEFAULT_COLORS, ...colorOverrides ?? {} }),
     [colorOverrides]
   );
+  const mergedNodeTypes = (0, import_react12.useMemo)(
+    () => userNodeTypes ? { ...DEFAULT_NODE_TYPES2, ...userNodeTypes } : DEFAULT_NODE_TYPES2,
+    [userNodeTypes]
+  );
   const drill = useSubflowDrill(graph, onSubflowChange);
   const filteredGraph = (0, import_react12.useMemo)(
     () => filterGraphForDrill(graph, drill.currentSubflowId),
@@ -1887,17 +1909,21 @@ function TracedFlow({
             onNavigate: drill.setCurrentSubflowId
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { style: { flex: 1, minHeight: 0 }, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { style: { flex: 1, minHeight: 0 }, children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
           import_react13.ReactFlow,
           {
             nodes: reactFlowNodes,
             edges: reactFlowEdges,
-            nodeTypes: nodeTypes2,
+            nodeTypes: mergedNodeTypes,
+            ...userEdgeTypes && { edgeTypes: userEdgeTypes },
             onNodeClick: handleNodeClick,
             onInit: setRfInstance,
             fitView: true,
             proOptions: { hideAttribution: true },
-            children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react13.Background, { variant: import_react13.BackgroundVariant.Dots, gap: 20, size: 1 })
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react13.Background, { variant: import_react13.BackgroundVariant.Dots, gap: 20, size: 1 }),
+              children
+            ]
           }
         ) })
       ]