@xenosystem/blocks 0.13.9 → 0.13.11

package/dist/data/index.d.ts

@@ -1,7 +1,7 @@
 import { PanelModule, PanelManifest, BlockDeclaration, LogSink } from '@xenosystem/block-sdk';
 import * as _xenosystem_data_core from '@xenosystem/data-core';
 import { XenoColumn, XenoQuery, XenoResultSet, XenoValue, XenoRow, XenoAggFn, XenoValueFormat, XenoFilterGroup, XenoColumnRole, XenoSchemaCatalog, XenoFilter, XenoSourceSchema } from '@xenosystem/data-core';
-import { ReactNode } from 'react';
+import { ReactNode, ReactElement } from 'react';
 import { C as ConnectorExecuteInput, a as ConnectorExecuteOutput, b as ConnectorsPanelState, S as SubstrateFacilities, c as ConnectorsViewState, d as XenoConnection, e as XenoCredentialFormSpec, f as XenoCredentialResult, g as XenoConnectionStatus, P as PushdownSplit, h as XenoConnectorQueryRequest, i as XenoRestPaging, j as XenoConnectorFetch, k as XenoResolverErrorCode, l as XenoConnectorFileReader, X as XenoSqlEngine, m as ConnectorTransport, n as XenoCredentialField } from '../transport-B1cdciP8.js';
 export { B as BrowserFetchOptions, o as ConnectorTransportError, p as SECRET_HEADER_NAMES, q as XenoConnectionConfig, r as XenoConnectionHealth, s as XenoConnectionKind, t as XenoConnectionState, u as XenoConnectorCapabilities, v as XenoCredentialSubmission, w as XenoFetchRequest, x as XenoFetchResponse, y as XenoFileReadRequest, z as XenoFileReadResponse, A as XenoRefreshPolicy, D as XenoSqlTable, E as browserFetch, F as classifyBrowserFetchFailure, G as defaultCapabilitiesFor, H as errorResult, I as evaluateSupport, J as facilitiesOf, K as normalizePaging, L as secretHeaderNames } from '../transport-B1cdciP8.js';
 
