@weng-lab/visualization 2.4.0-beta.4 → 2.4.0-beta.6

package/dist/visualization.es66.js

@@ -1,60 +1,50 @@
-import { c as L } from "react/compiler-runtime";
-import { useState as T, useRef as W } from "react";
-import { invertRescaled as y } from "./visualization.es17.js";
-import { useStableCallback as $ } from "./visualization.es19.js";
-import j from "./visualization.es41.js";
-const D = (P) => {
-  const t = L(17), {
-    enabled: i,
-    margin: l,
-    boundedWidth: c,
-    boundedHeight: u,
-    xScale: f,
-    yScale: h,
-    onCrosshairChange: R
-  } = P, [m, X] = T(null), S = W(null), p = $(R);
-  let s;
-  t[0] !== p ? (s = (r) => {
-    r === null && S.current === null || (S.current = r, X(r), p(r));
-  }, t[0] = p, t[1] = s) : s = t[1];
-  const e = s;
-  let o;
-  t[2] !== u || t[3] !== c || t[4] !== i || t[5] !== l.left || t[6] !== l.top || t[7] !== e || t[8] !== f || t[9] !== h ? (o = (r, Y) => {
-    if (!i)
-      return;
-    const C = j(r.currentTarget, r);
-    if (!C)
-      return;
-    const g = C.x - l.left, x = C.y - l.top;
-    if (g < 0 || g > c || x < 0 || x > u) {
-      e(null);
-      return;
-    }
-    const {
-      translateX: v,
-      translateY: M,
-      scaleX: k,
-      scaleY: H
-    } = Y.transformMatrix;
-    e({
-      x: y(f, v, k, g),
-      y: y(h, M, H, x)
-    });
-  }, t[2] = u, t[3] = c, t[4] = i, t[5] = l.left, t[6] = l.top, t[7] = e, t[8] = f, t[9] = h, t[10] = o) : o = t[10];
-  const d = o;
+import { jsx as $ } from "react/jsx-runtime";
+import { c as A } from "react/compiler-runtime";
+import { memo as H } from "react";
+import { getAnimationProps as I } from "./visualization.es29.js";
+import { motion as M } from "./visualization.es32.js";
+const S = "visx-heatmap-cell", d = "visx-heatmap-cell-shape", z = `
+.${S} { cursor: pointer; }
+.${d} { transition: stroke-width 0.2s; pointer-events: all; }
+.${S}:hover .${d} { stroke-width: 2; }
+`, N = (o, t) => o.row !== t.row || o.column !== t.column || o.count !== t.count || o.gap !== t.gap || o.color !== t.color || o.opacity !== t.opacity || o.bin !== t.bin || o.datum !== t.datum ? !1 : "x" in o ? "x" in t && o.x === t.x && o.y === t.y && o.width === t.width && o.height === t.height : "cy" in t && o.cy === t.cy && o.r === t.r && o.radius === t.radius, O = (o, t) => o.fill === t.fill && o.fillOpacity === t.fillOpacity && o.isRect === t.isRect && o.binWidth === t.binWidth && o.colIndex === t.colIndex && o.animationType === t.animationType && o.tooltipRef === t.tooltipRef && o.onClick === t.onClick && N(o.bin, t.bin), B = H(function(t) {
+  const i = A(27), {
+    bin: e,
+    isRect: E,
+    binWidth: a,
+    fill: m,
+    fillOpacity: y,
+    colIndex: C,
+    animationType: P,
+    tooltipRef: l,
+    onClick: g
+  } = t, w = E && "width" in e && "height" in e && "x" in e && "y" in e, x = !E && "cy" in e && "r" in e;
+  let h;
+  i[0] !== m || i[1] !== y ? (h = {
+    fill: m,
+    fillOpacity: y,
+    stroke: m,
+    strokeWidth: 0
+  }, i[0] = m, i[1] = y, i[2] = h) : h = i[2];
+  const p = h, k = P ? M.g : "g", L = P;
+  let f;
+  i[3] !== C || i[4] !== L ? (f = I(L, C), i[3] = C, i[4] = L, i[5] = f) : f = i[5];
+  const R = f;
+  let c;
+  i[6] !== e || i[7] !== l ? (c = (W) => l.current?.show(e, W), i[6] = e, i[7] = l, i[8] = c) : c = i[8];
   let n;
-  t[11] !== e ? (n = () => {
-    e(null);
-  }, t[11] = e, t[12] = n) : n = t[12];
-  const b = n;
-  let a;
-  return t[13] !== m || t[14] !== b || t[15] !== d ? (a = {
-    crosshairPosition: m,
-    handleCrosshairMove: d,
-    handleCrosshairLeave: b
-  }, t[13] = m, t[14] = b, t[15] = d, t[16] = a) : a = t[16], a;
-};
+  i[9] !== l ? (n = () => l.current?.hide(), i[9] = l, i[10] = n) : n = i[10];
+  let s;
+  i[11] !== e || i[12] !== g ? (s = () => g?.(e), i[11] = e, i[12] = g, i[13] = s) : s = i[13];
+  let r;
+  i[14] !== e || i[15] !== a || i[16] !== x || i[17] !== w || i[18] !== p ? (r = w ? /* @__PURE__ */ $("rect", { className: `visx-heatmap-rect ${d}`, width: e.width, height: e.height, x: e.x, y: e.y, ...p }) : x ? /* @__PURE__ */ $("circle", { className: `visx-heatmap-circle ${d}`, cx: e.column * a + a / 2, cy: e.cy, r: e.r, ...p }) : null, i[14] = e, i[15] = a, i[16] = x, i[17] = w, i[18] = p, i[19] = r) : r = i[19];
+  let u;
+  return i[20] !== k || i[21] !== R || i[22] !== c || i[23] !== n || i[24] !== s || i[25] !== r ? (u = /* @__PURE__ */ $(k, { ...R, className: S, onMouseMove: c, onMouseLeave: n, onClick: s, children: r }), i[20] = k, i[21] = R, i[22] = c, i[23] = n, i[24] = s, i[25] = r, i[26] = u) : u = i[26], u;
+}, O);
 export {
-  D as useCrosshair
+  S as CELL_CLASS,
+  d as CELL_SHAPE_CLASS,
+  B as default,
+  z as heatmapCellStyles
 };
 //# sourceMappingURL=visualization.es66.js.map

package/dist/visualization.es66.js.map

