@weng-lab/visualization 2.5.0 → 2.5.1-beta.0

package/dist/visualization.es122.js

@@ -1,127 +1,83 @@
-import { cellKey as D, resolveCellAppearance as H } from "./visualization.es121.js";
-const w = (t, o, n) => Math.min(Math.max(t, o), n);
-function x(t, o, n) {
-  const {
-    xScale: a,
-    cellYScale: r,
-    gap: i,
-    isRect: l,
-    binWidth: c,
-    binHeight: u
-  } = t;
-  if (l)
-    return {
-      isRect: !0,
-      x: a(o),
-      y: r(n) + i,
-      width: c - i,
-      height: u - i
-    };
-  const e = Math.min(c, u) / 2;
-  return {
-    isRect: !1,
-    cx: o * c + c / 2,
-    cy: r(n) + i + e,
-    r: e - i,
-    radius: e
-  };
-}
-function W(t, o, n, a, r, i) {
-  const {
-    data: l,
-    numRows: c,
-    binWidth: u,
-    binHeight: e,
-    yMax: s
-  } = t;
-  return {
-    colStart: w(Math.floor(o / u) - i, 0, Math.max(0, l.length - 1)),
-    colEnd: w(Math.ceil((o + a) / u) + i, 0, Math.max(0, l.length - 1)),
-    rowStart: w(Math.floor((s - (n + r)) / e) - i, 0, Math.max(0, c - 1)),
-    rowEnd: w(Math.floor((s - n) / e) + i, 0, Math.max(0, c - 1))
-  };
-}
-function C(t, o, n, a) {
-  const {
-    data: r,
-    colorScale: i,
-    selectedKeys: l,
-    deselectedColor: c
-  } = o;
-  let u = null, e = -1;
-  for (let s = n.colStart; s <= n.colEnd; s++) {
-    const y = r[s];
-    if (y)
-      for (let f = n.rowStart; f <= n.rowEnd; f++) {
-        const M = y.rows[f];
-        if (!M) continue;
-        const g = M.count, R = g == null ? void 0 : i(g), A = !!l && !l.has(D({
-          row: f,
-          column: s
-        })), {
-          fill: d,
-          fillOpacity: m
-        } = H(g, R, A, c);
-        if (m <= 0) continue;
-        const h = x(o, s, f);
-        m !== e && (t.globalAlpha = m, e = m), d !== u && (t.fillStyle = d, u = d);
-        const b = a !== null && a.row === f && a.column === s;
-        if (h.isRect) {
-          const p = Math.max(h.width, 0), S = Math.max(h.height, 0);
-          t.fillRect(h.x, h.y, p, S), b && (t.beginPath(), t.rect(h.x, h.y, p, S));
-        } else
-          t.beginPath(), t.arc(h.cx, h.cy, Math.max(h.r, 0), 0, Math.PI * 2), t.fill();
-        b && (t.globalAlpha = 1, e = 1, t.lineWidth = 2, t.strokeStyle = d, t.stroke());
-      }
-  }
-  t.globalAlpha = 1;
-}
-function P(t, o, n) {
-  const {
-    data: a,
-    numRows: r,
-    binWidth: i,
-    binHeight: l,
-    yMax: c
-  } = t;
-  if (o < 0 || n < 0) return null;
-  const u = Math.floor(o / i), e = Math.floor((c - n) / l);
-  return u < 0 || u >= a.length || e < 0 || e >= r || !a[u]?.rows[e] ? null : {
-    row: e,
-    column: u
-  };
-}
-function k(t, o) {
-  const n = t.data[o.column], a = n?.rows[o.row];
-  if (!n || !a) return null;
-  const r = a.count, i = r == null ? void 0 : t.colorScale(r), l = x(t, o.column, o.row), c = {
-    bin: a,
-    row: o.row,
-    column: o.column,
-    datum: n,
-    gap: t.gap,
-    count: r,
-    color: i,
-    opacity: r == null ? void 0 : 1
-  };
-  return l.isRect ? {
-    ...c,
-    x: l.x,
-    y: l.y,
-    width: l.width,
-    height: l.height
-  } : {
-    ...c,
-    cx: l.cx,
-    cy: l.cy,
-    r: l.r,
-    radius: l.radius
-  };
-}
+import { jsxs as U, jsx as X } from "react/jsx-runtime";
+import { useRef as Y, useEffect as k, useCallback as l } from "react";
+import { drawHeatmapCells as q } from "./visualization.es121.js";
+const m = (c, o, e) => Math.min(Math.max(c, o), e), J = ({
+  canvasCellParams: c,
+  xMax: o,
+  yMax: e,
+  viewportWidth: a,
+  viewportHeight: s,
+  scrollLeft: b,
+  scrollTop: P,
+  width: i,
+  height: d,
+  onNavigate: f,
+  onCanvasClick: R,
+  onReady: g
+}) => {
+  const D = Y(null), n = o > 0 ? i / o : 0, r = e > 0 ? d / e : 0, S = Y(g);
+  S.current = g, k(() => {
+    const t = D.current;
+    if (!t || n <= 0 || r <= 0) return;
+    const u = requestAnimationFrame(() => {
+      const p = t.getContext("2d");
+      if (!p) return;
+      const I = window.devicePixelRatio || 1;
+      p.setTransform(I * n, 0, 0, I * r, 0, 0), p.clearRect(0, 0, o, e);
+      const M = {
+        colStart: 0,
+        colEnd: Math.max(0, c.data.length - 1),
+        rowStart: 0,
+        rowEnd: Math.max(0, c.numRows - 1)
+      };
+      q(p, c, M, null), S.current?.();
+    });
+    return () => cancelAnimationFrame(u);
+  }, [c, o, e, n, r]);
+  const T = l((t, u) => {
+    f(m(t - a / 2, 0, Math.max(0, o - a)), m(u - s / 2, 0, Math.max(0, e - s)));
+  }, [f, a, s, o, e]), h = l((t) => {
+    if (R) {
+      R();
+      return;
+    }
+    if (n <= 0 || r <= 0) return;
+    const u = t.currentTarget.getBoundingClientRect();
+    T((t.clientX - u.left) / n, (t.clientY - u.top) / r);
+  }, [R, T, n, r]), j = l((t) => {
+    t.stopPropagation(), t.currentTarget.setPointerCapture(t.pointerId);
+  }, []), x = l((t) => {
+    n <= 0 || r <= 0 || !t.currentTarget.hasPointerCapture(t.pointerId) || f(m(b + t.movementX / n, 0, Math.max(0, o - a)), m(P + t.movementY / r, 0, Math.max(0, e - s)));
+  }, [b, P, n, r, o, e, a, s, f]), z = l((t) => {
+    t.currentTarget.releasePointerCapture(t.pointerId);
+  }, []), C = m(b * n, 0, i), E = m(P * r, 0, d), A = Math.max(0, Math.min(a * n, i - C)), F = Math.max(0, Math.min(s * r, d - E));
+  return /* @__PURE__ */ U("div", { style: {
+    position: "relative",
+    width: i,
+    height: d
+  }, children: [
+    /* @__PURE__ */ X("canvas", { ref: D, width: i * (window.devicePixelRatio || 1), height: d * (window.devicePixelRatio || 1), style: {
+      width: i,
+      height: d,
+      display: "block",
+      cursor: "pointer",
+      border: "1px solid #d5d5d5",
+      boxSizing: "border-box"
+    }, onPointerDown: h }),
+    /* @__PURE__ */ X("div", { onPointerDown: j, onPointerMove: x, onPointerUp: z, style: {
+      position: "absolute",
+      left: C,
+      top: E,
+      width: A,
+      height: F,
+      border: "2px solid #0d0f98",
+      backgroundColor: "rgba(13, 15, 152, 0.15)",
+      cursor: "grab",
+      boxSizing: "border-box"
+    } })
+  ] });
+};
 export {
-  k as buildBin,
-  C as drawHeatmapCells,
-  W as getVisibleRange,
-  P as hitTestCell
+  J as default
 };
 //# sourceMappingURL=visualization.es122.js.map

