@industry-theme/principal-view-panels 0.12.103 → 0.12.104

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,EAAqD,gBAAgB,EAA+C,MAAM,mCAAmC,CAAC;AAE1K,OAAO,EAAqB,KAAK,eAAe,EAAE,MAAM,eAAe,CAAC;AAKxE,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sCAAsC,CAAC;AAmDrE;;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;IAE1B;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEhC;;;;OAIG;IACH,mBAAmB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACrC;AAED;;;;;GAKG;AACH,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAouD9D,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,EAAqD,gBAAgB,EAA+C,MAAM,mCAAmC,CAAC;AAE1K,OAAO,EAAqB,KAAK,eAAe,EAAE,MAAM,eAAe,CAAC;AAKxE,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,sCAAsC,CAAC;AAmDrE;;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;IAE1B;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAEhC;;;;OAIG;IACH,mBAAmB,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACrC;AAED;;;;;GAKG;AACH,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CAquD9D,CAAC"}

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

@@ -1 +1 @@
-{"version":3,"file":"DashboardPanel.d.ts","sourceRoot":"","sources":["../../src/panels/DashboardPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4D,MAAM,OAAO,CAAC;AACjF,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,qCAAqC,CAAC;AAS/E,OAAO,KAAK,EAEV,YAAY,EAGZ,gBAAgB,EAChB,oBAAoB,EACpB,kBAAkB,EAClB,gBAAgB,EAEhB,YAAY,EAEb,MAAM,mCAAmC,CAAC;AA6N3C;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,kBAAkB,CAAC;IACzB,QAAQ,EAAE,gBAAgB,CAAC;CAC5B;AAED,MAAM,WAAW,mBAAoB,SAAQ,mBAAmB;IAC9D;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,gBAAgB,GAAG,IAAI,CAAC;IAE5C;;;;OAIG;IACH,YAAY,CAAC,EAAE,YAAY,CAAC;IAE5B;;;;OAIG;IACH,WAAW,CAAC,EAAE,oBAAoB,EAAE,CAAC;IAErC;;;OAGG;IACH,SAAS,CAAC,EAAE,cAAc,EAAE,CAAC;IAE7B;;;OAGG;IACH,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,YAAY,KAAK,IAAI,CAAC;IAE/C;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;CAC5C;AAED;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CA6VxD,CAAC"}
+{"version":3,"file":"DashboardPanel.d.ts","sourceRoot":"","sources":["../../src/panels/DashboardPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4D,MAAM,OAAO,CAAC;AACjF,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,qCAAqC,CAAC;AAS/E,OAAO,KAAK,EAEV,YAAY,EAGZ,gBAAgB,EAChB,oBAAoB,EACpB,kBAAkB,EAClB,gBAAgB,EAEhB,YAAY,EAKb,MAAM,mCAAmC,CAAC;AAsP3C;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,kBAAkB,CAAC;IACzB,QAAQ,EAAE,gBAAgB,CAAC;CAC5B;AAED,MAAM,WAAW,mBAAoB,SAAQ,mBAAmB;IAC9D;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,gBAAgB,GAAG,IAAI,CAAC;IAE5C;;;;OAIG;IACH,YAAY,CAAC,EAAE,YAAY,CAAC;IAE5B;;;;OAIG;IACH,WAAW,CAAC,EAAE,oBAAoB,EAAE,CAAC;IAErC;;;OAGG;IACH,SAAS,CAAC,EAAE,cAAc,EAAE,CAAC;IAE7B;;;OAGG;IACH,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,YAAY,KAAK,IAAI,CAAC;IAE/C;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;CAC5C;AAED;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,cAAc,EAAE,KAAK,CAAC,EAAE,CAAC,mBAAmB,CA6VxD,CAAC"}

package/dist/panels/execution-viewer/EventCarousel.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import type { WorkflowScenario, OtelEvent } from '@principal-ai/principal-view-core';
+import type { WorkflowScenario, OtelEvent, Canvas, ExtendedCanvas } from '@principal-ai/principal-view-core';
 export interface EventCarouselProps {
     /** The selected scenario to display events from */
     scenario: WorkflowScenario;
@@ -23,6 +23,8 @@ export interface EventCarouselProps {
     onExpandToggle?: () => void;
     /** Events from a loaded trace (used to fill in template variables) */
     traceEvents?: OtelEvent[];
+    /** Canvas containing node metadata for scope extraction */
+    canvas?: Canvas | ExtendedCanvas | null;
 }
 /**
  * A carousel-style event viewer that shows one event at a time.

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

@@ -1 +1 @@
-{"version":3,"file":"EventCarousel.d.ts","sourceRoot":"","sources":["../../../src/panels/execution-viewer/EventCarousel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoD,MAAM,OAAO,CAAC;AAGzE,OAAO,KAAK,EAAE,gBAAgB,EAAE,SAAS,EAAmB,MAAM,mCAAmC,CAAC;AAqCtG,MAAM,WAAW,kBAAkB;IACjC,mDAAmD;IACnD,QAAQ,EAAE,gBAAgB,CAAC;IAC3B,oCAAoC;IACpC,iBAAiB,EAAE,MAAM,CAAC;IAC1B,wCAAwC;IACxC,kBAAkB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,iEAAiE;IACjE,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9D,6CAA6C;IAC7C,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,mCAAmC;IACnC,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,oCAAoC;IACpC,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,0EAA0E;IAC1E,kBAAkB,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,MAAM,EAAE,CAAC;IACrD,sDAAsD;IACtD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,wCAAwC;IACxC,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,sEAAsE;IACtE,WAAW,CAAC,EAAE,SAAS,EAAE,CAAC;CAC3B;AAED;;;GAGG;AACH,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CA6dtD,CAAC"}
+{"version":3,"file":"EventCarousel.d.ts","sourceRoot":"","sources":["../../../src/panels/execution-viewer/EventCarousel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoD,MAAM,OAAO,CAAC;AAGzE,OAAO,KAAK,EAAE,gBAAgB,EAAE,SAAS,EAAmB,MAAM,EAAE,cAAc,EAAE,MAAM,mCAAmC,CAAC;AA2D9H,MAAM,WAAW,kBAAkB;IACjC,mDAAmD;IACnD,QAAQ,EAAE,gBAAgB,CAAC;IAC3B,oCAAoC;IACpC,iBAAiB,EAAE,MAAM,CAAC;IAC1B,wCAAwC;IACxC,kBAAkB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,iEAAiE;IACjE,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9D,6CAA6C;IAC7C,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,mCAAmC;IACnC,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,oCAAoC;IACpC,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,0EAA0E;IAC1E,kBAAkB,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,MAAM,EAAE,CAAC;IACrD,sDAAsD;IACtD,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,wCAAwC;IACxC,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,sEAAsE;IACtE,WAAW,CAAC,EAAE,SAAS,EAAE,CAAC;IAC1B,2DAA2D;IAC3D,MAAM,CAAC,EAAE,MAAM,GAAG,cAAc,GAAG,IAAI,CAAC;CACzC;AAED;;;GAGG;AACH,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CA8dtD,CAAC"}

package/dist/panels.bundle.js

@@ -190026,14 +190026,29 @@ const TemplateText = ({ segments, className }) => {
     );
   }) });
 };
-function convertWorkflowToSequence$1(scenario) {
+function convertWorkflowToSequence$1(scenario, canvas) {
   const templateEvents = scenario.template.events ?? {};
   const eventNames = Object.keys(templateEvents);
-  const events = eventNames.map((name2, index2) => ({
-    id: `event-${index2}`,
-    name: name2,
-    label: name2.split(".").pop() ?? name2
-  }));
+  const eventToScopeMap = /* @__PURE__ */ new Map();
+  if (canvas == null ? void 0 : canvas.nodes) {
+    for (const node2 of canvas.nodes) {
+      const otel = node2.otel;
+      const event = node2.event;
+      if ((otel == null ? void 0 : otel.scope) && (event == null ? void 0 : event.name)) {
+        eventToScopeMap.set(event.name, otel.scope);
+      }
+    }
+  }
+  const events = eventNames.map((name2, index2) => {
+    const scope = eventToScopeMap.get(name2) || "unknown";
+    return {
+      id: `event-${index2}`,
+      // Use scope as namespace prefix so lanes are created per scope
+      name: `${scope}.${name2}`,
+      // Display only the last segment of the original event name
+      label: name2.split(".").pop() ?? name2
+    };
+  });
   const edges = [];
   for (let i = 0; i < events.length - 1; i++) {
     edges.push({
@@ -190055,7 +190070,8 @@ const EventCarousel = ({
   getSourcesForEvent,
   isExpanded = false,
   onExpandToggle,
-  traceEvents = []
+  traceEvents = [],
+  canvas
 }) => {
   const { theme: theme2 } = useTheme();
   const [showSources, setShowSources] = useState(false);
@@ -190310,7 +190326,7 @@ const EventCarousel = ({
         viewMode === "sequence" ? (
           /* Sequence Diagram View */
           /* @__PURE__ */ jsx("div", { style: { flex: 1, minHeight: 0, background: theme2.colors.backgroundSecondary }, children: (() => {
-            const { events, edges } = convertWorkflowToSequence$1(scenario);
+            const { events, edges } = convertWorkflowToSequence$1(scenario, canvas);
             return events.length > 0 ? /* @__PURE__ */ jsx(
               SequenceDiagramRenderer,
               {
@@ -190321,7 +190337,7 @@ const EventCarousel = ({
                   laneWidth: 220,
                   laneGap: 60,
                   eventSpacing: 100,
-                  namespaceStrategy: "all-but-last"
+                  namespaceStrategy: "first"
                 },
                 showControls: true
               }
@@ -191891,6 +191907,7 @@ const CanvasEditorPanel = ({
               onDismiss: handleEventCarouselDismiss,
               isExpanded: isCarouselExpanded,
               onExpandToggle: () => setIsCarouselExpanded((prev) => !prev),
+              canvas: state.canvas,
               sources: (() => {
                 var _a3, _b3;
                 const eventNames = Object.keys(((_a3 = state.selectedScenario) == null ? void 0 : _a3.template.events) || {});
@@ -206375,14 +206392,29 @@ class EmptyDataProvider {
     };
   }
 }
-function convertWorkflowToSequence(scenario) {
+function convertWorkflowToSequence(scenario, canvas) {
   const templateEvents = scenario.template.events ?? {};
   const eventNames = Object.keys(templateEvents);
-  const events = eventNames.map((name2, index2) => ({
-    id: `event-${index2}`,
-    name: name2,
-    label: name2.split(".").pop() ?? name2
-  }));
+  const eventToScopeMap = /* @__PURE__ */ new Map();
+  if (canvas == null ? void 0 : canvas.nodes) {
+    for (const node2 of canvas.nodes) {
+      const otel = node2.otel;
+      const event = node2.event;
+      if ((otel == null ? void 0 : otel.scope) && (event == null ? void 0 : event.name)) {
+        eventToScopeMap.set(event.name, otel.scope);
+      }
+    }
+  }
+  const events = eventNames.map((name2, index2) => {
+    const scope = eventToScopeMap.get(name2) || "unknown";
+    return {
+      id: `event-${index2}`,
+      // Use scope as namespace prefix so lanes are created per scope
+      name: `${scope}.${name2}`,
+      // Display only the last segment of the original event name
+      label: name2.split(".").pop() ?? name2
+    };
+  });
   const edges = [];
   for (let i = 0; i < events.length - 1; i++) {
     edges.push({
@@ -206399,10 +206431,11 @@ function SequenceDiagramModal({
   onOpenCanvas,
   theme: theme2
 }) {
-  const { events, edges } = useMemo(
-    () => convertWorkflowToSequence(sequence.scenario),
-    [sequence.scenario]
-  );
+  const { events, edges } = useMemo(() => {
+    const canvasWithContent = sequence.storyboard.canvas;
+    const canvas = canvasWithContent.content;
+    return convertWorkflowToSequence(sequence.scenario, canvas);
+  }, [sequence.scenario, sequence.storyboard.canvas]);
   return /* @__PURE__ */ jsx(
     "div",
     {
@@ -206528,7 +206561,7 @@ function SequenceDiagramModal({
                   laneWidth: 220,
                   laneGap: 60,
                   eventSpacing: 100,
-                  namespaceStrategy: "all-but-last"
+                  namespaceStrategy: "first"
                 },
                 showControls: true
               }