@workflow/web-shared 5.0.0-beta.4 → 5.0.0-beta.5

package/dist/components/new-trace-viewer/components/event-list.js

@@ -27,10 +27,10 @@ const EventRow = ({ span, isSelected, onSelectSpan, }) => {
     const durationMs = getSpanDurationMs(span);
     const isErrored = span.attributes.data.status === 'failed';
     const { icon: Icon, className: tagClassName } = getEventStyle(span.resource, isErrored);
-    return (_jsx("li", { className: cn('relative overflow-clip group after:absolute after:inset-x-0 after:bottom-0 after:h-px after:bg-gray-alpha-400', ROW_HEIGHT_CLASS), role: 'treeitem', "aria-selected": isSelected, "aria-expanded": isSelected, "aria-level": 1, onClick: () => onSelectSpan(span.spanId), children: _jsx("div", { className: 'h-full hover:bg-gray-100 group-aria-selected:bg-gray-100 group-aria-selected:hover:bg-gray-200', children: _jsxs("div", { className: 'flex h-full min-w-0 items-center px-2', children: [_jsxs("div", { className: 'flex min-w-0 flex-1 items-center gap-2', children: [_jsx("span", { className: cn('shrink-0', tagClassName), children: _jsx(Icon, { className: 'w-4 h-4' }) }), _jsx("span", { className: 'min-w-0 text-label-14', children: _jsx(MiddleTruncate, { value: span.name }) })] }), _jsx("div", { className: 'ml-2 shrink-0', children: _jsx("span", { className: 'text-label-14 text-gray-900 tabular-nums', children: formatDuration(durationMs) }) })] }) }) }));
+    return (_jsx("li", { className: cn('relative overflow-clip group after:absolute after:inset-x-0 after:bottom-0 after:h-px after:bg-gray-alpha-400', ROW_HEIGHT_CLASS), role: "treeitem", "aria-selected": isSelected, "aria-expanded": isSelected, "aria-level": 1, onClick: () => onSelectSpan(span.spanId), children: _jsx("div", { className: "h-full hover:bg-gray-100 group-aria-selected:bg-gray-100 group-aria-selected:hover:bg-gray-200", children: _jsxs("div", { className: "flex h-full min-w-0 items-center px-2", children: [_jsxs("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: [_jsx("span", { className: cn('shrink-0', tagClassName), children: _jsx(Icon, { className: "w-4 h-4" }) }), _jsx("span", { className: "min-w-0 text-label-14", children: _jsx(MiddleTruncate, { value: span.name }) })] }), _jsx("div", { className: "ml-2 shrink-0", children: _jsx("span", { className: "text-label-14 text-gray-900 tabular-nums", children: formatDuration(durationMs) }) })] }) }) }));
 };
 const EventList = ({ spans, activeSpanId, onSelectSpan, }) => {
-    return (_jsx("ul", { id: 'event-list', role: 'tree', className: 'block min-h-0 overflow-visible', children: spans.map((span) => {
+    return (_jsx("ul", { id: "event-list", role: "tree", className: "block min-h-0 overflow-visible", children: spans.map((span) => {
             return (_jsx(EventRow, { span: span, isSelected: span.spanId === activeSpanId, onSelectSpan: onSelectSpan }, span.spanId));
         }) }));
 };

package/dist/components/new-trace-viewer/components/event-list.js.map

@@ -1 +1 @@
-{"version":3,"file":"event-list.js","sourceRoot":"","sources":["../../../../src/components/new-trace-viewer/components/event-list.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Circle } from 'lucide-react';\nimport { cn } from '../../../lib/utils';\nimport type { Span } from '../../trace-viewer/types';\nimport { formatDuration } from '../../trace-viewer/util/timing';\nimport {\n  WorkflowIcon,\n  WebhookIcon,\n  SleepIcon,\n  StepForwardIcon,\n} from '../icons';\nimport { getSpanDurationMs } from '../utils';\nimport { MiddleTruncate } from './middle-truncate/middle-truncate';\n\ninterface EventStyle {\n  icon: React.ComponentType<{ className?: string }>;\n  className: string;\n}\n\nconst eventStyles: Record<string, EventStyle> = {\n  run: { icon: WorkflowIcon, className: 'text-blue-900' },\n  step: { icon: StepForwardIcon, className: 'text-green-900' },\n  hook: { icon: WebhookIcon, className: 'text-yellow-900' },\n  sleep: { icon: SleepIcon, className: 'text-gray-900' },\n};\n\nconst defaultStyle: EventStyle = {\n  icon: Circle,\n  className: 'text-gray-900',\n};\n\nconst ROW_HEIGHT_CLASS = 'h-10';\n\nfunction getEventStyle(resource: string, isErrored: boolean): EventStyle {\n  const style = eventStyles[resource] ?? defaultStyle;\n  return {\n    icon: style.icon,\n    className: cn(isErrored ? 'text-red-900' : style.className),\n  };\n}\n\nconst EventRow = ({\n  span,\n  isSelected,\n  onSelectSpan,\n}: {\n  span: Span;\n  isSelected: boolean;\n  onSelectSpan: (spanId: string) => void;\n}) => {\n  const durationMs = getSpanDurationMs(span);\n  const isErrored =\n    (span.attributes.data as Record<string, unknown>).status === 'failed';\n  const { icon: Icon, className: tagClassName } = getEventStyle(\n    span.resource,\n    isErrored\n  );\n\n  return (\n    <li\n      className={cn(\n        'relative overflow-clip group after:absolute after:inset-x-0 after:bottom-0 after:h-px after:bg-gray-alpha-400',\n        ROW_HEIGHT_CLASS\n      )}\n      role='treeitem'\n      aria-selected={isSelected}\n      aria-expanded={isSelected}\n      aria-level={1}\n      onClick={() => onSelectSpan(span.spanId)}\n    >\n      <div className='h-full hover:bg-gray-100 group-aria-selected:bg-gray-100 group-aria-selected:hover:bg-gray-200'>\n        <div className='flex h-full min-w-0 items-center px-2'>\n          <div className='flex min-w-0 flex-1 items-center gap-2'>\n            <span className={cn('shrink-0', tagClassName)}>\n              <Icon className='w-4 h-4' />\n            </span>\n            <span className='min-w-0 text-label-14'>\n              <MiddleTruncate value={span.name} />\n            </span>\n          </div>\n          <div className='ml-2 shrink-0'>\n            <span className='text-label-14 text-gray-900 tabular-nums'>\n              {formatDuration(durationMs)}\n            </span>\n          </div>\n        </div>\n      </div>\n    </li>\n  );\n};\n\nconst EventList = ({\n  spans,\n  activeSpanId,\n  onSelectSpan,\n}: {\n  spans: Span[];\n  activeSpanId: string | null;\n  onSelectSpan: (spanId: string) => void;\n}) => {\n  return (\n    <ul id='event-list' role='tree' className='block min-h-0 overflow-visible'>\n      {spans.map((span) => {\n        return (\n          <EventRow\n            key={span.spanId}\n            span={span}\n            isSelected={span.spanId === activeSpanId}\n            onSelectSpan={onSelectSpan}\n          />\n        );\n      })}\n    </ul>\n  );\n};\n\nexport default EventList;\n"]}
+{"version":3,"file":"event-list.js","sourceRoot":"","sources":["../../../../src/components/new-trace-viewer/components/event-list.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Circle } from 'lucide-react';\nimport { cn } from '../../../lib/utils';\nimport type { Span } from '../../trace-viewer/types';\nimport { formatDuration } from '../../trace-viewer/util/timing';\nimport {\n  WorkflowIcon,\n  WebhookIcon,\n  SleepIcon,\n  StepForwardIcon,\n} from '../icons';\nimport { getSpanDurationMs } from '../utils';\nimport { MiddleTruncate } from './middle-truncate/middle-truncate';\n\ninterface EventStyle {\n  icon: React.ComponentType<{ className?: string }>;\n  className: string;\n}\n\nconst eventStyles: Record<string, EventStyle> = {\n  run: { icon: WorkflowIcon, className: 'text-blue-900' },\n  step: { icon: StepForwardIcon, className: 'text-green-900' },\n  hook: { icon: WebhookIcon, className: 'text-yellow-900' },\n  sleep: { icon: SleepIcon, className: 'text-gray-900' },\n};\n\nconst defaultStyle: EventStyle = {\n  icon: Circle,\n  className: 'text-gray-900',\n};\n\nconst ROW_HEIGHT_CLASS = 'h-10';\n\nfunction getEventStyle(resource: string, isErrored: boolean): EventStyle {\n  const style = eventStyles[resource] ?? defaultStyle;\n  return {\n    icon: style.icon,\n    className: cn(isErrored ? 'text-red-900' : style.className),\n  };\n}\n\nconst EventRow = ({\n  span,\n  isSelected,\n  onSelectSpan,\n}: {\n  span: Span;\n  isSelected: boolean;\n  onSelectSpan: (spanId: string) => void;\n}) => {\n  const durationMs = getSpanDurationMs(span);\n  const isErrored =\n    (span.attributes.data as Record<string, unknown>).status === 'failed';\n  const { icon: Icon, className: tagClassName } = getEventStyle(\n    span.resource,\n    isErrored\n  );\n\n  return (\n    <li\n      className={cn(\n        'relative overflow-clip group after:absolute after:inset-x-0 after:bottom-0 after:h-px after:bg-gray-alpha-400',\n        ROW_HEIGHT_CLASS\n      )}\n      role=\"treeitem\"\n      aria-selected={isSelected}\n      aria-expanded={isSelected}\n      aria-level={1}\n      onClick={() => onSelectSpan(span.spanId)}\n    >\n      <div className=\"h-full hover:bg-gray-100 group-aria-selected:bg-gray-100 group-aria-selected:hover:bg-gray-200\">\n        <div className=\"flex h-full min-w-0 items-center px-2\">\n          <div className=\"flex min-w-0 flex-1 items-center gap-2\">\n            <span className={cn('shrink-0', tagClassName)}>\n              <Icon className=\"w-4 h-4\" />\n            </span>\n            <span className=\"min-w-0 text-label-14\">\n              <MiddleTruncate value={span.name} />\n            </span>\n          </div>\n          <div className=\"ml-2 shrink-0\">\n            <span className=\"text-label-14 text-gray-900 tabular-nums\">\n              {formatDuration(durationMs)}\n            </span>\n          </div>\n        </div>\n      </div>\n    </li>\n  );\n};\n\nconst EventList = ({\n  spans,\n  activeSpanId,\n  onSelectSpan,\n}: {\n  spans: Span[];\n  activeSpanId: string | null;\n  onSelectSpan: (spanId: string) => void;\n}) => {\n  return (\n    <ul id=\"event-list\" role=\"tree\" className=\"block min-h-0 overflow-visible\">\n      {spans.map((span) => {\n        return (\n          <EventRow\n            key={span.spanId}\n            span={span}\n            isSelected={span.spanId === activeSpanId}\n            onSelectSpan={onSelectSpan}\n          />\n        );\n      })}\n    </ul>\n  );\n};\n\nexport default EventList;\n"]}

package/dist/components/new-trace-viewer/components/middle-truncate/middle-truncate.js

@@ -75,7 +75,7 @@ function MiddleTruncate({ value, className, onCopy: onCopyProp, ...props }) {
         e.preventDefault();
         e.clipboardData.setData('text/plain', copyText);
     }, [onCopyProp, isTruncated, prefixText, suffixText, value]);
-    return (_jsxs("span", { title: isTruncated ? value : undefined, ...props, ref: ref, className: cn('relative inline-grid min-w-0 max-w-full overflow-hidden whitespace-nowrap', className), onCopy: handleCopy, children: [isTruncated && _jsx("span", { className: 'sr-only select-none', children: value }), _jsx("span", { "aria-hidden": 'true', className: 'pointer-events-none col-start-1 row-start-1 invisible select-none whitespace-nowrap', children: value }), _jsx("span", { "aria-hidden": isTruncated || undefined, className: 'col-start-1 row-start-1 min-w-0 overflow-hidden', ref: visibleRef, children: isTruncated ? (_jsxs(_Fragment, { children: [_jsx("span", { children: prefixText }), _jsx("span", { children: ELLIPSIS }), _jsx("span", { children: suffixText })] })) : (displayText) }), _jsx("span", { "aria-hidden": 'true', className: 'pointer-events-none absolute left-0 top-0 inline-block invisible select-none whitespace-nowrap', ref: measureRef })] }));
+    return (_jsxs("span", { title: isTruncated ? value : undefined, ...props, ref: ref, className: cn('relative inline-grid min-w-0 max-w-full overflow-hidden whitespace-nowrap', className), onCopy: handleCopy, children: [isTruncated && _jsx("span", { className: "sr-only select-none", children: value }), _jsx("span", { "aria-hidden": "true", className: "pointer-events-none col-start-1 row-start-1 invisible select-none whitespace-nowrap", children: value }), _jsx("span", { "aria-hidden": isTruncated || undefined, className: "col-start-1 row-start-1 min-w-0 overflow-hidden", ref: visibleRef, children: isTruncated ? (_jsxs(_Fragment, { children: [_jsx("span", { children: prefixText }), _jsx("span", { children: ELLIPSIS }), _jsx("span", { children: suffixText })] })) : (displayText) }), _jsx("span", { "aria-hidden": "true", className: "pointer-events-none absolute left-0 top-0 inline-block invisible select-none whitespace-nowrap", ref: measureRef })] }));
 }
 export { MiddleTruncate };
 //# sourceMappingURL=middle-truncate.js.map

package/dist/components/new-trace-viewer/components/middle-truncate/middle-truncate.js.map

@@ -1 +1 @@
-{"version":3,"file":"middle-truncate.js","sourceRoot":"","sources":["../../../../../src/components/new-trace-viewer/components/middle-truncate/middle-truncate.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport { useCallback, useRef } from 'react';\nimport type { ClipboardEvent, ComponentPropsWithoutRef, JSX } from 'react';\nimport { cn } from '../../../../lib/utils';\nimport {\n  getMiddleTruncateCopyText,\n  getMiddleTruncateCopyTextFromSelectionText,\n} from './copy-selection';\nimport { ELLIPSIS } from './truncate';\nimport { useMiddleTruncate } from './use-middle-truncate';\n\n/** Props for the {@link MiddleTruncate} component. */\ninterface MiddleTruncateProps\n  extends Omit<ComponentPropsWithoutRef<'span'>, 'children'> {\n  /** The full text string to display, truncated from the middle when it overflows. */\n  value: string;\n}\n\nfunction getRangeOffsets(\n  container: HTMLElement,\n  range: Range\n): { end: number; start: number } | null {\n  if (\n    !container.contains(range.startContainer) ||\n    !container.contains(range.endContainer)\n  ) {\n    return null;\n  }\n\n  const startRange = document.createRange();\n  startRange.selectNodeContents(container);\n  startRange.setEnd(range.startContainer, range.startOffset);\n\n  const endRange = document.createRange();\n  endRange.selectNodeContents(container);\n  endRange.setEnd(range.endContainer, range.endOffset);\n\n  return {\n    end: endRange.toString().length,\n    start: startRange.toString().length,\n  };\n}\n\n/**\n * @gdoc\n *\n * Truncates text from the middle with an ellipsis when it overflows, preserving the beginning and end (e.g. file paths, URLs). Copy behavior restores the full untruncated text to the clipboard.\n * Renders a `<span>` element.\n *\n * Documentation: [Geist Middle Truncate](https://vercel.com/geist/middle-truncate)\n *\n * @param value - Full text string to display.\n */\nfunction MiddleTruncate({\n  value,\n  className,\n  onCopy: onCopyProp,\n  ...props\n}: MiddleTruncateProps): JSX.Element {\n  const { ref, measureRef, displayText, isTruncated, prefixText, suffixText } =\n    useMiddleTruncate(value);\n  const visibleRef = useRef<HTMLSpanElement | null>(null);\n\n  const handleCopy = useCallback(\n    (e: ClipboardEvent<HTMLSpanElement>) => {\n      onCopyProp?.(e);\n      if (e.defaultPrevented || !isTruncated) return;\n\n      const selection = window.getSelection();\n      if (!selection || selection.rangeCount === 0) return;\n      const selectionText = selection.toString();\n      if (!selectionText) return;\n\n      // Only intercept when the selection is fully within this element.\n      // If the user selected across elements (e.g. a table row), let\n      // the browser's default behavior preserve surrounding context.\n      const range = selection.getRangeAt(0);\n      const visibleEl = visibleRef.current;\n      let copyText: string | null = null;\n\n      if (\n        e.currentTarget.contains(range.startContainer) &&\n        e.currentTarget.contains(range.endContainer) &&\n        visibleEl\n      ) {\n        const offsets = getRangeOffsets(visibleEl, range);\n        if (offsets) {\n          copyText = getMiddleTruncateCopyText({\n            prefixText,\n            selectionEnd: offsets.end,\n            selectionStart: offsets.start,\n            suffixText,\n            value,\n          });\n        }\n      }\n\n      copyText ??= getMiddleTruncateCopyTextFromSelectionText({\n        prefixText,\n        selectionText,\n        suffixText,\n        value,\n      });\n\n      if (copyText === null) return;\n\n      e.preventDefault();\n      e.clipboardData.setData('text/plain', copyText);\n    },\n    [onCopyProp, isTruncated, prefixText, suffixText, value]\n  );\n\n  return (\n    <span\n      title={isTruncated ? value : undefined}\n      {...props}\n      ref={ref}\n      className={cn(\n        'relative inline-grid min-w-0 max-w-full overflow-hidden whitespace-nowrap',\n        className\n      )}\n      onCopy={handleCopy}\n    >\n      {isTruncated && <span className='sr-only select-none'>{value}</span>}\n      <span\n        aria-hidden='true'\n        className='pointer-events-none col-start-1 row-start-1 invisible select-none whitespace-nowrap'\n      >\n        {value}\n      </span>\n      <span\n        aria-hidden={isTruncated || undefined}\n        className='col-start-1 row-start-1 min-w-0 overflow-hidden'\n        ref={visibleRef}\n      >\n        {isTruncated ? (\n          <>\n            <span>{prefixText}</span>\n            <span>{ELLIPSIS}</span>\n            <span>{suffixText}</span>\n          </>\n        ) : (\n          displayText\n        )}\n      </span>\n      <span\n        aria-hidden='true'\n        className='pointer-events-none absolute left-0 top-0 inline-block invisible select-none whitespace-nowrap'\n        ref={measureRef}\n      />\n    </span>\n  );\n}\n\nexport { MiddleTruncate };\nexport type { MiddleTruncateProps };\n"]}
+{"version":3,"file":"middle-truncate.js","sourceRoot":"","sources":["../../../../../src/components/new-trace-viewer/components/middle-truncate/middle-truncate.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport { useCallback, useRef } from 'react';\nimport type { ClipboardEvent, ComponentPropsWithoutRef, JSX } from 'react';\nimport { cn } from '../../../../lib/utils';\nimport {\n  getMiddleTruncateCopyText,\n  getMiddleTruncateCopyTextFromSelectionText,\n} from './copy-selection';\nimport { ELLIPSIS } from './truncate';\nimport { useMiddleTruncate } from './use-middle-truncate';\n\n/** Props for the {@link MiddleTruncate} component. */\ninterface MiddleTruncateProps\n  extends Omit<ComponentPropsWithoutRef<'span'>, 'children'> {\n  /** The full text string to display, truncated from the middle when it overflows. */\n  value: string;\n}\n\nfunction getRangeOffsets(\n  container: HTMLElement,\n  range: Range\n): { end: number; start: number } | null {\n  if (\n    !container.contains(range.startContainer) ||\n    !container.contains(range.endContainer)\n  ) {\n    return null;\n  }\n\n  const startRange = document.createRange();\n  startRange.selectNodeContents(container);\n  startRange.setEnd(range.startContainer, range.startOffset);\n\n  const endRange = document.createRange();\n  endRange.selectNodeContents(container);\n  endRange.setEnd(range.endContainer, range.endOffset);\n\n  return {\n    end: endRange.toString().length,\n    start: startRange.toString().length,\n  };\n}\n\n/**\n * @gdoc\n *\n * Truncates text from the middle with an ellipsis when it overflows, preserving the beginning and end (e.g. file paths, URLs). Copy behavior restores the full untruncated text to the clipboard.\n * Renders a `<span>` element.\n *\n * Documentation: [Geist Middle Truncate](https://vercel.com/geist/middle-truncate)\n *\n * @param value - Full text string to display.\n */\nfunction MiddleTruncate({\n  value,\n  className,\n  onCopy: onCopyProp,\n  ...props\n}: MiddleTruncateProps): JSX.Element {\n  const { ref, measureRef, displayText, isTruncated, prefixText, suffixText } =\n    useMiddleTruncate(value);\n  const visibleRef = useRef<HTMLSpanElement | null>(null);\n\n  const handleCopy = useCallback(\n    (e: ClipboardEvent<HTMLSpanElement>) => {\n      onCopyProp?.(e);\n      if (e.defaultPrevented || !isTruncated) return;\n\n      const selection = window.getSelection();\n      if (!selection || selection.rangeCount === 0) return;\n      const selectionText = selection.toString();\n      if (!selectionText) return;\n\n      // Only intercept when the selection is fully within this element.\n      // If the user selected across elements (e.g. a table row), let\n      // the browser's default behavior preserve surrounding context.\n      const range = selection.getRangeAt(0);\n      const visibleEl = visibleRef.current;\n      let copyText: string | null = null;\n\n      if (\n        e.currentTarget.contains(range.startContainer) &&\n        e.currentTarget.contains(range.endContainer) &&\n        visibleEl\n      ) {\n        const offsets = getRangeOffsets(visibleEl, range);\n        if (offsets) {\n          copyText = getMiddleTruncateCopyText({\n            prefixText,\n            selectionEnd: offsets.end,\n            selectionStart: offsets.start,\n            suffixText,\n            value,\n          });\n        }\n      }\n\n      copyText ??= getMiddleTruncateCopyTextFromSelectionText({\n        prefixText,\n        selectionText,\n        suffixText,\n        value,\n      });\n\n      if (copyText === null) return;\n\n      e.preventDefault();\n      e.clipboardData.setData('text/plain', copyText);\n    },\n    [onCopyProp, isTruncated, prefixText, suffixText, value]\n  );\n\n  return (\n    <span\n      title={isTruncated ? value : undefined}\n      {...props}\n      ref={ref}\n      className={cn(\n        'relative inline-grid min-w-0 max-w-full overflow-hidden whitespace-nowrap',\n        className\n      )}\n      onCopy={handleCopy}\n    >\n      {isTruncated && <span className=\"sr-only select-none\">{value}</span>}\n      <span\n        aria-hidden=\"true\"\n        className=\"pointer-events-none col-start-1 row-start-1 invisible select-none whitespace-nowrap\"\n      >\n        {value}\n      </span>\n      <span\n        aria-hidden={isTruncated || undefined}\n        className=\"col-start-1 row-start-1 min-w-0 overflow-hidden\"\n        ref={visibleRef}\n      >\n        {isTruncated ? (\n          <>\n            <span>{prefixText}</span>\n            <span>{ELLIPSIS}</span>\n            <span>{suffixText}</span>\n          </>\n        ) : (\n          displayText\n        )}\n      </span>\n      <span\n        aria-hidden=\"true\"\n        className=\"pointer-events-none absolute left-0 top-0 inline-block invisible select-none whitespace-nowrap\"\n        ref={measureRef}\n      />\n    </span>\n  );\n}\n\nexport { MiddleTruncate };\nexport type { MiddleTruncateProps };\n"]}

package/dist/components/new-trace-viewer/trace-viewer.js

@@ -318,6 +318,9 @@ function NewTraceViewerContent({ trace }) {
         if (!selectedSpan?.data)
             return 'Details';
         const data = selectedSpan.data;
+        if (selectedSpan.resource === 'hook') {
+            return data.token ?? data.hookId;
+        }
         const stepName = data.stepName;
         const workflowName = data.workflowName;
         return ((stepName ? parseStepName(stepName)?.shortName : undefined) ??
@@ -326,24 +329,27 @@ function NewTraceViewerContent({ trace }) {
             workflowName ??
             data.hookId ??
             'Details');
-    }, [selectedSpan?.data]);
+    }, [selectedSpan?.data, selectedSpan?.resource]);
     const selectedResource = selectedSpan?.resource;
     const selectedResourceId = useMemo(() => {
         if (!selectedSpan?.data)
             return undefined;
         const data = selectedSpan.data;
+        if (selectedSpan.resource === 'hook') {
+            return data.hookId ?? selectedSpan.spanId;
+        }
         return (data.stepId ??
             data.runId ??
             data.hookId ??
             selectedSpan.spanId);
-    }, [selectedSpan?.data, selectedSpan?.spanId]);
-    return (_jsxs("div", { "data-pane": 'pane-root', "data-has-detail": activeSpan ? '' : undefined, className: 'grid w-full h-full max-h-full grid-cols-[minmax(100px,1fr)] data-[has-detail]:grid-cols-[minmax(100px,1fr)_clamp(280px,420px,100%)]', children: [_jsxs("div", { id: 'trace-parent', className: 'grid grid-rows-[1fr] h-full min-h-0 overflow-hidden relative bg-background-100', children: [_jsxs(SplitPane, { startHeader: _jsxs("div", { className: 'bg-background-100 border-b border-gray-alpha-400 h-10 min-h-10 flex items-center px-2 gap-1.5', children: [_jsx(Search, { className: 'w-3.5 h-3.5 shrink-0 text-gray-800' }), _jsx("input", { id: 'trace-viewer-search', name: 'trace-viewer-search', type: 'text', value: searchQuery, onChange: (e) => setSearchQuery(e.target.value), 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 && (_jsx("button", { type: 'button', onClick: () => setSearchQuery(''), className: 'shrink-0 p-0.5 rounded-sm text-gray-800 hover:text-gray-1000 hover:bg-gray-200 transition-colors', children: _jsx(X, { className: 'w-3 h-3' }) }))] }), endHeader: _jsx(TimelineHeader, { markers: timeMarkers, hoverInfo: hoverInfo }), children: [_jsx("div", { className: 'block overflow-visible', children: _jsx(EventList, { spans: filteredSpans, activeSpanId: activeSpanId, onSelectSpan: handleSelectSpan }) }), _jsx("div", { ref: timelineRef, className: 'block min-h-0 overflow-visible relative', onDoubleClick: resetZoom, onMouseMove: handleTimelineMouseMove, onMouseLeave: handleTimelineMouseLeave, children: _jsx(Timeline, { spans: filteredSpans, viewStart: viewport.start, viewEnd: viewport.end, markers: timeMarkers, selectedId: activeSpanId, onSelect: handleSelectSpan, hoverFraction: hoverFraction, altHeld: altHeld }) })] }), _jsxs("div", { className: 'absolute right-3 bottom-3 z-[5] flex items-center border border-gray-alpha-400 rounded-lg bg-background-100 shadow-sm overflow-hidden divide-x divide-gray-alpha-400', children: [_jsx("button", { type: 'button', className: 'flex items-center justify-center w-8 h-8 text-gray-900 cursor-pointer transition-colors duration-[120ms] ease-in-out hover:text-gray-1000 hover:bg-gray-alpha-100', onClick: zoomOut, "aria-label": 'Zoom out', children: _jsx(ZoomOut, { className: 'w-4 h-4' }) }), _jsx("button", { type: 'button', className: 'flex items-center justify-center w-8 h-8 text-gray-900 cursor-pointer transition-colors duration-[120ms] ease-in-out hover:text-gray-1000 hover:bg-gray-alpha-100', onClick: resetZoom, "aria-label": 'Reset zoom', children: _jsx(RotateCcw, { className: 'w-3.5 h-3.5' }) }), _jsx("button", { type: 'button', className: 'flex items-center justify-center w-8 h-8 text-gray-900 cursor-pointer transition-colors duration-[120ms] ease-in-out hover:text-gray-1000 hover:bg-gray-alpha-100', onClick: zoomIn, "aria-label": 'Zoom in', children: _jsx(ZoomIn, { className: 'w-4 h-4' }) })] })] }), activeSpan && sidebar ? (_jsxs("aside", { className: 'flex flex-col h-full max-h-full bg-background-100 border-l border-gray-alpha-400 overflow-auto', children: [_jsx("div", { className: 'flex-shrink-0 px-4 pt-4 pb-3', children: _jsxs("div", { className: 'flex items-start justify-between gap-2', children: [_jsxs("div", { className: 'min-w-0 flex-1', children: [_jsx("span", { className: 'text-[15px] font-semibold text-gray-1000 truncate block', children: selectedSpanName }), selectedResourceId && (_jsxs("div", { className: 'mt-1 flex items-center gap-2', children: [selectedResource && (_jsx("span", { className: `inline-flex items-center rounded-md px-1.5 py-0.5 text-[11px] font-medium leading-none shrink-0 ${selectedResource === 'step'
+    }, [selectedSpan?.data, selectedSpan?.resource, selectedSpan?.spanId]);
+    return (_jsxs("div", { "data-pane": "pane-root", "data-has-detail": activeSpan ? '' : undefined, className: "grid w-full h-full max-h-full grid-cols-[minmax(100px,1fr)] data-[has-detail]:grid-cols-[minmax(100px,1fr)_clamp(280px,420px,100%)]", children: [_jsxs("div", { id: "trace-parent", className: "grid grid-rows-[1fr] h-full min-h-0 overflow-hidden relative bg-background-100", children: [_jsxs(SplitPane, { startHeader: _jsxs("div", { className: "bg-background-100 border-b border-gray-alpha-400 h-10 min-h-10 flex items-center px-2 gap-1.5", children: [_jsx(Search, { className: "w-3.5 h-3.5 shrink-0 text-gray-800" }), _jsx("input", { id: "trace-viewer-search", name: "trace-viewer-search", type: "text", value: searchQuery, onChange: (e) => setSearchQuery(e.target.value), 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 && (_jsx("button", { type: "button", onClick: () => setSearchQuery(''), className: "shrink-0 p-0.5 rounded-sm text-gray-800 hover:text-gray-1000 hover:bg-gray-200 transition-colors", children: _jsx(X, { className: "w-3 h-3" }) }))] }), endHeader: _jsx(TimelineHeader, { markers: timeMarkers, hoverInfo: hoverInfo }), children: [_jsx("div", { className: "block overflow-visible", children: _jsx(EventList, { spans: filteredSpans, activeSpanId: activeSpanId, onSelectSpan: handleSelectSpan }) }), _jsx("div", { ref: timelineRef, className: "block min-h-0 overflow-visible relative", onDoubleClick: resetZoom, onMouseMove: handleTimelineMouseMove, onMouseLeave: handleTimelineMouseLeave, children: _jsx(Timeline, { spans: filteredSpans, viewStart: viewport.start, viewEnd: viewport.end, markers: timeMarkers, selectedId: activeSpanId, onSelect: handleSelectSpan, hoverFraction: hoverFraction, altHeld: altHeld }) })] }), _jsxs("div", { className: "absolute right-3 bottom-3 z-[5] flex items-center border border-gray-alpha-400 rounded-lg bg-background-100 shadow-sm overflow-hidden divide-x divide-gray-alpha-400", children: [_jsx("button", { type: "button", className: "flex items-center justify-center w-8 h-8 text-gray-900 cursor-pointer transition-colors duration-[120ms] ease-in-out hover:text-gray-1000 hover:bg-gray-alpha-100", onClick: zoomOut, "aria-label": "Zoom out", children: _jsx(ZoomOut, { className: "w-4 h-4" }) }), _jsx("button", { type: "button", className: "flex items-center justify-center w-8 h-8 text-gray-900 cursor-pointer transition-colors duration-[120ms] ease-in-out hover:text-gray-1000 hover:bg-gray-alpha-100", onClick: resetZoom, "aria-label": "Reset zoom", children: _jsx(RotateCcw, { className: "w-3.5 h-3.5" }) }), _jsx("button", { type: "button", className: "flex items-center justify-center w-8 h-8 text-gray-900 cursor-pointer transition-colors duration-[120ms] ease-in-out hover:text-gray-1000 hover:bg-gray-alpha-100", onClick: zoomIn, "aria-label": "Zoom in", children: _jsx(ZoomIn, { className: "w-4 h-4" }) })] })] }), activeSpan && sidebar ? (_jsxs("aside", { className: "flex flex-col h-full max-h-full bg-background-100 border-l border-gray-alpha-400 overflow-auto", children: [_jsx("div", { className: "flex-shrink-0 px-4 pt-4 pb-3", children: _jsxs("div", { className: "flex items-start justify-between gap-2", children: [_jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("span", { className: "text-[15px] font-semibold text-gray-1000 truncate block", children: selectedSpanName }), selectedResourceId && (_jsxs("div", { className: "mt-1 flex items-center gap-2", children: [selectedResource && (_jsx("span", { className: `inline-flex items-center rounded-md px-1.5 py-0.5 text-[11px] font-medium leading-none shrink-0 ${selectedResource === 'step'
                                                         ? 'bg-green-200 text-green-900'
                                                         : selectedResource === 'run'
                                                             ? 'bg-blue-200 text-blue-900'
                                                             : selectedResource === 'hook'
                                                                 ? 'bg-yellow-200 text-yellow-900'
                                                                 : 'bg-gray-200 text-gray-900'}`, children: selectedResource.charAt(0).toUpperCase() +
-                                                        selectedResource.slice(1) })), _jsxs("div", { className: 'flex items-center gap-1 text-[13px] font-mono text-gray-700 min-w-0', title: selectedResourceId, children: [_jsx("span", { className: 'truncate', children: selectedResourceId }), _jsx(CopyButton, { copyText: selectedResourceId, ariaLabel: 'Copy ID', className: 'shrink-0' })] })] }))] }), _jsx("button", { type: 'button', className: 'p-1 rounded-md text-gray-900 hover:text-gray-1000 hover:bg-gray-alpha-200 transition-colors shrink-0', onClick: clearActiveSpan, children: _jsx(X, { className: 'w-4 h-4' }) })] }) }), _jsx("div", { className: 'flex-1 overflow-y-auto', children: _jsx(ErrorBoundary, { children: _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: selectedSpan }) }) })] })) : activeSpan ? (_jsx(DetailPanel, { span: activeSpan, rootStart: root.startTime, onClose: clearActiveSpan })) : null] }));
+                                                        selectedResource.slice(1) })), _jsxs("div", { className: "flex items-center gap-1 text-[13px] font-mono text-gray-700 min-w-0", title: selectedResourceId, children: [_jsx("span", { className: "truncate", children: selectedResourceId }), _jsx(CopyButton, { copyText: selectedResourceId, ariaLabel: "Copy ID", className: "shrink-0" })] })] }))] }), _jsx("button", { type: "button", className: "p-1 rounded-md text-gray-900 hover:text-gray-1000 hover:bg-gray-alpha-200 transition-colors shrink-0", onClick: clearActiveSpan, children: _jsx(X, { className: "w-4 h-4" }) })] }) }), _jsx("div", { className: "flex-1 overflow-y-auto", children: _jsx(ErrorBoundary, { children: _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: selectedSpan }) }) })] })) : activeSpan ? (_jsx(DetailPanel, { span: activeSpan, rootStart: root.startTime, onClose: clearActiveSpan })) : null] }));
 }
 //# sourceMappingURL=trace-viewer.js.map

package/dist/components/new-trace-viewer/trace-viewer.js.map

@@ -1 +1 @@
-{"version":3,"file":"trace-viewer.js","sourceRoot":"","sources":["../../../src/components/new-trace-viewer/trace-viewer.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport { parseStepName, parseWorkflowName } from '@workflow/utils/parse-name';\nimport { RotateCcw, Search, X, ZoomIn, ZoomOut } from 'lucide-react';\nimport {\n  type ReactNode,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { ErrorBoundary } from '../error-boundary';\nimport {\n  EntityDetailPanel,\n  type SelectedSpanInfo,\n} from '../sidebar/entity-detail-panel';\nimport { useSidebarDataOptional } from '../sidebar/sidebar-data-context';\nimport type { Trace } from '../trace-viewer/types';\nimport { formatDuration, getHighResInMs } from '../trace-viewer/util/timing';\nimport { CopyButton } from './components/copy-button';\nimport EventList from './components/event-list';\nimport { SplitPane } from './components/split-pane';\nimport {\n  Timeline,\n  TimelineHeader,\n  TIMELINE_PADDING_PX,\n} from './components/timeline';\nimport { ActiveSpanProvider, useActiveSpan } from './context';\nimport { DetailPanel } from './detail-panel';\nimport { computeRootBounds, computeTimeMarkers } from './utils';\n\ninterface NewTraceViewerProps {\n  trace: Trace;\n}\n\nconst MIN_VIEWPORT_MS = 0.001;\n\ninterface Viewport {\n  start: number;\n  end: number;\n}\n\nfunction useAnimatedViewport(initial: Viewport) {\n  const [viewport, setViewportState] = useState<Viewport>(initial);\n  const animRef = useRef<{\n    raf: number;\n    from: Viewport;\n    to: Viewport;\n    start: number;\n  } | null>(null);\n  const currentRef = useRef(initial);\n  currentRef.current = viewport;\n\n  const cancel = useCallback(() => {\n    if (animRef.current) {\n      cancelAnimationFrame(animRef.current.raf);\n      animRef.current = null;\n    }\n  }, []);\n\n  const animateTo = useCallback(\n    (target: Viewport) => {\n      cancel();\n      const from = currentRef.current;\n      const anim = { raf: 0, from, to: target, start: performance.now() };\n\n      const tick = () => {\n        const t = Math.min((performance.now() - anim.start) / 150, 1);\n        const e = 1 - (1 - t) * (1 - t);\n        setViewportState({\n          start: anim.from.start + (anim.to.start - anim.from.start) * e,\n          end: anim.from.end + (anim.to.end - anim.from.end) * e,\n        });\n        if (t < 1) anim.raf = requestAnimationFrame(tick);\n        else animRef.current = null;\n      };\n\n      animRef.current = anim;\n      anim.raf = requestAnimationFrame(tick);\n    },\n    [cancel]\n  );\n\n  const setViewport = useCallback(\n    (update: Viewport | ((prev: Viewport) => Viewport)) => {\n      cancel();\n      if (typeof update === 'function') {\n        setViewportState((prev) => {\n          const next = update(prev);\n          currentRef.current = next;\n          return next;\n        });\n      } else {\n        currentRef.current = update;\n        setViewportState(update);\n      }\n    },\n    [cancel]\n  );\n\n  useEffect(() => cancel, [cancel]);\n\n  return { viewport, setViewport, animateTo };\n}\n\n// ---------------------------------------------------------------------------\n// Hook: bridge ActiveSpanContext + SidebarDataContext → SelectedSpanInfo\n// ---------------------------------------------------------------------------\n\nfunction useSelectedSpanInfo(): SelectedSpanInfo | null {\n  const { activeSpan } = useActiveSpan();\n  const sidebar = useSidebarDataOptional();\n\n  return useMemo(() => {\n    if (!activeSpan || !sidebar) return null;\n\n    const correlationId = activeSpan.spanId;\n    const rawEvents = correlationId\n      ? sidebar.events.filter((e) => e.correlationId === correlationId)\n      : [];\n\n    return {\n      data: activeSpan.attributes?.data,\n      resource: activeSpan.attributes?.resource as string | undefined,\n      spanId: activeSpan.spanId,\n      rawEvents,\n    };\n  }, [activeSpan, sidebar?.events]);\n}\n\n// ---------------------------------------------------------------------------\n// Root component\n// ---------------------------------------------------------------------------\n\nexport function NewTraceViewer({ trace }: NewTraceViewerProps): ReactNode {\n  return (\n    <ActiveSpanProvider spans={trace.spans}>\n      <NewTraceViewerContent trace={trace} />\n    </ActiveSpanProvider>\n  );\n}\n\nfunction NewTraceViewerContent({ trace }: NewTraceViewerProps): ReactNode {\n  const { activeSpan, activeSpanId, setActiveSpan, clearActiveSpan } =\n    useActiveSpan();\n\n  const sidebar = useSidebarDataOptional();\n  const selectedSpan = useSelectedSpanInfo();\n\n  const [searchQuery, setSearchQuery] = useState('');\n\n  const filteredSpans = useMemo(() => {\n    const q = searchQuery.trim().toLowerCase();\n    if (!q) return trace.spans;\n    return trace.spans.filter(\n      (s) =>\n        s.name.toLowerCase().includes(q) || s.resource.toLowerCase().includes(q)\n    );\n  }, [trace.spans, searchQuery]);\n\n  const root = useMemo(() => computeRootBounds(trace.spans), [trace.spans]);\n\n  const { viewport, setViewport, animateTo } = useAnimatedViewport({\n    start: root.startTime,\n    end: root.startTime + root.duration,\n  });\n\n  const prevRootRef = useRef<Viewport>({\n    start: root.startTime,\n    end: root.startTime + root.duration,\n  });\n\n  useEffect(() => {\n    const prevRoot = prevRootRef.current;\n    const newStart = root.startTime;\n    const newEnd = root.startTime + root.duration;\n\n    setViewport((prev) => {\n      const wasAtFullExtent =\n        Math.abs(prev.start - prevRoot.start) < 0.01 &&\n        Math.abs(prev.end - prevRoot.end) < 0.01;\n\n      if (wasAtFullExtent) {\n        return { start: newStart, end: newEnd };\n      }\n      return prev;\n    });\n\n    prevRootRef.current = { start: newStart, end: newEnd };\n  }, [root.startTime, root.duration]);\n\n  const viewDuration = viewport.end - viewport.start;\n\n  const timeMarkers = useMemo(\n    () => computeTimeMarkers(viewDuration, viewport.start - root.startTime),\n    [viewDuration, viewport.start, root.startTime]\n  );\n\n  const resetZoom = useCallback(() => {\n    animateTo({ start: root.startTime, end: root.startTime + root.duration });\n  }, [animateTo, root.startTime, root.duration]);\n\n  const ZOOM_FACTOR = 0.5;\n\n  const zoomBy = useCallback(\n    (factor: number) => {\n      const rootS = root.startTime;\n      const rootE = root.startTime + root.duration;\n      const rootD = root.duration;\n\n      setViewport((prev) => {\n        const prevDuration = prev.end - prev.start;\n        const center = (prev.start + prev.end) / 2;\n        const newDuration = Math.max(\n          MIN_VIEWPORT_MS,\n          Math.min(rootD, prevDuration * factor)\n        );\n        let newStart = center - newDuration / 2;\n        let newEnd = center + newDuration / 2;\n\n        if (newStart < rootS) {\n          newStart = rootS;\n          newEnd = rootS + newDuration;\n        }\n        if (newEnd > rootE) {\n          newEnd = rootE;\n          newStart = Math.max(rootS, rootE - newDuration);\n        }\n\n        return { start: newStart, end: newEnd };\n      });\n    },\n    [setViewport, root.startTime, root.duration]\n  );\n\n  const zoomIn = useCallback(() => zoomBy(ZOOM_FACTOR), [zoomBy]);\n  const zoomOut = useCallback(() => zoomBy(1 / ZOOM_FACTOR), [zoomBy]);\n\n  const handleSelectSpan = useCallback(\n    (spanId: string) => {\n      if (spanId === activeSpanId) {\n        clearActiveSpan();\n        return;\n      }\n      setActiveSpan(spanId);\n\n      const span = trace.spans.find((s) => s.spanId === spanId);\n      if (!span) return;\n\n      const spanStart = getHighResInMs(span.startTime);\n      const spanEnd = getHighResInMs(span.endTime);\n      const spanDuration = spanEnd - spanStart;\n\n      const rootS = root.startTime;\n      const rootE = root.startTime + root.duration;\n      const rootD = root.duration;\n\n      if (spanDuration > rootD * 0.8) {\n        animateTo({ start: rootS, end: rootE });\n        return;\n      }\n\n      const padding = Math.max(spanDuration * 0.2, MIN_VIEWPORT_MS / 2);\n      let newStart = spanStart - padding;\n      let newEnd = spanEnd + padding;\n\n      if (newEnd - newStart < MIN_VIEWPORT_MS) {\n        const center = (spanStart + spanEnd) / 2;\n        newStart = center - MIN_VIEWPORT_MS / 2;\n        newEnd = center + MIN_VIEWPORT_MS / 2;\n      }\n\n      if (newStart < rootS) {\n        const duration = newEnd - newStart;\n        newStart = rootS;\n        newEnd = Math.min(rootE, rootS + duration);\n      }\n      if (newEnd > rootE) {\n        const duration = newEnd - newStart;\n        newEnd = rootE;\n        newStart = Math.max(rootS, rootE - duration);\n      }\n\n      animateTo({ start: newStart, end: newEnd });\n    },\n    [\n      animateTo,\n      setActiveSpan,\n      clearActiveSpan,\n      activeSpanId,\n      trace.spans,\n      root.startTime,\n      root.duration,\n    ]\n  );\n\n  const [altHeld, setAltHeld] = useState(false);\n\n  useEffect(() => {\n    const onKeyDown = (e: KeyboardEvent): void => {\n      if (e.key === 'Escape') {\n        clearActiveSpan();\n      }\n      if (e.key === 'Alt') {\n        e.preventDefault();\n        setAltHeld(true);\n      }\n    };\n    const onKeyUp = (e: KeyboardEvent): void => {\n      if (e.key === 'Alt') setAltHeld(false);\n    };\n    const onBlur = (): void => setAltHeld(false);\n\n    window.addEventListener('keydown', onKeyDown);\n    window.addEventListener('keyup', onKeyUp);\n    window.addEventListener('blur', onBlur);\n    return () => {\n      window.removeEventListener('keydown', onKeyDown);\n      window.removeEventListener('keyup', onKeyUp);\n      window.removeEventListener('blur', onBlur);\n    };\n  }, [clearActiveSpan]);\n\n  const timelineRef = useRef<HTMLDivElement>(null);\n  const [hoverFraction, setHoverFraction] = useState<number | null>(null);\n\n  const hoverInfo = useMemo(() => {\n    if (hoverFraction == null) return null;\n    const absTime = viewport.start + hoverFraction * viewDuration;\n    const offset = absTime - root.startTime;\n    return { fraction: hoverFraction, label: formatDuration(offset, true) };\n  }, [hoverFraction, viewport.start, viewDuration, root.startTime]);\n\n  const handleTimelineMouseMove = useCallback(\n    (e: React.MouseEvent<HTMLDivElement>) => {\n      const el = timelineRef.current;\n      if (!el) return;\n      const rect = el.getBoundingClientRect();\n      const contentWidth = rect.width - TIMELINE_PADDING_PX * 2;\n      if (contentWidth <= 0) return;\n      const fraction = Math.max(\n        0,\n        Math.min(\n          1,\n          (e.clientX - rect.left - TIMELINE_PADDING_PX) / contentWidth\n        )\n      );\n      setHoverFraction(fraction);\n    },\n    []\n  );\n\n  const handleTimelineMouseLeave = useCallback(() => {\n    setHoverFraction(null);\n  }, []);\n\n  useEffect(() => {\n    const el = timelineRef.current;\n    if (!el) return;\n\n    const rootS = root.startTime;\n    const rootE = root.startTime + root.duration;\n    const rootD = root.duration;\n    if (rootD <= 0) return;\n\n    const onWheel = (e: WheelEvent): void => {\n      const isZoomGesture = e.ctrlKey || e.metaKey;\n      const hasDeltaX = Math.abs(e.deltaX) > Math.abs(e.deltaY);\n\n      if (!isZoomGesture && !hasDeltaX) return;\n      e.preventDefault();\n\n      const rect = el.getBoundingClientRect();\n      const contentWidth = rect.width - TIMELINE_PADDING_PX * 2;\n      if (contentWidth <= 0) return;\n\n      if (isZoomGesture) {\n        let dy = e.deltaY;\n        if (e.deltaMode === 1) dy *= 16;\n\n        const cursorFraction = Math.max(\n          0,\n          Math.min(\n            1,\n            (e.clientX - rect.left - TIMELINE_PADDING_PX) / contentWidth\n          )\n        );\n        const scaleFactor = Math.pow(2, dy / 200);\n\n        setViewport((prev) => {\n          const prevDuration = prev.end - prev.start;\n          const cursorTime = prev.start + cursorFraction * prevDuration;\n          const newDuration = Math.max(\n            MIN_VIEWPORT_MS,\n            Math.min(rootD, prevDuration * scaleFactor)\n          );\n\n          let newStart = cursorTime - cursorFraction * newDuration;\n          let newEnd = newStart + newDuration;\n\n          if (newStart < rootS) {\n            newStart = rootS;\n            newEnd = rootS + newDuration;\n          }\n          if (newEnd > rootE) {\n            newEnd = rootE;\n            newStart = Math.max(rootS, rootE - newDuration);\n          }\n\n          return { start: newStart, end: newEnd };\n        });\n      } else {\n        let dx = e.deltaX;\n        if (e.deltaMode === 1) dx *= 16;\n\n        setViewport((prev) => {\n          const prevDuration = prev.end - prev.start;\n          const panAmount = (dx / contentWidth) * prevDuration;\n\n          let newStart = prev.start + panAmount;\n          let newEnd = prev.end + panAmount;\n\n          if (newStart < rootS) {\n            newStart = rootS;\n            newEnd = rootS + prevDuration;\n          }\n          if (newEnd > rootE) {\n            newEnd = rootE;\n            newStart = Math.max(rootS, rootE - prevDuration);\n          }\n\n          return { start: newStart, end: newEnd };\n        });\n      }\n    };\n\n    el.addEventListener('wheel', onWheel, { passive: false });\n    return () => el.removeEventListener('wheel', onWheel);\n  }, [root.startTime, root.duration]);\n\n  // Derive the selected span name and metadata for the panel header\n  const selectedSpanName = useMemo(() => {\n    if (!selectedSpan?.data) return 'Details';\n    const data = selectedSpan.data as Record<string, unknown>;\n    const stepName = data.stepName as string | undefined;\n    const workflowName = data.workflowName as string | undefined;\n    return (\n      (stepName ? parseStepName(stepName)?.shortName : undefined) ??\n      (workflowName ? parseWorkflowName(workflowName)?.shortName : undefined) ??\n      stepName ??\n      workflowName ??\n      (data.hookId as string) ??\n      'Details'\n    );\n  }, [selectedSpan?.data]);\n\n  const selectedResource = selectedSpan?.resource as string | undefined;\n  const selectedResourceId = useMemo(() => {\n    if (!selectedSpan?.data) return undefined;\n    const data = selectedSpan.data as Record<string, unknown>;\n    return (\n      (data.stepId as string) ??\n      (data.runId as string) ??\n      (data.hookId as string) ??\n      selectedSpan.spanId\n    );\n  }, [selectedSpan?.data, selectedSpan?.spanId]);\n\n  return (\n    <div\n      data-pane='pane-root'\n      data-has-detail={activeSpan ? '' : undefined}\n      className='grid w-full h-full max-h-full grid-cols-[minmax(100px,1fr)] data-[has-detail]:grid-cols-[minmax(100px,1fr)_clamp(280px,420px,100%)]'\n    >\n      <div\n        id='trace-parent'\n        className='grid grid-rows-[1fr] h-full min-h-0 overflow-hidden relative bg-background-100'\n      >\n        <SplitPane\n          startHeader={\n            <div className='bg-background-100 border-b border-gray-alpha-400 h-10 min-h-10 flex items-center px-2 gap-1.5'>\n              <Search className='w-3.5 h-3.5 shrink-0 text-gray-800' />\n              <input\n                id='trace-viewer-search'\n                name='trace-viewer-search'\n                type='text'\n                value={searchQuery}\n                onChange={(e) => setSearchQuery(e.target.value)}\n                placeholder='Search spans...'\n                aria-label='Search spans'\n                className='flex-1 min-w-0 bg-transparent text-sm text-gray-1000 placeholder:text-gray-800 outline-none'\n              />\n              {searchQuery && (\n                <button\n                  type='button'\n                  onClick={() => setSearchQuery('')}\n                  className='shrink-0 p-0.5 rounded-sm text-gray-800 hover:text-gray-1000 hover:bg-gray-200 transition-colors'\n                >\n                  <X className='w-3 h-3' />\n                </button>\n              )}\n            </div>\n          }\n          endHeader={\n            <TimelineHeader markers={timeMarkers} hoverInfo={hoverInfo} />\n          }\n        >\n          <div className='block overflow-visible'>\n            <EventList\n              spans={filteredSpans}\n              activeSpanId={activeSpanId}\n              onSelectSpan={handleSelectSpan}\n            />\n          </div>\n          <div\n            ref={timelineRef}\n            className='block min-h-0 overflow-visible relative'\n            onDoubleClick={resetZoom}\n            onMouseMove={handleTimelineMouseMove}\n            onMouseLeave={handleTimelineMouseLeave}\n          >\n            <Timeline\n              spans={filteredSpans}\n              viewStart={viewport.start}\n              viewEnd={viewport.end}\n              markers={timeMarkers}\n              selectedId={activeSpanId}\n              onSelect={handleSelectSpan}\n              hoverFraction={hoverFraction}\n              altHeld={altHeld}\n            />\n          </div>\n        </SplitPane>\n        <div className='absolute right-3 bottom-3 z-[5] flex items-center border border-gray-alpha-400 rounded-lg bg-background-100 shadow-sm overflow-hidden divide-x divide-gray-alpha-400'>\n          <button\n            type='button'\n            className='flex items-center justify-center w-8 h-8 text-gray-900 cursor-pointer transition-colors duration-[120ms] ease-in-out hover:text-gray-1000 hover:bg-gray-alpha-100'\n            onClick={zoomOut}\n            aria-label='Zoom out'\n          >\n            <ZoomOut className='w-4 h-4' />\n          </button>\n          <button\n            type='button'\n            className='flex items-center justify-center w-8 h-8 text-gray-900 cursor-pointer transition-colors duration-[120ms] ease-in-out hover:text-gray-1000 hover:bg-gray-alpha-100'\n            onClick={resetZoom}\n            aria-label='Reset zoom'\n          >\n            <RotateCcw className='w-3.5 h-3.5' />\n          </button>\n          <button\n            type='button'\n            className='flex items-center justify-center w-8 h-8 text-gray-900 cursor-pointer transition-colors duration-[120ms] ease-in-out hover:text-gray-1000 hover:bg-gray-alpha-100'\n            onClick={zoomIn}\n            aria-label='Zoom in'\n          >\n            <ZoomIn className='w-4 h-4' />\n          </button>\n        </div>\n      </div>\n\n      {/* Detail panel */}\n      {activeSpan && sidebar ? (\n        <aside className='flex flex-col h-full max-h-full bg-background-100 border-l border-gray-alpha-400 overflow-auto'>\n          {/* Panel header */}\n          <div className='flex-shrink-0 px-4 pt-4 pb-3'>\n            <div className='flex items-start justify-between gap-2'>\n              <div className='min-w-0 flex-1'>\n                <span className='text-[15px] font-semibold text-gray-1000 truncate block'>\n                  {selectedSpanName}\n                </span>\n                {selectedResourceId && (\n                  <div className='mt-1 flex items-center gap-2'>\n                    {selectedResource && (\n                      <span\n                        className={`inline-flex items-center rounded-md px-1.5 py-0.5 text-[11px] font-medium leading-none shrink-0 ${\n                          selectedResource === 'step'\n                            ? 'bg-green-200 text-green-900'\n                            : selectedResource === 'run'\n                              ? 'bg-blue-200 text-blue-900'\n                              : selectedResource === 'hook'\n                                ? 'bg-yellow-200 text-yellow-900'\n                                : 'bg-gray-200 text-gray-900'\n                        }`}\n                      >\n                        {selectedResource.charAt(0).toUpperCase() +\n                          selectedResource.slice(1)}\n                      </span>\n                    )}\n                    <div\n                      className='flex items-center gap-1 text-[13px] font-mono text-gray-700 min-w-0'\n                      title={selectedResourceId}\n                    >\n                      <span className='truncate'>{selectedResourceId}</span>\n                      <CopyButton\n                        copyText={selectedResourceId}\n                        ariaLabel='Copy ID'\n                        className='shrink-0'\n                      />\n                    </div>\n                  </div>\n                )}\n              </div>\n              <button\n                type='button'\n                className='p-1 rounded-md text-gray-900 hover:text-gray-1000 hover:bg-gray-alpha-200 transition-colors shrink-0'\n                onClick={clearActiveSpan}\n              >\n                <X className='w-4 h-4' />\n              </button>\n            </div>\n          </div>\n          {/* Panel body */}\n          <div className='flex-1 overflow-y-auto'>\n            <ErrorBoundary>\n              <EntityDetailPanel\n                run={sidebar.run}\n                onStreamClick={sidebar.onStreamClick}\n                onRunClick={sidebar.onRunClick}\n                spanDetailData={sidebar.spanDetailData}\n                spanDetailError={sidebar.spanDetailError}\n                spanDetailLoading={sidebar.spanDetailLoading}\n                onSpanSelect={sidebar.onSpanSelect}\n                onWakeUpSleep={sidebar.onWakeUpSleep}\n                onLoadEventData={sidebar.onLoadEventData}\n                onResolveHook={sidebar.onResolveHook}\n                encryptionKey={sidebar.encryptionKey}\n                onDecrypt={sidebar.onDecrypt}\n                isDecrypting={sidebar.isDecrypting}\n                selectedSpan={selectedSpan}\n              />\n            </ErrorBoundary>\n          </div>\n        </aside>\n      ) : activeSpan ? (\n        <DetailPanel\n          span={activeSpan}\n          rootStart={root.startTime}\n          onClose={clearActiveSpan}\n        />\n      ) : null}\n    </div>\n  );\n}\n"]}
+{"version":3,"file":"trace-viewer.js","sourceRoot":"","sources":["../../../src/components/new-trace-viewer/trace-viewer.tsx"],"names":[],"mappings":"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","sourcesContent":["'use client';\n\nimport { parseStepName, parseWorkflowName } from '@workflow/utils/parse-name';\nimport { RotateCcw, Search, X, ZoomIn, ZoomOut } from 'lucide-react';\nimport {\n  type ReactNode,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport { ErrorBoundary } from '../error-boundary';\nimport {\n  EntityDetailPanel,\n  type SelectedSpanInfo,\n} from '../sidebar/entity-detail-panel';\nimport { useSidebarDataOptional } from '../sidebar/sidebar-data-context';\nimport type { Trace } from '../trace-viewer/types';\nimport { formatDuration, getHighResInMs } from '../trace-viewer/util/timing';\nimport { CopyButton } from './components/copy-button';\nimport EventList from './components/event-list';\nimport { SplitPane } from './components/split-pane';\nimport {\n  Timeline,\n  TimelineHeader,\n  TIMELINE_PADDING_PX,\n} from './components/timeline';\nimport { ActiveSpanProvider, useActiveSpan } from './context';\nimport { DetailPanel } from './detail-panel';\nimport { computeRootBounds, computeTimeMarkers } from './utils';\n\ninterface NewTraceViewerProps {\n  trace: Trace;\n}\n\nconst MIN_VIEWPORT_MS = 0.001;\n\ninterface Viewport {\n  start: number;\n  end: number;\n}\n\nfunction useAnimatedViewport(initial: Viewport) {\n  const [viewport, setViewportState] = useState<Viewport>(initial);\n  const animRef = useRef<{\n    raf: number;\n    from: Viewport;\n    to: Viewport;\n    start: number;\n  } | null>(null);\n  const currentRef = useRef(initial);\n  currentRef.current = viewport;\n\n  const cancel = useCallback(() => {\n    if (animRef.current) {\n      cancelAnimationFrame(animRef.current.raf);\n      animRef.current = null;\n    }\n  }, []);\n\n  const animateTo = useCallback(\n    (target: Viewport) => {\n      cancel();\n      const from = currentRef.current;\n      const anim = { raf: 0, from, to: target, start: performance.now() };\n\n      const tick = () => {\n        const t = Math.min((performance.now() - anim.start) / 150, 1);\n        const e = 1 - (1 - t) * (1 - t);\n        setViewportState({\n          start: anim.from.start + (anim.to.start - anim.from.start) * e,\n          end: anim.from.end + (anim.to.end - anim.from.end) * e,\n        });\n        if (t < 1) anim.raf = requestAnimationFrame(tick);\n        else animRef.current = null;\n      };\n\n      animRef.current = anim;\n      anim.raf = requestAnimationFrame(tick);\n    },\n    [cancel]\n  );\n\n  const setViewport = useCallback(\n    (update: Viewport | ((prev: Viewport) => Viewport)) => {\n      cancel();\n      if (typeof update === 'function') {\n        setViewportState((prev) => {\n          const next = update(prev);\n          currentRef.current = next;\n          return next;\n        });\n      } else {\n        currentRef.current = update;\n        setViewportState(update);\n      }\n    },\n    [cancel]\n  );\n\n  useEffect(() => cancel, [cancel]);\n\n  return { viewport, setViewport, animateTo };\n}\n\n// ---------------------------------------------------------------------------\n// Hook: bridge ActiveSpanContext + SidebarDataContext → SelectedSpanInfo\n// ---------------------------------------------------------------------------\n\nfunction useSelectedSpanInfo(): SelectedSpanInfo | null {\n  const { activeSpan } = useActiveSpan();\n  const sidebar = useSidebarDataOptional();\n\n  return useMemo(() => {\n    if (!activeSpan || !sidebar) return null;\n\n    const correlationId = activeSpan.spanId;\n    const rawEvents = correlationId\n      ? sidebar.events.filter((e) => e.correlationId === correlationId)\n      : [];\n\n    return {\n      data: activeSpan.attributes?.data,\n      resource: activeSpan.attributes?.resource as string | undefined,\n      spanId: activeSpan.spanId,\n      rawEvents,\n    };\n  }, [activeSpan, sidebar?.events]);\n}\n\n// ---------------------------------------------------------------------------\n// Root component\n// ---------------------------------------------------------------------------\n\nexport function NewTraceViewer({ trace }: NewTraceViewerProps): ReactNode {\n  return (\n    <ActiveSpanProvider spans={trace.spans}>\n      <NewTraceViewerContent trace={trace} />\n    </ActiveSpanProvider>\n  );\n}\n\nfunction NewTraceViewerContent({ trace }: NewTraceViewerProps): ReactNode {\n  const { activeSpan, activeSpanId, setActiveSpan, clearActiveSpan } =\n    useActiveSpan();\n\n  const sidebar = useSidebarDataOptional();\n  const selectedSpan = useSelectedSpanInfo();\n\n  const [searchQuery, setSearchQuery] = useState('');\n\n  const filteredSpans = useMemo(() => {\n    const q = searchQuery.trim().toLowerCase();\n    if (!q) return trace.spans;\n    return trace.spans.filter(\n      (s) =>\n        s.name.toLowerCase().includes(q) || s.resource.toLowerCase().includes(q)\n    );\n  }, [trace.spans, searchQuery]);\n\n  const root = useMemo(() => computeRootBounds(trace.spans), [trace.spans]);\n\n  const { viewport, setViewport, animateTo } = useAnimatedViewport({\n    start: root.startTime,\n    end: root.startTime + root.duration,\n  });\n\n  const prevRootRef = useRef<Viewport>({\n    start: root.startTime,\n    end: root.startTime + root.duration,\n  });\n\n  useEffect(() => {\n    const prevRoot = prevRootRef.current;\n    const newStart = root.startTime;\n    const newEnd = root.startTime + root.duration;\n\n    setViewport((prev) => {\n      const wasAtFullExtent =\n        Math.abs(prev.start - prevRoot.start) < 0.01 &&\n        Math.abs(prev.end - prevRoot.end) < 0.01;\n\n      if (wasAtFullExtent) {\n        return { start: newStart, end: newEnd };\n      }\n      return prev;\n    });\n\n    prevRootRef.current = { start: newStart, end: newEnd };\n  }, [root.startTime, root.duration]);\n\n  const viewDuration = viewport.end - viewport.start;\n\n  const timeMarkers = useMemo(\n    () => computeTimeMarkers(viewDuration, viewport.start - root.startTime),\n    [viewDuration, viewport.start, root.startTime]\n  );\n\n  const resetZoom = useCallback(() => {\n    animateTo({ start: root.startTime, end: root.startTime + root.duration });\n  }, [animateTo, root.startTime, root.duration]);\n\n  const ZOOM_FACTOR = 0.5;\n\n  const zoomBy = useCallback(\n    (factor: number) => {\n      const rootS = root.startTime;\n      const rootE = root.startTime + root.duration;\n      const rootD = root.duration;\n\n      setViewport((prev) => {\n        const prevDuration = prev.end - prev.start;\n        const center = (prev.start + prev.end) / 2;\n        const newDuration = Math.max(\n          MIN_VIEWPORT_MS,\n          Math.min(rootD, prevDuration * factor)\n        );\n        let newStart = center - newDuration / 2;\n        let newEnd = center + newDuration / 2;\n\n        if (newStart < rootS) {\n          newStart = rootS;\n          newEnd = rootS + newDuration;\n        }\n        if (newEnd > rootE) {\n          newEnd = rootE;\n          newStart = Math.max(rootS, rootE - newDuration);\n        }\n\n        return { start: newStart, end: newEnd };\n      });\n    },\n    [setViewport, root.startTime, root.duration]\n  );\n\n  const zoomIn = useCallback(() => zoomBy(ZOOM_FACTOR), [zoomBy]);\n  const zoomOut = useCallback(() => zoomBy(1 / ZOOM_FACTOR), [zoomBy]);\n\n  const handleSelectSpan = useCallback(\n    (spanId: string) => {\n      if (spanId === activeSpanId) {\n        clearActiveSpan();\n        return;\n      }\n      setActiveSpan(spanId);\n\n      const span = trace.spans.find((s) => s.spanId === spanId);\n      if (!span) return;\n\n      const spanStart = getHighResInMs(span.startTime);\n      const spanEnd = getHighResInMs(span.endTime);\n      const spanDuration = spanEnd - spanStart;\n\n      const rootS = root.startTime;\n      const rootE = root.startTime + root.duration;\n      const rootD = root.duration;\n\n      if (spanDuration > rootD * 0.8) {\n        animateTo({ start: rootS, end: rootE });\n        return;\n      }\n\n      const padding = Math.max(spanDuration * 0.2, MIN_VIEWPORT_MS / 2);\n      let newStart = spanStart - padding;\n      let newEnd = spanEnd + padding;\n\n      if (newEnd - newStart < MIN_VIEWPORT_MS) {\n        const center = (spanStart + spanEnd) / 2;\n        newStart = center - MIN_VIEWPORT_MS / 2;\n        newEnd = center + MIN_VIEWPORT_MS / 2;\n      }\n\n      if (newStart < rootS) {\n        const duration = newEnd - newStart;\n        newStart = rootS;\n        newEnd = Math.min(rootE, rootS + duration);\n      }\n      if (newEnd > rootE) {\n        const duration = newEnd - newStart;\n        newEnd = rootE;\n        newStart = Math.max(rootS, rootE - duration);\n      }\n\n      animateTo({ start: newStart, end: newEnd });\n    },\n    [\n      animateTo,\n      setActiveSpan,\n      clearActiveSpan,\n      activeSpanId,\n      trace.spans,\n      root.startTime,\n      root.duration,\n    ]\n  );\n\n  const [altHeld, setAltHeld] = useState(false);\n\n  useEffect(() => {\n    const onKeyDown = (e: KeyboardEvent): void => {\n      if (e.key === 'Escape') {\n        clearActiveSpan();\n      }\n      if (e.key === 'Alt') {\n        e.preventDefault();\n        setAltHeld(true);\n      }\n    };\n    const onKeyUp = (e: KeyboardEvent): void => {\n      if (e.key === 'Alt') setAltHeld(false);\n    };\n    const onBlur = (): void => setAltHeld(false);\n\n    window.addEventListener('keydown', onKeyDown);\n    window.addEventListener('keyup', onKeyUp);\n    window.addEventListener('blur', onBlur);\n    return () => {\n      window.removeEventListener('keydown', onKeyDown);\n      window.removeEventListener('keyup', onKeyUp);\n      window.removeEventListener('blur', onBlur);\n    };\n  }, [clearActiveSpan]);\n\n  const timelineRef = useRef<HTMLDivElement>(null);\n  const [hoverFraction, setHoverFraction] = useState<number | null>(null);\n\n  const hoverInfo = useMemo(() => {\n    if (hoverFraction == null) return null;\n    const absTime = viewport.start + hoverFraction * viewDuration;\n    const offset = absTime - root.startTime;\n    return { fraction: hoverFraction, label: formatDuration(offset, true) };\n  }, [hoverFraction, viewport.start, viewDuration, root.startTime]);\n\n  const handleTimelineMouseMove = useCallback(\n    (e: React.MouseEvent<HTMLDivElement>) => {\n      const el = timelineRef.current;\n      if (!el) return;\n      const rect = el.getBoundingClientRect();\n      const contentWidth = rect.width - TIMELINE_PADDING_PX * 2;\n      if (contentWidth <= 0) return;\n      const fraction = Math.max(\n        0,\n        Math.min(\n          1,\n          (e.clientX - rect.left - TIMELINE_PADDING_PX) / contentWidth\n        )\n      );\n      setHoverFraction(fraction);\n    },\n    []\n  );\n\n  const handleTimelineMouseLeave = useCallback(() => {\n    setHoverFraction(null);\n  }, []);\n\n  useEffect(() => {\n    const el = timelineRef.current;\n    if (!el) return;\n\n    const rootS = root.startTime;\n    const rootE = root.startTime + root.duration;\n    const rootD = root.duration;\n    if (rootD <= 0) return;\n\n    const onWheel = (e: WheelEvent): void => {\n      const isZoomGesture = e.ctrlKey || e.metaKey;\n      const hasDeltaX = Math.abs(e.deltaX) > Math.abs(e.deltaY);\n\n      if (!isZoomGesture && !hasDeltaX) return;\n      e.preventDefault();\n\n      const rect = el.getBoundingClientRect();\n      const contentWidth = rect.width - TIMELINE_PADDING_PX * 2;\n      if (contentWidth <= 0) return;\n\n      if (isZoomGesture) {\n        let dy = e.deltaY;\n        if (e.deltaMode === 1) dy *= 16;\n\n        const cursorFraction = Math.max(\n          0,\n          Math.min(\n            1,\n            (e.clientX - rect.left - TIMELINE_PADDING_PX) / contentWidth\n          )\n        );\n        const scaleFactor = Math.pow(2, dy / 200);\n\n        setViewport((prev) => {\n          const prevDuration = prev.end - prev.start;\n          const cursorTime = prev.start + cursorFraction * prevDuration;\n          const newDuration = Math.max(\n            MIN_VIEWPORT_MS,\n            Math.min(rootD, prevDuration * scaleFactor)\n          );\n\n          let newStart = cursorTime - cursorFraction * newDuration;\n          let newEnd = newStart + newDuration;\n\n          if (newStart < rootS) {\n            newStart = rootS;\n            newEnd = rootS + newDuration;\n          }\n          if (newEnd > rootE) {\n            newEnd = rootE;\n            newStart = Math.max(rootS, rootE - newDuration);\n          }\n\n          return { start: newStart, end: newEnd };\n        });\n      } else {\n        let dx = e.deltaX;\n        if (e.deltaMode === 1) dx *= 16;\n\n        setViewport((prev) => {\n          const prevDuration = prev.end - prev.start;\n          const panAmount = (dx / contentWidth) * prevDuration;\n\n          let newStart = prev.start + panAmount;\n          let newEnd = prev.end + panAmount;\n\n          if (newStart < rootS) {\n            newStart = rootS;\n            newEnd = rootS + prevDuration;\n          }\n          if (newEnd > rootE) {\n            newEnd = rootE;\n            newStart = Math.max(rootS, rootE - prevDuration);\n          }\n\n          return { start: newStart, end: newEnd };\n        });\n      }\n    };\n\n    el.addEventListener('wheel', onWheel, { passive: false });\n    return () => el.removeEventListener('wheel', onWheel);\n  }, [root.startTime, root.duration]);\n\n  // Derive the selected span name and metadata for the panel header\n  const selectedSpanName = useMemo(() => {\n    if (!selectedSpan?.data) return 'Details';\n    const data = selectedSpan.data as Record<string, unknown>;\n    if (selectedSpan.resource === 'hook') {\n      return (data.token as string | undefined) ?? (data.hookId as string);\n    }\n\n    const stepName = data.stepName as string | undefined;\n    const workflowName = data.workflowName as string | undefined;\n    return (\n      (stepName ? parseStepName(stepName)?.shortName : undefined) ??\n      (workflowName ? parseWorkflowName(workflowName)?.shortName : undefined) ??\n      stepName ??\n      workflowName ??\n      (data.hookId as string) ??\n      'Details'\n    );\n  }, [selectedSpan?.data, selectedSpan?.resource]);\n\n  const selectedResource = selectedSpan?.resource as string | undefined;\n  const selectedResourceId = useMemo(() => {\n    if (!selectedSpan?.data) return undefined;\n    const data = selectedSpan.data as Record<string, unknown>;\n    if (selectedSpan.resource === 'hook') {\n      return (data.hookId as string | undefined) ?? selectedSpan.spanId;\n    }\n\n    return (\n      (data.stepId as string) ??\n      (data.runId as string) ??\n      (data.hookId as string) ??\n      selectedSpan.spanId\n    );\n  }, [selectedSpan?.data, selectedSpan?.resource, selectedSpan?.spanId]);\n\n  return (\n    <div\n      data-pane=\"pane-root\"\n      data-has-detail={activeSpan ? '' : undefined}\n      className=\"grid w-full h-full max-h-full grid-cols-[minmax(100px,1fr)] data-[has-detail]:grid-cols-[minmax(100px,1fr)_clamp(280px,420px,100%)]\"\n    >\n      <div\n        id=\"trace-parent\"\n        className=\"grid grid-rows-[1fr] h-full min-h-0 overflow-hidden relative bg-background-100\"\n      >\n        <SplitPane\n          startHeader={\n            <div className=\"bg-background-100 border-b border-gray-alpha-400 h-10 min-h-10 flex items-center px-2 gap-1.5\">\n              <Search className=\"w-3.5 h-3.5 shrink-0 text-gray-800\" />\n              <input\n                id=\"trace-viewer-search\"\n                name=\"trace-viewer-search\"\n                type=\"text\"\n                value={searchQuery}\n                onChange={(e) => setSearchQuery(e.target.value)}\n                placeholder=\"Search spans...\"\n                aria-label=\"Search spans\"\n                className=\"flex-1 min-w-0 bg-transparent text-sm text-gray-1000 placeholder:text-gray-800 outline-none\"\n              />\n              {searchQuery && (\n                <button\n                  type=\"button\"\n                  onClick={() => setSearchQuery('')}\n                  className=\"shrink-0 p-0.5 rounded-sm text-gray-800 hover:text-gray-1000 hover:bg-gray-200 transition-colors\"\n                >\n                  <X className=\"w-3 h-3\" />\n                </button>\n              )}\n            </div>\n          }\n          endHeader={\n            <TimelineHeader markers={timeMarkers} hoverInfo={hoverInfo} />\n          }\n        >\n          <div className=\"block overflow-visible\">\n            <EventList\n              spans={filteredSpans}\n              activeSpanId={activeSpanId}\n              onSelectSpan={handleSelectSpan}\n            />\n          </div>\n          <div\n            ref={timelineRef}\n            className=\"block min-h-0 overflow-visible relative\"\n            onDoubleClick={resetZoom}\n            onMouseMove={handleTimelineMouseMove}\n            onMouseLeave={handleTimelineMouseLeave}\n          >\n            <Timeline\n              spans={filteredSpans}\n              viewStart={viewport.start}\n              viewEnd={viewport.end}\n              markers={timeMarkers}\n              selectedId={activeSpanId}\n              onSelect={handleSelectSpan}\n              hoverFraction={hoverFraction}\n              altHeld={altHeld}\n            />\n          </div>\n        </SplitPane>\n        <div className=\"absolute right-3 bottom-3 z-[5] flex items-center border border-gray-alpha-400 rounded-lg bg-background-100 shadow-sm overflow-hidden divide-x divide-gray-alpha-400\">\n          <button\n            type=\"button\"\n            className=\"flex items-center justify-center w-8 h-8 text-gray-900 cursor-pointer transition-colors duration-[120ms] ease-in-out hover:text-gray-1000 hover:bg-gray-alpha-100\"\n            onClick={zoomOut}\n            aria-label=\"Zoom out\"\n          >\n            <ZoomOut className=\"w-4 h-4\" />\n          </button>\n          <button\n            type=\"button\"\n            className=\"flex items-center justify-center w-8 h-8 text-gray-900 cursor-pointer transition-colors duration-[120ms] ease-in-out hover:text-gray-1000 hover:bg-gray-alpha-100\"\n            onClick={resetZoom}\n            aria-label=\"Reset zoom\"\n          >\n            <RotateCcw className=\"w-3.5 h-3.5\" />\n          </button>\n          <button\n            type=\"button\"\n            className=\"flex items-center justify-center w-8 h-8 text-gray-900 cursor-pointer transition-colors duration-[120ms] ease-in-out hover:text-gray-1000 hover:bg-gray-alpha-100\"\n            onClick={zoomIn}\n            aria-label=\"Zoom in\"\n          >\n            <ZoomIn className=\"w-4 h-4\" />\n          </button>\n        </div>\n      </div>\n\n      {/* Detail panel */}\n      {activeSpan && sidebar ? (\n        <aside className=\"flex flex-col h-full max-h-full bg-background-100 border-l border-gray-alpha-400 overflow-auto\">\n          {/* Panel header */}\n          <div className=\"flex-shrink-0 px-4 pt-4 pb-3\">\n            <div className=\"flex items-start justify-between gap-2\">\n              <div className=\"min-w-0 flex-1\">\n                <span className=\"text-[15px] font-semibold text-gray-1000 truncate block\">\n                  {selectedSpanName}\n                </span>\n                {selectedResourceId && (\n                  <div className=\"mt-1 flex items-center gap-2\">\n                    {selectedResource && (\n                      <span\n                        className={`inline-flex items-center rounded-md px-1.5 py-0.5 text-[11px] font-medium leading-none shrink-0 ${\n                          selectedResource === 'step'\n                            ? 'bg-green-200 text-green-900'\n                            : selectedResource === 'run'\n                              ? 'bg-blue-200 text-blue-900'\n                              : selectedResource === 'hook'\n                                ? 'bg-yellow-200 text-yellow-900'\n                                : 'bg-gray-200 text-gray-900'\n                        }`}\n                      >\n                        {selectedResource.charAt(0).toUpperCase() +\n                          selectedResource.slice(1)}\n                      </span>\n                    )}\n                    <div\n                      className=\"flex items-center gap-1 text-[13px] font-mono text-gray-700 min-w-0\"\n                      title={selectedResourceId}\n                    >\n                      <span className=\"truncate\">{selectedResourceId}</span>\n                      <CopyButton\n                        copyText={selectedResourceId}\n                        ariaLabel=\"Copy ID\"\n                        className=\"shrink-0\"\n                      />\n                    </div>\n                  </div>\n                )}\n              </div>\n              <button\n                type=\"button\"\n                className=\"p-1 rounded-md text-gray-900 hover:text-gray-1000 hover:bg-gray-alpha-200 transition-colors shrink-0\"\n                onClick={clearActiveSpan}\n              >\n                <X className=\"w-4 h-4\" />\n              </button>\n            </div>\n          </div>\n          {/* Panel body */}\n          <div className=\"flex-1 overflow-y-auto\">\n            <ErrorBoundary>\n              <EntityDetailPanel\n                run={sidebar.run}\n                onStreamClick={sidebar.onStreamClick}\n                onRunClick={sidebar.onRunClick}\n                spanDetailData={sidebar.spanDetailData}\n                spanDetailError={sidebar.spanDetailError}\n                spanDetailLoading={sidebar.spanDetailLoading}\n                onSpanSelect={sidebar.onSpanSelect}\n                onWakeUpSleep={sidebar.onWakeUpSleep}\n                onLoadEventData={sidebar.onLoadEventData}\n                onResolveHook={sidebar.onResolveHook}\n                encryptionKey={sidebar.encryptionKey}\n                onDecrypt={sidebar.onDecrypt}\n                isDecrypting={sidebar.isDecrypting}\n                selectedSpan={selectedSpan}\n              />\n            </ErrorBoundary>\n          </div>\n        </aside>\n      ) : activeSpan ? (\n        <DetailPanel\n          span={activeSpan}\n          rootStart={root.startTime}\n          onClose={clearActiveSpan}\n        />\n      ) : null}\n    </div>\n  );\n}\n"]}

package/dist/components/sidebar/attribute-panel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"attribute-panel.d.ts","sourceRoot":"","sources":["../../../src/components/sidebar/attribute-panel.tsx"],"names":[],"mappings":"AAwYA,eAAO,MAAM,oBAAoB,GAAI,OAAO,OAAO,KAAG,MAQrD,CAAC;AAoBF,UAAU,cAAc;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAmOD,eAAO,MAAM,cAAc,GAAI,mDAM5B;IACD,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,cAAc,CAAC;CAC1B,mDAiEA,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,uHAW5B;IACD,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC9B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,kDAAkD;IAClD,aAAa,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,+CAA+C;IAC/C,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,yEAAyE;IACzE,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,kDAAkD;IAClD,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,oFAAoF;IACpF,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,4CA2NA,CAAC"}
+{"version":3,"file":"attribute-panel.d.ts","sourceRoot":"","sources":["../../../src/components/sidebar/attribute-panel.tsx"],"names":[],"mappings":"AAwYA,eAAO,MAAM,oBAAoB,GAAI,OAAO,OAAO,KAAG,MAQrD,CAAC;AAoBF,UAAU,cAAc;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAwOD,eAAO,MAAM,cAAc,GAAI,mDAM5B;IACD,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,cAAc,CAAC;CAC1B,mDAiEA,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,uHAW5B;IACD,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC9B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,kDAAkD;IAClD,aAAa,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,+CAA+C;IAC/C,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,yEAAyE;IACzE,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,kDAAkD;IAClD,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,oFAAoF;IACpF,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,4CA2NA,CAAC"}

package/dist/components/sidebar/attribute-panel.js

@@ -264,6 +264,7 @@ const attributeToDisplayFn = {
     // Hook details
     token: (value) => String(value),
     isWebhook: (value) => String(value),
+    isSystem: (value) => String(value),
     receivedCount: (value) => String(value),
     lastReceivedAt: localMillisecondTimeOrNull,
     disposedAt: localMillisecondTimeOrNull,
@@ -367,6 +368,11 @@ const attributeToDisplayFn = {
             return null;
         return _jsx(DetailCard, { summary: "Event Data", children: JsonBlock(value) });
     },
+    errorCode: (value) => {
+        if (typeof value !== 'string' || value.length === 0)
+            return null;
+        return String(value);
+    },
 };
 const resolvableAttributes = [
     'input',