@jbrowse/plugin-wiggle 3.6.5 → 4.0.0

package/esm/MultiRowXYPlotRenderer/configSchema.d.ts

@@ -1,4 +1,4 @@
-declare const configSchema: import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaType<{
+declare const configSchema: import("node_modules/@jbrowse/core/src/configuration/configurationSchema.ts").ConfigurationSchemaType<{
     filled: {
         type: string;
         defaultValue: boolean;
@@ -10,7 +10,7 @@ declare const configSchema: import("@jbrowse/core/configuration/configurationSch
     };
     summaryScoreMode: {
         type: string;
-        model: import("mobx-state-tree").ISimpleType<string>;
+        model: import("@jbrowse/mobx-state-tree").ISimpleType<string>;
         description: string;
         defaultValue: string;
     };
@@ -18,7 +18,7 @@ declare const configSchema: import("@jbrowse/core/configuration/configurationSch
         type: string;
         defaultValue: number;
     };
-}, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaType<{
+}, import("node_modules/@jbrowse/core/src/configuration/configurationSchema.ts").ConfigurationSchemaOptions<import("node_modules/@jbrowse/core/src/configuration/configurationSchema.ts").ConfigurationSchemaType<{
     color: {
         type: string;
         description: string;
@@ -44,7 +44,7 @@ declare const configSchema: import("@jbrowse/core/configuration/configurationSch
     };
     bicolorPivot: {
         type: string;
-        model: import("mobx-state-tree").ISimpleType<string>;
+        model: import("@jbrowse/mobx-state-tree").ISimpleType<string>;
         description: string;
         defaultValue: string;
     };
@@ -53,5 +53,5 @@ declare const configSchema: import("@jbrowse/core/configuration/configurationSch
         defaultValue: number;
         description: string;
     };
-}, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<undefined, undefined>>, undefined>>;
+}, import("node_modules/@jbrowse/core/src/configuration/configurationSchema.ts").ConfigurationSchemaOptions<undefined, undefined>>, undefined>>;
 export default configSchema;

package/esm/MultiRowXYPlotRenderer/configSchema.js

@@ -1,6 +1,6 @@
 import { ConfigurationSchema } from '@jbrowse/core/configuration';
-import { types } from 'mobx-state-tree';
-import baseWiggleRendererConfigSchema from '../configSchema';
+import { types } from '@jbrowse/mobx-state-tree';
+import baseWiggleRendererConfigSchema from "../configSchema.js";
 function x() { }
 const configSchema = ConfigurationSchema('MultiRowXYPlotRenderer', {
     filled: {

package/esm/MultiRowXYPlotRenderer/index.js

@@ -1,10 +1,10 @@
-import ReactComponent from '../MultiWiggleRendering';
-import MultiRowXYPlotRenderer from './MultiRowXYPlotRenderer';
-import configSchema from './configSchema';
+import { lazy } from 'react';
+import MultiRowXYPlotRenderer from "./MultiRowXYPlotRenderer.js";
+import configSchema from "./configSchema.js";
 export default function MultiRowXYPlotRendererF(pluginManager) {
     pluginManager.addRendererType(() => new MultiRowXYPlotRenderer({
         name: 'MultiRowXYPlotRenderer',
-        ReactComponent,
+        ReactComponent: lazy(() => import("../MultiWiggleRendering.js")),
         configSchema,
         pluginManager,
     }));

package/esm/MultiRowXYPlotRenderer/makeImageData.d.ts

@@ -0,0 +1,3 @@
+import type { MultiRenderArgsDeserialized } from '../types.ts';
+import type PluginManager from '@jbrowse/core/PluginManager';
+export declare function makeImageData(renderProps: MultiRenderArgsDeserialized, pluginManager: PluginManager): Promise<import("@jbrowse/core/pluggableElementTypes/renderers/RendererType").RenderReturn>;

package/esm/MultiRowXYPlotRenderer/makeImageData.js

@@ -0,0 +1,7 @@
+export async function makeImageData(renderProps, pluginManager) {
+    const { renderMultiWiggle } = await import("../multiRendererHelper.js");
+    return renderMultiWiggle(pluginManager, renderProps, async (props, features) => {
+        const { renderMultiRowXYPlot } = await import("./renderMultiRowXYPlot.js");
+        return renderMultiRowXYPlot(props, features);
+    });
+}

package/esm/MultiRowXYPlotRenderer/renderMultiRowXYPlot.d.ts

@@ -0,0 +1,3 @@
+import type { MultiRenderArgsDeserialized } from '../types.ts';
+import type { Feature } from '@jbrowse/core/util';
+export declare function renderMultiRowXYPlot(renderProps: MultiRenderArgsDeserialized, features: Feature[]): Promise<import("librpc-web-mod").RpcResult>;

package/esm/MultiRowXYPlotRenderer/renderMultiRowXYPlot.js

@@ -0,0 +1,42 @@
+import { createStopTokenChecker, groupBy, renderToAbstractCanvas, updateStatus, } from '@jbrowse/core/util';
+import { rpcResult } from '@jbrowse/core/util/librpc';
+import { collectTransferables } from '@jbrowse/core/util/offscreenCanvasPonyfill';
+import { drawXY } from "../drawXY.js";
+import { serializeWiggleFeature } from "../util.js";
+export async function renderMultiRowXYPlot(renderProps, features) {
+    const { sources, height, regions, bpPerPx, stopToken, statusCallback = () => { }, } = renderProps;
+    const region = regions[0];
+    const width = (region.end - region.start) / bpPerPx;
+    const rowHeight = height / sources.length;
+    const lastCheck = createStopTokenChecker(stopToken);
+    const { reducedFeatures, ...rest } = await updateStatus('Rendering plot', statusCallback, () => renderToAbstractCanvas(width, height, renderProps, ctx => {
+        const groups = groupBy(features, f => f.get('source'));
+        let allReducedFeatures = [];
+        ctx.save();
+        for (const source of sources) {
+            const { reducedFeatures: reduced } = drawXY(ctx, {
+                ...renderProps,
+                features: groups[source.name] || [],
+                height: rowHeight,
+                colorCallback: () => source.color || 'blue',
+                lastCheck,
+            });
+            allReducedFeatures = allReducedFeatures.concat(reduced);
+            ctx.strokeStyle = 'rgba(200,200,200,0.8)';
+            ctx.beginPath();
+            ctx.moveTo(0, rowHeight);
+            ctx.lineTo(width, rowHeight);
+            ctx.stroke();
+            ctx.translate(0, rowHeight);
+        }
+        ctx.restore();
+        return { reducedFeatures: allReducedFeatures };
+    }));
+    const serialized = {
+        ...rest,
+        features: reducedFeatures.map(serializeWiggleFeature),
+        height,
+        width,
+    };
+    return rpcResult(serialized, collectTransferables(rest));
+}

package/esm/MultiWiggleAdapter/MultiWiggleAdapter.d.ts

@@ -4,27 +4,33 @@ import type { Feature } from '@jbrowse/core/util';
 import type { AugmentedRegion as Region } from '@jbrowse/core/util/types';
 interface WiggleOptions extends BaseOptions {
     resolution?: number;
+    staticBlocks?: Region[];
 }
 interface AdapterEntry {
     dataAdapter: BaseFeatureDataAdapter;
     source: string;
+    name: string;
     [key: string]: unknown;
 }
 export default class MultiWiggleAdapter extends BaseFeatureDataAdapter {
     static capabilities: string[];
+    private adaptersP?;
     getAdapters(): Promise<AdapterEntry[]>;
+    private getAdaptersImpl;
     getRefNames(opts?: BaseOptions): Promise<string[]>;
     getGlobalStats(opts?: BaseOptions): Promise<{
         scoreMin: number;
         scoreMax: number;
     }>;
     getFeatures(region: Region, opts?: WiggleOptions): import("rxjs").Observable<Feature>;
+    getRegionQuantitativeStats(region: Region, opts?: WiggleOptions): Promise<import("@jbrowse/core/util/stats").RectifiedQuantitativeStats>;
     getMultiRegionFeatureDensityStats(_regions: Region[]): Promise<{
         featureDensity: number;
     }>;
+    getMultiRegionQuantitativeStats(regions?: Region[], opts?: WiggleOptions): Promise<import("@jbrowse/core/util/stats").RectifiedQuantitativeStats>;
     getSources(_regions: Region[]): Promise<{
         name: string;
-        __name: unknown;
+        source: string;
     }[]>;
 }
 export {};

package/esm/MultiWiggleAdapter/MultiWiggleAdapter.js

@@ -1,4 +1,5 @@
 import { BaseFeatureDataAdapter } from '@jbrowse/core/data_adapters/BaseAdapter';
+import { aggregateQuantitativeStats, blankStats, } from '@jbrowse/core/data_adapters/BaseAdapter/stats';
 import { SimpleFeature, max, min } from '@jbrowse/core/util';
 import { ObservableCreate } from '@jbrowse/core/util/rxjs';
 import { merge } from 'rxjs';
@@ -7,14 +8,47 @@ function getFilename(uri) {
     const filename = uri.slice(uri.lastIndexOf('/') + 1);
     return filename.slice(0, filename.lastIndexOf('.'));
 }
-class MultiWiggleAdapter extends BaseFeatureDataAdapter {
+function getFilenameFromAdapterConfig(config) {
+    try {
+        if (config.type === 'BigWigAdapter' && config.bigWigLocation) {
+            const location = config.bigWigLocation;
+            if ('uri' in location && location.uri) {
+                return getFilename(location.uri);
+            }
+            if ('localPath' in location && location.localPath) {
+                return getFilename(location.localPath);
+            }
+            if ('blob' in location && location.blob) {
+                const blob = location.blob;
+                return blob.name ? getFilename(blob.name) : undefined;
+            }
+        }
+        return undefined;
+    }
+    catch (e) {
+        return undefined;
+    }
+}
+export default class MultiWiggleAdapter extends BaseFeatureDataAdapter {
+    static capabilities = [
+        'hasResolution',
+        'hasLocalStats',
+        'hasGlobalStats',
+    ];
+    adaptersP;
     async getAdapters() {
+        if (!this.adaptersP) {
+            this.adaptersP = this.getAdaptersImpl();
+        }
+        return this.adaptersP;
+    }
+    async getAdaptersImpl() {
         const getSubAdapter = this.getSubAdapter;
         if (!getSubAdapter) {
             throw new Error('no getSubAdapter available');
         }
         let subConfs = this.getConf('subadapters');
-        if (!(subConfs === null || subConfs === void 0 ? void 0 : subConfs.length)) {
+        if (!subConfs?.length) {
             const entries = this.getConf('bigWigs');
             subConfs = entries.map(entry => ({
                 type: 'BigWigAdapter',
@@ -27,10 +61,14 @@ class MultiWiggleAdapter extends BaseFeatureDataAdapter {
         return Promise.all(subConfs.map(async (conf) => {
             const dataAdapter = (await getSubAdapter(conf))
                 .dataAdapter;
+            const source = conf.source ||
+                conf.name ||
+                getFilenameFromAdapterConfig(conf) ||
+                dataAdapter.id;
             return {
-                source: conf.name || dataAdapter.id,
                 ...conf,
                 dataAdapter,
+                source,
             };
         }));
     }
@@ -41,43 +79,60 @@ class MultiWiggleAdapter extends BaseFeatureDataAdapter {
     }
     async getGlobalStats(opts) {
         const adapters = await this.getAdapters();
-        const stats = (await Promise.all(adapters.map(adp => { var _a, _b; return (_b = (_a = adp.dataAdapter).getGlobalStats) === null || _b === void 0 ? void 0 : _b.call(_a, opts); }))).filter(f => !!f);
-        const scoreMin = min(stats.map(s => s.scoreMin));
-        const scoreMax = max(stats.map(s => s.scoreMax));
+        const stats = (await Promise.all(adapters.map(adp => adp.dataAdapter.getGlobalStats?.(opts)))).filter(f => !!f);
         return {
-            scoreMin,
-            scoreMax,
+            scoreMin: min(stats.map(s => s.scoreMin)),
+            scoreMax: max(stats.map(s => s.scoreMax)),
         };
     }
     getFeatures(region, opts = {}) {
         return ObservableCreate(async (observer) => {
             const adapters = await this.getAdapters();
-            merge(...adapters.map(adp => adp.dataAdapter.getFeatures(region, opts).pipe(map(p => p.get('source')
-                ? p
-                : new SimpleFeature({
-                    ...p.toJSON(),
-                    uniqueId: `${adp.source}-${p.id()}`,
-                    source: adp.source,
-                }))))).subscribe(observer);
+            merge(...adapters.map(adp => {
+                const { source, dataAdapter } = adp;
+                return dataAdapter.getFeatures(region, opts).pipe(map(f => {
+                    if (f.get('source')) {
+                        return f;
+                    }
+                    const data = f.toJSON();
+                    data.uniqueId = `${source}-${f.id()}`;
+                    data.source = source;
+                    return new SimpleFeature(data);
+                }));
+            })).subscribe(observer);
         }, opts.stopToken);
     }
+    async getRegionQuantitativeStats(region, opts) {
+        const adapters = await this.getAdapters();
+        const allStats = await Promise.all(adapters.map(async (adp) => {
+            const { dataAdapter } = adp;
+            return dataAdapter.getRegionQuantitativeStats(region, opts);
+        }));
+        return aggregateQuantitativeStats(allStats.filter(Boolean));
+    }
     async getMultiRegionFeatureDensityStats(_regions) {
         return {
             featureDensity: 0,
         };
     }
-    async getSources(_regions) {
+    async getMultiRegionQuantitativeStats(regions = [], opts = {}) {
+        if (!regions.length) {
+            return blankStats();
+        }
         const adapters = await this.getAdapters();
-        return adapters.map(({ dataAdapter, source, name, ...rest }) => ({
-            name: source,
-            __name: name,
-            ...rest,
+        const allStats = await Promise.all(adapters.map(async (adp) => {
+            const { dataAdapter } = adp;
+            return dataAdapter.getMultiRegionQuantitativeStats(regions, opts);
         }));
+        return aggregateQuantitativeStats(allStats.filter(Boolean));
+    }
+    async getSources(_regions) {
+        const adapters = await this.getAdapters();
+        return adapters.map(({ type, bigWigLocation, dataAdapter, ...rest }) => {
+            return {
+                ...rest,
+                name: rest.source,
+            };
+        });
     }
 }
-MultiWiggleAdapter.capabilities = [
-    'hasResolution',
-    'hasLocalStats',
-    'hasGlobalStats',
-];
-export default MultiWiggleAdapter;

package/esm/MultiWiggleAdapter/configSchema.d.ts

@@ -1,4 +1,4 @@
-declare const MultiWiggleAdapter: import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaType<{
+declare const MultiWiggleAdapter: import("node_modules/@jbrowse/core/src/configuration/configurationSchema").ConfigurationSchemaType<{
     subadapters: {
         type: string;
         defaultValue: never[];
@@ -9,5 +9,5 @@ declare const MultiWiggleAdapter: import("@jbrowse/core/configuration/configurat
         description: string;
         defaultValue: never[];
     };
-}, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<undefined, undefined>>;
+}, import("node_modules/@jbrowse/core/src/configuration/configurationSchema").ConfigurationSchemaOptions<undefined, undefined>>;
 export default MultiWiggleAdapter;

package/esm/MultiWiggleAdapter/index.js

@@ -1,5 +1,5 @@
 import AdapterType from '@jbrowse/core/pluggableElementTypes/AdapterType';
-import configSchema from './configSchema';
+import configSchema from "./configSchema.js";
 export default function MultiWiggleAdapterF(pluginManager) {
     pluginManager.addAdapterType(() => new AdapterType({
         name: 'MultiWiggleAdapter',
@@ -13,6 +13,6 @@ export default function MultiWiggleAdapterF(pluginManager) {
         adapterMetadata: {
             hiddenFromGUI: true,
         },
-        getAdapterClass: () => import('./MultiWiggleAdapter').then(r => r.default),
+        getAdapterClass: () => import("./MultiWiggleAdapter.js").then(r => r.default),
     }));
 }

package/esm/MultiWiggleAddTrackWorkflow/AddTrackWorkflow.d.ts

@@ -1,5 +1,5 @@
 import type { AddTrackModel } from '@jbrowse/plugin-data-management';
-declare const MultiWiggleAddTrackWorkflow: ({ model, }: {
+declare const MultiWiggleAddTrackWorkflow: ({ model }: {
     model: AddTrackModel;
 }) => import("react/jsx-runtime").JSX.Element;
 export default MultiWiggleAddTrackWorkflow;

package/esm/MultiWiggleAddTrackWorkflow/AddTrackWorkflow.js

@@ -2,9 +2,9 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from 'react';
 import { getSession, isElectron, isSessionModelWithWidgets, isSessionWithAddTracks, } from '@jbrowse/core/util';
 import { storeBlobLocation } from '@jbrowse/core/util/tracks';
+import { makeStyles } from '@jbrowse/core/util/tss-react';
 import { Button, Paper, TextField } from '@mui/material';
 import { observer } from 'mobx-react';
-import { makeStyles } from 'tss-react/mui';
 const useStyles = makeStyles()(theme => ({
     paper: {
         margin: theme.spacing(),
@@ -25,7 +25,6 @@ function makeFileLocation(file) {
         : storeBlobLocation({ blob: file });
 }
 function doSubmit({ trackName, val, model, }) {
-    var _a;
     const session = getSession(model);
     try {
         const trackId = [
@@ -54,7 +53,7 @@ function doSubmit({ trackName, val, model, }) {
                     ...obj,
                 },
             });
-            (_a = model.view) === null || _a === void 0 ? void 0 : _a.showTrack(trackId);
+            model.view?.showTrack(trackId);
         }
         model.clearData();
         if (isSessionModelWithWidgets(session)) {
@@ -66,10 +65,10 @@ function doSubmit({ trackName, val, model, }) {
         session.notifyError(`${e}`, e);
     }
 }
-const MultiWiggleAddTrackWorkflow = observer(function ({ model, }) {
+const MultiWiggleAddTrackWorkflow = observer(function MultiWiggleAddTrackWorkflow({ model }) {
     const { classes } = useStyles();
     const [val, setVal] = useState('');
-    const [trackName, setTrackName] = useState(`MultiWiggle${+Date.now()}`);
+    const [trackName, setTrackName] = useState(`MultiWiggle${Date.now()}`);
     return (_jsxs(Paper, { className: classes.paper, children: [_jsxs("ul", { children: [_jsx("li", { children: "Enter list of URLs for bigwig files in the textbox" }), _jsx("li", { children: "Or, use the button below the text box to select files from your computer" })] }), _jsx(TextField, { multiline: true, fullWidth: true, rows: 10, value: val, placeholder: "Paste list of URLs here, or use file selector below", variant: "outlined", onChange: event => {
                     setVal(event.target.value);
                 } }), _jsxs(Button, { variant: "outlined", component: "label", children: ["Choose Files from your computer", _jsx("input", { type: "file", hidden: true, multiple: true, onChange: ({ target }) => {

package/esm/MultiWiggleAddTrackWorkflow/index.js

@@ -1,10 +1,10 @@
 import { lazy } from 'react';
 import { AddTrackWorkflowType } from '@jbrowse/core/pluggableElementTypes';
-import { types } from 'mobx-state-tree';
+import { types } from '@jbrowse/mobx-state-tree';
 export default function MultiWiggleAddTrackWorkflowF(pm) {
     pm.addAddTrackWorkflowType(() => new AddTrackWorkflowType({
         name: 'Multi-wiggle track',
-        ReactComponent: lazy(() => import('./AddTrackWorkflow')),
+        ReactComponent: lazy(() => import("./AddTrackWorkflow.js")),
         stateModel: types.model({}),
     }));
 }

package/esm/MultiWiggleRendering.d.ts

@@ -1,6 +1,11 @@
-import type { Source } from './util';
+import type { Source } from './util.ts';
 import type { Feature } from '@jbrowse/core/util';
 import type { Region } from '@jbrowse/core/util/types';
+interface MultiWiggleDisplayModel {
+    isMultiRow: boolean;
+    setFeatureUnderMouse: (f?: Feature) => void;
+    selectFeature: (f: Feature) => void;
+}
 declare const MultiWiggleRendering: (props: {
     regions: Region[];
     features: Map<string, Feature>;
@@ -9,11 +14,6 @@ declare const MultiWiggleRendering: (props: {
     height: number;
     blockKey: string;
     sources: Source[];
-    displayModel?: {
-        isMultiRow: boolean;
-    };
-    onMouseLeave?: (event: React.MouseEvent) => void;
-    onMouseMove?: (event: React.MouseEvent, arg?: Feature) => void;
-    onFeatureClick?: (event: React.MouseEvent, arg?: Feature) => void;
+    displayModel: MultiWiggleDisplayModel;
 }) => import("react/jsx-runtime").JSX.Element;
 export default MultiWiggleRendering;

package/esm/MultiWiggleRendering.js

@@ -3,11 +3,11 @@ import { useRef } from 'react';
 import { PrerenderedCanvas } from '@jbrowse/core/ui';
 import { SimpleFeature } from '@jbrowse/core/util';
 import { observer } from 'mobx-react';
-const MultiWiggleRendering = observer(function (props) {
-    const { regions, features, bpPerPx, width, height, sources, onMouseLeave = () => { }, onMouseMove = () => { }, onFeatureClick = () => { }, displayModel, } = props;
+const MultiWiggleRendering = observer(function MultiWiggleRendering(props) {
+    const { regions, features, bpPerPx, width, height, sources, displayModel } = props;
     const region = regions[0];
     const ref = useRef(null);
-    const { isMultiRow } = displayModel || {};
+    const { isMultiRow } = displayModel;
     function getFeatureUnderMouse(eventClientX, eventClientY) {
         if (!ref.current) {
             return;
@@ -63,13 +63,15 @@ const MultiWiggleRendering = observer(function (props) {
     return (_jsx("div", { ref: ref, onMouseMove: event => {
             const { clientX, clientY } = event;
             const featureUnderMouse = getFeatureUnderMouse(clientX, clientY);
-            onMouseMove(event, featureUnderMouse);
+            displayModel.setFeatureUnderMouse(featureUnderMouse);
         }, onClick: event => {
             const { clientX, clientY } = event;
             const featureUnderMouse = getFeatureUnderMouse(clientX, clientY);
-            onFeatureClick(event, featureUnderMouse);
-        }, onMouseLeave: event => {
-            onMouseLeave(event);
+            if (featureUnderMouse) {
+                displayModel.selectFeature(featureUnderMouse);
+            }
+        }, onMouseLeave: () => {
+            displayModel.setFeatureUnderMouse(undefined);
         }, style: {
             overflow: 'visible',
             position: 'relative',

package/esm/MultiXYPlotRenderer/MultiXYPlotRenderer.d.ts

@@ -1,8 +1,6 @@
-import WiggleBaseRenderer from '../WiggleBaseRenderer';
-import type { MultiRenderArgsDeserialized as MultiArgs } from '../WiggleBaseRenderer';
-import type { Feature } from '@jbrowse/core/util';
-export default class MultiXYPlotRenderer extends WiggleBaseRenderer {
-    draw(ctx: CanvasRenderingContext2D, props: MultiArgs): Promise<{
-        reducedFeatures: Feature[];
-    }>;
+import FeatureRendererType from '@jbrowse/core/pluggableElementTypes/renderers/FeatureRendererType';
+import type { MultiRenderArgsDeserialized } from '../types.ts';
+export default class MultiXYPlotRenderer extends FeatureRendererType {
+    supportsSVG: boolean;
+    render(renderProps: MultiRenderArgsDeserialized): Promise<import("@jbrowse/core/pluggableElementTypes/renderers/RendererType").RenderReturn>;
 }

package/esm/MultiXYPlotRenderer/MultiXYPlotRenderer.js

@@ -1,22 +1,8 @@
-import { forEachWithStopTokenCheck, groupBy } from '@jbrowse/core/util';
-import WiggleBaseRenderer from '../WiggleBaseRenderer';
-import { YSCALEBAR_LABEL_OFFSET } from '../util';
-export default class MultiXYPlotRenderer extends WiggleBaseRenderer {
-    async draw(ctx, props) {
-        const { stopToken, sources, features } = props;
-        const groups = groupBy(features.values(), f => f.get('source'));
-        const { drawXY } = await import('../drawXY');
-        let feats = [];
-        forEachWithStopTokenCheck(sources, stopToken, source => {
-            const features = groups[source.name] || [];
-            const { reducedFeatures } = drawXY(ctx, {
-                ...props,
-                features,
-                offset: YSCALEBAR_LABEL_OFFSET,
-                colorCallback: () => source.color || 'blue',
-            });
-            feats = feats.concat(reducedFeatures);
-        });
-        return { reducedFeatures: feats };
+import FeatureRendererType from '@jbrowse/core/pluggableElementTypes/renderers/FeatureRendererType';
+export default class MultiXYPlotRenderer extends FeatureRendererType {
+    supportsSVG = true;
+    async render(renderProps) {
+        const { makeImageData } = await import("./makeImageData.js");
+        return makeImageData(renderProps, this.pluginManager);
     }
 }

package/esm/MultiXYPlotRenderer/configSchema.d.ts

@@ -1,4 +1,4 @@
-declare const configSchema: import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaType<{
+declare const configSchema: import("node_modules/@jbrowse/core/src/configuration/configurationSchema.ts").ConfigurationSchemaType<{
     filled: {
         type: string;
         defaultValue: boolean;
@@ -10,7 +10,7 @@ declare const configSchema: import("@jbrowse/core/configuration/configurationSch
     };
     summaryScoreMode: {
         type: string;
-        model: import("mobx-state-tree").ISimpleType<string>;
+        model: import("@jbrowse/mobx-state-tree").ISimpleType<string>;
         description: string;
         defaultValue: string;
     };
@@ -18,7 +18,7 @@ declare const configSchema: import("@jbrowse/core/configuration/configurationSch
         type: string;
         defaultValue: number;
     };
-}, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaType<{
+}, import("node_modules/@jbrowse/core/src/configuration/configurationSchema.ts").ConfigurationSchemaOptions<import("node_modules/@jbrowse/core/src/configuration/configurationSchema.ts").ConfigurationSchemaType<{
     color: {
         type: string;
         description: string;
@@ -44,7 +44,7 @@ declare const configSchema: import("@jbrowse/core/configuration/configurationSch
     };
     bicolorPivot: {
         type: string;
-        model: import("mobx-state-tree").ISimpleType<string>;
+        model: import("@jbrowse/mobx-state-tree").ISimpleType<string>;
         description: string;
         defaultValue: string;
     };
@@ -53,5 +53,5 @@ declare const configSchema: import("@jbrowse/core/configuration/configurationSch
         defaultValue: number;
         description: string;
     };
-}, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<undefined, undefined>>, undefined>>;
+}, import("node_modules/@jbrowse/core/src/configuration/configurationSchema.ts").ConfigurationSchemaOptions<undefined, undefined>>, undefined>>;
 export default configSchema;

package/esm/MultiXYPlotRenderer/configSchema.js

@@ -1,6 +1,6 @@
 import { ConfigurationSchema } from '@jbrowse/core/configuration';
-import { types } from 'mobx-state-tree';
-import baseWiggleRendererConfigSchema from '../configSchema';
+import { types } from '@jbrowse/mobx-state-tree';
+import baseWiggleRendererConfigSchema from "../configSchema.js";
 function x() { }
 const configSchema = ConfigurationSchema('MultiXYPlotRenderer', {
     filled: {

package/esm/MultiXYPlotRenderer/index.js

@@ -1,10 +1,10 @@
-import ReactComponent from '../MultiWiggleRendering';
-import MultiXYPlotRenderer from './MultiXYPlotRenderer';
-import configSchema from './configSchema';
+import { lazy } from 'react';
+import MultiXYPlotRenderer from "./MultiXYPlotRenderer.js";
+import configSchema from "./configSchema.js";
 export default function MultiXYPlotRendererF(pluginManager) {
     pluginManager.addRendererType(() => new MultiXYPlotRenderer({
         name: 'MultiXYPlotRenderer',
-        ReactComponent,
+        ReactComponent: lazy(() => import("../MultiWiggleRendering.js")),
         configSchema,
         pluginManager,
     }));

package/esm/MultiXYPlotRenderer/makeImageData.d.ts

@@ -0,0 +1,3 @@
+import type { MultiRenderArgsDeserialized } from '../types.ts';
+import type PluginManager from '@jbrowse/core/PluginManager';
+export declare function makeImageData(renderProps: MultiRenderArgsDeserialized, pluginManager: PluginManager): Promise<import("@jbrowse/core/pluggableElementTypes/renderers/RendererType").RenderReturn>;

package/esm/MultiXYPlotRenderer/makeImageData.js

@@ -0,0 +1,7 @@
+export async function makeImageData(renderProps, pluginManager) {
+    const { renderMultiWiggle } = await import("../multiRendererHelper.js");
+    return renderMultiWiggle(pluginManager, renderProps, async (props, features) => {
+        const { renderMultiXYPlot } = await import("./renderMultiXYPlot.js");
+        return renderMultiXYPlot(props, features);
+    });
+}

package/esm/MultiXYPlotRenderer/renderMultiXYPlot.d.ts

@@ -0,0 +1,3 @@
+import type { MultiRenderArgsDeserialized } from '../types.ts';
+import type { Feature } from '@jbrowse/core/util';
+export declare function renderMultiXYPlot(renderProps: MultiRenderArgsDeserialized, features: Feature[]): Promise<import("librpc-web-mod").RpcResult>;

package/esm/MultiXYPlotRenderer/renderMultiXYPlot.js

@@ -0,0 +1,35 @@
+import { groupBy, renderToAbstractCanvas, updateStatus, } from '@jbrowse/core/util';
+import { rpcResult } from '@jbrowse/core/util/librpc';
+import { collectTransferables } from '@jbrowse/core/util/offscreenCanvasPonyfill';
+import { createStopTokenChecker } from '@jbrowse/core/util/stopToken';
+import { drawXY } from "../drawXY.js";
+import { serializeWiggleFeature } from "../util.js";
+export async function renderMultiXYPlot(renderProps, features) {
+    const { sources, height, regions, bpPerPx, stopToken, statusCallback = () => { }, } = renderProps;
+    const region = regions[0];
+    const width = (region.end - region.start) / bpPerPx;
+    const lastCheck = createStopTokenChecker(stopToken);
+    const { reducedFeatures, ...rest } = await updateStatus('Rendering plot', statusCallback, () => renderToAbstractCanvas(width, height, renderProps, ctx => {
+        const groups = groupBy(features, f => f.get('source'));
+        let allReducedFeatures = [];
+        for (const source of sources) {
+            const { reducedFeatures: reduced } = drawXY(ctx, {
+                ...renderProps,
+                features: groups[source.name] || [],
+                colorCallback: () => source.color || 'blue',
+                lastCheck,
+            });
+            allReducedFeatures = allReducedFeatures.concat(reduced);
+        }
+        return {
+            reducedFeatures: allReducedFeatures,
+        };
+    }));
+    const serialized = {
+        ...rest,
+        features: reducedFeatures.map(serializeWiggleFeature),
+        height,
+        width,
+    };
+    return rpcResult(serialized, collectTransferables(rest));
+}