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

package/dist/visualization.es98.js.map

@@ -1 +1 @@
-{"version":3,"file":"visualization.es98.js","sources":["../src/components/Heatmap/heatmapCellAppearance.ts"],"sourcesContent":["import { scaleLinear } from \"@visx/scale\";\n\n/** A cell outside highlightRange: faint enough that the cells inside it carry the grid. */\nexport const DIMMED_OPACITY = 0.12;\nconst NULL_VALUE_COLOR = \"none\";\n\nexport function getHeatmapColorScale(colors: [string, string, ...string[]], domain: [number, number]) {\n  const [minValue, maxValue] = domain;\n  return scaleLinear<string>({\n    range: colors,\n    domain: colors.map((_, i) => minValue + (i * (maxValue - minValue)) / (colors.length - 1)),\n    // Held at the end colors rather than extrapolated past them, which interpolates the RGB channels\n    // out of range into colors that aren't on the gradient at all.\n    clamp: true,\n  });\n}\n\n/** Whether a count falls outside highlightRange, and so fades. Nothing fades without a range. */\nexport const isOutsideRange = (count: number | null | undefined, range: [number, number] | null | undefined) =>\n  !!range && count != null && (count < range[0] || count > range[1]);\n\n/**\n * A cell's fill, shared by the SVG and canvas renderers so they can't drift apart. Selection isn't\n * part of it: selected cells are framed instead (see heatmapSelection.ts).\n */\nexport function resolveCellAppearance(\n  count: number | null | undefined,\n  color: string | undefined,\n  isDimmed = false\n): { fill: string; fillOpacity: number } {\n  const isNullValue = count == null;\n  return {\n    fill: isNullValue || color === undefined ? NULL_VALUE_COLOR : color,\n    fillOpacity: isNullValue ? 0 : isDimmed ? DIMMED_OPACITY : 1,\n  };\n}\n"],"names":["DIMMED_OPACITY","NULL_VALUE_COLOR","getHeatmapColorScale","colors","domain","minValue","maxValue","scaleLinear","range","map","_","i","length","clamp","isOutsideRange","count","resolveCellAppearance","color","isDimmed","isNullValue","fill","undefined","fillOpacity"],"mappings":";AAGO,MAAMA,IAAiB,MACxBC,IAAmB;AAElB,SAASC,EAAqBC,GAAuCC,GAA0B;AACpG,QAAM,CAACC,GAAUC,CAAQ,IAAIF;AAC7B,SAAOG,EAAoB;AAAA,IACzBC,OAAOL;AAAAA,IACPC,QAAQD,EAAOM,IAAI,CAACC,GAAGC,MAAMN,IAAYM,KAAKL,IAAWD,MAAcF,EAAOS,SAAS,EAAE;AAAA;AAAA;AAAA,IAGzFC,OAAO;AAAA,EAAA,CACR;AACH;AAGO,MAAMC,IAAiBA,CAACC,GAAkCP,MAC/D,CAAC,CAACA,KAASO,KAAS,SAASA,IAAQP,EAAM,CAAC,KAAKO,IAAQP,EAAM,CAAC;AAM3D,SAASQ,EACdD,GACAE,GACAC,IAAW,IAC4B;AACvC,QAAMC,IAAcJ,KAAS;AAC7B,SAAO;AAAA,IACLK,MAAMD,KAAeF,MAAUI,SAAYpB,IAAmBgB;AAAAA,IAC9DK,aAAaH,IAAc,IAAID,IAAWlB,IAAiB;AAAA,EAAA;AAE/D;"}
+{"version":3,"file":"visualization.es98.js","sources":["../../../node_modules/.pnpm/motion-utils@12.36.0/node_modules/motion-utils/dist/es/easing/ease.mjs"],"sourcesContent":["import { cubicBezier } from './cubic-bezier.mjs';\n\nconst easeIn = /*@__PURE__*/ cubicBezier(0.42, 0, 1, 1);\nconst easeOut = /*@__PURE__*/ cubicBezier(0, 0, 0.58, 1);\nconst easeInOut = /*@__PURE__*/ cubicBezier(0.42, 0, 0.58, 1);\n\nexport { easeIn, easeInOut, easeOut };\n//# sourceMappingURL=ease.mjs.map\n"],"names":["easeIn","cubicBezier","easeOut","easeInOut"],"mappings":";AAEK,MAACA,IAAuB,gBAAAC,EAAY,MAAM,GAAG,GAAG,CAAC,GAChDC,IAAwB,gBAAAD,EAAY,GAAG,GAAG,MAAM,CAAC,GACjDE,IAA0B,gBAAAF,EAAY,MAAM,GAAG,MAAM,CAAC;","x_google_ignoreList":[0]}

package/dist/visualization.es99.js

