react-cheminfo 0.28.0 → 0.30.0

package/lib/chart/ui/PlotCaption.js

@@ -0,0 +1,68 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { CHART_COLORS, LABEL_HALO } from "../core/chartTheme.js";
+import { CHARACTER_WIDTH, FONT_SIZE, GAP, MARGIN, ROW_HEIGHT, } from "../core/legendBox.js";
+/**
+ * What a plot is a picture of, written in its top left corner.
+ *
+ * The opposite corner from the legend, and it says the opposite kind of thing:
+ * a legend names the curves against each other, while a caption says which
+ * measurement the whole pane is of — which file, which acquisition of it, when
+ * it was measured. A stack of panes is where that matters, since three charts
+ * one above another are three pictures of three different scans and the axes
+ * say nothing about which.
+ *
+ * Drawn **inside the SVG**, for the reason `TraceLegend` states: a picture is
+ * exported by cloning the chart's own `SVGSVGElement`, so a caption living in a
+ * `<div>` beside it would be missing from every figure while looking perfectly
+ * right on screen — and a figure that does not say what it is a picture of is
+ * the one thing a caption exists to prevent.
+ *
+ * It is written on the plot rather than above it. The room over a plot belongs
+ * to the tallest peak's label, and taking it for a caption would either push
+ * the measurement down or have the two collide on whichever spectrum happens to
+ * peak at the left.
+ * @param props - Component props.
+ * @returns The caption, or nothing where there is no room to write it.
+ */
+export function PlotCaption(props) {
+    const { text, plot, until } = props;
+    const said = elide(text, (until ?? plot.right) - GAP - plot.left - MARGIN);
+    if (said === '')
+        return null;
+    return (_jsx("text", { x: plot.left + MARGIN, y: plot.top + MARGIN + ROW_HEIGHT / 2, fontSize: FONT_SIZE, dominantBaseline: "middle", style: captionStyle, pointerEvents: "none", "aria-hidden": "true", children: said }));
+}
+/**
+ * The caption cut to the room it has, with an ellipsis where it was cut.
+ *
+ * Measured from character counts rather than from the DOM, for the reason
+ * `legendBox` gives: the text is decided during render, where a
+ * `getComputedTextLength` would need a layout pass that has not happened, and
+ * the clone an export takes gets no layout at all — so a caption that measured
+ * itself would come out one length on screen and another in the figure.
+ * @param text - What the pane would say.
+ * @param room - How wide it may be, in pixels.
+ * @returns What it says, or nothing where a caption would be a stub.
+ */
+function elide(text, room) {
+    const fits = Math.floor(room / CHARACTER_WIDTH);
+    if (fits >= text.length)
+        return text;
+    // A caption cut to three characters is not a caption, and a reader has to
+    // guess at what it was — better a pane that says nothing than one that
+    // appears to answer and does not.
+    if (fits < MINIMUM_CHARACTERS)
+        return '';
+    return `${text.slice(0, fits - 1).trimEnd()}…`;
+}
+/** The shortest caption still worth writing, in characters. */
+const MINIMUM_CHARACTERS = 8;
+/**
+ * The face it is set in: the axis titles' ink, haloed like a peak label.
+ *
+ * The halo is what lets it be written straight onto the plot rather than in a
+ * box: a box in the top left would hide the very trace the pane is a picture
+ * of, while a hairline of paper around each glyph clears the letters and
+ * nothing else.
+ */
+const captionStyle = { fill: CHART_COLORS.title, ...LABEL_HALO };
+//# sourceMappingURL=PlotCaption.js.map

package/lib/chart/ui/PlotCaption.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PlotCaption.js","sourceRoot":"","sources":["../../../src/chart/ui/PlotCaption.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AACjE,OAAO,EACL,eAAe,EACf,SAAS,EACT,GAAG,EACH,MAAM,EACN,UAAU,GACX,MAAM,sBAAsB,CAAC;AAoB9B;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,MAAM,UAAU,WAAW,CAAC,KAAuB;IACjD,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,KAAK,CAAC;IAEpC,MAAM,IAAI,GAAG,KAAK,CAAC,IAAI,EAAE,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,GAAG,GAAG,GAAG,IAAI,CAAC,IAAI,GAAG,MAAM,CAAC,CAAC;IAC3E,IAAI,IAAI,KAAK,EAAE;QAAE,OAAO,IAAI,CAAC;IAE7B,OAAO,CACL,eACE,CAAC,EAAE,IAAI,CAAC,IAAI,GAAG,MAAM,EACrB,CAAC,EAAE,IAAI,CAAC,GAAG,GAAG,MAAM,GAAG,UAAU,GAAG,CAAC,EACrC,QAAQ,EAAE,SAAS,EACnB,gBAAgB,EAAC,QAAQ,EACzB,KAAK,EAAE,YAAY,EACnB,aAAa,EAAC,MAAM,iBACR,MAAM,YAEjB,IAAI,GACA,CACR,CAAC;AACJ,CAAC;AAED;;;;;;;;;;;GAWG;AACH,SAAS,KAAK,CAAC,IAAY,EAAE,IAAY;IACvC,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,GAAG,eAAe,CAAC,CAAC;IAChD,IAAI,IAAI,IAAI,IAAI,CAAC,MAAM;QAAE,OAAO,IAAI,CAAC;IACrC,0EAA0E;IAC1E,uEAAuE;IACvE,kCAAkC;IAClC,IAAI,IAAI,GAAG,kBAAkB;QAAE,OAAO,EAAE,CAAC;IACzC,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,IAAI,GAAG,CAAC,CAAC,CAAC,OAAO,EAAE,GAAG,CAAC;AACjD,CAAC;AAED,+DAA+D;AAC/D,MAAM,kBAAkB,GAAG,CAAC,CAAC;AAE7B;;;;;;;GAOG;AACH,MAAM,YAAY,GAAG,EAAE,IAAI,EAAE,YAAY,CAAC,KAAK,EAAE,GAAG,UAAU,EAAW,CAAC"}

