@mastra/playground-ui 60.2.0 → 61.0.0-alpha.1

package/dist/domains/traces/components/trace-data-panel-view.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"trace-data-panel-view.es.js","sources":["../../../../src/domains/traces/components/trace-data-panel-view.tsx"],"sourcesContent":["import {\n  ChartGanttIcon,\n  CircleGaugeIcon,\n  DownloadIcon,\n  Link2Icon,\n  ListTreeIcon,\n  Loader2Icon,\n  MessageSquareReplyIcon,\n  MessageSquareTextIcon,\n  MoreHorizontalIcon,\n  SaveIcon,\n  WrenchIcon,\n} from 'lucide-react';\nimport { useEffect, useMemo, useState } from 'react';\nimport type { ReactNode } from 'react';\nimport { getAllSpanIds } from '../hooks/get-all-span-ids';\nimport { useDownloadTraceJson } from '../hooks/use-download-trace-json';\nimport { useTraceSearch } from '../hooks/use-trace-search';\nimport type { TraceUsageSummary } from '../trace-list-columns';\nimport type { SearchableSpan } from '../types';\nimport { formatHierarchicalSpans } from './format-hierarchical-spans';\nimport { TraceIdButton } from './trace-id-button';\nimport { TraceSpanTimeline } from './trace-span-timeline';\nimport { TraceSpanTree } from './trace-span-tree';\nimport { TraceSummaryDescription } from './trace-summary-description';\nimport { Button } from '@/ds/components/Button';\nimport { ButtonsGroup } from '@/ds/components/ButtonsGroup';\nimport { DataPanel } from '@/ds/components/DataPanel';\nimport type { DataPanelProps } from '@/ds/components/DataPanel';\nimport { DropdownMenu } from '@/ds/components/DropdownMenu';\nimport { Notice } from '@/ds/components/Notice';\nimport { SearchInput } from '@/ds/components/SearchInput';\nimport { Tab, TabList, Tabs } from '@/ds/components/Tabs';\nimport { Icon } from '@/ds/icons/Icon';\nimport { ScorersIcon } from '@/ds/icons/ScorersIcon';\nimport type { LinkComponent } from '@/ds/types/link-component';\nimport { useScrollToFirstHighlight } from '@/hooks/use-scroll-to-first-highlight';\nimport { useTextHighlight } from '@/hooks/use-text-highlight';\nimport { cn } from '@/lib/utils';\n\nexport type TraceDataPanelPlacement = 'traces-list' | 'trace-page';\n\nexport type TraceSpanView = 'tree' | 'timeline';\n\n/** What the side column next to the span tree shows. */\nexport type TraceSideView = 'messages' | 'feedback' | 'scores';\n\nexport interface TraceDataPanelViewProps {\n  /** Keep the panel mounted and pass `undefined` to close it, so the drawer animates out. */\n  traceId?: string;\n  /** Lightweight spans for the trace. Caller fetches via useTraceLightSpans. */\n  spans: SearchableSpan[] | undefined;\n  isLoading?: boolean;\n  onClose: () => void;\n  onSpanSelect?: (spanId: string | undefined) => void;\n  onEvaluateTrace?: () => void;\n  /** When set, an \"Add full trace to dataset\" button appears; the consumer owns the dialog. */\n  onSaveAsDatasetItem?: (args: { traceId: string; rootSpanId: string | undefined }) => void;\n  /** When set, an \"Add tool mocks to item\" button appears; the consumer owns the dialog. */\n  onAddTraceMocksToItem?: (args: { traceId: string }) => void;\n  initialSpanId?: string | null;\n  onPrevious?: () => void;\n  onNext?: () => void;\n  /** Drawer width; defaults to `wide` since the panel lays out several columns. */\n  size?: DataPanelProps['size'];\n  /** Elevation when opened next to other sibling panels. */\n  depth?: DataPanelProps['depth'];\n  /** Rendered inside the drawer above the trace header (e.g. inbox feedback context). */\n  headerSlot?: ReactNode;\n  /** Accessible drawer name; defaults to the trace id. */\n  title?: string;\n  placement: TraceDataPanelPlacement;\n  /** @deprecated No longer used: the panel renders the span tree with the duration as text. */\n  timelineChartWidth?: 'wide' | 'default';\n  /** When both are provided, renders an \"Open trace page\" button. */\n  LinkComponent?: LinkComponent;\n  traceHref?: string;\n  /** When provided, the entity name in the trace summary links to the entity's page. */\n  entityHref?: string;\n  /** Token and estimated-cost totals shown in the compact trace summary. */\n  usage?: TraceUsageSummary;\n  /**\n   * Span treated as the displayed root of the timeline. Required for branch\n   * subtrees from `getBranch` where the anchor has a real parent that's outside\n   * `spans`. When omitted, the span with no parent is used (trace case).\n   */\n  anchorSpanId?: string;\n  /**\n   * Whether to render the \"Evaluating traces and saving them as dataset items is\n   * available in Mastra Studio\" info notice when neither `onEvaluateTrace` nor\n   * `onSaveAsDatasetItem` is provided. Defaults to `true`. Pass `false` when this\n   * panel is rendered inside Studio in a context that intentionally omits those\n   * handlers (e.g. inline below an experiment result).\n   */\n  showUnavailableFeaturesMsg?: boolean;\n  /**\n   * When provided, a \"Scores\" tab appears; the slot renders whatever trace-level\n   * scoring UI the consumer wants.\n   */\n  scoresTabSlot?: (args: { traceId: string; rootSpanId: string | undefined }) => ReactNode;\n  /** Optional count shown in the \"Scores\" tab label. */\n  scoresTabBadge?: ReactNode;\n  /**\n   * When provided, a \"Feedback\" tab appears; the slot renders the trace-level\n   * feedback UI. Trace feedback is not scoped to a span — the span panel owns that.\n   */\n  feedbackTabSlot?: (args: { traceId: string }) => ReactNode;\n  /** Optional count rendered after the \"Feedback\" tab label, e.g. `Feedback (3)`. */\n  feedbackTabBadge?: ReactNode;\n  /** Span ids to feature in the timeline; every other span is faded. */\n  featuredSpanIds?: string[];\n  /**\n   * The \"Messages\" view of the side column next to the span tree (typically the\n   * trace as one reconstructed agent turn). Rendered without content padding.\n   */\n  messagesPanelSlot?: ReactNode;\n  /** Controlled span view (tree or timeline); falls back to local state starting on the tree. */\n  spanView?: TraceSpanView;\n  onSpanViewChange?: (view: TraceSpanView) => void;\n  /** Controlled side column view; falls back to the first available view. */\n  sideView?: TraceSideView;\n  onSideViewChange?: (view: TraceSideView) => void;\n  /**\n   * Rendered as a column to the right of the timeline inside the same card;\n   * typically the span detail.\n   */\n  spanPanelSlot?: ReactNode;\n}\n\nexport function TraceDataPanelView({\n  traceId,\n  spans,\n  isLoading,\n  onClose,\n  onSpanSelect,\n  onEvaluateTrace,\n  onSaveAsDatasetItem,\n  onAddTraceMocksToItem,\n  initialSpanId,\n  onPrevious,\n  onNext,\n  size = 'wide',\n  depth,\n  headerSlot,\n  title,\n  placement,\n  LinkComponent,\n  traceHref,\n  entityHref,\n  usage,\n  anchorSpanId,\n  showUnavailableFeaturesMsg = true,\n  scoresTabSlot,\n  scoresTabBadge,\n  feedbackTabSlot,\n  feedbackTabBadge,\n  featuredSpanIds,\n  messagesPanelSlot,\n  sideView: controlledSideView,\n  onSideViewChange,\n  spanView: controlledSpanView,\n  onSpanViewChange,\n  spanPanelSlot,\n}: TraceDataPanelViewProps) {\n  const isOnTracePage = placement === 'trace-page';\n\n  // The side column next to the span tree hosts Messages / Feedback / Scores;\n  // which one is shown is purely a local viewing choice.\n  const sideViews = useMemo(() => {\n    const views: Array<{ value: TraceSideView; label: ReactNode }> = [];\n    if (messagesPanelSlot) {\n      views.push({\n        value: 'messages',\n        label: (\n          <>\n            <Icon size=\"xs\">\n              <MessageSquareTextIcon />\n            </Icon>\n            Messages\n          </>\n        ),\n      });\n    }\n    if (feedbackTabSlot) {\n      views.push({\n        value: 'feedback',\n        label: (\n          <>\n            <Icon size=\"xs\">\n              <MessageSquareReplyIcon />\n            </Icon>\n            Feedback{feedbackTabBadge != null && <> ({feedbackTabBadge})</>}\n          </>\n        ),\n      });\n    }\n    if (scoresTabSlot) {\n      views.push({\n        value: 'scores',\n        label: (\n          <>\n            <Icon size=\"xs\">\n              <ScorersIcon />\n            </Icon>\n            Scores{scoresTabBadge != null && <> ({scoresTabBadge})</>}\n          </>\n        ),\n      });\n    }\n    return views;\n  }, [messagesPanelSlot, feedbackTabSlot, feedbackTabBadge, scoresTabSlot, scoresTabBadge]);\n  const [uncontrolledSideView, setUncontrolledSideView] = useState<TraceSideView>();\n  const chosenSideView = controlledSideView ?? uncontrolledSideView;\n  const sideView = (sideViews.find(view => view.value === chosenSideView) ?? sideViews[0])?.value;\n  const handleSideViewChange = (view: TraceSideView) => {\n    setUncontrolledSideView(view);\n    onSideViewChange?.(view);\n  };\n\n  const [uncontrolledSpanView, setUncontrolledSpanView] = useState<TraceSpanView>('tree');\n  const spanView = controlledSpanView ?? uncontrolledSpanView;\n  const setSpanView = (view: TraceSpanView) => {\n    setUncontrolledSpanView(view);\n    onSpanViewChange?.(view);\n  };\n\n  const { download: downloadTraceJson, isPending: isDownloadingTrace } = useDownloadTraceJson();\n\n  const [selectedSpanId, setSelectedSpanId] = useState<string | undefined>(initialSpanId ?? undefined);\n\n  // Sync selected span when initialSpanId or trace data changes\n  useEffect(() => {\n    // No span requested: clear immediately.\n    if (!initialSpanId) {\n      setSelectedSpanId(undefined);\n      onSpanSelect?.(undefined);\n      return;\n    }\n    // Span requested: wait for trace data before deciding so an in-flight\n    // fetch doesn't wipe a URL-provided selection. Callers that default their\n    // spans to `[]` while loading only say so through `isLoading`.\n    if (isLoading || !spans) return;\n\n    const found = spans.find(s => s.spanId === initialSpanId);\n    if (found) {\n      setSelectedSpanId(initialSpanId);\n      onSpanSelect?.(initialSpanId);\n    } else {\n      setSelectedSpanId(undefined);\n      onSpanSelect?.(undefined);\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [initialSpanId, spans, isLoading]);\n\n  const { query, setQuery, results, payloadOnlyMatchIds } = useTraceSearch(spans ?? []);\n\n  const hierarchicalSpans = useMemo(\n    () =>\n      formatHierarchicalSpans(\n        // Carried on the span rather than drilled as a prop: the tree is rebuilt here and\n        // rendered several components deeper.\n        results.map(span => ({ ...span, matchedInPayloadOnly: payloadOnlyMatchIds.has(span.spanId) })),\n        anchorSpanId,\n      ),\n    [results, payloadOnlyMatchIds, anchorSpanId],\n  );\n\n  const [expandedSpanIds, setExpandedSpanIds] = useState<string[]>([]);\n\n  useEffect(() => {\n    if (hierarchicalSpans.length > 0) {\n      setExpandedSpanIds(getAllSpanIds(hierarchicalSpans));\n    }\n  }, [hierarchicalSpans]);\n\n  const rootSpan = useMemo(\n    () => (anchorSpanId ? spans?.find(s => s.spanId === anchorSpanId) : spans?.find(s => s.parentSpanId == null)),\n    [spans, anchorSpanId],\n  );\n  const handleSpanClick = (id: string) => {\n    const newId = selectedSpanId === id ? undefined : id;\n    setSelectedSpanId(newId);\n    onSpanSelect?.(newId);\n  };\n\n  const traceSummary = rootSpan && (\n    <TraceSummaryDescription rootSpan={rootSpan} usage={usage} entityHref={entityHref} LinkComponent={LinkComponent} />\n  );\n\n  const traceActionsMenu = traceId && (\n    <DropdownMenu>\n      <DropdownMenu.Trigger\n        render={\n          <Button size=\"sm\" variant=\"ghost\" tooltip=\"Open trace actions\" aria-label=\"Open trace actions\">\n            <MoreHorizontalIcon />\n          </Button>\n        }\n      />\n      <DropdownMenu.Content align=\"end\">\n        {!isOnTracePage && onSaveAsDatasetItem && (\n          <DropdownMenu.Item onSelect={() => onSaveAsDatasetItem({ traceId, rootSpanId: rootSpan?.spanId })}>\n            <SaveIcon />\n            Add full trace to dataset\n          </DropdownMenu.Item>\n        )}\n        {!isOnTracePage && onAddTraceMocksToItem && (\n          <DropdownMenu.Item onSelect={() => onAddTraceMocksToItem({ traceId })}>\n            <WrenchIcon />\n            Add tool mocks to item\n          </DropdownMenu.Item>\n        )}\n        {!isOnTracePage && LinkComponent && traceHref && (\n          <DropdownMenu.Item render={<LinkComponent href={traceHref} />}>\n            <Link2Icon />\n            Open trace page\n          </DropdownMenu.Item>\n        )}\n        <DropdownMenu.Item disabled={isDownloadingTrace} onSelect={() => downloadTraceJson(traceId)}>\n          {isDownloadingTrace ? <Loader2Icon className=\"animate-spin\" /> : <DownloadIcon />}\n          Download trace JSON\n        </DropdownMenu.Item>\n      </DropdownMenu.Content>\n    </DropdownMenu>\n  );\n\n  const sideColumn =\n    traceId && sideView ? (\n      <div data-trace-side-column className=\"flex h-full min-h-0 min-w-0 flex-col overflow-hidden\">\n        <Tabs<TraceSideView> defaultTab={sideView} value={sideView} onValueChange={handleSideViewChange}>\n          <DataPanel.Header className=\"border-b border-border\">\n            <TabList variant=\"pill-ghost\" size=\"sm\">\n              {sideViews.map(view => (\n                <Tab key={view.value} value={view.value}>\n                  {view.label}\n                </Tab>\n              ))}\n            </TabList>\n          </DataPanel.Header>\n        </Tabs>\n        {sideView === 'messages' && <DataPanel.Content className=\"p-0\">{messagesPanelSlot}</DataPanel.Content>}\n        {sideView === 'feedback' && <DataPanel.Content>{feedbackTabSlot?.({ traceId })}</DataPanel.Content>}\n        {sideView === 'scores' && (\n          <DataPanel.Content>{scoresTabSlot?.({ traceId, rootSpanId: rootSpan?.spanId })}</DataPanel.Content>\n        )}\n      </div>\n    ) : null;\n\n  return (\n    <DataPanel\n      open={!!traceId}\n      onClose={onClose}\n      title={title ?? (isOnTracePage ? 'Trace Timeline' : `Trace ${traceId ?? ''}`)}\n      size={size}\n      depth={depth}\n    >\n      {traceId && (\n        <>\n          {headerSlot}\n          <DataPanel.Header>\n            {isOnTracePage ? (\n              <>\n                <DataPanel.HeaderContent>\n                  <DataPanel.Heading>Trace Timeline</DataPanel.Heading>\n                  {traceSummary}\n                </DataPanel.HeaderContent>\n                <DataPanel.HeaderActions>{traceActionsMenu}</DataPanel.HeaderActions>\n              </>\n            ) : (\n              <>\n                <DataPanel.CloseButton onClick={onClose} />\n                <DataPanel.HeaderContent>\n                  <DataPanel.Heading>\n                    Trace\n                    <TraceIdButton id={traceId} />\n                  </DataPanel.Heading>\n                  {traceSummary}\n                </DataPanel.HeaderContent>\n                <DataPanel.HeaderActions>\n                  {onEvaluateTrace && (\n                    <Button variant=\"primary\" size=\"sm\" onClick={onEvaluateTrace} disabled={!rootSpan}>\n                      <CircleGaugeIcon />\n                      Score trace\n                    </Button>\n                  )}\n                  {traceActionsMenu}\n                  {(onPrevious || onNext) && (\n                    <DataPanel.NextPrevNav\n                      onPrevious={onPrevious}\n                      onNext={onNext}\n                      previousLabel=\"Go to previous trace\"\n                      nextLabel=\"Go to next trace\"\n                    />\n                  )}\n                </DataPanel.HeaderActions>\n              </>\n            )}\n          </DataPanel.Header>\n\n          <TracePanelColumns\n            sideColumnSlot={sideColumn}\n            spanPanelSlot={spanPanelSlot}\n            highlightQuery={query}\n            spanPanelKey={selectedSpanId}\n          >\n            {!isLoading && !spans?.length ? (\n              <DataPanel.NoData>No spans found for this trace.</DataPanel.NoData>\n            ) : (\n              (() => {\n                // Shared by the Spans and Timeline tabs: both views render the same\n                // filtered `hierarchicalSpans`, so one query drives both.\n                const isTimeline = spanView === 'timeline';\n                const searchHeader = (\n                  <DataPanel.Header className=\"gap-2 border-b border-border\">\n                    <SearchInput\n                      label=\"Search spans\"\n                      placeholder=\"Search spans...\"\n                      size=\"sm\"\n                      value={query}\n                      onValueChange={setQuery}\n                      className=\"w-full\"\n                    />\n                    <ButtonsGroup size=\"sm\" className=\"shrink-0\">\n                      <Button\n                        variant={isTimeline ? 'default' : 'primary'}\n                        aria-pressed={!isTimeline}\n                        tooltip=\"Span tree\"\n                        onClick={() => setSpanView('tree')}\n                      >\n                        <ListTreeIcon />\n                      </Button>\n                      <Button\n                        variant={isTimeline ? 'primary' : 'default'}\n                        aria-pressed={isTimeline}\n                        tooltip=\"Timeline\"\n                        onClick={() => setSpanView('timeline')}\n                      >\n                        <ChartGanttIcon />\n                      </Button>\n                    </ButtonsGroup>\n                  </DataPanel.Header>\n                );\n                const noSearchResults = !isLoading && hierarchicalSpans.length === 0 && (\n                  <DataPanel.NoData>No spans match your search.</DataPanel.NoData>\n                );\n                const viewProps = {\n                  hierarchicalSpans,\n                  onSpanClick: handleSpanClick,\n                  selectedSpanId,\n                  expandedSpanIds,\n                  setExpandedSpanIds,\n                  featuredSpanIds,\n                  isLoading,\n                };\n\n                return (\n                  <>\n                    {searchHeader}\n                    <DataPanel.Content>\n                      {!isOnTracePage &&\n                        !onEvaluateTrace &&\n                        !onSaveAsDatasetItem &&\n                        !onAddTraceMocksToItem &&\n                        showUnavailableFeaturesMsg && (\n                          <Notice variant=\"info\" className=\"mb-6\">\n                            <Notice.Message>\n                              Evaluating traces and saving them as dataset items is available in Mastra Studio (local or\n                              deployed).\n                            </Notice.Message>\n                          </Notice>\n                        )}\n\n                      {/* Both views share selection + expansion state, and stay mounted with no\n                    results because they host the search field: unmounting would strand the\n                    user with a query they can no longer clear. */}\n                      {isTimeline ? <TraceSpanTimeline {...viewProps} /> : <TraceSpanTree {...viewProps} />}\n                      {noSearchResults}\n                    </DataPanel.Content>\n                  </>\n                );\n              })()\n            )}\n          </TracePanelColumns>\n        </>\n      )}\n    </DataPanel>\n  );\n}\n\n/**\n * Lays out the card body as three columns — `[side] [trace] [span]` — inside the\n * same card. The side column (messages / feedback / scores) is independent of the\n * Spans/Timeline tabs, so it sits beside them rather than inside a tab. The span\n * cell always exists and collapses to zero when hidden, so opening/closing it\n * animates via `grid-template-columns` rather than mounting/unmounting a DOM\n * column (which cannot be transitioned).\n * Search matches — span names in the timeline tree as well as values in the span\n * detail — are highlighted while a query is active.\n */\nfunction TracePanelColumns({\n  sideColumnSlot,\n  spanPanelSlot,\n  highlightQuery,\n  spanPanelKey,\n  children,\n}: {\n  /** Fixed-width column on the left; the trace and span tracks share the remaining space. */\n  sideColumnSlot?: ReactNode;\n  spanPanelSlot?: ReactNode;\n  highlightQuery: string;\n  /** Identity of the span shown in the panel; changing it re-triggers the match scroll. */\n  spanPanelKey?: string;\n  children: ReactNode;\n}) {\n  // A single hook call on the common ancestor covers both the timeline tree and\n  // the span detail, so span names and payload values highlight together.\n  const { ref: highlightRef } = useTextHighlight<HTMLDivElement>(highlightQuery);\n\n  // Scoped to the span-panel column only: a match deep in a large payload sits below\n  // the fold, so the first painted match is brought into view when the panel opens.\n  // The timeline column must never be scrolled by this.\n  const { ref: scrollToMatchRef } = useScrollToFirstHighlight<HTMLDivElement>(highlightQuery, spanPanelKey);\n\n  return (\n    <div\n      ref={highlightRef}\n      data-trace-columns\n      className={cn(\n        'grid min-h-0 flex-1 transition-[grid-template-columns] duration-300 ease-in-out',\n        sideColumnSlot\n          ? spanPanelSlot\n            ? 'grid-cols-[18rem_1fr_1fr] lg:grid-cols-[24rem_1fr_1fr]'\n            : 'grid-cols-[18rem_1fr_0fr] lg:grid-cols-[24rem_1fr_0fr]'\n          : spanPanelSlot\n            ? 'grid-cols-[0px_1fr_1fr]'\n            : 'grid-cols-[0px_1fr_0fr]',\n      )}\n    >\n      <div className={cn('flex min-h-0 min-w-0 flex-col overflow-hidden', sideColumnSlot && 'border-r border-border')}>\n        {sideColumnSlot}\n      </div>\n      <div className=\"flex min-h-0 min-w-0 flex-col overflow-hidden\">{children}</div>\n      <div\n        ref={scrollToMatchRef}\n        data-highlight\n        className={cn(\n          'flex min-h-0 min-w-0 flex-col overflow-hidden',\n          spanPanelSlot && 'animate-in border-l border-border duration-300 fade-in-0',\n        )}\n      >\n        {spanPanelSlot}\n      </div>\n    </div>\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"trace-data-panel-view.es.js","sources":["../../../../src/domains/traces/components/trace-data-panel-view.tsx"],"sourcesContent":["import {\n  ChartGanttIcon,\n  CircleGaugeIcon,\n  DownloadIcon,\n  Link2Icon,\n  ListTreeIcon,\n  Loader2Icon,\n  MessageSquareReplyIcon,\n  MessageSquareTextIcon,\n  MoreHorizontalIcon,\n  SaveIcon,\n  WrenchIcon,\n} from 'lucide-react';\nimport { useEffect, useMemo, useState } from 'react';\nimport type { ReactNode } from 'react';\nimport { Panel } from 'react-resizable-panels';\nimport { getAllSpanIds } from '../hooks/get-all-span-ids';\nimport { useDownloadTraceJson } from '../hooks/use-download-trace-json';\nimport { useTraceSearch } from '../hooks/use-trace-search';\nimport type { TraceUsageSummary } from '../trace-list-columns';\nimport type { LightSpanRecord } from '../types';\nimport { formatHierarchicalSpans } from './format-hierarchical-spans';\nimport { TraceIdButton } from './trace-id-button';\nimport { TraceSpanTimeline } from './trace-span-timeline';\nimport { TraceSpanTree } from './trace-span-tree';\nimport { TraceSummaryDescription } from './trace-summary-description';\nimport { Button } from '@/ds/components/Button';\nimport { ButtonsGroup } from '@/ds/components/ButtonsGroup';\nimport { DataPanel } from '@/ds/components/DataPanel';\nimport type { DataPanelProps } from '@/ds/components/DataPanel';\nimport { DropdownMenu } from '@/ds/components/DropdownMenu';\nimport { Notice } from '@/ds/components/Notice';\nimport { SearchInput } from '@/ds/components/SearchInput';\nimport { Tab, TabList, Tabs } from '@/ds/components/Tabs';\nimport { Icon } from '@/ds/icons/Icon';\nimport { ScorersIcon } from '@/ds/icons/ScorersIcon';\nimport type { LinkComponent } from '@/ds/types/link-component';\nimport { useScrollToFirstHighlight } from '@/hooks/use-scroll-to-first-highlight';\nimport { useTextHighlight } from '@/hooks/use-text-highlight';\nimport { PanelGroup } from '@/lib/resize/panel-group';\nimport { PanelSeparator } from '@/lib/resize/separator';\nimport { cn } from '@/lib/utils';\n\nexport type TraceDataPanelPlacement = 'traces-list' | 'trace-page';\n\nexport type TraceSpanView = 'tree' | 'timeline';\n\n/** What the side column next to the span tree shows. */\nexport type TraceSideView = 'messages' | 'feedback' | 'scores';\n\nexport interface TraceDataPanelViewProps {\n  /** Keep the panel mounted and pass `undefined` to close it, so the drawer animates out. */\n  traceId?: string;\n  /** Lightweight spans for the trace. Caller fetches via useTraceLightSpans. */\n  spans: LightSpanRecord[] | undefined;\n  isLoading?: boolean;\n  onClose: () => void;\n  onSpanSelect?: (spanId: string | undefined) => void;\n  onEvaluateTrace?: () => void;\n  /** When set, an \"Add full trace to dataset\" button appears; the consumer owns the dialog. */\n  onSaveAsDatasetItem?: (args: { traceId: string; rootSpanId: string | undefined }) => void;\n  /** When set, an \"Add tool mocks to item\" button appears; the consumer owns the dialog. */\n  onAddTraceMocksToItem?: (args: { traceId: string }) => void;\n  initialSpanId?: string | null;\n  onPrevious?: () => void;\n  onNext?: () => void;\n  /** Drawer width; defaults to `wide` since the panel lays out several columns. */\n  size?: DataPanelProps['size'];\n  /** Elevation when opened next to other sibling panels. */\n  depth?: DataPanelProps['depth'];\n  /** Rendered inside the drawer above the trace header (e.g. inbox feedback context). */\n  headerSlot?: ReactNode;\n  /** Accessible drawer name; defaults to the trace id. */\n  title?: string;\n  placement: TraceDataPanelPlacement;\n  /** @deprecated No longer used: the panel renders the span tree with the duration as text. */\n  timelineChartWidth?: 'wide' | 'default';\n  /** When both are provided, renders an \"Open trace page\" button. */\n  LinkComponent?: LinkComponent;\n  traceHref?: string;\n  /** When provided, the entity name in the trace summary links to the entity's page. */\n  entityHref?: string;\n  /** Token and estimated-cost totals shown in the compact trace summary. */\n  usage?: TraceUsageSummary;\n  /**\n   * Span treated as the displayed root of the timeline. Required for branch\n   * subtrees from `getBranch` where the anchor has a real parent that's outside\n   * `spans`. When omitted, the span with no parent is used (trace case).\n   */\n  anchorSpanId?: string;\n  /**\n   * Whether to render the \"Evaluating traces and saving them as dataset items is\n   * available in Mastra Studio\" info notice when neither `onEvaluateTrace` nor\n   * `onSaveAsDatasetItem` is provided. Defaults to `true`. Pass `false` when this\n   * panel is rendered inside Studio in a context that intentionally omits those\n   * handlers (e.g. inline below an experiment result).\n   */\n  showUnavailableFeaturesMsg?: boolean;\n  /**\n   * When provided, a \"Scores\" tab appears; the slot renders whatever trace-level\n   * scoring UI the consumer wants.\n   */\n  scoresTabSlot?: (args: { traceId: string; rootSpanId: string | undefined }) => ReactNode;\n  /** Optional count shown in the \"Scores\" tab label. */\n  scoresTabBadge?: ReactNode;\n  /**\n   * When provided, a \"Feedback\" tab appears; the slot renders the trace-level\n   * feedback UI. Trace feedback is not scoped to a span — the span panel owns that.\n   */\n  feedbackTabSlot?: (args: { traceId: string }) => ReactNode;\n  /** Optional count rendered after the \"Feedback\" tab label, e.g. `Feedback (3)`. */\n  feedbackTabBadge?: ReactNode;\n  /** Span ids to feature in the timeline; every other span is faded. */\n  featuredSpanIds?: string[];\n  /**\n   * The \"Messages\" view of the side column next to the span tree (typically the\n   * trace as one reconstructed agent turn). Rendered without content padding.\n   */\n  messagesPanelSlot?: ReactNode;\n  /**\n   * Actions rendered at the end of the side column's tab row (e.g. \"Open full thread\").\n   * `compact` is true when the side column is narrow and controls collapse to icons.\n   */\n  sideHeaderActions?: (options: { compact: boolean }) => ReactNode;\n  /** Controlled span view (tree or timeline); falls back to local state starting on the tree. */\n  spanView?: TraceSpanView;\n  onSpanViewChange?: (view: TraceSpanView) => void;\n  /** Controlled side column view; falls back to the first available view. */\n  sideView?: TraceSideView;\n  onSideViewChange?: (view: TraceSideView) => void;\n  /**\n   * Rendered as a column to the right of the timeline inside the same card;\n   * typically the span detail.\n   */\n  spanPanelSlot?: ReactNode;\n}\n\nexport function TraceDataPanelView({\n  traceId,\n  spans,\n  isLoading,\n  onClose,\n  onSpanSelect,\n  onEvaluateTrace,\n  onSaveAsDatasetItem,\n  onAddTraceMocksToItem,\n  initialSpanId,\n  onPrevious,\n  onNext,\n  size = 'wide',\n  depth,\n  headerSlot,\n  title,\n  placement,\n  LinkComponent,\n  traceHref,\n  entityHref,\n  usage,\n  anchorSpanId,\n  showUnavailableFeaturesMsg = true,\n  scoresTabSlot,\n  scoresTabBadge,\n  feedbackTabSlot,\n  feedbackTabBadge,\n  featuredSpanIds,\n  messagesPanelSlot,\n  sideHeaderActions,\n  sideView: controlledSideView,\n  onSideViewChange,\n  spanView: controlledSpanView,\n  onSpanViewChange,\n  spanPanelSlot,\n}: TraceDataPanelViewProps) {\n  const isOnTracePage = placement === 'trace-page';\n\n  // The side column next to the span tree hosts Messages / Feedback / Scores;\n  // which one is shown is purely a local viewing choice.\n  const sideViews = useMemo(() => {\n    const views: Array<{ value: TraceSideView; name: string; label: ReactNode }> = [];\n    if (messagesPanelSlot) {\n      views.push({\n        value: 'messages',\n        name: 'Messages',\n        label: (\n          <>\n            <Icon size=\"xs\">\n              <MessageSquareTextIcon />\n            </Icon>\n            <span className=\"@max-[501px]:sr-only\">Messages</span>\n          </>\n        ),\n      });\n    }\n    if (feedbackTabSlot) {\n      views.push({\n        value: 'feedback',\n        name: 'Feedback',\n        label: (\n          <>\n            <Icon size=\"xs\">\n              <MessageSquareReplyIcon />\n            </Icon>\n            <span className=\"@max-[501px]:sr-only\">\n              Feedback{feedbackTabBadge != null && <> ({feedbackTabBadge})</>}\n            </span>\n          </>\n        ),\n      });\n    }\n    if (scoresTabSlot) {\n      views.push({\n        value: 'scores',\n        name: 'Scores',\n        label: (\n          <>\n            <Icon size=\"xs\">\n              <ScorersIcon />\n            </Icon>\n            <span className=\"@max-[501px]:sr-only\">Scores{scoresTabBadge != null && <> ({scoresTabBadge})</>}</span>\n          </>\n        ),\n      });\n    }\n    return views;\n  }, [messagesPanelSlot, feedbackTabSlot, feedbackTabBadge, scoresTabSlot, scoresTabBadge]);\n  const [uncontrolledSideView, setUncontrolledSideView] = useState<TraceSideView>();\n  // Mirrors the side column's `@max-[501px]` container query: the layout collapses in CSS, but\n  // tooltips render in a portal outside the container, so they need the width in JS.\n  const [sideColumnElement, setSideColumnElement] = useState<HTMLDivElement | null>(null);\n  const [compactSide, setCompactSide] = useState(false);\n  useEffect(() => {\n    if (!sideColumnElement || !('ResizeObserver' in globalThis)) return;\n    const observer = new ResizeObserver(() => setCompactSide(sideColumnElement.clientWidth <= 500));\n    observer.observe(sideColumnElement);\n    return () => observer.disconnect();\n  }, [sideColumnElement]);\n  const chosenSideView = controlledSideView ?? uncontrolledSideView;\n  const sideView = (sideViews.find(view => view.value === chosenSideView) ?? sideViews[0])?.value;\n  const handleSideViewChange = (view: TraceSideView) => {\n    setUncontrolledSideView(view);\n    onSideViewChange?.(view);\n  };\n\n  const [uncontrolledSpanView, setUncontrolledSpanView] = useState<TraceSpanView>('tree');\n  const spanView = controlledSpanView ?? uncontrolledSpanView;\n  const setSpanView = (view: TraceSpanView) => {\n    setUncontrolledSpanView(view);\n    onSpanViewChange?.(view);\n  };\n\n  const { download: downloadTraceJson, isPending: isDownloadingTrace } = useDownloadTraceJson();\n\n  const [selectedSpanId, setSelectedSpanId] = useState<string | undefined>(initialSpanId ?? undefined);\n\n  // Sync selected span when initialSpanId or trace data changes\n  useEffect(() => {\n    // No span requested: clear immediately.\n    if (!initialSpanId) {\n      setSelectedSpanId(undefined);\n      onSpanSelect?.(undefined);\n      return;\n    }\n    // Span requested: wait for trace data before deciding so an in-flight\n    // fetch doesn't wipe a URL-provided selection. Callers that default their\n    // spans to `[]` while loading only say so through `isLoading`.\n    if (isLoading || !spans) return;\n\n    const found = spans.find(s => s.spanId === initialSpanId);\n    if (found) {\n      setSelectedSpanId(initialSpanId);\n      onSpanSelect?.(initialSpanId);\n    } else {\n      setSelectedSpanId(undefined);\n      onSpanSelect?.(undefined);\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [initialSpanId, spans, isLoading]);\n\n  const { query, setQuery, results, payloadOnlyMatchIds } = useTraceSearch(spans ?? []);\n\n  const hierarchicalSpans = useMemo(\n    () =>\n      formatHierarchicalSpans(\n        // Carried on the span rather than drilled as a prop: the tree is rebuilt here and\n        // rendered several components deeper.\n        results.map(span => ({ ...span, matchedInPayloadOnly: payloadOnlyMatchIds.has(span.spanId) })),\n        anchorSpanId,\n      ),\n    [results, payloadOnlyMatchIds, anchorSpanId],\n  );\n\n  const [expandedSpanIds, setExpandedSpanIds] = useState<string[]>([]);\n\n  useEffect(() => {\n    if (hierarchicalSpans.length > 0) {\n      setExpandedSpanIds(getAllSpanIds(hierarchicalSpans));\n    }\n  }, [hierarchicalSpans]);\n\n  const rootSpan = useMemo(\n    () => (anchorSpanId ? spans?.find(s => s.spanId === anchorSpanId) : spans?.find(s => s.parentSpanId == null)),\n    [spans, anchorSpanId],\n  );\n  const handleSpanClick = (id: string) => {\n    const newId = selectedSpanId === id ? undefined : id;\n    setSelectedSpanId(newId);\n    onSpanSelect?.(newId);\n  };\n\n  const traceSummary = rootSpan && (\n    <TraceSummaryDescription rootSpan={rootSpan} usage={usage} entityHref={entityHref} LinkComponent={LinkComponent} />\n  );\n\n  const traceActionsMenu = traceId && (\n    <DropdownMenu>\n      <DropdownMenu.Trigger\n        render={\n          <Button size=\"sm\" variant=\"ghost\" tooltip=\"Open trace actions\" aria-label=\"Open trace actions\">\n            <MoreHorizontalIcon />\n          </Button>\n        }\n      />\n      <DropdownMenu.Content align=\"end\">\n        {!isOnTracePage && onSaveAsDatasetItem && (\n          <DropdownMenu.Item onSelect={() => onSaveAsDatasetItem({ traceId, rootSpanId: rootSpan?.spanId })}>\n            <SaveIcon />\n            Add full trace to dataset\n          </DropdownMenu.Item>\n        )}\n        {!isOnTracePage && onAddTraceMocksToItem && (\n          <DropdownMenu.Item onSelect={() => onAddTraceMocksToItem({ traceId })}>\n            <WrenchIcon />\n            Add tool mocks to item\n          </DropdownMenu.Item>\n        )}\n        {!isOnTracePage && LinkComponent && traceHref && (\n          <DropdownMenu.Item render={<LinkComponent href={traceHref} />}>\n            <Link2Icon />\n            Open trace page\n          </DropdownMenu.Item>\n        )}\n        <DropdownMenu.Item disabled={isDownloadingTrace} onSelect={() => downloadTraceJson(traceId)}>\n          {isDownloadingTrace ? <Loader2Icon className=\"animate-spin\" /> : <DownloadIcon />}\n          Download trace JSON\n        </DropdownMenu.Item>\n      </DropdownMenu.Content>\n    </DropdownMenu>\n  );\n\n  const sideColumn =\n    traceId && sideView ? (\n      <div\n        ref={setSideColumnElement}\n        data-trace-side-column\n        className=\"@container flex h-full min-h-0 min-w-0 flex-col overflow-hidden\"\n      >\n        {/* Whether the Messages tab exists depends on the spans, so the tabs wait for them;\n            otherwise the column flickers Feedback → Messages as the first tab changes. */}\n        {isLoading ? (\n          <DataPanel.Header className=\"border-b border-border\">\n            <div aria-hidden className=\"h-control-sm\" />\n          </DataPanel.Header>\n        ) : (\n          <Tabs<TraceSideView> defaultTab={sideView} value={sideView} onValueChange={handleSideViewChange}>\n            <DataPanel.Header className=\"border-b border-border\">\n              <TabList variant=\"pill-ghost\" size=\"sm\">\n                {sideViews.map(view => (\n                  <Tab key={view.value} value={view.value} tooltip={compactSide ? view.name : undefined}>\n                    {view.label}\n                  </Tab>\n                ))}\n              </TabList>\n              {sideHeaderActions && (\n                <div className=\"ml-auto flex shrink-0 items-center whitespace-nowrap\">\n                  {sideHeaderActions({ compact: compactSide })}\n                </div>\n              )}\n            </DataPanel.Header>\n          </Tabs>\n        )}\n        {!isLoading && sideView === 'messages' && (\n          <DataPanel.Content className=\"p-0\">{messagesPanelSlot}</DataPanel.Content>\n        )}\n        {!isLoading && sideView === 'feedback' && (\n          <DataPanel.Content>{feedbackTabSlot?.({ traceId })}</DataPanel.Content>\n        )}\n        {!isLoading && sideView === 'scores' && (\n          <DataPanel.Content>{scoresTabSlot?.({ traceId, rootSpanId: rootSpan?.spanId })}</DataPanel.Content>\n        )}\n      </div>\n    ) : null;\n\n  return (\n    <DataPanel\n      open={!!traceId}\n      onClose={onClose}\n      title={title ?? (isOnTracePage ? 'Trace Timeline' : `Trace ${traceId ?? ''}`)}\n      size={size}\n      depth={depth}\n    >\n      {traceId && (\n        <>\n          {headerSlot}\n          <DataPanel.Header>\n            {isOnTracePage ? (\n              <>\n                <DataPanel.HeaderContent>\n                  <DataPanel.Heading>Trace Timeline</DataPanel.Heading>\n                  {traceSummary}\n                </DataPanel.HeaderContent>\n                <DataPanel.HeaderActions>{traceActionsMenu}</DataPanel.HeaderActions>\n              </>\n            ) : (\n              <>\n                <DataPanel.CloseButton onClick={onClose} />\n                <DataPanel.HeaderContent>\n                  <DataPanel.Heading>\n                    Trace\n                    <TraceIdButton id={traceId} />\n                  </DataPanel.Heading>\n                  {traceSummary}\n                </DataPanel.HeaderContent>\n                <DataPanel.HeaderActions>\n                  {onEvaluateTrace && (\n                    <Button variant=\"primary\" size=\"sm\" onClick={onEvaluateTrace} disabled={!rootSpan}>\n                      <CircleGaugeIcon />\n                      Score trace\n                    </Button>\n                  )}\n                  {traceActionsMenu}\n                  {(onPrevious || onNext) && (\n                    <DataPanel.NextPrevNav\n                      onPrevious={onPrevious}\n                      onNext={onNext}\n                      previousLabel=\"Go to previous trace\"\n                      nextLabel=\"Go to next trace\"\n                    />\n                  )}\n                </DataPanel.HeaderActions>\n              </>\n            )}\n          </DataPanel.Header>\n\n          <TracePanelColumns\n            sideColumnSlot={sideColumn}\n            spanPanelSlot={spanPanelSlot}\n            highlightQuery={query}\n            spanPanelKey={selectedSpanId}\n          >\n            {!isLoading && !spans?.length ? (\n              <DataPanel.NoData>No spans found for this trace.</DataPanel.NoData>\n            ) : (\n              (() => {\n                // Shared by the Spans and Timeline tabs: both views render the same\n                // filtered `hierarchicalSpans`, so one query drives both.\n                const isTimeline = spanView === 'timeline';\n                const searchHeader = (\n                  <DataPanel.Header className=\"gap-2 border-b border-border\">\n                    <SearchInput\n                      label=\"Search spans\"\n                      placeholder=\"Search spans...\"\n                      size=\"sm\"\n                      value={query}\n                      onValueChange={setQuery}\n                      className=\"w-full\"\n                    />\n                    <ButtonsGroup size=\"sm\" className=\"shrink-0\">\n                      <Button\n                        variant={isTimeline ? 'default' : 'primary'}\n                        aria-pressed={!isTimeline}\n                        tooltip=\"Span tree\"\n                        onClick={() => setSpanView('tree')}\n                      >\n                        <ListTreeIcon />\n                      </Button>\n                      <Button\n                        variant={isTimeline ? 'primary' : 'default'}\n                        aria-pressed={isTimeline}\n                        tooltip=\"Timeline\"\n                        onClick={() => setSpanView('timeline')}\n                      >\n                        <ChartGanttIcon />\n                      </Button>\n                    </ButtonsGroup>\n                  </DataPanel.Header>\n                );\n                const noSearchResults = !isLoading && hierarchicalSpans.length === 0 && (\n                  <DataPanel.NoData>No spans match your search.</DataPanel.NoData>\n                );\n                const viewProps = {\n                  hierarchicalSpans,\n                  onSpanClick: handleSpanClick,\n                  selectedSpanId,\n                  expandedSpanIds,\n                  setExpandedSpanIds,\n                  featuredSpanIds,\n                  isLoading,\n                };\n\n                return (\n                  <>\n                    {searchHeader}\n                    <DataPanel.Content>\n                      {!isOnTracePage &&\n                        !onEvaluateTrace &&\n                        !onSaveAsDatasetItem &&\n                        !onAddTraceMocksToItem &&\n                        showUnavailableFeaturesMsg && (\n                          <Notice variant=\"info\" className=\"mb-6\">\n                            <Notice.Message>\n                              Evaluating traces and saving them as dataset items is available in Mastra Studio (local or\n                              deployed).\n                            </Notice.Message>\n                          </Notice>\n                        )}\n\n                      {/* Both views share selection + expansion state, and stay mounted with no\n                    results because they host the search field: unmounting would strand the\n                    user with a query they can no longer clear. */}\n                      {isTimeline ? <TraceSpanTimeline {...viewProps} /> : <TraceSpanTree {...viewProps} />}\n                      {noSearchResults}\n                    </DataPanel.Content>\n                  </>\n                );\n              })()\n            )}\n          </TracePanelColumns>\n        </>\n      )}\n    </DataPanel>\n  );\n}\n\n/**\n * Lays out the card body as three columns — `[side] [trace] [span]` — inside the\n * same card. The side column (messages / feedback / scores) is independent of the\n * Spans/Timeline tabs, so it sits beside them rather than inside a tab. The side\n * and span columns are resizable (down to a minimum width); the trace column takes the rest.\n * Search matches — span names in the timeline tree as well as values in the span\n * detail — are highlighted while a query is active.\n */\nfunction TracePanelColumns({\n  sideColumnSlot,\n  spanPanelSlot,\n  highlightQuery,\n  spanPanelKey,\n  children,\n}: {\n  /** Resizable column on the left (messages / feedback / scores). */\n  sideColumnSlot?: ReactNode;\n  spanPanelSlot?: ReactNode;\n  highlightQuery: string;\n  /** Identity of the span shown in the panel; changing it re-triggers the match scroll. */\n  spanPanelKey?: string;\n  children: ReactNode;\n}) {\n  // A single hook call on the common ancestor covers both the timeline tree and\n  // the span detail, so span names and payload values highlight together.\n  const { ref: highlightRef } = useTextHighlight<HTMLDivElement>(highlightQuery);\n\n  // Scoped to the span-panel column only: a match deep in a large payload sits below\n  // the fold, so the first painted match is brought into view when the panel opens.\n  // The timeline column must never be scrolled by this.\n  const { ref: scrollToMatchRef } = useScrollToFirstHighlight<HTMLDivElement>(highlightQuery, spanPanelKey);\n\n  return (\n    <div ref={highlightRef} data-trace-columns className=\"flex min-h-0 flex-1\">\n      <PanelGroup orientation=\"horizontal\" className=\"min-h-0 flex-1\">\n        {sideColumnSlot && (\n          <>\n            <Panel id=\"trace-side\" minSize={280} defaultSize=\"40%\">\n              <div className=\"flex h-full min-h-0 flex-col border-r border-border\">{sideColumnSlot}</div>\n            </Panel>\n            <PanelSeparator variant=\"pill\" />\n          </>\n        )}\n        <Panel id=\"trace-main\" minSize={320} className=\"flex min-h-0 min-w-0 flex-col\">\n          {children}\n        </Panel>\n        {spanPanelSlot && (\n          <>\n            <PanelSeparator variant=\"pill\" />\n            <Panel id=\"trace-span\" minSize={320} defaultSize=\"35%\">\n              <div\n                ref={scrollToMatchRef}\n                data-highlight\n                className=\"flex h-full min-h-0 animate-in flex-col border-l border-border duration-300 fade-in-0\"\n              >\n                {spanPanelSlot}\n              </div>\n            </Panel>\n          </>\n        )}\n      </PanelGroup>\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyIO,SAAS,kBAAA,CAAmB;AAAA,EACjC,OAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA;AAAA,EACA,YAAA;AAAA,EACA,eAAA;AAAA,EACA,mBAAA;AAAA,EACA,qBAAA;AAAA,EACA,aAAA;AAAA,EACA,UAAA;AAAA,EACA,MAAA;AAAA,EACA,IAAA,GAAO,MAAA;AAAA,EACP,KAAA;AAAA,EACA,UAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAA;AAAA,EACA,aAAA;AAAA,EACA,SAAA;AAAA,EACA,UAAA;AAAA,EACA,KAAA;AAAA,EACA,YAAA;AAAA,EACA,0BAAA,GAA6B,IAAA;AAAA,EAC7B,aAAA;AAAA,EACA,cAAA;AAAA,EACA,eAAA;AAAA,EACA,gBAAA;AAAA,EACA,eAAA;AAAA,EACA,iBAAA;AAAA,EACA,iBAAA;AAAA,EACA,QAAA,EAAU,kBAAA;AAAA,EACV,gBAAA;AAAA,EACA,QAAA,EAAU,kBAAA;AAAA,EACV,gBAAA;AAAA,EACA;AACF,CAAA,EAA4B;AAC1B,EAAA,MAAM,gBAAgB,SAAA,KAAc,YAAA;AAIpC,EAAA,MAAM,SAAA,GAAY,QAAQ,MAAM;AAC9B,IAAA,MAAM,QAAyE,EAAC;AAChF,IAAA,IAAI,iBAAA,EAAmB;AACrB,MAAA,KAAA,CAAM,IAAA,CAAK;AAAA,QACT,KAAA,EAAO,UAAA;AAAA,QACP,IAAA,EAAM,UAAA;AAAA,QACN,uBACE,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,IAAA,EAAA,EAAK,IAAA,EAAK,IAAA,EACT,QAAA,kBAAA,GAAA,CAAC,yBAAsB,CAAA,EACzB,CAAA;AAAA,0BACA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,sBAAA,EAAuB,QAAA,EAAA,UAAA,EAAQ;AAAA,SAAA,EACjD;AAAA,OAEH,CAAA;AAAA,IACH;AACA,IAAA,IAAI,eAAA,EAAiB;AACnB,MAAA,KAAA,CAAM,IAAA,CAAK;AAAA,QACT,KAAA,EAAO,UAAA;AAAA,QACP,IAAA,EAAM,UAAA;AAAA,QACN,uBACE,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,IAAA,EAAA,EAAK,IAAA,EAAK,IAAA,EACT,QAAA,kBAAA,GAAA,CAAC,0BAAuB,CAAA,EAC1B,CAAA;AAAA,0BACA,IAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,sBAAA,EAAuB,QAAA,EAAA;AAAA,YAAA,UAAA;AAAA,YAC5B,gBAAA,IAAoB,wBAAQ,IAAA,CAAA,QAAA,EAAA,EAAE,QAAA,EAAA;AAAA,cAAA,IAAA;AAAA,cAAG,gBAAA;AAAA,cAAiB;AAAA,aAAA,EAAC;AAAA,WAAA,EAC9D;AAAA,SAAA,EACF;AAAA,OAEH,CAAA;AAAA,IACH;AACA,IAAA,IAAI,aAAA,EAAe;AACjB,MAAA,KAAA,CAAM,IAAA,CAAK;AAAA,QACT,KAAA,EAAO,QAAA;AAAA,QACP,IAAA,EAAM,QAAA;AAAA,QACN,uBACE,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,IAAA,EAAA,EAAK,IAAA,EAAK,IAAA,EACT,QAAA,kBAAA,GAAA,CAAC,eAAY,CAAA,EACf,CAAA;AAAA,0BACA,IAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,sBAAA,EAAuB,QAAA,EAAA;AAAA,YAAA,QAAA;AAAA,YAAO,cAAA,IAAkB,wBAAQ,IAAA,CAAA,QAAA,EAAA,EAAE,QAAA,EAAA;AAAA,cAAA,IAAA;AAAA,cAAG,cAAA;AAAA,cAAe;AAAA,aAAA,EAAC;AAAA,WAAA,EAAI;AAAA,SAAA,EACnG;AAAA,OAEH,CAAA;AAAA,IACH;AACA,IAAA,OAAO,KAAA;AAAA,EACT,GAAG,CAAC,iBAAA,EAAmB,iBAAiB,gBAAA,EAAkB,aAAA,EAAe,cAAc,CAAC,CAAA;AACxF,EAAA,MAAM,CAAC,oBAAA,EAAsB,uBAAuB,CAAA,GAAI,QAAA,EAAwB;AAGhF,EAAA,MAAM,CAAC,iBAAA,EAAmB,oBAAoB,CAAA,GAAI,SAAgC,IAAI,CAAA;AACtF,EAAA,MAAM,CAAC,WAAA,EAAa,cAAc,CAAA,GAAI,SAAS,KAAK,CAAA;AACpD,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,CAAC,iBAAA,IAAqB,EAAE,gBAAA,IAAoB,UAAA,CAAA,EAAa;AAC7D,IAAA,MAAM,QAAA,GAAW,IAAI,cAAA,CAAe,MAAM,eAAe,iBAAA,CAAkB,WAAA,IAAe,GAAG,CAAC,CAAA;AAC9F,IAAA,QAAA,CAAS,QAAQ,iBAAiB,CAAA;AAClC,IAAA,OAAO,MAAM,SAAS,UAAA,EAAW;AAAA,EACnC,CAAA,EAAG,CAAC,iBAAiB,CAAC,CAAA;AACtB,EAAA,MAAM,iBAAiB,kBAAA,IAAsB,oBAAA;AAC7C,EAAA,MAAM,QAAA,GAAA,CAAY,SAAA,CAAU,IAAA,CAAK,CAAA,IAAA,KAAQ,IAAA,CAAK,UAAU,cAAc,CAAA,IAAK,SAAA,CAAU,CAAC,CAAA,GAAI,KAAA;AAC1F,EAAA,MAAM,oBAAA,GAAuB,CAAC,IAAA,KAAwB;AACpD,IAAA,uBAAA,CAAwB,IAAI,CAAA;AAC5B,IAAA,gBAAA,GAAmB,IAAI,CAAA;AAAA,EACzB,CAAA;AAEA,EAAA,MAAM,CAAC,oBAAA,EAAsB,uBAAuB,CAAA,GAAI,SAAwB,MAAM,CAAA;AACtF,EAAA,MAAM,WAAW,kBAAA,IAAsB,oBAAA;AACvC,EAAA,MAAM,WAAA,GAAc,CAAC,IAAA,KAAwB;AAC3C,IAAA,uBAAA,CAAwB,IAAI,CAAA;AAC5B,IAAA,gBAAA,GAAmB,IAAI,CAAA;AAAA,EACzB,CAAA;AAEA,EAAA,MAAM,EAAE,QAAA,EAAU,iBAAA,EAAmB,SAAA,EAAW,kBAAA,KAAuB,oBAAA,EAAqB;AAE5F,EAAA,MAAM,CAAC,cAAA,EAAgB,iBAAiB,CAAA,GAAI,QAAA,CAA6B,iBAAiB,MAAS,CAAA;AAGnG,EAAA,SAAA,CAAU,MAAM;AAEd,IAAA,IAAI,CAAC,aAAA,EAAe;AAClB,MAAA,iBAAA,CAAkB,MAAS,CAAA;AAC3B,MAAA,YAAA,GAAe,MAAS,CAAA;AACxB,MAAA;AAAA,IACF;AAIA,IAAA,IAAI,SAAA,IAAa,CAAC,KAAA,EAAO;AAEzB,IAAA,MAAM,QAAQ,KAAA,CAAM,IAAA,CAAK,CAAA,CAAA,KAAK,CAAA,CAAE,WAAW,aAAa,CAAA;AACxD,IAAA,IAAI,KAAA,EAAO;AACT,MAAA,iBAAA,CAAkB,aAAa,CAAA;AAC/B,MAAA,YAAA,GAAe,aAAa,CAAA;AAAA,IAC9B,CAAA,MAAO;AACL,MAAA,iBAAA,CAAkB,MAAS,CAAA;AAC3B,MAAA,YAAA,GAAe,MAAS,CAAA;AAAA,IAC1B;AAAA,EAEF,CAAA,EAAG,CAAC,aAAA,EAAe,KAAA,EAAO,SAAS,CAAC,CAAA;AAEpC,EAAA,MAAM,EAAE,OAAO,QAAA,EAAU,OAAA,EAAS,qBAAoB,GAAI,cAAA,CAAe,KAAA,IAAS,EAAE,CAAA;AAEpF,EAAA,MAAM,iBAAA,GAAoB,OAAA;AAAA,IACxB,MACE,uBAAA;AAAA;AAAA;AAAA,MAGE,OAAA,CAAQ,GAAA,CAAI,CAAA,IAAA,MAAS,EAAE,GAAG,IAAA,EAAM,oBAAA,EAAsB,mBAAA,CAAoB,GAAA,CAAI,IAAA,CAAK,MAAM,CAAA,EAAE,CAAE,CAAA;AAAA,MAC7F;AAAA,KACF;AAAA,IACF,CAAC,OAAA,EAAS,mBAAA,EAAqB,YAAY;AAAA,GAC7C;AAEA,EAAA,MAAM,CAAC,eAAA,EAAiB,kBAAkB,CAAA,GAAI,QAAA,CAAmB,EAAE,CAAA;AAEnE,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,iBAAA,CAAkB,SAAS,CAAA,EAAG;AAChC,MAAA,kBAAA,CAAmB,aAAA,CAAc,iBAAiB,CAAC,CAAA;AAAA,IACrD;AAAA,EACF,CAAA,EAAG,CAAC,iBAAiB,CAAC,CAAA;AAEtB,EAAA,MAAM,QAAA,GAAW,OAAA;AAAA,IACf,MAAO,YAAA,GAAe,KAAA,EAAO,IAAA,CAAK,OAAK,CAAA,CAAE,MAAA,KAAW,YAAY,CAAA,GAAI,KAAA,EAAO,IAAA,CAAK,CAAA,CAAA,KAAK,CAAA,CAAE,gBAAgB,IAAI,CAAA;AAAA,IAC3G,CAAC,OAAO,YAAY;AAAA,GACtB;AACA,EAAA,MAAM,eAAA,GAAkB,CAAC,EAAA,KAAe;AACtC,IAAA,MAAM,KAAA,GAAQ,cAAA,KAAmB,EAAA,GAAK,MAAA,GAAY,EAAA;AAClD,IAAA,iBAAA,CAAkB,KAAK,CAAA;AACvB,IAAA,YAAA,GAAe,KAAK,CAAA;AAAA,EACtB,CAAA;AAEA,EAAA,MAAM,eAAe,QAAA,oBACnB,GAAA,CAAC,2BAAwB,QAAA,EAAoB,KAAA,EAAc,YAAwB,aAAA,EAA8B,CAAA;AAGnH,EAAA,MAAM,gBAAA,GAAmB,OAAA,oBACvB,IAAA,CAAC,YAAA,EAAA,EACC,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,YAAA,CAAa,OAAA;AAAA,MAAb;AAAA,QACC,MAAA,kBACE,GAAA,CAAC,MAAA,EAAA,EAAO,IAAA,EAAK,IAAA,EAAK,OAAA,EAAQ,OAAA,EAAQ,OAAA,EAAQ,oBAAA,EAAqB,YAAA,EAAW,oBAAA,EACxE,QAAA,kBAAA,GAAA,CAAC,sBAAmB,CAAA,EACtB;AAAA;AAAA,KAEJ;AAAA,oBACA,IAAA,CAAC,YAAA,CAAa,OAAA,EAAb,EAAqB,OAAM,KAAA,EACzB,QAAA,EAAA;AAAA,MAAA,CAAC,aAAA,IAAiB,mBAAA,oBACjB,IAAA,CAAC,YAAA,CAAa,MAAb,EAAkB,QAAA,EAAU,MAAM,mBAAA,CAAoB,EAAE,OAAA,EAAS,UAAA,EAAY,QAAA,EAAU,MAAA,EAAQ,CAAA,EAC9F,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,QAAA,EAAA,EAAS,CAAA;AAAA,QAAE;AAAA,OAAA,EAEd,CAAA;AAAA,MAED,CAAC,aAAA,IAAiB,qBAAA,oBACjB,IAAA,CAAC,YAAA,CAAa,IAAA,EAAb,EAAkB,QAAA,EAAU,MAAM,qBAAA,CAAsB,EAAE,OAAA,EAAS,CAAA,EAClE,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,UAAA,EAAA,EAAW,CAAA;AAAA,QAAE;AAAA,OAAA,EAEhB,CAAA;AAAA,MAED,CAAC,aAAA,IAAiB,aAAA,IAAiB,SAAA,oBAClC,IAAA,CAAC,YAAA,CAAa,IAAA,EAAb,EAAkB,MAAA,kBAAQ,GAAA,CAAC,aAAA,EAAA,EAAc,IAAA,EAAM,WAAW,CAAA,EACzD,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,SAAA,EAAA,EAAU,CAAA;AAAA,QAAE;AAAA,OAAA,EAEf,CAAA;AAAA,sBAEF,IAAA,CAAC,YAAA,CAAa,IAAA,EAAb,EAAkB,QAAA,EAAU,oBAAoB,QAAA,EAAU,MAAM,iBAAA,CAAkB,OAAO,CAAA,EACvF,QAAA,EAAA;AAAA,QAAA,kBAAA,uBAAsB,WAAA,EAAA,EAAY,SAAA,EAAU,cAAA,EAAe,CAAA,uBAAM,YAAA,EAAA,EAAa,CAAA;AAAA,QAAG;AAAA,OAAA,EAEpF;AAAA,KAAA,EACF;AAAA,GAAA,EACF,CAAA;AAGF,EAAA,MAAM,UAAA,GACJ,WAAW,QAAA,mBACT,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA,EAAK,oBAAA;AAAA,MACL,wBAAA,EAAsB,IAAA;AAAA,MACtB,SAAA,EAAU,iEAAA;AAAA,MAIT,QAAA,EAAA;AAAA,QAAA,SAAA,mBACC,GAAA,CAAC,SAAA,CAAU,MAAA,EAAV,EAAiB,SAAA,EAAU,wBAAA,EAC1B,QAAA,kBAAA,GAAA,CAAC,KAAA,EAAA,EAAI,aAAA,EAAW,IAAA,EAAC,SAAA,EAAU,cAAA,EAAe,CAAA,EAC5C,CAAA,mBAEA,GAAA,CAAC,IAAA,EAAA,EAAoB,UAAA,EAAY,QAAA,EAAU,KAAA,EAAO,QAAA,EAAU,aAAA,EAAe,oBAAA,EACzE,QAAA,kBAAA,IAAA,CAAC,SAAA,CAAU,MAAA,EAAV,EAAiB,SAAA,EAAU,wBAAA,EAC1B,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,OAAA,EAAA,EAAQ,SAAQ,YAAA,EAAa,IAAA,EAAK,MAChC,QAAA,EAAA,SAAA,CAAU,GAAA,CAAI,CAAA,IAAA,qBACb,GAAA,CAAC,GAAA,EAAA,EAAqB,KAAA,EAAO,KAAK,KAAA,EAAO,OAAA,EAAS,WAAA,GAAc,IAAA,CAAK,IAAA,GAAO,MAAA,EACzE,eAAK,KAAA,EAAA,EADE,IAAA,CAAK,KAEf,CACD,CAAA,EACH,CAAA;AAAA,UACC,iBAAA,oBACC,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,sDAAA,EACZ,4BAAkB,EAAE,OAAA,EAAS,WAAA,EAAa,CAAA,EAC7C;AAAA,SAAA,EAEJ,CAAA,EACF,CAAA;AAAA,QAED,CAAC,SAAA,IAAa,QAAA,KAAa,UAAA,oBAC1B,GAAA,CAAC,UAAU,OAAA,EAAV,EAAkB,SAAA,EAAU,KAAA,EAAO,QAAA,EAAA,iBAAA,EAAkB,CAAA;AAAA,QAEvD,CAAC,SAAA,IAAa,QAAA,KAAa,UAAA,oBAC1B,GAAA,CAAC,SAAA,CAAU,OAAA,EAAV,EAAmB,QAAA,EAAA,eAAA,GAAkB,EAAE,OAAA,EAAS,CAAA,EAAE,CAAA;AAAA,QAEpD,CAAC,SAAA,IAAa,QAAA,KAAa,QAAA,wBACzB,SAAA,CAAU,OAAA,EAAV,EAAmB,QAAA,EAAA,aAAA,GAAgB,EAAE,OAAA,EAAS,UAAA,EAAY,QAAA,EAAU,MAAA,EAAQ,CAAA,EAAE;AAAA;AAAA;AAAA,GAEnF,GACE,IAAA;AAEN,EAAA,uBACE,GAAA;AAAA,IAAC,SAAA;AAAA,IAAA;AAAA,MACC,IAAA,EAAM,CAAC,CAAC,OAAA;AAAA,MACR,OAAA;AAAA,MACA,OAAO,KAAA,KAAU,aAAA,GAAgB,gBAAA,GAAmB,CAAA,MAAA,EAAS,WAAW,EAAE,CAAA,CAAA,CAAA;AAAA,MAC1E,IAAA;AAAA,MACA,KAAA;AAAA,MAEC,qCACC,IAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,QAAA,UAAA;AAAA,wBACD,GAAA,CAAC,SAAA,CAAU,MAAA,EAAV,EACE,0CACC,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,0BAAA,IAAA,CAAC,SAAA,CAAU,eAAV,EACC,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,SAAA,CAAU,OAAA,EAAV,EAAkB,QAAA,EAAA,gBAAA,EAAc,CAAA;AAAA,YAChC;AAAA,WAAA,EACH,CAAA;AAAA,0BACA,GAAA,CAAC,SAAA,CAAU,aAAA,EAAV,EAAyB,QAAA,EAAA,gBAAA,EAAiB;AAAA,SAAA,EAC7C,oBAEA,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,SAAA,CAAU,WAAA,EAAV,EAAsB,OAAA,EAAS,OAAA,EAAS,CAAA;AAAA,0BACzC,IAAA,CAAC,SAAA,CAAU,aAAA,EAAV,EACC,QAAA,EAAA;AAAA,4BAAA,IAAA,CAAC,SAAA,CAAU,SAAV,EAAkB,QAAA,EAAA;AAAA,cAAA,OAAA;AAAA,8BAEjB,GAAA,CAAC,aAAA,EAAA,EAAc,EAAA,EAAI,OAAA,EAAS;AAAA,aAAA,EAC9B,CAAA;AAAA,YACC;AAAA,WAAA,EACH,CAAA;AAAA,0BACA,IAAA,CAAC,SAAA,CAAU,aAAA,EAAV,EACE,QAAA,EAAA;AAAA,YAAA,eAAA,oBACC,IAAA,CAAC,MAAA,EAAA,EAAO,OAAA,EAAQ,SAAA,EAAU,IAAA,EAAK,MAAK,OAAA,EAAS,eAAA,EAAiB,QAAA,EAAU,CAAC,QAAA,EACvE,QAAA,EAAA;AAAA,8BAAA,GAAA,CAAC,eAAA,EAAA,EAAgB,CAAA;AAAA,cAAE;AAAA,aAAA,EAErB,CAAA;AAAA,YAED,gBAAA;AAAA,YAAA,CACC,cAAc,MAAA,qBACd,GAAA;AAAA,cAAC,SAAA,CAAU,WAAA;AAAA,cAAV;AAAA,gBACC,UAAA;AAAA,gBACA,MAAA;AAAA,gBACA,aAAA,EAAc,sBAAA;AAAA,gBACd,SAAA,EAAU;AAAA;AAAA;AACZ,WAAA,EAEJ;AAAA,SAAA,EACF,CAAA,EAEJ,CAAA;AAAA,wBAEA,GAAA;AAAA,UAAC,iBAAA;AAAA,UAAA;AAAA,YACC,cAAA,EAAgB,UAAA;AAAA,YAChB,aAAA;AAAA,YACA,cAAA,EAAgB,KAAA;AAAA,YAChB,YAAA,EAAc,cAAA;AAAA,YAEb,QAAA,EAAA,CAAC,SAAA,IAAa,CAAC,KAAA,EAAO,MAAA,mBACrB,GAAA,CAAC,SAAA,CAAU,MAAA,EAAV,EAAiB,QAAA,EAAA,gCAAA,EAA8B,CAAA,GAAA,CAE/C,MAAM;AAGL,cAAA,MAAM,aAAa,QAAA,KAAa,UAAA;AAChC,cAAA,MAAM,+BACJ,IAAA,CAAC,SAAA,CAAU,MAAA,EAAV,EAAiB,WAAU,8BAAA,EAC1B,QAAA,EAAA;AAAA,gCAAA,GAAA;AAAA,kBAAC,WAAA;AAAA,kBAAA;AAAA,oBACC,KAAA,EAAM,cAAA;AAAA,oBACN,WAAA,EAAY,iBAAA;AAAA,oBACZ,IAAA,EAAK,IAAA;AAAA,oBACL,KAAA,EAAO,KAAA;AAAA,oBACP,aAAA,EAAe,QAAA;AAAA,oBACf,SAAA,EAAU;AAAA;AAAA,iBACZ;AAAA,gCACA,IAAA,CAAC,YAAA,EAAA,EAAa,IAAA,EAAK,IAAA,EAAK,WAAU,UAAA,EAChC,QAAA,EAAA;AAAA,kCAAA,GAAA;AAAA,oBAAC,MAAA;AAAA,oBAAA;AAAA,sBACC,OAAA,EAAS,aAAa,SAAA,GAAY,SAAA;AAAA,sBAClC,gBAAc,CAAC,UAAA;AAAA,sBACf,OAAA,EAAQ,WAAA;AAAA,sBACR,OAAA,EAAS,MAAM,WAAA,CAAY,MAAM,CAAA;AAAA,sBAEjC,8BAAC,YAAA,EAAA,EAAa;AAAA;AAAA,mBAChB;AAAA,kCACA,GAAA;AAAA,oBAAC,MAAA;AAAA,oBAAA;AAAA,sBACC,OAAA,EAAS,aAAa,SAAA,GAAY,SAAA;AAAA,sBAClC,cAAA,EAAc,UAAA;AAAA,sBACd,OAAA,EAAQ,UAAA;AAAA,sBACR,OAAA,EAAS,MAAM,WAAA,CAAY,UAAU,CAAA;AAAA,sBAErC,8BAAC,cAAA,EAAA,EAAe;AAAA;AAAA;AAClB,iBAAA,EACF;AAAA,eAAA,EACF,CAAA;AAEF,cAAA,MAAM,eAAA,GAAkB,CAAC,SAAA,IAAa,iBAAA,CAAkB,MAAA,KAAW,qBACjE,GAAA,CAAC,SAAA,CAAU,MAAA,EAAV,EAAiB,QAAA,EAAA,6BAAA,EAA2B,CAAA;AAE/C,cAAA,MAAM,SAAA,GAAY;AAAA,gBAChB,iBAAA;AAAA,gBACA,WAAA,EAAa,eAAA;AAAA,gBACb,cAAA;AAAA,gBACA,eAAA;AAAA,gBACA,kBAAA;AAAA,gBACA,eAAA;AAAA,gBACA;AAAA,eACF;AAEA,cAAA,uBACE,IAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,gBAAA,YAAA;AAAA,gCACD,IAAA,CAAC,SAAA,CAAU,OAAA,EAAV,EACE,QAAA,EAAA;AAAA,kBAAA,CAAC,iBACA,CAAC,eAAA,IACD,CAAC,mBAAA,IACD,CAAC,yBACD,0BAAA,oBACE,GAAA,CAAC,UAAO,OAAA,EAAQ,MAAA,EAAO,WAAU,MAAA,EAC/B,QAAA,kBAAA,GAAA,CAAC,OAAO,OAAA,EAAP,EAAe,mHAGhB,CAAA,EACF,CAAA;AAAA,kBAMH,UAAA,uBAAc,iBAAA,EAAA,EAAmB,GAAG,WAAW,CAAA,mBAAK,GAAA,CAAC,aAAA,EAAA,EAAe,GAAG,SAAA,EAAW,CAAA;AAAA,kBAClF;AAAA,iBAAA,EACH;AAAA,eAAA,EACF,CAAA;AAAA,YAEJ,CAAA;AAAG;AAAA;AAEP,OAAA,EACF;AAAA;AAAA,GAEJ;AAEJ;AAUA,SAAS,iBAAA,CAAkB;AAAA,EACzB,cAAA;AAAA,EACA,aAAA;AAAA,EACA,cAAA;AAAA,EACA,YAAA;AAAA,EACA;AACF,CAAA,EAQG;AAGD,EAAA,MAAM,EAAE,GAAA,EAAK,YAAA,EAAa,GAAI,iBAAiC,cAAc,CAAA;AAK7E,EAAA,MAAM,EAAE,GAAA,EAAK,gBAAA,EAAiB,GAAI,yBAAA,CAA0C,gBAAgB,YAAY,CAAA;AAExG,EAAA,uBACE,GAAA,CAAC,KAAA,EAAA,EAAI,GAAA,EAAK,YAAA,EAAc,oBAAA,EAAkB,IAAA,EAAC,SAAA,EAAU,qBAAA,EACnD,QAAA,kBAAA,IAAA,CAAC,UAAA,EAAA,EAAW,WAAA,EAAY,YAAA,EAAa,WAAU,gBAAA,EAC5C,QAAA,EAAA;AAAA,IAAA,cAAA,oBACC,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,KAAA,EAAA,EAAM,EAAA,EAAG,YAAA,EAAa,OAAA,EAAS,GAAA,EAAK,WAAA,EAAY,KAAA,EAC/C,QAAA,kBAAA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,qDAAA,EAAuD,QAAA,EAAA,cAAA,EAAe,CAAA,EACvF,CAAA;AAAA,sBACA,GAAA,CAAC,cAAA,EAAA,EAAe,OAAA,EAAQ,MAAA,EAAO;AAAA,KAAA,EACjC,CAAA;AAAA,oBAEF,GAAA,CAAC,SAAM,EAAA,EAAG,YAAA,EAAa,SAAS,GAAA,EAAK,SAAA,EAAU,iCAC5C,QAAA,EACH,CAAA;AAAA,IACC,iCACC,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,cAAA,EAAA,EAAe,SAAQ,MAAA,EAAO,CAAA;AAAA,0BAC9B,KAAA,EAAA,EAAM,EAAA,EAAG,cAAa,OAAA,EAAS,GAAA,EAAK,aAAY,KAAA,EAC/C,QAAA,kBAAA,GAAA;AAAA,QAAC,KAAA;AAAA,QAAA;AAAA,UACC,GAAA,EAAK,gBAAA;AAAA,UACL,gBAAA,EAAc,IAAA;AAAA,UACd,SAAA,EAAU,uFAAA;AAAA,UAET,QAAA,EAAA;AAAA;AAAA,OACH,EACF;AAAA,KAAA,EACF;AAAA,GAAA,EAEJ,CAAA,EACF,CAAA;AAEJ;;;;"}

package/dist/domains/traces/components/trace-data-panel.cjs.js

@@ -9,10 +9,10 @@ require('lucide-react');
 require('@mastra/react');
 require('@tanstack/react-query');
 require('../../../Button-CXhSUBxN.cjs');
+require('../../../keyboard/keyboard-shortcuts-context.cjs.js');
 require('../../../lib/framework.cjs.js');
 require('@mastra/core/utils/safe-stringify');
 require('../../../field-control-aria-WzMGs0A4.cjs');
-require('../../../toast-nm-fM7BR.cjs');
 const domains_scores_hooks_useScorers = require('../../scores/hooks/use-scorers.cjs.js');
 const domains_traces_components_traceDataPanelView = require('./trace-data-panel-view.cjs.js');
 const dialog = require('../../../dialog-d_AK1NQD.cjs');

package/dist/domains/traces/components/trace-data-panel.es.js

@@ -5,10 +5,10 @@ import 'lucide-react';
 import '@mastra/react';
 import '@tanstack/react-query';
 import '../../../Button-D43ghVKt.js';
+import '../../../keyboard/keyboard-shortcuts-context.es.js';
 import '../../../lib/framework.es.js';
 import '@mastra/core/utils/safe-stringify';
 import '../../../field-control-aria-DB6y41tQ.js';
-import '../../../toast-c5kCpyWt.js';
 import { useScorers } from '../../scores/hooks/use-scorers.es.js';
 import { TraceDataPanelView } from './trace-data-panel-view.es.js';
 import { D as Dialog, d as DialogContent, g as DialogHeader, j as DialogTitle } from '../../../dialog-Dt5kASkl.js';

package/dist/domains/traces/components/trace-id-button.cjs.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
-const dataPanel = require('../../../data-panel-o-QLWuFV.cjs');
+const dataPanel = require('../../../data-panel-YCvno_Di.cjs');
 
 function TraceIdButton({ id }) {
   return /* @__PURE__ */ jsxRuntime.jsx(dataPanel.DataPanel.CopyId, { id });

package/dist/domains/traces/components/trace-id-button.es.js

@@ -1,5 +1,5 @@
 import { jsx } from 'react/jsx-runtime';
-import { D as DataPanel } from '../../../data-panel-CbomKGJt.js';
+import { D as DataPanel } from '../../../data-panel-CKvpHRUM.js';
 
 function TraceIdButton({ id }) {
   return /* @__PURE__ */ jsx(DataPanel.CopyId, { id });

package/dist/domains/traces/components/trace-messages-panel.cjs.js

@@ -3,25 +3,11 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
-const lucideReact = require('lucide-react');
 const domains_traces_components_traceThreadItemView = require('./trace-thread-item-view.cjs.js');
-const domains_traces_hooks_useThreadHasOtherTraces = require('../hooks/use-thread-has-other-traces.cjs.js');
-const Button = require('../../../Button-CXhSUBxN.cjs');
 const utils_cn = require('../../../cn-DG0X1KEP.cjs');
 
-function TraceMessagesPanel({
-  traceId,
-  threadId,
-  className,
-  onViewFullThread,
-  onHighlightSpans
-}) {
-  const hasOtherTraces = domains_traces_hooks_useThreadHasOtherTraces.useThreadHasOtherTraces(threadId);
-  const showFullThreadAction = hasOtherTraces && !!onViewFullThread;
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-testid": "messages-panel", className: utils_cn.cn("flex h-full min-h-0 flex-col", className), children: [
-    showFullThreadAction && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-center px-4 pt-4", children: /* @__PURE__ */ jsxRuntime.jsx(Button.Button, { icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MessagesSquareIcon, {}), variant: "ghost", size: "sm", onClick: onViewFullThread, children: "Open full thread" }) }),
-    /* @__PURE__ */ jsxRuntime.jsx(domains_traces_components_traceThreadItemView.TraceThreadItemView, { traceId, onHighlightSpans })
-  ] });
+function TraceMessagesPanel({ traceId, className, onHighlightSpans }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { "data-testid": "messages-panel", className: utils_cn.cn("flex h-full min-h-0 flex-col", className), children: /* @__PURE__ */ jsxRuntime.jsx(domains_traces_components_traceThreadItemView.TraceThreadItemView, { traceId, onHighlightSpans }) });
 }
 
 exports.TraceMessagesPanel = TraceMessagesPanel;

package/dist/domains/traces/components/trace-messages-panel.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"trace-messages-panel.cjs.js","sources":["../../../../src/domains/traces/components/trace-messages-panel.tsx"],"sourcesContent":["import { MessagesSquareIcon } from 'lucide-react';\nimport { TraceThreadItemView } from '@/domains/traces/components/trace-thread-item-view';\nimport { useThreadHasOtherTraces } from '@/domains/traces/hooks/use-thread-has-other-traces';\nimport { Button } from '@/ds/components/Button';\nimport { cn } from '@/utils/cn';\n\nexport interface TraceMessagesPanelProps {\n  traceId: string;\n  /** Memory thread the trace belongs to; used to decide whether a full-thread action is worth showing. */\n  threadId?: string;\n  className?: string;\n  /** Opens the full thread in place. */\n  onViewFullThread?: () => void;\n  /** Called with the span ids behind a reconstructed message when the user asks to highlight them. */\n  onHighlightSpans?: (spanIds: string[]) => void;\n}\n\n/**\n * The \"Messages\" view of the trace side column: the trace rendered as one\n * reconstructed agent turn, with an \"Open full thread\" entry point at the top of\n * the conversation when the thread has more turns than this one.\n */\nexport function TraceMessagesPanel({\n  traceId,\n  threadId,\n  className,\n  onViewFullThread,\n  onHighlightSpans,\n}: TraceMessagesPanelProps) {\n  // A single-trace thread would show exactly what the column already shows.\n  const hasOtherTraces = useThreadHasOtherTraces(threadId);\n  const showFullThreadAction = hasOtherTraces && !!onViewFullThread;\n\n  return (\n    <div data-testid=\"messages-panel\" className={cn('flex h-full min-h-0 flex-col', className)}>\n      {showFullThreadAction && (\n        <div className=\"flex justify-center px-4 pt-4\">\n          <Button icon={<MessagesSquareIcon />} variant=\"ghost\" size=\"sm\" onClick={onViewFullThread}>\n            Open full thread\n          </Button>\n        </div>\n      )}\n      <TraceThreadItemView traceId={traceId} onHighlightSpans={onHighlightSpans} />\n    </div>\n  );\n}\n"],"names":["useThreadHasOtherTraces","jsxs","cn","jsx","Button","MessagesSquareIcon","TraceThreadItemView"],"mappings":";;;;;;;;;;;AAsBO,SAAS,kBAAA,CAAmB;AAAA,EACjC,OAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AAAA,EACA,gBAAA;AAAA,EACA;AACF,CAAA,EAA4B;AAE1B,EAAA,MAAM,cAAA,GAAiBA,qEAAwB,QAAQ,CAAA;AACvD,EAAA,MAAM,oBAAA,GAAuB,cAAA,IAAkB,CAAC,CAAC,gBAAA;AAEjD,EAAA,uBACEC,eAAA,CAAC,SAAI,aAAA,EAAY,gBAAA,EAAiB,WAAWC,WAAA,CAAG,8BAAA,EAAgC,SAAS,CAAA,EACtF,QAAA,EAAA;AAAA,IAAA,oBAAA,mCACE,KAAA,EAAA,EAAI,SAAA,EAAU,+BAAA,EACb,QAAA,kBAAAC,cAAA,CAACC,iBAAO,IAAA,kBAAMD,cAAA,CAACE,8BAAA,EAAA,EAAmB,CAAA,EAAI,SAAQ,OAAA,EAAQ,IAAA,EAAK,MAAK,OAAA,EAAS,gBAAA,EAAkB,8BAE3F,CAAA,EACF,CAAA;AAAA,oBAEFF,cAAA,CAACG,iEAAA,EAAA,EAAoB,OAAA,EAAkB,gBAAA,EAAoC;AAAA,GAAA,EAC7E,CAAA;AAEJ;;;;"}
+{"version":3,"file":"trace-messages-panel.cjs.js","sources":["../../../../src/domains/traces/components/trace-messages-panel.tsx"],"sourcesContent":["import { TraceThreadItemView } from '@/domains/traces/components/trace-thread-item-view';\nimport { cn } from '@/utils/cn';\n\nexport interface TraceMessagesPanelProps {\n  traceId: string;\n  className?: string;\n  /** Called with the span ids behind a reconstructed message when the user asks to highlight them. */\n  onHighlightSpans?: (spanIds: string[]) => void;\n}\n\n/** The \"Messages\" view of the trace side column: the trace rendered as one reconstructed agent turn. */\nexport function TraceMessagesPanel({ traceId, className, onHighlightSpans }: TraceMessagesPanelProps) {\n  return (\n    <div data-testid=\"messages-panel\" className={cn('flex h-full min-h-0 flex-col', className)}>\n      <TraceThreadItemView traceId={traceId} onHighlightSpans={onHighlightSpans} />\n    </div>\n  );\n}\n"],"names":["jsx","cn","TraceThreadItemView"],"mappings":";;;;;;;;AAWO,SAAS,kBAAA,CAAmB,EAAE,OAAA,EAAS,SAAA,EAAW,kBAAiB,EAA4B;AACpG,EAAA,uBACEA,cAAA,CAAC,KAAA,EAAA,EAAI,aAAA,EAAY,gBAAA,EAAiB,SAAA,EAAWC,WAAA,CAAG,8BAAA,EAAgC,SAAS,CAAA,EACvF,QAAA,kBAAAD,cAAA,CAACE,iEAAA,EAAA,EAAoB,OAAA,EAAkB,kBAAoC,CAAA,EAC7E,CAAA;AAEJ;;;;"}

