@jbrowse/plugin-linear-genome-view 3.1.0 → 3.3.0

package/esm/LinearGenomeView/components/VerticalGuide.js

@@ -1,11 +1,8 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { VIEW_HEADER_HEIGHT } from '@jbrowse/core/ui';
-import { getSession, stringify } from '@jbrowse/core/util';
-import { isSessionWithMultipleViews } from '@jbrowse/product-core';
+import { stringify } from '@jbrowse/core/util';
 import { Tooltip } from '@mui/material';
 import { observer } from 'mobx-react';
 import { makeStyles } from 'tss-react/mui';
-import { HEADER_BAR_HEIGHT, HEADER_OVERVIEW_HEIGHT } from '../consts';
 const useStyles = makeStyles()({
     guide: {
         pointerEvents: 'none',
@@ -13,7 +10,7 @@ const useStyles = makeStyles()({
         width: 1,
         position: 'absolute',
         background: 'red',
-        zIndex: 4,
+        zIndex: 1001,
     },
     tooltipTarget: {
         position: 'sticky',
@@ -22,25 +19,10 @@ const useStyles = makeStyles()({
 });
 const VerticalGuide = observer(function VerticalGuide({ model, coordX, }) {
     const { classes } = useStyles();
-    const session = getSession(model);
-    let stickyViewHeaders = false;
-    if (isSessionWithMultipleViews(session)) {
-        ;
-        ({ stickyViewHeaders } = session);
-    }
-    let tooltipTop = 0;
-    if (stickyViewHeaders) {
-        tooltipTop = VIEW_HEADER_HEIGHT;
-        if (!model.hideHeader) {
-            tooltipTop += HEADER_BAR_HEIGHT;
-            if (!model.hideHeaderOverview) {
-                tooltipTop += HEADER_OVERVIEW_HEIGHT;
-            }
-        }
-    }
+    const { stickyViewHeaders, rubberbandTop } = model;
     return (_jsxs(_Fragment, { children: [_jsx(Tooltip, { open: true, placement: "top", title: stringify(model.pxToBp(coordX)), arrow: true, children: _jsx("div", { className: classes.tooltipTarget, style: {
                         left: coordX + 6,
-                        top: tooltipTop,
+                        top: rubberbandTop,
                         position: stickyViewHeaders ? 'sticky' : undefined,
                     } }) }), _jsx("div", { className: classes.guide, style: { left: coordX } })] }));
 });

package/esm/LinearGenomeView/model.d.ts

@@ -1,5 +1,5 @@
 import type React from 'react';
-import type { BpOffset, ExportSvgOptions, HighlightType, NavLocation } from './types';
+import type { BpOffset, ExportSvgOptions, HighlightType, InitState, NavLocation } from './types';
 import type PluginManager from '@jbrowse/core/PluginManager';
 import type BaseResult from '@jbrowse/core/TextSearch/BaseResults';
 import type { Assembly } from '@jbrowse/core/assemblyManager/assembly';
@@ -30,6 +30,7 @@ export declare function stateModelFactory(pluginManager: PluginManager): import(
     highlight: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").IArrayType<import("mobx-state-tree").IType<HighlightType, HighlightType, HighlightType>>, [undefined]>;
     colorByCDS: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<boolean>, [undefined]>;
     showTrackOutlines: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<boolean>, [undefined]>;
+    init: import("mobx-state-tree").IType<InitState | undefined, InitState | undefined, InitState | undefined>;
 }, {
     width: number;
 } & {
@@ -58,6 +59,7 @@ export declare function stateModelFactory(pluginManager: PluginManager): import(
     readonly interRegionPaddingWidth: number;
     readonly assemblyNames: string[];
     readonly stickyViewHeaders: boolean;
+    readonly rubberbandTop: number;
     readonly pinnedTracksTop: number;
 } & {
     scaleBarDisplayPrefix(): string | undefined;
@@ -144,6 +146,7 @@ export declare function stateModelFactory(pluginManager: PluginManager): import(
     setDraggingTrackId(idx?: string): void;
     setScaleFactor(factor: number): void;
     clearView(): void;
+    setInit(arg?: InitState): void;
     exportSvg(opts?: ExportSvgOptions): Promise<void>;
 } & {
     slide: (viewWidths: number) => void;
@@ -164,7 +167,6 @@ export declare function stateModelFactory(pluginManager: PluginManager): import(
     readonly coarseVisibleLocStrings: string;
 } & {
     setCoarseDynamicBlocks(blocks: BlockSet): void;
-    afterAttach(): void;
 } & {
     moveTo(start?: BpOffset, end?: BpOffset): void;
     navToLocString(input: string, optAssemblyName?: string): Promise<void>;
@@ -172,6 +174,7 @@ export declare function stateModelFactory(pluginManager: PluginManager): import(
         input: string;
         assembly: Assembly;
     }): Promise<void>;
+    navToLocation(parsedLocString: ParsedLocString, assemblyName?: string): Promise<void>;
     navToLocations(parsedLocStrings: ParsedLocString[], assemblyName?: string): Promise<void>;
     navTo(query: NavLocation): void;
     navToMultiple(locations: NavLocation[]): void;
@@ -210,6 +213,7 @@ export declare function stateModelFactory(pluginManager: PluginManager): import(
     } | undefined;
 } & {
     afterCreate(): void;
+    afterAttach(): void;
 }, import("mobx-state-tree").ModelCreationType<import("mobx-state-tree/dist/internal").ExtractCFromProps<{
     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>>;
@@ -232,7 +236,28 @@ export declare function stateModelFactory(pluginManager: PluginManager): import(
     highlight: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").IArrayType<import("mobx-state-tree").IType<HighlightType, HighlightType, HighlightType>>, [undefined]>;
     colorByCDS: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<boolean>, [undefined]>;
     showTrackOutlines: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<boolean>, [undefined]>;
-}>>, import("mobx-state-tree")._NotCustomized>;
+    init: import("mobx-state-tree").IType<InitState | undefined, InitState | undefined, InitState | undefined>;
+}>>, {
+    type: string;
+    id: string;
+    displayName: string | undefined;
+    tracks: any[];
+    minimized: boolean;
+    displayedRegions: Region[];
+    offsetPx: number;
+    bpPerPx: number;
+    hideHeader: boolean;
+    hideHeaderOverview: boolean;
+    hideNoTracksActive: boolean;
+    trackSelectorType: string;
+    showCenterLine: boolean;
+    showCytobandsSetting: boolean;
+    trackLabels: string;
+    showGridlines: boolean;
+    highlight: HighlightType[];
+    colorByCDS: boolean;
+    showTrackOutlines: boolean;
+}>;
 export type LinearGenomeViewStateModel = ReturnType<typeof stateModelFactory>;
 export type LinearGenomeViewModel = Instance<LinearGenomeViewStateModel>;
 export { default as LinearGenomeView, default as ReactComponent, } from './components/LinearGenomeView';

package/esm/LinearGenomeView/model.js

@@ -53,6 +53,7 @@ export function stateModelFactory(pluginManager) {
         highlight: types.optional(types.array(types.frozen()), []),
         colorByCDS: types.optional(types.boolean, () => localStorageGetBoolean('lgv-colorByCDS', false)),
         showTrackOutlines: types.optional(types.boolean, () => localStorageGetBoolean('lgv-showTrackOutlines', true)),
+        init: types.frozen(),
     }))
         .volatile(() => ({
         volatileWidth: undefined,
@@ -101,10 +102,10 @@ export function stateModelFactory(pluginManager) {
                 ? session.stickyViewHeaders
                 : false;
         },
-        get pinnedTracksTop() {
+        get rubberbandTop() {
             let pinnedTracksTop = 0;
             if (this.stickyViewHeaders) {
-                pinnedTracksTop = VIEW_HEADER_HEIGHT + SCALE_BAR_HEIGHT;
+                pinnedTracksTop = VIEW_HEADER_HEIGHT;
                 if (!self.hideHeader) {
                     pinnedTracksTop += HEADER_BAR_HEIGHT;
                     if (!self.hideHeaderOverview) {
@@ -114,6 +115,9 @@ export function stateModelFactory(pluginManager) {
             }
             return pinnedTracksTop;
         },
+        get pinnedTracksTop() {
+            return this.rubberbandTop + SCALE_BAR_HEIGHT;
+        },
     }))
         .views(self => ({
         scaleBarDisplayPrefix() {
@@ -227,32 +231,32 @@ export function stateModelFactory(pluginManager) {
             return results;
         },
         rewriteOnClicks(trackType, viewMenuActions) {
-            viewMenuActions.forEach(action => {
+            for (const action of viewMenuActions) {
                 if ('subMenu' in action) {
                     this.rewriteOnClicks(trackType, action.subMenu);
                 }
                 if ('onClick' in action) {
                     const holdOnClick = action.onClick;
                     action.onClick = (...args) => {
-                        self.tracks.forEach(track => {
+                        for (const track of self.tracks) {
                             if (track.type === trackType) {
                                 holdOnClick.apply(track, [track, ...args]);
                             }
-                        });
+                        }
                     };
                 }
-            });
+            }
         },
         get trackTypeActions() {
             const allActions = new Map();
-            self.tracks.forEach(track => {
+            for (const track of self.tracks) {
                 const trackInMap = allActions.get(track.type);
                 if (!trackInMap) {
                     const viewMenuActions = structuredClone(track.viewMenuActions);
                     this.rewriteOnClicks(track.type, viewMenuActions);
                     allActions.set(track.type, viewMenuActions);
                 }
-            });
+            }
             return allActions;
         },
     }))
@@ -377,11 +381,13 @@ export function stateModelFactory(pluginManager) {
         hideTrack(trackId) {
             const schema = pluginManager.pluggableConfigSchemaType('track');
             const conf = resolveIdentifier(schema, getRoot(self), trackId);
-            const t = self.tracks.filter(t => t.configuration === conf);
+            const tracks = self.tracks.filter(t => t.configuration === conf);
             transaction(() => {
-                t.forEach(t => self.tracks.remove(t));
+                for (const track of tracks) {
+                    self.tracks.remove(track);
+                }
             });
-            return t.length;
+            return tracks.length;
         },
     }))
         .actions(self => ({
@@ -522,6 +528,9 @@ export function stateModelFactory(pluginManager) {
             self.scrollTo(0);
             self.zoomTo(10);
         },
+        setInit(arg) {
+            self.init = arg;
+        },
         async exportSvg(opts = {}) {
             const { renderToSvg } = await import('./svgcomponents/SVGLinearGenomeView');
             const html = await renderToSvg(self, opts);
@@ -742,7 +751,9 @@ export function stateModelFactory(pluginManager) {
             for (const [key, value] of self.trackTypeActions.entries()) {
                 if (value.length) {
                     menuItems.push({ type: 'divider' }, { type: 'subHeader', label: key });
-                    value.forEach(action => menuItems.push(action));
+                    for (const action of value) {
+                        menuItems.push(action);
+                    }
                 }
             }
             return menuItems;
@@ -784,20 +795,6 @@ export function stateModelFactory(pluginManager) {
             self.coarseDynamicBlocks = blocks.contentBlocks;
             self.coarseTotalBp = blocks.totalBp;
         },
-        afterAttach() {
-            addDisposer(self, autorun(() => {
-                if (self.initialized) {
-                    this.setCoarseDynamicBlocks(self.dynamicBlocks);
-                }
-            }, { delay: 150 }));
-            addDisposer(self, autorun(() => {
-                const s = (s) => JSON.stringify(s);
-                const { showCytobandsSetting, showCenterLine, colorByCDS } = self;
-                localStorageSetItem('lgv-showCytobands', s(showCytobandsSetting));
-                localStorageSetItem('lgv-showCenterLine', s(showCenterLine));
-                localStorageSetItem('lgv-colorByCDS', s(colorByCDS));
-            }));
-        },
     }))
         .actions(self => ({
         moveTo(start, end) {
@@ -819,6 +816,9 @@ export function stateModelFactory(pluginManager) {
                 model: self,
             });
         },
+        async navToLocation(parsedLocString, assemblyName) {
+            return this.navToLocations([parsedLocString], assemblyName);
+        },
         async navToLocations(parsedLocStrings, assemblyName) {
             const { assemblyManager } = getSession(self);
             await when(() => self.volatileWidth !== undefined);
@@ -964,6 +964,33 @@ export function stateModelFactory(pluginManager) {
                 document.removeEventListener('keydown', handler);
             });
         },
+        afterAttach() {
+            addDisposer(self, autorun(() => {
+                var _a;
+                const { init } = self;
+                if (init) {
+                    self
+                        .navToLocString(init.loc, init.assembly)
+                        .catch((e) => {
+                        getSession(self).notifyError(`${e}`, e);
+                    });
+                    (_a = init.tracks) === null || _a === void 0 ? void 0 : _a.map(t => self.showTrack(t));
+                    self.setInit(undefined);
+                }
+            }));
+            addDisposer(self, autorun(() => {
+                if (self.initialized) {
+                    self.setCoarseDynamicBlocks(self.dynamicBlocks);
+                }
+            }, { delay: 150 }));
+            addDisposer(self, autorun(() => {
+                const s = (s) => JSON.stringify(s);
+                const { showCytobandsSetting, showCenterLine, colorByCDS } = self;
+                localStorageSetItem('lgv-showCytobands', s(showCytobandsSetting));
+                localStorageSetItem('lgv-showCenterLine', s(showCenterLine));
+                localStorageSetItem('lgv-colorByCDS', s(colorByCDS));
+            }));
+        },
     }))
         .preProcessSnapshot(snap => {
         if (!snap) {
@@ -976,6 +1003,15 @@ export function stateModelFactory(pluginManager) {
                 : [highlight],
             ...rest,
         };
+    })
+        .postProcessSnapshot(snap => {
+        if (!snap) {
+            return snap;
+        }
+        else {
+            const { init, ...rest } = snap;
+            return rest;
+        }
     });
 }
 export { default as LinearGenomeView, default as ReactComponent, } from './components/LinearGenomeView';

package/esm/LinearGenomeView/types.d.ts

@@ -36,3 +36,8 @@ export interface NavLocation {
     end?: number;
     assemblyName?: string;
 }
+export interface InitState {
+    loc: string;
+    assembly: string;
+    tracks?: string[];
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jbrowse/plugin-linear-genome-view",
-  "version": "3.1.0",
+  "version": "3.3.0",
   "description": "JBrowse 2 linear genome view",
   "keywords": [
     "jbrowse",
@@ -38,9 +38,9 @@
     "useSrc": "node ../../scripts/useSrc.js"
   },
   "dependencies": {
-    "@jbrowse/core": "^3.1.0",
-    "@mui/icons-material": "^6.0.0",
-    "@mui/material": "^6.0.0",
+    "@jbrowse/core": "^3.3.0",
+    "@mui/icons-material": "^7.0.0",
+    "@mui/material": "^7.0.0",
     "@types/file-saver": "^2.0.1",
     "copy-to-clipboard": "^3.3.1",
     "file-saver": "^2.0.0",
@@ -58,5 +58,5 @@
     "access": "public"
   },
   "module": "esm/index.js",
-  "gitHead": "91492049ddea0aed90eb24d3c066c2d9f5a6b189"
+  "gitHead": "0bb64d8cc7ecdd167515308b31eec3d9acbc59e4"
 }