@motionscript/charts 0.1.0 → 0.1.1-alpha.0

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` through the sdk, not core.\n  type Node2D as _Node2D,\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 **region call-out** of a {@link LineChart}: a washed rectangle over the\n * plot with a dashed rule down each edge the author actually bounded. Sized and\n * positioned entirely from the pre-mapped `box` rather\n * than its own box — the region already carries the plot geometry.\n *\n * It draws only the *marking*; fading the series outside the region is\n * {@link ChartLine}'s job (it clips its own polyline against the same box), so\n * the two can't disagree about where the boundary is.\n *\n * Only bounded edges get a rule: a region given just an `x` range spans the full\n * plot height, so its top and bottom edges are the plot's own border, not a data\n * bound — drawing dashes there would assert a limit the author didn't set.\n */\nexport const ChartRegion = component2d({\n  key: \"chartRegion\",\n  state: {\n    /** The highlighted slice, already resolved into this node's local pixel space (origin at centre, y-up) by the parent {@link LineChart}. A degenerate box draws nothing. */\n    box: fresh<RegionBox>(() => EMPTY_REGION_BOX),\n    /** Dashed rule marking each *bounded* edge of the box. */\n    stroke: Types.custom<Stroke, StrokeResolved[]>(DEFAULT_CHART_THEME.region.stroke, { resolve: strokeOps.resolve, lerp: strokeOps.lerp }),\n    /** Wash filling the box, under the series lines. */\n    fill: Types.custom<Fill, FillResolved[]>(DEFAULT_CHART_THEME.region.fill, { resolve: fillOps.resolve, lerp: fillOps.lerp }),\n    /** Reveal of the annotation in `[0, 1]`, driven by the chart's own `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    // Wash first, so the rules sit over their own tint.\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    // One rule per bounded edge, growing from the region's centre outward as\n    // `reveal` climbs — the same \"trace it in\" beat as the series lines.\n    if (state.stroke.length === 0) return\n\n    // One `draw` per rule rather than four line ops under a single paint:\n    // shapes chained before a `stroke()` are combined into one surface, and\n    // stroking a union of disjoint open paths doesn't paint.\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 { 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"]}

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

@@ -1,35 +1,20 @@
-import { type NodeOf, type Node2D } from "@motionscript/sdk";
+import { type NodeOf, type Node2D, type Node2DProps as _Node2DProps } from "@motionscript/sdk";
 import { type Arrival } from "../kit/motion.js";
 import { type AxisConfig, type Range } from "../kit/shared.js";
 /**
- * The horizontal axis of a {@link LineChart}: a **row of {@link Text} nodes**,
- * one per marker value, running left-to-right. Pure layout — the mirror of the
- * kit's `VerticalAxis`, including its bound (not snapshotted) marker text and
- * positions, and its landed resting state.
- *
- * Markers are always placed **by value** across the range, whatever they say:
- * `2026-03` sits three months along, not three slots along. That is what keeps
- * it distinct from a bar chart's bottom axis, which centres a caption on each
- * slot and has no scale at all — the two only look alike. What the values are
- * captioned *as* is the chart's to decide, in `captions`.
- *
- * `enter` staggers the markers in **left-to-right**: each starts lifted a
- * little above its slot and transparent, then fades and slides down into place.
+ * The horizontal axis of a {@link LineChart}: a row of {@link Text} markers, the
+ * mirror of `VerticalAxis` (bound text and positions, landed resting state).
+ * Markers are placed by value across the range, whatever they say: `2026-03`
+ * sits three months along, not three slots along, unlike a bar chart's axis.
  */
 export declare const HorizontalAxis: import("@motionscript/sdk").Component<"horizontalAxis", import("@motionscript/sdk").Merge<import("@motionscript/sdk").Box2DState, {
-    /** `[min, max]` of the horizontal scale the markers are positioned within. */
     readonly range: import("@motionscript/sdk").Type<Range, Range, false>;
-    /** Tick values (in data units) to draw along the axis. */
+    /** Tick values in data units. */
     readonly markers: import("@motionscript/sdk").Type<number[], number[], false>;
-    /**
-     * How each marker is captioned, one per entry of `markers` and in its order.
-     * Empty (the default), or short, captions a marker with its bare numeric
-     * reading; a chart whose x column names months or categories writes those.
-     */
+    /** One caption per marker in its order; a missing one reads as the bare numeric value. */
     readonly captions: import("@motionscript/sdk").Type<string[], string[], false>;
-    /** Marker/caption text style, grid stroke, and gutters — see {@link AxisConfig}. */
     readonly axis: import("@motionscript/sdk").Type<AxisConfig, AxisConfig, false>;
-    /** Caption drawn centred in the gutter beneath the marker row; empty (the default) hides it. */
+    /** Caption centred beneath the markers; empty hides it. */
     readonly label: "";
     readonly arrivals: import("@motionscript/sdk").Type<Readonly<Record<string, Arrival>>, Readonly<Record<string, Arrival>>, false>;
 }>, {
@@ -37,36 +22,24 @@ export declare const HorizontalAxis: import("@motionscript/sdk").Component<"hori
         readonly stagger: import("@motionscript/sdk").Type<number | undefined, number | undefined, false>;
         readonly slide: import("@motionscript/sdk").Type<number, number, false>;
     };
