@pixerate/editor 0.180.0 → 0.181.0

package/dist/chart/index.d.cts

@@ -12,6 +12,7 @@ export * from './stats.cjs';
 export * from './trend.cjs';
 export * from './errorbars.cjs';
 export * from './layout.cjs';
+export * from './layout-streamgraph.cjs';
 export { MAX_CHART_DATA_LABELS, MAX_CHART_LINE_POINTS, MAX_CHART_MARKERS } from './layout-cartesian.cjs';
 export * from './svg.cjs';
 export * from './raster.cjs';

package/dist/chart/index.d.ts

@@ -12,6 +12,7 @@ export * from './stats.js';
 export * from './trend.js';
 export * from './errorbars.js';
 export * from './layout.js';
+export * from './layout-streamgraph.js';
 export { MAX_CHART_DATA_LABELS, MAX_CHART_LINE_POINTS, MAX_CHART_MARKERS } from './layout-cartesian.js';
 export * from './svg.js';
 export * from './raster.js';

package/dist/chart/index.js

@@ -17,7 +17,7 @@ import {
   TRENDLINE_PROPS,
   VALUE,
   WIDTH
-} from "../chunk-34UCPHYO.js";
+} from "../chunk-GOBOCZZI.js";
 import {
   CHART_OOXML_CONTENT_TYPE,
   CHART_OOXML_NS,
@@ -25,7 +25,7 @@ import {
   chartFormatToCode,
   chartFromOoxml,
   chartToOoxml
-} from "../chunk-OLCHKGGO.js";
+} from "../chunk-L6Y7TSQ4.js";
 import {
   CHART_COLOR_SCHEMES,
   CHART_LAYOUT_PRESETS,
@@ -47,7 +47,7 @@ import {
   monochromeChartPalette,
   sparklineToSvg,
   summarizeChart
-} from "../chunk-KPWG3PSW.js";
+} from "../chunk-23E5GI2U.js";
 import "../chunk-KGRZMHZB.js";
 import {
   CHART_DATE_STEPS,
@@ -85,6 +85,7 @@ import {
   formatChartValueWithCode,
   getChartMap,
   layoutChart,
+  layoutStreamgraph,
   linearMap,
   listChartMaps,
   matchChartMapRegions,
@@ -99,7 +100,7 @@ import {
   suggestChartReferences,
   summarizeChartSeries,
   trendNumberText
-} from "../chunk-OJQVKJYD.js";
+} from "../chunk-WKMUBATU.js";
 import {
   CHART_AXIS_KINDS,
   CHART_AXIS_SCALES,
@@ -193,7 +194,7 @@ import {
   shadeChartColor,
   simulateChartVision,
   uniqueChartSeriesId
-} from "../chunk-ORZF4JOO.js";
+} from "../chunk-6ZZKRH7R.js";
 import "../chunk-O6OGNDND.js";
 import "../chunk-II2WIF5Z.js";
 import {
@@ -407,7 +408,10 @@ function recommendForShape(shape) {
     add("line", "Line", "The categories are dates: a line shows change over time.");
     add("area", "Area", "Shows change over time with volume.");
     add("bar", "Column", "Compares each period.");
-    if (shape.series > 1) add("area", "Stacked area", "Shows how the parts add up over time.", "stacked");
+    if (shape.series > 1) {
+      add("area", "Stacked area", "Shows how the parts add up over time.", "stacked");
+      add("streamgraph", "Streamgraph", "Shows changing proportions and overall volume as an organic stream.");
+    }
     if (shape.series >= 5 && shape.points >= 3) add("barrace", "Bar race", "Many series over time: an animated ranking shows who leads when.");
     return out;
   }
@@ -1338,7 +1342,7 @@ function chartHitTest(scene, point, measure = (t, s, w = 400) => t.length * s *
 }
 
 // src/chart/tooltip.ts
-var VALUE_FAMILIES = /* @__PURE__ */ new Set(["cartesian", "xy", "pie", "radar", "waterfall", "funnel", "parliament", "slope"]);
+var VALUE_FAMILIES = /* @__PURE__ */ new Set(["cartesian", "xy", "pie", "radar", "waterfall", "funnel", "parliament", "slope", "streamgraph"]);
 var SLICE_FAMILIES = /* @__PURE__ */ new Set(["pie", "funnel", "parliament"]);
 function valueFormat(spec, series) {
   return series.format ?? (series.axis === "secondary" ? spec.yAxis2.format : spec.yAxis.format);
@@ -3446,6 +3450,7 @@ export {
   isXyChart,
   layoutChart,
   layoutSparkline,
+  layoutStreamgraph,
   linearMap,
   listChartMaps,
   locateChartPoint,

package/dist/chart/layout-streamgraph.d.cts

@@ -0,0 +1,15 @@
+import { type FamilyResult, type LayoutCtx } from './layout-shared.cjs';
+import type { ChartRect, ChartSeries } from './types.cjs';
+/**
+ * Lays out a streamgraph: series stacked symmetrically around a center baseline (silhouette offset).
+ *
+ * For each category index i:
+ *   total(i) = sum_{s} v_s(i)  (where v_s(i) >= 0)
+ *   y0(i) = -0.5 * total(i)
+ *
+ * Layers stack upwards from y0:
+ *   layer_s: from y_bottom = y0 + prefix_sum to y_top = y_bottom + v_s(i)
+ *
+ * The value domain is symmetric: [-maxHalf, maxHalf].
+ */
+export declare function layoutStreamgraph(ctx: LayoutCtx, area: ChartRect, visible: ChartSeries[]): FamilyResult;

package/dist/chart/layout-streamgraph.d.ts

@@ -0,0 +1,15 @@
+import { type FamilyResult, type LayoutCtx } from './layout-shared.js';
+import type { ChartRect, ChartSeries } from './types.js';
+/**
+ * Lays out a streamgraph: series stacked symmetrically around a center baseline (silhouette offset).
+ *
+ * For each category index i:
+ *   total(i) = sum_{s} v_s(i)  (where v_s(i) >= 0)
+ *   y0(i) = -0.5 * total(i)
+ *
+ * Layers stack upwards from y0:
+ *   layer_s: from y_bottom = y0 + prefix_sum to y_top = y_bottom + v_s(i)
+ *
+ * The value domain is symmetric: [-maxHalf, maxHalf].
+ */
+export declare function layoutStreamgraph(ctx: LayoutCtx, area: ChartRect, visible: ChartSeries[]): FamilyResult;

package/dist/chart/spec.d.cts

@@ -19,7 +19,7 @@ export declare const CHART_NUMBER_STYLES: readonly NonNullable<ChartNumberFormat
 /** Labels for pickers, shared by the React and Svelte components. */
 export declare const CHART_TYPE_LABELS: Readonly<Record<ChartType, string>>;
 /** How a chart type is laid out. */
-export type ChartFamily = 'cartesian' | 'xy' | 'pie' | 'radar' | 'waterfall' | 'histogram' | 'box' | 'funnel' | 'treemap' | 'slope' | 'likert' | 'parliament' | 'sunburst' | 'sankey' | 'barrace' | 'choropleth';
+export type ChartFamily = 'cartesian' | 'xy' | 'pie' | 'radar' | 'waterfall' | 'histogram' | 'box' | 'funnel' | 'treemap' | 'slope' | 'likert' | 'parliament' | 'sunburst' | 'sankey' | 'streamgraph' | 'barrace' | 'choropleth';
 /** A colour-blind-friendly categorical palette (Okabe–Ito order, tuned for light and dark backgrounds). */
 export declare const DEFAULT_CHART_PALETTE: readonly string[];
 export declare const DEFAULT_CHART_THEME: ChartTheme;

package/dist/chart/spec.d.ts

@@ -19,7 +19,7 @@ export declare const CHART_NUMBER_STYLES: readonly NonNullable<ChartNumberFormat
 /** Labels for pickers, shared by the React and Svelte components. */
 export declare const CHART_TYPE_LABELS: Readonly<Record<ChartType, string>>;
 /** How a chart type is laid out. */
-export type ChartFamily = 'cartesian' | 'xy' | 'pie' | 'radar' | 'waterfall' | 'histogram' | 'box' | 'funnel' | 'treemap' | 'slope' | 'likert' | 'parliament' | 'sunburst' | 'sankey' | 'barrace' | 'choropleth';
+export type ChartFamily = 'cartesian' | 'xy' | 'pie' | 'radar' | 'waterfall' | 'histogram' | 'box' | 'funnel' | 'treemap' | 'slope' | 'likert' | 'parliament' | 'sunburst' | 'sankey' | 'streamgraph' | 'barrace' | 'choropleth';
 /** A colour-blind-friendly categorical palette (Okabe–Ito order, tuned for light and dark backgrounds). */
 export declare const DEFAULT_CHART_PALETTE: readonly string[];
 export declare const DEFAULT_CHART_THEME: ChartTheme;

package/dist/chart/types.d.cts

@@ -17,12 +17,13 @@
  * - `sunburst` draws `tree` as rings from the centre out (or, without a tree, the first series
  *   as one ring); a `treemap` with a `tree` nests each group's rectangles inside it.
  * - `sankey` draws `links` as flows between columns of nodes.
+ * - `streamgraph` stacks areas symmetrically around a center baseline (silhouette offset).
  * - `barrace` reads each category as a time point and each series as a name, and draws the
  *   top `raceTopN` names at one moment as ranked horizontal bars (an animated ranking).
  * - `choropleth` shades the regions of a registered map (`map`) by the first series, each
  *   category naming a region by id (ISO alpha-3 for countries) or name.
  */
-export type ChartType = 'bar' | 'line' | 'area' | 'scatter' | 'bubble' | 'pie' | 'donut' | 'radar' | 'waterfall' | 'histogram' | 'box' | 'funnel' | 'treemap' | 'slope' | 'likert' | 'parliament' | 'sunburst' | 'sankey' | 'barrace' | 'choropleth';
+export type ChartType = 'bar' | 'line' | 'area' | 'scatter' | 'bubble' | 'pie' | 'donut' | 'radar' | 'waterfall' | 'histogram' | 'box' | 'funnel' | 'treemap' | 'slope' | 'likert' | 'parliament' | 'sunburst' | 'sankey' | 'streamgraph' | 'barrace' | 'choropleth';
 /** How a series is drawn in a cartesian chart. */
 export type ChartSeriesType = 'bar' | 'line' | 'area' | 'scatter';
 /** One data value; `null` is a gap (missing value). */

package/dist/chart/types.d.ts

@@ -17,12 +17,13 @@
  * - `sunburst` draws `tree` as rings from the centre out (or, without a tree, the first series
  *   as one ring); a `treemap` with a `tree` nests each group's rectangles inside it.
  * - `sankey` draws `links` as flows between columns of nodes.
+ * - `streamgraph` stacks areas symmetrically around a center baseline (silhouette offset).
  * - `barrace` reads each category as a time point and each series as a name, and draws the
  *   top `raceTopN` names at one moment as ranked horizontal bars (an animated ranking).
  * - `choropleth` shades the regions of a registered map (`map`) by the first series, each
  *   category naming a region by id (ISO alpha-3 for countries) or name.
  */
-export type ChartType = 'bar' | 'line' | 'area' | 'scatter' | 'bubble' | 'pie' | 'donut' | 'radar' | 'waterfall' | 'histogram' | 'box' | 'funnel' | 'treemap' | 'slope' | 'likert' | 'parliament' | 'sunburst' | 'sankey' | 'barrace' | 'choropleth';
+export type ChartType = 'bar' | 'line' | 'area' | 'scatter' | 'bubble' | 'pie' | 'donut' | 'radar' | 'waterfall' | 'histogram' | 'box' | 'funnel' | 'treemap' | 'slope' | 'likert' | 'parliament' | 'sunburst' | 'sankey' | 'streamgraph' | 'barrace' | 'choropleth';
 /** How a series is drawn in a cartesian chart. */
 export type ChartSeriesType = 'bar' | 'line' | 'area' | 'scatter';
 /** One data value; `null` is a gap (missing value). */

package/dist/{chunk-KPWG3PSW.js → chunk-23E5GI2U.js}

@@ -14,7 +14,7 @@ import {
   r2,
   sameChartSelection,
   summarizeChartSeries
-} from "./chunk-OJQVKJYD.js";
+} from "./chunk-WKMUBATU.js";
 import {
   CHART_TYPE_LABELS,
   DEFAULT_CHART_PALETTE,
@@ -47,7 +47,7 @@ import {
   parseChartValue,
   shadeChartColor,
   uniqueChartSeriesId
-} from "./chunk-ORZF4JOO.js";
+} from "./chunk-6ZZKRH7R.js";
 import {
   parseCsv,
   parseTsv
@@ -607,6 +607,12 @@ function describeChart(spec, series = spec.series.filter((s) => !s.hidden).map((
     const pct = (v) => `${Math.round(v * 100)}%`;
     return `${head} of ${spec.categories.length} questions with ${answers.length} answers from ${answers[0]?.name} to ${answers[answers.length - 1]?.name}. Most positive: ${best[0]?.c} (${pct(best[0]?.share ?? 0)}); least: ${best[best.length - 1]?.c} (${pct(best[best.length - 1]?.share ?? 0)}).`;
   }
+  if (family === "streamgraph") {
+    const n = spec.categories.length;
+    const totals = spec.categories.map((_, i) => spec.series.filter((x) => !x.hidden).reduce((sum, s) => sum + Math.max(0, s.values[i] ?? 0), 0));
+    const maxTotal = Math.max(0, ...totals);
+    return `${head} of ${series.length} series over ${n} categories${n ? ` (${spec.categories[0]} to ${spec.categories[n - 1]})` : ""}, stacked symmetrically around a center baseline with a peak volume of ${fmt(maxTotal)}.`;
+  }
   if (family === "waterfall") {
     const s = spec.series.find((x) => !x.hidden);
     const steps = s.values.filter((v, i) => v !== null && Number.isFinite(v) && !/\b(sub)?total\b/i.test(spec.categories[i] ?? ""));

package/dist/{chunk-IMHRN4ZZ.js → chunk-3MO3ZS7E.js}

@@ -7,7 +7,7 @@ import {
 import {
   CHART_OOXML_NS,
   chartFromOoxml
-} from "./chunk-OLCHKGGO.js";
+} from "./chunk-L6Y7TSQ4.js";
 import {
   compareDocuments
 } from "./chunk-V5OOP74P.js";
@@ -34,10 +34,10 @@ import {
   searchDocument,
   sliceContainsTable,
   syncInitialContent
-} from "./chunk-R2VHVQVY.js";
+} from "./chunk-PI2UYMZY.js";
 import {
   chartDataToTable
-} from "./chunk-ORZF4JOO.js";
+} from "./chunk-6ZZKRH7R.js";
 import {
   PIXERATE_DOCUMENT_MIME,
   getClipboardData,