react-cheminfo 0.8.0 → 0.10.0

package/lib/delimited/ui/DelimitedTextPanel.js

@@ -38,7 +38,7 @@ const CONTROLS_STYLE = {
     marginTop: 12,
 };
 const LABEL_STYLE = {
-    color: '#5f6b7c',
+    color: 'var(--text-muted, #5f6b7c)',
     fontSize: 12,
 };
 const SPACER_STYLE = { flex: 1 };

package/lib/delimited/ui/DelimitedTextPanel.js.map

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

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

@@ -0,0 +1,33 @@
+/**
+ * Reading the tokens a figure is drawn with out of its markup, and writing
+ * their values back into it.
+ *
+ * Every chart in this package takes its ink from the family's custom
+ * properties — `var(--border)`, `var(--text-muted)` — which is what lets one
+ * figure follow the site it is embedded in. A file saved to disk has left that
+ * site: nothing there declares `--border`, so a `var()` that survives the
+ * export resolves to nothing at all and the picture arrives with no axes. So
+ * the values are read off the live element while it is still on the page, and
+ * written into the copy that leaves.
+ */
+/**
+ * Every token a piece of markup asks for, each named once.
+ * @param text - The markup, or a single declaration.
+ * @returns The token names, `--` included, in the order first written.
+ */
+export declare function cssTokenNames(text: string): readonly string[];
+/**
+ * The same markup with every token it names written out in full.
+ *
+ * A token whose value is itself written with `var()` — which is how a site
+ * points `--accent` at its own `--brand` — is resolved in turn, up to a few
+ * passes deep. A token nobody has a value for keeps its fallback where the
+ * call carries one, and is otherwise left exactly as written: an unresolved
+ * `var()` is at worst the colour that was already missing, while a guess would
+ * be a colour nobody chose.
+ * @param text - The markup, or a single declaration.
+ * @param values - What each token is worth, keyed by name with its `--`.
+ * @returns The markup, resolved.
+ */
+export declare function resolveCssTokens(text: string, values: Readonly<Record<string, string>>): string;
+//# sourceMappingURL=cssTokens.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"cssTokens.d.ts","sourceRoot":"","sources":["../../../src/download/core/cssTokens.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AAaH;;;;GAIG;AACH,wBAAgB,aAAa,CAAC,IAAI,EAAE,MAAM,GAAG,SAAS,MAAM,EAAE,CAU7D;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,gBAAgB,CAC9B,IAAI,EAAE,MAAM,EACZ,MAAM,EAAE,QAAQ,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,GACvC,MAAM,CASR"}

package/lib/download/core/cssTokens.js