package/dist/visualization.es122.js.map

@@ -1 +1 @@
-{"version":3,"file":"visualization.es122.js","sources":["../src/components/Heatmap/HeatmapCanvasCells.ts"],"sourcesContent":["import type { ColumnDatum, HeatmapCellId } from \"./types\";\nimport type { AnyBin } from \"./HeatmapCells\";\nimport { cellKey, resolveCellAppearance } from \"./heatmapCellAppearance\";\n\n/**\n * Everything the canvas draw loop and hit-testing need to place a cell exactly where the SVG\n * path (HeatmapCells.tsx, via @visx/heatmap's HeatmapRect/HeatmapCircle) would. xScale/cellYScale\n * are the same functions Heatmap.tsx already builds and passes to HeatmapCells.\n */\nexport interface CanvasCellParams {\n  data: ColumnDatum[];\n  numRows: number;\n  xScale: (column: number) => number;\n  cellYScale: (row: number) => number;\n  colorScale: (count: number) => string | undefined;\n  gap: number;\n  isRect: boolean;\n  binWidth: number;\n  binHeight: number;\n  yMax: number;\n  selectedKeys: Set<string> | null;\n  deselectedColor: string;\n}\n\nexport interface CanvasDrawRange {\n  colStart: number;\n  colEnd: number;\n  rowStart: number;\n  rowEnd: number;\n}\n\nconst clamp = (value: number, min: number, max: number) => Math.min(Math.max(value, min), max);\n\n// Mirrors @visx/heatmap's HeatmapRect/HeatmapCircle bin geometry exactly (see their source:\n// node_modules/@visx/heatmap/lib/heatmaps/{HeatmapRect,HeatmapCircle}.js) so canvas-drawn cells\n// land on the same pixels the SVG path (export, non-scrollable mode) would draw them at. The\n// circle center's x mirrors HeatmapCell.tsx's own recomputation (col*binWidth + binWidth/2)\n// rather than @visx/heatmap's raw cx, for the same reason that file does it: keeps circles\n// centered in their cell regardless of the configured radius.\ntype CellGeometry =\n  | { isRect: true; x: number; y: number; width: number; height: number }\n  | { isRect: false; cx: number; cy: number; r: number; radius: number };\n\nfunction getCellGeometry(params: CanvasCellParams, col: number, row: number): CellGeometry {\n  const { xScale, cellYScale, gap, isRect, binWidth, binHeight } = params;\n  if (isRect) {\n    return { isRect: true, x: xScale(col), y: cellYScale(row) + gap, width: binWidth - gap, height: binHeight - gap };\n  }\n  const radius = Math.min(binWidth, binHeight) / 2;\n  return { isRect: false, cx: col * binWidth + binWidth / 2, cy: cellYScale(row) + gap + radius, r: radius - gap, radius };\n}\n\n/**\n * Column/row index bounds (inclusive) that intersect the given scroll viewport, plus a small\n * overscan so a cell is already drawn just before it scrolls into view rather than popping in a\n * frame late. Row bounds are derived from cellYScale's own convention (row 0 at the bottom of\n * the grid, row numRows-1 at the top): a cell at row r occupies content-y band\n * [yMax-(r+1)*binHeight, yMax-r*binHeight), so the row under a given y is\n * floor((yMax-y)/binHeight).\n */\nexport function getVisibleRange(\n  params: CanvasCellParams,\n  scrollLeft: number,\n  scrollTop: number,\n  viewportWidth: number,\n  viewportHeight: number,\n  overscan: number\n): CanvasDrawRange {\n  const { data, numRows, binWidth, binHeight, yMax } = params;\n  return {\n    colStart: clamp(Math.floor(scrollLeft / binWidth) - overscan, 0, Math.max(0, data.length - 1)),\n    colEnd: clamp(Math.ceil((scrollLeft + viewportWidth) / binWidth) + overscan, 0, Math.max(0, data.length - 1)),\n    rowStart: clamp(Math.floor((yMax - (scrollTop + viewportHeight)) / binHeight) - overscan, 0, Math.max(0, numRows - 1)),\n    rowEnd: clamp(Math.floor((yMax - scrollTop) / binHeight) + overscan, 0, Math.max(0, numRows - 1)),\n  };\n}\n\n/** Paints the cells in `range` onto `ctx`, whose origin is already at content-space (0,0). */\nexport function drawHeatmapCells(\n  ctx: CanvasRenderingContext2D,\n  params: CanvasCellParams,\n  range: CanvasDrawRange,\n  hoveredCell: HeatmapCellId | null\n) {\n  const { data, colorScale, selectedKeys, deselectedColor } = params;\n  // fillStyle/globalAlpha assignment forces the browser to re-parse the CSS color string even\n  // when it's unchanged from the previous cell - skipping redundant writes matters at this scale\n  // (this loop runs per-cell, up to hundreds of thousands of times for the minimap's full-dataset\n  // draw). Rects also use fillRect directly (no beginPath/rect/fill trio) since it's a faster\n  // native path for solid fills; a path is only built for a cell when it's the hovered one, so\n  // its outline can still be stroked.\n  let lastFill: string | null = null;\n  let lastAlpha = -1;\n  for (let col = range.colStart; col <= range.colEnd; col++) {\n    const columnDatum = data[col];\n    if (!columnDatum) continue;\n    for (let row = range.rowStart; row <= range.rowEnd; row++) {\n      const rowDatum = columnDatum.rows[row];\n      if (!rowDatum) continue;\n      const count = rowDatum.count;\n      const color = count == null ? undefined : colorScale(count);\n      const isDeselected = !!selectedKeys && !selectedKeys.has(cellKey({ row, column: col }));\n      const { fill, fillOpacity } = resolveCellAppearance(count, color, isDeselected, deselectedColor);\n      if (fillOpacity <= 0) continue;\n\n      const geometry = getCellGeometry(params, col, row);\n      if (fillOpacity !== lastAlpha) {\n        ctx.globalAlpha = fillOpacity;\n        lastAlpha = fillOpacity;\n      }\n      if (fill !== lastFill) {\n        ctx.fillStyle = fill;\n        lastFill = fill;\n      }\n\n      const isHovered = hoveredCell !== null && hoveredCell.row === row && hoveredCell.column === col;\n      if (geometry.isRect) {\n        const width = Math.max(geometry.width, 0);\n        const height = Math.max(geometry.height, 0);\n        ctx.fillRect(geometry.x, geometry.y, width, height);\n        if (isHovered) {\n          ctx.beginPath();\n          ctx.rect(geometry.x, geometry.y, width, height);\n        }\n      } else {\n        ctx.beginPath();\n        ctx.arc(geometry.cx, geometry.cy, Math.max(geometry.r, 0), 0, Math.PI * 2);\n        ctx.fill();\n      }\n\n      if (isHovered) {\n        ctx.globalAlpha = 1;\n        lastAlpha = 1;\n        ctx.lineWidth = 2;\n        ctx.strokeStyle = fill;\n        ctx.stroke();\n      }\n    }\n  }\n  ctx.globalAlpha = 1;\n}\n\n/** Content-space (post-scroll-offset) coordinates -> the cell under them, or null if none. */\nexport function hitTestCell(params: CanvasCellParams, contentX: number, contentY: number): HeatmapCellId | null {\n  const { data, numRows, binWidth, binHeight, yMax } = params;\n  if (contentX < 0 || contentY < 0) return null;\n  const column = Math.floor(contentX / binWidth);\n  const row = Math.floor((yMax - contentY) / binHeight);\n  if (column < 0 || column >= data.length || row < 0 || row >= numRows) return null;\n  if (!data[column]?.rows[row]) return null;\n  return { row, column };\n}\n\n/** Builds the same bin shape @visx/heatmap's RectCell/CircleCell provide, for onClick/tooltipBody. */\nexport function buildBin(params: CanvasCellParams, cell: HeatmapCellId): AnyBin | null {\n  const columnDatum = params.data[cell.column];\n  const rowDatum = columnDatum?.rows[cell.row];\n  if (!columnDatum || !rowDatum) return null;\n\n  const count = rowDatum.count;\n  const color = count == null ? undefined : params.colorScale(count);\n  const geometry = getCellGeometry(params, cell.column, cell.row);\n  const shared = { bin: rowDatum, row: cell.row, column: cell.column, datum: columnDatum, gap: params.gap, count, color, opacity: count == null ? undefined : 1 };\n\n  return geometry.isRect\n    ? ({ ...shared, x: geometry.x, y: geometry.y, width: geometry.width, height: geometry.height } as AnyBin)\n    : ({ ...shared, cx: geometry.cx, cy: geometry.cy, r: geometry.r, radius: geometry.radius } as AnyBin);\n}\n"],"names":["clamp","value","min","max","Math","getCellGeometry","params","col","row","xScale","cellYScale","gap","isRect","binWidth","binHeight","x","y","width","height","radius","cx","cy","r","getVisibleRange","scrollLeft","scrollTop","viewportWidth","viewportHeight","overscan","data","numRows","yMax","colStart","floor","length","colEnd","ceil","rowStart","rowEnd","drawHeatmapCells","ctx","range","hoveredCell","colorScale","selectedKeys","deselectedColor","lastFill","lastAlpha","columnDatum","rowDatum","rows","count","color","undefined","isDeselected","has","cellKey","column","fill","fillOpacity","resolveCellAppearance","geometry","globalAlpha","fillStyle","isHovered","fillRect","beginPath","rect","arc","PI","lineWidth","strokeStyle","stroke","hitTestCell","contentX","contentY","buildBin","cell","shared","bin","datum","opacity"],"mappings":"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"}
+{"version":3,"file":"visualization.es122.js","sources":["../src/components/Heatmap/scrollable/HeatmapMiniMap.tsx"],"sourcesContent":["import { useCallback, useEffect, useRef } from \"react\";\nimport { drawHeatmapCells, type CanvasCellParams } from \"../HeatmapCanvasCells\";\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 completes, so a caller (e.g. the expanded popup) can show its own\n   * loading state for the full-dataset draw without this component needing to know about it. */\n  onReady?: () => void;\n}\n\nconst clamp = (value: number, min: number, max: number) => Math.min(Math.max(value, min), max);\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}: 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  // Read via a ref rather than as an effect dependency below - onReady is commonly passed as an\n  // inline arrow function, and putting it in the deps array would re-trigger (and re-run) the\n  // draw effect on every parent render instead of only when the drawable content actually changes.\n  const onReadyRef = useRef(onReady);\n  onReadyRef.current = onReady;\n\n  useEffect(() => {\n    const canvas = canvasRef.current;\n    if (!canvas || scaleX <= 0 || scaleY <= 0) return;\n    // The full-dataset draw below is synchronous and can take a while for large grids (the\n    // minimap has no windowing, unlike the main grid). Deferring it a frame lets the surrounding\n    // UI - the expanded popup's backdrop, border, and title bar - paint first, so opening the\n    // minimap feels immediate instead of the whole popup appearing to hang.\n    const raf = requestAnimationFrame(() => {\n      const ctx = canvas.getContext(\"2d\");\n      if (!ctx) return;\n      const dpr = window.devicePixelRatio || 1;\n      ctx.setTransform(dpr * scaleX, 0, 0, dpr * scaleY, 0, 0);\n      ctx.clearRect(0, 0, xMax, yMax);\n      const range = {\n        colStart: 0,\n        colEnd: Math.max(0, canvasCellParams.data.length - 1),\n        rowStart: 0,\n        rowEnd: Math.max(0, canvasCellParams.numRows - 1),\n      };\n      drawHeatmapCells(ctx, canvasCellParams, range, null);\n      onReadyRef.current?.();\n    });\n    return () => cancelAnimationFrame(raf);\n  }, [canvasCellParams, xMax, yMax, scaleX, scaleY]);\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 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    </div>\n  );\n};\n\nexport default HeatmapMiniMap;\n"],"names":["clamp","value","min","max","Math","HeatmapMiniMap","canvasCellParams","xMax","yMax","viewportWidth","viewportHeight","scrollLeft","scrollTop","width","height","onNavigate","onCanvasClick","onReady","canvasRef","useRef","scaleX","scaleY","onReadyRef","current","useEffect","canvas","raf","requestAnimationFrame","ctx","getContext","dpr","window","devicePixelRatio","setTransform","clearRect","range","colStart","colEnd","data","length","rowStart","rowEnd","numRows","drawHeatmapCells","cancelAnimationFrame","navigateCentered","useCallback","contentX","contentY","handleCanvasPointerDown","event","rect","currentTarget","getBoundingClientRect","clientX","left","clientY","top","handleRectPointerDown","stopPropagation","setPointerCapture","pointerId","handleRectPointerMove","hasPointerCapture","movementX","movementY","handleRectPointerUp","releasePointerCapture","rectLeft","rectTop","rectWidth","rectHeight","jsxs","position","jsx","display","cursor","border","boxSizing","backgroundColor"],"mappings":"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"}