package/lib/chart/ui/SelectionRect.d.ts

@@ -0,0 +1,27 @@
+import type { ReactElement } from 'react';
+import type { PlotRect } from '../core/chartGeometry.ts';
+import type { ZoomSelection } from '../core/zoomDomain.ts';
+export interface SelectionRectProps {
+    /** The drag being made, `null` when none is. */
+    selection: ZoomSelection | null;
+    /** Where the plot sits inside the SVG, which the drag is confined to. */
+    plot: PlotRect;
+}
+/**
+ * What the drag being made promises, drawn before the button is let go.
+ *
+ * It is painted over the data rather than under it, which is the one place a
+ * preview may cover a trace: a rectangle drawn behind a dense spectrum is a
+ * rectangle nobody sees, and the whole point of it is to be seen while the hand
+ * is still moving. The fill is faint enough for the peaks inside it to be read
+ * through, so the window being asked for can be judged against what is in it.
+ *
+ * Nothing here takes a pointer event: the drag is already captured on the SVG,
+ * and a rectangle that swallowed the pointer would end the very gesture it is
+ * drawing.
+ * @param props - Component props.
+ * @returns The rectangle, or nothing when no drag is being made and when the one
+ * being made is too short to zoom.
+ */
+export declare function SelectionRect(props: SelectionRectProps): ReactElement | null;
+//# sourceMappingURL=SelectionRect.d.ts.map

package/lib/chart/ui/SelectionRect.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectionRect.d.ts","sourceRoot":"","sources":["../../../src/chart/ui/SelectionRect.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AAGzD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAE3D,MAAM,WAAW,kBAAkB;IACjC,gDAAgD;IAChD,SAAS,EAAE,aAAa,GAAG,IAAI,CAAC;IAChC,yEAAyE;IACzE,IAAI,EAAE,QAAQ,CAAC;CAChB;AAED;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,GAAG,YAAY,GAAG,IAAI,CAgB5E"}

package/lib/chart/ui/SelectionRect.js

@@ -0,0 +1,31 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { CHART_COLORS } from "../core/chartTheme.js";
+import { selectionRectangle } from "../core/selectionGeometry.js";
+/**
+ * What the drag being made promises, drawn before the button is let go.
+ *
+ * It is painted over the data rather than under it, which is the one place a
+ * preview may cover a trace: a rectangle drawn behind a dense spectrum is a
+ * rectangle nobody sees, and the whole point of it is to be seen while the hand
+ * is still moving. The fill is faint enough for the peaks inside it to be read
+ * through, so the window being asked for can be judged against what is in it.
+ *
+ * Nothing here takes a pointer event: the drag is already captured on the SVG,
+ * and a rectangle that swallowed the pointer would end the very gesture it is
+ * drawing.
+ * @param props - Component props.
+ * @returns The rectangle, or nothing when no drag is being made and when the one
+ * being made is too short to zoom.
+ */
+export function SelectionRect(props) {
+    const { selection, plot } = props;
+    const rectangle = selectionRectangle(selection, plot);
+    if (rectangle === null)
+        return null;
+    return (_jsx("rect", { x: rectangle.x, y: rectangle.y, width: rectangle.width, height: rectangle.height, pointerEvents: "none", style: selectionStyle }));
+}
+const selectionStyle = {
+    fill: CHART_COLORS.selection,
+    stroke: CHART_COLORS.selectionBorder,
+};
+//# sourceMappingURL=SelectionRect.js.map

