@inflexa-ai/harness 0.42.2 → 0.43.1

package/dist/report-render/page.js

@@ -7,7 +7,10 @@
  */
 import { AG_GRID_ASSET, assetSource, ECHARTS_ASSET, TSPROV_ASSET } from "./assets.js";
 import { CHART_SOURCE_MEMBER, POINT_LABEL } from "./chart.js";
-import { ECHARTS_THEME_NAME, GRID_HEADER_BORDER_PX, GRID_HEADER_HEIGHT_PX, GRID_MIN_COLUMN_WIDTH_PX, GRID_PRINT_ROW_CAP, GRID_ROW_HEIGHT_PX, GRID_THEME_PARAMS, GRID_TOOLTIP_DELAY_MS, GRID_VISIBLE_ROWS, } from "./design.js";
+import { CHART_RENDERERS_SOURCE } from "./chart-renderers.js";
+import { CHART_TOOLBOX_SOURCE, TOOLBOX_ZLEVEL } from "./chart-toolbox.js";
+import { CHART_EXPORT_SIZES, ECHARTS_THEME_NAME, GRID_HEADER_BORDER_PX, GRID_HEADER_HEIGHT_PX, GRID_MIN_COLUMN_WIDTH_PX, GRID_PRINT_ROW_CAP, GRID_ROW_HEIGHT_PX, GRID_THEME_PARAMS, GRID_TOOLTIP_DELAY_MS, GRID_VISIBLE_ROWS, } from "./design.js";
+import { HYBRID_SVG_SOURCE } from "./hybrid-svg.js";
 import { REPORT_PROVENANCE_GLOBAL } from "./provenance-data.js";
 import { scriptJson } from "./script-json.js";
 import { TABLE_DATA_GLOBAL } from "./table-data.js";
@@ -90,8 +93,9 @@ const SPY_BOTTOM_MARGIN_PERCENT = 70;
  *
  * The fragment writes its own constants, because a page script reads no module binding. Each rule here is
  * the twin of one rule of the server derivation: the number read of a cell, the four transforms, the
- * competition rank, the compare of a sort, and the three-way classification of a preset. A shared test
- * vector runs the transforms of both sides over one set of cells, thus the two cannot drift in silence.
+ * competition rank, the compare of a sort, the classification of a preset, and the item that adds
+ * the member of a continuous color and of a size after the pair. A shared test vector runs the transforms
+ * and the items of both sides over one set of cells, thus the two cannot drift in silence.
  *
  * The build reads the decoded rows of the payload. The decoder runs before this script, thus a row is a
  * record and a cell reads by its column name.
@@ -174,7 +178,17 @@ function reportColumn(payload, index) {
 }
 function reportChannel(payload, spec) {
   var cells = reportColumn(payload, spec.column);
-  return spec.transform === undefined ? cells : reportTransform(cells, spec.transform);
+  if (spec.transform !== undefined) {
+    return reportTransform(cells, spec.transform);
+  }
+  if (spec.numeric !== true) {
+    return cells;
+  }
+  var numbers = [];
+  for (var c = 0; c < cells.length; c++) {
+    numbers.push(cells[c] === null ? null : reportNumber(cells[c]));
+  }
+  return numbers;
 }
 function reportCompare(a, b) {
   var left = reportNumber(a);
@@ -189,7 +203,7 @@ function reportCompare(a, b) {
   }
   return x > y ? 1 : 0;
 }
