react-cheminfo 0.27.0 → 0.29.0

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

@@ -0,0 +1,88 @@
+/**
+ * The gestures that move the window a chart is showing.
+ *
+ * A drag zooms the x axis, because that is the axis a chemist reads: the
+ * question is nearly always "what is between 366 and 372", never "what is
+ * between forty and sixty percent". The y axis comes along only when the drag is
+ * released past the baseline, a gesture that cannot be made by accident and one
+ * the preview rectangle announces before the button is let go. The wheel scales
+ * the y axis on its own, bringing up the small features being asked about far
+ * more often than any box around them, and a double click puts the window back.
+ *
+ * Which of them a chart answers is `ZoomGestures`, and a viewer is free to offer
+ * fewer: a drag can be the rectangle it sweeps out, and the wheel can be left to
+ * the page. Neither is a preference to be toggled — it is what the measurement
+ * makes worth doing, and `chartDomain.ts` says why.
+ *
+ * Not every gesture moves the window. A drag can be asked to report the range it
+ * swept out, a press that went nowhere is a click, and a host can refuse a press
+ * outright so that a handle drawn on the chart keeps the gesture aimed at it;
+ * `chartGestures.ts` holds all three, and `zoomDomain.ts` holds what a gesture
+ * does to a window. Neither knows anything of React, which is what lets the
+ * answer to a gesture be read without a chart on screen.
+ *
+ * What the window is fitted *to* is handed in rather than worked out here, and
+ * that is what makes one hook serve every kind of spectrum: fitting reads the
+ * traces, and a mass spectrum's are two per spectrum where an infrared
+ * spectrum's are one in either of two units. `useChartWindow` then holds the
+ * answer each viewer hands over.
+ */
+import type { RefObject } from 'react';
+import type { ChartDomain, YAxisRules, ZoomGestures } from '../core/chartDomain.ts';
+import type { ChartScale } from '../core/chartScale.ts';
+import type { ZoomSelection } from '../core/zoomDomain.ts';
+import type { ChartGestureReports, ChartZoomHandlers } from './chartGestures.ts';
+import type { ChartWindowOptions } from './useChartWindow.ts';
+/** The chart, what it is fitted to, and which gestures it answers. */
+export interface ChartZoomOptions extends ChartWindowOptions, ChartGestureReports {
+    /** The SVG the gestures are made on, as it was handed to its `ref`. */
+    svgRef: RefObject<SVGSVGElement | null>;
+    /**
+     * How the y axis behaves under a gesture — where its baseline is, and whether
+     * that baseline is held in the window.
+     * @default a stick spectrum's: a baseline of zero, always kept
+     */
+    yAxis?: YAxisRules;
+    /**
+     * Which gestures the chart answers: what a drag asks for, and whether the
+     * wheel scales the value axis at all.
+     *
+     * Both together rather than one at a time, because they are one decision. A
+     * viewer that reads its data in more than one way — an infrared spectrum is
+     * read as absorbance or as percent transmittance — settles the whole set from
+     * whatever it is currently reading, and hands it over as it stands.
+     * @default every gesture: a drag along the horizontal axis, and the wheel
+     */
+    gestures?: ZoomGestures;
+}
+/** The window, the drag being made in it, and how to work both. */
+export interface ChartZoom {
+    /** What the chart is showing. */
+    domain: ChartDomain;
+    /**
+     * The horizontal axis, as every gesture was measured against it: **draw with
+     * this rather than building one**, since a second scale beside it is a second
+     * chance to get a reversed axis the wrong way round.
+     */
+    xScale: ChartScale;
+    /** The vertical axis, likewise. */
+    yScale: ChartScale;
+    /** The drag being made, `null` when none is. */
+    selection: ZoomSelection | null;
+    /** Put the window back to everything that is drawn. */
+    reset: () => void;
+    /** Put on the SVG. */
+    handlers: ChartZoomHandlers;
+}
+/**
+ * Zoom a chart by dragging it, by the wheel and by double clicking it.
+ *
+ * Which window is on screen — the fit, the one a gesture arrived at, or the one
+ * a host imposes — is `useChartWindow`. What is here is what a gesture *is*: the
+ * drag as it is made, the rules it is read under, and the answer it comes to.
+ * @param options - The chart, the fit and how its y axis behaves.
+ * @returns The window and the gestures that move it.
+ */
+export declare function useChartZoom(options: ChartZoomOptions): ChartZoom;
+export { type ChartZoomHandlers } from './chartGestures.ts';
+//# sourceMappingURL=useChartZoom.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useChartZoom.d.ts","sourceRoot":"","sources":["../../../src/chart/ui/useChartZoom.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AAEH,OAAO,KAAK,EAAqC,SAAS,EAAE,MAAM,OAAO,CAAC;AAG1E,OAAO,KAAK,EACV,WAAW,EACX,UAAU,EACV,YAAY,EAEb,MAAM,wBAAwB,CAAC;AAEhC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAExD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAG3D,OAAO,KAAK,EACV,mBAAmB,EACnB,iBAAiB,EAElB,MAAM,oBAAoB,CAAC;AAO5B,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,qBAAqB,CAAC;AAI9D,sEAAsE;AACtE,MAAM,WAAW,gBACf,SAAQ,kBAAkB,EAAE,mBAAmB;IAC/C,uEAAuE;IACvE,MAAM,EAAE,SAAS,CAAC,aAAa,GAAG,IAAI,CAAC,CAAC;IACxC;;;;OAIG;IACH,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB;;;;;;;;;OASG;IACH,QAAQ,CAAC,EAAE,YAAY,CAAC;CACzB;AAED,mEAAmE;AACnE,MAAM,WAAW,SAAS;IACxB,iCAAiC;IACjC,MAAM,EAAE,WAAW,CAAC;IACpB;;;;OAIG;IACH,MAAM,EAAE,UAAU,CAAC;IACnB,mCAAmC;IACnC,MAAM,EAAE,UAAU,CAAC;IACnB,gDAAgD;IAChD,SAAS,EAAE,aAAa,GAAG,IAAI,CAAC;IAChC,uDAAuD;IACvD,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,sBAAsB;IACtB,QAAQ,EAAE,iBAAiB,CAAC;CAC7B;AAED;;;;;;;;GAQG;AACH,wBAAgB,YAAY,CAAC,OAAO,EAAE,gBAAgB,GAAG,SAAS,CA2IjE;AAED,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,oBAAoB,CAAC"}

