@motionscript/charts 0.1.1-alpha.0 → 0.1.1-alpha.1

package/dist/line-chart/chart-line.js.map

@@ -1 +1 @@
-{"version":3,"file":"chart-line.js","sourceRoot":"","sources":["../../src/line-chart/chart-line.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  Graphics2D,\n  Types,\n  component2d,\n  strokeOps,\n  type NodeOf,\n  // Named so this component's emitted type reaches `Node2D` and its props through the sdk, not core.\n  type Node2D as _Node2D,\n  type Node2DProps as _Node2DProps,\n  type Stroke,\n  type StrokeResolved,\n  type Vector2,\n} from \"@motionscript/sdk\"\n\nimport { fresh } from \"../kit/entries\"\nimport { frameEase } from \"../kit/motion\"\nimport { loadPaints } from \"../kit/paints\"\nimport { SPOTLIGHT_DIM } from \"../kit/shared\"\nimport {\n  EMPTY_REGION_BOX,\n  clipPolylineToBox,\n  hasRegion,\n  type RegionBox,\n} from \"./shared\"\n\n/** The prefix of `pts` revealed at fraction `p`, measured by cumulative arc length so the trace keeps a steady pace over uneven spacing. */\nfunction tracePoints(pts: Vector2[], p: number): Vector2[] {\n  if (p >= 1 || pts.length < 2) return pts\n  if (p <= 0) return []\n\n  const segLen: number[] = []\n  let total = 0\n  for (let i = 1; i < pts.length; i++) {\n    const d = Math.hypot(pts[i].x - pts[i - 1].x, pts[i].y - pts[i - 1].y)\n    segLen.push(d)\n    total += d\n  }\n  if (total === 0) return pts\n\n  let target = total * p\n  const out: Vector2[] = [pts[0]]\n  for (let i = 0; i < segLen.length; i++) {\n    if (target >= segLen[i]) {\n      out.push(pts[i + 1])\n      target -= segLen[i]\n    } else {\n      const t = segLen[i] === 0 ? 0 : target / segLen[i]\n      out.push({\n        x: pts[i].x + (pts[i + 1].x - pts[i].x) * t,\n        y: pts[i].y + (pts[i + 1].y - pts[i].y) * t,\n      })\n      break\n    }\n  }\n  return out\n}\n\n/** One series of a {@link LineChart}: a rounded polyline through pre-mapped pixel `points`, one {@link Graphics2D} command list. `progress` traces it in; `enabled` shows or hides it wholesale. */\nexport const ChartLine = component2d({\n  key: \"chartLine\",\n  state: {\n    /** In this node's pixel space (origin at centre, y-up), mapped by the parent and ordered along x. */\n    points: fresh<Vector2[]>(() => []),\n    stroke: Types.custom<Stroke, StrokeResolved[]>([], { resolve: strokeOps.resolve, lerp: strokeOps.lerp }),\n    /** Trace from the left end, `[0, 1]`. Rests at 1 so a paused editor canvas paints the line; `enter` drives it from 0. */\n    progress: 1,\n    /** Whether the line is drawn at all, flipped alongside its legend entry. */\n    enabled: true,\n    /** In this node's pixel space; outside it the line drops to `dimOpacity`. */\n    spotlight: fresh<RegionBox>(() => EMPTY_REGION_BOX),\n    dimOpacity: SPOTLIGHT_DIM,\n  },\n  load: (loader, state) => loadPaints(loader, { strokes: [state.stroke] }),\n  commands: {\n    /**\n     * Trace the line from `from` to `to`; `showSeries`/`hideSeries` are this with\n     * the ends stated. `enabled` rides along in the same value, so the line is\n     * drawable for every `t` the trace covers and arriving backwards matches\n     * arriving forwards.\n     */\n    enter: {\n      args: { from: Types.number(0, { min: 0, max: 1 }), to: Types.number(1, { min: 0, max: 1 }) },\n      run: (timeline) => {\n        const { from, to } = timeline.args\n        const ease = frameEase(timeline)\n        return timeline.animate((t) => {\n          const progress = from + (to - from) * ease(t)\n          // Hidden only once fully retraced, so a hide does not vanish a frame early.\n          return { progress, enabled: progress > 0 }\n        })\n      },\n    },\n  },\n  render: (ctx, state) => {\n    if (!state.enabled) return\n    const pts = state.points\n    if (pts.length < 2) return\n\n    const p = Math.max(0, Math.min(1, state.progress))\n    if (p <= 0) return\n\n    const drawn = tracePoints(pts, p)\n    if (drawn.length < 2) return\n    const stroke = state.stroke\n    const radius = (stroke[0]?.weight ?? 0) * 2\n\n    const box = state.spotlight\n    if (!hasRegion(box)) {\n      ctx.draw(new Graphics2D().line({ points: drawn, radius }).stroke(stroke))\n      return\n    }\n\n    // Dim the whole line, then redraw the stretches inside the region at full strength: the bright run keeps continuous geometry and round joins, and the boundary lands on the region edge.\n    ctx.draw(\n      new Graphics2D()\n        .line({ points: drawn, radius })\n        .stroke(stroke)\n        .opacity(Math.max(0, Math.min(1, state.dimOpacity)))\n    )\n\n    // One `draw` per run: shapes chained before `stroke()` combine into one surface, and stroking a union of disjoint open paths paints nothing.\n    for (const run of clipPolylineToBox(drawn, box)) {\n      ctx.draw(new Graphics2D().line({ points: run, radius }).stroke(stroke))\n    }\n  },\n})\n\nexport type ChartLine = NodeOf<typeof ChartLine>\n"]}
+{"version":3,"file":"chart-line.js","sourceRoot":"","sources":["../../src/line-chart/chart-line.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  Graphics2D,\n  Types,\n  clamp,\n  component2d,\n  fillOps,\n  strokeOps,\n  type Fill,\n  type FillResolved,\n  type NodeOf,\n  // Named so this component's emitted type reaches `Node2D` and its props through the sdk, not core.\n  type Node2D as _Node2D,\n  type Node2DProps as _Node2DProps,\n  type PathCommand,\n  type RenderContext,\n  type Stroke,\n  type StrokeResolved,\n  type Vector2,\n} from \"@motionscript/sdk\"\n\nimport { fade } from \"../kit/cartesian\"\nimport { fresh } from \"../kit/entries\"\nimport { frameEase } from \"../kit/motion\"\nimport { loadPaints } from \"../kit/paints\"\nimport { SPOTLIGHT_DIM } from \"../kit/shared\"\nimport {\n  EMPTY_REGION_BOX,\n  clipPolygonToBox,\n  clipPolylineToBox,\n  cutAt,\n  curvePoints,\n  hasRegion,\n  type LineCurve,\n  type RegionBox,\n} from \"./shared\"\n\n/** The x a trace at `progress` has reached, across `points` ordered along x. */\nexport function traceX(points: readonly Vector2[], progress: number): number {\n  if (points.length === 0) return 0\n  const first = points[0].x\n  const last = points[points.length - 1].x\n  return progress >= 1 ? Infinity : first + (last - first) * progress\n}\n\n/** The drawn path at `progress`: the whole curve once traced, else the part left of the trace. */\nfunction traced(points: readonly Vector2[], curve: LineCurve, progress: number): Vector2[] {\n  const path = curvePoints(points, curve)\n  return progress >= 1 ? path : cutAt(path, traceX(points, progress))\n}\n\nconst curveEntry = () => Types.custom<LineCurve>(\"smooth\")\n\n/** A closed outline as path commands. */\nfunction outlineCommands(points: readonly Vector2[]): PathCommand[] {\n  return [...points.map((p, i): PathCommand => ({ type: i === 0 ? \"M\" : \"L\", x: p.x, y: p.y })), { type: \"Z\" }]\n}\n\nfunction fillOutline(ctx: RenderContext, outline: readonly Vector2[], fill: FillResolved[], opacity: number): void {\n  if (outline.length < 3 || opacity <= 0) return\n  const { width, height } = ctx.size\n  // A frame symmetric about the origin, so the outline draws where its points say rather than re-centred on itself.\n  const centerBounds: [number, number, number, number] = [-width / 2, -height / 2, width / 2, height / 2]\n  ctx.draw(new Graphics2D().path({ data: outlineCommands(outline), centerBounds }).fill(fill).opacity(opacity))\n}\n\n/**\n * One series of a {@link LineChart}: its line through pre-mapped pixel `points`,\n * shaped by `curve`, and a dot on each point. `progress` traces it in from the\n * left; `enabled` shows or hides it wholesale.\n */\nexport const ChartLine = component2d({\n  key: \"chartLine\",\n  state: {\n    /** In this node's pixel space (origin at centre, y-up), mapped by the parent and ordered along x. */\n    points: fresh<Vector2[]>(() => []),\n    curve: curveEntry(),\n    stroke: Types.custom<Stroke, StrokeResolved[]>([], { resolve: strokeOps.resolve, lerp: strokeOps.lerp }),\n    /** A dot of `dotSize` on each point, in `dotFill`; none at size 0. */\n    dotSize: 0,\n    dotFill: Types.custom<Fill, FillResolved[]>([], { resolve: fillOps.resolve, lerp: fillOps.lerp }),\n    /** Trace from the left end, `[0, 1]`. Rests at 1 so a paused editor canvas paints the line; `enter` drives it from 0. */\n    progress: 1,\n    /** Whether the line is drawn at all, flipped alongside its legend entry. */\n    enabled: true,\n    /** In this node's pixel space; outside it the line drops to `dimOpacity`. */\n    spotlight: fresh<RegionBox>(() => EMPTY_REGION_BOX),\n    dimOpacity: SPOTLIGHT_DIM,\n  },\n  load: (loader, state) => loadPaints(loader, { fills: [state.dotFill], strokes: [state.stroke] }),\n  commands: {\n    /**\n     * Trace the line from `from` to `to`; `showSeries`/`hideSeries` are this with\n     * the ends stated. `enabled` rides along in the same value, so the line is\n     * drawable for every `t` the trace covers and arriving backwards matches\n     * arriving forwards.\n     */\n    enter: {\n      args: { from: Types.number(0, { min: 0, max: 1 }), to: Types.number(1, { min: 0, max: 1 }) },\n      run: (timeline) => {\n        const { from, to } = timeline.args\n        const ease = frameEase(timeline)\n        return timeline.animate((t) => {\n          const progress = from + (to - from) * ease(t)\n          // Hidden only once fully retraced, so a hide does not vanish a frame early.\n          return { progress, enabled: progress > 0 }\n        })\n      },\n    },\n    /** Hold the line fully traced while its chart moves it, switched on throughout a show and off once a hide lands. */\n    hold: {\n      args: { shown: Types.boolean(true) },\n      run: (timeline) => {\n        const { shown } = timeline.args\n        return timeline.animate((t) => ({ progress: 1, enabled: shown || t < 1 }), { eased: false })\n      },\n    },\n  },\n  render: (ctx, state) => {\n    if (!state.enabled) return\n    const pts = state.points\n    const p = clamp(state.progress, 0, 1)\n    if (pts.length === 0 || p <= 0) return\n\n    const box = state.spotlight\n    const lit = hasRegion(box)\n    const dim = clamp(state.dimOpacity, 0, 1)\n    const stroke = state.stroke\n    const weight = stroke[0]?.weight ?? 0\n    const drawn = traced(pts, state.curve, p)\n\n    if (drawn.length >= 2 && weight > 0) {\n      // Rounded corners only where the line has corners to round.\n      const radius = state.curve === \"linear\" ? weight * 2 : 0\n      ctx.draw(new Graphics2D().line({ points: drawn, radius }).stroke(stroke).opacity(lit ? dim : 1))\n      // One `draw` per run: shapes chained before `stroke()` combine into one surface, and stroking a union of disjoint open paths paints nothing.\n      if (lit) for (const run of clipPolylineToBox(drawn, box)) ctx.draw(new Graphics2D().line({ points: run, radius }).stroke(stroke))\n    }\n\n    const size = state.dotSize\n    if (size <= 0) return\n    const reach = traceX(pts, p)\n    const bright = new Graphics2D()\n    const dimmed = new Graphics2D()\n    let brightAny = false\n    let dimAny = false\n    for (const pt of pts) {\n      // A dot grows in as the trace passes it.\n      const grown = reach === Infinity ? 1 : clamp((reach - pt.x) / (size * 2), 0, 1)\n      if (grown <= 0) continue\n      const inside = !lit || (pt.x >= box.left && pt.x <= box.right && pt.y >= box.bottom && pt.y <= box.top)\n      ;(inside ? bright : dimmed).ellipse({ x: pt.x, y: pt.y, width: size * grown, height: size * grown })\n      if (inside) brightAny = true\n      else dimAny = true\n    }\n    if (dimAny) ctx.draw(dimmed.fill(state.dotFill).opacity(dim))\n    if (brightAny) ctx.draw(bright.fill(state.dotFill))\n  },\n})\n\nexport type ChartLine = NodeOf<typeof ChartLine>\n\n/**\n * The fill under one series of a {@link LineChart}: down to `base` (the series\n * below it in a stack) or, without one, to the `baseline`. Drawn by its own node\n * so every area sits under every line; the chart binds its trace, switch and\n * opacity to its line's, so the two move as one.\n */\nexport const ChartArea = component2d({\n  key: \"chartArea\",\n  state: {\n    /** The series' points, as its line has them. */\n    points: fresh<Vector2[]>(() => []),\n    /** The line the area fills down to, at the same x positions; empty for the baseline. */\n    base: fresh<Vector2[]>(() => []),\n    /** Pixel y of the baseline. */\n    baseline: 0,\n    curve: curveEntry(),\n    area: Types.custom<\"none\" | \"solid\" | \"gradient\">(\"solid\"),\n    /** The series colour; the area paints it at `areaOpacity`, a gradient fading it out towards the bottom. */\n    fill: Types.custom<Fill, FillResolved[]>([], { resolve: fillOps.resolve, lerp: fillOps.lerp }),\n    areaOpacity: 0.4,\n    progress: 1,\n    enabled: true,\n    spotlight: fresh<RegionBox>(() => EMPTY_REGION_BOX),\n    dimOpacity: SPOTLIGHT_DIM,\n  },\n  load: (loader, state) => loadPaints(loader, { fills: [state.fill] }),\n  render: (ctx, state) => {\n    const pts = state.points\n    const p = clamp(state.progress, 0, 1)\n    if (!state.enabled || state.area === \"none\" || pts.length < 2 || p <= 0 || state.fill.length === 0) return\n    const outlineAt = (progress: number) => {\n      const top = traced(pts, state.curve, progress)\n      if (top.length < 2) return []\n      const base = state.base.length === pts.length\n        ? traced(state.base, state.curve, progress)\n        : [{ x: top[0].x, y: state.baseline }, { x: top[top.length - 1].x, y: state.baseline }]\n      return [...top, ...[...base].reverse()]\n    }\n    // The gradient spans the whole area's height, so it holds still while the area traces in and across a spotlight's cut.\n    const span = verticalSpan(outlineAt(1))\n    const paint = (outline: readonly Vector2[], opacity: number) =>\n      fillOutline(ctx, outline, areaFill(state.fill, state.area, state.areaOpacity, span, verticalSpan(outline)), opacity)\n    const outline = outlineAt(p)\n    const box = state.spotlight\n    if (!hasRegion(box)) {\n      paint(outline, 1)\n      return\n    }\n    paint(outline, clamp(state.dimOpacity, 0, 1))\n    paint(clipPolygonToBox(outline, box), 1)\n  },\n})\n\ninterface Span {\n  readonly top: number\n  readonly bottom: number\n}\n\nfunction verticalSpan(points: readonly Vector2[]): Span {\n  let top = -Infinity\n  let bottom = Infinity\n  for (const p of points) {\n    if (p.y > top) top = p.y\n    if (p.y < bottom) bottom = p.y\n  }\n  return { top, bottom }\n}\n\n/**\n * The area's paint for an outline spanning `own`: the series colour at\n * `opacity`, or for a gradient that colour fading to nearly nothing across\n * `whole`. A gradient maps onto the bounds of the shape it fills, so its ends\n * are placed in `own`'s unit box (y-up) at `whole`'s top and bottom.\n */\nexport function areaFill(colour: FillResolved[], area: \"none\" | \"solid\" | \"gradient\", opacity: number, whole: Span, own: Span): FillResolved[] {\n  const top = colour[colour.length - 1]\n  if (area !== \"gradient\" || top?.type !== \"solid\" || !(own.top > own.bottom)) return fade(colour, opacity) as FillResolved[]\n  const [r, g, b, a] = top.color\n  const middle = (own.top + own.bottom) / 2\n  const half = (own.top - own.bottom) / 2\n  return fillOps.resolve({\n    type: \"linear-gradient\",\n    colors: [[r, g, b, a * opacity], [r, g, b, a * opacity * 0.04]],\n    start: { x: 0, y: (whole.top - middle) / half },\n    end: { x: 0, y: (whole.bottom - middle) / half },\n  })\n}\n\nexport type ChartArea = NodeOf<typeof ChartArea>\n"]}

