react-cheminfo 0.9.0 → 0.11.0

package/lib/projection/ui/ProjectionSpaceMore.js

@@ -0,0 +1,57 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { chartAxisTitle } from "../../chart/core/chartLabels.js";
+import { OverlayAction } from "../../overlay/ui/OverlayAction.js";
+import { OverlayGroup } from "../../overlay/ui/OverlayGroup.js";
+import { OverlayNumber } from "../../overlay/ui/OverlayNumber.js";
+import { OverlayPanel } from "../../overlay/ui/OverlayPanel.js";
+import { OverlaySegmented } from "../../overlay/ui/OverlaySegmented.js";
+import { OverlaySelect } from "../../overlay/ui/OverlaySelect.js";
+import { PROJECTION_PANEL_NAME, PROJECTION_PANEL_SECTION, } from "../core/projectionStrings.js";
+import { PROJECTION_TAB_DEFAULTS } from "../core/projectionTabDefaults.js";
+import { CLOUD_GESTURE_CHOICES } from "./projectionCloudChoices.js";
+/**
+ * What the cloud keeps behind the cog: its three axes, the dot size, and what
+ * the two drags do.
+ *
+ * It is the map's panel with one picker more and one action fewer. There is no
+ * "zoom to selection" here, because a box has no frame to draw round a crowd:
+ * the reader turns it until the crowd is facing them, which is the gesture the
+ * whole tab exists for, and a button that guessed an angle for them would
+ * usually guess wrong.
+ * @param props - See {@link ProjectionSpaceMoreProps}.
+ * @returns The panel behind the cog.
+ */
+export function ProjectionSpaceMore(props) {
+    const { result, options, onChange, copy } = props;
+    const { selectedCount = 0, onResetView, onClearSelection } = props;
+    const { action, help, tab } = copy;
+    const nothingPicked = selectedCount === 0;
+    return (_jsxs(OverlayPanel, { title: tab.space, onReset: () => onChange(PROJECTION_TAB_DEFAULTS.space), actions: _jsxs(_Fragment, { children: [_jsx(OverlayAction, { text: action.resetView, icon: "reset", onClick: onResetView }), _jsx(OverlayAction, { text: action.clearSelection, icon: "cross", disabled: nothingPicked, onClick: onClearSelection })] }), children: [_jsxs(OverlayGroup, { label: PROJECTION_PANEL_SECTION.axes, divider: false, children: [_jsx(OverlaySelect, { label: PROJECTION_PANEL_NAME.xAxis, help: help.xAxis, value: String(options.xAxis), options: axisChoices(result, [options.yAxis, options.zAxis]), onChange: (value) => onChange({ xAxis: Number(value) }) }), _jsx(OverlaySelect, { label: PROJECTION_PANEL_NAME.yAxis, help: help.yAxis, value: String(options.yAxis), options: axisChoices(result, [options.xAxis, options.zAxis]), onChange: (value) => onChange({ yAxis: Number(value) }) }), _jsx(OverlaySelect, { label: PROJECTION_PANEL_NAME.zAxis, help: help.zAxis, value: String(options.zAxis), options: axisChoices(result, [options.xAxis, options.yAxis]), onChange: (value) => onChange({ zAxis: Number(value) }) })] }), _jsx(OverlayGroup, { label: PROJECTION_PANEL_SECTION.drawing, children: _jsx(OverlayNumber, { label: PROJECTION_PANEL_NAME.pointRadius, help: help.pointRadius, value: options.pointRadius, min: 1, max: 12, step: 0.5, digits: 1, unit: "px", onChange: (pointRadius) => onChange({ pointRadius }) }) }), _jsx(OverlayGroup, { label: PROJECTION_PANEL_SECTION.handling, children: _jsx(OverlaySegmented, { label: PROJECTION_PANEL_NAME.cloudGesture, help: help.cloudGesture, value: options.cloudGesture, options: CLOUD_GESTURE_CHOICES, onChange: (cloudGesture) => onChange({ cloudGesture }) }) }), _jsx(OverlayGroup, { label: PROJECTION_PANEL_SECTION.selecting, children: _jsx(OverlaySegmented, { label: PROJECTION_PANEL_NAME.selectMode, help: help.selectMode, value: options.selectMode, options: SELECT_MODE_CHOICES, onChange: (selectMode) => onChange({ selectMode }) }) })] }));
+}
+const AXIS_TAKEN_NOTE = 'Already drawn on another axis.';
+/** The same three words the map's panel offers, for the same reason. */
+const SELECT_MODE_CHOICES = [
+    { value: 'replace', label: 'Replace' },
+    { value: 'add', label: 'Add' },
+    { value: 'remove', label: 'Remove' },
+];
+/**
+ * The axes one picker offers, with the ones already drawn kept but unreachable.
+ * @param result - The reduced space being drawn.
+ * @param taken - The axes the other two pickers are showing.
+ * @returns The choices, in the order the run produced them.
+ */
+function axisChoices(result, taken) {
+    const choices = [];
+    for (const [index, axis] of result.axes.entries()) {
+        const drawn = taken.includes(index);
+        choices.push({
+            value: String(index),
+            label: chartAxisTitle(axis.name, { share: axis.share }),
+            disabled: drawn,
+            title: drawn ? AXIS_TAKEN_NOTE : undefined,
+        });
+    }
+    return choices;
+}
+//# sourceMappingURL=ProjectionSpaceMore.js.map

