@mastra/playground-ui 68.0.0-alpha.2 → 68.0.0

package/dist/domains/dashboards/components/dashboard-renderer.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"dashboard-renderer.es.js","names":[],"sources":["../../../../src/domains/dashboards/components/dashboard-renderer.tsx"],"sourcesContent":["import type { DashboardDefinition } from '@mastra/client-js';\nimport {\n  DASHBOARD_WIDGET_SPANS,\n  dashboardDefinitionEnvelopeSchema,\n  migrateDashboardDefinition,\n} from '@mastra/core/storage/dashboards';\nimport { useMetrics } from '../../metrics/hooks/use-metrics';\nimport { BUILT_IN_WIDGET_KINDS } from '../kinds';\nimport type { DashboardScope, OnDashboardDrilldown } from '../lib/definition';\nimport { describeIssue, prepareWidget } from '../lib/prepare-widget';\nimport type { PreparedWidget, StoredWidget } from '../lib/prepare-widget';\nimport type { AnyWidgetKind } from '../widget-kind';\nimport { DashboardGrid, DashboardGridCell, DashboardGridRow } from './dashboard-grid';\nimport type { DashboardSpan } from './dashboard-grid';\nimport { WidgetError } from './widget-error';\nimport { ErrorBoundary } from '@/ds/components/ErrorBoundary';\nimport { MetricsCard } from '@/ds/components/MetricsCard';\n\nexport type DashboardRendererProps = {\n  definition: DashboardDefinition;\n  /** Which widgets, views and columns show: `org` spans several projects, `project` is one. */\n  scope: DashboardScope;\n  /** Opens a drilldown; each host routes to its own Traces or Logs page. */\n  onDrilldown?: OnDashboardDrilldown;\n  /** Kinds beyond the built-in ones; a kind of the same name replaces the built-in. */\n  kinds?: AnyWidgetKind[];\n  className?: string;\n};\n\n/** Whether a stored widget's `span` is one the grid lays out. */\nconst isDashboardSpan = (span: unknown): span is DashboardSpan => DASHBOARD_WIDGET_SPANS.some(s => s === span);\ntype ShownCell = { widget: StoredWidget; prepared: Exclude<PreparedWidget, { ok: 'hidden' }> };\nconst isShown = (cell: { widget: StoredWidget; prepared: PreparedWidget }): cell is ShownCell =>\n  cell.prepared.ok !== 'hidden';\n\nconst spanOf = (widget: StoredWidget) => (isDashboardSpan(widget.span) ? widget.span : 12);\n\n/**\n * Lays a dashboard definition out on a 12-column grid inside the page's `MetricsProvider`, which\n * owns the range and filters. Each widget is checked and rendered on its own: one that fails to\n * parse, query or render shows its own error, and the rest of the dashboard still renders.\n */\nexport function DashboardRenderer({ definition, scope, onDrilldown, kinds = [], className }: DashboardRendererProps) {\n  // A widget that threw renders again once the page's range or filters change, or the widget does.\n  const { datePreset, customRange, filterTokens } = useMetrics();\n  const pageKey = JSON.stringify([datePreset, customRange, filterTokens]);\n  const registry = new Map([...BUILT_IN_WIDGET_KINDS, ...kinds].map(k => [k.kind, k]));\n\n  const envelope = dashboardDefinitionEnvelopeSchema.safeParse(definition);\n  if (!envelope.success) {\n    return <MetricsCard.Error message={`This dashboard can't be shown. ${describeIssue(envelope.error.issues[0])}`} />;\n  }\n  // Each widget is parsed on its own below, so one that doesn't fit the current version shows its own error.\n  const { rows } = migrateDashboardDefinition(envelope.data);\n\n  // A row whose widgets are all hidden on this page isn't drawn, so it leaves no gap in the grid.\n  const shown = rows\n    .map((row, rowIndex) => ({\n      rowIndex,\n      widgets: row.widgets\n        .map(widget => ({ widget, prepared: prepareWidget(widget, registry, scope) }))\n        .filter(isShown),\n    }))\n    .filter(row => row.widgets.length > 0);\n\n  return (\n    <DashboardGrid className={className}>\n      {shown.map(({ rowIndex, widgets }) => (\n        <DashboardGridRow key={rowIndex}>\n          {widgets.map(({ widget, prepared }) => {\n            // Unparsed, the title may be anything; the error card shows it only when it's text.\n            const heading = { id: widget.id, title: typeof widget.title === 'string' ? widget.title : undefined };\n            return (\n              <DashboardGridCell key={widget.id} id={widget.id} span={spanOf(widget)}>\n                <ErrorBoundary\n                  resetKeys={[pageKey, JSON.stringify(widget)]}\n                  variant=\"inline\"\n                  fallback={({ error }) => <WidgetError widget={heading} message={error.message} />}\n                >\n                  {prepared.ok ? (\n                    <prepared.kind.component\n                      widget={prepared.widget}\n                      views={prepared.views}\n                      scope={scope}\n                      onDrilldown={onDrilldown}\n                    />\n                  ) : (\n                    <WidgetError widget={heading} message={prepared.message} />\n                  )}\n                </ErrorBoundary>\n              </DashboardGridCell>\n            );\n          })}\n        </DashboardGridRow>\n      ))}\n    </DashboardGrid>\n  );\n}\n"],"mappings":";;;;;;;;;;;AA8BA,IAAM,mBAAmB,SAAyC,uBAAuB,MAAK,MAAK,MAAM,IAAI;AAE7G,IAAM,WAAW,SACf,KAAK,SAAS,OAAO;AAEvB,IAAM,UAAU,WAA0B,gBAAgB,OAAO,IAAI,IAAI,OAAO,OAAO;;;;;;AAOvF,SAAgB,kBAAkB,EAAE,YAAY,OAAO,aAAa,QAAQ,CAAC,GAAG,aAAqC;CAEnH,MAAM,EAAE,YAAY,aAAa,iBAAiB,WAAW;CAC7D,MAAM,UAAU,KAAK,UAAU;EAAC;EAAY;EAAa;CAAY,CAAC;CACtE,MAAM,WAAW,IAAI,IAAI,CAAC,GAAG,uBAAuB,GAAG,KAAK,CAAC,CAAC,KAAI,MAAK,CAAC,EAAE,MAAM,CAAC,CAAC,CAAC;CAEnF,MAAM,WAAW,kCAAkC,UAAU,UAAU;CACvE,IAAI,CAAC,SAAS,SACZ,OAAO,oBAAC,YAAY,OAAb,EAAmB,SAAS,kCAAkC,cAAc,SAAS,MAAM,OAAO,EAAE,IAAM,CAAA;CAGnH,MAAM,EAAE,SAAS,2BAA2B,SAAS,IAAI;CAGzD,MAAM,QAAQ,KACX,KAAK,KAAK,cAAc;EACvB;EACA,SAAS,IAAI,QACV,KAAI,YAAW;GAAE;GAAQ,UAAU,cAAc,QAAQ,UAAU,KAAK;EAAE,EAAE,CAAC,CAC7E,OAAO,OAAO;CACnB,EAAE,CAAC,CACF,QAAO,QAAO,IAAI,QAAQ,SAAS,CAAC;CAEvC,OACE,oBAAC,eAAD;EAA0B;EACvB,UAAA,MAAM,KAAK,EAAE,UAAU,cACtB,oBAAC,kBAAD,EAAA,UACG,QAAQ,KAAK,EAAE,QAAQ,eAAe;GAErC,MAAM,UAAU;IAAE,IAAI,OAAO;IAAI,OAAO,OAAO,OAAO,UAAU,WAAW,OAAO,QAAQ,KAAA;GAAU;GACpG,OACE,oBAAC,mBAAD;IAAmC,IAAI,OAAO;IAAI,MAAM,OAAO,MAAM;IACnE,UAAA,oBAAC,eAAD;KACE,WAAW,CAAC,SAAS,KAAK,UAAU,MAAM,CAAC;KAC3C,SAAQ;KACR,WAAW,EAAE,YAAY,oBAAC,aAAD;MAAa,QAAQ;MAAS,SAAS,MAAM;KAAU,CAAA;KAE/E,UAAA,SAAS,KACR,oBAAC,SAAS,KAAK,WAAf;MACE,QAAQ,SAAS;MACjB,OAAO,SAAS;MACT;MACM;KACd,CAAA,IAED,oBAAC,aAAD;MAAa,QAAQ;MAAS,SAAS,SAAS;KAAU,CAAA;IAE/C,CAAA;GACE,GAjBK,OAAO,EAiBZ;EAEvB,CAAC,EACe,GAzBK,QAyBL,CACnB;CACY,CAAA;AAEnB"}
+{"version":3,"file":"dashboard-renderer.es.js","names":[],"sources":["../../../../src/domains/dashboards/components/dashboard-renderer.tsx"],"sourcesContent":["import type { DashboardDefinition } from '@mastra/client-js';\nimport {\n  DASHBOARD_WIDGET_SPANS,\n  dashboardDefinitionEnvelopeSchema,\n  migrateDashboardDefinition,\n} from '@mastra/core/storage/dashboards';\nimport { useMetrics } from '../../metrics/hooks/use-metrics';\nimport { BUILT_IN_WIDGET_KINDS } from '../kinds';\nimport type { DashboardScope, OnDashboardDrilldown } from '../lib/definition';\nimport { describeIssue, prepareWidget } from '../lib/prepare-widget';\nimport type { PreparedWidget, StoredWidget } from '../lib/prepare-widget';\nimport type { AnyWidgetKind, DashboardExpand } from '../widget-kind';\nimport { DashboardGrid, DashboardGridCell, DashboardGridRow } from './dashboard-grid';\nimport type { DashboardSpan } from './dashboard-grid';\nimport { WidgetError } from './widget-error';\nimport { ErrorBoundary } from '@/ds/components/ErrorBoundary';\nimport { MetricsCard } from '@/ds/components/MetricsCard';\n\nexport type DashboardRendererProps = {\n  definition: DashboardDefinition;\n  /** Which widgets, views and columns show: `org` spans several projects, `project` is one. */\n  scope: DashboardScope;\n  /** Opens a drilldown; each host routes to its own Traces or Logs page. */\n  onDrilldown?: OnDashboardDrilldown;\n  /** Where chart cards expand to, e.g. the host's query page; see `DashboardExpand`. */\n  expand?: DashboardExpand;\n  /** Kinds beyond the built-in ones; a kind of the same name replaces the built-in. */\n  kinds?: AnyWidgetKind[];\n  className?: string;\n};\n\n/** Whether a stored widget's `span` is one the grid lays out. */\nconst isDashboardSpan = (span: unknown): span is DashboardSpan => DASHBOARD_WIDGET_SPANS.some(s => s === span);\ntype ShownCell = { widget: StoredWidget; prepared: Exclude<PreparedWidget, { ok: 'hidden' }> };\nconst isShown = (cell: { widget: StoredWidget; prepared: PreparedWidget }): cell is ShownCell =>\n  cell.prepared.ok !== 'hidden';\n\nconst spanOf = (widget: StoredWidget) => (isDashboardSpan(widget.span) ? widget.span : 12);\n\n/**\n * Lays a dashboard definition out on a 12-column grid inside the page's `MetricsProvider`, which\n * owns the range and filters. Each widget is checked and rendered on its own: one that fails to\n * parse, query or render shows its own error, and the rest of the dashboard still renders.\n */\nexport function DashboardRenderer({\n  definition,\n  scope,\n  onDrilldown,\n  expand,\n  kinds = [],\n  className,\n}: DashboardRendererProps) {\n  // A widget that threw renders again once the page's range or filters change, or the widget does.\n  const { datePreset, customRange, filterTokens } = useMetrics();\n  const pageKey = JSON.stringify([datePreset, customRange, filterTokens]);\n  const registry = new Map([...BUILT_IN_WIDGET_KINDS, ...kinds].map(k => [k.kind, k]));\n\n  const envelope = dashboardDefinitionEnvelopeSchema.safeParse(definition);\n  if (!envelope.success) {\n    return <MetricsCard.Error message={`This dashboard can't be shown. ${describeIssue(envelope.error.issues[0])}`} />;\n  }\n  // Each widget is parsed on its own below, so one that doesn't fit the current version shows its own error.\n  const { rows } = migrateDashboardDefinition(envelope.data);\n\n  // A row whose widgets are all hidden on this page isn't drawn, so it leaves no gap in the grid.\n  const shown = rows\n    .map((row, rowIndex) => ({\n      rowIndex,\n      widgets: row.widgets\n        .map(widget => ({ widget, prepared: prepareWidget(widget, registry, scope) }))\n        .filter(isShown),\n    }))\n    .filter(row => row.widgets.length > 0);\n\n  return (\n    <DashboardGrid className={className}>\n      {shown.map(({ rowIndex, widgets }) => (\n        <DashboardGridRow key={rowIndex}>\n          {widgets.map(({ widget, prepared }) => {\n            // Unparsed, the title may be anything; the error card shows it only when it's text.\n            const heading = { id: widget.id, title: typeof widget.title === 'string' ? widget.title : undefined };\n            return (\n              <DashboardGridCell key={widget.id} id={widget.id} span={spanOf(widget)}>\n                <ErrorBoundary\n                  resetKeys={[pageKey, JSON.stringify(widget)]}\n                  variant=\"inline\"\n                  fallback={({ error }) => <WidgetError widget={heading} message={error.message} />}\n                >\n                  {prepared.ok ? (\n                    <prepared.kind.component\n                      widget={prepared.widget}\n                      views={prepared.views}\n                      scope={scope}\n                      onDrilldown={onDrilldown}\n                      expand={expand}\n                    />\n                  ) : (\n                    <WidgetError widget={heading} message={prepared.message} />\n                  )}\n                </ErrorBoundary>\n              </DashboardGridCell>\n            );\n          })}\n        </DashboardGridRow>\n      ))}\n    </DashboardGrid>\n  );\n}\n"],"mappings":";;;;;;;;;;;AAgCA,IAAM,mBAAmB,SAAyC,uBAAuB,MAAK,MAAK,MAAM,IAAI;AAE7G,IAAM,WAAW,SACf,KAAK,SAAS,OAAO;AAEvB,IAAM,UAAU,WAA0B,gBAAgB,OAAO,IAAI,IAAI,OAAO,OAAO;;;;;;AAOvF,SAAgB,kBAAkB,EAChC,YACA,OACA,aACA,QACA,QAAQ,CAAC,GACT,aACyB;CAEzB,MAAM,EAAE,YAAY,aAAa,iBAAiB,WAAW;CAC7D,MAAM,UAAU,KAAK,UAAU;EAAC;EAAY;EAAa;CAAY,CAAC;CACtE,MAAM,WAAW,IAAI,IAAI,CAAC,GAAG,uBAAuB,GAAG,KAAK,CAAC,CAAC,KAAI,MAAK,CAAC,EAAE,MAAM,CAAC,CAAC,CAAC;CAEnF,MAAM,WAAW,kCAAkC,UAAU,UAAU;CACvE,IAAI,CAAC,SAAS,SACZ,OAAO,oBAAC,YAAY,OAAb,EAAmB,SAAS,kCAAkC,cAAc,SAAS,MAAM,OAAO,EAAE,IAAM,CAAA;CAGnH,MAAM,EAAE,SAAS,2BAA2B,SAAS,IAAI;CAGzD,MAAM,QAAQ,KACX,KAAK,KAAK,cAAc;EACvB;EACA,SAAS,IAAI,QACV,KAAI,YAAW;GAAE;GAAQ,UAAU,cAAc,QAAQ,UAAU,KAAK;EAAE,EAAE,CAAC,CAC7E,OAAO,OAAO;CACnB,EAAE,CAAC,CACF,QAAO,QAAO,IAAI,QAAQ,SAAS,CAAC;CAEvC,OACE,oBAAC,eAAD;EAA0B;EACvB,UAAA,MAAM,KAAK,EAAE,UAAU,cACtB,oBAAC,kBAAD,EAAA,UACG,QAAQ,KAAK,EAAE,QAAQ,eAAe;GAErC,MAAM,UAAU;IAAE,IAAI,OAAO;IAAI,OAAO,OAAO,OAAO,UAAU,WAAW,OAAO,QAAQ,KAAA;GAAU;GACpG,OACE,oBAAC,mBAAD;IAAmC,IAAI,OAAO;IAAI,MAAM,OAAO,MAAM;IACnE,UAAA,oBAAC,eAAD;KACE,WAAW,CAAC,SAAS,KAAK,UAAU,MAAM,CAAC;KAC3C,SAAQ;KACR,WAAW,EAAE,YAAY,oBAAC,aAAD;MAAa,QAAQ;MAAS,SAAS,MAAM;KAAU,CAAA;KAE/E,UAAA,SAAS,KACR,oBAAC,SAAS,KAAK,WAAf;MACE,QAAQ,SAAS;MACjB,OAAO,SAAS;MACT;MACM;MACL;KACT,CAAA,IAED,oBAAC,aAAD;MAAa,QAAQ;MAAS,SAAS,SAAS;KAAU,CAAA;IAE/C,CAAA;GACE,GAlBK,OAAO,EAkBZ;EAEvB,CAAC,EACe,GA1BK,QA0BL,CACnB;CACY,CAAA;AAEnB"}

