@jbrowse/plugin-linear-comparative-view 3.4.0 → 3.5.0

package/dist/LGVSyntenyDisplay/model.d.ts

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

package/dist/LinearComparativeView/components/HeaderSearchBoxes.js

@@ -19,6 +19,6 @@ const useStyles = (0, mui_1.makeStyles)()(() => ({
 const HeaderSearchBoxes = (0, mobx_react_1.observer)(function ({ view, }) {
     const { classes } = useStyles();
     const { assemblyNames, coarseTotalBp } = view;
-    return ((0, jsx_runtime_1.jsxs)("span", { className: classes.searchBox, children: [(0, jsx_runtime_1.jsx)(plugin_linear_genome_view_1.SearchBox, { model: view, showHelp: false }), (0, jsx_runtime_1.jsxs)(material_1.Typography, { variant: "body2", color: "textSecondary", className: classes.bp, children: [assemblyNames.join(','), " ", (0, util_1.toLocale)(Math.round(coarseTotalBp)), " bp"] })] }));
+    return ((0, jsx_runtime_1.jsxs)("span", { className: classes.searchBox, children: [(0, jsx_runtime_1.jsx)(plugin_linear_genome_view_1.SearchBox, { model: view, showHelp: false }), (0, jsx_runtime_1.jsxs)(material_1.Typography, { variant: "body2", color: "textSecondary", className: classes.bp, children: [assemblyNames.join(','), " ", (0, util_1.getBpDisplayStr)(coarseTotalBp)] })] }));
 });
 exports.default = HeaderSearchBoxes;

package/dist/LinearComparativeView/model.d.ts

@@ -77,7 +77,8 @@ declare function stateModelFactory(pluginManager: PluginManager): import("mobx-s
         readonly width: number;
         readonly interRegionPaddingWidth: number;
         readonly assemblyNames: string[];
-        readonly stickyViewHeaders: boolean;
+        readonly isTopLevelView: import("@jbrowse/core/util").AbstractViewModel | undefined;
+        readonly stickyViewHeaders: boolean | undefined;
         readonly rubberbandTop: number;
         readonly pinnedTracksTop: number;
     } & {
@@ -392,7 +393,8 @@ declare function stateModelFactory(pluginManager: PluginManager): import("mobx-s
         readonly width: number;
         readonly interRegionPaddingWidth: number;
         readonly assemblyNames: string[];
-        readonly stickyViewHeaders: boolean;
+        readonly isTopLevelView: import("@jbrowse/core/util").AbstractViewModel | undefined;
+        readonly stickyViewHeaders: boolean | undefined;
         readonly rubberbandTop: number;
         readonly pinnedTracksTop: number;
     } & {

package/dist/LinearSyntenyDisplay/drawSynteny.js

@@ -31,6 +31,7 @@ function drawRef(model, ctx1, ctx3) {
     const view = (0, util_1.getContainingView)(model);
     const drawCurves = view.drawCurves;
     const drawCIGAR = view.drawCIGAR;
+    const drawCIGARMatchesOnly = view.drawCIGARMatchesOnly;
     const { level, height, featPositions } = model;
     const width = view.width;
     const bpPerPxs = view.views.map(v => v.bpPerPx);
@@ -123,11 +124,19 @@ function drawRef(model, ctx1, ctx3) {
                             continuingFlag = true;
                         }
                         else {
-                            ctx1.fillStyle =
-                                colorMap[(continuingFlag && d1 > 1) || d2 > 1 ? op : 'M'];
+                            const letter = (continuingFlag && d1 > 1) || d2 > 1 ? op : 'M';
+                            ctx1.fillStyle = colorMap[letter];
                             continuingFlag = false;
-                            (0, util_2.draw)(ctx1, px1, cx1, y1, cx2, px2, y2, mid, drawCurves);
-                            ctx1.fill();
+                            if (drawCIGARMatchesOnly) {
+                                if (letter === 'M') {
+                                    (0, util_2.draw)(ctx1, px1, cx1, y1, cx2, px2, y2, mid, drawCurves);
+                                    ctx1.fill();
+                                }
+                            }
+                            else {
+                                (0, util_2.draw)(ctx1, px1, cx1, y1, cx2, px2, y2, mid, drawCurves);
+                                ctx1.fill();
+                            }
                             if (ctx3) {
                                 ctx3.fillStyle = makeColor(idx);
                                 (0, util_2.draw)(ctx3, px1, cx1, y1, cx2, px2, y2, mid, drawCurves);

package/dist/LinearSyntenyView/components/ExportSvgDialog.d.ts

@@ -1,4 +1,4 @@
-import type { ExportSvgOptions } from '../model';
+import type { ExportSvgOptions } from '../types';
 export default function ExportSvgDialog({ model, handleClose, }: {
     model: {
         exportSvg(opts: ExportSvgOptions): Promise<void>;

package/dist/LinearSyntenyView/components/ExportSvgDialog.js

@@ -1,4 +1,7 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = ExportSvgDialog;
 const jsx_runtime_1 = require("react/jsx-runtime");
@@ -6,15 +9,13 @@ const react_1 = require("react");
 const ui_1 = require("@jbrowse/core/ui");
 const util_1 = require("@jbrowse/core/util");
 const material_1 = require("@mui/material");
+const TextField2_1 = __importDefault(require("./TextField2"));
 function LoadingMessage() {
     return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(material_1.CircularProgress, { size: 20, style: { marginRight: 20 } }), (0, jsx_runtime_1.jsx)(material_1.Typography, { display: "inline", children: "Creating SVG" })] }));
 }
 function useSvgLocal(key, val) {
     return (0, util_1.useLocalStorage)(`svg-${key}`, val);
 }
-function TextField2({ children, ...rest }) {
-    return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { ...rest, children: children }) }));
-}
 function ExportSvgDialog({ model, handleClose, }) {
     const session = (0, util_1.getSession)(model);
     const offscreenCanvas = typeof OffscreenCanvas !== 'undefined';
@@ -24,11 +25,11 @@ function ExportSvgDialog({ model, handleClose, }) {
     const [trackLabels, setTrackLabels] = useSvgLocal('tracklabels', 'offset');
     const [themeName, setThemeName] = useSvgLocal('theme', session.themeName || 'default');
     const [error, setError] = (0, react_1.useState)();
-    return ((0, jsx_runtime_1.jsxs)(ui_1.Dialog, { open: true, onClose: handleClose, title: "Export SVG", children: [(0, jsx_runtime_1.jsxs)(material_1.DialogContent, { children: [error ? ((0, jsx_runtime_1.jsx)(ui_1.ErrorMessage, { error: error })) : loading ? ((0, jsx_runtime_1.jsx)(LoadingMessage, {})) : null, (0, jsx_runtime_1.jsx)(TextField2, { helperText: "filename", value: filename, onChange: event => {
+    return ((0, jsx_runtime_1.jsxs)(ui_1.Dialog, { open: true, onClose: handleClose, title: "Export SVG", children: [(0, jsx_runtime_1.jsxs)(material_1.DialogContent, { children: [error ? ((0, jsx_runtime_1.jsx)(ui_1.ErrorMessage, { error: error })) : loading ? ((0, jsx_runtime_1.jsx)(LoadingMessage, {})) : null, (0, jsx_runtime_1.jsx)(TextField2_1.default, { helperText: "filename", value: filename, onChange: event => {
                             setFilename(event.target.value);
-                        } }), (0, jsx_runtime_1.jsxs)(TextField2, { select: true, label: "Track label positioning", variant: "outlined", value: trackLabels, style: { width: 150 }, onChange: event => {
+                        } }), (0, jsx_runtime_1.jsxs)(TextField2_1.default, { select: true, label: "Track label positioning", variant: "outlined", value: trackLabels, style: { width: 150 }, onChange: event => {
                             setTrackLabels(event.target.value);
-                        }, children: [(0, jsx_runtime_1.jsx)(material_1.MenuItem, { value: "offset", children: "Offset" }), (0, jsx_runtime_1.jsx)(material_1.MenuItem, { value: "overlay", children: "Overlay" }), (0, jsx_runtime_1.jsx)(material_1.MenuItem, { value: "left", children: "Left" }), (0, jsx_runtime_1.jsx)(material_1.MenuItem, { value: "none", children: "None" })] }), (0, jsx_runtime_1.jsx)("br", {}), session.allThemes ? ((0, jsx_runtime_1.jsx)(TextField2, { select: true, label: "Theme", variant: "outlined", value: themeName, onChange: event => {
+                        }, children: [(0, jsx_runtime_1.jsx)(material_1.MenuItem, { value: "offset", children: "Offset" }), (0, jsx_runtime_1.jsx)(material_1.MenuItem, { value: "overlay", children: "Overlay" }), (0, jsx_runtime_1.jsx)(material_1.MenuItem, { value: "left", children: "Left" }), (0, jsx_runtime_1.jsx)(material_1.MenuItem, { value: "none", children: "None" })] }), (0, jsx_runtime_1.jsx)("br", {}), session.allThemes ? ((0, jsx_runtime_1.jsx)(TextField2_1.default, { select: true, label: "Theme", variant: "outlined", value: themeName, onChange: event => {
                             setThemeName(event.target.value);
                         }, children: Object.entries(session.allThemes()).map(([key, val]) => ((0, jsx_runtime_1.jsx)(material_1.MenuItem, { value: key, children: val.name || '(Unknown name)' }, key))) })) : null, offscreenCanvas ? ((0, jsx_runtime_1.jsx)(material_1.FormControlLabel, { control: (0, jsx_runtime_1.jsx)(material_1.Checkbox, { checked: rasterizeLayers, onChange: () => {
                                 setRasterizeLayers(val => !val);

package/dist/LinearSyntenyView/components/TextField2.d.ts

@@ -0,0 +1,2 @@
+import type { TextFieldProps } from '@mui/material';
+export default function TextField2({ children, ...rest }: TextFieldProps): import("react/jsx-runtime").JSX.Element;

package/dist/LinearSyntenyView/components/TextField2.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = TextField2;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const material_1 = require("@mui/material");
+function TextField2({ children, ...rest }) {
+    return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(material_1.TextField, { ...rest, children: children }) }));
+}

package/dist/LinearSyntenyView/model.d.ts

@@ -1,24 +1,7 @@
-import type React from 'react';
 import { Curves } from './components/Icons';
-import type { ImportFormSyntenyTrack } from './types';
+import type { ExportSvgOptions, ImportFormSyntenyTrack } from './types';
 import type PluginManager from '@jbrowse/core/PluginManager';
 import type { Instance } from 'mobx-state-tree';
-export interface ExportSvgOptions {
-    rasterizeLayers?: boolean;
-    scale?: number;
-    filename?: string;
-    Wrapper?: React.FC<{
-        children: React.ReactNode;
-    }>;
-    fontSize?: number;
-    rulerHeight?: number;
-    textHeight?: number;
-    paddingHeight?: number;
-    headerHeight?: number;
-    cytobandHeight?: number;
-    themeName?: string;
-    trackLabels?: string;
-}
 export default function stateModelFactory(pluginManager: PluginManager): import("mobx-state-tree").IModelType<{
     id: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<string>, [undefined]>;
     displayName: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<string>>;
@@ -94,7 +77,8 @@ export default function stateModelFactory(pluginManager: PluginManager): import(
         readonly width: number;
         readonly interRegionPaddingWidth: number;
         readonly assemblyNames: string[];
-        readonly stickyViewHeaders: boolean;
+        readonly isTopLevelView: import("@jbrowse/core/util").AbstractViewModel | undefined;
+        readonly stickyViewHeaders: boolean | undefined;
         readonly rubberbandTop: number;
         readonly pinnedTracksTop: number;
     } & {
@@ -298,6 +282,7 @@ export default function stateModelFactory(pluginManager: PluginManager): import(
 } & {
     type: import("mobx-state-tree").ISimpleType<"LinearSyntenyView">;
     drawCIGAR: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
+    drawCIGARMatchesOnly: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
     drawCurves: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
 }, {
     width: number;
@@ -346,6 +331,7 @@ export default function stateModelFactory(pluginManager: PluginManager): import(
     setImportFormSyntenyTrack(arg: number, val: ImportFormSyntenyTrack): void;
     setDrawCurves(arg: boolean): void;
     setDrawCIGAR(arg: boolean): void;
+    setDrawCIGARMatchesOnly(arg: boolean): void;
     showAllRegions(): void;
 } & {
     exportSvg(opts: ExportSvgOptions): Promise<void>;
@@ -476,7 +462,8 @@ export default function stateModelFactory(pluginManager: PluginManager): import(
         readonly width: number;
         readonly interRegionPaddingWidth: number;
         readonly assemblyNames: string[];
-        readonly stickyViewHeaders: boolean;
+        readonly isTopLevelView: import("@jbrowse/core/util").AbstractViewModel | undefined;
+        readonly stickyViewHeaders: boolean | undefined;
         readonly rubberbandTop: number;
         readonly pinnedTracksTop: number;
     } & {

package/dist/LinearSyntenyView/model.js

@@ -54,6 +54,7 @@ function stateModelFactory(pluginManager) {
         .compose('LinearSyntenyView', (0, model_1.default)(pluginManager), mobx_state_tree_1.types.model({
         type: mobx_state_tree_1.types.literal('LinearSyntenyView'),
         drawCIGAR: true,
+        drawCIGARMatchesOnly: false,
         drawCurves: false,
     }))
         .volatile(() => ({
@@ -75,6 +76,9 @@ function stateModelFactory(pluginManager) {
         setDrawCIGAR(arg) {
             self.drawCIGAR = arg;
         },
+        setDrawCIGARMatchesOnly(arg) {
+            self.drawCIGARMatchesOnly = arg;
+        },
         showAllRegions() {
             (0, mobx_1.transaction)(() => {
                 for (const view of self.views) {
@@ -114,11 +118,20 @@ function stateModelFactory(pluginManager) {
                         label: 'Draw CIGAR',
                         checked: self.drawCIGAR,
                         type: 'checkbox',
-                        description: 'Draws per-base CIGAR level alignments',
+                        description: 'If disabled, only draws the broad scale CIGAR match',
                         onClick: () => {
                             self.setDrawCIGAR(!self.drawCIGAR);
                         },
                     },
+                    {
+                        label: 'Draw only CIGAR matches',
+                        checked: self.drawCIGARMatchesOnly,
+                        type: 'checkbox',
+                        description: 'If enabled, it hides the insertions and deletions in the CIGAR strings, helps with divergent',
+                        onClick: () => {
+                            self.setDrawCIGARMatchesOnly(!self.drawCIGARMatchesOnly);
+                        },
+                    },
                     {
                         label: 'Link views',
                         type: 'checkbox',

package/dist/LinearSyntenyView/svgcomponents/SVGLinearSyntenyView.d.ts

@@ -1,2 +1,3 @@
-import type { ExportSvgOptions, LinearSyntenyViewModel } from '../model';
+import type { LinearSyntenyViewModel } from '../model';
+import type { ExportSvgOptions } from '../types';
 export declare function renderToSvg(model: LinearSyntenyViewModel, opts: ExportSvgOptions): Promise<string>;

package/dist/LinearSyntenyView/types.d.ts

@@ -1,3 +1,4 @@
+import type React from 'react';
 import type { AnyConfigurationModel } from '@jbrowse/core/configuration';
 import type { SnapshotIn } from 'mobx-state-tree';
 export type Conf = SnapshotIn<AnyConfigurationModel>;
@@ -10,3 +11,19 @@ export type ImportFormSyntenyTrack = {
 } | {
     type: 'none';
 };
+export interface ExportSvgOptions {
+    rasterizeLayers?: boolean;
+    scale?: number;
+    filename?: string;
+    Wrapper?: React.FC<{
+        children: React.ReactNode;
+    }>;
+    fontSize?: number;
+    rulerHeight?: number;
+    textHeight?: number;
+    paddingHeight?: number;
+    headerHeight?: number;
+    cytobandHeight?: number;
+    themeName?: string;
+    trackLabels?: string;
+}

package/esm/LGVSyntenyDisplay/model.d.ts

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

package/esm/LinearComparativeView/components/HeaderSearchBoxes.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { toLocale } from '@jbrowse/core/util';
+import { getBpDisplayStr } from '@jbrowse/core/util';
 import { SearchBox } from '@jbrowse/plugin-linear-genome-view';
 import { Typography } from '@mui/material';
 import { observer } from 'mobx-react';
@@ -17,6 +17,6 @@ const useStyles = makeStyles()(() => ({
 const HeaderSearchBoxes = observer(function ({ view, }) {
     const { classes } = useStyles();
     const { assemblyNames, coarseTotalBp } = view;
-    return (_jsxs("span", { className: classes.searchBox, children: [_jsx(SearchBox, { model: view, showHelp: false }), _jsxs(Typography, { variant: "body2", color: "textSecondary", className: classes.bp, children: [assemblyNames.join(','), " ", toLocale(Math.round(coarseTotalBp)), " bp"] })] }));
+    return (_jsxs("span", { className: classes.searchBox, children: [_jsx(SearchBox, { model: view, showHelp: false }), _jsxs(Typography, { variant: "body2", color: "textSecondary", className: classes.bp, children: [assemblyNames.join(','), " ", getBpDisplayStr(coarseTotalBp)] })] }));
 });
 export default HeaderSearchBoxes;

package/esm/LinearComparativeView/model.d.ts

@@ -77,7 +77,8 @@ declare function stateModelFactory(pluginManager: PluginManager): import("mobx-s
         readonly width: number;
         readonly interRegionPaddingWidth: number;
         readonly assemblyNames: string[];
-        readonly stickyViewHeaders: boolean;
+        readonly isTopLevelView: import("@jbrowse/core/util").AbstractViewModel | undefined;
+        readonly stickyViewHeaders: boolean | undefined;
         readonly rubberbandTop: number;
         readonly pinnedTracksTop: number;
     } & {
@@ -392,7 +393,8 @@ declare function stateModelFactory(pluginManager: PluginManager): import("mobx-s
         readonly width: number;
         readonly interRegionPaddingWidth: number;
         readonly assemblyNames: string[];
-        readonly stickyViewHeaders: boolean;
+        readonly isTopLevelView: import("@jbrowse/core/util").AbstractViewModel | undefined;
+        readonly stickyViewHeaders: boolean | undefined;
         readonly rubberbandTop: number;
         readonly pinnedTracksTop: number;
     } & {

package/esm/LinearSyntenyDisplay/drawSynteny.js

@@ -25,6 +25,7 @@ export function drawRef(model, ctx1, ctx3) {
     const view = getContainingView(model);
     const drawCurves = view.drawCurves;
     const drawCIGAR = view.drawCIGAR;
+    const drawCIGARMatchesOnly = view.drawCIGARMatchesOnly;
     const { level, height, featPositions } = model;
     const width = view.width;
     const bpPerPxs = view.views.map(v => v.bpPerPx);
@@ -117,11 +118,19 @@ export function drawRef(model, ctx1, ctx3) {
                             continuingFlag = true;
                         }
                         else {
-                            ctx1.fillStyle =
-                                colorMap[(continuingFlag && d1 > 1) || d2 > 1 ? op : 'M'];
+                            const letter = (continuingFlag && d1 > 1) || d2 > 1 ? op : 'M';
+                            ctx1.fillStyle = colorMap[letter];
                             continuingFlag = false;
-                            draw(ctx1, px1, cx1, y1, cx2, px2, y2, mid, drawCurves);
-                            ctx1.fill();
+                            if (drawCIGARMatchesOnly) {
+                                if (letter === 'M') {
+                                    draw(ctx1, px1, cx1, y1, cx2, px2, y2, mid, drawCurves);
+                                    ctx1.fill();
+                                }
+                            }
+                            else {
+                                draw(ctx1, px1, cx1, y1, cx2, px2, y2, mid, drawCurves);
+                                ctx1.fill();
+                            }
                             if (ctx3) {
                                 ctx3.fillStyle = makeColor(idx);
                                 draw(ctx3, px1, cx1, y1, cx2, px2, y2, mid, drawCurves);

package/esm/LinearSyntenyView/components/ExportSvgDialog.d.ts

@@ -1,4 +1,4 @@
-import type { ExportSvgOptions } from '../model';
+import type { ExportSvgOptions } from '../types';
 export default function ExportSvgDialog({ model, handleClose, }: {
     model: {
         exportSvg(opts: ExportSvgOptions): Promise<void>;

package/esm/LinearSyntenyView/components/ExportSvgDialog.js

@@ -2,16 +2,14 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from 'react';
 import { Dialog, ErrorMessage } from '@jbrowse/core/ui';
 import { getSession, useLocalStorage } from '@jbrowse/core/util';
-import { Button, Checkbox, CircularProgress, DialogActions, DialogContent, FormControlLabel, MenuItem, TextField, Typography, } from '@mui/material';
+import { Button, Checkbox, CircularProgress, DialogActions, DialogContent, FormControlLabel, MenuItem, Typography, } from '@mui/material';
+import TextField2 from './TextField2';
 function LoadingMessage() {
     return (_jsxs("div", { children: [_jsx(CircularProgress, { size: 20, style: { marginRight: 20 } }), _jsx(Typography, { display: "inline", children: "Creating SVG" })] }));
 }
 function useSvgLocal(key, val) {
     return useLocalStorage(`svg-${key}`, val);
 }
-function TextField2({ children, ...rest }) {
-    return (_jsx("div", { children: _jsx(TextField, { ...rest, children: children }) }));
-}
 export default function ExportSvgDialog({ model, handleClose, }) {
     const session = getSession(model);
     const offscreenCanvas = typeof OffscreenCanvas !== 'undefined';

package/esm/LinearSyntenyView/components/TextField2.d.ts

@@ -0,0 +1,2 @@
+import type { TextFieldProps } from '@mui/material';
+export default function TextField2({ children, ...rest }: TextFieldProps): import("react/jsx-runtime").JSX.Element;

package/esm/LinearSyntenyView/components/TextField2.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { TextField } from '@mui/material';
+export default function TextField2({ children, ...rest }) {
+    return (_jsx("div", { children: _jsx(TextField, { ...rest, children: children }) }));
+}

package/esm/LinearSyntenyView/model.d.ts

@@ -1,24 +1,7 @@
-import type React from 'react';
 import { Curves } from './components/Icons';
-import type { ImportFormSyntenyTrack } from './types';
+import type { ExportSvgOptions, ImportFormSyntenyTrack } from './types';
 import type PluginManager from '@jbrowse/core/PluginManager';
 import type { Instance } from 'mobx-state-tree';
-export interface ExportSvgOptions {
-    rasterizeLayers?: boolean;
-    scale?: number;
-    filename?: string;
-    Wrapper?: React.FC<{
-        children: React.ReactNode;
-    }>;
-    fontSize?: number;
-    rulerHeight?: number;
-    textHeight?: number;
-    paddingHeight?: number;
-    headerHeight?: number;
-    cytobandHeight?: number;
-    themeName?: string;
-    trackLabels?: string;
-}
 export default function stateModelFactory(pluginManager: PluginManager): import("mobx-state-tree").IModelType<{
     id: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<string>, [undefined]>;
     displayName: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<string>>;
@@ -94,7 +77,8 @@ export default function stateModelFactory(pluginManager: PluginManager): import(
         readonly width: number;
         readonly interRegionPaddingWidth: number;
         readonly assemblyNames: string[];
-        readonly stickyViewHeaders: boolean;
+        readonly isTopLevelView: import("@jbrowse/core/util").AbstractViewModel | undefined;
+        readonly stickyViewHeaders: boolean | undefined;
         readonly rubberbandTop: number;
         readonly pinnedTracksTop: number;
     } & {
@@ -298,6 +282,7 @@ export default function stateModelFactory(pluginManager: PluginManager): import(
 } & {
     type: import("mobx-state-tree").ISimpleType<"LinearSyntenyView">;
     drawCIGAR: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
+    drawCIGARMatchesOnly: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
     drawCurves: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
 }, {
     width: number;
@@ -346,6 +331,7 @@ export default function stateModelFactory(pluginManager: PluginManager): import(
     setImportFormSyntenyTrack(arg: number, val: ImportFormSyntenyTrack): void;
     setDrawCurves(arg: boolean): void;
     setDrawCIGAR(arg: boolean): void;
+    setDrawCIGARMatchesOnly(arg: boolean): void;
     showAllRegions(): void;
 } & {
     exportSvg(opts: ExportSvgOptions): Promise<void>;
@@ -476,7 +462,8 @@ export default function stateModelFactory(pluginManager: PluginManager): import(
         readonly width: number;
         readonly interRegionPaddingWidth: number;
         readonly assemblyNames: string[];
-        readonly stickyViewHeaders: boolean;
+        readonly isTopLevelView: import("@jbrowse/core/util").AbstractViewModel | undefined;
+        readonly stickyViewHeaders: boolean | undefined;
         readonly rubberbandTop: number;
         readonly pinnedTracksTop: number;
     } & {

package/esm/LinearSyntenyView/model.js

@@ -15,6 +15,7 @@ export default function stateModelFactory(pluginManager) {
         .compose('LinearSyntenyView', baseModel(pluginManager), types.model({
         type: types.literal('LinearSyntenyView'),
         drawCIGAR: true,
+        drawCIGARMatchesOnly: false,
         drawCurves: false,
     }))
         .volatile(() => ({
@@ -36,6 +37,9 @@ export default function stateModelFactory(pluginManager) {
         setDrawCIGAR(arg) {
             self.drawCIGAR = arg;
         },
+        setDrawCIGARMatchesOnly(arg) {
+            self.drawCIGARMatchesOnly = arg;
+        },
         showAllRegions() {
             transaction(() => {
                 for (const view of self.views) {
@@ -75,11 +79,20 @@ export default function stateModelFactory(pluginManager) {
                         label: 'Draw CIGAR',
                         checked: self.drawCIGAR,
                         type: 'checkbox',
-                        description: 'Draws per-base CIGAR level alignments',
+                        description: 'If disabled, only draws the broad scale CIGAR match',
                         onClick: () => {
                             self.setDrawCIGAR(!self.drawCIGAR);
                         },
                     },
+                    {
+                        label: 'Draw only CIGAR matches',
+                        checked: self.drawCIGARMatchesOnly,
+                        type: 'checkbox',
+                        description: 'If enabled, it hides the insertions and deletions in the CIGAR strings, helps with divergent',
+                        onClick: () => {
+                            self.setDrawCIGARMatchesOnly(!self.drawCIGARMatchesOnly);
+                        },
+                    },
                     {
                         label: 'Link views',
                         type: 'checkbox',

package/esm/LinearSyntenyView/svgcomponents/SVGLinearSyntenyView.d.ts

@@ -1,2 +1,3 @@
-import type { ExportSvgOptions, LinearSyntenyViewModel } from '../model';
+import type { LinearSyntenyViewModel } from '../model';
+import type { ExportSvgOptions } from '../types';
 export declare function renderToSvg(model: LinearSyntenyViewModel, opts: ExportSvgOptions): Promise<string>;

package/esm/LinearSyntenyView/types.d.ts

@@ -1,3 +1,4 @@
+import type React from 'react';
 import type { AnyConfigurationModel } from '@jbrowse/core/configuration';
 import type { SnapshotIn } from 'mobx-state-tree';
 export type Conf = SnapshotIn<AnyConfigurationModel>;
@@ -10,3 +11,19 @@ export type ImportFormSyntenyTrack = {
 } | {
     type: 'none';
 };
+export interface ExportSvgOptions {
+    rasterizeLayers?: boolean;
+    scale?: number;
+    filename?: string;
+    Wrapper?: React.FC<{
+        children: React.ReactNode;
+    }>;
+    fontSize?: number;
+    rulerHeight?: number;
+    textHeight?: number;
+    paddingHeight?: number;
+    headerHeight?: number;
+    cytobandHeight?: number;
+    themeName?: string;
+    trackLabels?: string;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jbrowse/plugin-linear-comparative-view",
-  "version": "3.4.0",
+  "version": "3.5.0",
   "description": "JBrowse 2 linear comparative view",
   "keywords": [
     "jbrowse",
@@ -36,9 +36,9 @@
     "clean": "rimraf dist esm *.tsbuildinfo"
   },
   "dependencies": {
-    "@jbrowse/core": "^3.4.0",
-    "@jbrowse/plugin-alignments": "^3.4.0",
-    "@jbrowse/plugin-linear-genome-view": "^3.4.0",
+    "@jbrowse/core": "^3.5.0",
+    "@jbrowse/plugin-alignments": "^3.5.0",
+    "@jbrowse/plugin-linear-genome-view": "^3.5.0",
     "@mui/icons-material": "^7.0.0",
     "@mui/material": "^7.0.0",
     "copy-to-clipboard": "^3.3.1",
@@ -59,5 +59,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "a9f1ac35fc2dd810bae92cdaf1fc19995bee4413"
+  "gitHead": "8a8aa0aab2229dece106a5715a767e649e2fe92b"
 }