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

package/dist/visualization.es129.js

@@ -1,29 +1,106 @@
-import { jsx as u, jsxs as k } from "react/jsx-runtime";
-import { c as g } from "react/compiler-runtime";
-import { memo as j } from "react";
-import O from "./visualization.es33.js";
-const F = j(function(L) {
-  const t = g(16), {
-    nodeX: N,
-    color: e,
-    baseNodeX: f,
-    baseNodeY: i,
-    label: a,
-    fontSize: n,
-    fontFamily: c,
-    strokeWidth: m
-  } = L, s = N * 180 / Math.PI - 90, d = s > 90 || s < -90, $ = d ? s + 180 : s, p = d ? "end" : "start", x = d ? -6 : 6, b = `rotate(${$}) translate(0, ${(n ?? 2.4) / 3})`, h = a === "Human" ? `${a} ★★★` : a;
-  let o;
-  t[0] !== e || t[1] !== c || t[2] !== n || t[3] !== m || t[4] !== b || t[5] !== h || t[6] !== p || t[7] !== x ? (o = /* @__PURE__ */ u("text", { fontSize: n, fontFamily: c, fill: e, stroke: e, strokeWidth: m, paintOrder: "stroke", transform: b, textAnchor: p, x, children: h }), t[0] = e, t[1] = c, t[2] = n, t[3] = m, t[4] = b, t[5] = h, t[6] = p, t[7] = x, t[8] = o) : o = t[8];
-  let r;
-  t[9] !== e ? (r = /* @__PURE__ */ u("circle", { r: 1.5, fill: e }), t[9] = e, t[10] = r) : r = t[10];
-  let l;
-  return t[11] !== f || t[12] !== i || t[13] !== o || t[14] !== r ? (l = /* @__PURE__ */ k(O, { top: i, left: f, children: [
-    o,
-    r
-  ] }), t[11] = f, t[12] = i, t[13] = o, t[14] = r, t[15] = l) : l = t[15], l;
-});
+import { jsxs as z, jsx as p } from "react/jsx-runtime";
+import { useRef as M, useEffect as J, useCallback as m } from "react";
+import { drawHeatmapOverview as Q } from "./visualization.es127.js";
+import { SELECTION_COLOR as V } from "./visualization.es126.js";
+const f = (u, e, c) => Math.min(Math.max(u, e), c), L = 5, Z = 2, v = ({
+  canvasCellParams: u,
+  xMax: e,
+  yMax: c,
+  viewportWidth: l,
+  viewportHeight: d,
+  scrollLeft: P,
+  scrollTop: g,
+  width: i,
+  height: a,
+  onNavigate: b,
+  onCanvasClick: x,
+  onReady: h,
+  paused: C = !1
+}) => {
+  const D = M(null), r = e > 0 ? i / e : 0, o = c > 0 ? a / c : 0, I = M(h);
+  I.current = h, J(() => {
+    const t = D.current;
+    if (!t || C || r <= 0 || o <= 0) return;
+    const n = requestAnimationFrame(() => {
+      const s = t.getContext("2d");
+      s && (Q(s, u), I.current?.());
+    });
+    return () => cancelAnimationFrame(n);
+  }, [u, e, c, r, o, C]);
+  const T = m((t, n) => {
+    b(f(t - l / 2, 0, Math.max(0, e - l)), f(n - d / 2, 0, Math.max(0, c - d)));
+  }, [b, l, d, e, c]), j = m((t) => {
+    if (x) {
+      x();
+      return;
+    }
+    if (r <= 0 || o <= 0) return;
+    const n = t.currentTarget.getBoundingClientRect();
+    T((t.clientX - n.left) / r, (t.clientY - n.top) / o);
+  }, [x, T, r, o]), R = M(null), F = m((t) => {
+    t.stopPropagation(), t.currentTarget.setPointerCapture(t.pointerId), R.current = {
+      x: t.clientX,
+      y: t.clientY,
+      left: P,
+      top: g
+    };
+  }, [P, g]), K = m((t) => {
+    const n = R.current;
+    !n || r <= 0 || o <= 0 || !t.currentTarget.hasPointerCapture(t.pointerId) || b(f(n.left + (t.clientX - n.x) / r, 0, Math.max(0, e - l)), f(n.top + (t.clientY - n.y) / o, 0, Math.max(0, c - d)));
+  }, [r, o, e, c, l, d, b]), U = m((t) => {
+    t.currentTarget.releasePointerCapture(t.pointerId), R.current = null;
+  }, []), $ = m(() => {
+    R.current = null;
+  }, []), {
+    columns: E,
+    rows: A
+  } = u.selectionMarks, q = u.data.length, {
+    numRows: O
+  } = u, S = (t, n, s) => {
+    const H = t * s / n, k = s / n, y = Math.max(0, Z - k) / 2;
+    return [H - y, k + 2 * y];
+  }, X = f(P * r, 0, i), Y = f(g * o, 0, a), B = Math.max(0, Math.min(l * r, i - X)), G = Math.max(0, Math.min(d * o, a - Y));
+  return /* @__PURE__ */ z("div", { style: {
+    position: "relative",
+    width: i,
+    height: a
+  }, children: [
+    /* @__PURE__ */ p("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: j }),
+    /* @__PURE__ */ p("div", { onPointerDown: F, onPointerMove: K, onPointerUp: U, onLostPointerCapture: $, style: {
+      position: "absolute",
+      left: X,
+      top: Y,
+      width: B,
+      height: G,
+      border: "2px solid #0d0f98",
+      backgroundColor: "rgba(13, 15, 152, 0.15)",
+      cursor: "grab",
+      boxSizing: "border-box"
+    } }),
+    (E.size > 0 || A.size > 0) && /* @__PURE__ */ p("svg", { width: i, height: a, style: {
+      position: "absolute",
+      inset: 0,
+      pointerEvents: "none"
+    }, "aria-hidden": !0, children: /* @__PURE__ */ z("g", { fill: V, children: [
+      [...E].map((t) => {
+        const [n, s] = S(t, q, i);
+        return /* @__PURE__ */ p("rect", { x: n, y: 0, width: s, height: L }, `c${t}`);
+      }),
+      [...A].map((t) => {
+        const [n, s] = S(O - 1 - t, O, a);
+        return /* @__PURE__ */ p("rect", { x: 0, y: n, width: L, height: s }, `r${t}`);
+      })
+    ] }) })
+  ] });
+};
 export {
-  F as LeafNodeLabel
+  v as default
 };
 //# sourceMappingURL=visualization.es129.js.map

package/dist/visualization.es129.js.map

@@ -1 +1 @@
-{"version":3,"file":"visualization.es129.js","sources":["../src/components/PhyloTree/LeafNodeLabel.tsx"],"sourcesContent":["import { PhyloTreeProps, TreeNode } from \"./types\";\nimport { Group } from \"@visx/group\";\nimport { memo } from \"react\";\n\n\nexport type LeafNodeLabelProps = {\n  // node.x is the angle the node is at in radial layout while base/scaled are true x/y position in svg\n  nodeX: number;\n  baseNodeX: TreeNode[\"baseNodeX\"];\n  baseNodeY: TreeNode[\"baseNodeY\"];\n  label: TreeNode[\"label\"];\n  color: TreeNode[\"color\"];\n  fontSize: PhyloTreeProps[\"leafFontSize\"];\n  fontFamily: PhyloTreeProps[\"leafFontFamily\"];\n  strokeWidth: TreeNode[\"labelStrokeWidth\"]\n};\n\nexport const LeafNodeLabel = memo(function LeafNodeLabel({\n  nodeX,\n  color,\n  baseNodeX,\n  baseNodeY,\n  label,\n  fontSize,\n  fontFamily,\n  strokeWidth\n}: LeafNodeLabelProps) {\n  const angleDeg = (nodeX * 180) / Math.PI - 90;\n  const flip = angleDeg > 90 || angleDeg < -90;\n  const rotation = flip ? angleDeg + 180 : angleDeg;\n  const textAnchor: \"start\" | \"end\" = flip ? \"end\" : \"start\";\n  const xOffset = flip ? -6 : 6;\n\n  return (\n    <Group\n      top={baseNodeY}\n      left={baseNodeX}\n    >\n      <text\n        fontSize={fontSize}\n        fontFamily={fontFamily}\n        fill={color}\n        stroke={color}\n        strokeWidth={strokeWidth}\n        paintOrder=\"stroke\"\n        transform={`rotate(${rotation}) translate(0, ${(fontSize ?? 2.4) / 3})`}\n        textAnchor={textAnchor}\n        x={xOffset}\n      >\n        {label === \"Human\" ? `${label} \\u2605\\u2605\\u2605` : label}\n      </text>\n      <circle\n        r={1.5}\n        fill={color}\n      />\n    </Group>\n  );\n});\n"],"names":["LeafNodeLabel","memo","t0","$","_c","nodeX","color","baseNodeX","baseNodeY","label","fontSize","fontFamily","strokeWidth","angleDeg","Math","PI","flip","rotation","textAnchor","xOffset","t1","t2","t3","t4","jsx","t5","jsxs","Group"],"mappings":";;;;AAiBO,MAAMA,IAAgBC,EAAK,SAAAC,GAAA;AAAA,QAAAC,IAAAC,EAAA,EAAA,GAAuB;AAAA,IAAAC,OAAAA;AAAAA,IAAAC,OAAAA;AAAAA,IAAAC,WAAAA;AAAAA,IAAAC,WAAAA;AAAAA,IAAAC,OAAAA;AAAAA,IAAAC,UAAAA;AAAAA,IAAAC,YAAAA;AAAAA,IAAAC,aAAAA;AAAAA,EAAAA,IAAAV,GAUvDW,IAAkBR,IAAQ,MAAOS,KAAIC,KAAM,IAC3CC,IAAaH,IAAW,MAAMA,IAAW,KACzCI,IAAiBD,IAAOH,IAAW,MAAlBA,GACjBK,IAAoCF,IAAA,QAAA,SACpCG,IAAgBH,IAAA,KAAA,GAcCI,IAAA,UAAUH,CAAQ,mBAAmBP,KAAA,OAAmB,CAAC,KAInEW,IAAAZ,MAAU,UAAV,GAAuBA,CAAK,SAA5BA;AAAyD,MAAAa;AAAA,EAAAnB,EAAA,CAAA,MAAAG,KAAAH,EAAA,CAAA,MAAAQ,KAAAR,EAAA,CAAA,MAAAO,KAAAP,EAAA,CAAA,MAAAS,KAAAT,EAAA,CAAA,MAAAiB,KAAAjB,EAAA,CAAA,MAAAkB,KAAAlB,EAAA,CAAA,MAAAe,KAAAf,SAAAgB,KAX5DG,sBAAA,QAAA,EACYZ,UAAAA,GACEC,YAAAA,GACNL,MAAAA,GACEA,QAAAA,GACKM,aAAAA,GACF,YAAA,UACA,WAAAQ,GACCF,YAAAA,GACTC,GAEFE,UAAAA,GACH,GAAOlB,OAAAG,GAAAH,OAAAQ,GAAAR,OAAAO,GAAAP,OAAAS,GAAAT,OAAAiB,GAAAjB,OAAAkB,GAAAlB,OAAAe,GAAAf,OAAAgB,GAAAhB,OAAAmB,KAAAA,IAAAnB,EAAA,CAAA;AAAA,MAAAoB;AAAA,EAAApB,SAAAG,KACPiB,IAAA,gBAAAC,EAAA,UAAA,EACK,GAAA,KACGlB,MAAAA,GAAK,GACXH,OAAAG,GAAAH,QAAAoB,KAAAA,IAAApB,EAAA,EAAA;AAAA,MAAAsB;AAAA,SAAAtB,EAAA,EAAA,MAAAI,KAAAJ,EAAA,EAAA,MAAAK,KAAAL,EAAA,EAAA,MAAAmB,KAAAnB,UAAAoB,KApBJE,IAAA,gBAAAC,EAACC,GAAA,EACMnB,KAAAA,GACCD,SAENe,UAAAA;AAAAA,IAAAA;AAAAA,IAaAC;AAAAA,EAAAA,GAIF,GAAQpB,QAAAI,GAAAJ,QAAAK,GAAAL,QAAAmB,GAAAnB,QAAAoB,GAAApB,QAAAsB,KAAAA,IAAAtB,EAAA,EAAA,GArBRsB;AAqBQ,CAEX;"}
+{"version":3,"file":"visualization.es129.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  /**\n   * Where the window was grabbed: the pointer, and the scroll position then. Each move places the\n   * window by the pointer's distance from here, so it stays under the pointer. Adding each move's\n   * movementX to scrollLeft instead drifted: scrollLeft trails the grid's scroll by a frame, and\n   * each step's rounding was kept, so the window ran ahead or fell behind further the longer the drag.\n   */\n  const grabRef = useRef<{ x: number; y: number; left: number; top: number } | null>(null);\n\n  const handleRectPointerDown = useCallback(\n    (event: React.PointerEvent<HTMLDivElement>) => {\n      event.stopPropagation();\n      event.currentTarget.setPointerCapture(event.pointerId);\n      grabRef.current = { x: event.clientX, y: event.clientY, left: scrollLeft, top: scrollTop };\n    },\n    [scrollLeft, scrollTop]\n  );\n\n  const handleRectPointerMove = useCallback(\n    (event: React.PointerEvent<HTMLDivElement>) => {\n      const grab = grabRef.current;\n      if (!grab || scaleX <= 0 || scaleY <= 0 || !event.currentTarget.hasPointerCapture(event.pointerId)) return;\n      onNavigate(\n        clamp(grab.left + (event.clientX - grab.x) / scaleX, 0, Math.max(0, xMax - viewportWidth)),\n        clamp(grab.top + (event.clientY - grab.y) / scaleY, 0, Math.max(0, yMax - viewportHeight))\n      );\n    },\n    [scaleX, scaleY, xMax, yMax, viewportWidth, viewportHeight, onNavigate]\n  );\n\n  const handleRectPointerUp = useCallback((event: React.PointerEvent<HTMLDivElement>) => {\n    event.currentTarget.releasePointerCapture(event.pointerId);\n    grabRef.current = null;\n  }, []);\n\n  // A capture can also end without a pointerup, e.g. when the browser cancels the gesture.\n  const handleRectLostCapture = useCallback(() => {\n    grabRef.current = null;\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        onLostPointerCapture={handleRectLostCapture}\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","grabRef","handleRectPointerDown","stopPropagation","setPointerCapture","pointerId","x","y","handleRectPointerMove","grab","hasPointerCapture","handleRectPointerUp","releasePointerCapture","handleRectLostCapture","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","w","row","h"],"mappings":"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"}