@@ -0,0 +1,82 @@
+/**
+ * Reading the tokens a figure is drawn with out of its markup, and writing
+ * their values back into it.
+ *
+ * Every chart in this package takes its ink from the family's custom
+ * properties — `var(--border)`, `var(--text-muted)` — which is what lets one
+ * figure follow the site it is embedded in. A file saved to disk has left that
+ * site: nothing there declares `--border`, so a `var()` that survives the
+ * export resolves to nothing at all and the picture arrives with no axes. So
+ * the values are read off the live element while it is still on the page, and
+ * written into the copy that leaves.
+ */
+/**
+ * One `var(--name)` call, with the fallback it carries where it has one. The
+ * fallback may not itself contain brackets, so a nested call is left to the
+ * next pass rather than half-matched here.
+ */
+const TOKEN_CALL = /var\(\s*(?<name>--[\w-]+)\s*(?:,\s*(?<fallback>[^()]*?)\s*)?\)/gu;
+/** How many times a resolved value may itself name another token. */
+const MAX_PASSES = 4;
+/**
+ * Every token a piece of markup asks for, each named once.
+ * @param text - The markup, or a single declaration.
+ * @returns The token names, `--` included, in the order first written.
+ */
+export function cssTokenNames(text) {
+    const names = [];
+    const seen = new Set();
+    for (const match of text.matchAll(TOKEN_CALL)) {
+        const name = match.groups?.name;
+        if (name === undefined || seen.has(name))
+            continue;
+        seen.add(name);
+        names.push(name);
+    }
+    return names;
+}
+/**
+ * The same markup with every token it names written out in full.
+ *
+ * A token whose value is itself written with `var()` — which is how a site
+ * points `--accent` at its own `--brand` — is resolved in turn, up to a few
+ * passes deep. A token nobody has a value for keeps its fallback where the
+ * call carries one, and is otherwise left exactly as written: an unresolved
+ * `var()` is at worst the colour that was already missing, while a guess would
+ * be a colour nobody chose.
+ * @param text - The markup, or a single declaration.
+ * @param values - What each token is worth, keyed by name with its `--`.
+ * @returns The markup, resolved.
+ */
+export function resolveCssTokens(text, values) {
+    let resolved = text;
+    for (let pass = 0; pass < MAX_PASSES; pass++) {
+        if (!resolved.includes('var('))
+            break;
+        const next = resolveOnce(resolved, values);
+        if (next === resolved)
+            break;
+        resolved = next;
+    }
+    return resolved;
+}
+/**
+ * One pass over the markup, replacing the calls that can be answered.
+ * @param text - The markup as it stands.
+ * @param values - What each token is worth.
+ * @returns The markup, one layer of tokens shallower.
+ */
+function resolveOnce(text, values) {
+    let written = '';
+    let read = 0;
+    for (const match of text.matchAll(TOKEN_CALL)) {
+        const { name, fallback } = match.groups ?? {};
+        const value = name === undefined ? undefined : values[name]?.trim();
+        written += text.slice(read, match.index);
+        written +=
+            value !== undefined && value !== '' ? value : (fallback ?? match[0]);
+        read = match.index + match[0].length;
+    }
+    return written + text.slice(read);
+}
+//# sourceMappingURL=cssTokens.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"cssTokens.js","sourceRoot":"","sources":["../../../src/download/core/cssTokens.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;GAWG;AAEH;;;;GAIG;AACH,MAAM,UAAU,GACd,kEAAkE,CAAC;AAErE,qEAAqE;AACrE,MAAM,UAAU,GAAG,CAAC,CAAC;AAErB;;;;GAIG;AACH,MAAM,UAAU,aAAa,CAAC,IAAY;IACxC,MAAM,KAAK,GAAa,EAAE,CAAC;IAC3B,MAAM,IAAI,GAAG,IAAI,GAAG,EAAU,CAAC;IAC/B,KAAK,MAAM,KAAK,IAAI,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,EAAE,CAAC;QAC9C,MAAM,IAAI,GAAG,KAAK,CAAC,MAAM,EAAE,IAAI,CAAC;QAChC,IAAI,IAAI,KAAK,SAAS,IAAI,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC;YAAE,SAAS;QACnD,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;QACf,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IACnB,CAAC;IACD,OAAO,KAAK,CAAC;AACf,CAAC;AAED;;;;;;;;;;;;GAYG;AACH,MAAM,UAAU,gBAAgB,CAC9B,IAAY,EACZ,MAAwC;IAExC,IAAI,QAAQ,GAAG,IAAI,CAAC;IACpB,KAAK,IAAI,IAAI,GAAG,CAAC,EAAE,IAAI,GAAG,UAAU,EAAE,IAAI,EAAE,EAAE,CAAC;QAC7C,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC;YAAE,MAAM;QACtC,MAAM,IAAI,GAAG,WAAW,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAC;QAC3C,IAAI,IAAI,KAAK,QAAQ;YAAE,MAAM;QAC7B,QAAQ,GAAG,IAAI,CAAC;IAClB,CAAC;IACD,OAAO,QAAQ,CAAC;AAClB,CAAC;AAED;;;;;GAKG;AACH,SAAS,WAAW,CAClB,IAAY,EACZ,MAAwC;IAExC,IAAI,OAAO,GAAG,EAAE,CAAC;IACjB,IAAI,IAAI,GAAG,CAAC,CAAC;IACb,KAAK,MAAM,KAAK,IAAI,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,EAAE,CAAC;QAC9C,MAAM,EAAE,IAAI,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC,MAAM,IAAI,EAAE,CAAC;QAC9C,MAAM,KAAK,GAAG,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,CAAC;QACpE,OAAO,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;QACzC,OAAO;YACL,KAAK,KAAK,SAAS,IAAI,KAAK,KAAK,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,QAAQ,IAAI,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;QACvE,IAAI,GAAG,KAAK,CAAC,KAAK,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC;IACvC,CAAC;IACD,OAAO,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;AACpC,CAAC"}

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

