@workflow/web 4.1.5 → 4.1.7

package/build/client/assets/{root-CLs7COa2.js → root-BzOKTpCh.js}

@@ -1,5 +1,5 @@
 import { r as reactExports, j as jsxRuntimeExports, w as withComponentProps, v as withErrorBoundaryProps, M as Meta, L as Links, S as ScrollRestoration, x as Scripts, O as Outlet, y as useRouteError, i as isRouteErrorResponse, z as Link, A as useNavigate, B as useSearchParams } from "./index-DQa-BExo.js";
-import { c as createLucideIcon, u as useServerConfig, T as Tooltip, a as TooltipTrigger, b as TooltipContent, r as runHealthCheck, t as toast, B as Button, L as LoaderCircle, d as cn, e as Toaster$1, S as ServerConfigProvider, f as TooltipProvider } from "./mermaid-3ZIDBTTL-B_qZU5zW.js";
+import { c as createLucideIcon, u as useServerConfig, T as Tooltip, a as TooltipTrigger, b as TooltipContent, r as runHealthCheck, t as toast, B as Button, L as LoaderCircle, d as cn, e as Toaster$1, S as ServerConfigProvider, f as TooltipProvider } from "./mermaid-3ZIDBTTL-Cr7OQX4b.js";
 var M = (e, i, s, u, m, a, l, h) => {
   let d = document.documentElement, w = ["light", "dark"];
   function p(n) {

package/build/client/assets/{run-detail-D7xkVxzE.js → run-detail-CRqjlzw9.js}

@@ -1,6 +1,6 @@
 import { j as jsxRuntimeExports, r as reactExports, f as reactDomExports, C as ReactDOM, A as useNavigate, B as useSearchParams, z as Link, w as withComponentProps, G as useParams } from "./index-DQa-BExo.js";
-import { O as Copy, C as CircleAlert, Q as parseStepName, B as parseWorkflowName, j as ChevronRight, q as Check, U as ErrorCard, Z as Zap, S as Send, R as ResolveHookModal, p as ChevronUp, o as ChevronDown, X, N as ErrorBoundary, V as Clock, G as CircleX, I as unwrapServerActionResult, u as unwrapOrThrow, W as WorkflowWebAPIError, Y as useEscapeKeydown, v as composeEventHandlers, _ as useCallbackRef, $ as useLayoutEffect2, t as createContextScope, a0 as createContext2, s as useControllableState, a1 as useId, w as Presence, l as hideOthers, m as ReactRemoveScroll, a2 as useFocusGuards, a3 as LAYOUT, a4 as wakeUpRun, r as resumeHook, A as Alert, c as AlertTitle, d as AlertDescription, a as Skeleton$1, a5 as RunActionsButtons, F as StatusBadge, e as CopyableText, b as RelativeTime, T as Tabs, K as TabsList, L as TabsTrigger, M as TabsContent, y as cancelRun, a6 as recreateRun } from "./workflow-graph-viewer-D5yEggTb.js";
-import { c as createLucideIcon, M as Spinner, h as useToast, N as Skeleton, O as DecryptClickContext, Y as Yr, U as isEncryptedMarker, W as formatDuration, X as DataInspector, _ as _r, Z as StreamClickContext, $ as isExpiredMarker, a0 as isDoStreamStep, a1 as extractConversation, a2 as Lock, a3 as EVENT_DATA_REF_FIELDS, a4 as clsx, a5 as useTraceViewer, a6 as styles, a7 as formatDurationForTimeline, a8 as formatWallClockTime, a9 as useImmediateStyle, aa as TIMELINE_PADDING, ab as formatTimeSelection, ac as MARKER_HEIGHT, ad as ROW_HEIGHT, ae as ROW_PADDING, af as SEARCH_HEIGHT, ag as getHighResInMs, ah as getMsInHighRes, ai as MARKER_NOTCH_HEIGHT, aj as MAP_HEIGHT, ak as SEARCH_GAP, al as MiniMap, am as SpanNodes, an as SpanDetailPanel, ao as TraceViewerContextProvider, ap as hydrateResourceIOWithKey, aq as hydrateResourceIO, ar as fetchHook, l as fetchEvents, F as fetchRun, as as fetchStep, at as hasEncryptedFields, au as fetchStreams, av as Slot, E as useComposedRefs, aw as Slottable, d as cn, ax as buttonVariants, ay as isEncryptedData, az as hydrateData, aA as getWebRevivers, T as Tooltip, a as TooltipTrigger, b as TooltipContent, aB as LIVE_UPDATE_INTERVAL_MS$1, u as useServerConfig, aC as fetchEvent, aD as getEncryptionKeyForRun, t as toast, L as LoaderCircle, aE as StreamViewer } from "./mermaid-3ZIDBTTL-B_qZU5zW.js";
+import { O as Copy, C as CircleAlert, Q as parseStepName, B as parseWorkflowName, j as ChevronRight, q as Check, U as ErrorCard, Z as Zap, S as Send, R as ResolveHookModal, p as ChevronUp, o as ChevronDown, X, N as ErrorBoundary, V as Clock, G as CircleX, I as unwrapServerActionResult, u as unwrapOrThrow, W as WorkflowWebAPIError, Y as useEscapeKeydown, t as composeEventHandlers, _ as useCallbackRef, $ as useLayoutEffect2, s as useControllableState, a0 as useId, a1 as createContext2, v as Presence, x as createContextScope, l as hideOthers, m as ReactRemoveScroll, a2 as useFocusGuards, a3 as LAYOUT, a4 as wakeUpRun, r as resumeHook, A as Alert, c as AlertTitle, d as AlertDescription, a as Skeleton$1, a5 as RunActionsButtons, F as StatusBadge, e as CopyableText, b as RelativeTime, T as Tabs, K as TabsList, L as TabsTrigger, M as TabsContent, y as cancelRun, a6 as recreateRun } from "./workflow-graph-viewer-P4oMQJaV.js";
+import { c as createLucideIcon, M as Spinner, h as useToast, N as Skeleton, O as DecryptClickContext, Y as Yr, U as isEncryptedMarker, W as formatDuration, X as DataInspector, _ as _r, Z as StreamClickContext, $ as isExpiredMarker, a0 as isDoStreamStep, a1 as extractConversation, a2 as Lock, a3 as EVENT_DATA_REF_FIELDS, a4 as clsx, a5 as useTraceViewer, a6 as styles, a7 as formatDurationForTimeline, a8 as formatWallClockTime, a9 as useImmediateStyle, aa as TIMELINE_PADDING, ab as formatTimeSelection, ac as MARKER_HEIGHT, ad as ROW_HEIGHT, ae as ROW_PADDING, af as SEARCH_HEIGHT, ag as getHighResInMs, ah as getMsInHighRes, ai as MARKER_NOTCH_HEIGHT, aj as MAP_HEIGHT, ak as SEARCH_GAP, al as MiniMap, am as SpanNodes, an as SpanDetailPanel, ao as TraceViewerContextProvider, ap as hydrateResourceIOWithKey, aq as hydrateResourceIO, ar as fetchHook, l as fetchEvents, F as fetchRun, as as fetchStep, at as hasEncryptedFields, au as fetchStreams, av as Slot, E as useComposedRefs, aw as Slottable, d as cn, ax as buttonVariants, ay as isEncryptedData, az as hydrateData, aA as getWebRevivers, aB as fetchEvent, aC as fetchEventsByCorrelationId, T as Tooltip, a as TooltipTrigger, b as TooltipContent, aD as LIVE_UPDATE_INTERVAL_MS$1, u as useServerConfig, aE as getEncryptionKeyForRun, t as toast, L as LoaderCircle, aF as StreamViewer } from "./mermaid-3ZIDBTTL-Cr7OQX4b.js";
 import { decrypt, importKey } from "./encryption-80GMP4r0.js";
 /**
  * @license lucide-react v0.575.0 - ISC
@@ -53,6 +53,33 @@ const __iconNode = [
   ["path", { d: "M9 20h6", key: "s66wpe" }]
 ];
 const Type = createLucideIcon("type", __iconNode);
+const WORKFLOW_ULID_BODY = "[0123456789ABCDEFGHJKMNPQRSTVWXYZ]{26}";
+const STEP_ID_PATTERN = new RegExp(`^step_(${WORKFLOW_ULID_BODY})$`, "i");
+const WAIT_ID_PATTERN = new RegExp(`^wait_(${WORKFLOW_ULID_BODY})$`, "i");
+const HOOK_ID_PATTERN = new RegExp(`^hook_(${WORKFLOW_ULID_BODY})$`, "i");
+const EVENT_ID_PATTERN = new RegExp(`^evnt_(${WORKFLOW_ULID_BODY})$`, "i");
+const WORKFLOW_ID_PREFIX_PATTERN = /^(step_|wait_|hook_|evnt_|wrun_)/i;
+function matchPrefixedId(pattern, prefix, kind, query) {
+  const match = query.match(pattern);
+  if (!match) {
+    return null;
+  }
+  return { kind, id: `${prefix}_${match[1].toUpperCase()}` };
+}
+function parseExactWorkflowSearchId(query) {
+  const trimmed = query.trim();
+  if (!trimmed) {
+    return null;
+  }
+  return matchPrefixedId(STEP_ID_PATTERN, "step", "step", trimmed) ?? matchPrefixedId(WAIT_ID_PATTERN, "wait", "wait", trimmed) ?? matchPrefixedId(HOOK_ID_PATTERN, "hook", "hook", trimmed) ?? matchPrefixedId(EVENT_ID_PATTERN, "evnt", "event", trimmed);
+}
+function looksLikeWorkflowIdSearchInput(query) {
+  const trimmed = query.trim();
+  if (!WORKFLOW_ID_PREFIX_PATTERN.test(trimmed)) {
+    return false;
+  }
+  return /\d/.test(trimmed);
+}
 const STYLES$2 = `.wf-decrypt-btn{appearance:none;-webkit-appearance:none;border:none;display:inline-flex;align-items:center;justify-content:center;height:40px;padding:0 12px;border-radius:6px;font-size:14px;font-weight:500;line-height:20px;cursor:pointer;white-space:nowrap;gap:6px;transition:background 150ms}.wf-decrypt-idle{color:var(--ds-gray-1000);background:var(--ds-background-100);box-shadow:0 0 0 1px var(--ds-gray-400)}.wf-decrypt-idle:hover{background:var(--ds-gray-alpha-200)}.wf-decrypt-done{color:var(--ds-green-900);background:var(--ds-green-100);box-shadow:0 0 0 1px var(--ds-green-400);cursor:default}`;
 function DecryptButton({ decrypted = false, loading = false, onClick }) {
   return jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [jsxRuntimeExports.jsx("style", { dangerouslySetInnerHTML: { __html: STYLES$2 } }), jsxRuntimeExports.jsxs("button", { type: "button", onClick: decrypted ? void 0 : onClick, disabled: decrypted || loading, className: `wf-decrypt-btn ${decrypted ? "wf-decrypt-done" : "wf-decrypt-idle"}`, children: [loading ? jsxRuntimeExports.jsx(Spinner, { size: 14 }) : decrypted ? jsxRuntimeExports.jsxs("svg", { width: 14, height: 14, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", children: [jsxRuntimeExports.jsx("rect", { x: "3", y: "11", width: "18", height: "11", rx: "2", ry: "2" }), jsxRuntimeExports.jsx("path", { d: "M7 11V7a5 5 0 0 1 9.9-1" })] }) : jsxRuntimeExports.jsxs("svg", { width: 14, height: 14, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", children: [jsxRuntimeExports.jsx("rect", { x: "3", y: "11", width: "18", height: "11", rx: "2", ry: "2" }), jsxRuntimeExports.jsx("path", { d: "M7 11V7a5 5 0 0 1 10 0v4" })] }), loading ? "Decrypting…" : decrypted ? "Decrypted" : "Decrypt"] })] });
@@ -372,27 +399,34 @@ function buildNameMaps(events, run) {
   return { correlationNameMap, workflowName };
 }
 function buildDurationMap(events) {
+  const chronological = [...events].sort((a, b) => new Date(a.createdAt).getTime() - new Date(b.createdAt).getTime());
   const createdTimes = /* @__PURE__ */ new Map();
+  const firstStartedTimes = /* @__PURE__ */ new Map();
   const startedTimes = /* @__PURE__ */ new Map();
   const durations = /* @__PURE__ */ new Map();
-  for (const event of events) {
+  for (const event of chronological) {
     const ts = new Date(event.createdAt).getTime();
     const key = event.correlationId ?? "__run__";
     const type = event.eventType;
     if (type === "step_created" || type === "run_created") {
-      createdTimes.set(key, ts);
-    }
-    if (type === "step_started" || type === "run_started" || type === "workflow_started") {
-      startedTimes.set(key, ts);
       if (!createdTimes.has(key)) {
         createdTimes.set(key, ts);
       }
-      const createdAt = createdTimes.get(key);
-      const info = durations.get(key) ?? {};
-      if (createdAt !== void 0) {
-        info.queued = ts - createdAt;
+    }
+    if (type === "step_started" || type === "run_started" || type === "workflow_started") {
+      startedTimes.set(key, ts);
+      if (!firstStartedTimes.has(key)) {
+        firstStartedTimes.set(key, ts);
+        if (!createdTimes.has(key)) {
+          createdTimes.set(key, ts);
+        }
+        const createdAt = createdTimes.get(key);
+        const info = durations.get(key) ?? {};
+        if (createdAt !== void 0) {
+          info.queued = ts - createdAt;
+        }
+        durations.set(key, info);
       }
-      durations.set(key, info);
     }
     if (type === "step_completed" || type === "step_failed" || type === "run_completed" || type === "run_failed" || type === "run_cancelled" || type === "workflow_completed" || type === "workflow_failed" || type === "wait_completed" || type === "hook_disposed") {
       const startedAt = startedTimes.get(key);
@@ -603,7 +637,7 @@ function RowsSkeleton() {
     marginLeft: i % 4 === 0 ? 5 : 6
   } })] }), jsxRuntimeExports.jsx("div", { className: "w-5 flex-shrink-0 flex items-center justify-center", children: jsxRuntimeExports.jsx(Skeleton, { 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, { 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, { className: "flex-shrink-0", style: { width: 6, height: 6, borderRadius: "50%" } }), jsxRuntimeExports.jsx(Skeleton, { className: "h-3", style: { width: "60%" } })] }), jsxRuntimeExports.jsx("div", { className: "min-w-0 px-4", style: { flex: "2 1 0%" }, children: jsxRuntimeExports.jsx(Skeleton, { className: "h-3", style: { width: "50%" } }) }), jsxRuntimeExports.jsx("div", { className: "min-w-0 px-4", style: { flex: "3 1 0%" }, children: jsxRuntimeExports.jsx(Skeleton, { className: "h-3", style: { width: "75%" } }) }), jsxRuntimeExports.jsx("div", { className: "min-w-0 px-4", style: { flex: "3 1 0%" }, children: jsxRuntimeExports.jsx(Skeleton, { className: "h-3", style: { width: "75%" } }) })] }, i)) });
 }
