@jbrowse/plugin-dotplot-view 2.6.2 → 2.7.0

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

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

package/dist/DotplotView/components/PanButtons.js

@@ -29,7 +29,7 @@ const useStyles = (0, mui_1.makeStyles)()({
         margin: 0,
     },
 });
-exports.default = (0, mobx_react_1.observer)(function PanButtons({ model, }) {
+const PanButtons = (0, mobx_react_1.observer)(function PanButtons({ model, }) {
     const { classes } = useStyles();
     return (react_1.default.createElement(material_1.Paper, { className: classes.dpad, elevation: 6 },
         react_1.default.createElement("div", null),
@@ -57,3 +57,4 @@ exports.default = (0, mobx_react_1.observer)(function PanButtons({ model, }) {
             } },
             react_1.default.createElement(ZoomOut_1.default, null))));
 });
+exports.default = PanButtons;

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

@@ -9,8 +9,8 @@ interface TrackWarning {
         }[];
     }[];
 }
-declare const _default: ({ trackWarnings, handleClose, }: {
+declare const WarningDialog: ({ trackWarnings, handleClose, }: {
     handleClose: () => void;
     trackWarnings: TrackWarning[];
 }) => React.JSX.Element;
-export default _default;
+export default WarningDialog;

package/dist/DotplotView/components/WarningDialog.js

@@ -16,7 +16,7 @@ const useStyles = (0, mui_1.makeStyles)()({
         minWidth: 600,
     },
 });
-exports.default = (0, mobx_react_1.observer)(function WarningDialog({ trackWarnings, handleClose, }) {
+const WarningDialog = (0, mobx_react_1.observer)(function WarningDialog({ trackWarnings, handleClose, }) {
     const { classes } = useStyles();
     const rows = [];
     for (let i = 0; i < trackWarnings.length; i++) {
@@ -38,3 +38,4 @@ exports.default = (0, mobx_react_1.observer)(function WarningDialog({ trackWarni
             react_1.default.createElement("div", { style: { height: 600, width: '100%', overflow: 'auto' } },
                 react_1.default.createElement(x_data_grid_1.DataGrid, { rows: rows, columns: columns, disableRowSelectionOnClick: true, rowHeight: 25, disableColumnMenu: true })))));
 });
+exports.default = WarningDialog;

package/dist/DotplotView/components/util.js

@@ -66,9 +66,7 @@ function makeTicks(regions, bpPerPx, emitMajor = true, emitMinor = true) {
     const ticks = [];
     const gridPitch = chooseGridPitch(bpPerPx, 60, 15);
     const iterPitch = gridPitch.minorPitch || gridPitch.majorPitch;
-    for (let i = 0; i < regions.length; i++) {
-        const region = regions[i];
-        const { start, end, refName } = region;
+    for (const { start, end, refName } of regions) {
         let index = 0;
         const minBase = start;
         const maxBase = end;
@@ -77,8 +75,7 @@ function makeTicks(regions, bpPerPx, emitMajor = true, emitMinor = true) {
                 ticks.push({ type: 'minor', base: base - 1, index, refName });
                 index += 1;
             }
-            else if (emitMajor &&
-                Math.abs(base - region.start) > gridPitch.minorPitch) {
+            else if (emitMajor && Math.abs(base - start) > gridPitch.minorPitch) {
                 ticks.push({ type: 'major', base: base - 1, index, refName });
                 index += 1;
             }

package/dist/DotplotView/model.d.ts

@@ -58,15 +58,15 @@ export default function stateModelFactory(pm: PluginManager): import("mobx-state
         readonly width: number;
         readonly assemblyNames: string[];
         readonly displayedRegionsTotalPx: number;
-        readonly maxOffset: number; /**
-         * #property
+        readonly maxOffset: number;
+        readonly minOffset: number; /**
+         * #stateModel DotplotView
+         * #category view
+         * extends  `BaseViewModel`
          */
-        readonly minOffset: number;
         readonly totalBp: number;
     } & {
-        readonly dynamicBlocks: import("@jbrowse/core/util/blockTypes").BlockSet; /**
-         * #property
-         */
+        readonly dynamicBlocks: import("@jbrowse/core/util/blockTypes").BlockSet;
         readonly staticBlocks: import("@jbrowse/core/util/blockTypes").BlockSet;
         readonly currBp: number;
     } & {
@@ -82,14 +82,20 @@ export default function stateModelFactory(pm: PluginManager): import("mobx-state
             reversed: boolean;
         };
         bpToPx({ refName, coord, regionNumber, }: {
-            refName: string;
+            refName: string; /**
+             * #property
+             */
             coord: number;
-            regionNumber?: number | undefined;
+            regionNumber?: number | undefined; /**
+             * #property
+             */
         }): number | undefined;
     } & {
         setFeatures(features: import("@jbrowse/core/util").Feature[]): void;
         showAllRegions(): void;
-        zoomOut(): void;
+        zoomOut(): void; /**
+         * #property
+         */
         zoomIn(): void;
         zoomTo(bpPerPx: number, offset?: number | undefined): number;
         scrollTo(offsetPx: number): number;
@@ -137,15 +143,15 @@ export default function stateModelFactory(pm: PluginManager): import("mobx-state
         readonly width: number;
         readonly assemblyNames: string[];
         readonly displayedRegionsTotalPx: number;
-        readonly maxOffset: number; /**
-         * #property
+        readonly maxOffset: number;
+        readonly minOffset: number; /**
+         * #stateModel DotplotView
+         * #category view
+         * extends  `BaseViewModel`
          */
-        readonly minOffset: number;
         readonly totalBp: number;
     } & {
-        readonly dynamicBlocks: import("@jbrowse/core/util/blockTypes").BlockSet; /**
-         * #property
-         */
+        readonly dynamicBlocks: import("@jbrowse/core/util/blockTypes").BlockSet;
         readonly staticBlocks: import("@jbrowse/core/util/blockTypes").BlockSet;
         readonly currBp: number;
     } & {
@@ -161,14 +167,20 @@ export default function stateModelFactory(pm: PluginManager): import("mobx-state
             reversed: boolean;
         };
         bpToPx({ refName, coord, regionNumber, }: {
-            refName: string;
+            refName: string; /**
+             * #property
+             */
             coord: number;
-            regionNumber?: number | undefined;
+            regionNumber?: number | undefined; /**
+             * #property
+             */
         }): number | undefined;
     } & {
         setFeatures(features: import("@jbrowse/core/util").Feature[]): void;
         showAllRegions(): void;
-        zoomOut(): void;
+        zoomOut(): void; /**
+         * #property
+         */
         zoomIn(): void;
         zoomTo(bpPerPx: number, offset?: number | undefined): number;
         scrollTo(offsetPx: number): number;
@@ -201,28 +213,33 @@ export default function stateModelFactory(pm: PluginManager): import("mobx-state
         readonly textSearchAdapter: any;
         readonly adapterType: import("@jbrowse/core/pluggableElementTypes").AdapterType;
         readonly viewMenuActions: import("@jbrowse/core/ui").MenuItem[];
-        readonly canConfigure: any;
+        readonly canConfigure: boolean | ({
+            [x: string]: any;
+        } & import("mobx-state-tree/dist/internal").NonEmptyObject & {
+            setSubschema(slotName: string, data: unknown): any;
+        } & import("mobx-state-tree").IStateTreeNode<import("@jbrowse/core/configuration").AnyConfigurationSchemaType>) | undefined;
     } & {
         setMinimized(flag: boolean): void;
-        activateConfigurationUI(): void;
-        showDisplay(displayId: string, initialSnapshot?: {} | undefined): void;
+        showDisplay(displayId: string, initialSnapshot?: {} | undefined): void; /**
+         * #property
+         */
         hideDisplay(displayId: string): number;
         replaceDisplay(oldId: string, newId: string, initialSnapshot?: {} | undefined): void;
     } & {
         trackMenuItems(): (import("@jbrowse/core/ui").MenuDivider | import("@jbrowse/core/ui").MenuSubHeader | import("@jbrowse/core/ui").NormalMenuItem | import("@jbrowse/core/ui").CheckboxMenuItem | import("@jbrowse/core/ui").RadioMenuItem | import("@jbrowse/core/ui").SubMenuItem | {
-            type: string; /**
+            type: string;
+            label: string; /**
              * #property
              */
-            label: string;
             subMenu: {
                 type: string;
-                label: string; /**
-                 * #property
-                 */
+                label: string;
                 checked: boolean;
                 onClick: () => void;
             }[];
-        })[];
+        })[]; /**
+         * #property
+         */
     }, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>>;
     viewTrackConfigs: import("mobx-state-tree").IArrayType<import("mobx-state-tree").IAnyModelType>;
 }, {
@@ -329,15 +346,15 @@ export default function stateModelFactory(pm: PluginManager): import("mobx-state
         readonly width: number;
         readonly assemblyNames: string[];
         readonly displayedRegionsTotalPx: number;
-        readonly maxOffset: number; /**
-         * #property
+        readonly maxOffset: number;
+        readonly minOffset: number; /**
+         * #stateModel DotplotView
+         * #category view
+         * extends  `BaseViewModel`
          */
-        readonly minOffset: number;
         readonly totalBp: number;
     } & {
-        readonly dynamicBlocks: import("@jbrowse/core/util/blockTypes").BlockSet; /**
-         * #property
-         */
+        readonly dynamicBlocks: import("@jbrowse/core/util/blockTypes").BlockSet;
         readonly staticBlocks: import("@jbrowse/core/util/blockTypes").BlockSet;
         readonly currBp: number;
     } & {
@@ -353,14 +370,20 @@ export default function stateModelFactory(pm: PluginManager): import("mobx-state
             reversed: boolean;
         };
         bpToPx({ refName, coord, regionNumber, }: {
-            refName: string;
+            refName: string; /**
+             * #property
+             */
             coord: number;
-            regionNumber?: number | undefined;
+            regionNumber?: number | undefined; /**
+             * #property
+             */
         }): number | undefined;
     } & {
         setFeatures(features: import("@jbrowse/core/util").Feature[]): void;
         showAllRegions(): void;
-        zoomOut(): void;
+        zoomOut(): void; /**
+         * #property
+         */
         zoomIn(): void;
         zoomTo(bpPerPx: number, offset?: number | undefined): number;
         scrollTo(offsetPx: number): number;
@@ -407,15 +430,15 @@ export default function stateModelFactory(pm: PluginManager): import("mobx-state
         readonly width: number;
         readonly assemblyNames: string[];
         readonly displayedRegionsTotalPx: number;
-        readonly maxOffset: number; /**
-         * #property
+        readonly maxOffset: number;
+        readonly minOffset: number; /**
+         * #stateModel DotplotView
+         * #category view
+         * extends  `BaseViewModel`
          */
-        readonly minOffset: number;
         readonly totalBp: number;
     } & {
-        readonly dynamicBlocks: import("@jbrowse/core/util/blockTypes").BlockSet; /**
-         * #property
-         */
+        readonly dynamicBlocks: import("@jbrowse/core/util/blockTypes").BlockSet;
         readonly staticBlocks: import("@jbrowse/core/util/blockTypes").BlockSet;
         readonly currBp: number;
     } & {
@@ -431,14 +454,20 @@ export default function stateModelFactory(pm: PluginManager): import("mobx-state
             reversed: boolean;
         };
         bpToPx({ refName, coord, regionNumber, }: {
-            refName: string;
+            refName: string; /**
+             * #property
+             */
             coord: number;
-            regionNumber?: number | undefined;
+            regionNumber?: number | undefined; /**
+             * #property
+             */
         }): number | undefined;
     } & {
         setFeatures(features: import("@jbrowse/core/util").Feature[]): void;
         showAllRegions(): void;
-        zoomOut(): void;
+        zoomOut(): void; /**
+         * #property
+         */
         zoomIn(): void;
         zoomTo(bpPerPx: number, offset?: number | undefined): number;
         scrollTo(offsetPx: number): number;

package/dist/DotplotView/model.js

@@ -46,6 +46,15 @@ const util_2 = require("./components/util");
 // lazies
 const ExportSvgDialog = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./components/ExportSvgDialog'))));
 const ReturnToImportFormDialog = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('@jbrowse/core/ui/ReturnToImportFormDialog'))));
+const len = (a) => (0, util_1.measureText)(a.slice(0, 30));
+const pxWidthForBlocks = (blocks, hide) => {
+    return (0, util_1.max)([
+        ...blocks.filter(b => !hide.has(b.key)).map(b => len(b.refName)),
+        ...blocks
+            .filter(b => !hide.has(b.key))
+            .map(b => len(b.end.toLocaleString('en-us'))),
+    ]);
+};
 /**
  * #stateModel DotplotView
  * #category view
@@ -498,8 +507,11 @@ function stateModelFactory(pm) {
         },
         // if any of our assemblies are temporary assemblies
         beforeDestroy() {
+            var _a;
             const session = (0, util_1.getSession)(self);
-            self.assemblyNames.forEach(asm => session.removeTemporaryAssembly(asm));
+            for (const name in self.assemblyNames) {
+                (_a = session.removeTemporaryAssembly) === null || _a === void 0 ? void 0 : _a.call(session, name);
+            }
         },
         afterAttach() {
             (0, mobx_state_tree_1.addDisposer)(self, (0, mobx_1.autorun)(() => {
@@ -547,9 +559,8 @@ function stateModelFactory(pm) {
                 const voffset = vview.offsetPx;
                 const vhide = (0, util_2.getBlockLabelKeysToHide)(vblocks, viewHeight, voffset);
                 const hhide = (0, util_2.getBlockLabelKeysToHide)(hblocks, viewWidth, hoffset);
-                const len = (a) => (0, util_1.measureText)(a.slice(0, 30));
-                const by = (0, util_1.max)(hblocks.filter(b => !hhide.has(b.key)).map(b => len(b.refName)));
-                const bx = (0, util_1.max)(vblocks.filter(b => !vhide.has(b.key)).map(b => len(b.refName)));
+                const by = pxWidthForBlocks(hblocks, hhide);
+                const bx = pxWidthForBlocks(vblocks, vhide);
                 // these are set via autorun to avoid dependency cycle
                 self.setBorderY(Math.max(by + padding, 50));
                 self.setBorderX(Math.max(bx + padding, 50));

package/dist/DotplotView/svgcomponents/SVGBackground.js

@@ -5,8 +5,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importDefault(require("react"));
 const material_1 = require("@mui/material");
+const util_1 = require("@jbrowse/core/util");
 function SVGBackground({ width, height, }) {
     const theme = (0, material_1.useTheme)();
-    return (react_1.default.createElement("rect", { x: 0, y: 0, width: width, height: height, fill: theme.palette.background.default }));
+    return (react_1.default.createElement("rect", { x: 0, y: 0, width: width, height: height, fill: (0, util_1.stripAlpha)(theme.palette.background.default) }));
 }
 exports.default = SVGBackground;

package/dist/ServerSideRenderedBlockContent.d.ts

@@ -1,5 +1,5 @@
 import React, { CSSProperties } from 'react';
-declare const _default: ({ model, style, }: {
+declare const ServerSideRenderedDotplotContent: ({ model, style, }: {
     model: {
         error?: unknown;
         message?: string;
@@ -9,4 +9,4 @@ declare const _default: ({ model, style, }: {
     };
     style: CSSProperties;
 }) => React.JSX.Element | null;
-export default _default;
+export default ServerSideRenderedDotplotContent;

package/dist/ServerSideRenderedBlockContent.js

@@ -69,7 +69,7 @@ function BlockError({ error }) {
     return (react_1.default.createElement("div", { className: classes.blockError },
         react_1.default.createElement(material_1.Typography, null, `${error}`)));
 }
-exports.default = (0, mobx_react_1.observer)(function ({ model, style, }) {
+const ServerSideRenderedDotplotContent = (0, mobx_react_1.observer)(function ({ model, style, }) {
     if (model.error) {
         return react_1.default.createElement(BlockError, { error: model.error, "data-testid": "reload_button" });
     }
@@ -84,3 +84,4 @@ exports.default = (0, mobx_react_1.observer)(function ({ model, style, }) {
     }
     return null;
 });
+exports.default = ServerSideRenderedDotplotContent;

package/dist/ServerSideSyntenyRendering.d.ts

@@ -3,21 +3,16 @@ import React from 'react';
  * A block whose content is rendered outside of the main thread and hydrated by this
  * component.
  */
-declare function ServerSideSyntenyRendering({ model, }: {
-    model: {
-        imageData: string;
-        style: Record<string, string>;
-        renderProps: {
-            width: number;
-            height: number;
-            highResolutionScaling?: number;
-        };
-    };
-}): React.JSX.Element;
-declare namespace ServerSideSyntenyRendering {
-    var propTypes: {
-        model: import("prop-types").Validator<any>;
+interface ModelType {
+    imageData: string;
+    style: Record<string, string>;
+    renderProps: {
+        width: number;
+        height: number;
+        highResolutionScaling?: number;
     };
 }
-declare const _default: typeof ServerSideSyntenyRendering;
-export default _default;
+declare const ServerSideSyntenyRendering: ({ model, }: {
+    model: ModelType;
+}) => React.JSX.Element;
+export default ServerSideSyntenyRendering;

package/dist/ServerSideSyntenyRendering.js

@@ -23,15 +23,10 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-/* eslint-disable @typescript-eslint/no-non-null-assertion */
 const react_1 = __importStar(require("react"));
 const mobx_react_1 = require("mobx-react");
 const offscreenCanvasPonyfill_1 = require("@jbrowse/core/util/offscreenCanvasPonyfill");
-/**
- * A block whose content is rendered outside of the main thread and hydrated by this
- * component.
- */
-function ServerSideSyntenyRendering({ model, }) {
+const ServerSideSyntenyRendering = (0, mobx_react_1.observer)(function ({ model, }) {
     const { imageData, style, renderProps } = model;
     const { width, height, highResolutionScaling = 1 } = renderProps;
     const featureCanvas = (0, react_1.useRef)(null);
@@ -46,8 +41,5 @@ function ServerSideSyntenyRendering({ model, }) {
         setDone(true);
     }, [height, imageData, width]);
     return (react_1.default.createElement("canvas", { "data-testid": `prerendered_canvas${done ? '_done' : ''}`, ref: featureCanvas, width: width * highResolutionScaling, height: height * highResolutionScaling, style: { width, height, ...style } }));
-}
-ServerSideSyntenyRendering.propTypes = {
-    model: mobx_react_1.PropTypes.observableObject.isRequired,
-};
-exports.default = (0, mobx_react_1.observer)(ServerSideSyntenyRendering);
+});
+exports.default = ServerSideSyntenyRendering;

package/esm/DotplotDisplay/components/DotplotDisplay.d.ts

@@ -1,8 +1,7 @@
 import React from 'react';
 import { DotplotDisplayModel } from '../stateModelFactory';
-declare function DotplotDisplay(props: {
+declare const DotplotDisplay: (props: {
     model: DotplotDisplayModel;
     children?: React.ReactNode;
-}): React.JSX.Element;
-declare const _default: typeof DotplotDisplay;
-export default _default;
+}) => React.JSX.Element;
+export default DotplotDisplay;

package/esm/DotplotDisplay/components/DotplotDisplay.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { observer } from 'mobx-react';
 import { getContainingView } from '@jbrowse/core/util';
-function DotplotDisplay(props) {
+const DotplotDisplay = observer(function DotplotDisplay(props) {
     const { model, children } = props;
     const { offsetX = 0, offsetY = 0 } = model.data || {};
     const view = getContainingView(model);
@@ -14,5 +14,5 @@ function DotplotDisplay(props) {
                 left,
             } }),
         children));
-}
-export default observer(DotplotDisplay);
+});
+export default DotplotDisplay;

package/esm/DotplotDisplay/stateModelFactory.d.ts

@@ -50,7 +50,9 @@ export declare function stateModelFactory(configSchema: AnyConfigurationSchemaTy
     }>;
     readonly DisplayBlurb: React.FC<{
         model: {
-            id: string;
+            id: string; /**
+             * #getter
+             */
             type: string;
             rpcDriverName: string | undefined;
         } & import("mobx-state-tree/dist/internal").NonEmptyObject & {
@@ -72,9 +74,7 @@ export declare function stateModelFactory(configSchema: AnyConfigurationSchemaTy
     renderProps(): any;
     readonly rendererType: import("@jbrowse/core/pluggableElementTypes").RendererType;
     readonly DisplayMessageComponent: React.FC<any> | undefined;
-    trackMenuItems(): import("@jbrowse/core/ui").MenuItem[]; /**
-     * #action
-     */
+    trackMenuItems(): import("@jbrowse/core/ui").MenuItem[];
     readonly viewMenuActions: import("@jbrowse/core/ui").MenuItem[];
     regionCannotBeRendered(): null;
 } & {

package/esm/DotplotDisplay/stateModelFactory.js

@@ -37,9 +37,9 @@ export function stateModelFactory(configSchema) {
     })))
         .views(self => ({
         get shouldDisplay() {
-            const view = getContainingView(self);
-            return (view.vview.bpPerPx === self.data.bpPerPxY &&
-                view.hview.bpPerPx === self.data.bpPerPxX);
+            const { vview, hview } = getContainingView(self);
+            return (vview.bpPerPx === self.data.bpPerPxY &&
+                hview.bpPerPx === self.data.bpPerPxX);
         },
         /**
          * #getter

package/esm/DotplotRenderer/DotplotRenderer.js

@@ -43,7 +43,7 @@ export default class DotplotRenderer extends ComparativeRenderer {
         return args;
     }
     async drawDotplot(ctx, props) {
-        var _a, _b, _c;
+        var _a, _b;
         const { config, views, height, drawCigar, theme } = props;
         const color = readConfObject(config, 'color');
         const posColor = readConfObject(config, 'posColor');
@@ -127,7 +127,7 @@ export default class DotplotRenderer extends ComparativeRenderer {
             width: vview.width,
         };
         const t = createJBrowseTheme(theme);
-        (_c = hview.features) === null || _c === void 0 ? void 0 : _c.forEach(feature => {
+        for (const feature of hview.features || []) {
             const strand = feature.get('strand') || 1;
             const start = strand === 1 ? feature.get('start') : feature.get('end');
             const end = strand === 1 ? feature.get('end') : feature.get('start');
@@ -185,6 +185,8 @@ export default class DotplotRenderer extends ComparativeRenderer {
                         const cigarOps = parseCigar(cigar);
                         ctx.beginPath();
                         ctx.moveTo(currX, height - currY);
+                        let lastDrawnX = currX;
+                        let lastDrawnY = currX;
                         for (let i = 0; i < cigarOps.length; i += 2) {
                             const val = +cigarOps[i];
                             const op = cigarOps[i + 1];
@@ -200,7 +202,13 @@ export default class DotplotRenderer extends ComparativeRenderer {
                             }
                             currX = clampWithWarnX(currX, b1, b2, feature);
                             currY = clampWithWarnY(currY, e1, e2, feature);
-                            ctx.lineTo(currX, height - currY);
+                            // only draw a line segment if it is bigger than 0.5px
+                            if (Math.abs(currX - lastDrawnX) > 0.5 ||
+                                Math.abs(currY - lastDrawnY) > 0.5) {
+                                ctx.lineTo(currX, height - currY);
+                                lastDrawnX = currX;
+                                lastDrawnY = currY;
+                            }
                         }
                         ctx.stroke();
                     }
@@ -228,7 +236,7 @@ export default class DotplotRenderer extends ComparativeRenderer {
                     }
                 }
             }
-        });
+        }
         return { warnings };
     }
     async render(renderProps) {

package/esm/DotplotRenderer/components/DotplotRendering.d.ts

@@ -1,5 +1,4 @@
 import React from 'react';
 import { DotplotRenderArgsDeserialized } from '../DotplotRenderer';
-declare function DotplotRendering(props: DotplotRenderArgsDeserialized): React.JSX.Element;
-declare const _default: typeof DotplotRendering;
-export default _default;
+declare const DotplotRendering: (props: DotplotRenderArgsDeserialized) => React.JSX.Element;
+export default DotplotRendering;

package/esm/DotplotRenderer/components/DotplotRendering.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { PrerenderedCanvas } from '@jbrowse/core/ui';
 import { observer } from 'mobx-react';
-function DotplotRendering(props) {
+const DotplotRendering = observer(function (props) {
     return React.createElement(PrerenderedCanvas, { ...props });
-}
-export default observer(DotplotRendering);
+});
+export default DotplotRendering;

package/esm/DotplotView/blockTypes.d.ts

@@ -23,15 +23,7 @@ export declare class BaseBlock {
     /**
      * a block that should be shown as filled with data
      */
-    constructor(data: any);
-    /**
-     * rename the reference sequence of this block and return a new one
-     *
-     * @param refName -
-     * @returns either a new block with a renamed reference sequence,
-     * or the same block, if the ref name is not actually different
-     */
-    renameReference(refName: string): any;
+    constructor(data: Record<string, any>);
     toRegion(): {
         refName: string;
         start: number;

package/esm/DotplotView/blockTypes.js

@@ -1,3 +1,4 @@
+import { sum } from '@jbrowse/core/util';
 export class BlockSet {
     constructor(blocks = []) {
         this.blocks = blocks;
@@ -28,7 +29,7 @@ export class BlockSet {
     }
     get totalWidthPx() {
         return this.blocks.length
-            ? this.blocks.map(blocks => blocks.widthPx).reduce((a, b) => a + b)
+            ? sum(this.blocks.map(blocks => blocks.widthPx))
             : 0;
     }
     get offsetPx() {
@@ -53,20 +54,6 @@ export class BaseBlock {
         this.end = data.end;
         this.key = data.key;
     }
-    /**
-     * rename the reference sequence of this block and return a new one
-     *
-     * @param refName -
-     * @returns either a new block with a renamed reference sequence,
-     * or the same block, if the ref name is not actually different
-     */
-    renameReference(refName) {
-        if (this.refName && refName !== this.refName) {
-            // eslint-disable-next-line @typescript-eslint/no-explicit-any
-            return new this.constructor({ ...this, refName });
-        }
-        return this;
-    }
     toRegion() {
         return {
             refName: this.refName,