react-cheminfo 0.8.0 → 0.10.0

package/lib/overlay/core/overlayTierRoom.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"overlayTierRoom.d.ts","sourceRoot":"","sources":["../../../src/overlay/core/overlayTierRoom.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAE1D,4EAA4E;AAC5E,MAAM,WAAW,kBAAkB;IACjC;;;;OAIG;IACH,GAAG,EAAE,MAAM,CAAC;IACZ,0DAA0D;IAC1D,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,iEAAiE;AACjE,MAAM,WAAW,eAAe;IAC9B,kEAAkE;IAClE,IAAI,EAAE,SAAS,MAAM,EAAE,CAAC;IACxB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IAC9B,kEAAkE;IAClE,QAAQ,EAAE,SAAS,kBAAkB,EAAE,CAAC;IACxC;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED;;;;;GAKG;AACH,wBAAgB,iBAAiB,CAC/B,MAAM,EAAE,SAAS,MAAM,EAAE,EACzB,OAAO,EAAE,cAAc,GACtB,MAAM,CAQR;AAED;;;;;;GAMG;AACH,wBAAgB,oBAAoB,CAClC,QAAQ,EAAE,SAAS,kBAAkB,EAAE,EACvC,QAAQ,EAAE,OAAO,EACjB,OAAO,EAAE,cAAc,GACtB,MAAM,CAYR;AAED;;;;;;;;;GASG;AACH,wBAAgB,eAAe,CAC7B,QAAQ,EAAE,SAAS,kBAAkB,EAAE,EACvC,OAAO,EAAE,cAAc,GACtB,MAAM,CAeR;AAED;;;;;;;;GAQG;AACH,wBAAgB,gBAAgB,CAC9B,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,cAAc,GACtB,MAAM,CAIR"}

package/lib/overlay/core/overlayTierRoom.js

@@ -0,0 +1,135 @@
+/**
+ * What a bar of controls is holding, and how much room each part of it needs.
+ *
+ * Every width here is an estimate of laid-out type rather than a measurement.
+ * Measuring the real labels would mean putting them in the document and
+ * reading their boxes back, which costs a layout pass on every render of every
+ * embedded figure on the page — and the answer would still arrive one frame
+ * after the width that prompted it. The estimate is deliberately generous: a
+ * bar that folds a word early costs the reader a caret, while one that folds
+ * late runs its controls off the edge of the figure.
+ *
+ * The geometry is restated here rather than read off the styles that draw it,
+ * because those styles are React's and this has to answer on a server, before
+ * anything exists to measure. Being an estimate is the point — it is allowed
+ * to be a few pixels out, and it is not allowed to need a browser.
+ */
+/**
+ * The tab strip, sunken track and all.
+ * @param labels - What each tab reads.
+ * @param metrics - The measurements the bar is drawn from.
+ * @returns The width in pixels; `0` where there is no strip at all.
+ */
+export function overlayStripWidth(labels, metrics) {
+    if (labels.length === 0)
+        return 0;
+    const segment = 2 * (metrics.paddingX + 2) + OVERLAY_TRACK_PADDING;
+    let total = OVERLAY_TRACK_PADDING * 2;
+    for (const label of labels) {
+        total += overlayTextWidth(label, metrics) + segment;
+    }
+    return total;
+}
+/**
+ * The settings, each written as a value button of its own.
+ * @param settings - What the bar holds at its far end.
+ * @param withKeys - Whether each value still carries its key word.
+ * @param metrics - The measurements the bar is drawn from.
+ * @returns The width in pixels, the gaps between the buttons included.
+ */
+export function overlaySettingsWidth(settings, withKeys, metrics) {
+    let total = 0;
+    for (let index = 0; index < settings.length; index++) {
+        const setting = settings[index];
+        if (setting === undefined)
+            continue;
+        const written = withKeys
+            ? `${setting.key} ${setting.value}`
+            : setting.value;
+        total += controlWidth(written, setting.swatches === true, metrics);
+        if (index > 0)
+            total += metrics.gap;
+    }
+    return total;
+}
+/**
+ * Every setting gathered into one chip.
+ *
+ * What the chip saves is one button's worth of padding and one caret per
+ * setting it swallows — never the words themselves, which are the whole reason
+ * the reader is given a chip rather than a cog.
+ * @param settings - What the bar holds at its far end.
+ * @param metrics - The measurements the bar is drawn from.
+ * @returns The width in pixels.
+ */
+export function overlayChipRoom(settings, metrics) {
+    let written = '';
+    let swatches = false;
+    let separators = 0;
+    for (let index = 0; index < settings.length; index++) {
+        const setting = settings[index];
+        if (setting === undefined)
+            continue;
+        written += setting.value;
+        if (setting.swatches === true)
+            swatches = true;
+        if (index > 0)
+            separators++;
+    }
+    return (controlWidth(written, swatches, metrics) +
+        separators * OVERLAY_CHIP_SEPARATOR);
+}
+/**
+ * The bare glyphs at the very end of the bar, with the bar's own padding.
+ *
+ * One extra gap is counted for the space between the two ends of the row,
+ * which is what a bar spanning the figure pushes its ends apart with.
+ * @param glyphs - How many bare glyphs ride at the end.
+ * @param metrics - The measurements the bar is drawn from.
+ * @returns The width in pixels.
+ */
+export function overlayTailWidth(glyphs, metrics) {
+    const count = Number.isFinite(glyphs) ? Math.max(0, Math.floor(glyphs)) : 0;
+    const buttons = count * (metrics.buttonSize + metrics.gap);
+    return buttons + 2 * metrics.paddingX + metrics.gap;
+}
+/**
+ * The room a run of words takes.
+ * @param text - The words.
+ * @param metrics - The measurements the bar is drawn from.
+ * @returns The width in pixels.
+ */
+function overlayTextWidth(text, metrics) {
+    return text.length * metrics.fontSize * OVERLAY_CHARACTER_RATIO;
+}
+/**
+ * What one character of a label takes, as a fraction of the type size.
+ *
+ * A mixed-case interface sans averages a little over half its size per
+ * character. This sits above that average on purpose: the labels that decide a
+ * fold are the long ones, and a long label of wide letters is the case where
+ * being wrong runs the row off the figure rather than merely folding it early.
+ */
+const OVERLAY_CHARACTER_RATIO = 0.58;
+/** The band of sunken track showing around a segment, on every side. */
+const OVERLAY_TRACK_PADDING = 2;
+/** How many colours the swatch glyph draws before the last becomes a count. */
+const OVERLAY_SWATCH_DOTS = 4;
+/** What sits between two settings inside a chip, hairline and margins. */
+const OVERLAY_CHIP_SEPARATOR = 9;
+/**
+ * One button carrying words, a caret, and possibly a row of colours.
+ * @param written - The words on it.
+ * @param swatches - Whether the figure's colours ride in front of them.
+ * @param metrics - The measurements the bar is drawn from.
+ * @returns The width in pixels, never under the button's own floor.
+ */
+function controlWidth(written, swatches, metrics) {
+    const dot = Math.max(4, Math.round(metrics.buttonSize / 6));
+    const glyph = swatches
+        ? OVERLAY_SWATCH_DOTS * dot + (OVERLAY_SWATCH_DOTS - 1) * 2 + 4
+        : 0;
+    const room = 2 * metrics.paddingX + metrics.fontSize;
+    return Math.max(metrics.buttonSize, overlayTextWidth(written, metrics) + glyph + room);
+}
+//# sourceMappingURL=overlayTierRoom.js.map

