@mastra/playground-ui 66.1.0-alpha.2 → 67.0.0

package/dist/domains/metrics/components/breakdown/breakdown-frame.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"breakdown-frame.cjs.js","names":["ChartCard","MetricsCard"],"sources":["../../../../../src/domains/metrics/components/breakdown/breakdown-frame.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport type { DrilldownScope } from '../../drilldown';\nimport type { BreakdownTab } from '../../lib/breakdown';\nimport { ChartCard } from '../chart-card';\nimport { MetricsCard } from '@/ds/components/MetricsCard';\n\nexport const BREAKDOWN_TITLE = 'Breakdown';\n\nconst TAB_LABEL: Record<BreakdownTab, string> = {\n  projects: 'Projects',\n  agents: 'Agents',\n  workflows: 'Workflows',\n  tools: 'Tools',\n  models: 'Models',\n  threads: 'Threads',\n  environments: 'Environments',\n};\n\nconst DESCRIPTION: Record<BreakdownTab, string> = {\n  projects: 'Traces, errors, latency and spend per project.',\n  agents: 'Traces each agent ran in, nested runs included, with errors, latency and spend.',\n  workflows: 'Traces each workflow ran in, nested runs included, with errors and latency.',\n  tools: 'Every tool call, MCP tools included, with errors and latency.',\n  models: 'Model calls, tokens and spend per model.',\n  threads: 'Traces, errors, latency and spend per thread.',\n  environments: 'Traces, errors, latency and spend per environment.',\n};\n\n/** What every tab passes down: the tab list, and what a tab change or row click does. */\nexport type BreakdownFrameProps = {\n  tabs: BreakdownTab[];\n  onTabChange: (tab: BreakdownTab) => void;\n  onRowClick?: (scope: DrilldownScope) => void;\n  byProject: boolean;\n};\n\n/** The card shell around every tab's state, so loading, errors and rows share one layout. */\nexport function BreakdownFrame({\n  tab,\n  tabs,\n  onTabChange,\n  isUpdating,\n  children,\n}: BreakdownFrameProps & { tab: BreakdownTab; isUpdating?: boolean; children: ReactNode }) {\n  return (\n    <ChartCard\n      title={BREAKDOWN_TITLE}\n      description={DESCRIPTION[tab]}\n      isUpdating={isUpdating}\n      bodyHeight=\"fit\"\n      toolbar={\n        <MetricsCard.Toolbar>\n          <MetricsCard.Tabs<BreakdownTab> value={tab} onValueChange={onTabChange}>\n            {tabs.map(t => (\n              <MetricsCard.Tab key={t} value={t}>\n                {TAB_LABEL[t]}\n              </MetricsCard.Tab>\n            ))}\n          </MetricsCard.Tabs>\n        </MetricsCard.Toolbar>\n      }\n    >\n      {children}\n    </ChartCard>\n  );\n}\n"],"mappings":";;;;;AAMA,IAAa,kBAAkB;AAE/B,IAAM,YAA0C;CAC9C,UAAU;CACV,QAAQ;CACR,WAAW;CACX,OAAO;CACP,QAAQ;CACR,SAAS;CACT,cAAc;AAChB;AAEA,IAAM,cAA4C;CAChD,UAAU;CACV,QAAQ;CACR,WAAW;CACX,OAAO;CACP,QAAQ;CACR,SAAS;CACT,cAAc;AAChB;;AAWA,SAAgB,eAAe,EAC7B,KACA,MACA,aACA,YACA,YACyF;CACzF,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACA,8CAAAA,WAAD;EACE,OAAO;EACP,aAAa,YAAY;EACb;EACZ,YAAW;EACX,SACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,oBAAAA,YAAY,SAAb,EAAA,UACE,iBAAA,GAAA,kBAAA,IAAA,CAACA,oBAAAA,YAAY,MAAb;GAAgC,OAAO;GAAK,eAAe;GACxD,UAAA,KAAK,KAAI,MACR,iBAAA,GAAA,kBAAA,IAAA,CAACA,oBAAAA,YAAY,KAAb;IAAyB,OAAO;IAC7B,UAAA,UAAU;GACI,GAFK,CAEL,CAClB;EACe,CAAA,EACC,CAAA;EAGtB;CACQ,CAAA;AAEf"}
+{"version":3,"file":"breakdown-frame.cjs.js","names":["ChartCard"],"sources":["../../../../../src/domains/metrics/components/breakdown/breakdown-frame.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport type { DrilldownScope } from '../../drilldown';\nimport type { BreakdownTab } from '../../lib/breakdown';\nimport { ChartCard } from '../chart-card';\n\nexport const BREAKDOWN_TITLE = 'Breakdown';\n\nconst TAB_TITLE: Record<BreakdownTab, string> = {\n  projects: 'Breakdown by project',\n  agents: 'Breakdown by agent',\n  workflows: 'Breakdown by workflow',\n  tools: 'Breakdown by tool',\n  models: 'Breakdown by model',\n  threads: 'Breakdown by thread',\n  environments: 'Breakdown by environment',\n};\n\n/** What every tab passes down: the tab list, and what a tab change or row click does. */\nexport type BreakdownFrameProps = {\n  tabs: BreakdownTab[];\n  onTabChange: (tab: BreakdownTab) => void;\n  onRowClick?: (scope: DrilldownScope) => void;\n  byProject: boolean;\n};\n\n/** The card shell around every tab's state, so loading, errors and rows share one layout. */\nexport function BreakdownFrame({\n  tab,\n  tabs,\n  onTabChange,\n  isUpdating,\n  children,\n}: BreakdownFrameProps & { tab: BreakdownTab; isUpdating?: boolean; children: ReactNode }) {\n  return (\n    <ChartCard\n      title={TAB_TITLE[tab]}\n      titleMenu={\n        tabs.length > 1\n          ? {\n              value: tab,\n              onValueChange: onTabChange,\n              options: tabs.map(t => ({ value: t, label: TAB_TITLE[t] })),\n            }\n          : undefined\n      }\n      isUpdating={isUpdating}\n      bodyHeight=\"fit\"\n    >\n      {children}\n    </ChartCard>\n  );\n}\n"],"mappings":";;;;AAKA,IAAa,kBAAkB;AAE/B,IAAM,YAA0C;CAC9C,UAAU;CACV,QAAQ;CACR,WAAW;CACX,OAAO;CACP,QAAQ;CACR,SAAS;CACT,cAAc;AAChB;;AAWA,SAAgB,eAAe,EAC7B,KACA,MACA,aACA,YACA,YACyF;CACzF,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACA,8CAAAA,WAAD;EACE,OAAO,UAAU;EACjB,WACE,KAAK,SAAS,IACV;GACE,OAAO;GACP,eAAe;GACf,SAAS,KAAK,KAAI,OAAM;IAAE,OAAO;IAAG,OAAO,UAAU;GAAG,EAAE;EAC5D,IACA,KAAA;EAEM;EACZ,YAAW;EAEV;CACQ,CAAA;AAEf"}

package/dist/domains/metrics/components/breakdown/breakdown-frame.es.js

@@ -1,41 +1,30 @@
-import { t as MetricsCard } from "../../../../MetricsCard-C9GWgT58.js";
 import { ChartCard } from "../chart-card.es.js";
 import { jsx } from "react/jsx-runtime";
 // src/domains/metrics/components/breakdown/breakdown-frame.tsx
 var BREAKDOWN_TITLE = "Breakdown";
