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

package/dist/visualization.es100.js.map

@@ -1 +1 @@
-{"version":3,"file":"visualization.es100.js","sources":["../src/components/TreeMap/ValueOval.tsx"],"sourcesContent":["import { ValueOvalProps } from \"./types\";\nimport { measureTextWidth } from \"./helpers\";\n\nconst ValueOval: React.FC<ValueOvalProps> = ({ cx, cy, value, color, align }) => {\n    const fontSize = 12;\n    const text = `${value}`;\n    const textWidth = measureTextWidth(text, fontSize, \"sans-serif\");\n    const padding = 6;\n    const ovalWidth = textWidth + padding * 2;\n    const ovalHeight = fontSize * 1.8;\n\n    let xPos = cx;\n    if (align === \"start\") xPos += ovalWidth / 2;\n    if (align === \"end\") xPos -= ovalWidth / 2;\n\n    return (\n        <>\n            <rect\n                x={xPos - ovalWidth / 2}\n                y={cy - ovalHeight / 2}\n                width={ovalWidth}\n                height={ovalHeight}\n                rx={ovalHeight / 2}\n                fill={color}\n            />\n            <text\n                x={xPos}\n                y={cy + 1}\n                textAnchor=\"middle\"\n                dominantBaseline=\"middle\"\n                fill=\"white\"\n                fontSize={fontSize}\n                fontWeight={500}\n            >\n                {text}\n            </text>\n        </>\n    );\n};\n\nexport default ValueOval;"],"names":["ValueOval","t0","$","_c","cx","cy","value","color","align","text","ovalWidth","measureTextWidth","xPos","t1","t2","t3","jsx","ovalHeight","t4","t5","fontSize","t6"],"mappings":";;;AAGA,MAAMA,IAAsCC,CAAAA,MAAA;AAAA,QAAAC,IAAAC,EAAA,EAAA,GAAC;AAAA,IAAAC,IAAAA;AAAAA,IAAAC,IAAAA;AAAAA,IAAAC,OAAAA;AAAAA,IAAAC,OAAAA;AAAAA,IAAAC,OAAAA;AAAAA,EAAAA,IAAAP,GAEzCQ,IAAa,GAAGH,CAAK,IAGrBI,IAFkBC,EAAiBF,GAFlB,IAEkC,YAAY,IAEjC;AAG9B,MAAAG,IAAWR;AACX,EAAII,MAAU,YAASI,IAAAA,IAAQF,IAAY,IACvCF,MAAU,UAAOI,IAAAA,IAAQF,IAAY;AAK1B,QAAAG,IAAAD,IAAOF,IAAY,GACnBI,IAAAT,IAAK;AAAc,MAAAU;AAAA,EAAAb,EAAA,CAAA,MAAAK,KAAAL,EAAA,CAAA,MAAAQ,KAAAR,EAAA,CAAA,MAAAW,KAAAX,SAAAY,KAF1BC,IAAA,gBAAAC,EAAA,QAAA,EACO,GAAAH,GACA,GAAAC,GACIJ,OAAAA,GACCO,QAZDA,MAaH,IAAA,MACEV,MAAAA,GAAK,GACbL,OAAAK,GAAAL,OAAAQ,GAAAR,OAAAW,GAAAX,OAAAY,GAAAZ,OAAAa,KAAAA,IAAAb,EAAA,CAAA;AAGK,QAAAgB,IAAAb,IAAK;AAAC,MAAAc;AAAA,EAAAjB,EAAA,CAAA,MAAAgB,KAAAhB,SAAAO,KAAAP,EAAA,CAAA,MAAAU,KAFbO,gCACOP,GAAAA,GACA,GAAAM,GACQ,YAAA,UACM,kBAAA,UACZ,MAAA,SACKE,UA3BLA,IA4BO,YAAA,KAEXX,UAAAA,GACL,GAAOP,OAAAgB,GAAAhB,OAAAO,GAAAP,OAAAU,GAAAV,OAAAiB,KAAAA,IAAAjB,EAAA,CAAA;AAAA,MAAAmB;AAAA,SAAAnB,EAAA,CAAA,MAAAa,KAAAb,UAAAiB,KAnBXE,2BACIN,UAAAA;AAAAA,IAAAA;AAAAA,IAQAI;AAAAA,EAAAA,GAUO,GACRjB,OAAAa,GAAAb,QAAAiB,GAAAjB,QAAAmB,KAAAA,IAAAnB,EAAA,EAAA,GApBHmB;AAoBG;"}
+{"version":3,"file":"visualization.es100.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}\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}: 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  useEffect(() => {\n    const canvas = canvasRef.current;\n    if (!canvas || scaleX <= 0 || scaleY <= 0) return;\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  }, [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","t0","$","_c","canvasCellParams","xMax","yMax","viewportWidth","viewportHeight","scrollLeft","scrollTop","width","height","onNavigate","onCanvasClick","canvasRef","useRef","scaleX","scaleY","t1","t2","canvas","current","ctx","getContext","dpr","window","devicePixelRatio","setTransform","clearRect","range","colStart","colEnd","data","length","rowStart","rowEnd","numRows","drawHeatmapCells","useEffect","t3","contentX","contentY","navigateCentered","t4","event","rect","currentTarget","getBoundingClientRect","clientX","left","clientY","top","handleCanvasPointerDown","handleRectPointerDown","_temp","t5","event_1","hasPointerCapture","pointerId","movementX","movementY","handleRectPointerMove","handleRectPointerUp","_temp2","rectLeft","rectTop","rectWidth","rectHeight","t6","position","t7","t8","t9","display","cursor","border","boxSizing","t10","jsx","t11","backgroundColor","t12","t13","jsxs","event_0","stopPropagation","setPointerCapture","event_2","releasePointerCapture"],"mappings":";;;;AAiBA,MAAMA,IAAQA,CAACC,GAAeC,GAAaC,MAAgBC,KAAKF,IAAIE,KAAKD,IAAIF,GAAOC,CAAG,GAAGC,CAAG,GAEvFE,KAAiBC,CAAAA,MAAA;AAAA,QAAAC,IAAAC,EAAA,EAAA,GAAC;AAAA,IAAAC,kBAAAA;AAAAA,IAAAC,MAAAA;AAAAA,IAAAC,MAAAA;AAAAA,IAAAC,eAAAA;AAAAA,IAAAC,gBAAAA;AAAAA,IAAAC,YAAAA;AAAAA,IAAAC,WAAAA;AAAAA,IAAAC,OAAAA;AAAAA,IAAAC,QAAAA;AAAAA,IAAAC,YAAAA;AAAAA,IAAAC,eAAAA;AAAAA,EAAAA,IAAAb,GAatBc,IAAkBC,EAAiC,IAAI,GACvDC,IAAeZ,IAAO,IAAIM,IAAQN,IAAnB,GACfa,IAAeZ,IAAO,IAAIM,IAASN,IAApB;AAA6B,MAAAa,GAAAC;AAAA,EAAAlB,EAAA,CAAA,MAAAE,KAAAF,EAAA,CAAA,MAAAe,KAAAf,EAAA,CAAA,MAAAgB,KAAAhB,EAAA,CAAA,MAAAG,KAAAH,SAAAI,KAElCa,IAAAA,MAAA;AACR,UAAAE,IAAeN,EAASO;AACxB,QAAI,CAACD,KAAUJ,KAAU,KAAKC,KAAU;AAAC;AACzC,UAAAK,IAAYF,EAAMG,WAAY,IAAI;AAClC,QAAI,CAACD;AAAG;AACR,UAAAE,IAAYC,OAAMC,oBAAN;AACZJ,IAAAA,EAAGK,aAAcH,IAAMR,GAAQ,GAAG,GAAGQ,IAAMP,GAAQ,GAAG,CAAC,GACvDK,EAAGM,UAAW,GAAG,GAAGxB,GAAMC,CAAI;AAC9B,UAAAwB,IAAc;AAAA,MAAAC,UACF;AAAA,MAACC,QACHjC,KAAID,IAAK,GAAGM,EAAgB6B,KAAKC,SAAU,CAAC;AAAA,MAACC,UAC3C;AAAA,MAACC,QACHrC,KAAID,IAAK,GAAGM,EAAgBiC,UAAW,CAAC;AAAA,IAAA;AAElDC,IAAAA,EAAiBf,GAAKnB,GAAkB0B,GAAO,IAAI;AAAA,EAAC,GACnDV,IAAA,CAAChB,GAAkBC,GAAMC,GAAMW,GAAQC,CAAM,GAAChB,OAAAE,GAAAF,OAAAe,GAAAf,OAAAgB,GAAAhB,OAAAG,GAAAH,OAAAI,GAAAJ,OAAAiB,GAAAjB,OAAAkB,MAAAD,IAAAjB,EAAA,CAAA,GAAAkB,IAAAlB,EAAA,CAAA,IAfjDqC,EAAUpB,GAePC,CAA8C;AAAC,MAAAoB;AAAA,EAAAtC,EAAA,CAAA,MAAAW,KAAAX,EAAA,CAAA,MAAAM,KAAAN,EAAA,CAAA,MAAAK,KAAAL,EAAA,EAAA,MAAAG,KAAAH,UAAAI,KAGhDkC,IAAAA,CAAAC,GAAAC,MAAA;AACE7B,IAAAA,EACElB,EAAM8C,IAAWlC,IAAgB,GAAG,GAAGR,KAAID,IAAK,GAAGO,IAAOE,CAAa,CAAC,GACxEZ,EAAM+C,IAAWlC,IAAiB,GAAG,GAAGT,KAAID,IAAK,GAAGQ,IAAOE,CAAc,CAAC,CAC5E;AAAA,EAAC,GACFN,OAAAW,GAAAX,OAAAM,GAAAN,OAAAK,GAAAL,QAAAG,GAAAH,QAAAI,GAAAJ,QAAAsC,KAAAA,IAAAtC,EAAA,EAAA;AANH,QAAAyC,IAAyBH;AAQvB,MAAAI;AAAA,EAAA1C,EAAA,EAAA,MAAAyC,KAAAzC,EAAA,EAAA,MAAAY,KAAAZ,EAAA,EAAA,MAAAe,KAAAf,UAAAgB,KAGA0B,IAAAC,CAAAA,MAAA;AACE,QAAI/B,GAAa;AACfA,MAAAA,EAAAA;AAAe;AAAA,IAAA;AAGjB,QAAIG,KAAU,KAAKC,KAAU;AAAC;AAC9B,UAAA4B,IAAaD,EAAKE,cAAcC,sBAAAA;AAChCL,IAAAA,GAAkBE,EAAKI,UAAWH,EAAII,QAASjC,IAAS4B,EAAKM,UAAWL,EAAIM,OAAQlC,CAAM;AAAA,EAAC,GAC5FhB,QAAAyC,GAAAzC,QAAAY,GAAAZ,QAAAe,GAAAf,QAAAgB,GAAAhB,QAAA0C,KAAAA,IAAA1C,EAAA,EAAA;AATH,QAAAmD,IAAgCT,GAahCU,IAA8BC;AAGvB,MAAAC;AAAA,EAAAtD,EAAA,EAAA,MAAAW,KAAAX,EAAA,EAAA,MAAAe,KAAAf,UAAAgB,KAAAhB,EAAA,EAAA,MAAAO,KAAAP,EAAA,EAAA,MAAAQ,KAAAR,EAAA,EAAA,MAAAM,KAAAN,EAAA,EAAA,MAAAK,KAAAL,EAAA,EAAA,MAAAG,KAAAH,UAAAI,KAGLkD,IAAAC,CAAAA,MAAA;AACE,IAAIxC,KAAU,KAAKC,KAAU,KAAzB,CAA+B2B,EAAKE,cAAcW,kBAAmBb,EAAKc,SAAU,KACxF9C,EACElB,EAAMc,IAAaoC,EAAKe,YAAa3C,GAAQ,GAAGlB,KAAID,IAAK,GAAGO,IAAOE,CAAa,CAAC,GACjFZ,EAAMe,IAAYmC,EAAKgB,YAAa3C,GAAQ,GAAGnB,KAAID,IAAK,GAAGQ,IAAOE,CAAc,CAAC,CACnF;AAAA,EAAC,GACFN,QAAAW,GAAAX,QAAAe,GAAAf,QAAAgB,GAAAhB,QAAAO,GAAAP,QAAAQ,GAAAR,QAAAM,GAAAN,QAAAK,GAAAL,QAAAG,GAAAH,QAAAI,GAAAJ,QAAAsD,KAAAA,IAAAtD,EAAA,EAAA;AAPH,QAAA4D,IAA8BN,GAW9BO,IAA4BC,GAI5BC,IAAiBtE,EAAMc,IAAaQ,GAAQ,GAAGN,CAAK,GACpDuD,IAAgBvE,EAAMe,IAAYQ,GAAQ,GAAGN,CAAM,GACnDuD,IAAkBpE,KAAID,IAAK,GAAGC,KAAIF,IAAKU,IAAgBU,GAAQN,IAAQsD,CAAQ,CAAC,GAChFG,IAAmBrE,KAAID,IAAK,GAAGC,KAAIF,IAAKW,IAAiBU,GAAQN,IAASsD,CAAO,CAAC;AAAE,MAAAG;AAAA,EAAAnE,EAAA,EAAA,MAAAU,KAAAV,UAAAS,KAGtE0D,IAAA;AAAA,IAAAC,UAAY;AAAA,IAAU3D,OAAAA;AAAAA,IAAAC,QAAAA;AAAAA,EAAAA,GAAiBV,QAAAU,GAAAV,QAAAS,GAAAT,QAAAmE,KAAAA,IAAAnE,EAAA,EAAA;AAGxC,QAAAqE,IAAA5D,KAASe,OAAMC,oBAAN,IACR6C,IAAA5D,KAAUc,OAAMC,oBAAN;AAA6B,MAAA8C;AAAA,EAAAvE,EAAA,EAAA,MAAAU,KAAAV,UAAAS,KACxC8D,IAAA;AAAA,IAAA9D,OAAAA;AAAAA,IAAAC,QAAAA;AAAAA,IAAA8D,SAA0B;AAAA,IAAOC,QAAU;AAAA,IAASC,QAAU;AAAA,IAAmBC,WAAa;AAAA,EAAA,GAAc3E,QAAAU,GAAAV,QAAAS,GAAAT,QAAAuE,KAAAA,IAAAvE,EAAA,EAAA;AAAA,MAAA4E;AAAA,EAAA5E,EAAA,EAAA,MAAAmD,KAAAnD,EAAA,EAAA,MAAAqE,KAAArE,EAAA,EAAA,MAAAsE,KAAAtE,UAAAuE,KAJrHK,IAAA,gBAAAC,EAAA,UAAA,EACOhE,KAAAA,GACE,OAAAwD,GACC,QAAAC,GACD,OAAAC,GACQpB,eAAAA,EAAAA,CAAuB,GACtCnD,QAAAmD,GAAAnD,QAAAqE,GAAArE,QAAAsE,GAAAtE,QAAAuE,GAAAvE,QAAA4E,KAAAA,IAAA5E,EAAA,EAAA;AAAA,MAAA8E;AAAA,EAAA9E,EAAA,EAAA,MAAAkE,KAAAlE,EAAA,EAAA,MAAA+D,KAAA/D,EAAA,EAAA,MAAAgE,KAAAhE,UAAAiE,KAKOa,IAAA;AAAA,IAAAV,UACK;AAAA,IAAUpB,MACde;AAAAA,IAAQb,KACTc;AAAAA,IAAOvD,OACLwD;AAAAA,IAASvD,QACRwD;AAAAA,IAAUQ,QACV;AAAA,IAAmBK,iBACV;AAAA,IAAyBN,QAClC;AAAA,IAAME,WACH;AAAA,EAAA,GACZ3E,QAAAkE,GAAAlE,QAAA+D,GAAA/D,QAAAgE,GAAAhE,QAAAiE,GAAAjE,QAAA8E,KAAAA,IAAA9E,EAAA,EAAA;AAAA,MAAAgF;AAAA,EAAAhF,EAAA,EAAA,MAAA4D,KAAA5D,UAAA8E,KAdHE,IAAA,gBAAAH,EAAA,SACiBzB,kBACAQ,eAAAA,GACFC,gBACN,OAAAiB,EAAAA,CAUN,GACD9E,QAAA4D,GAAA5D,QAAA8E,GAAA9E,QAAAgF,KAAAA,IAAAhF,EAAA,EAAA;AAAA,MAAAiF;AAAA,SAAAjF,EAAA,EAAA,MAAA4E,KAAA5E,UAAAgF,KAAAhF,EAAA,EAAA,MAAAmE,KAvBJc,IAAA,gBAAAC,EAAA,OAAA,EAAY,OAAAf,GACVS,UAAAA;AAAAA,IAAAA;AAAAA,IAOAI;AAAAA,EAAAA,GAgBF,GAAMhF,QAAA4E,GAAA5E,QAAAgF,GAAAhF,QAAAmE,GAAAnE,QAAAiF,KAAAA,IAAAjF,EAAA,EAAA,GAxBNiF;AAwBM;AA3Ga,SAAA5B,EAAA8B,GAAA;AA0DnBxC,EAAAA,EAAKyC,gBAAAA,GACLzC,EAAKE,cAAcwC,kBAAmB1C,EAAKc,SAAU;AAAC;AA3DnC,SAAAK,EAAAwB,GAAA;AA0EnB3C,EAAAA,EAAKE,cAAc0C,sBAAuB5C,EAAKc,SAAU;AAAC;"}

