@jbrowse/plugin-variants 2.18.0 → 3.0.0

package/dist/MultiLinearVariantMatrixRenderer/components/LinearVariantMatrixRendering.js

@@ -1,12 +1,38 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importDefault(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const ui_1 = require("@jbrowse/core/ui");
 const mobx_react_1 = require("mobx-react");
 const LinearVariantMatrixRendering = (0, mobx_react_1.observer)(function (props) {
-    return react_1.default.createElement(ui_1.PrerenderedCanvas, { ...props });
+    const { arr, width, height, displayModel } = props;
+    const ref = (0, react_1.useRef)(null);
+    function getFeatureUnderMouse(eventClientX, eventClientY) {
+        var _a, _b;
+        let offsetX = 0;
+        let offsetY = 0;
+        if (ref.current) {
+            const r = ref.current.getBoundingClientRect();
+            offsetX = eventClientX - r.left;
+            offsetY = eventClientY - r.top;
+        }
+        const dimY = arr.length;
+        const dimX = ((_a = arr[0]) === null || _a === void 0 ? void 0 : _a.length) || 0;
+        return (_b = arr[Math.floor((offsetX / width) * dimY)]) === null || _b === void 0 ? void 0 : _b[Math.floor((offsetY / height) * dimX)];
+    }
+    return ((0, jsx_runtime_1.jsx)("div", { ref: ref, onMouseMove: e => {
+            var _a;
+            return (_a = displayModel.setHoveredGenotype) === null || _a === void 0 ? void 0 : _a.call(displayModel, getFeatureUnderMouse(e.clientX, e.clientY));
+        }, onMouseLeave: () => {
+            var _a;
+            (_a = displayModel.setHoveredGenotype) === null || _a === void 0 ? void 0 : _a.call(displayModel, undefined);
+        }, onMouseOut: () => {
+            var _a;
+            (_a = displayModel.setHoveredGenotype) === null || _a === void 0 ? void 0 : _a.call(displayModel, undefined);
+        }, style: {
+            overflow: 'visible',
+            position: 'relative',
+            height,
+        }, children: (0, jsx_runtime_1.jsx)(ui_1.PrerenderedCanvas, { ...props }) }));
 });
 exports.default = LinearVariantMatrixRendering;

package/dist/MultiLinearVariantMatrixRenderer/index.js

@@ -4,15 +4,15 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = LinearVariantMatrixRendererF;
-const ui_1 = require("@jbrowse/core/ui");
 const LinearVariantMatrixRenderer_1 = __importDefault(require("./LinearVariantMatrixRenderer"));
+const LinearVariantMatrixRendering_1 = __importDefault(require("./components/LinearVariantMatrixRendering"));
 const configSchema_1 = __importDefault(require("./configSchema"));
 function LinearVariantMatrixRendererF(pluginManager) {
     pluginManager.addRendererType(() => {
         return new LinearVariantMatrixRenderer_1.default({
             name: 'LinearVariantMatrixRenderer',
             displayName: 'Linear variant matrix renderer',
-            ReactComponent: ui_1.PrerenderedCanvas,
+            ReactComponent: LinearVariantMatrixRendering_1.default,
             configSchema: configSchema_1.default,
             pluginManager,
         });

package/dist/MultiLinearVariantMatrixRenderer/makeImageData.d.ts

@@ -0,0 +1,10 @@
+import type { RenderArgsDeserializedWithFeaturesAndLayout } from './types';
+export declare function makeImageData({ ctx, canvasWidth, canvasHeight, renderArgs, }: {
+    ctx: CanvasRenderingContext2D;
+    canvasWidth: number;
+    canvasHeight: number;
+    renderArgs: RenderArgsDeserializedWithFeaturesAndLayout;
+}): {
+    mafs: import("@jbrowse/core/util").Feature[];
+    arr: string[][];
+};

package/dist/MultiLinearVariantMatrixRenderer/makeImageData.js

@@ -0,0 +1,100 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.makeImageData = makeImageData;
+const multiVariantColor_1 = require("../shared/multiVariantColor");
+const util_1 = require("../util");
+const fudgeFactor = 0.6;
+const f2 = fudgeFactor / 2;
+function drawColorAlleleCount(alleles, ctx, x, y, w, h) {
+    ctx.fillStyle = (0, multiVariantColor_1.getColorAlleleCount)(alleles);
+    ctx.fillRect(x - f2, y - f2, w + f2, h + f2);
+}
+function drawPhased(alleles, ctx, x, y, w, h, HP, PS) {
+    ctx.fillStyle =
+        PS !== undefined
+            ? (0, multiVariantColor_1.getColorPhasedWithPhaseSet)(alleles, HP, PS)
+            : (0, multiVariantColor_1.getColorPhased)(alleles, HP);
+    ctx.fillRect(x - f2, y - f2, w + f2, h + f2);
+}
+function makeImageData({ ctx, canvasWidth, canvasHeight, renderArgs, }) {
+    var _a, _b;
+    const { renderingMode: renderingMode, minorAlleleFrequencyFilter, sources, features, } = renderArgs;
+    const { statusCallback = () => { } } = renderArgs;
+    statusCallback('Drawing variant matrix');
+    const h = canvasHeight / sources.length;
+    const mafs = (0, util_1.getFeaturesThatPassMinorAlleleFrequencyFilter)(features.values(), minorAlleleFrequencyFilter);
+    const arr = [];
+    const m = mafs.length;
+    const w = canvasWidth / m;
+    for (let i = 0; i < m; i++) {
+        const arr2 = [];
+        const f = mafs[i];
+        const hasPhaseSet = f.get('format').includes('PS');
+        if (hasPhaseSet) {
+            const samp = f.get('samples');
+            const x = (i / mafs.length) * canvasWidth;
+            const sln = sources.length;
+            for (let j = 0; j < sln; j++) {
+                const y = (j / sln) * canvasHeight;
+                const { name, HP } = sources[j];
+                const s = samp[name];
+                if (s) {
+                    const genotype = (_a = s.GT) === null || _a === void 0 ? void 0 : _a[0];
+                    if (genotype) {
+                        arr2.push(genotype);
+                        const isPhased = genotype.includes('|');
+                        if (renderingMode === 'phased') {
+                            if (isPhased) {
+                                const PS = (_b = s.PS) === null || _b === void 0 ? void 0 : _b[0];
+                                const alleles = genotype.split('|');
+                                drawPhased(alleles, ctx, x, y, w, h, HP, PS);
+                            }
+                            else {
+                                ctx.fillStyle = 'black';
+                                ctx.fillRect(x - f2, y - f2, w + f2, h + f2);
+                            }
+                        }
+                        else {
+                            const alleles = genotype.split(/[/|]/);
+                            drawColorAlleleCount(alleles, ctx, x, y, w, h);
+                        }
+                    }
+                }
+            }
+        }
+        else {
+            const samp = f.get('genotypes');
+            const x = (i / mafs.length) * canvasWidth;
+            const sln = sources.length;
+            const arr2 = [];
+            for (let j = 0; j < sln; j++) {
+                const y = (j / sln) * canvasHeight;
+                const { name, HP } = sources[j];
+                const genotype = samp[name];
+                if (genotype) {
+                    arr2.push(genotype);
+                    const isPhased = genotype.includes('|');
+                    if (renderingMode === 'phased') {
+                        if (isPhased) {
+                            const alleles = genotype.split('|');
+                            drawPhased(alleles, ctx, x, y, w, h, HP);
+                        }
+                        else {
+                            ctx.fillStyle = 'black';
+                            ctx.fillRect(x - f2, y - f2, w + f2, h + f2);
+                        }
+                    }
+                    else {
+                        const alleles = genotype.split(/[/|]/);
+                        drawColorAlleleCount(alleles, ctx, x, y, w, h);
+                    }
+                }
+            }
+        }
+        arr.push(arr2);
+    }
+    return {
+        mafs,
+        arr,
+    };
+}

package/dist/MultiLinearVariantMatrixRenderer/types.d.ts

@@ -0,0 +1,15 @@
+import type { Source } from '../types';
+import type { RenderArgsDeserialized as BoxRenderArgsDeserialized } from '@jbrowse/core/pluggableElementTypes/renderers/BoxRendererType';
+import type { Feature } from '@jbrowse/core/util';
+export interface RenderArgsDeserialized extends BoxRenderArgsDeserialized {
+    sources: Source[];
+    minorAlleleFrequencyFilter: number;
+    highResolutionScaling: number;
+    height: number;
+    renderingMode: string;
+}
+export interface RenderArgsDeserializedWithFeaturesAndLayout extends RenderArgsDeserialized {
+    sources: Source[];
+    features: Map<string, Feature>;
+    renderingMode: string;
+}

package/dist/MultiLinearVariantMatrixRenderer/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/MultiLinearVariantRenderer/MultiVariantRenderer.d.ts

@@ -1,22 +1,6 @@
 import FeatureRendererType from '@jbrowse/core/pluggableElementTypes/renderers/FeatureRendererType';
-import type { Source } from '../util';
-import type { RenderArgsDeserialized as FeatureRenderArgsDeserialized } from '@jbrowse/core/pluggableElementTypes/renderers/FeatureRendererType';
+import type { MultiRenderArgsDeserialized } from './types';
 import type { Feature } from '@jbrowse/core/util';
-import type { ThemeOptions } from '@mui/material';
-export interface RenderArgsDeserialized extends FeatureRenderArgsDeserialized {
-    bpPerPx: number;
-    height: number;
-    highResolutionScaling: number;
-    themeOptions: ThemeOptions;
-}
-export interface RenderArgsDeserializedWithFeatures extends RenderArgsDeserialized {
-    features: Map<string, Feature>;
-}
-export interface MultiRenderArgsDeserialized extends RenderArgsDeserializedWithFeatures {
-    sources: Source[];
-    rowHeight: number;
-    scrollTop: number;
-}
 export default class MultiVariantBaseRenderer extends FeatureRendererType {
     supportsSVG: boolean;
     render(renderProps: MultiRenderArgsDeserialized): Promise<{
@@ -25,14 +9,14 @@ export default class MultiVariantBaseRenderer extends FeatureRendererType {
         width: number;
         containsNoTransferables: boolean;
         canvasRecordedData: any;
-        reactElement?: import("react").ReactElement;
+        reactElement?: React.ReactElement;
         html?: string;
     } | {
         features: Map<string, Feature>;
         height: number;
         width: number;
         containsNoTransferables: boolean;
-        reactElement: React.JSX.Element;
+        reactElement: import("react/jsx-runtime").JSX.Element;
         html?: string;
     } | {
         features: Map<string, Feature>;
@@ -40,9 +24,8 @@ export default class MultiVariantBaseRenderer extends FeatureRendererType {
         width: number;
         containsNoTransferables: boolean;
         imageData: any;
-        reactElement?: import("react").ReactElement;
+        reactElement?: React.ReactElement;
         html?: string;
     }>;
-    draw(ctx: CanvasRenderingContext2D, props: MultiRenderArgsDeserialized): Promise<void>;
 }
 export type { RenderArgsSerialized, RenderResults, ResultsDeserialized, ResultsSerialized, } from '@jbrowse/core/pluggableElementTypes/renderers/FeatureRendererType';

package/dist/MultiLinearVariantRenderer/MultiVariantRenderer.js

@@ -1,11 +1,43 @@
 "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 () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __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 FeatureRendererType_1 = __importDefault(require("@jbrowse/core/pluggableElementTypes/renderers/FeatureRendererType"));
 const util_1 = require("@jbrowse/core/util");
-const util_2 = require("../util");
 class MultiVariantBaseRenderer extends FeatureRendererType_1.default {
     constructor() {
         super(...arguments);
@@ -16,13 +48,11 @@ class MultiVariantBaseRenderer extends FeatureRendererType_1.default {
         const { height, regions, bpPerPx } = renderProps;
         const region = regions[0];
         const width = (region.end - region.start) / bpPerPx;
-        const rest = await (0, util_1.renderToAbstractCanvas)(width, height, renderProps, async (ctx) => {
-            await this.draw(ctx, {
-                ...renderProps,
-                features,
-            });
-            return undefined;
-        });
+        const { makeImageData } = await Promise.resolve().then(() => __importStar(require('./makeImageData')));
+        const rest = await (0, util_1.renderToAbstractCanvas)(width, height, renderProps, ctx => makeImageData(ctx, {
+            ...renderProps,
+            features,
+        }));
         const results = await super.render({
             ...renderProps,
             ...rest,
@@ -39,22 +69,5 @@ class MultiVariantBaseRenderer extends FeatureRendererType_1.default {
             containsNoTransferables: true,
         };
     }
-    async draw(ctx, props) {
-        const { scrollTop, sources, rowHeight, features, regions, bpPerPx } = props;
-        const region = regions[0];
-        for (const feature of features.values()) {
-            if (feature.get('end') - feature.get('start') <= 10) {
-                const [leftPx, rightPx] = (0, util_1.featureSpanPx)(feature, region, bpPerPx);
-                const w = Math.max(Math.round(rightPx - leftPx), 2);
-                const genotypes = feature.get('genotypes');
-                let t = -scrollTop;
-                for (const { name } of sources) {
-                    ctx.fillStyle = (0, util_2.getCol)(genotypes[name]);
-                    ctx.fillRect(Math.floor(leftPx), t, w, Math.max(t + rowHeight, 1));
-                    t += rowHeight;
-                }
-            }
-        }
-    }
 }
 exports.default = MultiVariantBaseRenderer;

package/dist/MultiLinearVariantRenderer/MultiVariantRendering.d.ts

@@ -1,5 +1,5 @@
-import React from 'react';
-import type { Source } from '../util';
+import RBush from 'rbush';
+import type { Source } from '../types';
 import type { Feature } from '@jbrowse/core/util';
 import type { Region } from '@jbrowse/core/util/types';
 declare const MultiVariantRendering: (props: {
@@ -11,8 +11,12 @@ declare const MultiVariantRendering: (props: {
     sources: Source[];
     scrollTop: number;
     totalHeight: number;
+    rbush: RBush<{
+        genotype: string;
+    }>;
+    displayModel: any;
     onMouseLeave?: (event: React.MouseEvent) => void;
     onMouseMove?: (event: React.MouseEvent, arg?: Feature) => void;
     onFeatureClick?: (event: React.MouseEvent, arg?: Feature) => void;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default MultiVariantRendering;

package/dist/MultiLinearVariantRenderer/MultiVariantRendering.js

@@ -1,43 +1,52 @@
 "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 jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const ui_1 = require("@jbrowse/core/ui");
 const mobx_react_1 = require("mobx-react");
+const rbush_1 = __importDefault(require("rbush"));
 const MultiVariantRendering = (0, mobx_react_1.observer)(function (props) {
     const { totalHeight, scrollTop } = props;
+    const { rbush, displayModel } = props;
     const ref = (0, react_1.useRef)(null);
-    return (react_1.default.createElement("div", { ref: ref, style: {
+    const rbush2 = (0, react_1.useMemo)(() => new rbush_1.default().fromJSON(rbush), [rbush]);
+    function getFeatureUnderMouse(eventClientX, eventClientY) {
+        var _a;
+        let offsetX = 0;
+        let offsetY = 0;
+        if (ref.current) {
+            const r = ref.current.getBoundingClientRect();
+            offsetX = eventClientX - r.left;
+            offsetY = eventClientY - r.top;
+        }
+        const ret = rbush2.search({
+            minX: offsetX,
+            maxX: offsetX + 3,
+            minY: offsetY,
+            maxY: offsetY + 3,
+        });
+        return (_a = ret[0]) === null || _a === void 0 ? void 0 : _a.genotype;
+    }
+    return ((0, jsx_runtime_1.jsx)("div", { ref: ref, onMouseMove: e => {
+            var _a;
+            return (_a = displayModel.setHoveredGenotype) === null || _a === void 0 ? void 0 : _a.call(displayModel, getFeatureUnderMouse(e.clientX, e.clientY));
+        }, onMouseLeave: () => {
+            var _a;
+            (_a = displayModel.setHoveredGenotype) === null || _a === void 0 ? void 0 : _a.call(displayModel, undefined);
+        }, onMouseOut: () => {
+            var _a;
+            (_a = displayModel.setHoveredGenotype) === null || _a === void 0 ? void 0 : _a.call(displayModel, undefined);
+        }, style: {
             overflow: 'visible',
             position: 'relative',
             height: totalHeight,
-        } },
-        react_1.default.createElement(ui_1.PrerenderedCanvas, { ...props, style: {
+        }, children: (0, jsx_runtime_1.jsx)(ui_1.PrerenderedCanvas, { ...props, style: {
                 position: 'absolute',
                 left: 0,
                 top: scrollTop,
-            } })));
+            } }) }));
 });
 exports.default = MultiVariantRendering;

package/dist/MultiLinearVariantRenderer/configSchema.d.ts

@@ -1,34 +1,2 @@
-declare const configSchema: import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaType<{}, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaType<{
-    color: {
-        type: string;
-        description: string;
-        defaultValue: string;
-    };
-    posColor: {
-        type: string;
-        description: string;
-        defaultValue: string;
-    };
-    negColor: {
-        type: string;
-        description: string;
-        defaultValue: string;
-    };
-    clipColor: {
-        type: string;
-        description: string;
-        defaultValue: string;
-    };
-    bicolorPivot: {
-        type: string;
-        model: import("mobx-state-tree").ISimpleType<string>;
-        description: string;
-        defaultValue: string;
-    };
-    bicolorPivotValue: {
-        type: string;
-        defaultValue: number;
-        description: string;
-    };
-}, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<undefined, undefined>>, undefined>>;
+declare const configSchema: import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaType<{}, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<undefined, undefined>>;
 export default configSchema;

package/dist/MultiLinearVariantRenderer/configSchema.js

@@ -1,13 +1,8 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 const configuration_1 = require("@jbrowse/core/configuration");
-const configSchema_1 = __importDefault(require("../configSchema"));
 function x() { }
 const configSchema = (0, configuration_1.ConfigurationSchema)('MultiVariantRenderer', {}, {
-    baseConfiguration: configSchema_1.default,
     explicitlyTyped: true,
 });
 exports.default = configSchema;

package/dist/MultiLinearVariantRenderer/makeImageData.d.ts

@@ -0,0 +1,4 @@
+import type { MultiRenderArgsDeserialized } from './types';
+export declare function makeImageData(ctx: CanvasRenderingContext2D, props: MultiRenderArgsDeserialized): Promise<{
+    rbush: any;
+}>;

package/dist/MultiLinearVariantRenderer/makeImageData.js

@@ -0,0 +1,67 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.makeImageData = makeImageData;
+const util_1 = require("@jbrowse/core/util");
+const rbush_1 = __importDefault(require("rbush"));
+const multiVariantColor_1 = require("../shared/multiVariantColor");
+const util_2 = require("../util");
+const fudgeFactor = 0.6;
+const f2 = fudgeFactor / 2;
+function drawColorAlleleCount(alleles, ctx, x, y, w, h) {
+    ctx.fillStyle = (0, multiVariantColor_1.getColorAlleleCount)(alleles);
+    ctx.fillRect(x - f2, y - f2, w + f2, h + f2);
+}
+function drawPhased(alleles, ctx, x, y, w, h, HP) {
+    ctx.fillStyle = (0, multiVariantColor_1.getColorPhased)(alleles, HP);
+    ctx.fillRect(x - f2, y - f2, w + f2, h + f2);
+}
+async function makeImageData(ctx, props) {
+    const { scrollTop, minorAlleleFrequencyFilter, sources, rowHeight, features, regions, bpPerPx, renderingMode, } = props;
+    const region = regions[0];
+    const mafs = (0, util_2.getFeaturesThatPassMinorAlleleFrequencyFilter)(features.values(), minorAlleleFrequencyFilter);
+    const rbush = new rbush_1.default();
+    for (const feature of mafs) {
+        const [leftPx, rightPx] = (0, util_1.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;
+        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) {
+                rbush.insert({
+                    minX: x - f2,
+                    maxX: x + w + f2,
+                    minY: y - f2,
+                    maxY: y + h + f2,
+                    genotype,
+                });
+                const isPhased = genotype.includes('|');
+                if (renderingMode === 'phased') {
+                    if (isPhased) {
+                        const alleles = genotype.split('|');
+                        drawPhased(alleles, ctx, x, y, w, h, HP);
+                    }
+                    else {
+                        ctx.fillStyle = 'black';
+                        ctx.fillRect(x - f2, y - f2, w + f2, h + f2);
+                    }
+                }
+                else {
+                    const alleles = genotype.split(/[/|]/);
+                    drawColorAlleleCount(alleles, ctx, x, y, w, h);
+                }
+            }
+            y += rowHeight;
+        }
+    }
+    return {
+        rbush: rbush.toJSON(),
+    };
+}

package/dist/MultiLinearVariantRenderer/types.d.ts

@@ -0,0 +1,19 @@
+import type { Source } from '../types';
+import type { RenderArgsDeserialized as FeatureRenderArgsDeserialized } from '@jbrowse/core/pluggableElementTypes/renderers/FeatureRendererType';
+import type { Feature } from '@jbrowse/core/util';
+import type { ThemeOptions } from '@mui/material';
+export interface RenderArgsDeserialized extends FeatureRenderArgsDeserialized {
+    bpPerPx: number;
+    height: number;
+    highResolutionScaling: number;
+    themeOptions: ThemeOptions;
+}
+export interface RenderArgsDeserializedWithFeatures extends RenderArgsDeserialized {
+    features: Map<string, Feature>;
+}
+export interface MultiRenderArgsDeserialized extends RenderArgsDeserializedWithFeatures {
+    sources: Source[];
+    rowHeight: number;
+    scrollTop: number;
+    minorAlleleFrequencyFilter: number;
+}

package/dist/MultiLinearVariantRenderer/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/MultiVariantBaseRenderer.d.ts

@@ -1,5 +1,5 @@
 import FeatureRendererType from '@jbrowse/core/pluggableElementTypes/renderers/FeatureRendererType';
-import type { Source } from './util';
+import type { Source } from './types';
 import type { RenderArgsDeserialized as FeatureRenderArgsDeserialized } from '@jbrowse/core/pluggableElementTypes/renderers/FeatureRendererType';
 import type { Feature } from '@jbrowse/core/util';
 import type { ThemeOptions } from '@mui/material';
@@ -23,14 +23,14 @@ export default abstract class MultiVariantBaseRenderer extends FeatureRendererTy
         width: number;
         containsNoTransferables: boolean;
         canvasRecordedData: any;
-        reactElement?: import("react").ReactElement;
+        reactElement?: React.ReactElement;
         html?: string;
     } | {
         features: Map<string, Feature>;
         height: number;
         width: number;
         containsNoTransferables: boolean;
-        reactElement: React.JSX.Element;
+        reactElement: import("react/jsx-runtime").JSX.Element;
         html?: string;
     } | {
         features: Map<string, Feature>;
@@ -38,7 +38,7 @@ export default abstract class MultiVariantBaseRenderer extends FeatureRendererTy
         width: number;
         containsNoTransferables: boolean;
         imageData: any;
-        reactElement?: import("react").ReactElement;
+        reactElement?: React.ReactElement;
         html?: string;
     }>;
     abstract draw<T extends RenderArgsDeserializedWithFeatures>(ctx: CanvasRenderingContext2D, props: T): Promise<Record<string, unknown> | undefined>;

package/dist/StructuralVariantChordRenderer/Chord.d.ts

@@ -1,23 +1,6 @@
-import React from 'react';
+import type { AnyRegion, Block } from './types';
 import type { AnyConfigurationModel } from '@jbrowse/core/configuration';
 import type { Feature } from '@jbrowse/core/util';
-export interface Region {
-    end: number;
-    start: number;
-    refName: string;
-    elided?: false;
-}
-export interface ElidedRegion {
-    elided: true;
-    regions: Region[];
-}
-export type AnyRegion = Region | ElidedRegion;
-export interface Block {
-    flipped: boolean;
-    bpPerRadian: number;
-    startRadians: number;
-    region: AnyRegion;
-}
 declare const Chord: ({ feature, blocksForRefs, radius, config, bezierRadius, selected, onClick, }: {
     feature: Feature;
     blocksForRefs: Record<string, Block>;
@@ -26,5 +9,5 @@ declare const Chord: ({ feature, blocksForRefs, radius, config, bezierRadius, se
     bezierRadius: number;
     selected: boolean;
     onClick: (feat: Feature, reg: AnyRegion, end: AnyRegion, evt: unknown) => void;
-}) => React.JSX.Element | null;
+}) => import("react/jsx-runtime").JSX.Element | null;
 export default Chord;