npm - @mastra/playground-ui - Versions diffs - 55.0.0 → 56.0.0-alpha.5 - Mend

@mastra/playground-ui 55.0.0 → 56.0.0-alpha.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1617) hide show

package/dist/domains/traces/components/span-data-panel-view.es.js.map CHANGED Viewed

	@@ -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 { TraceIdButton } from './trace-id-button';\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';\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=\"items-center whitespace-nowrap\">\n Span\n <TraceIdButton id={spanId} />\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\">\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":"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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 { describeSpanInput, describeSpanOutput } from '@mastra/core/observability';\nimport { BracesIcon, FileInputIcon, FileOutputIcon } from 'lucide-react';\nimport type { ReactNode } from 'react';\nimport type { SpanRecord } from '../types';\nimport { getTokenLimitMessage, isTokenLimitExceeded } from '../utils/span-utils';\nimport { SpanErrorRenderer, SpanInputRenderer, SpanOutputRenderer, SpanPayloadSection } from './span-payload';\nimport { asCoreSpan } from './span-payload/span-payload-registry';\nimport { SpanSummaryDescription } from './span-summary-description';\nimport { SpanTokenUsage } from './span-token-usage';\nimport type { TokenUsage } from './span-token-usage';\nimport { TraceIdButton } from './trace-id-button';\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 { cn } from '@/lib/utils';\n\nconst BODY_CLASS = 'min-h-0 flex-1 overflow-y-auto px-3 pt-1 pb-3';\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 // Not a DataPanel: this is the span column rendered inside `TraceDataPanelView`,\n // which already provides the panel chrome.\n return (\n <section className={cn('flex min-h-0 flex-1 flex-col overflow-hidden', className)}>\n <DataPanel.Header>\n <DataPanel.HeaderContent>\n <DataPanel.Heading>\n Span\n <TraceIdButton id={spanId} />\n </DataPanel.Heading>\n {span && <SpanSummaryDescription span={span} />}\n </DataPanel.HeaderContent>\n <DataPanel.HeaderActions>\n <DataPanel.NextPrevNav\n onPrevious={onPrevious}\n onNext={onNext}\n previousLabel=\"Previous span\"\n nextLabel=\"Next span\"\n />\n <DataPanel.CloseButton onClick={onClose} />\n </DataPanel.HeaderActions>\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 </section>\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 const hasContext =\n (isAnchor ?? span.parentSpanId == null) &&\n Boolean(\n span.tags?.length \|\| span.sessionId \|\| span.requestId \|\| span.userId \|\| span.organizationId \|\| span.experimentId,\n );\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 <SpanPayloadSection title=\"Error\" raw={span.error} className=\"mb-3\">\n <SpanErrorRenderer span={span} />\n </SpanPayloadSection>\n\n {usage && <SpanTokenUsage usage={usage} className=\"mb-3\" />}\n\n {hasContext && (\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\n <div className={cn('grid gap-4', hasContext && 'mt-4')}>\n <SpanPayloadSection\n title=\"Input\"\n icon={<FileInputIcon />}\n raw={span.input}\n hasPreview={describeSpanInput(asCoreSpan(span))?.type !== 'json'}\n >\n <SpanInputRenderer span={span} />\n </SpanPayloadSection>\n <SpanPayloadSection\n title=\"Output\"\n icon={<FileOutputIcon />}\n raw={span.output}\n hasPreview={describeSpanOutput(asCoreSpan(span))?.type !== 'json'}\n >\n <SpanOutputRenderer span={span} />\n </SpanPayloadSection>\n <SpanPayloadSection title=\"Metadata\" icon={<BracesIcon />} raw={span.metadata} hasPreview={false}>\n {null}\n </SpanPayloadSection>\n <SpanPayloadSection title=\"Attributes\" icon={<BracesIcon />} raw={span.attributes} hasPreview={false}>\n {null}\n </SpanPayloadSection>\n </div>\n </>\n );\n\n // No extra tab slots → render details directly without the Tabs/TabList wrapper.\n if (!feedbackTabSlot) {\n return <div className={BODY_CLASS}>{detailsBody}</div>;\n }\n\n return (\n <div className={BODY_CLASS}>\n <Tabs defaultTab=\"details\" value={activeTab} onValueChange={onTabChange}>\n <TabList variant=\"pill-ghost\">\n <Tab value=\"details\">Details</Tab>\n <Tab value=\"feedback\">Feedback{feedbackTabBadge}</Tab>\n </TabList>\n\n <TabContent value=\"details\" className=\"pt-1\">\n {detailsBody}\n </TabContent>\n <TabContent value=\"feedback\">{feedbackTabSlot({ span, traceId, spanId })}</TabContent>\n </Tabs>\n </div>\n );\n}\n"],"names":[],"mappings":"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"}

package/dist/domains/traces/components/span-details-view.cjs.js CHANGED Viewed

@@ -3,7 +3,17 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 const jsxRuntime = require('react/jsx-runtime');
+const observability = require('@mastra/core/observability');
 const lucideReact = require('lucide-react');
+const domains_traces_components_spanPayload_spanInputRenderers = require('./span-payload/span-input-renderers.cjs.js');
+const domains_traces_components_spanPayload_spanOutputRenderers = require('./span-payload/span-output-renderers.cjs.js');
+const domains_traces_components_spanPayload_spanErrorRenderer = require('./span-payload/span-error-renderer.cjs.js');
+const domains_traces_components_spanPayload_spanPayloadSection = require('./span-payload/span-payload-section.cjs.js');
+require('../../../code-DhrdtZce.cjs');
+require('react');
+require('../../../Button-B1TWWXCy.cjs');
+require('../../chat/context/chat-context.cjs.js');
+const domains_traces_components_spanPayload_spanPayloadRegistry = require('./span-payload/span-payload-registry.cjs.js');
 const domains_traces_components_spanSummaryDescription = require('./span-summary-description.cjs.js');
 const domains_traces_components_traceIdButton = require('./trace-id-button.cjs.js');
 const components_DataDetailsPanel = require('../../../components/DataDetailsPanel.cjs.js');
@@ -29,36 +39,49 @@ function SpanDetailsView({ spanId, span, isLoading, onClose }) {
         ] }),
         /* @__PURE__ */ jsxRuntime.jsx("br", {})
       ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(domains_traces_components_spanPayload_spanPayloadSection.SpanPayloadSection, { title: "Error", raw: span.error, layout: "details", className: "mb-3", children: /* @__PURE__ */ jsxRuntime.jsx(domains_traces_components_spanPayload_spanErrorRenderer.SpanErrorRenderer, { span }) }),
       /* @__PURE__ */ jsxRuntime.jsx(
-        components_DataDetailsPanel.DataDetailsPanel.CodeSection,
+        domains_traces_components_spanPayload_spanPayloadSection.SpanPayloadSection,
         {
           title: "Input",
           icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.FileInputIcon, {}),
-          codeStr: JSON.stringify(span.input ?? null, null, 2)
+          raw: span.input,
+          hasPreview: observability.describeSpanInput(domains_traces_components_spanPayload_spanPayloadRegistry.asCoreSpan(span))?.type !== "json",
+          layout: "details",
+          children: /* @__PURE__ */ jsxRuntime.jsx(domains_traces_components_spanPayload_spanInputRenderers.SpanInputRenderer, { span })
         }
       ),
       /* @__PURE__ */ jsxRuntime.jsx(
-        components_DataDetailsPanel.DataDetailsPanel.CodeSection,
+        domains_traces_components_spanPayload_spanPayloadSection.SpanPayloadSection,
         {
           title: "Output",
           icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.FileOutputIcon, {}),
-          codeStr: JSON.stringify(span.output ?? null, null, 2)
+          raw: span.output,
+          hasPreview: observability.describeSpanOutput(domains_traces_components_spanPayload_spanPayloadRegistry.asCoreSpan(span))?.type !== "json",
+          layout: "details",
+          children: /* @__PURE__ */ jsxRuntime.jsx(domains_traces_components_spanPayload_spanOutputRenderers.SpanOutputRenderer, { span })
         }
       ),
       /* @__PURE__ */ jsxRuntime.jsx(
-        components_DataDetailsPanel.DataDetailsPanel.CodeSection,
+        domains_traces_components_spanPayload_spanPayloadSection.SpanPayloadSection,
         {
           title: "Metadata",
           icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.BracesIcon, {}),
-          codeStr: JSON.stringify(span.metadata ?? null, null, 2)
+          raw: span.metadata,
+          hasPreview: false,
+          layout: "details",
+          children: null
         }
       ),
       /* @__PURE__ */ jsxRuntime.jsx(
-        components_DataDetailsPanel.DataDetailsPanel.CodeSection,
+        domains_traces_components_spanPayload_spanPayloadSection.SpanPayloadSection,
         {
           title: "Attributes",
           icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.BracesIcon, {}),
-          codeStr: JSON.stringify(span.attributes ?? null, null, 2)
+          raw: span.attributes,
+          hasPreview: false,
+          layout: "details",
+          children: null
         }
       )
     ] })