-function EventRow({ event, index, isFirst, isLast, isExpanded, onToggleExpand, activeGroupKey, selectedGroupKey, selectedGroupRange, correlationNameMap, workflowName, durationMap, onSelectGroup, onHoverGroup, onLoadEventData, cachedEventData, onCacheEventData, encryptionKey, onEncryptedDataDetected }) {
+function EventRow({ event, index, isFirst, isLast, isExpanded, onToggleExpand, activeGroupKey, selectedGroupKey, selectedGroupRange, correlationNameMap, workflowName, durationMap, onSelectGroup, onHoverGroup, onLoadEventData, cachedEventData, onCacheEventData, encryptionKey, onEncryptedDataDetected, suppressGroupDimming = false }) {
   const [isLoading, setIsLoading] = reactExports.useState(false);
   const [loadedEventData, setLoadedEventData] = reactExports.useState(cachedEventData);
   const [loadError, setLoadError] = reactExports.useState(null);
@@ -623,7 +657,7 @@ function EventRow({ event, index, isFirst, isLast, isExpanded, onToggleExpand, a
   const durationInfo = durationKey ? durationMap.get(durationKey) : void 0;
   const hasActive = activeGroupKey !== void 0;
   const isRelated = rowGroupKey !== void 0 && rowGroupKey === activeGroupKey;
-  const isDimmed = hasActive && !isRelated;
+  const isDimmed = hasActive && !isRelated && !suppressGroupDimming;
   const isPulsing = hasActive && isRelated;
   const showBranch = hasActive && isRelated && !isRun;
   const showLaneLine = selectedGroupRange !== null && index >= selectedGroupRange.first && index <= selectedGroupRange.last;
@@ -748,7 +782,8 @@ function EventRow({ event, index, isFirst, isLast, isExpanded, onToggleExpand, a
     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, { className: "h-3", style: { width: "75%" } }), jsxRuntimeExports.jsx(Skeleton, { className: "h-3", style: { width: "50%" } }), jsxRuntimeExports.jsx(Skeleton, { className: "h-3", style: { width: "60%" } })] }) : jsxRuntimeExports.jsx("div", { className: "p-2 text-xs", style: { color: "var(--ds-gray-900)" }, children: "No data" })] })] })] });
 }