package/lib/chart/ui/useChartZoom.js

@@ -0,0 +1,142 @@
+/**
+ * The gestures that move the window a chart is showing.
+ *
+ * A drag zooms the x axis, because that is the axis a chemist reads: the
+ * question is nearly always "what is between 366 and 372", never "what is
+ * between forty and sixty percent". The y axis comes along only when the drag is
+ * released past the baseline, a gesture that cannot be made by accident and one
+ * the preview rectangle announces before the button is let go. The wheel scales
+ * the y axis on its own, bringing up the small features being asked about far
+ * more often than any box around them, and a double click puts the window back.
+ *
+ * Which of them a chart answers is `ZoomGestures`, and a viewer is free to offer
+ * fewer: a drag can be the rectangle it sweeps out, and the wheel can be left to
+ * the page. Neither is a preference to be toggled — it is what the measurement
+ * makes worth doing, and `chartDomain.ts` says why.
+ *
+ * Not every gesture moves the window. A drag can be asked to report the range it
+ * swept out, a press that went nowhere is a click, and a host can refuse a press
+ * outright so that a handle drawn on the chart keeps the gesture aimed at it;
+ * `chartGestures.ts` holds all three, and `zoomDomain.ts` holds what a gesture
+ * does to a window. Neither knows anything of React, which is what lets the
+ * answer to a gesture be read without a chart on screen.
+ *
+ * What the window is fitted *to* is handed in rather than worked out here, and
+ * that is what makes one hook serve every kind of spectrum: fitting reads the
+ * traces, and a mass spectrum's are two per spectrum where an infrared
+ * spectrum's are one in either of two units. `useChartWindow` then holds the
+ * answer each viewer hands over.
+ */
+import { useCallback, useMemo, useState } from 'react';
+import { DEFAULT_ZOOM_GESTURES } from "../core/chartDomain.js";
+import { chartWheelFactor } from "../core/chartViewport.js";
+import { scaledYAxis, zoomSelection } from "../core/zoomDomain.js";
+import { answeredRelease, draggedTo, releaseDrag, startedDrag, } from "./chartGestures.js";
+import { useChartWindow } from "./useChartWindow.js";
+import { useWheelListener } from "./useWheelListener.js";
+/**
+ * Zoom a chart by dragging it, by the wheel and by double clicking it.
+ *
+ * Which window is on screen — the fit, the one a gesture arrived at, or the one
+ * a host imposes — is `useChartWindow`. What is here is what a gesture *is*: the
+ * drag as it is made, the rules it is read under, and the answer it comes to.
+ * @param options - The chart, the fit and how its y axis behaves.
+ * @returns The window and the gestures that move it.
+ */
+export function useChartZoom(options) {
+    const { fitted, fitKey, yFitKey, svgRef, plot, yAxis, gestures, reverseX = false, domain: imposed = null, onSelectRange, onClick, shouldStartDrag, } = options;
+    const { domain, xScale, yScale, show, reset } = useChartWindow({
+        fitted,
+        fitKey,
+        ...(yFitKey === undefined ? {} : { yFitKey }),
+        plot,
+        domain: imposed,
+        reverseX,
+    });
+    // Taken apart field by field rather than depending on the object, so a viewer
+    // rebuilding an equal `yAxis` or `gestures` on every render does not rebuild
+    // the rules and every callback hanging off them. Every field has to be listed
+    // here: one left out silently falls back to its default, which is how a
+    // transmittance chart came to answer a mass spectrum's question about its own
+    // baseline.
+    const baseline = yAxis?.baseline;
+    const keepBaseline = yAxis?.keepBaseline;
+    const pointsDown = yAxis?.pointsDown;
+    const dragMode = gestures?.drag ?? DEFAULT_ZOOM_GESTURES.drag;
+    const wheel = gestures?.wheel ?? DEFAULT_ZOOM_GESTURES.wheel;
+    const rules = useMemo(() => ({ baseline, keepBaseline, pointsDown, drag: dragMode }), [baseline, keepBaseline, pointsDown, dragMode]);
+    const [drag, setDrag] = useState(null);
+    const onWheel = useCallback((event) => {
+        // Refused before the event is touched, so a chart that does not answer the
+        // wheel scrolls the page under the pointer exactly as the rest of it does.
+        // Swallowing the gesture and doing nothing with it would be the one
+        // outcome nobody asked for.
+        if (!wheel)
+            return;
+        const factor = chartWheelFactor(event.deltaY, event.deltaMode);
+        if (factor === 1)
+            return;
+        // Heard non-passively for exactly this: without the refusal the chart
+        // zooms and the page scrolls out from under it at the same time.
+        event.preventDefault();
+        show(scaledYAxis(domain, factor, rules.baseline));
+    }, [domain, rules.baseline, wheel, show]);
+    useWheelListener(svgRef, onWheel);
+    const onPointerDown = useCallback((event) => {
+        const started = startedDrag(event, svgRef.current, shouldStartDrag);
+        if (started !== null)
+            setDrag(started);
+    }, [svgRef, shouldStartDrag]);
+    const onPointerMove = useCallback((event) => {
+        const moved = draggedTo(drag, event, svgRef.current);
+        if (moved !== null)
+            setDrag(moved);
+    }, [drag, svgRef]);
+    const onPointerUp = useCallback((event) => {
+        if (drag?.pointerId !== event.pointerId)
+            return;
+        releaseDrag(event);
+        setDrag(null);
+        const released = draggedTo(drag, event, svgRef.current) ?? drag;
+        const next = answeredRelease(domain, released, plot, xScale, yScale, rules, { onSelectRange, onClick }, 
+        // Read off the release rather than off the press, because that is where
+        // the reader was looking and what `reportClick` already inverts.
+        { shift: event.shiftKey, alt: event.altKey });
+        if (next !== null)
+            show(next);
+    }, [
+        drag,
+        domain,
+        plot,
+        xScale,
+        yScale,
+        svgRef,
+        rules,
+        onSelectRange,
+        onClick,
+        show,
+    ]);
+    const onPointerCancel = useCallback((event) => {
+        if (drag?.pointerId !== event.pointerId)
+            return;
+        releaseDrag(event);
+        setDrag(null);
+    }, [drag]);
+    const selection = useMemo(() => zoomSelection(drag, yScale, rules), [drag, yScale, rules]);
+    return {
+        domain,
+        xScale,
+        yScale,
+        selection,
+        reset,
+        handlers: {
+            onPointerDown,
+            onPointerMove,
+            onPointerUp,
+            onPointerCancel,
+            onDoubleClick: reset,
+        },
+    };
+}
+export {} from "./chartGestures.js";
+//# sourceMappingURL=useChartZoom.js.map

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

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

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