package/dist/domains/traces/components/span-details-view.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"span-details-view.cjs.js","sources":["../../../../src/domains/traces/components/span-details-view.tsx"],"sourcesContent":["import ~~type~~ { ~~SpanRecord~~ } from '@mastra/core/~~storage~~';\nimport { BracesIcon, FileInputIcon, FileOutputIcon } from 'lucide-react';\nimport { SpanSummaryDescription } from './span-summary-description';\nimport { TraceIdButton } from './trace-id-button';\nimport { DataDetailsPanel } from '@/ds/components/DataDetailsPanel';\n\nconst KV = DataDetailsPanel.KeyValueList;\n\nexport interface SpanDetailsViewProps {\n spanId: string;\n /** Full span record. Caller fetches via useSpanDetail. /\n span: SpanRecord \| undefined;\n isLoading?: boolean;\n onClose: () => void;\n}\n\n/\n Compact span panel using `DataDetailsPanel` (popover-style). Shows basic span metadata +\n * input/output/metadata/attributes code sections. Use this for inline span inspection; for the\n * full-width span view with scoring tab + prev/next nav, use `SpanDataPanelView`.\n */\nexport function SpanDetailsView({ spanId, span, isLoading, onClose }: SpanDetailsViewProps) {\n return (\n <DataDetailsPanel>\n <DataDetailsPanel.Header>\n <div className=\"flex min-w-0 flex-1 flex-col gap-1\">\n <DataDetailsPanel.Heading className=\"items-center\">\n Span\n <TraceIdButton id={spanId} />\n </DataDetailsPanel.Heading>\n {span && <SpanSummaryDescription span={span} />}\n </div>\n <DataDetailsPanel.CloseButton onClick={onClose} />\n </DataDetailsPanel.Header>\n\n {isLoading ? (\n <DataDetailsPanel.LoadingData>Loading span...</DataDetailsPanel.LoadingData>\n ) : !span ? (\n <DataDetailsPanel.NoData>Span not found.</DataDetailsPanel.NoData>\n ) : (\n <DataDetailsPanel.Content>\n {span.spanType && (\n <>\n <KV>\n <KV.Key>Type</KV.Key>\n <KV.Value>{span.spanType}</KV.Value>\n </KV>\n <br />\n </>\n )}\n\n <~~DataDetailsPanel~~.~~CodeSection~~\n title=\"Input\"\n icon={<FileInputIcon />}\n ~~codeStr~~={~~JSON~~.~~stringify~~(span~~.input~~ ?? ~~null, null, 2)~~}\n />\n <~~DataDetailsPanel.CodeSection~~\n title=\"Output\"\n icon={<FileOutputIcon />}\n ~~codeStr~~={~~JSON~~.~~stringify~~(span~~.output~~ ?? ~~null, null, 2)~~}\n />\n <~~DataDetailsPanel.CodeSection~~\n title=\"Metadata\"\n icon={<BracesIcon />}\n ~~codeStr~~={~~JSON.stringify(~~span.metadata ?? null~~, null, 2)~~}\n ~~/>\~~n <~~DataDetailsPanel.CodeSection~~\n title=\"Attributes\"\n icon={<BracesIcon />}\n ~~codeStr~~={~~JSON.stringify(~~span.attributes ?? null~~, null, 2)~~}\n ~~/>\~~n </DataDetailsPanel.Content>\n )}\n </DataDetailsPanel>\n );\n}\n"],"names":["DataDetailsPanel","jsxs","jsx","TraceIdButton","SpanSummaryDescription","Fragment","FileInputIcon","FileOutputIcon","BracesIcon"],"mappings":"~~;;;;;;;;;;AAMA~~,MAAM,KAAKA,4CAAA,CAAiB,YAAA;AAerB,SAAS,gBAAgB,EAAE,MAAA,EAAQ,IAAA,EAAM,SAAA,EAAW,SAAQ,EAAyB;AAC1F,EAAA,uCACGA,4CAAA,EAAA,EACC,QAAA,EAAA;AAAA,oBAAAC,eAAA,CAACD,4CAAA,CAAiB,QAAjB,EACC,QAAA,EAAA;AAAA,sBAAAC,eAAA,CAAC,KAAA,EAAA,EAAI,WAAU,oCAAA,EACb,QAAA,EAAA;AAAA,wBAAAA,eAAA,CAACD,4CAAA,CAAiB,OAAA,EAAjB,EAAyB,SAAA,EAAU,cAAA,EAAe,QAAA,EAAA;AAAA,UAAA,MAAA;AAAA,0BAEjDE,cAAA,CAACC,qDAAA,EAAA,EAAc,EAAA,EAAI,MAAA,EAAQ;AAAA,SAAA,EAC7B,CAAA;AAAA,QACC,IAAA,oBAAQD,cAAA,CAACE,uEAAA,EAAA,EAAuB,IAAA,EAAY;AAAA,OAAA,EAC/C,CAAA;AAAA,sBACAF,cAAA,CAACF,4CAAA,CAAiB,WAAA,EAAjB,EAA6B,SAAS,OAAA,EAAS;AAAA,KAAA,EAClD,CAAA;AAAA,IAEC,4BACCE,cAAA,CAACF,4CAAA,CAAiB,aAAjB,EAA6B,QAAA,EAAA,iBAAA,EAAe,IAC3C,CAAC,IAAA,mBACHE,cAAA,CAACF,4CAAA,CAAiB,QAAjB,EAAwB,QAAA,EAAA,iBAAA,EAAe,oBAExCC,eAAA,CAACD,4CAAA,CAAiB,SAAjB,EACE,QAAA,EAAA;AAAA,MAAA,IAAA,CAAK,4BACJC,eAAA,CAAAI,mBAAA,EAAA,EACE,QAAA,EAAA;AAAA,wBAAAJ,eAAA,CAAC,EAAA,EAAA,EACC,QAAA,EAAA;AAAA,0BAAAC,cAAA,CAAC,EAAA,CAAG,GAAA,EAAH,EAAO,QAAA,EAAA,MAAA,EAAI,CAAA;AAAA,0BACZA,cAAA,CAAC,EAAA,CAAG,KAAA,EAAH,EAAU,eAAK,QAAA,EAAS;AAAA,SAAA,EAC3B,CAAA;AAAA,uCACC,IAAA,EAAA,EAAG;AAAA,OAAA,EACN,CAAA;AAAA,sBAGFA,cAAA;AAAA,~~QAACF~~,~~4CAAA~~,~~CAAiB~~,~~WAAA~~;AAAA,~~QAAjB~~;AAAA,UACC,KAAA,EAAM,OAAA;AAAA,UACN,IAAA,~~iCAAOM~~,yBAAA,EAAA,EAAc,CAAA;AAAA,UACrB,~~SAAS~~,IAAA,CAAK,~~SAAA~~,~~CAAU~~,~~KAAK~~,~~KAAA~~,~~IAAS~~,IAAA,~~EAAM~~,~~MAAM~~,~~CAAC~~;AAAA;AAAA,~~OACrD~~;AAAA,~~sBACAJ~~,cAAA;AAAA,~~QAACF~~,~~4CAAA,CAAiB,WAAA~~;AAAA,~~QAAjB~~;AAAA,UACC,KAAA,EAAM,QAAA;AAAA,UACN,IAAA,~~iCAAOO~~,0BAAA,EAAA,EAAe,CAAA;AAAA,UACtB,~~SAAS~~,IAAA,CAAK,~~SAAA~~,~~CAAU~~,~~KAAK~~,~~MAAA~~,~~IAAU~~,~~IAAA~~,~~EAAM~~,~~MAAM~~,CAAC;AAAA;AAAA,~~OACtD~~;AAAA,~~sBACAL~~,cAAA;AAAA,~~QAACF~~,~~4CAAA,CAAiB,WAAA~~;AAAA,~~QAAjB~~;AAAA,UACC,KAAA,EAAM,UAAA;AAAA,UACN,IAAA,~~iCAAOQ~~,sBAAA,EAAA,EAAW,CAAA;AAAA,UAClB,~~SAAS~~,IAAA,CAAK,~~SAAA~~,~~CAAU~~,~~KAAK~~,~~QAAA~~,~~IAAY~~,~~IAAA~~,~~EAAM~~,~~MAAM~~,~~CAAC~~;AAAA;AAAA,~~OACxD~~;AAAA,~~sBACAN~~,cAAA;AAAA,~~QAACF~~,~~4CAAA,CAAiB,WAAA~~;AAAA,~~QAAjB~~;AAAA,UACC,KAAA,EAAM,YAAA;AAAA,UACN,IAAA,~~iCAAOQ~~,sBAAA,EAAA,EAAW,CAAA;AAAA,UAClB,~~SAAS~~,IAAA,CAAK,~~SAAA~~,~~CAAU~~,~~KAAK,~~UAAA,~~IAAc~~,~~IAAA~~,~~EAAM~~,~~MAAM~~,~~CAAC~~;AAAA;AAAA;~~AAC1D~~,KAAA,EACF;AAAA,GAAA,EAEJ,CAAA;AAEJ;;;;"}
1	+ {"version":3,"file":"span-details-view.cjs.js","sources":["../../../../src/domains/traces/components/span-details-view.tsx"],"sourcesContent":["import { describeSpanInput, describeSpanOutput } from '@mastra/core/observability';\nimport { BracesIcon, FileInputIcon, FileOutputIcon } from 'lucide-react';\nimport type { SpanRecord } from '../types';\nimport { SpanErrorRenderer, SpanInputRenderer, SpanOutputRenderer, SpanPayloadSection } from './span-payload';\nimport { asCoreSpan } from './span-payload/span-payload-registry';\nimport { SpanSummaryDescription } from './span-summary-description';\nimport { TraceIdButton } from './trace-id-button';\nimport { DataDetailsPanel } from '@/ds/components/DataDetailsPanel';\n\nconst KV = DataDetailsPanel.KeyValueList;\n\nexport interface SpanDetailsViewProps {\n spanId: string;\n /** Full span record. Caller fetches via useSpanDetail. /\n span: SpanRecord \| undefined;\n isLoading?: boolean;\n onClose: () => void;\n}\n\n/\n Compact span panel using `DataDetailsPanel` (popover-style). Shows basic span metadata +\n * input/output/metadata/attributes code sections. Use this for inline span inspection; for the\n * full-width span view with scoring tab + prev/next nav, use `SpanDataPanelView`.\n */\nexport function SpanDetailsView({ spanId, span, isLoading, onClose }: SpanDetailsViewProps) {\n return (\n <DataDetailsPanel>\n <DataDetailsPanel.Header>\n <div className=\"flex min-w-0 flex-1 flex-col gap-1\">\n <DataDetailsPanel.Heading className=\"items-center\">\n Span\n <TraceIdButton id={spanId} />\n </DataDetailsPanel.Heading>\n {span && <SpanSummaryDescription span={span} />}\n </div>\n <DataDetailsPanel.CloseButton onClick={onClose} />\n </DataDetailsPanel.Header>\n\n {isLoading ? (\n <DataDetailsPanel.LoadingData>Loading span...</DataDetailsPanel.LoadingData>\n ) : !span ? (\n <DataDetailsPanel.NoData>Span not found.</DataDetailsPanel.NoData>\n ) : (\n <DataDetailsPanel.Content>\n {span.spanType && (\n <>\n <KV>\n <KV.Key>Type</KV.Key>\n <KV.Value>{span.spanType}</KV.Value>\n </KV>\n <br />\n </>\n )}\n\n <SpanPayloadSection title=\"Error\" raw={span.error} layout=\"details\" className=\"mb-3\">\n <SpanErrorRenderer span={span} />\n </SpanPayloadSection>\n\n <SpanPayloadSection\n title=\"Input\"\n icon={<FileInputIcon />}\n raw={span.input}\n hasPreview={describeSpanInput(asCoreSpan(span))?.type !== 'json'}\n layout=\"details\"\n >\n <SpanInputRenderer span={span} />\n </SpanPayloadSection>\n <SpanPayloadSection\n title=\"Output\"\n icon={<FileOutputIcon />}\n raw={span.output}\n hasPreview={describeSpanOutput(asCoreSpan(span))?.type !== 'json'}\n layout=\"details\"\n >\n <SpanOutputRenderer span={span} />\n </SpanPayloadSection>\n <SpanPayloadSection\n title=\"Metadata\"\n icon={<BracesIcon />}\n raw={span.metadata}\n hasPreview={false}\n layout=\"details\"\n >\n {null}\n </SpanPayloadSection>\n <SpanPayloadSection\n title=\"Attributes\"\n icon={<BracesIcon />}\n raw={span.attributes}\n hasPreview={false}\n layout=\"details\"\n >\n {null}\n </SpanPayloadSection>\n </DataDetailsPanel.Content>\n )}\n </DataDetailsPanel>\n );\n}\n"],"names":["DataDetailsPanel","jsxs","jsx","TraceIdButton","SpanSummaryDescription","Fragment","SpanPayloadSection","SpanErrorRenderer","FileInputIcon","describeSpanInput","asCoreSpan","SpanInputRenderer","FileOutputIcon","describeSpanOutput","SpanOutputRenderer","BracesIcon"],"mappings":"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"}

