react-cheminfo 0.75.0 → 0.77.0

package/lib/download/ui/FigureDownloadPanel.js

@@ -1,12 +1,13 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useLanguage } from "../../i18n/ui/useLanguage.js";
 import { useChromeT } from "../../i18n/ui/useT.js";
 import { OverlayAction } from "../../overlay/ui/OverlayAction.js";
 import { OverlayPanel } from "../../overlay/ui/OverlayPanel.js";
 import { OverlaySegmented } from "../../overlay/ui/OverlaySegmented.js";
 import { figureLayoutSize } from "../core/figureLayout.js";
-import { figurePixels, figureScaleFits, figureScaleLabel, formatFigurePixels, } from "../core/figureScale.js";
 import { FigureSizeRows } from "./FigureSizeRows.js";
 import { hintOf } from "./figureDownloadHint.js";
+import { resolutionHelp, scaleChoices } from "./resolutionChoices.js";
 /**
  * The choices behind the save glyph, and the buttons that write the file and
  * copy the picture.
@@ -30,56 +31,39 @@ export function FigureDownloadPanel(props) {
     const { title, format, scale, scales, size, failure, saving } = props;
     const { onFormatChange, onScaleChange, onSave, rasterSvg = false } = props;
     const { sizing, onCopy, notice = null, children } = props;
+    const { unit = 'multiple', svgAtOwnSize = false } = props;
     const t = useChromeT();
+    const language = useLanguage();
     // What the file is drawn at: the figure on screen, or the shape picked.
     const drawn = size === null || sizing === undefined
         ? size
         : figureLayoutSize(sizing.layout, size, sizing.custom ?? size);
     const painted = format === 'png' || rasterSvg;
-    return (_jsxs(OverlayPanel, { title: title, width: PANEL_WIDTH, hint: hintOf({ format, size: drawn, scale, failure, notice, rasterSvg }, t), actions: _jsxs(_Fragment, { children: [_jsx(OverlayAction, { text: t('download.save'), icon: "download", intent: "primary", disabled: size === null, busy: saving, onClick: onSave }), _jsx(OverlayAction, { text: t('clipboard.copy'), icon: "clipboard", disabled: size === null, busy: saving, onClick: onCopy })] }), children: [_jsx(OverlaySegmented, { label: t('download.format'), help: {
+    const offerResolution = format === 'png' || !svgAtOwnSize;
+    return (_jsxs(OverlayPanel, { title: title, width: unit === 'dpi' ? DPI_PANEL_WIDTH : PANEL_WIDTH, hint: hintOf({
+            format,
+            size: drawn,
+            scale,
+            failure,
+            notice,
+            rasterSvg,
+            unit,
+            language,
+        }, t), actions: _jsxs(_Fragment, { children: [_jsx(OverlayAction, { text: t('download.save'), icon: "download", intent: "primary", disabled: size === null, busy: saving, onClick: onSave }), _jsx(OverlayAction, { text: t('clipboard.copy'), icon: "clipboard", disabled: size === null, busy: saving, onClick: onCopy })] }), children: [_jsx(OverlaySegmented, { label: t('download.format'), help: {
                     title: t('download.format'),
                     body: t('download.formatHelp'),
-                }, value: format, options: FORMAT_CHOICES, onChange: onFormatChange }), children, sizing === undefined ? null : (_jsx(FigureSizeRows, { sizing: sizing, size: size })), _jsx(OverlaySegmented, { label: t('download.resolution'), help: {
-                    title: t('download.resolution'),
-                    body: t('download.resolutionHelp'),
-                    example: {
-                        code: '2×',
-                        note: t('download.resolutionExample'),
-                    },
-                }, value: String(scale), options: scaleChoices(scales, drawn, painted), onChange: (picked) => onScaleChange(Number(picked)) })] }));
+                }, value: format, options: FORMAT_CHOICES, onChange: onFormatChange }), children, sizing === undefined ? null : (_jsx(FigureSizeRows, { sizing: sizing, size: size })), offerResolution ? (_jsx(OverlaySegmented, { label: t('download.resolution'), help: resolutionHelp(unit, t), value: String(scale), options: scaleChoices(scales, drawn, painted, unit), onChange: (picked) => onScaleChange(Number(picked)) })) : null] }));
 }
 /**
  * Wide enough for the longest hint on one line in English, so switching
  * between PNG and SVG — whose hints differ in length — never resizes the panel.
  */
 const PANEL_WIDTH = '27em';
+/** Wide enough for the four dots per inch on one row, `1200 dpi` last. */
+const DPI_PANEL_WIDTH = '33em';
 /** The two files a figure can leave the page as. */
 const FORMAT_CHOICES = [
     { value: 'png', label: 'PNG' },
     { value: 'svg', label: 'SVG' },
 ];
-/**
- * The multiples offered, each saying what it would actually produce.
- *
- * One too large for the browser to paint is greyed rather than dropped, so the
- * reader learns the ceiling exists before they meet it as a blank file. An SVG
- * is not painted, so it has no such ceiling.
- * @param scales - The multiples the caller offers.
- * @param size - How big the figure is drawn for the file.
- * @param painted - Whether the file is painted into pixels.
- * @returns The choices, in the order offered.
- */
-function scaleChoices(scales, size, painted) {
-    const choices = [];
-    for (const scale of scales) {
-        const pixels = size === null ? null : figurePixels(size, scale);
-        choices.push({
-            value: String(scale),
-            label: figureScaleLabel(scale),
-            title: pixels === null ? undefined : formatFigurePixels(pixels),
-            disabled: painted && size !== null && !figureScaleFits(size, scale),
-        });
-    }
-    return choices;
-}
 //# sourceMappingURL=FigureDownloadPanel.js.map

package/lib/download/ui/FigureDownloadPanel.js.map

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

package/lib/download/ui/figureDownloadHint.d.ts

