@fundar/data-chart-telling 1.18.0 → 1.19.0

package/dist/layout/hover/HoverShapes.js

@@ -1,13 +1,30 @@
 import { MarkerStyles } from '../../phases/markers/MarkerStyles';
 import { SERIES_KEY } from '../../phases/transforms/TransformsPhase';
+import { RowStyle } from '../../markers/utils/RowStyle';
 /**
  * The look the plot's hover markers give the shapes of every marker linked to the hover (`hover: true` or
  * `'style'`): the hovered ones take `active`, the others `others`, each over the shape's own style. A shape
  * the legend dims keeps its own fill and opacities; one the hover cannot reach (hidden, omitted) is untouched.
+ *
+ * The marker stays one marker over all its rows, whatever is hovered: each style the hover sets is a function of
+ * the row that asks the hover how it reaches it. Moving the pointer then only draws the marker's shapes again in
+ * their new look - their rows and options do not change, so svelteplot never works the plot's scales out again
+ * (it does so from every mark's data and options, and a style with no scale is never read for them).
  */
 export class HoverShapes {
     /** What the legend owns on a dimmed shape. */
-    static #LEGEND_KEYS = ['fill', 'fillOpacity', 'strokeOpacity'];
+    static #LEGEND_KEYS = new Set(['fill', 'fillOpacity', 'strokeOpacity']);
+    /** The fields that draw a shape's outline. */
+    static #OUTLINE_KEYS = [
+        'stroke',
+        'strokeWidth',
+        'strokeOpacity',
+        'strokeDasharray'
+    ];
+    /** The fields that hold an opacity, fully opaque unless set. */
+    static #OPACITY_KEYS = new Set(['fillOpacity', 'strokeOpacity']);
+    /** The fields that hold a color: a string is the field of the rows it names, else the color itself. */
+    static #COLOR_KEYS = new Set(['fill', 'stroke']);
     /** A shape style's field as a `dot` marker names it. */
     static #DOT_KEYS = {
         fill: 'dotFill',
@@ -18,8 +35,15 @@ export class HoverShapes {
         strokeDasharray: 'dotStrokeDasharray'
     };
     #rules;
