@motionscript/charts 0.1.0 → 0.1.1-alpha.1

package/dist/kit/entries.js.map

@@ -1 +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"]}
+{"version":3,"file":"entries.js","sourceRoot":"","sources":["../../src/kit/entries.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAA2D,MAAM,mBAAmB,CAAA;AAElG;;;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;AAED,4FAA4F;AAC5F,MAAM,CAAC,MAAM,UAAU,GAAG,KAAK,CAAC,MAAM,CAAiF,CAAC,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,CAAC,CAAA","sourcesContent":["import { Types, type Element, type EntryOptions, 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\n/** The argument every per-series command takes: an index into `series`, offered by name. */\nexport const SERIES_ARG = Types.custom<number, number, EntryOptions & { readonly min: number; readonly step: number }>(0, { kind: \"series\", min: 0, step: 1 })\n"]}

package/dist/kit/horizontal-axis.d.ts

@@ -0,0 +1,77 @@
+import { type NodeOf, type Node2D, type Node2DProps as _Node2DProps } from "@motionscript/sdk";
+import { type Arrival } from "./motion.js";
+import { type AxisConfig, type Range } from "./shared.js";
+/**
+ * A row of {@link Text} markers under the plot, 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 category axis. An end marker may hang
+ * past the row by `overhang` px on either side, then is held inside it.
+ */
+export declare const HorizontalAxis: import("@motionscript/sdk").Component<"horizontalAxis", import("@motionscript/sdk").Merge<import("@motionscript/sdk").Box2DState, {
+    readonly range: import("@motionscript/sdk").Type<Range, Range, false>;
+    /** Tick values in data units. */
+    readonly markers: import("@motionscript/sdk").Type<number[], number[], false>;
+    /** 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>;
+    readonly axis: import("@motionscript/sdk").Type<AxisConfig, AxisConfig, false>;
+    /** Caption centred beneath the markers; empty hides it. */
+    readonly label: "";
+    /** How far past the row's left and right ends a marker may reach, in px. */
+    readonly overhang: import("@motionscript/sdk").Type<{
+        left: number;
+        right: number;
+    }, {
+        left: number;
+        right: number;
+    }, false>;
+    readonly arrivals: import("@motionscript/sdk").Type<Readonly<Record<string, Arrival>>, Readonly<Record<string, Arrival>>, false>;
+}>, {
+    readonly enter: {
+        readonly stagger: import("@motionscript/sdk").Type<number | undefined, number | undefined, false>;
+        readonly slide: import("@motionscript/sdk").Type<number, number, false>;
+    };
+}, 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. */
+    readonly markers: import("@motionscript/sdk").Type<number[], number[], false>;
+    /** 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>;
+    readonly axis: import("@motionscript/sdk").Type<AxisConfig, AxisConfig, false>;
+    /** Caption centred beneath the markers; empty hides it. */
+    readonly label: "";
+    /** How far past the row's left and right ends a marker may reach, in px. */
+    readonly overhang: import("@motionscript/sdk").Type<{
+        left: number;
+        right: number;
+    }, {
+        left: number;
+        right: number;
+    }, false>;
+    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, {
+    readonly range: import("@motionscript/sdk").Type<Range, Range, false>;
+    /** Tick values in data units. */
+    readonly markers: import("@motionscript/sdk").Type<number[], number[], false>;
+    /** 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>;
+    readonly axis: import("@motionscript/sdk").Type<AxisConfig, AxisConfig, false>;
+    /** Caption centred beneath the markers; empty hides it. */
+    readonly label: "";
+    /** How far past the row's left and right ends a marker may reach, in px. */
+    readonly overhang: import("@motionscript/sdk").Type<{
+        left: number;
+        right: number;
+    }, {
+        left: number;
+        right: number;
+    }, false>;
+    readonly arrivals: import("@motionscript/sdk").Type<Readonly<Record<string, Arrival>>, Readonly<Record<string, Arrival>>, false>;
+}>, {
+    readonly enter: {
+        readonly stagger: import("@motionscript/sdk").Type<number | undefined, number | undefined, false>;
+        readonly slide: import("@motionscript/sdk").Type<number, number, false>;
+    };
+}, Node2D<_Node2DProps>>>>;
+export type HorizontalAxis = NodeOf<typeof HorizontalAxis>;
+//# sourceMappingURL=horizontal-axis.d.ts.map

package/dist/kit/horizontal-axis.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"horizontal-axis.d.ts","sourceRoot":"","sources":["../../src/kit/horizontal-axis.ts"],"names":[],"mappings":"AAAA,OAAO,EAKL,KAAK,MAAM,EAEX,KAAK,MAAM,EACX,KAAK,WAAW,IAAI,YAAY,EACjC,MAAM,mBAAmB,CAAA;AAK1B,OAAO,EAA8D,KAAK,OAAO,EAAE,MAAM,UAAU,CAAA;AACnG,OAAO,EAAkB,KAAK,UAAU,EAAE,KAAK,KAAK,EAAE,MAAM,UAAU,CAAA;AAKtE;;;;;;GAMG;AACH,eAAO,MAAM,cAAc;;IAIvB,iCAAiC;;IAEjC,0FAA0F;;;IAG1F,2DAA2D;;IAE3D,4EAA4E;;cAC7C,MAAM;eAAS,MAAM;;cAArB,MAAM;eAAS,MAAM;;;;;;;;;;IARpD,iCAAiC;;IAEjC,0FAA0F;;;IAG1F,2DAA2D;;IAE3D,4EAA4E;;cAC7C,MAAM;eAAS,MAAM;;cAArB,MAAM;eAAS,MAAM;;;;;IARpD,iCAAiC;;IAEjC,0FAA0F;;;IAG1F,2DAA2D;;IAE3D,4EAA4E;;cAC7C,MAAM;eAAS,MAAM;;cAArB,MAAM;eAAS,MAAM;;;;;;;;0BAwEtD,CAAA;AAEF,MAAM,MAAM,cAAc,GAAG,MAAM,CAAC,OAAO,cAAc,CAAC,CAAA"}

