@industry-theme/principal-view-panels 0.12.55 → 0.12.56

package/dist/panels/CanvasEditorPanel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CanvasEditorPanel.d.ts","sourceRoot":"","sources":["../../src/panels/CanvasEditorPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4D,MAAM,OAAO,CAAC;AACjF,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,UAAU,CAAC;AAI5D,OAAO,KAAK,EAAyE,gBAAgB,EAA+C,MAAM,mCAAmC,CAAC;AAC9L,OAAO,EAAqB,KAAK,eAAe,EAAE,MAAM,eAAe,CAAC;AAKxE,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sCAAsC,CAAC;AAiCrE;;GAEG;AACH,MAAM,WAAW,sBAAuB,SAAQ,2BAA2B;IACzE;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;;OAGG;IACH,cAAc,CAAC,EAAE,QAAQ,GAAG,IAAI,CAAC;IAEjC;;;OAGG;IACH,gBAAgB,CAAC,EAAE,gBAAgB,GAAG,IAAI,CAAC;IAE3C;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEnC;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAE7B;;OAEG;IACH,gBAAgB,CAAC,EAAE,QAAQ,GAAG,IAAI,CAAC;IAEnC;;;OAGG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC;QACrB,UAAU,EAAE,MAAM,CAAC;QACnB,SAAS,EAAE,MAAM,GAAG,SAAS,CAAC;QAC9B,eAAe,CAAC,EAAE,MAAM,CAAC;KAC1B,CAAC,CAAC;IAEH;;;OAGG;IACH,kBAAkB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEnC;;;;OAIG;IACH,aAAa,CAAC,EAAE,eAAe,GAAG,IAAI,CAAC;IAEvC;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B;AAED;;;;;GAKG;AACH,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAihD9D,CAAC"}
+{"version":3,"file":"CanvasEditorPanel.d.ts","sourceRoot":"","sources":["../../src/panels/CanvasEditorPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4D,MAAM,OAAO,CAAC;AACjF,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,UAAU,CAAC;AAI5D,OAAO,KAAK,EAAyE,gBAAgB,EAA+C,MAAM,mCAAmC,CAAC;AAC9L,OAAO,EAAqB,KAAK,eAAe,EAAE,MAAM,eAAe,CAAC;AAKxE,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sCAAsC,CAAC;AAiCrE;;GAEG;AACH,MAAM,WAAW,sBAAuB,SAAQ,2BAA2B;IACzE;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;;OAGG;IACH,cAAc,CAAC,EAAE,QAAQ,GAAG,IAAI,CAAC;IAEjC;;;OAGG;IACH,gBAAgB,CAAC,EAAE,gBAAgB,GAAG,IAAI,CAAC;IAE3C;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEnC;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAE7B;;OAEG;IACH,gBAAgB,CAAC,EAAE,QAAQ,GAAG,IAAI,CAAC;IAEnC;;;OAGG;IACH,cAAc,CAAC,EAAE,KAAK,CAAC;QACrB,UAAU,EAAE,MAAM,CAAC;QACnB,SAAS,EAAE,MAAM,GAAG,SAAS,CAAC;QAC9B,eAAe,CAAC,EAAE,MAAM,CAAC;KAC1B,CAAC,CAAC;IAEH;;;OAGG;IACH,kBAAkB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEnC;;;;OAIG;IACH,aAAa,CAAC,EAAE,eAAe,GAAG,IAAI,CAAC;IAEvC;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;CAC3B;AAED;;;;;GAKG;AACH,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAqhD9D,CAAC"}

package/dist/panels/execution-viewer/WorkflowRenderer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WorkflowRenderer.d.ts","sourceRoot":"","sources":["../../../src/panels/execution-viewer/WorkflowRenderer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAE,gBAAgB,EAAE,SAAS,EAAE,cAAc,EAAoC,MAAM,mCAAmC,CAAC;AAKvI,MAAM,WAAW,qBAAqB;IACpC,6CAA6C;IAC7C,QAAQ,EAAE,gBAAgB,CAAC;IAE3B,4BAA4B;IAC5B,MAAM,EAAE,SAAS,EAAE,CAAC;IAEpB,8EAA8E;IAC9E,UAAU,EAAE,MAAM,CAAC;IAEnB,8BAA8B;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,4BAA4B;IAC5B,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAE5B,0BAA0B;IAC1B,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB,sFAAsF;IACtF,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IAE9D,gFAAgF;IAChF,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B,kFAAkF;IAClF,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B,yCAAyC;IACzC,MAAM,CAAC,EAAE,cAAc,GAAG,IAAI,CAAC;IAE/B,6CAA6C;IAC7C,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAEzC,6CAA6C;IAC7C,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED;;GAEG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAinB5D,CAAC"}
+{"version":3,"file":"WorkflowRenderer.d.ts","sourceRoot":"","sources":["../../../src/panels/execution-viewer/WorkflowRenderer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAEvC,OAAO,KAAK,EAAE,gBAAgB,EAAE,SAAS,EAAE,cAAc,EAAoC,MAAM,mCAAmC,CAAC;AAKvI,MAAM,WAAW,qBAAqB;IACpC,6CAA6C;IAC7C,QAAQ,EAAE,gBAAgB,CAAC;IAE3B,4BAA4B;IAC5B,MAAM,EAAE,SAAS,EAAE,CAAC;IAEpB,8EAA8E;IAC9E,UAAU,EAAE,MAAM,CAAC;IAEnB,8BAA8B;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB,4BAA4B;IAC5B,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAE5B,0BAA0B;IAC1B,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB,sFAAsF;IACtF,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IAE9D,gFAAgF;IAChF,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAE1B,kFAAkF;IAClF,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B,yCAAyC;IACzC,MAAM,CAAC,EAAE,cAAc,GAAG,IAAI,CAAC;IAE/B,6CAA6C;IAC7C,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAEzC,6CAA6C;IAC7C,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED;;GAEG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAmnB5D,CAAC"}

package/dist/panels.bundle.js

@@ -14,7 +14,7 @@ import { jsx, jsxs, Fragment } from "react/jsx-runtime";
 import * as React from "react";
 import React__default, { createContext, useContext, useState, useCallback, useMemo, memo, forwardRef, useRef, useEffect, useLayoutEffect, createElement, useImperativeHandle } from "react";
 import { createPortal } from "react-dom";
-import { CanvasConverter, buildScopeColorMap, DRAFT_NODE_COLOR, renderEventTemplate, CanvasDiscovery, ExecutionValidator, renderWorkflow, LibraryDiscovery, getSpanDuration } from "@principal-ai/principal-view-core";
+import { CanvasConverter, buildScopeColorMap, buildSpanColorMap, resolveEventSpanColor, DEFAULT_SPAN_COLOR, DRAFT_NODE_COLOR, renderEventTemplate, CanvasDiscovery, ExecutionValidator, renderWorkflow, LibraryDiscovery, getSpanDuration } from "@principal-ai/principal-view-core";
 import { StoryboardWorkflowsTreeCore, CanvasListTreeCore, hasWorkflowContent } from "@principal-ade/dynamic-file-tree";
 import { trace, context, SpanStatusCode } from "@opentelemetry/api";
 import { SpanStatusCode as SpanStatusCode2 } from "@opentelemetry/api";
@@ -86701,12 +86701,13 @@ const CustomNode = ({ data, selected: selected2, dragging }) => {
   }
   const nodeDataColor = nodeData.color;
   const scopeColor = nodeData.scopeColor;
-  const baseColor = scopeColor || nodeDataColor || typeDefinition.color || "#888";
+  const spanColor = nodeData.spanColor;
   const nodeDataStates = nodeData.states;
   const stateColor = state && (((_a = nodeDataStates == null ? void 0 : nodeDataStates[state]) == null ? void 0 : _a.color) || ((_c = (_b = typeDefinition.states) == null ? void 0 : _b[state]) == null ? void 0 : _c.color));
-  const fillColor = stateColor || baseColor;
+  const baseFillColor = spanColor || nodeDataColor || typeDefinition.color || "#888";
+  const fillColor = stateColor || baseFillColor;
   const nodeDataStroke = nodeData.stroke;
-  const baseStrokeColor = nodeDataStroke || typeDefinition.stroke || fillColor;
+  const baseStrokeColor = nodeDataStroke || scopeColor || fillColor;
   const status = nodeData == null ? void 0 : nodeData.status;
   const strokeColor = baseStrokeColor;
   const color2 = fillColor;
@@ -88505,28 +88506,29 @@ const GraphRendererInner = ({ configuration, nodes: propNodes, edges: propEdges,
     fontSize: "12px"
   }, children: "Cancel" })] })] });
 };
