@fundar/data-chart-telling 1.18.0 → 1.20.0

package/dist/markers/utils/BoxLabel.d.ts

@@ -1,58 +0,0 @@
-import type { TextMarkerConfig } from '../../types/markers/common';
-import type { TextLabelConfig } from '../../types/markers/basic/text';
-/** Where a row's edge along an axis is: a field of the rows, the symbol a transform keyed it by, a function of the row, or a literal. */
-type Edge = unknown;
-/** The edges of the box each row spans, in the data's own terms. */
-export type BoxChannels = {
-    x1: Edge;
-    x2: Edge;
-    y1: Edge;
-    y2: Edge;
-};
-/** The scales a box is measured on. */
-export type BoxScales = Record<string, {
-    type?: string;
-    fn: any;
-} | undefined>;
-/** The pixel size of the box of a row, for the markers whose boxes are bands of a category axis rather than edges. */
-export type BoxSizer = (row: unknown, scales: BoxScales) => {
-    width: number;
-    height: number;
-} | undefined;
-/** The `text` marker that labels the boxes a marker draws, and where each label's box is. */
-export type BoxLabelMarker = {
-    marker: TextMarkerConfig;
-    box: BoxChannels | BoxSizer;
-};
-/** What a marker has to say for its boxes to be labelled. */
-export type Labelled = {
-    type?: string;
-    data?: unknown[];
-    label?: TextLabelConfig;
-    x?: Edge;
-    y?: Edge;
-    x1?: Edge;
-    x2?: Edge;
-    y1?: Edge;
-    y2?: Edge;
-    isHorizontal?: boolean;
-    role?: string;
-    thickness?: number;
-    /** The marker's styles: the insets of a cell or a bar are read off them. */
-    styles?: object;
-};
-/**
- * How a marker that draws a box per row writes a label in each: the `text` marker for them, centred on the box,
- * and where the box is for it to fit to. A `rect` says it with its edges, a `cell` is a band of each axis, and a bar
- * or a waffle is a band of its category axis and the stretch of its value.
- */
-export declare class BoxLabel {
-    #private;
-    /** `undefined` when the marker has no label, or does not say where its boxes are. */
-    static of(marker: Labelled, plot?: {
-        isHorizontal?: boolean;
-        scales?: () => BoxScales | undefined;
-        gap?: number;
-    }): BoxLabelMarker | undefined;
-}
-export {};

package/dist/markers/utils/BoxLabel.js

