inkplot 0.0.0-stage → 1.0.0-beta.1

package/dist/attrs.js

@@ -0,0 +1,84 @@
+/**
+ * Attribute names and types for the places that only have strings and flat names: XML-like syntaxes (JSX, HTML).
+ *
+ * Two jobs, both small:
+ *
+ * 1. `expandAttributes` turns hyphenated names into nested objects, because those syntaxes carry only primitives:
+ *    `meta-title="Sales"` is `{ meta: { title: 'Sales' } }`. Having both an object and nested names for one key is an error.
+ * 2. Every element class lists, in `static attrTypes`, the attributes an HTML parser would get wrong: names with capitals
+ *    (HTML lowercases them, so `strokewidth` must find `strokeWidth`) and text that looks like something else (a title
+ *    of `2024` must stay text). Attributes that hold objects list their parts the same way, nested:
+ *    `{ meta: { title: STRING }, padding: { topSide: NUMBER } }`. Everything else is left to automatic coercion.
+ *    The compiler enforces the list (`AttrTypesFor`), so a new attribute cannot be forgotten.
+ *
+ * Only the Web Components adapter reads `attrTypes`; the classes carry them as plain data, which costs a few bytes each.
+ */
+/** How an HTML attribute's text becomes a value. AUTO: `true`/`false` and numbers convert, `[…]` and `{…}` are JSON, the rest is text. */
+export const AUTO = 0;
+/** Always text: titles, names, ids, colours. Needed wherever the text might look like a number or a boolean. */
+export const STRING = 1;
+/** A number, whatever it looks like. */
+export const NUMBER = 2;
+/** A boolean: present with no value, or `true`, is true; `false` is false. */
+export const BOOLEAN = 3;
+/**
+ * The attributes an element takes, from a flat set of names and values in which hyphens mean nesting.
+ * Names without hyphens pass through, and values are never copied, so objects and functions stay the same objects.
+ * An attribute whose value is `undefined` counts as not given for conflicts, but stays in the result when nothing else claims the key.
+ * Throws when one key is given both as a value and as a path to nested values (`meta` and `meta-title`, or `a-b` and `a-b-c`),
+ * when a name has an empty part (`a--b`), or for `__proto__`.
+ */
+export function expandAttributes(flat, options = {}) {
+    const out = {};
+    /** The objects made here, as opposed to ones the caller passed, which must not be written into. */
+    const made = new WeakSet();
+    for (const key of Object.keys(flat)) {
+        const raw = key.split('-');
+        const path = [];
+        for (const part of raw) {
+            if (part === '')
+                throw new Error(`attribute '${key}': empty name part`);
+            const name = options.name ? options.name(part, path) : part;
+            if (name === '__proto__')
+                throw new Error(`attribute '${key}': not allowed`);
+            path.push(name);
+        }
+        let at = out;
+        for (let i = 0; i < path.length - 1; i++) {
+            // oxlint-disable-next-line typescript/no-non-null-assertion -- in range: the index comes from a loop bound or a length checked in the same function
+            const name = path[i];
+            const have = Object.hasOwn(at, name) ? at[name] : undefined;
+            if (have === undefined) {
+                const next = {};
+                made.add(next);
+                at[name] = next;
+                at = next;
+            }
+            else if (typeof have === 'object' && have !== null && made.has(have)) {
+                // oxlint-disable-next-line typescript/consistent-type-assertions -- `made` holds only the objects this function created, so a member of it is one of our `Obj`
+                at = have;
+            }
+            else {
+                throw new Error(`attribute '${key}' conflicts with '${path.slice(0, i + 1).join('-')}', which is a value`);
+            }
+        }
+        // oxlint-disable-next-line typescript/no-non-null-assertion -- in range: the index comes from a loop bound or a length checked in the same function
+        const last = path[path.length - 1];
+        const value = options.value ? options.value(path, flat[key]) : flat[key];
+        if (Object.hasOwn(at, last)) {
+            // An attribute given as `undefined` means "not set", so it never conflicts with the same key given nested.
+            if (value === undefined)
+                continue;
+            const have = at[last];
+            if (have === undefined) {
+                at[last] = value;
+                continue;
+            }
+            throw new Error(typeof have === 'object' && have !== null && made.has(have)
+                ? `attribute '${key}' conflicts with '${key}-…', which are nested values`
+                : `attribute '${key}' is given twice`);
+        }
+        at[last] = value;
+    }
+    return out;
+}