package/dist/visualization.es13.js

@@ -1,8 +1,8 @@
 import { jsx as T } from "react/jsx-runtime";
 import { c as x } from "react/compiler-runtime";
 import { memo as P, useState as y, useImperativeHandle as z, useRef as M } from "react";
-import O, { defaultStyles as A } from "./visualization.es27.js";
-import E from "./visualization.es81.js";
+import O, { defaultStyles as A } from "./visualization.es52.js";
+import E from "./visualization.es50.js";
 const R = 10, w = 8, v = (o, e, a) => {
   const s = o + R, n = o - R - e, t = s + e > a - w && n >= w ? n : s;
   return Math.max(w, Math.min(t, a - e - w));

package/dist/visualization.es130.js

@@ -1,77 +1,178 @@
-import { jsx as A, jsxs as F } from "react/jsx-runtime";
-import { c as H } from "react/compiler-runtime";
-import B from "./visualization.es160.js";
-import I from "./visualization.es33.js";
-const R = (E) => {
-  const e = H(75), {
-    crossProps: f,
-    left: G,
-    top: L,
-    median: l,
-    firstQuartile: n,
-    thirdQuartile: c,
-    valueScale: t,
-    medianWidth: s,
-    tooltipData: w,
-    handleMouseMove: a,
-    handleCrossClick: d,
-    disableViolinPlot: i,
-    tooltip: r,
-    horizontal: o
-  } = E;
-  let m;
-  e[0] !== o || e[1] !== c || e[2] !== t ? (m = o ? t(c) : 0, e[0] = o, e[1] = c, e[2] = t, e[3] = m) : m = e[3];
-  let k;
-  e[4] !== o || e[5] !== c || e[6] !== t ? (k = o ? 0 : t(c), e[4] = o, e[5] = c, e[6] = t, e[7] = k) : k = e[7];
-  let p;
-  e[8] !== m || e[9] !== k ? (p = {
-    x: m,
-    y: k
-  }, e[8] = m, e[9] = k, e[10] = p) : p = e[10];
-  let u;
-  e[11] !== n || e[12] !== o || e[13] !== t ? (u = o ? t(n) : 0, e[11] = n, e[12] = o, e[13] = t, e[14] = u) : u = e[14];
-  let h;
-  e[15] !== n || e[16] !== o || e[17] !== t ? (h = o ? 0 : t(n), e[15] = n, e[16] = o, e[17] = t, e[18] = h) : h = e[18];
-  let x;
-  e[19] !== u || e[20] !== h ? (x = {
-    x: u,
-    y: h
-  }, e[19] = u, e[20] = h, e[21] = x) : x = e[21];
-  const S = f?.color ?? "#000000", V = w === r && i ? (f?.stroke ?? 1) + 1 : f?.stroke ?? 1;
+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.es129.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[22] !== i || e[23] !== a || e[24] !== r ? (v = i ? (q) => a(q, r) : void 0, e[22] = i, e[23] = a, e[24] = r, e[25] = v) : v = e[25];
-  let C;
-  e[26] !== d || e[27] !== p || e[28] !== x || e[29] !== S || e[30] !== V || e[31] !== v ? (C = /* @__PURE__ */ A(B, { from: p, to: x, stroke: S, strokeWidth: V, onMouseMove: v, onClick: d }), e[26] = d, e[27] = p, e[28] = x, e[29] = S, e[30] = V, e[31] = v, e[32] = C) : C = e[32];
-  let M;
-  e[33] !== o || e[34] !== l || e[35] !== s || e[36] !== t ? (M = o ? t(l) : -s / 2, e[33] = o, e[34] = l, e[35] = s, e[36] = t, e[37] = M) : M = e[37];
-  let y;
-  e[38] !== o || e[39] !== l || e[40] !== s || e[41] !== t ? (y = o ? -s / 2 : t(l), e[38] = o, e[39] = l, e[40] = s, e[41] = t, e[42] = y) : y = e[42];
-  let P;
-  e[43] !== M || e[44] !== y ? (P = {
-    x: M,
-    y
-  }, e[43] = M, e[44] = y, e[45] = P) : P = e[45];
-  let W;
-  e[46] !== o || e[47] !== l || e[48] !== s || e[49] !== t ? (W = o ? t(l) : s / 2, e[46] = o, e[47] = l, e[48] = s, e[49] = t, e[50] = W) : W = e[50];
-  let j;
-  e[51] !== o || e[52] !== l || e[53] !== s || e[54] !== t ? (j = o ? s / 2 : t(l), e[51] = o, e[52] = l, e[53] = s, e[54] = t, e[55] = j) : j = e[55];
-  let Q;
-  e[56] !== W || e[57] !== j ? (Q = {
-    x: W,
-    y: j
-  }, e[56] = W, e[57] = j, e[58] = Q) : Q = e[58];
-  const $ = f?.medianColor ?? f?.color ?? "#000000", g = w === r && i ? (f?.stroke ?? 1) + 1 : f?.stroke ?? 1;
-  let b;
-  e[59] !== i || e[60] !== a || e[61] !== r ? (b = i ? (q) => a(q, r) : void 0, e[59] = i, e[60] = a, e[61] = r, e[62] = b) : b = e[62];
-  let z;
-  e[63] !== d || e[64] !== P || e[65] !== Q || e[66] !== $ || e[67] !== g || e[68] !== b ? (z = /* @__PURE__ */ A(B, { from: P, to: Q, stroke: $, strokeWidth: g, onMouseMove: b, onClick: d }), e[63] = d, e[64] = P, e[65] = Q, e[66] = $, e[67] = g, e[68] = b, e[69] = z) : z = e[69];
+  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);
+      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;
-  return e[70] !== G || e[71] !== C || e[72] !== z || e[73] !== L ? (D = /* @__PURE__ */ F(I, { left: G, top: L, children: [
-    C,
-    z
-  ] }), e[70] = G, e[71] = C, e[72] = z, e[73] = L, e[74] = D) : D = e[74], 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];
+  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];
+  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;
 };
 export {
-  R as default
+  ae as default
 };
 //# sourceMappingURL=visualization.es130.js.map