@@ -0,0 +1,39 @@
+/**
+ * Saving a figure that is on the page, named by the box it is mounted in.
+ *
+ * Which of the two formats a reader wants is not a question the figure can
+ * answer for them: an SVG is the one to put in a paper, where it stays sharp
+ * at any size and can still be edited, and a PNG is the one every chat window,
+ * slide deck and issue tracker actually accepts. So both are offered, and the
+ * resolution goes with the second.
+ */
+import type { FigureSvgOptions } from './figureSvg.ts';
+/** Which file a figure is saved as. */
+export type FigureFormat = 'svg' | 'png';
+/** How a figure is saved. */
+export interface DownloadFigureOptions extends FigureSvgOptions {
+    /**
+     * Which file to write.
+     * @default 'png'
+     */
+    format?: FigureFormat;
+    /**
+     * How many pixels are painted per pixel on screen. An SVG ignores it: it
+     * carries no resolution of its own.
+     * @default 2
+     */
+    scale?: number;
+    /**
+     * What the saved file is called, without its extension.
+     * @default 'figure'
+     */
+    fileName?: string;
+}
+/**
+ * Save the figure mounted in that box.
+ * @param target - The `id` of the box, or the element itself.
+ * @param options - See {@link DownloadFigureOptions}.
+ * @throws {Error} When the box holds no figure, or the browser cannot paint it.
+ */
+export declare function downloadFigure(target: string | Element, options?: DownloadFigureOptions): Promise<void>;
+//# sourceMappingURL=downloadFigure.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"downloadFigure.d.ts","sourceRoot":"","sources":["../../../src/download/core/downloadFigure.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAKH,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAIvD,uCAAuC;AACvC,MAAM,MAAM,YAAY,GAAG,KAAK,GAAG,KAAK,CAAC;AAEzC,6BAA6B;AAC7B,MAAM,WAAW,qBAAsB,SAAQ,gBAAgB;IAC7D;;;OAGG;IACH,MAAM,CAAC,EAAE,YAAY,CAAC;IACtB;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAKD;;;;;GAKG;AACH,wBAAsB,cAAc,CAClC,MAAM,EAAE,MAAM,GAAG,OAAO,EACxB,OAAO,GAAE,qBAA0B,GAClC,OAAO,CAAC,IAAI,CAAC,CAaf"}

package/lib/download/core/downloadFigure.js

@@ -0,0 +1,35 @@
+/**
+ * Saving a figure that is on the page, named by the box it is mounted in.
+ *
+ * Which of the two formats a reader wants is not a question the figure can
+ * answer for them: an SVG is the one to put in a paper, where it stays sharp
+ * at any size and can still be edited, and a PNG is the one every chat window,
+ * slide deck and issue tracker actually accepts. So both are offered, and the
+ * resolution goes with the second.
+ */
+import { downloadBlob } from "./downloadBlob.js";
+import { figurePng } from "./figurePng.js";
+import { DEFAULT_FIGURE_SCALE } from "./figureScale.js";
+import { FIGURE_SVG_TYPE, figureSvg } from "./figureSvg.js";
+import { sanitizeFileName } from "./sanitizeFileName.js";
+/** What a figure is called when the caller does not say. */
+const DEFAULT_FILE_NAME = 'figure';
+/**
+ * Save the figure mounted in that box.
+ * @param target - The `id` of the box, or the element itself.
+ * @param options - See {@link DownloadFigureOptions}.
+ * @throws {Error} When the box holds no figure, or the browser cannot paint it.
+ */
+export async function downloadFigure(target, options = {}) {
+    const { format = 'png', scale = DEFAULT_FIGURE_SCALE } = options;
+    const { fileName = DEFAULT_FILE_NAME, background } = options;
+    const figure = figureSvg(target, { background });
+    const name = sanitizeFileName(fileName, DEFAULT_FILE_NAME);
+    if (format === 'svg') {
+        const blob = new Blob([figure.markup], { type: FIGURE_SVG_TYPE });
+        downloadBlob(blob, `${name}.svg`);
+        return;
+    }
+    downloadBlob(await figurePng(figure, scale), `${name}.png`);
+}
+//# sourceMappingURL=downloadFigure.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"downloadFigure.js","sourceRoot":"","sources":["../../../src/download/core/downloadFigure.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC3C,OAAO,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAExD,OAAO,EAAE,eAAe,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC5D,OAAO,EAAE,gBAAgB,EAAE,MAAM,uBAAuB,CAAC;AAyBzD,4DAA4D;AAC5D,MAAM,iBAAiB,GAAG,QAAQ,CAAC;AAEnC;;;;;GAKG;AACH,MAAM,CAAC,KAAK,UAAU,cAAc,CAClC,MAAwB,EACxB,UAAiC,EAAE;IAEnC,MAAM,EAAE,MAAM,GAAG,KAAK,EAAE,KAAK,GAAG,oBAAoB,EAAE,GAAG,OAAO,CAAC;IACjE,MAAM,EAAE,QAAQ,GAAG,iBAAiB,EAAE,UAAU,EAAE,GAAG,OAAO,CAAC;IAE7D,MAAM,MAAM,GAAG,SAAS,CAAC,MAAM,EAAE,EAAE,UAAU,EAAE,CAAC,CAAC;IACjD,MAAM,IAAI,GAAG,gBAAgB,CAAC,QAAQ,EAAE,iBAAiB,CAAC,CAAC;IAE3D,IAAI,MAAM,KAAK,KAAK,EAAE,CAAC;QACrB,MAAM,IAAI,GAAG,IAAI,IAAI,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,EAAE,IAAI,EAAE,eAAe,EAAE,CAAC,CAAC;QAClE,YAAY,CAAC,IAAI,EAAE,GAAG,IAAI,MAAM,CAAC,CAAC;QAClC,OAAO;IACT,CAAC;IACD,YAAY,CAAC,MAAM,SAAS,CAAC,MAAM,EAAE,KAAK,CAAC,EAAE,GAAG,IAAI,MAAM,CAAC,CAAC;AAC9D,CAAC"}

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