@@ -1,175 +0,0 @@
-const read = (edge) => (row) => typeof edge === 'function'
-    ? edge(row)
-    : typeof edge === 'string' || typeof edge === 'symbol'
-        ? row?.[edge]
-        : edge;
-/** The middle of two positions along an axis, whether numbers or dates. */
-const middle = (from, to) => from instanceof Date || to instanceof Date
-    ? new Date((Number(from) + Number(to)) / 2)
-    : (Number(from) + Number(to)) / 2;
-const bandwidth = (scale) => scale?.type === 'band' ? Number(scale.fn.bandwidth()) : undefined;
-const distance = (scale, from, to) => scale ? Math.abs(Number(scale.fn(to)) - Number(scale.fn(from))) : undefined;
-/**
- * How a marker that draws a box per row writes a label in each: the `text` marker for them, centred on the box,
- * and where the box is for it to fit to. A `rect` says it with its edges, a `cell` is a band of each axis, and a bar
- * or a waffle is a band of its category axis and the stretch of its value.
- */
-export class BoxLabel {
-    /** `undefined` when the marker has no label, or does not say where its boxes are. */
-    static of(marker, plot = {}) {
-        if (!marker.label)
-            return undefined;
-        const own = BoxLabel.#shape(marker, plot.isHorizontal ?? marker.isHorizontal ?? false);
-        if (!own)
-            return undefined;
-        const { anchor, outside, gap, ...label } = marker.label;
-        const size = typeof own.box === 'function' ? own.box : own.size;
-        const placed = BoxLabel.#anchored({
-            anchor,
-            outside,
-            gap: gap ?? plot.gap
-        }, label, size, plot.scales);
-        return {
-            box: own.box,
-            marker: {
-                // A label outside its shape has nothing to fit to.
-                fit: !outside,
-                ...label,
-                ...placed,
-                type: 'text',
-                data: marker.data,
-                x: own.x,
-                y: own.y
-            }
-        };
-    }
-    /**
-     * What puts a label at `anchor` of its shape: the pixels it is moved from the middle - a function of the row, for
-     * the size of its shape is the row's own - and the sides of its point it is written on. `{}` for the middle.
-     */
-    static #anchored(where, label, size, scales) {
-        const { anchor = 'middle', outside = false } = where;
-        if (anchor === 'middle' || !size)
-            return {};
-        const gap = where.gap ?? 4;
-        const horizontal = anchor.endsWith('left') ? -1 : anchor.endsWith('right') ? 1 : 0;
-        const vertical = anchor.startsWith('top') ? -1 : anchor.startsWith('bottom') ? 1 : 0;
-        // Beyond an edge only means something for an edge: a corner is inside its shape.
-        const beyond = outside && horizontal * vertical === 0;
-        const away = beyond ? 1 : -1;
-        const move = (axis, side, row) => {
-            // Read when a label is drawn, not when its marker is made: the scales move as the labels register.
-            const current = scales?.();
-            const box = current ? size(row, current) : undefined;
-            return box ? side * (box[axis] / 2 + away * gap) : 0;
-        };
-        // A number of the label's own (or its styles') is added to the move: it is the push from the anchor.
-        const own = (value, fallback) => Number(typeof value === 'number' ? value : (fallback ?? 0));
-        const baseX = own(label.dx, label.styles?.dx);
-        const baseY = own(label.dy, label.styles?.dy);
-        return {
-            dx: horizontal === 0 ? label.dx : (row) => baseX + move('width', horizontal, row),
-            dy: vertical === 0 ? label.dy : (row) => baseY + move('height', vertical, row),
-            styles: {
-                ...label.styles,
-                textAnchor: label.styles?.textAnchor ??
-                    (horizontal === 0 ? 'middle' : (horizontal === 1) === beyond ? 'start' : 'end'),
-                lineAnchor: label.styles?.lineAnchor ??
-                    (vertical === 0 ? 'middle' : (vertical === 1) === beyond ? 'top' : 'bottom')
-            }
-        };
-    }
-    /** A style of the marker, when it is a number: a function of the row says nothing of a box in general. */
-    static #style(marker, name) {
-        const value = marker.styles?.[name];
-        return typeof value === 'number' ? value : undefined;
-    }
-    static #shape(marker, isHorizontal) {
-        if (marker.type === 'cell')
-            return BoxLabel.#cell(marker);
-        if (marker.type === 'bar') {
-            return marker.role === 'segment'
-                ? BoxLabel.#bar(marker, marker.isHorizontal ?? false)
-                : undefined;
-        }
-        if (marker.type === 'waffle')
-            return BoxLabel.#bar(marker, isHorizontal);
-        return BoxLabel.#edges(marker);
-    }
-    /** A rectangle: the box is between its edges. */
-    static #edges({ x, y, x1, x2, y1, y2 }) {
-        // A side with a value and no start, next to one with both its edges, runs from zero to it, as a bar does.
-        if (y1 === undefined &&
-            y2 === undefined &&
-            y !== undefined &&
-            x1 !== undefined &&
-            x2 !== undefined) {
-            [y1, y2] = [0, y];
-        }
-        if (x1 === undefined &&
-            x2 === undefined &&
-            x !== undefined &&
-            y1 !== undefined &&
-            y2 !== undefined) {
-            [x1, x2] = [0, x];
-        }
-        if ([x1, x2, y1, y2].some((edge) => edge === undefined))
-            return undefined;
-        const [left, right, top, bottom] = [x1, x2, y1, y2].map(read);
-        const size = (row, scales) => {
-            const [width, height] = [
-                distance(scales.x, left(row), right(row)),
-                distance(scales.y, top(row), bottom(row))
-            ];
-            return width === undefined || height === undefined ? undefined : { width, height };
-        };
-        return {
-            box: { x1, x2, y1, y2 },
-            size,
-            x: (row) => middle(left(row), right(row)),
-            y: (row) => middle(top(row), bottom(row))
-        };
-    }
-    /** A cell: a band of each axis, less its inset. */
-    static #cell(marker) {
-        if (marker.x === undefined || marker.y === undefined)
-            return undefined;
-        const inset = Number(BoxLabel.#style(marker, 'inset') ?? 0.5);
-        const box = (_, scales) => {
-            const [width, height] = [bandwidth(scales.x), bandwidth(scales.y)];
-            return width === undefined || height === undefined
-                ? undefined
-                : { width: width - 2 * inset, height: height - 2 * inset };
-        };
-        return { box: box, x: marker.x, y: marker.y };
-    }
-    /** A bar or a waffle: a band of the category axis, as wide as its insets leave it, and as long as its value. */
-    static #bar(marker, isHorizontal) {
-        const [category, from, to] = isHorizontal
-            ? [marker.y, marker.x1, marker.x2]
-            : [marker.x, marker.y1, marker.y2];
-        const value = isHorizontal ? marker.x : marker.y;
-        // Without both ends, the bar runs from zero to its value.
-        const [start, end] = from !== undefined && to !== undefined ? [from, to] : [0, value];
-        if (category === undefined || end === undefined)
-            return undefined;
-        const [first, last] = [start, end].map(read);
-        const [before, after] = isHorizontal
-            ? [BoxLabel.#style(marker, 'insetTop'), BoxLabel.#style(marker, 'insetBottom')]
-            : [BoxLabel.#style(marker, 'insetLeft'), BoxLabel.#style(marker, 'insetRight')];
-        const middleOf = (row) => middle(first(row), last(row));
-        const box = (row, scales) => {
-            const band = bandwidth(isHorizontal ? scales.y : scales.x);
-            const length = distance(isHorizontal ? scales.x : scales.y, first(row), last(row));
-            if (band === undefined || length === undefined)
-                return undefined;
-            const thickness = marker.thickness ?? band * (1 - Number(before ?? 0) - Number(after ?? 0));
-            return isHorizontal
-                ? { width: length, height: thickness }
-                : { width: thickness, height: length };
-        };
-        return isHorizontal
-            ? { box: box, x: middleOf, y: category }
-            : { box: box, x: category, y: middleOf };
-    }
-}

