@mastra/playground-ui 53.0.0 → 53.0.1-alpha.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.
- package/dist/components/DataList.cjs.js +4 -4
- package/dist/components/DataList.es.js +4 -4
- package/dist/components/EnvironmentVariablesEditor.cjs.js +1 -1
- package/dist/components/EnvironmentVariablesEditor.es.js +1 -1
- package/dist/components/LogsDataList.cjs.js +2 -2
- package/dist/components/LogsDataList.es.js +2 -2
- package/dist/{data-list-BUK_v9ax.js → data-list-BiEEjaEy.js} +2 -2
- package/dist/{data-list-BUK_v9ax.js.map → data-list-BiEEjaEy.js.map} +1 -1
- package/dist/{data-list-B5Wicaoc.cjs → data-list-DWOT5t0J.cjs} +2 -2
- package/dist/{data-list-B5Wicaoc.cjs.map → data-list-DWOT5t0J.cjs.map} +1 -1
- package/dist/{data-list-skeleton-BZR_Hkvj.cjs → data-list-skeleton-7eKxso9c.cjs} +3 -3
- package/dist/data-list-skeleton-7eKxso9c.cjs.map +1 -0
- package/dist/{data-list-skeleton-BoaQlbOY.js → data-list-skeleton-CbjuDDK_.js} +3 -3
- package/dist/data-list-skeleton-CbjuDDK_.js.map +1 -0
- package/dist/{data-list-top-cell-D4-Hbz2H.js → data-list-top-cell-0MJ6fgiR.js} +19 -2
- package/dist/data-list-top-cell-0MJ6fgiR.js.map +1 -0
- package/dist/{data-list-top-cell-CIs1L8gy.cjs → data-list-top-cell-BZwIuC1M.cjs} +19 -1
- package/dist/data-list-top-cell-BZwIuC1M.cjs.map +1 -0
- package/dist/domains/logs/components/logs-list-view.cjs.js +2 -2
- package/dist/domains/logs/components/logs-list-view.es.js +2 -2
- package/dist/domains/metrics/components/memory-card-view.cjs.js +1 -1
- package/dist/domains/metrics/components/memory-card-view.es.js +1 -1
- package/dist/domains/metrics/components/model-usage-cost-card-view.cjs.js +1 -1
- package/dist/domains/metrics/components/model-usage-cost-card-view.es.js +1 -1
- package/dist/domains/metrics/components/scores-card-view.cjs.js +1 -1
- package/dist/domains/metrics/components/scores-card-view.es.js +1 -1
- package/dist/domains/traces/components/span-data-panel-view.cjs.js +2 -6
- package/dist/domains/traces/components/span-data-panel-view.cjs.js.map +1 -1
- package/dist/domains/traces/components/span-data-panel-view.es.js +2 -6
- package/dist/domains/traces/components/span-data-panel-view.es.js.map +1 -1
- package/dist/domains/traces/components/trace-data-panel-view.cjs.js +1 -5
- package/dist/domains/traces/components/trace-data-panel-view.cjs.js.map +1 -1
- package/dist/domains/traces/components/trace-data-panel-view.es.js +1 -5
- package/dist/domains/traces/components/trace-data-panel-view.es.js.map +1 -1
- package/dist/domains/traces/components/traces-list-view.cjs.js +3 -3
- package/dist/domains/traces/components/traces-list-view.es.js +3 -3
- package/dist/ee/signals/components/entity-index-list.cjs.js +1 -1
- package/dist/ee/signals/components/entity-index-list.es.js +1 -1
- package/dist/ee/signals/components/trace-intelligence-entity-index.cjs.js +1 -1
- package/dist/ee/signals/components/trace-intelligence-entity-index.es.js +1 -1
- package/dist/ee/topics/components/topic-trace-summary-list.cjs.js +1 -1
- package/dist/ee/topics/components/topic-trace-summary-list.es.js +1 -1
- package/dist/{logs-data-list-PExVAYf3.cjs → logs-data-list-BcPdFb2K.cjs} +2 -2
- package/dist/{logs-data-list-PExVAYf3.cjs.map → logs-data-list-BcPdFb2K.cjs.map} +1 -1
- package/dist/{logs-data-list-VCTqogr3.js → logs-data-list-D7NBF4iw.js} +2 -2
- package/dist/{logs-data-list-VCTqogr3.js.map → logs-data-list-D7NBF4iw.js.map} +1 -1
- package/dist/src/domains/traces/components/span-data-panel-view.d.ts +1 -1
- package/dist/src/domains/traces/components/trace-data-panel-view.d.ts +1 -1
- package/dist/src/ds/components/DataList/shared.d.ts +2 -0
- package/dist/{traces-data-list-MX4shJfG.cjs → traces-data-list-A8CE_PYA.cjs} +3 -3
- package/dist/{traces-data-list-MX4shJfG.cjs.map → traces-data-list-A8CE_PYA.cjs.map} +1 -1
- package/dist/{traces-data-list-BnK1mfZp.js → traces-data-list-CV5HmwE2.js} +3 -3
- package/dist/{traces-data-list-BnK1mfZp.js.map → traces-data-list-CV5HmwE2.js.map} +1 -1
- package/package.json +7 -7
- package/dist/data-list-skeleton-BZR_Hkvj.cjs.map +0 -1
- package/dist/data-list-skeleton-BoaQlbOY.js.map +0 -1
- package/dist/data-list-top-cell-CIs1L8gy.cjs.map +0 -1
- package/dist/data-list-top-cell-D4-Hbz2H.js.map +0 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"data-list-top-cell-BZwIuC1M.cjs","sources":["../src/ds/components/DataList/shared.ts","../src/ds/components/DataList/data-list-cells.tsx","../src/ds/components/DataList/data-list-next-page-loading.tsx","../src/ds/components/DataList/data-list-no-match.tsx","../src/ds/components/DataList/data-list-root.tsx","../src/ds/components/DataList/data-list-row-wrapper-context.ts","../src/ds/components/DataList/data-list-row-button.tsx","../src/ds/components/DataList/data-list-row-link.tsx","../src/ds/components/DataList/data-list-row-wrapper.tsx","../src/ds/components/DataList/data-list-spacer.tsx","../src/ds/components/DataList/data-list-top.tsx","../src/ds/components/DataList/data-list-top-cell.tsx"],"sourcesContent":["/**\n * Row-level styling for the element that participates in the row sibling\n * chain — applied to `DataList.RowButton` / `DataList.RowLink` when used\n * standalone, and to `DataList.RowWrapper` when used as a shell around them.\n *\n * Carries the `.data-list-row` marker class the root styles target.\n */\nexport const dataListRowOuterStyles = [\n 'group/data-list-row data-list-row col-span-full relative min-h-9 bg-surface2',\n 'transition-colors duration-200',\n] as const;\n\n/**\n * Interactive state fills for the outer row element. Applied to standalone\n * `RowButton` / `RowLink` and to `RowWrapper`. The `has-*` forms let a wrapper\n * mirror the tone of the interactive row nested inside it.\n */\nexport const dataListRowStateStyles = [\n 'hover:bg-surface3 active:bg-surface4',\n 'data-featured:bg-surface3 has-data-featured:bg-surface3 has-data-selected:bg-surface3',\n 'data-featured:hover:bg-surface4 has-data-featured:hover:bg-surface4 has-data-selected:hover:bg-surface4',\n 'data-[variant=error]:bg-notice-destructive/10 has-data-[variant=error]:bg-notice-destructive/10',\n] as const;\n\n/**\n * Layout and focus for the interactive element. The background lives on the\n * outer row element so it sits inside the root surface.\n */\nexport const dataListRowInteractiveStyles = [\n 'grid grid-cols-subgrid gap-8 px-5 cursor-pointer',\n 'outline-none focus-visible:ring-1 focus-visible:ring-inset focus-visible:ring-accent1',\n] as const;\n\nexport const dataListRowStyles = [\n ...dataListRowInteractiveStyles,\n ...dataListRowOuterStyles,\n ...dataListRowStateStyles,\n] as const;\n\nexport const dataListRowStaticStyles = ['grid grid-cols-subgrid gap-8 px-5', ...dataListRowOuterStyles] as const;\n\n/**\n * Row actions that stay out of the way until the row is hovered or focused.\n * Opacity, not display, so the column keeps its width and nothing shifts. A\n * coarse pointer never hovers, so there they stay visible — hidden controls\n * that still take taps would be worse than no reveal at all.\n */\nexport const dataListRowActionRevealStyles =\n 'opacity-0 pointer-coarse:opacity-100 group-focus-within/data-list-row:opacity-100 group-hover/data-list-row:opacity-100';\n\nexport type DataListSticky = 'start';\n\nexport const dataListStickyStartStyles = [\n 'data-list-sticky-start sticky left-0 z-10 isolate self-stretch overflow-visible',\n] as const;\n\n/** Tone for a single row. Exposed as `data-variant`; `error` tints the row. */\nexport type DataListRowVariant = 'default' | 'error';\n\n/**\n * Layout/state modifiers shared by interactive row primitives\n * (`DataList.RowButton`, `DataList.RowLink`).\n */\nexport type DataListRowSharedProps = {\n /** Row tone — exposed on the element as `data-variant`. */\n variant?: DataListRowVariant;\n /**\n * Place the row starting at this column line. Defaults to column 1. Use\n * when the row sits beside a leading cell that owns column 1.\n */\n colStart?: number;\n /**\n * Place the row ending at this column line (use negative values to count\n * from the end, e.g. `-2`). Defaults to `-1` (the last line). Use when the\n * row sits beside a trailing cell that owns the last column.\n */\n colEnd?: number;\n /**\n * Mark the row as featured (e.g. the row whose detail is open in a side\n * panel). Exposed on the element as `data-featured` and tints the row.\n */\n featured?: boolean;\n};\n\n/** Split a grid-template-columns string on top-level whitespace only, so `minmax(0, 10rem)` stays one track. */\nexport function splitColumns(columns: string): string[] {\n const parts: string[] = [];\n let depth = 0;\n let current = '';\n for (const char of columns) {\n if (char === '(') depth++;\n if (char === ')') depth--;\n if (/\\s/.test(char) && depth === 0) {\n if (current) parts.push(current);\n current = '';\n } else {\n current += char;\n }\n }\n if (current) parts.push(current);\n return parts;\n}\n","import { format, isToday } from 'date-fns';\nimport { Children, cloneElement, isValidElement } from 'react';\nimport type { ComponentPropsWithoutRef, ElementType, ReactNode } from 'react';\nimport { dataListRowActionRevealStyles, dataListStickyStartStyles } from './shared';\nimport type { DataListSticky } from './shared';\nimport { Checkbox } from '@/ds/components/Checkbox';\nimport { cn } from '@/lib/utils';\n\nexport type DataListCellProps = {\n children?: ReactNode;\n className?: string;\n /**\n * HTML element rendered for the cell. Defaults to `span`. Use `'label'` when\n * the cell wraps a labelable control (e.g. a Checkbox), so the whole cell\n * area acts as the click/hover target.\n */\n as?: ElementType;\n /**\n * Pins the cell to the horizontal start edge of the list while the list\n * scrolls sideways.\n */\n sticky?: DataListSticky;\n} & Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'className'>;\n\nexport function DataListCell({ children, className, as, sticky, ...rest }: DataListCellProps) {\n const Component = as || 'span';\n return (\n <Component\n className={cn(\n 'relative grid max-w-full min-w-0 items-center overflow-hidden text-ui-md whitespace-nowrap text-neutral3 empty:before:text-neutral2 empty:before:content-[\"—\"]',\n sticky === 'start' && dataListStickyStartStyles,\n className,\n )}\n {...rest}\n >\n {children}\n </Component>\n );\n}\n\n/**\n * Trailing cell for row actions, revealed on row hover or keyboard focus.\n * Sits beside a `DataList.RowButton` inside a `DataList.RowWrapper`.\n */\nexport function DataListActionsCell({ children, className, ...rest }: DataListCellProps) {\n return (\n <DataListCell className={className} {...rest}>\n <span\n className={cn(\n 'flex w-full items-center justify-end gap-1 pr-3 transition-opacity duration-200',\n dataListRowActionRevealStyles,\n )}\n >\n {children}\n </span>\n </DataListCell>\n );\n}\n\nconst dataListTruncateContentStyles =\n 'block min-w-0 max-w-full truncate empty:before:content-[\"—\"] empty:before:text-neutral2 [&>*]:min-w-0 [&>*]:max-w-full [&>*]:overflow-hidden [&>*]:text-ellipsis [&>*]:whitespace-nowrap';\nconst dataListInlineTextTruncateStyles = 'min-w-0 flex-1 truncate';\n\nfunction DataListInlineText({ children }: { children: string | number }) {\n return <span className={dataListInlineTextTruncateStyles}>{children}</span>;\n}\n\nfunction DataListTruncatedTextNodes({ children }: { children: ReactNode }) {\n return Children.map(children, child => {\n if (typeof child === 'string' || typeof child === 'number') {\n return <DataListInlineText>{child}</DataListInlineText>;\n }\n\n return child;\n });\n}\n\nfunction DataListTruncatedCellContent({ children }: { children: ReactNode }) {\n return Children.map(children, child => {\n if (!isValidElement<{ children?: ReactNode; className?: string }>(child) || typeof child.type !== 'string') {\n return child;\n }\n\n return cloneElement(child, {\n className: cn('max-w-full min-w-0 overflow-hidden', child.props.className),\n children: <DataListTruncatedTextNodes>{child.props.children}</DataListTruncatedTextNodes>,\n });\n });\n}\n\nexport type DataListTextCellProps = DataListCellProps & {\n /**\n * Typeface for the cell text. `mono` is for genuine code — paths, env values,\n * serialized JSON — and drops a size step to match the sans columns optically.\n */\n font?: 'sans' | 'mono';\n};\n\nexport function DataListTextCell({ children, className, font = 'sans', ...rest }: DataListTextCellProps) {\n return (\n <DataListCell className={cn(font === 'mono' && 'font-mono text-ui-smd', className)} {...rest}>\n <span className={dataListTruncateContentStyles}>\n <DataListTruncatedCellContent>{children}</DataListTruncatedCellContent>\n </span>\n </DataListCell>\n );\n}\n\nexport function DataListNameCell({ children, className }: DataListCellProps) {\n return (\n <DataListCell className={cn('text-left font-medium text-neutral4', className)}>\n <span className={dataListTruncateContentStyles}>\n <DataListTruncatedCellContent>{children}</DataListTruncatedCellContent>\n </span>\n </DataListCell>\n );\n}\n\nexport function DataListDescriptionCell({ children, className }: DataListCellProps) {\n return (\n <DataListCell className={cn('text-neutral2', className)}>\n <span className={dataListTruncateContentStyles}>\n <DataListTruncatedCellContent>{children}</DataListTruncatedCellContent>\n </span>\n </DataListCell>\n );\n}\n\nexport type DataListRowHeaderCellProps = Omit<DataListCellProps, 'sticky'>;\n\nexport function DataListRowHeaderCell({ children, className, ...rest }: DataListRowHeaderCellProps) {\n return (\n <DataListCell\n sticky=\"start\"\n className={cn(\n 'data-list-row-header -mr-4 -ml-5 w-auto max-w-none pr-4 pl-5 text-left text-ui-sm font-medium text-neutral2',\n className,\n )}\n {...rest}\n >\n <span className={cn(dataListTruncateContentStyles, 'relative z-10 w-full')}>\n <DataListTruncatedCellContent>{children}</DataListTruncatedCellContent>\n </span>\n </DataListCell>\n );\n}\n\nexport type DataListNumberCellProps = DataListCellProps & {\n /**\n * Emphasizes the value with a brighter tone and semibold weight — use for the\n * primary metric in a row (e.g. a total or headline number).\n */\n highlight?: boolean;\n};\n\n/**\n * Right-aligned numeric cell with tabular figures, for metric and summary\n * tables. Pass `highlight` for the emphasized column.\n */\nexport function DataListNumberCell({ children, className, highlight, ...rest }: DataListNumberCellProps) {\n return (\n <DataListCell\n className={cn(\n 'justify-items-end text-right text-ui-sm tabular-nums',\n highlight ? 'font-semibold text-neutral4' : 'text-neutral3',\n className,\n )}\n {...rest}\n >\n {children}\n </DataListCell>\n );\n}\n\nfunction getShortId(id: string | undefined): string {\n return id?.slice(0, 8) ?? '';\n}\n\nexport interface DataListIdCellProps {\n id: string;\n}\n\nexport function DataListIdCell({ id }: DataListIdCellProps) {\n return <DataListCell className=\"text-ui-smd text-neutral3 tracking-wide\">{getShortId(id)}</DataListCell>;\n}\n\nexport interface DataListSelectCellProps {\n checked: boolean;\n /**\n * Called when the checkbox is clicked. Receives the click event's `shiftKey`\n * so callers can implement range-select. The cell stops the click from\n * reaching the host row, so the row's `onClick` doesn't fire.\n */\n onToggle: (shiftKey: boolean) => void;\n /** Disable the checkbox, e.g. while a selection mutation is in flight. */\n disabled?: boolean;\n 'aria-label'?: string;\n}\n\nexport function DataListSelectCell({ checked, onToggle, disabled, ...rest }: DataListSelectCellProps) {\n return (\n <DataListCell\n as=\"label\"\n className={cn(\n 'size-8 justify-items-center self-center overflow-visible px-0',\n disabled ? 'cursor-not-allowed' : 'cursor-pointer',\n )}\n onClick={e => e.stopPropagation()}\n data-selected={checked || undefined}\n >\n <Checkbox\n checked={checked}\n disabled={disabled}\n onCheckedChange={() => {}} // no-op: selection handled by onClick to capture shiftKey\n // The click still has to bubble to the cell above, which is what keeps it\n // off the host row. Base UI withholds this handler while disabled.\n onClick={e => onToggle(e.shiftKey)}\n aria-label={rest['aria-label']}\n />\n </DataListCell>\n );\n}\n\nfunction toDate(value: Date | string): Date | null {\n const date = value instanceof Date ? value : new Date(value);\n return isNaN(date.getTime()) ? null : date;\n}\n\nexport interface DataListDateCellProps {\n timestamp: Date | string;\n}\n\n/** Compact date cell — `Today` or `MMM dd` (e.g. `May 19`). */\nexport function DataListDateCell({ timestamp }: DataListDateCellProps) {\n const date = toDate(timestamp);\n return (\n <DataListCell className=\"text-ui-smd text-neutral2\">\n {date ? (isToday(date) ? 'Today' : format(date, 'MMM dd')) : null}\n </DataListCell>\n );\n}\n\nexport interface DataListCreatedCellProps {\n timestamp: Date | string;\n}\n\n/** Combined date + time cell — `MMM dd h:mm:ss a` (e.g. `Aug 31 1:07:47 pm`), no milliseconds. */\nexport function DataListCreatedCell({ timestamp }: DataListCreatedCellProps) {\n const date = toDate(timestamp);\n return (\n <DataListCell className=\"text-ui-smd text-neutral3 tabular-nums\">\n {date ? format(date, 'MMM dd h:mm:ss aaa') : null}\n </DataListCell>\n );\n}\n\nexport interface DataListTimeCellProps {\n timestamp: Date | string;\n}\n\nexport function DataListTimeCell({ timestamp }: DataListTimeCellProps) {\n const date = toDate(timestamp);\n return (\n <DataListCell className=\"text-ui-smd text-neutral3 flex tabular-nums\">\n {date ? (\n <>\n {format(date, 'h:mm:ss')}\n <span className=\"text-neutral2\">\n .{String(date.getMilliseconds()).padStart(3, '0')} {format(date, 'aaa')}\n </span>\n </>\n ) : null}\n </DataListCell>\n );\n}\n","import { cn } from '@/lib/utils';\n\nexport type DataListNextPageLoadingProps = {\n isLoading?: boolean;\n hasMore?: boolean;\n setEndOfListElement?: (element: HTMLDivElement | null) => void;\n loadingText?: string;\n};\n\nexport function DataListNextPageLoading({\n isLoading,\n setEndOfListElement,\n hasMore,\n loadingText = 'Loading more data...',\n}: DataListNextPageLoadingProps) {\n if (!setEndOfListElement) {\n return null;\n }\n\n return (\n <div\n ref={setEndOfListElement}\n // Zero-height when idle so it adds no trailing space below the last row;\n // IntersectionObserver still fires for a zero-area target at the viewport edge.\n className={cn('col-span-full -mt-px flex justify-center text-ui-md text-neutral3 opacity-50', {\n 'py-4': isLoading,\n })}\n >\n {isLoading && loadingText}\n </div>\n );\n}\n","import type { ComponentPropsWithoutRef } from 'react';\nimport { cn } from '@/lib/utils';\n\nexport type DataListNoMatchProps = ComponentPropsWithoutRef<'div'> & {\n message?: string;\n};\n\nexport function DataListNoMatch({\n message = 'Nothing matches your search',\n className,\n ...props\n}: DataListNoMatchProps) {\n return (\n <div\n className={cn(\n 'col-span-full flex flex-col items-center justify-center gap-2 rounded-lg bg-surface2 py-12 text-neutral3',\n className,\n )}\n {...props}\n >\n <p className=\"text-ui-md\">{message}</p>\n </div>\n );\n}\n","import type { CSSProperties, ReactNode, RefObject } from 'react';\nimport { ScrollArea } from '@/ds/components/ScrollArea/scroll-area';\nimport type { ScrollAreaMask, ScrollAreaProps } from '@/ds/components/ScrollArea/scroll-area';\nimport { cn } from '@/lib/utils';\n\n/**\n * Horizontal sizing of the list grid.\n *\n * - `content`: the grid is as wide as its widest content (`w-max`) and the\n * ScrollArea scrolls horizontally when it exceeds the container.\n * - `container`: the grid fills the container width and never exceeds it;\n * flexible tracks (`minmax(0, 1fr)`) shrink so truncating cells ellipsize\n * instead of widening the table.\n */\nexport type DataListFit = 'content' | 'container';\n\n/**\n * Surface treatment of the list.\n *\n * - `default`: rows sit on a rounded `surface4` panel.\n * - `light`: no panel behind the rows; rows sit directly on the page.\n */\nexport type DataListVariant = 'default' | 'light';\n\nexport type DataListRootProps = Omit<ScrollAreaProps, 'children' | 'orientation' | 'mask' | 'viewportRef'> & {\n children: ReactNode;\n columns: string;\n /** Grid width behavior; defaults to `content` (existing horizontal-scroll sizing). */\n fit?: DataListFit;\n /** Surface treatment; defaults to `default` (rows on a `surface4` panel). */\n variant?: DataListVariant;\n /**\n * Edge fades from the underlying ScrollArea. DataList keeps the top fade off\n * by default so it does not fade the sticky top header.\n */\n mask?: ScrollAreaMask;\n /**\n * Ref to the scroll container — pass this to TanStack Virtual's\n * `getScrollElement` when virtualizing. Without it, the ScrollArea viewport\n * scrolls normally.\n */\n scrollRef?: RefObject<HTMLDivElement | null>;\n};\n\ntype DataListRootStyle = CSSProperties & {\n '--data-list-background'?: string;\n};\n\nfunction getDataListMask(mask: ScrollAreaMask | undefined): ScrollAreaMask {\n if (mask === undefined) return { top: false };\n if (typeof mask === 'object') return { top: false, ...mask };\n\n return mask;\n}\n\n/**\n * The root owns the unified table treatment so standalone and wrapped rows look\n * identical without requiring a per-row index. The ScrollArea provides the\n * fixed frame; this grid paints the sticky header and separators. The root is\n * the only element that defines a color: sticky parts read the background\n * through `--data-list-background` so they stay opaque while scrolling, and\n * rows/header draw no separators, borders or rings of their own.\n */\nconst dataListGridStyles = [\n 'gap-y-px',\n // Rows are siblings of the header, so first/last are found via sibling combinators.\n '[&_.data-list-row:not(.data-list-row~.data-list-row)]:rounded-t-lg',\n '[&_.data-list-row:not(:has(~.data-list-row))]:rounded-b-lg',\n '[&_.data-list-row:not(.data-list-row~.data-list-row)>.data-list-sticky-start]:rounded-tl-lg',\n '[&_.data-list-row:not(:has(~.data-list-row))>.data-list-sticky-start]:rounded-bl-lg',\n // Subheaders split the rows into sections; each section gets its own rounded ends.\n '[&_.data-list-subheader+.data-list-row]:rounded-t-lg',\n '[&_.data-list-row:has(+.data-list-subheader)]:rounded-b-lg',\n '[&_.data-list-subheader+.data-list-row>.data-list-sticky-start]:rounded-tl-lg',\n '[&_.data-list-row:has(+.data-list-subheader)>.data-list-sticky-start]:rounded-bl-lg',\n '[&_.data-list-top]:bg-(--data-list-background)',\n '[&_.data-list-row>.data-list-sticky-start]:bg-surface2',\n '[&_.data-list-row>.data-list-sticky-start]:after:right-0',\n '[&_.data-list-top>.data-list-sticky-start]:after:right-0',\n] as const;\n\nconst dataListVariantClasses: Record<DataListVariant, string> = {\n default: 'bg-surface4',\n light: '',\n};\n\n// The sticky header reads this so it stays opaque while scrolling: the panel\n// color by default, the page surface when there is no panel.\nconst dataListVariantBackground: Record<DataListVariant, string> = {\n default: 'var(--surface4)',\n light: 'var(--surface1)',\n};\n\nconst dataListFitClasses: Record<DataListFit, string> = {\n content: 'w-max max-w-none min-w-full',\n container: 'w-full max-w-full',\n};\n\nexport function DataListRoot({\n children,\n columns,\n className,\n fit = 'content',\n variant = 'default',\n mask,\n scrollRef,\n ...props\n}: DataListRootProps) {\n const gridStyle: DataListRootStyle = {\n '--data-list-background': dataListVariantBackground[variant],\n gridTemplateColumns: columns,\n };\n\n const grid = (\n <div\n // Lists scroll inside the ScrollArea viewport (below); the grid just lays out.\n className={cn('grid content-start', ...dataListGridStyles, dataListFitClasses[fit])}\n style={gridStyle}\n >\n {children}\n </div>\n );\n\n // DataList uses the DS ScrollArea: an overlay scrollbar, so the sticky header\n // spans the full width. Masks default to every overflowing edge except the\n // top — a top fade would fade the opaque sticky header. A virtualizing list\n // passes `scrollRef`, forwarded as `viewportRef` so it scrolls this viewport.\n return (\n <ScrollArea\n {...props}\n orientation=\"both\"\n mask={getDataListMask(mask)}\n viewportRef={scrollRef}\n // Outer radius = row radius (8px) + 4px inset so the corners stay concentric.\n // Size to content but never exceed the parent. Flex (unlike grid `1fr`) lays\n // items out against the max-height-clamped container, so short lists stay\n // compact and long ones shrink the viewport and scroll. `self-start` stops\n // a grid/flex parent from stretching the root to the full row height.\n viewPortClassName=\"min-h-0 flex-1 basis-auto\"\n className={cn(\n 'flex max-h-full w-full flex-col self-start rounded-xl px-1 pb-1',\n dataListVariantClasses[variant],\n className,\n )}\n >\n {grid}\n </ScrollArea>\n );\n}\n","import { createContext, useContext } from 'react';\n\nexport const DataListRowWrapperContext = createContext(false);\n\nexport function useDataListRowWrapperContext() {\n return useContext(DataListRowWrapperContext);\n}\n","import { forwardRef } from 'react';\nimport type { ComponentPropsWithoutRef } from 'react';\nimport { useDataListRowWrapperContext } from './data-list-row-wrapper-context';\nimport { dataListRowInteractiveStyles, dataListRowStyles } from './shared';\nimport type { DataListRowSharedProps } from './shared';\nimport { cn } from '@/lib/utils';\n\nexport type DataListRowButtonProps = ComponentPropsWithoutRef<'button'> & DataListRowSharedProps;\n\n/**\n * Forwarded ref + spread props so virtualizers (`useVirtualizer.measureElement`)\n * can attach a ref and `data-index` to each rendered row.\n */\nexport const DataListRowButton = forwardRef<HTMLButtonElement, DataListRowButtonProps>(\n ({ children, className, type = 'button', colStart, colEnd, featured, variant, style, ...rest }, ref) => {\n const isWrapped = useDataListRowWrapperContext();\n const hasColumnOverride = colStart !== undefined || colEnd !== undefined;\n const resolvedStyle = hasColumnOverride ? { ...style, gridColumn: `${colStart ?? 1} / ${colEnd ?? -1}` } : style;\n return (\n <button\n ref={ref}\n type={type}\n className={cn(...(isWrapped ? dataListRowInteractiveStyles : dataListRowStyles), 'text-left', className)}\n style={resolvedStyle}\n data-featured={featured || undefined}\n data-variant={variant ?? 'default'}\n {...rest}\n >\n {children}\n </button>\n );\n },\n);\n\nDataListRowButton.displayName = 'DataListRowButton';\n","import type { CSSProperties, ComponentPropsWithoutRef, ReactNode } from 'react';\nimport { useDataListRowWrapperContext } from './data-list-row-wrapper-context';\nimport { dataListRowInteractiveStyles, dataListRowStyles } from './shared';\nimport type { DataListRowSharedProps } from './shared';\nimport type { LinkComponent } from '@/ds/types/link-component';\nimport { cn } from '@/lib/utils';\n\nexport type DataListRowLinkProps = DataListRowSharedProps & {\n children: ReactNode;\n to: string;\n className?: string;\n style?: CSSProperties;\n LinkComponent?: LinkComponent;\n} & Omit<ComponentPropsWithoutRef<'a'>, 'href' | 'children' | 'className' | 'style'>;\n\nexport function DataListRowLink({\n children,\n to,\n className,\n style,\n LinkComponent: Link = 'a',\n colStart,\n colEnd,\n featured,\n variant,\n ...rest\n}: DataListRowLinkProps) {\n const isWrapped = useDataListRowWrapperContext();\n const hasColumnOverride = colStart !== undefined || colEnd !== undefined;\n const resolvedStyle = hasColumnOverride ? { ...style, gridColumn: `${colStart ?? 1} / ${colEnd ?? -1}` } : style;\n return (\n <Link\n href={to}\n className={cn(...(isWrapped ? dataListRowInteractiveStyles : dataListRowStyles), className)}\n style={resolvedStyle}\n data-featured={featured || undefined}\n data-variant={variant ?? 'default'}\n {...rest}\n >\n {children}\n </Link>\n );\n}\n","import { forwardRef } from 'react';\nimport type { ComponentPropsWithoutRef } from 'react';\nimport { DataListRowWrapperContext } from './data-list-row-wrapper-context';\nimport { dataListRowOuterStyles, dataListRowStateStyles } from './shared';\nimport { cn } from '@/lib/utils';\n\nexport type DataListRowWrapperProps = ComponentPropsWithoutRef<'div'>;\n\n/**\n * Non-interactive grid wrapper. Used to host a leading or trailing cell (e.g. a\n * selection checkbox or row actions) alongside a `DataList.RowButton` so\n * hover/focus/click only apply to the button portion. For standalone\n * interactive rows, use `DataList.RowButton` directly without this wrapper.\n *\n * Carries the `.data-list-row` marker so root-level row styling behaves the\n * same in wrapped and standalone rows.\n */\nexport const DataListRowWrapper = forwardRef<HTMLDivElement, DataListRowWrapperProps>(\n ({ children, className, ...rest }, ref) => {\n return (\n <DataListRowWrapperContext.Provider value>\n <div\n ref={ref}\n className={cn(\n 'grid grid-cols-subgrid gap-0',\n ...dataListRowOuterStyles,\n ...dataListRowStateStyles,\n className,\n )}\n {...rest}\n >\n {children}\n </div>\n </DataListRowWrapperContext.Provider>\n );\n },\n);\n\nDataListRowWrapper.displayName = 'DataListRowWrapper';\n","export type DataListSpacerProps = {\n /** Pixel height of the spacer. Pass 0 to render nothing. */\n height: number;\n};\n\n/**\n * Pads top/bottom of the visible window when virtualizing — preserves the\n * grid's total scroll height for the rows that aren't currently rendered.\n * Spans the full grid width so it doesn't disturb column layout.\n */\nexport function DataListSpacer({ height }: DataListSpacerProps) {\n if (height <= 0) return null;\n return <div className=\"col-span-full\" style={{ height }} />;\n}\n","import type { ComponentPropsWithoutRef } from 'react';\nimport { cn } from '@/lib/utils';\n\nexport type DataListTopProps = ComponentPropsWithoutRef<'div'> & {\n /**\n * Switch to a \"leading cell\" layout: drops the default gap between children\n * and the default left padding, so a leading cell (e.g. `TopSelectCell`)\n * sits flush against the grid edge and an inner `TopCells` group owns the\n * remaining column spacing. Mirrors how `Row` + `RowButton` compose.\n */\n hasLeadingCell?: boolean;\n};\n\nexport function DataListTop({ children, className, hasLeadingCell, ...props }: DataListTopProps) {\n return (\n <div\n className={cn(\n 'group/data-list-top data-list-top sticky top-0 z-20 col-span-full grid grid-cols-subgrid gap-8 px-5',\n hasLeadingCell && 'gap-0 pl-0!',\n className,\n )}\n {...props}\n >\n {children}\n </div>\n );\n}\n","import type { ComponentPropsWithoutRef, ElementType, ReactNode } from 'react';\nimport { forwardRef } from 'react';\nimport { dataListStickyStartStyles } from './shared';\nimport type { DataListSticky } from './shared';\nimport { Checkbox } from '@/ds/components/Checkbox';\nimport { Tooltip, TooltipTrigger, TooltipContent } from '@/ds/components/Tooltip';\nimport { cn } from '@/lib/utils';\n\nexport type DataListTopCellProps = {\n children: ReactNode;\n className?: string;\n /**\n * HTML element rendered for the top cell. Defaults to `span`. Use `'label'`\n * when the cell wraps a labelable control (e.g. a select-all Checkbox).\n */\n as?: ElementType;\n /** Pins the top cell to the horizontal start edge while the list scrolls sideways. */\n sticky?: DataListSticky;\n} & Omit<ComponentPropsWithoutRef<'div'>, 'children' | 'className' | 'ref'>;\n\nexport const DataListTopCell = forwardRef<HTMLSpanElement, DataListTopCellProps>(\n ({ children, className, as, sticky, ...rest }, ref) => {\n const Component = as || 'span';\n const isText = typeof children === 'string' || typeof children === 'number';\n return (\n <Component\n ref={ref}\n className={cn(\n 'flex h-10 max-w-full min-w-0 items-center overflow-hidden py-1 text-ui-sm font-medium whitespace-nowrap text-neutral2',\n sticky === 'start' && dataListStickyStartStyles,\n sticky === 'start' && '-mr-4 -ml-5 w-auto max-w-none pr-4 pl-5',\n sticky === 'start' && 'z-20',\n className,\n )}\n {...rest}\n >\n {/* Plain string/number titles truncate with an ellipsis; element children\n (icons, smart long/short labels, checkboxes) render as-is. */}\n {isText ? <span className=\"min-w-0 truncate\">{children}</span> : children}\n </Component>\n );\n },\n);\n\nexport type DataListTopCellWithTooltipProps = {\n children: ReactNode;\n tooltip: ReactNode;\n className?: string;\n};\n\nexport function DataListTopCellWithTooltip({ children, tooltip, className }: DataListTopCellWithTooltipProps) {\n return (\n <Tooltip>\n <TooltipTrigger>\n <DataListTopCell className={className}>{children}</DataListTopCell>\n </TooltipTrigger>\n <TooltipContent>{tooltip}</TooltipContent>\n </Tooltip>\n );\n}\n\nexport type DataListTopCellSmartProps = {\n long: ReactNode;\n short: ReactNode;\n tooltip?: string;\n breakpoint?: 'sm' | 'md' | 'lg' | 'xl' | '2xl';\n className?: string;\n};\n\nconst breakpointClasses: Record<'sm' | 'md' | 'lg' | 'xl' | '2xl', { show: string; hide: string }> = {\n sm: { show: 'hidden sm:inline-flex', hide: 'inline-flex sm:hidden' },\n md: { show: 'hidden md:inline-flex', hide: 'inline-flex md:hidden' },\n lg: { show: 'hidden lg:inline-flex', hide: 'inline-flex lg:hidden' },\n xl: { show: 'hidden xl:inline-flex', hide: 'inline-flex xl:hidden' },\n '2xl': { show: 'hidden 2xl:inline-flex', hide: 'inline-flex 2xl:hidden' },\n};\n\nexport function DataListTopCellSmart({\n long,\n short,\n tooltip,\n breakpoint = '2xl',\n className,\n}: DataListTopCellSmartProps) {\n const tooltipText = tooltip ?? (typeof long === 'string' ? long : undefined);\n const bp = breakpointClasses[breakpoint];\n\n const content = (\n <>\n <span className={cn('items-center gap-1', bp.show)}>{long}</span>\n <span className={cn('items-center gap-1', bp.hide)}>{short}</span>\n </>\n );\n\n if (tooltipText) {\n return (\n <DataListTopCellWithTooltip tooltip={tooltipText} className={cn('flex [&_svg]:size-[1.3em]', className)}>\n {content}\n </DataListTopCellWithTooltip>\n );\n }\n\n return <DataListTopCell className={cn('flex [&_svg]:size-[1.3em]', className)}>{content}</DataListTopCell>;\n}\n\nexport interface DataListTopSelectCellProps {\n /** Pass `'indeterminate'` when some — but not all — rows are selected. */\n checked: boolean | 'indeterminate';\n /** Toggles the global selection. Typically clears when fully selected, otherwise selects all. */\n onToggle: () => void;\n 'aria-label'?: string;\n}\n\nexport function DataListTopSelectCell({ checked, onToggle, ...rest }: DataListTopSelectCellProps) {\n return (\n <DataListTopCell\n as=\"label\"\n className=\"w-8 cursor-pointer justify-center overflow-visible px-0 py-0!\"\n onClick={e => e.stopPropagation()}\n >\n <Checkbox checked={checked} onCheckedChange={() => onToggle()} aria-label={rest['aria-label']} />\n </DataListTopCell>\n );\n}\n"],"names":["jsx","cn","Children","isValidElement","cloneElement","Checkbox","isToday","format","jsxs","Fragment","ScrollArea","createContext","useContext","forwardRef","tooltip","Tooltip","TooltipTrigger","TooltipContent"],"mappings":"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"}
|
|
@@ -5,9 +5,9 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
|
5
5
|
const jsxRuntime = require('react/jsx-runtime');
|
|
6
6
|
const reactVirtual = require('@tanstack/react-virtual');
|
|
7
7
|
const React = require('react');
|
|
8
|
-
const dataListSkeleton = require('../../../data-list-skeleton-
|
|
8
|
+
const dataListSkeleton = require('../../../data-list-skeleton-7eKxso9c.cjs');
|
|
9
9
|
const useDataListKeyboard = require('../../../use-data-list-keyboard-k5D-WlNX.cjs');
|
|
10
|
-
const logsDataList = require('../../../logs-data-list-
|
|
10
|
+
const logsDataList = require('../../../logs-data-list-BcPdFb2K.cjs');
|
|
11
11
|
|
|
12
12
|
const COLUMNS = "6rem 9rem 5rem 10rem minmax(8rem,1fr) minmax(8rem,1fr)";
|
|
13
13
|
const ROW_HEIGHT = 36;
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
2
2
|
import { useVirtualizer } from '@tanstack/react-virtual';
|
|
3
3
|
import { useRef, useEffect } from 'react';
|
|
4
|
-
import { D as DataListSkeleton } from '../../../data-list-skeleton-
|
|
4
|
+
import { D as DataListSkeleton } from '../../../data-list-skeleton-CbjuDDK_.js';
|
|
5
5
|
import { u as useDataListKeyboard } from '../../../use-data-list-keyboard-BzZmvqE_.js';
|
|
6
|
-
import { L as LogsDataList } from '../../../logs-data-list-
|
|
6
|
+
import { L as LogsDataList } from '../../../logs-data-list-D7NBF4iw.js';
|
|
7
7
|
|
|
8
8
|
const COLUMNS = "6rem 9rem 5rem 10rem minmax(8rem,1fr) minmax(8rem,1fr)";
|
|
9
9
|
const ROW_HEIGHT = 36;
|
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
|
4
4
|
|
|
5
5
|
const jsxRuntime = require('react/jsx-runtime');
|
|
6
6
|
const React = require('react');
|
|
7
|
-
const dataList = require('../../../data-list-
|
|
7
|
+
const dataList = require('../../../data-list-DWOT5t0J.cjs');
|
|
8
8
|
const metricsCard = require('../../../metrics-card-B8zgHlgB.cjs');
|
|
9
9
|
const tabsContent = require('../../../tabs-content-BxToGCDw.cjs');
|
|
10
10
|
const tabsRoot = require('../../../tabs-root-BNcLC-s6.cjs');
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
|
|
2
2
|
import { useState } from 'react';
|
|
3
|
-
import { D as DataList } from '../../../data-list-
|
|
3
|
+
import { D as DataList } from '../../../data-list-BiEEjaEy.js';
|
|
4
4
|
import { M as MetricsCard } from '../../../metrics-card-BKE1UzWh.js';
|
|
5
5
|
import { T as TabContent } from '../../../tabs-content-CLgmU6S_.js';
|
|
6
6
|
import { a as Tabs, T as TabList } from '../../../tabs-root-BnwVjJbD.js';
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
4
4
|
|
|
5
5
|
const jsxRuntime = require('react/jsx-runtime');
|
|
6
|
-
const dataList = require('../../../data-list-
|
|
6
|
+
const dataList = require('../../../data-list-DWOT5t0J.cjs');
|
|
7
7
|
const metricsCard = require('../../../metrics-card-B8zgHlgB.cjs');
|
|
8
8
|
const domains_metrics_components_metricsUtils = require('./metrics-utils.cjs.js');
|
|
9
9
|
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
|
|
2
|
-
import { D as DataList } from '../../../data-list-
|
|
2
|
+
import { D as DataList } from '../../../data-list-BiEEjaEy.js';
|
|
3
3
|
import { M as MetricsCard } from '../../../metrics-card-BKE1UzWh.js';
|
|
4
4
|
import { formatCost, METRICS_DATA_LIST_PROPS } from './metrics-utils.es.js';
|
|
5
5
|
|
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
|
|
|
4
4
|
|
|
5
5
|
const jsxRuntime = require('react/jsx-runtime');
|
|
6
6
|
const React = require('react');
|
|
7
|
-
const dataList = require('../../../data-list-
|
|
7
|
+
const dataList = require('../../../data-list-DWOT5t0J.cjs');
|
|
8
8
|
const metricsCard = require('../../../metrics-card-B8zgHlgB.cjs');
|
|
9
9
|
const metricsLineChart = require('../../../metrics-line-chart-j6C2H3K1.cjs');
|
|
10
10
|
const tabsContent = require('../../../tabs-content-BxToGCDw.cjs');
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { useMemo } from 'react';
|
|
3
|
-
import { D as DataList } from '../../../data-list-
|
|
3
|
+
import { D as DataList } from '../../../data-list-BiEEjaEy.js';
|
|
4
4
|
import { M as MetricsCard } from '../../../metrics-card-BKE1UzWh.js';
|
|
5
5
|
import { M as MetricsLineChart } from '../../../metrics-line-chart-DNCs_ZF3.js';
|
|
6
6
|
import { T as TabContent } from '../../../tabs-content-CLgmU6S_.js';
|
|
@@ -207,12 +207,8 @@ function SpanDataPanelContent({
|
|
|
207
207
|
/* @__PURE__ */ jsxRuntime.jsxs(tabsRoot.TabList, { variant: "pill-ghost", className: "px-0", children: [
|
|
208
208
|
/* @__PURE__ */ jsxRuntime.jsx(tabsTab.Tab, { value: "details", children: "Details" }),
|
|
209
209
|
/* @__PURE__ */ jsxRuntime.jsxs(tabsTab.Tab, { value: "feedback", children: [
|
|
210
|
-
"Feedback
|
|
211
|
-
feedbackTabBadge
|
|
212
|
-
"(",
|
|
213
|
-
feedbackTabBadge,
|
|
214
|
-
")"
|
|
215
|
-
] })
|
|
210
|
+
"Feedback",
|
|
211
|
+
feedbackTabBadge
|
|
216
212
|
] })
|
|
217
213
|
] }),
|
|
218
214
|
/* @__PURE__ */ jsxRuntime.jsx(tabsContent.TabContent, { value: "details", children: detailsBody }),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"span-data-panel-view.cjs.js","sources":["../../../../src/domains/traces/components/span-data-panel-view.tsx"],"sourcesContent":["import type { SpanRecord } from '@mastra/core/storage';\nimport { BracesIcon, FileInputIcon, FileOutputIcon } from 'lucide-react';\nimport type { ReactNode } from 'react';\nimport { getTokenLimitMessage, isTokenLimitExceeded } from '../utils/span-utils';\nimport { SpanSummaryDescription } from './span-summary-description';\nimport { SpanTokenUsage } from './span-token-usage';\nimport type { TokenUsage } from './span-token-usage';\nimport { ButtonsGroup } from '@/ds/components/ButtonsGroup';\nimport { DataKeysAndValues } from '@/ds/components/DataKeysAndValues';\nimport { DataPanel } from '@/ds/components/DataPanel';\nimport { Notice } from '@/ds/components/Notice';\nimport { Tab, TabContent, TabList, Tabs } from '@/ds/components/Tabs';\nimport { truncateString } from '@/lib/truncate-string';\n\nfunction buildDialogTitle(sectionTitle: string, icon: ReactNode, span: { spanId: string; traceId: string }) {\n return (\n <>\n <span className=\"text-neutral2 flex items-center gap-1.5 tracking-widest uppercase [&>svg]:size-3.5\">\n {icon}\n {sectionTitle}\n </span>\n <span>\n › Span <b className=\"text-neutral3\">#{span.spanId}</b>\n </span>\n <span>\n › Trace <b className=\"text-neutral3\">#{span.traceId}</b>\n </span>\n </>\n );\n}\n\nexport interface SpanDataPanelViewProps {\n traceId: string;\n spanId: string;\n /** Full span record. Caller fetches via useSpanDetail. */\n span: SpanRecord | undefined;\n isLoading?: boolean;\n onClose: () => void;\n onPrevious?: () => void;\n onNext?: () => void;\n activeTab?: string;\n onTabChange?: (tab: string) => void;\n /**\n * When provided, a \"Feedback\" tab appears; the slot receives the loaded span and renders\n * whatever feedback UI the consumer wants.\n */\n feedbackTabSlot?: (args: { span: SpanRecord; traceId: string; spanId: string }) => ReactNode;\n /** Optional count shown in the \"Feedback\" tab label. */\n feedbackTabBadge?: ReactNode;\n /**\n * Whether this span is the displayed root of the current view (trace root or\n * branch anchor). Controls visibility of trace-level metadata fields. Defaults\n * to `span.parentSpanId == null` (trace case) when omitted.\n */\n isAnchor?: boolean;\n /** Extra classes for the panel root (e.g. flattening the card when nested in the trace panel). */\n className?: string;\n}\n\nexport function SpanDataPanelView({\n traceId,\n spanId,\n span,\n isLoading,\n onClose,\n onPrevious,\n onNext,\n activeTab,\n onTabChange,\n feedbackTabSlot,\n feedbackTabBadge,\n isAnchor,\n className,\n}: SpanDataPanelViewProps) {\n return (\n <DataPanel className={className}>\n {/* Two-line header (heading + summary); neighbouring panel headers use min-h-16 to stay level. */}\n <DataPanel.Header className=\"min-h-16 py-2\">\n <div className=\"flex min-w-0 flex-1 flex-col gap-1\">\n <DataPanel.Heading className=\"whitespace-nowrap\">\n Span <b># {truncateString(spanId, 12)}</b>\n </DataPanel.Heading>\n {span && <SpanSummaryDescription span={span} />}\n </div>\n <ButtonsGroup className=\"ml-auto shrink-0 self-start\">\n <DataPanel.NextPrevNav\n onPrevious={onPrevious}\n onNext={onNext}\n previousLabel=\"Previous span\"\n nextLabel=\"Next span\"\n />\n <DataPanel.CloseButton onClick={onClose} />\n </ButtonsGroup>\n </DataPanel.Header>\n\n {isLoading ? (\n <DataPanel.LoadingData>Loading span details...</DataPanel.LoadingData>\n ) : !span ? (\n <DataPanel.NoData>Span not found.</DataPanel.NoData>\n ) : (\n <SpanDataPanelContent\n span={span}\n traceId={traceId}\n spanId={spanId}\n activeTab={activeTab}\n onTabChange={onTabChange}\n feedbackTabSlot={feedbackTabSlot}\n feedbackTabBadge={feedbackTabBadge}\n isAnchor={isAnchor}\n />\n )}\n </DataPanel>\n );\n}\n\nfunction SpanDataPanelContent({\n span,\n traceId,\n spanId,\n activeTab,\n onTabChange,\n feedbackTabSlot,\n feedbackTabBadge,\n isAnchor,\n}: {\n span: SpanRecord;\n traceId: string;\n spanId: string;\n activeTab?: string;\n onTabChange?: (tab: string) => void;\n feedbackTabSlot?: (args: { span: SpanRecord; traceId: string; spanId: string }) => ReactNode;\n feedbackTabBadge?: ReactNode;\n isAnchor?: boolean;\n}) {\n const usage = span.attributes?.usage as TokenUsage | undefined;\n\n const detailsBody = (\n <>\n {isTokenLimitExceeded(span) && (\n <div className=\"mb-3\">\n <Notice variant=\"warning\" title=\"Token Limit Exceeded\">\n <Notice.Message>{getTokenLimitMessage(span)}</Notice.Message>\n </Notice>\n </div>\n )}\n\n {usage && <SpanTokenUsage usage={usage} className=\"mb-3\" />}\n\n <DataKeysAndValues>\n {/* Anchor-only: rich trace-context fields. Live on the full SpanRecord, not on the\n * lightweight payload, so they only have values once the full span is loaded. */}\n {(isAnchor ?? span.parentSpanId == null) && (\n <>\n {span.tags && span.tags.length > 0 && (\n <>\n <DataKeysAndValues.Key>Tags</DataKeysAndValues.Key>\n <DataKeysAndValues.Value>{span.tags.join(', ')}</DataKeysAndValues.Value>\n </>\n )}\n {span.sessionId && (\n <>\n <DataKeysAndValues.Key>Session Id</DataKeysAndValues.Key>\n <DataKeysAndValues.ValueWithCopyBtn\n copyTooltip=\"Copy Session Id to clipboard\"\n copyValue={span.sessionId}\n >\n {span.sessionId}\n </DataKeysAndValues.ValueWithCopyBtn>\n </>\n )}\n {span.requestId && (\n <>\n <DataKeysAndValues.Key>Request Id</DataKeysAndValues.Key>\n <DataKeysAndValues.ValueWithCopyBtn\n copyTooltip=\"Copy Request Id to clipboard\"\n copyValue={span.requestId}\n >\n {span.requestId}\n </DataKeysAndValues.ValueWithCopyBtn>\n </>\n )}\n {span.userId && (\n <>\n <DataKeysAndValues.Key>User Id</DataKeysAndValues.Key>\n <DataKeysAndValues.ValueWithCopyBtn copyTooltip=\"Copy User Id to clipboard\" copyValue={span.userId}>\n {span.userId}\n </DataKeysAndValues.ValueWithCopyBtn>\n </>\n )}\n {span.organizationId && (\n <>\n <DataKeysAndValues.Key>Organization Id</DataKeysAndValues.Key>\n <DataKeysAndValues.ValueWithCopyBtn\n copyTooltip=\"Copy Organization Id to clipboard\"\n copyValue={span.organizationId}\n >\n {span.organizationId}\n </DataKeysAndValues.ValueWithCopyBtn>\n </>\n )}\n {span.experimentId && (\n <>\n <DataKeysAndValues.Key>Experiment Id</DataKeysAndValues.Key>\n <DataKeysAndValues.ValueWithCopyBtn\n copyTooltip=\"Copy Experiment Id to clipboard\"\n copyValue={span.experimentId}\n >\n {span.experimentId}\n </DataKeysAndValues.ValueWithCopyBtn>\n </>\n )}\n </>\n )}\n </DataKeysAndValues>\n\n <div className=\"mt-3 grid gap-3\">\n <DataPanel.CodeSection\n title=\"Input\"\n dialogTitle={buildDialogTitle('Input', <FileInputIcon />, { spanId, traceId })}\n icon={<FileInputIcon />}\n codeStr={JSON.stringify(span.input ?? null, null, 2)}\n />\n <DataPanel.CodeSection\n title=\"Output\"\n dialogTitle={buildDialogTitle('Output', <FileOutputIcon />, { spanId, traceId })}\n icon={<FileOutputIcon />}\n codeStr={JSON.stringify(span.output ?? null, null, 2)}\n />\n <DataPanel.CodeSection\n title=\"Metadata\"\n dialogTitle={buildDialogTitle('Metadata', <BracesIcon />, { spanId, traceId })}\n icon={<BracesIcon />}\n codeStr={JSON.stringify(span.metadata ?? null, null, 2)}\n />\n <DataPanel.CodeSection\n title=\"Attributes\"\n dialogTitle={buildDialogTitle('Attributes', <BracesIcon />, { spanId, traceId })}\n icon={<BracesIcon />}\n codeStr={JSON.stringify(span.attributes ?? null, null, 2)}\n />\n </div>\n </>\n );\n\n // No extra tab slots → render details directly without the Tabs/TabList wrapper.\n if (!feedbackTabSlot) {\n return <DataPanel.Content>{detailsBody}</DataPanel.Content>;\n }\n\n return (\n <DataPanel.Content>\n <Tabs defaultTab=\"details\" value={activeTab} onValueChange={onTabChange}>\n <TabList variant=\"pill-ghost\" className=\"px-0\">\n <Tab value=\"details\">Details</Tab>\n <Tab value=\"feedback\">Feedback {feedbackTabBadge != null && <>({feedbackTabBadge})</>}</Tab>\n </TabList>\n\n <TabContent value=\"details\">{detailsBody}</TabContent>\n <TabContent value=\"feedback\">{feedbackTabSlot({ span, traceId, spanId })}</TabContent>\n </Tabs>\n </DataPanel.Content>\n );\n}\n"],"names":["jsxs","Fragment","DataPanel","truncateString","jsx","SpanSummaryDescription","ButtonsGroup","isTokenLimitExceeded","Notice","SpanTokenUsage","DataKeysAndValues","FileInputIcon","FileOutputIcon","BracesIcon","Tabs","TabList","Tab","TabContent"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"span-data-panel-view.cjs.js","sources":["../../../../src/domains/traces/components/span-data-panel-view.tsx"],"sourcesContent":["import type { SpanRecord } from '@mastra/core/storage';\nimport { BracesIcon, FileInputIcon, FileOutputIcon } from 'lucide-react';\nimport type { ReactNode } from 'react';\nimport { getTokenLimitMessage, isTokenLimitExceeded } from '../utils/span-utils';\nimport { SpanSummaryDescription } from './span-summary-description';\nimport { SpanTokenUsage } from './span-token-usage';\nimport type { TokenUsage } from './span-token-usage';\nimport { ButtonsGroup } from '@/ds/components/ButtonsGroup';\nimport { DataKeysAndValues } from '@/ds/components/DataKeysAndValues';\nimport { DataPanel } from '@/ds/components/DataPanel';\nimport { Notice } from '@/ds/components/Notice';\nimport { Tab, TabContent, TabList, Tabs } from '@/ds/components/Tabs';\nimport { truncateString } from '@/lib/truncate-string';\n\nfunction buildDialogTitle(sectionTitle: string, icon: ReactNode, span: { spanId: string; traceId: string }) {\n return (\n <>\n <span className=\"text-neutral2 flex items-center gap-1.5 tracking-widest uppercase [&>svg]:size-3.5\">\n {icon}\n {sectionTitle}\n </span>\n <span>\n › Span <b className=\"text-neutral3\">#{span.spanId}</b>\n </span>\n <span>\n › Trace <b className=\"text-neutral3\">#{span.traceId}</b>\n </span>\n </>\n );\n}\n\nexport interface SpanDataPanelViewProps {\n traceId: string;\n spanId: string;\n /** Full span record. Caller fetches via useSpanDetail. */\n span: SpanRecord | undefined;\n isLoading?: boolean;\n onClose: () => void;\n onPrevious?: () => void;\n onNext?: () => void;\n activeTab?: string;\n onTabChange?: (tab: string) => void;\n /**\n * When provided, a \"Feedback\" tab appears; the slot receives the loaded span and renders\n * whatever feedback UI the consumer wants.\n */\n feedbackTabSlot?: (args: { span: SpanRecord; traceId: string; spanId: string }) => ReactNode;\n /** Optional indicator rendered after the \"Feedback\" tab label (e.g. a needs-review dot). */\n feedbackTabBadge?: ReactNode;\n /**\n * Whether this span is the displayed root of the current view (trace root or\n * branch anchor). Controls visibility of trace-level metadata fields. Defaults\n * to `span.parentSpanId == null` (trace case) when omitted.\n */\n isAnchor?: boolean;\n /** Extra classes for the panel root (e.g. flattening the card when nested in the trace panel). */\n className?: string;\n}\n\nexport function SpanDataPanelView({\n traceId,\n spanId,\n span,\n isLoading,\n onClose,\n onPrevious,\n onNext,\n activeTab,\n onTabChange,\n feedbackTabSlot,\n feedbackTabBadge,\n isAnchor,\n className,\n}: SpanDataPanelViewProps) {\n return (\n <DataPanel className={className}>\n {/* Two-line header (heading + summary); neighbouring panel headers use min-h-16 to stay level. */}\n <DataPanel.Header className=\"min-h-16 py-2\">\n <div className=\"flex min-w-0 flex-1 flex-col gap-1\">\n <DataPanel.Heading className=\"whitespace-nowrap\">\n Span <b># {truncateString(spanId, 12)}</b>\n </DataPanel.Heading>\n {span && <SpanSummaryDescription span={span} />}\n </div>\n <ButtonsGroup className=\"ml-auto shrink-0 self-start\">\n <DataPanel.NextPrevNav\n onPrevious={onPrevious}\n onNext={onNext}\n previousLabel=\"Previous span\"\n nextLabel=\"Next span\"\n />\n <DataPanel.CloseButton onClick={onClose} />\n </ButtonsGroup>\n </DataPanel.Header>\n\n {isLoading ? (\n <DataPanel.LoadingData>Loading span details...</DataPanel.LoadingData>\n ) : !span ? (\n <DataPanel.NoData>Span not found.</DataPanel.NoData>\n ) : (\n <SpanDataPanelContent\n span={span}\n traceId={traceId}\n spanId={spanId}\n activeTab={activeTab}\n onTabChange={onTabChange}\n feedbackTabSlot={feedbackTabSlot}\n feedbackTabBadge={feedbackTabBadge}\n isAnchor={isAnchor}\n />\n )}\n </DataPanel>\n );\n}\n\nfunction SpanDataPanelContent({\n span,\n traceId,\n spanId,\n activeTab,\n onTabChange,\n feedbackTabSlot,\n feedbackTabBadge,\n isAnchor,\n}: {\n span: SpanRecord;\n traceId: string;\n spanId: string;\n activeTab?: string;\n onTabChange?: (tab: string) => void;\n feedbackTabSlot?: (args: { span: SpanRecord; traceId: string; spanId: string }) => ReactNode;\n feedbackTabBadge?: ReactNode;\n isAnchor?: boolean;\n}) {\n const usage = span.attributes?.usage as TokenUsage | undefined;\n\n const detailsBody = (\n <>\n {isTokenLimitExceeded(span) && (\n <div className=\"mb-3\">\n <Notice variant=\"warning\" title=\"Token Limit Exceeded\">\n <Notice.Message>{getTokenLimitMessage(span)}</Notice.Message>\n </Notice>\n </div>\n )}\n\n {usage && <SpanTokenUsage usage={usage} className=\"mb-3\" />}\n\n <DataKeysAndValues>\n {/* Anchor-only: rich trace-context fields. Live on the full SpanRecord, not on the\n * lightweight payload, so they only have values once the full span is loaded. */}\n {(isAnchor ?? span.parentSpanId == null) && (\n <>\n {span.tags && span.tags.length > 0 && (\n <>\n <DataKeysAndValues.Key>Tags</DataKeysAndValues.Key>\n <DataKeysAndValues.Value>{span.tags.join(', ')}</DataKeysAndValues.Value>\n </>\n )}\n {span.sessionId && (\n <>\n <DataKeysAndValues.Key>Session Id</DataKeysAndValues.Key>\n <DataKeysAndValues.ValueWithCopyBtn\n copyTooltip=\"Copy Session Id to clipboard\"\n copyValue={span.sessionId}\n >\n {span.sessionId}\n </DataKeysAndValues.ValueWithCopyBtn>\n </>\n )}\n {span.requestId && (\n <>\n <DataKeysAndValues.Key>Request Id</DataKeysAndValues.Key>\n <DataKeysAndValues.ValueWithCopyBtn\n copyTooltip=\"Copy Request Id to clipboard\"\n copyValue={span.requestId}\n >\n {span.requestId}\n </DataKeysAndValues.ValueWithCopyBtn>\n </>\n )}\n {span.userId && (\n <>\n <DataKeysAndValues.Key>User Id</DataKeysAndValues.Key>\n <DataKeysAndValues.ValueWithCopyBtn copyTooltip=\"Copy User Id to clipboard\" copyValue={span.userId}>\n {span.userId}\n </DataKeysAndValues.ValueWithCopyBtn>\n </>\n )}\n {span.organizationId && (\n <>\n <DataKeysAndValues.Key>Organization Id</DataKeysAndValues.Key>\n <DataKeysAndValues.ValueWithCopyBtn\n copyTooltip=\"Copy Organization Id to clipboard\"\n copyValue={span.organizationId}\n >\n {span.organizationId}\n </DataKeysAndValues.ValueWithCopyBtn>\n </>\n )}\n {span.experimentId && (\n <>\n <DataKeysAndValues.Key>Experiment Id</DataKeysAndValues.Key>\n <DataKeysAndValues.ValueWithCopyBtn\n copyTooltip=\"Copy Experiment Id to clipboard\"\n copyValue={span.experimentId}\n >\n {span.experimentId}\n </DataKeysAndValues.ValueWithCopyBtn>\n </>\n )}\n </>\n )}\n </DataKeysAndValues>\n\n <div className=\"mt-3 grid gap-3\">\n <DataPanel.CodeSection\n title=\"Input\"\n dialogTitle={buildDialogTitle('Input', <FileInputIcon />, { spanId, traceId })}\n icon={<FileInputIcon />}\n codeStr={JSON.stringify(span.input ?? null, null, 2)}\n />\n <DataPanel.CodeSection\n title=\"Output\"\n dialogTitle={buildDialogTitle('Output', <FileOutputIcon />, { spanId, traceId })}\n icon={<FileOutputIcon />}\n codeStr={JSON.stringify(span.output ?? null, null, 2)}\n />\n <DataPanel.CodeSection\n title=\"Metadata\"\n dialogTitle={buildDialogTitle('Metadata', <BracesIcon />, { spanId, traceId })}\n icon={<BracesIcon />}\n codeStr={JSON.stringify(span.metadata ?? null, null, 2)}\n />\n <DataPanel.CodeSection\n title=\"Attributes\"\n dialogTitle={buildDialogTitle('Attributes', <BracesIcon />, { spanId, traceId })}\n icon={<BracesIcon />}\n codeStr={JSON.stringify(span.attributes ?? null, null, 2)}\n />\n </div>\n </>\n );\n\n // No extra tab slots → render details directly without the Tabs/TabList wrapper.\n if (!feedbackTabSlot) {\n return <DataPanel.Content>{detailsBody}</DataPanel.Content>;\n }\n\n return (\n <DataPanel.Content>\n <Tabs defaultTab=\"details\" value={activeTab} onValueChange={onTabChange}>\n <TabList variant=\"pill-ghost\" className=\"px-0\">\n <Tab value=\"details\">Details</Tab>\n <Tab value=\"feedback\">Feedback{feedbackTabBadge}</Tab>\n </TabList>\n\n <TabContent value=\"details\">{detailsBody}</TabContent>\n <TabContent value=\"feedback\">{feedbackTabSlot({ span, traceId, spanId })}</TabContent>\n </Tabs>\n </DataPanel.Content>\n );\n}\n"],"names":["jsxs","Fragment","DataPanel","truncateString","jsx","SpanSummaryDescription","ButtonsGroup","isTokenLimitExceeded","Notice","SpanTokenUsage","DataKeysAndValues","FileInputIcon","FileOutputIcon","BracesIcon","Tabs","TabList","Tab","TabContent"],"mappings":"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"}
|
|
@@ -203,12 +203,8 @@ function SpanDataPanelContent({
|
|
|
203
203
|
/* @__PURE__ */ jsxs(TabList, { variant: "pill-ghost", className: "px-0", children: [
|
|
204
204
|
/* @__PURE__ */ jsx(Tab, { value: "details", children: "Details" }),
|
|
205
205
|
/* @__PURE__ */ jsxs(Tab, { value: "feedback", children: [
|
|
206
|
-
"Feedback
|
|
207
|
-
feedbackTabBadge
|
|
208
|
-
"(",
|
|
209
|
-
feedbackTabBadge,
|
|
210
|
-
")"
|
|
211
|
-
] })
|
|
206
|
+
"Feedback",
|
|
207
|
+
feedbackTabBadge
|
|
212
208
|
] })
|
|
213
209
|
] }),
|
|
214
210
|
/* @__PURE__ */ jsx(TabContent, { value: "details", children: detailsBody }),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"span-data-panel-view.es.js","sources":["../../../../src/domains/traces/components/span-data-panel-view.tsx"],"sourcesContent":["import type { SpanRecord } from '@mastra/core/storage';\nimport { BracesIcon, FileInputIcon, FileOutputIcon } from 'lucide-react';\nimport type { ReactNode } from 'react';\nimport { getTokenLimitMessage, isTokenLimitExceeded } from '../utils/span-utils';\nimport { SpanSummaryDescription } from './span-summary-description';\nimport { SpanTokenUsage } from './span-token-usage';\nimport type { TokenUsage } from './span-token-usage';\nimport { ButtonsGroup } from '@/ds/components/ButtonsGroup';\nimport { DataKeysAndValues } from '@/ds/components/DataKeysAndValues';\nimport { DataPanel } from '@/ds/components/DataPanel';\nimport { Notice } from '@/ds/components/Notice';\nimport { Tab, TabContent, TabList, Tabs } from '@/ds/components/Tabs';\nimport { truncateString } from '@/lib/truncate-string';\n\nfunction buildDialogTitle(sectionTitle: string, icon: ReactNode, span: { spanId: string; traceId: string }) {\n return (\n <>\n <span className=\"text-neutral2 flex items-center gap-1.5 tracking-widest uppercase [&>svg]:size-3.5\">\n {icon}\n {sectionTitle}\n </span>\n <span>\n › Span <b className=\"text-neutral3\">#{span.spanId}</b>\n </span>\n <span>\n › Trace <b className=\"text-neutral3\">#{span.traceId}</b>\n </span>\n </>\n );\n}\n\nexport interface SpanDataPanelViewProps {\n traceId: string;\n spanId: string;\n /** Full span record. Caller fetches via useSpanDetail. */\n span: SpanRecord | undefined;\n isLoading?: boolean;\n onClose: () => void;\n onPrevious?: () => void;\n onNext?: () => void;\n activeTab?: string;\n onTabChange?: (tab: string) => void;\n /**\n * When provided, a \"Feedback\" tab appears; the slot receives the loaded span and renders\n * whatever feedback UI the consumer wants.\n */\n feedbackTabSlot?: (args: { span: SpanRecord; traceId: string; spanId: string }) => ReactNode;\n /** Optional count shown in the \"Feedback\" tab label. */\n feedbackTabBadge?: ReactNode;\n /**\n * Whether this span is the displayed root of the current view (trace root or\n * branch anchor). Controls visibility of trace-level metadata fields. Defaults\n * to `span.parentSpanId == null` (trace case) when omitted.\n */\n isAnchor?: boolean;\n /** Extra classes for the panel root (e.g. flattening the card when nested in the trace panel). */\n className?: string;\n}\n\nexport function SpanDataPanelView({\n traceId,\n spanId,\n span,\n isLoading,\n onClose,\n onPrevious,\n onNext,\n activeTab,\n onTabChange,\n feedbackTabSlot,\n feedbackTabBadge,\n isAnchor,\n className,\n}: SpanDataPanelViewProps) {\n return (\n <DataPanel className={className}>\n {/* Two-line header (heading + summary); neighbouring panel headers use min-h-16 to stay level. */}\n <DataPanel.Header className=\"min-h-16 py-2\">\n <div className=\"flex min-w-0 flex-1 flex-col gap-1\">\n <DataPanel.Heading className=\"whitespace-nowrap\">\n Span <b># {truncateString(spanId, 12)}</b>\n </DataPanel.Heading>\n {span && <SpanSummaryDescription span={span} />}\n </div>\n <ButtonsGroup className=\"ml-auto shrink-0 self-start\">\n <DataPanel.NextPrevNav\n onPrevious={onPrevious}\n onNext={onNext}\n previousLabel=\"Previous span\"\n nextLabel=\"Next span\"\n />\n <DataPanel.CloseButton onClick={onClose} />\n </ButtonsGroup>\n </DataPanel.Header>\n\n {isLoading ? (\n <DataPanel.LoadingData>Loading span details...</DataPanel.LoadingData>\n ) : !span ? (\n <DataPanel.NoData>Span not found.</DataPanel.NoData>\n ) : (\n <SpanDataPanelContent\n span={span}\n traceId={traceId}\n spanId={spanId}\n activeTab={activeTab}\n onTabChange={onTabChange}\n feedbackTabSlot={feedbackTabSlot}\n feedbackTabBadge={feedbackTabBadge}\n isAnchor={isAnchor}\n />\n )}\n </DataPanel>\n );\n}\n\nfunction SpanDataPanelContent({\n span,\n traceId,\n spanId,\n activeTab,\n onTabChange,\n feedbackTabSlot,\n feedbackTabBadge,\n isAnchor,\n}: {\n span: SpanRecord;\n traceId: string;\n spanId: string;\n activeTab?: string;\n onTabChange?: (tab: string) => void;\n feedbackTabSlot?: (args: { span: SpanRecord; traceId: string; spanId: string }) => ReactNode;\n feedbackTabBadge?: ReactNode;\n isAnchor?: boolean;\n}) {\n const usage = span.attributes?.usage as TokenUsage | undefined;\n\n const detailsBody = (\n <>\n {isTokenLimitExceeded(span) && (\n <div className=\"mb-3\">\n <Notice variant=\"warning\" title=\"Token Limit Exceeded\">\n <Notice.Message>{getTokenLimitMessage(span)}</Notice.Message>\n </Notice>\n </div>\n )}\n\n {usage && <SpanTokenUsage usage={usage} className=\"mb-3\" />}\n\n <DataKeysAndValues>\n {/* Anchor-only: rich trace-context fields. Live on the full SpanRecord, not on the\n * lightweight payload, so they only have values once the full span is loaded. */}\n {(isAnchor ?? span.parentSpanId == null) && (\n <>\n {span.tags && span.tags.length > 0 && (\n <>\n <DataKeysAndValues.Key>Tags</DataKeysAndValues.Key>\n <DataKeysAndValues.Value>{span.tags.join(', ')}</DataKeysAndValues.Value>\n </>\n )}\n {span.sessionId && (\n <>\n <DataKeysAndValues.Key>Session Id</DataKeysAndValues.Key>\n <DataKeysAndValues.ValueWithCopyBtn\n copyTooltip=\"Copy Session Id to clipboard\"\n copyValue={span.sessionId}\n >\n {span.sessionId}\n </DataKeysAndValues.ValueWithCopyBtn>\n </>\n )}\n {span.requestId && (\n <>\n <DataKeysAndValues.Key>Request Id</DataKeysAndValues.Key>\n <DataKeysAndValues.ValueWithCopyBtn\n copyTooltip=\"Copy Request Id to clipboard\"\n copyValue={span.requestId}\n >\n {span.requestId}\n </DataKeysAndValues.ValueWithCopyBtn>\n </>\n )}\n {span.userId && (\n <>\n <DataKeysAndValues.Key>User Id</DataKeysAndValues.Key>\n <DataKeysAndValues.ValueWithCopyBtn copyTooltip=\"Copy User Id to clipboard\" copyValue={span.userId}>\n {span.userId}\n </DataKeysAndValues.ValueWithCopyBtn>\n </>\n )}\n {span.organizationId && (\n <>\n <DataKeysAndValues.Key>Organization Id</DataKeysAndValues.Key>\n <DataKeysAndValues.ValueWithCopyBtn\n copyTooltip=\"Copy Organization Id to clipboard\"\n copyValue={span.organizationId}\n >\n {span.organizationId}\n </DataKeysAndValues.ValueWithCopyBtn>\n </>\n )}\n {span.experimentId && (\n <>\n <DataKeysAndValues.Key>Experiment Id</DataKeysAndValues.Key>\n <DataKeysAndValues.ValueWithCopyBtn\n copyTooltip=\"Copy Experiment Id to clipboard\"\n copyValue={span.experimentId}\n >\n {span.experimentId}\n </DataKeysAndValues.ValueWithCopyBtn>\n </>\n )}\n </>\n )}\n </DataKeysAndValues>\n\n <div className=\"mt-3 grid gap-3\">\n <DataPanel.CodeSection\n title=\"Input\"\n dialogTitle={buildDialogTitle('Input', <FileInputIcon />, { spanId, traceId })}\n icon={<FileInputIcon />}\n codeStr={JSON.stringify(span.input ?? null, null, 2)}\n />\n <DataPanel.CodeSection\n title=\"Output\"\n dialogTitle={buildDialogTitle('Output', <FileOutputIcon />, { spanId, traceId })}\n icon={<FileOutputIcon />}\n codeStr={JSON.stringify(span.output ?? null, null, 2)}\n />\n <DataPanel.CodeSection\n title=\"Metadata\"\n dialogTitle={buildDialogTitle('Metadata', <BracesIcon />, { spanId, traceId })}\n icon={<BracesIcon />}\n codeStr={JSON.stringify(span.metadata ?? null, null, 2)}\n />\n <DataPanel.CodeSection\n title=\"Attributes\"\n dialogTitle={buildDialogTitle('Attributes', <BracesIcon />, { spanId, traceId })}\n icon={<BracesIcon />}\n codeStr={JSON.stringify(span.attributes ?? null, null, 2)}\n />\n </div>\n </>\n );\n\n // No extra tab slots → render details directly without the Tabs/TabList wrapper.\n if (!feedbackTabSlot) {\n return <DataPanel.Content>{detailsBody}</DataPanel.Content>;\n }\n\n return (\n <DataPanel.Content>\n <Tabs defaultTab=\"details\" value={activeTab} onValueChange={onTabChange}>\n <TabList variant=\"pill-ghost\" className=\"px-0\">\n <Tab value=\"details\">Details</Tab>\n <Tab value=\"feedback\">Feedback {feedbackTabBadge != null && <>({feedbackTabBadge})</>}</Tab>\n </TabList>\n\n <TabContent value=\"details\">{detailsBody}</TabContent>\n <TabContent value=\"feedback\">{feedbackTabSlot({ span, traceId, spanId })}</TabContent>\n </Tabs>\n </DataPanel.Content>\n );\n}\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"span-data-panel-view.es.js","sources":["../../../../src/domains/traces/components/span-data-panel-view.tsx"],"sourcesContent":["import type { SpanRecord } from '@mastra/core/storage';\nimport { BracesIcon, FileInputIcon, FileOutputIcon } from 'lucide-react';\nimport type { ReactNode } from 'react';\nimport { getTokenLimitMessage, isTokenLimitExceeded } from '../utils/span-utils';\nimport { SpanSummaryDescription } from './span-summary-description';\nimport { SpanTokenUsage } from './span-token-usage';\nimport type { TokenUsage } from './span-token-usage';\nimport { ButtonsGroup } from '@/ds/components/ButtonsGroup';\nimport { DataKeysAndValues } from '@/ds/components/DataKeysAndValues';\nimport { DataPanel } from '@/ds/components/DataPanel';\nimport { Notice } from '@/ds/components/Notice';\nimport { Tab, TabContent, TabList, Tabs } from '@/ds/components/Tabs';\nimport { truncateString } from '@/lib/truncate-string';\n\nfunction buildDialogTitle(sectionTitle: string, icon: ReactNode, span: { spanId: string; traceId: string }) {\n return (\n <>\n <span className=\"text-neutral2 flex items-center gap-1.5 tracking-widest uppercase [&>svg]:size-3.5\">\n {icon}\n {sectionTitle}\n </span>\n <span>\n › Span <b className=\"text-neutral3\">#{span.spanId}</b>\n </span>\n <span>\n › Trace <b className=\"text-neutral3\">#{span.traceId}</b>\n </span>\n </>\n );\n}\n\nexport interface SpanDataPanelViewProps {\n traceId: string;\n spanId: string;\n /** Full span record. Caller fetches via useSpanDetail. */\n span: SpanRecord | undefined;\n isLoading?: boolean;\n onClose: () => void;\n onPrevious?: () => void;\n onNext?: () => void;\n activeTab?: string;\n onTabChange?: (tab: string) => void;\n /**\n * When provided, a \"Feedback\" tab appears; the slot receives the loaded span and renders\n * whatever feedback UI the consumer wants.\n */\n feedbackTabSlot?: (args: { span: SpanRecord; traceId: string; spanId: string }) => ReactNode;\n /** Optional indicator rendered after the \"Feedback\" tab label (e.g. a needs-review dot). */\n feedbackTabBadge?: ReactNode;\n /**\n * Whether this span is the displayed root of the current view (trace root or\n * branch anchor). Controls visibility of trace-level metadata fields. Defaults\n * to `span.parentSpanId == null` (trace case) when omitted.\n */\n isAnchor?: boolean;\n /** Extra classes for the panel root (e.g. flattening the card when nested in the trace panel). */\n className?: string;\n}\n\nexport function SpanDataPanelView({\n traceId,\n spanId,\n span,\n isLoading,\n onClose,\n onPrevious,\n onNext,\n activeTab,\n onTabChange,\n feedbackTabSlot,\n feedbackTabBadge,\n isAnchor,\n className,\n}: SpanDataPanelViewProps) {\n return (\n <DataPanel className={className}>\n {/* Two-line header (heading + summary); neighbouring panel headers use min-h-16 to stay level. */}\n <DataPanel.Header className=\"min-h-16 py-2\">\n <div className=\"flex min-w-0 flex-1 flex-col gap-1\">\n <DataPanel.Heading className=\"whitespace-nowrap\">\n Span <b># {truncateString(spanId, 12)}</b>\n </DataPanel.Heading>\n {span && <SpanSummaryDescription span={span} />}\n </div>\n <ButtonsGroup className=\"ml-auto shrink-0 self-start\">\n <DataPanel.NextPrevNav\n onPrevious={onPrevious}\n onNext={onNext}\n previousLabel=\"Previous span\"\n nextLabel=\"Next span\"\n />\n <DataPanel.CloseButton onClick={onClose} />\n </ButtonsGroup>\n </DataPanel.Header>\n\n {isLoading ? (\n <DataPanel.LoadingData>Loading span details...</DataPanel.LoadingData>\n ) : !span ? (\n <DataPanel.NoData>Span not found.</DataPanel.NoData>\n ) : (\n <SpanDataPanelContent\n span={span}\n traceId={traceId}\n spanId={spanId}\n activeTab={activeTab}\n onTabChange={onTabChange}\n feedbackTabSlot={feedbackTabSlot}\n feedbackTabBadge={feedbackTabBadge}\n isAnchor={isAnchor}\n />\n )}\n </DataPanel>\n );\n}\n\nfunction SpanDataPanelContent({\n span,\n traceId,\n spanId,\n activeTab,\n onTabChange,\n feedbackTabSlot,\n feedbackTabBadge,\n isAnchor,\n}: {\n span: SpanRecord;\n traceId: string;\n spanId: string;\n activeTab?: string;\n onTabChange?: (tab: string) => void;\n feedbackTabSlot?: (args: { span: SpanRecord; traceId: string; spanId: string }) => ReactNode;\n feedbackTabBadge?: ReactNode;\n isAnchor?: boolean;\n}) {\n const usage = span.attributes?.usage as TokenUsage | undefined;\n\n const detailsBody = (\n <>\n {isTokenLimitExceeded(span) && (\n <div className=\"mb-3\">\n <Notice variant=\"warning\" title=\"Token Limit Exceeded\">\n <Notice.Message>{getTokenLimitMessage(span)}</Notice.Message>\n </Notice>\n </div>\n )}\n\n {usage && <SpanTokenUsage usage={usage} className=\"mb-3\" />}\n\n <DataKeysAndValues>\n {/* Anchor-only: rich trace-context fields. Live on the full SpanRecord, not on the\n * lightweight payload, so they only have values once the full span is loaded. */}\n {(isAnchor ?? span.parentSpanId == null) && (\n <>\n {span.tags && span.tags.length > 0 && (\n <>\n <DataKeysAndValues.Key>Tags</DataKeysAndValues.Key>\n <DataKeysAndValues.Value>{span.tags.join(', ')}</DataKeysAndValues.Value>\n </>\n )}\n {span.sessionId && (\n <>\n <DataKeysAndValues.Key>Session Id</DataKeysAndValues.Key>\n <DataKeysAndValues.ValueWithCopyBtn\n copyTooltip=\"Copy Session Id to clipboard\"\n copyValue={span.sessionId}\n >\n {span.sessionId}\n </DataKeysAndValues.ValueWithCopyBtn>\n </>\n )}\n {span.requestId && (\n <>\n <DataKeysAndValues.Key>Request Id</DataKeysAndValues.Key>\n <DataKeysAndValues.ValueWithCopyBtn\n copyTooltip=\"Copy Request Id to clipboard\"\n copyValue={span.requestId}\n >\n {span.requestId}\n </DataKeysAndValues.ValueWithCopyBtn>\n </>\n )}\n {span.userId && (\n <>\n <DataKeysAndValues.Key>User Id</DataKeysAndValues.Key>\n <DataKeysAndValues.ValueWithCopyBtn copyTooltip=\"Copy User Id to clipboard\" copyValue={span.userId}>\n {span.userId}\n </DataKeysAndValues.ValueWithCopyBtn>\n </>\n )}\n {span.organizationId && (\n <>\n <DataKeysAndValues.Key>Organization Id</DataKeysAndValues.Key>\n <DataKeysAndValues.ValueWithCopyBtn\n copyTooltip=\"Copy Organization Id to clipboard\"\n copyValue={span.organizationId}\n >\n {span.organizationId}\n </DataKeysAndValues.ValueWithCopyBtn>\n </>\n )}\n {span.experimentId && (\n <>\n <DataKeysAndValues.Key>Experiment Id</DataKeysAndValues.Key>\n <DataKeysAndValues.ValueWithCopyBtn\n copyTooltip=\"Copy Experiment Id to clipboard\"\n copyValue={span.experimentId}\n >\n {span.experimentId}\n </DataKeysAndValues.ValueWithCopyBtn>\n </>\n )}\n </>\n )}\n </DataKeysAndValues>\n\n <div className=\"mt-3 grid gap-3\">\n <DataPanel.CodeSection\n title=\"Input\"\n dialogTitle={buildDialogTitle('Input', <FileInputIcon />, { spanId, traceId })}\n icon={<FileInputIcon />}\n codeStr={JSON.stringify(span.input ?? null, null, 2)}\n />\n <DataPanel.CodeSection\n title=\"Output\"\n dialogTitle={buildDialogTitle('Output', <FileOutputIcon />, { spanId, traceId })}\n icon={<FileOutputIcon />}\n codeStr={JSON.stringify(span.output ?? null, null, 2)}\n />\n <DataPanel.CodeSection\n title=\"Metadata\"\n dialogTitle={buildDialogTitle('Metadata', <BracesIcon />, { spanId, traceId })}\n icon={<BracesIcon />}\n codeStr={JSON.stringify(span.metadata ?? null, null, 2)}\n />\n <DataPanel.CodeSection\n title=\"Attributes\"\n dialogTitle={buildDialogTitle('Attributes', <BracesIcon />, { spanId, traceId })}\n icon={<BracesIcon />}\n codeStr={JSON.stringify(span.attributes ?? null, null, 2)}\n />\n </div>\n </>\n );\n\n // No extra tab slots → render details directly without the Tabs/TabList wrapper.\n if (!feedbackTabSlot) {\n return <DataPanel.Content>{detailsBody}</DataPanel.Content>;\n }\n\n return (\n <DataPanel.Content>\n <Tabs defaultTab=\"details\" value={activeTab} onValueChange={onTabChange}>\n <TabList variant=\"pill-ghost\" className=\"px-0\">\n <Tab value=\"details\">Details</Tab>\n <Tab value=\"feedback\">Feedback{feedbackTabBadge}</Tab>\n </TabList>\n\n <TabContent value=\"details\">{detailsBody}</TabContent>\n <TabContent value=\"feedback\">{feedbackTabSlot({ span, traceId, spanId })}</TabContent>\n </Tabs>\n </DataPanel.Content>\n );\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;AAcA,SAAS,gBAAA,CAAiB,YAAA,EAAsB,IAAA,EAAiB,IAAA,EAA2C;AAC1G,EAAA,uBACE,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,MAAA,EAAA,EAAK,WAAU,oFAAA,EACb,QAAA,EAAA;AAAA,MAAA,IAAA;AAAA,MACA;AAAA,KAAA,EACH,CAAA;AAAA,yBACC,MAAA,EAAA,EAAK,QAAA,EAAA;AAAA,MAAA,SAAA;AAAA,sBACG,IAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,eAAA,EAAgB,QAAA,EAAA;AAAA,QAAA,GAAA;AAAA,QAAE,IAAA,CAAK;AAAA,OAAA,EAAO;AAAA,KAAA,EACpD,CAAA;AAAA,yBACC,MAAA,EAAA,EAAK,QAAA,EAAA;AAAA,MAAA,UAAA;AAAA,sBACI,IAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,eAAA,EAAgB,QAAA,EAAA;AAAA,QAAA,GAAA;AAAA,QAAE,IAAA,CAAK;AAAA,OAAA,EAAQ;AAAA,KAAA,EACtD;AAAA,GAAA,EACF,CAAA;AAEJ;AA8BO,SAAS,iBAAA,CAAkB;AAAA,EAChC,OAAA;AAAA,EACA,MAAA;AAAA,EACA,IAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA;AAAA,EACA,UAAA;AAAA,EACA,MAAA;AAAA,EACA,SAAA;AAAA,EACA,WAAA;AAAA,EACA,eAAA;AAAA,EACA,gBAAA;AAAA,EACA,QAAA;AAAA,EACA;AACF,CAAA,EAA2B;AACzB,EAAA,uBACE,IAAA,CAAC,aAAU,SAAA,EAET,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,SAAA,CAAU,MAAA,EAAV,EAAiB,SAAA,EAAU,eAAA,EAC1B,QAAA,EAAA;AAAA,sBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,oCAAA,EACb,QAAA,EAAA;AAAA,wBAAA,IAAA,CAAC,SAAA,CAAU,OAAA,EAAV,EAAkB,SAAA,EAAU,mBAAA,EAAoB,QAAA,EAAA;AAAA,UAAA,OAAA;AAAA,+BACzC,GAAA,EAAA,EAAE,QAAA,EAAA;AAAA,YAAA,IAAA;AAAA,YAAG,cAAA,CAAe,QAAQ,EAAE;AAAA,WAAA,EAAE;AAAA,SAAA,EACxC,CAAA;AAAA,QACC,IAAA,oBAAQ,GAAA,CAAC,sBAAA,EAAA,EAAuB,IAAA,EAAY;AAAA,OAAA,EAC/C,CAAA;AAAA,sBACA,IAAA,CAAC,YAAA,EAAA,EAAa,SAAA,EAAU,6BAAA,EACtB,QAAA,EAAA;AAAA,wBAAA,GAAA;AAAA,UAAC,SAAA,CAAU,WAAA;AAAA,UAAV;AAAA,YACC,UAAA;AAAA,YACA,MAAA;AAAA,YACA,aAAA,EAAc,eAAA;AAAA,YACd,SAAA,EAAU;AAAA;AAAA,SACZ;AAAA,wBACA,GAAA,CAAC,SAAA,CAAU,WAAA,EAAV,EAAsB,SAAS,OAAA,EAAS;AAAA,OAAA,EAC3C;AAAA,KAAA,EACF,CAAA;AAAA,IAEC,SAAA,mBACC,GAAA,CAAC,SAAA,CAAU,WAAA,EAAV,EAAsB,QAAA,EAAA,yBAAA,EAAuB,CAAA,GAC5C,CAAC,IAAA,mBACH,GAAA,CAAC,SAAA,CAAU,MAAA,EAAV,EAAiB,6BAAe,CAAA,mBAEjC,GAAA;AAAA,MAAC,oBAAA;AAAA,MAAA;AAAA,QACC,IAAA;AAAA,QACA,OAAA;AAAA,QACA,MAAA;AAAA,QACA,SAAA;AAAA,QACA,WAAA;AAAA,QACA,eAAA;AAAA,QACA,gBAAA;AAAA,QACA;AAAA;AAAA;AACF,GAAA,EAEJ,CAAA;AAEJ;AAEA,SAAS,oBAAA,CAAqB;AAAA,EAC5B,IAAA;AAAA,EACA,OAAA;AAAA,EACA,MAAA;AAAA,EACA,SAAA;AAAA,EACA,WAAA;AAAA,EACA,eAAA;AAAA,EACA,gBAAA;AAAA,EACA;AACF,CAAA,EASG;AACD,EAAA,MAAM,KAAA,GAAQ,KAAK,UAAA,EAAY,KAAA;AAE/B,EAAA,MAAM,8BACJ,IAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,IAAA,oBAAA,CAAqB,IAAI,qBACxB,GAAA,CAAC,KAAA,EAAA,EAAI,WAAU,MAAA,EACb,QAAA,kBAAA,GAAA,CAAC,UAAO,OAAA,EAAQ,SAAA,EAAU,OAAM,sBAAA,EAC9B,QAAA,kBAAA,GAAA,CAAC,OAAO,OAAA,EAAP,EAAgB,+BAAqB,IAAI,CAAA,EAAE,GAC9C,CAAA,EACF,CAAA;AAAA,IAGD,KAAA,oBAAS,GAAA,CAAC,cAAA,EAAA,EAAe,KAAA,EAAc,WAAU,MAAA,EAAO,CAAA;AAAA,wBAExD,iBAAA,EAAA,EAGG,QAAA,EAAA,CAAA,QAAA,IAAY,IAAA,CAAK,YAAA,IAAgB,yBACjC,IAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,MAAA,IAAA,CAAK,IAAA,IAAQ,IAAA,CAAK,IAAA,CAAK,MAAA,GAAS,qBAC/B,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,iBAAA,CAAkB,GAAA,EAAlB,EAAsB,QAAA,EAAA,MAAA,EAAI,CAAA;AAAA,wBAC3B,GAAA,CAAC,kBAAkB,KAAA,EAAlB,EAAyB,eAAK,IAAA,CAAK,IAAA,CAAK,IAAI,CAAA,EAAE;AAAA,OAAA,EACjD,CAAA;AAAA,MAED,IAAA,CAAK,6BACJ,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,iBAAA,CAAkB,GAAA,EAAlB,EAAsB,QAAA,EAAA,YAAA,EAAU,CAAA;AAAA,wBACjC,GAAA;AAAA,UAAC,iBAAA,CAAkB,gBAAA;AAAA,UAAlB;AAAA,YACC,WAAA,EAAY,8BAAA;AAAA,YACZ,WAAW,IAAA,CAAK,SAAA;AAAA,YAEf,QAAA,EAAA,IAAA,CAAK;AAAA;AAAA;AACR,OAAA,EACF,CAAA;AAAA,MAED,IAAA,CAAK,6BACJ,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,iBAAA,CAAkB,GAAA,EAAlB,EAAsB,QAAA,EAAA,YAAA,EAAU,CAAA;AAAA,wBACjC,GAAA;AAAA,UAAC,iBAAA,CAAkB,gBAAA;AAAA,UAAlB;AAAA,YACC,WAAA,EAAY,8BAAA;AAAA,YACZ,WAAW,IAAA,CAAK,SAAA;AAAA,YAEf,QAAA,EAAA,IAAA,CAAK;AAAA;AAAA;AACR,OAAA,EACF,CAAA;AAAA,MAED,IAAA,CAAK,0BACJ,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,iBAAA,CAAkB,GAAA,EAAlB,EAAsB,QAAA,EAAA,SAAA,EAAO,CAAA;AAAA,wBAC9B,GAAA,CAAC,iBAAA,CAAkB,gBAAA,EAAlB,EAAmC,WAAA,EAAY,6BAA4B,SAAA,EAAW,IAAA,CAAK,MAAA,EACzF,QAAA,EAAA,IAAA,CAAK,MAAA,EACR;AAAA,OAAA,EACF,CAAA;AAAA,MAED,IAAA,CAAK,kCACJ,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,iBAAA,CAAkB,GAAA,EAAlB,EAAsB,QAAA,EAAA,iBAAA,EAAe,CAAA;AAAA,wBACtC,GAAA;AAAA,UAAC,iBAAA,CAAkB,gBAAA;AAAA,UAAlB;AAAA,YACC,WAAA,EAAY,mCAAA;AAAA,YACZ,WAAW,IAAA,CAAK,cAAA;AAAA,YAEf,QAAA,EAAA,IAAA,CAAK;AAAA;AAAA;AACR,OAAA,EACF,CAAA;AAAA,MAED,IAAA,CAAK,gCACJ,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,iBAAA,CAAkB,GAAA,EAAlB,EAAsB,QAAA,EAAA,eAAA,EAAa,CAAA;AAAA,wBACpC,GAAA;AAAA,UAAC,iBAAA,CAAkB,gBAAA;AAAA,UAAlB;AAAA,YACC,WAAA,EAAY,iCAAA;AAAA,YACZ,WAAW,IAAA,CAAK,YAAA;AAAA,YAEf,QAAA,EAAA,IAAA,CAAK;AAAA;AAAA;AACR,OAAA,EACF;AAAA,KAAA,EAEJ,CAAA,EAEJ,CAAA;AAAA,oBAEA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,iBAAA,EACb,QAAA,EAAA;AAAA,sBAAA,GAAA;AAAA,QAAC,SAAA,CAAU,WAAA;AAAA,QAAV;AAAA,UACC,KAAA,EAAM,OAAA;AAAA,UACN,WAAA,EAAa,iBAAiB,OAAA,kBAAS,GAAA,CAAC,iBAAc,CAAA,EAAI,EAAE,MAAA,EAAQ,OAAA,EAAS,CAAA;AAAA,UAC7E,IAAA,sBAAO,aAAA,EAAA,EAAc,CAAA;AAAA,UACrB,SAAS,IAAA,CAAK,SAAA,CAAU,KAAK,KAAA,IAAS,IAAA,EAAM,MAAM,CAAC;AAAA;AAAA,OACrD;AAAA,sBACA,GAAA;AAAA,QAAC,SAAA,CAAU,WAAA;AAAA,QAAV;AAAA,UACC,KAAA,EAAM,QAAA;AAAA,UACN,WAAA,EAAa,iBAAiB,QAAA,kBAAU,GAAA,CAAC,kBAAe,CAAA,EAAI,EAAE,MAAA,EAAQ,OAAA,EAAS,CAAA;AAAA,UAC/E,IAAA,sBAAO,cAAA,EAAA,EAAe,CAAA;AAAA,UACtB,SAAS,IAAA,CAAK,SAAA,CAAU,KAAK,MAAA,IAAU,IAAA,EAAM,MAAM,CAAC;AAAA;AAAA,OACtD;AAAA,sBACA,GAAA;AAAA,QAAC,SAAA,CAAU,WAAA;AAAA,QAAV;AAAA,UACC,KAAA,EAAM,UAAA;AAAA,UACN,WAAA,EAAa,iBAAiB,UAAA,kBAAY,GAAA,CAAC,cAAW,CAAA,EAAI,EAAE,MAAA,EAAQ,OAAA,EAAS,CAAA;AAAA,UAC7E,IAAA,sBAAO,UAAA,EAAA,EAAW,CAAA;AAAA,UAClB,SAAS,IAAA,CAAK,SAAA,CAAU,KAAK,QAAA,IAAY,IAAA,EAAM,MAAM,CAAC;AAAA;AAAA,OACxD;AAAA,sBACA,GAAA;AAAA,QAAC,SAAA,CAAU,WAAA;AAAA,QAAV;AAAA,UACC,KAAA,EAAM,YAAA;AAAA,UACN,WAAA,EAAa,iBAAiB,YAAA,kBAAc,GAAA,CAAC,cAAW,CAAA,EAAI,EAAE,MAAA,EAAQ,OAAA,EAAS,CAAA;AAAA,UAC/E,IAAA,sBAAO,UAAA,EAAA,EAAW,CAAA;AAAA,UAClB,SAAS,IAAA,CAAK,SAAA,CAAU,KAAK,UAAA,IAAc,IAAA,EAAM,MAAM,CAAC;AAAA;AAAA;AAC1D,KAAA,EACF;AAAA,GAAA,EACF,CAAA;AAIF,EAAA,IAAI,CAAC,eAAA,EAAiB;AACpB,IAAA,uBAAO,GAAA,CAAC,SAAA,CAAU,OAAA,EAAV,EAAmB,QAAA,EAAA,WAAA,EAAY,CAAA;AAAA,EACzC;AAEA,EAAA,uBACE,GAAA,CAAC,SAAA,CAAU,OAAA,EAAV,EACC,QAAA,kBAAA,IAAA,CAAC,IAAA,EAAA,EAAK,UAAA,EAAW,SAAA,EAAU,KAAA,EAAO,SAAA,EAAW,aAAA,EAAe,WAAA,EAC1D,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,OAAA,EAAA,EAAQ,OAAA,EAAQ,YAAA,EAAa,SAAA,EAAU,MAAA,EACtC,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,GAAA,EAAA,EAAI,KAAA,EAAM,SAAA,EAAU,QAAA,EAAA,SAAA,EAAO,CAAA;AAAA,sBAC5B,IAAA,CAAC,GAAA,EAAA,EAAI,KAAA,EAAM,UAAA,EAAW,QAAA,EAAA;AAAA,QAAA,UAAA;AAAA,QAAS;AAAA,OAAA,EAAiB;AAAA,KAAA,EAClD,CAAA;AAAA,oBAEA,GAAA,CAAC,UAAA,EAAA,EAAW,KAAA,EAAM,SAAA,EAAW,QAAA,EAAA,WAAA,EAAY,CAAA;AAAA,oBACzC,GAAA,CAAC,UAAA,EAAA,EAAW,KAAA,EAAM,UAAA,EAAY,QAAA,EAAA,eAAA,CAAgB,EAAE,IAAA,EAAM,OAAA,EAAS,MAAA,EAAQ,CAAA,EAAE;AAAA,GAAA,EAC3E,CAAA,EACF,CAAA;AAEJ;;;;"}
|
|
@@ -229,11 +229,7 @@ function TraceDataPanelView({
|
|
|
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",
|
|
232
|
-
feedbackTabBadge
|
|
233
|
-
" (",
|
|
234
|
-
feedbackTabBadge,
|
|
235
|
-
")"
|
|
236
|
-
] })
|
|
232
|
+
feedbackTabBadge
|
|
237
233
|
] }),
|
|
238
234
|
scoresTabSlot && /* @__PURE__ */ jsxRuntime.jsxs(tabsTab.Tab, { value: "scores", children: [
|
|
239
235
|
"Scores",
|
|
@@ -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 {/* 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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"}
|
|
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 indicator rendered after the \"Feedback\" tab label (e.g. a needs-review dot). */\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 && <Tab value=\"feedback\">Feedback{feedbackTabBadge}</Tab>}\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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"}
|
|
@@ -225,11 +225,7 @@ function TraceDataPanelView({
|
|
|
225
225
|
/* @__PURE__ */ jsx(Tab, { value: "details", children: "Spans" }),
|
|
226
226
|
feedbackTabSlot && /* @__PURE__ */ jsxs(Tab, { value: "feedback", children: [
|
|
227
227
|
"Feedback",
|
|
228
|
-
feedbackTabBadge
|
|
229
|
-
" (",
|
|
230
|
-
feedbackTabBadge,
|
|
231
|
-
")"
|
|
232
|
-
] })
|
|
228
|
+
feedbackTabBadge
|
|
233
229
|
] }),
|
|
234
230
|
scoresTabSlot && /* @__PURE__ */ jsxs(Tab, { value: "scores", children: [
|
|
235
231
|
"Scores",
|