@@ -0,0 +1,21 @@
+/**
+ * A figure painted into pixels, at whatever resolution the reader asked for.
+ *
+ * The picture is drawn once as an SVG and then rasterized from it, rather than
+ * being drawn a second time into a canvas: a figure that is saved has to be
+ * the figure that was read, and two drawing paths are two things to keep in
+ * step. Scaling is the browser's own, so a figure saved at three times is
+ * genuinely three times the detail rather than a stretched screenshot.
+ */
+import type { FigureSvg } from './figureSvg.ts';
+/** What a saved raster figure is. */
+export declare const FIGURE_PNG_TYPE = "image/png";
+/**
+ * The figure as a PNG.
+ * @param figure - The figure, already copied off the page.
+ * @param scale - How many pixels are painted per pixel on screen.
+ * @returns The image.
+ * @throws {Error} When the browser cannot paint or encode it.
+ */
+export declare function figurePng(figure: FigureSvg, scale?: number): Promise<Blob>;
+//# sourceMappingURL=figurePng.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"figurePng.d.ts","sourceRoot":"","sources":["../../../src/download/core/figurePng.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAGH,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAGhD,qCAAqC;AACrC,eAAO,MAAM,eAAe,cAAc,CAAC;AAE3C;;;;;;GAMG;AACH,wBAAsB,SAAS,CAC7B,MAAM,EAAE,SAAS,EACjB,KAAK,GAAE,MAA6B,GACnC,OAAO,CAAC,IAAI,CAAC,CAcf"}

package/lib/download/core/figurePng.js

