@expressivecss/expressive 0.15.0 → 0.17.0

package/dist/js/chunks/{chunk-XAEAEHIX.mjs → chunk-RSNS5OYS.mjs}

@@ -1,19 +1,26 @@
 import {
   LineChart,
   polarPoint,
-  seriesColor,
+  splitRuns
+} from "./chunk-IQOTGGHX.mjs";
+import {
   svgNode
-} from "./chunk-TCCA2HDG.mjs";
+} from "./chunk-67UNY7RH.mjs";
 
 // src/ts/components/radarChart.ts
 var RINGS = 4;
+function runs(values) {
+  const list = splitRuns(values);
+  if (list.length > 1) list[0] = [...list.pop(), ...list[0]];
+  return list.filter((run) => run.length);
+}
+var closed = (corners) => `M${corners.join("L")}Z`;
+var open = (corners) => `M${corners.join("L")}${corners.length > 1 ? "" : "h0"}`;
+var wedge = (corners) => `M0,0L${corners.join("L")}Z`;
 var RadarChart = class extends LineChart {
   get _type() {
     return "radar-chart";
   }
-  get _key() {
-    return "Expressive_RadarChart";
-  }
   /** The scale starts at zero, the middle, so shapes compare by size. */
   get _fromZero() {
     return true;
@@ -21,12 +28,6 @@ var RadarChart = class extends LineChart {
   get _circular() {
     return true;
   }
-  static init(els, options = {}) {
-    return super.init(els, options);
-  }
-  static getInstance(el) {
-    return el["Expressive_RadarChart"];
-  }
   /**
    * The cursor is a spoke turned by --turn, and the tooltip sits past its
    * tip. LineChart's points on the spoke keep their top, a share of the
@@ -54,6 +55,28 @@ var RadarChart = class extends LineChart {
     const [turn] = this._polarAt(e);
     return Math.round(turn * this.labels.length) % this.labels.length;
   }
+  /** The grid rings' shares of the radius: one per .axis label above zero, or quarters. */
+  _rings(share) {
+    if (!this._axis) return Array.from({ length: RINGS }, (_, r) => (r + 1) / RINGS);
+    return this.series[0].scale.ticks.filter((tick) => tick > 0).map(share);
+  }
+  /**
+   * One series' group: its outline, broken at a gap like a line chart's,
+   * its .area fill and its .points.
+   */
+  _series(series, corner) {
+    const group = svgNode("g", {
+      class: `radar-chart-series ${series.className}`.trim(),
+      "data-series": series.color
+    });
+    const lines = runs(series.values).map((run) => run.map(corner));
+    const [outline, fill] = series.values.includes(null) ? [open, wedge] : [closed, closed];
+    group.append(svgNode("path", { class: "radar-chart-shape", d: lines.map(outline).join("") }));
+    const list = this.el.classList;
+    if (list.contains("area")) group.append(svgNode("path", { class: "radar-chart-area", d: lines.map(fill).join("") }));
+    if (list.contains("points")) group.append(svgNode("path", { class: "radar-chart-points", d: lines.flat().map((c) => `M${c}h0`).join("") }));
+    return group;
+  }
   /**
    * An SVG in a -50 to 50 box: the rings and spokes of the grid, then each
    * series' shape, with its points for .points. The rim is the box's edge;
@@ -67,20 +90,9 @@ var RadarChart = class extends LineChart {
     const svg = svgNode("svg", { viewBox: "-50 -50 100 100", "aria-hidden": "true", focusable: "false" });
     svg.append(svgNode("path", {
       class: "radar-chart-grid",
-      d: Array.from({ length: RINGS }, (_, r) => ring((r + 1) / RINGS)).join("") + rows.map((i) => `M0,0L${at(i, 1)}`).join("")
+      d: this._rings(share).map(ring).join("") + rows.map((i) => `M0,0L${at(i, 1)}`).join("")
     }));
-    const points = this.el.classList.contains("points");
-    this.series.forEach((series, s) => {
-      const group = svgNode("g", {
-        class: `radar-chart-series ${series.className}`.trim(),
-        "data-series": seriesColor(s)
-      });
-      const drawn = rows.filter((i) => series.values[i] !== null);
-      const corners = drawn.map((i) => at(i, share(series.values[i])));
-      group.append(svgNode("path", { class: "radar-chart-shape", d: corners.length ? `M${corners.join("L")}Z` : "" }));
-      if (points) group.append(svgNode("path", { class: "radar-chart-points", d: corners.map((c) => `M${c}h0`).join("") }));
-      svg.append(group);
-    });
+    this.series.forEach((series) => svg.append(this._series(series, (i) => at(i, share(series.values[i])))));
     const labels = document.createElement("ol");
     labels.className = "radar-chart-axes";
     labels.setAttribute("aria-hidden", "true");
@@ -96,8 +108,9 @@ var RadarChart = class extends LineChart {
     return web;
   }
 };
+RadarChart.key = "Expressive_RadarChart";
 
 export {
   RadarChart
 };
-//# sourceMappingURL=chunk-XAEAEHIX.mjs.map
+//# sourceMappingURL=chunk-RSNS5OYS.mjs.map

package/dist/js/chunks/chunk-RSNS5OYS.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/ts/components/radarChart.ts"],
+  "sourcesContent": ["import { LineChart, LineChartOptions, polarPoint, Series, splitRuns } from './lineChart';\nimport { svgNode as node } from '../core/utils';\n\nexport type RadarChartOptions = LineChartOptions;\n\n/** Grid rings, evenly spaced from the middle to the rim. */\nconst RINGS = 4;\n\n/**\n * A series' rows split at its gaps into runs, the last carrying on round\n * past the top spoke into the first.\n */\nfunction runs(values: (number | null)[]) {\n  const list = splitRuns(values);\n  if (list.length > 1) list[0] = [...list.pop()!, ...list[0]];\n  return list.filter((run) => run.length);\n}\n\n// A run of corners as a path: closed round a whole shape; open where a gap\n// breaks it, a dot for a lone corner; and filled as a wedge from the middle.\nconst closed = (corners: string[]) => `M${corners.join('L')}Z`;\nconst open = (corners: string[]) => `M${corners.join('L')}${corners.length > 1 ? '' : 'h0'}`;\nconst wedge = (corners: string[]) => `M0,0L${corners.join('L')}Z`;\n\n/**\n * Radar chart. It reads its <table> like LineChart, but each row is a spoke,\n * clockwise from the top, and each value column is a series drawn as a\n * shape joining its values on the spokes, from zero in the middle to the\n * scale's top at the rim. The row labels sit round the rim.\n *\n * Call `update()` after changing the table, or start it with `watch` or\n * `data-watch`.\n */\nexport class RadarChart extends LineChart {\n  protected get _type() {\n    return 'radar-chart';\n  }\n\n  /** The scale starts at zero, the middle, so shapes compare by size. */\n  protected get _fromZero() {\n    return true;\n  }\n\n  protected get _circular() {\n    return true;\n  }\n\n  static key = 'Expressive_RadarChart';\n\n  /**\n   * The cursor is a spoke turned by --turn, and the tooltip sits past its\n   * tip. LineChart's points on the spoke keep their top, a share of the\n   * radius, which stops at the rim and the middle like the shapes.\n   */\n  protected _place(index: number) {\n    for (const dot of this._cursor.children as HTMLCollectionOf<HTMLElement>) {\n      dot.style.top = `${Math.min(100, Math.max(0, parseFloat(dot.style.top)))}%`;\n    }\n    const turn = this._turn(index);\n    this._cursor.style.setProperty('--turn', String(turn));\n    this._tooltip.style.setProperty('--turn', String(turn));\n    // On the right half it opens leftwards, over the chart.\n    this._tooltip.classList.toggle('end', turn > 0 && turn < 0.5);\n  }\n\n  /** A row's spoke as a fraction of a turn clockwise from the top. */\n  private _turn(index: number) {\n    return index / this.labels.length;\n  }\n\n  /** Only the legend; the labels go round the rim in _draw. */\n  protected _guides(): Element[] {\n    return this._legend();\n  }\n\n  /** The nearest spoke to the pointer, by its angle from the middle. */\n  protected _indexAt(e: PointerEvent) {\n    const [turn] = this._polarAt(e);\n    return Math.round(turn * this.labels.length) % this.labels.length;\n  }\n\n  /** The grid rings' shares of the radius: one per .axis label above zero, or quarters. */\n  private _rings(share: (value: number) => number) {\n    if (!this._axis) return Array.from({ length: RINGS }, (_, r) => (r + 1) / RINGS);\n    return this.series[0].scale.ticks.filter((tick) => tick > 0).map(share);\n  }\n\n  /**\n   * One series' group: its outline, broken at a gap like a line chart's,\n   * its .area fill and its .points.\n   */\n  private _series(series: Series, corner: (index: number) => string) {\n    const group = node('g', {\n      class: `radar-chart-series ${series.className}`.trim(),\n      'data-series': series.color\n    });\n    const lines = runs(series.values).map((run) => run.map(corner));\n    const [outline, fill] = series.values.includes(null) ? [open, wedge] : [closed, closed];\n    group.append(node('path', { class: 'radar-chart-shape', d: lines.map(outline).join('') }));\n    const list = this.el.classList;\n    if (list.contains('area')) group.append(node('path', { class: 'radar-chart-area', d: lines.map(fill).join('') }));\n    // Round caps on zero-length lines, so CSS sizes the points in pixels.\n    if (list.contains('points')) group.append(node('path', { class: 'radar-chart-points', d: lines.flat().map((c) => `M${c}h0`).join('') }));\n    return group;\n  }\n\n  /**\n   * An SVG in a -50 to 50 box: the rings and spokes of the grid, then each\n   * series' shape, with its points for .points. The rim is the box's edge;\n   * the labels round it are HTML.\n   */\n  protected _draw(): Element {\n    const at = (index: number, share: number) => polarPoint(this._turn(index), 50 * share);\n    // The rim is the scale's top, so _y is the distance in from the rim.\n    const share = (value: number) => Math.min(1, Math.max(0, 1 - this._y(value) / 100));\n    const rows = this.labels.map((_, i) => i);\n    const ring = (r: number) => `M${rows.map((i) => at(i, r)).join('L')}Z`;\n\n    const svg = node('svg', { viewBox: '-50 -50 100 100', 'aria-hidden': 'true', focusable: 'false' });\n    svg.append(node('path', {\n      class: 'radar-chart-grid',\n      d: this._rings(share).map(ring).join('')\n        + rows.map((i) => `M0,0L${at(i, 1)}`).join('')\n    }));\n    this.series.forEach((series) => svg.append(this._series(series, (i) => at(i, share(series.values[i]!)))));\n\n    const labels = document.createElement('ol');\n    labels.className = 'radar-chart-axes';\n    labels.setAttribute('aria-hidden', 'true');\n    this.labels.forEach((text, i) => {\n      const li = document.createElement('li');\n      li.textContent = text;\n      li.style.setProperty('--turn', String(this._turn(i)));\n      labels.append(li);\n    });\n\n    const web = document.createElement('div');\n    web.className = 'radar-chart-web';\n    web.append(svg, labels);\n    return web;\n  }\n}\n"],
+  "mappings": "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",
+  "names": ["share"]
+}

package/dist/js/chunks/{chunk-X4ISMKE2.mjs → chunk-RUDYMEJ3.mjs}

@@ -1,20 +1,21 @@
 import {
   installSheetDrag
-} from "./chunk-WQYN5L4E.mjs";
+} from "./chunk-YLZOJLDI.mjs";
 
 // src/ts/behaviors/sideSheets.ts
-var startDocked = (dialog) => dialog.classList.contains("left") || dialog.classList.contains("left-sheet") || dialog.classList.contains("start");
+var startDocked = (dialog) => dialog.classList.contains("start");
 var leftDocked = (dialog) => startDocked(dialog) !== (getComputedStyle(dialog).direction === "rtl");
 var SideSheets = class {
   static Init() {
     installSheetDrag({
-      selector: "dialog.side-sheet, dialog.right, dialog.right-sheet, dialog.left, dialog.left-sheet",
+      selector: "dialog.side-sheet",
       axis: "x",
       property: "--md-comp-side-sheet-shift",
+      motion: "--md-comp-side-sheet-motion",
       direction: (dialog) => leftDocked(dialog) ? -1 : 1,
       inHandle: (event, dialog) => {
-        const target = event.target;
-        if (target instanceof Element && target.closest("header")) return true;
+        const header = dialog.querySelector(":scope > header");
+        if (header && event.composedPath().includes(header)) return true;
         const rect = dialog.getBoundingClientRect();
         return leftDocked(dialog) ? event.clientX >= rect.right - 24 && event.clientX <= rect.right : event.clientX >= rect.left && event.clientX <= rect.left + 24;
       }
@@ -25,4 +26,4 @@ var SideSheets = class {
 export {
   SideSheets
 };
-//# sourceMappingURL=chunk-X4ISMKE2.mjs.map
+//# sourceMappingURL=chunk-RUDYMEJ3.mjs.map

package/dist/js/chunks/chunk-RUDYMEJ3.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/ts/behaviors/sideSheets.ts"],
+  "sourcesContent": ["import { installSheetDrag } from './sheetDrag';\n\nconst startDocked = (dialog: HTMLDialogElement): boolean => dialog.classList.contains('start');\n\nconst leftDocked = (dialog: HTMLDialogElement): boolean =>\n  startDocked(dialog) !== (getComputedStyle(dialog).direction === 'rtl');\n\n/**\n * Drag-to-dismiss for side sheets (`dialog.side-sheet`).\n *\n * Grab the header or the inner 24dp edge and drag toward the docked side.\n * Past 96dp, or a flick, closes. Light-dismiss on the scrim stays with\n * {@link Dialogs}. The drag itself is {@link installSheetDrag}, shared with\n * the bottom sheet.\n */\nexport class SideSheets {\n  static Init() {\n    installSheetDrag({\n      selector: 'dialog.side-sheet',\n      axis: 'x',\n      property: '--md-comp-side-sheet-shift',\n      motion: '--md-comp-side-sheet-motion',\n      direction: (dialog) => (leftDocked(dialog) ? -1 : 1),\n      inHandle: (event, dialog) => {\n        // Only the sheet's own top bar: a <header> in its content, or one\n        // around the dialog, is not a handle, so selecting text there is safe.\n        const header = dialog.querySelector(':scope > header');\n        if (header && event.composedPath().includes(header)) return true;\n        const rect = dialog.getBoundingClientRect();\n        return leftDocked(dialog)\n          ? event.clientX >= rect.right - 24 && event.clientX <= rect.right\n          : event.clientX >= rect.left && event.clientX <= rect.left + 24;\n      }\n    });\n  }\n}\n"],
+  "mappings": ";;;;;AAEA,IAAM,cAAc,CAAC,WAAuC,OAAO,UAAU,SAAS,OAAO;AAE7F,IAAM,aAAa,CAAC,WAClB,YAAY,MAAM,OAAO,iBAAiB,MAAM,EAAE,cAAc;AAU3D,IAAM,aAAN,MAAiB;AAAA,EACtB,OAAO,OAAO;AACZ,qBAAiB;AAAA,MACf,UAAU;AAAA,MACV,MAAM;AAAA,MACN,UAAU;AAAA,MACV,QAAQ;AAAA,MACR,WAAW,CAAC,WAAY,WAAW,MAAM,IAAI,KAAK;AAAA,MAClD,UAAU,CAAC,OAAO,WAAW;AAG3B,cAAM,SAAS,OAAO,cAAc,iBAAiB;AACrD,YAAI,UAAU,MAAM,aAAa,EAAE,SAAS,MAAM,EAAG,QAAO;AAC5D,cAAM,OAAO,OAAO,sBAAsB;AAC1C,eAAO,WAAW,MAAM,IACpB,MAAM,WAAW,KAAK,QAAQ,MAAM,MAAM,WAAW,KAAK,QAC1D,MAAM,WAAW,KAAK,QAAQ,MAAM,WAAW,KAAK,OAAO;AAAA,MACjE;AAAA,IACF,CAAC;AAAA,EACH;AACF;",
+  "names": []
+}

package/dist/js/chunks/chunk-STJR62SU.mjs

@@ -0,0 +1,161 @@
+import {
+  Component
+} from "./chunk-EB2V4OKL.mjs";
+import {
+  Utils
+} from "./chunk-67UNY7RH.mjs";
+
+// src/ts/components/hoverCard.ts
+var _defaults = {
+  enterDelay: 500,
+  exitDelay: 300
+};
+var owners = /* @__PURE__ */ new WeakMap();
+var HoverCard = class extends Component {
+  constructor(el, options) {
+    super(el, options);
+    /** Whether the instance has the card showing. */
+    this._shown = false;
+    /** What keeps the card wanted: the pointer, keyboard focus, or both. */
+    this._holds = /* @__PURE__ */ new Set();
+    /** The anchor name the card is placed against while this link shows it. */
+    this._anchorName = `--hover-card-${Utils.guid()}`;
+    /**
+     * Show the card now, without enterDelay.
+     */
+    this.open = () => {
+      clearTimeout(this._timeout);
+      if (!this.cardEl || this._shown) return;
+      owners.get(this.cardEl)?.close();
+      this.cardEl.showPopover.call(this.cardEl, { source: this.el });
+      owners.set(this.cardEl, this);
+      this._shown = true;
+      this._listenForEscape(true);
+      this._anchor(true);
+      this._notify("open");
+    };
+    /**
+     * Hide the card now, without exitDelay.
+     */
+    this.close = () => {
+      clearTimeout(this._timeout);
+      if (!this._shown) return;
+      this.cardEl.hidePopover();
+      this._hidden();
+      this._notify("close");
+    };
+    // A touch is a tap that follows the link, never a hover; pointer events
+    // say so, and the mouse events a tap sends afterwards are not listened to.
+    this._handlePointerEnter = (e) => {
+      if (e.pointerType !== "touch") this._hold("pointer");
+    };
+    this._handlePointerLeave = (e) => {
+      if (e.pointerType !== "touch") this._release("pointer");
+    };
+    // A pointer press also focuses the link, and the hover already covers it,
+    // so only keyboard focus holds the card from the link.
+    this._handleLinkFocus = () => {
+      if (this.el.matches(":focus-visible")) this._hold("focus");
+    };
+    // Links can share a card, and each listens on it. Only the link showing the
+    // card is held by it; the others would take the card away after enterDelay.
+    this._handleCardEnter = (e) => {
+      if (this._shown) this._handlePointerEnter(e);
+    };
+    this._handleCardFocus = () => {
+      if (this._shown) this._hold("focus");
+    };
+    this._handleFocusOut = (e) => {
+      const next = e.relatedTarget;
+      if (!next || !(this.el.contains(next) || this.cardEl.contains(next))) this._release("focus");
+    };
+    // Escape always hides the card, but it is only the card's key when focus is
+    // on the link or in the card; otherwise it still reaches the dialog or menu
+    // that has focus. An engine that does not know popover="hint" treats the
+    // card as manual, which Escape would not close.
+    this._handleKeydown = (e) => {
+      if (e.key !== "Escape" || Utils.isComposing(e)) return;
+      if (Utils.focusIsIn(this.el, this.cardEl)) this._takeEscape(e);
+      this.close();
+    };
+    this._handleToggle = (e) => {
+      if (e.newState !== "closed" || !this._shown) return;
+      this._hidden();
+      this._notify("close");
+    };
+    this.cardEl = Utils.getElementById(el, el.getAttribute("aria-details") ?? "");
+    if (!this.cardEl) {
+      console.error(`HoverCard: aria-details names no element; the link shows no card.`);
+      return;
+    }
+    const { signal } = this._events;
+    this.cardEl.addEventListener("toggle", this._handleToggle, { signal });
+    for (const target of [this.el, this.cardEl]) {
+      target.addEventListener("pointerleave", this._handlePointerLeave, { signal });
+      target.addEventListener("focusout", this._handleFocusOut, { signal });
+    }
+    this.el.addEventListener("pointerenter", this._handlePointerEnter, { signal });
+    this.cardEl.addEventListener("pointerenter", this._handleCardEnter, { signal });
+    this.el.addEventListener("focus", this._handleLinkFocus, { signal });
+    this.cardEl.addEventListener("focusin", this._handleCardFocus, { signal });
+  }
+  static get defaults() {
+    return _defaults;
+  }
+  destroy() {
+    clearTimeout(this._timeout);
+    if (this._shown) {
+      this.cardEl.hidePopover();
+      this._hidden();
+    }
+    super.destroy();
+  }
+  _hidden() {
+    this._shown = false;
+    this._listenForEscape(false);
+    this._anchor(false);
+  }
+  // `source` anchors the card too, but Firefox keeps the first source's
+  // anchor for good, so a card two links share would stay at the first. A
+  // named anchor, set only while the card shows, follows the link that shows it.
+  _anchor(on) {
+    Utils.setAnchorName(this.el, this._anchorName, on);
+    if (on) this.cardEl.style.setProperty("position-anchor", this._anchorName);
+    else this.cardEl.style.removeProperty("position-anchor");
+    for (const el of [this.el, this.cardEl]) if (!el.getAttribute("style")) el.removeAttribute("style");
+  }
+  /** Wanted cards show after enterDelay; once nothing holds the card, it hides after exitDelay. */
+  _schedule() {
+    clearTimeout(this._timeout);
+    const wanted = this._holds.size > 0;
+    if (wanted === this._shown) return;
+    const [change, delay] = wanted ? [this.open, this.options.enterDelay] : [this.close, this.options.exitDelay];
+    this._timeout = setTimeout(change, delay);
+  }
+  _hold(by) {
+    this._holds.add(by);
+    this._schedule();
+  }
+  _release(by) {
+    this._holds.delete(by);
+    this._schedule();
+  }
+  /** Escape is listened for only while the card shows. close() removes it, and destroy() through the signal. */
+  _listenForEscape(on) {
+    const doc = this.el.ownerDocument;
+    if (on) doc.addEventListener("keydown", this._handleKeydown, { capture: true, signal: this._events.signal });
+    else doc.removeEventListener("keydown", this._handleKeydown, true);
+  }
+  /** Keeps Escape from the page and, when focus is in the card, takes it back to the link before the card hides. */
+  _takeEscape(e) {
+    e.preventDefault();
+    e.stopPropagation();
+    if (Utils.focusIsIn(this.cardEl)) this.el.focus();
+  }
+};
+HoverCard.key = "Expressive_HoverCard";
+
+export {
+  HoverCard
+};
+//# sourceMappingURL=chunk-STJR62SU.mjs.map

package/dist/js/chunks/chunk-STJR62SU.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/ts/components/hoverCard.ts"],
+  "sourcesContent": ["import { Utils } from '../core/utils';\nimport { Component, BaseOptions } from '../core/component';\n\nexport interface HoverCardOptions extends BaseOptions {\n  /**\n   * How long the pointer or keyboard focus rests on the link before the card shows.\n   * @default 500\n   */\n  enterDelay: number;\n  /**\n   * How long the card stays after the pointer and focus leave the link and the card.\n   * @default 300\n   */\n  exitDelay: number;\n}\n\nconst _defaults: HoverCardOptions = {\n  enterDelay: 500,\n  exitDelay: 300\n};\n\n// Links can share one card, such as a name mentioned twice; the link that\n// last showed it owns it, and the next one takes it over.\nconst owners = new WeakMap<HTMLElement, HoverCard>();\n\n/**\n * Hover card. A `.hover-card-trigger` link names its card, a `.popover` with\n * `popover=\"hint\"`, in `aria-details`. The card shows against the link after\n * `enterDelay` and stays while the pointer or focus is on either.\n */\nexport class HoverCard extends Component<HoverCardOptions> {\n  /** The card the link's `aria-details` names, or null when it names none. */\n  cardEl: HTMLElement | null;\n  /** Whether the instance has the card showing. */\n  private _shown = false;\n  /** What keeps the card wanted: the pointer, keyboard focus, or both. */\n  private _holds = new Set<'pointer' | 'focus'>();\n  private _timeout: ReturnType<typeof setTimeout>;\n  /** The anchor name the card is placed against while this link shows it. */\n  private _anchorName = `--hover-card-${Utils.guid()}`;\n\n  constructor(el: HTMLElement, options: Partial<HoverCardOptions>) {\n    super(el, options);\n    this.cardEl = Utils.getElementById(el, el.getAttribute('aria-details') ?? '');\n    if (!this.cardEl) {\n      console.error(`HoverCard: aria-details names no element; the link shows no card.`);\n      return;\n    }\n    // The browser hides a hint card itself on a click elsewhere, on Escape\n    // and when another hint opens.\n    const { signal } = this._events;\n    this.cardEl.addEventListener('toggle', this._handleToggle, { signal });\n    for (const target of [this.el, this.cardEl]) {\n      target.addEventListener('pointerleave', this._handlePointerLeave, { signal });\n      target.addEventListener('focusout', this._handleFocusOut, { signal });\n    }\n    this.el.addEventListener('pointerenter', this._handlePointerEnter, { signal });\n    this.cardEl.addEventListener('pointerenter', this._handleCardEnter, { signal });\n    this.el.addEventListener('focus', this._handleLinkFocus, { signal });\n    this.cardEl.addEventListener('focusin', this._handleCardFocus, { signal });\n  }\n\n  static get defaults(): HoverCardOptions {\n    return _defaults;\n  }\n\n  static key = 'Expressive_HoverCard';\n\n  destroy() {\n    clearTimeout(this._timeout);\n    if (this._shown) {\n      this.cardEl.hidePopover();\n      this._hidden();\n    }\n    super.destroy();\n  }\n\n  /**\n   * Show the card now, without enterDelay.\n   */\n  open = () => {\n    clearTimeout(this._timeout);\n    if (!this.cardEl || this._shown) return;\n    owners.get(this.cardEl)?.close();\n    // `source` makes the link the card's anchor and invoker, so Tab moves from\n    // the link into the card. It throws for a card without the popover\n    // attribute, before any state changes.\n    (this.cardEl.showPopover as (options?: { source?: Element }) => void).call(this.cardEl, { source: this.el });\n    owners.set(this.cardEl, this);\n    this._shown = true;\n    this._listenForEscape(true);\n    this._anchor(true);\n    this._notify('open');\n  };\n\n  /**\n   * Hide the card now, without exitDelay.\n   */\n  close = () => {\n    clearTimeout(this._timeout);\n    if (!this._shown) return;\n    this.cardEl.hidePopover();\n    this._hidden();\n    this._notify('close');\n  };\n\n  private _hidden() {\n    this._shown = false;\n    this._listenForEscape(false);\n    this._anchor(false);\n  }\n\n  // `source` anchors the card too, but Firefox keeps the first source's\n  // anchor for good, so a card two links share would stay at the first. A\n  // named anchor, set only while the card shows, follows the link that shows it.\n  private _anchor(on: boolean) {\n    Utils.setAnchorName(this.el, this._anchorName, on);\n    if (on) this.cardEl.style.setProperty('position-anchor', this._anchorName);\n    else this.cardEl.style.removeProperty('position-anchor');\n    for (const el of [this.el, this.cardEl]) if (!el.getAttribute('style')) el.removeAttribute('style');\n  }\n\n  /** Wanted cards show after enterDelay; once nothing holds the card, it hides after exitDelay. */\n  private _schedule() {\n    clearTimeout(this._timeout);\n    const wanted = this._holds.size > 0;\n    if (wanted === this._shown) return;\n    const [change, delay] = wanted ? [this.open, this.options.enterDelay] as const : [this.close, this.options.exitDelay] as const;\n    this._timeout = setTimeout(change, delay);\n  }\n\n  private _hold(by: 'pointer' | 'focus') {\n    this._holds.add(by);\n    this._schedule();\n  }\n\n  private _release(by: 'pointer' | 'focus') {\n    this._holds.delete(by);\n    this._schedule();\n  }\n\n  // A touch is a tap that follows the link, never a hover; pointer events\n  // say so, and the mouse events a tap sends afterwards are not listened to.\n  private _handlePointerEnter = (e: PointerEvent) => {\n    if (e.pointerType !== 'touch') this._hold('pointer');\n  };\n\n  private _handlePointerLeave = (e: PointerEvent) => {\n    if (e.pointerType !== 'touch') this._release('pointer');\n  };\n\n  // A pointer press also focuses the link, and the hover already covers it,\n  // so only keyboard focus holds the card from the link.\n  private _handleLinkFocus = () => {\n    if (this.el.matches(':focus-visible')) this._hold('focus');\n  };\n\n  // Links can share a card, and each listens on it. Only the link showing the\n  // card is held by it; the others would take the card away after enterDelay.\n  private _handleCardEnter = (e: PointerEvent) => {\n    if (this._shown) this._handlePointerEnter(e);\n  };\n\n  private _handleCardFocus = () => {\n    if (this._shown) this._hold('focus');\n  };\n\n  private _handleFocusOut = (e: FocusEvent) => {\n    const next = e.relatedTarget as Node | null;\n    if (!next || !(this.el.contains(next) || this.cardEl.contains(next))) this._release('focus');\n  };\n\n  /** Escape is listened for only while the card shows. close() removes it, and destroy() through the signal. */\n  private _listenForEscape(on: boolean) {\n    const doc = this.el.ownerDocument;\n    if (on) doc.addEventListener('keydown', this._handleKeydown, { capture: true, signal: this._events.signal });\n    else doc.removeEventListener('keydown', this._handleKeydown, true);\n  }\n\n  // Escape always hides the card, but it is only the card's key when focus is\n  // on the link or in the card; otherwise it still reaches the dialog or menu\n  // that has focus. An engine that does not know popover=\"hint\" treats the\n  // card as manual, which Escape would not close.\n  private _handleKeydown = (e: KeyboardEvent) => {\n    if (e.key !== 'Escape' || Utils.isComposing(e)) return;\n    if (Utils.focusIsIn(this.el, this.cardEl)) this._takeEscape(e);\n    this.close();\n  };\n\n  /** Keeps Escape from the page and, when focus is in the card, takes it back to the link before the card hides. */\n  private _takeEscape(e: KeyboardEvent) {\n    e.preventDefault();\n    e.stopPropagation();\n    if (Utils.focusIsIn(this.cardEl)) this.el.focus();\n  }\n\n  private _handleToggle = (e: Event) => {\n    if ((e as ToggleEvent).newState !== 'closed' || !this._shown) return;\n    this._hidden();\n    this._notify('close');\n  };\n}\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/js/chunks/chunk-SUSD4UTN.mjs

@@ -0,0 +1,220 @@
+import {
+  LineChart,
+  affix,
+  cellValue,
+  linearKey,
+  morph,
+  pace,
+  textSpan,
+  tickAxis,
+  tickFormat,
+  tickText
+} from "./chunk-IQOTGGHX.mjs";
+import {
+  svgNode
+} from "./chunk-67UNY7RH.mjs";
+
+// src/ts/components/scatterChart.ts
+var dots = (marks) => marks.map(({ x, y }) => `M${x},${y}h0`).join("");
+var place = ({ row, series }) => `${row} ${series.column}`;
+var ms = (time) => parseFloat(time) * (time.trim().endsWith("ms") ? 1 : 1e3);
+function sized(path, size, was, timing) {
+  path.style.setProperty("--scatter-chart-size", `${size}`);
+  if (!timing || !was || was.size === size) return;
+  path.animate({ "--scatter-chart-size": [`${was.size}`, `${size}`] }, { duration: ms(timing.dur), easing: `cubic-bezier(${timing.keySplines})` });
+}
+var ScatterChart = class extends LineChart {
+  get _type() {
+    return "scatter-chart";
+  }
+  get _seriesFrom() {
+    return 2;
+  }
+  get _seriesTo() {
+    return this._bubble ? -1 : void 0;
+  }
+  get _bubble() {
+    return this.el.classList.contains("bubble");
+  }
+  static get defaults() {
+    return { ...LineChart.defaults, xMin: null, xMax: null };
+  }
+  /**
+   * Reads each row's x value into `_xs` and its size into `_sizes`, which
+   * the scales and the points use, and leaves out the values of rows
+   * without either, so they neither draw nor stretch a scale. Nothing stacks.
+   */
+  _arrange(series) {
+    const xs = this._xs = this._rows.map((row) => cellValue(row.cells[1]));
+    const sizes = this._sizes = this._rows.map((row) => this._size(row));
+    for (const each of series) {
+      each.values = each.tops = each.values.map((value, row) => xs[row] === null || sizes[row] === null ? null : value);
+    }
+  }
+  /** A row's size: 1 without .bubble, or its last cell's value, null unless positive. */
+  _size(row) {
+    if (!this._bubble) return 1;
+    const size = cellValue(row.cells[this._header.length - 1]) ?? 0;
+    return size > 0 ? size : null;
+  }
+  get _count() {
+    return this._marks?.length ?? 0;
+  }
+  /** Highlights one point, numbered as `_marks` lists them. Pass -1 to hide the tooltip. */
+  show(index) {
+    if (!this._tooltip || index === this.activeIndex) return;
+    this.activeIndex = index;
+    const mark = this._marks[index];
+    this._cursor.hidden = this._tooltip.hidden = !mark;
+    if (mark) this._fill(mark);
+  }
+  /**
+   * Puts the marker on a point, at a bubble's size, and fills the tooltip
+   * beside it: the row, its x header and text, the series and its text, and
+   * with .bubble the size header and text, as the author wrote them. Past
+   * the middle the tooltip opens back over the plot.
+   */
+  _fill({ row, series, x, y, size }) {
+    this._cursor.dataset.series = series.color;
+    this._cursor.style.setProperty("--scatter-chart-size", `${size}`);
+    for (const part of [this._cursor, this._tooltip]) Object.assign(part.style, { left: `${x}%`, top: `${y}%` });
+    this._tooltip.classList.toggle("end", x > 50);
+    const [title, name] = [document.createElement("strong"), textSpan(series.name)];
+    title.textContent = this.labels[row];
+    name.dataset.series = series.color;
+    const sizeText = this._bubble ? this._cellText(row, this._header.length - 1) : [];
+    this._tooltip.replaceChildren(title, ...this._cellText(row, 1), name, textSpan(series.text[row]), ...sizeText);
+  }
+  /** A column's header, without a swatch since it names no series, and the row's text in it. */
+  _cellText(row, column) {
+    const header = textSpan(this._header[column].textContent.trim());
+    header.className = "x";
+    return [header, textSpan(this._rows[row].cells[column]?.textContent.trim() ?? "")];
+  }
+  /** The point nearest the pointer, or -1 with none. */
+  _indexAt(e) {
+    const [plot, box] = [this._plot, this._plot.getBoundingClientRect()];
+    const left = box.left + plot.clientLeft;
+    const top = box.top + plot.clientTop;
+    const [width, height] = [plot.clientWidth, plot.clientHeight];
+    let nearest = -1;
+    let distance = Infinity;
+    this._marks.forEach(({ x, y }, i) => {
+      const away = Math.hypot(left + x / 100 * width - e.clientX, top + y / 100 * height - e.clientY);
+      if (nearest < 0 || away < distance) {
+        nearest = i;
+        distance = away;
+      }
+    });
+    return nearest;
+  }
+  /**
+   * Steps through the points in table order. The arrows keep their meaning
+   * in a right-to-left chart, since table order is no direction on screen.
+   */
+  _keyTarget(key) {
+    return linearKey(key, this.activeIndex, this._marks.length - 1);
+  }
+  _read() {
+    [this._drawn, this._marks] = [this._marks ?? [], []];
+    super._read();
+    if (!this.series.length) return;
+    this._xFit = this._xScale();
+    this._xAffix = affix(this._rows.map((row) => row.cells[1]));
+  }
+  /** The x scale over the rows with a point, between `xMin` and `xMax` where they are set. */
+  _xScale() {
+    const [low, high] = this._xRange();
+    const [min, max] = [this._xEnd("xMin"), this._xEnd("xMax")];
+    return this._fit(min ?? low, max ?? high, [min !== null, max !== null]);
+  }
+  /** The x values of the rows with a point, with 10% of their span to spare each side. */
+  _xRange() {
+    const xs = this._xs.filter((_, row) => this._hasPoint(row));
+    if (!xs.length) return [-1, 1];
+    const [low, high] = [xs.reduce((a, b) => Math.min(a, b)), xs.reduce((a, b) => Math.max(a, b))];
+    const pad = (high - low) * 0.1 || 1;
+    return [low - pad, high + pad];
+  }
+  /** An x scale end from its data attribute or option, or null. */
+  _xEnd(name) {
+    return this._number(name) ?? this.options[name] ?? null;
+  }
+  /** A value's distance across the plot from its inline start, in percent. */
+  _xAt(value) {
+    const { min, max } = this._xFit;
+    const x = (value - min) / (max - min || 1) * 100;
+    return this._reversed ? 100 - x : x;
+  }
+  /** Whether any series shown draws a point in a row. */
+  _hasPoint(row) {
+    return this.series.some((series) => series.values[row] !== null);
+  }
+  /** The points, each diameter the square root of its row's share of the largest size drawn, so areas follow sizes. */
+  _layout() {
+    const largest = this._sizes.reduce((most, size, row) => this._hasPoint(row) ? Math.max(most, size) : most, 0);
+    return this.labels.flatMap((_, row) => this.series.filter((series) => series.values[row] !== null).map((series) => ({
+      row,
+      series,
+      x: this._xAt(this._xs[row]),
+      y: series.y(series.values[row]),
+      size: Math.sqrt(this._sizes[row] / largest)
+    })));
+  }
+  /** One group per series, its points round caps on zero-length lines, so CSS sizes them in pixels. */
+  _draw() {
+    this._marks = this._layout();
+    const svg = svgNode("svg", {
+      viewBox: "0 0 100 100",
+      preserveAspectRatio: "none",
+      "aria-hidden": "true",
+      focusable: "false"
+    });
+    const timing = this._before.length ? pace(this.el) : null;
+    const was = new Map(this._drawn.map((old) => [place(old), old]));
+    svg.append(...this.series.map((series) => this._group(series, timing, was)));
+    return svg;
+  }
+  /**
+   * A series' points, in one path, or with .bubble one path each, largest
+   * first so smaller bubbles stay on top.
+   */
+  _group(series, timing, was) {
+    const group = svgNode("g", {
+      class: `scatter-chart-series ${series.className}`.trim(),
+      "data-series": series.color
+    });
+    const marks = this._marks.filter((mark) => mark.series === series);
+    const sets = this._bubble ? marks.sort((a, b) => b.size - a.size).map((mark) => [mark]) : [marks];
+    group.append(...sets.map((set) => this._pointPath(set, timing, was)));
+    return group;
+  }
+  /**
+   * A path of points. After update() each moves from where its row's point
+   * in the same column was drawn, or appears where it is.
+   */
+  _pointPath(marks, timing, was) {
+    const path = svgNode("path", { class: "scatter-chart-points", d: dots(marks) });
+    if (timing) morph(path, dots(marks.map((mark) => was.get(place(mark)) ?? mark)), timing);
+    if (this._bubble) sized(path, marks[0].size, was.get(place(marks[0])), timing);
+    return path;
+  }
+  /** With .axis, the y scale's labels, and the x scale's below the plot with a grid line at each. */
+  _axes() {
+    return this._axis ? [...super._axes(), this._xAxis()] : [];
+  }
+  _xAxis() {
+    const number = tickFormat(this.el, this._xFit.ticks);
+    return tickAxis("scatter-chart-axis x", this._xFit.ticks, (tick) => tickText(number, tick, this._xAffix), (tick) => this._xAt(tick));
+  }
+  /** The legend only: the rows have no labels along an axis. */
+  _guides() {
+    return this._legend();
+  }
+};
+ScatterChart.key = "Expressive_ScatterChart";
+
+export {
+  ScatterChart
+};
+//# sourceMappingURL=chunk-SUSD4UTN.mjs.map

package/dist/js/chunks/chunk-SUSD4UTN.mjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/ts/components/scatterChart.ts"],
+  "sourcesContent": ["import { svgNode } from '../core/utils';\nimport { LineChart, LineChartOptions, ChartScale, Series, affix, cellValue, linearKey, morph, tickFormat, pace, textSpan as span, tickAxis, tickText } from './lineChart';\n\nexport interface ScatterChartOptions extends LineChartOptions {\n  /**\n   * Lowest value on the x axis. Defaults to the data minimum less 10% of\n   * the range. Overridden by `data-x-min` on the chart.\n   */\n  xMin: number | null;\n  /**\n   * Highest value on the x axis. Defaults to the data maximum plus 10% of\n   * the range. Overridden by `data-x-max` on the chart.\n   */\n  xMax: number | null;\n}\n\n/**\n * A drawn point: its row and series, where it sits in the plot, in percent,\n * and its diameter as a share of the largest bubble's.\n */\ninterface Mark {\n  row: number;\n  series: Series;\n  x: number;\n  y: number;\n  size: number;\n}\n\n/** Points as path data: round caps on zero-length lines. */\nconst dots = (marks: Mark[]) => marks.map(({ x, y }) => `M${x},${y}h0`).join('');\n\n/** A point's row and series column, which update() matches old and new points by. */\nconst place = ({ row, series }: Mark) => `${row} ${series.column}`;\n\n/** A CSS time, such as 400ms or 0.4s, in milliseconds. */\nconst ms = (time: string) => parseFloat(time) * (time.trim().endsWith('ms') ? 1 : 1000);\n\n/**\n * Sizes a bubble, and with motion timing grows or shrinks it from its old\n * point's size. The Web Animations API, since SVG animation cannot reach a\n * size that CSS computes from a token.\n */\nfunction sized(path: SVGElement, size: number, was: Mark | undefined, timing: ReturnType<typeof pace>) {\n  path.style.setProperty('--scatter-chart-size', `${size}`);\n  if (!timing || !was || was.size === size) return;\n  path.animate({ '--scatter-chart-size': [`${was.size}`, `${size}`] }, { duration: ms(timing.dur), easing: `cubic-bezier(${timing.keySplines})` });\n}\n\n/**\n * Scatter chart. It reads its <table> like LineChart, but the first value\n * column is the x axis: each row draws one point per later column, at the\n * row's x value and that column's y value. A row without an x value, or a\n * cell without a y value, draws no point.\n *\n * With `.bubble`, the last column sizes each row's points, so their areas\n * follow its values, and a row without a positive size draws no point.\n *\n * Call `update()` after changing the table, or start it with `watch` or\n * `data-watch`.\n */\nexport class ScatterChart extends LineChart {\n  // No initializers: LineChart's constructor draws before they would run.\n  /** Each row's x value, or null. */\n  private _xs: (number | null)[];\n  /** Each row's size: 1 without .bubble, or the last cell's value, null unless positive. */\n  private _sizes: (number | null)[];\n  /** The x scale. */\n  private _xFit: ChartScale;\n  /** The signs around the x column's numbers, which its axis labels repeat. */\n  private _xAffix: [string, string];\n  /** The drawn points, row by row and within a row by series. */\n  private _marks: Mark[];\n  /** During update(), the points drawn before it, which the new ones move from. */\n  private _drawn: Mark[];\n\n  protected get _type() {\n    return 'scatter-chart';\n  }\n\n  protected get _seriesFrom() {\n    return 2;\n  }\n\n  protected get _seriesTo() {\n    return this._bubble ? -1 : undefined;\n  }\n\n  private get _bubble() {\n    return this.el.classList.contains('bubble');\n  }\n\n  static get defaults(): ScatterChartOptions {\n    return { ...LineChart.defaults, xMin: null, xMax: null };\n  }\n\n  static key = 'Expressive_ScatterChart';\n\n  /**\n   * Reads each row's x value into `_xs` and its size into `_sizes`, which\n   * the scales and the points use, and leaves out the values of rows\n   * without either, so they neither draw nor stretch a scale. Nothing stacks.\n   */\n  protected _arrange(series: Series[]) {\n    const xs = (this._xs = this._rows.map((row) => cellValue(row.cells[1])));\n    const sizes = (this._sizes = this._rows.map((row) => this._size(row)));\n    for (const each of series) {\n      each.values = each.tops = each.values.map((value, row) => (xs[row] === null || sizes[row] === null ? null : value));\n    }\n  }\n\n  /** A row's size: 1 without .bubble, or its last cell's value, null unless positive. */\n  private _size(row: HTMLTableRowElement) {\n    if (!this._bubble) return 1;\n    const size = cellValue(row.cells[this._header.length - 1]) ?? 0;\n    return size > 0 ? size : null;\n  }\n\n  protected get _count() {\n    return this._marks?.length ?? 0;\n  }\n\n  /** Highlights one point, numbered as `_marks` lists them. Pass -1 to hide the tooltip. */\n  show(index: number) {\n    if (!this._tooltip || index === this.activeIndex) return;\n    this.activeIndex = index;\n    const mark = this._marks[index];\n    this._cursor.hidden = this._tooltip.hidden = !mark;\n    if (mark) this._fill(mark);\n  }\n\n  /**\n   * Puts the marker on a point, at a bubble's size, and fills the tooltip\n   * beside it: the row, its x header and text, the series and its text, and\n   * with .bubble the size header and text, as the author wrote them. Past\n   * the middle the tooltip opens back over the plot.\n   */\n  private _fill({ row, series, x, y, size }: Mark) {\n    this._cursor.dataset.series = series.color;\n    this._cursor.style.setProperty('--scatter-chart-size', `${size}`);\n    for (const part of [this._cursor, this._tooltip]) Object.assign(part.style, { left: `${x}%`, top: `${y}%` });\n    this._tooltip.classList.toggle('end', x > 50);\n    const [title, name] = [document.createElement('strong'), span(series.name)];\n    title.textContent = this.labels[row];\n    name.dataset.series = series.color;\n    const sizeText = this._bubble ? this._cellText(row, this._header.length - 1) : [];\n    this._tooltip.replaceChildren(title, ...this._cellText(row, 1), name, span(series.text[row]), ...sizeText);\n  }\n\n  /** A column's header, without a swatch since it names no series, and the row's text in it. */\n  private _cellText(row: number, column: number) {\n    const header = span(this._header[column].textContent.trim());\n    header.className = 'x';\n    return [header, span(this._rows[row].cells[column]?.textContent.trim() ?? '')];\n  }\n\n  /** The point nearest the pointer, or -1 with none. */\n  protected _indexAt(e: PointerEvent) {\n    const [plot, box] = [this._plot, this._plot.getBoundingClientRect()];\n    const left = box.left + plot.clientLeft;\n    const top = box.top + plot.clientTop;\n    const [width, height] = [plot.clientWidth, plot.clientHeight];\n    let nearest = -1;\n    let distance = Infinity;\n    this._marks.forEach(({ x, y }, i) => {\n      const away = Math.hypot(left + (x / 100) * width - e.clientX, top + (y / 100) * height - e.clientY);\n      if (nearest < 0 || away < distance) {\n        nearest = i;\n        distance = away;\n      }\n    });\n    return nearest;\n  }\n\n  /**\n   * Steps through the points in table order. The arrows keep their meaning\n   * in a right-to-left chart, since table order is no direction on screen.\n   */\n  protected _keyTarget(key: string): number | undefined {\n    return linearKey(key, this.activeIndex, this._marks.length - 1);\n  }\n\n  protected _read() {\n    [this._drawn, this._marks] = [this._marks ?? [], []];\n    super._read();\n    if (!this.series.length) return;\n    this._xFit = this._xScale();\n    this._xAffix = affix(this._rows.map((row) => row.cells[1]));\n  }\n\n  /** The x scale over the rows with a point, between `xMin` and `xMax` where they are set. */\n  private _xScale(): ChartScale {\n    const [low, high] = this._xRange();\n    const [min, max] = [this._xEnd('xMin'), this._xEnd('xMax')];\n    return this._fit(min ?? low, max ?? high, [min !== null, max !== null]);\n  }\n\n  /** The x values of the rows with a point, with 10% of their span to spare each side. */\n  private _xRange(): [number, number] {\n    const xs = this._xs.filter((_, row) => this._hasPoint(row)) as number[];\n    if (!xs.length) return [-1, 1];\n    const [low, high] = [xs.reduce((a, b) => Math.min(a, b)), xs.reduce((a, b) => Math.max(a, b))];\n    const pad = (high - low) * 0.1 || 1;\n    return [low - pad, high + pad];\n  }\n\n  /** An x scale end from its data attribute or option, or null. */\n  private _xEnd(name: 'xMin' | 'xMax') {\n    return this._number(name) ?? (this.options as Partial<ScatterChartOptions>)[name] ?? null;\n  }\n\n  /** A value's distance across the plot from its inline start, in percent. */\n  private _xAt(value: number) {\n    const { min, max } = this._xFit;\n    const x = ((value - min) / (max - min || 1)) * 100;\n    return this._reversed ? 100 - x : x;\n  }\n\n  /** Whether any series shown draws a point in a row. */\n  private _hasPoint(row: number) {\n    return this.series.some((series) => series.values[row] !== null);\n  }\n\n  /** The points, each diameter the square root of its row's share of the largest size drawn, so areas follow sizes. */\n  private _layout(): Mark[] {\n    const largest = this._sizes.reduce<number>((most, size, row) => (this._hasPoint(row) ? Math.max(most, size!) : most), 0);\n    return this.labels.flatMap((_, row) => this.series\n      .filter((series) => series.values[row] !== null)\n      .map((series) => ({\n        row,\n        series,\n        x: this._xAt(this._xs[row]!),\n        y: series.y(series.values[row]!),\n        size: Math.sqrt(this._sizes[row]! / largest)\n      })));\n  }\n\n  /** One group per series, its points round caps on zero-length lines, so CSS sizes them in pixels. */\n  protected _draw(): Element {\n    this._marks = this._layout();\n    const svg = svgNode('svg', {\n      viewBox: '0 0 100 100',\n      preserveAspectRatio: 'none',\n      'aria-hidden': 'true',\n      focusable: 'false'\n    });\n    const timing = this._before.length ? pace(this.el) : null;\n    const was = new Map(this._drawn.map((old) => [place(old), old]));\n    svg.append(...this.series.map((series) => this._group(series, timing, was)));\n    return svg;\n  }\n\n  /**\n   * A series' points, in one path, or with .bubble one path each, largest\n   * first so smaller bubbles stay on top.\n   */\n  private _group(series: Series, timing: ReturnType<typeof pace>, was: Map<string, Mark>) {\n    const group = svgNode('g', {\n      class: `scatter-chart-series ${series.className}`.trim(),\n      'data-series': series.color\n    });\n    const marks = this._marks.filter((mark) => mark.series === series);\n    const sets = this._bubble ? marks.sort((a, b) => b.size - a.size).map((mark) => [mark]) : [marks];\n    group.append(...sets.map((set) => this._pointPath(set, timing, was)));\n    return group;\n  }\n\n  /**\n   * A path of points. After update() each moves from where its row's point\n   * in the same column was drawn, or appears where it is.\n   */\n  private _pointPath(marks: Mark[], timing: ReturnType<typeof pace>, was: Map<string, Mark>) {\n    const path = svgNode('path', { class: 'scatter-chart-points', d: dots(marks) });\n    if (timing) morph(path, dots(marks.map((mark) => was.get(place(mark)) ?? mark)), timing);\n    if (this._bubble) sized(path, marks[0].size, was.get(place(marks[0])), timing);\n    return path;\n  }\n\n  /** With .axis, the y scale's labels, and the x scale's below the plot with a grid line at each. */\n  protected _axes(): Element[] {\n    return this._axis ? [...super._axes(), this._xAxis()] : [];\n  }\n\n  private _xAxis() {\n    const number = tickFormat(this.el, this._xFit.ticks);\n    return tickAxis('scatter-chart-axis x', this._xFit.ticks, (tick) => tickText(number, tick, this._xAffix), (tick) => this._xAt(tick));\n  }\n\n  /** The legend only: the rows have no labels along an axis. */\n  protected _guides(): Element[] {\n    return this._legend();\n  }\n}\n"],
+  "mappings": "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",
+  "names": []
+}