package/dist/domains/traces/components/trace-messages-panel.es.js

@@ -1,23 +1,9 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { MessagesSquareIcon } from 'lucide-react';
+import { jsx } from 'react/jsx-runtime';
 import { TraceThreadItemView } from './trace-thread-item-view.es.js';
-import { useThreadHasOtherTraces } from '../hooks/use-thread-has-other-traces.es.js';
-import { B as Button } from '../../../Button-D43ghVKt.js';
 import { c as cn } from '../../../cn-65Adrsfj.js';
 
-function TraceMessagesPanel({
-  traceId,
-  threadId,
-  className,
-  onViewFullThread,
-  onHighlightSpans
-}) {
-  const hasOtherTraces = useThreadHasOtherTraces(threadId);
-  const showFullThreadAction = hasOtherTraces && !!onViewFullThread;
-  return /* @__PURE__ */ jsxs("div", { "data-testid": "messages-panel", className: cn("flex h-full min-h-0 flex-col", className), children: [
-    showFullThreadAction && /* @__PURE__ */ jsx("div", { className: "flex justify-center px-4 pt-4", children: /* @__PURE__ */ jsx(Button, { icon: /* @__PURE__ */ jsx(MessagesSquareIcon, {}), variant: "ghost", size: "sm", onClick: onViewFullThread, children: "Open full thread" }) }),
-    /* @__PURE__ */ jsx(TraceThreadItemView, { traceId, onHighlightSpans })
-  ] });
+function TraceMessagesPanel({ traceId, className, onHighlightSpans }) {
+  return /* @__PURE__ */ jsx("div", { "data-testid": "messages-panel", className: cn("flex h-full min-h-0 flex-col", className), children: /* @__PURE__ */ jsx(TraceThreadItemView, { traceId, onHighlightSpans }) });
 }
 
 export { TraceMessagesPanel };

package/dist/domains/traces/components/trace-messages-panel.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"trace-messages-panel.es.js","sources":["../../../../src/domains/traces/components/trace-messages-panel.tsx"],"sourcesContent":["import { MessagesSquareIcon } from 'lucide-react';\nimport { TraceThreadItemView } from '@/domains/traces/components/trace-thread-item-view';\nimport { useThreadHasOtherTraces } from '@/domains/traces/hooks/use-thread-has-other-traces';\nimport { Button } from '@/ds/components/Button';\nimport { cn } from '@/utils/cn';\n\nexport interface TraceMessagesPanelProps {\n  traceId: string;\n  /** Memory thread the trace belongs to; used to decide whether a full-thread action is worth showing. */\n  threadId?: string;\n  className?: string;\n  /** Opens the full thread in place. */\n  onViewFullThread?: () => void;\n  /** Called with the span ids behind a reconstructed message when the user asks to highlight them. */\n  onHighlightSpans?: (spanIds: string[]) => void;\n}\n\n/**\n * The \"Messages\" view of the trace side column: the trace rendered as one\n * reconstructed agent turn, with an \"Open full thread\" entry point at the top of\n * the conversation when the thread has more turns than this one.\n */\nexport function TraceMessagesPanel({\n  traceId,\n  threadId,\n  className,\n  onViewFullThread,\n  onHighlightSpans,\n}: TraceMessagesPanelProps) {\n  // A single-trace thread would show exactly what the column already shows.\n  const hasOtherTraces = useThreadHasOtherTraces(threadId);\n  const showFullThreadAction = hasOtherTraces && !!onViewFullThread;\n\n  return (\n    <div data-testid=\"messages-panel\" className={cn('flex h-full min-h-0 flex-col', className)}>\n      {showFullThreadAction && (\n        <div className=\"flex justify-center px-4 pt-4\">\n          <Button icon={<MessagesSquareIcon />} variant=\"ghost\" size=\"sm\" onClick={onViewFullThread}>\n            Open full thread\n          </Button>\n        </div>\n      )}\n      <TraceThreadItemView traceId={traceId} onHighlightSpans={onHighlightSpans} />\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;;;;AAsBO,SAAS,kBAAA,CAAmB;AAAA,EACjC,OAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AAAA,EACA,gBAAA;AAAA,EACA;AACF,CAAA,EAA4B;AAE1B,EAAA,MAAM,cAAA,GAAiB,wBAAwB,QAAQ,CAAA;AACvD,EAAA,MAAM,oBAAA,GAAuB,cAAA,IAAkB,CAAC,CAAC,gBAAA;AAEjD,EAAA,uBACE,IAAA,CAAC,SAAI,aAAA,EAAY,gBAAA,EAAiB,WAAW,EAAA,CAAG,8BAAA,EAAgC,SAAS,CAAA,EACtF,QAAA,EAAA;AAAA,IAAA,oBAAA,wBACE,KAAA,EAAA,EAAI,SAAA,EAAU,+BAAA,EACb,QAAA,kBAAA,GAAA,CAAC,UAAO,IAAA,kBAAM,GAAA,CAAC,kBAAA,EAAA,EAAmB,CAAA,EAAI,SAAQ,OAAA,EAAQ,IAAA,EAAK,MAAK,OAAA,EAAS,gBAAA,EAAkB,8BAE3F,CAAA,EACF,CAAA;AAAA,oBAEF,GAAA,CAAC,mBAAA,EAAA,EAAoB,OAAA,EAAkB,gBAAA,EAAoC;AAAA,GAAA,EAC7E,CAAA;AAEJ;;;;"}
+{"version":3,"file":"trace-messages-panel.es.js","sources":["../../../../src/domains/traces/components/trace-messages-panel.tsx"],"sourcesContent":["import { TraceThreadItemView } from '@/domains/traces/components/trace-thread-item-view';\nimport { cn } from '@/utils/cn';\n\nexport interface TraceMessagesPanelProps {\n  traceId: string;\n  className?: string;\n  /** Called with the span ids behind a reconstructed message when the user asks to highlight them. */\n  onHighlightSpans?: (spanIds: string[]) => void;\n}\n\n/** The \"Messages\" view of the trace side column: the trace rendered as one reconstructed agent turn. */\nexport function TraceMessagesPanel({ traceId, className, onHighlightSpans }: TraceMessagesPanelProps) {\n  return (\n    <div data-testid=\"messages-panel\" className={cn('flex h-full min-h-0 flex-col', className)}>\n      <TraceThreadItemView traceId={traceId} onHighlightSpans={onHighlightSpans} />\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;AAWO,SAAS,kBAAA,CAAmB,EAAE,OAAA,EAAS,SAAA,EAAW,kBAAiB,EAA4B;AACpG,EAAA,uBACE,GAAA,CAAC,KAAA,EAAA,EAAI,aAAA,EAAY,gBAAA,EAAiB,SAAA,EAAW,EAAA,CAAG,8BAAA,EAAgC,SAAS,CAAA,EACvF,QAAA,kBAAA,GAAA,CAAC,mBAAA,EAAA,EAAoB,OAAA,EAAkB,kBAAoC,CAAA,EAC7E,CAAA;AAEJ;;;;"}

package/dist/domains/traces/components/trace-messages-skeleton.cjs.js

@@ -6,26 +6,29 @@ const jsxRuntime = require('react/jsx-runtime');
 const skeleton = require('../../../skeleton-cXUjPrq9.cjs');
 const utils_cn = require('../../../cn-DG0X1KEP.cjs');
 
-function TraceMessagesSkeleton({ className }) {
+function BodyLine({ width }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-5 items-center", children: /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-3.5", style: { width } }) });
+}
+function TraceMessagesSkeleton({ className, delayed = true }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
       role: "status",
       "aria-label": "Loading messages",
-      className: utils_cn.cn("animate-in p-4 delay-500 duration-200 fade-in-0 fill-mode-backwards", className),
-      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mx-auto flex w-full max-w-3xl flex-col gap-4", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "ml-auto h-9 w-[60%] rounded-xl" }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-3.5 w-[90%]" }),
-          /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-3.5 w-[75%]" }),
-          /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-3.5 w-[85%]" }),
-          /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-3.5 w-[40%]" })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-8 w-[55%] rounded-lg" }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-3.5 w-[80%]" }),
-          /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "h-3.5 w-[50%]" })
-        ] })
+      className: utils_cn.cn(
+        "min-w-0 p-4",
+        delayed && "animate-in delay-500 duration-200 fade-in-0 fill-mode-backwards",
+        className
+      ),
+      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mx-auto flex w-full max-w-3xl flex-col", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "mb-3 ml-auto h-[38px] w-[60%] max-w-[70%] rounded-xl" }),
+        /* @__PURE__ */ jsxRuntime.jsx(BodyLine, { width: "90%" }),
+        /* @__PURE__ */ jsxRuntime.jsx(BodyLine, { width: "75%" }),
+        /* @__PURE__ */ jsxRuntime.jsx(BodyLine, { width: "85%" }),
+        /* @__PURE__ */ jsxRuntime.jsx(BodyLine, { width: "40%" }),
+        /* @__PURE__ */ jsxRuntime.jsx(skeleton.Skeleton, { className: "my-2.5 h-7 w-[55%] rounded-md" }),
+        /* @__PURE__ */ jsxRuntime.jsx(BodyLine, { width: "80%" }),
+        /* @__PURE__ */ jsxRuntime.jsx(BodyLine, { width: "50%" })
       ] })
     }
   );