package/dist/markers/utils/MarkerLabel.svelte

@@ -1,33 +0,0 @@
-<script lang="ts">
-	import TextMarker from '../text/TextMarker.svelte';
-	import { getConfiguration } from '../../configuration/config.svelte';
-	import { usePlot } from '../../layout/plot/usePlot';
-	import { BoxLabel, type Labelled } from './BoxLabel';
-	import { MARK_EVENTS } from '../../types/markers/channels/commonMarkerEvents';
-	import type { TextLabelConfig } from '../../types/markers/basic/text';
-
-	/**
-	 * The `label` of a marker that draws a box per row: a `text` marker anchored in each box and fitted to it. A marker
-	 * with a label only has to render `<MarkerLabel {marker} />` after its own shapes. Nothing is drawn without a
-	 * `label`, or when the marker does not say where its boxes are.
-	 */
-	const { marker }: { marker: Labelled & { label?: TextLabelConfig } } = $props();
-	const plot = usePlot();
-	const cfg = $derived(getConfiguration());
-
-	const labelled = $derived(
-		BoxLabel.of(marker, {
-			isHorizontal: plot.axes?.isHorizontal,
-			gap: cfg.text.label.gap,
-			scales: () => plot.svelteplot.scales as never
-		})
-	);
-	/** A label with a handler of its own listens for the pointer; one without leaves it to the shape under it. */
-	const listens = $derived(MARK_EVENTS.some((name) => !!marker.label?.[name]));
-</script>
-
-{#if labelled}
-	<g pointer-events={listens ? undefined : 'none'}>
-		<TextMarker marker={labelled.marker} box={labelled.box} />
-	</g>
-{/if}

package/dist/markers/utils/MarkerLabel.svelte.d.ts

@@ -1,10 +0,0 @@
-import { type Labelled } from './BoxLabel';
-import type { TextLabelConfig } from '../../types/markers/basic/text';
-type $$ComponentProps = {
-    marker: Labelled & {
-        label?: TextLabelConfig;
-    };
-};
-declare const MarkerLabel: import("svelte").Component<$$ComponentProps, {}, "">;
-type MarkerLabel = ReturnType<typeof MarkerLabel>;
-export default MarkerLabel;