package/dist/kit/horizontal-axis.js

@@ -0,0 +1,99 @@
+import { Rect, Text, Types, component2d, } from "@motionscript/sdk";
+import { enterBudget } from "@motionscript/sdk/component";
+import { boundText } from "./cartesian.js";
+import { asParts, fresh } from "./entries.js";
+import { armed, arrival, arrivalOf, arrivalsEntry, beats, frameEase } from "./motion.js";
+import { DEFAULT_X_AXIS } from "./shared.js";
+import { axisPads, markerCaption } from "./vertical-axis.js";
+const SLIDE = 24;
+/**
+ * A row of {@link Text} markers under the plot, 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 category axis. An end marker may hang
+ * past the row by `overhang` px on either side, then is held inside it.
+ */
+export const HorizontalAxis = component2d({
+    key: "horizontalAxis",
+    state: {
+        range: fresh(() => [0, 1]),
+        /** Tick values in data units. */
+        markers: fresh(() => []),
+        /** One caption per marker in its order; a missing one reads as the bare numeric value. */
+        captions: fresh(() => []),
+        axis: Types.custom(DEFAULT_X_AXIS),
+        /** Caption centred beneath the markers; empty hides it. */
+        label: "",
+        /** How far past the row's left and right ends a marker may reach, in px. */
+        overhang: Types.custom({ left: 0, right: 0 }),
+        arrivals: arrivalsEntry(),
+    },
+    // A node made of markers would otherwise hug them.
+    defaults: { width: "fill", height: "fill" },
+    children: (state) => {
+        const pads = () => axisPads(state.axis, "top");
+        const sorted = () => [...state.markers].sort((a, b) => a - b);
+        const fracAt = (value) => {
+            if (value === undefined)
+                return 0;
+            const [min, max] = state.range;
+            return max <= min ? 0 : (value - min) / (max - min);
+        };
+        const markers = state.markers.map((_, i) => {
+            const width = () => marker.parent?.layoutBounds.width ?? 0;
+            const marker = new Text({
+                ...boundText(() => state.axis.labelStyle),
+                text: () => {
+                    const value = sorted()[i];
+                    return value === undefined ? "" : markerCaption(state, value);
+                },
+                x: () => {
+                    const w = width();
+                    const half = marker.layoutBounds.width / 2;
+                    const centred = (fracAt(sorted()[i]) - 0.5) * w;
+                    return Math.max(-w / 2 - state.overhang.left + half, Math.min(w / 2 + state.overhang.right - half, centred));
+                },
+                opacity: () => arrivalOf(state.arrivals, i).opacity,
+                y: () => arrivalOf(state.arrivals, i).shift,
+            });
+            return marker;
+        });
+        const children = [
+            new Rect({ width: "fill", height: "hug", padding: () => ({ top: pads().tick }), children: markers }),
+        ];
+        if (state.label !== "") {
+            children.push(new Text({
+                ...boundText(() => state.axis.titleStyle),
+                text: state.label,
+                opacity: () => arrivalOf(state.arrivals, "label").opacity,
+                y: () => arrivalOf(state.arrivals, "label").shift,
+            }));
+        }
+        return asParts([new Rect({ flow: "vertical", gap: () => pads().title, height: "hug", width: "fill", children })]);
+    },
+    commands: {
+        /** Stagger markers in left to right, then the caption. The duration is the whole entrance ({@link enterBudget}). */
+        enter: {
+            args: {
+                stagger: Types.custom(undefined),
+                slide: Types.number(SLIDE),
+            },
+            run: (timeline, state) => {
+                const { stagger, slide } = timeline.args;
+                const count = state.markers.length;
+                const captioned = state.label !== "";
+                const from = { opacity: 0, shift: slide };
+                const keys = [...state.markers.keys(), ...(captioned ? ["label"] : [])];
+                const arm = timeline.animate(() => ({ arrivals: armed(keys, from) }));
+                if (count === 0)
+                    return arm;
+                const { step, per, caption } = enterBudget(timeline.duration, count, captioned, stagger);
+                const ease = frameEase(timeline);
+                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])]);
+            },
+        },
+    },
+});
+//# sourceMappingURL=horizontal-axis.js.map