package/dist/axis.d.ts

@@ -0,0 +1,137 @@
+import { Dimension, type DimensionAttributes } from './dimension.ts';
+import { type ElementRef } from './element.ts';
+import { type ChartEvent } from './events.ts';
+import { type Side } from './geometry.ts';
+import type { Plane } from './plane.ts';
+export type CartesianOrientation = 'top' | 'bottom' | 'left' | 'right';
+export type PolarOrientation = 'angle' | 'radius';
+export type AxisOrientation = CartesianOrientation | PolarOrientation;
+/** Horizontal axes run left-right, so their labels sit above or below; vertical ones put them beside. */
+export declare const isHorizontal: (o: AxisOrientation) => o is "bottom" | "top";
+/** Narrows to the sides a Cartesian plane can draw. Polar sides belong to a PolarPlane. */
+export declare function cartesianSide(o: AxisOrientation): CartesianOrientation;
+/** Narrows to the sides a PolarPlane can draw. */
+export declare function polarSide(o: AxisOrientation): PolarOrientation;
+/**
+ * The curve an axis is drawn along, and what that means for its ticks and labels. Whatever the shape of the plot (a
+ * rectangle's side, a rim, a spoke) the plane builds one for each axis, so an axis knows nothing about the plane.
+ */
+export interface Ruler {
+    /** Pixels along it: what the ticks have to fit into. */
+    readonly length: number;
+    /** About how many pixels each tick needs, labels included. */
+    readonly tickSpacing: number;
+    /** True when its labels sit above or below it, so only their height counts across it; false when their width does. */
+    readonly horizontal: boolean;
+    /** The curve as path data. Read when drawn, so it may depend on what the plane settles last. */
+    readonly line: string;
+    /** The point a fraction 0..1 along it, and the unit vector pointing away from the plot there: x, y, nx, ny. */
+    at(fraction: number): readonly [x: number, y: number, nx: number, ny: number];
+    /**
+     * How far along it a position in the plot is, as a fraction 0..1 (outside that range for positions beyond its ends),
+     * so that dragging and zooming can follow the pointer along it. Absent for a curve that cannot be dragged along.
+     */
+    fractionAt?(x: number, y: number): number;
+    /**
+     * Where the title goes for an axis whose title asks to be on `position` (default: the axis' own side). Titles sit on
+     * the axis line, past its labels, where an axis is fixed to the side it is on; otherwise at the middle of the edge
+     * of the plot, past whatever the plane has put there.
+     */
+    title(position: Side | undefined): TitleSpot;
+}
+/**
+ * A place for a title: a point, the unit vector pointing away from the plot there, and whether the title belongs past
+ * the axis' own ticks and labels (the point is on the axis line) or the point is already where the title starts.
+ */
+export interface TitleSpot {
+    x: number;
+    y: number;
+    nx: number;
+    ny: number;
+    beyond: boolean;
+}
+export interface AxisAttributes extends DimensionAttributes {
+    /**
+     * The side of the plot the axis sits on. Default: 'bottom' for the first axis in a plane, then 'left',
+     * 'top', 'right'. Axes sharing a side stack outwards from the plot in child order.
+     */
+    orientation?: AxisOrientation;
+    /**
+     * The edge of the plot the title sits at: past the axis' labels for an axis fixed to that side, otherwise at the middle of
+     * the edge, outside any axes there, which then take the room it needs. Default: the axis' own side. Cartesian planes only.
+     */
+    titlePosition?: Side;
+    /**
+     * Whether the title runs along the horizontal or the vertical. Default: horizontal at the top and bottom, vertical at the
+     * left and right. Cartesian planes only.
+     */
+    titleDirection?: 'horizontal' | 'vertical';
+    /**
+     * Float across the plot at this value of the crossing axis (the other one, or `crossAxis`), instead of sitting on a
+     * side. Where that is outside the range, the axis stays at the nearest edge. A floating axis takes no room from the
+     * plot, except where it sits at the edge on its own side, which is just where a fixed axis would be. Its labels
+     * overlay the plot, so a halo on the labels (`style: { tickLabel: { halo: '#fff' } }`) is worth setting. Its title, unless told otherwise, is at the edge of
+     * the plot on the axis' side. Cartesian planes only.
+     */
+    crossesAt?: number;
+    /** The axis `crossesAt` is a value of. Default: the plane's first axis on the other orientation. */
+    crossAxis?: ElementRef<Axis>;
+}
+/** A spatial dimension, drawn along a ruler its plane gives it. Needs one scale child: `new Axis({}, new LinearScale())`. */
+export declare class Axis extends Dimension<Plane, AxisAttributes> {
+    #private;
+    static attrTypes: {
+        title: 1;
+        tickCount: 2;
+        tickStep: 2;
+        locale: 1;
+        onViewChange: 0;
+        titlePosition: 1;
+        titleDirection: 1;
+        crossesAt: 2;
+        crossAxis: 1;
+        id: 1;
+        meta: {
+            title: 1;
+            description: 1;
+            role: 1;
+        };
+    };
+    get orientation(): AxisOrientation;
+    /** The curve it is drawn along. Valid after arrange. */
+    get ruler(): Ruler;
+    /** Position in the stack for its side, 0 being the one nearest the plot. */
+    get slot(): number;
+    /** Space it needs perpendicular to the plot edge. Valid after it has been measured. */
+    get thickness(): number;
+    /** Room a title needs at the edge of the plot, when it is not part of the axis' own thickness. Valid after it has been measured. */
+    get titleThickness(): number;
+    /** The edge of the plot the title is at. */
+    get titleSide(): Side;
+    /** Half the width of the widest label: how far the first or last label may stick out past the plot. */
+    get labelOverhang(): number;
+    /** Which side, and which place in that side's stack. */
+    assign(orientation: AxisOrientation, slot: number): void;
+    /** The curve to draw along. The plane sets it before measuring, and again once the plot is settled. */
+    setRuler(ruler: Ruler): void;
+    protected tickCountFor(length: number): number;
+    /**
+     * Everything the axis draws with, settled in one place so measuring and painting always agree on sizes. The axis' own
+     * colour (`style: { axis: { color } }`) reaches its labels, line and ticks alike because all three chains pass through `axis`.
+     */
+    private look;
+    onEvent(ev: ChartEvent): void;
+    /**
+     * Works out `thickness` (room across the plot edge for ticks, labels and a title on the axis line) and
+     * `titleThickness` (room for a title that sits at the plot's edge instead), and answers the MEASURE request.
+     */
+    private measure;
+    /** Which way the title text runs: as asked, else along the edge it is at. */
+    private titleVertical;
+    /** True when the text runs across the edge it is at, so its length is what takes room there. */
+    private titleRotated;
+    /** How much room the labels take in the direction away from the plot. */
+    private labelsAcross;
+    /** The line, a mark and a label at each tick, each facing away from the plot, then the title. */
+    private paint;
+}