-function EventListView({ events, run, onLoadEventData, hasMoreEvents = false, isLoadingMoreEvents = false, onLoadMoreEvents, encryptionKey, isLoading = false, sortOrder: sortOrderProp, onSortOrderChange, onDecrypt, isDecrypting = false, hasEncryptedData: hasEncryptedDataProp = false }) {
+function EventListView({ events, run, onLoadEventData, hasMoreEvents = false, isLoadingMoreEvents = false, onLoadMoreEvents, encryptionKey, isLoading = false, sortOrder: sortOrderProp, onSortOrderChange, onDecrypt, isDecrypting = false, hasEncryptedData: hasEncryptedDataProp = false, onExactIdSearch }) {
+  const toast2 = useToast();
   const [internalSortOrder, setInternalSortOrder] = reactExports.useState("asc");
   const effectiveSortOrder = sortOrderProp ?? internalSortOrder;
   const handleSortOrderChange = reactExports.useCallback((order) => {
@@ -758,28 +793,40 @@ function EventListView({ events, run, onLoadEventData, hasMoreEvents = false, is
       setInternalSortOrder(order);
     }
   }, [onSortOrderChange]);
+  const [searchQuery, setSearchQuery] = reactExports.useState("");
+  const [searchResults, setSearchResults] = reactExports.useState(null);
+  const [searchResultsTruncated, setSearchResultsTruncated] = reactExports.useState(false);
+  const [searchError, setSearchError] = reactExports.useState(null);
+  const [searchLoading, setSearchLoading] = reactExports.useState(false);
+  const [searchNotFound, setSearchNotFound] = reactExports.useState(false);
+  const searchRequestRef = reactExports.useRef(0);
+  const virtuosoRef = reactExports.useRef(null);
+  const parsedSearchId = reactExports.useMemo(() => parseExactWorkflowSearchId(searchQuery), [searchQuery]);
+  const isExactSearchActive = searchResults !== null;
   const sortedEvents = reactExports.useMemo(() => {
-    if (!events || events.length === 0)
+    const sourceEvents = isExactSearchActive ? searchResults : events ?? [];
+    if (sourceEvents.length === 0)
       return [];
     const dir = effectiveSortOrder === "desc" ? -1 : 1;
-    return [...events].sort((a, b) => dir * (new Date(a.createdAt).getTime() - new Date(b.createdAt).getTime()));
-  }, [events, effectiveSortOrder]);
+    return [...sourceEvents].sort((a, b) => dir * (new Date(a.createdAt).getTime() - new Date(b.createdAt).getTime()));
+  }, [events, effectiveSortOrder, isExactSearchActive, searchResults]);
   const hasEncryptedInlineData = reactExports.useMemo(() => {
-    if (!events)
+    const sourceEvents = isExactSearchActive ? searchResults : events;
+    if (!sourceEvents)
       return false;
-    for (const event of events) {
+    for (const event of sourceEvents) {
       const ed = event.eventData;
       if (hasEncryptedValues(ed))
         return true;
     }
     return false;
-  }, [events]);
+  }, [events, isExactSearchActive, searchResults]);
   const [foundEncryptedInLazyData, setFoundEncryptedInLazyData] = reactExports.useState(false);
   const handleEncryptedDataDetected = reactExports.useCallback(() => {
     setFoundEncryptedInLazyData(true);
   }, []);
   const hasEncryptedData = hasEncryptedDataProp || hasEncryptedInlineData || foundEncryptedInLazyData;