package/dist/domains/dashboards/components/widget-chrome.cjs.js

@@ -1,5 +1,5 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_MetricsCard = require("../../../MetricsCard-CEB-f2sv.cjs");
+const require_MetricsCard = require("../../../MetricsCard-BEwiS7Pe.cjs");
 const require_domains_metrics_components_chart_card = require("../../metrics/components/chart-card.cjs.js");
 const require_domains_dashboards_lib_chrome = require("../lib/chrome.cjs.js");
 let react_jsx_runtime = require("react/jsx-runtime");

package/dist/domains/dashboards/components/widget-chrome.es.js

@@ -1,4 +1,4 @@
-import { t as MetricsCard } from "../../../MetricsCard-M8awJ2B_.js";
+import { t as MetricsCard } from "../../../MetricsCard-ua6C6b8a.js";
 import { ChartCard } from "../../metrics/components/chart-card.es.js";
 import { unsupportedMessage } from "../lib/chrome.es.js";
 import { jsx } from "react/jsx-runtime";

package/dist/domains/dashboards/components/widget-error.cjs.js

@@ -1,5 +1,5 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const require_MetricsCard = require("../../../MetricsCard-CEB-f2sv.cjs");
+const require_MetricsCard = require("../../../MetricsCard-BEwiS7Pe.cjs");
 const require_domains_metrics_components_chart_card = require("../../metrics/components/chart-card.cjs.js");
 let react_jsx_runtime = require("react/jsx-runtime");
 // src/domains/dashboards/components/widget-error.tsx

package/dist/domains/dashboards/components/widget-error.es.js

@@ -1,4 +1,4 @@
-import { t as MetricsCard } from "../../../MetricsCard-M8awJ2B_.js";
+import { t as MetricsCard } from "../../../MetricsCard-ua6C6b8a.js";
 import { ChartCard } from "../../metrics/components/chart-card.es.js";
 import { jsx } from "react/jsx-runtime";
 // src/domains/dashboards/components/widget-error.tsx

package/dist/domains/dashboards/hooks/use-widget-views.cjs.js

@@ -5,16 +5,17 @@ let react = require("react");
 // src/domains/dashboards/hooks/use-widget-views.ts
 /**
 * The open view of a widget, `defaultIndex` until one is picked, and the card title for it
-* (`title`, and `titleMenu` with several views) to spread into `ChartCard`.
+* (`title`, and `titleMenu` with several views, or an expand link with `expand`) to spread into
+* `ChartCard`.
 */