@@ -1107,25 +1107,79 @@ declare function buildChartData(result: XenoResultSet, encoding: XenoChartEncodi
 declare function rowsForMark(result: XenoResultSet, encoding: XenoChartEncoding, label: string, seriesId?: string): string[];
 
 /**
- * The Chart panel view.
+ * The Chart panel AS A DECLARATION — the thirteenth declared block.
  *
- * Composes `@xenosystem/components/chrome`; the host must ensure `@xenosystem/workbench/primitives.css` is
- * present. The plot area delegates to the installed renderer (see `renderer.ts`) — this view owns
- * the chrome and the states, not the marks.
+ * Everything drawn is data: the chart-type control, the partial / aggregating badges and the export
+ * button in the toolbar, the four body states (error, no data, nothing to plot, no renderer), the
+ * status bar. The PLOT is the one thing a declaration cannot hold — `chart/Plot` is the runtime-bound
+ * unit: the element the host's renderer (Chart.js or another) draws the marks into, re-rendered
+ * from the controller's data and highlights. The panel ships the model; the host ships the marks.
+ */
+
+declare const CHART_TYPE_LABELS: Record<string, string>;
+declare const DEFAULT_CHART_OPTIONS: ChartRenderOptions;
+interface ChartViewModel {
+    types: {
+        value: string;
+        label: string;
+    }[];
+    type: string;
+    partial: boolean;
+    aggregating: boolean;
+    aggregatingHint?: string;
+    errorMessage?: string;
+    errored: boolean;
+    empty: boolean;
+    emptyHint: string;
+    unplottable: boolean;
+    encodingProblem?: string;
+    noRenderer: boolean;
+    plot: boolean;
+    countLabel?: string;
+    highlightLabel?: string;
+}
+type ChartUiIntent = {
+    kind: 'type';
+    type: XenoChartType;
+} | {
+    kind: 'export';
+};
+interface ChartViewOptions {
+    emptyHint?: string;
+}
+/** Derive the view from the live controller — the runtime calls this on every draw. */
+declare function chartViewState(c: ChartController, options?: ChartViewOptions): ChartViewModel;
+declare function applyChartUi(c: ChartController, intent: ChartUiIntent): void;
+declare const chartViewManifest: PanelManifest;
+declare const BEHAVIOURS$2: {
+    'data/chartPanelView': (inputs: Record<string, unknown>) => ChartViewModel;
+};
+/** The runtime-bound unit: the plot surface the host renderer draws into. */
+declare const CHART_RUNTIME_UNITS: readonly ["chart/Plot"];
+declare const CHART_DECLARATION: BlockDeclaration;
+
+/**
+ * The Chart panel view — the CODE VIEW of `CHART_DECLARATION`, drawing the same `ChartViewModel`
+ * byte-identical (the equivalence suite holds the two together). The one thing this file owns that
+ * the declaration cannot is `chart/Plot`: the element the host renderer draws the marks into.
  *
- * **There is no shelf UI here.** The encoding editor is `xeno.core.fields` with chart shelves,
- * wired as a sibling panel; building a second shelf UI is exactly what sequencing chart after fields
- * was meant to avoid.
+ * Composes `@xenosystem/components/chrome`; the host must ensure `@xenosystem/workbench/primitives.css` is
+ * present.
  *
  * @module
  */
 
 /** Props for {@link ChartPanelView}. */
-interface ChartPanelViewProps {
+interface ChartPanelViewProps extends ChartViewOptions {
     controller: ChartController;
     options?: Partial<ChartRenderOptions>;
-    emptyHint?: string;
 }
+/** `chart/Plot` — the plot surface. The runtime registers it bound to its controller and render options. */
+declare function ChartPlot({ controller, options }: {
+    controller: ChartController;
+    options?: Partial<ChartRenderOptions>;
+}): ReactElement;
+declare function chartRuntimeComponents(controller: ChartController, options?: Partial<ChartRenderOptions>): Record<(typeof CHART_RUNTIME_UNITS)[number], React.ComponentType<any>>;
 /** The Chart panel view. */
 declare function ChartPanelView({ controller, options, emptyHint }: ChartPanelViewProps): ReactNode;
 
@@ -1401,18 +1455,59 @@ declare const METRICS_PANEL_ID = "xeno.core.metrics";
 declare const metricsManifest: PanelManifest;
 
 /**
- * The Metrics panel view — tiles, deltas, sparklines, threshold tone.
+ * The Metrics panel AS A DECLARATION — the twelfth declared block: KPI tiles over a data-core result.
  *
- * Composes `@xenosystem/components/chrome` (`StatTile`, `Badge`, `SegmentedControl`, `Sparkline`); the
- * host must ensure `@xenosystem/workbench/primitives.css` is present. Nothing here is a local re-cut —
- * the sparkline moved into the primitives so there is exactly one.
- *
- * @module
+ * Everything drawn is data: the range control and partial badge in the toolbar (only when ranges
+ * exist), the error and empty states, a `TileGrid` of `StatTile`s — each with its level badge, its
+ * display value (an em dash for a partial null, never a zero), a `Delta` toned by the metric's
+ * direction, the partial note, the `Sparkline` — and the status bar. A tile activates as a real
+ * button (`StatTile.onActivate`). No runtime-bound unit.
  */
 
-/** Props for {@link MetricsPanelView}. */
-interface MetricsPanelViewProps {
-    controller: MetricsController;
+interface MetricsViewTile {
+    id: string;
+    label: string;
+    title?: string;
+    value: string;
+    level: string;
+    hasLevel: boolean;
+    tone: 'error' | 'warning';
+    hasDelta: boolean;
+    delta: number;
+    deltaTone: 'good' | 'bad' | 'neutral';
+    partial: boolean;
+    hasSpark: boolean;
+    spark: number[];
+    sparkLabel: string;
+}
+interface MetricsViewModel {
+    hasRanges: boolean;
+    ranges: {
+        value: string;
+        label: string;
+    }[];
+    rangeId: string;
+    partial: boolean;
+    partialHint: string;
+    errorMessage?: string;
+    errored: boolean;
+    empty: boolean;
+    emptyHint: string;
+    ready: boolean;
+    layout: 'grid' | 'row' | 'list';
+    columns: number;
+    tiles: MetricsViewTile[];
+    countLabel: string;
+    partialLabel?: string;
+}
+type MetricsUiIntent = {
+    kind: 'range';
+    rangeId: string;
+} | {
+    kind: 'activate';
+    metricId: string;
+};
+interface MetricsViewOptions {
     layout?: 'grid' | 'row' | 'list';
     columns?: number;
     sparkline?: boolean;
@@ -1420,8 +1515,33 @@ interface MetricsPanelViewProps {
     emptyHint?: string;
     partialHint?: string;
 }
+/** Derive the view from the live controller — the runtime calls this on every draw. */
+declare function metricsViewState(c: MetricsController, options?: MetricsViewOptions): MetricsViewModel;
+declare function applyMetricsUi(c: MetricsController, intent: MetricsUiIntent): void;
+declare const metricsViewManifest: PanelManifest;
+declare const BEHAVIOURS$1: {
+    'data/metricsPanelView': (inputs: Record<string, unknown>) => MetricsViewModel;
+};
+declare const METRICS_RUNTIME_UNITS: readonly [];
+declare const METRICS_DECLARATION: BlockDeclaration;
+
+/**
+ * The Metrics panel view — the CODE VIEW of `METRICS_DECLARATION`, drawing the same
+ * `MetricsViewModel` byte-identical (the equivalence suite holds the two together). No runtime-bound
+ * unit; every intent goes through `applyMetricsUi`.
+ *
+ * Composes `@xenosystem/components/chrome`; the host must ensure `@xenosystem/workbench/primitives.css` is
+ * present.
+ *
+ * @module
+ */
+
+/** Props for {@link MetricsPanelView}. */
+interface MetricsPanelViewProps extends MetricsViewOptions {
+    controller: MetricsController;
+}
 /** The Metrics panel view. */
-declare function MetricsPanelView({ controller, layout, columns, sparkline, showDelta, emptyHint, partialHint, }: MetricsPanelViewProps): ReactNode;
+declare function MetricsPanelView({ controller, ...options }: MetricsPanelViewProps): ReactNode;
 
 /**
  * The `xeno.core.fields` contract — the query AUTHOR.
@@ -3381,4 +3501,4 @@ interface ConnectorsPanelViewProps {
 /** The Connectors panel view. */
 declare function ConnectorsPanelView({ controller, emptyHint, }: ConnectorsPanelViewProps): ReactNode;
 
-export { AGENT_HIDDEN_COMMANDS, ALL_AGGREGATES, ALL_CHART_TYPES, type BuildChartOptions, type BuildSelectOptions, type BuildSelectResult, CHART_EMPTY_FILL, CHART_PALETTE_STEPS, CHART_PANEL_ID, CONNECTORS_PANEL_ID, type CellAddress, ChartController, type ChartControllerOptions, type ChartHostBridge, type ChartPanelState, ChartPanelView, type ChartPanelViewProps, type ChartRenderContext, type ChartRenderInput, type ChartRenderOptions, type ChartRenderer, type ChartViewState, type ColumnLayout, type ColumnWindow, ConnectorExecuteInput, ConnectorExecuteOutput, ConnectorTransport, ConnectorsController, type ConnectorsControllerOptions, type ConnectorsHostBridge, ConnectorsPanelState, ConnectorsPanelView, type ConnectorsPanelViewProps, type ConnectorsRenderContext, ConnectorsViewState, type CreateChartPanelOptions, type CreateConnectorExecutorOptions, type CreateConnectorsPanelOptions, type CreateFieldsPanelOptions, type CreateMetricsPanelOptions, type CreateTablePanelOptions, type CredentialDraft, type CredentialErrors, DEFAULT_COLUMN_WIDTH, DEFAULT_PAGE_SIZE, DEFAULT_RANGES, type DeltaDirection, EMPTY_LAYOUT, EXPIRY_SKEW_MS, type ExecuteError, BEHAVIOURS as FIELDS_BEHAVIOURS, FIELDS_DECLARATION, FIELDS_PANEL_ID, FIELDS_RUNTIME_UNITS, FieldsController, type FieldsControllerOptions, type FieldsHostBridge, type FieldsPanelState, FieldsPanelView, type FieldsPanelViewProps, type FieldsRenderContext, type FieldsUiIntent, type FieldsViewColumn, type FieldsViewEntry, type FieldsViewFilter, type FieldsViewModel, type FieldsViewOptions, type FieldsViewShelf, type FieldsViewState, type HostSqlResolver, IMPLEMENTED_VIEW_MODES, type LoopbackRequest, type LoopbackVerdict, METRICS_PANEL_ID, MIN_COLUMN_WIDTH, MONO_FILL_PALETTE, MONO_PALETTE, MetricsController, type MetricsControllerOptions, type MetricsHostBridge, type MetricsPanelState, MetricsPanelView, type MetricsPanelViewProps, type MetricsRenderContext, type MetricsViewState, type NumericConstraints, type OAuthStateRecord, type OAuthStateStore, type OAuthStateStoreOptions, type ParseCsvOptions, type ParseResult, type ParsedCsv, type PkcePair, PushdownSplit, type RefreshCoordinator, type ResolvedColumn, SHELF_PRESETS, type StoredOAuthToken, SubstrateFacilities, TABLE_PANEL_ID, TableController, type TableControllerOptions, type TableHostBridge, type TablePanelState, TablePanelView, type TablePanelViewProps, type TableRenderContext, type TableViewMode, type TableViewState, type TokenEndpointResponse, type VirtualWindow, type XenoAlertLevel, type XenoCalculatedFieldRequest, type XenoCellEdit, type XenoChartData, type XenoChartDrillDown, type XenoChartEncoding, type XenoChartExportRequest, type XenoChartHighlight, type XenoChartSeries, type XenoChartType, XenoConnection, XenoConnectionStatus, XenoConnectorFetch, XenoConnectorFileReader, XenoConnectorQueryRequest, XenoCredentialField, XenoCredentialFormSpec, XenoCredentialResult, type XenoFieldStat, type XenoMetricAlert, type XenoMetricRange, type XenoMetricSpec, type XenoMetricThreshold, type XenoMetricValue, XenoResolverErrorCode, XenoRestPaging, type XenoRowActivate, type XenoShelfEntry, type XenoShelfSpec, XenoSqlEngine, applyFieldsUi, applyPrecision, base64Url, breachSideOf, buildChartData, buildRestUrl, buildSelect, chartManifest, chartPanel, clamp, classifyHttpStatus, coerceCsvValues, columnIndexAt, columnsOf, compileForHost, computeColumnWindow, computeWindow, connectorsManifest, connectorsPanel, constraintsOfColumn, createChartPanel, createConnectorExecutor, createConnectorsPanel, createFieldsPanel, createMetricsPanel, createOAuthStateStore, createPkcePair, createRefreshCoordinator, createTablePanel, credentialSpecProblem, defaultAggregateFor, defaultEncoding, deltaToneOf, emptyFilterGroup, entityOf, escapeLikePattern, executeCsvFile, executeDuckDb, executeGraphql, executeJsonFile, executeRest, executeSql, extractJsonPath, extractRows, fieldsManifest, fieldsPanel, fieldsViewManifest, fieldsViewState, firstGraphqlError, frozenWidth, getChartRenderer, isCategorical, isFieldVisible, isFilled, isLeafFilter, isLoopbackHost, isSafeTableName, mergeRefreshResponse, metricsManifest, metricsPanel, moveCell, moveColumn, needsRefresh, nextPageToken, normalizeLayout, normalizeNumeric, offerableAggregates, offerableFilterOps, parseCsv, parseJsonBody, parseJsonPath, parseLinkHeader, parseNumeric, pruneHiddenValues, queriesEqual, quoteIdent, quoteLiteral, redirectUriFor, renderFilterGroup, resolveChartColors, resolveColumns, rowsForMark, scrollLeftToReveal, scrollTopToReveal, setChartRenderer, setColumnVisible, setColumnWidth, setFrozenCount, sniffDelimiter, suggestedShelfFor, tableManifest, tablePanel, toChartJsConfig, toExecuteError, totalWidth, uniqueTableName, unsupportedMessage, validateCredentialDraft, validateEncoding, validateLoopbackRequest, visibleFields };
+export { AGENT_HIDDEN_COMMANDS, ALL_AGGREGATES, ALL_CHART_TYPES, type BuildChartOptions, type BuildSelectOptions, type BuildSelectResult, BEHAVIOURS$2 as CHART_BEHAVIOURS, CHART_DECLARATION, CHART_EMPTY_FILL, CHART_PALETTE_STEPS, CHART_PANEL_ID, CHART_RUNTIME_UNITS, CHART_TYPE_LABELS, CONNECTORS_PANEL_ID, type CellAddress, ChartController, type ChartControllerOptions, type ChartHostBridge, type ChartPanelState, ChartPanelView, type ChartPanelViewProps, ChartPlot, type ChartRenderContext, type ChartRenderInput, type ChartRenderOptions, type ChartRenderer, type ChartUiIntent, type ChartViewModel, type ChartViewOptions, type ChartViewState, type ColumnLayout, type ColumnWindow, ConnectorExecuteInput, ConnectorExecuteOutput, ConnectorTransport, ConnectorsController, type ConnectorsControllerOptions, type ConnectorsHostBridge, ConnectorsPanelState, ConnectorsPanelView, type ConnectorsPanelViewProps, type ConnectorsRenderContext, ConnectorsViewState, type CreateChartPanelOptions, type CreateConnectorExecutorOptions, type CreateConnectorsPanelOptions, type CreateFieldsPanelOptions, type CreateMetricsPanelOptions, type CreateTablePanelOptions, type CredentialDraft, type CredentialErrors, DEFAULT_CHART_OPTIONS, DEFAULT_COLUMN_WIDTH, DEFAULT_PAGE_SIZE, DEFAULT_RANGES, type DeltaDirection, EMPTY_LAYOUT, EXPIRY_SKEW_MS, type ExecuteError, BEHAVIOURS as FIELDS_BEHAVIOURS, FIELDS_DECLARATION, FIELDS_PANEL_ID, FIELDS_RUNTIME_UNITS, FieldsController, type FieldsControllerOptions, type FieldsHostBridge, type FieldsPanelState, FieldsPanelView, type FieldsPanelViewProps, type FieldsRenderContext, type FieldsUiIntent, type FieldsViewColumn, type FieldsViewEntry, type FieldsViewFilter, type FieldsViewModel, type FieldsViewOptions, type FieldsViewShelf, type FieldsViewState, type HostSqlResolver, IMPLEMENTED_VIEW_MODES, type LoopbackRequest, type LoopbackVerdict, BEHAVIOURS$1 as METRICS_BEHAVIOURS, METRICS_DECLARATION, METRICS_PANEL_ID, METRICS_RUNTIME_UNITS, MIN_COLUMN_WIDTH, MONO_FILL_PALETTE, MONO_PALETTE, MetricsController, type MetricsControllerOptions, type MetricsHostBridge, type MetricsPanelState, MetricsPanelView, type MetricsPanelViewProps, type MetricsRenderContext, type MetricsUiIntent, type MetricsViewModel, type MetricsViewOptions, type MetricsViewState, type MetricsViewTile, type NumericConstraints, type OAuthStateRecord, type OAuthStateStore, type OAuthStateStoreOptions, type ParseCsvOptions, type ParseResult, type ParsedCsv, type PkcePair, PushdownSplit, type RefreshCoordinator, type ResolvedColumn, SHELF_PRESETS, type StoredOAuthToken, SubstrateFacilities, TABLE_PANEL_ID, TableController, type TableControllerOptions, type TableHostBridge, type TablePanelState, TablePanelView, type TablePanelViewProps, type TableRenderContext, type TableViewMode, type TableViewState, type TokenEndpointResponse, type VirtualWindow, type XenoAlertLevel, type XenoCalculatedFieldRequest, type XenoCellEdit, type XenoChartData, type XenoChartDrillDown, type XenoChartEncoding, type XenoChartExportRequest, type XenoChartHighlight, type XenoChartSeries, type XenoChartType, XenoConnection, XenoConnectionStatus, XenoConnectorFetch, XenoConnectorFileReader, XenoConnectorQueryRequest, XenoCredentialField, XenoCredentialFormSpec, XenoCredentialResult, type XenoFieldStat, type XenoMetricAlert, type XenoMetricRange, type XenoMetricSpec, type XenoMetricThreshold, type XenoMetricValue, XenoResolverErrorCode, XenoRestPaging, type XenoRowActivate, type XenoShelfEntry, type XenoShelfSpec, XenoSqlEngine, applyChartUi, applyFieldsUi, applyMetricsUi, applyPrecision, base64Url, breachSideOf, buildChartData, buildRestUrl, buildSelect, chartManifest, chartPanel, chartRuntimeComponents, chartViewManifest, chartViewState, clamp, classifyHttpStatus, coerceCsvValues, columnIndexAt, columnsOf, compileForHost, computeColumnWindow, computeWindow, connectorsManifest, connectorsPanel, constraintsOfColumn, createChartPanel, createConnectorExecutor, createConnectorsPanel, createFieldsPanel, createMetricsPanel, createOAuthStateStore, createPkcePair, createRefreshCoordinator, createTablePanel, credentialSpecProblem, defaultAggregateFor, defaultEncoding, deltaToneOf, emptyFilterGroup, entityOf, escapeLikePattern, executeCsvFile, executeDuckDb, executeGraphql, executeJsonFile, executeRest, executeSql, extractJsonPath, extractRows, fieldsManifest, fieldsPanel, fieldsViewManifest, fieldsViewState, firstGraphqlError, frozenWidth, getChartRenderer, isCategorical, isFieldVisible, isFilled, isLeafFilter, isLoopbackHost, isSafeTableName, mergeRefreshResponse, metricsManifest, metricsPanel, metricsViewManifest, metricsViewState, moveCell, moveColumn, needsRefresh, nextPageToken, normalizeLayout, normalizeNumeric, offerableAggregates, offerableFilterOps, parseCsv, parseJsonBody, parseJsonPath, parseLinkHeader, parseNumeric, pruneHiddenValues, queriesEqual, quoteIdent, quoteLiteral, redirectUriFor, renderFilterGroup, resolveChartColors, resolveColumns, rowsForMark, scrollLeftToReveal, scrollTopToReveal, setChartRenderer, setColumnVisible, setColumnWidth, setFrozenCount, sniffDelimiter, suggestedShelfFor, tableManifest, tablePanel, toChartJsConfig, toExecuteError, totalWidth, uniqueTableName, unsupportedMessage, validateCredentialDraft, validateEncoding, validateLoopbackRequest, visibleFields };

package/dist/data/index.js

@@ -11,7 +11,6 @@ import {
 } from "../chunk-W4PTX2Y4.js";
 import {
   ChevronGlyph,
-  DownloadGlyph,
   PlugGlyph,
   RefreshGlyph,
   SortAscGlyph,
@@ -198,8 +197,8 @@ function moveCell(from, delta, bounds) {
 }
 
 // src/data/table/numeric.ts
-function parseNumeric(text2) {
-  const trimmed = String(text2).trim();
+function parseNumeric(text4) {
+  const trimmed = String(text4).trim();
   if (trimmed.length === 0) return { ok: false, reason: "empty" };
   const match = /^[+-]?(\d+\.?\d*|\.\d+)(?:[eE][+-]?\d+)?/.exec(trimmed);
   if (!match) return { ok: false, reason: "nan" };
@@ -553,11 +552,11 @@ var TableController = class {
     return true;
   }
   /** Update the in-flight draft. Emits `editPreview` only when `livePreview` is on. */
-  updateDraft(text2) {
+  updateDraft(text4) {
     if (!this.editing) return;
-    this.editing = { ...this.editing, draft: text2 };
+    this.editing = { ...this.editing, draft: text4 };
     if (this.livePreview) {
-      const parsed = this.parseDraft(this.editing.columnId, text2);
+      const parsed = this.parseDraft(this.editing.columnId, text4);
       if (parsed.ok) {
         this.host.emit("editPreview", this.buildEdit(this.editing, parsed.value));
       }
@@ -609,12 +608,12 @@ var TableController = class {
     };
   }
   /** Parse a draft according to the column's declared type. */
-  parseDraft(columnId, text2) {
+  parseDraft(columnId, text4) {
     const column = this.columnById(columnId);
-    const trimmed = text2.trim();
+    const trimmed = text4.trim();
     if (column?.type === "number" || column?.type === "integer" || column?.type === "duration") {
       if (trimmed === "") return { ok: true, value: null };
-      const parsed = parseNumeric(text2);
+      const parsed = parseNumeric(text4);
       if (!parsed.ok) return { ok: false, reason: parsed.reason };
       return { ok: true, value: normalizeNumeric(parsed.value, constraintsOfColumn(column)) };
     }
@@ -631,7 +630,7 @@ var TableController = class {
         value: trimmed === "" ? [] : trimmed.split(",").map((part) => part.trim()).filter(Boolean)
       };
     }
-    return { ok: true, value: trimmed === "" ? null : text2 };
+    return { ok: true, value: trimmed === "" ? null : text4 };
   }
   rowById(rowId) {
     return this.result?.rows.find((r) => r.id === rowId);
@@ -2205,16 +2204,7 @@ var chartManifest = {
 
 // src/data/chart/react/ChartPanelView.tsx
 import { useEffect as useEffect2, useRef as useRef2, useSyncExternalStore as useSyncExternalStore2 } from "react";
-import {
-  Badge as Badge2,
-  EmptyState as EmptyState2,
-  ErrorState as ErrorState2,
-  IconButton as IconButton2,
-  SegmentedControl as SegmentedControl2,
-  StatusBar as StatusBar2,
-  Toolbar as Toolbar2,
-  ToolbarGroup as ToolbarGroup2
-} from "@xenosystem/components/chrome";
+import { Badge as Badge2, Column, EmptyState as EmptyState2, ErrorState as ErrorState2, IconButton as IconButton2, PlotSurface, SegmentedControl as SegmentedControl2, StatusBar as StatusBar2, Toolbar as Toolbar2, ToolbarGroup as ToolbarGroup2 } from "@xenosystem/components/chrome";
 
 // src/data/chart/renderer.ts
 var renderer = null;
@@ -2268,19 +2258,102 @@ function shade(index) {
   return MONO_PALETTE[index % MONO_PALETTE.length];
 }
 
+// src/data/chart/declaration.ts
+var CHART_TYPE_LABELS = { bar: "Bar", horizontalBar: "H-Bar", line: "Line", area: "Area", scatter: "Scatter", pie: "Pie", doughnut: "Ring" };
+var DEFAULT_CHART_OPTIONS = { showLegend: true, showGrid: true, showTooltip: true, stacked: false, smoothing: 0 };
+function chartViewState(c, options = {}) {
+  const s = c.getState();
+  const errored = !!s.errorMessage;
+  const empty = !errored && s.empty;
+  const unplottable = !errored && !empty && !!s.encodingProblem;
+  const noRenderer = !errored && !empty && !unplottable && !getChartRenderer();
+  return {
+    types: s.allowedTypes.map((t) => ({ value: t, label: CHART_TYPE_LABELS[t] ?? t })),
+    type: s.encoding.type,
+    partial: s.partial,
+    aggregating: !!s.data?.tooDense,
+    aggregatingHint: s.data?.tooDense ? `${s.data.tooDense.points} points exceeds the ${s.data.tooDense.limit} plot limit \u2014 an aggregated query was requested.` : void 0,
+    errorMessage: s.errorMessage ?? void 0,
+    errored,
+    empty,
+    emptyHint: options.emptyHint ?? "Wire a result into this chart to plot it.",
+    unplottable,
+    encodingProblem: s.encodingProblem ?? void 0,
+    noRenderer,
+    plot: !errored && !empty && !unplottable && !noRenderer,
+    countLabel: s.data ? `${s.data.series.length} series \xB7 ${s.data.labels.length} points` : void 0,
+    highlightLabel: s.highlightedRowIds.length > 0 ? `${s.highlightedRowIds.length} highlighted` : void 0
+  };
+}
+function applyChartUi(c, intent) {
+  switch (intent.kind) {
+    case "type":
+      c.setType(intent.type);
+      break;
+    case "export":
+      c.requestExport("png");
+      break;
+  }
+}
+var chartViewManifest = {
+  id: chartManifest.id,
+  version: "1.0.0",
+  title: "Chart",
+  category: "data",
+  layout: { slot: "center" },
+  inputs: [{ id: "view", type: "object", label: "View state", description: "The ChartViewModel the runtime derives from the controller on every draw." }],
+  outputs: [{ id: "ui", type: "object", label: "UI intent", description: "{ kind: type | export, \u2026 } \u2014 applied by the runtime to the controller." }],
+  commands: []
+};
+var EMPTY = { types: [], type: "bar", partial: false, aggregating: false, errored: false, empty: true, emptyHint: "Wire a result into this chart to plot it.", unplottable: false, noRenderer: false, plot: false };
+var BEHAVIOURS = {
+  "data/chartPanelView": (inputs) => inputs.view ?? EMPTY
+};
+var CHART_RUNTIME_UNITS = ["chart/Plot"];
+var text = (b) => ({ component: "text", props: { text: b } });
+var ui = (kind, fields = {}) => ({ emit: "ui", value: { object: { kind: { value: kind }, ...fields } } });
+var CHART_DECLARATION = {
+  format: "xeno.block@1",
+  manifest: chartViewManifest,
+  behaviour: "data/chartPanelView",
+  composition: {
+    component: "chrome/Column",
+    children: [
+      {
+        component: "chrome/Toolbar",
+        props: {
+          left: { node: { component: "chrome/SegmentedControl", props: { size: { value: "sm" }, label: { value: "Chart type" }, options: { input: "view.types" }, value: { input: "view.type" } }, on: { onChange: ui("type", { type: { arg: "" } }) } } },
+          right: {
+            node: {
+              component: "chrome/ToolbarGroup",
+              props: { end: { value: true } },
+              children: [
+                { component: "chrome/Badge", when: { input: "view.partial" }, props: { tone: { value: "warning" }, title: { value: "Some measures have not synced yet." } }, children: [text({ value: "partial" })] },
+                { component: "chrome/Badge", when: { input: "view.aggregating" }, props: { tone: { value: "warning" }, title: { input: "view.aggregatingHint" } }, children: [text({ value: "aggregating" })] },
+                { component: "chrome/IconButton", props: { icon: { node: { component: "icons/Download" } }, label: { value: "Export chart" } }, on: { onClick: ui("export") } }
+              ]
+            }
+          }
+        }
+      },
+      { component: "chrome/ErrorState", when: { input: "view.errored" }, props: { title: { value: "Could not load data" }, message: { input: "view.errorMessage" } } },
+      { component: "chrome/EmptyState", when: { input: "view.empty" }, props: { title: { value: "No data" }, hint: { input: "view.emptyHint" } } },
+      { component: "chrome/EmptyState", when: { input: "view.unplottable" }, props: { title: { value: "Nothing to plot" }, hint: { input: "view.encodingProblem" } } },
+      { component: "chrome/EmptyState", when: { input: "view.noRenderer" }, props: { title: { value: "No renderer installed" }, hint: { value: "Call setChartRenderer() with a Chart.js (or other) renderer \u2014 the panel ships the model, the host ships the marks." } } },
+      { component: "chart/Plot", when: { input: "view.plot" } },
+      { component: "chrome/StatusBar", props: { left: { input: "view.countLabel" }, right: { input: "view.highlightLabel" } } }
+    ]
+  }
+};
+
 // src/data/chart/react/ChartPanelView.tsx
 import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
-var DEFAULT_OPTIONS = {
-  showLegend: true,
-  showGrid: true,
-  showTooltip: true,
-  stacked: false,
-  smoothing: 0
-};
-function ChartPanelView({ controller, options, emptyHint }) {
+var DownloadGlyph = ICONS["icons/Download"];
+function ChartPlot({ controller, options }) {
   const state = useSyncExternalStore2(controller.subscribe, controller.getState, controller.getState);
   const plotRef = useRef2(null);
-  const resolved = { ...DEFAULT_OPTIONS, ...options };
+  const resolved = { ...DEFAULT_CHART_OPTIONS, ...options };
+  const resolvedKey = JSON.stringify(resolved);
   useEffect2(() => {
     const element = plotRef.current;
     const renderer2 = getChartRenderer();
@@ -2293,83 +2366,38 @@ function ChartPanelView({ controller, options, emptyHint }) {
       highlightedRowIds: state.highlightedRowIds,
       onMarkActivate: (label, seriesId) => controller.activateMark(label, seriesId)
     });
-  }, [state.data, state.highlightedRowIds, controller, JSON.stringify(resolved)]);
-  const toolbar = /* @__PURE__ */ jsx2(
-    Toolbar2,
-    {
-      left: /* @__PURE__ */ jsx2(
-        SegmentedControl2,
-        {
-          size: "sm",
-          label: "Chart type",
-          options: state.allowedTypes.map((t) => ({ value: t, label: LABELS[t] ?? t })),
-          value: state.encoding.type,
-          onChange: (t) => controller.setType(t)
-        }
-      ),
-      right: /* @__PURE__ */ jsxs2(ToolbarGroup2, { end: true, children: [
-        state.partial ? /* @__PURE__ */ jsx2(Badge2, { tone: "warning", title: "Some measures have not synced yet.", children: "partial" }) : null,
-        state.data?.tooDense ? /* @__PURE__ */ jsx2(
-          Badge2,
-          {
-            tone: "warning",
-            title: `${state.data.tooDense.points} points exceeds the ${state.data.tooDense.limit} plot limit \u2014 an aggregated query was requested.`,
-            children: "aggregating"
-          }
-        ) : null,
-        /* @__PURE__ */ jsx2(
-          IconButton2,
-          {
-            icon: /* @__PURE__ */ jsx2(DownloadGlyph, {}),
-            label: "Export chart",
-            onClick: () => controller.requestExport("png")
-          }
-        )
-      ] })
-    }
-  );
-  const body = (() => {
-    if (state.errorMessage) {
-      return /* @__PURE__ */ jsx2(ErrorState2, { title: "Could not load data", message: state.errorMessage });
-    }
-    if (state.empty) {
-      return /* @__PURE__ */ jsx2(EmptyState2, { title: "No data", hint: emptyHint ?? "Wire a result into this chart to plot it." });
-    }
-    if (state.encodingProblem) {
-      return /* @__PURE__ */ jsx2(EmptyState2, { title: "Nothing to plot", hint: state.encodingProblem });
-    }
-    if (!getChartRenderer()) {
-      return /* @__PURE__ */ jsx2(
-        EmptyState2,
-        {
-          title: "No renderer installed",
-          hint: "Call setChartRenderer() with a Chart.js (or other) renderer \u2014 the panel ships the model, the host ships the marks."
-        }
-      );
-    }
-    return /* @__PURE__ */ jsx2("div", { ref: plotRef, style: { flex: "1 1 0", minHeight: 0, position: "relative" } });
-  })();
-  return /* @__PURE__ */ jsxs2("div", { style: { display: "flex", flexDirection: "column", height: "100%", minHeight: 0 }, children: [
-    toolbar,
-    body,
+  }, [state.data, state.highlightedRowIds, controller, resolvedKey]);
+  return /* @__PURE__ */ jsx2(PlotSurface, { ref: plotRef, label: "Chart" });
+}
+function chartRuntimeComponents(controller, options) {
+  return {
+    "chart/Plot": () => /* @__PURE__ */ jsx2(ChartPlot, { controller, options })
+  };
+}
+function ChartPanelView({ controller, options, emptyHint }) {
+  useSyncExternalStore2(controller.subscribe, controller.getState, controller.getState);
+  const view = chartViewState(controller, { emptyHint });
+  const ui4 = (intent) => applyChartUi(controller, intent);
+  return /* @__PURE__ */ jsxs2(Column, { children: [
     /* @__PURE__ */ jsx2(
-      StatusBar2,
+      Toolbar2,
       {
-        left: state.data ? `${state.data.series.length} series \xB7 ${state.data.labels.length} points` : void 0,
-        right: state.highlightedRowIds.length > 0 ? `${state.highlightedRowIds.length} highlighted` : void 0
+        left: /* @__PURE__ */ jsx2(SegmentedControl2, { size: "sm", label: "Chart type", options: view.types, value: view.type, onChange: (type) => ui4({ kind: "type", type }) }),
+        right: /* @__PURE__ */ jsxs2(ToolbarGroup2, { end: true, children: [
+          view.partial ? /* @__PURE__ */ jsx2(Badge2, { tone: "warning", title: "Some measures have not synced yet.", children: "partial" }) : null,
+          view.aggregating ? /* @__PURE__ */ jsx2(Badge2, { tone: "warning", title: view.aggregatingHint, children: "aggregating" }) : null,
+          /* @__PURE__ */ jsx2(IconButton2, { icon: /* @__PURE__ */ jsx2(DownloadGlyph, {}), label: "Export chart", onClick: () => ui4({ kind: "export" }) })
+        ] })
       }
-    )
+    ),
+    view.errored ? /* @__PURE__ */ jsx2(ErrorState2, { title: "Could not load data", message: view.errorMessage }) : null,
+    view.empty ? /* @__PURE__ */ jsx2(EmptyState2, { title: "No data", hint: view.emptyHint }) : null,
+    view.unplottable ? /* @__PURE__ */ jsx2(EmptyState2, { title: "Nothing to plot", hint: view.encodingProblem }) : null,
+    view.noRenderer ? /* @__PURE__ */ jsx2(EmptyState2, { title: "No renderer installed", hint: "Call setChartRenderer() with a Chart.js (or other) renderer \u2014 the panel ships the model, the host ships the marks." }) : null,
+    view.plot ? /* @__PURE__ */ jsx2(ChartPlot, { controller, options }) : null,
+    /* @__PURE__ */ jsx2(StatusBar2, { left: view.countLabel, right: view.highlightLabel })
   ] });
 }
-var LABELS = {
-  bar: "Bar",
-  horizontalBar: "H-Bar",
-  line: "Line",
-  area: "Area",
-  scatter: "Scatter",
-  pie: "Pie",
-  doughnut: "Ring"
-};
 
 // src/data/chart/panel.ts
 function createChartPanel(options = {}) {
@@ -2912,138 +2940,185 @@ var metricsManifest = {
 import { useSyncExternalStore as useSyncExternalStore3 } from "react";
 import {
   Badge as Badge3,
+  Column as Column2,
+  Delta,
   EmptyState as EmptyState3,
   ErrorState as ErrorState3,
   ScrollArea as ScrollArea2,
   SegmentedControl as SegmentedControl3,
   Sparkline,
+  Stack,
   StatTile,
   StatusBar as StatusBar3,
+  Text,
+  TileGrid,
   Toolbar as Toolbar3
 } from "@xenosystem/components/chrome";
-import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
-function MetricsPanelView({
-  controller,
-  layout = "grid",
-  columns = 4,
-  sparkline = true,
-  showDelta = true,
-  emptyHint,
-  partialHint = "Some measures have not finished syncing."
-}) {
-  const state = useSyncExternalStore3(controller.subscribe, controller.getState, controller.getState);
-  const toolbar = state.ranges.length > 0 ? /* @__PURE__ */ jsx3(
-    Toolbar3,
-    {
-      left: /* @__PURE__ */ jsx3(
-        SegmentedControl3,
-        {
-          size: "sm",
-          label: "Range",
-          options: state.ranges.map((r) => ({ value: r.id, label: r.label })),
-          value: state.rangeId ?? state.ranges[0]?.id ?? "",
-          onChange: (id) => controller.setRange(id)
-        }
-      ),
-      right: state.partial ? (
-        // The honest state: rows are real, measures are still landing.
-        /* @__PURE__ */ jsx3(Badge3, { tone: "warning", title: partialHint, children: "partial" })
-      ) : void 0
-    }
-  ) : null;
-  if (state.errorMessage) {
-    return /* @__PURE__ */ jsxs3("div", { style: { display: "flex", flexDirection: "column", height: "100%", minHeight: 0 }, children: [
-      toolbar,
-      /* @__PURE__ */ jsx3(ErrorState3, { title: "Could not load metrics", message: state.errorMessage })
-    ] });
-  }
-  if (state.metrics.length === 0) {
-    return /* @__PURE__ */ jsxs3("div", { style: { display: "flex", flexDirection: "column", height: "100%", minHeight: 0 }, children: [
-      toolbar,
-      /* @__PURE__ */ jsx3(
-        EmptyState3,
-        {
-          title: "No metrics",
-          hint: emptyHint ?? "Configure a metric, or wire a result into this panel."
-        }
-      )
-    ] });
+
+// src/data/metrics/declaration.ts
+function metricsViewState(c, options = {}) {
+  const s = c.getState();
+  const sparkline = options.sparkline ?? true;
+  const showDelta = options.showDelta ?? true;
+  const partialHint = options.partialHint ?? "Some measures have not finished syncing.";
+  const errored = !!s.errorMessage;
+  const empty = !errored && s.metrics.length === 0;
+  return {
+    hasRanges: s.ranges.length > 0,
+    ranges: s.ranges.map((r) => ({ value: r.id, label: r.label })),
+    rangeId: s.rangeId ?? s.ranges[0]?.id ?? "",
+    partial: s.partial,
+    partialHint,
+    errorMessage: s.errorMessage ?? void 0,
+    errored,
+    empty,
+    emptyHint: options.emptyHint ?? "Configure a metric, or wire a result into this panel.",
+    ready: !errored && !empty,
+    layout: options.layout ?? "grid",
+    columns: options.columns ?? 4,
+    tiles: s.metrics.map((metric) => {
+      const level = metric.level === "critical" ? "error" : metric.level === "warn" ? "warning" : void 0;
+      const hasDelta = showDelta && metric.delta !== void 0;
+      const hasSpark = sparkline && !!metric.spark && metric.spark.length > 1;
+      return {
+        id: metric.spec.id,
+        label: metric.spec.label,
+        title: metric.spec.description,
+        // A partial result shows an em dash, never a zero — a zero is a lie the user cannot detect.
+        value: metric.partial && metric.value === null ? "\u2014" : metric.display,
+        level: String(metric.level),
+        hasLevel: level !== void 0,
+        tone: level ?? "warning",
+        hasDelta,
+        delta: metric.delta ?? 0,
+        deltaTone: metric.deltaTone,
+        partial: metric.partial === true,
+        hasSpark,
+        spark: hasSpark ? metric.spark : [],
+        sparkLabel: `${metric.spec.label} trend`
+      };
+    }),
+    countLabel: `${s.metrics.length} metric${s.metrics.length === 1 ? "" : "s"}`,
+    partialLabel: s.partial ? partialHint : void 0
+  };
+}
+function applyMetricsUi(c, intent) {
+  switch (intent.kind) {
+    case "range":
+      c.setRange(intent.rangeId);
+      break;
+    case "activate":
+      c.activate(intent.metricId);
+      break;
   }
-  const gridStyle = layout === "grid" ? { display: "grid", gridTemplateColumns: `repeat(${Math.max(1, columns)}, minmax(0, 1fr))`, gap: 6 } : layout === "row" ? { display: "flex", gap: 6, overflowX: "auto" } : { display: "flex", flexDirection: "column", gap: 6 };
-  return /* @__PURE__ */ jsxs3("div", { style: { display: "flex", flexDirection: "column", height: "100%", minHeight: 0 }, children: [
-    toolbar,
-    /* @__PURE__ */ jsx3(ScrollArea2, { children: /* @__PURE__ */ jsx3("div", { style: { ...gridStyle, padding: 6 }, children: state.metrics.map((metric) => /* @__PURE__ */ jsx3(
-      Tile,
-      {
-        metric,
-        sparkline,
-        showDelta,
-        partialHint,
-        onActivate: () => controller.activate(metric.spec.id)
-      },
-      metric.spec.id
-    )) }) }),
-    /* @__PURE__ */ jsx3(
-      StatusBar3,
-      {
-        left: `${state.metrics.length} metric${state.metrics.length === 1 ? "" : "s"}`,
-        right: state.partial ? partialHint : void 0
-      }
-    )
-  ] });
 }
-function Tile({
-  metric,
-  sparkline,
-  showDelta,
-  partialHint,
-  onActivate
-}) {
-  const tone = metric.level === "critical" ? "error" : metric.level === "warn" ? "warning" : void 0;
-  return /* @__PURE__ */ jsx3(
-    "div",
-    {
-      role: "button",
-      tabIndex: 0,
-      onClick: onActivate,
-      onKeyDown: (e) => {
-        if (e.key === "Enter" || e.key === " ") {
-          e.preventDefault();
-          onActivate();
+var metricsViewManifest = {
+  id: metricsManifest.id,
+  version: "1.0.0",
+  title: "Metrics",
+  category: "data",
+  layout: { slot: "center" },
+  inputs: [{ id: "view", type: "object", label: "View state", description: "The MetricsViewModel the runtime derives from the controller on every draw." }],
+  outputs: [{ id: "ui", type: "object", label: "UI intent", description: "{ kind: range | activate, \u2026 } \u2014 applied by the runtime to the controller." }],
+  commands: []
+};
+var EMPTY2 = { hasRanges: false, ranges: [], rangeId: "", partial: false, partialHint: "", errored: false, empty: true, emptyHint: "Configure a metric, or wire a result into this panel.", ready: false, layout: "grid", columns: 4, tiles: [], countLabel: "0 metrics" };
+var BEHAVIOURS2 = {
+  "data/metricsPanelView": (inputs) => inputs.view ?? EMPTY2
+};
+var METRICS_RUNTIME_UNITS = [];
+var text2 = (b) => ({ component: "text", props: { text: b } });
+var ui2 = (kind, fields = {}) => ({ emit: "ui", value: { object: { kind: { value: kind }, ...fields } } });
+var METRICS_DECLARATION = {
+  format: "xeno.block@1",
+  manifest: metricsViewManifest,
+  behaviour: "data/metricsPanelView",
+  composition: {
+    component: "chrome/Column",
+    children: [
+      {
+        component: "chrome/Toolbar",
+        when: { input: "view.hasRanges" },
+        props: {
+          left: { node: { component: "chrome/SegmentedControl", props: { size: { value: "sm" }, label: { value: "Range" }, options: { input: "view.ranges" }, value: { input: "view.rangeId" } }, on: { onChange: ui2("range", { rangeId: { arg: "" } }) } } },
+          right: { node: { component: "chrome/Badge", when: { input: "view.partial" }, props: { tone: { value: "warning" }, title: { input: "view.partialHint" } }, children: [text2({ value: "partial" })] } }
         }
       },
-      style: { cursor: "pointer", minWidth: 0 },
-      children: /* @__PURE__ */ jsx3(
-        StatTile,
-        {
-          title: metric.spec.description,
-          label: metric.spec.label,
-          value: metric.partial && metric.value === null ? "\u2014" : metric.display,
-          icon: tone ? /* @__PURE__ */ jsx3(Badge3, { tone, children: metric.level }) : void 0,
-          sub: /* @__PURE__ */ jsxs3("span", { style: { display: "flex", alignItems: "center", gap: 6 }, children: [
-            showDelta && metric.delta !== void 0 ? /* @__PURE__ */ jsxs3(
-              "span",
+      { component: "chrome/ErrorState", when: { input: "view.errored" }, props: { title: { value: "Could not load metrics" }, message: { input: "view.errorMessage" } } },
+      { component: "chrome/EmptyState", when: { input: "view.empty" }, props: { title: { value: "No metrics" }, hint: { input: "view.emptyHint" } } },
+      {
+        component: "chrome/ScrollArea",
+        when: { input: "view.ready" },
+        children: [
+          {
+            component: "chrome/TileGrid",
+            props: { layout: { input: "view.layout" }, columns: { input: "view.columns" } },
+            children: [
               {
-                style: {
-                  // Tone comes from deltaDirection, NEVER from the sign: a rising error rate is
-                  // not good news.
-                  color: metric.deltaTone === "good" ? "var(--xeno-success)" : metric.deltaTone === "bad" ? "var(--xeno-danger)" : void 0
+                component: "chrome/StatTile",
+                each: { input: "view.tiles", key: "id" },
+                props: {
+                  title: { item: "title" },
+                  label: { item: "label" },
+                  value: { item: "value" },
+                  icon: { node: { component: "chrome/Badge", when: { item: "hasLevel" }, props: { tone: { item: "tone" } }, children: [text2({ item: "level" })] } },
+                  sub: {
+                    node: {
+                      component: "chrome/Stack",
+                      props: { direction: { value: "row" }, pad: { value: "none" } },
+                      children: [
+                        { component: "chrome/Delta", when: { item: "hasDelta" }, props: { value: { item: "delta" }, tone: { item: "deltaTone" } } },
+                        { component: "chrome/Text", when: { item: "partial" }, props: { role: { value: "meta" } }, children: [text2({ input: "view.partialHint" })] },
+                        { component: "chrome/Sparkline", when: { item: "hasSpark" }, props: { data: { item: "spark" }, label: { item: "sparkLabel" } } }
+                      ]
+                    }
+                  }
                 },
-                children: [
-                  metric.delta > 0 ? "\u25B2" : "\u25BC",
-                  " ",
-                  Math.abs(metric.delta * 100).toFixed(1),
-                  "%"
-                ]
+                on: { onActivate: ui2("activate", { metricId: { item: "id" } }) }
               }
-            ) : null,
-            metric.partial ? /* @__PURE__ */ jsx3("span", { style: { opacity: 0.6 }, children: partialHint }) : null,
-            sparkline && metric.spark && metric.spark.length > 1 ? /* @__PURE__ */ jsx3(Sparkline, { data: metric.spark, label: `${metric.spec.label} trend` }) : null
-          ] })
-        }
-      )
-    }
-  );
+            ]
+          }
+        ]
+      },
+      { component: "chrome/StatusBar", when: { input: "view.ready" }, props: { left: { input: "view.countLabel" }, right: { input: "view.partialLabel" } } }
+    ]
+  }
+};
+
+// src/data/metrics/react/MetricsPanelView.tsx
+import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
+function MetricsPanelView({ controller, ...options }) {
+  useSyncExternalStore3(controller.subscribe, controller.getState, controller.getState);
+  const view = metricsViewState(controller, options);
+  const ui4 = (intent) => applyMetricsUi(controller, intent);
+  return /* @__PURE__ */ jsxs3(Column2, { children: [
+    view.hasRanges ? /* @__PURE__ */ jsx3(
+      Toolbar3,
+      {
+        left: /* @__PURE__ */ jsx3(SegmentedControl3, { size: "sm", label: "Range", options: view.ranges, value: view.rangeId, onChange: (rangeId) => ui4({ kind: "range", rangeId }) }),
+        right: view.partial ? /* @__PURE__ */ jsx3(Badge3, { tone: "warning", title: view.partialHint, children: "partial" }) : null
+      }
+    ) : null,
+    view.errored ? /* @__PURE__ */ jsx3(ErrorState3, { title: "Could not load metrics", message: view.errorMessage }) : null,
+    view.empty ? /* @__PURE__ */ jsx3(EmptyState3, { title: "No metrics", hint: view.emptyHint }) : null,
+    view.ready ? /* @__PURE__ */ jsx3(ScrollArea2, { children: /* @__PURE__ */ jsx3(TileGrid, { layout: view.layout, columns: view.columns, children: view.tiles.map((tile) => /* @__PURE__ */ jsx3(
+      StatTile,
+      {
+        title: tile.title,
+        label: tile.label,
+        value: tile.value,
+        icon: tile.hasLevel ? /* @__PURE__ */ jsx3(Badge3, { tone: tile.tone, children: tile.level }) : null,
+        sub: /* @__PURE__ */ jsxs3(Stack, { direction: "row", pad: "none", children: [
+          tile.hasDelta ? /* @__PURE__ */ jsx3(Delta, { value: tile.delta, tone: tile.deltaTone }) : null,
+          tile.partial ? /* @__PURE__ */ jsx3(Text, { role: "meta", children: view.partialHint }) : null,
+          tile.hasSpark ? /* @__PURE__ */ jsx3(Sparkline, { data: tile.spark, label: tile.sparkLabel }) : null
+        ] }),
+        onActivate: () => ui4({ kind: "activate", metricId: tile.id })
+      },
+      tile.id
+    )) }) }) : null,
+    view.ready ? /* @__PURE__ */ jsx3(StatusBar3, { left: view.countLabel, right: view.partialLabel }) : null
+  ] });
 }
 
 // src/data/metrics/panel.ts
@@ -3240,7 +3315,7 @@ function emptyFilterGroup() {
 function offerableFilterOps(column, sourceOps = []) {
   const common = ["eq", "ne", "isEmpty", "isNotEmpty", "in", "notIn"];
   const ordered = ["gt", "gte", "lt", "lte", "between"];
-  const text2 = ["contains", "notContains", "startsWith", "endsWith"];
+  const text4 = ["contains", "notContains", "startsWith", "endsWith"];
   const temporal = ["relative"];
   let ops = [...common];
   switch (column?.type) {
@@ -3258,10 +3333,10 @@ function offerableFilterOps(column, sourceOps = []) {
     case "url":
     case "select":
     case "multiselect":
-      ops = [...ops, ...text2];
+      ops = [...ops, ...text4];
       break;
     default:
-      ops = [...ops, ...text2, ...ordered];
+      ops = [...ops, ...text4, ...ordered];
   }
   if (sourceOps.length === 0) return ops;
   return ops.filter((op) => sourceOps.includes(op));
@@ -3892,7 +3967,7 @@ var fieldsManifest = {
 import { useSyncExternalStore as useSyncExternalStore4 } from "react";
 import {
   Badge as Badge4,
-  Column,
+  Column as Column3,
   EmptyState as EmptyState4,
   IconButton as IconButton3,
   Note,
@@ -4027,13 +4102,13 @@ var fieldsViewManifest = {
   outputs: [{ id: "ui", type: "object", label: "UI intent", description: "{ kind, \u2026 } \u2014 applied by the runtime to the controller." }],
   commands: []
 };
-var EMPTY = { hasColumns: false, noColumns: true, sampled: false, manualApply: false, applyDisabled: true, columns: [], shelves: [], filters: [], filterCount: 0, hasFilters: false, noFilters: true, combinator: "and", countLabel: "0 fields" };
-var BEHAVIOURS = {
-  "data/fieldsPanelView": (inputs) => inputs.view ?? EMPTY
+var EMPTY3 = { hasColumns: false, noColumns: true, sampled: false, manualApply: false, applyDisabled: true, columns: [], shelves: [], filters: [], filterCount: 0, hasFilters: false, noFilters: true, combinator: "and", countLabel: "0 fields" };
+var BEHAVIOURS3 = {
+  "data/fieldsPanelView": (inputs) => inputs.view ?? EMPTY3
 };
 var FIELDS_RUNTIME_UNITS = [];
-var text = (b) => ({ component: "text", props: { text: b } });
-var ui = (kind, fields = {}) => ({ emit: "ui", value: { object: { kind: { value: kind }, ...fields } } });
+var text3 = (b) => ({ component: "text", props: { text: b } });
+var ui3 = (kind, fields = {}) => ({ emit: "ui", value: { object: { kind: { value: kind }, ...fields } } });
 var removeButton = (label, on) => ({
   component: "chrome/IconButton",
   props: { size: { value: "sm" }, icon: { node: { component: "icons/Close", props: { size: { value: 11 } } } }, label },
@@ -4054,14 +4129,14 @@ var FIELDS_DECLARATION = {
           {
             component: "chrome/Toolbar",
             props: {
-              left: { node: { component: "chrome/Badge", when: { input: "view.sampled" }, props: { tone: { value: "warning" }, title: { input: "view.sampleWarning" } }, children: [text({ value: "sampled schema" })] } },
+              left: { node: { component: "chrome/Badge", when: { input: "view.sampled" }, props: { tone: { value: "warning" }, title: { input: "view.sampleWarning" } }, children: [text3({ value: "sampled schema" })] } },
               right: {
                 node: {
                   component: "chrome/ToolbarGroup",
                   props: { end: { value: true } },
                   children: [
-                    { component: "chrome/TextButton", on: { onClick: ui("autoAssign") }, children: [text({ value: "Auto-assign" })] },
-                    { component: "chrome/TextButton", when: { input: "view.manualApply" }, props: { strong: { value: true }, disabled: { input: "view.applyDisabled" } }, on: { onClick: ui("apply") }, children: [text({ value: "Apply" })] }
+                    { component: "chrome/TextButton", on: { onClick: ui3("autoAssign") }, children: [text3({ value: "Auto-assign" })] },
+                    { component: "chrome/TextButton", when: { input: "view.manualApply" }, props: { strong: { value: true }, disabled: { input: "view.applyDisabled" } }, on: { onClick: ui3("apply") }, children: [text3({ value: "Apply" })] }
                   ]
                 }
               }
@@ -4081,8 +4156,8 @@ var FIELDS_DECLARATION = {
                       {
                         component: "chrome/Row",
                         each: { input: "view.columns", key: "id" },
-                        props: { label: { item: "name" }, meta: { item: "role" }, selected: { item: "focused" }, trailing: { node: { component: "chrome/Badge", when: { item: "stat" }, props: { title: { item: "statTitle" } }, children: [text({ item: "stat" })] } } },
-                        on: { onClick: ui("focus", { columnId: { item: "id" } }) }
+                        props: { label: { item: "name" }, meta: { item: "role" }, selected: { item: "focused" }, trailing: { node: { component: "chrome/Badge", when: { item: "stat" }, props: { title: { item: "statTitle" } }, children: [text3({ item: "stat" })] } } },
+                        on: { onClick: ui3("focus", { columnId: { item: "id" } }) }
                       }
                     ]
                   }
@@ -4091,9 +4166,9 @@ var FIELDS_DECLARATION = {
               {
                 component: "chrome/Section",
                 each: { input: "view.shelves", key: "id" },
-                props: { title: { item: "label" }, flush: { value: true }, badge: { node: { component: "chrome/Badge", when: { item: "hasEntries" }, children: [text({ item: "count" })] } } },
+                props: { title: { item: "label" }, flush: { value: true }, badge: { node: { component: "chrome/Badge", when: { item: "hasEntries" }, children: [text3({ item: "count" })] } } },
                 children: [
-                  { component: "chrome/Note", when: { item: "empty" }, children: [text({ item: "hint" })] },
+                  { component: "chrome/Note", when: { item: "empty" }, children: [text3({ item: "hint" })] },
                   {
                     component: "chrome/RowList",
                     when: { item: "hasEntries" },
@@ -4108,13 +4183,13 @@ var FIELDS_DECLARATION = {
                             node: {
                               component: "fragment",
                               children: [
-                                { component: "chrome/Select", when: { item: "aggregated" }, props: { size: { value: "sm" }, label: { value: "Aggregate" }, options: { item: "aggregates" }, value: { item: "fn" } }, on: { onChange: ui("aggregate", { shelfId: { item: "shelfId" }, columnId: { item: "columnId" }, fn: { arg: "" } }) } },
-                                { component: "chrome/TextButton", when: { item: "sortable" }, on: { onClick: ui("direction", { shelfId: { item: "shelfId" }, columnId: { item: "columnId" } }) }, children: [text({ item: "direction" })] },
-                                { component: "chrome/Badge", when: { item: "granularity" }, children: [text({ item: "granularity" })] }
+                                { component: "chrome/Select", when: { item: "aggregated" }, props: { size: { value: "sm" }, label: { value: "Aggregate" }, options: { item: "aggregates" }, value: { item: "fn" } }, on: { onChange: ui3("aggregate", { shelfId: { item: "shelfId" }, columnId: { item: "columnId" }, fn: { arg: "" } }) } },
+                                { component: "chrome/TextButton", when: { item: "sortable" }, on: { onClick: ui3("direction", { shelfId: { item: "shelfId" }, columnId: { item: "columnId" } }) }, children: [text3({ item: "direction" })] },
+                                { component: "chrome/Badge", when: { item: "granularity" }, children: [text3({ item: "granularity" })] }
                               ]
                             }
                           },
-                          trailing: { node: removeButton({ item: "removeLabel" }, ui("remove", { shelfId: { item: "shelfId" }, columnId: { item: "columnId" } })) }
+                          trailing: { node: removeButton({ item: "removeLabel" }, ui3("remove", { shelfId: { item: "shelfId" }, columnId: { item: "columnId" } })) }
                         }
                       }
                     ]
@@ -4126,11 +4201,11 @@ var FIELDS_DECLARATION = {
                 props: {
                   title: { value: "Filters" },
                   flush: { value: true },
-                  badge: { node: { component: "chrome/Badge", when: { input: "view.hasFilters" }, children: [text({ input: "view.filterCount" })] } },
-                  actions: { node: { component: "chrome/IconButton", props: { size: { value: "sm" }, icon: { node: { component: "icons/Plus", props: { size: { value: 11 } } } }, label: { value: "Add filter" } }, on: { onClick: ui("addFilter") } } }
+                  badge: { node: { component: "chrome/Badge", when: { input: "view.hasFilters" }, children: [text3({ input: "view.filterCount" })] } },
+                  actions: { node: { component: "chrome/IconButton", props: { size: { value: "sm" }, icon: { node: { component: "icons/Plus", props: { size: { value: 11 } } } }, label: { value: "Add filter" } }, on: { onClick: ui3("addFilter") } } }
                 },
                 children: [
-                  { component: "chrome/Note", when: { input: "view.noFilters" }, children: [text({ value: "No filters. Everything passes." })] },
+                  { component: "chrome/Note", when: { input: "view.noFilters" }, children: [text3({ value: "No filters. Everything passes." })] },
                   {
                     component: "chrome/RowList",
                     when: { input: "view.hasFilters" },
@@ -4140,8 +4215,8 @@ var FIELDS_DECLARATION = {
                         each: { input: "view.filters", key: "key" },
                         props: {
                           label: { item: "label" },
-                          meta: { node: { component: "chrome/Select", when: { item: "leaf" }, props: { size: { value: "sm" }, label: { value: "Operator" }, options: { item: "ops" }, value: { item: "op" } }, on: { onChange: ui("filterOp", { index: { item: "index" }, op: { arg: "" } }) } } },
-                          trailing: { node: removeButton({ item: "removeLabel" }, ui("removeFilter", { index: { item: "index" } })) }
+                          meta: { node: { component: "chrome/Select", when: { item: "leaf" }, props: { size: { value: "sm" }, label: { value: "Operator" }, options: { item: "ops" }, value: { item: "op" } }, on: { onChange: ui3("filterOp", { index: { item: "index" }, op: { arg: "" } }) } } },
+                          trailing: { node: removeButton({ item: "removeLabel" }, ui3("removeFilter", { index: { item: "index" } })) }
                         }
                       }
                     ]
@@ -4150,8 +4225,8 @@ var FIELDS_DECLARATION = {
                     component: "chrome/Toolbar",
                     props: {
                       divided: { value: false },
-                      left: { node: { component: "chrome/SegmentedControl", props: { size: { value: "sm" }, label: { value: "Combinator" }, options: { value: COMBINATORS }, value: { input: "view.combinator" } }, on: { onChange: ui("combinator", { combinator: { arg: "" } }) } } },
-                      right: { node: { component: "chrome/TextButton", on: { onClick: ui("addGroup") }, children: [text({ value: "+ group" })] } }
+                      left: { node: { component: "chrome/SegmentedControl", props: { size: { value: "sm" }, label: { value: "Combinator" }, options: { value: COMBINATORS }, value: { input: "view.combinator" } }, on: { onChange: ui3("combinator", { combinator: { arg: "" } }) } } },
+                      right: { node: { component: "chrome/TextButton", on: { onClick: ui3("addGroup") }, children: [text3({ value: "+ group" })] } }
                     }
                   }
                 ]
@@ -4173,18 +4248,18 @@ var COMBINATORS2 = [{ value: "and", label: "All" }, { value: "or", label: "Any"
 function FieldsPanelView({ controller, showStats, manualApply }) {
   useSyncExternalStore4(controller.subscribe, controller.getState, controller.getState);
   const view = fieldsViewState(controller, { showStats, manualApply });
-  const ui2 = (intent) => applyFieldsUi(controller, intent);
+  const ui4 = (intent) => applyFieldsUi(controller, intent);
   if (view.noColumns) {
     return /* @__PURE__ */ jsx4(EmptyState4, { title: "No fields", hint: "Connect a source \u2014 its columns appear here, ready to drop onto a shelf." });
   }
-  return /* @__PURE__ */ jsxs4(Column, { children: [
+  return /* @__PURE__ */ jsxs4(Column3, { children: [
     /* @__PURE__ */ jsx4(
       Toolbar4,
       {
         left: view.sampled ? /* @__PURE__ */ jsx4(Badge4, { tone: "warning", title: view.sampleWarning, children: "sampled schema" }) : null,
         right: /* @__PURE__ */ jsxs4(ToolbarGroup3, { end: true, children: [
-          /* @__PURE__ */ jsx4(TextButton, { onClick: () => ui2({ kind: "autoAssign" }), children: "Auto-assign" }),
-          view.manualApply ? /* @__PURE__ */ jsx4(TextButton, { strong: true, disabled: view.applyDisabled, onClick: () => ui2({ kind: "apply" }), children: "Apply" }) : null
+          /* @__PURE__ */ jsx4(TextButton, { onClick: () => ui4({ kind: "autoAssign" }), children: "Auto-assign" }),
+          view.manualApply ? /* @__PURE__ */ jsx4(TextButton, { strong: true, disabled: view.applyDisabled, onClick: () => ui4({ kind: "apply" }), children: "Apply" }) : null
         ] })
       }
     ),
@@ -4196,7 +4271,7 @@ function FieldsPanelView({ controller, showStats, manualApply }) {
           meta: column.role,
           selected: column.focused,
           trailing: column.stat ? /* @__PURE__ */ jsx4(Badge4, { title: column.statTitle, children: column.stat }) : null,
-          onClick: () => ui2({ kind: "focus", columnId: column.id })
+          onClick: () => ui4({ kind: "focus", columnId: column.id })
         },
         column.id
       )) }) }),
@@ -4208,11 +4283,11 @@ function FieldsPanelView({ controller, showStats, manualApply }) {
             label: entry.label,
             dimmed: entry.suggested,
             meta: /* @__PURE__ */ jsxs4(Fragment2, { children: [
-              entry.aggregated ? /* @__PURE__ */ jsx4(Select, { size: "sm", label: "Aggregate", options: entry.aggregates, value: entry.fn, onChange: (fn) => ui2({ kind: "aggregate", shelfId: entry.shelfId, columnId: entry.columnId, fn }) }) : null,
-              entry.sortable ? /* @__PURE__ */ jsx4(TextButton, { onClick: () => ui2({ kind: "direction", shelfId: entry.shelfId, columnId: entry.columnId }), children: entry.direction }) : null,
+              entry.aggregated ? /* @__PURE__ */ jsx4(Select, { size: "sm", label: "Aggregate", options: entry.aggregates, value: entry.fn, onChange: (fn) => ui4({ kind: "aggregate", shelfId: entry.shelfId, columnId: entry.columnId, fn }) }) : null,
+              entry.sortable ? /* @__PURE__ */ jsx4(TextButton, { onClick: () => ui4({ kind: "direction", shelfId: entry.shelfId, columnId: entry.columnId }), children: entry.direction }) : null,
               entry.granularity ? /* @__PURE__ */ jsx4(Badge4, { children: entry.granularity }) : null
             ] }),
-            trailing: /* @__PURE__ */ jsx4(IconButton3, { size: "sm", icon: /* @__PURE__ */ jsx4(CloseGlyph, { size: 11 }), label: entry.removeLabel, onClick: () => ui2({ kind: "remove", shelfId: entry.shelfId, columnId: entry.columnId }) })
+            trailing: /* @__PURE__ */ jsx4(IconButton3, { size: "sm", icon: /* @__PURE__ */ jsx4(CloseGlyph, { size: 11 }), label: entry.removeLabel, onClick: () => ui4({ kind: "remove", shelfId: entry.shelfId, columnId: entry.columnId }) })
           },
           entry.columnId
         )) }) : null
@@ -4223,15 +4298,15 @@ function FieldsPanelView({ controller, showStats, manualApply }) {
           title: "Filters",
           flush: true,
           badge: view.hasFilters ? /* @__PURE__ */ jsx4(Badge4, { children: view.filterCount }) : null,
-          actions: /* @__PURE__ */ jsx4(IconButton3, { size: "sm", icon: /* @__PURE__ */ jsx4(PlusGlyph, { size: 11 }), label: "Add filter", onClick: () => ui2({ kind: "addFilter" }) }),
+          actions: /* @__PURE__ */ jsx4(IconButton3, { size: "sm", icon: /* @__PURE__ */ jsx4(PlusGlyph, { size: 11 }), label: "Add filter", onClick: () => ui4({ kind: "addFilter" }) }),
           children: [
             view.noFilters ? /* @__PURE__ */ jsx4(Note, { children: "No filters. Everything passes." }) : null,
             view.hasFilters ? /* @__PURE__ */ jsx4(RowList, { children: view.filters.map((filter) => /* @__PURE__ */ jsx4(
               Row,
               {
                 label: filter.label,
-                meta: filter.leaf ? /* @__PURE__ */ jsx4(Select, { size: "sm", label: "Operator", options: filter.ops, value: filter.op, onChange: (op) => ui2({ kind: "filterOp", index: filter.index, op }) }) : null,
-                trailing: /* @__PURE__ */ jsx4(IconButton3, { size: "sm", icon: /* @__PURE__ */ jsx4(CloseGlyph, { size: 11 }), label: filter.removeLabel, onClick: () => ui2({ kind: "removeFilter", index: filter.index }) })
+                meta: filter.leaf ? /* @__PURE__ */ jsx4(Select, { size: "sm", label: "Operator", options: filter.ops, value: filter.op, onChange: (op) => ui4({ kind: "filterOp", index: filter.index, op }) }) : null,
+                trailing: /* @__PURE__ */ jsx4(IconButton3, { size: "sm", icon: /* @__PURE__ */ jsx4(CloseGlyph, { size: 11 }), label: filter.removeLabel, onClick: () => ui4({ kind: "removeFilter", index: filter.index }) })
               },
               filter.key
             )) }) : null,
@@ -4239,8 +4314,8 @@ function FieldsPanelView({ controller, showStats, manualApply }) {
               Toolbar4,
               {
                 divided: false,
-                left: /* @__PURE__ */ jsx4(SegmentedControl4, { size: "sm", label: "Combinator", options: COMBINATORS2, value: view.combinator, onChange: (combinator) => ui2({ kind: "combinator", combinator }) }),
-                right: /* @__PURE__ */ jsx4(TextButton, { onClick: () => ui2({ kind: "addGroup" }), children: "+ group" })
+                left: /* @__PURE__ */ jsx4(SegmentedControl4, { size: "sm", label: "Combinator", options: COMBINATORS2, value: view.combinator, onChange: (combinator) => ui4({ kind: "combinator", combinator }) }),
+                right: /* @__PURE__ */ jsx4(TextButton, { onClick: () => ui4({ kind: "addGroup" }), children: "+ group" })
               }
             )
           ]
@@ -5376,10 +5451,10 @@ function parseJsonPath(path) {
   }
   return steps;
 }
-function findBracketEnd(text2, start) {
+function findBracketEnd(text4, start) {
   let quote = null;
-  for (let i = start + 1; i < text2.length; i += 1) {
-    const char = text2[i];
+  for (let i = start + 1; i < text4.length; i += 1) {
+    const char = text4[i];
     if (quote) {
       if (char === "\\") i += 1;
       else if (char === quote) quote = null;
@@ -5803,9 +5878,9 @@ function firstGraphqlError(errors) {
 }
 
 // src/data/connectors/executors/csv.ts
-function sniffDelimiter(text2) {
+function sniffDelimiter(text4) {
   const candidates = [",", ";", "	", "|"];
-  const line = firstLogicalLine(text2);
+  const line = firstLogicalLine(text4);
   let best = ",";
   let bestCount = 0;
   for (const candidate of candidates) {
@@ -5827,21 +5902,21 @@ function sniffDelimiter(text2) {
   }
   return best;
 }
-function firstLogicalLine(text2) {
+function firstLogicalLine(text4) {
   let inQuotes = false;
-  for (let i = 0; i < text2.length; i += 1) {
-    const char = text2[i];
+  for (let i = 0; i < text4.length; i += 1) {
+    const char = text4[i];
     if (char === '"') {
-      if (inQuotes && text2[i + 1] === '"') i += 1;
+      if (inQuotes && text4[i + 1] === '"') i += 1;
       else inQuotes = !inQuotes;
     } else if ((char === "\n" || char === "\r") && !inQuotes) {
-      return text2.slice(0, i);
+      return text4.slice(0, i);
     }
   }
-  return text2;
+  return text4;
 }
-function parseCsv(text2, options = {}) {
-  const source = text2.charCodeAt(0) === 65279 ? text2.slice(1) : text2;
+function parseCsv(text4, options = {}) {
+  const source = text4.charCodeAt(0) === 65279 ? text4.slice(1) : text4;
   const delimiter = options.delimiter && options.delimiter.length > 0 ? options.delimiter : sniffDelimiter(source);
   const quote = options.quote && options.quote.length > 0 ? options.quote : '"';
   const hasHeader = options.hasHeader ?? true;
@@ -5876,17 +5951,17 @@ function dedupe(names) {
     return count === 0 ? name : `${name}_${count + 1}`;
   });
 }
-function scanRecords(text2, delimiter, quote) {
+function scanRecords(text4, delimiter, quote) {
   const records = [];
   let fields = [];
   let field = "";
   let inQuotes = false;
   let i = 0;
-  while (i < text2.length) {
-    const char = text2[i];
+  while (i < text4.length) {
+    const char = text4[i];
     if (inQuotes) {
       if (char === quote) {
-        if (text2[i + 1] === quote) {
+        if (text4[i + 1] === quote) {
           field += quote;
           i += 2;
           continue;
@@ -5904,7 +5979,7 @@ function scanRecords(text2, delimiter, quote) {
       i += 1;
       continue;
     }
-    if (text2.startsWith(delimiter, i)) {
+    if (text4.startsWith(delimiter, i)) {
       fields.push(field);
       field = "";
       i += delimiter.length;
@@ -5915,7 +5990,7 @@ function scanRecords(text2, delimiter, quote) {
       records.push(fields);
       fields = [];
       field = "";
-      i += char === "\r" && text2[i + 1] === "\n" ? 2 : 1;
+      i += char === "\r" && text4[i + 1] === "\n" ? 2 : 1;
       continue;
     }
     field += char;
@@ -7052,28 +7127,37 @@ export {
   AGENT_HIDDEN_COMMANDS,
   ALL_AGGREGATES,
   ALL_CHART_TYPES,
+  BEHAVIOURS as CHART_BEHAVIOURS,
+  CHART_DECLARATION,
   CHART_EMPTY_FILL,
   CHART_PALETTE_STEPS,
   CHART_PANEL_ID,
+  CHART_RUNTIME_UNITS,
+  CHART_TYPE_LABELS,
   CONNECTORS_PANEL_ID,
   ChartController,
   ChartPanelView,
+  ChartPlot,
   ConnectorTransportError,
   ConnectorsController,
   ConnectorsPanelView,
+  DEFAULT_CHART_OPTIONS,
   DEFAULT_COLUMN_WIDTH,
   DEFAULT_PAGE_SIZE,
   DEFAULT_RANGES,
   EMPTY_LAYOUT,
   EXPIRY_SKEW_MS,
-  BEHAVIOURS as FIELDS_BEHAVIOURS,
+  BEHAVIOURS3 as FIELDS_BEHAVIOURS,
   FIELDS_DECLARATION,
   FIELDS_PANEL_ID,
   FIELDS_RUNTIME_UNITS,
   FieldsController,
   FieldsPanelView,
   IMPLEMENTED_VIEW_MODES,
+  BEHAVIOURS2 as METRICS_BEHAVIOURS,
+  METRICS_DECLARATION,
   METRICS_PANEL_ID,
+  METRICS_RUNTIME_UNITS,
   MIN_COLUMN_WIDTH,
   MONO_FILL_PALETTE,
   MONO_PALETTE,
@@ -7084,7 +7168,9 @@ export {
   TABLE_PANEL_ID,
   TableController,
   TablePanelView,
+  applyChartUi,
   applyFieldsUi,
+  applyMetricsUi,
   applyPrecision,
   base64Url,
   breachSideOf,
@@ -7094,6 +7180,9 @@ export {
   buildSelect,
   chartManifest,
   chartPanel,
+  chartRuntimeComponents,
+  chartViewManifest,
+  chartViewState,
   clamp,
   classifyBrowserFetchFailure,
   classifyHttpStatus,
@@ -7150,6 +7239,8 @@ export {
   mergeRefreshResponse,
   metricsManifest,
   metricsPanel,
+  metricsViewManifest,
+  metricsViewState,
   moveCell,
   moveColumn,
   needsRefresh,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xenosystem/blocks",
-  "version": "0.13.9",
+  "version": "0.13.11",
   "description": "XENO Blocks — rung 3 of the front ladder: components composed into a contract-bearing unit (manifest: ports, intents, commands, agent surface), rendered by @xenosystem/workbench. ONE package, one subpath per family (/auth, /edit, /data, /time, /ops, /trust, /agent), one named export per block — XENO PACKAGE NAMING - STANDARD.md.",
   "license": "UNLICENSED",
   "type": "module",
@@ -64,7 +64,7 @@
   "peerDependencies": {
     "@duckdb/duckdb-wasm": ">=1.28.0",
     "@xenosystem/block-sdk": ">=0.3.4 <1",
-    "@xenosystem/components": ">=0.20.0 <1",
+    "@xenosystem/components": ">=0.21.1 <1",
     "@xenosystem/data-core": "^0.1.0",
     "@xenosystem/elements": ">=0.0.1",
     "@xenosystem/elements-react": ">=0.0.1",
@@ -81,7 +81,7 @@
     "@types/react": "^19.0.0",
     "@types/react-dom": "^19.0.0",
     "@xenosystem/block-sdk": "^0.3.4",
-    "@xenosystem/components": "^0.20.0",
+    "@xenosystem/components": "^0.21.1",
     "@xenosystem/data-core": "^0.1.0",
     "@xenosystem/elements": "0.0.1",
     "@xenosystem/elements-react": "0.0.1",