package/lib/chart/ui/SelectionRect.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SelectionRect.js","sourceRoot":"","sources":["../../../src/chart/ui/SelectionRect.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AACrD,OAAO,EAAE,kBAAkB,EAAE,MAAM,8BAA8B,CAAC;AAUlE;;;;;;;;;;;;;;;GAeG;AACH,MAAM,UAAU,aAAa,CAAC,KAAyB;IACrD,MAAM,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,KAAK,CAAC;IAElC,MAAM,SAAS,GAAG,kBAAkB,CAAC,SAAS,EAAE,IAAI,CAAC,CAAC;IACtD,IAAI,SAAS,KAAK,IAAI;QAAE,OAAO,IAAI,CAAC;IAEpC,OAAO,CACL,eACE,CAAC,EAAE,SAAS,CAAC,CAAC,EACd,CAAC,EAAE,SAAS,CAAC,CAAC,EACd,KAAK,EAAE,SAAS,CAAC,KAAK,EACtB,MAAM,EAAE,SAAS,CAAC,MAAM,EACxB,aAAa,EAAC,MAAM,EACpB,KAAK,EAAE,cAAc,GACrB,CACH,CAAC;AACJ,CAAC;AAED,MAAM,cAAc,GAAG;IACrB,IAAI,EAAE,YAAY,CAAC,SAAS;IAC5B,MAAM,EAAE,YAAY,CAAC,eAAe;CAC5B,CAAC"}

package/lib/chart/ui/TraceLegend.d.ts

@@ -0,0 +1,99 @@
+import type { ReactElement } from 'react';
+import type { PlotRect } from '../core/chartGeometry.ts';
+/** One trace the legend names. */
+export interface LegendEntry {
+    /** Identity, which is what the list is keyed on. */
+    id: string;
+    /** What it is called. */
+    name: string;
+    /** The colour it is drawn in. */
+    color: string;
+    /**
+     * Whether it is drawn solid or faint — a trace that is present but not the
+     * one being read.
+     * @default false
+     */
+    dimmed?: boolean;
+    /**
+     * A 1-based number written before the name.
+     *
+     * The palette hands out six hues and `nextSpectrumColor` deliberately falls
+     * back to the least-used one rather than reaching for a colour only some
+     * readers can place, so the seventh trace legitimately repeats a colour and
+     * the legend stops being able to tell two rows apart by swatch alone. A
+     * number tells them apart at twelve traces and at thirty, survives a
+     * monochrome print, and survives a trace too short to show its colour
+     * clearly — the row then reads `3 · x 132, y 88`.
+     * @default undefined
+     */
+    index?: number;
+    /**
+     * A short remark written at the right of the row, in grey.
+     * @default undefined
+     */
+    note?: string;
+}
+export interface TraceLegendProps {
+    /** The traces, in the order they are drawn. */
+    entries: readonly LegendEntry[];
+    /** The plot the legend sits inside. */
+    plot: PlotRect;
+    /**
+     * How many entries are named before the rest are counted instead.
+     *
+     * A legend taller than the plot is a legend that hides the measurement it is
+     * explaining, which is the failure a scrollbar in a legend admits to. Past
+     * this many the last line reads `+ 4 more`.
+     * @default 8
+     */
+    limit?: number;
+    /**
+     * How few named traces are still worth a legend.
+     *
+     * Two is right for a chart standing on its own: the axis title already says
+     * what the single curve is, so a box naming the only trace is furniture. It
+     * is wrong for a pane of a stack, where the panes share their axes and the
+     * legend is the only thing saying which measurement this one is of — there a
+     * single name is the whole point, and the pane passes 1.
+     * @default 2
+     */
+    minimumEntries?: number;
+    /**
+     * Whether a column is left at the right of every row for a control.
+     *
+     * The picture never draws that control — a cross drawn here would be cloned
+     * into every exported figure as a dead glyph, and a press on the SVG root is
+     * read as the start of a chart gesture — but it has to leave the room for it,
+     * or the box painted behind the rows comes out narrower than the rows an HTML
+     * layer places over it and every cross hangs off the end of the legend.
+     * @default false
+     */
+    closable?: boolean;
+}
+/**
+ * What each curve on a chart is, written in the top right of the plot.
+ *
+ * Drawn **inside the SVG** and never as HTML beside it, which is not a style
+ * choice: `stackDrawings` exports a picture by cloning the chart's own
+ * `SVGSVGElement`, so a legend living in a `<div>` would be missing from every
+ * exported figure while looking perfectly correct on screen — a picture that is
+ * wrong only once it leaves the application is the worst kind to ship.
+ *
+ * Top right because that is where a chromatogram has room: a trace rises from
+ * the baseline and the tallest peak is rarely at the right-hand edge. It is
+ * drawn over the plot rather than in a gutter beside it so that adding a legend
+ * does not narrow the measurement.
+ *
+ * Where it sits and how tall it is comes from `legendBox` rather than from
+ * arithmetic of its own, because a legend whose rows carry an interactive
+ * control is drawn a second time in HTML over this one, and two owners of a row
+ * position is a cross that drifts off the name it closes.
+ *
+ * A trace with no name is not given one here. An unnamed curve in a legend is a
+ * row of colour and nothing else, which is worse than being left out, and the
+ * caller knows what it drew.
+ * @param props - Component props.
+ * @returns The legend, or nothing when there are too few traces to name.
+ */
+export declare function TraceLegend(props: TraceLegendProps): ReactElement | null;
+//# sourceMappingURL=TraceLegend.d.ts.map