-var TAB_LABEL = {
-	projects: "Projects",
-	agents: "Agents",
-	workflows: "Workflows",
-	tools: "Tools",
-	models: "Models",
-	threads: "Threads",
-	environments: "Environments"
-};
-var DESCRIPTION = {
-	projects: "Traces, errors, latency and spend per project.",
-	agents: "Traces each agent ran in, nested runs included, with errors, latency and spend.",
-	workflows: "Traces each workflow ran in, nested runs included, with errors and latency.",
-	tools: "Every tool call, MCP tools included, with errors and latency.",
-	models: "Model calls, tokens and spend per model.",
-	threads: "Traces, errors, latency and spend per thread.",
-	environments: "Traces, errors, latency and spend per environment."
+var TAB_TITLE = {
+	projects: "Breakdown by project",
+	agents: "Breakdown by agent",
+	workflows: "Breakdown by workflow",
+	tools: "Breakdown by tool",
+	models: "Breakdown by model",
+	threads: "Breakdown by thread",
+	environments: "Breakdown by environment"
 };
 /** The card shell around every tab's state, so loading, errors and rows share one layout. */
 function BreakdownFrame({ tab, tabs, onTabChange, isUpdating, children }) {
 	return /* @__PURE__ */ jsx(ChartCard, {
-		title: BREAKDOWN_TITLE,
-		description: DESCRIPTION[tab],
-		isUpdating,
-		bodyHeight: "fit",
-		toolbar: /* @__PURE__ */ jsx(MetricsCard.Toolbar, { children: /* @__PURE__ */ jsx(MetricsCard.Tabs, {
+		title: TAB_TITLE[tab],
+		titleMenu: tabs.length > 1 ? {
 			value: tab,
 			onValueChange: onTabChange,
-			children: tabs.map((t) => /* @__PURE__ */ jsx(MetricsCard.Tab, {
+			options: tabs.map((t) => ({
 				value: t,
-				children: TAB_LABEL[t]
-			}, t))
-		}) }),
+				label: TAB_TITLE[t]
+			}))
+		} : void 0,
+		isUpdating,
+		bodyHeight: "fit",
 		children
 	});
 }

package/dist/domains/metrics/components/breakdown/breakdown-frame.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"breakdown-frame.es.js","names":[],"sources":["../../../../../src/domains/metrics/components/breakdown/breakdown-frame.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport type { DrilldownScope } from '../../drilldown';\nimport type { BreakdownTab } from '../../lib/breakdown';\nimport { ChartCard } from '../chart-card';\nimport { MetricsCard } from '@/ds/components/MetricsCard';\n\nexport const BREAKDOWN_TITLE = 'Breakdown';\n\nconst TAB_LABEL: Record<BreakdownTab, string> = {\n  projects: 'Projects',\n  agents: 'Agents',\n  workflows: 'Workflows',\n  tools: 'Tools',\n  models: 'Models',\n  threads: 'Threads',\n  environments: 'Environments',\n};\n\nconst DESCRIPTION: Record<BreakdownTab, string> = {\n  projects: 'Traces, errors, latency and spend per project.',\n  agents: 'Traces each agent ran in, nested runs included, with errors, latency and spend.',\n  workflows: 'Traces each workflow ran in, nested runs included, with errors and latency.',\n  tools: 'Every tool call, MCP tools included, with errors and latency.',\n  models: 'Model calls, tokens and spend per model.',\n  threads: 'Traces, errors, latency and spend per thread.',\n  environments: 'Traces, errors, latency and spend per environment.',\n};\n\n/** What every tab passes down: the tab list, and what a tab change or row click does. */\nexport type BreakdownFrameProps = {\n  tabs: BreakdownTab[];\n  onTabChange: (tab: BreakdownTab) => void;\n  onRowClick?: (scope: DrilldownScope) => void;\n  byProject: boolean;\n};\n\n/** The card shell around every tab's state, so loading, errors and rows share one layout. */\nexport function BreakdownFrame({\n  tab,\n  tabs,\n  onTabChange,\n  isUpdating,\n  children,\n}: BreakdownFrameProps & { tab: BreakdownTab; isUpdating?: boolean; children: ReactNode }) {\n  return (\n    <ChartCard\n      title={BREAKDOWN_TITLE}\n      description={DESCRIPTION[tab]}\n      isUpdating={isUpdating}\n      bodyHeight=\"fit\"\n      toolbar={\n        <MetricsCard.Toolbar>\n          <MetricsCard.Tabs<BreakdownTab> value={tab} onValueChange={onTabChange}>\n            {tabs.map(t => (\n              <MetricsCard.Tab key={t} value={t}>\n                {TAB_LABEL[t]}\n              </MetricsCard.Tab>\n            ))}\n          </MetricsCard.Tabs>\n        </MetricsCard.Toolbar>\n      }\n    >\n      {children}\n    </ChartCard>\n  );\n}\n"],"mappings":";;;;AAMA,IAAa,kBAAkB;AAE/B,IAAM,YAA0C;CAC9C,UAAU;CACV,QAAQ;CACR,WAAW;CACX,OAAO;CACP,QAAQ;CACR,SAAS;CACT,cAAc;AAChB;AAEA,IAAM,cAA4C;CAChD,UAAU;CACV,QAAQ;CACR,WAAW;CACX,OAAO;CACP,QAAQ;CACR,SAAS;CACT,cAAc;AAChB;;AAWA,SAAgB,eAAe,EAC7B,KACA,MACA,aACA,YACA,YACyF;CACzF,OACE,oBAAC,WAAD;EACE,OAAO;EACP,aAAa,YAAY;EACb;EACZ,YAAW;EACX,SACE,oBAAC,YAAY,SAAb,EAAA,UACE,oBAAC,YAAY,MAAb;GAAgC,OAAO;GAAK,eAAe;GACxD,UAAA,KAAK,KAAI,MACR,oBAAC,YAAY,KAAb;IAAyB,OAAO;IAC7B,UAAA,UAAU;GACI,GAFK,CAEL,CAClB;EACe,CAAA,EACC,CAAA;EAGtB;CACQ,CAAA;AAEf"}
+{"version":3,"file":"breakdown-frame.es.js","names":[],"sources":["../../../../../src/domains/metrics/components/breakdown/breakdown-frame.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport type { DrilldownScope } from '../../drilldown';\nimport type { BreakdownTab } from '../../lib/breakdown';\nimport { ChartCard } from '../chart-card';\n\nexport const BREAKDOWN_TITLE = 'Breakdown';\n\nconst TAB_TITLE: Record<BreakdownTab, string> = {\n  projects: 'Breakdown by project',\n  agents: 'Breakdown by agent',\n  workflows: 'Breakdown by workflow',\n  tools: 'Breakdown by tool',\n  models: 'Breakdown by model',\n  threads: 'Breakdown by thread',\n  environments: 'Breakdown by environment',\n};\n\n/** What every tab passes down: the tab list, and what a tab change or row click does. */\nexport type BreakdownFrameProps = {\n  tabs: BreakdownTab[];\n  onTabChange: (tab: BreakdownTab) => void;\n  onRowClick?: (scope: DrilldownScope) => void;\n  byProject: boolean;\n};\n\n/** The card shell around every tab's state, so loading, errors and rows share one layout. */\nexport function BreakdownFrame({\n  tab,\n  tabs,\n  onTabChange,\n  isUpdating,\n  children,\n}: BreakdownFrameProps & { tab: BreakdownTab; isUpdating?: boolean; children: ReactNode }) {\n  return (\n    <ChartCard\n      title={TAB_TITLE[tab]}\n      titleMenu={\n        tabs.length > 1\n          ? {\n              value: tab,\n              onValueChange: onTabChange,\n              options: tabs.map(t => ({ value: t, label: TAB_TITLE[t] })),\n            }\n          : undefined\n      }\n      isUpdating={isUpdating}\n      bodyHeight=\"fit\"\n    >\n      {children}\n    </ChartCard>\n  );\n}\n"],"mappings":";;;AAKA,IAAa,kBAAkB;AAE/B,IAAM,YAA0C;CAC9C,UAAU;CACV,QAAQ;CACR,WAAW;CACX,OAAO;CACP,QAAQ;CACR,SAAS;CACT,cAAc;AAChB;;AAWA,SAAgB,eAAe,EAC7B,KACA,MACA,aACA,YACA,YACyF;CACzF,OACE,oBAAC,WAAD;EACE,OAAO,UAAU;EACjB,WACE,KAAK,SAAS,IACV;GACE,OAAO;GACP,eAAe;GACf,SAAS,KAAK,KAAI,OAAM;IAAE,OAAO;IAAG,OAAO,UAAU;GAAG,EAAE;EAC5D,IACA,KAAA;EAEM;EACZ,YAAW;EAEV;CACQ,CAAA;AAEf"}

package/dist/domains/metrics/components/breakdown/breakdown-models-tab.cjs.js

@@ -1,7 +1,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_domains_metrics_hooks_use_metrics_filters = require("../../hooks/use-metrics-filters.cjs.js");
-const require_domains_metrics_lib_breakdown = require("../../lib/breakdown.cjs.js");
 const require_domains_metrics_lib_time_window = require("../../lib/time-window.cjs.js");