package/lib/overlay/core/overlayTierRoom.js.map

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

package/lib/overlay/core/overlayTiers.d.ts

@@ -0,0 +1,71 @@
+/**
+ * How much of itself a bar of controls writes, at the width it actually has.
+ *
+ * An embedded figure has no idea how wide the page around it is; it only knows
+ * its own box, which is why this answers from a measured component width and
+ * why there is no media query anywhere in the domain. A figure four hundred
+ * pixels wide in a wide page and the same figure filling a phone are the same
+ * problem, and a rule written against the viewport gets one of the two wrong.
+ *
+ * The ladder never *hides* a control. Each rung writes less of one: the key
+ * word in front of a value goes, then the long form of a tab label, then the
+ * settings gather into a single chip that still reads the configuration. That
+ * chip is the point of the whole ladder — a cog tells the reader nothing about
+ * how the figure is drawn, where `Species · 95%` answers the question they
+ * actually have without being opened at all.
+ */
+import type { OverlayMetrics } from './overlayMetrics.ts';
+import type { OverlayTierRoom } from './overlayTierRoom.ts';
+/**
+ * How much of itself a bar writes.
+ *
+ * `full` writes every word. `condensed` drops the key word in front of each
+ * setting's value. `short` shortens the tab labels with it. `chip` gathers
+ * every setting into one chip that still reads the configuration. `tiny` keeps
+ * that chip and lets the tab strip scroll rather than shrink any further, so
+ * the strip is never clipped down to a row of initials.
+ */
+export type OverlayTier = 'full' | 'condensed' | 'short' | 'chip' | 'tiny';
+/** The width each rung of the ladder needs, in pixels. */
+export interface OverlayTierWidths {
+    /** Every word: full tab labels, and a key word in front of every value. */
+    full: number;
+    /** Full tab labels, values written without their key words. */
+    condensed: number;
+    /** Short tab labels, values written without their key words. */
+    short: number;
+    /** Short tab labels, every setting gathered into one chip. */
+    chip: number;
+}
+/**
+ * Which rung of the ladder a bar holding this content is on at this width.
+ *
+ * An unmeasured bar — a width of zero, which is what a component reports
+ * before its first layout and what a server render always reports — is given
+ * the roomiest tier. Folded is the answer that costs the reader something, so
+ * it is never the answer given on a guess; a bar that opened folded and sprang
+ * open a frame later would flicker on every page that embeds the figure.
+ * @param width - Width of the bar itself, in pixels, never of the page.
+ * @param room - See {@link OverlayTierRoom}.
+ * @param metrics - The measurements the bar is drawn from.
+ * @returns The tier.
+ */
+export declare function overlayTier(width: number, room: OverlayTierRoom, metrics: OverlayMetrics): OverlayTier;
+/**
+ * The width each rung needs, for this content at these measurements.
+ *
+ * Nothing here is a number a caller has to know: a viewer with two tabs stays
+ * roomy far longer than one with six, and a site that has translated the tab
+ * names has changed exactly these widths. That is why the content goes in and
+ * the thresholds come out, rather than the other way round.
+ *
+ * The rungs are forced to descend even where the writing saves nothing — a bar
+ * holding one setting has a chip exactly as wide as the value button it
+ * replaces — because a lower rung asking for more room than the rung above it
+ * would step the bar *down* into a tier that does not fit.
+ * @param room - See {@link OverlayTierRoom}.
+ * @param metrics - The measurements the bar is drawn from.
+ * @returns See {@link OverlayTierWidths}.
+ */
+export declare function overlayTierWidths(room: OverlayTierRoom, metrics: OverlayMetrics): OverlayTierWidths;
+//# sourceMappingURL=overlayTiers.d.ts.map