package/lib/chart/ui/TraceLegend.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TraceLegend.d.ts","sourceRoot":"","sources":["../../../src/chart/ui/TraceLegend.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAG1C,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AAczD,kCAAkC;AAClC,MAAM,WAAW,WAAW;IAC1B,oDAAoD;IACpD,EAAE,EAAE,MAAM,CAAC;IACX,yBAAyB;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,iCAAiC;IACjC,KAAK,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB;;;;;;;;;;;OAWG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,gBAAgB;IAC/B,+CAA+C;IAC/C,OAAO,EAAE,SAAS,WAAW,EAAE,CAAC;IAChC,uCAAuC;IACvC,IAAI,EAAE,QAAQ,CAAC;IACf;;;;;;;OAOG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;;;;;OASG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;;;;;;;;OASG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,gBAAgB,GAAG,YAAY,GAAG,IAAI,CA8ExE"}

package/lib/chart/ui/TraceLegend.js

@@ -0,0 +1,45 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { TOKEN } from "../../tokens/core/familyTokens.js";
+import { CLOSE_COLUMN, FONT_SIZE, GAP, PADDING, ROW_HEIGHT, SWATCH, hiddenLabel, legendBox, legendLabel, legendNames, } from "../core/legendBox.js";
+/**
+ * What each curve on a chart is, written in the top right of the plot.
+ *
+ * Drawn **inside the SVG** and never as HTML beside it, which is not a style
+ * choice: `stackDrawings` exports a picture by cloning the chart's own
+ * `SVGSVGElement`, so a legend living in a `<div>` would be missing from every
+ * exported figure while looking perfectly correct on screen — a picture that is
+ * wrong only once it leaves the application is the worst kind to ship.
+ *
+ * Top right because that is where a chromatogram has room: a trace rises from
+ * the baseline and the tallest peak is rarely at the right-hand edge. It is
+ * drawn over the plot rather than in a gutter beside it so that adding a legend
+ * does not narrow the measurement.
+ *
+ * Where it sits and how tall it is comes from `legendBox` rather than from
+ * arithmetic of its own, because a legend whose rows carry an interactive
+ * control is drawn a second time in HTML over this one, and two owners of a row
+ * position is a cross that drifts off the name it closes.
+ *
+ * A trace with no name is not given one here. An unnamed curve in a legend is a
+ * row of colour and nothing else, which is worse than being left out, and the
+ * caller knows what it drew.
+ * @param props - Component props.
+ * @returns The legend, or nothing when there are too few traces to name.
+ */
+export function TraceLegend(props) {
+    const { entries, plot, limit = 8, minimumEntries = 2, closable = false, } = props;
+    const named = legendNames(entries, minimumEntries);
+    if (named.length === 0)
+        return null;
+    // The very options the control layer measures with, or the two disagree by
+    // exactly the width of the column a cross stands in.
+    const box = legendBox(named, plot, { limit, closable });
+    const noteX = box.left + box.width - PADDING - (closable ? CLOSE_COLUMN : 0);
+    return (_jsxs("g", { "aria-hidden": "true", pointerEvents: "none", children: [_jsx("rect", { x: box.left, y: box.top, width: box.width, height: box.height, rx: 3, fill: "rgb(255 255 255 / 82%)", stroke: "rgb(217 223 230)", strokeWidth: 0.5 }), box.rows.map((row, index) => {
+                const entry = named[index];
+                if (entry === undefined)
+                    return null;
+                return (_jsxs("g", { opacity: entry.dimmed === true ? 0.45 : 1, children: [_jsx("line", { x1: box.left + PADDING, x2: box.left + PADDING + SWATCH, y1: row.middle, y2: row.middle, stroke: entry.color, strokeWidth: 2 }), _jsx("text", { x: box.left + PADDING + SWATCH + GAP, y: row.middle, fontSize: FONT_SIZE, dominantBaseline: "middle", fill: "rgb(28 33 39)", children: legendLabel(entry) }), entry.note !== undefined && (_jsx("text", { x: noteX, y: row.middle, fontSize: FONT_SIZE, dominantBaseline: "middle", textAnchor: "end", fill: TOKEN.textMuted, children: entry.note }))] }, row.id));
+            }), box.hidden > 0 && (_jsx("text", { x: box.left + PADDING + SWATCH + GAP, y: box.top + box.height - PADDING - ROW_HEIGHT / 2, fontSize: FONT_SIZE, dominantBaseline: "middle", fill: TOKEN.textMuted, children: hiddenLabel(box.hidden) }))] }));
+}
+//# sourceMappingURL=TraceLegend.js.map

