@expressivecss/expressive 0.14.1 → 0.16.0

package/dist/js/chunks/{chunk-GUB3TNO2.mjs → chunk-BPF3I2MN.mjs}

@@ -1,30 +1,63 @@
 import {
   LineChart
-} from "./chunk-O5XPWXIQ.mjs";
+} from "./chunk-ZM3XBHWV.mjs";
 
 // src/ts/components/heatmapChart.ts
+function band(level, steps) {
+  return Math.sign(level) * Math.min(steps - 1, Math.floor(Math.abs(level) * steps)) / (steps - 1);
+}
 var HeatmapChart = class extends LineChart {
   get _type() {
     return "heatmap-chart";
   }
-  get _key() {
-    return "Expressive_HeatmapChart";
+  /** Color carries the value, so there is no value axis. */
+  get _axis() {
+    return false;
   }
-  static init(els, options = {}) {
-    return super.init(els, options);
+  get _count() {
+    return this.labels.length * this.series.length;
   }
-  static getInstance(el) {
-    return el["Expressive_HeatmapChart"];
+  /** Redraws the grid, scrolled where it was. */
+  update() {
+    const left = this._scroll?.scrollLeft;
+    super.update();
+    if (this._scroll && left) this._scroll.scrollLeft = left;
   }
   /** Highlights one cell, numbered row by row. Pass -1 to hide the tooltip. */
   show(index) {
     if (!this._tooltip || index === this.activeIndex) return;
-    const cell = this._cells[index];
-    const [left, top, width, plotWidth] = cell ? [cell.offsetLeft, cell.offsetTop, cell.offsetWidth, this._plot.clientWidth] : [];
+    this._activate(this._cells[index], index);
+  }
+  _activate(cell, index) {
+    const box = cell ? this._box(cell) : null;
     this._cells[this.activeIndex]?.classList.remove("active");
     this.activeIndex = index;
-    this._tooltip.hidden = !cell;
+    this._tooltip.hidden = !box;
+    if (box) this._fill(cell, index, box);
+  }
+  /**
+   * A cell's left, top and width in the plot, past any scrolling of the
+   * grid, and the plot's width. A key can move to a cell scrolled out of a
+   * wide grid, so it scrolls into view first.
+   */
+  _box(cell) {
+    if (this._plot.matches(":focus-visible")) cell.scrollIntoView({ block: "nearest", inline: "nearest" });
+    return this._measure(cell);
+  }
+  _measure(cell) {
+    const [box, plot] = [cell.getBoundingClientRect(), this._plot.getBoundingClientRect()];
+    return [box.left - plot.left, box.top - plot.top, box.width, this._plot.clientWidth];
+  }
+  /** Keeps the tooltip on its cell as the grid scrolls, and hides it once the cell scrolls out. */
+  _follow(scroll) {
+    const cell = this._cells[this.activeIndex];
     if (!cell) return;
+    const [view, box] = [scroll.getBoundingClientRect(), cell.getBoundingClientRect()];
+    if (box.right <= view.left || box.left >= view.right) this.show(-1);
+    else this._position(this._measure(cell));
+  }
+  /** Marks the cell and fills the tooltip beside it, on the side with more room. */
+  _fill(cell, index, [left, top, width, plotWidth]) {
     cell.classList.add("active");
     const columns = this.series.length;
     const [row, series] = [Math.floor(index / columns), this.series[index % columns]];
@@ -36,6 +69,9 @@ var HeatmapChart = class extends LineChart {
     else name.style.setProperty("--level", String(this._levels[index]));
     text.textContent = series.text[row];
     this._tooltip.replaceChildren(title, name, text);
+    this._position([left, top, width, plotWidth]);
+  }
+  _position([left, top, width, plotWidth]) {
     const end = left + width / 2 > plotWidth / 2;
     this._tooltip.classList.toggle("end", end);
     this._tooltip.style.left = `${left + (end ? 0 : width)}px`;
@@ -73,10 +109,15 @@ var HeatmapChart = class extends LineChart {
     const last = this._cells[this._cells.length - 1].getBoundingClientRect();
     const [left, right] = [Math.min(first.left, last.left), Math.max(first.right, last.right)];
     const [x, y] = [e.clientX, e.clientY];
-    if (x < left || x > right || y < first.top || y > last.bottom) return -1;
-    const band = (offset, size, count) => Math.min(count - 1, Math.floor(offset / (size || 1) * count));
-    const column = band(x - left, right - left, columns);
-    return band(y - first.top, last.bottom - first.top, rows) * columns + (this._reversed ? columns - 1 - column : column);
+    if (this._off(x, y, [left, right, first.top, last.bottom])) return -1;
+    const band2 = (offset, size, count) => Math.min(count - 1, Math.floor(offset / (size || 1) * count));
+    const column = band2(x - left, right - left, columns);
+    return band2(y - first.top, last.bottom - first.top, rows) * columns + (this._reversed ? columns - 1 - column : column);
+  }
+  /** Whether a point is off the cells, or on cells scrolled out of view under the row labels. */
+  _off(x, y, [left, right, top, bottom]) {
+    const view = this._scroll.getBoundingClientRect();
+    return x < Math.max(left, view.left) || x > Math.min(right, view.right) || y < top || y > bottom;
   }
   /**
    * The legend: a gradient from the lowest cell's shade to the highest's,
@@ -91,11 +132,43 @@ var HeatmapChart = class extends LineChart {
     [low.textContent, high.textContent] = this._ends;
     scale.className = "heatmap-chart-scale";
     if (this._reversed) scale.style.setProperty("--heatmap-chart-to", "left");
-    scale.style.setProperty("--low", String(this._endLevels[0]));
-    scale.style.setProperty("--high", String(this._endLevels[1]));
+    const [from, to] = this._endLevels;
+    scale.style.setProperty("--low", String(from));
+    scale.style.setProperty("--high", String(to));
+    scale.classList.toggle("diverging", from < 0 && to > 0);
+    scale.style.setProperty("--mid", `${-from / (to - from || 1) * 100}%`);
+    scale.append(...this._bands().filter((level) => level >= from && level <= to).map((level) => {
+      const swatch = document.createElement("span");
+      swatch.style.setProperty("--level", String(level));
+      return swatch;
+    }));
     legend.append(low, scale, high);
     return [legend];
   }
+  /** With data-steps, every band's shade from the lowest to the highest; otherwise none. */
+  _bands() {
+    const steps = this._steps;
+    if (!steps) return [];
+    return Array.from({ length: 2 * steps - 1 }, (_, k) => (k - steps + 1) / (steps - 1));
+  }
+  /** The number of bands data-steps asks for, or 0 for a smooth scale. */
+  get _steps() {
+    const steps = Math.round(this._number("steps") ?? 0);
+    return steps > 1 ? steps : 0;
+  }
+  /**
+   * How a value shades its cell: from 0 at the scale's low end to 1 at its
+   * high end, or with data-mid from -1 to 1 either side of that midpoint,
+   * as far as the further end. With data-steps the shades fall into bands.
+   */
+  _shade(low, high) {
+    const option = (name, fallback) => this._number(name) ?? this.options[name] ?? fallback;
+    const [min, max, mid] = [option("min", low), option("max", high), this._number("mid")];
+    const clamp = (value, floor) => Math.min(1, Math.max(floor, value));
+    const level = mid === null ? (value) => clamp((value - min) / (max - min || 1), 0) : (value) => clamp((Math.min(max, Math.max(min, value)) - mid) / (Math.max(max - mid, mid - min) || 1), -1);
+    const steps = this._steps;
+    return steps ? (value) => band(level(value), steps) : level;
+  }
   /**
    * A grid of the row headers and cells, row by row, with the column headers
    * below. Each cell's --level shades it in CSS.
@@ -109,12 +182,7 @@ var HeatmapChart = class extends LineChart {
       if (value < low) [low, this._ends[0]] = [value, series.text[row]];
       if (value > high) [high, this._ends[1]] = [value, series.text[row]];
     }));
-    const option = (name) => {
-      const value = parseFloat(this.el.dataset[name] ?? "");
-      return Number.isFinite(value) ? value : this.options[name];
-    };
-    const [min, max] = [option("min") ?? low, option("max") ?? high];
-    const shade = (value) => Math.min(1, Math.max(0, (value - min) / (max - min || 1)));
+    const shade = this._shade(low, high);
     this._endLevels = [shade(low), shade(high)];
     const grid = document.createElement("div");
     grid.className = "heatmap-chart-grid";
@@ -131,8 +199,11 @@ var HeatmapChart = class extends LineChart {
     const values = this.el.classList.contains("values");
     this._cells = [];
     this._levels = [];
+    const [rows, cells] = [document.createElement("div"), document.createElement("div")];
+    rows.className = "heatmap-chart-rows";
+    cells.className = "heatmap-chart-cells";
     this.labels.forEach((_, row) => {
-      grid.append(span("heatmap-chart-row", label(this._rows[row].cells[0])));
+      rows.append(span("heatmap-chart-row", label(this._rows[row].cells[0])));
       this.series.forEach((series) => {
         const value = series.values[row];
         const level = value === null ? null : shade(value);
@@ -141,24 +212,35 @@ var HeatmapChart = class extends LineChart {
         else cell.style.setProperty("--level", String(level));
         this._cells.push(cell);
         this._levels.push(level);
-        grid.append(cell);
+        cells.append(cell);
       });
     });
     const labels = this._header.slice(1, columns + 1).map(label);
+    const columnLabels = [];
     labels.forEach((text, column) => {
       if (!text) return;
       let end = column + 1;
       while (end < columns && !labels[end]) end++;
       const element = span("heatmap-chart-column", text);
       element.classList.toggle("run", end > column + 1);
-      element.style.gridArea = `${this.labels.length + 1} / ${column + 2} / auto / ${end + 2}`;
-      grid.append(element);
+      element.style.gridArea = `${this.labels.length + 1} / ${column + 1} / auto / ${end + 1}`;
+      cells.append(element);
+      columnLabels.push(element);
     });
+    this._observeLabels(cells, columnLabels.some((element) => element.classList.contains("run")) ? [] : columnLabels);
+    const scroll = this._scroll = document.createElement("div");
+    scroll.className = "heatmap-chart-scroll";
+    scroll.tabIndex = -1;
+    scroll.addEventListener("focus", () => this._plot.focus());
+    scroll.addEventListener("scroll", () => this._follow(scroll), { passive: true });
+    scroll.append(cells);
+    grid.append(rows, scroll);
     return grid;
   }
 };
+HeatmapChart.key = "Expressive_HeatmapChart";
 
 export {
   HeatmapChart
 };
-//# sourceMappingURL=chunk-GUB3TNO2.mjs.map
+//# sourceMappingURL=chunk-BPF3I2MN.mjs.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/ts/components/heatmapChart.ts"],
+  "sourcesContent": ["import { LineChart, LineChartOptions } from './lineChart';\n\nexport type HeatmapChartOptions = LineChartOptions;\n\n/**\n * A shade in one of `steps` bands, each side of zero on a diverging scale:\n * the lowest band is the empty color, and the highest is the full color.\n */\nfunction band(level: number, steps: number) {\n  return (Math.sign(level) * Math.min(steps - 1, Math.floor(Math.abs(level) * steps))) / (steps - 1);\n}\n\n/**\n * Heatmap chart. It reads its <table> like LineChart, but draws every cell\n * as a square of the grid, shaded from the lowest value to the highest, with\n * the row headers beside it and the column headers below. A `data-label` on\n * a header cell replaces its text on the grid; an empty one hides it. The\n * tooltip shows one cell, and the arrow keys move round the grid. With\n * `data-mid` the scale diverges either side of that value, and with\n * `data-steps` the shades fall into that many bands.\n *\n * Call `update()` after changing the table, or start it with `watch` or\n * `data-watch`.\n */\nexport class HeatmapChart extends LineChart {\n  // No initializers: LineChart's constructor draws before they would run.\n  /** Every cell, row by row. */\n  private _cells: HTMLElement[];\n  /** Each cell's shade from 0 to 1, or -1 to 1 on a diverging scale, or null for a gap. */\n  private _levels: (number | null)[];\n  /** The text of the lowest and highest cells, for the legend. */\n  private _ends: [string, string];\n  /** The shades of the lowest and highest cells, where the legend's gradient runs. */\n  private _endLevels: [number, number];\n  /** The box the cells scroll in, beside the row labels. */\n  private _scroll: HTMLElement;\n\n  protected get _type() {\n    return 'heatmap-chart';\n  }\n\n  /** Color carries the value, so there is no value axis. */\n  protected get _axis() {\n    return false;\n  }\n\n  static key = 'Expressive_HeatmapChart';\n\n  protected get _count() {\n    return this.labels.length * this.series.length;\n  }\n\n  /** Redraws the grid, scrolled where it was. */\n  update() {\n    const left = this._scroll?.scrollLeft;\n    super.update();\n    if (this._scroll && left) this._scroll.scrollLeft = left;\n  }\n\n  /** Highlights one cell, numbered row by row. Pass -1 to hide the tooltip. */\n  show(index: number) {\n    if (!this._tooltip || index === this.activeIndex) return;\n    this._activate(this._cells[index], index);\n  }\n\n  private _activate(cell: HTMLElement | undefined, index: number) {\n    // Measure before the writes below, which would otherwise force a layout.\n    const box = cell ? this._box(cell) : null;\n    this._cells[this.activeIndex]?.classList.remove('active');\n    this.activeIndex = index;\n    this._tooltip.hidden = !box;\n    if (box) this._fill(cell!, index, box);\n  }\n\n  /**\n   * A cell's left, top and width in the plot, past any scrolling of the\n   * grid, and the plot's width. A key can move to a cell scrolled out of a\n   * wide grid, so it scrolls into view first.\n   */\n  private _box(cell: HTMLElement) {\n    if (this._plot.matches(':focus-visible')) cell.scrollIntoView({ block: 'nearest', inline: 'nearest' });\n    return this._measure(cell);\n  }\n\n  private _measure(cell: HTMLElement) {\n    const [box, plot] = [cell.getBoundingClientRect(), this._plot.getBoundingClientRect()];\n    return [box.left - plot.left, box.top - plot.top, box.width, this._plot.clientWidth];\n  }\n\n  /** Keeps the tooltip on its cell as the grid scrolls, and hides it once the cell scrolls out. */\n  private _follow(scroll: HTMLElement) {\n    const cell = this._cells[this.activeIndex];\n    if (!cell) return;\n    const [view, box] = [scroll.getBoundingClientRect(), cell.getBoundingClientRect()];\n    if (box.right <= view.left || box.left >= view.right) this.show(-1);\n    else this._position(this._measure(cell));\n  }\n\n  /** Marks the cell and fills the tooltip beside it, on the side with more room. */\n  private _fill(cell: HTMLElement, index: number, [left, top, width, plotWidth]: number[]) {\n    cell.classList.add('active');\n    const columns = this.series.length;\n    const [row, series] = [Math.floor(index / columns), this.series[index % columns]];\n    const title = document.createElement('strong');\n    title.textContent = this.labels[row];\n    const [name, text] = [document.createElement('span'), document.createElement('span')];\n    name.textContent = series.name;\n    // A gap's swatch is outlined like its cell.\n    if (this._levels[index] === null) name.className = 'gap';\n    else name.style.setProperty('--level', String(this._levels[index]));\n    text.textContent = series.text[row];\n    this._tooltip.replaceChildren(title, name, text);\n    this._position([left, top, width, plotWidth]);\n  }\n\n  private _position([left, top, width, plotWidth]: number[]) {\n    const end = left + width / 2 > plotWidth / 2;\n    this._tooltip.classList.toggle('end', end);\n    this._tooltip.style.left = `${left + (end ? 0 : width)}px`;\n    this._tooltip.style.top = `${top}px`;\n  }\n\n  /** Arrows move the way they point, so left and right swap in RTL. */\n  protected _keyTarget(key: string): number | undefined {\n    // With nothing shown, Escape is left to a dialog or sheet around the chart.\n    if (key === 'Escape') return this.activeIndex < 0 ? undefined : -1;\n    const [columns, last] = [this.series.length, this.labels.length - 1];\n    const index = Math.max(0, this.activeIndex);\n    const [row, column] = [Math.floor(index / columns), index % columns];\n    const [next, back] = this._reversed ? ['ArrowLeft', 'ArrowRight'] : ['ArrowRight', 'ArrowLeft'];\n    const to = {\n      [next]: [row, column + 1],\n      [back]: [row, column - 1],\n      ArrowDown: [row + 1, column],\n      ArrowUp: [row - 1, column],\n      Home: [row, 0],\n      End: [row, columns - 1]\n    }[key];\n    if (!to) return undefined;\n    // The first key after focus or Escape shows the first cell.\n    if (this.activeIndex < 0) return 0;\n    const clamp = (value: number, max: number) => Math.min(max, Math.max(0, value));\n    return clamp(to[0], last) * columns + clamp(to[1], columns - 1);\n  }\n\n  /**\n   * The cell under the pointer by its position, or -1 off the grid. A touch\n   * keeps its first target while it drags, so the target cannot be used. The\n   * cells and gaps are even, so each band's edge falls in a gap and a gap\n   * counts as the nearer cell.\n   */\n  protected _indexAt(e: PointerEvent) {\n    const [columns, rows] = [this.series.length, this.labels.length];\n    const first = this._cells[0].getBoundingClientRect();\n    const last = this._cells[this._cells.length - 1].getBoundingClientRect();\n    const [left, right] = [Math.min(first.left, last.left), Math.max(first.right, last.right)];\n    const [x, y] = [e.clientX, e.clientY];\n    if (this._off(x, y, [left, right, first.top, last.bottom])) return -1;\n    const band = (offset: number, size: number, count: number) =>\n      Math.min(count - 1, Math.floor((offset / (size || 1)) * count));\n    const column = band(x - left, right - left, columns);\n    return band(y - first.top, last.bottom - first.top, rows) * columns + (this._reversed ? columns - 1 - column : column);\n  }\n\n  /** Whether a point is off the cells, or on cells scrolled out of view under the row labels. */\n  private _off(x: number, y: number, [left, right, top, bottom]: number[]) {\n    const view = this._scroll.getBoundingClientRect();\n    return x < Math.max(left, view.left) || x > Math.min(right, view.right) || y < top || y > bottom;\n  }\n\n  /**\n   * The legend: a gradient from the lowest cell's shade to the highest's,\n   * labelled with their text. A fixed scale wider than the data shows only\n   * the part the data uses.\n   */\n  protected _guides(): Element[] {\n    const legend = document.createElement('div');\n    legend.className = 'heatmap-chart-legend';\n    legend.setAttribute('aria-hidden', 'true');\n    const [low, scale, high] = ['span', 'span', 'span'].map((tag) => document.createElement(tag));\n    [low.textContent, high.textContent] = this._ends;\n    scale.className = 'heatmap-chart-scale';\n    if (this._reversed) scale.style.setProperty('--heatmap-chart-to', 'left');\n    const [from, to] = this._endLevels;\n    scale.style.setProperty('--low', String(from));\n    scale.style.setProperty('--high', String(to));\n    // A diverging scale whose data crosses the midpoint passes its empty color.\n    scale.classList.toggle('diverging', from < 0 && to > 0);\n    scale.style.setProperty('--mid', `${(-from / (to - from || 1)) * 100}%`);\n    scale.append(...this._bands().filter((level) => level >= from && level <= to).map((level) => {\n      const swatch = document.createElement('span');\n      swatch.style.setProperty('--level', String(level));\n      return swatch;\n    }));\n    legend.append(low, scale, high);\n    return [legend];\n  }\n\n  /** With data-steps, every band's shade from the lowest to the highest; otherwise none. */\n  private _bands() {\n    const steps = this._steps;\n    if (!steps) return [];\n    return Array.from({ length: 2 * steps - 1 }, (_, k) => (k - steps + 1) / (steps - 1));\n  }\n\n  /** The number of bands data-steps asks for, or 0 for a smooth scale. */\n  private get _steps() {\n    const steps = Math.round(this._number('steps') ?? 0);\n    return steps > 1 ? steps : 0;\n  }\n\n  /**\n   * How a value shades its cell: from 0 at the scale's low end to 1 at its\n   * high end, or with data-mid from -1 to 1 either side of that midpoint,\n   * as far as the further end. With data-steps the shades fall into bands.\n   */\n  private _shade(low: number, high: number) {\n    const option = (name: 'min' | 'max', fallback: number) => this._number(name) ?? this.options[name] ?? fallback;\n    const [min, max, mid] = [option('min', low), option('max', high), this._number('mid')];\n    const clamp = (value: number, floor: number) => Math.min(1, Math.max(floor, value));\n    const level = mid === null\n      ? (value: number) => clamp((value - min) / (max - min || 1), 0)\n      : (value: number) => clamp((Math.min(max, Math.max(min, value)) - mid) / (Math.max(max - mid, mid - min) || 1), -1);\n    const steps = this._steps;\n    return steps ? (value: number) => band(level(value), steps) : level;\n  }\n\n  /**\n   * A grid of the row headers and cells, row by row, with the column headers\n   * below. Each cell's --level shades it in CSS.\n   */\n  protected _draw(): Element {\n    const columns = this.series.length;\n    let [low, high] = [Infinity, -Infinity];\n    this._ends = ['', ''];\n    this.series.forEach((series) => series.values.forEach((value, row) => {\n      if (value === null) return;\n      if (value < low) [low, this._ends[0]] = [value, series.text[row]];\n      if (value > high) [high, this._ends[1]] = [value, series.text[row]];\n    }));\n    const shade = this._shade(low, high);\n    this._endLevels = [shade(low), shade(high)];\n\n    const grid = document.createElement('div');\n    grid.className = 'heatmap-chart-grid';\n    grid.setAttribute('aria-hidden', 'true');\n    grid.style.setProperty('--columns', String(columns));\n    grid.style.setProperty('--rows', String(this.labels.length));\n    const span = (className: string, text = '') => {\n      const element = document.createElement('span');\n      element.className = className;\n      element.textContent = text;\n      return element;\n    };\n    const label = (cell: HTMLTableCellElement | undefined) =>\n      cell?.dataset.label ?? cell?.textContent.trim() ?? '';\n    const values = this.el.classList.contains('values');\n\n    this._cells = [];\n    this._levels = [];\n    // The row labels stay put beside the cells, which scroll when they are too narrow.\n    const [rows, cells] = [document.createElement('div'), document.createElement('div')];\n    rows.className = 'heatmap-chart-rows';\n    cells.className = 'heatmap-chart-cells';\n    this.labels.forEach((_, row) => {\n      rows.append(span('heatmap-chart-row', label(this._rows[row].cells[0])));\n      this.series.forEach((series) => {\n        const value = series.values[row];\n        const level = value === null ? null : shade(value);\n        const cell = span('heatmap-chart-cell', values ? series.text[row] : '');\n        if (level === null) cell.classList.add('gap');\n        else cell.style.setProperty('--level', String(level));\n        this._cells.push(cell);\n        this._levels.push(level);\n        cells.append(cell);\n      });\n    });\n\n    // A column label runs on over the empty labels after it.\n    const labels = this._header.slice(1, columns + 1).map(label);\n    const columnLabels: HTMLElement[] = [];\n    labels.forEach((text, column) => {\n      if (!text) return;\n      let end = column + 1;\n      while (end < columns && !labels[end]) end++;\n      const element = span('heatmap-chart-column', text);\n      element.classList.toggle('run', end > column + 1);\n      element.style.gridArea = `${this.labels.length + 1} / ${column + 1} / auto / ${end + 1}`;\n      cells.append(element);\n      columnLabels.push(element);\n    });\n    // Labels the author already spaced out with empty ones are left as written.\n    this._observeLabels(cells, columnLabels.some((element) => element.classList.contains('run')) ? [] : columnLabels);\n\n    // The plot is the one Tab stop, so the scroll box is not another, and a\n    // press that focuses it hands focus on to the plot.\n    const scroll = (this._scroll = document.createElement('div'));\n    scroll.className = 'heatmap-chart-scroll';\n    scroll.tabIndex = -1;\n    scroll.addEventListener('focus', () => this._plot.focus());\n    scroll.addEventListener('scroll', () => this._follow(scroll), { passive: true });\n    scroll.append(cells);\n    grid.append(rows, scroll);\n    return grid;\n  }\n}\n"],
+  "mappings": "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",
+  "names": ["band"]
+}

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

@@ -0,0 +1,74 @@
+import {
+  Utils,
+  controllerFor
+} from "./chunk-ZVLOUDIJ.mjs";
+
+// src/ts/core/component.ts
+var Component = class {
+  /**
+   * Destroys any instance already on `el`, then spreads `options` over the
+   * class defaults, and `options.i18n` over the default strings, so passing
+   * one string keeps the rest. A subclass passes options it reads from
+   * markup in `options`.
+   */
+  constructor(el, options) {
+    if (!(el instanceof HTMLElement)) {
+      console.error(Error(el + " is not an HTML Element"));
+    }
+    new.target.getInstance(el)?.destroy();
+    this.el = el;
+    const defaults = new.target.defaults;
+    const i18n = defaults.i18n && { i18n: { ...defaults.i18n, ...options?.i18n } };
+    this.options = { ...defaults, ...options, ...i18n };
+    this._events = controllerFor(el);
+    el[new.target.key] = this;
+  }
+  static init(els, options = {}) {
+    const create = (el) => new this(el, options);
+    if (els instanceof Element) return create(els);
+    return els ? Array.from(els, create) : null;
+  }
+  /**
+   * @returns default options for component instance.
+   */
+  static get defaults() {
+    return {};
+  }
+  /**
+   * Retrieves the instance of the class it is called on for the given element.
+   * @param el Associated HTML Element.
+   */
+  static getInstance(el) {
+    return el[this.key];
+  }
+  /**
+   * Runs an `on…` option callback, then fires `expressive:<type>` from the
+   * element, so pages can listen instead of passing options. The callback gets
+   * `args` (the element by default) and the event carries `detail`.
+   *
+   * A callback or listener may close, reopen or destroy the component. Pass
+   * `current` to tell whether the state `type` names still holds; the event
+   * is skipped once it does not, or once the instance is destroyed, and the
+   * result says whether to carry on.
+   */
+  _notify(type, callback, { args = [this.el], detail, current = () => true } = {}) {
+    const live = () => this.constructor.getInstance(this.el) === this && current();
+    if (typeof callback === "function") callback.apply(this, args);
+    if (!live()) return false;
+    Utils.emit(this.el, type, detail);
+    return live();
+  }
+  /**
+   * Destroy plugin instance and teardown. A subclass tears down its own state
+   * and calls this to remove its listeners and release the element.
+   */
+  destroy() {
+    this._events.abort();
+    this.el[this.constructor.key] = void 0;
+  }
+};
+
+export {
+  Component
+};
+//# sourceMappingURL=chunk-CMGXGYUC.mjs.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/ts/core/component.ts"],
+  "sourcesContent": ["import { Utils, controllerFor } from './utils';\n\n/**\n * Base options for component initialization.\n */\nexport interface BaseOptions {}\n\nexport type InitElement = HTMLElement | Element;\nexport type InitElements<T extends InitElement> = NodeListOf<T> | HTMLCollectionOf<T>;\n/** Any component class; `init` reads its element, options and instance types. */\ntype ComponentClass = (new (el: never, options: never) => Component<BaseOptions>) & { key: string };\n/** The element a component class is constructed on. */\ntype ElementOf<C extends ComponentClass> = C extends new (el: infer E, options: never) => unknown ? E : never;\n/** The options `init` accepts for a component class. */\ntype InitOptions<C extends ComponentClass> = Partial<InstanceType<C>['options']>;\n\nexport interface I18nOptions {\n  cancel: string;\n  clear: string;\n  done: string;\n}\n\n/** What {@link Component._notify} passes on, and when it stops. */\nexport interface NotifyOptions {\n  args?: unknown[];\n  detail?: unknown;\n  current?: () => boolean;\n}\n\n/**\n * Base class implementation for Expressive components.\n */\nexport class Component<O extends BaseOptions> {\n  /**\n   * The element property that holds an instance, `Expressive_<Name>`, so page\n   * code can read `el.Expressive_Tabs` as well as call `Tabs.getInstance(el)`.\n   */\n  static key: string;\n  /**\n   * The DOM element the plugin was initialized with.\n   */\n  el: HTMLElement;\n  /**\n   * The options the instance was initialized with.\n   */\n  options: O;\n  /** Aborted by destroy(), which removes every listener added with its signal. */\n  protected _events: AbortController;\n\n  /**\n   * Destroys any instance already on `el`, then spreads `options` over the\n   * class defaults, and `options.i18n` over the default strings, so passing\n   * one string keeps the rest. A subclass passes options it reads from\n   * markup in `options`.\n   */\n  constructor(el: HTMLElement, options: Partial<O>) {\n    // Display error if el is not a valid HTML Element\n    if (!(el instanceof HTMLElement)) {\n      console.error(Error(el + ' is not an HTML Element'));\n    }\n    new.target.getInstance(el)?.destroy();\n    this.el = el;\n    const defaults: Partial<O> & { i18n?: object } = new.target.defaults;\n    const i18n: object = defaults.i18n && { i18n: { ...defaults.i18n, ...(options as typeof defaults)?.i18n } };\n    this.options = { ...defaults, ...options, ...i18n } as O;\n    this._events = controllerFor(el);\n    el[new.target.key] = this;\n  }\n\n  /**\n   * Initializes an instance of the class it is called on.\n   * @param el HTML element.\n   * @param options Component options.\n   */\n  static init<C extends ComponentClass>(this: C, el: ElementOf<C>, options?: InitOptions<C>): InstanceType<C>;\n  /**\n   * Initializes an instance of the class it is called on for each element.\n   * @param els HTML elements.\n   * @param options Component options.\n   */\n  static init<C extends ComponentClass>(\n    this: C,\n    els: InitElements<InitElement>,\n    options?: InitOptions<C>\n  ): InstanceType<C>[];\n  static init<C extends ComponentClass>(\n    this: C,\n    els: ElementOf<C> | InitElements<InitElement>,\n    options: InitOptions<C> = {}\n  ): InstanceType<C> | InstanceType<C>[] {\n    const create = (el: unknown) => new this(el as never, options as never) as InstanceType<C>;\n    if (els instanceof Element) return create(els);\n    return els ? Array.from(els as InitElements<InitElement>, create) : null;\n  }\n\n  /**\n   * @returns default options for component instance.\n   */\n  static get defaults(): BaseOptions {\n    return {};\n  }\n\n  /**\n   * Retrieves the instance of the class it is called on for the given element.\n   * @param el Associated HTML Element.\n   */\n  static getInstance<C extends ComponentClass>(this: C, el: HTMLElement): InstanceType<C> {\n    return el[this.key];\n  }\n\n  /**\n   * Runs an `on\u2026` option callback, then fires `expressive:<type>` from the\n   * element, so pages can listen instead of passing options. The callback gets\n   * `args` (the element by default) and the event carries `detail`.\n   *\n   * A callback or listener may close, reopen or destroy the component. Pass\n   * `current` to tell whether the state `type` names still holds; the event\n   * is skipped once it does not, or once the instance is destroyed, and the\n   * result says whether to carry on.\n   */\n  protected _notify(\n    type: string,\n    callback?: Function | null,\n    { args = [this.el], detail, current = () => true }: NotifyOptions = {}\n  ): boolean {\n    const live = () => (this.constructor as typeof Component).getInstance(this.el) === this && current();\n    if (typeof callback === 'function') callback.apply(this, args);\n    if (!live()) return false;\n    Utils.emit(this.el, type, detail);\n    return live();\n  }\n\n  /**\n   * Destroy plugin instance and teardown. A subclass tears down its own state\n   * and calls this to remove its listeners and release the element.\n   */\n  destroy(): void {\n    this._events.abort();\n    this.el[(this.constructor as typeof Component).key] = undefined;\n  }\n}\n"],
+  "mappings": ";;;;;;AAgCO,IAAM,YAAN,MAAuC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAuB5C,YAAY,IAAiB,SAAqB;AAEhD,QAAI,EAAE,cAAc,cAAc;AAChC,cAAQ,MAAM,MAAM,KAAK,yBAAyB,CAAC;AAAA,IACrD;AACA,eAAW,YAAY,EAAE,GAAG,QAAQ;AACpC,SAAK,KAAK;AACV,UAAM,WAA2C,WAAW;AAC5D,UAAM,OAAe,SAAS,QAAQ,EAAE,MAAM,EAAE,GAAG,SAAS,MAAM,GAAI,SAA6B,KAAK,EAAE;AAC1G,SAAK,UAAU,EAAE,GAAG,UAAU,GAAG,SAAS,GAAG,KAAK;AAClD,SAAK,UAAU,cAAc,EAAE;AAC/B,OAAG,WAAW,GAAG,IAAI;AAAA,EACvB;AAAA,EAkBA,OAAO,KAEL,KACA,UAA0B,CAAC,GACU;AACrC,UAAM,SAAS,CAAC,OAAgB,IAAI,KAAK,IAAa,OAAgB;AACtE,QAAI,eAAe,QAAS,QAAO,OAAO,GAAG;AAC7C,WAAO,MAAM,MAAM,KAAK,KAAkC,MAAM,IAAI;AAAA,EACtE;AAAA;AAAA;AAAA;AAAA,EAKA,WAAW,WAAwB;AACjC,WAAO,CAAC;AAAA,EACV;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,OAAO,YAA+C,IAAkC;AACtF,WAAO,GAAG,KAAK,GAAG;AAAA,EACpB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAYU,QACR,MACA,UACA,EAAE,OAAO,CAAC,KAAK,EAAE,GAAG,QAAQ,UAAU,MAAM,KAAK,IAAmB,CAAC,GAC5D;AACT,UAAM,OAAO,MAAO,KAAK,YAAiC,YAAY,KAAK,EAAE,MAAM,QAAQ,QAAQ;AACnG,QAAI,OAAO,aAAa,WAAY,UAAS,MAAM,MAAM,IAAI;AAC7D,QAAI,CAAC,KAAK,EAAG,QAAO;AACpB,UAAM,KAAK,KAAK,IAAI,MAAM,MAAM;AAChC,WAAO,KAAK;AAAA,EACd;AAAA;AAAA;AAAA;AAAA;AAAA,EAMA,UAAgB;AACd,SAAK,QAAQ,MAAM;AACnB,SAAK,GAAI,KAAK,YAAiC,GAAG,IAAI;AAAA,EACxD;AACF;",
+  "names": []
+}