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

package/dist/domains/traces/components/span-payload/span-output-renderers.cjs.js

@@ -6,12 +6,12 @@ const jsxRuntime = require('react/jsx-runtime');
 const observability = require('@mastra/core/observability');
 const domains_traces_components_spanPayload_spanPayloadAttachment = require('./span-payload-attachment.cjs.js');
 const domains_traces_components_spanPayload_spanPayloadJson = require('./span-payload-json.cjs.js');
-const domains_traces_components_spanPayload_spanPayloadTool = require('../../../../span-payload-primitives-DknOcv6v.cjs');
+const domains_traces_components_spanPayload_spanPayloadTool = require('../../../../span-payload-primitives-DnRsP93D.cjs');
 const domains_traces_components_spanPayload_spanPayloadRegistry = require('./span-payload-registry.cjs.js');
 const domains_chat_messages_reasoning = require('../../../chat/messages/reasoning.cjs.js');
-const Card = require('../../../../Card-DC9rlxXj.cjs');
-const dataKeysAndValues = require('../../../../data-keys-and-values-CPUfobZS.cjs');
-const Notice = require('../../../../Notice-Cq7m_mxe.cjs');
+const Card = require('../../../../Card-D0kFp9j9.cjs');
+const dataKeysAndValues = require('../../../../data-keys-and-values-4pYpSbqS.cjs');
+const Notice = require('../../../../Notice-Cjti0e0j.cjs');
 
 const hasItems = (value) => Array.isArray(value) && value.length > 0;
 function SpanTextRenderer({ value }) {
@@ -38,7 +38,7 @@ function SpanAgentRunResultRenderer({ value }) {
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-slot": "span-agent-run-result", className: "flex flex-col gap-3", children: [
     value.tripwire && /* @__PURE__ */ jsxRuntime.jsxs(Notice.Notice, { variant: "destructive", title: "Tripwire", children: [
       value.tripwire.reason && /* @__PURE__ */ jsxRuntime.jsx(Notice.Notice.Message, { children: value.tripwire.reason }),
-      value.tripwire.processorId && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-ui-sm", children: [
+      value.tripwire.processorId && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-caption", children: [
         "Processor ",
         /* @__PURE__ */ jsxRuntime.jsx("code", { className: "font-mono", children: value.tripwire.processorId })
       ] })
@@ -81,16 +81,7 @@ function SpanOutputRenderer({ 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_OUTPUT_RENDERERS, description);
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    Card.Card,
-    {
-      "data-slot": "span-output-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 }) })
-    }
-  );
+  return /* @__PURE__ */ jsxRuntime.jsx(Card.Card, { "data-slot": "span-output-card", className: "min-w-0", children: /* @__PURE__ */ jsxRuntime.jsx(Card.CardContent, { children: /* @__PURE__ */ jsxRuntime.jsx(Renderer, { value: description.value }) }) });
 }
 
 exports.SpanOutputRenderer = SpanOutputRenderer;

package/dist/domains/traces/components/span-payload/span-output-renderers.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"span-output-renderers.cjs.js","sources":["../../../../../src/domains/traces/components/span-payload/span-output-renderers.tsx"],"sourcesContent":["import { describeSpanOutput } from '@mastra/core/observability';\nimport type {\n  AgentRunResult,\n  InterruptedSpanOutput,\n  ModelGenerationResult,\n  ModelStepResult,\n  SpanOutputDescription,\n} from '@mastra/core/observability';\nimport type { SpanRecord } from '../../types';\nimport { SpanPayloadAttachment } from './span-payload-attachment';\nimport { SpanPayloadJson } from './span-payload-json';\nimport {\n  SpanPayloadCollapsible,\n  SpanPayloadField,\n  SpanPayloadMarkdown,\n  SpanPayloadToolCalls,\n} from './span-payload-primitives';\nimport { asCoreSpan, pickRenderer } from './span-payload-registry';\nimport type { PayloadRegistry } from './span-payload-registry';\nimport { Reasoning } from '@/domains/chat/messages/reasoning';\nimport { Card, CardContent } from '@/ds/components/Card';\nimport { DataKeysAndValues } from '@/ds/components/DataKeysAndValues';\nimport { Notice } from '@/ds/components/Notice';\n\nconst hasItems = (value: unknown): value is unknown[] => Array.isArray(value) && value.length > 0;\n\nfunction SpanTextRenderer({ value }: { value: string }) {\n  return <SpanPayloadMarkdown>{value}</SpanPayloadMarkdown>;\n}\n\nfunction SpanInterruptedRenderer({ value }: { value: InterruptedSpanOutput }) {\n  const title = value.status === 'suspended' ? 'Suspended' : 'Aborted';\n  const hasTarget = value.toolName !== undefined || value.toolCallId !== undefined;\n  return (\n    <div data-slot=\"span-interrupted\" data-status={value.status} className=\"flex flex-col gap-3\">\n      <Notice variant=\"warning\" title={title}>\n        {value.reason && <Notice.Message>{value.reason}</Notice.Message>}\n      </Notice>\n      {hasTarget && (\n        <DataKeysAndValues>\n          {value.toolName !== undefined && (\n            <>\n              <DataKeysAndValues.Key>Tool</DataKeysAndValues.Key>\n              <DataKeysAndValues.Value>{value.toolName}</DataKeysAndValues.Value>\n            </>\n          )}\n          {value.toolCallId !== undefined && (\n            <>\n              <DataKeysAndValues.Key>Tool call id</DataKeysAndValues.Key>\n              <DataKeysAndValues.ValueWithCopyBtn copyValue={value.toolCallId}>\n                {value.toolCallId}\n              </DataKeysAndValues.ValueWithCopyBtn>\n            </>\n          )}\n        </DataKeysAndValues>\n      )}\n    </div>\n  );\n}\n\nfunction SpanAgentRunResultRenderer({ value }: { value: AgentRunResult }) {\n  return (\n    <div data-slot=\"span-agent-run-result\" className=\"flex flex-col gap-3\">\n      {value.tripwire && (\n        <Notice variant=\"destructive\" title=\"Tripwire\">\n          {value.tripwire.reason && <Notice.Message>{value.tripwire.reason}</Notice.Message>}\n          {value.tripwire.processorId && (\n            <div className=\"text-ui-sm\">\n              Processor <code className=\"font-mono\">{value.tripwire.processorId}</code>\n            </div>\n          )}\n        </Notice>\n      )}\n      {typeof value.text === 'string' && value.text.length > 0 && (\n        <SpanPayloadMarkdown>{value.text}</SpanPayloadMarkdown>\n      )}\n      {value.object !== undefined && (\n        <SpanPayloadField label=\"Object\">\n          <SpanPayloadJson value={value.object} />\n        </SpanPayloadField>\n      )}\n      {hasItems(value.files) && (\n        <SpanPayloadCollapsible label={`Files (${value.files.length})`}>\n          {value.files.map((file, index) => (\n            <SpanPayloadAttachment key={index} value={file} />\n          ))}\n        </SpanPayloadCollapsible>\n      )}\n    </div>\n  );\n}\n\nfunction SpanModelGenerationResultRenderer({ value }: { value: ModelGenerationResult }) {\n  return (\n    <div data-slot=\"span-model-generation-result\" className=\"flex flex-col gap-3\">\n      {typeof value.text === 'string' && value.text.length > 0 && (\n        <SpanPayloadMarkdown>{value.text}</SpanPayloadMarkdown>\n      )}\n      {typeof value.reasoningText === 'string' && <Reasoning text={value.reasoningText} />}\n      {value.reasoning !== undefined && (\n        <SpanPayloadCollapsible label=\"Reasoning details\">\n          <SpanPayloadJson value={value.reasoning} />\n        </SpanPayloadCollapsible>\n      )}\n      {value.object !== undefined && (\n        <SpanPayloadField label=\"Object\">\n          <SpanPayloadJson value={value.object} />\n        </SpanPayloadField>\n      )}\n      {hasItems(value.toolCalls) && (\n        <SpanPayloadField label={`Tool calls (${value.toolCalls.length})`}>\n          <SpanPayloadToolCalls toolCalls={value.toolCalls} />\n        </SpanPayloadField>\n      )}\n      {hasItems(value.sources) && (\n        <SpanPayloadCollapsible label={`Sources (${value.sources.length})`}>\n          <SpanPayloadJson value={value.sources} />\n        </SpanPayloadCollapsible>\n      )}\n      {hasItems(value.files) && (\n        <SpanPayloadCollapsible label={`Files (${value.files.length})`}>\n          {value.files.map((file, index) => (\n            <SpanPayloadAttachment key={index} value={file} />\n          ))}\n        </SpanPayloadCollapsible>\n      )}\n      {hasItems(value.warnings) && (\n        <SpanPayloadCollapsible label={`Warnings (${value.warnings.length})`}>\n          <SpanPayloadJson value={value.warnings} />\n        </SpanPayloadCollapsible>\n      )}\n    </div>\n  );\n}\n\nfunction SpanModelStepResultRenderer({ value }: { value: ModelStepResult }) {\n  return (\n    <div data-slot=\"span-model-step-result\" className=\"flex flex-col gap-3\">\n      {typeof value.text === 'string' && value.text.length > 0 && (\n        <SpanPayloadMarkdown>{value.text}</SpanPayloadMarkdown>\n      )}\n      {hasItems(value.toolCalls) && (\n        <SpanPayloadField label={`Tool calls (${value.toolCalls.length})`}>\n          <SpanPayloadToolCalls toolCalls={value.toolCalls} />\n        </SpanPayloadField>\n      )}\n      {value.object !== undefined && (\n        <SpanPayloadField label=\"Object\">\n          <SpanPayloadJson value={value.object} />\n        </SpanPayloadField>\n      )}\n      {hasItems(value.steps) && (\n        <SpanPayloadCollapsible label={`Steps (${value.steps.length})`}>\n          <SpanPayloadJson value={value.steps} />\n        </SpanPayloadCollapsible>\n      )}\n    </div>\n  );\n}\n\n/** One renderer per `describeSpanOutput` tag; see `SPAN_INPUT_RENDERERS`. */\nconst SPAN_OUTPUT_RENDERERS = {\n  interrupted: SpanInterruptedRenderer,\n  'agent-run-result': SpanAgentRunResultRenderer,\n  'model-generation-result': SpanModelGenerationResultRenderer,\n  'model-step-result': SpanModelStepResultRenderer,\n  text: SpanTextRenderer,\n  json: SpanPayloadJson,\n} satisfies PayloadRegistry<SpanOutputDescription>;\n\nexport interface SpanOutputRendererProps {\n  span: SpanRecord;\n}\n\n/** Renders a span's output through the registry; `null` when the span recorded none. */\nexport function SpanOutputRenderer({ span }: SpanOutputRendererProps) {\n  const description = describeSpanOutput(asCoreSpan(span));\n  if (!description) return null;\n  if (description.type === 'json') return <SpanPayloadJson value={description.value} />;\n  const Renderer = pickRenderer(SPAN_OUTPUT_RENDERERS, description);\n  return (\n    <Card\n      data-slot=\"span-output-card\"\n      appearance=\"surface\"\n      elevation=\"raised\"\n      className=\"border-border1 min-w-0 border\"\n    >\n      <CardContent>\n        <Renderer value={description.value} />\n      </CardContent>\n    </Card>\n  );\n}\n"],"names":["jsx","SpanPayloadMarkdown","jsxs","Notice","DataKeysAndValues","Fragment","SpanPayloadField","SpanPayloadJson","SpanPayloadCollapsible","SpanPayloadAttachment","Reasoning","SpanPayloadToolCalls","describeSpanOutput","asCoreSpan","pickRenderer","Card","CardContent"],"mappings":"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"}
+{"version":3,"file":"span-output-renderers.cjs.js","sources":["../../../../../src/domains/traces/components/span-payload/span-output-renderers.tsx"],"sourcesContent":["import { describeSpanOutput } from '@mastra/core/observability';\nimport type {\n  AgentRunResult,\n  InterruptedSpanOutput,\n  ModelGenerationResult,\n  ModelStepResult,\n  SpanOutputDescription,\n} from '@mastra/core/observability';\nimport type { SpanRecord } from '../../types';\nimport { SpanPayloadAttachment } from './span-payload-attachment';\nimport { SpanPayloadJson } from './span-payload-json';\nimport {\n  SpanPayloadCollapsible,\n  SpanPayloadField,\n  SpanPayloadMarkdown,\n  SpanPayloadToolCalls,\n} from './span-payload-primitives';\nimport { asCoreSpan, pickRenderer } from './span-payload-registry';\nimport type { PayloadRegistry } from './span-payload-registry';\nimport { Reasoning } from '@/domains/chat/messages/reasoning';\nimport { Card, CardContent } from '@/ds/components/Card';\nimport { DataKeysAndValues } from '@/ds/components/DataKeysAndValues';\nimport { Notice } from '@/ds/components/Notice';\n\nconst hasItems = (value: unknown): value is unknown[] => Array.isArray(value) && value.length > 0;\n\nfunction SpanTextRenderer({ value }: { value: string }) {\n  return <SpanPayloadMarkdown>{value}</SpanPayloadMarkdown>;\n}\n\nfunction SpanInterruptedRenderer({ value }: { value: InterruptedSpanOutput }) {\n  const title = value.status === 'suspended' ? 'Suspended' : 'Aborted';\n  const hasTarget = value.toolName !== undefined || value.toolCallId !== undefined;\n  return (\n    <div data-slot=\"span-interrupted\" data-status={value.status} className=\"flex flex-col gap-3\">\n      <Notice variant=\"warning\" title={title}>\n        {value.reason && <Notice.Message>{value.reason}</Notice.Message>}\n      </Notice>\n      {hasTarget && (\n        <DataKeysAndValues>\n          {value.toolName !== undefined && (\n            <>\n              <DataKeysAndValues.Key>Tool</DataKeysAndValues.Key>\n              <DataKeysAndValues.Value>{value.toolName}</DataKeysAndValues.Value>\n            </>\n          )}\n          {value.toolCallId !== undefined && (\n            <>\n              <DataKeysAndValues.Key>Tool call id</DataKeysAndValues.Key>\n              <DataKeysAndValues.ValueWithCopyBtn copyValue={value.toolCallId}>\n                {value.toolCallId}\n              </DataKeysAndValues.ValueWithCopyBtn>\n            </>\n          )}\n        </DataKeysAndValues>\n      )}\n    </div>\n  );\n}\n\nfunction SpanAgentRunResultRenderer({ value }: { value: AgentRunResult }) {\n  return (\n    <div data-slot=\"span-agent-run-result\" className=\"flex flex-col gap-3\">\n      {value.tripwire && (\n        <Notice variant=\"destructive\" title=\"Tripwire\">\n          {value.tripwire.reason && <Notice.Message>{value.tripwire.reason}</Notice.Message>}\n          {value.tripwire.processorId && (\n            <div className=\"text-caption\">\n              Processor <code className=\"font-mono\">{value.tripwire.processorId}</code>\n            </div>\n          )}\n        </Notice>\n      )}\n      {typeof value.text === 'string' && value.text.length > 0 && (\n        <SpanPayloadMarkdown>{value.text}</SpanPayloadMarkdown>\n      )}\n      {value.object !== undefined && (\n        <SpanPayloadField label=\"Object\">\n          <SpanPayloadJson value={value.object} />\n        </SpanPayloadField>\n      )}\n      {hasItems(value.files) && (\n        <SpanPayloadCollapsible label={`Files (${value.files.length})`}>\n          {value.files.map((file, index) => (\n            <SpanPayloadAttachment key={index} value={file} />\n          ))}\n        </SpanPayloadCollapsible>\n      )}\n    </div>\n  );\n}\n\nfunction SpanModelGenerationResultRenderer({ value }: { value: ModelGenerationResult }) {\n  return (\n    <div data-slot=\"span-model-generation-result\" className=\"flex flex-col gap-3\">\n      {typeof value.text === 'string' && value.text.length > 0 && (\n        <SpanPayloadMarkdown>{value.text}</SpanPayloadMarkdown>\n      )}\n      {typeof value.reasoningText === 'string' && <Reasoning text={value.reasoningText} />}\n      {value.reasoning !== undefined && (\n        <SpanPayloadCollapsible label=\"Reasoning details\">\n          <SpanPayloadJson value={value.reasoning} />\n        </SpanPayloadCollapsible>\n      )}\n      {value.object !== undefined && (\n        <SpanPayloadField label=\"Object\">\n          <SpanPayloadJson value={value.object} />\n        </SpanPayloadField>\n      )}\n      {hasItems(value.toolCalls) && (\n        <SpanPayloadField label={`Tool calls (${value.toolCalls.length})`}>\n          <SpanPayloadToolCalls toolCalls={value.toolCalls} />\n        </SpanPayloadField>\n      )}\n      {hasItems(value.sources) && (\n        <SpanPayloadCollapsible label={`Sources (${value.sources.length})`}>\n          <SpanPayloadJson value={value.sources} />\n        </SpanPayloadCollapsible>\n      )}\n      {hasItems(value.files) && (\n        <SpanPayloadCollapsible label={`Files (${value.files.length})`}>\n          {value.files.map((file, index) => (\n            <SpanPayloadAttachment key={index} value={file} />\n          ))}\n        </SpanPayloadCollapsible>\n      )}\n      {hasItems(value.warnings) && (\n        <SpanPayloadCollapsible label={`Warnings (${value.warnings.length})`}>\n          <SpanPayloadJson value={value.warnings} />\n        </SpanPayloadCollapsible>\n      )}\n    </div>\n  );\n}\n\nfunction SpanModelStepResultRenderer({ value }: { value: ModelStepResult }) {\n  return (\n    <div data-slot=\"span-model-step-result\" className=\"flex flex-col gap-3\">\n      {typeof value.text === 'string' && value.text.length > 0 && (\n        <SpanPayloadMarkdown>{value.text}</SpanPayloadMarkdown>\n      )}\n      {hasItems(value.toolCalls) && (\n        <SpanPayloadField label={`Tool calls (${value.toolCalls.length})`}>\n          <SpanPayloadToolCalls toolCalls={value.toolCalls} />\n        </SpanPayloadField>\n      )}\n      {value.object !== undefined && (\n        <SpanPayloadField label=\"Object\">\n          <SpanPayloadJson value={value.object} />\n        </SpanPayloadField>\n      )}\n      {hasItems(value.steps) && (\n        <SpanPayloadCollapsible label={`Steps (${value.steps.length})`}>\n          <SpanPayloadJson value={value.steps} />\n        </SpanPayloadCollapsible>\n      )}\n    </div>\n  );\n}\n\n/** One renderer per `describeSpanOutput` tag; see `SPAN_INPUT_RENDERERS`. */\nconst SPAN_OUTPUT_RENDERERS = {\n  interrupted: SpanInterruptedRenderer,\n  'agent-run-result': SpanAgentRunResultRenderer,\n  'model-generation-result': SpanModelGenerationResultRenderer,\n  'model-step-result': SpanModelStepResultRenderer,\n  text: SpanTextRenderer,\n  json: SpanPayloadJson,\n} satisfies PayloadRegistry<SpanOutputDescription>;\n\nexport interface SpanOutputRendererProps {\n  span: SpanRecord;\n}\n\n/** Renders a span's output through the registry; `null` when the span recorded none. */\nexport function SpanOutputRenderer({ span }: SpanOutputRendererProps) {\n  const description = describeSpanOutput(asCoreSpan(span));\n  if (!description) return null;\n  if (description.type === 'json') return <SpanPayloadJson value={description.value} />;\n  const Renderer = pickRenderer(SPAN_OUTPUT_RENDERERS, description);\n  return (\n    <Card data-slot=\"span-output-card\" className=\"min-w-0\">\n      <CardContent>\n        <Renderer value={description.value} />\n      </CardContent>\n    </Card>\n  );\n}\n"],"names":["jsx","SpanPayloadMarkdown","jsxs","Notice","DataKeysAndValues","Fragment","SpanPayloadField","SpanPayloadJson","SpanPayloadCollapsible","SpanPayloadAttachment","Reasoning","SpanPayloadToolCalls","describeSpanOutput","asCoreSpan","pickRenderer","Card","CardContent"],"mappings":"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"}

