@mastra/playground-ui 56.0.0 → 57.0.0-alpha.1

package/dist/ee/signals/examples-pager.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"examples-pager.cjs.js","sources":["../../../src/ee/signals/examples-pager.tsx"],"sourcesContent":["import { ChevronRight, ChevronLeft } from 'lucide-react';\nimport { Button } from '@/ds/components/Button';\n\nexport const EXAMPLES_PAGE_SIZE = 5;\n\n/** Numbered pager for detail-panel example lists — page count derives from the theme's trace count. */\nexport function ExamplesPager({\n  traceCount,\n  offset,\n  onOffsetChange,\n}: {\n  traceCount: number;\n  offset: number;\n  onOffsetChange: (offset: number) => void;\n}) {\n  const totalPages = Math.max(1, Math.ceil(traceCount / EXAMPLES_PAGE_SIZE));\n  const page = Math.floor(offset / EXAMPLES_PAGE_SIZE) + 1;\n  if (totalPages <= 1) return null;\n\n  return (\n    <nav aria-label=\"Example pages\" className=\"mt-3 flex items-center gap-3\">\n      <Button\n        icon={<ChevronLeft />}\n        variant=\"outline\"\n        size=\"sm\"\n        disabled={page <= 1}\n        onClick={() => onOffsetChange((page - 2) * EXAMPLES_PAGE_SIZE)}\n      >\n        Previous\n      </Button>\n      <span className=\"text-caption text-muted-foreground font-mono tabular-nums\">\n        Page {page} of {totalPages}\n      </span>\n      <Button\n        icon={<ChevronRight />}\n        variant=\"outline\"\n        size=\"sm\"\n        disabled={page >= totalPages}\n        onClick={() => onOffsetChange(page * EXAMPLES_PAGE_SIZE)}\n      >\n        Next\n      </Button>\n    </nav>\n  );\n}\n"],"names":["jsxs","jsx","Button","ChevronLeft","ChevronRight"],"mappings":";;;;;;;;AAGO,MAAM,kBAAA,GAAqB;AAG3B,SAAS,aAAA,CAAc;AAAA,EAC5B,UAAA;AAAA,EACA,MAAA;AAAA,EACA;AACF,CAAA,EAIG;AACD,EAAA,MAAM,UAAA,GAAa,KAAK,GAAA,CAAI,CAAA,EAAG,KAAK,IAAA,CAAK,UAAA,GAAa,kBAAkB,CAAC,CAAA;AACzE,EAAA,MAAM,IAAA,GAAO,IAAA,CAAK,KAAA,CAAM,MAAA,GAAS,kBAAkB,CAAA,GAAI,CAAA;AACvD,EAAA,IAAI,UAAA,IAAc,GAAG,OAAO,IAAA;AAE5B,EAAA,uBACEA,eAAA,CAAC,KAAA,EAAA,EAAI,YAAA,EAAW,eAAA,EAAgB,WAAU,8BAAA,EACxC,QAAA,EAAA;AAAA,oBAAAC,cAAA;AAAA,MAACC,aAAA;AAAA,MAAA;AAAA,QACC,IAAA,iCAAOC,uBAAA,EAAA,EAAY,CAAA;AAAA,QACnB,OAAA,EAAQ,SAAA;AAAA,QACR,IAAA,EAAK,IAAA;AAAA,QACL,UAAU,IAAA,IAAQ,CAAA;AAAA,QAClB,OAAA,EAAS,MAAM,cAAA,CAAA,CAAgB,IAAA,GAAO,KAAK,kBAAkB,CAAA;AAAA,QAC9D,QAAA,EAAA;AAAA;AAAA,KAED;AAAA,oBACAH,eAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,2DAAA,EAA4D,QAAA,EAAA;AAAA,MAAA,OAAA;AAAA,MACpE,IAAA;AAAA,MAAK,MAAA;AAAA,MAAK;AAAA,KAAA,EAClB,CAAA;AAAA,oBACAC,cAAA;AAAA,MAACC,aAAA;AAAA,MAAA;AAAA,QACC,IAAA,iCAAOE,wBAAA,EAAA,EAAa,CAAA;AAAA,QACpB,OAAA,EAAQ,SAAA;AAAA,QACR,IAAA,EAAK,IAAA;AAAA,QACL,UAAU,IAAA,IAAQ,UAAA;AAAA,QAClB,OAAA,EAAS,MAAM,cAAA,CAAe,IAAA,GAAO,kBAAkB,CAAA;AAAA,QACxD,QAAA,EAAA;AAAA;AAAA;AAED,GAAA,EACF,CAAA;AAEJ;;;;;"}
+{"version":3,"file":"examples-pager.cjs.js","sources":["../../../src/ee/signals/examples-pager.tsx"],"sourcesContent":["import { ChevronRight, ChevronLeft } from 'lucide-react';\nimport { Button } from '@/ds/components/Button';\n\nexport const EXAMPLES_PAGE_SIZE = 5;\n\n/** Numbered pager for detail-panel example lists — page count derives from the theme's trace count. */\nexport function ExamplesPager({\n  traceCount,\n  offset,\n  onOffsetChange,\n}: {\n  traceCount: number;\n  offset: number;\n  onOffsetChange: (offset: number) => void;\n}) {\n  const totalPages = Math.max(1, Math.ceil(traceCount / EXAMPLES_PAGE_SIZE));\n  const page = Math.floor(offset / EXAMPLES_PAGE_SIZE) + 1;\n  if (totalPages <= 1) return null;\n\n  return (\n    <nav aria-label=\"Example pages\" className=\"mt-3 flex items-center gap-3\">\n      <Button\n        icon={<ChevronLeft />}\n        variant=\"outline\"\n        size=\"sm\"\n        disabled={page <= 1}\n        onClick={() => onOffsetChange((page - 2) * EXAMPLES_PAGE_SIZE)}\n      >\n        Previous\n      </Button>\n      <span className=\"font-mono text-caption text-muted-foreground tabular-nums\">\n        Page {page} of {totalPages}\n      </span>\n      <Button\n        icon={<ChevronRight />}\n        variant=\"outline\"\n        size=\"sm\"\n        disabled={page >= totalPages}\n        onClick={() => onOffsetChange(page * EXAMPLES_PAGE_SIZE)}\n      >\n        Next\n      </Button>\n    </nav>\n  );\n}\n"],"names":["jsxs","jsx","Button","ChevronLeft","ChevronRight"],"mappings":";;;;;;;;AAGO,MAAM,kBAAA,GAAqB;AAG3B,SAAS,aAAA,CAAc;AAAA,EAC5B,UAAA;AAAA,EACA,MAAA;AAAA,EACA;AACF,CAAA,EAIG;AACD,EAAA,MAAM,UAAA,GAAa,KAAK,GAAA,CAAI,CAAA,EAAG,KAAK,IAAA,CAAK,UAAA,GAAa,kBAAkB,CAAC,CAAA;AACzE,EAAA,MAAM,IAAA,GAAO,IAAA,CAAK,KAAA,CAAM,MAAA,GAAS,kBAAkB,CAAA,GAAI,CAAA;AACvD,EAAA,IAAI,UAAA,IAAc,GAAG,OAAO,IAAA;AAE5B,EAAA,uBACEA,eAAA,CAAC,KAAA,EAAA,EAAI,YAAA,EAAW,eAAA,EAAgB,WAAU,8BAAA,EACxC,QAAA,EAAA;AAAA,oBAAAC,cAAA;AAAA,MAACC,aAAA;AAAA,MAAA;AAAA,QACC,IAAA,iCAAOC,uBAAA,EAAA,EAAY,CAAA;AAAA,QACnB,OAAA,EAAQ,SAAA;AAAA,QACR,IAAA,EAAK,IAAA;AAAA,QACL,UAAU,IAAA,IAAQ,CAAA;AAAA,QAClB,OAAA,EAAS,MAAM,cAAA,CAAA,CAAgB,IAAA,GAAO,KAAK,kBAAkB,CAAA;AAAA,QAC9D,QAAA,EAAA;AAAA;AAAA,KAED;AAAA,oBACAH,eAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,2DAAA,EAA4D,QAAA,EAAA;AAAA,MAAA,OAAA;AAAA,MACpE,IAAA;AAAA,MAAK,MAAA;AAAA,MAAK;AAAA,KAAA,EAClB,CAAA;AAAA,oBACAC,cAAA;AAAA,MAACC,aAAA;AAAA,MAAA;AAAA,QACC,IAAA,iCAAOE,wBAAA,EAAA,EAAa,CAAA;AAAA,QACpB,OAAA,EAAQ,SAAA;AAAA,QACR,IAAA,EAAK,IAAA;AAAA,QACL,UAAU,IAAA,IAAQ,UAAA;AAAA,QAClB,OAAA,EAAS,MAAM,cAAA,CAAe,IAAA,GAAO,kBAAkB,CAAA;AAAA,QACxD,QAAA,EAAA;AAAA;AAAA;AAED,GAAA,EACF,CAAA;AAEJ;;;;;"}

package/dist/ee/signals/examples-pager.es.js

