@workflow/web 5.0.0-beta.24 → 5.0.0-beta.26

package/build/server/assets/{server-build-CpnmV4F1.js → server-build-0CazaFkH.js}

@@ -14,7 +14,11 @@ var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "
 var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
 var __superGet = (cls, obj, key) => __reflectGet(__getProtoOf(cls), key, obj);
 var _a2, _b, _c, _d, _listeners, _onabort, _reader, _root, _hasMagic, _uflag, _parts, _parent, _parentIndex, _negs, _filledNegs, _options, _toString, _emptyExt, _AST_instances, fillNegs_fn, _AST_static, parseAST_fn, canAdoptWithSpace_fn, canAdopt_fn, canAdoptType_fn, adoptWithSpace_fn, adopt_fn, canUsurpType_fn, canUsurp_fn, usurp_fn, flatten_fn, partsToRegExp_fn, parseGlob_fn, _Minimatch_instances, matchGlobstar_fn, matchGlobStarBodySections_fn, matchOne_fn, _worldPromise, _Run_instances, lazyWorldPromise_get, _encryptionKeyPromise, _resilientStart, getEncryptionKey_fn, getEncryptionKeyLazily_fn, pollReturnValue_fn;
-import { a as requireReact, S as ServerRouter, c as createReadableStreamFromReadable, r as reactExports, g as getDefaultExportFromCjs, R as React, b as ReactExports, w as withComponentProps, d as withErrorBoundaryProps, M as Meta, L as Links, e as ScrollRestoration, f as Scripts, O as Outlet, u as useNavigate, h as useSearchParams, i as Link$1, j as useRouteError, k as isRouteErrorResponse, l as useLocation, m as useParams } from "./app-1p4IhK-Q.js";
+import { createRequire as __wkfCreateRequire } from "node:module";
+if (typeof require === "undefined") {
+  globalThis.require = __wkfCreateRequire(import.meta.url);
+}
+import { a as requireReact, S as ServerRouter, c as createReadableStreamFromReadable, r as reactExports, g as getDefaultExportFromCjs, R as React, b as ReactExports, w as withComponentProps, d as withErrorBoundaryProps, M as Meta, L as Links, e as ScrollRestoration, f as Scripts, O as Outlet, u as useNavigate, h as useSearchParams, i as Link$1, j as useRouteError, k as isRouteErrorResponse, l as useLocation, m as useParams } from "./app-DQ35jFT1.js";
 import require$$0$4, { PassThrough } from "node:stream";
 import require$$0 from "util";
 import require$$1 from "crypto";
@@ -30043,6 +30047,54 @@ const getDefaultConfig = () => {
     orderSensitiveModifiers: ["*", "**", "after", "backdrop", "before", "details-content", "file", "first-letter", "first-line", "marker", "placeholder", "selection"]
   };
 };
+const mergeConfigs = (baseConfig, {
+  cacheSize,
+  prefix,
+  experimentalParseClassName,
+  extend: extend2 = {},
+  override = {}
+}) => {
+  overrideProperty(baseConfig, "cacheSize", cacheSize);
+  overrideProperty(baseConfig, "prefix", prefix);
+  overrideProperty(baseConfig, "experimentalParseClassName", experimentalParseClassName);
+  overrideConfigProperties(baseConfig.theme, override.theme);
+  overrideConfigProperties(baseConfig.classGroups, override.classGroups);
+  overrideConfigProperties(baseConfig.conflictingClassGroups, override.conflictingClassGroups);
+  overrideConfigProperties(baseConfig.conflictingClassGroupModifiers, override.conflictingClassGroupModifiers);
+  overrideProperty(baseConfig, "orderSensitiveModifiers", override.orderSensitiveModifiers);
+  mergeConfigProperties(baseConfig.theme, extend2.theme);
+  mergeConfigProperties(baseConfig.classGroups, extend2.classGroups);
+  mergeConfigProperties(baseConfig.conflictingClassGroups, extend2.conflictingClassGroups);
+  mergeConfigProperties(baseConfig.conflictingClassGroupModifiers, extend2.conflictingClassGroupModifiers);
+  mergeArrayProperties(baseConfig, extend2, "orderSensitiveModifiers");
+  return baseConfig;
+};
+const overrideProperty = (baseObject, overrideKey, overrideValue) => {
+  if (overrideValue !== void 0) {
+    baseObject[overrideKey] = overrideValue;
+  }
+};
+const overrideConfigProperties = (baseObject, overrideObject) => {
+  if (overrideObject) {
+    for (const key in overrideObject) {
+      overrideProperty(baseObject, key, overrideObject[key]);
+    }
+  }
+};
+const mergeConfigProperties = (baseObject, mergeObject) => {
+  if (mergeObject) {
+    for (const key in mergeObject) {
+      mergeArrayProperties(baseObject, mergeObject, key);
+    }
+  }
+};
+const mergeArrayProperties = (baseObject, mergeObject, key) => {
+  const mergeValue = mergeObject[key];
+  if (mergeValue !== void 0) {
+    baseObject[key] = baseObject[key] ? baseObject[key].concat(mergeValue) : mergeValue;
+  }
+};
+const extendTailwindMerge = (configExtension, ...createConfig) => typeof configExtension === "function" ? createTailwindMerge(getDefaultConfig, configExtension, ...createConfig) : createTailwindMerge(() => mergeConfigs(getDefaultConfig(), configExtension), ...createConfig);
 const twMerge = /* @__PURE__ */ createTailwindMerge(getDefaultConfig);
 function parseName(tag, name2) {
   if (typeof name2 !== "string") {
@@ -30707,102 +30759,78 @@ const __iconNode = [
   ["line", { x1: "8", x2: "14", y1: "11", y2: "11", key: "durymu" }]
 ];
 const ZoomOut = createLucideIcon("zoom-out", __iconNode);
-function cn$4(...inputs) {
-  return twMerge(clsx(inputs));
-}
-const MS_IN_SECOND = 1e3;
-const MS_IN_MINUTE = 60 * MS_IN_SECOND;
-const MS_IN_HOUR = 60 * MS_IN_MINUTE;
-const MS_IN_DAY = 24 * MS_IN_HOUR;
-function formatDuration(ms2, compact = false) {
-  if (ms2 === 0) {
-    return "0s";
-  }
-  if (ms2 < MS_IN_SECOND) {
-    const roundedMs2 = Math.round(ms2);
-    return roundedMs2 < MS_IN_SECOND ? `${roundedMs2}ms` : "1s";
-  }
-  const roundedMs = Math.round(ms2 / MS_IN_SECOND) * MS_IN_SECOND;
-  if (roundedMs < MS_IN_MINUTE) {
-    return `${Math.floor(roundedMs / MS_IN_SECOND)}s`;
-  }
-  if (compact) {
-    if (roundedMs < MS_IN_HOUR) {
-      const m3 = Math.floor(roundedMs / MS_IN_MINUTE);
-      const s2 = Math.floor(roundedMs % MS_IN_MINUTE / MS_IN_SECOND);
-      return s2 > 0 ? `${m3}m ${s2}s` : `${m3}m`;
-    }
-    const h2 = Math.floor(roundedMs / MS_IN_HOUR);
-    const m2 = Math.floor(roundedMs % MS_IN_HOUR / MS_IN_MINUTE);
-    return m2 > 0 ? `${h2}h ${m2}m` : `${h2}h`;
-  }
-  const days = Math.floor(roundedMs / MS_IN_DAY);
-  const hours = Math.floor(roundedMs % MS_IN_DAY / MS_IN_HOUR);
-  const minutes = Math.floor(roundedMs % MS_IN_HOUR / MS_IN_MINUTE);
-  const seconds = Math.floor(roundedMs % MS_IN_MINUTE / MS_IN_SECOND);
-  const parts = [];
-  if (days > 0) {
-    parts.push(`${days}d`);
-  }
-  if (hours > 0) {
-    parts.push(`${hours}h`);
-  }
-  if (minutes > 0) {
-    parts.push(`${minutes}m`);
-  }
-  parts.push(`${seconds}s`);
-  return parts.join(" ");
-}
-const preciseSecondsFormatter = new Intl.NumberFormat(void 0, {
-  minimumFractionDigits: 2,
-  maximumFractionDigits: 2
-});
-function formatDurationPrecise(ms2) {
-  if (ms2 === 0) {
-    return "0s";
-  }
-  if (ms2 < MS_IN_SECOND) {
-    const roundedMs = Math.round(ms2);
-    if (roundedMs < MS_IN_SECOND) {
-      return `${roundedMs}ms`;
+const twMergeConfig = {
+  extend: {
+    classGroups: {
+      "text-heading": [
+        {
+          "text-heading": [
+            "72",
+            "64",
+            "56",
+            "48",
+            "40",
+            "32",
+            "24",
+            "20",
+            "16",
+            "14"
+          ]
+        }
+      ],
+      "text-button": [
+        {
+          "text-button": ["16", "14", "12"]
+        }
+      ],
+      "text-label": [
+        {
+          "text-label": [
+            "20",
+            "18",
+            "16",
+            "14",
+            "14-mono",
+            "13",
+            "13-mono",
+            "12",
+            "12-mono"
+          ]
+        }
+      ],
+      "text-copy": [
+        {
+          "text-copy": ["24", "20", "18", "16", "14", "13", "13-mono"]
+        }
+      ],
+      material: [
+        {
+          material: [
+            "base",
+            "small",
+            "medium",
+            "large",
+            "tooltip",
+            "menu",
+            "modal",
+            "fullscreen"
+          ]
+        }
+      ]
+    },
+    // Make each category conflict with itself, so e.g. text-heading-32 overrides text-heading-24
+    conflictingClassGroups: {
+      "text-heading": ["text-heading"],
+      "text-button": ["text-button"],
+      "text-label": ["text-label"],
+      "text-copy": ["text-copy"],
+      material: ["material"]
     }
   }
-  const normalizedMs = Math.round(ms2 / 10) * 10;
-  if (normalizedMs < MS_IN_MINUTE) {
-    return `${preciseSecondsFormatter.format(normalizedMs / MS_IN_SECOND)}s`;
-  }
-  const days = Math.floor(normalizedMs / MS_IN_DAY);
-  const hours = Math.floor(normalizedMs % MS_IN_DAY / MS_IN_HOUR);
-  const minutes = Math.floor(normalizedMs % MS_IN_HOUR / MS_IN_MINUTE);
-  const seconds = normalizedMs % MS_IN_MINUTE / MS_IN_SECOND;
-  const parts = [];
-  if (days > 0) {
-    parts.push(`${days}d`);
-  }
-  if (hours > 0) {
-    parts.push(`${hours}h`);
-  }
-  if (minutes > 0) {
-    parts.push(`${minutes}m`);
-  }
-  parts.push(`${preciseSecondsFormatter.format(seconds)}s`);
-  return parts.join(" ");
-}
-function isDoStreamStep(stepName) {
-  return stepName.endsWith("//doStreamStep");
-}
-function extractConversation(stepInput) {
-  if (!Array.isArray(stepInput) || stepInput.length === 0) {
-    return null;
-  }
-  const firstArg = stepInput[0];
-  if (!Array.isArray(firstArg)) {
-    return null;
-  }
-  if (!firstArg.every((msg) => msg && typeof msg === "object" && "role" in msg)) {
-    return null;
-  }
-  return firstArg;
+};
+const customTwMerge = extendTailwindMerge(twMergeConfig);
+function cn$4(...classes) {
+  return customTwMerge(clsx(...classes));
 }
 function ErrorCard({ title, className, details = "Unknown error" }) {
   const [isExpanded, setIsExpanded] = reactExports.useState(false);
@@ -49884,7 +49912,7 @@ function replaceEncryptedAndExpiredWithMarkers(resource) {
 async function hydrateResourceIOWithKey(resource, key) {
   const { hydrateDataWithKey: hydrateDataWithKey2 } = await Promise.resolve().then(() => serializationFormat);
   const { importKey: importKey2 } = await Promise.resolve().then(() => encryption);
-  const { ensureZstdDecoderRegistered } = await import("./zstd-browser-decoder-embi2ab_.js");
+  const { ensureZstdDecoderRegistered } = await import("./zstd-browser-decoder-pCjqxVHM.js");
   ensureZstdDecoderRegistered();
   const cryptoKey = await importKey2(key);
   const revivers = getRevivers();
@@ -51026,6 +51054,100 @@ const ToastContext = reactExports.createContext(defaultAdapter);
 function useToast() {
   return reactExports.useContext(ToastContext);
 }
+const MS_IN_SECOND = 1e3;
+const MS_IN_MINUTE = 60 * MS_IN_SECOND;
+const MS_IN_HOUR = 60 * MS_IN_MINUTE;
+const MS_IN_DAY = 24 * MS_IN_HOUR;
+function formatDuration(ms2, compact = false) {
+  if (ms2 === 0) {
+    return "0s";
+  }
+  if (ms2 < MS_IN_SECOND) {
+    const roundedMs2 = Math.round(ms2);
+    return roundedMs2 < MS_IN_SECOND ? `${roundedMs2}ms` : "1s";
+  }
+  const roundedMs = Math.round(ms2 / MS_IN_SECOND) * MS_IN_SECOND;
+  if (roundedMs < MS_IN_MINUTE) {
+    return `${Math.floor(roundedMs / MS_IN_SECOND)}s`;
+  }
+  if (compact) {
+    if (roundedMs < MS_IN_HOUR) {
+      const m3 = Math.floor(roundedMs / MS_IN_MINUTE);
+      const s2 = Math.floor(roundedMs % MS_IN_MINUTE / MS_IN_SECOND);
+      return s2 > 0 ? `${m3}m ${s2}s` : `${m3}m`;
+    }
+    const h2 = Math.floor(roundedMs / MS_IN_HOUR);
+    const m2 = Math.floor(roundedMs % MS_IN_HOUR / MS_IN_MINUTE);
+    return m2 > 0 ? `${h2}h ${m2}m` : `${h2}h`;
+  }
+  const days = Math.floor(roundedMs / MS_IN_DAY);
+  const hours = Math.floor(roundedMs % MS_IN_DAY / MS_IN_HOUR);
+  const minutes = Math.floor(roundedMs % MS_IN_HOUR / MS_IN_MINUTE);
+  const seconds = Math.floor(roundedMs % MS_IN_MINUTE / MS_IN_SECOND);
+  const parts = [];
+  if (days > 0) {
+    parts.push(`${days}d`);
+  }
+  if (hours > 0) {
+    parts.push(`${hours}h`);
+  }
+  if (minutes > 0) {
+    parts.push(`${minutes}m`);
+  }
+  parts.push(`${seconds}s`);
+  return parts.join(" ");
+}
+const preciseSecondsFormatter = new Intl.NumberFormat(void 0, {
+  minimumFractionDigits: 2,
+  maximumFractionDigits: 2
+});
+function formatDurationPrecise(ms2) {
+  if (ms2 === 0) {
+    return "0s";
+  }
+  if (ms2 < MS_IN_SECOND) {
+    const roundedMs = Math.round(ms2);
+    if (roundedMs < MS_IN_SECOND) {
+      return `${roundedMs}ms`;
+    }
+  }
+  const normalizedMs = Math.round(ms2 / 10) * 10;
+  if (normalizedMs < MS_IN_MINUTE) {
+    return `${preciseSecondsFormatter.format(normalizedMs / MS_IN_SECOND)}s`;
+  }
+  const days = Math.floor(normalizedMs / MS_IN_DAY);
+  const hours = Math.floor(normalizedMs % MS_IN_DAY / MS_IN_HOUR);
+  const minutes = Math.floor(normalizedMs % MS_IN_HOUR / MS_IN_MINUTE);
+  const seconds = normalizedMs % MS_IN_MINUTE / MS_IN_SECOND;
+  const parts = [];
+  if (days > 0) {
+    parts.push(`${days}d`);
+  }
+  if (hours > 0) {
+    parts.push(`${hours}h`);
+  }
+  if (minutes > 0) {
+    parts.push(`${minutes}m`);
+  }
+  parts.push(`${preciseSecondsFormatter.format(seconds)}s`);
+  return parts.join(" ");
+}
+function isDoStreamStep(stepName) {
+  return stepName.endsWith("//doStreamStep");
+}
+function extractConversation(stepInput) {
+  if (!Array.isArray(stepInput) || stepInput.length === 0) {
+    return null;
+  }
+  const firstArg = stepInput[0];
+  if (!Array.isArray(firstArg)) {
+    return null;
+  }
+  if (!firstArg.every((msg) => msg && typeof msg === "object" && "role" in msg)) {
+    return null;
+  }
+  return firstArg;
+}
 function CopyButton({ copyText, ariaLabel, className }) {
   const [copied, setCopied] = reactExports.useState(false);
   const timeoutRef = reactExports.useRef(null);
@@ -52777,6 +52899,18 @@ function formatEventTime(date2) {
     hour12: false
   }) + "." + date2.getMilliseconds().toString().padStart(3, "0");
 }
+function parseEventDate(value) {
+  if (value == null)
+    return null;
+  const date2 = value instanceof Date ? value : new Date(String(value));
+  return Number.isNaN(date2.getTime()) ? null : date2;
+}
+function getEffectiveEventDate$1(event) {
+  return parseEventDate(event.occurredAt) ?? new Date(event.createdAt);
+}
+function getEffectiveEventTime(event) {
+  return getEffectiveEventDate$1(event).getTime();
+}
 function formatEventType(eventType) {
   return eventType.split("_").map((word) => word.charAt(0).toUpperCase() + word.slice(1)).join(" ");
 }
@@ -52817,13 +52951,13 @@ function buildNameMaps(events2, run2) {
   return { correlationNameMap, workflowName };
 }
 function buildDurationMap(events2) {
-  const chronological = [...events2].sort((a2, b2) => new Date(a2.createdAt).getTime() - new Date(b2.createdAt).getTime());
+  const chronological = [...events2].sort((a2, b2) => getEffectiveEventTime(a2) - getEffectiveEventTime(b2));
   const createdTimes = /* @__PURE__ */ new Map();
   const firstStartedTimes = /* @__PURE__ */ new Map();
   const startedTimes = /* @__PURE__ */ new Map();
   const durations = /* @__PURE__ */ new Map();
   for (const event of chronological) {
-    const ts = new Date(event.createdAt).getTime();
+    const ts = getEffectiveEventTime(event);
     const key = event.correlationId ?? "__run__";
     const type = event.eventType;
     if (type === "step_created" || type === "run_created") {
@@ -53046,7 +53180,7 @@ const SORT_OPTIONS = [
   { value: "desc", label: "Newest" },
   { value: "asc", label: "Oldest" }
 ];
-function RowsSkeleton() {
+function RowsSkeleton({ showSeparateEventOccurrenceTimestamps = false }) {
   return jsxRuntimeExports.jsx("div", { className: "flex-1 overflow-hidden", children: Array.from({ length: 16 }, (_2, i) => jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-0", style: { height: 40 }, children: [jsxRuntimeExports.jsxs("div", { className: "relative flex-shrink-0 self-stretch flex items-center", style: { width: GUTTER_WIDTH }, children: [jsxRuntimeExports.jsx("div", { style: {
     position: "absolute",
     left: 8,
@@ -53058,9 +53192,9 @@ function RowsSkeleton() {
     height: i % 4 === 0 ? 8 : 6,
     borderRadius: "50%",
     marginLeft: i % 4 === 0 ? 5 : 6
-  } })] }), jsxRuntimeExports.jsx("div", { className: "w-5 flex-shrink-0 flex items-center justify-center", children: jsxRuntimeExports.jsx(Skeleton$2, { className: "w-5 h-5", style: { borderRadius: 4 } }) }), jsxRuntimeExports.jsx("div", { className: "min-w-0 px-4", style: { flex: "2 1 0%" }, children: jsxRuntimeExports.jsx(Skeleton$2, { className: "h-3", style: { width: "70%" } }) }), jsxRuntimeExports.jsxs("div", { className: "min-w-0 px-4 flex items-center gap-1.5", style: { flex: "2 1 0%" }, children: [jsxRuntimeExports.jsx(Skeleton$2, { className: "flex-shrink-0", style: { width: 6, height: 6, borderRadius: "50%" } }), jsxRuntimeExports.jsx(Skeleton$2, { className: "h-3", style: { width: "60%" } })] }), jsxRuntimeExports.jsx("div", { className: "min-w-0 px-4", style: { flex: "2 1 0%" }, children: jsxRuntimeExports.jsx(Skeleton$2, { className: "h-3", style: { width: "50%" } }) }), jsxRuntimeExports.jsx("div", { className: "min-w-0 px-4", style: { flex: "3 1 0%" }, children: jsxRuntimeExports.jsx(Skeleton$2, { className: "h-3", style: { width: "75%" } }) }), jsxRuntimeExports.jsx("div", { className: "min-w-0 px-4", style: { flex: "3 1 0%" }, children: jsxRuntimeExports.jsx(Skeleton$2, { className: "h-3", style: { width: "75%" } }) })] }, i)) });
+  } })] }), jsxRuntimeExports.jsx("div", { className: "w-5 flex-shrink-0 flex items-center justify-center", children: jsxRuntimeExports.jsx(Skeleton$2, { className: "w-5 h-5", style: { borderRadius: 4 } }) }), showSeparateEventOccurrenceTimestamps && jsxRuntimeExports.jsx("div", { className: "min-w-0 px-4", style: { flex: "2 1 0%" }, children: jsxRuntimeExports.jsx(Skeleton$2, { className: "h-3", style: { width: "70%" } }) }), jsxRuntimeExports.jsx("div", { className: "min-w-0 px-4", style: { flex: "2 1 0%" }, children: jsxRuntimeExports.jsx(Skeleton$2, { className: "h-3", style: { width: "70%" } }) }), jsxRuntimeExports.jsxs("div", { className: "min-w-0 px-4 flex items-center gap-1.5", style: { flex: "2 1 0%" }, children: [jsxRuntimeExports.jsx(Skeleton$2, { className: "flex-shrink-0", style: { width: 6, height: 6, borderRadius: "50%" } }), jsxRuntimeExports.jsx(Skeleton$2, { className: "h-3", style: { width: "60%" } })] }), jsxRuntimeExports.jsx("div", { className: "min-w-0 px-4", style: { flex: "2 1 0%" }, children: jsxRuntimeExports.jsx(Skeleton$2, { className: "h-3", style: { width: "50%" } }) }), jsxRuntimeExports.jsx("div", { className: "min-w-0 px-4", style: { flex: "3 1 0%" }, children: jsxRuntimeExports.jsx(Skeleton$2, { className: "h-3", style: { width: "75%" } }) }), jsxRuntimeExports.jsx("div", { className: "min-w-0 px-4", style: { flex: "3 1 0%" }, children: jsxRuntimeExports.jsx(Skeleton$2, { className: "h-3", style: { width: "75%" } }) })] }, i)) });
 }
