@jbrowse/plugin-dotplot-view 2.6.1

package/dist/DotplotView/components/DotplotWarnings.js

@@ -0,0 +1,40 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importStar(require("react"));
+const material_1 = require("@mui/material");
+const mobx_react_1 = require("mobx-react");
+// lazy components
+const WarningDialog = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./WarningDialog'))));
+exports.default = (0, mobx_react_1.observer)(function ({ model }) {
+    const trackWarnings = model.tracks.filter(t => { var _a; return (_a = t.displays[0].warnings) === null || _a === void 0 ? void 0 : _a.length; });
+    const [shown, setShown] = (0, react_1.useState)(false);
+    return trackWarnings.length ? (react_1.default.createElement(material_1.Alert, { severity: "warning" },
+        "Warnings during render",
+        ' ',
+        react_1.default.createElement(material_1.Button, { onClick: () => setShown(true) }, "More info"),
+        shown ? (react_1.default.createElement(WarningDialog, { trackWarnings: trackWarnings, handleClose: () => setShown(false) })) : null)) : null;
+});
+//# sourceMappingURL=DotplotWarnings.js.map

package/dist/DotplotView/components/DotplotWarnings.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DotplotWarnings.js","sourceRoot":"","sources":["../../../src/DotplotView/components/DotplotWarnings.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA6C;AAC7C,4CAA6C;AAC7C,2CAAqC;AAKrC,kBAAkB;AAClB,MAAM,aAAa,GAAG,IAAA,YAAI,EAAC,GAAG,EAAE,mDAAQ,iBAAiB,GAAC,CAAC,CAAA;AAE3D,kBAAe,IAAA,qBAAQ,EAAC,UAAU,EAAE,KAAK,EAA+B;IACtE,MAAM,aAAa,GAAG,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,WAAC,OAAA,MAAA,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,QAAQ,0CAAE,MAAM,CAAA,EAAA,CAAC,CAAA;IAC9E,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAA;IACzC,OAAO,aAAa,CAAC,MAAM,CAAC,CAAC,CAAC,CAC5B,8BAAC,gBAAK,IAAC,QAAQ,EAAC,SAAS;;QACA,GAAG;QAC1B,8BAAC,iBAAM,IAAC,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,gBAAoB;QACxD,KAAK,CAAC,CAAC,CAAC,CACP,8BAAC,aAAa,IACZ,aAAa,EAAE,aAAa,EAC5B,WAAW,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,GAClC,CACH,CAAC,CAAC,CAAC,IAAI,CACF,CACT,CAAC,CAAC,CAAC,IAAI,CAAA;AACV,CAAC,CAAC,CAAA"}

package/dist/DotplotView/components/ExportSvgDialog.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { ExportSvgOptions } from '../model';
+export default function ExportSvgDlg({ model, handleClose, }: {
+    model: {
+        exportSvg(opts: ExportSvgOptions): Promise<void>;
+    };
+    handleClose: () => void;
+}): React.JSX.Element;

package/dist/DotplotView/components/ExportSvgDialog.js

