@motionscript/charts 0.1.0-alpha.0 → 0.1.0-alpha.10

package/dist/kit/chart-legend.js

@@ -1,212 +1,163 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-import { Rect, Text, command, easeOut, property, textOps, } from "@motionscript/core";
-import { drive, hold, together } from "@motionscript/core/component";
+import { Flow, Paint, Rect, Shapes, Text, Types, component2d, textOps, } from "@motionscript/sdk";
+import { fresh } from "./entries.js";
+import { frameEase } from "./motion.js";
 import { DEFAULT_LEGEND, SPOTLIGHT_DIM, } from "./shared.js";
+/** A row's entries are a `Rect`'s: paint, the flow of its children, its corners. */
+const row = { ...Paint.state, ...Flow.state, ...Shapes.corners };
+/**
+ * One legend entry. It hugs its caption and swatch; `shown` scales that width
+ * from nothing to the whole of it.
+ *
+ * The width is taken from the content on every measure, at any reveal, so a frame
+ * never depends on whether the entry was once seen fully shown. A collapse needs a
+ * number to scale, and `"hug"` is not one until something measures it — this is
+ * the something.
+ */
+const LegendEntry = component2d({
+    key: "legendEntry",
+    state: { ...row, shown: Types.number(1) },
+    commands: { ...Paint.commands },
+    measure: (measurer, state, children) => {
+        const size = Flow.measure(measurer, state, children, Paint.inset(state));
+        return state.shown >= 1 ? size : { ...size, width: state.shown * size.width };
+    },
+    layout: (box, state, children) => Flow.layout(box, state, children, Paint.inset(state)),
+    render: (ctx, state) => Paint.draw(ctx, state, Shapes.rect(ctx.size, state)),
+});
+/**
+ * How far each entry is shown, written whole (a document, a `set`) or one
+ * entry at a time (a command, as `{ [index]: reveal }`), which leaves the others
+ * as the frame left them — so two series moving at once each move their own.
+ */
+function revealOf(value, previous) {
+    if (Array.isArray(value))
+        return value;
+    const next = [...(previous ?? [])];
+    for (const [index, reveal] of Object.entries(value))
+        next[Number(index)] = reveal;
+    return next;
+}
 /**
  * The legend of a chart: a **horizontal-flow row of entries**, one per series, laid out
  * left-to-right with the theme's `itemGap`. Each entry pairs the series label
  * with a rounded colour swatch; only the swatch carries the series colour, the
  * caption reads in the legend's neutral ink.
  *
- * {@link showSeries}/{@link hideSeries} flip a series on or off — showing one
- * adds its entry back into the row at its stable series position and grows it
- * in, hiding one shrinks it away and removes it. So the row only ever holds the
- * currently-enabled series, in series order, and closes the gap when one leaves.
+ * `showSeries`/`hideSeries` flip a series on or off — showing one grows its
+ * entry back in at its stable series position, hiding one shrinks it away. So
+ * the row only ever shows the currently-enabled series, in series order, and
+ * closes the gap when one leaves.
  *
  * This node *is* the row, so the parent places it (centred below the chart) and
  * it hugs its entries.
  */