package/dist/line-chart/chart-region.d.ts

@@ -3,7 +3,7 @@ import { type RegionBox } from "./shared.js";
 /**
  * The call-out of a {@link LineChart}: a washed rectangle with a dashed rule on
  * each bounded edge, drawn from the pre-mapped `box`. Dimming the series outside
- * is {@link ChartLine}'s job, clipped against the same box so the two agree on
+ * is the line's and area's job, clipped against the same box so they agree on
  * the boundary. An unbounded edge is the plot's own border, and a rule there
  * would assert a limit the author did not set.
  */

package/dist/line-chart/chart-region.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chart-region.d.ts","sourceRoot":"","sources":["../../src/line-chart/chart-region.ts"],"names":[],"mappings":"AAAA,OAAO,EAML,KAAK,IAAI,EACT,KAAK,YAAY,EACjB,KAAK,MAAM,EAEX,KAAK,MAAM,IAAI,OAAO,EACtB,KAAK,WAAW,IAAI,YAAY,EAChC,KAAK,MAAM,EACX,KAAK,cAAc,EACpB,MAAM,mBAAmB,CAAA;AAI1B,OAAO,EAIL,KAAK,SAAS,EACf,MAAM,UAAU,CAAA;AAEjB;;;;;;GAMG;AACH,eAAO,MAAM,WAAW;IAGpB,iHAAiH;;;;IAIjH,8FAA8F;;;IAJ9F,iHAAiH;;;;IAIjH,8FAA8F;;;IAJ9F,iHAAiH;;;;IAIjH,8FAA8F;;gCAmChG,CAAA;AAEF,MAAM,MAAM,WAAW,GAAG,MAAM,CAAC,OAAO,WAAW,CAAC,CAAA"}
+{"version":3,"file":"chart-region.d.ts","sourceRoot":"","sources":["../../src/line-chart/chart-region.ts"],"names":[],"mappings":"AAAA,OAAO,EAML,KAAK,IAAI,EACT,KAAK,YAAY,EACjB,KAAK,MAAM,EAEX,KAAK,MAAM,IAAI,OAAO,EACtB,KAAK,WAAW,IAAI,YAAY,EAChC,KAAK,MAAM,EACX,KAAK,cAAc,EACpB,MAAM,mBAAmB,CAAA;AAK1B,OAAO,EAGL,KAAK,SAAS,EACf,MAAM,UAAU,CAAA;AAEjB;;;;;;GAMG;AACH,eAAO,MAAM,WAAW;IAGpB,iHAAiH;;;;IAIjH,8FAA8F;;;IAJ9F,iHAAiH;;;;IAIjH,8FAA8F;;;IAJ9F,iHAAiH;;;;IAIjH,8FAA8F;;gCA+BhG,CAAA;AAEF,MAAM,MAAM,WAAW,GAAG,MAAM,CAAC,OAAO,WAAW,CAAC,CAAA"}