+    /** The fields any rule sets, in either role. */
+    #fields;
     constructor(markers) {
         this.#rules = markers.filter((m) => m.type === 'hover' && !!(m.active || m.others));
+        this.#fields = [
+            ...new Set(this.#rules.flatMap((rule) => [rule.active, rule.others].flatMap((style) => Object.entries(style ?? {})
+                .filter(([, value]) => value !== undefined)
+                .map(([name]) => name))))
+        ];
     }
     /** Whether any hover marker restyles shapes. */
     get any() {
@@ -31,73 +55,109 @@ export class HoverShapes {
         return hover === true || hover === 'style';
     }
     /**
-     * `marker` in parts, each drawing the rows the hover styles alike - the shapes it does not style first, the
-     * hovered ones last, so their outline is on top. A marker the hover does not style is one part, as it is.
+     * `marker` with each style the hover sets as a function of the row: the hovered rows take `active`, the others
+     * `others`, and while nothing is hovered every row its own style. A marker the hover does not style is returned
+     * as it is. `rows` are what the marker draws without `data` of its own.
+     *
+     * The outline `active` sets is not the shape's own: {@link outline} draws it over every shape, whole.
      */
-    split(marker, rows, reach) {
-        const whole = [{ key: '', marker }];
+    styled(marker, rows, reach) {
+        return this.#styled(marker, rows, reach, false);
+    }
+    /** {@link styled}, with `active`'s outline on the shapes themselves when `outlined`. */
+    #styled(marker, rows, reach, outlined) {
         if (!this.any || !HoverShapes.links(marker))
-            return whole;
+            return marker;
+        const own = { ...marker.styles };
         const data = (marker.data ?? rows);
-        const buckets = new Map();
-        for (const row of data) {
-            const key = this.#signature(row, reach);
-            const bucket = buckets.get(key) ?? buckets.set(key, []).get(key);
-            bucket.push(row);
+        const isDot = marker.type === 'dot';
+        const styles = { ...own };
+        for (const field of this.#fields) {
+            const name = isDot ? HoverShapes.#DOT_KEYS[field] : field;
+            const base = HoverShapes.#reader(field, own[name], data);
+            styles[name] = (row, index) => {
+                const value = this.#hovered(field, row, index, reach, outlined);
+                return value === undefined ? base(row, index) : value;
+            };
         }
-        if (buckets.size === 1 && buckets.has(''))
-            return whole;
-        const plain = (key) => !key.includes('a');
-        return [...buckets.entries()]
-            .sort(([a], [b]) => Number(plain(b)) - Number(plain(a)))
-            .map(([key, part]) => ({
-            key,
-            marker: key === '' ? { ...marker, data: part } : this.#restyled(marker, part, key, reach)
-        }));
+        return MarkerStyles.restyle({ ...marker, styles }, { cfg: reach.cfg, rows: [...data] });
+    }
+    /** Whether any rule outlines the hovered shapes: an `active` that sets one of the stroke's fields. */
+    get outlines() {
+        return this.#rules.some((rule) => HoverShapes.#outlining(rule));
     }
     /**
-     * How the hover styles `row`: for each rule, `a` (active), `o` (other) or `-` (not at all), and `~` when the
-     * legend dims it. `''` while no rule styles it.
+     * The outline of `marker`'s hovered shapes, to draw over every shape of the plot: the marker over its hovered
+     * rows only, with no fill, no label and no pointer of its own. A shape is drawn in its marker's order, so its
+     * neighbours drawn after it would cover part of its outline - a treemap's tile, a heatmap's cell with no gap.
+     * `undefined` when no rule outlines the shapes or nothing of the marker is hovered.
      */
-    #signature(row, reach) {
-        const own = row[SERIES_KEY];
-        const roles = this.#rules.map((rule) => {
-            if (rule.series !== undefined && own !== rule.series)
-                return '-';
-            const role = reach.roleOf(row, rule.series);
-            if (role === 'active')
-                return rule.active ? 'a' : '-';
-            if (role === 'other')
-                return rule.others ? 'o' : '-';
-            return '-';
-        });
-        if (roles.every((role) => role === '-'))
-            return '';
-        return roles.join('') + (reach.dimmed(row) ? '~' : '');
+    outline(marker, rows, reach) {
+        if (!this.outlines || !HoverShapes.links(marker))
+            return undefined;
+        const rules = this.#rules.filter((rule) => HoverShapes.#outlining(rule));
+        const data = (marker.data ?? rows).filter((row) => rules.some((rule) => (rule.series === undefined || row?.[SERIES_KEY] === rule.series) &&
+            reach.roleOf(row, rule.series) === 'active'));
+        if (data.length === 0)
+            return undefined;
+        const styled = this.#styled(marker, rows, reach, true);
+        const isDot = marker.type === 'dot';
+        const unfilled = isDot
+            ? { dotFill: 'none', dotFillOpacity: 0 }
+            : { fill: 'none', fillOpacity: 0 };
+        const rest = Object.fromEntries(Object.entries(styled).filter(([key]) => key !== 'label' && key !== 'hover' && !key.startsWith('on')));
+        return {
+            ...rest,
+            data,
+            styles: { ...styled.styles, ...unfilled }
+        };
     }
-    /** `marker` over `rows`, with the styles `key` stands for over its own. */
-    #restyled(marker, rows, key, reach) {
-        const dimmed = key.endsWith('~');
-        const styles = this.#rules.reduce((merged, rule, i) => {
-            const role = key[i];
-            const style = role === 'a' ? rule.active : role === 'o' ? rule.others : undefined;
-            return {
-                ...merged,
-                ...HoverShapes.#named(HoverShapes.#defined(style, dimmed), marker)
-            };
-        }, { ...marker.styles });
-        return MarkerStyles.restyle({ ...marker, data: rows, styles }, { cfg: reach.cfg, rows });
+    static #outlining(rule) {
+        const active = rule.active ?? {};
+        return HoverShapes.#OUTLINE_KEYS.some((key) => active[key] !== undefined);
     }