@@ -0,0 +1,76 @@
+/**
+ * A figure painted into pixels, at whatever resolution the reader asked for.
+ *
+ * The picture is drawn once as an SVG and then rasterized from it, rather than
+ * being drawn a second time into a canvas: a figure that is saved has to be
+ * the figure that was read, and two drawing paths are two things to keep in
+ * step. Scaling is the browser's own, so a figure saved at three times is
+ * genuinely three times the detail rather than a stretched screenshot.
+ */
+import { DEFAULT_FIGURE_SCALE, figurePixels } from "./figureScale.js";
+import { FIGURE_SVG_TYPE } from "./figureSvg.js";
+/** What a saved raster figure is. */
+export const FIGURE_PNG_TYPE = 'image/png';
+/**
+ * The figure as a PNG.
+ * @param figure - The figure, already copied off the page.
+ * @param scale - How many pixels are painted per pixel on screen.
+ * @returns The image.
+ * @throws {Error} When the browser cannot paint or encode it.
+ */
+export async function figurePng(figure, scale = DEFAULT_FIGURE_SCALE) {
+    const pixels = figurePixels(figure, scale);
+    const drawing = await loadFigure(figure);
+    const canvas = document.createElement('canvas');
+    canvas.width = pixels.width;
+    canvas.height = pixels.height;
+    const context = canvas.getContext('2d');
+    if (context === null) {
+        throw new Error('This browser cannot paint the figure into an image.');
+    }
+    context.drawImage(drawing, 0, 0, pixels.width, pixels.height);
+    return encode(canvas);
+}
+/**
+ * The SVG document, decoded and ready to be painted.
+ *
+ * It goes through an object URL rather than a `data:` one because a figure of
+ * a few thousand dots runs to hundreds of kilobytes, and a `data:` URL that
+ * long is refused outright by some browsers.
+ * @param figure - The figure, already copied off the page.
+ * @returns The decoded image.
+ */
+async function loadFigure(figure) {
+    const url = URL.createObjectURL(new Blob([figure.markup], { type: FIGURE_SVG_TYPE }));
+    try {
+        const image = new Image(figure.width, figure.height);
+        await new Promise((resolve, reject) => {
+            image.addEventListener('load', () => resolve());
+            image.addEventListener('error', () => {
+                reject(new Error('The figure could not be read back as an image.'));
+            });
+            image.src = url;
+        });
+        return image;
+    }
+    finally {
+        URL.revokeObjectURL(url);
+    }
+}
+/**
+ * The painted canvas, as a file.
+ * @param canvas - The canvas the figure was painted into.
+ * @returns The image.
+ */
+function encode(canvas) {
+    return new Promise((resolve, reject) => {
+        canvas.toBlob((blob) => {
+            if (blob === null) {
+                reject(new Error('The figure could not be encoded as a PNG.'));
+                return;
+            }
+            resolve(blob);
+        }, FIGURE_PNG_TYPE);
+    });
+}
+//# sourceMappingURL=figurePng.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"figurePng.js","sourceRoot":"","sources":["../../../src/download/core/figurePng.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,OAAO,EAAE,oBAAoB,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAEtE,OAAO,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAEjD,qCAAqC;AACrC,MAAM,CAAC,MAAM,eAAe,GAAG,WAAW,CAAC;AAE3C;;;;;;GAMG;AACH,MAAM,CAAC,KAAK,UAAU,SAAS,CAC7B,MAAiB,EACjB,QAAgB,oBAAoB;IAEpC,MAAM,MAAM,GAAG,YAAY,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;IAC3C,MAAM,OAAO,GAAG,MAAM,UAAU,CAAC,MAAM,CAAC,CAAC;IAEzC,MAAM,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;IAChD,MAAM,CAAC,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC;IAC5B,MAAM,CAAC,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC;IAC9B,MAAM,OAAO,GAAG,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;IACxC,IAAI,OAAO,KAAK,IAAI,EAAE,CAAC;QACrB,MAAM,IAAI,KAAK,CAAC,qDAAqD,CAAC,CAAC;IACzE,CAAC;IACD,OAAO,CAAC,SAAS,CAAC,OAAO,EAAE,CAAC,EAAE,CAAC,EAAE,MAAM,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;IAE9D,OAAO,MAAM,CAAC,MAAM,CAAC,CAAC;AACxB,CAAC;AAED;;;;;;;;GAQG;AACH,KAAK,UAAU,UAAU,CAAC,MAAiB;IACzC,MAAM,GAAG,GAAG,GAAG,CAAC,eAAe,CAC7B,IAAI,IAAI,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,EAAE,IAAI,EAAE,eAAe,EAAE,CAAC,CACrD,CAAC;IACF,IAAI,CAAC;QACH,MAAM,KAAK,GAAG,IAAI,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;QACrD,MAAM,IAAI,OAAO,CAAO,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;YAC1C,KAAK,CAAC,gBAAgB,CAAC,MAAM,EAAE,GAAG,EAAE,CAAC,OAAO,EAAE,CAAC,CAAC;YAChD,KAAK,CAAC,gBAAgB,CAAC,OAAO,EAAE,GAAG,EAAE;gBACnC,MAAM,CAAC,IAAI,KAAK,CAAC,gDAAgD,CAAC,CAAC,CAAC;YACtE,CAAC,CAAC,CAAC;YACH,KAAK,CAAC,GAAG,GAAG,GAAG,CAAC;QAClB,CAAC,CAAC,CAAC;QACH,OAAO,KAAK,CAAC;IACf,CAAC;YAAS,CAAC;QACT,GAAG,CAAC,eAAe,CAAC,GAAG,CAAC,CAAC;IAC3B,CAAC;AACH,CAAC;AAED;;;;GAIG;AACH,SAAS,MAAM,CAAC,MAAyB;IACvC,OAAO,IAAI,OAAO,CAAO,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;QAC3C,MAAM,CAAC,MAAM,CAAC,CAAC,IAAI,EAAE,EAAE;YACrB,IAAI,IAAI,KAAK,IAAI,EAAE,CAAC;gBAClB,MAAM,CAAC,IAAI,KAAK,CAAC,2CAA2C,CAAC,CAAC,CAAC;gBAC/D,OAAO;YACT,CAAC;YACD,OAAO,CAAC,IAAI,CAAC,CAAC;QAChB,CAAC,EAAE,eAAe,CAAC,CAAC;IACtB,CAAC,CAAC,CAAC;AACL,CAAC"}

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