@@ -1,87 +1,35 @@
-const d = "#1a1c1e", C = "#ffffff";
-const x = (n) => `${n.row}-${n.column}`, y = (n) => {
-  const [f, r] = n.split("-").map(Number);
-  return {
-    row: f,
-    column: r
-  };
+import { jsx as u } from "react/jsx-runtime";
+import { c as A } from "react/compiler-runtime";
+import { getAnimationProps as T } from "./visualization.es24.js";
+import { getShapePoints as W } from "./visualization.es18.js";
+import { motion as $ } from "./visualization.es29.js";
+const H = (x) => {
+  const o = A(19), {
+    pointData: h,
+    animation: e,
+    animationGroupSize: a,
+    animationBuffer: s,
+    xScaleTransformed: i,
+    yScaleTransformed: n,
+    boundedWidth: c,
+    boundedHeight: l
+  } = x;
+  let r;
+  if (o[0] !== e || o[1] !== s || o[2] !== a || o[3] !== l || o[4] !== c || o[5] !== h || o[6] !== i || o[7] !== n) {
+    let f;
+    o[9] !== e || o[10] !== s || o[11] !== a || o[12] !== l || o[13] !== c || o[14] !== i || o[15] !== n ? (f = (t, y) => {
+      const P = $.g, b = Math.floor(y / (a ?? 1)), S = T(e, b, s ?? 0.03), p = i(t.x), d = n(t.y);
+      if (p < 0 || p > c || d < 0 || d > l)
+        return null;
+      const g = t.r ?? 3, k = W(t.shape, p, d, g);
+      return /* @__PURE__ */ u(P, { ...S, children: k ? /* @__PURE__ */ u("polygon", { points: k, fill: t.color ?? "black", stroke: t.stroke, opacity: t.opacity ?? 1 }) : /* @__PURE__ */ u("circle", { cx: p, cy: d, r: g, fill: t.color ?? "black", stroke: t.stroke, opacity: t.opacity ?? 1 }) }, `pt-${y}`);
+    }, o[9] = e, o[10] = s, o[11] = a, o[12] = l, o[13] = c, o[14] = i, o[15] = n, o[16] = f) : f = o[16], r = h.map(f), o[0] = e, o[1] = s, o[2] = a, o[3] = l, o[4] = c, o[5] = h, o[6] = i, o[7] = n, o[8] = r;
+  } else
+    r = o[8];
+  let m;
+  return o[17] !== r ? (m = /* @__PURE__ */ u("g", { children: r }), o[17] = r, o[18] = m) : m = o[18], m;
 };
-function* $(n, {
-  colStart: f,
-  colEnd: r,
-  rowStart: i,
-  rowEnd: H
-}) {
-  if ((r - f + 1) * (H - i + 1) <= n.size) {
-    for (let t = f; t <= r; t++) for (let o = i; o <= H; o++) n.has(x({
-      row: o,
-      column: t
-    })) && (yield {
-      row: o,
-      column: t
-    });
-    return;
-  }
-  for (const t of n) {
-    const o = y(t);
-    o.column >= f && o.column <= r && o.row >= i && o.row <= H && (yield o);
-  }
-}
-function v(n, f, r, i) {
-  const {
-    xScale: H,
-    cellYScale: t,
-    binWidth: o,
-    binHeight: E,
-    gap: e
-  } = r, c = (s, l) => n.has(x({
-    row: s,
-    column: l
-  })), u = [], R = [], _ = (s, l, A, a, M, m) => s.push({
-    x: A,
-    y: a,
-    width: M,
-    height: m,
-    fill: l
-  });
-  for (const {
-    row: s,
-    column: l
-  } of f) {
-    if (!c(s, l)) continue;
-    const A = H(l), a = A + o - e, M = t(s) + e, m = t(s) + E, I = A - 2 < 0 ? A + 2 : A, O = a + 2 > i.width ? a - 2 : a, T = M - 2 < 0 ? M + 2 : M, h = m + 2 > i.height ? m - 2 : m, w = c(s + 1, l), S = c(s - 1, l), F = c(s, l - 1), N = c(s, l + 1), D = (k) => k ? e : 2, W = (k) => k ? e : 0, p = [I - D(F), O - I + D(F) + D(N)], L = [T - D(w), h - T + D(w) + D(S)], g = [I - W(F), O - I + W(F) + W(N)], b = [T - W(w), h - T + W(w) + W(S)];
-    w || (_(u, d, p[0], T - 2, p[1], 2), _(R, C, g[0], T, g[1], 1)), S || (_(u, d, p[0], h, p[1], 2), _(R, C, g[0], h - 1, g[1], 1)), F || (_(u, d, I - 2, L[0], 2, L[1]), _(R, C, I, b[0], 1, b[1])), N || (_(u, d, O, L[0], 2, L[1]), _(R, C, O - 1, b[0], 1, b[1]));
-  }
-  return [...u, ...R];
-}
-const z = {
-  columns: /* @__PURE__ */ new Set(),
-  rows: /* @__PURE__ */ new Set()
-};
-function B(n, f, r) {
-  if (!n?.size) return z;
-  const i = [...n].map(y), H = /* @__PURE__ */ new Map(), t = /* @__PURE__ */ new Map();
-  for (const {
-    row: e,
-    column: c
-  } of i)
-    H.set(c, (H.get(c) ?? 0) + 1), t.set(e, (t.get(e) ?? 0) + 1);
-  const o = /* @__PURE__ */ new Set(), E = /* @__PURE__ */ new Set();
-  for (const {
-    row: e,
-    column: c
-  } of i)
-    (t.get(e) ?? 0) < f && o.add(c), (H.get(c) ?? 0) < r && E.add(e);
-  return {
-    columns: o,
-    rows: E
-  };
-}
 export {
-  d as SELECTION_COLOR,
-  x as cellKey,
-  $ as selectedCellsIn,
-  v as selectionFrame,
-  B as selectionMarks
+  H as default
 };
 //# sourceMappingURL=visualization.es99.js.map

package/dist/visualization.es99.js.map

@@ -1 +1 @@
-{"version":3,"file":"visualization.es99.js","sources":["../src/components/Heatmap/heatmapSelection.ts"],"sourcesContent":["/**\n * How a selection shows: a frame around the selected cells, and marks on the axes and minimap for\n * the columns and rows holding them. Cells keep their own colors, so the rest of the grid can\n * still be read for what to select next.\n */\n\nimport type { HeatmapCellId } from \"./types\";\n\n/** The frame's dark line, and the white one just inside it that holds it against a dark cell. */\nexport const SELECTION_COLOR = \"#1a1c1e\";\nconst HALO_COLOR = \"#ffffff\";\n/** Laid outside the selected cells: at the default gap of 2 it fills the gap and covers no cell. */\nconst FRAME_WIDTH = 2;\nconst HALO_WIDTH = 1;\n\nexport type SelectionBand = { x: number; y: number; width: number; height: number; fill: string };\n\ntype FrameGeometry = {\n  xScale: (column: number) => number;\n  cellYScale: (row: number) => number;\n  binWidth: number;\n  binHeight: number;\n  gap: number;\n};\n\ntype GridBounds = { width: number; height: number };\n\nexport const cellKey = (cell: HeatmapCellId) => `${cell.row}-${cell.column}`;\n\nconst parseKey = (key: string): HeatmapCellId => {\n  const [row, column] = key.split(\"-\").map(Number);\n  return { row, column };\n};\n\n/** The selected cells within a block, walking whichever of the block and the selection is smaller. */\nexport function* selectedCellsIn(\n  selectedKeys: Set<string>,\n  { colStart, colEnd, rowStart, rowEnd }: { colStart: number; colEnd: number; rowStart: number; rowEnd: number }\n): Generator<HeatmapCellId> {\n  if ((colEnd - colStart + 1) * (rowEnd - rowStart + 1) <= selectedKeys.size) {\n    for (let column = colStart; column <= colEnd; column++)\n      for (let row = rowStart; row <= rowEnd; row++) if (selectedKeys.has(cellKey({ row, column }))) yield { row, column };\n    return;\n  }\n  for (const key of selectedKeys) {\n    const cell = parseKey(key);\n    if (cell.column >= colStart && cell.column <= colEnd && cell.row >= rowStart && cell.row <= rowEnd) yield cell;\n  }\n}\n\n/**\n * The frame around the selected cells among `cells`, as rectangles to fill in order: a dark band\n * outside each edge not shared with another selected cell, then a white line just inside it.\n * Adjacent selected cells share one frame, so a selected column is one tall box.\n */\nexport function selectionFrame(\n  selectedKeys: Set<string>,\n  cells: Iterable<HeatmapCellId>,\n  geometry: FrameGeometry,\n  bounds: GridBounds\n): SelectionBand[] {\n  const { xScale, cellYScale, binWidth, binHeight, gap } = geometry;\n  const isSelected = (row: number, column: number) => selectedKeys.has(cellKey({ row, column }));\n  const dark: SelectionBand[] = [];\n  const halo: SelectionBand[] = [];\n  const band = (into: SelectionBand[], fill: string, x: number, y: number, width: number, height: number) =>\n    into.push({ x, y, width, height, fill });\n\n  for (const { row, column } of cells) {\n    if (!isSelected(row, column)) continue;\n    // The cell as drawn, with its gap to its right and above it (see getCellGeometry).\n    const cellLeft = xScale(column);\n    const cellRight = cellLeft + binWidth - gap;\n    const cellTop = cellYScale(row) + gap;\n    const cellBottom = cellYScale(row) + binHeight;\n    // The cell, pulled in wherever the line outside it would fall past the grid's edge.\n    const left = cellLeft - FRAME_WIDTH < 0 ? cellLeft + FRAME_WIDTH : cellLeft;\n    const right = cellRight + FRAME_WIDTH > bounds.width ? cellRight - FRAME_WIDTH : cellRight;\n    const top = cellTop - FRAME_WIDTH < 0 ? cellTop + FRAME_WIDTH : cellTop;\n    const bottom = cellBottom + FRAME_WIDTH > bounds.height ? cellBottom - FRAME_WIDTH : cellBottom;\n    // Row 0 is at the bottom of the grid, so the row above is row + 1.\n    const above = isSelected(row + 1, column);\n    const below = isSelected(row - 1, column);\n    const before = isSelected(row, column - 1);\n    const after = isSelected(row, column + 1);\n    // How far an edge's line runs past the box: across the gap to a selected neighbor, or round\n    // the corner where there is none.\n    const reach = (selected: boolean) => (selected ? gap : FRAME_WIDTH);\n    const bridge = (selected: boolean) => (selected ? gap : 0);\n    const across = [left - reach(before), right - left + reach(before) + reach(after)] as const;\n    const down = [top - reach(above), bottom - top + reach(above) + reach(below)] as const;\n    const haloAcross = [left - bridge(before), right - left + bridge(before) + bridge(after)] as const;\n    const haloDown = [top - bridge(above), bottom - top + bridge(above) + bridge(below)] as const;\n\n    if (!above) {\n      band(dark, SELECTION_COLOR, across[0], top - FRAME_WIDTH, across[1], FRAME_WIDTH);\n      band(halo, HALO_COLOR, haloAcross[0], top, haloAcross[1], HALO_WIDTH);\n    }\n    if (!below) {\n      band(dark, SELECTION_COLOR, across[0], bottom, across[1], FRAME_WIDTH);\n      band(halo, HALO_COLOR, haloAcross[0], bottom - HALO_WIDTH, haloAcross[1], HALO_WIDTH);\n    }\n    if (!before) {\n      band(dark, SELECTION_COLOR, left - FRAME_WIDTH, down[0], FRAME_WIDTH, down[1]);\n      band(halo, HALO_COLOR, left, haloDown[0], HALO_WIDTH, haloDown[1]);\n    }\n    if (!after) {\n      band(dark, SELECTION_COLOR, right, down[0], FRAME_WIDTH, down[1]);\n      band(halo, HALO_COLOR, right - HALO_WIDTH, haloDown[0], HALO_WIDTH, haloDown[1]);\n    }\n  }\n  return [...dark, ...halo];\n}\n\n/** The columns and rows the axes and minimap mark as holding the selection. */\nexport type SelectionMarks = { columns: Set<number>; rows: Set<number> };\n\nconst NO_SELECTION_MARKS: SelectionMarks = { columns: new Set(), rows: new Set() };\n\n/**\n * Which columns and rows to mark. A column is marked for a selected cell whose row isn't fully\n * selected, and a row for one whose column isn't: a whole selected column marks only its column,\n * and a single cell marks both.\n */\nexport function selectionMarks(selectedKeys: Set<string> | null, numColumns: number, numRows: number): SelectionMarks {\n  if (!selectedKeys?.size) return NO_SELECTION_MARKS;\n  const cells = [...selectedKeys].map(parseKey);\n  const perColumn = new Map<number, number>();\n  const perRow = new Map<number, number>();\n  for (const { row, column } of cells) {\n    perColumn.set(column, (perColumn.get(column) ?? 0) + 1);\n    perRow.set(row, (perRow.get(row) ?? 0) + 1);\n  }\n  const columns = new Set<number>();\n  const rows = new Set<number>();\n  for (const { row, column } of cells) {\n    if ((perRow.get(row) ?? 0) < numColumns) columns.add(column);\n    if ((perColumn.get(column) ?? 0) < numRows) rows.add(row);\n  }\n  return { columns, rows };\n}\n"],"names":["SELECTION_COLOR","HALO_COLOR","cellKey","cell","row","column","parseKey","key","split","map","Number","selectedCellsIn","selectedKeys","colStart","colEnd","rowStart","rowEnd","size","has","selectionFrame","cells","geometry","bounds","xScale","cellYScale","binWidth","binHeight","gap","isSelected","dark","halo","band","into","fill","x","y","width","height","push","cellLeft","cellRight","cellTop","cellBottom","left","FRAME_WIDTH","right","top","bottom","above","below","before","after","reach","selected","bridge","across","down","haloAcross","haloDown","HALO_WIDTH","NO_SELECTION_MARKS","columns","Set","rows","selectionMarks","numColumns","numRows","perColumn","Map","perRow","set","get","add"],"mappings":"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"}
+{"version":3,"file":"visualization.es99.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 { getShapePoints } 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            // The same vertices the canvas renderer draws from, so a point does not change shape\n            // or size as the entry animation hands over to the canvas.\n            const shapePoints = getShapePoints(point.shape, cx, cy, radius);\n            return (\n                <Wrapper key={`pt-${index}`} {...animationProps}>\n                    {shapePoints ? (\n                        <polygon\n                            points={shapePoints}\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","shapePoints","getShapePoints","shape","jsx","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,GAGfC,IAAoBC,EAAejB,EAAKkB,OAAQR,GAAIE,GAAIE,CAAM;AAAE,+BAE3DZ,GAAA,EAA0B,GAAMM,GAC5BQ,UAAAA,IACG,gBAAAG,EAAA,aACYH,QAAAA,GACF,MAAAhB,EAAKoB,SAAL,SACE,QAAApB,EAAKqB,QACJ,SAAArB,EAAKsB,WAAL,EAAA,KAGb,gBAAAH,EAAA,YACQT,IAAAA,GACAE,IAAAA,GACDE,MACG,MAAAd,EAAKoB,SAAL,SACE,QAAApB,EAAKqB,QACJ,SAAArB,EAAKsB,WAAL,GAAkB,EAAA,GAfzB,MAAMrB,CAAK,EAkBzB;AAAA,IAAU,GAEjBb,OAAAG,GAAAH,QAAAK,GAAAL,QAAAI,GAAAJ,QAAAS,GAAAT,QAAAQ,GAAAR,QAAAM,GAAAN,QAAAO,GAAAP,QAAAW,KAAAA,IAAAX,EAAA,EAAA,GAhCAU,IAAAR,EAASiC,IAAKxB,CAgCd,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,KAjCNC,6BACKD,UAAAA,EAAAA,CAiCL,GAAIV,QAAAU,GAAAV,QAAAW,KAAAA,IAAAX,EAAA,EAAA,GAlCJW;AAkCI;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@weng-lab/visualization",
-  "version": "2.6.0-beta.0",
+  "version": "2.6.0-beta.1",
   "description": "Visualization components for the Weng/Moore Labs suite of genomics web resources",
   "type": "module",
   "module": "dist/visualization.es.js",

package/dist/visualization.es46.js

@@ -1,148 +0,0 @@
-import { jsxs as L, Fragment as I, jsx as h } from "react/jsx-runtime";
-import { createRoot as P } from "react-dom/client";
-import { flushSync as O } from "react-dom";
-import { downloadBlob as V, MAX_CANVAS_EXPORT_DIMENSION as y, MAX_CANVAS_EXPORT_PIXELS as F } from "./visualization.es23.js";
-import { LEGEND_GAP as U, xAxisTitleCenter as X } from "./visualization.es45.js";
-import { markTickLabels as T, yAxisTickLabelProps as B, AXIS_TITLE_FONT_SIZE as G, TICK_FONT_FAMILY as H } from "./visualization.es44.js";
-import { drawHeatmapCells as j } from "./visualization.es100.js";
-import k from "./visualization.es101.js";
-import D from "./visualization.es35.js";
-import $ from "./visualization.es34.js";
-const S = "http://www.w3.org/2000/svg", z = "http://www.w3.org/1999/xlink", C = (e, o, n, t, i) => {
-  const r = document.createElementNS(S, "text");
-  r.setAttribute("x", String(n)), r.setAttribute("y", String(t)), i && r.setAttribute("transform", `rotate(-90, ${n}, ${t})`), r.setAttribute("text-anchor", "middle"), r.setAttribute("dominant-baseline", "middle"), r.setAttribute("font-size", String(G)), r.setAttribute("font-family", H), r.textContent = o, e.appendChild(r);
-}, v = (e, o, n, t) => {
-  const i = document.createElementNS(S, "g");
-  i.setAttribute("transform", `translate(${n},${t})`), o.childNodes.forEach((r) => i.appendChild(r.cloneNode(!0))), e.appendChild(i);
-};
-function E(e, o) {
-  const n = window.devicePixelRatio || 2;
-  return Math.min(n, y / e, y / o, Math.sqrt(F / (e * o)));
-}
-function N(e, o) {
-  const {
-    xMax: n,
-    yMax: t,
-    canvasCellParams: i,
-    numRows: r
-  } = e.layout;
-  if (n <= 0 || t <= 0) return null;
-  const a = document.createElement("canvas");
-  a.width = Math.max(1, Math.round(n * o)), a.height = Math.max(1, Math.round(t * o));
-  const s = a.getContext("2d");
-  if (!s) return null;
-  s.setTransform(o, 0, 0, o, 0, 0);
-  const c = {
-    colStart: 0,
-    colEnd: Math.max(0, e.data.length - 1),
-    rowStart: 0,
-    rowEnd: Math.max(0, r - 1)
-  };
-  return j(s, {
-    ...i,
-    highlightRange: null
-  }, c, null), a;
-}
-function W(e) {
-  const {
-    xMax: o,
-    yMax: n
-  } = e.layout;
-  if (o <= 0 || n <= 0) return null;
-  const t = N(e, E(o, n));
-  return t ? t.toDataURL("image/png") : null;
-}
-const K = (e, o, n, t, i, r) => {
-  const a = document.createElementNS(S, "image");
-  a.setAttribute("x", String(n)), a.setAttribute("y", String(t)), a.setAttribute("width", String(i)), a.setAttribute("height", String(r)), a.setAttribute("preserveAspectRatio", "none"), a.setAttributeNS(z, "href", o), a.setAttribute("href", o), e.appendChild(a);
-};
-function R(e, {
-  includeCells: o = !0
-} = {}) {
-  const {
-    layout: n
-  } = e, {
-    marg: t,
-    xMax: i,
-    yMax: r,
-    xScale: a,
-    yScale: s,
-    numRows: c,
-    xTickValues: g,
-    yTickValues: x,
-    yTickLabelWidth: p,
-    xTickLabelHeight: f,
-    yTitleWidth: b,
-    xTitleHeight: A,
-    selectionMarks: m
-  } = n, l = document.createElementNS(S, "svg");
-  if (l.setAttribute("width", String(t.left + i + t.right)), l.setAttribute("height", String(t.top + r + t.bottom)), o) {
-    const u = W(e);
-    u && K(l, u, t.left, t.top, i, r);
-  }
-  let d = null, w = null;
-  const _ = document.createElement("div"), M = P(_);
-  if (O(() => {
-    M.render(/* @__PURE__ */ L(I, { children: [
-      /* @__PURE__ */ h("svg", { width: p, height: r, ref: (u) => {
-        d = u;
-      }, children: /* @__PURE__ */ L("g", { transform: `translate(${p},0)`, children: [
-        /* @__PURE__ */ h(D, { scale: s, numTicks: c, tickValues: x, tickFormat: e.yAxisTickFormat, tickLabelProps: T(B, m.rows) }),
-        /* @__PURE__ */ h(k, { axis: "row", marked: m.rows, scale: s })
-      ] }) }),
-      /* @__PURE__ */ L("svg", { width: i, height: f, ref: (u) => {
-        w = u;
-      }, children: [
-        /* @__PURE__ */ h($, { top: 0, scale: a, numTicks: e.data.length, tickFormat: e.xAxisTickFormat, tickValues: g, tickLabelProps: T(e.xAxisTickLabelProps, m.columns) }),
-        /* @__PURE__ */ h(k, { axis: "column", marked: m.columns, scale: a })
-      ] })
-    ] }));
-  }), d && v(l, d, b, t.top), w && v(l, w, t.left, t.top + r), M.unmount(), e.showLegend && e.legendSvg && v(l, e.legendSvg, t.left + i + U, t.top), e.yLabel && C(l, e.yLabel, b / 2, t.top + r / 2, !0), e.xLabel) {
-    const u = X(e.xLabel, t.left + i / 2, t.left + i + t.right);
-    C(l, e.xLabel, u, t.top + r + f + A / 2, !1);
-  }
-  return l;
-}
-function it(e, o) {
-  const {
-    marg: n,
-    xMax: t,
-    yMax: i
-  } = e.layout;
-  if (t <= 0 || i <= 0) return;
-  const r = n.left + t + n.right, a = n.top + i + n.bottom, s = E(r, a), c = document.createElement("canvas");
-  c.width = Math.max(1, Math.round(r * s)), c.height = Math.max(1, Math.round(a * s));
-  const g = c.getContext("2d");
-  if (!g) return;
-  const x = N(e, s);
-  x && g.drawImage(x, n.left * s, n.top * s);
-  const p = (d) => {
-    d && V(d, o);
-  }, f = R(e, {
-    includeCells: !1
-  });
-  if (!f) {
-    c.toBlob(p, "image/png", 1);
-    return;
-  }
-  const b = new XMLSerializer().serializeToString(f), A = new Blob([b], {
-    type: "image/svg+xml;charset=utf-8"
-  }), m = URL.createObjectURL(A), l = new Image();
-  l.onload = () => {
-    g.drawImage(l, 0, 0, c.width, c.height), URL.revokeObjectURL(m), c.toBlob(p, "image/png", 1);
-  }, l.onerror = () => URL.revokeObjectURL(m), l.src = m;
-}
-function at(e, o) {
-  const n = R(e);
-  if (!n) return;
-  const t = document.createElement("div");
-  t.style.position = "absolute", t.style.top = "0", t.style.left = "-99999px", t.appendChild(n), document.body.appendChild(t), o(n, () => {
-    t.parentNode && document.body.removeChild(t);
-  });
-}
-export {
-  R as buildScrollableExportSVG,
-  it as downloadScrollableHeatmapPNG,
-  at as withOffscreenExportSVG
-};
-//# sourceMappingURL=visualization.es46.js.map

package/dist/visualization.es46.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"visualization.es46.js","sources":["../src/components/Heatmap/scrollable/heatmapExport.tsx"],"sourcesContent":["import { createRoot } from \"react-dom/client\";\nimport { flushSync } from \"react-dom\";\nimport { AxisLeft, AxisBottom } from \"@visx/axis\";\nimport type { ColumnDatum } from \"../types\";\nimport { MAX_CANVAS_EXPORT_DIMENSION, MAX_CANVAS_EXPORT_PIXELS, downloadBlob } from \"../../../utility\";\nimport type { HeatmapLayout } from \"../heatmapLayout\";\nimport { LEGEND_GAP, xAxisTitleCenter } from \"../heatmapLayout\";\nimport { AXIS_TITLE_FONT_SIZE, TICK_FONT_FAMILY, getXAxisTickLabelProps, markTickLabels, yAxisTickLabelProps } from \"../heatmapAxisProps\";\nimport { drawHeatmapCells } from \"../HeatmapCanvasCells\";\nimport HeatmapSelectionPointers from \"../HeatmapSelectionPointers\";\n\nconst SVG_NS = \"http://www.w3.org/2000/svg\";\nconst XLINK_NS = \"http://www.w3.org/1999/xlink\";\n\ninterface ScrollableExportOptions {\n  layout: HeatmapLayout;\n  data: ColumnDatum[];\n  xLabel?: string;\n  yLabel?: string;\n  showLegend: boolean;\n  legendSvg: SVGSVGElement | null;\n  xAxisTickFormat: (d: number | { valueOf(): number }) => string;\n  yAxisTickFormat: (d: number | { valueOf(): number }) => string;\n  xAxisTickLabelProps: ReturnType<typeof getXAxisTickLabelProps>;\n}\n\nconst appendTitle = (exportSvg: SVGSVGElement, text: string, x: number, y: number, rotate: boolean) => {\n  const titleEl = document.createElementNS(SVG_NS, \"text\");\n  titleEl.setAttribute(\"x\", String(x));\n  titleEl.setAttribute(\"y\", String(y));\n  if (rotate) titleEl.setAttribute(\"transform\", `rotate(-90, ${x}, ${y})`);\n  titleEl.setAttribute(\"text-anchor\", \"middle\");\n  titleEl.setAttribute(\"dominant-baseline\", \"middle\");\n  titleEl.setAttribute(\"font-size\", String(AXIS_TITLE_FONT_SIZE));\n  titleEl.setAttribute(\"font-family\", TICK_FONT_FAMILY);\n  titleEl.textContent = text;\n  exportSvg.appendChild(titleEl);\n};\n\nconst appendClone = (exportSvg: SVGSVGElement, source: SVGSVGElement, x: number, y: number) => {\n  const group = document.createElementNS(SVG_NS, \"g\");\n  group.setAttribute(\"transform\", `translate(${x},${y})`);\n  source.childNodes.forEach((node) => group.appendChild(node.cloneNode(true)));\n  exportSvg.appendChild(group);\n};\n\n// Capped at what browsers reliably allocate; past that, some return a blank canvas without erroring.\nfunction computeExportScale(width: number, height: number): number {\n  const desiredScale = window.devicePixelRatio || 2;\n  return Math.min(\n    desiredScale,\n    MAX_CANVAS_EXPORT_DIMENSION / width,\n    MAX_CANVAS_EXPORT_DIMENSION / height,\n    Math.sqrt(MAX_CANVAS_EXPORT_PIXELS / (width * height))\n  );\n}\n\n// The whole cell grid painted onto a canvas, as the live grid paints it. As SVG shapes, a large grid\n// would serialize into hundreds of MB and hang the tab.\nfunction rasterizeCells(o: ScrollableExportOptions, scale: number): HTMLCanvasElement | null {\n  const { xMax, yMax, canvasCellParams, numRows } = o.layout;\n  if (xMax <= 0 || yMax <= 0) return null;\n\n  const canvas = document.createElement(\"canvas\");\n  canvas.width = Math.max(1, Math.round(xMax * scale));\n  canvas.height = Math.max(1, Math.round(yMax * scale));\n  const ctx = canvas.getContext(\"2d\");\n  if (!ctx) return null;\n\n  ctx.setTransform(scale, 0, 0, scale, 0, 0);\n  const range = { colStart: 0, colEnd: Math.max(0, o.data.length - 1), rowStart: 0, rowEnd: Math.max(0, numRows - 1) };\n  // A highlight is a passing hover, not part of the figure; the selection is kept.\n  drawHeatmapCells(ctx, { ...canvasCellParams, highlightRange: null }, range, null);\n  return canvas;\n}\n\n// For the .svg download only; the PNG draws the canvas directly.\nfunction renderCellsToDataURL(o: ScrollableExportOptions): string | null {\n  const { xMax, yMax } = o.layout;\n  if (xMax <= 0 || yMax <= 0) return null;\n  const canvas = rasterizeCells(o, computeExportScale(xMax, yMax));\n  return canvas ? canvas.toDataURL(\"image/png\") : null;\n}\n\nconst appendCellsImage = (exportSvg: SVGSVGElement, dataUrl: string, x: number, y: number, width: number, height: number) => {\n  const image = document.createElementNS(SVG_NS, \"image\");\n  image.setAttribute(\"x\", String(x));\n  image.setAttribute(\"y\", String(y));\n  image.setAttribute(\"width\", String(width));\n  image.setAttribute(\"height\", String(height));\n  image.setAttribute(\"preserveAspectRatio\", \"none\");\n  // xlink:href for older SVG renderers and editors, href for SVG2.\n  image.setAttributeNS(XLINK_NS, \"href\", dataUrl);\n  image.setAttribute(\"href\", dataUrl);\n  exportSvg.appendChild(image);\n};\n\n// A standalone <svg> of the whole plot. The on-screen axis panes only hold the visible ticks, so the\n// axes are rendered afresh, in full, in a detached tree; the cells come in as an image.\nexport function buildScrollableExportSVG(o: ScrollableExportOptions, { includeCells = true }: { includeCells?: boolean } = {}): SVGSVGElement | null {\n  const { layout } = o;\n  const {\n    marg, xMax, yMax, xScale, yScale, numRows, xTickValues, yTickValues, yTickLabelWidth, xTickLabelHeight,\n    yTitleWidth, xTitleHeight, selectionMarks,\n  } = layout;\n\n  const exportSvg = document.createElementNS(SVG_NS, \"svg\") as SVGSVGElement;\n  exportSvg.setAttribute(\"width\", String(marg.left + xMax + marg.right));\n  exportSvg.setAttribute(\"height\", String(marg.top + yMax + marg.bottom));\n\n  if (includeCells) {\n    const cellsDataUrl = renderCellsToDataURL(o);\n    if (cellsDataUrl) appendCellsImage(exportSvg, cellsDataUrl, marg.left, marg.top, xMax, yMax);\n  }\n\n  let fullRowAxis: SVGSVGElement | null = null;\n  let fullColAxis: SVGSVGElement | null = null;\n  const exportContainer = document.createElement(\"div\");\n  const exportRoot = createRoot(exportContainer);\n  flushSync(() => {\n    exportRoot.render(\n      <>\n        <svg width={yTickLabelWidth} height={yMax} ref={(el) => { fullRowAxis = el; }}>\n          <g transform={`translate(${yTickLabelWidth},0)`}>\n            <AxisLeft\n              scale={yScale}\n              numTicks={numRows}\n              tickValues={yTickValues}\n              tickFormat={o.yAxisTickFormat}\n              tickLabelProps={markTickLabels(yAxisTickLabelProps, selectionMarks.rows)}\n            />\n            <HeatmapSelectionPointers axis=\"row\" marked={selectionMarks.rows} scale={yScale} />\n          </g>\n        </svg>\n        <svg width={xMax} height={xTickLabelHeight} ref={(el) => { fullColAxis = el; }}>\n          <AxisBottom\n            top={0}\n            scale={xScale}\n            numTicks={o.data.length}\n            tickFormat={o.xAxisTickFormat}\n            tickValues={xTickValues}\n            tickLabelProps={markTickLabels(o.xAxisTickLabelProps, selectionMarks.columns)}\n          />\n          <HeatmapSelectionPointers axis=\"column\" marked={selectionMarks.columns} scale={xScale} />\n        </svg>\n      </>\n    );\n  });\n  if (fullRowAxis) appendClone(exportSvg, fullRowAxis, yTitleWidth, marg.top);\n  if (fullColAxis) appendClone(exportSvg, fullColAxis, marg.left, marg.top + yMax);\n  exportRoot.unmount();\n\n  if (o.showLegend && o.legendSvg) {\n    appendClone(exportSvg, o.legendSvg, marg.left + xMax + LEGEND_GAP, marg.top);\n  }\n\n  // On screen the titles sit in their own fixed panes, so there is nothing to clone: they're drawn here.\n  if (o.yLabel) appendTitle(exportSvg, o.yLabel, yTitleWidth / 2, marg.top + yMax / 2, true);\n  if (o.xLabel) {\n    const center = xAxisTitleCenter(o.xLabel, marg.left + xMax / 2, marg.left + xMax + marg.right);\n    appendTitle(exportSvg, o.xLabel, center, marg.top + yMax + xTickLabelHeight + xTitleHeight / 2, false);\n  }\n\n  return exportSvg;\n}\n\n// The cells are painted straight onto the output canvas, with only the axes, legend and titles\n// going through SVG. Embedding the cells in the SVG as a data URL and decoding it back doubled the\n// memory, enough to crash the tab on a large export.\nexport function downloadScrollableHeatmapPNG(o: ScrollableExportOptions, fileName: string): void {\n  const { marg, xMax, yMax } = o.layout;\n  if (xMax <= 0 || yMax <= 0) return;\n\n  const fullWidth = marg.left + xMax + marg.right;\n  const fullHeight = marg.top + yMax + marg.bottom;\n  const scale = computeExportScale(fullWidth, fullHeight);\n\n  const canvas = document.createElement(\"canvas\");\n  canvas.width = Math.max(1, Math.round(fullWidth * scale));\n  canvas.height = Math.max(1, Math.round(fullHeight * scale));\n  const ctx = canvas.getContext(\"2d\");\n  if (!ctx) return;\n\n  const cellsCanvas = rasterizeCells(o, scale);\n  if (cellsCanvas) ctx.drawImage(cellsCanvas, marg.left * scale, marg.top * scale);\n\n  const finish = (blob: Blob | null) => {\n    if (blob) downloadBlob(blob, fileName);\n  };\n\n  const axesSvg = buildScrollableExportSVG(o, { includeCells: false });\n  if (!axesSvg) {\n    canvas.toBlob(finish, \"image/png\", 1);\n    return;\n  }\n\n  const svgString = new XMLSerializer().serializeToString(axesSvg);\n  const svgBlob = new Blob([svgString], { type: \"image/svg+xml;charset=utf-8\" });\n  const url = URL.createObjectURL(svgBlob);\n  const img = new Image();\n  img.onload = () => {\n    ctx.drawImage(img, 0, 0, canvas.width, canvas.height);\n    URL.revokeObjectURL(url);\n    canvas.toBlob(finish, \"image/png\", 1);\n  };\n  img.onerror = () => URL.revokeObjectURL(url);\n  img.src = url;\n}\n\n// Keeps the export <svg> attached off-screen until `run` is done with it. The offset goes on a\n// wrapper: set on the <svg> itself, it would be serialized into the file.\nexport function withOffscreenExportSVG(o: ScrollableExportOptions, run: (svg: SVGSVGElement, onDone: () => void) => void): void {\n  const svg = buildScrollableExportSVG(o);\n  if (!svg) return;\n  const wrapper = document.createElement(\"div\");\n  wrapper.style.position = \"absolute\";\n  wrapper.style.top = \"0\";\n  wrapper.style.left = \"-99999px\";\n  wrapper.appendChild(svg);\n  document.body.appendChild(wrapper);\n  run(svg, () => {\n    if (wrapper.parentNode) document.body.removeChild(wrapper);\n  });\n}\n"],"names":["SVG_NS","XLINK_NS","appendTitle","exportSvg","text","x","y","rotate","titleEl","document","createElementNS","setAttribute","String","AXIS_TITLE_FONT_SIZE","TICK_FONT_FAMILY","textContent","appendChild","appendClone","source","group","childNodes","forEach","node","cloneNode","computeExportScale","width","height","desiredScale","window","devicePixelRatio","Math","min","MAX_CANVAS_EXPORT_DIMENSION","sqrt","MAX_CANVAS_EXPORT_PIXELS","rasterizeCells","o","scale","xMax","yMax","canvasCellParams","numRows","layout","canvas","createElement","max","round","ctx","getContext","setTransform","range","colStart","colEnd","data","length","rowStart","rowEnd","drawHeatmapCells","highlightRange","renderCellsToDataURL","toDataURL","appendCellsImage","dataUrl","image","setAttributeNS","buildScrollableExportSVG","includeCells","marg","xScale","yScale","xTickValues","yTickValues","yTickLabelWidth","xTickLabelHeight","yTitleWidth","xTitleHeight","selectionMarks","left","right","top","bottom","cellsDataUrl","fullRowAxis","fullColAxis","exportContainer","exportRoot","createRoot","flushSync","render","jsxs","Fragment","jsx","el","AxisLeft","yAxisTickFormat","markTickLabels","yAxisTickLabelProps","rows","HeatmapSelectionPointers","AxisBottom","xAxisTickFormat","xAxisTickLabelProps","columns","unmount","showLegend","legendSvg","LEGEND_GAP","yLabel","xLabel","center","xAxisTitleCenter","downloadScrollableHeatmapPNG","fileName","fullWidth","fullHeight","cellsCanvas","drawImage","finish","blob","downloadBlob","axesSvg","toBlob","svgString","XMLSerializer","serializeToString","svgBlob","Blob","type","url","URL","createObjectURL","img","Image","onload","revokeObjectURL","onerror","src","withOffscreenExportSVG","run","svg","wrapper","style","position","body","parentNode","removeChild"],"mappings":"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"}