@@ -0,0 +1,76 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importStar(require("react"));
+const material_1 = require("@mui/material");
+const ui_1 = require("@jbrowse/core/ui");
+const util_1 = require("@jbrowse/core/util");
+function LoadingMessage() {
+    return (react_1.default.createElement("div", null,
+        react_1.default.createElement(material_1.CircularProgress, { size: 20, style: { marginRight: 20 } }),
+        react_1.default.createElement(material_1.Typography, { display: "inline" }, "Creating SVG")));
+}
+function useSvgLocal(key, val) {
+    return (0, util_1.useLocalStorage)('svg-' + key, val);
+}
+function ExportSvgDlg({ model, handleClose, }) {
+    const session = (0, util_1.getSession)(model);
+    const offscreenCanvas = typeof OffscreenCanvas !== 'undefined';
+    const [rasterizeLayers, setRasterizeLayers] = (0, react_1.useState)(offscreenCanvas);
+    const [loading, setLoading] = (0, react_1.useState)(false);
+    const [error, setError] = (0, react_1.useState)();
+    const [filename, setFilename] = useSvgLocal('file', 'jbrowse.svg');
+    const [themeName, setThemeName] = useSvgLocal('theme', session.themeName || 'default');
+    return (react_1.default.createElement(ui_1.Dialog, { open: true, onClose: handleClose, title: "Export SVG" },
+        react_1.default.createElement(material_1.DialogContent, null,
+            error ? (react_1.default.createElement(ui_1.ErrorMessage, { error: error })) : loading ? (react_1.default.createElement(LoadingMessage, null)) : null,
+            react_1.default.createElement(material_1.TextField, { helperText: "filename", value: filename, onChange: event => setFilename(event.target.value) }),
+            react_1.default.createElement("br", null),
+            session.allThemes ? (react_1.default.createElement(material_1.TextField, { select: true, label: "Theme", value: themeName, onChange: event => setThemeName(event.target.value) }, Object.entries(session.allThemes()).map(([key, val]) => (react_1.default.createElement(material_1.MenuItem, { key: key, value: key }, 
+            // @ts-expect-error
+            val.name || '(Unknown name)'))))) : null,
+            offscreenCanvas ? (react_1.default.createElement(material_1.FormControlLabel, { control: react_1.default.createElement(material_1.Checkbox, { checked: rasterizeLayers, onChange: () => setRasterizeLayers(val => !val) }), label: "Rasterize canvas based tracks? File may be much larger if this is turned off" })) : (react_1.default.createElement(material_1.Typography, null, "Note: rasterizing layers not yet supported in this browser, so SVG size may be large"))),
+        react_1.default.createElement(material_1.DialogActions, null,
+            react_1.default.createElement(material_1.Button, { variant: "contained", color: "secondary", onClick: () => handleClose() }, "Cancel"),
+            react_1.default.createElement(material_1.Button, { variant: "contained", color: "primary", type: "submit", onClick: async () => {
+                    setLoading(true);
+                    setError(undefined);
+                    try {
+                        await model.exportSvg({
+                            rasterizeLayers,
+                            filename,
+                            themeName,
+                        });
+                        handleClose();
+                    }
+                    catch (e) {
+                        console.error(e);
+                        setError(e);
+                        setLoading(false);
+                    }
+                } }, "Submit"))));
+}
+exports.default = ExportSvgDlg;
+//# sourceMappingURL=ExportSvgDialog.js.map

package/dist/DotplotView/components/ExportSvgDialog.js.map

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

package/dist/DotplotView/components/Grid.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { DotplotViewModel } from '../model';
+export declare const GridRaw: ({ model, children, }: {
+    model: DotplotViewModel;
+    children?: React.ReactNode;
+}) => React.JSX.Element | null;
+export default function Grid({ model, children, }: {
+    model: DotplotViewModel;
+    children?: React.ReactNode;
+}): React.JSX.Element;

package/dist/DotplotView/components/Grid.js