@@ -0,0 +1,61 @@
+/**
+ * How large a figure is saved.
+ *
+ * The resolution is offered as a multiple of the figure on screen rather than
+ * as a pixel width, because the multiple is the part a reader has an opinion
+ * about — one for a note, two for a slide, three or four for print — while the
+ * pixel count is the consequence, and is written out beside it so nobody has
+ * to work it out.
+ */
+/** The size of a saved figure, in pixels. */
+export interface FigurePixels {
+    /** Its width. */
+    width: number;
+    /** Its height. */
+    height: number;
+}
+/** The multiples offered, from the figure as drawn to print resolution. */
+export declare const FIGURE_SCALES: readonly number[];
+/**
+ * The multiple a figure is saved at unless the reader says otherwise.
+ *
+ * Two rather than one: a figure saved at the size it was drawn looks soft on
+ * every screen that is not the one it was drawn on, and a slide is where most
+ * of these files end up.
+ */
+export declare const DEFAULT_FIGURE_SCALE = 2;
+/**
+ * The longest side a browser will paint into one canvas.
+ *
+ * Past it the canvas is silently blank rather than refused, which is the worst
+ * of both — so a multiple that would cross it is offered greyed rather than
+ * left to fail after the reader has pressed save.
+ */
+export declare const FIGURE_MAX_PIXELS = 16384;
+/**
+ * How big the saved file is, at this multiple.
+ * @param size - The figure as it is drawn on the page.
+ * @param scale - The multiple it is saved at.
+ * @returns The size in pixels, whole numbers.
+ */
+export declare function figurePixels(size: FigurePixels, scale: number): FigurePixels;
+/**
+ * Whether a browser can actually paint the figure at this multiple.
+ * @param size - The figure as it is drawn on the page.
+ * @param scale - The multiple it would be saved at.
+ * @returns Whether the file would come out.
+ */
+export declare function figureScaleFits(size: FigurePixels, scale: number): boolean;
+/**
+ * What a multiple reads on a button: `2×`.
+ * @param scale - The multiple.
+ * @returns Its label.
+ */
+export declare function figureScaleLabel(scale: number): string;
+/**
+ * What a size reads in a sentence: `1280 × 920 pixels`.
+ * @param pixels - The size of the saved file.
+ * @returns The measurement, written out.
+ */
+export declare function formatFigurePixels(pixels: FigurePixels): string;
+//# sourceMappingURL=figureScale.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"figureScale.d.ts","sourceRoot":"","sources":["../../../src/download/core/figureScale.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAEH,6CAA6C;AAC7C,MAAM,WAAW,YAAY;IAC3B,iBAAiB;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,kBAAkB;IAClB,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,2EAA2E;AAC3E,eAAO,MAAM,aAAa,EAAE,SAAS,MAAM,EAAiB,CAAC;AAE7D;;;;;;GAMG;AACH,eAAO,MAAM,oBAAoB,IAAI,CAAC;AAEtC;;;;;;GAMG;AACH,eAAO,MAAM,iBAAiB,QAAQ,CAAC;AAEvC;;;;;GAKG;AACH,wBAAgB,YAAY,CAAC,IAAI,EAAE,YAAY,EAAE,KAAK,EAAE,MAAM,GAAG,YAAY,CAM5E;AAED;;;;;GAKG;AACH,wBAAgB,eAAe,CAAC,IAAI,EAAE,YAAY,EAAE,KAAK,EAAE,MAAM,GAAG,OAAO,CAK1E;AAED;;;;GAIG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,CAEtD;AAED;;;;GAIG;AACH,wBAAgB,kBAAkB,CAAC,MAAM,EAAE,YAAY,GAAG,MAAM,CAE/D"}

package/lib/download/core/figureScale.js