package/dist/line-chart/chart-region.js

@@ -1,11 +1,12 @@
 import { Graphics2D, Types, component2d, fillOps, strokeOps, } from "@motionscript/sdk";
+import { rule } from "../kit/chart-canvas.js";
 import { fresh } from "../kit/entries.js";
 import { loadPaints } from "../kit/paints.js";
-import { DEFAULT_CHART_THEME, EMPTY_REGION_BOX, hasRegion, } from "./shared.js";
+import { EMPTY_REGION_BOX, hasRegion, } from "./shared.js";
 /**
  * The call-out of a {@link LineChart}: a washed rectangle with a dashed rule on
  * each bounded edge, drawn from the pre-mapped `box`. Dimming the series outside
- * is {@link ChartLine}'s job, clipped against the same box so the two agree on
+ * is the line's and area's job, clipped against the same box so they agree on
  * the boundary. An unbounded edge is the plot's own border, and a rule there
  * would assert a limit the author did not set.
  */
@@ -14,8 +15,8 @@ export const ChartRegion = component2d({
     state: {
         /** In this node's pixel space (origin at centre, y-up), mapped by the parent. A degenerate box draws nothing. */
         box: fresh(() => EMPTY_REGION_BOX),
-        stroke: Types.custom(DEFAULT_CHART_THEME.region.stroke, { resolve: strokeOps.resolve, lerp: strokeOps.lerp }),
-        fill: Types.custom(DEFAULT_CHART_THEME.region.fill, { resolve: fillOps.resolve, lerp: fillOps.lerp }),
+        stroke: Types.custom({ weight: 2, fill: "white/70", dash: [14, 12], cap: "butt", align: "center" }, { resolve: strokeOps.resolve, lerp: strokeOps.lerp }),
+        fill: Types.custom("white/6", { resolve: fillOps.resolve, lerp: fillOps.lerp }),
         /** Driven by the chart's `regionReveal`, so the rules and the series' dimming move as one. */
         reveal: 0,
     },
@@ -36,17 +37,15 @@ export const ChartRegion = component2d({
         }
         if (state.stroke.length === 0)
             return;
-        // One `draw` per rule: stroking a union of disjoint open paths paints nothing.
-        const rule = (points) => ctx.draw(new Graphics2D().line({ points }).stroke(state.stroke).opacity(r));
         if (box.xBounded) {
             const half = (height / 2) * r;
             for (const x of [box.left, box.right])
-                rule([{ x, y: cy - half }, { x, y: cy + half }]);
+                rule(ctx, { x, y: cy - half }, { x, y: cy + half }, state.stroke, r);
         }
         if (box.yBounded) {
             const half = (width / 2) * r;
             for (const y of [box.bottom, box.top])
-                rule([{ x: cx - half, y }, { x: cx + half, y }]);
+                rule(ctx, { x: cx - half, y }, { x: cx + half, y }, state.stroke, r);
         }
     },
 });

package/dist/line-chart/chart-region.js.map