+const require_domains_metrics_lib_breakdown = require("../../lib/breakdown.cjs.js");
 const require_domains_metrics_hooks_use_metrics_usage_totals = require("../../hooks/use-metrics-usage-totals.cjs.js");
 const require_domains_metrics_components_breakdown_breakdown_table = require("./breakdown-table.cjs.js");
 let react_jsx_runtime = require("react/jsx-runtime");

package/dist/domains/metrics/components/breakdown/breakdown-models-tab.es.js

@@ -1,6 +1,6 @@
 import { useMetricsFilters } from "../../hooks/use-metrics-filters.es.js";
-import { BREAKDOWN_GROUP_LIMIT, breakdownGroupBy } from "../../lib/breakdown.es.js";
 import { previousWindow } from "../../lib/time-window.es.js";
+import { BREAKDOWN_GROUP_LIMIT, breakdownGroupBy } from "../../lib/breakdown.es.js";
 import { useMetricsUsageTotals } from "../../hooks/use-metrics-usage-totals.es.js";
 import { BreakdownTable } from "./breakdown-table.es.js";
 import { jsx } from "react/jsx-runtime";

package/dist/domains/metrics/components/breakdown/breakdown-name.cjs.js

@@ -0,0 +1,22 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_domains_llm_model_name_parts = require("../../../llm/model-name-parts.cjs.js");
+const require_components_SegmentedName = require("../../../../components/SegmentedName.cjs.js");
+let react_jsx_runtime = require("react/jsx-runtime");
+// src/domains/metrics/components/breakdown/breakdown-name.tsx
+/**
+* A row's mark and name. With `provider` set (a model row with a name), the name reads
+* `openai › gpt-5-mini`; `title` is the name either way.
+*/
+function BreakdownName({ mark, title, model }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
+		className: "flex min-w-0 items-center gap-2",
+		children: [mark, /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "truncate",
+			title,
+			children: model ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_SegmentedName.SegmentedName, { parts: require_domains_llm_model_name_parts.modelNameParts(model.name, model.provider) }) : title
+		})]
+	});
+}
+exports.BreakdownName = BreakdownName;
+
+//# sourceMappingURL=breakdown-name.cjs.js.map

package/dist/domains/metrics/components/breakdown/breakdown-name.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"breakdown-name.cjs.js","names":["SegmentedName","modelNameParts"],"sources":["../../../../../src/domains/metrics/components/breakdown/breakdown-name.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport { modelNameParts } from '@/domains/llm';\nimport { SegmentedName } from '@/ds/components/SegmentedName';\n\n/**\n * A row's mark and name. With `provider` set (a model row with a name), the name reads\n * `openai › gpt-5-mini`; `title` is the name either way.\n */\nexport function BreakdownName({\n  mark,\n  title,\n  model,\n}: {\n  mark: ReactNode;\n  title: string;\n  model?: { name: string; provider: string | undefined };\n}) {\n  return (\n    <span className=\"flex min-w-0 items-center gap-2\">\n      {mark}\n      <span className=\"truncate\" title={title}>\n        {model ? <SegmentedName parts={modelNameParts(model.name, model.provider)} /> : title}\n      </span>\n    </span>\n  );\n}\n"],"mappings":";;;;;;;;;AAQA,SAAgB,cAAc,EAC5B,MACA,OACA,SAKC;CACD,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,QAAD;EAAM,WAAU;EAAhB,UAAA,CACG,MACD,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;GAAM,WAAU;GAAkB;GAC/B,UAAA,QAAQ,iBAAA,GAAA,kBAAA,IAAA,CAACA,iCAAAA,eAAD,EAAe,OAAOC,qCAAAA,eAAe,MAAM,MAAM,MAAM,QAAQ,EAAI,CAAA,IAAI;EAC5E,CAAA,CACF;;AAEV"}

package/dist/domains/metrics/components/breakdown/breakdown-name.d.ts

@@ -0,0 +1 @@
+export * from '../../../../src/domains/metrics/components/breakdown/breakdown-name';

package/dist/domains/metrics/components/breakdown/breakdown-name.es.js

@@ -0,0 +1,21 @@
+import { modelNameParts } from "../../../llm/model-name-parts.es.js";
+import { SegmentedName } from "../../../../components/SegmentedName.es.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+// src/domains/metrics/components/breakdown/breakdown-name.tsx
+/**
+* A row's mark and name. With `provider` set (a model row with a name), the name reads
+* `openai › gpt-5-mini`; `title` is the name either way.
+*/
+function BreakdownName({ mark, title, model }) {
+	return /* @__PURE__ */ jsxs("span", {
+		className: "flex min-w-0 items-center gap-2",
+		children: [mark, /* @__PURE__ */ jsx("span", {
+			className: "truncate",
+			title,
+			children: model ? /* @__PURE__ */ jsx(SegmentedName, { parts: modelNameParts(model.name, model.provider) }) : title
+		})]
+	});
+}
+export { BreakdownName };
+
+//# sourceMappingURL=breakdown-name.es.js.map

package/dist/domains/metrics/components/breakdown/breakdown-name.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"breakdown-name.es.js","names":[],"sources":["../../../../../src/domains/metrics/components/breakdown/breakdown-name.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport { modelNameParts } from '@/domains/llm';\nimport { SegmentedName } from '@/ds/components/SegmentedName';\n\n/**\n * A row's mark and name. With `provider` set (a model row with a name), the name reads\n * `openai › gpt-5-mini`; `title` is the name either way.\n */\nexport function BreakdownName({\n  mark,\n  title,\n  model,\n}: {\n  mark: ReactNode;\n  title: string;\n  model?: { name: string; provider: string | undefined };\n}) {\n  return (\n    <span className=\"flex min-w-0 items-center gap-2\">\n      {mark}\n      <span className=\"truncate\" title={title}>\n        {model ? <SegmentedName parts={modelNameParts(model.name, model.provider)} /> : title}\n      </span>\n    </span>\n  );\n}\n"],"mappings":";;;;;;;;AAQA,SAAgB,cAAc,EAC5B,MACA,OACA,SAKC;CACD,OACE,qBAAC,QAAD;EAAM,WAAU;EAAhB,UAAA,CACG,MACD,oBAAC,QAAD;GAAM,WAAU;GAAkB;GAC/B,UAAA,QAAQ,oBAAC,eAAD,EAAe,OAAO,eAAe,MAAM,MAAM,MAAM,QAAQ,EAAI,CAAA,IAAI;EAC5E,CAAA,CACF;;AAEV"}

package/dist/domains/metrics/components/breakdown/breakdown-not-priced.cjs.js

@@ -0,0 +1,13 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+let react_jsx_runtime = require("react/jsx-runtime");
+// src/domains/metrics/components/breakdown/breakdown-not-priced.tsx
+/** A figure without a price: said so rather than shown as $0. */
+function BreakdownNotPriced() {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		title: "No price for this model",
+		children: "Not priced"
+	});
+}
+exports.BreakdownNotPriced = BreakdownNotPriced;
+
+//# sourceMappingURL=breakdown-not-priced.cjs.js.map

package/dist/domains/metrics/components/breakdown/breakdown-not-priced.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"breakdown-not-priced.cjs.js","names":[],"sources":["../../../../../src/domains/metrics/components/breakdown/breakdown-not-priced.tsx"],"sourcesContent":["/** A figure without a price: said so rather than shown as $0. */\nexport function BreakdownNotPriced() {\n  return <span title=\"No price for this model\">Not priced</span>;\n}\n"],"mappings":";;;;AACA,SAAgB,qBAAqB;CACnC,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;EAAM,OAAM;EAA0B,UAAA;CAAgB,CAAA;AAC/D"}

package/dist/domains/metrics/components/breakdown/breakdown-not-priced.d.ts

@@ -0,0 +1 @@
+export * from '../../../../src/domains/metrics/components/breakdown/breakdown-not-priced';

package/dist/domains/metrics/components/breakdown/breakdown-not-priced.es.js

@@ -0,0 +1,12 @@
+import { jsx } from "react/jsx-runtime";
+// src/domains/metrics/components/breakdown/breakdown-not-priced.tsx
+/** A figure without a price: said so rather than shown as $0. */
+function BreakdownNotPriced() {
+	return /* @__PURE__ */ jsx("span", {
+		title: "No price for this model",
+		children: "Not priced"
+	});
+}
+export { BreakdownNotPriced };
+
+//# sourceMappingURL=breakdown-not-priced.es.js.map