@@ -0,0 +1,67 @@
+/**
+ * How large a figure is saved.
+ *
+ * The resolution is offered as a multiple of the figure on screen rather than
+ * as a pixel width, because the multiple is the part a reader has an opinion
+ * about — one for a note, two for a slide, three or four for print — while the
+ * pixel count is the consequence, and is written out beside it so nobody has
+ * to work it out.
+ */
+/** The multiples offered, from the figure as drawn to print resolution. */
+export const FIGURE_SCALES = [1, 2, 3, 4];
+/**
+ * The multiple a figure is saved at unless the reader says otherwise.
+ *
+ * Two rather than one: a figure saved at the size it was drawn looks soft on
+ * every screen that is not the one it was drawn on, and a slide is where most
+ * of these files end up.
+ */
+export const DEFAULT_FIGURE_SCALE = 2;
+/**
+ * The longest side a browser will paint into one canvas.
+ *
+ * Past it the canvas is silently blank rather than refused, which is the worst
+ * of both — so a multiple that would cross it is offered greyed rather than
+ * left to fail after the reader has pressed save.
+ */
+export const FIGURE_MAX_PIXELS = 16384;
+/**
+ * How big the saved file is, at this multiple.
+ * @param size - The figure as it is drawn on the page.
+ * @param scale - The multiple it is saved at.
+ * @returns The size in pixels, whole numbers.
+ */
+export function figurePixels(size, scale) {
+    const factor = Number.isFinite(scale) && scale > 0 ? scale : 1;
+    return {
+        width: Math.max(1, Math.round(size.width * factor)),
+        height: Math.max(1, Math.round(size.height * factor)),
+    };
+}
+/**
+ * Whether a browser can actually paint the figure at this multiple.
+ * @param size - The figure as it is drawn on the page.
+ * @param scale - The multiple it would be saved at.
+ * @returns Whether the file would come out.
+ */
+export function figureScaleFits(size, scale) {
+    const pixels = figurePixels(size, scale);
+    return (pixels.width <= FIGURE_MAX_PIXELS && pixels.height <= FIGURE_MAX_PIXELS);
+}
+/**
+ * What a multiple reads on a button: `2×`.
+ * @param scale - The multiple.
+ * @returns Its label.
+ */
+export function figureScaleLabel(scale) {
+    return `${scale}×`;
+}
+/**
+ * What a size reads in a sentence: `1280 × 920 pixels`.
+ * @param pixels - The size of the saved file.
+ * @returns The measurement, written out.
+ */
+export function formatFigurePixels(pixels) {
+    return `${pixels.width} × ${pixels.height} pixels`;
+}
+//# sourceMappingURL=figureScale.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"figureScale.js","sourceRoot":"","sources":["../../../src/download/core/figureScale.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAUH,2EAA2E;AAC3E,MAAM,CAAC,MAAM,aAAa,GAAsB,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;AAE7D;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,CAAC;AAEtC;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,KAAK,CAAC;AAEvC;;;;;GAKG;AACH,MAAM,UAAU,YAAY,CAAC,IAAkB,EAAE,KAAa;IAC5D,MAAM,MAAM,GAAG,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAI,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;IAC/D,OAAO;QACL,KAAK,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,GAAG,MAAM,CAAC,CAAC;QACnD,MAAM,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,GAAG,MAAM,CAAC,CAAC;KACtD,CAAC;AACJ,CAAC;AAED;;;;;GAKG;AACH,MAAM,UAAU,eAAe,CAAC,IAAkB,EAAE,KAAa;IAC/D,MAAM,MAAM,GAAG,YAAY,CAAC,IAAI,EAAE,KAAK,CAAC,CAAC;IACzC,OAAO,CACL,MAAM,CAAC,KAAK,IAAI,iBAAiB,IAAI,MAAM,CAAC,MAAM,IAAI,iBAAiB,CACxE,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,UAAU,gBAAgB,CAAC,KAAa;IAC5C,OAAO,GAAG,KAAK,GAAG,CAAC;AACrB,CAAC;AAED;;;;GAIG;AACH,MAAM,UAAU,kBAAkB,CAAC,MAAoB;IACrD,OAAO,GAAG,MAAM,CAAC,KAAK,MAAM,MAAM,CAAC,MAAM,SAAS,CAAC;AACrD,CAAC"}

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

@@ -0,0 +1,37 @@
+/**
+ * A figure on the page, copied into a file that stands on its own.
+ *
+ * Two things have to travel with it. The tokens it is drawn from, which are
+ * declared by the site and not by the figure, so a `var()` that leaves the
+ * page resolves to nothing. And the type, which a chart inherits from the page
+ * around it and would otherwise be reset to whatever opens the file.
+ */
+/** How the figure is copied. */
+export interface FigureSvgOptions {
+    /**
+     * What is painted under it. `transparent` leaves it unpainted, which is what
+     * a figure being dropped onto a coloured slide wants.
+     * @default the surface the figure is drawn on, which is the page's own
+     */
+    background?: string;
+}
+/** A figure, as the file that leaves the page. */
+export interface FigureSvg {
+    /** The whole SVG document, tokens resolved. */
+    markup: string;
+    /** Its width in pixels, at the size the figure was drawn. */
+    width: number;
+    /** Its height. */
+    height: number;
+}
+/** What a saved SVG figure is, for the file and for the renderer reading it. */
+export declare const FIGURE_SVG_TYPE = "image/svg+xml;charset=utf-8";
+/**
+ * The figure as a standalone SVG document.
+ * @param target - The `id` of the box the figure is mounted in, or the element.
+ * @param options - See {@link FigureSvgOptions}.
+ * @returns See {@link FigureSvg}.
+ * @throws {Error} When the box holds no drawing to save.
+ */
+export declare function figureSvg(target: string | Element, options?: FigureSvgOptions): FigureSvg;
+//# sourceMappingURL=figureSvg.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"figureSvg.d.ts","sourceRoot":"","sources":["../../../src/download/core/figureSvg.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAOH,gCAAgC;AAChC,MAAM,WAAW,gBAAgB;IAC/B;;;;OAIG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED,kDAAkD;AAClD,MAAM,WAAW,SAAS;IACxB,+CAA+C;IAC/C,MAAM,EAAE,MAAM,CAAC;IACf,6DAA6D;IAC7D,KAAK,EAAE,MAAM,CAAC;IACd,kBAAkB;IAClB,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,gFAAgF;AAChF,eAAO,MAAM,eAAe,gCAAgC,CAAC;AAQ7D;;;;;;GAMG;AACH,wBAAgB,SAAS,CACvB,MAAM,EAAE,MAAM,GAAG,OAAO,EACxB,OAAO,GAAE,gBAAqB,GAC7B,SAAS,CAgCX"}

