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

package/dist/ee/signals/theme-filter-banner.es.js

@@ -1,10 +1,10 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { X, Eye } from 'lucide-react';
-import { getSignalHue } from './signal-colors.es.js';
+import { getSignalColor } from './signal-colors.es.js';
 import { signalLabel } from './signal-formatting.es.js';
 import { useTraceIntelligence } from './use-trace-intelligence.es.js';
-import { B as Button } from '../../Button-BY9qlu8K.js';
-import { n as nodeColor } from '../../sankeyColor-BoMbAWtq.js';
+import { B as Button } from '../../Button-C6eUqcPI.js';
+import { T as Txt } from '../../Txt-BP1SRHmL.js';
 
 function selectionLabel(catalog, selection) {
   return `${signalLabel(catalog, selection.signalName)} · ${selection.kind === "theme" ? selection.label : "Noise"}`;
@@ -36,16 +36,18 @@ function ThemeFilterBanner({
   onClear
 }) {
   const { signalCatalog } = useTraceIntelligence();
-  const colors = selections.map((selection) => nodeColor(getSignalHue(selection.signalName)));
+  const colors = selections.map((selection) => getSignalColor(selection.signalName));
   const latestSelection = selections.at(-1);
-  const backgroundGradient = `linear-gradient(90deg, ${colors.map((color) => `color-mix(in srgb, ${color} 8%, transparent)`).join(", ")})`;
-  const borderGradient = `linear-gradient(90deg, ${colors.map((color) => `color-mix(in srgb, ${color} 35%, transparent)`).join(", ")})`;
+  const borderGradient = `linear-gradient(90deg, ${colors.length > 1 ? colors.join(", ") : `${colors[0]}, ${colors[0]}`})`;
   return /* @__PURE__ */ jsxs(
     "section",
     {
       "aria-label": "Active theme drill-in",
       className: "relative flex flex-wrap items-center gap-x-4 gap-y-2 rounded-lg border border-transparent px-3 py-2",
-      style: { backgroundImage: `${backgroundGradient}, ${borderGradient}`, backgroundClip: "padding-box, border-box" },
+      style: {
+        backgroundImage: `linear-gradient(var(--card), var(--card)), ${borderGradient}`,
+        backgroundClip: "padding-box, border-box"
+      },
       children: [
         selections.map((selection, index) => {
           const color = colors[index];
@@ -65,7 +67,7 @@ function ThemeFilterBanner({
             selection.signalName
           );
         }),
-        /* @__PURE__ */ jsx("span", { className: "text-caption text-muted-foreground", children: filterSummary({ selections, filteredTraceCount, totalTraceCount, isUnavailable }) }),
+        /* @__PURE__ */ jsx(Txt, { as: "span", variant: "caption", tone: "muted", children: filterSummary({ selections, filteredTraceCount, totalTraceCount, isUnavailable }) }),
         !isUnavailable && filteredTraceCount !== void 0 && latestSelection ? /* @__PURE__ */ jsx(
           Button,
           {

package/dist/ee/signals/theme-filter-banner.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"theme-filter-banner.es.js","sources":["../../../src/ee/signals/theme-filter-banner.tsx"],"sourcesContent":["import type { SignalCatalogEntry } from '@mastra/client-js';\nimport { X, Eye } from 'lucide-react';\nimport { getSignalHue } from './signal-colors';\nimport { signalLabel } from './signal-formatting';\nimport type { ThemeSelection } from './theme-drilldown-data';\nimport { useTraceIntelligence } from './use-trace-intelligence';\nimport { Button } from '@/ds/components/Button';\nimport { nodeColor } from '@/ds/components/SankeyChart';\n\nfunction selectionLabel(catalog: readonly SignalCatalogEntry[], selection: ThemeSelection) {\n  return `${signalLabel(catalog, selection.signalName)} · ${selection.kind === 'theme' ? selection.label : 'Noise'}`;\n}\n\nfunction filterSummary({\n  selections,\n  filteredTraceCount,\n  totalTraceCount,\n  isUnavailable,\n}: {\n  selections: ThemeSelection[];\n  filteredTraceCount?: number;\n  totalTraceCount: number;\n  isUnavailable?: boolean;\n}) {\n  if (isUnavailable) return 'Filters unavailable for this snapshot';\n  if (filteredTraceCount === undefined) return 'Loading matching traces…';\n  const onlySelection = selections.length === 1 ? selections[0] : undefined;\n  if (onlySelection?.kind === 'noise') {\n    return `Showing the ${filteredTraceCount} of ${totalTraceCount} traces assigned to Noise`;\n  }\n  if (onlySelection) {\n    return `Showing the ${filteredTraceCount} of ${totalTraceCount} traces that flow through this theme`;\n  }\n  return `Showing the ${filteredTraceCount} of ${totalTraceCount} traces that match these filters`;\n}\n\nexport function ThemeFilterBanner({\n  selections,\n  filteredTraceCount,\n  totalTraceCount,\n  isUnavailable,\n  onViewDetails,\n  onRemove,\n  onClear,\n}: {\n  selections: ThemeSelection[];\n  filteredTraceCount?: number;\n  totalTraceCount: number;\n  isUnavailable?: boolean;\n  onViewDetails: (selection: ThemeSelection) => void;\n  onRemove: (signalName: ThemeSelection['signalName']) => void;\n  onClear: () => void;\n}) {\n  const { signalCatalog } = useTraceIntelligence();\n  const colors = selections.map(selection => nodeColor(getSignalHue(selection.signalName)));\n  const latestSelection = selections.at(-1);\n  const backgroundGradient = `linear-gradient(90deg, ${colors\n    .map(color => `color-mix(in srgb, ${color} 8%, transparent)`)\n    .join(', ')})`;\n  const borderGradient = `linear-gradient(90deg, ${colors\n    .map(color => `color-mix(in srgb, ${color} 35%, transparent)`)\n    .join(', ')})`;\n\n  return (\n    <section\n      aria-label=\"Active theme drill-in\"\n      className=\"relative flex flex-wrap items-center gap-x-4 gap-y-2 rounded-lg border border-transparent px-3 py-2\"\n      style={{ backgroundImage: `${backgroundGradient}, ${borderGradient}`, backgroundClip: 'padding-box, border-box' }}\n    >\n      {selections.map((selection, index) => {\n        const color = colors[index];\n        return (\n          <button\n            key={selection.signalName}\n            aria-label={\n              selections.length === 1\n                ? `Clear ${selection.kind} filter`\n                : `Clear filter ${selectionLabel(signalCatalog, selection)}`\n            }\n            className=\"state-layer flex items-center gap-1.5 rounded-full border border-border bg-background py-1 pr-2 pl-2.5 text-column text-foreground\"\n            onClick={() => onRemove(selection.signalName)}\n            type=\"button\"\n          >\n            <span aria-hidden=\"true\" className=\"rounded-0.5 size-2\" style={{ backgroundColor: color }} />\n            {selectionLabel(signalCatalog, selection)}\n            <X aria-hidden=\"true\" className=\"size-3.5\" />\n          </button>\n        );\n      })}\n      <span className=\"text-caption text-muted-foreground\">\n        {filterSummary({ selections, filteredTraceCount, totalTraceCount, isUnavailable })}\n      </span>\n      {!isUnavailable && filteredTraceCount !== undefined && latestSelection ? (\n        <Button\n          icon={<Eye />}\n          aria-label={\n            latestSelection.kind === 'theme'\n              ? `View theme details for ${latestSelection.label}`\n              : `View noise details for ${signalLabel(signalCatalog, latestSelection.signalName)}`\n          }\n          onClick={() => onViewDetails(latestSelection)}\n          size=\"sm\"\n          type=\"button\"\n          variant=\"ghost\"\n        >\n          Details →\n        </Button>\n      ) : null}\n      {selections.length > 1 ? (\n        <Button icon={<X />} onClick={onClear} size=\"sm\" type=\"button\" variant=\"ghost\">\n          Clear all\n        </Button>\n      ) : null}\n    </section>\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"theme-filter-banner.es.js","sources":["../../../src/ee/signals/theme-filter-banner.tsx"],"sourcesContent":["import type { SignalCatalogEntry } from '@mastra/client-js';\nimport { X, Eye } from 'lucide-react';\nimport { getSignalColor } from './signal-colors';\nimport { signalLabel } from './signal-formatting';\nimport type { ThemeSelection } from './theme-drilldown-data';\nimport { useTraceIntelligence } from './use-trace-intelligence';\nimport { Button } from '@/ds/components/Button';\nimport { Txt } from '@/ds/components/Txt';\n\nfunction selectionLabel(catalog: readonly SignalCatalogEntry[], selection: ThemeSelection) {\n  return `${signalLabel(catalog, selection.signalName)} · ${selection.kind === 'theme' ? selection.label : 'Noise'}`;\n}\n\nfunction filterSummary({\n  selections,\n  filteredTraceCount,\n  totalTraceCount,\n  isUnavailable,\n}: {\n  selections: ThemeSelection[];\n  filteredTraceCount?: number;\n  totalTraceCount: number;\n  isUnavailable?: boolean;\n}) {\n  if (isUnavailable) return 'Filters unavailable for this snapshot';\n  if (filteredTraceCount === undefined) return 'Loading matching traces…';\n  const onlySelection = selections.length === 1 ? selections[0] : undefined;\n  if (onlySelection?.kind === 'noise') {\n    return `Showing the ${filteredTraceCount} of ${totalTraceCount} traces assigned to Noise`;\n  }\n  if (onlySelection) {\n    return `Showing the ${filteredTraceCount} of ${totalTraceCount} traces that flow through this theme`;\n  }\n  return `Showing the ${filteredTraceCount} of ${totalTraceCount} traces that match these filters`;\n}\n\nexport function ThemeFilterBanner({\n  selections,\n  filteredTraceCount,\n  totalTraceCount,\n  isUnavailable,\n  onViewDetails,\n  onRemove,\n  onClear,\n}: {\n  selections: ThemeSelection[];\n  filteredTraceCount?: number;\n  totalTraceCount: number;\n  isUnavailable?: boolean;\n  onViewDetails: (selection: ThemeSelection) => void;\n  onRemove: (signalName: ThemeSelection['signalName']) => void;\n  onClear: () => void;\n}) {\n  const { signalCatalog } = useTraceIntelligence();\n  const colors = selections.map(selection => getSignalColor(selection.signalName));\n  const latestSelection = selections.at(-1);\n  const borderGradient = `linear-gradient(90deg, ${colors.length > 1 ? colors.join(', ') : `${colors[0]}, ${colors[0]}`})`;\n\n  return (\n    <section\n      aria-label=\"Active theme drill-in\"\n      className=\"relative flex flex-wrap items-center gap-x-4 gap-y-2 rounded-lg border border-transparent px-3 py-2\"\n      style={{\n        backgroundImage: `linear-gradient(var(--card), var(--card)), ${borderGradient}`,\n        backgroundClip: 'padding-box, border-box',\n      }}\n    >\n      {selections.map((selection, index) => {\n        const color = colors[index];\n        return (\n          <button\n            key={selection.signalName}\n            aria-label={\n              selections.length === 1\n                ? `Clear ${selection.kind} filter`\n                : `Clear filter ${selectionLabel(signalCatalog, selection)}`\n            }\n            className=\"state-layer flex items-center gap-1.5 rounded-full border border-border bg-background py-1 pr-2 pl-2.5 text-column text-foreground\"\n            onClick={() => onRemove(selection.signalName)}\n            type=\"button\"\n          >\n            <span aria-hidden=\"true\" className=\"rounded-0.5 size-2\" style={{ backgroundColor: color }} />\n            {selectionLabel(signalCatalog, selection)}\n            <X aria-hidden=\"true\" className=\"size-3.5\" />\n          </button>\n        );\n      })}\n      <Txt as=\"span\" variant=\"caption\" tone=\"muted\">\n        {filterSummary({ selections, filteredTraceCount, totalTraceCount, isUnavailable })}\n      </Txt>\n      {!isUnavailable && filteredTraceCount !== undefined && latestSelection ? (\n        <Button\n          icon={<Eye />}\n          aria-label={\n            latestSelection.kind === 'theme'\n              ? `View theme details for ${latestSelection.label}`\n              : `View noise details for ${signalLabel(signalCatalog, latestSelection.signalName)}`\n          }\n          onClick={() => onViewDetails(latestSelection)}\n          size=\"sm\"\n          type=\"button\"\n          variant=\"ghost\"\n        >\n          Details →\n        </Button>\n      ) : null}\n      {selections.length > 1 ? (\n        <Button icon={<X />} onClick={onClear} size=\"sm\" type=\"button\" variant=\"ghost\">\n          Clear all\n        </Button>\n      ) : null}\n    </section>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/ee/signals/theme-lifelines.cjs.js

@@ -10,6 +10,7 @@ const ee_signals_signalsErrorState = require('./signals-error-state.cjs.js');
 const ee_signals_signalsLoadingSkeleton = require('./signals-loading-skeleton.cjs.js');
 const ee_signals_snapshotTimeline = require('./snapshot-timeline.cjs.js');
 const ee_signals_snapshotTimelineData = require('./snapshot-timeline-data.cjs.js');
+const Txt = require('../../Txt-DPmEpNbp.cjs');
 
 function ThemeLifelines({
   entityId,
@@ -56,7 +57,7 @@ function ThemeLifelines({
       ),
       /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", className: "w-9 shrink-0" })
     ] }),
-    snapshots[selectedIndex] ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-mono text-caption text-muted-foreground", "data-testid": "snapshot-summary", children: ee_signals_sankeySignalsData.snapshotSummaryLabel(snapshots[selectedIndex], flows[selectedIndex]) }) : null,
+    snapshots[selectedIndex] ? /* @__PURE__ */ jsxRuntime.jsx(Txt.Txt, { variant: "caption", tone: "muted", font: "mono", "data-testid": "snapshot-summary", children: ee_signals_sankeySignalsData.snapshotSummaryLabel(snapshots[selectedIndex], flows[selectedIndex]) }) : null,
     signalNames.map((signalName) => /* @__PURE__ */ jsxRuntime.jsx(
       ee_signals_signalLifelines.SignalLifelines,
       {

package/dist/ee/signals/theme-lifelines.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"theme-lifelines.cjs.js","sources":["../../../src/ee/signals/theme-lifelines.tsx"],"sourcesContent":["import { useThemeFlows } from './hooks/use-theme-flows';\nimport { snapshotSummaryLabel } from './sankey-signals-data';\nimport { SignalLifelines } from './signal-lifelines';\nimport { SignalsErrorState } from './signals-error-state';\nimport { SignalsFrameLoadingSkeleton } from './signals-loading-skeleton';\nimport { TimelineTrack } from './snapshot-timeline';\nimport type { TimelineMarkerKind } from './snapshot-timeline';\nimport { timelineTickPositions } from './snapshot-timeline-data';\nimport type { ThemeSelection } from './theme-drilldown-data';\nimport type { ThemeSnapshot, TraceSignalName } from './types';\n\n/**\n * Lifelines mode: every theme holds a fixed row while landmarks run left to\n * right on the shared time axis, so persistent themes read as spines and\n * transient ones as short-lived segments — change over time without replay.\n */\nexport function ThemeLifelines({\n  entityId,\n  entityType,\n  signalNames,\n  snapshots,\n  totalSnapshots,\n  selectedIndex,\n  onSnapshotSelect,\n  onThemeSelect,\n}: {\n  entityId: string;\n  entityType: string;\n  signalNames: TraceSignalName[];\n  snapshots: ThemeSnapshot[];\n  totalSnapshots: number;\n  selectedIndex: number;\n  onSnapshotSelect: (index: number) => void;\n  onThemeSelect: (selection: ThemeSelection, snapshotIndex: number) => void;\n}) {\n  const flowQueries = useThemeFlows(\n    entityId,\n    entityType,\n    signalNames,\n    snapshots.map(snapshot => snapshot.snapshotId),\n  );\n  const flows = flowQueries.map(query => query.data);\n  const failedFlowQueries = flowQueries.filter(query => query.isError);\n  const positions = timelineTickPositions(snapshots);\n\n  if (failedFlowQueries.length > 0) {\n    return (\n      <SignalsErrorState\n        message=\"Unable to load theme lifelines.\"\n        onRetry={() => void Promise.all(failedFlowQueries.map(query => query.refetch()))}\n      />\n    );\n  }\n\n  if (!flows.some(flow => flow !== undefined)) {\n    return (\n      <section aria-label=\"Theme lifelines\">\n        <SignalsFrameLoadingSkeleton />\n      </section>\n    );\n  }\n\n  return (\n    <section aria-label=\"Theme lifelines\" className=\"space-y-5\">\n      {/* Spacers mirror each row's label and count columns so the shared track aligns with the rows. */}\n      <div className=\"flex items-center gap-3\">\n        <span aria-hidden=\"true\" className=\"w-52 shrink-0\" />\n        <TimelineTrack\n          snapshots={snapshots}\n          totalCount={totalSnapshots}\n          markers={new Map<number, TimelineMarkerKind>([[selectedIndex, 'selected']])}\n          onTickSelect={onSnapshotSelect}\n        />\n        <span aria-hidden=\"true\" className=\"w-9 shrink-0\" />\n      </div>\n      {snapshots[selectedIndex] ? (\n        <p className=\"font-mono text-caption text-muted-foreground\" data-testid=\"snapshot-summary\">\n          {snapshotSummaryLabel(snapshots[selectedIndex], flows[selectedIndex])}\n        </p>\n      ) : null}\n      {signalNames.map(signalName => (\n        <SignalLifelines\n          key={signalName}\n          signalName={signalName}\n          flows={flows}\n          snapshots={snapshots}\n          positions={positions}\n          onThemeSelect={onThemeSelect}\n        />\n      ))}\n    </section>\n  );\n}\n"],"names":["useThemeFlows","timelineTickPositions","jsx","SignalsErrorState","SignalsFrameLoadingSkeleton","jsxs","TimelineTrack","snapshotSummaryLabel","SignalLifelines"],"mappings":";;;;;;;;;;;;;AAgBO,SAAS,cAAA,CAAe;AAAA,EAC7B,QAAA;AAAA,EACA,UAAA;AAAA,EACA,WAAA;AAAA,EACA,SAAA;AAAA,EACA,cAAA;AAAA,EACA,aAAA;AAAA,EACA,gBAAA;AAAA,EACA;AACF,CAAA,EASG;AACD,EAAA,MAAM,WAAA,GAAcA,4CAAA;AAAA,IAClB,QAAA;AAAA,IACA,UAAA;AAAA,IACA,WAAA;AAAA,IACA,SAAA,CAAU,GAAA,CAAI,CAAA,QAAA,KAAY,QAAA,CAAS,UAAU;AAAA,GAC/C;AACA,EAAA,MAAM,KAAA,GAAQ,WAAA,CAAY,GAAA,CAAI,CAAA,KAAA,KAAS,MAAM,IAAI,CAAA;AACjD,EAAA,MAAM,iBAAA,GAAoB,WAAA,CAAY,MAAA,CAAO,CAAA,KAAA,KAAS,MAAM,OAAO,CAAA;AACnE,EAAA,MAAM,SAAA,GAAYC,sDAAsB,SAAS,CAAA;AAEjD,EAAA,IAAI,iBAAA,CAAkB,SAAS,CAAA,EAAG;AAChC,IAAA,uBACEC,cAAA;AAAA,MAACC,8CAAA;AAAA,MAAA;AAAA,QACC,OAAA,EAAQ,iCAAA;AAAA,QACR,OAAA,EAAS,MAAM,KAAK,OAAA,CAAQ,GAAA,CAAI,iBAAA,CAAkB,GAAA,CAAI,CAAA,KAAA,KAAS,KAAA,CAAM,OAAA,EAAS,CAAC;AAAA;AAAA,KACjF;AAAA,EAEJ;AAEA,EAAA,IAAI,CAAC,KAAA,CAAM,IAAA,CAAK,CAAA,IAAA,KAAQ,IAAA,KAAS,MAAS,CAAA,EAAG;AAC3C,IAAA,sCACG,SAAA,EAAA,EAAQ,YAAA,EAAW,iBAAA,EAClB,QAAA,kBAAAD,cAAA,CAACE,iEAA4B,CAAA,EAC/B,CAAA;AAAA,EAEJ;AAEA,EAAA,uBACEC,eAAA,CAAC,SAAA,EAAA,EAAQ,YAAA,EAAW,iBAAA,EAAkB,WAAU,WAAA,EAE9C,QAAA,EAAA;AAAA,oBAAAA,eAAA,CAAC,KAAA,EAAA,EAAI,WAAU,yBAAA,EACb,QAAA,EAAA;AAAA,sBAAAH,cAAA,CAAC,MAAA,EAAA,EAAK,aAAA,EAAY,MAAA,EAAO,SAAA,EAAU,eAAA,EAAgB,CAAA;AAAA,sBACnDA,cAAA;AAAA,QAACI,yCAAA;AAAA,QAAA;AAAA,UACC,SAAA;AAAA,UACA,UAAA,EAAY,cAAA;AAAA,UACZ,OAAA,sBAAa,GAAA,CAAgC,CAAC,CAAC,aAAA,EAAe,UAAU,CAAC,CAAC,CAAA;AAAA,UAC1E,YAAA,EAAc;AAAA;AAAA,OAChB;AAAA,sBACAJ,cAAA,CAAC,MAAA,EAAA,EAAK,aAAA,EAAY,MAAA,EAAO,WAAU,cAAA,EAAe;AAAA,KAAA,EACpD,CAAA;AAAA,IACC,UAAU,aAAa,CAAA,mBACtBA,cAAA,CAAC,GAAA,EAAA,EAAE,WAAU,8CAAA,EAA+C,aAAA,EAAY,kBAAA,EACrE,QAAA,EAAAK,iDAAA,CAAqB,UAAU,aAAa,CAAA,EAAG,MAAM,aAAa,CAAC,GACtE,CAAA,GACE,IAAA;AAAA,IACH,WAAA,CAAY,IAAI,CAAA,UAAA,qBACfL,cAAA;AAAA,MAACM,0CAAA;AAAA,MAAA;AAAA,QAEC,UAAA;AAAA,QACA,KAAA;AAAA,QACA,SAAA;AAAA,QACA,SAAA;AAAA,QACA;AAAA,OAAA;AAAA,MALK;AAAA,KAOR;AAAA,GAAA,EACH,CAAA;AAEJ;;;;"}
+{"version":3,"file":"theme-lifelines.cjs.js","sources":["../../../src/ee/signals/theme-lifelines.tsx"],"sourcesContent":["import { useThemeFlows } from './hooks/use-theme-flows';\nimport { snapshotSummaryLabel } from './sankey-signals-data';\nimport { SignalLifelines } from './signal-lifelines';\nimport { SignalsErrorState } from './signals-error-state';\nimport { SignalsFrameLoadingSkeleton } from './signals-loading-skeleton';\nimport { TimelineTrack } from './snapshot-timeline';\nimport type { TimelineMarkerKind } from './snapshot-timeline';\nimport { timelineTickPositions } from './snapshot-timeline-data';\nimport type { ThemeSelection } from './theme-drilldown-data';\nimport type { ThemeSnapshot, TraceSignalName } from './types';\nimport { Txt } from '@/ds/components/Txt';\n\n/**\n * Lifelines mode: every theme holds a fixed row while landmarks run left to\n * right on the shared time axis, so persistent themes read as spines and\n * transient ones as short-lived segments — change over time without replay.\n */\nexport function ThemeLifelines({\n  entityId,\n  entityType,\n  signalNames,\n  snapshots,\n  totalSnapshots,\n  selectedIndex,\n  onSnapshotSelect,\n  onThemeSelect,\n}: {\n  entityId: string;\n  entityType: string;\n  signalNames: TraceSignalName[];\n  snapshots: ThemeSnapshot[];\n  totalSnapshots: number;\n  selectedIndex: number;\n  onSnapshotSelect: (index: number) => void;\n  onThemeSelect: (selection: ThemeSelection, snapshotIndex: number) => void;\n}) {\n  const flowQueries = useThemeFlows(\n    entityId,\n    entityType,\n    signalNames,\n    snapshots.map(snapshot => snapshot.snapshotId),\n  );\n  const flows = flowQueries.map(query => query.data);\n  const failedFlowQueries = flowQueries.filter(query => query.isError);\n  const positions = timelineTickPositions(snapshots);\n\n  if (failedFlowQueries.length > 0) {\n    return (\n      <SignalsErrorState\n        message=\"Unable to load theme lifelines.\"\n        onRetry={() => void Promise.all(failedFlowQueries.map(query => query.refetch()))}\n      />\n    );\n  }\n\n  if (!flows.some(flow => flow !== undefined)) {\n    return (\n      <section aria-label=\"Theme lifelines\">\n        <SignalsFrameLoadingSkeleton />\n      </section>\n    );\n  }\n\n  return (\n    <section aria-label=\"Theme lifelines\" className=\"space-y-5\">\n      {/* Spacers mirror each row's label and count columns so the shared track aligns with the rows. */}\n      <div className=\"flex items-center gap-3\">\n        <span aria-hidden=\"true\" className=\"w-52 shrink-0\" />\n        <TimelineTrack\n          snapshots={snapshots}\n          totalCount={totalSnapshots}\n          markers={new Map<number, TimelineMarkerKind>([[selectedIndex, 'selected']])}\n          onTickSelect={onSnapshotSelect}\n        />\n        <span aria-hidden=\"true\" className=\"w-9 shrink-0\" />\n      </div>\n      {snapshots[selectedIndex] ? (\n        <Txt variant=\"caption\" tone=\"muted\" font=\"mono\" data-testid=\"snapshot-summary\">\n          {snapshotSummaryLabel(snapshots[selectedIndex], flows[selectedIndex])}\n        </Txt>\n      ) : null}\n      {signalNames.map(signalName => (\n        <SignalLifelines\n          key={signalName}\n          signalName={signalName}\n          flows={flows}\n          snapshots={snapshots}\n          positions={positions}\n          onThemeSelect={onThemeSelect}\n        />\n      ))}\n    </section>\n  );\n}\n"],"names":["useThemeFlows","timelineTickPositions","jsx","SignalsErrorState","SignalsFrameLoadingSkeleton","jsxs","TimelineTrack","Txt","SignalLifelines"],"mappings":";;;;;;;;;;;;;;AAiBO,SAAS,cAAA,CAAe;AAAA,EAC7B,QAAA;AAAA,EACA,UAAA;AAAA,EACA,WAAA;AAAA,EACA,SAAA;AAAA,EACA,cAAA;AAAA,EACA,aAAA;AAAA,EACA,gBAAA;AAAA,EACA;AACF,CAAA,EASG;AACD,EAAA,MAAM,WAAA,GAAcA,4CAAA;AAAA,IAClB,QAAA;AAAA,IACA,UAAA;AAAA,IACA,WAAA;AAAA,IACA,SAAA,CAAU,GAAA,CAAI,CAAA,QAAA,KAAY,QAAA,CAAS,UAAU;AAAA,GAC/C;AACA,EAAA,MAAM,KAAA,GAAQ,WAAA,CAAY,GAAA,CAAI,CAAA,KAAA,KAAS,MAAM,IAAI,CAAA;AACjD,EAAA,MAAM,iBAAA,GAAoB,WAAA,CAAY,MAAA,CAAO,CAAA,KAAA,KAAS,MAAM,OAAO,CAAA;AACnE,EAAA,MAAM,SAAA,GAAYC,sDAAsB,SAAS,CAAA;AAEjD,EAAA,IAAI,iBAAA,CAAkB,SAAS,CAAA,EAAG;AAChC,IAAA,uBACEC,cAAA;AAAA,MAACC,8CAAA;AAAA,MAAA;AAAA,QACC,OAAA,EAAQ,iCAAA;AAAA,QACR,OAAA,EAAS,MAAM,KAAK,OAAA,CAAQ,GAAA,CAAI,iBAAA,CAAkB,GAAA,CAAI,CAAA,KAAA,KAAS,KAAA,CAAM,OAAA,EAAS,CAAC;AAAA;AAAA,KACjF;AAAA,EAEJ;AAEA,EAAA,IAAI,CAAC,KAAA,CAAM,IAAA,CAAK,CAAA,IAAA,KAAQ,IAAA,KAAS,MAAS,CAAA,EAAG;AAC3C,IAAA,sCACG,SAAA,EAAA,EAAQ,YAAA,EAAW,iBAAA,EAClB,QAAA,kBAAAD,cAAA,CAACE,iEAA4B,CAAA,EAC/B,CAAA;AAAA,EAEJ;AAEA,EAAA,uBACEC,eAAA,CAAC,SAAA,EAAA,EAAQ,YAAA,EAAW,iBAAA,EAAkB,WAAU,WAAA,EAE9C,QAAA,EAAA;AAAA,oBAAAA,eAAA,CAAC,KAAA,EAAA,EAAI,WAAU,yBAAA,EACb,QAAA,EAAA;AAAA,sBAAAH,cAAA,CAAC,MAAA,EAAA,EAAK,aAAA,EAAY,MAAA,EAAO,SAAA,EAAU,eAAA,EAAgB,CAAA;AAAA,sBACnDA,cAAA;AAAA,QAACI,yCAAA;AAAA,QAAA;AAAA,UACC,SAAA;AAAA,UACA,UAAA,EAAY,cAAA;AAAA,UACZ,OAAA,sBAAa,GAAA,CAAgC,CAAC,CAAC,aAAA,EAAe,UAAU,CAAC,CAAC,CAAA;AAAA,UAC1E,YAAA,EAAc;AAAA;AAAA,OAChB;AAAA,sBACAJ,cAAA,CAAC,MAAA,EAAA,EAAK,aAAA,EAAY,MAAA,EAAO,WAAU,cAAA,EAAe;AAAA,KAAA,EACpD,CAAA;AAAA,IACC,SAAA,CAAU,aAAa,CAAA,mBACtBA,cAAA,CAACK,WAAI,OAAA,EAAQ,SAAA,EAAU,MAAK,OAAA,EAAQ,IAAA,EAAK,QAAO,aAAA,EAAY,kBAAA,EACzD,4DAAqB,SAAA,CAAU,aAAa,GAAG,KAAA,CAAM,aAAa,CAAC,CAAA,EACtE,CAAA,GACE,IAAA;AAAA,IACH,WAAA,CAAY,IAAI,CAAA,UAAA,qBACfL,cAAA;AAAA,MAACM,0CAAA;AAAA,MAAA;AAAA,QAEC,UAAA;AAAA,QACA,KAAA;AAAA,QACA,SAAA;AAAA,QACA,SAAA;AAAA,QACA;AAAA,OAAA;AAAA,MALK;AAAA,KAOR;AAAA,GAAA,EACH,CAAA;AAEJ;;;;"}

package/dist/ee/signals/theme-lifelines.es.js

@@ -6,6 +6,7 @@ import { SignalsErrorState } from './signals-error-state.es.js';
 import { SignalsFrameLoadingSkeleton } from './signals-loading-skeleton.es.js';
 import { TimelineTrack } from './snapshot-timeline.es.js';
 import { timelineTickPositions } from './snapshot-timeline-data.es.js';
+import { T as Txt } from '../../Txt-BP1SRHmL.js';
 
 function ThemeLifelines({
   entityId,
@@ -52,7 +53,7 @@ function ThemeLifelines({
       ),
       /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "w-9 shrink-0" })
     ] }),
-    snapshots[selectedIndex] ? /* @__PURE__ */ jsx("p", { className: "font-mono text-caption text-muted-foreground", "data-testid": "snapshot-summary", children: snapshotSummaryLabel(snapshots[selectedIndex], flows[selectedIndex]) }) : null,
+    snapshots[selectedIndex] ? /* @__PURE__ */ jsx(Txt, { variant: "caption", tone: "muted", font: "mono", "data-testid": "snapshot-summary", children: snapshotSummaryLabel(snapshots[selectedIndex], flows[selectedIndex]) }) : null,
     signalNames.map((signalName) => /* @__PURE__ */ jsx(
       SignalLifelines,
       {

package/dist/ee/signals/theme-lifelines.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"theme-lifelines.es.js","sources":["../../../src/ee/signals/theme-lifelines.tsx"],"sourcesContent":["import { useThemeFlows } from './hooks/use-theme-flows';\nimport { snapshotSummaryLabel } from './sankey-signals-data';\nimport { SignalLifelines } from './signal-lifelines';\nimport { SignalsErrorState } from './signals-error-state';\nimport { SignalsFrameLoadingSkeleton } from './signals-loading-skeleton';\nimport { TimelineTrack } from './snapshot-timeline';\nimport type { TimelineMarkerKind } from './snapshot-timeline';\nimport { timelineTickPositions } from './snapshot-timeline-data';\nimport type { ThemeSelection } from './theme-drilldown-data';\nimport type { ThemeSnapshot, TraceSignalName } from './types';\n\n/**\n * Lifelines mode: every theme holds a fixed row while landmarks run left to\n * right on the shared time axis, so persistent themes read as spines and\n * transient ones as short-lived segments — change over time without replay.\n */\nexport function ThemeLifelines({\n  entityId,\n  entityType,\n  signalNames,\n  snapshots,\n  totalSnapshots,\n  selectedIndex,\n  onSnapshotSelect,\n  onThemeSelect,\n}: {\n  entityId: string;\n  entityType: string;\n  signalNames: TraceSignalName[];\n  snapshots: ThemeSnapshot[];\n  totalSnapshots: number;\n  selectedIndex: number;\n  onSnapshotSelect: (index: number) => void;\n  onThemeSelect: (selection: ThemeSelection, snapshotIndex: number) => void;\n}) {\n  const flowQueries = useThemeFlows(\n    entityId,\n    entityType,\n    signalNames,\n    snapshots.map(snapshot => snapshot.snapshotId),\n  );\n  const flows = flowQueries.map(query => query.data);\n  const failedFlowQueries = flowQueries.filter(query => query.isError);\n  const positions = timelineTickPositions(snapshots);\n\n  if (failedFlowQueries.length > 0) {\n    return (\n      <SignalsErrorState\n        message=\"Unable to load theme lifelines.\"\n        onRetry={() => void Promise.all(failedFlowQueries.map(query => query.refetch()))}\n      />\n    );\n  }\n\n  if (!flows.some(flow => flow !== undefined)) {\n    return (\n      <section aria-label=\"Theme lifelines\">\n        <SignalsFrameLoadingSkeleton />\n      </section>\n    );\n  }\n\n  return (\n    <section aria-label=\"Theme lifelines\" className=\"space-y-5\">\n      {/* Spacers mirror each row's label and count columns so the shared track aligns with the rows. */}\n      <div className=\"flex items-center gap-3\">\n        <span aria-hidden=\"true\" className=\"w-52 shrink-0\" />\n        <TimelineTrack\n          snapshots={snapshots}\n          totalCount={totalSnapshots}\n          markers={new Map<number, TimelineMarkerKind>([[selectedIndex, 'selected']])}\n          onTickSelect={onSnapshotSelect}\n        />\n        <span aria-hidden=\"true\" className=\"w-9 shrink-0\" />\n      </div>\n      {snapshots[selectedIndex] ? (\n        <p className=\"font-mono text-caption text-muted-foreground\" data-testid=\"snapshot-summary\">\n          {snapshotSummaryLabel(snapshots[selectedIndex], flows[selectedIndex])}\n        </p>\n      ) : null}\n      {signalNames.map(signalName => (\n        <SignalLifelines\n          key={signalName}\n          signalName={signalName}\n          flows={flows}\n          snapshots={snapshots}\n          positions={positions}\n          onThemeSelect={onThemeSelect}\n        />\n      ))}\n    </section>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;AAgBO,SAAS,cAAA,CAAe;AAAA,EAC7B,QAAA;AAAA,EACA,UAAA;AAAA,EACA,WAAA;AAAA,EACA,SAAA;AAAA,EACA,cAAA;AAAA,EACA,aAAA;AAAA,EACA,gBAAA;AAAA,EACA;AACF,CAAA,EASG;AACD,EAAA,MAAM,WAAA,GAAc,aAAA;AAAA,IAClB,QAAA;AAAA,IACA,UAAA;AAAA,IACA,WAAA;AAAA,IACA,SAAA,CAAU,GAAA,CAAI,CAAA,QAAA,KAAY,QAAA,CAAS,UAAU;AAAA,GAC/C;AACA,EAAA,MAAM,KAAA,GAAQ,WAAA,CAAY,GAAA,CAAI,CAAA,KAAA,KAAS,MAAM,IAAI,CAAA;AACjD,EAAA,MAAM,iBAAA,GAAoB,WAAA,CAAY,MAAA,CAAO,CAAA,KAAA,KAAS,MAAM,OAAO,CAAA;AACnE,EAAA,MAAM,SAAA,GAAY,sBAAsB,SAAS,CAAA;AAEjD,EAAA,IAAI,iBAAA,CAAkB,SAAS,CAAA,EAAG;AAChC,IAAA,uBACE,GAAA;AAAA,MAAC,iBAAA;AAAA,MAAA;AAAA,QACC,OAAA,EAAQ,iCAAA;AAAA,QACR,OAAA,EAAS,MAAM,KAAK,OAAA,CAAQ,GAAA,CAAI,iBAAA,CAAkB,GAAA,CAAI,CAAA,KAAA,KAAS,KAAA,CAAM,OAAA,EAAS,CAAC;AAAA;AAAA,KACjF;AAAA,EAEJ;AAEA,EAAA,IAAI,CAAC,KAAA,CAAM,IAAA,CAAK,CAAA,IAAA,KAAQ,IAAA,KAAS,MAAS,CAAA,EAAG;AAC3C,IAAA,2BACG,SAAA,EAAA,EAAQ,YAAA,EAAW,iBAAA,EAClB,QAAA,kBAAA,GAAA,CAAC,+BAA4B,CAAA,EAC/B,CAAA;AAAA,EAEJ;AAEA,EAAA,uBACE,IAAA,CAAC,SAAA,EAAA,EAAQ,YAAA,EAAW,iBAAA,EAAkB,WAAU,WAAA,EAE9C,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,yBAAA,EACb,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,MAAA,EAAA,EAAK,aAAA,EAAY,MAAA,EAAO,SAAA,EAAU,eAAA,EAAgB,CAAA;AAAA,sBACnD,GAAA;AAAA,QAAC,aAAA;AAAA,QAAA;AAAA,UACC,SAAA;AAAA,UACA,UAAA,EAAY,cAAA;AAAA,UACZ,OAAA,sBAAa,GAAA,CAAgC,CAAC,CAAC,aAAA,EAAe,UAAU,CAAC,CAAC,CAAA;AAAA,UAC1E,YAAA,EAAc;AAAA;AAAA,OAChB;AAAA,sBACA,GAAA,CAAC,MAAA,EAAA,EAAK,aAAA,EAAY,MAAA,EAAO,WAAU,cAAA,EAAe;AAAA,KAAA,EACpD,CAAA;AAAA,IACC,UAAU,aAAa,CAAA,mBACtB,GAAA,CAAC,GAAA,EAAA,EAAE,WAAU,8CAAA,EAA+C,aAAA,EAAY,kBAAA,EACrE,QAAA,EAAA,oBAAA,CAAqB,UAAU,aAAa,CAAA,EAAG,MAAM,aAAa,CAAC,GACtE,CAAA,GACE,IAAA;AAAA,IACH,WAAA,CAAY,IAAI,CAAA,UAAA,qBACf,GAAA;AAAA,MAAC,eAAA;AAAA,MAAA;AAAA,QAEC,UAAA;AAAA,QACA,KAAA;AAAA,QACA,SAAA;AAAA,QACA,SAAA;AAAA,QACA;AAAA,OAAA;AAAA,MALK;AAAA,KAOR;AAAA,GAAA,EACH,CAAA;AAEJ;;;;"}
+{"version":3,"file":"theme-lifelines.es.js","sources":["../../../src/ee/signals/theme-lifelines.tsx"],"sourcesContent":["import { useThemeFlows } from './hooks/use-theme-flows';\nimport { snapshotSummaryLabel } from './sankey-signals-data';\nimport { SignalLifelines } from './signal-lifelines';\nimport { SignalsErrorState } from './signals-error-state';\nimport { SignalsFrameLoadingSkeleton } from './signals-loading-skeleton';\nimport { TimelineTrack } from './snapshot-timeline';\nimport type { TimelineMarkerKind } from './snapshot-timeline';\nimport { timelineTickPositions } from './snapshot-timeline-data';\nimport type { ThemeSelection } from './theme-drilldown-data';\nimport type { ThemeSnapshot, TraceSignalName } from './types';\nimport { Txt } from '@/ds/components/Txt';\n\n/**\n * Lifelines mode: every theme holds a fixed row while landmarks run left to\n * right on the shared time axis, so persistent themes read as spines and\n * transient ones as short-lived segments — change over time without replay.\n */\nexport function ThemeLifelines({\n  entityId,\n  entityType,\n  signalNames,\n  snapshots,\n  totalSnapshots,\n  selectedIndex,\n  onSnapshotSelect,\n  onThemeSelect,\n}: {\n  entityId: string;\n  entityType: string;\n  signalNames: TraceSignalName[];\n  snapshots: ThemeSnapshot[];\n  totalSnapshots: number;\n  selectedIndex: number;\n  onSnapshotSelect: (index: number) => void;\n  onThemeSelect: (selection: ThemeSelection, snapshotIndex: number) => void;\n}) {\n  const flowQueries = useThemeFlows(\n    entityId,\n    entityType,\n    signalNames,\n    snapshots.map(snapshot => snapshot.snapshotId),\n  );\n  const flows = flowQueries.map(query => query.data);\n  const failedFlowQueries = flowQueries.filter(query => query.isError);\n  const positions = timelineTickPositions(snapshots);\n\n  if (failedFlowQueries.length > 0) {\n    return (\n      <SignalsErrorState\n        message=\"Unable to load theme lifelines.\"\n        onRetry={() => void Promise.all(failedFlowQueries.map(query => query.refetch()))}\n      />\n    );\n  }\n\n  if (!flows.some(flow => flow !== undefined)) {\n    return (\n      <section aria-label=\"Theme lifelines\">\n        <SignalsFrameLoadingSkeleton />\n      </section>\n    );\n  }\n\n  return (\n    <section aria-label=\"Theme lifelines\" className=\"space-y-5\">\n      {/* Spacers mirror each row's label and count columns so the shared track aligns with the rows. */}\n      <div className=\"flex items-center gap-3\">\n        <span aria-hidden=\"true\" className=\"w-52 shrink-0\" />\n        <TimelineTrack\n          snapshots={snapshots}\n          totalCount={totalSnapshots}\n          markers={new Map<number, TimelineMarkerKind>([[selectedIndex, 'selected']])}\n          onTickSelect={onSnapshotSelect}\n        />\n        <span aria-hidden=\"true\" className=\"w-9 shrink-0\" />\n      </div>\n      {snapshots[selectedIndex] ? (\n        <Txt variant=\"caption\" tone=\"muted\" font=\"mono\" data-testid=\"snapshot-summary\">\n          {snapshotSummaryLabel(snapshots[selectedIndex], flows[selectedIndex])}\n        </Txt>\n      ) : null}\n      {signalNames.map(signalName => (\n        <SignalLifelines\n          key={signalName}\n          signalName={signalName}\n          flows={flows}\n          snapshots={snapshots}\n          positions={positions}\n          onThemeSelect={onThemeSelect}\n        />\n      ))}\n    </section>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;AAiBO,SAAS,cAAA,CAAe;AAAA,EAC7B,QAAA;AAAA,EACA,UAAA;AAAA,EACA,WAAA;AAAA,EACA,SAAA;AAAA,EACA,cAAA;AAAA,EACA,aAAA;AAAA,EACA,gBAAA;AAAA,EACA;AACF,CAAA,EASG;AACD,EAAA,MAAM,WAAA,GAAc,aAAA;AAAA,IAClB,QAAA;AAAA,IACA,UAAA;AAAA,IACA,WAAA;AAAA,IACA,SAAA,CAAU,GAAA,CAAI,CAAA,QAAA,KAAY,QAAA,CAAS,UAAU;AAAA,GAC/C;AACA,EAAA,MAAM,KAAA,GAAQ,WAAA,CAAY,GAAA,CAAI,CAAA,KAAA,KAAS,MAAM,IAAI,CAAA;AACjD,EAAA,MAAM,iBAAA,GAAoB,WAAA,CAAY,MAAA,CAAO,CAAA,KAAA,KAAS,MAAM,OAAO,CAAA;AACnE,EAAA,MAAM,SAAA,GAAY,sBAAsB,SAAS,CAAA;AAEjD,EAAA,IAAI,iBAAA,CAAkB,SAAS,CAAA,EAAG;AAChC,IAAA,uBACE,GAAA;AAAA,MAAC,iBAAA;AAAA,MAAA;AAAA,QACC,OAAA,EAAQ,iCAAA;AAAA,QACR,OAAA,EAAS,MAAM,KAAK,OAAA,CAAQ,GAAA,CAAI,iBAAA,CAAkB,GAAA,CAAI,CAAA,KAAA,KAAS,KAAA,CAAM,OAAA,EAAS,CAAC;AAAA;AAAA,KACjF;AAAA,EAEJ;AAEA,EAAA,IAAI,CAAC,KAAA,CAAM,IAAA,CAAK,CAAA,IAAA,KAAQ,IAAA,KAAS,MAAS,CAAA,EAAG;AAC3C,IAAA,2BACG,SAAA,EAAA,EAAQ,YAAA,EAAW,iBAAA,EAClB,QAAA,kBAAA,GAAA,CAAC,+BAA4B,CAAA,EAC/B,CAAA;AAAA,EAEJ;AAEA,EAAA,uBACE,IAAA,CAAC,SAAA,EAAA,EAAQ,YAAA,EAAW,iBAAA,EAAkB,WAAU,WAAA,EAE9C,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,yBAAA,EACb,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,MAAA,EAAA,EAAK,aAAA,EAAY,MAAA,EAAO,SAAA,EAAU,eAAA,EAAgB,CAAA;AAAA,sBACnD,GAAA;AAAA,QAAC,aAAA;AAAA,QAAA;AAAA,UACC,SAAA;AAAA,UACA,UAAA,EAAY,cAAA;AAAA,UACZ,OAAA,sBAAa,GAAA,CAAgC,CAAC,CAAC,aAAA,EAAe,UAAU,CAAC,CAAC,CAAA;AAAA,UAC1E,YAAA,EAAc;AAAA;AAAA,OAChB;AAAA,sBACA,GAAA,CAAC,MAAA,EAAA,EAAK,aAAA,EAAY,MAAA,EAAO,WAAU,cAAA,EAAe;AAAA,KAAA,EACpD,CAAA;AAAA,IACC,SAAA,CAAU,aAAa,CAAA,mBACtB,GAAA,CAAC,OAAI,OAAA,EAAQ,SAAA,EAAU,MAAK,OAAA,EAAQ,IAAA,EAAK,QAAO,aAAA,EAAY,kBAAA,EACzD,+BAAqB,SAAA,CAAU,aAAa,GAAG,KAAA,CAAM,aAAa,CAAC,CAAA,EACtE,CAAA,GACE,IAAA;AAAA,IACH,WAAA,CAAY,IAAI,CAAA,UAAA,qBACf,GAAA;AAAA,MAAC,eAAA;AAAA,MAAA;AAAA,QAEC,UAAA;AAAA,QACA,KAAA;AAAA,QACA,SAAA;AAAA,QACA,SAAA;AAAA,QACA;AAAA,OAAA;AAAA,MALK;AAAA,KAOR;AAAA,GAAA,EACH,CAAA;AAEJ;;;;"}

package/dist/ee/signals/theme-trend-chart.cjs.js

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 
 const jsxRuntime = require('react/jsx-runtime');
+const ee_signals_signalColors = require('./signal-colors.cjs.js');
 const ee_signals_signalFormatting = require('./signal-formatting.cjs.js');
 const tooltip = require('../../tooltip-DIZ5oqjV.cjs');
 
@@ -10,7 +11,8 @@ const TREND_CHART_HEIGHT = 32;
 function trendPointLabel(point) {
   return `${ee_signals_signalFormatting.formatSnapshotDate(point.startedAt)} · ${ee_signals_signalFormatting.traceLabel(point.traceCount)} (${Math.round(point.coverage * 100)}%)`;
 }
-function ThemeTrendChart({ points, color }) {
+function ThemeTrendChart({ points, signalName }) {
+  const color = ee_signals_signalColors.getSignalColor(signalName);
   const firstPoint = points[0];
   const lastPoint = points.at(-1);
   if (!firstPoint || !lastPoint) return null;
@@ -34,8 +36,7 @@ function ThemeTrendChart({ points, color }) {
             /* @__PURE__ */ jsxRuntime.jsx(
               "polygon",
               {
-                fill: color,
-                fillOpacity: 0.14,
+                className: ee_signals_signalColors.getSignalAreaClass(signalName),
                 points: [`0,${TREND_CHART_HEIGHT}`, ...coordinates, `100,${TREND_CHART_HEIGHT}`].join(" ")
               }
             ),
@@ -44,7 +45,6 @@ function ThemeTrendChart({ points, color }) {
               {
                 fill: "none",
                 stroke: color,
-                strokeOpacity: 0.7,
                 strokeWidth: 1.2,
                 vectorEffect: "non-scaling-stroke",
                 points: coordinates.join(" ")
@@ -60,7 +60,7 @@ function ThemeTrendChart({ points, color }) {
             tooltip.TooltipTrigger,
             {
               "aria-label": label,
-              className: "absolute size-2 -translate-1/2 cursor-default rounded-full hover:brightness-125",
+              className: "absolute size-2 -translate-1/2 cursor-default rounded-full transition-transform hover:scale-150",
               style: {
                 left: `${x(point)}%`,
                 top: `${y(point) / TREND_CHART_HEIGHT * 100}%`,

package/dist/ee/signals/theme-trend-chart.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"theme-trend-chart.cjs.js","sources":["../../../src/ee/signals/theme-trend-chart.tsx"],"sourcesContent":["import { formatSnapshotDate, traceLabel } from './signal-formatting';\nimport type { ThemeHistoryPoint } from './theme-trend';\nimport { Tooltip, TooltipContent, TooltipTrigger } from '@/ds/components/Tooltip';\n\nconst TREND_CHART_HEIGHT = 32;\n\nfunction trendPointLabel(point: ThemeHistoryPoint) {\n  return `${formatSnapshotDate(point.startedAt)} · ${traceLabel(point.traceCount)} (${Math.round(point.coverage * 100)}%)`;\n}\n\n/** Trace count over time for one theme, with absent stretches dropping to the baseline. */\nexport function ThemeTrendChart({ points, color }: { points: ThemeHistoryPoint[]; color: string }) {\n  const firstPoint = points[0];\n  const lastPoint = points.at(-1);\n  if (!firstPoint || !lastPoint) return null;\n\n  const firstTime = new Date(firstPoint.startedAt).getTime();\n  const lastTime = new Date(lastPoint.startedAt).getTime();\n  const timeSpan = lastTime - firstTime;\n  const maxCount = Math.max(1, ...points.map(point => point.traceCount));\n  const x = (point: ThemeHistoryPoint) =>\n    timeSpan === 0 ? 50 : ((new Date(point.startedAt).getTime() - firstTime) / timeSpan) * 100;\n  const y = (point: ThemeHistoryPoint) => (1 - point.traceCount / maxCount) * (TREND_CHART_HEIGHT - 4) + 2;\n  const coordinates = points.map(point => `${x(point)},${y(point)}`);\n\n  return (\n    <div className=\"mt-3\">\n      <div className=\"relative h-8\" data-testid=\"trend-chart\">\n        <svg\n          aria-hidden=\"true\"\n          className=\"pointer-events-none absolute inset-0 size-full\"\n          preserveAspectRatio=\"none\"\n          viewBox={`0 0 100 ${TREND_CHART_HEIGHT}`}\n        >\n          <polygon\n            fill={color}\n            fillOpacity={0.14}\n            points={[`0,${TREND_CHART_HEIGHT}`, ...coordinates, `100,${TREND_CHART_HEIGHT}`].join(' ')}\n          />\n          <polyline\n            fill=\"none\"\n            stroke={color}\n            strokeOpacity={0.7}\n            strokeWidth={1.2}\n            vectorEffect=\"non-scaling-stroke\"\n            points={coordinates.join(' ')}\n          />\n        </svg>\n        {points.map(point => {\n          const label = trendPointLabel(point);\n          return (\n            <Tooltip key={point.snapshotId}>\n              <TooltipTrigger\n                aria-label={label}\n                className=\"absolute size-2 -translate-1/2 cursor-default rounded-full hover:brightness-125\"\n                style={{\n                  left: `${x(point)}%`,\n                  top: `${(y(point) / TREND_CHART_HEIGHT) * 100}%`,\n                  backgroundColor: color,\n                }}\n              />\n              <TooltipContent>{label}</TooltipContent>\n            </Tooltip>\n          );\n        })}\n      </div>\n      <div className=\"mt-1 flex justify-between font-mono text-caption text-muted-foreground\">\n        <span>{formatSnapshotDate(firstPoint.startedAt)}</span>\n        <span>{formatSnapshotDate(lastPoint.startedAt)}</span>\n      </div>\n    </div>\n  );\n}\n"],"names":["formatSnapshotDate","traceLabel","jsxs","jsx","Tooltip","TooltipTrigger","TooltipContent"],"mappings":"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"}
+{"version":3,"file":"theme-trend-chart.cjs.js","sources":["../../../src/ee/signals/theme-trend-chart.tsx"],"sourcesContent":["import { getSignalAreaClass, getSignalColor } from './signal-colors';\nimport { formatSnapshotDate, traceLabel } from './signal-formatting';\nimport type { ThemeHistoryPoint } from './theme-trend';\nimport { Tooltip, TooltipContent, TooltipTrigger } from '@/ds/components/Tooltip';\n\nconst TREND_CHART_HEIGHT = 32;\n\nfunction trendPointLabel(point: ThemeHistoryPoint) {\n  return `${formatSnapshotDate(point.startedAt)} · ${traceLabel(point.traceCount)} (${Math.round(point.coverage * 100)}%)`;\n}\n\n/** Trace count over time for one theme, with absent stretches dropping to the baseline. */\nexport function ThemeTrendChart({ points, signalName }: { points: ThemeHistoryPoint[]; signalName: string }) {\n  const color = getSignalColor(signalName);\n  const firstPoint = points[0];\n  const lastPoint = points.at(-1);\n  if (!firstPoint || !lastPoint) return null;\n\n  const firstTime = new Date(firstPoint.startedAt).getTime();\n  const lastTime = new Date(lastPoint.startedAt).getTime();\n  const timeSpan = lastTime - firstTime;\n  const maxCount = Math.max(1, ...points.map(point => point.traceCount));\n  const x = (point: ThemeHistoryPoint) =>\n    timeSpan === 0 ? 50 : ((new Date(point.startedAt).getTime() - firstTime) / timeSpan) * 100;\n  const y = (point: ThemeHistoryPoint) => (1 - point.traceCount / maxCount) * (TREND_CHART_HEIGHT - 4) + 2;\n  const coordinates = points.map(point => `${x(point)},${y(point)}`);\n\n  return (\n    <div className=\"mt-3\">\n      <div className=\"relative h-8\" data-testid=\"trend-chart\">\n        <svg\n          aria-hidden=\"true\"\n          className=\"pointer-events-none absolute inset-0 size-full\"\n          preserveAspectRatio=\"none\"\n          viewBox={`0 0 100 ${TREND_CHART_HEIGHT}`}\n        >\n          <polygon\n            className={getSignalAreaClass(signalName)}\n            points={[`0,${TREND_CHART_HEIGHT}`, ...coordinates, `100,${TREND_CHART_HEIGHT}`].join(' ')}\n          />\n          <polyline\n            fill=\"none\"\n            stroke={color}\n            strokeWidth={1.2}\n            vectorEffect=\"non-scaling-stroke\"\n            points={coordinates.join(' ')}\n          />\n        </svg>\n        {points.map(point => {\n          const label = trendPointLabel(point);\n          return (\n            <Tooltip key={point.snapshotId}>\n              <TooltipTrigger\n                aria-label={label}\n                className=\"absolute size-2 -translate-1/2 cursor-default rounded-full transition-transform hover:scale-150\"\n                style={{\n                  left: `${x(point)}%`,\n                  top: `${(y(point) / TREND_CHART_HEIGHT) * 100}%`,\n                  backgroundColor: color,\n                }}\n              />\n              <TooltipContent>{label}</TooltipContent>\n            </Tooltip>\n          );\n        })}\n      </div>\n      <div className=\"mt-1 flex justify-between font-mono text-caption text-muted-foreground\">\n        <span>{formatSnapshotDate(firstPoint.startedAt)}</span>\n        <span>{formatSnapshotDate(lastPoint.startedAt)}</span>\n      </div>\n    </div>\n  );\n}\n"],"names":["formatSnapshotDate","traceLabel","getSignalColor","jsxs","jsx","getSignalAreaClass","Tooltip","TooltipTrigger","TooltipContent"],"mappings":"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"}

package/dist/ee/signals/theme-trend-chart.es.js

@@ -1,4 +1,5 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
+import { getSignalColor, getSignalAreaClass } from './signal-colors.es.js';
 import { formatSnapshotDate, traceLabel } from './signal-formatting.es.js';
 import { T as Tooltip, c as TooltipTrigger, a as TooltipContent } from '../../tooltip-DsQPiynb.js';
 
@@ -6,7 +7,8 @@ const TREND_CHART_HEIGHT = 32;
 function trendPointLabel(point) {
   return `${formatSnapshotDate(point.startedAt)} · ${traceLabel(point.traceCount)} (${Math.round(point.coverage * 100)}%)`;
 }
-function ThemeTrendChart({ points, color }) {
+function ThemeTrendChart({ points, signalName }) {
+  const color = getSignalColor(signalName);
   const firstPoint = points[0];
   const lastPoint = points.at(-1);
   if (!firstPoint || !lastPoint) return null;
@@ -30,8 +32,7 @@ function ThemeTrendChart({ points, color }) {
             /* @__PURE__ */ jsx(
               "polygon",
               {
-                fill: color,
-                fillOpacity: 0.14,
+                className: getSignalAreaClass(signalName),
                 points: [`0,${TREND_CHART_HEIGHT}`, ...coordinates, `100,${TREND_CHART_HEIGHT}`].join(" ")
               }
             ),
@@ -40,7 +41,6 @@ function ThemeTrendChart({ points, color }) {
               {
                 fill: "none",
                 stroke: color,
-                strokeOpacity: 0.7,
                 strokeWidth: 1.2,
                 vectorEffect: "non-scaling-stroke",
                 points: coordinates.join(" ")
@@ -56,7 +56,7 @@ function ThemeTrendChart({ points, color }) {
             TooltipTrigger,
             {
               "aria-label": label,
-              className: "absolute size-2 -translate-1/2 cursor-default rounded-full hover:brightness-125",
+              className: "absolute size-2 -translate-1/2 cursor-default rounded-full transition-transform hover:scale-150",
               style: {
                 left: `${x(point)}%`,
                 top: `${y(point) / TREND_CHART_HEIGHT * 100}%`,

package/dist/ee/signals/theme-trend-chart.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"theme-trend-chart.es.js","sources":["../../../src/ee/signals/theme-trend-chart.tsx"],"sourcesContent":["import { formatSnapshotDate, traceLabel } from './signal-formatting';\nimport type { ThemeHistoryPoint } from './theme-trend';\nimport { Tooltip, TooltipContent, TooltipTrigger } from '@/ds/components/Tooltip';\n\nconst TREND_CHART_HEIGHT = 32;\n\nfunction trendPointLabel(point: ThemeHistoryPoint) {\n  return `${formatSnapshotDate(point.startedAt)} · ${traceLabel(point.traceCount)} (${Math.round(point.coverage * 100)}%)`;\n}\n\n/** Trace count over time for one theme, with absent stretches dropping to the baseline. */\nexport function ThemeTrendChart({ points, color }: { points: ThemeHistoryPoint[]; color: string }) {\n  const firstPoint = points[0];\n  const lastPoint = points.at(-1);\n  if (!firstPoint || !lastPoint) return null;\n\n  const firstTime = new Date(firstPoint.startedAt).getTime();\n  const lastTime = new Date(lastPoint.startedAt).getTime();\n  const timeSpan = lastTime - firstTime;\n  const maxCount = Math.max(1, ...points.map(point => point.traceCount));\n  const x = (point: ThemeHistoryPoint) =>\n    timeSpan === 0 ? 50 : ((new Date(point.startedAt).getTime() - firstTime) / timeSpan) * 100;\n  const y = (point: ThemeHistoryPoint) => (1 - point.traceCount / maxCount) * (TREND_CHART_HEIGHT - 4) + 2;\n  const coordinates = points.map(point => `${x(point)},${y(point)}`);\n\n  return (\n    <div className=\"mt-3\">\n      <div className=\"relative h-8\" data-testid=\"trend-chart\">\n        <svg\n          aria-hidden=\"true\"\n          className=\"pointer-events-none absolute inset-0 size-full\"\n          preserveAspectRatio=\"none\"\n          viewBox={`0 0 100 ${TREND_CHART_HEIGHT}`}\n        >\n          <polygon\n            fill={color}\n            fillOpacity={0.14}\n            points={[`0,${TREND_CHART_HEIGHT}`, ...coordinates, `100,${TREND_CHART_HEIGHT}`].join(' ')}\n          />\n          <polyline\n            fill=\"none\"\n            stroke={color}\n            strokeOpacity={0.7}\n            strokeWidth={1.2}\n            vectorEffect=\"non-scaling-stroke\"\n            points={coordinates.join(' ')}\n          />\n        </svg>\n        {points.map(point => {\n          const label = trendPointLabel(point);\n          return (\n            <Tooltip key={point.snapshotId}>\n              <TooltipTrigger\n                aria-label={label}\n                className=\"absolute size-2 -translate-1/2 cursor-default rounded-full hover:brightness-125\"\n                style={{\n                  left: `${x(point)}%`,\n                  top: `${(y(point) / TREND_CHART_HEIGHT) * 100}%`,\n                  backgroundColor: color,\n                }}\n              />\n              <TooltipContent>{label}</TooltipContent>\n            </Tooltip>\n          );\n        })}\n      </div>\n      <div className=\"mt-1 flex justify-between font-mono text-caption text-muted-foreground\">\n        <span>{formatSnapshotDate(firstPoint.startedAt)}</span>\n        <span>{formatSnapshotDate(lastPoint.startedAt)}</span>\n      </div>\n    </div>\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"theme-trend-chart.es.js","sources":["../../../src/ee/signals/theme-trend-chart.tsx"],"sourcesContent":["import { getSignalAreaClass, getSignalColor } from './signal-colors';\nimport { formatSnapshotDate, traceLabel } from './signal-formatting';\nimport type { ThemeHistoryPoint } from './theme-trend';\nimport { Tooltip, TooltipContent, TooltipTrigger } from '@/ds/components/Tooltip';\n\nconst TREND_CHART_HEIGHT = 32;\n\nfunction trendPointLabel(point: ThemeHistoryPoint) {\n  return `${formatSnapshotDate(point.startedAt)} · ${traceLabel(point.traceCount)} (${Math.round(point.coverage * 100)}%)`;\n}\n\n/** Trace count over time for one theme, with absent stretches dropping to the baseline. */\nexport function ThemeTrendChart({ points, signalName }: { points: ThemeHistoryPoint[]; signalName: string }) {\n  const color = getSignalColor(signalName);\n  const firstPoint = points[0];\n  const lastPoint = points.at(-1);\n  if (!firstPoint || !lastPoint) return null;\n\n  const firstTime = new Date(firstPoint.startedAt).getTime();\n  const lastTime = new Date(lastPoint.startedAt).getTime();\n  const timeSpan = lastTime - firstTime;\n  const maxCount = Math.max(1, ...points.map(point => point.traceCount));\n  const x = (point: ThemeHistoryPoint) =>\n    timeSpan === 0 ? 50 : ((new Date(point.startedAt).getTime() - firstTime) / timeSpan) * 100;\n  const y = (point: ThemeHistoryPoint) => (1 - point.traceCount / maxCount) * (TREND_CHART_HEIGHT - 4) + 2;\n  const coordinates = points.map(point => `${x(point)},${y(point)}`);\n\n  return (\n    <div className=\"mt-3\">\n      <div className=\"relative h-8\" data-testid=\"trend-chart\">\n        <svg\n          aria-hidden=\"true\"\n          className=\"pointer-events-none absolute inset-0 size-full\"\n          preserveAspectRatio=\"none\"\n          viewBox={`0 0 100 ${TREND_CHART_HEIGHT}`}\n        >\n          <polygon\n            className={getSignalAreaClass(signalName)}\n            points={[`0,${TREND_CHART_HEIGHT}`, ...coordinates, `100,${TREND_CHART_HEIGHT}`].join(' ')}\n          />\n          <polyline\n            fill=\"none\"\n            stroke={color}\n            strokeWidth={1.2}\n            vectorEffect=\"non-scaling-stroke\"\n            points={coordinates.join(' ')}\n          />\n        </svg>\n        {points.map(point => {\n          const label = trendPointLabel(point);\n          return (\n            <Tooltip key={point.snapshotId}>\n              <TooltipTrigger\n                aria-label={label}\n                className=\"absolute size-2 -translate-1/2 cursor-default rounded-full transition-transform hover:scale-150\"\n                style={{\n                  left: `${x(point)}%`,\n                  top: `${(y(point) / TREND_CHART_HEIGHT) * 100}%`,\n                  backgroundColor: color,\n                }}\n              />\n              <TooltipContent>{label}</TooltipContent>\n            </Tooltip>\n          );\n        })}\n      </div>\n      <div className=\"mt-1 flex justify-between font-mono text-caption text-muted-foreground\">\n        <span>{formatSnapshotDate(firstPoint.startedAt)}</span>\n        <span>{formatSnapshotDate(lastPoint.startedAt)}</span>\n      </div>\n    </div>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/ee/signals/trace-insight-view.cjs.js

@@ -8,7 +8,8 @@ require('@tanstack/react-query');
 const ee_signals_useTraceIntelligence = require('./use-trace-intelligence.cjs.js');
 const ee_signals_hooks_useTraceInsight = require('./hooks/use-trace-insight.cjs.js');
 const ee_signals_signalFormatting = require('./signal-formatting.cjs.js');
-const Button = require('../../Button-CIwF6NHM.cjs');
+const Button = require('../../Button-BnmR2HRc.cjs');
+const Txt = require('../../Txt-DPmEpNbp.cjs');
 const icons_TraceIcon = require('../../icons/TraceIcon.cjs.js');
 const primitives_raisedSurface = require('../../primitives/raised-surface.cjs.js');
 const utils_cn = require('../../cn-DG0X1KEP.cjs');
@@ -21,8 +22,8 @@ function TraceInsightView({ traceId, onBack }) {
       /* @__PURE__ */ jsxRuntime.jsx(Button.Button, { icon: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronLeft, {}), size: "sm", onClick: onBack, children: "Back to examples" }),
       /* @__PURE__ */ jsxRuntime.jsx(Button.Button, { icon: /* @__PURE__ */ jsxRuntime.jsx(icons_TraceIcon.TraceIcon, {}), render: /* @__PURE__ */ jsxRuntime.jsx(LinkComponent, { href: getTraceHref(traceId) }), size: "sm", children: "Open full trace" })
     ] }),
-    insightQuery.isPending && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-body text-muted-foreground", children: "Loading trace insight…" }),
-    insightQuery.isError && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-body text-red-500", children: "Unable to load the trace insight." }),
+    insightQuery.isPending && /* @__PURE__ */ jsxRuntime.jsx(Txt.Txt, { tone: "muted", children: "Loading trace insight…" }),
+    insightQuery.isError && /* @__PURE__ */ jsxRuntime.jsx(Txt.Txt, { className: "text-destructive-indicator", children: "Unable to load the trace insight." }),
     insightQuery.data && /* @__PURE__ */ jsxRuntime.jsx(TraceInsightBody, { insight: insightQuery.data })
   ] });
 }
@@ -41,15 +42,15 @@ function parseTraceObservation(observation) {
 }
 const OBSERVATION_SEVERITY_CARD = {
   info: primitives_raisedSurface.raisedSurfaceStyle,
-  success: "border border-green-400/30 bg-green-500/10",
-  problem: "border border-red-400/30 bg-red-500/10"
+  success: "border border-success-edge bg-success-subtle",
+  problem: "border border-destructive-edge bg-destructive-subtle"
 };
 function ObservationItem({ observation }) {
   const { severity, kind, text } = parseTraceObservation(observation);
   return /* @__PURE__ */ jsxRuntime.jsxs("li", { className: `rounded-md p-3 text-body ${OBSERVATION_SEVERITY_CARD[severity ?? "info"]}`, children: [
-    kind !== void 0 && /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "font-mono text-meta tracking-wider text-muted-foreground uppercase", children: [
+    kind !== void 0 && /* @__PURE__ */ jsxRuntime.jsxs(Txt.Txt, { variant: "meta", tone: "muted", font: "mono", className: "tracking-wider uppercase", children: [
       severity === "problem" && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-red-400", children: "problem" }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-destructive-indicator", children: "problem" }),
         /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", children: " · " })
       ] }),
       /* @__PURE__ */ jsxRuntime.jsx("span", { children: kind })
@@ -60,27 +61,35 @@ function ObservationItem({ observation }) {
 function TraceInsightBody({ insight }) {
   const { signalCatalog } = ee_signals_useTraceIntelligence.useTraceIntelligence();
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    insight.summary === void 0 ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-body text-muted-foreground", children: "No insight available yet for this trace." }) : /* @__PURE__ */ jsxRuntime.jsxs("section", { "aria-labelledby": "trace-insight-summary-heading", children: [
+    insight.summary === void 0 ? /* @__PURE__ */ jsxRuntime.jsx(Txt.Txt, { tone: "muted", children: "No insight available yet for this trace." }) : /* @__PURE__ */ jsxRuntime.jsxs("section", { "aria-labelledby": "trace-insight-summary-heading", children: [
       /* @__PURE__ */ jsxRuntime.jsx(
-        "h2",
+        Txt.Txt,
         {
+          as: "h2",
+          variant: "caption",
+          tone: "muted",
+          font: "mono",
           id: "trace-insight-summary-heading",
-          className: "font-mono text-caption tracking-wider text-muted-foreground uppercase",
+          className: "tracking-wider uppercase",
           children: "Trace summary"
         }
       ),
-      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-3 text-body text-foreground", children: insight.summary.summary }),
+      /* @__PURE__ */ jsxRuntime.jsx(Txt.Txt, { tone: "ink", className: "mt-3", children: insight.summary.summary }),
       insight.summary.currentTask !== void 0 && /* @__PURE__ */ jsxRuntime.jsxs("dl", { className: "mt-4 text-body", children: [
         /* @__PURE__ */ jsxRuntime.jsx("dt", { className: "text-muted-foreground", children: "Current task" }),
         /* @__PURE__ */ jsxRuntime.jsx("dd", { className: "mt-1 text-foreground", children: insight.summary.currentTask })
       ] }),
-      insight.summary.degenerate === true && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-4 text-body text-red-500", children: "This trace was flagged as degenerate or looping." }),
+      insight.summary.degenerate === true && /* @__PURE__ */ jsxRuntime.jsx(Txt.Txt, { className: "mt-4 text-destructive-indicator", children: "This trace was flagged as degenerate or looping." }),
       insight.summary.observations.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
         /* @__PURE__ */ jsxRuntime.jsx(
-          "h3",
+          Txt.Txt,
           {
+            as: "h3",
+            variant: "caption",
+            tone: "muted",
+            font: "mono",
             id: "trace-insight-observations-heading",
-            className: "mt-4 font-mono text-caption tracking-wider text-muted-foreground uppercase",
+            className: "mt-4 tracking-wider uppercase",
             children: "Observations"
           }
         ),
@@ -89,10 +98,14 @@ function TraceInsightBody({ insight }) {
     ] }),
     insight.signals.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("section", { "aria-labelledby": "trace-insight-signals-heading", children: [
       /* @__PURE__ */ jsxRuntime.jsx(
-        "h2",
+        Txt.Txt,
         {
+          as: "h2",
+          variant: "caption",
+          tone: "muted",
+          font: "mono",
           id: "trace-insight-signals-heading",
-          className: "font-mono text-caption tracking-wider text-muted-foreground uppercase",
+          className: "tracking-wider uppercase",
           children: "Trace signal summaries"
         }
       ),

package/dist/ee/signals/trace-insight-view.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"trace-insight-view.cjs.js","sources":["../../../src/ee/signals/trace-insight-view.tsx"],"sourcesContent":["import { ChevronLeft } from 'lucide-react';\nimport { useTraceInsight } from './hooks';\nimport { signalLabel } from './signal-formatting';\nimport type { TraceInsightResponse } from './types';\nimport { useTraceIntelligence } from './use-trace-intelligence';\nimport { Button } from '@/ds/components/Button';\nimport { TraceIcon } from '@/ds/icons/TraceIcon';\nimport { raisedSurfaceStyle } from '@/ds/primitives/raised-surface';\nimport { cn } from '@/lib/utils';\n\ninterface TraceInsightViewProps {\n  traceId: string;\n  onBack: () => void;\n}\n\nexport function TraceInsightView({ traceId, onBack }: TraceInsightViewProps) {\n  const { LinkComponent, getTraceHref } = useTraceIntelligence();\n  const insightQuery = useTraceInsight(traceId);\n\n  return (\n    <div className=\"grid content-start gap-6\">\n      <div className=\"flex items-center justify-between gap-3\">\n        <Button icon={<ChevronLeft />} size=\"sm\" onClick={onBack}>\n          Back to examples\n        </Button>\n        <Button icon={<TraceIcon />} render={<LinkComponent href={getTraceHref(traceId)} />} size=\"sm\">\n          Open full trace\n        </Button>\n      </div>\n      {insightQuery.isPending && <p className=\"text-body text-muted-foreground\">Loading trace insight…</p>}\n      {insightQuery.isError && <p className=\"text-body text-red-500\">Unable to load the trace insight.</p>}\n      {insightQuery.data && <TraceInsightBody insight={insightQuery.data} />}\n    </div>\n  );\n}\n\ntype ObservationSeverity = 'info' | 'success' | 'problem';\n\ninterface ParsedObservation {\n  severity?: ObservationSeverity;\n  kind?: string;\n  text: string;\n}\n\nfunction isObservationSeverity(value: string): value is ObservationSeverity {\n  return value === 'info' || value === 'success' || value === 'problem';\n}\n\n/**\n * Trace summaries prefix each observation with a machine-readable\n * `severity=… | kind=… |` header (see the trace-summary prompt). Strip it for\n * display and keep the parts so the UI can render them as visual cues, the\n * same way the observational-memory views parse their emoji markers out of\n * the raw text.\n */\nfunction parseTraceObservation(observation: string): ParsedObservation {\n  const match = observation.match(/^severity=(\\w+)\\s*\\|\\s*kind=(\\w+)\\s*\\|\\s*/);\n  if (!match) return { text: observation };\n  const [prefix, severity, kind] = match;\n  return {\n    severity: severity !== undefined && isObservationSeverity(severity) ? severity : undefined,\n    kind,\n    text: observation.slice(prefix.length),\n  };\n}\n\nconst OBSERVATION_SEVERITY_CARD: Record<ObservationSeverity, string> = {\n  info: raisedSurfaceStyle,\n  success: 'border border-green-400/30 bg-green-500/10',\n  problem: 'border border-red-400/30 bg-red-500/10',\n};\n\nfunction ObservationItem({ observation }: { observation: string }) {\n  const { severity, kind, text } = parseTraceObservation(observation);\n\n  return (\n    <li className={`rounded-md p-3 text-body ${OBSERVATION_SEVERITY_CARD[severity ?? 'info']}`}>\n      {kind !== undefined && (\n        <p className=\"font-mono text-meta tracking-wider text-muted-foreground uppercase\">\n          {severity === 'problem' && (\n            <>\n              <span className=\"text-red-400\">problem</span>\n              <span aria-hidden=\"true\"> · </span>\n            </>\n          )}\n          <span>{kind}</span>\n        </p>\n      )}\n      <p className={`text-foreground ${kind === undefined ? '' : 'mt-1'}`}>{text}</p>\n    </li>\n  );\n}\n\nfunction TraceInsightBody({ insight }: { insight: TraceInsightResponse }) {\n  const { signalCatalog } = useTraceIntelligence();\n  return (\n    <>\n      {insight.summary === undefined ? (\n        <p className=\"text-body text-muted-foreground\">No insight available yet for this trace.</p>\n      ) : (\n        <section aria-labelledby=\"trace-insight-summary-heading\">\n          <h2\n            id=\"trace-insight-summary-heading\"\n            className=\"font-mono text-caption tracking-wider text-muted-foreground uppercase\"\n          >\n            Trace summary\n          </h2>\n          <p className=\"mt-3 text-body text-foreground\">{insight.summary.summary}</p>\n          {insight.summary.currentTask !== undefined && (\n            <dl className=\"mt-4 text-body\">\n              <dt className=\"text-muted-foreground\">Current task</dt>\n              <dd className=\"mt-1 text-foreground\">{insight.summary.currentTask}</dd>\n            </dl>\n          )}\n          {insight.summary.degenerate === true && (\n            <p className=\"mt-4 text-body text-red-500\">This trace was flagged as degenerate or looping.</p>\n          )}\n          {insight.summary.observations.length > 0 && (\n            <>\n              <h3\n                id=\"trace-insight-observations-heading\"\n                className=\"mt-4 font-mono text-caption tracking-wider text-muted-foreground uppercase\"\n              >\n                Observations\n              </h3>\n              <ul aria-labelledby=\"trace-insight-observations-heading\" className=\"mt-3 space-y-2\">\n                {insight.summary.observations.map((observation, index) => (\n                  <ObservationItem key={`${observation}:${index}`} observation={observation} />\n                ))}\n              </ul>\n            </>\n          )}\n        </section>\n      )}\n      {insight.signals.length > 0 && (\n        <section aria-labelledby=\"trace-insight-signals-heading\">\n          <h2\n            id=\"trace-insight-signals-heading\"\n            className=\"font-mono text-caption tracking-wider text-muted-foreground uppercase\"\n          >\n            Trace signal summaries\n          </h2>\n          <ul className=\"mt-3 space-y-3\">\n            {insight.signals.map(signal => (\n              <li key={signal.signalName} className={cn(raisedSurfaceStyle, 'rounded-md p-3 text-body')}>\n                <p className=\"text-muted-foreground\">{signalLabel(signalCatalog, signal.signalName)}</p>\n                <p className=\"mt-1 text-foreground\">{signal.signalText}</p>\n              </li>\n            ))}\n          </ul>\n        </section>\n      )}\n    </>\n  );\n}\n"],"names":["useTraceIntelligence","useTraceInsight","jsxs","jsx","Button","ChevronLeft","TraceIcon","raisedSurfaceStyle","Fragment","cn"],"mappings":"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"}
+{"version":3,"file":"trace-insight-view.cjs.js","sources":["../../../src/ee/signals/trace-insight-view.tsx"],"sourcesContent":["import { ChevronLeft } from 'lucide-react';\nimport { useTraceInsight } from './hooks';\nimport { signalLabel } from './signal-formatting';\nimport type { TraceInsightResponse } from './types';\nimport { useTraceIntelligence } from './use-trace-intelligence';\nimport { Button } from '@/ds/components/Button';\nimport { Txt } from '@/ds/components/Txt';\nimport { TraceIcon } from '@/ds/icons/TraceIcon';\nimport { raisedSurfaceStyle } from '@/ds/primitives/raised-surface';\nimport { cn } from '@/lib/utils';\n\ninterface TraceInsightViewProps {\n  traceId: string;\n  onBack: () => void;\n}\n\nexport function TraceInsightView({ traceId, onBack }: TraceInsightViewProps) {\n  const { LinkComponent, getTraceHref } = useTraceIntelligence();\n  const insightQuery = useTraceInsight(traceId);\n\n  return (\n    <div className=\"grid content-start gap-6\">\n      <div className=\"flex items-center justify-between gap-3\">\n        <Button icon={<ChevronLeft />} size=\"sm\" onClick={onBack}>\n          Back to examples\n        </Button>\n        <Button icon={<TraceIcon />} render={<LinkComponent href={getTraceHref(traceId)} />} size=\"sm\">\n          Open full trace\n        </Button>\n      </div>\n      {insightQuery.isPending && <Txt tone=\"muted\">Loading trace insight…</Txt>}\n      {insightQuery.isError && <Txt className=\"text-destructive-indicator\">Unable to load the trace insight.</Txt>}\n      {insightQuery.data && <TraceInsightBody insight={insightQuery.data} />}\n    </div>\n  );\n}\n\ntype ObservationSeverity = 'info' | 'success' | 'problem';\n\ninterface ParsedObservation {\n  severity?: ObservationSeverity;\n  kind?: string;\n  text: string;\n}\n\nfunction isObservationSeverity(value: string): value is ObservationSeverity {\n  return value === 'info' || value === 'success' || value === 'problem';\n}\n\n/**\n * Trace summaries prefix each observation with a machine-readable\n * `severity=… | kind=… |` header (see the trace-summary prompt). Strip it for\n * display and keep the parts so the UI can render them as visual cues, the\n * same way the observational-memory views parse their emoji markers out of\n * the raw text.\n */\nfunction parseTraceObservation(observation: string): ParsedObservation {\n  const match = observation.match(/^severity=(\\w+)\\s*\\|\\s*kind=(\\w+)\\s*\\|\\s*/);\n  if (!match) return { text: observation };\n  const [prefix, severity, kind] = match;\n  return {\n    severity: severity !== undefined && isObservationSeverity(severity) ? severity : undefined,\n    kind,\n    text: observation.slice(prefix.length),\n  };\n}\n\nconst OBSERVATION_SEVERITY_CARD: Record<ObservationSeverity, string> = {\n  info: raisedSurfaceStyle,\n  success: 'border border-success-edge bg-success-subtle',\n  problem: 'border border-destructive-edge bg-destructive-subtle',\n};\n\nfunction ObservationItem({ observation }: { observation: string }) {\n  const { severity, kind, text } = parseTraceObservation(observation);\n\n  return (\n    <li className={`rounded-md p-3 text-body ${OBSERVATION_SEVERITY_CARD[severity ?? 'info']}`}>\n      {kind !== undefined && (\n        <Txt variant=\"meta\" tone=\"muted\" font=\"mono\" className=\"tracking-wider uppercase\">\n          {severity === 'problem' && (\n            <>\n              <span className=\"text-destructive-indicator\">problem</span>\n              <span aria-hidden=\"true\"> · </span>\n            </>\n          )}\n          <span>{kind}</span>\n        </Txt>\n      )}\n      <p className={`text-foreground ${kind === undefined ? '' : 'mt-1'}`}>{text}</p>\n    </li>\n  );\n}\n\nfunction TraceInsightBody({ insight }: { insight: TraceInsightResponse }) {\n  const { signalCatalog } = useTraceIntelligence();\n  return (\n    <>\n      {insight.summary === undefined ? (\n        <Txt tone=\"muted\">No insight available yet for this trace.</Txt>\n      ) : (\n        <section aria-labelledby=\"trace-insight-summary-heading\">\n          <Txt\n            as=\"h2\"\n            variant=\"caption\"\n            tone=\"muted\"\n            font=\"mono\"\n            id=\"trace-insight-summary-heading\"\n            className=\"tracking-wider uppercase\"\n          >\n            Trace summary\n          </Txt>\n          <Txt tone=\"ink\" className=\"mt-3\">\n            {insight.summary.summary}\n          </Txt>\n          {insight.summary.currentTask !== undefined && (\n            <dl className=\"mt-4 text-body\">\n              <dt className=\"text-muted-foreground\">Current task</dt>\n              <dd className=\"mt-1 text-foreground\">{insight.summary.currentTask}</dd>\n            </dl>\n          )}\n          {insight.summary.degenerate === true && (\n            <Txt className=\"mt-4 text-destructive-indicator\">This trace was flagged as degenerate or looping.</Txt>\n          )}\n          {insight.summary.observations.length > 0 && (\n            <>\n              <Txt\n                as=\"h3\"\n                variant=\"caption\"\n                tone=\"muted\"\n                font=\"mono\"\n                id=\"trace-insight-observations-heading\"\n                className=\"mt-4 tracking-wider uppercase\"\n              >\n                Observations\n              </Txt>\n              <ul aria-labelledby=\"trace-insight-observations-heading\" className=\"mt-3 space-y-2\">\n                {insight.summary.observations.map((observation, index) => (\n                  <ObservationItem key={`${observation}:${index}`} observation={observation} />\n                ))}\n              </ul>\n            </>\n          )}\n        </section>\n      )}\n      {insight.signals.length > 0 && (\n        <section aria-labelledby=\"trace-insight-signals-heading\">\n          <Txt\n            as=\"h2\"\n            variant=\"caption\"\n            tone=\"muted\"\n            font=\"mono\"\n            id=\"trace-insight-signals-heading\"\n            className=\"tracking-wider uppercase\"\n          >\n            Trace signal summaries\n          </Txt>\n          <ul className=\"mt-3 space-y-3\">\n            {insight.signals.map(signal => (\n              <li key={signal.signalName} className={cn(raisedSurfaceStyle, 'rounded-md p-3 text-body')}>\n                <p className=\"text-muted-foreground\">{signalLabel(signalCatalog, signal.signalName)}</p>\n                <p className=\"mt-1 text-foreground\">{signal.signalText}</p>\n              </li>\n            ))}\n          </ul>\n        </section>\n      )}\n    </>\n  );\n}\n"],"names":["useTraceIntelligence","useTraceInsight","jsxs","jsx","Button","ChevronLeft","TraceIcon","Txt","raisedSurfaceStyle","Fragment","cn"],"mappings":";;;;;;;;;;;;;;;;AAgBO,SAAS,gBAAA,CAAiB,EAAE,OAAA,EAAS,MAAA,EAAO,EAA0B;AAC3E,EAAA,MAAM,EAAE,aAAA,EAAe,YAAA,EAAa,GAAIA,oDAAA,EAAqB;AAC7D,EAAA,MAAM,YAAA,GAAeC,iDAAgB,OAAO,CAAA;AAE5C,EAAA,uBACEC,eAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,0BAAA,EACb,QAAA,EAAA;AAAA,oBAAAA,eAAA,CAAC,KAAA,EAAA,EAAI,WAAU,yCAAA,EACb,QAAA,EAAA;AAAA,sBAAAC,cAAA,CAACC,aAAA,EAAA,EAAO,sBAAMD,cAAA,CAACE,uBAAA,EAAA,EAAY,GAAI,IAAA,EAAK,IAAA,EAAK,OAAA,EAAS,MAAA,EAAQ,QAAA,EAAA,kBAAA,EAE1D,CAAA;AAAA,qCACCD,aAAA,EAAA,EAAO,IAAA,kBAAMD,cAAA,CAACG,yBAAA,EAAA,EAAU,GAAI,MAAA,kBAAQH,cAAA,CAAC,aAAA,EAAA,EAAc,IAAA,EAAM,aAAa,OAAO,CAAA,EAAG,CAAA,EAAI,IAAA,EAAK,MAAK,QAAA,EAAA,iBAAA,EAE/F;AAAA,KAAA,EACF,CAAA;AAAA,IACC,aAAa,SAAA,oBAAaA,cAAA,CAACI,OAAA,EAAA,EAAI,IAAA,EAAK,SAAQ,QAAA,EAAA,wBAAA,EAAsB,CAAA;AAAA,IAClE,aAAa,OAAA,oBAAWJ,cAAA,CAACI,OAAA,EAAA,EAAI,SAAA,EAAU,8BAA6B,QAAA,EAAA,mCAAA,EAAiC,CAAA;AAAA,IACrG,aAAa,IAAA,oBAAQJ,cAAA,CAAC,gBAAA,EAAA,EAAiB,OAAA,EAAS,aAAa,IAAA,EAAM;AAAA,GAAA,EACtE,CAAA;AAEJ;AAUA,SAAS,sBAAsB,KAAA,EAA6C;AAC1E,EAAA,OAAO,KAAA,KAAU,MAAA,IAAU,KAAA,KAAU,SAAA,IAAa,KAAA,KAAU,SAAA;AAC9D;AASA,SAAS,sBAAsB,WAAA,EAAwC;AACrE,EAAA,MAAM,KAAA,GAAQ,WAAA,CAAY,KAAA,CAAM,2CAA2C,CAAA;AAC3E,EAAA,IAAI,CAAC,KAAA,EAAO,OAAO,EAAE,MAAM,WAAA,EAAY;AACvC,EAAA,MAAM,CAAC,MAAA,EAAQ,QAAA,EAAU,IAAI,CAAA,GAAI,KAAA;AACjC,EAAA,OAAO;AAAA,IACL,UAAU,QAAA,KAAa,MAAA,IAAa,qBAAA,CAAsB,QAAQ,IAAI,QAAA,GAAW,MAAA;AAAA,IACjF,IAAA;AAAA,IACA,IAAA,EAAM,WAAA,CAAY,KAAA,CAAM,MAAA,CAAO,MAAM;AAAA,GACvC;AACF;AAEA,MAAM,yBAAA,GAAiE;AAAA,EACrE,IAAA,EAAMK,2CAAA;AAAA,EACN,OAAA,EAAS,8CAAA;AAAA,EACT,OAAA,EAAS;AACX,CAAA;AAEA,SAAS,eAAA,CAAgB,EAAE,WAAA,EAAY,EAA4B;AACjE,EAAA,MAAM,EAAE,QAAA,EAAU,IAAA,EAAM,IAAA,EAAK,GAAI,sBAAsB,WAAW,CAAA;AAElE,EAAA,uBACEN,eAAA,CAAC,QAAG,SAAA,EAAW,CAAA,yBAAA,EAA4B,0BAA0B,QAAA,IAAY,MAAM,CAAC,CAAA,CAAA,EACrF,QAAA,EAAA;AAAA,IAAA,IAAA,KAAS,MAAA,oBACRA,eAAA,CAACK,OAAA,EAAA,EAAI,OAAA,EAAQ,MAAA,EAAO,MAAK,OAAA,EAAQ,IAAA,EAAK,MAAA,EAAO,SAAA,EAAU,0BAAA,EACpD,QAAA,EAAA;AAAA,MAAA,QAAA,KAAa,6BACZL,eAAA,CAAAO,mBAAA,EAAA,EACE,QAAA,EAAA;AAAA,wBAAAN,cAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,4BAAA,EAA6B,QAAA,EAAA,SAAA,EAAO,CAAA;AAAA,wBACpDA,cAAA,CAAC,MAAA,EAAA,EAAK,aAAA,EAAY,MAAA,EAAO,QAAA,EAAA,KAAA,EAAG;AAAA,OAAA,EAC9B,CAAA;AAAA,sBAEFA,cAAA,CAAC,UAAM,QAAA,EAAA,IAAA,EAAK;AAAA,KAAA,EACd,CAAA;AAAA,oBAEFA,cAAA,CAAC,OAAE,SAAA,EAAW,CAAA,gBAAA,EAAmB,SAAS,MAAA,GAAY,EAAA,GAAK,MAAM,CAAA,CAAA,EAAK,QAAA,EAAA,IAAA,EAAK;AAAA,GAAA,EAC7E,CAAA;AAEJ;AAEA,SAAS,gBAAA,CAAiB,EAAE,OAAA,EAAQ,EAAsC;AACxE,EAAA,MAAM,EAAE,aAAA,EAAc,GAAIH,oDAAA,EAAqB;AAC/C,EAAA,uBACEE,eAAA,CAAAO,mBAAA,EAAA,EACG,QAAA,EAAA;AAAA,IAAA,OAAA,CAAQ,OAAA,KAAY,MAAA,mBACnBN,cAAA,CAACI,OAAA,EAAA,EAAI,IAAA,EAAK,OAAA,EAAQ,QAAA,EAAA,0CAAA,EAAwC,CAAA,mBAE1DL,eAAA,CAAC,SAAA,EAAA,EAAQ,iBAAA,EAAgB,+BAAA,EACvB,QAAA,EAAA;AAAA,sBAAAC,cAAA;AAAA,QAACI,OAAA;AAAA,QAAA;AAAA,UACC,EAAA,EAAG,IAAA;AAAA,UACH,OAAA,EAAQ,SAAA;AAAA,UACR,IAAA,EAAK,OAAA;AAAA,UACL,IAAA,EAAK,MAAA;AAAA,UACL,EAAA,EAAG,+BAAA;AAAA,UACH,SAAA,EAAU,0BAAA;AAAA,UACX,QAAA,EAAA;AAAA;AAAA,OAED;AAAA,sBACAJ,cAAA,CAACI,WAAI,IAAA,EAAK,KAAA,EAAM,WAAU,MAAA,EACvB,QAAA,EAAA,OAAA,CAAQ,QAAQ,OAAA,EACnB,CAAA;AAAA,MACC,QAAQ,OAAA,CAAQ,WAAA,KAAgB,0BAC/BL,eAAA,CAAC,IAAA,EAAA,EAAG,WAAU,gBAAA,EACZ,QAAA,EAAA;AAAA,wBAAAC,cAAA,CAAC,IAAA,EAAA,EAAG,SAAA,EAAU,uBAAA,EAAwB,QAAA,EAAA,cAAA,EAAY,CAAA;AAAA,uCACjD,IAAA,EAAA,EAAG,SAAA,EAAU,sBAAA,EAAwB,QAAA,EAAA,OAAA,CAAQ,QAAQ,WAAA,EAAY;AAAA,OAAA,EACpE,CAAA;AAAA,MAED,OAAA,CAAQ,QAAQ,UAAA,KAAe,IAAA,mCAC7BI,OAAA,EAAA,EAAI,SAAA,EAAU,mCAAkC,QAAA,EAAA,kDAAA,EAAgD,CAAA;AAAA,MAElG,OAAA,CAAQ,OAAA,CAAQ,YAAA,CAAa,MAAA,GAAS,qBACrCL,eAAA,CAAAO,mBAAA,EAAA,EACE,QAAA,EAAA;AAAA,wBAAAN,cAAA;AAAA,UAACI,OAAA;AAAA,UAAA;AAAA,YACC,EAAA,EAAG,IAAA;AAAA,YACH,OAAA,EAAQ,SAAA;AAAA,YACR,IAAA,EAAK,OAAA;AAAA,YACL,IAAA,EAAK,MAAA;AAAA,YACL,EAAA,EAAG,oCAAA;AAAA,YACH,SAAA,EAAU,+BAAA;AAAA,YACX,QAAA,EAAA;AAAA;AAAA,SAED;AAAA,wBACAJ,cAAA,CAAC,QAAG,iBAAA,EAAgB,oCAAA,EAAqC,WAAU,gBAAA,EAChE,QAAA,EAAA,OAAA,CAAQ,OAAA,CAAQ,YAAA,CAAa,GAAA,CAAI,CAAC,aAAa,KAAA,qBAC9CA,cAAA,CAAC,mBAAgD,WAAA,EAAA,EAA3B,CAAA,EAAG,WAAW,CAAA,CAAA,EAAI,KAAK,CAAA,CAA8B,CAC5E,CAAA,EACH;AAAA,OAAA,EACF;AAAA,KAAA,EAEJ,CAAA;AAAA,IAED,QAAQ,OAAA,CAAQ,MAAA,GAAS,qBACxBD,eAAA,CAAC,SAAA,EAAA,EAAQ,mBAAgB,+BAAA,EACvB,QAAA,EAAA;AAAA,sBAAAC,cAAA;AAAA,QAACI,OAAA;AAAA,QAAA;AAAA,UACC,EAAA,EAAG,IAAA;AAAA,UACH,OAAA,EAAQ,SAAA;AAAA,UACR,IAAA,EAAK,OAAA;AAAA,UACL,IAAA,EAAK,MAAA;AAAA,UACL,EAAA,EAAG,+BAAA;AAAA,UACH,SAAA,EAAU,0BAAA;AAAA,UACX,QAAA,EAAA;AAAA;AAAA,OAED;AAAA,sBACAJ,cAAA,CAAC,IAAA,EAAA,EAAG,SAAA,EAAU,gBAAA,EACX,kBAAQ,OAAA,CAAQ,GAAA,CAAI,CAAA,MAAA,qBACnBD,eAAA,CAAC,IAAA,EAAA,EAA2B,SAAA,EAAWQ,WAAA,CAAGF,2CAAA,EAAoB,0BAA0B,CAAA,EACtF,QAAA,EAAA;AAAA,wBAAAL,cAAA,CAAC,OAAE,SAAA,EAAU,uBAAA,EAAyB,kDAAY,aAAA,EAAe,MAAA,CAAO,UAAU,CAAA,EAAE,CAAA;AAAA,wBACpFA,cAAA,CAAC,GAAA,EAAA,EAAE,SAAA,EAAU,sBAAA,EAAwB,iBAAO,UAAA,EAAW;AAAA,OAAA,EAAA,EAFhD,MAAA,CAAO,UAGhB,CACD,CAAA,EACH;AAAA,KAAA,EACF;AAAA,GAAA,EAEJ,CAAA;AAEJ;;;;"}