package/dist/domains/traces/components/span-details-view.es.js CHANGED Viewed

@@ -1,5 +1,15 @@
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { describeSpanInput, describeSpanOutput } from '@mastra/core/observability';
 import { FileInputIcon, FileOutputIcon, BracesIcon } from 'lucide-react';
+import { SpanInputRenderer } from './span-payload/span-input-renderers.es.js';
+import { SpanOutputRenderer } from './span-payload/span-output-renderers.es.js';
+import { SpanErrorRenderer } from './span-payload/span-error-renderer.es.js';
+import { SpanPayloadSection } from './span-payload/span-payload-section.es.js';
+import '../../../code-D4Vw_fYq.js';
+import 'react';
+import '../../../Button-XSiL3zvL.js';
+import '../../chat/context/chat-context.es.js';
+import { asCoreSpan } from './span-payload/span-payload-registry.es.js';
 import { SpanSummaryDescription } from './span-summary-description.es.js';
 import { TraceIdButton } from './trace-id-button.es.js';
 import { DataDetailsPanel } from '../../../components/DataDetailsPanel.es.js';
@@ -25,36 +35,49 @@ function SpanDetailsView({ spanId, span, isLoading, onClose }) {
         ] }),
         /* @__PURE__ */ jsx("br", {})
       ] }),
+      /* @__PURE__ */ jsx(SpanPayloadSection, { title: "Error", raw: span.error, layout: "details", className: "mb-3", children: /* @__PURE__ */ jsx(SpanErrorRenderer, { span }) }),
       /* @__PURE__ */ jsx(
-        DataDetailsPanel.CodeSection,
+        SpanPayloadSection,
         {
           title: "Input",
           icon: /* @__PURE__ */ jsx(FileInputIcon, {}),
-          codeStr: JSON.stringify(span.input ?? null, null, 2)
+          raw: span.input,
+          hasPreview: describeSpanInput(asCoreSpan(span))?.type !== "json",
+          layout: "details",
+          children: /* @__PURE__ */ jsx(SpanInputRenderer, { span })
         }
       ),
       /* @__PURE__ */ jsx(
-        DataDetailsPanel.CodeSection,
+        SpanPayloadSection,
         {
           title: "Output",
           icon: /* @__PURE__ */ jsx(FileOutputIcon, {}),
-          codeStr: JSON.stringify(span.output ?? null, null, 2)
+          raw: span.output,
+          hasPreview: describeSpanOutput(asCoreSpan(span))?.type !== "json",
+          layout: "details",
+          children: /* @__PURE__ */ jsx(SpanOutputRenderer, { span })
         }
       ),
       /* @__PURE__ */ jsx(
-        DataDetailsPanel.CodeSection,
+        SpanPayloadSection,
         {
           title: "Metadata",
           icon: /* @__PURE__ */ jsx(BracesIcon, {}),
-          codeStr: JSON.stringify(span.metadata ?? null, null, 2)
+          raw: span.metadata,
+          hasPreview: false,
+          layout: "details",
+          children: null
         }
       ),
       /* @__PURE__ */ jsx(
-        DataDetailsPanel.CodeSection,
+        SpanPayloadSection,
         {
           title: "Attributes",
           icon: /* @__PURE__ */ jsx(BracesIcon, {}),
-          codeStr: JSON.stringify(span.attributes ?? null, null, 2)
+          raw: span.attributes,
+          hasPreview: false,
+          layout: "details",
+          children: null
         }
       )
     ] })