@@ -0,0 +1,30 @@
+/**
+ * The wheel over an element, heard loudly enough to refuse the page its
+ * scroll.
+ *
+ * React's `onWheel` is registered passively — the browser is told in advance
+ * that the page may scroll before the handler has had its say — so calling
+ * `preventDefault` inside it does nothing at all: the chart zooms and the page
+ * scrolls out from under it at the same time. The only way to be heard is to
+ * register the listener on the element directly with `{ passive: false }`,
+ * which is what this hook exists to do; nothing else about the gesture belongs
+ * here.
+ *
+ * The listener is attached once and reads the handler through a ref refreshed
+ * on every commit. Both halves are needed: attaching once is what keeps a
+ * pointer resting over the chart from re-registering a listener sixty times a
+ * second, and reading the handler live is what stops that one listener from
+ * zooming the window as it stood when the chart was mounted.
+ */
+import type { RefObject } from 'react';
+/**
+ * Hear the wheel over an element.
+ * @param ref - The element, as it was handed to its `ref`.
+ * @param handler - What to do with the wheel; free to be an inline arrow, since
+ * it is read at the moment the wheel turns rather than closed over when the
+ * listener is attached. It is the handler's own business to call
+ * `preventDefault` — the listener is registered so that the call is honoured,
+ * not so that it is made.
+ */
+export declare function useWheelListener<T extends Element>(ref: RefObject<T | null>, handler: (event: WheelEvent) => void): void;
+//# sourceMappingURL=useWheelListener.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useWheelListener.d.ts","sourceRoot":"","sources":["../../../src/chart/ui/useWheelListener.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AAEH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC;;;;;;;;GAQG;AACH,wBAAgB,gBAAgB,CAAC,CAAC,SAAS,OAAO,EAChD,GAAG,EAAE,SAAS,CAAC,CAAC,GAAG,IAAI,CAAC,EACxB,OAAO,EAAE,CAAC,KAAK,EAAE,UAAU,KAAK,IAAI,GACnC,IAAI,CAmBN"}

package/lib/chart/ui/useWheelListener.js