@@ -1 +1 @@
-{"version":3,"file":"chart-region.js","sourceRoot":"","sources":["../../src/line-chart/chart-region.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  Graphics2D,\n  Types,\n  component2d,\n  fillOps,\n  strokeOps,\n  type Fill,\n  type FillResolved,\n  type NodeOf,\n  // Named so this component's emitted type reaches `Node2D` and its props through the sdk, not core.\n  type Node2D as _Node2D,\n  type Node2DProps as _Node2DProps,\n  type Stroke,\n  type StrokeResolved,\n} from \"@motionscript/sdk\"\n\nimport { fresh } from \"../kit/entries\"\nimport { loadPaints } from \"../kit/paints\"\nimport {\n  DEFAULT_CHART_THEME,\n  EMPTY_REGION_BOX,\n  hasRegion,\n  type RegionBox,\n} from \"./shared\"\n\n/**\n * The call-out of a {@link LineChart}: a washed rectangle with a dashed rule on\n * each bounded edge, drawn from the pre-mapped `box`. Dimming the series outside\n * is {@link ChartLine}'s job, clipped against the same box so the two agree on\n * the boundary. An unbounded edge is the plot's own border, and a rule there\n * would assert a limit the author did not set.\n */\nexport const ChartRegion = component2d({\n  key: \"chartRegion\",\n  state: {\n    /** In this node's pixel space (origin at centre, y-up), mapped by the parent. A degenerate box draws nothing. */\n    box: fresh<RegionBox>(() => EMPTY_REGION_BOX),\n    stroke: Types.custom<Stroke, StrokeResolved[]>(DEFAULT_CHART_THEME.region.stroke, { resolve: strokeOps.resolve, lerp: strokeOps.lerp }),\n    fill: Types.custom<Fill, FillResolved[]>(DEFAULT_CHART_THEME.region.fill, { resolve: fillOps.resolve, lerp: fillOps.lerp }),\n    /** Driven by the chart's `regionReveal`, so the rules and the series' dimming move as one. */\n    reveal: 0,\n  },\n  load: (loader, state) => loadPaints(loader, { fills: [state.fill], strokes: [state.stroke] }),\n  render: (ctx, state) => {\n    const box = state.box\n    if (!hasRegion(box)) return\n\n    const r = Math.max(0, Math.min(1, state.reveal))\n    if (r <= 0) return\n\n    const width = box.right - box.left\n    const height = box.top - box.bottom\n    const cx = (box.left + box.right) / 2\n    const cy = (box.bottom + box.top) / 2\n\n    if (state.fill.length > 0) {\n      ctx.draw(new Graphics2D().rect({ x: cx, y: cy, width, height }).fill(state.fill).opacity(r))\n    }\n\n    if (state.stroke.length === 0) return\n\n    // One `draw` per rule: stroking a union of disjoint open paths paints nothing.\n    const rule = (points: { x: number; y: number }[]) =>\n      ctx.draw(new Graphics2D().line({ points }).stroke(state.stroke).opacity(r))\n\n    if (box.xBounded) {\n      const half = (height / 2) * r\n      for (const x of [box.left, box.right]) rule([{ x, y: cy - half }, { x, y: cy + half }])\n    }\n    if (box.yBounded) {\n      const half = (width / 2) * r\n      for (const y of [box.bottom, box.top]) rule([{ x: cx - half, y }, { x: cx + half, y }])\n    }\n  },\n})\n\nexport type ChartRegion = NodeOf<typeof ChartRegion>\n"]}
+{"version":3,"file":"chart-region.js","sourceRoot":"","sources":["../../src/line-chart/chart-region.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  Graphics2D,\n  Types,\n  component2d,\n  fillOps,\n  strokeOps,\n  type Fill,\n  type FillResolved,\n  type NodeOf,\n  // Named so this component's emitted type reaches `Node2D` and its props through the sdk, not core.\n  type Node2D as _Node2D,\n  type Node2DProps as _Node2DProps,\n  type Stroke,\n  type StrokeResolved,\n} from \"@motionscript/sdk\"\n\nimport { rule } from \"../kit/chart-canvas\"\nimport { fresh } from \"../kit/entries\"\nimport { loadPaints } from \"../kit/paints\"\nimport {\n  EMPTY_REGION_BOX,\n  hasRegion,\n  type RegionBox,\n} from \"./shared\"\n\n/**\n * The call-out of a {@link LineChart}: a washed rectangle with a dashed rule on\n * each bounded edge, drawn from the pre-mapped `box`. Dimming the series outside\n * is the line's and area's job, clipped against the same box so they agree on\n * the boundary. An unbounded edge is the plot's own border, and a rule there\n * would assert a limit the author did not set.\n */\nexport const ChartRegion = component2d({\n  key: \"chartRegion\",\n  state: {\n    /** In this node's pixel space (origin at centre, y-up), mapped by the parent. A degenerate box draws nothing. */\n    box: fresh<RegionBox>(() => EMPTY_REGION_BOX),\n    stroke: Types.custom<Stroke, StrokeResolved[]>({ weight: 2, fill: \"white/70\", dash: [14, 12], cap: \"butt\", align: \"center\" }, { resolve: strokeOps.resolve, lerp: strokeOps.lerp }),\n    fill: Types.custom<Fill, FillResolved[]>(\"white/6\", { resolve: fillOps.resolve, lerp: fillOps.lerp }),\n    /** Driven by the chart's `regionReveal`, so the rules and the series' dimming move as one. */\n    reveal: 0,\n  },\n  load: (loader, state) => loadPaints(loader, { fills: [state.fill], strokes: [state.stroke] }),\n  render: (ctx, state) => {\n    const box = state.box\n    if (!hasRegion(box)) return\n\n    const r = Math.max(0, Math.min(1, state.reveal))\n    if (r <= 0) return\n\n    const width = box.right - box.left\n    const height = box.top - box.bottom\n    const cx = (box.left + box.right) / 2\n    const cy = (box.bottom + box.top) / 2\n\n    if (state.fill.length > 0) {\n      ctx.draw(new Graphics2D().rect({ x: cx, y: cy, width, height }).fill(state.fill).opacity(r))\n    }\n\n    if (state.stroke.length === 0) return\n\n    if (box.xBounded) {\n      const half = (height / 2) * r\n      for (const x of [box.left, box.right]) rule(ctx, { x, y: cy - half }, { x, y: cy + half }, state.stroke, r)\n    }\n    if (box.yBounded) {\n      const half = (width / 2) * r\n      for (const y of [box.bottom, box.top]) rule(ctx, { x: cx - half, y }, { x: cx + half, y }, state.stroke, r)\n    }\n  },\n})\n\nexport type ChartRegion = NodeOf<typeof ChartRegion>\n"]}

package/dist/line-chart/index.d.ts

@@ -1,10 +1,9 @@
 export { LineChart, lineChartDomains } from "./line-chart.js";
-export type { LineChartDomains, LineChartValues } from "./line-chart.js";
+export type { LineChartDomains, LineChartStyle, LineChartValues } from "./line-chart.js";
 export { ChartRegion } from "./chart-region.js";
-export { ChartLine } from "./chart-line.js";
-export { HorizontalAxis } from "./horizontal-axis.js";
-export { DEFAULT_CHART_THEME, EMPTY_REGION_BOX, clipPolylineToBox, hasRegion, lerpChartTheme, resolveChartTheme, resolveRegionBox, resolveYScale, seriesPoints, yExtent, } from "./shared.js";
-export type { ChartConfig, ChartTheme, LineSeries, PlotRegion, RegionBox, RegionConfig, } from "./shared.js";
-export { formatInstant, parseInstant, resolveXScale } from "./x-scale.js";
+export { ChartArea, ChartLine, areaFill, traceX } from "./chart-line.js";
+export { EMPTY_REGION_BOX, LINE_LABELS, LINE_MARKS, clipPolygonToBox, clipPolylineToBox, curvePoints, cutAt, hasRegion, resolveRegionBox, resolveYScale, seriesPoints, stackExtent, stackSeries, yExtent, } from "./shared.js";
+export type { LineCurve, LineSeries, LineStack, PlotRegion, RegionBox, StackedSeries, } from "./shared.js";
+export { EVERY_SAMPLE, formatInstant, parseInstant, resolveXScale } from "./x-scale.js";
 export type { XScale, XScaleKind } from "./x-scale.js";
 //# sourceMappingURL=index.d.ts.map

package/dist/line-chart/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/line-chart/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAA;AAC1D,YAAY,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AACrE,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AACxC,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAClD,OAAO,EACL,mBAAmB,EACnB,gBAAgB,EAChB,iBAAiB,EACjB,SAAS,EACT,cAAc,EACd,iBAAiB,EACjB,gBAAgB,EAChB,aAAa,EACb,YAAY,EACZ,OAAO,GACR,MAAM,UAAU,CAAA;AACjB,YAAY,EACV,WAAW,EACX,UAAU,EACV,UAAU,EACV,UAAU,EACV,SAAS,EACT,YAAY,GACb,MAAM,UAAU,CAAA;AACjB,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,WAAW,CAAA;AACtE,YAAY,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,WAAW,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/line-chart/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAA;AAC1D,YAAY,EAAE,gBAAgB,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AACrF,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5C,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,cAAc,CAAA;AACrE,OAAO,EACL,gBAAgB,EAChB,WAAW,EACX,UAAU,EACV,gBAAgB,EAChB,iBAAiB,EACjB,WAAW,EACX,KAAK,EACL,SAAS,EAET,gBAAgB,EAChB,aAAa,EACb,YAAY,EACZ,WAAW,EACX,WAAW,EACX,OAAO,GACR,MAAM,UAAU,CAAA;AACjB,YAAY,EACV,SAAS,EACT,UAAU,EACV,SAAS,EACT,UAAU,EACV,SAAS,EACT,aAAa,GACd,MAAM,UAAU,CAAA;AACjB,OAAO,EAAE,YAAY,EAAE,aAAa,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,WAAW,CAAA;AACpF,YAAY,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,WAAW,CAAA"}

package/dist/line-chart/index.js

@@ -1,7 +1,6 @@
 export { LineChart, lineChartDomains } from "./line-chart.js";
 export { ChartRegion } from "./chart-region.js";