package/lib/projection/ui/ProjectionSpaceMore.js.map

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

package/lib/projection/ui/ProjectionSpaceTab.d.ts

@@ -0,0 +1,98 @@
+import type { ReactElement, ReactNode } from 'react';
+import type { ScatterPointOpen } from '../../scatter/ui/scatterPlotProps.ts';
+import type { SelectionChange } from '../../scatter/ui/useScatterSelection.ts';
+import type { OrbitCamera } from '../../scatter3d/core/orbitCamera.ts';
+import type { ProjectionCopy } from '../core/projectionCopy.ts';
+import type { ProjectionOptions } from '../core/projectionOptions.ts';
+import type { ProjectionResult } from '../core/projectionResult.ts';
+import type { ResolvedProjectionGroups } from '../core/projectionSamples.ts';
+import type { SelectionReport } from './ProjectionMapCaption.tsx';
+import type { ProjectionMapChrome } from './projectionMapChrome.ts';
+/** What {@link ProjectionSpaceTab} needs. */
+export interface ProjectionSpaceTabProps {
+    /** What the run produced, whatever produced it. */
+    result: ProjectionResult;
+    /** The groups, resolved once by the viewer so every tab colours alike. */
+    groups: ResolvedProjectionGroups;
+    /** What the cloud is showing, already resolved against `result`. */
+    options: ProjectionOptions;
+    /** The words the cloud writes, already merged over the defaults. */
+    copy: ProjectionCopy;
+    /** The key's title and entries, built once with the bar's explanation. */
+    chrome: ProjectionMapChrome;
+    /**
+     * What each sample is called, in the score matrix's row order.
+     * @default undefined — the setting has nothing to write and draws nothing
+     */
+    ids?: readonly string[];
+    /** Width of the figure, in pixels. */
+    width: number;
+    /** Height of the figure, in pixels. */
+    height: number;
+    /** The selected rows, as indices into the score matrix. */
+    selected: readonly number[];
+    /** Where the reader is standing, which the viewer keeps between visits. */
+    camera: OrbitCamera;
+    /** Called with the camera every frame of a turn leaves behind. */
+    onCameraChange: (camera: OrbitCamera) => void;
+    /** How far in the reader has zoomed. */
+    zoom: number;
+    /** Called with the zoom the wheel asks for. */
+    onZoomChange: (zoom: number) => void;
+    /**
+     * Whether the wheel zooms the box.
+     * @default true
+     */
+    wheelZoom?: boolean;
+    /**
+     * What the last gesture picked out, for the line over the picture.
+     * @default null — nothing has happened yet
+     */
+    report?: SelectionReport | null;
+    /**
+     * Called when a lasso is released or a dot is tapped.
+     * @default undefined
+     */
+    onSelectionChange?: (change: SelectionChange) => void;
+    /**
+     * Called with the row under the pointer, or `-1`.
+     * @default undefined
+     */
+    onHoverChange?: (index: number) => void;
+    /**
+     * Called when the reader double-clicks a sample.
+     * @default undefined
+     */
+    onPointDoubleClick?: (point: ScatterPointOpen) => void;
+    /**
+     * The card that follows the pointer, built by the viewer so that it says the
+     * same thing on every tab.
+     * @default undefined — no card is drawn
+     */
+    hoverCard?: ReactNode;
+    /**
+     * Value of the `data-testid` attribute of the figure.
+     * @default undefined
+     */
+    testId?: string;
+}
+/**
+ * The cloud: the same samples as the map, in a box the reader can turn.
+ *
+ * It earns a tab of its own rather than a switch on the map because it answers
+ * a different question. The map shows the two strongest patterns and is the
+ * right picture nine times in ten; the cloud is what a reader reaches for when
+ * two groups sit on top of each other there, because a third component often
+ * pulls them apart and no flat picture can show that.
+ *
+ * Everything it can share with the map it does share — the colours, the
+ * selection, the lasso, the key, the card and the names — so moving between
+ * the two tabs changes the picture and nothing else. What it cannot share is
+ * the scale: all three axes are stretched to one box, because a solid seen
+ * from an angle has nowhere to put three sets of tick labels, and a box drawn
+ * at three scales would tilt a group in a direction the data never did.
+ * @param props - See {@link ProjectionSpaceTabProps}.
+ * @returns The figure.
+ */
+export declare function ProjectionSpaceTab(props: ProjectionSpaceTabProps): ReactElement;
+//# sourceMappingURL=ProjectionSpaceTab.d.ts.map