@@ -0,0 +1,60 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.GridRaw = void 0;
+const react_1 = __importDefault(require("react"));
+const mobx_react_1 = require("mobx-react");
+const material_1 = require("@mui/material");
+exports.GridRaw = (0, mobx_react_1.observer)(function ({ model, children, }) {
+    const { viewWidth, viewHeight, hview, vview } = model;
+    const hblocks = hview.dynamicBlocks.contentBlocks;
+    const vblocks = vview.dynamicBlocks.contentBlocks;
+    if (!hblocks.length || !vblocks.length) {
+        return null;
+    }
+    const htop = hview.displayedRegionsTotalPx - hview.offsetPx;
+    const vtop = vview.displayedRegionsTotalPx - vview.offsetPx;
+    const hbottom = hblocks[0].offsetPx - hview.offsetPx;
+    const vbottom = vblocks[0].offsetPx - vview.offsetPx;
+    const theme = (0, material_1.useTheme)();
+    const stroke = theme.palette.divider;
+    // Uses math.max/min avoid making very large SVG rect offscreen element,
+    // which can sometimes fail to draw
+    const rx = Math.max(hbottom, 0);
+    const ry = Math.max(viewHeight - vtop, 0);
+    const w = Math.min(htop - hbottom, viewWidth);
+    const h = Math.min(viewHeight - vbottom - ry, viewHeight);
+    let lastx = Infinity;
+    let lasty = Infinity;
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement("rect", { x: rx, y: ry, width: w, height: h, fill: theme.palette.background.default }),
+        react_1.default.createElement("g", null,
+            hblocks.map(region => {
+                const x = region.offsetPx - hview.offsetPx;
+                const render = Math.floor(x) !== Math.floor(lastx);
+                if (render) {
+                    lastx = x;
+                }
+                return render ? (react_1.default.createElement("line", { key: JSON.stringify(region), x1: x, y1: 0, x2: x, y2: viewHeight, stroke: stroke })) : null;
+            }),
+            vblocks.map(region => {
+                const y = viewHeight - (region.offsetPx - vview.offsetPx);
+                const render = Math.floor(y) !== Math.floor(lasty);
+                if (render) {
+                    lasty = y;
+                }
+                return render ? (react_1.default.createElement("line", { key: JSON.stringify(region), x1: 0, y1: y, x2: viewWidth, y2: y, stroke: stroke })) : null;
+            }),
+            react_1.default.createElement("line", { x1: htop, y1: 0, x2: htop, y2: viewHeight, stroke: stroke }),
+            react_1.default.createElement("line", { x1: 0, y1: viewHeight - vtop, x2: viewWidth, y2: viewHeight - vtop, stroke: stroke })),
+        children));
+});
+function Grid({ model, children, }) {
+    const { viewWidth, viewHeight } = model;
+    return (react_1.default.createElement("svg", { width: viewWidth, height: viewHeight, style: { background: 'rgba(0,0,0,0.12)' } },
+        react_1.default.createElement(exports.GridRaw, { model: model }, children)));
+}
+exports.default = Grid;
+//# sourceMappingURL=Grid.js.map

