@motionscript/charts 0.1.0 → 0.1.1-alpha.1

package/dist/bar-chart/chart-bars.d.ts

@@ -1,129 +1,98 @@
-import { type Fill, type FillResolved, type NodeOf, type Node2D as _Node2D, type Node2DProps, type Shadow, type ShadowResolved, type Stroke, type StrokeResolved, type TextStyle } from "@motionscript/sdk";
+import { type Fill, type FillResolved, type NodeOf, type Node2D, type Node2DProps as _Node2DProps, type TextStyle } from "@motionscript/sdk";
 /**
- * One drawn column, already mapped into the plot's **centred pixel space**
- * (origin at the plot centre, y-up) by the parent {@link BarChart}.
- *
- * `from`/`to` are the two ends of the column rather than a base and a height,
- * for the same reason {@link BarSpan} is a span: it is the one shape that fits a
- * grouped bar, a stacked segment and a negative value without a special case.
+ * One drawn bar in the plot's centred pixel space (origin at the centre, y-up),
+ * mapped by the parent {@link BarChart}: `center` and `thickness` across the
+ * category slot, `from` and `to` along the value axis (y for a column, x for a
+ * horizontal bar). Two ends rather than a base and a length, like `BarSpan`:
+ * one shape fits grouped, stacked and negative.
  */
 export interface BarGeometry {
-    /** Centre x of the column. */
-    x: number;
-    /** Column width in px. */
-    width: number;
-    /** Pixel y of the column's base — the baseline when grouped, the running stack top when stacked. */
+    center: number;
+    thickness: number;
+    /** The base: the baseline when grouped, the running stack end when stacked. */
     from: number;
-    /** Pixel y of its far end, at full {@link ChartBarsProps.growth}. */
+    /** The far end at full growth. */
     to: number;
-    /** Whether the far end takes the theme's corner radius (the stack's cap). */
+    /** Whether the far end takes the corner radius (the stack's last segment on its side). */
     round: boolean;
-    /** The value this column plots, for the figure printed on it. */
-    value: number;
-    /**
-     * The figure printed on it, written as the chart's value axis writes its
-     * ticks, so the two cannot disagree. Absent, the bare marker reading of
-     * {@link value}.
-     */
-    caption?: string;
-}
-export interface ChartBarsProps extends Node2DProps {
-    /** This series' columns, one per row of the chart's data. */
-    bars: BarGeometry[];
-    /** Pixel y of value 0 — where every column grows *from*. */
-    baseline: number;
-    /** Column paint — this series' own, or the theme palette's entry for its index. */
-    fill: Fill;
-    /** Optional outline on every column. */
-    barStroke: Stroke;
-    /** Optional drop shadow on every column. */
-    barShadow: Shadow;
-    /** Radius of the far-end corners, in px. */
-    cornerRadius: number;
-    /**
-     * Rise of every column in `[0, 1]`, measured **about the baseline**: 0
-     * collapses them all onto it, 1 draws them at full length.
-     *
-     * Scaling about the baseline rather than about each column's own base is what
-     * keeps a stack flush mid-animation — every segment's base and end travel by
-     * the same factor, so the segments stay stacked instead of the upper ones
-     * floating above the still-growing lower ones. It also means a negative
-     * column grows *down* out of the same signal.
-     */
-    growth: number;
-    /**
-     * Per-column opacity multiplier, by row index — how the chart's category
-     * spotlight reaches a single column without touching the series it belongs
-     * to. Missing entries read as 1.
-     */
-    dims: number[];
-    /** Whether the figure each column plots is printed on it. */
-    showValues: boolean;
-    /** Type style for those figures. */
-    valueStyle: TextStyle;
-    /**
-     * Whether this series draws at all — the wholesale switch behind
-     * `BarChart.showSeries`/`hideSeries`, alongside the slot weight that animates
-     * the reflow. Off skips the columns *and* their figures.
-     */
-    enabled: boolean;
+    /** The figure printed by the bar; empty for none. */
+    caption: string;
 }
 /**
- * One **series** of a {@link BarChart}, drawn as one command list: its column in
- * every category, plus the figures printed on them.
- *
- * A node per series rather than a node per bar, deliberately — it is the same
- * unit `ChartLine` is, which is what lets `showSeries`/`hideSeries`/
- * `spotlightSeries` mean exactly the same thing on a bar chart as on a line
- * chart: enable the node, or tween its opacity. The columns' *positions* come
- * from the parent (it owns the slot arithmetic both modes share), so this part
- * only has to know how to draw a span and grow it.
- *
- * The figures are real {@link Text} children rather than glyphs in the command
- * list, so they take the theme's type style, are measured by the layout engine,
- * and ride the node's own opacity — which is why hiding the series takes its
- * figures with it for free.
+ * One series of a {@link BarChart}: its bar in every category plus the printed
+ * figures. A node per series, like `ChartLine`, so `showSeries` and
+ * `spotlightSeries` mean the same on both: enable the node or tween its opacity.
+ * Positions come from the parent, which owns the slot arithmetic.
  */
 export declare const ChartBars: import("@motionscript/sdk").Component<"chartBars", import("@motionscript/sdk").Merge<import("@motionscript/sdk").Box2DState, {
     readonly bars: import("@motionscript/sdk").Type<BarGeometry[], BarGeometry[], false>;
+    /** Pixel position of value 0 along the value axis, where every bar grows from. */
     readonly baseline: 0;
+    /** Bars grow along x from a category column rather than along y from a row. */
+    readonly horizontal: false;
     readonly fill: import("@motionscript/sdk").Type<Fill, FillResolved[], false>;
-    readonly barStroke: import("@motionscript/sdk").Type<Stroke, StrokeResolved[], false>;
-    readonly barShadow: import("@motionscript/sdk").Type<Shadow, ShadowResolved[], false>;
-    readonly cornerRadius: number;
+    readonly cornerRadius: 8;
+    /**
+     * Rise of every bar in `[0, 1]` about the baseline, not each bar's own base:
+     * every segment travels by the same factor, so a stack stays flush
+     * mid-animation and a negative bar grows the other way.
+     */
     readonly growth: 1;
+    /** Per-bar opacity by row index, how the category spotlight reaches one bar. Missing reads as 1. */
     readonly dims: import("@motionscript/sdk").Type<number[], number[], false>;
-    readonly showValues: false;
+    /** Read as built: whether each bar prints its figure, and where. */
+    readonly values: import("@motionscript/sdk").Type<"end" | "inside" | "none", "end" | "inside" | "none", false>;
     readonly valueStyle: import("@motionscript/sdk").Type<TextStyle, TextStyle, false>;
+    /** The wholesale switch behind `showSeries`/`hideSeries`; off skips the bars and their figures. */
     readonly enabled: true;
 }>, {
     readonly enter: unknown;
-}, null, _Node2D<Node2DProps>, import("@motionscript/sdk").CallProps<import("@motionscript/sdk").Merge<import("@motionscript/sdk").Box2DState, {
+}, null, Node2D<_Node2DProps>, import("@motionscript/sdk").CallProps<import("@motionscript/sdk").Merge<import("@motionscript/sdk").Box2DState, {
     readonly bars: import("@motionscript/sdk").Type<BarGeometry[], BarGeometry[], false>;
+    /** Pixel position of value 0 along the value axis, where every bar grows from. */
     readonly baseline: 0;
+    /** Bars grow along x from a category column rather than along y from a row. */
+    readonly horizontal: false;
     readonly fill: import("@motionscript/sdk").Type<Fill, FillResolved[], false>;
-    readonly barStroke: import("@motionscript/sdk").Type<Stroke, StrokeResolved[], false>;
-    readonly barShadow: import("@motionscript/sdk").Type<Shadow, ShadowResolved[], false>;
-    readonly cornerRadius: number;
+    readonly cornerRadius: 8;
+    /**
+     * Rise of every bar in `[0, 1]` about the baseline, not each bar's own base:
+     * every segment travels by the same factor, so a stack stays flush
+     * mid-animation and a negative bar grows the other way.
+     */
     readonly growth: 1;
+    /** Per-bar opacity by row index, how the category spotlight reaches one bar. Missing reads as 1. */
     readonly dims: import("@motionscript/sdk").Type<number[], number[], false>;
-    readonly showValues: false;
+    /** Read as built: whether each bar prints its figure, and where. */
+    readonly values: import("@motionscript/sdk").Type<"end" | "inside" | "none", "end" | "inside" | "none", false>;
     readonly valueStyle: import("@motionscript/sdk").Type<TextStyle, TextStyle, false>;
+    /** The wholesale switch behind `showSeries`/`hideSeries`; off skips the bars and their figures. */
     readonly enabled: true;
 }>, null, import("@motionscript/sdk").BuiltNode<import("@motionscript/sdk").Merge<import("@motionscript/sdk").Box2DState, {
     readonly bars: import("@motionscript/sdk").Type<BarGeometry[], BarGeometry[], false>;
+    /** Pixel position of value 0 along the value axis, where every bar grows from. */
     readonly baseline: 0;
+    /** Bars grow along x from a category column rather than along y from a row. */
+    readonly horizontal: false;
     readonly fill: import("@motionscript/sdk").Type<Fill, FillResolved[], false>;
-    readonly barStroke: import("@motionscript/sdk").Type<Stroke, StrokeResolved[], false>;
-    readonly barShadow: import("@motionscript/sdk").Type<Shadow, ShadowResolved[], false>;
-    readonly cornerRadius: number;
+    readonly cornerRadius: 8;
+    /**
+     * Rise of every bar in `[0, 1]` about the baseline, not each bar's own base:
+     * every segment travels by the same factor, so a stack stays flush
+     * mid-animation and a negative bar grows the other way.
+     */
     readonly growth: 1;
+    /** Per-bar opacity by row index, how the category spotlight reaches one bar. Missing reads as 1. */
     readonly dims: import("@motionscript/sdk").Type<number[], number[], false>;
-    readonly showValues: false;
+    /** Read as built: whether each bar prints its figure, and where. */
+    readonly values: import("@motionscript/sdk").Type<"end" | "inside" | "none", "end" | "inside" | "none", false>;
     readonly valueStyle: import("@motionscript/sdk").Type<TextStyle, TextStyle, false>;
+    /** The wholesale switch behind `showSeries`/`hideSeries`; off skips the bars and their figures. */
     readonly enabled: true;
 }>, {
     readonly enter: unknown;
-}, _Node2D<Node2DProps>>>>;
+}, Node2D<_Node2DProps>>>>;
 export type ChartBars = NodeOf<typeof ChartBars>;