package/lib/projection/ui/ProjectionSpaceTab.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProjectionSpaceTab.d.ts","sourceRoot":"","sources":["../../../src/projection/ui/ProjectionSpaceTab.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGrD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AAC7E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,yCAAyC,CAAC;AAC/E,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,qCAAqC,CAAC;AAEvE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAChE,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,8BAA8B,CAAC;AACtE,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,6BAA6B,CAAC;AACpE,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,8BAA8B,CAAC;AAE7E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAIlE,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAQpE,6CAA6C;AAC7C,MAAM,WAAW,uBAAuB;IACtC,mDAAmD;IACnD,MAAM,EAAE,gBAAgB,CAAC;IACzB,0EAA0E;IAC1E,MAAM,EAAE,wBAAwB,CAAC;IACjC,oEAAoE;IACpE,OAAO,EAAE,iBAAiB,CAAC;IAC3B,oEAAoE;IACpE,IAAI,EAAE,cAAc,CAAC;IACrB,0EAA0E;IAC1E,MAAM,EAAE,mBAAmB,CAAC;IAC5B;;;OAGG;IACH,GAAG,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IACxB,sCAAsC;IACtC,KAAK,EAAE,MAAM,CAAC;IACd,uCAAuC;IACvC,MAAM,EAAE,MAAM,CAAC;IACf,2DAA2D;IAC3D,QAAQ,EAAE,SAAS,MAAM,EAAE,CAAC;IAC5B,2EAA2E;IAC3E,MAAM,EAAE,WAAW,CAAC;IACpB,kEAAkE;IAClE,cAAc,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,IAAI,CAAC;IAC9C,wCAAwC;IACxC,IAAI,EAAE,MAAM,CAAC;IACb,+CAA+C;IAC/C,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,MAAM,CAAC,EAAE,eAAe,GAAG,IAAI,CAAC;IAChC;;;OAGG;IACH,iBAAiB,CAAC,EAAE,CAAC,MAAM,EAAE,eAAe,KAAK,IAAI,CAAC;IACtD;;;OAGG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC;;;OAGG;IACH,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE,gBAAgB,KAAK,IAAI,CAAC;IACvD;;;;OAIG;IACH,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,kBAAkB,CAChC,KAAK,EAAE,uBAAuB,GAC7B,YAAY,CA6Ed"}

package/lib/projection/ui/ProjectionSpaceTab.js

@@ -0,0 +1,66 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useMemo } from 'react';
+import { ScatterCloud } from "../../scatter3d/ui/ScatterCloud.js";
+import { ProjectionMapCaption } from "./ProjectionMapCaption.js";
+import { ProjectionMapLegend } from "./ProjectionMapLegend.js";
+import { ProjectionSurface } from "./ProjectionSurface.js";
+import { projectionAxisTitle, projectionMapCloud, projectionScatterGroups, } from "./projectionMapModel.js";
+import { MINIMUM_SHELL_POINTS } from "./projectionSpaceModel.js";
+/**
+ * The cloud: the same samples as the map, in a box the reader can turn.
+ *
+ * It earns a tab of its own rather than a switch on the map because it answers
+ * a different question. The map shows the two strongest patterns and is the
+ * right picture nine times in ten; the cloud is what a reader reaches for when
+ * two groups sit on top of each other there, because a third component often
+ * pulls them apart and no flat picture can show that.
+ *
+ * Everything it can share with the map it does share — the colours, the
+ * selection, the lasso, the key, the card and the names — so moving between
+ * the two tabs changes the picture and nothing else. What it cannot share is
+ * the scale: all three axes are stretched to one box, because a solid seen
+ * from an angle has nowhere to put three sets of tick labels, and a box drawn
+ * at three scales would tilt a group in a direction the data never did.
+ * @param props - See {@link ProjectionSpaceTabProps}.
+ * @returns The figure.
+ */
+export function ProjectionSpaceTab(props) {
+    const { result, groups, options, copy, chrome, width, height } = props;
+    const { ids, selected, report = null, camera, zoom } = props;
+    const { onCameraChange, onZoomChange, wheelZoom } = props;
+    const { onSelectionChange, onHoverChange, hoverCard, testId } = props;
+    const { onPointDoubleClick } = props;
+    const { scores, fittedCount } = result;
+    const { xAxis, yAxis, zAxis, colorBy, pointRadius } = options;
+    const { showGroupLabels, showIds, selectMode, cloudGesture } = options;
+    const { ellipse: shells } = options;
+    const flat = useMemo(() => projectionMapCloud(scores, xAxis, yAxis), [scores, xAxis, yAxis]);
+    const depth = useMemo(() => projectionMapCloud(scores, zAxis, zAxis).x, [scores, zAxis]);
+    const colored = colorBy === 'group' && groups.entries.length > 0;
+    return (_jsx("div", { style: { position: 'relative' }, "data-testid": testId, children: _jsx(ScatterCloud, { x: flat.x, y: flat.y, z: depth, width: width, height: height, xLabel: axisName(result, xAxis), yLabel: axisName(result, yAxis), zLabel: axisName(result, zAxis), groupOf: colored ? groups.groupOf : undefined, groups: colored ? projectionScatterGroups(groups) : undefined, ellipsoid: colored ? shells : null, ellipsoidMinimumPoints: MINIMUM_SHELL_POINTS, showGroupLabels: colored && showGroupLabels, pointLabels: showIds ? ids : undefined, pointRadius: pointRadius, outlinedFrom: fittedCount, selected: selected, onSelectionChange: onSelectionChange, selectMode: selectMode, onHoverChange: onHoverChange, onPointDoubleClick: onPointDoubleClick, gesture: cloudGesture, camera: camera, onCameraChange: onCameraChange, zoom: zoom, onZoomChange: onZoomChange, wheelZoom: wheelZoom, overlay: _jsxs(ProjectionSurface, { children: [chrome.entries.length === 0 ? null : (_jsx(ProjectionMapLegend, { title: chrome.title, entries: chrome.entries, cloud: flat, xDomain: CUBE_DOMAIN, yDomain: CUBE_DOMAIN, width: width, height: height })), _jsx(ProjectionMapCaption, { report: report, copy: copy, mode: selectMode, drawing: false }), hoverCard] }) }) }));
+}
+/**
+ * What an arm of the frame is called.
+ *
+ * The frame is the cloud's only record of which axis is which, so an axis the
+ * result cannot name is given its number rather than left blank: an unlabelled
+ * arm reads as a drawing error, and the reader cannot tell which of the three
+ * it was.
+ * @param result - The reduced space being drawn.
+ * @param index - Which axis.
+ * @returns The name to write on that arm.
+ */
+function axisName(result, index) {
+    return projectionAxisTitle(result, index) ?? `Axis ${index + 1}`;
+}
+/**
+ * The range the key measures emptiness against.
+ *
+ * The key floats in whichever corner of the picture holds fewest dots, and it
+ * works that out from the cloud's own coordinates against a range. A turning
+ * box has no fixed range in data units — the same sample is at a different
+ * corner a second later — so the cube's own is used, which is stable and is
+ * what the corners of the picture actually are.
+ */
+const CUBE_DOMAIN = [-1, 1];
+//# sourceMappingURL=ProjectionSpaceTab.js.map