package/dist/visualization.es130.js.map

@@ -1 +1 @@
-{"version":3,"file":"visualization.es130.js","sources":["../src/components/ViolinPlot/crossPlot.tsx"],"sourcesContent":["import { CrossPlotProps } from \"./types\";\nimport { Group } from \"@visx/group\";\nimport { Line } from '@visx/shape';\n\n\nconst CrossPlot = <T,>({ crossProps, left, top, median, firstQuartile, thirdQuartile, valueScale, medianWidth, tooltipData, handleMouseMove, handleCrossClick, disableViolinPlot, tooltip, horizontal }: CrossPlotProps<T>) => {\n\n    return (\n        <Group left={left} top={top}>\n            {/* Vertical line from min to max */}\n            <Line\n                from={{ x: horizontal ? valueScale(thirdQuartile) : 0, y: horizontal ? 0 : valueScale(thirdQuartile) }}\n                to={{ x: horizontal ? valueScale(firstQuartile): 0, y: horizontal ? 0: valueScale(firstQuartile) }}\n                stroke={crossProps?.color ?? \"#000000\"}\n                strokeWidth={\n                    tooltipData === tooltip && disableViolinPlot\n                        ? (crossProps?.stroke ?? 1) + 1\n                        : crossProps?.stroke ?? 1\n                }\n                onMouseMove={disableViolinPlot ? (e) => handleMouseMove(e, tooltip) : undefined}\n                onClick={handleCrossClick}\n            />\n            {/* Horizontal line at median */}\n            <Line\n                from={{ x: horizontal ? valueScale(median) : -medianWidth / 2, y: horizontal ? -medianWidth / 2 : valueScale(median) }}\n                to={{ x: horizontal ? valueScale(median) : medianWidth / 2, y: horizontal ? medianWidth / 2 : valueScale(median) }}\n                stroke={crossProps?.medianColor ?? crossProps?.color ?? \"#000000\"}\n                strokeWidth={\n                    tooltipData === tooltip && disableViolinPlot\n                        ? (crossProps?.stroke ?? 1) + 1\n                        : crossProps?.stroke ?? 1\n                }\n                onMouseMove={disableViolinPlot ? (e) => handleMouseMove(e, tooltip) : undefined}\n                onClick={handleCrossClick}\n            />\n        </Group>\n    );\n};\n\nexport default CrossPlot;\n"],"names":["CrossPlot","t0","$","_c","crossProps","left","top","median","firstQuartile","thirdQuartile","valueScale","medianWidth","tooltipData","handleMouseMove","handleCrossClick","disableViolinPlot","tooltip","horizontal","t1","t2","t3","x","y","t4","t5","t6","t7","color","t8","stroke","t9","e","undefined","t10","Line","t11","t12","t13","t14","t15","t16","t17","medianColor","t18","t19","e_0","t20","t21","jsxs","Group"],"mappings":";;;;AAKA,MAAMA,IAAYC,CAAAA,MAAA;AAAA,QAAAC,IAAAC,EAAA,EAAA,GAAK;AAAA,IAAAC,YAAAA;AAAAA,IAAAC,MAAAA;AAAAA,IAAAC,KAAAA;AAAAA,IAAAC,QAAAA;AAAAA,IAAAC,eAAAA;AAAAA,IAAAC,eAAAA;AAAAA,IAAAC,YAAAA;AAAAA,IAAAC,aAAAA;AAAAA,IAAAC,aAAAA;AAAAA,IAAAC,iBAAAA;AAAAA,IAAAC,kBAAAA;AAAAA,IAAAC,mBAAAA;AAAAA,IAAAC,SAAAA;AAAAA,IAAAC,YAAAA;AAAAA,EAAAA,IAAAhB;AAAmM,MAAAiB;AAAA,EAAAhB,EAAA,CAAA,MAAAe,KAAAf,SAAAO,KAAAP,EAAA,CAAA,MAAAQ,KAM/LQ,IAAAD,IAAaP,EAAWD,CAAiB,IAAzC,GAA0CP,OAAAe,GAAAf,OAAAO,GAAAP,OAAAQ,GAAAR,OAAAgB,KAAAA,IAAAhB,EAAA,CAAA;AAAA,MAAAiB;AAAA,EAAAjB,EAAA,CAAA,MAAAe,KAAAf,SAAAO,KAAAP,EAAA,CAAA,MAAAQ,KAAKS,IAAAF,IAAA,IAAiBP,EAAWD,CAAa,GAACP,OAAAe,GAAAf,OAAAO,GAAAP,OAAAQ,GAAAR,OAAAiB,KAAAA,IAAAjB,EAAA,CAAA;AAAA,MAAAkB;AAAA,EAAAlB,EAAA,CAAA,MAAAgB,KAAAhB,SAAAiB,KAA9FC,IAAA;AAAA,IAAAC,GAAKH;AAAAA,IAA0CI,GAAKH;AAAAA,EAAAA,GAA4CjB,OAAAgB,GAAAhB,OAAAiB,GAAAjB,QAAAkB,KAAAA,IAAAlB,EAAA,EAAA;AAAA,MAAAqB;AAAA,EAAArB,EAAA,EAAA,MAAAM,KAAAN,UAAAe,KAAAf,EAAA,EAAA,MAAAQ,KAC7Fa,IAAAN,IAAaP,EAAWF,CAAgB,IAAxC,GAAyCN,QAAAM,GAAAN,QAAAe,GAAAf,QAAAQ,GAAAR,QAAAqB,KAAAA,IAAArB,EAAA,EAAA;AAAA,MAAAsB;AAAA,EAAAtB,EAAA,EAAA,MAAAM,KAAAN,UAAAe,KAAAf,EAAA,EAAA,MAAAQ,KAAKc,IAAAP,IAAA,IAAgBP,EAAWF,CAAa,GAACN,QAAAM,GAAAN,QAAAe,GAAAf,QAAAQ,GAAAR,QAAAsB,KAAAA,IAAAtB,EAAA,EAAA;AAAA,MAAAuB;AAAA,EAAAvB,EAAA,EAAA,MAAAqB,KAAArB,UAAAsB,KAA5FC,IAAA;AAAA,IAAAJ,GAAKE;AAAAA,IAAyCD,GAAKE;AAAAA,EAAAA,GAA2CtB,QAAAqB,GAAArB,QAAAsB,GAAAtB,QAAAuB,KAAAA,IAAAvB,EAAA,EAAA;AAC1F,QAAAwB,IAAAtB,GAAUuB,SAAV,WAEJC,IAAAhB,MAAgBI,KAAhBD,KACOX,GAAUyB,UAAV,KAA2B,IAC5BzB,GAAUyB,UAAV;AAAuB,MAAAC;AAAA,EAAA5B,EAAA,EAAA,MAAAa,KAAAb,UAAAW,KAAAX,EAAA,EAAA,MAAAc,KAEpBc,IAAAf,IAAAgB,CAAAA,MAA2BlB,EAAgBkB,GAAGf,CAAO,IAArDgB,QAAkE9B,QAAAa,GAAAb,QAAAW,GAAAX,QAAAc,GAAAd,QAAA4B,KAAAA,IAAA5B,EAAA,EAAA;AAAA,MAAA+B;AAAA,EAAA/B,UAAAY,KAAAZ,EAAA,EAAA,MAAAkB,KAAAlB,EAAA,EAAA,MAAAuB,KAAAvB,EAAA,EAAA,MAAAwB,KAAAxB,UAAA0B,KAAA1B,EAAA,EAAA,MAAA4B,KATnFG,sBAACC,GAAA,EACS,MAAAd,GACF,IAAAK,GACI,QAAAC,GAEJ,aAAAE,GAIS,aAAAE,GACJhB,SAAAA,GAAgB,GAC3BZ,QAAAY,GAAAZ,QAAAkB,GAAAlB,QAAAuB,GAAAvB,QAAAwB,GAAAxB,QAAA0B,GAAA1B,QAAA4B,GAAA5B,QAAA+B,KAAAA,IAAA/B,EAAA,EAAA;AAAA,MAAAiC;AAAA,EAAAjC,EAAA,EAAA,MAAAe,KAAAf,EAAA,EAAA,MAAAK,KAAAL,EAAA,EAAA,MAAAS,KAAAT,UAAAQ,KAGayB,IAAAlB,IAAaP,EAAWH,CAAyB,IAAf,CAACI,IAAc,GAACT,QAAAe,GAAAf,QAAAK,GAAAL,QAAAS,GAAAT,QAAAQ,GAAAR,QAAAiC,KAAAA,IAAAjC,EAAA,EAAA;AAAA,MAAAkC;AAAA,EAAAlC,EAAA,EAAA,MAAAe,KAAAf,EAAA,EAAA,MAAAK,KAAAL,EAAA,EAAA,MAAAS,KAAAT,UAAAQ,KAAK0B,IAAAnB,IAAa,CAACN,IAAc,IAAID,EAAWH,CAAM,GAACL,QAAAe,GAAAf,QAAAK,GAAAL,QAAAS,GAAAT,QAAAQ,GAAAR,QAAAkC,KAAAA,IAAAlC,EAAA,EAAA;AAAA,MAAAmC;AAAA,EAAAnC,EAAA,EAAA,MAAAiC,KAAAjC,UAAAkC,KAA9GC,IAAA;AAAA,IAAAhB,GAAKc;AAAAA,IAAkDb;AAAAA,EAAKc,GAAoDlC,QAAAiC,GAAAjC,QAAAkC,GAAAlC,QAAAmC,KAAAA,IAAAnC,EAAA,EAAA;AAAA,MAAAoC;AAAA,EAAApC,EAAA,EAAA,MAAAe,KAAAf,EAAA,EAAA,MAAAK,KAAAL,EAAA,EAAA,MAAAS,KAAAT,UAAAQ,KAC7G4B,IAAArB,IAAaP,EAAWH,CAAwB,IAAdI,IAAc,GAACT,QAAAe,GAAAf,QAAAK,GAAAL,QAAAS,GAAAT,QAAAQ,GAAAR,QAAAoC,KAAAA,IAAApC,EAAA,EAAA;AAAA,MAAAqC;AAAA,EAAArC,EAAA,EAAA,MAAAe,KAAAf,EAAA,EAAA,MAAAK,KAAAL,EAAA,EAAA,MAAAS,KAAAT,UAAAQ,KAAK6B,IAAAtB,IAAaN,IAAc,IAAID,EAAWH,CAAM,GAACL,QAAAe,GAAAf,QAAAK,GAAAL,QAAAS,GAAAT,QAAAQ,GAAAR,QAAAqC,KAAAA,IAAArC,EAAA,EAAA;AAAA,MAAAsC;AAAA,EAAAtC,EAAA,EAAA,MAAAoC,KAAApC,UAAAqC,KAA5GC,IAAA;AAAA,IAAAnB,GAAKiB;AAAAA,IAAiDhB,GAAKiB;AAAAA,EAAAA,GAAmDrC,QAAAoC,GAAApC,QAAAqC,GAAArC,QAAAsC,KAAAA,IAAAtC,EAAA,EAAA;AAC1G,QAAAuC,IAAArC,GAAUsC,eAAiBtC,GAAUuB,SAArC,WAEJgB,IAAA/B,MAAgBI,KAAhBD,KACOX,GAAUyB,UAAV,KAA2B,IAC5BzB,GAAUyB,UAAV;AAAuB,MAAAe;AAAA,EAAA1C,EAAA,EAAA,MAAAa,KAAAb,UAAAW,KAAAX,EAAA,EAAA,MAAAc,KAEpB4B,IAAA7B,IAAA8B,CAAAA,MAA2BhC,EAAgBkB,GAAGf,CAAO,IAArDgB,QAAkE9B,QAAAa,GAAAb,QAAAW,GAAAX,QAAAc,GAAAd,QAAA0C,KAAAA,IAAA1C,EAAA,EAAA;AAAA,MAAA4C;AAAA,EAAA5C,UAAAY,KAAAZ,EAAA,EAAA,MAAAmC,KAAAnC,EAAA,EAAA,MAAAsC,KAAAtC,EAAA,EAAA,MAAAuC,KAAAvC,UAAAyC,KAAAzC,EAAA,EAAA,MAAA0C,KATnFE,sBAACZ,GAAA,EACS,MAAAG,GACF,IAAAG,GACI,QAAAC,GAEJ,aAAAE,GAIS,aAAAC,GACJ9B,SAAAA,GAAgB,GAC3BZ,QAAAY,GAAAZ,QAAAmC,GAAAnC,QAAAsC,GAAAtC,QAAAuC,GAAAvC,QAAAyC,GAAAzC,QAAA0C,GAAA1C,QAAA4C,KAAAA,IAAA5C,EAAA,EAAA;AAAA,MAAA6C;AAAA,SAAA7C,EAAA,EAAA,MAAAG,KAAAH,EAAA,EAAA,MAAA+B,KAAA/B,EAAA,EAAA,MAAA4C,KAAA5C,UAAAI,KA1BNyC,IAAA,gBAAAC,EAACC,GAAA,EAAY5C,MAAAA,GAAWC,KAAAA,GAEpB2B,UAAAA;AAAAA,IAAAA;AAAAA,IAaAa;AAAAA,EAAAA,GAYJ,GAAQ5C,QAAAG,GAAAH,QAAA+B,GAAA/B,QAAA4C,GAAA5C,QAAAI,GAAAJ,QAAA6C,KAAAA,IAAA7C,EAAA,EAAA,GA3BR6C;AA2BQ;"}
+{"version":3,"file":"visualization.es130.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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"}