-function reportCategory(rule, xValue, yValue) {
+function reportCategory(rule, xValue, yValue, pValue) {
   // The rule gives the place of the category, and the descriptor of a series names the same place. Thus
   // the two sides compare numbers and no category name rides the page.
   var x = reportNumber(xValue);
@@ -197,6 +211,13 @@ function reportCategory(rule, xValue, yValue) {
   if (!rule || x === null || y === null) {
     return -1;
   }
+  if (rule.kind === "ma") {
+    if (x <= 0) {
+      return -1;
+    }
+    var p = reportNumber(pValue);
+    return p !== null && p < rule.cut ? 0 : 1;
+  }
   if (y <= rule.cut) {
     return 2;
   }
@@ -208,8 +229,11 @@ function reportCategory(rule, xValue, yValue) {
 function reportSeriesData(payload, source, rule) {
   var x = reportChannel(payload, source.x);
   var y = reportChannel(payload, source.y);
+  var color = source.color === undefined ? null : reportChannel(payload, source.color);
+  var size = source.size === undefined ? null : reportChannel(payload, source.size);
   var group = source.group === undefined ? null : reportChannel(payload, source.group);
   var labels = source.label === undefined ? null : reportColumn(payload, source.label);
+  var ruleCells = rule && rule.kind === "ma" ? reportColumn(payload, payload.columns.indexOf(rule.column)) : null;
   var flags = Object.create(null);
   var declared = source.flags || [];
   for (var f = 0; f < declared.length; f++) {
@@ -223,20 +247,35 @@ function reportSeriesData(payload, source, rule) {
     if (group !== null && group[r] !== source.value) {
       continue;
     }
-    if (source.category !== undefined && reportCategory(rule, x[r], y[r]) !== source.category) {
+    if (source.category !== undefined && reportCategory(rule, x[r], y[r], ruleCells === null ? null : ruleCells[r]) !== source.category) {
+      continue;
+    }
+    var shade = color === null ? null : reportNumber(color[r]);
+    var weight = size === null ? null : reportNumber(size[r]);
+    if ((color !== null && shade === null) || (size !== null && weight === null)) {
       continue;
     }
-    points.push({ index: r, x: x[r], y: y[r] });
+    points.push({ index: r, x: x[r], y: y[r], color: shade, size: weight });
   }
   if (source.sort) {
     points.sort(function (a, b) {
       return reportCompare(a.x, b.x);
     });
+  } else if (source.rise) {
+    points.sort(function (a, b) {
+      return a.color - b.color;
+    });
   }
   var data = [];
   for (var p = 0; p < points.length; p++) {
     var point = points[p];
     var pair = source.swap ? [point.y, point.x] : [point.x, point.y];
+    if (point.color !== null) {
+      pair.push(point.color);
+    }
+    if (point.size !== null) {
+      pair.push(point.size);
+    }
     var label = labels === null ? null : labels[point.index];
     var named = label !== null && label !== undefined;
     if (!named && flags[point.index] !== true) {
@@ -251,17 +290,73 @@ function reportSeriesData(payload, source, rule) {
   }
   return data;
 }`;
+/**
+ * The window global that holds the option of each chart, keyed by the id of its container.
+ *
+ * The option is plain data: its rows are built, and each renderer is still a name. The export of a chart
+ * draws it again from this entry, thus the page and each exported file read one option.
+ */
+export const CHART_OPTIONS_GLOBAL = "__REPORT_CHART_OPTIONS";
+/**
+ * The export sizes that the page draws, keyed by the name of the menu entry: the theme, the text size, the CSS
+ * box, the millimeter box of a column, and the pixel ratio of each export.
+ */
+const PAGE_EXPORT_SIZES = Object.fromEntries(Object.entries(CHART_EXPORT_SIZES).map(([kind, size]) => [
+    kind,
+    {
+        theme: size.theme,
+        textPx: size.textPx,
+        width: size.widthPx,
+        height: size.heightPx,
+        ...("widthMm" in size ? { widthMm: size.widthMm, heightMm: size.heightMm } : {}),
+        pixelRatio: size.pixelRatio,
+    },
+]));
+/**
+ * The time that the object URL of a built SVG file stays alive after its download starts, in milliseconds. The
+ * browser reads the URL when the download starts, and the page then frees the text.
+ */
+const DOWNLOAD_URL_LIFETIME_MS = 60_000;
 /**
  * The page-side script that wires each chart. It finds every chart container, reads the option JSON from
  * the sibling `<script type="application/json">` element, and initializes ECharts with the registered
  * theme. The skeleton registers the theme before this script runs. A resize handler keeps each chart
- * fit to the window.
+ * fit to the window. It draws a chart again only when the container of the chart changes size. A capture past
+ * the viewport resizes the window and keeps each container, and a redraw there restarts the chunked render of
+ * a dense chart. A container of zero width or height keeps its chart as it is: ECharts 6.1.0 throws when a
+ * Sankey draws at a zero size (apache/echarts#21706), and a capture can give a container a zero width for one
+ * resize.
+ *
+ * A custom series names its renderer as a string, because the option is JSON. The script registers each named
+ * renderer with the chart runtime before the first chart initializes, and it keeps the option under the
+ * container id.
+ *
+ * The option carries the toolbox of the chart. Each handler of the toolbox is the name of a page function, and
+ * the script binds each function after the parse and before the chart initializes. The formatter of a genome axis
+ * is such a name too. After the init the script attaches the zoom handler of the toolbox to the chart. The
+ * download control opens the download menu of the card. The print hides the canvas layer of the toolbox of each
+ * chart, because the runtime draws the toolbox inside the chart body, and the end of the print shows the layer
+ * again. The print sets no option, because a new option starts the chunked draw of a dense chart again.
+ *
+ * A click on a PNG entry of the menu draws the kept option again on a detached element, at the CSS size of the
+ * export and its pixel ratio, in the theme of its text size. The entry states the height of its export, because
+ * a taller chart body grows the height of a column export. Each series draws in one pass, because the script
+ * reads the PNG in the same task and a chunked draw ends in a later frame. Then the script reads the PNG and
+ * downloads it through an anchor. An entry that names no kept chart, or no export size, draws nothing.
+ *
+ * A click on a hybrid SVG entry builds the SVG of a dense chart from the kept option: the vector draw, the raster
+ * draw of the point layer at 300 DPI, and the composition. Then the script downloads the text through an anchor.
+ * A build that gives no file keeps the menu open and shows its fault note, thus the reader sees why the entry gave
+ * no file and can take a PNG.
  *
  * An option that carries the data-source member holds no row. The script then reads the registered payload
  * of the artifact and builds the data of each series from the descriptors. A mount whose payload the
  * registry does not hold keeps its empty card, and the walk continues.
  *
- * The script signals readiness when the bootstrap completes, and immediately when no chart exists. It sets
+ * The script signals readiness when each chart that it set fires its first `finished` event, and immediately
+ * when no chart exists. A dense scatter draws in chunks over some frames, and the runtime fires `finished`
+ * after the last chunk. Thus a capture that keys on the signal sees each point. A chart whose option throws
+ * counts as finished, thus one fault never withholds the signal. It sets
  * the `window.__inflexaThemeReady` sentinel and dispatches the `inflexa-theme-ready` event on the document.
  * A reader that captures the page keys on this signal, thus the capture returns when the page is ready and
  * not at a timeout. The sentinel guards a listener that registers after the dispatch, thus a late listener
@@ -275,6 +370,9 @@ function reportSeriesData(payload, source, rule) {
  */
 export const CHART_BOOTSTRAP = `(function () {
   ${CHART_SERIES_BUILDER}
+  ${CHART_RENDERERS_SOURCE}
+  ${HYBRID_SVG_SOURCE}
+  ${CHART_TOOLBOX_SOURCE}
   function signalReady() {
     window.${THEME_READY_SENTINEL} = true;
     document.dispatchEvent(new Event(${JSON.stringify(THEME_READY_EVENT)}));
@@ -291,7 +389,31 @@ export const CHART_BOOTSTRAP = `(function () {
     whenRevealed(signalReady);
     return;
   }
+  reportRegisterRenderers(echarts);
+  var pending = 0;
+  var walked = false;
+  var signalled = false;
+  function settle() {
+    if (!signalled && walked && pending === 0) {
+      signalled = true;
+      whenRevealed(signalReady);
+    }
+  }
+  function track(chart) {
+    var done = false;
+    pending += 1;
+    function finish() {
+      if (!done) {
+        done = true;
+        pending -= 1;
+        settle();
+      }
+    }
+    chart.on("finished", finish);
+    return finish;
+  }
   var registry = window.${TABLE_DATA_GLOBAL};
+  var kept = window.${CHART_OPTIONS_GLOBAL} = window.${CHART_OPTIONS_GLOBAL} || Object.create(null);
   var containers = document.querySelectorAll("[data-echarts-id]");
   for (var i = 0; i < containers.length; i++) {
     var container = containers[i];
@@ -314,8 +436,17 @@ export const CHART_BOOTSTRAP = `(function () {
           series[s].data = reportSeriesData(payload, source.series[s], source.rule);
         }
       }
+      reportBindToolbox(option);
       var chart = echarts.init(container, ${JSON.stringify(ECHARTS_THEME_NAME)});
-      chart.setOption(option);
+      reportWatchZoom(chart, option);
+      kept[container.getAttribute("id") || ""] = option;
+      var finish = track(chart);
+      try {
+        chart.setOption(option);
+      } catch (fault) {
+        finish();
+        throw fault;
+      }
     } catch (cause) {
       console.error("chart bootstrap failed for " + (container.getAttribute("data-echarts-id") || "(no id)") + ": " + (cause && cause.message ? cause.message : cause));
     }
@@ -324,12 +455,116 @@ export const CHART_BOOTSTRAP = `(function () {
     var nodes = document.querySelectorAll("[data-echarts-id]");
     for (var j = 0; j < nodes.length; j++) {
       var instance = echarts.getInstanceByDom(nodes[j]);
-      if (instance) {
+      var width = nodes[j].clientWidth;
+      var height = nodes[j].clientHeight;
+      if (instance && width > 0 && height > 0 && (instance.getWidth() !== width || instance.getHeight() !== height)) {
         instance.resize();
       }
     }
   });
-  whenRevealed(signalReady);
+  function toolboxShown(shown) {
+    function place(layer) {
+      if (layer.zlevel === ${TOOLBOX_ZLEVEL} && layer.dom) {
+        layer.dom.style.visibility = shown ? "" : "hidden";
+      }
+    }
+    var nodes = document.querySelectorAll("[data-echarts-id]");
+    for (var n = 0; n < nodes.length; n++) {
+      var instance = echarts.getInstanceByDom(nodes[n]);
+      var painter = instance ? instance.getZr().painter : null;
+      if (painter && typeof painter.eachLayer === "function") {
+        painter.eachLayer(place);
+      }
+    }
+  }
+  window.addEventListener("beforeprint", function () {
+    reportCloseExportMenu(false);
+    toolboxShown(false);
+  });
+  window.addEventListener("afterprint", function () {
+    toolboxShown(true);
+  });
+  var exportSizes = ${JSON.stringify(PAGE_EXPORT_SIZES)};
+  function reportOnePassOption(option) {
+    var out = Object.assign({}, option);
+    var series = reportList(option.series);
+    var drawn = [];
+    for (var s = 0; s < series.length; s++) {
+      drawn.push(Object.assign({}, series[s], { progressive: 0 }));
+    }
+    out.series = drawn;
+    return out;
+  }
+  function reportExportPng(control) {
+    var kind = control.getAttribute("data-export") || "";
+    var chartId = control.getAttribute("data-chart") || "";
+    if (!Object.prototype.hasOwnProperty.call(exportSizes, kind) || !Object.prototype.hasOwnProperty.call(kept, chartId)) {
+      return;
+    }
+    var size = exportSizes[kind];
+    var height = Number(control.getAttribute("data-height")) || size.height;
+    var host = document.createElement("div");
+    var offscreen = echarts.init(host, size.theme, { renderer: "canvas", width: size.width, height: height, devicePixelRatio: size.pixelRatio });
+    try {
+      offscreen.setOption(reportOnePassOption(reportExportOption(kept[chartId], size.textPx, size.width, height)));
+      var link = document.createElement("a");
+      link.href = offscreen.getDataURL({ type: "png", pixelRatio: size.pixelRatio, backgroundColor: "#ffffff" });
+      link.download = control.getAttribute("data-file") || "chart.png";
+      document.body.appendChild(link);
+      link.click();
+      document.body.removeChild(link);
+    } finally {
+      offscreen.dispose();
+    }
+  }
+  function reportExportHybrid(control) {
+    var kind = control.getAttribute("data-hybrid") || "";
+    var chartId = control.getAttribute("data-chart") || "";
+    if (!Object.prototype.hasOwnProperty.call(exportSizes, kind) || !Object.prototype.hasOwnProperty.call(kept, chartId)) {
+      return true;
+    }
+    var size = Object.assign({}, exportSizes[kind]);
+    size.height = Number(control.getAttribute("data-height")) || size.height;
+    size.heightMm = Number(control.getAttribute("data-height-mm")) || size.heightMm;
+    var svg = null;
+    try {
+      svg = reportHybridSvg(echarts, kept[chartId], size);
+    } catch (cause) {
+      console.error("hybrid svg failed for " + chartId + ": " + (cause && cause.message ? cause.message : cause));
+      return false;
+    }
+    if (svg === null) {
+      console.error("hybrid svg failed for " + chartId + ": the chart holds no point layer inside a grid");
+      return false;
+    }
+    var url = URL.createObjectURL(new Blob([svg], { type: "image/svg+xml" }));
+    var link = document.createElement("a");
+    link.href = url;
+    link.download = control.getAttribute("data-file") || "chart.svg";
+    document.body.appendChild(link);
+    link.click();
+    document.body.removeChild(link);
+    setTimeout(function () {
+      URL.revokeObjectURL(url);
+    }, ${DOWNLOAD_URL_LIFETIME_MS});
+    return true;
+  }
+  document.addEventListener("click", function (event) {
+    var target = event.target;
+    var control = target && typeof target.closest === "function" ? target.closest("[data-export], [data-hybrid]") : null;
+    if (control) {
+      if (control.getAttribute("data-export") !== null) {
+        reportExportPng(control);
+      } else if (reportExportHybrid(control) === false) {
+        reportMenuFault(control);
+        return;
+      }
+    }
+    reportMenuClick(event);
+  });
+  document.addEventListener("keydown", reportMenuKey);
+  walked = true;
+  settle();
 })();`;
 /**
  * The page-side script that reveals each `fade-in` element as it enters the viewport. The `data-delay`

package/dist/report-render/render.d.ts

@@ -17,20 +17,23 @@
 import { type Result } from "neverthrow";
 import type { ReportDocument } from "../contracts/report-blocks.js";
 import { type CitationRecords } from "../report-model/reference-resolver.js";
+import { type ChartOpts } from "./chart.js";
 import { type DerivationChain } from "./references.js";
 import { type ProvenanceExport } from "./provenance-data.js";
 import type { RenderedPage, RenderProblem, RenderValues } from "./types.js";
 /**
- * The optional inputs of one render: the bibliography of the pin, the chains of the session, and the frozen
- * provenance of the analysis.
+ * The optional inputs of one render: the bibliography of the pin, the chains of the session, the frozen
+ * provenance of the analysis, and the options of the chart derivation.
  *
  * Each member is absent on its own, and a caller gives the members that it holds. A positional tail of
- * three optional inputs made a caller of the last one pad the two before it, thus the three ride one bag.
+ * three optional inputs made a caller of the last one pad the two before it, thus the inputs ride one bag.
+ * An absent `chart` member derives each chart with the registered figure modules.
  */
 export interface RenderOptions {
     readonly records?: CitationRecords;
     readonly derivations?: readonly DerivationChain[];
     readonly provenance?: ProvenanceExport;
+    readonly chart?: ChartOpts;
 }
 /**
  * Render a report document, its value map, and the pinned citation records to one page and its data assets.
@@ -56,7 +59,13 @@ export interface RenderOptions {
  * The renderer writes no file. The data assets ride the result, and the caller stages them beside the page.
  * Thus the render stays pure, and two renders of one document give byte-identical assets.
  *
+ * Each chart gives two SVG files beside the data assets, and its card links them. The page loads each table
+ * payload as a script, and it loads no SVG. Thus the SVG files ride the staged list of the result alone.
+ *
  * One artifact gives one payload. A table block and a chart block that bind it read that one asset, and a
  * chart under the inline bound carries its rows in its own option and registers none.
+ *
+ * The render is asynchronous because it loads the chart runtime of the SVG export. Each other step is
+ * synchronous.
  */
-export declare function renderReportPage(document: ReportDocument, values: RenderValues, { records, derivations, provenance }?: RenderOptions): Result<RenderedPage, RenderProblem[]>;
+export declare function renderReportPage(document: ReportDocument, values: RenderValues, { records, derivations, provenance, chart }?: RenderOptions): Promise<Result<RenderedPage, RenderProblem[]>>;

package/dist/report-render/render.js

@@ -18,7 +18,8 @@ import { err, ok } from "neverthrow";
 import { serializeReference } from "../contracts/report-reference.js";
 import { citationRecordOf } from "../report-model/reference-resolver.js";
 import { renderChart } from "./views/chart-view.js";
-import { deriveChartRender } from "./chart.js";
+import { DEFAULT_CHART_OPTS, deriveChartRender } from "./chart.js";
+import { chartSvgAssets, loadChartRuntime } from "./chart-export.js";
 import { assemblePage, renderBand, renderReferenceSection } from "./views/page-view.js";
 import { renderClaim, renderNav, renderSection, renderText } from "./views/prose.js";
 import { citationKeyOf, derivationChains, ReferenceLedger } from "./references.js";
@@ -49,13 +50,26 @@ import { renderCitation, renderFigure, renderMetric, renderMetricGrid, renderTab
  * The renderer writes no file. The data assets ride the result, and the caller stages them beside the page.
  * Thus the render stays pure, and two renders of one document give byte-identical assets.
  *
+ * Each chart gives two SVG files beside the data assets, and its card links them. The page loads each table
+ * payload as a script, and it loads no SVG. Thus the SVG files ride the staged list of the result alone.
+ *
  * One artifact gives one payload. A table block and a chart block that bind it read that one asset, and a
  * chart under the inline bound carries its rows in its own option and registers none.
+ *
+ * The render is asynchronous because it loads the chart runtime of the SVG export. Each other step is
+ * synchronous.
  */
-export function renderReportPage(document, values, { records, derivations, provenance } = {}) {
+export async function renderReportPage(document, values, { records, derivations, provenance, chart = DEFAULT_CHART_OPTS } = {}) {
     const problems = [];
     const ledger = new ReferenceLedger();
-    const data = { payloads: new Map(), mounts: 0, view: { lineage: provenance !== undefined } };
+    const data = {
+        payloads: new Map(),
+        mounts: 0,
+        svgs: [],
+        view: { lineage: provenance !== undefined },
+        chart,
+        chartRuntime: await loadChartRuntime(),
+    };
     const content = [];
     for (const [index, section] of document.sections.entries()) {
         content.push(renderBand(index, renderBlock(section, values, ledger, records, data, 0, problems)));
@@ -71,7 +85,7 @@ export function renderReportPage(document, values, { records, derivations, prove
     const references = renderReferenceSection(ledger, document.sections.length, records, derivationChains(derivations));
     return ok({
         html: assemblePage(document.title, nav, content.join(""), references, { dataAssets: tableAssets, grids: data.mounts > 0, provenanceAssets }),
-        dataAssets: [...provenanceAssets, ...tableAssets],
+        dataAssets: [...provenanceAssets, ...tableAssets, ...data.svgs],
     });
 }
 /**
@@ -159,7 +173,11 @@ function renderBlock(block, values, ledger, records, data, depth, problems) {
             // under two ids. One binding resolves one row set, thus the column places and the row places of
             // the descriptors address the registered payload whichever block encoded it.
             const columns = tableColumns(entry);
-            const derived = deriveChartRender(block, entry.rows, entry.columns, { key: block.id, columns });
+            const derived = deriveChartRender(block, entry.rows, entry.columns, { key: block.id, columns }, {
+                ...(entry.statistics !== undefined ? { statistics: entry.statistics } : {}),
+                ...(entry.track !== undefined ? { track: entry.track } : {}),
+                ...(entry.trees !== undefined ? { trees: entry.trees } : {}),
+            }, data.chart);
             if (derived.isErr()) {
                 problems.push(derived.error);
                 return "";
@@ -167,7 +185,20 @@ function renderBlock(block, values, ledger, records, data, depth, problems) {
             if (derived.value.readsPayload) {
                 registerPayload(data, block.binding, block.id, () => payloadOf(block.binding, entry, columns));
             }
-            return renderChart(block, ledger, derived.value.option, data.view);
+            // The export reads the chart with every row inline, thus a dense chart exports each point.
+            const svgs = chartSvgAssets(data.chartRuntime, block.id, derived.value.inline, derived.value.bodyPx);
+            if (svgs.isErr()) {
+                problems.push(svgs.error);
+                return "";
+            }
+            if (svgs.value !== undefined) {
+                data.svgs.push(svgs.value.single, svgs.value.double);
+            }
+            return renderChart(block, ledger, derived.value.option, data.view, {
+                bodyPx: derived.value.bodyPx,
+                ...(derived.value.widthPx !== undefined ? { widthPx: derived.value.widthPx } : {}),
+                ...(svgs.value !== undefined ? { svg: { single: svgs.value.single.name, double: svgs.value.double.name } } : {}),
+            });
         }
         case "section":
             return renderSection(block, depth, renderChildren(block.blocks, values, ledger, records, data, depth + 1, problems));

package/dist/report-render/types.d.ts

@@ -8,6 +8,21 @@
  * image bytes.
  */
 import type { DataAsset } from "./table-data.js";
+/** One statistic of a chart: the label of the block, and the value of the cell that the statistic binds. */
+export interface RenderStatistic {
+    label: string;
+    value: string | number;
+}
+/** The second table of a chart: the rows of the track binding, and the optional column order. */
+export interface RenderTrack {
+    rows: Array<Record<string, string | number>>;
+    columns?: string[];
+}
+/** The trees of the category axes of a chart: the rows of the tree binding of each axis, with its optional column order. */
+export interface RenderTrees {
+    x?: RenderTrack;
+    y?: RenderTrack;
+}
 /**
  * The value that one block resolves to, as a closed union. A `scalar` gives one number or one string. A
  * `table` gives the rows and the optional column order. A `figure` gives a ready source string. A
@@ -15,6 +30,9 @@ import type { DataAsset } from "./table-data.js";
  *
  * A `table` carries `total` when a row bound cut the rows of the artifact. The renderer states the shown
  * count against it. A table with no bound carries none, and the row count answers for it.
+ *
+ * The `table` of a chart also carries the value of each statistic, in block order, the track, and the tree of
+ * each axis, where the block declares them. A table block declares none of them.
  */
 export type RenderValue = {
     type: "scalar";
@@ -24,6 +42,9 @@ export type RenderValue = {
     rows: Array<Record<string, string | number>>;
     columns?: string[];
     total?: number;
+    statistics?: RenderStatistic[];
+    track?: RenderTrack;
+    trees?: RenderTrees;
 } | {
     type: "figure";
     src: string;
@@ -48,8 +69,8 @@ export type RenderValues = Record<string, RenderValue>;
  * The renderer writes no file. Thus it gives the asset bytes back to the caller, and the caller stages
  * them beside the page. A document with no table gives an empty list, and its page references none.
  *
- * The list holds the provenance assets of the render beside the table payloads, thus one stage writes each
- * file that the page loads and the caller sorts nothing.
+ * The list holds the provenance assets of the render beside the table payloads and the SVG files of each
+ * chart, thus one stage writes each file that the page loads or links, and the caller sorts nothing.
  */
 export interface RenderedPage {
     html: string;

package/dist/report-render/value-bridge.d.ts

@@ -13,6 +13,8 @@
  * one call reports each fault at one time.
  */
 import { type Result } from "neverthrow";
+import type { Block } from "../contracts/report-blocks.js";
+import { type ChartSlot } from "../report-model/block-walk.js";
 import type { ResolvedValue } from "../report-model/reference-resolver.js";
 import type { RenderValues } from "./types.js";
 /** The block kinds that carry no render value. Each one renders from the block and the ledger alone. */
@@ -25,28 +27,46 @@ export type ResolvedFile = Extract<ResolvedValue, {
 }>;
 /** The policy that turns a resolved file echo into a figure `src` string. The caller owns the policy. */
 export type FigureSourcePolicy = (file: ResolvedFile) => string;
+/** One resolved statistic of a chart: the label of the block, and the resolved value of its cell. */
+export interface StatisticResolution {
+    label: string;
+    resolved: ResolvedValue;
+}
 /**
  * The resolution result of one block: the block id, the block kind, and the resolved value of its binding.
  *
  * A value-bearing kind carries the resolved value. A no-value kind carries none, thus a text block with
- * no binding is representable and a value on it is not.
+ * no binding is representable and a value on it is not. A chart also carries the resolved track, the resolved
+ * tree of each axis, and each resolved statistic, in block order, where the block declares them.
  */
 export type BlockResolution = {
     blockId: string;
     kind: NoValueKind;
 } | {
     blockId: string;
-    kind: ValueBearingKind;
+    kind: Exclude<ValueBearingKind, "chart">;
+    resolved: ResolvedValue;
+} | {
+    blockId: string;
+    kind: "chart";
     resolved: ResolvedValue;
+    track?: ResolvedValue;
+    trees?: {
+        x?: ResolvedValue;
+        y?: ResolvedValue;
+    };
+    statistics?: StatisticResolution[];
 };
 /**
  * One typed mismatch between a block kind and a resolved value type. `blockId` names the block, and
  * `blockKind` names the kind that sets the expectation. `expected` names the resolved type that the kind
- * needs, and `actual` names the resolved type that arrived.
+ * needs, and `actual` names the resolved type that arrived. `slot` names the track or the statistic of a
+ * chart whose value has the wrong type.
  */
 export interface BridgeMismatch {
     blockId: string;
     blockKind: ValueBearingKind;
+    slot?: ChartSlot;
     expected: ResolvedValue["type"];
     actual: ResolvedValue["type"];
 }
@@ -59,4 +79,19 @@ export interface BridgeMismatch {
  * complete map.
  */
 export declare function bridgeValues(resolutions: readonly BlockResolution[], figureSrc: FigureSourcePolicy): Result<RenderValues, BridgeMismatch[]>;
+/**
+ * Pair each block with the resolved value of its binding, in document order.
+ *
+ * A value-bearing kind carries the resolved value of its binding, looked up by the block id from the map
+ * that the resolution pass filled. A chart also carries the value of its track, of each tree, and of each statistic, looked
+ * up by the block id and the slot. The label of a statistic comes from the block, because the render value
+ * prints it. A no-value kind carries none. Where a reference sits in a block is the knowledge of
+ * `block-walk.ts`, thus this walk reads the slots that the walk names and never a binding field.
+ *
+ * The switch is exhaustive over the eight block kinds. A ninth kind reaches the end with no return, and
+ * the declared return type fails the build. Thus the walk cannot drop a kind in silence. A value-bearing
+ * block reaches here only when its reference resolved, because an unresolved reference short-circuits
+ * before this walk.
+ */
+export declare function collectResolutions(blocks: readonly Block[], resolvedByBlock: ReadonlyMap<string, ResolvedValue>, resolvedBySlot: ReadonlyMap<string, ReadonlyMap<ChartSlot, ResolvedValue>>): BlockResolution[];
 export {};