package/dist/domains/traces/components/span-details-view.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"span-details-view.es.js","sources":["../../../../src/domains/traces/components/span-details-view.tsx"],"sourcesContent":["import ~~type~~ { ~~SpanRecord~~ } from '@mastra/core/~~storage~~';\nimport { BracesIcon, FileInputIcon, FileOutputIcon } from 'lucide-react';\nimport { SpanSummaryDescription } from './span-summary-description';\nimport { TraceIdButton } from './trace-id-button';\nimport { DataDetailsPanel } from '@/ds/components/DataDetailsPanel';\n\nconst KV = DataDetailsPanel.KeyValueList;\n\nexport interface SpanDetailsViewProps {\n spanId: string;\n /** Full span record. Caller fetches via useSpanDetail. /\n span: SpanRecord \| undefined;\n isLoading?: boolean;\n onClose: () => void;\n}\n\n/\n Compact span panel using `DataDetailsPanel` (popover-style). Shows basic span metadata +\n * input/output/metadata/attributes code sections. Use this for inline span inspection; for the\n * full-width span view with scoring tab + prev/next nav, use `SpanDataPanelView`.\n */\nexport function SpanDetailsView({ spanId, span, isLoading, onClose }: SpanDetailsViewProps) {\n return (\n <DataDetailsPanel>\n <DataDetailsPanel.Header>\n <div className=\"flex min-w-0 flex-1 flex-col gap-1\">\n <DataDetailsPanel.Heading className=\"items-center\">\n Span\n <TraceIdButton id={spanId} />\n </DataDetailsPanel.Heading>\n {span && <SpanSummaryDescription span={span} />}\n </div>\n <DataDetailsPanel.CloseButton onClick={onClose} />\n </DataDetailsPanel.Header>\n\n {isLoading ? (\n <DataDetailsPanel.LoadingData>Loading span...</DataDetailsPanel.LoadingData>\n ) : !span ? (\n <DataDetailsPanel.NoData>Span not found.</DataDetailsPanel.NoData>\n ) : (\n <DataDetailsPanel.Content>\n {span.spanType && (\n <>\n <KV>\n <KV.Key>Type</KV.Key>\n <KV.Value>{span.spanType}</KV.Value>\n </KV>\n <br />\n </>\n )}\n\n <~~DataDetailsPanel~~.~~CodeSection~~\n title=\"Input\"\n icon={<FileInputIcon />}\n ~~codeStr~~={~~JSON~~.~~stringify~~(span~~.input~~ ?? ~~null, null, 2)~~}\n />\n <~~DataDetailsPanel.CodeSection~~\n title=\"Output\"\n icon={<FileOutputIcon />}\n ~~codeStr~~={~~JSON~~.~~stringify~~(span~~.output~~ ?? ~~null, null, 2)~~}\n />\n <~~DataDetailsPanel.CodeSection~~\n title=\"Metadata\"\n icon={<BracesIcon />}\n ~~codeStr~~={~~JSON.stringify(~~span.metadata ?? null~~, null, 2)~~}\n ~~/>\~~n <~~DataDetailsPanel.CodeSection~~\n title=\"Attributes\"\n icon={<BracesIcon />}\n ~~codeStr~~={~~JSON.stringify(~~span.attributes ?? null~~, null, 2)~~}\n ~~/>\~~n </DataDetailsPanel.Content>\n )}\n </DataDetailsPanel>\n );\n}\n"],"names":[],"mappings":"~~;;;;;;AAMA~~,MAAM,KAAK,gBAAA,CAAiB,YAAA;AAerB,SAAS,gBAAgB,EAAE,MAAA,EAAQ,IAAA,EAAM,SAAA,EAAW,SAAQ,EAAyB;AAC1F,EAAA,4BACG,gBAAA,EAAA,EACC,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,gBAAA,CAAiB,QAAjB,EACC,QAAA,EAAA;AAAA,sBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,oCAAA,EACb,QAAA,EAAA;AAAA,wBAAA,IAAA,CAAC,gBAAA,CAAiB,OAAA,EAAjB,EAAyB,SAAA,EAAU,cAAA,EAAe,QAAA,EAAA;AAAA,UAAA,MAAA;AAAA,0BAEjD,GAAA,CAAC,aAAA,EAAA,EAAc,EAAA,EAAI,MAAA,EAAQ;AAAA,SAAA,EAC7B,CAAA;AAAA,QACC,IAAA,oBAAQ,GAAA,CAAC,sBAAA,EAAA,EAAuB,IAAA,EAAY;AAAA,OAAA,EAC/C,CAAA;AAAA,sBACA,GAAA,CAAC,gBAAA,CAAiB,WAAA,EAAjB,EAA6B,SAAS,OAAA,EAAS;AAAA,KAAA,EAClD,CAAA;AAAA,IAEC,4BACC,GAAA,CAAC,gBAAA,CAAiB,aAAjB,EAA6B,QAAA,EAAA,iBAAA,EAAe,IAC3C,CAAC,IAAA,mBACH,GAAA,CAAC,gBAAA,CAAiB,QAAjB,EAAwB,QAAA,EAAA,iBAAA,EAAe,oBAExC,IAAA,CAAC,gBAAA,CAAiB,SAAjB,EACE,QAAA,EAAA;AAAA,MAAA,IAAA,CAAK,4BACJ,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,wBAAA,IAAA,CAAC,EAAA,EAAA,EACC,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,EAAA,CAAG,GAAA,EAAH,EAAO,QAAA,EAAA,MAAA,EAAI,CAAA;AAAA,0BACZ,GAAA,CAAC,EAAA,CAAG,KAAA,EAAH,EAAU,eAAK,QAAA,EAAS;AAAA,SAAA,EAC3B,CAAA;AAAA,4BACC,IAAA,EAAA,EAAG;AAAA,OAAA,EACN,CAAA;AAAA,sBAGF,GAAA;AAAA,~~QAAC~~,~~gBAAA~~,~~CAAiB~~,~~WAAA~~;AAAA,~~QAAjB~~;AAAA,UACC,KAAA,EAAM,OAAA;AAAA,UACN,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,~~gBAAA,CAAiB,WAAA~~;AAAA,~~QAAjB~~;AAAA,UACC,KAAA,EAAM,QAAA;AAAA,UACN,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,~~gBAAA,CAAiB,WAAA~~;AAAA,~~QAAjB~~;AAAA,UACC,KAAA,EAAM,UAAA;AAAA,UACN,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,~~gBAAA,CAAiB,WAAA~~;AAAA,~~QAAjB~~;AAAA,UACC,KAAA,EAAM,YAAA;AAAA,UACN,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,EAEJ,CAAA;AAEJ;;;;"}
1	+ {"version":3,"file":"span-details-view.es.js","sources":["../../../../src/domains/traces/components/span-details-view.tsx"],"sourcesContent":["import { describeSpanInput, describeSpanOutput } from '@mastra/core/observability';\nimport { BracesIcon, FileInputIcon, FileOutputIcon } from 'lucide-react';\nimport type { SpanRecord } from '../types';\nimport { SpanErrorRenderer, SpanInputRenderer, SpanOutputRenderer, SpanPayloadSection } from './span-payload';\nimport { asCoreSpan } from './span-payload/span-payload-registry';\nimport { SpanSummaryDescription } from './span-summary-description';\nimport { TraceIdButton } from './trace-id-button';\nimport { DataDetailsPanel } from '@/ds/components/DataDetailsPanel';\n\nconst KV = DataDetailsPanel.KeyValueList;\n\nexport interface SpanDetailsViewProps {\n spanId: string;\n /** Full span record. Caller fetches via useSpanDetail. /\n span: SpanRecord \| undefined;\n isLoading?: boolean;\n onClose: () => void;\n}\n\n/\n Compact span panel using `DataDetailsPanel` (popover-style). Shows basic span metadata +\n * input/output/metadata/attributes code sections. Use this for inline span inspection; for the\n * full-width span view with scoring tab + prev/next nav, use `SpanDataPanelView`.\n */\nexport function SpanDetailsView({ spanId, span, isLoading, onClose }: SpanDetailsViewProps) {\n return (\n <DataDetailsPanel>\n <DataDetailsPanel.Header>\n <div className=\"flex min-w-0 flex-1 flex-col gap-1\">\n <DataDetailsPanel.Heading className=\"items-center\">\n Span\n <TraceIdButton id={spanId} />\n </DataDetailsPanel.Heading>\n {span && <SpanSummaryDescription span={span} />}\n </div>\n <DataDetailsPanel.CloseButton onClick={onClose} />\n </DataDetailsPanel.Header>\n\n {isLoading ? (\n <DataDetailsPanel.LoadingData>Loading span...</DataDetailsPanel.LoadingData>\n ) : !span ? (\n <DataDetailsPanel.NoData>Span not found.</DataDetailsPanel.NoData>\n ) : (\n <DataDetailsPanel.Content>\n {span.spanType && (\n <>\n <KV>\n <KV.Key>Type</KV.Key>\n <KV.Value>{span.spanType}</KV.Value>\n </KV>\n <br />\n </>\n )}\n\n <SpanPayloadSection title=\"Error\" raw={span.error} layout=\"details\" className=\"mb-3\">\n <SpanErrorRenderer span={span} />\n </SpanPayloadSection>\n\n <SpanPayloadSection\n title=\"Input\"\n icon={<FileInputIcon />}\n raw={span.input}\n hasPreview={describeSpanInput(asCoreSpan(span))?.type !== 'json'}\n layout=\"details\"\n >\n <SpanInputRenderer span={span} />\n </SpanPayloadSection>\n <SpanPayloadSection\n title=\"Output\"\n icon={<FileOutputIcon />}\n raw={span.output}\n hasPreview={describeSpanOutput(asCoreSpan(span))?.type !== 'json'}\n layout=\"details\"\n >\n <SpanOutputRenderer span={span} />\n </SpanPayloadSection>\n <SpanPayloadSection\n title=\"Metadata\"\n icon={<BracesIcon />}\n raw={span.metadata}\n hasPreview={false}\n layout=\"details\"\n >\n {null}\n </SpanPayloadSection>\n <SpanPayloadSection\n title=\"Attributes\"\n icon={<BracesIcon />}\n raw={span.attributes}\n hasPreview={false}\n layout=\"details\"\n >\n {null}\n </SpanPayloadSection>\n </DataDetailsPanel.Content>\n )}\n </DataDetailsPanel>\n );\n}\n"],"names":[],"mappings":"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"}

package/dist/domains/traces/components/span-payload/span-error-renderer.cjs.js ADDED Viewed

@@ -0,0 +1,38 @@
+'use strict';
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+const jsxRuntime = require('react/jsx-runtime');
+const observability = require('@mastra/core/observability');
+const domains_traces_components_spanPayload_spanPayloadJson = require('./span-payload-json.cjs.js');
+const domains_traces_components_spanPayload_spanPayloadTool = require('../../../../span-payload-primitives-Bc21pM0m.cjs');
+const domains_traces_components_spanPayload_spanPayloadRegistry = require('./span-payload-registry.cjs.js');
+const dataKeysAndValues = require('../../../../data-keys-and-values-CDhHx4Tc.cjs');
+const Notice = require('../../../../Notice-CoaE5a2D.cjs');
+function SpanErrorRenderer({ span, className }) {
+  const error = observability.describeSpanError(domains_traces_components_spanPayload_spanPayloadRegistry.asCoreSpan(span));
+  if (!error) return null;
+  const hasMeta = error.id !== void 0 || error.domain !== void 0 || error.category !== void 0;
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { "data-slot": "span-error", className, children: /* @__PURE__ */ jsxRuntime.jsxs(Notice.Notice, { variant: "destructive", title: error.name ?? "Error", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Notice.Notice.Message, { children: error.message }),
+    hasMeta && /* @__PURE__ */ jsxRuntime.jsxs(dataKeysAndValues.DataKeysAndValues, { children: [
+      error.id !== void 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(dataKeysAndValues.DataKeysAndValues.Key, { children: "Id" }),
+        /* @__PURE__ */ jsxRuntime.jsx(dataKeysAndValues.DataKeysAndValues.Value, { children: error.id })
+      ] }),
+      error.domain !== void 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(dataKeysAndValues.DataKeysAndValues.Key, { children: "Domain" }),
+        /* @__PURE__ */ jsxRuntime.jsx(dataKeysAndValues.DataKeysAndValues.Value, { children: error.domain })
+      ] }),
+      error.category !== void 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(dataKeysAndValues.DataKeysAndValues.Key, { children: "Category" }),
+        /* @__PURE__ */ jsxRuntime.jsx(dataKeysAndValues.DataKeysAndValues.Value, { children: error.category })
+      ] })
+    ] }),
+    error.details !== void 0 && /* @__PURE__ */ jsxRuntime.jsx(domains_traces_components_spanPayload_spanPayloadTool.SpanPayloadCollapsible, { label: "Details", children: /* @__PURE__ */ jsxRuntime.jsx(domains_traces_components_spanPayload_spanPayloadJson.SpanPayloadJson, { value: error.details }) })
+  ] }) });
+}
+exports.SpanErrorRenderer = SpanErrorRenderer;
+//# sourceMappingURL=span-error-renderer.cjs.js.map