package/lib/chart/ui/TraceLegend.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TraceLegend.js","sourceRoot":"","sources":["../../../src/chart/ui/TraceLegend.tsx"],"names":[],"mappings":"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"}

package/lib/chart/ui/chartGestures.d.ts

@@ -0,0 +1,158 @@
+/**
+ * A press on a chart, and what letting go of it answers.
+ *
+ * `useChartZoom` holds the React state — the window on screen, and the drag
+ * being made across it — and this holds the arithmetic that turns a release into
+ * an answer: a window to show, a range to report, a click to report, or nothing
+ * at all. Keeping the two apart is what lets the answer be tested without a
+ * renderer, which is how `zoomedDomain` beside it has always been read, and it
+ * is why this sits next to that file rather than inside the hook.
+ *
+ * The three things a host can be told about are here for the same reason. Only
+ * one of the four answers moves the window; the other three leave the chart
+ * exactly where it was, and deciding between them in one place is what stops a
+ * gesture reporting a range and a click for the same drag.
+ */
+import type { PointerEvent as ReactPointerEvent } from 'react';
+import type { ChartDomain, ZoomRules } from '../core/chartDomain.ts';
+import type { PlotRect } from '../core/chartGeometry.ts';
+import type { ChartScale } from '../core/chartScale.ts';
+import type { ChartPoint } from '../core/svgPoint.ts';
+import type { DragBox } from '../core/zoomDomain.ts';
+/** One gesture on the SVG, as React hands it over. */
+type PointerHandler = (event: ReactPointerEvent<SVGSVGElement>) => void;
+/**
+ * Which keys were held as a click was let go.
+ *
+ * Reported rather than interpreted, because what a modifier *means* is a
+ * question about the measurement and not about the gesture layer: on a mass
+ * spectrum a held shift asks for the peak to be watched for, and on an infrared
+ * one it will mean something else entirely. The chart says which keys were
+ * down; whoever knows what is being measured decides what that asks for.
+ */
+export interface ChartClickModifiers {
+    /** Whether shift was held. */
+    shift: boolean;
+    /** Whether alt — option on a Mac — was held. */
+    alt: boolean;
+}
+/** No key held, which is what a plain click reports. */
+export declare const NO_MODIFIERS: ChartClickModifiers;
+/** What to spread onto the SVG for it to be zoomed. */
+export interface ChartZoomHandlers {
+    onPointerDown: PointerHandler;
+    onPointerMove: PointerHandler;
+    onPointerUp: PointerHandler;
+    onPointerCancel: PointerHandler;
+    onDoubleClick: () => void;
+}
+/** What a host asks to be told, beyond the window it is shown anyway. */
+export interface ChartGestureReports {
+    /**
+     * What to do with the two values a `select` drag swept out, in the units of
+     * the horizontal axis and stated low end first.
+     *
+     * The window is left exactly where it was: the gesture asked where a peak
+     * begins and ends, not to look closer at it, and a chart that zoomed to the
+     * boundaries as they were set would take the neighbouring peaks off the screen
+     * every time. The ends are sorted before anyone is told, because a drag made
+     * right to left is as ordinary as one made left to right and an axis drawn
+     * right to left inverts them again — a range of `[2.9, 2.4]` minutes
+     * integrates nothing.
+     * @default nothing is reported, and a select drag then does nothing at all
+     */
+    onSelectRange?: (range: [number, number]) => void;
+    /**
+     * What to do with a press that went nowhere, in the units the chart is
+     * measured in — an m/z, a wavenumber, a retention time and a value.
+     *
+     * Nowhere means nowhere on **either** axis: a press is a click when it
+     * travelled less than `MINIMUM_DRAG` across and less than `MINIMUM_DRAG` down.
+     * Only the horizontal travel decides whether there is a window to zoom to, so
+     * a drag of one pixel across and three hundred down asks for no window — but
+     * it is plainly a gesture that was made, and calling it a press that went
+     * nowhere would put a scan on the chart nobody pointed at.
+     *
+     * A `select` drag is never reported here at all. Its answer is a range or it
+     * is nothing, and a near-vertical integration drag that moved the cursor
+     * instead would be answering a question the chemist did not ask.
+     *
+     * There is no other way to be told about a click: hovering is a different
+     * question, answered continuously and by every tremor of a hand resting on the
+     * chart, and choosing the scan at 2.500 minutes is a decision made by pressing.
+     * Only a press let go over the plot is reported — the gestures are heard on the
+     * whole SVG, so the axis titles and the tick labels are under them too, and a
+     * click on the word `m/z` inverted through the scales lands at a value the
+     * chart is not even drawing.
+     * @default nothing is reported
+     */
+    onClick?: (point: ChartPoint, modifiers: ChartClickModifiers) => void;
+    /**
+     * Whether a press at this point of the SVG, in its own user units, begins a
+     * drag at all.
+     *
+     * In pixels rather than in data units because that is the question being
+     * asked: whatever else is drawn on the chart — an integration boundary to be
+     * taken hold of, a cursor to be slid — was placed in pixels, and `isInsidePlot`
+     * is here for exactly this. Refusing means the press is never captured, so it
+     * reaches whatever is under it and that thing keeps the rest of the gesture;
+     * captured first and refused afterwards, the handle would never see the move
+     * events that drag it.
+     * @default every press over the SVG begins a drag
+     */
+    shouldStartDrag?: (point: ChartPoint) => boolean;
+}
+/** A drag as it is held, tied to the pointer that started it. */
+export interface Drag extends DragBox {
+    /** So a second finger cannot take a drag over from the first. */
+    pointerId: number;
+}
+/**
+ * What letting go of a drag comes to, told to the host on the way.
+ *
+ * One reading of the gesture answers all four outcomes, so what a select drag
+ * reports and what a zoom would have shown can never drift apart: the clamping
+ * to the plot, the `MINIMUM_DRAG` test and the sorting after inverting are done
+ * once, in `zoomedDomain`.
+ * @param current - The window in force, kept on the axis that is not asked for.
+ * @param released - The two corners as the button came up, in user units.
+ * @param plot - Where the plot sits inside the SVG.
+ * @param xScale - The x axis as the chart is currently zoomed.
+ * @param yScale - The y axis, likewise.
+ * @param rules - How the y axis behaves and what a drag means.
+ * @param reports - What the host asked to be told.
+ * @param modifiers
+ * @returns The window to show, `null` when the chart stays where it is.
+ */
+export declare function answeredRelease(current: ChartDomain, released: DragBox, plot: PlotRect, xScale: ChartScale, yScale: ChartScale, rules: ZoomRules, reports: ChartGestureReports, modifiers?: ChartClickModifiers): ChartDomain | null;
+/**
+ * The drag a press begins, `null` for a press that begins none.
+ *
+ * The host is asked before the pointer is captured rather than after it: a press
+ * taken from whatever it landed on cannot be handed back mid-gesture, so an
+ * integration boundary or a cursor drawn on the chart would never see the moves
+ * that drag it.
+ * @param event - The press.
+ * @param svg - The SVG it was made on, which is what places it in user units.
+ * @param shouldStartDrag - Whether the host lets the chart have it, absent when
+ * every press over the SVG is the chart's.
+ * @returns The drag, `null` when the press was not the chart's to take or the
+ * SVG cannot place the pointer.
+ */
+export declare function startedDrag(event: ReactPointerEvent<SVGSVGElement>, svg: SVGSVGElement | null, shouldStartDrag: ((point: ChartPoint) => boolean) | undefined): Drag | null;
+/**
+ * Where a drag has got to, when the event belongs to it.
+ * @param drag - The drag being made, `null` when none is.
+ * @param event - The pointer event just received.
+ * @param svg - The SVG the gesture is made on.
+ * @returns The drag with its far corner moved, `null` when the event is not
+ * part of it or the SVG cannot place the pointer.
+ */
+export declare function draggedTo(drag: Drag | null, event: ReactPointerEvent<SVGSVGElement>, svg: SVGSVGElement | null): Drag | null;
+/**
+ * Give the pointer back, so the next gesture reaches whatever it is aimed at.
+ * @param event - The event ending the drag.
+ */
+export declare function releaseDrag(event: ReactPointerEvent<SVGSVGElement>): void;
+export {};
+//# sourceMappingURL=chartGestures.d.ts.map

