@jbrowse/plugin-linear-genome-view 5.0.0-beta.2 → 5.0.0-beta.20

package/esm/LinearGenomeView/afterAttach.d.ts

@@ -1,17 +1,34 @@
 import type { LinearGenomeViewModel } from './model.ts';
 import type { InitState } from './types.ts';
-import type { AssemblyHost, NotificationSink } from '@jbrowse/core/util';
+import type { AbstractSessionModel, AssemblyHost, NotificationSink } from '@jbrowse/core/util';
 /**
- * Apply an init blob's `highlight` entries to a view, coercing each locstring
- * or wire-format object and reporting a bad one without taking out its
- * siblings.
+ * Navigate a view to an init blob's `loc`, reporting a bad one as a warning
+ * (a gene that matched nothing) or an error rather than throwing. Exported
+ * because a LinearSyntenyView row is a LinearGenomeView that does not go
+ * through this file's init autorun, so it navigates each row itself.
+ */
+export declare function navToInitLoc(view: Pick<LinearGenomeViewModel, 'navToLocString'>, session: NotificationSink, init: Pick<InitState, 'assembly' | 'grow' | 'showHitTrack' | 'tracks'> & {
+    loc: string;
+}): Promise<void>;
+/**
+ * Open an init blob's `tracks`, one at a time, a bare string taken as a list
+ * of one. launchTrack funnels through showTrackGeneric, which surfaces any
+ * failure (unresolved id, bad config) as its own snackbar, and loads the
+ * picked display's state model first when it is registered lazily. Exported
+ * for the LinearSyntenyView rows, as `navToInitLoc` is.
+ */
+export declare function showInitTracks(self: LinearGenomeViewModel, init: Pick<InitState, 'tracks'>): Promise<void>;
+/**
+ * Add an init blob's `highlight` entries to the session, coercing each
+ * locstring or wire-format object and reporting a bad one without taking out
+ * its siblings. An entry without an assembly takes the launch's.
  *
  * Exported because a LinearSyntenyView row is a LinearGenomeView that does NOT
  * go through this file's init autorun — the synteny view builds each row's
  * snapshot and navigates it itself — so the row's own `highlight` had nowhere
  * to be applied and was dropped in silence.
  */