package/lib/overlay/core/overlayTiers.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"overlayTiers.d.ts","sourceRoot":"","sources":["../../../src/overlay/core/overlayTiers.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAEH,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAC1D,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAQ5D;;;;;;;;GAQG;AACH,MAAM,MAAM,WAAW,GAAG,MAAM,GAAG,WAAW,GAAG,OAAO,GAAG,MAAM,GAAG,MAAM,CAAC;AAE3E,0DAA0D;AAC1D,MAAM,WAAW,iBAAiB;IAChC,2EAA2E;IAC3E,IAAI,EAAE,MAAM,CAAC;IACb,+DAA+D;IAC/D,SAAS,EAAE,MAAM,CAAC;IAClB,gEAAgE;IAChE,KAAK,EAAE,MAAM,CAAC;IACd,8DAA8D;IAC9D,IAAI,EAAE,MAAM,CAAC;CACd;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,WAAW,CACzB,KAAK,EAAE,MAAM,EACb,IAAI,EAAE,eAAe,EACrB,OAAO,EAAE,cAAc,GACtB,WAAW,CAQb;AAED;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,iBAAiB,CAC/B,IAAI,EAAE,eAAe,EACrB,OAAO,EAAE,cAAc,GACtB,iBAAiB,CAgBnB"}

package/lib/overlay/core/overlayTiers.js

@@ -0,0 +1,89 @@
+/**
+ * How much of itself a bar of controls writes, at the width it actually has.
+ *
+ * An embedded figure has no idea how wide the page around it is; it only knows
+ * its own box, which is why this answers from a measured component width and
+ * why there is no media query anywhere in the domain. A figure four hundred
+ * pixels wide in a wide page and the same figure filling a phone are the same
+ * problem, and a rule written against the viewport gets one of the two wrong.
+ *
+ * The ladder never *hides* a control. Each rung writes less of one: the key
+ * word in front of a value goes, then the long form of a tab label, then the
+ * settings gather into a single chip that still reads the configuration. That
+ * chip is the point of the whole ladder — a cog tells the reader nothing about
+ * how the figure is drawn, where `Species · 95%` answers the question they
+ * actually have without being opened at all.
+ */
+import { overlayChipRoom, overlaySettingsWidth, overlayStripWidth, overlayTailWidth, } from "./overlayTierRoom.js";
+/**
+ * Which rung of the ladder a bar holding this content is on at this width.
+ *
+ * An unmeasured bar — a width of zero, which is what a component reports
+ * before its first layout and what a server render always reports — is given
+ * the roomiest tier. Folded is the answer that costs the reader something, so
+ * it is never the answer given on a guess; a bar that opened folded and sprang
+ * open a frame later would flicker on every page that embeds the figure.
+ * @param width - Width of the bar itself, in pixels, never of the page.
+ * @param room - See {@link OverlayTierRoom}.
+ * @param metrics - The measurements the bar is drawn from.
+ * @returns The tier.
+ */
+export function overlayTier(width, room, metrics) {
+    if (!Number.isFinite(width) || width <= 0)
+        return 'full';
+    const widths = overlayTierWidths(room, metrics);
+    if (width >= widths.full)
+        return 'full';
+    if (width >= widths.condensed)
+        return 'condensed';
+    if (width >= widths.short)
+        return 'short';
+    if (width >= widths.chip)
+        return 'chip';
+    return 'tiny';
+}
+/**
+ * The width each rung needs, for this content at these measurements.
+ *
+ * Nothing here is a number a caller has to know: a viewer with two tabs stays
+ * roomy far longer than one with six, and a site that has translated the tab
+ * names has changed exactly these widths. That is why the content goes in and
+ * the thresholds come out, rather than the other way round.
+ *
+ * The rungs are forced to descend even where the writing saves nothing — a bar
+ * holding one setting has a chip exactly as wide as the value button it
+ * replaces — because a lower rung asking for more room than the rung above it
+ * would step the bar *down* into a tier that does not fit.
+ * @param room - See {@link OverlayTierRoom}.
+ * @param metrics - The measurements the bar is drawn from.
+ * @returns See {@link OverlayTierWidths}.
+ */
+export function overlayTierWidths(room, metrics) {
+    const { tabs, shortTabs = tabs, settings, glyphs = 2 } = room;
+    const long = overlayStripWidth(tabs, metrics);
+    const brief = overlayStripWidth(shortened(tabs, shortTabs), metrics);
+    const tail = overlayTailWidth(glyphs, metrics);
+    const keyed = overlaySettingsWidth(settings, true, metrics);
+    const bare = overlaySettingsWidth(settings, false, metrics);
+    const full = long + keyed + tail;
+    const condensed = Math.min(full, long + bare + tail);
+    const short = Math.min(condensed, brief + bare + tail);
+    const chip = Math.min(short, brief + overlayChipRoom(settings, metrics) + tail);
+    return { full, condensed, short, chip };
+}
+/**
+ * The tab labels as they read once shortened.
+ * @param tabs - What each tab reads in full.
+ * @param shortTabs - The short forms, in the same order.
+ * @returns The labels to lay out.
+ */
+function shortened(tabs, shortTabs) {
+    if (shortTabs === tabs)
+        return tabs;
+    const labels = [];
+    for (let index = 0; index < tabs.length; index++) {
+        labels.push(shortTabs[index] ?? tabs[index] ?? '');
+    }
+    return labels;
+}
+//# sourceMappingURL=overlayTiers.js.map