@@ -1 +1 @@
-{"version":3,"file":"visualization.es66.js","sources":["../src/components/ScatterPlot/hooks/useCrosshair.ts"],"sourcesContent":["import React, { useCallback, useRef, useState } from \"react\";\nimport { localPoint } from \"@visx/event\";\nimport { ScaleLinear } from \"@visx/vendor/d3-scale\";\nimport { CrosshairPosition, ZoomType } from \"../types\";\nimport { invertRescaled } from \"../helpers\";\nimport { useStableCallback } from \"../../../hooks\";\n\ntype UseCrosshairProps = {\n    enabled: boolean;\n    margin: { top: number; left: number };\n    boundedWidth: number;\n    boundedHeight: number;\n    xScale: ScaleLinear<number, number, never>;\n    yScale: ScaleLinear<number, number, never>;\n    onCrosshairChange?: (position: CrosshairPosition | null) => void;\n};\n\n/**\n * Tracks the pointer as a crosshair position in data coordinates.\n *\n * Data coordinates rather than pixels because the position is also published to consumers, who\n * may mirror it onto another plot or feed it back in as a controlled position. Keeping one\n * currency means every plot showing this crosshair resolves it through its own scales and so\n * agrees with the others, even mid-zoom.\n *\n * The zoom transform arrives as an argument rather than a hook input because it only exists\n * inside the Zoom render prop, below where this hook is called.\n */\nexport const useCrosshair = ({\n    enabled,\n    margin,\n    boundedWidth,\n    boundedHeight,\n    xScale,\n    yScale,\n    onCrosshairChange,\n}: UseCrosshairProps) => {\n    const [crosshairPosition, setCrosshairPosition] = useState<CrosshairPosition | null>(null);\n    const publishedRef = useRef<CrosshairPosition | null>(null);\n    const publishChange = useStableCallback(onCrosshairChange);\n\n    const publish = useCallback((position: CrosshairPosition | null) => {\n        // Leaving the plot area fires on every subsequent move; only announce the first one.\n        if (position === null && publishedRef.current === null) return;\n        publishedRef.current = position;\n        setCrosshairPosition(position);\n        publishChange(position);\n    }, [publishChange]);\n\n    const handleCrosshairMove = useCallback((event: React.MouseEvent<SVGElement>, zoom: ZoomType) => {\n        if (!enabled) return;\n\n        const point = localPoint(event.currentTarget, event);\n        if (!point) return;\n\n        // The listener covers the whole svg, margins included, so anything outside the plot\n        // area counts as leaving it.\n        const plotX = point.x - margin.left;\n        const plotY = point.y - margin.top;\n        if (plotX < 0 || plotX > boundedWidth || plotY < 0 || plotY > boundedHeight) {\n            publish(null);\n            return;\n        }\n\n        const { translateX, translateY, scaleX, scaleY } = zoom.transformMatrix;\n        publish({\n            x: invertRescaled(xScale, translateX, scaleX, plotX),\n            y: invertRescaled(yScale, translateY, scaleY, plotY),\n        });\n    }, [boundedHeight, boundedWidth, enabled, margin.left, margin.top, publish, xScale, yScale]);\n\n    const handleCrosshairLeave = useCallback(() => {\n        publish(null);\n    }, [publish]);\n\n    return { crosshairPosition, handleCrosshairMove, handleCrosshairLeave };\n};\n"],"names":["useCrosshair","t0","$","_c","enabled","margin","boundedWidth","boundedHeight","xScale","yScale","onCrosshairChange","crosshairPosition","setCrosshairPosition","useState","publishedRef","useRef","publishChange","useStableCallback","t1","position","current","publish","t2","left","top","event","zoom","point","localPoint","currentTarget","plotX","x","plotY","y","translateX","translateY","scaleX","scaleY","transformMatrix","invertRescaled","handleCrosshairMove","t3","handleCrosshairLeave","t4"],"mappings":";;;;;AA4BO,MAAMA,IAAeC,CAAAA,MAAA;AAAA,QAAAC,IAAAC,EAAA,EAAA,GAAC;AAAA,IAAAC,SAAAA;AAAAA,IAAAC,QAAAA;AAAAA,IAAAC,cAAAA;AAAAA,IAAAC,eAAAA;AAAAA,IAAAC,QAAAA;AAAAA,IAAAC,QAAAA;AAAAA,IAAAC,mBAAAA;AAAAA,EAAAA,IAAAT,GASzB,CAAAU,GAAAC,CAAA,IAAkDC,EAAmC,IAAI,GACzFC,IAAqBC,EAAiC,IAAI,GAC1DC,IAAsBC,EAAkBP,CAAiB;AAAE,MAAAQ;AAAA,EAAAhB,SAAAc,KAE/BE,IAAAC,CAAAA,MAAA;AAExB,IAAIA,MAAa,QAAQL,EAAYM,YAAa,SAClDN,EAAYM,UAAWD,GACvBP,EAAqBO,CAAQ,GAC7BH,EAAcG,CAAQ;AAAA,EAAC,GAC1BjB,OAAAc,GAAAd,OAAAgB,KAAAA,IAAAhB,EAAA,CAAA;AAND,QAAAmB,IAAgBH;AAMI,MAAAI;AAAA,EAAApB,EAAA,CAAA,MAAAK,KAAAL,EAAA,CAAA,MAAAI,KAAAJ,SAAAE,KAAAF,EAAA,CAAA,MAAAG,EAAAkB,QAAArB,EAAA,CAAA,MAAAG,EAAAmB,OAAAtB,EAAA,CAAA,MAAAmB,KAAAnB,EAAA,CAAA,MAAAM,KAAAN,SAAAO,KAEoBa,IAAAA,CAAAG,GAAAC,MAAA;AACpC,QAAI,CAACtB;AAAO;AAEZ,UAAAuB,IAAcC,EAAWH,EAAKI,eAAgBJ,CAAK;AACnD,QAAI,CAACE;AAAK;AAIV,UAAAG,IAAcH,EAAKI,IAAK1B,EAAMkB,MAC9BS,IAAcL,EAAKM,IAAK5B,EAAMmB;AAC9B,QAAIM,IAAQ,KAAKA,IAAQxB,KAAgB0B,IAAQ,KAAKA,IAAQzB,GAAa;AACvEc,MAAAA,EAAQ,IAAI;AAAC;AAAA,IAAA;AAIjB,UAAA;AAAA,MAAAa,YAAAA;AAAAA,MAAAC,YAAAA;AAAAA,MAAAC,QAAAA;AAAAA,MAAAC,QAAAA;AAAAA,IAAAA,IAAmDX,EAAIY;AACvDjB,IAAAA,EAAQ;AAAA,MAAAU,GACDQ,EAAe/B,GAAQ0B,GAAYE,GAAQN,CAAK;AAAA,MAACG,GACjDM,EAAe9B,GAAQ0B,GAAYE,GAAQL,CAAK;AAAA,IAAA,CACtD;AAAA,EAAC,GACL9B,OAAAK,GAAAL,OAAAI,GAAAJ,OAAAE,GAAAF,EAAA,CAAA,IAAAG,EAAAkB,MAAArB,EAAA,CAAA,IAAAG,EAAAmB,KAAAtB,OAAAmB,GAAAnB,OAAAM,GAAAN,OAAAO,GAAAP,QAAAoB,KAAAA,IAAApB,EAAA,EAAA;AApBD,QAAAsC,IAA4BlB;AAoBiE,MAAAmB;AAAA,EAAAvC,UAAAmB,KAEpDoB,IAAAA,MAAA;AACrCpB,IAAAA,EAAQ,IAAI;AAAA,EAAC,GAChBnB,QAAAmB,GAAAnB,QAAAuC,KAAAA,IAAAvC,EAAA,EAAA;AAFD,QAAAwC,IAA6BD;AAEf,MAAAE;AAAA,SAAAzC,EAAA,EAAA,MAAAS,KAAAT,UAAAwC,KAAAxC,EAAA,EAAA,MAAAsC,KAEPG,IAAA;AAAA,IAAAhC,mBAAAA;AAAAA,IAAA6B,qBAAAA;AAAAA,IAAAE,sBAAAA;AAAAA,EAAAA,GAAgExC,QAAAS,GAAAT,QAAAwC,GAAAxC,QAAAsC,GAAAtC,QAAAyC,KAAAA,IAAAzC,EAAA,EAAA,GAAhEyC;AAAgE;"}
+{"version":3,"file":"visualization.es66.js","sources":["../src/components/Heatmap/HeatmapCell.tsx"],"sourcesContent":["import { memo, MouseEvent } from \"react\";\nimport { motion } from \"framer-motion\";\nimport { getAnimationProps } from \"../../utility\";\nimport type { AnimationType } from \"../../utility\";\nimport type { AnyBin } from \"./HeatmapCells\";\nimport type { PlotTooltipRef } from \"../../tooltip\";\n\n/** Class on the <g> wrapping each cell. The hover rule keys off this. */\nexport const CELL_CLASS = \"visx-heatmap-cell\";\n/** Class on the <rect>/<circle> inside each cell. */\nexport const CELL_SHAPE_CLASS = \"visx-heatmap-cell-shape\";\n\n/**\n * Hover styling is plain CSS rather than React state: `:hover` costs no render at all, while\n * tracking hover in state re-renders on every cell the pointer crosses. Rendered once per chart\n * by Heatmap, inside the <svg> so it survives the SVG/PNG download serialization.\n *\n * The stroke is always painted in the cell's own fill color, so hovering only has to give it a\n * width. `strokeWidth={0}` below is a presentation attribute, which loses to any CSS rule - so\n * the hover rule wins without needing !important.\n *\n * `pointer-events: all` because cells with a null count render with fill=\"none\", and SVG's\n * default (visiblePainted) only treats painted area as a hit target - without this the pointer\n * falls through such a cell to the <svg> and it can never show its \"no data\" tooltip.\n */\nexport const heatmapCellStyles = `\n.${CELL_CLASS} { cursor: pointer; }\n.${CELL_SHAPE_CLASS} { transition: stroke-width 0.2s; pointer-events: all; }\n.${CELL_CLASS}:hover .${CELL_SHAPE_CLASS} { stroke-width: 2; }\n`;\n\nexport interface HeatmapCellProps {\n  bin: AnyBin;\n  isRect: boolean;\n  binWidth: number;\n  fill: string;\n  fillOpacity: number;\n  colIndex: number;\n  animationType?: AnimationType;\n  /** Stable for the life of the plot, so it never invalidates this cell's memoization. */\n  tooltipRef: PlotTooltipRef<AnyBin>;\n  onClick?: (bin: AnyBin) => void;\n}\n\n/**\n * visx rebuilds every bin object inside its own render, so `bin` always arrives with a fresh\n * identity and memo's default shallow compare can never bail out. Comparing the bin's fields\n * instead lets untouched cells skip re-rendering, which is what makes selection changes cheap:\n * only the cells whose appearance actually changed re-render, rather than the whole grid.\n *\n * `bin.bin` and `bin.datum` are the caller's own row/column data, which do keep identity, so a\n * reference check on those covers data and metadata changes.\n */\nconst binsEqual = (a: AnyBin, b: AnyBin): boolean => {\n  if (\n    a.row !== b.row ||\n    a.column !== b.column ||\n    a.count !== b.count ||\n    a.gap !== b.gap ||\n    a.color !== b.color ||\n    a.opacity !== b.opacity ||\n    a.bin !== b.bin ||\n    a.datum !== b.datum\n  ) {\n    return false;\n  }\n  // Rect and circle cells carry different geometry fields\n  if (\"x\" in a) {\n    return \"x\" in b && a.x === b.x && a.y === b.y && a.width === b.width && a.height === b.height;\n  }\n  return \"cy\" in b && a.cy === b.cy && a.r === b.r && a.radius === b.radius;\n};\n\n/**\n * Must compare every prop in HeatmapCellProps - one left out here would silently stop updating.\n */\nconst cellPropsEqual = (prev: HeatmapCellProps, next: HeatmapCellProps): boolean =>\n  prev.fill === next.fill &&\n  prev.fillOpacity === next.fillOpacity &&\n  prev.isRect === next.isRect &&\n  prev.binWidth === next.binWidth &&\n  prev.colIndex === next.colIndex &&\n  prev.animationType === next.animationType &&\n  prev.tooltipRef === next.tooltipRef &&\n  prev.onClick === next.onClick &&\n  binsEqual(prev.bin, next.bin);\n\nconst HeatmapCell = memo(function HeatmapCell({\n  bin, isRect, binWidth, fill, fillOpacity, colIndex,\n  animationType, tooltipRef, onClick,\n}: HeatmapCellProps) {\n  const isRectCell = isRect && \"width\" in bin && \"height\" in bin && \"x\" in bin && \"y\" in bin;\n  const isCircleCell = !isRect && \"cy\" in bin && \"r\" in bin;\n\n  const sharedProps = { fill, fillOpacity, stroke: fill, strokeWidth: 0 };\n\n  const Wrapper = animationType ? motion.g : \"g\";\n  const animProps = getAnimationProps(animationType as AnimationType, colIndex);\n\n  return (\n    <Wrapper\n      {...animProps}\n      className={CELL_CLASS}\n      onMouseMove={(event: MouseEvent<SVGElement>) => tooltipRef.current?.show(bin, event)}\n      onMouseLeave={() => tooltipRef.current?.hide()}\n      onClick={() => onClick?.(bin)}\n    >\n      {isRectCell ? (\n        <rect\n          className={`visx-heatmap-rect ${CELL_SHAPE_CLASS}`}\n          width={bin.width}\n          height={bin.height}\n          x={bin.x}\n          y={bin.y}\n          {...sharedProps}\n        />\n      ) : isCircleCell ? (\n        <circle\n          className={`visx-heatmap-circle ${CELL_SHAPE_CLASS}`}\n          cx={bin.column * binWidth + binWidth / 2}\n          cy={bin.cy}\n          r={bin.r}\n          {...sharedProps}\n        />\n      ) : null}\n    </Wrapper>\n  );\n}, cellPropsEqual);\n\nexport default HeatmapCell;\n"],"names":["CELL_CLASS","CELL_SHAPE_CLASS","heatmapCellStyles","binsEqual","a","b","row","column","count","gap","color","opacity","bin","datum","x","y","width","height","cy","r","radius","cellPropsEqual","prev","next","fill","fillOpacity","isRect","binWidth","colIndex","animationType","tooltipRef","onClick","HeatmapCell","memo","t0","$","_c","isRectCell","isCircleCell","t1","stroke","strokeWidth","sharedProps","Wrapper","motion","g","t2","t3","getAnimationProps","animProps","t4","event","current","show","t5","hide","t6","t7","jsx","t8"],"mappings":"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"}

