react-msaview 3.1.0 → 3.1.1

package/dist/calculateBlocks.d.ts

@@ -0,0 +1,12 @@
+export declare function blocksY({ mapHeight, blockSize, viewportY, viewportHeight, }: {
+    mapHeight: number;
+    blockSize: number;
+    viewportY: number;
+    viewportHeight: number;
+}): number[];
+export declare function blocksX({ mapWidth, blockSize, viewportX, viewportWidth, }: {
+    mapWidth: number;
+    blockSize: number;
+    viewportX: number;
+    viewportWidth: number;
+}): number[];

package/dist/calculateBlocks.js

@@ -0,0 +1,23 @@
+export function blocksY({ mapHeight, blockSize, viewportY, viewportHeight, }) {
+    const clampedViewportY = Math.max(0, Math.min(viewportY, mapHeight * blockSize - viewportHeight));
+    // Calculate visible tile ranges
+    const minTileY = Math.floor(clampedViewportY / blockSize);
+    const maxTileY = Math.floor((clampedViewportY + viewportHeight - 1) / blockSize);
+    // Generate list of visible tiles
+    const blocksY = [];
+    for (let tileY = minTileY; tileY <= maxTileY; tileY++) {
+        blocksY.push(tileY * blockSize);
+    }
+    return blocksY;
+}
+export function blocksX({ mapWidth, blockSize, viewportX, viewportWidth, }) {
+    const clampedViewportX = Math.max(0, Math.min(viewportX, mapWidth - viewportWidth));
+    const minTileX = Math.floor(clampedViewportX / blockSize);
+    const maxTileX = Math.floor((clampedViewportX + viewportWidth - 1) / blockSize);
+    const blocksX = [];
+    for (let tileX = minTileX; tileX <= maxTileX; tileX++) {
+        blocksX.push(tileX * blockSize);
+    }
+    return blocksX;
+}
+//# sourceMappingURL=calculateBlocks.js.map

package/dist/calculateBlocks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"calculateBlocks.js","sourceRoot":"","sources":["../src/calculateBlocks.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,OAAO,CAAC,EACtB,SAAS,EACT,SAAS,EACT,SAAS,EACT,cAAc,GAMf;IACC,MAAM,gBAAgB,GAAG,IAAI,CAAC,GAAG,CAC/B,CAAC,EACD,IAAI,CAAC,GAAG,CAAC,SAAS,EAAE,SAAS,GAAG,SAAS,GAAG,cAAc,CAAC,CAC5D,CAAA;IAED,gCAAgC;IAChC,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,gBAAgB,GAAG,SAAS,CAAC,CAAA;IACzD,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CACzB,CAAC,gBAAgB,GAAG,cAAc,GAAG,CAAC,CAAC,GAAG,SAAS,CACpD,CAAA;IAED,iCAAiC;IACjC,MAAM,OAAO,GAAG,EAAE,CAAA;IAClB,KAAK,IAAI,KAAK,GAAG,QAAQ,EAAE,KAAK,IAAI,QAAQ,EAAE,KAAK,EAAE,EAAE,CAAC;QACtD,OAAO,CAAC,IAAI,CAAC,KAAK,GAAG,SAAS,CAAC,CAAA;IACjC,CAAC;IAED,OAAO,OAAO,CAAA;AAChB,CAAC;AAED,MAAM,UAAU,OAAO,CAAC,EACtB,QAAQ,EACR,SAAS,EACT,SAAS,EACT,aAAa,GAMd;IACC,MAAM,gBAAgB,GAAG,IAAI,CAAC,GAAG,CAC/B,CAAC,EACD,IAAI,CAAC,GAAG,CAAC,SAAS,EAAE,QAAQ,GAAG,aAAa,CAAC,CAC9C,CAAA;IAED,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,gBAAgB,GAAG,SAAS,CAAC,CAAA;IACzD,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CACzB,CAAC,gBAAgB,GAAG,aAAa,GAAG,CAAC,CAAC,GAAG,SAAS,CACnD,CAAA;IACD,MAAM,OAAO,GAAG,EAAE,CAAA;IAClB,KAAK,IAAI,KAAK,GAAG,QAAQ,EAAE,KAAK,IAAI,QAAQ,EAAE,KAAK,EAAE,EAAE,CAAC;QACtD,OAAO,CAAC,IAAI,CAAC,KAAK,GAAG,SAAS,CAAC,CAAA;IACjC,CAAC;IAED,OAAO,OAAO,CAAA;AAChB,CAAC"}

package/dist/components/ExportSVGDialog.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { MsaViewModel } from '../model';
+export default function ExportSVGDialog({ model, onClose, }: {
+    model: MsaViewModel;
+    onClose: () => void;
+}): React.JSX.Element;

package/dist/components/ExportSVGDialog.js