package/dist/axis.js

@@ -0,0 +1,185 @@
+/**
+ * Axes: a dimension drawn along one side of a plane.
+ *
+ * An axis does two jobs. As a `Dimension` it owns a scale and a range, and answers value ↔ fraction. As a drawing it
+ * paints a line, ticks, labels and a title along a `Ruler` that its plane supplies, so the same code serves the side of
+ * a rectangle, a floating cross-line, a rim and a spoke. The plane tells it where (`assign`, `setRuler`); the axis tells
+ * the plane how much room it needs (the MEASURE event → `thickness`, `titleThickness`, `labelOverhang`).
+ */
+import { NUMBER, STRING } from './attrs.js';
+import { Dimension } from './dimension.js';
+import { fail } from './element.js';
+import { hideFromAssistive, writeAria } from './aria.js';
+import { EVENT_ATTACH, EVENT_MEASURE, EVENT_PAINT } from './events.js';
+import { f2 } from './geometry.js';
+import { estimateTextWidth } from './platform.js';
+import { applyText } from './text.js';
+/** Horizontal axes run left-right, so their labels sit above or below; vertical ones put them beside. */
+export const isHorizontal = (o) => o === 'top' || o === 'bottom';
+/** Narrows to the sides a Cartesian plane can draw. Polar sides belong to a PolarPlane. */
+export function cartesianSide(o) {
+    return o === 'angle' || o === 'radius' ? fail(`an axis on the "${o}" side needs a PolarPlane`) : o;
+}
+/** Narrows to the sides a PolarPlane can draw. */
+export function polarSide(o) {
+    return o === 'angle' || o === 'radius' ? o : fail(`an axis on the "${o}" side needs a CartesianPlane`);
+}
+/** What an axis has before its plane has placed it. */
+const UNPLACED = {
+    length: 1, tickSpacing: 70, horizontal: true, line: '', at: () => [0, 0, 0, 1], title: () => ({ x: 0, y: 0, nx: 0, ny: 1, beyond: true }),
+};
+/** A spatial dimension, drawn along a ruler its plane gives it. Needs one scale child: `new Axis({}, new LinearScale())`. */
+export class Axis extends Dimension {
+    static attrTypes = { ...Dimension.attrTypes, titlePosition: STRING, titleDirection: STRING, crossesAt: NUMBER, crossAxis: STRING };
+    #orientation = 'bottom';
+    #slot = 0;
+    #thickness = 0;
+    #titleThickness = 0;
+    #titleAcross = 0;
+    #ruler = UNPLACED;
+    #labelCount = 0;
+    #labelWidth = 0;
+    get orientation() { return this.#orientation; }
+    /** The curve it is drawn along. Valid after arrange. */
+    get ruler() { return this.#ruler; }
+    /** Position in the stack for its side, 0 being the one nearest the plot. */
+    get slot() { return this.#slot; }
+    /** Space it needs perpendicular to the plot edge. Valid after it has been measured. */
+    get thickness() { return this.#thickness; }
+    /** Room a title needs at the edge of the plot, when it is not part of the axis' own thickness. Valid after it has been measured. */
+    get titleThickness() { return this.#titleThickness; }
+    /** The edge of the plot the title is at. */
+    get titleSide() { return this.attrs.titlePosition ?? cartesianSide(this.#orientation); }
+    /** Half the width of the widest label: how far the first or last label may stick out past the plot. */
+    get labelOverhang() { return this.#labelWidth / 2; }
+    // ─── Engine protocol: the plane says where the axis goes. ───
+    /** Which side, and which place in that side's stack. */
+    assign(orientation, slot) {
+        this.#orientation = orientation;
+        this.#slot = slot;
+    }
+    /** The curve to draw along. The plane sets it before measuring, and again once the plot is settled. */
+    setRuler(ruler) { this.#ruler = ruler; }
+    tickCountFor(length) {
+        return Math.max(2, Math.min(12, Math.floor(length / this.#ruler.tickSpacing)));
+    }
+    /**
+     * Everything the axis draws with, settled in one place so measuring and painting always agree on sizes. The axis' own
+     * colour (`style: { axis: { color } }`) reaches its labels, line and ticks alike because all three chains pass through `axis`.
+     */
+    look() {
+        return {
+            metrics: this.styleFor(['axis']),
+            labels: this.styleFor(['tickLabel', 'axis', 'text']),
+            title: this.styleFor(['axisTitle', 'axis', 'text']),
+            line: this.styleFor(['axisLine', 'axis', 'line']),
+        };
+    }
+    onEvent(ev) {
+        switch (ev.type) {
+            case EVENT_ATTACH:
+                this.surface.wrapper(); // the text style below is inherited by every label
+                break;
+            case EVENT_MEASURE:
+                this.measure(ev);
+                break;
+            case EVENT_PAINT:
+                this.paint();
+                break;
+        }
+    }
+    /**
+     * Works out `thickness` (room across the plot edge for ticks, labels and a title on the axis line) and
+     * `titleThickness` (room for a title that sits at the plot's edge instead), and answers the MEASURE request.
+     */
+    measure(ev) {
+        const s = this.look(), ruler = this.#ruler;
+        const chart = this.chart;
+        // 'inherit' means whatever the SVG gives; measuring needs a concrete family, so a generic one stands in.
+        const font = (r) => ({ family: r.family === 'inherit' ? 'sans-serif' : r.family, size: r.size, weight: r.weight });
+        const measureText = chart ? chart.measureText : estimateTextWidth;
+        let widest = 0;
+        for (const t of this.getTicks(ruler.length))
+            widest = Math.max(widest, measureText(t.label, font(s.labels)).width);
+        // The plot area is whatever the labels leave, so labels changing width would move the plot under your hand while you
+        // zoom. Widths grow at once but only shrink once there is a clear gain (a margin of about a digit and a half).
+        if (widest > this.#labelWidth || widest < this.#labelWidth - s.labels.size * 1.5)
+            this.#labelWidth = widest;
+        // The title takes room across the edge it is at: its height, or its length when it runs along the way it is stacked.
+        const title = this.attrs.title, spot = ruler.title(this.attrs.titlePosition);
+        let across = 0;
+        if (title) {
+            across = this.titleRotated(spot) ? measureText(title, font(s.title)).width : s.title.size * 1.2;
+            this.#titleAcross = across;
+        }
+        this.#thickness = s.metrics.tickLength + s.metrics.labelGap + this.labelsAcross(s.labels.size) + (title && spot.beyond ? s.metrics.spacing + across : 0) + s.metrics.spacing;
+        this.#titleThickness = title && !spot.beyond ? across + s.metrics.spacing : 0;
+        ev.request = ruler.horizontal
+            ? { min: { width: 0, height: this.#thickness }, max: { width: Infinity, height: this.#thickness } }
+            : { min: { width: this.#thickness, height: 0 }, max: { width: this.#thickness, height: Infinity } };
+    }
+    /** Which way the title text runs: as asked, else along the edge it is at. */
+    titleVertical(spot) {
+        const asked = this.attrs.titleDirection;
+        return asked ? asked === 'vertical' : Math.abs(spot.nx) > Math.abs(spot.ny);
+    }
+    /** True when the text runs across the edge it is at, so its length is what takes room there. */
+    titleRotated(spot) { return this.titleVertical(spot) === (Math.abs(spot.ny) >= Math.abs(spot.nx)); }
+    /** How much room the labels take in the direction away from the plot. */
+    labelsAcross(fontSize) { return this.#ruler.horizontal ? fontSize * 1.15 : this.#labelWidth; }
+    /** The line, a mark and a label at each tick, each facing away from the plot, then the title. */
+    paint() {
+        const s = this.look(), surface = this.surface, ruler = this.#ruler, fs = s.labels.size;
+        let d = ruler.line;
+        const labels = [];
+        for (const t of this.getTicks(ruler.length)) {
+            const f = this.fractionOf(t.value);
+            if (!(f >= -1e-9 && f <= 1 + 1e-9))
+                continue;
+            const [x, y, nx, ny] = ruler.at(f);
+            d += `M${f2(x)} ${f2(y)}l${f2(nx * s.metrics.tickLength)} ${f2(ny * s.metrics.tickLength)}`;
+            const out = s.metrics.tickLength + s.metrics.labelGap;
+            labels.push({ text: t.label, x: x + nx * out, y: y + ny * out + fs * (0.35 + 0.6 * ny), nx });
+        }
+        applyText(surface, surface.wrapper(), s.labels);
+        // The numbers on an axis are read to no use one by one; a screen reader gets the summary, or the axis' own `meta`.
+        if (this.attrs.meta)
+            writeAria(surface, surface.wrapper(), this.attrs.meta, { role: 'group' });
+        else
+            hideFromAssistive(surface, surface.wrapper());
+        const line = surface.node('axis', 'path');
+        surface.set(line, 'd', d);
+        surface.set(line, 'fill', 'none');
+        surface.set(line, 'stroke', s.line.color);
+        surface.set(line, 'stroke-width', s.line.width);
+        surface.set(line, 'stroke-dasharray', s.line.dash);
+        surface.set(line, 'opacity', s.line.opacity);
+        labels.forEach((l, i) => {
+            const n = surface.node(`label-${i}`, 'text');
+            surface.set(n, 'x', f2(l.x));
+            surface.set(n, 'y', f2(l.y));
+            surface.set(n, 'text-anchor', l.nx > 0.3 ? 'start' : l.nx < -0.3 ? 'end' : 'middle');
+            surface.text(n, l.text);
+        });
+        for (let i = labels.length; i < this.#labelCount; i++)
+            surface.remove(`label-${i}`);
+        this.#labelCount = labels.length;
+        // The title is centred in the room it has: past the labels beside the axis line, or past whatever else is at the edge.
+        const title = this.attrs.title;
+        if (!title) {
+            surface.remove('title');
+            return;
+        }
+        const spot = ruler.title(this.attrs.titlePosition);
+        const distance = (spot.beyond ? s.metrics.tickLength + s.metrics.labelGap + this.labelsAcross(fs) + s.metrics.spacing : s.metrics.spacing / 2) + this.#titleAcross / 2;
+        const cx = spot.x + spot.nx * distance, cy = spot.y + spot.ny * distance;
+        const n = surface.node('title', 'text');
+        applyText(surface, n, s.title, 'middle');
+        surface.set(n, 'x', 0);
+        surface.set(n, 'y', f2(s.title.size * 0.35));
+        // Text that runs up the page reads from the bottom; on the right of the plot it is turned the other way, as is usual.
+        const turn = this.titleVertical(spot) ? (spot.nx > 0 ? 90 : -90) : 0;
+        surface.set(n, 'transform', `translate(${f2(cx)} ${f2(cy)})${turn ? ` rotate(${turn})` : ''}`);
+        surface.text(n, title);
+    }
+}

package/dist/bars.d.ts

@@ -0,0 +1,80 @@
+import type { HitMode } from './hit.ts';
+import type { PlatformNode } from './platform.ts';
+import { type PolygonSet, SeriesRenderer, type SeriesRendererAttributes } from './renderer.ts';
+import type { Series } from './series.ts';
+import type { Surface } from './surface.ts';
+export interface BarOptions {
+    /** Fraction of the room each bar fills. Default: a band's own `bandwidth`, else 0.8. */
+    width?: number;
+    /** The value bars grow from when there is no stack to say. Default 0. */
+    baseline?: number;
+}
+/** Everything about a series' bars that does not depend on how they are drawn, in fractions of the axes. */
+export interface BarLayout {
+    readonly n: number;
+    /** Centre along the domain, start and end along the value, for each bar: three numbers a row. */
+    readonly norm: Float64Array;
+    /** The width of one bar's slot along the domain, and how far this series' slot is from the centre. */
+    readonly slot: number;
+    readonly shift: number;
+}
+export declare function layoutBars(series: Series, options: BarOptions): BarLayout | null;
+/**
+ * How far along the domain (as a fraction of the axis) a series' own bars sit from the point's place, when it shares a band
+ * with others (`Stack` in 'group' mode). What goes on the bars (error bars) uses it to stay on them. 0 for a series alone.
+ */
+export declare function barShift(series: Series, options?: BarOptions): number;
+/**
+ * The outline of every bar of a series in plot pixels, `perShape` points each, in the order of the series' points
+ * (a point that is a gap leaves a shape of NaN). Null before the first projection.
+ */
+export declare function barShapes(series: Series, options?: BarOptions): PolygonSet | null;
+/**
+ * The stem of every bar: a line from its foot to its value, two points each, as a `PolygonSet` of two-point shapes (so a
+ * hit measures the distance to the line). Straight on every plane, since a line along the value is a straight line (a
+ * spoke) on a polar one. Gaps leave NaN.
+ */
+export declare function stemLines(series: Series, options?: BarOptions): PolygonSet | null;
+export interface BarRendererAttributes extends SeriesRendererAttributes, BarOptions {
+}
+/**
+ * What every bar renderer shares: where bars start and how wide they are (`BarOptions`), that the value axis has to reach
+ * the baseline, and that a pointer hit is measured against the geometry it draws. A subclass says what that geometry is
+ * (`outline`) and how to draw it.
+ */
+export declare abstract class BarRenderer<A extends BarRendererAttributes = BarRendererAttributes> extends SeriesRenderer<A> {
+    protected abstract outline(): PolygonSet | null;
+    get includes(): readonly number[];
+    /** Half of a bar's room: its width, in the gaps between points (a band's own bars fit it already). */
+    get spans(): number;
+    get hitMode(): HitMode;
+    shapes(): PolygonSet | null;
+}
+export interface BarPathAttributes extends BarRendererAttributes {
+}
+/** One path holding every bar of the series: the cost of a bar chart is its path text, not a node for each bar. */
+export declare class BarPath extends BarRenderer<BarPathAttributes> {
+    private look;
+    get swatch(): string;
+    protected outline(): PolygonSet | null;
+    sample(s: Surface, parent: PlatformNode, key: string, width: number, height: number): void;
+    protected draw(): void;
+}
+export interface BarLinePathAttributes extends BarRendererAttributes {
+    /** How the end of a stem is finished: 'butt' (flat, at the value), 'round' or 'square' (both reach half a width past). Default 'butt'. */
+    cap?: 'butt' | 'round' | 'square';
+}
+/**
+ * Bars as lines: each is a stem from the foot to the value, stroked rather than filled, in one path. The width is the
+ * stroke's, so it stays the same however many bars there are, which is what makes it the answer for dense data where
+ * filled bars would be slivers. The look is the line's (`seriesLine`), with the series' colour as its stroke; give the
+ * series a marker as well for a lollipop.
+ */
+export declare class BarLinePath extends BarRenderer<BarLinePathAttributes> {
+    private look;
+    get swatch(): string;
+    protected outline(): PolygonSet | null;
+    /** Three stems of different heights, as wide as the stroke says. */
+    sample(s: Surface, parent: PlatformNode, key: string, width: number, height: number): void;
+    protected draw(): void;
+}