package/lib/projection/ui/ProjectionSpaceTab.js.map

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

package/lib/projection/ui/ProjectionSurface.d.ts

@@ -0,0 +1,33 @@
+import type { ReactElement, ReactNode } from 'react';
+/** What {@link ProjectionSurface} needs. */
+export interface ProjectionSurfaceProps {
+    /** The chrome drawn at the compact size: the settings bar, a floating key. */
+    children: ReactNode;
+    /**
+     * Width of the figure, in pixels, for the chrome that has to decide whether
+     * it still fits. Only the settings bar needs it — chrome inside a chart is
+     * already over a measured figure and inherits its width.
+     * @default undefined — whatever the surface above it was measured at
+     */
+    width?: number;
+}
+/**
+ * The compact measurements every piece of this viewer's chrome is drawn from.
+ *
+ * The viewer is meant to be embedded in somebody else's page, so its chrome
+ * takes the smallest measurements the overlay domain offers rather than the
+ * roomier ones a figure standing alone can afford. A finger still wins: the
+ * pointer is read here, and a coarse one is handed the largest set whatever
+ * the figure asked for.
+ *
+ * It is a surface of its own rather than an `OverlayLayer` because the
+ * settings bar is in the flow above the picture, and a layer is absolutely
+ * positioned over one — a bar inside a layer would float over the very data it
+ * introduces. Everything else about the surface it stands on is carried
+ * through, so a key nested inside a chart's own layer still fades with that
+ * chart and still knows it is repainting.
+ * @param props - See {@link ProjectionSurfaceProps}.
+ * @returns The chrome, drawn compact.
+ */
+export declare function ProjectionSurface(props: ProjectionSurfaceProps): ReactElement;
+//# sourceMappingURL=ProjectionSurface.d.ts.map

package/lib/projection/ui/ProjectionSurface.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProjectionSurface.d.ts","sourceRoot":"","sources":["../../../src/projection/ui/ProjectionSurface.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAWrD,4CAA4C;AAC5C,MAAM,WAAW,sBAAsB;IACrC,8EAA8E;IAC9E,QAAQ,EAAE,SAAS,CAAC;IACpB;;;;;OAKG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,sBAAsB,GAAG,YAAY,CAoB7E"}

package/lib/projection/ui/ProjectionSurface.js

@@ -0,0 +1,35 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useMemo } from 'react';
+import { overlayMetrics } from "../../overlay/core/overlayMetrics.js";
+import { OverlaySurfaceContext, useCoarsePointer, useOverlaySurface, } from "../../overlay/ui/overlaySurface.js";
+/**
+ * The compact measurements every piece of this viewer's chrome is drawn from.
+ *
+ * The viewer is meant to be embedded in somebody else's page, so its chrome
+ * takes the smallest measurements the overlay domain offers rather than the
+ * roomier ones a figure standing alone can afford. A finger still wins: the
+ * pointer is read here, and a coarse one is handed the largest set whatever
+ * the figure asked for.
+ *
+ * It is a surface of its own rather than an `OverlayLayer` because the
+ * settings bar is in the flow above the picture, and a layer is absolutely
+ * positioned over one — a bar inside a layer would float over the very data it
+ * introduces. Everything else about the surface it stands on is carried
+ * through, so a key nested inside a chart's own layer still fades with that
+ * chart and still knows it is repainting.
+ * @param props - See {@link ProjectionSurfaceProps}.
+ * @returns The chrome, drawn compact.
+ */
+export function ProjectionSurface(props) {
+    const { children, width } = props;
+    const above = useOverlaySurface();
+    const pointer = useCoarsePointer() ? 'coarse' : 'fine';
+    const surface = useMemo(() => ({
+        ...above,
+        metrics: overlayMetrics('compact', pointer),
+        pointer,
+        width: width ?? above.width,
+    }), [above, pointer, width]);
+    return (_jsx(OverlaySurfaceContext.Provider, { value: surface, children: children }));
+}
+//# sourceMappingURL=ProjectionSurface.js.map