package/dist/domains/metrics/components/breakdown/breakdown-not-priced.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"breakdown-not-priced.es.js","names":[],"sources":["../../../../../src/domains/metrics/components/breakdown/breakdown-not-priced.tsx"],"sourcesContent":["/** A figure without a price: said so rather than shown as $0. */\nexport function BreakdownNotPriced() {\n  return <span title=\"No price for this model\">Not priced</span>;\n}\n"],"mappings":";;;AACA,SAAgB,qBAAqB;CACnC,OAAO,oBAAC,QAAD;EAAM,OAAM;EAA0B,UAAA;CAAgB,CAAA;AAC/D"}

package/dist/domains/metrics/components/breakdown/breakdown-projects-first.cjs.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_domains_metrics_lib_breakdown = require("../../lib/breakdown.cjs.js");
 const require_domains_metrics_hooks_use_metrics_trace_aggregate = require("../../hooks/use-metrics-trace-aggregate.cjs.js");
+const require_domains_metrics_lib_breakdown = require("../../lib/breakdown.cjs.js");
 const require_domains_metrics_components_breakdown_breakdown_tab_body = require("./breakdown-tab-body.cjs.js");
 let react_jsx_runtime = require("react/jsx-runtime");
 // src/domains/metrics/components/breakdown/breakdown-projects-first.tsx

package/dist/domains/metrics/components/breakdown/breakdown-projects-first.es.js

@@ -1,5 +1,5 @@
-import { projectsAggregateRequest } from "../../lib/breakdown.es.js";
 import { useMetricsTraceAggregate } from "../../hooks/use-metrics-trace-aggregate.es.js";
+import { projectsAggregateRequest } from "../../lib/breakdown.es.js";
 import { BreakdownTabBody } from "./breakdown-tab-body.es.js";
 import { jsx } from "react/jsx-runtime";
 // src/domains/metrics/components/breakdown/breakdown-projects-first.tsx

package/dist/domains/metrics/components/breakdown/breakdown-row-mark.cjs.js

@@ -7,23 +7,36 @@ const require_components_SeriesMark = require("../../../../components/SeriesMark
 const require_domains_llm_provider_mark = require("../../../llm/provider-mark.cjs.js");
 let react_jsx_runtime = require("react/jsx-runtime");
 // src/domains/metrics/components/breakdown/breakdown-row-mark.tsx
-/** Tabs whose rows are one kind of entity, marked by its icon before each name. */
-var ENTITY_ICON = {
-	agents: require_icons_AgentIcon.AgentIcon,
-	workflows: require_icons_WorkflowIcon.WorkflowIcon,
-	tools: require_icons_ToolsIcon.ToolsIcon
+/** The entities a row can be, each marked by its icon before the name. */
+var ENTITY_ICONS = {
+	agent: require_icons_AgentIcon.AgentIcon,
+	workflow: require_icons_WorkflowIcon.WorkflowIcon,
+	tool: require_icons_ToolsIcon.ToolsIcon
 };
-/**
-* What a row is, before its name: the entity's icon (agents, workflows, tools), the model's
-* provider logo (a generic model icon when the usage names no provider), or nothing.
-*/
+/** Tabs whose rows are one kind of entity. */
+var TAB_ENTITY = {
+	agents: "agent",
+	workflows: "workflow",
+	tools: "tool"
+};
+function BreakdownEntityMark({ entity }) {
+	const Icon = ENTITY_ICONS[entity];
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_SeriesMark.SeriesMark, { icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(Icon, { className: "size-3" }) });
+}
+/** The model's provider logo; a generic model icon when the usage names no provider. */
+function BreakdownModelMark({ provider }) {
+	if (provider) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_domains_llm_provider_mark.ProviderMark, { provider });
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_SeriesMark.SeriesMark, { icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_icons_AiIcon.AiIcon, { className: "size-3" }) });
+}
+/** What a row is, before its name: the entity's icon (agents, workflows, tools), the model's provider, or nothing. */
 function BreakdownRowMark({ tab, row }) {
-	const EntityIcon = ENTITY_ICON[tab];
-	if (EntityIcon) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_SeriesMark.SeriesMark, { icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(EntityIcon, { className: "size-3" }) });
+	const entity = TAB_ENTITY[tab];
+	if (entity) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BreakdownEntityMark, { entity });
 	if (tab !== "models") return null;
-	if (row.provider) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_domains_llm_provider_mark.ProviderMark, { provider: row.provider });
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_SeriesMark.SeriesMark, { icon: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_icons_AiIcon.AiIcon, { className: "size-3" }) });
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(BreakdownModelMark, { provider: row.provider });
 }
+exports.BreakdownEntityMark = BreakdownEntityMark;
+exports.BreakdownModelMark = BreakdownModelMark;
 exports.BreakdownRowMark = BreakdownRowMark;
 
 //# sourceMappingURL=breakdown-row-mark.cjs.js.map

package/dist/domains/metrics/components/breakdown/breakdown-row-mark.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"breakdown-row-mark.cjs.js","names":["AgentIcon","WorkflowIcon","ToolsIcon","SeriesMark","ProviderMark","AiIcon"],"sources":["../../../../../src/domains/metrics/components/breakdown/breakdown-row-mark.tsx"],"sourcesContent":["import type { BreakdownRow, BreakdownTab } from '../../lib/breakdown';\nimport { ProviderMark } from '@/domains/llm';\nimport { SeriesMark } from '@/ds/components/SeriesMark';\nimport { AgentIcon, AiIcon, ToolsIcon, WorkflowIcon } from '@/ds/icons';\n\n/** Tabs whose rows are one kind of entity, marked by its icon before each name. */\nconst ENTITY_ICON: Partial<Record<BreakdownTab, typeof AgentIcon>> = {\n  agents: AgentIcon,\n  workflows: WorkflowIcon,\n  tools: ToolsIcon,\n};\n\n/**\n * What a row is, before its name: the entity's icon (agents, workflows, tools), the model's\n * provider logo (a generic model icon when the usage names no provider), or nothing.\n */\nexport function BreakdownRowMark({ tab, row }: { tab: BreakdownTab; row: BreakdownRow }) {\n  const EntityIcon = ENTITY_ICON[tab];\n  if (EntityIcon) return <SeriesMark icon={<EntityIcon className=\"size-3\" />} />;\n  if (tab !== 'models') return null;\n  if (row.provider) return <ProviderMark provider={row.provider} />;\n  return <SeriesMark icon={<AiIcon className=\"size-3\" />} />;\n}\n"],"mappings":";;;;;;;;;;AAMA,IAAM,cAA+D;CACnE,QAAQA,wBAAAA;CACR,WAAWC,2BAAAA;CACX,OAAOC,wBAAAA;AACT;;;;;AAMA,SAAgB,iBAAiB,EAAE,KAAK,OAAiD;CACvF,MAAM,aAAa,YAAY;CAC/B,IAAI,YAAY,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAACC,8BAAAA,YAAD,EAAY,MAAM,iBAAA,GAAA,kBAAA,IAAA,CAAC,YAAD,EAAY,WAAU,SAAU,CAAA,EAAI,CAAA;CAC7E,IAAI,QAAQ,UAAU,OAAO;CAC7B,IAAI,IAAI,UAAU,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAACC,kCAAAA,cAAD,EAAc,UAAU,IAAI,SAAW,CAAA;CAChE,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAACD,8BAAAA,YAAD,EAAY,MAAM,iBAAA,GAAA,kBAAA,IAAA,CAACE,qBAAAA,QAAD,EAAQ,WAAU,SAAU,CAAA,EAAI,CAAA;AAC3D"}
+{"version":3,"file":"breakdown-row-mark.cjs.js","names":["AgentIcon","WorkflowIcon","ToolsIcon","SeriesMark","ProviderMark","AiIcon"],"sources":["../../../../../src/domains/metrics/components/breakdown/breakdown-row-mark.tsx"],"sourcesContent":["import type { BreakdownRow, BreakdownTab } from '../../lib/breakdown';\nimport { ProviderMark } from '@/domains/llm';\nimport { SeriesMark } from '@/ds/components/SeriesMark';\nimport { AgentIcon, AiIcon, ToolsIcon, WorkflowIcon } from '@/ds/icons';\n\n/** The entities a row can be, each marked by its icon before the name. */\nconst ENTITY_ICONS = { agent: AgentIcon, workflow: WorkflowIcon, tool: ToolsIcon } as const;\nexport type MarkedEntity = keyof typeof ENTITY_ICONS;\n\n/** Tabs whose rows are one kind of entity. */\nconst TAB_ENTITY: Partial<Record<BreakdownTab, MarkedEntity>> = {\n  agents: 'agent',\n  workflows: 'workflow',\n  tools: 'tool',\n};\n\nexport function BreakdownEntityMark({ entity }: { entity: MarkedEntity }) {\n  const Icon = ENTITY_ICONS[entity];\n  return <SeriesMark icon={<Icon className=\"size-3\" />} />;\n}\n\n/** The model's provider logo; a generic model icon when the usage names no provider. */\nexport function BreakdownModelMark({ provider }: { provider: string | undefined }) {\n  if (provider) return <ProviderMark provider={provider} />;\n  return <SeriesMark icon={<AiIcon className=\"size-3\" />} />;\n}\n\n/** What a row is, before its name: the entity's icon (agents, workflows, tools), the model's provider, or nothing. */\nexport function BreakdownRowMark({ tab, row }: { tab: BreakdownTab; row: BreakdownRow }) {\n  const entity = TAB_ENTITY[tab];\n  if (entity) return <BreakdownEntityMark entity={entity} />;\n  if (tab !== 'models') return null;\n  return <BreakdownModelMark provider={row.provider} />;\n}\n"],"mappings":";;;;;;;;;;AAMA,IAAM,eAAe;CAAE,OAAOA,wBAAAA;CAAW,UAAUC,2BAAAA;CAAc,MAAMC,wBAAAA;AAAU;;AAIjF,IAAM,aAA0D;CAC9D,QAAQ;CACR,WAAW;CACX,OAAO;AACT;AAEA,SAAgB,oBAAoB,EAAE,UAAoC;CACxE,MAAM,OAAO,aAAa;CAC1B,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAACC,8BAAAA,YAAD,EAAY,MAAM,iBAAA,GAAA,kBAAA,IAAA,CAAC,MAAD,EAAM,WAAU,SAAU,CAAA,EAAI,CAAA;AACzD;;AAGA,SAAgB,mBAAmB,EAAE,YAA8C;CACjF,IAAI,UAAU,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAACC,kCAAAA,cAAD,EAAwB,SAAW,CAAA;CACxD,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAACD,8BAAAA,YAAD,EAAY,MAAM,iBAAA,GAAA,kBAAA,IAAA,CAACE,qBAAAA,QAAD,EAAQ,WAAU,SAAU,CAAA,EAAI,CAAA;AAC3D;;AAGA,SAAgB,iBAAiB,EAAE,KAAK,OAAiD;CACvF,MAAM,SAAS,WAAW;CAC1B,IAAI,QAAQ,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAAC,qBAAD,EAA6B,OAAS,CAAA;CACzD,IAAI,QAAQ,UAAU,OAAO;CAC7B,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAAC,oBAAD,EAAoB,UAAU,IAAI,SAAW,CAAA;AACtD"}