+/** A figure as the bar prints it when the chart gives no caption. */
+export declare function barCaption(value: number): string;
 //# sourceMappingURL=chart-bars.d.ts.map

package/dist/bar-chart/chart-bars.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"chart-bars.d.ts","sourceRoot":"","sources":["../../src/bar-chart/chart-bars.ts"],"names":[],"mappings":"AAAA,OAAO,EASL,KAAK,IAAI,EACT,KAAK,YAAY,EACjB,KAAK,MAAM,EAEX,KAAK,MAAM,IAAI,OAAO,EACtB,KAAK,WAAW,EAChB,KAAK,MAAM,EACX,KAAK,cAAc,EACnB,KAAK,MAAM,EACX,KAAK,cAAc,EACnB,KAAK,SAAS,EACf,MAAM,mBAAmB,CAAA;AAQ1B;;;;;;;GAOG;AACH,MAAM,WAAW,WAAW;IAC1B,8BAA8B;IAC9B,CAAC,EAAE,MAAM,CAAA;IACT,0BAA0B;IAC1B,KAAK,EAAE,MAAM,CAAA;IACb,oGAAoG;IACpG,IAAI,EAAE,MAAM,CAAA;IACZ,qEAAqE;IACrE,EAAE,EAAE,MAAM,CAAA;IACV,6EAA6E;IAC7E,KAAK,EAAE,OAAO,CAAA;IACd,iEAAiE;IACjE,KAAK,EAAE,MAAM,CAAA;IACb;;;;OAIG;IACH,OAAO,CAAC,EAAE,MAAM,CAAA;CACjB;AASD,MAAM,WAAW,cAAe,SAAQ,WAAW;IACjD,6DAA6D;IAC7D,IAAI,EAAE,WAAW,EAAE,CAAA;IACnB,4DAA4D;IAC5D,QAAQ,EAAE,MAAM,CAAA;IAChB,mFAAmF;IACnF,IAAI,EAAE,IAAI,CAAA;IACV,wCAAwC;IACxC,SAAS,EAAE,MAAM,CAAA;IACjB,4CAA4C;IAC5C,SAAS,EAAE,MAAM,CAAA;IACjB,4CAA4C;IAC5C,YAAY,EAAE,MAAM,CAAA;IACpB;;;;;;;;;OASG;IACH,MAAM,EAAE,MAAM,CAAA;IACd;;;;OAIG;IACH,IAAI,EAAE,MAAM,EAAE,CAAA;IACd,6DAA6D;IAC7D,UAAU,EAAE,OAAO,CAAA;IACnB,oCAAoC;IACpC,UAAU,EAAE,SAAS,CAAA;IACrB;;;;OAIG;IACH,OAAO,EAAE,OAAO,CAAA;CACjB;AA6ED;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;0BAuFpB,CAAA;AAEF,MAAM,MAAM,SAAS,GAAG,MAAM,CAAC,OAAO,SAAS,CAAC,CAAA"}
+{"version":3,"file":"chart-bars.d.ts","sourceRoot":"","sources":["../../src/bar-chart/chart-bars.ts"],"names":[],"mappings":"AAAA,OAAO,EAOL,KAAK,IAAI,EACT,KAAK,YAAY,EACjB,KAAK,MAAM,EAEX,KAAK,MAAM,EACX,KAAK,WAAW,IAAI,YAAY,EAChC,KAAK,SAAS,EACf,MAAM,mBAAmB,CAAA;AAS1B;;;;;;GAMG;AACH,MAAM,WAAW,WAAW;IAC1B,MAAM,EAAE,MAAM,CAAA;IACd,SAAS,EAAE,MAAM,CAAA;IACjB,+EAA+E;IAC/E,IAAI,EAAE,MAAM,CAAA;IACZ,kCAAkC;IAClC,EAAE,EAAE,MAAM,CAAA;IACV,0FAA0F;IAC1F,KAAK,EAAE,OAAO,CAAA;IACd,qDAAqD;IACrD,OAAO,EAAE,MAAM,CAAA;CAChB;AAoDD;;;;;GAKG;AACH,eAAO,MAAM,SAAS;;IAIlB,kFAAkF;;IAElF,+EAA+E;;;;IAI/E;;;;OAIG;;IAEH,oGAAoG;;IAEpG,oEAAoE;;;IAGpE,mGAAmG;;;;;;IAjBnG,kFAAkF;;IAElF,+EAA+E;;;;IAI/E;;;;OAIG;;IAEH,oGAAoG;;IAEpG,oEAAoE;;;IAGpE,mGAAmG;;;;IAjBnG,kFAAkF;;IAElF,+EAA+E;;;;IAI/E;;;;OAIG;;IAEH,oGAAoG;;IAEpG,oEAAoE;;;IAGpE,mGAAmG;;;;0BA8DrG,CAAA;AAEF,MAAM,MAAM,SAAS,GAAG,MAAM,CAAC,OAAO,SAAS,CAAC,CAAA;AAEhD,qEAAqE;AACrE,wBAAgB,UAAU,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAEhD"}