-}, null, Node2D<import("@motionscript/core").Node2DProps>, import("@motionscript/sdk").CallProps<import("@motionscript/sdk").Merge<import("@motionscript/sdk").Box2DState, {
-    /** `[min, max]` of the horizontal scale the markers are positioned within. */
+}, null, Node2D<_Node2DProps>, import("@motionscript/sdk").CallProps<import("@motionscript/sdk").Merge<import("@motionscript/sdk").Box2DState, {
     readonly range: import("@motionscript/sdk").Type<Range, Range, false>;
-    /** Tick values (in data units) to draw along the axis. */
+    /** Tick values in data units. */
     readonly markers: import("@motionscript/sdk").Type<number[], number[], false>;
-    /**
-     * How each marker is captioned, one per entry of `markers` and in its order.
-     * Empty (the default), or short, captions a marker with its bare numeric
-     * reading; a chart whose x column names months or categories writes those.
-     */
+    /** One caption per marker in its order; a missing one reads as the bare numeric value. */
     readonly captions: import("@motionscript/sdk").Type<string[], string[], false>;
-    /** Marker/caption text style, grid stroke, and gutters — see {@link AxisConfig}. */
     readonly axis: import("@motionscript/sdk").Type<AxisConfig, AxisConfig, false>;
-    /** Caption drawn centred in the gutter beneath the marker row; empty (the default) hides it. */
+    /** Caption centred beneath the markers; empty hides it. */
     readonly label: "";
     readonly arrivals: import("@motionscript/sdk").Type<Readonly<Record<string, Arrival>>, Readonly<Record<string, Arrival>>, false>;
 }>, null, import("@motionscript/sdk").BuiltNode<import("@motionscript/sdk").Merge<import("@motionscript/sdk").Box2DState, {
-    /** `[min, max]` of the horizontal scale the markers are positioned within. */
     readonly range: import("@motionscript/sdk").Type<Range, Range, false>;
-    /** Tick values (in data units) to draw along the axis. */
+    /** Tick values in data units. */
     readonly markers: import("@motionscript/sdk").Type<number[], number[], false>;
-    /**
-     * How each marker is captioned, one per entry of `markers` and in its order.
-     * Empty (the default), or short, captions a marker with its bare numeric
-     * reading; a chart whose x column names months or categories writes those.
-     */
+    /** One caption per marker in its order; a missing one reads as the bare numeric value. */
     readonly captions: import("@motionscript/sdk").Type<string[], string[], false>;
-    /** Marker/caption text style, grid stroke, and gutters — see {@link AxisConfig}. */
     readonly axis: import("@motionscript/sdk").Type<AxisConfig, AxisConfig, false>;
-    /** Caption drawn centred in the gutter beneath the marker row; empty (the default) hides it. */
+    /** Caption centred beneath the markers; empty hides it. */
     readonly label: "";
     readonly arrivals: import("@motionscript/sdk").Type<Readonly<Record<string, Arrival>>, Readonly<Record<string, Arrival>>, false>;
 }>, {
@@ -74,6 +47,6 @@ export declare const HorizontalAxis: import("@motionscript/sdk").Component<"hori
         readonly stagger: import("@motionscript/sdk").Type<number | undefined, number | undefined, false>;
         readonly slide: import("@motionscript/sdk").Type<number, number, false>;
     };
-}, Node2D<import("@motionscript/core").Node2DProps>>>>;
+}, Node2D<_Node2DProps>>>>;
 export type HorizontalAxis = NodeOf<typeof HorizontalAxis>;
 //# sourceMappingURL=horizontal-axis.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"horizontal-axis.d.ts","sourceRoot":"","sources":["../../src/line-chart/horizontal-axis.ts"],"names":[],"mappings":"AAAA,OAAO,EAOL,KAAK,MAAM,EACX,KAAK,MAAM,EACZ,MAAM,mBAAmB,CAAC;AAG3B,OAAO,EAA8D,KAAK,OAAO,EAAE,MAAM,eAAe,CAAC;AACzG,OAAO,EAGL,KAAK,UAAU,EACf,KAAK,KAAK,EACX,MAAM,eAAe,CAAC;AAMvB;;;;;;;;;;;;;;GAcG;AACH,eAAO,MAAM,cAAc;IAGvB,8EAA8E;;IAE9E,0DAA0D;;IAE1D;;;;OAIG;;IAEH,oFAAoF;;IAEpF,gGAAgG;;;;;;;;;IAZhG,8EAA8E;;IAE9E,0DAA0D;;IAE1D;;;;OAIG;;IAEH,oFAAoF;;IAEpF,gGAAgG;;;;IAZhG,8EAA8E;;IAE9E,0DAA0D;;IAE1D;;;;OAIG;;IAEH,oFAAoF;;IAEpF,gGAAgG;;;;;;;;sDA8FlG,CAAC;AAEH,MAAM,MAAM,cAAc,GAAG,MAAM,CAAC,OAAO,cAAc,CAAC,CAAC"}
+{"version":3,"file":"horizontal-axis.d.ts","sourceRoot":"","sources":["../../src/line-chart/horizontal-axis.ts"],"names":[],"mappings":"AAAA,OAAO,EAOL,KAAK,MAAM,EACX,KAAK,MAAM,EACX,KAAK,WAAW,IAAI,YAAY,EACjC,MAAM,mBAAmB,CAAC;AAI3B,OAAO,EAA8D,KAAK,OAAO,EAAE,MAAM,eAAe,CAAC;AACzG,OAAO,EAEL,KAAK,UAAU,EACf,KAAK,KAAK,EACX,MAAM,eAAe,CAAC;AAKvB;;;;;GAKG;AACH,eAAO,MAAM,cAAc;;IAIvB,iCAAiC;;IAEjC,0FAA0F;;;IAG1F,2DAA2D;;;;;;;;;;IAL3D,iCAAiC;;IAEjC,0FAA0F;;;IAG1F,2DAA2D;;;;;IAL3D,iCAAiC;;IAEjC,0FAA0F;;;IAG1F,2DAA2D;;;;;;;;0BAgF7D,CAAC;AAEH,MAAM,MAAM,cAAc,GAAG,MAAM,CAAC,OAAO,cAAc,CAAC,CAAC"}

