react-cheminfo 0.30.0 → 0.31.0

package/lib/download/core/index.js

@@ -2,8 +2,10 @@ export { cssTokenNames, resolveCssTokens } from "./cssTokens.js";
 export { downloadBlob } from "./downloadBlob.js";
 export { downloadFigure } from "./downloadFigure.js";
 export { downloadText } from "./downloadText.js";
+export { FIGURE_COLUMN_WIDTH, FIGURE_LAYOUTS, FIGURE_LAYOUT_MAX, FIGURE_LAYOUT_MIN, figureLayoutRedraws, figureLayoutSide, figureLayoutSize, } from "./figureLayout.js";
 export { FIGURE_PNG_TYPE, figurePng } from "./figurePng.js";
-export { DEFAULT_FIGURE_SCALE, FIGURE_MAX_PIXELS, FIGURE_SCALES, figurePixels, figureScaleFits, figureScaleLabel, formatFigurePixels, } from "./figureScale.js";
+export { whenFigureSettles } from "./figureSettle.js";
+export { DEFAULT_FIGURE_SCALE, FIGURE_MAX_PIXELS, FIGURE_SCALES, defaultFigureScale, figurePixels, figureScaleFits, figureScaleLabel, formatFigurePixels, } from "./figureScale.js";
 export { FIGURE_SVG_TYPE, figureSvg } from "./figureSvg.js";
 export { figureSvgDocument } from "./figureSvgDocument.js";
 export { figureLegendMarkup } from "./figureLegend.js";

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/download/core/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEjD,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACrD,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,eAAe,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAE5D,OAAO,EACL,oBAAoB,EACpB,iBAAiB,EACjB,aAAa,EACb,YAAY,EACZ,eAAe,EACf,gBAAgB,EAChB,kBAAkB,GACnB,MAAM,kBAAkB,CAAC;AAE1B,OAAO,EAAE,eAAe,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAK5D,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAO3D,OAAO,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAEvD,OAAO,EACL,YAAY,EACZ,cAAc,EACd,aAAa,EACb,aAAa,EACb,UAAU,GACX,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAEzD,OAAO,EACL,kBAAkB,EAClB,eAAe,EACf,kBAAkB,GACnB,MAAM,mBAAmB,CAAC;AAM3B,OAAO,EACL,wBAAwB,EACxB,iBAAiB,EACjB,eAAe,EACf,eAAe,EACf,SAAS,GACV,MAAM,sBAAsB,CAAC;AAE9B,OAAO,EACL,eAAe,EACf,WAAW,EACX,WAAW,EACX,cAAc,EACd,cAAc,GACf,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAE/D,OAAO,EAAE,iBAAiB,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC3E,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAElD,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEzC,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/download/core/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEjD,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACrD,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEjD,OAAO,EACL,mBAAmB,EACnB,cAAc,EACd,iBAAiB,EACjB,iBAAiB,EACjB,mBAAmB,EACnB,gBAAgB,EAChB,gBAAgB,GACjB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,eAAe,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAE5D,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAEtD,OAAO,EACL,oBAAoB,EACpB,iBAAiB,EACjB,aAAa,EACb,kBAAkB,EAClB,YAAY,EACZ,eAAe,EACf,gBAAgB,EAChB,kBAAkB,GACnB,MAAM,kBAAkB,CAAC;AAE1B,OAAO,EAAE,eAAe,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAK5D,OAAO,EAAE,iBAAiB,EAAE,MAAM,wBAAwB,CAAC;AAO3D,OAAO,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AAEvD,OAAO,EACL,YAAY,EACZ,cAAc,EACd,aAAa,EACb,aAAa,EACb,UAAU,GACX,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAEzD,OAAO,EACL,kBAAkB,EAClB,eAAe,EACf,kBAAkB,GACnB,MAAM,mBAAmB,CAAC;AAM3B,OAAO,EACL,wBAAwB,EACxB,iBAAiB,EACjB,eAAe,EACf,eAAe,EACf,SAAS,GACV,MAAM,sBAAsB,CAAC;AAE9B,OAAO,EACL,eAAe,EACf,WAAW,EACX,WAAW,EACX,cAAc,EACd,cAAc,GACf,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAC;AAE/D,OAAO,EAAE,iBAAiB,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC3E,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAElD,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEzC,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC"}

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

@@ -1,6 +1,7 @@
 import type { IconName } from '@blueprintjs/core';
 import type { ReactElement } from 'react';
 import type { FigureFormat } from '../core/downloadFigure.ts';
+import type { FigureRenderer } from './useFigureRedraw.tsx';
 /** What {@link FigureDownload} needs. */
 export interface FigureDownloadProps {
     /**
@@ -22,7 +23,9 @@ export interface FigureDownloadProps {
      */
     defaultFormat?: FigureFormat;
     /**
-     * The resolution it opens on, as a multiple of the figure on screen.
+     * 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;
@@ -57,6 +60,16 @@ export interface FigureDownloadProps {
      * @default undefined
      */
     testId?: 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;
 }
 /**
  * The glyph that takes the figure off the page as a file.
@@ -71,9 +84,10 @@ export interface FigureDownloadProps {
  * Both formats are offered because they answer different questions. An SVG is
  * the figure itself, sharp at any size and still editable, which is what a
  * paper wants; a PNG is a picture of it, which is what every chat window and
- * slide deck accepts. The resolution belongs to the second alone, and the
- * panel writes out the pixels it is about to produce so nobody has to guess
- * what `3×` means for the figure in front of them.
+ * slide deck accepts. The resolution paints a PNG with more pixels and makes
+ * an SVG open larger, and the panel writes out the size it is about to
+ * produce so nobody has to guess what `3×` means for the figure in front of
+ * them.
  * @param props - See {@link FigureDownloadProps}.
  * @returns The glyph and its panel.
  */

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