package/dist/DotplotView/components/Grid.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Grid.js","sourceRoot":"","sources":["../../../src/DotplotView/components/Grid.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAAyB;AACzB,2CAAqC;AACrC,4CAAwC;AAK3B,QAAA,OAAO,GAAG,IAAA,qBAAQ,EAAC,UAAU,EACxC,KAAK,EACL,QAAQ,GAIT;IACC,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,KAAK,CAAA;IACrD,MAAM,OAAO,GAAG,KAAK,CAAC,aAAa,CAAC,aAAa,CAAA;IACjD,MAAM,OAAO,GAAG,KAAK,CAAC,aAAa,CAAC,aAAa,CAAA;IACjD,IAAI,CAAC,OAAO,CAAC,MAAM,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE;QACtC,OAAO,IAAI,CAAA;KACZ;IACD,MAAM,IAAI,GAAG,KAAK,CAAC,uBAAuB,GAAG,KAAK,CAAC,QAAQ,CAAA;IAC3D,MAAM,IAAI,GAAG,KAAK,CAAC,uBAAuB,GAAG,KAAK,CAAC,QAAQ,CAAA;IAC3D,MAAM,OAAO,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC,QAAQ,GAAG,KAAK,CAAC,QAAQ,CAAA;IACpD,MAAM,OAAO,GAAG,OAAO,CAAC,CAAC,CAAC,CAAC,QAAQ,GAAG,KAAK,CAAC,QAAQ,CAAA;IACpD,MAAM,KAAK,GAAG,IAAA,mBAAQ,GAAE,CAAA;IACxB,MAAM,MAAM,GAAG,KAAK,CAAC,OAAO,CAAC,OAAO,CAAA;IAEpC,wEAAwE;IACxE,mCAAmC;IACnC,MAAM,EAAE,GAAG,IAAI,CAAC,GAAG,CAAC,OAAO,EAAE,CAAC,CAAC,CAAA;IAC/B,MAAM,EAAE,GAAG,IAAI,CAAC,GAAG,CAAC,UAAU,GAAG,IAAI,EAAE,CAAC,CAAC,CAAA;IACzC,MAAM,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,GAAG,OAAO,EAAE,SAAS,CAAC,CAAA;IAC7C,MAAM,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,UAAU,GAAG,OAAO,GAAG,EAAE,EAAE,UAAU,CAAC,CAAA;IAEzD,IAAI,KAAK,GAAG,QAAQ,CAAA;IACpB,IAAI,KAAK,GAAG,QAAQ,CAAA;IACpB,OAAO,CACL;QACE,wCACE,CAAC,EAAE,EAAE,EACL,CAAC,EAAE,EAAE,EACL,KAAK,EAAE,CAAC,EACR,MAAM,EAAE,CAAC,EACT,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC,UAAU,CAAC,OAAO,GACtC;QACF;YACG,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE;gBACpB,MAAM,CAAC,GAAG,MAAM,CAAC,QAAQ,GAAG,KAAK,CAAC,QAAQ,CAAA;gBAC1C,MAAM,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAA;gBAClD,IAAI,MAAM,EAAE;oBACV,KAAK,GAAG,CAAC,CAAA;iBACV;gBACD,OAAO,MAAM,CAAC,CAAC,CAAC,CACd,wCACE,GAAG,EAAE,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,EAC3B,EAAE,EAAE,CAAC,EACL,EAAE,EAAE,CAAC,EACL,EAAE,EAAE,CAAC,EACL,EAAE,EAAE,UAAU,EACd,MAAM,EAAE,MAAM,GACd,CACH,CAAC,CAAC,CAAC,IAAI,CAAA;YACV,CAAC,CAAC;YACD,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE;gBACpB,MAAM,CAAC,GAAG,UAAU,GAAG,CAAC,MAAM,CAAC,QAAQ,GAAG,KAAK,CAAC,QAAQ,CAAC,CAAA;gBACzD,MAAM,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAA;gBAClD,IAAI,MAAM,EAAE;oBACV,KAAK,GAAG,CAAC,CAAA;iBACV;gBACD,OAAO,MAAM,CAAC,CAAC,CAAC,CACd,wCACE,GAAG,EAAE,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,EAC3B,EAAE,EAAE,CAAC,EACL,EAAE,EAAE,CAAC,EACL,EAAE,EAAE,SAAS,EACb,EAAE,EAAE,CAAC,EACL,MAAM,EAAE,MAAM,GACd,CACH,CAAC,CAAC,CAAC,IAAI,CAAA;YACV,CAAC,CAAC;YACF,wCAAM,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,IAAI,EAAE,EAAE,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,GAAI;YACnE,wCACE,EAAE,EAAE,CAAC,EACL,EAAE,EAAE,UAAU,GAAG,IAAI,EACrB,EAAE,EAAE,SAAS,EACb,EAAE,EAAE,UAAU,GAAG,IAAI,EACrB,MAAM,EAAE,MAAM,GACd,CACA;QACH,QAAQ,CACR,CACJ,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,SAAwB,IAAI,CAAC,EAC3B,KAAK,EACL,QAAQ,GAIT;IACC,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,GAAG,KAAK,CAAA;IACvC,OAAO,CACL,uCACE,KAAK,EAAE,SAAS,EAChB,MAAM,EAAE,UAAU,EAClB,KAAK,EAAE,EAAE,UAAU,EAAE,kBAAkB,EAAE;QAEzC,8BAAC,eAAO,IAAC,KAAK,EAAE,KAAK,IAAG,QAAQ,CAAW,CACvC,CACP,CAAA;AACH,CAAC;AAjBD,uBAiBC"}

