@jbrowse/plugin-variants 3.3.0 → 3.4.0

package/dist/shared/drawAlleleCount.js

@@ -1,30 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.getColorAlleleCount = getColorAlleleCount;
 exports.drawColorAlleleCount = drawColorAlleleCount;
 const colord_1 = require("@jbrowse/core/util/colord");
 const constants_1 = require("./constants");
-function getColorAlleleCount(alleles, mostFrequentAlt, drawReference = true) {
-    const total = alleles.length;
-    let alt = 0;
-    let uncalled = 0;
-    let alt2 = 0;
-    let ref = 0;
-    for (const allele of alleles) {
-        if (allele === mostFrequentAlt) {
-            alt++;
-        }
-        else if (allele === '0') {
-            ref++;
-        }
-        else if (allele === '.') {
-            uncalled++;
-        }
-        else {
-            alt2++;
-        }
-    }
+function getColorAlleleCount(ref, alt, alt2, uncalled, total, drawReference = true) {
     if (ref === total) {
-        return drawReference ? '#ccc' : undefined;
+        return drawReference ? '#ccc' : '';
     }
     else {
         let a1;
@@ -42,31 +24,27 @@ function getColorAlleleCount(alleles, mostFrequentAlt, drawReference = true) {
         return (a1 === null || a1 === void 0 ? void 0 : a1.toHex()) || 'black';
     }
 }
-function drawColorAlleleCount(alleles, ctx, x, y, w, h, mostFrequentAlt, drawReference = true, featureType = '', featureStrand, alpha = 1) {
-    const c = getColorAlleleCount(alleles, mostFrequentAlt, drawReference);
-    if (c) {
-        ctx.fillStyle = alpha !== 1 ? (0, colord_1.colord)(c).alpha(alpha).toHex() : c;
-        if (featureType === 'inversion') {
-            if (featureStrand === 1) {
-                ctx.beginPath();
-                ctx.moveTo(x - constants_1.f2, y - constants_1.f2);
-                ctx.lineTo(x - constants_1.f2, y + h + constants_1.f2);
-                ctx.lineTo(x + w + constants_1.f2, y + h / 2);
-                ctx.closePath();
-                ctx.fill();
-            }
-            else {
-                ctx.beginPath();
-                ctx.moveTo(x + w + constants_1.f2, y - constants_1.f2);
-                ctx.lineTo(x + w + constants_1.f2, y + h + constants_1.f2);
-                ctx.lineTo(x - constants_1.f2, y + h / 2);
-                ctx.closePath();
-                ctx.fill();
-            }
+function drawColorAlleleCount(c, ctx, x, y, w, h, featureType = '', featureStrand, alpha = 1) {
+    ctx.fillStyle = alpha !== 1 ? (0, colord_1.colord)(c).alpha(alpha).toHex() : c;
+    if (featureType === 'inversion') {
+        if (featureStrand === 1) {
+            ctx.beginPath();
+            ctx.moveTo(x - constants_1.f2, y - constants_1.f2);
+            ctx.lineTo(x - constants_1.f2, y + h + constants_1.f2);
+            ctx.lineTo(x + w + constants_1.f2, y + h / 2);
+            ctx.closePath();
+            ctx.fill();
         }
         else {
-            ctx.fillRect(x - constants_1.f2, y - constants_1.f2, w + constants_1.f2, h + constants_1.f2);
+            ctx.beginPath();
+            ctx.moveTo(x + w + constants_1.f2, y - constants_1.f2);
+            ctx.lineTo(x + w + constants_1.f2, y + h + constants_1.f2);
+            ctx.lineTo(x - constants_1.f2, y + h / 2);
+            ctx.closePath();
+            ctx.fill();
         }
     }
-    return c;
+    else {
+        ctx.fillRect(x - constants_1.f2, y - constants_1.f2, w + constants_1.f2, h + constants_1.f2);
+    }
 }

package/dist/shared/minorAlleleFrequencyUtils.d.ts

@@ -1,7 +1,7 @@
 import type { Feature } from '@jbrowse/core/util';
 export declare function findSecondLargestNumber(arr: Iterable<number>): number;
-export declare function calculateAlleleCounts(feat: Feature): Map<any, any>;
-export declare function calculateMinorAlleleFrequency(alleleCounts: Map<string, number>): number;
+export declare function calculateAlleleCounts(feat: Feature): Record<string, number>;
+export declare function calculateMinorAlleleFrequency(alleleCounts: Record<string, number>): number;
 export declare function getFeaturesThatPassMinorAlleleFrequencyFilter({ features, minorAlleleFrequencyFilter, lengthCutoffFilter, stopToken, }: {
     features: Iterable<Feature>;
     minorAlleleFrequencyFilter: number;
@@ -10,5 +10,5 @@ export declare function getFeaturesThatPassMinorAlleleFrequencyFilter({ features
 }): {
     feature: Feature;
     mostFrequentAlt: string;
-    alleleCounts: Map<string, number>;
+    alleleCounts: Record<string, number>;
 }[];

package/dist/shared/minorAlleleFrequencyUtils.js

@@ -20,24 +20,30 @@ function findSecondLargestNumber(arr) {
     return secondMax;
 }
 function calculateAlleleCounts(feat) {
-    const samp = feat.get('genotypes');
-    const alleleCounts = new Map();
-    for (const val of Object.values(samp)) {
-        const alleles = val.split(/[/|]/);
-        for (const allele of alleles) {
-            alleleCounts.set(allele, (alleleCounts.get(allele) || 0) + 1);
+    var _a;
+    const genotypes = feat.get('genotypes');
+    const alleleCounts = { 0: 0, 1: 0, '.': 0 };
+    const cacheSplit = {};
+    const vals = Object.values(genotypes);
+    const len = vals.length;
+    for (let i = 0; i < len; i++) {
+        const genotype = vals[i];
+        const alleles = cacheSplit[genotype] || (cacheSplit[genotype] = genotype.split(/[/|]/));
+        for (let i = 0, len = alleles.length; i < len; i++) {
+            const a = alleles[i];
+            alleleCounts[a] = ((_a = alleleCounts[a]) !== null && _a !== void 0 ? _a : 0) + 1;
         }
     }
     return alleleCounts;
 }
 function calculateMinorAlleleFrequency(alleleCounts) {
-    return (findSecondLargestNumber(alleleCounts.values()) /
-        ((0, util_1.sum)(alleleCounts.values()) || 1));
+    return (findSecondLargestNumber(Object.values(alleleCounts)) /
+        ((0, util_1.sum)(Object.values(alleleCounts)) || 1));
 }
 function getMostFrequentAlt(alleleCounts) {
     let mostFrequentAlt;
     let max = 0;
-    for (const [alt, altCount] of alleleCounts.entries()) {
+    for (const [alt, altCount] of Object.entries(alleleCounts)) {
         if (alt !== '.' && alt !== '0') {
             if (altCount > max) {
                 mostFrequentAlt = alt;

package/esm/LinearVariantDisplay/model.d.ts

@@ -200,7 +200,7 @@ export default function stateModelFactory(configSchema: AnyConfigurationSchemaTy
 } & {
     addBlock(key: string, block: import("@jbrowse/core/util/blockTypes").BaseBlock): void;
     deleteBlock(key: string): void;
-    selectFeature(feature: Feature): void;
+    selectFeature(feature: Feature): Promise<void>;
     navToFeature(feature: Feature): void;
     clearFeatureSelection(): void;
     setFeatureIdUnderMouse(feature?: string): void;

package/esm/MultiLinearVariantDisplay/model.d.ts

@@ -208,7 +208,7 @@ export declare function stateModelFactory(configSchema: AnyConfigurationSchemaTy
 } & {
     addBlock(key: string, block: import("@jbrowse/core/util/blockTypes").BaseBlock): void;
     deleteBlock(key: string): void;
-    selectFeature(feature: import("@jbrowse/core/util").Feature): void;
+    selectFeature(feature: import("@jbrowse/core/util").Feature): Promise<void>;
     navToFeature(feature: import("@jbrowse/core/util").Feature): void;
     clearFeatureSelection(): void;
     setFeatureIdUnderMouse(feature?: string): void;

package/esm/MultiLinearVariantMatrixDisplay/model.d.ts

@@ -208,7 +208,7 @@ export default function stateModelFactory(configSchema: AnyConfigurationSchemaTy
 } & {
     addBlock(key: string, block: import("@jbrowse/core/util/blockTypes").BaseBlock): void;
     deleteBlock(key: string): void;
-    selectFeature(feature: import("@jbrowse/core/util").Feature): void;
+    selectFeature(feature: import("@jbrowse/core/util").Feature): Promise<void>;
     navToFeature(feature: import("@jbrowse/core/util").Feature): void;
     clearFeatureSelection(): void;
     setFeatureIdUnderMouse(feature?: string): void;

package/esm/MultiLinearVariantMatrixRenderer/MultiLinearVariantMatrixRenderer.d.ts

@@ -1,7 +1,6 @@
 import BoxRendererType from '@jbrowse/core/pluggableElementTypes/renderers/BoxRendererType';
 import { SimpleFeature } from '@jbrowse/core/util';
 import type { RenderArgsDeserialized } from './types';
-import type { Feature } from '@jbrowse/core/util';
 export default class LinearVariantMatrixRenderer extends BoxRendererType {
     supportsSVG: boolean;
     render(renderProps: RenderArgsDeserialized): Promise<{
@@ -10,8 +9,8 @@ export default class LinearVariantMatrixRenderer extends BoxRendererType {
         height: number;
         width: number;
         arr: string[][];
-        canvasRecordedData: any;
-        layout: import("@jbrowse/core/util/layouts").BaseLayout<Feature>;
+        canvasRecordedData: Record<string, unknown>;
+        layout: import("@jbrowse/core/util/layouts/BaseLayout").BaseLayout<import("@jbrowse/core/util").Feature>;
         reactElement?: React.ReactElement;
         html?: string;
     } | {
@@ -20,8 +19,9 @@ export default class LinearVariantMatrixRenderer extends BoxRendererType {
         height: number;
         width: number;
         arr: string[][];
-        reactElement: import("react/jsx-runtime").JSX.Element;
-        layout: import("@jbrowse/core/util/layouts").BaseLayout<Feature>;
+        imageData: any;
+        layout: import("@jbrowse/core/util/layouts/BaseLayout").BaseLayout<import("@jbrowse/core/util").Feature>;
+        reactElement?: React.ReactElement;
         html?: string;
     } | {
         features: Map<any, any>;
@@ -29,9 +29,8 @@ export default class LinearVariantMatrixRenderer extends BoxRendererType {
         height: number;
         width: number;
         arr: string[][];
-        imageData: any;
-        layout: import("@jbrowse/core/util/layouts").BaseLayout<Feature>;
-        reactElement?: React.ReactElement;
+        reactElement: React.ReactElement;
+        layout: import("@jbrowse/core/util/layouts/BaseLayout").BaseLayout<import("@jbrowse/core/util").Feature>;
         html?: string;
     }>;
 }

package/esm/MultiLinearVariantMatrixRenderer/MultiLinearVariantMatrixRenderer.js

@@ -12,7 +12,7 @@ export default class LinearVariantMatrixRenderer extends BoxRendererType {
         const { end, start } = region;
         const width = (end - start) / bpPerPx;
         const { makeImageData } = await import('./makeImageData');
-        const { mafs, ...res } = await renderToAbstractCanvas(width, height, renderProps, ctx => makeImageData({
+        const { mafs, ...rest } = await renderToAbstractCanvas(width, height, renderProps, ctx => makeImageData({
             ctx,
             canvasWidth: width,
             canvasHeight: height,
@@ -24,14 +24,14 @@ export default class LinearVariantMatrixRenderer extends BoxRendererType {
         }));
         const results = await super.render({
             ...renderProps,
-            ...res,
+            ...rest,
             features,
             height,
             width,
         });
         return {
             ...results,
-            ...res,
+            ...rest,
             features: new Map(),
             simplifiedFeatures: mafs.map(({ feature }) => new SimpleFeature({
                 id: feature.id(),

package/esm/MultiLinearVariantMatrixRenderer/makeImageData.d.ts

@@ -8,7 +8,7 @@ export declare function makeImageData({ ctx, canvasWidth, canvasHeight, renderAr
     mafs: {
         feature: import("@jbrowse/core/util").Feature;
         mostFrequentAlt: string;
-        alleleCounts: Map<string, number>;
+        alleleCounts: Record<string, number>;
     }[];
     arr: string[][];
 }>;

package/esm/MultiLinearVariantMatrixRenderer/makeImageData.js

@@ -1,7 +1,7 @@
 import { forEachWithStopTokenCheck, updateStatus } from '@jbrowse/core/util';
 import { checkStopToken } from '@jbrowse/core/util/stopToken';
 import { f2 } from '../shared/constants';
-import { drawColorAlleleCount } from '../shared/drawAlleleCount';
+import { drawColorAlleleCount, getColorAlleleCount, } from '../shared/drawAlleleCount';
 import { drawPhased } from '../shared/drawPhased';
 import { getFeaturesThatPassMinorAlleleFrequencyFilter } from '../shared/minorAlleleFrequencyUtils';
 export async function makeImageData({ ctx, canvasWidth, canvasHeight, renderArgs, }) {
@@ -9,17 +9,18 @@ export async function makeImageData({ ctx, canvasWidth, canvasHeight, renderArgs
     const { statusCallback = () => { } } = renderArgs;
     const h = canvasHeight / sources.length;
     checkStopToken(stopToken);
-    const mafs = getFeaturesThatPassMinorAlleleFrequencyFilter({
+    const mafs = await updateStatus('Calculating stats', statusCallback, () => getFeaturesThatPassMinorAlleleFrequencyFilter({
         stopToken,
         features: features.values(),
         minorAlleleFrequencyFilter,
         lengthCutoffFilter,
-    });
+    }));
     checkStopToken(stopToken);
     const arr = [];
     const m = mafs.length;
     const w = canvasWidth / m;
     await updateStatus('Drawing variant matrix', statusCallback, () => {
+        const colorCache = {};
         forEachWithStopTokenCheck(mafs, stopToken, ({ feature, mostFrequentAlt }, idx) => {
             var _a, _b, _c;
             const arr2 = [];
@@ -49,8 +50,35 @@ export async function makeImageData({ ctx, canvasWidth, canvasHeight, renderArgs
                                 }
                             }
                             else {
-                                const alleles = genotype.split(/[/|]/);
-                                drawColorAlleleCount(alleles, ctx, x, y, w, h, mostFrequentAlt);
+                                let c = colorCache[genotype];
+                                if (c === undefined) {
+                                    let alt = 0;
+                                    let uncalled = 0;
+                                    let alt2 = 0;
+                                    let ref = 0;
+                                    const alleles = genotype.split(/[/|]/);
+                                    const total = alleles.length;
+                                    for (let i = 0; i < total; i++) {
+                                        const allele = alleles[i];
+                                        if (allele === mostFrequentAlt) {
+                                            alt++;
+                                        }
+                                        else if (allele === '0') {
+                                            ref++;
+                                        }
+                                        else if (allele === '.') {
+                                            uncalled++;
+                                        }
+                                        else {
+                                            alt2++;
+                                        }
+                                    }
+                                    c = getColorAlleleCount(ref, alt, alt2, uncalled, total, true);
+                                    colorCache[genotype] = c;
+                                }
+                                if (c) {
+                                    drawColorAlleleCount(c, ctx, x, y, w, h);
+                                }
                             }
                         }
                     }
@@ -78,8 +106,35 @@ export async function makeImageData({ ctx, canvasWidth, canvasHeight, renderArgs
                             }
                         }
                         else {
-                            const alleles = genotype.split(/[/|]/);
-                            drawColorAlleleCount(alleles, ctx, x, y, w, h, mostFrequentAlt);
+                            let c = colorCache[genotype];
+                            if (c === undefined) {
+                                let alt = 0;
+                                let uncalled = 0;
+                                let alt2 = 0;
+                                let ref = 0;
+                                const alleles = genotype.split(/[/|]/);
+                                const total = alleles.length;
+                                for (let i = 0; i < total; i++) {
+                                    const allele = alleles[i];
+                                    if (allele === mostFrequentAlt) {
+                                        alt++;
+                                    }
+                                    else if (allele === '0') {
+                                        ref++;
+                                    }
+                                    else if (allele === '.') {
+                                        uncalled++;
+                                    }
+                                    else {
+                                        alt2++;
+                                    }
+                                }
+                                c = getColorAlleleCount(ref, alt, alt2, uncalled, total, true);
+                                colorCache[genotype] = c;
+                            }
+                            if (c) {
+                                drawColorAlleleCount(c, ctx, x, y, w, h);
+                            }
                         }
                     }
                 }

package/esm/MultiLinearVariantRenderer/MultiVariantRenderer.d.ts

@@ -18,7 +18,7 @@ export default class MultiVariantBaseRenderer extends FeatureRendererType {
                 length: number;
             };
         };
-        canvasRecordedData: any;
+        canvasRecordedData: Record<string, unknown>;
         reactElement?: React.ReactElement;
         html?: string;
     } | {
@@ -36,7 +36,8 @@ export default class MultiVariantBaseRenderer extends FeatureRendererType {
                 length: number;
             };
         };
-        reactElement: import("react/jsx-runtime").JSX.Element;
+        imageData: any;
+        reactElement?: React.ReactElement;
         html?: string;
     } | {
         features: Map<string, Feature>;
@@ -53,8 +54,7 @@ export default class MultiVariantBaseRenderer extends FeatureRendererType {
                 length: number;
             };
         };
-        imageData: any;
-        reactElement?: React.ReactElement;
+        reactElement: React.ReactElement;
         html?: string;
     }>;
 }

package/esm/MultiLinearVariantRenderer/MultiVariantRenderer.js

@@ -11,7 +11,7 @@ export default class MultiVariantBaseRenderer extends FeatureRendererType {
         const region = regions[0];
         const width = (region.end - region.start) / bpPerPx;
         const { makeImageData } = await import('./makeImageData');
-        const rest = await renderToAbstractCanvas(width, height, renderProps, ctx => {
+        const ret = await renderToAbstractCanvas(width, height, renderProps, ctx => {
             if (referenceDrawingMode === 'skip') {
                 ctx.fillStyle = '#ccc';
                 ctx.fillRect(0, 0, width, height);
@@ -23,14 +23,14 @@ export default class MultiVariantBaseRenderer extends FeatureRendererType {
         });
         const results = await super.render({
             ...renderProps,
-            ...rest,
+            ...ret,
             features,
             height,
             width,
         });
         return {
             ...results,
-            ...rest,
+            ...ret,
             features: new Map(),
             height,
             width,

package/esm/MultiLinearVariantRenderer/makeImageData.js

@@ -1,39 +1,97 @@
-import { featureSpanPx, forEachWithStopTokenCheck } from '@jbrowse/core/util';
+import { featureSpanPx, forEachWithStopTokenCheck, updateStatus, } from '@jbrowse/core/util';
 import { checkStopToken } from '@jbrowse/core/util/stopToken';
 import RBush from 'rbush';
 import { f2 } from '../shared/constants';
-import { drawColorAlleleCount } from '../shared/drawAlleleCount';
+import { drawColorAlleleCount, getColorAlleleCount, } from '../shared/drawAlleleCount';
 import { drawPhased } from '../shared/drawPhased';
 import { getFeaturesThatPassMinorAlleleFrequencyFilter } from '../shared/minorAlleleFrequencyUtils';
 export async function makeImageData(ctx, props) {
     const { scrollTop, minorAlleleFrequencyFilter, sources, rowHeight, features, regions, bpPerPx, renderingMode, stopToken, lengthCutoffFilter, referenceDrawingMode, } = props;
     const region = regions[0];
+    const { statusCallback = () => { } } = props;
     checkStopToken(stopToken);
-    const mafs = getFeaturesThatPassMinorAlleleFrequencyFilter({
+    const mafs = await updateStatus('Calculating stats', statusCallback, () => getFeaturesThatPassMinorAlleleFrequencyFilter({
         stopToken,
         features: features.values(),
         minorAlleleFrequencyFilter,
         lengthCutoffFilter,
-    });
+    }));
     checkStopToken(stopToken);
     const rbush = new RBush();
-    forEachWithStopTokenCheck(mafs, stopToken, ({ mostFrequentAlt, feature }) => {
-        const [leftPx, rightPx] = featureSpanPx(feature, region, bpPerPx);
-        const w = Math.max(Math.round(rightPx - leftPx), 2);
-        const samp = feature.get('genotypes');
-        let y = -scrollTop;
-        const s = sources.length;
-        if (renderingMode === 'phased') {
-            for (let j = 0; j < s; j++) {
-                const { name, HP } = sources[j];
-                const genotype = samp[name];
-                const x = Math.floor(leftPx);
-                const h = Math.max(rowHeight, 1);
-                if (genotype) {
-                    const isPhased = genotype.includes('|');
-                    if (isPhased) {
-                        const alleles = genotype.split('|');
-                        if (drawPhased(alleles, ctx, x, y, w, h, HP, undefined, referenceDrawingMode === 'draw')) {
+    await updateStatus('Drawing variants', statusCallback, () => {
+        forEachWithStopTokenCheck(mafs, stopToken, ({ mostFrequentAlt, feature }) => {
+            const [leftPx, rightPx] = featureSpanPx(feature, region, bpPerPx);
+            const flen = feature.get('end') - feature.get('start');
+            const w = Math.max(Math.round(rightPx - leftPx), 2);
+            const samp = feature.get('genotypes');
+            let y = -scrollTop;
+            const s = sources.length;
+            if (renderingMode === 'phased') {
+                for (let j = 0; j < s; j++) {
+                    const { name, HP } = sources[j];
+                    const genotype = samp[name];
+                    const x = Math.floor(leftPx);
+                    const h = Math.max(rowHeight, 1);
+                    if (genotype) {
+                        const isPhased = genotype.includes('|');
+                        if (isPhased) {
+                            const alleles = genotype.split('|');
+                            if (drawPhased(alleles, ctx, x, y, w, h, HP, undefined, referenceDrawingMode === 'draw')) {
+                                rbush.insert({
+                                    minX: x,
+                                    maxX: x + w,
+                                    minY: y,
+                                    maxY: y + h,
+                                    genotype,
+                                    name,
+                                    featureId: feature.id(),
+                                });
+                            }
+                        }
+                        else {
+                            ctx.fillStyle = 'black';
+                            ctx.fillRect(x - f2, y - f2, w + f2, h + f2);
+                        }
+                    }
+                    y += rowHeight;
+                }
+            }
+            else {
+                const colorCache = {};
+                for (let j = 0; j < s; j++) {
+                    const { name } = sources[j];
+                    const genotype = samp[name];
+                    const x = Math.floor(leftPx);
+                    const h = Math.max(rowHeight, 1);
+                    if (genotype) {
+                        let c = colorCache[genotype];
+                        if (c === undefined) {
+                            let alt = 0;
+                            let uncalled = 0;
+                            let alt2 = 0;
+                            let ref = 0;
+                            const alleles = genotype.split(/[/|]/);
+                            const total = alleles.length;
+                            for (let i = 0; i < total; i++) {
+                                const allele = alleles[i];
+                                if (allele === mostFrequentAlt) {
+                                    alt++;
+                                }
+                                else if (allele === '0') {
+                                    ref++;
+                                }
+                                else if (allele === '.') {
+                                    uncalled++;
+                                }
+                                else {
+                                    alt2++;
+                                }
+                            }
+                            c = getColorAlleleCount(ref, alt, alt2, uncalled, total, referenceDrawingMode === 'draw');
+                            colorCache[genotype] = c;
+                        }
+                        if (c) {
+                            drawColorAlleleCount(c, ctx, x, y, w, h, feature.get('type'), feature.get('strand'), flen > 5 ? 0.75 : 1);
                             rbush.insert({
                                 minX: x,
                                 maxX: x + w,
@@ -45,37 +103,10 @@ export async function makeImageData(ctx, props) {
                             });
                         }
                     }
-                    else {
-                        ctx.fillStyle = 'black';
-                        ctx.fillRect(x - f2, y - f2, w + f2, h + f2);
-                    }
-                }
-                y += rowHeight;
-            }
-        }
-        else {
-            for (let j = 0; j < s; j++) {
-                const { name } = sources[j];
-                const genotype = samp[name];
-                const x = Math.floor(leftPx);
-                const h = Math.max(rowHeight, 1);
-                if (genotype) {
-                    const alleles = genotype.split(/[/|]/);
-                    if (drawColorAlleleCount(alleles, ctx, x, y, w, h, mostFrequentAlt, referenceDrawingMode === 'draw', feature.get('type'), feature.get('strand'), 0.75)) {
-                        rbush.insert({
-                            minX: x,
-                            maxX: x + w,
-                            minY: y,
-                            maxY: y + h,
-                            genotype,
-                            name,
-                            featureId: feature.id(),
-                        });
-                    }
+                    y += rowHeight;
                 }
-                y += rowHeight;
             }
-        }
+        });
     });
     return {
         rbush: rbush.toJSON(),

package/esm/MultiLinearVariantRenderer/types.d.ts

@@ -17,4 +17,5 @@ export interface MultiRenderArgsDeserialized extends RenderArgsDeserializedWithF
     scrollTop: number;
     minorAlleleFrequencyFilter: number;
     lengthCutoffFilter: number;
+    statusCallback?: (arg: string) => void;
 }

package/esm/MultiVariantBaseRenderer.d.ts

@@ -22,7 +22,7 @@ export default abstract class MultiVariantBaseRenderer extends FeatureRendererTy
         height: number;
         width: number;
         containsNoTransferables: boolean;
-        canvasRecordedData: any;
+        canvasRecordedData: Record<string, unknown>;
         reactElement?: React.ReactElement;
         html?: string;
     } | {
@@ -30,15 +30,15 @@ export default abstract class MultiVariantBaseRenderer extends FeatureRendererTy
         height: number;
         width: number;
         containsNoTransferables: boolean;
-        reactElement: import("react/jsx-runtime").JSX.Element;
+        imageData: any;
+        reactElement?: React.ReactElement;
         html?: string;
     } | {
         features: Map<string, Feature>;
         height: number;
         width: number;
         containsNoTransferables: boolean;
-        imageData: any;
-        reactElement?: React.ReactElement;
+        reactElement: React.ReactElement;
         html?: string;
     }>;
     abstract draw<T extends RenderArgsDeserializedWithFeatures>(ctx: CanvasRenderingContext2D, props: T): Promise<Record<string, unknown> | undefined>;

package/esm/SplitVcfTabixAdapter/SplitVcfTabixAdapter.d.ts

@@ -15,5 +15,4 @@ export default class SplitVcfTabixAdapter extends BaseFeatureDataAdapter {
     getSources(): Promise<{
         name: string;
     }[]>;
-    freeResources(): void;
 }

package/esm/SplitVcfTabixAdapter/SplitVcfTabixAdapter.js

@@ -83,5 +83,4 @@ export default class SplitVcfTabixAdapter extends BaseFeatureDataAdapter {
                 .filter(f => s.has(f.name));
         }
     }
-    freeResources() { }
 }

package/esm/VariantFeatureWidget/VariantFeatureWidget.js

@@ -44,10 +44,9 @@ function LaunchBreakendWidgetArea({ model, }) {
             },
         }, model: model, locStrings: [`${feat.refName}:${feat.end}`] })) : null;
 }
-const VariantFeatureWidget = observer(function (props) {
-    const { model } = props;
-    const { featureData, descriptions } = model;
-    const feat = JSON.parse(JSON.stringify(featureData));
+const FeatDefined = observer(function (props) {
+    const { feat, model } = props;
+    const { descriptions } = model;
     const { samples, ...rest } = feat;
     const { REF } = rest;
     return (_jsxs(Paper, { "data-testid": "variant-side-drawer", children: [_jsx(FeatureDetails, { feature: rest, descriptions: {
@@ -57,4 +56,10 @@ const VariantFeatureWidget = observer(function (props) {
                     return key === 'ALT' ? (_jsx(AltFormatter, { value: `${value}`, ref: REF })) : (_jsx(Formatter, { value: value }));
                 }, ...props }), _jsxs(Suspense, { fallback: null, children: [_jsx(CsqPanel, { feature: rest, descriptions: descriptions }), _jsx(AnnPanel, { feature: rest, descriptions: descriptions }), _jsx(LaunchBreakendWidgetArea, { model: model })] }), _jsx(VariantSampleGrid, { feature: feat, ...props, descriptions: descriptions })] }));
 });
+const VariantFeatureWidget = observer(function (props) {
+    const { model } = props;
+    const { featureData } = model;
+    const feat = structuredClone(featureData);
+    return feat ? (_jsx(FeatDefined, { feat: feat, ...props })) : (_jsx("div", { children: "No feature loaded, may not be available after page refresh because it was too large for localStorage" }));
+});
 export default VariantFeatureWidget;