package/dist/line-chart/horizontal-axis.js

@@ -1,55 +1,38 @@
 import { Rect, Text, Types, component2d, insetsOps, textOps, } from "@motionscript/sdk";
+import { enterBudget } from "@motionscript/sdk/component";
 import { asParts, fresh } from "../kit/entries.js";
 import { armed, arrival, arrivalOf, arrivalsEntry, beats, frameEase } from "../kit/motion.js";
-import { DEFAULT_X_AXIS, enterBudget, } from "../kit/shared.js";
+import { DEFAULT_X_AXIS, } from "../kit/shared.js";
 import { markerCaption } from "../kit/vertical-axis.js";
-/** How far a marker starts above its slot when it enters, in px. */
 const SLIDE = 24;
 /**
- * The horizontal axis of a {@link LineChart}: a **row of {@link Text} nodes**,
- * one per marker value, running left-to-right. Pure layout — the mirror of the
- * kit's `VerticalAxis`, including its bound (not snapshotted) marker text and
- * positions, and its landed resting state.
- *
- * Markers are always placed **by value** across the range, whatever they say:
- * `2026-03` sits three months along, not three slots along. That is what keeps
- * it distinct from a bar chart's bottom axis, which centres a caption on each
- * slot and has no scale at all — the two only look alike. What the values are
- * captioned *as* is the chart's to decide, in `captions`.
- *
- * `enter` staggers the markers in **left-to-right**: each starts lifted a
- * little above its slot and transparent, then fades and slides down into place.
+ * The horizontal axis of a {@link LineChart}: a row of {@link Text} markers, the
+ * mirror of `VerticalAxis` (bound text and positions, landed resting state).
+ * Markers are placed by value across the range, whatever they say: `2026-03`
+ * sits three months along, not three slots along, unlike a bar chart's axis.
  */
 export const HorizontalAxis = component2d({
     key: "horizontalAxis",
     state: {
-        /** `[min, max]` of the horizontal scale the markers are positioned within. */
         range: fresh(() => [0, 1]),
-        /** Tick values (in data units) to draw along the axis. */
+        /** Tick values in data units. */
         markers: fresh(() => []),
-        /**
-         * How each marker is captioned, one per entry of `markers` and in its order.
-         * Empty (the default), or short, captions a marker with its bare numeric
-         * reading; a chart whose x column names months or categories writes those.
-         */
+        /** One caption per marker in its order; a missing one reads as the bare numeric value. */
         captions: fresh(() => []),
-        /** Marker/caption text style, grid stroke, and gutters — see {@link AxisConfig}. */
         axis: Types.custom(DEFAULT_X_AXIS),
-        /** Caption drawn centred in the gutter beneath the marker row; empty (the default) hides it. */
+        /** Caption centred beneath the markers; empty hides it. */
         label: "",
         arrivals: arrivalsEntry(),
     },
-    // A plain node filled its parent; one made of its markers would hug them.
+    // A node made of markers would otherwise hug them.
     defaults: { width: "fill", height: "fill" },
     children: (state) => {
         const tickPad = insetsOps.resolve(state.axis.tickPadding).top;
         const titlePad = insetsOps.resolve(state.axis.titlePadding).top;
         const column = [];
-        // The column's parent is the axis: its box is what the markers are placed in.
+        // The column's parent is the axis, whose box the markers are placed in.
         const box = () => column[0]?.parent?.layoutBounds ?? { width: 0, height: 0 };
-        /** The live tick values, left → right — re-read every frame, not snapshotted. */
         const sorted = () => [...state.markers].sort((a, b) => a - b);
-        /** Tick `i`'s fraction across the live `range`, 0 at the left edge. */
         const fracAt = (value) => {
             if (value === undefined)
                 return 0;
@@ -66,12 +49,7 @@ export const HorizontalAxis = component2d({
                 x: () => {
                     const width = box().width;
                     const centred = (fracAt(sorted()[i]) - 0.5) * width;
-                    // Held inside the axis's right edge, which is also the *chart's*: the
-                    // last marker is centred on the last grid line, so half of `2026-06`
-                    // — or of `3300` — would be drawn outside the node's box and outside
-                    // the rectangle the editor draws around it. Only the right edge is
-                    // held, because the left one has the vertical axis's whole gutter
-                    // beyond it, and a marker overhanging into that is inside the chart.
+                    // Held inside the right edge, the chart's own: the last marker is centred on the last grid line, so half of it would fall outside the box. The left edge has the vertical axis's gutter beyond it.
                     const limit = width / 2 - marker.layoutBounds.width / 2;
                     return Math.min(centred, limit);
                 },
@@ -95,13 +73,7 @@ export const HorizontalAxis = component2d({
         return asParts(column);
     },
     commands: {
-        /**
-         * Stagger the markers in left to right, then slide the caption in after
-         * them. Its first frame arms them all: lifted by `slide` and transparent.
-         *
-         * The timeline's duration is the **whole** entrance — see
-         * `VerticalAxis.enter` and {@link enterBudget}.
-         */
+        /** Stagger markers in left to right, then the caption. The duration is the whole entrance ({@link enterBudget}). */
         enter: {
             args: {
                 stagger: Types.custom(undefined),
@@ -118,7 +90,6 @@ export const HorizontalAxis = component2d({
                     return arm;
                 const { step, per, caption } = enterBudget(timeline.duration, count, captioned, stagger);
                 const ease = frameEase(timeline);
-                // Left marker leads: the row is already left → right.
                 const markers = state.markers.map((_, i) => ({ at: i * step, duration: per, piece: arrival(timeline, i, from, ease) }));
                 const label = captioned ? [{ at: (count - 1) * step + per, duration: caption, piece: arrival(timeline, "label", from, ease) }] : [];
                 return timeline.together([arm, beats(timeline, [...markers, ...label])]);

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

@@ -1 +1 @@
-{"version":3,"file":"horizontal-axis.js","sourceRoot":"","sources":["../../src/line-chart/horizontal-axis.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  Rect,\n  Text,\n  Types,\n  component2d,\n  insetsOps,\n  textOps,\n  type NodeOf,\n  type Node2D,\n} from \"@motionscript/sdk\";\n\nimport { asParts, fresh } from \"../kit/entries\";\nimport { armed, arrival, arrivalOf, arrivalsEntry, beats, frameEase, type Arrival } from \"../kit/motion\";\nimport {\n  DEFAULT_X_AXIS,\n  enterBudget,\n  type AxisConfig,\n  type Range,\n} from \"../kit/shared\";\nimport { markerCaption } from \"../kit/vertical-axis\";\n\n/** How far a marker starts above its slot when it enters, in px. */\nconst SLIDE = 24;\n\n/**\n * The horizontal axis of a {@link LineChart}: a **row of {@link Text} nodes**,\n * one per marker value, running left-to-right. Pure layout — the mirror of the\n * kit's `VerticalAxis`, including its bound (not snapshotted) marker text and\n * positions, and its landed resting state.\n *\n * Markers are always placed **by value** across the range, whatever they say:\n * `2026-03` sits three months along, not three slots along. That is what keeps\n * it distinct from a bar chart's bottom axis, which centres a caption on each\n * slot and has no scale at all — the two only look alike. What the values are\n * captioned *as* is the chart's to decide, in `captions`.\n *\n * `enter` staggers the markers in **left-to-right**: each starts lifted a\n * little above its slot and transparent, then fades and slides down into place.\n */\nexport const HorizontalAxis = component2d({\n  key: \"horizontalAxis\",\n  state: {\n    /** `[min, max]` of the horizontal scale the markers are positioned within. */\n    range: fresh<Range>(() => [0, 1]),\n    /** Tick values (in data units) to draw along the axis. */\n    markers: fresh<number[]>(() => []),\n    /**\n     * How each marker is captioned, one per entry of `markers` and in its order.\n     * Empty (the default), or short, captions a marker with its bare numeric\n     * reading; a chart whose x column names months or categories writes those.\n     */\n    captions: fresh<string[]>(() => []),\n    /** Marker/caption text style, grid stroke, and gutters — see {@link AxisConfig}. */\n    axis: Types.custom<AxisConfig>(DEFAULT_X_AXIS),\n    /** Caption drawn centred in the gutter beneath the marker row; empty (the default) hides it. */\n    label: \"\",\n    arrivals: arrivalsEntry(),\n  },\n  // A plain node filled its parent; one made of its markers would hug them.\n  defaults: { width: \"fill\", height: \"fill\" },\n  children: (state) => {\n    const tickPad = insetsOps.resolve(state.axis.tickPadding).top;\n    const titlePad = insetsOps.resolve(state.axis.titlePadding).top;\n\n    const column: Node2D[] = [];\n    // The column's parent is the axis: its box is what the markers are placed in.\n    const box = () => (column[0]?.parent as Node2D | null | undefined)?.layoutBounds ?? { width: 0, height: 0 };\n    /** The live tick values, left → right — re-read every frame, not snapshotted. */\n    const sorted = () => [...state.markers].sort((a, b) => a - b);\n    /** Tick `i`'s fraction across the live `range`, 0 at the left edge. */\n    const fracAt = (value: number | undefined) => {\n      if (value === undefined) return 0;\n      const [min, max] = state.range;\n      return max <= min ? 0 : (value - min) / (max - min);\n    };\n\n    const markers = state.markers.map((_, i) => {\n      const marker: Node2D = new Text({\n        ...textOps.styleProps(state.axis.labelStyle),\n        text: () => {\n          const value = sorted()[i];\n          return value === undefined ? \"\" : markerCaption(state, value);\n        },\n        x: () => {\n          const width = box().width;\n          const centred = (fracAt(sorted()[i]) - 0.5) * width;\n          // Held inside the axis's right edge, which is also the *chart's*: the\n          // last marker is centred on the last grid line, so half of `2026-06`\n          // — or of `3300` — would be drawn outside the node's box and outside\n          // the rectangle the editor draws around it. Only the right edge is\n          // held, because the left one has the vertical axis's whole gutter\n          // beyond it, and a marker overhanging into that is inside the chart.\n          const limit = width / 2 - marker.layoutBounds.width / 2;\n          return Math.min(centred, limit);\n        },\n        opacity: () => arrivalOf(state.arrivals, i).opacity,\n        y: () => arrivalOf(state.arrivals, i).shift,\n      });\n      return marker;\n    });\n\n    const children: Node2D[] = [\n      new Rect({ width: \"fill\", height: \"hug\", padding: { top: tickPad }, children: markers }),\n    ];\n    if (state.label !== \"\") {\n      children.push(\n        new Text({\n          ...textOps.styleProps(state.axis.titleStyle),\n          text: state.label,\n          opacity: () => arrivalOf(state.arrivals, \"label\").opacity,\n          y: () => arrivalOf(state.arrivals, \"label\").shift,\n        }),\n      );\n    }\n\n    column.push(new Rect({ flow: \"vertical\", gap: titlePad, height: \"hug\", width: \"fill\", children }));\n    return asParts(column);\n  },\n  commands: {\n    /**\n     * Stagger the markers in left to right, then slide the caption in after\n     * them. Its first frame arms them all: lifted by `slide` and transparent.\n     *\n     * The timeline's duration is the **whole** entrance — see\n     * `VerticalAxis.enter` and {@link enterBudget}.\n     */\n    enter: {\n      args: {\n        stagger: Types.custom<number | undefined>(undefined),\n        slide: Types.number(SLIDE),\n      },\n      run: (timeline, state) => {\n        const { stagger, slide } = timeline.args;\n        const count = state.markers.length;\n        const captioned = state.label !== \"\";\n        const from: Arrival = { opacity: 0, shift: slide };\n        const keys = [...state.markers.keys(), ...(captioned ? [\"label\"] : [])];\n        const arm = timeline.animate(() => ({ arrivals: armed(keys, from) }));\n        if (count === 0) return arm;\n        const { step, per, caption } = enterBudget(timeline.duration, count, captioned, stagger);\n        const ease = frameEase(timeline);\n        // Left marker leads: the row is already left → right.\n        const markers = state.markers.map((_, i) => ({ at: i * step, duration: per, piece: arrival(timeline, i, from, ease) }));\n        const label = captioned ? [{ at: (count - 1) * step + per, duration: caption, piece: arrival(timeline, \"label\", from, ease) }] : [];\n        return timeline.together([arm, beats(timeline, [...markers, ...label])]);\n      },\n    },\n  },\n});\n\nexport type HorizontalAxis = NodeOf<typeof HorizontalAxis>;\n"]}
+{"version":3,"file":"horizontal-axis.js","sourceRoot":"","sources":["../../src/line-chart/horizontal-axis.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  Rect,\n  Text,\n  Types,\n  component2d,\n  insetsOps,\n  textOps,\n  type NodeOf,\n  type Node2D,\n  type Node2DProps as _Node2DProps,\n} from \"@motionscript/sdk\";\nimport { enterBudget } from \"@motionscript/sdk/component\";\n\nimport { asParts, fresh } from \"../kit/entries\";\nimport { armed, arrival, arrivalOf, arrivalsEntry, beats, frameEase, type Arrival } from \"../kit/motion\";\nimport {\n  DEFAULT_X_AXIS,\n  type AxisConfig,\n  type Range,\n} from \"../kit/shared\";\nimport { markerCaption } from \"../kit/vertical-axis\";\n\nconst SLIDE = 24;\n\n/**\n * The horizontal axis of a {@link LineChart}: a row of {@link Text} markers, the\n * mirror of `VerticalAxis` (bound text and positions, landed resting state).\n * Markers are placed by value across the range, whatever they say: `2026-03`\n * sits three months along, not three slots along, unlike a bar chart's axis.\n */\nexport const HorizontalAxis = component2d({\n  key: \"horizontalAxis\",\n  state: {\n    range: fresh<Range>(() => [0, 1]),\n    /** Tick values in data units. */\n    markers: fresh<number[]>(() => []),\n    /** One caption per marker in its order; a missing one reads as the bare numeric value. */\n    captions: fresh<string[]>(() => []),\n    axis: Types.custom<AxisConfig>(DEFAULT_X_AXIS),\n    /** Caption centred beneath the markers; empty hides it. */\n    label: \"\",\n    arrivals: arrivalsEntry(),\n  },\n  // A node made of markers would otherwise hug them.\n  defaults: { width: \"fill\", height: \"fill\" },\n  children: (state) => {\n    const tickPad = insetsOps.resolve(state.axis.tickPadding).top;\n    const titlePad = insetsOps.resolve(state.axis.titlePadding).top;\n\n    const column: Node2D[] = [];\n    // The column's parent is the axis, whose box the markers are placed in.\n    const box = () => (column[0]?.parent as Node2D | null | undefined)?.layoutBounds ?? { width: 0, height: 0 };\n    const sorted = () => [...state.markers].sort((a, b) => a - b);\n    const fracAt = (value: number | undefined) => {\n      if (value === undefined) return 0;\n      const [min, max] = state.range;\n      return max <= min ? 0 : (value - min) / (max - min);\n    };\n\n    const markers = state.markers.map((_, i) => {\n      const marker: Node2D = new Text({\n        ...textOps.styleProps(state.axis.labelStyle),\n        text: () => {\n          const value = sorted()[i];\n          return value === undefined ? \"\" : markerCaption(state, value);\n        },\n        x: () => {\n          const width = box().width;\n          const centred = (fracAt(sorted()[i]) - 0.5) * width;\n          // Held inside the right edge, the chart's own: the last marker is centred on the last grid line, so half of it would fall outside the box. The left edge has the vertical axis's gutter beyond it.\n          const limit = width / 2 - marker.layoutBounds.width / 2;\n          return Math.min(centred, limit);\n        },\n        opacity: () => arrivalOf(state.arrivals, i).opacity,\n        y: () => arrivalOf(state.arrivals, i).shift,\n      });\n      return marker;\n    });\n\n    const children: Node2D[] = [\n      new Rect({ width: \"fill\", height: \"hug\", padding: { top: tickPad }, children: markers }),\n    ];\n    if (state.label !== \"\") {\n      children.push(\n        new Text({\n          ...textOps.styleProps(state.axis.titleStyle),\n          text: state.label,\n          opacity: () => arrivalOf(state.arrivals, \"label\").opacity,\n          y: () => arrivalOf(state.arrivals, \"label\").shift,\n        }),\n      );\n    }\n\n    column.push(new Rect({ flow: \"vertical\", gap: titlePad, height: \"hug\", width: \"fill\", children }));\n    return asParts(column);\n  },\n  commands: {\n    /** Stagger markers in left to right, then the caption. The duration is the whole entrance ({@link enterBudget}). */\n    enter: {\n      args: {\n        stagger: Types.custom<number | undefined>(undefined),\n        slide: Types.number(SLIDE),\n      },\n      run: (timeline, state) => {\n        const { stagger, slide } = timeline.args;\n        const count = state.markers.length;\n        const captioned = state.label !== \"\";\n        const from: Arrival = { opacity: 0, shift: slide };\n        const keys = [...state.markers.keys(), ...(captioned ? [\"label\"] : [])];\n        const arm = timeline.animate(() => ({ arrivals: armed(keys, from) }));\n        if (count === 0) return arm;\n        const { step, per, caption } = enterBudget(timeline.duration, count, captioned, stagger);\n        const ease = frameEase(timeline);\n        const markers = state.markers.map((_, i) => ({ at: i * step, duration: per, piece: arrival(timeline, i, from, ease) }));\n        const label = captioned ? [{ at: (count - 1) * step + per, duration: caption, piece: arrival(timeline, \"label\", from, ease) }] : [];\n        return timeline.together([arm, beats(timeline, [...markers, ...label])]);\n      },\n    },\n  },\n});\n\nexport type HorizontalAxis = NodeOf<typeof HorizontalAxis>;\n"]}

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

@@ -1,17 +1,5 @@
-/**
- * The line chart: a cartesian plot with a traced polyline, spotlit regions and
- * a staggered entrance.
- *
- * {@link LineChart} composes the parts below plus the shared ones in the kit
- * (the plot panel, the value axis, the legend); each part is exported too, so
- * another node type can reuse one on its own.
- *
- * These files are what a copy of the line chart takes (`registry.json`). Everything they reach for
- * that is *not* here comes from the kit and stays a dependency — see
- * `../engine.ts` for why that line is where it is.
- */
 export { LineChart, lineChartDomains } from "./line-chart.js";
-export type { LineChartDomains, LineChartProps, LineChartValues } from "./line-chart.js";
+export type { LineChartDomains, LineChartValues } from "./line-chart.js";
 export { ChartRegion } from "./chart-region.js";
 export { ChartLine } from "./chart-line.js";
 export { HorizontalAxis } from "./horizontal-axis.js";

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;;;;;;;;;;;GAWG;AACH,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,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,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"}

package/dist/line-chart/index.js

@@ -1,15 +1,3 @@
-/**
- * The line chart: a cartesian plot with a traced polyline, spotlit regions and
- * a staggered entrance.
- *
- * {@link LineChart} composes the parts below plus the shared ones in the kit
- * (the plot panel, the value axis, the legend); each part is exported too, so
- * another node type can reuse one on its own.
- *
- * These files are what a copy of the line chart takes (`registry.json`). Everything they reach for
- * that is *not* here comes from the kit and stays a dependency — see
- * `../engine.ts` for why that line is where it is.
- */
 export { LineChart, lineChartDomains } from "./line-chart.js";
 export { ChartRegion } from "./chart-region.js";
 export { ChartLine } from "./chart-line.js";

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/line-chart/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AACH,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":["/**\n * The line chart: a cartesian plot with a traced polyline, spotlit regions and\n * a staggered entrance.\n *\n * {@link LineChart} composes the parts below plus the shared ones in the kit\n * (the plot panel, the value axis, the legend); each part is exported too, so\n * another node type can reuse one on its own.\n *\n * These files are what a copy of the line chart takes (`registry.json`). Everything they reach for\n * that is *not* here comes from the kit and stays a dependency — see\n * `../engine.ts` for why that line is where it is.\n */\nexport { LineChart, lineChartDomains } from \"./line-chart\"\nexport type { LineChartDomains, LineChartProps, 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,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"]}

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

@@ -1,46 +1,10 @@
-import { type DataRecord, type NodeOf, type Node2D, type Node2DProps } from "@motionscript/sdk";
-import { type AxisDomainConfig, type Range } from "../kit/shared.js";
+import { type DataRecord, type NodeOf, type Node2D, type Node2DProps as _Node2DProps } from "@motionscript/sdk";
+import { type AxisDomainConfig, type ResolvedAxisDomain } from "../kit/shared.js";
 import { type ChartConfig, type ChartTheme, type LineSeries, type PlotRegion } from "./shared.js";
-export interface LineChartProps extends Node2DProps {
-    /** One row per sample — a plain record of field name to value. */
-    data: DataRecord[];
-    /**
-     * Key into each row for its x value, shared by every series. Named `xField`
-     * rather than `x` because every node already has an `x` — its position.
-     */
-    xField: string;
-    /** One polyline per entry: which field it plots, its legend `label`, its `fill`. */
-    series: LineSeries[];
-    /** X-axis data domain: caption, scale range, and tick placement. */
-    xAxis?: AxisDomainConfig;
-    /** Y-axis data domain: caption, scale range, and tick placement. */
-    yAxis?: AxisDomainConfig;
-    /**
-     * A slice of the plot to spotlight, in **data units**. Dashed rules mark the
-     * bounded edges and every series fades outside the box — see
-     * `spotlightRegion`, which animates the same thing. `null` (the default) is no
-     * region.
-     */
-    region?: PlotRegion | null;
-    /**
-     * The chart's visual theme — series palette, axis text/grid/gutters, plot
-     * panel paint, and legend styling. Every branch is optional and deep-merged
-     * onto {@link DEFAULT_CHART_THEME}, so pass only what you want to override.
-     */
-    theme?: ChartTheme;
-    /** Whether the legend row below the plot is drawn at all. */
-    showLegend?: boolean;
-}
 /** Both axes' domains with their ranges and ticks resolved. */
 export interface LineChartDomains {
-    readonly x: AxisDomainConfig & {
-        readonly range: Range;
-        readonly ticks: number[];
-    };
-    readonly y: AxisDomainConfig & {
-        readonly range: Range;
-        readonly ticks: number[];
-    };
+    readonly x: ResolvedAxisDomain;
+    readonly y: ResolvedAxisDomain;
 }
 /** What a line chart plots, as its entries hold it. */
 export interface LineChartValues {
@@ -50,34 +14,17 @@ export interface LineChartValues {
     readonly xAxis: AxisDomainConfig;
     readonly yAxis: AxisDomainConfig;
 }
-/** Both axes as a line chart draws them now, an auto range or tick row read back as itself. */
+/** Both axes as drawn now. */
 export declare function lineChartDomains(s: LineChartValues): LineChartDomains;
 /**
- * A multi-series line chart, composed from five independent parts rather than
- * one monolithic draw:
- *
- * - {@link ChartCanvas} — the plot panel with a two-way grid, under everything.
- * - {@link VerticalAxis} / {@link HorizontalAxis} — columns/rows of real text
- *   markers that stagger in, each carrying its own axis caption.
- * - {@link ChartRegion} — the optional call-out marking a spotlit slice of the
- *   plot: dashed rules on its bounded edges, and every series faded outside it.
- * - {@link ChartLine} (one per series) — the traced polylines over the canvas.
- * - {@link ChartLegend} — a row of entries below the chart, one per series.
- *
- * Every part reads the chart's entries through bindings, and the lines, the
- * region and the grid all map against the plot panel's own laid-out box, so
- * points land exactly on their markers and the chart re-flows if its box
- * changes.
- *
- * **Resting state is the finished chart**: an editor paints a node's Initial
- * state on a paused canvas. `enter` arms every part on its first frame.
+ * 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.
  *
- * Past the entrance, `showSeries`/`hideSeries`/`spotlightSeries` pick out a
- * *series*, `spotlightRegion` marks a *slice of the plot* without changing the
- * scale, and `zoomTo` rescales the axes so a slice fills the plot. A spotlit
- * region resolves against the live scales, so it travels with a zoom. A `to` of
- * an axis `range` or `ticks` tweens from the domain as drawn (see
- * {@link lerpAxisEntry}), so an auto axis rescales continuously.
+ * 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
+ * (see {@link lerpAxisEntry}), so an auto axis rescales continuously.
  */
 export declare const LineChart: import("@motionscript/sdk").Component<"lineChart", import("@motionscript/sdk").Merge<import("@motionscript/sdk").Box2DState, {
     readonly data: import("@motionscript/sdk").Type<DataRecord[], DataRecord[], false>;
@@ -86,24 +33,13 @@ export declare const LineChart: import("@motionscript/sdk").Component<"lineChart
     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>;
-    /**
-     * The spotlit slice of the plot in data units, or `null` for none. The box
-     * snaps; the animation is {@link regionReveal} drawing the rules on.
-     */
+    /** 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]`: the rules grow out and
-     * the wash fades up as it climbs, while every line's out-of-region stretch
-     * fades to the theme's `region.dimOpacity`.
-     */
+    /** How far the `region` call-out is drawn in, `[0, 1]`: rules grow, wash fades up, out-of-region stretches fade to `region.dimOpacity`. */
     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 the chart as it
-     * stood, auto-derived ticks included. Cleared by `resetZoom`, so the next zoom
-     * remembers wherever the chart rests then.
-     */
+    /** The domain `zoomTo` first left, so `resetZoom` restores it, auto-derived ticks included. */
     readonly home: import("@motionscript/sdk").Type<LineChartDomains | null, LineChartDomains | null, false>;
 }>, {
     readonly enter: {};
@@ -124,31 +60,20 @@ export declare const LineChart: import("@motionscript/sdk").Component<"lineChart
     readonly spotlightSeries: {
         readonly seriesIndex: import("@motionscript/sdk").Type<number, number, false>;
     };
-}, readonly [], Node2D<Node2DProps>, import("@motionscript/sdk").CallProps<import("@motionscript/sdk").Merge<import("@motionscript/sdk").Box2DState, {
+}, readonly [], Node2D<_Node2DProps>, import("@motionscript/sdk").CallProps<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>;
     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>;
-    /**
-     * The spotlit slice of the plot in data units, or `null` for none. The box
-     * snaps; the animation is {@link regionReveal} drawing the rules on.
-     */
+    /** 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]`: the rules grow out and
-     * the wash fades up as it climbs, while every line's out-of-region stretch
-     * fades to the theme's `region.dimOpacity`.
-     */
+    /** How far the `region` call-out is drawn in, `[0, 1]`: rules grow, wash fades up, out-of-region stretches fade to `region.dimOpacity`. */
     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 the chart as it
-     * stood, auto-derived ticks included. Cleared by `resetZoom`, so the next zoom
-     * remembers wherever the chart rests then.
-     */
+    /** The domain `zoomTo` first left, so `resetZoom` restores it, auto-derived ticks included. */
     readonly home: import("@motionscript/sdk").Type<LineChartDomains | null, LineChartDomains | null, false>;
 }>, readonly [], import("@motionscript/sdk").BuiltNode<import("@motionscript/sdk").Merge<import("@motionscript/sdk").Box2DState, {
     readonly data: import("@motionscript/sdk").Type<DataRecord[], DataRecord[], false>;
@@ -157,24 +82,13 @@ export declare const LineChart: import("@motionscript/sdk").Component<"lineChart
     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>;
-    /**
-     * The spotlit slice of the plot in data units, or `null` for none. The box
-     * snaps; the animation is {@link regionReveal} drawing the rules on.
-     */
+    /** 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]`: the rules grow out and
-     * the wash fades up as it climbs, while every line's out-of-region stretch
-     * fades to the theme's `region.dimOpacity`.
-     */
+    /** How far the `region` call-out is drawn in, `[0, 1]`: rules grow, wash fades up, out-of-region stretches fade to `region.dimOpacity`. */
     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 the chart as it
-     * stood, auto-derived ticks included. Cleared by `resetZoom`, so the next zoom
-     * remembers wherever the chart rests then.
-     */
+    /** The domain `zoomTo` first left, so `resetZoom` restores it, auto-derived ticks included. */
     readonly home: import("@motionscript/sdk").Type<LineChartDomains | null, LineChartDomains | null, false>;
 }>, {
     readonly enter: {};
@@ -195,6 +109,6 @@ export declare const LineChart: import("@motionscript/sdk").Component<"lineChart
     readonly spotlightSeries: {
         readonly seriesIndex: import("@motionscript/sdk").Type<number, number, false>;
     };
-}, Node2D<Node2DProps>>>>;
+}, Node2D<_Node2DProps>>>>;
 export type LineChart = NodeOf<typeof LineChart>;
 //# 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,EAEf,KAAK,MAAM,EAEX,KAAK,MAAM,EACX,KAAK,WAAW,EAIjB,MAAM,mBAAmB,CAAA;AAU1B,OAAO,EAWL,KAAK,gBAAgB,EACrB,KAAK,KAAK,EACX,MAAM,eAAe,CAAA;AAItB,OAAO,EAOL,KAAK,WAAW,EAChB,KAAK,UAAU,EACf,KAAK,UAAU,EACf,KAAK,UAAU,EAEhB,MAAM,UAAU,CAAA;AAGjB,MAAM,WAAW,cAAe,SAAQ,WAAW;IACjD,kEAAkE;IAClE,IAAI,EAAE,UAAU,EAAE,CAAA;IAClB;;;OAGG;IACH,MAAM,EAAE,MAAM,CAAA;IACd,oFAAoF;IACpF,MAAM,EAAE,UAAU,EAAE,CAAA;IACpB,oEAAoE;IACpE,KAAK,CAAC,EAAE,gBAAgB,CAAA;IACxB,oEAAoE;IACpE,KAAK,CAAC,EAAE,gBAAgB,CAAA;IACxB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,UAAU,GAAG,IAAI,CAAA;IAC1B;;;;OAIG;IACH,KAAK,CAAC,EAAE,UAAU,CAAA;IAClB,6DAA6D;IAC7D,UAAU,CAAC,EAAE,OAAO,CAAA;CACrB;AAED,+DAA+D;AAC/D,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,CAAC,CAAC,EAAE,gBAAgB,GAAG;QAAE,QAAQ,CAAC,KAAK,EAAE,KAAK,CAAC;QAAC,QAAQ,CAAC,KAAK,EAAE,MAAM,EAAE,CAAA;KAAE,CAAA;IAClF,QAAQ,CAAC,CAAC,EAAE,gBAAgB,GAAG;QAAE,QAAQ,CAAC,KAAK,EAAE,KAAK,CAAC;QAAC,QAAQ,CAAC,KAAK,EAAE,MAAM,EAAE,CAAA;KAAE,CAAA;CACnF;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;AA4ED,+FAA+F;AAC/F,wBAAgB,gBAAgB,CAAC,CAAC,EAAE,eAAe,GAAG,gBAAgB,CAYrE;AAoGD;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,eAAO,MAAM,SAAS;;;;;;;IASlB;;;OAGG;;IAEH;;;;OAIG;;IAEH,oFAAoF;;IAEpF;;;;OAIG;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAjBH;;;OAGG;;IAEH;;;;OAIG;;IAEH,oFAAoF;;IAEpF;;;;OAIG;;;;;;;;;IAjBH;;;OAGG;;IAEH;;;;OAIG;;IAEH,oFAAoF;;IAEpF;;;;OAIG;;;;;;;;;;;;;;;;;;;;;yBA4PL,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,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"}