package/lib/projection/ui/ProjectionSurface.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProjectionSurface.js","sourceRoot":"","sources":["../../../src/projection/ui/ProjectionSurface.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;AAEhC,OAAO,EAAE,cAAc,EAAE,MAAM,sCAAsC,CAAC;AAEtE,OAAO,EACL,qBAAqB,EACrB,gBAAgB,EAChB,iBAAiB,GAClB,MAAM,oCAAoC,CAAC;AAe5C;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,UAAU,iBAAiB,CAAC,KAA6B;IAC7D,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,KAAK,CAAC;IAClC,MAAM,KAAK,GAAG,iBAAiB,EAAE,CAAC;IAClC,MAAM,OAAO,GAAG,gBAAgB,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC;IAEvD,MAAM,OAAO,GAAG,OAAO,CACrB,GAAG,EAAE,CAAC,CAAC;QACL,GAAG,KAAK;QACR,OAAO,EAAE,cAAc,CAAC,SAAS,EAAE,OAAO,CAAC;QAC3C,OAAO;QACP,KAAK,EAAE,KAAK,IAAI,KAAK,CAAC,KAAK;KAC5B,CAAC,EACF,CAAC,KAAK,EAAE,OAAO,EAAE,KAAK,CAAC,CACxB,CAAC;IAEF,OAAO,CACL,KAAC,qBAAqB,CAAC,QAAQ,IAAC,KAAK,EAAE,OAAO,YAC3C,QAAQ,GACsB,CAClC,CAAC;AACJ,CAAC"}

package/lib/projection/ui/ProjectionTabStrip.d.ts

@@ -0,0 +1,74 @@
+import type { ReactElement } from 'react';
+import type { OverlayTier } from '../../overlay/core/overlayTiers.ts';
+import type { ProjectionTab } from '../core/projectionTabs.ts';
+/** What {@link ProjectionTabStrip} needs. */
+export interface ProjectionTabStripProps {
+    /** The tabs the result can fill, in reading order. */
+    tabs: readonly ProjectionTab[];
+    /** The one showing. */
+    tab: ProjectionTab;
+    /** Called with the tab the reader moved to. */
+    onTabChange: (tab: ProjectionTab) => void;
+    /** What each tab is called, from the viewer's copy. */
+    labels: Readonly<Record<ProjectionTab, string>>;
+    /**
+     * What each tab is called on a bar with no room for the long name. They are
+     * written out rather than truncated: "How much each explains" cut to the
+     * width that fits reads "How much each e…", which says less than the one
+     * word the tab is about.
+     */
+    shortLabels: Readonly<Record<ProjectionTab, string>>;
+    /**
+     * Stem of the `id` every button carries, so the panel below can name the tab
+     * it belongs to and a screen reader can walk between the two.
+     */
+    baseId: string;
+    /**
+     * The `id` of the panel the buttons drive. One panel is shared, because only
+     * the showing tab is ever rendered.
+     */
+    panelId: string;
+    /**
+     * How much of itself the bar is writing, which decides whether the names are
+     * written in full and whether the strip may scroll rather than shrink.
+     * @default 'full'
+     */
+    tier?: OverlayTier;
+    /**
+     * The most room the strip may take once it is scrolling, which is whatever
+     * the settings and the glyphs at the far end do not need. Without it the row
+     * would hand the strip and the settings a share of the shortfall each, and
+     * the settings — a chip beside a cog — have nothing to give.
+     * @default Number.POSITIVE_INFINITY — the strip takes what it needs
+     */
+    maxWidth?: number;
+    /**
+     * What the strip is called, for a reader arriving by tab.
+     * @default 'Views'
+     */
+    label?: string;
+}
+/**
+ * The connected pills that move between a projection's four views.
+ *
+ * They are the package's one segmented control rather than a strip of their
+ * own, so a reader who has pressed the choices inside a settings card has
+ * already learned to press these — and the pills sit at the start of the same
+ * bar those settings sit at the end of, which is what makes the two read as
+ * one piece of chrome instead of two rows stacked over the figure.
+ *
+ * What a narrowing figure takes from them is words and never views. First the
+ * long names give way to the short ones; then, on a figure too narrow to hold
+ * four names however short, the strip scrolls and the view in force is brought
+ * into sight — a reader who cannot see which view they are on, or cannot reach
+ * the others, is stuck rather than merely short of room.
+ *
+ * The shell draws none at all when the result can fill only one tab: a single
+ * pill says nothing about the data and still costs the reader a glance to rule
+ * out. The bar itself stays, because the settings and the explanation still
+ * belong somewhere.
+ * @param props - See {@link ProjectionTabStripProps}.
+ * @returns The strip.
+ */
+export declare function ProjectionTabStrip(props: ProjectionTabStripProps): ReactElement;
+//# sourceMappingURL=ProjectionTabStrip.d.ts.map

package/lib/projection/ui/ProjectionTabStrip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProjectionTabStrip.d.ts","sourceRoot":"","sources":["../../../src/projection/ui/ProjectionTabStrip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAG1C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,oCAAoC,CAAC;AAGtE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,2BAA2B,CAAC;AAO/D,6CAA6C;AAC7C,MAAM,WAAW,uBAAuB;IACtC,sDAAsD;IACtD,IAAI,EAAE,SAAS,aAAa,EAAE,CAAC;IAC/B,uBAAuB;IACvB,GAAG,EAAE,aAAa,CAAC;IACnB,+CAA+C;IAC/C,WAAW,EAAE,CAAC,GAAG,EAAE,aAAa,KAAK,IAAI,CAAC;IAC1C,uDAAuD;IACvD,MAAM,EAAE,QAAQ,CAAC,MAAM,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC,CAAC;IAChD;;;;;OAKG;IACH,WAAW,EAAE,QAAQ,CAAC,MAAM,CAAC,aAAa,EAAE,MAAM,CAAC,CAAC,CAAC;IACrD;;;OAGG;IACH,MAAM,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB;;;;OAIG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,wBAAgB,kBAAkB,CAChC,KAAK,EAAE,uBAAuB,GAC7B,YAAY,CAgCd"}