package/lib/overlay/core/overlayTiers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"overlayTiers.js","sourceRoot":"","sources":["../../../src/overlay/core/overlayTiers.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;GAeG;AAIH,OAAO,EACL,eAAe,EACf,oBAAoB,EACpB,iBAAiB,EACjB,gBAAgB,GACjB,MAAM,sBAAsB,CAAC;AAyB9B;;;;;;;;;;;;GAYG;AACH,MAAM,UAAU,WAAW,CACzB,KAAa,EACb,IAAqB,EACrB,OAAuB;IAEvB,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAI,KAAK,IAAI,CAAC;QAAE,OAAO,MAAM,CAAC;IACzD,MAAM,MAAM,GAAG,iBAAiB,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;IAChD,IAAI,KAAK,IAAI,MAAM,CAAC,IAAI;QAAE,OAAO,MAAM,CAAC;IACxC,IAAI,KAAK,IAAI,MAAM,CAAC,SAAS;QAAE,OAAO,WAAW,CAAC;IAClD,IAAI,KAAK,IAAI,MAAM,CAAC,KAAK;QAAE,OAAO,OAAO,CAAC;IAC1C,IAAI,KAAK,IAAI,MAAM,CAAC,IAAI;QAAE,OAAO,MAAM,CAAC;IACxC,OAAO,MAAM,CAAC;AAChB,CAAC;AAED;;;;;;;;;;;;;;;GAeG;AACH,MAAM,UAAU,iBAAiB,CAC/B,IAAqB,EACrB,OAAuB;IAEvB,MAAM,EAAE,IAAI,EAAE,SAAS,GAAG,IAAI,EAAE,QAAQ,EAAE,MAAM,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC;IAC9D,MAAM,IAAI,GAAG,iBAAiB,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;IAC9C,MAAM,KAAK,GAAG,iBAAiB,CAAC,SAAS,CAAC,IAAI,EAAE,SAAS,CAAC,EAAE,OAAO,CAAC,CAAC;IACrE,MAAM,IAAI,GAAG,gBAAgB,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC/C,MAAM,KAAK,GAAG,oBAAoB,CAAC,QAAQ,EAAE,IAAI,EAAE,OAAO,CAAC,CAAC;IAC5D,MAAM,IAAI,GAAG,oBAAoB,CAAC,QAAQ,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC;IAE5D,MAAM,IAAI,GAAG,IAAI,GAAG,KAAK,GAAG,IAAI,CAAC;IACjC,MAAM,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC,CAAC;IACrD,MAAM,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,SAAS,EAAE,KAAK,GAAG,IAAI,GAAG,IAAI,CAAC,CAAC;IACvD,MAAM,IAAI,GAAG,IAAI,CAAC,GAAG,CACnB,KAAK,EACL,KAAK,GAAG,eAAe,CAAC,QAAQ,EAAE,OAAO,CAAC,GAAG,IAAI,CAClD,CAAC;IACF,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,IAAI,EAAE,CAAC;AAC1C,CAAC;AAED;;;;;GAKG;AACH,SAAS,SAAS,CAChB,IAAuB,EACvB,SAA4B;IAE5B,IAAI,SAAS,KAAK,IAAI;QAAE,OAAO,IAAI,CAAC;IACpC,MAAM,MAAM,GAAa,EAAE,CAAC;IAC5B,KAAK,IAAI,KAAK,GAAG,CAAC,EAAE,KAAK,GAAG,IAAI,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC;QACjD,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,IAAI,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC,CAAC;IACrD,CAAC;IACD,OAAO,MAAM,CAAC;AAChB,CAAC"}

package/lib/overlay/core/placeOverlayCard.d.ts