package/lib/download/core/figureSvg.js

@@ -0,0 +1,94 @@
+/**
+ * A figure on the page, copied into a file that stands on its own.
+ *
+ * Two things have to travel with it. The tokens it is drawn from, which are
+ * declared by the site and not by the figure, so a `var()` that leaves the
+ * page resolves to nothing. And the type, which a chart inherits from the page
+ * around it and would otherwise be reset to whatever opens the file.
+ */
+import { cssTokenNames, resolveCssTokens } from "./cssTokens.js";
+import { figureSvgDocument } from "./figureSvgDocument.js";
+import { figureBounds, figureDrawings, figureElement } from "./figureTarget.js";
+/** What a saved SVG figure is, for the file and for the renderer reading it. */
+export const FIGURE_SVG_TYPE = 'image/svg+xml;charset=utf-8';
+/** The token a figure's own ground is named by. */
+const SURFACE_TOKEN = '--surface';
+/** What a figure is painted on where the site has declared nothing. */
+const FALLBACK_SURFACE = '#ffffff';
+/**
+ * The figure as a standalone SVG document.
+ * @param target - The `id` of the box the figure is mounted in, or the element.
+ * @param options - See {@link FigureSvgOptions}.
+ * @returns See {@link FigureSvg}.
+ * @throws {Error} When the box holds no drawing to save.
+ */
+export function figureSvg(target, options = {}) {
+    const element = figureElement(target);
+    const drawings = figureDrawings(element);
+    if (drawings.length === 0) {
+        throw new Error('That part of the page holds no figure to save.');
+    }
+    const bounds = figureBounds(drawings);
+    const pieces = [];
+    for (const drawing of drawings) {
+        const box = drawing.getBoundingClientRect();
+        pieces.push({
+            markup: drawingMarkup(drawing),
+            x: box.left - bounds.left,
+            y: box.top - bounds.top,
+        });
+    }
+    const styles = window.getComputedStyle(element);
+    const markup = figureSvgDocument(pieces, {
+        width: bounds.width,
+        height: bounds.height,
+        background: options.background ?? surfaceOf(styles),
+        fontFamily: styles.fontFamily,
+        fontSize: Number.parseFloat(styles.fontSize),
+    });
+    return {
+        markup,
+        width: Math.round(bounds.width),
+        height: Math.round(bounds.height),
+    };
+}
+/**
+ * One drawing, serialized with every token it names written out.
+ *
+ * The copy is taken first and read from the original, because the values are a
+ * property of where the figure sits on the page: a detached clone inherits
+ * nothing and would resolve every token to an empty string.
+ * @param drawing - The drawing, as it sits on the page.
+ * @returns Its markup.
+ */
+function drawingMarkup(drawing) {
+    const clone = drawing.cloneNode(true);
+    const markup = new XMLSerializer().serializeToString(clone);
+    return resolveCssTokens(markup, tokenValues(drawing, cssTokenNames(markup)));
+}
+/**
+ * What each token the markup names is worth where the figure is drawn.
+ * @param drawing - The drawing, as it sits on the page.
+ * @param names - The tokens it asks for.
+ * @returns The values, keyed by token name.
+ */
+function tokenValues(drawing, names) {
+    const values = {};
+    if (names.length === 0)
+        return values;
+    const styles = window.getComputedStyle(drawing);
+    for (const name of names) {
+        values[name] = styles.getPropertyValue(name);
+    }
+    return values;
+}
+/**
+ * The ground the figure is standing on.
+ * @param styles - The computed style of the box it is mounted in.
+ * @returns The colour to paint under it.
+ */
+function surfaceOf(styles) {
+    const surface = styles.getPropertyValue(SURFACE_TOKEN).trim();
+    return surface === '' ? FALLBACK_SURFACE : surface;
+}
+//# sourceMappingURL=figureSvg.js.map

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

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