package/dist/domains/metrics/components/breakdown/breakdown-row-mark.es.js

@@ -6,23 +6,34 @@ import { SeriesMark } from "../../../../components/SeriesMark.es.js";
 import { ProviderMark } from "../../../llm/provider-mark.es.js";
 import { jsx } from "react/jsx-runtime";
 // src/domains/metrics/components/breakdown/breakdown-row-mark.tsx
-/** Tabs whose rows are one kind of entity, marked by its icon before each name. */
-var ENTITY_ICON = {
-	agents: AgentIcon,
-	workflows: WorkflowIcon,
-	tools: ToolsIcon
+/** The entities a row can be, each marked by its icon before the name. */
+var ENTITY_ICONS = {
+	agent: AgentIcon,
+	workflow: WorkflowIcon,
+	tool: ToolsIcon
 };
-/**
-* What a row is, before its name: the entity's icon (agents, workflows, tools), the model's
-* provider logo (a generic model icon when the usage names no provider), or nothing.
-*/
+/** Tabs whose rows are one kind of entity. */
+var TAB_ENTITY = {
+	agents: "agent",
+	workflows: "workflow",
+	tools: "tool"
+};
+function BreakdownEntityMark({ entity }) {
+	const Icon = ENTITY_ICONS[entity];
+	return /* @__PURE__ */ jsx(SeriesMark, { icon: /* @__PURE__ */ jsx(Icon, { className: "size-3" }) });
+}
+/** The model's provider logo; a generic model icon when the usage names no provider. */
+function BreakdownModelMark({ provider }) {
+	if (provider) return /* @__PURE__ */ jsx(ProviderMark, { provider });
+	return /* @__PURE__ */ jsx(SeriesMark, { icon: /* @__PURE__ */ jsx(AiIcon, { className: "size-3" }) });
+}
+/** What a row is, before its name: the entity's icon (agents, workflows, tools), the model's provider, or nothing. */
 function BreakdownRowMark({ tab, row }) {
-	const EntityIcon = ENTITY_ICON[tab];
-	if (EntityIcon) return /* @__PURE__ */ jsx(SeriesMark, { icon: /* @__PURE__ */ jsx(EntityIcon, { className: "size-3" }) });
+	const entity = TAB_ENTITY[tab];
+	if (entity) return /* @__PURE__ */ jsx(BreakdownEntityMark, { entity });
 	if (tab !== "models") return null;
-	if (row.provider) return /* @__PURE__ */ jsx(ProviderMark, { provider: row.provider });
-	return /* @__PURE__ */ jsx(SeriesMark, { icon: /* @__PURE__ */ jsx(AiIcon, { className: "size-3" }) });
+	return /* @__PURE__ */ jsx(BreakdownModelMark, { provider: row.provider });
 }
-export { BreakdownRowMark };
+export { BreakdownEntityMark, BreakdownModelMark, BreakdownRowMark };
 
 //# sourceMappingURL=breakdown-row-mark.es.js.map

package/dist/domains/metrics/components/breakdown/breakdown-row-mark.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"breakdown-row-mark.es.js","names":[],"sources":["../../../../../src/domains/metrics/components/breakdown/breakdown-row-mark.tsx"],"sourcesContent":["import type { BreakdownRow, BreakdownTab } from '../../lib/breakdown';\nimport { ProviderMark } from '@/domains/llm';\nimport { SeriesMark } from '@/ds/components/SeriesMark';\nimport { AgentIcon, AiIcon, ToolsIcon, WorkflowIcon } from '@/ds/icons';\n\n/** Tabs whose rows are one kind of entity, marked by its icon before each name. */\nconst ENTITY_ICON: Partial<Record<BreakdownTab, typeof AgentIcon>> = {\n  agents: AgentIcon,\n  workflows: WorkflowIcon,\n  tools: ToolsIcon,\n};\n\n/**\n * What a row is, before its name: the entity's icon (agents, workflows, tools), the model's\n * provider logo (a generic model icon when the usage names no provider), or nothing.\n */\nexport function BreakdownRowMark({ tab, row }: { tab: BreakdownTab; row: BreakdownRow }) {\n  const EntityIcon = ENTITY_ICON[tab];\n  if (EntityIcon) return <SeriesMark icon={<EntityIcon className=\"size-3\" />} />;\n  if (tab !== 'models') return null;\n  if (row.provider) return <ProviderMark provider={row.provider} />;\n  return <SeriesMark icon={<AiIcon className=\"size-3\" />} />;\n}\n"],"mappings":";;;;;;;;;AAMA,IAAM,cAA+D;CACnE,QAAQ;CACR,WAAW;CACX,OAAO;AACT;;;;;AAMA,SAAgB,iBAAiB,EAAE,KAAK,OAAiD;CACvF,MAAM,aAAa,YAAY;CAC/B,IAAI,YAAY,OAAO,oBAAC,YAAD,EAAY,MAAM,oBAAC,YAAD,EAAY,WAAU,SAAU,CAAA,EAAI,CAAA;CAC7E,IAAI,QAAQ,UAAU,OAAO;CAC7B,IAAI,IAAI,UAAU,OAAO,oBAAC,cAAD,EAAc,UAAU,IAAI,SAAW,CAAA;CAChE,OAAO,oBAAC,YAAD,EAAY,MAAM,oBAAC,QAAD,EAAQ,WAAU,SAAU,CAAA,EAAI,CAAA;AAC3D"}
+{"version":3,"file":"breakdown-row-mark.es.js","names":[],"sources":["../../../../../src/domains/metrics/components/breakdown/breakdown-row-mark.tsx"],"sourcesContent":["import type { BreakdownRow, BreakdownTab } from '../../lib/breakdown';\nimport { ProviderMark } from '@/domains/llm';\nimport { SeriesMark } from '@/ds/components/SeriesMark';\nimport { AgentIcon, AiIcon, ToolsIcon, WorkflowIcon } from '@/ds/icons';\n\n/** The entities a row can be, each marked by its icon before the name. */\nconst ENTITY_ICONS = { agent: AgentIcon, workflow: WorkflowIcon, tool: ToolsIcon } as const;\nexport type MarkedEntity = keyof typeof ENTITY_ICONS;\n\n/** Tabs whose rows are one kind of entity. */\nconst TAB_ENTITY: Partial<Record<BreakdownTab, MarkedEntity>> = {\n  agents: 'agent',\n  workflows: 'workflow',\n  tools: 'tool',\n};\n\nexport function BreakdownEntityMark({ entity }: { entity: MarkedEntity }) {\n  const Icon = ENTITY_ICONS[entity];\n  return <SeriesMark icon={<Icon className=\"size-3\" />} />;\n}\n\n/** The model's provider logo; a generic model icon when the usage names no provider. */\nexport function BreakdownModelMark({ provider }: { provider: string | undefined }) {\n  if (provider) return <ProviderMark provider={provider} />;\n  return <SeriesMark icon={<AiIcon className=\"size-3\" />} />;\n}\n\n/** What a row is, before its name: the entity's icon (agents, workflows, tools), the model's provider, or nothing. */\nexport function BreakdownRowMark({ tab, row }: { tab: BreakdownTab; row: BreakdownRow }) {\n  const entity = TAB_ENTITY[tab];\n  if (entity) return <BreakdownEntityMark entity={entity} />;\n  if (tab !== 'models') return null;\n  return <BreakdownModelMark provider={row.provider} />;\n}\n"],"mappings":";;;;;;;;;AAMA,IAAM,eAAe;CAAE,OAAO;CAAW,UAAU;CAAc,MAAM;AAAU;;AAIjF,IAAM,aAA0D;CAC9D,QAAQ;CACR,WAAW;CACX,OAAO;AACT;AAEA,SAAgB,oBAAoB,EAAE,UAAoC;CACxE,MAAM,OAAO,aAAa;CAC1B,OAAO,oBAAC,YAAD,EAAY,MAAM,oBAAC,MAAD,EAAM,WAAU,SAAU,CAAA,EAAI,CAAA;AACzD;;AAGA,SAAgB,mBAAmB,EAAE,YAA8C;CACjF,IAAI,UAAU,OAAO,oBAAC,cAAD,EAAwB,SAAW,CAAA;CACxD,OAAO,oBAAC,YAAD,EAAY,MAAM,oBAAC,QAAD,EAAQ,WAAU,SAAU,CAAA,EAAI,CAAA;AAC3D;;AAGA,SAAgB,iBAAiB,EAAE,KAAK,OAAiD;CACvF,MAAM,SAAS,WAAW;CAC1B,IAAI,QAAQ,OAAO,oBAAC,qBAAD,EAA6B,OAAS,CAAA;CACzD,IAAI,QAAQ,UAAU,OAAO;CAC7B,OAAO,oBAAC,oBAAD,EAAoB,UAAU,IAAI,SAAW,CAAA;AACtD"}