@@ -0,0 +1,47 @@
+/** What {@link placeOverlayCard} has to know. */
+export interface OverlayCardPlacementOptions {
+    /** Pointer position inside the figure, in pixels from its left. */
+    pointerX: number;
+    /** Pointer position inside the figure, in pixels from its top. */
+    pointerY: number;
+    /** Width of the card, as it was last measured. */
+    cardWidth: number;
+    /** Height of the card, as it was last measured. */
+    cardHeight: number;
+    /** Width of the box the card has to stay inside. */
+    boxWidth: number;
+    /** Height of that box. */
+    boxHeight: number;
+    /**
+     * Gap kept between the pointer and the card, so the card never covers the
+     * mark being read.
+     * @default 14
+     */
+    offset?: number;
+}
+/** Where a pointer-following card goes, and which way round it ended up. */
+export interface OverlayCardPlacement {
+    /** Distance from the box's left edge to the card's left edge. */
+    left: number;
+    /** Distance from the box's top edge to the card's top edge. */
+    top: number;
+    /** Whether the card had to open to the pointer's left. */
+    flippedX: boolean;
+    /** Whether it had to open above the pointer. */
+    flippedY: boolean;
+}
+/**
+ * Place a card down and to the right of the pointer, flipping it to the other
+ * side of whichever axis would push it out of the figure.
+ *
+ * Pure arithmetic on numbers the caller has already measured, so it runs on
+ * every pointer move without touching the DOM: reading the card's size back
+ * from the layout on each move would force a reflow every frame. Flipping
+ * rather than only clamping matters because a card clamped against the right
+ * edge sits under the pointer, and the mark the reader is pointing at is
+ * exactly the one it then hides.
+ * @param options - See {@link OverlayCardPlacementOptions}.
+ * @returns Where to put the card's top left corner.
+ */
+export declare function placeOverlayCard(options: OverlayCardPlacementOptions): OverlayCardPlacement;
+//# sourceMappingURL=placeOverlayCard.d.ts.map

package/lib/overlay/core/placeOverlayCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"placeOverlayCard.d.ts","sourceRoot":"","sources":["../../../src/overlay/core/placeOverlayCard.ts"],"names":[],"mappings":"AAAA,iDAAiD;AACjD,MAAM,WAAW,2BAA2B;IAC1C,mEAAmE;IACnE,QAAQ,EAAE,MAAM,CAAC;IACjB,kEAAkE;IAClE,QAAQ,EAAE,MAAM,CAAC;IACjB,kDAAkD;IAClD,SAAS,EAAE,MAAM,CAAC;IAClB,mDAAmD;IACnD,UAAU,EAAE,MAAM,CAAC;IACnB,oDAAoD;IACpD,QAAQ,EAAE,MAAM,CAAC;IACjB,0BAA0B;IAC1B,SAAS,EAAE,MAAM,CAAC;IAClB;;;;OAIG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,4EAA4E;AAC5E,MAAM,WAAW,oBAAoB;IACnC,iEAAiE;IACjE,IAAI,EAAE,MAAM,CAAC;IACb,+DAA+D;IAC/D,GAAG,EAAE,MAAM,CAAC;IACZ,0DAA0D;IAC1D,QAAQ,EAAE,OAAO,CAAC;IAClB,gDAAgD;IAChD,QAAQ,EAAE,OAAO,CAAC;CACnB;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,gBAAgB,CAC9B,OAAO,EAAE,2BAA2B,GACnC,oBAAoB,CAyBtB"}

package/lib/overlay/core/placeOverlayCard.js

@@ -0,0 +1,42 @@
+/**
+ * Place a card down and to the right of the pointer, flipping it to the other
+ * side of whichever axis would push it out of the figure.
+ *
+ * Pure arithmetic on numbers the caller has already measured, so it runs on
+ * every pointer move without touching the DOM: reading the card's size back
+ * from the layout on each move would force a reflow every frame. Flipping
+ * rather than only clamping matters because a card clamped against the right
+ * edge sits under the pointer, and the mark the reader is pointing at is
+ * exactly the one it then hides.
+ * @param options - See {@link OverlayCardPlacementOptions}.
+ * @returns Where to put the card's top left corner.
+ */
+export function placeOverlayCard(options) {
+    const { pointerX, pointerY, cardWidth, cardHeight, boxWidth, boxHeight, offset = DEFAULT_OFFSET, } = options;
+    const flippedX = pointerX + offset + cardWidth > boxWidth;
+    const flippedY = pointerY + offset + cardHeight > boxHeight;
+    return {
+        left: withinBox(flippedX ? pointerX - offset - cardWidth : pointerX + offset, boxWidth - cardWidth),
+        top: withinBox(flippedY ? pointerY - offset - cardHeight : pointerY + offset, boxHeight - cardHeight),
+        flippedX,
+        flippedY,
+    };
+}
+const DEFAULT_OFFSET = 14;
+/**
+ * The flip alone is not enough when the card is larger than the figure it has
+ * to live in — a fifty pixel sparkline with a full readout beside it — because
+ * both sides then overflow. Clamping the far edge to zero keeps the card's top
+ * left corner on screen, which is where the reader's eye already is, instead of
+ * pushing the whole card past the edge and showing nothing at all.
+ * @param value - The offset the flip arrived at.
+ * @param furthest - The largest offset that still leaves the card inside.
+ * @returns The offset, brought back between zero and that limit.
+ */
+function withinBox(value, furthest) {
+    if (!Number.isFinite(value))
+        return 0;
+    const limit = Number.isFinite(furthest) ? Math.max(0, furthest) : 0;
+    return Math.max(0, Math.min(value, limit));
+}
+//# sourceMappingURL=placeOverlayCard.js.map