package/lib/chart/ui/chartGestures.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"chartGestures.d.ts","sourceRoot":"","sources":["../../../src/chart/ui/chartGestures.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AAEH,OAAO,KAAK,EAAE,YAAY,IAAI,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE/D,OAAO,KAAK,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AACrE,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,0BAA0B,CAAC;AACzD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAExD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AAEtD,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAKrD,sDAAsD;AACtD,KAAK,cAAc,GAAG,CAAC,KAAK,EAAE,iBAAiB,CAAC,aAAa,CAAC,KAAK,IAAI,CAAC;AAExE;;;;;;;;GAQG;AACH,MAAM,WAAW,mBAAmB;IAClC,8BAA8B;IAC9B,KAAK,EAAE,OAAO,CAAC;IACf,gDAAgD;IAChD,GAAG,EAAE,OAAO,CAAC;CACd;AAED,wDAAwD;AACxD,eAAO,MAAM,YAAY,EAAE,mBAAkD,CAAC;AAE9E,uDAAuD;AACvD,MAAM,WAAW,iBAAiB;IAChC,aAAa,EAAE,cAAc,CAAC;IAC9B,aAAa,EAAE,cAAc,CAAC;IAC9B,WAAW,EAAE,cAAc,CAAC;IAC5B,eAAe,EAAE,cAAc,CAAC;IAChC,aAAa,EAAE,MAAM,IAAI,CAAC;CAC3B;AAED,yEAAyE;AACzE,MAAM,WAAW,mBAAmB;IAClC;;;;;;;;;;;;OAYG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,KAAK,IAAI,CAAC;IAClD;;;;;;;;;;;;;;;;;;;;;;;OAuBG;IACH,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,EAAE,SAAS,EAAE,mBAAmB,KAAK,IAAI,CAAC;IACtE;;;;;;;;;;;;OAYG;IACH,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,OAAO,CAAC;CAClD;AAED,iEAAiE;AACjE,MAAM,WAAW,IAAK,SAAQ,OAAO;IACnC,iEAAiE;IACjE,SAAS,EAAE,MAAM,CAAC;CACnB;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,eAAe,CAC7B,OAAO,EAAE,WAAW,EACpB,QAAQ,EAAE,OAAO,EACjB,IAAI,EAAE,QAAQ,EACd,MAAM,EAAE,UAAU,EAClB,MAAM,EAAE,UAAU,EAClB,KAAK,EAAE,SAAS,EAChB,OAAO,EAAE,mBAAmB,EAC5B,SAAS,GAAE,mBAAkC,GAC5C,WAAW,GAAG,IAAI,CAcpB;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,WAAW,CACzB,KAAK,EAAE,iBAAiB,CAAC,aAAa,CAAC,EACvC,GAAG,EAAE,aAAa,GAAG,IAAI,EACzB,eAAe,EAAE,CAAC,CAAC,KAAK,EAAE,UAAU,KAAK,OAAO,CAAC,GAAG,SAAS,GAC5D,IAAI,GAAG,IAAI,CAeb;AAED;;;;;;;GAOG;AACH,wBAAgB,SAAS,CACvB,IAAI,EAAE,IAAI,GAAG,IAAI,EACjB,KAAK,EAAE,iBAAiB,CAAC,aAAa,CAAC,EACvC,GAAG,EAAE,aAAa,GAAG,IAAI,GACxB,IAAI,GAAG,IAAI,CAKb;AAED;;;GAGG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,iBAAiB,CAAC,aAAa,CAAC,GAAG,IAAI,CAIzE"}