package/dist/bar-chart/chart-bars.js

@@ -1,139 +1,107 @@
-import { Graphics2D, Text, Types, component2d, fillOps, shadowOps, strokeOps, textOps, } from "@motionscript/sdk";
-import { fresh } from "../kit/entries.js";
+import { Graphics2D, Text, Types, clamp, component2d, fillOps, } from "@motionscript/sdk";
+import { boundText } from "../kit/cartesian.js";
+import { asParts, fresh } from "../kit/entries.js";
 import { frameEase } from "../kit/motion.js";
 import { loadPaints } from "../kit/paints.js";
-import { clampUnit, formatMarker } from "../kit/shared.js";
-import { DEFAULT_BAR_CHART_THEME } from "./shared.js";
-/** Gap between a grouped column's end and the figure printed over it, in px. */
-const VALUE_GAP = 10;
-/** A segment shorter than this many multiples of the type size prints no figure. */
-const VALUE_FIT = 1.6;
-/** Fallback type size when the theme's value style leaves it unset or autofit. */
-const VALUE_SIZE = 24;
-/**
- * How far column `i` is dimmed — the chart's category spotlight, and the series
- * switch on top of it.
- *
- * The captions read this rather than being hidden by `render`'s guard: they are
- * real child nodes, so a `return` in the draw would leave them on screen over a
- * series that isn't there.
- */
+import { formatMarker } from "../kit/shared.js";
+import { inkOn } from "./shared.js";
+/** A figure inside a bar needs this much room around it, in multiples of the type size. */
+const INSIDE_ROOM = 0.6;
+/** Bar `i`'s dimming: the category spotlight, then the series switch. */
 function dimAt(s, index) {
     if (!s.enabled)
         return 0;
-    return clampUnit(s.dims[index] ?? 1);
+    return clamp(s.dims[index] ?? 1, 0, 1);
 }
-/** The two ends of column `i` at the current growth. */
+/** Bar `i`'s two ends as grown so far, along the value axis. */
 function endsAt(s, index) {
     const bar = s.bars[index];
     if (!bar)
         return null;
-    const g = clampUnit(s.growth);
+    const g = clamp(s.growth, 0, 1);
     return { base: s.baseline + (bar.from - s.baseline) * g, end: s.baseline + (bar.to - s.baseline) * g };
 }
