@jbrowse/plugin-alignments 3.6.4 → 3.7.0

package/dist/LinearReadArcsDisplay/model.d.ts

@@ -1,6 +1,4 @@
 import type React from 'react';
-import type { ChainData } from '../shared/fetchChains';
-import type { ColorBy, FilterBy } from '../shared/types';
 import type { AnyConfigurationSchemaType } from '@jbrowse/core/configuration';
 import type { Instance } from 'mobx-state-tree';
 declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): import("mobx-state-tree").IModelType<{
@@ -12,13 +10,14 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
 } & {
     userBpPerPxLimit: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<number>>;
     userByteSizeLimit: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<number>>;
+} & {
+    filterBySetting: import("mobx-state-tree").IType<import("../shared/types").FilterBy | undefined, import("../shared/types").FilterBy | undefined, import("../shared/types").FilterBy | undefined>;
+    colorBySetting: import("mobx-state-tree").IType<import("../shared/types").ColorBy | undefined, import("../shared/types").ColorBy | undefined, import("../shared/types").ColorBy | undefined>;
 } & {
     type: import("mobx-state-tree").ISimpleType<"LinearReadArcsDisplay">;
     configuration: AnyConfigurationSchemaType;
     lineWidth: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<number>>;
     jitter: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<number>>;
-    colorBySetting: import("mobx-state-tree").IType<ColorBy | undefined, ColorBy | undefined, ColorBy | undefined>;
-    filterBySetting: import("mobx-state-tree").IType<FilterBy | undefined, FilterBy | undefined, FilterBy | undefined>;
     drawInter: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
     drawLongRange: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
 }, {
@@ -115,43 +114,51 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
     regionCannotBeRendered(_region: import("@jbrowse/core/util").Region): import("react/jsx-runtime").JSX.Element | null;
 } & {
     loading: boolean;
-    chainData: ChainData | undefined;
+    chainData: import("../shared/fetchChains").ChainData | undefined;
     lastDrawnOffsetPx: number | undefined;
     lastDrawnBpPerPx: number;
     ref: HTMLCanvasElement | null;
-} & {
-    readonly colorBy: any;
-    readonly filterBy: any;
 } & {
     setLastDrawnOffsetPx(n: number): void;
     setLastDrawnBpPerPx(n: number): void;
     setLoading(f: boolean): void;
-    reload(): void;
     setRef(ref: HTMLCanvasElement | null): void;
     setColorScheme(colorBy: {
         type: string;
     }): void;
-    setChainData(args: ChainData): void;
+    setChainData(args: import("../shared/fetchChains").ChainData): void;
+    setFilterBy(filter: import("../shared/types").FilterBy): void;
+} & {
+    readonly drawn: boolean;
+} & {
+    readonly colorBy: any;
+    readonly filterBy: any;
+} & {
+    reload(): void;
     setDrawInter(f: boolean): void;
     setDrawLongRange(f: boolean): void;
-    setFilterBy(filter: FilterBy): void;
     setLineWidth(n: number): void;
     setJitter(n: number): void;
 } & {
-    readonly drawn: boolean;
     readonly lineWidthSetting: any;
     readonly jitterVal: number;
 } & {
     renderProps(): any;
     trackMenuItems(): (import("@jbrowse/core/ui").MenuDivider | import("@jbrowse/core/ui").MenuSubHeader | import("@jbrowse/core/ui").NormalMenuItem | import("@jbrowse/core/ui").CheckboxMenuItem | import("@jbrowse/core/ui").RadioMenuItem | import("@jbrowse/core/ui").SubMenuItem | {
+        label: string;
+        icon: import("@mui/material/OverridableComponent").OverridableComponent<import("@mui/material").SvgIconTypeMap<{}, "svg">> & {
+            muiName: string;
+        };
+        subMenu: {
+            label: string;
+            onClick: () => void;
+        }[];
+    } | {
         label: string;
         icon: import("@mui/material/OverridableComponent").OverridableComponent<import("@mui/material").SvgIconTypeMap<{}, "svg">> & {
             muiName: string;
         };
         onClick: () => void;
-        subMenu?: undefined;
-        type?: undefined;
-        checked?: undefined;
     } | {
         label: string;
         subMenu: {
@@ -160,29 +167,15 @@ declare function stateModelFactory(configSchema: AnyConfigurationSchemaType): im
             label: string;
             onClick: () => void;
         }[];
-        icon?: undefined;
-        onClick?: undefined;
         type?: undefined;
         checked?: undefined;
+        onClick?: undefined;
     } | {
         label: string;
         type: string;
         checked: boolean;
         onClick: () => void;
-        icon?: undefined;
         subMenu?: undefined;
-    } | {
-        label: string;
-        icon: import("@mui/material/OverridableComponent").OverridableComponent<import("@mui/material").SvgIconTypeMap<{}, "svg">> & {
-            muiName: string;
-        };
-        subMenu: {
-            label: string;
-            onClick: () => void;
-        }[];
-        onClick?: undefined;
-        type?: undefined;
-        checked?: undefined;
     })[];
 } & {
     renderSvg(opts: {

package/dist/LinearReadArcsDisplay/model.js

@@ -32,37 +32,22 @@ var __importStar = (this && this.__importStar) || (function () {
         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 = require("react");
 const configuration_1 = require("@jbrowse/core/configuration");
 const pluggableElementTypes_1 = require("@jbrowse/core/pluggableElementTypes");
-const util_1 = require("@jbrowse/core/util");
 const plugin_linear_genome_view_1 = require("@jbrowse/plugin-linear-genome-view");
-const ClearAll_1 = __importDefault(require("@mui/icons-material/ClearAll"));
-const Palette_1 = __importDefault(require("@mui/icons-material/Palette"));
 const mobx_state_tree_1 = require("mobx-state-tree");
-const FilterByTagDialog = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('../shared/components/FilterByTagDialog'))));
+const LinearReadDisplayBaseMixin_1 = require("../shared/LinearReadDisplayBaseMixin");
+const menuItems_1 = require("../shared/menuItems");
 function stateModelFactory(configSchema) {
     return mobx_state_tree_1.types
-        .compose('LinearReadArcsDisplay', pluggableElementTypes_1.BaseDisplay, (0, plugin_linear_genome_view_1.TrackHeightMixin)(), (0, plugin_linear_genome_view_1.FeatureDensityMixin)(), mobx_state_tree_1.types.model({
+        .compose('LinearReadArcsDisplay', pluggableElementTypes_1.BaseDisplay, (0, plugin_linear_genome_view_1.TrackHeightMixin)(), (0, plugin_linear_genome_view_1.FeatureDensityMixin)(), (0, LinearReadDisplayBaseMixin_1.LinearReadDisplayBaseMixin)(), mobx_state_tree_1.types.model({
         type: mobx_state_tree_1.types.literal('LinearReadArcsDisplay'),
         configuration: (0, configuration_1.ConfigurationReference)(configSchema),
         lineWidth: mobx_state_tree_1.types.maybe(mobx_state_tree_1.types.number),
         jitter: mobx_state_tree_1.types.maybe(mobx_state_tree_1.types.number),
-        colorBySetting: mobx_state_tree_1.types.frozen(),
-        filterBySetting: mobx_state_tree_1.types.frozen(),
         drawInter: true,
         drawLongRange: true,
-    }))
-        .volatile(() => ({
-        loading: false,
-        chainData: undefined,
-        lastDrawnOffsetPx: undefined,
-        lastDrawnBpPerPx: 0,
-        ref: null,
     }))
         .views(self => ({
         get colorBy() {
@@ -75,40 +60,15 @@ function stateModelFactory(configSchema) {
         },
     }))
         .actions(self => ({
-        setLastDrawnOffsetPx(n) {
-            self.lastDrawnOffsetPx = n;
-        },
-        setLastDrawnBpPerPx(n) {
-            self.lastDrawnBpPerPx = n;
-        },
-        setLoading(f) {
-            self.loading = f;
-        },
         reload() {
             self.error = undefined;
         },
-        setRef(ref) {
-            self.ref = ref;
-        },
-        setColorScheme(colorBy) {
-            self.colorBySetting = {
-                ...colorBy,
-            };
-        },
-        setChainData(args) {
-            self.chainData = args;
-        },
         setDrawInter(f) {
             self.drawInter = f;
         },
         setDrawLongRange(f) {
             self.drawLongRange = f;
         },
-        setFilterBy(filter) {
-            self.filterBySetting = {
-                ...filter,
-            };
-        },
         setLineWidth(n) {
             self.lineWidth = n;
         },
@@ -117,9 +77,6 @@ function stateModelFactory(configSchema) {
         },
     }))
         .views(self => ({
-        get drawn() {
-            return self.lastDrawnOffsetPx !== undefined;
-        },
         get lineWidthSetting() {
             var _a;
             return (_a = self.lineWidth) !== null && _a !== void 0 ? _a : (0, configuration_1.getConf)(self, 'lineWidth');
@@ -141,16 +98,7 @@ function stateModelFactory(configSchema) {
             trackMenuItems() {
                 return [
                     ...superTrackMenuItems(),
-                    {
-                        label: 'Filter by',
-                        icon: ClearAll_1.default,
-                        onClick: () => {
-                            (0, util_1.getSession)(self).queueDialog(handleClose => [
-                                FilterByTagDialog,
-                                { model: self, handleClose },
-                            ]);
-                        },
-                    },
+                    (0, menuItems_1.getFilterByMenuItem)(self),
                     {
                         label: 'Line width',
                         subMenu: [
@@ -219,36 +167,7 @@ function stateModelFactory(configSchema) {
                             self.setDrawLongRange(!self.drawLongRange);
                         },
                     },
-                    {
-                        label: 'Color scheme',
-                        icon: Palette_1.default,
-                        subMenu: [
-                            {
-                                label: 'Insert size ± 3σ and orientation',
-                                onClick: () => {
-                                    self.setColorScheme({ type: 'insertSizeAndOrientation' });
-                                },
-                            },
-                            {
-                                label: 'Insert size ± 3σ',
-                                onClick: () => {
-                                    self.setColorScheme({ type: 'insertSize' });
-                                },
-                            },
-                            {
-                                label: 'Orientation',
-                                onClick: () => {
-                                    self.setColorScheme({ type: 'orientation' });
-                                },
-                            },
-                            {
-                                label: 'Insert size gradient',
-                                onClick: () => {
-                                    self.setColorScheme({ type: 'gradient' });
-                                },
-                            },
-                        ],
-                    },
+                    (0, menuItems_1.getColorSchemeMenuItem)(self),
                 ];
             },
         };

package/dist/LinearReadCloudDisplay/components/ReactComponent.js

@@ -5,17 +5,99 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("react");
+const BaseTooltip_1 = __importDefault(require("@jbrowse/core/ui/BaseTooltip"));
 const util_1 = require("@jbrowse/core/util");
+const flatbush_1 = __importDefault(require("@jbrowse/core/util/flatbush"));
 const mobx_react_1 = require("mobx-react");
 const BaseDisplayComponent_1 = __importDefault(require("../../shared/components/BaseDisplayComponent"));
 const Cloud = (0, mobx_react_1.observer)(function ({ model, }) {
     const view = (0, util_1.getContainingView)(model);
     const width = Math.round(view.dynamicBlocks.totalWidthPx);
-    const height = model.height;
+    const height = model.drawCloud ? model.height : model.layoutHeight;
+    const containerRef = (0, react_1.useRef)(null);
+    const [hoveredFeature, setHoveredFeature] = (0, react_1.useState)(null);
+    const [hoveredFeatureData, setHoveredFeatureData] = (0, react_1.useState)(null);
+    const [mousePosition, setMousePosition] = (0, react_1.useState)(null);
+    const flatbushIndex = (0, react_1.useMemo)(() => {
+        return model.featureLayout ? flatbush_1.default.from(model.featureLayout.data) : null;
+    }, [model.featureLayout]);
     const cb = (0, react_1.useCallback)((ref) => {
         model.setRef(ref);
     }, [model, width, height]);
-    return ((0, jsx_runtime_1.jsx)("canvas", { "data-testid": "cloud-canvas", ref: cb, style: { width, height, position: 'absolute' }, width: width * 2, height: height * 2 }));
+    const mouseoverCb = (0, react_1.useCallback)((ref) => {
+        model.setMouseoverRef(ref);
+    }, [model, width, height]);
+    const onMouseMove = (0, react_1.useCallback)((event) => {
+        if (!containerRef.current || !flatbushIndex) {
+            setHoveredFeature(null);
+            setHoveredFeatureData(null);
+            setMousePosition(null);
+            return;
+        }
+        const rect = containerRef.current.getBoundingClientRect();
+        const offsetX = event.clientX - rect.left;
+        const offsetY = event.clientY - rect.top;
+        setMousePosition({ x: event.clientX, y: event.clientY });
+        const results = flatbushIndex.search(offsetX, offsetY, offsetX + 1, offsetY + 1);
+        if (results.length > 0) {
+            const featureIndex = results[0];
+            const feature = model.featuresForFlatbush[featureIndex];
+            if (feature) {
+                setHoveredFeature({
+                    x: feature.chainMinX,
+                    y: feature.y1,
+                    width: feature.chainMaxX - feature.chainMinX,
+                    height: feature.y2 - feature.y1,
+                });
+                setHoveredFeatureData(feature.data);
+            }
+            else {
+                setHoveredFeature(null);
+                setHoveredFeatureData(null);
+            }
+        }
+        else {
+            setHoveredFeature(null);
+            setHoveredFeatureData(null);
+        }
+    }, [flatbushIndex, model.featuresForFlatbush]);
+    const onMouseLeave = (0, react_1.useCallback)(() => {
+        setHoveredFeature(null);
+        setHoveredFeatureData(null);
+        setMousePosition(null);
+    }, []);
+    const onClick = (0, react_1.useCallback)((event) => {
+        if (!containerRef.current || !flatbushIndex) {
+            return;
+        }
+        const rect = containerRef.current.getBoundingClientRect();
+        const offsetX = event.clientX - rect.left;
+        const offsetY = event.clientY - rect.top;
+        const results = flatbushIndex.search(offsetX, offsetY, offsetX + 1, offsetY + 1);
+        if (results.length > 0) {
+            const featureIndex = results[0];
+            const feature = model.featuresForFlatbush[featureIndex];
+            if (feature) {
+                model.selectFeature(feature.chain);
+            }
+        }
+    }, [flatbushIndex, model]);
+    return ((0, jsx_runtime_1.jsxs)("div", { ref: containerRef, style: { position: 'relative', width, height }, onMouseMove: onMouseMove, onMouseLeave: onMouseLeave, onClick: onClick, children: [(0, jsx_runtime_1.jsx)("canvas", { "data-testid": model.drawCloud ? 'cloud-canvas' : 'stack-canvas', ref: cb, style: { width, height, position: 'absolute', left: 0, top: 0 }, width: width * 2, height: height * 2 }), (0, jsx_runtime_1.jsx)("canvas", { "data-testid": "cloud-mouseover-canvas", ref: mouseoverCb, style: {
+                    width,
+                    height,
+                    position: 'absolute',
+                    left: 0,
+                    top: 0,
+                    pointerEvents: 'none',
+                }, width: width * 2, height: height * 2 }), hoveredFeature ? ((0, jsx_runtime_1.jsx)("div", { style: {
+                    position: 'absolute',
+                    left: hoveredFeature.x,
+                    top: hoveredFeature.y,
+                    width: hoveredFeature.width,
+                    height: hoveredFeature.height,
+                    backgroundColor: 'rgba(0, 0, 0, 0.2)',
+                    pointerEvents: 'none',
+                } })) : null, hoveredFeatureData && mousePosition ? ((0, jsx_runtime_1.jsx)(BaseTooltip_1.default, { clientPoint: { x: mousePosition.x, y: mousePosition.y + 20 }, placement: "bottom-start", children: (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)("strong", { children: hoveredFeatureData.name }) }), (0, jsx_runtime_1.jsxs)("div", { children: [hoveredFeatureData.refName, ":", hoveredFeatureData.start.toLocaleString(), "-", hoveredFeatureData.end.toLocaleString()] }), hoveredFeatureData.tlen !== 0 ? ((0, jsx_runtime_1.jsxs)("div", { children: ["Template length: ", hoveredFeatureData.tlen] })) : null] }) })) : null] }));
 });
 const LinearReadCloudReactComponent = (0, mobx_react_1.observer)(function ({ model, }) {
     return ((0, jsx_runtime_1.jsx)(BaseDisplayComponent_1.default, { model: model, children: (0, jsx_runtime_1.jsx)(Cloud, { model: model }) }));

package/dist/LinearReadCloudDisplay/components/SetFeatureHeightDialog.d.ts

@@ -0,0 +1,10 @@
+declare const SetFeatureHeightDialog: (props: {
+    model: {
+        setFeatureHeight: (arg?: number) => void;
+        setNoSpacing: (arg?: boolean) => void;
+        featureHeightSetting: number;
+        noSpacing?: boolean;
+    };
+    handleClose: () => void;
+}) => import("react/jsx-runtime").JSX.Element;
+export default SetFeatureHeightDialog;

package/dist/LinearReadCloudDisplay/components/SetFeatureHeightDialog.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const ui_1 = require("@jbrowse/core/ui");
+const material_1 = require("@mui/material");
+const mobx_react_1 = require("mobx-react");
+const SetFeatureHeightDialog = (0, mobx_react_1.observer)(function (props) {
+    const { model, handleClose } = props;
+    const { featureHeightSetting, noSpacing: noSpacingSetting } = model;
+    const [height, setHeight] = (0, react_1.useState)(`${featureHeightSetting}`);
+    const [noSpacing, setNoSpacing] = (0, react_1.useState)(noSpacingSetting);
+    const ok = height !== '' && !Number.isNaN(+height);
+    return ((0, jsx_runtime_1.jsx)(ui_1.Dialog, { open: true, onClose: handleClose, title: "Set feature height", children: (0, jsx_runtime_1.jsxs)(material_1.DialogContent, { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { children: "Adjust the feature height and whether there is any spacing between features. Setting feature height to 1 and removing spacing makes the display very compact." }), (0, jsx_runtime_1.jsx)(material_1.TextField, { value: height, helperText: "Feature height", onChange: event => {
+                        setHeight(event.target.value);
+                    } }), (0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { control: (0, jsx_runtime_1.jsx)(material_1.Checkbox, { checked: !!noSpacing, onChange: () => {
+                            setNoSpacing(val => !val);
+                        } }), label: "Remove spacing between features in y-direction?" }), (0, jsx_runtime_1.jsxs)(material_1.DialogActions, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", color: "primary", type: "submit", autoFocus: true, disabled: !ok, onClick: () => {
+                                model.setFeatureHeight(height !== '' && !Number.isNaN(+height) ? +height : undefined);
+                                model.setNoSpacing(noSpacing);
+                                handleClose();
+                            }, children: "Submit" }), (0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", color: "secondary", onClick: () => {
+                                handleClose();
+                            }, children: "Cancel" })] })] }) }));
+});
+exports.default = SetFeatureHeightDialog;