package/lib/chart/ui/chartGestures.js

@@ -0,0 +1,145 @@
+/**
+ * A press on a chart, and what letting go of it answers.
+ *
+ * `useChartZoom` holds the React state — the window on screen, and the drag
+ * being made across it — and this holds the arithmetic that turns a release into
+ * an answer: a window to show, a range to report, a click to report, or nothing
+ * at all. Keeping the two apart is what lets the answer be tested without a
+ * renderer, which is how `zoomedDomain` beside it has always been read, and it
+ * is why this sits next to that file rather than inside the hook.
+ *
+ * The three things a host can be told about are here for the same reason. Only
+ * one of the four answers moves the window; the other three leave the chart
+ * exactly where it was, and deciding between them in one place is what stops a
+ * gesture reporting a range and a click for the same drag.
+ */
+import { chartValue } from "../core/chartScale.js";
+import { svgPointAt } from "../core/svgPoint.js";
+import { MINIMUM_DRAG, zoomedDomain } from "../core/zoomDomain.js";
+import { isInsidePlot } from "./useChartPointer.js";
+/** No key held, which is what a plain click reports. */
+export const NO_MODIFIERS = { shift: false, alt: false };
+/**
+ * What letting go of a drag comes to, told to the host on the way.
+ *
+ * One reading of the gesture answers all four outcomes, so what a select drag
+ * reports and what a zoom would have shown can never drift apart: the clamping
+ * to the plot, the `MINIMUM_DRAG` test and the sorting after inverting are done
+ * once, in `zoomedDomain`.
+ * @param current - The window in force, kept on the axis that is not asked for.
+ * @param released - The two corners as the button came up, in user units.
+ * @param plot - Where the plot sits inside the SVG.
+ * @param xScale - The x axis as the chart is currently zoomed.
+ * @param yScale - The y axis, likewise.
+ * @param rules - How the y axis behaves and what a drag means.
+ * @param reports - What the host asked to be told.
+ * @param modifiers
+ * @returns The window to show, `null` when the chart stays where it is.
+ */
+export function answeredRelease(current, released, plot, xScale, yScale, rules, reports, modifiers = NO_MODIFIERS) {
+    const mode = rules.drag ?? 'xAxis';
+    const next = zoomedDomain(current, released, plot, xScale, yScale, rules);
+    if (next === null) {
+        if (mode !== 'select') {
+            reportClick(released, plot, xScale, yScale, reports.onClick, modifiers);
+        }
+        return null;
+    }
+    if (mode === 'select') {
+        reports.onSelectRange?.(next.x);
+        return null;
+    }
+    return next;
+}
+/**
+ * The drag a press begins, `null` for a press that begins none.
+ *
+ * The host is asked before the pointer is captured rather than after it: a press
+ * taken from whatever it landed on cannot be handed back mid-gesture, so an
+ * integration boundary or a cursor drawn on the chart would never see the moves
+ * that drag it.
+ * @param event - The press.
+ * @param svg - The SVG it was made on, which is what places it in user units.
+ * @param shouldStartDrag - Whether the host lets the chart have it, absent when
+ * every press over the SVG is the chart's.
+ * @returns The drag, `null` when the press was not the chart's to take or the
+ * SVG cannot place the pointer.
+ */
+export function startedDrag(event, svg, shouldStartDrag) {
+    if (event.button !== LEFT_BUTTON)
+        return null;
+    const point = svgPointAt(svg, event.clientX, event.clientY);
+    if (point === null)
+        return null;
+    if (shouldStartDrag !== undefined && !shouldStartDrag(point))
+        return null;
+    // Captured so a drag running off the plot — which is how the y axis is asked
+    // for — keeps being reported.
+    event.currentTarget.setPointerCapture(event.pointerId);
+    return {
+        pointerId: event.pointerId,
+        fromX: point.x,
+        fromY: point.y,
+        toX: point.x,
+        toY: point.y,
+    };
+}
+/**
+ * Where a drag has got to, when the event belongs to it.
+ * @param drag - The drag being made, `null` when none is.
+ * @param event - The pointer event just received.
+ * @param svg - The SVG the gesture is made on.
+ * @returns The drag with its far corner moved, `null` when the event is not
+ * part of it or the SVG cannot place the pointer.
+ */
+export function draggedTo(drag, event, svg) {
+    if (drag?.pointerId !== event.pointerId)
+        return null;
+    const point = svgPointAt(svg, event.clientX, event.clientY);
+    if (point === null)
+        return null;
+    return { ...drag, toX: point.x, toY: point.y };
+}
+/**
+ * Give the pointer back, so the next gesture reaches whatever it is aimed at.
+ * @param event - The event ending the drag.
+ */
+export function releaseDrag(event) {
+    if (event.currentTarget.hasPointerCapture(event.pointerId)) {
+        event.currentTarget.releasePointerCapture(event.pointerId);
+    }
+}
+/**
+ * Tell a host where a press that went nowhere landed, in the units the chart is
+ * measured in.
+ *
+ * The travel is measured as the hand made it, before any clamping to the plot: a
+ * gesture that ran out over the tick labels travelled however far it travelled,
+ * and one begun outside the plot is refused by `isInsidePlot` rather than by
+ * arithmetic that pretends it stopped at the edge.
+ * @param released - The gesture as it was let go, in user units of the SVG.
+ * @param plot - Where the plot sits inside that SVG, which a click has to be
+ * over for the values it inverts to be ones the chart is drawing.
+ * @param xScale - The horizontal axis as the chart is currently zoomed.
+ * @param yScale - The vertical axis, likewise.
+ * @param onClick - What the host asked to be told, absent when it asked for
+ * nothing.
+ * @param modifiers - Which keys were held as the button came up.
+ */
+function reportClick(released, plot, xScale, yScale, onClick, modifiers) {
+    if (onClick === undefined)
+        return;
+    if (Math.abs(released.toX - released.fromX) >= MINIMUM_DRAG)
+        return;
+    if (Math.abs(released.toY - released.fromY) >= MINIMUM_DRAG)
+        return;
+    // Where the button came up rather than where it went down: the two are within
+    // `MINIMUM_DRAG` of each other, and the release is where the user was looking.
+    const point = { x: released.toX, y: released.toY };
+    if (!isInsidePlot(plot, point))
+        return;
+    onClick({ x: chartValue(xScale, point.x), y: chartValue(yScale, point.y) }, modifiers);
+}
+/** Which button drags a box; the others belong to menus and to panning. */
+const LEFT_BUTTON = 0;
+//# sourceMappingURL=chartGestures.js.map

package/lib/chart/ui/chartGestures.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"chartGestures.js","sourceRoot":"","sources":["../../../src/chart/ui/chartGestures.ts"],"names":[],"mappings":"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"}