@@ -2,6 +2,7 @@ import type { ChromeKey } from '../../i18n/core/chromeCatalog.ts';
 import type { Translate } from '../../i18n/ui/useT.ts';
 import type { FigureNotice } from '../core/copyFigure.ts';
 import type { FigureFormat } from '../core/downloadFigure.ts';
+import type { FigureResolutionUnit } from '../core/figureDpi.ts';
 import type { FigurePixels } from '../core/figureScale.ts';
 /** What the line at the foot of the panel is written from. */
 export interface HintState {
@@ -17,6 +18,10 @@ export interface HintState {
     notice: FigureNotice | null;
     /** Whether the SVG embeds a rendered picture. */
     rasterSvg: boolean;
+    /** How the resolution is offered; in dpi, the printed size is written out. */
+    unit: FigureResolutionUnit;
+    /** The language of the page, which the printed size is written in. */
+    language: string;
 }
 /**
  * The line at the foot of the panel: what pressing save is about to do, or

package/lib/download/ui/figureDownloadHint.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"figureDownloadHint.d.ts","sourceRoot":"","sources":["../../../src/download/ui/figureDownloadHint.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,kCAAkC,CAAC;AAClE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAC1D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAC9D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAG3D,8DAA8D;AAC9D,MAAM,WAAW,SAAS;IACxB,+CAA+C;IAC/C,MAAM,EAAE,YAAY,CAAC;IACrB,gDAAgD;IAChD,IAAI,EAAE,YAAY,GAAG,IAAI,CAAC;IAC1B,mCAAmC;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,8CAA8C;IAC9C,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,+CAA+C;IAC/C,MAAM,EAAE,YAAY,GAAG,IAAI,CAAC;IAC5B,iDAAiD;IACjD,SAAS,EAAE,OAAO,CAAC;CACpB;AAED;;;;;;;GAOG;AACH,wBAAgB,MAAM,CAAC,KAAK,EAAE,SAAS,EAAE,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,GAAG,MAAM,CAmBxE"}
+{"version":3,"file":"figureDownloadHint.d.ts","sourceRoot":"","sources":["../../../src/download/ui/figureDownloadHint.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,kCAAkC,CAAC;AAClE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAC1D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAC9D,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAEjE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAG3D,8DAA8D;AAC9D,MAAM,WAAW,SAAS;IACxB,+CAA+C;IAC/C,MAAM,EAAE,YAAY,CAAC;IACrB,gDAAgD;IAChD,IAAI,EAAE,YAAY,GAAG,IAAI,CAAC;IAC1B,mCAAmC;IACnC,KAAK,EAAE,MAAM,CAAC;IACd,8CAA8C;IAC9C,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,+CAA+C;IAC/C,MAAM,EAAE,YAAY,GAAG,IAAI,CAAC;IAC5B,iDAAiD;IACjD,SAAS,EAAE,OAAO,CAAC;IACnB,8EAA8E;IAC9E,IAAI,EAAE,oBAAoB,CAAC;IAC3B,sEAAsE;IACtE,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED;;;;;;;GAOG;AACH,wBAAgB,MAAM,CAAC,KAAK,EAAE,SAAS,EAAE,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,GAAG,MAAM,CA0BxE"}

package/lib/download/ui/figureDownloadHint.js

@@ -1,3 +1,4 @@
+import { formatFigureCentimetres } from "../core/figureDpi.js";
 import { figurePixels, formatFigurePixels } from "../core/figureScale.js";
 /**
  * The line at the foot of the panel: what pressing save is about to do, or
@@ -9,6 +10,7 @@ import { figurePixels, formatFigurePixels } from "../core/figureScale.js";
  */
 export function hintOf(state, t) {
     const { format, size, scale, failure, notice, rasterSvg } = state;
+    const { unit, language } = state;
     if (failure !== null)
         return failure;
     if (size === null)
@@ -26,6 +28,12 @@ export function hintOf(state, t) {
         });
     }
     const pixels = formatFigurePixels(figurePixels(size, scale));
+    if (unit === 'dpi') {
+        const printed = formatFigureCentimetres(size, language);
+        return format === 'svg'
+            ? t('download.hintSvgDpi', printed)
+            : t('download.hintPngDpi', { pixels, ...printed });
+    }
     return format === 'svg'
         ? t('download.hintSvg', { pixels })
         : t('download.hintPng', { pixels });

package/lib/download/ui/figureDownloadHint.js.map