package/lib/projection/ui/ProjectionTabStrip.js

@@ -0,0 +1,64 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useMemo, useRef } from 'react';
+import { OverlayPills } from "../../overlay/ui/OverlayPills.js";
+import { projectionTabScroll, projectionTabTrackStyle, } from "./projectionBarStyles.js";
+/**
+ * The connected pills that move between a projection's four views.
+ *
+ * They are the package's one segmented control rather than a strip of their
+ * own, so a reader who has pressed the choices inside a settings card has
+ * already learned to press these — and the pills sit at the start of the same
+ * bar those settings sit at the end of, which is what makes the two read as
+ * one piece of chrome instead of two rows stacked over the figure.
+ *
+ * What a narrowing figure takes from them is words and never views. First the
+ * long names give way to the short ones; then, on a figure too narrow to hold
+ * four names however short, the strip scrolls and the view in force is brought
+ * into sight — a reader who cannot see which view they are on, or cannot reach
+ * the others, is stuck rather than merely short of room.
+ *
+ * The shell draws none at all when the result can fill only one tab: a single
+ * pill says nothing about the data and still costs the reader a glance to rule
+ * out. The bar itself stays, because the settings and the explanation still
+ * belong somewhere.
+ * @param props - See {@link ProjectionTabStripProps}.
+ * @returns The strip.
+ */
+export function ProjectionTabStrip(props) {
+    const { tabs, tab, onTabChange, labels, shortLabels } = props;
+    const { baseId, panelId, tier = 'full', label } = props;
+    const { maxWidth = Number.POSITIVE_INFINITY } = props;
+    const track = useRef(null);
+    const scrolls = tier === 'tiny';
+    const written = tier === 'full' || tier === 'condensed' ? labels : shortLabels;
+    const options = useMemo(() => tabs.map((entry) => ({ value: entry, label: written[entry] })), [tabs, written]);
+    useEffect(() => {
+        if (!scrolls)
+            return;
+        showSelected(track.current);
+    }, [scrolls, tab, options, maxWidth]);
+    return (_jsx("div", { ref: track, style: projectionTabTrackStyle(scrolls, maxWidth), children: _jsx(OverlayPills, { role: "tablist", label: label ?? 'Views', value: tab, options: options, baseId: baseId, panelId: panelId, onChange: onTabChange }) }));
+}
+/**
+ * Bring the view in force back into sight inside a scrolling strip.
+ *
+ * The box is scrolled by hand rather than through `scrollIntoView`, which asks
+ * every scrolling ancestor to move as well — so a figure halfway down somebody
+ * else's page would jump under the reader for a tab they can already see.
+ *
+ * Where the view sits is measured against the strip's own box rather than read
+ * off `offsetLeft`, which is relative to whichever ancestor happens to be
+ * positioned — here the card, several boxes further out.
+ * @param box - The scrolling box, when it has been laid out.
+ */
+function showSelected(box) {
+    if (box === null)
+        return;
+    const selected = box.querySelector('[aria-selected="true"]');
+    if (selected === null)
+        return;
+    const seen = selected.getBoundingClientRect();
+    const left = seen.left - box.getBoundingClientRect().left + box.scrollLeft;
+    box.scrollLeft = projectionTabScroll(left, left + seen.width, box.scrollLeft, box.clientWidth);
+}
+//# sourceMappingURL=ProjectionTabStrip.js.map

package/lib/projection/ui/ProjectionTabStrip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProjectionTabStrip.js","sourceRoot":"","sources":["../../../src/projection/ui/ProjectionTabStrip.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAInD,OAAO,EAAE,YAAY,EAAE,MAAM,kCAAmC,CAAC;AAGjE,OAAO,EACL,mBAAmB,EACnB,uBAAuB,GACxB,MAAM,0BAA0B,CAAC;AAkDlC;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,MAAM,UAAU,kBAAkB,CAChC,KAA8B;IAE9B,MAAM,EAAE,IAAI,EAAE,GAAG,EAAE,WAAW,EAAE,MAAM,EAAE,WAAW,EAAE,GAAG,KAAK,CAAC;IAC9D,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,GAAG,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,CAAC;IACxD,MAAM,EAAE,QAAQ,GAAG,MAAM,CAAC,iBAAiB,EAAE,GAAG,KAAK,CAAC;IACtD,MAAM,KAAK,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAE3C,MAAM,OAAO,GAAG,IAAI,KAAK,MAAM,CAAC;IAChC,MAAM,OAAO,GACX,IAAI,KAAK,MAAM,IAAI,IAAI,KAAK,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,WAAW,CAAC;IACjE,MAAM,OAAO,GAAG,OAAO,CACrB,GAAG,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,EACpE,CAAC,IAAI,EAAE,OAAO,CAAC,CAChB,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,OAAO;YAAE,OAAO;QACrB,YAAY,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;IAC9B,CAAC,EAAE,CAAC,OAAO,EAAE,GAAG,EAAE,OAAO,EAAE,QAAQ,CAAC,CAAC,CAAC;IAEtC,OAAO,CACL,cAAK,GAAG,EAAE,KAAK,EAAE,KAAK,EAAE,uBAAuB,CAAC,OAAO,EAAE,QAAQ,CAAC,YAChE,KAAC,YAAY,IACX,IAAI,EAAC,SAAS,EACd,KAAK,EAAE,KAAK,IAAI,OAAO,EACvB,KAAK,EAAE,GAAG,EACV,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,WAAW,GACrB,GACE,CACP,CAAC;AACJ,CAAC;AAED;;;;;;;;;;;GAWG;AACH,SAAS,YAAY,CAAC,GAA0B;IAC9C,IAAI,GAAG,KAAK,IAAI;QAAE,OAAO;IACzB,MAAM,QAAQ,GAAG,GAAG,CAAC,aAAa,CAAc,wBAAwB,CAAC,CAAC;IAC1E,IAAI,QAAQ,KAAK,IAAI;QAAE,OAAO;IAC9B,MAAM,IAAI,GAAG,QAAQ,CAAC,qBAAqB,EAAE,CAAC;IAC9C,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,GAAG,GAAG,CAAC,qBAAqB,EAAE,CAAC,IAAI,GAAG,GAAG,CAAC,UAAU,CAAC;IAC3E,GAAG,CAAC,UAAU,GAAG,mBAAmB,CAClC,IAAI,EACJ,IAAI,GAAG,IAAI,CAAC,KAAK,EACjB,GAAG,CAAC,UAAU,EACd,GAAG,CAAC,WAAW,CAChB,CAAC;AACJ,CAAC"}

