react-cheminfo 0.33.0 → 0.35.0

package/src/periodic/ui/PeriodicTable.tsx

@@ -10,7 +10,12 @@
  * a site's own richer element record never has to cross into this component.
  */
 
-import type { CSSProperties, KeyboardEvent, ReactElement } from 'react';
+import type {
+  CSSProperties,
+  KeyboardEvent,
+  ReactElement,
+  ReactNode,
+} from 'react';
 import { useEffect, useRef } from 'react';
 
 import type { Swatch } from '../../color/core/interpolate.ts';
@@ -20,6 +25,7 @@ import type { PeriodicElement } from '../core/elements.ts';
 import type { ElementRange } from '../core/layout.ts';
 import {
   COLUMN_COUNT,
+  EMPTY_BLOCK,
   elementByArrowKey,
   placedElements,
 } from '../core/layout.ts';
@@ -66,6 +72,17 @@ export interface PeriodicTableProps {
    * @default every element is
    */
   isIncluded?: (element: PeriodicElement) => boolean;
+  /**
+   * What is written in the block the table leaves empty — columns 3 to 12 of
+   * the first three periods, in the middle of the top edge. A tool that reads
+   * one element off the table puts what it says about it there, where the eye
+   * already is, rather than under the grid.
+   *
+   * It is sized against the table, like everything else in the grid, so give
+   * it type in `em` and it scales with the drawing.
+   * @default undefined — the block stays empty
+   */
+  inset?: ReactNode;
   /**
    * Whether to draw the group and period strips.
    * @default false
@@ -119,6 +136,7 @@ export function PeriodicTable(props: PeriodicTableProps): ReactElement {
     detailOf,
     nameOf = defaultNameOf,
     isIncluded,
+    inset,
     headers = false,
     onSelectRange,
     legend = false,
@@ -129,7 +147,6 @@ export function PeriodicTable(props: PeriodicTableProps): ReactElement {
   } = props;
 
   const t = useChromeT();
-  const writesDetail = detailOf !== undefined;
   const gridRef = useRef<HTMLDivElement>(null);
   const cameFromKeyRef = useRef(false);
   const offset = headers ? 1 : 0;
@@ -160,10 +177,13 @@ export function PeriodicTable(props: PeriodicTableProps): ReactElement {
         role="grid"
         aria-label={t('periodic.table')}
         data-testid="periodic-table"
-        style={gridStyle(headers, writesDetail)}
+        style={gridStyle(headers)}
         onKeyDown={handleKeyDown}
       >
         {headers ? <HeaderStrips onSelectRange={onSelectRange} /> : null}
+        {inset === undefined ? null : (
+          <div style={insetStyle(offset)}>{inset}</div>
+        )}
         {markers ? <InnerTransitionMarkers offset={offset} /> : null}
         {placedElements().map(({ element, cell }) => (
           <ElementCell
@@ -172,7 +192,6 @@ export function PeriodicTable(props: PeriodicTableProps): ReactElement {
             symbol={element.symbol}
             name={nameOf(element)}
             detail={detailOf?.(element)}
-            writesDetail={writesDetail}
             swatch={swatchOf(element)}
             isSelected={element.symbol === selected}
             isIncluded={isIncluded?.(element)}
@@ -188,6 +207,30 @@ export function PeriodicTable(props: PeriodicTableProps): ReactElement {
   );
 }
 
+/**
+ * Where what the caller writes in the empty block is placed.
+ * @param offset - 1 when the table draws its header strips, 0 otherwise.
+ * @returns The style of the slot.
+ */
+function insetStyle(offset: number): CSSProperties {
+  return {
+    alignItems: 'center',
+    display: 'flex',
+    // A column of air on each side, so the writing reads as sitting in the
+    // block rather than as running into the cells beside it.
+    padding: '0 2.4cqw',
+    gridColumn: `${String(EMPTY_BLOCK.column + offset)} / span ${String(EMPTY_BLOCK.columnSpan)}`,
+    gridRow: `${String(EMPTY_BLOCK.row + offset)} / span ${String(EMPTY_BLOCK.rowSpan)}`,
+    // A share of the table, with a floor, exactly as a cell sizes its symbol:
+    // the block holds the same three rows at every width, so what is written
+    // in it has to shrink with them.
+    fontSize: 'max(0.6rem, 1.8cqw)',
+    lineHeight: 1.35,
+    minWidth: 0,
+    overflow: 'hidden',
+  };
+}
+
 function defaultSwatchOf(element: PeriodicElement): Swatch {
   return categorySwatch(element.category);
 }
@@ -207,14 +250,13 @@ const MIN_WIDTH = 280;
 /**
  * How tall one row of elements is, as a share of the table's width.
  *
- * A column is about 5.4% of that width, so a cell is a seventh taller than it
- * is wide — the proportion of a wall chart, and the room the three lines of a
- * cell need to be written at a size a class can read.
+ * A column is about 5.2% of that width, so a cell is a third taller than it is
+ * wide — the proportion of a wall chart, and the room the three bands of a
+ * cell need to be read from the back of a room. It is the same height in every
+ * table: a cell keeps the band it writes a value in whether or not that table
+ * writes one.
  */
-const ROW_HEIGHT = '6.1cqw';
-
-/** The same, in a table that writes nothing under the symbol. */
-const ROW_HEIGHT_ALONE = '4.9cqw';
+const ROW_HEIGHT = '6.8cqw';
 
 /** The band the two inner-transition series were lifted out across. */
 const SERIES_GAP = 'max(6px, 1.1cqw)';
@@ -241,14 +283,11 @@ const baseGridStyle = {
  * The grid the cells are placed on.
  * @param headers - Whether a leading column and row hold the period and group
  * numbers.
- * @param writesDetail - Whether a cell writes a third line, which is what a
- * row is tall enough for.
  * @returns The style of the grid.
  */
-function gridStyle(headers: boolean, writesDetail: boolean): CSSProperties {
-  const row = writesDetail ? ROW_HEIGHT : ROW_HEIGHT_ALONE;
+function gridStyle(headers: boolean): CSSProperties {
   // The eighth row is the gap the inner-transition series are lifted out into.
-  const rows = `repeat(7, ${row}) ${SERIES_GAP} repeat(2, ${row})`;
+  const rows = `repeat(7, ${ROW_HEIGHT}) ${SERIES_GAP} repeat(2, ${ROW_HEIGHT})`;
   if (!headers) {
     return {
       ...baseGridStyle,

package/src/ui.ts

@@ -1,4 +1,5 @@
 export * from './about/ui/index.ts';
+export * from './axis/ui/index.ts';
 export * from './capsule/ui/index.ts';
 export * from './chart/ui/index.ts';
 export * from './chrome/ui/index.ts';

package/styles/chrome.css

@@ -570,6 +570,77 @@ select,
   }
 }
 
+/* ── Help ────────────────────────────────────────────────────────────────── */
+
+/*
+  Every piece of help in the family opens as the same card, so a reader who has
+  met one on one site has met them all: the page's own surface, its border, its
+  radius and its shadow. Blueprint's navy slab is a hole in a light page, and
+  its 14px body turns an explanation into a wall — the same words at 12.5px
+  over 1.55 read as prose.
+*/
+.help-tooltip .bp6-popover-content {
+  /*
+    One measure for every card, so two opened in a row are the same shape.
+    Left to itself the popover is shrink-wrapped around its own longest line.
+  */
+  width: 300px;
+  padding: 10px 12px;
+  border: 1px solid var(--border);
+  border-radius: var(--radius);
+  background: var(--surface);
+  box-shadow: none;
+  color: var(--text);
+  font-size: 12.5px;
+  line-height: 1.55;
+  text-wrap: pretty;
+}
+
+/*
+  Blueprint opens a tooltip by transitioning it from `scale(0.8)`, and under
+  React 19 that transition is created but never ticks: it sits at time zero for
+  as long as the card is open, so the card and its type stay at four fifths of
+  the size they were drawn at. Help opens without an animation instead.
+*/
+.help-tooltip.bp6-tooltip {
+  border-radius: var(--radius);
+  box-shadow: var(--shadow-md);
+  transform: scale(1);
+  transition: none;
+}
+
+/* The arrow is a corner of the same card, so it carries the same two colours. */
+.help-tooltip .bp6-popover-arrow-fill {
+  fill: var(--surface);
+}
+
+.help-tooltip .bp6-popover-arrow-border {
+  fill: var(--border);
+  fill-opacity: 1;
+}
+
+.help-tooltip .bp6-popover-arrow::before {
+  box-shadow: none;
+}
+
+.help-tooltip .help-body a {
+  color: var(--accent);
+}
+
+/*
+  The glyph that opens it. How it sits in its row is the site's business — it
+  follows a label on one and a heading on another — so only its ink is set
+  here.
+*/
+.help-icon {
+  color: var(--text-faint);
+  cursor: help;
+}
+
+.help-icon:hover {
+  color: var(--accent);
+}
+
 /* ── Printing ────────────────────────────────────────────────────────────── */
 
 /* Students print the cheatsheet. Let them, without the chrome. */

package/lib/about/core/repository.d.ts

@@ -1,14 +0,0 @@
-/**
- * What can be linked to inside a repository, and when.
- *
- * Only GitHub has the addresses the About page builds — a release tag, a
- * commit — and only a repository a visitor can open is worth pointing them at.
- */
-/**
- * The sources as a base a release or a commit can be appended to.
- * @param repository - Where the sources live.
- * @returns The address without its trailing slash, or `undefined` when it is
- * not a GitHub repository and nothing inside it can be addressed.
- */
-export declare function githubSources(repository: string): string | undefined;
-//# sourceMappingURL=repository.d.ts.map

package/lib/about/core/repository.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"repository.d.ts","sourceRoot":"","sources":["../../../src/about/core/repository.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAKH;;;;;GAKG;AACH,wBAAgB,aAAa,CAAC,UAAU,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,CAKpE"}

package/lib/about/core/repository.js

@@ -1,21 +0,0 @@
-/**
- * What can be linked to inside a repository, and when.
- *
- * Only GitHub has the addresses the About page builds — a release tag, a
- * commit — and only a repository a visitor can open is worth pointing them at.
- */
-/** Where our repositories live, and the only host whose paths we know. */
-const GITHUB = 'https://github.com/';
-/**
- * The sources as a base a release or a commit can be appended to.
- * @param repository - Where the sources live.
- * @returns The address without its trailing slash, or `undefined` when it is
- * not a GitHub repository and nothing inside it can be addressed.
- */
-export function githubSources(repository) {
-    const sources = repository.endsWith('/')
-        ? repository.slice(0, -1)
-        : repository;
-    return sources.startsWith(GITHUB) ? sources : undefined;
-}
-//# sourceMappingURL=repository.js.map

package/lib/about/core/repository.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"repository.js","sourceRoot":"","sources":["../../../src/about/core/repository.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,0EAA0E;AAC1E,MAAM,MAAM,GAAG,qBAAqB,CAAC;AAErC;;;;;GAKG;AACH,MAAM,UAAU,aAAa,CAAC,UAAkB;IAC9C,MAAM,OAAO,GAAG,UAAU,CAAC,QAAQ,CAAC,GAAG,CAAC;QACtC,CAAC,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;QACzB,CAAC,CAAC,UAAU,CAAC;IACf,OAAO,OAAO,CAAC,UAAU,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC;AAC1D,CAAC"}

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

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

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

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

package/lib/download/core/exportStyles.js

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

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

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

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

@@ -1,88 +0,0 @@
-/** How big a picture is written out, as a multiple of the size it is drawn at. */
-export interface ImageResolution {
-    /** Identifies the resolution in a picker. */
-    id: string;
-    /** What the option reads. */
-    label: string;
-    /** How many pixels each drawing unit becomes. */
-    scale: number;
-}
-/**
- * The sizes a picture leaves the editor at.
- *
- * A drawing unit is about a screen pixel, so the multipliers read as what the
- * picture is for rather than as numbers: what is on screen, the same again on a
- * retina display, and the two steps up a figure needs to survive being printed
- * or thrown on a wall.
- */
-export declare const IMAGE_RESOLUTIONS: readonly [{
-    readonly id: "screen";
-    readonly label: "Screen (1×)";
-    readonly scale: 1;
-}, {
-    readonly id: "retina";
-    readonly label: "Retina (2×)";
-    readonly scale: 2;
-}, {
-    readonly id: "print";
-    readonly label: "Print (4×)";
-    readonly scale: 4;
-}, {
-    readonly id: "poster";
-    readonly label: "Poster (8×)";
-    readonly scale: 8;
-}];
-/** One of the resolutions offered. */
-export type ImageResolutionId = (typeof IMAGE_RESOLUTIONS)[number]['id'];
-/**
- * The resolution a picture is written out at unless another is picked: what is
- * on screen, doubled, which is what a picture pasted into a document wants.
- */
-export declare const DEFAULT_IMAGE_RESOLUTION: {
-    readonly id: "retina";
-    readonly label: "Retina (2×)";
-    readonly scale: 2;
-};
-/** How big a picture comes out, in pixels. */
-export interface ImageSize {
-    /** Width of the picture, in pixels. */
-    width: number;
-    /** Height of the picture, in pixels. */
-    height: number;
-    /**
-     * What each drawing unit was actually worth. Below the resolution that was
-     * asked for when it would have made a picture too big to rasterize.
-     */
-    scale: number;
-}
-/**
- * How big a rectangle of the drawing comes out at a given resolution.
- *
- * The resolution is a wish rather than an instruction: a wide glycan asked for
- * at 8× would run past what a browser can rasterize and come back blank, so the
- * scale is brought down until the picture fits instead. The scale it settled on
- * comes back with the size, so what will actually be written can be shown
- * before it is.
- * @param box - The rectangle being written out.
- * @param box.width - How wide it is, in drawing units.
- * @param box.height - How tall it is, in drawing units.
- * @param scale - How many pixels each drawing unit should become.
- * @returns The size, and the scale it was reached at.
- */
-export declare function imageSize(box: {
-    width: number;
-    height: number;
-}, scale: number): ImageSize;
-/**
- * The resolution an identifier stands for.
- * @param id - What was picked.
- * @returns The resolution, falling back to the default one.
- */
-export declare function imageResolution(id: string): ImageResolution;
-/**
- * A size, written the way it is shown next to the resolution it comes from.
- * @param size - The size to write, `null` when nothing is drawn.
- * @returns The text, e.g. `1440 × 620 px`.
- */
-export declare function formatImageSize(size: ImageSize | null): string;
-//# sourceMappingURL=imageResolution.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"imageResolution.d.ts","sourceRoot":"","sources":["../../../src/download/core/imageResolution.ts"],"names":[],"mappings":"AAAA,kFAAkF;AAClF,MAAM,WAAW,eAAe;IAC9B,6CAA6C;IAC7C,EAAE,EAAE,MAAM,CAAC;IACX,6BAA6B;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,iDAAiD;IACjD,KAAK,EAAE,MAAM,CAAC;CACf;AAED;;;;;;;GAOG;AACH,eAAO,MAAM,iBAAiB;;;;;;;;;;;;;;;;EAKiB,CAAC;AAEhD,sCAAsC;AACtC,MAAM,MAAM,iBAAiB,GAAG,CAAC,OAAO,iBAAiB,CAAC,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,CAAC;AAEzE;;;GAGG;AACH,eAAO,MAAM,wBAAwB;;;;CAAuB,CAAC;AAa7D,8CAA8C;AAC9C,MAAM,WAAW,SAAS;IACxB,uCAAuC;IACvC,KAAK,EAAE,MAAM,CAAC;IACd,wCAAwC;IACxC,MAAM,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAC;CACf;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,SAAS,CACvB,GAAG,EAAE;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,EACtC,KAAK,EAAE,MAAM,GACZ,SAAS,CAoBX;AAED;;;;GAIG;AACH,wBAAgB,eAAe,CAAC,EAAE,EAAE,MAAM,GAAG,eAAe,CAK3D;AAED;;;;GAIG;AACH,wBAAgB,eAAe,CAAC,IAAI,EAAE,SAAS,GAAG,IAAI,GAAG,MAAM,CAG9D"}

package/lib/download/core/imageResolution.js

@@ -1,77 +0,0 @@
-/**
- * The sizes a picture leaves the editor at.
- *
- * A drawing unit is about a screen pixel, so the multipliers read as what the
- * picture is for rather than as numbers: what is on screen, the same again on a
- * retina display, and the two steps up a figure needs to survive being printed
- * or thrown on a wall.
- */
-export const IMAGE_RESOLUTIONS = [
-    { id: 'screen', label: 'Screen (1×)', scale: 1 },
-    { id: 'retina', label: 'Retina (2×)', scale: 2 },
-    { id: 'print', label: 'Print (4×)', scale: 4 },
-    { id: 'poster', label: 'Poster (8×)', scale: 8 },
-];
-/**
- * The resolution a picture is written out at unless another is picked: what is
- * on screen, doubled, which is what a picture pasted into a document wants.
- */
-export const DEFAULT_IMAGE_RESOLUTION = IMAGE_RESOLUTIONS[1];
-/**
- * Longest side a browser rasterizes reliably.
- *
- * Above roughly this, Safari and Chrome quietly hand back an empty canvas
- * instead of refusing, so the picture would be saved blank.
- */
-const MAXIMUM_SIDE = 8192;
-/** Most pixels a rasterized picture is allowed to hold. */
-const MAXIMUM_PIXELS = 32 * 1024 * 1024;
-/**
- * How big a rectangle of the drawing comes out at a given resolution.
- *
- * The resolution is a wish rather than an instruction: a wide glycan asked for
- * at 8× would run past what a browser can rasterize and come back blank, so the
- * scale is brought down until the picture fits instead. The scale it settled on
- * comes back with the size, so what will actually be written can be shown
- * before it is.
- * @param box - The rectangle being written out.
- * @param box.width - How wide it is, in drawing units.
- * @param box.height - How tall it is, in drawing units.
- * @param scale - How many pixels each drawing unit should become.
- * @returns The size, and the scale it was reached at.
- */
-export function imageSize(box, scale) {
-    const wanted = Number.isFinite(scale) && scale > 0 ? scale : 1;
-    const width = Math.max(box.width, 1);
-    const height = Math.max(box.height, 1);
-    const limit = Math.min(MAXIMUM_SIDE / width, MAXIMUM_SIDE / height, Math.sqrt(MAXIMUM_PIXELS / (width * height)));
-    const used = Math.min(wanted, limit);
-    // A picture held back by the limit is rounded down rather than to the nearest
-    // pixel, so rounding cannot put it back over what it was held to.
-    const toPixels = used < wanted ? Math.floor : Math.round;
-    return {
-        width: Math.max(1, toPixels(width * used)),
-        height: Math.max(1, toPixels(height * used)),
-        scale: used,
-    };
-}
-/**
- * The resolution an identifier stands for.
- * @param id - What was picked.
- * @returns The resolution, falling back to the default one.
- */
-export function imageResolution(id) {
-    return (IMAGE_RESOLUTIONS.find((resolution) => resolution.id === id) ??
-        DEFAULT_IMAGE_RESOLUTION);
-}
-/**
- * A size, written the way it is shown next to the resolution it comes from.
- * @param size - The size to write, `null` when nothing is drawn.
- * @returns The text, e.g. `1440 × 620 px`.
- */
-export function formatImageSize(size) {
-    if (!size)
-        return 'nothing to export';
-    return `${size.width} × ${size.height} px`;
-}
-//# sourceMappingURL=imageResolution.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"imageResolution.js","sourceRoot":"","sources":["../../../src/download/core/imageResolution.ts"],"names":[],"mappings":"AAUA;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG;IAC/B,EAAE,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,CAAC,EAAE;IAChD,EAAE,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,CAAC,EAAE;IAChD,EAAE,EAAE,EAAE,OAAO,EAAE,KAAK,EAAE,YAAY,EAAE,KAAK,EAAE,CAAC,EAAE;IAC9C,EAAE,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,CAAC,EAAE;CACH,CAAC;AAKhD;;;GAGG;AACH,MAAM,CAAC,MAAM,wBAAwB,GAAG,iBAAiB,CAAC,CAAC,CAAC,CAAC;AAE7D;;;;;GAKG;AACH,MAAM,YAAY,GAAG,IAAI,CAAC;AAE1B,2DAA2D;AAC3D,MAAM,cAAc,GAAG,EAAE,GAAG,IAAI,GAAG,IAAI,CAAC;AAexC;;;;;;;;;;;;;GAaG;AACH,MAAM,UAAU,SAAS,CACvB,GAAsC,EACtC,KAAa;IAEb,MAAM,MAAM,GAAG,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAI,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;IAC/D,MAAM,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;IACrC,MAAM,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC;IAEvC,MAAM,KAAK,GAAG,IAAI,CAAC,GAAG,CACpB,YAAY,GAAG,KAAK,EACpB,YAAY,GAAG,MAAM,EACrB,IAAI,CAAC,IAAI,CAAC,cAAc,GAAG,CAAC,KAAK,GAAG,MAAM,CAAC,CAAC,CAC7C,CAAC;IACF,MAAM,IAAI,GAAG,IAAI,CAAC,GAAG,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;IACrC,8EAA8E;IAC9E,kEAAkE;IAClE,MAAM,QAAQ,GAAG,IAAI,GAAG,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC;IAEzD,OAAO;QACL,KAAK,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,QAAQ,CAAC,KAAK,GAAG,IAAI,CAAC,CAAC;QAC1C,MAAM,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,QAAQ,CAAC,MAAM,GAAG,IAAI,CAAC,CAAC;QAC5C,KAAK,EAAE,IAAI;KACZ,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,UAAU,eAAe,CAAC,EAAU;IACxC,OAAO,CACL,iBAAiB,CAAC,IAAI,CAAC,CAAC,UAAU,EAAE,EAAE,CAAC,UAAU,CAAC,EAAE,KAAK,EAAE,CAAC;QAC5D,wBAAwB,CACzB,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,MAAM,UAAU,eAAe,CAAC,IAAsB;IACpD,IAAI,CAAC,IAAI;QAAE,OAAO,mBAAmB,CAAC;IACtC,OAAO,GAAG,IAAI,CAAC,KAAK,MAAM,IAAI,CAAC,MAAM,KAAK,CAAC;AAC7C,CAAC"}

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

@@ -1,93 +0,0 @@
-import type { ImageSize } from './imageResolution.ts';
-/**
- * Room left around a drawing in a written-out picture, in drawing units.
- *
- * Enough that a name written under the bottom of the drawing, and the stroke
- * around its outermost mark, are inside the picture rather than against its
- * edge.
- */
-export declare const PICTURE_PADDING = 12;
-/**
- * What the picture is of: the drawing, or the element it is drawn in.
- *
- * `content` measures the drawing and ignores the canvas around it, which is
- * what a drawing surface wants — it is mostly empty space, panned and zoomed to
- * wherever it was last left, and none of that belongs in a file. `element`
- * takes the element as it is laid out, which is what a chart wants: its axes
- * are drawn to the box it was given, so the box *is* the picture and measuring
- * the marks inside it would crop the frame to wherever the data happens to
- * reach.
- */
-export type PictureFrame = 'content' | 'element';
-export interface PictureOptions {
-    /**
-     * How many pixels each drawing unit becomes.
-     * @default 2
-     */
-    scale?: number;
-    /**
-     * The name saved files take, without their extension.
-     * @default 'picture'
-     */
-    filename?: string;
-    /**
-     * What the picture is read out as, in place of the instructions the element
-     * carries for whoever is working it.
-     * @default 'Drawing'
-     */
-    label?: string;
-    /**
-     * What the picture is of.
-     * @default 'content'
-     */
-    frame?: PictureFrame;
-    /**
-     * Room left around the drawing, in drawing units. Ignored when the picture is
-     * the element, which is already the size it wants to be.
-     * @default PICTURE_PADDING
-     */
-    padding?: number;
-}
-/**
- * How big the drawing comes out at a resolution, before it is written out.
- *
- * What is measured is what the picture will be of rather than whatever is on
- * screen, so the answer does not change when the window is resized or the
- * drawing panned — the size shown next to the resolution is the size of the
- * file that is about to be written.
- * @param svg - The element, as it is rendered.
- * @param scale - How many pixels each drawing unit becomes.
- * @param options - What the picture is of.
- * @returns The size, or `null` when nothing is drawn.
- */
-export declare function pictureSize(svg: SVGSVGElement | null, scale: number, options?: Pick<PictureOptions, 'frame' | 'padding'>): ImageSize | null;
-/**
- * Put the drawing on the clipboard as a PNG.
- *
- * The rasterization is handed to the clipboard as a promise rather than awaited
- * first: Safari only allows a clipboard write the click itself started.
- * @param svg - The element, as it is rendered.
- * @param options - How big to make it.
- * @returns Whether it was copied. `false` when nothing is drawn, and in a
- *   browser whose clipboard takes text only.
- */
-export declare function copyPicture(svg: SVGSVGElement | null, options?: PictureOptions): Promise<boolean>;
-/**
- * Save the drawing as a PNG.
- * @param svg - The element, as it is rendered.
- * @param options - How big to make it, and what to call it.
- * @returns Whether it was saved. `false` when nothing is drawn.
- */
-export declare function savePngPicture(svg: SVGSVGElement | null, options?: PictureOptions): Promise<boolean>;
-/**
- * Save the drawing as an SVG.
- *
- * The resolution is carried into the file as the size it opens at, but the
- * shapes stay shapes: an SVG printed at any size is drawn again rather than
- * enlarged, which is the reason to prefer it wherever it can go.
- * @param svg - The element, as it is rendered.
- * @param options - How big to make it, and what to call it.
- * @returns Whether it was saved. `false` when nothing is drawn.
- */
-export declare function saveSvgPicture(svg: SVGSVGElement | null, options?: PictureOptions): boolean;
-//# sourceMappingURL=pictureExport.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"pictureExport.d.ts","sourceRoot":"","sources":["../../../src/download/core/pictureExport.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAOtD;;;;;;GAMG;AACH,eAAO,MAAM,eAAe,KAAK,CAAC;AAElC;;;;;;;;;;GAUG;AACH,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,SAAS,CAAC;AAEjD,MAAM,WAAW,cAAc;IAC7B;;;OAGG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;OAGG;IACH,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB;;;;OAIG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,WAAW,CACzB,GAAG,EAAE,aAAa,GAAG,IAAI,EACzB,KAAK,EAAE,MAAM,EACb,OAAO,GAAE,IAAI,CAAC,cAAc,EAAE,OAAO,GAAG,SAAS,CAAM,GACtD,SAAS,GAAG,IAAI,CAGlB;AAED;;;;;;;;;GASG;AACH,wBAAsB,WAAW,CAC/B,GAAG,EAAE,aAAa,GAAG,IAAI,EACzB,OAAO,GAAE,cAAmB,GAC3B,OAAO,CAAC,OAAO,CAAC,CAIlB;AAED;;;;;GAKG;AACH,wBAAsB,cAAc,CAClC,GAAG,EAAE,aAAa,GAAG,IAAI,EACzB,OAAO,GAAE,cAAmB,GAC3B,OAAO,CAAC,OAAO,CAAC,CAKlB;AAED;;;;;;;;;GASG;AACH,wBAAgB,cAAc,CAC5B,GAAG,EAAE,aAAa,GAAG,IAAI,EACzB,OAAO,GAAE,cAAmB,GAC3B,OAAO,CAST"}