-export class ChartLegend extends Rect {
-    /** One entry per series. **Every** entry is a child — see {@link reveal}. */
-    items = [];
-    /**
-     * How far each entry is shown, `0`–`1`. Drives its width, opacity and gap
-     * together, so `0` is an entry that takes no room and `1` is one at its
-     * natural size.
-     *
-     * This replaces adding and removing the entry from the row, which is what
-     * `showSeries`/`hideSeries` used to do. That could not be a command: a command
-     * is asked what it looks like at a time, and "is this node a child" is not a
-     * value a time can produce — the tree either contains it or it doesn't, and
-     * getting there means having run the add. Collapsed-but-present is the same
-     * picture reached by a route that *is* a function of `t`.
-     *
-     * A plain array rather than reactive props because the count is the series
-     * count, which is data. The entries' props are bound to it, so writing one
-     * still moves the layout.
-     */
-    reveal = [];
-    /**
-     * Each entry's natural width, last time it was fully shown.
-     *
-     * A collapse needs numeric endpoints — `lerpSizeInput` snaps between a token
-     * and a number rather than interpolating — and `"hug"` is not a number until
-     * something measures it. Refreshed on every frame an entry is at full reveal
-     * (see {@link widthFor}), so it is current by the time a hide starts, and it
-     * tracks a relabelled series or a restyled legend without being told.
-     */
-    natural = [];
-    constructor(props) {
-        // `flow` after the spread, with the rest of the geometry: this class *is*
-        // the row, so the direction is its own answer and not the caller's. It has
-        // to be stated — a `Rect` given no flow lays its children out `freeform`,
-        // which stacks every entry on the same spot. One series looks perfect that
-        // way and three look like one smeared caption, so the failure only shows up
-        // on the charts that most need a legend.
-        super({
-            ...props,
+export const ChartLegend = component2d({
+    key: "chartLegend",
+    state: {
+        ...row,
+        series: fresh(() => []),
+        swatches: fresh(() => []),
+        legend: Types.custom(DEFAULT_LEGEND),
+        /**
+         * How far each entry is shown, `0`–`1`. Drives its width, opacity and gap
+         * together, so `0` is an entry that takes no room and `1` is one at its
+         * natural size.
+         *
+         * This replaces adding and removing the entry from the row: a command is
+         * asked what it looks like at a time, and "is this node a child" is not a
+         * value a time can produce. Collapsed-but-present is the same picture reached
+         * by a route that *is* a function of `t`.
+         */
+        reveal: fresh(() => [], { resolve: revealOf }),
+    },
+    // This node *is* the row, so the direction is its own answer. It has to be
+    // stated — a `Rect` given no flow lays its children out `freeform`, which
+    // stacks every entry on the same spot. The gap and padding are the theme's.
+    defaults: {
+        flow: "horizontal",
+        width: "hug",
+        height: "hug",
+        gap: (state) => state.legend.itemGap,
+        padding: (state) => state.legend.padding,
+        reveal: (state) => state.series.map((s) => ((s.enabled ?? true) ? 1 : 0)),
+    },
+    // One entry per series, in series order, every one a child for good: order is
+    // fixed rather than depending on which siblings happen to be shown, so an entry
+    // always comes back where it belongs.
+    children: (state) => {
+        const marker = state.legend.markerStyle;
+        return state.series.map((series, index) => LegendEntry({
             flow: "horizontal",
+            gap: 12,
             align: "center",
             width: "hug",
             height: "hug",
-        });
-        // Structure is one entry per series, so it's composed here from the resolved
-        // props super() applied. Fixed row geometry last, so it wins over super().
-        this.set({ gap: this.legend.itemGap, padding: this.legend.padding });
-        this.reveal = this.series.map((s) => ((s.enabled ?? true) ? 1 : 0));
-        this.natural = this.series.map(() => 0);
-        this.items = this.series.map((s, i) => this.buildItem(s, i));
-        // All of them, in series order. Order is now fixed rather than depending on
-        // which siblings happen to be shown, so an entry always comes back where it
-        // belongs and `insertionIndex` has nothing left to compute.
-        for (const item of this.items)
-            this.add(item);
-    }
-    /**
-     * An entry's width for its current reveal.
-     *
-     * `"hug"` at full reveal rather than the pinned number, so a shown entry stays
-     * responsive to its own content; the number only takes over while it is
-     * collapsing, which is the only time a token cannot express it.
-     *
-     * Records the natural width as a side effect, which is the honest place for it:
-     * this runs inside a binding, so it is already reading the layout every frame,
-     * and the value it wants is the one the layout just produced. It writes a plain
-     * array rather than a signal, so nothing is invalidated by it.
-     */
-    widthFor(index) {
-        const shown = this.reveal[index] ?? 0;
-        if (shown >= 1) {
-            const measured = this.items[index]?.measuredWidth ?? 0;
-            if (measured > 0)
-                this.natural[index] = measured;
-            return "hug";
-        }
-        return shown * (this.natural[index] ?? 0);
-    }
-    /** One entry: the series caption beside its colour swatch. */
-    buildItem(series, index) {
-        const marker = this.legend.markerStyle;
-        const item = new Rect({ flow: "horizontal",
-            gap: 12,
-            align: "center",
             // Bound to the reveal, so showing and hiding is a number moving rather
-            // than a child arriving and leaving.
-            width: () => this.widthFor(index),
-            opacity: () => this.reveal[index] ?? 0,
-            height: "hug",
+            // than a child arriving and leaving. The width follows it in `measure`,
+            // and the flanking gap closes with the entry rather than snapping.
+            opacity: () => state.reveal[index] ?? 0,
+            gapScale: () => state.reveal[index] ?? 0,
+            shown: () => state.reveal[index] ?? 0,
             children: [
-                new Text({
-                    ...textOps.styleProps(this.legend.textStyle),
-                    text: series.label,
-                }),
-                new Rect({
+                Text({ ...textOps.styleProps(state.legend.textStyle), text: series.label }),
+                Rect({
                     width: marker.width,
                     height: marker.height,
                     cornerRadius: marker.borderRadius,
-                    fill: this.swatches[index] ?? "white",
+                    fill: state.swatches[index] ?? "white",
                     stroke: marker.stroke,
                     shadow: marker.shadow,
                 }),
             ],
-        });
-        // `gapScale` is a `Node` prop rather than a container one, so it is bound here
-        // instead of in the config. It tracks the reveal so the flanking gap closes
-        // with the entry rather than snapping when it reaches zero.
-        item.set({ gapScale: () => this.reveal[index] ?? 0 });
-        return item;
-    }
-    /** True if series `index` is showing at all — see {@link reveal}. */
-    isEnabled(index) {
-        return (this.reveal[index] ?? 0) > 0;
-    }
-    /**
-     * Grow series `index`'s entry back in at its series-order position, the
-     * siblings sliding over to make room.
-     *
-     * A reveal tween rather than an animated `addChildAt`. The entry never left —
-     * see {@link reveal} — so there is no add to have happened, and the whole
-     * thing is a function of `t`.
-     */
-    showSeries(args) {
-        const { index = 0 } = args.data ?? {};
-        return this.revealTo(index, 1, args.duration ?? 0.35, args.easing ?? easeOut());
-    }
-    /**
-     * Shrink series `index`'s entry away, the gap closing behind it — the mirror
-     * of {@link showSeries}.
-     */
-    hideSeries(args) {
-        const { index = 0 } = args.data ?? {};
-        return this.revealTo(index, 0, args.duration ?? 0.35, args.easing ?? easeOut());
-    }
-    /**
-     * Ramp one entry's reveal to `target`.
-     *
-     * `from` is read when the command is built, which for a driven scene is with
-     * the node in the state its own start time implies — so a hide that follows a
-     * show starts where the show left it rather than at whatever the node happens
-     * to hold now.
-     */
-    revealTo(index, target, duration, easing) {
-        if (this.items[index] === undefined)
-            return hold(duration);
-        const from = this.reveal[index] ?? 0;
-        return drive(duration, (t) => {
-            this.reveal[index] = from + (target - from) * easing(t);
-        });
-    }
-    /**
-     * Dim every entry but series `index` to {@link SPOTLIGHT_DIM} and bring that
-     * one back to full — the legend half of a chart's `spotlightSeries`. Entries
-     * stay in place; only their opacity moves, so the row doesn't reflow.
-     *
-     * Only the currently-shown entries are touched — a hidden series' entry is
-     * left as {@link hideSeries} left it.
-     */
-    spotlightSeries(args) {
-        const { index = 0 } = args.data ?? {};
-        const duration = args.duration ?? 0.35;
-        const easing = args.easing ?? easeOut();
-        // Opacity only, on entries that are already in the row — no membership
-        // changes, so unlike {@link showSeries} this is a plain function of `t`.
-        return together(...this.items
-            .map((item, i) => ({ item, i }))
-            .filter(({ i }) => this.isEnabled(i))
-            .map(({ item, i }) => item.to({ data: { opacity: i === index ? 1 : SPOTLIGHT_DIM }, duration, easing })));
-    }
+        }));
+    },
+    commands: {
+        ...Paint.commands,
+        /**
+         * Grow series `index`'s entry back in at its series-order position, the
+         * siblings sliding over to make room. A reveal tween rather than an animated
+         * `addChildAt`: the entry never left, so the whole thing is a function of `t`.
+         */
+        showSeries: {
+            args: { index: Types.number(0, { min: 0, step: 1 }) },
+            // An index that is not a series takes its slot and moves nothing.
+            run: (timeline, state) => (timeline.args.index in state.series
+                ? timeline.animate(revealFrame(state, timeline.args.index, 1, frameEase(timeline)))
+                : timeline.wait(timeline.duration)),
+        },
+        /** Shrink series `index`'s entry away, the gap closing behind it — the mirror of `showSeries`. */
+        hideSeries: {
+            args: { index: Types.number(0, { min: 0, step: 1 }) },
+            run: (timeline, state) => (timeline.args.index in state.series
+                ? timeline.animate(revealFrame(state, timeline.args.index, 0, frameEase(timeline)))
+                : timeline.wait(timeline.duration)),
+        },
+        /**
+         * Dim every entry but series `index` to {@link SPOTLIGHT_DIM} and bring that
+         * one back to full — the legend half of a chart's `spotlightSeries`. Entries
+         * stay in place; only their opacity moves, so the row doesn't reflow. Only
+         * the entries shown when it is built are touched: a hidden series' entry is
+         * left as `hideSeries` left it.
+         */
+        spotlightSeries: {
+            args: { index: Types.number(0, { min: 0, step: 1 }) },
+            run: (timeline, state, children) => timeline.together(children.flatMap((entry, i) => (state.reveal[i] ?? 0) > 0 ? [entry.to({ opacity: i === timeline.args.index ? 1 : SPOTLIGHT_DIM })] : [])),
+        },
+    },
+    measure: (measurer, state, children) => Flow.measure(measurer, state, children, Paint.inset(state)),
+    layout: (box, state, children) => Flow.layout(box, state, children, Paint.inset(state)),
+    render: (ctx, state) => Paint.draw(ctx, state, Shapes.rect(ctx.size, state)),
+});
+/**
+ * One entry's reveal ramping to `target` from where the command finds it — so a
+ * hide that follows a show starts where the show left it.
+ */
+function revealFrame(state, index, target, ease) {
+    const from = state.reveal[index] ?? 0;
+    return (t) => ({ reveal: { [index]: from + (target - from) * ease(t) } });
+}
+/** Whether series `index` is showing at all on `legend`. */
+export function legendShows(legend, index) {
+    return (legend.reveal[index] ?? 0) > 0;
 }
-__decorate([
-    property({ default: () => [] })
-], ChartLegend.prototype, "series", void 0);
-__decorate([
-    property({ default: () => [] })
-], ChartLegend.prototype, "swatches", void 0);
-__decorate([
-    property({ default: DEFAULT_LEGEND })
-], ChartLegend.prototype, "legend", void 0);
-__decorate([
-    command()
-], ChartLegend.prototype, "showSeries", null);
-__decorate([
-    command()
-], ChartLegend.prototype, "hideSeries", null);
-__decorate([
-    command()
-], ChartLegend.prototype, "spotlightSeries", null);
 //# sourceMappingURL=chart-legend.js.map

package/dist/kit/chart-legend.js.map

@@ -1 +1 @@
-{"version":3,"file":"chart-legend.js","sourceRoot":"","sources":["../../src/kit/chart-legend.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  Rect,\n  Text,\n  command,\n  easeOut,\n  property,\n  textOps,\n  type CommandArgs,\n  type EasingFunction,\n  type Fill,\n  type NodeConfig,\n  type RectProps,\n} from \"@motionscript/core\"\n\nimport { drive, hold, together, type Seekable } from \"@motionscript/core/component\"\n\nimport {\n  DEFAULT_LEGEND,\n  SPOTLIGHT_DIM,\n  type ChartSeries,\n  type LegendConfig,\n} from \"./shared\"\n\nexport interface ChartLegendProps extends RectProps {\n  /**\n   * One entry per series: legend `label`, its `enabled` default, and — through\n   * {@link ChartLegendProps.swatches} — the colour its chip is painted. A series\n   * that starts enabled (the default) is added to the row up front; one that\n   * starts `false` is hidden until a later {@link ChartLegend.showSeries}.\n   */\n  series: ChartSeries[]\n  /**\n   * The swatch colour for each series, by index — resolved by the chart, whose\n   * business it is whether a series' colour comes out of a stroke palette (a\n   * line) or a fill palette (a bar). Shorter than the series list means the\n   * missing entries fall back to white.\n   */\n  swatches: Fill[]\n  /** Padding, caption style, gaps, and swatch geometry — see {@link LegendConfig}. */\n  legend: LegendConfig\n}\n\n/**\n * The legend of a chart: a **horizontal-flow row of entries**, one per series, laid out\n * left-to-right with the theme's `itemGap`. Each entry pairs the series label\n * with a rounded colour swatch; only the swatch carries the series colour, the\n * caption reads in the legend's neutral ink.\n *\n * {@link showSeries}/{@link hideSeries} flip a series on or off — showing one\n * adds its entry back into the row at its stable series position and grows it\n * in, hiding one shrinks it away and removes it. So the row only ever holds the\n * currently-enabled series, in series order, and closes the gap when one leaves.\n *\n * This node *is* the row, so the parent places it (centred below the chart) and\n * it hugs its entries.\n */\nexport class ChartLegend extends Rect {\n  @property({ default: () => [] as ChartSeries[] }) declare series: ChartSeries[]\n  @property({ default: () => [] as Fill[] }) declare swatches: Fill[]\n  @property({ default: DEFAULT_LEGEND }) declare legend: LegendConfig\n\n  /** One entry per series. **Every** entry is a child — see {@link reveal}. */\n  private items: Rect[] = []\n  /**\n   * How far each entry is shown, `0`–`1`. Drives its width, opacity and gap\n   * together, so `0` is an entry that takes no room and `1` is one at its\n   * natural size.\n   *\n   * This replaces adding and removing the entry from the row, which is what\n   * `showSeries`/`hideSeries` used to do. That could not be a command: a command\n   * is asked what it looks like at a time, and \"is this node a child\" is not a\n   * value a time can produce — the tree either contains it or it doesn't, and\n   * getting there means having run the add. Collapsed-but-present is the same\n   * picture reached by a route that *is* a function of `t`.\n   *\n   * A plain array rather than reactive props because the count is the series\n   * count, which is data. The entries' props are bound to it, so writing one\n   * still moves the layout.\n   */\n  private reveal: number[] = []\n  /**\n   * Each entry's natural width, last time it was fully shown.\n   *\n   * A collapse needs numeric endpoints — `lerpSizeInput` snaps between a token\n   * and a number rather than interpolating — and `\"hug\"` is not a number until\n   * something measures it. Refreshed on every frame an entry is at full reveal\n   * (see {@link widthFor}), so it is current by the time a hide starts, and it\n   * tracks a relabelled series or a restyled legend without being told.\n   */\n  private natural: number[] = []\n\n  constructor(props?: NodeConfig<ChartLegend, ChartLegendProps>) {\n    // `flow` after the spread, with the rest of the geometry: this class *is*\n    // the row, so the direction is its own answer and not the caller's. It has\n    // to be stated — a `Rect` given no flow lays its children out `freeform`,\n    // which stacks every entry on the same spot. One series looks perfect that\n    // way and three look like one smeared caption, so the failure only shows up\n    // on the charts that most need a legend.\n    super({\n      ...(props as RectProps),\n      flow: \"horizontal\",\n      align: \"center\",\n      width: \"hug\",\n      height: \"hug\",\n    })\n\n    // Structure is one entry per series, so it's composed here from the resolved\n    // props super() applied. Fixed row geometry last, so it wins over super().\n    this.set({ gap: this.legend.itemGap, padding: this.legend.padding })\n\n    this.reveal = this.series.map((s) => ((s.enabled ?? true) ? 1 : 0))\n    this.natural = this.series.map(() => 0)\n    this.items = this.series.map((s, i) => this.buildItem(s, i))\n\n    // All of them, in series order. Order is now fixed rather than depending on\n    // which siblings happen to be shown, so an entry always comes back where it\n    // belongs and `insertionIndex` has nothing left to compute.\n    for (const item of this.items) this.add(item)\n  }\n\n  /**\n   * An entry's width for its current reveal.\n   *\n   * `\"hug\"` at full reveal rather than the pinned number, so a shown entry stays\n   * responsive to its own content; the number only takes over while it is\n   * collapsing, which is the only time a token cannot express it.\n   *\n   * Records the natural width as a side effect, which is the honest place for it:\n   * this runs inside a binding, so it is already reading the layout every frame,\n   * and the value it wants is the one the layout just produced. It writes a plain\n   * array rather than a signal, so nothing is invalidated by it.\n   */\n  private widthFor(index: number): number | \"hug\" {\n    const shown = this.reveal[index] ?? 0\n    if (shown >= 1) {\n      const measured = this.items[index]?.measuredWidth ?? 0\n      if (measured > 0) this.natural[index] = measured\n      return \"hug\"\n    }\n    return shown * (this.natural[index] ?? 0)\n  }\n\n  /** One entry: the series caption beside its colour swatch. */\n  private buildItem(series: ChartSeries, index: number): Rect {\n    const marker = this.legend.markerStyle\n    const item = new Rect({ flow: \"horizontal\",\n      gap: 12,\n      align: \"center\",\n      // Bound to the reveal, so showing and hiding is a number moving rather\n      // than a child arriving and leaving.\n      width: () => this.widthFor(index),\n      opacity: () => this.reveal[index] ?? 0,\n      height: \"hug\",\n      children: [\n        new Text({\n          ...textOps.styleProps(this.legend.textStyle),\n          text: series.label,\n        }),\n        new Rect({\n          width: marker.width,\n          height: marker.height,\n          cornerRadius: marker.borderRadius,\n          fill: this.swatches[index] ?? \"white\",\n          stroke: marker.stroke,\n          shadow: marker.shadow,\n        }),\n      ],\n    })\n    // `gapScale` is a `Node` prop rather than a container one, so it is bound here\n    // instead of in the config. It tracks the reveal so the flanking gap closes\n    // with the entry rather than snapping when it reaches zero.\n    item.set({ gapScale: () => this.reveal[index] ?? 0 })\n    return item\n  }\n\n  /** True if series `index` is showing at all — see {@link reveal}. */\n  isEnabled(index: number): boolean {\n    return (this.reveal[index] ?? 0) > 0\n  }\n\n  /**\n   * Grow series `index`'s entry back in at its series-order position, the\n   * siblings sliding over to make room.\n   *\n   * A reveal tween rather than an animated `addChildAt`. The entry never left —\n   * see {@link reveal} — so there is no add to have happened, and the whole\n   * thing is a function of `t`.\n   */\n  @command()\n  showSeries(args: CommandArgs<{ index: number }>): Seekable {\n    const { index = 0 } = args.data ?? {}\n    return this.revealTo(index, 1, args.duration ?? 0.35, args.easing ?? easeOut())\n  }\n\n  /**\n   * Shrink series `index`'s entry away, the gap closing behind it — the mirror\n   * of {@link showSeries}.\n   */\n  @command()\n  hideSeries(args: CommandArgs<{ index: number }>): Seekable {\n    const { index = 0 } = args.data ?? {}\n    return this.revealTo(index, 0, args.duration ?? 0.35, args.easing ?? easeOut())\n  }\n\n  /**\n   * Ramp one entry's reveal to `target`.\n   *\n   * `from` is read when the command is built, which for a driven scene is with\n   * the node in the state its own start time implies — so a hide that follows a\n   * show starts where the show left it rather than at whatever the node happens\n   * to hold now.\n   */\n  private revealTo(\n    index: number,\n    target: number,\n    duration: number,\n    easing: EasingFunction\n  ): Seekable {\n    if (this.items[index] === undefined) return hold(duration)\n    const from = this.reveal[index] ?? 0\n    return drive(duration, (t) => {\n      this.reveal[index] = from + (target - from) * easing(t)\n    })\n  }\n\n  /**\n   * Dim every entry but series `index` to {@link SPOTLIGHT_DIM} and bring that\n   * one back to full — the legend half of a chart's `spotlightSeries`. Entries\n   * stay in place; only their opacity moves, so the row doesn't reflow.\n   *\n   * Only the currently-shown entries are touched — a hidden series' entry is\n   * left as {@link hideSeries} left it.\n   */\n  @command()\n  spotlightSeries(args: CommandArgs<{ index: number }>): Seekable {\n    const { index = 0 } = args.data ?? {}\n    const duration = args.duration ?? 0.35\n    const easing = args.easing ?? easeOut()\n    // Opacity only, on entries that are already in the row — no membership\n    // changes, so unlike {@link showSeries} this is a plain function of `t`.\n    return together(\n      ...this.items\n        .map((item, i) => ({ item, i }))\n        .filter(({ i }) => this.isEnabled(i))\n        .map(({ item, i }) =>\n          item.to({ data: { opacity: i === index ? 1 : SPOTLIGHT_DIM }, duration, easing })\n        )\n    )\n  }\n}\n"]}
+{"version":3,"file":"chart-legend.js","sourceRoot":"","sources":["../../src/kit/chart-legend.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  Flow,\n  Paint,\n  Rect,\n  Shapes,\n  Text,\n  Types,\n  component2d,\n  textOps,\n  type Fill,\n  type NodeOf,\n  type RectProps,\n  // Named so the row's emitted type reaches the Rect surface it spreads through the sdk, not core.\n  type Alignment as _Alignment,\n  type CornerRadiusResolved as _CornerRadiusResolved,\n  type CornerStyleResolved as _CornerStyleResolved,\n  type FillResolved as _FillResolved,\n  type FlowMode as _FlowMode,\n  type FlowResolved as _FlowResolved,\n  type GapSize as _GapSize,\n  type Node2D as _Node2D,\n  type Node2DProps as _Node2DProps,\n  type RectCornerRadius as _RectCornerRadius,\n  type RectCornerStyle as _RectCornerStyle,\n  type Shadow as _Shadow,\n  type ShadowResolved as _ShadowResolved,\n  type Stroke as _Stroke,\n  type StrokeResolved as _StrokeResolved,\n  type Vector2 as _Vector2,\n} from \"@motionscript/sdk\"\n\nimport { fresh } from \"./entries\"\nimport { frameEase } from \"./motion\"\nimport {\n  DEFAULT_LEGEND,\n  SPOTLIGHT_DIM,\n  type ChartSeries,\n  type LegendConfig,\n} from \"./shared\"\n\nexport interface ChartLegendProps extends RectProps {\n  /**\n   * One entry per series: legend `label`, its `enabled` default, and — through\n   * {@link ChartLegendProps.swatches} — the colour its chip is painted. A series\n   * that starts enabled (the default) is added to the row up front; one that\n   * starts `false` is hidden until a later `showSeries`.\n   */\n  series: ChartSeries[]\n  /**\n   * The swatch colour for each series, by index — resolved by the chart, whose\n   * business it is whether a series' colour comes out of a stroke palette (a\n   * line) or a fill palette (a bar). Shorter than the series list means the\n   * missing entries fall back to white.\n   */\n  swatches: Fill[]\n  /** Padding, caption style, gaps, and swatch geometry — see {@link LegendConfig}. */\n  legend: LegendConfig\n}\n\n/** A row's entries are a `Rect`'s: paint, the flow of its children, its corners. */\nconst row = { ...Paint.state, ...Flow.state, ...Shapes.corners }\n\n/**\n * One legend entry. It hugs its caption and swatch; `shown` scales that width\n * from nothing to the whole of it.\n *\n * The width is taken from the content on every measure, at any reveal, so a frame\n * never depends on whether the entry was once seen fully shown. A collapse needs a\n * number to scale, and `\"hug\"` is not one until something measures it — this is\n * the something.\n */\nconst LegendEntry = component2d({\n  key: \"legendEntry\",\n  state: { ...row, shown: Types.number(1) },\n  commands: { ...Paint.commands },\n  measure: (measurer, state, children) => {\n    const size = Flow.measure(measurer, state, children, Paint.inset(state))\n    return state.shown >= 1 ? size : { ...size, width: state.shown * size.width }\n  },\n  layout: (box, state, children) => Flow.layout(box, state, children, Paint.inset(state)),\n  render: (ctx, state) => Paint.draw(ctx, state, Shapes.rect(ctx.size, state)),\n})\n\n/**\n * How far each entry is shown, written whole (a document, a `set`) or one\n * entry at a time (a command, as `{ [index]: reveal }`), which leaves the others\n * as the frame left them — so two series moving at once each move their own.\n */\nfunction revealOf(value: readonly number[] | Readonly<Record<number, number>>, previous?: number[]): number[] {\n  if (Array.isArray(value)) return value as number[]\n  const next = [...(previous ?? [])]\n  for (const [index, reveal] of Object.entries(value)) next[Number(index)] = reveal\n  return next\n}\n\n/**\n * The legend of a chart: a **horizontal-flow row of entries**, one per series, laid out\n * left-to-right with the theme's `itemGap`. Each entry pairs the series label\n * with a rounded colour swatch; only the swatch carries the series colour, the\n * caption reads in the legend's neutral ink.\n *\n * `showSeries`/`hideSeries` flip a series on or off — showing one grows its\n * entry back in at its stable series position, hiding one shrinks it away. So\n * the row only ever shows the currently-enabled series, in series order, and\n * closes the gap when one leaves.\n *\n * This node *is* the row, so the parent places it (centred below the chart) and\n * it hugs its entries.\n */\nexport const ChartLegend = component2d({\n  key: \"chartLegend\",\n  state: {\n    ...row,\n    series: fresh<ChartSeries[]>(() => []),\n    swatches: fresh<Fill[]>(() => []),\n    legend: Types.custom<LegendConfig>(DEFAULT_LEGEND),\n    /**\n     * How far each entry is shown, `0`–`1`. Drives its width, opacity and gap\n     * together, so `0` is an entry that takes no room and `1` is one at its\n     * natural size.\n     *\n     * This replaces adding and removing the entry from the row: a command is\n     * asked what it looks like at a time, and \"is this node a child\" is not a\n     * value a time can produce. Collapsed-but-present is the same picture reached\n     * by a route that *is* a function of `t`.\n     */\n    reveal: fresh<number[], number[] | Readonly<Record<number, number>>>(() => [], { resolve: revealOf }),\n  },\n  // This node *is* the row, so the direction is its own answer. It has to be\n  // stated — a `Rect` given no flow lays its children out `freeform`, which\n  // stacks every entry on the same spot. The gap and padding are the theme's.\n  defaults: {\n    flow: \"horizontal\",\n    width: \"hug\",\n    height: \"hug\",\n    gap: (state) => state.legend.itemGap,\n    padding: (state) => state.legend.padding,\n    reveal: (state) => state.series.map((s) => ((s.enabled ?? true) ? 1 : 0)),\n  },\n  // One entry per series, in series order, every one a child for good: order is\n  // fixed rather than depending on which siblings happen to be shown, so an entry\n  // always comes back where it belongs.\n  children: (state) => {\n    const marker = state.legend.markerStyle\n    return state.series.map((series, index) =>\n      LegendEntry({\n        flow: \"horizontal\",\n        gap: 12,\n        align: \"center\",\n        width: \"hug\",\n        height: \"hug\",\n        // Bound to the reveal, so showing and hiding is a number moving rather\n        // than a child arriving and leaving. The width follows it in `measure`,\n        // and the flanking gap closes with the entry rather than snapping.\n        opacity: () => state.reveal[index] ?? 0,\n        gapScale: () => state.reveal[index] ?? 0,\n        shown: () => state.reveal[index] ?? 0,\n        children: [\n          Text({ ...textOps.styleProps(state.legend.textStyle), text: series.label }),\n          Rect({\n            width: marker.width,\n            height: marker.height,\n            cornerRadius: marker.borderRadius,\n            fill: state.swatches[index] ?? \"white\",\n            stroke: marker.stroke,\n            shadow: marker.shadow,\n          }),\n        ],\n      })\n    )\n  },\n  commands: {\n    ...Paint.commands,\n    /**\n     * Grow series `index`'s entry back in at its series-order position, the\n     * siblings sliding over to make room. A reveal tween rather than an animated\n     * `addChildAt`: the entry never left, so the whole thing is a function of `t`.\n     */\n    showSeries: {\n      args: { index: Types.number(0, { min: 0, step: 1 }) },\n      // An index that is not a series takes its slot and moves nothing.\n      run: (timeline, state) => (timeline.args.index in state.series\n        ? timeline.animate(revealFrame(state, timeline.args.index, 1, frameEase(timeline)))\n        : timeline.wait(timeline.duration)),\n    },\n    /** Shrink series `index`'s entry away, the gap closing behind it — the mirror of `showSeries`. */\n    hideSeries: {\n      args: { index: Types.number(0, { min: 0, step: 1 }) },\n      run: (timeline, state) => (timeline.args.index in state.series\n        ? timeline.animate(revealFrame(state, timeline.args.index, 0, frameEase(timeline)))\n        : timeline.wait(timeline.duration)),\n    },\n    /**\n     * Dim every entry but series `index` to {@link SPOTLIGHT_DIM} and bring that\n     * one back to full — the legend half of a chart's `spotlightSeries`. Entries\n     * stay in place; only their opacity moves, so the row doesn't reflow. Only\n     * the entries shown when it is built are touched: a hidden series' entry is\n     * left as `hideSeries` left it.\n     */\n    spotlightSeries: {\n      args: { index: Types.number(0, { min: 0, step: 1 }) },\n      run: (timeline, state, children) =>\n        timeline.together(\n          children.flatMap((entry, i) =>\n            (state.reveal[i] ?? 0) > 0 ? [entry.to({ opacity: i === timeline.args.index ? 1 : SPOTLIGHT_DIM })] : []\n          )\n        ),\n    },\n  },\n  measure: (measurer, state, children) => Flow.measure(measurer, state, children, Paint.inset(state)),\n  layout: (box, state, children) => Flow.layout(box, state, children, Paint.inset(state)),\n  render: (ctx, state) => Paint.draw(ctx, state, Shapes.rect(ctx.size, state)),\n})\n\n/**\n * One entry's reveal ramping to `target` from where the command finds it — so a\n * hide that follows a show starts where the show left it.\n */\nfunction revealFrame(state: { readonly reveal: readonly number[] }, index: number, target: number, ease: (t: number) => number) {\n  const from = state.reveal[index] ?? 0\n  return (t: number) => ({ reveal: { [index]: from + (target - from) * ease(t) } })\n}\n\n/** Whether series `index` is showing at all on `legend`. */\nexport function legendShows(legend: { readonly reveal: readonly number[] }, index: number): boolean {\n  return (legend.reveal[index] ?? 0) > 0\n}\n\nexport type ChartLegend = NodeOf<typeof ChartLegend>\n"]}

package/dist/kit/entries.d.ts

@@ -0,0 +1,17 @@
+import { type Element, type Node2D, type Type } from "@motionscript/sdk";
+/**
+ * An entry made fresh for every node: each node gets its own array or box
+ * rather than one shared literal, and a host is told no default for it.
+ */
+export declare function fresh<T, In = T>(make: () => T, options?: {
+    readonly resolve?: (value: In) => T;
+    readonly kind?: string;
+}): Type<In, T>;
+/**
+ * Nodes a `children` builder made with `new`, as the elements it returns. A
+ * part built that way can be read in a binding — its own box, or its parent's,
+ * which is the component it was built for — where a call would hand back only
+ * the element.
+ */
+export declare function asParts(nodes: readonly Node2D[]): readonly Element[];
+//# sourceMappingURL=entries.d.ts.map

package/dist/kit/entries.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"entries.d.ts","sourceRoot":"","sources":["../../src/kit/entries.ts"],"names":[],"mappings":"AAAA,OAAO,EAAS,KAAK,OAAO,EAAE,KAAK,MAAM,EAAE,KAAK,IAAI,EAAE,MAAM,mBAAmB,CAAA;AAE/E;;;GAGG;AACH,wBAAgB,KAAK,CAAC,CAAC,EAAE,EAAE,GAAG,CAAC,EAAE,IAAI,EAAE,MAAM,CAAC,EAAE,OAAO,CAAC,EAAE;IAAE,QAAQ,CAAC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,EAAE,KAAK,CAAC,CAAC;IAAC,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,CAAA;CAAE,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC,CAAC,CAGtI;AAED;;;;;GAKG;AACH,wBAAgB,OAAO,CAAC,KAAK,EAAE,SAAS,MAAM,EAAE,GAAG,SAAS,OAAO,EAAE,CAEpE"}

package/dist/kit/entries.js

@@ -0,0 +1,19 @@
+import { Types } from "@motionscript/sdk";
+/**
+ * An entry made fresh for every node: each node gets its own array or box
+ * rather than one shared literal, and a host is told no default for it.
+ */
+export function fresh(make, options) {
+    // A function default is a factory: the component calls it once per node.
+    return Types.custom(make, options);
+}
+/**
+ * Nodes a `children` builder made with `new`, as the elements it returns. A
+ * part built that way can be read in a binding — its own box, or its parent's,
+ * which is the component it was built for — where a call would hand back only
+ * the element.
+ */
+export function asParts(nodes) {
+    return nodes;
+}
+//# sourceMappingURL=entries.js.map

package/dist/kit/entries.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"entries.js","sourceRoot":"","sources":["../../src/kit/entries.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAwC,MAAM,mBAAmB,CAAA;AAE/E;;;GAGG;AACH,MAAM,UAAU,KAAK,CAAY,IAAa,EAAE,OAAyE;IACvH,yEAAyE;IACzE,OAAO,KAAK,CAAC,MAAM,CAAQ,IAAqB,EAAE,OAAO,CAAC,CAAA;AAC5D,CAAC;AAED;;;;;GAKG;AACH,MAAM,UAAU,OAAO,CAAC,KAAwB;IAC9C,OAAO,KAAsC,CAAA;AAC/C,CAAC","sourcesContent":["import { Types, type Element, type Node2D, type Type } from \"@motionscript/sdk\"\n\n/**\n * An entry made fresh for every node: each node gets its own array or box\n * rather than one shared literal, and a host is told no default for it.\n */\nexport function fresh<T, In = T>(make: () => T, options?: { readonly resolve?: (value: In) => T; readonly kind?: string }): Type<In, T> {\n  // A function default is a factory: the component calls it once per node.\n  return Types.custom<In, T>(make as unknown as In, options)\n}\n\n/**\n * Nodes a `children` builder made with `new`, as the elements it returns. A\n * part built that way can be read in a binding — its own box, or its parent's,\n * which is the component it was built for — where a call would hand back only\n * the element.\n */\nexport function asParts(nodes: readonly Node2D[]): readonly Element[] {\n  return nodes as unknown as readonly Element[]\n}\n"]}

package/dist/kit/motion.d.ts

@@ -0,0 +1,48 @@
+import { type EasingFunction, type Piece, type Timeline } from "@motionscript/sdk";
+/** Any component's timeline: these helpers only build pieces, which every timeline builds alike. */
+type AnyTimeline = Timeline<any, any>;
+/**
+ * The ease a part's own frames apply to `t`: none when its command was given
+ * one, which already eases every frame the command builds, and otherwise the
+ * ease-out every chart command defaults to.
+ */
+export declare function frameEase(timeline: {
+    readonly easing: EasingFunction | undefined;
+}): EasingFunction;
+/** A piece of a command placed at its own time: from `at` seconds, for `duration` seconds. */
+export interface Beat {
+    readonly at: number;
+    readonly duration: number;
+    readonly piece: Piece;
+}
+/**
+ * `beats` at their own offsets over the command, each eased on its own and held
+ * at its last frame once it is done. A beat ahead of the playhead writes nothing,
+ * so whatever stands before it is written by a piece ahead of these. Beats that
+ * run past the command are played faster to end with it.
+ */
+export declare function beats(timeline: AnyTimeline, parts: readonly Beat[]): Piece;
+/** How far one piece of a staggered entrance has come: its opacity, and how far it still sits off its place. */
+export interface Arrival {
+    readonly opacity: number;
+    readonly shift: number;
+}
+/** Each piece's arrival, by key. An unlisted piece has landed. */
+export type Arrivals = Readonly<Record<string, Arrival>>;
+export declare const LANDED: Arrival;
+/**
+ * A part's private record of its pieces' arrivals. A write merges into it, so
+ * beats placed apart each write their own piece and leave the others as the
+ * frame left them.
+ */
+export declare function arrivalsEntry(): import("@motionscript/sdk").Type<Readonly<Record<string, Arrival>>, Readonly<Record<string, Arrival>>, false>;
+export declare function arrivalOf(arrivals: Arrivals, key: string | number): Arrival;
+/** Every piece in `keys` armed at `from`: the first frame of their entrance. */
+export declare function armed(keys: readonly (string | number)[], from: Arrival): Arrivals;
+/**
+ * A piece arriving from `from` over its beat: a part armed at `from` tweened to
+ * `{ opacity: 1, [axis]: 0 }`, eased by `ease`.
+ */
+export declare function arrival(timeline: AnyTimeline, key: string | number, from: Arrival, ease: EasingFunction): Piece;
+export {};
+//# sourceMappingURL=motion.d.ts.map

package/dist/kit/motion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"motion.d.ts","sourceRoot":"","sources":["../../src/kit/motion.ts"],"names":[],"mappings":"AAAA,OAAO,EAAkB,KAAK,cAAc,EAAE,KAAK,KAAK,EAAE,KAAK,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAIlG,oGAAoG;AACpG,KAAK,WAAW,GAAG,QAAQ,CAAC,GAAG,EAAE,GAAG,CAAC,CAAA;AAErC;;;;GAIG;AACH,wBAAgB,SAAS,CAAC,QAAQ,EAAE;IAAE,QAAQ,CAAC,MAAM,EAAE,cAAc,GAAG,SAAS,CAAA;CAAE,GAAG,cAAc,CAEnG;AAED,8FAA8F;AAC9F,MAAM,WAAW,IAAI;IACnB,QAAQ,CAAC,EAAE,EAAE,MAAM,CAAA;IACnB,QAAQ,CAAC,QAAQ,EAAE,MAAM,CAAA;IACzB,QAAQ,CAAC,KAAK,EAAE,KAAK,CAAA;CACtB;AAED;;;;;GAKG;AACH,wBAAgB,KAAK,CAAC,QAAQ,EAAE,WAAW,EAAE,KAAK,EAAE,SAAS,IAAI,EAAE,GAAG,KAAK,CAW1E;AAED,gHAAgH;AAChH,MAAM,WAAW,OAAO;IACtB,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAA;IACxB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAA;CACvB;AAED,kEAAkE;AAClE,MAAM,MAAM,QAAQ,GAAG,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAA;AAExD,eAAO,MAAM,MAAM,EAAE,OAAkC,CAAA;AAEvD;;;;GAIG;AACH,wBAAgB,aAAa,kHAE5B;AAED,wBAAgB,SAAS,CAAC,QAAQ,EAAE,QAAQ,EAAE,GAAG,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,CAE3E;AAED,gFAAgF;AAChF,wBAAgB,KAAK,CAAC,IAAI,EAAE,SAAS,CAAC,MAAM,GAAG,MAAM,CAAC,EAAE,EAAE,IAAI,EAAE,OAAO,GAAG,QAAQ,CAIjF;AAED;;;GAGG;AACH,wBAAgB,OAAO,CAAC,QAAQ,EAAE,WAAW,EAAE,GAAG,EAAE,MAAM,GAAG,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,cAAc,GAAG,KAAK,CAY/G"}

package/dist/kit/motion.js

@@ -0,0 +1,63 @@
+import { Types, easeOut } from "@motionscript/sdk";
+const identity = (t) => t;
+/**
+ * The ease a part's own frames apply to `t`: none when its command was given
+ * one, which already eases every frame the command builds, and otherwise the
+ * ease-out every chart command defaults to.
+ */
+export function frameEase(timeline) {
+    return timeline.easing ? identity : easeOut();
+}
+/**
+ * `beats` at their own offsets over the command, each eased on its own and held
+ * at its last frame once it is done. A beat ahead of the playhead writes nothing,
+ * so whatever stands before it is written by a piece ahead of these. Beats that
+ * run past the command are played faster to end with it.
+ */
+export function beats(timeline, parts) {
+    const total = timeline.duration;
+    const natural = parts.reduce((end, part) => Math.max(end, part.at + part.duration), 0);
+    const k = natural > total && natural > 0 ? total / natural : 1;
+    return timeline.together(parts.map(({ at, duration, piece }) => {
+        const start = at * k;
+        const length = duration * k;
+        return timeline.sequence([timeline.wait(start), piece, timeline.wait(Math.max(0, total - start - length))]);
+    }));
+}
+export const LANDED = { opacity: 1, shift: 0 };
+/**
+ * A part's private record of its pieces' arrivals. A write merges into it, so
+ * beats placed apart each write their own piece and leave the others as the
+ * frame left them.
+ */
+export function arrivalsEntry() {
+    return Types.custom({}, { private: true, resolve: (next, previous) => ({ ...previous, ...next }) });
+}
+export function arrivalOf(arrivals, key) {
+    return arrivals[key] ?? LANDED;
+}
+/** Every piece in `keys` armed at `from`: the first frame of their entrance. */
+export function armed(keys, from) {
+    const record = {};
+    for (const key of keys)
+        record[key] = from;
+    return record;
+}
+/**
+ * A piece arriving from `from` over its beat: a part armed at `from` tweened to
+ * `{ opacity: 1, [axis]: 0 }`, eased by `ease`.
+ */
+export function arrival(timeline, key, from, ease) {
+    return timeline.animate((t) => {
+        const e = ease(t);
+        return {
+            arrivals: {
+                [key]: {
+                    opacity: from.opacity + (LANDED.opacity - from.opacity) * e,
+                    shift: from.shift + (LANDED.shift - from.shift) * e,
+                },
+            },
+        };
+    });
+}
+//# sourceMappingURL=motion.js.map

package/dist/kit/motion.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"motion.js","sourceRoot":"","sources":["../../src/kit/motion.ts"],"names":[],"mappings":"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","sourcesContent":["import { Types, easeOut, type EasingFunction, type Piece, type Timeline } from \"@motionscript/sdk\"\n\nconst identity: EasingFunction = (t) => t\n\n/** Any component's timeline: these helpers only build pieces, which every timeline builds alike. */\ntype AnyTimeline = Timeline<any, any>\n\n/**\n * The ease a part's own frames apply to `t`: none when its command was given\n * one, which already eases every frame the command builds, and otherwise the\n * ease-out every chart command defaults to.\n */\nexport function frameEase(timeline: { readonly easing: EasingFunction | undefined }): EasingFunction {\n  return timeline.easing ? identity : easeOut()\n}\n\n/** A piece of a command placed at its own time: from `at` seconds, for `duration` seconds. */\nexport interface Beat {\n  readonly at: number\n  readonly duration: number\n  readonly piece: Piece\n}\n\n/**\n * `beats` at their own offsets over the command, each eased on its own and held\n * at its last frame once it is done. A beat ahead of the playhead writes nothing,\n * so whatever stands before it is written by a piece ahead of these. Beats that\n * run past the command are played faster to end with it.\n */\nexport function beats(timeline: AnyTimeline, parts: readonly Beat[]): Piece {\n  const total = timeline.duration\n  const natural = parts.reduce((end, part) => Math.max(end, part.at + part.duration), 0)\n  const k = natural > total && natural > 0 ? total / natural : 1\n  return timeline.together(\n    parts.map(({ at, duration, piece }) => {\n      const start = at * k\n      const length = duration * k\n      return timeline.sequence([timeline.wait(start), piece, timeline.wait(Math.max(0, total - start - length))])\n    })\n  )\n}\n\n/** How far one piece of a staggered entrance has come: its opacity, and how far it still sits off its place. */\nexport interface Arrival {\n  readonly opacity: number\n  readonly shift: number\n}\n\n/** Each piece's arrival, by key. An unlisted piece has landed. */\nexport type Arrivals = Readonly<Record<string, Arrival>>\n\nexport const LANDED: Arrival = { opacity: 1, shift: 0 }\n\n/**\n * A part's private record of its pieces' arrivals. A write merges into it, so\n * beats placed apart each write their own piece and leave the others as the\n * frame left them.\n */\nexport function arrivalsEntry() {\n  return Types.custom<Arrivals>({}, { private: true, resolve: (next: Arrivals, previous?: Arrivals) => ({ ...previous, ...next }) })\n}\n\nexport function arrivalOf(arrivals: Arrivals, key: string | number): Arrival {\n  return arrivals[key] ?? LANDED\n}\n\n/** Every piece in `keys` armed at `from`: the first frame of their entrance. */\nexport function armed(keys: readonly (string | number)[], from: Arrival): Arrivals {\n  const record: Record<string, Arrival> = {}\n  for (const key of keys) record[key] = from\n  return record\n}\n\n/**\n * A piece arriving from `from` over its beat: a part armed at `from` tweened to\n * `{ opacity: 1, [axis]: 0 }`, eased by `ease`.\n */\nexport function arrival(timeline: AnyTimeline, key: string | number, from: Arrival, ease: EasingFunction): Piece {\n  return timeline.animate((t) => {\n    const e = ease(t)\n    return {\n      arrivals: {\n        [key]: {\n          opacity: from.opacity + (LANDED.opacity - from.opacity) * e,\n          shift: from.shift + (LANDED.shift - from.shift) * e,\n        },\n      },\n    }\n  })\n}\n"]}