package/lib/projection/ui/ProjectionVariablesControls.d.ts

@@ -0,0 +1,33 @@
+import type { ReactElement } from 'react';
+import type { OverlayTier } from '../../overlay/core/overlayTiers.ts';
+import type { ProjectionCopy } from '../core/projectionCopy.ts';
+import type { ProjectionOptions } from '../core/projectionOptions.ts';
+import type { ProjectionVariablesAvailability } from './projectionViewChoices.ts';
+/** What the "what differs" picker on the bar is drawn from. */
+export interface ProjectionVariablesControlsProps extends ProjectionVariablesAvailability {
+    /** Every option the panels are drawn from. */
+    options: ProjectionOptions;
+    /** The words the bar writes, already merged over the defaults. */
+    copy: ProjectionCopy;
+    /** Called with only the options that changed, for the viewer to merge. */
+    onChange: (patch: Partial<ProjectionOptions>) => void;
+    /**
+     * How much of itself the bar is writing.
+     * @default 'full'
+     */
+    tier?: OverlayTier;
+}
+/**
+ * The one control of the "what differs" tab that stays on the bar.
+ *
+ * "Show" is the only choice here that changes what the panels mean rather than
+ * how they are drawn, and it is the one a reader who has never met a loading
+ * needs first. A view whose data the run never reported is greyed rather than
+ * dropped, with the reason on the choice itself: a reader who cannot see that
+ * "Weights in your units" exists never learns to ask their colleague for a
+ * scaled model.
+ * @param props - See {@link ProjectionVariablesControlsProps}.
+ * @returns The picker.
+ */
+export declare function ProjectionVariablesControls(props: ProjectionVariablesControlsProps): ReactElement;
+//# sourceMappingURL=ProjectionVariablesControls.d.ts.map

package/lib/projection/ui/ProjectionVariablesControls.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProjectionVariablesControls.d.ts","sourceRoot":"","sources":["../../../src/projection/ui/ProjectionVariablesControls.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,oCAAoC,CAAC;AAEtE,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAChE,OAAO,KAAK,EACV,iBAAiB,EAElB,MAAM,8BAA8B,CAAC;AAEtC,OAAO,KAAK,EAAE,+BAA+B,EAAE,MAAM,4BAA4B,CAAC;AAGlF,+DAA+D;AAC/D,MAAM,WAAW,gCAAiC,SAAQ,+BAA+B;IACvF,8CAA8C;IAC9C,OAAO,EAAE,iBAAiB,CAAC;IAC3B,kEAAkE;IAClE,IAAI,EAAE,cAAc,CAAC;IACrB,0EAA0E;IAC1E,QAAQ,EAAE,CAAC,KAAK,EAAE,OAAO,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;IACtD;;;OAGG;IACH,IAAI,CAAC,EAAE,WAAW,CAAC;CACpB;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,2BAA2B,CACzC,KAAK,EAAE,gCAAgC,GACtC,YAAY,CAmBd"}

package/lib/projection/ui/ProjectionVariablesControls.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { OverlayValueMenu } from "../../overlay/ui/OverlayValueMenu.js";
+import { projectionViewChoices } from "./projectionViewChoices.js";
+/**
+ * The one control of the "what differs" tab that stays on the bar.
+ *
+ * "Show" is the only choice here that changes what the panels mean rather than
+ * how they are drawn, and it is the one a reader who has never met a loading
+ * needs first. A view whose data the run never reported is greyed rather than
+ * dropped, with the reason on the choice itself: a reader who cannot see that
+ * "Weights in your units" exists never learns to ask their colleague for a
+ * scaled model.
+ * @param props - See {@link ProjectionVariablesControlsProps}.
+ * @returns The picker.
+ */
+export function ProjectionVariablesControls(props) {
+    const { options, copy, onChange, tier = 'full' } = props;
+    const { canShowEffect, canRescale, canPickSample } = props;
+    const { bar, help } = copy;
+    return (_jsx(OverlayValueMenu, { label: help.variablesView.title, keyWord: bar.key.variablesView, showKey: tier === 'full', value: options.variablesView, options: projectionViewChoices(copy, {
+            canShowEffect,
+            canRescale,
+            canPickSample,
+        }), onChange: (variablesView) => onChange({ variablesView }) }));
+}
+//# sourceMappingURL=ProjectionVariablesControls.js.map