@@ -1 +1 @@
-{"version":3,"file":"figureDownloadHint.js","sourceRoot":"","sources":["../../../src/download/ui/figureDownloadHint.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,YAAY,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAkB1E;;;;;;;GAOG;AACH,MAAM,UAAU,MAAM,CAAC,KAAgB,EAAE,CAAuB;IAC9D,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,GAAG,KAAK,CAAC;IAClE,IAAI,OAAO,KAAK,IAAI;QAAE,OAAO,OAAO,CAAC;IACrC,IAAI,IAAI,KAAK,IAAI;QAAE,OAAO,CAAC,CAAC,mBAAmB,CAAC,CAAC;IACjD,IAAI,MAAM,KAAK,iBAAiB;QAAE,OAAO,CAAC,CAAC,0BAA0B,CAAC,CAAC;IACvE,IAAI,MAAM,KAAK,QAAQ,EAAE,CAAC;QACxB,OAAO,CAAC,CAAC,qBAAqB,EAAE;YAC9B,MAAM,EAAE,kBAAkB,CAAC,YAAY,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;SACtD,CAAC,CAAC;IACL,CAAC;IACD,IAAI,MAAM,KAAK,KAAK,IAAI,SAAS,EAAE,CAAC;QAClC,OAAO,CAAC,CAAC,wBAAwB,EAAE;YACjC,MAAM,EAAE,kBAAkB,CAAC,YAAY,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;SACtD,CAAC,CAAC;IACL,CAAC;IACD,MAAM,MAAM,GAAG,kBAAkB,CAAC,YAAY,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC;IAC7D,OAAO,MAAM,KAAK,KAAK;QACrB,CAAC,CAAC,CAAC,CAAC,kBAAkB,EAAE,EAAE,MAAM,EAAE,CAAC;QACnC,CAAC,CAAC,CAAC,CAAC,kBAAkB,EAAE,EAAE,MAAM,EAAE,CAAC,CAAC;AACxC,CAAC"}
+{"version":3,"file":"figureDownloadHint.js","sourceRoot":"","sources":["../../../src/download/ui/figureDownloadHint.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,uBAAuB,EAAE,MAAM,sBAAsB,CAAC;AAE/D,OAAO,EAAE,YAAY,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAsB1E;;;;;;;GAOG;AACH,MAAM,UAAU,MAAM,CAAC,KAAgB,EAAE,CAAuB;IAC9D,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,GAAG,KAAK,CAAC;IAClE,MAAM,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IACjC,IAAI,OAAO,KAAK,IAAI;QAAE,OAAO,OAAO,CAAC;IACrC,IAAI,IAAI,KAAK,IAAI;QAAE,OAAO,CAAC,CAAC,mBAAmB,CAAC,CAAC;IACjD,IAAI,MAAM,KAAK,iBAAiB;QAAE,OAAO,CAAC,CAAC,0BAA0B,CAAC,CAAC;IACvE,IAAI,MAAM,KAAK,QAAQ,EAAE,CAAC;QACxB,OAAO,CAAC,CAAC,qBAAqB,EAAE;YAC9B,MAAM,EAAE,kBAAkB,CAAC,YAAY,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;SACtD,CAAC,CAAC;IACL,CAAC;IACD,IAAI,MAAM,KAAK,KAAK,IAAI,SAAS,EAAE,CAAC;QAClC,OAAO,CAAC,CAAC,wBAAwB,EAAE;YACjC,MAAM,EAAE,kBAAkB,CAAC,YAAY,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;SACtD,CAAC,CAAC;IACL,CAAC;IACD,MAAM,MAAM,GAAG,kBAAkB,CAAC,YAAY,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC,CAAC;IAC7D,IAAI,IAAI,KAAK,KAAK,EAAE,CAAC;QACnB,MAAM,OAAO,GAAG,uBAAuB,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC;QACxD,OAAO,MAAM,KAAK,KAAK;YACrB,CAAC,CAAC,CAAC,CAAC,qBAAqB,EAAE,OAAO,CAAC;YACnC,CAAC,CAAC,CAAC,CAAC,qBAAqB,EAAE,EAAE,MAAM,EAAE,GAAG,OAAO,EAAE,CAAC,CAAC;IACvD,CAAC;IACD,OAAO,MAAM,KAAK,KAAK;QACrB,CAAC,CAAC,CAAC,CAAC,kBAAkB,EAAE,EAAE,MAAM,EAAE,CAAC;QACnC,CAAC,CAAC,CAAC,CAAC,kBAAkB,EAAE,EAAE,MAAM,EAAE,CAAC,CAAC;AACxC,CAAC"}

package/lib/download/ui/figureDownloadOptions.d.ts

@@ -0,0 +1,84 @@
+import type { FigureFormat } from '../core/downloadFigure.ts';
+import type { FigureResolutionUnit } from '../core/figureDpi.ts';
+import type { FigureSvg } from '../core/figureSvg.ts';
+import type { FigureRenderer } from './useFigureRedraw.tsx';
+/** What the "Save figure" panel is set up with. */
+export interface FigureDownloadOptions {
+    /**
+     * The `id` of the box the figure is mounted in. Everything drawn inside it
+     * is saved — sixteen charts of a pair grid as readily as one scatter plot —
+     * and the controls floating over it are left behind. Give this or
+     * `writeFigure`.
+     * @default undefined
+     */
+    targetId?: string;
+    /**
+     * Writes the figure as an SVG document, in place of reading it off the
+     * page: for a drawing whose file carries more than its picture, such as the
+     * chemistry behind a structure. It is called when the panel opens, to
+     * measure the figure, and again for every save and copy. The SVG is saved as
+     * written, at the size it states; the resolution paints the PNG alone.
+     * @default undefined
+     */
+    writeFigure?: () => Promise<FigureSvg>;
+    /**
+     * What the saved file is called, without its extension. Name it after the
+     * data rather than after the tool: a reader with four of these in a
+     * downloads folder cannot tell four `figure.png` apart.
+     * @default 'figure'
+     */
+    fileName?: string;
+    /**
+     * The format it opens on.
+     * @default 'png'
+     */
+    defaultFormat?: FigureFormat;
+    /**
+     * How the resolution is offered: as multiples of the figure on screen, or —
+     * for a figure drawn to the size it prints at — in dots per inch. In dots
+     * per inch an SVG keeps the size it states, and 1× is 96 dpi.
+     * @default 'multiple'
+     */
+    unit?: FigureResolutionUnit;
+    /**
+     * The resolution a PNG opens on, as a multiple of the figure on screen:
+     * `dpiScale(600)` opens on 600 dpi. An SVG opens at 1×, the size it has on
+     * screen, and each format keeps the multiple the reader last picked for it.
+     * @default 2, or 300 dpi
+     */
+    defaultScale?: number;
+    /**
+     * The resolutions offered, as multiples of the figure on screen.
+     * @default [1, 2, 3, 4], or 150, 300, 600 and 1200 dpi
+     */
+    scales?: readonly number[];
+    /**
+     * Called with the multiple a PNG is set to, for a page that keeps the
+     * reader's choice — to paint its own PNGs at it, or to open on it next time.
+     * @default undefined
+     */
+    onScaleChange?: (scale: number) => void;
+    /**
+     * What is painted under the figure. `transparent` leaves it unpainted, for a
+     * figure going onto a coloured slide. A written figure paints its own.
+     * @default the surface the figure is drawn on
+     */
+    background?: string;
+    /**
+     * What the panel is called.
+     * @default the chrome's own line, in the language of the page
+     */
+    title?: string;
+    /**
+     * Draws the figure at a size, for a file. When it is given the panel offers
+     * a size — as shown, 4:3, 16:9, a journal column, or typed — and a figure
+     * saved at a size other than its own is drawn again at that size, off the
+     * page, so its axes and labels are laid out for the new shape rather than
+     * stretched into it. Draw exactly what is on screen, with the same data,
+     * zoom and colours; only the box changes. A written figure has the size it
+     * states, and is offered none.
+     * @default undefined — the figure is saved at the size it has on screen
+     */
+    renderFigure?: FigureRenderer;
+}
+//# sourceMappingURL=figureDownloadOptions.d.ts.map

package/lib/download/ui/figureDownloadOptions.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"figureDownloadOptions.d.ts","sourceRoot":"","sources":["../../../src/download/ui/figureDownloadOptions.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAC9D,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AACjE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAEtD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAE5D,mDAAmD;AACnD,MAAM,WAAW,qBAAqB;IACpC;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;;;;;OAOG;IACH,WAAW,CAAC,EAAE,MAAM,OAAO,CAAC,SAAS,CAAC,CAAC;IACvC;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;OAGG;IACH,aAAa,CAAC,EAAE,YAAY,CAAC;IAC7B;;;;;OAKG;IACH,IAAI,CAAC,EAAE,oBAAoB,CAAC;IAC5B;;;;;OAKG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IAC3B;;;;OAIG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC;;;;OAIG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;;;;;OASG;IACH,YAAY,CAAC,EAAE,cAAc,CAAC;CAC/B"}

package/lib/download/ui/figureDownloadOptions.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=figureDownloadOptions.js.map

package/lib/download/ui/figureDownloadOptions.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"figureDownloadOptions.js","sourceRoot":"","sources":["../../../src/download/ui/figureDownloadOptions.ts"],"names":[],"mappings":""}

package/lib/download/ui/resolutionChoices.d.ts

@@ -0,0 +1,27 @@
+import type { HelpContent } from '../../help/ui/HelpBody.tsx';
+import type { ChromeKey } from '../../i18n/core/chromeCatalog.ts';
+import type { Translate } from '../../i18n/ui/useT.ts';
+import type { OverlayOption } from '../../overlay/ui/OverlayRow.tsx';
+import type { FigureResolutionUnit } from '../core/figureDpi.ts';
+import type { FigurePixels } from '../core/figureScale.ts';
+/**
+ * The resolutions offered, each saying what it would actually produce.
+ *
+ * One too large for the browser to paint is greyed rather than dropped, so the
+ * reader learns the ceiling exists before they meet it as a blank file. An SVG
+ * is not painted, so it has no such ceiling.
+ * @param scales - The multiples the caller offers.
+ * @param size - How big the figure is drawn for the file.
+ * @param painted - Whether the file is painted into pixels.
+ * @param unit - How the resolution reads.
+ * @returns The choices, in the order offered.
+ */
+export declare function scaleChoices(scales: readonly number[], size: FigurePixels | null, painted: boolean, unit: FigureResolutionUnit): readonly OverlayOption[];
+/**
+ * What the resolution means, in the unit it is offered in.
+ * @param unit - How the resolution reads.
+ * @param t - The chrome's formatter.
+ * @returns The help of the row.
+ */
+export declare function resolutionHelp(unit: FigureResolutionUnit, t: Translate<ChromeKey>): HelpContent;
+//# sourceMappingURL=resolutionChoices.d.ts.map

package/lib/download/ui/resolutionChoices.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolutionChoices.d.ts","sourceRoot":"","sources":["../../../src/download/ui/resolutionChoices.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AAC9D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,kCAAkC,CAAC;AAClE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,iCAAiC,CAAC;AACrE,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAEjE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAO3D;;;;;;;;;;;GAWG;AACH,wBAAgB,YAAY,CAC1B,MAAM,EAAE,SAAS,MAAM,EAAE,EACzB,IAAI,EAAE,YAAY,GAAG,IAAI,EACzB,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,oBAAoB,GACzB,SAAS,aAAa,EAAE,CAY1B;AAED;;;;;GAKG;AACH,wBAAgB,cAAc,CAC5B,IAAI,EAAE,oBAAoB,EAC1B,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,GACtB,WAAW,CAab"}

package/lib/download/ui/resolutionChoices.js

@@ -0,0 +1,48 @@
+import { figureResolutionLabel } from "../core/figureDpi.js";
+import { figurePixels, figureScaleFits, formatFigurePixels, } from "../core/figureScale.js";
+/**
+ * The resolutions offered, each saying what it would actually produce.
+ *
+ * One too large for the browser to paint is greyed rather than dropped, so the
+ * reader learns the ceiling exists before they meet it as a blank file. An SVG
+ * is not painted, so it has no such ceiling.
+ * @param scales - The multiples the caller offers.
+ * @param size - How big the figure is drawn for the file.
+ * @param painted - Whether the file is painted into pixels.
+ * @param unit - How the resolution reads.
+ * @returns The choices, in the order offered.
+ */
+export function scaleChoices(scales, size, painted, unit) {
+    const choices = [];
+    for (const scale of scales) {
+        const pixels = size === null ? null : figurePixels(size, scale);
+        choices.push({
+            value: String(scale),
+            label: figureResolutionLabel(scale, unit),
+            title: pixels === null ? undefined : formatFigurePixels(pixels),
+            disabled: painted && size !== null && !figureScaleFits(size, scale),
+        });
+    }
+    return choices;
+}
+/**
+ * What the resolution means, in the unit it is offered in.
+ * @param unit - How the resolution reads.
+ * @param t - The chrome's formatter.
+ * @returns The help of the row.
+ */
+export function resolutionHelp(unit, t) {
+    const title = t('download.resolution');
+    return unit === 'dpi'
+        ? {
+            title,
+            body: t('download.resolutionDpiHelp'),
+            example: { code: '300 dpi', note: t('download.resolutionDpiExample') },
+        }
+        : {
+            title,
+            body: t('download.resolutionHelp'),
+            example: { code: '2×', note: t('download.resolutionExample') },
+        };
+}
+//# sourceMappingURL=resolutionChoices.js.map

package/lib/download/ui/resolutionChoices.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolutionChoices.js","sourceRoot":"","sources":["../../../src/download/ui/resolutionChoices.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,qBAAqB,EAAE,MAAM,sBAAsB,CAAC;AAE7D,OAAO,EACL,YAAY,EACZ,eAAe,EACf,kBAAkB,GACnB,MAAM,wBAAwB,CAAC;AAEhC;;;;;;;;;;;GAWG;AACH,MAAM,UAAU,YAAY,CAC1B,MAAyB,EACzB,IAAyB,EACzB,OAAgB,EAChB,IAA0B;IAE1B,MAAM,OAAO,GAAoB,EAAE,CAAC;IACpC,KAAK,MAAM,KAAK,IAAI,MAAM,EAAE,CAAC;QAC3B,MAAM,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,YAAY,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;QAChE,OAAO,CAAC,IAAI,CAAC;YACX,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC;YACpB,KAAK,EAAE,qBAAqB,CAAC,KAAK,EAAE,IAAI,CAAC;YACzC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,kBAAkB,CAAC,MAAM,CAAC;YAC/D,QAAQ,EAAE,OAAO,IAAI,IAAI,KAAK,IAAI,IAAI,CAAC,eAAe,CAAC,IAAI,EAAE,KAAK,CAAC;SACpE,CAAC,CAAC;IACL,CAAC;IACD,OAAO,OAAO,CAAC;AACjB,CAAC;AAED;;;;;GAKG;AACH,MAAM,UAAU,cAAc,CAC5B,IAA0B,EAC1B,CAAuB;IAEvB,MAAM,KAAK,GAAG,CAAC,CAAC,qBAAqB,CAAC,CAAC;IACvC,OAAO,IAAI,KAAK,KAAK;QACnB,CAAC,CAAC;YACE,KAAK;YACL,IAAI,EAAE,CAAC,CAAC,4BAA4B,CAAC;YACrC,OAAO,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,CAAC,+BAA+B,CAAC,EAAE;SACvE;QACH,CAAC,CAAC;YACE,KAAK;YACL,IAAI,EAAE,CAAC,CAAC,yBAAyB,CAAC;YAClC,OAAO,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,CAAC,4BAA4B,CAAC,EAAE;SAC/D,CAAC;AACR,CAAC"}

package/lib/download/ui/useFigureActions.d.ts

@@ -1,11 +1,14 @@
 import type { FigureFormat } from '../core/downloadFigure.ts';
 import type { FigurePixels } from '../core/figureScale.ts';
+import type { FigureSvg } from '../core/figureSvg.ts';
 import type { FigureRedraw } from './useFigureRedraw.tsx';
 import type { FigureTask } from './useFigureTask.ts';
 /** What {@link useFigureActions} works from. */
 export interface FigureActionsOptions {
     /** The `id` of the box the figure is mounted in. */
-    targetId: string;
+    targetId?: string;
+    /** Writes the figure, in place of reading it off the page. */
+    writeFigure?: () => Promise<FigureSvg>;
     /** Which file save writes. */
     format: FigureFormat;
     /** The multiple of the figure on screen it is painted at. */

package/lib/download/ui/useFigureActions.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useFigureActions.d.ts","sourceRoot":"","sources":["../../../src/download/ui/useFigureActions.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAG9D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAG3D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAC1D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAGrD,gDAAgD;AAChD,MAAM,WAAW,oBAAoB;IACnC,oDAAoD;IACpD,QAAQ,EAAE,MAAM,CAAC;IACjB,8BAA8B;IAC9B,MAAM,EAAE,YAAY,CAAC;IACrB,6DAA6D;IAC7D,KAAK,EAAE,MAAM,CAAC;IACd,4DAA4D;IAC5D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,wCAAwC;IACxC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,QAAQ,EAAE,YAAY,GAAG,IAAI,CAAC;IAC9B,yDAAyD;IACzD,MAAM,EAAE,YAAY,CAAC,QAAQ,CAAC,CAAC;CAChC;AAED,gDAAgD;AAChD,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,UAAU,EAAE,KAAK,CAAC;IAC5D,wDAAwD;IACxD,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,0EAA0E;IAC1E,IAAI,EAAE,MAAM,IAAI,CAAC;CAClB;AAED;;;;;;;GAOG;AACH,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,oBAAoB,GAAG,aAAa,CA4B7E"}
+{"version":3,"file":"useFigureActions.d.ts","sourceRoot":"","sources":["../../../src/download/ui/useFigureActions.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAG9D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAC3D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAGtD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAC1D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAGrD,gDAAgD;AAChD,MAAM,WAAW,oBAAoB;IACnC,oDAAoD;IACpD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,8DAA8D;IAC9D,WAAW,CAAC,EAAE,MAAM,OAAO,CAAC,SAAS,CAAC,CAAC;IACvC,8BAA8B;IAC9B,MAAM,EAAE,YAAY,CAAC;IACrB,6DAA6D;IAC7D,KAAK,EAAE,MAAM,CAAC;IACd,4DAA4D;IAC5D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,wCAAwC;IACxC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,QAAQ,EAAE,YAAY,GAAG,IAAI,CAAC;IAC9B,yDAAyD;IACzD,MAAM,EAAE,YAAY,CAAC,QAAQ,CAAC,CAAC;CAChC;AAED,gDAAgD;AAChD,MAAM,WAAW,aAAc,SAAQ,IAAI,CAAC,UAAU,EAAE,KAAK,CAAC;IAC5D,wDAAwD;IACxD,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,0EAA0E;IAC1E,IAAI,EAAE,MAAM,IAAI,CAAC;CAClB;AAED;;;;;;;GAOG;AACH,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,oBAAoB,GAAG,aAAa,CAwC7E"}

package/lib/download/ui/useFigureActions.js

@@ -1,5 +1,5 @@
 import { copyFigure } from "../core/copyFigure.js";
-import { downloadFigure } from "../core/downloadFigure.js";
+import { downloadFigure, downloadFigureSvg } from "../core/downloadFigure.js";
 import { figurePng } from "../core/figurePng.js";
 import { figureSvg } from "../core/figureSvg.js";
 import { useFigureTask } from "./useFigureTask.js";
@@ -12,26 +12,35 @@ import { useFigureTask } from "./useFigureTask.js";
  * @returns See {@link FigureActions}.
  */
 export function useFigureActions(options) {
-    const { targetId, format, scale, fileName, background } = options;
+    const { targetId, writeFigure, format, scale, fileName, background } = options;
     const { redrawAt, redraw } = options;
     const { run, busy, failure, notice, clear } = useFigureTask();
-    function withFigure(write) {
+    async function withFigure(write) {
+        if (targetId === undefined)
+            throw new Error('There is no figure to save.');
         return redrawAt === null
             ? write(targetId)
             : redraw(targetId, redrawAt, write);
     }
     function save() {
+        if (writeFigure !== undefined) {
+            const written = writeFigure().then((figure) => downloadFigureSvg(figure, { format, scale, fileName }));
+            run(written.then(() => null));
+            return;
+        }
         const options = { format, scale, fileName, background };
         run(withFigure((box) => downloadFigure(box, options)).then(() => null));
     }
     function copy() {
         // The clipboard is written before anything is awaited, with the picture
         // still being painted: Safari only allows a write the click itself started.
-        const png = new Promise((resolve, reject) => {
-            withFigure(async (box) => {
-                resolve(await figurePng(figureSvg(box, { background }), scale));
-            }).catch(reject);
-        });
+        const png = writeFigure === undefined
+            ? new Promise((resolve, reject) => {
+                withFigure(async (box) => {
+                    resolve(await figurePng(figureSvg(box, { background }), scale));
+                }).catch(reject);
+            })
+            : writeFigure().then((figure) => figurePng(figure, scale));
         run(copyFigure(png));
     }
     return { save, copy, busy, failure, notice, clear };

package/lib/download/ui/useFigureActions.js.map

@@ -1 +1 @@
-{"version":3,"file":"useFigureActions.js","sourceRoot":"","sources":["../../../src/download/ui/useFigureActions.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAEnD,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAC3D,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAEjD,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAIjD,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AA+BnD;;;;;;;GAOG;AACH,MAAM,UAAU,gBAAgB,CAAC,OAA6B;IAC5D,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,GAAG,OAAO,CAAC;IAClE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,GAAG,OAAO,CAAC;IACrC,MAAM,EAAE,GAAG,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,aAAa,EAAE,CAAC;IAE9D,SAAS,UAAU,CAAC,KAA+C;QACjE,OAAO,QAAQ,KAAK,IAAI;YACtB,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC;YACjB,CAAC,CAAC,MAAM,CAAC,QAAQ,EAAE,QAAQ,EAAE,KAAK,CAAC,CAAC;IACxC,CAAC;IAED,SAAS,IAAI;QACX,MAAM,OAAO,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,CAAC;QACxD,GAAG,CAAC,UAAU,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,cAAc,CAAC,GAAG,EAAE,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAC1E,CAAC;IAED,SAAS,IAAI;QACX,wEAAwE;QACxE,4EAA4E;QAC5E,MAAM,GAAG,GAAG,IAAI,OAAO,CAAO,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;YAChD,UAAU,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;gBACvB,OAAO,CAAC,MAAM,SAAS,CAAC,SAAS,CAAC,GAAG,EAAE,EAAE,UAAU,EAAE,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC;YAClE,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;QACnB,CAAC,CAAC,CAAC;QACH,GAAG,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC;IACvB,CAAC;IAED,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,CAAC;AACtD,CAAC"}
+{"version":3,"file":"useFigureActions.js","sourceRoot":"","sources":["../../../src/download/ui/useFigureActions.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAEnD,OAAO,EAAE,cAAc,EAAE,iBAAiB,EAAE,MAAM,2BAA2B,CAAC;AAC9E,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAGjD,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAIjD,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAiCnD;;;;;;;GAOG;AACH,MAAM,UAAU,gBAAgB,CAAC,OAA6B;IAC5D,MAAM,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,GAClE,OAAO,CAAC;IACV,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,GAAG,OAAO,CAAC;IACrC,MAAM,EAAE,GAAG,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,aAAa,EAAE,CAAC;IAE9D,KAAK,UAAU,UAAU,CAAC,KAA+C;QACvE,IAAI,QAAQ,KAAK,SAAS;YAAE,MAAM,IAAI,KAAK,CAAC,6BAA6B,CAAC,CAAC;QAC3E,OAAO,QAAQ,KAAK,IAAI;YACtB,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC;YACjB,CAAC,CAAC,MAAM,CAAC,QAAQ,EAAE,QAAQ,EAAE,KAAK,CAAC,CAAC;IACxC,CAAC;IAED,SAAS,IAAI;QACX,IAAI,WAAW,KAAK,SAAS,EAAE,CAAC;YAC9B,MAAM,OAAO,GAAG,WAAW,EAAE,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE,CAC5C,iBAAiB,CAAC,MAAM,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC,CACvD,CAAC;YACF,GAAG,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;YAC9B,OAAO;QACT,CAAC;QACD,MAAM,OAAO,GAAG,EAAE,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,CAAC;QACxD,GAAG,CAAC,UAAU,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,cAAc,CAAC,GAAG,EAAE,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAC1E,CAAC;IAED,SAAS,IAAI;QACX,wEAAwE;QACxE,4EAA4E;QAC5E,MAAM,GAAG,GACP,WAAW,KAAK,SAAS;YACvB,CAAC,CAAC,IAAI,OAAO,CAAO,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;gBACpC,UAAU,CAAC,KAAK,EAAE,GAAG,EAAE,EAAE;oBACvB,OAAO,CAAC,MAAM,SAAS,CAAC,SAAS,CAAC,GAAG,EAAE,EAAE,UAAU,EAAE,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC;gBAClE,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;YACnB,CAAC,CAAC;YACJ,CAAC,CAAC,WAAW,EAAE,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,SAAS,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC,CAAC;QAC/D,GAAG,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC;IACvB,CAAC;IAED,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,CAAC;AACtD,CAAC"}

package/lib/download/ui/useFigureDownload.d.ts

@@ -1,60 +1,7 @@
 import type { ReactElement, ReactNode } from 'react';
 import type { FigureFormat } from '../core/downloadFigure.ts';
-import type { FigureRenderer } from './useFigureRedraw.tsx';
-/** What the "Save figure" panel is set up with. */
-export interface FigureDownloadOptions {
-    /**
-     * The `id` of the box the figure is mounted in. Everything drawn inside it
-     * is saved — sixteen charts of a pair grid as readily as one scatter plot —
-     * and the controls floating over it are left behind.
-     */
-    targetId: string;
-    /**
-     * What the saved file is called, without its extension. Name it after the
-     * data rather than after the tool: a reader with four of these in a
-     * downloads folder cannot tell four `figure.png` apart.
-     * @default 'figure'
-     */
-    fileName?: string;
-    /**
-     * The format it opens on.
-     * @default 'png'
-     */
-    defaultFormat?: FigureFormat;
-    /**
-     * The resolution a PNG opens on, as a multiple of the figure on screen. An
-     * SVG opens at 1×, the size it has on screen, and each format keeps the
-     * multiple the reader last picked for it.
-     * @default 2
-     */
-    defaultScale?: number;
-    /**
-     * The resolutions offered.
-     * @default [1, 2, 3, 4]
-     */
-    scales?: readonly number[];
-    /**
-     * What is painted under the figure. `transparent` leaves it unpainted, for a
-     * figure going onto a coloured slide.
-     * @default the surface the figure is drawn on
-     */
-    background?: string;
-    /**
-     * What the panel is called.
-     * @default the chrome's own line, in the language of the page
-     */
-    title?: string;
-    /**
-     * Draws the figure at a size, for a file. When it is given the panel offers
-     * a size — as shown, 4:3, 16:9, a journal column, or typed — and a figure
-     * saved at a size other than its own is drawn again at that size, off the
-     * page, so its axes and labels are laid out for the new shape rather than
-     * stretched into it. Draw exactly what is on screen, with the same data,
-     * zoom and colours; only the box changes.
-     * @default undefined — the figure is saved at the size it has on screen
-     */
-    renderFigure?: FigureRenderer;
-}
+import type { FigureDownloadOptions } from './figureDownloadOptions.ts';
+export type { FigureDownloadOptions } from './figureDownloadOptions.ts';
 /** What {@link useFigureDownload} hands back. */
 export interface FigureDownloadState {
     /** Whether the panel is showing. */

package/lib/download/ui/useFigureDownload.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useFigureDownload.d.ts","sourceRoot":"","sources":["../../../src/download/ui/useFigureDownload.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIrD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAa9D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAG5D,mDAAmD;AACnD,MAAM,WAAW,qBAAqB;IACpC;;;;OAIG;IACH,QAAQ,EAAE,MAAM,CAAC;IACjB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;OAGG;IACH,aAAa,CAAC,EAAE,YAAY,CAAC;IAC7B;;;;;OAKG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,MAAM,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IAC3B;;;;OAIG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;;;;OAQG;IACH,YAAY,CAAC,EAAE,cAAc,CAAC;CAC/B;AAED,iDAAiD;AACjD,MAAM,WAAW,mBAAmB;IAClC,oCAAoC;IACpC,MAAM,EAAE,OAAO,CAAC;IAChB;;;OAGG;IACH,OAAO,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACjC,8CAA8C;IAC9C,KAAK,EAAE,YAAY,CAAC;IACpB,sDAAsD;IACtD,MAAM,EAAE,YAAY,CAAC;IACrB;;;OAGG;IACH,MAAM,EAAE,SAAS,CAAC;CACnB;AAED;;;;;;GAMG;AACH,wBAAgB,iBAAiB,CAC/B,OAAO,EAAE,qBAAqB,GAC7B,mBAAmB,CAsFrB"}
+{"version":3,"file":"useFigureDownload.d.ts","sourceRoot":"","sources":["../../../src/download/ui/useFigureDownload.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAIrD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAiB9D,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,4BAA4B,CAAC;AAIxE,YAAY,EAAE,qBAAqB,EAAE,MAAM,4BAA4B,CAAC;AAExE,iDAAiD;AACjD,MAAM,WAAW,mBAAmB;IAClC,oCAAoC;IACpC,MAAM,EAAE,OAAO,CAAC;IAChB;;;OAGG;IACH,OAAO,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACjC,8CAA8C;IAC9C,KAAK,EAAE,YAAY,CAAC;IACpB,sDAAsD;IACtD,MAAM,EAAE,YAAY,CAAC;IACrB;;;OAGG;IACH,MAAM,EAAE,SAAS,CAAC;CACnB;AAKD;;;;;;GAMG;AACH,wBAAgB,iBAAiB,CAC/B,OAAO,EAAE,qBAAqB,GAC7B,mBAAmB,CAqHrB"}

package/lib/download/ui/useFigureDownload.js

@@ -1,12 +1,15 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { useCallback, useState } from 'react';
+import { useCallback, useRef, useState } from 'react';
 import { useChromeT } from "../../i18n/ui/useT.js";
+import { DEFAULT_FIGURE_DPI, FIGURE_DPIS, dpiScale, } from "../core/figureDpi.js";
 import { figureLayoutRedraws, figureLayoutSize } from "../core/figureLayout.js";
 import { DEFAULT_FIGURE_SCALE, FIGURE_SCALES, defaultFigureScale, } from "../core/figureScale.js";
 import { figureSize } from "../core/figureTarget.js";
 import { FigureDownloadPanel } from "./FigureDownloadPanel.js";
 import { useFigureActions } from "./useFigureActions.js";
 import { useFigureRedraw } from "./useFigureRedraw.js";
+/** The dots per inch offered, as the multiples the figure is painted at. */
+const DPI_SCALES = FIGURE_DPIS.map(dpiScale);
 /**
  * The "Save figure" panel — save as PNG or SVG, or copy as PNG — for a caller
  * that brings its own trigger, such as a button in an editor's toolbar.
@@ -15,9 +18,17 @@ import { useFigureRedraw } from "./useFigureRedraw.js";
  * @returns See {@link FigureDownloadState}.
  */
 export function useFigureDownload(options) {
-    const { targetId, fileName, background, scales = FIGURE_SCALES } = options;
-    const { defaultFormat = 'png', defaultScale = DEFAULT_FIGURE_SCALE } = options;
-    const { title, renderFigure } = options;
+    const { targetId, writeFigure, fileName, background } = options;
+    const { unit = 'multiple', defaultFormat = 'png' } = options;
+    const { title, renderFigure, onScaleChange } = options;
+    const dpi = unit === 'dpi';
+    const scales = options.scales ?? (dpi ? DPI_SCALES : FIGURE_SCALES);
+    const defaultScale = options.defaultScale ??
+        (dpi ? dpiScale(DEFAULT_FIGURE_DPI) : DEFAULT_FIGURE_SCALE);
+    // A figure with a printed size, or one its page wrote, keeps the size its
+    // SVG states: the resolution is then the PNG's alone.
+    const svgAtOwnSize = dpi || writeFigure !== undefined;
+    const redraws = renderFigure !== undefined && writeFigure === undefined;
     const t = useChromeT();
     const [isOpen, setIsOpen] = useState(false);
     const [format, setFormat] = useState(defaultFormat);
@@ -25,18 +36,20 @@ export function useFigureDownload(options) {
         png: defaultScale,
         svg: defaultFigureScale('svg'),
     }));
-    const scale = picked[format];
+    const scale = format === 'svg' && svgAtOwnSize ? 1 : picked[format];
     const [size, setSize] = useState(null);
+    const opening = useRef(0);
     const [layout, setLayout] = useState('screen');
     const [custom, setCustom] = useState(null);
-    const { redraw, portal } = useFigureRedraw(renderFigure);
-    const redrawAt = renderFigure !== undefined &&
+    const { redraw, portal } = useFigureRedraw(redraws ? renderFigure : undefined);
+    const redrawAt = redraws &&
         size !== null &&
         figureLayoutRedraws(layout, size, custom ?? size)
         ? figureLayoutSize(layout, size, custom ?? size)
         : null;
     const { save, copy, busy, failure, notice, clear } = useFigureActions({
         targetId,
+        writeFigure,
         format,
         scale,
         fileName,
@@ -52,9 +65,24 @@ export function useFigureDownload(options) {
         setIsOpen(next);
         if (!next)
             return;
-        setSize(figureSize(targetId));
         clear();
-    }, [targetId, clear]);
+        if (writeFigure === undefined) {
+            setSize(targetId === undefined ? null : figureSize(targetId));
+            return;
+        }
+        // A written figure is measured once it is written; only the last
+        // opening is answered.
+        opening.current += 1;
+        const ticket = opening.current;
+        writeFigure().then((figure) => {
+            if (ticket !== opening.current)
+                return;
+            setSize({ width: figure.width, height: figure.height });
+        }, () => {
+            if (ticket === opening.current)
+                setSize(null);
+        });
+    }, [targetId, writeFigure, clear]);
     // What the last copy came to only describes the choices it was made with.
     function changed(apply) {
         return (value) => {
@@ -62,14 +90,18 @@ export function useFigureDownload(options) {
             apply(value);
         };
     }
-    const panel = (_jsx(FigureDownloadPanel, { title: title ?? t('download.saveFigure'), format: format, scale: scale, scales: scales, size: size, failure: failure, notice: notice, saving: busy, onFormatChange: changed(setFormat), onScaleChange: changed((next) => setPicked((current) => ({ ...current, [format]: next }))), onSave: save, onCopy: copy, sizing: renderFigure === undefined
-            ? undefined
-            : {
+    const panel = (_jsx(FigureDownloadPanel, { title: title ?? t('download.saveFigure'), format: format, scale: scale, scales: scales, unit: unit, svgAtOwnSize: svgAtOwnSize, size: size, failure: failure, notice: notice, saving: busy, onFormatChange: changed(setFormat), onScaleChange: changed((next) => {
+            setPicked((current) => ({ ...current, [format]: next }));
+            if (format === 'png')
+                onScaleChange?.(next);
+        }), onSave: save, onCopy: copy, sizing: redraws
+            ? {
                 layout,
                 custom,
                 onLayoutChange: changed(setLayout),
                 onCustomChange: changed(setCustom),
-            } }));
+            }
+            : undefined }));
     return { isOpen, setOpen, panel, format, portal };
 }
 //# sourceMappingURL=useFigureDownload.js.map