-    /** `style` as `marker` names its fields: a `dot` marker's are its `dot` ones (`dotFill`...). */
-    static #named(style, marker) {
-        if (marker.type !== 'dot')
-            return style;
-        const keys = HoverShapes.#DOT_KEYS;
-        return Object.fromEntries(Object.entries(style).map(([name, value]) => [keys[name] ?? name, value]));
+    /**
+     * What the hover sets `field` to on `row` - the last rule that reaches the row and sets it wins - or `undefined`
+     * when none does: the row is not hovered, or the legend dims it and `field` is the legend's. An outline `active`
+     * sets is left to the outline drawn over every shape, unless `outlined`.
+     */
+    #hovered(field, row, index, reach, outlined) {
+        let value;
+        let dimmed;
+        for (const rule of this.#rules) {
+            if (rule.series !== undefined && row?.[SERIES_KEY] !== rule.series)
+                continue;
+            const role = reach.roleOf(row, rule.series);
+            const style = role === 'active' ? rule.active : role === 'other' ? rule.others : undefined;
+            const own = style?.[field];
+            if (own === undefined)
+                continue;
+            if (role === 'active' &&
+                !outlined &&
+                HoverShapes.#OUTLINE_KEYS.includes(field) &&
+                HoverShapes.#outlining(rule))
+                continue;
+            dimmed ??= HoverShapes.#LEGEND_KEYS.has(field) && reach.dimmed(row);
+            if (dimmed)
+                return undefined;
+            value = typeof own === 'function' ? own(row, index) : own;
+        }
+        return value;
     }
