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

package/dist/ee/signals/theme-detail-panel.cjs.js

@@ -15,9 +15,9 @@ const ee_signals_signalFormatting = require('./signal-formatting.cjs.js');
 const ee_signals_themeTrend = require('./theme-trend.cjs.js');
 const ee_signals_themeTrendChart = require('./theme-trend-chart.cjs.js');
 const ee_signals_traceInsightView = require('./trace-insight-view.cjs.js');
-const drawer = require('../../drawer-tUWEluOi.cjs');
-const sankeyColor = require('../../sankeyColor-DHE7ggh8.cjs');
+const drawer = require('../../drawer-d81cZiSV.cjs');
 const tooltip = require('../../tooltip-DIZ5oqjV.cjs');
+const Txt = require('../../Txt-DPmEpNbp.cjs');
 const primitives_raisedSurface = require('../../primitives/raised-surface.cjs.js');
 const utils_cn = require('../../cn-DG0X1KEP.cjs');
 
@@ -83,10 +83,13 @@ function ThemeDetailPanel({
       children: /* @__PURE__ */ jsxRuntime.jsxs(drawer.DrawerContent, { children: [
         /* @__PURE__ */ jsxRuntime.jsxs(drawer.DrawerHeader, { className: "border-b border-border", children: [
           signalName !== void 0 && /* @__PURE__ */ jsxRuntime.jsx(
-            "span",
+            Txt.Txt,
             {
-              className: "font-mono text-column tracking-widest",
-              style: { color: sankeyColor.nodeColor(ee_signals_signalColors.getSignalHue(signalName)) },
+              as: "span",
+              variant: "column",
+              font: "mono",
+              className: "tracking-widest",
+              style: { color: ee_signals_signalColors.getSignalColor(signalName) },
               children: signalDisplayDescription ? /* @__PURE__ */ jsxRuntime.jsxs(tooltip.Tooltip, { children: [
                 /* @__PURE__ */ jsxRuntime.jsx(tooltip.TooltipTrigger, { "aria-label": signalDisplayLabel, className: "cursor-default uppercase", children: signalDisplayLabel }),
                 /* @__PURE__ */ jsxRuntime.jsx(tooltip.TooltipContent, { children: signalDisplayDescription })
@@ -104,41 +107,49 @@ function ThemeDetailPanel({
         /* @__PURE__ */ jsxRuntime.jsxs(drawer.DrawerBody, { className: "grid content-start gap-6 overflow-y-auto p-6", children: [
           insightTraceId !== void 0 && /* @__PURE__ */ jsxRuntime.jsx(ee_signals_traceInsightView.TraceInsightView, { traceId: insightTraceId, onBack: () => setInsightTraceId(void 0) }),
           insightTraceId === void 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-            detailQuery.isPending && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-body text-muted-foreground", children: "Loading theme details…" }),
-            detailQuery.isError && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-body text-red-500", children: "Unable to load theme details." }),
+            detailQuery.isPending && /* @__PURE__ */ jsxRuntime.jsx(Txt.Txt, { tone: "muted", children: "Loading theme details…" }),
+            detailQuery.isError && /* @__PURE__ */ jsxRuntime.jsx(Txt.Txt, { className: "text-destructive-indicator", children: "Unable to load theme details." }),
             detailQuery.data && !detailQuery.data.theme && /* @__PURE__ */ jsxRuntime.jsxs("section", { children: [
-              /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-subheading text-foreground", children: "Not present in this snapshot" }),
-              /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-2 text-body text-muted-foreground", children: "This theme has no data in the selected snapshot." })
+              /* @__PURE__ */ jsxRuntime.jsx(Txt.Txt, { as: "h2", variant: "subheading", tone: "ink", children: "Not present in this snapshot" }),
+              /* @__PURE__ */ jsxRuntime.jsx(Txt.Txt, { tone: "muted", className: "mt-2", children: "This theme has no data in the selected snapshot." })
             ] }),
             detailQuery.data?.theme && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
               /* @__PURE__ */ jsxRuntime.jsxs("section", { "aria-labelledby": "theme-summary-heading", children: [
                 /* @__PURE__ */ jsxRuntime.jsx(
-                  "h2",
+                  Txt.Txt,
                   {
+                    as: "h2",
+                    variant: "caption",
+                    tone: "muted",
+                    font: "mono",
                     id: "theme-summary-heading",
-                    className: "font-mono text-caption tracking-wider text-muted-foreground uppercase",
+                    className: "tracking-wider uppercase",
                     children: "Summary"
                   }
                 ),
-                /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-3 text-body text-foreground", children: detailQuery.data.theme.description ?? "No description available." }),
-                /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-3 font-mono text-body text-foreground tabular-nums", children: ee_signals_signalFormatting.shareSentence(
+                /* @__PURE__ */ jsxRuntime.jsx(Txt.Txt, { tone: "ink", className: "mt-3", children: detailQuery.data.theme.description ?? "No description available." }),
+                /* @__PURE__ */ jsxRuntime.jsx(Txt.Txt, { tone: "ink", font: "mono", className: "mt-3 tabular-nums", children: ee_signals_signalFormatting.shareSentence(
                   filteredStats?.traceCount ?? detailQuery.data.theme.traceCount,
                   filteredStats?.stageShare ?? detailQuery.data.theme.coverage
                 ) })
               ] }),
               /* @__PURE__ */ jsxRuntime.jsxs("section", { "aria-labelledby": "theme-examples-heading", children: [
                 /* @__PURE__ */ jsxRuntime.jsx(
-                  "h2",
+                  Txt.Txt,
                   {
+                    as: "h2",
+                    variant: "caption",
+                    tone: "muted",
+                    font: "mono",
                     id: "theme-examples-heading",
-                    className: "font-mono text-caption tracking-wider text-muted-foreground uppercase",
+                    className: "tracking-wider uppercase",
                     children: "Examples"
                   }
                 ),
-                examplesQuery.isPending && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-3 text-body text-muted-foreground", children: "Loading examples…" }),
-                examplesQuery.isError && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-3 text-body text-red-500", children: "Unable to load examples." }),
+                examplesQuery.isPending && /* @__PURE__ */ jsxRuntime.jsx(Txt.Txt, { tone: "muted", className: "mt-3", children: "Loading examples…" }),
+                examplesQuery.isError && /* @__PURE__ */ jsxRuntime.jsx(Txt.Txt, { className: "mt-3 text-destructive-indicator", children: "Unable to load examples." }),
                 examplesQuery.data && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-                  examplesQuery.data.examples.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-3 text-body text-muted-foreground", children: "No examples in this snapshot." }) : /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "mt-3 space-y-3", children: examplesQuery.data.examples.map((example) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(
+                  examplesQuery.data.examples.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx(Txt.Txt, { tone: "muted", className: "mt-3", children: "No examples in this snapshot." }) : /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "mt-3 space-y-3", children: examplesQuery.data.examples.map((example) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(
                     "button",
                     {
                       type: "button",
@@ -163,29 +174,27 @@ function ThemeDetailPanel({
               ] }),
               snapshotTotal > 1 && /* @__PURE__ */ jsxRuntime.jsxs("section", { "aria-labelledby": "theme-trend-heading", children: [
                 /* @__PURE__ */ jsxRuntime.jsx(
-                  "h2",
+                  Txt.Txt,
                   {
+                    as: "h2",
+                    variant: "caption",
+                    tone: "muted",
+                    font: "mono",
                     id: "theme-trend-heading",
-                    className: "font-mono text-caption tracking-wider text-muted-foreground uppercase",
+                    className: "tracking-wider uppercase",
                     children: "Trend"
                   }
                 ),
-                historyQuery.isPending && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-3 text-body text-muted-foreground", children: "Loading trend…" }),
-                historyQuery.isError && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-3 text-body text-red-500", children: "Unable to load the trend." }),
+                historyQuery.isPending && /* @__PURE__ */ jsxRuntime.jsx(Txt.Txt, { tone: "muted", className: "mt-3", children: "Loading trend…" }),
+                historyQuery.isError && /* @__PURE__ */ jsxRuntime.jsx(Txt.Txt, { className: "mt-3 text-destructive-indicator", children: "Unable to load the trend." }),
                 oldestHistoryPoint !== void 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-                  /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "mt-3 text-body text-foreground", children: [
+                  /* @__PURE__ */ jsxRuntime.jsxs(Txt.Txt, { tone: "ink", className: "mt-3", children: [
                     historyQuery.data?.nextCursor ? `Active since at least ${ee_signals_signalFormatting.formatSnapshotDate(oldestHistoryPoint.startedAt)} · in ${historyPoints.length}+ snapshots` : `First seen ${ee_signals_signalFormatting.formatSnapshotDate(oldestHistoryPoint.startedAt)} · in ${historyPoints.length} ${historyPoints.length === 1 ? "snapshot" : "snapshots"}`,
                     " ",
                     "· ",
                     ee_signals_themeTrend.themeTrendDirection(historyPoints)
                   ] }),
-                  historyPoints.length >= 2 && /* @__PURE__ */ jsxRuntime.jsx(
-                    ee_signals_themeTrendChart.ThemeTrendChart,
-                    {
-                      points: historyPoints,
-                      color: sankeyColor.nodeColor(ee_signals_signalColors.getSignalHue(signalName ?? "goal"))
-                    }
-                  )
+                  historyPoints.length >= 2 && /* @__PURE__ */ jsxRuntime.jsx(ee_signals_themeTrendChart.ThemeTrendChart, { points: historyPoints, signalName: signalName ?? "goal" })
                 ] })
               ] })
             ] })

package/dist/ee/signals/theme-detail-panel.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"theme-detail-panel.cjs.js","sources":["../../../src/ee/signals/theme-detail-panel.tsx"],"sourcesContent":["import { useState } from 'react';\n\nimport { EXAMPLES_PAGE_SIZE, ExamplesPager } from './examples-pager';\nimport { useThemeDetail, useThemeExamples, useThemeHistory } from './hooks';\nimport { getSignalHue } from './signal-colors';\nimport { formatSnapshotDate, shareSentence, signalDescription, signalLabel } from './signal-formatting';\nimport type { SelectedTheme, ThemeSelection, ThemeSelectionStats } from './theme-drilldown-data';\nimport { chronologicalHistoryPoints, themeTrendDirection } from './theme-trend';\nimport { ThemeTrendChart } from './theme-trend-chart';\nimport { TraceInsightView } from './trace-insight-view';\nimport { useTraceIntelligence } from './use-trace-intelligence';\nimport {\n  Drawer,\n  DrawerBody,\n  DrawerContent,\n  DrawerDescription,\n  DrawerHeader,\n  DrawerTitle,\n} from '@/ds/components/Drawer';\nimport { nodeColor } from '@/ds/components/SankeyChart';\nimport { Tooltip, TooltipContent, TooltipTrigger } from '@/ds/components/Tooltip';\nimport { raisedSurfaceStyle } from '@/ds/primitives/raised-surface';\nimport { cn } from '@/lib/utils';\n\ninterface ThemeDetailPanelProps {\n  entityId: string;\n  entityType: string;\n  snapshotId: string;\n  snapshotTotal: number;\n  selection: SelectedTheme | undefined;\n  filters?: ThemeSelection[];\n  filteredStats?: ThemeSelectionStats;\n  onClose: () => void;\n}\n\nexport function ThemeDetailPanel({\n  entityId,\n  entityType,\n  snapshotId,\n  snapshotTotal,\n  selection,\n  filters = [],\n  filteredStats,\n  onClose,\n}: ThemeDetailPanelProps) {\n  const { signalCatalog } = useTraceIntelligence();\n  const filterKey = filters\n    .map(filter => `${filter.signalName}:${filter.kind === 'theme' ? filter.themeId : 'noise'}`)\n    .join(',');\n  const examplesContextKey = `${snapshotId}:${selection?.signalName ?? ''}:${selection?.themeId ?? ''}:${filterKey}`;\n  const [examplesPage, setExamplesPage] = useState(() => ({ contextKey: examplesContextKey, offset: 0 }));\n  const examplesOffset = examplesPage.contextKey === examplesContextKey ? examplesPage.offset : 0;\n  const [insightTraceId, setInsightTraceId] = useState<string>();\n  const detailQuery = useThemeDetail(\n    entityId,\n    entityType,\n    selection?.signalName ?? 'goal',\n    snapshotId,\n    selection?.themeId,\n  );\n  const examplesQuery = useThemeExamples(\n    entityId,\n    entityType,\n    selection?.signalName ?? 'goal',\n    snapshotId,\n    selection?.themeId,\n    EXAMPLES_PAGE_SIZE,\n    examplesOffset,\n    filters,\n  );\n  const historyQuery = useThemeHistory(\n    entityId,\n    entityType,\n    selection?.signalName ?? 'goal',\n    snapshotTotal > 1 ? selection?.themeId : undefined,\n  );\n  const title = detailQuery.data?.theme?.label ?? selection?.label ?? 'Theme details';\n  const signalName = selection?.signalName;\n  const signalDisplayLabel = signalName ? signalLabel(signalCatalog, signalName) : undefined;\n  const signalDisplayDescription = signalName ? signalDescription(signalCatalog, signalName) : undefined;\n  const historyPoints = historyQuery.data ? chronologicalHistoryPoints(historyQuery.data.points) : [];\n  const oldestHistoryPoint = historyPoints[0];\n\n  return (\n    <Drawer\n      onOpenChange={open => {\n        if (!open) {\n          setExamplesPage({ contextKey: '', offset: 0 });\n          setInsightTraceId(undefined);\n          onClose();\n        }\n      }}\n      open={selection !== undefined}\n      overlay=\"none\"\n      side=\"right\"\n      variant=\"floating\"\n    >\n      <DrawerContent>\n        <DrawerHeader className=\"border-b border-border\">\n          {signalName !== undefined && (\n            <span\n              className=\"font-mono text-column tracking-widest\"\n              style={{ color: nodeColor(getSignalHue(signalName)) }}\n            >\n              {signalDisplayDescription ? (\n                <Tooltip>\n                  <TooltipTrigger aria-label={signalDisplayLabel} className=\"cursor-default uppercase\">\n                    {signalDisplayLabel}\n                  </TooltipTrigger>\n                  <TooltipContent>{signalDisplayDescription}</TooltipContent>\n                </Tooltip>\n              ) : (\n                <span className=\"uppercase\">{signalDisplayLabel}</span>\n              )}\n            </span>\n          )}\n          <DrawerTitle>{title}</DrawerTitle>\n          <DrawerDescription className=\"sr-only\">\n            Details for the {signalName ?? 'selected'} theme {title}\n          </DrawerDescription>\n        </DrawerHeader>\n        <DrawerBody className=\"grid content-start gap-6 overflow-y-auto p-6\">\n          {insightTraceId !== undefined && (\n            <TraceInsightView traceId={insightTraceId} onBack={() => setInsightTraceId(undefined)} />\n          )}\n          {insightTraceId === undefined && (\n            <>\n              {detailQuery.isPending && <p className=\"text-body text-muted-foreground\">Loading theme details…</p>}\n              {detailQuery.isError && <p className=\"text-body text-red-500\">Unable to load theme details.</p>}\n              {detailQuery.data && !detailQuery.data.theme && (\n                <section>\n                  <h2 className=\"text-subheading text-foreground\">Not present in this snapshot</h2>\n                  <p className=\"mt-2 text-body text-muted-foreground\">\n                    This theme has no data in the selected snapshot.\n                  </p>\n                </section>\n              )}\n              {detailQuery.data?.theme && (\n                <>\n                  <section aria-labelledby=\"theme-summary-heading\">\n                    <h2\n                      id=\"theme-summary-heading\"\n                      className=\"font-mono text-caption tracking-wider text-muted-foreground uppercase\"\n                    >\n                      Summary\n                    </h2>\n                    <p className=\"mt-3 text-body text-foreground\">\n                      {detailQuery.data.theme.description ?? 'No description available.'}\n                    </p>\n                    <p className=\"mt-3 font-mono text-body text-foreground tabular-nums\">\n                      {shareSentence(\n                        filteredStats?.traceCount ?? detailQuery.data.theme.traceCount,\n                        filteredStats?.stageShare ?? detailQuery.data.theme.coverage,\n                      )}\n                    </p>\n                  </section>\n\n                  <section aria-labelledby=\"theme-examples-heading\">\n                    <h2\n                      id=\"theme-examples-heading\"\n                      className=\"font-mono text-caption tracking-wider text-muted-foreground uppercase\"\n                    >\n                      Examples\n                    </h2>\n                    {examplesQuery.isPending && (\n                      <p className=\"mt-3 text-body text-muted-foreground\">Loading examples…</p>\n                    )}\n                    {examplesQuery.isError && <p className=\"mt-3 text-body text-red-500\">Unable to load examples.</p>}\n                    {examplesQuery.data && (\n                      <>\n                        {examplesQuery.data.examples.length === 0 ? (\n                          <p className=\"mt-3 text-body text-muted-foreground\">No examples in this snapshot.</p>\n                        ) : (\n                          <ul className=\"mt-3 space-y-3\">\n                            {examplesQuery.data.examples.map(example => (\n                              <li key={example.traceId}>\n                                <button\n                                  type=\"button\"\n                                  aria-label={`View trace insight for ${example.signalText}`}\n                                  className={cn(\n                                    raisedSurfaceStyle,\n                                    'state-layer w-full cursor-pointer rounded-md p-3 text-left text-body text-foreground',\n                                  )}\n                                  onClick={() => setInsightTraceId(example.traceId)}\n                                >\n                                  {example.signalText}\n                                </button>\n                              </li>\n                            ))}\n                          </ul>\n                        )}\n                        <ExamplesPager\n                          traceCount={filteredStats?.traceCount ?? detailQuery.data.theme.traceCount}\n                          offset={examplesOffset}\n                          onOffsetChange={offset => setExamplesPage({ contextKey: examplesContextKey, offset })}\n                        />\n                      </>\n                    )}\n                  </section>\n\n                  {snapshotTotal > 1 && (\n                    <section aria-labelledby=\"theme-trend-heading\">\n                      <h2\n                        id=\"theme-trend-heading\"\n                        className=\"font-mono text-caption tracking-wider text-muted-foreground uppercase\"\n                      >\n                        Trend\n                      </h2>\n                      {historyQuery.isPending && <p className=\"mt-3 text-body text-muted-foreground\">Loading trend…</p>}\n                      {historyQuery.isError && <p className=\"mt-3 text-body text-red-500\">Unable to load the trend.</p>}\n                      {oldestHistoryPoint !== undefined && (\n                        <>\n                          <p className=\"mt-3 text-body text-foreground\">\n                            {/* A nextCursor means older points exist beyond the fetched window,\n                                so the oldest loaded point is a lower bound, not the true origin. */}\n                            {historyQuery.data?.nextCursor\n                              ? `Active since at least ${formatSnapshotDate(oldestHistoryPoint.startedAt)} · in ${historyPoints.length}+ snapshots`\n                              : `First seen ${formatSnapshotDate(oldestHistoryPoint.startedAt)} · in ${historyPoints.length} ${historyPoints.length === 1 ? 'snapshot' : 'snapshots'}`}{' '}\n                            · {themeTrendDirection(historyPoints)}\n                          </p>\n                          {historyPoints.length >= 2 && (\n                            <ThemeTrendChart\n                              points={historyPoints}\n                              color={nodeColor(getSignalHue(signalName ?? 'goal'))}\n                            />\n                          )}\n                        </>\n                      )}\n                    </section>\n                  )}\n                </>\n              )}\n            </>\n          )}\n        </DrawerBody>\n      </DrawerContent>\n    </Drawer>\n  );\n}\n"],"names":["useTraceIntelligence","useState","useThemeDetail","useThemeExamples","EXAMPLES_PAGE_SIZE","useThemeHistory","signalLabel","signalDescription","chronologicalHistoryPoints","jsx","Drawer","DrawerContent","jsxs","DrawerHeader","nodeColor","getSignalHue","Tooltip","TooltipTrigger","TooltipContent","DrawerTitle","DrawerDescription","DrawerBody","TraceInsightView","Fragment","shareSentence","cn","raisedSurfaceStyle","ExamplesPager","formatSnapshotDate","themeTrendDirection","ThemeTrendChart"],"mappings":"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"}
+{"version":3,"file":"theme-detail-panel.cjs.js","sources":["../../../src/ee/signals/theme-detail-panel.tsx"],"sourcesContent":["import { useState } from 'react';\n\nimport { EXAMPLES_PAGE_SIZE, ExamplesPager } from './examples-pager';\nimport { useThemeDetail, useThemeExamples, useThemeHistory } from './hooks';\nimport { getSignalColor } from './signal-colors';\nimport { formatSnapshotDate, shareSentence, signalDescription, signalLabel } from './signal-formatting';\nimport type { SelectedTheme, ThemeSelection, ThemeSelectionStats } from './theme-drilldown-data';\nimport { chronologicalHistoryPoints, themeTrendDirection } from './theme-trend';\nimport { ThemeTrendChart } from './theme-trend-chart';\nimport { TraceInsightView } from './trace-insight-view';\nimport { useTraceIntelligence } from './use-trace-intelligence';\nimport {\n  Drawer,\n  DrawerBody,\n  DrawerContent,\n  DrawerDescription,\n  DrawerHeader,\n  DrawerTitle,\n} from '@/ds/components/Drawer';\nimport { Tooltip, TooltipContent, TooltipTrigger } from '@/ds/components/Tooltip';\nimport { Txt } from '@/ds/components/Txt';\nimport { raisedSurfaceStyle } from '@/ds/primitives/raised-surface';\nimport { cn } from '@/lib/utils';\n\ninterface ThemeDetailPanelProps {\n  entityId: string;\n  entityType: string;\n  snapshotId: string;\n  snapshotTotal: number;\n  selection: SelectedTheme | undefined;\n  filters?: ThemeSelection[];\n  filteredStats?: ThemeSelectionStats;\n  onClose: () => void;\n}\n\nexport function ThemeDetailPanel({\n  entityId,\n  entityType,\n  snapshotId,\n  snapshotTotal,\n  selection,\n  filters = [],\n  filteredStats,\n  onClose,\n}: ThemeDetailPanelProps) {\n  const { signalCatalog } = useTraceIntelligence();\n  const filterKey = filters\n    .map(filter => `${filter.signalName}:${filter.kind === 'theme' ? filter.themeId : 'noise'}`)\n    .join(',');\n  const examplesContextKey = `${snapshotId}:${selection?.signalName ?? ''}:${selection?.themeId ?? ''}:${filterKey}`;\n  const [examplesPage, setExamplesPage] = useState(() => ({ contextKey: examplesContextKey, offset: 0 }));\n  const examplesOffset = examplesPage.contextKey === examplesContextKey ? examplesPage.offset : 0;\n  const [insightTraceId, setInsightTraceId] = useState<string>();\n  const detailQuery = useThemeDetail(\n    entityId,\n    entityType,\n    selection?.signalName ?? 'goal',\n    snapshotId,\n    selection?.themeId,\n  );\n  const examplesQuery = useThemeExamples(\n    entityId,\n    entityType,\n    selection?.signalName ?? 'goal',\n    snapshotId,\n    selection?.themeId,\n    EXAMPLES_PAGE_SIZE,\n    examplesOffset,\n    filters,\n  );\n  const historyQuery = useThemeHistory(\n    entityId,\n    entityType,\n    selection?.signalName ?? 'goal',\n    snapshotTotal > 1 ? selection?.themeId : undefined,\n  );\n  const title = detailQuery.data?.theme?.label ?? selection?.label ?? 'Theme details';\n  const signalName = selection?.signalName;\n  const signalDisplayLabel = signalName ? signalLabel(signalCatalog, signalName) : undefined;\n  const signalDisplayDescription = signalName ? signalDescription(signalCatalog, signalName) : undefined;\n  const historyPoints = historyQuery.data ? chronologicalHistoryPoints(historyQuery.data.points) : [];\n  const oldestHistoryPoint = historyPoints[0];\n\n  return (\n    <Drawer\n      onOpenChange={open => {\n        if (!open) {\n          setExamplesPage({ contextKey: '', offset: 0 });\n          setInsightTraceId(undefined);\n          onClose();\n        }\n      }}\n      open={selection !== undefined}\n      overlay=\"none\"\n      side=\"right\"\n      variant=\"floating\"\n    >\n      <DrawerContent>\n        <DrawerHeader className=\"border-b border-border\">\n          {signalName !== undefined && (\n            <Txt\n              as=\"span\"\n              variant=\"column\"\n              font=\"mono\"\n              className=\"tracking-widest\"\n              style={{ color: getSignalColor(signalName) }}\n            >\n              {signalDisplayDescription ? (\n                <Tooltip>\n                  <TooltipTrigger aria-label={signalDisplayLabel} className=\"cursor-default uppercase\">\n                    {signalDisplayLabel}\n                  </TooltipTrigger>\n                  <TooltipContent>{signalDisplayDescription}</TooltipContent>\n                </Tooltip>\n              ) : (\n                <span className=\"uppercase\">{signalDisplayLabel}</span>\n              )}\n            </Txt>\n          )}\n          <DrawerTitle>{title}</DrawerTitle>\n          <DrawerDescription className=\"sr-only\">\n            Details for the {signalName ?? 'selected'} theme {title}\n          </DrawerDescription>\n        </DrawerHeader>\n        <DrawerBody className=\"grid content-start gap-6 overflow-y-auto p-6\">\n          {insightTraceId !== undefined && (\n            <TraceInsightView traceId={insightTraceId} onBack={() => setInsightTraceId(undefined)} />\n          )}\n          {insightTraceId === undefined && (\n            <>\n              {detailQuery.isPending && <Txt tone=\"muted\">Loading theme details…</Txt>}\n              {detailQuery.isError && <Txt className=\"text-destructive-indicator\">Unable to load theme details.</Txt>}\n              {detailQuery.data && !detailQuery.data.theme && (\n                <section>\n                  <Txt as=\"h2\" variant=\"subheading\" tone=\"ink\">\n                    Not present in this snapshot\n                  </Txt>\n                  <Txt tone=\"muted\" className=\"mt-2\">\n                    This theme has no data in the selected snapshot.\n                  </Txt>\n                </section>\n              )}\n              {detailQuery.data?.theme && (\n                <>\n                  <section aria-labelledby=\"theme-summary-heading\">\n                    <Txt\n                      as=\"h2\"\n                      variant=\"caption\"\n                      tone=\"muted\"\n                      font=\"mono\"\n                      id=\"theme-summary-heading\"\n                      className=\"tracking-wider uppercase\"\n                    >\n                      Summary\n                    </Txt>\n                    <Txt tone=\"ink\" className=\"mt-3\">\n                      {detailQuery.data.theme.description ?? 'No description available.'}\n                    </Txt>\n                    <Txt tone=\"ink\" font=\"mono\" className=\"mt-3 tabular-nums\">\n                      {shareSentence(\n                        filteredStats?.traceCount ?? detailQuery.data.theme.traceCount,\n                        filteredStats?.stageShare ?? detailQuery.data.theme.coverage,\n                      )}\n                    </Txt>\n                  </section>\n\n                  <section aria-labelledby=\"theme-examples-heading\">\n                    <Txt\n                      as=\"h2\"\n                      variant=\"caption\"\n                      tone=\"muted\"\n                      font=\"mono\"\n                      id=\"theme-examples-heading\"\n                      className=\"tracking-wider uppercase\"\n                    >\n                      Examples\n                    </Txt>\n                    {examplesQuery.isPending && (\n                      <Txt tone=\"muted\" className=\"mt-3\">\n                        Loading examples…\n                      </Txt>\n                    )}\n                    {examplesQuery.isError && (\n                      <Txt className=\"mt-3 text-destructive-indicator\">Unable to load examples.</Txt>\n                    )}\n                    {examplesQuery.data && (\n                      <>\n                        {examplesQuery.data.examples.length === 0 ? (\n                          <Txt tone=\"muted\" className=\"mt-3\">\n                            No examples in this snapshot.\n                          </Txt>\n                        ) : (\n                          <ul className=\"mt-3 space-y-3\">\n                            {examplesQuery.data.examples.map(example => (\n                              <li key={example.traceId}>\n                                <button\n                                  type=\"button\"\n                                  aria-label={`View trace insight for ${example.signalText}`}\n                                  className={cn(\n                                    raisedSurfaceStyle,\n                                    'state-layer w-full cursor-pointer rounded-md p-3 text-left text-body text-foreground',\n                                  )}\n                                  onClick={() => setInsightTraceId(example.traceId)}\n                                >\n                                  {example.signalText}\n                                </button>\n                              </li>\n                            ))}\n                          </ul>\n                        )}\n                        <ExamplesPager\n                          traceCount={filteredStats?.traceCount ?? detailQuery.data.theme.traceCount}\n                          offset={examplesOffset}\n                          onOffsetChange={offset => setExamplesPage({ contextKey: examplesContextKey, offset })}\n                        />\n                      </>\n                    )}\n                  </section>\n\n                  {snapshotTotal > 1 && (\n                    <section aria-labelledby=\"theme-trend-heading\">\n                      <Txt\n                        as=\"h2\"\n                        variant=\"caption\"\n                        tone=\"muted\"\n                        font=\"mono\"\n                        id=\"theme-trend-heading\"\n                        className=\"tracking-wider uppercase\"\n                      >\n                        Trend\n                      </Txt>\n                      {historyQuery.isPending && (\n                        <Txt tone=\"muted\" className=\"mt-3\">\n                          Loading trend…\n                        </Txt>\n                      )}\n                      {historyQuery.isError && (\n                        <Txt className=\"mt-3 text-destructive-indicator\">Unable to load the trend.</Txt>\n                      )}\n                      {oldestHistoryPoint !== undefined && (\n                        <>\n                          <Txt tone=\"ink\" className=\"mt-3\">\n                            {/* A nextCursor means older points exist beyond the fetched window,\n                                so the oldest loaded point is a lower bound, not the true origin. */}\n                            {historyQuery.data?.nextCursor\n                              ? `Active since at least ${formatSnapshotDate(oldestHistoryPoint.startedAt)} · in ${historyPoints.length}+ snapshots`\n                              : `First seen ${formatSnapshotDate(oldestHistoryPoint.startedAt)} · in ${historyPoints.length} ${historyPoints.length === 1 ? 'snapshot' : 'snapshots'}`}{' '}\n                            · {themeTrendDirection(historyPoints)}\n                          </Txt>\n                          {historyPoints.length >= 2 && (\n                            <ThemeTrendChart points={historyPoints} signalName={signalName ?? 'goal'} />\n                          )}\n                        </>\n                      )}\n                    </section>\n                  )}\n                </>\n              )}\n            </>\n          )}\n        </DrawerBody>\n      </DrawerContent>\n    </Drawer>\n  );\n}\n"],"names":["useTraceIntelligence","useState","useThemeDetail","useThemeExamples","EXAMPLES_PAGE_SIZE","useThemeHistory","signalLabel","signalDescription","chronologicalHistoryPoints","jsx","Drawer","DrawerContent","jsxs","DrawerHeader","Txt","getSignalColor","Tooltip","TooltipTrigger","TooltipContent","DrawerTitle","DrawerDescription","DrawerBody","TraceInsightView","Fragment","shareSentence","cn","raisedSurfaceStyle","ExamplesPager","formatSnapshotDate","themeTrendDirection","ThemeTrendChart"],"mappings":"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"}

package/dist/ee/signals/theme-detail-panel.es.js

@@ -6,14 +6,14 @@ import { useTraceIntelligence } from './use-trace-intelligence.es.js';
 import { useThemeDetail } from './hooks/use-theme-detail.es.js';
 import { useThemeExamples } from './hooks/use-theme-examples.es.js';
 import { useThemeHistory } from './hooks/use-theme-history.es.js';
-import { getSignalHue } from './signal-colors.es.js';
+import { getSignalColor } from './signal-colors.es.js';
 import { signalLabel, signalDescription, shareSentence, formatSnapshotDate } from './signal-formatting.es.js';
 import { chronologicalHistoryPoints, themeTrendDirection } from './theme-trend.es.js';
 import { ThemeTrendChart } from './theme-trend-chart.es.js';
 import { TraceInsightView } from './trace-insight-view.es.js';
-import { D as Drawer, d as DrawerContent, g as DrawerHeader, o as DrawerTitle, e as DrawerDescription, b as DrawerBody } from '../../drawer-C1VyTeuX.js';
-import { n as nodeColor } from '../../sankeyColor-BoMbAWtq.js';
+import { D as Drawer, d as DrawerContent, g as DrawerHeader, o as DrawerTitle, e as DrawerDescription, b as DrawerBody } from '../../drawer-DXf50w71.js';
 import { T as Tooltip, c as TooltipTrigger, a as TooltipContent } from '../../tooltip-DsQPiynb.js';
+import { T as Txt } from '../../Txt-BP1SRHmL.js';
 import { raisedSurfaceStyle } from '../../primitives/raised-surface.es.js';
 import { c as cn } from '../../cn-65Adrsfj.js';
 
@@ -79,10 +79,13 @@ function ThemeDetailPanel({
       children: /* @__PURE__ */ jsxs(DrawerContent, { children: [
         /* @__PURE__ */ jsxs(DrawerHeader, { className: "border-b border-border", children: [
           signalName !== void 0 && /* @__PURE__ */ jsx(
-            "span",
+            Txt,
             {
-              className: "font-mono text-column tracking-widest",
-              style: { color: nodeColor(getSignalHue(signalName)) },
+              as: "span",
+              variant: "column",
+              font: "mono",
+              className: "tracking-widest",
+              style: { color: getSignalColor(signalName) },
               children: signalDisplayDescription ? /* @__PURE__ */ jsxs(Tooltip, { children: [
                 /* @__PURE__ */ jsx(TooltipTrigger, { "aria-label": signalDisplayLabel, className: "cursor-default uppercase", children: signalDisplayLabel }),
                 /* @__PURE__ */ jsx(TooltipContent, { children: signalDisplayDescription })
@@ -100,41 +103,49 @@ function ThemeDetailPanel({
         /* @__PURE__ */ jsxs(DrawerBody, { className: "grid content-start gap-6 overflow-y-auto p-6", children: [
           insightTraceId !== void 0 && /* @__PURE__ */ jsx(TraceInsightView, { traceId: insightTraceId, onBack: () => setInsightTraceId(void 0) }),
           insightTraceId === void 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
-            detailQuery.isPending && /* @__PURE__ */ jsx("p", { className: "text-body text-muted-foreground", children: "Loading theme details…" }),
-            detailQuery.isError && /* @__PURE__ */ jsx("p", { className: "text-body text-red-500", children: "Unable to load theme details." }),
+            detailQuery.isPending && /* @__PURE__ */ jsx(Txt, { tone: "muted", children: "Loading theme details…" }),
+            detailQuery.isError && /* @__PURE__ */ jsx(Txt, { className: "text-destructive-indicator", children: "Unable to load theme details." }),
             detailQuery.data && !detailQuery.data.theme && /* @__PURE__ */ jsxs("section", { children: [
-              /* @__PURE__ */ jsx("h2", { className: "text-subheading text-foreground", children: "Not present in this snapshot" }),
-              /* @__PURE__ */ jsx("p", { className: "mt-2 text-body text-muted-foreground", children: "This theme has no data in the selected snapshot." })
+              /* @__PURE__ */ jsx(Txt, { as: "h2", variant: "subheading", tone: "ink", children: "Not present in this snapshot" }),
+              /* @__PURE__ */ jsx(Txt, { tone: "muted", className: "mt-2", children: "This theme has no data in the selected snapshot." })
             ] }),
             detailQuery.data?.theme && /* @__PURE__ */ jsxs(Fragment, { children: [
               /* @__PURE__ */ jsxs("section", { "aria-labelledby": "theme-summary-heading", children: [
                 /* @__PURE__ */ jsx(
-                  "h2",
+                  Txt,
                   {
+                    as: "h2",
+                    variant: "caption",
+                    tone: "muted",
+                    font: "mono",
                     id: "theme-summary-heading",
-                    className: "font-mono text-caption tracking-wider text-muted-foreground uppercase",
+                    className: "tracking-wider uppercase",
                     children: "Summary"
                   }
                 ),
-                /* @__PURE__ */ jsx("p", { className: "mt-3 text-body text-foreground", children: detailQuery.data.theme.description ?? "No description available." }),
-                /* @__PURE__ */ jsx("p", { className: "mt-3 font-mono text-body text-foreground tabular-nums", children: shareSentence(
+                /* @__PURE__ */ jsx(Txt, { tone: "ink", className: "mt-3", children: detailQuery.data.theme.description ?? "No description available." }),
+                /* @__PURE__ */ jsx(Txt, { tone: "ink", font: "mono", className: "mt-3 tabular-nums", children: shareSentence(
                   filteredStats?.traceCount ?? detailQuery.data.theme.traceCount,
                   filteredStats?.stageShare ?? detailQuery.data.theme.coverage
                 ) })
               ] }),
               /* @__PURE__ */ jsxs("section", { "aria-labelledby": "theme-examples-heading", children: [
                 /* @__PURE__ */ jsx(
-                  "h2",
+                  Txt,
                   {
+                    as: "h2",
+                    variant: "caption",
+                    tone: "muted",
+                    font: "mono",
                     id: "theme-examples-heading",
-                    className: "font-mono text-caption tracking-wider text-muted-foreground uppercase",
+                    className: "tracking-wider uppercase",
                     children: "Examples"
                   }
                 ),
-                examplesQuery.isPending && /* @__PURE__ */ jsx("p", { className: "mt-3 text-body text-muted-foreground", children: "Loading examples…" }),
-                examplesQuery.isError && /* @__PURE__ */ jsx("p", { className: "mt-3 text-body text-red-500", children: "Unable to load examples." }),
+                examplesQuery.isPending && /* @__PURE__ */ jsx(Txt, { tone: "muted", className: "mt-3", children: "Loading examples…" }),
+                examplesQuery.isError && /* @__PURE__ */ jsx(Txt, { className: "mt-3 text-destructive-indicator", children: "Unable to load examples." }),
                 examplesQuery.data && /* @__PURE__ */ jsxs(Fragment, { children: [
-                  examplesQuery.data.examples.length === 0 ? /* @__PURE__ */ jsx("p", { className: "mt-3 text-body text-muted-foreground", children: "No examples in this snapshot." }) : /* @__PURE__ */ jsx("ul", { className: "mt-3 space-y-3", children: examplesQuery.data.examples.map((example) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
+                  examplesQuery.data.examples.length === 0 ? /* @__PURE__ */ jsx(Txt, { tone: "muted", className: "mt-3", children: "No examples in this snapshot." }) : /* @__PURE__ */ jsx("ul", { className: "mt-3 space-y-3", children: examplesQuery.data.examples.map((example) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(
                     "button",
                     {
                       type: "button",
@@ -159,29 +170,27 @@ function ThemeDetailPanel({
               ] }),
               snapshotTotal > 1 && /* @__PURE__ */ jsxs("section", { "aria-labelledby": "theme-trend-heading", children: [
                 /* @__PURE__ */ jsx(
-                  "h2",
+                  Txt,
                   {
+                    as: "h2",
+                    variant: "caption",
+                    tone: "muted",
+                    font: "mono",
                     id: "theme-trend-heading",
-                    className: "font-mono text-caption tracking-wider text-muted-foreground uppercase",
+                    className: "tracking-wider uppercase",
                     children: "Trend"
                   }
                 ),
-                historyQuery.isPending && /* @__PURE__ */ jsx("p", { className: "mt-3 text-body text-muted-foreground", children: "Loading trend…" }),
-                historyQuery.isError && /* @__PURE__ */ jsx("p", { className: "mt-3 text-body text-red-500", children: "Unable to load the trend." }),
+                historyQuery.isPending && /* @__PURE__ */ jsx(Txt, { tone: "muted", className: "mt-3", children: "Loading trend…" }),
+                historyQuery.isError && /* @__PURE__ */ jsx(Txt, { className: "mt-3 text-destructive-indicator", children: "Unable to load the trend." }),
                 oldestHistoryPoint !== void 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
-                  /* @__PURE__ */ jsxs("p", { className: "mt-3 text-body text-foreground", children: [
+                  /* @__PURE__ */ jsxs(Txt, { tone: "ink", className: "mt-3", children: [
                     historyQuery.data?.nextCursor ? `Active since at least ${formatSnapshotDate(oldestHistoryPoint.startedAt)} · in ${historyPoints.length}+ snapshots` : `First seen ${formatSnapshotDate(oldestHistoryPoint.startedAt)} · in ${historyPoints.length} ${historyPoints.length === 1 ? "snapshot" : "snapshots"}`,
                     " ",
                     "· ",
                     themeTrendDirection(historyPoints)
                   ] }),
-                  historyPoints.length >= 2 && /* @__PURE__ */ jsx(
-                    ThemeTrendChart,
-                    {
-                      points: historyPoints,
-                      color: nodeColor(getSignalHue(signalName ?? "goal"))
-                    }
-                  )
+                  historyPoints.length >= 2 && /* @__PURE__ */ jsx(ThemeTrendChart, { points: historyPoints, signalName: signalName ?? "goal" })
                 ] })
               ] })
             ] })

package/dist/ee/signals/theme-detail-panel.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"theme-detail-panel.es.js","sources":["../../../src/ee/signals/theme-detail-panel.tsx"],"sourcesContent":["import { useState } from 'react';\n\nimport { EXAMPLES_PAGE_SIZE, ExamplesPager } from './examples-pager';\nimport { useThemeDetail, useThemeExamples, useThemeHistory } from './hooks';\nimport { getSignalHue } from './signal-colors';\nimport { formatSnapshotDate, shareSentence, signalDescription, signalLabel } from './signal-formatting';\nimport type { SelectedTheme, ThemeSelection, ThemeSelectionStats } from './theme-drilldown-data';\nimport { chronologicalHistoryPoints, themeTrendDirection } from './theme-trend';\nimport { ThemeTrendChart } from './theme-trend-chart';\nimport { TraceInsightView } from './trace-insight-view';\nimport { useTraceIntelligence } from './use-trace-intelligence';\nimport {\n  Drawer,\n  DrawerBody,\n  DrawerContent,\n  DrawerDescription,\n  DrawerHeader,\n  DrawerTitle,\n} from '@/ds/components/Drawer';\nimport { nodeColor } from '@/ds/components/SankeyChart';\nimport { Tooltip, TooltipContent, TooltipTrigger } from '@/ds/components/Tooltip';\nimport { raisedSurfaceStyle } from '@/ds/primitives/raised-surface';\nimport { cn } from '@/lib/utils';\n\ninterface ThemeDetailPanelProps {\n  entityId: string;\n  entityType: string;\n  snapshotId: string;\n  snapshotTotal: number;\n  selection: SelectedTheme | undefined;\n  filters?: ThemeSelection[];\n  filteredStats?: ThemeSelectionStats;\n  onClose: () => void;\n}\n\nexport function ThemeDetailPanel({\n  entityId,\n  entityType,\n  snapshotId,\n  snapshotTotal,\n  selection,\n  filters = [],\n  filteredStats,\n  onClose,\n}: ThemeDetailPanelProps) {\n  const { signalCatalog } = useTraceIntelligence();\n  const filterKey = filters\n    .map(filter => `${filter.signalName}:${filter.kind === 'theme' ? filter.themeId : 'noise'}`)\n    .join(',');\n  const examplesContextKey = `${snapshotId}:${selection?.signalName ?? ''}:${selection?.themeId ?? ''}:${filterKey}`;\n  const [examplesPage, setExamplesPage] = useState(() => ({ contextKey: examplesContextKey, offset: 0 }));\n  const examplesOffset = examplesPage.contextKey === examplesContextKey ? examplesPage.offset : 0;\n  const [insightTraceId, setInsightTraceId] = useState<string>();\n  const detailQuery = useThemeDetail(\n    entityId,\n    entityType,\n    selection?.signalName ?? 'goal',\n    snapshotId,\n    selection?.themeId,\n  );\n  const examplesQuery = useThemeExamples(\n    entityId,\n    entityType,\n    selection?.signalName ?? 'goal',\n    snapshotId,\n    selection?.themeId,\n    EXAMPLES_PAGE_SIZE,\n    examplesOffset,\n    filters,\n  );\n  const historyQuery = useThemeHistory(\n    entityId,\n    entityType,\n    selection?.signalName ?? 'goal',\n    snapshotTotal > 1 ? selection?.themeId : undefined,\n  );\n  const title = detailQuery.data?.theme?.label ?? selection?.label ?? 'Theme details';\n  const signalName = selection?.signalName;\n  const signalDisplayLabel = signalName ? signalLabel(signalCatalog, signalName) : undefined;\n  const signalDisplayDescription = signalName ? signalDescription(signalCatalog, signalName) : undefined;\n  const historyPoints = historyQuery.data ? chronologicalHistoryPoints(historyQuery.data.points) : [];\n  const oldestHistoryPoint = historyPoints[0];\n\n  return (\n    <Drawer\n      onOpenChange={open => {\n        if (!open) {\n          setExamplesPage({ contextKey: '', offset: 0 });\n          setInsightTraceId(undefined);\n          onClose();\n        }\n      }}\n      open={selection !== undefined}\n      overlay=\"none\"\n      side=\"right\"\n      variant=\"floating\"\n    >\n      <DrawerContent>\n        <DrawerHeader className=\"border-b border-border\">\n          {signalName !== undefined && (\n            <span\n              className=\"font-mono text-column tracking-widest\"\n              style={{ color: nodeColor(getSignalHue(signalName)) }}\n            >\n              {signalDisplayDescription ? (\n                <Tooltip>\n                  <TooltipTrigger aria-label={signalDisplayLabel} className=\"cursor-default uppercase\">\n                    {signalDisplayLabel}\n                  </TooltipTrigger>\n                  <TooltipContent>{signalDisplayDescription}</TooltipContent>\n                </Tooltip>\n              ) : (\n                <span className=\"uppercase\">{signalDisplayLabel}</span>\n              )}\n            </span>\n          )}\n          <DrawerTitle>{title}</DrawerTitle>\n          <DrawerDescription className=\"sr-only\">\n            Details for the {signalName ?? 'selected'} theme {title}\n          </DrawerDescription>\n        </DrawerHeader>\n        <DrawerBody className=\"grid content-start gap-6 overflow-y-auto p-6\">\n          {insightTraceId !== undefined && (\n            <TraceInsightView traceId={insightTraceId} onBack={() => setInsightTraceId(undefined)} />\n          )}\n          {insightTraceId === undefined && (\n            <>\n              {detailQuery.isPending && <p className=\"text-body text-muted-foreground\">Loading theme details…</p>}\n              {detailQuery.isError && <p className=\"text-body text-red-500\">Unable to load theme details.</p>}\n              {detailQuery.data && !detailQuery.data.theme && (\n                <section>\n                  <h2 className=\"text-subheading text-foreground\">Not present in this snapshot</h2>\n                  <p className=\"mt-2 text-body text-muted-foreground\">\n                    This theme has no data in the selected snapshot.\n                  </p>\n                </section>\n              )}\n              {detailQuery.data?.theme && (\n                <>\n                  <section aria-labelledby=\"theme-summary-heading\">\n                    <h2\n                      id=\"theme-summary-heading\"\n                      className=\"font-mono text-caption tracking-wider text-muted-foreground uppercase\"\n                    >\n                      Summary\n                    </h2>\n                    <p className=\"mt-3 text-body text-foreground\">\n                      {detailQuery.data.theme.description ?? 'No description available.'}\n                    </p>\n                    <p className=\"mt-3 font-mono text-body text-foreground tabular-nums\">\n                      {shareSentence(\n                        filteredStats?.traceCount ?? detailQuery.data.theme.traceCount,\n                        filteredStats?.stageShare ?? detailQuery.data.theme.coverage,\n                      )}\n                    </p>\n                  </section>\n\n                  <section aria-labelledby=\"theme-examples-heading\">\n                    <h2\n                      id=\"theme-examples-heading\"\n                      className=\"font-mono text-caption tracking-wider text-muted-foreground uppercase\"\n                    >\n                      Examples\n                    </h2>\n                    {examplesQuery.isPending && (\n                      <p className=\"mt-3 text-body text-muted-foreground\">Loading examples…</p>\n                    )}\n                    {examplesQuery.isError && <p className=\"mt-3 text-body text-red-500\">Unable to load examples.</p>}\n                    {examplesQuery.data && (\n                      <>\n                        {examplesQuery.data.examples.length === 0 ? (\n                          <p className=\"mt-3 text-body text-muted-foreground\">No examples in this snapshot.</p>\n                        ) : (\n                          <ul className=\"mt-3 space-y-3\">\n                            {examplesQuery.data.examples.map(example => (\n                              <li key={example.traceId}>\n                                <button\n                                  type=\"button\"\n                                  aria-label={`View trace insight for ${example.signalText}`}\n                                  className={cn(\n                                    raisedSurfaceStyle,\n                                    'state-layer w-full cursor-pointer rounded-md p-3 text-left text-body text-foreground',\n                                  )}\n                                  onClick={() => setInsightTraceId(example.traceId)}\n                                >\n                                  {example.signalText}\n                                </button>\n                              </li>\n                            ))}\n                          </ul>\n                        )}\n                        <ExamplesPager\n                          traceCount={filteredStats?.traceCount ?? detailQuery.data.theme.traceCount}\n                          offset={examplesOffset}\n                          onOffsetChange={offset => setExamplesPage({ contextKey: examplesContextKey, offset })}\n                        />\n                      </>\n                    )}\n                  </section>\n\n                  {snapshotTotal > 1 && (\n                    <section aria-labelledby=\"theme-trend-heading\">\n                      <h2\n                        id=\"theme-trend-heading\"\n                        className=\"font-mono text-caption tracking-wider text-muted-foreground uppercase\"\n                      >\n                        Trend\n                      </h2>\n                      {historyQuery.isPending && <p className=\"mt-3 text-body text-muted-foreground\">Loading trend…</p>}\n                      {historyQuery.isError && <p className=\"mt-3 text-body text-red-500\">Unable to load the trend.</p>}\n                      {oldestHistoryPoint !== undefined && (\n                        <>\n                          <p className=\"mt-3 text-body text-foreground\">\n                            {/* A nextCursor means older points exist beyond the fetched window,\n                                so the oldest loaded point is a lower bound, not the true origin. */}\n                            {historyQuery.data?.nextCursor\n                              ? `Active since at least ${formatSnapshotDate(oldestHistoryPoint.startedAt)} · in ${historyPoints.length}+ snapshots`\n                              : `First seen ${formatSnapshotDate(oldestHistoryPoint.startedAt)} · in ${historyPoints.length} ${historyPoints.length === 1 ? 'snapshot' : 'snapshots'}`}{' '}\n                            · {themeTrendDirection(historyPoints)}\n                          </p>\n                          {historyPoints.length >= 2 && (\n                            <ThemeTrendChart\n                              points={historyPoints}\n                              color={nodeColor(getSignalHue(signalName ?? 'goal'))}\n                            />\n                          )}\n                        </>\n                      )}\n                    </section>\n                  )}\n                </>\n              )}\n            </>\n          )}\n        </DrawerBody>\n      </DrawerContent>\n    </Drawer>\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"theme-detail-panel.es.js","sources":["../../../src/ee/signals/theme-detail-panel.tsx"],"sourcesContent":["import { useState } from 'react';\n\nimport { EXAMPLES_PAGE_SIZE, ExamplesPager } from './examples-pager';\nimport { useThemeDetail, useThemeExamples, useThemeHistory } from './hooks';\nimport { getSignalColor } from './signal-colors';\nimport { formatSnapshotDate, shareSentence, signalDescription, signalLabel } from './signal-formatting';\nimport type { SelectedTheme, ThemeSelection, ThemeSelectionStats } from './theme-drilldown-data';\nimport { chronologicalHistoryPoints, themeTrendDirection } from './theme-trend';\nimport { ThemeTrendChart } from './theme-trend-chart';\nimport { TraceInsightView } from './trace-insight-view';\nimport { useTraceIntelligence } from './use-trace-intelligence';\nimport {\n  Drawer,\n  DrawerBody,\n  DrawerContent,\n  DrawerDescription,\n  DrawerHeader,\n  DrawerTitle,\n} from '@/ds/components/Drawer';\nimport { Tooltip, TooltipContent, TooltipTrigger } from '@/ds/components/Tooltip';\nimport { Txt } from '@/ds/components/Txt';\nimport { raisedSurfaceStyle } from '@/ds/primitives/raised-surface';\nimport { cn } from '@/lib/utils';\n\ninterface ThemeDetailPanelProps {\n  entityId: string;\n  entityType: string;\n  snapshotId: string;\n  snapshotTotal: number;\n  selection: SelectedTheme | undefined;\n  filters?: ThemeSelection[];\n  filteredStats?: ThemeSelectionStats;\n  onClose: () => void;\n}\n\nexport function ThemeDetailPanel({\n  entityId,\n  entityType,\n  snapshotId,\n  snapshotTotal,\n  selection,\n  filters = [],\n  filteredStats,\n  onClose,\n}: ThemeDetailPanelProps) {\n  const { signalCatalog } = useTraceIntelligence();\n  const filterKey = filters\n    .map(filter => `${filter.signalName}:${filter.kind === 'theme' ? filter.themeId : 'noise'}`)\n    .join(',');\n  const examplesContextKey = `${snapshotId}:${selection?.signalName ?? ''}:${selection?.themeId ?? ''}:${filterKey}`;\n  const [examplesPage, setExamplesPage] = useState(() => ({ contextKey: examplesContextKey, offset: 0 }));\n  const examplesOffset = examplesPage.contextKey === examplesContextKey ? examplesPage.offset : 0;\n  const [insightTraceId, setInsightTraceId] = useState<string>();\n  const detailQuery = useThemeDetail(\n    entityId,\n    entityType,\n    selection?.signalName ?? 'goal',\n    snapshotId,\n    selection?.themeId,\n  );\n  const examplesQuery = useThemeExamples(\n    entityId,\n    entityType,\n    selection?.signalName ?? 'goal',\n    snapshotId,\n    selection?.themeId,\n    EXAMPLES_PAGE_SIZE,\n    examplesOffset,\n    filters,\n  );\n  const historyQuery = useThemeHistory(\n    entityId,\n    entityType,\n    selection?.signalName ?? 'goal',\n    snapshotTotal > 1 ? selection?.themeId : undefined,\n  );\n  const title = detailQuery.data?.theme?.label ?? selection?.label ?? 'Theme details';\n  const signalName = selection?.signalName;\n  const signalDisplayLabel = signalName ? signalLabel(signalCatalog, signalName) : undefined;\n  const signalDisplayDescription = signalName ? signalDescription(signalCatalog, signalName) : undefined;\n  const historyPoints = historyQuery.data ? chronologicalHistoryPoints(historyQuery.data.points) : [];\n  const oldestHistoryPoint = historyPoints[0];\n\n  return (\n    <Drawer\n      onOpenChange={open => {\n        if (!open) {\n          setExamplesPage({ contextKey: '', offset: 0 });\n          setInsightTraceId(undefined);\n          onClose();\n        }\n      }}\n      open={selection !== undefined}\n      overlay=\"none\"\n      side=\"right\"\n      variant=\"floating\"\n    >\n      <DrawerContent>\n        <DrawerHeader className=\"border-b border-border\">\n          {signalName !== undefined && (\n            <Txt\n              as=\"span\"\n              variant=\"column\"\n              font=\"mono\"\n              className=\"tracking-widest\"\n              style={{ color: getSignalColor(signalName) }}\n            >\n              {signalDisplayDescription ? (\n                <Tooltip>\n                  <TooltipTrigger aria-label={signalDisplayLabel} className=\"cursor-default uppercase\">\n                    {signalDisplayLabel}\n                  </TooltipTrigger>\n                  <TooltipContent>{signalDisplayDescription}</TooltipContent>\n                </Tooltip>\n              ) : (\n                <span className=\"uppercase\">{signalDisplayLabel}</span>\n              )}\n            </Txt>\n          )}\n          <DrawerTitle>{title}</DrawerTitle>\n          <DrawerDescription className=\"sr-only\">\n            Details for the {signalName ?? 'selected'} theme {title}\n          </DrawerDescription>\n        </DrawerHeader>\n        <DrawerBody className=\"grid content-start gap-6 overflow-y-auto p-6\">\n          {insightTraceId !== undefined && (\n            <TraceInsightView traceId={insightTraceId} onBack={() => setInsightTraceId(undefined)} />\n          )}\n          {insightTraceId === undefined && (\n            <>\n              {detailQuery.isPending && <Txt tone=\"muted\">Loading theme details…</Txt>}\n              {detailQuery.isError && <Txt className=\"text-destructive-indicator\">Unable to load theme details.</Txt>}\n              {detailQuery.data && !detailQuery.data.theme && (\n                <section>\n                  <Txt as=\"h2\" variant=\"subheading\" tone=\"ink\">\n                    Not present in this snapshot\n                  </Txt>\n                  <Txt tone=\"muted\" className=\"mt-2\">\n                    This theme has no data in the selected snapshot.\n                  </Txt>\n                </section>\n              )}\n              {detailQuery.data?.theme && (\n                <>\n                  <section aria-labelledby=\"theme-summary-heading\">\n                    <Txt\n                      as=\"h2\"\n                      variant=\"caption\"\n                      tone=\"muted\"\n                      font=\"mono\"\n                      id=\"theme-summary-heading\"\n                      className=\"tracking-wider uppercase\"\n                    >\n                      Summary\n                    </Txt>\n                    <Txt tone=\"ink\" className=\"mt-3\">\n                      {detailQuery.data.theme.description ?? 'No description available.'}\n                    </Txt>\n                    <Txt tone=\"ink\" font=\"mono\" className=\"mt-3 tabular-nums\">\n                      {shareSentence(\n                        filteredStats?.traceCount ?? detailQuery.data.theme.traceCount,\n                        filteredStats?.stageShare ?? detailQuery.data.theme.coverage,\n                      )}\n                    </Txt>\n                  </section>\n\n                  <section aria-labelledby=\"theme-examples-heading\">\n                    <Txt\n                      as=\"h2\"\n                      variant=\"caption\"\n                      tone=\"muted\"\n                      font=\"mono\"\n                      id=\"theme-examples-heading\"\n                      className=\"tracking-wider uppercase\"\n                    >\n                      Examples\n                    </Txt>\n                    {examplesQuery.isPending && (\n                      <Txt tone=\"muted\" className=\"mt-3\">\n                        Loading examples…\n                      </Txt>\n                    )}\n                    {examplesQuery.isError && (\n                      <Txt className=\"mt-3 text-destructive-indicator\">Unable to load examples.</Txt>\n                    )}\n                    {examplesQuery.data && (\n                      <>\n                        {examplesQuery.data.examples.length === 0 ? (\n                          <Txt tone=\"muted\" className=\"mt-3\">\n                            No examples in this snapshot.\n                          </Txt>\n                        ) : (\n                          <ul className=\"mt-3 space-y-3\">\n                            {examplesQuery.data.examples.map(example => (\n                              <li key={example.traceId}>\n                                <button\n                                  type=\"button\"\n                                  aria-label={`View trace insight for ${example.signalText}`}\n                                  className={cn(\n                                    raisedSurfaceStyle,\n                                    'state-layer w-full cursor-pointer rounded-md p-3 text-left text-body text-foreground',\n                                  )}\n                                  onClick={() => setInsightTraceId(example.traceId)}\n                                >\n                                  {example.signalText}\n                                </button>\n                              </li>\n                            ))}\n                          </ul>\n                        )}\n                        <ExamplesPager\n                          traceCount={filteredStats?.traceCount ?? detailQuery.data.theme.traceCount}\n                          offset={examplesOffset}\n                          onOffsetChange={offset => setExamplesPage({ contextKey: examplesContextKey, offset })}\n                        />\n                      </>\n                    )}\n                  </section>\n\n                  {snapshotTotal > 1 && (\n                    <section aria-labelledby=\"theme-trend-heading\">\n                      <Txt\n                        as=\"h2\"\n                        variant=\"caption\"\n                        tone=\"muted\"\n                        font=\"mono\"\n                        id=\"theme-trend-heading\"\n                        className=\"tracking-wider uppercase\"\n                      >\n                        Trend\n                      </Txt>\n                      {historyQuery.isPending && (\n                        <Txt tone=\"muted\" className=\"mt-3\">\n                          Loading trend…\n                        </Txt>\n                      )}\n                      {historyQuery.isError && (\n                        <Txt className=\"mt-3 text-destructive-indicator\">Unable to load the trend.</Txt>\n                      )}\n                      {oldestHistoryPoint !== undefined && (\n                        <>\n                          <Txt tone=\"ink\" className=\"mt-3\">\n                            {/* A nextCursor means older points exist beyond the fetched window,\n                                so the oldest loaded point is a lower bound, not the true origin. */}\n                            {historyQuery.data?.nextCursor\n                              ? `Active since at least ${formatSnapshotDate(oldestHistoryPoint.startedAt)} · in ${historyPoints.length}+ snapshots`\n                              : `First seen ${formatSnapshotDate(oldestHistoryPoint.startedAt)} · in ${historyPoints.length} ${historyPoints.length === 1 ? 'snapshot' : 'snapshots'}`}{' '}\n                            · {themeTrendDirection(historyPoints)}\n                          </Txt>\n                          {historyPoints.length >= 2 && (\n                            <ThemeTrendChart points={historyPoints} signalName={signalName ?? 'goal'} />\n                          )}\n                        </>\n                      )}\n                    </section>\n                  )}\n                </>\n              )}\n            </>\n          )}\n        </DrawerBody>\n      </DrawerContent>\n    </Drawer>\n  );\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAmCO,SAAS,gBAAA,CAAiB;AAAA,EAC/B,QAAA;AAAA,EACA,UAAA;AAAA,EACA,UAAA;AAAA,EACA,aAAA;AAAA,EACA,SAAA;AAAA,EACA,UAAU,EAAC;AAAA,EACX,aAAA;AAAA,EACA;AACF,CAAA,EAA0B;AACxB,EAAA,MAAM,EAAE,aAAA,EAAc,GAAI,oBAAA,EAAqB;AAC/C,EAAA,MAAM,YAAY,OAAA,CACf,GAAA,CAAI,CAAA,MAAA,KAAU,CAAA,EAAG,OAAO,UAAU,CAAA,CAAA,EAAI,MAAA,CAAO,IAAA,KAAS,UAAU,MAAA,CAAO,OAAA,GAAU,OAAO,CAAA,CAAE,CAAA,CAC1F,KAAK,GAAG,CAAA;AACX,EAAA,MAAM,kBAAA,GAAqB,CAAA,EAAG,UAAU,CAAA,CAAA,EAAI,SAAA,EAAW,UAAA,IAAc,EAAE,CAAA,CAAA,EAAI,SAAA,EAAW,OAAA,IAAW,EAAE,CAAA,CAAA,EAAI,SAAS,CAAA,CAAA;AAChH,EAAA,MAAM,CAAC,YAAA,EAAc,eAAe,CAAA,GAAI,QAAA,CAAS,OAAO,EAAE,UAAA,EAAY,kBAAA,EAAoB,MAAA,EAAQ,CAAA,EAAE,CAAE,CAAA;AACtG,EAAA,MAAM,cAAA,GAAiB,YAAA,CAAa,UAAA,KAAe,kBAAA,GAAqB,aAAa,MAAA,GAAS,CAAA;AAC9F,EAAA,MAAM,CAAC,cAAA,EAAgB,iBAAiB,CAAA,GAAI,QAAA,EAAiB;AAC7D,EAAA,MAAM,WAAA,GAAc,cAAA;AAAA,IAClB,QAAA;AAAA,IACA,UAAA;AAAA,IACA,WAAW,UAAA,IAAc,MAAA;AAAA,IACzB,UAAA;AAAA,IACA,SAAA,EAAW;AAAA,GACb;AACA,EAAA,MAAM,aAAA,GAAgB,gBAAA;AAAA,IACpB,QAAA;AAAA,IACA,UAAA;AAAA,IACA,WAAW,UAAA,IAAc,MAAA;AAAA,IACzB,UAAA;AAAA,IACA,SAAA,EAAW,OAAA;AAAA,IACX,kBAAA;AAAA,IACA,cAAA;AAAA,IACA;AAAA,GACF;AACA,EAAA,MAAM,YAAA,GAAe,eAAA;AAAA,IACnB,QAAA;AAAA,IACA,UAAA;AAAA,IACA,WAAW,UAAA,IAAc,MAAA;AAAA,IACzB,aAAA,GAAgB,CAAA,GAAI,SAAA,EAAW,OAAA,GAAU;AAAA,GAC3C;AACA,EAAA,MAAM,QAAQ,WAAA,CAAY,IAAA,EAAM,KAAA,EAAO,KAAA,IAAS,WAAW,KAAA,IAAS,eAAA;AACpE,EAAA,MAAM,aAAa,SAAA,EAAW,UAAA;AAC9B,EAAA,MAAM,kBAAA,GAAqB,UAAA,GAAa,WAAA,CAAY,aAAA,EAAe,UAAU,CAAA,GAAI,MAAA;AACjF,EAAA,MAAM,wBAAA,GAA2B,UAAA,GAAa,iBAAA,CAAkB,aAAA,EAAe,UAAU,CAAA,GAAI,MAAA;AAC7F,EAAA,MAAM,aAAA,GAAgB,aAAa,IAAA,GAAO,0BAAA,CAA2B,aAAa,IAAA,CAAK,MAAM,IAAI,EAAC;AAClG,EAAA,MAAM,kBAAA,GAAqB,cAAc,CAAC,CAAA;AAE1C,EAAA,uBACE,GAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,cAAc,CAAA,IAAA,KAAQ;AACpB,QAAA,IAAI,CAAC,IAAA,EAAM;AACT,UAAA,eAAA,CAAgB,EAAE,UAAA,EAAY,EAAA,EAAI,MAAA,EAAQ,GAAG,CAAA;AAC7C,UAAA,iBAAA,CAAkB,MAAS,CAAA;AAC3B,UAAA,OAAA,EAAQ;AAAA,QACV;AAAA,MACF,CAAA;AAAA,MACA,MAAM,SAAA,KAAc,MAAA;AAAA,MACpB,OAAA,EAAQ,MAAA;AAAA,MACR,IAAA,EAAK,OAAA;AAAA,MACL,OAAA,EAAQ,UAAA;AAAA,MAER,+BAAC,aAAA,EAAA,EACC,QAAA,EAAA;AAAA,wBAAA,IAAA,CAAC,YAAA,EAAA,EAAa,WAAU,wBAAA,EACrB,QAAA,EAAA;AAAA,UAAA,UAAA,KAAe,MAAA,oBACd,GAAA;AAAA,YAAC,GAAA;AAAA,YAAA;AAAA,cACC,EAAA,EAAG,MAAA;AAAA,cACH,OAAA,EAAQ,QAAA;AAAA,cACR,IAAA,EAAK,MAAA;AAAA,cACL,SAAA,EAAU,iBAAA;AAAA,cACV,KAAA,EAAO,EAAE,KAAA,EAAO,cAAA,CAAe,UAAU,CAAA,EAAE;AAAA,cAE1C,QAAA,EAAA,wBAAA,wBACE,OAAA,EAAA,EACC,QAAA,EAAA;AAAA,gCAAA,GAAA,CAAC,cAAA,EAAA,EAAe,YAAA,EAAY,kBAAA,EAAoB,SAAA,EAAU,4BACvD,QAAA,EAAA,kBAAA,EACH,CAAA;AAAA,gCACA,GAAA,CAAC,kBAAgB,QAAA,EAAA,wBAAA,EAAyB;AAAA,eAAA,EAC5C,CAAA,mBAEA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,aAAa,QAAA,EAAA,kBAAA,EAAmB;AAAA;AAAA,WAEpD;AAAA,0BAEF,GAAA,CAAC,eAAa,QAAA,EAAA,KAAA,EAAM,CAAA;AAAA,0BACpB,IAAA,CAAC,iBAAA,EAAA,EAAkB,SAAA,EAAU,SAAA,EAAU,QAAA,EAAA;AAAA,YAAA,kBAAA;AAAA,YACpB,UAAA,IAAc,UAAA;AAAA,YAAW,SAAA;AAAA,YAAQ;AAAA,WAAA,EACpD;AAAA,SAAA,EACF,CAAA;AAAA,wBACA,IAAA,CAAC,UAAA,EAAA,EAAW,SAAA,EAAU,8CAAA,EACnB,QAAA,EAAA;AAAA,UAAA,cAAA,KAAmB,MAAA,wBACjB,gBAAA,EAAA,EAAiB,OAAA,EAAS,gBAAgB,MAAA,EAAQ,MAAM,iBAAA,CAAkB,MAAS,CAAA,EAAG,CAAA;AAAA,UAExF,cAAA,KAAmB,0BAClB,IAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,YAAA,WAAA,CAAY,SAAA,oBAAa,GAAA,CAAC,GAAA,EAAA,EAAI,IAAA,EAAK,SAAQ,QAAA,EAAA,wBAAA,EAAsB,CAAA;AAAA,YACjE,YAAY,OAAA,oBAAW,GAAA,CAAC,GAAA,EAAA,EAAI,SAAA,EAAU,8BAA6B,QAAA,EAAA,+BAAA,EAA6B,CAAA;AAAA,YAChG,YAAY,IAAA,IAAQ,CAAC,YAAY,IAAA,CAAK,KAAA,yBACpC,SAAA,EAAA,EACC,QAAA,EAAA;AAAA,8BAAA,GAAA,CAAC,OAAI,EAAA,EAAG,IAAA,EAAK,SAAQ,YAAA,EAAa,IAAA,EAAK,OAAM,QAAA,EAAA,8BAAA,EAE7C,CAAA;AAAA,kCACC,GAAA,EAAA,EAAI,IAAA,EAAK,OAAA,EAAQ,SAAA,EAAU,QAAO,QAAA,EAAA,kDAAA,EAEnC;AAAA,aAAA,EACF,CAAA;AAAA,YAED,WAAA,CAAY,IAAA,EAAM,KAAA,oBACjB,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,8BAAA,IAAA,CAAC,SAAA,EAAA,EAAQ,mBAAgB,uBAAA,EACvB,QAAA,EAAA;AAAA,gCAAA,GAAA;AAAA,kBAAC,GAAA;AAAA,kBAAA;AAAA,oBACC,EAAA,EAAG,IAAA;AAAA,oBACH,OAAA,EAAQ,SAAA;AAAA,oBACR,IAAA,EAAK,OAAA;AAAA,oBACL,IAAA,EAAK,MAAA;AAAA,oBACL,EAAA,EAAG,uBAAA;AAAA,oBACH,SAAA,EAAU,0BAAA;AAAA,oBACX,QAAA,EAAA;AAAA;AAAA,iBAED;AAAA,gCACA,GAAA,CAAC,GAAA,EAAA,EAAI,IAAA,EAAK,KAAA,EAAM,SAAA,EAAU,QACvB,QAAA,EAAA,WAAA,CAAY,IAAA,CAAK,KAAA,CAAM,WAAA,IAAe,2BAAA,EACzC,CAAA;AAAA,oCACC,GAAA,EAAA,EAAI,IAAA,EAAK,OAAM,IAAA,EAAK,MAAA,EAAO,WAAU,mBAAA,EACnC,QAAA,EAAA,aAAA;AAAA,kBACC,aAAA,EAAe,UAAA,IAAc,WAAA,CAAY,IAAA,CAAK,KAAA,CAAM,UAAA;AAAA,kBACpD,aAAA,EAAe,UAAA,IAAc,WAAA,CAAY,IAAA,CAAK,KAAA,CAAM;AAAA,iBACtD,EACF;AAAA,eAAA,EACF,CAAA;AAAA,8BAEA,IAAA,CAAC,SAAA,EAAA,EAAQ,iBAAA,EAAgB,wBAAA,EACvB,QAAA,EAAA;AAAA,gCAAA,GAAA;AAAA,kBAAC,GAAA;AAAA,kBAAA;AAAA,oBACC,EAAA,EAAG,IAAA;AAAA,oBACH,OAAA,EAAQ,SAAA;AAAA,oBACR,IAAA,EAAK,OAAA;AAAA,oBACL,IAAA,EAAK,MAAA;AAAA,oBACL,EAAA,EAAG,wBAAA;AAAA,oBACH,SAAA,EAAU,0BAAA;AAAA,oBACX,QAAA,EAAA;AAAA;AAAA,iBAED;AAAA,gBACC,aAAA,CAAc,6BACb,GAAA,CAAC,GAAA,EAAA,EAAI,MAAK,OAAA,EAAQ,SAAA,EAAU,QAAO,QAAA,EAAA,mBAAA,EAEnC,CAAA;AAAA,gBAED,cAAc,OAAA,oBACb,GAAA,CAAC,GAAA,EAAA,EAAI,SAAA,EAAU,mCAAkC,QAAA,EAAA,0BAAA,EAAwB,CAAA;AAAA,gBAE1E,aAAA,CAAc,wBACb,IAAA,CAAA,QAAA,EAAA,EACG,QAAA,EAAA;AAAA,kBAAA,aAAA,CAAc,IAAA,CAAK,SAAS,MAAA,KAAW,CAAA,uBACrC,GAAA,EAAA,EAAI,IAAA,EAAK,OAAA,EAAQ,SAAA,EAAU,MAAA,EAAO,QAAA,EAAA,+BAAA,EAEnC,oBAEA,GAAA,CAAC,IAAA,EAAA,EAAG,WAAU,gBAAA,EACX,QAAA,EAAA,aAAA,CAAc,KAAK,QAAA,CAAS,GAAA,CAAI,CAAA,OAAA,qBAC/B,GAAA,CAAC,IAAA,EAAA,EACC,QAAA,kBAAA,GAAA;AAAA,oBAAC,QAAA;AAAA,oBAAA;AAAA,sBACC,IAAA,EAAK,QAAA;AAAA,sBACL,YAAA,EAAY,CAAA,uBAAA,EAA0B,OAAA,CAAQ,UAAU,CAAA,CAAA;AAAA,sBACxD,SAAA,EAAW,EAAA;AAAA,wBACT,kBAAA;AAAA,wBACA;AAAA,uBACF;AAAA,sBACA,OAAA,EAAS,MAAM,iBAAA,CAAkB,OAAA,CAAQ,OAAO,CAAA;AAAA,sBAE/C,QAAA,EAAA,OAAA,CAAQ;AAAA;AAAA,mBACX,EAAA,EAXO,OAAA,CAAQ,OAYjB,CACD,CAAA,EACH,CAAA;AAAA,kCAEF,GAAA;AAAA,oBAAC,aAAA;AAAA,oBAAA;AAAA,sBACC,UAAA,EAAY,aAAA,EAAe,UAAA,IAAc,WAAA,CAAY,KAAK,KAAA,CAAM,UAAA;AAAA,sBAChE,MAAA,EAAQ,cAAA;AAAA,sBACR,gBAAgB,CAAA,MAAA,KAAU,eAAA,CAAgB,EAAE,UAAA,EAAY,kBAAA,EAAoB,QAAQ;AAAA;AAAA;AACtF,iBAAA,EACF;AAAA,eAAA,EAEJ,CAAA;AAAA,cAEC,aAAA,GAAgB,CAAA,oBACf,IAAA,CAAC,SAAA,EAAA,EAAQ,mBAAgB,qBAAA,EACvB,QAAA,EAAA;AAAA,gCAAA,GAAA;AAAA,kBAAC,GAAA;AAAA,kBAAA;AAAA,oBACC,EAAA,EAAG,IAAA;AAAA,oBACH,OAAA,EAAQ,SAAA;AAAA,oBACR,IAAA,EAAK,OAAA;AAAA,oBACL,IAAA,EAAK,MAAA;AAAA,oBACL,EAAA,EAAG,qBAAA;AAAA,oBACH,SAAA,EAAU,0BAAA;AAAA,oBACX,QAAA,EAAA;AAAA;AAAA,iBAED;AAAA,gBACC,YAAA,CAAa,6BACZ,GAAA,CAAC,GAAA,EAAA,EAAI,MAAK,OAAA,EAAQ,SAAA,EAAU,QAAO,QAAA,EAAA,gBAAA,EAEnC,CAAA;AAAA,gBAED,aAAa,OAAA,oBACZ,GAAA,CAAC,GAAA,EAAA,EAAI,SAAA,EAAU,mCAAkC,QAAA,EAAA,2BAAA,EAAyB,CAAA;AAAA,gBAE3E,kBAAA,KAAuB,0BACtB,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,kCAAA,IAAA,CAAC,GAAA,EAAA,EAAI,IAAA,EAAK,KAAA,EAAM,SAAA,EAAU,MAAA,EAGvB,QAAA,EAAA;AAAA,oBAAA,YAAA,CAAa,IAAA,EAAM,UAAA,GAChB,CAAA,sBAAA,EAAyB,kBAAA,CAAmB,kBAAA,CAAmB,SAAS,CAAC,CAAA,MAAA,EAAS,aAAA,CAAc,MAAM,CAAA,WAAA,CAAA,GACtG,CAAA,WAAA,EAAc,mBAAmB,kBAAA,CAAmB,SAAS,CAAC,CAAA,MAAA,EAAS,aAAA,CAAc,MAAM,IAAI,aAAA,CAAc,MAAA,KAAW,CAAA,GAAI,UAAA,GAAa,WAAW,CAAA,CAAA;AAAA,oBAAI,GAAA;AAAA,oBAAI,IAAA;AAAA,oBAC7J,oBAAoB,aAAa;AAAA,mBAAA,EACtC,CAAA;AAAA,kBACC,aAAA,CAAc,UAAU,CAAA,oBACvB,GAAA,CAAC,mBAAgB,MAAA,EAAQ,aAAA,EAAe,UAAA,EAAY,UAAA,IAAc,MAAA,EAAQ;AAAA,iBAAA,EAE9E;AAAA,eAAA,EAEJ;AAAA,aAAA,EAEJ;AAAA,WAAA,EAEJ;AAAA,SAAA,EAEJ;AAAA,OAAA,EACF;AAAA;AAAA,GACF;AAEJ;;;;"}

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

@@ -7,8 +7,8 @@ const lucideReact = require('lucide-react');
 const ee_signals_signalColors = require('./signal-colors.cjs.js');
 const ee_signals_signalFormatting = require('./signal-formatting.cjs.js');
 const ee_signals_useTraceIntelligence = require('./use-trace-intelligence.cjs.js');
-const Button = require('../../Button-CIwF6NHM.cjs');
-const sankeyColor = require('../../sankeyColor-DHE7ggh8.cjs');
+const Button = require('../../Button-BnmR2HRc.cjs');
+const Txt = require('../../Txt-DPmEpNbp.cjs');
 
 function selectionLabel(catalog, selection) {
   return `${ee_signals_signalFormatting.signalLabel(catalog, selection.signalName)} · ${selection.kind === "theme" ? selection.label : "Noise"}`;
@@ -40,16 +40,18 @@ function ThemeFilterBanner({
   onClear
 }) {
   const { signalCatalog } = ee_signals_useTraceIntelligence.useTraceIntelligence();
-  const colors = selections.map((selection) => sankeyColor.nodeColor(ee_signals_signalColors.getSignalHue(selection.signalName)));
+  const colors = selections.map((selection) => ee_signals_signalColors.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__ */ jsxRuntime.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];
@@ -69,7 +71,7 @@ function ThemeFilterBanner({
             selection.signalName
           );
         }),
-        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-caption text-muted-foreground", children: filterSummary({ selections, filteredTraceCount, totalTraceCount, isUnavailable }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(Txt.Txt, { as: "span", variant: "caption", tone: "muted", children: filterSummary({ selections, filteredTraceCount, totalTraceCount, isUnavailable }) }),
         !isUnavailable && filteredTraceCount !== void 0 && latestSelection ? /* @__PURE__ */ jsxRuntime.jsx(
           Button.Button,
           {

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

@@ -1 +1 @@
-{"version":3,"file":"theme-filter-banner.cjs.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":["signalLabel","useTraceIntelligence","nodeColor","getSignalHue","jsxs","jsx","X","Button","Eye"],"mappings":"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"}
+{"version":3,"file":"theme-filter-banner.cjs.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":["signalLabel","useTraceIntelligence","getSignalColor","jsxs","jsx","X","Txt","Button","Eye"],"mappings":"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"}