package/lib/overlay/core/placeOverlayCard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"placeOverlayCard.js","sourceRoot":"","sources":["../../../src/overlay/core/placeOverlayCard.ts"],"names":[],"mappings":"AAkCA;;;;;;;;;;;;GAYG;AACH,MAAM,UAAU,gBAAgB,CAC9B,OAAoC;IAEpC,MAAM,EACJ,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,UAAU,EACV,QAAQ,EACR,SAAS,EACT,MAAM,GAAG,cAAc,GACxB,GAAG,OAAO,CAAC;IAEZ,MAAM,QAAQ,GAAG,QAAQ,GAAG,MAAM,GAAG,SAAS,GAAG,QAAQ,CAAC;IAC1D,MAAM,QAAQ,GAAG,QAAQ,GAAG,MAAM,GAAG,UAAU,GAAG,SAAS,CAAC;IAC5D,OAAO;QACL,IAAI,EAAE,SAAS,CACb,QAAQ,CAAC,CAAC,CAAC,QAAQ,GAAG,MAAM,GAAG,SAAS,CAAC,CAAC,CAAC,QAAQ,GAAG,MAAM,EAC5D,QAAQ,GAAG,SAAS,CACrB;QACD,GAAG,EAAE,SAAS,CACZ,QAAQ,CAAC,CAAC,CAAC,QAAQ,GAAG,MAAM,GAAG,UAAU,CAAC,CAAC,CAAC,QAAQ,GAAG,MAAM,EAC7D,SAAS,GAAG,UAAU,CACvB;QACD,QAAQ;QACR,QAAQ;KACT,CAAC;AACJ,CAAC;AAED,MAAM,cAAc,GAAG,EAAE,CAAC;AAE1B;;;;;;;;;GASG;AACH,SAAS,SAAS,CAAC,KAAa,EAAE,QAAgB;IAChD,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,KAAK,CAAC;QAAE,OAAO,CAAC,CAAC;IACtC,MAAM,KAAK,GAAG,MAAM,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;IACpE,OAAO,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC;AAC7C,CAAC"}

package/lib/overlay/ui/OverlayAction.d.ts

@@ -0,0 +1,32 @@
+import type { IconName, Intent } from '@blueprintjs/core';
+import type { ReactElement } from 'react';
+import type { OverlayControlProps } from './OverlayRow.tsx';
+/** What {@link OverlayAction} needs. */
+export interface OverlayActionProps extends Omit<OverlayControlProps, 'label' | 'hideLabel'> {
+    /** What the button reads: a verb and its object, `Zoom to selection`. */
+    text: string;
+    /** Called when it is pressed. */
+    onClick: () => void;
+    /**
+     * A glyph before the text. Never instead of it: an icon-only control in a
+     * floating card is a control nobody presses.
+     * @default undefined
+     */
+    icon?: IconName;
+    /**
+     * What the button means, which is not whether it is pressed.
+     * @default 'none'
+     */
+    intent?: Intent;
+}
+/**
+ * The one control here that does something rather than changing something.
+ *
+ * It carries no caption of its own because its words already are one — a verb
+ * and its object — and a caption in front of a button that reads `Zoom to
+ * selection` says the same thing twice in a card that has room for neither.
+ * @param props - See {@link OverlayActionProps}.
+ * @returns The button, with its help.
+ */
+export declare function OverlayAction(props: OverlayActionProps): ReactElement;
+//# sourceMappingURL=OverlayAction.d.ts.map

package/lib/overlay/ui/OverlayAction.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OverlayAction.d.ts","sourceRoot":"","sources":["../../../src/overlay/ui/OverlayAction.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAC;AAC1D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAG1C,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,kBAAkB,CAAC;AAI5D,wCAAwC;AACxC,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAC9C,mBAAmB,EACnB,OAAO,GAAG,WAAW,CACtB;IACC,yEAAyE;IACzE,IAAI,EAAE,MAAM,CAAC;IACb,iCAAiC;IACjC,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB;;;;OAIG;IACH,IAAI,CAAC,EAAE,QAAQ,CAAC;IAChB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED;;;;;;;;GAQG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,GAAG,YAAY,CA0BrE"}

package/lib/overlay/ui/OverlayAction.js