package/dist/domains/metrics/components/breakdown/breakdown-row-name.cjs.js

@@ -1,26 +1,23 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_domains_llm_model_name_parts = require("../../../llm/model-name-parts.cjs.js");
 const require_domains_metrics_lib_breakdown_table = require("../../lib/breakdown-table.cjs.js");
-const require_domains_metrics_hooks_use_metrics_scope = require("../../hooks/use-metrics-scope.cjs.js");
+const require_domains_metrics_components_breakdown_breakdown_name = require("./breakdown-name.cjs.js");
 const require_domains_metrics_components_breakdown_breakdown_row_mark = require("./breakdown-row-mark.cjs.js");
-const require_components_SegmentedName = require("../../../../components/SegmentedName.cjs.js");
+const require_domains_metrics_hooks_use_metrics_scope = require("../../hooks/use-metrics-scope.cjs.js");
 let react_jsx_runtime = require("react/jsx-runtime");
 // src/domains/metrics/components/breakdown/breakdown-row-name.tsx
 /** The row's mark and name; a model reads `openai › gpt-5-mini`. */
 function BreakdownRowName({ tab, row }) {
 	const { projectLabel } = require_domains_metrics_hooks_use_metrics_scope.useMetricsScope();
-	const name = require_domains_metrics_lib_breakdown_table.rowLabel(tab, row, projectLabel);
-	const segmented = tab === "models" && row.name !== "";
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
-		className: "flex min-w-0 items-center gap-2",
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_domains_metrics_components_breakdown_breakdown_row_mark.BreakdownRowMark, {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_domains_metrics_components_breakdown_breakdown_name.BreakdownName, {
+		mark: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_domains_metrics_components_breakdown_breakdown_row_mark.BreakdownRowMark, {
 			tab,
 			row
-		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-			className: "truncate",
-			title: name,
-			children: segmented ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_components_SegmentedName.SegmentedName, { parts: require_domains_llm_model_name_parts.modelNameParts(row.name, row.provider) }) : name
-		})]
+		}),
+		title: require_domains_metrics_lib_breakdown_table.rowLabel(tab, row, projectLabel),
+		model: tab === "models" && row.name !== "" ? {
+			name: row.name,
+			provider: row.provider
+		} : void 0
 	});
 }
 exports.BreakdownRowName = BreakdownRowName;

package/dist/domains/metrics/components/breakdown/breakdown-row-name.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"breakdown-row-name.cjs.js","names":["useMetricsScope","rowLabel","BreakdownRowMark","SegmentedName","modelNameParts"],"sources":["../../../../../src/domains/metrics/components/breakdown/breakdown-row-name.tsx"],"sourcesContent":["import { useMetricsScope } from '../../hooks/use-metrics-scope';\nimport type { BreakdownRow, BreakdownTab } from '../../lib/breakdown';\nimport { rowLabel } from '../../lib/breakdown-table';\nimport { BreakdownRowMark } from './breakdown-row-mark';\nimport { modelNameParts } from '@/domains/llm';\nimport { SegmentedName } from '@/ds/components/SegmentedName';\n\n/** The row's mark and name; a model reads `openai › gpt-5-mini`. */\nexport function BreakdownRowName({ tab, row }: { tab: BreakdownTab; row: BreakdownRow }) {\n  const { projectLabel } = useMetricsScope();\n  const name = rowLabel(tab, row, projectLabel);\n  const segmented = tab === 'models' && row.name !== '';\n  return (\n    <span className=\"flex min-w-0 items-center gap-2\">\n      <BreakdownRowMark tab={tab} row={row} />\n      <span className=\"truncate\" title={name}>\n        {segmented ? <SegmentedName parts={modelNameParts(row.name, row.provider)} /> : name}\n      </span>\n    </span>\n  );\n}\n"],"mappings":";;;;;;;;;AAQA,SAAgB,iBAAiB,EAAE,KAAK,OAAiD;CACvF,MAAM,EAAE,iBAAiBA,gDAAAA,gBAAgB;CACzC,MAAM,OAAOC,4CAAAA,SAAS,KAAK,KAAK,YAAY;CAC5C,MAAM,YAAY,QAAQ,YAAY,IAAI,SAAS;CACnD,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,QAAD;EAAM,WAAU;EAAhB,UAAA,CACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,gEAAAA,kBAAD;GAAuB;GAAU;EAAM,CAAA,GACvC,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;GAAM,WAAU;GAAW,OAAO;GAC/B,UAAA,YAAY,iBAAA,GAAA,kBAAA,IAAA,CAACC,iCAAAA,eAAD,EAAe,OAAOC,qCAAAA,eAAe,IAAI,MAAM,IAAI,QAAQ,EAAI,CAAA,IAAI;EAC5E,CAAA,CACF;;AAEV"}
+{"version":3,"file":"breakdown-row-name.cjs.js","names":["useMetricsScope","BreakdownName","BreakdownRowMark","rowLabel"],"sources":["../../../../../src/domains/metrics/components/breakdown/breakdown-row-name.tsx"],"sourcesContent":["import { useMetricsScope } from '../../hooks/use-metrics-scope';\nimport type { BreakdownRow, BreakdownTab } from '../../lib/breakdown';\nimport { rowLabel } from '../../lib/breakdown-table';\nimport { BreakdownName } from './breakdown-name';\nimport { BreakdownRowMark } from './breakdown-row-mark';\n\n/** The row's mark and name; a model reads `openai › gpt-5-mini`. */\nexport function BreakdownRowName({ tab, row }: { tab: BreakdownTab; row: BreakdownRow }) {\n  const { projectLabel } = useMetricsScope();\n  return (\n    <BreakdownName\n      mark={<BreakdownRowMark tab={tab} row={row} />}\n      title={rowLabel(tab, row, projectLabel)}\n      model={tab === 'models' && row.name !== '' ? { name: row.name, provider: row.provider } : undefined}\n    />\n  );\n}\n"],"mappings":";;;;;;;;AAOA,SAAgB,iBAAiB,EAAE,KAAK,OAAiD;CACvF,MAAM,EAAE,iBAAiBA,gDAAAA,gBAAgB;CACzC,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,4DAAAA,eAAD;EACE,MAAM,iBAAA,GAAA,kBAAA,IAAA,CAACC,gEAAAA,kBAAD;GAAuB;GAAU;EAAM,CAAA;EAC7C,OAAOC,4CAAAA,SAAS,KAAK,KAAK,YAAY;EACtC,OAAO,QAAQ,YAAY,IAAI,SAAS,KAAK;GAAE,MAAM,IAAI;GAAM,UAAU,IAAI;EAAS,IAAI,KAAA;CAC3F,CAAA;AAEL"}