package/dist/DotplotView/components/Header.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+import { DotplotViewModel } from '../model';
+declare const _default: ({ model, selection, }: {
+    model: DotplotViewModel;
+    selection?: {
+        width: number;
+        height: number;
+    } | undefined;
+}) => React.JSX.Element;
+export default _default;

package/dist/DotplotView/components/Header.js

@@ -0,0 +1,168 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importStar(require("react"));
+const material_1 = require("@mui/material");
+const mobx_react_1 = require("mobx-react");
+const mui_1 = require("tss-react/mui");
+const util_1 = require("@jbrowse/core/util");
+const ui_1 = require("@jbrowse/core/ui");
+// icons
+const ZoomOut_1 = __importDefault(require("@mui/icons-material/ZoomOut"));
+const ZoomIn_1 = __importDefault(require("@mui/icons-material/ZoomIn"));
+const MoreVert_1 = __importDefault(require("@mui/icons-material/MoreVert"));
+const CursorIcon_1 = require("./CursorIcon");
+const Icons_1 = require("@jbrowse/core/ui/Icons");
+const DotplotWarnings_1 = __importDefault(require("./DotplotWarnings"));
+const PanButtons_1 = __importDefault(require("./PanButtons"));
+const useStyles = (0, mui_1.makeStyles)()({
+    iconButton: {
+        margin: 5,
+    },
+    bp: {
+        display: 'flex',
+        alignItems: 'center',
+        marginLeft: 10,
+    },
+    spacer: {
+        flexGrow: 1,
+    },
+    headerBar: {
+        display: 'flex',
+        position: 'relative',
+    },
+});
+const DotplotControls = (0, mobx_react_1.observer)(({ model }) => {
+    const { classes } = useStyles();
+    const [menuAnchorEl, setMenuAnchorEl] = (0, react_1.useState)();
+    return (react_1.default.createElement("div", null,
+        react_1.default.createElement(material_1.IconButton, { onClick: model.zoomOutButton, className: classes.iconButton },
+            react_1.default.createElement(ZoomOut_1.default, null)),
+        react_1.default.createElement(material_1.IconButton, { onClick: model.zoomInButton, className: classes.iconButton },
+            react_1.default.createElement(ZoomIn_1.default, null)),
+        react_1.default.createElement(material_1.IconButton, { onClick: () => model.activateTrackSelector(), className: classes.iconButton, title: "Open track selector", "data-testid": "circular_track_select" },
+            react_1.default.createElement(Icons_1.TrackSelector, null)),
+        react_1.default.createElement(material_1.IconButton, { onClick: event => setMenuAnchorEl(event.currentTarget), className: classes.iconButton },
+            react_1.default.createElement(MoreVert_1.default, null)),
+        menuAnchorEl ? (react_1.default.createElement(ui_1.Menu, { anchorEl: menuAnchorEl, open: true, onMenuItemClick: (_event, callback) => {
+                callback();
+                setMenuAnchorEl(undefined);
+            }, menuItems: [
+                {
+                    onClick: () => model.squareView(),
+                    label: 'Square view - same base pairs per pixel',
+                },
+                {
+                    onClick: () => model.squareViewProportional(),
+                    label: 'Rectanglularize view - same total bp',
+                },
+                {
+                    onClick: () => model.showAllRegions(),
+                    label: 'Show all regions',
+                },
+                {
+                    onClick: () => model.setDrawCigar(!model.drawCigar),
+                    type: 'checkbox',
+                    label: 'Draw CIGAR',
+                    checked: model.drawCigar,
+                },
+                {
+                    onClick: () => model.setShowPanButtons(!model.showPanButtons),
+                    label: 'Show pan buttons',
+                    type: 'checkbox',
+                    checked: model.showPanButtons,
+                },
+                {
+                    label: 'Click and drag mode',
+                    subMenu: [
+                        {
+                            onClick: () => model.setCursorMode('move'),
+                            label: 'Pan by default, select region when ctrl key is held',
+                            icon: CursorIcon_1.CursorMove,
+                            type: 'radio',
+                            checked: model.cursorMode === 'move',
+                        },
+                        {
+                            onClick: () => model.setCursorMode('crosshair'),
+                            label: 'Select region by default, pan when ctrl key is held',
+                            icon: CursorIcon_1.CursorMouse,
+                            type: 'radio',
+                            checked: model.cursorMode === 'crosshair',
+                        },
+                    ],
+                },
+                {
+                    label: 'Wheel scroll mode',
+                    subMenu: [
+                        {
+                            onClick: () => model.setWheelMode('pan'),
+                            label: 'Pans view',
+                            type: 'radio',
+                            checked: model.wheelMode === 'pan',
+                        },
+                        {
+                            onClick: () => model.setWheelMode('zoom'),
+                            label: 'Zooms view',
+                            type: 'radio',
+                            checked: model.wheelMode === 'zoom',
+                        },
+                        {
+                            onClick: () => model.setWheelMode('none'),
+                            label: 'Disable',
+                            type: 'radio',
+                            checked: model.wheelMode === 'none',
+                        },
+                    ],
+                },
+            ], onClose: () => setMenuAnchorEl(undefined) })) : null));
+});
+exports.default = (0, mobx_react_1.observer)(function Header({ model, selection, }) {
+    const { classes } = useStyles();
+    const { hview, vview, showPanButtons } = model;
+    return (react_1.default.createElement("div", { className: classes.headerBar },
+        react_1.default.createElement(DotplotControls, { model: model }),
+        react_1.default.createElement(material_1.Typography, { className: classes.bp, variant: "body2", color: "textSecondary" },
+            "x: ",
+            hview.assemblyNames.join(','),
+            " ",
+            (0, util_1.getBpDisplayStr)(hview.currBp),
+            react_1.default.createElement("br", null),
+            "y: ",
+            vview.assemblyNames.join(','),
+            " ",
+            (0, util_1.getBpDisplayStr)(vview.currBp)),
+        selection ? (react_1.default.createElement(material_1.Typography, { className: classes.bp, variant: "body2", color: "textSecondary" },
+            `width:${(0, util_1.getBpDisplayStr)(hview.bpPerPx * selection.width)}`,
+            " ",
+            react_1.default.createElement("br", null),
+            `height:${(0, util_1.getBpDisplayStr)(vview.bpPerPx * selection.height)}`)) : null,
+        react_1.default.createElement("div", { className: classes.spacer }),
+        react_1.default.createElement(DotplotWarnings_1.default, { model: model }),
+        showPanButtons ? react_1.default.createElement(PanButtons_1.default, { model: model }) : null));
+});
+//# sourceMappingURL=Header.js.map

