@xenosystem/blocks 0.13.10 → 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;
 
@@ -3447,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, 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, applyFieldsUi, applyMetricsUi, 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, 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 };
+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(text3) {
-  const trimmed = String(text3).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(text3) {
+  updateDraft(text4) {
     if (!this.editing) return;
-    this.editing = { ...this.editing, draft: text3 };
+    this.editing = { ...this.editing, draft: text4 };
     if (this.livePreview) {
-      const parsed = this.parseDraft(this.editing.columnId, text3);
+      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, text3) {
+  parseDraft(columnId, text4) {
     const column = this.columnById(columnId);
-    const trimmed = text3.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(text3);
+      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 : text3 };
+    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,7 +2940,7 @@ var metricsManifest = {
 import { useSyncExternalStore as useSyncExternalStore3 } from "react";
 import {
   Badge as Badge3,
-  Column,
+  Column as Column2,
   Delta,
   EmptyState as EmptyState3,
   ErrorState as ErrorState3,
@@ -2994,13 +3022,13 @@ var metricsViewManifest = {
   outputs: [{ id: "ui", type: "object", label: "UI intent", description: "{ kind: range | activate, \u2026 } \u2014 applied by the runtime to the controller." }],
   commands: []
 };
-var EMPTY = { 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 BEHAVIOURS = {
-  "data/metricsPanelView": (inputs) => inputs.view ?? EMPTY
+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 text = (b) => ({ component: "text", props: { text: b } });
-var ui = (kind, fields = {}) => ({ emit: "ui", value: { object: { kind: { value: kind }, ...fields } } });
+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,
@@ -3012,8 +3040,8 @@ var METRICS_DECLARATION = {
         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: ui("range", { rangeId: { arg: "" } }) } } },
-          right: { node: { component: "chrome/Badge", when: { input: "view.partial" }, props: { tone: { value: "warning" }, title: { input: "view.partialHint" } }, children: [text({ value: "partial" })] } }
+          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" })] } }
         }
       },
       { component: "chrome/ErrorState", when: { input: "view.errored" }, props: { title: { value: "Could not load metrics" }, message: { input: "view.errorMessage" } } },
@@ -3033,20 +3061,20 @@ var METRICS_DECLARATION = {
                   title: { item: "title" },
                   label: { item: "label" },
                   value: { item: "value" },
-                  icon: { node: { component: "chrome/Badge", when: { item: "hasLevel" }, props: { tone: { item: "tone" } }, children: [text({ item: "level" })] } },
+                  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: [text({ input: "view.partialHint" })] },
+                        { 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" } } }
                       ]
                     }
                   }
                 },
-                on: { onActivate: ui("activate", { metricId: { item: "id" } }) }
+                on: { onActivate: ui2("activate", { metricId: { item: "id" } }) }
               }
             ]
           }
@@ -3062,12 +3090,12 @@ 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 ui3 = (intent) => applyMetricsUi(controller, intent);
-  return /* @__PURE__ */ jsxs3(Column, { children: [
+  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) => ui3({ kind: "range", rangeId }) }),
+        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,
@@ -3085,7 +3113,7 @@ function MetricsPanelView({ controller, ...options }) {
           tile.partial ? /* @__PURE__ */ jsx3(Text, { role: "meta", children: view.partialHint }) : null,
           tile.hasSpark ? /* @__PURE__ */ jsx3(Sparkline, { data: tile.spark, label: tile.sparkLabel }) : null
         ] }),
-        onActivate: () => ui3({ kind: "activate", metricId: tile.id })
+        onActivate: () => ui4({ kind: "activate", metricId: tile.id })
       },
       tile.id
     )) }) }) : null,