package/dist/domains/traces/components/span-payload/span-output-renderers.es.js

@@ -2,12 +2,12 @@ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { describeSpanOutput } from '@mastra/core/observability';
 import { SpanPayloadAttachment } from './span-payload-attachment.es.js';
 import { SpanPayloadJson } from './span-payload-json.es.js';
-import { a as SpanPayloadMarkdown, S as SpanPayloadField, b as SpanPayloadToolCalls, c as SpanPayloadCollapsible } from '../../../../span-payload-primitives-_TUMqise.js';
+import { a as SpanPayloadMarkdown, S as SpanPayloadField, b as SpanPayloadToolCalls, c as SpanPayloadCollapsible } from '../../../../span-payload-primitives-sbxk4CHC.js';
 import { asCoreSpan, pickRenderer } from './span-payload-registry.es.js';
 import { Reasoning } from '../../../chat/messages/reasoning.es.js';
-import { C as Card, a as CardContent } from '../../../../Card-CnxuKKaz.js';
-import { D as DataKeysAndValues } from '../../../../data-keys-and-values-BxSKCdWQ.js';
-import { N as Notice } from '../../../../Notice-DEqr19sI.js';
+import { C as Card, a as CardContent } from '../../../../Card-DEvGFj-Z.js';
+import { D as DataKeysAndValues } from '../../../../data-keys-and-values-j0NVKPOl.js';
+import { N as Notice } from '../../../../Notice-Ah-84yi6.js';
 
 const hasItems = (value) => Array.isArray(value) && value.length > 0;
 function SpanTextRenderer({ value }) {
@@ -34,7 +34,7 @@ function SpanAgentRunResultRenderer({ value }) {
   return /* @__PURE__ */ jsxs("div", { "data-slot": "span-agent-run-result", className: "flex flex-col gap-3", children: [
     value.tripwire && /* @__PURE__ */ jsxs(Notice, { variant: "destructive", title: "Tripwire", children: [
       value.tripwire.reason && /* @__PURE__ */ jsx(Notice.Message, { children: value.tripwire.reason }),
-      value.tripwire.processorId && /* @__PURE__ */ jsxs("div", { className: "text-ui-sm", children: [
+      value.tripwire.processorId && /* @__PURE__ */ jsxs("div", { className: "text-caption", children: [
         "Processor ",
         /* @__PURE__ */ jsx("code", { className: "font-mono", children: value.tripwire.processorId })
       ] })
@@ -77,16 +77,7 @@ function SpanOutputRenderer({ span }) {
   if (!description) return null;
   if (description.type === "json") return /* @__PURE__ */ jsx(SpanPayloadJson, { value: description.value });
   const Renderer = pickRenderer(SPAN_OUTPUT_RENDERERS, description);
-  return /* @__PURE__ */ jsx(
-    Card,
-    {
-      "data-slot": "span-output-card",
-      appearance: "surface",
-      elevation: "raised",
-      className: "border-border1 min-w-0 border",
-      children: /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx(Renderer, { value: description.value }) })
-    }
-  );
+  return /* @__PURE__ */ jsx(Card, { "data-slot": "span-output-card", className: "min-w-0", children: /* @__PURE__ */ jsx(CardContent, { children: /* @__PURE__ */ jsx(Renderer, { value: description.value }) }) });
 }
 
 export { SpanOutputRenderer };

package/dist/domains/traces/components/span-payload/span-output-renderers.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"span-output-renderers.es.js","sources":["../../../../../src/domains/traces/components/span-payload/span-output-renderers.tsx"],"sourcesContent":["import { describeSpanOutput } from '@mastra/core/observability';\nimport type {\n  AgentRunResult,\n  InterruptedSpanOutput,\n  ModelGenerationResult,\n  ModelStepResult,\n  SpanOutputDescription,\n} from '@mastra/core/observability';\nimport type { SpanRecord } from '../../types';\nimport { SpanPayloadAttachment } from './span-payload-attachment';\nimport { SpanPayloadJson } from './span-payload-json';\nimport {\n  SpanPayloadCollapsible,\n  SpanPayloadField,\n  SpanPayloadMarkdown,\n  SpanPayloadToolCalls,\n} from './span-payload-primitives';\nimport { asCoreSpan, pickRenderer } from './span-payload-registry';\nimport type { PayloadRegistry } from './span-payload-registry';\nimport { Reasoning } from '@/domains/chat/messages/reasoning';\nimport { Card, CardContent } from '@/ds/components/Card';\nimport { DataKeysAndValues } from '@/ds/components/DataKeysAndValues';\nimport { Notice } from '@/ds/components/Notice';\n\nconst hasItems = (value: unknown): value is unknown[] => Array.isArray(value) && value.length > 0;\n\nfunction SpanTextRenderer({ value }: { value: string }) {\n  return <SpanPayloadMarkdown>{value}</SpanPayloadMarkdown>;\n}\n\nfunction SpanInterruptedRenderer({ value }: { value: InterruptedSpanOutput }) {\n  const title = value.status === 'suspended' ? 'Suspended' : 'Aborted';\n  const hasTarget = value.toolName !== undefined || value.toolCallId !== undefined;\n  return (\n    <div data-slot=\"span-interrupted\" data-status={value.status} className=\"flex flex-col gap-3\">\n      <Notice variant=\"warning\" title={title}>\n        {value.reason && <Notice.Message>{value.reason}</Notice.Message>}\n      </Notice>\n      {hasTarget && (\n        <DataKeysAndValues>\n          {value.toolName !== undefined && (\n            <>\n              <DataKeysAndValues.Key>Tool</DataKeysAndValues.Key>\n              <DataKeysAndValues.Value>{value.toolName}</DataKeysAndValues.Value>\n            </>\n          )}\n          {value.toolCallId !== undefined && (\n            <>\n              <DataKeysAndValues.Key>Tool call id</DataKeysAndValues.Key>\n              <DataKeysAndValues.ValueWithCopyBtn copyValue={value.toolCallId}>\n                {value.toolCallId}\n              </DataKeysAndValues.ValueWithCopyBtn>\n            </>\n          )}\n        </DataKeysAndValues>\n      )}\n    </div>\n  );\n}\n\nfunction SpanAgentRunResultRenderer({ value }: { value: AgentRunResult }) {\n  return (\n    <div data-slot=\"span-agent-run-result\" className=\"flex flex-col gap-3\">\n      {value.tripwire && (\n        <Notice variant=\"destructive\" title=\"Tripwire\">\n          {value.tripwire.reason && <Notice.Message>{value.tripwire.reason}</Notice.Message>}\n          {value.tripwire.processorId && (\n            <div className=\"text-ui-sm\">\n              Processor <code className=\"font-mono\">{value.tripwire.processorId}</code>\n            </div>\n          )}\n        </Notice>\n      )}\n      {typeof value.text === 'string' && value.text.length > 0 && (\n        <SpanPayloadMarkdown>{value.text}</SpanPayloadMarkdown>\n      )}\n      {value.object !== undefined && (\n        <SpanPayloadField label=\"Object\">\n          <SpanPayloadJson value={value.object} />\n        </SpanPayloadField>\n      )}\n      {hasItems(value.files) && (\n        <SpanPayloadCollapsible label={`Files (${value.files.length})`}>\n          {value.files.map((file, index) => (\n            <SpanPayloadAttachment key={index} value={file} />\n          ))}\n        </SpanPayloadCollapsible>\n      )}\n    </div>\n  );\n}\n\nfunction SpanModelGenerationResultRenderer({ value }: { value: ModelGenerationResult }) {\n  return (\n    <div data-slot=\"span-model-generation-result\" className=\"flex flex-col gap-3\">\n      {typeof value.text === 'string' && value.text.length > 0 && (\n        <SpanPayloadMarkdown>{value.text}</SpanPayloadMarkdown>\n      )}\n      {typeof value.reasoningText === 'string' && <Reasoning text={value.reasoningText} />}\n      {value.reasoning !== undefined && (\n        <SpanPayloadCollapsible label=\"Reasoning details\">\n          <SpanPayloadJson value={value.reasoning} />\n        </SpanPayloadCollapsible>\n      )}\n      {value.object !== undefined && (\n        <SpanPayloadField label=\"Object\">\n          <SpanPayloadJson value={value.object} />\n        </SpanPayloadField>\n      )}\n      {hasItems(value.toolCalls) && (\n        <SpanPayloadField label={`Tool calls (${value.toolCalls.length})`}>\n          <SpanPayloadToolCalls toolCalls={value.toolCalls} />\n        </SpanPayloadField>\n      )}\n      {hasItems(value.sources) && (\n        <SpanPayloadCollapsible label={`Sources (${value.sources.length})`}>\n          <SpanPayloadJson value={value.sources} />\n        </SpanPayloadCollapsible>\n      )}\n      {hasItems(value.files) && (\n        <SpanPayloadCollapsible label={`Files (${value.files.length})`}>\n          {value.files.map((file, index) => (\n            <SpanPayloadAttachment key={index} value={file} />\n          ))}\n        </SpanPayloadCollapsible>\n      )}\n      {hasItems(value.warnings) && (\n        <SpanPayloadCollapsible label={`Warnings (${value.warnings.length})`}>\n          <SpanPayloadJson value={value.warnings} />\n        </SpanPayloadCollapsible>\n      )}\n    </div>\n  );\n}\n\nfunction SpanModelStepResultRenderer({ value }: { value: ModelStepResult }) {\n  return (\n    <div data-slot=\"span-model-step-result\" className=\"flex flex-col gap-3\">\n      {typeof value.text === 'string' && value.text.length > 0 && (\n        <SpanPayloadMarkdown>{value.text}</SpanPayloadMarkdown>\n      )}\n      {hasItems(value.toolCalls) && (\n        <SpanPayloadField label={`Tool calls (${value.toolCalls.length})`}>\n          <SpanPayloadToolCalls toolCalls={value.toolCalls} />\n        </SpanPayloadField>\n      )}\n      {value.object !== undefined && (\n        <SpanPayloadField label=\"Object\">\n          <SpanPayloadJson value={value.object} />\n        </SpanPayloadField>\n      )}\n      {hasItems(value.steps) && (\n        <SpanPayloadCollapsible label={`Steps (${value.steps.length})`}>\n          <SpanPayloadJson value={value.steps} />\n        </SpanPayloadCollapsible>\n      )}\n    </div>\n  );\n}\n\n/** One renderer per `describeSpanOutput` tag; see `SPAN_INPUT_RENDERERS`. */\nconst SPAN_OUTPUT_RENDERERS = {\n  interrupted: SpanInterruptedRenderer,\n  'agent-run-result': SpanAgentRunResultRenderer,\n  'model-generation-result': SpanModelGenerationResultRenderer,\n  'model-step-result': SpanModelStepResultRenderer,\n  text: SpanTextRenderer,\n  json: SpanPayloadJson,\n} satisfies PayloadRegistry<SpanOutputDescription>;\n\nexport interface SpanOutputRendererProps {\n  span: SpanRecord;\n}\n\n/** Renders a span's output through the registry; `null` when the span recorded none. */\nexport function SpanOutputRenderer({ span }: SpanOutputRendererProps) {\n  const description = describeSpanOutput(asCoreSpan(span));\n  if (!description) return null;\n  if (description.type === 'json') return <SpanPayloadJson value={description.value} />;\n  const Renderer = pickRenderer(SPAN_OUTPUT_RENDERERS, description);\n  return (\n    <Card\n      data-slot=\"span-output-card\"\n      appearance=\"surface\"\n      elevation=\"raised\"\n      className=\"border-border1 min-w-0 border\"\n    >\n      <CardContent>\n        <Renderer value={description.value} />\n      </CardContent>\n    </Card>\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"span-output-renderers.es.js","sources":["../../../../../src/domains/traces/components/span-payload/span-output-renderers.tsx"],"sourcesContent":["import { describeSpanOutput } from '@mastra/core/observability';\nimport type {\n  AgentRunResult,\n  InterruptedSpanOutput,\n  ModelGenerationResult,\n  ModelStepResult,\n  SpanOutputDescription,\n} from '@mastra/core/observability';\nimport type { SpanRecord } from '../../types';\nimport { SpanPayloadAttachment } from './span-payload-attachment';\nimport { SpanPayloadJson } from './span-payload-json';\nimport {\n  SpanPayloadCollapsible,\n  SpanPayloadField,\n  SpanPayloadMarkdown,\n  SpanPayloadToolCalls,\n} from './span-payload-primitives';\nimport { asCoreSpan, pickRenderer } from './span-payload-registry';\nimport type { PayloadRegistry } from './span-payload-registry';\nimport { Reasoning } from '@/domains/chat/messages/reasoning';\nimport { Card, CardContent } from '@/ds/components/Card';\nimport { DataKeysAndValues } from '@/ds/components/DataKeysAndValues';\nimport { Notice } from '@/ds/components/Notice';\n\nconst hasItems = (value: unknown): value is unknown[] => Array.isArray(value) && value.length > 0;\n\nfunction SpanTextRenderer({ value }: { value: string }) {\n  return <SpanPayloadMarkdown>{value}</SpanPayloadMarkdown>;\n}\n\nfunction SpanInterruptedRenderer({ value }: { value: InterruptedSpanOutput }) {\n  const title = value.status === 'suspended' ? 'Suspended' : 'Aborted';\n  const hasTarget = value.toolName !== undefined || value.toolCallId !== undefined;\n  return (\n    <div data-slot=\"span-interrupted\" data-status={value.status} className=\"flex flex-col gap-3\">\n      <Notice variant=\"warning\" title={title}>\n        {value.reason && <Notice.Message>{value.reason}</Notice.Message>}\n      </Notice>\n      {hasTarget && (\n        <DataKeysAndValues>\n          {value.toolName !== undefined && (\n            <>\n              <DataKeysAndValues.Key>Tool</DataKeysAndValues.Key>\n              <DataKeysAndValues.Value>{value.toolName}</DataKeysAndValues.Value>\n            </>\n          )}\n          {value.toolCallId !== undefined && (\n            <>\n              <DataKeysAndValues.Key>Tool call id</DataKeysAndValues.Key>\n              <DataKeysAndValues.ValueWithCopyBtn copyValue={value.toolCallId}>\n                {value.toolCallId}\n              </DataKeysAndValues.ValueWithCopyBtn>\n            </>\n          )}\n        </DataKeysAndValues>\n      )}\n    </div>\n  );\n}\n\nfunction SpanAgentRunResultRenderer({ value }: { value: AgentRunResult }) {\n  return (\n    <div data-slot=\"span-agent-run-result\" className=\"flex flex-col gap-3\">\n      {value.tripwire && (\n        <Notice variant=\"destructive\" title=\"Tripwire\">\n          {value.tripwire.reason && <Notice.Message>{value.tripwire.reason}</Notice.Message>}\n          {value.tripwire.processorId && (\n            <div className=\"text-caption\">\n              Processor <code className=\"font-mono\">{value.tripwire.processorId}</code>\n            </div>\n          )}\n        </Notice>\n      )}\n      {typeof value.text === 'string' && value.text.length > 0 && (\n        <SpanPayloadMarkdown>{value.text}</SpanPayloadMarkdown>\n      )}\n      {value.object !== undefined && (\n        <SpanPayloadField label=\"Object\">\n          <SpanPayloadJson value={value.object} />\n        </SpanPayloadField>\n      )}\n      {hasItems(value.files) && (\n        <SpanPayloadCollapsible label={`Files (${value.files.length})`}>\n          {value.files.map((file, index) => (\n            <SpanPayloadAttachment key={index} value={file} />\n          ))}\n        </SpanPayloadCollapsible>\n      )}\n    </div>\n  );\n}\n\nfunction SpanModelGenerationResultRenderer({ value }: { value: ModelGenerationResult }) {\n  return (\n    <div data-slot=\"span-model-generation-result\" className=\"flex flex-col gap-3\">\n      {typeof value.text === 'string' && value.text.length > 0 && (\n        <SpanPayloadMarkdown>{value.text}</SpanPayloadMarkdown>\n      )}\n      {typeof value.reasoningText === 'string' && <Reasoning text={value.reasoningText} />}\n      {value.reasoning !== undefined && (\n        <SpanPayloadCollapsible label=\"Reasoning details\">\n          <SpanPayloadJson value={value.reasoning} />\n        </SpanPayloadCollapsible>\n      )}\n      {value.object !== undefined && (\n        <SpanPayloadField label=\"Object\">\n          <SpanPayloadJson value={value.object} />\n        </SpanPayloadField>\n      )}\n      {hasItems(value.toolCalls) && (\n        <SpanPayloadField label={`Tool calls (${value.toolCalls.length})`}>\n          <SpanPayloadToolCalls toolCalls={value.toolCalls} />\n        </SpanPayloadField>\n      )}\n      {hasItems(value.sources) && (\n        <SpanPayloadCollapsible label={`Sources (${value.sources.length})`}>\n          <SpanPayloadJson value={value.sources} />\n        </SpanPayloadCollapsible>\n      )}\n      {hasItems(value.files) && (\n        <SpanPayloadCollapsible label={`Files (${value.files.length})`}>\n          {value.files.map((file, index) => (\n            <SpanPayloadAttachment key={index} value={file} />\n          ))}\n        </SpanPayloadCollapsible>\n      )}\n      {hasItems(value.warnings) && (\n        <SpanPayloadCollapsible label={`Warnings (${value.warnings.length})`}>\n          <SpanPayloadJson value={value.warnings} />\n        </SpanPayloadCollapsible>\n      )}\n    </div>\n  );\n}\n\nfunction SpanModelStepResultRenderer({ value }: { value: ModelStepResult }) {\n  return (\n    <div data-slot=\"span-model-step-result\" className=\"flex flex-col gap-3\">\n      {typeof value.text === 'string' && value.text.length > 0 && (\n        <SpanPayloadMarkdown>{value.text}</SpanPayloadMarkdown>\n      )}\n      {hasItems(value.toolCalls) && (\n        <SpanPayloadField label={`Tool calls (${value.toolCalls.length})`}>\n          <SpanPayloadToolCalls toolCalls={value.toolCalls} />\n        </SpanPayloadField>\n      )}\n      {value.object !== undefined && (\n        <SpanPayloadField label=\"Object\">\n          <SpanPayloadJson value={value.object} />\n        </SpanPayloadField>\n      )}\n      {hasItems(value.steps) && (\n        <SpanPayloadCollapsible label={`Steps (${value.steps.length})`}>\n          <SpanPayloadJson value={value.steps} />\n        </SpanPayloadCollapsible>\n      )}\n    </div>\n  );\n}\n\n/** One renderer per `describeSpanOutput` tag; see `SPAN_INPUT_RENDERERS`. */\nconst SPAN_OUTPUT_RENDERERS = {\n  interrupted: SpanInterruptedRenderer,\n  'agent-run-result': SpanAgentRunResultRenderer,\n  'model-generation-result': SpanModelGenerationResultRenderer,\n  'model-step-result': SpanModelStepResultRenderer,\n  text: SpanTextRenderer,\n  json: SpanPayloadJson,\n} satisfies PayloadRegistry<SpanOutputDescription>;\n\nexport interface SpanOutputRendererProps {\n  span: SpanRecord;\n}\n\n/** Renders a span's output through the registry; `null` when the span recorded none. */\nexport function SpanOutputRenderer({ span }: SpanOutputRendererProps) {\n  const description = describeSpanOutput(asCoreSpan(span));\n  if (!description) return null;\n  if (description.type === 'json') return <SpanPayloadJson value={description.value} />;\n  const Renderer = pickRenderer(SPAN_OUTPUT_RENDERERS, description);\n  return (\n    <Card data-slot=\"span-output-card\" className=\"min-w-0\">\n      <CardContent>\n        <Renderer value={description.value} />\n      </CardContent>\n    </Card>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/domains/traces/components/span-payload/span-payload-json.cjs.js

@@ -4,7 +4,8 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
 const code = require('../../../../code-DhrdtZce.cjs');
-const utils_cn = require('../../../../cn-BuHW7Wrt.cjs');
+const primitives_raisedSurface = require('../../../../primitives/raised-surface.cjs.js');
+const utils_cn = require('../../../../cn-DG0X1KEP.cjs');
 
 function SpanPayloadJson({ value, className }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
@@ -14,7 +15,8 @@ function SpanPayloadJson({ value, className }) {
       lang: "json",
       "data-slot": "span-payload-json",
       className: utils_cn.cn(
-        "max-h-[30vh] overflow-y-auto rounded-lg border border-border1 bg-surface3 p-3 font-mono text-ui-sm text-wrap break-all text-neutral4 ",
+        primitives_raisedSurface.raisedSurfaceStyle,
+        "max-h-[30vh] overflow-y-auto rounded-lg p-3 font-mono text-caption text-wrap break-all text-muted-foreground",
         className
       )
     }

package/dist/domains/traces/components/span-payload/span-payload-json.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"span-payload-json.cjs.js","sources":["../../../../../src/domains/traces/components/span-payload/span-payload-json.tsx"],"sourcesContent":["import { Code } from '@/ds/components/Code/code';\nimport { cn } from '@/lib/utils';\n\nexport interface SpanPayloadJsonProps {\n  value: unknown;\n  className?: string;\n}\n\n/** Fallback renderer: pretty-printed JSON for any payload core does not describe in more detail. */\nexport function SpanPayloadJson({ value, className }: SpanPayloadJsonProps) {\n  return (\n    <Code\n      code={JSON.stringify(value ?? null, null, 2)}\n      lang=\"json\"\n      data-slot=\"span-payload-json\"\n      className={cn(\n        'max-h-[30vh] overflow-y-auto rounded-lg border border-border1 bg-surface3 p-3 font-mono text-ui-sm text-wrap break-all text-neutral4 ',\n        className,\n      )}\n    />\n  );\n}\n"],"names":["jsx","Code","cn"],"mappings":";;;;;;;;AASO,SAAS,eAAA,CAAgB,EAAE,KAAA,EAAO,SAAA,EAAU,EAAyB;AAC1E,EAAA,uBACEA,cAAA;AAAA,IAACC,SAAA;AAAA,IAAA;AAAA,MACC,MAAM,IAAA,CAAK,SAAA,CAAU,KAAA,IAAS,IAAA,EAAM,MAAM,CAAC,CAAA;AAAA,MAC3C,IAAA,EAAK,MAAA;AAAA,MACL,WAAA,EAAU,mBAAA;AAAA,MACV,SAAA,EAAWC,WAAA;AAAA,QACT,uIAAA;AAAA,QACA;AAAA;AACF;AAAA,GACF;AAEJ;;;;"}
+{"version":3,"file":"span-payload-json.cjs.js","sources":["../../../../../src/domains/traces/components/span-payload/span-payload-json.tsx"],"sourcesContent":["import { Code } from '@/ds/components/Code/code';\nimport { raisedSurfaceStyle } from '@/ds/primitives/raised-surface';\nimport { cn } from '@/lib/utils';\n\nexport interface SpanPayloadJsonProps {\n  value: unknown;\n  className?: string;\n}\n\n/** Fallback renderer: pretty-printed JSON for any payload core does not describe in more detail. */\nexport function SpanPayloadJson({ value, className }: SpanPayloadJsonProps) {\n  return (\n    <Code\n      code={JSON.stringify(value ?? null, null, 2)}\n      lang=\"json\"\n      data-slot=\"span-payload-json\"\n      className={cn(\n        raisedSurfaceStyle,\n        'max-h-[30vh] overflow-y-auto rounded-lg p-3 font-mono text-caption text-wrap break-all text-muted-foreground',\n        className,\n      )}\n    />\n  );\n}\n"],"names":["jsx","Code","cn","raisedSurfaceStyle"],"mappings":";;;;;;;;;AAUO,SAAS,eAAA,CAAgB,EAAE,KAAA,EAAO,SAAA,EAAU,EAAyB;AAC1E,EAAA,uBACEA,cAAA;AAAA,IAACC,SAAA;AAAA,IAAA;AAAA,MACC,MAAM,IAAA,CAAK,SAAA,CAAU,KAAA,IAAS,IAAA,EAAM,MAAM,CAAC,CAAA;AAAA,MAC3C,IAAA,EAAK,MAAA;AAAA,MACL,WAAA,EAAU,mBAAA;AAAA,MACV,SAAA,EAAWC,WAAA;AAAA,QACTC,2CAAA;AAAA,QACA,8GAAA;AAAA,QACA;AAAA;AACF;AAAA,GACF;AAEJ;;;;"}

package/dist/domains/traces/components/span-payload/span-payload-json.es.js

@@ -1,6 +1,7 @@
 import { jsx } from 'react/jsx-runtime';
 import { C as Code } from '../../../../code-D4Vw_fYq.js';
-import { c as cn } from '../../../../cn-C6s2yXwM.js';
+import { raisedSurfaceStyle } from '../../../../primitives/raised-surface.es.js';
+import { c as cn } from '../../../../cn-65Adrsfj.js';
 
 function SpanPayloadJson({ value, className }) {
   return /* @__PURE__ */ jsx(
@@ -10,7 +11,8 @@ function SpanPayloadJson({ value, className }) {
       lang: "json",
       "data-slot": "span-payload-json",
       className: cn(
-        "max-h-[30vh] overflow-y-auto rounded-lg border border-border1 bg-surface3 p-3 font-mono text-ui-sm text-wrap break-all text-neutral4 ",
+        raisedSurfaceStyle,
+        "max-h-[30vh] overflow-y-auto rounded-lg p-3 font-mono text-caption text-wrap break-all text-muted-foreground",
         className
       )
     }

package/dist/domains/traces/components/span-payload/span-payload-json.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"span-payload-json.es.js","sources":["../../../../../src/domains/traces/components/span-payload/span-payload-json.tsx"],"sourcesContent":["import { Code } from '@/ds/components/Code/code';\nimport { cn } from '@/lib/utils';\n\nexport interface SpanPayloadJsonProps {\n  value: unknown;\n  className?: string;\n}\n\n/** Fallback renderer: pretty-printed JSON for any payload core does not describe in more detail. */\nexport function SpanPayloadJson({ value, className }: SpanPayloadJsonProps) {\n  return (\n    <Code\n      code={JSON.stringify(value ?? null, null, 2)}\n      lang=\"json\"\n      data-slot=\"span-payload-json\"\n      className={cn(\n        'max-h-[30vh] overflow-y-auto rounded-lg border border-border1 bg-surface3 p-3 font-mono text-ui-sm text-wrap break-all text-neutral4 ',\n        className,\n      )}\n    />\n  );\n}\n"],"names":[],"mappings":";;;;AASO,SAAS,eAAA,CAAgB,EAAE,KAAA,EAAO,SAAA,EAAU,EAAyB;AAC1E,EAAA,uBACE,GAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,MAAM,IAAA,CAAK,SAAA,CAAU,KAAA,IAAS,IAAA,EAAM,MAAM,CAAC,CAAA;AAAA,MAC3C,IAAA,EAAK,MAAA;AAAA,MACL,WAAA,EAAU,mBAAA;AAAA,MACV,SAAA,EAAW,EAAA;AAAA,QACT,uIAAA;AAAA,QACA;AAAA;AACF;AAAA,GACF;AAEJ;;;;"}
+{"version":3,"file":"span-payload-json.es.js","sources":["../../../../../src/domains/traces/components/span-payload/span-payload-json.tsx"],"sourcesContent":["import { Code } from '@/ds/components/Code/code';\nimport { raisedSurfaceStyle } from '@/ds/primitives/raised-surface';\nimport { cn } from '@/lib/utils';\n\nexport interface SpanPayloadJsonProps {\n  value: unknown;\n  className?: string;\n}\n\n/** Fallback renderer: pretty-printed JSON for any payload core does not describe in more detail. */\nexport function SpanPayloadJson({ value, className }: SpanPayloadJsonProps) {\n  return (\n    <Code\n      code={JSON.stringify(value ?? null, null, 2)}\n      lang=\"json\"\n      data-slot=\"span-payload-json\"\n      className={cn(\n        raisedSurfaceStyle,\n        'max-h-[30vh] overflow-y-auto rounded-lg p-3 font-mono text-caption text-wrap break-all text-muted-foreground',\n        className,\n      )}\n    />\n  );\n}\n"],"names":[],"mappings":";;;;;AAUO,SAAS,eAAA,CAAgB,EAAE,KAAA,EAAO,SAAA,EAAU,EAAyB;AAC1E,EAAA,uBACE,GAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,MAAM,IAAA,CAAK,SAAA,CAAU,KAAA,IAAS,IAAA,EAAM,MAAM,CAAC,CAAA;AAAA,MAC3C,IAAA,EAAK,MAAA;AAAA,MACL,WAAA,EAAU,mBAAA;AAAA,MACV,SAAA,EAAW,EAAA;AAAA,QACT,kBAAA;AAAA,QACA,8GAAA;AAAA,QACA;AAAA;AACF;AAAA,GACF;AAEJ;;;;"}

package/dist/domains/traces/components/span-payload/span-payload-messages.cjs.js

@@ -5,9 +5,9 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 const jsxRuntime = require('react/jsx-runtime');
 const domains_traces_components_spanPayload_spanPayloadAttachment = require('./span-payload-attachment.cjs.js');
 const domains_traces_components_spanPayload_spanPayloadJson = require('./span-payload-json.cjs.js');
-const domains_traces_components_spanPayload_spanPayloadTool = require('../../../../span-payload-primitives-DknOcv6v.cjs');
+const domains_traces_components_spanPayload_spanPayloadTool = require('../../../../span-payload-primitives-DnRsP93D.cjs');
 const domains_chat_messages_reasoning = require('../../../chat/messages/reasoning.cjs.js');
-const message = require('../../../../message-B-28p4Zs.cjs');
+const message = require('../../../../message-CszposMZ.cjs');
 
 const isRecord = (value) => typeof value === "object" && value !== null && !Array.isArray(value);
 function MessageText({ text, plain }) {

package/dist/domains/traces/components/span-payload/span-payload-messages.es.js

@@ -1,9 +1,9 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { SpanPayloadAttachment } from './span-payload-attachment.es.js';
 import { SpanPayloadJson } from './span-payload-json.es.js';
-import { d as SpanPayloadLabel, a as SpanPayloadMarkdown, e as SpanPayloadTool } from '../../../../span-payload-primitives-_TUMqise.js';
+import { d as SpanPayloadLabel, a as SpanPayloadMarkdown, e as SpanPayloadTool } from '../../../../span-payload-primitives-sbxk4CHC.js';
 import { Reasoning } from '../../../chat/messages/reasoning.es.js';
-import { M as Message } from '../../../../message-DGZPjxsh.js';
+import { M as Message } from '../../../../message-BrwbcLPi.js';
 
 const isRecord = (value) => typeof value === "object" && value !== null && !Array.isArray(value);
 function MessageText({ text, plain }) {

package/dist/domains/traces/components/span-payload/span-payload-primitives.cjs.js

@@ -4,9 +4,9 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 require('react/jsx-runtime');
 require('lucide-react');
-const domains_traces_components_spanPayload_spanPayloadTool = require('../../../../span-payload-primitives-DknOcv6v.cjs');
-require('../../../../collapsible-C3x1n6sF.cjs');
-require('../../../../markdown-renderer-CUQHtRlL.cjs');
+const domains_traces_components_spanPayload_spanPayloadTool = require('../../../../span-payload-primitives-DnRsP93D.cjs');
+require('../../../../collapsible-BvrI6XnN.cjs');
+require('../../../../markdown-renderer-D8qYAU7K.cjs');
 
 
 

package/dist/domains/traces/components/span-payload/span-payload-primitives.es.js

@@ -1,6 +1,6 @@
 import 'react/jsx-runtime';
 import 'lucide-react';
-export { c as SpanPayloadCollapsible, S as SpanPayloadField, d as SpanPayloadLabel, a as SpanPayloadMarkdown, b as SpanPayloadToolCalls } from '../../../../span-payload-primitives-_TUMqise.js';
-import '../../../../collapsible-C2RuZzc7.js';
-import '../../../../markdown-renderer-SVeQ5Uo_.js';
+export { c as SpanPayloadCollapsible, S as SpanPayloadField, d as SpanPayloadLabel, a as SpanPayloadMarkdown, b as SpanPayloadToolCalls } from '../../../../span-payload-primitives-sbxk4CHC.js';
+import '../../../../collapsible-B2uUy8w5.js';
+import '../../../../markdown-renderer-B0gTm_Ea.js';
 //# sourceMappingURL=span-payload-primitives.es.js.map

package/dist/domains/traces/components/span-payload/span-payload-section.cjs.js

@@ -5,14 +5,14 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 const jsxRuntime = require('react/jsx-runtime');
 const React = require('react');
 const domains_traces_components_spanPayload_spanPayloadJson = require('./span-payload-json.cjs.js');
-const Button = require('../../../../Button-C2dx_QZN.cjs');
-const buttonsGroup = require('../../../../buttons-group-yLVV4nzz.cjs');
-const copyButton = require('../../../../copy-button-CmQxxSUq.cjs');
-const dataPanelSectionHeading = require('../../../../data-panel-section-heading-BoMxMKSA.cjs');
-const utils_cn = require('../../../../cn-BuHW7Wrt.cjs');
+const Button = require('../../../../Button-CVewl8nT.cjs');
+const buttonsGroup = require('../../../../buttons-group-BiLEV_Ak.cjs');
+const copyButton = require('../../../../copy-button-BbDBpBMl.cjs');
+const dataPanelSectionHeading = require('../../../../data-panel-section-heading-V86Awzqg.cjs');
+const utils_cn = require('../../../../cn-DG0X1KEP.cjs');
 
 function ViewToggle({ view, onChange }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(buttonsGroup.ButtonsGroup, { spacing: "close", "aria-label": "Payload view", "data-slot": "span-payload-view-toggle", children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs(buttonsGroup.ButtonsGroup, { "aria-label": "Payload view", "data-slot": "span-payload-view-toggle", children: [
     /* @__PURE__ */ jsxRuntime.jsx(
       Button.Button,
       {
@@ -57,7 +57,7 @@ function SpanPayloadSection({
       className: utils_cn.cn("flex flex-col gap-2", className),
       children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center justify-between gap-2", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(dataPanelSectionHeading.DataPanelSectionHeading, { icon, className: layout === "details" ? "text-ui-xs" : void 0, children: title }),
+          /* @__PURE__ */ jsxRuntime.jsx(dataPanelSectionHeading.DataPanelSectionHeading, { icon, className: layout === "details" ? "text-meta" : void 0, children: title }),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "ml-auto flex items-center gap-2", children: [
             /* @__PURE__ */ jsxRuntime.jsx(copyButton.CopyButton, { content: JSON.stringify(raw, null, 2), size: "sm", variant: "ghost" }),
             hasRich && /* @__PURE__ */ jsxRuntime.jsx(ViewToggle, { view, onChange: setView })

package/dist/domains/traces/components/span-payload/span-payload-section.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"span-payload-section.cjs.js","sources":["../../../../../src/domains/traces/components/span-payload/span-payload-section.tsx"],"sourcesContent":["import { useState } from 'react';\nimport type { ReactNode } from 'react';\nimport { SpanPayloadJson } from './span-payload-json';\nimport { Button } from '@/ds/components/Button';\nimport { ButtonsGroup } from '@/ds/components/ButtonsGroup';\nimport { CopyButton } from '@/ds/components/CopyButton';\nimport { DataPanelSectionHeading } from '@/ds/components/DataPanel/data-panel-section-heading';\nimport { cn } from '@/lib/utils';\n\nexport type SpanPayloadView = 'rich' | 'raw';\n\nexport interface SpanPayloadSectionProps {\n  title: string;\n  icon?: ReactNode;\n  /** The payload as stored; shown as JSON in the Raw view. */\n  raw: unknown;\n  /** Whether a dedicated presentation exists rather than a JSON fallback. */\n  hasPreview?: boolean;\n  /**\n   * The human-readable rendering. `null` when the payload has no rich form\n   * (JSON fallback): the section then shows Raw only and hides the toggle.\n   */\n  children: ReactNode;\n  /** `panel` matches `DataPanel.CodeSection`; `details` matches `DataDetailsPanel.CodeSection`. */\n  layout?: 'panel' | 'details';\n  defaultView?: SpanPayloadView;\n  className?: string;\n}\n\nfunction ViewToggle({ view, onChange }: { view: SpanPayloadView; onChange: (view: SpanPayloadView) => void }) {\n  return (\n    <ButtonsGroup spacing=\"close\" aria-label=\"Payload view\" data-slot=\"span-payload-view-toggle\">\n      <Button\n        size=\"sm\"\n        variant={view === 'rich' ? 'primary' : 'default'}\n        aria-pressed={view === 'rich'}\n        onClick={() => onChange('rich')}\n      >\n        Preview\n      </Button>\n      <Button\n        size=\"sm\"\n        variant={view === 'raw' ? 'primary' : 'default'}\n        aria-pressed={view === 'raw'}\n        onClick={() => onChange('raw')}\n      >\n        JSON\n      </Button>\n    </ButtonsGroup>\n  );\n}\n\n/**\n * A span payload section with a Preview / JSON button group. All JSON views share\n * the same syntax highlighting while preserving the stored payload.\n */\nexport function SpanPayloadSection({\n  title,\n  icon,\n  raw,\n  hasPreview = true,\n  children,\n  layout = 'panel',\n  defaultView = 'rich',\n  className,\n}: SpanPayloadSectionProps) {\n  const [view, setView] = useState<SpanPayloadView>(defaultView);\n  if (raw == null) return null;\n\n  const hasRich = hasPreview && children != null;\n  const showJson = !hasRich || view === 'raw';\n\n  return (\n    <div\n      data-slot=\"span-payload-section\"\n      data-view={showJson ? 'raw' : 'rich'}\n      className={cn('flex flex-col gap-2', className)}\n    >\n      <div className=\"flex flex-wrap items-center justify-between gap-2\">\n        <DataPanelSectionHeading icon={icon} className={layout === 'details' ? 'text-ui-xs' : undefined}>\n          {title}\n        </DataPanelSectionHeading>\n        <div className=\"ml-auto flex items-center gap-2\">\n          <CopyButton content={JSON.stringify(raw, null, 2)} size=\"sm\" variant=\"ghost\" />\n          {hasRich && <ViewToggle view={view} onChange={setView} />}\n        </div>\n      </div>\n      <div className=\"min-w-0\">{showJson ? <SpanPayloadJson value={raw} /> : children}</div>\n    </div>\n  );\n}\n"],"names":["ButtonsGroup","jsx","Button","useState","jsxs","cn","DataPanelSectionHeading","CopyButton","SpanPayloadJson"],"mappings":";;;;;;;;;;;;;AA6BA,SAAS,UAAA,CAAW,EAAE,IAAA,EAAM,QAAA,EAAS,EAAyE;AAC5G,EAAA,uCACGA,yBAAA,EAAA,EAAa,OAAA,EAAQ,SAAQ,YAAA,EAAW,cAAA,EAAe,aAAU,0BAAA,EAChE,QAAA,EAAA;AAAA,oBAAAC,cAAA;AAAA,MAACC,aAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAK,IAAA;AAAA,QACL,OAAA,EAAS,IAAA,KAAS,MAAA,GAAS,SAAA,GAAY,SAAA;AAAA,QACvC,gBAAc,IAAA,KAAS,MAAA;AAAA,QACvB,OAAA,EAAS,MAAM,QAAA,CAAS,MAAM,CAAA;AAAA,QAC/B,QAAA,EAAA;AAAA;AAAA,KAED;AAAA,oBACAD,cAAA;AAAA,MAACC,aAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAK,IAAA;AAAA,QACL,OAAA,EAAS,IAAA,KAAS,KAAA,GAAQ,SAAA,GAAY,SAAA;AAAA,QACtC,gBAAc,IAAA,KAAS,KAAA;AAAA,QACvB,OAAA,EAAS,MAAM,QAAA,CAAS,KAAK,CAAA;AAAA,QAC9B,QAAA,EAAA;AAAA;AAAA;AAED,GAAA,EACF,CAAA;AAEJ;AAMO,SAAS,kBAAA,CAAmB;AAAA,EACjC,KAAA;AAAA,EACA,IAAA;AAAA,EACA,GAAA;AAAA,EACA,UAAA,GAAa,IAAA;AAAA,EACb,QAAA;AAAA,EACA,MAAA,GAAS,OAAA;AAAA,EACT,WAAA,GAAc,MAAA;AAAA,EACd;AACF,CAAA,EAA4B;AAC1B,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAIC,eAA0B,WAAW,CAAA;AAC7D,EAAA,IAAI,GAAA,IAAO,MAAM,OAAO,IAAA;AAExB,EAAA,MAAM,OAAA,GAAU,cAAc,QAAA,IAAY,IAAA;AAC1C,EAAA,MAAM,QAAA,GAAW,CAAC,OAAA,IAAW,IAAA,KAAS,KAAA;AAEtC,EAAA,uBACEC,eAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,sBAAA;AAAA,MACV,WAAA,EAAW,WAAW,KAAA,GAAQ,MAAA;AAAA,MAC9B,SAAA,EAAWC,WAAA,CAAG,qBAAA,EAAuB,SAAS,CAAA;AAAA,MAE9C,QAAA,EAAA;AAAA,wBAAAD,eAAA,CAAC,KAAA,EAAA,EAAI,WAAU,mDAAA,EACb,QAAA,EAAA;AAAA,0BAAAH,cAAA,CAACK,mDAAwB,IAAA,EAAY,SAAA,EAAW,WAAW,SAAA,GAAY,YAAA,GAAe,QACnF,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,0BACAF,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,iCAAA,EACb,QAAA,EAAA;AAAA,4BAAAH,cAAA,CAACM,qBAAA,EAAA,EAAW,OAAA,EAAS,IAAA,CAAK,SAAA,CAAU,GAAA,EAAK,IAAA,EAAM,CAAC,CAAA,EAAG,IAAA,EAAK,IAAA,EAAK,OAAA,EAAQ,OAAA,EAAQ,CAAA;AAAA,YAC5E,OAAA,oBAAWN,cAAA,CAAC,UAAA,EAAA,EAAW,IAAA,EAAY,UAAU,OAAA,EAAS;AAAA,WAAA,EACzD;AAAA,SAAA,EACF,CAAA;AAAA,wBACAA,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,SAAA,EAAW,QAAA,EAAA,QAAA,kCAAYO,qEAAA,EAAA,EAAgB,KAAA,EAAO,GAAA,EAAK,CAAA,GAAK,QAAA,EAAS;AAAA;AAAA;AAAA,GAClF;AAEJ;;;;"}
+{"version":3,"file":"span-payload-section.cjs.js","sources":["../../../../../src/domains/traces/components/span-payload/span-payload-section.tsx"],"sourcesContent":["import { useState } from 'react';\nimport type { ReactNode } from 'react';\nimport { SpanPayloadJson } from './span-payload-json';\nimport { Button } from '@/ds/components/Button';\nimport { ButtonsGroup } from '@/ds/components/ButtonsGroup';\nimport { CopyButton } from '@/ds/components/CopyButton';\nimport { DataPanelSectionHeading } from '@/ds/components/DataPanel/data-panel-section-heading';\nimport { cn } from '@/lib/utils';\n\nexport type SpanPayloadView = 'rich' | 'raw';\n\nexport interface SpanPayloadSectionProps {\n  title: string;\n  icon?: ReactNode;\n  /** The payload as stored; shown as JSON in the Raw view. */\n  raw: unknown;\n  /** Whether a dedicated presentation exists rather than a JSON fallback. */\n  hasPreview?: boolean;\n  /**\n   * The human-readable rendering. `null` when the payload has no rich form\n   * (JSON fallback): the section then shows Raw only and hides the toggle.\n   */\n  children: ReactNode;\n  /** `panel` matches `DataPanel.CodeSection`; `details` matches `DataDetailsPanel.CodeSection`. */\n  layout?: 'panel' | 'details';\n  defaultView?: SpanPayloadView;\n  className?: string;\n}\n\nfunction ViewToggle({ view, onChange }: { view: SpanPayloadView; onChange: (view: SpanPayloadView) => void }) {\n  return (\n    <ButtonsGroup aria-label=\"Payload view\" data-slot=\"span-payload-view-toggle\">\n      <Button\n        size=\"sm\"\n        variant={view === 'rich' ? 'primary' : 'default'}\n        aria-pressed={view === 'rich'}\n        onClick={() => onChange('rich')}\n      >\n        Preview\n      </Button>\n      <Button\n        size=\"sm\"\n        variant={view === 'raw' ? 'primary' : 'default'}\n        aria-pressed={view === 'raw'}\n        onClick={() => onChange('raw')}\n      >\n        JSON\n      </Button>\n    </ButtonsGroup>\n  );\n}\n\n/**\n * A span payload section with a Preview / JSON button group. All JSON views share\n * the same syntax highlighting while preserving the stored payload.\n */\nexport function SpanPayloadSection({\n  title,\n  icon,\n  raw,\n  hasPreview = true,\n  children,\n  layout = 'panel',\n  defaultView = 'rich',\n  className,\n}: SpanPayloadSectionProps) {\n  const [view, setView] = useState<SpanPayloadView>(defaultView);\n  if (raw == null) return null;\n\n  const hasRich = hasPreview && children != null;\n  const showJson = !hasRich || view === 'raw';\n\n  return (\n    <div\n      data-slot=\"span-payload-section\"\n      data-view={showJson ? 'raw' : 'rich'}\n      className={cn('flex flex-col gap-2', className)}\n    >\n      <div className=\"flex flex-wrap items-center justify-between gap-2\">\n        <DataPanelSectionHeading icon={icon} className={layout === 'details' ? 'text-meta' : undefined}>\n          {title}\n        </DataPanelSectionHeading>\n        <div className=\"ml-auto flex items-center gap-2\">\n          <CopyButton content={JSON.stringify(raw, null, 2)} size=\"sm\" variant=\"ghost\" />\n          {hasRich && <ViewToggle view={view} onChange={setView} />}\n        </div>\n      </div>\n      <div className=\"min-w-0\">{showJson ? <SpanPayloadJson value={raw} /> : children}</div>\n    </div>\n  );\n}\n"],"names":["jsxs","ButtonsGroup","jsx","Button","useState","cn","DataPanelSectionHeading","CopyButton","SpanPayloadJson"],"mappings":";;;;;;;;;;;;;AA6BA,SAAS,UAAA,CAAW,EAAE,IAAA,EAAM,QAAA,EAAS,EAAyE;AAC5G,EAAA,uBACEA,eAAA,CAACC,yBAAA,EAAA,EAAa,YAAA,EAAW,cAAA,EAAe,aAAU,0BAAA,EAChD,QAAA,EAAA;AAAA,oBAAAC,cAAA;AAAA,MAACC,aAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAK,IAAA;AAAA,QACL,OAAA,EAAS,IAAA,KAAS,MAAA,GAAS,SAAA,GAAY,SAAA;AAAA,QACvC,gBAAc,IAAA,KAAS,MAAA;AAAA,QACvB,OAAA,EAAS,MAAM,QAAA,CAAS,MAAM,CAAA;AAAA,QAC/B,QAAA,EAAA;AAAA;AAAA,KAED;AAAA,oBACAD,cAAA;AAAA,MAACC,aAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAK,IAAA;AAAA,QACL,OAAA,EAAS,IAAA,KAAS,KAAA,GAAQ,SAAA,GAAY,SAAA;AAAA,QACtC,gBAAc,IAAA,KAAS,KAAA;AAAA,QACvB,OAAA,EAAS,MAAM,QAAA,CAAS,KAAK,CAAA;AAAA,QAC9B,QAAA,EAAA;AAAA;AAAA;AAED,GAAA,EACF,CAAA;AAEJ;AAMO,SAAS,kBAAA,CAAmB;AAAA,EACjC,KAAA;AAAA,EACA,IAAA;AAAA,EACA,GAAA;AAAA,EACA,UAAA,GAAa,IAAA;AAAA,EACb,QAAA;AAAA,EACA,MAAA,GAAS,OAAA;AAAA,EACT,WAAA,GAAc,MAAA;AAAA,EACd;AACF,CAAA,EAA4B;AAC1B,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAIC,eAA0B,WAAW,CAAA;AAC7D,EAAA,IAAI,GAAA,IAAO,MAAM,OAAO,IAAA;AAExB,EAAA,MAAM,OAAA,GAAU,cAAc,QAAA,IAAY,IAAA;AAC1C,EAAA,MAAM,QAAA,GAAW,CAAC,OAAA,IAAW,IAAA,KAAS,KAAA;AAEtC,EAAA,uBACEJ,eAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,sBAAA;AAAA,MACV,WAAA,EAAW,WAAW,KAAA,GAAQ,MAAA;AAAA,MAC9B,SAAA,EAAWK,WAAA,CAAG,qBAAA,EAAuB,SAAS,CAAA;AAAA,MAE9C,QAAA,EAAA;AAAA,wBAAAL,eAAA,CAAC,KAAA,EAAA,EAAI,WAAU,mDAAA,EACb,QAAA,EAAA;AAAA,0BAAAE,cAAA,CAACI,mDAAwB,IAAA,EAAY,SAAA,EAAW,WAAW,SAAA,GAAY,WAAA,GAAc,QAClF,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,0BACAN,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,iCAAA,EACb,QAAA,EAAA;AAAA,4BAAAE,cAAA,CAACK,qBAAA,EAAA,EAAW,OAAA,EAAS,IAAA,CAAK,SAAA,CAAU,GAAA,EAAK,IAAA,EAAM,CAAC,CAAA,EAAG,IAAA,EAAK,IAAA,EAAK,OAAA,EAAQ,OAAA,EAAQ,CAAA;AAAA,YAC5E,OAAA,oBAAWL,cAAA,CAAC,UAAA,EAAA,EAAW,IAAA,EAAY,UAAU,OAAA,EAAS;AAAA,WAAA,EACzD;AAAA,SAAA,EACF,CAAA;AAAA,wBACAA,cAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,SAAA,EAAW,QAAA,EAAA,QAAA,kCAAYM,qEAAA,EAAA,EAAgB,KAAA,EAAO,GAAA,EAAK,CAAA,GAAK,QAAA,EAAS;AAAA;AAAA;AAAA,GAClF;AAEJ;;;;"}

package/dist/domains/traces/components/span-payload/span-payload-section.es.js

@@ -1,14 +1,14 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { useState } from 'react';
 import { SpanPayloadJson } from './span-payload-json.es.js';
-import { B as Button } from '../../../../Button-DS6O6fvU.js';
-import { B as ButtonsGroup } from '../../../../buttons-group-t7AODlO9.js';
-import { C as CopyButton } from '../../../../copy-button-DIeDskPU.js';
-import { D as DataPanelSectionHeading } from '../../../../data-panel-section-heading-UzIDRnta.js';
-import { c as cn } from '../../../../cn-C6s2yXwM.js';
+import { B as Button } from '../../../../Button-cWcBEd-G.js';
+import { B as ButtonsGroup } from '../../../../buttons-group-CaA7KAWf.js';
+import { C as CopyButton } from '../../../../copy-button-2cwdZ3dW.js';
+import { D as DataPanelSectionHeading } from '../../../../data-panel-section-heading-CXD1skJD.js';
+import { c as cn } from '../../../../cn-65Adrsfj.js';
 
 function ViewToggle({ view, onChange }) {
-  return /* @__PURE__ */ jsxs(ButtonsGroup, { spacing: "close", "aria-label": "Payload view", "data-slot": "span-payload-view-toggle", children: [
+  return /* @__PURE__ */ jsxs(ButtonsGroup, { "aria-label": "Payload view", "data-slot": "span-payload-view-toggle", children: [
     /* @__PURE__ */ jsx(
       Button,
       {
@@ -53,7 +53,7 @@ function SpanPayloadSection({
       className: cn("flex flex-col gap-2", className),
       children: [
         /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center justify-between gap-2", children: [
-          /* @__PURE__ */ jsx(DataPanelSectionHeading, { icon, className: layout === "details" ? "text-ui-xs" : void 0, children: title }),
+          /* @__PURE__ */ jsx(DataPanelSectionHeading, { icon, className: layout === "details" ? "text-meta" : void 0, children: title }),
           /* @__PURE__ */ jsxs("div", { className: "ml-auto flex items-center gap-2", children: [
             /* @__PURE__ */ jsx(CopyButton, { content: JSON.stringify(raw, null, 2), size: "sm", variant: "ghost" }),
             hasRich && /* @__PURE__ */ jsx(ViewToggle, { view, onChange: setView })

package/dist/domains/traces/components/span-payload/span-payload-section.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"span-payload-section.es.js","sources":["../../../../../src/domains/traces/components/span-payload/span-payload-section.tsx"],"sourcesContent":["import { useState } from 'react';\nimport type { ReactNode } from 'react';\nimport { SpanPayloadJson } from './span-payload-json';\nimport { Button } from '@/ds/components/Button';\nimport { ButtonsGroup } from '@/ds/components/ButtonsGroup';\nimport { CopyButton } from '@/ds/components/CopyButton';\nimport { DataPanelSectionHeading } from '@/ds/components/DataPanel/data-panel-section-heading';\nimport { cn } from '@/lib/utils';\n\nexport type SpanPayloadView = 'rich' | 'raw';\n\nexport interface SpanPayloadSectionProps {\n  title: string;\n  icon?: ReactNode;\n  /** The payload as stored; shown as JSON in the Raw view. */\n  raw: unknown;\n  /** Whether a dedicated presentation exists rather than a JSON fallback. */\n  hasPreview?: boolean;\n  /**\n   * The human-readable rendering. `null` when the payload has no rich form\n   * (JSON fallback): the section then shows Raw only and hides the toggle.\n   */\n  children: ReactNode;\n  /** `panel` matches `DataPanel.CodeSection`; `details` matches `DataDetailsPanel.CodeSection`. */\n  layout?: 'panel' | 'details';\n  defaultView?: SpanPayloadView;\n  className?: string;\n}\n\nfunction ViewToggle({ view, onChange }: { view: SpanPayloadView; onChange: (view: SpanPayloadView) => void }) {\n  return (\n    <ButtonsGroup spacing=\"close\" aria-label=\"Payload view\" data-slot=\"span-payload-view-toggle\">\n      <Button\n        size=\"sm\"\n        variant={view === 'rich' ? 'primary' : 'default'}\n        aria-pressed={view === 'rich'}\n        onClick={() => onChange('rich')}\n      >\n        Preview\n      </Button>\n      <Button\n        size=\"sm\"\n        variant={view === 'raw' ? 'primary' : 'default'}\n        aria-pressed={view === 'raw'}\n        onClick={() => onChange('raw')}\n      >\n        JSON\n      </Button>\n    </ButtonsGroup>\n  );\n}\n\n/**\n * A span payload section with a Preview / JSON button group. All JSON views share\n * the same syntax highlighting while preserving the stored payload.\n */\nexport function SpanPayloadSection({\n  title,\n  icon,\n  raw,\n  hasPreview = true,\n  children,\n  layout = 'panel',\n  defaultView = 'rich',\n  className,\n}: SpanPayloadSectionProps) {\n  const [view, setView] = useState<SpanPayloadView>(defaultView);\n  if (raw == null) return null;\n\n  const hasRich = hasPreview && children != null;\n  const showJson = !hasRich || view === 'raw';\n\n  return (\n    <div\n      data-slot=\"span-payload-section\"\n      data-view={showJson ? 'raw' : 'rich'}\n      className={cn('flex flex-col gap-2', className)}\n    >\n      <div className=\"flex flex-wrap items-center justify-between gap-2\">\n        <DataPanelSectionHeading icon={icon} className={layout === 'details' ? 'text-ui-xs' : undefined}>\n          {title}\n        </DataPanelSectionHeading>\n        <div className=\"ml-auto flex items-center gap-2\">\n          <CopyButton content={JSON.stringify(raw, null, 2)} size=\"sm\" variant=\"ghost\" />\n          {hasRich && <ViewToggle view={view} onChange={setView} />}\n        </div>\n      </div>\n      <div className=\"min-w-0\">{showJson ? <SpanPayloadJson value={raw} /> : children}</div>\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;AA6BA,SAAS,UAAA,CAAW,EAAE,IAAA,EAAM,QAAA,EAAS,EAAyE;AAC5G,EAAA,4BACG,YAAA,EAAA,EAAa,OAAA,EAAQ,SAAQ,YAAA,EAAW,cAAA,EAAe,aAAU,0BAAA,EAChE,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAK,IAAA;AAAA,QACL,OAAA,EAAS,IAAA,KAAS,MAAA,GAAS,SAAA,GAAY,SAAA;AAAA,QACvC,gBAAc,IAAA,KAAS,MAAA;AAAA,QACvB,OAAA,EAAS,MAAM,QAAA,CAAS,MAAM,CAAA;AAAA,QAC/B,QAAA,EAAA;AAAA;AAAA,KAED;AAAA,oBACA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAK,IAAA;AAAA,QACL,OAAA,EAAS,IAAA,KAAS,KAAA,GAAQ,SAAA,GAAY,SAAA;AAAA,QACtC,gBAAc,IAAA,KAAS,KAAA;AAAA,QACvB,OAAA,EAAS,MAAM,QAAA,CAAS,KAAK,CAAA;AAAA,QAC9B,QAAA,EAAA;AAAA;AAAA;AAED,GAAA,EACF,CAAA;AAEJ;AAMO,SAAS,kBAAA,CAAmB;AAAA,EACjC,KAAA;AAAA,EACA,IAAA;AAAA,EACA,GAAA;AAAA,EACA,UAAA,GAAa,IAAA;AAAA,EACb,QAAA;AAAA,EACA,MAAA,GAAS,OAAA;AAAA,EACT,WAAA,GAAc,MAAA;AAAA,EACd;AACF,CAAA,EAA4B;AAC1B,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,SAA0B,WAAW,CAAA;AAC7D,EAAA,IAAI,GAAA,IAAO,MAAM,OAAO,IAAA;AAExB,EAAA,MAAM,OAAA,GAAU,cAAc,QAAA,IAAY,IAAA;AAC1C,EAAA,MAAM,QAAA,GAAW,CAAC,OAAA,IAAW,IAAA,KAAS,KAAA;AAEtC,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,sBAAA;AAAA,MACV,WAAA,EAAW,WAAW,KAAA,GAAQ,MAAA;AAAA,MAC9B,SAAA,EAAW,EAAA,CAAG,qBAAA,EAAuB,SAAS,CAAA;AAAA,MAE9C,QAAA,EAAA;AAAA,wBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,mDAAA,EACb,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,2BAAwB,IAAA,EAAY,SAAA,EAAW,WAAW,SAAA,GAAY,YAAA,GAAe,QACnF,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,0BACA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,iCAAA,EACb,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,UAAA,EAAA,EAAW,OAAA,EAAS,IAAA,CAAK,SAAA,CAAU,GAAA,EAAK,IAAA,EAAM,CAAC,CAAA,EAAG,IAAA,EAAK,IAAA,EAAK,OAAA,EAAQ,OAAA,EAAQ,CAAA;AAAA,YAC5E,OAAA,oBAAW,GAAA,CAAC,UAAA,EAAA,EAAW,IAAA,EAAY,UAAU,OAAA,EAAS;AAAA,WAAA,EACzD;AAAA,SAAA,EACF,CAAA;AAAA,wBACA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,SAAA,EAAW,QAAA,EAAA,QAAA,uBAAY,eAAA,EAAA,EAAgB,KAAA,EAAO,GAAA,EAAK,CAAA,GAAK,QAAA,EAAS;AAAA;AAAA;AAAA,GAClF;AAEJ;;;;"}
+{"version":3,"file":"span-payload-section.es.js","sources":["../../../../../src/domains/traces/components/span-payload/span-payload-section.tsx"],"sourcesContent":["import { useState } from 'react';\nimport type { ReactNode } from 'react';\nimport { SpanPayloadJson } from './span-payload-json';\nimport { Button } from '@/ds/components/Button';\nimport { ButtonsGroup } from '@/ds/components/ButtonsGroup';\nimport { CopyButton } from '@/ds/components/CopyButton';\nimport { DataPanelSectionHeading } from '@/ds/components/DataPanel/data-panel-section-heading';\nimport { cn } from '@/lib/utils';\n\nexport type SpanPayloadView = 'rich' | 'raw';\n\nexport interface SpanPayloadSectionProps {\n  title: string;\n  icon?: ReactNode;\n  /** The payload as stored; shown as JSON in the Raw view. */\n  raw: unknown;\n  /** Whether a dedicated presentation exists rather than a JSON fallback. */\n  hasPreview?: boolean;\n  /**\n   * The human-readable rendering. `null` when the payload has no rich form\n   * (JSON fallback): the section then shows Raw only and hides the toggle.\n   */\n  children: ReactNode;\n  /** `panel` matches `DataPanel.CodeSection`; `details` matches `DataDetailsPanel.CodeSection`. */\n  layout?: 'panel' | 'details';\n  defaultView?: SpanPayloadView;\n  className?: string;\n}\n\nfunction ViewToggle({ view, onChange }: { view: SpanPayloadView; onChange: (view: SpanPayloadView) => void }) {\n  return (\n    <ButtonsGroup aria-label=\"Payload view\" data-slot=\"span-payload-view-toggle\">\n      <Button\n        size=\"sm\"\n        variant={view === 'rich' ? 'primary' : 'default'}\n        aria-pressed={view === 'rich'}\n        onClick={() => onChange('rich')}\n      >\n        Preview\n      </Button>\n      <Button\n        size=\"sm\"\n        variant={view === 'raw' ? 'primary' : 'default'}\n        aria-pressed={view === 'raw'}\n        onClick={() => onChange('raw')}\n      >\n        JSON\n      </Button>\n    </ButtonsGroup>\n  );\n}\n\n/**\n * A span payload section with a Preview / JSON button group. All JSON views share\n * the same syntax highlighting while preserving the stored payload.\n */\nexport function SpanPayloadSection({\n  title,\n  icon,\n  raw,\n  hasPreview = true,\n  children,\n  layout = 'panel',\n  defaultView = 'rich',\n  className,\n}: SpanPayloadSectionProps) {\n  const [view, setView] = useState<SpanPayloadView>(defaultView);\n  if (raw == null) return null;\n\n  const hasRich = hasPreview && children != null;\n  const showJson = !hasRich || view === 'raw';\n\n  return (\n    <div\n      data-slot=\"span-payload-section\"\n      data-view={showJson ? 'raw' : 'rich'}\n      className={cn('flex flex-col gap-2', className)}\n    >\n      <div className=\"flex flex-wrap items-center justify-between gap-2\">\n        <DataPanelSectionHeading icon={icon} className={layout === 'details' ? 'text-meta' : undefined}>\n          {title}\n        </DataPanelSectionHeading>\n        <div className=\"ml-auto flex items-center gap-2\">\n          <CopyButton content={JSON.stringify(raw, null, 2)} size=\"sm\" variant=\"ghost\" />\n          {hasRich && <ViewToggle view={view} onChange={setView} />}\n        </div>\n      </div>\n      <div className=\"min-w-0\">{showJson ? <SpanPayloadJson value={raw} /> : children}</div>\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;AA6BA,SAAS,UAAA,CAAW,EAAE,IAAA,EAAM,QAAA,EAAS,EAAyE;AAC5G,EAAA,uBACE,IAAA,CAAC,YAAA,EAAA,EAAa,YAAA,EAAW,cAAA,EAAe,aAAU,0BAAA,EAChD,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAK,IAAA;AAAA,QACL,OAAA,EAAS,IAAA,KAAS,MAAA,GAAS,SAAA,GAAY,SAAA;AAAA,QACvC,gBAAc,IAAA,KAAS,MAAA;AAAA,QACvB,OAAA,EAAS,MAAM,QAAA,CAAS,MAAM,CAAA;AAAA,QAC/B,QAAA,EAAA;AAAA;AAAA,KAED;AAAA,oBACA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAK,IAAA;AAAA,QACL,OAAA,EAAS,IAAA,KAAS,KAAA,GAAQ,SAAA,GAAY,SAAA;AAAA,QACtC,gBAAc,IAAA,KAAS,KAAA;AAAA,QACvB,OAAA,EAAS,MAAM,QAAA,CAAS,KAAK,CAAA;AAAA,QAC9B,QAAA,EAAA;AAAA;AAAA;AAED,GAAA,EACF,CAAA;AAEJ;AAMO,SAAS,kBAAA,CAAmB;AAAA,EACjC,KAAA;AAAA,EACA,IAAA;AAAA,EACA,GAAA;AAAA,EACA,UAAA,GAAa,IAAA;AAAA,EACb,QAAA;AAAA,EACA,MAAA,GAAS,OAAA;AAAA,EACT,WAAA,GAAc,MAAA;AAAA,EACd;AACF,CAAA,EAA4B;AAC1B,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,SAA0B,WAAW,CAAA;AAC7D,EAAA,IAAI,GAAA,IAAO,MAAM,OAAO,IAAA;AAExB,EAAA,MAAM,OAAA,GAAU,cAAc,QAAA,IAAY,IAAA;AAC1C,EAAA,MAAM,QAAA,GAAW,CAAC,OAAA,IAAW,IAAA,KAAS,KAAA;AAEtC,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,WAAA,EAAU,sBAAA;AAAA,MACV,WAAA,EAAW,WAAW,KAAA,GAAQ,MAAA;AAAA,MAC9B,SAAA,EAAW,EAAA,CAAG,qBAAA,EAAuB,SAAS,CAAA;AAAA,MAE9C,QAAA,EAAA;AAAA,wBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,mDAAA,EACb,QAAA,EAAA;AAAA,0BAAA,GAAA,CAAC,2BAAwB,IAAA,EAAY,SAAA,EAAW,WAAW,SAAA,GAAY,WAAA,GAAc,QAClF,QAAA,EAAA,KAAA,EACH,CAAA;AAAA,0BACA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,iCAAA,EACb,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,UAAA,EAAA,EAAW,OAAA,EAAS,IAAA,CAAK,SAAA,CAAU,GAAA,EAAK,IAAA,EAAM,CAAC,CAAA,EAAG,IAAA,EAAK,IAAA,EAAK,OAAA,EAAQ,OAAA,EAAQ,CAAA;AAAA,YAC5E,OAAA,oBAAW,GAAA,CAAC,UAAA,EAAA,EAAW,IAAA,EAAY,UAAU,OAAA,EAAS;AAAA,WAAA,EACzD;AAAA,SAAA,EACF,CAAA;AAAA,wBACA,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,SAAA,EAAW,QAAA,EAAA,QAAA,uBAAY,eAAA,EAAA,EAAgB,KAAA,EAAO,GAAA,EAAK,CAAA,GAAK,QAAA,EAAS;AAAA;AAAA;AAAA,GAClF;AAEJ;;;;"}

package/dist/domains/traces/components/span-payload/span-payload-tool.cjs.js

@@ -4,9 +4,9 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 require('react/jsx-runtime');
 require('./span-payload-json.cjs.js');
-const domains_traces_components_spanPayload_spanPayloadTool = require('../../../../span-payload-primitives-DknOcv6v.cjs');
+const domains_traces_components_spanPayload_spanPayloadTool = require('../../../../span-payload-primitives-DnRsP93D.cjs');
 require('../../../chat/components/badge-wrapper.cjs.js');
-require('../../../../tool-call-CAzilpXy.cjs');
+require('../../../../tool-call-CMRvRE-v.cjs');
 require('../../../../tool-presentation-BGWx2mEc.cjs');
 
 

package/dist/domains/traces/components/span-payload/span-payload-tool.es.js

@@ -1,7 +1,7 @@
 import 'react/jsx-runtime';
 import './span-payload-json.es.js';
-export { e as SpanPayloadTool } from '../../../../span-payload-primitives-_TUMqise.js';
+export { e as SpanPayloadTool } from '../../../../span-payload-primitives-sbxk4CHC.js';
 import '../../../chat/components/badge-wrapper.es.js';
-import '../../../../tool-call-98H2-r5p.js';
+import '../../../../tool-call-K147tCug.js';
 import '../../../../tool-presentation-D-smNbXC.js';
 //# sourceMappingURL=span-payload-tool.es.js.map

package/dist/domains/traces/components/span-summary-description.cjs.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 const jsxRuntime = require('react/jsx-runtime');
 const lucideReact = require('lucide-react');
 const domains_traces_utils_spanUtils = require('../utils/span-utils.cjs.js');
-const dataPanel = require('../../../data-panel-BhJ8Lp_j.cjs');
+const dataPanel = require('../../../data-panel-CWZJKBeW.cjs');
 const utils_truncateString = require('../../../utils/truncate-string.cjs.js');
 
 function SpanSummaryDescription({ span }) {

package/dist/domains/traces/components/span-summary-description.es.js

@@ -1,7 +1,7 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { CalendarClockIcon, TimerIcon, HashIcon } from 'lucide-react';
 import { formatSpanTimestamp, formatSpanTimestampExact, formatSpanDurationSeconds } from '../utils/span-utils.es.js';
-import { D as DataPanel } from '../../../data-panel-D2JtbyKg.js';
+import { D as DataPanel } from '../../../data-panel-CWjgS1Gh.js';
 import { truncateString } from '../../../utils/truncate-string.es.js';
 
 function SpanSummaryDescription({ span }) {

package/dist/domains/traces/components/span-timeline-row.cjs.js

@@ -8,8 +8,8 @@ const React = require('react');
 const domains_traces_utils_spanTiming = require('../utils/span-timing.cjs.js');
 const domains_traces_components_spanTimingHoverCard = require('./span-timing-hover-card.cjs.js');
 const domains_traces_components_timelineStructureSign = require('./timeline-structure-sign.cjs.js');
-const hoverCard = require('../../../hover-card-BSj1EgQs.cjs');
-const utils_cn = require('../../../cn-BuHW7Wrt.cjs');
+const hoverCard = require('../../../hover-card-DdHnkGcs.cjs');
+const utils_cn = require('../../../cn-DG0X1KEP.cjs');
 
 function formatDuration(ms) {
   return ms < 1e3 ? `${Math.round(ms)} ms` : `${(ms / 1e3).toFixed(2)} s`;
@@ -46,10 +46,10 @@ function SpanTimelineRow({ ctx }) {
       "aria-selected": isSelected,
       onClick: () => onSpanClick?.(span.id),
       className: utils_cn.cn(
-        "col-span-2 grid h-7 cursor-pointer grid-cols-subgrid items-stretch rounded-md opacity-80 transition-colors hover:bg-surface4",
+        "col-span-2 grid h-7 cursor-pointer grid-cols-subgrid items-stretch rounded-md opacity-80 hover:bg-fill-subtle",
         {
           "opacity-40 [&:hover]:opacity-70 dark:opacity-30 dark:[&:hover]:opacity-60": isFaded,
-          "bg-surface4": isSelected
+          "bg-fill-hover": isSelected
         }
       ),
       children: [
@@ -60,7 +60,7 @@ function SpanTimelineRow({ ctx }) {
             {
               type: "button",
               className: utils_cn.cn(
-                "flex min-w-0 flex-1 cursor-pointer items-center gap-1.5 rounded-md px-2 text-left text-ui-sm text-neutral6",
+                "flex min-w-0 flex-1 cursor-pointer items-center gap-1.5 rounded-md px-2 text-left text-caption text-foreground",
                 "focus:outline-none focus-visible:ring-1 focus-visible:ring-accent1 focus-visible:ring-inset"
               ),
               children: [
@@ -97,8 +97,8 @@ function SpanTimelineRow({ ctx }) {
               "aria-label": toggleLabel,
               "aria-expanded": isExpanded,
               className: utils_cn.cn(
-                "flex size-5 cursor-pointer items-center justify-center rounded-md transition-colors",
-                "hover:bg-surface5 [&:hover>svg]:opacity-100 [&>svg]:size-4 [&>svg]:opacity-50",
+                "flex size-5 cursor-pointer items-center justify-center rounded-md",
+                "hover:bg-fill [&:hover>svg]:opacity-100 [&>svg]:size-4 [&>svg]:opacity-50",
                 "focus:outline-none focus-visible:ring-1 focus-visible:ring-accent1"
               ),
               children: isExpanded ? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDownIcon, {}) : /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronRightIcon, {})
@@ -112,7 +112,7 @@ function SpanTimelineRow({ ctx }) {
               render: /* @__PURE__ */ jsxRuntime.jsx("div", {}),
               className: "grid min-w-0 cursor-help grid-cols-[minmax(0,1fr)_auto] items-center gap-2 px-2",
               children: [
-                /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-surface5/40 relative h-4 w-full rounded-sm", children: /* @__PURE__ */ jsxRuntime.jsx(
+                /* @__PURE__ */ jsxRuntime.jsx("div", { className: "bg-fill-subtle relative h-4 w-full rounded-sm", children: /* @__PURE__ */ jsxRuntime.jsx(
                   "div",
                   {
                     "data-testid": "span-timeline-bar",
@@ -124,7 +124,7 @@ function SpanTimelineRow({ ctx }) {
                     }
                   }
                 ) }),
-                /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-ui-xs text-neutral3 w-12 text-right tabular-nums", children: formatDuration(span.latency) })
+                /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-meta text-muted-foreground w-12 text-right tabular-nums", children: formatDuration(span.latency) })
               ]
             }
           ),