package/dist/domains/traces/components/span-payload/span-error-renderer.cjs.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"span-error-renderer.cjs.js","sources":["../../../../../src/domains/traces/components/span-payload/span-error-renderer.tsx"],"sourcesContent":["import { describeSpanError } from '@mastra/core/observability';\nimport type { SpanRecord } from '../../types';\nimport { SpanPayloadJson } from './span-payload-json';\nimport { SpanPayloadCollapsible } from './span-payload-primitives';\nimport { asCoreSpan } from './span-payload-registry';\nimport { DataKeysAndValues } from '@/ds/components/DataKeysAndValues';\nimport { Notice } from '@/ds/components/Notice';\n\nexport interface SpanErrorRendererProps {\n span: SpanRecord;\n className?: string;\n}\n\n/** The error a span recorded, as a banner; `null` when the span succeeded. */\nexport function SpanErrorRenderer({ span, className }: SpanErrorRendererProps) {\n const error = describeSpanError(asCoreSpan(span));\n if (!error) return null;\n\n const hasMeta = error.id !== undefined || error.domain !== undefined || error.category !== undefined;\n\n return (\n <div data-slot=\"span-error\" className={className}>\n <Notice variant=\"destructive\" title={error.name ?? 'Error'}>\n <Notice.Message>{error.message}</Notice.Message>\n {hasMeta && (\n <DataKeysAndValues>\n {error.id !== undefined && (\n <>\n <DataKeysAndValues.Key>Id</DataKeysAndValues.Key>\n <DataKeysAndValues.Value>{error.id}</DataKeysAndValues.Value>\n </>\n )}\n {error.domain !== undefined && (\n <>\n <DataKeysAndValues.Key>Domain</DataKeysAndValues.Key>\n <DataKeysAndValues.Value>{error.domain}</DataKeysAndValues.Value>\n </>\n )}\n {error.category !== undefined && (\n <>\n <DataKeysAndValues.Key>Category</DataKeysAndValues.Key>\n <DataKeysAndValues.Value>{error.category}</DataKeysAndValues.Value>\n </>\n )}\n </DataKeysAndValues>\n )}\n {error.details !== undefined && (\n <SpanPayloadCollapsible label=\"Details\">\n <SpanPayloadJson value={error.details} />\n </SpanPayloadCollapsible>\n )}\n </Notice>\n </div>\n );\n}\n"],"names":["describeSpanError","asCoreSpan","jsx","jsxs","Notice","DataKeysAndValues","Fragment","SpanPayloadCollapsible","SpanPayloadJson"],"mappings":";;;;;;;;;;;;AAcO,SAAS,iBAAA,CAAkB,EAAE,IAAA,EAAM,SAAA,EAAU,EAA2B;AAC7E,EAAA,MAAM,KAAA,GAAQA,+BAAA,CAAkBC,oEAAA,CAAW,IAAI,CAAC,CAAA;AAChD,EAAA,IAAI,CAAC,OAAO,OAAO,IAAA;AAEnB,EAAA,MAAM,OAAA,GAAU,MAAM,EAAA,KAAO,MAAA,IAAa,MAAM,MAAA,KAAW,MAAA,IAAa,MAAM,QAAA,KAAa,MAAA;AAE3F,EAAA,uBACEC,cAAA,CAAC,KAAA,EAAA,EAAI,WAAA,EAAU,YAAA,EAAa,SAAA,EAC1B,QAAA,kBAAAC,eAAA,CAACC,aAAA,EAAA,EAAO,OAAA,EAAQ,aAAA,EAAc,KAAA,EAAO,KAAA,CAAM,IAAA,IAAQ,OAAA,EACjD,QAAA,EAAA;AAAA,oBAAAF,cAAA,CAACE,aAAA,CAAO,OAAA,EAAP,EAAgB,QAAA,EAAA,KAAA,CAAM,OAAA,EAAQ,CAAA;AAAA,IAC9B,OAAA,oCACEC,mCAAA,EAAA,EACE,QAAA,EAAA;AAAA,MAAA,KAAA,CAAM,EAAA,KAAO,0BACZF,eAAA,CAAAG,mBAAA,EAAA,EACE,QAAA,EAAA;AAAA,wBAAAJ,cAAA,CAACG,mCAAA,CAAkB,GAAA,EAAlB,EAAsB,QAAA,EAAA,IAAA,EAAE,CAAA;AAAA,wBACzBH,cAAA,CAACG,mCAAA,CAAkB,KAAA,EAAlB,EAAyB,gBAAM,EAAA,EAAG;AAAA,OAAA,EACrC,CAAA;AAAA,MAED,KAAA,CAAM,MAAA,KAAW,MAAA,oBAChBF,eAAA,CAAAG,mBAAA,EAAA,EACE,QAAA,EAAA;AAAA,wBAAAJ,cAAA,CAACG,mCAAA,CAAkB,GAAA,EAAlB,EAAsB,QAAA,EAAA,QAAA,EAAM,CAAA;AAAA,wBAC7BH,cAAA,CAACG,mCAAA,CAAkB,KAAA,EAAlB,EAAyB,gBAAM,MAAA,EAAO;AAAA,OAAA,EACzC,CAAA;AAAA,MAED,KAAA,CAAM,QAAA,KAAa,MAAA,oBAClBF,eAAA,CAAAG,mBAAA,EAAA,EACE,QAAA,EAAA;AAAA,wBAAAJ,cAAA,CAACG,mCAAA,CAAkB,GAAA,EAAlB,EAAsB,QAAA,EAAA,UAAA,EAAQ,CAAA;AAAA,wBAC/BH,cAAA,CAACG,mCAAA,CAAkB,KAAA,EAAlB,EAAyB,gBAAM,QAAA,EAAS;AAAA,OAAA,EAC3C;AAAA,KAAA,EAEJ,CAAA;AAAA,IAED,KAAA,CAAM,OAAA,KAAY,MAAA,oBACjBH,cAAA,CAACK,4EAAA,EAAA,EAAuB,KAAA,EAAM,SAAA,EAC5B,QAAA,kBAAAL,cAAA,CAACM,qEAAA,EAAA,EAAgB,KAAA,EAAO,KAAA,CAAM,OAAA,EAAS,CAAA,EACzC;AAAA,GAAA,EAEJ,CAAA,EACF,CAAA;AAEJ;;;;"}

package/dist/domains/traces/components/span-payload/span-error-renderer.d.ts ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ export * from '../../../../src/domains/traces/components/span-payload/span-error-renderer'
2	+ export {}

package/dist/domains/traces/components/span-payload/span-error-renderer.es.js ADDED Viewed

@@ -0,0 +1,34 @@
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { describeSpanError } from '@mastra/core/observability';
+import { SpanPayloadJson } from './span-payload-json.es.js';
+import { c as SpanPayloadCollapsible } from '../../../../span-payload-primitives-DXg3l6FW.js';
+import { asCoreSpan } from './span-payload-registry.es.js';
+import { D as DataKeysAndValues } from '../../../../data-keys-and-values-DNqDDNb0.js';
+import { N as Notice } from '../../../../Notice-BkL7EPmo.js';
+function SpanErrorRenderer({ span, className }) {
+  const error = describeSpanError(asCoreSpan(span));
+  if (!error) return null;
+  const hasMeta = error.id !== void 0 || error.domain !== void 0 || error.category !== void 0;
+  return /* @__PURE__ */ jsx("div", { "data-slot": "span-error", className, children: /* @__PURE__ */ jsxs(Notice, { variant: "destructive", title: error.name ?? "Error", children: [
+    /* @__PURE__ */ jsx(Notice.Message, { children: error.message }),
+    hasMeta && /* @__PURE__ */ jsxs(DataKeysAndValues, { children: [
+      error.id !== void 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(DataKeysAndValues.Key, { children: "Id" }),
+        /* @__PURE__ */ jsx(DataKeysAndValues.Value, { children: error.id })
+      ] }),
+      error.domain !== void 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(DataKeysAndValues.Key, { children: "Domain" }),
+        /* @__PURE__ */ jsx(DataKeysAndValues.Value, { children: error.domain })
+      ] }),
+      error.category !== void 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(DataKeysAndValues.Key, { children: "Category" }),
+        /* @__PURE__ */ jsx(DataKeysAndValues.Value, { children: error.category })
+      ] })
+    ] }),
+    error.details !== void 0 && /* @__PURE__ */ jsx(SpanPayloadCollapsible, { label: "Details", children: /* @__PURE__ */ jsx(SpanPayloadJson, { value: error.details }) })
+  ] }) });
+}
+export { SpanErrorRenderer };
+//# sourceMappingURL=span-error-renderer.es.js.map