package/dist/domains/metrics/components/breakdown/breakdown-row-name.es.js

@@ -1,25 +1,22 @@
-import { modelNameParts } from "../../../llm/model-name-parts.es.js";
 import { rowLabel } from "../../lib/breakdown-table.es.js";
-import { useMetricsScope } from "../../hooks/use-metrics-scope.es.js";
+import { BreakdownName } from "./breakdown-name.es.js";
 import { BreakdownRowMark } from "./breakdown-row-mark.es.js";
-import { SegmentedName } from "../../../../components/SegmentedName.es.js";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { useMetricsScope } from "../../hooks/use-metrics-scope.es.js";
+import { jsx } from "react/jsx-runtime";
 // src/domains/metrics/components/breakdown/breakdown-row-name.tsx
 /** The row's mark and name; a model reads `openai › gpt-5-mini`. */
 function BreakdownRowName({ tab, row }) {
 	const { projectLabel } = useMetricsScope();
-	const name = rowLabel(tab, row, projectLabel);
-	const segmented = tab === "models" && row.name !== "";
-	return /* @__PURE__ */ jsxs("span", {
-		className: "flex min-w-0 items-center gap-2",
-		children: [/* @__PURE__ */ jsx(BreakdownRowMark, {
+	return /* @__PURE__ */ jsx(BreakdownName, {
+		mark: /* @__PURE__ */ jsx(BreakdownRowMark, {
 			tab,
 			row
-		}), /* @__PURE__ */ jsx("span", {
-			className: "truncate",
-			title: name,
-			children: segmented ? /* @__PURE__ */ jsx(SegmentedName, { parts: modelNameParts(row.name, row.provider) }) : name
-		})]
+		}),
+		title: rowLabel(tab, row, projectLabel),
+		model: tab === "models" && row.name !== "" ? {
+			name: row.name,
+			provider: row.provider
+		} : void 0
 	});
 }
 export { BreakdownRowName };

package/dist/domains/metrics/components/breakdown/breakdown-row-name.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"breakdown-row-name.es.js","names":[],"sources":["../../../../../src/domains/metrics/components/breakdown/breakdown-row-name.tsx"],"sourcesContent":["import { useMetricsScope } from '../../hooks/use-metrics-scope';\nimport type { BreakdownRow, BreakdownTab } from '../../lib/breakdown';\nimport { rowLabel } from '../../lib/breakdown-table';\nimport { BreakdownRowMark } from './breakdown-row-mark';\nimport { modelNameParts } from '@/domains/llm';\nimport { SegmentedName } from '@/ds/components/SegmentedName';\n\n/** The row's mark and name; a model reads `openai › gpt-5-mini`. */\nexport function BreakdownRowName({ tab, row }: { tab: BreakdownTab; row: BreakdownRow }) {\n  const { projectLabel } = useMetricsScope();\n  const name = rowLabel(tab, row, projectLabel);\n  const segmented = tab === 'models' && row.name !== '';\n  return (\n    <span className=\"flex min-w-0 items-center gap-2\">\n      <BreakdownRowMark tab={tab} row={row} />\n      <span className=\"truncate\" title={name}>\n        {segmented ? <SegmentedName parts={modelNameParts(row.name, row.provider)} /> : name}\n      </span>\n    </span>\n  );\n}\n"],"mappings":";;;;;;;;AAQA,SAAgB,iBAAiB,EAAE,KAAK,OAAiD;CACvF,MAAM,EAAE,iBAAiB,gBAAgB;CACzC,MAAM,OAAO,SAAS,KAAK,KAAK,YAAY;CAC5C,MAAM,YAAY,QAAQ,YAAY,IAAI,SAAS;CACnD,OACE,qBAAC,QAAD;EAAM,WAAU;EAAhB,UAAA,CACE,oBAAC,kBAAD;GAAuB;GAAU;EAAM,CAAA,GACvC,oBAAC,QAAD;GAAM,WAAU;GAAW,OAAO;GAC/B,UAAA,YAAY,oBAAC,eAAD,EAAe,OAAO,eAAe,IAAI,MAAM,IAAI,QAAQ,EAAI,CAAA,IAAI;EAC5E,CAAA,CACF;;AAEV"}
+{"version":3,"file":"breakdown-row-name.es.js","names":[],"sources":["../../../../../src/domains/metrics/components/breakdown/breakdown-row-name.tsx"],"sourcesContent":["import { useMetricsScope } from '../../hooks/use-metrics-scope';\nimport type { BreakdownRow, BreakdownTab } from '../../lib/breakdown';\nimport { rowLabel } from '../../lib/breakdown-table';\nimport { BreakdownName } from './breakdown-name';\nimport { BreakdownRowMark } from './breakdown-row-mark';\n\n/** The row's mark and name; a model reads `openai › gpt-5-mini`. */\nexport function BreakdownRowName({ tab, row }: { tab: BreakdownTab; row: BreakdownRow }) {\n  const { projectLabel } = useMetricsScope();\n  return (\n    <BreakdownName\n      mark={<BreakdownRowMark tab={tab} row={row} />}\n      title={rowLabel(tab, row, projectLabel)}\n      model={tab === 'models' && row.name !== '' ? { name: row.name, provider: row.provider } : undefined}\n    />\n  );\n}\n"],"mappings":";;;;;;;AAOA,SAAgB,iBAAiB,EAAE,KAAK,OAAiD;CACvF,MAAM,EAAE,iBAAiB,gBAAgB;CACzC,OACE,oBAAC,eAAD;EACE,MAAM,oBAAC,kBAAD;GAAuB;GAAU;EAAM,CAAA;EAC7C,OAAO,SAAS,KAAK,KAAK,YAAY;EACtC,OAAO,QAAQ,YAAY,IAAI,SAAS,KAAK;GAAE,MAAM,IAAI;GAAM,UAAU,IAAI;EAAS,IAAI,KAAA;CAC3F,CAAA;AAEL"}

package/dist/domains/metrics/components/breakdown/breakdown-tab-body.cjs.js

@@ -1,5 +1,5 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_MetricsCard = require("../../../../MetricsCard-Dly_H3oX.cjs");
+const require_MetricsCard = require("../../../../MetricsCard-CEB-f2sv.cjs");
 const require_domains_metrics_lib_breakdown = require("../../lib/breakdown.cjs.js");
 const require_domains_metrics_components_breakdown_breakdown_frame = require("./breakdown-frame.cjs.js");
 const require_domains_metrics_components_breakdown_breakdown_entity_tab = require("./breakdown-entity-tab.cjs.js");

package/dist/domains/metrics/components/breakdown/breakdown-tab-body.es.js

@@ -1,4 +1,4 @@
-import { t as MetricsCard } from "../../../../MetricsCard-C9GWgT58.js";
+import { t as MetricsCard } from "../../../../MetricsCard-M8awJ2B_.js";
 import { isEntityTab } from "../../lib/breakdown.es.js";
 import { BreakdownFrame } from "./breakdown-frame.es.js";
 import { BreakdownEntityTab } from "./breakdown-entity-tab.es.js";

package/dist/domains/metrics/components/breakdown/breakdown-table.cjs.js

@@ -5,15 +5,15 @@ const require_domains_metrics_components_chart_area = require("../chart-area.cjs
 const require_domains_metrics_components_chart_card_error = require("../chart-card-error.cjs.js");
 const require_domains_metrics_lib_breakdown = require("../../lib/breakdown.cjs.js");
 const require_domains_metrics_lib_breakdown_table = require("../../lib/breakdown-table.cjs.js");
-const require_domains_metrics_components_breakdown_breakdown_change_cell = require("./breakdown-change-cell.cjs.js");
 const require_domains_metrics_components_breakdown_breakdown_change_description = require("./breakdown-change-description.cjs.js");
-const require_domains_metrics_components_breakdown_breakdown_cost_cell = require("./breakdown-cost-cell.cjs.js");
-const require_domains_metrics_hooks_use_metrics_scope = require("../../hooks/use-metrics-scope.cjs.js");
 const require_domains_metrics_components_breakdown_breakdown_figure = require("./breakdown-figure.cjs.js");
-const require_domains_metrics_components_breakdown_breakdown_frame = require("./breakdown-frame.cjs.js");
-const require_domains_metrics_components_breakdown_breakdown_row_name = require("./breakdown-row-name.cjs.js");
 const require_domains_metrics_components_breakdown_breakdown_text = require("./breakdown-text.cjs.js");
+const require_domains_metrics_hooks_use_metrics_scope = require("../../hooks/use-metrics-scope.cjs.js");
 const require_MetricsTable = require("../../../../MetricsTable-D-aZf3dk.cjs");
+const require_domains_metrics_components_breakdown_breakdown_change_cell = require("./breakdown-change-cell.cjs.js");
+const require_domains_metrics_components_breakdown_breakdown_cost_cell = require("./breakdown-cost-cell.cjs.js");
+const require_domains_metrics_components_breakdown_breakdown_frame = require("./breakdown-frame.cjs.js");
+const require_domains_metrics_components_breakdown_breakdown_row_name = require("./breakdown-row-name.cjs.js");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
 // src/domains/metrics/components/breakdown/breakdown-table.tsx

package/dist/domains/metrics/components/breakdown/breakdown-table.es.js

@@ -4,15 +4,15 @@ import { ChartArea } from "../chart-area.es.js";
 import { ChartCardError } from "../chart-card-error.es.js";
 import { buildBreakdownRows, hasErrors, previousFigures, rowChange, threadResources } from "../../lib/breakdown.es.js";
 import { comparedLabel, countDescription, drilldownFor, isChangeMetric, showsProject, tableRows, volumeLabel } from "../../lib/breakdown-table.es.js";
-import { BreakdownChangeCell } from "./breakdown-change-cell.es.js";
 import { BreakdownChangeDescription } from "./breakdown-change-description.es.js";
-import { BreakdownCostCell } from "./breakdown-cost-cell.es.js";
-import { useMetricsScope } from "../../hooks/use-metrics-scope.es.js";
 import { BreakdownFigure } from "./breakdown-figure.es.js";
-import { BreakdownFrame } from "./breakdown-frame.es.js";
-import { BreakdownRowName } from "./breakdown-row-name.es.js";
 import { BreakdownText } from "./breakdown-text.es.js";
+import { useMetricsScope } from "../../hooks/use-metrics-scope.es.js";
 import { t as MetricsTable } from "../../../../MetricsTable-CRPeLHe1.js";
+import { BreakdownChangeCell } from "./breakdown-change-cell.es.js";
+import { BreakdownCostCell } from "./breakdown-cost-cell.es.js";
+import { BreakdownFrame } from "./breakdown-frame.es.js";
+import { BreakdownRowName } from "./breakdown-row-name.es.js";
 import { useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 // src/domains/metrics/components/breakdown/breakdown-table.tsx

package/dist/domains/metrics/components/breakdown/breakdown-trace-tab.cjs.js

@@ -1,10 +1,10 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_domains_metrics_lib_request_limiter = require("../../lib/request-limiter.cjs.js");
+const require_domains_metrics_hooks_use_metrics_trace_aggregate = require("../../hooks/use-metrics-trace-aggregate.cjs.js");
 const require_domains_metrics_lib_breakdown = require("../../lib/breakdown.cjs.js");
 const require_domains_metrics_lib_breakdown_table = require("../../lib/breakdown-table.cjs.js");
 const require_domains_metrics_hooks_use_metrics_usage_totals = require("../../hooks/use-metrics-usage-totals.cjs.js");
 const require_domains_metrics_components_breakdown_breakdown_table = require("./breakdown-table.cjs.js");
-const require_domains_metrics_hooks_use_metrics_trace_aggregate = require("../../hooks/use-metrics-trace-aggregate.cjs.js");
 let react_jsx_runtime = require("react/jsx-runtime");
 // src/domains/metrics/components/breakdown/breakdown-trace-tab.tsx
 /** Projects, environments or threads: traces from trace aggregates. */

package/dist/domains/metrics/components/breakdown/breakdown-trace-tab.es.js

@@ -1,9 +1,9 @@
 import { AGGREGATE_PRIORITY } from "../../lib/request-limiter.es.js";
+import { useMetricsTraceAggregate } from "../../hooks/use-metrics-trace-aggregate.es.js";
 import { BREAKDOWN_GROUP_LIMIT, breakdownGroupBy, threadResourcesRequest, traceTabRequest } from "../../lib/breakdown.es.js";
 import { previousScope } from "../../lib/breakdown-table.es.js";
 import { useMetricsUsageTotals } from "../../hooks/use-metrics-usage-totals.es.js";
 import { BreakdownTable } from "./breakdown-table.es.js";
-import { useMetricsTraceAggregate } from "../../hooks/use-metrics-trace-aggregate.es.js";
 import { jsx } from "react/jsx-runtime";
 // src/domains/metrics/components/breakdown/breakdown-trace-tab.tsx
 /** Projects, environments or threads: traces from trace aggregates. */

package/dist/domains/metrics/components/breakdown/breakdown-trend-text.cjs.js

@@ -0,0 +1,25 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+require("../../lib/breakdown-table.cjs.js");
+let react_jsx_runtime = require("react/jsx-runtime");
+// src/domains/metrics/components/breakdown/breakdown-trend-text.tsx
+var TREND_CLASS = {
+	good: "text-badge-green-foreground",
+	bad: "text-badge-red-foreground"
+};
+/**
+* A change, green when it's good news and red when it's bad; without one, a muted dash. The cell sits
+* in the list's main column, so a flat change is muted too.
+*/
+function BreakdownTrendText({ trend, children }) {
+	if (children === void 0) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		className: "text-muted-foreground",
+		children: "—"
+	});
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+		className: trend ? TREND_CLASS[trend] : "text-muted-foreground",
+		children
+	});
+}
+exports.BreakdownTrendText = BreakdownTrendText;
+
+//# sourceMappingURL=breakdown-trend-text.cjs.js.map

