@mastra/playground-ui 53.0.0-alpha.8 → 53.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (224) hide show
  1. package/dist/{code-DRGJVroV.js → code-D4Vw_fYq.js} +22 -16
  2. package/dist/code-D4Vw_fYq.js.map +1 -0
  3. package/dist/{code-BJMC6T9D.cjs → code-DhrdtZce.cjs} +22 -15
  4. package/dist/code-DhrdtZce.cjs.map +1 -0
  5. package/dist/{code-block-CBJhDEeB.js → code-block-DeksY23p.js} +2 -2
  6. package/dist/{code-block-CBJhDEeB.js.map → code-block-DeksY23p.js.map} +1 -1
  7. package/dist/{code-block-fmv8bHoT.cjs → code-block-DgHrBuR8.cjs} +2 -2
  8. package/dist/{code-block-fmv8bHoT.cjs.map → code-block-DgHrBuR8.cjs.map} +1 -1
  9. package/dist/{code-diff-C-EHXZyK.cjs → code-diff-CHZ3P1ky.cjs} +51 -43
  10. package/dist/code-diff-CHZ3P1ky.cjs.map +1 -0
  11. package/dist/{code-diff-BB4sqHpq.js → code-diff-CIRbnIfl.js} +52 -44
  12. package/dist/code-diff-CIRbnIfl.js.map +1 -0
  13. package/dist/{combobox-BQrlN0eB.cjs → combobox-JNWmgC13.cjs} +8 -3
  14. package/dist/combobox-JNWmgC13.cjs.map +1 -0
  15. package/dist/{combobox-DeeAlYti.js → combobox-nxjXzRWu.js} +8 -3
  16. package/dist/combobox-nxjXzRWu.js.map +1 -0
  17. package/dist/{command-DWFd0d4c.js → command-Be-KrIAX.js} +2 -2
  18. package/dist/{command-DWFd0d4c.js.map → command-Be-KrIAX.js.map} +1 -1
  19. package/dist/{command-CUev1UxH.cjs → command-DsTBCmQq.cjs} +2 -2
  20. package/dist/{command-CUev1UxH.cjs.map → command-DsTBCmQq.cjs.map} +1 -1
  21. package/dist/components/ChatShell.cjs.js +20 -1
  22. package/dist/components/ChatShell.cjs.js.map +1 -1
  23. package/dist/components/ChatShell.es.js +20 -1
  24. package/dist/components/ChatShell.es.js.map +1 -1
  25. package/dist/components/Code.cjs.js +3 -1
  26. package/dist/components/Code.cjs.js.map +1 -1
  27. package/dist/components/Code.es.js +1 -1
  28. package/dist/components/CodeBlock.cjs.js +1 -1
  29. package/dist/components/CodeBlock.es.js +1 -1
  30. package/dist/components/CodeDiff.cjs.js +1 -1
  31. package/dist/components/CodeDiff.es.js +1 -1
  32. package/dist/components/CodeEditor.cjs.js +2 -1
  33. package/dist/components/CodeEditor.cjs.js.map +1 -1
  34. package/dist/components/CodeEditor.es.js +1 -1
  35. package/dist/components/Combobox.cjs.js +1 -1
  36. package/dist/components/Combobox.es.js +1 -1
  37. package/dist/components/Command.cjs.js +1 -1
  38. package/dist/components/Command.es.js +1 -1
  39. package/dist/components/CommandPalette.cjs.js +1 -1
  40. package/dist/components/CommandPalette.es.js +1 -1
  41. package/dist/components/Comment.cjs.js +2 -2
  42. package/dist/components/Comment.cjs.js.map +1 -1
  43. package/dist/components/Comment.es.js +2 -2
  44. package/dist/components/Comment.es.js.map +1 -1
  45. package/dist/components/DataCodeSection.cjs.js +1 -1
  46. package/dist/components/DataCodeSection.es.js +1 -1
  47. package/dist/components/DataPanel.cjs.js +1 -1
  48. package/dist/components/DataPanel.es.js +1 -1
  49. package/dist/components/Dialog.cjs.js +181 -2
  50. package/dist/components/Dialog.cjs.js.map +1 -1
  51. package/dist/components/Dialog.es.js +183 -1
  52. package/dist/components/Dialog.es.js.map +1 -1
  53. package/dist/components/HorizontalBars.cjs.js +1 -1
  54. package/dist/components/HorizontalBars.es.js +1 -1
  55. package/dist/components/IntegrationDialog.cjs.js +105 -0
  56. package/dist/components/IntegrationDialog.cjs.js.map +1 -0
  57. package/dist/components/IntegrationDialog.d.ts +2 -0
  58. package/dist/components/IntegrationDialog.es.js +101 -0
  59. package/dist/components/IntegrationDialog.es.js.map +1 -0
  60. package/dist/components/LogsDataList.cjs.js +0 -1
  61. package/dist/components/LogsDataList.cjs.js.map +1 -1
  62. package/dist/components/LogsDataList.es.js +0 -1
  63. package/dist/components/LogsDataList.es.js.map +1 -1
  64. package/dist/components/MainHeader.cjs.js +1 -1
  65. package/dist/components/MainHeader.cjs.js.map +1 -1
  66. package/dist/components/MainHeader.es.js +1 -1
  67. package/dist/components/MainHeader.es.js.map +1 -1
  68. package/dist/components/MarkdownRenderer.cjs.js +1 -1
  69. package/dist/components/MarkdownRenderer.es.js +1 -1
  70. package/dist/components/PropertyFilter.cjs.js +1 -1
  71. package/dist/components/PropertyFilter.es.js +1 -1
  72. package/dist/components/ThreadRail.cjs.js +19 -0
  73. package/dist/components/ThreadRail.cjs.js.map +1 -1
  74. package/dist/components/ThreadRail.es.js +19 -1
  75. package/dist/components/ThreadRail.es.js.map +1 -1
  76. package/dist/components/ai/plan.cjs.js +1 -1
  77. package/dist/components/ai/plan.es.js +1 -1
  78. package/dist/components/ai/tool-call.cjs.js +165 -0
  79. package/dist/components/ai/tool-call.cjs.js.map +1 -1
  80. package/dist/components/ai/tool-call.es.js +159 -3
  81. package/dist/components/ai/tool-call.es.js.map +1 -1
  82. package/dist/{data-code-section-Dn9smaz4.cjs → data-code-section-B_lg_J_0.cjs} +34 -5
  83. package/dist/data-code-section-B_lg_J_0.cjs.map +1 -0
  84. package/dist/{data-code-section-DN2yPgEz.js → data-code-section-Cm_W_XhO.js} +36 -7
  85. package/dist/data-code-section-Cm_W_XhO.js.map +1 -0
  86. package/dist/{data-panel-DEatwExN.cjs → data-panel-Cv9j_IGQ.cjs} +2 -2
  87. package/dist/{data-panel-DEatwExN.cjs.map → data-panel-Cv9j_IGQ.cjs.map} +1 -1
  88. package/dist/{data-panel-2Da0Utgy.js → data-panel-DXxeSnL1.js} +2 -2
  89. package/dist/{data-panel-2Da0Utgy.js.map → data-panel-DXxeSnL1.js.map} +1 -1
  90. package/dist/dialog-CZMPDVUj.js +259 -0
  91. package/dist/dialog-CZMPDVUj.js.map +1 -0
  92. package/dist/dialog-D-7Hkb3j.cjs +293 -0
  93. package/dist/dialog-D-7Hkb3j.cjs.map +1 -0
  94. package/dist/domains/memory/components/observation-detail-view.cjs.js +1 -1
  95. package/dist/domains/memory/components/observation-detail-view.es.js +1 -1
  96. package/dist/domains/metrics/components/token-usage-by-agent-card-view.cjs.js +1 -1
  97. package/dist/domains/metrics/components/token-usage-by-agent-card-view.es.js +1 -1
  98. package/dist/domains/metrics/components/traces-volume-card-view.cjs.js +1 -1
  99. package/dist/domains/metrics/components/traces-volume-card-view.es.js +1 -1
  100. package/dist/domains/traces/components/span-data-panel-view.cjs.js +61 -105
  101. package/dist/domains/traces/components/span-data-panel-view.cjs.js.map +1 -1
  102. package/dist/domains/traces/components/span-data-panel-view.es.js +62 -106
  103. package/dist/domains/traces/components/span-data-panel-view.es.js.map +1 -1
  104. package/dist/domains/traces/components/span-summary-description.cjs.js +62 -0
  105. package/dist/domains/traces/components/span-summary-description.cjs.js.map +1 -0
  106. package/dist/domains/traces/components/span-summary-description.d.ts +2 -0
  107. package/dist/domains/traces/components/span-summary-description.es.js +58 -0
  108. package/dist/domains/traces/components/span-summary-description.es.js.map +1 -0
  109. package/dist/domains/traces/components/timeline-expand-col.cjs.js +1 -1
  110. package/dist/domains/traces/components/timeline-expand-col.cjs.js.map +1 -1
  111. package/dist/domains/traces/components/timeline-expand-col.es.js +1 -1
  112. package/dist/domains/traces/components/timeline-expand-col.es.js.map +1 -1
  113. package/dist/domains/traces/components/timeline-name-col.cjs.js +1 -1
  114. package/dist/domains/traces/components/timeline-name-col.cjs.js.map +1 -1
  115. package/dist/domains/traces/components/timeline-name-col.es.js +1 -1
  116. package/dist/domains/traces/components/timeline-name-col.es.js.map +1 -1
  117. package/dist/domains/traces/components/timeline-timing-col.cjs.js +1 -1
  118. package/dist/domains/traces/components/timeline-timing-col.cjs.js.map +1 -1
  119. package/dist/domains/traces/components/timeline-timing-col.es.js +1 -1
  120. package/dist/domains/traces/components/timeline-timing-col.es.js.map +1 -1
  121. package/dist/domains/traces/components/trace-columns-menu.cjs.js +1 -1
  122. package/dist/domains/traces/components/trace-columns-menu.es.js +1 -1
  123. package/dist/domains/traces/components/trace-data-panel-view.cjs.js +2 -2
  124. package/dist/domains/traces/components/trace-data-panel-view.cjs.js.map +1 -1
  125. package/dist/domains/traces/components/trace-data-panel-view.es.js +2 -2
  126. package/dist/domains/traces/components/trace-data-panel-view.es.js.map +1 -1
  127. package/dist/domains/traces/components/traces-toolbar.cjs.js +1 -5
  128. package/dist/domains/traces/components/traces-toolbar.cjs.js.map +1 -1
  129. package/dist/domains/traces/components/traces-toolbar.es.js +1 -5
  130. package/dist/domains/traces/components/traces-toolbar.es.js.map +1 -1
  131. package/dist/domains/traces/hooks/use-branch.cjs.js +2 -6
  132. package/dist/domains/traces/hooks/use-branch.cjs.js.map +1 -1
  133. package/dist/domains/traces/hooks/use-branch.es.js +2 -6
  134. package/dist/domains/traces/hooks/use-branch.es.js.map +1 -1
  135. package/dist/domains/traces/hooks/use-download-trace-json.cjs.js +4 -1
  136. package/dist/domains/traces/hooks/use-download-trace-json.cjs.js.map +1 -1
  137. package/dist/domains/traces/hooks/use-download-trace-json.es.js +4 -1
  138. package/dist/domains/traces/hooks/use-download-trace-json.es.js.map +1 -1
  139. package/dist/domains/traces/hooks/use-trace-filter-persistence.cjs.js +11 -18
  140. package/dist/domains/traces/hooks/use-trace-filter-persistence.cjs.js.map +1 -1
  141. package/dist/domains/traces/hooks/use-trace-filter-persistence.es.js +13 -20
  142. package/dist/domains/traces/hooks/use-trace-filter-persistence.es.js.map +1 -1
  143. package/dist/domains/traces/hooks/use-trace-spans.cjs.js +10 -7
  144. package/dist/domains/traces/hooks/use-trace-spans.cjs.js.map +1 -1
  145. package/dist/domains/traces/hooks/use-trace-spans.es.js +10 -7
  146. package/dist/domains/traces/hooks/use-trace-spans.es.js.map +1 -1
  147. package/dist/domains/traces/trace-filters.cjs.js +5 -5
  148. package/dist/domains/traces/trace-filters.cjs.js.map +1 -1
  149. package/dist/domains/traces/trace-filters.es.js +5 -5
  150. package/dist/domains/traces/trace-filters.es.js.map +1 -1
  151. package/dist/domains/traces/utils/span-utils.cjs.js +6 -0
  152. package/dist/domains/traces/utils/span-utils.cjs.js.map +1 -1
  153. package/dist/domains/traces/utils/span-utils.es.js +6 -1
  154. package/dist/domains/traces/utils/span-utils.es.js.map +1 -1
  155. package/dist/ee/signals/components/entity-index-list.cjs.js +0 -1
  156. package/dist/ee/signals/components/entity-index-list.cjs.js.map +1 -1
  157. package/dist/ee/signals/components/entity-index-list.es.js +0 -1
  158. package/dist/ee/signals/components/entity-index-list.es.js.map +1 -1
  159. package/dist/ee/signals/settings/signal-definition-form-dialog.cjs.js +1 -1
  160. package/dist/ee/signals/settings/signal-definition-form-dialog.es.js +1 -1
  161. package/dist/{highlight-CSJjjoqh.js → highlight-BmpoELR4.js} +6 -2
  162. package/dist/{highlight-CSJjjoqh.js.map → highlight-BmpoELR4.js.map} +1 -1
  163. package/dist/{highlight-CEt2vhD8.cjs → highlight-DK1dn-Fh.cjs} +6 -1
  164. package/dist/{highlight-CEt2vhD8.cjs.map → highlight-DK1dn-Fh.cjs.map} +1 -1
  165. package/dist/{horizontal-bars-DZ5J4TKv.js → horizontal-bars-CyP-B-BX.js} +37 -4
  166. package/dist/horizontal-bars-CyP-B-BX.js.map +1 -0
  167. package/dist/{horizontal-bars-CE1O-Y6G.cjs → horizontal-bars-Dgq3PYsg.cjs} +37 -4
  168. package/dist/horizontal-bars-Dgq3PYsg.cjs.map +1 -0
  169. package/dist/{markdown-renderer-DiJBbnYG.js → markdown-renderer-CaFpZTFS.js} +2 -2
  170. package/dist/{markdown-renderer-DiJBbnYG.js.map → markdown-renderer-CaFpZTFS.js.map} +1 -1
  171. package/dist/{markdown-renderer-DGIzNAQY.cjs → markdown-renderer-GVtZLunG.cjs} +2 -2
  172. package/dist/{markdown-renderer-DGIzNAQY.cjs.map → markdown-renderer-GVtZLunG.cjs.map} +1 -1
  173. package/dist/src/domains/traces/components/span-summary-description.d.ts +10 -0
  174. package/dist/src/domains/traces/components/traces-toolbar.d.ts +1 -5
  175. package/dist/src/domains/traces/hooks/index.d.ts +1 -1
  176. package/dist/src/domains/traces/hooks/use-trace-filter-persistence.d.ts +5 -18
  177. package/dist/src/domains/traces/hooks/use-trace-spans.d.ts +3 -1
  178. package/dist/src/domains/traces/trace-filters.d.ts +4 -3
  179. package/dist/src/domains/traces/utils/span-utils.d.ts +2 -0
  180. package/dist/src/ds/components/ChatShell/chat-shell.d.ts +19 -2
  181. package/dist/src/ds/components/ChatShell/index.d.ts +3 -2
  182. package/dist/src/ds/components/Code/index.d.ts +1 -0
  183. package/dist/src/ds/components/Code/use-highlight.d.ts +10 -0
  184. package/dist/src/ds/components/CodeDiff/code-diff.stories.d.ts +2 -0
  185. package/dist/src/ds/components/CodeEditor/highlight.d.ts +1 -0
  186. package/dist/src/ds/components/CodeEditor/index.d.ts +1 -1
  187. package/dist/src/ds/components/Combobox/combobox.d.ts +3 -1
  188. package/dist/src/ds/components/DataCodeSection/data-code-section.d.ts +9 -1
  189. package/dist/src/ds/components/DataCodeSection/index.d.ts +1 -1
  190. package/dist/src/ds/components/Dialog/dialog-action.d.ts +9 -0
  191. package/dist/src/ds/components/Dialog/dialog-context.d.ts +16 -0
  192. package/dist/src/ds/components/Dialog/dialog-new-variant.stories.d.ts +64 -0
  193. package/dist/src/ds/components/Dialog/dialog.d.ts +15 -6
  194. package/dist/src/ds/components/Dialog/index.d.ts +2 -0
  195. package/dist/src/ds/components/HorizontalBars/horizontal-bars.stories.d.ts +2 -0
  196. package/dist/src/ds/components/IntegrationDialog/__fixtures__/integrations-catalog.d.ts +2 -0
  197. package/dist/src/ds/components/IntegrationDialog/index.d.ts +2 -0
  198. package/dist/src/ds/components/IntegrationDialog/integration-dialog.d.ts +28 -0
  199. package/dist/src/ds/components/IntegrationDialog/integration-dialog.stories.d.ts +24 -0
  200. package/dist/src/ds/components/ThreadRail/index.d.ts +1 -0
  201. package/dist/src/ds/components/ThreadRail/turn-groups.d.ts +19 -0
  202. package/dist/src/ds/components/ai/tool-call/ansi.d.ts +2 -0
  203. package/dist/src/ds/components/ai/tool-call/group-consecutive.d.ts +17 -0
  204. package/dist/src/ds/components/ai/tool-call/index.d.ts +4 -0
  205. package/dist/src/ds/components/ai/tool-call/tool-call-edit.d.ts +4 -0
  206. package/dist/src/ds/components/ai/tool-call/tool-call-group.d.ts +14 -0
  207. package/dist/src/ds/components/ai/tool-call/tool-call.d.ts +4 -0
  208. package/dist/src/ds/components/ai/tool-call/tool-presentation.d.ts +10 -0
  209. package/dist/style.css +149 -3
  210. package/package.json +8 -8
  211. package/dist/code-BJMC6T9D.cjs.map +0 -1
  212. package/dist/code-DRGJVroV.js.map +0 -1
  213. package/dist/code-diff-BB4sqHpq.js.map +0 -1
  214. package/dist/code-diff-C-EHXZyK.cjs.map +0 -1
  215. package/dist/combobox-BQrlN0eB.cjs.map +0 -1
  216. package/dist/combobox-DeeAlYti.js.map +0 -1
  217. package/dist/data-code-section-DN2yPgEz.js.map +0 -1
  218. package/dist/data-code-section-Dn9smaz4.cjs.map +0 -1
  219. package/dist/dialog-CESxLg8S.js +0 -76
  220. package/dist/dialog-CESxLg8S.js.map +0 -1
  221. package/dist/dialog-K0q0KOOW.cjs +0 -107
  222. package/dist/dialog-K0q0KOOW.cjs.map +0 -1
  223. package/dist/horizontal-bars-CE1O-Y6G.cjs.map +0 -1
  224. package/dist/horizontal-bars-DZ5J4TKv.js.map +0 -1