package/dist/domains/traces/components/span-payload/span-error-renderer.es.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"span-error-renderer.es.js","sources":["../../../../../src/domains/traces/components/span-payload/span-error-renderer.tsx"],"sourcesContent":["import { describeSpanError } from '@mastra/core/observability';\nimport type { SpanRecord } from '../../types';\nimport { SpanPayloadJson } from './span-payload-json';\nimport { SpanPayloadCollapsible } from './span-payload-primitives';\nimport { asCoreSpan } from './span-payload-registry';\nimport { DataKeysAndValues } from '@/ds/components/DataKeysAndValues';\nimport { Notice } from '@/ds/components/Notice';\n\nexport interface SpanErrorRendererProps {\n span: SpanRecord;\n className?: string;\n}\n\n/** The error a span recorded, as a banner; `null` when the span succeeded. */\nexport function SpanErrorRenderer({ span, className }: SpanErrorRendererProps) {\n const error = describeSpanError(asCoreSpan(span));\n if (!error) return null;\n\n const hasMeta = error.id !== undefined || error.domain !== undefined || error.category !== undefined;\n\n return (\n <div data-slot=\"span-error\" className={className}>\n <Notice variant=\"destructive\" title={error.name ?? 'Error'}>\n <Notice.Message>{error.message}</Notice.Message>\n {hasMeta && (\n <DataKeysAndValues>\n {error.id !== undefined && (\n <>\n <DataKeysAndValues.Key>Id</DataKeysAndValues.Key>\n <DataKeysAndValues.Value>{error.id}</DataKeysAndValues.Value>\n </>\n )}\n {error.domain !== undefined && (\n <>\n <DataKeysAndValues.Key>Domain</DataKeysAndValues.Key>\n <DataKeysAndValues.Value>{error.domain}</DataKeysAndValues.Value>\n </>\n )}\n {error.category !== undefined && (\n <>\n <DataKeysAndValues.Key>Category</DataKeysAndValues.Key>\n <DataKeysAndValues.Value>{error.category}</DataKeysAndValues.Value>\n </>\n )}\n </DataKeysAndValues>\n )}\n {error.details !== undefined && (\n <SpanPayloadCollapsible label=\"Details\">\n <SpanPayloadJson value={error.details} />\n </SpanPayloadCollapsible>\n )}\n </Notice>\n </div>\n );\n}\n"],"names":[],"mappings":";;;;;;;;AAcO,SAAS,iBAAA,CAAkB,EAAE,IAAA,EAAM,SAAA,EAAU,EAA2B;AAC7E,EAAA,MAAM,KAAA,GAAQ,iBAAA,CAAkB,UAAA,CAAW,IAAI,CAAC,CAAA;AAChD,EAAA,IAAI,CAAC,OAAO,OAAO,IAAA;AAEnB,EAAA,MAAM,OAAA,GAAU,MAAM,EAAA,KAAO,MAAA,IAAa,MAAM,MAAA,KAAW,MAAA,IAAa,MAAM,QAAA,KAAa,MAAA;AAE3F,EAAA,uBACE,GAAA,CAAC,KAAA,EAAA,EAAI,WAAA,EAAU,YAAA,EAAa,SAAA,EAC1B,QAAA,kBAAA,IAAA,CAAC,MAAA,EAAA,EAAO,OAAA,EAAQ,aAAA,EAAc,KAAA,EAAO,KAAA,CAAM,IAAA,IAAQ,OAAA,EACjD,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,MAAA,CAAO,OAAA,EAAP,EAAgB,QAAA,EAAA,KAAA,CAAM,OAAA,EAAQ,CAAA;AAAA,IAC9B,OAAA,yBACE,iBAAA,EAAA,EACE,QAAA,EAAA;AAAA,MAAA,KAAA,CAAM,EAAA,KAAO,0BACZ,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,iBAAA,CAAkB,GAAA,EAAlB,EAAsB,QAAA,EAAA,IAAA,EAAE,CAAA;AAAA,wBACzB,GAAA,CAAC,iBAAA,CAAkB,KAAA,EAAlB,EAAyB,gBAAM,EAAA,EAAG;AAAA,OAAA,EACrC,CAAA;AAAA,MAED,KAAA,CAAM,MAAA,KAAW,MAAA,oBAChB,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,iBAAA,CAAkB,GAAA,EAAlB,EAAsB,QAAA,EAAA,QAAA,EAAM,CAAA;AAAA,wBAC7B,GAAA,CAAC,iBAAA,CAAkB,KAAA,EAAlB,EAAyB,gBAAM,MAAA,EAAO;AAAA,OAAA,EACzC,CAAA;AAAA,MAED,KAAA,CAAM,QAAA,KAAa,MAAA,oBAClB,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,iBAAA,CAAkB,GAAA,EAAlB,EAAsB,QAAA,EAAA,UAAA,EAAQ,CAAA;AAAA,wBAC/B,GAAA,CAAC,iBAAA,CAAkB,KAAA,EAAlB,EAAyB,gBAAM,QAAA,EAAS;AAAA,OAAA,EAC3C;AAAA,KAAA,EAEJ,CAAA;AAAA,IAED,KAAA,CAAM,OAAA,KAAY,MAAA,oBACjB,GAAA,CAAC,sBAAA,EAAA,EAAuB,KAAA,EAAM,SAAA,EAC5B,QAAA,kBAAA,GAAA,CAAC,eAAA,EAAA,EAAgB,KAAA,EAAO,KAAA,CAAM,OAAA,EAAS,CAAA,EACzC;AAAA,GAAA,EAEJ,CAAA,EACF,CAAA;AAEJ;;;;"}

package/dist/domains/traces/components/span-payload/span-input-renderers.cjs.js ADDED Viewed

@@ -0,0 +1,50 @@
+'use strict';
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+const jsxRuntime = require('react/jsx-runtime');
+const observability = require('@mastra/core/observability');
+const domains_traces_components_spanPayload_spanPayloadJson = require('./span-payload-json.cjs.js');
+const domains_traces_components_spanPayload_spanPayloadMessages = require('./span-payload-messages.cjs.js');
+const domains_traces_components_spanPayload_spanPayloadTool = require('../../../../span-payload-primitives-Bc21pM0m.cjs');
+const domains_traces_components_spanPayload_spanPayloadRegistry = require('./span-payload-registry.cjs.js');
+const Card = require('../../../../Card-Cwtkduiw.cjs');
+const dataKeysAndValues = require('../../../../data-keys-and-values-CDhHx4Tc.cjs');
+function SpanTextRenderer({ value }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(domains_traces_components_spanPayload_spanPayloadTool.SpanPayloadMarkdown, { children: value });
+}
+function SpanAgentRunResumeRenderer({ value }) {
+  const { resumeData, toolName, toolCallId, ...rest } = value;
+  const hasTarget = toolName !== void 0 || toolCallId !== void 0;
+  const data = resumeData !== void 0 ? resumeData : Object.keys(rest).length > 0 ? rest : void 0;
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-slot": "span-agent-run-resume", className: "flex flex-col gap-6", children: [
+    hasTarget && /* @__PURE__ */ jsxRuntime.jsx(domains_traces_components_spanPayload_spanPayloadTool.SpanPayloadField, { label: "Resumes into", children: /* @__PURE__ */ jsxRuntime.jsxs(dataKeysAndValues.DataKeysAndValues, { children: [
+      toolName !== void 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(dataKeysAndValues.DataKeysAndValues.Key, { children: "Tool" }),
+        /* @__PURE__ */ jsxRuntime.jsx(dataKeysAndValues.DataKeysAndValues.Value, { children: String(toolName) })
+      ] }),
+      toolCallId !== void 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(dataKeysAndValues.DataKeysAndValues.Key, { children: "Tool call id" }),
+        /* @__PURE__ */ jsxRuntime.jsx(dataKeysAndValues.DataKeysAndValues.ValueWithCopyBtn, { copyValue: String(toolCallId), children: String(toolCallId) })
+      ] })
+    ] }) }),
+    data !== void 0 && /* @__PURE__ */ jsxRuntime.jsx(domains_traces_components_spanPayload_spanPayloadTool.SpanPayloadField, { label: "Resume data", children: /* @__PURE__ */ jsxRuntime.jsx(domains_traces_components_spanPayload_spanPayloadJson.SpanPayloadJson, { value: data }) })
+  ] });
+}
+const SPAN_INPUT_RENDERERS = {
+  text: SpanTextRenderer,
+  messages: domains_traces_components_spanPayload_spanPayloadMessages.SpanPayloadMessages,
+  "agent-run-resume": SpanAgentRunResumeRenderer,
+  json: domains_traces_components_spanPayload_spanPayloadJson.SpanPayloadJson
+};
+function SpanInputRenderer({ span }) {
+  const description = observability.describeSpanInput(domains_traces_components_spanPayload_spanPayloadRegistry.asCoreSpan(span));
+  if (!description) return null;
+  if (description.type === "json") return /* @__PURE__ */ jsxRuntime.jsx(domains_traces_components_spanPayload_spanPayloadJson.SpanPayloadJson, { value: description.value });
+  const Renderer = domains_traces_components_spanPayload_spanPayloadRegistry.pickRenderer(SPAN_INPUT_RENDERERS, description);
+  return /* @__PURE__ */ jsxRuntime.jsx(Card.Card, { "data-slot": "span-input-card", appearance: "surface", elevation: "raised", className: "border-border1 min-w-0 border", children: /* @__PURE__ */ jsxRuntime.jsx(Card.CardContent, { children: /* @__PURE__ */ jsxRuntime.jsx(Renderer, { value: description.value }) }) });
+}
+exports.SpanInputRenderer = SpanInputRenderer;
+//# sourceMappingURL=span-input-renderers.cjs.js.map