package/dist/LinearReadCloudDisplay/configSchema.d.ts

@@ -15,6 +15,13 @@ declare function configSchemaF(pluginManager: PluginManager): import("@jbrowse/c
             type: string;
         };
     };
+    filterBy: {
+        type: string;
+        defaultValue: {
+            flagInclude: number;
+            flagExclude: number;
+        };
+    };
 }, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaType<{
     renderer: import("mobx-state-tree").IAnyModelType;
 }, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaType<{

package/dist/LinearReadCloudDisplay/configSchema.js

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const configuration_1 = require("@jbrowse/core/configuration");
 const plugin_linear_genome_view_1 = require("@jbrowse/plugin-linear-genome-view");
+const util_1 = require("../shared/util");
 function configSchemaF(pluginManager) {
     return (0, configuration_1.ConfigurationSchema)('LinearReadCloudDisplay', {
         maxFeatureScreenDensity: {
@@ -17,6 +18,10 @@ function configSchemaF(pluginManager) {
             type: 'frozen',
             defaultValue: { type: 'insertSizeAndOrientation' },
         },
+        filterBy: {
+            type: 'frozen',
+            defaultValue: util_1.defaultFilterFlags,
+        },
     }, {
         baseConfiguration: (0, plugin_linear_genome_view_1.linearBasicDisplayConfigSchemaFactory)(pluginManager),
         explicitlyTyped: true,

package/dist/LinearReadCloudDisplay/drawFeatsAbstract.js

@@ -0,0 +1,13 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.drawFeats = drawFeats;
+const drawFeatsCloud_1 = require("./drawFeatsCloud");
+const drawFeatsStack_1 = require("./drawFeatsStack");
+function drawFeats(self, ctx) {
+    if (self.drawCloud) {
+        (0, drawFeatsCloud_1.drawFeats)(self, ctx);
+    }
+    else {
+        (0, drawFeatsStack_1.drawFeats)(self, ctx);
+    }
+}

package/dist/LinearReadCloudDisplay/drawFeatsCloud.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.drawFeats = drawFeats;
+const util_1 = require("@jbrowse/core/util");
+const drawFeatsCommon_1 = require("./drawFeatsCommon");
+function calculateCloudYOffsets(computedChains, self, _view, _featureHeight) {
+    const distances = computedChains.map(c => c.distance).filter(d => d > 0);
+    if (distances.length === 0) {
+        return { chainYOffsets: new Map() };
+    }
+    const logOffset = 10;
+    const maxD = Math.log((0, util_1.max)(distances) + logOffset);
+    const minD = Math.log((0, util_1.min)(distances) + logOffset);
+    const scaler = (self.height - 20) / (maxD - minD || 1);
+    const chainYOffsets = new Map();
+    for (const { id, distance } of computedChains) {
+        const top = distance > 0 ? (Math.log(distance + logOffset) - minD) * scaler : 0;
+        chainYOffsets.set(id, top);
+    }
+    return { chainYOffsets };
+}
+function drawFeats(self, ctx) {
+    (0, drawFeatsCommon_1.drawFeatsCommon)(self, ctx, calculateCloudYOffsets);
+}

package/dist/LinearReadCloudDisplay/drawFeatsCommon.d.ts

@@ -0,0 +1,23 @@
+import type { LinearReadCloudDisplayModel } from './model';
+import type { ChainData, ReducedFeature } from '../shared/fetchChains';
+import type { FlatbushEntry } from '../shared/flatbushType';
+import type { Assembly } from '@jbrowse/core/assemblyManager/assembly';
+import type { LinearGenomeViewModel } from '@jbrowse/plugin-linear-genome-view';
+type LGV = LinearGenomeViewModel;
+export interface ComputedChain {
+    distance: number;
+    minX: number;
+    maxX: number;
+    chain: ReducedFeature[];
+    id: string;
+}
+export declare function filterChains(chains: ReducedFeature[][], drawSingletons: boolean, drawProperPairs: boolean, type: string, chainData: ChainData): ReducedFeature[][];
+export declare function computeChainBounds(chains: ReducedFeature[][], view: LGV, asm: Assembly): ComputedChain[];
+export declare function sortComputedChains(computedChains: ComputedChain[]): void;
+export declare function buildFlatbushIndex(featuresForFlatbush: FlatbushEntry[], self: LinearReadCloudDisplayModel): void;
+export declare function addChainMouseoverRects(computedChains: ComputedChain[], chainYOffsets: Map<string, number>, featureHeight: number, view: LGV, featuresForFlatbush: FlatbushEntry[]): void;
+export declare function drawFeatsCommon(self: LinearReadCloudDisplayModel, ctx: CanvasRenderingContext2D, calculateYOffsets: (computedChains: ComputedChain[], self: LinearReadCloudDisplayModel, view: LGV, featureHeight: number) => {
+    chainYOffsets: Map<string, number>;
+    layoutHeight?: number;
+}): void;
+export {};