-function useCanvasToLegacy(canvas, library) {
+function useCanvasToLegacy(canvas, library, spansCanvas, workflowSpanPattern) {
   return useMemo(() => {
-    var _a, _b, _c, _d, _e2, _f, _g, _h, _i, _j, _k, _l, _m;
+    var _a, _b, _c, _d, _e2, _f, _g, _h, _i, _j, _k, _l;
     if (!canvas)
       return null;
     const { nodes, edges } = CanvasConverter.canvasToGraph(canvas);
     const scopeColorMap = buildScopeColorMap(library == null ? void 0 : library.resources);
+    const spanColorMap = buildSpanColorMap(spansCanvas);
+    const spanColor = resolveEventSpanColor(workflowSpanPattern, spanColorMap);
     for (const node2 of nodes) {
       const otel = (_a = node2.data) == null ? void 0 : _a.otel;
       const scope = otel == null ? void 0 : otel.scope;
-      const status = (_b = node2.data) == null ? void 0 : _b.status;
+      let nodeScopeColor;
       if (scope && scopeColorMap[scope]) {
-        node2.data = {
-          ...node2.data,
-          scopeColor: scopeColorMap[scope]
-        };
-      } else if (status === "draft" || !scope) {
-        node2.data = {
-          ...node2.data,
-          scopeColor: DRAFT_NODE_COLOR
-        };
+        nodeScopeColor = scopeColorMap[scope];
+      } else {
+        nodeScopeColor = DRAFT_NODE_COLOR;
       }
+      node2.data = {
+        ...node2.data,
+        scopeColor: nodeScopeColor,
+        spanColor: workflowSpanPattern ? spanColor : DEFAULT_SPAN_COLOR
+      };
     }
     const nodeTypes2 = {};
     const edgeTypes2 = {};
@@ -88555,7 +88557,7 @@ function useCanvasToLegacy(canvas, library) {
         };
       }
     }
-    if ((_c = canvas.pv) == null ? void 0 : _c.nodeTypes) {
+    if ((_b = canvas.pv) == null ? void 0 : _b.nodeTypes) {
       for (const [id2, def] of Object.entries(canvas.pv.nodeTypes)) {
         nodeTypes2[id2] = {
           description: def.description,
@@ -88570,7 +88572,7 @@ function useCanvasToLegacy(canvas, library) {
       const vv = node2.pv;
       const nodeType = (vv == null ? void 0 : vv.nodeType) || node2.type;
       if (!nodeTypes2[nodeType]) {
-        const fillColor = (vv == null ? void 0 : vv.fill) || (typeof node2.color === "string" ? node2.color : void 0) || ((_e2 = (_d = vv == null ? void 0 : vv.states) == null ? void 0 : _d.idle) == null ? void 0 : _e2.color);
+        const fillColor = (vv == null ? void 0 : vv.fill) || (typeof node2.color === "string" ? node2.color : void 0) || ((_d = (_c = vv == null ? void 0 : vv.states) == null ? void 0 : _c.idle) == null ? void 0 : _d.color);
         let nodeDescription = `${nodeType} node`;
         if (node2.type === "text" && "text" in node2) {
           const lines = node2.text.split("\n");
@@ -88592,7 +88594,7 @@ function useCanvasToLegacy(canvas, library) {
         };
       }
     }
-    if ((_f = canvas.pv) == null ? void 0 : _f.edgeTypes) {
+    if ((_e2 = canvas.pv) == null ? void 0 : _e2.edgeTypes) {
       for (const [id2, def] of Object.entries(canvas.pv.edgeTypes)) {
         edgeTypes2[id2] = {
           style: def.style || "solid",
@@ -88606,12 +88608,12 @@ function useCanvasToLegacy(canvas, library) {
     }
     const allowedConnections = [];
     for (const edge of canvas.edges || []) {
-      const edgeType = ((_g = edge.pv) == null ? void 0 : _g.edgeType) || "default";
+      const edgeType = ((_f = edge.pv) == null ? void 0 : _f.edgeType) || "default";
       if (!edgeTypes2[edgeType]) {
         edgeTypes2[edgeType] = {
-          style: ((_h = edge.pv) == null ? void 0 : _h.style) || "solid",
+          style: ((_g = edge.pv) == null ? void 0 : _g.style) || "solid",
           color: typeof edge.color === "string" ? edge.color : void 0,
-          width: (_i = edge.pv) == null ? void 0 : _i.width,
+          width: (_h = edge.pv) == null ? void 0 : _h.width,
           directed: true
         };
       }
@@ -88621,16 +88623,16 @@ function useCanvasToLegacy(canvas, library) {
         via: edgeType
       });
     }
-    const display = ((_j = canvas.pv) == null ? void 0 : _j.display) ? {
+    const display = ((_i = canvas.pv) == null ? void 0 : _i.display) ? {
       layout: canvas.pv.display.layout || "manual",
       theme: canvas.pv.display.theme,
       animations: canvas.pv.display.animations
     } : { layout: "manual" };
     const configuration = {
       metadata: {
-        name: ((_k = canvas.pv) == null ? void 0 : _k.name) || "Untitled",
-        version: ((_l = canvas.pv) == null ? void 0 : _l.version) || "1.0.0",
-        description: (_m = canvas.pv) == null ? void 0 : _m.description
+        name: ((_j = canvas.pv) == null ? void 0 : _j.name) || "Untitled",
+        version: ((_k = canvas.pv) == null ? void 0 : _k.version) || "1.0.0",
+        description: (_l = canvas.pv) == null ? void 0 : _l.description
       },
       nodeTypes: nodeTypes2,
       edgeTypes: edgeTypes2,
@@ -88638,17 +88640,17 @@ function useCanvasToLegacy(canvas, library) {
       display
     };
     return { configuration, nodes, edges };
-  }, [canvas, library]);
+  }, [canvas, library, spansCanvas, workflowSpanPattern]);
 }
 const GraphRenderer = forwardRef((props2, ref) => {
-  const { canvas, library, className, width = "100%", height = "100%" } = props2;
+  const { canvas, library, spansCanvas, workflowSpanPattern, className, width = "100%", height = "100%" } = props2;
   const { theme: theme2 } = useTheme();
   const containerRef = useRef(null);
   const [portalTarget, setPortalTarget] = useState(null);
   useEffect(() => {
     setPortalTarget(containerRef.current);
   }, []);
-  const canvasData = useCanvasToLegacy(canvas, library);
+  const canvasData = useCanvasToLegacy(canvas, library, spansCanvas, workflowSpanPattern);
   const editStateRef = useRef(createEmptyEditState());
   const resetVisualStateRef = useRef(null);
   const { canUndo: canUndoState, canRedo: canRedoState, undo: undoFromStack, redo: redoFromStack, pushHistory, clearHistory } = useUndoRedo();
@@ -95383,7 +95385,7 @@ const CanvasEditorPanel = ({
     setIsCarouselExpanded(false);
   }, []);
   const saveAllChanges = useCallback(async () => {
-    var _a2;
+    var _a2, _b2;
     if (!state.canvas || !canvasPath) return;
     const pendingChanges = (_a2 = graphRef.current) == null ? void 0 : _a2.getPendingChanges();
     const hasGraphChanges = (pendingChanges == null ? void 0 : pendingChanges.hasChanges) ?? false;
@@ -95410,6 +95412,7 @@ const CanvasEditorPanel = ({
         isSaving: false,
         hasUnsavedChanges: false
       }));
+      (_b2 = graphRef.current) == null ? void 0 : _b2.resetEditState();
     } catch (error) {
       console.error("[PrincipalView] Error saving changes:", error);
       setState((prev) => ({