@@ -0,0 +1,57 @@
+/**
+ * The wheel over an element, heard loudly enough to refuse the page its
+ * scroll.
+ *
+ * React's `onWheel` is registered passively — the browser is told in advance
+ * that the page may scroll before the handler has had its say — so calling
+ * `preventDefault` inside it does nothing at all: the chart zooms and the page
+ * scrolls out from under it at the same time. The only way to be heard is to
+ * register the listener on the element directly with `{ passive: false }`,
+ * which is what this hook exists to do; nothing else about the gesture belongs
+ * here.
+ *
+ * The listener is attached once and reads the handler through a ref refreshed
+ * on every commit. Both halves are needed: attaching once is what keeps a
+ * pointer resting over the chart from re-registering a listener sixty times a
+ * second, and reading the handler live is what stops that one listener from
+ * zooming the window as it stood when the chart was mounted.
+ */
+import { useEffect, useLayoutEffect, useRef } from 'react';
+/**
+ * Hear the wheel over an element.
+ * @param ref - The element, as it was handed to its `ref`.
+ * @param handler - What to do with the wheel; free to be an inline arrow, since
+ * it is read at the moment the wheel turns rather than closed over when the
+ * listener is attached. It is the handler's own business to call
+ * `preventDefault` — the listener is registered so that the call is honoured,
+ * not so that it is made.
+ */
+export function useWheelListener(ref, handler) {
+    const latest = useRef(handler);
+    useLayoutEffect(() => {
+        latest.current = handler;
+    });
+    useEffect(() => {
+        const element = ref.current;
+        if (element === null)
+            return;
+        // Typed as the plain `Event` the element's own listener map hands it: an
+        // `Element` is not known to carry a wheel, so the narrowing is done here.
+        function onWheel(event) {
+            if (event instanceof WheelEvent)
+                latest.current(event);
+        }
+        element.addEventListener('wheel', onWheel, WHEEL_LISTENER);
+        return () => {
+            element.removeEventListener('wheel', onWheel);
+        };
+    }, [ref]);
+}
+/**
+ * Registered non-passively, which is the whole reason this hook exists. Nothing
+ * is passed back on removal: a listener is matched on its type, its function
+ * and its capture flag alone, and passing the options object there is a type
+ * error rather than a courtesy.
+ */
+const WHEEL_LISTENER = { passive: false };
+//# sourceMappingURL=useWheelListener.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useWheelListener.js","sourceRoot":"","sources":["../../../src/chart/ui/useWheelListener.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;GAiBG;AAGH,OAAO,EAAE,SAAS,EAAE,eAAe,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAE3D;;;;;;;;GAQG;AACH,MAAM,UAAU,gBAAgB,CAC9B,GAAwB,EACxB,OAAoC;IAEpC,MAAM,MAAM,GAAG,MAAM,CAAC,OAAO,CAAC,CAAC;IAC/B,eAAe,CAAC,GAAG,EAAE;QACnB,MAAM,CAAC,OAAO,GAAG,OAAO,CAAC;IAC3B,CAAC,CAAC,CAAC;IAEH,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,OAAO,GAAG,GAAG,CAAC,OAAO,CAAC;QAC5B,IAAI,OAAO,KAAK,IAAI;YAAE,OAAO;QAC7B,yEAAyE;QACzE,0EAA0E;QAC1E,SAAS,OAAO,CAAC,KAAY;YAC3B,IAAI,KAAK,YAAY,UAAU;gBAAE,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;QACzD,CAAC;QACD,OAAO,CAAC,gBAAgB,CAAC,OAAO,EAAE,OAAO,EAAE,cAAc,CAAC,CAAC;QAC3D,OAAO,GAAG,EAAE;YACV,OAAO,CAAC,mBAAmB,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;QAChD,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC;AACZ,CAAC;AAED;;;;;GAKG;AACH,MAAM,cAAc,GAAG,EAAE,OAAO,EAAE,KAAK,EAAW,CAAC"}

package/lib/clipboard/core/copyPng.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Put a PNG on the clipboard.
+ *
+ * The image is handed over as a promise rather than as a blob on purpose:
+ * Safari only allows a clipboard write that the click itself started, so the
+ * item has to be built while the handler is still running and the
+ * rasterization awaited by the clipboard rather than before it.
+ * @param png - The image being rasterized.
+ * @returns Whether it was copied. `false` outside a secure context, and in a
+ *   browser whose clipboard takes text only.
+ */
+export declare function writeImageToClipboard(png: Promise<Blob>): Promise<boolean>;
+//# sourceMappingURL=copyPng.d.ts.map

package/lib/clipboard/core/copyPng.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"copyPng.d.ts","sourceRoot":"","sources":["../../../src/clipboard/core/copyPng.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AACH,wBAAsB,qBAAqB,CACzC,GAAG,EAAE,OAAO,CAAC,IAAI,CAAC,GACjB,OAAO,CAAC,OAAO,CAAC,CAMlB"}

package/lib/clipboard/core/copyPng.js

@@ -0,0 +1,19 @@
+/**
+ * Put a PNG on the clipboard.
+ *
+ * The image is handed over as a promise rather than as a blob on purpose:
+ * Safari only allows a clipboard write that the click itself started, so the
+ * item has to be built while the handler is still running and the
+ * rasterization awaited by the clipboard rather than before it.
+ * @param png - The image being rasterized.
+ * @returns Whether it was copied. `false` outside a secure context, and in a
+ *   browser whose clipboard takes text only.
+ */
+export async function writeImageToClipboard(png) {
+    if (typeof ClipboardItem === 'undefined' || !navigator.clipboard?.write) {
+        return false;
+    }
+    await navigator.clipboard.write([new ClipboardItem({ 'image/png': png })]);
+    return true;
+}
+//# sourceMappingURL=copyPng.js.map

package/lib/clipboard/core/copyPng.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"copyPng.js","sourceRoot":"","sources":["../../../src/clipboard/core/copyPng.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AACH,MAAM,CAAC,KAAK,UAAU,qBAAqB,CACzC,GAAkB;IAElB,IAAI,OAAO,aAAa,KAAK,WAAW,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,KAAK,EAAE,CAAC;QACxE,OAAO,KAAK,CAAC;IACf,CAAC;IACD,MAAM,SAAS,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,IAAI,aAAa,CAAC,EAAE,WAAW,EAAE,GAAG,EAAE,CAAC,CAAC,CAAC,CAAC;IAC3E,OAAO,IAAI,CAAC;AACd,CAAC"}

package/lib/clipboard/core/index.d.ts

@@ -1,3 +1,4 @@
+export { writeImageToClipboard } from './copyPng.ts';
 export type { WriteBlobToClipboardOptions } from './writeBlobToClipboard.ts';
 export { writeBlobToClipboard } from './writeBlobToClipboard.ts';
 export type { ClipboardContent, ClipboardText } from './writeToClipboard.ts';

