@inflexa-ai/harness 0.42.2 → 0.43.1

package/dist/report-render/hybrid-svg.js

@@ -0,0 +1,504 @@
+/**
+ * The hybrid SVG of a dense chart: the vector axes, text, legend, and guides, over one raster layer of the points.
+ *
+ * A chart past the point bound of the export gets no staged SVG, because a vector file of many thousands of
+ * points is too large. The page builds its SVG on a click instead. It draws the export option with the SVG
+ * renderer and the point data emptied, it draws the points alone on a canvas at 300 DPI, and it puts the canvas
+ * image into the SVG at the rectangle of the grid, under the vector marks. The server has no canvas, thus only
+ * the page builds this file.
+ *
+ * The rule of a point layer and the composition of the file hold one rule each in two twins: the TypeScript
+ * function and the page function. A shared test vector runs both, thus the two cannot drift in silence. The
+ * option transforms and the two draws exist on the page alone, because the server never builds the file.
+ */
+/**
+ * True when one series draws a point for each row: a `scatter` whose symbol draws and which shows no series
+ * label. A scatter of size zero, or one with a shown label, carries names, and names stay vector text.
+ */
+export function isPointLayer(series) {
+    if (typeof series !== "object" || series === null)
+        return false;
+    const fields = series;
+    if (fields.type !== "scatter" || fields.symbolSize === 0 || fields.symbol === "none")
+        return false;
+    const label = fields.label;
+    return !(typeof label === "object" && label !== null && label.show === true);
+}
+/** True when an option holds a point layer. The page can then build the hybrid SVG of the option. */
+export function holdsPointLayer(option) {
+    const series = option.series;
+    return Array.isArray(series) ? series.some(isPointLayer) : isPointLayer(series);
+}
+/**
+ * The SVG text with its root at the millimeter size of a column. The view box keeps the pixel space, thus a
+ * vector editor opens the file at the column width. A size with no millimeter box leaves the root as it is.
+ */
+export function millimeterRoot(svg, size) {
+    if (size.widthMm === undefined || size.heightMm === undefined)
+        return svg;
+    return svg.replace(`<svg width="${size.widthPx}" height="${size.heightPx}"`, `<svg width="${size.widthMm}mm" height="${size.heightMm}mm"`);
+}
+/** The count of decimals of a coordinate of the layer. A thousandth of a pixel is past each display. */
+const LAYER_DECIMALS = 1000;
+/** One coordinate of the layer, rounded to the decimals of the layer. */
+function layerNumber(value) {
+    return Math.round(value * LAYER_DECIMALS) / LAYER_DECIMALS;
+}
+/** One attribute value with each character that can close it written as an entity. */
+function attributeText(value) {
+    return value.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/</g, "&lt;");
+}
+/** The root tag of an SVG file, and the transparent background rectangle that the chart runtime writes first. */
+const ROOT_TAG = /^<svg\b[^>]*>/;
+const BACKGROUND_RECT = /^\s*<rect width="[^"]*" height="[^"]*" x="0" y="0"[^>]*><\/rect>/;
+/**
+ * The hybrid SVG file: the vector file with one `<image>` element of the point layer, and the root at the
+ * millimeter size.
+ *
+ * The image goes first after the background rectangle, thus each vector mark draws over the points: the axes,
+ * the guides, the names, and the legend. The rectangle of the image is the grid rectangle, and the image
+ * stretches to it, because the raster drew the grid at that rectangle. A text that holds no SVG root passes
+ * through with no image.
+ */
+export function composeHybridSvg(svg, layer, size) {
+    const root = ROOT_TAG.exec(svg);
+    if (root === null)
+        return svg;
+    let at = root[0].length;
+    const background = BACKGROUND_RECT.exec(svg.slice(at));
+    if (background !== null)
+        at += background[0].length;
+    const image = `\n<image href="${attributeText(layer.href)}" x="${layerNumber(layer.x)}" y="${layerNumber(layer.y)}" ` +
+        `width="${layerNumber(layer.width)}" height="${layerNumber(layer.height)}" preserveAspectRatio="none"></image>`;
+    return millimeterRoot(svg.slice(0, at) + image + svg.slice(at), size);
+}
+/**
+ * The count of halvings of the search for one edge of a grid. The chart is at most some thousand pixels wide,
+ * thus twenty halvings place the edge closer than a hundredth of a pixel.
+ */
+const EDGE_SEARCH_STEPS = 20;
+/** The symbol size of a scatter that states none, in pixels: the default of the chart runtime. */
+const RUNTIME_SYMBOL_PX = 10;
+/**
+ * The page twin of the point-layer rule and of the composition, and the page build of the hybrid file, as
+ * browser source text.
+ *
+ * `reportHybridSvg(runtime, option, size)` is the entry point. It reads the chart runtime and the document of
+ * the page, and it gives the SVG text, or `null` when the option holds no point layer or the runtime gives no
+ * grid rectangle. The fragment reads `reportExportOption` of the renderer fragment, thus the bootstrap inlines
+ * that fragment first.
+ *
+ * The draws run in this order:
+ *
+ * 1. The vector draw takes the export option with the rows of each point layer emptied. Each point layer keeps
+ *    each row that carries its own label, and two anchors with no symbol at the least and the greatest value of
+ *    each dimension. Thus each axis and each color scale keeps the extent of the full rows.
+ * 2. The rectangle of each grid that holds a point layer comes from the runtime: a halving search of each edge
+ *    with `containPixel` from a point inside the grid. The extent of each continuous axis of such a grid comes
+ *    from `convertFromPixel` at the two edges.
+ * 3. The raster draw takes the export option with the point layers alone. Each grid stands at its measured
+ *    rectangle, each axis holds its measured extent and draws nothing, and the legend, the graphics, and the
+ *    color scales draw nothing. Thus each point lands on the pixel where the vector axes place it.
+ * 4. The composition crops the raster to the union of the grid rectangles at 300 DPI, and it puts the PNG into
+ *    the vector file. The crop reaches past each grid edge by half of the largest symbol of a layer or of a
+ *    visual map of a layer, thus a point on an edge keeps its whole symbol, as it does on the page.
+ */
+export const HYBRID_SVG_SOURCE = `function reportIsPointLayer(series) {
+  if (typeof series !== "object" || series === null) {
+    return false;
+  }
+  if (series.type !== "scatter" || series.symbolSize === 0 || series.symbol === "none") {
+    return false;
+  }
+  var label = series.label;
+  return !(typeof label === "object" && label !== null && label.show === true);
+}
+function reportMillimeterRoot(svg, size) {
+  if (size.widthMm === undefined || size.heightMm === undefined) {
+    return svg;
+  }
+  return svg.replace('<svg width="' + size.widthPx + '" height="' + size.heightPx + '"', '<svg width="' + size.widthMm + 'mm" height="' + size.heightMm + 'mm"');
+}
+function reportLayerNumber(value) {
+  return Math.round(value * ${LAYER_DECIMALS}) / ${LAYER_DECIMALS};
+}
+function reportAttributeText(value) {
+  return value.replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/</g, "&lt;");
+}
+function reportComposeHybridSvg(svg, layer, size) {
+  var root = ${String(ROOT_TAG)}.exec(svg);
+  if (root === null) {
+    return svg;
+  }
+  var at = root[0].length;
+  var background = ${String(BACKGROUND_RECT)}.exec(svg.slice(at));
+  if (background !== null) {
+    at += background[0].length;
+  }
+  var image =
+    '\\n<image href="' + reportAttributeText(layer.href) + '" x="' + reportLayerNumber(layer.x) + '" y="' + reportLayerNumber(layer.y) + '" ' +
+    'width="' + reportLayerNumber(layer.width) + '" height="' + reportLayerNumber(layer.height) + '" preserveAspectRatio="none"></image>';
+  return reportMillimeterRoot(svg.slice(0, at) + image + svg.slice(at), size);
+}
+function reportList(member) {
+  if (member === undefined || member === null) {
+    return [];
+  }
+  return Array.isArray(member) ? member : [member];
+}
+function reportItemValue(item) {
+  return typeof item === "object" && item !== null && !Array.isArray(item) ? item.value : item;
+}
+function reportLabeledItem(item) {
+  return typeof item === "object" && item !== null && !Array.isArray(item) && item.label !== undefined;
+}
+function reportExtentAnchors(data) {
+  var least = [];
+  var most = [];
+  for (var i = 0; i < data.length; i++) {
+    var value = reportItemValue(data[i]);
+    if (!Array.isArray(value)) {
+      continue;
+    }
+    for (var d = 0; d < value.length; d++) {
+      var cell = value[d];
+      var number = typeof cell === "number" ? cell : typeof cell === "string" && cell.trim() !== "" ? Number(cell) : NaN;
+      if (!isFinite(number)) {
+        if (least[d] === undefined) {
+          least[d] = cell;
+          most[d] = cell;
+        }
+        continue;
+      }
+      if (least[d] === undefined || typeof least[d] !== "number" || number < least[d]) {
+        least[d] = number;
+      }
+      if (most[d] === undefined || typeof most[d] !== "number" || number > most[d]) {
+        most[d] = number;
+      }
+    }
+  }
+  if (least.length === 0) {
+    return [];
+  }
+  return [
+    { value: least, symbol: "none", label: { show: false } },
+    { value: most, symbol: "none", label: { show: false } }
+  ];
+}
+function reportHybridVectorOption(option) {
+  var out = Object.assign({}, option);
+  var series = reportList(option.series);
+  var drawn = [];
+  for (var s = 0; s < series.length; s++) {
+    if (!reportIsPointLayer(series[s])) {
+      drawn.push(series[s]);
+      continue;
+    }
+    var data = Array.isArray(series[s].data) ? series[s].data : [];
+    var kept = [];
+    for (var i = 0; i < data.length; i++) {
+      if (reportLabeledItem(data[i])) {
+        kept.push(data[i]);
+      }
+    }
+    drawn.push(Object.assign({}, series[s], { large: false, data: kept.concat(reportExtentAnchors(data)) }));
+  }
+  out.series = drawn;
+  return out;
+}
+function reportSeriesGrid(option, series) {
+  var axes = reportList(option.xAxis);
+  var axis = axes[typeof series.xAxisIndex === "number" ? series.xAxisIndex : 0];
+  return axis && typeof axis.gridIndex === "number" ? axis.gridIndex : 0;
+}
+function reportContinuousAxis(axis, kind) {
+  var type = axis.type === undefined ? (kind === "xAxis" ? "category" : "value") : axis.type;
+  return type === "value" || type === "log" || type === "time";
+}
+function reportGridBox(chart, gridIndex, seed, width, height) {
+  var finder = { gridIndex: gridIndex };
+  if (!chart.containPixel(finder, seed)) {
+    return null;
+  }
+  function edge(inside, outside, point) {
+    for (var step = 0; step < ${EDGE_SEARCH_STEPS}; step++) {
+      var middle = (inside + outside) / 2;
+      if (chart.containPixel(finder, point(middle))) {
+        inside = middle;
+      } else {
+        outside = middle;
+      }
+    }
+    return inside;
+  }
+  function alongX(x) {
+    return [x, seed[1]];
+  }
+  function alongY(y) {
+    return [seed[0], y];
+  }
+  var left = edge(seed[0], -1, alongX);
+  var right = edge(seed[0], width + 1, alongX);
+  var top = edge(seed[1], -1, alongY);
+  var bottom = edge(seed[1], height + 1, alongY);
+  return { x: left, y: top, width: right - left, height: bottom - top };
+}
+function reportSeed(chart, option, series, index, width, height) {
+  var data = Array.isArray(series.data) ? series.data : [];
+  if (data.length === 0) {
+    return null;
+  }
+  var first = null;
+  for (var i = 0; i < data.length && first === null; i++) {
+    var value = reportItemValue(data[i]);
+    first = Array.isArray(value) ? value : null;
+  }
+  if (first !== null) {
+    // A continuous axis covers the extent of its data, and a category axis draws each category inside the grid.
+    // Thus the middle of the extent of a continuous dimension, and the category of the first row of a category
+    // dimension, give a point inside the grid of the layer.
+    var anchors = reportExtentAnchors(data);
+    var axes = [reportList(option.xAxis)[typeof series.xAxisIndex === "number" ? series.xAxisIndex : 0], reportList(option.yAxis)[typeof series.yAxisIndex === "number" ? series.yAxisIndex : 0]];
+    var kinds = ["xAxis", "yAxis"];
+    var place = [];
+    for (var d = 0; d < 2; d++) {
+      var least = anchors[0].value[d];
+      var most = anchors[1].value[d];
+      var continuous = axes[d] !== undefined && reportContinuousAxis(axes[d], kinds[d]);
+      place.push(continuous && typeof least === "number" && typeof most === "number" ? (least + most) / 2 : first[d]);
+    }
+    var point = chart.convertToPixel({ seriesIndex: index }, place);
+    if (Array.isArray(point) && isFinite(point[0]) && isFinite(point[1])) {
+      return point;
+    }
+  }
+  return [width / 2, height / 2];
+}
+function reportLargestSize(size) {
+  if (typeof size === "number") {
+    return size;
+  }
+  if (!Array.isArray(size)) {
+    return null;
+  }
+  var largest = 0;
+  for (var i = 0; i < size.length; i++) {
+    largest = Math.max(largest, Number(size[i]) || 0);
+  }
+  return largest;
+}
+function reportMapAppliesTo(map, index) {
+  var named = map.seriesIndex;
+  if (named === undefined || named === null) {
+    return true;
+  }
+  return Array.isArray(named) ? named.indexOf(index) >= 0 : named === index;
+}
+function reportSymbolReach(option, series, index) {
+  var own = reportLargestSize(series.symbolSize);
+  var largest = own === null ? ${RUNTIME_SYMBOL_PX} : own;
+  var maps = reportList(option.visualMap);
+  for (var m = 0; m < maps.length; m++) {
+    if (typeof maps[m] !== "object" || maps[m] === null || !reportMapAppliesTo(maps[m], index)) {
+      continue;
+    }
+    var visuals = [maps[m].inRange, maps[m].outOfRange].concat(reportList(maps[m].pieces));
+    for (var v = 0; v < visuals.length; v++) {
+      var mapped = typeof visuals[v] === "object" && visuals[v] !== null ? reportLargestSize(visuals[v].symbolSize) : null;
+      if (mapped !== null) {
+        largest = Math.max(largest, mapped);
+      }
+    }
+  }
+  return largest / 2;
+}
+function reportPointLayerBox(chart, option, width, height) {
+  var series = reportList(option.series);
+  var boxes = {};
+  var found = false;
+  var reach = 0;
+  for (var s = 0; s < series.length; s++) {
+    if (!reportIsPointLayer(series[s])) {
+      continue;
+    }
+    reach = Math.max(reach, Math.ceil(reportSymbolReach(option, series[s], s)));
+    var grid = reportSeriesGrid(option, series[s]);
+    if (boxes[grid] !== undefined) {
+      continue;
+    }
+    // A layer with no row gives no place inside its grid. A facet panel can hold no row of one category, thus
+    // the grid takes its seed from the next layer that holds rows, and a grid of empty layers draws no point.
+    var seed = reportSeed(chart, option, series[s], s, width, height);
+    if (seed === null) {
+      continue;
+    }
+    var box = reportGridBox(chart, grid, seed, width, height);
+    if (box === null) {
+      return null;
+    }
+    boxes[grid] = box;
+    found = true;
+  }
+  if (!found) {
+    return null;
+  }
+  var union = null;
+  for (var key in boxes) {
+    var b = boxes[key];
+    if (union === null) {
+      union = { x: b.x, y: b.y, right: b.x + b.width, bottom: b.y + b.height };
+    } else {
+      union = { x: Math.min(union.x, b.x), y: Math.min(union.y, b.y), right: Math.max(union.right, b.x + b.width), bottom: Math.max(union.bottom, b.y + b.height) };
+    }
+  }
+  var extents = { xAxis: [], yAxis: [] };
+  var kinds = ["xAxis", "yAxis"];
+  for (var k = 0; k < kinds.length; k++) {
+    var axes = reportList(option[kinds[k]]);
+    for (var a = 0; a < axes.length; a++) {
+      var place = boxes[typeof axes[a].gridIndex === "number" ? axes[a].gridIndex : 0];
+      if (place === undefined || !reportContinuousAxis(axes[a], kinds[k])) {
+        continue;
+      }
+      var finder = {};
+      finder[kinds[k] + "Index"] = a;
+      var ends = kinds[k] === "xAxis" ? [place.x, place.x + place.width] : [place.y + place.height, place.y];
+      var first = chart.convertFromPixel(finder, ends[0]);
+      var last = chart.convertFromPixel(finder, ends[1]);
+      extents[kinds[k]][a] = { min: Math.min(first, last), max: Math.max(first, last) };
+    }
+  }
+  var left = Math.max(0, union.x - reach);
+  var top = Math.max(0, union.y - reach);
+  var right = Math.min(width, union.right + reach);
+  var bottom = Math.min(height, union.bottom + reach);
+  return { boxes: boxes, extents: extents, box: { x: left, y: top, width: right - left, height: bottom - top } };
+}
+function reportUnlabeledItem(item) {
+  if (!reportLabeledItem(item)) {
+    return item;
+  }
+  var copy = Object.assign({}, item);
+  delete copy.label;
+  return copy;
+}
+function reportHidden(member) {
+  if (Array.isArray(member)) {
+    var list = [];
+    for (var i = 0; i < member.length; i++) {
+      list.push(Object.assign({}, member[i], { show: false }));
+    }
+    return list;
+  }
+  return Object.assign({}, member, { show: false });
+}
+function reportHybridRasterOption(option, layer) {
+  var out = Object.assign({}, option);
+  delete out.graphic;
+  delete out.title;
+  if (out.legend !== undefined) {
+    out.legend = reportHidden(out.legend);
+  }
+  if (out.visualMap !== undefined) {
+    out.visualMap = reportHidden(out.visualMap);
+  }
+  var series = reportList(option.series);
+  var drawn = [];
+  for (var s = 0; s < series.length; s++) {
+    var copy = Object.assign({}, series[s], { label: { show: false }, progressive: 0 });
+    delete copy.markLine;
+    delete copy.markArea;
+    delete copy.markPoint;
+    if (reportIsPointLayer(series[s])) {
+      var data = Array.isArray(series[s].data) ? series[s].data : [];
+      var points = [];
+      for (var i = 0; i < data.length; i++) {
+        points.push(reportUnlabeledItem(data[i]));
+      }
+      copy.data = points;
+    } else {
+      copy.data = [];
+    }
+    drawn.push(copy);
+  }
+  out.series = drawn;
+  var grids = reportList(option.grid);
+  var placed = [];
+  var count = grids.length > 0 ? grids.length : 1;
+  for (var g = 0; g < count; g++) {
+    var grid = Object.assign({}, grids[g] || {});
+    var box = layer.boxes[g];
+    if (box !== undefined) {
+      delete grid.right;
+      delete grid.bottom;
+      grid.left = box.x;
+      grid.top = box.y;
+      grid.width = box.width;
+      grid.height = box.height;
+      grid.containLabel = false;
+      grid.outerBoundsMode = "none";
+    }
+    placed.push(grid);
+  }
+  out.grid = placed;
+  var kinds = ["xAxis", "yAxis"];
+  for (var k = 0; k < kinds.length; k++) {
+    if (option[kinds[k]] === undefined) {
+      continue;
+    }
+    var axes = reportList(option[kinds[k]]);
+    var pinned = [];
+    for (var a = 0; a < axes.length; a++) {
+      var axis = Object.assign({}, axes[a], { show: false });
+      var extent = layer.extents[kinds[k]][a];
+      if (extent !== undefined) {
+        axis.min = extent.min;
+        axis.max = extent.max;
+      }
+      pinned.push(axis);
+    }
+    out[kinds[k]] = Array.isArray(option[kinds[k]]) ? pinned : pinned[0];
+  }
+  return out;
+}
+function reportCroppedLayer(chart, box, ratio) {
+  var full = chart.renderToCanvas({ pixelRatio: ratio });
+  var crop = document.createElement("canvas");
+  crop.width = Math.max(1, Math.round(box.width * ratio));
+  crop.height = Math.max(1, Math.round(box.height * ratio));
+  crop.getContext("2d").drawImage(full, box.x * ratio, box.y * ratio, box.width * ratio, box.height * ratio, 0, 0, crop.width, crop.height);
+  return crop.toDataURL("image/png");
+}
+function reportHybridSvg(runtime, option, size) {
+  var exported = reportExportOption(option, size.textPx, size.width, size.height);
+  if (!reportList(exported.series).some(reportIsPointLayer)) {
+    return null;
+  }
+  var vector = runtime.init(null, size.theme, { renderer: "svg", ssr: true, width: size.width, height: size.height });
+  var svg;
+  var layer;
+  try {
+    vector.setOption(reportHybridVectorOption(exported));
+    layer = reportPointLayerBox(vector, exported, size.width, size.height);
+    svg = vector.renderToSVGString();
+  } finally {
+    vector.dispose();
+  }
+  if (layer === null) {
+    return null;
+  }
+  var raster = runtime.init(document.createElement("div"), size.theme, { renderer: "canvas", width: size.width, height: size.height, devicePixelRatio: size.pixelRatio });
+  var href;
+  try {
+    raster.setOption(reportHybridRasterOption(exported, layer));
+    href = reportCroppedLayer(raster, layer.box, size.pixelRatio);
+  } finally {
+    raster.dispose();
+  }
+  return reportComposeHybridSvg(
+    svg,
+    { href: href, x: layer.box.x, y: layer.box.y, width: layer.box.width, height: layer.box.height },
+    { widthPx: size.width, heightPx: size.height, widthMm: size.widthMm, heightMm: size.heightMm }
+  );
+}`;

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

@@ -115,3 +115,22 @@ export declare function smallestPositiveValue(cells: readonly (string | number |
  * A text that carries no exponent, and a text that holds no finite number, both give false.
  */
 export declare function holdsADriftedExponent(text: string): boolean;
+/**
+ * The text of a figure with each scientific form as a power of ten, for example `1.3 × 10⁻³` from `1.3e-3`.
+ *
+ * A publication figure prints the power of ten, and a table cell and a metric card keep the short form that
+ * `formatNumberCell` gives. Thus the chart canvas and the export read this, and the page text does not. The
+ * rewrite reads the shown text, thus each kind and each bound keeps its digits, and a text with no exponent
+ * stays as it is.
+ */
+export declare function typographicExponent(text: string): string;
+/**
+ * One shown form with the sign of its value as the typographic minus.
+ *
+ * The substitution reads the leading character alone. Thus the exponent of a form such as `-1.2e-4` keeps
+ * its own hyphen, and a reader of that exponent reads the notation that the module prints.
+ *
+ * The shown form then no longer parses back to the value, thus the caller carries the raw cell in the full
+ * form. A negative always names its stored digits beside the glyph.
+ */
+export declare function shownMinus(text: string): string;

package/dist/report-render/number-format.js

@@ -321,6 +321,30 @@ export function holdsADriftedExponent(text) {
     const shown = EXPONENT_PART.exec(formatNumberCell(value, "scientific").text);
     return shown !== null && shown[1] !== written[1];
 }
+/**
+ * One scientific form inside a text: a coefficient with its sign, and an exponent. The coefficient stands
+ * alone, thus a name such as `rs1e5` holds no scientific form.
+ */
+const SCIENTIFIC_IN_TEXT = /(?<![\w.])([−-]?\d+(?:\.\d+)?)e([+-]?\d+)(?![\w.])/g;
+/** The superscript form of each decimal digit, in digit order. */
+const SUPERSCRIPT_DIGITS = ["⁰", "¹", "²", "³", "⁴", "⁵", "⁶", "⁷", "⁸", "⁹"];
+/** The superscript minus of a negative exponent. */
+const SUPERSCRIPT_MINUS = "⁻";
+/**
+ * The text of a figure with each scientific form as a power of ten, for example `1.3 × 10⁻³` from `1.3e-3`.
+ *
+ * A publication figure prints the power of ten, and a table cell and a metric card keep the short form that
+ * `formatNumberCell` gives. Thus the chart canvas and the export read this, and the page text does not. The
+ * rewrite reads the shown text, thus each kind and each bound keeps its digits, and a text with no exponent
+ * stays as it is.
+ */
+export function typographicExponent(text) {
+    return text.replace(SCIENTIFIC_IN_TEXT, (_form, coefficient, exponent) => {
+        const power = Number(exponent);
+        const digits = [...String(Math.abs(power))].map((digit) => SUPERSCRIPT_DIGITS[Number(digit)]).join("");
+        return `${shownMinus(coefficient)} × 10${power < 0 ? SUPERSCRIPT_MINUS : ""}${digits}`;
+    });
+}
 /**
  * The bound of a stored zero, as one significant digit that rounds up, for example `4e-4` from `0.00036`.
  *
@@ -394,7 +418,7 @@ function formatValue(value, kind) {
  * The shown form then no longer parses back to the value, thus the caller carries the raw cell in the full
  * form. A negative always names its stored digits beside the glyph.
  */
-function shownMinus(text) {
+export function shownMinus(text) {
     return text.startsWith("-") ? TYPOGRAPHIC_MINUS + text.slice(1) : text;
 }
 /** The scientific form, for example `4.3e-5`. */

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

@@ -53,24 +53,61 @@ export declare const PAGE_READY_TIMEOUT_MS = 8000;
  *
  * 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.
  */
 export declare const CHART_SERIES_BUILDER: string;
+/**
+ * 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 declare const CHART_OPTIONS_GLOBAL = "__REPORT_CHART_OPTIONS";
 /**
  * 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