package/dist/domains/traces/components/trace-messages-skeleton.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"trace-messages-skeleton.cjs.js","sources":["../../../../src/domains/traces/components/trace-messages-skeleton.tsx"],"sourcesContent":["import { Skeleton } from '@/ds/components/Skeleton';\nimport { cn } from '@/utils/cn';\n\nexport interface TraceMessagesSkeletonProps {\n  className?: string;\n}\n\n/**\n * Same layout as `TraceThreadItemView` once it resolves — `p-4`, `max-w-3xl`, a user bubble on\n * the right then assistant text on the left — so the column keeps its shape while spans load.\n *\n * Stays invisible for the first 500ms (`delay-500` + `fill-mode-backwards`) so cached or fast\n * responses swap straight to content without a skeleton flash.\n */\nexport function TraceMessagesSkeleton({ className }: TraceMessagesSkeletonProps) {\n  return (\n    <div\n      role=\"status\"\n      aria-label=\"Loading messages\"\n      className={cn('animate-in p-4 delay-500 duration-200 fade-in-0 fill-mode-backwards', className)}\n    >\n      <div className=\"mx-auto flex w-full max-w-3xl flex-col gap-4\">\n        <Skeleton className=\"ml-auto h-9 w-[60%] rounded-xl\" />\n        <div className=\"flex flex-col gap-2\">\n          <Skeleton className=\"h-3.5 w-[90%]\" />\n          <Skeleton className=\"h-3.5 w-[75%]\" />\n          <Skeleton className=\"h-3.5 w-[85%]\" />\n          <Skeleton className=\"h-3.5 w-[40%]\" />\n        </div>\n        <Skeleton className=\"h-8 w-[55%] rounded-lg\" />\n        <div className=\"flex flex-col gap-2\">\n          <Skeleton className=\"h-3.5 w-[80%]\" />\n          <Skeleton className=\"h-3.5 w-[50%]\" />\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"names":["jsx","cn","jsxs","Skeleton"],"mappings":";;;;;;;;AAcO,SAAS,qBAAA,CAAsB,EAAE,SAAA,EAAU,EAA+B;AAC/E,EAAA,uBACEA,cAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,IAAA,EAAK,QAAA;AAAA,MACL,YAAA,EAAW,kBAAA;AAAA,MACX,SAAA,EAAWC,WAAA,CAAG,qEAAA,EAAuE,SAAS,CAAA;AAAA,MAE9F,QAAA,kBAAAC,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,8CAAA,EACb,QAAA,EAAA;AAAA,wBAAAF,cAAA,CAACG,iBAAA,EAAA,EAAS,WAAU,gCAAA,EAAiC,CAAA;AAAA,wBACrDD,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,qBAAA,EACb,QAAA,EAAA;AAAA,0BAAAF,cAAA,CAACG,iBAAA,EAAA,EAAS,WAAU,eAAA,EAAgB,CAAA;AAAA,0BACpCH,cAAA,CAACG,iBAAA,EAAA,EAAS,SAAA,EAAU,eAAA,EAAgB,CAAA;AAAA,0BACpCH,cAAA,CAACG,iBAAA,EAAA,EAAS,SAAA,EAAU,eAAA,EAAgB,CAAA;AAAA,0BACpCH,cAAA,CAACG,iBAAA,EAAA,EAAS,SAAA,EAAU,eAAA,EAAgB;AAAA,SAAA,EACtC,CAAA;AAAA,wBACAH,cAAA,CAACG,iBAAA,EAAA,EAAS,SAAA,EAAU,wBAAA,EAAyB,CAAA;AAAA,wBAC7CD,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,qBAAA,EACb,QAAA,EAAA;AAAA,0BAAAF,cAAA,CAACG,iBAAA,EAAA,EAAS,WAAU,eAAA,EAAgB,CAAA;AAAA,0BACpCH,cAAA,CAACG,iBAAA,EAAA,EAAS,SAAA,EAAU,eAAA,EAAgB;AAAA,SAAA,EACtC;AAAA,OAAA,EACF;AAAA;AAAA,GACF;AAEJ;;;;"}
+{"version":3,"file":"trace-messages-skeleton.cjs.js","sources":["../../../../src/domains/traces/components/trace-messages-skeleton.tsx"],"sourcesContent":["import { Skeleton } from '@/ds/components/Skeleton';\nimport { cn } from '@/utils/cn';\n\nexport interface TraceMessagesSkeletonProps {\n  className?: string;\n  /**\n   * Hold the skeleton invisible for its first 500ms (`delay-500` + `fill-mode-backwards`) so cached or fast\n   * responses swap straight to content without a flash. Turn off when a parent skeleton already handles the delay.\n   */\n  delayed?: boolean;\n}\n\n/** One `text-body` line box (14px × 143% ≈ 20px) holding a bar. */\nfunction BodyLine({ width }: { width: string }) {\n  return (\n    <div className=\"flex h-5 items-center\">\n      <Skeleton className=\"h-3.5\" style={{ width }} />\n    </div>\n  );\n}\n\n/**\n * Same layout as `TraceThreadItemView` once it resolves — `p-4`, `max-w-3xl`, a user bubble on the right\n * (`Message`: `px-4 py-2` + border around one body line, `my-3` with the leading margin stripped), assistant\n * body lines, then a one-line tool activity (`py-1` + caption line) — so the column keeps its shape while spans load.\n */\nexport function TraceMessagesSkeleton({ className, delayed = true }: TraceMessagesSkeletonProps) {\n  return (\n    <div\n      role=\"status\"\n      aria-label=\"Loading messages\"\n      className={cn(\n        'min-w-0 p-4',\n        delayed && 'animate-in delay-500 duration-200 fade-in-0 fill-mode-backwards',\n        className,\n      )}\n    >\n      <div className=\"mx-auto flex w-full max-w-3xl flex-col\">\n        <Skeleton className=\"mb-3 ml-auto h-[38px] w-[60%] max-w-[70%] rounded-xl\" />\n        <BodyLine width=\"90%\" />\n        <BodyLine width=\"75%\" />\n        <BodyLine width=\"85%\" />\n        <BodyLine width=\"40%\" />\n        <Skeleton className=\"my-2.5 h-7 w-[55%] rounded-md\" />\n        <BodyLine width=\"80%\" />\n        <BodyLine width=\"50%\" />\n      </div>\n    </div>\n  );\n}\n"],"names":["jsx","Skeleton","cn","jsxs"],"mappings":";;;;;;;;AAaA,SAAS,QAAA,CAAS,EAAE,KAAA,EAAM,EAAsB;AAC9C,EAAA,uBACEA,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,uBAAA,EACb,QAAA,kBAAAA,cAAA,CAACC,iBAAA,EAAA,EAAS,SAAA,EAAU,OAAA,EAAQ,KAAA,EAAO,EAAE,KAAA,EAAM,EAAG,CAAA,EAChD,CAAA;AAEJ;AAOO,SAAS,qBAAA,CAAsB,EAAE,SAAA,EAAW,OAAA,GAAU,MAAK,EAA+B;AAC/F,EAAA,uBACED,cAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,IAAA,EAAK,QAAA;AAAA,MACL,YAAA,EAAW,kBAAA;AAAA,MACX,SAAA,EAAWE,WAAA;AAAA,QACT,aAAA;AAAA,QACA,OAAA,IAAW,iEAAA;AAAA,QACX;AAAA,OACF;AAAA,MAEA,QAAA,kBAAAC,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,wCAAA,EACb,QAAA,EAAA;AAAA,wBAAAH,cAAA,CAACC,iBAAA,EAAA,EAAS,WAAU,sDAAA,EAAuD,CAAA;AAAA,wBAC3ED,cAAA,CAAC,QAAA,EAAA,EAAS,KAAA,EAAM,KAAA,EAAM,CAAA;AAAA,wBACtBA,cAAA,CAAC,QAAA,EAAA,EAAS,KAAA,EAAM,KAAA,EAAM,CAAA;AAAA,wBACtBA,cAAA,CAAC,QAAA,EAAA,EAAS,KAAA,EAAM,KAAA,EAAM,CAAA;AAAA,wBACtBA,cAAA,CAAC,QAAA,EAAA,EAAS,KAAA,EAAM,KAAA,EAAM,CAAA;AAAA,wBACtBA,cAAA,CAACC,iBAAA,EAAA,EAAS,SAAA,EAAU,+BAAA,EAAgC,CAAA;AAAA,wBACpDD,cAAA,CAAC,QAAA,EAAA,EAAS,KAAA,EAAM,KAAA,EAAM,CAAA;AAAA,wBACtBA,cAAA,CAAC,QAAA,EAAA,EAAS,KAAA,EAAM,KAAA,EAAM;AAAA,OAAA,EACxB;AAAA;AAAA,GACF;AAEJ;;;;"}

package/dist/domains/traces/components/trace-messages-skeleton.es.js

@@ -2,26 +2,29 @@ import { jsx, jsxs } from 'react/jsx-runtime';
 import { S as Skeleton } from '../../../skeleton-BsRAXyh5.js';
 import { c as cn } from '../../../cn-65Adrsfj.js';
 
-function TraceMessagesSkeleton({ className }) {
+function BodyLine({ width }) {
+  return /* @__PURE__ */ jsx("div", { className: "flex h-5 items-center", children: /* @__PURE__ */ jsx(Skeleton, { className: "h-3.5", style: { width } }) });
+}
+function TraceMessagesSkeleton({ className, delayed = true }) {
   return /* @__PURE__ */ jsx(
     "div",
     {
       role: "status",
       "aria-label": "Loading messages",
-      className: cn("animate-in p-4 delay-500 duration-200 fade-in-0 fill-mode-backwards", className),
-      children: /* @__PURE__ */ jsxs("div", { className: "mx-auto flex w-full max-w-3xl flex-col gap-4", children: [
-        /* @__PURE__ */ jsx(Skeleton, { className: "ml-auto h-9 w-[60%] rounded-xl" }),
-        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
-          /* @__PURE__ */ jsx(Skeleton, { className: "h-3.5 w-[90%]" }),
-          /* @__PURE__ */ jsx(Skeleton, { className: "h-3.5 w-[75%]" }),
-          /* @__PURE__ */ jsx(Skeleton, { className: "h-3.5 w-[85%]" }),
-          /* @__PURE__ */ jsx(Skeleton, { className: "h-3.5 w-[40%]" })
-        ] }),
-        /* @__PURE__ */ jsx(Skeleton, { className: "h-8 w-[55%] rounded-lg" }),
-        /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
-          /* @__PURE__ */ jsx(Skeleton, { className: "h-3.5 w-[80%]" }),
-          /* @__PURE__ */ jsx(Skeleton, { className: "h-3.5 w-[50%]" })
-        ] })
+      className: cn(
+        "min-w-0 p-4",
+        delayed && "animate-in delay-500 duration-200 fade-in-0 fill-mode-backwards",
+        className
+      ),
+      children: /* @__PURE__ */ jsxs("div", { className: "mx-auto flex w-full max-w-3xl flex-col", children: [
+        /* @__PURE__ */ jsx(Skeleton, { className: "mb-3 ml-auto h-[38px] w-[60%] max-w-[70%] rounded-xl" }),
+        /* @__PURE__ */ jsx(BodyLine, { width: "90%" }),
+        /* @__PURE__ */ jsx(BodyLine, { width: "75%" }),
+        /* @__PURE__ */ jsx(BodyLine, { width: "85%" }),
+        /* @__PURE__ */ jsx(BodyLine, { width: "40%" }),
+        /* @__PURE__ */ jsx(Skeleton, { className: "my-2.5 h-7 w-[55%] rounded-md" }),
+        /* @__PURE__ */ jsx(BodyLine, { width: "80%" }),
+        /* @__PURE__ */ jsx(BodyLine, { width: "50%" })
       ] })
     }
   );