package/dist/kit/horizontal-axis.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"horizontal-axis.js","sourceRoot":"","sources":["../../src/kit/horizontal-axis.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  Rect,\n  Text,\n  Types,\n  component2d,\n  type NodeOf,\n  // Named so this component's emitted type reaches `Node2D` and its props through the sdk, not core.\n  type Node2D,\n  type Node2DProps as _Node2DProps,\n} from \"@motionscript/sdk\"\nimport { enterBudget } from \"@motionscript/sdk/component\"\n\nimport { boundText } from \"./cartesian\"\nimport { asParts, fresh } from \"./entries\"\nimport { armed, arrival, arrivalOf, arrivalsEntry, beats, frameEase, type Arrival } from \"./motion\"\nimport { DEFAULT_X_AXIS, type AxisConfig, type Range } from \"./shared\"\nimport { axisPads, markerCaption } from \"./vertical-axis\"\n\nconst SLIDE = 24\n\n/**\n * A row of {@link Text} markers under the plot, the mirror of `VerticalAxis`\n * (bound text and positions, landed resting state). Markers are placed by value\n * across the range, whatever they say: `2026-03` sits three months along, not\n * three slots along, unlike a bar chart's category axis. An end marker may hang\n * past the row by `overhang` px on either side, then is held inside it.\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    /** How far past the row's left and right ends a marker may reach, in px. */\n    overhang: Types.custom<{ left: number; right: number }>({ left: 0, right: 0 }),\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 pads = () => axisPads(state.axis, \"top\")\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 width = () => (marker.parent as Node2D | null)?.layoutBounds.width ?? 0\n      const marker: Node2D = new Text({\n        ...boundText(() => state.axis.labelStyle),\n        text: () => {\n          const value = sorted()[i]\n          return value === undefined ? \"\" : markerCaption(state, value)\n        },\n        x: () => {\n          const w = width()\n          const half = marker.layoutBounds.width / 2\n          const centred = (fracAt(sorted()[i]) - 0.5) * w\n          return Math.max(-w / 2 - state.overhang.left + half, Math.min(w / 2 + state.overhang.right - half, centred))\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: pads().tick }), children: markers }) as unknown as Node2D,\n    ]\n    if (state.label !== \"\") {\n      children.push(\n        new Text({\n          ...boundText(() => state.axis.titleStyle),\n          text: state.label,\n          opacity: () => arrivalOf(state.arrivals, \"label\").opacity,\n          y: () => arrivalOf(state.arrivals, \"label\").shift,\n        }) as unknown as Node2D\n      )\n    }\n    return asParts([new Rect({ flow: \"vertical\", gap: () => pads().title, height: \"hug\", width: \"fill\", children }) as unknown as Node2D])\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/kit/motion.d.ts

@@ -1,6 +1,21 @@
 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>;
+export type AnyTimeline = Timeline<any, any>;
+/** How far a legend starts below its slot when `enter` brings it in, in px. */
+export declare const LEGEND_SLIDE = 20;
+/** Where a legend waits before it comes up: below its place, above it, or to its right. */
+export declare function legendAway(at: string): {
+    x?: number;
+    y?: number;
+};
+/** Marker count when an axis states no ticks. */
+export declare const DEFAULT_MARKERS = 5;
+/** How a cartesian `enter` splits its duration: axes arriving, marks drawing, legend coming up. Sums to 1. */
+export declare const ENTER_SHARE: {
+    readonly axes: 0.35;
+    readonly marks: 0.5;
+    readonly legend: 0.15;
+};
 /**
  * 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
@@ -29,7 +44,6 @@ export interface Arrival {
 }
 /** 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
@@ -44,5 +58,4 @@ export declare function armed(keys: readonly (string | number)[], from: Arrival)
  * `{ 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

@@ -1 +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"}
+{"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,MAAM,MAAM,WAAW,GAAG,QAAQ,CAAC,GAAG,EAAE,GAAG,CAAC,CAAA;AAE5C,+EAA+E;AAC/E,eAAO,MAAM,YAAY,KAAK,CAAA;AAE9B,2FAA2F;AAC3F,wBAAgB,UAAU,CAAC,EAAE,EAAE,MAAM,GAAG;IAAE,CAAC,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,CAAC,EAAE,MAAM,CAAA;CAAE,CAIjE;AAED,iDAAiD;AACjD,eAAO,MAAM,eAAe,IAAI,CAAA;AAEhC,8GAA8G;AAC9G,eAAO,MAAM,WAAW;;;;CAAoD,CAAA;AAE5E;;;;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;AAIxD;;;;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

@@ -1,5 +1,19 @@
 import { Types, easeOut } from "@motionscript/sdk";
 const identity = (t) => t;
+/** How far a legend starts below its slot when `enter` brings it in, in px. */
+export const LEGEND_SLIDE = 20;
+/** Where a legend waits before it comes up: below its place, above it, or to its right. */
+export function legendAway(at) {
+    if (at === "top")
+        return { y: LEGEND_SLIDE };
+    if (at === "right")
+        return { x: LEGEND_SLIDE };
+    return { y: -LEGEND_SLIDE };
+}
+/** Marker count when an axis states no ticks. */
+export const DEFAULT_MARKERS = 5;
+/** How a cartesian `enter` splits its duration: axes arriving, marks drawing, legend coming up. Sums to 1. */
+export const ENTER_SHARE = { axes: 0.35, marks: 0.5, legend: 0.15 };
 /**
  * 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
@@ -24,7 +38,7 @@ export function beats(timeline, parts) {
         return timeline.sequence([timeline.wait(start), piece, timeline.wait(Math.max(0, total - start - length))]);
     }));
 }
-export const LANDED = { opacity: 1, shift: 0 };
+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

package/dist/kit/motion.js.map

@@ -1 +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"]}
+{"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. */\nexport type AnyTimeline = Timeline<any, any>\n\n/** How far a legend starts below its slot when `enter` brings it in, in px. */\nexport const LEGEND_SLIDE = 20\n\n/** Where a legend waits before it comes up: below its place, above it, or to its right. */\nexport function legendAway(at: string): { x?: number; y?: number } {\n  if (at === \"top\") return { y: LEGEND_SLIDE }\n  if (at === \"right\") return { x: LEGEND_SLIDE }\n  return { y: -LEGEND_SLIDE }\n}\n\n/** Marker count when an axis states no ticks. */\nexport const DEFAULT_MARKERS = 5\n\n/** How a cartesian `enter` splits its duration: axes arriving, marks drawing, legend coming up. Sums to 1. */\nexport const ENTER_SHARE = { axes: 0.35, marks: 0.5, legend: 0.15 } as const\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\nconst 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/{pie-chart → kit}/pie-legend.d.ts

@@ -1,37 +1,18 @@
-import { type NodeOf, type RectProps, type Alignment as _Alignment, type CornerRadiusResolved as _CornerRadiusResolved, type CornerStyleResolved as _CornerStyleResolved, type Fill as _Fill, type FillResolved as _FillResolved, type FlowMode as _FlowMode, type FlowResolved as _FlowResolved, type GapSize as _GapSize, type Node2D as _Node2D, type Node2DProps as _Node2DProps, type RectCornerRadius as _RectCornerRadius, type RectCornerStyle as _RectCornerStyle, type Shadow as _Shadow, type ShadowResolved as _ShadowResolved, type Stroke as _Stroke, type StrokeResolved as _StrokeResolved, type Vector2 as _Vector2 } from "@motionscript/sdk";
-import { type Arrival } from "../kit/motion.js";
-import { type LegendConfig } from "../kit/shared.js";
-import type { PieSlice } from "./shared.js";
-export interface PieLegendProps extends RectProps {
-    /** One entry per slice, in ring order. */
-    slices: PieSlice[];
-    /** Padding, caption style, gaps, and swatch geometry — see {@link LegendConfig}. */
-    legend: LegendConfig;
-    /**
-     * Per-slice opacity multiplier, by index — the same signal that dims the ring,
-     * so an entry fades in step with the wedge it names. Missing entries read as 1.
-     */
-    dims: number[];
-}
+import { type NodeOf, type Alignment as _Alignment, type CornerRadiusResolved as _CornerRadiusResolved, type CornerStyleResolved as _CornerStyleResolved, type Fill as _Fill, type FillResolved as _FillResolved, type FlowMode as _FlowMode, type FlowResolved as _FlowResolved, type GapSize as _GapSize, type Node2D as _Node2D, type Node2DProps as _Node2DProps, type RectCornerRadius as _RectCornerRadius, type RectCornerStyle as _RectCornerStyle, type Shadow as _Shadow, type ShadowResolved as _ShadowResolved, type Stroke as _Stroke, type StrokeResolved as _StrokeResolved, type Vector2 as _Vector2 } from "@motionscript/sdk";
+import { type Arrival } from "./motion.js";
+import { type LegendConfig } from "./shared.js";
+import type { PieSlice } from "./polar.js";
 /**
- * The legend of a {@link PieChart}: a **vertical-flow column** of entries, one per
- * slice, each pairing the slice's caption with its colour swatch.
- *
- * A column rather than the cartesian charts' row, because it sits *beside* the
- * ring rather than beneath the plot — a pie is as tall as it is wide, so the
- * space it leaves over is a vertical strip. It is otherwise the same entry: the
- * swatch carries the colour, the caption reads in the legend's neutral ink, and
- * both take the shared {@link LegendConfig}.
- *
- * There is no show/hide here. A pie's marks are its *rows*, and a row that
- * shouldn't be in the chart shouldn't be in the table — removing one would
- * silently re-cut every other wedge's share, which is a different chart rather
- * than the same chart with something hidden. Selection is what a pie has
- * instead, and it arrives through {@link PieLegendProps.dims}.
+ * The legend of a {@link PieChart}: a column (it sits beside the ring, in the
+ * vertical strip it leaves) of caption-and-swatch entries, one per slice. No
+ * show/hide: removing a row would re-cut every other wedge's share. Selection
+ * arrives through `dims`.
  */
 export declare const PieLegend: import("@motionscript/sdk").Component<"pieLegend", import("@motionscript/sdk").Merge<import("@motionscript/sdk").Box2DState, {
+    /** One entry per slice, in ring order. */
     readonly slices: import("@motionscript/sdk").Type<PieSlice[], PieSlice[], false>;
     readonly legend: import("@motionscript/sdk").Type<LegendConfig, LegendConfig, false>;
+    /** Per-slice opacity multiplier, the signal that dims the ring, so an entry fades in step with its wedge. Missing reads as 1. */
     readonly dims: import("@motionscript/sdk").Type<number[], number[], false>;
     readonly arrivals: import("@motionscript/sdk").Type<Readonly<Record<string, Arrival>>, Readonly<Record<string, Arrival>>, false>;
     readonly cornerRadius: import("@motionscript/sdk").Attribute<_RectCornerRadius, _CornerRadiusResolved>;
@@ -60,8 +41,10 @@ export declare const PieLegend: import("@motionscript/sdk").Component<"pieLegend
         readonly portion: import("@motionscript/sdk").Type<number, number, false>;
     };
 }, null, _Node2D<_Node2DProps>, import("@motionscript/sdk").CallProps<import("@motionscript/sdk").Merge<import("@motionscript/sdk").Box2DState, {
+    /** One entry per slice, in ring order. */
     readonly slices: import("@motionscript/sdk").Type<PieSlice[], PieSlice[], false>;
     readonly legend: import("@motionscript/sdk").Type<LegendConfig, LegendConfig, false>;
+    /** Per-slice opacity multiplier, the signal that dims the ring, so an entry fades in step with its wedge. Missing reads as 1. */
     readonly dims: import("@motionscript/sdk").Type<number[], number[], false>;
     readonly arrivals: import("@motionscript/sdk").Type<Readonly<Record<string, Arrival>>, Readonly<Record<string, Arrival>>, false>;
     readonly cornerRadius: import("@motionscript/sdk").Attribute<_RectCornerRadius, _CornerRadiusResolved>;
@@ -79,8 +62,10 @@ export declare const PieLegend: import("@motionscript/sdk").Component<"pieLegend
     readonly start: import("@motionscript/sdk").Type<number, number, false>;
     readonly end: import("@motionscript/sdk").Type<number, number, false>;
 }>, null, import("@motionscript/sdk").BuiltNode<import("@motionscript/sdk").Merge<import("@motionscript/sdk").Box2DState, {
+    /** One entry per slice, in ring order. */
     readonly slices: import("@motionscript/sdk").Type<PieSlice[], PieSlice[], false>;
     readonly legend: import("@motionscript/sdk").Type<LegendConfig, LegendConfig, false>;
+    /** Per-slice opacity multiplier, the signal that dims the ring, so an entry fades in step with its wedge. Missing reads as 1. */
     readonly dims: import("@motionscript/sdk").Type<number[], number[], false>;
     readonly arrivals: import("@motionscript/sdk").Type<Readonly<Record<string, Arrival>>, Readonly<Record<string, Arrival>>, false>;
     readonly cornerRadius: import("@motionscript/sdk").Attribute<_RectCornerRadius, _CornerRadiusResolved>;

package/dist/kit/pie-legend.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pie-legend.d.ts","sourceRoot":"","sources":["../../src/kit/pie-legend.ts"],"names":[],"mappings":"AAAA,OAAO,EAUL,KAAK,MAAM,EAEX,KAAK,SAAS,IAAI,UAAU,EAC5B,KAAK,oBAAoB,IAAI,qBAAqB,EAClD,KAAK,mBAAmB,IAAI,oBAAoB,EAChD,KAAK,IAAI,IAAI,KAAK,EAClB,KAAK,YAAY,IAAI,aAAa,EAClC,KAAK,QAAQ,IAAI,SAAS,EAC1B,KAAK,YAAY,IAAI,aAAa,EAClC,KAAK,OAAO,IAAI,QAAQ,EACxB,KAAK,MAAM,IAAI,OAAO,EACtB,KAAK,WAAW,IAAI,YAAY,EAChC,KAAK,gBAAgB,IAAI,iBAAiB,EAC1C,KAAK,eAAe,IAAI,gBAAgB,EACxC,KAAK,MAAM,IAAI,OAAO,EACtB,KAAK,cAAc,IAAI,eAAe,EACtC,KAAK,MAAM,IAAI,OAAO,EACtB,KAAK,cAAc,IAAI,eAAe,EACtC,KAAK,OAAO,IAAI,QAAQ,EACzB,MAAM,mBAAmB,CAAA;AAG1B,OAAO,EAA8D,KAAK,OAAO,EAAE,MAAM,UAAU,CAAA;AACnG,OAAO,EAAkB,KAAK,YAAY,EAAE,MAAM,UAAU,CAAA;AAC5D,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAIvC;;;;;GAKG;AACH,eAAO,MAAM,SAAS;IAMlB,0CAA0C;;;IAG1C,iIAAiI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAHjI,0CAA0C;;;IAG1C,iIAAiI;;;;;;;;;;;;;;;;;;IAHjI,0CAA0C;;;IAG1C,iIAAiI;;;;;;;;;;;;;;;;;;;;;;;;;;;;2BAyEnI,CAAA;AAEF,MAAM,MAAM,SAAS,GAAG,MAAM,CAAC,OAAO,SAAS,CAAC,CAAA"}

package/dist/kit/pie-legend.js

@@ -0,0 +1,93 @@
+import { Flow, Paint, Rect, Shapes, Text, Types, clamp, component2d, textOps, } from "@motionscript/sdk";
+import { fresh } from "./entries.js";
+import { armed, arrival, arrivalOf, arrivalsEntry, beats, frameEase } from "./motion.js";
+import { DEFAULT_LEGEND } from "./shared.js";
+const SLIDE = 16;
+/**
+ * The legend of a {@link PieChart}: a column (it sits beside the ring, in the
+ * vertical strip it leaves) of caption-and-swatch entries, one per slice. No
+ * show/hide: removing a row would re-cut every other wedge's share. Selection
+ * arrives through `dims`.
+ */
+export const PieLegend = component2d({
+    key: "pieLegend",
+    state: {
+        ...Paint.state,
+        ...Flow.state,
+        ...Shapes.corners,
+        /** One entry per slice, in ring order. */
+        slices: fresh(() => []),
+        legend: Types.custom(DEFAULT_LEGEND),
+        /** Per-slice opacity multiplier, the signal that dims the ring, so an entry fades in step with its wedge. Missing reads as 1. */
+        dims: fresh(() => []),
+        arrivals: arrivalsEntry(),
+    },
+    // The flow must be stated: a `Rect` with none lays children out `freeform`, every caption on top of the last.
+    defaults: {
+        flow: "vertical",
+        align: "centerLeft",
+        width: "hug",
+        height: "hug",
+        gap: (state) => state.legend.itemGap / 3,
+        padding: (state) => state.legend.padding,
+    },
+    // The selection dim rides a wrapper, so the entrance animates the entry's own opacity without the two fighting over one value.
+    children: (state) => {
+        const marker = () => state.legend.markerStyle;
+        return state.slices.map((_, index) => Rect({
+            width: "hug",
+            height: "hug",
+            flow: "freeform",
+            opacity: () => clamp(state.dims[index] ?? 1, 0, 1),
+            children: [
+                Rect({
+                    flow: "horizontal",
+                    gap: () => Math.round(state.legend.textStyle.fontSize === undefined ? 12 : Number(state.legend.textStyle.fontSize) * 0.4),
+                    align: "center",
+                    width: "hug",
+                    height: "hug",
+                    opacity: () => arrivalOf(state.arrivals, index).opacity,
+                    x: () => arrivalOf(state.arrivals, index).shift,
+                    children: [
+                        Rect({
+                            width: () => marker().width,
+                            height: () => marker().height,
+                            cornerRadius: () => marker().borderRadius,
+                            fill: () => state.slices[index]?.fill ?? "white",
+                        }),
+                        Text({
+                            ...textOps.styleProps(state.legend.textStyle),
+                            fill: () => state.legend.textStyle.fill ?? "white",
+                            fontSize: () => state.legend.textStyle.fontSize ?? 28,
+                            fontWeight: () => state.legend.textStyle.fontWeight ?? 500,
+                            text: () => state.slices[index]?.category ?? "",
+                        }),
+                    ],
+                }),
+            ],
+        }));
+    },
+    commands: {
+        ...Paint.commands,
+        /** Every entry shifted right and transparent: what a chart shows ahead of this legend's beat, since `enter` arms only on its first frame. */
+        arm: (timeline, state) => timeline.animate(() => ({ arrivals: armed([...state.slices.keys()], { opacity: 0, shift: SLIDE }) })),
+        /** Slide and fade entries in from the right, top to bottom. The duration is the whole entrance, the stagger carved out of it. */
+        enter: (timeline, state) => {
+            const count = state.slices.length;
+            if (count === 0)
+                return timeline.wait(timeline.duration);
+            const from = { opacity: 0, shift: SLIDE };
+            const arm = timeline.animate(() => ({ arrivals: armed([...state.slices.keys()], from) }));
+            // Each gap is a fifth of an entry's move, the axes' rhythm, solved from the budget.
+            const per = timeline.duration / (1 + Math.max(0, count - 1) / 5);
+            const step = per / 5;
+            const ease = frameEase(timeline);
+            const entries = state.slices.map((_, i) => ({ at: i * step, duration: per, piece: arrival(timeline, i, from, ease) }));
+            return timeline.together([arm, beats(timeline, entries)]);
+        },
+    },
+    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)),
+});
+//# sourceMappingURL=pie-legend.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"pie-legend.js","sourceRoot":"","sources":["../../src/kit/pie-legend.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  Flow,\n  Paint,\n  Rect,\n  Shapes,\n  Text,\n  Types,\n  clamp,\n  component2d,\n  textOps,\n  type NodeOf,\n  // Named so the column'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 Fill as _Fill,\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 { armed, arrival, arrivalOf, arrivalsEntry, beats, frameEase, type Arrival } from \"./motion\"\nimport { DEFAULT_LEGEND, type LegendConfig } from \"./shared\"\nimport type { PieSlice } from \"./polar\"\n\nconst SLIDE = 16\n\n/**\n * The legend of a {@link PieChart}: a column (it sits beside the ring, in the\n * vertical strip it leaves) of caption-and-swatch entries, one per slice. No\n * show/hide: removing a row would re-cut every other wedge's share. Selection\n * arrives through `dims`.\n */\nexport const PieLegend = component2d({\n  key: \"pieLegend\",\n  state: {\n    ...Paint.state,\n    ...Flow.state,\n    ...Shapes.corners,\n    /** One entry per slice, in ring order. */\n    slices: fresh<PieSlice[]>(() => []),\n    legend: Types.custom<LegendConfig>(DEFAULT_LEGEND),\n    /** Per-slice opacity multiplier, the signal that dims the ring, so an entry fades in step with its wedge. Missing reads as 1. */\n    dims: fresh<number[]>(() => []),\n    arrivals: arrivalsEntry(),\n  },\n  // The flow must be stated: a `Rect` with none lays children out `freeform`, every caption on top of the last.\n  defaults: {\n    flow: \"vertical\",\n    align: \"centerLeft\",\n    width: \"hug\",\n    height: \"hug\",\n    gap: (state) => state.legend.itemGap / 3,\n    padding: (state) => state.legend.padding,\n  },\n  // The selection dim rides a wrapper, so the entrance animates the entry's own opacity without the two fighting over one value.\n  children: (state) => {\n    const marker = () => state.legend.markerStyle\n    return state.slices.map((_, index) =>\n      Rect({\n        width: \"hug\",\n        height: \"hug\",\n        flow: \"freeform\",\n        opacity: () => clamp(state.dims[index] ?? 1, 0, 1),\n        children: [\n          Rect({\n            flow: \"horizontal\",\n            gap: () => Math.round(state.legend.textStyle.fontSize === undefined ? 12 : Number(state.legend.textStyle.fontSize) * 0.4),\n            align: \"center\",\n            width: \"hug\",\n            height: \"hug\",\n            opacity: () => arrivalOf(state.arrivals, index).opacity,\n            x: () => arrivalOf(state.arrivals, index).shift,\n            children: [\n              Rect({\n                width: () => marker().width,\n                height: () => marker().height,\n                cornerRadius: () => marker().borderRadius,\n                fill: () => state.slices[index]?.fill ?? \"white\",\n              }),\n              Text({\n                ...textOps.styleProps(state.legend.textStyle),\n                fill: () => state.legend.textStyle.fill ?? \"white\",\n                fontSize: () => state.legend.textStyle.fontSize ?? 28,\n                fontWeight: () => state.legend.textStyle.fontWeight ?? 500,\n                text: () => state.slices[index]?.category ?? \"\",\n              }),\n            ],\n          }),\n        ],\n      })\n    )\n  },\n  commands: {\n    ...Paint.commands,\n    /** Every entry shifted right and transparent: what a chart shows ahead of this legend's beat, since `enter` arms only on its first frame. */\n    arm: (timeline, state) =>\n      timeline.animate(() => ({ arrivals: armed([...state.slices.keys()], { opacity: 0, shift: SLIDE }) })),\n    /** Slide and fade entries in from the right, top to bottom. The duration is the whole entrance, the stagger carved out of it. */\n    enter: (timeline, state) => {\n      const count = state.slices.length\n      if (count === 0) return timeline.wait(timeline.duration)\n      const from: Arrival = { opacity: 0, shift: SLIDE }\n      const arm = timeline.animate(() => ({ arrivals: armed([...state.slices.keys()], from) }))\n      // Each gap is a fifth of an entry's move, the axes' rhythm, solved from the budget.\n      const per = timeline.duration / (1 + Math.max(0, count - 1) / 5)\n      const step = per / 5\n      const ease = frameEase(timeline)\n      const entries = state.slices.map((_, i) => ({ at: i * step, duration: per, piece: arrival(timeline, i, from, ease) }))\n      return timeline.together([arm, beats(timeline, entries)])\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\nexport type PieLegend = NodeOf<typeof PieLegend>\n"]}

package/dist/kit/polar.d.ts

@@ -0,0 +1,31 @@
+/** What the polar charts (pie, radial) share: slices, ring geometry, the hole's summary and the selection fade. */
+import { type Fill, type FillResolved, type TextStyle, type Vector2 } from "@motionscript/sdk";
+/** One resolved slice, which the ring and legend consume; the chart resolves it from `data` and two field names. */
+export interface PieSlice {
+    /** Label and legend caption. */
+    category: string;
+    /** The wedge covers `value / (sum of all values)`. */
+    value: number;
+    /** Wedge and swatch paint. */
+    fill: Fill;
+}
+export declare const DEG: number;
+/**
+ * Opacity of a slice under the selection: 1 while nothing is out (`focus` is the
+ * most-grown pop) and for the selected slice itself, falling toward `dimOpacity`
+ * for the rest as the selection grows.
+ */
+export declare function selectionFade(focus: number, dimOpacity: number, pop: number): number;
+/** The point at radius `r`, angle `a` on a ring about the origin in centred y-up space. Angles run clockwise from 12 o'clock. */
+export declare function ringPoint(r: number, a: number): Vector2;
+/** The summary set in the ring's hole. */
+export interface CenterConfig {
+    labelStyle: TextStyle;
+    captionStyle: TextStyle;
+}
+/** How far everything outside the selection fades while any slice is selected; fainter than a gapless chart's, as a ring's slices touch. */
+export declare const PIE_SPOTLIGHT_DIM = 0.15;
+export declare function resolvedFill(fill: Fill): FillResolved[];
+/** Each slice's paint, resolved once per fill object. */
+export declare function ringFills(slices: readonly PieSlice[]): FillResolved[][];
+//# sourceMappingURL=polar.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"polar.d.ts","sourceRoot":"","sources":["../../src/kit/polar.ts"],"names":[],"mappings":"AAAA,mHAAmH;AAEnH,OAAO,EAAkB,KAAK,IAAI,EAAE,KAAK,YAAY,EAAE,KAAK,SAAS,EAAE,KAAK,OAAO,EAAE,MAAM,mBAAmB,CAAA;AAE9G,oHAAoH;AACpH,MAAM,WAAW,QAAQ;IACvB,gCAAgC;IAChC,QAAQ,EAAE,MAAM,CAAA;IAChB,sDAAsD;IACtD,KAAK,EAAE,MAAM,CAAA;IACb,8BAA8B;IAC9B,IAAI,EAAE,IAAI,CAAA;CACX;AAED,eAAO,MAAM,GAAG,QAAgB,CAAA;AAEhC;;;;GAIG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,MAAM,CAGpF;AAED,iIAAiI;AACjI,wBAAgB,SAAS,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,GAAG,OAAO,CAEvD;AAED,0CAA0C;AAC1C,MAAM,WAAW,YAAY;IAC3B,UAAU,EAAE,SAAS,CAAA;IACrB,YAAY,EAAE,SAAS,CAAA;CACxB;AAED,4IAA4I;AAC5I,eAAO,MAAM,iBAAiB,OAAO,CAAA;AAIrC,wBAAgB,YAAY,CAAC,IAAI,EAAE,IAAI,GAAG,YAAY,EAAE,CAKvD;AAED,yDAAyD;AACzD,wBAAgB,SAAS,CAAC,MAAM,EAAE,SAAS,QAAQ,EAAE,GAAG,YAAY,EAAE,EAAE,CAEvE"}

package/dist/kit/polar.js

@@ -0,0 +1,33 @@
+/** What the polar charts (pie, radial) share: slices, ring geometry, the hole's summary and the selection fade. */
+import { clamp, fillOps } from "@motionscript/sdk";
+export const DEG = Math.PI / 180;
+/**
+ * Opacity of a slice under the selection: 1 while nothing is out (`focus` is the
+ * most-grown pop) and for the selected slice itself, falling toward `dimOpacity`
+ * for the rest as the selection grows.
+ */
+export function selectionFade(focus, dimOpacity, pop) {
+    if (focus <= 0)
+        return 1;
+    return 1 - (1 - clamp(dimOpacity, 0, 1)) * focus * (1 - pop);
+}
+/** The point at radius `r`, angle `a` on a ring about the origin in centred y-up space. Angles run clockwise from 12 o'clock. */
+export function ringPoint(r, a) {
+    return { x: r * Math.sin(a), y: r * Math.cos(a) };
+}
+/** How far everything outside the selection fades while any slice is selected; fainter than a gapless chart's, as a ring's slices touch. */
+export const PIE_SPOTLIGHT_DIM = 0.15;
+const resolvedFills = new WeakMap();
+export function resolvedFill(fill) {
+    if (typeof fill !== "object" || fill === null)
+        return fillOps.resolve(fill);
+    let resolved = resolvedFills.get(fill);
+    if (resolved === undefined)
+        resolvedFills.set(fill, resolved = fillOps.resolve(fill));
+    return resolved;
+}
+/** Each slice's paint, resolved once per fill object. */
+export function ringFills(slices) {
+    return slices.map((slice) => resolvedFill(slice.fill));
+}
+//# sourceMappingURL=polar.js.map

package/dist/kit/polar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"polar.js","sourceRoot":"","sources":["../../src/kit/polar.ts"],"names":[],"mappings":"AAAA,mHAAmH;AAEnH,OAAO,EAAE,KAAK,EAAE,OAAO,EAA8D,MAAM,mBAAmB,CAAA;AAY9G,MAAM,CAAC,MAAM,GAAG,GAAG,IAAI,CAAC,EAAE,GAAG,GAAG,CAAA;AAEhC;;;;GAIG;AACH,MAAM,UAAU,aAAa,CAAC,KAAa,EAAE,UAAkB,EAAE,GAAW;IAC1E,IAAI,KAAK,IAAI,CAAC;QAAE,OAAO,CAAC,CAAA;IACxB,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,KAAK,CAAC,UAAU,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,CAAC,GAAG,GAAG,CAAC,CAAA;AAC9D,CAAC;AAED,iIAAiI;AACjI,MAAM,UAAU,SAAS,CAAC,CAAS,EAAE,CAAS;IAC5C,OAAO,EAAE,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAA;AACnD,CAAC;AAQD,4IAA4I;AAC5I,MAAM,CAAC,MAAM,iBAAiB,GAAG,IAAI,CAAA;AAErC,MAAM,aAAa,GAAG,IAAI,OAAO,EAA0B,CAAA;AAE3D,MAAM,UAAU,YAAY,CAAC,IAAU;IACrC,IAAI,OAAO,IAAI,KAAK,QAAQ,IAAI,IAAI,KAAK,IAAI;QAAE,OAAO,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,CAAA;IAC3E,IAAI,QAAQ,GAAG,aAAa,CAAC,GAAG,CAAC,IAAI,CAAC,CAAA;IACtC,IAAI,QAAQ,KAAK,SAAS;QAAE,aAAa,CAAC,GAAG,CAAC,IAAI,EAAE,QAAQ,GAAG,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAA;IACrF,OAAO,QAAQ,CAAA;AACjB,CAAC;AAED,yDAAyD;AACzD,MAAM,UAAU,SAAS,CAAC,MAA2B;IACnD,OAAO,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,YAAY,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC,CAAA;AACxD,CAAC","sourcesContent":["/** What the polar charts (pie, radial) share: slices, ring geometry, the hole's summary and the selection fade. */\n\nimport { clamp, fillOps, type Fill, type FillResolved, type TextStyle, type Vector2 } from \"@motionscript/sdk\"\n\n/** One resolved slice, which the ring and legend consume; the chart resolves it from `data` and two field names. */\nexport interface PieSlice {\n  /** Label and legend caption. */\n  category: string\n  /** The wedge covers `value / (sum of all values)`. */\n  value: number\n  /** Wedge and swatch paint. */\n  fill: Fill\n}\n\nexport const DEG = Math.PI / 180\n\n/**\n * Opacity of a slice under the selection: 1 while nothing is out (`focus` is the\n * most-grown pop) and for the selected slice itself, falling toward `dimOpacity`\n * for the rest as the selection grows.\n */\nexport function selectionFade(focus: number, dimOpacity: number, pop: number): number {\n  if (focus <= 0) return 1\n  return 1 - (1 - clamp(dimOpacity, 0, 1)) * focus * (1 - pop)\n}\n\n/** The point at radius `r`, angle `a` on a ring about the origin in centred y-up space. Angles run clockwise from 12 o'clock. */\nexport function ringPoint(r: number, a: number): Vector2 {\n  return { x: r * Math.sin(a), y: r * Math.cos(a) }\n}\n\n/** The summary set in the ring's hole. */\nexport interface CenterConfig {\n  labelStyle: TextStyle\n  captionStyle: TextStyle\n}\n\n/** How far everything outside the selection fades while any slice is selected; fainter than a gapless chart's, as a ring's slices touch. */\nexport const PIE_SPOTLIGHT_DIM = 0.15\n\nconst resolvedFills = new WeakMap<object, FillResolved[]>()\n\nexport function resolvedFill(fill: Fill): FillResolved[] {\n  if (typeof fill !== \"object\" || fill === null) return fillOps.resolve(fill)\n  let resolved = resolvedFills.get(fill)\n  if (resolved === undefined) resolvedFills.set(fill, resolved = fillOps.resolve(fill))\n  return resolved\n}\n\n/** Each slice's paint, resolved once per fill object. */\nexport function ringFills(slices: readonly PieSlice[]): FillResolved[][] {\n  return slices.map((slice) => resolvedFill(slice.fill))\n}\n\n"]}