package/lib/projection/ui/ProjectionVariablesControls.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProjectionVariablesControls.js","sourceRoot":"","sources":["../../../src/projection/ui/ProjectionVariablesControls.tsx"],"names":[],"mappings":";AAGA,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAuC,CAAC;AAQzE,OAAO,EAAE,qBAAqB,EAAE,MAAM,4BAA4B,CAAC;AAiBnE;;;;;;;;;;;GAWG;AACH,MAAM,UAAU,2BAA2B,CACzC,KAAuC;IAEvC,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,GAAG,MAAM,EAAE,GAAG,KAAK,CAAC;IACzD,MAAM,EAAE,aAAa,EAAE,UAAU,EAAE,aAAa,EAAE,GAAG,KAAK,CAAC;IAC3D,MAAM,EAAE,GAAG,EAAE,IAAI,EAAE,GAAG,IAAI,CAAC;IAE3B,OAAO,CACL,KAAC,gBAAgB,IACf,KAAK,EAAE,IAAI,CAAC,aAAa,CAAC,KAAK,EAC/B,OAAO,EAAE,GAAG,CAAC,GAAG,CAAC,aAAa,EAC9B,OAAO,EAAE,IAAI,KAAK,MAAM,EACxB,KAAK,EAAE,OAAO,CAAC,aAAa,EAC5B,OAAO,EAAE,qBAAqB,CAAC,IAAI,EAAE;YACnC,aAAa;YACb,UAAU;YACV,aAAa;SACd,CAAC,EACF,QAAQ,EAAE,CAAC,aAAa,EAAE,EAAE,CAAC,QAAQ,CAAC,EAAE,aAAa,EAAE,CAAC,GACxD,CACH,CAAC;AACJ,CAAC"}

package/lib/projection/ui/ProjectionVariablesMore.d.ts

@@ -0,0 +1,33 @@
+import type { ReactElement } from 'react';
+import type { ProjectionCopy } from '../core/projectionCopy.ts';
+import type { ProjectionOptions } from '../core/projectionOptions.ts';
+import type { ProjectionVariablesAvailability } from './projectionViewChoices.ts';
+/** What the panels keep behind the cog is drawn from. */
+export interface ProjectionVariablesMoreProps extends ProjectionVariablesAvailability {
+    /** Every option the panels are drawn from. */
+    options: ProjectionOptions;
+    /** The words the bar writes, already merged over the defaults. */
+    copy: ProjectionCopy;
+    /** How many components the run produced, which caps the panel count. */
+    axisCount: number;
+    /** Whether the measurements lie along a number line, which fixes their order. */
+    continuous: boolean;
+    /** Called with only the options that changed, for the viewer to merge. */
+    onChange: (patch: Partial<ProjectionOptions>) => void;
+}
+/**
+ * What the "what differs" tab keeps behind the cog: which view the panels
+ * draw, how many of them there are, what they are measured against, and how
+ * the marks along them are drawn.
+ *
+ * Six settings in one column is a list the eye slides off, so the two that
+ * decide what a panel *is* stand at the top under no heading at all, and the
+ * rest are filed under what they are about — the scale the panels are read
+ * against, then the marks drawn on them. The first two need no heading
+ * precisely because they are first: a caption over the top of a panel repeats
+ * the panel's own title.
+ * @param props - See {@link ProjectionVariablesMoreProps}.
+ * @returns The panel behind the cog.
+ */
+export declare function ProjectionVariablesMore(props: ProjectionVariablesMoreProps): ReactElement;
+//# sourceMappingURL=ProjectionVariablesMore.d.ts.map

package/lib/projection/ui/ProjectionVariablesMore.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProjectionVariablesMore.d.ts","sourceRoot":"","sources":["../../../src/projection/ui/ProjectionVariablesMore.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAS1C,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAChE,OAAO,KAAK,EACV,iBAAiB,EAElB,MAAM,8BAA8B,CAAC;AAOtC,OAAO,KAAK,EAAE,+BAA+B,EAAE,MAAM,4BAA4B,CAAC;AAGlF,yDAAyD;AACzD,MAAM,WAAW,4BAA6B,SAAQ,+BAA+B;IACnF,8CAA8C;IAC9C,OAAO,EAAE,iBAAiB,CAAC;IAC3B,kEAAkE;IAClE,IAAI,EAAE,cAAc,CAAC;IACrB,wEAAwE;IACxE,SAAS,EAAE,MAAM,CAAC;IAClB,iFAAiF;IACjF,UAAU,EAAE,OAAO,CAAC;IACpB,0EAA0E;IAC1E,QAAQ,EAAE,CAAC,KAAK,EAAE,OAAO,CAAC,iBAAiB,CAAC,KAAK,IAAI,CAAC;CACvD;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,uBAAuB,CACrC,KAAK,EAAE,4BAA4B,GAClC,YAAY,CAkEd"}