@@ -0,0 +1,19 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Button } from 'react-science/ui';
+import { OverlayRow } from "./OverlayRow.js";
+import { useOverlaySurface } from "./overlaySurface.js";
+/**
+ * The one control here that does something rather than changing something.
+ *
+ * It carries no caption of its own because its words already are one — a verb
+ * and its object — and a caption in front of a button that reads `Zoom to
+ * selection` says the same thing twice in a card that has room for neither.
+ * @param props - See {@link OverlayActionProps}.
+ * @returns The button, with its help.
+ */
+export function OverlayAction(props) {
+    const { text, onClick, icon, intent = 'none', help, disabled = false, testId, } = props;
+    const { metrics } = useOverlaySurface();
+    return (_jsx(OverlayRow, { label: text, help: help, hideLabel: true, disabled: disabled, children: _jsx(Button, { variant: "minimal", size: metrics.blueprintSize, intent: intent, icon: icon, text: text, disabled: disabled, "data-testid": testId, onClick: onClick }) }));
+}
+//# sourceMappingURL=OverlayAction.js.map

package/lib/overlay/ui/OverlayAction.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OverlayAction.js","sourceRoot":"","sources":["../../../src/overlay/ui/OverlayAction.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAC;AAG1C,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAkB,CAAC;AAC9C,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAwBxD;;;;;;;;GAQG;AACH,MAAM,UAAU,aAAa,CAAC,KAAyB;IACrD,MAAM,EACJ,IAAI,EACJ,OAAO,EACP,IAAI,EACJ,MAAM,GAAG,MAAM,EACf,IAAI,EACJ,QAAQ,GAAG,KAAK,EAChB,MAAM,GACP,GAAG,KAAK,CAAC;IACV,MAAM,EAAE,OAAO,EAAE,GAAG,iBAAiB,EAAE,CAAC;IAExC,OAAO,CACL,KAAC,UAAU,IAAC,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,SAAS,QAAC,QAAQ,EAAE,QAAQ,YAC/D,KAAC,MAAM,IACL,OAAO,EAAC,SAAS,EACjB,IAAI,EAAE,OAAO,CAAC,aAAa,EAC3B,MAAM,EAAE,MAAM,EACd,IAAI,EAAE,IAAI,EACV,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,iBACL,MAAM,EACnB,OAAO,EAAE,OAAO,GAChB,GACS,CACd,CAAC;AACJ,CAAC"}

package/lib/overlay/ui/OverlayBar.d.ts

@@ -0,0 +1,122 @@
+import type { IconName } from '@blueprintjs/core';
+import type { ReactElement, ReactNode } from 'react';
+import type { OverlayPlacement } from '../core/overlayPlacement.ts';
+/** What {@link OverlayBar} needs. */
+export interface OverlayBarProps {
+    /**
+     * The controls that stay on screen. Keep it to one or two in a floating
+     * card: a third is already a panel, and a panel over a figure hides the
+     * figure. A stretched bar holds its tab strip here, at the start of the row.
+     */
+    children: ReactNode;
+    /**
+     * What sits at the far end of the row: the controls belonging to whatever
+     * the figure is currently showing. They are the first thing to go when the
+     * figure is too narrow for both ends, folding in behind the button.
+     * @default undefined — the bar's end holds only its glyphs
+     */
+    end?: ReactNode;
+    /**
+     * The glyph-sized tools that act on the figure rather than change how it is
+     * drawn — saving it as a file, printing it. They ride beside the `?` at the
+     * end of the row and, on a stretched bar, never fold: a tool is one button
+     * wide already, and a reader who cannot find the one that takes the figure
+     * away concludes the figure cannot be taken away.
+     * @default undefined — the bar carries no tools
+     */
+    tools?: ReactNode;
+    /**
+     * The one control drawn at the end whatever the width — the `?` opening the
+     * figure's own explanation. It never folds, because a reader short of room
+     * is exactly the reader who has not been told what they are looking at.
+     * @default undefined — the bar carries no glyph
+     */
+    info?: ReactNode;
+    /**
+     * What opens behind the button at the end of the bar — everything an expert
+     * changes and a reader never does. This is where a control goes unless
+     * somebody argued for putting it in the strip.
+     * @default undefined — the bar carries no button
+     */
+    more?: ReactNode;
+    /**
+     * Where it sits. Pick the corner the data leaves emptiest, which
+     * `emptiestCorner` answers from the points themselves, or `stretch` for the
+     * settings bar of an embedded figure, which spans the width above it.
+     * @default 'top-right'
+     */
+    placement?: OverlayPlacement;
+    /**
+     * What the group of controls is called, for a reader arriving by tab and for
+     * the button the bar folds into.
+     * @default 'Options'
+     */
+    label?: string;
+    /**
+     * How opaque the bar is while nothing is pointing at the figure. Never below
+     * about 0.6: a control the reader cannot see is a control they will not look
+     * for, and only the ground fades — the text is always at full strength. `1`
+     * pins it, which is what a figure about to be screenshotted wants. A
+     * stretched bar ignores it: its ground is chrome rather than something laid
+     * over the picture, and chrome that fades reads as a fault.
+     * @default 0.74
+     */
+    restingOpacity?: number;
+    /**
+     * Whether the bar is reduced to a button opening the same controls in a
+     * popover. Left out, it folds on its own once the figure is narrower than
+     * `collapseBelow`.
+     * @default undefined — the bar decides from the figure's width
+     */
+    collapsed?: boolean;
+    /**
+     * Whether it starts folded, for a bar the reader may open and close.
+     * @default false
+     */
+    defaultCollapsed?: boolean;
+    /**
+     * Called when the reader opens or closes it.
+     * @default undefined
+     */
+    onCollapsedChange?: (collapsed: boolean) => void;
+    /**
+     * Figure width, in pixels, under which the bar folds on its own.
+     * @default 420
+     */
+    collapseBelow?: number;
+    /**
+     * Blueprint glyph of the button that opens the rest. A cog rather than an
+     * ellipsis, because once the bar folds that button holds every control and
+     * not only the second tier.
+     * @default 'cog'
+     */
+    moreIcon?: IconName;
+    /**
+     * Whether what opens behind that button is drawn with the card's own padding
+     * around it. Turn it off when `more` is an {@link OverlayPanel}, which
+     * brings its own: nested inside a padded surface a panel's header rule stops
+     * short of both edges and reads as a mis-drawn line rather than as a header.
+     * @default true
+     */
+    morePadded?: boolean;
+    /**
+     * Value of the `data-testid` attribute of the card, for the end-to-end tests.
+     * @default undefined
+     */
+    testId?: string;
+}
+/**
+ * The controls of a figure: a small card floating in one of its corners, or
+ * one bar spanning the width above it.
+ *
+ * Which of the two it is, is the whole of the decision made here — the shapes
+ * themselves are drawn by {@link OverlayBarCard} and {@link OverlayBarStrip},
+ * because a card that hides in a corner and a strip that spans the width agree
+ * on what they hold and on nothing about how they sit. A stretched bar is what
+ * an embedded figure wants, where a floating card would spend the host's page
+ * twice — once on the chrome and once on the data the chrome is covering.
+ * @param props - See {@link OverlayBarProps}.
+ * @returns The bar.
+ */
+export declare function OverlayBar(props: OverlayBarProps): ReactElement;
+//# sourceMappingURL=OverlayBar.d.ts.map