package/dist/visualization.es101.js

@@ -1,73 +1,132 @@
-function x(t, c, a, r) {
-  const n = (t.x0 + t.x1) / 2, e = (t.y0 + t.y1) / 2;
-  switch (c) {
-    case "topLeft":
-      return {
-        textX: t.x0 + 6,
-        textY: t.y0 + 10,
-        valueY: r ? t.y0 + 17 : t.y0 + 40,
-        valueX: r ? t.x1 - 6 : t.x0 + 6,
-        textAnchor: "start",
-        valueAnchor: r ? "end" : "start",
-        baseline: "hanging"
-      };
-    case "topRight":
-      return {
-        textX: t.x1 - 6,
-        textY: t.y0 + 10,
-        valueY: t.y0 + 40,
-        valueX: t.x1 - 6,
-        textAnchor: "end",
-        valueAnchor: "end",
-        baseline: "hanging"
-      };
-    case "bottomLeft":
-      return {
-        textX: t.x0 + 6,
-        textY: a ? t.y1 - 35 : t.y1 - 15,
-        valueY: t.y1 - 15,
-        valueX: t.x0 + 6,
-        textAnchor: "start",
-        valueAnchor: "start",
-        baseline: "alphabetic"
-      };
-    case "bottomRight":
-      return {
-        textX: t.x1 - 6,
-        textY: a ? t.y1 - 35 : t.y1 - 15,
-        valueY: t.y1 - 15,
-        valueX: t.x1 - 6,
-        textAnchor: "end",
-        valueAnchor: "end",
-        baseline: "alphabetic"
-      };
-    default:
-      return {
-        textX: n,
-        textY: a ? e - 5 : e + 5,
-        valueY: e + 15,
-        valueX: n,
-        textAnchor: "middle",
-        valueAnchor: "middle",
-        baseline: "middle"
-      };
-  }
-}
-function l(t, c, a) {
-  const u = document.createElement("canvas").getContext("2d");
-  return u ? (u.font = `${c}px ${a}`, u.measureText(t).width) : 0;
-}
-function s(t, c, a, r) {
-  const n = document.createElement("canvas").getContext("2d");
-  if (!n || (n.font = `${a}px ${r}`, n.measureText(t).width <= c)) return t;
-  let e = t;
-  for (; e.length > 0 && n.measureText(e + "…").width > c; )
-    e = e.slice(0, -1);
-  return e === "" ? "" : e + "...";
-}
+import { jsx as c, jsxs as H } from "react/jsx-runtime";
+import { c as j } from "react/compiler-runtime";
+import { useRef as R, useEffect as A, useState as L } from "react";
+import N from "./visualization.es100.js";
+const O = 94, $ = 90, z = 16, V = (M) => {
+  const e = j(26);
+  let n, o, t;
+  e[0] !== M ? ({
+    onClose: t,
+    containerRef: n,
+    ...o
+  } = M, e[0] = M, e[1] = n, e[2] = o, e[3] = t) : (n = e[1], o = e[2], t = e[3]);
+  const S = R(null);
+  let m, p;
+  e[4] !== n || e[5] !== t ? (m = () => {
+    const d = (f) => {
+      const h = f.target;
+      n.current?.contains(h) || S.current?.contains(h) || t();
+    }, a = (f) => {
+      f.key === "Escape" && t();
+    };
+    return document.addEventListener("pointerdown", d), document.addEventListener("keydown", a), () => {
+      document.removeEventListener("pointerdown", d), document.removeEventListener("keydown", a);
+    };
+  }, p = [n, t], e[4] = n, e[5] = t, e[6] = m, e[7] = p) : (m = e[6], p = e[7]), A(m, p);
+  const [i, k] = L(null), I = R(null);
+  let u;
+  e[8] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (u = (d) => {
+    if (I.current?.disconnect(), I.current = null, !d) {
+      k(null);
+      return;
+    }
+    const a = new ResizeObserver((f) => {
+      const [h] = f;
+      if (!h)
+        return;
+      const {
+        width: C,
+        height: D
+      } = h.contentRect;
+      k({
+        width: Math.floor(C),
+        height: Math.floor(D)
+      });
+    });
+    a.observe(d), I.current = a;
+  }, e[8] = u) : u = e[8];
+  const E = u;
+  let b;
+  e[9] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (b = {
+    position: "fixed",
+    inset: 0,
+    zIndex: 1e3,
+    background: "rgba(0,0,0,0.45)",
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "center"
+  }, e[9] = b) : b = e[9];
+  let y, g, x;
+  e[10] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (y = {
+    position: "relative",
+    width: `${O}vw`,
+    height: `${$}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"
+  }, g = {
+    flexShrink: 0,
+    display: "flex",
+    alignItems: "center",
+    justifyContent: "space-between",
+    padding: `10px ${z}px`,
+    background: "#f7f7f8",
+    borderBottom: "1px solid #e5e5e5"
+  }, x = /* @__PURE__ */ c("span", { style: {
+    fontSize: 14,
+    fontWeight: 600,
+    color: "#333"
+  }, children: "Minimap" }), e[10] = y, e[11] = g, e[12] = x) : (y = e[10], g = e[11], x = e[12]);
+  let _;
+  e[13] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (_ = {
+    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[13] = _) : _ = e[13];
+  let r;
+  e[14] !== t ? (r = /* @__PURE__ */ H("div", { style: g, children: [
+    x,
+    /* @__PURE__ */ c("button", { type: "button", "aria-label": "Close expanded minimap", onClick: t, style: _, children: "×" })
+  ] }), e[14] = t, e[15] = r) : r = e[15];
+  let v;
+  e[16] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (v = {
+    flex: 1,
+    minHeight: 0,
+    display: "flex",
+    padding: z
+  }, e[16] = v) : v = e[16];
+  let w;
+  e[17] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (w = {
+    flex: 1,
+    minHeight: 0,
+    position: "relative"
+  }, e[17] = w) : w = e[17];
+  let l;
+  e[18] !== o || e[19] !== i ? (l = i && i.width > 0 && i.height > 0 && /* @__PURE__ */ c(N, { ...o, width: i.width, height: i.height }), e[18] = o, e[19] = i, e[20] = l) : l = e[20];
+  let s;
+  e[21] !== l ? (s = /* @__PURE__ */ c("div", { style: v, children: /* @__PURE__ */ c("div", { ref: E, style: w, children: l }) }), e[21] = l, e[22] = s) : s = e[22];
+  let P;
+  return e[23] !== s || e[24] !== r ? (P = /* @__PURE__ */ c("div", { style: b, children: /* @__PURE__ */ H("div", { ref: S, style: y, children: [
+    r,
+    s
+  ] }) }), e[23] = s, e[24] = r, e[25] = P) : P = e[25], P;
+};
 export {
-  x as getLabelPlacement,
-  l as measureTextWidth,
-  s as truncateTextToWidth
+  V as default
 };
 //# sourceMappingURL=visualization.es101.js.map

package/dist/visualization.es101.js.map

@@ -1 +1 @@
-{"version":3,"file":"visualization.es101.js","sources":["../src/components/TreeMap/helpers.ts"],"sourcesContent":["import { HierarchyRectangularNode } from \"@visx/hierarchy\";\nimport { TreemapNode, TreemapProps } from \"./types\";\n\n//get coords for label placement based on user input\nexport function getLabelPlacement(\n    node: HierarchyRectangularNode<TreemapNode<any>>,\n    placement: TreemapProps<any>[\"labelPlacement\"],\n    showValue?: boolean,\n    hasChildren?: boolean\n) {\n    const padding = 6;\n    const cx = (node.x0 + node.x1) / 2;\n    const cy = (node.y0 + node.y1) / 2;\n\n    switch (placement) {\n        case \"topLeft\":\n            return {\n                textX: node.x0 + padding,\n                textY: node.y0 + 10,\n                valueY: hasChildren ? node.y0 + 17 : node.y0 + 40,\n                valueX: hasChildren ? node.x1 - padding : node.x0 + padding,\n                textAnchor: \"start\",\n                valueAnchor: hasChildren ? \"end\" : \"start\",\n                baseline: \"hanging\",\n            } as const;\n        case \"topRight\":\n            return {\n                textX: node.x1 - padding,\n                textY: node.y0 + 10,\n                valueY: node.y0 + 40,\n                valueX: node.x1 - padding,\n                textAnchor: \"end\",\n                valueAnchor: \"end\",\n                baseline: \"hanging\",\n            } as const;\n        case \"bottomLeft\":\n            return {\n                textX: node.x0 + padding,\n                textY: showValue ? node.y1 - 35 : node.y1 - 15 ,\n                valueY: node.y1 - 15,\n                valueX: node.x0 + padding,\n                textAnchor: \"start\",\n                valueAnchor: \"start\",\n                baseline: \"alphabetic\",\n            } as const;\n        case \"bottomRight\":\n            return {\n                textX: node.x1 - padding,\n                textY: showValue ? node.y1 - 35 : node.y1 - 15,\n                valueY: node.y1 - 15,\n                valueX: node.x1 - padding,\n                textAnchor: \"end\",\n                valueAnchor: \"end\",\n                baseline: \"alphabetic\",\n            } as const;\n        case \"middle\":\n        default:\n            return {\n                textX: cx,\n                textY: showValue ? cy - 5 : cy + 5,\n                valueY: cy + 15,\n                valueX: cx,\n                textAnchor: \"middle\",\n                valueAnchor: \"middle\",\n                baseline: \"middle\",\n            } as const;\n    }\n}\n\n//Check if text exceeds box\nexport function measureTextWidth(text: string, fontSize: number, fontFamily: string) {\n    const canvas = document.createElement(\"canvas\");\n    const ctx = canvas.getContext(\"2d\");\n    if (!ctx) return 0;\n    ctx.font = `${fontSize}px ${fontFamily}`;\n    return ctx.measureText(text).width;\n}\n\n//truncate text with ... to fit in box\nexport function truncateTextToWidth(\n  text: string,\n  maxWidth: number,\n  fontSize: number,\n  fontFamily: string\n): string {\n  const canvas = document.createElement(\"canvas\");\n  const ctx = canvas.getContext(\"2d\");\n  if (!ctx) return text;\n\n  ctx.font = `${fontSize}px ${fontFamily}`;\n  if (ctx.measureText(text).width <= maxWidth) return text;\n\n  let truncated = text;\n  while (truncated.length > 0 && ctx.measureText(truncated + \"…\").width > maxWidth) {\n    truncated = truncated.slice(0, -1);\n  }\n\n  const result = truncated === \"\" ? \"\" : truncated + \"...\"\n\n  return result;\n}\n"],"names":["getLabelPlacement","node","placement","showValue","hasChildren","cx","x0","x1","cy","y0","y1","textX","padding","textY","valueY","valueX","textAnchor","valueAnchor","baseline","measureTextWidth","text","fontSize","fontFamily","ctx","document","createElement","getContext","font","measureText","width","truncateTextToWidth","maxWidth","truncated","length","slice"],"mappings":"AAIO,SAASA,EACZC,GACAC,GACAC,GACAC,GACF;AAEE,QAAMC,KAAMJ,EAAKK,KAAKL,EAAKM,MAAM,GAC3BC,KAAMP,EAAKQ,KAAKR,EAAKS,MAAM;AAEjC,UAAQR,GAAAA;AAAAA,IACJ,KAAK;AACD,aAAO;AAAA,QACHS,OAAOV,EAAKK,KAAKM;AAAAA,QACjBC,OAAOZ,EAAKQ,KAAK;AAAA,QACjBK,QAAQV,IAAcH,EAAKQ,KAAK,KAAKR,EAAKQ,KAAK;AAAA,QAC/CM,QAAQX,IAAcH,EAAKM,KAAKK,IAAUX,EAAKK,KAAKM;AAAAA,QACpDI,YAAY;AAAA,QACZC,aAAab,IAAc,QAAQ;AAAA,QACnCc,UAAU;AAAA,MAAA;AAAA,IAElB,KAAK;AACD,aAAO;AAAA,QACHP,OAAOV,EAAKM,KAAKK;AAAAA,QACjBC,OAAOZ,EAAKQ,KAAK;AAAA,QACjBK,QAAQb,EAAKQ,KAAK;AAAA,QAClBM,QAAQd,EAAKM,KAAKK;AAAAA,QAClBI,YAAY;AAAA,QACZC,aAAa;AAAA,QACbC,UAAU;AAAA,MAAA;AAAA,IAElB,KAAK;AACD,aAAO;AAAA,QACHP,OAAOV,EAAKK,KAAKM;AAAAA,QACjBC,OAAOV,IAAYF,EAAKS,KAAK,KAAKT,EAAKS,KAAK;AAAA,QAC5CI,QAAQb,EAAKS,KAAK;AAAA,QAClBK,QAAQd,EAAKK,KAAKM;AAAAA,QAClBI,YAAY;AAAA,QACZC,aAAa;AAAA,QACbC,UAAU;AAAA,MAAA;AAAA,IAElB,KAAK;AACD,aAAO;AAAA,QACHP,OAAOV,EAAKM,KAAKK;AAAAA,QACjBC,OAAOV,IAAYF,EAAKS,KAAK,KAAKT,EAAKS,KAAK;AAAA,QAC5CI,QAAQb,EAAKS,KAAK;AAAA,QAClBK,QAAQd,EAAKM,KAAKK;AAAAA,QAClBI,YAAY;AAAA,QACZC,aAAa;AAAA,QACbC,UAAU;AAAA,MAAA;AAAA,IAGlB;AACI,aAAO;AAAA,QACHP,OAAON;AAAAA,QACPQ,OAAOV,IAAYK,IAAK,IAAIA,IAAK;AAAA,QACjCM,QAAQN,IAAK;AAAA,QACbO,QAAQV;AAAAA,QACRW,YAAY;AAAA,QACZC,aAAa;AAAA,QACbC,UAAU;AAAA,MAAA;AAAA,EACd;AAEZ;AAGO,SAASC,EAAiBC,GAAcC,GAAkBC,GAAoB;AAEjF,QAAMC,IADSC,SAASC,cAAc,QAAQ,EAC3BC,WAAW,IAAI;AAClC,SAAKH,KACLA,EAAII,OAAO,GAAGN,CAAQ,MAAMC,CAAU,IAC/BC,EAAIK,YAAYR,CAAI,EAAES,SAFZ;AAGrB;AAGO,SAASC,EACdV,GACAW,GACAV,GACAC,GACQ;AAER,QAAMC,IADSC,SAASC,cAAc,QAAQ,EAC3BC,WAAW,IAAI;AAIlC,MAHI,CAACH,MAELA,EAAII,OAAO,GAAGN,CAAQ,MAAMC,CAAU,IAClCC,EAAIK,YAAYR,CAAI,EAAES,SAASE,GAAU,QAAOX;AAEpD,MAAIY,IAAYZ;AAChB,SAAOY,EAAUC,SAAS,KAAKV,EAAIK,YAAYI,IAAY,GAAG,EAAEH,QAAQE;AACtEC,IAAAA,IAAYA,EAAUE,MAAM,GAAG,EAAE;AAKnC,SAFeF,MAAc,KAAK,KAAKA,IAAY;AAGrD;"}
+{"version":3,"file":"visualization.es101.js","sources":["../src/components/Heatmap/scrollable/HeatmapMiniMapPopup.tsx"],"sourcesContent":["import { useCallback, useEffect, useRef, useState, type RefObject } from \"react\";\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\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  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 (\n    <div style={{ position: \"fixed\", inset: 0, zIndex: 1000, background: \"rgba(0,0,0,0.45)\", display: \"flex\", alignItems: \"center\", justifyContent: \"center\" }}>\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            {size && size.width > 0 && size.height > 0 && (\n              <HeatmapMiniMap {...miniMapProps} width={size.width} height={size.height} />\n            )}\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nexport default HeatmapMiniMapPopup;\n"],"names":["MINI_MAP_POPUP_WIDTH_VW","MINI_MAP_POPUP_HEIGHT_VH","MINI_MAP_POPUP_PADDING","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","observerRef","t3","Symbol","for","node","disconnect","observer","ResizeObserver","t4","entry","width","height","contentRect","Math","floor","observe","areaRef","position","inset","zIndex","background","display","alignItems","justifyContent","t5","t6","t7","boxSizing","flexDirection","border","borderRadius","boxShadow","overflow","flexShrink","padding","borderBottom","jsx","fontSize","fontWeight","color","t8","lineHeight","cursor","t9","t10","flex","minHeight","t11","t12","HeatmapMiniMap","t13","t14"],"mappings":"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"}

package/dist/visualization.es102.js

@@ -1,35 +1,86 @@
-import { jsx as u } from "react/jsx-runtime";
-import { c as S } from "react/compiler-runtime";
-import { getAnimationProps as T } from "./visualization.es29.js";
-import { getTrianglePoints as A } from "./visualization.es17.js";
-import { motion as W } from "./visualization.es32.js";
-const G = (k) => {
-  const o = S(19), {
-    pointData: g,
-    animation: e,
-    animationGroupSize: a,
-    animationBuffer: i,
-    xScaleTransformed: n,
-    yScaleTransformed: s,
-    boundedWidth: c,
-    boundedHeight: l
-  } = k;
-  let t;
-  if (o[0] !== e || o[1] !== i || o[2] !== a || o[3] !== l || o[4] !== c || o[5] !== g || o[6] !== n || o[7] !== s) {
-    let f;
-    o[9] !== e || o[10] !== i || o[11] !== a || o[12] !== l || o[13] !== c || o[14] !== n || o[15] !== s ? (f = (r, y) => {
-      const x = W.g, b = Math.floor(y / (a ?? 1)), P = T(e, b, i ?? 0.03), p = n(r.x), d = s(r.y);
-      if (p < 0 || p > c || d < 0 || d > l)
-        return null;
-      const h = r.r ?? 3;
-      return /* @__PURE__ */ u(x, { ...P, children: r.shape === "triangle" ? /* @__PURE__ */ u("polygon", { points: A(p, d, h), fill: r.color ?? "black", stroke: r.stroke, opacity: r.opacity ?? 1 }) : /* @__PURE__ */ u("circle", { cx: p, cy: d, r: h, fill: r.color ?? "black", stroke: r.stroke, opacity: r.opacity ?? 1 }) }, `pt-${y}`);
-    }, o[9] = e, o[10] = i, o[11] = a, o[12] = l, o[13] = c, o[14] = n, o[15] = s, o[16] = f) : f = o[16], t = g.map(f), o[0] = e, o[1] = i, o[2] = a, o[3] = l, o[4] = c, o[5] = g, o[6] = n, o[7] = s, o[8] = t;
-  } else
-    t = o[8];
-  let m;
-  return o[17] !== t ? (m = /* @__PURE__ */ u("g", { children: t }), o[17] = t, o[18] = m) : m = o[18], m;
-};
+import { useRef as T, useEffect as Y, useCallback as f, useState as y, useMemo as m } from "react";
+import { getVisibleRange as v, drawHeatmapCells as B, hitTestCell as w, buildBin as A } from "./visualization.es246.js";
+const g = 4;
+function O({
+  canvasCellParams: e,
+  viewportWidth: i,
+  viewportHeight: a,
+  xTickValues: b,
+  yTickValues: M,
+  isScrollable: G,
+  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), B(r, e, o, d.current);
+  }, [e, i, a]);
+  Y(() => {
+    c();
+  }, [G, c]);
+  const [p, x] = y({
+    left: 0,
+    top: 0
+  }), V = 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]), C = m(() => b.slice(s.colStart, s.colEnd + 1), [b, s.colStart, s.colEnd]), F = m(() => M.slice(s.rowStart, s.rowEnd + 1), [M, s.rowStart, s.rowEnd]), N = f(() => {
+    const t = l.current;
+    t && R.current == null && (R.current = requestAnimationFrame(() => {
+      R.current = null, c(), x({
+        left: t.scrollLeft,
+        top: t.scrollTop
+      });
+    }));
+  }, [c]), h = 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]), k = f((t) => {
+    t.currentTarget.style.cursor = "default", d.current && (d.current = null, c()), L.current?.hide();
+  }, [c]), q = 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: V,
+    handleGridScroll: N,
+    axisScrollPos: p,
+    visibleXTickValues: C,
+    visibleYTickValues: F,
+    canvasHandlers: {
+      onMouseMove: h,
+      onMouseLeave: k,
+      onClick: q
+    }
+  };
+}
 export {
-  G as default
+  O as useHeatmapCanvasGrid
 };
 //# sourceMappingURL=visualization.es102.js.map

package/dist/visualization.es102.js.map

@@ -1 +1 @@
-{"version":3,"file":"visualization.es102.js","sources":["../src/components/ScatterPlot/AnimatedPoints.tsx"],"sourcesContent":["import React from \"react\";\nimport { motion } from \"framer-motion\";\nimport { ScaleLinear } from \"@visx/vendor/d3-scale\";\nimport { AnimationType, getAnimationProps } from \"../../utility\";\nimport { Point } from \"./types\";\nimport { getTrianglePoints } from \"./helpers\";\n\ntype AnimatedPointsProps<T extends object> = {\n    pointData: Point<T>[];\n    animation: AnimationType;\n    animationGroupSize?: number;\n    animationBuffer?: number;\n    xScaleTransformed: ScaleLinear<number, number, never>;\n    yScaleTransformed: ScaleLinear<number, number, never>;\n    boundedWidth: number;\n    boundedHeight: number;\n};\n\nconst AnimatedPoints = <T extends object>({\n    pointData,\n    animation,\n    animationGroupSize,\n    animationBuffer,\n    xScaleTransformed,\n    yScaleTransformed,\n    boundedWidth,\n    boundedHeight,\n}: AnimatedPointsProps<T>) => (\n    <g>\n        {pointData.map((point, index) => {\n            const Wrapper = motion.g;\n            const groupIndex = Math.floor(index / (animationGroupSize ?? 1));\n            const animationProps = getAnimationProps(animation, groupIndex, animationBuffer ?? 0.03);\n            const cx = xScaleTransformed(point.x);\n            const cy = yScaleTransformed(point.y);\n            if (cx < 0 || cx > boundedWidth || cy < 0 || cy > boundedHeight) return null;\n            const radius = point.r ?? 3;\n            return (\n                <Wrapper key={`pt-${index}`} {...animationProps}>\n                    {point.shape === \"triangle\" ? (\n                        <polygon\n                            points={getTrianglePoints(cx, cy, radius)}\n                            fill={point.color ?? \"black\"}\n                            stroke={point.stroke}\n                            opacity={point.opacity ?? 1}\n                        />\n                    ) : (\n                        <circle\n                            cx={cx}\n                            cy={cy}\n                            r={radius}\n                            fill={point.color ?? \"black\"}\n                            stroke={point.stroke}\n                            opacity={point.opacity ?? 1}\n                        />\n                    )}\n                </Wrapper>\n            );\n        })}\n    </g>\n);\n\nexport default AnimatedPoints;\n"],"names":["AnimatedPoints","t0","$","_c","pointData","animation","animationGroupSize","animationBuffer","xScaleTransformed","yScaleTransformed","boundedWidth","boundedHeight","t1","t2","point","index","Wrapper","motion","g","groupIndex","Math","floor","animationProps","getAnimationProps","cx","x","cy","y","radius","r","jsx","shape","getTrianglePoints","color","stroke","opacity","map"],"mappings":";;;;;AAkBA,MAAMA,IAAiBC,CAAAA,MAAA;AAAA,QAAAC,IAAAC,EAAA,EAAA,GAAmB;AAAA,IAAAC,WAAAA;AAAAA,IAAAC,WAAAA;AAAAA,IAAAC,oBAAAA;AAAAA,IAAAC,iBAAAA;AAAAA,IAAAC,mBAAAA;AAAAA,IAAAC,mBAAAA;AAAAA,IAAAC,cAAAA;AAAAA,IAAAC,eAAAA;AAAAA,EAAAA,IAAAV;AASjB,MAAAW;AAAA,MAAAV,EAAA,CAAA,MAAAG,KAAAH,EAAA,CAAA,MAAAK,KAAAL,EAAA,CAAA,MAAAI,KAAAJ,EAAA,CAAA,MAAAS,KAAAT,EAAA,CAAA,MAAAQ,KAAAR,EAAA,CAAA,MAAAE,KAAAF,EAAA,CAAA,MAAAM,KAAAN,SAAAO,GAAA;AAAA,QAAAI;AAAA,IAAAX,EAAA,CAAA,MAAAG,KAAAH,EAAA,EAAA,MAAAK,KAAAL,EAAA,EAAA,MAAAI,KAAAJ,UAAAS,KAAAT,EAAA,EAAA,MAAAQ,KAAAR,EAAA,EAAA,MAAAM,KAAAN,EAAA,EAAA,MAAAO,KAEFI,IAAAA,CAAAC,GAAAC,MAAA;AACX,YAAAC,IAAgBC,EAAMC,GACtBC,IAAmBC,KAAIC,MAAON,KAAST,KAAA,EAAwB,GAC/DgB,IAAuBC,EAAkBlB,GAAWc,GAAYZ,KAAA,IAAuB,GACvFiB,IAAWhB,EAAkBM,EAAKW,CAAE,GACpCC,IAAWjB,EAAkBK,EAAKa,CAAE;AACpC,UAAIH,IAAK,KAAKA,IAAKd,KAAgBgB,IAAK,KAAKA,IAAKf;AAAa,eAAS;AACxE,YAAAiB,IAAed,EAAKe,KAAL;AAAa,aAExB,gBAAAC,EAACd,KAA0B,GAAMM,GAC5BR,YAAKiB,UAAW,4CAED,QAAAC,EAAkBR,GAAIE,GAAIE,CAAM,GAClC,MAAAd,EAAKmB,SAAL,SACE,QAAAnB,EAAKoB,QACJ,SAAApB,EAAKqB,WAAL,EAAA,CAAkB,IAG/B,gBAAAL,cACQN,IAAAA,GACAE,IAAAA,GACDE,MACG,MAAAd,EAAKmB,SAAL,SACE,QAAAnB,EAAKoB,QACJ,SAAApB,EAAKqB,WAAL,EAAA,CAAkB,EAAA,SAfnBpB,CAAK,EAkBzB;AAAA,IAAU,GAEjBb,OAAAG,GAAAH,QAAAK,GAAAL,QAAAI,GAAAJ,QAAAS,GAAAT,QAAAQ,GAAAR,QAAAM,GAAAN,QAAAO,GAAAP,QAAAW,KAAAA,IAAAX,EAAA,EAAA,GA7BAU,IAAAR,EAASgC,IAAKvB,CA6Bd,GAACX,OAAAG,GAAAH,OAAAK,GAAAL,OAAAI,GAAAJ,OAAAS,GAAAT,OAAAQ,GAAAR,OAAAE,GAAAF,OAAAM,GAAAN,OAAAO,GAAAP,OAAAU;AAAAA,EAAA;AAAAA,IAAAA,IAAAV,EAAA,CAAA;AAAA,MAAAW;AAAA,SAAAX,UAAAU,KA9BNC,6BACKD,UAAAA,EAAAA,CA8BL,GAAIV,QAAAU,GAAAV,QAAAW,KAAAA,IAAAX,EAAA,EAAA,GA/BJW;AA+BI;"}
+{"version":3,"file":"visualization.es102.js","sources":["../src/components/Heatmap/hooks/useHeatmapCanvasGrid.ts"],"sourcesContent":["import { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport type { HeatmapCellId } from \"../types\";\nimport type { AnyBin } from \"../HeatmapCells\";\nimport type { PlotTooltipHandle } from \"../../../tooltip\";\nimport { drawHeatmapCells, getVisibleRange, hitTestCell, buildBin, type CanvasCellParams } from \"../HeatmapCanvasCells\";\n\n// Extra rows/columns painted/rendered just beyond the visible viewport in scrollable mode, so a\n// cell or tick label is already there before it scrolls into view rather than popping in late.\nconst GRID_OVERSCAN_CELLS = 4;\n\nexport interface UseHeatmapCanvasGridArgs {\n  canvasCellParams: CanvasCellParams;\n  viewportWidth: number;\n  viewportHeight: number;\n  xTickValues: number[];\n  yTickValues: number[];\n  isScrollable: boolean;\n  onClick?: (bin: AnyBin) => void;\n}\n\nexport function useHeatmapCanvasGrid({\n  canvasCellParams, viewportWidth, viewportHeight, xTickValues, yTickValues, isScrollable, onClick,\n}: UseHeatmapCanvasGridArgs) {\n  // mainPaneRef is the only pane with a real native scrollbar - the cell canvas and the\n  // row/column tick-label panes all track its scroll position by reading it directly here\n  // (rAF-throttled), rather than being natively scrolled themselves: the canvas repaints\n  // imperatively (drawCanvas), and the tick label panes shift via a transform driven by\n  // axisScrollPos state - both cheaper than the pane actually scrolling 15,000px+ of real content.\n  const mainPaneRef = useRef<HTMLDivElement | null>(null);\n  const canvasRef = useRef<HTMLCanvasElement | null>(null);\n  const hoveredCellRef = useRef<HeatmapCellId | null>(null);\n  const canvasTooltipRef = useRef<PlotTooltipHandle<AnyBin>>(null);\n  const drawRafRef = useRef<number | null>(null);\n\n  useEffect(() => () => {\n    if (drawRafRef.current != null) cancelAnimationFrame(drawRafRef.current);\n  }, []);\n\n  // Imperative canvas paint - deliberately never routed through React state. Driven both by prop\n  // changes (the effect below) and by native scroll events (handleGridScroll), and it's the\n  // scroll case that matters: an earlier attempt at this drove the redraw through a React state\n  // update on every scroll frame, which forced React to reconcile on every frame and made\n  // scrolling *slower* than the plain (if huge) static SVG it replaced. Reading scroll position\n  // directly off the DOM and painting immediately keeps scrolling itself entirely on the\n  // browser's native, free compositor path - React is never involved.\n  const drawCanvas = useCallback(() => {\n    const canvas = canvasRef.current;\n    const main = mainPaneRef.current;\n    if (!canvas || !main) return;\n    const ctx = canvas.getContext(\"2d\");\n    if (!ctx) return;\n    const dpr = window.devicePixelRatio || 1;\n    ctx.setTransform(dpr, 0, 0, dpr, 0, 0);\n    ctx.clearRect(0, 0, viewportWidth, viewportHeight);\n    const range = getVisibleRange(canvasCellParams, main.scrollLeft, main.scrollTop, viewportWidth, viewportHeight, GRID_OVERSCAN_CELLS);\n    ctx.translate(-main.scrollLeft, -main.scrollTop);\n    drawHeatmapCells(ctx, canvasCellParams, range, hoveredCellRef.current);\n  }, [canvasCellParams, viewportWidth, viewportHeight]);\n\n  useEffect(() => {\n    if (isScrollable) drawCanvas();\n  }, [isScrollable, drawCanvas]);\n\n  const [axisScrollPos, setAxisScrollPos] = useState({ left: 0, top: 0 });\n  const setMainPaneNode = useCallback((node: HTMLDivElement | null) => {\n    mainPaneRef.current = node;\n    if (node) setAxisScrollPos({ left: node.scrollLeft, top: node.scrollTop });\n  }, []);\n\n  const axisVisibleRange = useMemo(\n    () => getVisibleRange(canvasCellParams, axisScrollPos.left, axisScrollPos.top, viewportWidth, viewportHeight, GRID_OVERSCAN_CELLS),\n    [canvasCellParams, axisScrollPos.left, axisScrollPos.top, viewportWidth, viewportHeight]\n  );\n  const visibleXTickValues = useMemo(\n    () => xTickValues.slice(axisVisibleRange.colStart, axisVisibleRange.colEnd + 1),\n    [xTickValues, axisVisibleRange.colStart, axisVisibleRange.colEnd]\n  );\n  const visibleYTickValues = useMemo(\n    () => yTickValues.slice(axisVisibleRange.rowStart, axisVisibleRange.rowEnd + 1),\n    [yTickValues, axisVisibleRange.rowStart, axisVisibleRange.rowEnd]\n  );\n\n  const handleGridScroll = useCallback(() => {\n    const main = mainPaneRef.current;\n    if (!main) return;\n    if (drawRafRef.current != null) return;\n    drawRafRef.current = requestAnimationFrame(() => {\n      drawRafRef.current = null;\n      drawCanvas();\n      setAxisScrollPos({ left: main.scrollLeft, top: main.scrollTop });\n    });\n  }, [drawCanvas]);\n\n  const handleCanvasMouseMove = useCallback((event: React.MouseEvent<HTMLCanvasElement>) => {\n    const main = mainPaneRef.current;\n    if (!main) return;\n    const contentX = event.nativeEvent.offsetX + main.scrollLeft;\n    const contentY = event.nativeEvent.offsetY + main.scrollTop;\n    const cell = hitTestCell(canvasCellParams, contentX, contentY);\n    // Matches the SVG path's heatmapCellStyles (`.visx-heatmap-cell { cursor: pointer }`):\n    // pointer over any real cell - including a null-count one, which still hit-tests true here,\n    // same as it still being a hit target there via `pointer-events: all` - not just where\n    // onClick is wired up, so hover-only tooltips still get the affordance.\n    event.currentTarget.style.cursor = cell ? \"pointer\" : \"default\";\n    const prev = hoveredCellRef.current;\n    if (prev?.row !== cell?.row || prev?.column !== cell?.column) {\n      hoveredCellRef.current = cell;\n      drawCanvas();\n    }\n    if (cell) {\n      const bin = buildBin(canvasCellParams, cell);\n      if (bin) canvasTooltipRef.current?.show(bin, event);\n    } else {\n      canvasTooltipRef.current?.hide();\n    }\n  }, [canvasCellParams, drawCanvas]);\n\n  const handleCanvasMouseLeave = useCallback((event: React.MouseEvent<HTMLCanvasElement>) => {\n    event.currentTarget.style.cursor = \"default\";\n    if (hoveredCellRef.current) {\n      hoveredCellRef.current = null;\n      drawCanvas();\n    }\n    canvasTooltipRef.current?.hide();\n  }, [drawCanvas]);\n\n  const handleCanvasClick = useCallback((event: React.MouseEvent<HTMLCanvasElement>) => {\n    const main = mainPaneRef.current;\n    if (!main || !onClick) return;\n    const contentX = event.nativeEvent.offsetX + main.scrollLeft;\n    const contentY = event.nativeEvent.offsetY + main.scrollTop;\n    const cell = hitTestCell(canvasCellParams, contentX, contentY);\n    if (!cell) return;\n    const bin = buildBin(canvasCellParams, cell);\n    if (bin) onClick(bin);\n  }, [canvasCellParams, onClick]);\n\n  return {\n    canvasRef, mainPaneRef, canvasTooltipRef, setMainPaneNode, handleGridScroll, axisScrollPos,\n    visibleXTickValues, visibleYTickValues,\n    canvasHandlers: {\n      onMouseMove: handleCanvasMouseMove,\n      onMouseLeave: handleCanvasMouseLeave,\n      onClick: handleCanvasClick,\n    },\n  };\n}\n"],"names":["GRID_OVERSCAN_CELLS","useHeatmapCanvasGrid","canvasCellParams","viewportWidth","viewportHeight","xTickValues","yTickValues","isScrollable","onClick","mainPaneRef","useRef","canvasRef","hoveredCellRef","canvasTooltipRef","drawRafRef","useEffect","current","cancelAnimationFrame","drawCanvas","useCallback","canvas","main","ctx","getContext","dpr","window","devicePixelRatio","setTransform","clearRect","range","getVisibleRange","scrollLeft","scrollTop","translate","drawHeatmapCells","axisScrollPos","setAxisScrollPos","useState","left","top","setMainPaneNode","node","axisVisibleRange","useMemo","visibleXTickValues","slice","colStart","colEnd","visibleYTickValues","rowStart","rowEnd","handleGridScroll","requestAnimationFrame","handleCanvasMouseMove","event","contentX","nativeEvent","offsetX","contentY","offsetY","cell","hitTestCell","currentTarget","style","cursor","prev","row","column","bin","buildBin","show","hide","handleCanvasMouseLeave","handleCanvasClick","canvasHandlers","onMouseMove","onMouseLeave"],"mappings":"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"}

package/dist/visualization.es103.js

@@ -1,48 +1,41 @@
-import { jsxs as E, jsx as b } from "react/jsx-runtime";
-import { c as $ } from "react/compiler-runtime";
-import v from "./visualization.es31.js";
-const H = (u) => {
-  const t = $(15), {
-    pointData: x,
-    xScaleTransformed: a,
-    yScaleTransformed: f,
-    boundedWidth: n,
-    boundedHeight: l,
-    margin: o
-  } = u;
-  if (!x.some(z))
-    return null;
-  const T = o.top, j = o.left;
-  let s;
-  if (t[0] !== l || t[1] !== n || t[2] !== x || t[3] !== a || t[4] !== f) {
-    let m;
-    t[6] !== l || t[7] !== n || t[8] !== a || t[9] !== f ? (m = (r, k) => {
-      if (!r.label)
-        return null;
-      const c = a(r.x), i = f(r.y);
-      if (c < 0 || c > n || i < 0 || i > l)
-        return null;
-      const p = r.label.length * 7, y = r.r ?? 3, g = Math.atan2(i - l / 2, c - n / 2);
-      let e = Math.cos(g), d = Math.sin(g);
-      const W = c + e * 15, A = e >= 0 ? W + 4 + p : W - 4 - p;
-      (A > n || A < 0) && (e = -e);
-      const M = i + d * 15;
-      (M < 0 || M > l) && (d = -d);
-      const R = c + e * 15, S = i + d * 15, w = e >= 0 ? "start" : "end";
-      return /* @__PURE__ */ E("g", { pointerEvents: "none", children: [
-        /* @__PURE__ */ b("line", { x1: c + e * y, y1: i + d * y, x2: R, y2: S, stroke: "#555", strokeWidth: 1 }),
-        /* @__PURE__ */ b("text", { x: R + (e >= 0 ? 4 : -4), y: S, textAnchor: w, dominantBaseline: "middle", fontSize: 11, fontWeight: "bold", fill: "#1c1917", children: r.label })
-      ] }, `lbl-${k}`);
-    }, t[6] = l, t[7] = n, t[8] = a, t[9] = f, t[10] = m) : m = t[10], s = x.map(m), t[0] = l, t[1] = n, t[2] = x, t[3] = a, t[4] = f, t[5] = s;
-  } else
-    s = t[5];
-  let h;
-  return t[11] !== o.left || t[12] !== o.top || t[13] !== s ? (h = /* @__PURE__ */ b(v, { top: T, left: j, children: s }), t[11] = o.left, t[12] = o.top, t[13] = s, t[14] = h) : h = t[14], h;
-};
-function z(u) {
-  return u.label;
+import { c as _ } from "react/compiler-runtime";
+import { useRef as v, useEffect as w } from "react";
+import { cellKey as S } from "./visualization.es98.js";
+function I(i, e, l, t) {
+  return t - l > e || l < i ? l : t > i + e ? t - e : i;
+}
+function O(i) {
+  const e = _(14), {
+    mainPaneRef: l,
+    selectedCells: t,
+    scrollToSelection: n,
+    isScrollable: c,
+    binWidth: o,
+    viewportWidth: s
+  } = i;
+  let r;
+  e[0] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (r = /* @__PURE__ */ new Set(), e[0] = r) : r = e[0];
+  const y = v(r);
+  let m;
+  e[1] !== o || e[2] !== c || e[3] !== l || e[4] !== n || e[5] !== t || e[6] !== s ? (m = () => {
+    const g = y.current, C = t ?? [], L = C.filter((f) => !g.has(S(f)));
+    y.current = new Set(C.map(S));
+    const a = l.current;
+    if (!n || !c || !a || L.length === 0)
+      return;
+    let h = 1 / 0, p = -1 / 0;
+    for (const f of L)
+      f.column < h && (h = f.column), f.column > p && (p = f.column);
+    const K = h * o, T = (p + 1) * o, R = I(a.scrollLeft, s, K, T);
+    R !== a.scrollLeft && a.scrollTo({
+      left: R,
+      behavior: "smooth"
+    });
+  }, e[1] = o, e[2] = c, e[3] = l, e[4] = n, e[5] = t, e[6] = s, e[7] = m) : m = e[7];
+  let u;
+  e[8] !== o || e[9] !== c || e[10] !== n || e[11] !== t || e[12] !== s ? (u = [t, n, c, o, s], e[8] = o, e[9] = c, e[10] = n, e[11] = t, e[12] = s, e[13] = u) : u = e[13], w(m, u);
 }
 export {
-  H as default
+  O as useScrollToSelection
 };
 //# sourceMappingURL=visualization.es103.js.map

package/dist/visualization.es103.js.map

@@ -1 +1 @@
-{"version":3,"file":"visualization.es103.js","sources":["../src/components/ScatterPlot/PointLabels.tsx"],"sourcesContent":["import React from \"react\";\nimport { Group } from \"@visx/group\";\nimport { ScaleLinear } from \"@visx/vendor/d3-scale\";\nimport { Point } from \"./types\";\n\ntype PointLabelsProps<T extends object> = {\n    pointData: Point<T>[];\n    xScaleTransformed: ScaleLinear<number, number, never>;\n    yScaleTransformed: ScaleLinear<number, number, never>;\n    boundedWidth: number;\n    boundedHeight: number;\n    margin: { top: number; left: number };\n};\n\nconst PointLabels = <T extends object>({\n    pointData,\n    xScaleTransformed,\n    yScaleTransformed,\n    boundedWidth,\n    boundedHeight,\n    margin,\n}: PointLabelsProps<T>) => {\n    if (!pointData.some(p => p.label)) return null;\n\n    return (\n        <Group top={margin.top} left={margin.left}>\n            {pointData.map((point, i) => {\n                if (!point.label) return null;\n                const cx = xScaleTransformed(point.x);\n                const cy = yScaleTransformed(point.y);\n                if (cx < 0 || cx > boundedWidth || cy < 0 || cy > boundedHeight) return null;\n\n                const lineLen = 15;\n                const estTextWidth = point.label.length * 7;\n                const circleR = (point.r ?? 3);\n                const angle = Math.atan2(cy - boundedHeight / 2, cx - boundedWidth / 2);\n                let cosA = Math.cos(angle);\n                let sinA = Math.sin(angle);\n\n                // Flip horizontal if text would overflow left/right\n                const lxRaw = cx + cosA * lineLen;\n                const textEndX = cosA >= 0 ? lxRaw + 4 + estTextWidth : lxRaw - 4 - estTextWidth;\n                if (textEndX > boundedWidth || textEndX < 0) cosA = -cosA;\n\n                // Flip vertical if line endpoint would overflow top/bottom\n                const lyRaw = cy + sinA * lineLen;\n                if (lyRaw < 0 || lyRaw > boundedHeight) sinA = -sinA;\n\n                const lx = cx + cosA * lineLen;\n                const ly = cy + sinA * lineLen;\n                const anchor = cosA >= 0 ? \"start\" : \"end\";\n\n                return (\n                    <g key={`lbl-${i}`} pointerEvents=\"none\">\n                        <line x1={cx + cosA * circleR} y1={cy + sinA * circleR} x2={lx} y2={ly} stroke=\"#555\" strokeWidth={1} />\n                        <text x={lx + (cosA >= 0 ? 4 : -4)} y={ly} textAnchor={anchor} dominantBaseline=\"middle\" fontSize={11} fontWeight=\"bold\" fill=\"#1c1917\">\n                            {point.label}\n                        </text>\n                    </g>\n                );\n            })}\n        </Group>\n    );\n};\n\nexport default PointLabels;\n"],"names":["PointLabels","t0","$","_c","pointData","xScaleTransformed","yScaleTransformed","boundedWidth","boundedHeight","margin","some","_temp","t1","top","t2","left","t3","t4","point","i","label","cx","x","cy","y","estTextWidth","length","circleR","r","angle","Math","atan2","cosA","cos","sinA","sin","lxRaw","textEndX","lyRaw","lx","ly","anchor","jsxs","jsx","map","Group","p"],"mappings":"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"}
+{"version":3,"file":"visualization.es103.js","sources":["../src/components/Heatmap/hooks/useScrollToSelection.ts"],"sourcesContent":["import { useEffect, useRef, type RefObject } from \"react\";\nimport type { HeatmapCellId } from \"../types\";\nimport { cellKey } from \"../heatmapCellAppearance\";\n\n// Minimal scroll offset (along one axis) that brings [boxStart, boxEnd) fully into\n// [current, current+viewportSize) - unchanged if it's already fully visible, and aligned to\n// boxStart if the box itself is bigger than the viewport (can't fit all of it either way).\n// Mirrors Element.scrollIntoView({ block: \"nearest\" })'s semantics.\nfunction nearestScrollOffset(current: number, viewportSize: number, boxStart: number, boxEnd: number): number {\n  if (boxEnd - boxStart > viewportSize) return boxStart;\n  if (boxStart < current) return boxStart;\n  if (boxEnd > current + viewportSize) return boxEnd - viewportSize;\n  return current;\n}\n\nexport interface UseScrollToSelectionArgs {\n  mainPaneRef: RefObject<HTMLDivElement | null>;\n  selectedCells?: HeatmapCellId[];\n  scrollToSelection?: boolean;\n  isScrollable: boolean;\n  binWidth: number;\n  viewportWidth: number;\n}\n\n// Auto-scrolls to reveal newly-selected cells\nexport function useScrollToSelection({\n  mainPaneRef, selectedCells, scrollToSelection, isScrollable, binWidth, viewportWidth,\n}: UseScrollToSelectionArgs) {\n  const previousSelectionKeysRef = useRef<Set<string>>(new Set());\n\n  useEffect(() => {\n    const previousKeys = previousSelectionKeysRef.current;\n    const cells = selectedCells ?? [];\n    const newCells = cells.filter((cell) => !previousKeys.has(cellKey(cell)));\n    previousSelectionKeysRef.current = new Set(cells.map(cellKey));\n\n    const main = mainPaneRef.current;\n    if (!scrollToSelection || !isScrollable || !main || newCells.length === 0) return;\n\n    let minCol = Infinity, maxCol = -Infinity;\n    for (const cell of newCells) {\n      if (cell.column < minCol) minCol = cell.column;\n      if (cell.column > maxCol) maxCol = cell.column;\n    }\n\n    const boxLeft = minCol * binWidth;\n    const boxRight = (maxCol + 1) * binWidth;\n\n    const targetLeft = nearestScrollOffset(main.scrollLeft, viewportWidth, boxLeft, boxRight);\n    if (targetLeft !== main.scrollLeft) {\n      main.scrollTo({ left: targetLeft, behavior: \"smooth\" });\n    }\n  }, [selectedCells, scrollToSelection, isScrollable, binWidth, viewportWidth]);\n}\n"],"names":["nearestScrollOffset","current","viewportSize","boxStart","boxEnd","useScrollToSelection","t0","$","_c","mainPaneRef","selectedCells","scrollToSelection","isScrollable","binWidth","viewportWidth","t1","Symbol","for","Set","previousSelectionKeysRef","useRef","t2","previousKeys","cells","newCells","filter","cell","has","cellKey","map","main","length","minCol","Infinity","maxCol","cell_0","column","boxLeft","boxRight","targetLeft","scrollLeft","scrollTo","left","behavior","t3","useEffect"],"mappings":";;;AAQA,SAASA,EAAoBC,GAAiBC,GAAsBC,GAAkBC,GAAwB;AAE5G,SADIA,IAASD,IAAWD,KACpBC,IAAWF,IAAgBE,IAC3BC,IAASH,IAAUC,IAAqBE,IAASF,IAC9CD;AACT;AAYO,SAAAI,EAAAC,GAAA;AAAA,QAAAC,IAAAC,EAAA,EAAA,GAA8B;AAAA,IAAAC,aAAAA;AAAAA,IAAAC,eAAAA;AAAAA,IAAAC,mBAAAA;AAAAA,IAAAC,cAAAA;AAAAA,IAAAC,UAAAA;AAAAA,IAAAC,eAAAA;AAAAA,EAAAA,IAAAR;AAEV,MAAAS;AAAA,EAAAR,EAAA,CAAA,MAAAS,uBAAAC,IAAA,2BAAA,KAC4BF,wBAAIG,IAAAA,GAAKX,OAAAQ,KAAAA,IAAAR,EAAA,CAAA;AAA9D,QAAAY,IAAiCC,EAAoBL,CAAS;AAAE,MAAAM;AAAA,EAAAd,SAAAM,KAAAN,EAAA,CAAA,MAAAK,KAAAL,EAAA,CAAA,MAAAE,KAAAF,EAAA,CAAA,MAAAI,KAAAJ,SAAAG,KAAAH,EAAA,CAAA,MAAAO,KAEtDO,IAAAA,MAAA;AACR,UAAAC,IAAqBH,EAAwBlB,SAC7CsB,IAAcb,KAAA,CAAA,GACdc,IAAiBD,EAAKE,OAAQC,CAAAA,MAAU,CAACJ,EAAYK,IAAKC,EAAQF,CAAI,CAAC,CAAC;AACxEP,IAAAA,EAAwBlB,UAAW,IAAIiB,IAAIK,EAAKM,IAAKD,CAAO,CAAC;AAE7D,UAAAE,IAAarB,EAAWR;AACxB,QAAI,CAACU,KAAD,CAAuBC,KAAvB,CAAwCkB,KAAQN,EAAQO,WAAY;AAAC;AAEzE,QAAAC,IAAaC,OAAbC,IAAgC;AAChC,eAAKC,KAAcX;AACjB,MAAIE,EAAIU,SAAUJ,MAAQA,IAASN,EAAIU,SACnCV,EAAIU,SAAUF,MAAQA,IAASR,EAAIU;AAGzC,UAAAC,IAAgBL,IAASnB,GACzByB,KAAkBJ,IAAS,KAAKrB,GAEhC0B,IAAmBvC,EAAoB8B,EAAIU,YAAa1B,GAAeuB,GAASC,CAAQ;AACxF,IAAIC,MAAeT,EAAIU,cACrBV,EAAIW,SAAU;AAAA,MAAAC,MAAQH;AAAAA,MAAUI,UAAY;AAAA,IAAA,CAAU;AAAA,EACvD,GACFpC,OAAAM,GAAAN,OAAAK,GAAAL,OAAAE,GAAAF,OAAAI,GAAAJ,OAAAG,GAAAH,OAAAO,GAAAP,OAAAc,KAAAA,IAAAd,EAAA,CAAA;AAAA,MAAAqC;AAAA,EAAArC,EAAA,CAAA,MAAAM,KAAAN,EAAA,CAAA,MAAAK,KAAAL,EAAA,EAAA,MAAAI,KAAAJ,EAAA,EAAA,MAAAG,KAAAH,UAAAO,KAAE8B,IAAA,CAAClC,GAAeC,GAAmBC,GAAcC,GAAUC,CAAa,GAACP,OAAAM,GAAAN,OAAAK,GAAAL,QAAAI,GAAAJ,QAAAG,GAAAH,QAAAO,GAAAP,QAAAqC,KAAAA,IAAArC,EAAA,EAAA,GAtB5EsC,EAAUxB,GAsBPuB,CAAyE;AAAC;"}