@@ -1,6 +1,6 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { ChevronLeft, ChevronRight } from 'lucide-react';
-import { B as Button } from '../../Button-cWcBEd-G.js';
+import { B as Button } from '../../Button-C9cvaVFG.js';
 
 const EXAMPLES_PAGE_SIZE = 5;
 function ExamplesPager({
@@ -23,7 +23,7 @@ function ExamplesPager({
         children: "Previous"
       }
     ),
-    /* @__PURE__ */ jsxs("span", { className: "text-caption text-muted-foreground font-mono tabular-nums", children: [
+    /* @__PURE__ */ jsxs("span", { className: "font-mono text-caption text-muted-foreground tabular-nums", children: [
       "Page ",
       page,
       " of ",

package/dist/ee/signals/examples-pager.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"examples-pager.es.js","sources":["../../../src/ee/signals/examples-pager.tsx"],"sourcesContent":["import { ChevronRight, ChevronLeft } from 'lucide-react';\nimport { Button } from '@/ds/components/Button';\n\nexport const EXAMPLES_PAGE_SIZE = 5;\n\n/** Numbered pager for detail-panel example lists — page count derives from the theme's trace count. */\nexport function ExamplesPager({\n  traceCount,\n  offset,\n  onOffsetChange,\n}: {\n  traceCount: number;\n  offset: number;\n  onOffsetChange: (offset: number) => void;\n}) {\n  const totalPages = Math.max(1, Math.ceil(traceCount / EXAMPLES_PAGE_SIZE));\n  const page = Math.floor(offset / EXAMPLES_PAGE_SIZE) + 1;\n  if (totalPages <= 1) return null;\n\n  return (\n    <nav aria-label=\"Example pages\" className=\"mt-3 flex items-center gap-3\">\n      <Button\n        icon={<ChevronLeft />}\n        variant=\"outline\"\n        size=\"sm\"\n        disabled={page <= 1}\n        onClick={() => onOffsetChange((page - 2) * EXAMPLES_PAGE_SIZE)}\n      >\n        Previous\n      </Button>\n      <span className=\"text-caption text-muted-foreground font-mono tabular-nums\">\n        Page {page} of {totalPages}\n      </span>\n      <Button\n        icon={<ChevronRight />}\n        variant=\"outline\"\n        size=\"sm\"\n        disabled={page >= totalPages}\n        onClick={() => onOffsetChange(page * EXAMPLES_PAGE_SIZE)}\n      >\n        Next\n      </Button>\n    </nav>\n  );\n}\n"],"names":[],"mappings":";;;;AAGO,MAAM,kBAAA,GAAqB;AAG3B,SAAS,aAAA,CAAc;AAAA,EAC5B,UAAA;AAAA,EACA,MAAA;AAAA,EACA;AACF,CAAA,EAIG;AACD,EAAA,MAAM,UAAA,GAAa,KAAK,GAAA,CAAI,CAAA,EAAG,KAAK,IAAA,CAAK,UAAA,GAAa,kBAAkB,CAAC,CAAA;AACzE,EAAA,MAAM,IAAA,GAAO,IAAA,CAAK,KAAA,CAAM,MAAA,GAAS,kBAAkB,CAAA,GAAI,CAAA;AACvD,EAAA,IAAI,UAAA,IAAc,GAAG,OAAO,IAAA;AAE5B,EAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAI,YAAA,EAAW,eAAA,EAAgB,WAAU,8BAAA,EACxC,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,IAAA,sBAAO,WAAA,EAAA,EAAY,CAAA;AAAA,QACnB,OAAA,EAAQ,SAAA;AAAA,QACR,IAAA,EAAK,IAAA;AAAA,QACL,UAAU,IAAA,IAAQ,CAAA;AAAA,QAClB,OAAA,EAAS,MAAM,cAAA,CAAA,CAAgB,IAAA,GAAO,KAAK,kBAAkB,CAAA;AAAA,QAC9D,QAAA,EAAA;AAAA;AAAA,KAED;AAAA,oBACA,IAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,2DAAA,EAA4D,QAAA,EAAA;AAAA,MAAA,OAAA;AAAA,MACpE,IAAA;AAAA,MAAK,MAAA;AAAA,MAAK;AAAA,KAAA,EAClB,CAAA;AAAA,oBACA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,IAAA,sBAAO,YAAA,EAAA,EAAa,CAAA;AAAA,QACpB,OAAA,EAAQ,SAAA;AAAA,QACR,IAAA,EAAK,IAAA;AAAA,QACL,UAAU,IAAA,IAAQ,UAAA;AAAA,QAClB,OAAA,EAAS,MAAM,cAAA,CAAe,IAAA,GAAO,kBAAkB,CAAA;AAAA,QACxD,QAAA,EAAA;AAAA;AAAA;AAED,GAAA,EACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"examples-pager.es.js","sources":["../../../src/ee/signals/examples-pager.tsx"],"sourcesContent":["import { ChevronRight, ChevronLeft } from 'lucide-react';\nimport { Button } from '@/ds/components/Button';\n\nexport const EXAMPLES_PAGE_SIZE = 5;\n\n/** Numbered pager for detail-panel example lists — page count derives from the theme's trace count. */\nexport function ExamplesPager({\n  traceCount,\n  offset,\n  onOffsetChange,\n}: {\n  traceCount: number;\n  offset: number;\n  onOffsetChange: (offset: number) => void;\n}) {\n  const totalPages = Math.max(1, Math.ceil(traceCount / EXAMPLES_PAGE_SIZE));\n  const page = Math.floor(offset / EXAMPLES_PAGE_SIZE) + 1;\n  if (totalPages <= 1) return null;\n\n  return (\n    <nav aria-label=\"Example pages\" className=\"mt-3 flex items-center gap-3\">\n      <Button\n        icon={<ChevronLeft />}\n        variant=\"outline\"\n        size=\"sm\"\n        disabled={page <= 1}\n        onClick={() => onOffsetChange((page - 2) * EXAMPLES_PAGE_SIZE)}\n      >\n        Previous\n      </Button>\n      <span className=\"font-mono text-caption text-muted-foreground tabular-nums\">\n        Page {page} of {totalPages}\n      </span>\n      <Button\n        icon={<ChevronRight />}\n        variant=\"outline\"\n        size=\"sm\"\n        disabled={page >= totalPages}\n        onClick={() => onOffsetChange(page * EXAMPLES_PAGE_SIZE)}\n      >\n        Next\n      </Button>\n    </nav>\n  );\n}\n"],"names":[],"mappings":";;;;AAGO,MAAM,kBAAA,GAAqB;AAG3B,SAAS,aAAA,CAAc;AAAA,EAC5B,UAAA;AAAA,EACA,MAAA;AAAA,EACA;AACF,CAAA,EAIG;AACD,EAAA,MAAM,UAAA,GAAa,KAAK,GAAA,CAAI,CAAA,EAAG,KAAK,IAAA,CAAK,UAAA,GAAa,kBAAkB,CAAC,CAAA;AACzE,EAAA,MAAM,IAAA,GAAO,IAAA,CAAK,KAAA,CAAM,MAAA,GAAS,kBAAkB,CAAA,GAAI,CAAA;AACvD,EAAA,IAAI,UAAA,IAAc,GAAG,OAAO,IAAA;AAE5B,EAAA,uBACE,IAAA,CAAC,KAAA,EAAA,EAAI,YAAA,EAAW,eAAA,EAAgB,WAAU,8BAAA,EACxC,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,IAAA,sBAAO,WAAA,EAAA,EAAY,CAAA;AAAA,QACnB,OAAA,EAAQ,SAAA;AAAA,QACR,IAAA,EAAK,IAAA;AAAA,QACL,UAAU,IAAA,IAAQ,CAAA;AAAA,QAClB,OAAA,EAAS,MAAM,cAAA,CAAA,CAAgB,IAAA,GAAO,KAAK,kBAAkB,CAAA;AAAA,QAC9D,QAAA,EAAA;AAAA;AAAA,KAED;AAAA,oBACA,IAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,2DAAA,EAA4D,QAAA,EAAA;AAAA,MAAA,OAAA;AAAA,MACpE,IAAA;AAAA,MAAK,MAAA;AAAA,MAAK;AAAA,KAAA,EAClB,CAAA;AAAA,oBACA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,IAAA,sBAAO,YAAA,EAAA,EAAa,CAAA;AAAA,QACpB,OAAA,EAAQ,SAAA;AAAA,QACR,IAAA,EAAK,IAAA;AAAA,QACL,UAAU,IAAA,IAAQ,UAAA;AAAA,QAClB,OAAA,EAAS,MAAM,cAAA,CAAe,IAAA,GAAO,kBAAkB,CAAA;AAAA,QACxD,QAAA,EAAA;AAAA;AAAA;AAED,GAAA,EACF,CAAA;AAEJ;;;;"}

package/dist/ee/signals/flow-card.cjs.js

@@ -6,8 +6,8 @@ const jsxRuntime = require('react/jsx-runtime');
 const ee_signals_sankeySignalsData = require('./sankey-signals-data.cjs.js');
 const ee_signals_signalColors = require('./signal-colors.cjs.js');
 const ee_signals_sortableSignalHeaders = require('./sortable-signal-headers.cjs.js');
-const Card = require('../../Card-D0kFp9j9.cjs');
-const sankeyChart = require('../../sankey-chart-Bcm9jMhe.cjs');
+const Card = require('../../Card-DwGasv0K.cjs');
+const sankeyChart = require('../../sankey-chart-C1e0nRc3.cjs');
 
 function FlowCard({
   columns,
@@ -44,7 +44,7 @@ function FlowCard({
           "span",
           {
             "aria-hidden": "true",
-            className: "bg-background text-muted-foreground text-meta absolute top-0 left-5 -translate-y-1/2 px-2 font-mono tracking-[0.18em]",
+            className: "absolute top-0 left-5 -translate-y-1/2 bg-background px-2 font-mono text-meta tracking-[0.18em] text-muted-foreground",
             children: "SIGNALS"
           }
         ),
@@ -61,12 +61,12 @@ function FlowCard({
             "div",
             {
               "aria-label": "Themes",
-              className: "text-muted-foreground text-meta flex items-center gap-2 py-1 font-mono tracking-[0.18em]",
+              className: "flex items-center gap-2 py-1 font-mono text-meta tracking-[0.18em] text-muted-foreground",
               role: "separator",
               children: [
-                /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", className: "bg-border h-px w-5" }),
+                /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", className: "h-px w-5 bg-border" }),
                 "THEMES",
-                /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", className: "bg-border h-px flex-1" })
+                /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true", className: "h-px flex-1 bg-border" })
               ]
             }
           ),

package/dist/ee/signals/flow-card.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"flow-card.cjs.js","sources":["../../../src/ee/signals/flow-card.tsx"],"sourcesContent":["import { getSignalRecordNodeId, getSignalRecordNodeLabel, getSignalRecordNodeValue } from './sankey-signals-data';\nimport { getSignalHue } from './signal-colors';\nimport { SortableSignalHeaders } from './sortable-signal-headers';\nimport type { ThemeFlowResponse, TraceSignalName } from './types';\nimport { Card, CardContent } from '@/ds/components/Card';\nimport { Sankey, SankeyChart } from '@/ds/components/SankeyChart';\nimport type { SankeyChartColumn, SankeyChartNodeSelection, SankeyChartRecord } from '@/ds/components/SankeyChart';\n\nexport function FlowCard({\n  columns,\n  records,\n  stages,\n  height,\n  onNodeClick,\n  isNodeClickable,\n  drillInDisabledReason,\n  onOrderChange,\n  signalOrder,\n  reorderDisabled,\n}: {\n  columns: SankeyChartColumn[];\n  records: SankeyChartRecord[];\n  stages: ThemeFlowResponse['stages'];\n  height?: number;\n  onNodeClick?: (selection: SankeyChartNodeSelection) => void;\n  isNodeClickable?: (selection: SankeyChartNodeSelection) => boolean;\n  drillInDisabledReason?: string;\n  onOrderChange: (signalNames: TraceSignalName[]) => void;\n  signalOrder: TraceSignalName[];\n  reorderDisabled: boolean;\n}) {\n  const linkedColumnIds = new Set(columns.map(column => column.id));\n  const stageSignalNames = stages.map(stage => stage.signalName).filter(signalName => linkedColumnIds.has(signalName));\n  const optimisticSignalNames = signalOrder.filter(signalName => linkedColumnIds.has(signalName));\n  const optimisticSignalSet = new Set(optimisticSignalNames);\n  const headerSignalNames = reorderDisabled\n    ? [...optimisticSignalNames, ...stageSignalNames.filter(signalName => !optimisticSignalSet.has(signalName))]\n    : stageSignalNames;\n  const chartColumns = columns.map(column => ({ ...column, label: column.label.toUpperCase() }));\n  const handleHeaderOrderChange = (reordered: TraceSignalName[]) => {\n    const seen = new Set<TraceSignalName>(reordered);\n    onOrderChange([...reordered, ...signalOrder.filter(name => !seen.has(name))]);\n  };\n\n  return (\n    <Card\n      aria-label=\"Trace signal theme flow\"\n      as=\"section\"\n      className=\"relative min-w-0\"\n      elevation=\"raised\"\n      title={drillInDisabledReason}\n    >\n      <span\n        aria-hidden=\"true\"\n        className=\"bg-background text-muted-foreground text-meta absolute top-0 left-5 -translate-y-1/2 px-2 font-mono tracking-[0.18em]\"\n      >\n        SIGNALS\n      </span>\n      <CardContent className=\"px-0 pt-4 pb-2 sm:pt-5 sm:pb-3\">\n        <SortableSignalHeaders\n          signalNames={headerSignalNames}\n          reorderDisabled={reorderDisabled}\n          onOrderChange={handleHeaderOrderChange}\n        />\n        <div\n          aria-label=\"Themes\"\n          className=\"text-muted-foreground text-meta flex items-center gap-2 py-1 font-mono tracking-[0.18em]\"\n          role=\"separator\"\n        >\n          <span aria-hidden=\"true\" className=\"bg-border h-px w-5\" />\n          THEMES\n          <span aria-hidden=\"true\" className=\"bg-border h-px flex-1\" />\n        </div>\n        <div aria-busy={reorderDisabled} data-testid=\"sankey-order-transition\">\n          <Sankey\n            data={records}\n            columns={chartColumns}\n            columnOrder={chartColumns.map(column => column.id)}\n            getColumnHue={column => getSignalHue(column.id)}\n            getRecordNodeId={getSignalRecordNodeId}\n            getRecordNodeLabel={getSignalRecordNodeLabel}\n            getRecordNodeValue={getSignalRecordNodeValue}\n            getRecordWeight={record => Number(record.traceCount)}\n            getRecordLayoutWeight={record => Number(record.layoutTraceCount)}\n          >\n            <SankeyChart\n              height={height ?? 'clamp(340px, 42vw, 460px)'}\n              margin={{ top: 40, right: 32, bottom: 24, left: 32 }}\n              onNodeClick={onNodeClick}\n              isNodeClickable={isNodeClickable}\n              hideColumnLabels\n              geometryTransitionKey={chartColumns.map(column => column.id).join(':')}\n            />\n          </Sankey>\n        </div>\n      </CardContent>\n    </Card>\n  );\n}\n"],"names":["jsxs","Card","jsx","CardContent","SortableSignalHeaders","Sankey","getSignalHue","getSignalRecordNodeId","getSignalRecordNodeLabel","getSignalRecordNodeValue","SankeyChart"],"mappings":"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"}
+{"version":3,"file":"flow-card.cjs.js","sources":["../../../src/ee/signals/flow-card.tsx"],"sourcesContent":["import { getSignalRecordNodeId, getSignalRecordNodeLabel, getSignalRecordNodeValue } from './sankey-signals-data';\nimport { getSignalHue } from './signal-colors';\nimport { SortableSignalHeaders } from './sortable-signal-headers';\nimport type { ThemeFlowResponse, TraceSignalName } from './types';\nimport { Card, CardContent } from '@/ds/components/Card';\nimport { Sankey, SankeyChart } from '@/ds/components/SankeyChart';\nimport type { SankeyChartColumn, SankeyChartNodeSelection, SankeyChartRecord } from '@/ds/components/SankeyChart';\n\nexport function FlowCard({\n  columns,\n  records,\n  stages,\n  height,\n  onNodeClick,\n  isNodeClickable,\n  drillInDisabledReason,\n  onOrderChange,\n  signalOrder,\n  reorderDisabled,\n}: {\n  columns: SankeyChartColumn[];\n  records: SankeyChartRecord[];\n  stages: ThemeFlowResponse['stages'];\n  height?: number;\n  onNodeClick?: (selection: SankeyChartNodeSelection) => void;\n  isNodeClickable?: (selection: SankeyChartNodeSelection) => boolean;\n  drillInDisabledReason?: string;\n  onOrderChange: (signalNames: TraceSignalName[]) => void;\n  signalOrder: TraceSignalName[];\n  reorderDisabled: boolean;\n}) {\n  const linkedColumnIds = new Set(columns.map(column => column.id));\n  const stageSignalNames = stages.map(stage => stage.signalName).filter(signalName => linkedColumnIds.has(signalName));\n  const optimisticSignalNames = signalOrder.filter(signalName => linkedColumnIds.has(signalName));\n  const optimisticSignalSet = new Set(optimisticSignalNames);\n  const headerSignalNames = reorderDisabled\n    ? [...optimisticSignalNames, ...stageSignalNames.filter(signalName => !optimisticSignalSet.has(signalName))]\n    : stageSignalNames;\n  const chartColumns = columns.map(column => ({ ...column, label: column.label.toUpperCase() }));\n  const handleHeaderOrderChange = (reordered: TraceSignalName[]) => {\n    const seen = new Set<TraceSignalName>(reordered);\n    onOrderChange([...reordered, ...signalOrder.filter(name => !seen.has(name))]);\n  };\n\n  return (\n    <Card\n      aria-label=\"Trace signal theme flow\"\n      as=\"section\"\n      className=\"relative min-w-0\"\n      elevation=\"raised\"\n      title={drillInDisabledReason}\n    >\n      <span\n        aria-hidden=\"true\"\n        className=\"absolute top-0 left-5 -translate-y-1/2 bg-background px-2 font-mono text-meta tracking-[0.18em] text-muted-foreground\"\n      >\n        SIGNALS\n      </span>\n      <CardContent className=\"px-0 pt-4 pb-2 sm:pt-5 sm:pb-3\">\n        <SortableSignalHeaders\n          signalNames={headerSignalNames}\n          reorderDisabled={reorderDisabled}\n          onOrderChange={handleHeaderOrderChange}\n        />\n        <div\n          aria-label=\"Themes\"\n          className=\"flex items-center gap-2 py-1 font-mono text-meta tracking-[0.18em] text-muted-foreground\"\n          role=\"separator\"\n        >\n          <span aria-hidden=\"true\" className=\"h-px w-5 bg-border\" />\n          THEMES\n          <span aria-hidden=\"true\" className=\"h-px flex-1 bg-border\" />\n        </div>\n        <div aria-busy={reorderDisabled} data-testid=\"sankey-order-transition\">\n          <Sankey\n            data={records}\n            columns={chartColumns}\n            columnOrder={chartColumns.map(column => column.id)}\n            getColumnHue={column => getSignalHue(column.id)}\n            getRecordNodeId={getSignalRecordNodeId}\n            getRecordNodeLabel={getSignalRecordNodeLabel}\n            getRecordNodeValue={getSignalRecordNodeValue}\n            getRecordWeight={record => Number(record.traceCount)}\n            getRecordLayoutWeight={record => Number(record.layoutTraceCount)}\n          >\n            <SankeyChart\n              height={height ?? 'clamp(340px, 42vw, 460px)'}\n              margin={{ top: 40, right: 32, bottom: 24, left: 32 }}\n              onNodeClick={onNodeClick}\n              isNodeClickable={isNodeClickable}\n              hideColumnLabels\n              geometryTransitionKey={chartColumns.map(column => column.id).join(':')}\n            />\n          </Sankey>\n        </div>\n      </CardContent>\n    </Card>\n  );\n}\n"],"names":["jsxs","Card","jsx","CardContent","SortableSignalHeaders","Sankey","getSignalHue","getSignalRecordNodeId","getSignalRecordNodeLabel","getSignalRecordNodeValue","SankeyChart"],"mappings":"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"}

package/dist/ee/signals/flow-card.es.js

@@ -2,8 +2,8 @@ import { jsxs, jsx } from 'react/jsx-runtime';
 import { getSignalRecordNodeValue, getSignalRecordNodeLabel, getSignalRecordNodeId } from './sankey-signals-data.es.js';
 import { getSignalHue } from './signal-colors.es.js';
 import { SortableSignalHeaders } from './sortable-signal-headers.es.js';
-import { C as Card, a as CardContent } from '../../Card-DEvGFj-Z.js';
-import { S as Sankey, a as SankeyChart } from '../../sankey-chart-CqngN2lw.js';
+import { C as Card, a as CardContent } from '../../Card-B_buJ5yF.js';
+import { S as Sankey, a as SankeyChart } from '../../sankey-chart-jvMXKzud.js';
 
 function FlowCard({
   columns,
@@ -40,7 +40,7 @@ function FlowCard({
           "span",
           {
             "aria-hidden": "true",
-            className: "bg-background text-muted-foreground text-meta absolute top-0 left-5 -translate-y-1/2 px-2 font-mono tracking-[0.18em]",
+            className: "absolute top-0 left-5 -translate-y-1/2 bg-background px-2 font-mono text-meta tracking-[0.18em] text-muted-foreground",
             children: "SIGNALS"
           }
         ),
@@ -57,12 +57,12 @@ function FlowCard({
             "div",
             {
               "aria-label": "Themes",
-              className: "text-muted-foreground text-meta flex items-center gap-2 py-1 font-mono tracking-[0.18em]",
+              className: "flex items-center gap-2 py-1 font-mono text-meta tracking-[0.18em] text-muted-foreground",
               role: "separator",
               children: [
-                /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "bg-border h-px w-5" }),
+                /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "h-px w-5 bg-border" }),
                 "THEMES",
-                /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "bg-border h-px flex-1" })
+                /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "h-px flex-1 bg-border" })
               ]
             }
           ),

package/dist/ee/signals/flow-card.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"flow-card.es.js","sources":["../../../src/ee/signals/flow-card.tsx"],"sourcesContent":["import { getSignalRecordNodeId, getSignalRecordNodeLabel, getSignalRecordNodeValue } from './sankey-signals-data';\nimport { getSignalHue } from './signal-colors';\nimport { SortableSignalHeaders } from './sortable-signal-headers';\nimport type { ThemeFlowResponse, TraceSignalName } from './types';\nimport { Card, CardContent } from '@/ds/components/Card';\nimport { Sankey, SankeyChart } from '@/ds/components/SankeyChart';\nimport type { SankeyChartColumn, SankeyChartNodeSelection, SankeyChartRecord } from '@/ds/components/SankeyChart';\n\nexport function FlowCard({\n  columns,\n  records,\n  stages,\n  height,\n  onNodeClick,\n  isNodeClickable,\n  drillInDisabledReason,\n  onOrderChange,\n  signalOrder,\n  reorderDisabled,\n}: {\n  columns: SankeyChartColumn[];\n  records: SankeyChartRecord[];\n  stages: ThemeFlowResponse['stages'];\n  height?: number;\n  onNodeClick?: (selection: SankeyChartNodeSelection) => void;\n  isNodeClickable?: (selection: SankeyChartNodeSelection) => boolean;\n  drillInDisabledReason?: string;\n  onOrderChange: (signalNames: TraceSignalName[]) => void;\n  signalOrder: TraceSignalName[];\n  reorderDisabled: boolean;\n}) {\n  const linkedColumnIds = new Set(columns.map(column => column.id));\n  const stageSignalNames = stages.map(stage => stage.signalName).filter(signalName => linkedColumnIds.has(signalName));\n  const optimisticSignalNames = signalOrder.filter(signalName => linkedColumnIds.has(signalName));\n  const optimisticSignalSet = new Set(optimisticSignalNames);\n  const headerSignalNames = reorderDisabled\n    ? [...optimisticSignalNames, ...stageSignalNames.filter(signalName => !optimisticSignalSet.has(signalName))]\n    : stageSignalNames;\n  const chartColumns = columns.map(column => ({ ...column, label: column.label.toUpperCase() }));\n  const handleHeaderOrderChange = (reordered: TraceSignalName[]) => {\n    const seen = new Set<TraceSignalName>(reordered);\n    onOrderChange([...reordered, ...signalOrder.filter(name => !seen.has(name))]);\n  };\n\n  return (\n    <Card\n      aria-label=\"Trace signal theme flow\"\n      as=\"section\"\n      className=\"relative min-w-0\"\n      elevation=\"raised\"\n      title={drillInDisabledReason}\n    >\n      <span\n        aria-hidden=\"true\"\n        className=\"bg-background text-muted-foreground text-meta absolute top-0 left-5 -translate-y-1/2 px-2 font-mono tracking-[0.18em]\"\n      >\n        SIGNALS\n      </span>\n      <CardContent className=\"px-0 pt-4 pb-2 sm:pt-5 sm:pb-3\">\n        <SortableSignalHeaders\n          signalNames={headerSignalNames}\n          reorderDisabled={reorderDisabled}\n          onOrderChange={handleHeaderOrderChange}\n        />\n        <div\n          aria-label=\"Themes\"\n          className=\"text-muted-foreground text-meta flex items-center gap-2 py-1 font-mono tracking-[0.18em]\"\n          role=\"separator\"\n        >\n          <span aria-hidden=\"true\" className=\"bg-border h-px w-5\" />\n          THEMES\n          <span aria-hidden=\"true\" className=\"bg-border h-px flex-1\" />\n        </div>\n        <div aria-busy={reorderDisabled} data-testid=\"sankey-order-transition\">\n          <Sankey\n            data={records}\n            columns={chartColumns}\n            columnOrder={chartColumns.map(column => column.id)}\n            getColumnHue={column => getSignalHue(column.id)}\n            getRecordNodeId={getSignalRecordNodeId}\n            getRecordNodeLabel={getSignalRecordNodeLabel}\n            getRecordNodeValue={getSignalRecordNodeValue}\n            getRecordWeight={record => Number(record.traceCount)}\n            getRecordLayoutWeight={record => Number(record.layoutTraceCount)}\n          >\n            <SankeyChart\n              height={height ?? 'clamp(340px, 42vw, 460px)'}\n              margin={{ top: 40, right: 32, bottom: 24, left: 32 }}\n              onNodeClick={onNodeClick}\n              isNodeClickable={isNodeClickable}\n              hideColumnLabels\n              geometryTransitionKey={chartColumns.map(column => column.id).join(':')}\n            />\n          </Sankey>\n        </div>\n      </CardContent>\n    </Card>\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"flow-card.es.js","sources":["../../../src/ee/signals/flow-card.tsx"],"sourcesContent":["import { getSignalRecordNodeId, getSignalRecordNodeLabel, getSignalRecordNodeValue } from './sankey-signals-data';\nimport { getSignalHue } from './signal-colors';\nimport { SortableSignalHeaders } from './sortable-signal-headers';\nimport type { ThemeFlowResponse, TraceSignalName } from './types';\nimport { Card, CardContent } from '@/ds/components/Card';\nimport { Sankey, SankeyChart } from '@/ds/components/SankeyChart';\nimport type { SankeyChartColumn, SankeyChartNodeSelection, SankeyChartRecord } from '@/ds/components/SankeyChart';\n\nexport function FlowCard({\n  columns,\n  records,\n  stages,\n  height,\n  onNodeClick,\n  isNodeClickable,\n  drillInDisabledReason,\n  onOrderChange,\n  signalOrder,\n  reorderDisabled,\n}: {\n  columns: SankeyChartColumn[];\n  records: SankeyChartRecord[];\n  stages: ThemeFlowResponse['stages'];\n  height?: number;\n  onNodeClick?: (selection: SankeyChartNodeSelection) => void;\n  isNodeClickable?: (selection: SankeyChartNodeSelection) => boolean;\n  drillInDisabledReason?: string;\n  onOrderChange: (signalNames: TraceSignalName[]) => void;\n  signalOrder: TraceSignalName[];\n  reorderDisabled: boolean;\n}) {\n  const linkedColumnIds = new Set(columns.map(column => column.id));\n  const stageSignalNames = stages.map(stage => stage.signalName).filter(signalName => linkedColumnIds.has(signalName));\n  const optimisticSignalNames = signalOrder.filter(signalName => linkedColumnIds.has(signalName));\n  const optimisticSignalSet = new Set(optimisticSignalNames);\n  const headerSignalNames = reorderDisabled\n    ? [...optimisticSignalNames, ...stageSignalNames.filter(signalName => !optimisticSignalSet.has(signalName))]\n    : stageSignalNames;\n  const chartColumns = columns.map(column => ({ ...column, label: column.label.toUpperCase() }));\n  const handleHeaderOrderChange = (reordered: TraceSignalName[]) => {\n    const seen = new Set<TraceSignalName>(reordered);\n    onOrderChange([...reordered, ...signalOrder.filter(name => !seen.has(name))]);\n  };\n\n  return (\n    <Card\n      aria-label=\"Trace signal theme flow\"\n      as=\"section\"\n      className=\"relative min-w-0\"\n      elevation=\"raised\"\n      title={drillInDisabledReason}\n    >\n      <span\n        aria-hidden=\"true\"\n        className=\"absolute top-0 left-5 -translate-y-1/2 bg-background px-2 font-mono text-meta tracking-[0.18em] text-muted-foreground\"\n      >\n        SIGNALS\n      </span>\n      <CardContent className=\"px-0 pt-4 pb-2 sm:pt-5 sm:pb-3\">\n        <SortableSignalHeaders\n          signalNames={headerSignalNames}\n          reorderDisabled={reorderDisabled}\n          onOrderChange={handleHeaderOrderChange}\n        />\n        <div\n          aria-label=\"Themes\"\n          className=\"flex items-center gap-2 py-1 font-mono text-meta tracking-[0.18em] text-muted-foreground\"\n          role=\"separator\"\n        >\n          <span aria-hidden=\"true\" className=\"h-px w-5 bg-border\" />\n          THEMES\n          <span aria-hidden=\"true\" className=\"h-px flex-1 bg-border\" />\n        </div>\n        <div aria-busy={reorderDisabled} data-testid=\"sankey-order-transition\">\n          <Sankey\n            data={records}\n            columns={chartColumns}\n            columnOrder={chartColumns.map(column => column.id)}\n            getColumnHue={column => getSignalHue(column.id)}\n            getRecordNodeId={getSignalRecordNodeId}\n            getRecordNodeLabel={getSignalRecordNodeLabel}\n            getRecordNodeValue={getSignalRecordNodeValue}\n            getRecordWeight={record => Number(record.traceCount)}\n            getRecordLayoutWeight={record => Number(record.layoutTraceCount)}\n          >\n            <SankeyChart\n              height={height ?? 'clamp(340px, 42vw, 460px)'}\n              margin={{ top: 40, right: 32, bottom: 24, left: 32 }}\n              onNodeClick={onNodeClick}\n              isNodeClickable={isNodeClickable}\n              hideColumnLabels\n              geometryTransitionKey={chartColumns.map(column => column.id).join(':')}\n            />\n          </Sankey>\n        </div>\n      </CardContent>\n    </Card>\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/ee/signals/lifeline-row.cjs.js

@@ -50,7 +50,7 @@ function LifelineRow({
     "li",
     {
       "aria-label": `${row.label}: present in ${row.points.length} of ${snapshots.length} landmarks`,
-      className: `group hover:bg-fill-subtle flex items-center gap-3 rounded-md ${isPersistent ? "" : "opacity-55 hover:opacity-100"}`,
+      className: `group flex items-center gap-3 rounded-md hover:bg-fill-subtle ${isPersistent ? "" : "opacity-55 hover:opacity-100"}`,
       children: [
         /* @__PURE__ */ jsxRuntime.jsx(
           "span",
@@ -58,13 +58,13 @@ function LifelineRow({
             className: utils_cn.cn(
               primitives_typography.quietTextHoverInGroup,
               primitives_transitions.controlStateColorTransition,
-              "text-caption w-52 shrink-0 truncate text-right"
+              "w-52 shrink-0 truncate text-right text-caption"
             ),
             title: row.label,
             children: row.label
           }
         ),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-border relative mx-2 h-7 min-w-0 flex-1 border-b", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative mx-2 h-7 min-w-0 flex-1 border-b border-border", children: [
           connectors.length > 0 || segments.length > 0 ? /* @__PURE__ */ jsxRuntime.jsxs(
             "svg",
             {
@@ -111,7 +111,7 @@ function LifelineRow({
             );
           })
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-muted-foreground text-caption w-9 shrink-0 font-mono tabular-nums", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "w-9 shrink-0 font-mono text-caption text-muted-foreground tabular-nums", children: [
           row.points.length,
           "/",
           snapshots.length

package/dist/ee/signals/lifeline-row.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"lifeline-row.cjs.js","sources":["../../../src/ee/signals/lifeline-row.tsx"],"sourcesContent":["import { LifelinePoint } from './lifeline-point';\nimport { formatSnapshotCutoff } from './signal-formatting';\nimport type { ThemeSelection } from './theme-drilldown-data';\nimport { lifelineConnectors, lifelineSegments } from './theme-lifelines-data';\nimport type { ThemeLifeline, ThemeLifelinePoint } from './theme-lifelines-data';\nimport type { ThemeSnapshot, TraceSignalName } from './types';\nimport { nodeColor } from '@/ds/components/SankeyChart';\nimport { controlStateColorTransition } from '@/ds/primitives/transitions';\nimport { quietTextHoverInGroup } from '@/ds/primitives/typography';\nimport { cn } from '@/lib/utils';\n\nconst TRACK_HEIGHT = 28;\nconst MAX_BAR_HEIGHT = 22;\nconst MIN_BAR_HEIGHT = 4;\n\nfunction barHeight(share: number) {\n  return Math.max(MIN_BAR_HEIGHT, Math.round(share * MAX_BAR_HEIGHT));\n}\n\nfunction pointTitle(snapshot: ThemeSnapshot | undefined, label: string, traceCount: number, share: number) {\n  const cutoff = snapshot?.cutoffAt ? formatSnapshotCutoff(snapshot.cutoffAt) : undefined;\n  return `${label}${cutoff ? ` · ${cutoff}` : ''} · ${traceCount} traces (${Math.round(share * 100)}%)`;\n}\n\nfunction lifelineArea(segment: ThemeLifelinePoint[], positions: number[]) {\n  const firstPoint = segment[0];\n  const lastPoint = segment.at(-1);\n  if (!firstPoint || !lastPoint) return undefined;\n\n  return {\n    key: firstPoint.snapshotIndex,\n    points: [\n      `${positions[firstPoint.snapshotIndex]},${TRACK_HEIGHT - 1}`,\n      ...segment.map(point => `${positions[point.snapshotIndex]},${TRACK_HEIGHT - 1 - barHeight(point.share)}`),\n      `${positions[lastPoint.snapshotIndex]},${TRACK_HEIGHT - 1}`,\n    ].join(' '),\n  };\n}\n\nexport function LifelineRow({\n  row,\n  signalName,\n  snapshots,\n  positions,\n  hue,\n  onThemeSelect,\n}: {\n  row: ThemeLifeline;\n  signalName: TraceSignalName;\n  snapshots: ThemeSnapshot[];\n  positions: number[];\n  hue: number;\n  onThemeSelect: (selection: ThemeSelection, snapshotIndex: number) => void;\n}) {\n  const isPersistent = row.points.length * 2 >= snapshots.length;\n  const connectors = lifelineConnectors(row.points);\n  const segments = lifelineSegments(row.points);\n  const pointY = (point: ThemeLifelinePoint) => TRACK_HEIGHT - 1 - barHeight(point.share);\n\n  return (\n    <li\n      aria-label={`${row.label}: present in ${row.points.length} of ${snapshots.length} landmarks`}\n      className={`group hover:bg-fill-subtle flex items-center gap-3 rounded-md ${isPersistent ? '' : 'opacity-55 hover:opacity-100'}`}\n    >\n      <span\n        className={cn(\n          quietTextHoverInGroup,\n          controlStateColorTransition,\n          'text-caption w-52 shrink-0 truncate text-right',\n        )}\n        title={row.label}\n      >\n        {row.label}\n      </span>\n      <div className=\"border-border relative mx-2 h-7 min-w-0 flex-1 border-b\">\n        {connectors.length > 0 || segments.length > 0 ? (\n          <svg\n            aria-hidden=\"true\"\n            className=\"pointer-events-none absolute inset-0 size-full\"\n            preserveAspectRatio=\"none\"\n            viewBox={`0 0 100 ${TRACK_HEIGHT}`}\n          >\n            {segments.map(segment => {\n              const area = lifelineArea(segment, positions);\n              if (!area) return undefined;\n              return <polygon key={`area-${area.key}`} fill={nodeColor(hue)} fillOpacity={0.14} points={area.points} />;\n            })}\n            {connectors.map(({ from, to }) => (\n              <line\n                key={`${from.snapshotIndex}-${to.snapshotIndex}`}\n                stroke={nodeColor(hue)}\n                strokeOpacity={0.45}\n                strokeWidth={1.2}\n                vectorEffect=\"non-scaling-stroke\"\n                x1={positions[from.snapshotIndex]}\n                y1={pointY(from)}\n                x2={positions[to.snapshotIndex]}\n                y2={pointY(to)}\n              />\n            ))}\n          </svg>\n        ) : null}\n        {row.points.map(point => {\n          const title = pointTitle(snapshots[point.snapshotIndex], row.label, point.traceCount, point.share);\n          const themeId = point.themeId;\n          return (\n            <LifelinePoint\n              key={point.snapshotIndex}\n              title={title}\n              positionPercent={positions[point.snapshotIndex]}\n              height={barHeight(point.share)}\n              color={nodeColor(hue)}\n              onSelect={\n                themeId === undefined\n                  ? undefined\n                  : () => onThemeSelect({ kind: 'theme', signalName, themeId, label: row.label }, point.snapshotIndex)\n              }\n            />\n          );\n        })}\n      </div>\n      <span className=\"text-muted-foreground text-caption w-9 shrink-0 font-mono tabular-nums\">\n        {row.points.length}/{snapshots.length}\n      </span>\n    </li>\n  );\n}\n"],"names":["formatSnapshotCutoff","lifelineConnectors","lifelineSegments","jsxs","jsx","cn","quietTextHoverInGroup","controlStateColorTransition","nodeColor","LifelinePoint"],"mappings":"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"}
+{"version":3,"file":"lifeline-row.cjs.js","sources":["../../../src/ee/signals/lifeline-row.tsx"],"sourcesContent":["import { LifelinePoint } from './lifeline-point';\nimport { formatSnapshotCutoff } from './signal-formatting';\nimport type { ThemeSelection } from './theme-drilldown-data';\nimport { lifelineConnectors, lifelineSegments } from './theme-lifelines-data';\nimport type { ThemeLifeline, ThemeLifelinePoint } from './theme-lifelines-data';\nimport type { ThemeSnapshot, TraceSignalName } from './types';\nimport { nodeColor } from '@/ds/components/SankeyChart';\nimport { controlStateColorTransition } from '@/ds/primitives/transitions';\nimport { quietTextHoverInGroup } from '@/ds/primitives/typography';\nimport { cn } from '@/lib/utils';\n\nconst TRACK_HEIGHT = 28;\nconst MAX_BAR_HEIGHT = 22;\nconst MIN_BAR_HEIGHT = 4;\n\nfunction barHeight(share: number) {\n  return Math.max(MIN_BAR_HEIGHT, Math.round(share * MAX_BAR_HEIGHT));\n}\n\nfunction pointTitle(snapshot: ThemeSnapshot | undefined, label: string, traceCount: number, share: number) {\n  const cutoff = snapshot?.cutoffAt ? formatSnapshotCutoff(snapshot.cutoffAt) : undefined;\n  return `${label}${cutoff ? ` · ${cutoff}` : ''} · ${traceCount} traces (${Math.round(share * 100)}%)`;\n}\n\nfunction lifelineArea(segment: ThemeLifelinePoint[], positions: number[]) {\n  const firstPoint = segment[0];\n  const lastPoint = segment.at(-1);\n  if (!firstPoint || !lastPoint) return undefined;\n\n  return {\n    key: firstPoint.snapshotIndex,\n    points: [\n      `${positions[firstPoint.snapshotIndex]},${TRACK_HEIGHT - 1}`,\n      ...segment.map(point => `${positions[point.snapshotIndex]},${TRACK_HEIGHT - 1 - barHeight(point.share)}`),\n      `${positions[lastPoint.snapshotIndex]},${TRACK_HEIGHT - 1}`,\n    ].join(' '),\n  };\n}\n\nexport function LifelineRow({\n  row,\n  signalName,\n  snapshots,\n  positions,\n  hue,\n  onThemeSelect,\n}: {\n  row: ThemeLifeline;\n  signalName: TraceSignalName;\n  snapshots: ThemeSnapshot[];\n  positions: number[];\n  hue: number;\n  onThemeSelect: (selection: ThemeSelection, snapshotIndex: number) => void;\n}) {\n  const isPersistent = row.points.length * 2 >= snapshots.length;\n  const connectors = lifelineConnectors(row.points);\n  const segments = lifelineSegments(row.points);\n  const pointY = (point: ThemeLifelinePoint) => TRACK_HEIGHT - 1 - barHeight(point.share);\n\n  return (\n    <li\n      aria-label={`${row.label}: present in ${row.points.length} of ${snapshots.length} landmarks`}\n      className={`group flex items-center gap-3 rounded-md hover:bg-fill-subtle ${isPersistent ? '' : 'opacity-55 hover:opacity-100'}`}\n    >\n      <span\n        className={cn(\n          quietTextHoverInGroup,\n          controlStateColorTransition,\n          'w-52 shrink-0 truncate text-right text-caption',\n        )}\n        title={row.label}\n      >\n        {row.label}\n      </span>\n      <div className=\"relative mx-2 h-7 min-w-0 flex-1 border-b border-border\">\n        {connectors.length > 0 || segments.length > 0 ? (\n          <svg\n            aria-hidden=\"true\"\n            className=\"pointer-events-none absolute inset-0 size-full\"\n            preserveAspectRatio=\"none\"\n            viewBox={`0 0 100 ${TRACK_HEIGHT}`}\n          >\n            {segments.map(segment => {\n              const area = lifelineArea(segment, positions);\n              if (!area) return undefined;\n              return <polygon key={`area-${area.key}`} fill={nodeColor(hue)} fillOpacity={0.14} points={area.points} />;\n            })}\n            {connectors.map(({ from, to }) => (\n              <line\n                key={`${from.snapshotIndex}-${to.snapshotIndex}`}\n                stroke={nodeColor(hue)}\n                strokeOpacity={0.45}\n                strokeWidth={1.2}\n                vectorEffect=\"non-scaling-stroke\"\n                x1={positions[from.snapshotIndex]}\n                y1={pointY(from)}\n                x2={positions[to.snapshotIndex]}\n                y2={pointY(to)}\n              />\n            ))}\n          </svg>\n        ) : null}\n        {row.points.map(point => {\n          const title = pointTitle(snapshots[point.snapshotIndex], row.label, point.traceCount, point.share);\n          const themeId = point.themeId;\n          return (\n            <LifelinePoint\n              key={point.snapshotIndex}\n              title={title}\n              positionPercent={positions[point.snapshotIndex]}\n              height={barHeight(point.share)}\n              color={nodeColor(hue)}\n              onSelect={\n                themeId === undefined\n                  ? undefined\n                  : () => onThemeSelect({ kind: 'theme', signalName, themeId, label: row.label }, point.snapshotIndex)\n              }\n            />\n          );\n        })}\n      </div>\n      <span className=\"w-9 shrink-0 font-mono text-caption text-muted-foreground tabular-nums\">\n        {row.points.length}/{snapshots.length}\n      </span>\n    </li>\n  );\n}\n"],"names":["formatSnapshotCutoff","lifelineConnectors","lifelineSegments","jsxs","jsx","cn","quietTextHoverInGroup","controlStateColorTransition","nodeColor","LifelinePoint"],"mappings":"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"}

package/dist/ee/signals/lifeline-row.es.js

@@ -46,7 +46,7 @@ function LifelineRow({
     "li",
     {
       "aria-label": `${row.label}: present in ${row.points.length} of ${snapshots.length} landmarks`,
-      className: `group hover:bg-fill-subtle flex items-center gap-3 rounded-md ${isPersistent ? "" : "opacity-55 hover:opacity-100"}`,
+      className: `group flex items-center gap-3 rounded-md hover:bg-fill-subtle ${isPersistent ? "" : "opacity-55 hover:opacity-100"}`,
       children: [
         /* @__PURE__ */ jsx(
           "span",
@@ -54,13 +54,13 @@ function LifelineRow({
             className: cn(
               quietTextHoverInGroup,
               controlStateColorTransition,
-              "text-caption w-52 shrink-0 truncate text-right"
+              "w-52 shrink-0 truncate text-right text-caption"
             ),
             title: row.label,
             children: row.label
           }
         ),
-        /* @__PURE__ */ jsxs("div", { className: "border-border relative mx-2 h-7 min-w-0 flex-1 border-b", children: [
+        /* @__PURE__ */ jsxs("div", { className: "relative mx-2 h-7 min-w-0 flex-1 border-b border-border", children: [
           connectors.length > 0 || segments.length > 0 ? /* @__PURE__ */ jsxs(
             "svg",
             {
@@ -107,7 +107,7 @@ function LifelineRow({
             );
           })
         ] }),
-        /* @__PURE__ */ jsxs("span", { className: "text-muted-foreground text-caption w-9 shrink-0 font-mono tabular-nums", children: [
+        /* @__PURE__ */ jsxs("span", { className: "w-9 shrink-0 font-mono text-caption text-muted-foreground tabular-nums", children: [
           row.points.length,
           "/",
           snapshots.length

package/dist/ee/signals/lifeline-row.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"lifeline-row.es.js","sources":["../../../src/ee/signals/lifeline-row.tsx"],"sourcesContent":["import { LifelinePoint } from './lifeline-point';\nimport { formatSnapshotCutoff } from './signal-formatting';\nimport type { ThemeSelection } from './theme-drilldown-data';\nimport { lifelineConnectors, lifelineSegments } from './theme-lifelines-data';\nimport type { ThemeLifeline, ThemeLifelinePoint } from './theme-lifelines-data';\nimport type { ThemeSnapshot, TraceSignalName } from './types';\nimport { nodeColor } from '@/ds/components/SankeyChart';\nimport { controlStateColorTransition } from '@/ds/primitives/transitions';\nimport { quietTextHoverInGroup } from '@/ds/primitives/typography';\nimport { cn } from '@/lib/utils';\n\nconst TRACK_HEIGHT = 28;\nconst MAX_BAR_HEIGHT = 22;\nconst MIN_BAR_HEIGHT = 4;\n\nfunction barHeight(share: number) {\n  return Math.max(MIN_BAR_HEIGHT, Math.round(share * MAX_BAR_HEIGHT));\n}\n\nfunction pointTitle(snapshot: ThemeSnapshot | undefined, label: string, traceCount: number, share: number) {\n  const cutoff = snapshot?.cutoffAt ? formatSnapshotCutoff(snapshot.cutoffAt) : undefined;\n  return `${label}${cutoff ? ` · ${cutoff}` : ''} · ${traceCount} traces (${Math.round(share * 100)}%)`;\n}\n\nfunction lifelineArea(segment: ThemeLifelinePoint[], positions: number[]) {\n  const firstPoint = segment[0];\n  const lastPoint = segment.at(-1);\n  if (!firstPoint || !lastPoint) return undefined;\n\n  return {\n    key: firstPoint.snapshotIndex,\n    points: [\n      `${positions[firstPoint.snapshotIndex]},${TRACK_HEIGHT - 1}`,\n      ...segment.map(point => `${positions[point.snapshotIndex]},${TRACK_HEIGHT - 1 - barHeight(point.share)}`),\n      `${positions[lastPoint.snapshotIndex]},${TRACK_HEIGHT - 1}`,\n    ].join(' '),\n  };\n}\n\nexport function LifelineRow({\n  row,\n  signalName,\n  snapshots,\n  positions,\n  hue,\n  onThemeSelect,\n}: {\n  row: ThemeLifeline;\n  signalName: TraceSignalName;\n  snapshots: ThemeSnapshot[];\n  positions: number[];\n  hue: number;\n  onThemeSelect: (selection: ThemeSelection, snapshotIndex: number) => void;\n}) {\n  const isPersistent = row.points.length * 2 >= snapshots.length;\n  const connectors = lifelineConnectors(row.points);\n  const segments = lifelineSegments(row.points);\n  const pointY = (point: ThemeLifelinePoint) => TRACK_HEIGHT - 1 - barHeight(point.share);\n\n  return (\n    <li\n      aria-label={`${row.label}: present in ${row.points.length} of ${snapshots.length} landmarks`}\n      className={`group hover:bg-fill-subtle flex items-center gap-3 rounded-md ${isPersistent ? '' : 'opacity-55 hover:opacity-100'}`}\n    >\n      <span\n        className={cn(\n          quietTextHoverInGroup,\n          controlStateColorTransition,\n          'text-caption w-52 shrink-0 truncate text-right',\n        )}\n        title={row.label}\n      >\n        {row.label}\n      </span>\n      <div className=\"border-border relative mx-2 h-7 min-w-0 flex-1 border-b\">\n        {connectors.length > 0 || segments.length > 0 ? (\n          <svg\n            aria-hidden=\"true\"\n            className=\"pointer-events-none absolute inset-0 size-full\"\n            preserveAspectRatio=\"none\"\n            viewBox={`0 0 100 ${TRACK_HEIGHT}`}\n          >\n            {segments.map(segment => {\n              const area = lifelineArea(segment, positions);\n              if (!area) return undefined;\n              return <polygon key={`area-${area.key}`} fill={nodeColor(hue)} fillOpacity={0.14} points={area.points} />;\n            })}\n            {connectors.map(({ from, to }) => (\n              <line\n                key={`${from.snapshotIndex}-${to.snapshotIndex}`}\n                stroke={nodeColor(hue)}\n                strokeOpacity={0.45}\n                strokeWidth={1.2}\n                vectorEffect=\"non-scaling-stroke\"\n                x1={positions[from.snapshotIndex]}\n                y1={pointY(from)}\n                x2={positions[to.snapshotIndex]}\n                y2={pointY(to)}\n              />\n            ))}\n          </svg>\n        ) : null}\n        {row.points.map(point => {\n          const title = pointTitle(snapshots[point.snapshotIndex], row.label, point.traceCount, point.share);\n          const themeId = point.themeId;\n          return (\n            <LifelinePoint\n              key={point.snapshotIndex}\n              title={title}\n              positionPercent={positions[point.snapshotIndex]}\n              height={barHeight(point.share)}\n              color={nodeColor(hue)}\n              onSelect={\n                themeId === undefined\n                  ? undefined\n                  : () => onThemeSelect({ kind: 'theme', signalName, themeId, label: row.label }, point.snapshotIndex)\n              }\n            />\n          );\n        })}\n      </div>\n      <span className=\"text-muted-foreground text-caption w-9 shrink-0 font-mono tabular-nums\">\n        {row.points.length}/{snapshots.length}\n      </span>\n    </li>\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"lifeline-row.es.js","sources":["../../../src/ee/signals/lifeline-row.tsx"],"sourcesContent":["import { LifelinePoint } from './lifeline-point';\nimport { formatSnapshotCutoff } from './signal-formatting';\nimport type { ThemeSelection } from './theme-drilldown-data';\nimport { lifelineConnectors, lifelineSegments } from './theme-lifelines-data';\nimport type { ThemeLifeline, ThemeLifelinePoint } from './theme-lifelines-data';\nimport type { ThemeSnapshot, TraceSignalName } from './types';\nimport { nodeColor } from '@/ds/components/SankeyChart';\nimport { controlStateColorTransition } from '@/ds/primitives/transitions';\nimport { quietTextHoverInGroup } from '@/ds/primitives/typography';\nimport { cn } from '@/lib/utils';\n\nconst TRACK_HEIGHT = 28;\nconst MAX_BAR_HEIGHT = 22;\nconst MIN_BAR_HEIGHT = 4;\n\nfunction barHeight(share: number) {\n  return Math.max(MIN_BAR_HEIGHT, Math.round(share * MAX_BAR_HEIGHT));\n}\n\nfunction pointTitle(snapshot: ThemeSnapshot | undefined, label: string, traceCount: number, share: number) {\n  const cutoff = snapshot?.cutoffAt ? formatSnapshotCutoff(snapshot.cutoffAt) : undefined;\n  return `${label}${cutoff ? ` · ${cutoff}` : ''} · ${traceCount} traces (${Math.round(share * 100)}%)`;\n}\n\nfunction lifelineArea(segment: ThemeLifelinePoint[], positions: number[]) {\n  const firstPoint = segment[0];\n  const lastPoint = segment.at(-1);\n  if (!firstPoint || !lastPoint) return undefined;\n\n  return {\n    key: firstPoint.snapshotIndex,\n    points: [\n      `${positions[firstPoint.snapshotIndex]},${TRACK_HEIGHT - 1}`,\n      ...segment.map(point => `${positions[point.snapshotIndex]},${TRACK_HEIGHT - 1 - barHeight(point.share)}`),\n      `${positions[lastPoint.snapshotIndex]},${TRACK_HEIGHT - 1}`,\n    ].join(' '),\n  };\n}\n\nexport function LifelineRow({\n  row,\n  signalName,\n  snapshots,\n  positions,\n  hue,\n  onThemeSelect,\n}: {\n  row: ThemeLifeline;\n  signalName: TraceSignalName;\n  snapshots: ThemeSnapshot[];\n  positions: number[];\n  hue: number;\n  onThemeSelect: (selection: ThemeSelection, snapshotIndex: number) => void;\n}) {\n  const isPersistent = row.points.length * 2 >= snapshots.length;\n  const connectors = lifelineConnectors(row.points);\n  const segments = lifelineSegments(row.points);\n  const pointY = (point: ThemeLifelinePoint) => TRACK_HEIGHT - 1 - barHeight(point.share);\n\n  return (\n    <li\n      aria-label={`${row.label}: present in ${row.points.length} of ${snapshots.length} landmarks`}\n      className={`group flex items-center gap-3 rounded-md hover:bg-fill-subtle ${isPersistent ? '' : 'opacity-55 hover:opacity-100'}`}\n    >\n      <span\n        className={cn(\n          quietTextHoverInGroup,\n          controlStateColorTransition,\n          'w-52 shrink-0 truncate text-right text-caption',\n        )}\n        title={row.label}\n      >\n        {row.label}\n      </span>\n      <div className=\"relative mx-2 h-7 min-w-0 flex-1 border-b border-border\">\n        {connectors.length > 0 || segments.length > 0 ? (\n          <svg\n            aria-hidden=\"true\"\n            className=\"pointer-events-none absolute inset-0 size-full\"\n            preserveAspectRatio=\"none\"\n            viewBox={`0 0 100 ${TRACK_HEIGHT}`}\n          >\n            {segments.map(segment => {\n              const area = lifelineArea(segment, positions);\n              if (!area) return undefined;\n              return <polygon key={`area-${area.key}`} fill={nodeColor(hue)} fillOpacity={0.14} points={area.points} />;\n            })}\n            {connectors.map(({ from, to }) => (\n              <line\n                key={`${from.snapshotIndex}-${to.snapshotIndex}`}\n                stroke={nodeColor(hue)}\n                strokeOpacity={0.45}\n                strokeWidth={1.2}\n                vectorEffect=\"non-scaling-stroke\"\n                x1={positions[from.snapshotIndex]}\n                y1={pointY(from)}\n                x2={positions[to.snapshotIndex]}\n                y2={pointY(to)}\n              />\n            ))}\n          </svg>\n        ) : null}\n        {row.points.map(point => {\n          const title = pointTitle(snapshots[point.snapshotIndex], row.label, point.traceCount, point.share);\n          const themeId = point.themeId;\n          return (\n            <LifelinePoint\n              key={point.snapshotIndex}\n              title={title}\n              positionPercent={positions[point.snapshotIndex]}\n              height={barHeight(point.share)}\n              color={nodeColor(hue)}\n              onSelect={\n                themeId === undefined\n                  ? undefined\n                  : () => onThemeSelect({ kind: 'theme', signalName, themeId, label: row.label }, point.snapshotIndex)\n              }\n            />\n          );\n        })}\n      </div>\n      <span className=\"w-9 shrink-0 font-mono text-caption text-muted-foreground tabular-nums\">\n        {row.points.length}/{snapshots.length}\n      </span>\n    </li>\n  );\n}\n"],"names":[],"mappings":"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"}

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

@@ -11,7 +11,7 @@ require('@tanstack/react-query');
 require('./trace-intelligence-context.cjs.js');
 const ee_signals_signalFormatting = require('./signal-formatting.cjs.js');
 const ee_signals_traceInsightView = require('./trace-insight-view.cjs.js');
-const drawer = require('../../drawer-BL5shtHH.cjs');
+const drawer = require('../../drawer-9eoZbmRK.cjs');
 const primitives_raisedSurface = require('../../primitives/raised-surface.cjs.js');
 const utils_cn = require('../../cn-DG0X1KEP.cjs');
 
@@ -54,7 +54,7 @@ function NoiseDetailPanel({
       side: "right",
       variant: "floating",
       children: /* @__PURE__ */ jsxRuntime.jsxs(drawer.DrawerContent, { children: [
-        /* @__PURE__ */ jsxRuntime.jsxs(drawer.DrawerHeader, { className: "border-border border-b", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs(drawer.DrawerHeader, { className: "border-b border-border", children: [
           /* @__PURE__ */ jsxRuntime.jsx(drawer.DrawerTitle, { children: "Noise" }),
           /* @__PURE__ */ jsxRuntime.jsxs(drawer.DrawerDescription, { className: "sr-only", children: [
             "Noise details for the ",
@@ -70,14 +70,14 @@ function NoiseDetailPanel({
                 "h2",
                 {
                   id: "noise-summary-heading",
-                  className: "text-muted-foreground text-caption font-mono tracking-wider uppercase",
+                  className: "font-mono text-caption tracking-wider text-muted-foreground uppercase",
                   children: "Summary"
                 }
               ),
-              /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-foreground text-body mt-3", children: "Noise contains trace signal summaries that did not consistently match a recurring theme in this snapshot." }),
-              noiseQuery.isPending && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground text-body mt-4", children: "Loading noise details…" }),
-              noiseQuery.isError && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-body mt-4 text-red-500", children: "Unable to load noise details." }),
-              noiseQuery.data && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-foreground text-body mt-4 font-mono tabular-nums", children: ee_signals_signalFormatting.shareSentence(
+              /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-3 text-body text-foreground", children: "Noise contains trace signal summaries that did not consistently match a recurring theme in this snapshot." }),
+              noiseQuery.isPending && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-4 text-body text-muted-foreground", children: "Loading noise details…" }),
+              noiseQuery.isError && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-4 text-body text-red-500", children: "Unable to load noise details." }),
+              noiseQuery.data && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-4 font-mono text-body text-foreground tabular-nums", children: ee_signals_signalFormatting.shareSentence(
                 filteredStats?.traceCount ?? noiseQuery.data.noise.traceCount,
                 filteredStats?.stageShare ?? noiseQuery.data.noise.coverage
               ) })
@@ -87,21 +87,21 @@ function NoiseDetailPanel({
                 "h2",
                 {
                   id: "noise-examples-heading",
-                  className: "text-muted-foreground text-caption font-mono tracking-wider uppercase",
+                  className: "font-mono text-caption tracking-wider text-muted-foreground uppercase",
                   children: "Example summaries"
                 }
               ),
-              examplesQuery.isPending && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground text-body mt-3", children: "Loading examples…" }),
-              examplesQuery.isError && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-body mt-3 text-red-500", children: "Unable to load 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.data && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-                examplesQuery.data.examples.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground text-body mt-3", children: "No noise 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("p", { className: "mt-3 text-body text-muted-foreground", children: "No noise 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",
                     "aria-label": `View trace insight for ${example.signalText}`,
                     className: utils_cn.cn(
                       primitives_raisedSurface.raisedSurfaceStyle,
-                      "state-layer text-foreground text-body w-full cursor-pointer rounded-md p-3 text-left"
+                      "state-layer w-full cursor-pointer rounded-md p-3 text-left text-body text-foreground"
                     ),
                     onClick: () => setInsightTraceId(example.traceId),
                     children: example.signalText

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

@@ -1 +1 @@
-{"version":3,"file":"noise-detail-panel.cjs.js","sources":["../../../src/ee/signals/noise-detail-panel.tsx"],"sourcesContent":["import { useState } from 'react';\n\nimport { EXAMPLES_PAGE_SIZE, ExamplesPager } from './examples-pager';\nimport { useNoise, useNoiseExamples } from './hooks';\nimport { shareSentence } from './signal-formatting';\nimport type { ThemeSelection, ThemeSelectionStats } from './theme-drilldown-data';\nimport { TraceInsightView } from './trace-insight-view';\nimport type { TraceSignalName } from './types';\nimport {\n  Drawer,\n  DrawerBody,\n  DrawerContent,\n  DrawerDescription,\n  DrawerHeader,\n  DrawerTitle,\n} from '@/ds/components/Drawer';\nimport { raisedSurfaceStyle } from '@/ds/primitives/raised-surface';\nimport { cn } from '@/lib/utils';\n\ninterface NoiseDetailPanelProps {\n  entityId: string;\n  entityType: string;\n  snapshotId: string;\n  signalName: TraceSignalName | undefined;\n  filters?: ThemeSelection[];\n  filteredStats?: ThemeSelectionStats;\n  onClose: () => void;\n}\n\nexport function NoiseDetailPanel({\n  entityId,\n  entityType,\n  snapshotId,\n  signalName,\n  filters = [],\n  filteredStats,\n  onClose,\n}: NoiseDetailPanelProps) {\n  const filterKey = filters\n    .map(filter => `${filter.signalName}:${filter.kind === 'theme' ? filter.themeId : 'noise'}`)\n    .join(',');\n  const examplesContextKey = `${snapshotId}:${signalName ?? ''}:${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 noiseQuery = useNoise(entityId, entityType, signalName, snapshotId);\n  const examplesQuery = useNoiseExamples(\n    entityId,\n    entityType,\n    signalName,\n    snapshotId,\n    EXAMPLES_PAGE_SIZE,\n    examplesOffset,\n    filters,\n  );\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={signalName !== undefined}\n      overlay=\"none\"\n      side=\"right\"\n      variant=\"floating\"\n    >\n      <DrawerContent>\n        <DrawerHeader className=\"border-border border-b\">\n          <DrawerTitle>Noise</DrawerTitle>\n          <DrawerDescription className=\"sr-only\">Noise details for the {signalName} trace signal</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              <section aria-labelledby=\"noise-summary-heading\">\n                <h2\n                  id=\"noise-summary-heading\"\n                  className=\"text-muted-foreground text-caption font-mono tracking-wider uppercase\"\n                >\n                  Summary\n                </h2>\n                <p className=\"text-foreground text-body mt-3\">\n                  Noise contains trace signal summaries that did not consistently match a recurring theme in this\n                  snapshot.\n                </p>\n                {noiseQuery.isPending && <p className=\"text-muted-foreground text-body mt-4\">Loading noise details…</p>}\n                {noiseQuery.isError && <p className=\"text-body mt-4 text-red-500\">Unable to load noise details.</p>}\n                {noiseQuery.data && (\n                  <p className=\"text-foreground text-body mt-4 font-mono tabular-nums\">\n                    {shareSentence(\n                      filteredStats?.traceCount ?? noiseQuery.data.noise.traceCount,\n                      filteredStats?.stageShare ?? noiseQuery.data.noise.coverage,\n                    )}\n                  </p>\n                )}\n              </section>\n\n              <section aria-labelledby=\"noise-examples-heading\">\n                <h2\n                  id=\"noise-examples-heading\"\n                  className=\"text-muted-foreground text-caption font-mono tracking-wider uppercase\"\n                >\n                  Example summaries\n                </h2>\n                {examplesQuery.isPending && <p className=\"text-muted-foreground text-body mt-3\">Loading examples…</p>}\n                {examplesQuery.isError && <p className=\"text-body mt-3 text-red-500\">Unable to load examples.</p>}\n                {examplesQuery.data && (\n                  <>\n                    {examplesQuery.data.examples.length === 0 ? (\n                      <p className=\"text-muted-foreground text-body mt-3\">No noise 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 text-foreground text-body w-full cursor-pointer rounded-md p-3 text-left',\n                              )}\n                              onClick={() => setInsightTraceId(example.traceId)}\n                            >\n                              {example.signalText}\n                            </button>\n                          </li>\n                        ))}\n                      </ul>\n                    )}\n                    {noiseQuery.data && (\n                      <ExamplesPager\n                        traceCount={filteredStats?.traceCount ?? noiseQuery.data.noise.traceCount}\n                        offset={examplesOffset}\n                        onOffsetChange={offset => setExamplesPage({ contextKey: examplesContextKey, offset })}\n                      />\n                    )}\n                  </>\n                )}\n              </section>\n            </>\n          )}\n        </DrawerBody>\n      </DrawerContent>\n    </Drawer>\n  );\n}\n"],"names":["useState","useNoise","useNoiseExamples","EXAMPLES_PAGE_SIZE","jsx","Drawer","DrawerContent","jsxs","DrawerHeader","DrawerTitle","DrawerDescription","DrawerBody","TraceInsightView","Fragment","shareSentence","cn","raisedSurfaceStyle","ExamplesPager"],"mappings":"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"}
+{"version":3,"file":"noise-detail-panel.cjs.js","sources":["../../../src/ee/signals/noise-detail-panel.tsx"],"sourcesContent":["import { useState } from 'react';\n\nimport { EXAMPLES_PAGE_SIZE, ExamplesPager } from './examples-pager';\nimport { useNoise, useNoiseExamples } from './hooks';\nimport { shareSentence } from './signal-formatting';\nimport type { ThemeSelection, ThemeSelectionStats } from './theme-drilldown-data';\nimport { TraceInsightView } from './trace-insight-view';\nimport type { TraceSignalName } from './types';\nimport {\n  Drawer,\n  DrawerBody,\n  DrawerContent,\n  DrawerDescription,\n  DrawerHeader,\n  DrawerTitle,\n} from '@/ds/components/Drawer';\nimport { raisedSurfaceStyle } from '@/ds/primitives/raised-surface';\nimport { cn } from '@/lib/utils';\n\ninterface NoiseDetailPanelProps {\n  entityId: string;\n  entityType: string;\n  snapshotId: string;\n  signalName: TraceSignalName | undefined;\n  filters?: ThemeSelection[];\n  filteredStats?: ThemeSelectionStats;\n  onClose: () => void;\n}\n\nexport function NoiseDetailPanel({\n  entityId,\n  entityType,\n  snapshotId,\n  signalName,\n  filters = [],\n  filteredStats,\n  onClose,\n}: NoiseDetailPanelProps) {\n  const filterKey = filters\n    .map(filter => `${filter.signalName}:${filter.kind === 'theme' ? filter.themeId : 'noise'}`)\n    .join(',');\n  const examplesContextKey = `${snapshotId}:${signalName ?? ''}:${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 noiseQuery = useNoise(entityId, entityType, signalName, snapshotId);\n  const examplesQuery = useNoiseExamples(\n    entityId,\n    entityType,\n    signalName,\n    snapshotId,\n    EXAMPLES_PAGE_SIZE,\n    examplesOffset,\n    filters,\n  );\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={signalName !== undefined}\n      overlay=\"none\"\n      side=\"right\"\n      variant=\"floating\"\n    >\n      <DrawerContent>\n        <DrawerHeader className=\"border-b border-border\">\n          <DrawerTitle>Noise</DrawerTitle>\n          <DrawerDescription className=\"sr-only\">Noise details for the {signalName} trace signal</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              <section aria-labelledby=\"noise-summary-heading\">\n                <h2\n                  id=\"noise-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                  Noise contains trace signal summaries that did not consistently match a recurring theme in this\n                  snapshot.\n                </p>\n                {noiseQuery.isPending && <p className=\"mt-4 text-body text-muted-foreground\">Loading noise details…</p>}\n                {noiseQuery.isError && <p className=\"mt-4 text-body text-red-500\">Unable to load noise details.</p>}\n                {noiseQuery.data && (\n                  <p className=\"mt-4 font-mono text-body text-foreground tabular-nums\">\n                    {shareSentence(\n                      filteredStats?.traceCount ?? noiseQuery.data.noise.traceCount,\n                      filteredStats?.stageShare ?? noiseQuery.data.noise.coverage,\n                    )}\n                  </p>\n                )}\n              </section>\n\n              <section aria-labelledby=\"noise-examples-heading\">\n                <h2\n                  id=\"noise-examples-heading\"\n                  className=\"font-mono text-caption tracking-wider text-muted-foreground uppercase\"\n                >\n                  Example summaries\n                </h2>\n                {examplesQuery.isPending && <p className=\"mt-3 text-body text-muted-foreground\">Loading examples…</p>}\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 noise 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                    {noiseQuery.data && (\n                      <ExamplesPager\n                        traceCount={filteredStats?.traceCount ?? noiseQuery.data.noise.traceCount}\n                        offset={examplesOffset}\n                        onOffsetChange={offset => setExamplesPage({ contextKey: examplesContextKey, offset })}\n                      />\n                    )}\n                  </>\n                )}\n              </section>\n            </>\n          )}\n        </DrawerBody>\n      </DrawerContent>\n    </Drawer>\n  );\n}\n"],"names":["useState","useNoise","useNoiseExamples","EXAMPLES_PAGE_SIZE","jsx","Drawer","DrawerContent","jsxs","DrawerHeader","DrawerTitle","DrawerDescription","DrawerBody","TraceInsightView","Fragment","shareSentence","cn","raisedSurfaceStyle","ExamplesPager"],"mappings":"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"}

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

@@ -7,7 +7,7 @@ import '@tanstack/react-query';
 import './trace-intelligence-context.es.js';
 import { shareSentence } from './signal-formatting.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-Bv2DRY8E.js';
+import { D as Drawer, d as DrawerContent, g as DrawerHeader, o as DrawerTitle, e as DrawerDescription, b as DrawerBody } from '../../drawer-DnfOugYZ.js';
 import { raisedSurfaceStyle } from '../../primitives/raised-surface.es.js';
 import { c as cn } from '../../cn-65Adrsfj.js';
 
@@ -50,7 +50,7 @@ function NoiseDetailPanel({
       side: "right",
       variant: "floating",
       children: /* @__PURE__ */ jsxs(DrawerContent, { children: [
-        /* @__PURE__ */ jsxs(DrawerHeader, { className: "border-border border-b", children: [
+        /* @__PURE__ */ jsxs(DrawerHeader, { className: "border-b border-border", children: [
           /* @__PURE__ */ jsx(DrawerTitle, { children: "Noise" }),
           /* @__PURE__ */ jsxs(DrawerDescription, { className: "sr-only", children: [
             "Noise details for the ",
@@ -66,14 +66,14 @@ function NoiseDetailPanel({
                 "h2",
                 {
                   id: "noise-summary-heading",
-                  className: "text-muted-foreground text-caption font-mono tracking-wider uppercase",
+                  className: "font-mono text-caption tracking-wider text-muted-foreground uppercase",
                   children: "Summary"
                 }
               ),
-              /* @__PURE__ */ jsx("p", { className: "text-foreground text-body mt-3", children: "Noise contains trace signal summaries that did not consistently match a recurring theme in this snapshot." }),
-              noiseQuery.isPending && /* @__PURE__ */ jsx("p", { className: "text-muted-foreground text-body mt-4", children: "Loading noise details…" }),
-              noiseQuery.isError && /* @__PURE__ */ jsx("p", { className: "text-body mt-4 text-red-500", children: "Unable to load noise details." }),
-              noiseQuery.data && /* @__PURE__ */ jsx("p", { className: "text-foreground text-body mt-4 font-mono tabular-nums", children: shareSentence(
+              /* @__PURE__ */ jsx("p", { className: "mt-3 text-body text-foreground", children: "Noise contains trace signal summaries that did not consistently match a recurring theme in this snapshot." }),
+              noiseQuery.isPending && /* @__PURE__ */ jsx("p", { className: "mt-4 text-body text-muted-foreground", children: "Loading noise details…" }),
+              noiseQuery.isError && /* @__PURE__ */ jsx("p", { className: "mt-4 text-body text-red-500", children: "Unable to load noise details." }),
+              noiseQuery.data && /* @__PURE__ */ jsx("p", { className: "mt-4 font-mono text-body text-foreground tabular-nums", children: shareSentence(
                 filteredStats?.traceCount ?? noiseQuery.data.noise.traceCount,
                 filteredStats?.stageShare ?? noiseQuery.data.noise.coverage
               ) })
@@ -83,21 +83,21 @@ function NoiseDetailPanel({
                 "h2",
                 {
                   id: "noise-examples-heading",
-                  className: "text-muted-foreground text-caption font-mono tracking-wider uppercase",
+                  className: "font-mono text-caption tracking-wider text-muted-foreground uppercase",
                   children: "Example summaries"
                 }
               ),
-              examplesQuery.isPending && /* @__PURE__ */ jsx("p", { className: "text-muted-foreground text-body mt-3", children: "Loading examples…" }),
-              examplesQuery.isError && /* @__PURE__ */ jsx("p", { className: "text-body mt-3 text-red-500", children: "Unable to load 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.data && /* @__PURE__ */ jsxs(Fragment, { children: [
-                examplesQuery.data.examples.length === 0 ? /* @__PURE__ */ jsx("p", { className: "text-muted-foreground text-body mt-3", children: "No noise 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("p", { className: "mt-3 text-body text-muted-foreground", children: "No noise 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",
                     "aria-label": `View trace insight for ${example.signalText}`,
                     className: cn(
                       raisedSurfaceStyle,
-                      "state-layer text-foreground text-body w-full cursor-pointer rounded-md p-3 text-left"
+                      "state-layer w-full cursor-pointer rounded-md p-3 text-left text-body text-foreground"
                     ),
                     onClick: () => setInsightTraceId(example.traceId),
                     children: example.signalText