package/dist/domains/traces/components/span-payload/span-input-renderers.cjs.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"span-input-renderers.cjs.js","sources":["../../../../../src/domains/traces/components/span-payload/span-input-renderers.tsx"],"sourcesContent":["import { describeSpanInput } from '@mastra/core/observability';\nimport type { AgentRunResumeInput, SpanInputDescription } from '@mastra/core/observability';\nimport type { SpanRecord } from '../../types';\nimport { SpanPayloadJson } from './span-payload-json';\nimport { SpanPayloadMessages } from './span-payload-messages';\nimport { SpanPayloadField, SpanPayloadMarkdown } from './span-payload-primitives';\nimport { asCoreSpan, pickRenderer } from './span-payload-registry';\nimport type { PayloadRegistry } from './span-payload-registry';\nimport { Card, CardContent } from '@/ds/components/Card';\nimport { DataKeysAndValues } from '@/ds/components/DataKeysAndValues';\n\nfunction SpanTextRenderer({ value }: { value: string }) {\n return <SpanPayloadMarkdown>{value}</SpanPayloadMarkdown>;\n}\n\nfunction SpanAgentRunResumeRenderer({ value }: { value: AgentRunResumeInput }) {\n const { resumeData, toolName, toolCallId, ...rest } = value;\n const hasTarget = toolName !== undefined || toolCallId !== undefined;\n const data = resumeData !== undefined ? resumeData : Object.keys(rest).length > 0 ? rest : undefined;\n return (\n <div data-slot=\"span-agent-run-resume\" className=\"flex flex-col gap-6\">\n {hasTarget && (\n <SpanPayloadField label=\"Resumes into\">\n <DataKeysAndValues>\n {toolName !== undefined && (\n <>\n <DataKeysAndValues.Key>Tool</DataKeysAndValues.Key>\n <DataKeysAndValues.Value>{String(toolName)}</DataKeysAndValues.Value>\n </>\n )}\n {toolCallId !== undefined && (\n <>\n <DataKeysAndValues.Key>Tool call id</DataKeysAndValues.Key>\n <DataKeysAndValues.ValueWithCopyBtn copyValue={String(toolCallId)}>\n {String(toolCallId)}\n </DataKeysAndValues.ValueWithCopyBtn>\n </>\n )}\n </DataKeysAndValues>\n </SpanPayloadField>\n )}\n {data !== undefined && (\n <SpanPayloadField label=\"Resume data\">\n <SpanPayloadJson value={data} />\n </SpanPayloadField>\n )}\n </div>\n );\n}\n\n/**\n * One renderer per `describeSpanInput` tag. `satisfies` keeps the map exhaustive: a\n * new tag in core is a type error here until it gets a renderer (or maps to JSON).\n */\nconst SPAN_INPUT_RENDERERS = {\n text: SpanTextRenderer,\n messages: SpanPayloadMessages,\n 'agent-run-resume': SpanAgentRunResumeRenderer,\n json: SpanPayloadJson,\n} satisfies PayloadRegistry<SpanInputDescription>;\n\nexport interface SpanInputRendererProps {\n span: SpanRecord;\n}\n\n/** Renders a span's input through the registry; `null` when the span recorded none. */\nexport function SpanInputRenderer({ span }: SpanInputRendererProps) {\n const description = describeSpanInput(asCoreSpan(span));\n if (!description) return null;\n if (description.type === 'json') return <SpanPayloadJson value={description.value} />;\n const Renderer = pickRenderer(SPAN_INPUT_RENDERERS, description);\n return (\n <Card data-slot=\"span-input-card\" appearance=\"surface\" elevation=\"raised\" className=\"border-border1 min-w-0 border\">\n <CardContent>\n <Renderer value={description.value} />\n </CardContent>\n </Card>\n );\n}\n"],"names":["jsx","SpanPayloadMarkdown","jsxs","SpanPayloadField","DataKeysAndValues","Fragment","SpanPayloadJson","SpanPayloadMessages","describeSpanInput","asCoreSpan","pickRenderer","Card","CardContent"],"mappings":";;;;;;;;;;;;;AAWA,SAAS,gBAAA,CAAiB,EAAE,KAAA,EAAM,EAAsB;AACtD,EAAA,uBAAOA,cAAA,CAACC,6EAAqB,QAAA,EAAA,KAAA,EAAM,CAAA;AACrC;AAEA,SAAS,0BAAA,CAA2B,EAAE,KAAA,EAAM,EAAmC;AAC7E,EAAA,MAAM,EAAE,UAAA,EAAY,QAAA,EAAU,UAAA,EAAY,GAAG,MAAK,GAAI,KAAA;AACtD,EAAA,MAAM,SAAA,GAAY,QAAA,KAAa,MAAA,IAAa,UAAA,KAAe,MAAA;AAC3D,EAAA,MAAM,IAAA,GAAO,UAAA,KAAe,MAAA,GAAY,UAAA,GAAa,MAAA,CAAO,KAAK,IAAI,CAAA,CAAE,MAAA,GAAS,CAAA,GAAI,IAAA,GAAO,MAAA;AAC3F,EAAA,uBACEC,eAAA,CAAC,KAAA,EAAA,EAAI,WAAA,EAAU,uBAAA,EAAwB,WAAU,qBAAA,EAC9C,QAAA,EAAA;AAAA,IAAA,SAAA,oBACCF,cAAA,CAACG,sEAAA,EAAA,EAAiB,KAAA,EAAM,cAAA,EACtB,0CAACC,mCAAA,EAAA,EACE,QAAA,EAAA;AAAA,MAAA,QAAA,KAAa,0BACZF,eAAA,CAAAG,mBAAA,EAAA,EACE,QAAA,EAAA;AAAA,wBAAAL,cAAA,CAACI,mCAAA,CAAkB,GAAA,EAAlB,EAAsB,QAAA,EAAA,MAAA,EAAI,CAAA;AAAA,uCAC1BA,mCAAA,CAAkB,KAAA,EAAlB,EAAyB,QAAA,EAAA,MAAA,CAAO,QAAQ,CAAA,EAAE;AAAA,OAAA,EAC7C,CAAA;AAAA,MAED,UAAA,KAAe,0BACdF,eAAA,CAAAG,mBAAA,EAAA,EACE,QAAA,EAAA;AAAA,wBAAAL,cAAA,CAACI,mCAAA,CAAkB,GAAA,EAAlB,EAAsB,QAAA,EAAA,cAAA,EAAY,CAAA;AAAA,wBACnCJ,cAAA,CAACI,mCAAA,CAAkB,gBAAA,EAAlB,EAAmC,SAAA,EAAW,OAAO,UAAU,CAAA,EAC7D,QAAA,EAAA,MAAA,CAAO,UAAU,CAAA,EACpB;AAAA,OAAA,EACF;AAAA,KAAA,EAEJ,CAAA,EACF,CAAA;AAAA,IAED,IAAA,KAAS,MAAA,oBACRJ,cAAA,CAACG,sEAAA,EAAA,EAAiB,KAAA,EAAM,eACtB,QAAA,kBAAAH,cAAA,CAACM,qEAAA,EAAA,EAAgB,KAAA,EAAO,IAAA,EAAM,CAAA,EAChC;AAAA,GAAA,EAEJ,CAAA;AAEJ;AAMA,MAAM,oBAAA,GAAuB;AAAA,EAC3B,IAAA,EAAM,gBAAA;AAAA,EACN,QAAA,EAAUC,6EAAA;AAAA,EACV,kBAAA,EAAoB,0BAAA;AAAA,EACpB,IAAA,EAAMD;AACR,CAAA;AAOO,SAAS,iBAAA,CAAkB,EAAE,IAAA,EAAK,EAA2B;AAClE,EAAA,MAAM,WAAA,GAAcE,+BAAA,CAAkBC,oEAAA,CAAW,IAAI,CAAC,CAAA;AACtD,EAAA,IAAI,CAAC,aAAa,OAAO,IAAA;AACzB,EAAA,IAAI,WAAA,CAAY,SAAS,MAAA,EAAQ,sCAAQH,qEAAA,EAAA,EAAgB,KAAA,EAAO,YAAY,KAAA,EAAO,CAAA;AACnF,EAAA,MAAM,QAAA,GAAWI,sEAAA,CAAa,oBAAA,EAAsB,WAAW,CAAA;AAC/D,EAAA,sCACGC,SAAA,EAAA,EAAK,WAAA,EAAU,mBAAkB,UAAA,EAAW,SAAA,EAAU,WAAU,QAAA,EAAS,SAAA,EAAU,+BAAA,EAClF,QAAA,kBAAAX,cAAA,CAACY,oBACC,QAAA,kBAAAZ,cAAA,CAAC,QAAA,EAAA,EAAS,OAAO,WAAA,CAAY,KAAA,EAAO,GACtC,CAAA,EACF,CAAA;AAEJ;;;;"}

package/dist/domains/traces/components/span-payload/span-input-renderers.d.ts ADDED Viewed

	@@ -0,0 +1,2 @@
1	+ export * from '../../../../src/domains/traces/components/span-payload/span-input-renderers'
2	+ export {}

package/dist/domains/traces/components/span-payload/span-input-renderers.es.js ADDED Viewed

@@ -0,0 +1,46 @@
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { describeSpanInput } from '@mastra/core/observability';
+import { SpanPayloadJson } from './span-payload-json.es.js';
+import { SpanPayloadMessages } from './span-payload-messages.es.js';
+import { S as SpanPayloadField, a as SpanPayloadMarkdown } from '../../../../span-payload-primitives-DXg3l6FW.js';
+import { asCoreSpan, pickRenderer } from './span-payload-registry.es.js';
+import { C as Card, a as CardContent } from '../../../../Card-BnHDiblE.js';
+import { D as DataKeysAndValues } from '../../../../data-keys-and-values-DNqDDNb0.js';
+function SpanTextRenderer({ value }) {
+  return /* @__PURE__ */ jsx(SpanPayloadMarkdown, { children: value });
+}
+function SpanAgentRunResumeRenderer({ value }) {
+  const { resumeData, toolName, toolCallId, ...rest } = value;
+  const hasTarget = toolName !== void 0 || toolCallId !== void 0;
+  const data = resumeData !== void 0 ? resumeData : Object.keys(rest).length > 0 ? rest : void 0;
+  return /* @__PURE__ */ jsxs("div", { "data-slot": "span-agent-run-resume", className: "flex flex-col gap-6", children: [
+    hasTarget && /* @__PURE__ */ jsx(SpanPayloadField, { label: "Resumes into", children: /* @__PURE__ */ jsxs(DataKeysAndValues, { children: [
+      toolName !== void 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(DataKeysAndValues.Key, { children: "Tool" }),
+        /* @__PURE__ */ jsx(DataKeysAndValues.Value, { children: String(toolName) })
+      ] }),
+      toolCallId !== void 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(DataKeysAndValues.Key, { children: "Tool call id" }),
+        /* @__PURE__ */ jsx(DataKeysAndValues.ValueWithCopyBtn, { copyValue: String(toolCallId), children: String(toolCallId) })
+      ] })
+    ] }) }),
+    data !== void 0 && /* @__PURE__ */ jsx(SpanPayloadField, { label: "Resume data", children: /* @__PURE__ */ jsx(SpanPayloadJson, { value: data }) })
+  ] });
+}
+const SPAN_INPUT_RENDERERS = {
+  text: SpanTextRenderer,
+  messages: SpanPayloadMessages,
+  "agent-run-resume": SpanAgentRunResumeRenderer,
+  json: SpanPayloadJson
+};
+function SpanInputRenderer({ span }) {
+  const description = describeSpanInput(asCoreSpan(span));
+  if (!description) return null;
+  if (description.type === "json") return /* @__PURE__ */ jsx(SpanPayloadJson, { value: description.value });
+  const Renderer = pickRenderer(SPAN_INPUT_RENDERERS, description);
+  return /* @__PURE__ */ jsx(Card, { "data-slot": "span-input-card", appearance: "surface", elevation: "raised", className: "border-border1 min-w-0 border", children: /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx(Renderer, { value: description.value }) }) });
+}
+export { SpanInputRenderer };
+//# sourceMappingURL=span-input-renderers.es.js.map