@@ -29,7 +29,7 @@ function TimelineExpandCol({
29
29
  "div",
30
30
  {
31
31
  className: cn("flex h-full items-center justify-end px-1.5", {
32
- "opacity-30 [&:hover]:opacity-60": isFaded,
32
+ "opacity-40 [&:hover]:opacity-70 dark:opacity-30 dark:[&:hover]:opacity-60": isFaded,
33
33
  "bg-surface4": isSelected
34
34
  }),
35
35
  children: /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-[1.625rem_1.625rem_1.625rem] gap-1", children: [
@@ -1 +1 @@
1
- {"version":3,"file":"timeline-expand-col.es.js","sources":["../../../../src/domains/traces/components/timeline-expand-col.tsx"],"sourcesContent":["import {\n ChevronDownIcon,\n ChevronsDownIcon,\n ChevronsDownUpIcon,\n ChevronsUpDownIcon,\n ChevronsUpIcon,\n ChevronUpIcon,\n FoldVerticalIcon,\n UnfoldVerticalIcon,\n} from 'lucide-react';\nimport { Tooltip, TooltipContent, TooltipTrigger } from '@/ds/components/Tooltip';\nimport { cn } from '@/lib/utils';\n\ntype TimelineExpandColProps = {\n isSelected?: boolean;\n isFaded?: boolean;\n isExpanded?: boolean;\n isRootSpan?: boolean;\n toggleChildren?: () => void;\n expandAllDescendants?: () => void;\n collapseAllDescendants?: () => void;\n collapseAll?: () => void;\n totalDescendants?: number;\n allDescendantsExpanded?: boolean;\n numOfChildren?: number;\n toggleSiblings?: () => void;\n siblingsAllExpanded?: boolean;\n siblingsWithChildrenCount?: number;\n};\n\nexport function TimelineExpandCol({\n isSelected,\n isFaded,\n isExpanded,\n isRootSpan,\n toggleChildren,\n expandAllDescendants,\n collapseAllDescendants,\n collapseAll,\n totalDescendants = 0,\n allDescendantsExpanded,\n numOfChildren = 0,\n toggleSiblings,\n siblingsAllExpanded,\n siblingsWithChildrenCount = 0,\n}: TimelineExpandColProps) {\n const toggleTooltip = isExpanded ? `Collapse children (${numOfChildren})` : `Expand children (${numOfChildren})`;\n\n const showToggleChildren = !isRootSpan && !!numOfChildren && numOfChildren > 0;\n const showDescendantsButton = !isRootSpan && showToggleChildren && totalDescendants > numOfChildren;\n const showToggleSiblings = !isRootSpan && siblingsWithChildrenCount >= 2;\n const showRootToggleAll = !!isRootSpan && !!numOfChildren && numOfChildren > 0;\n const fullyExpanded = !!isExpanded && !!allDescendantsExpanded;\n\n return (\n <div\n className={cn('flex h-full items-center justify-end px-1.5', {\n 'opacity-30 [&:hover]:opacity-60': isFaded,\n 'bg-surface4': isSelected,\n })}\n >\n <div className=\"grid grid-cols-[1.625rem_1.625rem_1.625rem] gap-1\">\n <div>\n {showToggleChildren && (\n <ExpandButton onClick={() => toggleChildren?.()} tooltip={toggleTooltip}>\n {isExpanded ? <ChevronUpIcon /> : <ChevronDownIcon />}\n </ExpandButton>\n )}\n </div>\n\n <div>\n {showDescendantsButton && (\n <ExpandButton\n onClick={() => (allDescendantsExpanded ? collapseAllDescendants?.() : expandAllDescendants?.())}\n tooltip={\n allDescendantsExpanded\n ? `Collapse all descendants (${totalDescendants})`\n : `Expand all descendants (${totalDescendants})`\n }\n >\n {allDescendantsExpanded ? <ChevronsUpIcon /> : <ChevronsDownIcon />}\n </ExpandButton>\n )}\n </div>\n\n <div>\n {showToggleSiblings && (\n <ExpandButton\n onClick={() => toggleSiblings?.()}\n tooltip={siblingsAllExpanded ? 'Collapse at this level' : 'Expand at this level'}\n >\n {siblingsAllExpanded ? <FoldVerticalIcon /> : <UnfoldVerticalIcon />}\n </ExpandButton>\n )}\n\n {showRootToggleAll && (\n <ExpandButton\n onClick={() => (fullyExpanded ? collapseAll?.() : expandAllDescendants?.())}\n tooltip={fullyExpanded ? 'Collapse all' : 'Expand all'}\n >\n {fullyExpanded ? <ChevronsDownUpIcon /> : <ChevronsUpDownIcon />}\n </ExpandButton>\n )}\n </div>\n </div>\n </div>\n );\n}\n\ntype ExpandButtonProps = {\n onClick?: () => void;\n children?: React.ReactNode;\n className?: string;\n tooltip?: string;\n};\n\nfunction ExpandButton({ onClick, children, className, tooltip }: ExpandButtonProps) {\n return (\n <Tooltip>\n <TooltipTrigger asChild>\n <button onClick={onClick} className={cn('h-full shrink-0 cursor-pointer', className)} aria-label={tooltip}>\n <div\n className={cn(\n 'flex items-center gap-[0.1rem] rounded-md p-1 transition-all',\n 'hover:bg-surface5',\n '[&:hover>svg]:opacity-100 [&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:opacity-50 [&>svg]:transition-all',\n )}\n >\n {children}\n </div>\n </button>\n </TooltipTrigger>\n {tooltip && <TooltipContent>{tooltip}</TooltipContent>}\n </Tooltip>\n );\n}\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"timeline-expand-col.es.js","sources":["../../../../src/domains/traces/components/timeline-expand-col.tsx"],"sourcesContent":["import {\n ChevronDownIcon,\n ChevronsDownIcon,\n ChevronsDownUpIcon,\n ChevronsUpDownIcon,\n ChevronsUpIcon,\n ChevronUpIcon,\n FoldVerticalIcon,\n UnfoldVerticalIcon,\n} from 'lucide-react';\nimport { Tooltip, TooltipContent, TooltipTrigger } from '@/ds/components/Tooltip';\nimport { cn } from '@/lib/utils';\n\ntype TimelineExpandColProps = {\n isSelected?: boolean;\n isFaded?: boolean;\n isExpanded?: boolean;\n isRootSpan?: boolean;\n toggleChildren?: () => void;\n expandAllDescendants?: () => void;\n collapseAllDescendants?: () => void;\n collapseAll?: () => void;\n totalDescendants?: number;\n allDescendantsExpanded?: boolean;\n numOfChildren?: number;\n toggleSiblings?: () => void;\n siblingsAllExpanded?: boolean;\n siblingsWithChildrenCount?: number;\n};\n\nexport function TimelineExpandCol({\n isSelected,\n isFaded,\n isExpanded,\n isRootSpan,\n toggleChildren,\n expandAllDescendants,\n collapseAllDescendants,\n collapseAll,\n totalDescendants = 0,\n allDescendantsExpanded,\n numOfChildren = 0,\n toggleSiblings,\n siblingsAllExpanded,\n siblingsWithChildrenCount = 0,\n}: TimelineExpandColProps) {\n const toggleTooltip = isExpanded ? `Collapse children (${numOfChildren})` : `Expand children (${numOfChildren})`;\n\n const showToggleChildren = !isRootSpan && !!numOfChildren && numOfChildren > 0;\n const showDescendantsButton = !isRootSpan && showToggleChildren && totalDescendants > numOfChildren;\n const showToggleSiblings = !isRootSpan && siblingsWithChildrenCount >= 2;\n const showRootToggleAll = !!isRootSpan && !!numOfChildren && numOfChildren > 0;\n const fullyExpanded = !!isExpanded && !!allDescendantsExpanded;\n\n return (\n <div\n className={cn('flex h-full items-center justify-end px-1.5', {\n 'opacity-40 [&:hover]:opacity-70 dark:opacity-30 dark:[&:hover]:opacity-60': isFaded,\n 'bg-surface4': isSelected,\n })}\n >\n <div className=\"grid grid-cols-[1.625rem_1.625rem_1.625rem] gap-1\">\n <div>\n {showToggleChildren && (\n <ExpandButton onClick={() => toggleChildren?.()} tooltip={toggleTooltip}>\n {isExpanded ? <ChevronUpIcon /> : <ChevronDownIcon />}\n </ExpandButton>\n )}\n </div>\n\n <div>\n {showDescendantsButton && (\n <ExpandButton\n onClick={() => (allDescendantsExpanded ? collapseAllDescendants?.() : expandAllDescendants?.())}\n tooltip={\n allDescendantsExpanded\n ? `Collapse all descendants (${totalDescendants})`\n : `Expand all descendants (${totalDescendants})`\n }\n >\n {allDescendantsExpanded ? <ChevronsUpIcon /> : <ChevronsDownIcon />}\n </ExpandButton>\n )}\n </div>\n\n <div>\n {showToggleSiblings && (\n <ExpandButton\n onClick={() => toggleSiblings?.()}\n tooltip={siblingsAllExpanded ? 'Collapse at this level' : 'Expand at this level'}\n >\n {siblingsAllExpanded ? <FoldVerticalIcon /> : <UnfoldVerticalIcon />}\n </ExpandButton>\n )}\n\n {showRootToggleAll && (\n <ExpandButton\n onClick={() => (fullyExpanded ? collapseAll?.() : expandAllDescendants?.())}\n tooltip={fullyExpanded ? 'Collapse all' : 'Expand all'}\n >\n {fullyExpanded ? <ChevronsDownUpIcon /> : <ChevronsUpDownIcon />}\n </ExpandButton>\n )}\n </div>\n </div>\n </div>\n );\n}\n\ntype ExpandButtonProps = {\n onClick?: () => void;\n children?: React.ReactNode;\n className?: string;\n tooltip?: string;\n};\n\nfunction ExpandButton({ onClick, children, className, tooltip }: ExpandButtonProps) {\n return (\n <Tooltip>\n <TooltipTrigger asChild>\n <button onClick={onClick} className={cn('h-full shrink-0 cursor-pointer', className)} aria-label={tooltip}>\n <div\n className={cn(\n 'flex items-center gap-[0.1rem] rounded-md p-1 transition-all',\n 'hover:bg-surface5',\n '[&:hover>svg]:opacity-100 [&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:opacity-50 [&>svg]:transition-all',\n )}\n >\n {children}\n </div>\n </button>\n </TooltipTrigger>\n {tooltip && <TooltipContent>{tooltip}</TooltipContent>}\n </Tooltip>\n );\n}\n"],"names":[],"mappings":"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"}
@@ -28,7 +28,7 @@ function TimelineNameCol({
28
28
  ref: isSelected ? revealRow : void 0,
29
29
  "aria-label": `View details for span ${span.name}`,
30
30
  className: utils_cn.cn("flex min-h-8 items-center rounded-md rounded-l-lg opacity-80", {
31
- "opacity-30 [&:hover]:opacity-60": isFaded,
31
+ "opacity-40 [&:hover]:opacity-70 dark:opacity-30 dark:[&:hover]:opacity-60": isFaded,
32
32
  "bg-surface4": isSelected
33
33
  }),
34
34
  style: { paddingLeft: `${depth * 1}rem` },
@@ -1 +1 @@
1
- {"version":3,"file":"timeline-name-col.cjs.js","sources":["../../../../src/domains/traces/components/timeline-name-col.tsx"],"sourcesContent":["import type { UISpan, UISpanStyle } from '../types';\nimport { TimelineStructureSign } from './timeline-structure-sign';\nimport { cn } from '@/lib/utils';\n\ntype TimelineNameColProps = {\n span: UISpan;\n spanUI?: UISpanStyle | null;\n isFaded?: boolean;\n depth?: number;\n onSpanClick?: (id: string) => void;\n selectedSpanId?: string;\n isLastChild?: boolean;\n hasChildren?: boolean;\n isRootSpan?: boolean;\n isExpanded?: boolean;\n};\n\n// Nested rows mount late, once expansion opens their ancestors.\nconst revealRow = (node: HTMLDivElement | null) => {\n node?.scrollIntoView({ block: 'nearest' });\n};\n\nexport function TimelineNameCol({\n span,\n spanUI,\n isFaded,\n depth = 0,\n onSpanClick,\n selectedSpanId,\n isLastChild,\n hasChildren: _hasChildren,\n isRootSpan,\n isExpanded: _isExpanded,\n}: TimelineNameColProps) {\n const isSelected = selectedSpanId === span.id;\n\n return (\n <div\n ref={isSelected ? revealRow : undefined}\n aria-label={`View details for span ${span.name}`}\n className={cn('flex min-h-8 items-center rounded-md rounded-l-lg opacity-80', {\n 'opacity-30 [&:hover]:opacity-60': isFaded,\n 'bg-surface4': isSelected,\n })}\n style={{ paddingLeft: `${depth * 1}rem` }}\n >\n {!isRootSpan && <TimelineStructureSign isLastChild={isLastChild} />}\n\n <button\n onClick={() => onSpanClick?.(span.id)}\n className={cn(\n 'flex size-full min-w-0 items-center gap-1.5 rounded-md px-2 py-1 text-left text-ui-smd text-neutral6 transition-colors',\n '[&>svg]:ml-auto [&>svg]:size-[1em] [&>svg]:shrink-0 [&>svg]:opacity-0 [&>svg]:transition-all',\n 'hover:bg-surface4 [&:hover>svg]:opacity-60',\n 'focus:outline-none focus-visible:ring-1 focus-visible:ring-accent1 focus-visible:ring-inset',\n )}\n >\n {spanUI?.color && (\n <span\n aria-hidden\n title={spanUI.label}\n className=\"inline-block size-2 shrink-0 rounded-full\"\n style={{ backgroundColor: spanUI.color }}\n />\n )}\n {/* Searchable: the span name is what the timeline search matches on. When the match\n is in the span's payload instead, the whole name is painted in the indirect color\n so the row explains its own presence. */}\n <span\n data-highlight={span.matchedInPayloadOnly ? undefined : ''}\n data-highlight-indirect={span.matchedInPayloadOnly ? '' : undefined}\n title={span.matchedInPayloadOnly ? 'Matches your search in this span’s details' : undefined}\n className=\"min-w-0 truncate\"\n >\n {span.name}\n </span>\n </button>\n </div>\n );\n}\n"],"names":["jsxs","cn","jsx","TimelineStructureSign"],"mappings":";;;;;;;;AAkBA,MAAM,SAAA,GAAY,CAAC,IAAA,KAAgC;AACjD,EAAA,IAAA,EAAM,cAAA,CAAe,EAAE,KAAA,EAAO,SAAA,EAAW,CAAA;AAC3C,CAAA;AAEO,SAAS,eAAA,CAAgB;AAAA,EAC9B,IAAA;AAAA,EACA,MAAA;AAAA,EACA,OAAA;AAAA,EACA,KAAA,GAAQ,CAAA;AAAA,EACR,WAAA;AAAA,EACA,cAAA;AAAA,EACA,WAAA;AAAA,EACA,WAAA,EAAa,YAAA;AAAA,EACb,UAAA;AAAA,EACA,UAAA,EAAY;AACd,CAAA,EAAyB;AACvB,EAAA,MAAM,UAAA,GAAa,mBAAmB,IAAA,CAAK,EAAA;AAE3C,EAAA,uBACEA,eAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA,EAAK,aAAa,SAAA,GAAY,MAAA;AAAA,MAC9B,YAAA,EAAY,CAAA,sBAAA,EAAyB,IAAA,CAAK,IAAI,CAAA,CAAA;AAAA,MAC9C,SAAA,EAAWC,YAAG,8DAAA,EAAgE;AAAA,QAC5E,iCAAA,EAAmC,OAAA;AAAA,QACnC,aAAA,EAAe;AAAA,OAChB,CAAA;AAAA,MACD,OAAO,EAAE,WAAA,EAAa,CAAA,EAAG,KAAA,GAAQ,CAAC,CAAA,GAAA,CAAA,EAAM;AAAA,MAEvC,QAAA,EAAA;AAAA,QAAA,CAAC,UAAA,oBAAcC,cAAA,CAACC,qEAAA,EAAA,EAAsB,WAAA,EAA0B,CAAA;AAAA,wBAEjEH,eAAA;AAAA,UAAC,QAAA;AAAA,UAAA;AAAA,YACC,OAAA,EAAS,MAAM,WAAA,GAAc,IAAA,CAAK,EAAE,CAAA;AAAA,YACpC,SAAA,EAAWC,WAAA;AAAA,cACT,wHAAA;AAAA,cACA,8FAAA;AAAA,cACA,4CAAA;AAAA,cACA;AAAA,aACF;AAAA,YAEC,QAAA,EAAA;AAAA,cAAA,MAAA,EAAQ,KAAA,oBACPC,cAAA;AAAA,gBAAC,MAAA;AAAA,gBAAA;AAAA,kBACC,aAAA,EAAW,IAAA;AAAA,kBACX,OAAO,MAAA,CAAO,KAAA;AAAA,kBACd,SAAA,EAAU,2CAAA;AAAA,kBACV,KAAA,EAAO,EAAE,eAAA,EAAiB,MAAA,CAAO,KAAA;AAAM;AAAA,eACzC;AAAA,8BAKFA,cAAA;AAAA,gBAAC,MAAA;AAAA,gBAAA;AAAA,kBACC,gBAAA,EAAgB,IAAA,CAAK,oBAAA,GAAuB,MAAA,GAAY,EAAA;AAAA,kBACxD,yBAAA,EAAyB,IAAA,CAAK,oBAAA,GAAuB,EAAA,GAAK,MAAA;AAAA,kBAC1D,KAAA,EAAO,IAAA,CAAK,oBAAA,GAAuB,4CAAA,GAA+C,MAAA;AAAA,kBAClF,SAAA,EAAU,kBAAA;AAAA,kBAET,QAAA,EAAA,IAAA,CAAK;AAAA;AAAA;AACR;AAAA;AAAA;AACF;AAAA;AAAA,GACF;AAEJ;;;;"}
1
+ {"version":3,"file":"timeline-name-col.cjs.js","sources":["../../../../src/domains/traces/components/timeline-name-col.tsx"],"sourcesContent":["import type { UISpan, UISpanStyle } from '../types';\nimport { TimelineStructureSign } from './timeline-structure-sign';\nimport { cn } from '@/lib/utils';\n\ntype TimelineNameColProps = {\n span: UISpan;\n spanUI?: UISpanStyle | null;\n isFaded?: boolean;\n depth?: number;\n onSpanClick?: (id: string) => void;\n selectedSpanId?: string;\n isLastChild?: boolean;\n hasChildren?: boolean;\n isRootSpan?: boolean;\n isExpanded?: boolean;\n};\n\n// Nested rows mount late, once expansion opens their ancestors.\nconst revealRow = (node: HTMLDivElement | null) => {\n node?.scrollIntoView({ block: 'nearest' });\n};\n\nexport function TimelineNameCol({\n span,\n spanUI,\n isFaded,\n depth = 0,\n onSpanClick,\n selectedSpanId,\n isLastChild,\n hasChildren: _hasChildren,\n isRootSpan,\n isExpanded: _isExpanded,\n}: TimelineNameColProps) {\n const isSelected = selectedSpanId === span.id;\n\n return (\n <div\n ref={isSelected ? revealRow : undefined}\n aria-label={`View details for span ${span.name}`}\n className={cn('flex min-h-8 items-center rounded-md rounded-l-lg opacity-80', {\n 'opacity-40 [&:hover]:opacity-70 dark:opacity-30 dark:[&:hover]:opacity-60': isFaded,\n 'bg-surface4': isSelected,\n })}\n style={{ paddingLeft: `${depth * 1}rem` }}\n >\n {!isRootSpan && <TimelineStructureSign isLastChild={isLastChild} />}\n\n <button\n onClick={() => onSpanClick?.(span.id)}\n className={cn(\n 'flex size-full min-w-0 items-center gap-1.5 rounded-md px-2 py-1 text-left text-ui-smd text-neutral6 transition-colors',\n '[&>svg]:ml-auto [&>svg]:size-[1em] [&>svg]:shrink-0 [&>svg]:opacity-0 [&>svg]:transition-all',\n 'hover:bg-surface4 [&:hover>svg]:opacity-60',\n 'focus:outline-none focus-visible:ring-1 focus-visible:ring-accent1 focus-visible:ring-inset',\n )}\n >\n {spanUI?.color && (\n <span\n aria-hidden\n title={spanUI.label}\n className=\"inline-block size-2 shrink-0 rounded-full\"\n style={{ backgroundColor: spanUI.color }}\n />\n )}\n {/* Searchable: the span name is what the timeline search matches on. When the match\n is in the span's payload instead, the whole name is painted in the indirect color\n so the row explains its own presence. */}\n <span\n data-highlight={span.matchedInPayloadOnly ? undefined : ''}\n data-highlight-indirect={span.matchedInPayloadOnly ? '' : undefined}\n title={span.matchedInPayloadOnly ? 'Matches your search in this span’s details' : undefined}\n className=\"min-w-0 truncate\"\n >\n {span.name}\n </span>\n </button>\n </div>\n );\n}\n"],"names":["jsxs","cn","jsx","TimelineStructureSign"],"mappings":";;;;;;;;AAkBA,MAAM,SAAA,GAAY,CAAC,IAAA,KAAgC;AACjD,EAAA,IAAA,EAAM,cAAA,CAAe,EAAE,KAAA,EAAO,SAAA,EAAW,CAAA;AAC3C,CAAA;AAEO,SAAS,eAAA,CAAgB;AAAA,EAC9B,IAAA;AAAA,EACA,MAAA;AAAA,EACA,OAAA;AAAA,EACA,KAAA,GAAQ,CAAA;AAAA,EACR,WAAA;AAAA,EACA,cAAA;AAAA,EACA,WAAA;AAAA,EACA,WAAA,EAAa,YAAA;AAAA,EACb,UAAA;AAAA,EACA,UAAA,EAAY;AACd,CAAA,EAAyB;AACvB,EAAA,MAAM,UAAA,GAAa,mBAAmB,IAAA,CAAK,EAAA;AAE3C,EAAA,uBACEA,eAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA,EAAK,aAAa,SAAA,GAAY,MAAA;AAAA,MAC9B,YAAA,EAAY,CAAA,sBAAA,EAAyB,IAAA,CAAK,IAAI,CAAA,CAAA;AAAA,MAC9C,SAAA,EAAWC,YAAG,8DAAA,EAAgE;AAAA,QAC5E,2EAAA,EAA6E,OAAA;AAAA,QAC7E,aAAA,EAAe;AAAA,OAChB,CAAA;AAAA,MACD,OAAO,EAAE,WAAA,EAAa,CAAA,EAAG,KAAA,GAAQ,CAAC,CAAA,GAAA,CAAA,EAAM;AAAA,MAEvC,QAAA,EAAA;AAAA,QAAA,CAAC,UAAA,oBAAcC,cAAA,CAACC,qEAAA,EAAA,EAAsB,WAAA,EAA0B,CAAA;AAAA,wBAEjEH,eAAA;AAAA,UAAC,QAAA;AAAA,UAAA;AAAA,YACC,OAAA,EAAS,MAAM,WAAA,GAAc,IAAA,CAAK,EAAE,CAAA;AAAA,YACpC,SAAA,EAAWC,WAAA;AAAA,cACT,wHAAA;AAAA,cACA,8FAAA;AAAA,cACA,4CAAA;AAAA,cACA;AAAA,aACF;AAAA,YAEC,QAAA,EAAA;AAAA,cAAA,MAAA,EAAQ,KAAA,oBACPC,cAAA;AAAA,gBAAC,MAAA;AAAA,gBAAA;AAAA,kBACC,aAAA,EAAW,IAAA;AAAA,kBACX,OAAO,MAAA,CAAO,KAAA;AAAA,kBACd,SAAA,EAAU,2CAAA;AAAA,kBACV,KAAA,EAAO,EAAE,eAAA,EAAiB,MAAA,CAAO,KAAA;AAAM;AAAA,eACzC;AAAA,8BAKFA,cAAA;AAAA,gBAAC,MAAA;AAAA,gBAAA;AAAA,kBACC,gBAAA,EAAgB,IAAA,CAAK,oBAAA,GAAuB,MAAA,GAAY,EAAA;AAAA,kBACxD,yBAAA,EAAyB,IAAA,CAAK,oBAAA,GAAuB,EAAA,GAAK,MAAA;AAAA,kBAC1D,KAAA,EAAO,IAAA,CAAK,oBAAA,GAAuB,4CAAA,GAA+C,MAAA;AAAA,kBAClF,SAAA,EAAU,kBAAA;AAAA,kBAET,QAAA,EAAA,IAAA,CAAK;AAAA;AAAA;AACR;AAAA;AAAA;AACF;AAAA;AAAA,GACF;AAEJ;;;;"}
@@ -24,7 +24,7 @@ function TimelineNameCol({
24
24
  ref: isSelected ? revealRow : void 0,
25
25
  "aria-label": `View details for span ${span.name}`,
26
26
  className: cn("flex min-h-8 items-center rounded-md rounded-l-lg opacity-80", {
27
- "opacity-30 [&:hover]:opacity-60": isFaded,
27
+ "opacity-40 [&:hover]:opacity-70 dark:opacity-30 dark:[&:hover]:opacity-60": isFaded,
28
28
  "bg-surface4": isSelected
29
29
  }),
30
30
  style: { paddingLeft: `${depth * 1}rem` },
@@ -1 +1 @@
1
- {"version":3,"file":"timeline-name-col.es.js","sources":["../../../../src/domains/traces/components/timeline-name-col.tsx"],"sourcesContent":["import type { UISpan, UISpanStyle } from '../types';\nimport { TimelineStructureSign } from './timeline-structure-sign';\nimport { cn } from '@/lib/utils';\n\ntype TimelineNameColProps = {\n span: UISpan;\n spanUI?: UISpanStyle | null;\n isFaded?: boolean;\n depth?: number;\n onSpanClick?: (id: string) => void;\n selectedSpanId?: string;\n isLastChild?: boolean;\n hasChildren?: boolean;\n isRootSpan?: boolean;\n isExpanded?: boolean;\n};\n\n// Nested rows mount late, once expansion opens their ancestors.\nconst revealRow = (node: HTMLDivElement | null) => {\n node?.scrollIntoView({ block: 'nearest' });\n};\n\nexport function TimelineNameCol({\n span,\n spanUI,\n isFaded,\n depth = 0,\n onSpanClick,\n selectedSpanId,\n isLastChild,\n hasChildren: _hasChildren,\n isRootSpan,\n isExpanded: _isExpanded,\n}: TimelineNameColProps) {\n const isSelected = selectedSpanId === span.id;\n\n return (\n <div\n ref={isSelected ? revealRow : undefined}\n aria-label={`View details for span ${span.name}`}\n className={cn('flex min-h-8 items-center rounded-md rounded-l-lg opacity-80', {\n 'opacity-30 [&:hover]:opacity-60': isFaded,\n 'bg-surface4': isSelected,\n })}\n style={{ paddingLeft: `${depth * 1}rem` }}\n >\n {!isRootSpan && <TimelineStructureSign isLastChild={isLastChild} />}\n\n <button\n onClick={() => onSpanClick?.(span.id)}\n className={cn(\n 'flex size-full min-w-0 items-center gap-1.5 rounded-md px-2 py-1 text-left text-ui-smd text-neutral6 transition-colors',\n '[&>svg]:ml-auto [&>svg]:size-[1em] [&>svg]:shrink-0 [&>svg]:opacity-0 [&>svg]:transition-all',\n 'hover:bg-surface4 [&:hover>svg]:opacity-60',\n 'focus:outline-none focus-visible:ring-1 focus-visible:ring-accent1 focus-visible:ring-inset',\n )}\n >\n {spanUI?.color && (\n <span\n aria-hidden\n title={spanUI.label}\n className=\"inline-block size-2 shrink-0 rounded-full\"\n style={{ backgroundColor: spanUI.color }}\n />\n )}\n {/* Searchable: the span name is what the timeline search matches on. When the match\n is in the span's payload instead, the whole name is painted in the indirect color\n so the row explains its own presence. */}\n <span\n data-highlight={span.matchedInPayloadOnly ? undefined : ''}\n data-highlight-indirect={span.matchedInPayloadOnly ? '' : undefined}\n title={span.matchedInPayloadOnly ? 'Matches your search in this span’s details' : undefined}\n className=\"min-w-0 truncate\"\n >\n {span.name}\n </span>\n </button>\n </div>\n );\n}\n"],"names":[],"mappings":";;;;AAkBA,MAAM,SAAA,GAAY,CAAC,IAAA,KAAgC;AACjD,EAAA,IAAA,EAAM,cAAA,CAAe,EAAE,KAAA,EAAO,SAAA,EAAW,CAAA;AAC3C,CAAA;AAEO,SAAS,eAAA,CAAgB;AAAA,EAC9B,IAAA;AAAA,EACA,MAAA;AAAA,EACA,OAAA;AAAA,EACA,KAAA,GAAQ,CAAA;AAAA,EACR,WAAA;AAAA,EACA,cAAA;AAAA,EACA,WAAA;AAAA,EACA,WAAA,EAAa,YAAA;AAAA,EACb,UAAA;AAAA,EACA,UAAA,EAAY;AACd,CAAA,EAAyB;AACvB,EAAA,MAAM,UAAA,GAAa,mBAAmB,IAAA,CAAK,EAAA;AAE3C,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA,EAAK,aAAa,SAAA,GAAY,MAAA;AAAA,MAC9B,YAAA,EAAY,CAAA,sBAAA,EAAyB,IAAA,CAAK,IAAI,CAAA,CAAA;AAAA,MAC9C,SAAA,EAAW,GAAG,8DAAA,EAAgE;AAAA,QAC5E,iCAAA,EAAmC,OAAA;AAAA,QACnC,aAAA,EAAe;AAAA,OAChB,CAAA;AAAA,MACD,OAAO,EAAE,WAAA,EAAa,CAAA,EAAG,KAAA,GAAQ,CAAC,CAAA,GAAA,CAAA,EAAM;AAAA,MAEvC,QAAA,EAAA;AAAA,QAAA,CAAC,UAAA,oBAAc,GAAA,CAAC,qBAAA,EAAA,EAAsB,WAAA,EAA0B,CAAA;AAAA,wBAEjE,IAAA;AAAA,UAAC,QAAA;AAAA,UAAA;AAAA,YACC,OAAA,EAAS,MAAM,WAAA,GAAc,IAAA,CAAK,EAAE,CAAA;AAAA,YACpC,SAAA,EAAW,EAAA;AAAA,cACT,wHAAA;AAAA,cACA,8FAAA;AAAA,cACA,4CAAA;AAAA,cACA;AAAA,aACF;AAAA,YAEC,QAAA,EAAA;AAAA,cAAA,MAAA,EAAQ,KAAA,oBACP,GAAA;AAAA,gBAAC,MAAA;AAAA,gBAAA;AAAA,kBACC,aAAA,EAAW,IAAA;AAAA,kBACX,OAAO,MAAA,CAAO,KAAA;AAAA,kBACd,SAAA,EAAU,2CAAA;AAAA,kBACV,KAAA,EAAO,EAAE,eAAA,EAAiB,MAAA,CAAO,KAAA;AAAM;AAAA,eACzC;AAAA,8BAKF,GAAA;AAAA,gBAAC,MAAA;AAAA,gBAAA;AAAA,kBACC,gBAAA,EAAgB,IAAA,CAAK,oBAAA,GAAuB,MAAA,GAAY,EAAA;AAAA,kBACxD,yBAAA,EAAyB,IAAA,CAAK,oBAAA,GAAuB,EAAA,GAAK,MAAA;AAAA,kBAC1D,KAAA,EAAO,IAAA,CAAK,oBAAA,GAAuB,4CAAA,GAA+C,MAAA;AAAA,kBAClF,SAAA,EAAU,kBAAA;AAAA,kBAET,QAAA,EAAA,IAAA,CAAK;AAAA;AAAA;AACR;AAAA;AAAA;AACF;AAAA;AAAA,GACF;AAEJ;;;;"}
1
+ {"version":3,"file":"timeline-name-col.es.js","sources":["../../../../src/domains/traces/components/timeline-name-col.tsx"],"sourcesContent":["import type { UISpan, UISpanStyle } from '../types';\nimport { TimelineStructureSign } from './timeline-structure-sign';\nimport { cn } from '@/lib/utils';\n\ntype TimelineNameColProps = {\n span: UISpan;\n spanUI?: UISpanStyle | null;\n isFaded?: boolean;\n depth?: number;\n onSpanClick?: (id: string) => void;\n selectedSpanId?: string;\n isLastChild?: boolean;\n hasChildren?: boolean;\n isRootSpan?: boolean;\n isExpanded?: boolean;\n};\n\n// Nested rows mount late, once expansion opens their ancestors.\nconst revealRow = (node: HTMLDivElement | null) => {\n node?.scrollIntoView({ block: 'nearest' });\n};\n\nexport function TimelineNameCol({\n span,\n spanUI,\n isFaded,\n depth = 0,\n onSpanClick,\n selectedSpanId,\n isLastChild,\n hasChildren: _hasChildren,\n isRootSpan,\n isExpanded: _isExpanded,\n}: TimelineNameColProps) {\n const isSelected = selectedSpanId === span.id;\n\n return (\n <div\n ref={isSelected ? revealRow : undefined}\n aria-label={`View details for span ${span.name}`}\n className={cn('flex min-h-8 items-center rounded-md rounded-l-lg opacity-80', {\n 'opacity-40 [&:hover]:opacity-70 dark:opacity-30 dark:[&:hover]:opacity-60': isFaded,\n 'bg-surface4': isSelected,\n })}\n style={{ paddingLeft: `${depth * 1}rem` }}\n >\n {!isRootSpan && <TimelineStructureSign isLastChild={isLastChild} />}\n\n <button\n onClick={() => onSpanClick?.(span.id)}\n className={cn(\n 'flex size-full min-w-0 items-center gap-1.5 rounded-md px-2 py-1 text-left text-ui-smd text-neutral6 transition-colors',\n '[&>svg]:ml-auto [&>svg]:size-[1em] [&>svg]:shrink-0 [&>svg]:opacity-0 [&>svg]:transition-all',\n 'hover:bg-surface4 [&:hover>svg]:opacity-60',\n 'focus:outline-none focus-visible:ring-1 focus-visible:ring-accent1 focus-visible:ring-inset',\n )}\n >\n {spanUI?.color && (\n <span\n aria-hidden\n title={spanUI.label}\n className=\"inline-block size-2 shrink-0 rounded-full\"\n style={{ backgroundColor: spanUI.color }}\n />\n )}\n {/* Searchable: the span name is what the timeline search matches on. When the match\n is in the span's payload instead, the whole name is painted in the indirect color\n so the row explains its own presence. */}\n <span\n data-highlight={span.matchedInPayloadOnly ? undefined : ''}\n data-highlight-indirect={span.matchedInPayloadOnly ? '' : undefined}\n title={span.matchedInPayloadOnly ? 'Matches your search in this span’s details' : undefined}\n className=\"min-w-0 truncate\"\n >\n {span.name}\n </span>\n </button>\n </div>\n );\n}\n"],"names":[],"mappings":";;;;AAkBA,MAAM,SAAA,GAAY,CAAC,IAAA,KAAgC;AACjD,EAAA,IAAA,EAAM,cAAA,CAAe,EAAE,KAAA,EAAO,SAAA,EAAW,CAAA;AAC3C,CAAA;AAEO,SAAS,eAAA,CAAgB;AAAA,EAC9B,IAAA;AAAA,EACA,MAAA;AAAA,EACA,OAAA;AAAA,EACA,KAAA,GAAQ,CAAA;AAAA,EACR,WAAA;AAAA,EACA,cAAA;AAAA,EACA,WAAA;AAAA,EACA,WAAA,EAAa,YAAA;AAAA,EACb,UAAA;AAAA,EACA,UAAA,EAAY;AACd,CAAA,EAAyB;AACvB,EAAA,MAAM,UAAA,GAAa,mBAAmB,IAAA,CAAK,EAAA;AAE3C,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA,EAAK,aAAa,SAAA,GAAY,MAAA;AAAA,MAC9B,YAAA,EAAY,CAAA,sBAAA,EAAyB,IAAA,CAAK,IAAI,CAAA,CAAA;AAAA,MAC9C,SAAA,EAAW,GAAG,8DAAA,EAAgE;AAAA,QAC5E,2EAAA,EAA6E,OAAA;AAAA,QAC7E,aAAA,EAAe;AAAA,OAChB,CAAA;AAAA,MACD,OAAO,EAAE,WAAA,EAAa,CAAA,EAAG,KAAA,GAAQ,CAAC,CAAA,GAAA,CAAA,EAAM;AAAA,MAEvC,QAAA,EAAA;AAAA,QAAA,CAAC,UAAA,oBAAc,GAAA,CAAC,qBAAA,EAAA,EAAsB,WAAA,EAA0B,CAAA;AAAA,wBAEjE,IAAA;AAAA,UAAC,QAAA;AAAA,UAAA;AAAA,YACC,OAAA,EAAS,MAAM,WAAA,GAAc,IAAA,CAAK,EAAE,CAAA;AAAA,YACpC,SAAA,EAAW,EAAA;AAAA,cACT,wHAAA;AAAA,cACA,8FAAA;AAAA,cACA,4CAAA;AAAA,cACA;AAAA,aACF;AAAA,YAEC,QAAA,EAAA;AAAA,cAAA,MAAA,EAAQ,KAAA,oBACP,GAAA;AAAA,gBAAC,MAAA;AAAA,gBAAA;AAAA,kBACC,aAAA,EAAW,IAAA;AAAA,kBACX,OAAO,MAAA,CAAO,KAAA;AAAA,kBACd,SAAA,EAAU,2CAAA;AAAA,kBACV,KAAA,EAAO,EAAE,eAAA,EAAiB,MAAA,CAAO,KAAA;AAAM;AAAA,eACzC;AAAA,8BAKF,GAAA;AAAA,gBAAC,MAAA;AAAA,gBAAA;AAAA,kBACC,gBAAA,EAAgB,IAAA,CAAK,oBAAA,GAAuB,MAAA,GAAY,EAAA;AAAA,kBACxD,yBAAA,EAAyB,IAAA,CAAK,oBAAA,GAAuB,EAAA,GAAK,MAAA;AAAA,kBAC1D,KAAA,EAAO,IAAA,CAAK,oBAAA,GAAuB,4CAAA,GAA+C,MAAA;AAAA,kBAClF,SAAA,EAAU,kBAAA;AAAA,kBAET,QAAA,EAAA,IAAA,CAAK;AAAA;AAAA;AACR;AAAA;AAAA;AACF;AAAA;AAAA,GACF;AAEJ;;;;"}
@@ -31,7 +31,7 @@ function TimelineTimingCol({
31
31
  chartWidth === "wide" ? "min-w-72" : "min-w-32",
32
32
  "[&:hover>div]:bg-surface5",
33
33
  {
34
- "opacity-30 [&:hover]:opacity-60": isFaded,
34
+ "opacity-40 [&:hover]:opacity-70 dark:opacity-30 dark:[&:hover]:opacity-60": isFaded,
35
35
  "bg-surface4": selectedSpanId === span.id
36
36
  }
37
37
  ),
@@ -1 +1 @@
1
- {"version":3,"file":"timeline-timing-col.cjs.js","sources":["../../../../src/domains/traces/components/timeline-timing-col.tsx"],"sourcesContent":["import { format } from 'date-fns/format';\nimport type { UISpan } from '../types';\nimport { DataKeysAndValues } from '@/ds/components/DataKeysAndValues';\nimport { HoverCard, HoverCardContent, HoverCardTrigger } from '@/ds/components/HoverCard';\nimport { cn } from '@/lib/utils';\n\ntype TimelineTimingColProps = {\n span: UISpan;\n selectedSpanId?: string;\n isFaded?: boolean;\n overallLatency?: number;\n overallStartTime?: string;\n color?: string;\n chartWidth?: 'wide' | 'default';\n};\n\nexport function TimelineTimingCol({\n span,\n selectedSpanId,\n isFaded,\n overallLatency,\n overallStartTime,\n color,\n chartWidth = 'default',\n}: TimelineTimingColProps) {\n const percentageSpanLatency = overallLatency ? Math.ceil((span.latency / overallLatency) * 100) : 0;\n const overallStartTimeDate = overallStartTime ? new Date(overallStartTime) : null;\n const spanStartTimeDate = span.startTime ? new Date(span.startTime) : null;\n const spanStartTimeShift =\n spanStartTimeDate && overallStartTimeDate ? spanStartTimeDate.getTime() - overallStartTimeDate.getTime() : 0;\n\n const percentageSpanStartTime = overallLatency && Math.floor((spanStartTimeShift / overallLatency) * 100);\n\n return (\n <HoverCard>\n <HoverCardTrigger\n className={cn(\n 'grid h-8 cursor-help grid-cols-[1fr_auto] items-center gap-2 rounded-r-md p-1 pr-2',\n chartWidth === 'wide' ? 'min-w-72' : 'min-w-32',\n '[&:hover>div]:bg-surface5',\n {\n 'opacity-30 [&:hover]:opacity-60': isFaded,\n 'bg-surface4': selectedSpanId === span.id,\n },\n )}\n >\n <div className={cn('w-full rounded-md bg-surface4 p-1.5 transition-colors duration-1000')}>\n <div className=\"relative h-1.5 w-full overflow-hidden rounded-sm\">\n <div\n className={cn('absolute top-0 h-1.5 rounded-sm bg-neutral1')}\n style={{\n width: percentageSpanLatency ? `${percentageSpanLatency}%` : '2px',\n left: `${percentageSpanStartTime || 0}%`,\n backgroundColor: color,\n }}\n ></div>\n </div>\n </div>\n\n <div className={cn('flex justify-end text-ui-xs text-neutral3')}>{(span.latency / 1000).toFixed(3)}&nbsp;s</div>\n </HoverCardTrigger>\n <HoverCardContent className=\"bg-surface4 pr-6\">\n <div className={cn('mt-1 mb-2 flex items-center gap-2 text-ui-sm')}>Span Timing</div>\n <DataKeysAndValues>\n <DataKeysAndValues.Key>Latency</DataKeysAndValues.Key>\n <DataKeysAndValues.Value>{span.latency} ms</DataKeysAndValues.Value>\n <DataKeysAndValues.Key>Started at</DataKeysAndValues.Key>\n <DataKeysAndValues.Value>\n {span.startTime ? format(new Date(span.startTime), 'hh:mm:ss:SSS a') : '-'}\n </DataKeysAndValues.Value>\n <DataKeysAndValues.Key>Ended at</DataKeysAndValues.Key>\n <DataKeysAndValues.Value>\n {span.endTime ? format(new Date(span.endTime), 'hh:mm:ss:SSS a') : '-'}\n </DataKeysAndValues.Value>\n <DataKeysAndValues.Key>Start Shift</DataKeysAndValues.Key>\n <DataKeysAndValues.Value>{spanStartTimeShift}ms</DataKeysAndValues.Value>\n </DataKeysAndValues>\n </HoverCardContent>\n </HoverCard>\n );\n}\n"],"names":["HoverCard","jsxs","HoverCardTrigger","cn","jsx","HoverCardContent","DataKeysAndValues","format"],"mappings":"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"}
1
+ {"version":3,"file":"timeline-timing-col.cjs.js","sources":["../../../../src/domains/traces/components/timeline-timing-col.tsx"],"sourcesContent":["import { format } from 'date-fns/format';\nimport type { UISpan } from '../types';\nimport { DataKeysAndValues } from '@/ds/components/DataKeysAndValues';\nimport { HoverCard, HoverCardContent, HoverCardTrigger } from '@/ds/components/HoverCard';\nimport { cn } from '@/lib/utils';\n\ntype TimelineTimingColProps = {\n span: UISpan;\n selectedSpanId?: string;\n isFaded?: boolean;\n overallLatency?: number;\n overallStartTime?: string;\n color?: string;\n chartWidth?: 'wide' | 'default';\n};\n\nexport function TimelineTimingCol({\n span,\n selectedSpanId,\n isFaded,\n overallLatency,\n overallStartTime,\n color,\n chartWidth = 'default',\n}: TimelineTimingColProps) {\n const percentageSpanLatency = overallLatency ? Math.ceil((span.latency / overallLatency) * 100) : 0;\n const overallStartTimeDate = overallStartTime ? new Date(overallStartTime) : null;\n const spanStartTimeDate = span.startTime ? new Date(span.startTime) : null;\n const spanStartTimeShift =\n spanStartTimeDate && overallStartTimeDate ? spanStartTimeDate.getTime() - overallStartTimeDate.getTime() : 0;\n\n const percentageSpanStartTime = overallLatency && Math.floor((spanStartTimeShift / overallLatency) * 100);\n\n return (\n <HoverCard>\n <HoverCardTrigger\n className={cn(\n 'grid h-8 cursor-help grid-cols-[1fr_auto] items-center gap-2 rounded-r-md p-1 pr-2',\n chartWidth === 'wide' ? 'min-w-72' : 'min-w-32',\n '[&:hover>div]:bg-surface5',\n {\n 'opacity-40 [&:hover]:opacity-70 dark:opacity-30 dark:[&:hover]:opacity-60': isFaded,\n 'bg-surface4': selectedSpanId === span.id,\n },\n )}\n >\n <div className={cn('w-full rounded-md bg-surface4 p-1.5 transition-colors duration-1000')}>\n <div className=\"relative h-1.5 w-full overflow-hidden rounded-sm\">\n <div\n className={cn('absolute top-0 h-1.5 rounded-sm bg-neutral1')}\n style={{\n width: percentageSpanLatency ? `${percentageSpanLatency}%` : '2px',\n left: `${percentageSpanStartTime || 0}%`,\n backgroundColor: color,\n }}\n ></div>\n </div>\n </div>\n\n <div className={cn('flex justify-end text-ui-xs text-neutral3')}>{(span.latency / 1000).toFixed(3)}&nbsp;s</div>\n </HoverCardTrigger>\n <HoverCardContent className=\"bg-surface4 pr-6\">\n <div className={cn('mt-1 mb-2 flex items-center gap-2 text-ui-sm')}>Span Timing</div>\n <DataKeysAndValues>\n <DataKeysAndValues.Key>Latency</DataKeysAndValues.Key>\n <DataKeysAndValues.Value>{span.latency} ms</DataKeysAndValues.Value>\n <DataKeysAndValues.Key>Started at</DataKeysAndValues.Key>\n <DataKeysAndValues.Value>\n {span.startTime ? format(new Date(span.startTime), 'hh:mm:ss:SSS a') : '-'}\n </DataKeysAndValues.Value>\n <DataKeysAndValues.Key>Ended at</DataKeysAndValues.Key>\n <DataKeysAndValues.Value>\n {span.endTime ? format(new Date(span.endTime), 'hh:mm:ss:SSS a') : '-'}\n </DataKeysAndValues.Value>\n <DataKeysAndValues.Key>Start Shift</DataKeysAndValues.Key>\n <DataKeysAndValues.Value>{spanStartTimeShift}ms</DataKeysAndValues.Value>\n </DataKeysAndValues>\n </HoverCardContent>\n </HoverCard>\n );\n}\n"],"names":["HoverCard","jsxs","HoverCardTrigger","cn","jsx","HoverCardContent","DataKeysAndValues","format"],"mappings":"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"}
@@ -27,7 +27,7 @@ function TimelineTimingCol({
27
27
  chartWidth === "wide" ? "min-w-72" : "min-w-32",
28
28
  "[&:hover>div]:bg-surface5",
29
29
  {
30
- "opacity-30 [&:hover]:opacity-60": isFaded,
30
+ "opacity-40 [&:hover]:opacity-70 dark:opacity-30 dark:[&:hover]:opacity-60": isFaded,
31
31
  "bg-surface4": selectedSpanId === span.id
32
32
  }
33
33
  ),
@@ -1 +1 @@
1
- {"version":3,"file":"timeline-timing-col.es.js","sources":["../../../../src/domains/traces/components/timeline-timing-col.tsx"],"sourcesContent":["import { format } from 'date-fns/format';\nimport type { UISpan } from '../types';\nimport { DataKeysAndValues } from '@/ds/components/DataKeysAndValues';\nimport { HoverCard, HoverCardContent, HoverCardTrigger } from '@/ds/components/HoverCard';\nimport { cn } from '@/lib/utils';\n\ntype TimelineTimingColProps = {\n span: UISpan;\n selectedSpanId?: string;\n isFaded?: boolean;\n overallLatency?: number;\n overallStartTime?: string;\n color?: string;\n chartWidth?: 'wide' | 'default';\n};\n\nexport function TimelineTimingCol({\n span,\n selectedSpanId,\n isFaded,\n overallLatency,\n overallStartTime,\n color,\n chartWidth = 'default',\n}: TimelineTimingColProps) {\n const percentageSpanLatency = overallLatency ? Math.ceil((span.latency / overallLatency) * 100) : 0;\n const overallStartTimeDate = overallStartTime ? new Date(overallStartTime) : null;\n const spanStartTimeDate = span.startTime ? new Date(span.startTime) : null;\n const spanStartTimeShift =\n spanStartTimeDate && overallStartTimeDate ? spanStartTimeDate.getTime() - overallStartTimeDate.getTime() : 0;\n\n const percentageSpanStartTime = overallLatency && Math.floor((spanStartTimeShift / overallLatency) * 100);\n\n return (\n <HoverCard>\n <HoverCardTrigger\n className={cn(\n 'grid h-8 cursor-help grid-cols-[1fr_auto] items-center gap-2 rounded-r-md p-1 pr-2',\n chartWidth === 'wide' ? 'min-w-72' : 'min-w-32',\n '[&:hover>div]:bg-surface5',\n {\n 'opacity-30 [&:hover]:opacity-60': isFaded,\n 'bg-surface4': selectedSpanId === span.id,\n },\n )}\n >\n <div className={cn('w-full rounded-md bg-surface4 p-1.5 transition-colors duration-1000')}>\n <div className=\"relative h-1.5 w-full overflow-hidden rounded-sm\">\n <div\n className={cn('absolute top-0 h-1.5 rounded-sm bg-neutral1')}\n style={{\n width: percentageSpanLatency ? `${percentageSpanLatency}%` : '2px',\n left: `${percentageSpanStartTime || 0}%`,\n backgroundColor: color,\n }}\n ></div>\n </div>\n </div>\n\n <div className={cn('flex justify-end text-ui-xs text-neutral3')}>{(span.latency / 1000).toFixed(3)}&nbsp;s</div>\n </HoverCardTrigger>\n <HoverCardContent className=\"bg-surface4 pr-6\">\n <div className={cn('mt-1 mb-2 flex items-center gap-2 text-ui-sm')}>Span Timing</div>\n <DataKeysAndValues>\n <DataKeysAndValues.Key>Latency</DataKeysAndValues.Key>\n <DataKeysAndValues.Value>{span.latency} ms</DataKeysAndValues.Value>\n <DataKeysAndValues.Key>Started at</DataKeysAndValues.Key>\n <DataKeysAndValues.Value>\n {span.startTime ? format(new Date(span.startTime), 'hh:mm:ss:SSS a') : '-'}\n </DataKeysAndValues.Value>\n <DataKeysAndValues.Key>Ended at</DataKeysAndValues.Key>\n <DataKeysAndValues.Value>\n {span.endTime ? format(new Date(span.endTime), 'hh:mm:ss:SSS a') : '-'}\n </DataKeysAndValues.Value>\n <DataKeysAndValues.Key>Start Shift</DataKeysAndValues.Key>\n <DataKeysAndValues.Value>{spanStartTimeShift}ms</DataKeysAndValues.Value>\n </DataKeysAndValues>\n </HoverCardContent>\n </HoverCard>\n );\n}\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"timeline-timing-col.es.js","sources":["../../../../src/domains/traces/components/timeline-timing-col.tsx"],"sourcesContent":["import { format } from 'date-fns/format';\nimport type { UISpan } from '../types';\nimport { DataKeysAndValues } from '@/ds/components/DataKeysAndValues';\nimport { HoverCard, HoverCardContent, HoverCardTrigger } from '@/ds/components/HoverCard';\nimport { cn } from '@/lib/utils';\n\ntype TimelineTimingColProps = {\n span: UISpan;\n selectedSpanId?: string;\n isFaded?: boolean;\n overallLatency?: number;\n overallStartTime?: string;\n color?: string;\n chartWidth?: 'wide' | 'default';\n};\n\nexport function TimelineTimingCol({\n span,\n selectedSpanId,\n isFaded,\n overallLatency,\n overallStartTime,\n color,\n chartWidth = 'default',\n}: TimelineTimingColProps) {\n const percentageSpanLatency = overallLatency ? Math.ceil((span.latency / overallLatency) * 100) : 0;\n const overallStartTimeDate = overallStartTime ? new Date(overallStartTime) : null;\n const spanStartTimeDate = span.startTime ? new Date(span.startTime) : null;\n const spanStartTimeShift =\n spanStartTimeDate && overallStartTimeDate ? spanStartTimeDate.getTime() - overallStartTimeDate.getTime() : 0;\n\n const percentageSpanStartTime = overallLatency && Math.floor((spanStartTimeShift / overallLatency) * 100);\n\n return (\n <HoverCard>\n <HoverCardTrigger\n className={cn(\n 'grid h-8 cursor-help grid-cols-[1fr_auto] items-center gap-2 rounded-r-md p-1 pr-2',\n chartWidth === 'wide' ? 'min-w-72' : 'min-w-32',\n '[&:hover>div]:bg-surface5',\n {\n 'opacity-40 [&:hover]:opacity-70 dark:opacity-30 dark:[&:hover]:opacity-60': isFaded,\n 'bg-surface4': selectedSpanId === span.id,\n },\n )}\n >\n <div className={cn('w-full rounded-md bg-surface4 p-1.5 transition-colors duration-1000')}>\n <div className=\"relative h-1.5 w-full overflow-hidden rounded-sm\">\n <div\n className={cn('absolute top-0 h-1.5 rounded-sm bg-neutral1')}\n style={{\n width: percentageSpanLatency ? `${percentageSpanLatency}%` : '2px',\n left: `${percentageSpanStartTime || 0}%`,\n backgroundColor: color,\n }}\n ></div>\n </div>\n </div>\n\n <div className={cn('flex justify-end text-ui-xs text-neutral3')}>{(span.latency / 1000).toFixed(3)}&nbsp;s</div>\n </HoverCardTrigger>\n <HoverCardContent className=\"bg-surface4 pr-6\">\n <div className={cn('mt-1 mb-2 flex items-center gap-2 text-ui-sm')}>Span Timing</div>\n <DataKeysAndValues>\n <DataKeysAndValues.Key>Latency</DataKeysAndValues.Key>\n <DataKeysAndValues.Value>{span.latency} ms</DataKeysAndValues.Value>\n <DataKeysAndValues.Key>Started at</DataKeysAndValues.Key>\n <DataKeysAndValues.Value>\n {span.startTime ? format(new Date(span.startTime), 'hh:mm:ss:SSS a') : '-'}\n </DataKeysAndValues.Value>\n <DataKeysAndValues.Key>Ended at</DataKeysAndValues.Key>\n <DataKeysAndValues.Value>\n {span.endTime ? format(new Date(span.endTime), 'hh:mm:ss:SSS a') : '-'}\n </DataKeysAndValues.Value>\n <DataKeysAndValues.Key>Start Shift</DataKeysAndValues.Key>\n <DataKeysAndValues.Value>{spanStartTimeShift}ms</DataKeysAndValues.Value>\n </DataKeysAndValues>\n </HoverCardContent>\n </HoverCard>\n );\n}\n"],"names":[],"mappings":"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"}
@@ -7,7 +7,7 @@ const lucideReact = require('lucide-react');
7
7
  const React = require('react');
8
8
  const domains_traces_traceListColumns = require('../trace-list-columns.cjs.js');
9
9
  const Button = require('../../../Button-D10WB4vc.cjs');
10
- const dialog = require('../../../dialog-K0q0KOOW.cjs');
10
+ const dialog = require('../../../dialog-D-7Hkb3j.cjs');
11
11
  const dropdownMenu = require('../../../dropdown-menu-qsDhHNES.cjs');
12
12
  const input = require('../../../input-DBrWBeUp.cjs');
13
13
  const label = require('../../../label-B9ERiuZb.cjs');
@@ -3,7 +3,7 @@ import { Columns3Icon, PlusIcon } from 'lucide-react';
3
3
  import { useState } from 'react';
4
4
  import { TRACE_USAGE_COLUMNS } from '../trace-list-columns.es.js';
5
5
  import { B as Button } from '../../../Button-BsfLQEC6.js';
6
- import { D as Dialog, c as DialogContent, f as DialogHeader, i as DialogTitle, d as DialogDescription, a as DialogBody, e as DialogFooter } from '../../../dialog-CESxLg8S.js';
6
+ import { D as Dialog, a as DialogContent, b as DialogHeader, c as DialogTitle, d as DialogDescription, e as DialogBody, f as DialogFooter } from '../../../dialog-CZMPDVUj.js';
7
7
  import { D as DropdownMenu } from '../../../dropdown-menu-BYTyEuSa.js';
8
8
  import { I as Input } from '../../../input-DNjusDwY.js';
9
9
  import { L as Label } from '../../../label-Um4lWyRe.js';
@@ -13,7 +13,7 @@ const domains_traces_components_traceSummaryDescription = require('./trace-summa
13
13
  const domains_traces_components_traceTimeline = require('./trace-timeline.cjs.js');
14
14
  const Button = require('../../../Button-D10WB4vc.cjs');
15
15
  const buttonsGroup = require('../../../buttons-group-Cn36DWYX.cjs');
16
- const dataPanel = require('../../../data-panel-DEatwExN.cjs');
16
+ const dataPanel = require('../../../data-panel-Cv9j_IGQ.cjs');
17
17
  const dropdownMenu = require('../../../dropdown-menu-qsDhHNES.cjs');
18
18
  const searchFieldBlock = require('../../../search-field-block-CiinIsub.cjs');
19
19
  const Notice = require('../../../Notice-D_ji361h.cjs');
@@ -225,7 +225,7 @@ function TraceDataPanelView({
225
225
  onValueChange: onTabChange,
226
226
  className: "grid h-full min-h-0 grid-rows-[auto_1fr]",
227
227
  children: [
228
- /* @__PURE__ */ jsxRuntime.jsx(dataPanel.DataPanel.Header, { className: "py-2", children: /* @__PURE__ */ jsxRuntime.jsxs(tabsRoot.TabList, { variant: "pill-ghost", className: "px-0", children: [
228
+ /* @__PURE__ */ jsxRuntime.jsx(dataPanel.DataPanel.Header, { className: "min-h-16 py-2", children: /* @__PURE__ */ jsxRuntime.jsxs(tabsRoot.TabList, { variant: "pill-ghost", className: "px-0", children: [
229
229
  /* @__PURE__ */ jsxRuntime.jsx(tabsTab.Tab, { value: "details", children: "Spans" }),
230
230
  feedbackTabSlot && /* @__PURE__ */ jsxRuntime.jsxs(tabsTab.Tab, { value: "feedback", children: [
231
231
  "Feedback",
@@ -1 +1 @@
1
- {"version":3,"file":"trace-data-panel-view.cjs.js","sources":["../../../../src/domains/traces/components/trace-data-panel-view.tsx"],"sourcesContent":["import {\n CircleGaugeIcon,\n ChevronsDownUpIcon,\n ChevronsUpDownIcon,\n DownloadIcon,\n Link2Icon,\n Loader2Icon,\n MoreHorizontalIcon,\n SaveIcon,\n WrenchIcon,\n} from 'lucide-react';\nimport { useEffect, useId, 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 { TraceSummaryDescription } from './trace-summary-description';\nimport { TraceTimeline } from './trace-timeline';\nimport { Button } from '@/ds/components/Button';\nimport { ButtonsGroup } from '@/ds/components/ButtonsGroup';\nimport { DataPanel } from '@/ds/components/DataPanel';\nimport { DropdownMenu } from '@/ds/components/DropdownMenu';\nimport { SearchFieldBlock } from '@/ds/components/FormFieldBlocks';\nimport { Notice } from '@/ds/components/Notice';\nimport { Tab, TabContent, TabList, Tabs } from '@/ds/components/Tabs';\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 { truncateString } from '@/lib/truncate-string';\nimport { cn } from '@/lib/utils';\n\nexport type TraceDataPanelPlacement = 'traces-list' | 'trace-page';\n\nexport type TraceDataPanelTab = 'details' | 'scores' | 'feedback';\n\nexport interface TraceDataPanelViewProps {\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 collapsed?: boolean;\n onCollapsedChange?: (collapsed: boolean) => void;\n placement: TraceDataPanelPlacement;\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, the panel content becomes tabbed (\"Details\" / \"Scores\"); the slot\n * renders whatever trace-level 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 shown in the \"Feedback\" tab label. */\n feedbackTabBadge?: ReactNode;\n activeTab?: TraceDataPanelTab;\n onTabChange?: (tab: TraceDataPanelTab) => void;\n /** Span ids to feature in the timeline; every other span is faded. */\n featuredSpanIds?: string[];\n /**\n * Rendered as a column to the left of the timeline inside the same card;\n * typically the reconstructed agent turn (\"Messages\").\n */\n messagesPanelSlot?: ReactNode;\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 /** Extra classes applied to the panel root (e.g. `h-full` on the trace page). */\n className?: string;\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 collapsed: controlledCollapsed,\n onCollapsedChange,\n placement,\n timelineChartWidth = 'default',\n LinkComponent,\n traceHref,\n entityHref,\n usage,\n anchorSpanId,\n showUnavailableFeaturesMsg = true,\n scoresTabSlot,\n scoresTabBadge,\n feedbackTabSlot,\n feedbackTabBadge,\n activeTab,\n onTabChange,\n featuredSpanIds,\n messagesPanelSlot,\n spanPanelSlot,\n className,\n}: TraceDataPanelViewProps) {\n const isOnTracePage = placement === 'trace-page';\n const [internalCollapsed, setInternalCollapsed] = useState(false);\n const collapsed = controlledCollapsed ?? internalCollapsed;\n const setCollapsed = onCollapsedChange ?? setInternalCollapsed;\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 searchFieldName = useId();\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 traceActionsMenu = (\n <DropdownMenu>\n <DropdownMenu.Trigger\n render={\n <Button size=\"md\" tooltip=\"Trace actions\" aria-label=\"Trace actions\">\n <MoreHorizontalIcon />\n </Button>\n }\n />\n <DropdownMenu.Content align=\"end\">\n {!isOnTracePage && onCollapsedChange && (\n <DropdownMenu.Item onSelect={() => setCollapsed(!collapsed)}>\n {collapsed ? <ChevronsUpDownIcon /> : <ChevronsDownUpIcon />}\n {collapsed ? 'Expand panel' : 'Collapse panel'}\n </DropdownMenu.Item>\n )}\n {!isOnTracePage && onEvaluateTrace && (\n <DropdownMenu.Item onSelect={onEvaluateTrace}>\n <CircleGaugeIcon />\n Evaluate trace\n </DropdownMenu.Item>\n )}\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 return (\n <DataPanel collapsed={collapsed} className={className}>\n <DataPanel.Header>\n {isOnTracePage ? (\n <>\n <DataPanel.Heading>Trace Timeline</DataPanel.Heading>\n <ButtonsGroup className=\"ml-auto shrink-0\">{traceActionsMenu}</ButtonsGroup>\n </>\n ) : (\n <>\n <div className=\"flex min-w-0 flex-1 flex-col gap-1\">\n <DataPanel.Heading>\n Trace <b># {truncateString(traceId, 12)}</b>\n </DataPanel.Heading>\n {!collapsed && rootSpan && (\n <TraceSummaryDescription\n rootSpan={rootSpan}\n usage={usage}\n entityHref={entityHref}\n LinkComponent={LinkComponent}\n />\n )}\n </div>\n <ButtonsGroup className=\"ml-auto shrink-0 self-start\">\n {traceActionsMenu}\n {(onPrevious || onNext) && (\n <DataPanel.NextPrevNav\n onPrevious={onPrevious}\n onNext={onNext}\n previousLabel=\"Previous trace\"\n nextLabel=\"Next trace\"\n />\n )}\n <DataPanel.CloseButton onClick={onClose} />\n </ButtonsGroup>\n </>\n )}\n </DataPanel.Header>\n\n {!collapsed && (\n <TracePanelColumns\n messagesPanelSlot={messagesPanelSlot}\n spanPanelSlot={spanPanelSlot}\n highlightQuery={query}\n spanPanelKey={selectedSpanId}\n >\n {isLoading ? (\n <DataPanel.LoadingData>Loading trace...</DataPanel.LoadingData>\n ) : !spans?.length ? (\n <DataPanel.NoData>No spans found for this trace.</DataPanel.NoData>\n ) : (\n (() => {\n const detailsBody = (\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 {/* The timeline stays mounted even with no results, because it\n hosts the search field: unmounting it would strand the user\n with a query they can no longer clear. */}\n <TraceTimeline\n hierarchicalSpans={hierarchicalSpans}\n onSpanClick={handleSpanClick}\n selectedSpanId={selectedSpanId}\n expandedSpanIds={expandedSpanIds}\n setExpandedSpanIds={setExpandedSpanIds}\n featuredSpanIds={featuredSpanIds}\n chartWidth={timelineChartWidth}\n leadingSlot={\n <SearchFieldBlock\n name={searchFieldName}\n label=\"Search spans\"\n labelIsHidden\n placeholder=\"Search spans...\"\n value={query}\n onChange={e => setQuery(e.target.value)}\n onReset={() => setQuery('')}\n size=\"sm\"\n variant=\"outline\"\n className=\"w-full\"\n />\n }\n />\n\n {hierarchicalSpans.length === 0 && <DataPanel.NoData>No spans match your search.</DataPanel.NoData>}\n </DataPanel.Content>\n );\n\n // No extra tab slots → render details directly without the Tabs wrapper.\n if (!scoresTabSlot && !feedbackTabSlot) return detailsBody;\n\n // The tab list sits in a header row so it lines up with the Messages and\n // span-detail headers in the neighbouring columns.\n return (\n <Tabs<TraceDataPanelTab>\n defaultTab=\"details\"\n value={activeTab}\n onValueChange={onTabChange}\n className=\"grid h-full min-h-0 grid-rows-[auto_1fr]\"\n >\n {/* Pill tabs carry their own p-1, so shrink the header padding to keep min-h-14. */}\n <DataPanel.Header className=\"py-2\">\n <TabList variant=\"pill-ghost\" className=\"px-0\">\n <Tab value=\"details\">Spans</Tab>\n {feedbackTabSlot && (\n <Tab value=\"feedback\">Feedback{feedbackTabBadge != null && <> ({feedbackTabBadge})</>}</Tab>\n )}\n {scoresTabSlot && (\n <Tab value=\"scores\">Scores{scoresTabBadge != null && <> ({scoresTabBadge})</>}</Tab>\n )}\n </TabList>\n </DataPanel.Header>\n\n <TabContent value=\"details\" className=\"min-h-0 py-0\">\n {detailsBody}\n </TabContent>\n {feedbackTabSlot && (\n <TabContent value=\"feedback\" className=\"h-full min-h-0 py-0\">\n <DataPanel.Content>{feedbackTabSlot({ traceId })}</DataPanel.Content>\n </TabContent>\n )}\n {scoresTabSlot && (\n <TabContent value=\"scores\" className=\"h-full min-h-0 py-0\">\n <DataPanel.Content>{scoresTabSlot({ traceId, rootSpanId: rootSpan?.spanId })}</DataPanel.Content>\n </TabContent>\n )}\n </Tabs>\n );\n })()\n )}\n </TracePanelColumns>\n )}\n </DataPanel>\n );\n}\n\n/**\n * Lays out the card body as three columns — `[messages] [trace] [span]` — inside the\n * same card. Both side cells always exist and collapse to `0fr` when their slot is\n * absent, so opening/closing a column animates via `grid-template-columns` rather\n * than mounting/unmounting a DOM 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 messagesPanelSlot,\n spanPanelSlot,\n highlightQuery,\n spanPanelKey,\n children,\n}: {\n messagesPanelSlot?: 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 const columns = messagesPanelSlot\n ? spanPanelSlot\n ? 'grid-cols-[1fr_1fr_1fr]'\n : 'grid-cols-[1fr_1fr_0fr]'\n : spanPanelSlot\n ? 'grid-cols-[0fr_1fr_1fr]'\n : 'grid-cols-[0fr_1fr_0fr]';\n\n return (\n <div\n ref={highlightRef}\n data-trace-columns\n className={cn('grid min-h-0 flex-1 transition-[grid-template-columns] duration-300 ease-in-out', columns)}\n >\n <div\n className={cn(\n 'flex min-h-0 min-w-0 flex-col overflow-hidden',\n messagesPanelSlot && 'animate-in border-r border-border1 duration-300 fade-in-0',\n )}\n >\n {messagesPanelSlot}\n </div>\n <div className=\"flex min-h-0 min-w-0 flex-col overflow-hidden\">{children}</div>\n {/* Searchable: the span detail is where a match hides inside a large payload. */}\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-border1 duration-300 fade-in-0',\n )}\n >\n {spanPanelSlot}\n </div>\n </div>\n );\n}\n"],"names":["useState","useDownloadTraceJson","useEffect","useId","useTraceSearch","useMemo","formatHierarchicalSpans","getAllSpanIds","DropdownMenu","jsx","Button","MoreHorizontalIcon","jsxs","ChevronsUpDownIcon","ChevronsDownUpIcon","CircleGaugeIcon","SaveIcon","WrenchIcon","Link2Icon","Loader2Icon","DownloadIcon","DataPanel","Fragment","ButtonsGroup","truncateString","TraceSummaryDescription","Notice","TraceTimeline","SearchFieldBlock","Tabs","TabList","Tab","TabContent","useTextHighlight","useScrollToFirstHighlight","cn"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AA8GO,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,SAAA,EAAW,mBAAA;AAAA,EACX,iBAAA;AAAA,EACA,SAAA;AAAA,EACA,kBAAA,GAAqB,SAAA;AAAA,EACrB,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,SAAA;AAAA,EACA,WAAA;AAAA,EACA,eAAA;AAAA,EACA,iBAAA;AAAA,EACA,aAAA;AAAA,EACA;AACF,CAAA,EAA4B;AAC1B,EAAA,MAAM,gBAAgB,SAAA,KAAc,YAAA;AACpC,EAAA,MAAM,CAAC,iBAAA,EAAmB,oBAAoB,CAAA,GAAIA,eAAS,KAAK,CAAA;AAChE,EAAA,MAAM,YAAY,mBAAA,IAAuB,iBAAA;AACzC,EAAA,MAAM,eAAe,iBAAA,IAAqB,oBAAA;AAE1C,EAAA,MAAM,EAAE,QAAA,EAAU,iBAAA,EAAmB,SAAA,EAAW,kBAAA,KAAuBC,8DAAA,EAAqB;AAE5F,EAAA,MAAM,CAAC,cAAA,EAAgB,iBAAiB,CAAA,GAAID,cAAA,CAA6B,iBAAiB,MAAS,CAAA;AAGnG,EAAAE,eAAA,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,kBAAkBC,WAAA,EAAM;AAC9B,EAAA,MAAM,EAAE,OAAO,QAAA,EAAU,OAAA,EAAS,qBAAoB,GAAIC,kDAAA,CAAe,KAAA,IAAS,EAAE,CAAA;AAEpF,EAAA,MAAM,iBAAA,GAAoBC,aAAA;AAAA,IACxB,MACEC,yEAAA;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,GAAIN,cAAA,CAAmB,EAAE,CAAA;AAEnE,EAAAE,eAAA,CAAU,MAAM;AACd,IAAA,IAAI,iBAAA,CAAkB,SAAS,CAAA,EAAG;AAChC,MAAA,kBAAA,CAAmBK,gDAAA,CAAc,iBAAiB,CAAC,CAAA;AAAA,IACrD;AAAA,EACF,CAAA,EAAG,CAAC,iBAAiB,CAAC,CAAA;AAEtB,EAAA,MAAM,QAAA,GAAWF,aAAA;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,gBAAA,mCACHG,yBAAA,EAAA,EACC,QAAA,EAAA;AAAA,oBAAAC,cAAA;AAAA,MAACD,yBAAA,CAAa,OAAA;AAAA,MAAb;AAAA,QACC,MAAA,kBACEC,cAAA,CAACC,aAAA,EAAA,EAAO,IAAA,EAAK,IAAA,EAAK,OAAA,EAAQ,eAAA,EAAgB,YAAA,EAAW,eAAA,EACnD,QAAA,kBAAAD,cAAA,CAACE,8BAAA,EAAA,EAAmB,CAAA,EACtB;AAAA;AAAA,KAEJ;AAAA,oBACAC,eAAA,CAACJ,yBAAA,CAAa,OAAA,EAAb,EAAqB,OAAM,KAAA,EACzB,QAAA,EAAA;AAAA,MAAA,CAAC,aAAA,IAAiB,iBAAA,oBACjBI,eAAA,CAACJ,yBAAA,CAAa,IAAA,EAAb,EAAkB,QAAA,EAAU,MAAM,YAAA,CAAa,CAAC,SAAS,CAAA,EACvD,QAAA,EAAA;AAAA,QAAA,SAAA,mBAAYC,cAAA,CAACI,8BAAA,EAAA,EAAmB,CAAA,mBAAKJ,cAAA,CAACK,8BAAA,EAAA,EAAmB,CAAA;AAAA,QACzD,YAAY,cAAA,GAAiB;AAAA,OAAA,EAChC,CAAA;AAAA,MAED,CAAC,iBAAiB,eAAA,oBACjBF,eAAA,CAACJ,0BAAa,IAAA,EAAb,EAAkB,UAAU,eAAA,EAC3B,QAAA,EAAA;AAAA,wBAAAC,cAAA,CAACM,2BAAA,EAAA,EAAgB,CAAA;AAAA,QAAE;AAAA,OAAA,EAErB,CAAA;AAAA,MAED,CAAC,aAAA,IAAiB,mBAAA,oBACjBH,eAAA,CAACJ,yBAAA,CAAa,MAAb,EAAkB,QAAA,EAAU,MAAM,mBAAA,CAAoB,EAAE,OAAA,EAAS,UAAA,EAAY,QAAA,EAAU,MAAA,EAAQ,CAAA,EAC9F,QAAA,EAAA;AAAA,wBAAAC,cAAA,CAACO,oBAAA,EAAA,EAAS,CAAA;AAAA,QAAE;AAAA,OAAA,EAEd,CAAA;AAAA,MAED,CAAC,aAAA,IAAiB,qBAAA,oBACjBJ,eAAA,CAACJ,yBAAA,CAAa,IAAA,EAAb,EAAkB,QAAA,EAAU,MAAM,qBAAA,CAAsB,EAAE,OAAA,EAAS,CAAA,EAClE,QAAA,EAAA;AAAA,wBAAAC,cAAA,CAACQ,sBAAA,EAAA,EAAW,CAAA;AAAA,QAAE;AAAA,OAAA,EAEhB,CAAA;AAAA,MAED,CAAC,aAAA,IAAiB,aAAA,IAAiB,SAAA,oBAClCL,eAAA,CAACJ,yBAAA,CAAa,IAAA,EAAb,EAAkB,MAAA,kBAAQC,cAAA,CAAC,aAAA,EAAA,EAAc,IAAA,EAAM,WAAW,CAAA,EACzD,QAAA,EAAA;AAAA,wBAAAA,cAAA,CAACS,qBAAA,EAAA,EAAU,CAAA;AAAA,QAAE;AAAA,OAAA,EAEf,CAAA;AAAA,sBAEFN,eAAA,CAACJ,yBAAA,CAAa,IAAA,EAAb,EAAkB,QAAA,EAAU,oBAAoB,QAAA,EAAU,MAAM,iBAAA,CAAkB,OAAO,CAAA,EACvF,QAAA,EAAA;AAAA,QAAA,kBAAA,kCAAsBW,uBAAA,EAAA,EAAY,SAAA,EAAU,cAAA,EAAe,CAAA,kCAAMC,wBAAA,EAAA,EAAa,CAAA;AAAA,QAAG;AAAA,OAAA,EAEpF;AAAA,KAAA,EACF;AAAA,GAAA,EACF,CAAA;AAGF,EAAA,uBACER,eAAA,CAACS,mBAAA,EAAA,EAAU,SAAA,EAAsB,SAAA,EAC/B,QAAA,EAAA;AAAA,oBAAAZ,cAAA,CAACY,mBAAA,CAAU,MAAA,EAAV,EACE,QAAA,EAAA,aAAA,mBACCT,eAAA,CAAAU,mBAAA,EAAA,EACE,QAAA,EAAA;AAAA,sBAAAb,cAAA,CAACY,mBAAA,CAAU,OAAA,EAAV,EAAkB,QAAA,EAAA,gBAAA,EAAc,CAAA;AAAA,sBACjCZ,cAAA,CAACc,yBAAA,EAAA,EAAa,SAAA,EAAU,kBAAA,EAAoB,QAAA,EAAA,gBAAA,EAAiB;AAAA,KAAA,EAC/D,oBAEAX,eAAA,CAAAU,mBAAA,EAAA,EACE,QAAA,EAAA;AAAA,sBAAAV,eAAA,CAAC,KAAA,EAAA,EAAI,WAAU,oCAAA,EACb,QAAA,EAAA;AAAA,wBAAAA,eAAA,CAACS,mBAAA,CAAU,SAAV,EAAkB,QAAA,EAAA;AAAA,UAAA,QAAA;AAAA,0CACV,GAAA,EAAA,EAAE,QAAA,EAAA;AAAA,YAAA,IAAA;AAAA,YAAGG,mCAAA,CAAe,SAAS,EAAE;AAAA,WAAA,EAAE;AAAA,SAAA,EAC1C,CAAA;AAAA,QACC,CAAC,aAAa,QAAA,oBACbf,cAAA;AAAA,UAACgB,yEAAA;AAAA,UAAA;AAAA,YACC,QAAA;AAAA,YACA,KAAA;AAAA,YACA,UAAA;AAAA,YACA;AAAA;AAAA;AACF,OAAA,EAEJ,CAAA;AAAA,sBACAb,eAAA,CAACW,yBAAA,EAAA,EAAa,SAAA,EAAU,6BAAA,EACrB,QAAA,EAAA;AAAA,QAAA,gBAAA;AAAA,QAAA,CACC,cAAc,MAAA,qBACdd,cAAA;AAAA,UAACY,mBAAA,CAAU,WAAA;AAAA,UAAV;AAAA,YACC,UAAA;AAAA,YACA,MAAA;AAAA,YACA,aAAA,EAAc,gBAAA;AAAA,YACd,SAAA,EAAU;AAAA;AAAA,SACZ;AAAA,wBAEFZ,cAAA,CAACY,mBAAA,CAAU,WAAA,EAAV,EAAsB,SAAS,OAAA,EAAS;AAAA,OAAA,EAC3C;AAAA,KAAA,EACF,CAAA,EAEJ,CAAA;AAAA,IAEC,CAAC,SAAA,oBACAZ,cAAA;AAAA,MAAC,iBAAA;AAAA,MAAA;AAAA,QACC,iBAAA;AAAA,QACA,aAAA;AAAA,QACA,cAAA,EAAgB,KAAA;AAAA,QAChB,YAAA,EAAc,cAAA;AAAA,QAEb,sCACCA,cAAA,CAACY,mBAAA,CAAU,WAAA,EAAV,EAAsB,8BAAgB,CAAA,GACrC,CAAC,KAAA,EAAO,MAAA,kCACTA,mBAAA,CAAU,MAAA,EAAV,EAAiB,QAAA,EAAA,gCAAA,EAA8B,KAE/C,MAAM;AACL,UAAA,MAAM,WAAA,mBACJT,eAAA,CAACS,mBAAA,CAAU,OAAA,EAAV,EACE,QAAA,EAAA;AAAA,YAAA,CAAC,iBACA,CAAC,eAAA,IACD,CAAC,mBAAA,IACD,CAAC,yBACD,0BAAA,oBACEZ,cAAA,CAACiB,iBAAO,OAAA,EAAQ,MAAA,EAAO,WAAU,MAAA,EAC/B,QAAA,kBAAAjB,cAAA,CAACiB,cAAO,OAAA,EAAP,EAAe,mHAGhB,CAAA,EACF,CAAA;AAAA,4BAMJjB,cAAA;AAAA,cAACkB,qDAAA;AAAA,cAAA;AAAA,gBACC,iBAAA;AAAA,gBACA,WAAA,EAAa,eAAA;AAAA,gBACb,cAAA;AAAA,gBACA,eAAA;AAAA,gBACA,kBAAA;AAAA,gBACA,eAAA;AAAA,gBACA,UAAA,EAAY,kBAAA;AAAA,gBACZ,WAAA,kBACElB,cAAA;AAAA,kBAACmB,iCAAA;AAAA,kBAAA;AAAA,oBACC,IAAA,EAAM,eAAA;AAAA,oBACN,KAAA,EAAM,cAAA;AAAA,oBACN,aAAA,EAAa,IAAA;AAAA,oBACb,WAAA,EAAY,iBAAA;AAAA,oBACZ,KAAA,EAAO,KAAA;AAAA,oBACP,QAAA,EAAU,CAAA,CAAA,KAAK,QAAA,CAAS,CAAA,CAAE,OAAO,KAAK,CAAA;AAAA,oBACtC,OAAA,EAAS,MAAM,QAAA,CAAS,EAAE,CAAA;AAAA,oBAC1B,IAAA,EAAK,IAAA;AAAA,oBACL,OAAA,EAAQ,SAAA;AAAA,oBACR,SAAA,EAAU;AAAA;AAAA;AACZ;AAAA,aAEJ;AAAA,YAEC,kBAAkB,MAAA,KAAW,CAAA,mCAAMP,mBAAA,CAAU,MAAA,EAAV,EAAiB,QAAA,EAAA,6BAAA,EAA2B;AAAA,WAAA,EAClF,CAAA;AAIF,UAAA,IAAI,CAAC,aAAA,IAAiB,CAAC,eAAA,EAAiB,OAAO,WAAA;AAI/C,UAAA,uBACET,eAAA;AAAA,YAACiB,aAAA;AAAA,YAAA;AAAA,cACC,UAAA,EAAW,SAAA;AAAA,cACX,KAAA,EAAO,SAAA;AAAA,cACP,aAAA,EAAe,WAAA;AAAA,cACf,SAAA,EAAU,0CAAA;AAAA,cAGV,QAAA,EAAA;AAAA,gCAAApB,cAAA,CAACY,mBAAA,CAAU,MAAA,EAAV,EAAiB,SAAA,EAAU,MAAA,EAC1B,0CAACS,gBAAA,EAAA,EAAQ,OAAA,EAAQ,YAAA,EAAa,SAAA,EAAU,MAAA,EACtC,QAAA,EAAA;AAAA,kCAAArB,cAAA,CAACsB,WAAA,EAAA,EAAI,KAAA,EAAM,SAAA,EAAU,QAAA,EAAA,OAAA,EAAK,CAAA;AAAA,kBACzB,eAAA,oBACCnB,eAAA,CAACmB,WAAA,EAAA,EAAI,KAAA,EAAM,UAAA,EAAW,QAAA,EAAA;AAAA,oBAAA,UAAA;AAAA,oBAAS,gBAAA,IAAoB,wBAAQnB,eAAA,CAAAU,mBAAA,EAAA,EAAE,QAAA,EAAA;AAAA,sBAAA,IAAA;AAAA,sBAAG,gBAAA;AAAA,sBAAiB;AAAA,qBAAA,EAAC;AAAA,mBAAA,EAAI,CAAA;AAAA,kBAEvF,aAAA,oBACCV,eAAA,CAACmB,WAAA,EAAA,EAAI,KAAA,EAAM,QAAA,EAAS,QAAA,EAAA;AAAA,oBAAA,QAAA;AAAA,oBAAO,cAAA,IAAkB,wBAAQnB,eAAA,CAAAU,mBAAA,EAAA,EAAE,QAAA,EAAA;AAAA,sBAAA,IAAA;AAAA,sBAAG,cAAA;AAAA,sBAAe;AAAA,qBAAA,EAAC;AAAA,mBAAA,EAAI;AAAA,iBAAA,EAElF,CAAA,EACF,CAAA;AAAA,+CAECU,sBAAA,EAAA,EAAW,KAAA,EAAM,SAAA,EAAU,SAAA,EAAU,gBACnC,QAAA,EAAA,WAAA,EACH,CAAA;AAAA,gBACC,mCACCvB,cAAA,CAACuB,sBAAA,EAAA,EAAW,KAAA,EAAM,UAAA,EAAW,WAAU,qBAAA,EACrC,QAAA,kBAAAvB,cAAA,CAACY,mBAAA,CAAU,OAAA,EAAV,EAAmB,QAAA,EAAA,eAAA,CAAgB,EAAE,OAAA,EAAS,GAAE,CAAA,EACnD,CAAA;AAAA,gBAED,iCACCZ,cAAA,CAACuB,sBAAA,EAAA,EAAW,OAAM,QAAA,EAAS,SAAA,EAAU,uBACnC,QAAA,kBAAAvB,cAAA,CAACY,mBAAA,CAAU,SAAV,EAAmB,QAAA,EAAA,aAAA,CAAc,EAAE,OAAA,EAAS,UAAA,EAAY,UAAU,MAAA,EAAQ,GAAE,CAAA,EAC/E;AAAA;AAAA;AAAA,WAEJ;AAAA,QAEJ,CAAA;AAAG;AAAA;AAEP,GAAA,EAEJ,CAAA;AAEJ;AAUA,SAAS,iBAAA,CAAkB;AAAA,EACzB,iBAAA;AAAA,EACA,aAAA;AAAA,EACA,cAAA;AAAA,EACA,YAAA;AAAA,EACA;AACF,CAAA,EAOG;AAGD,EAAA,MAAM,EAAE,GAAA,EAAK,YAAA,EAAa,GAAIY,wCAAiC,cAAc,CAAA;AAK7E,EAAA,MAAM,EAAE,GAAA,EAAK,gBAAA,EAAiB,GAAIC,yDAAA,CAA0C,gBAAgB,YAAY,CAAA;AAExG,EAAA,MAAM,UAAU,iBAAA,GACZ,aAAA,GACE,yBAAA,GACA,yBAAA,GACF,gBACE,yBAAA,GACA,yBAAA;AAEN,EAAA,uBACEtB,eAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA,EAAK,YAAA;AAAA,MACL,oBAAA,EAAkB,IAAA;AAAA,MAClB,SAAA,EAAWuB,WAAA,CAAG,iFAAA,EAAmF,OAAO,CAAA;AAAA,MAExG,QAAA,EAAA;AAAA,wBAAA1B,cAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW0B,WAAA;AAAA,cACT,+CAAA;AAAA,cACA,iBAAA,IAAqB;AAAA,aACvB;AAAA,YAEC,QAAA,EAAA;AAAA;AAAA,SACH;AAAA,wBACA1B,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,+CAAA,EAAiD,QAAA,EAAS,CAAA;AAAA,wBAEzEA,cAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,GAAA,EAAK,gBAAA;AAAA,YACL,gBAAA,EAAc,IAAA;AAAA,YACd,SAAA,EAAW0B,WAAA;AAAA,cACT,+CAAA;AAAA,cACA,aAAA,IAAiB;AAAA,aACnB;AAAA,YAEC,QAAA,EAAA;AAAA;AAAA;AACH;AAAA;AAAA,GACF;AAEJ;;;;"}
1
+ {"version":3,"file":"trace-data-panel-view.cjs.js","sources":["../../../../src/domains/traces/components/trace-data-panel-view.tsx"],"sourcesContent":["import {\n CircleGaugeIcon,\n ChevronsDownUpIcon,\n ChevronsUpDownIcon,\n DownloadIcon,\n Link2Icon,\n Loader2Icon,\n MoreHorizontalIcon,\n SaveIcon,\n WrenchIcon,\n} from 'lucide-react';\nimport { useEffect, useId, 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 { TraceSummaryDescription } from './trace-summary-description';\nimport { TraceTimeline } from './trace-timeline';\nimport { Button } from '@/ds/components/Button';\nimport { ButtonsGroup } from '@/ds/components/ButtonsGroup';\nimport { DataPanel } from '@/ds/components/DataPanel';\nimport { DropdownMenu } from '@/ds/components/DropdownMenu';\nimport { SearchFieldBlock } from '@/ds/components/FormFieldBlocks';\nimport { Notice } from '@/ds/components/Notice';\nimport { Tab, TabContent, TabList, Tabs } from '@/ds/components/Tabs';\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 { truncateString } from '@/lib/truncate-string';\nimport { cn } from '@/lib/utils';\n\nexport type TraceDataPanelPlacement = 'traces-list' | 'trace-page';\n\nexport type TraceDataPanelTab = 'details' | 'scores' | 'feedback';\n\nexport interface TraceDataPanelViewProps {\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 collapsed?: boolean;\n onCollapsedChange?: (collapsed: boolean) => void;\n placement: TraceDataPanelPlacement;\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, the panel content becomes tabbed (\"Details\" / \"Scores\"); the slot\n * renders whatever trace-level 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 shown in the \"Feedback\" tab label. */\n feedbackTabBadge?: ReactNode;\n activeTab?: TraceDataPanelTab;\n onTabChange?: (tab: TraceDataPanelTab) => void;\n /** Span ids to feature in the timeline; every other span is faded. */\n featuredSpanIds?: string[];\n /**\n * Rendered as a column to the left of the timeline inside the same card;\n * typically the reconstructed agent turn (\"Messages\").\n */\n messagesPanelSlot?: ReactNode;\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 /** Extra classes applied to the panel root (e.g. `h-full` on the trace page). */\n className?: string;\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 collapsed: controlledCollapsed,\n onCollapsedChange,\n placement,\n timelineChartWidth = 'default',\n LinkComponent,\n traceHref,\n entityHref,\n usage,\n anchorSpanId,\n showUnavailableFeaturesMsg = true,\n scoresTabSlot,\n scoresTabBadge,\n feedbackTabSlot,\n feedbackTabBadge,\n activeTab,\n onTabChange,\n featuredSpanIds,\n messagesPanelSlot,\n spanPanelSlot,\n className,\n}: TraceDataPanelViewProps) {\n const isOnTracePage = placement === 'trace-page';\n const [internalCollapsed, setInternalCollapsed] = useState(false);\n const collapsed = controlledCollapsed ?? internalCollapsed;\n const setCollapsed = onCollapsedChange ?? setInternalCollapsed;\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 searchFieldName = useId();\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 traceActionsMenu = (\n <DropdownMenu>\n <DropdownMenu.Trigger\n render={\n <Button size=\"md\" tooltip=\"Trace actions\" aria-label=\"Trace actions\">\n <MoreHorizontalIcon />\n </Button>\n }\n />\n <DropdownMenu.Content align=\"end\">\n {!isOnTracePage && onCollapsedChange && (\n <DropdownMenu.Item onSelect={() => setCollapsed(!collapsed)}>\n {collapsed ? <ChevronsUpDownIcon /> : <ChevronsDownUpIcon />}\n {collapsed ? 'Expand panel' : 'Collapse panel'}\n </DropdownMenu.Item>\n )}\n {!isOnTracePage && onEvaluateTrace && (\n <DropdownMenu.Item onSelect={onEvaluateTrace}>\n <CircleGaugeIcon />\n Evaluate trace\n </DropdownMenu.Item>\n )}\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 return (\n <DataPanel collapsed={collapsed} className={className}>\n <DataPanel.Header>\n {isOnTracePage ? (\n <>\n <DataPanel.Heading>Trace Timeline</DataPanel.Heading>\n <ButtonsGroup className=\"ml-auto shrink-0\">{traceActionsMenu}</ButtonsGroup>\n </>\n ) : (\n <>\n <div className=\"flex min-w-0 flex-1 flex-col gap-1\">\n <DataPanel.Heading>\n Trace <b># {truncateString(traceId, 12)}</b>\n </DataPanel.Heading>\n {!collapsed && rootSpan && (\n <TraceSummaryDescription\n rootSpan={rootSpan}\n usage={usage}\n entityHref={entityHref}\n LinkComponent={LinkComponent}\n />\n )}\n </div>\n <ButtonsGroup className=\"ml-auto shrink-0 self-start\">\n {traceActionsMenu}\n {(onPrevious || onNext) && (\n <DataPanel.NextPrevNav\n onPrevious={onPrevious}\n onNext={onNext}\n previousLabel=\"Previous trace\"\n nextLabel=\"Next trace\"\n />\n )}\n <DataPanel.CloseButton onClick={onClose} />\n </ButtonsGroup>\n </>\n )}\n </DataPanel.Header>\n\n {!collapsed && (\n <TracePanelColumns\n messagesPanelSlot={messagesPanelSlot}\n spanPanelSlot={spanPanelSlot}\n highlightQuery={query}\n spanPanelKey={selectedSpanId}\n >\n {isLoading ? (\n <DataPanel.LoadingData>Loading trace...</DataPanel.LoadingData>\n ) : !spans?.length ? (\n <DataPanel.NoData>No spans found for this trace.</DataPanel.NoData>\n ) : (\n (() => {\n const detailsBody = (\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 {/* The timeline stays mounted even with no results, because it\n hosts the search field: unmounting it would strand the user\n with a query they can no longer clear. */}\n <TraceTimeline\n hierarchicalSpans={hierarchicalSpans}\n onSpanClick={handleSpanClick}\n selectedSpanId={selectedSpanId}\n expandedSpanIds={expandedSpanIds}\n setExpandedSpanIds={setExpandedSpanIds}\n featuredSpanIds={featuredSpanIds}\n chartWidth={timelineChartWidth}\n leadingSlot={\n <SearchFieldBlock\n name={searchFieldName}\n label=\"Search spans\"\n labelIsHidden\n placeholder=\"Search spans...\"\n value={query}\n onChange={e => setQuery(e.target.value)}\n onReset={() => setQuery('')}\n size=\"sm\"\n variant=\"outline\"\n className=\"w-full\"\n />\n }\n />\n\n {hierarchicalSpans.length === 0 && <DataPanel.NoData>No spans match your search.</DataPanel.NoData>}\n </DataPanel.Content>\n );\n\n // No extra tab slots → render details directly without the Tabs wrapper.\n if (!scoresTabSlot && !feedbackTabSlot) return detailsBody;\n\n // The tab list sits in a header row so it lines up with the Messages and\n // span-detail headers in the neighbouring columns.\n return (\n <Tabs<TraceDataPanelTab>\n defaultTab=\"details\"\n value={activeTab}\n onValueChange={onTabChange}\n className=\"grid h-full min-h-0 grid-rows-[auto_1fr]\"\n >\n {/* min-h-16 keeps this header level with the two-line span panel header next to it. */}\n <DataPanel.Header className=\"min-h-16 py-2\">\n <TabList variant=\"pill-ghost\" className=\"px-0\">\n <Tab value=\"details\">Spans</Tab>\n {feedbackTabSlot && (\n <Tab value=\"feedback\">Feedback{feedbackTabBadge != null && <> ({feedbackTabBadge})</>}</Tab>\n )}\n {scoresTabSlot && (\n <Tab value=\"scores\">Scores{scoresTabBadge != null && <> ({scoresTabBadge})</>}</Tab>\n )}\n </TabList>\n </DataPanel.Header>\n\n <TabContent value=\"details\" className=\"min-h-0 py-0\">\n {detailsBody}\n </TabContent>\n {feedbackTabSlot && (\n <TabContent value=\"feedback\" className=\"h-full min-h-0 py-0\">\n <DataPanel.Content>{feedbackTabSlot({ traceId })}</DataPanel.Content>\n </TabContent>\n )}\n {scoresTabSlot && (\n <TabContent value=\"scores\" className=\"h-full min-h-0 py-0\">\n <DataPanel.Content>{scoresTabSlot({ traceId, rootSpanId: rootSpan?.spanId })}</DataPanel.Content>\n </TabContent>\n )}\n </Tabs>\n );\n })()\n )}\n </TracePanelColumns>\n )}\n </DataPanel>\n );\n}\n\n/**\n * Lays out the card body as three columns — `[messages] [trace] [span]` — inside the\n * same card. Both side cells always exist and collapse to `0fr` when their slot is\n * absent, so opening/closing a column animates via `grid-template-columns` rather\n * than mounting/unmounting a DOM 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 messagesPanelSlot,\n spanPanelSlot,\n highlightQuery,\n spanPanelKey,\n children,\n}: {\n messagesPanelSlot?: 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 const columns = messagesPanelSlot\n ? spanPanelSlot\n ? 'grid-cols-[1fr_1fr_1fr]'\n : 'grid-cols-[1fr_1fr_0fr]'\n : spanPanelSlot\n ? 'grid-cols-[0fr_1fr_1fr]'\n : 'grid-cols-[0fr_1fr_0fr]';\n\n return (\n <div\n ref={highlightRef}\n data-trace-columns\n className={cn('grid min-h-0 flex-1 transition-[grid-template-columns] duration-300 ease-in-out', columns)}\n >\n <div\n className={cn(\n 'flex min-h-0 min-w-0 flex-col overflow-hidden',\n messagesPanelSlot && 'animate-in border-r border-border1 duration-300 fade-in-0',\n )}\n >\n {messagesPanelSlot}\n </div>\n <div className=\"flex min-h-0 min-w-0 flex-col overflow-hidden\">{children}</div>\n {/* Searchable: the span detail is where a match hides inside a large payload. */}\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-border1 duration-300 fade-in-0',\n )}\n >\n {spanPanelSlot}\n </div>\n </div>\n );\n}\n"],"names":["useState","useDownloadTraceJson","useEffect","useId","useTraceSearch","useMemo","formatHierarchicalSpans","getAllSpanIds","DropdownMenu","jsx","Button","MoreHorizontalIcon","jsxs","ChevronsUpDownIcon","ChevronsDownUpIcon","CircleGaugeIcon","SaveIcon","WrenchIcon","Link2Icon","Loader2Icon","DownloadIcon","DataPanel","Fragment","ButtonsGroup","truncateString","TraceSummaryDescription","Notice","TraceTimeline","SearchFieldBlock","Tabs","TabList","Tab","TabContent","useTextHighlight","useScrollToFirstHighlight","cn"],"mappings":"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"}
@@ -9,7 +9,7 @@ import { TraceSummaryDescription } from './trace-summary-description.es.js';
9
9
  import { TraceTimeline } from './trace-timeline.es.js';
10
10
  import { B as Button } from '../../../Button-BsfLQEC6.js';
11
11
  import { B as ButtonsGroup } from '../../../buttons-group-BjM12HPx.js';
12
- import { D as DataPanel } from '../../../data-panel-2Da0Utgy.js';
12
+ import { D as DataPanel } from '../../../data-panel-DXxeSnL1.js';
13
13
  import { D as DropdownMenu } from '../../../dropdown-menu-BYTyEuSa.js';
14
14
  import { S as SearchFieldBlock } from '../../../search-field-block-D51aN1d9.js';
15
15
  import { N as Notice } from '../../../Notice-DSUAUUYU.js';
@@ -221,7 +221,7 @@ function TraceDataPanelView({
221
221
  onValueChange: onTabChange,
222
222
  className: "grid h-full min-h-0 grid-rows-[auto_1fr]",
223
223
  children: [
224
- /* @__PURE__ */ jsx(DataPanel.Header, { className: "py-2", children: /* @__PURE__ */ jsxs(TabList, { variant: "pill-ghost", className: "px-0", children: [
224
+ /* @__PURE__ */ jsx(DataPanel.Header, { className: "min-h-16 py-2", children: /* @__PURE__ */ jsxs(TabList, { variant: "pill-ghost", className: "px-0", children: [
225
225
  /* @__PURE__ */ jsx(Tab, { value: "details", children: "Spans" }),
226
226
  feedbackTabSlot && /* @__PURE__ */ jsxs(Tab, { value: "feedback", children: [
227
227
  "Feedback",
@@ -1 +1 @@
1
- {"version":3,"file":"trace-data-panel-view.es.js","sources":["../../../../src/domains/traces/components/trace-data-panel-view.tsx"],"sourcesContent":["import {\n CircleGaugeIcon,\n ChevronsDownUpIcon,\n ChevronsUpDownIcon,\n DownloadIcon,\n Link2Icon,\n Loader2Icon,\n MoreHorizontalIcon,\n SaveIcon,\n WrenchIcon,\n} from 'lucide-react';\nimport { useEffect, useId, 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 { TraceSummaryDescription } from './trace-summary-description';\nimport { TraceTimeline } from './trace-timeline';\nimport { Button } from '@/ds/components/Button';\nimport { ButtonsGroup } from '@/ds/components/ButtonsGroup';\nimport { DataPanel } from '@/ds/components/DataPanel';\nimport { DropdownMenu } from '@/ds/components/DropdownMenu';\nimport { SearchFieldBlock } from '@/ds/components/FormFieldBlocks';\nimport { Notice } from '@/ds/components/Notice';\nimport { Tab, TabContent, TabList, Tabs } from '@/ds/components/Tabs';\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 { truncateString } from '@/lib/truncate-string';\nimport { cn } from '@/lib/utils';\n\nexport type TraceDataPanelPlacement = 'traces-list' | 'trace-page';\n\nexport type TraceDataPanelTab = 'details' | 'scores' | 'feedback';\n\nexport interface TraceDataPanelViewProps {\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 collapsed?: boolean;\n onCollapsedChange?: (collapsed: boolean) => void;\n placement: TraceDataPanelPlacement;\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, the panel content becomes tabbed (\"Details\" / \"Scores\"); the slot\n * renders whatever trace-level 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 shown in the \"Feedback\" tab label. */\n feedbackTabBadge?: ReactNode;\n activeTab?: TraceDataPanelTab;\n onTabChange?: (tab: TraceDataPanelTab) => void;\n /** Span ids to feature in the timeline; every other span is faded. */\n featuredSpanIds?: string[];\n /**\n * Rendered as a column to the left of the timeline inside the same card;\n * typically the reconstructed agent turn (\"Messages\").\n */\n messagesPanelSlot?: ReactNode;\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 /** Extra classes applied to the panel root (e.g. `h-full` on the trace page). */\n className?: string;\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 collapsed: controlledCollapsed,\n onCollapsedChange,\n placement,\n timelineChartWidth = 'default',\n LinkComponent,\n traceHref,\n entityHref,\n usage,\n anchorSpanId,\n showUnavailableFeaturesMsg = true,\n scoresTabSlot,\n scoresTabBadge,\n feedbackTabSlot,\n feedbackTabBadge,\n activeTab,\n onTabChange,\n featuredSpanIds,\n messagesPanelSlot,\n spanPanelSlot,\n className,\n}: TraceDataPanelViewProps) {\n const isOnTracePage = placement === 'trace-page';\n const [internalCollapsed, setInternalCollapsed] = useState(false);\n const collapsed = controlledCollapsed ?? internalCollapsed;\n const setCollapsed = onCollapsedChange ?? setInternalCollapsed;\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 searchFieldName = useId();\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 traceActionsMenu = (\n <DropdownMenu>\n <DropdownMenu.Trigger\n render={\n <Button size=\"md\" tooltip=\"Trace actions\" aria-label=\"Trace actions\">\n <MoreHorizontalIcon />\n </Button>\n }\n />\n <DropdownMenu.Content align=\"end\">\n {!isOnTracePage && onCollapsedChange && (\n <DropdownMenu.Item onSelect={() => setCollapsed(!collapsed)}>\n {collapsed ? <ChevronsUpDownIcon /> : <ChevronsDownUpIcon />}\n {collapsed ? 'Expand panel' : 'Collapse panel'}\n </DropdownMenu.Item>\n )}\n {!isOnTracePage && onEvaluateTrace && (\n <DropdownMenu.Item onSelect={onEvaluateTrace}>\n <CircleGaugeIcon />\n Evaluate trace\n </DropdownMenu.Item>\n )}\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 return (\n <DataPanel collapsed={collapsed} className={className}>\n <DataPanel.Header>\n {isOnTracePage ? (\n <>\n <DataPanel.Heading>Trace Timeline</DataPanel.Heading>\n <ButtonsGroup className=\"ml-auto shrink-0\">{traceActionsMenu}</ButtonsGroup>\n </>\n ) : (\n <>\n <div className=\"flex min-w-0 flex-1 flex-col gap-1\">\n <DataPanel.Heading>\n Trace <b># {truncateString(traceId, 12)}</b>\n </DataPanel.Heading>\n {!collapsed && rootSpan && (\n <TraceSummaryDescription\n rootSpan={rootSpan}\n usage={usage}\n entityHref={entityHref}\n LinkComponent={LinkComponent}\n />\n )}\n </div>\n <ButtonsGroup className=\"ml-auto shrink-0 self-start\">\n {traceActionsMenu}\n {(onPrevious || onNext) && (\n <DataPanel.NextPrevNav\n onPrevious={onPrevious}\n onNext={onNext}\n previousLabel=\"Previous trace\"\n nextLabel=\"Next trace\"\n />\n )}\n <DataPanel.CloseButton onClick={onClose} />\n </ButtonsGroup>\n </>\n )}\n </DataPanel.Header>\n\n {!collapsed && (\n <TracePanelColumns\n messagesPanelSlot={messagesPanelSlot}\n spanPanelSlot={spanPanelSlot}\n highlightQuery={query}\n spanPanelKey={selectedSpanId}\n >\n {isLoading ? (\n <DataPanel.LoadingData>Loading trace...</DataPanel.LoadingData>\n ) : !spans?.length ? (\n <DataPanel.NoData>No spans found for this trace.</DataPanel.NoData>\n ) : (\n (() => {\n const detailsBody = (\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 {/* The timeline stays mounted even with no results, because it\n hosts the search field: unmounting it would strand the user\n with a query they can no longer clear. */}\n <TraceTimeline\n hierarchicalSpans={hierarchicalSpans}\n onSpanClick={handleSpanClick}\n selectedSpanId={selectedSpanId}\n expandedSpanIds={expandedSpanIds}\n setExpandedSpanIds={setExpandedSpanIds}\n featuredSpanIds={featuredSpanIds}\n chartWidth={timelineChartWidth}\n leadingSlot={\n <SearchFieldBlock\n name={searchFieldName}\n label=\"Search spans\"\n labelIsHidden\n placeholder=\"Search spans...\"\n value={query}\n onChange={e => setQuery(e.target.value)}\n onReset={() => setQuery('')}\n size=\"sm\"\n variant=\"outline\"\n className=\"w-full\"\n />\n }\n />\n\n {hierarchicalSpans.length === 0 && <DataPanel.NoData>No spans match your search.</DataPanel.NoData>}\n </DataPanel.Content>\n );\n\n // No extra tab slots → render details directly without the Tabs wrapper.\n if (!scoresTabSlot && !feedbackTabSlot) return detailsBody;\n\n // The tab list sits in a header row so it lines up with the Messages and\n // span-detail headers in the neighbouring columns.\n return (\n <Tabs<TraceDataPanelTab>\n defaultTab=\"details\"\n value={activeTab}\n onValueChange={onTabChange}\n className=\"grid h-full min-h-0 grid-rows-[auto_1fr]\"\n >\n {/* Pill tabs carry their own p-1, so shrink the header padding to keep min-h-14. */}\n <DataPanel.Header className=\"py-2\">\n <TabList variant=\"pill-ghost\" className=\"px-0\">\n <Tab value=\"details\">Spans</Tab>\n {feedbackTabSlot && (\n <Tab value=\"feedback\">Feedback{feedbackTabBadge != null && <> ({feedbackTabBadge})</>}</Tab>\n )}\n {scoresTabSlot && (\n <Tab value=\"scores\">Scores{scoresTabBadge != null && <> ({scoresTabBadge})</>}</Tab>\n )}\n </TabList>\n </DataPanel.Header>\n\n <TabContent value=\"details\" className=\"min-h-0 py-0\">\n {detailsBody}\n </TabContent>\n {feedbackTabSlot && (\n <TabContent value=\"feedback\" className=\"h-full min-h-0 py-0\">\n <DataPanel.Content>{feedbackTabSlot({ traceId })}</DataPanel.Content>\n </TabContent>\n )}\n {scoresTabSlot && (\n <TabContent value=\"scores\" className=\"h-full min-h-0 py-0\">\n <DataPanel.Content>{scoresTabSlot({ traceId, rootSpanId: rootSpan?.spanId })}</DataPanel.Content>\n </TabContent>\n )}\n </Tabs>\n );\n })()\n )}\n </TracePanelColumns>\n )}\n </DataPanel>\n );\n}\n\n/**\n * Lays out the card body as three columns — `[messages] [trace] [span]` — inside the\n * same card. Both side cells always exist and collapse to `0fr` when their slot is\n * absent, so opening/closing a column animates via `grid-template-columns` rather\n * than mounting/unmounting a DOM 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 messagesPanelSlot,\n spanPanelSlot,\n highlightQuery,\n spanPanelKey,\n children,\n}: {\n messagesPanelSlot?: 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 const columns = messagesPanelSlot\n ? spanPanelSlot\n ? 'grid-cols-[1fr_1fr_1fr]'\n : 'grid-cols-[1fr_1fr_0fr]'\n : spanPanelSlot\n ? 'grid-cols-[0fr_1fr_1fr]'\n : 'grid-cols-[0fr_1fr_0fr]';\n\n return (\n <div\n ref={highlightRef}\n data-trace-columns\n className={cn('grid min-h-0 flex-1 transition-[grid-template-columns] duration-300 ease-in-out', columns)}\n >\n <div\n className={cn(\n 'flex min-h-0 min-w-0 flex-col overflow-hidden',\n messagesPanelSlot && 'animate-in border-r border-border1 duration-300 fade-in-0',\n )}\n >\n {messagesPanelSlot}\n </div>\n <div className=\"flex min-h-0 min-w-0 flex-col overflow-hidden\">{children}</div>\n {/* Searchable: the span detail is where a match hides inside a large payload. */}\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-border1 duration-300 fade-in-0',\n )}\n >\n {spanPanelSlot}\n </div>\n </div>\n );\n}\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"trace-data-panel-view.es.js","sources":["../../../../src/domains/traces/components/trace-data-panel-view.tsx"],"sourcesContent":["import {\n CircleGaugeIcon,\n ChevronsDownUpIcon,\n ChevronsUpDownIcon,\n DownloadIcon,\n Link2Icon,\n Loader2Icon,\n MoreHorizontalIcon,\n SaveIcon,\n WrenchIcon,\n} from 'lucide-react';\nimport { useEffect, useId, 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 { TraceSummaryDescription } from './trace-summary-description';\nimport { TraceTimeline } from './trace-timeline';\nimport { Button } from '@/ds/components/Button';\nimport { ButtonsGroup } from '@/ds/components/ButtonsGroup';\nimport { DataPanel } from '@/ds/components/DataPanel';\nimport { DropdownMenu } from '@/ds/components/DropdownMenu';\nimport { SearchFieldBlock } from '@/ds/components/FormFieldBlocks';\nimport { Notice } from '@/ds/components/Notice';\nimport { Tab, TabContent, TabList, Tabs } from '@/ds/components/Tabs';\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 { truncateString } from '@/lib/truncate-string';\nimport { cn } from '@/lib/utils';\n\nexport type TraceDataPanelPlacement = 'traces-list' | 'trace-page';\n\nexport type TraceDataPanelTab = 'details' | 'scores' | 'feedback';\n\nexport interface TraceDataPanelViewProps {\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 collapsed?: boolean;\n onCollapsedChange?: (collapsed: boolean) => void;\n placement: TraceDataPanelPlacement;\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, the panel content becomes tabbed (\"Details\" / \"Scores\"); the slot\n * renders whatever trace-level 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 shown in the \"Feedback\" tab label. */\n feedbackTabBadge?: ReactNode;\n activeTab?: TraceDataPanelTab;\n onTabChange?: (tab: TraceDataPanelTab) => void;\n /** Span ids to feature in the timeline; every other span is faded. */\n featuredSpanIds?: string[];\n /**\n * Rendered as a column to the left of the timeline inside the same card;\n * typically the reconstructed agent turn (\"Messages\").\n */\n messagesPanelSlot?: ReactNode;\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 /** Extra classes applied to the panel root (e.g. `h-full` on the trace page). */\n className?: string;\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 collapsed: controlledCollapsed,\n onCollapsedChange,\n placement,\n timelineChartWidth = 'default',\n LinkComponent,\n traceHref,\n entityHref,\n usage,\n anchorSpanId,\n showUnavailableFeaturesMsg = true,\n scoresTabSlot,\n scoresTabBadge,\n feedbackTabSlot,\n feedbackTabBadge,\n activeTab,\n onTabChange,\n featuredSpanIds,\n messagesPanelSlot,\n spanPanelSlot,\n className,\n}: TraceDataPanelViewProps) {\n const isOnTracePage = placement === 'trace-page';\n const [internalCollapsed, setInternalCollapsed] = useState(false);\n const collapsed = controlledCollapsed ?? internalCollapsed;\n const setCollapsed = onCollapsedChange ?? setInternalCollapsed;\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 searchFieldName = useId();\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 traceActionsMenu = (\n <DropdownMenu>\n <DropdownMenu.Trigger\n render={\n <Button size=\"md\" tooltip=\"Trace actions\" aria-label=\"Trace actions\">\n <MoreHorizontalIcon />\n </Button>\n }\n />\n <DropdownMenu.Content align=\"end\">\n {!isOnTracePage && onCollapsedChange && (\n <DropdownMenu.Item onSelect={() => setCollapsed(!collapsed)}>\n {collapsed ? <ChevronsUpDownIcon /> : <ChevronsDownUpIcon />}\n {collapsed ? 'Expand panel' : 'Collapse panel'}\n </DropdownMenu.Item>\n )}\n {!isOnTracePage && onEvaluateTrace && (\n <DropdownMenu.Item onSelect={onEvaluateTrace}>\n <CircleGaugeIcon />\n Evaluate trace\n </DropdownMenu.Item>\n )}\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 return (\n <DataPanel collapsed={collapsed} className={className}>\n <DataPanel.Header>\n {isOnTracePage ? (\n <>\n <DataPanel.Heading>Trace Timeline</DataPanel.Heading>\n <ButtonsGroup className=\"ml-auto shrink-0\">{traceActionsMenu}</ButtonsGroup>\n </>\n ) : (\n <>\n <div className=\"flex min-w-0 flex-1 flex-col gap-1\">\n <DataPanel.Heading>\n Trace <b># {truncateString(traceId, 12)}</b>\n </DataPanel.Heading>\n {!collapsed && rootSpan && (\n <TraceSummaryDescription\n rootSpan={rootSpan}\n usage={usage}\n entityHref={entityHref}\n LinkComponent={LinkComponent}\n />\n )}\n </div>\n <ButtonsGroup className=\"ml-auto shrink-0 self-start\">\n {traceActionsMenu}\n {(onPrevious || onNext) && (\n <DataPanel.NextPrevNav\n onPrevious={onPrevious}\n onNext={onNext}\n previousLabel=\"Previous trace\"\n nextLabel=\"Next trace\"\n />\n )}\n <DataPanel.CloseButton onClick={onClose} />\n </ButtonsGroup>\n </>\n )}\n </DataPanel.Header>\n\n {!collapsed && (\n <TracePanelColumns\n messagesPanelSlot={messagesPanelSlot}\n spanPanelSlot={spanPanelSlot}\n highlightQuery={query}\n spanPanelKey={selectedSpanId}\n >\n {isLoading ? (\n <DataPanel.LoadingData>Loading trace...</DataPanel.LoadingData>\n ) : !spans?.length ? (\n <DataPanel.NoData>No spans found for this trace.</DataPanel.NoData>\n ) : (\n (() => {\n const detailsBody = (\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 {/* The timeline stays mounted even with no results, because it\n hosts the search field: unmounting it would strand the user\n with a query they can no longer clear. */}\n <TraceTimeline\n hierarchicalSpans={hierarchicalSpans}\n onSpanClick={handleSpanClick}\n selectedSpanId={selectedSpanId}\n expandedSpanIds={expandedSpanIds}\n setExpandedSpanIds={setExpandedSpanIds}\n featuredSpanIds={featuredSpanIds}\n chartWidth={timelineChartWidth}\n leadingSlot={\n <SearchFieldBlock\n name={searchFieldName}\n label=\"Search spans\"\n labelIsHidden\n placeholder=\"Search spans...\"\n value={query}\n onChange={e => setQuery(e.target.value)}\n onReset={() => setQuery('')}\n size=\"sm\"\n variant=\"outline\"\n className=\"w-full\"\n />\n }\n />\n\n {hierarchicalSpans.length === 0 && <DataPanel.NoData>No spans match your search.</DataPanel.NoData>}\n </DataPanel.Content>\n );\n\n // No extra tab slots → render details directly without the Tabs wrapper.\n if (!scoresTabSlot && !feedbackTabSlot) return detailsBody;\n\n // The tab list sits in a header row so it lines up with the Messages and\n // span-detail headers in the neighbouring columns.\n return (\n <Tabs<TraceDataPanelTab>\n defaultTab=\"details\"\n value={activeTab}\n onValueChange={onTabChange}\n className=\"grid h-full min-h-0 grid-rows-[auto_1fr]\"\n >\n {/* min-h-16 keeps this header level with the two-line span panel header next to it. */}\n <DataPanel.Header className=\"min-h-16 py-2\">\n <TabList variant=\"pill-ghost\" className=\"px-0\">\n <Tab value=\"details\">Spans</Tab>\n {feedbackTabSlot && (\n <Tab value=\"feedback\">Feedback{feedbackTabBadge != null && <> ({feedbackTabBadge})</>}</Tab>\n )}\n {scoresTabSlot && (\n <Tab value=\"scores\">Scores{scoresTabBadge != null && <> ({scoresTabBadge})</>}</Tab>\n )}\n </TabList>\n </DataPanel.Header>\n\n <TabContent value=\"details\" className=\"min-h-0 py-0\">\n {detailsBody}\n </TabContent>\n {feedbackTabSlot && (\n <TabContent value=\"feedback\" className=\"h-full min-h-0 py-0\">\n <DataPanel.Content>{feedbackTabSlot({ traceId })}</DataPanel.Content>\n </TabContent>\n )}\n {scoresTabSlot && (\n <TabContent value=\"scores\" className=\"h-full min-h-0 py-0\">\n <DataPanel.Content>{scoresTabSlot({ traceId, rootSpanId: rootSpan?.spanId })}</DataPanel.Content>\n </TabContent>\n )}\n </Tabs>\n );\n })()\n )}\n </TracePanelColumns>\n )}\n </DataPanel>\n );\n}\n\n/**\n * Lays out the card body as three columns — `[messages] [trace] [span]` — inside the\n * same card. Both side cells always exist and collapse to `0fr` when their slot is\n * absent, so opening/closing a column animates via `grid-template-columns` rather\n * than mounting/unmounting a DOM 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 messagesPanelSlot,\n spanPanelSlot,\n highlightQuery,\n spanPanelKey,\n children,\n}: {\n messagesPanelSlot?: 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 const columns = messagesPanelSlot\n ? spanPanelSlot\n ? 'grid-cols-[1fr_1fr_1fr]'\n : 'grid-cols-[1fr_1fr_0fr]'\n : spanPanelSlot\n ? 'grid-cols-[0fr_1fr_1fr]'\n : 'grid-cols-[0fr_1fr_0fr]';\n\n return (\n <div\n ref={highlightRef}\n data-trace-columns\n className={cn('grid min-h-0 flex-1 transition-[grid-template-columns] duration-300 ease-in-out', columns)}\n >\n <div\n className={cn(\n 'flex min-h-0 min-w-0 flex-col overflow-hidden',\n messagesPanelSlot && 'animate-in border-r border-border1 duration-300 fade-in-0',\n )}\n >\n {messagesPanelSlot}\n </div>\n <div className=\"flex min-h-0 min-w-0 flex-col overflow-hidden\">{children}</div>\n {/* Searchable: the span detail is where a match hides inside a large payload. */}\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-border1 duration-300 fade-in-0',\n )}\n >\n {spanPanelSlot}\n </div>\n </div>\n );\n}\n"],"names":[],"mappings":"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"}
@@ -9,8 +9,6 @@ const utils_cn = require('../../../cn-DCPcv4xv.cjs');
9
9
  function TracesToolbar({
10
10
  onClear,
11
11
  onRemoveAll,
12
- onSave,
13
- onRemoveSaved,
14
12
  isLoading,
15
13
  filterFields,
16
14
  filterTokens,
@@ -46,9 +44,7 @@ function TracesToolbar({
46
44
  {
47
45
  disabled: isLoading,
48
46
  onClear: hasNonDefaultFilter ? onClear : void 0,
49
- onRemoveAll,
50
- onSave,
51
- onRemoveSaved
47
+ onRemoveAll
52
48
  }
53
49
  )
54
50
  ] })