@sportsdataverse/sdvplot 0.0.0-stage → 0.1.0

package/dist/interact.js

@@ -0,0 +1,809 @@
+import { toId, sameCursor, focusIds } from './chunk-4C3GX6QO.js';
+import { InputError, warn } from './chunk-E7G7VSLV.js';
+import { select, brush, brushX, brushY, Delaunay, bisector, pointer } from 'd3';
+
+// src/interact/highlight.ts
+var SVG_NS = "http://www.w3.org/2000/svg";
+var CSS = ".sdv-focus [data-sdv-id]:not(.sdv-hl):not([data-sdv-axis]){opacity:var(--sdv-dim-opacity,0.2)}";
+var EMPTY = /* @__PURE__ */ new Set();
+var roots = /* @__PURE__ */ new WeakMap();
+function hasDom() {
+  return typeof window !== "undefined" && typeof document !== "undefined";
+}
+var markId = (el) => el.hasAttribute("data-sdv-axis") ? "" : el.getAttribute("data-sdv-id") ?? "";
+function stampedIn(node) {
+  if (node.nodeType !== 1) return [];
+  const el = node;
+  const out = Array.from(el.querySelectorAll("[data-sdv-id]"));
+  if (el.hasAttribute("data-sdv-id")) out.unshift(el);
+  return out;
+}
+function add(index, id, el) {
+  const set = index.get(id);
+  if (set) set.add(el);
+  else index.set(id, /* @__PURE__ */ new Set([el]));
+}
+function apply(root, state, records) {
+  for (const r of records) {
+    for (const el of Array.from(r.removedNodes).flatMap(stampedIn)) {
+      const id = markId(el);
+      const set = state.index.get(id);
+      if (set === void 0 || root.contains(el)) continue;
+      set.delete(el);
+      if (set.size === 0) state.index.delete(id);
+    }
+    for (const el of Array.from(r.addedNodes).flatMap(stampedIn)) {
+      const id = markId(el);
+      if (id === "" || !root.contains(el)) continue;
+      add(state.index, id, el);
+      if (state.ids?.has(id)) el.classList.add("sdv-hl");
+    }
+  }
+}
+function litOf(root) {
+  const known = roots.get(root);
+  if (known) return known;
+  const index = /* @__PURE__ */ new Map();
+  for (const el of stampedIn(root)) {
+    const id = markId(el);
+    if (id !== "" && el !== root) add(index, id, el);
+  }
+  const doc = root.ownerDocument;
+  const style = root.namespaceURI === SVG_NS ? doc.createElementNS(SVG_NS, "style") : doc.createElement("style");
+  style.setAttribute("data-sdv-interact", "");
+  style.textContent = CSS;
+  root.append(style);
+  const state = { index, mo: new MutationObserver((records) => apply(root, state, records)), ids: null };
+  state.mo.observe(root, { childList: true, subtree: true });
+  roots.set(root, state);
+  return state;
+}
+function highlight(root, ids) {
+  if (!hasDom()) return [];
+  const state = litOf(root);
+  apply(root, state, state.mo.takeRecords());
+  const prev = state.ids ?? EMPTY;
+  const next = ids ?? EMPTY;
+  for (const id of prev) {
+    if (next.has(id)) continue;
+    for (const el of state.index.get(id) ?? []) el.classList.remove("sdv-hl");
+  }
+  const missing = [];
+  for (const id of next) {
+    const els = state.index.get(id);
+    if (els === void 0) missing.push(id);
+    else if (!prev.has(id)) for (const el of els) el.classList.add("sdv-hl");
+  }
+  root.classList.toggle("sdv-focus", ids !== null);
+  state.ids = ids === null ? null : new Set(ids);
+  return missing;
+}
+
+// src/interact/brush.ts
+var SVG_NS2 = "http://www.w3.org/2000/svg";
+var get = (row, f) => typeof f === "function" ? f(row) : row[f];
+var num = (v) => v === null || v === void 0 || v === "" ? Number.NaN : Number(v);
+var span = (a, b) => {
+  const p = num(a);
+  const q = num(b);
+  return p <= q ? [p, q] : [q, p];
+};
+var NOOP = { move: () => {
+}, destroy: () => {
+} };
+function scaleOf(s) {
+  if (typeof s !== "function") return s;
+  const f = s;
+  const { invert: inv, bandwidth: bw, domain: dom } = s;
+  return {
+    apply: (v) => f(v),
+    ...inv && { invert: (p) => inv.call(s, Number(p)) },
+    range: s.range(),
+    ...bw && { bandwidth: bw.call(s) },
+    ...dom && { domain: dom.call(s) }
+  };
+}
+var boxOf = (svg) => {
+  const v = (svg.getAttribute("viewBox") ?? "").trim().split(/[\s,]+/).map(Number);
+  if (v.length === 4 && v.every(Number.isFinite)) return v;
+  return [0, 0, Number(svg.getAttribute("width")) || 0, Number(svg.getAttribute("height")) || 0];
+};
+function brushFilter(figure, store, o) {
+  if (o.x === void 0 && o.y === void 0)
+    throw new InputError("brushFilter needs x, y or both: the fields its brushed axes encode");
+  if (o.empty !== void 0 && o.empty !== "dim" && o.empty !== "clear")
+    throw new InputError(`brushFilter: empty is "dim" or "clear", not ${JSON.stringify(o.empty)}`);
+  const xs = o.x === void 0 ? void 0 : scaleOf(o.scales?.x ?? figure.scale?.("x"));
+  const ys = o.y === void 0 ? void 0 : scaleOf(o.scales?.y ?? figure.scale?.("y"));
+  const usable = (s) => typeof s?.apply === "function" && typeof s?.invert === "function";
+  if (o.x !== void 0 && !usable(xs) || o.y !== void 0 && !usable(ys))
+    throw new InputError(
+      "brushFilter needs continuous x and y scales on the axes it brushes; band and point scales cannot be inverted, and a chart without figure.scale passes `scales`"
+    );
+  if (!hasDom()) return NOOP;
+  const svg = figure.tagName.toLowerCase() === "svg" ? figure : Array.from(figure.querySelectorAll(":scope > svg")).at(-1);
+  if (!svg) throw new InputError("brushFilter: no <svg> in the figure");
+  const [bx, by, bw, bh] = boxOf(svg);
+  const pixels = (s, from, to) => {
+    const r = Array.from(s?.range ?? [], Number).filter(Number.isFinite);
+    return r.length > 0 ? [Math.min(...r), Math.max(...r)] : [from, to];
+  };
+  const [x0px, x1px] = pixels(xs, bx, bx + bw);
+  const [y0px, y1px] = pixels(ys, by, by + bh);
+  const node = svg.ownerDocument.createElementNS(SVG_NS2, "g");
+  node.setAttribute("class", "sdv-brush");
+  svg.insertBefore(node, svg.firstChild);
+  const g = select(node);
+  let mine = null;
+  let picked = null;
+  let last = "";
+  let asked = null;
+  const idOf = (row, i) => o.id === void 0 ? String(i) : toId(get(row, o.id));
+  const b = (xs && ys ? brush() : xs ? brushX() : brushY()).extent([
+    [x0px, y0px],
+    [x1px, y1px]
+  ]);
+  const release = () => {
+    last = "";
+    if (mine === null) return;
+    const own = store.getState().selected === picked;
+    mine = null;
+    picked = null;
+    store.set(own ? { selected: [], predicate: null } : { predicate: null });
+  };
+  const erase = () => {
+    g.call(b.move, null);
+  };
+  b.on("brush end", (event) => {
+    const sel = event.selection;
+    if (sel === null) return release();
+    const [px, py] = typeof sel[0] === "number" ? xs ? [sel, null] : [null, sel] : [
+      [sel[0][0], sel[1][0]],
+      [sel[0][1], sel[1][1]]
+    ];
+    const tests = [];
+    if (o.x !== void 0 && px)
+      tests.push([o.x, ...asked?.x ?? span(xs?.invert?.(px[0]), xs?.invert?.(px[1]))]);
+    if (o.y !== void 0 && py)
+      tests.push([o.y, ...asked?.y ?? span(ys?.invert?.(py[0]), ys?.invert?.(py[1]))]);
+    const key = tests.map(([, lo, hi]) => `${lo}|${hi}`).join("|");
+    if (key === last) return;
+    const inside = (row) => tests.every(([f, lo, hi]) => {
+      const v = num(get(row, f));
+      return v >= lo && v <= hi;
+    });
+    const ids = o.data.flatMap((row, i) => inside(row) ? [idOf(row, i)] : []);
+    if (ids.length === 0 && o.empty === "clear") {
+      release();
+      if (event.type === "end") erase();
+      return;
+    }
+    last = key;
+    mine = inside;
+    const had = store.getState().selected;
+    store.set({ selected: ids, predicate: inside });
+    const now = store.getState().selected;
+    picked = now !== had || had === picked ? now : null;
+  });
+  g.call(b);
+  const off = store.subscribe((s) => {
+    if (mine === null || s.predicate === mine) return;
+    mine = null;
+    erase();
+  });
+  const at = (s, r, axis) => {
+    if (s === void 0) return null;
+    if (r === void 0)
+      throw new InputError(`brushFilter: move needs region.${axis}, the brushed ${axis} range`);
+    return span(s.apply(r[0]), s.apply(r[1]));
+  };
+  return {
+    move(region) {
+      if (region === null) {
+        g.call(b.move, null);
+        return;
+      }
+      const px = at(xs, region.x, "x");
+      const py = at(ys, region.y, "y");
+      asked = {
+        ...px && region.x && { x: span(region.x[0], region.x[1]) },
+        ...py && region.y && { y: span(region.y[0], region.y[1]) }
+      };
+      try {
+        g.call(
+          b.move,
+          px && py ? [
+            [px[0], py[0]],
+            [px[1], py[1]]
+          ] : px ?? py
+        );
+      } finally {
+        asked = null;
+      }
+    },
+    destroy() {
+      off();
+      node.remove();
+      if (mine !== null && store.getState().predicate === mine) release();
+    }
+  };
+}
+var SVG_NS3 = "http://www.w3.org/2000/svg";
+var CSS2 = ".sdv-cursor line,.sdv-cursor ellipse{fill:none;stroke:var(--sdv-cursor-color,rgba(0,0,0,.2));stroke-width:var(--sdv-cursor-width,10px)}.sdv-cursor rect{fill:var(--sdv-cursor-color,rgba(0,0,0,.2))}.sdv-cursor circle{fill:currentColor}";
+var FLIP_AT = 30 / 35;
+var isNum = (v) => typeof v === "number" && Number.isFinite(v);
+var extent = (r) => {
+  const a = Array.from(r ?? [], Number).filter(Number.isFinite);
+  return a.length > 0 ? [Math.min(...a), Math.max(...a)] : null;
+};
+var box = (svg) => {
+  const v = (svg.getAttribute("viewBox") ?? "").trim().split(/[\s,]+/).map(Number);
+  const [x, y, w, h] = v.length === 4 && v.every(Number.isFinite) ? v : [0, 0, Number(svg.getAttribute("width")) || 0, Number(svg.getAttribute("height")) || 0];
+  return { x: [x ?? 0, (x ?? 0) + (w ?? 0)], y: [y ?? 0, (y ?? 0) + (h ?? 0)] };
+};
+function linkCursor(root, store, o) {
+  const { shape } = o;
+  if (typeof o.field !== "string" || o.field === "")
+    throw new InputError("linkCursor needs a non-empty cursor field");
+  if (typeof shape !== "object" || shape === null)
+    throw new InputError("linkCursor needs a shape: what to draw");
+  if (shape.axis !== "x" && shape.axis !== "y" && shape.axis !== "ring")
+    throw new InputError(`linkCursor shape.axis must be "x", "y" or "ring", got ${String(shape.axis)}`);
+  if (o.flipAt !== void 0 && !(o.flipAt > 0 && o.flipAt <= 1))
+    throw new InputError(`linkCursor flipAt must be in (0, 1], got ${String(o.flipAt)}`);
+  const ring = shape.axis === "ring" ? { ...shape, x: scaleOf(shape.x), y: scaleOf(shape.y) } : null;
+  const line = shape.axis === "ring" ? null : { ...shape, scale: scaleOf(shape.scale), cross: scaleOf(shape.cross) };
+  const isScale = (s) => typeof s?.apply === "function";
+  if (ring ? !isScale(ring.x) || !isScale(ring.y) : !isScale(line?.scale) || line?.cross !== void 0 && !isScale(line.cross))
+    throw new InputError(
+      `linkCursor: shape.${ring ? "x and shape.y" : line?.cross === void 0 ? "scale" : "scale and shape.cross"} must be scales, a Plot figure's or d3's`
+    );
+  if (ring) {
+    const c = ring.center;
+    if (!Array.isArray(c) || c.length !== 2 || !c.every(Number.isFinite))
+      throw new InputError(`linkCursor ring center must be two finite numbers, got ${JSON.stringify(c)}`);
+    if (o.emit === true) throw new InputError("linkCursor: a ring follows the cursor but never emits it");
+    if (o.label || o.dot)
+      throw new InputError("linkCursor: label and dot are for an x or y cursor, not a ring");
+  }
+  if (line?.width !== void 0 && !(isNum(line.width) && line.width > 0))
+    throw new InputError(`linkCursor shape.width must be a finite number > 0, got ${String(line.width)}`);
+  if (line?.axis === "y" && o.label)
+    throw new InputError("linkCursor: label is a readout beside an x cursor");
+  let starts = null;
+  if (line && typeof line.scale.bandwidth === "number") {
+    const d = Array.from(line.scale.domain ?? []);
+    if (d.length === 0 || !d.every(isNum))
+      throw new InputError("linkCursor: a band scale's domain must be numbers, each band's first value");
+    starts = [...d].sort((a, b) => a - b);
+  }
+  const emit = line !== null && o.emit !== false;
+  if (emit && starts === null && typeof line?.scale.invert !== "function")
+    throw new InputError("linkCursor: emitting needs a scale with invert (linear) or a bandwidth (band)");
+  const figure = root;
+  const cross = line?.cross ?? (line && typeof figure.scale === "function" ? figure.scale(line.axis === "x" ? "y" : "x") : void 0);
+  if (o.dot && !cross) throw new InputError("linkCursor: dot needs a cross scale (shape.cross)");
+  if (!hasDom()) return () => {
+  };
+  const svg = root.tagName.toLowerCase() === "svg" ? root : Array.from(root.querySelectorAll(":scope > svg")).at(-1);
+  if (!svg) throw new InputError("linkCursor: no <svg> in the root");
+  const doc = svg.ownerDocument;
+  const make = (tag, parent) => {
+    const el = doc.createElementNS(SVG_NS3, tag);
+    parent.append(el);
+    return el;
+  };
+  if (!svg.querySelector(':scope > style[data-sdv-interact="cursor"]')) {
+    const style = make("style", svg);
+    style.setAttribute("data-sdv-interact", "cursor");
+    style.textContent = CSS2;
+  }
+  const g = make("g", svg);
+  g.setAttribute("class", "sdv-cursor");
+  g.setAttribute("pointer-events", "none");
+  g.setAttribute("display", "none");
+  const mark = make(ring ? "ellipse" : starts || line?.width ? "rect" : "line", g);
+  const text = o.label ? make("text", g) : null;
+  const tspans = [];
+  const circle = o.dot ? make("circle", g) : null;
+  circle?.setAttribute("r", "3");
+  const vb = box(svg);
+  const along = line ? extent(line.scale.range) ?? vb[line.axis] : vb.x;
+  const across = line ? extent(cross?.range) ?? vb[line.axis === "x" ? "y" : "x"] : vb.y;
+  const end = (s, i) => {
+    const next = s[i + 1];
+    if (next !== void 0) return next;
+    const last = s[i] ?? 0;
+    const prev = s[i - 1];
+    return prev === void 0 ? Number.POSITIVE_INFINITY : last + (last - prev);
+  };
+  const set = (el, attrs) => {
+    for (const [k, v] of Object.entries(attrs)) el.setAttribute(k, String(v));
+  };
+  const place = (v) => {
+    if (!line) return null;
+    const px = (d) => Number(line.scale.apply(d));
+    let lo;
+    let hi;
+    let mid;
+    if (starts) {
+      let i = -1;
+      for (let k = 0; k < starts.length && (starts[k] ?? 0) <= v; k++) i = k;
+      if (i < 0 || v >= end(starts, i)) return null;
+      lo = px(starts[i] ?? 0);
+      hi = lo + (line.scale.bandwidth ?? 0);
+      mid = (lo + hi) / 2;
+    } else {
+      const w = (line.width ?? 0) / 2;
+      const [p, q] = [px(v - w), px(v + w)];
+      [lo, hi, mid] = [Math.min(p, q), Math.max(p, q), px(v)];
+    }
+    return [lo, hi, mid].every(Number.isFinite) ? [lo, hi, mid] : null;
+  };
+  const draw = (c) => {
+    const v = c?.value;
+    if (v === void 0) {
+      g.setAttribute("display", "none");
+      return;
+    }
+    if (ring) {
+      const [c0, c1] = ring.center;
+      const cx = Number(ring.x.apply(c0));
+      const cy = Number(ring.y.apply(c1));
+      const rx = Math.abs(Number(ring.x.apply(c0 + v)) - cx);
+      const ry = Math.abs(Number(ring.y.apply(c1 + v)) - cy);
+      if (![cx, cy, rx, ry].every(Number.isFinite)) {
+        g.setAttribute("display", "none");
+        return;
+      }
+      set(mark, { cx, cy, rx, ry });
+      g.removeAttribute("display");
+      return;
+    }
+    const at = place(v);
+    if (!line || !at) {
+      g.setAttribute("display", "none");
+      return;
+    }
+    const [lo, hi, mid] = at;
+    const [a0, a1] = across;
+    const x = line.axis === "x";
+    if (mark.tagName === "rect")
+      set(
+        mark,
+        x ? { x: lo, width: hi - lo, y: a0, height: a1 - a0 } : { y: lo, height: hi - lo, x: a0, width: a1 - a0 }
+      );
+    else set(mark, x ? { x1: mid, x2: mid, y1: a0, y2: a1 } : { y1: mid, y2: mid, x1: a0, x2: a1 });
+    if (text && o.label) {
+      const lines = o.label(v);
+      const [p0, p1] = along;
+      const flip = (mid - p0) / (p1 - p0 || 1) > (o.flipAt ?? FLIP_AT);
+      while (tspans.length < lines.length) {
+        const el = make("tspan", text);
+        el.setAttribute("dy", tspans.length === 0 ? "1em" : "1.3em");
+        const t = doc.createTextNode("");
+        el.append(t);
+        tspans.push({ el, line: t });
+      }
+      set(text, { y: a0, "text-anchor": flip ? "end" : "start" });
+      for (const [i, { el, line: t }] of tspans.entries()) {
+        el.setAttribute("x", String(flip ? lo - 10 : hi + 10));
+        t.data = lines[i] ?? "";
+      }
+    }
+    if (circle && o.dot && cross) {
+      const dv = o.dot(v);
+      const cp = dv === null ? Number.NaN : Number(cross.apply(dv));
+      if (Number.isFinite(cp)) {
+        set(circle, x ? { cx: mid, cy: cp } : { cx: cp, cy: mid });
+        circle.removeAttribute("display");
+      } else circle.setAttribute("display", "none");
+    }
+    g.removeAttribute("display");
+  };
+  let drawn = null;
+  const sync = (c) => {
+    const mine = c !== null && c.field === o.field ? c : null;
+    if (sameCursor(mine, drawn)) return;
+    drawn = mine;
+    draw(mine);
+  };
+  const offs = [store.subscribe((s) => sync(s.cursor))];
+  offs.push(() => g.remove());
+  sync(store.getState().cursor);
+  let wrote = null;
+  const clear = () => {
+    if (wrote !== null && store.getState().cursor === wrote) store.set({ cursor: null });
+    wrote = null;
+  };
+  if (line && emit) {
+    const valueAt = (p) => {
+      const [p0, p1] = along;
+      if (!(p >= p0 && p <= p1)) return null;
+      if (starts) {
+        let best = 0;
+        let gap = Number.POSITIVE_INFINITY;
+        for (const [i, s2] of starts.entries()) {
+          const d = Math.abs(Number(line.scale.apply(s2)) + (line.scale.bandwidth ?? 0) / 2 - p);
+          if (d < gap) [best, gap] = [i, d];
+        }
+        const e = end(starts, best);
+        const s = starts[best] ?? 0;
+        return Number.isFinite(e) ? (s + e) / 2 : s;
+      }
+      const v = Number(line.scale.invert?.(p));
+      return o.snap ? o.snap(v) : v;
+    };
+    const move = (e) => {
+      const [mx, my] = pointer(e, svg);
+      const v = valueAt(line.axis === "x" ? mx : my);
+      if (v === null || !Number.isFinite(v)) clear();
+      else {
+        const had = store.getState().cursor;
+        store.set({ cursor: { field: o.field, value: v } });
+        const now = store.getState().cursor;
+        wrote = now !== had || had === wrote ? now : null;
+      }
+    };
+    const on = (type, fn, capture) => {
+      svg.addEventListener(type, fn, { capture });
+      offs.push(() => svg.removeEventListener(type, fn, { capture }));
+    };
+    on("pointermove", move, true);
+    on("pointerdown", move, true);
+    on("pointerleave", clear, false);
+    on("pointercancel", clear, false);
+  }
+  return () => {
+    for (const off of offs) off();
+    clear();
+  };
+}
+
+// src/interact/link.ts
+var first = (ids) => {
+  for (const id of ids) return id;
+  return null;
+};
+var MARK = '[data-sdv-id]:not([data-sdv-id=""]):not([data-sdv-axis])';
+var markAt = (figure, e) => {
+  const t = e.target;
+  const mark = t?.nodeType === 1 ? t.closest(MARK) : null;
+  return mark && figure.contains(mark) ? mark : null;
+};
+var warned = /* @__PURE__ */ new WeakSet();
+var links = /* @__PURE__ */ new WeakMap();
+var toggling = /* @__PURE__ */ new WeakSet();
+var TOGGLE_ATTRS = ["role", "tabindex", "aria-checked", "aria-label"];
+function linkSelection(store, o) {
+  const toggled = toggleMarks(o);
+  const { figure, table, hover = true } = o;
+  if (typeof hover !== "boolean" && typeof hover?.id !== "function")
+    throw new InputError("linkSelection: hover is true, false or { id: (datum) => link id }");
+  if (!hasDom()) return () => {
+  };
+  if (figure && toggled.length > 0 && toggling.has(figure))
+    throw new InputError(
+      'linkSelection: this figure already has a live select: "toggle" link (a click would toggle twice); tear it down first'
+    );
+  if (figure) links.set(figure, (links.get(figure) ?? 0) + 1);
+  const offs = [];
+  let wrote = null;
+  const writeHover = (id) => {
+    const had = store.getState().hover;
+    store.set({ hover: id === null ? [] : [id] });
+    const now = store.getState().hover;
+    wrote = now !== had || had === wrote ? now : null;
+  };
+  let syncing = false;
+  const sync = (s) => {
+    if (figure) {
+      const focus = focusIds(s);
+      const missing = highlight(figure, focus);
+      if (focus !== null && focus.size > 0 && missing.length === focus.size && !warned.has(figure)) {
+        warned.add(figure);
+        const shown = missing.slice(0, 5).join(", ");
+        warn(
+          `link:missing:${shown}`,
+          `none of the linked ids (${shown}${missing.length > 5 ? ", \u2026" : ""}) is drawn in this figure; the marks' id channel and the table's rowKey must hold the same values`
+        );
+      }
+    }
+    if (table) {
+      syncing = true;
+      try {
+        table.setSelection(s.selected);
+        table.setExternalFilter(s.predicate);
+        table.setHover(first(s.hover));
+      } finally {
+        syncing = false;
+      }
+    }
+  };
+  const on = (el, type, fn) => {
+    el.addEventListener(type, fn);
+    offs.push(() => el.removeEventListener(type, fn));
+  };
+  if (figure && hover === true) {
+    on(figure, "mouseover", (e) => {
+      const mark = markAt(figure, e);
+      writeHover(mark ? mark.getAttribute("data-sdv-id") ?? "" : null);
+    });
+    on(figure, "mouseleave", () => writeHover(null));
+  } else if (figure && typeof hover === "object") {
+    on(figure, "input", (e) => {
+      const v = e.target?.value;
+      writeHover(v === null || v === void 0 ? null : toId(hover.id(v)));
+    });
+  }
+  if (table) {
+    offs.push(
+      table.subscribe((e) => {
+        if (syncing) return;
+        if (e.type === "hover") writeHover(e.id);
+        else if (e.type === "select") store.set({ selected: e.ids });
+      })
+    );
+  }
+  if (figure && toggled.length > 0) offs.push(toggles(figure, store, toggled));
+  offs.push(store.subscribe(sync));
+  sync(store.getState());
+  let live = true;
+  return () => {
+    if (!live) return;
+    live = false;
+    if (wrote !== null && wrote.size > 0 && store.getState().hover === wrote) store.set({ hover: [] });
+    wrote = null;
+    for (const off of offs) off();
+    if (figure) {
+      const n = (links.get(figure) ?? 1) - 1;
+      if (n > 0) links.set(figure, n);
+      else {
+        links.delete(figure);
+        highlight(figure, null);
+      }
+    }
+    if (table) {
+      const s = store.getState();
+      if (s.predicate !== null) table.setExternalFilter(null);
+      if (s.hover.size > 0) table.setHover(null);
+    }
+  };
+}
+function toggleMarks(t) {
+  if (t.select === void 0) return [];
+  if (t.select !== "toggle")
+    throw new InputError(`linkSelection: select is "toggle", not ${JSON.stringify(t.select)}`);
+  if (t.figure === void 0)
+    throw new InputError('linkSelection: select "toggle" needs the figure whose marks it toggles');
+  const marks = Array.from(t.figure.querySelectorAll(MARK));
+  const linked = marks.find((m) => m.closest("a[href]") !== null);
+  if (linked)
+    throw new InputError(
+      `linkSelection: select "toggle" would put a checkbox inside a link (the mark "${linked.getAttribute("data-sdv-id")}" is in an <a href>); drop one`
+    );
+  return marks;
+}
+function toggles(figure, store, marks) {
+  const byId = /* @__PURE__ */ new Map();
+  let shown = store.getState().selected;
+  const own = marks.map((m) => TOGGLE_ATTRS.map((a) => m.getAttribute(a)));
+  for (const m of marks) {
+    const id = m.getAttribute("data-sdv-id") ?? "";
+    const same = byId.get(id);
+    if (same) same.push(m);
+    else byId.set(id, [m]);
+    m.setAttribute("role", "checkbox");
+    m.setAttribute("tabindex", "0");
+    m.setAttribute("aria-checked", String(shown.has(id)));
+    if (!m.hasAttribute("aria-label") && !m.hasAttribute("aria-labelledby") && !m.querySelector(":scope > title"))
+      m.setAttribute("aria-label", id);
+  }
+  const flip = (e) => {
+    const id = markAt(figure, e)?.getAttribute("data-sdv-id");
+    if (!id) return;
+    if (e.type === "keydown") {
+      const key = e.key;
+      if (key !== "Enter" && key !== " ") return;
+      e.preventDefault();
+    }
+    const next = new Set(store.getState().selected);
+    if (!next.delete(id)) next.add(id);
+    store.set({ selected: next });
+  };
+  const check = (ids, unless, value) => {
+    for (const id of ids)
+      if (!unless.has(id)) for (const m of byId.get(id) ?? []) m.setAttribute("aria-checked", value);
+  };
+  const off = store.subscribe((s) => {
+    if (s.selected === shown) return;
+    check(shown, s.selected, "false");
+    check(s.selected, shown, "true");
+    shown = s.selected;
+  });
+  figure.addEventListener("click", flip);
+  figure.addEventListener("keydown", flip);
+  toggling.add(figure);
+  return () => {
+    toggling.delete(figure);
+    off();
+    figure.removeEventListener("click", flip);
+    figure.removeEventListener("keydown", flip);
+    for (const [i, m] of marks.entries())
+      for (const [k, a] of TOGGLE_ATTRS.entries()) {
+        const v = own[i]?.[k] ?? null;
+        if (v === null) m.removeAttribute(a);
+        else m.setAttribute(a, v);
+      }
+  };
+}
+
+// src/interact/tooltip.ts
+var SVG_NS4 = "http://www.w3.org/2000/svg";
+var CSS3 = ".sdv-tip>.sdv-tip-box{fill:var(--sdv-tip-bg,rgba(34,34,34,.85))}.sdv-tip>text{fill:var(--sdv-tip-fg,#ddd)}.sdv-tip>.sdv-tip-swatch{stroke:var(--sdv-tip-fg,#ddd)}";
+function svgBox(svg) {
+  const [x = Number.NaN, y = Number.NaN, width = Number.NaN, height = Number.NaN] = (svg.getAttribute("viewBox") ?? "").trim().split(/[\s,]+/).map(Number);
+  if ([x, y, width, height].every(Number.isFinite)) return { x, y, width, height };
+  const side = (name) => {
+    const v = svg.getAttribute(name)?.trim();
+    const n = v ? Number(v) : Number.NaN;
+    return Number.isFinite(n) ? n : Number.POSITIVE_INFINITY;
+  };
+  return { x: 0, y: 0, width: side("width"), height: side("height") };
+}
+function svgRoot(root, fn) {
+  if (root.namespaceURI !== SVG_NS4 || root.localName !== "svg")
+    throw new InputError(`${fn} needs an <svg> root (got <${root.localName}>)`);
+  return root;
+}
+var NOOP2 = { show: () => {
+}, hide: () => {
+}, destroy: () => {
+} };
+function tooltip(root, o = {}) {
+  const { fontSize = 11 } = o;
+  if (!(fontSize > 0)) throw new InputError(`tooltip: fontSize must be a number > 0 (got ${fontSize})`);
+  for (const [k, v] of [
+    ["width", o.width],
+    ["height", o.height]
+  ])
+    if (v !== void 0 && !(v >= 0)) throw new InputError(`tooltip: ${k} must be a number >= 0 (got ${v})`);
+  if (!hasDom()) return NOOP2;
+  const svg = svgRoot(root, "tooltip");
+  const el = (name, attrs) => {
+    const e = svg.ownerDocument.createElementNS(SVG_NS4, name);
+    for (const [k, v] of Object.entries(attrs)) e.setAttribute(k, String(v));
+    return e;
+  };
+  if (!svg.querySelector(':scope > style[data-sdv-interact="tip"]')) {
+    const style = el("style", { "data-sdv-interact": "tip" });
+    style.textContent = CSS3;
+    svg.append(style);
+  }
+  const box2 = el("rect", { class: "sdv-tip-box", rx: 4 });
+  const text = el("text", { "font-size": fontSize });
+  const swatch = el("rect", { class: "sdv-tip-swatch", width: 12, height: 12, rx: 2 });
+  const g = el("g", { class: "sdv-tip", "pointer-events": "none", display: "none" });
+  g.append(box2, text);
+  svg.append(g);
+  return {
+    show(x, y, lines, color) {
+      const b = svgBox(svg);
+      const w = Math.ceil(
+        16 + 0.6 * fontSize * Math.max(0, ...lines.map((l) => l.length)) + (color ? 20 : 0)
+      );
+      const h = Math.ceil(10 + 1.35 * fontSize * lines.length);
+      text.replaceChildren(
+        ...lines.map((line, i) => {
+          const t = el("tspan", { x: 8, dy: i === 0 ? "1.3em" : "1.35em" });
+          if (i === 0) t.setAttribute("font-weight", "bold");
+          t.textContent = line;
+          return t;
+        })
+      );
+      box2.setAttribute("width", String(w));
+      box2.setAttribute("height", String(h));
+      if (color) {
+        swatch.setAttribute("fill", color);
+        swatch.setAttribute("x", String(w - 20));
+        swatch.setAttribute("y", String((h - 12) / 2));
+        g.append(swatch);
+      } else swatch.remove();
+      const right = b.x + (o.width ?? b.width);
+      const bottom = b.y + (o.height ?? b.height);
+      const tx = Math.max(b.x, x + 12 + w > right ? x - 12 - w : x + 12);
+      const ty = Math.min(Math.max(b.y, y - h - 8), bottom - h);
+      g.setAttribute("transform", `translate(${tx},${ty})`);
+      g.removeAttribute("display");
+      if (svg.lastElementChild !== g) svg.append(g);
+    },
+    hide() {
+      g.setAttribute("display", "none");
+    },
+    destroy() {
+      g.remove();
+    }
+  };
+}
+
+// src/interact/nearest.ts
+var NOOP3 = { update: () => {
+}, destroy: () => {
+} };
+var DIMENSIONS = ["x", "y", "xy"];
+function nearestHover(root, store, o) {
+  const { dimension = "xy", radius = Number.POSITIVE_INFINITY, padding = 0, label } = o;
+  if (!DIMENSIONS.includes(dimension))
+    throw new InputError(`nearestHover: dimension must be "x", "y" or "xy" (got ${String(dimension)})`);
+  if (!(radius >= 0)) throw new InputError(`nearestHover: radius must be a number >= 0 (got ${radius})`);
+  if (!(padding >= 0)) throw new InputError(`nearestHover: padding must be a number >= 0 (got ${padding})`);
+  if (!hasDom()) return NOOP3;
+  const svg = svgRoot(root, "nearestHover");
+  const tip = label ? tooltip(svg) : null;
+  const far = (p, px, py) => dimension === "x" ? Math.abs(p.x - px) : dimension === "y" ? Math.abs(p.y - py) : Math.hypot(p.x - px, p.y - py);
+  let find = () => void 0;
+  const index = (points) => {
+    const ps = points.filter((p) => Number.isFinite(p.x) && Number.isFinite(p.y));
+    if (ps.length === 0) find = () => void 0;
+    else if (dimension === "xy") {
+      const d = Delaunay.from(
+        ps,
+        (p) => p.x,
+        (p) => p.y
+      );
+      find = (px, py) => ps[d.find(px, py)];
+    } else {
+      const k = dimension;
+      const sorted = ps.slice().sort((a, b2) => a[k] - b2[k]);
+      const b = bisector((p) => p[k]);
+      find = (px, py) => sorted[b.center(sorted, k === "x" ? px : py)];
+    }
+  };
+  index(o.points);
+  let cur;
+  let wrote = null;
+  const to = (p) => {
+    const id = p === void 0 ? null : p.id;
+    if (id === cur && (id === null || store.getState().hover === wrote)) return;
+    cur = id;
+    const had = store.getState().hover;
+    store.set({ hover: id === null ? [] : [id] });
+    const now = store.getState().hover;
+    wrote = now !== had || had === wrote ? now : null;
+    const shown = p !== void 0 && label ? label(p.id) : null;
+    if (shown && p) tip?.show(p.x, p.y, shown.lines, shown.swatch);
+    else tip?.hide();
+  };
+  const move = (e) => {
+    const [px, py] = pointer(e, svg);
+    const b = svgBox(svg);
+    const inside = px >= b.x + padding && px <= b.x + b.width - padding && py >= b.y + padding && py <= b.y + b.height - padding;
+    const p = inside ? find(px, py) : void 0;
+    to(p !== void 0 && far(p, px, py) <= radius ? p : void 0);
+  };
+  const leave = () => to(void 0);
+  const listeners = [
+    ["pointermove", move, true],
+    ["pointerdown", move, true],
+    ["pointerleave", leave, false],
+    ["pointercancel", leave, false]
+  ];
+  for (const [type, fn, capture] of listeners) svg.addEventListener(type, fn, { capture });
+  return {
+    update(points) {
+      index(points);
+      cur = void 0;
+    },
+    destroy() {
+      for (const [type, fn, capture] of listeners) svg.removeEventListener(type, fn, { capture });
+      tip?.destroy();
+      if (wrote !== null && wrote.size > 0 && store.getState().hover === wrote) store.set({ hover: [] });
+      cur = void 0;
+      wrote = null;
+    }
+  };
+}
+
+export { brushFilter, hasDom, highlight, linkCursor, linkSelection, nearestHover, tooltip };
+//# sourceMappingURL=interact.js.map
+//# sourceMappingURL=interact.js.map