package/dist/visualization.es123.js

@@ -1,83 +1,159 @@
-import { jsxs as U, jsx as X } from "react/jsx-runtime";
-import { useRef as Y, useEffect as k, useCallback as l } from "react";
-import { drawHeatmapCells as q } from "./visualization.es122.js";
-const m = (c, o, e) => Math.min(Math.max(c, o), e), J = ({
-  canvasCellParams: c,
-  xMax: o,
-  yMax: e,
-  viewportWidth: a,
-  viewportHeight: s,
-  scrollLeft: b,
-  scrollTop: P,
-  width: i,
-  height: d,
-  onNavigate: f,
-  onCanvasClick: R,
-  onReady: g
-}) => {
-  const D = Y(null), n = o > 0 ? i / o : 0, r = e > 0 ? d / e : 0, S = Y(g);
-  S.current = g, k(() => {
-    const t = D.current;
-    if (!t || n <= 0 || r <= 0) return;
-    const u = requestAnimationFrame(() => {
-      const p = t.getContext("2d");
-      if (!p) return;
-      const I = window.devicePixelRatio || 1;
-      p.setTransform(I * n, 0, 0, I * r, 0, 0), p.clearRect(0, 0, o, e);
-      const M = {
-        colStart: 0,
-        colEnd: Math.max(0, c.data.length - 1),
-        rowStart: 0,
-        rowEnd: Math.max(0, c.numRows - 1)
-      };
-      q(p, c, M, null), S.current?.();
-    });
-    return () => cancelAnimationFrame(u);
-  }, [c, o, e, n, r]);
-  const T = l((t, u) => {
-    f(m(t - a / 2, 0, Math.max(0, o - a)), m(u - s / 2, 0, Math.max(0, e - s)));
-  }, [f, a, s, o, e]), h = l((t) => {
-    if (R) {
-      R();
+import { jsx as o, jsxs as S } from "react/jsx-runtime";
+import { c as T } from "react/compiler-runtime";
+import { useRef as D, useEffect as W, useState as j } from "react";
+import { createPortal as G } from "react-dom";
+import V from "./visualization.es122.js";
+const B = 94, K = 90, N = 16, X = 2147483647, Y = (k) => {
+  const e = T(31);
+  let n, r, t;
+  e[0] !== k ? ({
+    onClose: t,
+    containerRef: n,
+    ...r
+  } = k, e[0] = k, e[1] = n, e[2] = r, e[3] = t) : (n = e[1], r = e[2], t = e[3]);
+  const z = D(null);
+  let h, u;
+  e[4] !== n || e[5] !== t ? (h = () => {
+    const c = (m) => {
+      const p = m.target;
+      n.current?.contains(p) || z.current?.contains(p) || t();
+    }, f = (m) => {
+      m.key === "Escape" && t();
+    };
+    return document.addEventListener("pointerdown", c), document.addEventListener("keydown", f), () => {
+      document.removeEventListener("pointerdown", c), document.removeEventListener("keydown", f);
+    };
+  }, u = [n, t], e[4] = n, e[5] = t, e[6] = h, e[7] = u) : (h = e[6], u = e[7]), W(h, u);
+  const [i, C] = j(null), [E, A] = j(!1);
+  let y;
+  e[8] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (y = () => A(!0), e[8] = y) : y = e[8];
+  const L = y, H = D(null);
+  let b;
+  e[9] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (b = (c) => {
+    if (H.current?.disconnect(), H.current = null, !c) {
+      C(null);
       return;
     }
-    if (n <= 0 || r <= 0) return;
-    const u = t.currentTarget.getBoundingClientRect();
-    T((t.clientX - u.left) / n, (t.clientY - u.top) / r);
-  }, [R, T, n, r]), j = l((t) => {
-    t.stopPropagation(), t.currentTarget.setPointerCapture(t.pointerId);
-  }, []), x = l((t) => {
-    n <= 0 || r <= 0 || !t.currentTarget.hasPointerCapture(t.pointerId) || f(m(b + t.movementX / n, 0, Math.max(0, o - a)), m(P + t.movementY / r, 0, Math.max(0, e - s)));
-  }, [b, P, n, r, o, e, a, s, f]), z = l((t) => {
-    t.currentTarget.releasePointerCapture(t.pointerId);
-  }, []), C = m(b * n, 0, i), E = m(P * r, 0, d), A = Math.max(0, Math.min(a * n, i - C)), F = Math.max(0, Math.min(s * r, d - E));
-  return /* @__PURE__ */ U("div", { style: {
+    const f = new ResizeObserver((m) => {
+      const [p] = m;
+      if (!p)
+        return;
+      const {
+        width: U,
+        height: $
+      } = p.contentRect;
+      C({
+        width: Math.floor(U),
+        height: Math.floor($)
+      });
+    });
+    f.observe(c), H.current = f;
+  }, e[9] = b) : b = e[9];
+  const O = b;
+  let g, _;
+  e[10] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (g = {
+    position: "fixed",
+    inset: 0,
+    zIndex: X,
+    background: "rgba(0,0,0,0.45)",
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center"
+  }, _ = /* @__PURE__ */ o("style", { children: "@keyframes heatmapMiniMapSpinnerRotate { to { transform: rotate(360deg); } }" }), e[10] = g, e[11] = _) : (g = e[10], _ = e[11]);
+  let x, v, P;
+  e[12] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (x = {
     position: "relative",
-    width: i,
-    height: d
-  }, children: [
-    /* @__PURE__ */ X("canvas", { ref: D, width: i * (window.devicePixelRatio || 1), height: d * (window.devicePixelRatio || 1), style: {
-      width: i,
-      height: d,
-      display: "block",
-      cursor: "pointer",
-      border: "1px solid #d5d5d5",
-      boxSizing: "border-box"
-    }, onPointerDown: h }),
-    /* @__PURE__ */ X("div", { onPointerDown: j, onPointerMove: x, onPointerUp: z, style: {
-      position: "absolute",
-      left: C,
-      top: E,
-      width: A,
-      height: F,
-      border: "2px solid #0d0f98",
-      backgroundColor: "rgba(13, 15, 152, 0.15)",
-      cursor: "grab",
-      boxSizing: "border-box"
-    } })
-  ] });
+    width: `${B}vw`,
+    height: `${K}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"
+  }, v = {
+    flexShrink: 0,
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "space-between",
+    padding: `10px ${N}px`,
+    background: "#f7f7f8",
+    borderBottom: "1px solid #e5e5e5"
+  }, P = /* @__PURE__ */ o("span", { style: {
+    fontSize: 14,
+    fontWeight: 600,
+    color: "#333"
+  }, children: "Minimap" }), e[12] = x, e[13] = v, e[14] = P) : (x = e[12], v = e[13], P = e[14]);
+  let M;
+  e[15] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (M = {
+    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[15] = M) : M = e[15];
+  let l;
+  e[16] !== t ? (l = /* @__PURE__ */ S("div", { style: v, children: [
+    P,
+    /* @__PURE__ */ o("button", { type: "button", "aria-label": "Close expanded minimap", onClick: t, style: M, children: "×" })
+  ] }), e[16] = t, e[17] = l) : l = e[17];
+  let w;
+  e[18] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (w = {
+    flex: 1,
+    minHeight: 0,
+    display: "flex",
+    padding: N
+  }, e[18] = w) : w = e[18];
+  let I;
+  e[19] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (I = {
+    flex: 1,
+    minHeight: 0,
+    position: "relative"
+  }, e[19] = I) : I = e[19];
+  let s;
+  e[20] !== E ? (s = !E && /* @__PURE__ */ o("div", { "aria-label": "Loading minimap", style: {
+    position: "absolute",
+    inset: 0,
+    zIndex: 1,
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center",
+    pointerEvents: "none"
+  }, children: /* @__PURE__ */ o("div", { style: {
+    width: 40,
+    height: 40,
+    borderRadius: "50%",
+    border: "4px solid #e5e5e5",
+    borderTopColor: "#0d0f98",
+    animation: "heatmapMiniMapSpinnerRotate 0.8s linear infinite"
+  } }) }), e[20] = E, e[21] = s) : s = e[21];
+  let a;
+  e[22] !== r || e[23] !== i ? (a = i && i.width > 0 && i.height > 0 && /* @__PURE__ */ o(V, { ...r, width: i.width, height: i.height, onReady: L }), e[22] = r, e[23] = i, e[24] = a) : a = e[24];
+  let d;
+  e[25] !== s || e[26] !== a ? (d = /* @__PURE__ */ o("div", { style: w, children: /* @__PURE__ */ S("div", { ref: O, style: I, children: [
+    s,
+    a
+  ] }) }), e[25] = s, e[26] = a, e[27] = d) : d = e[27];
+  let R;
+  return e[28] !== l || e[29] !== d ? (R = G(/* @__PURE__ */ S("div", { style: g, children: [
+    _,
+    /* @__PURE__ */ S("div", { ref: z, style: x, children: [
+      l,
+      d
+    ] })
+  ] }), document.body), e[28] = l, e[29] = d, e[30] = R) : R = e[30], R;
 };
 export {
-  J as default
+  Y as default
 };
 //# sourceMappingURL=visualization.es123.js.map

package/dist/visualization.es123.js.map

@@ -1 +1 @@
-{"version":3,"file":"visualization.es123.js","sources":["../src/components/Heatmap/scrollable/HeatmapMiniMap.tsx"],"sourcesContent":["import { useCallback, useEffect, useRef } from \"react\";\nimport { drawHeatmapCells, type CanvasCellParams } from \"../HeatmapCanvasCells\";\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 completes, so a caller (e.g. the expanded popup) can show its own\n   * loading state for the full-dataset draw without this component needing to know about it. */\n  onReady?: () => void;\n}\n\nconst clamp = (value: number, min: number, max: number) => Math.min(Math.max(value, min), max);\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}: 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  // Read via a ref rather than as an effect dependency below - onReady is commonly passed as an\n  // inline arrow function, and putting it in the deps array would re-trigger (and re-run) the\n  // draw effect on every parent render instead of only when the drawable content actually changes.\n  const onReadyRef = useRef(onReady);\n  onReadyRef.current = onReady;\n\n  useEffect(() => {\n    const canvas = canvasRef.current;\n    if (!canvas || scaleX <= 0 || scaleY <= 0) return;\n    // The full-dataset draw below is synchronous and can take a while for large grids (the\n    // minimap has no windowing, unlike the main grid). Deferring it a frame lets the surrounding\n    // UI - the expanded popup's backdrop, border, and title bar - paint first, so opening the\n    // minimap feels immediate instead of the whole popup appearing to hang.\n    const raf = requestAnimationFrame(() => {\n      const ctx = canvas.getContext(\"2d\");\n      if (!ctx) return;\n      const dpr = window.devicePixelRatio || 1;\n      ctx.setTransform(dpr * scaleX, 0, 0, dpr * scaleY, 0, 0);\n      ctx.clearRect(0, 0, xMax, yMax);\n      const range = {\n        colStart: 0,\n        colEnd: Math.max(0, canvasCellParams.data.length - 1),\n        rowStart: 0,\n        rowEnd: Math.max(0, canvasCellParams.numRows - 1),\n      };\n      drawHeatmapCells(ctx, canvasCellParams, range, null);\n      onReadyRef.current?.();\n    });\n    return () => cancelAnimationFrame(raf);\n  }, [canvasCellParams, xMax, yMax, scaleX, scaleY]);\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 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    </div>\n  );\n};\n\nexport default HeatmapMiniMap;\n"],"names":["clamp","value","min","max","Math","HeatmapMiniMap","canvasCellParams","xMax","yMax","viewportWidth","viewportHeight","scrollLeft","scrollTop","width","height","onNavigate","onCanvasClick","onReady","canvasRef","useRef","scaleX","scaleY","onReadyRef","current","useEffect","canvas","raf","requestAnimationFrame","ctx","getContext","dpr","window","devicePixelRatio","setTransform","clearRect","range","colStart","colEnd","data","length","rowStart","rowEnd","numRows","drawHeatmapCells","cancelAnimationFrame","navigateCentered","useCallback","contentX","contentY","handleCanvasPointerDown","event","rect","currentTarget","getBoundingClientRect","clientX","left","clientY","top","handleRectPointerDown","stopPropagation","setPointerCapture","pointerId","handleRectPointerMove","hasPointerCapture","movementX","movementY","handleRectPointerUp","releasePointerCapture","rectLeft","rectTop","rectWidth","rectHeight","jsxs","position","jsx","display","cursor","border","boxSizing","backgroundColor"],"mappings":"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"}
+{"version":3,"file":"visualization.es123.js","sources":["../src/components/Heatmap/scrollable/HeatmapMiniMapPopup.tsx"],"sourcesContent":["import { useCallback, useEffect, useRef, useState, type RefObject } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport HeatmapMiniMap, { type HeatmapMiniMapProps } from \"./HeatmapMiniMap\";\n\n// The expanded minimap opens as a viewport-fixed modal sized off the screen, not the plot's own\n// (often much smaller) container - nearly the whole screen, but leaving a visible backdrop margin\n// so it still reads as a popup rather than a page navigation.\nconst MINI_MAP_POPUP_WIDTH_VW = 94;\nconst MINI_MAP_POPUP_HEIGHT_VH = 90;\nconst MINI_MAP_POPUP_PADDING = 16;\n// `position: fixed` only escapes to the viewport if every ancestor is un-transformed; a single\n// transform/filter/will-change/contain anywhere between the heatmap and <body> in a consuming\n// app re-scopes it to that ancestor instead, letting unrelated elements elsewhere on the page\n// stack above it regardless of z-index. Portaling straight to document.body below sidesteps\n// that; the max practical z-index on top of it is belt-and-suspenders against anything else on\n// the host page (app chrome, third-party widgets) that also claims a very high value.\nconst MINI_MAP_POPUP_Z_INDEX = 2147483647;\n\ntype MiniMapPassThroughProps = Omit<HeatmapMiniMapProps, \"width\" | \"height\" | \"onCanvasClick\">;\n\nexport interface HeatmapMiniMapPopupProps extends MiniMapPassThroughProps {\n  onClose: () => void;\n  /** The inline minimap's own container - counts as \"inside\" for the outside-click check below. */\n  containerRef: RefObject<HTMLDivElement | null>;\n}\n\nconst HeatmapMiniMapPopup = ({ onClose, containerRef, ...miniMapProps }: HeatmapMiniMapPopupProps) => {\n  // The popup itself lives outside containerRef in the tree (it's positioned relative to the\n  // plot's outer container, not the small inline minimap) - both refs count as \"inside\" here.\n  const popupRef = useRef<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      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]);\n\n  // The expanded minimap's canvas needs real pixel dimensions (for dpr scaling), but the popup\n  // itself is sized by CSS (vw/vh) against the viewport, which can change as the window resizes\n  // while the popup is open - ResizeObserver on the flex-filled area inside it is what actually\n  // measures that, rather than computing it from window.innerWidth/innerHeight up front.\n  const [size, setSize] = useState<{ width: number; height: number } | null>(null);\n  // The minimap draws its entire dataset with no windowing, so for large grids the popup can sit\n  // blank for a noticeable moment after opening - a skeleton fills that gap instead of looking\n  // like the popup hung. Owned here (not inside HeatmapMiniMap) since only the expanded view is\n  // large/slow enough to warrant one; the small always-visible inline minimap doesn't need it.\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  return createPortal(\n    <div 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      <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        {/* A proper title bar, not just a close button floating in extra top padding - its\n            horizontal padding matches the body's below so the panel reads as evenly framed. */}\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\", padding: MINI_MAP_POPUP_PADDING }}>\n          <div ref={areaRef} style={{ flex: 1, minHeight: 0, position: \"relative\" }}>\n            {/* Rendered as soon as the popup mounts, independent of `size` - the area div is\n                already laid out by CSS (flex: 1) on this same paint, so the skeleton can fill it\n                immediately. Waiting on `size` (the async ResizeObserver round-trip) would leave a\n                blank gap before the skeleton itself shows up, which is exactly what it's meant to\n                cover. */}\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                    // Matches the viewport-rectangle accent color HeatmapMiniMap itself uses.\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","HeatmapMiniMapPopup","t0","$","_c","containerRef","miniMapProps","onClose","popupRef","useRef","t1","t2","handlePointerDown","event","target","current","contains","handleKeyDown","event_0","key","document","addEventListener","removeEventListener","useEffect","size","setSize","useState","isReady","setIsReady","t3","Symbol","for","handleReady","observerRef","t4","node","disconnect","observer","ResizeObserver","t5","entry","width","height","contentRect","Math","floor","observe","areaRef","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","t13","t14","pointerEvents","borderTopColor","animation","t15","HeatmapMiniMap","t16","t17","createPortal","jsxs","body"],"mappings":"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"}