@@ -1 +1 @@
-{"version":3,"file":"FigureDownload.d.ts","sourceRoot":"","sources":["../../../src/download/ui/FigureDownload.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAElD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAK1C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAQ9D,yCAAyC;AACzC,MAAM,WAAW,mBAAmB;IAClC;;;;OAIG;IACH,QAAQ,EAAE,MAAM,CAAC;IACjB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;OAGG;IACH,aAAa,CAAC,EAAE,YAAY,CAAC;IAC7B;;;OAGG;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;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,GAAG,YAAY,CAmEvE"}
+{"version":3,"file":"FigureDownload.d.ts","sourceRoot":"","sources":["../../../src/download/ui/FigureDownload.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAElD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAK1C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAa9D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAG5D,yCAAyC;AACzC,MAAM,WAAW,mBAAmB;IAClC;;;;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;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB;;;;;;;;OAQG;IACH,YAAY,CAAC,EAAE,cAAc,CAAC;CAC/B;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,GAAG,YAAY,CAmGvE"}

package/lib/download/ui/FigureDownload.js

@@ -1,12 +1,14 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { PopoverNext } from '@blueprintjs/core';
 import { useState } from 'react';
 import { useChromeT } from "../../i18n/ui/useT.js";
 import { OverlayIconButton } from "../../overlay/ui/OverlayIconButton.js";
 import { downloadFigure } from "../core/downloadFigure.js";
-import { DEFAULT_FIGURE_SCALE, FIGURE_SCALES } from "../core/figureScale.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 { useFigureRedraw } from "./useFigureRedraw.js";
 /**
  * The glyph that takes the figure off the page as a file.
  *
@@ -20,9 +22,10 @@ import { FigureDownloadPanel } from "./FigureDownloadPanel.js";
  * Both formats are offered because they answer different questions. An SVG is
  * the figure itself, sharp at any size and still editable, which is what a
  * paper wants; a PNG is a picture of it, which is what every chat window and
- * slide deck accepts. The resolution belongs to the second alone, and the
- * panel writes out the pixels it is about to produce so nobody has to guess
- * what `3×` means for the figure in front of them.
+ * slide deck accepts. The resolution paints a PNG with more pixels and makes
+ * an SVG open larger, and the panel writes out the size it is about to
+ * produce so nobody has to guess what `3×` means for the figure in front of
+ * them.
  * @param props - See {@link FigureDownloadProps}.
  * @returns The glyph and its panel.
  */
@@ -30,14 +33,21 @@ export function FigureDownload(props) {
     const { targetId, fileName, background, scales = FIGURE_SCALES } = props;
     const { defaultFormat = 'png', defaultScale = DEFAULT_FIGURE_SCALE } = props;
     const { label, title } = props;
-    const { icon = 'download', testId } = props;
+    const { icon = 'download', testId, renderFigure } = props;
     const t = useChromeT();
     const [open, setOpen] = useState(false);
     const [format, setFormat] = useState(defaultFormat);
-    const [scale, setScale] = useState(defaultScale);
+    const [picked, setPicked] = useState(() => ({
+        png: defaultScale,
+        svg: defaultFigureScale('svg'),
+    }));
+    const scale = picked[format];
     const [size, setSize] = useState(null);
     const [failure, setFailure] = useState(null);
     const [saving, setSaving] = useState(false);
+    const [layout, setLayout] = useState('screen');
+    const [custom, setCustom] = useState(null);
+    const { redraw, portal } = useFigureRedraw(renderFigure);
     // The panel is held open from here rather than left to itself, because the
     // figure has to be measured at the moment it opens: its size is what the
     // panel writes out, and reading a bounding box on every render would cost a
@@ -52,7 +62,16 @@ export function FigureDownload(props) {
     async function save() {
         setSaving(true);
         try {
-            await downloadFigure(targetId, { format, scale, fileName, background });
+            const options = { format, scale, fileName, background };
+            if (renderFigure !== undefined &&
+                size !== null &&
+                figureLayoutRedraws(layout, size, custom ?? size)) {
+                const drawn = figureLayoutSize(layout, size, custom ?? size);
+                await redraw(targetId, drawn, (box) => downloadFigure(box, options));
+            }
+            else {
+                await downloadFigure(targetId, options);
+            }
             setFailure(null);
         }
         catch (error) {
@@ -62,6 +81,13 @@ export function FigureDownload(props) {
             setSaving(false);
         }
     }
-    return (_jsx(PopoverNext, { isOpen: open, placement: "bottom-end", onInteraction: interact, content: _jsx(FigureDownloadPanel, { title: title ?? t('download.saveFigure'), format: format, scale: scale, scales: scales, size: size, failure: failure, saving: saving, onFormatChange: setFormat, onScaleChange: setScale, onSave: () => void save() }), children: _jsx(OverlayIconButton, { icon: icon, label: label ?? t('download.saveThisFigure'), value: format.toUpperCase(), active: open, testId: testId, opensMenu: true }) }));
+    return (_jsxs(_Fragment, { children: [_jsx(PopoverNext, { isOpen: open, placement: "bottom-end", onInteraction: interact, content: _jsx(FigureDownloadPanel, { title: title ?? t('download.saveFigure'), format: format, scale: scale, scales: scales, size: size, failure: failure, saving: saving, onFormatChange: setFormat, onScaleChange: (next) => setPicked((current) => ({ ...current, [format]: next })), onSave: () => void save(), sizing: renderFigure === undefined
+                        ? undefined
+                        : {
+                            layout,
+                            custom,
+                            onLayoutChange: setLayout,
+                            onCustomChange: setCustom,
+                        } }), children: _jsx(OverlayIconButton, { icon: icon, label: label ?? t('download.saveThisFigure'), value: format.toUpperCase(), active: open, testId: testId, opensMenu: true }) }), portal] }));
 }
 //# sourceMappingURL=FigureDownload.js.map

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

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

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

@@ -1,6 +1,7 @@
 import type { ReactElement } from 'react';
 import type { FigureFormat } from '../core/downloadFigure.ts';
 import type { FigurePixels } from '../core/figureScale.ts';
+import type { FigureSizing } from './FigureSizeRows.tsx';
 /** What {@link FigureDownloadPanel} is drawn from. */
 export interface FigureDownloadPanelProps {
     /** What the panel is called. */
@@ -25,20 +26,29 @@ export interface FigureDownloadPanelProps {
     onSave: () => void;
     /**
      * Whether the SVG holds a rendered picture rather than vector drawings, as
-     * for a WebGL scene: its resolution then applies, and the hint says so.
+     * for a WebGL scene: its resolution is then the pixels of that picture, it
+     * meets the same ceiling as a PNG, and the hint says so.
      * @default false
      */
     rasterSvg?: boolean;
+    /**
+     * The shape the figure is drawn at, for a figure that can be drawn again at
+     * another size. Without it the figure is saved at the size it has on screen,
+     * and no size is offered.
+     * @default undefined
+     */
+    sizing?: FigureSizing;
 }
 /**
- * The two choices behind the save glyph, and the button that writes the file.
+ * The choices behind the save glyph, and the button that writes the file.
  *
- * The resolution stays in place and greyed while an SVG is selected rather
- * than disappearing, because a control that vanishes is a control the reader
- * concludes the figure does not have — and the sentence at the foot says why
- * it is greyed, which is that an SVG has no resolution to choose.
+ * The resolution applies to both formats, and means what the reader needs it
+ * to: a PNG is painted with that many more pixels, and an SVG, drawn the same,
+ * opens that many times larger in the slide or the document it is dropped
+ * into. Only a PNG meets the ceiling of what a browser can paint, so only its
+ * choices past that ceiling are greyed.
  *
- * That sentence is the panel's own hint line rather than a row of its own: it
+ * The sentence at the foot is the panel's own hint line rather than a row of its own: it
  * is not a setting, it is what the two settings above it currently amount to,
  * and it is the only thing here that answers the question a reader actually
  * has, which is how big the file is going to be. Saving itself is a command

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

@@ -1 +1 @@
-{"version":3,"file":"FigureDownloadPanel.d.ts","sourceRoot":"","sources":["../../../src/download/ui/FigureDownloadPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAS1C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAC9D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAQ3D,sDAAsD;AACtD,MAAM,WAAW,wBAAwB;IACvC,gCAAgC;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,+CAA+C;IAC/C,MAAM,EAAE,YAAY,CAAC;IACrB,6DAA6D;IAC7D,KAAK,EAAE,MAAM,CAAC;IACd,6BAA6B;IAC7B,MAAM,EAAE,SAAS,MAAM,EAAE,CAAC;IAC1B,wEAAwE;IACxE,IAAI,EAAE,YAAY,GAAG,IAAI,CAAC;IAC1B,mEAAmE;IACnE,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,iDAAiD;IACjD,MAAM,EAAE,OAAO,CAAC;IAChB,gDAAgD;IAChD,cAAc,EAAE,CAAC,MAAM,EAAE,YAAY,KAAK,IAAI,CAAC;IAC/C,4CAA4C;IAC5C,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,mCAAmC;IACnC,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,mBAAmB,CACjC,KAAK,EAAE,wBAAwB,GAC9B,YAAY,CAgDd"}
+{"version":3,"file":"FigureDownloadPanel.d.ts","sourceRoot":"","sources":["../../../src/download/ui/FigureDownloadPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAS1C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,2BAA2B,CAAC;AAE9D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAQ3D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAGzD,sDAAsD;AACtD,MAAM,WAAW,wBAAwB;IACvC,gCAAgC;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,+CAA+C;IAC/C,MAAM,EAAE,YAAY,CAAC;IACrB,6DAA6D;IAC7D,KAAK,EAAE,MAAM,CAAC;IACd,6BAA6B;IAC7B,MAAM,EAAE,SAAS,MAAM,EAAE,CAAC;IAC1B,wEAAwE;IACxE,IAAI,EAAE,YAAY,GAAG,IAAI,CAAC;IAC1B,mEAAmE;IACnE,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IACvB,iDAAiD;IACjD,MAAM,EAAE,OAAO,CAAC;IAChB,gDAAgD;IAChD,cAAc,EAAE,CAAC,MAAM,EAAE,YAAY,KAAK,IAAI,CAAC;IAC/C,4CAA4C;IAC5C,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,mCAAmC;IACnC,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;;OAKG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC;CACvB;AAED;;;;;;;;;;;;;;;;;GAiBG;AACH,wBAAgB,mBAAmB,CACjC,KAAK,EAAE,wBAAwB,GAC9B,YAAY,CAyDd"}

package/lib/download/ui/FigureDownloadPanel.js

@@ -3,16 +3,19 @@ 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";
 /**
- * The two choices behind the save glyph, and the button that writes the file.
+ * The choices behind the save glyph, and the button that writes the file.
  *
- * The resolution stays in place and greyed while an SVG is selected rather
- * than disappearing, because a control that vanishes is a control the reader
- * concludes the figure does not have — and the sentence at the foot says why
- * it is greyed, which is that an SVG has no resolution to choose.
+ * The resolution applies to both formats, and means what the reader needs it
+ * to: a PNG is painted with that many more pixels, and an SVG, drawn the same,
+ * opens that many times larger in the slide or the document it is dropped
+ * into. Only a PNG meets the ceiling of what a browser can paint, so only its
+ * choices past that ceiling are greyed.
  *
- * That sentence is the panel's own hint line rather than a row of its own: it
+ * The sentence at the foot is the panel's own hint line rather than a row of its own: it
  * is not a setting, it is what the two settings above it currently amount to,
  * and it is the only thing here that answers the question a reader actually
  * has, which is how big the file is going to be. Saving itself is a command
@@ -24,19 +27,24 @@ import { figurePixels, figureScaleFits, figureScaleLabel, formatFigurePixels, }
 export function FigureDownloadPanel(props) {
     const { title, format, scale, scales, size, failure, saving } = props;
     const { onFormatChange, onScaleChange, onSave, rasterSvg = false } = props;
+    const { sizing } = props;
     const t = useChromeT();
-    const vector = format === 'svg' && !rasterSvg;
-    return (_jsxs(OverlayPanel, { title: title, hint: hintOf(format, size, scale, failure, rasterSvg, t), actions: _jsx(OverlayAction, { text: t('download.save'), icon: "download", intent: "primary", disabled: saving || size === null, onClick: onSave }), children: [_jsx(OverlaySegmented, { label: t('download.format'), help: {
+    // 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, hint: hintOf(format, drawn, scale, failure, rasterSvg, t), actions: _jsx(OverlayAction, { text: t('download.save'), icon: "download", intent: "primary", disabled: saving || size === null, onClick: onSave }), children: [_jsx(OverlaySegmented, { label: t('download.format'), help: {
                     title: t('download.format'),
                     body: t('download.formatHelp'),
-                }, value: format, options: FORMAT_CHOICES, onChange: onFormatChange }), _jsx(OverlaySegmented, { label: t('download.resolution'), help: {
+                }, value: format, options: FORMAT_CHOICES, onChange: onFormatChange }), 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, size), disabled: vector, onChange: (picked) => onScaleChange(Number(picked)) })] }));
+                }, value: String(scale), options: scaleChoices(scales, drawn, painted), onChange: (picked) => onScaleChange(Number(picked)) })] }));
 }
 /** The two files a figure can leave the page as. */
 const FORMAT_CHOICES = [
@@ -47,12 +55,14 @@ const FORMAT_CHOICES = [
  * 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.
+ * 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 on the page.
+ * @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) {
+function scaleChoices(scales, size, painted) {
     const choices = [];
     for (const scale of scales) {
         const pixels = size === null ? null : figurePixels(size, scale);
@@ -60,7 +70,7 @@ function scaleChoices(scales, size) {
             value: String(scale),
             label: figureScaleLabel(scale),
             title: pixels === null ? undefined : formatFigurePixels(pixels),
-            disabled: size !== null && !figureScaleFits(size, scale),
+            disabled: painted && size !== null && !figureScaleFits(size, scale),
         });
     }
     return choices;
@@ -68,8 +78,8 @@ function scaleChoices(scales, size) {
 /**
  * The line at the foot of the panel: what pressing save is about to do.
  * @param format - Which file the reader is about to write.
- * @param size - How big the figure is on the page.
- * @param scale - The multiple it is painted at.
+ * @param size - How big the figure is drawn for the file.
+ * @param scale - The multiple it is saved at.
  * @param failure - What went wrong last time, if anything.
  * @param rasterSvg - Whether the SVG embeds a rendered picture.
  * @param t - The chrome's formatter, so the sentence is in the language of
@@ -86,11 +96,9 @@ function hintOf(format, size, scale, failure, rasterSvg, t) {
             pixels: formatFigurePixels(figurePixels(size, scale)),
         });
     }
-    if (format === 'svg') {
-        return t('download.hintSvg', { pixels: formatFigurePixels(size) });
-    }
-    return t('download.hintPng', {
-        pixels: formatFigurePixels(figurePixels(size, scale)),
-    });
+    const pixels = formatFigurePixels(figurePixels(size, scale));
+    return format === 'svg'
+        ? t('download.hintSvg', { pixels })
+        : t('download.hintPng', { pixels });
 }
 //# 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/FigureSizeField.d.ts

@@ -0,0 +1,27 @@
+import type { ReactElement } from 'react';
+import type { FigurePixels } from '../core/figureScale.ts';
+/** What {@link FigureSizeField} needs. */
+export interface FigureSizeFieldProps {
+    /** What the row is called. */
+    label: string;
+    /** What the first box is called, for a screen reader. */
+    widthLabel: string;
+    /** What the second box is called. */
+    heightLabel: string;
+    /** The size typed so far. */
+    value: FigurePixels;
+    /** Called with the size, each side already held to the range. */
+    onChange: (size: FigurePixels) => void;
+}
+/**
+ * The two sides of a figure, typed in pixels.
+ *
+ * These are typed rather than stepped: a reader asking for 1920 × 1080 knows
+ * the numbers, and a stepper would take a hundred presses to reach them. A side
+ * is taken when the reader leaves its box or presses Enter, never on each key,
+ * since the `1` of a `1200` on its way in is not a width anybody asked for.
+ * @param props - See {@link FigureSizeFieldProps}.
+ * @returns The row.
+ */
+export declare function FigureSizeField(props: FigureSizeFieldProps): ReactElement;
+//# sourceMappingURL=FigureSizeField.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"FigureSizeField.d.ts","sourceRoot":"","sources":["../../../src/download/ui/FigureSizeField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAgC,YAAY,EAAE,MAAM,OAAO,CAAC;AAQxE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAE3D,0CAA0C;AAC1C,MAAM,WAAW,oBAAoB;IACnC,8BAA8B;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,yDAAyD;IACzD,UAAU,EAAE,MAAM,CAAC;IACnB,qCAAqC;IACrC,WAAW,EAAE,MAAM,CAAC;IACpB,6BAA6B;IAC7B,KAAK,EAAE,YAAY,CAAC;IACpB,iEAAiE;IACjE,QAAQ,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,IAAI,CAAC;CACxC;AAED;;;;;;;;;GASG;AACH,wBAAgB,eAAe,CAAC,KAAK,EAAE,oBAAoB,GAAG,YAAY,CAwBzE"}

package/lib/download/ui/FigureSizeField.js

@@ -0,0 +1,87 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { OverlayRow } from "../../overlay/ui/OverlayRow.js";
+import { useOverlaySurface } from "../../overlay/ui/overlaySurface.js";
+import { overlayFocusRing } from "../../overlay/ui/overlayValueStyles.js";
+import { figureLayoutSide } from "../core/figureLayout.js";
+/**
+ * The two sides of a figure, typed in pixels.
+ *
+ * These are typed rather than stepped: a reader asking for 1920 × 1080 knows
+ * the numbers, and a stepper would take a hundred presses to reach them. A side
+ * is taken when the reader leaves its box or presses Enter, never on each key,
+ * since the `1` of a `1200` on its way in is not a width anybody asked for.
+ * @param props - See {@link FigureSizeFieldProps}.
+ * @returns The row.
+ */
+export function FigureSizeField(props) {
+    const { label, widthLabel, heightLabel, value, onChange } = props;
+    const { metrics } = useOverlaySurface();
+    return (_jsx(OverlayRow, { label: label, children: _jsxs("span", { style: { ...FIELD_STYLE, fontSize: metrics.fontSize }, children: [_jsx(SideInput, { label: widthLabel, value: value.width, metrics: metrics, onCommit: (width) => onChange({ ...value, width }) }), _jsx("span", { "aria-hidden": "true", children: "\u00D7" }), _jsx(SideInput, { label: heightLabel, value: value.height, metrics: metrics, onCommit: (height) => onChange({ ...value, height }) }), _jsx("span", { style: UNIT_STYLE, children: "px" })] }) }));
+}
+/**
+ * One side, typed.
+ * @param props - See {@link SideInputProps}.
+ * @returns The box.
+ */
+function SideInput(props) {
+    const { label, value, metrics, onCommit } = props;
+    const [draft, setDraft] = useState(String(value));
+    const [taken, setTaken] = useState(value);
+    const [focused, setFocused] = useState(false);
+    // A side changed from outside — another shape picked, a clamp — replaces
+    // whatever was being typed.
+    if (taken !== value) {
+        setTaken(value);
+        setDraft(String(value));
+    }
+    function commit() {
+        const typed = Number.parseFloat(draft);
+        const side = Number.isFinite(typed) ? figureLayoutSide(typed) : value;
+        setDraft(String(side));
+        if (side !== value)
+            onCommit(side);
+    }
+    function onKeyDown(event) {
+        if (event.key !== 'Enter')
+            return;
+        event.preventDefault();
+        commit();
+    }
+    return (_jsx("input", { type: "text", inputMode: "numeric", "aria-label": label, value: draft, style: { ...sideStyle(metrics), ...overlayFocusRing(focused) }, onChange: (event) => setDraft(event.currentTarget.value), onFocus: () => setFocused(true), onBlur: () => {
+            setFocused(false);
+            commit();
+        }, onKeyDown: onKeyDown }));
+}
+/**
+ * A box as tall as every other control of the panel, and wide enough for four
+ * digits.
+ * @param metrics - The measurements the panel is drawn from.
+ * @returns The box's rules.
+ */
+function sideStyle(metrics) {
+    return {
+        boxSizing: 'border-box',
+        width: '5em',
+        height: metrics.controlHeight,
+        padding: '0 6px',
+        border: '1px solid var(--border)',
+        borderRadius: metrics.controlRadius,
+        background: 'var(--surface)',
+        color: 'var(--text)',
+        font: 'inherit',
+        fontSize: metrics.fontSize,
+        fontVariantNumeric: 'tabular-nums',
+        textAlign: 'right',
+    };
+}
+const FIELD_STYLE = {
+    display: 'inline-flex',
+    alignItems: 'center',
+    gap: 6,
+    color: 'var(--text-muted)',
+};
+const UNIT_STYLE = {
+    color: 'var(--text-faint)',
+};
+//# sourceMappingURL=FigureSizeField.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"FigureSizeField.js","sourceRoot":"","sources":["../../../src/download/ui/FigureSizeField.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAGjC,OAAO,EAAE,UAAU,EAAE,MAAM,gCAAiC,CAAC;AAC7D,OAAO,EAAE,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AACvE,OAAO,EAAE,gBAAgB,EAAE,MAAM,wCAAwC,CAAC;AAC1E,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAiB3D;;;;;;;;;GASG;AACH,MAAM,UAAU,eAAe,CAAC,KAA2B;IACzD,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,WAAW,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IAClE,MAAM,EAAE,OAAO,EAAE,GAAG,iBAAiB,EAAE,CAAC;IAExC,OAAO,CACL,KAAC,UAAU,IAAC,KAAK,EAAE,KAAK,YACtB,gBAAM,KAAK,EAAE,EAAE,GAAG,WAAW,EAAE,QAAQ,EAAE,OAAO,CAAC,QAAQ,EAAE,aACzD,KAAC,SAAS,IACR,KAAK,EAAE,UAAU,EACjB,KAAK,EAAE,KAAK,CAAC,KAAK,EAClB,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,QAAQ,CAAC,EAAE,GAAG,KAAK,EAAE,KAAK,EAAE,CAAC,GAClD,EACF,8BAAkB,MAAM,uBAAS,EACjC,KAAC,SAAS,IACR,KAAK,EAAE,WAAW,EAClB,KAAK,EAAE,KAAK,CAAC,MAAM,EACnB,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,CAAC,MAAM,EAAE,EAAE,CAAC,QAAQ,CAAC,EAAE,GAAG,KAAK,EAAE,MAAM,EAAE,CAAC,GACpD,EACF,eAAM,KAAK,EAAE,UAAU,mBAAW,IAC7B,GACI,CACd,CAAC;AACJ,CAAC;AAaD;;;;GAIG;AACH,SAAS,SAAS,CAAC,KAAqB;IACtC,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IAClD,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;IAClD,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC1C,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAE9C,yEAAyE;IACzE,4BAA4B;IAC5B,IAAI,KAAK,KAAK,KAAK,EAAE,CAAC;QACpB,QAAQ,CAAC,KAAK,CAAC,CAAC;QAChB,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;IAC1B,CAAC;IAED,SAAS,MAAM;QACb,MAAM,KAAK,GAAG,MAAM,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC;QACvC,MAAM,IAAI,GAAG,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,gBAAgB,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;QACtE,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC;QACvB,IAAI,IAAI,KAAK,KAAK;YAAE,QAAQ,CAAC,IAAI,CAAC,CAAC;IACrC,CAAC;IAED,SAAS,SAAS,CAAC,KAAsC;QACvD,IAAI,KAAK,CAAC,GAAG,KAAK,OAAO;YAAE,OAAO;QAClC,KAAK,CAAC,cAAc,EAAE,CAAC;QACvB,MAAM,EAAE,CAAC;IACX,CAAC;IAED,OAAO,CACL,gBACE,IAAI,EAAC,MAAM,EACX,SAAS,EAAC,SAAS,gBACP,KAAK,EACjB,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,EAAE,GAAG,SAAS,CAAC,OAAO,CAAC,EAAE,GAAG,gBAAgB,CAAC,OAAO,CAAC,EAAE,EAC9D,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,aAAa,CAAC,KAAK,CAAC,EACxD,OAAO,EAAE,GAAG,EAAE,CAAC,UAAU,CAAC,IAAI,CAAC,EAC/B,MAAM,EAAE,GAAG,EAAE;YACX,UAAU,CAAC,KAAK,CAAC,CAAC;YAClB,MAAM,EAAE,CAAC;QACX,CAAC,EACD,SAAS,EAAE,SAAS,GACpB,CACH,CAAC;AACJ,CAAC;AAED;;;;;GAKG;AACH,SAAS,SAAS,CAAC,OAAuB;IACxC,OAAO;QACL,SAAS,EAAE,YAAY;QACvB,KAAK,EAAE,KAAK;QACZ,MAAM,EAAE,OAAO,CAAC,aAAa;QAC7B,OAAO,EAAE,OAAO;QAChB,MAAM,EAAE,yBAAyB;QACjC,YAAY,EAAE,OAAO,CAAC,aAAa;QACnC,UAAU,EAAE,gBAAgB;QAC5B,KAAK,EAAE,aAAa;QACpB,IAAI,EAAE,SAAS;QACf,QAAQ,EAAE,OAAO,CAAC,QAAQ;QAC1B,kBAAkB,EAAE,cAAc;QAClC,SAAS,EAAE,OAAO;KACnB,CAAC;AACJ,CAAC;AAED,MAAM,WAAW,GAAG;IAClB,OAAO,EAAE,aAAa;IACtB,UAAU,EAAE,QAAQ;IACpB,GAAG,EAAE,CAAC;IACN,KAAK,EAAE,mBAAmB;CACM,CAAC;AAEnC,MAAM,UAAU,GAAG;IACjB,KAAK,EAAE,mBAAmB;CACM,CAAC"}

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

@@ -0,0 +1,34 @@
+import type { ReactElement } from 'react';
+import type { FigureLayout } from '../core/figureLayout.ts';
+import type { FigurePixels } from '../core/figureScale.ts';
+/** The shape a figure is saved at, and what changes it. */
+export interface FigureSizing {
+    /** The shape picked. */
+    layout: FigureLayout;
+    /**
+     * The size typed for `custom`, or `null` before anything was typed, when it
+     * starts from the figure on screen.
+     */
+    custom: FigurePixels | null;
+    /** Called with the shape picked. */
+    onLayoutChange: (layout: FigureLayout) => void;
+    /** Called with the size typed. */
+    onCustomChange: (size: FigurePixels) => void;
+}
+/** What {@link FigureSizeRows} needs. */
+export interface FigureSizeRowsProps {
+    /** The shape and what changes it. */
+    sizing: FigureSizing;
+    /** How big the figure is on the page, or `null` where there is none. */
+    size: FigurePixels | null;
+}
+/**
+ * The shape the figure is drawn at, and the two sides of a custom one.
+ *
+ * Each shape says the pixels it would produce, so choosing `16:9` for a figure
+ * already close to it is visibly a choice that changes little.
+ * @param props - See {@link FigureSizeRowsProps}.
+ * @returns The rows.
+ */
+export declare function FigureSizeRows(props: FigureSizeRowsProps): ReactElement;
+//# sourceMappingURL=FigureSizeRows.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"FigureSizeRows.d.ts","sourceRoot":"","sources":["../../../src/download/ui/FigureSizeRows.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAO1C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AAE5D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAK3D,2DAA2D;AAC3D,MAAM,WAAW,YAAY;IAC3B,wBAAwB;IACxB,MAAM,EAAE,YAAY,CAAC;IACrB;;;OAGG;IACH,MAAM,EAAE,YAAY,GAAG,IAAI,CAAC;IAC5B,oCAAoC;IACpC,cAAc,EAAE,CAAC,MAAM,EAAE,YAAY,KAAK,IAAI,CAAC;IAC/C,kCAAkC;IAClC,cAAc,EAAE,CAAC,IAAI,EAAE,YAAY,KAAK,IAAI,CAAC;CAC9C;AAED,yCAAyC;AACzC,MAAM,WAAW,mBAAmB;IAClC,qCAAqC;IACrC,MAAM,EAAE,YAAY,CAAC;IACrB,wEAAwE;IACxE,IAAI,EAAE,YAAY,GAAG,IAAI,CAAC;CAC3B;AAED;;;;;;;GAOG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,GAAG,YAAY,CAsCvE"}

package/lib/download/ui/FigureSizeRows.js

@@ -0,0 +1,54 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useChromeT } from "../../i18n/ui/useT.js";
+import { OverlaySelect } from "../../overlay/ui/OverlaySelect.js";
+import { FIGURE_LAYOUTS, figureLayoutSize } from "../core/figureLayout.js";
+import { formatFigurePixels } from "../core/figureScale.js";
+import { FigureSizeField } from "./FigureSizeField.js";
+/**
+ * The shape the figure is drawn at, and the two sides of a custom one.
+ *
+ * Each shape says the pixels it would produce, so choosing `16:9` for a figure
+ * already close to it is visibly a choice that changes little.
+ * @param props - See {@link FigureSizeRowsProps}.
+ * @returns The rows.
+ */
+export function FigureSizeRows(props) {
+    const { sizing, size } = props;
+    const { layout, custom, onLayoutChange, onCustomChange } = sizing;
+    const t = useChromeT();
+    const options = [];
+    for (const shape of FIGURE_LAYOUTS) {
+        options.push({
+            value: shape,
+            label: layoutLabel(shape, t),
+            title: size === null
+                ? undefined
+                : formatFigurePixels(figureLayoutSize(shape, size, custom ?? size)),
+        });
+    }
+    return (_jsxs(_Fragment, { children: [_jsx(OverlaySelect, { label: t('download.size'), help: { title: t('download.size'), body: t('download.sizeHelp') }, value: layout, options: options, disabled: size === null, onChange: onLayoutChange }), layout === 'custom' && size !== null ? (_jsx(FigureSizeField, { label: t('download.customSize'), widthLabel: t('download.width'), heightLabel: t('download.height'), value: figureLayoutSize('custom', size, custom ?? size), onChange: onCustomChange })) : null] }));
+}
+/**
+ * What a shape reads in the picker. A ratio is written as a ratio in every
+ * language.
+ * @param layout - The shape.
+ * @param t - The chrome's formatter.
+ * @returns Its label.
+ */
+function layoutLabel(layout, t) {
+    switch (layout) {
+        case 'standard':
+            return '4:3';
+        case 'wide':
+            return '16:9';
+        case 'column':
+            return t('download.sizeColumn');
+        case 'custom':
+            return t('download.sizeCustom');
+        case 'screen':
+            return t('download.sizeScreen');
+        default:
+            throw new Error(`unknown figure layout: ${String(layout)}`);
+    }
+}
+//# sourceMappingURL=FigureSizeRows.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"FigureSizeRows.js","sourceRoot":"","sources":["../../../src/download/ui/FigureSizeRows.tsx"],"names":[],"mappings":";AAIA,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAEnD,OAAO,EAAE,aAAa,EAAE,MAAM,mCAAoC,CAAC;AAEnE,OAAO,EAAE,cAAc,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAE3E,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAE5D,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAuB,CAAC;AAyBxD;;;;;;;GAOG;AACH,MAAM,UAAU,cAAc,CAAC,KAA0B;IACvD,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,KAAK,CAAC;IAC/B,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,cAAc,EAAE,cAAc,EAAE,GAAG,MAAM,CAAC;IAClE,MAAM,CAAC,GAAG,UAAU,EAAE,CAAC;IAEvB,MAAM,OAAO,GAAuC,EAAE,CAAC;IACvD,KAAK,MAAM,KAAK,IAAI,cAAc,EAAE,CAAC;QACnC,OAAO,CAAC,IAAI,CAAC;YACX,KAAK,EAAE,KAAK;YACZ,KAAK,EAAE,WAAW,CAAC,KAAK,EAAE,CAAC,CAAC;YAC5B,KAAK,EACH,IAAI,KAAK,IAAI;gBACX,CAAC,CAAC,SAAS;gBACX,CAAC,CAAC,kBAAkB,CAAC,gBAAgB,CAAC,KAAK,EAAE,IAAI,EAAE,MAAM,IAAI,IAAI,CAAC,CAAC;SACxE,CAAC,CAAC;IACL,CAAC;IAED,OAAO,CACL,8BACE,KAAC,aAAa,IACZ,KAAK,EAAE,CAAC,CAAC,eAAe,CAAC,EACzB,IAAI,EAAE,EAAE,KAAK,EAAE,CAAC,CAAC,eAAe,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC,mBAAmB,CAAC,EAAE,EACjE,KAAK,EAAE,MAAM,EACb,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,IAAI,KAAK,IAAI,EACvB,QAAQ,EAAE,cAAc,GACxB,EACD,MAAM,KAAK,QAAQ,IAAI,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,CACtC,KAAC,eAAe,IACd,KAAK,EAAE,CAAC,CAAC,qBAAqB,CAAC,EAC/B,UAAU,EAAE,CAAC,CAAC,gBAAgB,CAAC,EAC/B,WAAW,EAAE,CAAC,CAAC,iBAAiB,CAAC,EACjC,KAAK,EAAE,gBAAgB,CAAC,QAAQ,EAAE,IAAI,EAAE,MAAM,IAAI,IAAI,CAAC,EACvD,QAAQ,EAAE,cAAc,GACxB,CACH,CAAC,CAAC,CAAC,IAAI,IACP,CACJ,CAAC;AACJ,CAAC;AAED;;;;;;GAMG;AACH,SAAS,WAAW,CAAC,MAAoB,EAAE,CAAuB;IAChE,QAAQ,MAAM,EAAE,CAAC;QACf,KAAK,UAAU;YACb,OAAO,KAAK,CAAC;QACf,KAAK,MAAM;YACT,OAAO,MAAM,CAAC;QAChB,KAAK,QAAQ;YACX,OAAO,CAAC,CAAC,qBAAqB,CAAC,CAAC;QAClC,KAAK,QAAQ;YACX,OAAO,CAAC,CAAC,qBAAqB,CAAC,CAAC;QAClC,KAAK,QAAQ;YACX,OAAO,CAAC,CAAC,qBAAqB,CAAC,CAAC;QAClC;YACE,MAAM,IAAI,KAAK,CAAC,0BAA0B,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;IAChE,CAAC;AACH,CAAC"}

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

@@ -10,6 +10,8 @@ export type { FigureDownloadProps } from './FigureDownload.tsx';
 export { FigureDownload } from './FigureDownload.tsx';
 export type { FigureDownloadPanelProps } from './FigureDownloadPanel.tsx';
 export { FigureDownloadPanel } from './FigureDownloadPanel.tsx';
+export type { FigureSizing } from './FigureSizeRows.tsx';
+export type { FigureRenderer } from './useFigureRedraw.tsx';
 export type { ExportDialogFrameProps } from './ExportDialogFrame.tsx';
 export { ExportDialogFrame } from './ExportDialogFrame.tsx';
 export type { ExportImageDialogProps } from './ExportImageDialog.tsx';

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/download/ui/index.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,YAAY,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAC;AAChE,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,YAAY,EAAE,wBAAwB,EAAE,MAAM,2BAA2B,CAAC;AAC1E,OAAO,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AAEhE,YAAY,EAAE,sBAAsB,EAAE,MAAM,yBAAyB,CAAC;AACtE,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAC5D,YAAY,EAAE,sBAAsB,EAAE,MAAM,yBAAyB,CAAC;AACtE,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAC5D,YAAY,EAAE,oBAAoB,EAAE,MAAM,uBAAuB,CAAC;AAClE,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AACxD,YAAY,EAAE,yBAAyB,EAAE,MAAM,4BAA4B,CAAC;AAC5E,OAAO,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAC;AAClE,YAAY,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/download/ui/index.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,YAAY,EAAE,mBAAmB,EAAE,MAAM,sBAAsB,CAAC;AAChE,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AACtD,YAAY,EAAE,wBAAwB,EAAE,MAAM,2BAA2B,CAAC;AAC1E,OAAO,EAAE,mBAAmB,EAAE,MAAM,2BAA2B,CAAC;AAChE,YAAY,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACzD,YAAY,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAE5D,YAAY,EAAE,sBAAsB,EAAE,MAAM,yBAAyB,CAAC;AACtE,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAC5D,YAAY,EAAE,sBAAsB,EAAE,MAAM,yBAAyB,CAAC;AACtE,OAAO,EAAE,iBAAiB,EAAE,MAAM,yBAAyB,CAAC;AAC5D,YAAY,EAAE,oBAAoB,EAAE,MAAM,uBAAuB,CAAC;AAClE,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AACxD,YAAY,EAAE,yBAAyB,EAAE,MAAM,4BAA4B,CAAC;AAC5E,OAAO,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAC;AAClE,YAAY,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC"}