package/dist/visualization.es131.js

@@ -1,36 +1,85 @@
-import { jsx as s, jsxs as f } from "react/jsx-runtime";
-import { c as d } from "react/compiler-runtime";
-import u from "./visualization.es82.js";
-const $ = (i) => {
-  const t = d(7), {
-    left: e,
-    top: o,
-    data: r,
-    open: a,
-    pointTooltipBody: l
-  } = i;
-  if (!a || !r)
-    return null;
-  const c = e + 10;
-  let n;
-  t[0] !== r || t[1] !== l ? (n = l && r.point ? l(r.point) : Object.entries(r).map(g), t[0] = r, t[1] = l, t[2] = n) : n = t[2];
-  let p;
-  return t[3] !== c || t[4] !== n || t[5] !== o ? (p = /* @__PURE__ */ s(u, { left: c, top: o, children: n }), t[3] = c, t[4] = n, t[5] = o, t[6] = p) : p = t[6], p;
-};
-function m(i) {
-  return i.toUpperCase();
-}
-function g(i) {
-  const [t, e] = i, o = t.replace(/([a-z])([A-Z])/g, "$1 $2").replace(/^./, m);
-  return t === "outlier" ? /* @__PURE__ */ s("div", { children: /* @__PURE__ */ s("strong", { children: o }) }, t) : /* @__PURE__ */ f("div", { children: [
-    /* @__PURE__ */ f("strong", { children: [
-      o,
-      ": "
-    ] }),
-    typeof e == "string" ? e.length > 45 ? `${e.replace(/_/g, " ").slice(0, 45)}...` : e.replace(/_/g, " ") : String(e)
-  ] }, t);
+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.es127.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
+    }
+  };
 }
 export {
-  $ as default
+  I as useHeatmapCanvasGrid
 };
 //# sourceMappingURL=visualization.es131.js.map