package/dist/domains/traces/components/trace-messages-skeleton.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"trace-messages-skeleton.es.js","sources":["../../../../src/domains/traces/components/trace-messages-skeleton.tsx"],"sourcesContent":["import { Skeleton } from '@/ds/components/Skeleton';\nimport { cn } from '@/utils/cn';\n\nexport interface TraceMessagesSkeletonProps {\n  className?: string;\n}\n\n/**\n * Same layout as `TraceThreadItemView` once it resolves — `p-4`, `max-w-3xl`, a user bubble on\n * the right then assistant text on the left — so the column keeps its shape while spans load.\n *\n * Stays invisible for the first 500ms (`delay-500` + `fill-mode-backwards`) so cached or fast\n * responses swap straight to content without a skeleton flash.\n */\nexport function TraceMessagesSkeleton({ className }: TraceMessagesSkeletonProps) {\n  return (\n    <div\n      role=\"status\"\n      aria-label=\"Loading messages\"\n      className={cn('animate-in p-4 delay-500 duration-200 fade-in-0 fill-mode-backwards', className)}\n    >\n      <div className=\"mx-auto flex w-full max-w-3xl flex-col gap-4\">\n        <Skeleton className=\"ml-auto h-9 w-[60%] rounded-xl\" />\n        <div className=\"flex flex-col gap-2\">\n          <Skeleton className=\"h-3.5 w-[90%]\" />\n          <Skeleton className=\"h-3.5 w-[75%]\" />\n          <Skeleton className=\"h-3.5 w-[85%]\" />\n          <Skeleton className=\"h-3.5 w-[40%]\" />\n        </div>\n        <Skeleton className=\"h-8 w-[55%] rounded-lg\" />\n        <div className=\"flex flex-col gap-2\">\n          <Skeleton className=\"h-3.5 w-[80%]\" />\n          <Skeleton className=\"h-3.5 w-[50%]\" />\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;AAcO,SAAS,qBAAA,CAAsB,EAAE,SAAA,EAAU,EAA+B;AAC/E,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,IAAA,EAAK,QAAA;AAAA,MACL,YAAA,EAAW,kBAAA;AAAA,MACX,SAAA,EAAW,EAAA,CAAG,qEAAA,EAAuE,SAAS,CAAA;AAAA,MAE9F,QAAA,kBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,8CAAA,EACb,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,QAAA,EAAA,EAAS,WAAU,gCAAA,EAAiC,CAAA;AAAA,wBACrD,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,qBAAA,EACb,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,QAAA,EAAA,EAAS,WAAU,eAAA,EAAgB,CAAA;AAAA,0BACpC,GAAA,CAAC,QAAA,EAAA,EAAS,SAAA,EAAU,eAAA,EAAgB,CAAA;AAAA,0BACpC,GAAA,CAAC,QAAA,EAAA,EAAS,SAAA,EAAU,eAAA,EAAgB,CAAA;AAAA,0BACpC,GAAA,CAAC,QAAA,EAAA,EAAS,SAAA,EAAU,eAAA,EAAgB;AAAA,SAAA,EACtC,CAAA;AAAA,wBACA,GAAA,CAAC,QAAA,EAAA,EAAS,SAAA,EAAU,wBAAA,EAAyB,CAAA;AAAA,wBAC7C,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,qBAAA,EACb,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,QAAA,EAAA,EAAS,WAAU,eAAA,EAAgB,CAAA;AAAA,0BACpC,GAAA,CAAC,QAAA,EAAA,EAAS,SAAA,EAAU,eAAA,EAAgB;AAAA,SAAA,EACtC;AAAA,OAAA,EACF;AAAA;AAAA,GACF;AAEJ;;;;"}
+{"version":3,"file":"trace-messages-skeleton.es.js","sources":["../../../../src/domains/traces/components/trace-messages-skeleton.tsx"],"sourcesContent":["import { Skeleton } from '@/ds/components/Skeleton';\nimport { cn } from '@/utils/cn';\n\nexport interface TraceMessagesSkeletonProps {\n  className?: string;\n  /**\n   * Hold the skeleton invisible for its first 500ms (`delay-500` + `fill-mode-backwards`) so cached or fast\n   * responses swap straight to content without a flash. Turn off when a parent skeleton already handles the delay.\n   */\n  delayed?: boolean;\n}\n\n/** One `text-body` line box (14px × 143% ≈ 20px) holding a bar. */\nfunction BodyLine({ width }: { width: string }) {\n  return (\n    <div className=\"flex h-5 items-center\">\n      <Skeleton className=\"h-3.5\" style={{ width }} />\n    </div>\n  );\n}\n\n/**\n * Same layout as `TraceThreadItemView` once it resolves — `p-4`, `max-w-3xl`, a user bubble on the right\n * (`Message`: `px-4 py-2` + border around one body line, `my-3` with the leading margin stripped), assistant\n * body lines, then a one-line tool activity (`py-1` + caption line) — so the column keeps its shape while spans load.\n */\nexport function TraceMessagesSkeleton({ className, delayed = true }: TraceMessagesSkeletonProps) {\n  return (\n    <div\n      role=\"status\"\n      aria-label=\"Loading messages\"\n      className={cn(\n        'min-w-0 p-4',\n        delayed && 'animate-in delay-500 duration-200 fade-in-0 fill-mode-backwards',\n        className,\n      )}\n    >\n      <div className=\"mx-auto flex w-full max-w-3xl flex-col\">\n        <Skeleton className=\"mb-3 ml-auto h-[38px] w-[60%] max-w-[70%] rounded-xl\" />\n        <BodyLine width=\"90%\" />\n        <BodyLine width=\"75%\" />\n        <BodyLine width=\"85%\" />\n        <BodyLine width=\"40%\" />\n        <Skeleton className=\"my-2.5 h-7 w-[55%] rounded-md\" />\n        <BodyLine width=\"80%\" />\n        <BodyLine width=\"50%\" />\n      </div>\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;AAaA,SAAS,QAAA,CAAS,EAAE,KAAA,EAAM,EAAsB;AAC9C,EAAA,uBACE,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,uBAAA,EACb,QAAA,kBAAA,GAAA,CAAC,QAAA,EAAA,EAAS,SAAA,EAAU,OAAA,EAAQ,KAAA,EAAO,EAAE,KAAA,EAAM,EAAG,CAAA,EAChD,CAAA;AAEJ;AAOO,SAAS,qBAAA,CAAsB,EAAE,SAAA,EAAW,OAAA,GAAU,MAAK,EAA+B;AAC/F,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,IAAA,EAAK,QAAA;AAAA,MACL,YAAA,EAAW,kBAAA;AAAA,MACX,SAAA,EAAW,EAAA;AAAA,QACT,aAAA;AAAA,QACA,OAAA,IAAW,iEAAA;AAAA,QACX;AAAA,OACF;AAAA,MAEA,QAAA,kBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,wCAAA,EACb,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,QAAA,EAAA,EAAS,WAAU,sDAAA,EAAuD,CAAA;AAAA,wBAC3E,GAAA,CAAC,QAAA,EAAA,EAAS,KAAA,EAAM,KAAA,EAAM,CAAA;AAAA,wBACtB,GAAA,CAAC,QAAA,EAAA,EAAS,KAAA,EAAM,KAAA,EAAM,CAAA;AAAA,wBACtB,GAAA,CAAC,QAAA,EAAA,EAAS,KAAA,EAAM,KAAA,EAAM,CAAA;AAAA,wBACtB,GAAA,CAAC,QAAA,EAAA,EAAS,KAAA,EAAM,KAAA,EAAM,CAAA;AAAA,wBACtB,GAAA,CAAC,QAAA,EAAA,EAAS,SAAA,EAAU,+BAAA,EAAgC,CAAA;AAAA,wBACpD,GAAA,CAAC,QAAA,EAAA,EAAS,KAAA,EAAM,KAAA,EAAM,CAAA;AAAA,wBACtB,GAAA,CAAC,QAAA,EAAA,EAAS,KAAA,EAAM,KAAA,EAAM;AAAA,OAAA,EACxB;AAAA;AAAA,GACF;AAEJ;;;;"}