package/lib/clipboard/core/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/clipboard/core/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,2BAA2B,EAAE,MAAM,2BAA2B,CAAC;AAC7E,OAAO,EAAE,oBAAoB,EAAE,MAAM,2BAA2B,CAAC;AACjE,YAAY,EAAE,gBAAgB,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAC7E,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/clipboard/core/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,cAAc,CAAC;AACrD,YAAY,EAAE,2BAA2B,EAAE,MAAM,2BAA2B,CAAC;AAC7E,OAAO,EAAE,oBAAoB,EAAE,MAAM,2BAA2B,CAAC;AACjE,YAAY,EAAE,gBAAgB,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAC7E,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC"}

package/lib/clipboard/core/index.js

@@ -1,3 +1,4 @@
+export { writeImageToClipboard } from "./copyPng.js";
 export { writeBlobToClipboard } from "./writeBlobToClipboard.js";
 export { writeToClipboard } from "./writeToClipboard.js";
 //# sourceMappingURL=index.js.map

package/lib/clipboard/core/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/clipboard/core/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,oBAAoB,EAAE,MAAM,2BAA2B,CAAC;AAEjE,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/clipboard/core/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,cAAc,CAAC;AAErD,OAAO,EAAE,oBAAoB,EAAE,MAAM,2BAA2B,CAAC;AAEjE,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC"}

package/lib/clipboard/ui/CopyableValue.d.ts

@@ -3,7 +3,7 @@ import type { ReactElement, ReactNode } from 'react';
 export interface CopyableValueProps {
     /** What the value is, written above it, e.g. `InChIKey`. */
     label: string;
-    /** The value itself, which is also what the button copies. */
+    /** The value itself, which is what a click on it copies. */
     value: string;
     /**
      * A longer explanation of the label, shown on hover.
@@ -22,8 +22,9 @@ export interface CopyableValueProps {
      */
     maxHeight?: number | string;
     /**
-     * What the pointer and a screen reader are told the button does.
-     * @default `Copy the ${label}`
+     * What the pointer and a screen reader are told, replacing the title built
+     * from the label and the value.
+     * @default undefined — `Copy the ${label} (${value})`
      */
     copyTitle?: string;
     /**
@@ -38,14 +39,16 @@ export interface CopyableValueProps {
     className?: string;
 }
 /**
- * One read-only value, named, with the button that copies it.
+ * One read-only value, named, copied by clicking it.
  *
- * A derived notation — a SMILES, an InChIKey, an accession — is only useful
- * somewhere else, so a click on the value or on its button puts it on the
- * clipboard. An empty value reads as the missing marker and offers nothing to
- * copy.
+ * A derived notation — a SMILES, an InChIKey, an accession, a computed energy
+ * — is only useful somewhere else, so the value is the button that copies it:
+ * the cursor carries a clipboard over it, a click or `Enter` puts it on the
+ * clipboard, and a tick confirms. Nothing is drawn beside the label, which
+ * names the value and no more. An empty value reads as the missing marker and
+ * offers nothing to copy.
  * @param props - See {@link CopyableValueProps}.
- * @returns The labelled value and its copy button.
+ * @returns The labelled value.
  */
 export declare function CopyableValue(props: CopyableValueProps): ReactElement;
 //# sourceMappingURL=CopyableValue.d.ts.map

package/lib/clipboard/ui/CopyableValue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CopyableValue.d.ts","sourceRoot":"","sources":["../../../src/clipboard/ui/CopyableValue.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAiB,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAUpE,0DAA0D;AAC1D,MAAM,WAAW,kBAAkB;IACjC,4DAA4D;IAC5D,KAAK,EAAE,MAAM,CAAC;IACd,8DAA8D;IAC9D,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;GASG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,GAAG,YAAY,CAmDrE"}
+{"version":3,"file":"CopyableValue.d.ts","sourceRoot":"","sources":["../../../src/clipboard/ui/CopyableValue.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAiB,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AASpE,0DAA0D;AAC1D,MAAM,WAAW,kBAAkB;IACjC,4DAA4D;IAC5D,KAAK,EAAE,MAAM,CAAC;IACd,4DAA4D;IAC5D,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;OAIG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC5B;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,GAAG,YAAY,CA0CrE"}

package/lib/clipboard/ui/CopyableValue.js

@@ -2,32 +2,28 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { MISSING_VALUE } from "../../format/core/missing.js";
 import { TOKEN } from "../../tokens/core/familyTokens.js";
 import { ClickToCopy } from "./ClickToCopy.js";
-import { CopyButton } from "./CopyButton.js";
 const DEFAULT_BLOCK_HEIGHT = 160;
 /**
- * One read-only value, named, with the button that copies it.
+ * One read-only value, named, copied by clicking it.
  *
- * A derived notation — a SMILES, an InChIKey, an accession — is only useful
- * somewhere else, so a click on the value or on its button puts it on the
- * clipboard. An empty value reads as the missing marker and offers nothing to
- * copy.
+ * A derived notation — a SMILES, an InChIKey, an accession, a computed energy
+ * — is only useful somewhere else, so the value is the button that copies it:
+ * the cursor carries a clipboard over it, a click or `Enter` puts it on the
+ * clipboard, and a tick confirms. Nothing is drawn beside the label, which
+ * names the value and no more. An empty value reads as the missing marker and
+ * offers nothing to copy.
  * @param props - See {@link CopyableValueProps}.
- * @returns The labelled value and its copy button.
+ * @returns The labelled value.
  */
 export function CopyableValue(props) {
-    const { label, value, hint, block = false, maxHeight = DEFAULT_BLOCK_HEIGHT, copyTitle = `Copy the ${label}`, children, className, } = props;
+    const { label, value, hint, block = false, maxHeight = DEFAULT_BLOCK_HEIGHT, copyTitle, children, className, } = props;
     const isEmpty = value === '';
     return (_jsxs("div", { className: className === undefined
             ? 'copyable-value'
-            : `copyable-value ${className}`, children: [_jsxs("div", { style: HEADER_STYLE, children: [_jsx("span", { className: "copyable-value__label", style: hint === undefined ? LABEL_STYLE : HINTED_LABEL_STYLE, title: hint, children: label }), _jsx(CopyButton, { content: value, title: copyTitle, disabled: isEmpty, minimal: true, small: true })] }), _jsx(ClickToCopy, { as: "code", value: value, label: label, focusable: false, disabled: isEmpty, className: "copyable-value__value", style: block ? { ...BLOCK_VALUE_STYLE, maxHeight } : VALUE_STYLE, children: isEmpty ? MISSING_VALUE : value }), children] }));
+            : `copyable-value ${className}`, children: [_jsx("span", { className: "copyable-value__label", style: hint === undefined ? LABEL_STYLE : HINTED_LABEL_STYLE, title: hint, children: label }), _jsx(ClickToCopy, { as: "code", value: value, label: label, title: copyTitle, disabled: isEmpty, className: "copyable-value__value", style: block ? { ...BLOCK_VALUE_STYLE, maxHeight } : VALUE_STYLE, children: isEmpty ? MISSING_VALUE : value }), children] }));
 }
