jbrowse-plugin-mafviewer 1.0.6 → 1.0.8

package/README.md

@@ -136,6 +136,21 @@ The MafTabix track is created according to
 
 The samples array is either `string[]|{id:string,label:string,color?:string}[]`
 
+## Creating MAF files as Cactus pangenome/HAL
+
+You can create a MAF file from a Cactus pangenome graph using
+ComparativeGenomeToolkit
+
+This page discusses some examples
+
+https://github.com/ComparativeGenomicsToolkit/cactus/blob/master/doc/progressive.md#maf-export
+
+Thanks to Sam Talbot (https://github.com/SamCT) for initially creating the
+Cactus -> JBrowse 2 MAF example
+
+Please note that MAFViewer wants non-overlapping blocks, please check if this is
+the case
+
 ## Prepare data
 
 This is the same as the jbrowse 1 mafviewer plugin (currently the similar to
@@ -168,8 +183,8 @@ Start by converting the MAF into a pseudo-BED format using the maf2bed tool
 ```bash
 # from https://github.com/cmdcolin/maf2bed
 cargo install maf2bed
-cat file.maf | maf2bed hg38 | bgzip > out.bed
-tabix -p bed out.bed.gz
+cat file.maf | maf2bed hg38 | sort -k1,1 -k2,2n | bgzip > out.bed.gz
+tabix out.bed.gz
 ```
 
 The second argument to maf2bed is the genome version e.g. hg38 used for the main

package/dist/BigMafAdapter/BigMafAdapter.d.ts

@@ -0,0 +1,17 @@
+import { BaseFeatureDataAdapter } from '@jbrowse/core/data_adapters/BaseAdapter';
+import { Feature, Region } from '@jbrowse/core/util';
+export default class BigMafAdapter extends BaseFeatureDataAdapter {
+    setupP?: Promise<{
+        adapter: BaseFeatureDataAdapter;
+    }>;
+    setup(): Promise<{
+        adapter: BaseFeatureDataAdapter;
+    }>;
+    setupPre(): Promise<{
+        adapter: BaseFeatureDataAdapter;
+    }>;
+    getRefNames(): Promise<string[]>;
+    getHeader(): Promise<unknown>;
+    getFeatures(query: Region): import("rxjs").Observable<Feature>;
+    freeResources(): void;
+}

package/dist/BigMafAdapter/BigMafAdapter.js

@@ -0,0 +1,92 @@
+import { BaseFeatureDataAdapter } from '@jbrowse/core/data_adapters/BaseAdapter';
+import { getSnapshot } from 'mobx-state-tree';
+import { SimpleFeature } from '@jbrowse/core/util';
+import { ObservableCreate } from '@jbrowse/core/util/rxjs';
+import { firstValueFrom, toArray } from 'rxjs';
+export default class BigMafAdapter extends BaseFeatureDataAdapter {
+    setupP;
+    async setup() {
+        if (!this.getSubAdapter) {
+            throw new Error('no getSubAdapter available');
+        }
+        const adapter = await this.getSubAdapter({
+            ...getSnapshot(this.config),
+            type: 'BigBedAdapter',
+        });
+        return {
+            adapter: adapter.dataAdapter,
+        };
+    }
+    async setupPre() {
+        if (!this.setupP) {
+            this.setupP = this.setup().catch((e) => {
+                this.setupP = undefined;
+                throw e;
+            });
+        }
+        return this.setupP;
+    }
+    async getRefNames() {
+        const { adapter } = await this.setup();
+        return adapter.getRefNames();
+    }
+    async getHeader() {
+        const { adapter } = await this.setup();
+        return adapter.getHeader();
+    }
+    getFeatures(query) {
+        return ObservableCreate(async (observer) => {
+            const { adapter } = await this.setup();
+            const features = await firstValueFrom(adapter.getFeatures(query).pipe(toArray()));
+            for (const feature of features) {
+                const maf = feature.get('mafBlock');
+                const blocks = maf.split(';');
+                let aln;
+                const alns = [];
+                const alignments = {};
+                const blocks2 = [];
+                for (const block of blocks) {
+                    if (block.startsWith('s')) {
+                        if (aln) {
+                            alns.push(block.split(/ +/)[6]);
+                            blocks2.push(block);
+                        }
+                        else {
+                            aln = block.split(/ +/)[6];
+                            alns.push(aln);
+                            blocks2.push(block);
+                        }
+                    }
+                }
+                for (let i = 0; i < blocks2.length; i++) {
+                    const elt = blocks2[i];
+                    const ad = elt.split(/ +/);
+                    const y = ad[1].split('.');
+                    const org = y[0];
+                    const chr = y[1];
+                    alignments[org] = {
+                        chr: chr,
+                        start: +ad[1],
+                        srcSize: +ad[2],
+                        strand: ad[3] === '+' ? 1 : -1,
+                        unknown: +ad[4],
+                        data: alns[i],
+                    };
+                }
+                observer.next(new SimpleFeature({
+                    id: feature.id(),
+                    data: {
+                        start: feature.get('start'),
+                        end: feature.get('end'),
+                        refName: feature.get('refName'),
+                        seq: alns[0],
+                        alignments: alignments,
+                    },
+                }));
+            }
+            observer.complete();
+        });
+    }
+    freeResources() { }
+}
+//# sourceMappingURL=BigMafAdapter.js.map

package/dist/BigMafAdapter/BigMafAdapter.js.map

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

package/dist/BigMafAdapter/configSchema.d.ts

@@ -0,0 +1,21 @@
+declare const configSchema: import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaType<{
+    /**
+     * #slot
+     */
+    samples: {
+        type: string;
+        description: string;
+        defaultValue: never[];
+    };
+    /**
+     * #slot
+     */
+    bigBedLocation: {
+        type: string;
+        defaultValue: {
+            uri: string;
+            locationType: string;
+        };
+    };
+}, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<undefined, undefined>>;
+export default configSchema;

package/dist/BigMafAdapter/configSchema.js

@@ -0,0 +1,28 @@
+import { ConfigurationSchema } from '@jbrowse/core/configuration';
+/**
+ * #config BigMafAdapter
+ * used to configure BigMaf adapter
+ */
+function x() { } // eslint-disable-line @typescript-eslint/no-unused-vars
+const configSchema = ConfigurationSchema('BigMafAdapter', {
+    /**
+     * #slot
+     */
+    samples: {
+        type: 'frozen',
+        description: 'string[] or {id:string,label:string,color?:string}[]',
+        defaultValue: [],
+    },
+    /**
+     * #slot
+     */
+    bigBedLocation: {
+        type: 'fileLocation',
+        defaultValue: {
+            uri: '/path/to/my.bb',
+            locationType: 'UriLocation',
+        },
+    },
+}, { explicitlyTyped: true });
+export default configSchema;
+//# sourceMappingURL=configSchema.js.map

package/dist/BigMafAdapter/configSchema.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"configSchema.js","sourceRoot":"","sources":["../../src/BigMafAdapter/configSchema.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAA;AAEjE;;;GAGG;AACH,SAAS,CAAC,KAAI,CAAC,CAAC,wDAAwD;AAExE,MAAM,YAAY,GAAG,mBAAmB,CACtC,eAAe,EACf;IACE;;OAEG;IACH,OAAO,EAAE;QACP,IAAI,EAAE,QAAQ;QACd,WAAW,EAAE,sDAAsD;QACnE,YAAY,EAAE,EAAE;KACjB;IACD;;OAEG;IACH,cAAc,EAAE;QACd,IAAI,EAAE,cAAc;QACpB,YAAY,EAAE;YACZ,GAAG,EAAE,gBAAgB;YACrB,YAAY,EAAE,aAAa;SAC5B;KACF;CACF,EACD,EAAE,eAAe,EAAE,IAAI,EAAE,CAC1B,CAAA;AAED,eAAe,YAAY,CAAA"}

package/dist/BigMafAdapter/index.d.ts

@@ -0,0 +1,2 @@
+import PluginManager from '@jbrowse/core/PluginManager';
+export default function BigMafAdapterF(pluginManager: PluginManager): PluginManager;

package/dist/BigMafAdapter/index.js

@@ -0,0 +1,11 @@
+import { AdapterType } from '@jbrowse/core/pluggableElementTypes';
+import configSchema from './configSchema';
+import BigMafAdapter from './BigMafAdapter';
+export default function BigMafAdapterF(pluginManager) {
+    return pluginManager.addAdapterType(() => new AdapterType({
+        name: 'BigMafAdapter',
+        AdapterClass: BigMafAdapter,
+        configSchema,
+    }));
+}
+//# sourceMappingURL=index.js.map

package/dist/BigMafAdapter/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/BigMafAdapter/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,MAAM,qCAAqC,CAAA;AACjE,OAAO,YAAY,MAAM,gBAAgB,CAAA;AACzC,OAAO,aAAa,MAAM,iBAAiB,CAAA;AAE3C,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,aAA4B;IACjE,OAAO,aAAa,CAAC,cAAc,CACjC,GAAG,EAAE,CACH,IAAI,WAAW,CAAC;QACd,IAAI,EAAE,eAAe;QACrB,YAAY,EAAE,aAAa;QAC3B,YAAY;KACb,CAAC,CACL,CAAA;AACH,CAAC"}

package/dist/LinearMafDisplay/components/ColorLegend.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { LinearMafDisplayModel } from '../stateModel';
+declare const ColorLegend: ({ model, labelWidth, svgFontSize, }: {
+    model: LinearMafDisplayModel;
+    svgFontSize: number;
+    labelWidth: number;
+}) => React.JSX.Element;
+export default ColorLegend;

package/dist/LinearMafDisplay/components/ColorLegend.js

@@ -0,0 +1,15 @@
+import React from 'react';
+import { observer } from 'mobx-react';
+import RectBg from './RectBg';
+const ColorLegend = observer(function ({ model, labelWidth, svgFontSize, }) {
+    const { samples, rowHeight } = model;
+    const canDisplayLabel = rowHeight >= 10;
+    const boxHeight = Math.min(20, rowHeight);
+    return (React.createElement(React.Fragment, null,
+        samples.map((sample, idx) => (React.createElement(RectBg, { key: `${sample.id}-${idx}`, y: idx * rowHeight, x: 0, width: labelWidth + 5, height: boxHeight, color: sample.color }))),
+        canDisplayLabel
+            ? samples.map((sample, idx) => (React.createElement("text", { key: `${sample.id}-${idx}`, y: idx * rowHeight + rowHeight / 2, dominantBaseline: "middle", x: 2, fontSize: svgFontSize }, sample.label)))
+            : null));
+});
+export default ColorLegend;
+//# sourceMappingURL=ColorLegend.js.map

package/dist/LinearMafDisplay/components/ColorLegend.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColorLegend.js","sourceRoot":"","sources":["../../../src/LinearMafDisplay/components/ColorLegend.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAIrC,OAAO,MAAM,MAAM,UAAU,CAAA;AAE7B,MAAM,WAAW,GAAG,QAAQ,CAAC,UAAU,EACrC,KAAK,EACL,UAAU,EACV,WAAW,GAKZ;IACC,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,KAAK,CAAA;IACpC,MAAM,eAAe,GAAG,SAAS,IAAI,EAAE,CAAA;IACvC,MAAM,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,EAAE,EAAE,SAAS,CAAC,CAAA;IAEzC,OAAO,CACL;QACG,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,GAAG,EAAE,EAAE,CAAC,CAC5B,oBAAC,MAAM,IACL,GAAG,EAAE,GAAG,MAAM,CAAC,EAAE,IAAI,GAAG,EAAE,EAC1B,CAAC,EAAE,GAAG,GAAG,SAAS,EAClB,CAAC,EAAE,CAAC,EACJ,KAAK,EAAE,UAAU,GAAG,CAAC,EACrB,MAAM,EAAE,SAAS,EACjB,KAAK,EAAE,MAAM,CAAC,KAAK,GACnB,CACH,CAAC;QACD,eAAe;YACd,CAAC,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,GAAG,EAAE,EAAE,CAAC,CAC3B,8BACE,GAAG,EAAE,GAAG,MAAM,CAAC,EAAE,IAAI,GAAG,EAAE,EAC1B,CAAC,EAAE,GAAG,GAAG,SAAS,GAAG,SAAS,GAAG,CAAC,EAClC,gBAAgB,EAAC,QAAQ,EACzB,CAAC,EAAE,CAAC,EACJ,QAAQ,EAAE,WAAW,IAEpB,MAAM,CAAC,KAAK,CACR,CACR,CAAC;YACJ,CAAC,CAAC,IAAI,CACP,CACJ,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,WAAW,CAAA"}

package/dist/LinearMafDisplay/components/ReactComponent.d.ts

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

package/dist/LinearMafDisplay/components/ReactComponent.js

@@ -0,0 +1,15 @@
+import React from 'react';
+import { getEnv } from '@jbrowse/core/util';
+import { observer } from 'mobx-react';
+import YScaleBars from './YScaleBars';
+const LinearMafDisplay = observer(function (props) {
+    const { model } = props;
+    const { pluginManager } = getEnv(model);
+    const LinearGenomePlugin = pluginManager.getPlugin('LinearGenomeViewPlugin');
+    const { BaseLinearDisplayComponent } = LinearGenomePlugin.exports;
+    return (React.createElement("div", null,
+        React.createElement(BaseLinearDisplayComponent, { ...props }),
+        React.createElement(YScaleBars, { model: model })));
+});
+export default LinearMafDisplay;
+//# sourceMappingURL=ReactComponent.js.map

package/dist/LinearMafDisplay/components/ReactComponent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ReactComponent.js","sourceRoot":"","sources":["../../../src/LinearMafDisplay/components/ReactComponent.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,MAAM,EAAE,MAAM,oBAAoB,CAAA;AAC3C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,UAAU,MAAM,cAAc,CAAA;AAGrC,MAAM,gBAAgB,GAAG,QAAQ,CAAC,UAAU,KAE3C;IACC,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,CAAA;IACvB,MAAM,EAAE,aAAa,EAAE,GAAG,MAAM,CAAC,KAAK,CAAC,CAAA;IAEvC,MAAM,kBAAkB,GAAG,aAAa,CAAC,SAAS,CAChD,wBAAwB,CAC+B,CAAA;IACzD,MAAM,EAAE,0BAA0B,EAAE,GAAG,kBAAkB,CAAC,OAAO,CAAA;IAEjE,OAAO,CACL;QACE,oBAAC,0BAA0B,OAAK,KAAK,GAAI;QACzC,oBAAC,UAAU,IAAC,KAAK,EAAE,KAAK,GAAI,CACxB,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,gBAAgB,CAAA"}

package/dist/LinearMafDisplay/components/RectBg.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+declare const RectBg: (props: {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+    color?: string;
+}) => React.JSX.Element;
+export default RectBg;

package/dist/LinearMafDisplay/components/RectBg.js

@@ -0,0 +1,7 @@
+import React from 'react';
+const RectBg = (props) => {
+    const { color = 'rgb(255,255,255,0.8)' } = props;
+    return React.createElement("rect", { ...props, fill: color });
+};
+export default RectBg;
+//# sourceMappingURL=RectBg.js.map

package/dist/LinearMafDisplay/components/RectBg.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RectBg.js","sourceRoot":"","sources":["../../../src/LinearMafDisplay/components/RectBg.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,MAAM,MAAM,GAAG,CAAC,KAMf,EAAE,EAAE;IACH,MAAM,EAAE,KAAK,GAAG,sBAAsB,EAAE,GAAG,KAAK,CAAA;IAChD,OAAO,iCAAU,KAAK,EAAE,IAAI,EAAE,KAAK,GAAI,CAAA;AACzC,CAAC,CAAA;AAED,eAAe,MAAM,CAAA"}

package/dist/LinearMafDisplay/components/SetRowHeight.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+declare const SetRowHeightDialog: (props: {
+    model: {
+        rowHeight?: number;
+        rowProportion?: number;
+        setRowHeight: (arg: number) => void;
+        setRowProportion: (arg: number) => void;
+    };
+    handleClose: () => void;
+}) => React.JSX.Element;
+export default SetRowHeightDialog;

package/dist/LinearMafDisplay/components/SetRowHeight.js

@@ -0,0 +1,36 @@
+import React, { useState } from 'react';
+import { observer } from 'mobx-react';
+import { Button, DialogActions, DialogContent, TextField, Typography, } from '@mui/material';
+import { Dialog } from '@jbrowse/core/ui';
+import { makeStyles } from 'tss-react/mui';
+const useStyles = makeStyles()({
+    root: {
+        width: 500,
+    },
+});
+const SetRowHeightDialog = observer(function (props) {
+    const { model, handleClose } = props;
+    const { classes } = useStyles();
+    const [rowHeight, setRowHeight] = useState(`${model.rowHeight}`);
+    const [rowProportion, setRowProportion] = useState(`${model.rowProportion}`);
+    return (React.createElement(Dialog, { open: true, onClose: handleClose, title: "Filter options" },
+        React.createElement(DialogContent, { className: classes.root },
+            React.createElement(Typography, null, "Set row height and the proportion of the row height to use for drawing each row"),
+            React.createElement(TextField, { value: rowHeight, onChange: event => {
+                    setRowHeight(event.target.value);
+                }, placeholder: "Enter row height" }),
+            React.createElement(TextField, { value: rowProportion, onChange: event => {
+                    setRowProportion(event.target.value);
+                }, placeholder: "Enter row proportion" }),
+            React.createElement(DialogActions, null,
+                React.createElement(Button, { variant: "contained", color: "primary", type: "submit", autoFocus: true, onClick: () => {
+                        model.setRowProportion(+rowProportion);
+                        model.setRowHeight(+rowHeight);
+                        handleClose();
+                    } }, "Submit"),
+                React.createElement(Button, { variant: "contained", color: "secondary", onClick: () => {
+                        handleClose();
+                    } }, "Cancel")))));
+});
+export default SetRowHeightDialog;
+//# sourceMappingURL=SetRowHeight.js.map

package/dist/LinearMafDisplay/components/SetRowHeight.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SetRowHeight.js","sourceRoot":"","sources":["../../../src/LinearMafDisplay/components/SetRowHeight.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AACvC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EACL,MAAM,EACN,aAAa,EACb,aAAa,EACb,SAAS,EACT,UAAU,GACX,MAAM,eAAe,CAAA;AACtB,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAA;AACzC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAE1C,MAAM,SAAS,GAAG,UAAU,EAAE,CAAC;IAC7B,IAAI,EAAE;QACJ,KAAK,EAAE,GAAG;KACX;CACF,CAAC,CAAA;AAEF,MAAM,kBAAkB,GAAG,QAAQ,CAAC,UAAU,KAQ7C;IACC,MAAM,EAAE,KAAK,EAAE,WAAW,EAAE,GAAG,KAAK,CAAA;IACpC,MAAM,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,CAAA;IAC/B,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,GAAG,KAAK,CAAC,SAAS,EAAE,CAAC,CAAA;IAChE,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAC,GAAG,KAAK,CAAC,aAAa,EAAE,CAAC,CAAA;IAE5E,OAAO,CACL,oBAAC,MAAM,IAAC,IAAI,QAAC,OAAO,EAAE,WAAW,EAAE,KAAK,EAAC,gBAAgB;QACvD,oBAAC,aAAa,IAAC,SAAS,EAAE,OAAO,CAAC,IAAI;YACpC,oBAAC,UAAU,0FAGE;YACb,oBAAC,SAAS,IACR,KAAK,EAAE,SAAS,EAChB,QAAQ,EAAE,KAAK,CAAC,EAAE;oBAChB,YAAY,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAA;gBAClC,CAAC,EACD,WAAW,EAAC,kBAAkB,GAC9B;YACF,oBAAC,SAAS,IACR,KAAK,EAAE,aAAa,EACpB,QAAQ,EAAE,KAAK,CAAC,EAAE;oBAChB,gBAAgB,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAA;gBACtC,CAAC,EACD,WAAW,EAAC,sBAAsB,GAClC;YACF,oBAAC,aAAa;gBACZ,oBAAC,MAAM,IACL,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,SAAS,EACf,IAAI,EAAC,QAAQ,EACb,SAAS,QACT,OAAO,EAAE,GAAG,EAAE;wBACZ,KAAK,CAAC,gBAAgB,CAAC,CAAC,aAAa,CAAC,CAAA;wBACtC,KAAK,CAAC,YAAY,CAAC,CAAC,SAAS,CAAC,CAAA;wBAC9B,WAAW,EAAE,CAAA;oBACf,CAAC,aAGM;gBACT,oBAAC,MAAM,IACL,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,WAAW,EACjB,OAAO,EAAE,GAAG,EAAE;wBACZ,WAAW,EAAE,CAAA;oBACf,CAAC,aAGM,CACK,CACF,CACT,CACV,CAAA;AACH,CAAC,CAAC,CAAA;AACF,eAAe,kBAAkB,CAAA"}

package/dist/LinearMafDisplay/components/YScaleBars.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+import { LinearMafDisplayModel } from '../stateModel';
+export declare function max(arr: number[], init?: number): number;
+export declare const YScaleBars: (props: {
+    model: LinearMafDisplayModel;
+    orientation?: string;
+    exportSVG?: boolean;
+}) => React.JSX.Element;
+export default YScaleBars;

package/dist/LinearMafDisplay/components/YScaleBars.js

@@ -0,0 +1,41 @@
+import React from 'react';
+import { measureText, getContainingView } from '@jbrowse/core/util';
+import { observer } from 'mobx-react';
+import ColorLegend from './ColorLegend';
+const Wrapper = observer(function ({ children, model, exportSVG, }) {
+    if (exportSVG) {
+        return React.createElement(React.Fragment, null, children);
+    }
+    else {
+        const { rowHeight, samples } = model;
+        return (React.createElement("svg", { style: {
+                position: 'absolute',
+                top: 0,
+                left: 0,
+                pointerEvents: 'none',
+                height: samples.length * rowHeight,
+                width: getContainingView(model).width,
+            } }, children));
+    }
+});
+export function max(arr, init = Number.NEGATIVE_INFINITY) {
+    let max = init;
+    for (const entry of arr) {
+        max = Math.max(entry, max);
+    }
+    return max;
+}
+export const YScaleBars = observer(function (props) {
+    const { model } = props;
+    const { rowHeight, samples } = model;
+    const svgFontSize = Math.min(Math.max(rowHeight, 10), 14);
+    const canDisplayLabel = rowHeight >= 10;
+    const minWidth = 20;
+    const labelWidth = max(samples
+        .map(s => measureText(s.label, svgFontSize))
+        .map(width => (canDisplayLabel ? width : minWidth)));
+    return (React.createElement(Wrapper, { ...props },
+        React.createElement(ColorLegend, { model: model, labelWidth: labelWidth, svgFontSize: svgFontSize })));
+});
+export default YScaleBars;
+//# sourceMappingURL=YScaleBars.js.map

package/dist/LinearMafDisplay/components/YScaleBars.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"YScaleBars.js","sourceRoot":"","sources":["../../../src/LinearMafDisplay/components/YScaleBars.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,WAAW,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAA;AACnE,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAIrC,OAAO,WAAW,MAAM,eAAe,CAAA;AAEvC,MAAM,OAAO,GAAG,QAAQ,CAAC,UAAU,EACjC,QAAQ,EACR,KAAK,EACL,SAAS,GAKV;IACC,IAAI,SAAS,EAAE,CAAC;QACd,OAAO,0CAAG,QAAQ,CAAI,CAAA;IACxB,CAAC;SAAM,CAAC;QACN,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,KAAK,CAAA;QACpC,OAAO,CACL,6BACE,KAAK,EAAE;gBACL,QAAQ,EAAE,UAAU;gBACpB,GAAG,EAAE,CAAC;gBACN,IAAI,EAAE,CAAC;gBACP,aAAa,EAAE,MAAM;gBACrB,MAAM,EAAE,OAAO,CAAC,MAAM,GAAG,SAAS;gBAClC,KAAK,EAAE,iBAAiB,CAAC,KAAK,CAAC,CAAC,KAAK;aACtC,IAEA,QAAQ,CACL,CACP,CAAA;IACH,CAAC;AACH,CAAC,CAAC,CAAA;AAEF,MAAM,UAAU,GAAG,CAAC,GAAa,EAAE,IAAI,GAAG,MAAM,CAAC,iBAAiB;IAChE,IAAI,GAAG,GAAG,IAAI,CAAA;IACd,KAAK,MAAM,KAAK,IAAI,GAAG,EAAE,CAAC;QACxB,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,GAAG,CAAC,CAAA;IAC5B,CAAC;IACD,OAAO,GAAG,CAAA;AACZ,CAAC;AAED,MAAM,CAAC,MAAM,UAAU,GAAG,QAAQ,CAAC,UAAU,KAI5C;IACC,MAAM,EAAE,KAAK,EAAE,GAAG,KAAK,CAAA;IACvB,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,KAAK,CAAA;IACpC,MAAM,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,SAAS,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC,CAAA;IACzD,MAAM,eAAe,GAAG,SAAS,IAAI,EAAE,CAAA;IACvC,MAAM,QAAQ,GAAG,EAAE,CAAA;IAEnB,MAAM,UAAU,GAAG,GAAG,CACpB,OAAO;SACJ,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC,CAAC,KAAK,EAAE,WAAW,CAAC,CAAC;SAC3C,GAAG,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CACtD,CAAA;IAED,OAAO,CACL,oBAAC,OAAO,OAAK,KAAK;QAChB,oBAAC,WAAW,IACV,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,UAAU,EACtB,WAAW,EAAE,WAAW,GACxB,CACM,CACX,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,UAAU,CAAA"}

package/dist/LinearMafDisplay/configSchema.d.ts

@@ -0,0 +1,34 @@
+import PluginManager from '@jbrowse/core/PluginManager';
+export default function configSchemaF(pluginManager: PluginManager): import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaType<{
+    /**
+     * #slot
+     */
+    renderer: import("mobx-state-tree").IAnyModelType;
+}, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaType<{
+    maxFeatureScreenDensity: {
+        type: string;
+        description: string;
+        defaultValue: number;
+    };
+    fetchSizeLimit: {
+        type: string;
+        defaultValue: number;
+        description: string;
+    };
+    height: {
+        type: string;
+        defaultValue: number;
+        description: string;
+    };
+    mouseover: {
+        type: string;
+        description: string;
+        defaultValue: string;
+        contextVariable: string[];
+    };
+    jexlFilters: {
+        type: string;
+        description: string;
+        defaultValue: never[];
+    };
+}, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<undefined, "displayId">>, undefined>>;

package/dist/LinearMafDisplay/configSchema.js

@@ -0,0 +1,15 @@
+import { ConfigurationSchema } from '@jbrowse/core/configuration';
+export default function configSchemaF(pluginManager) {
+    const LinearGenomePlugin = pluginManager.getPlugin('LinearGenomeViewPlugin');
+    const { baseLinearDisplayConfigSchema } = LinearGenomePlugin.exports;
+    return ConfigurationSchema('LinearMafDisplay', {
+        /**
+         * #slot
+         */
+        renderer: pluginManager.pluggableConfigSchemaType('renderer'),
+    }, {
+        baseConfiguration: baseLinearDisplayConfigSchema,
+        explicitlyTyped: true,
+    });
+}
+//# sourceMappingURL=configSchema.js.map

package/dist/LinearMafDisplay/configSchema.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"configSchema.js","sourceRoot":"","sources":["../../src/LinearMafDisplay/configSchema.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAE,MAAM,6BAA6B,CAAA;AAEjE,MAAM,CAAC,OAAO,UAAU,aAAa,CAAC,aAA4B;IAChE,MAAM,kBAAkB,GAAG,aAAa,CAAC,SAAS,CAChD,wBAAwB,CAC+B,CAAA;IACzD,MAAM,EAAE,6BAA6B,EAAE,GAAG,kBAAkB,CAAC,OAAO,CAAA;IACpE,OAAO,mBAAmB,CACxB,kBAAkB,EAClB;QACE;;WAEG;QACH,QAAQ,EAAE,aAAa,CAAC,yBAAyB,CAAC,UAAU,CAAC;KAC9D,EACD;QACE,iBAAiB,EAAE,6BAA6B;QAChD,eAAe,EAAE,IAAI;KACtB,CACF,CAAA;AACH,CAAC"}

package/dist/LinearMafDisplay/index.d.ts

@@ -0,0 +1,2 @@
+import PluginManager from '@jbrowse/core/PluginManager';
+export default function LinearMafDisplayF(pluginManager: PluginManager): void;

package/dist/LinearMafDisplay/index.js

@@ -0,0 +1,20 @@
+import { DisplayType } from '@jbrowse/core/pluggableElementTypes';
+import configSchemaF from './configSchema';
+import stateModelFactory from './stateModel';
+import ReactComponent from './components/ReactComponent';
+export default function LinearMafDisplayF(pluginManager) {
+    pluginManager.addDisplayType(() => {
+        const configSchema = configSchemaF(pluginManager);
+        const stateModel = stateModelFactory(configSchema, pluginManager);
+        return new DisplayType({
+            name: 'LinearMafDisplay',
+            configSchema,
+            stateModel,
+            ReactComponent,
+            viewType: 'LinearGenomeView',
+            trackType: 'MafTrack',
+            displayName: 'MAF display',
+        });
+    });
+}
+//# sourceMappingURL=index.js.map

package/dist/LinearMafDisplay/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/LinearMafDisplay/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,MAAM,qCAAqC,CAAA;AACjE,OAAO,aAAa,MAAM,gBAAgB,CAAA;AAC1C,OAAO,iBAAiB,MAAM,cAAc,CAAA;AAC5C,OAAO,cAAc,MAAM,6BAA6B,CAAA;AAExD,MAAM,CAAC,OAAO,UAAU,iBAAiB,CAAC,aAA4B;IACpE,aAAa,CAAC,cAAc,CAAC,GAAG,EAAE;QAChC,MAAM,YAAY,GAAG,aAAa,CAAC,aAAa,CAAC,CAAA;QACjD,MAAM,UAAU,GAAG,iBAAiB,CAAC,YAAY,EAAE,aAAa,CAAC,CAAA;QACjE,OAAO,IAAI,WAAW,CAAC;YACrB,IAAI,EAAE,kBAAkB;YACxB,YAAY;YACZ,UAAU;YACV,cAAc;YACd,QAAQ,EAAE,kBAAkB;YAC5B,SAAS,EAAE,UAAU;YACrB,WAAW,EAAE,aAAa;SAC3B,CAAC,CAAA;IACJ,CAAC,CAAC,CAAA;AACJ,CAAC"}

package/dist/LinearMafDisplay/renderSvg.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { ExportSvgDisplayOptions } from '@jbrowse/plugin-linear-genome-view';
+import { LinearMafDisplayModel } from './stateModel';
+export declare function renderSvg(self: LinearMafDisplayModel, opts: ExportSvgDisplayOptions, superRenderSvg: (opts: ExportSvgDisplayOptions) => Promise<React.ReactNode>): Promise<React.JSX.Element>;

package/dist/LinearMafDisplay/renderSvg.js

@@ -0,0 +1,17 @@
+import React from 'react';
+import { getContainingView } from '@jbrowse/core/util';
+import YScaleBars from './components/YScaleBars';
+export async function renderSvg(self, opts, superRenderSvg) {
+    const { height, id } = self;
+    const { offsetPx, width } = getContainingView(self);
+    const clipid = `mafclip-${id}`;
+    return (React.createElement(React.Fragment, null,
+        React.createElement("defs", null,
+            React.createElement("clipPath", { id: clipid },
+                React.createElement("rect", { x: 0, y: 0, width: width, height: height }))),
+        React.createElement("g", { clipPath: `url(#${clipid})` },
+            React.createElement("g", { id: "snpcov" }, await superRenderSvg(opts)),
+            React.createElement("g", { transform: `translate(${Math.max(-offsetPx, 0)})` },
+                React.createElement(YScaleBars, { model: self, orientation: "left", exportSVG: true })))));
+}
+//# sourceMappingURL=renderSvg.js.map

package/dist/LinearMafDisplay/renderSvg.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"renderSvg.js","sourceRoot":"","sources":["../../src/LinearMafDisplay/renderSvg.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAA;AAQtD,OAAO,UAAU,MAAM,yBAAyB,CAAA;AAEhD,MAAM,CAAC,KAAK,UAAU,SAAS,CAC7B,IAA2B,EAC3B,IAA6B,EAC7B,cAA2E;IAE3E,MAAM,EAAE,MAAM,EAAE,EAAE,EAAE,GAAG,IAAI,CAAA;IAC3B,MAAM,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,iBAAiB,CAAC,IAAI,CAA0B,CAAA;IAC5E,MAAM,MAAM,GAAG,WAAW,EAAE,EAAE,CAAA;IAC9B,OAAO,CACL;QACE;YACE,kCAAU,EAAE,EAAE,MAAM;gBAClB,8BAAM,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,GAAI,CACzC,CACN;QACP,2BAAG,QAAQ,EAAE,QAAQ,MAAM,GAAG;YAC5B,2BAAG,EAAE,EAAC,QAAQ,IAAE,MAAM,cAAc,CAAC,IAAI,CAAC,CAAK;YAC/C,2BAAG,SAAS,EAAE,aAAa,IAAI,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC,GAAG;gBAClD,oBAAC,UAAU,IAAC,KAAK,EAAE,IAAI,EAAE,WAAW,EAAC,MAAM,EAAC,SAAS,SAAG,CACtD,CACF,CACH,CACJ,CAAA;AACH,CAAC"}