@@ -0,0 +1,26 @@
+import React, { useState } from 'react';
+import { Dialog, ErrorMessage } from '@jbrowse/core/ui';
+import { DialogContent, DialogActions, Button, Checkbox, FormControlLabel, useTheme, Typography, } from '@mui/material';
+export default function ExportSVGDialog({ model, onClose, }) {
+    const [includeMinimap, setIncludeMinimap] = useState(true);
+    const [error, setError] = useState();
+    const theme = useTheme();
+    return (React.createElement(Dialog, { onClose: () => onClose(), open: true, title: "Export SVG" },
+        React.createElement(DialogContent, null,
+            React.createElement(Typography, null, "Export SVG of current view"),
+            error ? React.createElement(ErrorMessage, { error: error }) : null,
+            React.createElement(FormControlLabel, { control: React.createElement(Checkbox, { checked: includeMinimap, onChange: event => setIncludeMinimap(event.target.checked) }), label: "Include minimap?" })),
+        React.createElement(DialogActions, null,
+            React.createElement(Button, { variant: "contained", color: "primary", onClick: async () => {
+                    try {
+                        await model.exportSVG({ theme, includeMinimap });
+                    }
+                    catch (e) {
+                        console.error(e);
+                        setError(e);
+                    }
+                    onClose();
+                } }, "Submit"),
+            React.createElement(Button, { variant: "contained", color: "secondary", onClick: () => onClose() }, "Cancel"))));
+}
+//# sourceMappingURL=ExportSVGDialog.js.map

package/dist/components/ExportSVGDialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExportSVGDialog.js","sourceRoot":"","sources":["../../src/components/ExportSVGDialog.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACvC,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAA;AACvD,OAAO,EACL,aAAa,EACb,aAAa,EACb,MAAM,EACN,QAAQ,EACR,gBAAgB,EAChB,QAAQ,EACR,UAAU,GACX,MAAM,eAAe,CAAA;AAGtB,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACtC,KAAK,EACL,OAAO,GAIR;IACC,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,CAAA;IAC1D,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,EAAW,CAAA;IAC7C,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAA;IACxB,OAAO,CACL,oBAAC,MAAM,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,EAAE,EAAE,IAAI,QAAC,KAAK,EAAC,YAAY;QACvD,oBAAC,aAAa;YACZ,oBAAC,UAAU,qCAAwC;YAClD,KAAK,CAAC,CAAC,CAAC,oBAAC,YAAY,IAAC,KAAK,EAAE,KAAK,GAAI,CAAC,CAAC,CAAC,IAAI;YAC9C,oBAAC,gBAAgB,IACf,OAAO,EACL,oBAAC,QAAQ,IACP,OAAO,EAAE,cAAc,EACvB,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,GAC1D,EAEJ,KAAK,EAAC,kBAAkB,GACxB,CACY;QAChB,oBAAC,aAAa;YACZ,oBAAC,MAAM,IACL,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,SAAS,EACf,OAAO,EAAE,KAAK,IAAI,EAAE;oBAClB,IAAI,CAAC;wBACH,MAAM,KAAK,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,cAAc,EAAE,CAAC,CAAA;oBAClD,CAAC;oBAAC,OAAO,CAAC,EAAE,CAAC;wBACX,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA;wBAChB,QAAQ,CAAC,CAAC,CAAC,CAAA;oBACb,CAAC;oBACD,OAAO,EAAE,CAAA;gBACX,CAAC,aAGM;YACT,oBAAC,MAAM,IAAC,OAAO,EAAC,WAAW,EAAC,KAAK,EAAC,WAAW,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,EAAE,aAE7D,CACK,CACT,CACV,CAAA;AACH,CAAC"}

package/dist/components/MSAPanel/MSABlock.js

@@ -3,13 +3,12 @@ import { autorun } from 'mobx';
 import { useTheme } from '@mui/material';
 import { observer } from 'mobx-react';
 // locals
