@weng-lab/visualization 2.6.0-beta.0 → 2.6.0-beta.1

package/dist/visualization.es102.js

@@ -1,98 +1,28 @@
-import { jsxs as X, jsx as l } from "react/jsx-runtime";
-import { useRef as Y, useEffect as G, useCallback as p } from "react";
-import { drawHeatmapOverview as H } from "./visualization.es100.js";
-import { SELECTION_COLOR as J } from "./visualization.es99.js";
-const f = (u, e, c) => Math.min(Math.max(u, e), c), j = 5, Q = 2, _ = ({
-  canvasCellParams: u,
-  xMax: e,
-  yMax: c,
-  viewportWidth: m,
-  viewportHeight: d,
-  scrollLeft: R,
-  scrollTop: P,
-  width: i,
-  height: a,
-  onNavigate: b,
-  onCanvasClick: g,
-  onReady: M,
-  paused: x = !1
-}) => {
-  const D = Y(null), r = e > 0 ? i / e : 0, o = c > 0 ? a / c : 0, I = Y(M);
-  I.current = M, G(() => {
-    const t = D.current;
-    if (!t || x || r <= 0 || o <= 0) return;
-    const n = requestAnimationFrame(() => {
-      const s = t.getContext("2d");
-      s && (H(s, u), I.current?.());
-    });
-    return () => cancelAnimationFrame(n);
-  }, [u, e, c, r, o, x]);
-  const T = p((t, n) => {
-    b(f(t - m / 2, 0, Math.max(0, e - m)), f(n - d / 2, 0, Math.max(0, c - d)));
-  }, [b, m, d, e, c]), F = p((t) => {
-    if (g) {
-      g();
-      return;
-    }
-    if (r <= 0 || o <= 0) return;
-    const n = t.currentTarget.getBoundingClientRect();
-    T((t.clientX - n.left) / r, (t.clientY - n.top) / o);
-  }, [g, T, r, o]), K = p((t) => {
-    t.stopPropagation(), t.currentTarget.setPointerCapture(t.pointerId);
-  }, []), U = p((t) => {
-    r <= 0 || o <= 0 || !t.currentTarget.hasPointerCapture(t.pointerId) || b(f(R + t.movementX / r, 0, Math.max(0, e - m)), f(P + t.movementY / o, 0, Math.max(0, c - d)));
-  }, [R, P, r, o, e, c, m, d, b]), $ = p((t) => {
-    t.currentTarget.releasePointerCapture(t.pointerId);
-  }, []), {
-    columns: h,
-    rows: E
-  } = u.selectionMarks, q = u.data.length, {
-    numRows: A
-  } = u, C = (t, n, s) => {
-    const L = t * s / n, k = s / n, z = Math.max(0, Q - k) / 2;
-    return [L - z, k + 2 * z];
-  }, O = f(R * r, 0, i), S = f(P * o, 0, a), y = Math.max(0, Math.min(m * r, i - O)), B = Math.max(0, Math.min(d * o, a - S));
-  return /* @__PURE__ */ X("div", { style: {
-    position: "relative",
-    width: i,
-    height: a
-  }, children: [
-    /* @__PURE__ */ l("canvas", { ref: D, width: i * (window.devicePixelRatio || 1), height: a * (window.devicePixelRatio || 1), style: {
-      width: i,
-      height: a,
-      display: "block",
-      cursor: "pointer",
-      border: "1px solid #d5d5d5",
-      boxSizing: "border-box"
-    }, onPointerDown: F }),
-    /* @__PURE__ */ l("div", { onPointerDown: K, onPointerMove: U, onPointerUp: $, style: {
-      position: "absolute",
-      left: O,
-      top: S,
-      width: y,
-      height: B,
-      border: "2px solid #0d0f98",
-      backgroundColor: "rgba(13, 15, 152, 0.15)",
-      cursor: "grab",
-      boxSizing: "border-box"
-    } }),
-    (h.size > 0 || E.size > 0) && /* @__PURE__ */ l("svg", { width: i, height: a, style: {
-      position: "absolute",
-      inset: 0,
-      pointerEvents: "none"
-    }, "aria-hidden": !0, children: /* @__PURE__ */ X("g", { fill: J, children: [
-      [...h].map((t) => {
-        const [n, s] = C(t, q, i);
-        return /* @__PURE__ */ l("rect", { x: n, y: 0, width: s, height: j }, `c${t}`);
-      }),
-      [...E].map((t) => {
-        const [n, s] = C(A - 1 - t, A, a);
-        return /* @__PURE__ */ l("rect", { x: 0, y: n, width: j, height: s }, `r${t}`);
-      })
-    ] }) })
-  ] });
+import { jsx as l, jsxs as R, Fragment as y } from "react/jsx-runtime";
+import { c as f } from "react/compiler-runtime";
+const c = "#666", d = 1, S = [2, 2], H = (h) => {
+  const t = f(11), {
+    position: x,
+    boundedWidth: e,
+    boundedHeight: o
+  } = h, {
+    x: s,
+    y: n
+  } = x;
+  let r;
+  t[0] !== o || t[1] !== e || t[2] !== n ? (r = n >= 0 && n <= o && /* @__PURE__ */ l("line", { x1: 0, x2: e, y1: n, y2: n, stroke: c, strokeWidth: d, strokeDasharray: S.join(","), pointerEvents: "none" }), t[0] = o, t[1] = e, t[2] = n, t[3] = r) : r = t[3];
+  let i;
+  t[4] !== o || t[5] !== e || t[6] !== s ? (i = s >= 0 && s <= e && /* @__PURE__ */ l("line", { x1: s, x2: s, y1: 0, y2: o, stroke: c, strokeWidth: d, strokeDasharray: S.join(","), pointerEvents: "none" }), t[4] = o, t[5] = e, t[6] = s, t[7] = i) : i = t[7];
+  let a;
+  return t[8] !== r || t[9] !== i ? (a = /* @__PURE__ */ R(y, { children: [
+    r,
+    i
+  ] }), t[8] = r, t[9] = i, t[10] = a) : a = t[10], a;
 };
 export {
-  _ as default
+  S as CROSSHAIR_DASH,
+  c as CROSSHAIR_STROKE,
+  d as CROSSHAIR_STROKE_WIDTH,
+  H as default
 };
 //# sourceMappingURL=visualization.es102.js.map

package/dist/visualization.es102.js.map

@@ -1 +1 @@
-{"version":3,"file":"visualization.es102.js","sources":["../src/components/Heatmap/scrollable/HeatmapMiniMap.tsx"],"sourcesContent":["import { useCallback, useEffect, useRef } from \"react\";\nimport { drawHeatmapOverview, type CanvasCellParams } from \"../HeatmapCanvasCells\";\nimport { SELECTION_COLOR } from \"../heatmapSelection\";\n\nexport interface HeatmapMiniMapProps {\n  canvasCellParams: CanvasCellParams;\n  xMax: number;\n  yMax: number;\n  viewportWidth: number;\n  viewportHeight: number;\n  scrollLeft: number;\n  scrollTop: number;\n  width: number;\n  height: number;\n  onNavigate: (left: number, top: number) => void;\n  onCanvasClick?: () => void;\n  /** Fires after each draw, so the expanded popup can hide its spinner. */\n  onReady?: () => void;\n  /**\n   * Skips redrawing while out of sight - the inline minimap under the expanded one - so a sweep\n   * doesn't draw the whole grid twice. Redraws once lifted.\n   */\n  paused?: boolean;\n}\n\nconst clamp = (value: number, min: number, max: number) => Math.min(Math.max(value, min), max);\n\n/** How far a selection mark reaches in from the edge, and its narrowest width. */\nconst MARK_DEPTH = 5;\nconst MARK_MIN_WIDTH = 2;\n\nconst HeatmapMiniMap = ({\n  canvasCellParams,\n  xMax,\n  yMax,\n  viewportWidth,\n  viewportHeight,\n  scrollLeft,\n  scrollTop,\n  width,\n  height,\n  onNavigate,\n  onCanvasClick,\n  onReady,\n  paused = false,\n}: HeatmapMiniMapProps) => {\n  const canvasRef = useRef<HTMLCanvasElement | null>(null);\n  const scaleX = xMax > 0 ? width / xMax : 0;\n  const scaleY = yMax > 0 ? height / yMax : 0;\n\n  // A ref, so an inline onReady doesn't re-run the draw on every parent render.\n  const onReadyRef = useRef(onReady);\n  onReadyRef.current = onReady;\n\n  useEffect(() => {\n    const canvas = canvasRef.current;\n    if (!canvas || paused || scaleX <= 0 || scaleY <= 0) return;\n    // A frame later, so the expanded popup paints before the whole-grid draw.\n    const raf = requestAnimationFrame(() => {\n      const ctx = canvas.getContext(\"2d\");\n      if (!ctx) return;\n      drawHeatmapOverview(ctx, canvasCellParams);\n      onReadyRef.current?.();\n    });\n    return () => cancelAnimationFrame(raf);\n  }, [canvasCellParams, xMax, yMax, scaleX, scaleY, paused]);\n\n  const navigateCentered = useCallback(\n    (contentX: number, contentY: number) => {\n      onNavigate(\n        clamp(contentX - viewportWidth / 2, 0, Math.max(0, xMax - viewportWidth)),\n        clamp(contentY - viewportHeight / 2, 0, Math.max(0, yMax - viewportHeight))\n      );\n    },\n    [onNavigate, viewportWidth, viewportHeight, xMax, yMax]\n  );\n\n  const handleCanvasPointerDown = useCallback(\n    (event: React.PointerEvent<HTMLCanvasElement>) => {\n      if (onCanvasClick) {\n        onCanvasClick();\n        return;\n      }\n      if (scaleX <= 0 || scaleY <= 0) return;\n      const rect = event.currentTarget.getBoundingClientRect();\n      navigateCentered((event.clientX - rect.left) / scaleX, (event.clientY - rect.top) / scaleY);\n    },\n    [onCanvasClick, navigateCentered, scaleX, scaleY]\n  );\n\n  const handleRectPointerDown = useCallback((event: React.PointerEvent<HTMLDivElement>) => {\n    event.stopPropagation();\n    event.currentTarget.setPointerCapture(event.pointerId);\n  }, []);\n\n  const handleRectPointerMove = useCallback(\n    (event: React.PointerEvent<HTMLDivElement>) => {\n      if (scaleX <= 0 || scaleY <= 0 || !event.currentTarget.hasPointerCapture(event.pointerId)) return;\n      onNavigate(\n        clamp(scrollLeft + event.movementX / scaleX, 0, Math.max(0, xMax - viewportWidth)),\n        clamp(scrollTop + event.movementY / scaleY, 0, Math.max(0, yMax - viewportHeight))\n      );\n    },\n    [scrollLeft, scrollTop, scaleX, scaleY, xMax, yMax, viewportWidth, viewportHeight, onNavigate]\n  );\n\n  const handleRectPointerUp = useCallback((event: React.PointerEvent<HTMLDivElement>) => {\n    event.currentTarget.releasePointerCapture(event.pointerId);\n  }, []);\n\n  const { columns, rows } = canvasCellParams.selectionMarks;\n  const numColumns = canvasCellParams.data.length;\n  const { numRows } = canvasCellParams;\n  // Cell i's span along an edge `size` pixels long, widened to at least MARK_MIN_WIDTH.\n  const markSpan = (i: number, cells: number, size: number) => {\n    const from = (i * size) / cells;\n    const run = size / cells;\n    const extra = Math.max(0, MARK_MIN_WIDTH - run) / 2;\n    return [from - extra, run + 2 * extra] as const;\n  };\n\n  const rectLeft = clamp(scrollLeft * scaleX, 0, width);\n  const rectTop = clamp(scrollTop * scaleY, 0, height);\n  const rectWidth = Math.max(0, Math.min(viewportWidth * scaleX, width - rectLeft));\n  const rectHeight = Math.max(0, Math.min(viewportHeight * scaleY, height - rectTop));\n\n  return (\n    <div style={{ position: \"relative\", width, height }}>\n      <canvas\n        ref={canvasRef}\n        width={width * (window.devicePixelRatio || 1)}\n        height={height * (window.devicePixelRatio || 1)}\n        style={{ width, height, display: \"block\", cursor: \"pointer\", border: \"1px solid #d5d5d5\", boxSizing: \"border-box\" }}\n        onPointerDown={handleCanvasPointerDown}\n      />\n      <div\n        onPointerDown={handleRectPointerDown}\n        onPointerMove={handleRectPointerMove}\n        onPointerUp={handleRectPointerUp}\n        style={{\n          position: \"absolute\",\n          left: rectLeft,\n          top: rectTop,\n          width: rectWidth,\n          height: rectHeight,\n          border: \"2px solid #0d0f98\",\n          backgroundColor: \"rgba(13, 15, 152, 0.15)\",\n          cursor: \"grab\",\n          boxSizing: \"border-box\",\n        }}\n      />\n      {/*\n        The selection's columns and rows, marked along the top and left edges since a column here\n        can be under a pixel wide. Above the viewport rectangle so its border can't cover them.\n      */}\n      {(columns.size > 0 || rows.size > 0) && (\n        <svg\n          width={width}\n          height={height}\n          style={{ position: \"absolute\", inset: 0, pointerEvents: \"none\" }}\n          aria-hidden\n        >\n          <g fill={SELECTION_COLOR}>\n            {[...columns].map((column) => {\n              const [x, w] = markSpan(column, numColumns, width);\n              return <rect key={`c${column}`} x={x} y={0} width={w} height={MARK_DEPTH} />;\n            })}\n            {/* Row 0 is at the bottom. */}\n            {[...rows].map((row) => {\n              const [y, h] = markSpan(numRows - 1 - row, numRows, height);\n              return <rect key={`r${row}`} x={0} y={y} width={MARK_DEPTH} height={h} />;\n            })}\n          </g>\n        </svg>\n      )}\n    </div>\n  );\n};\n\nexport default HeatmapMiniMap;\n"],"names":["clamp","value","min","max","Math","MARK_DEPTH","MARK_MIN_WIDTH","HeatmapMiniMap","canvasCellParams","xMax","yMax","viewportWidth","viewportHeight","scrollLeft","scrollTop","width","height","onNavigate","onCanvasClick","onReady","paused","canvasRef","useRef","scaleX","scaleY","onReadyRef","current","useEffect","canvas","raf","requestAnimationFrame","ctx","getContext","drawHeatmapOverview","cancelAnimationFrame","navigateCentered","useCallback","contentX","contentY","handleCanvasPointerDown","event","rect","currentTarget","getBoundingClientRect","clientX","left","clientY","top","handleRectPointerDown","stopPropagation","setPointerCapture","pointerId","handleRectPointerMove","hasPointerCapture","movementX","movementY","handleRectPointerUp","releasePointerCapture","columns","rows","selectionMarks","numColumns","data","length","numRows","markSpan","i","cells","size","from","run","extra","rectLeft","rectTop","rectWidth","rectHeight","jsxs","position","jsx","window","devicePixelRatio","display","cursor","border","boxSizing","backgroundColor","inset","pointerEvents","SELECTION_COLOR","map","column","x","w","row","y","h"],"mappings":"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"}
+{"version":3,"file":"visualization.es102.js","sources":["../src/components/ScatterPlot/Crosshair.tsx"],"sourcesContent":["import { CrosshairPosition } from \"./types\";\n\nexport const CROSSHAIR_STROKE = \"#666\";\nexport const CROSSHAIR_STROKE_WIDTH = 1;\n/** Dash pattern in pixels. Kept as numbers so the minimap can scale it to match. */\nexport const CROSSHAIR_DASH = [2, 2];\n\ntype CrosshairProps = {\n    /** Crosshair position in pixels, relative to the top left of the plot area. */\n    position: CrosshairPosition;\n    boundedWidth: number;\n    boundedHeight: number;\n};\n\n/**\n * Thin lines spanning the plot area through the crosshair position.\n *\n * Each line is drawn only when its own axis is in view, so a crosshair mirrored from another\n * plot still shows the axis you can see rather than disappearing entirely.\n */\nconst Crosshair = ({ position, boundedWidth, boundedHeight }: CrosshairProps) => {\n    const { x, y } = position;\n\n    return (\n        <>\n            {y >= 0 && y <= boundedHeight && (\n                <line\n                    x1={0}\n                    x2={boundedWidth}\n                    y1={y}\n                    y2={y}\n                    stroke={CROSSHAIR_STROKE}\n                    strokeWidth={CROSSHAIR_STROKE_WIDTH}\n                    strokeDasharray={CROSSHAIR_DASH.join(\",\")}\n                    pointerEvents=\"none\"\n                />\n            )}\n            {x >= 0 && x <= boundedWidth && (\n                <line\n                    x1={x}\n                    x2={x}\n                    y1={0}\n                    y2={boundedHeight}\n                    stroke={CROSSHAIR_STROKE}\n                    strokeWidth={CROSSHAIR_STROKE_WIDTH}\n                    strokeDasharray={CROSSHAIR_DASH.join(\",\")}\n                    pointerEvents=\"none\"\n                />\n            )}\n        </>\n    );\n};\n\nexport default Crosshair;\n"],"names":["CROSSHAIR_STROKE","CROSSHAIR_STROKE_WIDTH","CROSSHAIR_DASH","Crosshair","t0","$","_c","position","boundedWidth","boundedHeight","x","y","t1","jsx","join","t2","t3"],"mappings":";;AAEO,MAAMA,IAAmB,QACnBC,IAAyB,GAEzBC,IAAiB,CAAC,GAAG,CAAC,GAe7BC,IAAYC,CAAAA,MAAA;AAAA,QAAAC,IAAAC,EAAA,EAAA,GAAC;AAAA,IAAAC,UAAAA;AAAAA,IAAAC,cAAAA;AAAAA,IAAAC,eAAAA;AAAAA,EAAAA,IAAAL,GACf;AAAA,IAAAM,GAAAA;AAAAA,IAAAC,GAAAA;AAAAA,EAAAA,IAAiBJ;AAAS,MAAAK;AAAA,EAAAP,EAAA,CAAA,MAAAI,KAAAJ,SAAAG,KAAAH,EAAA,CAAA,MAAAM,KAIjBC,IAAAD,KAAK,KAAKA,KAAKF,KACZ,gBAAAI,EAAA,UACQ,IAAA,GACAL,IAAAA,GACAG,IAAAA,GACAA,IAAAA,GACIX,QAAAA,GACKC,aAAAA,GACI,iBAAAC,EAAcY,KAAM,GAAG,GAC1B,eAAA,OAAA,CAAM,GAE3BT,OAAAI,GAAAJ,OAAAG,GAAAH,OAAAM,GAAAN,OAAAO,KAAAA,IAAAP,EAAA,CAAA;AAAA,MAAAU;AAAA,EAAAV,EAAA,CAAA,MAAAI,KAAAJ,SAAAG,KAAAH,EAAA,CAAA,MAAAK,KACAK,IAAAL,KAAK,KAAKA,KAAKF,KACZ,gBAAAK,EAAA,UACQH,IAAAA,GACAA,IAAAA,GACA,IAAA,GACAD,IAAAA,GACIT,QAAAA,GACKC,aAAAA,GACI,iBAAAC,EAAcY,KAAM,GAAG,GAC1B,eAAA,OAAA,CAAM,GAE3BT,OAAAI,GAAAJ,OAAAG,GAAAH,OAAAK,GAAAL,OAAAU,KAAAA,IAAAV,EAAA,CAAA;AAAA,MAAAW;AAAA,SAAAX,EAAA,CAAA,MAAAO,KAAAP,SAAAU,KAxBLC,2BACKJ,UAAAA;AAAAA,IAAAA;AAAAA,IAYAG;AAAAA,EAAAA,GAWA,GACFV,OAAAO,GAAAP,OAAAU,GAAAV,QAAAW,KAAAA,IAAAX,EAAA,EAAA,GAzBHW;AAyBG;"}

package/dist/visualization.es103.js

@@ -1,178 +1,88 @@
-import { jsx as s, jsxs as g } from "react/jsx-runtime";
 import { c as q } from "react/compiler-runtime";
-import { useRef as B, useState as L, useEffect as F } from "react";
-import { createPortal as J } from "react-dom";
-import Q from "./visualization.es102.js";
-const Y = 94, ee = 90, O = 16, te = 2147483647, T = 440, W = 40, ne = 12, ae = (z) => {
-  const e = q(40);
-  let o, r, a, t;
-  e[0] !== z ? ({
-    onClose: t,
-    containerRef: o,
-    legend: r,
-    ...a
-  } = z, e[0] = z, e[1] = o, e[2] = r, e[3] = a, e[4] = t) : (o = e[1], r = e[2], a = e[3], t = e[4]);
-  const G = B(null), [n, U] = L(null);
-  let _, x;
-  e[5] !== n || e[6] !== o || e[7] !== t ? (_ = () => {
-    const u = (b) => {
-      const l = b.target;
-      o.current?.contains(l) || G.current?.contains(l) || n && l !== n && n.contains(l) || t();
-    }, y = (b) => {
-      b.key === "Escape" && t();
-    };
-    return document.addEventListener("pointerdown", u), document.addEventListener("keydown", y), () => {
-      document.removeEventListener("pointerdown", u), document.removeEventListener("keydown", y);
-    };
-  }, x = [o, t, n], e[5] = n, e[6] = o, e[7] = t, e[8] = _, e[9] = x) : (_ = e[8], x = e[9]), F(_, x);
-  const [i, j] = L(null), [A, $] = L(!1);
-  let v;
-  e[10] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (v = () => $(!0), e[10] = v) : v = e[10];
-  const V = v, C = B(null);
-  let w;
-  e[11] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (w = (u) => {
-    if (C.current?.disconnect(), C.current = null, !u) {
-      j(null);
+import { useState as w } from "react";
+import { rescaleX as A, rescaleY as B, isPointInLasso as F } from "./visualization.es18.js";
+import G from "./visualization.es248.js";
+const Q = (k) => {
+  const t = q(27), {
+    pointData: S,
+    margin: s,
+    xScale: v,
+    yScale: g,
+    onSelectionChange: M
+  } = k;
+  let r;
+  t[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (r = [], t[0] = r) : r = t[0];
+  const [n, c] = w(r);
+  let f;
+  t[1] !== s.left || t[2] !== s.top ? (f = (e) => {
+    if (e?.x === void 0 || e?.y === void 0)
       return;
-    }
-    const y = new ResizeObserver((b) => {
-      const [l] = b;
-      if (!l)
-        return;
-      const {
-        width: X,
-        height: Z
-      } = l.contentRect;
-      j({
-        width: Math.floor(X),
-        height: Math.floor(Z)
-      });
-    });
-    y.observe(u), C.current = y;
-  }, e[11] = w) : w = e[11];
-  const K = w, P = Math.min(T, i?.width ?? T);
-  let I, M;
-  e[12] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (I = {
-    position: "fixed",
-    inset: 0,
-    zIndex: te,
-    background: "rgba(0,0,0,0.45)",
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "center"
-  }, M = /* @__PURE__ */ s("style", { children: "@keyframes heatmapMiniMapSpinnerRotate { to { transform: rotate(360deg); } }" }), e[12] = I, e[13] = M) : (I = e[12], M = e[13]);
-  let S, E, R;
-  e[14] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (S = {
-    position: "relative",
-    width: `${Y}vw`,
-    height: `${ee}vh`,
-    boxSizing: "border-box",
-    display: "flex",
-    flexDirection: "column",
-    background: "#fff",
-    border: "1px solid #d5d5d5",
-    borderRadius: 8,
-    boxShadow: "0 8px 32px rgba(0,0,0,0.25)",
-    overflow: "hidden"
-  }, E = {
-    flexShrink: 0,
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "space-between",
-    padding: `10px ${O}px`,
-    background: "#f7f7f8",
-    borderBottom: "1px solid #e5e5e5"
-  }, R = /* @__PURE__ */ s("span", { style: {
-    fontSize: 14,
-    fontWeight: 600,
-    color: "#333"
-  }, children: "Minimap" }), e[14] = S, e[15] = E, e[16] = R) : (S = e[14], E = e[15], R = e[16]);
-  let D;
-  e[17] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (D = {
-    width: 26,
-    height: 26,
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "center",
-    padding: 0,
-    border: "none",
-    borderRadius: "50%",
-    background: "#fff",
-    color: "#555",
-    fontSize: 16,
-    lineHeight: 1,
-    cursor: "pointer"
-  }, e[17] = D) : D = e[17];
+    const o = e.x, l = e.y;
+    c((i) => [...i, [{
+      x: o - s.left,
+      y: l - s.top
+    }]]);
+  }, t[1] = s.left, t[2] = s.top, t[3] = f) : f = t[3];
+  const X = f;
   let d;
-  e[18] !== t ? (d = /* @__PURE__ */ g("div", { style: E, children: [
-    R,
-    /* @__PURE__ */ s("button", { type: "button", "aria-label": "Close expanded minimap", onClick: t, style: D, children: "×" })
-  ] }), e[18] = t, e[19] = d) : d = e[19];
-  let k;
-  e[20] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (k = {
-    flex: 1,
-    minHeight: 0,
-    display: "flex",
-    flexDirection: "column",
-    gap: ne,
-    padding: O
-  }, e[20] = k) : k = e[20];
-  let c;
-  e[21] !== n || e[22] !== r || e[23] !== P ? (c = r && /* @__PURE__ */ s("svg", { width: P, height: W, style: {
-    flexShrink: 0,
-    display: "block",
-    overflow: "visible"
-  }, children: r({
-    width: P,
-    height: W,
-    orientation: "horizontal",
-    overlayContainer: n ?? void 0
-  }) }), e[21] = n, e[22] = r, e[23] = P, e[24] = c) : c = e[24];
-  let H;
-  e[25] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (H = {
-    flex: 1,
-    minHeight: 0,
-    position: "relative"
-  }, e[25] = H) : H = e[25];
-  let f;
-  e[26] !== A ? (f = !A && /* @__PURE__ */ s("div", { "aria-label": "Loading minimap", style: {
-    position: "absolute",
-    inset: 0,
-    zIndex: 1,
-    display: "flex",
-    alignItems: "center",
-    justifyContent: "center",
-    pointerEvents: "none"
-  }, children: /* @__PURE__ */ s("div", { style: {
-    width: 40,
-    height: 40,
-    borderRadius: "50%",
-    border: "4px solid #e5e5e5",
-    borderTopColor: "#0d0f98",
-    animation: "heatmapMiniMapSpinnerRotate 0.8s linear infinite"
-  } }) }), e[26] = A, e[27] = f) : f = e[27];
-  let h;
-  e[28] !== a || e[29] !== i ? (h = i && i.width > 0 && i.height > 0 && /* @__PURE__ */ s(Q, { ...a, width: i.width, height: i.height, onReady: V }), e[28] = a, e[29] = i, e[30] = h) : h = e[30];
+  t[4] !== s.left || t[5] !== s.top ? (d = (e) => {
+    if (e?.x === void 0 || e?.y === void 0)
+      return;
+    const o = e.x - s.left, l = e.y - s.top;
+    c((i) => {
+      const a = [...i], p = {
+        x: o + e.dx,
+        y: l + e.dy
+      }, $ = a.length - 1;
+      return a[$] = [...a[$] || [], p], a;
+    });
+  }, t[4] = s.left, t[5] = s.top, t[6] = d) : d = t[6];
+  const Y = d;
+  let x;
+  t[7] !== n || t[8] !== M || t[9] !== S || t[10] !== v || t[11] !== g ? (x = (e) => {
+    const o = n[n.length - 1];
+    if (!o) {
+      c([]);
+      return;
+    }
+    const l = A(v, e.transformMatrix.translateX, e.transformMatrix.scaleX), i = B(g, e.transformMatrix.translateY, e.transformMatrix.scaleY), a = S.filter((p) => F({
+      x: l(p.x),
+      y: i(p.y)
+    }, o));
+    M?.(a), c([]);
+  }, t[7] = n, t[8] = M, t[9] = S, t[10] = v, t[11] = g, t[12] = x) : x = t[12];
+  const h = x;
   let m;
-  e[31] !== f || e[32] !== h ? (m = /* @__PURE__ */ g("div", { ref: K, style: H, children: [
-    f,
-    h
-  ] }), e[31] = f, e[32] = h, e[33] = m) : m = e[33];
-  let p;
-  e[34] !== c || e[35] !== m ? (p = /* @__PURE__ */ g("div", { style: k, children: [
-    c,
-    m
-  ] }), e[34] = c, e[35] = m, e[36] = p) : p = e[36];
-  let N;
-  return e[37] !== d || e[38] !== p ? (N = J(/* @__PURE__ */ g("div", { ref: U, style: I, children: [
-    M,
-    /* @__PURE__ */ g("div", { ref: G, style: S, children: [
-      d,
-      p
-    ] })
-  ] }), document.body), e[37] = d, e[38] = p, e[39] = N) : N = e[39], N;
+  t[13] !== Y || t[14] !== X ? (m = {
+    onDragStart: X,
+    onDragMove: Y,
+    resetOnStart: !0
+  }, t[13] = Y, t[14] = X, t[15] = m) : m = t[15];
+  const {
+    x: E,
+    y: O,
+    dx: L,
+    dy: u,
+    isDragging: I,
+    dragStart: j,
+    dragEnd: P,
+    dragMove: T
+  } = G(m), b = E === void 0 ? 0 : E, C = O === void 0 ? 0 : O;
+  let y;
+  return t[16] !== h || t[17] !== P || t[18] !== T || t[19] !== j || t[20] !== L || t[21] !== u || t[22] !== I || t[23] !== n || t[24] !== b || t[25] !== C ? (y = {
+    lines: n,
+    isDragging: I,
+    x: b,
+    y: C,
+    dx: L,
+    dy: u,
+    dragStart: j,
+    dragMove: T,
+    dragEnd: P,
+    completeSelection: h
+  }, t[16] = h, t[17] = P, t[18] = T, t[19] = j, t[20] = L, t[21] = u, t[22] = I, t[23] = n, t[24] = b, t[25] = C, t[26] = y) : y = t[26], y;
 };
 export {
-  ae as default
+  Q as useDragSelection
 };
 //# sourceMappingURL=visualization.es103.js.map

package/dist/visualization.es103.js.map

@@ -1 +1 @@
-{"version":3,"file":"visualization.es103.js","sources":["../src/components/Heatmap/scrollable/HeatmapMiniMapPopup.tsx"],"sourcesContent":["import { useCallback, useEffect, useRef, useState, type ReactNode, type RefObject } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport type { HeatmapLegendFrame } from \"../types\";\nimport HeatmapMiniMap, { type HeatmapMiniMapProps } from \"./HeatmapMiniMap\";\n\n// Nearly the whole screen, with enough backdrop showing that it reads as a popup.\nconst MINI_MAP_POPUP_WIDTH_VW = 94;\nconst MINI_MAP_POPUP_HEIGHT_VH = 90;\nconst MINI_MAP_POPUP_PADDING = 16;\n// Portaled to <body>, since a transformed ancestor would trap `position: fixed`, and stacked\n// above anything else the host page puts on top.\nconst MINI_MAP_POPUP_Z_INDEX = 2147483647;\n// The legend's band across the top: long enough to sweep with some precision.\nconst LEGEND_BAND_WIDTH = 440;\nconst LEGEND_BAND_HEIGHT = 40;\nconst LEGEND_BAND_GAP = 12;\n\ntype MiniMapPassThroughProps = Omit<HeatmapMiniMapProps, \"width\" | \"height\" | \"onCanvasClick\">;\n\nexport interface HeatmapMiniMapPopupProps extends MiniMapPassThroughProps {\n  onClose: () => void;\n  /** The inline minimap's container, where a click doesn't count as outside the popup. */\n  containerRef: RefObject<HTMLDivElement | null>;\n  /** Draws the plot's legend in a band across the top. Omitted where the plot shows no legend. */\n  legend?: (frame: HeatmapLegendFrame) => ReactNode;\n}\n\nconst HeatmapMiniMapPopup = ({ onClose, containerRef, legend, ...miniMapProps }: HeatmapMiniMapPopupProps) => {\n  const popupRef = useRef<HTMLDivElement | null>(null);\n  // The legend's tooltips portal into the backdrop to show above the popup. State rather than a\n  // ref, so the legend re-renders once it exists.\n  const [backdrop, setBackdrop] = useState<HTMLDivElement | null>(null);\n  useEffect(() => {\n    const handlePointerDown = (event: PointerEvent) => {\n      const target = event.target as Node;\n      if (containerRef.current?.contains(target) || popupRef.current?.contains(target)) return;\n      // An overlay the legend opened is part of the popup too; the backdrop itself is outside it.\n      if (backdrop && target !== backdrop && backdrop.contains(target)) return;\n      onClose();\n    };\n    const handleKeyDown = (event: KeyboardEvent) => {\n      if (event.key === \"Escape\") onClose();\n    };\n    document.addEventListener(\"pointerdown\", handlePointerDown);\n    document.addEventListener(\"keydown\", handleKeyDown);\n    return () => {\n      document.removeEventListener(\"pointerdown\", handlePointerDown);\n      document.removeEventListener(\"keydown\", handleKeyDown);\n    };\n  }, [containerRef, onClose, backdrop]);\n\n  // The canvas needs pixel dimensions; the popup is sized in vw/vh, so the area is measured as it resizes.\n  const [size, setSize] = useState<{ width: number; height: number } | null>(null);\n  // A spinner covers the first draw, which can take a moment on a large grid.\n  const [isReady, setIsReady] = useState(false);\n  const handleReady = useCallback(() => setIsReady(true), []);\n  const observerRef = useRef<ResizeObserver | null>(null);\n  const areaRef = useCallback((node: HTMLDivElement | null) => {\n    observerRef.current?.disconnect();\n    observerRef.current = null;\n    if (!node) {\n      setSize(null);\n      return;\n    }\n    const observer = new ResizeObserver(([entry]) => {\n      if (!entry) return;\n      const { width, height } = entry.contentRect;\n      setSize({ width: Math.floor(width), height: Math.floor(height) });\n    });\n    observer.observe(node);\n    observerRef.current = observer;\n  }, []);\n\n  // Narrower only where the popup itself is: on a phone.\n  const legendBandWidth = Math.min(LEGEND_BAND_WIDTH, size?.width ?? LEGEND_BAND_WIDTH);\n\n  return createPortal(\n    <div\n      ref={setBackdrop}\n      style={{ position: \"fixed\", inset: 0, zIndex: MINI_MAP_POPUP_Z_INDEX, background: \"rgba(0,0,0,0.45)\", display: \"flex\", alignItems: \"center\", justifyContent: \"center\" }}\n    >\n      <style>{\"@keyframes heatmapMiniMapSpinnerRotate { to { transform: rotate(360deg); } }\"}</style>\n      <div\n        ref={popupRef}\n        style={{\n          position: \"relative\",\n          width: `${MINI_MAP_POPUP_WIDTH_VW}vw`,\n          height: `${MINI_MAP_POPUP_HEIGHT_VH}vh`,\n          boxSizing: \"border-box\",\n          display: \"flex\",\n          flexDirection: \"column\",\n          background: \"#fff\",\n          border: \"1px solid #d5d5d5\",\n          borderRadius: 8,\n          boxShadow: \"0 8px 32px rgba(0,0,0,0.25)\",\n          overflow: \"hidden\",\n        }}\n      >\n        <div\n          style={{\n            flexShrink: 0,\n            display: \"flex\",\n            alignItems: \"center\",\n            justifyContent: \"space-between\",\n            padding: `10px ${MINI_MAP_POPUP_PADDING}px`,\n            background: \"#f7f7f8\",\n            borderBottom: \"1px solid #e5e5e5\",\n          }}\n        >\n          <span style={{ fontSize: 14, fontWeight: 600, color: \"#333\" }}>Minimap</span>\n          <button\n            type=\"button\"\n            aria-label=\"Close expanded minimap\"\n            onClick={onClose}\n            style={{\n              width: 26,\n              height: 26,\n              display: \"flex\",\n              alignItems: \"center\",\n              justifyContent: \"center\",\n              padding: 0,\n              border: \"none\",\n              borderRadius: \"50%\",\n              background: \"#fff\",\n              color: \"#555\",\n              fontSize: 16,\n              lineHeight: 1,\n              cursor: \"pointer\",\n            }}\n          >\n            ×\n          </button>\n        </div>\n        <div style={{ flex: 1, minHeight: 0, display: \"flex\", flexDirection: \"column\", gap: LEGEND_BAND_GAP, padding: MINI_MAP_POPUP_PADDING }}>\n          {legend && (\n            // Above the map rather than beside it: the popup is wide, so a band costs the map less.\n            <svg\n              width={legendBandWidth}\n              height={LEGEND_BAND_HEIGHT}\n              style={{ flexShrink: 0, display: \"block\", overflow: \"visible\" }}\n            >\n              {legend({\n                width: legendBandWidth,\n                height: LEGEND_BAND_HEIGHT,\n                orientation: \"horizontal\",\n                overlayContainer: backdrop ?? undefined,\n              })}\n            </svg>\n          )}\n          <div ref={areaRef} style={{ flex: 1, minHeight: 0, position: \"relative\" }}>\n            {/* Not gated on `size`, so it shows on the first paint rather than after the measurement. */}\n            {!isReady && (\n              <div\n                aria-label=\"Loading minimap\"\n                style={{\n                  position: \"absolute\",\n                  inset: 0,\n                  zIndex: 1,\n                  display: \"flex\",\n                  alignItems: \"center\",\n                  justifyContent: \"center\",\n                  pointerEvents: \"none\",\n                }}\n              >\n                <div\n                  style={{\n                    width: 40,\n                    height: 40,\n                    borderRadius: \"50%\",\n                    border: \"4px solid #e5e5e5\",\n                    // The minimap's viewport-rectangle color.\n                    borderTopColor: \"#0d0f98\",\n                    animation: \"heatmapMiniMapSpinnerRotate 0.8s linear infinite\",\n                  }}\n                />\n              </div>\n            )}\n            {size && size.width > 0 && size.height > 0 && (\n              <HeatmapMiniMap {...miniMapProps} width={size.width} height={size.height} onReady={handleReady} />\n            )}\n          </div>\n        </div>\n      </div>\n    </div>,\n    document.body\n  );\n};\n\nexport default HeatmapMiniMapPopup;\n"],"names":["MINI_MAP_POPUP_WIDTH_VW","MINI_MAP_POPUP_HEIGHT_VH","MINI_MAP_POPUP_PADDING","MINI_MAP_POPUP_Z_INDEX","LEGEND_BAND_WIDTH","LEGEND_BAND_HEIGHT","LEGEND_BAND_GAP","HeatmapMiniMapPopup","t0","$","_c","containerRef","legend","miniMapProps","onClose","popupRef","useRef","backdrop","setBackdrop","useState","t1","t2","handlePointerDown","event","target","current","contains","handleKeyDown","event_0","key","document","addEventListener","removeEventListener","useEffect","size","setSize","isReady","setIsReady","t3","Symbol","for","handleReady","observerRef","t4","node","disconnect","observer","ResizeObserver","t5","entry","width","height","contentRect","Math","floor","observe","areaRef","legendBandWidth","min","t6","position","inset","zIndex","background","display","alignItems","justifyContent","jsx","t7","t8","t9","boxSizing","flexDirection","border","borderRadius","boxShadow","overflow","flexShrink","padding","borderBottom","fontSize","fontWeight","color","t10","lineHeight","cursor","t11","t12","flex","minHeight","gap","t13","orientation","overlayContainer","undefined","t14","t15","pointerEvents","borderTopColor","animation","t16","HeatmapMiniMap","t17","jsxs","t18","t19","createPortal","body"],"mappings":"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"}
+{"version":3,"file":"visualization.es103.js","sources":["../src/components/ScatterPlot/hooks/useDragSelection.ts"],"sourcesContent":["import { useCallback, useState } from \"react\";\nimport { useDrag, HandlerArgs } from \"@visx/drag\";\nimport { ScaleLinear } from \"@visx/vendor/d3-scale\";\nimport { Line, Lines, Point, ZoomType } from \"../types\";\nimport { isPointInLasso, rescaleX, rescaleY } from \"../helpers\";\n\ntype UseDragSelectionProps<T extends object> = {\n    pointData: Point<T>[];\n    margin: { top: number; left: number };\n    xScale: ScaleLinear<number, number, never>;\n    yScale: ScaleLinear<number, number, never>;\n    onSelectionChange?: (selectedPoints: Point<T>[]) => void;\n};\n\nexport const useDragSelection = <T extends object>({\n    pointData,\n    margin,\n    xScale,\n    yScale,\n    onSelectionChange,\n}: UseDragSelectionProps<T>) => {\n    const [lines, setLines] = useState<Lines>([]);\n\n    const onDragStart = useCallback((currDrag: HandlerArgs) => {\n        if (currDrag?.x === undefined || currDrag?.y === undefined) return;\n        const startX = currDrag.x;\n        const startY = currDrag.y;\n\n        setLines((currLines) => [\n            ...currLines,\n            [{ x: startX - margin.left, y: startY - margin.top }],\n        ]);\n    }, [margin.left, margin.top]);\n\n    const onDragMove = useCallback((currDrag: HandlerArgs) => {\n        if (currDrag?.x === undefined || currDrag?.y === undefined) return;\n\n        const adjustedX = currDrag.x - margin.left;\n        const adjustedY = currDrag.y - margin.top;\n        setLines((currLines) => {\n            const nextLines = [...currLines];\n            const nextPoint = { x: adjustedX + currDrag.dx, y: adjustedY + currDrag.dy };\n            const lastIndex = nextLines.length - 1;\n            nextLines[lastIndex] = [...(nextLines[lastIndex] || []), nextPoint];\n            return nextLines;\n        });\n    }, [margin.left, margin.top]);\n\n    const completeSelection = useCallback((zoom: ZoomType) => {\n        const lasso = lines[lines.length - 1];\n        if (!lasso) {\n            setLines([]);\n            return;\n        }\n\n        const xScaleTransformed = rescaleX(xScale, zoom.transformMatrix.translateX, zoom.transformMatrix.scaleX);\n        const yScaleTransformed = rescaleY(yScale, zoom.transformMatrix.translateY, zoom.transformMatrix.scaleY);\n\n        const pointsInsideLasso = pointData.filter((point) => isPointInLasso({\n            x: xScaleTransformed(point.x),\n            y: yScaleTransformed(point.y),\n        }, lasso as Line));\n\n        onSelectionChange?.(pointsInsideLasso);\n        setLines([]);\n    }, [lines, onSelectionChange, pointData, xScale, yScale]);\n\n    const {\n        x = 0,\n        y = 0,\n        dx,\n        dy,\n        isDragging,\n        dragStart,\n        dragEnd,\n        dragMove,\n    } = useDrag({\n        onDragStart,\n        onDragMove,\n        resetOnStart: true,\n    });\n\n    return { lines, isDragging, x, y, dx, dy, dragStart, dragMove, dragEnd, completeSelection };\n};\n"],"names":["useDragSelection","t0","$","_c","pointData","margin","xScale","yScale","onSelectionChange","t1","Symbol","for","lines","setLines","useState","t2","left","top","currDrag","x","undefined","y","startX","startY","currLines","onDragStart","t3","currDrag_0","adjustedX","adjustedY","currLines_0","nextLines","nextPoint","dx","dy","lastIndex","length","onDragMove","t4","zoom","lasso","xScaleTransformed","rescaleX","transformMatrix","translateX","scaleX","yScaleTransformed","rescaleY","translateY","scaleY","pointsInsideLasso","filter","point","isPointInLasso","completeSelection","t5","resetOnStart","t6","t7","isDragging","dragStart","dragEnd","dragMove","useDrag","t8"],"mappings":"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"}

package/dist/visualization.es104.js

@@ -1,85 +1,39 @@
-import { useRef as T, useEffect as Y, useCallback as f, useState as q, useMemo as m } from "react";
-import { getVisibleRange as v, drawHeatmapCells as y, hitTestCell as w, buildBin as A } from "./visualization.es100.js";
-const g = 4;
-function I({
-  canvasCellParams: e,
-  viewportWidth: i,
-  viewportHeight: a,
-  xTickValues: b,
-  yTickValues: M,
-  onClick: S
-}) {
-  const l = T(null), _ = T(null), d = T(null), L = T(null), R = T(null);
-  Y(() => () => {
-    R.current != null && cancelAnimationFrame(R.current);
-  }, []);
-  const c = f(() => {
-    const t = _.current, n = l.current;
-    if (!t || !n) return;
-    const r = t.getContext("2d");
-    if (!r) return;
-    const u = window.devicePixelRatio || 1;
-    r.setTransform(u, 0, 0, u, 0, 0), r.clearRect(0, 0, i, a);
-    const o = v(e, n.scrollLeft, n.scrollTop, i, a, g);
-    r.translate(-n.scrollLeft, -n.scrollTop), y(r, e, o, d.current);
-  }, [e, i, a]);
-  Y(() => {
-    c();
-  }, [c]);
-  const [p, x] = q({
-    left: 0,
-    top: 0
-  }), G = f((t) => {
-    l.current = t, t && x({
-      left: t.scrollLeft,
-      top: t.scrollTop
-    });
-  }, []), s = m(() => v(e, p.left, p.top, i, a, g), [e, p.left, p.top, i, a]), V = m(() => b.slice(s.colStart, s.colEnd + 1), [b, s.colStart, s.colEnd]), C = m(() => M.slice(s.rowStart, s.rowEnd + 1), [M, s.rowStart, s.rowEnd]), F = f(() => {
-    const t = l.current;
-    t && R.current == null && (R.current = requestAnimationFrame(() => {
-      R.current = null, c(), x({
-        left: t.scrollLeft,
-        top: t.scrollTop
-      });
-    }));
-  }, [c]), N = f((t) => {
-    const n = l.current;
-    if (!n) return;
-    const r = t.nativeEvent.offsetX + n.scrollLeft, u = t.nativeEvent.offsetY + n.scrollTop, o = w(e, r, u);
-    t.currentTarget.style.cursor = o ? "pointer" : "default";
-    const E = d.current;
-    if ((E?.row !== o?.row || E?.column !== o?.column) && (d.current = o, c()), o) {
-      const X = A(e, o);
-      X && L.current?.show(X, t);
-    } else
-      L.current?.hide();
-  }, [e, c]), h = f((t) => {
-    t.currentTarget.style.cursor = "default", d.current && (d.current = null, c()), L.current?.hide();
-  }, [c]), k = f((t) => {
-    const n = l.current;
-    if (!n || !S) return;
-    const r = t.nativeEvent.offsetX + n.scrollLeft, u = t.nativeEvent.offsetY + n.scrollTop, o = w(e, r, u);
-    if (!o) return;
-    const E = A(e, o);
-    E && S(E);
-  }, [e, S]);
-  return {
-    canvasRef: _,
-    mainPaneRef: l,
-    canvasTooltipRef: L,
-    setMainPaneNode: G,
-    handleGridScroll: F,
-    axisScrollPos: p,
-    visibleXTickValues: V,
-    visibleYTickValues: C,
-    canvasHandlers: {
-      onMouseMove: N,
-      onMouseLeave: h,
-      onClick: k
-    }
-  };
+import d from "./visualization.es139.js";
+import { line as u } from "./visualization.es85.js";
+import { jsx as t, Fragment as h } from "react/jsx-runtime";
+function N(n) {
+  let {
+    children: e,
+    data: a = [],
+    x: i,
+    y: l,
+    fill: o = "transparent",
+    className: s,
+    curve: f,
+    innerRef: p,
+    defined: c = () => !0,
+    ...m
+  } = n;
+  const r = u({
+    x: i,
+    y: l,
+    defined: c,
+    curve: f
+  });
+  return e ? /* @__PURE__ */ t(h, {
+    children: e({
+      path: r
+    })
+  }) : /* @__PURE__ */ t("path", {
+    ref: p,
+    className: d("visx-linepath", s),
+    d: r(a) || "",
+    fill: o,
+    strokeLinecap: "round",
+    ...m
+  });
 }
 export {
-  I as useHeatmapCanvasGrid
+  N as default
 };
 //# sourceMappingURL=visualization.es104.js.map

package/dist/visualization.es104.js.map

@@ -1 +1 @@
-{"version":3,"file":"visualization.es104.js","sources":["../src/components/Heatmap/hooks/useHeatmapCanvasGrid.ts"],"sourcesContent":["import { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport type { HeatmapCellId } from \"../types\";\nimport type { AnyBin } from \"../HeatmapCells\";\nimport type { PlotTooltipHandle } from \"../../../tooltip\";\nimport { drawHeatmapCells, getVisibleRange, hitTestCell, buildBin, type CanvasCellParams } from \"../HeatmapCanvasCells\";\n\n// Rows and columns drawn past the viewport, so cells and tick labels don't pop in as they scroll into view.\nconst GRID_OVERSCAN_CELLS = 4;\n\nexport interface UseHeatmapCanvasGridArgs {\n  canvasCellParams: CanvasCellParams;\n  viewportWidth: number;\n  viewportHeight: number;\n  xTickValues: number[];\n  yTickValues: number[];\n  onClick?: (bin: AnyBin) => void;\n}\n\nexport function useHeatmapCanvasGrid({\n  canvasCellParams, viewportWidth, viewportHeight, xTickValues, yTickValues, onClick,\n}: UseHeatmapCanvasGridArgs) {\n  // Only mainPaneRef scrolls natively. The canvas repaints from its scroll position, and the tick\n  // label panes follow it through a transform (axisScrollPos), both once per frame.\n  const mainPaneRef = useRef<HTMLDivElement | null>(null);\n  const canvasRef = useRef<HTMLCanvasElement | null>(null);\n  const hoveredCellRef = useRef<HeatmapCellId | null>(null);\n  const canvasTooltipRef = useRef<PlotTooltipHandle<AnyBin>>(null);\n  const drawRafRef = useRef<number | null>(null);\n\n  useEffect(() => () => {\n    if (drawRafRef.current != null) cancelAnimationFrame(drawRafRef.current);\n  }, []);\n\n  // Painted imperatively rather than through state, so scrolling never waits on a React render.\n  const drawCanvas = useCallback(() => {\n    const canvas = canvasRef.current;\n    const main = mainPaneRef.current;\n    if (!canvas || !main) return;\n    const ctx = canvas.getContext(\"2d\");\n    if (!ctx) return;\n    const dpr = window.devicePixelRatio || 1;\n    ctx.setTransform(dpr, 0, 0, dpr, 0, 0);\n    ctx.clearRect(0, 0, viewportWidth, viewportHeight);\n    const range = getVisibleRange(canvasCellParams, main.scrollLeft, main.scrollTop, viewportWidth, viewportHeight, GRID_OVERSCAN_CELLS);\n    ctx.translate(-main.scrollLeft, -main.scrollTop);\n    drawHeatmapCells(ctx, canvasCellParams, range, hoveredCellRef.current);\n  }, [canvasCellParams, viewportWidth, viewportHeight]);\n\n  useEffect(() => {\n    drawCanvas();\n  }, [drawCanvas]);\n\n  const [axisScrollPos, setAxisScrollPos] = useState({ left: 0, top: 0 });\n  const setMainPaneNode = useCallback((node: HTMLDivElement | null) => {\n    mainPaneRef.current = node;\n    if (node) setAxisScrollPos({ left: node.scrollLeft, top: node.scrollTop });\n  }, []);\n\n  const axisVisibleRange = useMemo(\n    () => getVisibleRange(canvasCellParams, axisScrollPos.left, axisScrollPos.top, viewportWidth, viewportHeight, GRID_OVERSCAN_CELLS),\n    [canvasCellParams, axisScrollPos.left, axisScrollPos.top, viewportWidth, viewportHeight]\n  );\n  const visibleXTickValues = useMemo(\n    () => xTickValues.slice(axisVisibleRange.colStart, axisVisibleRange.colEnd + 1),\n    [xTickValues, axisVisibleRange.colStart, axisVisibleRange.colEnd]\n  );\n  const visibleYTickValues = useMemo(\n    () => yTickValues.slice(axisVisibleRange.rowStart, axisVisibleRange.rowEnd + 1),\n    [yTickValues, axisVisibleRange.rowStart, axisVisibleRange.rowEnd]\n  );\n\n  const handleGridScroll = useCallback(() => {\n    const main = mainPaneRef.current;\n    if (!main) return;\n    if (drawRafRef.current != null) return;\n    drawRafRef.current = requestAnimationFrame(() => {\n      drawRafRef.current = null;\n      drawCanvas();\n      setAxisScrollPos({ left: main.scrollLeft, top: main.scrollTop });\n    });\n  }, [drawCanvas]);\n\n  const handleCanvasMouseMove = useCallback((event: React.MouseEvent<HTMLCanvasElement>) => {\n    const main = mainPaneRef.current;\n    if (!main) return;\n    const contentX = event.nativeEvent.offsetX + main.scrollLeft;\n    const contentY = event.nativeEvent.offsetY + main.scrollTop;\n    const cell = hitTestCell(canvasCellParams, contentX, contentY);\n    // As heatmapCellStyles does for SVG cells: a pointer over any cell, null ones included.\n    event.currentTarget.style.cursor = cell ? \"pointer\" : \"default\";\n    const prev = hoveredCellRef.current;\n    if (prev?.row !== cell?.row || prev?.column !== cell?.column) {\n      hoveredCellRef.current = cell;\n      drawCanvas();\n    }\n    if (cell) {\n      const bin = buildBin(canvasCellParams, cell);\n      if (bin) canvasTooltipRef.current?.show(bin, event);\n    } else {\n      canvasTooltipRef.current?.hide();\n    }\n  }, [canvasCellParams, drawCanvas]);\n\n  const handleCanvasMouseLeave = useCallback((event: React.MouseEvent<HTMLCanvasElement>) => {\n    event.currentTarget.style.cursor = \"default\";\n    if (hoveredCellRef.current) {\n      hoveredCellRef.current = null;\n      drawCanvas();\n    }\n    canvasTooltipRef.current?.hide();\n  }, [drawCanvas]);\n\n  const handleCanvasClick = useCallback((event: React.MouseEvent<HTMLCanvasElement>) => {\n    const main = mainPaneRef.current;\n    if (!main || !onClick) return;\n    const contentX = event.nativeEvent.offsetX + main.scrollLeft;\n    const contentY = event.nativeEvent.offsetY + main.scrollTop;\n    const cell = hitTestCell(canvasCellParams, contentX, contentY);\n    if (!cell) return;\n    const bin = buildBin(canvasCellParams, cell);\n    if (bin) onClick(bin);\n  }, [canvasCellParams, onClick]);\n\n  return {\n    canvasRef, mainPaneRef, canvasTooltipRef, setMainPaneNode, handleGridScroll, axisScrollPos,\n    visibleXTickValues, visibleYTickValues,\n    canvasHandlers: {\n      onMouseMove: handleCanvasMouseMove,\n      onMouseLeave: handleCanvasMouseLeave,\n      onClick: handleCanvasClick,\n    },\n  };\n}\n"],"names":["GRID_OVERSCAN_CELLS","useHeatmapCanvasGrid","canvasCellParams","viewportWidth","viewportHeight","xTickValues","yTickValues","onClick","mainPaneRef","useRef","canvasRef","hoveredCellRef","canvasTooltipRef","drawRafRef","useEffect","current","cancelAnimationFrame","drawCanvas","useCallback","canvas","main","ctx","getContext","dpr","window","devicePixelRatio","setTransform","clearRect","range","getVisibleRange","scrollLeft","scrollTop","translate","drawHeatmapCells","axisScrollPos","setAxisScrollPos","useState","left","top","setMainPaneNode","node","axisVisibleRange","useMemo","visibleXTickValues","slice","colStart","colEnd","visibleYTickValues","rowStart","rowEnd","handleGridScroll","requestAnimationFrame","handleCanvasMouseMove","event","contentX","nativeEvent","offsetX","contentY","offsetY","cell","hitTestCell","currentTarget","style","cursor","prev","row","column","bin","buildBin","show","hide","handleCanvasMouseLeave","handleCanvasClick","canvasHandlers","onMouseMove","onMouseLeave"],"mappings":"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"}
+{"version":3,"file":"visualization.es104.js","sources":["../../../node_modules/.pnpm/@visx+shape@4.0.0_@types+react@19.2.14_react@19.2.4/node_modules/@visx/shape/esm/shapes/LinePath.js"],"sourcesContent":["import cx from 'classnames';\nimport { line } from \"../util/D3ShapeFactories.js\";\nimport { Fragment as _Fragment, jsx as _jsx } from \"react/jsx-runtime\";\nexport default function LinePath(_ref) {\n  let {\n    children,\n    data = [],\n    x,\n    y,\n    fill = 'transparent',\n    className,\n    curve,\n    innerRef,\n    defined = () => true,\n    ...restProps\n  } = _ref;\n  const path = line({\n    x,\n    y,\n    defined,\n    curve\n  });\n  if (children) return /*#__PURE__*/_jsx(_Fragment, {\n    children: children({\n      path\n    })\n  });\n  return /*#__PURE__*/_jsx(\"path\", {\n    ref: innerRef,\n    className: cx('visx-linepath', className),\n    d: path(data) || '',\n    fill: fill\n    // without this a datum surrounded by nulls will not be visible\n    // https://github.com/d3/d3-shape#line_defined\n    ,\n    strokeLinecap: \"round\",\n    ...restProps\n  });\n}"],"names":["LinePath","_ref","children","data","x","y","fill","className","curve","innerRef","defined","restProps","path","line","_jsx","_Fragment","cx"],"mappings":";;;AAGe,SAASA,EAASC,GAAM;AACrC,MAAI;AAAA,IACF,UAAAC;AAAA,IACA,MAAAC,IAAO,CAAA;AAAA,IACP,GAAAC;AAAA,IACA,GAAAC;AAAA,IACA,MAAAC,IAAO;AAAA,IACP,WAAAC;AAAA,IACA,OAAAC;AAAA,IACA,UAAAC;AAAA,IACA,SAAAC,IAAU,MAAM;AAAA,IAChB,GAAGC;AAAA,EACP,IAAMV;AACJ,QAAMW,IAAOC,EAAK;AAAA,IAChB,GAAAT;AAAA,IACA,GAAAC;AAAA,IACA,SAAAK;AAAA,IACA,OAAAF;AAAA,EACJ,CAAG;AACD,SAAIN,IAA8BY,gBAAAA,EAAKC,GAAW;AAAA,IAChD,UAAUb,EAAS;AAAA,MACjB,MAAAU;AAAA,IACN,CAAK;AAAA,EACL,CAAG,IACmBE,gBAAAA,EAAK,QAAQ;AAAA,IAC/B,KAAKL;AAAA,IACL,WAAWO,EAAG,iBAAiBT,CAAS;AAAA,IACxC,GAAGK,EAAKT,CAAI,KAAK;AAAA,IACjB,MAAMG;AAAA,IAIN,eAAe;AAAA,IACf,GAAGK;AAAA,EACP,CAAG;AACH;","x_google_ignoreList":[0]}