-export declare function applyInitHighlights(self: LinearGenomeViewModel, session: AssemblyHost & NotificationSink, init: Pick<InitState, 'highlight' | 'assembly'>): void;
+export declare function applyInitHighlights(session: AssemblyHost & NotificationSink & Pick<AbstractSessionModel, 'addHighlight'>, init: Pick<InitState, 'highlight' | 'assembly'>): void;
 /**
  * Autorun that handles the init state - navigating to initial location,
  * showing tracks, etc.

package/esm/LinearGenomeView/afterAttach.js

@@ -1,9 +1,10 @@
-import { getSession, isSessionModelWithWidgets, localStorageSetItem, resolveNamedRegions, } from '@jbrowse/core/util';
+import { getSession, isSessionModelWithWidgets, resolveNamedRegions, } from '@jbrowse/core/util';
 import { coerceHighlight } from '@jbrowse/core/util/highlights';
 import { installInitAutorun } from '@jbrowse/core/util/installInitAutorun';
-import { normalizeTrackInit } from '@jbrowse/core/util/tracks';
+import { normalizeTrackInit, warmTrackDisplayGeneric, } from '@jbrowse/core/util/tracks';
+import { requestedDisplayType } from '@jbrowse/launch-args/displayAlias';
 import { addDisposer } from '@jbrowse/mobx-state-tree';
-import { autorun, when } from 'mobx';
+import { autorun, untracked, when } from 'mobx';
 import { SearchResultsNotFoundError } from '../searchUtils.js';
 // `init` is a frozen blob that often comes from hand-authored JSON, where a
 // lone entry gets written bare (`tracks: 'genes'`). A string is iterable, so
@@ -21,24 +22,17 @@ async function openTracklist(self, session, superseded) {
     // activateTrackSelector throws without widget support, which would abort the
     // rest of init (navigation included) over an optional extra
     if (isSessionModelWithWidgets(session)) {
-        // `poppedOut` — the visible widget rendered in a modal, leaving the drawer
-        // column free — lives on SessionWithDrawerWidgets, whose type guard is
-        // product-core's, so duck-type it here rather than take an upward
-        // dependency. A session without the key has no modal to pop out into, so
-        // false is the right answer for it.
-        const poppedOut = 'poppedOut' in session && session.poppedOut === true;
-        // the same line App.tsx draws to decide whether to render the drawer column
-        // at all. A *minimized* drawer still holds a visibleWidget while taking no
-        // width, and showWidget un-minimizes it (product-core's DrawerWidgets), so
-        // `!!visibleWidget` alone reads "already open", skips the wait below, and
-        // hands navigation the pre-drawer width — the exact thing this is here to
-        // prevent.
-        const drawerWasOpen = !!session.visibleWidget && !session.minimized && !poppedOut;
+        // `drawerVisible` is the line App.tsx draws to render the drawer column at
+        // all: a minimized, popped-out or modal-only widget takes no width. It
+        // lives on SessionWithDrawerWidgets, whose type guard is product-core's, so
+        // it is duck-typed rather than taken as an upward dependency; a session
+        // without it has no drawer column.
+        const drawerVisible = () => 'drawerVisible' in session && session.drawerVisible === true;
+        const drawerWasVisible = drawerVisible();
         const widthBefore = self.volatileWidth;
         self.activateTrackSelector();
-        // a width change is only coming if the drawer is about to start taking
-        // space; popped out it never does, so don't sit out the timeout for it
-        if (!drawerWasOpen && !poppedOut) {
+        // a width change is only coming if the drawer just started taking space
+        if (!drawerWasVisible && drawerVisible()) {
             // Bounded so init can't wedge here if the drawer doesn't shrink the view
             // (e.g. embedded or modal-drawer layouts, where no width change is
             // coming), and superseded so a re-launch landing mid-wait isn't held
@@ -88,86 +82,102 @@ function showNamedRegions(self, session, assemblyName, names) {
         }
     }
 }
-async function navigateInit(self, session, init) {
+function reportInitNavError(session, e) {
+    console.error(e);
+    if (e instanceof SearchResultsNotFoundError) {
+        // a gene name that matched nothing is a soft miss, not an app error
+        session.notify(e.message, 'warning');
+    }
+    else {
+        session.notifyError(`${e}`, e);
+    }
+}
+/**
+ * Navigate a view to an init blob's `loc`, reporting a bad one as a warning
+ * (a gene that matched nothing) or an error rather than throwing. Exported
+ * because a LinearSyntenyView row is a LinearGenomeView that does not go
+ * through this file's init autorun, so it navigates each row itself.
+ */
+export async function navToInitLoc(view, session, init) {
     try {
-        if (init.loc) {
-            // navToLocString waits for the assembly itself, and this autorun only
-            // runs once `initialized` confirms init.assembly has loaded regions, so
-            // no explicit waitForAssembly is needed here
-            // a spec that listed its tracks gets those tracks; one that only named
-            // a gene gets the track the gene was found in, as the search box would
-            await self.navToLocString(init.loc, init.assembly, init.grow, {
-                showHitTrack: asArray(init.tracks).length === 0,
-            });
-        }
-        else if (init.displayedRegionNames?.length) {
-            // an explicit region list is a navigation request just like `loc`, so it
-            // applies even when regions already exist (URL params layered onto a
-            // defaultSession that already navigated)
-            //
-            // `?.length`, not the bare key: an empty array is truthy, so a spec
-            // writing `displayedRegionNames: []` took this path with nothing to name
-            // and got told its list of no names had matched no regions. That is why
-            // LinearSyntenyView's doSubmit omits the key rather than passing [].
-            showNamedRegions(self, session, init.assembly, init.displayedRegionNames);
-        }
-        else if (!self.hasDisplayedRegions) {
-            // a highlight-only init (nothing to navigate to) must not clobber a
-            // defaultSession's existing navigation, so only auto-navigate when
-            // nothing is shown yet
-            self.showAllRegionsInAssembly(init.assembly);
-        }
+        // navToLocString waits for the assembly itself. A spec that listed its
+        // tracks gets those tracks; one that only named a gene gets the track the
+        // gene was found in, as the search box would
+        await view.navToLocString(init.loc, init.assembly, init.grow, {
+            showHitTrack: init.showHitTrack ?? asArray(init.tracks).length === 0,
+        });
     }
     catch (e) {
-        console.error(init, e);
-        if (e instanceof SearchResultsNotFoundError) {
-            // a &loc= gene name that matched nothing is a soft miss, not an app error
-            session.notify(e.message, 'warning');
+        reportInitNavError(session, e);
+    }
+}
+async function navigateInit(self, session, init) {
+    if (init.loc) {
+        await navToInitLoc(self, session, { ...init, loc: init.loc });
+    }
+    else {
+        try {
+            navigateWithoutLoc(self, session, init);
         }
-        else {
-            session.notifyError(`${e}`, e);
+        catch (e) {
+            reportInitNavError(session, e);
         }
     }
 }
-// launchTrack funnels through showTrackGeneric, which surfaces any failure
-// (unresolved id, bad config, etc) as its own snackbar, and loads the picked
-// display's state model first when it is registered lazily
-async function showInitTracks(self, init) {
-    for (const t of asArray(init.tracks)) {
-        const { trackId, trackSnapshot, displaySnapshot } = normalizeTrackInit(t);
-        await self.launchTrack(trackId, trackSnapshot, displaySnapshot);
+function navigateWithoutLoc(self, session, init) {
+    if (init.displayedRegionNames?.length) {
+        // an explicit region list is a navigation request just like `loc`, so it
+        // applies even when regions already exist (URL params layered onto a
+        // defaultSession that already navigated)
+        //
+        // `?.length`, not the bare key: an empty array is truthy, so a spec
+        // writing `displayedRegionNames: []` took this path with nothing to name
+        // and got told its list of no names had matched no regions. That is why
+        // LinearSyntenyView's doSubmit omits the key rather than passing [].
+        showNamedRegions(self, session, init.assembly, init.displayedRegionNames);
+    }
+    else if (!self.hasDisplayedRegions) {
+        // a highlight-only init (nothing to navigate to) must not clobber a
+        // defaultSession's existing navigation, so only auto-navigate when
+        // nothing is shown yet
+        self.showAllRegionsInAssembly(init.assembly);
     }
 }
-// backfill assemblyName on any session-authored highlights that omitted it so
-// downstream code (bookmark widget grid, addBookmark, etc) doesn't have to keep
-// falling back
-function backfillHighlightAssemblies(self) {
-    const fallback = self.assemblyNames[0];
-    if (self.highlight.length && fallback) {
-        const normalized = self.highlight.map(h => h.assemblyName ? h : { ...h, assemblyName: fallback });
-        if (normalized.some((h, i) => h !== self.highlight[i])) {
-            self.setHighlight(normalized);
+/**
+ * Open an init blob's `tracks`, one at a time, a bare string taken as a list
+ * of one. launchTrack funnels through showTrackGeneric, which surfaces any
+ * failure (unresolved id, bad config) as its own snackbar, and loads the
+ * picked display's state model first when it is registered lazily. Exported
+ * for the LinearSyntenyView rows, as `navToInitLoc` is.
+ */
+export async function showInitTracks(self, init) {
+    const tracks = asArray(init.tracks);
+    if (tracks.length) {
+        // lazy, so the modifier and slot tables stay out of every page's first load
+        const { launchTrackInit } = await import('../TrackModifiers/index.js');
+        for (const t of tracks) {
+            await launchTrackInit(self, t);
         }
     }
 }
 /**
- * Apply an init blob's `highlight` entries to a view, coercing each locstring
- * or wire-format object and reporting a bad one without taking out its
- * siblings.
+ * Add an init blob's `highlight` entries to the session, coercing each
+ * locstring or wire-format object and reporting a bad one without taking out
+ * its siblings. An entry without an assembly takes the launch's.
  *
  * Exported because a LinearSyntenyView row is a LinearGenomeView that does NOT
  * go through this file's init autorun — the synteny view builds each row's
  * snapshot and navigates it itself — so the row's own `highlight` had nowhere
  * to be applied and was dropped in silence.
  */
-export function applyInitHighlights(self, session, init) {
+export function applyInitHighlights(session, init) {
     for (const h of asArray(init.highlight)) {
         // parseLocString throws on an unknown refName or a malformed locstring, and
         // one bad entry must take out neither its siblings nor the rest of init
         try {
-            const highlight = coerceHighlight(h, init.assembly, refName => session.assemblyManager.isValidRefName(refName, init.assembly));
+            const highlight = coerceHighlight(h, init.assembly, (refName, asm) => session.assemblyManager.isValidRefName(refName, asm ?? init.assembly));
             if (highlight) {
-                self.addToHighlights(highlight);
+                session.addHighlight(highlight);
             }
         }
         catch (e) {
@@ -176,8 +186,14 @@ export function applyInitHighlights(self, session, init) {
         }
     }
 }
-async function applyInit(self, init, { superseded }) {
+async function applyInit(self, pending, { superseded }) {
     const session = getSession(self);
+    // A re-launch of a view already showing an assembly need not restate it:
+    // jb.setSession writes `loc` and track entries beside the built state, and
+    // the readiness gate resolved the same default before letting this run.
+    const init = pending.assembly
+        ? pending
+        : { ...pending, assembly: self.launchAssemblyName ?? pending.assembly };
     if (init.tracklist) {
         await openTracklist(self, session, superseded);
     }
@@ -186,9 +202,8 @@ async function applyInit(self, init, { superseded }) {
     // reading or mutating a detached node throws) and also covers the case
     // isAlive misses — a newer setLaunch landed mid-apply, so the rest of *this*
     // blob is stale. Finishing it anyway appends its tracks and highlights under
-    // the one that replaced it, and addToHighlights pushes, so a re-launch of the
-    // same spec (a StrictMode remount) doubles the bands. The drain loop applies
-    // the newer init next either way.
+    // the one that replaced it. The drain loop applies the newer init next either
+    // way.
     //
     // Checked after each await rather than once at the top, and as early returns
     // rather than nesting, so a step added later takes a guard beside it instead
@@ -207,8 +222,38 @@ async function applyInit(self, init, { superseded }) {
     if (init.nav !== undefined) {
         self.setHideHeader(!init.nav);
     }
-    backfillHighlightAssemblies(self);
-    applyInitHighlights(self, session, init);
+    applyInitHighlights(session, init);
+}
+/**
+ * The init autorun below waits for the view's width, which exists only once its
+ * component has rendered, and then loads the assembly and launches the tracks
+ * one at a time. The assembly and the display code each pending track needs can
+ * start loading now, all at once.
+ */
+function setupInitWarmup(self) {
+    addDisposer(self, autorun(function initWarmupAutorun() {
+        const pending = self.pendingLaunch;
+        const tracks = asArray(pending?.tracks);
+        // eslint-disable-next-line no-restricted-syntax -- EFFECT INPUT: the assembly and track configs only feed the loads started here; the pending launch is the key
+        untracked(() => {
+            const assembly = pending?.assembly ?? self.launchAssemblyName;
+            if (pending && assembly) {
+                try {
+                    getSession(self)
+                        .assemblyManager.waitForAssembly(assembly)
+                        .catch(() => { });
+                }
+                catch {
+                    // navigation reports an assembly that cannot load
+                }
+            }
+            for (const t of tracks) {
+                const { trackId, displaySnapshot, modifiers } = normalizeTrackInit(t);
+                const type = requestedDisplayType(modifiers);
+                warmTrackDisplayGeneric(self, trackId, type ? { ...displaySnapshot, type } : displaySnapshot, assembly);
+            }
+        });
+    }, { name: 'LGVInitWarmup' }));
 }
 /**
  * Autorun that handles the init state - navigating to initial location,
@@ -219,9 +264,8 @@ export function setupInitAutorun(self) {
         name: 'LGVInit',
         // `init` is what makes hasSomethingToShow / awaitingInitNavigation report
         // "loading"
-        // until navigation populates displayedRegions, so the alternative gate
-        // (clearing `init` up front, the way SpreadsheetView does) would flash the
-        // import form mid-load.
+        // until navigation populates displayedRegions, so clearing `init` up front
+        // would flash the import form mid-load.
         ready: () => self.initialized,
         // No pre-materialization phase to protect: the view is its own single row,
         // and `error` already derives a failed init assembly declaratively (via
@@ -244,32 +288,11 @@ function setupCoarseDynamicBlocksAutorun(self) {
         name: 'LGVCoarseDynamicBlocks',
     }));
 }
-/**
- * Autorun that syncs view settings to localStorage
- */
-function setupLocalStorageAutorun(self) {
-    addDisposer(self, autorun(function localStorageAutorun() {
-        const s = (s) => JSON.stringify(s);
-        const { showCytobands, showCenterLine, colorByCDS, showAminoAcids, showTrackOutlines, trackLabels, } = self;
-        localStorageSetItem('lgv-showCytobands', s(showCytobands));
-        localStorageSetItem('lgv-showCenterLine', s(showCenterLine));
-        localStorageSetItem('lgv-colorByCDS', s(colorByCDS));
-        localStorageSetItem('lgv-showAminoAcids', s(showAminoAcids));
-        localStorageSetItem('lgv-showTrackOutlines', s(showTrackOutlines));
-        // skip writing the empty default — otherwise reads later round-trip to
-        // '' instead of null, hiding the config-fallback path
-        if (trackLabels) {
-            localStorageSetItem('lgv-trackLabels', trackLabels);
-        }
-    }, {
-        name: 'LGVLocalStorage',
-    }));
-}
 /**
  * Sets up all afterAttach autoruns for the LinearGenomeView
  */
 export function doAfterAttach(self) {
+    setupInitWarmup(self);
     setupInitAutorun(self);
     setupCoarseDynamicBlocksAutorun(self);
-    setupLocalStorageAutorun(self);
 }

package/esm/LinearGenomeView/axisConfigSchema.d.ts

@@ -0,0 +1,18 @@
+/**
+ * #config LinearGenomeViewAxis
+ * #category view
+ * The linear genome view's `axis`: the ruler along its top, whose ticks
+ * `grid` carries down through the tracks.
+ *
+ * #example
+ * ```js
+ * { type: 'LinearGenomeView', axis: { grid: false } }
+ * ```
+ */
+export declare const linearGenomeViewAxisConfigSchema: import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaType<{
+    readonly grid: {
+        type: "boolean";
+    } & {
+        defaultValue: boolean;
+    };
+}, import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaOptions<undefined, undefined, undefined, import("@jbrowse/core/configuration").ConfigurationSchemaRequirement<Partial<Record<string, string[]>>, string>, any>>;

package/esm/LinearGenomeView/axisConfigSchema.js

@@ -0,0 +1,22 @@
+import { ConfigurationSchema } from '@jbrowse/core/configuration';
+/**
+ * #config LinearGenomeViewAxis
+ * #category view
+ * The linear genome view's `axis`: the ruler along its top, whose ticks
+ * `grid` carries down through the tracks.
+ *
+ * #example
+ * ```js
+ * { type: 'LinearGenomeView', axis: { grid: false } }
+ * ```
+ */
+export const linearGenomeViewAxisConfigSchema = ConfigurationSchema('LinearGenomeViewAxis', {
+    /**
+     * #slot
+     */
+    grid: {
+        type: 'boolean',
+        defaultValue: true,
+        description: "carry the ruler's ticks down through the tracks",
+    },
+}, { closed: true });

package/esm/LinearGenomeView/components/CenterLine.js

@@ -1,4 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { clamp } from '@jbrowse/core/util';
+import { basePaintedAt, bpIntoPaintedBase, } from '@jbrowse/core/util/Base1DUtils';
 import { makeStyles } from '@jbrowse/core/util/tss-react';
 import CloseIcon from '@mui/icons-material/Close';
 import { IconButton, Tooltip } from '@mui/material';
@@ -18,6 +20,7 @@ const useStyles = makeStyles()(theme => ({
     centerLineText: {
         position: 'absolute',
         left: 0,
+        bottom: 0,
         display: 'flex',
         alignItems: 'center',
         gap: 2,
@@ -31,16 +34,18 @@ const useStyles = makeStyles()(theme => ({
     },
 }));
 const CenterLine = observer(function CenterLine({ model }) {
-    const { bpPerPx, centerLineInfo, trackHeights, tracks, width } = model;
+    const { bpPerPx, centerLineInfo, tracks, width } = model;
     const { classes } = useStyles();
-    const startingPosition = width / 2;
+    const left = centerLineInfo && bpPerPx < 1
+        ? width / 2 -
+            bpIntoPaintedBase(centerLineInfo, centerLineInfo.offset) / bpPerPx
+        : width / 2;
     return tracks.length ? (_jsx("div", { "data-testid": "centerline_container", className: classes.centerLineContainer, role: "presentation", style: {
-            transform: `translateX(${startingPosition}px)`,
+            transform: `translateX(${left}px)`,
             width: Math.max(1 / bpPerPx, 1),
         }, children: centerLineInfo && (_jsxs("div", { "data-testid": "centerline_text", className: classes.centerLineText, role: "presentation", style: {
                 transform: `translateX(${Math.max(1 / bpPerPx, 1) + 5}px)`,
-                top: trackHeights,
-            }, children: [centerLineInfo.refName, ":", ' ', Math.max(Math.round(centerLineInfo.offset) + 1, 0).toLocaleString('en-US'), _jsx(Tooltip, { title: "Hide center line", children: _jsx(IconButton, { className: classes.dismiss, onClick: () => {
+            }, children: [centerLineInfo.refName, ":", ' ', (clamp(basePaintedAt(centerLineInfo, centerLineInfo.offset), centerLineInfo.start, centerLineInfo.end - 1) + 1).toLocaleString('en-US'), _jsx(Tooltip, { title: "Hide center line", children: _jsx(IconButton, { className: classes.dismiss, onClick: () => {
                             model.setShowCenterLine(false);
                         }, children: _jsx(CloseIcon, { fontSize: "inherit" }) }) })] })) })) : null;
 });

package/esm/LinearGenomeView/components/ConnectedHoverHighlight.js

@@ -1,5 +1,5 @@
 import { Fragment as _Fragment, jsx as _jsx } from "react/jsx-runtime";
-import { getSession } from '@jbrowse/core/util';
+import { getSession, isSessionModelWithWidgets } from '@jbrowse/core/util';
 import { observer } from 'mobx-react';
 import HoverPositionHighlight from './HoverPositionHighlight.js';
 // Draws a crosshair for every session widget "connected" to this view that is
@@ -9,8 +9,7 @@ import HoverPositionHighlight from './HoverPositionHighlight.js';
 // hovered interval or undefined; the widget iteration and drawing are shared.
 const ConnectedHoverHighlight = observer(function ConnectedHoverHighlight({ model, getPosition, }) {
     const session = getSession(model);
-    const widgets = 'widgets' in session ? session.widgets : undefined;
-    return !widgets ? null : (_jsx(_Fragment, { children: [...widgets].flatMap(([id, widget]) => {
+    return !isSessionModelWithWidgets(session) ? null : (_jsx(_Fragment, { children: [...session.widgets].flatMap(([id, widget]) => {
             const position = getPosition(widget, model.id);
             return position
                 ? [

package/esm/LinearGenomeView/components/CrisprGuidePanel.js

@@ -64,15 +64,14 @@ const CrisprGuidePanel = observer(function CrisprGuidePanel({ model, handleClose
     const [pamLocation, setPamLocation] = useState(DEFAULT_PRESET.pamLocation);
     const [guideLengthStr, setGuideLengthStr] = useState(String(DEFAULT_PRESET.guideLength));
     const [cutOffsetStr, setCutOffsetStr] = useState(String(DEFAULT_PRESET.cutOffset));
-    // presets carry this; Custom is treated as a blunt cutter, so the panel does
-    // not grow a second offset field for a case config can express directly
-    const [cutOffsetBottom, setCutOffsetBottom] = useState(DEFAULT_PRESET.cutOffsetBottom);
     const [searchForward, setSearchForward] = useState(true);
     const [searchReverse, setSearchReverse] = useState(true);
     const [filterQuality, setFilterQuality] = useState(false);
     // `Number('')` is 0, so an emptied field would otherwise read as a valid zero
     const guideLength = toBpCount(guideLengthStr);
     const cutOffset = toBpCount(cutOffsetStr);
+    // Custom is a blunt cutter: config can express a staggered one directly
+    const cutOffsetBottom = ENZYME_PRESETS[enzyme]?.cutOffsetBottom ?? cutOffset;
     // both are bp counts used for fixed-length string slicing, so a fractional
     // value would silently truncate and skew the placement
     const guideLengthValid = Number.isInteger(guideLength) && guideLength > 0;
@@ -101,7 +100,6 @@ const CrisprGuidePanel = observer(function CrisprGuidePanel({ model, handleClose
             setPamLocation(preset.pamLocation);
             setGuideLengthStr(String(preset.guideLength));
             setCutOffsetStr(String(preset.cutOffset));
-            setCutOffsetBottom(preset.cutOffsetBottom);
         }
     }
     function handleSubmit() {
@@ -116,7 +114,7 @@ const CrisprGuidePanel = observer(function CrisprGuidePanel({ model, handleClose
                 guideLength,
                 pamLocation,
                 cutOffset,
-                cutOffsetBottom: enzyme === 'Custom' ? cutOffset : cutOffsetBottom,
+                cutOffsetBottom,
                 searchForward,
                 searchReverse,
                 excludePolyT: filterQuality,

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

@@ -1,11 +1,16 @@
-import type { TrackLabelMode } from '../types.ts';
+import type { TrackLabelMode, ViewTrackLabelMode } from '../types.ts';
 import type { BaseExportSvgOptions } from '@jbrowse/core/ui';
-export default function ExportSvgDialog({ model, handleClose, }: {
+declare const ExportSvgDialog: ({ model, handleClose, chooseWidth, }: {
     model: {
+        width?: number;
+        effectiveTrackLabels?: ViewTrackLabelMode;
         exportSvg(opts: BaseExportSvgOptions & {
             trackLabels: TrackLabelMode;
             showGridlines: boolean;
-        }): Promise<void>;
+            viewWidth?: number;
+        }): Promise<unknown>;
     };
     handleClose: () => void;
-}): import("react").JSX.Element;
+    chooseWidth?: boolean;
+}) => import("react").JSX.Element;
+export default ExportSvgDialog;

package/esm/LinearGenomeView/components/ExportSvgDialog.js

@@ -1,14 +1,51 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
 import { BaseExportSvgDialog, LabeledCheckbox, useExportSvgPreference, } from '@jbrowse/core/ui';
 import { MenuItem, TextField } from '@mui/material';
+import { observer } from 'mobx-react';
+const MIN_WIDTH = 100;
+const MAX_WIDTH = 10000;
+const TRACK_LABEL_MODES = [
+    { mode: 'offset', label: 'Offset' },
+    { mode: 'overlapping', label: 'Overlapping' },
+    { mode: 'left', label: 'Left' },
+    { mode: 'hidden', label: 'Hidden' },
+];
 // Shared track-label + gridlines export dialog. Used by LGV, linear-synteny and
-// breakpoint-split views (their lazyDialogs re-export this).
-export default function ExportSvgDialog({ model, handleClose, }) {
-    const [trackLabels, setTrackLabels] = useExportSvgPreference('tracklabels', 'offset');
+// breakpoint-split views (their lazyDialogs re-export this). Only a caller
+// passing `chooseWidth` offers the width field, whose model lays itself out at
+// `viewWidth`.
+const ExportSvgDialog = observer(function ExportSvgDialog({ model, handleClose, chooseWidth, }) {
+    // The view's own setting is already an export mode, so a user who has not
+    // picked one here gets the figure their screen shows. The key is `-mode`
+    // because the modes were once spelled `overlay`/`none`, and a stored one of
+    // those would select nothing in the dropdown.
+    const [trackLabels, setTrackLabels] = useExportSvgPreference('tracklabels-mode', model.effectiveTrackLabels ?? 'offset');
     const [showGridlines, setShowGridlines] = useExportSvgPreference('gridlines', false);
-    return (_jsx(BaseExportSvgDialog, { model: model, handleClose: handleClose, exportSvg: opts => model.exportSvg({ ...opts, trackLabels, showGridlines }), checkboxes: _jsx(LabeledCheckbox, { checked: showGridlines, onChange: val => {
+    // not a stored preference: a remembered width would drift from the screen's
+    const [widthText, setWidthText] = useState(() => String(Math.round(model.width ?? 0)));
+    const typedWidth = Number(widthText);
+    const widthValid = Number.isInteger(typedWidth) &&
+        typedWidth >= MIN_WIDTH &&
+        typedWidth <= MAX_WIDTH;
+    return (_jsxs(BaseExportSvgDialog, { model: model, handleClose: handleClose, exportSvg: opts => model.exportSvg({
+            ...opts,
+            trackLabels,
+            showGridlines,
+            viewWidth: chooseWidth && widthValid ? typedWidth : undefined,
+        }), checkboxes: _jsx(LabeledCheckbox, { checked: showGridlines, onChange: val => {
                 setShowGridlines(val);
-            }, label: "Show gridlines" }), children: _jsxs(TextField, { select: true, label: "Track label positioning", variant: "outlined", style: { minWidth: 200 }, value: trackLabels, onChange: event => {
-                setTrackLabels(event.target.value);
-            }, children: [_jsx(MenuItem, { value: "offset", children: "Offset" }), _jsx(MenuItem, { value: "overlay", children: "Overlay" }), _jsx(MenuItem, { value: "left", children: "Left" }), _jsx(MenuItem, { value: "none", children: "None" })] }) }));
-}
+            }, label: "Show gridlines" }), children: [_jsx(TextField, { select: true, label: "Track label positioning", variant: "outlined", style: { minWidth: 200 }, value: trackLabels, onChange: event => {
+                    const picked = TRACK_LABEL_MODES.find(m => m.mode === event.target.value);
+                    if (picked) {
+                        setTrackLabels(picked.mode);
+                    }
+                }, children: TRACK_LABEL_MODES.map(({ mode, label }) => (_jsx(MenuItem, { value: mode, children: label }, mode))) }), chooseWidth ? (_jsx(TextField, { label: "Width (px)", variant: "outlined", type: "number", value: widthText, error: !widthValid, helperText: widthValid
+                    ? 'Lays the tracks out as a window this wide would; text keeps its size'
+                    : `A whole number from ${MIN_WIDTH} to ${MAX_WIDTH}`, slotProps: {
+                    htmlInput: { min: MIN_WIDTH, max: MAX_WIDTH, step: 1 },
+                }, onChange: event => {
+                    setWidthText(event.target.value);
+                } })) : null] }));
+});
+export default ExportSvgDialog;

package/esm/LinearGenomeView/components/GetSequenceDialog.js

@@ -32,12 +32,12 @@ const GetSequenceDialog = observer(function GetSequenceDialog({ model, regions,
     // a selection this dialog will happily take is a whole chromosome of
     // sequence, so both handles are forwarded: closing the dialog stops the
     // read rather than leaving the worker on it, and the wait is named
-    async (_name, _locs, stopToken, statusCallback) => {
+    async (_name, _locs, signal, statusCallback) => {
         if (regions.length === 0) {
             throw new Error('Selected region is out of bounds');
         }
         const chunks = await fetchSequence(model, regions, {
-            stopToken,
+            signal,
             statusCallback,
         });
         // validate here (in the async path) so a length mismatch surfaces via the

package/esm/LinearGenomeView/components/Header.js

@@ -1,7 +1,11 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import CascadingMenuButton from '@jbrowse/core/ui/CascadingMenuButton';
 import ScrollZoomToggle from '@jbrowse/core/ui/ScrollZoomToggle';
+import { getSession } from '@jbrowse/core/util';
 import { makeStyles } from '@jbrowse/core/util/tss-react';
 import useMeasure from '@jbrowse/core/util/useMeasure';
+import MenuIcon from '@mui/icons-material/Menu';
+import { useMediaQuery } from '@mui/material';
 import { observer } from 'mobx-react';
 import { HEADER_BAR_HEIGHT } from '../consts.js';
 import { headerFit } from '../headerFit.js';
@@ -35,12 +39,18 @@ const Controls = observer(function Controls({ model, }) {
     // row
     const [ref, { width }] = useMeasure('width');
     const highlighted = highlightedDisplays(model);
+    const viewMenu = getSession(model).viewTitleBars === false;
+    const touch = useMediaQuery('(pointer: coarse)', {
+        noSsr: true,
+    });
     const fit = headerFit({
         width,
         searchBoxPx: searchBoxWidth(model.coarseVisibleLocStrings),
         clearHighlight: highlighted.length > 0,
+        viewMenu,
+        touch,
     });
-    return (_jsxs("div", { className: classes.headerBar, ref: ref, children: [_jsx(HeaderTrackSelectorButton, { model: model, indent: fit.trackSelectorIndent }), _jsx(ScrollZoomToggle, { model: model, iconOnly: !fit.scrollZoomLabel }), _jsx("div", { className: classes.spacer }), _jsx(HeaderPanControls, { model: model, compact: !fit.panButtonSpacing }), _jsx(SearchBox, { model: model }), _jsx(HeaderClearHighlightButton, { highlighted: highlighted }), fit.regionWidth ? _jsx(HeaderRegionWidth, { model: model }) : null, _jsx(HeaderZoomControls, { model: model, showSlider: fit.zoomSlider }), _jsx("div", { className: classes.spacer })] }));
+    return (_jsxs("div", { className: classes.headerBar, ref: ref, children: [viewMenu ? (_jsx(CascadingMenuButton, { tooltip: "View menu", menuItems: () => model.menuItems(), "data-testid": "view_menu_icon", children: _jsx(MenuIcon, {}) })) : null, _jsx(HeaderTrackSelectorButton, { model: model, indent: fit.trackSelectorIndent }), touch ? null : (_jsx(ScrollZoomToggle, { model: model, iconOnly: !fit.scrollZoomLabel })), _jsx("div", { className: classes.spacer }), touch ? null : (_jsx(HeaderPanControls, { model: model, compact: !fit.panButtonSpacing })), _jsx(SearchBox, { model: model }), _jsx(HeaderClearHighlightButton, { highlighted: highlighted }), fit.regionWidth ? _jsx(HeaderRegionWidth, { model: model }) : null, _jsx(HeaderZoomControls, { model: model, showSlider: fit.zoomSlider }), _jsx("div", { className: classes.spacer })] }));
 });
 const LinearGenomeViewHeader = observer(function LinearGenomeViewHeader({ model, }) {
     const { hideHeader, hideHeaderOverview } = model;