-const HEADER_STYLE = {
-    display: 'flex',
-    alignItems: 'center',
-    justifyContent: 'space-between',
-    gap: 8,
-};
 const LABEL_STYLE = {
+    display: 'block',
     color: TOKEN.textMuted,
     fontSize: 12,
     fontWeight: 600,

package/lib/clipboard/ui/CopyableValue.js.map

@@ -1 +1 @@
-{"version":3,"file":"CopyableValue.js","sourceRoot":"","sources":["../../../src/clipboard/ui/CopyableValue.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAC7D,OAAO,EAAE,KAAK,EAAE,MAAM,mCAAmC,CAAC;AAE1D,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAmB,CAAC;AAChD,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAkB,CAAC;AAE9C,MAAM,oBAAoB,GAAG,GAAG,CAAC;AAyCjC;;;;;;;;;GASG;AACH,MAAM,UAAU,aAAa,CAAC,KAAyB;IACrD,MAAM,EACJ,KAAK,EACL,KAAK,EACL,IAAI,EACJ,KAAK,GAAG,KAAK,EACb,SAAS,GAAG,oBAAoB,EAChC,SAAS,GAAG,YAAY,KAAK,EAAE,EAC/B,QAAQ,EACR,SAAS,GACV,GAAG,KAAK,CAAC;IACV,MAAM,OAAO,GAAG,KAAK,KAAK,EAAE,CAAC;IAE7B,OAAO,CACL,eACE,SAAS,EACP,SAAS,KAAK,SAAS;YACrB,CAAC,CAAC,gBAAgB;YAClB,CAAC,CAAC,kBAAkB,SAAS,EAAE,aAGnC,eAAK,KAAK,EAAE,YAAY,aACtB,eACE,SAAS,EAAC,uBAAuB,EACjC,KAAK,EAAE,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,kBAAkB,EAC5D,KAAK,EAAE,IAAI,YAEV,KAAK,GACD,EACP,KAAC,UAAU,IACT,OAAO,EAAE,KAAK,EACd,KAAK,EAAE,SAAS,EAChB,QAAQ,EAAE,OAAO,EACjB,OAAO,QACP,KAAK,SACL,IACE,EACN,KAAC,WAAW,IACV,EAAE,EAAC,MAAM,EACT,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,KAAK,EAChB,QAAQ,EAAE,OAAO,EACjB,SAAS,EAAC,uBAAuB,EACjC,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,EAAE,GAAG,iBAAiB,EAAE,SAAS,EAAE,CAAC,CAAC,CAAC,WAAW,YAE/D,OAAO,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,KAAK,GACpB,EACb,QAAQ,IACL,CACP,CAAC;AACJ,CAAC;AAED,MAAM,YAAY,GAAG;IACnB,OAAO,EAAE,MAAM;IACf,UAAU,EAAE,QAAQ;IACpB,cAAc,EAAE,eAAe;IAC/B,GAAG,EAAE,CAAC;CAC0B,CAAC;AAEnC,MAAM,WAAW,GAAG;IAClB,KAAK,EAAE,KAAK,CAAC,SAAS;IACtB,QAAQ,EAAE,EAAE;IACZ,UAAU,EAAE,GAAG;CACiB,CAAC;AAEnC,MAAM,kBAAkB,GAAG;IACzB,GAAG,WAAW;IACd,MAAM,EAAE,MAAM;CACkB,CAAC;AAEnC,MAAM,WAAW,GAAG;IAClB,OAAO,EAAE,OAAO;IAChB,UAAU,EAAE,gDAAgD;IAC5D,QAAQ,EAAE,EAAE;IACZ,YAAY,EAAE,UAAU;CACQ,CAAC;AAEnC,MAAM,iBAAiB,GAAG;IACxB,GAAG,WAAW;IACd,UAAU,EAAE,KAAK;IACjB,YAAY,EAAE,QAAQ;IACtB,QAAQ,EAAE,MAAM;CACgB,CAAC"}
+{"version":3,"file":"CopyableValue.js","sourceRoot":"","sources":["../../../src/clipboard/ui/CopyableValue.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,aAAa,EAAE,MAAM,8BAA8B,CAAC;AAC7D,OAAO,EAAE,KAAK,EAAE,MAAM,mCAAmC,CAAC;AAE1D,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAmB,CAAC;AAEhD,MAAM,oBAAoB,GAAG,GAAG,CAAC;AA0CjC;;;;;;;;;;;GAWG;AACH,MAAM,UAAU,aAAa,CAAC,KAAyB;IACrD,MAAM,EACJ,KAAK,EACL,KAAK,EACL,IAAI,EACJ,KAAK,GAAG,KAAK,EACb,SAAS,GAAG,oBAAoB,EAChC,SAAS,EACT,QAAQ,EACR,SAAS,GACV,GAAG,KAAK,CAAC;IACV,MAAM,OAAO,GAAG,KAAK,KAAK,EAAE,CAAC;IAE7B,OAAO,CACL,eACE,SAAS,EACP,SAAS,KAAK,SAAS;YACrB,CAAC,CAAC,gBAAgB;YAClB,CAAC,CAAC,kBAAkB,SAAS,EAAE,aAGnC,eACE,SAAS,EAAC,uBAAuB,EACjC,KAAK,EAAE,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,kBAAkB,EAC5D,KAAK,EAAE,IAAI,YAEV,KAAK,GACD,EACP,KAAC,WAAW,IACV,EAAE,EAAC,MAAM,EACT,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,SAAS,EAChB,QAAQ,EAAE,OAAO,EACjB,SAAS,EAAC,uBAAuB,EACjC,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,EAAE,GAAG,iBAAiB,EAAE,SAAS,EAAE,CAAC,CAAC,CAAC,WAAW,YAE/D,OAAO,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,KAAK,GACpB,EACb,QAAQ,IACL,CACP,CAAC;AACJ,CAAC;AAED,MAAM,WAAW,GAAG;IAClB,OAAO,EAAE,OAAO;IAChB,KAAK,EAAE,KAAK,CAAC,SAAS;IACtB,QAAQ,EAAE,EAAE;IACZ,UAAU,EAAE,GAAG;CACiB,CAAC;AAEnC,MAAM,kBAAkB,GAAG;IACzB,GAAG,WAAW;IACd,MAAM,EAAE,MAAM;CACkB,CAAC;AAEnC,MAAM,WAAW,GAAG;IAClB,OAAO,EAAE,OAAO;IAChB,UAAU,EAAE,gDAAgD;IAC5D,QAAQ,EAAE,EAAE;IACZ,YAAY,EAAE,UAAU;CACQ,CAAC;AAEnC,MAAM,iBAAiB,GAAG;IACxB,GAAG,WAAW;IACd,UAAU,EAAE,KAAK;IACjB,YAAY,EAAE,QAAQ;IACtB,QAAQ,EAAE,MAAM;CACgB,CAAC"}

package/lib/core.d.ts

@@ -14,6 +14,7 @@ export * from './i18n/core/index.ts';
 export * from './language/core/index.ts';
 export * from './orbital/core/index.ts';
 export * from './overlay/core/index.ts';
+export * from './panel/core/index.ts';
 export * from './parallel/core/index.ts';
 export * from './pedagogy/core/index.ts';
 export * from './periodic/core/index.ts';

package/lib/core.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"core.d.ts","sourceRoot":"","sources":["../src/core.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,uBAAuB,CAAC;AACtC,cAAc,yBAAyB,CAAC;AACxC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,0BAA0B,CAAC;AACzC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,uBAAuB,CAAC;AACtC,cAAc,wBAAwB,CAAC;AACvC,cAAc,sBAAsB,CAAC;AACrC,cAAc,0BAA0B,CAAC;AACzC,cAAc,yBAAyB,CAAC;AACxC,cAAc,yBAAyB,CAAC;AACxC,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,wBAAwB,CAAC;AACvC,cAAc,yBAAyB,CAAC;AACxC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AAGtC,cAAc,wBAAwB,CAAC;AACvC,cAAc,uBAAuB,CAAC;AAGtC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,wBAAwB,CAAC;AACvC,cAAc,wBAAwB,CAAC"}
+{"version":3,"file":"core.d.ts","sourceRoot":"","sources":["../src/core.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,uBAAuB,CAAC;AACtC,cAAc,yBAAyB,CAAC;AACxC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,0BAA0B,CAAC;AACzC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,uBAAuB,CAAC;AACtC,cAAc,wBAAwB,CAAC;AACvC,cAAc,sBAAsB,CAAC;AACrC,cAAc,0BAA0B,CAAC;AACzC,cAAc,yBAAyB,CAAC;AACxC,cAAc,yBAAyB,CAAC;AACxC,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,wBAAwB,CAAC;AACvC,cAAc,yBAAyB,CAAC;AACxC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AAGtC,cAAc,wBAAwB,CAAC;AACvC,cAAc,uBAAuB,CAAC;AAGtC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,wBAAwB,CAAC;AACvC,cAAc,wBAAwB,CAAC"}

package/lib/core.js

@@ -14,6 +14,7 @@ export * from "./i18n/core/index.js";
 export * from "./language/core/index.js";
 export * from "./orbital/core/index.js";
 export * from "./overlay/core/index.js";
+export * from "./panel/core/index.js";
 export * from "./parallel/core/index.js";
 export * from "./pedagogy/core/index.js";
 export * from "./periodic/core/index.js";

package/lib/core.js.map

@@ -1 +1 @@
-{"version":3,"file":"core.js","sourceRoot":"","sources":["../src/core.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,uBAAuB,CAAC;AACtC,cAAc,yBAAyB,CAAC;AACxC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,0BAA0B,CAAC;AACzC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,uBAAuB,CAAC;AACtC,cAAc,wBAAwB,CAAC;AACvC,cAAc,sBAAsB,CAAC;AACrC,cAAc,0BAA0B,CAAC;AACzC,cAAc,yBAAyB,CAAC;AACxC,cAAc,yBAAyB,CAAC;AACxC,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,wBAAwB,CAAC;AACvC,cAAc,yBAAyB,CAAC;AACxC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,+EAA+E;AAC/E,2EAA2E;AAC3E,cAAc,wBAAwB,CAAC;AACvC,cAAc,uBAAuB,CAAC;AACtC,0EAA0E;AAC1E,8EAA8E;AAC9E,cAAc,2BAA2B,CAAC;AAC1C,cAAc,wBAAwB,CAAC;AACvC,cAAc,wBAAwB,CAAC"}
+{"version":3,"file":"core.js","sourceRoot":"","sources":["../src/core.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,uBAAuB,CAAC;AACtC,cAAc,yBAAyB,CAAC;AACxC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,0BAA0B,CAAC;AACzC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,uBAAuB,CAAC;AACtC,cAAc,wBAAwB,CAAC;AACvC,cAAc,sBAAsB,CAAC;AACrC,cAAc,0BAA0B,CAAC;AACzC,cAAc,yBAAyB,CAAC;AACxC,cAAc,yBAAyB,CAAC;AACxC,cAAc,uBAAuB,CAAC;AACtC,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,0BAA0B,CAAC;AACzC,cAAc,4BAA4B,CAAC;AAC3C,cAAc,wBAAwB,CAAC;AACvC,cAAc,yBAAyB,CAAC;AACxC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,qBAAqB,CAAC;AACpC,cAAc,uBAAuB,CAAC;AACtC,+EAA+E;AAC/E,2EAA2E;AAC3E,cAAc,wBAAwB,CAAC;AACvC,cAAc,uBAAuB,CAAC;AACtC,0EAA0E;AAC1E,8EAA8E;AAC9E,cAAc,2BAA2B,CAAC;AAC1C,cAAc,wBAAwB,CAAC;AACvC,cAAc,wBAAwB,CAAC"}

package/lib/download/core/exportStyles.d.ts

@@ -0,0 +1,22 @@
+/**
+ * A row of buttons with the name box among them, wrapping when the dialog is
+ * too narrow for them.
+ */
+export declare const exportButtonsStyle: {
+    readonly display: "flex";
+    readonly flexWrap: "wrap";
+    readonly alignItems: "center";
+    readonly gap: 6;
+};
+/** One group of an export dialog: what it offers, in a column. */
+export declare const exportSectionStyle: {
+    readonly display: "flex";
+    readonly flexDirection: "column";
+    readonly gap: 8;
+};
+/** Text that says something about a control rather than being one. */
+export declare const exportNoteStyle: {
+    readonly fontSize: 12;
+    readonly opacity: 0.7;
+};
+//# sourceMappingURL=exportStyles.d.ts.map

package/lib/download/core/exportStyles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"exportStyles.d.ts","sourceRoot":"","sources":["../../../src/download/core/exportStyles.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,eAAO,MAAM,kBAAkB;;;;;CAKrB,CAAC;AAEX,kEAAkE;AAClE,eAAO,MAAM,kBAAkB;;;;CAIrB,CAAC;AAEX,sEAAsE;AACtE,eAAO,MAAM,eAAe;;;CAA0C,CAAC"}

package/lib/download/core/exportStyles.js

@@ -0,0 +1,19 @@
+/**
+ * A row of buttons with the name box among them, wrapping when the dialog is
+ * too narrow for them.
+ */
+export const exportButtonsStyle = {
+    display: 'flex',
+    flexWrap: 'wrap',
+    alignItems: 'center',
+    gap: 6,
+};
+/** One group of an export dialog: what it offers, in a column. */
+export const exportSectionStyle = {
+    display: 'flex',
+    flexDirection: 'column',
+    gap: 8,
+};
+/** Text that says something about a control rather than being one. */
+export const exportNoteStyle = { fontSize: 12, opacity: 0.7 };
+//# sourceMappingURL=exportStyles.js.map

package/lib/download/core/exportStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"exportStyles.js","sourceRoot":"","sources":["../../../src/download/core/exportStyles.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,MAAM,CAAC,MAAM,kBAAkB,GAAG;IAChC,OAAO,EAAE,MAAM;IACf,QAAQ,EAAE,MAAM;IAChB,UAAU,EAAE,QAAQ;IACpB,GAAG,EAAE,CAAC;CACE,CAAC;AAEX,kEAAkE;AAClE,MAAM,CAAC,MAAM,kBAAkB,GAAG;IAChC,OAAO,EAAE,MAAM;IACf,aAAa,EAAE,QAAQ;IACvB,GAAG,EAAE,CAAC;CACE,CAAC;AAEX,sEAAsE;AACtE,MAAM,CAAC,MAAM,eAAe,GAAG,EAAE,QAAQ,EAAE,EAAE,EAAE,OAAO,EAAE,GAAG,EAAW,CAAC"}