package/dist/domains/metrics/components/breakdown/breakdown-trend-text.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"breakdown-trend-text.cjs.js","names":[],"sources":["../../../../../src/domains/metrics/components/breakdown/breakdown-trend-text.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport { DASH } from '../../lib/breakdown-table';\n\nconst TREND_CLASS = { good: 'text-badge-green-foreground', bad: 'text-badge-red-foreground' } as const;\n\n/**\n * A change, green when it's good news and red when it's bad; without one, a muted dash. The cell sits\n * in the list's main column, so a flat change is muted too.\n */\nexport function BreakdownTrendText({ trend, children }: { trend: 'good' | 'bad' | undefined; children?: ReactNode }) {\n  if (children === undefined) return <span className=\"text-muted-foreground\">{DASH}</span>;\n  return <span className={trend ? TREND_CLASS[trend] : 'text-muted-foreground'}>{children}</span>;\n}\n"],"mappings":";;;;AAGA,IAAM,cAAc;CAAE,MAAM;CAA+B,KAAK;AAA4B;;;;;AAM5F,SAAgB,mBAAmB,EAAE,OAAO,YAAyE;CACnH,IAAI,aAAa,KAAA,GAAW,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;EAAM,WAAU;EAAyB,UAAA;CAAW,CAAA;CACvF,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;EAAM,WAAW,QAAQ,YAAY,SAAS;EAA0B;CAAe,CAAA;AAChG"}