package/dist/DotplotView/components/Header.js.map

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

package/dist/DotplotView/components/ImportCustomTrack.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { SnapshotIn } from 'mobx-state-tree';
+import { AnyConfigurationModel } from '@jbrowse/core/configuration';
+type Conf = SnapshotIn<AnyConfigurationModel>;
+declare const OpenTrack: ({ sessionTrackData, assembly1, assembly2, setSessionTrackData, }: {
+    sessionTrackData: Conf;
+    assembly1: string;
+    assembly2: string;
+    setSessionTrackData: (arg: Conf) => void;
+}) => React.JSX.Element;
+export default OpenTrack;

package/dist/DotplotView/components/ImportCustomTrack.js

@@ -0,0 +1,180 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importStar(require("react"));
+const path_1 = __importDefault(require("path"));
+const material_1 = require("@mui/material");
+const ui_1 = require("@jbrowse/core/ui");
+const mobx_react_1 = require("mobx-react");
+function getName(sessionTrackData) {
+    return sessionTrackData
+        ? // @ts-expect-error
+            sessionTrackData.uri ||
+                // @ts-expect-error
+                sessionTrackData.localPath ||
+                // @ts-expect-error
+                sessionTrackData.name
+        : undefined;
+}
+function stripGz(fileName) {
+    return fileName.endsWith('.gz') ? fileName.slice(0, -3) : fileName;
+}
+function getAdapter({ radioOption, assembly1, assembly2, fileLocation, bed1Location, bed2Location, }) {
+    if (radioOption === '.paf') {
+        return {
+            type: 'PAFAdapter',
+            pafLocation: fileLocation,
+            queryAssembly: assembly1,
+            targetAssembly: assembly2,
+        };
+    }
+    else if (radioOption === '.out') {
+        return {
+            type: 'MashMapAdapter',
+            outLocation: fileLocation,
+            queryAssembly: assembly1,
+            targetAssembly: assembly2,
+        };
+    }
+    else if (radioOption === '.delta') {
+        return {
+            type: 'DeltaAdapter',
+            deltaLocation: fileLocation,
+            queryAssembly: assembly1,
+            targetAssembly: assembly2,
+        };
+    }
+    else if (radioOption === '.chain') {
+        return {
+            type: 'ChainAdapter',
+            chainLocation: fileLocation,
+            queryAssembly: assembly1,
+            targetAssembly: assembly2,
+        };
+    }
+    else if (radioOption === '.anchors') {
+        return {
+            type: 'MCScanAnchorsAdapter',
+            mcscanAnchorsLocation: fileLocation,
+            bed1Location,
+            bed2Location,
+            assemblyNames: [assembly1, assembly2],
+        };
+    }
+    else if (radioOption === '.anchors.simple') {
+        return {
+            type: 'MCScanSimpleAnchorsAdapter',
+            mcscanSimpleAnchorsLocation: fileLocation,
+            bed1Location,
+            bed2Location,
+            assemblyNames: [assembly1, assembly2],
+        };
+    }
+    else {
+        throw new Error('Unknown type');
+    }
+}
+const OpenTrack = (0, mobx_react_1.observer)(({ sessionTrackData, assembly1, assembly2, setSessionTrackData, }) => {
+    const [bed2Location, setBed2Location] = (0, react_1.useState)();
+    const [bed1Location, setBed1Location] = (0, react_1.useState)();
+    const [fileLocation, setFileLocation] = (0, react_1.useState)();
+    const [value, setValue] = (0, react_1.useState)('');
+    const [error, setError] = (0, react_1.useState)();
+    const fileName = getName(fileLocation);
+    const radioOption = value || (fileName ? path_1.default.extname(stripGz(fileName)) : '');
+    (0, react_1.useEffect)(() => {
+        try {
+            if (fileLocation) {
+                const fn = fileName ? path_1.default.basename(fileName) : 'MyTrack';
+                const trackId = `${fn}-${Date.now()}`;
+                setError(undefined);
+                setSessionTrackData({
+                    trackId,
+                    name: fn,
+                    assemblyNames: [assembly2, assembly1],
+                    type: 'SyntenyTrack',
+                    adapter: getAdapter({
+                        radioOption,
+                        assembly1,
+                        assembly2,
+                        fileLocation,
+                        bed1Location,
+                        bed2Location,
+                    }),
+                });
+            }
+        }
+        catch (e) {
+            console.error(e);
+            setError(e);
+        }
+    }, [
+        fileName,
+        assembly1,
+        assembly2,
+        bed1Location,
+        bed2Location,
+        fileLocation,
+        radioOption,
+        setSessionTrackData,
+    ]);
+    return (react_1.default.createElement(material_1.Paper, { style: { padding: 12 } },
+        error ? react_1.default.createElement(ui_1.ErrorMessage, { error: error }) : null,
+        react_1.default.createElement(material_1.Typography, { style: { textAlign: 'center' } }, "Add a .paf, .out (MashMap), .delta (Mummer), .chain, .anchors or .anchors.simple (MCScan) file to view in the dotplot. These file types can also be gzipped. The first assembly should be the query sequence (e.g. left column of the PAF) and the second assembly should be the target sequence (e.g. right column of the PAF)"),
+        react_1.default.createElement(material_1.RadioGroup, { value: radioOption, onChange: event => setValue(event.target.value) },
+            react_1.default.createElement(material_1.Grid, { container: true, justifyContent: "center" },
+                react_1.default.createElement(material_1.Grid, { item: true },
+                    react_1.default.createElement(material_1.FormControlLabel, { value: ".paf", control: react_1.default.createElement(material_1.Radio, null), label: ".paf" })),
+                react_1.default.createElement(material_1.Grid, { item: true },
+                    react_1.default.createElement(material_1.FormControlLabel, { value: ".out", control: react_1.default.createElement(material_1.Radio, null), label: ".out" })),
+                react_1.default.createElement(material_1.Grid, { item: true },
+                    react_1.default.createElement(material_1.FormControlLabel, { value: ".delta", control: react_1.default.createElement(material_1.Radio, null), label: ".delta" })),
+                react_1.default.createElement(material_1.Grid, { item: true },
+                    react_1.default.createElement(material_1.FormControlLabel, { value: ".chain", control: react_1.default.createElement(material_1.Radio, null), label: ".chain" })),
+                react_1.default.createElement(material_1.Grid, { item: true },
+                    react_1.default.createElement(material_1.FormControlLabel, { value: ".anchors", control: react_1.default.createElement(material_1.Radio, null), label: ".anchors" })),
+                react_1.default.createElement(material_1.Grid, { item: true },
+                    react_1.default.createElement(material_1.FormControlLabel, { value: ".anchors.simple", control: react_1.default.createElement(material_1.Radio, null), label: ".anchors.simple" })))),
+        react_1.default.createElement(material_1.Grid, { container: true, justifyContent: "center" },
+            react_1.default.createElement(material_1.Grid, { item: true }, value === '.anchors' || value === '.anchors.simple' ? (react_1.default.createElement("div", null,
+                react_1.default.createElement("div", { style: { margin: 20 } },
+                    "Open the ",
+                    value,
+                    " and .bed files for both genome assemblies from the MCScan (Python version) pipeline",
+                    ' ',
+                    react_1.default.createElement("a", { href: "https://github.com/tanghaibao/jcvi/wiki/MCscan-(Python-version)" }, "(more info)")),
+                react_1.default.createElement("div", { style: { display: 'flex' } },
+                    react_1.default.createElement("div", null,
+                        react_1.default.createElement(ui_1.FileSelector, { name: ".anchors file", description: "", location: fileLocation, setLocation: loc => setFileLocation(loc) })),
+                    react_1.default.createElement("div", null,
+                        react_1.default.createElement(ui_1.FileSelector, { name: "genome 1 .bed (left column of anchors file)", description: "", location: bed1Location, setLocation: loc => setBed1Location(loc) })),
+                    react_1.default.createElement("div", null,
+                        react_1.default.createElement(ui_1.FileSelector, { name: "genome 2 .bed (right column of anchors file)", description: "", location: bed2Location, setLocation: loc => setBed2Location(loc) }))))) : (react_1.default.createElement(ui_1.FileSelector, { name: value ? value + ' location' : '', description: "", location: fileLocation, setLocation: loc => setFileLocation(loc) }))))));
+});
+exports.default = OpenTrack;
+//# sourceMappingURL=ImportCustomTrack.js.map

package/dist/DotplotView/components/ImportCustomTrack.js.map

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

package/dist/DotplotView/components/ImportForm.d.ts

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