-/** The type size the figures are set at, guarding the autofit/unset cases. */
-function valueSize(s) {
-    const size = s.valueStyle.fontSize;
-    return typeof size === "number" ? size : VALUE_SIZE;
-}
-/** Whether column `i`'s figure sits inside the column (a stacked segment) or past its end. */
-function insideAt(s, index) {
-    const bar = s.bars[index];
-    return bar !== undefined && Math.abs(bar.from - s.baseline) > 0.5;
-}
-/**
- * The figure printed on column `i`, or `""` where there is no room for it.
- *
- * Blanking the text rather than dropping the node keeps the caption list
- * index-aligned with the columns, so a chart that rescales into more room simply
- * starts printing again.
- */
-function captionAt(s, index) {
-    const bar = s.bars[index];
-    if (!bar || bar.value === 0)
-        return "";
-    // An interior segment prints inside itself, so it has to be tall enough to
-    // hold a line of type; a grouped column prints in the headroom above its end,
-    // where the only constraint is the plot's own top.
-    if (insideAt(s, index)) {
-        const ends = endsAt(s, index);
-        if (!ends)
-            return "";
-        if (Math.abs(ends.end - ends.base) < valueSize(s) * VALUE_FIT)
-            return "";
-    }
-    return bar.caption ?? formatMarker(bar.value);
+function sizeOf(style) {
+    return typeof style.fontSize === "number" ? style.fontSize : 24;
 }
-/** Where column `i`'s figure sits, in the node's centred y-up space. */
-function captionY(s, index) {
+/** Where bar `i`'s figure sits along the value axis: past its end, or in its middle. */
+function captionAlong(s, index, extent) {
     const ends = endsAt(s, index);
     if (!ends)
         return 0;
-    if (insideAt(s, index))
+    if (s.values === "inside")
         return (ends.base + ends.end) / 2;
-    // Text is centred on its `y`, so clear the column's end by the gap plus half a
-    // line — on whichever side of the baseline the column actually reached.
     const direction = ends.end >= ends.base ? 1 : -1;
-    return ends.end + direction * (VALUE_GAP + valueSize(s) / 2);
+    return ends.end + direction * (sizeOf(s.valueStyle) * 0.4 + extent / 2);
+}
+/** Whether bar `i` has room for a figure `extent` long inside it. */
+function fitsInside(s, index, extent, across) {
+    const bar = s.bars[index];
+    const ends = endsAt(s, index);
+    if (!bar || !ends)
+        return false;
+    const room = sizeOf(s.valueStyle) * INSIDE_ROOM;
+    return Math.abs(ends.end - ends.base) >= extent + room && bar.thickness >= across;
 }
 /**
- * One **series** of a {@link BarChart}, drawn as one command list: its column in
- * every category, plus the figures printed on them.
- *
- * A node per series rather than a node per bar, deliberately — it is the same
- * unit `ChartLine` is, which is what lets `showSeries`/`hideSeries`/
- * `spotlightSeries` mean exactly the same thing on a bar chart as on a line
- * chart: enable the node, or tween its opacity. The columns' *positions* come
- * from the parent (it owns the slot arithmetic both modes share), so this part
- * only has to know how to draw a span and grow it.
- *
- * The figures are real {@link Text} children rather than glyphs in the command
- * list, so they take the theme's type style, are measured by the layout engine,
- * and ride the node's own opacity — which is why hiding the series takes its
- * figures with it for free.
+ * One series of a {@link BarChart}: its bar in every category plus the printed
+ * figures. A node per series, like `ChartLine`, so `showSeries` and
+ * `spotlightSeries` mean the same on both: enable the node or tween its opacity.
+ * Positions come from the parent, which owns the slot arithmetic.
  */
 export const ChartBars = component2d({
     key: "chartBars",
     state: {
         bars: fresh(() => []),
+        /** Pixel position of value 0 along the value axis, where every bar grows from. */
         baseline: 0,
+        /** Bars grow along x from a category column rather than along y from a row. */
+        horizontal: false,
         fill: Types.custom([], { resolve: fillOps.resolve, lerp: fillOps.lerp }),
-        barStroke: Types.custom(DEFAULT_BAR_CHART_THEME.bar.stroke, { resolve: strokeOps.resolve, lerp: strokeOps.lerp }),
-        barShadow: Types.custom(DEFAULT_BAR_CHART_THEME.bar.shadow, { resolve: shadowOps.resolve, lerp: shadowOps.lerp }),
-        cornerRadius: DEFAULT_BAR_CHART_THEME.bar.cornerRadius,
+        cornerRadius: 8,
+        /**
+         * Rise of every bar in `[0, 1]` about the baseline, not each bar's own base:
+         * every segment travels by the same factor, so a stack stays flush
+         * mid-animation and a negative bar grows the other way.
+         */
         growth: 1,
+        /** Per-bar opacity by row index, how the category spotlight reaches one bar. Missing reads as 1. */
         dims: fresh(() => []),
-        showValues: false,
-        valueStyle: Types.custom(DEFAULT_BAR_CHART_THEME.valueStyle),
+        /** Read as built: whether each bar prints its figure, and where. */
+        values: Types.custom("none"),
+        valueStyle: Types.custom({ fontSize: 24, fill: "white" }),
+        /** The wholesale switch behind `showSeries`/`hideSeries`; off skips the bars and their figures. */
         enabled: true,
     },
-    // A plain node filled its parent; one made of its figures would hug them.
+    // A node made of its figures would otherwise hug them.
     defaults: { width: "fill", height: "fill" },
-    // One caption per column, built once (the row count is fixed at construction,
-    // like an axis's marker count) and bound to the live geometry so it travels
-    // with its column as the chart grows, rescales or reflows.
+    // One figure per bar, built once (the row count is fixed at construction)
+    // and bound to the live geometry so it travels with its bar.
     children: (state) => {
-        if (!state.showValues)
+        if (state.values === "none")
             return [];
-        return state.bars.map((_, i) => Text({
-            ...textOps.styleProps(state.valueStyle),
-            text: () => captionAt(state, i),
-            x: () => state.bars[i]?.x ?? 0,
-            y: () => captionY(state, i),
-            opacity: () => dimAt(state, i),
+        return asParts(state.bars.map((_, i) => {
+            const caption = new Text({
+                ...boundText(() => ({ ...state.valueStyle, ...(state.values === "inside" && { fill: inkOn(state.fill) }) })),
+                text: () => state.bars[i]?.caption ?? "",
+                x: () => (state.horizontal ? captionAlong(state, i, caption.layoutBounds.width) : (state.bars[i]?.center ?? 0)),
+                y: () => (state.horizontal ? (state.bars[i]?.center ?? 0) : captionAlong(state, i, caption.layoutBounds.height)),
+                opacity: () => {
+                    const box = caption.layoutBounds;
+                    const along = state.horizontal ? box.width : box.height;
+                    const across = state.horizontal ? box.height : box.width;
+                    if (state.values === "inside" && !fitsInside(state, i, along, across))
+                        return 0;
+                    // A figure past the end rises in with its bar's last stretch.
+                    return dimAt(state, i) * clamp((state.growth - 0.6) / 0.4, 0, 1);
+                },
+            });
+            return caption;
         }));
     },
-    // The column stroke and shadow are named past the conventional slots, so they are named here.
-    load: (loader, state) => loadPaints(loader, { fills: [state.fill], shadows: [state.barShadow], strokes: [state.barStroke] }),
+    load: (loader, state) => loadPaints(loader, { fills: [state.fill] }),
     commands: {
-        /**
-         * Raise every column from the baseline by tweening `growth` `0 → 1`.
-         *
-         * The mirror of `ChartLine.enter`: same contract that the resting state is
-         * the finished one, so the chart arms this back to 0 before animating rather
-         * than the node hiding itself at construction. No priming to 0 first: the
-         * value at `t` is a function of `t`, so a repeat call re-raises by definition.
-         */
+        /** Raise every bar from the baseline (`growth` 0 to 1). The resting state is the finished one; the chart arms it back to 0. */
         enter: (timeline) => {
             const ease = frameEase(timeline);
             return timeline.animate((t) => ({ growth: ease(t) }));
@@ -144,38 +112,33 @@ export const ChartBars = component2d({
             for (let i = 0; i < state.bars.length; i++) {
                 const bar = state.bars[i];
                 const ends = endsAt(state, i);
-                if (!ends || bar.width <= 0)
+                if (!ends || bar.thickness <= 0)
                     continue;
-                const height = Math.abs(ends.end - ends.base);
-                if (height <= 0)
+                // A segment inside a stack reaches a pixel under the next, so no seam of background shows between them.
+                const seam = bar.round ? 0 : 1;
+                const length = Math.abs(ends.end - ends.base) + seam;
+                if (length <= seam)
                     continue;
-                const radius = bar.round ? Math.min(state.cornerRadius, height) : 0;
-                // A column per `Graphics2D` rather than one list for the series: the
-                // category spotlight dims individual columns, and opacity is a property
-                // of the command list rather than of a shape within it.
-                const g = new Graphics2D();
-                const rect = g.rect({
-                    x: bar.x,
-                    y: (ends.base + ends.end) / 2,
-                    width: bar.width,
-                    height,
-                    // Corner keys are visual (the renderer keeps them in y-up author space),
-                    // so a column reaching *up* rounds its `top*` corners and one reaching
-                    // down its `bottom*` ones. Only the far end rounds, which is what makes
-                    // a stack read as a single capped column.
-                    cornerRadius: radius > 0
-                        ? ends.end >= ends.base
-                            ? { topLeft: radius, topRight: radius, bottomLeft: 0, bottomRight: 0 }
-                            : { bottomLeft: radius, bottomRight: radius, topLeft: 0, topRight: 0 }
-                        : 0,
-                });
-                rect.shadow(state.barShadow);
-                rect.fill(state.fill);
-                rect.stroke(state.barStroke);
+                const radius = bar.round ? Math.max(0, Math.min(state.cornerRadius, length, bar.thickness / 2)) : 0;
+                const forward = ends.end >= ends.base;
+                const mid = (ends.base + ends.end) / 2 + (forward ? seam : -seam) / 2;
+                // Corner keys are visual (y-up): only the far end rounds.
+                const far = state.horizontal
+                    ? (forward ? { topRight: radius, bottomRight: radius, topLeft: 0, bottomLeft: 0 } : { topLeft: radius, bottomLeft: radius, topRight: 0, bottomRight: 0 })
+                    : (forward ? { topLeft: radius, topRight: radius, bottomLeft: 0, bottomRight: 0 } : { bottomLeft: radius, bottomRight: radius, topLeft: 0, topRight: 0 });
+                // One `Graphics2D` per bar: opacity belongs to the command list, and the spotlight dims single bars.
+                const g = new Graphics2D().rect(state.horizontal
+                    ? { x: mid, y: bar.center, width: length, height: bar.thickness, cornerRadius: radius > 0 ? far : 0 }
+                    : { x: bar.center, y: mid, width: bar.thickness, height: length, cornerRadius: radius > 0 ? far : 0 });
+                g.fill(state.fill);
                 ctx.draw(g.opacity(dimAt(state, i)));
             }
         }
         ctx.children();
     },
 });
+/** A figure as the bar prints it when the chart gives no caption. */
+export function barCaption(value) {
+    return value === 0 ? "" : formatMarker(value);
+}
 //# sourceMappingURL=chart-bars.js.map

package/dist/bar-chart/chart-bars.js.map

@@ -1 +1 @@
-{"version":3,"file":"chart-bars.js","sourceRoot":"","sources":["../../src/bar-chart/chart-bars.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  Graphics2D,\n  Text,\n  Types,\n  component2d,\n  fillOps,\n  shadowOps,\n  strokeOps,\n  textOps,\n  type Fill,\n  type FillResolved,\n  type NodeOf,\n  // Named so this component's emitted type reaches `Node2D` through the sdk, not core.\n  type Node2D as _Node2D,\n  type Node2DProps,\n  type Shadow,\n  type ShadowResolved,\n  type Stroke,\n  type StrokeResolved,\n  type TextStyle,\n} from \"@motionscript/sdk\"\n\nimport { fresh } from \"../kit/entries\"\nimport { frameEase } from \"../kit/motion\"\nimport { loadPaints } from \"../kit/paints\"\nimport { clampUnit, formatMarker } from \"../kit/shared\"\nimport { DEFAULT_BAR_CHART_THEME } from \"./shared\"\n\n/**\n * One drawn column, already mapped into the plot's **centred pixel space**\n * (origin at the plot centre, y-up) by the parent {@link BarChart}.\n *\n * `from`/`to` are the two ends of the column rather than a base and a height,\n * for the same reason {@link BarSpan} is a span: it is the one shape that fits a\n * grouped bar, a stacked segment and a negative value without a special case.\n */\nexport interface BarGeometry {\n  /** Centre x of the column. */\n  x: number\n  /** Column width in px. */\n  width: number\n  /** Pixel y of the column's base — the baseline when grouped, the running stack top when stacked. */\n  from: number\n  /** Pixel y of its far end, at full {@link ChartBarsProps.growth}. */\n  to: number\n  /** Whether the far end takes the theme's corner radius (the stack's cap). */\n  round: boolean\n  /** The value this column plots, for the figure printed on it. */\n  value: number\n  /**\n   * The figure printed on it, written as the chart's value axis writes its\n   * ticks, so the two cannot disagree. Absent, the bare marker reading of\n   * {@link value}.\n   */\n  caption?: string\n}\n\n/** Gap between a grouped column's end and the figure printed over it, in px. */\nconst VALUE_GAP = 10\n/** A segment shorter than this many multiples of the type size prints no figure. */\nconst VALUE_FIT = 1.6\n/** Fallback type size when the theme's value style leaves it unset or autofit. */\nconst VALUE_SIZE = 24\n\nexport interface ChartBarsProps extends Node2DProps {\n  /** This series' columns, one per row of the chart's data. */\n  bars: BarGeometry[]\n  /** Pixel y of value 0 — where every column grows *from*. */\n  baseline: number\n  /** Column paint — this series' own, or the theme palette's entry for its index. */\n  fill: Fill\n  /** Optional outline on every column. */\n  barStroke: Stroke\n  /** Optional drop shadow on every column. */\n  barShadow: Shadow\n  /** Radius of the far-end corners, in px. */\n  cornerRadius: number\n  /**\n   * Rise of every column in `[0, 1]`, measured **about the baseline**: 0\n   * collapses them all onto it, 1 draws them at full length.\n   *\n   * Scaling about the baseline rather than about each column's own base is what\n   * keeps a stack flush mid-animation — every segment's base and end travel by\n   * the same factor, so the segments stay stacked instead of the upper ones\n   * floating above the still-growing lower ones. It also means a negative\n   * column grows *down* out of the same signal.\n   */\n  growth: number\n  /**\n   * Per-column opacity multiplier, by row index — how the chart's category\n   * spotlight reaches a single column without touching the series it belongs\n   * to. Missing entries read as 1.\n   */\n  dims: number[]\n  /** Whether the figure each column plots is printed on it. */\n  showValues: boolean\n  /** Type style for those figures. */\n  valueStyle: TextStyle\n  /**\n   * Whether this series draws at all — the wholesale switch behind\n   * `BarChart.showSeries`/`hideSeries`, alongside the slot weight that animates\n   * the reflow. Off skips the columns *and* their figures.\n   */\n  enabled: boolean\n}\n\n/** What the column geometry reads. */\ninterface Columns {\n  readonly bars: readonly BarGeometry[]\n  readonly baseline: number\n  readonly growth: number\n  readonly dims: readonly number[]\n  readonly enabled: boolean\n  readonly valueStyle: TextStyle\n}\n\n/**\n * How far column `i` is dimmed — the chart's category spotlight, and the series\n * switch on top of it.\n *\n * The captions read this rather than being hidden by `render`'s guard: they are\n * real child nodes, so a `return` in the draw would leave them on screen over a\n * series that isn't there.\n */\nfunction dimAt(s: Columns, index: number): number {\n  if (!s.enabled) return 0\n  return clampUnit(s.dims[index] ?? 1)\n}\n\n/** The two ends of column `i` at the current growth. */\nfunction endsAt(s: Columns, index: number): { base: number; end: number } | null {\n  const bar = s.bars[index]\n  if (!bar) return null\n  const g = clampUnit(s.growth)\n  return { base: s.baseline + (bar.from - s.baseline) * g, end: s.baseline + (bar.to - s.baseline) * g }\n}\n\n/** The type size the figures are set at, guarding the autofit/unset cases. */\nfunction valueSize(s: Columns): number {\n  const size = s.valueStyle.fontSize\n  return typeof size === \"number\" ? size : VALUE_SIZE\n}\n\n/** Whether column `i`'s figure sits inside the column (a stacked segment) or past its end. */\nfunction insideAt(s: Columns, index: number): boolean {\n  const bar = s.bars[index]\n  return bar !== undefined && Math.abs(bar.from - s.baseline) > 0.5\n}\n\n/**\n * The figure printed on column `i`, or `\"\"` where there is no room for it.\n *\n * Blanking the text rather than dropping the node keeps the caption list\n * index-aligned with the columns, so a chart that rescales into more room simply\n * starts printing again.\n */\nfunction captionAt(s: Columns, index: number): string {\n  const bar = s.bars[index]\n  if (!bar || bar.value === 0) return \"\"\n  // An interior segment prints inside itself, so it has to be tall enough to\n  // hold a line of type; a grouped column prints in the headroom above its end,\n  // where the only constraint is the plot's own top.\n  if (insideAt(s, index)) {\n    const ends = endsAt(s, index)\n    if (!ends) return \"\"\n    if (Math.abs(ends.end - ends.base) < valueSize(s) * VALUE_FIT) return \"\"\n  }\n  return bar.caption ?? formatMarker(bar.value)\n}\n\n/** Where column `i`'s figure sits, in the node's centred y-up space. */\nfunction captionY(s: Columns, index: number): number {\n  const ends = endsAt(s, index)\n  if (!ends) return 0\n  if (insideAt(s, index)) return (ends.base + ends.end) / 2\n  // Text is centred on its `y`, so clear the column's end by the gap plus half a\n  // line — on whichever side of the baseline the column actually reached.\n  const direction = ends.end >= ends.base ? 1 : -1\n  return ends.end + direction * (VALUE_GAP + valueSize(s) / 2)\n}\n\n/**\n * One **series** of a {@link BarChart}, drawn as one command list: its column in\n * every category, plus the figures printed on them.\n *\n * A node per series rather than a node per bar, deliberately — it is the same\n * unit `ChartLine` is, which is what lets `showSeries`/`hideSeries`/\n * `spotlightSeries` mean exactly the same thing on a bar chart as on a line\n * chart: enable the node, or tween its opacity. The columns' *positions* come\n * from the parent (it owns the slot arithmetic both modes share), so this part\n * only has to know how to draw a span and grow it.\n *\n * The figures are real {@link Text} children rather than glyphs in the command\n * list, so they take the theme's type style, are measured by the layout engine,\n * and ride the node's own opacity — which is why hiding the series takes its\n * figures with it for free.\n */\nexport const ChartBars = component2d({\n  key: \"chartBars\",\n  state: {\n    bars: fresh<BarGeometry[]>(() => []),\n    baseline: 0,\n    fill: Types.custom<Fill, FillResolved[]>([], { resolve: fillOps.resolve, lerp: fillOps.lerp }),\n    barStroke: Types.custom<Stroke, StrokeResolved[]>(DEFAULT_BAR_CHART_THEME.bar.stroke, { resolve: strokeOps.resolve, lerp: strokeOps.lerp }),\n    barShadow: Types.custom<Shadow, ShadowResolved[]>(DEFAULT_BAR_CHART_THEME.bar.shadow, { resolve: shadowOps.resolve, lerp: shadowOps.lerp }),\n    cornerRadius: DEFAULT_BAR_CHART_THEME.bar.cornerRadius,\n    growth: 1,\n    dims: fresh<number[]>(() => []),\n    showValues: false,\n    valueStyle: Types.custom<TextStyle>(DEFAULT_BAR_CHART_THEME.valueStyle),\n    enabled: true,\n  },\n  // A plain node filled its parent; one made of its figures would hug them.\n  defaults: { width: \"fill\", height: \"fill\" },\n  // One caption per column, built once (the row count is fixed at construction,\n  // like an axis's marker count) and bound to the live geometry so it travels\n  // with its column as the chart grows, rescales or reflows.\n  children: (state) => {\n    if (!state.showValues) return []\n    return state.bars.map((_, i) =>\n      Text({\n        ...textOps.styleProps(state.valueStyle),\n        text: () => captionAt(state, i),\n        x: () => state.bars[i]?.x ?? 0,\n        y: () => captionY(state, i),\n        opacity: () => dimAt(state, i),\n      })\n    )\n  },\n  // The column stroke and shadow are named past the conventional slots, so they are named here.\n  load: (loader, state) =>\n    loadPaints(loader, { fills: [state.fill], shadows: [state.barShadow], strokes: [state.barStroke] }),\n  commands: {\n    /**\n     * Raise every column from the baseline by tweening `growth` `0 → 1`.\n     *\n     * The mirror of `ChartLine.enter`: same contract that the resting state is\n     * the finished one, so the chart arms this back to 0 before animating rather\n     * than the node hiding itself at construction. No priming to 0 first: the\n     * value at `t` is a function of `t`, so a repeat call re-raises by definition.\n     */\n    enter: (timeline) => {\n      const ease = frameEase(timeline)\n      return timeline.animate((t) => ({ growth: ease(t) }))\n    },\n  },\n  render: (ctx, state) => {\n    if (state.enabled) {\n      for (let i = 0; i < state.bars.length; i++) {\n        const bar = state.bars[i]\n        const ends = endsAt(state, i)\n        if (!ends || bar.width <= 0) continue\n        const height = Math.abs(ends.end - ends.base)\n        if (height <= 0) continue\n\n        const radius = bar.round ? Math.min(state.cornerRadius, height) : 0\n        // A column per `Graphics2D` rather than one list for the series: the\n        // category spotlight dims individual columns, and opacity is a property\n        // of the command list rather than of a shape within it.\n        const g = new Graphics2D()\n        const rect = g.rect({\n          x: bar.x,\n          y: (ends.base + ends.end) / 2,\n          width: bar.width,\n          height,\n          // Corner keys are visual (the renderer keeps them in y-up author space),\n          // so a column reaching *up* rounds its `top*` corners and one reaching\n          // down its `bottom*` ones. Only the far end rounds, which is what makes\n          // a stack read as a single capped column.\n          cornerRadius:\n            radius > 0\n              ? ends.end >= ends.base\n                ? { topLeft: radius, topRight: radius, bottomLeft: 0, bottomRight: 0 }\n                : { bottomLeft: radius, bottomRight: radius, topLeft: 0, topRight: 0 }\n              : 0,\n        })\n        rect.shadow(state.barShadow)\n        rect.fill(state.fill)\n        rect.stroke(state.barStroke)\n        ctx.draw(g.opacity(dimAt(state, i)))\n      }\n    }\n    ctx.children()\n  },\n})\n\nexport type ChartBars = NodeOf<typeof ChartBars>\n"]}
+{"version":3,"file":"chart-bars.js","sourceRoot":"","sources":["../../src/bar-chart/chart-bars.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  Graphics2D,\n  Text,\n  Types,\n  clamp,\n  component2d,\n  fillOps,\n  type Fill,\n  type FillResolved,\n  type NodeOf,\n  // Named so this component's emitted type reaches `Node2D` and its props through the sdk, not core.\n  type Node2D,\n  type Node2DProps as _Node2DProps,\n  type TextStyle,\n} from \"@motionscript/sdk\"\n\nimport { boundText } from \"../kit/cartesian\"\nimport { asParts, fresh } from \"../kit/entries\"\nimport { frameEase } from \"../kit/motion\"\nimport { loadPaints } from \"../kit/paints\"\nimport { formatMarker } from \"../kit/shared\"\nimport { inkOn } from \"./shared\"\n\n/**\n * One drawn bar in the plot's centred pixel space (origin at the centre, y-up),\n * mapped by the parent {@link BarChart}: `center` and `thickness` across the\n * category slot, `from` and `to` along the value axis (y for a column, x for a\n * horizontal bar). Two ends rather than a base and a length, like `BarSpan`:\n * one shape fits grouped, stacked and negative.\n */\nexport interface BarGeometry {\n  center: number\n  thickness: number\n  /** The base: the baseline when grouped, the running stack end when stacked. */\n  from: number\n  /** The far end at full growth. */\n  to: number\n  /** Whether the far end takes the corner radius (the stack's last segment on its side). */\n  round: boolean\n  /** The figure printed by the bar; empty for none. */\n  caption: string\n}\n\n/** A figure inside a bar needs this much room around it, in multiples of the type size. */\nconst INSIDE_ROOM = 0.6\n\ninterface Bars {\n  readonly bars: readonly BarGeometry[]\n  readonly baseline: number\n  readonly horizontal: boolean\n  readonly growth: number\n  readonly dims: readonly number[]\n  readonly enabled: boolean\n  readonly values: \"none\" | \"end\" | \"inside\"\n  readonly valueStyle: TextStyle\n}\n\n/** Bar `i`'s dimming: the category spotlight, then the series switch. */\nfunction dimAt(s: Bars, index: number): number {\n  if (!s.enabled) return 0\n  return clamp(s.dims[index] ?? 1, 0, 1)\n}\n\n/** Bar `i`'s two ends as grown so far, along the value axis. */\nfunction endsAt(s: Bars, index: number): { base: number; end: number } | null {\n  const bar = s.bars[index]\n  if (!bar) return null\n  const g = clamp(s.growth, 0, 1)\n  return { base: s.baseline + (bar.from - s.baseline) * g, end: s.baseline + (bar.to - s.baseline) * g }\n}\n\nfunction sizeOf(style: TextStyle): number {\n  return typeof style.fontSize === \"number\" ? style.fontSize : 24\n}\n\n/** Where bar `i`'s figure sits along the value axis: past its end, or in its middle. */\nfunction captionAlong(s: Bars, index: number, extent: number): number {\n  const ends = endsAt(s, index)\n  if (!ends) return 0\n  if (s.values === \"inside\") return (ends.base + ends.end) / 2\n  const direction = ends.end >= ends.base ? 1 : -1\n  return ends.end + direction * (sizeOf(s.valueStyle) * 0.4 + extent / 2)\n}\n\n/** Whether bar `i` has room for a figure `extent` long inside it. */\nfunction fitsInside(s: Bars, index: number, extent: number, across: number): boolean {\n  const bar = s.bars[index]\n  const ends = endsAt(s, index)\n  if (!bar || !ends) return false\n  const room = sizeOf(s.valueStyle) * INSIDE_ROOM\n  return Math.abs(ends.end - ends.base) >= extent + room && bar.thickness >= across\n}\n\n/**\n * One series of a {@link BarChart}: its bar in every category plus the printed\n * figures. A node per series, like `ChartLine`, so `showSeries` and\n * `spotlightSeries` mean the same on both: enable the node or tween its opacity.\n * Positions come from the parent, which owns the slot arithmetic.\n */\nexport const ChartBars = component2d({\n  key: \"chartBars\",\n  state: {\n    bars: fresh<BarGeometry[]>(() => []),\n    /** Pixel position of value 0 along the value axis, where every bar grows from. */\n    baseline: 0,\n    /** Bars grow along x from a category column rather than along y from a row. */\n    horizontal: false,\n    fill: Types.custom<Fill, FillResolved[]>([], { resolve: fillOps.resolve, lerp: fillOps.lerp }),\n    cornerRadius: 8,\n    /**\n     * Rise of every bar in `[0, 1]` about the baseline, not each bar's own base:\n     * every segment travels by the same factor, so a stack stays flush\n     * mid-animation and a negative bar grows the other way.\n     */\n    growth: 1,\n    /** Per-bar opacity by row index, how the category spotlight reaches one bar. Missing reads as 1. */\n    dims: fresh<number[]>(() => []),\n    /** Read as built: whether each bar prints its figure, and where. */\n    values: Types.custom<\"none\" | \"end\" | \"inside\">(\"none\"),\n    valueStyle: Types.custom<TextStyle>({ fontSize: 24, fill: \"white\" }),\n    /** The wholesale switch behind `showSeries`/`hideSeries`; off skips the bars and their figures. */\n    enabled: true,\n  },\n  // A node made of its figures would otherwise hug them.\n  defaults: { width: \"fill\", height: \"fill\" },\n  // One figure per bar, built once (the row count is fixed at construction)\n  // and bound to the live geometry so it travels with its bar.\n  children: (state) => {\n    if (state.values === \"none\") return []\n    return asParts(state.bars.map((_, i) => {\n      const caption: Node2D = new Text({\n        ...boundText(() => ({ ...state.valueStyle, ...(state.values === \"inside\" && { fill: inkOn(state.fill) }) })),\n        text: () => state.bars[i]?.caption ?? \"\",\n        x: () => (state.horizontal ? captionAlong(state, i, caption.layoutBounds.width) : (state.bars[i]?.center ?? 0)),\n        y: () => (state.horizontal ? (state.bars[i]?.center ?? 0) : captionAlong(state, i, caption.layoutBounds.height)),\n        opacity: () => {\n          const box = caption.layoutBounds\n          const along = state.horizontal ? box.width : box.height\n          const across = state.horizontal ? box.height : box.width\n          if (state.values === \"inside\" && !fitsInside(state, i, along, across)) return 0\n          // A figure past the end rises in with its bar's last stretch.\n          return dimAt(state, i) * clamp((state.growth - 0.6) / 0.4, 0, 1)\n        },\n      }) as unknown as Node2D\n      return caption\n    }))\n  },\n  load: (loader, state) => loadPaints(loader, { fills: [state.fill] }),\n  commands: {\n    /** Raise every bar from the baseline (`growth` 0 to 1). The resting state is the finished one; the chart arms it back to 0. */\n    enter: (timeline) => {\n      const ease = frameEase(timeline)\n      return timeline.animate((t) => ({ growth: ease(t) }))\n    },\n  },\n  render: (ctx, state) => {\n    if (state.enabled) {\n      for (let i = 0; i < state.bars.length; i++) {\n        const bar = state.bars[i]\n        const ends = endsAt(state, i)\n        if (!ends || bar.thickness <= 0) continue\n        // A segment inside a stack reaches a pixel under the next, so no seam of background shows between them.\n        const seam = bar.round ? 0 : 1\n        const length = Math.abs(ends.end - ends.base) + seam\n        if (length <= seam) continue\n        const radius = bar.round ? Math.max(0, Math.min(state.cornerRadius, length, bar.thickness / 2)) : 0\n        const forward = ends.end >= ends.base\n        const mid = (ends.base + ends.end) / 2 + (forward ? seam : -seam) / 2\n        // Corner keys are visual (y-up): only the far end rounds.\n        const far = state.horizontal\n          ? (forward ? { topRight: radius, bottomRight: radius, topLeft: 0, bottomLeft: 0 } : { topLeft: radius, bottomLeft: radius, topRight: 0, bottomRight: 0 })\n          : (forward ? { topLeft: radius, topRight: radius, bottomLeft: 0, bottomRight: 0 } : { bottomLeft: radius, bottomRight: radius, topLeft: 0, topRight: 0 })\n        // One `Graphics2D` per bar: opacity belongs to the command list, and the spotlight dims single bars.\n        const g = new Graphics2D().rect(state.horizontal\n          ? { x: mid, y: bar.center, width: length, height: bar.thickness, cornerRadius: radius > 0 ? far : 0 }\n          : { x: bar.center, y: mid, width: bar.thickness, height: length, cornerRadius: radius > 0 ? far : 0 })\n        g.fill(state.fill)\n        ctx.draw(g.opacity(dimAt(state, i)))\n      }\n    }\n    ctx.children()\n  },\n})\n\nexport type ChartBars = NodeOf<typeof ChartBars>\n\n/** A figure as the bar prints it when the chart gives no caption. */\nexport function barCaption(value: number): string {\n  return value === 0 ? \"\" : formatMarker(value)\n}\n"]}

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

@@ -1,16 +1,8 @@
-/**
- * The bar chart: grouped or stacked columns off a category axis.
- *
- * Shares the plot panel, the value axis and the legend with the line chart —
- * which is what lets a scene swap one for the other without re-theming — and
- * brings its own category axis, since a band scale is not a continuous one.
- */
 export { BarChart, barChartDomain } from "./bar-chart.js";
-export type { BarChartDomain, BarChartProps, BarChartValues } from "./bar-chart.js";
+export type { BarChartDomain, BarChartStyle, BarChartValues } from "./bar-chart.js";
 export { ChartBars } from "./chart-bars.js";
-export type { BarGeometry, ChartBarsProps } from "./chart-bars.js";
-export { CategoryAxis } from "./category-axis.js";
-export type { CategoryAxisProps } from "./category-axis.js";
-export { DEFAULT_BAR_CHART_THEME, barCategories, barSpans, barValueExtent, lerpBarChartTheme, resolveBarChartTheme, resolveBarFill, resolveBarScale, stackCapIndex, } from "./shared.js";
-export type { BarChartConfig, BarChartTheme, BarSeries, BarSpan, BarStyleConfig, } from "./shared.js";
+export type { BarGeometry } from "./chart-bars.js";
+export { CategoryAxis, slotCentre } from "./category-axis.js";
+export { BAR_LABELS, BAR_MARKS, barCategories, barSpans, barValueExtent, inkOn, resolveBarScale, } from "./shared.js";
+export type { BarOrientation, BarSeries, BarSpan, BarStack, } from "./shared.js";
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/bar-chart/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,OAAO,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,aAAa,CAAA;AACtD,YAAY,EAAE,cAAc,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,aAAa,CAAA;AAChF,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AACxC,YAAY,EAAE,WAAW,EAAE,cAAc,EAAE,MAAM,cAAc,CAAA;AAC/D,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAC9C,YAAY,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAA;AACxD,OAAO,EACL,uBAAuB,EACvB,aAAa,EACb,QAAQ,EACR,cAAc,EACd,iBAAiB,EACjB,oBAAoB,EACpB,cAAc,EACd,eAAe,EACf,aAAa,GACd,MAAM,UAAU,CAAA;AACjB,YAAY,EACV,cAAc,EACd,aAAa,EACb,SAAS,EACT,OAAO,EACP,cAAc,GACf,MAAM,UAAU,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/bar-chart/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,aAAa,CAAA;AACtD,YAAY,EAAE,cAAc,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,aAAa,CAAA;AAChF,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AACxC,YAAY,EAAE,WAAW,EAAE,MAAM,cAAc,CAAA;AAC/C,OAAO,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAA;AAC1D,OAAO,EACL,UAAU,EACV,SAAS,EACT,aAAa,EACb,QAAQ,EACR,cAAc,EACd,KAAK,EACL,eAAe,GAChB,MAAM,UAAU,CAAA;AACjB,YAAY,EACV,cAAc,EACd,SAAS,EACT,OAAO,EACP,QAAQ,GACT,MAAM,UAAU,CAAA"}

package/dist/bar-chart/index.js

@@ -1,12 +1,5 @@
-/**
- * The bar chart: grouped or stacked columns off a category axis.
- *
- * Shares the plot panel, the value axis and the legend with the line chart —
- * which is what lets a scene swap one for the other without re-theming — and
- * brings its own category axis, since a band scale is not a continuous one.
- */
 export { BarChart, barChartDomain } from "./bar-chart.js";
 export { ChartBars } from "./chart-bars.js";
-export { CategoryAxis } from "./category-axis.js";
-export { DEFAULT_BAR_CHART_THEME, barCategories, barSpans, barValueExtent, lerpBarChartTheme, resolveBarChartTheme, resolveBarFill, resolveBarScale, stackCapIndex, } from "./shared.js";
+export { CategoryAxis, slotCentre } from "./category-axis.js";
+export { BAR_LABELS, BAR_MARKS, barCategories, barSpans, barValueExtent, inkOn, resolveBarScale, } from "./shared.js";
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/bar-chart/index.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AACH,OAAO,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,aAAa,CAAA;AAEtD,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAExC,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAE9C,OAAO,EACL,uBAAuB,EACvB,aAAa,EACb,QAAQ,EACR,cAAc,EACd,iBAAiB,EACjB,oBAAoB,EACpB,cAAc,EACd,eAAe,EACf,aAAa,GACd,MAAM,UAAU,CAAA","sourcesContent":["/**\n * The bar chart: grouped or stacked columns off a category axis.\n *\n * Shares the plot panel, the value axis and the legend with the line chart —\n * which is what lets a scene swap one for the other without re-theming — and\n * brings its own category axis, since a band scale is not a continuous one.\n */\nexport { BarChart, barChartDomain } from \"./bar-chart\"\nexport type { BarChartDomain, BarChartProps, BarChartValues } from \"./bar-chart\"\nexport { ChartBars } from \"./chart-bars\"\nexport type { BarGeometry, ChartBarsProps } from \"./chart-bars\"\nexport { CategoryAxis } from \"./category-axis\"\nexport type { CategoryAxisProps } from \"./category-axis\"\nexport {\n  DEFAULT_BAR_CHART_THEME,\n  barCategories,\n  barSpans,\n  barValueExtent,\n  lerpBarChartTheme,\n  resolveBarChartTheme,\n  resolveBarFill,\n  resolveBarScale,\n  stackCapIndex,\n} from \"./shared\"\nexport type {\n  BarChartConfig,\n  BarChartTheme,\n  BarSeries,\n  BarSpan,\n  BarStyleConfig,\n} from \"./shared\"\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/bar-chart/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,cAAc,EAAE,MAAM,aAAa,CAAA;AAEtD,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAExC,OAAO,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAA;AAC1D,OAAO,EACL,UAAU,EACV,SAAS,EACT,aAAa,EACb,QAAQ,EACR,cAAc,EACd,KAAK,EACL,eAAe,GAChB,MAAM,UAAU,CAAA","sourcesContent":["export { BarChart, barChartDomain } from \"./bar-chart\"\nexport type { BarChartDomain, BarChartStyle, BarChartValues } from \"./bar-chart\"\nexport { ChartBars } from \"./chart-bars\"\nexport type { BarGeometry } from \"./chart-bars\"\nexport { CategoryAxis, slotCentre } from \"./category-axis\"\nexport {\n  BAR_LABELS,\n  BAR_MARKS,\n  barCategories,\n  barSpans,\n  barValueExtent,\n  inkOn,\n  resolveBarScale,\n} from \"./shared\"\nexport type {\n  BarOrientation,\n  BarSeries,\n  BarSpan,\n  BarStack,\n} from \"./shared\"\n"]}