-  const { correlationNameMap, workflowName } = reactExports.useMemo(() => buildNameMaps(events ?? null, run ?? null), [events, run]);
+  const { correlationNameMap, workflowName } = reactExports.useMemo(() => buildNameMaps(isExactSearchActive ? searchResults : events ?? null, run ?? null), [events, isExactSearchActive, run, searchResults]);
   const durationMap = reactExports.useMemo(() => buildDurationMap(sortedEvents), [sortedEvents]);
   const [selectedGroupKey, setSelectedGroupKey] = reactExports.useState(void 0);
   const [hoveredGroupKey, setHoveredGroupKey] = reactExports.useState(void 0);
@@ -847,58 +894,100 @@ function EventListView({ events, run, onLoadEventData, hasMoreEvents = false, is
     }
     return first >= 0 ? { first, last } : null;
   }, [activeGroupKey, sortedEvents]);
-  const [searchQuery, setSearchQuery] = reactExports.useState("");
-  const virtuosoRef = reactExports.useRef(null);
-  const searchIndex = reactExports.useMemo(() => {
-    const entries = [];
-    for (let i = 0; i < sortedEvents.length; i++) {
-      const ev = sortedEvents[i];
-      const isRun = isRunLevel(ev.eventType);
-      const name = isRun ? workflowName ?? "" : ev.correlationId ? correlationNameMap.get(ev.correlationId) ?? "" : "";
-      entries.push({
-        fields: [
-          ev.eventId,
-          ev.correlationId ?? "",
-          ev.eventType,
-          formatEventType(ev.eventType),
-          name
-        ].map((f) => f.toLowerCase()),
-        groupKey: ev.correlationId ?? (isRun ? "__run__" : void 0),
-        eventId: ev.eventId,
-        index: i
-      });
-    }
-    return entries;
-  }, [sortedEvents, correlationNameMap, workflowName]);
   reactExports.useEffect(() => {
-    var _a;
-    const q = searchQuery.trim().toLowerCase();
-    if (!q) {
+    const trimmed = searchQuery.trim();
+    if (!trimmed) {
+      searchRequestRef.current += 1;
+      setSearchResults(null);
+      setSearchResultsTruncated(false);
+      setSearchError(null);
+      setSearchLoading(false);
+      setSearchNotFound(false);
       setSelectedGroupKey(void 0);
       return;
     }
-    let bestMatch = null;
-    let bestScore = 0;
-    for (const entry of searchIndex) {
-      for (const field of entry.fields) {
-        if (field && field.includes(q)) {
-          const score = q.length / field.length;
-          if (score > bestScore) {
-            bestScore = score;
-            bestMatch = entry;
+    const parsed = parseExactWorkflowSearchId(trimmed);
+    if (!parsed || !onExactIdSearch) {
+      setSearchResults(null);
+      setSearchLoading(false);
+      setSearchNotFound(false);
+      return;
+    }
+    const requestId = ++searchRequestRef.current;
+    setSearchLoading(true);
+    setSearchNotFound(false);
+    setSearchError(null);
+    const abortController = new AbortController();
+    const timer = setTimeout(() => {
+      void (async () => {
+        var _a;
+        try {
+          const results = await onExactIdSearch(parsed.id, parsed.kind, abortController.signal);
+          if (abortController.signal.aborted || searchRequestRef.current !== requestId) {
+            return;
+          }
+          if (results.status === "error") {
+            setSearchResults([]);
+            setSearchResultsTruncated(false);
+            setSearchNotFound(false);
+            setSearchError(results.message);
+            setSelectedGroupKey(void 0);
+            return;
+          }
+          if (results.status === "not_found" || results.status === "ok" && results.events.length === 0) {
+            setSearchResults([]);
+            setSearchResultsTruncated(false);
+            setSearchNotFound(true);
+            setSearchError(null);
+            setSelectedGroupKey(void 0);
+            return;
+          }
+          setSearchResults(results.events);
+          setSearchResultsTruncated(Boolean(results.truncated));
+          setSearchNotFound(false);
+          setSearchError(null);
+          setSelectedGroupKey(parsed.kind === "event" ? (() => {
+            const first = results.events[0];
+            if (!first)
+              return void 0;
+            return isRunLevel(first.eventType) ? "__run__" : first.correlationId ?? void 0;
+          })() : parsed.id);
+          (_a = virtuosoRef.current) == null ? void 0 : _a.scrollToIndex({
+            index: 0,
+            align: "start",
+            behavior: "smooth"
+          });
+        } catch {
+          if (abortController.signal.aborted || searchRequestRef.current !== requestId) {
+            return;
+          }
+          setSearchResults([]);
+          setSearchResultsTruncated(false);
+          setSearchNotFound(false);
+          setSearchError("Failed to search events. Try again.");
+          setSelectedGroupKey(void 0);
+        } finally {
+          if (searchRequestRef.current === requestId && !abortController.signal.aborted) {
+            setSearchLoading(false);
           }
         }
-      }
+      })();
+    }, 300);
+    return () => {
+      clearTimeout(timer);
+      abortController.abort();
+    };
+  }, [searchQuery, onExactIdSearch]);
+  const handleSearchKeyDown = reactExports.useCallback((event) => {
+    if (event.key !== "Enter") {
+      return;
     }
-    if (bestMatch) {
-      setSelectedGroupKey(bestMatch.groupKey);
-      (_a = virtuosoRef.current) == null ? void 0 : _a.scrollToIndex({
-        index: bestMatch.index,
-        align: "center",
-        behavior: "smooth"
-      });
+    const trimmed = searchQuery.trim();
+    if (!trimmed || parseExactWorkflowSearchId(trimmed) || !onExactIdSearch || !looksLikeWorkflowIdSearchInput(trimmed)) {
+      return;
     }
-  }, [searchQuery, searchIndex]);
+    toast2.info("Enter a full step ID, wait ID, hook ID, or event ID");
+  }, [searchQuery, onExactIdSearch, toast2]);
   const hasHadEventsRef = reactExports.useRef(false);
   if (sortedEvents.length > 0) {
     hasHadEventsRef.current = true;
@@ -908,9 +997,6 @@ function EventListView({ events, run, onLoadEventData, hasMoreEvents = false, is
   if (isInitialLoad) {
     return jsxRuntimeExports.jsxs("div", { className: "h-full flex flex-col overflow-hidden", children: [jsxRuntimeExports.jsx("div", { style: { padding: 6 }, children: jsxRuntimeExports.jsx(Skeleton, { style: { height: 40, borderRadius: 6 } }) }), jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-0 h-10 border-b flex-shrink-0", style: { borderColor: "var(--ds-gray-alpha-200)" }, 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: jsxRuntimeExports.jsx(Skeleton, { className: "h-3", style: { width: 40 } }) }), jsxRuntimeExports.jsx("div", { className: "min-w-0 px-4", style: { flex: "2 1 0%" }, children: jsxRuntimeExports.jsx(Skeleton, { className: "h-3", style: { width: 72 } }) }), jsxRuntimeExports.jsx("div", { className: "min-w-0 px-4", style: { flex: "2 1 0%" }, children: jsxRuntimeExports.jsx(Skeleton, { className: "h-3", style: { width: 44 } }) }), jsxRuntimeExports.jsx("div", { className: "min-w-0 px-4", style: { flex: "3 1 0%" }, children: jsxRuntimeExports.jsx(Skeleton, { className: "h-3", style: { width: 92 } }) }), jsxRuntimeExports.jsx("div", { className: "min-w-0 px-4", style: { flex: "3 1 0%" }, children: jsxRuntimeExports.jsx(Skeleton, { className: "h-3", style: { width: 60 } }) })] }), jsxRuntimeExports.jsx(RowsSkeleton, {})] });
   }
-  if (!isLoading && (!events || events.length === 0)) {
-    return jsxRuntimeExports.jsx("div", { className: "flex items-center justify-center h-full text-sm", style: { color: "var(--ds-gray-700)" }, children: "No events found" });
-  }
   return jsxRuntimeExports.jsx(DecryptClickContext.Provider, { value: onDecrypt ? { onDecrypt, isDecrypting } : void 0, children: jsxRuntimeExports.jsxs("div", { className: "h-full flex flex-col overflow-hidden", children: [jsxRuntimeExports.jsx("style", { children: `@keyframes workflow-dot-pulse{0%{transform:scale(1);opacity:.7}70%,100%{transform:scale(2.2);opacity:0}}` }), jsxRuntimeExports.jsxs("div", { style: {
     padding: 6,
     backgroundColor: "var(--ds-background-100)",
@@ -934,7 +1020,7 @@ function EventListView({ events, run, onLoadEventData, hasMoreEvents = false, is
     justifyContent: "center",
     color: "var(--ds-gray-800)",
     flexShrink: 0
-  }, children: jsxRuntimeExports.jsxs("svg", { width: 16, height: 16, viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", focusable: "false", children: [jsxRuntimeExports.jsx("circle", { cx: "7", cy: "7", r: "4.5", stroke: "currentColor", strokeWidth: "1.5" }), jsxRuntimeExports.jsx("path", { d: "M11.5 11.5L14 14", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })] }) }), jsxRuntimeExports.jsx("input", { type: "search", placeholder: "Search by name, event type, or ID…", value: searchQuery, onChange: (e) => setSearchQuery(e.target.value), style: {
+  }, children: jsxRuntimeExports.jsxs("svg", { width: 16, height: 16, viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", focusable: "false", children: [jsxRuntimeExports.jsx("circle", { cx: "7", cy: "7", r: "4.5", stroke: "currentColor", strokeWidth: "1.5" }), jsxRuntimeExports.jsx("path", { d: "M11.5 11.5L14 14", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })] }) }), jsxRuntimeExports.jsx("input", { type: "search", placeholder: "Search by step ID, wait ID, hook ID, or event ID…", value: searchQuery, onChange: (e) => setSearchQuery(e.target.value), onKeyDown: handleSearchKeyDown, disabled: !onExactIdSearch, title: onExactIdSearch ? void 0 : "Exact ID search is unavailable in this view.", style: {
     marginLeft: -16,
     paddingInline: 12,
     fontFamily: "inherit",
@@ -943,24 +1029,26 @@ function EventListView({ events, run, onLoadEventData, hasMoreEvents = false, is
     border: "none",
     outline: "none",
     height: 40,
-    width: "100%"
+    width: "100%",
+    opacity: onExactIdSearch ? 1 : 0.5,
+    cursor: onExactIdSearch ? "text" : "not-allowed"
   } })] }), jsxRuntimeExports.jsx(MenuDropdown, { options: SORT_OPTIONS, value: effectiveSortOrder, onChange: handleSortOrderChange }), (hasEncryptedData || encryptionKey) && onDecrypt && jsxRuntimeExports.jsx(DecryptButton, { decrypted: !!encryptionKey, loading: isDecrypting, onClick: onDecrypt })] }), jsxRuntimeExports.jsxs("div", { className: "flex items-center gap-0 text-[13px] font-medium h-10 border-b flex-shrink-0", style: {
     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 ? jsxRuntimeExports.jsx(RowsSkeleton, {}) : jsxRuntimeExports.jsx(Yr, { ref: virtuosoRef, totalCount: sortedEvents.length, overscan: 20, defaultItemHeight: 40, endReached: () => {
-    if (!hasMoreEvents || isLoadingMoreEvents) {
+  }, 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, {}) : sortedEvents.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: sortedEvents.length, overscan: 20, defaultItemHeight: 40, endReached: () => {
+    if (isExactSearchActive || !hasMoreEvents || isLoadingMoreEvents) {
       return;
     }
     void (onLoadMoreEvents == null ? void 0 : onLoadMoreEvents());
   }, itemContent: (index) => {
     const ev = sortedEvents[index];
-    return jsxRuntimeExports.jsx(EventRow, { event: ev, index, isFirst: index === 0, isLast: index === sortedEvents.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 });
+    return jsxRuntimeExports.jsx(EventRow, { event: ev, index, isFirst: index === 0, isLast: index === sortedEvents.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 });
   }, 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)",
     backgroundColor: "var(--ds-background-100)"
-  }, children: [jsxRuntimeExports.jsxs("span", { children: [sortedEvents.length, " event", sortedEvents.length !== 1 ? "s" : "", " loaded"] }), hasMoreEvents && jsxRuntimeExports.jsx("div", { className: "absolute inset-0 flex items-center justify-center pointer-events-none", children: jsxRuntimeExports.jsx("div", { className: "pointer-events-auto", children: jsxRuntimeExports.jsx(LoadMoreButton, { loading: isLoadingMoreEvents, onClick: () => void (onLoadMoreEvents == null ? void 0 : onLoadMoreEvents()) }) }) })] })] }) });
+  }, children: [jsxRuntimeExports.jsx("span", { children: isExactSearchActive ? searchError ? searchError : searchNotFound ? `No events found for ${searchQuery.trim()}` : `${sortedEvents.length} event${sortedEvents.length !== 1 ? "s" : ""} for ${searchQuery.trim()}${searchResultsTruncated ? " (results may be truncated)" : ""}` : `${sortedEvents.length} event${sortedEvents.length !== 1 ? "s" : ""} loaded` }), !isExactSearchActive && hasMoreEvents && jsxRuntimeExports.jsx("div", { className: "absolute inset-0 flex items-center justify-center pointer-events-none", children: jsxRuntimeExports.jsx("div", { className: "pointer-events-auto", children: jsxRuntimeExports.jsx(LoadMoreButton, { loading: isLoadingMoreEvents, onClick: () => void (onLoadMoreEvents == null ? void 0 : onLoadMoreEvents()) }) }) })] })] }) });
 }
 function ConversationView({ messages }) {
   if (messages.length === 0) {
@@ -3388,7 +3476,7 @@ function hookToSpan(hookEvents, maxEndTime) {
   const endTime = hook.disposedAt || maxEndTime;
   return {
     spanId: String(hook.hookId),
-    name: String(hook.hookId),
+    name: hook.token ?? String(hook.hookId),
     kind: 1,
     // INTERNAL span kind
     resource: "hook",
@@ -4054,7 +4142,7 @@ const WorkflowTraceViewer = ({ run, events, isLoading, error, spanDetailData, sp
   if (!trace) {
     return jsxRuntimeExports.jsxs("div", { className: "relative w-full h-full", children: [jsxRuntimeExports.jsx("div", { className: "border-b border-gray-alpha-400 w-full" }), jsxRuntimeExports.jsx(Skeleton, { className: "w-full ml-2 mt-1 mb-1 h-[56px]" }), jsxRuntimeExports.jsxs("div", { className: "p-2 relative w-full", children: [jsxRuntimeExports.jsx(Skeleton, { className: "w-full mt-6 h-[20px]" }), jsxRuntimeExports.jsx(Skeleton, { className: "w-[10%] mt-2 ml-6 h-[20px]" }), jsxRuntimeExports.jsx(Skeleton, { className: "w-[10%] mt-2 ml-12 h-[20px]" }), jsxRuntimeExports.jsx(Skeleton, { className: "w-[20%] mt-2 ml-16 h-[20px]" })] })] });
   }
-  return jsxRuntimeExports.jsxs("div", { className: "relative w-full h-full flex", children: [jsxRuntimeExports.jsx("div", { className: "flex-1 min-w-0 relative", children: jsxRuntimeExports.jsxs(TraceViewerContextProvider, { customSpanClassNameFunc: getCustomSpanClassName, customSpanEventClassNameFunc: getCustomSpanEventClassName, children: [jsxRuntimeExports.jsx(SelectionBridge, { onSelectionChange: handleSelectionChange }), jsxRuntimeExports.jsx(DeselectBridge, { triggerDeselect: deselectTrigger }), jsxRuntimeExports.jsx(SelectBridge, { selectRequest }), jsxRuntimeExports.jsx(TraceViewerWithContextMenu, { trace, run, isLive, onWakeUpSleep, onCancelRun, onResolveHook, onLoadMoreSpans, hasMoreSpans, isLoadingMoreSpans, children: jsxRuntimeExports.jsx(TraceViewerTimeline, { eagerRender: true, height: "100%", isLive, trace, knownDurationMs: traceWithMeta == null ? void 0 : traceWithMeta.knownDurationMs, hasMoreData: hasMoreSpans || Boolean(isLoading), footer: jsxRuntimeExports.jsx(TraceViewerFooter, { hasMore: hasMoreSpans, isLive, isInitialLoading: Boolean(isLoading) }) }) })] }) }), selectedSpan && jsxRuntimeExports.jsxs("div", { className: "relative border-l flex-shrink-0 flex flex-col", style: {
+  return jsxRuntimeExports.jsxs("div", { className: "relative w-full h-full flex flex-row", children: [jsxRuntimeExports.jsx("div", { className: "flex-1 min-w-0 relative", children: jsxRuntimeExports.jsxs(TraceViewerContextProvider, { customSpanClassNameFunc: getCustomSpanClassName, customSpanEventClassNameFunc: getCustomSpanEventClassName, children: [jsxRuntimeExports.jsx(SelectionBridge, { onSelectionChange: handleSelectionChange }), jsxRuntimeExports.jsx(DeselectBridge, { triggerDeselect: deselectTrigger }), jsxRuntimeExports.jsx(SelectBridge, { selectRequest }), jsxRuntimeExports.jsx(TraceViewerWithContextMenu, { trace, run, isLive, onWakeUpSleep, onCancelRun, onResolveHook, onLoadMoreSpans, hasMoreSpans, isLoadingMoreSpans, children: jsxRuntimeExports.jsx(TraceViewerTimeline, { eagerRender: true, height: "100%", isLive, trace, knownDurationMs: traceWithMeta == null ? void 0 : traceWithMeta.knownDurationMs, hasMoreData: hasMoreSpans || Boolean(isLoading), footer: jsxRuntimeExports.jsx(TraceViewerFooter, { hasMore: hasMoreSpans, isLive, isInitialLoading: Boolean(isLoading) }) }) })] }) }), selectedSpan && jsxRuntimeExports.jsxs("div", { className: "relative border-l flex-shrink-0 flex flex-col", style: {
     width: panelWidth,
     borderColor: "var(--ds-gray-200)",
     backgroundColor: "var(--ds-background-100)"
@@ -6022,6 +6110,7 @@ function useStreamReader(env, streamId, runId, encryptionKey, runStatus) {
 }
 const INITIAL_PAGE_SIZE = 100;
 const LOAD_MORE_PAGE_SIZE = 100;
+const MAX_CORRELATION_SEARCH_PAGES = 30;
 function useEventsListData(env, runId, options = {}) {
   const { sortOrder = "asc", encryptionKey, enabled = true } = options;
   const [events, setEvents] = reactExports.useState([]);
@@ -6033,6 +6122,16 @@ function useEventsListData(env, runId, options = {}) {
   const isFetchingRef = reactExports.useRef(false);
   const encryptionKeyRef = reactExports.useRef(encryptionKey);
   encryptionKeyRef.current = encryptionKey;
+  const hydrateEvents = reactExports.useCallback(async (rawEvents) => {
+    const hydrated = rawEvents.map(hydrateResourceIO);
+    const key = encryptionKeyRef.current;
+    if (key) {
+      return Promise.all(
+        hydrated.map((ev) => hydrateResourceIOWithKey(ev, key))
+      );
+    }
+    return hydrated;
+  }, []);
   const fetchInitial = reactExports.useCallback(async () => {
     if (isFetchingRef.current) return;
     isFetchingRef.current = true;
@@ -6052,16 +6151,7 @@ function useEventsListData(env, runId, options = {}) {
       if (fetchError) {
         setError(fetchError);
       } else {
-        const hydrated = result.data.map(hydrateResourceIO);
-        const key = encryptionKeyRef.current;
-        if (key) {
-          const decrypted = await Promise.all(
-            hydrated.map((ev) => hydrateResourceIOWithKey(ev, key))
-          );
-          setEvents(decrypted);
-        } else {
-          setEvents(hydrated);
-        }
+        setEvents(await hydrateEvents(result.data));
         setCursor(result.hasMore ? result.cursor : void 0);
         setHasMore(Boolean(result.hasMore));
       }
@@ -6071,7 +6161,7 @@ function useEventsListData(env, runId, options = {}) {
       setLoading(false);
       isFetchingRef.current = false;
     }
-  }, [env, runId, sortOrder]);
+  }, [env, runId, sortOrder, hydrateEvents]);
   reactExports.useEffect(() => {
     if (enabled) fetchInitial();
   }, [fetchInitial, enabled]);
@@ -6102,16 +6192,8 @@ function useEventsListData(env, runId, options = {}) {
         setError(fetchError);
       } else {
         if (result.data.length > 0) {
-          const hydrated = result.data.map(hydrateResourceIO);
-          const key = encryptionKeyRef.current;
-          if (key) {
-            const decrypted = await Promise.all(
-              hydrated.map((ev) => hydrateResourceIOWithKey(ev, key))
-            );
-            setEvents((prev) => [...prev, ...decrypted]);
-          } else {
-            setEvents((prev) => [...prev, ...hydrated]);
-          }
+          const hydrated = await hydrateEvents(result.data);
+          setEvents((prev) => [...prev, ...hydrated]);
         }
         setCursor(result.hasMore ? result.cursor : void 0);
         setHasMore(Boolean(result.hasMore));
@@ -6121,14 +6203,65 @@ function useEventsListData(env, runId, options = {}) {
     } finally {
       setLoadingMore(false);
     }
-  }, [env, runId, sortOrder, cursor, loadingMore]);
+  }, [env, runId, sortOrder, cursor, loadingMore, hydrateEvents]);
+  const searchByExactId = reactExports.useCallback(
+    async (id, kind, signal) => {
+      if (signal == null ? void 0 : signal.aborted) {
+        throw new DOMException("Aborted", "AbortError");
+      }
+      if (kind === "event") {
+        const { error: fetchError, result } = await unwrapServerActionResult(
+          fetchEvent(env, runId, id, "none")
+        );
+        if (fetchError || (signal == null ? void 0 : signal.aborted)) {
+          return fetchError ? { status: "error", message: fetchError.message } : (() => {
+            throw new DOMException("Aborted", "AbortError");
+          })();
+        }
+        const [event] = await hydrateEvents([result]);
+        return (event == null ? void 0 : event.runId) === runId ? { status: "ok", events: [event] } : { status: "not_found" };
+      }
+      const matched = [];
+      let nextCursor;
+      let pagesFetched = 0;
+      let truncated = false;
+      do {
+        if (signal == null ? void 0 : signal.aborted) {
+          throw new DOMException("Aborted", "AbortError");
+        }
+        const { error: fetchError, result } = await unwrapServerActionResult(
+          fetchEventsByCorrelationId(env, id, {
+            cursor: nextCursor,
+            sortOrder,
+            limit: 100,
+            withData: false
+          })
+        );
+        if (fetchError) {
+          return { status: "error", message: fetchError.message };
+        }
+        if (signal == null ? void 0 : signal.aborted) {
+          throw new DOMException("Aborted", "AbortError");
+        }
+        pagesFetched += 1;
+        const hydrated = await hydrateEvents(result.data);
+        matched.push(...hydrated.filter((event) => event.runId === runId));
+        const hitPageCap = pagesFetched >= MAX_CORRELATION_SEARCH_PAGES;
+        truncated = truncated || hitPageCap && Boolean(result.hasMore && result.cursor);
+        nextCursor = !hitPageCap && result.hasMore && result.cursor ? result.cursor : void 0;
+      } while (nextCursor);
+      return matched.length > 0 ? { status: "ok", events: matched, truncated: truncated || void 0 } : { status: "not_found" };
+    },
+    [env, runId, sortOrder, hydrateEvents]
+  );
   return {
     events,
     loading,
     error,
     hasMore,
     loadingMore,
-    loadMore
+    loadMore,
+    searchByExactId
   };
 }
 function LiveStatus({ hasError, errorMessage }) {
@@ -6276,7 +6409,8 @@ function RunDetailView({
     loading: eventsListLoading,
     hasMore: hasMoreEventsTab,
     loadingMore: loadingMoreEventsTab,
-    loadMore: loadMoreEventsTab
+    loadMore: loadMoreEventsTab,
+    searchByExactId
   } = useEventsListData(env, runId, {
     sortOrder: eventsSortOrder,
     encryptionKey: encryptionKey ?? void 0,
@@ -6320,7 +6454,6 @@ function RunDetailView({
         return;
       }
       setEncryptionKey(keyResult);
-      toast.success("Run data decrypted successfully");
     } finally {
       setIsDecrypting(false);
     }
@@ -6558,7 +6691,8 @@ function RunDetailView({
                 onSortOrderChange: setEventsSortOrder,
                 onDecrypt: handleDecrypt,
                 isDecrypting,
-                hasEncryptedData
+                hasEncryptedData,
+                onExactIdSearch: searchByExactId
               }
             ) }) }) }),
             /* @__PURE__ */ jsxRuntimeExports.jsx(TabsContent, { value: "streams", className: "mt-0 flex-1 min-h-0", children: /* @__PURE__ */ jsxRuntimeExports.jsx(ErrorBoundary, { title: "Failed to load stream data", children: /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: "h-full flex gap-4", children: [

package/build/client/assets/{workflow-graph-viewer-D5yEggTb.js → workflow-graph-viewer-P4oMQJaV.js}

@@ -1,7 +1,7 @@
 var __defProp = Object.defineProperty;
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
-import { c as createLucideIcon, aF as cn, d as cn$1, G as cva, aG as composeRefs, E as useComposedRefs, aH as useFloating, aI as offset, aJ as shift, aK as flip, aL as size, aM as arrow, aN as hide, aO as limitShift, aP as autoUpdate, T as Tooltip, a as TooltipTrigger, b as TooltipContent, aQ as cancelRun$1, aR as reenqueueRun$1, aS as wakeUpRun$1, aT as resumeHook$1, aU as recreateRun$1, p as createContextScope$1, n as useComposedRefs$1, v as createSlot, W as formatDuration, B as Button, t as toast, s as useId$1, P as Primitive$1, q as composeEventHandlers$1, x as useControllableState$1, m as useCallbackRef$2, H as Presence$1 } from "./mermaid-3ZIDBTTL-B_qZU5zW.js";
+import { c as createLucideIcon, aG as cn, d as cn$1, G as cva, aH as composeRefs, E as useComposedRefs, aI as useFloating, aJ as offset, aK as shift, aL as limitShift, aM as flip, aN as size, aO as arrow, aP as hide, aQ as autoUpdate, T as Tooltip, a as TooltipTrigger, b as TooltipContent, aR as cancelRun$1, aS as reenqueueRun$1, aT as wakeUpRun$1, aU as resumeHook$1, aV as recreateRun$1, v as createContextScope$1, n as useComposedRefs$1, w as createSlot, W as formatDuration, B as Button, t as toast, p as useId$1, P as Primitive$1, o as composeEventHandlers$1, x as useControllableState$1, m as useCallbackRef$2, H as Presence$1 } from "./mermaid-3ZIDBTTL-Cr7OQX4b.js";
 import { r as reactExports, j as jsxRuntimeExports, f as reactDomExports, R as ReactExports, H as React, C as ReactDOM, a as requireReact, I as getDefaultExportFromCjs } from "./index-DQa-BExo.js";
 function parseName(tag, name) {
   if (typeof name !== "string") {
@@ -16140,8 +16140,8 @@ export {
   Zap as Z,
   useCallbackRef$1 as _,
   Skeleton as a,
-  createContext2 as a0,
-  useId as a1,
+  useId as a0,
+  createContext2 as a1,
   useFocusGuards as a2,
   LAYOUT as a3,
   wakeUpRun as a4,
@@ -16165,11 +16165,11 @@ export {
   Check as q,
   resumeHook as r,
   useControllableState as s,
-  createContextScope as t,
+  composeEventHandlers as t,
   unwrapOrThrow as u,
-  composeEventHandlers as v,
-  Presence as w,
-  useSize as x,
+  Presence as v,
+  useSize as w,
+  createContextScope as x,
   cancelRun as y,
   reenqueueRun as z
 };

package/build/server/assets/{app-fdUHF124.js → app-CthB1gsr.js}

@@ -9176,7 +9176,7 @@ const app = express();
 app.all(
   "*",
   createRequestHandler({
-    build: () => import("./server-build-Mddyhj54.js").then((n) => n.G)
+    build: () => import("./server-build-DBNmVwSJ.js").then((n) => n.G)
   })
 );
 app.use(

package/build/server/assets/{highlighted-body-B3W2YXNL-2WxWqSYU.js → highlighted-body-B3W2YXNL-Bid3dXog.js}

@@ -1,5 +1,5 @@
-import { y as R, K as Ks, z as jsxRuntimeExports, A as Qe } from "./server-build-Mddyhj54.js";
-import { r as reactExports } from "./app-fdUHF124.js";
+import { y as R, K as Ks, z as jsxRuntimeExports, A as Qe } from "./server-build-DBNmVwSJ.js";
+import { r as reactExports } from "./app-CthB1gsr.js";
 import "node:stream";
 import "util";
 import "crypto";