package/dist/domains/traces/components/span-payload/span-input-renderers.es.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"span-input-renderers.es.js","sources":["../../../../../src/domains/traces/components/span-payload/span-input-renderers.tsx"],"sourcesContent":["import { describeSpanInput } from '@mastra/core/observability';\nimport type { AgentRunResumeInput, SpanInputDescription } from '@mastra/core/observability';\nimport type { SpanRecord } from '../../types';\nimport { SpanPayloadJson } from './span-payload-json';\nimport { SpanPayloadMessages } from './span-payload-messages';\nimport { SpanPayloadField, SpanPayloadMarkdown } from './span-payload-primitives';\nimport { asCoreSpan, pickRenderer } from './span-payload-registry';\nimport type { PayloadRegistry } from './span-payload-registry';\nimport { Card, CardContent } from '@/ds/components/Card';\nimport { DataKeysAndValues } from '@/ds/components/DataKeysAndValues';\n\nfunction SpanTextRenderer({ value }: { value: string }) {\n return <SpanPayloadMarkdown>{value}</SpanPayloadMarkdown>;\n}\n\nfunction SpanAgentRunResumeRenderer({ value }: { value: AgentRunResumeInput }) {\n const { resumeData, toolName, toolCallId, ...rest } = value;\n const hasTarget = toolName !== undefined || toolCallId !== undefined;\n const data = resumeData !== undefined ? resumeData : Object.keys(rest).length > 0 ? rest : undefined;\n return (\n <div data-slot=\"span-agent-run-resume\" className=\"flex flex-col gap-6\">\n {hasTarget && (\n <SpanPayloadField label=\"Resumes into\">\n <DataKeysAndValues>\n {toolName !== undefined && (\n <>\n <DataKeysAndValues.Key>Tool</DataKeysAndValues.Key>\n <DataKeysAndValues.Value>{String(toolName)}</DataKeysAndValues.Value>\n </>\n )}\n {toolCallId !== undefined && (\n <>\n <DataKeysAndValues.Key>Tool call id</DataKeysAndValues.Key>\n <DataKeysAndValues.ValueWithCopyBtn copyValue={String(toolCallId)}>\n {String(toolCallId)}\n </DataKeysAndValues.ValueWithCopyBtn>\n </>\n )}\n </DataKeysAndValues>\n </SpanPayloadField>\n )}\n {data !== undefined && (\n <SpanPayloadField label=\"Resume data\">\n <SpanPayloadJson value={data} />\n </SpanPayloadField>\n )}\n </div>\n );\n}\n\n/**\n * One renderer per `describeSpanInput` tag. `satisfies` keeps the map exhaustive: a\n * new tag in core is a type error here until it gets a renderer (or maps to JSON).\n */\nconst SPAN_INPUT_RENDERERS = {\n text: SpanTextRenderer,\n messages: SpanPayloadMessages,\n 'agent-run-resume': SpanAgentRunResumeRenderer,\n json: SpanPayloadJson,\n} satisfies PayloadRegistry<SpanInputDescription>;\n\nexport interface SpanInputRendererProps {\n span: SpanRecord;\n}\n\n/** Renders a span's input through the registry; `null` when the span recorded none. */\nexport function SpanInputRenderer({ span }: SpanInputRendererProps) {\n const description = describeSpanInput(asCoreSpan(span));\n if (!description) return null;\n if (description.type === 'json') return <SpanPayloadJson value={description.value} />;\n const Renderer = pickRenderer(SPAN_INPUT_RENDERERS, description);\n return (\n <Card data-slot=\"span-input-card\" appearance=\"surface\" elevation=\"raised\" className=\"border-border1 min-w-0 border\">\n <CardContent>\n <Renderer value={description.value} />\n </CardContent>\n </Card>\n );\n}\n"],"names":[],"mappings":";;;;;;;;;AAWA,SAAS,gBAAA,CAAiB,EAAE,KAAA,EAAM,EAAsB;AACtD,EAAA,uBAAO,GAAA,CAAC,uBAAqB,QAAA,EAAA,KAAA,EAAM,CAAA;AACrC;AAEA,SAAS,0BAAA,CAA2B,EAAE,KAAA,EAAM,EAAmC;AAC7E,EAAA,MAAM,EAAE,UAAA,EAAY,QAAA,EAAU,UAAA,EAAY,GAAG,MAAK,GAAI,KAAA;AACtD,EAAA,MAAM,SAAA,GAAY,QAAA,KAAa,MAAA,IAAa,UAAA,KAAe,MAAA;AAC3D,EAAA,MAAM,IAAA,GAAO,UAAA,KAAe,MAAA,GAAY,UAAA,GAAa,MAAA,CAAO,KAAK,IAAI,CAAA,CAAE,MAAA,GAAS,CAAA,GAAI,IAAA,GAAO,MAAA;AAC3F,EAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAI,WAAA,EAAU,uBAAA,EAAwB,WAAU,qBAAA,EAC9C,QAAA,EAAA;AAAA,IAAA,SAAA,oBACC,GAAA,CAAC,gBAAA,EAAA,EAAiB,KAAA,EAAM,cAAA,EACtB,+BAAC,iBAAA,EAAA,EACE,QAAA,EAAA;AAAA,MAAA,QAAA,KAAa,0BACZ,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,iBAAA,CAAkB,GAAA,EAAlB,EAAsB,QAAA,EAAA,MAAA,EAAI,CAAA;AAAA,4BAC1B,iBAAA,CAAkB,KAAA,EAAlB,EAAyB,QAAA,EAAA,MAAA,CAAO,QAAQ,CAAA,EAAE;AAAA,OAAA,EAC7C,CAAA;AAAA,MAED,UAAA,KAAe,0BACd,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,wBAAA,GAAA,CAAC,iBAAA,CAAkB,GAAA,EAAlB,EAAsB,QAAA,EAAA,cAAA,EAAY,CAAA;AAAA,wBACnC,GAAA,CAAC,iBAAA,CAAkB,gBAAA,EAAlB,EAAmC,SAAA,EAAW,OAAO,UAAU,CAAA,EAC7D,QAAA,EAAA,MAAA,CAAO,UAAU,CAAA,EACpB;AAAA,OAAA,EACF;AAAA,KAAA,EAEJ,CAAA,EACF,CAAA;AAAA,IAED,IAAA,KAAS,MAAA,oBACR,GAAA,CAAC,gBAAA,EAAA,EAAiB,KAAA,EAAM,eACtB,QAAA,kBAAA,GAAA,CAAC,eAAA,EAAA,EAAgB,KAAA,EAAO,IAAA,EAAM,CAAA,EAChC;AAAA,GAAA,EAEJ,CAAA;AAEJ;AAMA,MAAM,oBAAA,GAAuB;AAAA,EAC3B,IAAA,EAAM,gBAAA;AAAA,EACN,QAAA,EAAU,mBAAA;AAAA,EACV,kBAAA,EAAoB,0BAAA;AAAA,EACpB,IAAA,EAAM;AACR,CAAA;AAOO,SAAS,iBAAA,CAAkB,EAAE,IAAA,EAAK,EAA2B;AAClE,EAAA,MAAM,WAAA,GAAc,iBAAA,CAAkB,UAAA,CAAW,IAAI,CAAC,CAAA;AACtD,EAAA,IAAI,CAAC,aAAa,OAAO,IAAA;AACzB,EAAA,IAAI,WAAA,CAAY,SAAS,MAAA,EAAQ,2BAAQ,eAAA,EAAA,EAAgB,KAAA,EAAO,YAAY,KAAA,EAAO,CAAA;AACnF,EAAA,MAAM,QAAA,GAAW,YAAA,CAAa,oBAAA,EAAsB,WAAW,CAAA;AAC/D,EAAA,2BACG,IAAA,EAAA,EAAK,WAAA,EAAU,mBAAkB,UAAA,EAAW,SAAA,EAAU,WAAU,QAAA,EAAS,SAAA,EAAU,+BAAA,EAClF,QAAA,kBAAA,GAAA,CAAC,eACC,QAAA,kBAAA,GAAA,CAAC,QAAA,EAAA,EAAS,OAAO,WAAA,CAAY,KAAA,EAAO,GACtC,CAAA,EACF,CAAA;AAEJ;;;;"}