@@ -3287,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 text3 = ["contains", "notContains", "startsWith", "endsWith"];
+  const text4 = ["contains", "notContains", "startsWith", "endsWith"];
   const temporal = ["relative"];
   let ops = [...common];
   switch (column?.type) {
@@ -3305,10 +3333,10 @@ function offerableFilterOps(column, sourceOps = []) {
     case "url":
     case "select":
     case "multiselect":
-      ops = [...ops, ...text3];
+      ops = [...ops, ...text4];
       break;
     default:
-      ops = [...ops, ...text3, ...ordered];
+      ops = [...ops, ...text4, ...ordered];
   }
   if (sourceOps.length === 0) return ops;
   return ops.filter((op) => sourceOps.includes(op));
@@ -3939,7 +3967,7 @@ var fieldsManifest = {
 import { useSyncExternalStore as useSyncExternalStore4 } from "react";
 import {
   Badge as Badge4,
-  Column as Column2,
+  Column as Column3,
   EmptyState as EmptyState4,
   IconButton as IconButton3,
   Note,
@@ -4074,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 EMPTY2 = { 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 BEHAVIOURS2 = {
-  "data/fieldsPanelView": (inputs) => inputs.view ?? EMPTY2
+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 text2 = (b) => ({ component: "text", props: { text: b } });
-var ui2 = (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 },
@@ -4101,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: [text2({ 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: ui2("autoAssign") }, children: [text2({ value: "Auto-assign" })] },
-                    { component: "chrome/TextButton", when: { input: "view.manualApply" }, props: { strong: { value: true }, disabled: { input: "view.applyDisabled" } }, on: { onClick: ui2("apply") }, children: [text2({ 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" })] }
                   ]
                 }
               }
@@ -4128,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: [text2({ item: "stat" })] } } },
-                        on: { onClick: ui2("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" } }) }
                       }
                     ]
                   }
@@ -4138,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: [text2({ 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: [text2({ item: "hint" })] },
+                  { component: "chrome/Note", when: { item: "empty" }, children: [text3({ item: "hint" })] },
                   {
                     component: "chrome/RowList",
                     when: { item: "hasEntries" },
@@ -4155,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: ui2("aggregate", { shelfId: { item: "shelfId" }, columnId: { item: "columnId" }, fn: { arg: "" } }) } },
-                                { component: "chrome/TextButton", when: { item: "sortable" }, on: { onClick: ui2("direction", { shelfId: { item: "shelfId" }, columnId: { item: "columnId" } }) }, children: [text2({ item: "direction" })] },
-                                { component: "chrome/Badge", when: { item: "granularity" }, children: [text2({ 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" }, ui2("remove", { shelfId: { item: "shelfId" }, columnId: { item: "columnId" } })) }
+                          trailing: { node: removeButton({ item: "removeLabel" }, ui3("remove", { shelfId: { item: "shelfId" }, columnId: { item: "columnId" } })) }
                         }
                       }
                     ]
@@ -4173,11 +4201,11 @@ var FIELDS_DECLARATION = {
                 props: {
                   title: { value: "Filters" },
                   flush: { value: true },
-                  badge: { node: { component: "chrome/Badge", when: { input: "view.hasFilters" }, children: [text2({ 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: ui2("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: [text2({ 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" },
@@ -4187,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: ui2("filterOp", { index: { item: "index" }, op: { arg: "" } }) } } },
-                          trailing: { node: removeButton({ item: "removeLabel" }, ui2("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" } })) }
                         }
                       }
                     ]
@@ -4197,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: ui2("combinator", { combinator: { arg: "" } }) } } },
-                      right: { node: { component: "chrome/TextButton", on: { onClick: ui2("addGroup") }, children: [text2({ 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" })] } }
                     }
                   }
                 ]
@@ -4220,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 ui3 = (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(Column2, { 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: () => ui3({ kind: "autoAssign" }), children: "Auto-assign" }),
-          view.manualApply ? /* @__PURE__ */ jsx4(TextButton, { strong: true, disabled: view.applyDisabled, onClick: () => ui3({ 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
         ] })
       }
     ),
@@ -4243,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: () => ui3({ kind: "focus", columnId: column.id })
+          onClick: () => ui4({ kind: "focus", columnId: column.id })
         },
         column.id
       )) }) }),
