@industry-theme/principal-view-panels 0.8.3 → 0.8.5

package/dist/panels/WorkflowScenariosPanel.stories.d.ts

@@ -108,4 +108,12 @@ export declare const CanvasWithDocumentation: Story;
  * banner about incomplete template data.
  */
 export declare const IncompleteTemplateData: Story;
+/**
+ * Story: Incomplete Template Data - Missing Event
+ *
+ * This demonstrates what happens when the workflow template defines an event
+ * that is NOT present in the execution data. The narrative should show the
+ * event is missing or skip it gracefully.
+ */
+export declare const IncompleteTemplateData_MissingEvent: Story;
 //# sourceMappingURL=WorkflowScenariosPanel.stories.d.ts.map

package/dist/panels/WorkflowScenariosPanel.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WorkflowScenariosPanel.stories.d.ts","sourceRoot":"","sources":["../../src/panels/WorkflowScenariosPanel.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AAE1E;;;;;;;;;;;;;;;;;GAiBG;AACH,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;CAsBqC,CAAC;AAEhD,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAmyBnC;;;;;GAKG;AACH,eAAO,MAAM,wBAAwB,EAAE,KAgDtC,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,8BAA8B,EAAE,KAgD5C,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAgD9B,CAAC;AAEF;;;;;;GAMG;AACH,eAAO,MAAM,wBAAwB,EAAE,KA6GtC,CAAC;AAEF;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,mBAAmB,EAAE,KA6KjC,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,uBAAuB,EAAE,KAwDrC,CAAC;AAEF;;;;;;GAMG;AACH,eAAO,MAAM,sBAAsB,EAAE,KAsGpC,CAAC"}
+{"version":3,"file":"WorkflowScenariosPanel.stories.d.ts","sourceRoot":"","sources":["../../src/panels/WorkflowScenariosPanel.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAC5D,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AAE1E;;;;;;;;;;;;;;;;;GAiBG;AACH,QAAA,MAAM,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;CAsBqC,CAAC;AAEhD,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAmyBnC;;;;;GAKG;AACH,eAAO,MAAM,wBAAwB,EAAE,KAgDtC,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,8BAA8B,EAAE,KAgD5C,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAgD9B,CAAC;AAEF;;;;;;GAMG;AACH,eAAO,MAAM,wBAAwB,EAAE,KA6GtC,CAAC;AAEF;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,mBAAmB,EAAE,KA6KjC,CAAC;AAEF;;;;;GAKG;AACH,eAAO,MAAM,uBAAuB,EAAE,KAwDrC,CAAC;AAEF;;;;;;GAMG;AACH,eAAO,MAAM,sBAAsB,EAAE,KAsGpC,CAAC;AAEF;;;;;;GAMG;AACH,eAAO,MAAM,mCAAmC,EAAE,KA2IjD,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,EAAoB,cAAc,EAAmB,MAAM,mCAAmC,CAAC;AAKxI,MAAM,WAAW,qBAAqB;IACpC,6CAA6C;IAC7C,QAAQ,EAAE,gBAAgB,CAAC;IAE3B,4BAA4B;IAC5B,MAAM,EAAE,SAAS,EAAE,CAAC;IAEpB,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;CAC1C;AAED;;GAEG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAgjB5D,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,EAAoB,cAAc,EAAmB,MAAM,mCAAmC,CAAC;AAKxI,MAAM,WAAW,qBAAqB;IACpC,6CAA6C;IAC7C,QAAQ,EAAE,gBAAgB,CAAC;IAE3B,4BAA4B;IAC5B,MAAM,EAAE,SAAS,EAAE,CAAC;IAEpB,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;CAC1C;AAED;;GAEG;AACH,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CA4nB5D,CAAC"}

package/dist/panels.bundle.js

@@ -50564,76 +50564,138 @@ const WorkflowRenderer = ({
         const bTime = typeof b.timestamp === "number" ? b.timestamp : Date.parse(b.timestamp);
         return aTime - bTime;
       });
-      sortedEvents.forEach((event, eventIndex) => {
+      const executionEventsByName = /* @__PURE__ */ new Map();
+      sortedEvents.forEach((event, index2) => {
+        const existing = executionEventsByName.get(event.name) || [];
+        existing.push({ event, index: index2 });
+        executionEventsByName.set(event.name, existing);
+      });
+      const renderedEventIndices = /* @__PURE__ */ new Set();
+      const templateEventNames = scenario.template.events ? Object.keys(scenario.template.events) : [];
+      templateEventNames.forEach((templateEventName) => {
         var _a;
-        const eventTemplate = (_a = scenario.template.events) == null ? void 0 : _a[event.name];
+        const eventTemplate = (_a = scenario.template.events) == null ? void 0 : _a[templateEventName];
         if (!eventTemplate) return;
-        const eventContext = { ...fullContext };
-        if (event.attributes) {
-          for (const [key, value] of Object.entries(event.attributes)) {
-            if (key.includes(".")) {
-              const parts = key.split(".");
-              let current = eventContext;
-              for (let i = 0; i < parts.length - 1; i++) {
-                if (!current[parts[i]] || typeof current[parts[i]] !== "object") {
-                  current[parts[i]] = {};
+        const matchingEvents = executionEventsByName.get(templateEventName) || [];
+        if (matchingEvents.length === 0) {
+          const renderedText = parseTemplate(eventTemplate, fullContext);
+          const syntheticEventIndex = sortedEvents.length + templateEventNames.indexOf(templateEventName);
+          const syntheticEvent = {
+            name: templateEventName,
+            timestamp: 0,
+            attributes: {}
+          };
+          elements.push(
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                onClick: () => {
+                  if (onEventClick) {
+                    onEventClick(syntheticEvent, syntheticEventIndex);
+                  }
+                },
+                style: {
+                  cursor: onEventClick ? "pointer" : "default",
+                  transition: "all 0.2s ease"
+                },
+                children: /* @__PURE__ */ jsxs(
+                  "div",
+                  {
+                    style: {
+                      padding: "8px 20px 12px 20px",
+                      backgroundColor: activeEventIndex === syntheticEventIndex ? theme.colors.muted : theme.colors.backgroundSecondary,
+                      borderBottom: `1px solid ${theme.colors.border}`,
+                      borderLeft: activeEventIndex === syntheticEventIndex ? `4px solid ${theme.colors.warning}` : "4px solid transparent",
+                      fontSize: theme.fontSizes[1],
+                      lineHeight: "1.7",
+                      fontWeight: 500,
+                      transition: "background-color 0.2s ease, border-color 0.2s ease",
+                      color: theme.colors.text
+                    },
+                    children: [
+                      renderFormattedText(renderedText),
+                      /* @__PURE__ */ jsx(SourceFileList, { sources: getEventSources(templateEventName), onSourceClick })
+                    ]
+                  }
+                )
+              },
+              `missing-event-${templateEventName}`
+            )
+          );
+        } else {
+          matchingEvents.forEach(({ event, index: eventIndex }) => {
+            renderedEventIndices.add(eventIndex);
+            const eventContext = { ...fullContext };
+            if (event.attributes) {
+              for (const [key, value] of Object.entries(event.attributes)) {
+                if (key.includes(".")) {
+                  const parts = key.split(".");
+                  let current = eventContext;
+                  for (let i = 0; i < parts.length - 1; i++) {
+                    if (!current[parts[i]] || typeof current[parts[i]] !== "object") {
+                      current[parts[i]] = {};
+                    }
+                    current = current[parts[i]];
+                  }
+                  current[parts[parts.length - 1]] = value;
+                } else {
+                  eventContext[key] = value;
                 }
-                current = current[parts[i]];
               }
-              current[parts[parts.length - 1]] = value;
-            } else {
-              eventContext[key] = value;
             }
-          }
-        }
-        const renderedText = parseTemplate(eventTemplate, eventContext);
-        elements.push(
-          /* @__PURE__ */ jsx(
-            "div",
-            {
-              ref: activeEventIndex === eventIndex ? activeEventRef : null,
-              onClick: () => {
-                if (onEventClick) {
-                  onEventClick(event, eventIndex);
-                }
-              },
-              onContextMenu: (e) => {
-                e.preventDefault();
-                setContextMenu({
-                  visible: true,
-                  x: e.clientX,
-                  y: e.clientY,
-                  event
-                });
-              },
-              style: {
-                cursor: onEventClick ? "pointer" : "default",
-                transition: "all 0.2s ease"
-              },
-              children: /* @__PURE__ */ jsxs(
+            const renderedText = parseTemplate(eventTemplate, eventContext);
+            elements.push(
+              /* @__PURE__ */ jsx(
                 "div",
                 {
+                  ref: activeEventIndex === eventIndex ? activeEventRef : null,
+                  onClick: () => {
+                    if (onEventClick) {
+                      onEventClick(event, eventIndex);
+                    }
+                  },
+                  onContextMenu: (e) => {
+                    e.preventDefault();
+                    setContextMenu({
+                      visible: true,
+                      x: e.clientX,
+                      y: e.clientY,
+                      event
+                    });
+                  },
                   style: {
-                    padding: "8px 20px 12px 20px",
-                    backgroundColor: activeEventIndex === eventIndex ? theme.colors.muted : theme.colors.backgroundSecondary,
-                    borderBottom: `1px solid ${theme.colors.border}`,
-                    borderLeft: activeEventIndex === eventIndex ? `4px solid ${theme.colors.primary}` : "4px solid transparent",
-                    fontSize: theme.fontSizes[1],
-                    lineHeight: "1.7",
-                    fontWeight: 500,
-                    transition: "background-color 0.2s ease, border-color 0.2s ease",
-                    color: theme.colors.text
+                    cursor: onEventClick ? "pointer" : "default",
+                    transition: "all 0.2s ease"
                   },
-                  children: [
-                    renderFormattedText(renderedText),
-                    /* @__PURE__ */ jsx(SourceFileList, { sources: getEventSources(event.name), onSourceClick })
-                  ]
-                }
+                  children: /* @__PURE__ */ jsxs(
+                    "div",
+                    {
+                      style: {
+                        padding: "8px 20px 12px 20px",
+                        backgroundColor: activeEventIndex === eventIndex ? theme.colors.muted : theme.colors.backgroundSecondary,
+                        borderBottom: `1px solid ${theme.colors.border}`,
+                        borderLeft: activeEventIndex === eventIndex ? `4px solid ${theme.colors.primary}` : "4px solid transparent",
+                        fontSize: theme.fontSizes[1],
+                        lineHeight: "1.7",
+                        fontWeight: 500,
+                        transition: "background-color 0.2s ease, border-color 0.2s ease",
+                        color: theme.colors.text
+                      },
+                      children: [
+                        renderFormattedText(renderedText),
+                        /* @__PURE__ */ jsx(SourceFileList, { sources: getEventSources(event.name), onSourceClick })
+                      ]
+                    }
+                  )
+                },
+                `event-${eventIndex}`
               )
-            },
-            `event-${eventIndex}`
-          )
-        );
+            );
+          });
+        }
+      });
+      sortedEvents.forEach((event, eventIndex) => {
+        if (renderedEventIndices.has(eventIndex)) return;
       });
     }
     if (showOnlySummary && scenario.template.summary) {