-import { renderBlock } from './renderMSABlock';
+import { renderMSABlock } from './renderMSABlock';
 import { colorContrast } from '../../util';
 const MSABlock = observer(function ({ model, offsetX, offsetY, }) {
     const { colWidth, rowHeight, scrollY, scrollX, colorScheme, blockSize, highResScaleFactor, } = model;
     const theme = useTheme();
     const contrastScheme = useMemo(() => colorContrast(colorScheme, theme), [colorScheme, theme]);
-    console.log({ offsetX, offsetY, scrollX, scrollY });
     const ref = useRef(null);
     useEffect(() => {
         var _a;
@@ -18,7 +17,7 @@ const MSABlock = observer(function ({ model, offsetX, offsetY, }) {
             return;
         }
         return autorun(() => {
-            renderBlock({
+            renderMSABlock({
                 ctx,
                 offsetX,
                 offsetY,

package/dist/components/MSAPanel/MSABlock.js.map

@@ -1 +1 @@
-{"version":3,"file":"MSABlock.js","sourceRoot":"","sources":["../../../src/components/MSAPanel/MSABlock.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AACzD,OAAO,EAAE,OAAO,EAAE,MAAM,MAAM,CAAA;AAC9B,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AACxC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,SAAS;AACT,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAA;AAE9C,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAA;AAE1C,MAAM,QAAQ,GAAG,QAAQ,CAAC,UAAU,EAClC,KAAK,EACL,OAAO,EACP,OAAO,GAKR;IACC,MAAM,EACJ,QAAQ,EACR,SAAS,EACT,OAAO,EACP,OAAO,EACP,WAAW,EACX,SAAS,EACT,kBAAkB,GACnB,GAAG,KAAK,CAAA;IACT,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAA;IAExB,MAAM,cAAc,GAAG,OAAO,CAC5B,GAAG,EAAE,CAAC,aAAa,CAAC,WAAW,EAAE,KAAK,CAAC,EACvC,CAAC,WAAW,EAAE,KAAK,CAAC,CACrB,CAAA;IACD,OAAO,CAAC,GAAG,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,CAAC,CAAA;IAEnD,MAAM,GAAG,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAA;IAC3C,SAAS,CAAC,GAAG,EAAE;;QACb,MAAM,GAAG,GAAG,MAAA,GAAG,CAAC,OAAO,0CAAE,UAAU,CAAC,IAAI,CAAC,CAAA;QACzC,IAAI,CAAC,GAAG,EAAE,CAAC;YACT,OAAM;QACR,CAAC;QACD,OAAO,OAAO,CAAC,GAAG,EAAE;YAClB,WAAW,CAAC;gBACV,GAAG;gBACH,OAAO;gBACP,OAAO;gBACP,cAAc;gBACd,KAAK;aACN,CAAC,CAAA;QACJ,CAAC,CAAC,CAAA;IACJ,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,EAAE,OAAO,EAAE,cAAc,CAAC,CAAC,CAAA;IAC7C,OAAO,CACL,gCACE,GAAG,EAAE,GAAG,EACR,WAAW,EAAE,KAAK,CAAC,EAAE;YACnB,IAAI,CAAC,GAAG,CAAC,OAAO,EAAE,CAAC;gBACjB,OAAM;YACR,CAAC;YACD,MAAM,EAAE,IAAI,EAAE,GAAG,EAAE,GAAG,GAAG,CAAC,OAAO,CAAC,qBAAqB,EAAE,CAAA;YACzD,MAAM,MAAM,GAAG,KAAK,CAAC,OAAO,GAAG,IAAI,GAAG,OAAO,CAAA;YAC7C,MAAM,MAAM,GAAG,KAAK,CAAC,OAAO,GAAG,GAAG,GAAG,OAAO,CAAA;YAC5C,KAAK,CAAC,WAAW,CACf,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,QAAQ,CAAC,GAAG,CAAC,EACjC,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,SAAS,CAAC,CAC/B,CAAA;QACH,CAAC,EACD,YAAY,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,WAAW,EAAE,EACvC,KAAK,EAAE,SAAS,GAAG,kBAAkB,EACrC,MAAM,EAAE,SAAS,GAAG,kBAAkB,EACtC,KAAK,EAAE;YACL,QAAQ,EAAE,UAAU;YACpB,GAAG,EAAE,OAAO,GAAG,OAAO;YACtB,IAAI,EAAE,OAAO,GAAG,OAAO;YACvB,KAAK,EAAE,SAAS;YAChB,MAAM,EAAE,SAAS;SAClB,GACD,CACH,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,QAAQ,CAAA"}
+{"version":3,"file":"MSABlock.js","sourceRoot":"","sources":["../../../src/components/MSAPanel/MSABlock.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AACzD,OAAO,EAAE,OAAO,EAAE,MAAM,MAAM,CAAA;AAC9B,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AACxC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,SAAS;AACT,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAEjD,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAA;AAE1C,MAAM,QAAQ,GAAG,QAAQ,CAAC,UAAU,EAClC,KAAK,EACL,OAAO,EACP,OAAO,GAKR;IACC,MAAM,EACJ,QAAQ,EACR,SAAS,EACT,OAAO,EACP,OAAO,EACP,WAAW,EACX,SAAS,EACT,kBAAkB,GACnB,GAAG,KAAK,CAAA;IACT,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAA;IAExB,MAAM,cAAc,GAAG,OAAO,CAC5B,GAAG,EAAE,CAAC,aAAa,CAAC,WAAW,EAAE,KAAK,CAAC,EACvC,CAAC,WAAW,EAAE,KAAK,CAAC,CACrB,CAAA;IAED,MAAM,GAAG,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAA;IAC3C,SAAS,CAAC,GAAG,EAAE;;QACb,MAAM,GAAG,GAAG,MAAA,GAAG,CAAC,OAAO,0CAAE,UAAU,CAAC,IAAI,CAAC,CAAA;QACzC,IAAI,CAAC,GAAG,EAAE,CAAC;YACT,OAAM;QACR,CAAC;QACD,OAAO,OAAO,CAAC,GAAG,EAAE;YAClB,cAAc,CAAC;gBACb,GAAG;gBACH,OAAO;gBACP,OAAO;gBACP,cAAc;gBACd,KAAK;aACN,CAAC,CAAA;QACJ,CAAC,CAAC,CAAA;IACJ,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,EAAE,OAAO,EAAE,cAAc,CAAC,CAAC,CAAA;IAC7C,OAAO,CACL,gCACE,GAAG,EAAE,GAAG,EACR,WAAW,EAAE,KAAK,CAAC,EAAE;YACnB,IAAI,CAAC,GAAG,CAAC,OAAO,EAAE,CAAC;gBACjB,OAAM;YACR,CAAC;YACD,MAAM,EAAE,IAAI,EAAE,GAAG,EAAE,GAAG,GAAG,CAAC,OAAO,CAAC,qBAAqB,EAAE,CAAA;YACzD,MAAM,MAAM,GAAG,KAAK,CAAC,OAAO,GAAG,IAAI,GAAG,OAAO,CAAA;YAC7C,MAAM,MAAM,GAAG,KAAK,CAAC,OAAO,GAAG,GAAG,GAAG,OAAO,CAAA;YAC5C,KAAK,CAAC,WAAW,CACf,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,QAAQ,CAAC,GAAG,CAAC,EACjC,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,SAAS,CAAC,CAC/B,CAAA;QACH,CAAC,EACD,YAAY,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,WAAW,EAAE,EACvC,KAAK,EAAE,SAAS,GAAG,kBAAkB,EACrC,MAAM,EAAE,SAAS,GAAG,kBAAkB,EACtC,KAAK,EAAE;YACL,QAAQ,EAAE,UAAU;YACpB,GAAG,EAAE,OAAO,GAAG,OAAO;YACtB,IAAI,EAAE,OAAO,GAAG,OAAO;YACvB,KAAK,EAAE,SAAS;YAChB,MAAM,EAAE,SAAS;SAClB,GACD,CACH,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,QAAQ,CAAA"}

package/dist/components/MSAPanel/renderMSABlock.d.ts

@@ -1,5 +1,5 @@
 import { MsaViewModel } from '../../model';
-export declare function renderBlock({ model, offsetX, offsetY, contrastScheme, ctx, highResScaleFactorOverride, blockSizeXOverride, blockSizeYOverride, }: {
+export declare function renderMSABlock({ model, offsetX, offsetY, contrastScheme, ctx, highResScaleFactorOverride, blockSizeXOverride, blockSizeYOverride, }: {
     offsetX: number;
     offsetY: number;
     model: MsaViewModel;

package/dist/components/MSAPanel/renderMSABlock.js

@@ -1,5 +1,5 @@
 import { getClustalXColor, getPercentIdentityColor } from '../../colorSchemes';
-export function renderBlock({ model, offsetX, offsetY, contrastScheme, ctx, highResScaleFactorOverride, blockSizeXOverride, blockSizeYOverride, }) {
+export function renderMSABlock({ model, offsetX, offsetY, contrastScheme, ctx, highResScaleFactorOverride, blockSizeXOverride, blockSizeYOverride, }) {
     const { hierarchy, colWidth, blockSize, rowHeight, fontSize, highResScaleFactor, } = model;
     const k = highResScaleFactorOverride || highResScaleFactor;
     const bx = blockSizeXOverride || blockSize;

package/dist/components/MSAPanel/renderMSABlock.js.map

@@ -1 +1 @@
-{"version":3,"file":"renderMSABlock.js","sourceRoot":"","sources":["../../../src/components/MSAPanel/renderMSABlock.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"renderMSABlock.js","sourceRoot":"","sources":["../../../src/components/MSAPanel/renderMSABlock.ts"],"names":[],"mappings":"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"}

package/dist/components/MinimapSVG.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { MsaViewModel } from '../model';
+declare const MinimapSVG: ({ model }: {
+    model: MsaViewModel;
+}) => React.JSX.Element;
+export default MinimapSVG;

package/dist/components/MinimapSVG.js

@@ -0,0 +1,25 @@
+import React from 'react';
+import { observer } from 'mobx-react';
+const MinimapSVG = observer(function ({ model }) {
+    const { scrollX, msaAreaWidth: W, minimapHeight: H, colWidth, numColumns, } = model;
+    const BAR_HEIGHT = 12;
+    const H2 = H - 12;
+    const unit = W / numColumns / colWidth;
+    const left = -scrollX;
+    const right = left + W;
+    const s = left * unit;
+    const e = right * unit;
+    const fill = 'rgba(66, 119, 127, 0.3)';
+    return (React.createElement(React.Fragment, null,
+        React.createElement("rect", { x: 0, y: 0, width: W, height: BAR_HEIGHT, stroke: "#555", fill: "none" }),
+        React.createElement("rect", { x: Math.max(0, s), y: 0, width: e - s, height: BAR_HEIGHT, fill: fill, stroke: "#555" }),
+        React.createElement("g", { transform: `translate(0 ${BAR_HEIGHT})` },
+            React.createElement("polygon", { fill: fill, points: [
+                    [e, 0],
+                    [s, 0],
+                    [0, H2],
+                    [W, H2],
+                ].toString() }))));
+});
+export default MinimapSVG;
+//# sourceMappingURL=MinimapSVG.js.map

package/dist/components/MinimapSVG.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MinimapSVG.js","sourceRoot":"","sources":["../../src/components/MinimapSVG.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAGrC,MAAM,UAAU,GAAG,QAAQ,CAAC,UAAU,EAAE,KAAK,EAA2B;IACtE,MAAM,EACJ,OAAO,EACP,YAAY,EAAE,CAAC,EACf,aAAa,EAAE,CAAC,EAChB,QAAQ,EACR,UAAU,GACX,GAAG,KAAK,CAAA;IAET,MAAM,UAAU,GAAG,EAAE,CAAA;IACrB,MAAM,EAAE,GAAG,CAAC,GAAG,EAAE,CAAA;IAEjB,MAAM,IAAI,GAAG,CAAC,GAAG,UAAU,GAAG,QAAQ,CAAA;IACtC,MAAM,IAAI,GAAG,CAAC,OAAO,CAAA;IACrB,MAAM,KAAK,GAAG,IAAI,GAAG,CAAC,CAAA;IACtB,MAAM,CAAC,GAAG,IAAI,GAAG,IAAI,CAAA;IACrB,MAAM,CAAC,GAAG,KAAK,GAAG,IAAI,CAAA;IACtB,MAAM,IAAI,GAAG,yBAAyB,CAAA;IAEtC,OAAO,CACL;QACE,8BACE,CAAC,EAAE,CAAC,EACJ,CAAC,EAAE,CAAC,EACJ,KAAK,EAAE,CAAC,EACR,MAAM,EAAE,UAAU,EAClB,MAAM,EAAC,MAAM,EACb,IAAI,EAAC,MAAM,GACX;QACF,8BACE,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC,EACjB,CAAC,EAAE,CAAC,EACJ,KAAK,EAAE,CAAC,GAAG,CAAC,EACZ,MAAM,EAAE,UAAU,EAClB,IAAI,EAAE,IAAI,EACV,MAAM,EAAC,MAAM,GACb;QACF,2BAAG,SAAS,EAAE,eAAe,UAAU,GAAG;YACxC,iCACE,IAAI,EAAE,IAAI,EACV,MAAM,EAAE;oBACN,CAAC,CAAC,EAAE,CAAC,CAAC;oBACN,CAAC,CAAC,EAAE,CAAC,CAAC;oBACN,CAAC,CAAC,EAAE,EAAE,CAAC;oBACP,CAAC,CAAC,EAAE,EAAE,CAAC;iBACR,CAAC,QAAQ,EAAE,GACZ,CACA,CACH,CACJ,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,UAAU,CAAA"}

package/dist/components/ZoomControls.js

@@ -1,14 +1,16 @@
-import React from 'react';
-import { IconButton, useTheme } from '@mui/material';
+import React, { Suspense, lazy, useState } from 'react';
+import { IconButton } from '@mui/material';
 import { observer } from 'mobx-react';
 import CascadingMenuButton from '@jbrowse/core/ui/CascadingMenuButton';
 // icons
 import MoreVert from '@mui/icons-material/MoreVert';
 import ZoomIn from '@mui/icons-material/ZoomIn';
 import ZoomOut from '@mui/icons-material/ZoomOut';
+// lazies
+const ExportSVGDialog = lazy(() => import('./ExportSVGDialog'));
 const ZoomControls = observer(function ZoomControls({ model, }) {
     const { colWidth, rowHeight } = model;
-    const theme = useTheme();
+    const [exportSvgDialogOpen, setExportSvgDialogOpen] = useState(false);
     return (React.createElement(React.Fragment, null,
         React.createElement(IconButton, { onClick: () => {
                 model.setColWidth(Math.ceil(colWidth * 1.5));
@@ -46,12 +48,12 @@ const ZoomControls = observer(function ZoomControls({ model, }) {
                 },
                 {
                     label: 'Export SVG',
-                    onClick: () => {
-                        model.exportSVG({ theme });
-                    },
+                    onClick: () => setExportSvgDialogOpen(true),
                 },
             ] },
-            React.createElement(MoreVert, null))));
+            React.createElement(MoreVert, null)),
+        exportSvgDialogOpen ? (React.createElement(Suspense, { fallback: null },
+            React.createElement(ExportSVGDialog, { model: model, onClose: () => setExportSvgDialogOpen(false) }))) : null));
 });
 export default ZoomControls;
 //# sourceMappingURL=ZoomControls.js.map

package/dist/components/ZoomControls.js.map

@@ -1 +1 @@
-{"version":3,"file":"ZoomControls.js","sourceRoot":"","sources":["../../src/components/ZoomControls.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AACpD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,mBAAmB,MAAM,sCAAsC,CAAA;AAKtE,QAAQ;AACR,OAAO,QAAQ,MAAM,8BAA8B,CAAA;AACnD,OAAO,MAAM,MAAM,4BAA4B,CAAA;AAC/C,OAAO,OAAO,MAAM,6BAA6B,CAAA;AAEjD,MAAM,YAAY,GAAG,QAAQ,CAAC,SAAS,YAAY,CAAC,EAClD,KAAK,GAGN;IACC,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,CAAA;IACrC,MAAM,KAAK,GAAG,QAAQ,EAAE,CAAA;IACxB,OAAO,CACL;QACE,oBAAC,UAAU,IACT,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,GAAG,GAAG,CAAC,CAAC,CAAA;gBAC5C,KAAK,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,CAAC,SAAS,GAAG,GAAG,CAAC,CAAC,CAAA;YAChD,CAAC;YAED,oBAAC,MAAM,OAAG,CACC;QACb,oBAAC,UAAU,IACT,OAAO,EAAE,GAAG,EAAE;gBACZ,KAAK,CAAC,WAAW,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,IAAI,CAAC,CAAC,CAAC,CAAA;gBAC3D,KAAK,CAAC,YAAY,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,GAAG,IAAI,CAAC,CAAC,CAAC,CAAA;YACjE,CAAC;YAED,oBAAC,OAAO,OAAG,CACA;QACb,oBAAC,mBAAmB,IAClB,SAAS,EAAE;gBACT;oBACE,KAAK,EAAE,qBAAqB;oBAC5B,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,YAAY,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,SAAS,GAAG,IAAI,CAAC,CAAC;iBACnE;gBACD;oBACE,KAAK,EAAE,qBAAqB;oBAC5B,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,YAAY,CAAC,SAAS,GAAG,GAAG,CAAC;iBACnD;gBACD;oBACE,KAAK,EAAE,oBAAoB;oBAC3B,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,QAAQ,GAAG,IAAI,CAAC,CAAC;iBAC/D;gBACD;oBACE,KAAK,EAAE,oBAAoB;oBAC3B,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,WAAW,CAAC,QAAQ,GAAG,GAAG,CAAC;iBACjD;gBACD;oBACE,KAAK,EAAE,uBAAuB;oBAC9B,OAAO,EAAE,GAAG,EAAE;wBACZ,KAAK,CAAC,WAAW,CAAC,EAAE,CAAC,CAAA;wBACrB,KAAK,CAAC,YAAY,CAAC,EAAE,CAAC,CAAA;oBACxB,CAAC;iBACF;gBACD;oBACE,KAAK,EAAE,YAAY;oBACnB,OAAO,EAAE,GAAG,EAAE;wBACZ,KAAK,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,CAAC,CAAA;oBAC5B,CAAC;iBACF;aACF;YAED,oBAAC,QAAQ,OAAG,CACQ,CACrB,CACJ,CAAA;AACH,CAAC,CAAC,CAAA;AACF,eAAe,YAAY,CAAA"}
+{"version":3,"file":"ZoomControls.js","sourceRoot":"","sources":["../../src/components/ZoomControls.tsx"],"names":[],"mappings":"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"}

package/dist/model.d.ts

@@ -80,24 +80,24 @@ declare const model: import("mobx-state-tree").IModelType<{
     highResScaleFactor: import("mobx-state-tree").IType<number | undefined, number, number>;
     colorSchemeName: import("mobx-state-tree").IType<string | undefined, string, string>;
     treeFilehandle: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISnapshotProcessor<import("mobx-state-tree").ITypeUnion<import("mobx-state-tree").ModelCreationType<import("mobx-state-tree/dist/internal").ExtractCFromProps<{
-        /**
-         * #property
-         * draw clickable node bubbles on the tree
-         */
         locationType: import("mobx-state-tree").ISimpleType<"UriLocation">;
         uri: import("mobx-state-tree").ISimpleType<string>;
         baseUri: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<string>>;
         internetAccountId: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<string>>;
         internetAccountPreAuthorization: import("mobx-state-tree").IMaybe<import("mobx-state-tree").IModelType<{
             internetAccountType: import("mobx-state-tree").ISimpleType<string>;
-            authInfo: import("mobx-state-tree").IType<any, any, any>;
+            authInfo: import("mobx-state-tree").IType<any, any, any>; /**
+             * #property
+             * filehandle object for the MSA (which could contain a tree e.g. with
+             * stockholm files)
+             */
         }, {}, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
     }>> | import("mobx-state-tree").ModelCreationType<import("mobx-state-tree/dist/internal").ExtractCFromProps<{
-        locationType: import("mobx-state-tree").ISimpleType<"BlobLocation">; /**
+        locationType: import("mobx-state-tree").ISimpleType<"BlobLocation">;
+        name: import("mobx-state-tree").ISimpleType<string>; /**
          * #property
          *
          */
-        name: import("mobx-state-tree").ISimpleType<string>;
         blobId: import("mobx-state-tree").ISimpleType<string>;
     }>> | import("mobx-state-tree").ModelCreationType<import("mobx-state-tree/dist/internal").ExtractCFromProps<{
         locationType: import("mobx-state-tree").ISimpleType<"LocalPathLocation">;
@@ -138,24 +138,24 @@ declare const model: import("mobx-state-tree").IModelType<{
         }, {}, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
     }>> & import("mobx-state-tree/dist/internal").NonEmptyObject)>, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
     msaFilehandle: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISnapshotProcessor<import("mobx-state-tree").ITypeUnion<import("mobx-state-tree").ModelCreationType<import("mobx-state-tree/dist/internal").ExtractCFromProps<{
-        /**
-         * #property
-         * draw clickable node bubbles on the tree
-         */
         locationType: import("mobx-state-tree").ISimpleType<"UriLocation">;
         uri: import("mobx-state-tree").ISimpleType<string>;
         baseUri: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<string>>;
         internetAccountId: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<string>>;
         internetAccountPreAuthorization: import("mobx-state-tree").IMaybe<import("mobx-state-tree").IModelType<{
             internetAccountType: import("mobx-state-tree").ISimpleType<string>;
-            authInfo: import("mobx-state-tree").IType<any, any, any>;
+            authInfo: import("mobx-state-tree").IType<any, any, any>; /**
+             * #property
+             * filehandle object for the MSA (which could contain a tree e.g. with
+             * stockholm files)
+             */
         }, {}, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
     }>> | import("mobx-state-tree").ModelCreationType<import("mobx-state-tree/dist/internal").ExtractCFromProps<{
-        locationType: import("mobx-state-tree").ISimpleType<"BlobLocation">; /**
+        locationType: import("mobx-state-tree").ISimpleType<"BlobLocation">;
+        name: import("mobx-state-tree").ISimpleType<string>; /**
          * #property
          *
          */
-        name: import("mobx-state-tree").ISimpleType<string>;
         blobId: import("mobx-state-tree").ISimpleType<string>;
     }>> | import("mobx-state-tree").ModelCreationType<import("mobx-state-tree/dist/internal").ExtractCFromProps<{
         locationType: import("mobx-state-tree").ISimpleType<"LocalPathLocation">;
@@ -196,24 +196,24 @@ declare const model: import("mobx-state-tree").IModelType<{
         }, {}, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
     }>> & import("mobx-state-tree/dist/internal").NonEmptyObject)>, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
     treeMetadataFilehandle: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISnapshotProcessor<import("mobx-state-tree").ITypeUnion<import("mobx-state-tree").ModelCreationType<import("mobx-state-tree/dist/internal").ExtractCFromProps<{
-        /**
-         * #property
-         * draw clickable node bubbles on the tree
-         */
         locationType: import("mobx-state-tree").ISimpleType<"UriLocation">;
         uri: import("mobx-state-tree").ISimpleType<string>;
         baseUri: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<string>>;
         internetAccountId: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<string>>;
         internetAccountPreAuthorization: import("mobx-state-tree").IMaybe<import("mobx-state-tree").IModelType<{
             internetAccountType: import("mobx-state-tree").ISimpleType<string>;
-            authInfo: import("mobx-state-tree").IType<any, any, any>;
+            authInfo: import("mobx-state-tree").IType<any, any, any>; /**
+             * #property
+             * filehandle object for the MSA (which could contain a tree e.g. with
+             * stockholm files)
+             */
         }, {}, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
     }>> | import("mobx-state-tree").ModelCreationType<import("mobx-state-tree/dist/internal").ExtractCFromProps<{
-        locationType: import("mobx-state-tree").ISimpleType<"BlobLocation">; /**
+        locationType: import("mobx-state-tree").ISimpleType<"BlobLocation">;
+        name: import("mobx-state-tree").ISimpleType<string>; /**
          * #property
          *
          */
-        name: import("mobx-state-tree").ISimpleType<string>;
         blobId: import("mobx-state-tree").ISimpleType<string>;
     }>> | import("mobx-state-tree").ModelCreationType<import("mobx-state-tree/dist/internal").ExtractCFromProps<{
         locationType: import("mobx-state-tree").ISimpleType<"LocalPathLocation">;
@@ -506,27 +506,6 @@ declare const model: import("mobx-state-tree").IModelType<{
      */
     setTreeMetadata(result: string): void;
 } & {
-    /**
-     * #getter
-     */
-    readonly initialized: boolean | "" | undefined;
-    /**
-     * #getter
-     */
-    readonly blocksX: number[];
-    /**
-     * #getter
-     */
-    readonly blocksY: number[];
-} & {
-    /**
-     * #getter
-     */
-    readonly blocks2d: number[][];
-    /**
-     * #getter
-     */
-    readonly done: string | false | undefined;
     /**
      * #getter
      */
@@ -649,6 +628,37 @@ declare const model: import("mobx-state-tree").IModelType<{
      * #getter
      */
     readonly totalHeight: number;
+} & {
+    /**
+     * #getter
+     */
+    readonly totalWidth: number;
+} & {
+    /**
+     * #getter
+     */
+    readonly initialized: boolean | "" | undefined;
+    /**
+     * #getter
+     */
+    readonly blocksX: number[];
+    /**
+     * #getter
+     */
+    readonly blocksY: number[];
+} & {
+    /**
+     * #getter
+     */
+    readonly blocks2d: number[][];
+    /**
+     * #getter
+     */
+    readonly done: string | false | undefined;
+    /**
+     * #getter
+     */
+    readonly maxScrollX: number;
 } & {
     /**
      * #action
@@ -747,6 +757,7 @@ declare const model: import("mobx-state-tree").IModelType<{
      */
     exportSVG(opts: {
         theme: Theme;
+        includeMinimap?: boolean;
     }): Promise<void>;
     /**
      * #action

package/dist/model.js

@@ -22,6 +22,7 @@ import { UniprotTrack } from './UniprotTrack';
 import { StructureModel } from './StructureModel';
 import { DialogQueueSessionMixin } from './DialogQueue';
 import { renderToSvg } from './renderToSvg';
+import { blocksX, blocksY } from './calculateBlocks';
 /**
  * #stateModel MsaView
  * extends
@@ -459,75 +460,7 @@ const model = types
         self.data.setTreeMetadata(result);
     },
 }))
-    .views(self => {
-    let oldBlocksX = [];
-    let oldBlocksY = [];
-    let oldValX = 0;
-    let oldValY = 0;
-    return {
-        /**
-         * #getter
-         */
-        get initialized() {
-            return ((self.data.msa ||
-                self.data.tree ||
-                self.msaFilehandle ||
-                self.treeFilehandle) &&
-                !self.error);
-        },
-        /**
-         * #getter
-         */
-        get blocksX() {
-            const { scrollX, blockSize: size, colWidth } = self;
-            const ret = -(size * Math.floor(scrollX / size)) - size;
-            const b = [];
-            for (let i = ret; i < ret + size * 3; i += size) {
-                if (i + size > 0) {
-                    b.push(i);
-                }
-            }
-            if (JSON.stringify(b) !== JSON.stringify(oldBlocksX) ||
-                colWidth !== oldValX) {
-                oldBlocksX = b;
-                oldValX = colWidth;
-            }
-            return oldBlocksX;
-        },
-        /**
-         * #getter
-         */
-        get blocksY() {
-            const { scrollY, blockSize: size, rowHeight } = self;
-            const ret = -(size * Math.floor(scrollY / size)) - 2 * size;
-            const b = [];
-            for (let i = ret; i < ret + size * 3; i += size) {
-                if (i + size > 0) {
-                    b.push(i);
-                }
-            }
-            if (JSON.stringify(b) !== JSON.stringify(oldBlocksY) ||
-                rowHeight !== oldValY) {
-                oldBlocksY = b;
-                oldValY = rowHeight;
-            }
-            return oldBlocksY;
-        },
-    };
-})
     .views(self => ({
-    /**
-     * #getter
-     */
-    get blocks2d() {
-        return self.blocksY.flatMap(by => self.blocksX.map(bx => [bx, by]));
-    },
-    /**
-     * #getter
-     */
-    get done() {
-        return self.initialized && (self.data.msa || self.data.tree);
-    },
     /**
      * #getter
      */
@@ -782,6 +715,74 @@ const model = types
     get totalHeight() {
         return this.root.leaves().length * self.rowHeight;
     },
+}))
+    .views(self => ({
+    /**
+     * #getter
+     */
+    get totalWidth() {
+        return self.numColumns * self.colWidth;
+    },
+}))
+    .views(self => ({
+    /**
+     * #getter
+     */
+    get initialized() {
+        return ((self.data.msa ||
+            self.data.tree ||
+            self.msaFilehandle ||
+            self.treeFilehandle) &&
+            !self.error);
+    },
+    /**
+     * #getter
+     */
+    get blocksX() {
+        return blocksX({
+            viewportWidth: self.msaAreaWidth,
+            viewportX: -self.scrollX,
+            blockSize: self.blockSize,
+            mapWidth: self.totalWidth,
+        });
+    },
+    /**
+     * #getter
+     */
+    get blocksY() {
+        return blocksY({
+            viewportHeight: self.height,
+            viewportY: -self.scrollY,
+            blockSize: self.blockSize,
+            mapHeight: self.totalHeight,
+        });
+    },
+}))
+    .views(self => ({
+    /**
+     * #getter
+     */
+    get blocks2d() {
+        const ret = [];
+        for (const by of self.blocksY) {
+            for (const bx of self.blocksX) {
+                ret.push([bx, by]);
+            }
+        }
+        return ret;
+    },
+    /**
+     * #getter
+     */
+    get done() {
+        return self.initialized && (self.data.msa || self.data.tree);
+    },
+    /**
+     * #getter
+     */
+    get maxScrollX() {
+        return -self.totalWidth + (self.msaAreaWidth - 100);
+    },
 }))
     .actions(self => ({
     /**
@@ -811,14 +812,13 @@ const model = types
      * #action
      */
     doScrollX(deltaX) {
-        self.scrollX = clamp(-(self.numColumns * self.colWidth) + (self.msaAreaWidth - 100), self.scrollX + deltaX, 0);
+        self.scrollX = clamp(self.maxScrollX, self.scrollX + deltaX, 0);
     },
     /**
      * #action
      */
     setScrollX(n) {
-        console.log({ n });
-        self.scrollX = clamp(-(self.numColumns * self.colWidth) + (self.msaAreaWidth - 100), n, 0);
+        self.scrollX = clamp(self.maxScrollX, n, 0);
     },
     /**
      * #action