-function useViewMenu(widget, views, defaultIndex = 0) {
+function useViewMenu(widget, views, defaultIndex = 0, expand) {
 	const [chosen, choose] = (0, react.useState)();
 	const wanted = chosen ?? defaultIndex;
 	const index = views[wanted] ? wanted : 0;
 	return {
 		view: views[index] ?? views[0],
 		index,
-		heading: require_domains_dashboards_lib_chrome.viewTitle(widget, views, index, choose)
+		heading: require_domains_dashboards_lib_chrome.viewTitle(widget, views, index, choose, expand)
 	};
 }
 /** What clicking a bucket or row opens, with what was clicked; `undefined` when the view has no click target. */

package/dist/domains/dashboards/hooks/use-widget-views.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-widget-views.cjs.js","names":["useState","viewTitle","viewDrilldown","targetScope"],"sources":["../../../../src/domains/dashboards/hooks/use-widget-views.ts"],"sourcesContent":["import type { DashboardWidget, DashboardWidgetView } from '@mastra/client-js';\nimport { useState } from 'react';\nimport type { DrilldownScope } from '../../metrics/drilldown';\nimport { viewTitle } from '../lib/chrome';\nimport { viewDrilldown, targetScope } from '../lib/definition';\nimport type { OnDashboardDrilldown } from '../lib/definition';\nimport type { ResolvedView } from '../widget-kind';\n\nexport type Views<Options> = readonly [ResolvedView<Options>, ...ResolvedView<Options>[]];\n\n/**\n * The open view of a widget, `defaultIndex` until one is picked, and the card title for it\n * (`title`, and `titleMenu` with several views) to spread into `ChartCard`.\n */\nexport function useViewMenu<Options>(widget: DashboardWidget, views: Views<Options>, defaultIndex = 0) {\n  const [chosen, choose] = useState<number>();\n  const wanted = chosen ?? defaultIndex;\n  const index = views[wanted] ? wanted : 0;\n  return { view: views[index] ?? views[0], index, heading: viewTitle(widget, views, index, choose) };\n}\n\n/** What clicking a bucket or row opens, with what was clicked; `undefined` when the view has no click target. */\nexport function useDrilldown(\n  widget: DashboardWidget,\n  view: DashboardWidgetView,\n  onDrilldown: OnDashboardDrilldown | undefined,\n) {\n  const { click } = viewDrilldown(widget, view);\n  if (!onDrilldown || !click) return undefined;\n  return (clicked: DrilldownScope) => onDrilldown(click.page, { ...targetScope(click), ...clicked });\n}\n\n/** Whether the view has an action button to show (`DrilldownAction`). */\nexport const hasDrilldownAction = (\n  widget: DashboardWidget,\n  view: DashboardWidgetView,\n  onDrilldown: OnDashboardDrilldown | undefined,\n) => onDrilldown !== undefined && viewDrilldown(widget, view).action !== undefined;\n"],"mappings":";;;;;;;;;AAcA,SAAgB,YAAqB,QAAyB,OAAuB,eAAe,GAAG;CACrG,MAAM,CAAC,QAAQ,WAAA,GAAUA,MAAAA,SAAAA,CAAiB;CAC1C,MAAM,SAAS,UAAU;CACzB,MAAM,QAAQ,MAAM,UAAU,SAAS;CACvC,OAAO;EAAE,MAAM,MAAM,UAAU,MAAM;EAAI;EAAO,SAASC,sCAAAA,UAAU,QAAQ,OAAO,OAAO,MAAM;CAAE;AACnG;;AAGA,SAAgB,aACd,QACA,MACA,aACA;CACA,MAAM,EAAE,UAAUC,0CAAAA,cAAc,QAAQ,IAAI;CAC5C,IAAI,CAAC,eAAe,CAAC,OAAO,OAAO,KAAA;CACnC,QAAQ,YAA4B,YAAY,MAAM,MAAM;EAAE,GAAGC,0CAAAA,YAAY,KAAK;EAAG,GAAG;CAAQ,CAAC;AACnG;;AAGA,IAAa,sBACX,QACA,MACA,gBACG,gBAAgB,KAAA,KAAaD,0CAAAA,cAAc,QAAQ,IAAI,CAAC,CAAC,WAAW,KAAA"}
+{"version":3,"file":"use-widget-views.cjs.js","names":["useState","viewTitle","viewDrilldown","targetScope"],"sources":["../../../../src/domains/dashboards/hooks/use-widget-views.ts"],"sourcesContent":["import type { DashboardWidget, DashboardWidgetView } from '@mastra/client-js';\nimport { useState } from 'react';\nimport type { DrilldownScope } from '../../metrics/drilldown';\nimport { viewTitle } from '../lib/chrome';\nimport { viewDrilldown, targetScope } from '../lib/definition';\nimport type { OnDashboardDrilldown } from '../lib/definition';\nimport type { DashboardExpand, ResolvedView } from '../widget-kind';\n\nexport type Views<Options> = readonly [ResolvedView<Options>, ...ResolvedView<Options>[]];\n\n/**\n * The open view of a widget, `defaultIndex` until one is picked, and the card title for it\n * (`title`, and `titleMenu` with several views, or an expand link with `expand`) to spread into\n * `ChartCard`.\n */\nexport function useViewMenu<Options>(\n  widget: DashboardWidget,\n  views: Views<Options>,\n  defaultIndex = 0,\n  expand?: DashboardExpand,\n) {\n  const [chosen, choose] = useState<number>();\n  const wanted = chosen ?? defaultIndex;\n  const index = views[wanted] ? wanted : 0;\n  return { view: views[index] ?? views[0], index, heading: viewTitle(widget, views, index, choose, expand) };\n}\n\n/** What clicking a bucket or row opens, with what was clicked; `undefined` when the view has no click target. */\nexport function useDrilldown(\n  widget: DashboardWidget,\n  view: DashboardWidgetView,\n  onDrilldown: OnDashboardDrilldown | undefined,\n) {\n  const { click } = viewDrilldown(widget, view);\n  if (!onDrilldown || !click) return undefined;\n  return (clicked: DrilldownScope) => onDrilldown(click.page, { ...targetScope(click), ...clicked });\n}\n\n/** Whether the view has an action button to show (`DrilldownAction`). */\nexport const hasDrilldownAction = (\n  widget: DashboardWidget,\n  view: DashboardWidgetView,\n  onDrilldown: OnDashboardDrilldown | undefined,\n) => onDrilldown !== undefined && viewDrilldown(widget, view).action !== undefined;\n"],"mappings":";;;;;;;;;;AAeA,SAAgB,YACd,QACA,OACA,eAAe,GACf,QACA;CACA,MAAM,CAAC,QAAQ,WAAA,GAAUA,MAAAA,SAAAA,CAAiB;CAC1C,MAAM,SAAS,UAAU;CACzB,MAAM,QAAQ,MAAM,UAAU,SAAS;CACvC,OAAO;EAAE,MAAM,MAAM,UAAU,MAAM;EAAI;EAAO,SAASC,sCAAAA,UAAU,QAAQ,OAAO,OAAO,QAAQ,MAAM;CAAE;AAC3G;;AAGA,SAAgB,aACd,QACA,MACA,aACA;CACA,MAAM,EAAE,UAAUC,0CAAAA,cAAc,QAAQ,IAAI;CAC5C,IAAI,CAAC,eAAe,CAAC,OAAO,OAAO,KAAA;CACnC,QAAQ,YAA4B,YAAY,MAAM,MAAM;EAAE,GAAGC,0CAAAA,YAAY,KAAK;EAAG,GAAG;CAAQ,CAAC;AACnG;;AAGA,IAAa,sBACX,QACA,MACA,gBACG,gBAAgB,KAAA,KAAaD,0CAAAA,cAAc,QAAQ,IAAI,CAAC,CAAC,WAAW,KAAA"}

package/dist/domains/dashboards/hooks/use-widget-views.es.js

@@ -4,16 +4,17 @@ import { useState } from "react";
 // src/domains/dashboards/hooks/use-widget-views.ts
 /**
 * The open view of a widget, `defaultIndex` until one is picked, and the card title for it
-* (`title`, and `titleMenu` with several views) to spread into `ChartCard`.
+* (`title`, and `titleMenu` with several views, or an expand link with `expand`) to spread into
+* `ChartCard`.
 */
-function useViewMenu(widget, views, defaultIndex = 0) {
+function useViewMenu(widget, views, defaultIndex = 0, expand) {
 	const [chosen, choose] = useState();
 	const wanted = chosen ?? defaultIndex;
 	const index = views[wanted] ? wanted : 0;
 	return {
 		view: views[index] ?? views[0],
 		index,
-		heading: viewTitle(widget, views, index, choose)
+		heading: viewTitle(widget, views, index, choose, expand)
 	};
 }
 /** What clicking a bucket or row opens, with what was clicked; `undefined` when the view has no click target. */

package/dist/domains/dashboards/hooks/use-widget-views.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"use-widget-views.es.js","names":[],"sources":["../../../../src/domains/dashboards/hooks/use-widget-views.ts"],"sourcesContent":["import type { DashboardWidget, DashboardWidgetView } from '@mastra/client-js';\nimport { useState } from 'react';\nimport type { DrilldownScope } from '../../metrics/drilldown';\nimport { viewTitle } from '../lib/chrome';\nimport { viewDrilldown, targetScope } from '../lib/definition';\nimport type { OnDashboardDrilldown } from '../lib/definition';\nimport type { ResolvedView } from '../widget-kind';\n\nexport type Views<Options> = readonly [ResolvedView<Options>, ...ResolvedView<Options>[]];\n\n/**\n * The open view of a widget, `defaultIndex` until one is picked, and the card title for it\n * (`title`, and `titleMenu` with several views) to spread into `ChartCard`.\n */\nexport function useViewMenu<Options>(widget: DashboardWidget, views: Views<Options>, defaultIndex = 0) {\n  const [chosen, choose] = useState<number>();\n  const wanted = chosen ?? defaultIndex;\n  const index = views[wanted] ? wanted : 0;\n  return { view: views[index] ?? views[0], index, heading: viewTitle(widget, views, index, choose) };\n}\n\n/** What clicking a bucket or row opens, with what was clicked; `undefined` when the view has no click target. */\nexport function useDrilldown(\n  widget: DashboardWidget,\n  view: DashboardWidgetView,\n  onDrilldown: OnDashboardDrilldown | undefined,\n) {\n  const { click } = viewDrilldown(widget, view);\n  if (!onDrilldown || !click) return undefined;\n  return (clicked: DrilldownScope) => onDrilldown(click.page, { ...targetScope(click), ...clicked });\n}\n\n/** Whether the view has an action button to show (`DrilldownAction`). */\nexport const hasDrilldownAction = (\n  widget: DashboardWidget,\n  view: DashboardWidgetView,\n  onDrilldown: OnDashboardDrilldown | undefined,\n) => onDrilldown !== undefined && viewDrilldown(widget, view).action !== undefined;\n"],"mappings":";;;;;;;;AAcA,SAAgB,YAAqB,QAAyB,OAAuB,eAAe,GAAG;CACrG,MAAM,CAAC,QAAQ,UAAU,SAAiB;CAC1C,MAAM,SAAS,UAAU;CACzB,MAAM,QAAQ,MAAM,UAAU,SAAS;CACvC,OAAO;EAAE,MAAM,MAAM,UAAU,MAAM;EAAI;EAAO,SAAS,UAAU,QAAQ,OAAO,OAAO,MAAM;CAAE;AACnG;;AAGA,SAAgB,aACd,QACA,MACA,aACA;CACA,MAAM,EAAE,UAAU,cAAc,QAAQ,IAAI;CAC5C,IAAI,CAAC,eAAe,CAAC,OAAO,OAAO,KAAA;CACnC,QAAQ,YAA4B,YAAY,MAAM,MAAM;EAAE,GAAG,YAAY,KAAK;EAAG,GAAG;CAAQ,CAAC;AACnG;;AAGA,IAAa,sBACX,QACA,MACA,gBACG,gBAAgB,KAAA,KAAa,cAAc,QAAQ,IAAI,CAAC,CAAC,WAAW,KAAA"}
+{"version":3,"file":"use-widget-views.es.js","names":[],"sources":["../../../../src/domains/dashboards/hooks/use-widget-views.ts"],"sourcesContent":["import type { DashboardWidget, DashboardWidgetView } from '@mastra/client-js';\nimport { useState } from 'react';\nimport type { DrilldownScope } from '../../metrics/drilldown';\nimport { viewTitle } from '../lib/chrome';\nimport { viewDrilldown, targetScope } from '../lib/definition';\nimport type { OnDashboardDrilldown } from '../lib/definition';\nimport type { DashboardExpand, ResolvedView } from '../widget-kind';\n\nexport type Views<Options> = readonly [ResolvedView<Options>, ...ResolvedView<Options>[]];\n\n/**\n * The open view of a widget, `defaultIndex` until one is picked, and the card title for it\n * (`title`, and `titleMenu` with several views, or an expand link with `expand`) to spread into\n * `ChartCard`.\n */\nexport function useViewMenu<Options>(\n  widget: DashboardWidget,\n  views: Views<Options>,\n  defaultIndex = 0,\n  expand?: DashboardExpand,\n) {\n  const [chosen, choose] = useState<number>();\n  const wanted = chosen ?? defaultIndex;\n  const index = views[wanted] ? wanted : 0;\n  return { view: views[index] ?? views[0], index, heading: viewTitle(widget, views, index, choose, expand) };\n}\n\n/** What clicking a bucket or row opens, with what was clicked; `undefined` when the view has no click target. */\nexport function useDrilldown(\n  widget: DashboardWidget,\n  view: DashboardWidgetView,\n  onDrilldown: OnDashboardDrilldown | undefined,\n) {\n  const { click } = viewDrilldown(widget, view);\n  if (!onDrilldown || !click) return undefined;\n  return (clicked: DrilldownScope) => onDrilldown(click.page, { ...targetScope(click), ...clicked });\n}\n\n/** Whether the view has an action button to show (`DrilldownAction`). */\nexport const hasDrilldownAction = (\n  widget: DashboardWidget,\n  view: DashboardWidgetView,\n  onDrilldown: OnDashboardDrilldown | undefined,\n) => onDrilldown !== undefined && viewDrilldown(widget, view).action !== undefined;\n"],"mappings":";;;;;;;;;AAeA,SAAgB,YACd,QACA,OACA,eAAe,GACf,QACA;CACA,MAAM,CAAC,QAAQ,UAAU,SAAiB;CAC1C,MAAM,SAAS,UAAU;CACzB,MAAM,QAAQ,MAAM,UAAU,SAAS;CACvC,OAAO;EAAE,MAAM,MAAM,UAAU,MAAM;EAAI;EAAO,SAAS,UAAU,QAAQ,OAAO,OAAO,QAAQ,MAAM;CAAE;AAC3G;;AAGA,SAAgB,aACd,QACA,MACA,aACA;CACA,MAAM,EAAE,UAAU,cAAc,QAAQ,IAAI;CAC5C,IAAI,CAAC,eAAe,CAAC,OAAO,OAAO,KAAA;CACnC,QAAQ,YAA4B,YAAY,MAAM,MAAM;EAAE,GAAG,YAAY,KAAK;EAAG,GAAG;CAAQ,CAAC;AACnG;;AAGA,IAAa,sBACX,QACA,MACA,gBACG,gBAAgB,KAAA,KAAa,cAAc,QAAQ,IAAI,CAAC,CAAC,WAAW,KAAA"}

package/dist/domains/dashboards/kinds/scores/scores-widget.cjs.js

@@ -10,8 +10,9 @@ const require_domains_metrics_lib_chart_axis = require("../../../metrics/lib/cha
 const require_domains_metrics_lib_chart_colors = require("../../../metrics/lib/chart-colors.cjs.js");
 const require_domains_dashboards_lib_scores = require("../../lib/scores.cjs.js");
 const require_domains_dashboards_hooks_use_scorers = require("../../hooks/use-scorers.cjs.js");
+const require_domains_dashboards_lib_chrome = require("../../lib/chrome.cjs.js");
 const require_domains_dashboards_lib_format = require("../../lib/format.cjs.js");
-const require_MetricsLineChart = require("../../../../MetricsLineChart-CjBm4IXu.cjs");
+const require_MetricsLineChart = require("../../../../MetricsLineChart-tZxsauau.cjs");
 let react_jsx_runtime = require("react/jsx-runtime");
 // src/domains/dashboards/kinds/scores/scores-widget.tsx
 /** Scores aren't problems, so no warm hues; past five scorers the colors repeat. */
@@ -22,19 +23,20 @@ var SCORER_COLORS = [
 	require_domains_metrics_lib_chart_colors.CHART_COLORS.teal,
 	require_domains_metrics_lib_chart_colors.CHART_COLORS.indigo
 ];
-function ScoresWidget({ widget, views }) {
+function ScoresWidget({ widget, views, expand }) {
 	const [view] = views;
+	const heading = require_domains_dashboards_lib_chrome.viewTitle(widget, [view], 0, () => {}, expand);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_domains_dashboards_components_view_gate.ViewGate, {
 		queries: view.queries,
 		pending: () => null,
 		children: (page) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ScoresView, {
-			title: widget.title ?? "",
+			heading,
 			view,
 			page
 		})
 	});
 }
-function ScoresView({ title, view, page }) {
+function ScoresView({ heading, view, page }) {
 	const { options } = view;
 	const { interval } = require_domains_metrics_lib_metrics_buckets.bucketPlan(page.window.start, page.window.end);
 	const stepHours = require_domains_metrics_lib_metrics_buckets.intervalHours(interval);
@@ -54,7 +56,7 @@ function ScoresView({ title, view, page }) {
 	].filter((r) => r !== void 0);
 	const failed = all.filter((r) => r.isError);
 	if (failed.length > 0) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_domains_metrics_components_chart_card.ChartCard, {
-		title,
+		...heading,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_domains_metrics_components_chart_card_error.ChartCardError, {
 			error: failed[0]?.error,
 			onRetry: () => failed.forEach((r) => void r.refetch())
@@ -68,12 +70,13 @@ function ScoresView({ title, view, page }) {
 		color: SCORER_COLORS[i % SCORER_COLORS.length] ?? require_domains_metrics_lib_chart_colors.CHART_COLORS.neutral
 	}));
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_domains_metrics_components_chart_card.ChartCard, {
-		title,
+		...heading,
 		isUpdating: all.some((r) => r.isRefetching),
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_domains_metrics_components_chart_area.ChartArea, {
 			isEmpty: !isLoading && lines.length === 0,
 			emptyMessage: options.emptyMessage,
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_MetricsLineChart.MetricsLineChart, {
+				lineStyle: "thin",
 				data: isLoading ? [] : buckets,
 				series,
 				height: "fill",

package/dist/domains/dashboards/kinds/scores/scores-widget.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"scores-widget.cjs.js","names":["CHART_COLORS","ViewGate","bucketPlan","intervalHours","useScorers","withScorer","buildRequest","useDashboardRequests","ChartCard","ChartCardError","shapeScores","ChartArea","MetricsLineChart","FORMATTERS","BUCKET_AXIS"],"sources":["../../../../../src/domains/dashboards/kinds/scores/scores-widget.tsx"],"sourcesContent":["import type { DashboardQuery } from '@mastra/client-js';\nimport { ChartArea } from '../../../metrics/components/chart-area';\nimport { ChartCard } from '../../../metrics/components/chart-card';\nimport { ChartCardError } from '../../../metrics/components/chart-card-error';\nimport { BUCKET_AXIS } from '../../../metrics/lib/chart-axis';\nimport { CHART_COLORS } from '../../../metrics/lib/chart-colors';\nimport { bucketPlan, intervalHours } from '../../../metrics/lib/metrics-buckets';\nimport { ViewGate } from '../../components/view-gate';\nimport { useDashboardRequests } from '../../hooks/use-dashboard-requests';\nimport { useScorers } from '../../hooks/use-scorers';\nimport { FORMATTERS } from '../../lib/format';\nimport { buildRequest } from '../../lib/requests';\nimport type { DashboardPageContext } from '../../lib/requests';\nimport { shapeScores, withScorer } from '../../lib/scores';\nimport type { ResolvedView, WidgetKindProps } from '../../widget-kind';\nimport type { ScoresOptions } from './options';\nimport type { MetricsLineChartSeries } from '@/ds/components/MetricsLineChart';\nimport { MetricsLineChart } from '@/ds/components/MetricsLineChart';\n\n/** Scores aren't problems, so no warm hues; past five scorers the colors repeat. */\nconst SCORER_COLORS = [\n  CHART_COLORS.green,\n  CHART_COLORS.sky,\n  CHART_COLORS.violet,\n  CHART_COLORS.teal,\n  CHART_COLORS.indigo,\n];\n\nexport function ScoresWidget({ widget, views }: WidgetKindProps<ScoresOptions>) {\n  const [view] = views;\n  return (\n    <ViewGate queries={view.queries} pending={() => null}>\n      {page => <ScoresView title={widget.title ?? ''} view={view} page={page} />}\n    </ViewGate>\n  );\n}\n\nfunction ScoresView({\n  title,\n  view,\n  page,\n}: {\n  title: string;\n  view: ResolvedView<ScoresOptions>;\n  page: DashboardPageContext;\n}) {\n  const { options } = view;\n  const { interval } = bucketPlan(page.window.start, page.window.end);\n  const stepHours = intervalHours(interval);\n  const { recent, scorers } = useScorers(view.queries, page);\n  const averageQuery = view.queries.find(q => q.id === options.average);\n  const seriesQuery = view.queries.find(q => q.id === options.series);\n  const send = (query: DashboardQuery | undefined, scorerId: string, bucket?: typeof interval) => {\n    const own = withScorer(query, scorerId);\n    return own && buildRequest(own, page, { interval: bucket });\n  };\n  // One answer per scorer in each list, in `scorers`' order.\n  const means = useDashboardRequests(scorers.map(({ scorerId }) => send(averageQuery, scorerId)));\n  const points = useDashboardRequests(scorers.map(({ scorerId }) => send(seriesQuery, scorerId, interval)));\n\n  const all = [recent, ...means, ...points].filter(r => r !== undefined);\n  const failed = all.filter(r => r.isError);\n  if (failed.length > 0) {\n    return (\n      <ChartCard title={title}>\n        <ChartCardError error={failed[0]?.error} onRetry={() => failed.forEach(r => void r.refetch())} />\n      </ChartCard>\n    );\n  }\n\n  const isLoading = all.some(r => r.isLoading);\n  const { buckets, lines } = shapeScores(\n    isLoading ? [] : scorers,\n    means.map(r => r?.data),\n    points.map(r => r?.data),\n    page.window,\n    stepHours,\n  );\n  const series: MetricsLineChartSeries[] = lines.map(({ scorerId, name }, i) => ({\n    dataKey: scorerId,\n    label: name,\n    color: SCORER_COLORS[i % SCORER_COLORS.length] ?? CHART_COLORS.neutral,\n  }));\n\n  return (\n    <ChartCard title={title} isUpdating={all.some(r => r.isRefetching)}>\n      <ChartArea isEmpty={!isLoading && lines.length === 0} emptyMessage={options.emptyMessage}>\n        <MetricsLineChart\n          data={isLoading ? [] : buckets}\n          series={series}\n          height=\"fill\"\n          yDomain={[0, 1]}\n          valueFormatter={FORMATTERS.score.value}\n          axisFormatter={FORMATTERS.score.axis}\n          isLoading={isLoading}\n          {...BUCKET_AXIS}\n        />\n      </ChartArea>\n    </ChartCard>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"scores-widget.cjs.js","names":["CHART_COLORS","viewTitle","ViewGate","bucketPlan","intervalHours","useScorers","withScorer","buildRequest","useDashboardRequests","ChartCard","ChartCardError","shapeScores","ChartArea","MetricsLineChart","FORMATTERS","BUCKET_AXIS"],"sources":["../../../../../src/domains/dashboards/kinds/scores/scores-widget.tsx"],"sourcesContent":["import type { DashboardQuery } from '@mastra/client-js';\nimport { ChartArea } from '../../../metrics/components/chart-area';\nimport { ChartCard } from '../../../metrics/components/chart-card';\nimport { ChartCardError } from '../../../metrics/components/chart-card-error';\nimport { BUCKET_AXIS } from '../../../metrics/lib/chart-axis';\nimport { CHART_COLORS } from '../../../metrics/lib/chart-colors';\nimport { bucketPlan, intervalHours } from '../../../metrics/lib/metrics-buckets';\nimport { ViewGate } from '../../components/view-gate';\nimport { useDashboardRequests } from '../../hooks/use-dashboard-requests';\nimport { useScorers } from '../../hooks/use-scorers';\nimport { viewTitle } from '../../lib/chrome';\nimport type { ViewHeading } from '../../lib/chrome';\nimport { FORMATTERS } from '../../lib/format';\nimport { buildRequest } from '../../lib/requests';\nimport type { DashboardPageContext } from '../../lib/requests';\nimport { shapeScores, withScorer } from '../../lib/scores';\nimport type { ResolvedView, WidgetKindProps } from '../../widget-kind';\nimport type { ScoresOptions } from './options';\nimport type { MetricsLineChartSeries } from '@/ds/components/MetricsLineChart';\nimport { MetricsLineChart } from '@/ds/components/MetricsLineChart';\n\n/** Scores aren't problems, so no warm hues; past five scorers the colors repeat. */\nconst SCORER_COLORS = [\n  CHART_COLORS.green,\n  CHART_COLORS.sky,\n  CHART_COLORS.violet,\n  CHART_COLORS.teal,\n  CHART_COLORS.indigo,\n];\n\nexport function ScoresWidget({ widget, views, expand }: WidgetKindProps<ScoresOptions>) {\n  const [view] = views;\n  // Scores show their first view only, so the title is plain or, with somewhere to expand to, a link.\n  const heading = viewTitle(widget, [view], 0, () => {}, expand);\n  return (\n    <ViewGate queries={view.queries} pending={() => null}>\n      {page => <ScoresView heading={heading} view={view} page={page} />}\n    </ViewGate>\n  );\n}\n\nfunction ScoresView({\n  heading,\n  view,\n  page,\n}: {\n  heading: ViewHeading;\n  view: ResolvedView<ScoresOptions>;\n  page: DashboardPageContext;\n}) {\n  const { options } = view;\n  const { interval } = bucketPlan(page.window.start, page.window.end);\n  const stepHours = intervalHours(interval);\n  const { recent, scorers } = useScorers(view.queries, page);\n  const averageQuery = view.queries.find(q => q.id === options.average);\n  const seriesQuery = view.queries.find(q => q.id === options.series);\n  const send = (query: DashboardQuery | undefined, scorerId: string, bucket?: typeof interval) => {\n    const own = withScorer(query, scorerId);\n    return own && buildRequest(own, page, { interval: bucket });\n  };\n  // One answer per scorer in each list, in `scorers`' order.\n  const means = useDashboardRequests(scorers.map(({ scorerId }) => send(averageQuery, scorerId)));\n  const points = useDashboardRequests(scorers.map(({ scorerId }) => send(seriesQuery, scorerId, interval)));\n\n  const all = [recent, ...means, ...points].filter(r => r !== undefined);\n  const failed = all.filter(r => r.isError);\n  if (failed.length > 0) {\n    return (\n      <ChartCard {...heading}>\n        <ChartCardError error={failed[0]?.error} onRetry={() => failed.forEach(r => void r.refetch())} />\n      </ChartCard>\n    );\n  }\n\n  const isLoading = all.some(r => r.isLoading);\n  const { buckets, lines } = shapeScores(\n    isLoading ? [] : scorers,\n    means.map(r => r?.data),\n    points.map(r => r?.data),\n    page.window,\n    stepHours,\n  );\n  const series: MetricsLineChartSeries[] = lines.map(({ scorerId, name }, i) => ({\n    dataKey: scorerId,\n    label: name,\n    color: SCORER_COLORS[i % SCORER_COLORS.length] ?? CHART_COLORS.neutral,\n  }));\n\n  return (\n    <ChartCard {...heading} isUpdating={all.some(r => r.isRefetching)}>\n      <ChartArea isEmpty={!isLoading && lines.length === 0} emptyMessage={options.emptyMessage}>\n        <MetricsLineChart\n          lineStyle=\"thin\"\n          data={isLoading ? [] : buckets}\n          series={series}\n          height=\"fill\"\n          yDomain={[0, 1]}\n          valueFormatter={FORMATTERS.score.value}\n          axisFormatter={FORMATTERS.score.axis}\n          isLoading={isLoading}\n          {...BUCKET_AXIS}\n        />\n      </ChartArea>\n    </ChartCard>\n  );\n}\n"],"mappings":"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"}

package/dist/domains/dashboards/kinds/scores/scores-widget.es.js

@@ -9,8 +9,9 @@ import { BUCKET_AXIS } from "../../../metrics/lib/chart-axis.es.js";
 import { CHART_COLORS } from "../../../metrics/lib/chart-colors.es.js";
 import { shapeScores, withScorer } from "../../lib/scores.es.js";
 import { useScorers } from "../../hooks/use-scorers.es.js";
+import { viewTitle } from "../../lib/chrome.es.js";
 import { FORMATTERS } from "../../lib/format.es.js";
-import { t as MetricsLineChart } from "../../../../MetricsLineChart-BhHoduO0.js";
+import { t as MetricsLineChart } from "../../../../MetricsLineChart-4SwxBbQx.js";
 import { jsx } from "react/jsx-runtime";
 // src/domains/dashboards/kinds/scores/scores-widget.tsx
 /** Scores aren't problems, so no warm hues; past five scorers the colors repeat. */
@@ -21,19 +22,20 @@ var SCORER_COLORS = [
 	CHART_COLORS.teal,
 	CHART_COLORS.indigo
 ];
-function ScoresWidget({ widget, views }) {
+function ScoresWidget({ widget, views, expand }) {
 	const [view] = views;
+	const heading = viewTitle(widget, [view], 0, () => {}, expand);
 	return /* @__PURE__ */ jsx(ViewGate, {
 		queries: view.queries,
 		pending: () => null,
 		children: (page) => /* @__PURE__ */ jsx(ScoresView, {
-			title: widget.title ?? "",
+			heading,
 			view,
 			page
 		})
 	});
 }
-function ScoresView({ title, view, page }) {
+function ScoresView({ heading, view, page }) {
 	const { options } = view;
 	const { interval } = bucketPlan(page.window.start, page.window.end);
 	const stepHours = intervalHours(interval);
@@ -53,7 +55,7 @@ function ScoresView({ title, view, page }) {
 	].filter((r) => r !== void 0);
 	const failed = all.filter((r) => r.isError);
 	if (failed.length > 0) return /* @__PURE__ */ jsx(ChartCard, {
-		title,
+		...heading,
 		children: /* @__PURE__ */ jsx(ChartCardError, {
 			error: failed[0]?.error,
 			onRetry: () => failed.forEach((r) => void r.refetch())
@@ -67,12 +69,13 @@ function ScoresView({ title, view, page }) {
 		color: SCORER_COLORS[i % SCORER_COLORS.length] ?? CHART_COLORS.neutral
 	}));
 	return /* @__PURE__ */ jsx(ChartCard, {
-		title,
+		...heading,
 		isUpdating: all.some((r) => r.isRefetching),
 		children: /* @__PURE__ */ jsx(ChartArea, {
 			isEmpty: !isLoading && lines.length === 0,
 			emptyMessage: options.emptyMessage,
 			children: /* @__PURE__ */ jsx(MetricsLineChart, {
+				lineStyle: "thin",
 				data: isLoading ? [] : buckets,
 				series,
 				height: "fill",

package/dist/domains/dashboards/kinds/scores/scores-widget.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"scores-widget.es.js","names":[],"sources":["../../../../../src/domains/dashboards/kinds/scores/scores-widget.tsx"],"sourcesContent":["import type { DashboardQuery } from '@mastra/client-js';\nimport { ChartArea } from '../../../metrics/components/chart-area';\nimport { ChartCard } from '../../../metrics/components/chart-card';\nimport { ChartCardError } from '../../../metrics/components/chart-card-error';\nimport { BUCKET_AXIS } from '../../../metrics/lib/chart-axis';\nimport { CHART_COLORS } from '../../../metrics/lib/chart-colors';\nimport { bucketPlan, intervalHours } from '../../../metrics/lib/metrics-buckets';\nimport { ViewGate } from '../../components/view-gate';\nimport { useDashboardRequests } from '../../hooks/use-dashboard-requests';\nimport { useScorers } from '../../hooks/use-scorers';\nimport { FORMATTERS } from '../../lib/format';\nimport { buildRequest } from '../../lib/requests';\nimport type { DashboardPageContext } from '../../lib/requests';\nimport { shapeScores, withScorer } from '../../lib/scores';\nimport type { ResolvedView, WidgetKindProps } from '../../widget-kind';\nimport type { ScoresOptions } from './options';\nimport type { MetricsLineChartSeries } from '@/ds/components/MetricsLineChart';\nimport { MetricsLineChart } from '@/ds/components/MetricsLineChart';\n\n/** Scores aren't problems, so no warm hues; past five scorers the colors repeat. */\nconst SCORER_COLORS = [\n  CHART_COLORS.green,\n  CHART_COLORS.sky,\n  CHART_COLORS.violet,\n  CHART_COLORS.teal,\n  CHART_COLORS.indigo,\n];\n\nexport function ScoresWidget({ widget, views }: WidgetKindProps<ScoresOptions>) {\n  const [view] = views;\n  return (\n    <ViewGate queries={view.queries} pending={() => null}>\n      {page => <ScoresView title={widget.title ?? ''} view={view} page={page} />}\n    </ViewGate>\n  );\n}\n\nfunction ScoresView({\n  title,\n  view,\n  page,\n}: {\n  title: string;\n  view: ResolvedView<ScoresOptions>;\n  page: DashboardPageContext;\n}) {\n  const { options } = view;\n  const { interval } = bucketPlan(page.window.start, page.window.end);\n  const stepHours = intervalHours(interval);\n  const { recent, scorers } = useScorers(view.queries, page);\n  const averageQuery = view.queries.find(q => q.id === options.average);\n  const seriesQuery = view.queries.find(q => q.id === options.series);\n  const send = (query: DashboardQuery | undefined, scorerId: string, bucket?: typeof interval) => {\n    const own = withScorer(query, scorerId);\n    return own && buildRequest(own, page, { interval: bucket });\n  };\n  // One answer per scorer in each list, in `scorers`' order.\n  const means = useDashboardRequests(scorers.map(({ scorerId }) => send(averageQuery, scorerId)));\n  const points = useDashboardRequests(scorers.map(({ scorerId }) => send(seriesQuery, scorerId, interval)));\n\n  const all = [recent, ...means, ...points].filter(r => r !== undefined);\n  const failed = all.filter(r => r.isError);\n  if (failed.length > 0) {\n    return (\n      <ChartCard title={title}>\n        <ChartCardError error={failed[0]?.error} onRetry={() => failed.forEach(r => void r.refetch())} />\n      </ChartCard>\n    );\n  }\n\n  const isLoading = all.some(r => r.isLoading);\n  const { buckets, lines } = shapeScores(\n    isLoading ? [] : scorers,\n    means.map(r => r?.data),\n    points.map(r => r?.data),\n    page.window,\n    stepHours,\n  );\n  const series: MetricsLineChartSeries[] = lines.map(({ scorerId, name }, i) => ({\n    dataKey: scorerId,\n    label: name,\n    color: SCORER_COLORS[i % SCORER_COLORS.length] ?? CHART_COLORS.neutral,\n  }));\n\n  return (\n    <ChartCard title={title} isUpdating={all.some(r => r.isRefetching)}>\n      <ChartArea isEmpty={!isLoading && lines.length === 0} emptyMessage={options.emptyMessage}>\n        <MetricsLineChart\n          data={isLoading ? [] : buckets}\n          series={series}\n          height=\"fill\"\n          yDomain={[0, 1]}\n          valueFormatter={FORMATTERS.score.value}\n          axisFormatter={FORMATTERS.score.axis}\n          isLoading={isLoading}\n          {...BUCKET_AXIS}\n        />\n      </ChartArea>\n    </ChartCard>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;AAoBA,IAAM,gBAAgB;CACpB,aAAa;CACb,aAAa;CACb,aAAa;CACb,aAAa;CACb,aAAa;AACf;AAEA,SAAgB,aAAa,EAAE,QAAQ,SAAyC;CAC9E,MAAM,CAAC,QAAQ;CACf,OACE,oBAAC,UAAD;EAAU,SAAS,KAAK;EAAS,eAAe;EAC7C,WAAA,SAAQ,oBAAC,YAAD;GAAY,OAAO,OAAO,SAAS;GAAU;GAAY;EAAO,CAAA;CACjE,CAAA;AAEd;AAEA,SAAS,WAAW,EAClB,OACA,MACA,QAKC;CACD,MAAM,EAAE,YAAY;CACpB,MAAM,EAAE,aAAa,WAAW,KAAK,OAAO,OAAO,KAAK,OAAO,GAAG;CAClE,MAAM,YAAY,cAAc,QAAQ;CACxC,MAAM,EAAE,QAAQ,YAAY,WAAW,KAAK,SAAS,IAAI;CACzD,MAAM,eAAe,KAAK,QAAQ,MAAK,MAAK,EAAE,OAAO,QAAQ,OAAO;CACpE,MAAM,cAAc,KAAK,QAAQ,MAAK,MAAK,EAAE,OAAO,QAAQ,MAAM;CAClE,MAAM,QAAQ,OAAmC,UAAkB,WAA6B;EAC9F,MAAM,MAAM,WAAW,OAAO,QAAQ;EACtC,OAAO,OAAO,aAAa,KAAK,MAAM,EAAE,UAAU,OAAO,CAAC;CAC5D;CAEA,MAAM,QAAQ,qBAAqB,QAAQ,KAAK,EAAE,eAAe,KAAK,cAAc,QAAQ,CAAC,CAAC;CAC9F,MAAM,SAAS,qBAAqB,QAAQ,KAAK,EAAE,eAAe,KAAK,aAAa,UAAU,QAAQ,CAAC,CAAC;CAExG,MAAM,MAAM;EAAC;EAAQ,GAAG;EAAO,GAAG;CAAM,CAAC,CAAC,QAAO,MAAK,MAAM,KAAA,CAAS;CACrE,MAAM,SAAS,IAAI,QAAO,MAAK,EAAE,OAAO;CACxC,IAAI,OAAO,SAAS,GAClB,OACE,oBAAC,WAAD;EAAkB;EAChB,UAAA,oBAAC,gBAAD;GAAgB,OAAO,OAAO,EAAE,EAAE;GAAO,eAAe,OAAO,SAAQ,MAAK,KAAK,EAAE,QAAQ,CAAC;EAAI,CAAA;CACvF,CAAA;CAIf,MAAM,YAAY,IAAI,MAAK,MAAK,EAAE,SAAS;CAC3C,MAAM,EAAE,SAAS,UAAU,YACzB,YAAY,CAAC,IAAI,SACjB,MAAM,KAAI,MAAK,GAAG,IAAI,GACtB,OAAO,KAAI,MAAK,GAAG,IAAI,GACvB,KAAK,QACL,SACF;CACA,MAAM,SAAmC,MAAM,KAAK,EAAE,UAAU,QAAQ,OAAO;EAC7E,SAAS;EACT,OAAO;EACP,OAAO,cAAc,IAAI,cAAc,WAAW,aAAa;CACjE,EAAE;CAEF,OACE,oBAAC,WAAD;EAAkB;EAAO,YAAY,IAAI,MAAK,MAAK,EAAE,YAAY;EAC/D,UAAA,oBAAC,WAAD;GAAW,SAAS,CAAC,aAAa,MAAM,WAAW;GAAG,cAAc,QAAQ;GAC1E,UAAA,oBAAC,kBAAD;IACE,MAAM,YAAY,CAAC,IAAI;IACf;IACR,QAAO;IACP,SAAS,CAAC,GAAG,CAAC;IACd,gBAAgB,WAAW,MAAM;IACjC,eAAe,WAAW,MAAM;IACrB;IACX,GAAI;GACL,CAAA;EACQ,CAAA;CACF,CAAA;AAEf"}
+{"version":3,"file":"scores-widget.es.js","names":[],"sources":["../../../../../src/domains/dashboards/kinds/scores/scores-widget.tsx"],"sourcesContent":["import type { DashboardQuery } from '@mastra/client-js';\nimport { ChartArea } from '../../../metrics/components/chart-area';\nimport { ChartCard } from '../../../metrics/components/chart-card';\nimport { ChartCardError } from '../../../metrics/components/chart-card-error';\nimport { BUCKET_AXIS } from '../../../metrics/lib/chart-axis';\nimport { CHART_COLORS } from '../../../metrics/lib/chart-colors';\nimport { bucketPlan, intervalHours } from '../../../metrics/lib/metrics-buckets';\nimport { ViewGate } from '../../components/view-gate';\nimport { useDashboardRequests } from '../../hooks/use-dashboard-requests';\nimport { useScorers } from '../../hooks/use-scorers';\nimport { viewTitle } from '../../lib/chrome';\nimport type { ViewHeading } from '../../lib/chrome';\nimport { FORMATTERS } from '../../lib/format';\nimport { buildRequest } from '../../lib/requests';\nimport type { DashboardPageContext } from '../../lib/requests';\nimport { shapeScores, withScorer } from '../../lib/scores';\nimport type { ResolvedView, WidgetKindProps } from '../../widget-kind';\nimport type { ScoresOptions } from './options';\nimport type { MetricsLineChartSeries } from '@/ds/components/MetricsLineChart';\nimport { MetricsLineChart } from '@/ds/components/MetricsLineChart';\n\n/** Scores aren't problems, so no warm hues; past five scorers the colors repeat. */\nconst SCORER_COLORS = [\n  CHART_COLORS.green,\n  CHART_COLORS.sky,\n  CHART_COLORS.violet,\n  CHART_COLORS.teal,\n  CHART_COLORS.indigo,\n];\n\nexport function ScoresWidget({ widget, views, expand }: WidgetKindProps<ScoresOptions>) {\n  const [view] = views;\n  // Scores show their first view only, so the title is plain or, with somewhere to expand to, a link.\n  const heading = viewTitle(widget, [view], 0, () => {}, expand);\n  return (\n    <ViewGate queries={view.queries} pending={() => null}>\n      {page => <ScoresView heading={heading} view={view} page={page} />}\n    </ViewGate>\n  );\n}\n\nfunction ScoresView({\n  heading,\n  view,\n  page,\n}: {\n  heading: ViewHeading;\n  view: ResolvedView<ScoresOptions>;\n  page: DashboardPageContext;\n}) {\n  const { options } = view;\n  const { interval } = bucketPlan(page.window.start, page.window.end);\n  const stepHours = intervalHours(interval);\n  const { recent, scorers } = useScorers(view.queries, page);\n  const averageQuery = view.queries.find(q => q.id === options.average);\n  const seriesQuery = view.queries.find(q => q.id === options.series);\n  const send = (query: DashboardQuery | undefined, scorerId: string, bucket?: typeof interval) => {\n    const own = withScorer(query, scorerId);\n    return own && buildRequest(own, page, { interval: bucket });\n  };\n  // One answer per scorer in each list, in `scorers`' order.\n  const means = useDashboardRequests(scorers.map(({ scorerId }) => send(averageQuery, scorerId)));\n  const points = useDashboardRequests(scorers.map(({ scorerId }) => send(seriesQuery, scorerId, interval)));\n\n  const all = [recent, ...means, ...points].filter(r => r !== undefined);\n  const failed = all.filter(r => r.isError);\n  if (failed.length > 0) {\n    return (\n      <ChartCard {...heading}>\n        <ChartCardError error={failed[0]?.error} onRetry={() => failed.forEach(r => void r.refetch())} />\n      </ChartCard>\n    );\n  }\n\n  const isLoading = all.some(r => r.isLoading);\n  const { buckets, lines } = shapeScores(\n    isLoading ? [] : scorers,\n    means.map(r => r?.data),\n    points.map(r => r?.data),\n    page.window,\n    stepHours,\n  );\n  const series: MetricsLineChartSeries[] = lines.map(({ scorerId, name }, i) => ({\n    dataKey: scorerId,\n    label: name,\n    color: SCORER_COLORS[i % SCORER_COLORS.length] ?? CHART_COLORS.neutral,\n  }));\n\n  return (\n    <ChartCard {...heading} isUpdating={all.some(r => r.isRefetching)}>\n      <ChartArea isEmpty={!isLoading && lines.length === 0} emptyMessage={options.emptyMessage}>\n        <MetricsLineChart\n          lineStyle=\"thin\"\n          data={isLoading ? [] : buckets}\n          series={series}\n          height=\"fill\"\n          yDomain={[0, 1]}\n          valueFormatter={FORMATTERS.score.value}\n          axisFormatter={FORMATTERS.score.axis}\n          isLoading={isLoading}\n          {...BUCKET_AXIS}\n        />\n      </ChartArea>\n    </ChartCard>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAsBA,IAAM,gBAAgB;CACpB,aAAa;CACb,aAAa;CACb,aAAa;CACb,aAAa;CACb,aAAa;AACf;AAEA,SAAgB,aAAa,EAAE,QAAQ,OAAO,UAA0C;CACtF,MAAM,CAAC,QAAQ;CAEf,MAAM,UAAU,UAAU,QAAQ,CAAC,IAAI,GAAG,SAAS,CAAC,GAAG,MAAM;CAC7D,OACE,oBAAC,UAAD;EAAU,SAAS,KAAK;EAAS,eAAe;EAC7C,WAAA,SAAQ,oBAAC,YAAD;GAAqB;GAAe;GAAY;EAAO,CAAA;CACxD,CAAA;AAEd;AAEA,SAAS,WAAW,EAClB,SACA,MACA,QAKC;CACD,MAAM,EAAE,YAAY;CACpB,MAAM,EAAE,aAAa,WAAW,KAAK,OAAO,OAAO,KAAK,OAAO,GAAG;CAClE,MAAM,YAAY,cAAc,QAAQ;CACxC,MAAM,EAAE,QAAQ,YAAY,WAAW,KAAK,SAAS,IAAI;CACzD,MAAM,eAAe,KAAK,QAAQ,MAAK,MAAK,EAAE,OAAO,QAAQ,OAAO;CACpE,MAAM,cAAc,KAAK,QAAQ,MAAK,MAAK,EAAE,OAAO,QAAQ,MAAM;CAClE,MAAM,QAAQ,OAAmC,UAAkB,WAA6B;EAC9F,MAAM,MAAM,WAAW,OAAO,QAAQ;EACtC,OAAO,OAAO,aAAa,KAAK,MAAM,EAAE,UAAU,OAAO,CAAC;CAC5D;CAEA,MAAM,QAAQ,qBAAqB,QAAQ,KAAK,EAAE,eAAe,KAAK,cAAc,QAAQ,CAAC,CAAC;CAC9F,MAAM,SAAS,qBAAqB,QAAQ,KAAK,EAAE,eAAe,KAAK,aAAa,UAAU,QAAQ,CAAC,CAAC;CAExG,MAAM,MAAM;EAAC;EAAQ,GAAG;EAAO,GAAG;CAAM,CAAC,CAAC,QAAO,MAAK,MAAM,KAAA,CAAS;CACrE,MAAM,SAAS,IAAI,QAAO,MAAK,EAAE,OAAO;CACxC,IAAI,OAAO,SAAS,GAClB,OACE,oBAAC,WAAD;EAAW,GAAI;EACb,UAAA,oBAAC,gBAAD;GAAgB,OAAO,OAAO,EAAE,EAAE;GAAO,eAAe,OAAO,SAAQ,MAAK,KAAK,EAAE,QAAQ,CAAC;EAAI,CAAA;CACvF,CAAA;CAIf,MAAM,YAAY,IAAI,MAAK,MAAK,EAAE,SAAS;CAC3C,MAAM,EAAE,SAAS,UAAU,YACzB,YAAY,CAAC,IAAI,SACjB,MAAM,KAAI,MAAK,GAAG,IAAI,GACtB,OAAO,KAAI,MAAK,GAAG,IAAI,GACvB,KAAK,QACL,SACF;CACA,MAAM,SAAmC,MAAM,KAAK,EAAE,UAAU,QAAQ,OAAO;EAC7E,SAAS;EACT,OAAO;EACP,OAAO,cAAc,IAAI,cAAc,WAAW,aAAa;CACjE,EAAE;CAEF,OACE,oBAAC,WAAD;EAAW,GAAI;EAAS,YAAY,IAAI,MAAK,MAAK,EAAE,YAAY;EAC9D,UAAA,oBAAC,WAAD;GAAW,SAAS,CAAC,aAAa,MAAM,WAAW;GAAG,cAAc,QAAQ;GAC1E,UAAA,oBAAC,kBAAD;IACE,WAAU;IACV,MAAM,YAAY,CAAC,IAAI;IACf;IACR,QAAO;IACP,SAAS,CAAC,GAAG,CAAC;IACd,gBAAgB,WAAW,MAAM;IACjC,eAAe,WAAW,MAAM;IACrB;IACX,GAAI;GACL,CAAA;EACQ,CAAA;CACF,CAAA;AAEf"}

package/dist/domains/dashboards/kinds/table/table-tabs.cjs.js

@@ -2,9 +2,9 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_domains_dashboards_lib_requests = require("../../lib/requests.cjs.js");
 const require_domains_dashboards_hooks_use_dashboard_requests = require("../../hooks/use-dashboard-requests.cjs.js");
 const require_domains_dashboards_lib_values = require("../../lib/values.cjs.js");
-const require_MetricsCard = require("../../../../MetricsCard-CEB-f2sv.cjs");
-const require_domains_dashboards_lib_table = require("../../lib/table.cjs.js");
+const require_MetricsCard = require("../../../../MetricsCard-BEwiS7Pe.cjs");
 const require_domains_dashboards_lib_chrome = require("../../lib/chrome.cjs.js");
+const require_domains_dashboards_lib_table = require("../../lib/table.cjs.js");
 const require_domains_dashboards_hooks_use_widget_views = require("../../hooks/use-widget-views.cjs.js");
 const require_domains_dashboards_kinds_table_table_frame = require("./table-frame.cjs.js");
 const require_domains_dashboards_kinds_table_table_view = require("./table-view.cjs.js");

package/dist/domains/dashboards/kinds/table/table-tabs.es.js

@@ -1,9 +1,9 @@
 import { buildRequest } from "../../lib/requests.es.js";
 import { useDashboardRequests } from "../../hooks/use-dashboard-requests.es.js";
 import { exprRefs } from "../../lib/values.es.js";
-import { t as MetricsCard } from "../../../../MetricsCard-M8awJ2B_.js";
-import { countRows, isValueColumn, openingView, parseColumns } from "../../lib/table.es.js";
+import { t as MetricsCard } from "../../../../MetricsCard-ua6C6b8a.js";
 import { unsupportedMessage } from "../../lib/chrome.es.js";
+import { countRows, isValueColumn, openingView, parseColumns } from "../../lib/table.es.js";
 import { useViewMenu } from "../../hooks/use-widget-views.es.js";
 import { TableFrame } from "./table-frame.es.js";
 import { TableView } from "./table-view.es.js";

package/dist/domains/dashboards/kinds/table/table-widget.cjs.js

@@ -1,6 +1,6 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const require_domains_dashboards_components_view_gate = require("../../components/view-gate.cjs.js");
-const require_MetricsCard = require("../../../../MetricsCard-CEB-f2sv.cjs");
+const require_MetricsCard = require("../../../../MetricsCard-BEwiS7Pe.cjs");
 const require_domains_metrics_components_chart_card = require("../../../metrics/components/chart-card.cjs.js");
 const require_domains_dashboards_kinds_table_table_tabs = require("./table-tabs.cjs.js");
 let react_jsx_runtime = require("react/jsx-runtime");

package/dist/domains/dashboards/kinds/table/table-widget.es.js

@@ -1,5 +1,5 @@
 import { ViewGate } from "../../components/view-gate.es.js";
-import { t as MetricsCard } from "../../../../MetricsCard-M8awJ2B_.js";
+import { t as MetricsCard } from "../../../../MetricsCard-ua6C6b8a.js";
 import { ChartCard } from "../../../metrics/components/chart-card.es.js";
 import { TableTabs } from "./table-tabs.es.js";
 import { jsx } from "react/jsx-runtime";

package/dist/domains/dashboards/kinds/timeseries/timeseries-widget.cjs.js

@@ -4,22 +4,22 @@ const require_domains_dashboards_lib_requests = require("../../lib/requests.cjs.
 const require_domains_dashboards_components_view_gate = require("../../components/view-gate.cjs.js");
 const require_domains_dashboards_hooks_use_dashboard_requests = require("../../hooks/use-dashboard-requests.cjs.js");
 const require_domains_dashboards_lib_values = require("../../lib/values.cjs.js");
-const require_MetricsCard = require("../../../../MetricsCard-CEB-f2sv.cjs");
+const require_MetricsCard = require("../../../../MetricsCard-BEwiS7Pe.cjs");
 const require_domains_metrics_components_chart_area = require("../../../metrics/components/chart-area.cjs.js");
 const require_domains_metrics_components_chart_card = require("../../../metrics/components/chart-card.cjs.js");
 const require_domains_metrics_components_chart_card_error = require("../../../metrics/components/chart-card-error.cjs.js");
 const require_domains_metrics_lib_chart_axis = require("../../../metrics/lib/chart-axis.cjs.js");
 const require_domains_dashboards_lib_format = require("../../lib/format.cjs.js");
-const require_MetricsLineChart = require("../../../../MetricsLineChart-CjBm4IXu.cjs");
+const require_MetricsLineChart = require("../../../../MetricsLineChart-tZxsauau.cjs");
 const require_domains_dashboards_hooks_use_widget_views = require("../../hooks/use-widget-views.cjs.js");
 const require_domains_dashboards_lib_timeseries = require("../../lib/timeseries.cjs.js");
 const require_domains_dashboards_components_widget_chrome = require("../../components/widget-chrome.cjs.js");
 const require_domains_dashboards_components_widget_controls = require("../../components/widget-controls.cjs.js");
-const require_MetricsStackedBarChart = require("../../../../MetricsStackedBarChart-BdMlKv6G.cjs");
+const require_MetricsStackedBarChart = require("../../../../MetricsStackedBarChart-CDLE76IB.cjs");
 let react_jsx_runtime = require("react/jsx-runtime");
 // src/domains/dashboards/kinds/timeseries/timeseries-widget.tsx
 function TimeseriesWidget(props) {
-	const { view, heading } = require_domains_dashboards_hooks_use_widget_views.useViewMenu(props.widget, props.views);
+	const { view, heading } = require_domains_dashboards_hooks_use_widget_views.useViewMenu(props.widget, props.views, 0, props.expand);
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_domains_dashboards_components_view_gate.ViewGate, {
 		queries: view.queries,
 		pending: (gate) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_domains_dashboards_components_widget_chrome.PendingChartCard, {
@@ -105,7 +105,8 @@ function TimeseriesView({ widget, view, heading, page, onDrilldown }) {
 			emptyMessage: options.emptyMessage,
 			children: options.chart === "stackedBar" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_MetricsStackedBarChart.MetricsStackedBarChart, { ...chart }) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_MetricsLineChart.MetricsLineChart, {
 				...chart,
-				yDomain
+				yDomain,
+				lineStyle: "thin"
 			})
 		})
 	});

package/dist/domains/dashboards/kinds/timeseries/timeseries-widget.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"timeseries-widget.cjs.js","names":["useViewMenu","ViewGate","PendingChartCard","bucketPlan","useDashboardRequests","buildRequest","useDrilldown","shapeTimeseries","answersById","FORMATTERS","chartColor","hasDrilldownAction","DrilldownAction","MetricsCard","MetricsLineChartLegend","ChartCard","ChartCardError","bucketWindow","EDGE_BUCKET_AXIS","BUCKET_AXIS","ChartArea","MetricsStackedBarChart","MetricsLineChart"],"sources":["../../../../../src/domains/dashboards/kinds/timeseries/timeseries-widget.tsx"],"sourcesContent":["import { ChartArea } from '../../../metrics/components/chart-area';\nimport { ChartCard } from '../../../metrics/components/chart-card';\nimport { ChartCardError } from '../../../metrics/components/chart-card-error';\nimport { BUCKET_AXIS, EDGE_BUCKET_AXIS } from '../../../metrics/lib/chart-axis';\nimport { bucketPlan, bucketWindow } from '../../../metrics/lib/metrics-buckets';\nimport { ViewGate } from '../../components/view-gate';\nimport { PendingChartCard } from '../../components/widget-chrome';\nimport { DrilldownAction } from '../../components/widget-controls';\nimport { useDashboardRequests } from '../../hooks/use-dashboard-requests';\nimport { hasDrilldownAction, useDrilldown, useViewMenu } from '../../hooks/use-widget-views';\nimport type { ViewHeading } from '../../lib/chrome';\nimport { chartColor, FORMATTERS } from '../../lib/format';\nimport { buildRequest } from '../../lib/requests';\nimport type { DashboardPageContext } from '../../lib/requests';\nimport { shapeTimeseries } from '../../lib/timeseries';\nimport type { TimeseriesOptions } from '../../lib/timeseries';\nimport { answersById } from '../../lib/values';\nimport type { ResolvedView, WidgetKindProps } from '../../widget-kind';\nimport { MetricsCard } from '@/ds/components/MetricsCard';\nimport { MetricsLineChart, MetricsLineChartLegend } from '@/ds/components/MetricsLineChart';\nimport type { MetricsLineChartSeries } from '@/ds/components/MetricsLineChart';\nimport { MetricsStackedBarChart } from '@/ds/components/MetricsStackedBarChart';\n\ntype Props = WidgetKindProps<TimeseriesOptions>;\ntype ViewProps = Props & {\n  view: ResolvedView<TimeseriesOptions>;\n  heading: ViewHeading;\n  page: DashboardPageContext;\n};\n\nexport function TimeseriesWidget(props: Props) {\n  const { view, heading } = useViewMenu(props.widget, props.views);\n  return (\n    <ViewGate queries={view.queries} pending={gate => <PendingChartCard gate={gate} heading={heading} />}>\n      {page => <TimeseriesView {...props} view={view} heading={heading} page={page} />}\n    </ViewGate>\n  );\n}\n\nfunction TimeseriesView({ widget, view, heading, page, onDrilldown }: ViewProps) {\n  const { options } = view;\n  const { interval } = bucketPlan(page.window.start, page.window.end);\n  const totals = new Set(options.totals ?? []);\n  const results = useDashboardRequests(\n    view.queries.map(q =>\n      buildRequest(q, page, { interval: q.id !== undefined && totals.has(q.id) ? undefined : interval }),\n    ),\n  );\n  const sent = results.filter(r => r !== undefined);\n  const hasTraceQueries = view.queries.some(q => q.source === 'traceAggregate' || q.source === 'spanAggregate');\n  const onClick = useDrilldown(widget, view, onDrilldown);\n\n  const isLoading = sent.some(r => r.isLoading);\n  const shaped = shapeTimeseries({\n    options,\n    responses: answersById(\n      view.queries,\n      results.map(r => r?.data),\n    ),\n    window: page.window,\n    hasTraceQueries,\n  });\n  const format = FORMATTERS[options.format];\n  const lines: MetricsLineChartSeries[] = shaped.series.map(s => ({\n    dataKey: s.dataKey,\n    label: s.label,\n    color: chartColor(s.color),\n    emphasis: s.emphasis,\n  }));\n  // Series with a range total each show theirs, marked like their line: they count different things.\n  const rangeTotals = shaped.series.flatMap(s =>\n    s.rangeTotal === undefined\n      ? []\n      : [{ label: s.label, value: format.value(s.rangeTotal), color: chartColor(s.color) }],\n  );\n  const withRangeTotals = options.series.some(s => s.rangeTotal !== undefined);\n\n  const layout = {\n    ...heading,\n    actions: hasDrilldownAction(widget, view, onDrilldown) ? (\n      <DrilldownAction widget={widget} view={view} onDrilldown={onDrilldown} />\n    ) : undefined,\n    total: withRangeTotals ? rangeTotals : undefined,\n    isLoading,\n    toolbar: lines.length > 0 && (\n      <MetricsCard.Toolbar>\n        <MetricsLineChartLegend series={lines} />\n      </MetricsCard.Toolbar>\n    ),\n  };\n\n  const failed = sent.filter(r => r.isError);\n  if (failed.length) {\n    return (\n      <ChartCard {...layout}>\n        {hasTraceQueries ? (\n          <ChartCardError error={failed[0]?.error} onRetry={() => failed.forEach(r => void r.refetch())} />\n        ) : (\n          <ChartCardError />\n        )}\n      </ChartCard>\n    );\n  }\n\n  const totalFormat = FORMATTERS[options.total?.format ?? options.format];\n  const total =\n    options.total &&\n    (typeof options.total.value === 'object' && 'peak' in options.total.value && !shaped.total\n      ? '—'\n      : totalFormat.value(shaped.total ?? 0));\n\n  const chart = {\n    data: shaped.data,\n    series: lines,\n    height: 'fill' as const,\n    xLabels: options.xLabels,\n    showLegend: false,\n    valueFormatter: format.value,\n    axisFormatter: options.axis === false ? undefined : format.axis,\n    onBucketClick:\n      onClick &&\n      ((row: Record<string, unknown>) => onClick({ window: bucketWindow(Number(row.ts), shaped.stepHours) })),\n    isLoading,\n    ...(options.xLabels ? EDGE_BUCKET_AXIS : BUCKET_AXIS),\n  };\n  const yDomain = shaped.flat && options.flatYDomain ? options.flatYDomain : options.yDomain;\n\n  return (\n    <ChartCard {...layout} total={layout.total ?? total} isUpdating={sent.some(r => r.isRefetching)}>\n      <ChartArea isEmpty={!isLoading && shaped.empty} emptyMessage={options.emptyMessage}>\n        {options.chart === 'stackedBar' ? (\n          <MetricsStackedBarChart {...chart} />\n        ) : (\n          <MetricsLineChart {...chart} yDomain={yDomain} />\n        )}\n      </ChartArea>\n    </ChartCard>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"timeseries-widget.cjs.js","names":["useViewMenu","ViewGate","PendingChartCard","bucketPlan","useDashboardRequests","buildRequest","useDrilldown","shapeTimeseries","answersById","FORMATTERS","chartColor","hasDrilldownAction","DrilldownAction","MetricsCard","MetricsLineChartLegend","ChartCard","ChartCardError","bucketWindow","EDGE_BUCKET_AXIS","BUCKET_AXIS","ChartArea","MetricsStackedBarChart","MetricsLineChart"],"sources":["../../../../../src/domains/dashboards/kinds/timeseries/timeseries-widget.tsx"],"sourcesContent":["import { ChartArea } from '../../../metrics/components/chart-area';\nimport { ChartCard } from '../../../metrics/components/chart-card';\nimport { ChartCardError } from '../../../metrics/components/chart-card-error';\nimport { BUCKET_AXIS, EDGE_BUCKET_AXIS } from '../../../metrics/lib/chart-axis';\nimport { bucketPlan, bucketWindow } from '../../../metrics/lib/metrics-buckets';\nimport { ViewGate } from '../../components/view-gate';\nimport { PendingChartCard } from '../../components/widget-chrome';\nimport { DrilldownAction } from '../../components/widget-controls';\nimport { useDashboardRequests } from '../../hooks/use-dashboard-requests';\nimport { hasDrilldownAction, useDrilldown, useViewMenu } from '../../hooks/use-widget-views';\nimport type { ViewHeading } from '../../lib/chrome';\nimport { chartColor, FORMATTERS } from '../../lib/format';\nimport { buildRequest } from '../../lib/requests';\nimport type { DashboardPageContext } from '../../lib/requests';\nimport { shapeTimeseries } from '../../lib/timeseries';\nimport type { TimeseriesOptions } from '../../lib/timeseries';\nimport { answersById } from '../../lib/values';\nimport type { ResolvedView, WidgetKindProps } from '../../widget-kind';\nimport { MetricsCard } from '@/ds/components/MetricsCard';\nimport { MetricsLineChart, MetricsLineChartLegend } from '@/ds/components/MetricsLineChart';\nimport type { MetricsLineChartSeries } from '@/ds/components/MetricsLineChart';\nimport { MetricsStackedBarChart } from '@/ds/components/MetricsStackedBarChart';\n\ntype Props = WidgetKindProps<TimeseriesOptions>;\ntype ViewProps = Props & {\n  view: ResolvedView<TimeseriesOptions>;\n  heading: ViewHeading;\n  page: DashboardPageContext;\n};\n\nexport function TimeseriesWidget(props: Props) {\n  const { view, heading } = useViewMenu(props.widget, props.views, 0, props.expand);\n  return (\n    <ViewGate queries={view.queries} pending={gate => <PendingChartCard gate={gate} heading={heading} />}>\n      {page => <TimeseriesView {...props} view={view} heading={heading} page={page} />}\n    </ViewGate>\n  );\n}\n\nfunction TimeseriesView({ widget, view, heading, page, onDrilldown }: ViewProps) {\n  const { options } = view;\n  const { interval } = bucketPlan(page.window.start, page.window.end);\n  const totals = new Set(options.totals ?? []);\n  const results = useDashboardRequests(\n    view.queries.map(q =>\n      buildRequest(q, page, { interval: q.id !== undefined && totals.has(q.id) ? undefined : interval }),\n    ),\n  );\n  const sent = results.filter(r => r !== undefined);\n  const hasTraceQueries = view.queries.some(q => q.source === 'traceAggregate' || q.source === 'spanAggregate');\n  const onClick = useDrilldown(widget, view, onDrilldown);\n\n  const isLoading = sent.some(r => r.isLoading);\n  const shaped = shapeTimeseries({\n    options,\n    responses: answersById(\n      view.queries,\n      results.map(r => r?.data),\n    ),\n    window: page.window,\n    hasTraceQueries,\n  });\n  const format = FORMATTERS[options.format];\n  const lines: MetricsLineChartSeries[] = shaped.series.map(s => ({\n    dataKey: s.dataKey,\n    label: s.label,\n    color: chartColor(s.color),\n    emphasis: s.emphasis,\n  }));\n  // Series with a range total each show theirs, marked like their line: they count different things.\n  const rangeTotals = shaped.series.flatMap(s =>\n    s.rangeTotal === undefined\n      ? []\n      : [{ label: s.label, value: format.value(s.rangeTotal), color: chartColor(s.color) }],\n  );\n  const withRangeTotals = options.series.some(s => s.rangeTotal !== undefined);\n\n  const layout = {\n    ...heading,\n    actions: hasDrilldownAction(widget, view, onDrilldown) ? (\n      <DrilldownAction widget={widget} view={view} onDrilldown={onDrilldown} />\n    ) : undefined,\n    total: withRangeTotals ? rangeTotals : undefined,\n    isLoading,\n    toolbar: lines.length > 0 && (\n      <MetricsCard.Toolbar>\n        <MetricsLineChartLegend series={lines} />\n      </MetricsCard.Toolbar>\n    ),\n  };\n\n  const failed = sent.filter(r => r.isError);\n  if (failed.length) {\n    return (\n      <ChartCard {...layout}>\n        {hasTraceQueries ? (\n          <ChartCardError error={failed[0]?.error} onRetry={() => failed.forEach(r => void r.refetch())} />\n        ) : (\n          <ChartCardError />\n        )}\n      </ChartCard>\n    );\n  }\n\n  const totalFormat = FORMATTERS[options.total?.format ?? options.format];\n  const total =\n    options.total &&\n    (typeof options.total.value === 'object' && 'peak' in options.total.value && !shaped.total\n      ? '—'\n      : totalFormat.value(shaped.total ?? 0));\n\n  const chart = {\n    data: shaped.data,\n    series: lines,\n    height: 'fill' as const,\n    xLabels: options.xLabels,\n    showLegend: false,\n    valueFormatter: format.value,\n    axisFormatter: options.axis === false ? undefined : format.axis,\n    onBucketClick:\n      onClick &&\n      ((row: Record<string, unknown>) => onClick({ window: bucketWindow(Number(row.ts), shaped.stepHours) })),\n    isLoading,\n    ...(options.xLabels ? EDGE_BUCKET_AXIS : BUCKET_AXIS),\n  };\n  const yDomain = shaped.flat && options.flatYDomain ? options.flatYDomain : options.yDomain;\n\n  return (\n    <ChartCard {...layout} total={layout.total ?? total} isUpdating={sent.some(r => r.isRefetching)}>\n      <ChartArea isEmpty={!isLoading && shaped.empty} emptyMessage={options.emptyMessage}>\n        {options.chart === 'stackedBar' ? (\n          <MetricsStackedBarChart {...chart} />\n        ) : (\n          <MetricsLineChart {...chart} yDomain={yDomain} lineStyle=\"thin\" />\n        )}\n      </ChartArea>\n    </ChartCard>\n  );\n}\n"],"mappings":"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"}

package/dist/domains/dashboards/kinds/timeseries/timeseries-widget.es.js

@@ -3,22 +3,22 @@ import { buildRequest } from "../../lib/requests.es.js";
 import { ViewGate } from "../../components/view-gate.es.js";
 import { useDashboardRequests } from "../../hooks/use-dashboard-requests.es.js";
 import { answersById } from "../../lib/values.es.js";
-import { t as MetricsCard } from "../../../../MetricsCard-M8awJ2B_.js";
+import { t as MetricsCard } from "../../../../MetricsCard-ua6C6b8a.js";
 import { ChartArea } from "../../../metrics/components/chart-area.es.js";
 import { ChartCard } from "../../../metrics/components/chart-card.es.js";
 import { ChartCardError } from "../../../metrics/components/chart-card-error.es.js";
 import { BUCKET_AXIS, EDGE_BUCKET_AXIS } from "../../../metrics/lib/chart-axis.es.js";
 import { FORMATTERS, chartColor } from "../../lib/format.es.js";
-import { r as MetricsLineChartLegend, t as MetricsLineChart } from "../../../../MetricsLineChart-BhHoduO0.js";
+import { r as MetricsLineChartLegend, t as MetricsLineChart } from "../../../../MetricsLineChart-4SwxBbQx.js";
 import { hasDrilldownAction, useDrilldown, useViewMenu } from "../../hooks/use-widget-views.es.js";
 import { shapeTimeseries } from "../../lib/timeseries.es.js";
 import { PendingChartCard } from "../../components/widget-chrome.es.js";
 import { DrilldownAction } from "../../components/widget-controls.es.js";
-import { t as MetricsStackedBarChart } from "../../../../MetricsStackedBarChart-BRuA6MTE.js";
+import { t as MetricsStackedBarChart } from "../../../../MetricsStackedBarChart-D2QyS4-z.js";
 import { jsx } from "react/jsx-runtime";
 // src/domains/dashboards/kinds/timeseries/timeseries-widget.tsx
 function TimeseriesWidget(props) {
-	const { view, heading } = useViewMenu(props.widget, props.views);
+	const { view, heading } = useViewMenu(props.widget, props.views, 0, props.expand);
 	return /* @__PURE__ */ jsx(ViewGate, {
 		queries: view.queries,
 		pending: (gate) => /* @__PURE__ */ jsx(PendingChartCard, {
@@ -104,7 +104,8 @@ function TimeseriesView({ widget, view, heading, page, onDrilldown }) {
 			emptyMessage: options.emptyMessage,
 			children: options.chart === "stackedBar" ? /* @__PURE__ */ jsx(MetricsStackedBarChart, { ...chart }) : /* @__PURE__ */ jsx(MetricsLineChart, {
 				...chart,
-				yDomain
+				yDomain,
+				lineStyle: "thin"
 			})
 		})
 	});

package/dist/domains/dashboards/kinds/timeseries/timeseries-widget.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"timeseries-widget.es.js","names":[],"sources":["../../../../../src/domains/dashboards/kinds/timeseries/timeseries-widget.tsx"],"sourcesContent":["import { ChartArea } from '../../../metrics/components/chart-area';\nimport { ChartCard } from '../../../metrics/components/chart-card';\nimport { ChartCardError } from '../../../metrics/components/chart-card-error';\nimport { BUCKET_AXIS, EDGE_BUCKET_AXIS } from '../../../metrics/lib/chart-axis';\nimport { bucketPlan, bucketWindow } from '../../../metrics/lib/metrics-buckets';\nimport { ViewGate } from '../../components/view-gate';\nimport { PendingChartCard } from '../../components/widget-chrome';\nimport { DrilldownAction } from '../../components/widget-controls';\nimport { useDashboardRequests } from '../../hooks/use-dashboard-requests';\nimport { hasDrilldownAction, useDrilldown, useViewMenu } from '../../hooks/use-widget-views';\nimport type { ViewHeading } from '../../lib/chrome';\nimport { chartColor, FORMATTERS } from '../../lib/format';\nimport { buildRequest } from '../../lib/requests';\nimport type { DashboardPageContext } from '../../lib/requests';\nimport { shapeTimeseries } from '../../lib/timeseries';\nimport type { TimeseriesOptions } from '../../lib/timeseries';\nimport { answersById } from '../../lib/values';\nimport type { ResolvedView, WidgetKindProps } from '../../widget-kind';\nimport { MetricsCard } from '@/ds/components/MetricsCard';\nimport { MetricsLineChart, MetricsLineChartLegend } from '@/ds/components/MetricsLineChart';\nimport type { MetricsLineChartSeries } from '@/ds/components/MetricsLineChart';\nimport { MetricsStackedBarChart } from '@/ds/components/MetricsStackedBarChart';\n\ntype Props = WidgetKindProps<TimeseriesOptions>;\ntype ViewProps = Props & {\n  view: ResolvedView<TimeseriesOptions>;\n  heading: ViewHeading;\n  page: DashboardPageContext;\n};\n\nexport function TimeseriesWidget(props: Props) {\n  const { view, heading } = useViewMenu(props.widget, props.views);\n  return (\n    <ViewGate queries={view.queries} pending={gate => <PendingChartCard gate={gate} heading={heading} />}>\n      {page => <TimeseriesView {...props} view={view} heading={heading} page={page} />}\n    </ViewGate>\n  );\n}\n\nfunction TimeseriesView({ widget, view, heading, page, onDrilldown }: ViewProps) {\n  const { options } = view;\n  const { interval } = bucketPlan(page.window.start, page.window.end);\n  const totals = new Set(options.totals ?? []);\n  const results = useDashboardRequests(\n    view.queries.map(q =>\n      buildRequest(q, page, { interval: q.id !== undefined && totals.has(q.id) ? undefined : interval }),\n    ),\n  );\n  const sent = results.filter(r => r !== undefined);\n  const hasTraceQueries = view.queries.some(q => q.source === 'traceAggregate' || q.source === 'spanAggregate');\n  const onClick = useDrilldown(widget, view, onDrilldown);\n\n  const isLoading = sent.some(r => r.isLoading);\n  const shaped = shapeTimeseries({\n    options,\n    responses: answersById(\n      view.queries,\n      results.map(r => r?.data),\n    ),\n    window: page.window,\n    hasTraceQueries,\n  });\n  const format = FORMATTERS[options.format];\n  const lines: MetricsLineChartSeries[] = shaped.series.map(s => ({\n    dataKey: s.dataKey,\n    label: s.label,\n    color: chartColor(s.color),\n    emphasis: s.emphasis,\n  }));\n  // Series with a range total each show theirs, marked like their line: they count different things.\n  const rangeTotals = shaped.series.flatMap(s =>\n    s.rangeTotal === undefined\n      ? []\n      : [{ label: s.label, value: format.value(s.rangeTotal), color: chartColor(s.color) }],\n  );\n  const withRangeTotals = options.series.some(s => s.rangeTotal !== undefined);\n\n  const layout = {\n    ...heading,\n    actions: hasDrilldownAction(widget, view, onDrilldown) ? (\n      <DrilldownAction widget={widget} view={view} onDrilldown={onDrilldown} />\n    ) : undefined,\n    total: withRangeTotals ? rangeTotals : undefined,\n    isLoading,\n    toolbar: lines.length > 0 && (\n      <MetricsCard.Toolbar>\n        <MetricsLineChartLegend series={lines} />\n      </MetricsCard.Toolbar>\n    ),\n  };\n\n  const failed = sent.filter(r => r.isError);\n  if (failed.length) {\n    return (\n      <ChartCard {...layout}>\n        {hasTraceQueries ? (\n          <ChartCardError error={failed[0]?.error} onRetry={() => failed.forEach(r => void r.refetch())} />\n        ) : (\n          <ChartCardError />\n        )}\n      </ChartCard>\n    );\n  }\n\n  const totalFormat = FORMATTERS[options.total?.format ?? options.format];\n  const total =\n    options.total &&\n    (typeof options.total.value === 'object' && 'peak' in options.total.value && !shaped.total\n      ? '—'\n      : totalFormat.value(shaped.total ?? 0));\n\n  const chart = {\n    data: shaped.data,\n    series: lines,\n    height: 'fill' as const,\n    xLabels: options.xLabels,\n    showLegend: false,\n    valueFormatter: format.value,\n    axisFormatter: options.axis === false ? undefined : format.axis,\n    onBucketClick:\n      onClick &&\n      ((row: Record<string, unknown>) => onClick({ window: bucketWindow(Number(row.ts), shaped.stepHours) })),\n    isLoading,\n    ...(options.xLabels ? EDGE_BUCKET_AXIS : BUCKET_AXIS),\n  };\n  const yDomain = shaped.flat && options.flatYDomain ? options.flatYDomain : options.yDomain;\n\n  return (\n    <ChartCard {...layout} total={layout.total ?? total} isUpdating={sent.some(r => r.isRefetching)}>\n      <ChartArea isEmpty={!isLoading && shaped.empty} emptyMessage={options.emptyMessage}>\n        {options.chart === 'stackedBar' ? (\n          <MetricsStackedBarChart {...chart} />\n        ) : (\n          <MetricsLineChart {...chart} yDomain={yDomain} />\n        )}\n      </ChartArea>\n    </ChartCard>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"timeseries-widget.es.js","names":[],"sources":["../../../../../src/domains/dashboards/kinds/timeseries/timeseries-widget.tsx"],"sourcesContent":["import { ChartArea } from '../../../metrics/components/chart-area';\nimport { ChartCard } from '../../../metrics/components/chart-card';\nimport { ChartCardError } from '../../../metrics/components/chart-card-error';\nimport { BUCKET_AXIS, EDGE_BUCKET_AXIS } from '../../../metrics/lib/chart-axis';\nimport { bucketPlan, bucketWindow } from '../../../metrics/lib/metrics-buckets';\nimport { ViewGate } from '../../components/view-gate';\nimport { PendingChartCard } from '../../components/widget-chrome';\nimport { DrilldownAction } from '../../components/widget-controls';\nimport { useDashboardRequests } from '../../hooks/use-dashboard-requests';\nimport { hasDrilldownAction, useDrilldown, useViewMenu } from '../../hooks/use-widget-views';\nimport type { ViewHeading } from '../../lib/chrome';\nimport { chartColor, FORMATTERS } from '../../lib/format';\nimport { buildRequest } from '../../lib/requests';\nimport type { DashboardPageContext } from '../../lib/requests';\nimport { shapeTimeseries } from '../../lib/timeseries';\nimport type { TimeseriesOptions } from '../../lib/timeseries';\nimport { answersById } from '../../lib/values';\nimport type { ResolvedView, WidgetKindProps } from '../../widget-kind';\nimport { MetricsCard } from '@/ds/components/MetricsCard';\nimport { MetricsLineChart, MetricsLineChartLegend } from '@/ds/components/MetricsLineChart';\nimport type { MetricsLineChartSeries } from '@/ds/components/MetricsLineChart';\nimport { MetricsStackedBarChart } from '@/ds/components/MetricsStackedBarChart';\n\ntype Props = WidgetKindProps<TimeseriesOptions>;\ntype ViewProps = Props & {\n  view: ResolvedView<TimeseriesOptions>;\n  heading: ViewHeading;\n  page: DashboardPageContext;\n};\n\nexport function TimeseriesWidget(props: Props) {\n  const { view, heading } = useViewMenu(props.widget, props.views, 0, props.expand);\n  return (\n    <ViewGate queries={view.queries} pending={gate => <PendingChartCard gate={gate} heading={heading} />}>\n      {page => <TimeseriesView {...props} view={view} heading={heading} page={page} />}\n    </ViewGate>\n  );\n}\n\nfunction TimeseriesView({ widget, view, heading, page, onDrilldown }: ViewProps) {\n  const { options } = view;\n  const { interval } = bucketPlan(page.window.start, page.window.end);\n  const totals = new Set(options.totals ?? []);\n  const results = useDashboardRequests(\n    view.queries.map(q =>\n      buildRequest(q, page, { interval: q.id !== undefined && totals.has(q.id) ? undefined : interval }),\n    ),\n  );\n  const sent = results.filter(r => r !== undefined);\n  const hasTraceQueries = view.queries.some(q => q.source === 'traceAggregate' || q.source === 'spanAggregate');\n  const onClick = useDrilldown(widget, view, onDrilldown);\n\n  const isLoading = sent.some(r => r.isLoading);\n  const shaped = shapeTimeseries({\n    options,\n    responses: answersById(\n      view.queries,\n      results.map(r => r?.data),\n    ),\n    window: page.window,\n    hasTraceQueries,\n  });\n  const format = FORMATTERS[options.format];\n  const lines: MetricsLineChartSeries[] = shaped.series.map(s => ({\n    dataKey: s.dataKey,\n    label: s.label,\n    color: chartColor(s.color),\n    emphasis: s.emphasis,\n  }));\n  // Series with a range total each show theirs, marked like their line: they count different things.\n  const rangeTotals = shaped.series.flatMap(s =>\n    s.rangeTotal === undefined\n      ? []\n      : [{ label: s.label, value: format.value(s.rangeTotal), color: chartColor(s.color) }],\n  );\n  const withRangeTotals = options.series.some(s => s.rangeTotal !== undefined);\n\n  const layout = {\n    ...heading,\n    actions: hasDrilldownAction(widget, view, onDrilldown) ? (\n      <DrilldownAction widget={widget} view={view} onDrilldown={onDrilldown} />\n    ) : undefined,\n    total: withRangeTotals ? rangeTotals : undefined,\n    isLoading,\n    toolbar: lines.length > 0 && (\n      <MetricsCard.Toolbar>\n        <MetricsLineChartLegend series={lines} />\n      </MetricsCard.Toolbar>\n    ),\n  };\n\n  const failed = sent.filter(r => r.isError);\n  if (failed.length) {\n    return (\n      <ChartCard {...layout}>\n        {hasTraceQueries ? (\n          <ChartCardError error={failed[0]?.error} onRetry={() => failed.forEach(r => void r.refetch())} />\n        ) : (\n          <ChartCardError />\n        )}\n      </ChartCard>\n    );\n  }\n\n  const totalFormat = FORMATTERS[options.total?.format ?? options.format];\n  const total =\n    options.total &&\n    (typeof options.total.value === 'object' && 'peak' in options.total.value && !shaped.total\n      ? '—'\n      : totalFormat.value(shaped.total ?? 0));\n\n  const chart = {\n    data: shaped.data,\n    series: lines,\n    height: 'fill' as const,\n    xLabels: options.xLabels,\n    showLegend: false,\n    valueFormatter: format.value,\n    axisFormatter: options.axis === false ? undefined : format.axis,\n    onBucketClick:\n      onClick &&\n      ((row: Record<string, unknown>) => onClick({ window: bucketWindow(Number(row.ts), shaped.stepHours) })),\n    isLoading,\n    ...(options.xLabels ? EDGE_BUCKET_AXIS : BUCKET_AXIS),\n  };\n  const yDomain = shaped.flat && options.flatYDomain ? options.flatYDomain : options.yDomain;\n\n  return (\n    <ChartCard {...layout} total={layout.total ?? total} isUpdating={sent.some(r => r.isRefetching)}>\n      <ChartArea isEmpty={!isLoading && shaped.empty} emptyMessage={options.emptyMessage}>\n        {options.chart === 'stackedBar' ? (\n          <MetricsStackedBarChart {...chart} />\n        ) : (\n          <MetricsLineChart {...chart} yDomain={yDomain} lineStyle=\"thin\" />\n        )}\n      </ChartArea>\n    </ChartCard>\n  );\n}\n"],"mappings":"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"}

package/dist/domains/dashboards/lib/chrome.cjs.js

@@ -16,9 +16,16 @@ var viewValue = (label, index) => {
 var viewLabel = (label, index) => label?.trim() || `View ${index + 1}`;
 /**
 * The card title for the open view: the widget's title for a single view; with several, the open
-* view's label, as a menu of every view (as the metrics cards switch views).
+* view's label, as a menu of every view (as the metrics cards switch views). With somewhere to
+* expand to, the widget's title links there instead.
 */
-function viewTitle(widget, views, index, onChoose) {
+function viewTitle(widget, views, index, onChoose, expand) {
+	const href = expand?.href(widget);
+	if (href) return {
+		title: widget.title?.trim() ? widget.title : viewLabel(views[0]?.label, 0),
+		href,
+		LinkComponent: expand?.LinkComponent
+	};
 	if (views.length < 2) return { title: widget.title ?? "" };
 	const options = views.map((v, i) => ({
 		value: viewValue(v.label, i),

package/dist/domains/dashboards/lib/chrome.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"chrome.cjs.js","names":[],"sources":["../../../../src/domains/dashboards/lib/chrome.ts"],"sourcesContent":["import type { DashboardWidget, DashboardWidgetView } from '@mastra/client-js';\nimport type { ChartCardProps } from '../../metrics/components/chart-card';\n\n/** What a widget's card shows as its title: `title`, and `titleMenu` with several views. */\nexport type ViewHeading = Pick<ChartCardProps, 'title' | 'titleMenu'>;\n\n/** Filters a gate can't apply, named as the filter bar names them. */\nconst FILTER_NAMES: Record<string, string> = {\n  serviceName: 'service',\n  requestId: 'request ID',\n  experimentId: 'experiment',\n};\n\nexport const unsupportedMessage = (fields: string[], names: Record<string, string> = FILTER_NAMES) =>\n  `Not available with a ${fields.map(f => names[f] ?? f).join(' or ')} filter.`;\n\n/** A view's value in the card's menu: its label in kebab case (`Token usage` → `token-usage`), or its position when unlabelled or blank. */\nexport const viewValue = (label: string | undefined, index: number) => {\n  const trimmed = label?.trim();\n  return trimmed ? trimmed.toLowerCase().replace(/\\s+/g, '-') : String(index);\n};\n\n/** A view's visible name: its label, or `View n` when unlabelled or blank, so every option has an accessible name. */\nexport const viewLabel = (label: string | undefined, index: number) => label?.trim() || `View ${index + 1}`;\n\n/**\n * The card title for the open view: the widget's title for a single view; with several, the open\n * view's label, as a menu of every view (as the metrics cards switch views).\n */\nexport function viewTitle(\n  widget: DashboardWidget,\n  views: readonly DashboardWidgetView[],\n  index: number,\n  onChoose: (index: number) => void,\n): ViewHeading {\n  if (views.length < 2) return { title: widget.title ?? '' };\n  const options = views.map((v, i) => ({ value: viewValue(v.label, i), label: viewLabel(v.label, i) }));\n  return {\n    title: options[index]?.label ?? '',\n    titleMenu: {\n      value: options[index]?.value ?? '',\n      onValueChange: (value: string) => onChoose(options.findIndex(o => o.value === value)),\n      options,\n    },\n  };\n}\n"],"mappings":";;;AAOA,IAAM,eAAuC;CAC3C,aAAa;CACb,WAAW;CACX,cAAc;AAChB;AAEA,IAAa,sBAAsB,QAAkB,QAAgC,iBACnF,wBAAwB,OAAO,KAAI,MAAK,MAAM,MAAM,CAAC,CAAC,CAAC,KAAK,MAAM,EAAE;;AAGtE,IAAa,aAAa,OAA2B,UAAkB;CACrE,MAAM,UAAU,OAAO,KAAK;CAC5B,OAAO,UAAU,QAAQ,YAAY,CAAC,CAAC,QAAQ,QAAQ,GAAG,IAAI,OAAO,KAAK;AAC5E;;AAGA,IAAa,aAAa,OAA2B,UAAkB,OAAO,KAAK,KAAK,QAAQ,QAAQ;;;;;AAMxG,SAAgB,UACd,QACA,OACA,OACA,UACa;CACb,IAAI,MAAM,SAAS,GAAG,OAAO,EAAE,OAAO,OAAO,SAAS,GAAG;CACzD,MAAM,UAAU,MAAM,KAAK,GAAG,OAAO;EAAE,OAAO,UAAU,EAAE,OAAO,CAAC;EAAG,OAAO,UAAU,EAAE,OAAO,CAAC;CAAE,EAAE;CACpG,OAAO;EACL,OAAO,QAAQ,MAAM,EAAE,SAAS;EAChC,WAAW;GACT,OAAO,QAAQ,MAAM,EAAE,SAAS;GAChC,gBAAgB,UAAkB,SAAS,QAAQ,WAAU,MAAK,EAAE,UAAU,KAAK,CAAC;GACpF;EACF;CACF;AACF"}
+{"version":3,"file":"chrome.cjs.js","names":[],"sources":["../../../../src/domains/dashboards/lib/chrome.ts"],"sourcesContent":["import type { DashboardWidget, DashboardWidgetView } from '@mastra/client-js';\nimport type { ChartCardProps } from '../../metrics/components/chart-card';\nimport type { DashboardExpand } from '../widget-kind';\n\n/** What a widget's card shows as its title: `title`, and `titleMenu` with several views or an expand link. */\nexport type ViewHeading = Pick<ChartCardProps, 'title' | 'titleMenu' | 'href' | 'LinkComponent'>;\n\n/** Filters a gate can't apply, named as the filter bar names them. */\nconst FILTER_NAMES: Record<string, string> = {\n  serviceName: 'service',\n  requestId: 'request ID',\n  experimentId: 'experiment',\n};\n\nexport const unsupportedMessage = (fields: string[], names: Record<string, string> = FILTER_NAMES) =>\n  `Not available with a ${fields.map(f => names[f] ?? f).join(' or ')} filter.`;\n\n/** A view's value in the card's menu: its label in kebab case (`Token usage` → `token-usage`), or its position when unlabelled or blank. */\nexport const viewValue = (label: string | undefined, index: number) => {\n  const trimmed = label?.trim();\n  return trimmed ? trimmed.toLowerCase().replace(/\\s+/g, '-') : String(index);\n};\n\n/** A view's visible name: its label, or `View n` when unlabelled or blank, so every option has an accessible name. */\nexport const viewLabel = (label: string | undefined, index: number) => label?.trim() || `View ${index + 1}`;\n\n/**\n * The card title for the open view: the widget's title for a single view; with several, the open\n * view's label, as a menu of every view (as the metrics cards switch views). With somewhere to\n * expand to, the widget's title links there instead.\n */\nexport function viewTitle(\n  widget: DashboardWidget,\n  views: readonly DashboardWidgetView[],\n  index: number,\n  onChoose: (index: number) => void,\n  expand?: DashboardExpand,\n): ViewHeading {\n  const href = expand?.href(widget);\n  if (href) {\n    // A link needs a name: a blank title falls back to the first view's label.\n    const title = widget.title?.trim() ? widget.title : viewLabel(views[0]?.label, 0);\n    return { title, href, LinkComponent: expand?.LinkComponent };\n  }\n  if (views.length < 2) return { title: widget.title ?? '' };\n  const options = views.map((v, i) => ({ value: viewValue(v.label, i), label: viewLabel(v.label, i) }));\n  return {\n    title: options[index]?.label ?? '',\n    titleMenu: {\n      value: options[index]?.value ?? '',\n      onValueChange: (value: string) => onChoose(options.findIndex(o => o.value === value)),\n      options,\n    },\n  };\n}\n"],"mappings":";;;AAQA,IAAM,eAAuC;CAC3C,aAAa;CACb,WAAW;CACX,cAAc;AAChB;AAEA,IAAa,sBAAsB,QAAkB,QAAgC,iBACnF,wBAAwB,OAAO,KAAI,MAAK,MAAM,MAAM,CAAC,CAAC,CAAC,KAAK,MAAM,EAAE;;AAGtE,IAAa,aAAa,OAA2B,UAAkB;CACrE,MAAM,UAAU,OAAO,KAAK;CAC5B,OAAO,UAAU,QAAQ,YAAY,CAAC,CAAC,QAAQ,QAAQ,GAAG,IAAI,OAAO,KAAK;AAC5E;;AAGA,IAAa,aAAa,OAA2B,UAAkB,OAAO,KAAK,KAAK,QAAQ,QAAQ;;;;;;AAOxG,SAAgB,UACd,QACA,OACA,OACA,UACA,QACa;CACb,MAAM,OAAO,QAAQ,KAAK,MAAM;CAChC,IAAI,MAGF,OAAO;EAAE,OADK,OAAO,OAAO,KAAK,IAAI,OAAO,QAAQ,UAAU,MAAM,EAAE,EAAE,OAAO,CAAC;EAChE;EAAM,eAAe,QAAQ;CAAc;CAE7D,IAAI,MAAM,SAAS,GAAG,OAAO,EAAE,OAAO,OAAO,SAAS,GAAG;CACzD,MAAM,UAAU,MAAM,KAAK,GAAG,OAAO;EAAE,OAAO,UAAU,EAAE,OAAO,CAAC;EAAG,OAAO,UAAU,EAAE,OAAO,CAAC;CAAE,EAAE;CACpG,OAAO;EACL,OAAO,QAAQ,MAAM,EAAE,SAAS;EAChC,WAAW;GACT,OAAO,QAAQ,MAAM,EAAE,SAAS;GAChC,gBAAgB,UAAkB,SAAS,QAAQ,WAAU,MAAK,EAAE,UAAU,KAAK,CAAC;GACpF;EACF;CACF;AACF"}