-export { ChartLine } from "./chart-line.js";
-export { HorizontalAxis } from "./horizontal-axis.js";
-export { DEFAULT_CHART_THEME, EMPTY_REGION_BOX, clipPolylineToBox, hasRegion, lerpChartTheme, resolveChartTheme, resolveRegionBox, resolveYScale, seriesPoints, yExtent, } from "./shared.js";
-export { formatInstant, parseInstant, resolveXScale } from "./x-scale.js";
+export { ChartArea, ChartLine, areaFill, traceX } from "./chart-line.js";
+export { EMPTY_REGION_BOX, LINE_LABELS, LINE_MARKS, clipPolygonToBox, clipPolylineToBox, curvePoints, cutAt, hasRegion, resolveRegionBox, resolveYScale, seriesPoints, stackExtent, stackSeries, yExtent, } from "./shared.js";
+export { EVERY_SAMPLE, formatInstant, parseInstant, resolveXScale } from "./x-scale.js";
 //# sourceMappingURL=index.js.map

package/dist/line-chart/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/line-chart/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAA;AAE1D,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AACxC,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAClD,OAAO,EACL,mBAAmB,EACnB,gBAAgB,EAChB,iBAAiB,EACjB,SAAS,EACT,cAAc,EACd,iBAAiB,EACjB,gBAAgB,EAChB,aAAa,EACb,YAAY,EACZ,OAAO,GACR,MAAM,UAAU,CAAA;AASjB,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,WAAW,CAAA","sourcesContent":["export { LineChart, lineChartDomains } from \"./line-chart\"\nexport type { LineChartDomains, LineChartValues } from \"./line-chart\"\nexport { ChartRegion } from \"./chart-region\"\nexport { ChartLine } from \"./chart-line\"\nexport { HorizontalAxis } from \"./horizontal-axis\"\nexport {\n  DEFAULT_CHART_THEME,\n  EMPTY_REGION_BOX,\n  clipPolylineToBox,\n  hasRegion,\n  lerpChartTheme,\n  resolveChartTheme,\n  resolveRegionBox,\n  resolveYScale,\n  seriesPoints,\n  yExtent,\n} from \"./shared\"\nexport type {\n  ChartConfig,\n  ChartTheme,\n  LineSeries,\n  PlotRegion,\n  RegionBox,\n  RegionConfig,\n} from \"./shared\"\nexport { formatInstant, parseInstant, resolveXScale } from \"./x-scale\"\nexport type { XScale, XScaleKind } from \"./x-scale\"\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/line-chart/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAA;AAE1D,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5C,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,cAAc,CAAA;AACrE,OAAO,EACL,gBAAgB,EAChB,WAAW,EACX,UAAU,EACV,gBAAgB,EAChB,iBAAiB,EACjB,WAAW,EACX,KAAK,EACL,SAAS,EAET,gBAAgB,EAChB,aAAa,EACb,YAAY,EACZ,WAAW,EACX,WAAW,EACX,OAAO,GACR,MAAM,UAAU,CAAA;AASjB,OAAO,EAAE,YAAY,EAAE,aAAa,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,WAAW,CAAA","sourcesContent":["export { LineChart, lineChartDomains } from \"./line-chart\"\nexport type { LineChartDomains, LineChartStyle, LineChartValues } from \"./line-chart\"\nexport { ChartRegion } from \"./chart-region\"\nexport { ChartArea, ChartLine, areaFill, traceX } from \"./chart-line\"\nexport {\n  EMPTY_REGION_BOX,\n  LINE_LABELS,\n  LINE_MARKS,\n  clipPolygonToBox,\n  clipPolylineToBox,\n  curvePoints,\n  cutAt,\n  hasRegion,\n\n  resolveRegionBox,\n  resolveYScale,\n  seriesPoints,\n  stackExtent,\n  stackSeries,\n  yExtent,\n} from \"./shared\"\nexport type {\n  LineCurve,\n  LineSeries,\n  LineStack,\n  PlotRegion,\n  RegionBox,\n  StackedSeries,\n} from \"./shared\"\nexport { EVERY_SAMPLE, formatInstant, parseInstant, resolveXScale } from \"./x-scale\"\nexport type { XScale, XScaleKind } from \"./x-scale\"\n"]}

package/dist/line-chart/line-chart.d.ts

@@ -1,6 +1,63 @@
-import { type DataRecord, type NodeOf, type Node2D, type Node2DProps as _Node2DProps } from "@motionscript/sdk";
+import { type DataRecord, type NodeOf, type OutOf, type Node2D, type Node2DProps as _Node2DProps, type Fill as _Fill, type FillResolved as _FillResolved, type Stroke as _Stroke, type StrokeResolved as _StrokeResolved, type StyleInput as _StyleInput, type StyleValues as _StyleValues } from "@motionscript/sdk";
 import { type AxisDomainConfig, type ResolvedAxisDomain } from "../kit/shared.js";