package/lib/overlay/ui/OverlayBar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OverlayBar.d.ts","sourceRoot":"","sources":["../../../src/overlay/ui/OverlayBar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGrD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,6BAA6B,CAAC;AAQpE,qCAAqC;AACrC,MAAM,WAAW,eAAe;IAC9B;;;;OAIG;IACH,QAAQ,EAAE,SAAS,CAAC;IACpB;;;;;OAKG;IACH,GAAG,CAAC,EAAE,SAAS,CAAC;IAChB;;;;;;;OAOG;IACH,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;;;OAKG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,gBAAgB,CAAC;IAC7B;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;;;;OAQG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;;;;OAKG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;;OAGG;IACH,iBAAiB,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,KAAK,IAAI,CAAC;IACjD;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED;;;;;;;;;;;;GAYG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,GAAG,YAAY,CAyD/D"}

package/lib/overlay/ui/OverlayBar.js

@@ -0,0 +1,42 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useState } from 'react';
+import { OverlayBarCard } from "./OverlayBarCard.js";
+import { OverlayBarStrip } from "./OverlayBarStrip.js";
+import { overlayBarFolded, useFoldReport } from "./overlayBarShape.js";
+import { OVERLAY_RESTING_OPACITY } from "./overlayStyles.js";
+import { useOverlaySurface } from "./overlaySurface.js";
+/**
+ * The controls of a figure: a small card floating in one of its corners, or
+ * one bar spanning the width above it.
+ *
+ * Which of the two it is, is the whole of the decision made here — the shapes
+ * themselves are drawn by {@link OverlayBarCard} and {@link OverlayBarStrip},
+ * because a card that hides in a corner and a strip that spans the width agree
+ * on what they hold and on nothing about how they sit. A stretched bar is what
+ * an embedded figure wants, where a floating card would spend the host's page
+ * twice — once on the chrome and once on the data the chrome is covering.
+ * @param props - See {@link OverlayBarProps}.
+ * @returns The bar.
+ */
+export function OverlayBar(props) {
+    const { children, end, tools, info, more } = props;
+    const { placement = 'top-right' } = props;
+    const { label = 'Options', restingOpacity = OVERLAY_RESTING_OPACITY } = props;
+    const { collapsed, defaultCollapsed = false, onCollapsedChange } = props;
+    const { collapseBelow = 420, moreIcon = 'cog', testId } = props;
+    const { morePadded = true } = props;
+    const { width } = useOverlaySurface();
+    const [startedFolded] = useState(defaultCollapsed);
+    const folded = overlayBarFolded({
+        collapsed,
+        startedFolded,
+        width,
+        collapseBelow,
+    });
+    useFoldReport(folded, collapsed === undefined ? onCollapsedChange : undefined);
+    if (placement === 'stretch') {
+        return (_jsx(OverlayBarStrip, { end: end, tools: tools, info: info, more: more, placement: placement, label: label, moreIcon: moreIcon, morePadded: morePadded, folded: folded, testId: testId, children: children }));
+    }
+    return (_jsx(OverlayBarCard, { end: end, tools: tools, info: info, more: more, placement: placement, label: label, moreIcon: moreIcon, morePadded: morePadded, folded: folded, restingOpacity: restingOpacity, testId: testId, children: children }));
+}
+//# sourceMappingURL=OverlayBar.js.map