@@ -4255,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) => ui3({ kind: "aggregate", shelfId: entry.shelfId, columnId: entry.columnId, fn }) }) : null,
-              entry.sortable ? /* @__PURE__ */ jsx4(TextButton, { onClick: () => ui3({ 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: () => ui3({ 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
@@ -4270,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: () => ui3({ 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) => ui3({ kind: "filterOp", index: filter.index, op }) }) : null,
-                trailing: /* @__PURE__ */ jsx4(IconButton3, { size: "sm", icon: /* @__PURE__ */ jsx4(CloseGlyph, { size: 11 }), label: filter.removeLabel, onClick: () => ui3({ 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,
@@ -4286,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) => ui3({ kind: "combinator", combinator }) }),
-                right: /* @__PURE__ */ jsx4(TextButton, { onClick: () => ui3({ 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" })
               }
             )
           ]
@@ -5423,10 +5451,10 @@ function parseJsonPath(path) {
   }
   return steps;
 }
-function findBracketEnd(text3, start) {
+function findBracketEnd(text4, start) {
   let quote = null;
-  for (let i = start + 1; i < text3.length; i += 1) {
-    const char = text3[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;
@@ -5850,9 +5878,9 @@ function firstGraphqlError(errors) {
 }
 
 // src/data/connectors/executors/csv.ts
-function sniffDelimiter(text3) {
+function sniffDelimiter(text4) {
   const candidates = [",", ";", "	", "|"];
-  const line = firstLogicalLine(text3);
+  const line = firstLogicalLine(text4);
   let best = ",";
   let bestCount = 0;
   for (const candidate of candidates) {
@@ -5874,21 +5902,21 @@ function sniffDelimiter(text3) {
   }
   return best;
 }
-function firstLogicalLine(text3) {
+function firstLogicalLine(text4) {
   let inQuotes = false;
-  for (let i = 0; i < text3.length; i += 1) {
-    const char = text3[i];
+  for (let i = 0; i < text4.length; i += 1) {
+    const char = text4[i];
     if (char === '"') {
-      if (inQuotes && text3[i + 1] === '"') i += 1;
+      if (inQuotes && text4[i + 1] === '"') i += 1;
       else inQuotes = !inQuotes;
     } else if ((char === "\n" || char === "\r") && !inQuotes) {
-      return text3.slice(0, i);
+      return text4.slice(0, i);
     }
   }
-  return text3;
+  return text4;
 }
-function parseCsv(text3, options = {}) {
-  const source = text3.charCodeAt(0) === 65279 ? text3.slice(1) : text3;
+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;
@@ -5923,17 +5951,17 @@ function dedupe(names) {
     return count === 0 ? name : `${name}_${count + 1}`;
   });
 }
-function scanRecords(text3, delimiter, quote) {
+function scanRecords(text4, delimiter, quote) {
   const records = [];
   let fields = [];
   let field = "";
   let inQuotes = false;
   let i = 0;
-  while (i < text3.length) {
-    const char = text3[i];
+  while (i < text4.length) {
+    const char = text4[i];
     if (inQuotes) {
       if (char === quote) {
-        if (text3[i + 1] === quote) {
+        if (text4[i + 1] === quote) {
           field += quote;
           i += 2;
           continue;
@@ -5951,7 +5979,7 @@ function scanRecords(text3, delimiter, quote) {
       i += 1;
       continue;
     }
-    if (text3.startsWith(delimiter, i)) {
+    if (text4.startsWith(delimiter, i)) {
       fields.push(field);
       field = "";
       i += delimiter.length;
@@ -5962,7 +5990,7 @@ function scanRecords(text3, delimiter, quote) {
       records.push(fields);
       fields = [];
       field = "";
-      i += char === "\r" && text3[i + 1] === "\n" ? 2 : 1;
+      i += char === "\r" && text4[i + 1] === "\n" ? 2 : 1;
       continue;
     }
     field += char;
@@ -7099,28 +7127,34 @@ 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,
-  BEHAVIOURS2 as FIELDS_BEHAVIOURS,
+  BEHAVIOURS3 as FIELDS_BEHAVIOURS,
   FIELDS_DECLARATION,
   FIELDS_PANEL_ID,
   FIELDS_RUNTIME_UNITS,
   FieldsController,
   FieldsPanelView,
   IMPLEMENTED_VIEW_MODES,
-  BEHAVIOURS as METRICS_BEHAVIOURS,
+  BEHAVIOURS2 as METRICS_BEHAVIOURS,
   METRICS_DECLARATION,
   METRICS_PANEL_ID,
   METRICS_RUNTIME_UNITS,
@@ -7134,6 +7168,7 @@ export {
   TABLE_PANEL_ID,
   TableController,
   TablePanelView,
+  applyChartUi,
   applyFieldsUi,
   applyMetricsUi,
   applyPrecision,
@@ -7145,6 +7180,9 @@ export {
   buildSelect,
   chartManifest,
   chartPanel,
+  chartRuntimeComponents,
+  chartViewManifest,
+  chartViewState,
   clamp,
   classifyBrowserFetchFailure,
   classifyHttpStatus,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xenosystem/blocks",
-  "version": "0.13.10",
+  "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.21.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.21.0",
+    "@xenosystem/components": "^0.21.1",
     "@xenosystem/data-core": "^0.1.0",
     "@xenosystem/elements": "0.0.1",
     "@xenosystem/elements-react": "0.0.1",