-import { type ChartConfig, type ChartTheme, type LineSeries, type PlotRegion } from "./shared.js";
+import { type LineSeries, type LineStack, type PlotRegion } from "./shared.js";
+declare const LINE_STYLE: import("@motionscript/sdk").Type<_StyleInput<{
+    legend: import("@motionscript/sdk").Type<"right" | "top" | "bottom" | "none", "right" | "top" | "bottom" | "none", false>;
+    swatch: import("@motionscript/sdk").Type<"square" | "circle" | "line", "square" | "circle" | "line", false>;
+} & {
+    horizontalGrid: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
+    verticalGrid: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
+    axisStroke: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
+    showXAxis: import("@motionscript/sdk").Type<boolean, boolean, false>;
+    showYAxis: import("@motionscript/sdk").Type<boolean, boolean, false>;
+} & {
+    fontFamily: import("@motionscript/sdk").Type<string, string, false>;
+    fontSize: import("@motionscript/sdk").Type<number, number, false>;
+    fontWeight: import("@motionscript/sdk").Type<number, number, false>;
+} & {
+    palette: import("@motionscript/sdk").Type<_Fill[], _FillResolved[][], false>;
+    foreground: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
+    muted: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
+    background: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
+} & {
+    strokeWidth: import("@motionscript/sdk").Type<number, number, false>;
+    curve: import("@motionscript/sdk").Type<"step" | "linear" | "smooth", "step" | "linear" | "smooth", false>;
+    dots: import("@motionscript/sdk").Type<boolean, boolean, false>;
+    dotSize: import("@motionscript/sdk").Type<number, number, false>;
+    area: import("@motionscript/sdk").Type<"none" | "solid" | "gradient", "none" | "solid" | "gradient", false>;
+    areaOpacity: import("@motionscript/sdk").Type<number, number, false>;
+} & {
+    values: import("@motionscript/sdk").Type<"none" | "above" | "below", "none" | "above" | "below", false>;
+}>, _StyleValues<{
+    legend: import("@motionscript/sdk").Type<"right" | "top" | "bottom" | "none", "right" | "top" | "bottom" | "none", false>;
+    swatch: import("@motionscript/sdk").Type<"square" | "circle" | "line", "square" | "circle" | "line", false>;
+} & {
+    horizontalGrid: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
+    verticalGrid: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
+    axisStroke: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
+    showXAxis: import("@motionscript/sdk").Type<boolean, boolean, false>;
+    showYAxis: import("@motionscript/sdk").Type<boolean, boolean, false>;
+} & {
+    fontFamily: import("@motionscript/sdk").Type<string, string, false>;
+    fontSize: import("@motionscript/sdk").Type<number, number, false>;
+    fontWeight: import("@motionscript/sdk").Type<number, number, false>;
+} & {
+    palette: import("@motionscript/sdk").Type<_Fill[], _FillResolved[][], false>;
+    foreground: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
+    muted: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
+    background: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
+} & {
+    strokeWidth: import("@motionscript/sdk").Type<number, number, false>;
+    curve: import("@motionscript/sdk").Type<"step" | "linear" | "smooth", "step" | "linear" | "smooth", false>;
+    dots: import("@motionscript/sdk").Type<boolean, boolean, false>;
+    dotSize: import("@motionscript/sdk").Type<number, number, false>;
+    area: import("@motionscript/sdk").Type<"none" | "solid" | "gradient", "none" | "solid" | "gradient", false>;
+    areaOpacity: import("@motionscript/sdk").Type<number, number, false>;
+} & {
+    values: import("@motionscript/sdk").Type<"none" | "above" | "below", "none" | "above" | "below", false>;
+}>, false>;
+/** A line chart's resolved style. */
+export type LineChartStyle = OutOf<typeof LINE_STYLE>;
 /** Both axes' domains with their ranges and ticks resolved. */
 export interface LineChartDomains {
     readonly x: ResolvedAxisDomain;
@@ -11,16 +68,23 @@ export interface LineChartValues {
     readonly data: DataRecord[];
     readonly xField: string;
     readonly series: LineSeries[];
+    readonly stack: LineStack;
     readonly xAxis: AxisDomainConfig;
     readonly yAxis: AxisDomainConfig;
+    /** Each series' share of a stack, `1` when missing. */
+    readonly weights?: readonly number[];
+    /** An area must reach its baseline, so a chart with areas keeps zero on the scale. */
+    readonly style?: {
+        readonly area: string;
+    };
 }
 /** Both axes as drawn now. */
 export declare function lineChartDomains(s: LineChartValues): LineChartDomains;
 /**
- * A multi-series line chart composed of {@link ChartCanvas}, {@link VerticalAxis} /
- * {@link HorizontalAxis}, {@link ChartRegion}, one {@link ChartLine} per series and
- * {@link ChartLegend}. Every part reads the chart's entries through bindings and
- * maps against the plot panel's own laid-out box.
+ * A multi-series line or area chart composed of {@link ChartCanvas}, the value
+ * and x axes, {@link ChartRegion}, a {@link ChartArea} and a {@link ChartLine}
+ * per series, and {@link ChartLegend}. Every part reads the chart's entries
+ * through bindings and maps against the plot panel's own laid-out box.
  *
  * Resting state is the finished chart; `enter` arms every part on its first
  * frame. A `to` of an axis `range` or `ticks` tweens from the domain as drawn
@@ -30,17 +94,75 @@ export declare const LineChart: import("@motionscript/sdk").Component<"lineChart
     readonly data: import("@motionscript/sdk").Type<DataRecord[], DataRecord[], false>;
     readonly xField: "";
     readonly series: import("@motionscript/sdk").Type<import("../index.js").ChartSeries[], import("../index.js").ChartSeries[], false>;
+    /** `stacked`: each series sits on the sum of those before it; `percent`: every row reads as shares of 100. */
+    readonly stack: import("@motionscript/sdk").Type<"none" | "percent" | "stacked", "none" | "percent" | "stacked", false>;
     readonly xAxis: import("@motionscript/sdk").Type<AxisDomainConfig, AxisDomainConfig, false>;
     readonly yAxis: import("@motionscript/sdk").Type<AxisDomainConfig, AxisDomainConfig, false>;
-    readonly theme: import("@motionscript/sdk").Type<ChartTheme, ChartConfig, false>;
+    readonly style: import("@motionscript/sdk").Type<_StyleInput<{
+        legend: import("@motionscript/sdk").Type<"right" | "top" | "bottom" | "none", "right" | "top" | "bottom" | "none", false>;
+        swatch: import("@motionscript/sdk").Type<"square" | "circle" | "line", "square" | "circle" | "line", false>;
+    } & {
+        horizontalGrid: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
+        verticalGrid: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
+        axisStroke: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
+        showXAxis: import("@motionscript/sdk").Type<boolean, boolean, false>;
+        showYAxis: import("@motionscript/sdk").Type<boolean, boolean, false>;
+    } & {
+        fontFamily: import("@motionscript/sdk").Type<string, string, false>;
+        fontSize: import("@motionscript/sdk").Type<number, number, false>;
+        fontWeight: import("@motionscript/sdk").Type<number, number, false>;
+    } & {
+        palette: import("@motionscript/sdk").Type<_Fill[], _FillResolved[][], false>;
+        foreground: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
+        muted: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
+        background: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
+    } & {
+        strokeWidth: import("@motionscript/sdk").Type<number, number, false>;
+        curve: import("@motionscript/sdk").Type<"step" | "linear" | "smooth", "step" | "linear" | "smooth", false>;
+        dots: import("@motionscript/sdk").Type<boolean, boolean, false>;
+        dotSize: import("@motionscript/sdk").Type<number, number, false>;
+        area: import("@motionscript/sdk").Type<"none" | "solid" | "gradient", "none" | "solid" | "gradient", false>;
+        areaOpacity: import("@motionscript/sdk").Type<number, number, false>;
+    } & {
+        values: import("@motionscript/sdk").Type<"none" | "above" | "below", "none" | "above" | "below", false>;
+    }>, _StyleValues<{
+        legend: import("@motionscript/sdk").Type<"right" | "top" | "bottom" | "none", "right" | "top" | "bottom" | "none", false>;
+        swatch: import("@motionscript/sdk").Type<"square" | "circle" | "line", "square" | "circle" | "line", false>;
+    } & {
+        horizontalGrid: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
+        verticalGrid: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
+        axisStroke: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
+        showXAxis: import("@motionscript/sdk").Type<boolean, boolean, false>;
+        showYAxis: import("@motionscript/sdk").Type<boolean, boolean, false>;
+    } & {
+        fontFamily: import("@motionscript/sdk").Type<string, string, false>;
+        fontSize: import("@motionscript/sdk").Type<number, number, false>;
+        fontWeight: import("@motionscript/sdk").Type<number, number, false>;
+    } & {
+        palette: import("@motionscript/sdk").Type<_Fill[], _FillResolved[][], false>;
+        foreground: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
+        muted: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
+        background: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
+    } & {
+        strokeWidth: import("@motionscript/sdk").Type<number, number, false>;
+        curve: import("@motionscript/sdk").Type<"step" | "linear" | "smooth", "step" | "linear" | "smooth", false>;
+        dots: import("@motionscript/sdk").Type<boolean, boolean, false>;
+        dotSize: import("@motionscript/sdk").Type<number, number, false>;
+        area: import("@motionscript/sdk").Type<"none" | "solid" | "gradient", "none" | "solid" | "gradient", false>;
+        areaOpacity: import("@motionscript/sdk").Type<number, number, false>;
+    } & {
+        values: import("@motionscript/sdk").Type<"none" | "above" | "below", "none" | "above" | "below", false>;
+    }>, false>;
     /** The spotlit slice in data units, or `null`. The box snaps; {@link regionReveal} animates it. */
     readonly region: import("@motionscript/sdk").Type<PlotRegion | null, PlotRegion | null, false>;
-    /** How far the `region` call-out is drawn in, `[0, 1]`: rules grow, wash fades up, out-of-region stretches fade to `region.dimOpacity`. */
+    /** How far the `region` call-out is drawn in, `[0, 1]`: rules grow, wash fades up, out-of-region stretches fade. */
     readonly regionReveal: 0;
-    /** Read as the chart is built: the legend is a part the chart builds or doesn't. */
-    readonly showLegend: import("@motionscript/sdk").Type<boolean, boolean, false>;
     /** The domain `zoomTo` first left, so `resetZoom` restores it, auto-derived ticks included. */
     readonly home: import("@motionscript/sdk").Type<LineChartDomains | null, LineChartDomains | null, false>;
+    /** Each series' share of a stack, seeded from `enabled`: a weight rather than a switch, so a hidden series sinks out. */
+    readonly weights: import("@motionscript/sdk").Type<number[], number[], false>;
+    /** Whether the plot clips its marks, from a zoom's first frame until a reset lands. */
+    readonly clipped: import("@motionscript/sdk").Type<boolean, boolean, true>;
 }>, {
     readonly enter: {};
     readonly spotlightRegion: {
@@ -64,32 +186,148 @@ export declare const LineChart: import("@motionscript/sdk").Component<"lineChart
     readonly data: import("@motionscript/sdk").Type<DataRecord[], DataRecord[], false>;
     readonly xField: "";
     readonly series: import("@motionscript/sdk").Type<import("../index.js").ChartSeries[], import("../index.js").ChartSeries[], false>;
+    /** `stacked`: each series sits on the sum of those before it; `percent`: every row reads as shares of 100. */
+    readonly stack: import("@motionscript/sdk").Type<"none" | "percent" | "stacked", "none" | "percent" | "stacked", false>;
     readonly xAxis: import("@motionscript/sdk").Type<AxisDomainConfig, AxisDomainConfig, false>;
     readonly yAxis: import("@motionscript/sdk").Type<AxisDomainConfig, AxisDomainConfig, false>;
-    readonly theme: import("@motionscript/sdk").Type<ChartTheme, ChartConfig, false>;
+    readonly style: import("@motionscript/sdk").Type<_StyleInput<{
+        legend: import("@motionscript/sdk").Type<"right" | "top" | "bottom" | "none", "right" | "top" | "bottom" | "none", false>;
+        swatch: import("@motionscript/sdk").Type<"square" | "circle" | "line", "square" | "circle" | "line", false>;
+    } & {
+        horizontalGrid: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
+        verticalGrid: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
+        axisStroke: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
+        showXAxis: import("@motionscript/sdk").Type<boolean, boolean, false>;
+        showYAxis: import("@motionscript/sdk").Type<boolean, boolean, false>;
+    } & {
+        fontFamily: import("@motionscript/sdk").Type<string, string, false>;
+        fontSize: import("@motionscript/sdk").Type<number, number, false>;
+        fontWeight: import("@motionscript/sdk").Type<number, number, false>;
+    } & {
+        palette: import("@motionscript/sdk").Type<_Fill[], _FillResolved[][], false>;
+        foreground: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
+        muted: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
+        background: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
+    } & {
+        strokeWidth: import("@motionscript/sdk").Type<number, number, false>;
+        curve: import("@motionscript/sdk").Type<"step" | "linear" | "smooth", "step" | "linear" | "smooth", false>;
+        dots: import("@motionscript/sdk").Type<boolean, boolean, false>;
+        dotSize: import("@motionscript/sdk").Type<number, number, false>;
+        area: import("@motionscript/sdk").Type<"none" | "solid" | "gradient", "none" | "solid" | "gradient", false>;
+        areaOpacity: import("@motionscript/sdk").Type<number, number, false>;
+    } & {
+        values: import("@motionscript/sdk").Type<"none" | "above" | "below", "none" | "above" | "below", false>;
+    }>, _StyleValues<{
+        legend: import("@motionscript/sdk").Type<"right" | "top" | "bottom" | "none", "right" | "top" | "bottom" | "none", false>;
+        swatch: import("@motionscript/sdk").Type<"square" | "circle" | "line", "square" | "circle" | "line", false>;
+    } & {
+        horizontalGrid: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
+        verticalGrid: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
+        axisStroke: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
+        showXAxis: import("@motionscript/sdk").Type<boolean, boolean, false>;
+        showYAxis: import("@motionscript/sdk").Type<boolean, boolean, false>;
+    } & {
+        fontFamily: import("@motionscript/sdk").Type<string, string, false>;
+        fontSize: import("@motionscript/sdk").Type<number, number, false>;
+        fontWeight: import("@motionscript/sdk").Type<number, number, false>;
+    } & {
+        palette: import("@motionscript/sdk").Type<_Fill[], _FillResolved[][], false>;
+        foreground: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
+        muted: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
+        background: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
+    } & {
+        strokeWidth: import("@motionscript/sdk").Type<number, number, false>;
+        curve: import("@motionscript/sdk").Type<"step" | "linear" | "smooth", "step" | "linear" | "smooth", false>;
+        dots: import("@motionscript/sdk").Type<boolean, boolean, false>;
+        dotSize: import("@motionscript/sdk").Type<number, number, false>;
+        area: import("@motionscript/sdk").Type<"none" | "solid" | "gradient", "none" | "solid" | "gradient", false>;
+        areaOpacity: import("@motionscript/sdk").Type<number, number, false>;
+    } & {
+        values: import("@motionscript/sdk").Type<"none" | "above" | "below", "none" | "above" | "below", false>;
+    }>, false>;
     /** The spotlit slice in data units, or `null`. The box snaps; {@link regionReveal} animates it. */
     readonly region: import("@motionscript/sdk").Type<PlotRegion | null, PlotRegion | null, false>;
-    /** How far the `region` call-out is drawn in, `[0, 1]`: rules grow, wash fades up, out-of-region stretches fade to `region.dimOpacity`. */
+    /** How far the `region` call-out is drawn in, `[0, 1]`: rules grow, wash fades up, out-of-region stretches fade. */
     readonly regionReveal: 0;
-    /** Read as the chart is built: the legend is a part the chart builds or doesn't. */
-    readonly showLegend: import("@motionscript/sdk").Type<boolean, boolean, false>;
     /** The domain `zoomTo` first left, so `resetZoom` restores it, auto-derived ticks included. */
     readonly home: import("@motionscript/sdk").Type<LineChartDomains | null, LineChartDomains | null, false>;
+    /** Each series' share of a stack, seeded from `enabled`: a weight rather than a switch, so a hidden series sinks out. */
+    readonly weights: import("@motionscript/sdk").Type<number[], number[], false>;
+    /** Whether the plot clips its marks, from a zoom's first frame until a reset lands. */
+    readonly clipped: import("@motionscript/sdk").Type<boolean, boolean, true>;
 }>, readonly [], import("@motionscript/sdk").BuiltNode<import("@motionscript/sdk").Merge<import("@motionscript/sdk").Box2DState, {
     readonly data: import("@motionscript/sdk").Type<DataRecord[], DataRecord[], false>;
     readonly xField: "";
     readonly series: import("@motionscript/sdk").Type<import("../index.js").ChartSeries[], import("../index.js").ChartSeries[], false>;
+    /** `stacked`: each series sits on the sum of those before it; `percent`: every row reads as shares of 100. */
+    readonly stack: import("@motionscript/sdk").Type<"none" | "percent" | "stacked", "none" | "percent" | "stacked", false>;
     readonly xAxis: import("@motionscript/sdk").Type<AxisDomainConfig, AxisDomainConfig, false>;
     readonly yAxis: import("@motionscript/sdk").Type<AxisDomainConfig, AxisDomainConfig, false>;
-    readonly theme: import("@motionscript/sdk").Type<ChartTheme, ChartConfig, false>;
+    readonly style: import("@motionscript/sdk").Type<_StyleInput<{
+        legend: import("@motionscript/sdk").Type<"right" | "top" | "bottom" | "none", "right" | "top" | "bottom" | "none", false>;
+        swatch: import("@motionscript/sdk").Type<"square" | "circle" | "line", "square" | "circle" | "line", false>;
+    } & {
+        horizontalGrid: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
+        verticalGrid: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
+        axisStroke: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
+        showXAxis: import("@motionscript/sdk").Type<boolean, boolean, false>;
+        showYAxis: import("@motionscript/sdk").Type<boolean, boolean, false>;
+    } & {
+        fontFamily: import("@motionscript/sdk").Type<string, string, false>;
+        fontSize: import("@motionscript/sdk").Type<number, number, false>;
+        fontWeight: import("@motionscript/sdk").Type<number, number, false>;
+    } & {
+        palette: import("@motionscript/sdk").Type<_Fill[], _FillResolved[][], false>;
+        foreground: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
+        muted: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
+        background: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
+    } & {
+        strokeWidth: import("@motionscript/sdk").Type<number, number, false>;
+        curve: import("@motionscript/sdk").Type<"step" | "linear" | "smooth", "step" | "linear" | "smooth", false>;
+        dots: import("@motionscript/sdk").Type<boolean, boolean, false>;
+        dotSize: import("@motionscript/sdk").Type<number, number, false>;
+        area: import("@motionscript/sdk").Type<"none" | "solid" | "gradient", "none" | "solid" | "gradient", false>;
+        areaOpacity: import("@motionscript/sdk").Type<number, number, false>;
+    } & {
+        values: import("@motionscript/sdk").Type<"none" | "above" | "below", "none" | "above" | "below", false>;
+    }>, _StyleValues<{
+        legend: import("@motionscript/sdk").Type<"right" | "top" | "bottom" | "none", "right" | "top" | "bottom" | "none", false>;
+        swatch: import("@motionscript/sdk").Type<"square" | "circle" | "line", "square" | "circle" | "line", false>;
+    } & {
+        horizontalGrid: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
+        verticalGrid: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
+        axisStroke: import("@motionscript/sdk").Type<_Stroke, _StrokeResolved[], false>;
+        showXAxis: import("@motionscript/sdk").Type<boolean, boolean, false>;
+        showYAxis: import("@motionscript/sdk").Type<boolean, boolean, false>;
+    } & {
+        fontFamily: import("@motionscript/sdk").Type<string, string, false>;
+        fontSize: import("@motionscript/sdk").Type<number, number, false>;
+        fontWeight: import("@motionscript/sdk").Type<number, number, false>;
+    } & {
+        palette: import("@motionscript/sdk").Type<_Fill[], _FillResolved[][], false>;
+        foreground: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
+        muted: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
+        background: import("@motionscript/sdk").Type<_Fill, _FillResolved[], false>;
+    } & {
+        strokeWidth: import("@motionscript/sdk").Type<number, number, false>;
+        curve: import("@motionscript/sdk").Type<"step" | "linear" | "smooth", "step" | "linear" | "smooth", false>;
+        dots: import("@motionscript/sdk").Type<boolean, boolean, false>;
+        dotSize: import("@motionscript/sdk").Type<number, number, false>;
+        area: import("@motionscript/sdk").Type<"none" | "solid" | "gradient", "none" | "solid" | "gradient", false>;
+        areaOpacity: import("@motionscript/sdk").Type<number, number, false>;
+    } & {
+        values: import("@motionscript/sdk").Type<"none" | "above" | "below", "none" | "above" | "below", false>;
+    }>, false>;
     /** The spotlit slice in data units, or `null`. The box snaps; {@link regionReveal} animates it. */
     readonly region: import("@motionscript/sdk").Type<PlotRegion | null, PlotRegion | null, false>;
-    /** How far the `region` call-out is drawn in, `[0, 1]`: rules grow, wash fades up, out-of-region stretches fade to `region.dimOpacity`. */
+    /** How far the `region` call-out is drawn in, `[0, 1]`: rules grow, wash fades up, out-of-region stretches fade. */
     readonly regionReveal: 0;
-    /** Read as the chart is built: the legend is a part the chart builds or doesn't. */
-    readonly showLegend: import("@motionscript/sdk").Type<boolean, boolean, false>;
     /** The domain `zoomTo` first left, so `resetZoom` restores it, auto-derived ticks included. */
     readonly home: import("@motionscript/sdk").Type<LineChartDomains | null, LineChartDomains | null, false>;
+    /** Each series' share of a stack, seeded from `enabled`: a weight rather than a switch, so a hidden series sinks out. */
+    readonly weights: import("@motionscript/sdk").Type<number[], number[], false>;
+    /** Whether the plot clips its marks, from a zoom's first frame until a reset lands. */
+    readonly clipped: import("@motionscript/sdk").Type<boolean, boolean, true>;
 }>, {
     readonly enter: {};
     readonly spotlightRegion: {
@@ -111,4 +349,5 @@ export declare const LineChart: import("@motionscript/sdk").Component<"lineChart
     };
 }, Node2D<_Node2DProps>>>>;
 export type LineChart = NodeOf<typeof LineChart>;
+export {};
 //# sourceMappingURL=line-chart.d.ts.map

package/dist/line-chart/line-chart.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"line-chart.d.ts","sourceRoot":"","sources":["../../src/line-chart/line-chart.ts"],"names":[],"mappings":"AAAA,OAAO,EAML,KAAK,UAAU,EACf,KAAK,MAAM,EAEX,KAAK,MAAM,EACX,KAAK,WAAW,IAAI,YAAY,EAGjC,MAAM,mBAAmB,CAAA;AAU1B,OAAO,EAWL,KAAK,gBAAgB,EAErB,KAAK,kBAAkB,EACxB,MAAM,eAAe,CAAA;AAItB,OAAO,EAOL,KAAK,WAAW,EAChB,KAAK,UAAU,EACf,KAAK,UAAU,EACf,KAAK,UAAU,EAEhB,MAAM,UAAU,CAAA;AAGjB,+DAA+D;AAC/D,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,CAAC,CAAC,EAAE,kBAAkB,CAAA;IAC9B,QAAQ,CAAC,CAAC,EAAE,kBAAkB,CAAA;CAC/B;AAED,uDAAuD;AACvD,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,IAAI,EAAE,UAAU,EAAE,CAAA;IAC3B,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAA;IACvB,QAAQ,CAAC,MAAM,EAAE,UAAU,EAAE,CAAA;IAC7B,QAAQ,CAAC,KAAK,EAAE,gBAAgB,CAAA;IAChC,QAAQ,CAAC,KAAK,EAAE,gBAAgB,CAAA;CACjC;AA4CD,8BAA8B;AAC9B,wBAAgB,gBAAgB,CAAC,CAAC,EAAE,eAAe,GAAG,gBAAgB,CAYrE;AAoFD;;;;;;;;;GASG;AACH,eAAO,MAAM,SAAS;;;;;;;IAUlB,mGAAmG;;IAEnG,2IAA2I;;IAE3I,oFAAoF;;IAEpF,+FAA+F;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAN/F,mGAAmG;;IAEnG,2IAA2I;;IAE3I,oFAAoF;;IAEpF,+FAA+F;;;;;;;;;IAN/F,mGAAmG;;IAEnG,2IAA2I;;IAE3I,oFAAoF;;IAEpF,+FAA+F;;;;;;;;;;;;;;;;;;;;;0BAiOjG,CAAA;AAEF,MAAM,MAAM,SAAS,GAAG,MAAM,CAAC,OAAO,SAAS,CAAC,CAAA"}
+{"version":3,"file":"line-chart.d.ts","sourceRoot":"","sources":["../../src/line-chart/line-chart.ts"],"names":[],"mappings":"AAAA,OAAO,EAQL,KAAK,UAAU,EACf,KAAK,MAAM,EACX,KAAK,KAAK,EAEV,KAAK,MAAM,EACX,KAAK,WAAW,IAAI,YAAY,EAChC,KAAK,IAAI,IAAI,KAAK,EAClB,KAAK,YAAY,IAAI,aAAa,EAClC,KAAK,MAAM,IAAI,OAAO,EACtB,KAAK,cAAc,IAAI,eAAe,EAEtC,KAAK,UAAU,IAAI,WAAW,EAC9B,KAAK,WAAW,IAAI,YAAY,EAEjC,MAAM,mBAAmB,CAAA;AAS1B,OAAO,EAWL,KAAK,gBAAgB,EAErB,KAAK,kBAAkB,EACxB,MAAM,eAAe,CAAA;AAgBtB,OAAO,EAML,KAAK,UAAU,EACf,KAAK,SAAS,EACd,KAAK,UAAU,EAGhB,MAAM,UAAU,CAAA;AAGjB,QAAA,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;UAIf,CAAA;AAED,qCAAqC;AACrC,MAAM,MAAM,cAAc,GAAG,KAAK,CAAC,OAAO,UAAU,CAAC,CAAA;AAErD,+DAA+D;AAC/D,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,CAAC,CAAC,EAAE,kBAAkB,CAAA;IAC9B,QAAQ,CAAC,CAAC,EAAE,kBAAkB,CAAA;CAC/B;AAED,uDAAuD;AACvD,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,IAAI,EAAE,UAAU,EAAE,CAAA;IAC3B,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAA;IACvB,QAAQ,CAAC,MAAM,EAAE,UAAU,EAAE,CAAA;IAC7B,QAAQ,CAAC,KAAK,EAAE,SAAS,CAAA;IACzB,QAAQ,CAAC,KAAK,EAAE,gBAAgB,CAAA;IAChC,QAAQ,CAAC,KAAK,EAAE,gBAAgB,CAAA;IAChC,uDAAuD;IACvD,QAAQ,CAAC,OAAO,CAAC,EAAE,SAAS,MAAM,EAAE,CAAA;IACpC,sFAAsF;IACtF,QAAQ,CAAC,KAAK,CAAC,EAAE;QAAE,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAA;KAAE,CAAA;CAC3C;AA2DD,8BAA8B;AAC9B,wBAAgB,gBAAgB,CAAC,CAAC,EAAE,eAAe,GAAG,gBAAgB,CAUrE;AA+ID;;;;;;;;;GASG;AACH,eAAO,MAAM,SAAS;;;;IAOlB,8GAA8G;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAK9G,mGAAmG;;IAEnG,oHAAoH;;IAEpH,+FAA+F;;IAE/F,yHAAyH;;IAEzH,uFAAuF;;;;;;;;;;;;;;;;;;;;;;;;;IAbvF,8GAA8G;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAK9G,mGAAmG;;IAEnG,oHAAoH;;IAEpH,+FAA+F;;IAE/F,yHAAyH;;IAEzH,uFAAuF;;;;;;IAbvF,8GAA8G;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAK9G,mGAAmG;;IAEnG,oHAAoH;;IAEpH,+FAA+F;;IAE/F,yHAAyH;;IAEzH,uFAAuF;;;;;;;;;;;;;;;;;;;;;0BAwTzF,CAAA;AAEF,MAAM,MAAM,SAAS,GAAG,MAAM,CAAC,OAAO,SAAS,CAAC,CAAA"}