-    /** `style`'s set values, without what the legend owns on a dimmed shape. */
-    static #defined(style, dimmed) {
-        return Object.fromEntries(Object.entries(style ?? {}).filter(([name, value]) => value !== undefined &&
-            !(dimmed && HoverShapes.#LEGEND_KEYS.includes(name))));
+    /** How the shape's own `style` for `field` reads on a row, as the marker would draw it. */
+    static #reader(field, style, rows) {
+        if (typeof style === 'function')
+            return style;
+        // An opacity is a channel of the mark, and svelteplot leaves out a row whose channel reads nothing.
+        if (style === undefined && HoverShapes.#OPACITY_KEYS.has(field))
+            return () => 1;
+        if (typeof style !== 'string' || field === 'strokeDasharray')
+            return () => style;
+        if (HoverShapes.#COLOR_KEYS.has(field)) {
+            const color = RowStyle.colorOf(style, rows);
+            return color ? (row) => color(row) : () => style;
+        }
+        // A number (an opacity, a width) a string names the field of.
+        return (row) => row?.[style];
     }
 }

package/dist/layout/margins/Box.d.ts

@@ -37,6 +37,10 @@ export declare class Box {
     get empty(): boolean;
     /** How far this box reaches out from its origin (the point it sits around), in whole pixels. */
     get reach(): Margins;
+    /** Whether this box and `other` share any area. */
+    intersects(other: Box): boolean;
+    /** Whether this box lies wholly inside `bounds`. */
+    inside(bounds: Box): boolean;
     /** This box grown by `px` on every side. */
     pad(px: number): Box;
     /**

package/dist/layout/margins/Box.js

@@ -61,6 +61,20 @@ export class Box {
     get reach() {
         return this.overflow(Box.size(0, 0));
     }
+    /** Whether this box and `other` share any area. */
+    intersects(other) {
+        return (this.left < other.right &&
+            other.left < this.right &&
+            this.top < other.bottom &&
+            other.top < this.bottom);
+    }
+    /** Whether this box lies wholly inside `bounds`. */
+    inside(bounds) {
+        return (this.left >= bounds.left &&
+            this.right <= bounds.right &&
+            this.top >= bounds.top &&
+            this.bottom <= bounds.bottom);
+    }
     /** This box grown by `px` on every side. */
     pad(px) {
         return new Box(this.x - px, this.y - px, this.width + 2 * px, this.height + 2 * px);

package/dist/layout/margins/PlotMargins.svelte.js

@@ -1,4 +1,5 @@
 import { getContext, setContext } from 'svelte';
+import { get } from 'svelte/store';
 import { Margins } from './Margins';
 import { Box } from './Box';
 import { CellAlignment } from '../grid/GridAlignment.svelte';
@@ -27,6 +28,17 @@ export class PlotMargins {
     #settled;
     /** What svelteplot's own `<Plot>` lays the plot out by, once {@link follow} is handed it. */
     #plot = $state.raw();
+    /** The room svelteplot's axes ask of each side, whether or not it is `'auto'`, once {@link follow} reads it. */
+    #autoMargins = $state.raw();
+    #auto = $derived.by(() => {
+        const maps = this.#autoMargins;
+        if (!maps)
+            return {};
+        return Object.fromEntries(Margins.SIDES.flatMap((side) => {
+            const values = [...maps[side].values()];
+            return values.length ? [[side, Math.max(...values)]] : [];
+        }));
+    });
     constructor(inputs) {
         this.#inputs = inputs;
         setContext(PLOT_MARGINS_KEY, this);
@@ -124,6 +136,10 @@ export class PlotMargins {
      */
     follow(plot) {
         this.#plot = plot;
+        const stores = getContext('svelteplot/autoMargins');
+        if (stores) {
+            this.#autoMargins = Object.fromEntries(Margins.SIDES.map((side) => [side, get(stores[PlotMargins.#AUTO_STORE[side]])]));
+        }
         const cell = this.#cell;
         if (!cell)
             return;
@@ -132,6 +148,12 @@ export class PlotMargins {
             cell.report(new Margins(Number(marginTop) || 0, Number(marginRight) || 0, Number(marginBottom) || 0, Number(marginLeft) || 0));
         });
     }
+    static #AUTO_STORE = {
+        top: 'autoMarginTop',
+        right: 'autoMarginRight',
+        bottom: 'autoMarginBottom',
+        left: 'autoMarginLeft'
+    };
     /** The room the `reserve` boxes take past the edges their points can sit on. */
     #reserved = $derived.by(() => this.#inputs.reserve().reduce((room, { box, edges }) => {
         const reach = box.reach;
@@ -143,7 +165,10 @@ export class PlotMargins {
         const settled = this.#settled;
         const { width, height } = this.#inputs.size();
         const growth = this.#measured.max(this.#reserved).min(Margins.half(width, height));
-        const estimate = this.#inputs.estimate();
+        // A side grows from at least the room svelteplot's axes take on it: their ticks and title.
+        const estimate = this.#inputs
+            .estimate()
+            .map((value, side) => Math.max(value, this.#auto[side] ?? 0));
         const out = {};
         for (const side of Margins.SIDES) {
             const own = author?.[side];

package/dist/layout/plot/{Plot.svelte.d.ts → AbstractPlot.svelte.d.ts}

@@ -45,6 +45,6 @@ interface $$IsomorphicComponent {
     <TRow extends Record<string, unknown>, TScales extends object, TCore extends PlotCoreBase>(internal: unknown, props: ReturnType<__sveltets_Render<TRow, TScales, TCore>['props']> & {}): ReturnType<__sveltets_Render<TRow, TScales, TCore>['exports']>;
     z_$$bindings?: ReturnType<__sveltets_Render<any, any, any>['bindings']>;
 }
-declare const Plot: $$IsomorphicComponent;
-type Plot<TRow extends Record<string, unknown>, TScales extends object, TCore extends PlotCoreBase> = InstanceType<typeof Plot<TRow, TScales, TCore>>;
-export default Plot;
+declare const AbstractPlot: $$IsomorphicComponent;
+type AbstractPlot<TRow extends Record<string, unknown>, TScales extends object, TCore extends PlotCoreBase> = InstanceType<typeof AbstractPlot<TRow, TScales, TCore>>;
+export default AbstractPlot;

package/dist/layout/styles/ValueLabels.d.ts

@@ -2,16 +2,22 @@ import { Box } from '../margins/Box';
 import { PlotAxes } from '../../phases/data/PlotAxes';
 import type { PlotRowContext } from '../../types/layout/context';
 import type { PlotStylesConfig } from '../../types/configuration/styling';
-import type { ValuesStyle } from '../../types/layout/styles';
+import type { ValuesFontStyle, ValuesStyle } from '../../types/layout/styles';
 import type { ValueLabelsOptions } from '../../types/phases/styles/phase';
 import type { Series } from '../../types/plots/data/common';
 import type { FontStyle, StrokeStyle } from '../../types/plots/styling';
-import type { LabelAnchor, TextAnchor, ValueAnchor } from '../../types/plots/constants';
 import type { BoxAnchors, EdgeBox } from '../../types/layout/box';
 import type { MarginSide } from '../../types/plots/props';
 import type { AxisPlotEnv, AxisPlotState, ProcessedData, ProcessedRow } from '../../types/phases';
 import type { TextMarkerConfig } from '../../types/markers/common';
-import type { TextLabelConfig } from '../../types/markers/basic/text';
+import type { LabelLayout, MarkerLabelConfig } from '../../types/markers/labels/common';
+import type { PointGeometryOf, PointLabelConfig, PointSide } from '../../types/markers/labels/point';
+/** One part of each row a plot labels, with where its label sits and how it writes it. */
+type ValuePart = {
+    name: string;
+    placement: Record<string, unknown>;
+    format: (value: number, row?: object, series?: string, part?: string) => string;
+};
 /**
  * A plot's value labels: the author's `styles.values` over the plot kind's
  * own defaults, how their text measures, where they are expected to sit
@@ -21,15 +27,24 @@ import type { TextLabelConfig } from '../../types/markers/basic/text';
 export declare class ValueLabels {
     #private;
     readonly show: boolean;
-    readonly anchor: ValueAnchor;
+    /** How the labels are laid out on their shapes: the author's `layout`, else the kind's. */
+    readonly layout: LabelLayout;
+    /** The options that place a label in its {@link layout}: the author's over the kind's own for it. */
+    readonly placement: Record<string, unknown>;
+    /** The parts of each row labelled - a simple plot's one `value`, a box's `median`... - each with its own options. */
+    readonly parts: ValuePart[];
+    /** The series whose rows are labelled, when `styles.values.series` names some; every series else. */
+    readonly series: string[] | undefined;
+    /** Whether the author gave the labels a text of their own, beyond the value. */
+    readonly formatted: boolean;
     /**
      * A label's text for `value`: the author's `format`, else the kind's, else the value as the display fields ask.
      * `row` is the row it labels, whose context the format reads; `series` names its series where there is no row
-     * (a label measured ahead of the rows).
+     * (a label measured ahead of the rows); `part`, which of the row's values it writes.
      */
-    readonly format: (value: number, row?: object, series?: string) => string;
+    readonly format: (value: number, row?: object, series?: string, part?: string) => string;
     readonly hoverIsolate: boolean;
-    readonly font: FontStyle | undefined;
+    readonly font: ValuesFontStyle | undefined;
     readonly fontSize: number;
     /** The connectors of labels that had to move apart. */
     readonly strokeStyle: StrokeStyle | undefined;
@@ -39,11 +54,45 @@ export declare class ValueLabels {
     readonly declutter: PlotStylesConfig['text']['declutter'];
     /** Where the labels are expected to sit: boxes around their points, on the edges those can reach. */
     readonly reach: EdgeBox[];
-    constructor(values: ValuesStyle | undefined, cfg: PlotStylesConfig, options?: Omit<ValueLabelsOptions<never>, 'reach'>, reach?: (labels: ValueLabels) => EdgeBox[]);
+    constructor(values: ValuesStyle | undefined, cfg: PlotStylesConfig, options?: Omit<ValueLabelsOptions<never>, 'reach' | 'layout' | 'layouts' | 'parts' | 'formatFor'> & {
+        layout?: LabelLayout;
+        layouts?: Partial<Record<LabelLayout, Record<string, unknown>>>;
+        parts?: {
+            placements: Record<string, Record<string, unknown>>;
+            default: string[];
+        };
+    }, reach?: (labels: ValueLabels) => EdgeBox[]);
+    /** Whether the part named `name` is labelled: a plot writing its `value` on its own shapes asks first. */
+    writes(name: string): boolean;
+    /** Whether the labels draw: `show` as set, else when any other option of them is set, else the kind's default. */
+    static shows(values: ValuesStyle | undefined, fallback?: boolean): boolean;
     /** The context a label's `format` reads: its row's, with `series` when the row gives none. */
     static contextOf(row: object | undefined, series?: string): PlotRowContext;
+    /**
+     * The value a label writes for `row`, read off its context: its `value`, or one `part` of it on a plot whose rows
+     * have several. `undefined` when it is not a number.
+     */
+    static valueIn(row: object | undefined, part?: string): number | undefined;
+    /** A label's text for `row`: its context's `part` (its `value` by default), as that part's format writes it. */
+    text(row: object, part?: string): string;
     /** A plot's value labels: `values` over `options`, the kind's own defaults, their reach read off `state`. */
     static build<TState>(values: ValuesStyle | undefined, cfg: PlotStylesConfig, options: ValueLabelsOptions<TState>, state: TState): ValueLabels;
+    /** Whether the labels sit past the tip of their shapes, where the plot's margins keep room for them. */
+    get pastTip(): boolean;
+    /**
+     * The `label` a plot kind's shapes write their value in, in this plot's {@link layout}: `text`, over what every
+     * label shares ({@link hooks}). Inside its shape a label takes no `fill` of its own, so it is written in the color
+     * that reads best on the shape; past it, the plot's `fill`.
+     */
+    label<TLabel extends MarkerLabelConfig = MarkerLabelConfig>(env: AxisPlotEnv, text: (row: ProcessedRow) => string, defaults?: {
+        fill?: string;
+        fontSize?: number;
+        fontWeight?: FontStyle['fontWeight'];
+        /** The rows `styles.values.select` picks: a `'point'` label writes only theirs. */
+        labelled?: readonly ProcessedRow[];
+        /** A row's series color, which `color: 'series'` writes a label off its shape in. */
+        seriesColor?: (row: ProcessedRow) => string | undefined;
+    }): TLabel;
     /** The configuration the labels were built under, for a plot kind's own label defaults. */
     get config(): PlotStylesConfig;
     /**
@@ -56,8 +105,8 @@ export declare class ValueLabels {
     get lineHeight(): number;
     /** The box one label's `text` takes. */
     textBox(text: string): Box;
-    /** The labels' gap (px) from their mark along `axis`: their own `dx`/`dy`, else `fallback`. */
-    offset(axis: 'x' | 'y', fallback?: number): number;
+    /** The labels' gap (px) from their mark: the layout's `gap`, else `fallback`. */
+    offset(fallback?: number): number;
     /**
      * Where a label reading `text` sits around its point: anchored `at` that
      * offset from it (its `dx`/`dy`), on `side` of that anchor per axis - the
@@ -76,48 +125,12 @@ export declare class ValueLabels {
         series: S;
         value: number;
     }[];
-    /**
-     * The author's own `textAnchor`, if any. `'outside'` is a hover marker's
-     * per-point anchor; a label's own `anchor` already places it, so here it
-     * counts as unset.
-     */
-    get textAnchor(): Exclude<TextAnchor, 'outside'> | undefined;
     /**
      * What every label marker shares: the plot's margins grow to fit it, it
      * dims with its row's series, and with `hoverIsolate`, hovering it
      * isolates that series. A row without a series gets the margins only.
      */
     hooks(env: AxisPlotEnv): Pick<TextMarkerConfig, 'fitMargins' | 'onpointerenter' | 'onpointerleave' | 'styles'>;
-    /**
-     * Where in a bar a label goes, from the `anchor` of `styles.values`: its `label` anchor, and whether it is beyond
-     * the bar. `negative` tells a bar that runs to the left (or down) from its base from one that runs right (or up),
-     * which `'tip'`, `'base'` and `'outside'` follow; the others are the edges of the page. A `stacked` bar's label is
-     * always in the middle. An anchor the shapes do not read (`'start'`, `'end'`) is taken for `'outside'`, the default.
-     */
-    static boxAnchor(anchor: ValueAnchor, shape: {
-        isHorizontal: boolean;
-        negative?: boolean;
-        stacked?: boolean;
-    }): {
-        anchor: LabelAnchor;
-        outside?: boolean;
-    };
-    /** Whether a label at `anchor` goes to one side or the other of a bar with the sign of its value. */
-    static followsSign(anchor: ValueAnchor): boolean;
-    /**
-     * The `label` the shapes of a plot kind write their value in: this plot's `styles.values` over the `defaults` the kind
-     * sets, with what every label shares ({@link hooks}) - its dimming and isolating of a series. A label inside its shape
-     * never reaches out of the plot, so only one `outside` has the margins grow to hold it; and it takes the default
-     * `fill` only `outside`, for inside it is written in the color that contrasts with its shape.
-     */
-    shapeLabel(env: AxisPlotEnv, text: (row: ProcessedRow) => string, defaults?: {
-        fill?: string;
-        fontSize?: number;
-        fontWeight?: FontStyle['fontWeight'];
-        anchor?: LabelAnchor;
-        outside?: boolean;
-        gap?: number;
-    }): TextLabelConfig;
     /**
      * A processed row's own value, read through its series' own value channel
      * (`y`, or `x` on a horizontal plot) - what a label shows, even where a
@@ -129,24 +142,61 @@ export declare class ValueLabels {
         axes?: PlotAxes;
     }): (d: ProcessedRow) => unknown;
     /**
-     * A series-over-`x` plot's (line, area) labels: one `'text'` marker over
-     * the processed rows, each visible series' last row with a value
-     * (`filter` + `selectLast`, per series), at its top (a stacked row's
-     * `y2`), labelled with its own value and placed by `anchor`. Labels that
-     * would overlap fan out into a shared column (`declutter`), colored by the
-     * segment the row falls in. A plot that labels each end of its series apart
-     * passes the `rows` and `anchor` of one end, and `lane` to route its labels
-     * out to a lane whether or not they overlap (`flip: false` keeps one on the
-     * left in the margin instead of flipping it over its points).
+     * A series-over-`x` plot's (line, area) labels, for its line or area markers: each labelled row (by default its
+     * series' last) with its own value, on the `side` of it its placement asks, colored by the segment it falls in.
+     * Labels that would overlap fan out into a shared column. A plot that labels each end of its series apart passes
+     * the `rows` and `side` of one end, and `lane` to route them out to a lane whether or not they overlap.
      */
-    atSeriesEnds<TData extends Record<string, unknown>>(state: AxisPlotState<TData, object>, end?: {
+    atSeriesEnds<TData extends Record<string, unknown>>(state: AxisPlotState<TData, object>, env: AxisPlotEnv, end?: {
         rows?: ProcessedRow[];
-        anchor?: ValueAnchor;
+        side?: PointSide;
         lane?: boolean | {
             elbowGap: number;
         };
         flip?: boolean;
+    }): PointLabelConfig[];
+    /**
+     * The labels of a plot whose rows have several values (a box's quartiles, a bullet's target): one `text` marker per
+     * part labelled, each of `rows` written at that part's value in its context - one label per value, for a part
+     * holding several (a box's outliers). `at` places a label at a value: its point, and the shape around it its
+     * `anchor` reads.
+     */
+    partMarkers(env: AxisPlotEnv, rows: readonly ProcessedRow[], at: (value: symbol) => PointGeometryOf, defaults?: {
+        seriesColor?: (row: ProcessedRow) => string | undefined;
+        /** The parts the kind writes on its own shapes, left out here: a bar's `value`. */
+        skip?: string[];
     }): TextMarkerConfig[];
+    /**
+     * Where a part label of a row sits on a plot of categories: at the row's `category` (a field or a function of
+     * it), level with the part's value, across the category's band - which an `anchor` reads, to write it beside.
+     */
+    static bandPoint(state: {
+        axes?: PlotAxes;
+    }, category: unknown, 
+    /** How wide the shape is across its band, in pixels, when it does not fill it: a violin's inner box. */
+    across?: number, 
+    /** A row's slot of its band, when its series share it side by side. */
+    slot?: (row: ProcessedRow) => {
+        index: number;
+        count: number;
+    } | undefined): (value: symbol) => PointGeometryOf;
+    /** The placement that writes each of `parts` beside its category's band: to its right, or above sideways bands. */
+    static besideBand(state: {
+        axes?: PlotAxes;
+    }, parts: string[]): Record<string, Record<string, unknown>>;
+    /** A series-over-`x` plot's labels in its {@link layout}: at its series' ends, or along its lines. */
+    forSeries<TData extends Record<string, unknown>>(state: AxisPlotState<TData, object>, env: AxisPlotEnv): MarkerLabelConfig[];
+    /** The side of its point a `'point'` label is written on: its placement's, else after it. */
+    get side(): PointSide;
+    /**
+     * A series-over-`x` plot's `'path'` labels, for its line or area markers: each series' name - or, with a `format`,
+     * the text it writes for the series' first row - along its line, colored by the series.
+     */
+    alongSeries<TData extends Record<string, unknown>>(state: AxisPlotState<TData, object>, env: AxisPlotEnv): MarkerLabelConfig[];
+    /** `markers` with `labels` on each one of `type`: the shapes of a series carry its labels. */
+    static onMarkers<T extends {
+        type: string;
+    }>(markers: T[], type: string, labels: MarkerLabelConfig[] | undefined): T[];
     /** How far (px) a lane takes the label of a series' first point from it - clear of the line that leaves it. */
     static readonly FIRST_LANE_GAP = 28;
     /** The rows of a series-over-`x` plot that cannot be labelled: a gap, or a stack with no top. For the "transforms" phase's `labels.skip`. */
@@ -163,5 +213,6 @@ export declare class ValueLabels {
      * domain when the scales set one, so it holds across a timeline; else off
      * every value.
      */
-    reachAtSeriesEnds<TData extends Record<string, unknown>>(state: AxisPlotState<TData, object>, anchor?: ValueAnchor): EdgeBox[];
+    reachAtSeriesEnds<TData extends Record<string, unknown>>(state: AxisPlotState<TData, object>, pointSide?: PointSide): EdgeBox[];
 }
+export {};