package/dist/visualization.es67.js

@@ -1,55 +1,48 @@
-import { jsxs as m, jsx as o } from "react/jsx-runtime";
-import Y from "./visualization.es113.js";
-import { truncateTextToWidth as j, getLabelPlacement as A } from "./visualization.es114.js";
-import D, { useCallback as R } from "react";
-import E from "./visualization.es22.js";
-import F from "./visualization.es20.js";
-import $ from "./visualization.es21.js";
-const Z = (t) => {
-  function i(e) {
-    return e.children && e.children.length > 0 ? e.children.reduce((d, X) => d + i(X), 0) : e.data.value ?? 0;
-  }
-  const c = t.node.children !== void 0 && t.node.children.length > 0, r = c ? t.node.data.displayValue ?? i(t.node) : t.node.data.value ?? 0, k = t.fontSize, n = t.node.data.style?.color || t.node.parent?.data.style?.color || "black", h = t.node.data.style?.labelColor || n, x = t.node.data.style?.strokeColor || n, u = t.node.data.style?.strokeWidth === 0 ? 0 : t.node.data.style?.strokeWidth || t.strokeWidth, v = t.isHovered ? u + 2 : u, l = t.node.x1 - t.node.x0, a = t.node.y1 - t.node.y0, b = t.node.data.label, C = j(b, l - 8, k, "sans-serif"), f = a > 55 && l > 50 && r > 0, g = a > 20, {
-    textX: T,
-    textY: S,
-    textAnchor: W,
-    valueAnchor: B,
-    baseline: L,
-    valueY: M,
-    valueX: w
-  } = A(t.node, t.labelPlacement, f, c), {
-    tooltipData: s,
-    tooltipLeft: N,
-    tooltipTop: z,
-    tooltipOpen: V,
-    showTooltip: y,
-    hideTooltip: H
-  } = E(), O = R((e) => {
-    if (!t.tooltipBody) return;
-    const d = t.tooltipBody(t.node.data);
-    y({
-      tooltipLeft: e.clientX + 10,
-      tooltipTop: e.clientY + 10,
-      tooltipData: d
+import { jsx as i, jsxs as g } from "react/jsx-runtime";
+import { c as S } from "react/compiler-runtime";
+import { measureTextWidth as W } from "./visualization.es29.js";
+import H from "./visualization.es22.js";
+import k from "./visualization.es31.js";
+const l = 14, _ = 6, x = 4, y = 11, A = "sans-serif", T = 5, I = (n) => n % 1 === 0 ? String(n) : n.toFixed(1), L = (n, t) => Array.from({
+  length: T
+}, (e, o) => n + o * (t - n) / (T - 1)), D = 1.15, G = 6, O = (n, t) => {
+  const e = Math.max(...L(n, t).map((o) => W(I(o), y, A)));
+  return l + x + _ + e * D + G;
+}, R = (n) => {
+  const t = S(11), {
+    colors: e,
+    minValue: o,
+    maxValue: c,
+    height: r
+  } = n;
+  let d;
+  if (t[0] !== e || t[1] !== r || t[2] !== c || t[3] !== o) {
+    const u = L(o, c), F = H({
+      domain: [c, o],
+      range: [0, r]
     });
-  }, [t.tooltipBody, t.node.data, y]), P = () => {
-    t.onNodeClicked && t.onNodeClicked(t.node.data);
-  };
-  return /* @__PURE__ */ m(D.Fragment, { children: [
-    /* @__PURE__ */ m("g", { onMouseEnter: () => t.onHover(!0), onMouseLeave: () => {
-      t.onHover(!1), H?.();
-    }, onMouseMove: O, onClick: P, style: {
-      cursor: "pointer",
-      transition: "stroke-width 0.2s"
-    }, children: [
-      /* @__PURE__ */ o("rect", { x: t.node.x0, y: t.node.y0, width: l, height: a, fill: n, fillOpacity: t.opacity, stroke: x, strokeWidth: v, rx: t.borderRadius }),
-      g && /* @__PURE__ */ o("text", { x: T, y: S, textAnchor: W, dominantBaseline: L, fill: h, fontSize: t.fontSize, fontWeight: 500, children: C }),
-      f && /* @__PURE__ */ o(Y, { cx: w, cy: M, color: h, value: r, align: B })
-    ] }),
-    t.tooltipBody && V && s && /* @__PURE__ */ o(F, { children: /* @__PURE__ */ o($, { left: (N ?? 0) + 10, top: z, children: s }) })
-  ] }, `frag-${t.node.data.label}`);
+    let s;
+    t[5] !== e ? (s = e.map((h, a) => /* @__PURE__ */ i("stop", { offset: `${a / (e.length - 1) * 100}%`, stopColor: e[e.length - 1 - a] }, a)), t[5] = e, t[6] = s) : s = t[6];
+    let m;
+    t[7] !== s ? (m = /* @__PURE__ */ i("defs", { children: /* @__PURE__ */ i("linearGradient", { id: "heatmap-legend-gradient", x1: "0", y1: "0", x2: "0", y2: "1", children: s }) }), t[7] = s, t[8] = m) : m = t[8];
+    let f;
+    t[9] !== r ? (f = /* @__PURE__ */ i("rect", { x: 0, y: 0, width: l, height: r, fill: "url(#heatmap-legend-gradient)", rx: 2 }), t[9] = r, t[10] = f) : f = t[10], d = /* @__PURE__ */ g(k, { children: [
+      m,
+      f,
+      u.map((h, a) => {
+        const p = F(h);
+        return /* @__PURE__ */ g("g", { children: [
+          /* @__PURE__ */ i("line", { x1: l, x2: l + x, y1: p, y2: p, stroke: "#4d4f52", strokeWidth: 1 }),
+          /* @__PURE__ */ i("text", { x: l + x + _, y: p, dominantBaseline: "middle", fontSize: y, fontFamily: A, fill: "#4d4f52", children: I(h) })
+        ] }, a);
+      })
+    ] }), t[0] = e, t[1] = r, t[2] = c, t[3] = o, t[4] = d;
+  } else
+    d = t[4];
+  return d;
 };
 export {
-  Z as default
+  R as default,
+  O as getHeatmapLegendWidth
 };
 //# sourceMappingURL=visualization.es67.js.map

package/dist/visualization.es67.js.map

@@ -1 +1 @@
-{"version":3,"file":"visualization.es67.js","sources":["../src/components/TreeMap/SingleNode.tsx"],"sourcesContent":["import { SingleNodeProps, TreemapNode } from \"./types\";\nimport ValueOval from \"./ValueOval\";\nimport { getLabelPlacement, truncateTextToWidth } from \"./helpers\";\nimport { ReactNode, useCallback } from \"react\";\nimport { Portal, TooltipWithBounds, useTooltip } from \"@visx/tooltip\";\nimport React from \"react\";\nimport { HierarchyRectangularNode } from \"@visx/hierarchy\";\n\nconst SingleNode = <T,>(\n    props: SingleNodeProps<T>\n) => {\n    function getNodeValue(node: HierarchyRectangularNode<TreemapNode<T>>): number {\n        // If the node has children, sum their values\n        if (node.children && node.children.length > 0) {\n            return node.children.reduce((sum: number, child) => {\n                return sum + getNodeValue(child);\n            }, 0);\n        }\n\n        // Otherwise use the leaf's data value\n        return node.data.value ?? 0;\n    }\n\n    const hasChildren = props.node.children !== undefined && props.node.children.length > 0;\n    \n    const value = hasChildren ? props.node.data.displayValue ?? getNodeValue(props.node) : props.node.data.value ?? 0\n\n    const fontSize = props.fontSize\n    const nodeColor = props.node.data.style?.color ||  props.node.parent?.data.style?.color || \"black\"\n    const labelColor = props.node.data.style?.labelColor || nodeColor;\n    const nodeStrokeColor = props.node.data.style?.strokeColor || nodeColor;\n    const nodeStroke = props.node.data.style?.strokeWidth === 0 ? 0 : props.node.data.style?.strokeWidth || props.strokeWidth;\n    const stroke = props.isHovered ? nodeStroke + 2 : nodeStroke;\n\n    const width = props.node.x1 - props.node.x0;\n    const height = props.node.y1 - props.node.y0;\n\n    const fullLabel = props.node.data.label;\n    const truncatedLabel = truncateTextToWidth(fullLabel, width - 8, fontSize, \"sans-serif\");\n    const showValue = height > 55 && width > 50 && value > 0;\n    const showText = height > 20;\n\n    const { textX, textY, textAnchor, valueAnchor, baseline, valueY, valueX } = getLabelPlacement(\n        props.node,\n        props.labelPlacement,\n        showValue,\n        hasChildren\n    );\n\n    const {\n        tooltipData,\n        tooltipLeft,\n        tooltipTop,\n        tooltipOpen,\n        showTooltip,\n        hideTooltip,\n    } = useTooltip<ReactNode>();\n\n    const handleMouseMove = useCallback(\n        (event: React.MouseEvent<SVGElement>) => {\n            if (!props.tooltipBody) return;\n\n            const tooltipContent = props.tooltipBody(props.node.data);\n\n            showTooltip({\n                tooltipLeft: event.clientX + 10,\n                tooltipTop: event.clientY + 10,\n                tooltipData: tooltipContent,\n            });\n        },\n        [props.tooltipBody, props.node.data, showTooltip]\n    );\n\n    const handleNodeClick = () => {\n        if (!props.onNodeClicked) return;\n        props.onNodeClicked(props.node.data);\n    };\n\n    return (\n        <React.Fragment key={`frag-${props.node.data.label}`}>\n            <g\n                onMouseEnter={() => props.onHover(true)}\n                onMouseLeave={() => {\n                    props.onHover(false);\n                    hideTooltip?.();\n                }}\n                onMouseMove={handleMouseMove}\n                onClick={handleNodeClick}\n                style={{ cursor: \"pointer\", transition: \"stroke-width 0.2s\" }}\n            >\n                <rect\n                    x={props.node.x0}\n                    y={props.node.y0}\n                    width={width}\n                    height={height}\n                    fill={nodeColor}\n                    fillOpacity={props.opacity}\n                    stroke={nodeStrokeColor}\n                    strokeWidth={stroke}\n                    rx={props.borderRadius}\n                />\n                {showText && (\n                    <text\n                        x={textX}\n                        y={textY}\n                        textAnchor={textAnchor}\n                        dominantBaseline={baseline}\n                        fill={labelColor}\n                        fontSize={props.fontSize}\n                        fontWeight={500}\n                    >\n                        {truncatedLabel}\n                    </text>\n                )}\n                {showValue && (\n                    <ValueOval\n                        cx={valueX}\n                        cy={valueY}\n                        color={labelColor}\n                        value={value}\n                        align={valueAnchor}\n                    />\n                )}\n            </g>\n            {props.tooltipBody && tooltipOpen && tooltipData && (\n                <Portal>\n                    <TooltipWithBounds left={(tooltipLeft ?? 0) + 10} top={tooltipTop}>\n                        {tooltipData}\n                    </TooltipWithBounds>\n                </Portal>\n            )}\n        </React.Fragment>\n    );\n};\n\nexport default SingleNode;"],"names":["SingleNode","props","getNodeValue","node","children","length","reduce","sum","child","data","value","hasChildren","undefined","displayValue","fontSize","nodeColor","style","color","parent","labelColor","nodeStrokeColor","strokeColor","nodeStroke","strokeWidth","stroke","isHovered","width","x1","x0","height","y1","y0","fullLabel","label","truncatedLabel","truncateTextToWidth","showValue","showText","textX","textY","textAnchor","valueAnchor","baseline","valueY","valueX","getLabelPlacement","labelPlacement","tooltipData","tooltipLeft","tooltipTop","tooltipOpen","showTooltip","hideTooltip","useTooltip","handleMouseMove","useCallback","event","tooltipBody","tooltipContent","clientX","clientY","handleNodeClick","onNodeClicked","jsxs","React","onHover","cursor","transition","jsx","opacity","borderRadius","ValueOval","Portal","TooltipWithBounds"],"mappings":"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"}
+{"version":3,"file":"visualization.es67.js","sources":["../src/components/Heatmap/HeatmapLegend.tsx"],"sourcesContent":["import { Group } from \"@visx/group\";\nimport { scaleLinear } from \"@visx/scale\";\nimport { measureTextWidth } from \"../../utility\";\n\nconst BAR_WIDTH = 14;\nconst LABEL_GAP = 6;\nconst TICK_WIDTH = 4;\nconst FONT_SIZE = 11;\nconst FONT_FAMILY = \"sans-serif\";\nconst NUM_TICKS = 5;\n\ninterface HeatmapLegendProps {\n    colors: [string, string, ...string[]];\n    minValue: number;\n    maxValue: number;\n    height: number;\n}\n\nconst formatTick = (value: number) =>\n    value % 1 === 0 ? String(value) : value.toFixed(1);\n\nconst getTickValues = (minValue: number, maxValue: number) =>\n    Array.from({ length: NUM_TICKS }, (_, i) =>\n        minValue + (i * (maxValue - minValue)) / (NUM_TICKS - 1)\n    );\n\n// Canvas's measureText and the browser's actual SVG text layout don't agree to the sub-pixel,\n// and the gap widens with string length - pad generously so longer labels (more digits) don't\n// creep past the reserved width and get clipped by the svg's default overflow:hidden.\nconst LABEL_WIDTH_SAFETY_FACTOR = 1.15;\nconst RIGHT_PADDING = 6;\n\n// Full width needed to render the legend (color bar + ticks + tick labels) without\n// clipping, based on the widest formatted tick label for the given value range.\nexport const getHeatmapLegendWidth = (minValue: number, maxValue: number): number => {\n    const maxLabelWidth = Math.max(\n        ...getTickValues(minValue, maxValue).map((value) =>\n            measureTextWidth(formatTick(value), FONT_SIZE, FONT_FAMILY)\n        )\n    );\n    return BAR_WIDTH + TICK_WIDTH + LABEL_GAP + maxLabelWidth * LABEL_WIDTH_SAFETY_FACTOR + RIGHT_PADDING;\n};\n\nconst HeatmapLegend = ({ colors, minValue, maxValue, height }: HeatmapLegendProps) => {\n    const gradientId = \"heatmap-legend-gradient\";\n\n    const tickValues = getTickValues(minValue, maxValue);\n\n    const yScale = scaleLinear<number>({\n        domain: [maxValue, minValue],\n        range: [0, height],\n    });\n\n    return (\n        <Group>\n            <defs>\n                {/* The bar reads top (max) to bottom (min), so the gradient stops run in reverse\n                    color order to match how colors map to values in the heatmap cells. */}\n                <linearGradient id={gradientId} x1=\"0\" y1=\"0\" x2=\"0\" y2=\"1\">\n                    {colors.map((_, i) => (\n                        <stop\n                            key={i}\n                            offset={`${(i / (colors.length - 1)) * 100}%`}\n                            stopColor={colors[colors.length - 1 - i]}\n                        />\n                    ))}\n                </linearGradient>\n            </defs>\n            <rect\n                x={0}\n                y={0}\n                width={BAR_WIDTH}\n                height={height}\n                fill={`url(#${gradientId})`}\n                rx={2}\n            />\n            {tickValues.map((value, i) => {\n                const y = yScale(value);\n                return (\n                    <g key={i}>\n                        <line\n                            x1={BAR_WIDTH}\n                            x2={BAR_WIDTH + TICK_WIDTH}\n                            y1={y}\n                            y2={y}\n                            stroke=\"#4d4f52\"\n                            strokeWidth={1}\n                        />\n                        <text\n                            x={BAR_WIDTH + TICK_WIDTH + LABEL_GAP}\n                            y={y}\n                            dominantBaseline=\"middle\"\n                            fontSize={FONT_SIZE}\n                            fontFamily={FONT_FAMILY}\n                            fill=\"#4d4f52\"\n                        >\n                            {formatTick(value)}\n                        </text>\n                    </g>\n                );\n            })}\n        </Group>\n    );\n};\n\nexport default HeatmapLegend;\nexport type { HeatmapLegendProps };\n"],"names":["BAR_WIDTH","LABEL_GAP","TICK_WIDTH","FONT_SIZE","FONT_FAMILY","NUM_TICKS","formatTick","value","String","toFixed","getTickValues","minValue","maxValue","Array","from","length","_","i","LABEL_WIDTH_SAFETY_FACTOR","RIGHT_PADDING","getHeatmapLegendWidth","maxLabelWidth","Math","max","map","measureTextWidth","HeatmapLegend","t0","$","_c","colors","height","t1","tickValues","yScale","scaleLinear","domain","range","t2","jsx","t3","gradientId","t4","Group","i_0","y"],"mappings":"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"}

package/dist/visualization.es68.js

@@ -1,58 +1,24 @@
-import s from "./visualization.es489.js";
-import u from "./visualization.es490.js";
-import m from "./visualization.es491.js";
-import l from "./visualization.es492.js";
-import _ from "./visualization.es493.js";
-import v from "./visualization.es494.js";
-import y from "./visualization.es495.js";
-import g from "./visualization.es496.js";
-import w from "./visualization.es497.js";
-import B from "./visualization.es498.js";
-import A from "./visualization.es499.js";
-function d(e, t) {
-  var a = new n(e), f = +e.value && (a.value = e.value), o, c = [a], i, h, r, p;
-  for (t == null && (t = x); o = c.pop(); )
-    if (f && (o.value = +o.data.value), (h = t(o.data)) && (p = h.length))
-      for (o.children = new Array(p), r = p - 1; r >= 0; --r)
-        c.push(i = o.children[r] = new n(h[r])), i.parent = o, i.depth = o.depth + 1;
-  return a.eachBefore(D);
+import o from "./visualization.es22.js";
+const L = "#d1d5db", r = 0.5, E = "none", i = (n) => `${n.row}-${n.column}`;
+function u(n, a) {
+  return o({
+    range: n,
+    domain: n.map((e, t) => t * a / (n.length - 1))
+  });
 }
-function k() {
-  return d(this).eachBefore(C);
+function p(n, a, e, t) {
+  const l = n == null;
+  return {
+    fill: l ? E : e ? t : a ?? t,
+    fillOpacity: l ? 0 : e ? r : 1
+  };
 }
-function x(e) {
-  return e.children;
-}
-function C(e) {
-  e.data = e.data.data;
-}
-function D(e) {
-  var t = 0;
-  do
-    e.height = t;
-  while ((e = e.parent) && e.height < ++t);
-}
-function n(e) {
-  this.data = e, this.depth = this.height = 0, this.parent = null;
-}
-n.prototype = d.prototype = {
-  constructor: n,
-  count: s,
-  each: u,
-  eachAfter: l,
-  eachBefore: m,
-  sum: _,
-  sort: v,
-  path: y,
-  ancestors: g,
-  descendants: w,
-  leaves: B,
-  links: A,
-  copy: k
-};
 export {
-  n as Node,
-  D as computeHeight,
-  d as default
+  L as DEFAULT_DESELECTED_COLOR,
+  r as DESELECTED_OPACITY,
+  E as NULL_VALUE_COLOR,
+  i as cellKey,
+  u as getHeatmapColorScale,
+  p as resolveCellAppearance
 };
 //# sourceMappingURL=visualization.es68.js.map

package/dist/visualization.es68.js.map

@@ -1 +1 @@
-{"version":3,"file":"visualization.es68.js","sources":["../../../node_modules/.pnpm/d3-hierarchy@1.1.9/node_modules/d3-hierarchy/src/hierarchy/index.js"],"sourcesContent":["import node_count from \"./count.js\";\nimport node_each from \"./each.js\";\nimport node_eachBefore from \"./eachBefore.js\";\nimport node_eachAfter from \"./eachAfter.js\";\nimport node_sum from \"./sum.js\";\nimport node_sort from \"./sort.js\";\nimport node_path from \"./path.js\";\nimport node_ancestors from \"./ancestors.js\";\nimport node_descendants from \"./descendants.js\";\nimport node_leaves from \"./leaves.js\";\nimport node_links from \"./links.js\";\n\nexport default function hierarchy(data, children) {\n  var root = new Node(data),\n      valued = +data.value && (root.value = data.value),\n      node,\n      nodes = [root],\n      child,\n      childs,\n      i,\n      n;\n\n  if (children == null) children = defaultChildren;\n\n  while (node = nodes.pop()) {\n    if (valued) node.value = +node.data.value;\n    if ((childs = children(node.data)) && (n = childs.length)) {\n      node.children = new Array(n);\n      for (i = n - 1; i >= 0; --i) {\n        nodes.push(child = node.children[i] = new Node(childs[i]));\n        child.parent = node;\n        child.depth = node.depth + 1;\n      }\n    }\n  }\n\n  return root.eachBefore(computeHeight);\n}\n\nfunction node_copy() {\n  return hierarchy(this).eachBefore(copyData);\n}\n\nfunction defaultChildren(d) {\n  return d.children;\n}\n\nfunction copyData(node) {\n  node.data = node.data.data;\n}\n\nexport function computeHeight(node) {\n  var height = 0;\n  do node.height = height;\n  while ((node = node.parent) && (node.height < ++height));\n}\n\nexport function Node(data) {\n  this.data = data;\n  this.depth =\n  this.height = 0;\n  this.parent = null;\n}\n\nNode.prototype = hierarchy.prototype = {\n  constructor: Node,\n  count: node_count,\n  each: node_each,\n  eachAfter: node_eachAfter,\n  eachBefore: node_eachBefore,\n  sum: node_sum,\n  sort: node_sort,\n  path: node_path,\n  ancestors: node_ancestors,\n  descendants: node_descendants,\n  leaves: node_leaves,\n  links: node_links,\n  copy: node_copy\n};\n"],"names":["hierarchy","data","children","root","Node","valued","node","nodes","child","childs","i","n","defaultChildren","computeHeight","node_copy","copyData","d","height","node_count","node_each","node_eachAfter","node_eachBefore","node_sum","node_sort","node_path","node_ancestors","node_descendants","node_leaves","node_links"],"mappings":";;;;;;;;;;;AAYe,SAASA,EAAUC,GAAMC,GAAU;AAChD,MAAIC,IAAO,IAAIC,EAAKH,CAAI,GACpBI,IAAS,CAACJ,EAAK,UAAUE,EAAK,QAAQF,EAAK,QAC3CK,GACAC,IAAQ,CAACJ,CAAI,GACbK,GACAC,GACAC,GACAC;AAIJ,OAFIT,KAAY,SAAMA,IAAWU,IAE1BN,IAAOC,EAAM;AAElB,QADIF,MAAQC,EAAK,QAAQ,CAACA,EAAK,KAAK,SAC/BG,IAASP,EAASI,EAAK,IAAI,OAAOK,IAAIF,EAAO;AAEhD,WADAH,EAAK,WAAW,IAAI,MAAMK,CAAC,GACtBD,IAAIC,IAAI,GAAGD,KAAK,GAAG,EAAEA;AACxB,QAAAH,EAAM,KAAKC,IAAQF,EAAK,SAASI,CAAC,IAAI,IAAIN,EAAKK,EAAOC,CAAC,CAAC,CAAC,GACzDF,EAAM,SAASF,GACfE,EAAM,QAAQF,EAAK,QAAQ;AAKjC,SAAOH,EAAK,WAAWU,CAAa;AACtC;AAEA,SAASC,IAAY;AACnB,SAAOd,EAAU,IAAI,EAAE,WAAWe,CAAQ;AAC5C;AAEA,SAASH,EAAgBI,GAAG;AAC1B,SAAOA,EAAE;AACX;AAEA,SAASD,EAAST,GAAM;AACtB,EAAAA,EAAK,OAAOA,EAAK,KAAK;AACxB;AAEO,SAASO,EAAcP,GAAM;AAClC,MAAIW,IAAS;AACb;AAAG,IAAAX,EAAK,SAASW;AAAA,UACTX,IAAOA,EAAK,WAAYA,EAAK,SAAS,EAAEW;AAClD;AAEO,SAASb,EAAKH,GAAM;AACzB,OAAK,OAAOA,GACZ,KAAK,QACL,KAAK,SAAS,GACd,KAAK,SAAS;AAChB;AAEAG,EAAK,YAAYJ,EAAU,YAAY;AAAA,EACrC,aAAaI;AAAA,EACb,OAAOc;AAAA,EACP,MAAMC;AAAA,EACN,WAAWC;AAAA,EACX,YAAYC;AAAA,EACZ,KAAKC;AAAA,EACL,MAAMC;AAAA,EACN,MAAMC;AAAA,EACN,WAAWC;AAAA,EACX,aAAaC;AAAA,EACb,QAAQC;AAAA,EACR,OAAOC;AAAA,EACP,MAAMd;AACR;","x_google_ignoreList":[0]}
+{"version":3,"file":"visualization.es68.js","sources":["../src/components/Heatmap/heatmapCellAppearance.ts"],"sourcesContent":["import { scaleLinear } from \"@visx/scale\";\nimport type { HeatmapCellId } from \"./types\";\n\nexport const DEFAULT_DESELECTED_COLOR = \"#d1d5db\";\nexport const DESELECTED_OPACITY = 0.5;\nexport const NULL_VALUE_COLOR = \"none\";\n\nexport const cellKey = (cell: HeatmapCellId) => `${cell.row}-${cell.column}`;\n\nexport function getHeatmapColorScale(colors: [string, string, ...string[]], maxValue: number) {\n  return scaleLinear<string>({\n    range: colors,\n    domain: colors.map((_, i) => (i * maxValue) / (colors.length - 1)),\n  });\n}\n\n/**\n * Shared by the SVG cell renderer (HeatmapCells.tsx, used for non-scrollable mode and export)\n * and the canvas cell renderer (HeatmapCanvasCells.ts, used on-screen in scrollable mode) so the\n * two can never drift apart on what a cell actually looks like.\n */\nexport function resolveCellAppearance(\n  count: number | null | undefined,\n  color: string | undefined,\n  isDeselected: boolean,\n  deselectedColor: string\n): { fill: string; fillOpacity: number } {\n  const isNullValue = count == null;\n  return {\n    fill: isNullValue ? NULL_VALUE_COLOR : isDeselected ? deselectedColor : color ?? deselectedColor,\n    fillOpacity: isNullValue ? 0 : isDeselected ? DESELECTED_OPACITY : 1,\n  };\n}\n"],"names":["DEFAULT_DESELECTED_COLOR","DESELECTED_OPACITY","NULL_VALUE_COLOR","cellKey","cell","row","column","getHeatmapColorScale","colors","maxValue","scaleLinear","range","domain","map","_","i","length","resolveCellAppearance","count","color","isDeselected","deselectedColor","isNullValue","fill","fillOpacity"],"mappings":";AAGO,MAAMA,IAA2B,WAC3BC,IAAqB,KACrBC,IAAmB,QAEnBC,IAAUA,CAACC,MAAwB,GAAGA,EAAKC,GAAG,IAAID,EAAKE,MAAM;AAEnE,SAASC,EAAqBC,GAAuCC,GAAkB;AAC5F,SAAOC,EAAoB;AAAA,IACzBC,OAAOH;AAAAA,IACPI,QAAQJ,EAAOK,IAAI,CAACC,GAAGC,MAAOA,IAAIN,KAAaD,EAAOQ,SAAS,EAAE;AAAA,EAAA,CAClE;AACH;AAOO,SAASC,EACdC,GACAC,GACAC,GACAC,GACuC;AACvC,QAAMC,IAAcJ,KAAS;AAC7B,SAAO;AAAA,IACLK,MAAMD,IAAcpB,IAAmBkB,IAAeC,IAAkBF,KAASE;AAAAA,IACjFG,aAAaF,IAAc,IAAIF,IAAenB,IAAqB;AAAA,EAAA;AAEvE;"}

package/dist/visualization.es69.js

@@ -1,46 +1,119 @@
-import { createElement as B } from "react";
-import I from "./visualization.es127.js";
-import L from "./visualization.es234.js";
-import i from "./visualization.es235.js";
-import { jsx as t, Fragment as j } from "react/jsx-runtime";
-import v from "./visualization.es236.js";
-import h from "./visualization.es36.js";
-function H(N) {
-  let {
-    top: x,
-    left: O,
-    className: R,
-    root: T,
-    tile: r,
-    size: d,
-    round: n,
-    padding: o,
-    paddingInner: p,
-    paddingOuter: a,
-    paddingTop: m,
-    paddingRight: f,
-    paddingBottom: g,
-    paddingLeft: c,
-    children: s,
-    nodeComponent: l = L
-  } = N;
-  const e = v();
-  r && e.tile(r), d && e.size(d), n && e.round(n), o && i(e.padding, o), p && i(e.paddingInner, p), a && i(e.paddingOuter, a), m && i(e.paddingTop, m), f && i(e.paddingRight, f), g && i(e.paddingBottom, g), c && i(e.paddingLeft, c);
-  const u = e(T);
-  return s ? /* @__PURE__ */ t(j, {
-    children: s(u)
-  }) : /* @__PURE__ */ t(h, {
-    top: x,
-    left: O,
-    className: I("visx-treemap", R),
-    children: l && u.descendants().map((b, z) => /* @__PURE__ */ t(h, {
-      children: /* @__PURE__ */ B(l, {
-        node: b
-      })
-    }, `treemap-node-${z}`))
-  });
+import { cellKey as x, resolveCellAppearance as S } from "./visualization.es68.js";
+const m = (t, o, n) => Math.min(Math.max(t, o), n);
+function y(t, o, n) {
+  const {
+    xScale: a,
+    cellYScale: u,
+    gap: e,
+    isRect: l,
+    binWidth: c,
+    binHeight: i
+  } = t;
+  if (l)
+    return {
+      isRect: !0,
+      x: a(o),
+      y: u(n) + e,
+      width: c - e,
+      height: i - e
+    };
+  const r = Math.min(c, i) / 2;
+  return {
+    isRect: !1,
+    cx: o * c + c / 2,
+    cy: u(n) + e + r,
+    r: r - e,
+    radius: r
+  };
+}
+function R(t, o, n, a, u, e) {
+  const {
+    data: l,
+    numRows: c,
+    binWidth: i,
+    binHeight: r,
+    yMax: h
+  } = t;
+  return {
+    colStart: m(Math.floor(o / i) - e, 0, Math.max(0, l.length - 1)),
+    colEnd: m(Math.ceil((o + a) / i) + e, 0, Math.max(0, l.length - 1)),
+    rowStart: m(Math.floor((h - (n + u)) / r) - e, 0, Math.max(0, c - 1)),
+    rowEnd: m(Math.floor((h - n) / r) + e, 0, Math.max(0, c - 1))
+  };
+}
+function D(t, o, n, a) {
+  const {
+    data: u,
+    colorScale: e,
+    selectedKeys: l,
+    deselectedColor: c
+  } = o;
+  for (let i = n.colStart; i <= n.colEnd; i++) {
+    const r = u[i];
+    if (r)
+      for (let h = n.rowStart; h <= n.rowEnd; h++) {
+        const f = r.rows[h];
+        if (!f) continue;
+        const d = f.count, M = d == null ? void 0 : e(d), b = !!l && !l.has(x({
+          row: h,
+          column: i
+        })), {
+          fill: w,
+          fillOpacity: g
+        } = S(d, M, b, c);
+        if (g <= 0) continue;
+        const s = y(o, i, h);
+        t.globalAlpha = g, t.fillStyle = w, t.beginPath(), s.isRect ? t.rect(s.x, s.y, Math.max(s.width, 0), Math.max(s.height, 0)) : t.arc(s.cx, s.cy, Math.max(s.r, 0), 0, Math.PI * 2), t.fill(), a && a.row === h && a.column === i && (t.globalAlpha = 1, t.lineWidth = 2, t.strokeStyle = w, t.stroke());
+      }
+  }
+  t.globalAlpha = 1;
+}
+function A(t, o, n) {
+  const {
+    data: a,
+    numRows: u,
+    binWidth: e,
+    binHeight: l,
+    yMax: c
+  } = t;
+  if (o < 0 || n < 0) return null;
+  const i = Math.floor(o / e), r = Math.floor((c - n) / l);
+  return i < 0 || i >= a.length || r < 0 || r >= u || !a[i]?.rows[r] ? null : {
+    row: r,
+    column: i
+  };
+}
+function E(t, o) {
+  const n = t.data[o.column], a = n?.rows[o.row];
+  if (!n || !a) return null;
+  const u = a.count, e = u == null ? void 0 : t.colorScale(u), l = y(t, o.column, o.row), c = {
+    bin: a,
+    row: o.row,
+    column: o.column,
+    datum: n,
+    gap: t.gap,
+    count: u,
+    color: e,
+    opacity: u == 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
+  };
 }
 export {
-  H as default
+  E as buildBin,
+  D as drawHeatmapCells,
+  R as getVisibleRange,
+  A as hitTestCell
 };
 //# sourceMappingURL=visualization.es69.js.map