package/dist/kit/paints.d.ts

@@ -0,0 +1,10 @@
+import type { FillResolved, Loader, ShadowResolved, StrokeResolved } from "@motionscript/sdk";
+/** Paints a chart part holds in entries of its own, which no paint entry loads for it. */
+export interface PartPaints {
+    readonly fills?: readonly (readonly FillResolved[])[];
+    readonly strokes?: readonly (readonly StrokeResolved[])[];
+    readonly shadows?: readonly (readonly ShadowResolved[])[];
+}
+/** Declare `paints` from a component's `load`. */
+export declare function loadPaints(loader: Loader, paints: PartPaints): void;
+//# sourceMappingURL=paints.d.ts.map

package/dist/kit/paints.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"paints.d.ts","sourceRoot":"","sources":["../../src/kit/paints.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAE7F,0FAA0F;AAC1F,MAAM,WAAW,UAAU;IACzB,QAAQ,CAAC,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,YAAY,EAAE,CAAC,EAAE,CAAA;IACrD,QAAQ,CAAC,OAAO,CAAC,EAAE,SAAS,CAAC,SAAS,cAAc,EAAE,CAAC,EAAE,CAAA;IACzD,QAAQ,CAAC,OAAO,CAAC,EAAE,SAAS,CAAC,SAAS,cAAc,EAAE,CAAC,EAAE,CAAA;CAC1D;AAED,kDAAkD;AAClD,wBAAgB,UAAU,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,UAAU,GAAG,IAAI,CAInE"}