@jbrowse/plugin-alignments 3.7.0 → 4.0.0

package/esm/shared/getMaximumModificationAtEachPosition.js

@@ -1,12 +1,11 @@
-import { getNextRefPos, parseCigar } from '../MismatchParser';
-import { getModPositions } from '../ModificationParser/getModPositions';
-import { getModProbabilities } from '../ModificationParser/getModProbabilities';
-import { getTagAlt } from '../util';
-export function getMaxProbModAtEachPosition(feature, cigarOps) {
+import { getNextRefPos } from "../MismatchParser/index.js";
+import { getModPositions } from "../ModificationParser/getModPositions.js";
+import { getModProbabilities } from "../ModificationParser/getModProbabilities.js";
+import { getTagAlt } from "../util.js";
+export function getMaxProbModAtEachPosition(feature, ops) {
     const fstrand = feature.get('strand');
     const seq = feature.get('seq');
     const mm = getTagAlt(feature, 'MM', 'Mm') || '';
-    const ops = cigarOps || parseCigar(feature.get('CIGAR'));
     if (seq) {
         const modifications = getModPositions(mm, seq, fstrand);
         const probabilities = getModProbabilities(feature);
@@ -14,7 +13,7 @@ export function getMaxProbModAtEachPosition(feature, cigarOps) {
         let probIndex = 0;
         for (const { type, positions } of modifications) {
             for (const { ref, idx } of getNextRefPos(ops, positions)) {
-                const prob = (probabilities === null || probabilities === void 0 ? void 0 : probabilities[probIndex + (fstrand === -1 ? positions.length - 1 - idx : idx)]) || 0;
+                const prob = probabilities?.[probIndex + (fstrand === -1 ? positions.length - 1 - idx : idx)] || 0;
                 if (!maxProbModForPosition[ref]) {
                     maxProbModForPosition[ref] = {
                         type,

package/esm/shared/getUniqueModifications.d.ts

@@ -1,5 +1,4 @@
-import { type IAnyStateTreeNode } from 'mobx-state-tree';
-import type { ModificationType } from './types';
+import type { ModificationType } from './types.ts';
 import type { AnyConfigurationModel } from '@jbrowse/core/configuration';
 import type { BlockSet } from '@jbrowse/core/util/blockTypes';
 export interface ModificationOpts {
@@ -8,7 +7,10 @@ export interface ModificationOpts {
     filters: string[];
 }
 export declare function getUniqueModifications({ model, adapterConfig, blocks, opts, }: {
-    model: IAnyStateTreeNode;
+    model: {
+        setStatusMessage: (arg: string) => void;
+        effectiveRpcDriverName?: string;
+    };
     adapterConfig: AnyConfigurationModel;
     blocks: BlockSet;
     opts?: ModificationOpts;

package/esm/shared/getUniqueModifications.js

@@ -1,6 +1,6 @@
 import { getSession } from '@jbrowse/core/util';
 import { getRpcSessionId } from '@jbrowse/core/util/tracks';
-import { isAlive } from 'mobx-state-tree';
+import { isAlive } from '@jbrowse/mobx-state-tree';
 export async function getUniqueModifications({ model, adapterConfig, blocks, opts, }) {
     const { rpcManager } = getSession(model);
     const sessionId = getRpcSessionId(model);
@@ -8,9 +8,10 @@ export async function getUniqueModifications({ model, adapterConfig, blocks, opt
         adapterConfig,
         sessionId,
         regions: blocks.contentBlocks,
+        rpcDriverName: model.effectiveRpcDriverName,
         statusCallback: (arg) => {
             if (isAlive(model)) {
-                model.setMessage(arg);
+                model.setStatusMessage(arg);
             }
         },
         ...opts,

package/esm/shared/getUniqueTags.d.ts

@@ -1,9 +1,9 @@
 import type { AnyConfigurationModel } from '@jbrowse/core/configuration';
 import type { BlockSet } from '@jbrowse/core/util/blockTypes';
-import type { IAnyStateTreeNode } from 'mobx-state-tree';
 export declare function getUniqueTags({ self, tag, blocks, opts, }: {
-    self: IAnyStateTreeNode & {
+    self: {
         adapterConfig: AnyConfigurationModel;
+        effectiveRpcDriverName?: string;
     };
     tag: string;
     blocks: BlockSet;

package/esm/shared/getUniqueTags.js

@@ -2,12 +2,13 @@ import { getSession } from '@jbrowse/core/util';
 import { getRpcSessionId } from '@jbrowse/core/util/tracks';
 export async function getUniqueTags({ self, tag, blocks, opts, }) {
     const { rpcManager } = getSession(self);
-    const { adapterConfig } = self;
+    const { adapterConfig, effectiveRpcDriverName } = self;
     const sessionId = getRpcSessionId(self);
     const values = await rpcManager.call(getRpcSessionId(self), 'PileupGetGlobalValueForTag', {
         adapterConfig,
         tag,
         sessionId,
+        rpcDriverName: effectiveRpcDriverName,
         regions: blocks.contentBlocks,
         ...opts,
     });

package/{dist/PileupRPC/util.d.ts → esm/shared/insertSizeStats.d.ts}

@@ -1,5 +1,5 @@
-import type { ReducedFeature } from '../shared/fetchChains';
-export declare function getInsertSizeStats(features: ReducedFeature[]): {
+import type { ReducedFeature } from './types.ts';
+export declare function getInsertSizeStats(filtered: number[]): {
     upper: number;
     lower: number;
     avg: number;

package/esm/shared/insertSizeStats.js

@@ -0,0 +1,23 @@
+import { sum } from '@jbrowse/core/util';
+export function getInsertSizeStats(filtered) {
+    const len = filtered.length;
+    const s = sum(filtered);
+    let sumSquared = 0;
+    for (let i = 0; i < len; i++) {
+        const elt = filtered[i];
+        sumSquared += elt * elt;
+    }
+    const avg = s / len;
+    const sd = Math.sqrt((len * sumSquared - s * s) / (len * len));
+    const upper = avg + 3 * sd;
+    const lower = avg - 3 * sd;
+    return {
+        upper,
+        lower,
+        avg,
+        sd,
+    };
+}
+export function filterForPairs(features) {
+    return features.filter(f => f.flags & 2 && !(f.flags & 256) && !(f.flags & 2048));
+}

package/esm/shared/legendUtils.d.ts

@@ -0,0 +1,8 @@
+import type { ColorBy, ModificationTypeWithColor } from './types.ts';
+import type { LegendItem } from '@jbrowse/plugin-linear-genome-view';
+import type { Theme } from '@mui/material';
+export { calculateSvgLegendWidth } from '@jbrowse/plugin-linear-genome-view';
+export type { LegendItem } from '@jbrowse/plugin-linear-genome-view';
+export declare function getPileupLegendItems(colorBy: ColorBy | undefined, theme: Theme): LegendItem[];
+export declare function getSNPCoverageLegendItems(colorBy: ColorBy | undefined, visibleModifications: Map<string, ModificationTypeWithColor>, theme: Theme): LegendItem[];
+export declare function getReadDisplayLegendItems(colorBy: ColorBy | undefined, visibleModifications?: Map<string, ModificationTypeWithColor>): LegendItem[];

package/esm/shared/legendUtils.js

@@ -0,0 +1,123 @@
+import { fillColor } from "./color.js";
+export { calculateSvgLegendWidth } from '@jbrowse/plugin-linear-genome-view';
+const supplementaryItem = {
+    color: fillColor.color_supplementary,
+    label: 'Supplementary/split',
+};
+const unmappedMateItem = {
+    color: fillColor.color_unmapped_mate,
+    label: 'Unmapped mate',
+};
+const orientationItems = [
+    { color: fillColor.color_pair_lr, label: 'Normal pair orientation' },
+    { color: fillColor.color_pair_rr, label: 'Both mates reverse strand' },
+    { color: fillColor.color_pair_rl, label: 'Both mates point outward' },
+    { color: fillColor.color_pair_ll, label: 'Both mates forward strand' },
+];
+const insertSizeItems = [
+    { color: fillColor.color_longinsert, label: 'Long insert' },
+    { color: fillColor.color_shortinsert, label: 'Short insert' },
+    { color: fillColor.color_interchrom, label: 'Inter-chromosomal' },
+];
+const normalInsertItem = {
+    color: fillColor.color_pair_lr,
+    label: 'Normal',
+};
+const orientationLegendItems = [
+    ...orientationItems,
+    unmappedMateItem,
+    supplementaryItem,
+];
+const insertSizeLegendItems = [
+    normalInsertItem,
+    ...insertSizeItems,
+    unmappedMateItem,
+    supplementaryItem,
+];
+const insertSizeAndOrientationLegendItems = [
+    ...orientationItems,
+    ...insertSizeItems,
+    unmappedMateItem,
+    supplementaryItem,
+];
+function getBaseItems(theme) {
+    const { bases, insertion, deletion, hardclip, softclip } = theme.palette;
+    return [
+        { color: bases.A.main, label: 'A' },
+        { color: bases.C.main, label: 'C' },
+        { color: bases.G.main, label: 'G' },
+        { color: bases.T.main, label: 'T' },
+        { color: insertion, label: 'Insertion' },
+        { color: deletion, label: 'Deletion' },
+        { color: hardclip, label: 'Hard clip' },
+        { color: softclip, label: 'Soft clip' },
+    ];
+}
+export function getPileupLegendItems(colorBy, theme) {
+    const colorType = colorBy?.type;
+    if (colorType === 'strand') {
+        return [
+            { color: fillColor.color_fwd_strand, label: 'Forward strand' },
+            { color: fillColor.color_rev_strand, label: 'Reverse strand' },
+            supplementaryItem,
+        ];
+    }
+    else if (colorType === 'stranded') {
+        return [
+            { color: fillColor.color_fwd_strand, label: 'First-of-pair forward' },
+            { color: fillColor.color_rev_strand, label: 'First-of-pair reverse' },
+            supplementaryItem,
+        ];
+    }
+    else if (colorType === 'insertSize') {
+        return insertSizeLegendItems;
+    }
+    else if (colorType === 'pairOrientation') {
+        return orientationLegendItems;
+    }
+    else if (colorType === 'insertSizeAndPairOrientation') {
+        return insertSizeAndOrientationLegendItems;
+    }
+    else {
+        return getBaseItems(theme);
+    }
+}
+export function getSNPCoverageLegendItems(colorBy, visibleModifications, theme) {
+    if (colorBy?.type === 'methylation') {
+        return [
+            { color: 'red', label: 'CpG methylated' },
+            { color: 'blue', label: 'CpG unmethylated' },
+        ];
+    }
+    else if (colorBy?.type === 'modifications') {
+        const items = [];
+        for (const [type, mod] of visibleModifications.entries()) {
+            items.push({ color: mod.color, label: type });
+        }
+        return items;
+    }
+    else {
+        return getBaseItems(theme);
+    }
+}
+export function getReadDisplayLegendItems(colorBy, visibleModifications) {
+    const colorType = colorBy?.type;
+    if (colorType === 'modifications' && visibleModifications) {
+        const items = [];
+        for (const [type, mod] of visibleModifications.entries()) {
+            items.push({ color: mod.color, label: type });
+        }
+        items.push(supplementaryItem);
+        return items;
+    }
+    if (colorType === 'insertSizeAndOrientation') {
+        return insertSizeAndOrientationLegendItems;
+    }
+    if (colorType === 'insertSize') {
+        return insertSizeLegendItems;
+    }
+    if (colorType === 'orientation') {
+        return orientationLegendItems;
+    }
+    return [supplementaryItem];
+}

package/esm/shared/menuItems.d.ts

@@ -1,17 +1,66 @@
+import type { ColorBy } from './types.ts';
 interface LinearReadDisplayModel {
-    setColorScheme: (colorBy: {
-        type: string;
-    }) => void;
+    setColorScheme: (colorBy: ColorBy) => void;
 }
+export interface ModificationsModel extends LinearReadDisplayModel {
+    modificationsReady: boolean;
+    visibleModificationTypes: string[];
+    modificationThreshold: number;
+    colorBy?: ColorBy;
+}
+export declare function hasModificationsSupport(model: LinearReadDisplayModel): model is ModificationsModel;
+export interface ModificationsMenuOptions {
+    includeMethylation?: boolean;
+}
+export declare function getModificationsSubMenu(model: ModificationsModel, options?: ModificationsMenuOptions): ({
+    label: string;
+    onClick: () => void;
+    type?: undefined;
+} | {
+    type: "divider";
+    label?: undefined;
+    onClick?: undefined;
+})[] | {
+    label: string;
+}[];
+export declare function getModificationsMenuItem(model: ModificationsModel, options?: ModificationsMenuOptions): {
+    label: string;
+    type: "subMenu";
+    subMenu: ({
+        label: string;
+        onClick: () => void;
+        type?: undefined;
+    } | {
+        type: "divider";
+        label?: undefined;
+        onClick?: undefined;
+    })[] | {
+        label: string;
+    }[];
+};
 export declare function getColorSchemeMenuItem(model: LinearReadDisplayModel): {
     label: string;
     icon: import("@mui/material/OverridableComponent").OverridableComponent<import("@mui/material").SvgIconTypeMap<{}, "svg">> & {
         muiName: string;
     };
-    subMenu: {
+    subMenu: ({
+        label: string;
+        type: "subMenu";
+        subMenu: ({
+            label: string;
+            onClick: () => void;
+            type?: undefined;
+        } | {
+            type: "divider";
+            label?: undefined;
+            onClick?: undefined;
+        })[] | {
+            label: string;
+        }[];
+    } | {
         label: string;
         onClick: () => void;
-    }[];
+    })[];
 };
 export declare function getFilterByMenuItem(model: unknown): {
     label: string;
@@ -20,4 +69,51 @@ export declare function getFilterByMenuItem(model: unknown): {
     };
     onClick: () => void;
 };
+interface EditFiltersModel {
+    drawSingletons: boolean;
+    drawProperPairs: boolean;
+    setDrawSingletons: (arg: boolean) => void;
+    setDrawProperPairs: (arg: boolean) => void;
+}
+export declare function getEditFiltersMenuItem(model: EditFiltersModel): {
+    label: string;
+    icon: import("@mui/material/OverridableComponent").OverridableComponent<import("@mui/material").SvgIconTypeMap<{}, "svg">> & {
+        muiName: string;
+    };
+    type: "subMenu";
+    subMenu: ({
+        label: string;
+        type: "checkbox";
+        checked: boolean;
+        onClick: () => void;
+    } | {
+        type: "divider";
+        label?: undefined;
+        checked?: undefined;
+        onClick?: undefined;
+    } | {
+        label: string;
+        onClick: () => void;
+        type?: undefined;
+        checked?: undefined;
+    })[];
+};
+interface MismatchDisplayModel {
+    hideMismatches?: boolean;
+    hideSmallIndels?: boolean;
+    hideLargeIndels?: boolean;
+    setHideMismatches: (arg: boolean) => void;
+    setHideSmallIndels: (arg: boolean) => void;
+    setHideLargeIndels: (arg: boolean) => void;
+}
+export declare function getMismatchDisplayMenuItem(model: MismatchDisplayModel): {
+    label: string;
+    type: "subMenu";
+    subMenu: {
+        label: string;
+        type: "radio";
+        checked: boolean | undefined;
+        onClick: () => void;
+    }[];
+};
 export {};

package/esm/shared/menuItems.js

@@ -2,48 +2,251 @@ import { lazy } from 'react';
 import { getSession } from '@jbrowse/core/util';
 import FilterListIcon from '@mui/icons-material/ClearAll';
 import PaletteIcon from '@mui/icons-material/Palette';
-const FilterByTagDialog = lazy(() => import('./components/FilterByTagDialog'));
+import { modificationData } from "./modificationData.js";
+const FilterByTagDialog = lazy(() => import("./components/FilterByTagDialog.js"));
+const SetModificationThresholdDialog = lazy(() => import("./components/SetModificationThresholdDialog.js"));
+export function hasModificationsSupport(model) {
+    return 'modificationsReady' in model && 'visibleModificationTypes' in model;
+}
+export function getModificationsSubMenu(model, options = {}) {
+    const { includeMethylation = false } = options;
+    const { modificationThreshold, modificationsReady, visibleModificationTypes, } = model;
+    if (!modificationsReady) {
+        return [
+            {
+                label: 'Loading modifications...',
+                onClick: () => { },
+            },
+        ];
+    }
+    else {
+        return visibleModificationTypes.length
+            ? [
+                {
+                    label: `All modifications (>= ${modificationThreshold}% prob)`,
+                    onClick: () => {
+                        model.setColorScheme({
+                            type: 'modifications',
+                            modifications: {
+                                threshold: modificationThreshold,
+                            },
+                        });
+                    },
+                },
+                ...model.visibleModificationTypes.map(key => ({
+                    label: `Show only ${modificationData[key]?.name || key} (>= ${modificationThreshold}% prob)`,
+                    onClick: () => {
+                        model.setColorScheme({
+                            type: 'modifications',
+                            modifications: {
+                                isolatedModification: key,
+                                threshold: modificationThreshold,
+                            },
+                        });
+                    },
+                })),
+                { type: 'divider' },
+                {
+                    label: 'All modifications (<50% prob colored blue)',
+                    onClick: () => {
+                        model.setColorScheme({
+                            type: 'modifications',
+                            modifications: {
+                                twoColor: true,
+                                threshold: modificationThreshold,
+                            },
+                        });
+                    },
+                },
+                ...model.visibleModificationTypes.map(key => ({
+                    label: `Show only ${modificationData[key]?.name || key} (<50% prob colored blue)`,
+                    onClick: () => {
+                        model.setColorScheme({
+                            type: 'modifications',
+                            modifications: {
+                                isolatedModification: key,
+                                twoColor: true,
+                                threshold: modificationThreshold,
+                            },
+                        });
+                    },
+                })),
+                ...(includeMethylation
+                    ? [
+                        { type: 'divider' },
+                        {
+                            label: 'All reference CpGs',
+                            onClick: () => {
+                                model.setColorScheme({
+                                    type: 'methylation',
+                                    modifications: {
+                                        threshold: modificationThreshold,
+                                    },
+                                });
+                            },
+                        },
+                    ]
+                    : []),
+                { type: 'divider' },
+                {
+                    label: `Adjust threshold (${modificationThreshold}%)`,
+                    onClick: () => {
+                        getSession(model).queueDialog(handleClose => [
+                            SetModificationThresholdDialog,
+                            {
+                                model,
+                                handleClose,
+                            },
+                        ]);
+                    },
+                },
+            ]
+            : [{ label: 'No modifications currently visible' }];
+    }
+}
+export function getModificationsMenuItem(model, options = {}) {
+    return {
+        label: 'Modifications',
+        type: 'subMenu',
+        subMenu: getModificationsSubMenu(model, options),
+    };
+}
 export function getColorSchemeMenuItem(model) {
+    const baseItems = [
+        {
+            label: 'Insert size ± 3σ and orientation',
+            onClick: () => {
+                model.setColorScheme({ type: 'insertSizeAndOrientation' });
+            },
+        },
+        {
+            label: 'Insert size ± 3σ',
+            onClick: () => {
+                model.setColorScheme({ type: 'insertSize' });
+            },
+        },
+        {
+            label: 'Orientation',
+            onClick: () => {
+                model.setColorScheme({ type: 'orientation' });
+            },
+        },
+        {
+            label: 'Insert size gradient',
+            onClick: () => {
+                model.setColorScheme({ type: 'gradient' });
+            },
+        },
+    ];
+    const modificationsItem = hasModificationsSupport(model) && model.visibleModificationTypes.length > 0
+        ? [getModificationsMenuItem(model)]
+        : [];
     return {
         label: 'Color scheme',
         icon: PaletteIcon,
+        subMenu: [...baseItems, ...modificationsItem],
+    };
+}
+export function getFilterByMenuItem(model) {
+    return {
+        label: 'Filter by',
+        icon: FilterListIcon,
+        onClick: () => {
+            getSession(model).queueDialog((handleClose) => [
+                FilterByTagDialog,
+                { model, handleClose },
+            ]);
+        },
+    };
+}
+export function getEditFiltersMenuItem(model) {
+    return {
+        label: 'Edit filters',
+        icon: FilterListIcon,
+        type: 'subMenu',
         subMenu: [
             {
-                label: 'Insert size ± 3σ and orientation',
+                label: 'Show singletons',
+                type: 'checkbox',
+                checked: model.drawSingletons,
+                onClick: () => {
+                    model.setDrawSingletons(!model.drawSingletons);
+                },
+            },
+            {
+                label: 'Show proper pairs',
+                type: 'checkbox',
+                checked: model.drawProperPairs,
+                onClick: () => {
+                    model.setDrawProperPairs(!model.drawProperPairs);
+                },
+            },
+            { type: 'divider' },
+            {
+                label: 'Edit filters...',
                 onClick: () => {
-                    model.setColorScheme({ type: 'insertSizeAndOrientation' });
+                    getSession(model).queueDialog((handleClose) => [
+                        FilterByTagDialog,
+                        { model, handleClose },
+                    ]);
                 },
             },
+        ],
+    };
+}
+export function getMismatchDisplayMenuItem(model) {
+    return {
+        label: 'Mismatch/indel display',
+        type: 'subMenu',
+        subMenu: [
             {
-                label: 'Insert size ± 3σ',
+                label: 'Show all mismatches',
+                type: 'radio',
+                checked: !model.hideMismatches &&
+                    !model.hideSmallIndels &&
+                    !model.hideLargeIndels,
                 onClick: () => {
-                    model.setColorScheme({ type: 'insertSize' });
+                    model.setHideMismatches(false);
+                    model.setHideSmallIndels(false);
+                    model.setHideLargeIndels(false);
                 },
             },
             {
-                label: 'Orientation',
+                label: 'Show mismatches and large indels+clipping',
+                type: 'radio',
+                checked: !model.hideMismatches &&
+                    model.hideSmallIndels &&
+                    !model.hideLargeIndels,
                 onClick: () => {
-                    model.setColorScheme({ type: 'orientation' });
+                    model.setHideMismatches(false);
+                    model.setHideSmallIndels(true);
+                    model.setHideLargeIndels(false);
                 },
             },
             {
-                label: 'Insert size gradient',
+                label: 'Show just large indels',
+                type: 'radio',
+                checked: model.hideMismatches &&
+                    model.hideSmallIndels &&
+                    !model.hideLargeIndels,
                 onClick: () => {
-                    model.setColorScheme({ type: 'gradient' });
+                    model.setHideMismatches(true);
+                    model.setHideSmallIndels(true);
+                    model.setHideLargeIndels(false);
+                },
+            },
+            {
+                label: 'Show none',
+                type: 'radio',
+                checked: model.hideMismatches &&
+                    model.hideSmallIndels &&
+                    model.hideLargeIndels,
+                onClick: () => {
+                    model.setHideMismatches(true);
+                    model.setHideSmallIndels(true);
+                    model.setHideLargeIndels(true);
                 },
             },
         ],
     };
 }
-export function getFilterByMenuItem(model) {
-    return {
-        label: 'Filter by',
-        icon: FilterListIcon,
-        onClick: () => {
-            getSession(model).queueDialog((handleClose) => [
-                FilterByTagDialog,
-                { model, handleClose },
-            ]);
-        },
-    };
-}

package/esm/shared/modificationData.js

@@ -13,6 +13,5 @@ export const modificationData = {
     21839: { color: 'rgb(153,0,153)', name: '4mC' },
 };
 export function getModificationName(type) {
-    var _a;
-    return ((_a = modificationData[type]) === null || _a === void 0 ? void 0 : _a.name) || type;
+    return modificationData[type]?.name || type;
 }

package/esm/shared/primaryStrand.d.ts

@@ -1,3 +1,3 @@
-import type { ReducedFeature } from './fetchChains';
-export declare function getPrimaryStrand(feat: ReducedFeature): number;
-export declare function getPrimaryStrandFromFlags(feat: ReducedFeature): 1 | -1;
+import type { Feature } from '@jbrowse/core/util';
+export declare function getPrimaryStrand(feat: Feature): any;
+export declare function getPrimaryStrandFromFlags(feat: Feature): 1 | -1;