-function EventRow$1({ event, index: index2, isFirst, isLast, isExpanded, onToggleExpand, activeGroupKey, selectedGroupKey, selectedGroupRange, correlationNameMap, workflowName, durationMap, onSelectGroup, onHoverGroup, onLoadEventData, cachedEventData, onCacheEventData, encryptionKey, onEncryptedDataDetected, suppressGroupDimming = false }) {
+function EventRow$1({ event, index: index2, isFirst, isLast, isExpanded, onToggleExpand, activeGroupKey, selectedGroupKey, selectedGroupRange, correlationNameMap, workflowName, durationMap, onSelectGroup, onHoverGroup, onLoadEventData, cachedEventData, onCacheEventData, encryptionKey, onEncryptedDataDetected, suppressGroupDimming = false, showSeparateEventOccurrenceTimestamps = false }) {
   const [isLoading, setIsLoading] = reactExports.useState(false);
   const [loadedEventData, setLoadedEventData] = reactExports.useState(cachedEventData);
   const [loadError, setLoadError] = reactExports.useState(null);
@@ -53073,6 +53207,8 @@ function EventRow$1({ event, index: index2, isFirst, isLast, isExpanded, onToggl
   const rowGroupKey = isRunLevel(event.eventType) ? "__run__" : event.correlationId ?? void 0;
   const statusDotColor = getStatusDotColor(event.eventType);
   const createdAt = new Date(event.createdAt);
+  const occurredAt = parseEventDate(event.occurredAt);
+  const displayedCreatedAt = showSeparateEventOccurrenceTimestamps ? createdAt : getEffectiveEventDate$1(event);
   const hasExistingEventData = "eventData" in event && event.eventData != null;
   const isRun = isRunLevel(event.eventType);
   const eventName2 = isRun ? workflowName ?? "-" : event.correlationId ? correlationNameMap.get(event.correlationId) ?? "-" : "-";
@@ -53176,7 +53312,7 @@ function EventRow$1({ event, index: index2, isFirst, isLast, isExpanded, onToggl
   }, children: jsxRuntimeExports.jsx(ChevronRight, { className: "h-3 w-3 transition-transform", style: {
     color: "var(--ds-gray-900)",
     transform: isExpanded ? "rotate(90deg)" : "rotate(0deg)"
-  } }) }), jsxRuntimeExports.jsx("div", { className: "tabular-nums min-w-0 px-4", style: { color: "var(--ds-gray-900)", flex: "2 1 0%" }, children: jsxRuntimeExports.jsx(TimestampTooltip, { date: createdAt, children: jsxRuntimeExports.jsx("span", { children: formatEventTime(createdAt) }) }) }), jsxRuntimeExports.jsx("div", { className: "font-medium min-w-0 px-4", style: { flex: "2 1 0%" }, children: jsxRuntimeExports.jsxs("span", { className: "inline-flex items-center gap-1.5", style: { color: "var(--ds-gray-900)" }, children: [jsxRuntimeExports.jsxs("span", { style: {
+  } }) }), showSeparateEventOccurrenceTimestamps && jsxRuntimeExports.jsx("div", { className: "tabular-nums min-w-0 px-4", style: { color: "var(--ds-gray-900)", flex: "2 1 0%" }, children: occurredAt ? jsxRuntimeExports.jsx(TimestampTooltip, { date: occurredAt, children: jsxRuntimeExports.jsx("span", { children: formatEventTime(occurredAt) }) }) : "-" }), jsxRuntimeExports.jsx("div", { className: "tabular-nums min-w-0 px-4", style: { color: "var(--ds-gray-900)", flex: "2 1 0%" }, children: jsxRuntimeExports.jsx(TimestampTooltip, { date: displayedCreatedAt, children: jsxRuntimeExports.jsx("span", { children: formatEventTime(displayedCreatedAt) }) }) }), jsxRuntimeExports.jsx("div", { className: "font-medium min-w-0 px-4", style: { flex: "2 1 0%" }, children: jsxRuntimeExports.jsxs("span", { className: "inline-flex items-center gap-1.5", style: { color: "var(--ds-gray-900)" }, children: [jsxRuntimeExports.jsxs("span", { style: {
     position: "relative",
     display: "inline-flex",
     width: 6,
@@ -53205,7 +53341,7 @@ function EventRow$1({ event, index: index2, isFirst, isLast, isExpanded, onToggl
     color: "var(--ds-red-900)"
   }, children: loadError }) : isLoading || loadedEventData === null && !hasAttemptedLoad && event.correlationId ? jsxRuntimeExports.jsxs("div", { className: "flex flex-col gap-2 p-3", children: [jsxRuntimeExports.jsx(Skeleton$2, { className: "h-3", style: { width: "75%" } }), jsxRuntimeExports.jsx(Skeleton$2, { className: "h-3", style: { width: "50%" } }), jsxRuntimeExports.jsx(Skeleton$2, { className: "h-3", style: { width: "60%" } })] }) : jsxRuntimeExports.jsx("div", { className: "p-2 text-xs", style: { color: "var(--ds-gray-900)" }, children: "No data" })] })] })] });
 }
-function EventListViewInner({ events: events2, run: run2, onLoadEventData, hasMoreEvents = false, isLoadingMoreEvents = false, onLoadMoreEvents, encryptionKey, isLoading = false, sortOrder: sortOrderProp, onSortOrderChange, onDecrypt, isDecrypting = false, hasEncryptedData: hasEncryptedDataProp = false, onExactIdSearch }) {
+function EventListViewInner({ events: events2, run: run2, onLoadEventData, hasMoreEvents = false, isLoadingMoreEvents = false, onLoadMoreEvents, encryptionKey, isLoading = false, sortOrder: sortOrderProp, onSortOrderChange, onDecrypt, isDecrypting = false, hasEncryptedData: hasEncryptedDataProp = false, onExactIdSearch, showSeparateEventOccurrenceTimestamps = false }) {
   const toast2 = useToast();
   const [internalSortOrder, setInternalSortOrder] = reactExports.useState("asc");
   const effectiveSortOrder = sortOrderProp ?? internalSortOrder;
@@ -53231,7 +53367,7 @@ function EventListViewInner({ events: events2, run: run2, onLoadEventData, hasMo
     if (sourceEvents.length === 0)
       return [];
     const dir = effectiveSortOrder === "desc" ? -1 : 1;
-    return [...sourceEvents].sort((a2, b2) => dir * (new Date(a2.createdAt).getTime() - new Date(b2.createdAt).getTime()));
+    return [...sourceEvents].sort((a2, b2) => dir * (getEffectiveEventTime(a2) - getEffectiveEventTime(b2)));
   }, [events2, effectiveSortOrder, isExactSearchActive, searchResults]);
   const hasEncryptedInlineData = reactExports.useMemo(() => {
     const sourceEvents = isExactSearchActive ? searchResults : events2;
@@ -53459,14 +53595,14 @@ function EventListViewInner({ events: events2, run: run2, onLoadEventData, hasMo
     borderColor: "var(--ds-gray-alpha-200)",
     color: "var(--ds-gray-900)",
     backgroundColor: "var(--ds-background-100)"
-  }, children: [jsxRuntimeExports.jsx("div", { className: "flex-shrink-0", style: { width: GUTTER_WIDTH } }), jsxRuntimeExports.jsx("div", { className: "w-5 flex-shrink-0" }), jsxRuntimeExports.jsx("div", { className: "min-w-0 px-4", style: { flex: "2 1 0%" }, children: "Time" }), jsxRuntimeExports.jsx("div", { className: "min-w-0 px-4", style: { flex: "2 1 0%" }, children: "Event Type" }), jsxRuntimeExports.jsx("div", { className: "min-w-0 px-4", style: { flex: "2 1 0%" }, children: "Name" }), jsxRuntimeExports.jsx("div", { className: "min-w-0 px-4", style: { flex: "3 1 0%" }, children: "Correlation ID" }), jsxRuntimeExports.jsx("div", { className: "min-w-0 px-4", style: { flex: "3 1 0%" }, children: "Event ID" })] }), isRefetching || searchLoading ? jsxRuntimeExports.jsx(RowsSkeleton, {}) : sortedEvents2.length === 0 ? jsxRuntimeExports.jsx("div", { className: "flex flex-1 items-center justify-center px-6 text-center text-sm", style: { color: "var(--ds-gray-700)" }, children: searchNotFound && searchQuery.trim() ? `No events found for ${searchQuery.trim()}` : searchError ? searchError : parsedSearchId && searchQuery.trim() && !onExactIdSearch ? "Exact ID search is unavailable in this view." : "No events found" }) : jsxRuntimeExports.jsx(Yr, { ref: virtuosoRef, totalCount: sortedEvents2.length, overscan: 20, defaultItemHeight: 40, endReached: () => {
+  }, children: [jsxRuntimeExports.jsx("div", { className: "flex-shrink-0", style: { width: GUTTER_WIDTH } }), jsxRuntimeExports.jsx("div", { className: "w-5 flex-shrink-0" }), showSeparateEventOccurrenceTimestamps && jsxRuntimeExports.jsx("div", { className: "min-w-0 px-4", style: { flex: "2 1 0%" }, children: "Occurred" }), jsxRuntimeExports.jsx("div", { className: "min-w-0 px-4", style: { flex: "2 1 0%" }, children: "Created" }), jsxRuntimeExports.jsx("div", { className: "min-w-0 px-4", style: { flex: "2 1 0%" }, children: "Event Type" }), jsxRuntimeExports.jsx("div", { className: "min-w-0 px-4", style: { flex: "2 1 0%" }, children: "Name" }), jsxRuntimeExports.jsx("div", { className: "min-w-0 px-4", style: { flex: "3 1 0%" }, children: "Correlation ID" }), jsxRuntimeExports.jsx("div", { className: "min-w-0 px-4", style: { flex: "3 1 0%" }, children: "Event ID" })] }), isRefetching || searchLoading ? jsxRuntimeExports.jsx(RowsSkeleton, { showSeparateEventOccurrenceTimestamps }) : sortedEvents2.length === 0 ? jsxRuntimeExports.jsx("div", { className: "flex flex-1 items-center justify-center px-6 text-center text-sm", style: { color: "var(--ds-gray-700)" }, children: searchNotFound && searchQuery.trim() ? `No events found for ${searchQuery.trim()}` : searchError ? searchError : parsedSearchId && searchQuery.trim() && !onExactIdSearch ? "Exact ID search is unavailable in this view." : "No events found" }) : jsxRuntimeExports.jsx(Yr, { ref: virtuosoRef, totalCount: sortedEvents2.length, overscan: 20, defaultItemHeight: 40, endReached: () => {
     if (isExactSearchActive || !hasMoreEvents || isLoadingMoreEvents) {
       return;
     }
     void (onLoadMoreEvents == null ? void 0 : onLoadMoreEvents());
   }, itemContent: (index2) => {
     const ev = sortedEvents2[index2];
-    return jsxRuntimeExports.jsx(EventRow$1, { event: ev, index: index2, isFirst: index2 === 0, isLast: index2 === sortedEvents2.length - 1, isExpanded: expandedEventIds.has(ev.eventId), onToggleExpand: toggleEventExpanded, activeGroupKey, selectedGroupKey, selectedGroupRange, correlationNameMap, workflowName, durationMap, onSelectGroup, onHoverGroup, onLoadEventData, cachedEventData: eventDataCacheRef.current.get(ev.eventId) ?? null, onCacheEventData: cacheEventData, encryptionKey, onEncryptedDataDetected: handleEncryptedDataDetected, suppressGroupDimming: isExactSearchActive });
+    return jsxRuntimeExports.jsx(EventRow$1, { event: ev, index: index2, isFirst: index2 === 0, isLast: index2 === sortedEvents2.length - 1, isExpanded: expandedEventIds.has(ev.eventId), onToggleExpand: toggleEventExpanded, activeGroupKey, selectedGroupKey, selectedGroupRange, correlationNameMap, workflowName, durationMap, onSelectGroup, onHoverGroup, onLoadEventData, cachedEventData: eventDataCacheRef.current.get(ev.eventId) ?? null, onCacheEventData: cacheEventData, encryptionKey, onEncryptedDataDetected: handleEncryptedDataDetected, suppressGroupDimming: isExactSearchActive, showSeparateEventOccurrenceTimestamps });
   }, style: { flex: 1, minHeight: 0 } }), jsxRuntimeExports.jsxs("div", { className: "relative flex-shrink-0 flex items-center h-10 border-t px-4 text-xs", style: {
     borderColor: "var(--ds-gray-alpha-200)",
     color: "var(--ds-gray-900)",
@@ -53728,6 +53864,22 @@ function HookResolveModalWrapper({ hookActions }) {
   const { selectedHook, closeResolveModal, handleResolve, isResolving } = hookActions;
   return jsxRuntimeExports.jsx(ResolveHookModal, { isOpen: selectedHook !== null, onClose: closeResolveModal, onSubmit: handleResolve, isSubmitting: isResolving });
 }
+const COL_TEMPLATE = "340px 1px minmax(50px, 1fr)";
+const ROWS = [
+  { id: "r0", name: 62, off: 0, bar: 72 },
+  { id: "r1", name: 78, off: 6, bar: 48 },
+  { id: "r2", name: 50, off: 10, bar: 55 },
+  { id: "r3", name: 84, off: 18, bar: 30 },
+  { id: "r4", name: 45, off: 18, bar: 42 },
+  { id: "r5", name: 66, off: 34, bar: 38 },
+  { id: "r6", name: 55, off: 41, bar: 25 },
+  { id: "r7", name: 40, off: 50, bar: 30 }
+];
+const HEADER_MARKERS = ["m0", "m1", "m2", "m3"];
+const HeaderDivider = () => jsxRuntimeExports.jsx("div", { className: "flex justify-center", children: jsxRuntimeExports.jsx("span", { "aria-hidden": true, className: "h-full w-px bg-gray-alpha-400" }) });
+function TraceViewerSkeleton() {
+  return jsxRuntimeExports.jsxs("output", { "aria-busy": "true", "aria-label": "Loading trace", className: "flex flex-col w-full h-full min-h-0 bg-background-100", children: [jsxRuntimeExports.jsx("span", { className: "sr-only", children: "Loading trace…" }), jsxRuntimeExports.jsxs("div", { className: "shrink-0 grid", style: { gridTemplateColumns: COL_TEMPLATE }, children: [jsxRuntimeExports.jsxs("div", { className: "h-10 min-h-10 flex items-center border-b border-gray-alpha-400 pl-4 pr-2 gap-1.5", children: [jsxRuntimeExports.jsx(Skeleton$2, { className: "w-3.5 h-3.5 shrink-0 rounded-sm" }), jsxRuntimeExports.jsx(Skeleton$2, { className: "h-3.5 w-40" })] }), jsxRuntimeExports.jsx(HeaderDivider, {}), jsxRuntimeExports.jsx("div", { className: "h-10 min-h-10 flex items-end border-b border-gray-alpha-400 px-4 pb-1 gap-2", children: jsxRuntimeExports.jsx("div", { className: "relative flex-1 flex items-end justify-between", children: HEADER_MARKERS.map((id2) => jsxRuntimeExports.jsx(Skeleton$2, { className: "h-3.5 w-9" }, id2)) }) })] }), jsxRuntimeExports.jsxs("div", { className: "grid flex-1 min-h-0 overflow-hidden", style: { gridTemplateColumns: COL_TEMPLATE }, children: [jsxRuntimeExports.jsx("div", { className: "block overflow-visible", children: jsxRuntimeExports.jsx("ul", { className: "block divide-y divide-gray-alpha-400 border-b border-gray-alpha-400", children: ROWS.map((row) => jsxRuntimeExports.jsxs("li", { className: "h-10 flex items-center pl-4 pr-2", children: [jsxRuntimeExports.jsxs("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: [jsxRuntimeExports.jsx(Skeleton$2, { className: "w-4 h-4 shrink-0 rounded-sm" }), jsxRuntimeExports.jsx(Skeleton$2, { className: "h-3.5", style: { width: `${row.name}%` } })] }), jsxRuntimeExports.jsx(Skeleton$2, { className: "ml-2 h-3.5 w-10 shrink-0" })] }, row.id)) }) }), jsxRuntimeExports.jsx("span", { "aria-hidden": true, className: "h-full w-px bg-gray-alpha-400" }), jsxRuntimeExports.jsx("div", { className: "relative min-h-0", children: ROWS.map((row) => jsxRuntimeExports.jsx("div", { className: "relative h-10", children: jsxRuntimeExports.jsx("div", { className: "absolute inset-x-4 inset-y-0", children: jsxRuntimeExports.jsx(Skeleton$2, { className: "absolute top-1/2 -translate-y-1/2 h-6 rounded-[0.25rem]", style: { left: `${row.off}%`, width: `${row.bar}%` } }) }) }, row.id)) })] })] });
+}
 function shouldShowVerticalLine(eventType) {
   if (eventType === "hook_created" || eventType === "hook_received" || eventType === "hook_disposed") {
     return true;
@@ -53783,24 +53935,17 @@ const MARKER_EVENT_TYPES = /* @__PURE__ */ new Set([
   "wait_completed",
   "attr_set"
 ]);
-const findEventByType = (events2, eventTypes) => {
-  for (const eventType of eventTypes) {
-    const event = events2.find((e) => e.eventType === eventType);
-    if (event)
-      return event;
-  }
-  return void 0;
-};
-const withOccurredAt = (entity, occurredAt) => {
-  if (!occurredAt || entity.occurredAt != null) {
-    return entity;
-  }
-  return { ...entity, occurredAt };
+const getEventTimestamp = (event) => {
+  const value = (event == null ? void 0 : event.occurredAt) ?? (event == null ? void 0 : event.createdAt);
+  if (!value)
+    return void 0;
+  const date2 = value instanceof Date ? value : new Date(value);
+  return Number.isNaN(date2.getTime()) ? void 0 : date2;
 };
-function convertEventsToSpanEvents(events2, filterTypes = true) {
+function convertEventsToSpanEvents(events2, filterTypes = true, options = {}) {
   return events2.filter((event) => filterTypes ? MARKER_EVENT_TYPES.has(event.eventType) : true).map((event) => ({
     name: event.eventType,
-    timestamp: dateToOtelTime(event.createdAt),
+    timestamp: dateToOtelTime(options.preferOccurredAt ? getEventTimestamp(event) ?? event.createdAt : event.createdAt),
     attributes: {
       eventId: event.eventId,
       correlationId: event.correlationId,
@@ -53817,13 +53962,13 @@ const waitEventsToWaitEntity = (events2) => {
     return null;
   }
   const completedEvent = events2.find((event) => event.eventType === "wait_completed");
-  return withOccurredAt({
+  return {
     waitId: startEvent.correlationId,
     runId: startEvent.runId,
-    createdAt: startEvent.createdAt,
+    createdAt: getEventTimestamp(startEvent) ?? startEvent.createdAt,
     resumeAt: ((_a3 = startEvent.eventData) == null ? void 0 : _a3.resumeAt) ? new Date(startEvent.eventData.resumeAt) : void 0,
-    completedAt: completedEvent == null ? void 0 : completedEvent.createdAt
-  }, startEvent.occurredAt);
+    completedAt: getEventTimestamp(completedEvent)
+  };
 };
 function waitToSpan(events2, maxEndTime, fallbackEndTime = maxEndTime) {
   const wait = waitEventsToWaitEntity(events2);
@@ -53879,16 +54024,16 @@ const stepEventsToStepEntity = (events2) => {
         status = "running";
         attempt += 1;
         if (!startedAt)
-          startedAt = e.createdAt;
+          startedAt = getEventTimestamp(e) ?? e.createdAt;
         completedAt = void 0;
         break;
       case "step_completed":
         status = "completed";
-        completedAt = e.createdAt;
+        completedAt = getEventTimestamp(e) ?? e.createdAt;
         break;
       case "step_failed":
         status = "failed";
-        completedAt = e.createdAt;
+        completedAt = getEventTimestamp(e) ?? e.createdAt;
         break;
       case "step_retrying":
         status = "pending";
@@ -53899,19 +54044,18 @@ const stepEventsToStepEntity = (events2) => {
   if (attempt === 0)
     attempt = 1;
   const lastEvent = events2[events2.length - 1];
-  const occurrenceEvent = findEventByType(events2, ["step_created", "step_started"]) ?? anchorEvent;
-  return withOccurredAt({
+  return {
     stepId: anchorEvent.correlationId ?? "",
     runId: anchorEvent.runId,
     stepName: ((_a3 = createdEvent == null ? void 0 : createdEvent.eventData) == null ? void 0 : _a3.stepName) ?? "",
     status,
     attempt,
-    createdAt: anchorEvent.createdAt,
-    updatedAt: (lastEvent == null ? void 0 : lastEvent.createdAt) ?? anchorEvent.createdAt,
+    createdAt: getEventTimestamp(anchorEvent) ?? anchorEvent.createdAt,
+    updatedAt: getEventTimestamp(lastEvent) ?? (lastEvent == null ? void 0 : lastEvent.createdAt) ?? anchorEvent.createdAt,
     startedAt,
     completedAt,
     specVersion: anchorEvent.specVersion
-  }, occurrenceEvent.occurredAt);
+  };
 };
 function stepToSpan(stepEvents, maxEndTime) {
   const step = stepEventsToStepEntity(stepEvents);
@@ -53924,13 +54068,20 @@ function stepToSpan(stepEvents, maxEndTime) {
     data: step
   };
   const resource = "step";
-  const endTime = new Date(step.completedAt ?? maxEndTime);
-  const events2 = convertEventsToSpanEvents(stepEvents, false);
-  const spanStartTime = new Date(step.createdAt);
+  const events2 = convertEventsToSpanEvents(stepEvents, false, {
+    preferOccurredAt: true
+  });
+  const spanStartEvent = stepEvents.find((event) => event.eventType === "step_created") ?? stepEvents[0];
+  const spanStartTime = getEventTimestamp(spanStartEvent) ?? new Date(step.createdAt);
   let activeStartTime = step.startedAt ? new Date(step.startedAt) : void 0;
   const firstStartEvent = stepEvents.find((event) => event.eventType === "step_started");
   if (firstStartEvent) {
-    activeStartTime = new Date(firstStartEvent.createdAt);
+    activeStartTime = getEventTimestamp(firstStartEvent) ?? new Date(firstStartEvent.createdAt);
+  }
+  let endTime = new Date(maxEndTime);
+  if (step.completedAt) {
+    const completedEvent = stepEvents.slice().reverse().find((event) => event.eventType === "step_completed" || event.eventType === "step_failed");
+    endTime = getEventTimestamp(completedEvent) ?? new Date(step.completedAt);
   }
   return {
     spanId: String(step.stepId),
@@ -53952,7 +54103,7 @@ function stepToSpan(stepEvents, maxEndTime) {
   };
 }
 const hookEventsToHookEntity = (events2) => {
-  var _a3, _b2;
+  var _a3;
   const createdEvent = events2.find((event) => event.eventType === "hook_created");
   if (!createdEvent) {
     return null;
@@ -53960,15 +54111,15 @@ const hookEventsToHookEntity = (events2) => {
   const receivedEvents = events2.filter((event) => event.eventType === "hook_received");
   const disposedEvents = events2.filter((event) => event.eventType === "hook_disposed");
   const lastReceivedEvent = receivedEvents.at(-1);
-  return withOccurredAt({
+  return {
     hookId: createdEvent.correlationId,
     runId: createdEvent.runId,
     token: (_a3 = createdEvent.eventData) == null ? void 0 : _a3.token,
-    createdAt: createdEvent.createdAt,
+    createdAt: getEventTimestamp(createdEvent) ?? createdEvent.createdAt,
     receivedCount: receivedEvents.length,
-    lastReceivedAt: (lastReceivedEvent == null ? void 0 : lastReceivedEvent.createdAt) || void 0,
-    disposedAt: ((_b2 = disposedEvents.at(-1)) == null ? void 0 : _b2.createdAt) || void 0
-  }, createdEvent.occurredAt);
+    lastReceivedAt: getEventTimestamp(lastReceivedEvent),
+    disposedAt: getEventTimestamp(disposedEvents.at(-1))
+  };
 };
 function hookToSpan(hookEvents, maxEndTime) {
   const hook = hookEventsToHookEntity(hookEvents);
@@ -54000,19 +54151,26 @@ function hookToSpan(hookEvents, maxEndTime) {
 function runToSpan(run2, runEvents, nowTime) {
   var _a3;
   const now2 = nowTime ?? /* @__PURE__ */ new Date();
+  const runCreatedEvent = runEvents.find((event) => event.eventType === "run_created");
+  const runStartedEvent = runEvents.find((event) => event.eventType === "run_started");
+  const terminalEvent = runEvents.slice().reverse().find((event) => event.eventType === "run_completed" || event.eventType === "run_failed" || event.eventType === "run_cancelled");
+  const spanStartTime = getEventTimestamp(runCreatedEvent) ?? new Date(run2.createdAt);
+  const activeStartTime = getEventTimestamp(runStartedEvent) ?? (run2.startedAt ? new Date(run2.startedAt) : void 0);
+  const completedAt = getEventTimestamp(terminalEvent) ?? run2.completedAt ?? void 0;
+  const endTime = completedAt ?? now2;
   const { input: _i, output: _o2, error: _e2, ...runIdentity } = run2;
-  const occurrenceEvent = findEventByType(runEvents, [
-    "run_created",
-    "run_started"
-  ]);
   const attributes = {
     resource: "run",
-    data: withOccurredAt(runIdentity, occurrenceEvent == null ? void 0 : occurrenceEvent.occurredAt)
+    data: {
+      ...runIdentity,
+      createdAt: spanStartTime,
+      startedAt: activeStartTime,
+      completedAt
+    }
   };
-  const spanStartTime = new Date(run2.createdAt);
-  const activeStartTime = run2.startedAt ? new Date(run2.startedAt) : void 0;
-  const endTime = run2.completedAt ?? now2;
-  const events2 = convertEventsToSpanEvents(runEvents, false);
+  const events2 = convertEventsToSpanEvents(runEvents, false, {
+    preferOccurredAt: true
+  });
   return {
     spanId: String(run2.runId),
     name: String(((_a3 = parseWorkflowName(run2.workflowName)) == null ? void 0 : _a3.shortName) ?? "?"),
@@ -54082,7 +54240,7 @@ function groupEventsByCorrelation(events2) {
 function computeLatestKnownTime(events2, run2) {
   let latest = new Date(run2.createdAt).getTime();
   for (const event of events2) {
-    const t = new Date(event.createdAt).getTime();
+    const t = (getEventTimestamp(event) ?? new Date(event.createdAt)).getTime();
     if (t > latest)
       latest = t;
   }
@@ -82645,7 +82803,7 @@ var tn = f("block", "before:content-[counter(line)]", "before:inline-block", "be
 var et = ({ className: e, language: t, style: o, isIncomplete: n, ...s2 }) => jsxRuntimeExports.jsx("div", { className: f("my-4 flex w-full flex-col gap-2 rounded-xl border border-border bg-sidebar p-2", e), "data-incomplete": n || void 0, "data-language": t, "data-streamdown": "code-block", style: { contentVisibility: "auto", containIntrinsicSize: "auto 200px", ...o }, ...s2 });
 var Se = reactExports.createContext({ code: "" }), de = () => reactExports.useContext(Se);
 var ot = ({ language: e }) => jsxRuntimeExports.jsx("div", { className: "flex h-8 items-center text-muted-foreground text-xs", "data-language": e, "data-streamdown": "code-block-header", children: jsxRuntimeExports.jsx("span", { className: "ml-1 font-mono lowercase", children: e }) });
-var cn$1 = /\n+$/, dn = reactExports.lazy(() => import("./highlighted-body-B3W2YXNL-BlH6gm7c.js").then((e) => ({ default: e.HighlightedCodeBlockBody }))), rt = ({ code: e, language: t, className: o, children: n, isIncomplete: s2 = false, ...r2 }) => {
+var cn$1 = /\n+$/, dn = reactExports.lazy(() => import("./highlighted-body-B3W2YXNL-DUlvgLoF.js").then((e) => ({ default: e.HighlightedCodeBlockBody }))), rt = ({ code: e, language: t, className: o, children: n, isIncomplete: s2 = false, ...r2 }) => {
   let i = reactExports.useMemo(() => e.replace(cn$1, ""), [e]), c = reactExports.useMemo(() => ({ bg: "transparent", fg: "inherit", tokens: i.split(`
 `).map((a2) => [{ content: a2, color: "inherit", bgColor: "transparent", htmlStyle: {}, offset: 0 }]) }), [i]);
   return jsxRuntimeExports.jsx(Se.Provider, { value: { code: e }, children: jsxRuntimeExports.jsxs(et, { isIncomplete: s2, language: t, children: [jsxRuntimeExports.jsx(ot, { language: t }), n ? jsxRuntimeExports.jsx("div", { className: "pointer-events-none sticky top-2 z-10 -mt-10 flex h-8 items-center justify-end", children: jsxRuntimeExports.jsx("div", { className: "pointer-events-auto flex shrink-0 items-center gap-2 rounded-md border border-sidebar bg-sidebar/80 px-1.5 py-1 supports-[backdrop-filter]:bg-sidebar/70 supports-[backdrop-filter]:backdrop-blur", "data-streamdown": "code-block-actions", children: n }) }) : null, jsxRuntimeExports.jsx(reactExports.Suspense, { fallback: jsxRuntimeExports.jsx(Qe, { className: o, language: t, result: c, ...r2 }), children: jsxRuntimeExports.jsx(dn, { className: o, code: i, language: t, raw: c, ...r2 }) })] }) });
@@ -82967,7 +83125,7 @@ var Dt = ({ children: e, className: t, onDownload: o, onError: n }) => {
   }, []), jsxRuntimeExports.jsxs("div", { className: "relative", ref: i, children: [jsxRuntimeExports.jsx("button", { className: f("cursor-pointer p-1 text-muted-foreground transition-all hover:text-foreground disabled:cursor-not-allowed disabled:opacity-50", t), disabled: c, onClick: () => r2(!s2), title: "Download table", type: "button", children: e != null ? e : jsxRuntimeExports.jsx(Z, { size: 14 }) }), s2 ? jsxRuntimeExports.jsxs("div", { className: "absolute top-full right-0 z-10 mt-1 min-w-[120px] overflow-hidden rounded-md border border-border bg-background shadow-lg", children: [jsxRuntimeExports.jsx("button", { className: "w-full px-3 py-2 text-left text-sm transition-colors hover:bg-muted/40", onClick: () => a2("csv"), title: "Download table as CSV", type: "button", children: "CSV" }), jsxRuntimeExports.jsx("button", { className: "w-full px-3 py-2 text-left text-sm transition-colors hover:bg-muted/40", onClick: () => a2("markdown"), title: "Download table as Markdown", type: "button", children: "Markdown" })] }) : null] });
 };
 var Vt = ({ children: e, className: t, showControls: o, ...n }) => jsxRuntimeExports.jsxs("div", { className: "my-4 flex flex-col gap-2 rounded-lg border border-border bg-sidebar p-2", "data-streamdown": "table-wrapper", children: [o ? jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-end gap-1", children: [jsxRuntimeExports.jsx(Ht, {}), jsxRuntimeExports.jsx(Dt, {})] }) : null, jsxRuntimeExports.jsx("div", { className: "border-collapse overflow-x-auto overscroll-y-auto rounded-md border border-border bg-background", children: jsxRuntimeExports.jsx("table", { className: f("w-full divide-y divide-border", t), "data-streamdown": "table", ...n, children: e }) })] });
-var Jn = reactExports.lazy(() => import("./mermaid-3ZIDBTTL-4IS2FONM.js").then((e) => ({ default: e.Mermaid }))), Kn = /language-([^\s]+)/;
+var Jn = reactExports.lazy(() => import("./mermaid-3ZIDBTTL-BdnRYE9a.js").then((e) => ({ default: e.Mermaid }))), Kn = /language-([^\s]+)/;
 function ke(e, t) {
   if (!(e != null && e.position || t != null && t.position)) return true;
   if (!(e != null && e.position && (t != null && t.position))) return false;
@@ -83666,7 +83824,7 @@ const getModuleSpecifierFromName = (value) => {
   }
   return raw2;
 };
-const parseDateValue = (value) => {
+const parseDateValue$1 = (value) => {
   if (value == null) {
     return null;
   }
@@ -83681,14 +83839,14 @@ const parseDateValue = (value) => {
 };
 const formatLocalMillisecondTime = (date2) => format(date2, "MMM dd HH:mm:ss.SS OO").toUpperCase();
 const localMillisecondTimeOrNull = (value) => {
-  const date2 = parseDateValue(value);
+  const date2 = parseDateValue$1(value);
   if (!date2) {
     return null;
   }
   return formatLocalMillisecondTime(date2);
 };
 const timestampWithTooltipOrNull = (value) => {
-  const date2 = parseDateValue(value);
+  const date2 = parseDateValue$1(value);
   if (!date2)
     return null;
   return jsxRuntimeExports.jsx(TimestampTooltip, { date: date2, children: jsxRuntimeExports.jsx("span", { children: formatLocalMillisecondTime(date2) }) });
@@ -83895,8 +84053,8 @@ const AttributePanel = ({ data, moduleSpecifier, isLoading, error: error2, expir
       return present;
     if (resource === "sleep")
       return present;
-    const loadingDefaults = ["input", "output"];
-    for (const key of loadingDefaults) {
+    const loadingPlaceholders = ["input", "output"];
+    for (const key of loadingPlaceholders) {
       if (!present.includes(key)) {
         present.push(key);
       }
@@ -83961,7 +84119,23 @@ const DATA_EVENT_TYPES = /* @__PURE__ */ new Set([
   "wait_completed",
   "attr_set"
 ]);
-function EventItem({ event, onLoadEventData, encryptionKey }) {
+const parseDateValue = (value) => {
+  if (value == null)
+    return null;
+  const date2 = value instanceof Date ? value : new Date(String(value));
+  return Number.isNaN(date2.getTime()) ? null : date2;
+};
+const getEffectiveEventDate = (event) => parseDateValue(event.occurredAt) ?? new Date(event.createdAt);
+const formatEventTimestamp = (date2) => date2.toLocaleString(void 0, {
+  month: "short",
+  day: "numeric",
+  hour: "numeric",
+  minute: "numeric",
+  second: "numeric",
+  fractionalSecondDigits: 3,
+  timeZoneName: "short"
+});
+function EventItem({ event, onLoadEventData, encryptionKey, showSeparateEventOccurrenceTimestamps = false }) {
   const [loadedData, setLoadedData] = reactExports.useState(null);
   const [isLoading, setIsLoading] = reactExports.useState(false);
   const [loadError, setLoadError] = reactExports.useState(null);
@@ -84002,16 +84176,18 @@ function EventItem({ event, onLoadEventData, encryptionKey }) {
     void loadEventData({ force: true });
   }, [encryptionKey, loadEventData]);
   const createdAt = new Date(event.createdAt);
-  const createdAtTime = createdAt.toLocaleTimeString(void 0, {
+  const occurredAt = parseDateValue(event.occurredAt);
+  const displayedCreatedAt = showSeparateEventOccurrenceTimestamps ? createdAt : getEffectiveEventDate(event);
+  const displayedCreatedAtTime = displayedCreatedAt.toLocaleTimeString(void 0, {
     hour: "numeric",
     minute: "numeric",
     second: "numeric"
   });
   const displayPayload = isLoading ? loadedData : mergedDisplay;
-  return jsxRuntimeExports.jsxs(DetailCard, { variant: "card", summaryClassName: "px-3 py-2", summary: jsxRuntimeExports.jsxs("div", { className: "flex w-full items-center justify-between gap-3", children: [jsxRuntimeExports.jsx("span", { className: "text-gray-1000 text-label-12 font-mono", children: event.eventType }), jsxRuntimeExports.jsx("span", { className: "shrink-0 text-label-13 text-gray-900", children: createdAtTime })] }), onToggle: canHaveData ? (open) => {
+  return jsxRuntimeExports.jsxs(DetailCard, { variant: "card", summaryClassName: "px-3 py-2", summary: jsxRuntimeExports.jsxs("div", { className: "flex w-full items-center justify-between gap-3", children: [jsxRuntimeExports.jsx("span", { className: "text-gray-1000 text-label-12 font-mono", children: event.eventType }), jsxRuntimeExports.jsx("span", { className: "shrink-0 text-label-13 text-gray-900", children: displayedCreatedAtTime })] }), onToggle: canHaveData ? (open) => {
     if (open)
       handleExpand();
-  } : void 0, children: [jsxRuntimeExports.jsxs("div", { className: "flex flex-col bg-background-200 [&:has(+_*)]:border-b [&:has(+_*)]:border-gray-alpha-400", children: [jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between gap-2 py-2 px-3", children: [jsxRuntimeExports.jsx("span", { className: "text-label-12 text-gray-900", children: "Event ID" }), jsxRuntimeExports.jsx("span", { className: "max-w-[70%] truncate text-right text-label-12 font-mono", children: event.eventId })] }), event.correlationId && jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between gap-2 py-2 px-3", children: [jsxRuntimeExports.jsx("span", { className: "text-label-12 text-gray-900", children: "Correlation ID" }), jsxRuntimeExports.jsx("span", { className: "max-w-[70%] truncate text-right text-label-12 font-mono", children: event.correlationId })] })] }), isLoading && jsxRuntimeExports.jsxs("div", { className: "p-3", children: [jsxRuntimeExports.jsx(Skeleton$2, { className: "h-4 w-[35%]" }), jsxRuntimeExports.jsx(Skeleton$2, { className: "mt-2 h-4 w-[90%]" }), jsxRuntimeExports.jsx(Skeleton$2, { className: "mt-2 h-4 w-[75%]" })] }), loadError && jsxRuntimeExports.jsx(ErrorCard, { title: "Failed to load event data", details: loadError, className: "mt-2" }), displayPayload != null && jsxRuntimeExports.jsx("div", { className: "[&>div]:border-none [&>div]:rounded-none", children: jsxRuntimeExports.jsx(EventDataBlock, { eventType: event.eventType, data: displayPayload }) })] });
+  } : void 0, children: [jsxRuntimeExports.jsxs("div", { className: "flex flex-col bg-background-200 [&:has(+_*)]:border-b [&:has(+_*)]:border-gray-alpha-400", children: [showSeparateEventOccurrenceTimestamps && occurredAt && jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between gap-2 py-2 px-3", children: [jsxRuntimeExports.jsx("span", { className: "text-label-12 text-gray-900", children: "Occurred" }), jsxRuntimeExports.jsx(TimestampTooltip, { date: occurredAt, children: jsxRuntimeExports.jsx("span", { className: "max-w-[70%] truncate text-right text-label-12 font-mono", children: formatEventTimestamp(occurredAt) }) })] }), jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between gap-2 py-2 px-3", children: [jsxRuntimeExports.jsx("span", { className: "text-label-12 text-gray-900", children: "Event ID" }), jsxRuntimeExports.jsx("span", { className: "max-w-[70%] truncate text-right text-label-12 font-mono", children: event.eventId })] }), event.correlationId && jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between gap-2 py-2 px-3", children: [jsxRuntimeExports.jsx("span", { className: "text-label-12 text-gray-900", children: "Correlation ID" }), jsxRuntimeExports.jsx("span", { className: "max-w-[70%] truncate text-right text-label-12 font-mono", children: event.correlationId })] })] }), isLoading && jsxRuntimeExports.jsxs("div", { className: "p-3", children: [jsxRuntimeExports.jsx(Skeleton$2, { className: "h-4 w-[35%]" }), jsxRuntimeExports.jsx(Skeleton$2, { className: "mt-2 h-4 w-[90%]" }), jsxRuntimeExports.jsx(Skeleton$2, { className: "mt-2 h-4 w-[75%]" })] }), loadError && jsxRuntimeExports.jsx(ErrorCard, { title: "Failed to load event data", details: loadError, className: "mt-2" }), displayPayload != null && jsxRuntimeExports.jsx("div", { className: "[&>div]:border-none [&>div]:rounded-none", children: jsxRuntimeExports.jsx(EventDataBlock, { eventType: event.eventType, data: displayPayload }) })] });
 }
 function hasOnlyExpiredFields(data, eventType) {
   if (data === null || typeof data !== "object" || Array.isArray(data)) {
@@ -84047,13 +84223,13 @@ function EventDataBlock({ eventType, data }) {
   }
   return jsxRuntimeExports.jsx(CopyableDataBlock, { data });
 }
-function EventsList({ events: events2, isLoading = false, error: error2, onLoadEventData, onStreamClick, onRunClick, encryptionKey }) {
-  const sortedEvents2 = reactExports.useMemo(() => [...events2].sort((a2, b2) => new Date(a2.createdAt).getTime() - new Date(b2.createdAt).getTime()), [events2]);
+function EventsList({ events: events2, isLoading = false, error: error2, onLoadEventData, onStreamClick, onRunClick, encryptionKey, showSeparateEventOccurrenceTimestamps = false }) {
+  const sortedEvents2 = reactExports.useMemo(() => [...events2].sort((a2, b2) => getEffectiveEventDate(a2).getTime() - getEffectiveEventDate(b2).getTime()), [events2]);
   const hasEvents = sortedEvents2.length > 0 && !error2;
   if (!hasEvents && !isLoading) {
     return jsxRuntimeExports.jsx(DetailCard, { summary: "Events", disabled: true });
   }
-  return jsxRuntimeExports.jsx(RunClickContext.Provider, { value: onRunClick, children: jsxRuntimeExports.jsx(StreamClickContext.Provider, { value: onStreamClick, children: jsxRuntimeExports.jsx(DetailCard, { summary: "Events", contentClassName: "mb-0", defaultOpen: true, children: isLoading ? jsxRuntimeExports.jsx("div", { className: "flex flex-col -mx-4", children: [0, 1, 2].map((i) => jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between gap-3 bg-background-200 px-4 py-2", children: [jsxRuntimeExports.jsx(Skeleton$2, { className: "h-4 w-32 rounded" }), jsxRuntimeExports.jsx(Skeleton$2, { className: "h-3 w-16 rounded" })] }, i)) }) : jsxRuntimeExports.jsx("div", { className: "flex flex-col -mx-4", children: sortedEvents2.map((event) => jsxRuntimeExports.jsx(EventItem, { event, onLoadEventData, encryptionKey }, event.eventId)) }) }) }) });
+  return jsxRuntimeExports.jsx(RunClickContext.Provider, { value: onRunClick, children: jsxRuntimeExports.jsx(StreamClickContext.Provider, { value: onStreamClick, children: jsxRuntimeExports.jsx(DetailCard, { summary: "Events", contentClassName: "mb-0", defaultOpen: true, children: isLoading ? jsxRuntimeExports.jsx("div", { className: "flex flex-col -mx-4", children: [0, 1, 2].map((i) => jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between gap-3 bg-background-200 px-4 py-2", children: [jsxRuntimeExports.jsx(Skeleton$2, { className: "h-4 w-32 rounded" }), jsxRuntimeExports.jsx(Skeleton$2, { className: "h-3 w-16 rounded" })] }, i)) }) : jsxRuntimeExports.jsx("div", { className: "flex flex-col -mx-4", children: sortedEvents2.map((event) => jsxRuntimeExports.jsx(EventItem, { event, onLoadEventData, encryptionKey, showSeparateEventOccurrenceTimestamps }, event.eventId)) }) }) }) });
 }
 const SidebarDataContext = reactExports.createContext(null);
 SidebarDataContext.displayName = "SidebarDataContext";
@@ -84071,6 +84247,43 @@ function useSidebarDataOptional() {
   return reactExports.useContext(SidebarDataContext);
 }
 const hasField = (value, key) => key in value;
+const RESOURCES_WITH_FETCHED_DETAIL = /* @__PURE__ */ new Set(["run", "step", "sleep"]);
+function resourceNeedsFetchedDetail(resource) {
+  return resource !== void 0 && RESOURCES_WITH_FETCHED_DETAIL.has(resource);
+}
+function deriveSpanDetailView(args) {
+  const { resource, resourceId, inlineData, fetchedDetail, fetchedError } = args;
+  const matchedDetail = spanDetailMatchesSelection(fetchedDetail, resource, resourceId) ? fetchedDetail : null;
+  const displayData = mergeSpanDetail(inlineData, matchedDetail);
+  if (!resource || !resourceId) {
+    return { status: "idle", displayData, detail: null, error: void 0 };
+  }
+  if (fetchedError) {
+    return {
+      status: "error",
+      displayData,
+      detail: matchedDetail,
+      error: fetchedError
+    };
+  }
+  if (!resourceNeedsFetchedDetail(resource)) {
+    return {
+      status: "ready",
+      displayData,
+      detail: matchedDetail,
+      error: void 0
+    };
+  }
+  if (matchedDetail !== null) {
+    return {
+      status: "ready",
+      displayData,
+      detail: matchedDetail,
+      error: void 0
+    };
+  }
+  return { status: "loading", displayData, detail: null, error: void 0 };
+}
 function spanDetailMatchesSelection(detail, resource, resourceId) {
   if (!detail || typeof detail !== "object" || !resource || !resourceId) {
     return false;
@@ -84103,16 +84316,88 @@ function mergeSpanDetail(spanData, detail) {
   }
   return merged;
 }
-function isStep(data) {
-  return data !== null && typeof data === "object" && "stepId" in data;
+function deriveSpanSelection(selectedSpan) {
+  if (!selectedSpan)
+    return null;
+  const { resource, data } = selectedSpan;
+  if (resource === "step" && data && typeof data === "object" && "stepId" in data) {
+    const step = data;
+    return { resource: "step", resourceId: step.stepId, runId: step.runId };
+  }
+  if (resource === "run" && data && typeof data === "object" && "runId" in data) {
+    return { resource: "run", resourceId: data.runId };
+  }
+  if (resource === "hook" && data && typeof data === "object" && "hookId" in data) {
+    return { resource: "hook", resourceId: data.hookId };
+  }
+  if (resource === "sleep") {
+    if (!selectedSpan.spanId)
+      return null;
+    const waitData = data;
+    return {
+      resource: "sleep",
+      resourceId: selectedSpan.spanId,
+      runId: waitData == null ? void 0 : waitData.runId
+    };
+  }
+  return null;
 }
-function isWorkflowRun(data) {
-  return data !== null && typeof data === "object" && "runId" in data;
+function useSelectedSpanDetail(selectedSpan, fetchSpanDetail) {
+  const selection2 = reactExports.useMemo(() => deriveSpanSelection(selectedSpan), [selectedSpan]);
+  const resource = selection2 == null ? void 0 : selection2.resource;
+  const resourceId = selection2 == null ? void 0 : selection2.resourceId;
+  const runId = selection2 == null ? void 0 : selection2.runId;
+  const selectionKey = resource && resourceId ? `${resource}:${resourceId}` : null;
+  const needsFetch = resourceNeedsFetchedDetail(resource);
+  const [fetched, setFetched] = reactExports.useState({ detail: null, error: null, errorKey: null });
+  const tokenRef = reactExports.useRef(0);
+  const selectionRef = reactExports.useRef(selection2);
+  selectionRef.current = selection2;
+  reactExports.useEffect(() => {
+    if (!selectionKey || !needsFetch) {
+      return;
+    }
+    const activeSelection = selectionRef.current;
+    if (!activeSelection) {
+      return;
+    }
+    const token = ++tokenRef.current;
+    fetchSpanDetail(activeSelection).then((detail) => {
+      if (tokenRef.current !== token)
+        return;
+      setFetched({ detail, error: null, errorKey: null });
+    }).catch((err) => {
+      if (tokenRef.current !== token)
+        return;
+      setFetched({
+        detail: null,
+        error: err instanceof Error ? err : new Error(String(err)),
+        errorKey: selectionKey
+      });
+    });
+  }, [selectionKey, runId, needsFetch, fetchSpanDetail]);
+  const scopedError = fetched.errorKey === selectionKey ? fetched.error : null;
+  const view = reactExports.useMemo(() => deriveSpanDetailView({
+    resource,
+    resourceId,
+    inlineData: selectedSpan == null ? void 0 : selectedSpan.data,
+    fetchedDetail: fetched.detail,
+    fetchedError: scopedError
+  }), [resource, resourceId, selectedSpan == null ? void 0 : selectedSpan.data, fetched.detail, scopedError]);
+  return {
+    status: view.status,
+    resource,
+    resourceId,
+    runId,
+    displayData: view.displayData,
+    detail: view.detail,
+    error: view.error
+  };
 }
 function isHook(data) {
   return data !== null && typeof data === "object" && "hookId" in data;
 }
-function EntityDetailPanel({ run: run2, onStreamClick, onRunClick, spanDetailData, spanDetailError, spanDetailLoading, onSpanSelect, onWakeUpSleep, onLoadEventData, onResolveHook, encryptionKey, onDecrypt, isDecrypting = false, selectedSpan }) {
+function EntityDetailPanel({ run: run2, onStreamClick, onRunClick, fetchSpanDetail, onWakeUpSleep, onLoadEventData, onResolveHook, encryptionKey, onDecrypt, isDecrypting = false, selectedSpan, showSeparateEventOccurrenceTimestamps = false }) {
   const toast2 = useToast();
   const [stoppingSleep, setStoppingSleep] = reactExports.useState(false);
   const [showResolveHookModal, setShowResolveHookModal] = reactExports.useState(false);
@@ -84123,41 +84408,8 @@ function EntityDetailPanel({ run: run2, onStreamClick, onRunClick, spanDetailDat
   const data = selectedSpan == null ? void 0 : selectedSpan.data;
   const rawEvents = selectedSpan == null ? void 0 : selectedSpan.rawEvents;
   const rawEventsLength = (rawEvents == null ? void 0 : rawEvents.length) ?? 0;
-  const { resource, resourceId, runId } = reactExports.useMemo(() => {
-    if (!selectedSpan) {
-      return { resource: void 0, resourceId: void 0, runId: void 0 };
-    }
-    const res = selectedSpan.resource;
-    if (res === "step" && isStep(data)) {
-      return { resource: "step", resourceId: data.stepId, runId: data.runId };
-    }
-    if (res === "run" && isWorkflowRun(data)) {
-      return { resource: "run", resourceId: data.runId, runId: void 0 };
-    }
-    if (res === "hook" && isHook(data)) {
-      return { resource: "hook", resourceId: data.hookId, runId: void 0 };
-    }
-    if (res === "sleep") {
-      const waitData = data;
-      return {
-        resource: "sleep",
-        resourceId: selectedSpan.spanId,
-        runId: waitData == null ? void 0 : waitData.runId
-      };
-    }
-    return { resource: void 0, resourceId: void 0, runId: void 0 };
-  }, [selectedSpan, data]);
-  const onSpanSelectRef = reactExports.useRef(onSpanSelect);
-  onSpanSelectRef.current = onSpanSelect;
-  reactExports.useEffect(() => {
-    if (resource && resourceId && ["run", "step", "hook", "sleep"].includes(resource)) {
-      onSpanSelectRef.current({
-        resource,
-        resourceId,
-        runId
-      });
-    }
-  }, [resource, resourceId, runId]);
+  const { status, resource, resourceId, displayData, detail: matchedSpanDetailData, error: error2 } = useSelectedSpanDetail(selectedSpan, fetchSpanDetail);
+  const loading = status === "loading";
   const canWakeUp = reactExports.useMemo(() => {
     if (resource !== "sleep" || !rawEvents)
       return false;
@@ -84190,9 +84442,6 @@ function EntityDetailPanel({ run: run2, onStreamClick, onRunClick, spanDetailDat
     run2.status,
     resolvedHookIds
   ]);
-  const error2 = spanDetailError ?? void 0;
-  const loading = spanDetailLoading ?? false;
-  const matchedSpanDetailData = reactExports.useMemo(() => spanDetailMatchesSelection(spanDetailData, resource, resourceId) ? spanDetailData : null, [spanDetailData, resource, resourceId]);
   const hookToken = reactExports.useMemo(() => {
     if (resource !== "hook" || !resourceId)
       return void 0;
@@ -84277,7 +84526,6 @@ function EntityDetailPanel({ run: run2, onStreamClick, onRunClick, spanDetailDat
       setResolvingHook(false);
     }
   }, [onResolveHook, hookToken, resolvingHook, matchedSpanDetailData, data]);
-  const displayData = reactExports.useMemo(() => mergeSpanDetail(data, matchedSpanDetailData), [data, matchedSpanDetailData]);
   const moduleSpecifier = reactExports.useMemo(() => {
     const displayRecord = displayData;
     const displayStepName = displayRecord.stepName;
@@ -84306,7 +84554,7 @@ function EntityDetailPanel({ run: run2, onStreamClick, onRunClick, spanDetailDat
   }, children: [jsxRuntimeExports.jsx(Zap, { className: "h-4 w-4" }), stoppingSleep ? "Waking up..." : "Wake Up Sleep"] }), resource === "hook" && canResolveHook && jsxRuntimeExports.jsxs("button", { type: "button", onClick: () => setShowResolveHookModal(true), disabled: resolvingHook, className: clsx("flex items-center justify-center gap-2 rounded-md px-3 py-2 text-sm font-medium", "disabled:opacity-50 disabled:cursor-not-allowed transition-colors", resolvingHook ? "opacity-50 cursor-not-allowed" : "cursor-pointer"), style: {
     background: "var(--ds-gray-1000)",
     color: "var(--ds-background-100)"
-  }, children: [jsxRuntimeExports.jsx(Send, { className: "h-4 w-4" }), "Resolve Hook"] })] })] }), jsxRuntimeExports.jsx(AttributePanel, { data: displayData, moduleSpecifier, expiredAt: run2.expiredAt, isLoading: loading, error: error2 ?? void 0, onStreamClick, onRunClick, onDecrypt, isDecrypting, resource }), rawEvents && jsxRuntimeExports.jsx(EventsList, { events: rawEvents, onLoadEventData, onStreamClick, onRunClick, encryptionKey })] }) }), jsxRuntimeExports.jsx(ResolveHookModal, { isOpen: showResolveHookModal, onClose: () => setShowResolveHookModal(false), onSubmit: handleResolveHook, isSubmitting: resolvingHook })] });
+  }, children: [jsxRuntimeExports.jsx(Send, { className: "h-4 w-4" }), "Resolve Hook"] })] })] }), jsxRuntimeExports.jsx(AttributePanel, { data: displayData, moduleSpecifier, expiredAt: run2.expiredAt, isLoading: loading, error: error2 ?? void 0, onStreamClick, onRunClick, onDecrypt, isDecrypting, resource }), rawEvents && jsxRuntimeExports.jsx(EventsList, { events: rawEvents, onLoadEventData, onStreamClick, onRunClick, encryptionKey, showSeparateEventOccurrenceTimestamps })] }) }), jsxRuntimeExports.jsx(ResolveHookModal, { isOpen: showResolveHookModal, onClose: () => setShowResolveHookModal(false), onSubmit: handleResolveHook, isSubmitting: resolvingHook })] });
 }
 const MAP_HEIGHT = 56;
 const TIMELINE_PADDING = 8;
@@ -85573,6 +85821,41 @@ function StreamViewer({ streamId: _streamId, chunks, isLive, error: error2, isLo
     color: "var(--ds-gray-600)"
   }, children: isLive ? "Waiting for stream data..." : "Stream is empty" }) : jsxRuntimeExports.jsx(Yr, { ref: virtuosoRef, totalCount: chunks.length, overscan: 10, endReached: () => onScrollEnd == null ? void 0 : onScrollEnd(), itemContent: (index2) => jsxRuntimeExports.jsx("div", { style: { paddingBottom: 8 }, children: jsxRuntimeExports.jsx(ChunkRow, { chunk: chunks[index2], index: index2 }) }), style: { flex: 1, minHeight: 0 } }) })] });
 }
+function useIntersectionObserver(elementRef, { threshold = 0, rootRef, rootMargin = "0%", freezeOnceVisible = false } = {}) {
+  const [entry2, setEntry] = reactExports.useState();
+  const frozen = (entry2 == null ? void 0 : entry2.isIntersecting) && freezeOnceVisible;
+  reactExports.useEffect(() => {
+    const node2 = elementRef == null ? void 0 : elementRef.current;
+    const hasIOSupport = !!window.IntersectionObserver;
+    if (!hasIOSupport || frozen || !node2)
+      return;
+    const updateEntry = ([entry3]) => {
+      setEntry(entry3);
+    };
+    const observer = new IntersectionObserver(updateEntry, {
+      threshold,
+      root: (rootRef == null ? void 0 : rootRef.current) ?? null,
+      rootMargin
+    });
+    observer.observe(node2);
+    return () => observer.disconnect();
+  }, [elementRef, threshold, rootRef, rootMargin, frozen]);
+  return entry2;
+}
+function useLoadMoreOnScroll(loadMore, { hasMore, isLoadingMore, rootRef, rootMargin = "400px" }) {
+  const sentinelRef = reactExports.useRef(null);
+  const entry2 = useIntersectionObserver(sentinelRef, { rootRef, rootMargin });
+  const loadMoreRef = reactExports.useRef(loadMore);
+  reactExports.useEffect(() => {
+    loadMoreRef.current = loadMore;
+  }, [loadMore]);
+  reactExports.useEffect(() => {
+    if ((entry2 == null ? void 0 : entry2.isIntersecting) && hasMore && !isLoadingMore) {
+      loadMoreRef.current();
+    }
+  }, [entry2 == null ? void 0 : entry2.isIntersecting, hasMore, isLoadingMore]);
+  return sentinelRef;
+}
 const iconButtonVariants = cva([
   "m-0 inline-flex shrink-0 appearance-none items-center justify-center border-0 bg-transparent p-0 align-baseline font-inherit no-underline [background:none] [-webkit-appearance:none] [-webkit-tap-highlight-color:transparent]",
   "transition-colors duration-150 ease-in-out",
@@ -85616,57 +85899,6 @@ const kbdVariants = cva("inline-flex items-center justify-center rounded px-1 te
 function Kbd({ children: children2, className, variant, size: size2, ...props }) {
   return jsxRuntimeExports.jsx("kbd", { className: cn$4(kbdVariants({ variant, size: size2, className })), ...props, children: children2 });
 }
-const COL_TEMPLATE = "340px 1px minmax(50px, 1fr)";
-const ROWS = [
-  { id: "r0", name: 62, off: 0, bar: 72 },
-  { id: "r1", name: 78, off: 6, bar: 48 },
-  { id: "r2", name: 50, off: 10, bar: 55 },
-  { id: "r3", name: 84, off: 18, bar: 30 },
-  { id: "r4", name: 45, off: 18, bar: 42 },
-  { id: "r5", name: 66, off: 34, bar: 38 },
-  { id: "r6", name: 55, off: 41, bar: 25 },
-  { id: "r7", name: 40, off: 50, bar: 30 }
-];
-const HEADER_MARKERS = ["m0", "m1", "m2", "m3"];
-const HeaderDivider = () => jsxRuntimeExports.jsx("div", { className: "flex justify-center", children: jsxRuntimeExports.jsx("span", { "aria-hidden": true, className: "h-full w-px bg-gray-alpha-400" }) });
-function TraceViewerSkeleton() {
-  return jsxRuntimeExports.jsxs("output", { "aria-busy": "true", "aria-label": "Loading trace", className: "flex flex-col w-full h-full min-h-0 bg-background-100", children: [jsxRuntimeExports.jsx("span", { className: "sr-only", children: "Loading trace…" }), jsxRuntimeExports.jsxs("div", { className: "shrink-0 grid", style: { gridTemplateColumns: COL_TEMPLATE }, children: [jsxRuntimeExports.jsxs("div", { className: "h-10 min-h-10 flex items-center border-b border-gray-alpha-400 pl-4 pr-2 gap-1.5", children: [jsxRuntimeExports.jsx(Skeleton$2, { className: "w-3.5 h-3.5 shrink-0 rounded-sm" }), jsxRuntimeExports.jsx(Skeleton$2, { className: "h-3.5 w-40" })] }), jsxRuntimeExports.jsx(HeaderDivider, {}), jsxRuntimeExports.jsx("div", { className: "h-10 min-h-10 flex items-end border-b border-gray-alpha-400 px-4 pb-1 gap-2", children: jsxRuntimeExports.jsx("div", { className: "relative flex-1 flex items-end justify-between", children: HEADER_MARKERS.map((id2) => jsxRuntimeExports.jsx(Skeleton$2, { className: "h-3.5 w-9" }, id2)) }) })] }), jsxRuntimeExports.jsxs("div", { className: "grid flex-1 min-h-0 overflow-hidden", style: { gridTemplateColumns: COL_TEMPLATE }, children: [jsxRuntimeExports.jsx("div", { className: "block overflow-visible", children: jsxRuntimeExports.jsx("ul", { className: "block divide-y divide-gray-alpha-400 border-b border-gray-alpha-400", children: ROWS.map((row) => jsxRuntimeExports.jsxs("li", { className: "h-10 flex items-center pl-4 pr-2", children: [jsxRuntimeExports.jsxs("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: [jsxRuntimeExports.jsx(Skeleton$2, { className: "w-4 h-4 shrink-0 rounded-sm" }), jsxRuntimeExports.jsx(Skeleton$2, { className: "h-3.5", style: { width: `${row.name}%` } })] }), jsxRuntimeExports.jsx(Skeleton$2, { className: "ml-2 h-3.5 w-10 shrink-0" })] }, row.id)) }) }), jsxRuntimeExports.jsx("span", { "aria-hidden": true, className: "h-full w-px bg-gray-alpha-400" }), jsxRuntimeExports.jsx("div", { className: "relative min-h-0", children: ROWS.map((row) => jsxRuntimeExports.jsx("div", { className: "relative h-10", children: jsxRuntimeExports.jsx("div", { className: "absolute inset-x-4 inset-y-0", children: jsxRuntimeExports.jsx(Skeleton$2, { className: "absolute top-1/2 -translate-y-1/2 h-6 rounded-[0.25rem]", style: { left: `${row.off}%`, width: `${row.bar}%` } }) }) }, row.id)) })] })] });
-}
-function useIntersectionObserver(elementRef, { threshold = 0, rootRef, rootMargin = "0%", freezeOnceVisible = false } = {}) {
-  const [entry2, setEntry] = reactExports.useState();
-  const frozen = (entry2 == null ? void 0 : entry2.isIntersecting) && freezeOnceVisible;
-  reactExports.useEffect(() => {
-    const node2 = elementRef == null ? void 0 : elementRef.current;
-    const hasIOSupport = !!window.IntersectionObserver;
-    if (!hasIOSupport || frozen || !node2)
-      return;
-    const updateEntry = ([entry3]) => {
-      setEntry(entry3);
-    };
-    const observer = new IntersectionObserver(updateEntry, {
-      threshold,
-      root: (rootRef == null ? void 0 : rootRef.current) ?? null,
-      rootMargin
-    });
-    observer.observe(node2);
-    return () => observer.disconnect();
-  }, [elementRef, threshold, rootRef, rootMargin, frozen]);
-  return entry2;
-}
-function useLoadMoreOnScroll(loadMore, { hasMore, isLoadingMore, rootRef, rootMargin = "400px" }) {
-  const sentinelRef = reactExports.useRef(null);
-  const entry2 = useIntersectionObserver(sentinelRef, { rootRef, rootMargin });
-  const loadMoreRef = reactExports.useRef(loadMore);
-  reactExports.useEffect(() => {
-    loadMoreRef.current = loadMore;
-  }, [loadMore]);
-  reactExports.useEffect(() => {
-    if ((entry2 == null ? void 0 : entry2.isIntersecting) && hasMore && !isLoadingMore) {
-      loadMoreRef.current();
-    }
-  }, [entry2 == null ? void 0 : entry2.isIntersecting, hasMore, isLoadingMore]);
-  return sentinelRef;
-}
 const TooltipProvider = Provider$2;
 const Tooltip$1 = Root3$1;
 const TooltipTrigger$1 = Trigger$4;
@@ -86252,57 +86484,6 @@ const EventList = ({ spans, activeSpanId, searchResult, onSelectSpan }) => {
     paddingBottom: (spans.length - end) * ROW_HEIGHT_PX
   }, children: spans.slice(start2, end).map((span) => jsxRuntimeExports.jsx(EventRow, { span, isSelected: span.spanId === activeSpanId, isDimmed: isSpanDimmedBySearch(span.spanId, searchResult), onSelectSpan }, span.spanId)) });
 };
-const hint$1 = "_hint_1dmsq_3";
-const styles$2 = {
-  hint: hint$1
-};
-const DISMISSALS_KEY = "workflow-step-shortcut-helper-dismissals";
-const DISMISSAL_LIMIT = 3;
-const HINT_ROTATION_MS = 8e3;
-function getAltKeyLabel() {
-  if (typeof navigator === "undefined")
-    return "Alt";
-  return navigator.platform.toLowerCase().includes("mac") ? "Option" : "Alt";
-}
-function readDismissals() {
-  try {
-    const dismissals = Number.parseInt(window.localStorage.getItem(DISMISSALS_KEY) ?? "0", 10);
-    return Number.isNaN(dismissals) ? 0 : dismissals;
-  } catch {
-    return 0;
-  }
-}
-function AltHint() {
-  return jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: ["Hold", jsxRuntimeExports.jsx(Kbd, { variant: "outline", size: "compact", className: "mx-1", children: getAltKeyLabel() }), "to see delta between spans"] });
-}
-function NavHint() {
-  return jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: ["Use", jsxRuntimeExports.jsx(Kbd, { variant: "outline", size: "compact", className: "ml-1", children: "J" }), jsxRuntimeExports.jsx("span", { className: "mx-1", children: "/" }), jsxRuntimeExports.jsx(Kbd, { variant: "outline", size: "compact", className: "mr-1", children: "K" }), "to move between spans"] });
-}
-function TraceShortcutHelper({ hasMultipleSpans, reducedMotion }) {
-  const [visible, setVisible] = reactExports.useState(false);
-  const [index2, setIndex] = reactExports.useState(0);
-  reactExports.useEffect(() => {
-    setVisible(readDismissals() < DISMISSAL_LIMIT);
-  }, []);
-  reactExports.useEffect(() => {
-    if (reducedMotion)
-      return;
-    const id2 = setInterval(() => {
-      setIndex((i) => i === 0 ? 1 : 0);
-    }, HINT_ROTATION_MS);
-    return () => clearInterval(id2);
-  }, [reducedMotion]);
-  if (!visible || !hasMultipleSpans)
-    return null;
-  const dismiss = () => {
-    try {
-      window.localStorage.setItem(DISMISSALS_KEY, String(readDismissals() + 1));
-    } catch {
-    }
-    setVisible(false);
-  };
-  return jsxRuntimeExports.jsxs("div", { className: "group absolute bottom-3 left-1/2 z-10 hidden h-8 max-w-[calc(100%-2rem)] -translate-x-1/2 items-center gap-1 text-xs leading-none text-gray-900 md:inline-flex", children: [jsxRuntimeExports.jsx("span", { "aria-live": "polite", "aria-atomic": "true", className: "inline-flex items-center whitespace-nowrap", children: reducedMotion ? jsxRuntimeExports.jsx(AltHint, {}) : jsxRuntimeExports.jsx("span", { className: `inline-flex items-center ${styles$2.hint}`, children: index2 === 0 ? jsxRuntimeExports.jsx(AltHint, {}) : jsxRuntimeExports.jsx(NavHint, {}) }, index2) }), jsxRuntimeExports.jsx("button", { type: "button", className: "inline-flex h-5 w-5 items-center justify-center rounded text-muted-foreground opacity-0 transition-opacity hover:bg-accent hover:text-foreground group-hover:opacity-100 focus-visible:opacity-100 motion-reduce:transition-none", onClick: dismiss, "aria-label": "Dismiss trace shortcuts helper", children: jsxRuntimeExports.jsx(X$3, { className: "h-3 w-3" }) })] });
-}
 const GUTTER_PX = 1;
 const MIN_PX = 50;
 const DEFAULT_START_PX = 340;
@@ -86443,11 +86624,11 @@ function OffscreenMarkerIndicator({ direction, count: count2, targetMs, onReveal
   return jsxRuntimeExports.jsx("button", { type: "button", "aria-label": label, title: label, onClick: (e) => {
     e.stopPropagation();
     onReveal == null ? void 0 : onReveal(targetMs);
-  }, className: cn$4("pointer-events-auto absolute top-1/2 z-20 flex h-6 -translate-y-1/2 cursor-pointer items-center rounded-[0.25rem] border border-gray-alpha-400 bg-background-100 shadow-sm hover:bg-gray-100", direction === "right" ? "right-0 pl-1.5" : "left-0 pr-1.5"), children: direction === "left" ? jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [chevron, tick] }) : jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [tick, chevron] }) });
+  }, className: cn$4("pointer-events-auto absolute top-1/2 z-20 flex h-6 -translate-y-1/2 cursor-pointer items-center rounded-[0.25rem] border border-gray-alpha-400 bg-background-100 hover:bg-gray-100", direction === "right" ? "right-0 pl-1.5" : "left-0 pr-1.5"), children: direction === "left" ? jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [chevron, tick] }) : jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [tick, chevron] }) });
 }
 const runningStripes = "_runningStripes_1ii0z_1";
 const pendingStripes = "_pendingStripes_1ii0z_2";
-const styles$1 = {
+const styles$2 = {
   runningStripes,
   pendingStripes
 };
@@ -86476,7 +86657,7 @@ const STRIPED_SEGMENT_STATUSES = /* @__PURE__ */ new Set([
   "received"
 ]);
 function AnimatedStripes({ status }) {
-  return jsxRuntimeExports.jsx("div", { "aria-hidden": true, className: status === "pending" ? styles$1.pendingStripes : styles$1.runningStripes });
+  return jsxRuntimeExports.jsx("div", { "aria-hidden": true, className: status === "pending" ? styles$2.pendingStripes : styles$2.runningStripes });
 }
 function computeBarGeometry(startMs, endMs, viewStart, viewEnd, containerWidth) {
   const viewDuration = viewEnd - viewStart;
@@ -86640,6 +86821,57 @@ function Timeline({ spans, viewStart, viewEnd, markers: markers2, selectedId, se
     Math.abs(marker2.value) > 1e-6 ? jsxRuntimeExports.jsx("div", { className: "absolute top-0 bottom-0 w-px bg-gray-alpha-300", style: { left: `${marker2.position * 100}%` } }, String(marker2.value)) : null
   )) }), hoverFraction != null && jsxRuntimeExports.jsx("div", { className: "absolute inset-y-0 pointer-events-none z-10", style: TIMELINE_INSET_STYLE, children: jsxRuntimeExports.jsx("div", { className: "absolute top-0 bottom-0 w-px bg-gray-alpha-500", style: { left: `${hoverFraction * 100}%` } }) }), jsxRuntimeExports.jsx("div", { style: { transform: `translateY(${start2 * ROW_HEIGHT_PX}px)` }, children: spans.slice(start2, end).map((span) => jsxRuntimeExports.jsx(TimelineBar, { span, viewStart, viewDuration, containerWidth: timelineWidth, isSelected: selectedId === span.spanId, isDimmed: isSpanDimmedBySearch(span.spanId, searchResult), onSelect, onRevealTime }, span.spanId)) }), altHeld && jsxRuntimeExports.jsx("div", { "aria-hidden": true, className: "absolute inset-y-0 pointer-events-none", style: TIMELINE_INSET_STYLE, children: gaps.map((gap) => jsxRuntimeExports.jsx(DeltaIndicator, { leftFrac: gap.leftFrac, rightFrac: gap.rightFrac, label: formatDuration(gap.gapMs, true), rowIndex: gap.rowIndex }, gap.rowIndex)) })] });
 }
+const hint$1 = "_hint_1dmsq_3";
+const styles$1 = {
+  hint: hint$1
+};
+const DISMISSALS_KEY = "workflow-step-shortcut-helper-dismissals";
+const DISMISSAL_LIMIT = 3;
+const HINT_ROTATION_MS = 8e3;
+function getAltKeyLabel() {
+  if (typeof navigator === "undefined")
+    return "Alt";
+  return navigator.platform.toLowerCase().includes("mac") ? "Option" : "Alt";
+}
+function readDismissals() {
+  try {
+    const dismissals = Number.parseInt(window.localStorage.getItem(DISMISSALS_KEY) ?? "0", 10);
+    return Number.isNaN(dismissals) ? 0 : dismissals;
+  } catch {
+    return 0;
+  }
+}
+function AltHint() {
+  return jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: ["Hold", jsxRuntimeExports.jsx(Kbd, { variant: "outline", size: "compact", className: "mx-1", children: getAltKeyLabel() }), "to see delta between spans"] });
+}
+function NavHint() {
+  return jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: ["Use", jsxRuntimeExports.jsx(Kbd, { variant: "outline", size: "compact", className: "ml-1", children: "J" }), jsxRuntimeExports.jsx("span", { className: "mx-1", children: "/" }), jsxRuntimeExports.jsx(Kbd, { variant: "outline", size: "compact", className: "mr-1", children: "K" }), "to move between spans"] });
+}
+function TraceShortcutHelper({ hasMultipleSpans, reducedMotion }) {
+  const [visible, setVisible] = reactExports.useState(false);
+  const [index2, setIndex] = reactExports.useState(0);
+  reactExports.useEffect(() => {
+    setVisible(readDismissals() < DISMISSAL_LIMIT);
+  }, []);
+  reactExports.useEffect(() => {
+    if (reducedMotion)
+      return;
+    const id2 = setInterval(() => {
+      setIndex((i) => i === 0 ? 1 : 0);
+    }, HINT_ROTATION_MS);
+    return () => clearInterval(id2);
+  }, [reducedMotion]);
+  if (!visible || !hasMultipleSpans)
+    return null;
+  const dismiss = () => {
+    try {
+      window.localStorage.setItem(DISMISSALS_KEY, String(readDismissals() + 1));
+    } catch {
+    }
+    setVisible(false);
+  };
+  return jsxRuntimeExports.jsxs("div", { className: "group absolute bottom-3 left-1/2 z-10 hidden h-8 max-w-[calc(100%-2rem)] -translate-x-1/2 items-center gap-1 text-xs leading-none text-gray-900 md:inline-flex", children: [jsxRuntimeExports.jsx("span", { "aria-live": "polite", "aria-atomic": "true", className: "inline-flex items-center whitespace-nowrap", children: reducedMotion ? jsxRuntimeExports.jsx(AltHint, {}) : jsxRuntimeExports.jsx("span", { className: `inline-flex items-center ${styles$1.hint}`, children: index2 === 0 ? jsxRuntimeExports.jsx(AltHint, {}) : jsxRuntimeExports.jsx(NavHint, {}) }, index2) }), jsxRuntimeExports.jsx("button", { type: "button", className: "inline-flex h-5 w-5 items-center justify-center rounded text-muted-foreground opacity-0 transition-opacity hover:bg-accent hover:text-foreground group-hover:opacity-100 focus-visible:opacity-100 motion-reduce:transition-none", onClick: dismiss, "aria-label": "Dismiss trace shortcuts helper", children: jsxRuntimeExports.jsx(X$3, { className: "h-3 w-3" }) })] });
+}
 const ActiveSpanContext = reactExports.createContext(null);
 ActiveSpanContext.displayName = "ActiveSpanContext";
 function ActiveSpanProvider({ spans, children: children2 }) {
@@ -87093,7 +87325,7 @@ function NewTraceViewerContent({ trace: trace2, onLoadMore, hasMore, isLoadingMo
       e.stopPropagation();
       setSearchQuery("");
     }
-  }, placeholder: "Search spans...", "aria-label": "Search spans", className: "flex-1 min-w-0 bg-transparent text-sm text-gray-1000 placeholder:text-gray-800 outline-none" }), searchQuery && jsxRuntimeExports.jsx("button", { type: "button", "aria-label": "Clear search", onClick: () => setSearchQuery(""), className: "-mr-2 hidden h-full max-w-full shrink-0 cursor-pointer items-center rounded-r-md border-0 bg-transparent px-2.5 font-inherit text-base text-gray-900 no-underline transition-colors duration-150 ease-in hover:text-gray-1000 focus-visible:-outline-offset-1 focus-visible:outline focus-visible:outline-2 focus-visible:outline-[var(--ds-focus-color)] min-[961px]:flex", children: jsxRuntimeExports.jsx(Kbd, { variant: "outline", size: "search", children: "Esc" }) })] }), endHeader: jsxRuntimeExports.jsx(TimelineHeader, { markers: timeMarkers, hoverInfo: hoverInfo2 }), children: [jsxRuntimeExports.jsxs("div", { className: "block overflow-visible", children: [jsxRuntimeExports.jsx(EventList, { spans: trace2.spans, activeSpanId, searchResult, onSelectSpan: handleSelectSpan }), jsxRuntimeExports.jsx("div", { ref: loadMoreSentinelRef, className: "flex justify-center", children: isLoadingMore ? jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-center gap-2 py-3 text-sm text-gray-800", children: [jsxRuntimeExports.jsx(Spinner, { size: 14 }), jsxRuntimeExports.jsx("span", { children: "Loading spans…" })] }) : null })] }), jsxRuntimeExports.jsx("div", { ref: timelineRef, className: "block min-h-0 overflow-visible relative", onDoubleClick: resetZoom, onMouseMove: handleTimelineMouseMove, onMouseLeave: handleTimelineMouseLeave, children: jsxRuntimeExports.jsx(Timeline, { spans: trace2.spans, viewStart: viewport.start, viewEnd: viewport.end, markers: timeMarkers, selectedId: activeSpanId, searchResult, onSelect: handleSelectSpan, onRevealTime: handleRevealTime, hoverFraction, altHeld }) })] }), jsxRuntimeExports.jsxs("div", { className: "absolute right-3 bottom-3 z-[5] flex items-center border border-gray-alpha-400 rounded-md bg-background-100 shadow-sm overflow-hidden divide-x divide-gray-alpha-400", children: [jsxRuntimeExports.jsx(IconButton, { variant: "muted", size: "small", onClick: zoomOut, "aria-label": "Zoom out", children: jsxRuntimeExports.jsx(ZoomOut, { className: "w-4 h-4" }) }), jsxRuntimeExports.jsx(IconButton, { variant: "muted", size: "small", onClick: resetZoom, "aria-label": "Reset zoom", children: jsxRuntimeExports.jsx(RotateCcw, { className: "w-3.5 h-3.5" }) }), jsxRuntimeExports.jsx(IconButton, { variant: "muted", size: "small", onClick: zoomIn, "aria-label": "Zoom in", children: jsxRuntimeExports.jsx(ZoomIn, { className: "w-4 h-4" }) })] })] }), activeSpan ? jsxRuntimeExports.jsxs("aside", { className: "flex flex-col h-full max-h-full bg-background-100 border-l border-gray-alpha-400 overflow-auto", children: [jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between gap-2 shrink-0 px-4 pt-3 pb-3", children: [jsxRuntimeExports.jsx("span", { className: "text-label-14 font-medium text-gray-1000 truncate block", children: selectedSpanName }), jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-0.5 shrink-0", children: [jsxRuntimeExports.jsxs(Tooltip$1, { children: [jsxRuntimeExports.jsx(TooltipTrigger$1, { asChild: true, children: jsxRuntimeExports.jsx(IconButton, { "aria-label": "Navigate up", "aria-keyshortcuts": "K", onClick: handleSelectPrevSpan, disabled: !prevSpanId, children: jsxRuntimeExports.jsx(ChevronUp, { className: "w-4 h-4" }) }) }), prevSpanId ? jsxRuntimeExports.jsxs(TooltipContent$1, { children: ["Navigate up", jsxRuntimeExports.jsx(Kbd, { children: "K" })] }) : null] }), jsxRuntimeExports.jsxs(Tooltip$1, { children: [jsxRuntimeExports.jsx(TooltipTrigger$1, { asChild: true, children: jsxRuntimeExports.jsx(IconButton, { "aria-label": "Navigate down", "aria-keyshortcuts": "J", onClick: handleSelectNextSpan, disabled: !nextSpanId, children: jsxRuntimeExports.jsx(ChevronDown, { className: "w-4 h-4" }) }) }), nextSpanId ? jsxRuntimeExports.jsxs(TooltipContent$1, { children: ["Navigate down", jsxRuntimeExports.jsx(Kbd, { children: "J" })] }) : null] }), jsxRuntimeExports.jsx("div", { "aria-hidden": true, className: "w-px h-4 bg-gray-alpha-400 mx-1" }), jsxRuntimeExports.jsx(IconButton, { "aria-label": "Close span details", "aria-keyshortcuts": "Escape", onClick: handleClearActiveSpan, children: jsxRuntimeExports.jsx(X$3, { className: "w-4 h-4" }) })] })] }), jsxRuntimeExports.jsx("div", { className: "flex-1 overflow-y-auto", children: jsxRuntimeExports.jsx(ErrorBoundary$1, { children: jsxRuntimeExports.jsx(EntityDetailPanel, { run: sidebar.run, onStreamClick: sidebar.onStreamClick, onRunClick: sidebar.onRunClick, spanDetailData: sidebar.spanDetailData, spanDetailError: sidebar.spanDetailError, spanDetailLoading: sidebar.spanDetailLoading, onSpanSelect: sidebar.onSpanSelect, onWakeUpSleep: sidebar.onWakeUpSleep, onLoadEventData: sidebar.onLoadEventData, onResolveHook: sidebar.onResolveHook, encryptionKey: sidebar.encryptionKey, onDecrypt: sidebar.onDecrypt, isDecrypting: sidebar.isDecrypting, selectedSpan }) }) })] }) : null, jsxRuntimeExports.jsx(TraceShortcutHelper, { hasMultipleSpans: trace2.spans.length > 1, reducedMotion })] });
+  }, placeholder: "Search spans...", "aria-label": "Search spans", className: "flex-1 min-w-0 bg-transparent text-sm text-gray-1000 placeholder:text-gray-800 outline-none" }), searchQuery && jsxRuntimeExports.jsx("button", { type: "button", "aria-label": "Clear search", onClick: () => setSearchQuery(""), className: "-mr-2 hidden h-full max-w-full shrink-0 cursor-pointer items-center rounded-r-md border-0 bg-transparent px-2.5 font-inherit text-base text-gray-900 no-underline transition-colors duration-150 ease-in hover:text-gray-1000 focus-visible:-outline-offset-1 focus-visible:outline focus-visible:outline-2 focus-visible:outline-[var(--ds-focus-color)] min-[961px]:flex", children: jsxRuntimeExports.jsx(Kbd, { variant: "outline", size: "search", children: "Esc" }) })] }), endHeader: jsxRuntimeExports.jsx(TimelineHeader, { markers: timeMarkers, hoverInfo: hoverInfo2 }), children: [jsxRuntimeExports.jsxs("div", { className: "block overflow-visible", children: [jsxRuntimeExports.jsx(EventList, { spans: trace2.spans, activeSpanId, searchResult, onSelectSpan: handleSelectSpan }), jsxRuntimeExports.jsx("div", { ref: loadMoreSentinelRef, className: "flex justify-center", children: isLoadingMore ? jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-center gap-2 py-3 text-sm text-gray-800", children: [jsxRuntimeExports.jsx(Spinner, { size: 14 }), jsxRuntimeExports.jsx("span", { children: "Loading spans…" })] }) : null })] }), jsxRuntimeExports.jsx("div", { ref: timelineRef, className: "block min-h-0 overflow-visible relative", onDoubleClick: resetZoom, onMouseMove: handleTimelineMouseMove, onMouseLeave: handleTimelineMouseLeave, children: jsxRuntimeExports.jsx(Timeline, { spans: trace2.spans, viewStart: viewport.start, viewEnd: viewport.end, markers: timeMarkers, selectedId: activeSpanId, searchResult, onSelect: handleSelectSpan, onRevealTime: handleRevealTime, hoverFraction, altHeld }) })] }), jsxRuntimeExports.jsxs("div", { className: "absolute right-3 bottom-3 z-[5] flex items-center border border-gray-alpha-400 rounded-md bg-background-100 shadow-sm overflow-hidden divide-x divide-gray-alpha-400", children: [jsxRuntimeExports.jsx(IconButton, { variant: "muted", size: "small", onClick: zoomOut, "aria-label": "Zoom out", children: jsxRuntimeExports.jsx(ZoomOut, { className: "w-4 h-4" }) }), jsxRuntimeExports.jsx(IconButton, { variant: "muted", size: "small", onClick: resetZoom, "aria-label": "Reset zoom", children: jsxRuntimeExports.jsx(RotateCcw, { className: "w-3.5 h-3.5" }) }), jsxRuntimeExports.jsx(IconButton, { variant: "muted", size: "small", onClick: zoomIn, "aria-label": "Zoom in", children: jsxRuntimeExports.jsx(ZoomIn, { className: "w-4 h-4" }) })] })] }), activeSpan ? jsxRuntimeExports.jsxs("aside", { className: "flex flex-col h-full max-h-full bg-background-100 border-l border-gray-alpha-400 overflow-auto", children: [jsxRuntimeExports.jsxs("div", { className: "flex items-center justify-between gap-2 shrink-0 px-4 pt-3 pb-3", children: [jsxRuntimeExports.jsx("span", { className: "text-label-14 font-medium text-gray-1000 truncate block", children: selectedSpanName }), jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-0.5 shrink-0", children: [jsxRuntimeExports.jsxs(Tooltip$1, { children: [jsxRuntimeExports.jsx(TooltipTrigger$1, { asChild: true, children: jsxRuntimeExports.jsx(IconButton, { "aria-label": "Navigate up", "aria-keyshortcuts": "K", onClick: handleSelectPrevSpan, disabled: !prevSpanId, children: jsxRuntimeExports.jsx(ChevronUp, { className: "w-4 h-4" }) }) }), prevSpanId ? jsxRuntimeExports.jsxs(TooltipContent$1, { children: ["Navigate up", jsxRuntimeExports.jsx(Kbd, { children: "K" })] }) : null] }), jsxRuntimeExports.jsxs(Tooltip$1, { children: [jsxRuntimeExports.jsx(TooltipTrigger$1, { asChild: true, children: jsxRuntimeExports.jsx(IconButton, { "aria-label": "Navigate down", "aria-keyshortcuts": "J", onClick: handleSelectNextSpan, disabled: !nextSpanId, children: jsxRuntimeExports.jsx(ChevronDown, { className: "w-4 h-4" }) }) }), nextSpanId ? jsxRuntimeExports.jsxs(TooltipContent$1, { children: ["Navigate down", jsxRuntimeExports.jsx(Kbd, { children: "J" })] }) : null] }), jsxRuntimeExports.jsx("div", { "aria-hidden": true, className: "w-px h-4 bg-gray-alpha-400 mx-1" }), jsxRuntimeExports.jsx(IconButton, { "aria-label": "Close span details", "aria-keyshortcuts": "Escape", onClick: handleClearActiveSpan, children: jsxRuntimeExports.jsx(X$3, { className: "w-4 h-4" }) })] })] }), jsxRuntimeExports.jsx("div", { className: "flex-1 overflow-y-auto", children: jsxRuntimeExports.jsx(ErrorBoundary$1, { children: jsxRuntimeExports.jsx(EntityDetailPanel, { run: sidebar.run, onStreamClick: sidebar.onStreamClick, onRunClick: sidebar.onRunClick, fetchSpanDetail: sidebar.fetchSpanDetail, onWakeUpSleep: sidebar.onWakeUpSleep, onLoadEventData: sidebar.onLoadEventData, onResolveHook: sidebar.onResolveHook, encryptionKey: sidebar.encryptionKey, onDecrypt: sidebar.onDecrypt, isDecrypting: sidebar.isDecrypting, selectedSpan, showSeparateEventOccurrenceTimestamps: sidebar.showSeparateEventOccurrenceTimestamps }) }) })] }) : null, jsxRuntimeExports.jsx(TraceShortcutHelper, { hasMultipleSpans: trace2.spans.length > 1, reducedMotion })] });
 }
 const NewTraceViewer = ({ run: run2, events: events2, sidebarData, onLoadMore, hasMore, isLoadingMore, loading = false }) => {
   const trace2 = reactExports.useMemo(() => {
@@ -90466,6 +90698,19 @@ if (typeof globalThis !== "undefined") {
     });
   }
 }
+const RETRYABLE_WORLD_ERROR_CODES = /* @__PURE__ */ new Set(["TRANSPORT", "TIMEOUT"]);
+function isRetryableWorldError(err) {
+  if (ThrottleError.is(err)) {
+    return true;
+  }
+  if (!WorkflowWorldError.is(err)) {
+    return false;
+  }
+  if (err.status !== void 0 && err.status >= 500) {
+    return true;
+  }
+  return err.code !== void 0 && RETRYABLE_WORLD_ERROR_CODES.has(err.code);
+}
 const colorEnabled = (() => {
   var _a3;
   const p2 = globalThis.process;
@@ -90790,7 +91035,7 @@ async function deserializeTraceCarrier(traceCarrier) {
 }
 const OtelApi = once$1(async () => {
   try {
-    return await import("./index-meg9qk8y.js");
+    return await import("./index-Dq5jTBN4.js");
   } catch {
     runtimeLogger.info("OpenTelemetry not available, tracing will be disabled");
     return null;
@@ -91006,7 +91251,7 @@ const encryption = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.definePr
   encrypt: encrypt$1,
   importKey
 }, Symbol.toStringTag, { value: "Module" }));
-const version$1 = "5.0.0-beta.24";
+const version$1 = "5.0.0-beta.26";
 const WorldCacheKey = Symbol.for("@workflow/world//cache");
 const WorldCachePromiseKey = Symbol.for("@workflow/world//cachePromise");
 const GetWorldFnKey$1 = Symbol.for("@workflow/world//getWorldFn");
@@ -92620,7 +92865,16 @@ function createReconnectingFramedStream(runId, name2, startIndex) {
 }
 const STREAM_FLUSH_INTERVAL_MS = 10;
 class WorkflowServerWritableStream extends WritableStream {
-  constructor(runId, name2) {
+  /**
+   * @param runReadyBarrier Turbo mode only: a promise that resolves once the
+   * backgrounded `run_started` has landed. When the step body runs
+   * optimistically (before `run_started` is durable), the first chunk write to
+   * a brand-new stream would otherwise reach the World before the run exists
+   * and be rejected as run-not-found. Awaiting this once before the first
+   * flush/close orders the write after the run's creation. `undefined` outside
+   * turbo and on the await path, where the run was already durable.
+   */
+  constructor(runId, name2, runReadyBarrier) {
     if (typeof runId !== "string") {
       throw new WorkflowRuntimeError(`"runId" must be a string, got "${typeof runId}"`);
     }
@@ -92628,6 +92882,16 @@ class WorkflowServerWritableStream extends WritableStream {
       throw new WorkflowRuntimeError(`"name" is required, got "${name2}"`);
     }
     const worldPromise = getWorldLazy();
+    let pendingRunReady = runReadyBarrier;
+    const ensureRunReady = async () => {
+      if (pendingRunReady) {
+        try {
+          await pendingRunReady;
+        } catch {
+        }
+        pendingRunReady = void 0;
+      }
+    };
     let buffer2 = [];
     let flushTimer = null;
     let flushPromise = null;
@@ -92639,6 +92903,7 @@ class WorkflowServerWritableStream extends WritableStream {
       }
       if (buffer2.length === 0)
         return;
+      await ensureRunReady();
       const chunksToFlush = buffer2.slice();
       const world = await worldPromise;
       if (resolvedFlushIntervalMs === void 0) {
@@ -92688,6 +92953,7 @@ class WorkflowServerWritableStream extends WritableStream {
           flushPromise = null;
         }
         await flush();
+        await ensureRunReady();
         const world = await worldPromise;
         await world.streams.close(runId, name2);
       },
@@ -92803,7 +93069,7 @@ function attachAbortListenerOnce(signal, streamName, runId, cryptoKey, ops) {
     })());
   }, { once: true });
 }
-function getExternalReducers(global2 = globalThis, ops, runId, cryptoKey, framedByteStreams = false) {
+function getExternalReducers(global2 = globalThis, ops, runId, cryptoKey, framedByteStreams = false, runReadyBarrier) {
   return {
     ...getAllBaseReducers(global2),
     ReadableStream: (value) => {
@@ -92817,7 +93083,7 @@ function getExternalReducers(global2 = globalThis, ops, runId, cryptoKey, framed
       const streamId = (global2[STABLE_ULID] || defaultUlid)();
       const name2 = `strm_${streamId}`;
       const type = getStreamType(value);
-      const writable = new WorkflowServerWritableStream(runId, name2);
+      const writable = new WorkflowServerWritableStream(runId, name2, runReadyBarrier);
       if (type === "bytes") {
         if (framedByteStreams) {
           ops.push(value.pipeThrough(getByteFramingStream()).pipeTo(writable));
@@ -92825,7 +93091,7 @@ function getExternalReducers(global2 = globalThis, ops, runId, cryptoKey, framed
           ops.push(value.pipeTo(writable));
         }
       } else {
-        ops.push(value.pipeThrough(getSerializeStream(getExternalReducers(global2, ops, runId, cryptoKey, framedByteStreams), cryptoKey)).pipeTo(writable));
+        ops.push(value.pipeThrough(getSerializeStream(getExternalReducers(global2, ops, runId, cryptoKey, framedByteStreams, runReadyBarrier), cryptoKey)).pipeTo(writable));
       }
       const s2 = { name: name2 };
       if (type)
@@ -92935,7 +93201,7 @@ function getWorkflowReducers(global2 = globalThis) {
     }
   };
 }
-function getStepReducers(global2 = globalThis, ops, runId, cryptoKey, framedByteStreams = false) {
+function getStepReducers(global2 = globalThis, ops, runId, cryptoKey, framedByteStreams = false, runReadyBarrier) {
   return {
     ...getAllBaseReducers(global2),
     ReadableStream: (value) => {
@@ -92954,7 +93220,7 @@ function getStepReducers(global2 = globalThis, ops, runId, cryptoKey, framedByte
         name2 = `strm_${streamId}`;
         type = getStreamType(value);
         framing = type === "bytes" && framedByteStreams ? "framed-v1" : framing;
-        const writable = new WorkflowServerWritableStream(runId, name2);
+        const writable = new WorkflowServerWritableStream(runId, name2, runReadyBarrier);
         if (type === "bytes") {
           if (framing === "framed-v1") {
             ops.push(value.pipeThrough(getByteFramingStream()).pipeTo(writable));
@@ -92962,7 +93228,7 @@ function getStepReducers(global2 = globalThis, ops, runId, cryptoKey, framedByte
             ops.push(value.pipeTo(writable));
           }
         } else {
-          ops.push(value.pipeThrough(getSerializeStream(getStepReducers(global2, ops, runId, cryptoKey, framedByteStreams), cryptoKey)).pipeTo(writable));
+          ops.push(value.pipeThrough(getSerializeStream(getStepReducers(global2, ops, runId, cryptoKey, framedByteStreams, runReadyBarrier), cryptoKey)).pipeTo(writable));
         }
       }
       const s2 = { name: name2 };
@@ -93568,16 +93834,16 @@ async function hydrateStepArguments(value, runId, key, ops = [], global2 = globa
   await recordCompression(compressionStats, "deserialize");
   return result;
 }
-async function dehydrateStepReturnValue(value, runId, key, ops = [], global2 = globalThis, v1Compat = false, framedByteStreams = false, compression = false) {
+async function dehydrateStepReturnValue(value, runId, key, ops = [], global2 = globalThis, v1Compat = false, framedByteStreams = false, compression = false, runReadyBarrier) {
   if (v1Compat) {
-    const str = stringify$2(value, getStepReducers(global2, ops, runId, key, framedByteStreams));
+    const str = stringify$2(value, getStepReducers(global2, ops, runId, key, framedByteStreams, runReadyBarrier));
     return revive(str);
   }
   try {
     const compressionStats = {};
     const result = await serialize(value, key, {
       global: global2,
-      extraReducers: getStreamAndRequestReducers(getStepReducers(global2, ops, runId, key, framedByteStreams)),
+      extraReducers: getStreamAndRequestReducers(getStepReducers(global2, ops, runId, key, framedByteStreams, runReadyBarrier)),
       compression,
       compressionStats
     });
@@ -93936,6 +94202,9 @@ function stripTag(fileId) {
 function hasTag(fileId, tag) {
   return fileId.endsWith(`.${tag}`);
 }
+function isUntagged(fileId) {
+  return !TAG_PATTERN.test(fileId);
+}
 function taggedPath(basedir, entityDir, fileId, tag) {
   assertSafeEntityId("fileId", fileId);
   if (tag !== void 0)
@@ -94362,7 +94631,7 @@ async function initDataDir(dataDir) {
 let otelApiPromise$1 = null;
 async function getOtelApi$1() {
   if (!otelApiPromise$1) {
-    otelApiPromise$1 = import("./index-meg9qk8y.js").catch(() => null);
+    otelApiPromise$1 = import("./index-Dq5jTBN4.js").catch(() => null);
   }
   return otelApiPromise$1;
 }
@@ -120174,34 +120443,54 @@ function createQueue$2(config2) {
         await semaphore.acquire();
       }
       const MAX_LOCAL_SAFETY_LIMIT = 256;
+      let delivery = 0;
       try {
-        for (let attempt = 0; attempt < MAX_LOCAL_SAFETY_LIMIT; attempt++) {
+        for (let loop = 0; loop < MAX_LOCAL_SAFETY_LIMIT; loop++) {
           const headers2 = {
             ...opts == null ? void 0 : opts.headers,
             "content-type": "application/json",
             "x-vqs-queue-name": queueName,
             "x-vqs-message-id": messageId,
-            "x-vqs-message-attempt": String(attempt + 1)
+            "x-vqs-message-attempt": String(delivery + 1)
           };
           const directHandler = directHandlers.get(prefix);
           let response2;
-          if (directHandler) {
-            const req = new Request(`http://localhost/.well-known/workflow/v1/${pathname}`, {
-              method: "POST",
-              headers: headers2,
-              body: body2
-            });
-            response2 = await directHandler(req);
-          } else {
-            const baseUrl = await resolveBaseUrl$1(config2);
-            response2 = await fetch(`${baseUrl}/.well-known/workflow/v1/${pathname}`, {
-              method: "POST",
-              duplex: "half",
-              dispatcher: httpAgent,
-              headers: headers2,
-              body: body2
+          try {
+            if (directHandler) {
+              const req = new Request(`http://localhost/.well-known/workflow/v1/${pathname}`, {
+                method: "POST",
+                headers: headers2,
+                body: body2
+              });
+              response2 = await directHandler(req);
+            } else {
+              const baseUrl = await resolveBaseUrl$1(config2);
+              response2 = await fetch(`${baseUrl}/.well-known/workflow/v1/${pathname}`, {
+                method: "POST",
+                duplex: "half",
+                dispatcher: httpAgent,
+                headers: headers2,
+                body: body2
+              });
+            }
+          } catch (err) {
+            const name2 = err == null ? void 0 : err.name;
+            if (closeSignal.aborted || name2 === "AbortError" || name2 === "ResponseAborted") {
+              return;
+            }
+            if (isDetachedArrayBufferQueueError(err))
+              throw err;
+            console.error(`[world-local] Queue delivery failed at the transport (loop ${loop + 1}), retrying`, {
+              queueName,
+              messageId,
+              ...runId && { runId },
+              ...stepId && { stepId },
+              error: String(err)
             });
+            await setTimeout$1(5e3, void 0, { signal: closeSignal });
+            continue;
           }
+          delivery++;
           const text2 = await response2.text();
           if (response2.ok) {
             try {
@@ -120219,7 +120508,7 @@ function createQueue$2(config2) {
             }
             return;
           }
-          console.error(`[world-local] Queue message failed (attempt ${attempt + 1}, HTTP ${response2.status})`, {
+          console.error(`[world-local] Queue message failed (attempt ${delivery}, HTTP ${response2.status})`, {
             queueName,
             messageId,
             ...runId && { runId },
@@ -121930,13 +122219,14 @@ function createLocalWorld(args) {
       if (!recoverActiveRuns) {
         return;
       }
-      const recoveryRuns = tag ? {
+      const fileIdFilter = tag ? (fileId) => hasTag(fileId, tag) : isUntagged;
+      const recoveryRuns = {
         ...storage.runs,
         list: ((params) => storage.runs.list({
           ...params,
-          fileIdFilter: (fileId) => hasTag(fileId, tag)
+          fileIdFilter
         }))
-      } : storage.runs;
+      };
       await reenqueueActiveRuns(recoveryRuns, queue.queue, "world-local");
     },
     async close() {
@@ -121947,7 +122237,7 @@ function createLocalWorld(args) {
         const basedir = mergedConfig.dataDir;
         const hooksDir = path$3.join(basedir, "hooks");
         const taggedHookFiles = await listTaggedFiles(hooksDir, tag);
-        const { HookSchema: HookSchema2 } = await import("./index-BOfd00Ok.js");
+        const { HookSchema: HookSchema2 } = await import("./index-BgRt1-Z6.js");
         await Promise.all(taggedHookFiles.map(async (hookFile) => {
           const hook = await readJSON(path$3.join(hooksDir, hookFile), HookSchema2);
           if (hook == null ? void 0 : hook.token) {
@@ -121982,6 +122272,67 @@ function createLocalWorld(args) {
     }
   };
 }
+let _dispatcher;
+let _eventsDispatcher;
+let _streamDispatcher;
+const BASE_AGENT_OPTIONS = {
+  connections: 8,
+  keepAliveTimeout: 1e4,
+  // HTTP/1.1 pipelining is disabled (pipelining: 1) because it causes
+  // head-of-line blocking that deadlocks the webhook respondWith mechanism.
+  pipelining: 1
+};
+const DEFAULT_AGENT_OPTIONS = {
+  ...BASE_AGENT_OPTIONS,
+  allowH2: false
+};
+const EVENTS_AGENT_OPTIONS = {
+  ...BASE_AGENT_OPTIONS,
+  allowH2: true
+};
+const RETRY_AGENT_OPTIONS = {
+  // Observe Retry-After header if received
+  retryAfter: true,
+  // Retry 5xx in-process (genuine transient blips recover fast), but NOT 429.
+  // The Vercel firewall issues a challenge as a 429: our server-to-server
+  // client cannot solve a challenge, so in-process retries just re-trigger it
+  // ~5× per request and amplify load against an already-overloaded firewall
+  // during an incident. Letting 429 pass through surfaces it immediately to
+  // makeRequest — which maps it to a ThrottleError carrying the
+  // `x-vercel-mitigated` / `x-vercel-id` headers — and the queue does the
+  // (backed-off) retry instead. This is the long-standing "let 429s pass
+  // through" intent. (undici default is [500, 502, 503, 504, 429].)
+  statusCodes: [500, 502, 503, 504]
+};
+const STREAM_RETRY_OPTIONS = {
+  retryAfter: true,
+  methods: ["PUT"],
+  statusCodes: [429]
+};
+function getDispatcher(config2) {
+  return (config2 == null ? void 0 : config2.dispatcher) ?? getDefaultDispatcher();
+}
+function getEventsDispatcher(config2) {
+  return (config2 == null ? void 0 : config2.dispatcher) ?? getDefaultEventsDispatcher();
+}
+function getStreamDispatcher(config2) {
+  return (config2 == null ? void 0 : config2.dispatcher) ?? getDefaultStreamDispatcher();
+}
+function makeRetryDispatcher(agentOptions, retryOptions) {
+  return new undiciExports.RetryAgent(new undiciExports.Agent(agentOptions), retryOptions);
+}
+function getDefaultDispatcher() {
+  _dispatcher ?? (_dispatcher = makeRetryDispatcher(DEFAULT_AGENT_OPTIONS, RETRY_AGENT_OPTIONS));
+  return _dispatcher;
+}
+function getDefaultEventsDispatcher() {
+  _eventsDispatcher ?? (_eventsDispatcher = makeRetryDispatcher(EVENTS_AGENT_OPTIONS, RETRY_AGENT_OPTIONS));
+  return _eventsDispatcher;
+}
+function getDefaultStreamDispatcher() {
+  _streamDispatcher ?? (_streamDispatcher = makeRetryDispatcher(EVENTS_AGENT_OPTIONS, STREAM_RETRY_OPTIONS));
+  return _streamDispatcher;
+}
 var getContext_1;
 var hasRequiredGetContext;
 function requireGetContext() {
@@ -122100,8 +122451,8 @@ function requireGetVercelOidcToken() {
     }
     try {
       const [{ getTokenPayload, isExpired }, { refreshToken }] = await Promise.all([
-        await import("./token-util-MV-dKCwg.js").then((n) => n.t),
-        await import("./token-fPsafoXW.js").then((n) => n.t)
+        await import("./token-util-CaJAmsYa.js").then((n) => n.t),
+        await import("./token-DK_R23fr.js").then((n) => n.t)
       ]);
       if (!token || isExpired(getTokenPayload(token), options == null ? void 0 : options.expirationBufferMs)) {
         await refreshToken(options);
@@ -122664,32 +123015,218 @@ function requireDist() {
   return dist;
 }
 var distExports = requireDist();
-let _dispatcher;
-function getDispatcher(config2) {
-  return (config2 == null ? void 0 : config2.dispatcher) ?? getDefaultDispatcher();
+let otelApiPromise = null;
+async function getOtelApi() {
+  if (!otelApiPromise) {
+    otelApiPromise = import("./index-Dq5jTBN4.js").catch(() => null);
+  }
+  return otelApiPromise;
 }
-function getDefaultDispatcher() {
-  if (!_dispatcher) {
-    _dispatcher = new undiciExports.RetryAgent(new undiciExports.Agent({
-      connections: 8,
-      keepAliveTimeout: 1e4,
-      // H2 is specifically incompatible with SvelteKit on Vercel prod. Everything else
-      // runs fine.
-      // TODO: Investigate/fix the failure on SvelteKit so we can re-enable H2.
-      allowH2: false,
-      // HTTP/1.1 pipelining is disabled (pipelining: 1) because it causes
-      // head-of-line blocking that deadlocks the webhook respondWith mechanism.
-      pipelining: 1
-    }), {
-      // Observe Retry-After header if received
-      retryAfter: true
-      // By default, we observe re-try headers, and also separately
-      // re-try on these status codes: 429 / 500 / 502 / 503 / 504.
-      // TODO: We might want to let 429s pass through, so that we can do
-      // runtime retry-after handling through the queue.
-    });
+let tracerPromise = null;
+async function getTracer() {
+  if (!tracerPromise) {
+    tracerPromise = getOtelApi().then((otel) => otel ? otel.trace.getTracer("workflow") : null);
   }
-  return _dispatcher;
+  return tracerPromise;
+}
+async function trace(spanName2, ...args) {
+  const [tracer, otel] = await Promise.all([getTracer(), getOtelApi()]);
+  const { fn: fn2, opts } = typeof args[0] === "function" ? { fn: args[0], opts: {} } : { fn: args[1], opts: args[0] };
+  if (!fn2)
+    throw new Error("Function to trace must be provided");
+  if (!tracer || !otel) {
+    return await fn2();
+  }
+  return tracer.startActiveSpan(spanName2, opts, async (span) => {
+    try {
+      const result = await fn2(span);
+      span.setStatus({ code: otel.SpanStatusCode.OK });
+      return result;
+    } catch (e) {
+      span.setStatus({
+        code: otel.SpanStatusCode.ERROR,
+        message: e.message
+      });
+      throw e;
+    } finally {
+      span.end();
+    }
+  });
+}
+async function getSpanKind(field) {
+  const otel = await getOtelApi();
+  if (!otel)
+    return void 0;
+  return otel.SpanKind[field];
+}
+async function injectTraceContextIntoHeaders(headers2) {
+  const otel = await getOtelApi();
+  if (!otel)
+    return;
+  const carrier = {};
+  otel.propagation.inject(otel.context.active(), carrier);
+  for (const [key, value] of Object.entries(carrier)) {
+    headers2.set(key, value);
+  }
+}
+function SemanticConvention(...names) {
+  return (value) => Object.fromEntries(names.map((name2) => [name2, value]));
+}
+const HttpRequestMethod = SemanticConvention("http.request.method");
+const UrlFull = SemanticConvention("url.full");
+const ServerAddress = SemanticConvention("server.address");
+const ServerPort = SemanticConvention("server.port");
+const HttpResponseStatusCode = SemanticConvention("http.response.status_code");
+const ErrorType = SemanticConvention("error.type");
+const WorldParseFormat = SemanticConvention("workflow.world.parse.format");
+const PeerService = SemanticConvention("peer.service");
+const RpcSystem = SemanticConvention("rpc.system");
+const RpcService = SemanticConvention("rpc.service");
+const RpcMethod = SemanticConvention("rpc.method");
+const WorkflowRunId = SemanticConvention("workflow.run.id");
+const StepId = SemanticConvention("step.id");
+const REQUEST_TIMEOUT_MS = 6e4;
+const HTTP_DEBUG_ENABLED = typeof process !== "undefined" && typeof process.env.DEBUG === "string" && (process.env.DEBUG.includes("workflow:") || process.env.DEBUG === "*");
+const DIAGNOSTIC_HEADERS = [
+  "x-vercel-id",
+  "x-vercel-error",
+  "x-vercel-mitigated"
+];
+function getVercelDiagnostics(headers2) {
+  return DIAGNOSTIC_HEADERS.flatMap((header) => {
+    const value = headers2.get(header);
+    return value ? [`${header}=${value}`] : [];
+  });
+}
+function formatVercelDiagnostics(headers2) {
+  const diagnostics2 = getVercelDiagnostics(headers2);
+  return diagnostics2.length > 0 ? ` (${diagnostics2.join("; ")})` : "";
+}
+function httpLog(method, label, response2, ms2) {
+  if (!HTTP_DEBUG_ENABLED)
+    return;
+  const diagnostics2 = getVercelDiagnostics(response2.headers);
+  const suffix = diagnostics2.length > 0 ? `; ${diagnostics2.join("; ")}` : "";
+  console.debug(`[workflow:world-vercel:http] ${method} ${label} -> ${response2.status} (${ms2}ms${suffix})`);
+}
+function logCurlRepro(method, url2, headers2) {
+  if (!process.env.DEBUG)
+    return;
+  const stringifiedHeaders = Array.from(headers2.entries()).filter(([key]) => key.toLowerCase() !== "authorization").map(([key, value]) => `-H "${key}: ${value}"`).join(" ");
+  console.error(`Failed to fetch, reproduce with:
+curl -X ${method} ${stringifiedHeaders} "${url2}"`);
+}
+function parseRetryAfter(value) {
+  if (!value)
+    return void 0;
+  const parsed = parseInt(value, 10);
+  return Number.isNaN(parsed) ? void 0 : parsed;
+}
+function errorForResponse(status, message2, opts = {}) {
+  const { retryAfter, code: code2, url: url2, mitigated } = opts;
+  if (status === 409)
+    return new EntityConflictError(message2);
+  if (status === 410)
+    return new RunExpiredError(message2);
+  if (status === 425)
+    return new TooEarlyError(message2, { retryAfter });
+  if (status === 429) {
+    if (isFirewallChallenge429(status, mitigated)) {
+      return new WorkflowWorldError(`${message2} (x-vercel-mitigated=challenge)`, {
+        url: url2,
+        status,
+        code: "TRANSPORT",
+        retryAfter
+      });
+    }
+    return new ThrottleError(message2, { retryAfter });
+  }
+  return new WorkflowWorldError(message2, { url: url2, status, code: code2, retryAfter });
+}
+function isFirewallChallenge429(status, mitigated) {
+  return status === 429 && mitigated === "challenge";
+}
+async function resolveVercelApiToken(opts) {
+  return (opts == null ? void 0 : opts.token) ?? process.env.VERCEL_TOKEN ?? await distExports.getVercelOidcToken().catch(() => null);
+}
+function parseServer(url2) {
+  try {
+    const parsed = new URL(url2);
+    return {
+      serverAddress: parsed.hostname,
+      serverPort: parsed.port ? parseInt(parsed.port, 10) : parsed.protocol === "https:" ? 443 : 80
+    };
+  } catch {
+    return {};
+  }
+}
+function httpClientSpanAttributes(args) {
+  const { method, url: url2, peerService } = args;
+  const { serverAddress, serverPort } = parseServer(url2);
+  return {
+    ...HttpRequestMethod(method),
+    ...UrlFull(url2),
+    ...serverAddress ? ServerAddress(serverAddress) : {},
+    ...serverPort ? ServerPort(serverPort) : {},
+    ...PeerService(peerService),
+    ...RpcSystem("http"),
+    ...RpcService(peerService)
+  };
+}
+async function instrumentedFetch(opts) {
+  const { method, url: url2, headers: headers2, body: body2, dispatcher: dispatcher2, peerService = "workflow-server", timeoutMs = REQUEST_TIMEOUT_MS, signal: callerSignal, injectTraceContext = true, cacheBust = true, logLabel, buildError } = opts;
+  const label = logLabel ?? url2;
+  return trace(`http ${method}`, { kind: await getSpanKind("CLIENT") }, async (span) => {
+    var _a3, _b2, _c2;
+    span == null ? void 0 : span.setAttributes(httpClientSpanAttributes({ method, url: url2, peerService }));
+    if (injectTraceContext)
+      await injectTraceContextIntoHeaders(headers2);
+    if (cacheBust)
+      headers2.set("X-Request-Time", Date.now().toString());
+    const timeoutSignal = timeoutMs != null ? AbortSignal.timeout(timeoutMs) : void 0;
+    const signal = callerSignal && timeoutSignal ? AbortSignal.any([callerSignal, timeoutSignal]) : callerSignal ?? timeoutSignal;
+    const start2 = Date.now();
+    let response2;
+    try {
+      response2 = await fetch(url2, {
+        method,
+        headers: headers2,
+        body: body2,
+        signal,
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any -- undici dispatcher type doesn't match @types/node's RequestInit
+        dispatcher: dispatcher2
+      });
+    } catch (error2) {
+      const elapsed = Date.now() - start2;
+      if (error2 instanceof Error && (error2.name === "TimeoutError" || error2.name === "AbortError")) {
+        const timeoutError = new WorkflowWorldError(`${method} ${label} timed out after ${elapsed}ms`, { url: url2, cause: error2 });
+        span == null ? void 0 : span.setAttributes({ ...ErrorType("TIMEOUT") });
+        (_a3 = span == null ? void 0 : span.recordException) == null ? void 0 : _a3.call(span, timeoutError);
+        throw timeoutError;
+      }
+      throw error2;
+    }
+    const ms2 = Date.now() - start2;
+    httpLog(method, label, response2, ms2);
+    span == null ? void 0 : span.setAttributes({ ...HttpResponseStatusCode(response2.status) });
+    if (!response2.ok) {
+      span == null ? void 0 : span.setAttributes({ ...ErrorType(`HTTP ${response2.status}`) });
+      logCurlRepro(method, url2, headers2);
+      if (buildError) {
+        const error3 = await buildError(response2);
+        (_b2 = span == null ? void 0 : span.recordException) == null ? void 0 : _b2.call(span, error3);
+        throw error3;
+      }
+      const text2 = await response2.text().catch(() => "");
+      const error2 = errorForResponse(response2.status, `${method} ${label} -> HTTP ${response2.status}: ${response2.statusText}${text2 ? ` ${text2}` : ""}${formatVercelDiagnostics(response2.headers)}`, {
+        url: url2,
+        retryAfter: parseRetryAfter(response2.headers.get("Retry-After"))
+      });
+      (_c2 = span == null ? void 0 : span.recordException) == null ? void 0 : _c2.call(span, error2);
+      throw error2;
+    }
+    return response2;
+  });
 }
 const KEY_BYTES = 32;
 async function deriveRunKey(deploymentKey, projectId, runId) {
@@ -122715,7 +123252,7 @@ async function deriveRunKey(deploymentKey, projectId, runId) {
   return new Uint8Array(derivedBits);
 }
 async function fetchRunKey(deploymentId, projectId, runId, options) {
-  const token = (options == null ? void 0 : options.token) ?? process.env.VERCEL_TOKEN ?? await distExports.getVercelOidcToken().catch(() => null);
+  const token = await resolveVercelApiToken({ token: options == null ? void 0 : options.token });
   if (!token) {
     throw new Error("Cannot fetch run key: no OIDC token or VERCEL_TOKEN available");
   }
@@ -122723,23 +123260,25 @@ async function fetchRunKey(deploymentId, projectId, runId, options) {
   if (options == null ? void 0 : options.teamId) {
     params.set("teamId", options.teamId);
   }
-  const response2 = await fetch(`https://api.vercel.com/v1/workflow/run-key/${deploymentId}?${params}`, {
+  const response2 = await instrumentedFetch({
     method: "GET",
-    headers: {
-      Authorization: `Bearer ${token}`
-    },
-    // @ts-expect-error -- undici dispatcher is accepted by Node.js fetch but not in @types/node's RequestInit
-    dispatcher: getDispatcher({ dispatcher: options == null ? void 0 : options.dispatcher })
-  });
-  if (!response2.ok) {
-    let body2;
-    try {
-      body2 = await response2.text();
-    } catch {
-      body2 = "<unable to read response body>";
+    url: `https://api.vercel.com/v1/workflow/run-key/${deploymentId}?${params}`,
+    headers: new Headers({ Authorization: `Bearer ${token}` }),
+    dispatcher: getDispatcher({ dispatcher: options == null ? void 0 : options.dispatcher }),
+    peerService: "vercel-api",
+    // Preserve the prior no-timeout behavior for this Vercel-API call; the
+    // shared RetryAgent still handles transient/5xx retries.
+    timeoutMs: null,
+    buildError: async (res) => {
+      let body2;
+      try {
+        body2 = await res.text();
+      } catch {
+        body2 = "<unable to read response body>";
+      }
+      return new Error(`Failed to fetch run key for ${runId} (deployment ${deploymentId}): HTTP ${res.status} ${res.statusText}${body2 ? ` — ${body2}` : ""}`);
     }
-    throw new Error(`Failed to fetch run key for ${runId} (deployment ${deploymentId}): HTTP ${response2.status} ${response2.statusText}${body2 ? ` — ${body2}` : ""}`);
-  }
+  });
   const data = await response2.json();
   const result = object$1({ key: string$3().nullable() }).safeParse(data);
   if (!result.success) {
@@ -122784,76 +123323,6 @@ function createGetEncryptionKeyForRun(projectId, teamId, token, dispatcher2) {
     });
   };
 }
-let otelApiPromise = null;
-async function getOtelApi() {
-  if (!otelApiPromise) {
-    otelApiPromise = import("./index-meg9qk8y.js").catch(() => null);
-  }
-  return otelApiPromise;
-}
-let tracerPromise = null;
-async function getTracer() {
-  if (!tracerPromise) {
-    tracerPromise = getOtelApi().then((otel) => otel ? otel.trace.getTracer("workflow") : null);
-  }
-  return tracerPromise;
-}
-async function trace(spanName2, ...args) {
-  const [tracer, otel] = await Promise.all([getTracer(), getOtelApi()]);
-  const { fn: fn2, opts } = typeof args[0] === "function" ? { fn: args[0], opts: {} } : { fn: args[1], opts: args[0] };
-  if (!fn2)
-    throw new Error("Function to trace must be provided");
-  if (!tracer || !otel) {
-    return await fn2();
-  }
-  return tracer.startActiveSpan(spanName2, opts, async (span) => {
-    try {
-      const result = await fn2(span);
-      span.setStatus({ code: otel.SpanStatusCode.OK });
-      return result;
-    } catch (e) {
-      span.setStatus({
-        code: otel.SpanStatusCode.ERROR,
-        message: e.message
-      });
-      throw e;
-    } finally {
-      span.end();
-    }
-  });
-}
-async function getSpanKind(field) {
-  const otel = await getOtelApi();
-  if (!otel)
-    return void 0;
-  return otel.SpanKind[field];
-}
-async function injectTraceContextIntoHeaders(headers2) {
-  const otel = await getOtelApi();
-  if (!otel)
-    return;
-  const carrier = {};
-  otel.propagation.inject(otel.context.active(), carrier);
-  for (const [key, value] of Object.entries(carrier)) {
-    headers2.set(key, value);
-  }
-}
-function SemanticConvention(...names) {
-  return (value) => Object.fromEntries(names.map((name2) => [name2, value]));
-}
-const HttpRequestMethod = SemanticConvention("http.request.method");
-const UrlFull = SemanticConvention("url.full");
-const ServerAddress = SemanticConvention("server.address");
-const ServerPort = SemanticConvention("server.port");
-const HttpResponseStatusCode = SemanticConvention("http.response.status_code");
-const ErrorType = SemanticConvention("error.type");
-const WorldParseFormat = SemanticConvention("workflow.world.parse.format");
-const PeerService = SemanticConvention("peer.service");
-const RpcSystem = SemanticConvention("rpc.system");
-const RpcService = SemanticConvention("rpc.service");
-const RpcMethod = SemanticConvention("rpc.method");
-const WorkflowRunId = SemanticConvention("workflow.run.id");
-const StepId = SemanticConvention("step.id");
 const WORKFLOW_SERVER_SERVICE = {
   peerService: "workflow-server",
   rpcSystem: "http",
@@ -127450,29 +127919,37 @@ var QueueClient = class {
     setApi(this, new ApiClient({ ...options, region }));
   }
 };
-const version = "5.0.0-beta.20";
-const HTTP_DEBUG_ENABLED = typeof process !== "undefined" && typeof process.env.DEBUG === "string" && (process.env.DEBUG.includes("workflow:") || process.env.DEBUG === "*");
-function httpLog(method, endpoint, response2, ms2) {
-  if (HTTP_DEBUG_ENABLED) {
-    const responseContext = getResponseDiagnosticHeaders(response2);
-    const diagnosticSuffix = responseContext.length > 0 ? `; ${responseContext.join("; ")}` : "";
-    console.debug(`[workflow:world-vercel:http] ${method} ${endpoint} -> ${response2.status} (${ms2}ms${diagnosticSuffix})`);
-  }
-}
-function getResponseDiagnosticHeaders(response2) {
-  return ["x-vercel-id", "x-vercel-error"].flatMap((header) => {
-    const value = response2.headers.get(header);
-    return value ? [`${header}=${value}`] : [];
-  });
-}
-function formatResponseDiagnostics(response2) {
-  const headers2 = getResponseDiagnosticHeaders(response2);
-  return headers2.length > 0 ? ` (${headers2.join("; ")})` : "";
-}
-const REQUEST_TIMEOUT_MS = 6e4;
+const version = "5.0.0-beta.22";
 const IDEMPOTENT_METHODS = /* @__PURE__ */ new Set(["GET", "HEAD"]);
 const MAX_BODY_PARSE_RETRIES = 2;
 const BODY_PARSE_RETRY_BASE_MS = 100;
+const TRANSIENT_TRANSPORT_ERROR_CODES = /* @__PURE__ */ new Set([
+  "UND_ERR_REQ_RETRY",
+  "UND_ERR_SOCKET",
+  "UND_ERR_CONNECT",
+  "UND_ERR_CONNECT_TIMEOUT",
+  "UND_ERR_HEADERS_TIMEOUT",
+  "UND_ERR_BODY_TIMEOUT",
+  "UND_ERR_CLOSED",
+  "ECONNRESET",
+  "ECONNREFUSED",
+  "ENOTFOUND",
+  "EAI_AGAIN",
+  "EPIPE"
+]);
+function getTransientTransportCode(error2) {
+  let current = error2;
+  for (let depth = 0; current != null && depth < 5; depth++) {
+    if (typeof current === "object" && "code" in current) {
+      const code2 = current.code;
+      if (typeof code2 === "string" && TRANSIENT_TRANSPORT_ERROR_CODES.has(code2)) {
+        return code2;
+      }
+    }
+    current = current == null ? void 0 : current.cause;
+  }
+  return void 0;
+}
 const getWorkflowServerUrlOverride = () => process.env.VERCEL_WORKFLOW_SERVER_URL || "";
 const DEFAULT_RESOLVE_DATA_OPTION = "all";
 function deserializeError(obj) {
@@ -127541,26 +128018,13 @@ async function makeRequest({ endpoint, options = {}, config: config2 = {}, schem
   const method = options.method || "GET";
   const { baseUrl, headers: headers2 } = await getHttpConfig(config2);
   const url2 = `${baseUrl}${endpoint}`;
-  let serverAddress;
-  let serverPort;
-  try {
-    const parsedUrl = new URL(url2);
-    serverAddress = parsedUrl.hostname;
-    serverPort = parsedUrl.port ? parseInt(parsedUrl.port, 10) : parsedUrl.protocol === "https:" ? 443 : 80;
-  } catch {
-  }
   return trace(`http ${method}`, { kind: await getSpanKind("CLIENT") }, async (span) => {
-    var _a3;
-    span == null ? void 0 : span.setAttributes({
-      ...HttpRequestMethod(method),
-      ...UrlFull(url2),
-      ...serverAddress && ServerAddress(serverAddress),
-      ...serverPort && ServerPort(serverPort),
-      // Peer service for Datadog service maps
-      ...PeerService("workflow-server"),
-      ...RpcSystem("http"),
-      ...RpcService("workflow-server")
-    });
+    var _a3, _b2, _c2;
+    span == null ? void 0 : span.setAttributes(httpClientSpanAttributes({
+      method,
+      url: url2,
+      peerService: "workflow-server"
+    }));
     headers2.set("Accept", "application/cbor");
     await injectTraceContextIntoHeaders(headers2);
     let body2;
@@ -127590,61 +128054,42 @@ async function makeRequest({ endpoint, options = {}, config: config2 = {}, schem
       } catch (error2) {
         const elapsed = Date.now() - fetchStart;
         if (error2 instanceof Error && (error2.name === "TimeoutError" || error2.name === "AbortError")) {
-          const timeoutError = new WorkflowWorldError(`${method} ${endpoint} timed out after ${elapsed}ms`, { url: url2, cause: error2 });
+          const timeoutError = new WorkflowWorldError(`${method} ${endpoint} timed out after ${elapsed}ms`, { url: url2, code: "TIMEOUT", cause: error2 });
           span == null ? void 0 : span.setAttributes({ ...ErrorType("TIMEOUT") });
           (_a3 = span == null ? void 0 : span.recordException) == null ? void 0 : _a3.call(span, timeoutError);
           throw timeoutError;
         }
+        const transportCode = getTransientTransportCode(error2);
+        if (transportCode) {
+          const transportError = new WorkflowWorldError(`${method} ${endpoint} transport failure after ${elapsed}ms (${transportCode})`, { url: url2, code: "TRANSPORT", cause: error2 });
+          span == null ? void 0 : span.setAttributes({ ...ErrorType("TRANSPORT") });
+          (_b2 = span == null ? void 0 : span.recordException) == null ? void 0 : _b2.call(span, transportError);
+          throw transportError;
+        }
         throw error2;
       }
       const fetchMs = Date.now() - fetchStart;
-      responseDiagnostics = formatResponseDiagnostics(response2);
+      responseDiagnostics = formatVercelDiagnostics(response2.headers);
       httpLog(method, endpoint, response2, fetchMs);
       span == null ? void 0 : span.setAttributes({
         ...HttpResponseStatusCode(response2.status)
       });
       if (!response2.ok) {
         const errorData = await parseResponseBody(response2).then((r2) => r2.data).catch(() => ({}));
-        if (process.env.DEBUG) {
-          const stringifiedHeaders = Array.from(headers2.entries()).filter(([key]) => key.toLowerCase() !== "authorization").map(([key, value]) => `-H "${key}: ${value}"`).join(" ");
-          console.error(`Failed to fetch, reproduce with:
-curl -X ${request2.method} ${stringifiedHeaders} "${url2}"`);
-        }
-        let retryAfter;
-        const retryAfterHeader = response2.headers.get("Retry-After");
-        if (retryAfterHeader) {
-          const parsed = parseInt(retryAfterHeader, 10);
-          if (!Number.isNaN(parsed)) {
-            retryAfter = parsed;
-          }
-        }
+        logCurlRepro(request2.method, url2, headers2);
+        const retryAfter = parseRetryAfter(response2.headers.get("Retry-After"));
         const defaultMessage = (errorData.message || `${request2.method} ${endpoint} -> HTTP ${response2.status}: ${response2.statusText}`) + responseDiagnostics;
-        const throwWithTrace = (error2) => {
-          var _a4;
-          span == null ? void 0 : span.setAttributes({
-            ...ErrorType(errorData.code || `HTTP ${response2.status}`)
-          });
-          (_a4 = span == null ? void 0 : span.recordException) == null ? void 0 : _a4.call(span, error2);
-          throw error2;
-        };
-        if (response2.status === 409) {
-          throwWithTrace(new EntityConflictError(defaultMessage));
-        }
-        if (response2.status === 410) {
-          throwWithTrace(new RunExpiredError(defaultMessage));
-        }
-        if (response2.status === 425) {
-          throwWithTrace(new TooEarlyError(defaultMessage, { retryAfter }));
-        }
-        if (response2.status === 429) {
-          throwWithTrace(new ThrottleError(defaultMessage, { retryAfter }));
-        }
-        throwWithTrace(new WorkflowWorldError(defaultMessage, {
+        const error2 = errorForResponse(response2.status, defaultMessage, {
           url: url2,
-          status: response2.status,
           code: errorData.code,
-          retryAfter
-        }));
+          retryAfter,
+          mitigated: response2.headers.get("x-vercel-mitigated")
+        });
+        span == null ? void 0 : span.setAttributes({
+          ...ErrorType(errorData.code || `HTTP ${response2.status}`)
+        });
+        (_c2 = span == null ? void 0 : span.recordException) == null ? void 0 : _c2.call(span, error2);
+        throw error2;
       }
       onResponse == null ? void 0 : onResponse(response2);
       try {
@@ -127793,7 +128238,7 @@ const MAX_DELAY_SECONDS = Number(
   // 23 hours - leave 1h buffer before 24h retention limit
 );
 const HANDLER_ERROR_RETRY_AFTER_SECONDS = 1;
-const HANDLER_ERROR_MAX_RETRY_AFTER_SECONDS = 60;
+const HANDLER_ERROR_MAX_RETRY_AFTER_SECONDS = 900;
 const HANDLER_ERROR_RETRY_JITTER_RATIO = 0.25;
 function getHandlerErrorRetryAfterSeconds(deliveryCount) {
   const backoffSeconds = Math.min(Math.max(HANDLER_ERROR_RETRY_AFTER_SECONDS, 2 ** (deliveryCount - 1)), HANDLER_ERROR_MAX_RETRY_AFTER_SECONDS);
@@ -127927,28 +128372,30 @@ function createResolveLatestDeploymentId(config2) {
     if (!currentDeploymentId) {
       throw new Error("Cannot resolve latest deployment: VERCEL_DEPLOYMENT_ID environment variable is not set");
     }
-    const token = (config2 == null ? void 0 : config2.token) ?? process.env.VERCEL_TOKEN ?? await distExports.getVercelOidcToken().catch(() => null);
+    const token = await resolveVercelApiToken(config2);
     if (!token) {
       throw new Error("Cannot resolve latest deployment: no OIDC token or VERCEL_TOKEN available");
     }
     const url2 = `https://api.vercel.com/v1/workflow/resolve-latest-deployment/${encodeURIComponent(currentDeploymentId)}`;
-    const response2 = await fetch(url2, {
+    const response2 = await instrumentedFetch({
       method: "GET",
-      headers: {
-        Authorization: `Bearer ${token}`
-      },
-      // @ts-expect-error -- undici dispatcher is accepted by Node.js fetch but not in @types/node's RequestInit
-      dispatcher: getDispatcher(config2)
-    });
-    if (!response2.ok) {
-      let body2;
-      try {
-        body2 = await response2.text();
-      } catch {
-        body2 = "<unable to read response body>";
+      url: url2,
+      headers: new Headers({ Authorization: `Bearer ${token}` }),
+      dispatcher: getDispatcher(config2),
+      peerService: "vercel-api",
+      // Preserve the prior no-timeout behavior for this Vercel-API call; the
+      // shared RetryAgent still handles transient/5xx retries.
+      timeoutMs: null,
+      buildError: async (res) => {
+        let body2;
+        try {
+          body2 = await res.text();
+        } catch {
+          body2 = "<unable to read response body>";
+        }
+        return new Error(`Failed to resolve latest deployment for ${currentDeploymentId}: HTTP ${res.status} ${res.statusText}${body2 ? ` — ${body2}` : ""}`);
       }
-      throw new Error(`Failed to resolve latest deployment for ${currentDeploymentId}: HTTP ${response2.status} ${response2.statusText}${body2 ? ` — ${body2}` : ""}`);
-    }
+    });
     const data = await response2.json();
     const result = ResolveLatestDeploymentResponseSchema.safeParse(data);
     if (!result.success) {
@@ -127957,6 +128404,181 @@ function createResolveLatestDeploymentId(config2) {
     return result.data.id;
   };
 }
+const EVENT_RETRY_ELIGIBILITY = {
+  // Creates: conditional create → 409 EntityConflictError if it already exists.
+  run_created: {
+    retryable: true,
+    reason: "conditional create → 409 if exists"
+  },
+  step_created: {
+    retryable: true,
+    reason: "conditional create → 409 if exists"
+  },
+  wait_created: {
+    retryable: true,
+    reason: "conditional create → 409 if exists"
+  },
+  hook_created: {
+    retryable: true,
+    reason: "transactional token uniqueness → 409 if exists"
+  },
+  // Run start: early-returns if already running, writes no duplicate row.
+  run_started: {
+    retryable: true,
+    reason: "early-returns if already running, no duplicate row"
+  },
+  // Terminal transitions: conditional `.where()` excludes terminal states →
+  // 409 before the event row is written.
+  run_completed: {
+    retryable: true,
+    reason: "terminal-state guard → 409, no duplicate row"
+  },
+  run_failed: {
+    retryable: true,
+    reason: "terminal-state guard → 409, no duplicate row"
+  },
+  run_cancelled: {
+    retryable: true,
+    reason: "terminal-state guard → 409, no duplicate row"
+  },
+  step_completed: {
+    retryable: true,
+    reason: "terminal-state guard → 409, no duplicate row"
+  },
+  step_failed: {
+    retryable: true,
+    reason: "terminal-state guard → 409, no duplicate row"
+  },
+  wait_completed: {
+    retryable: true,
+    reason: "waiting-state guard → 409, no duplicate row"
+  },
+  hook_disposed: {
+    retryable: true,
+    reason: "conditional delete (exists) → 409, no duplicate row"
+  },
+  // True idempotency via a correlationId constraint that reuses the eventId.
+  attr_set: {
+    retryable: true,
+    reason: "correlationId constraint reuses eventId (idempotent replay)"
+  },
+  // NOT safe to retry — see the module comment.
+  step_started: {
+    retryable: false,
+    reason: "unconditional attempt increment → a retry double-counts attempts"
+  },
+  step_retrying: {
+    retryable: false,
+    reason: "no duplicate guard → a retry appends a second event row"
+  },
+  hook_received: {
+    retryable: false,
+    reason: "no server guard → a retry duplicates the row / re-delivers payload"
+  },
+  // Server-originated; the SDK never POSTs it.
+  hook_conflict: {
+    retryable: false,
+    reason: "server-originated; never POSTed by the SDK"
+  }
+};
+const MAX_EVENT_POST_RETRIES = 2;
+const EVENT_POST_RETRY_BASE_MS = 100;
+const EVENT_POST_RETRY_JITTER_MS = 50;
+const TRANSIENT_CODES = /* @__PURE__ */ new Set([
+  "ECONNRESET",
+  "ECONNREFUSED",
+  "ENOTFOUND",
+  "ENETDOWN",
+  "ENETUNREACH",
+  "EHOSTDOWN",
+  "EHOSTUNREACH",
+  "EPIPE",
+  "ETIMEDOUT",
+  "UND_ERR_SOCKET",
+  "UND_ERR_REQ_RETRY",
+  "UND_ERR_CONNECT_TIMEOUT",
+  "UND_ERR_HEADERS_TIMEOUT",
+  "UND_ERR_BODY_TIMEOUT",
+  // Names (undici/Node surface these on the error or its cause).
+  // `TimeoutError` is our own per-request deadline (`AbortSignal.timeout` in
+  // makeRequest) — a genuinely ambiguous failure worth retrying. We deliberately
+  // do NOT include `AbortError`: that is how an external/caller-supplied
+  // cancellation surfaces (makeRequest composes the caller's signal via
+  // `AbortSignal.any`), and re-issuing a write the caller asked to cancel —
+  // stalling the abort by the full backoff budget — would be wrong.
+  "TimeoutError",
+  "RequestRetryError"
+]);
+function collectErrorMarkers(err, depth = 0) {
+  if (depth > 5 || err === null || typeof err !== "object")
+    return [];
+  const markers2 = [];
+  const e = err;
+  if (typeof e.code === "string")
+    markers2.push(e.code);
+  if (typeof e.name === "string")
+    markers2.push(e.name);
+  if (e.cause)
+    markers2.push(...collectErrorMarkers(e.cause, depth + 1));
+  return markers2;
+}
+function isRetryableEventPostError(err) {
+  if (EntityConflictError.is(err) || RunExpiredError.is(err) || TooEarlyError.is(err) || ThrottleError.is(err)) {
+    return false;
+  }
+  if (WorkflowWorldError.is(err)) {
+    if (err.code === "PARSE_ERROR")
+      return true;
+    if (typeof err.status === "number") {
+      return err.status >= 500 && err.status <= 599;
+    }
+  }
+  return collectErrorMarkers(err).some((m2) => TRANSIENT_CODES.has(m2));
+}
+const sleep$1 = (ms2) => new Promise((resolve2) => setTimeout(resolve2, ms2));
+const RETRY_DEBUG_ENABLED = typeof process !== "undefined" && typeof process.env.DEBUG === "string" && (process.env.DEBUG.includes("workflow:") || process.env.DEBUG === "*");
+function logRetry(message2, fields) {
+  if (!RETRY_DEBUG_ENABLED)
+    return;
+  const suffix = Object.entries(fields).map(([k2, v2]) => `${k2}=${v2}`).join(" ");
+  console.debug(`[workflow:world-vercel:event-retry] ${message2} ${suffix}`);
+}
+function errorMarker(err) {
+  if (WorkflowWorldError.is(err)) {
+    return err.code ?? (err.status != null ? `status_${err.status}` : err.name);
+  }
+  return collectErrorMarkers(err)[0] ?? (err instanceof Error ? err.name : "unknown");
+}
+async function withEventPostRetry(fn2, eventType) {
+  var _a3;
+  const retryable = ((_a3 = EVENT_RETRY_ELIGIBILITY[eventType]) == null ? void 0 : _a3.retryable) ?? false;
+  for (let attempt = 0; ; attempt++) {
+    try {
+      return await fn2();
+    } catch (err) {
+      const transient = retryable && isRetryableEventPostError(err);
+      if (transient && attempt < MAX_EVENT_POST_RETRIES) {
+        const backoff = EVENT_POST_RETRY_BASE_MS * 2 ** attempt + Math.floor(Math.random() * EVENT_POST_RETRY_JITTER_MS);
+        logRetry("retrying event POST after transient failure", {
+          eventType,
+          attempt: attempt + 1,
+          backoffMs: backoff,
+          error: errorMarker(err)
+        });
+        await sleep$1(backoff);
+        continue;
+      }
+      if (transient) {
+        logRetry("exhausted in-process retries; surfacing for queue redelivery", {
+          eventType,
+          attempts: attempt + 1,
+          error: errorMarker(err)
+        });
+      }
+      throw err;
+    }
+  }
+}
 const V4_FRAME_CONTENT_TYPE = "application/vnd.workflow.v4-frames";
 function encodeFrame(meta2, body2) {
   const metaBytes = new Uint8Array(encode(meta2));
@@ -128026,15 +128648,16 @@ async function* readerToIterator(reader) {
       yield value;
   }
 }
-async function fetchV4(url2, init2, config2) {
-  init2.headers.set("X-Request-Time", Date.now().toString());
-  await injectTraceContextIntoHeaders(init2.headers);
-  return fetch(url2, {
+async function fetchV4(url2, init2, config2, opName) {
+  return instrumentedFetch({
     method: init2.method,
+    url: url2,
     headers: init2.headers,
     body: init2.body,
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- undici dispatcher type doesn't match @types/node's RequestInit
-    dispatcher: getDispatcher(config2)
+    dispatcher: getEventsDispatcher(config2),
+    timeoutMs: null,
+    logLabel: opName,
+    buildError: async (response2) => errorFromV4Response(response2.status, headersToRecord(response2.headers), await response2.text(), opName, url2)
   });
 }
 function headersToRecord(headers2) {
@@ -128101,7 +128724,7 @@ function buildPostFrameMeta(input) {
     meta2.skipPreload = input.skipPreload;
   return meta2;
 }
-function throwForErrorResponse(statusCode, responseHeaders, errorBody, opName, url2) {
+function errorFromV4Response(statusCode, responseHeaders, errorBody, opName, url2) {
   let message2 = `v4 ${opName} failed: HTTP ${statusCode}`;
   let code2;
   try {
@@ -128114,26 +128737,12 @@ function throwForErrorResponse(statusCode, responseHeaders, errorBody, opName, u
     if (errorBody)
       message2 += ` ${errorBody}`;
   }
-  let retryAfter;
-  const retryAfterHeader = readHeader(responseHeaders, "retry-after");
-  if (retryAfterHeader) {
-    const parsed = parseInt(retryAfterHeader, 10);
-    if (!Number.isNaN(parsed))
-      retryAfter = parsed;
-  }
-  if (statusCode === 409)
-    throw new EntityConflictError(message2);
-  if (statusCode === 410)
-    throw new RunExpiredError(message2);
-  if (statusCode === 425)
-    throw new TooEarlyError(message2, { retryAfter });
-  if (statusCode === 429)
-    throw new ThrottleError(message2, { retryAfter });
-  throw new WorkflowWorldError(message2, {
-    status: statusCode,
+  const retryAfter = parseRetryAfter(readHeader(responseHeaders, "retry-after"));
+  return errorForResponse(statusCode, message2, {
+    retryAfter,
     code: code2,
     url: url2,
-    retryAfter
+    mitigated: readHeader(responseHeaders, "x-vercel-mitigated")
   });
 }
 async function createWorkflowRunEventV4(input, config2) {
@@ -128142,11 +128751,7 @@ async function createWorkflowRunEventV4(input, config2) {
   headers2.set("Content-Type", "application/octet-stream");
   const frame2 = encodeFrame(buildPostFrameMeta(input), input.payload ?? new Uint8Array(0));
   const url2 = `${baseUrl}/v4/runs/${encodeURIComponent(input.runId)}/events/${encodeURIComponent(input.eventType)}`;
-  const response2 = await fetchV4(url2, { method: "POST", headers: headers2, body: frame2 }, config2);
-  if (!response2.ok) {
-    const errorBody = await response2.text();
-    throwForErrorResponse(response2.status, headersToRecord(response2.headers), errorBody, "createEvent", url2);
-  }
+  const response2 = await fetchV4(url2, { method: "POST", headers: headers2, body: frame2 }, config2, "createEvent");
   const eventId = response2.headers.get(V4_RESPONSE_HEADERS.eventId);
   const runId = response2.headers.get(V4_RESPONSE_HEADERS.runId);
   const createdAt = response2.headers.get(V4_RESPONSE_HEADERS.createdAt);
@@ -128168,11 +128773,7 @@ function readHeader(responseHeaders, name2) {
 async function getEventV4(runId, eventId, config2) {
   const { baseUrl, headers: headers2 } = await getHttpConfig(config2);
   const url2 = `${baseUrl}/v4/runs/${encodeURIComponent(runId)}/events/${encodeURIComponent(eventId)}`;
-  const response2 = await fetchV4(url2, { method: "GET", headers: headers2 }, config2);
-  if (!response2.ok) {
-    const errorBody = await response2.text();
-    throwForErrorResponse(response2.status, headersToRecord(response2.headers), errorBody, "getEvent", url2);
-  }
+  const response2 = await fetchV4(url2, { method: "GET", headers: headers2 }, config2, "getEvent");
   const contentType = response2.headers.get("content-type");
   if (!(contentType == null ? void 0 : contentType.startsWith(V4_FRAME_CONTENT_TYPE))) {
     throw new Error(`v4 getEvent: expected ${V4_FRAME_CONTENT_TYPE}, got ${contentType ?? "(none)"}`);
@@ -128184,11 +128785,7 @@ async function getEventV4(runId, eventId, config2) {
   throw new Error(`v4 getEvent: empty frame stream for ${eventId}`);
 }
 async function consumeListFrameStream(url2, headers2, config2, opName) {
-  const response2 = await fetchV4(url2, { method: "GET", headers: headers2 }, config2);
-  if (!response2.ok) {
-    const errorBody = await response2.text();
-    throwForErrorResponse(response2.status, headersToRecord(response2.headers), errorBody, opName, url2);
-  }
+  const response2 = await fetchV4(url2, { method: "GET", headers: headers2 }, config2, opName);
   const contentType = response2.headers.get("content-type");
   if (!(contentType == null ? void 0 : contentType.startsWith(V4_FRAME_CONTENT_TYPE))) {
     throw new Error(`v4 ${opName}: expected ${V4_FRAME_CONTENT_TYPE}, got ${contentType ?? "(none)"}`);
@@ -128629,7 +129226,7 @@ async function getWorkflowRunEvents(params, config2) {
 }
 async function createWorkflowRunEvent(id2, data, params, config2) {
   try {
-    return await createWorkflowRunEventInner(id2, data, params, config2);
+    return await withEventPostRetry(() => createWorkflowRunEventInner(id2, data, params, config2), data.eventType);
   } catch (err) {
     if (hookEventsRequiringExistence.has(data.eventType) && WorkflowWorldError.is(err) && err.status === 404 && data.correlationId) {
       throw new HookNotFoundError(data.correlationId);
@@ -128815,13 +129412,10 @@ function getStreamReadUrl(name2, runId, httpConfig) {
   return new URL(`${httpConfig.baseUrl}/v3/runs/${encodeURIComponent(runId)}/stream/${encodeURIComponent(name2)}`);
 }
 function createStreamRequestError(operation, url2, response2, text2) {
-  const context = [`PUT ${url2.origin}${url2.pathname}`];
-  for (const header of ["x-vercel-id", "x-vercel-error"]) {
-    const value = response2.headers.get(header);
-    if (value) {
-      context.push(`${header}=${value}`);
-    }
-  }
+  const context = [
+    `PUT ${url2.origin}${url2.pathname}`,
+    ...getVercelDiagnostics(response2.headers)
+  ];
   return new Error(`Stream ${operation} failed: HTTP ${response2.status} (${context.join("; ")}): ${text2}`);
 }
 function encodeMultiChunks(chunks) {
@@ -128864,15 +129458,17 @@ function createStreamer(config2) {
         const resolvedRunId = await runId;
         const httpConfig = await getHttpConfig(config2);
         const url2 = getStreamUrl(name2, resolvedRunId, httpConfig);
-        const response2 = await fetch(url2, {
+        const response2 = await instrumentedFetch({
           method: "PUT",
+          url: url2.toString(),
           body: chunk,
-          headers: httpConfig.headers
+          headers: httpConfig.headers,
+          dispatcher: getStreamDispatcher(config2),
+          timeoutMs: null,
+          logLabel: url2.pathname,
+          buildError: async (res) => createStreamRequestError("write", url2, res, await res.text())
         });
-        const text2 = await response2.text();
-        if (!response2.ok) {
-          throw createStreamRequestError("write", url2, response2, text2);
-        }
+        await response2.text();
       },
       async writeMulti(runId, name2, chunks) {
         if (chunks.length === 0)
@@ -128884,15 +129480,17 @@ function createStreamer(config2) {
           const batch = chunks.slice(i, i + MAX_CHUNKS_PER_REQUEST);
           const body2 = encodeMultiChunks(batch);
           const url2 = getStreamUrl(name2, resolvedRunId, httpConfig);
-          const response2 = await fetch(url2, {
+          const response2 = await instrumentedFetch({
             method: "PUT",
+            url: url2.toString(),
             body: body2,
-            headers: httpConfig.headers
+            headers: httpConfig.headers,
+            dispatcher: getStreamDispatcher(config2),
+            timeoutMs: null,
+            logLabel: url2.pathname,
+            buildError: async (res) => createStreamRequestError("write", url2, res, await res.text())
           });
-          const text2 = await response2.text();
-          if (!response2.ok) {
-            throw createStreamRequestError("write", url2, response2, text2);
-          }
+          await response2.text();
         }
       },
       async close(runId, name2) {
@@ -128900,14 +129498,16 @@ function createStreamer(config2) {
         const httpConfig = await getHttpConfig(config2);
         httpConfig.headers.set("X-Stream-Done", "true");
         const url2 = getStreamUrl(name2, resolvedRunId, httpConfig);
-        const response2 = await fetch(url2, {
+        const response2 = await instrumentedFetch({
           method: "PUT",
-          headers: httpConfig.headers
+          url: url2.toString(),
+          headers: httpConfig.headers,
+          dispatcher: getStreamDispatcher(config2),
+          timeoutMs: null,
+          logLabel: url2.pathname,
+          buildError: async (res) => createStreamRequestError("close", url2, res, await res.text())
         });
-        const text2 = await response2.text();
-        if (!response2.ok) {
-          throw createStreamRequestError("close", url2, response2, text2);
-        }
+        await response2.text();
       },
       async get(runId, name2, startIndex) {
         const httpConfig = await getHttpConfig(config2);
@@ -128915,12 +129515,15 @@ function createStreamer(config2) {
         if (typeof startIndex === "number") {
           url2.searchParams.set("startIndex", String(startIndex));
         }
-        const response2 = await fetch(url2, {
-          headers: httpConfig.headers
+        const response2 = await instrumentedFetch({
+          method: "GET",
+          url: url2.toString(),
+          headers: httpConfig.headers,
+          dispatcher: void 0,
+          timeoutMs: null,
+          logLabel: url2.pathname,
+          buildError: (res) => new Error(`Failed to fetch stream: ${res.status}`)
         });
-        if (!response2.ok) {
-          throw new Error(`Failed to fetch stream: ${response2.status}`);
-        }
         if (!response2.body) {
           throw new Error("No response body for stream");
         }
@@ -128953,12 +129556,15 @@ function createStreamer(config2) {
       async list(runId) {
         const httpConfig = await getHttpConfig(config2);
         const url2 = new URL(`${httpConfig.baseUrl}/v2/runs/${encodeURIComponent(runId)}/streams`);
-        const response2 = await fetch(url2, {
-          headers: httpConfig.headers
+        const response2 = await instrumentedFetch({
+          method: "GET",
+          url: url2.toString(),
+          headers: httpConfig.headers,
+          dispatcher: void 0,
+          timeoutMs: null,
+          logLabel: url2.pathname,
+          buildError: (res) => new Error(`Failed to list streams: ${res.status}`)
         });
-        if (!response2.ok) {
-          throw new Error(`Failed to list streams: ${response2.status}`);
-        }
         return await response2.json();
       }
     }
@@ -129072,7 +129678,7 @@ const getWorld = async () => {
 const GetWorldFnKey = Symbol.for("@workflow/world//getWorldFn");
 globalThis[GetWorldFnKey] ?? (globalThis[GetWorldFnKey] = getWorld);
 function waitUntil(promise2) {
-  void import("./index-B8YoYr9f.js").then((n) => n.i).then(({ waitUntil: waitUntil2 }) => {
+  void import("./index-DIXsjgfZ.js").then((n) => n.i).then(({ waitUntil: waitUntil2 }) => {
     waitUntil2(promise2);
   });
 }
@@ -132047,7 +132653,7 @@ async function start$1(workflow, argsOrOptions, options) {
       if (runCreatedResult.status === "rejected") {
         const err = runCreatedResult.reason;
         if (EntityConflictError.is(err)) ;
-        else if (isRetryableStartError(err)) {
+        else if (isRetryableWorldError(err)) {
           resilientStart = true;
           runtimeLogger.warn("Run creation event failed, but the run was accepted via the queue. The run_created event will be re-tried async by the runtime.", { workflowRunId: runId, error: err.message });
         } else {
@@ -132077,13 +132683,6 @@ async function start$1(workflow, argsOrOptions, options) {
     });
   });
 }
-function isRetryableStartError(err) {
-  if (ThrottleError.is(err))
-    return true;
-  if (WorkflowWorldError.is(err) && err.status && err.status >= 500)
-    return true;
-  return false;
-}
 const normalizeWorkflowArgs = (args) => {
   return Array.isArray(args) ? args : [args];
 };
@@ -137401,130 +138000,48 @@ async function fetchResourceWithCorrelationId(env2, resource, resourceId, option
   }
   return { data: resourceData, correlationId };
 }
-function useWorkflowResourceData(env2, resource, resourceId, options = {}) {
-  const { refreshInterval = 0, runId, enabled = true, encryptionKey } = options;
-  const [data, setData] = reactExports.useState(
-    null
-  );
-  const [loading, setLoading] = reactExports.useState(enabled);
-  const [error2, setError] = reactExports.useState(null);
-  const hydrate = reactExports.useCallback(
-    async (resource2) => encryptionKey ? hydrateResourceIOWithKey(resource2, encryptionKey) : hydrateResourceIO(resource2),
-    [encryptionKey]
-  );
-  const prevSelectionRef = reactExports.useRef("");
-  const fetchData = reactExports.useCallback(async () => {
-    if (!enabled) {
-      setLoading(false);
-      return;
-    }
-    const selectionKey = `${resource}:${resourceId}`;
-    if (selectionKey !== prevSelectionRef.current) {
-      setData(null);
-      prevSelectionRef.current = selectionKey;
-    }
-    setError(null);
-    setLoading(true);
-    if (resource === "hook") {
-      try {
-        const { error: error22, result } = await unwrapServerActionResult(
-          fetchHook$1(env2, resourceId, "all")
-        );
-        if (error22) {
-          setError(error22);
-          return;
-        }
-        try {
-          setData(await hydrate(result));
-        } catch (hydrateError) {
-          setError(
-            hydrateError instanceof Error ? hydrateError : new Error(String(hydrateError))
-          );
-        }
-      } finally {
-        setLoading(false);
-      }
-      return;
-    }
-    if (resource === "sleep") {
-      try {
-        if (!runId) {
-          setError(new Error("runId is required for loading sleep details"));
-          return;
-        }
-        const { error: error22, result } = await unwrapServerActionResult(
-          fetchEvents$1(env2, runId, {
-            sortOrder: "asc",
-            limit: 1e3,
-            withData: true
-          })
-        );
-        if (error22) {
-          setError(error22);
-          return;
-        }
-        try {
-          const allEvents = result.data.map(
-            hydrateResourceIO
-          );
-          const waitEvents = await Promise.all(
-            allEvents.filter((e) => e.correlationId === resourceId).map(hydrate)
-          );
-          const data2 = waitEventsToWaitEntity(waitEvents);
-          if (data2 === null) {
-            setError(
-              new Error(
-                `Failed to load ${resource} details: missing required event data`
-              )
-            );
-            return;
-          }
-          setData(data2);
-        } catch (hydrateError) {
-          setError(
-            hydrateError instanceof Error ? hydrateError : new Error(String(hydrateError))
-          );
-        }
-      } finally {
-        setLoading(false);
-      }
-      return;
+async function fetchSpanDetailResource(env2, selection2, options = {}) {
+  const { resource, resourceId, runId } = selection2;
+  const { encryptionKey } = options;
+  const hydrate = async (value) => encryptionKey ? hydrateResourceIOWithKey(value, encryptionKey) : hydrateResourceIO(value);
+  if (resource === "hook") {
+    const result = await unwrapOrThrow(fetchHook$1(env2, resourceId, "all"));
+    return hydrate(result);
+  }
+  if (resource === "sleep") {
+    if (!runId) {
+      throw new WorkflowWebAPIError(
+        "runId is required for loading sleep details",
+        { layer: "client" }
+      );
     }
-    try {
-      const { data: resourceData } = await fetchResourceWithCorrelationId(
-        env2,
-        resource,
-        resourceId,
-        { runId }
+    const result = await unwrapOrThrow(
+      fetchEvents$1(env2, runId, { sortOrder: "asc", limit: 1e3, withData: true })
+    );
+    const allEvents = result.data.map(
+      hydrateResourceIO
+    );
+    const waitEvents = await Promise.all(
+      allEvents.filter((e) => e.correlationId === resourceId).map(hydrate)
+    );
+    const data2 = waitEventsToWaitEntity(waitEvents);
+    if (data2 === null) {
+      throw new WorkflowWebAPIError(
+        `Failed to load ${resource} details: missing required event data`,
+        { layer: "client" }
       );
-      setData(await hydrate(resourceData));
-    } catch (error22) {
-      if (error22 instanceof Error) {
-        setError(error22);
-      } else {
-        setError(new Error(String(error22)));
-      }
-      return;
-    } finally {
-      setLoading(false);
     }
-  }, [env2, resource, resourceId, runId, enabled, hydrate]);
-  reactExports.useEffect(() => {
-    fetchData();
-  }, [fetchData]);
-  reactExports.useEffect(() => {
-    if (!refreshInterval || refreshInterval <= 0) {
-      return;
+    return data2;
+  }
+  const { data } = await fetchResourceWithCorrelationId(
+    env2,
+    resource,
+    resourceId,
+    {
+      runId
     }
-    const interval2 = setInterval(fetchData, refreshInterval);
-    return () => clearInterval(interval2);
-  }, [refreshInterval, fetchData]);
-  return {
-    data,
-    loading,
-    error: error2,
-    refresh: fetchData
-  };
+  );
+  return hydrate(data);
 }
 function mergeById(prev, next2, idKey) {
   const combined = [...prev, ...next2];
@@ -153566,30 +154083,15 @@ function RunDetailView({
     encryptionKey: encryptionKey ?? void 0,
     enabled: activeTab === "events"
   });
-  const [spanSelection, setSpanSelection] = reactExports.useState(
-    null
-  );
-  const {
-    data: spanDetailData,
-    loading: spanDetailLoading,
-    error: spanDetailError,
-    refresh: refreshSpanDetail
-  } = useWorkflowResourceData(
-    env2,
-    (spanSelection == null ? void 0 : spanSelection.resource) ?? "run",
-    (spanSelection == null ? void 0 : spanSelection.resourceId) ?? "",
-    {
-      runId: spanSelection == null ? void 0 : spanSelection.runId,
-      enabled: Boolean(
-        (spanSelection == null ? void 0 : spanSelection.resource) && (spanSelection == null ? void 0 : spanSelection.resourceId) && spanSelection.resource !== "hook"
-      ),
+  const fetchSpanDetail = reactExports.useCallback(
+    (selection2) => fetchSpanDetailResource(env2, selection2, {
       encryptionKey: encryptionKey ?? void 0
-    }
+    }),
+    [env2, encryptionKey]
   );
   const [isDecrypting, setIsDecrypting] = reactExports.useState(false);
   const handleDecrypt = reactExports.useCallback(async () => {
     if (encryptionKey) {
-      refreshSpanDetail();
       return;
     }
     setIsDecrypting(true);
@@ -153607,18 +154109,12 @@ function RunDetailView({
     } finally {
       setIsDecrypting(false);
     }
-  }, [encryptionKey, env2, runId, refreshSpanDetail]);
-  const handleSpanSelect = reactExports.useCallback((info) => {
-    setSpanSelection(info);
-  }, []);
+  }, [encryptionKey, env2, runId]);
   const sidebarData = reactExports.useMemo(
     () => ({
       run: run2,
       events: allEvents ?? [],
-      spanDetailData: spanDetailData ?? null,
-      spanDetailError,
-      spanDetailLoading,
-      onSpanSelect: handleSpanSelect,
+      fetchSpanDetail,
       onStreamClick: handleStreamClick,
       onRunClick: handleRunRefClick,
       onWakeUpSleep: handleWakeUpSleep,
@@ -153632,10 +154128,7 @@ function RunDetailView({
     [
       run2,
       allEvents,
-      spanDetailData,
-      spanDetailError,
-      spanDetailLoading,
-      handleSpanSelect,
+      fetchSpanDetail,
       handleStreamClick,
       handleRunRefClick,
       handleWakeUpSleep,
@@ -154161,7 +154654,7 @@ const route4 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProper
   __proto__: null,
   loader
 }, Symbol.toStringTag, { value: "Module" }));
-const serverManifest = { "entry": { "module": "/assets/entry.client-DOJDY_4b.js", "imports": ["/assets/index-BXZSIDEp.js"], "css": [] }, "routes": { "root": { "id": "root", "parentId": void 0, "path": "", "index": void 0, "caseSensitive": void 0, "hasAction": true, "hasLoader": true, "hasClientAction": false, "hasClientLoader": false, "hasClientMiddleware": false, "hasDefaultExport": true, "hasErrorBoundary": true, "module": "/assets/root-BlFmfRST.js", "imports": ["/assets/index-BXZSIDEp.js", "/assets/mermaid-3ZIDBTTL-C_xy8SxZ.js"], "css": ["/assets/root-61NXpLSs.css", "/assets/mermaid-3ZIDBTTL-DDxQhcP4.css"], "clientActionModule": void 0, "clientLoaderModule": void 0, "clientMiddlewareModule": void 0, "hydrateFallbackModule": void 0 }, "routes/home": { "id": "routes/home", "parentId": "root", "path": void 0, "index": true, "caseSensitive": void 0, "hasAction": false, "hasLoader": false, "hasClientAction": false, "hasClientLoader": false, "hasClientMiddleware": false, "hasDefaultExport": true, "hasErrorBoundary": false, "module": "/assets/home-Dz43xne_.js", "imports": ["/assets/index-BXZSIDEp.js", "/assets/workflow-graph-viewer-BlDVZ5AU.js", "/assets/mermaid-3ZIDBTTL-C_xy8SxZ.js", "/assets/index-B6-SzLmT.js"], "css": ["/assets/workflow-graph-viewer-DnlNuQQH.css", "/assets/mermaid-3ZIDBTTL-DDxQhcP4.css"], "clientActionModule": void 0, "clientLoaderModule": void 0, "clientMiddlewareModule": void 0, "hydrateFallbackModule": void 0 }, "routes/run-detail": { "id": "routes/run-detail", "parentId": "root", "path": "run/:runId", "index": void 0, "caseSensitive": void 0, "hasAction": false, "hasLoader": false, "hasClientAction": false, "hasClientLoader": false, "hasClientMiddleware": false, "hasDefaultExport": true, "hasErrorBoundary": false, "module": "/assets/run-detail-BzGs1YV_.js", "imports": ["/assets/index-BXZSIDEp.js", "/assets/workflow-graph-viewer-BlDVZ5AU.js", "/assets/mermaid-3ZIDBTTL-C_xy8SxZ.js", "/assets/encryption-g14N5vQl.js", "/assets/index-B6-SzLmT.js"], "css": ["/assets/run-detail-CWoGxu_0.css", "/assets/workflow-graph-viewer-DnlNuQQH.css", "/assets/mermaid-3ZIDBTTL-DDxQhcP4.css"], "clientActionModule": void 0, "clientLoaderModule": void 0, "clientMiddlewareModule": void 0, "hydrateFallbackModule": void 0 }, "routes/api.rpc": { "id": "routes/api.rpc", "parentId": "root", "path": "api/rpc", "index": void 0, "caseSensitive": void 0, "hasAction": true, "hasLoader": true, "hasClientAction": false, "hasClientLoader": false, "hasClientMiddleware": false, "hasDefaultExport": false, "hasErrorBoundary": false, "module": "/assets/api.rpc-l0sNRNKZ.js", "imports": [], "css": [], "clientActionModule": void 0, "clientLoaderModule": void 0, "clientMiddlewareModule": void 0, "hydrateFallbackModule": void 0 }, "routes/api.stream.$streamId": { "id": "routes/api.stream.$streamId", "parentId": "root", "path": "api/stream/:streamId", "index": void 0, "caseSensitive": void 0, "hasAction": false, "hasLoader": true, "hasClientAction": false, "hasClientLoader": false, "hasClientMiddleware": false, "hasDefaultExport": false, "hasErrorBoundary": false, "module": "/assets/api.stream._streamId-l0sNRNKZ.js", "imports": [], "css": [], "clientActionModule": void 0, "clientLoaderModule": void 0, "clientMiddlewareModule": void 0, "hydrateFallbackModule": void 0 } }, "url": "/assets/manifest-e1cf8511.js", "version": "e1cf8511", "sri": void 0 };
+const serverManifest = { "entry": { "module": "/assets/entry.client-DOJDY_4b.js", "imports": ["/assets/index-BXZSIDEp.js"], "css": [] }, "routes": { "root": { "id": "root", "parentId": void 0, "path": "", "index": void 0, "caseSensitive": void 0, "hasAction": true, "hasLoader": true, "hasClientAction": false, "hasClientLoader": false, "hasClientMiddleware": false, "hasDefaultExport": true, "hasErrorBoundary": true, "module": "/assets/root-BsPxYsbK.js", "imports": ["/assets/index-BXZSIDEp.js", "/assets/mermaid-3ZIDBTTL-Cg-Mp5Kj.js"], "css": ["/assets/root-F_dqJDC7.css", "/assets/mermaid-3ZIDBTTL-DDxQhcP4.css"], "clientActionModule": void 0, "clientLoaderModule": void 0, "clientMiddlewareModule": void 0, "hydrateFallbackModule": void 0 }, "routes/home": { "id": "routes/home", "parentId": "root", "path": void 0, "index": true, "caseSensitive": void 0, "hasAction": false, "hasLoader": false, "hasClientAction": false, "hasClientLoader": false, "hasClientMiddleware": false, "hasDefaultExport": true, "hasErrorBoundary": false, "module": "/assets/home-BNApVOct.js", "imports": ["/assets/index-BXZSIDEp.js", "/assets/workflow-graph-viewer-CcCwLmnF.js", "/assets/mermaid-3ZIDBTTL-Cg-Mp5Kj.js", "/assets/index-B6-SzLmT.js"], "css": ["/assets/workflow-graph-viewer-DnlNuQQH.css", "/assets/mermaid-3ZIDBTTL-DDxQhcP4.css"], "clientActionModule": void 0, "clientLoaderModule": void 0, "clientMiddlewareModule": void 0, "hydrateFallbackModule": void 0 }, "routes/run-detail": { "id": "routes/run-detail", "parentId": "root", "path": "run/:runId", "index": void 0, "caseSensitive": void 0, "hasAction": false, "hasLoader": false, "hasClientAction": false, "hasClientLoader": false, "hasClientMiddleware": false, "hasDefaultExport": true, "hasErrorBoundary": false, "module": "/assets/run-detail-sr7StYc6.js", "imports": ["/assets/index-BXZSIDEp.js", "/assets/workflow-graph-viewer-CcCwLmnF.js", "/assets/mermaid-3ZIDBTTL-Cg-Mp5Kj.js", "/assets/encryption-g14N5vQl.js", "/assets/index-B6-SzLmT.js"], "css": ["/assets/run-detail-CWoGxu_0.css", "/assets/workflow-graph-viewer-DnlNuQQH.css", "/assets/mermaid-3ZIDBTTL-DDxQhcP4.css"], "clientActionModule": void 0, "clientLoaderModule": void 0, "clientMiddlewareModule": void 0, "hydrateFallbackModule": void 0 }, "routes/api.rpc": { "id": "routes/api.rpc", "parentId": "root", "path": "api/rpc", "index": void 0, "caseSensitive": void 0, "hasAction": true, "hasLoader": true, "hasClientAction": false, "hasClientLoader": false, "hasClientMiddleware": false, "hasDefaultExport": false, "hasErrorBoundary": false, "module": "/assets/api.rpc-l0sNRNKZ.js", "imports": [], "css": [], "clientActionModule": void 0, "clientLoaderModule": void 0, "clientMiddlewareModule": void 0, "hydrateFallbackModule": void 0 }, "routes/api.stream.$streamId": { "id": "routes/api.stream.$streamId", "parentId": "root", "path": "api/stream/:streamId", "index": void 0, "caseSensitive": void 0, "hasAction": false, "hasLoader": true, "hasClientAction": false, "hasClientLoader": false, "hasClientMiddleware": false, "hasDefaultExport": false, "hasErrorBoundary": false, "module": "/assets/api.stream._streamId-l0sNRNKZ.js", "imports": [], "css": [], "clientActionModule": void 0, "clientLoaderModule": void 0, "clientMiddlewareModule": void 0, "hydrateFallbackModule": void 0 } }, "url": "/assets/manifest-379f050f.js", "version": "379f050f", "sri": void 0 };
 const assetsBuildDirectory = "build/client";
 const basename = "/";
 const future = { "unstable_optimizeDeps": false, "unstable_subResourceIntegrity": false, "unstable_trailingSlashAwareDataRequests": false, "unstable_previewServerPrerendering": false, "v8_middleware": false, "v8_splitRouteModules": false, "v8_viteEnvironmentApi": false };