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

package/esm/LinearGenomeView/model.js

@@ -1,36 +1,72 @@
-import { lazy } from 'react';
-import { getConf } from '@jbrowse/core/configuration';
-import { BaseViewModel, HighlightsMixin, } from '@jbrowse/core/pluggableElementTypes/models';
-import { VIEW_HEADER_HEIGHT } from '@jbrowse/core/ui';
-import { assembleLocString, clamp, getBpDisplayStr, getDialogHost, getSession, getTickDisplayStr, isSessionModelWithWidgets, localStorageGetBoolean, localStorageGetItem, springAnimate, sum, } from '@jbrowse/core/util';
+import { canonicalLocString } from '@jbrowse/core/TextSearch/places';
+import { getConf, readConfObject } from '@jbrowse/core/configuration';
+import { BaseViewModel } from '@jbrowse/core/pluggableElementTypes/models';
+import { exportViewSvg } from '@jbrowse/core/svg/exportViewSvg';
+import { highlightListMenuItems } from '@jbrowse/core/ui/menuItems';
+import { assembleLocString, clamp, getBpDisplayStr, getEnv, getNotificationSink, getSession, isSessionModelWithWidgets, localStorageGetBoolean, localStorageGetItem, localStorageSetBoolean, localStorageSetItem, springAnimate, sum, } from '@jbrowse/core/util';
 import { bpToLinearBp, bpToPx, computeMoveToLayout, createOverviewLayout, getLayoutHighlightCoords, getOverviewRegionPxSpan, moveTo, pxToBp, } from '@jbrowse/core/util/Base1DUtils';
+import { scaleBandHeights } from '@jbrowse/core/util/bandHeight';
 import { wholeBaseRegions } from '@jbrowse/core/util/blockTypes';
 import calculateDynamicBlocks from '@jbrowse/core/util/calculateDynamicBlocks';
 import calculateStaticBlocks from '@jbrowse/core/util/calculateStaticBlocks';
-import { tickLabelsWorthDrawing } from '@jbrowse/core/util/tickLabels';
+import { coerceHighlight } from '@jbrowse/core/util/highlights';
 import { hideTrackGeneric, launchToggleTrackGeneric, launchTrackGeneric, showTrackGeneric, toggleTrackGeneric, } from '@jbrowse/core/util/tracks';
 import { ElementId } from '@jbrowse/core/util/types/mst';
-import { assemblyErrorMessage, computeViewStatus, } from '@jbrowse/core/util/viewStatus';
+import { highlightsOnAssemblies } from '@jbrowse/core/util/viewHighlights';
+import { assemblyErrorMessage, computeViewStatus, viewLoading, } from '@jbrowse/core/util/viewStatus';
 import { pendingLaunch, withLaunchInput, } from '@jbrowse/core/util/withLaunchInput';
+import { MIN_DISPLAY_HEIGHT } from '@jbrowse/display-kit/const';
 import { contentRightEdgePx } from '@jbrowse/display-kit/regionHost';
-import { cast, getParent, hasParent, isAlive, types, } from '@jbrowse/mobx-state-tree';
-import { when } from 'mobx';
-import { handleSelectedRegion } from '../searchUtils.js';
+import { VIEW_TRACK_LABEL_MODES } from '@jbrowse/display-kit/types';
+import { cast, getParent, getSnapshot, hasParent, isAlive, types, } from '@jbrowse/mobx-state-tree';
+import { observable, when } from 'mobx';
+import { fetchResults, handleSelectedRegion, isOpenInView, navToOption, } from '../searchUtils.js';
 import { doAfterAttach } from './afterAttach.js';
-import { shouldSwapTracks } from './components/util.js';
-import { HEADER_BAR_HEIGHT, HEADER_OVERVIEW_HEIGHT, MIN_BP_PER_PX, MINIMIZED_TRACK_HEIGHT, RESIZE_HANDLE_HEIGHT, SCALE_BAR_HEIGHT, SHOW_ALL_REGIONS_FILL, TRACK_OUTLINE_BORDER, TRACK_TOP_GAP, } from './consts.js';
+import { linearGenomeViewAxisConfigSchema } from './axisConfigSchema.js';
+import { getCytobands, shouldSwapTracks } from './components/util.js';
+import { HEADER_BAR_HEIGHT, HEADER_OVERVIEW_HEIGHT, MIN_BP_PER_PX, MINIMIZED_TRACK_HEIGHT, MINIMUM_BLOCK_WIDTH, RESIZE_ALL_HANDLE_HEIGHT, RESIZE_HANDLE_HEIGHT, SCALE_BAR_HEIGHT, SHOW_ALL_REGIONS_FILL, TRACK_OUTLINE_BORDER, TRACK_TOP_GAP, } from './consts.js';
 import { planFlight } from './flyTo.js';
 import { setupKeyboardHandler } from './keyboardHandler.js';
 import { lgvLaunchKeys } from './launchKeys.js';
-import { buildMenuItems, buildRubberBandMenuItems, buildRubberbandClickMenuItems, } from './menuItems.js';
+import { buildHighlightsSubMenuItems, buildMenuItems, buildRubberBandMenuItems, buildRubberbandClickMenuItems, } from './menuItems.js';
 import { sharedScaleContainerOf } from './sharedScaleContainer.js';
-import { calculateVisibleLocStrings, cytobandLabelGutterWidth, expandRegion, fitAllRegionsWindow, generateLocations, getScalebarRefNameLabels, regionsOrientation, groupContiguousBlocks, labelFitsInBlock, makeBlockTicks, runRefNameLabelPx, tickLabelWidth, } from './util.js';
-// lazies
-const SearchResultsDialog = lazy(() => import('./components/SearchResultsDialog.js'));
-// The one array `paddingSpans` returns when a view has nothing to mask, so that
-// computed's value repeats by identity. Frozen because every consumer maps over
-// it and a caller that sorted in place would do so for the whole session.
-const NO_PADDING_SPANS = Object.freeze([]);
+import { showFiles } from './showFiles.js';
+import { calculateVisibleLocStrings, cytobandLabelGutterWidth, expandRegion, fitAllRegionsWindow, generateLocations, getGridlineTicks, getPaddingSpans, getScalebarLabels, getScalebarRefNameLabels, regionsOrientation, setDisplayedRegionsKeepingCenter, } from './util.js';
+function searchHitsOf(model, results, query, assemblyName, land) {
+    const session = getSession(model);
+    const assembly = session.assemblyManager.get(assemblyName);
+    const ordered = [...results].sort((a, b) => Number(isOpenInView(b, model)) - Number(isOpenInView(a, model)));
+    return {
+        query,
+        assemblyName,
+        rows: ordered.map(result => {
+            const location = result.getLocation() ?? '';
+            const trackId = result.getTrackId();
+            return {
+                id: result.getId(),
+                label: result.getLabel(),
+                location: assembly && location
+                    ? canonicalLocString(location, assembly)
+                    : location,
+                trackName: trackId ? (session.getTrackById(trackId)?.name ?? '') : '',
+            };
+        }),
+        pick: async (id) => {
+            const picked = ordered.find(result => result.getId() === id);
+            try {
+                if (picked) {
+                    await land(picked);
+                }
+            }
+            catch (e) {
+                console.error(e);
+                if (isAlive(model)) {
+                    getNotificationSink(model).notifyError(`${e}`, e);
+                }
+            }
+        },
+    };
+}
 /**
  * Calculate the offsetPx needed to center content within a viewport.
  * Returns a negative offset when content is smaller than viewport (padding on left).
@@ -39,42 +75,46 @@ function getCenteredOffsetPx(contentPx, viewportPx) {
     return Math.round(contentPx / 2 - viewportPx / 2);
 }
 /**
- * Resolve a region's refName to the assembly's canonical name, falling back to
- * the raw refName when the assemblyName is missing or unknown (so highlights
- * authored without an assembly still render in single-assembly views).
+ * A refName in the named assembly's canonical spelling, or unchanged when that
+ * assembly is missing or unknown, so a highlight authored without one still
+ * lands in a single-assembly view.
  */
-function resolveCanonicalRefName(self, region) {
+function canonicalRefName(assemblyManager, assemblyName, refName) {
+    const asm = assemblyName ? assemblyManager.get(assemblyName) : undefined;
+    return asm?.getCanonicalRefName2(refName) ?? refName;
+}
+function canonicalHighlight(self, region) {
     const { assemblyManager } = getSession(self);
-    const asm = region.assemblyName
-        ? assemblyManager.get(region.assemblyName)
-        : undefined;
-    return asm?.getCanonicalRefName2(region.refName) ?? region.refName;
+    return {
+        ...region,
+        refName: canonicalRefName(assemblyManager, region.assemblyName, region.refName),
+    };
 }
 // bpPerPx deltas smaller than this are treated as no zoom change, avoiding
 // pointless offset re-anchoring on micro-steps
+// a stored mode this build does not know reads as unset, the plugin default
+function storedTrackLabels() {
+    const stored = localStorageGetItem('lgv-trackLabels');
+    return VIEW_TRACK_LABEL_MODES.find(mode => mode === stored) ?? '';
+}
 const BP_PER_PX_EPSILON = 0.000001;
-// px of the rightmost content kept on-screen at max scroll-right, so the genome
-// can't be scrolled entirely off the left edge. Shared by maxOffset and
-// getSelectedRegions' clamp so the two bounds can't drift apart.
-const MAX_OFFSET_PADDING_PX = 10;
-// px of the leftmost content kept on-screen at max scroll-left, mirroring
-// MAX_OFFSET_PADDING_PX at the other end
-const MIN_OFFSET_PADDING_PX = 30;
+// px of blank space a view may scroll past either end of its regions, enough to
+// read as an edge and too little to lose the content
+const OVERSCROLL_PX = 100;
+// The offsets a view can scroll to: the content edge to edge plus a little
+// overscroll. Content narrower than the view collapses the range to the
+// centered offset, which is what `showAllRegions` and `fitAllRegions` ask for.
+function offsetBounds(contentPx, viewportPx) {
+    const centered = getCenteredOffsetPx(contentPx, viewportPx);
+    return contentPx > viewportPx
+        ? { min: -OVERSCROLL_PX, max: contentPx - viewportPx + OVERSCROLL_PX }
+        : { min: centered, max: centered };
+}
 // whether two BlockSets cover the same blocks, by key and in order
 function sameBlockKeys(a, b) {
     return (a.blocks.length === b.blocks.length &&
         a.blocks.every((block, i) => block.key === b.blocks[i].key));
 }
-/**
- * Resolve a NavLocation's refName to the assembly's canonical name, falling
- * back to the raw refName (and the view's default assembly) when the assembly
- * is missing or unknown.
- */
-function navLocationRefName(assemblyManager, defaultAssemblyName, location) {
-    return (assemblyManager
-        .get(location.assemblyName || defaultAssemblyName)
-        ?.getCanonicalRefName2(location.refName) || location.refName);
-}
 /**
  * Resolve one end of a navigation range to the displayedRegion index that
  * contains it plus the bp offset into that region. `side` selects which edge of
@@ -84,7 +124,7 @@ function navLocationRefName(assemblyManager, defaultAssemblyName, location) {
  * resolved against those raw coords, and only the region it picks bounds `grow`.
  */
 function resolveNavEndpoint({ location, assemblyManager, defaultAssemblyName, side, displayedRegions, grow, }) {
-    const refName = navLocationRefName(assemblyManager, defaultAssemblyName, location);
+    const refName = canonicalRefName(assemblyManager, location.assemblyName || defaultAssemblyName, location.refName);
     const first = displayedRegions.find(r => r.refName === refName);
     if (!first) {
         throw new Error(`could not find a region with refName "${refName}"`);
@@ -131,21 +171,24 @@ function openTrackSelectorWidget(self) {
     throw new Error('session does not support widgets');
 }
 /**
- * Whether the track selector is the drawer widget on screen right now. One
+ * Whether the drawer is showing this view's track selector right now. One
  * spelling for the `isTrackSelectorOpen` getter (which lights up the header
- * button) and for `toggleTrackSelector` (which decides hide-vs-show) — the
- * `!minimized` term is exactly the kind of thing that goes into one of two
- * hand-written copies and not the other.
+ * button) and for `toggleTrackSelector` (which decides hide-vs-show). The
+ * widget id is shared by every view, so the selector's `view` is what says
+ * whose it is.
  */
 function isTrackSelectorVisible(self) {
     const session = getSession(self);
     return (isSessionModelWithWidgets(session) &&
         session.visibleWidget?.id === TRACK_SELECTOR_WIDGET_ID &&
+        session.visibleWidget.view?.id === self.id &&
         !session.minimized);
 }
 /**
  * #stateModel LinearGenomeView
  * #category view
+ * Stacks tracks under a horizontal axis of one or more genomic regions laid
+ * end to end, which the user scrolls, zooms and searches.
  *
  * #example
  * A `LinearGenomeView` is what you hand-author under `defaultSession.views`, and
@@ -157,7 +200,7 @@ function isTrackSelectorVisible(self) {
  *   views: [
  *     {
  *       type: 'LinearGenomeView',
- *       colorByCDS: true,
+ *       colorByFrame: true,
  *       assembly: 'hg38',
  *       loc: 'chr1:1,000,000-1,100,000',
  *       tracks: ['genes', 'alignments'],
@@ -167,9 +210,8 @@ function isTrackSelectorVisible(self) {
  * ```
  * `assembly`, `loc`, `tracks`, `tracklist`, `nav` and `highlight` need
  * on-attach resolution and are captured into the `launch` property below;
- * `colorByCDS`, `showAminoAcids`, `showCenterLine`, `trackLabels` and
- * `showHighlightChips` are plain view props MST restores natively. Both are
- * written the same way.
+ * `colorByFrame`, `showAminoAcids`, `showCenterLine` and `trackLabels` are plain
+ * view props MST restores natively. Both are written the same way.
  * At runtime the same model is driven imperatively — every property and action
  * below is reachable on `viewState.session.views[0]`:
  * ```js
@@ -181,7 +223,7 @@ function isTrackSelectorVisible(self) {
  */
 export function stateModelFactory(pluginManager) {
     const model = types
-        .compose('LinearGenomeView', BaseViewModel, HighlightsMixin(), types.model({
+        .compose('LinearGenomeView', BaseViewModel, types.model({
         /**
          * #property
          */
@@ -196,17 +238,16 @@ export function stateModelFactory(pluginManager) {
         /**
          * #property
          * Left edge of the viewport, in linearized bp — the concatenated
-         * `displayedRegions` space that `offsetPx` indexes, which carries no
+         * `displayedRegions` space that `offsetPx` indexes, which has no
          * inter-region padding, so the two differ only by `bpPerPx`. May be
-         * negative, which is the view scrolled past the left end.
+         * negative when the view is scrolled past the left end.
          *
-         * The viewport is stored as the genomic WINDOW it frames rather than as
-         * the pixels that framed it, because pixels mean nothing without the
-         * width they were measured at and a snapshot does not carry one. Storing
-         * them anyway is why a session authored in a 1000px window used to open
-         * at 500px showing half the region its author was looking at, while the
-         * same location as a `&loc=` opened correctly — the two ways to share a
-         * view disagreed, and only the one that stores intent was right.
+         * The view stores the genomic window it frames rather than the pixels
+         * that framed it, because pixels mean nothing without the width they
+         * were measured at and a snapshot does not include one. A session
+         * authored in a 1000px window therefore shows the same region when
+         * opened at 500px, as the same location given as a `&loc=` does: both
+         * ways to share a view store intent.
          */
         windowStartBp: types.stripDefault(types.number, 0),
         /**
@@ -219,14 +260,15 @@ export function stateModelFactory(pluginManager) {
         windowWidthBp: types.stripDefault(types.number, 0),
         /**
          * #property
-         * MIGRATION ONLY, and safe to delete once pre-window sessions are no
-         * longer in circulation.
+         * Used for migration only, and permanent: share links written before the
+         * window was stored contain `bpPerPx`/`offsetPx`, and there are many of
+         * them.
          *
-         * A snapshot written before the window was stored carries `offsetPx` and
+         * A snapshot written before the window was stored has `offsetPx` and
          * `bpPerPx` but not the width they were measured at, so the window they
          * framed cannot be recovered. `windowStartBp` can (it is
          * `offsetPx * bpPerPx`, no width needed); the width in bp cannot. This
-         * carries the old `bpPerPx` to the first measure, which adopts it at
+         * property holds the old `bpPerPx` until the first measure, which adopts it at
          * whatever width arrives — exactly what the old code did — and clears
          * this. So an old link keeps its old behavior rather than being
          * reinterpreted, and everything authored since restores its window.
@@ -235,9 +277,8 @@ export function stateModelFactory(pluginManager) {
         /**
          * #property
          * currently displayed regions, can be a single chromosome, arbitrary
-         * subsections, or the entire  set of chromosomes in the genome, but it not
-         * advised to use the entire set of chromosomes if your assembly is very
-         * fragmented
+         * subsections, or the entire set of chromosomes in the genome. The entire
+         * set is not advised if your assembly is very fragmented
          */
         displayedRegions: types.stripDefault(types.frozen(), []),
         /**
@@ -264,14 +305,17 @@ export function stateModelFactory(pluginManager) {
         hideNoTracksActive: types.stripDefault(types.boolean, false),
         /**
          * #property
-         * vestigial: the hierarchical selector is the only one that exists, so
-         * this value is ignored. Retained because saved sessions and configs
-         * persist it.
+         * ignored: the hierarchical selector is the only one. Declared because
+         * saved sessions and share links carry it.
+         * @deprecated
          */
-        trackSelectorType: types.stripDefault(types.enumeration(['hierarchical']), 'hierarchical'),
+        trackSelectorType: types.stripDefault(types.string, 'hierarchical'),
         /**
          * #property
-         * show the "center line"
+         * show the "center line". A personal preference: never in a session
+         * snapshot. It, showCytobands, trackLabels, colorByFrame, showAminoAcids
+         * and showTrackOutlines start from this browser's last choice, which
+         * their setters record.
          */
         showCenterLine: types.optional(types.boolean, () => localStorageGetBoolean('lgv-showCenterLine', false)),
         /**
@@ -284,34 +328,30 @@ export function stateModelFactory(pluginManager) {
         /**
          * #property
          * how to display the track labels, can be "overlapping", "offset", or
-         * "hidden", or empty string "" (which results in the
-         * LinearGenomeViewPlugin config default being used). the resolved value
-         * is the `effectiveTrackLabels` getter. see LinearGenomeViewPlugin
-         * https://jbrowse.org/jb2/docs/config/lineargenomeviewplugin/ docs for
-         * how conf is used
-         */
-        trackLabels: types.optional(types.string, () => localStorageGetItem('lgv-trackLabels') ?? ''),
-        /**
-         * #property
-         * show the "gridlines" in the track area
+         * "hidden", or empty string "" (which uses the LinearGenomeViewPlugin
+         * config default). The resolved value is the `effectiveTrackLabels`
+         * getter. See the LinearGenomeViewPlugin docs at
+         * https://jbrowse.org/jb2/docs/config/lineargenomeviewconfigschema/ for
+         * how the config is used
          */
-        showGridlines: types.stripDefault(types.boolean, true),
+        trackLabels: types.optional(types.enumeration('ViewTrackLabels', ['', ...VIEW_TRACK_LABEL_MODES]), () => storedTrackLabels()),
         /**
          * #property
-         * controls whether highlight/bookmark chip labels are shown inline
+         * The ruler's guide, a [](/docs/config/lineargenomeviewaxis) object:
+         * `{ grid: false }` stops its ticks running down through the tracks.
          */
-        labelsVisible: types.stripDefault(types.boolean, true),
+        axis: types.stripDefault(linearGenomeViewAxisConfigSchema, {}),
         /**
          * #property
          * color CDS segments by reading frame
          */
-        colorByCDS: types.optional(types.boolean, () => localStorageGetBoolean('lgv-colorByCDS', false)),
+        colorByFrame: types.optional(types.boolean, () => localStorageGetBoolean('lgv-colorByFrame', false)),
         /**
          * #property
          * draw translated codons on coding features once zoomed in far enough:
          * an alternating per-codon shading, and the amino acid letters on top of
-         * it at base-level zoom. Independent of `colorByCDS`, which only recolors
-         * the segments by frame.
+         * it at base-level zoom. Independent of `colorByFrame`, which only
+         * recolors the segments by frame.
          */
         showAminoAcids: types.optional(types.boolean, () => localStorageGetBoolean('lgv-showAminoAcids', true)),
         /**
@@ -335,36 +375,49 @@ export function stateModelFactory(pluginManager) {
          */
         launch: types.frozen(),
     }))
-        .volatile(self => {
+        .volatile(() => {
         // typed locals so `unknown`/`Record` aren't narrowed to `undefined`/`{}`; inline
         // type assertions here get stripped by no-unnecessary-type-assertion
         const volatileError = undefined;
-        const trackRefs = {};
         return {
             /**
              * #volatile
+             * Height of each track's in-flow label band, measured by
+             * TrackContainer as the rendering container's offset inside its Paper.
+             * Absent (0) while the label is hidden, overlapping, or not yet
+             * measured. Observable, so the offset and height getters re-derive
+             * when a band changes.
              */
-            volatileWidth: undefined,
+            trackLabelBands: observable.map(),
             /**
              * #volatile
+             * How much taller the view's box is than the scroll port it sits in,
+             * in px, negative when it is shorter. Measured by the view component
+             * for a top-level view; undefined until then, and for a nested one.
              */
-            minimumBlockWidth: 3,
+            scrollPortExcess: undefined,
+            /**
+             * #volatile
+             */
+            volatileWidth: undefined,
             /**
              * #volatile
              */
             draggingTrackId: undefined,
             /**
              * #volatile
+             * Set by a search whose hits name more than one place, until the user
+             * picks one or closes it.
              */
-            lastTrackDragY: undefined,
+            searchPicker: undefined,
             /**
              * #volatile
              */
-            volatileError,
+            lastTrackDragY: undefined,
             /**
              * #volatile
              */
-            trackRefs,
+            volatileError,
             /**
              * #volatile
              */
@@ -376,30 +429,29 @@ export function stateModelFactory(pluginManager) {
             /**
              * #volatile
              */
-            // What `bpPerPx` used to hold at creation — the snapshot's value, or
-            // the default of 1 — which cannot be read here now that it is derived
-            // and declared after volatile. It has to be a real scale rather than
-            // the not-yet-measured 0: the canvas displays lay out against
-            // `coarseBpPerPx` rather than the live one, and a zero there is a
-            // degenerate layout for the frame or two before the debounced autorun
-            // first writes it.
-            coarseBpPerPx: self.legacyBpPerPx || 1,
+            // A real scale rather than the not-yet-measured 0, for the canvas
+            // displays that lay out against it; `setWidth` seeds the true one at
+            // the first measure.
+            coarseBpPerPx: 1,
             /**
              * #volatile
+             * the scroll offset the coarse blocks were laid out at, in px at
+             * `coarseBpPerPx`: the settled viewport's left edge, which the first
+             * coarse block is not while the view is scrolled before the first region
              */
-            leftOffset: undefined,
+            coarseOffsetPx: 0,
             /**
              * #volatile
              */
-            rightOffset: undefined,
+            leftOffset: undefined,
             /**
              * #volatile
              */
-            isScalebarRefNameMenuOpen: false,
+            rightOffset: undefined,
             /**
              * #volatile
              */
-            scalebarRefNameClickPending: false,
+            isScalebarRefNameMenuOpen: false,
             /**
              * #volatile
              * temporary vertical guides that can be set by displays (e.g., LD display hover)
@@ -408,6 +460,13 @@ export function stateModelFactory(pluginManager) {
         };
     })
         .views(self => ({
+        /**
+         * #getter
+         * `axis.grid`: whether the ruler's ticks run down through the tracks.
+         */
+        get axisGrid() {
+            return readConfObject(self.axis, 'grid');
+        },
         // The viewport in pixels, derived from the window it frames — declared
         // ahead of every other getter so that the ~300 reads of `self.bpPerPx` /
         // `self.offsetPx` across the codebase go on resolving by name. Only the
@@ -444,6 +503,14 @@ export function stateModelFactory(pluginManager) {
             const { bpPerPx } = this;
             return bpPerPx <= 0 ? 0 : self.windowStartBp / bpPerPx;
         },
+        /**
+         * #getter
+         * a displayed region narrower than this many pixels draws as an elided
+         * block
+         */
+        get minimumBlockWidth() {
+            return MINIMUM_BLOCK_WIDTH;
+        },
         /**
          * #getter
          * scroll-to-zoom is a global, personal preference resolved from the
@@ -505,6 +572,14 @@ export function stateModelFactory(pluginManager) {
             const { assemblyManager } = getSession(self);
             return this.assemblyNames.map(a => assemblyManager.getDisplayName(a));
         },
+        /**
+         * #getter
+         * the session's highlights on this view's assemblies
+         */
+        get highlights() {
+            const { highlights, assemblyManager } = getSession(self);
+            return highlightsOnAssemblies(highlights, this.assemblyNames, assemblyManager);
+        },
         /**
          * #getter
          * checking if lgv is a 'top-level' view is used for toggling pin track
@@ -531,8 +606,23 @@ export function stateModelFactory(pluginManager) {
         .views(self => ({
         /**
          * #getter
-         * Assembly-name prefix for the scalebar refName labels, or undefined for
-         * none. A container view (e.g. LinearSyntenyView) opts its sub-views in by
+         * The census entry for this view: the tracks it holds itself. Declared
+         * rather than derived — see `BaseViewModel.ownTracks`.
+         */
+        get ownTracks() {
+            return [...self.tracks];
+        },
+        /**
+         * #getter
+         * See `BaseViewModel.rendersDisplays`.
+         */
+        get rendersDisplays() {
+            return !self.scalebarOnly;
+        },
+        /**
+         * #getter
+         * Assembly name captioning the scalebar ahead of its refName labels, or
+         * undefined for none. A container view (e.g. LinearSyntenyView) opts its sub-views in by
          * exposing showAssemblyNameInSubviewScalebar; duck-typed rather than
          * matching a concrete view type so no upward plugin dependency is needed
          * and any container can opt in. A wrong nesting depth simply yields no
@@ -579,10 +669,23 @@ export function stateModelFactory(pluginManager) {
          * and error checks resolve it directly through here.
          */
         get initAssembly() {
-            return self.pendingLaunch
-                ? getSession(self).assemblyManager.get(self.pendingLaunch.assembly)
+            const name = this.launchAssemblyName;
+            return self.pendingLaunch && name !== undefined
+                ? getSession(self).assemblyManager.get(name)
                 : undefined;
         },
+        /**
+         * #getter
+         * The assembly a pending launch is for: the one it names, else the one
+         * the view already shows. A re-launch of a materialized view (a
+         * `jb.setSession` document writing `loc` beside the built state) need
+         * not restate it; without the default the readiness gate waited on
+         * `assemblyManager.get(undefined)` for good. Undefined on a fresh view
+         * whose blob names none, which `error` reports.
+         */
+        get launchAssemblyName() {
+            return self.pendingLaunch?.assembly ?? self.assemblyNames[0];
+        },
         /**
          * #getter
          */
@@ -616,35 +719,11 @@ export function stateModelFactory(pluginManager) {
         },
         /**
          * #getter
-         * What the spinner says. The assembly reports which of its files it is
-         * downloading, so this is "Downloading chromosome aliases" rather than a bare
-         * "Loading" for the part of startup that actually takes time. Falls back
-         * once the assembly is loaded and the remaining wait is the init autorun's
-         * own navigation, which is local.
-         */
-        get loadingMessage() {
-            return this.showLoading
-                ? this.loadingAssembly?.statusMessage || 'Loading'
-                : undefined;
-        },
-        /**
-         * #getter
-         * Determinate fraction for the spinner's bar, when the assembly load
-         * reports one (a whole-file download with a Content-Length)
+         * The loading screen's text while `showLoading`, taken from the
+         * assembly being waited on; undefined otherwise.
          */
-        get loadingProgress() {
-            return this.showLoading
-                ? this.loadingAssembly?.statusProgress
-                : undefined;
-        },
-        /**
-         * #getter
-         * The URL the assembly load is currently fetching, when the phase named
-         * one. Only the stalled-load notice reads it — see
-         * {@link ViewLoadingScreen}.
-         */
-        get loadingSource() {
-            return this.showLoading ? this.loadingAssembly?.statusSource : undefined;
+        get loading() {
+            return viewLoading(this.showLoading, () => this.loadingAssembly);
         },
         /**
          * #getter
@@ -695,12 +774,12 @@ export function stateModelFactory(pluginManager) {
          * `width`/`staticBlocks` throw by design before the view has been
          * measured and navigated.
          *
-         * **Not `initialized`**, which is the trap this getter exists to close.
+         * Use this getter rather than `initialized`.
          * That one answers "have the assembly's regions loaded", which is only
          * the first of two async steps: navigating then populates
          * `displayedRegions`, and in the window between the two `initialized` is
          * already true while there is still nothing on screen. `showLoading`
-         * folds in `awaitingInitNavigation`, the getter that exists for exactly
+         * folds in `awaitingInitNavigation`, the getter for exactly
          * that gap.
          *
          * `error` is the third outcome and is why this is not a bare
@@ -723,12 +802,7 @@ export function stateModelFactory(pluginManager) {
             return computeViewStatus({
                 error: this.error,
                 hasSomethingToShow: this.hasSomethingToShow,
-                loading: () => this.showLoading
-                    ? {
-                        message: this.loadingMessage ?? 'Loading',
-                        progress: this.loadingProgress,
-                    }
-                    : undefined,
+                loading: () => this.loading,
             });
         },
         /**
@@ -758,14 +832,10 @@ export function stateModelFactory(pluginManager) {
          * #getter
          * A track's full cost beyond its display height.
          *
-         * The track *label* is not counted, and cannot be: an offset label is an
-         * in-flow box whose height is whatever the theme renders a Paper of icon
-         * buttons at — 31.140625px on the stock theme, and not a number this file
-         * can derive. So these getters are exact while labels are hidden or
-         * overlapping, and short by one label box per labelled track otherwise.
-         * Anything needing the offset to the pixel with labels showing measures
-         * the DOM; `BreakpointSplitViewOverlay` does, and falls back to this
-         * arithmetic only for a track with no mounted div.
+         * The track *label* is not counted here: an offset label is an in-flow
+         * box whose height is whatever the theme renders a Paper of icon buttons
+         * at, so it is measured into `trackLabelBands` per track and added by
+         * `trackLabelBand` rather than derived.
          */
         get trackChromeHeight() {
             return this.trackLeadingChrome + this.trackTrailingChrome;
@@ -784,28 +854,9 @@ export function stateModelFactory(pluginManager) {
                 return HEADER_BAR_HEIGHT + HEADER_OVERVIEW_HEIGHT;
             }
         },
-        /**
-         * #getter
-         * Where the scalebar pins when the view's chrome is sticky: everything
-         * stacked above it, which is the view's own title bar plus this view's
-         * header. Expressed from `headerHeight` rather than re-summing its
-         * constants — the two are the same box, and a second spelling of the sum
-         * is free to drift from the first while both typecheck.
-         */
-        get rubberbandTop() {
-            return self.stickyViewHeaders
-                ? VIEW_HEADER_HEIGHT + this.headerHeight
-                : 0;
-        },
-        /**
-         * #getter
-         */
-        get pinnedTracksTop() {
-            return this.rubberbandTop + this.scalebarHeight;
-        },
         /**
          * #method
-         * rendered height of a single track, collapsing to a fixed height when
+         * rendered height of a single track, using a fixed height when
          * minimized. Shared by trackHeights and getTrackYOffset so the two can't
          * disagree. Reads `activeDisplay` — the display TrackContainer actually
          * mounts — rather than re-picking `displays[0]`, so the view's height math
@@ -816,6 +867,14 @@ export function stateModelFactory(pluginManager) {
                 ? MINIMIZED_TRACK_HEIGHT
                 : track.activeDisplay.height;
         },
+        /**
+         * #method
+         * the measured in-flow label band above a track's rendering container,
+         * 0 until TrackContainer has measured one or when no label is in flow
+         */
+        trackLabelBand(track) {
+            return self.trackLabelBands.get(track.configuration.trackId) ?? 0;
+        },
         /**
          * #getter
          */
@@ -826,7 +885,9 @@ export function stateModelFactory(pluginManager) {
          * #getter
          */
         get trackHeightsWithChrome() {
-            return this.trackHeights + self.tracks.length * this.trackChromeHeight;
+            return (this.trackHeights +
+                self.tracks.length * this.trackChromeHeight +
+                sum(self.tracks.map(t => this.trackLabelBand(t))));
         },
         /**
          * #getter
@@ -835,7 +896,22 @@ export function stateModelFactory(pluginManager) {
             if (self.scalebarOnly) {
                 return this.headerHeight + this.scalebarHeight;
             }
-            return (this.trackHeightsWithChrome + this.headerHeight + this.scalebarHeight);
+            return (this.trackHeightsWithChrome +
+                this.headerHeight +
+                this.scalebarHeight +
+                (self.tracks.length && self.isTopLevelView
+                    ? RESIZE_ALL_HANDLE_HEIGHT
+                    : 0));
+        },
+        /**
+         * #getter
+         * The display height of each track a whole-stack resize moves, by track
+         * instance id: every shown track that is not minimized.
+         */
+        get resizableTrackHeights() {
+            return new Map(self.tracks
+                .filter(t => !t.minimized)
+                .map(t => [t.id, t.activeDisplay.height]));
         },
         /**
          * #method
@@ -844,20 +920,27 @@ export function stateModelFactory(pluginManager) {
          * first, then unpinned), from the same constants TrackContainer lays its
          * Paper out with. Returns `undefined` if the track is not present.
          *
-         * Exact while track labels are hidden or overlapping. With an offset
-         * label the answer is short by one label box per labelled track above
-         * this one — see `trackChromeHeight` for why that box is not derivable
-         * here.
+         * Includes each track's measured label band, this track's own included,
+         * since an in-flow label sits above the rendering container inside the
+         * same Paper. Exact once TrackContainer has measured; before that it is
+         * short by the unmeasured bands.
          */
         getTrackYOffset(trackId) {
+            return this.trackYOffsets.get(trackId);
+        },
+        /**
+         * #getter
+         * `getTrackYOffset` for every shown track, by trackId, from one walk
+         */
+        get trackYOffsets() {
+            const offsets = new Map();
             let y = this.headerHeight + this.scalebarHeight + this.trackLeadingChrome;
             for (const t of [...self.pinnedTracks, ...self.unpinnedTracks]) {
-                if (t.configuration.trackId === trackId) {
-                    return y;
-                }
+                y += this.trackLabelBand(t);
+                offsets.set(t.configuration.trackId, y);
                 y += this.trackHeight(t) + this.trackChromeHeight;
             }
-            return undefined;
+            return offsets;
         },
         /**
          * #method
@@ -883,24 +966,22 @@ export function stateModelFactory(pluginManager) {
             if (this.totalBp === 0 || self.width === 0) {
                 return 1;
             }
-            // Floor at minBpPerPx so tiny displayed regions (totalBp small enough
-            // that the fill-scaled ratio drops below MIN_BP_PER_PX) can't produce
-            // maxBpPerPx < minBpPerPx, which would invert the zoom-slider bounds
-            // and the clamp() range in zoomTo.
-            return Math.max(MIN_BP_PER_PX, this.totalBp / (self.width * SHOW_ALL_REGIONS_FILL));
+            // floored so a tiny region set cannot put maxBpPerPx under
+            // minBpPerPx, which would invert the zoom slider and zoomTo's clamp
+            return Math.max(this.minBpPerPx, this.totalBp / (self.width * SHOW_ALL_REGIONS_FILL));
         },
         /**
          * #getter
-         * The zoom-out limit. This view's own fit, except while a container holds
-         * it on a shared scale coarser than that — a small genome next to a large
-         * one, drawn short so the two compare by length.
+         * The zoom-out limit. Equal to the fit for this view's regions, except
+         * while a container holds it on a coarser shared scale, such as a small
+         * genome next to a large one, drawn short so the two compare by length.
          *
-         * Raising the LIMIT is what makes such a scale survive: written past the
-         * limit instead, it is undone by the first thing that clamps — a wheel
-         * tick, a rubberband, a `setDisplayedRegions` — which is how the dotplot's
-         * locked aspect ratio once turned "zoom out" into a zoom in
-         * (`axisMaxBpPerPx`). Here every route to a zoom clamps against the same
-         * ceiling, so full zoom-out LANDS on the shared scale.
+         * The shared scale raises the limit. A bpPerPx written past the limit
+         * would be undone by the first operation that clamps (a wheel tick, a
+         * rubberband, a `setDisplayedRegions`), as with the dotplot's locked
+         * aspect ratio turning "zoom out" into a zoom in (`axisMaxBpPerPx`).
+         * Every zoom clamps against the same ceiling, so full zoom-out stops at
+         * the shared scale.
          */
         get maxBpPerPx() {
             return Math.max(this.fitBpPerPx, this.sharedFitBpPerPx);
@@ -911,8 +992,8 @@ export function stateModelFactory(pluginManager) {
          * or 0 for a standalone view, a mode that is off, and a stack that cannot
          * answer yet.
          *
-         * Pulled rather than pushed down into a volatile: the number is a
-         * function of every row's fit, all of which move on a resize, and a
+         * A getter rather than a volatile the container writes: the number is a
+         * function of every row's fit, all of which change on a resize, and a
          * stored copy would be stale by the next layout.
          */
         get sharedFitBpPerPx() {
@@ -944,12 +1025,12 @@ export function stateModelFactory(pluginManager) {
                 // hand-authored JSON is what fills it, so the type is not a guarantee.
                 // Naming the authoring mistake beats the downstream symptom, which is
                 // the literal string "Assembly undefined not found".
-                if (!self.pendingLaunch.assembly) {
+                if (!this.launchAssemblyName) {
                     return 'LinearGenomeView init needs an "assembly"';
                 }
                 const asm = this.initAssembly;
                 if (!asm) {
-                    return `Assembly ${self.pendingLaunch.assembly} not found`;
+                    return `Assembly ${this.launchAssemblyName} not found`;
                 }
                 if (asm.error) {
                     return asm.error;
@@ -961,15 +1042,13 @@ export function stateModelFactory(pluginManager) {
          * #getter
          */
         get maxOffset() {
-            // objectively determined to keep the linear genome on the main screen
-            return this.displayedRegionsTotalPx - MAX_OFFSET_PADDING_PX;
+            return offsetBounds(this.displayedRegionsTotalPx, self.width).max;
         },
         /**
          * #getter
          */
         get minOffset() {
-            // objectively determined to keep the linear genome on the main screen
-            return -self.width + MIN_OFFSET_PADDING_PX;
+            return offsetBounds(this.displayedRegionsTotalPx, self.width).min;
         },
         /**
          * #getter
@@ -1014,6 +1093,15 @@ export function stateModelFactory(pluginManager) {
         getActiveDisplayId(trackId) {
             return this.getTrack(trackId)?.activeDisplay.configuration.displayId;
         },
+    }))
+        .actions(self => ({
+        /**
+         * #action
+         * Dismiss the search picker without choosing a place.
+         */
+        closeSearchPicker() {
+            self.searchPicker = undefined;
+        },
     }))
         .actions(self => ({
         /**
@@ -1021,6 +1109,7 @@ export function stateModelFactory(pluginManager) {
          */
         setShowTrackOutlines(arg) {
             self.showTrackOutlines = arg;
+            localStorageSetBoolean('lgv-showTrackOutlines', arg);
         },
         /**
          * #action
@@ -1031,38 +1120,69 @@ export function stateModelFactory(pluginManager) {
         /**
          * #action
          */
-        setColorByCDS(flag) {
-            self.colorByCDS = flag;
+        setColorByFrame(flag) {
+            self.colorByFrame = flag;
+            localStorageSetBoolean('lgv-colorByFrame', flag);
         },
         /**
          * #action
          */
         setShowAminoAcids(flag) {
             self.showAminoAcids = flag;
+            localStorageSetBoolean('lgv-showAminoAcids', flag);
         },
         /**
          * #action
          */
         setShowCytobands(flag) {
             self.showCytobands = flag;
+            localStorageSetBoolean('lgv-showCytobands', flag);
+        },
+        /**
+         * #action
+         */
+        setTrackLabelBand(trackId, band) {
+            if (band === 0) {
+                self.trackLabelBands.delete(trackId);
+            }
+            else {
+                self.trackLabelBands.set(trackId, band);
+            }
+        },
+        /**
+         * #action
+         */
+        setScrollPortExcess(px) {
+            self.scrollPortExcess = px;
+        },
+        /**
+         * #action
+         * Grow or shrink every unminimized track by `distance` px in all, each
+         * by its share of the height it has above the display minimum. `from` is
+         * the heights to scale, by track instance id; a drag passes the heights
+         * it started with, so whole-pixel rounding does not compound frame by
+         * frame. Returns how far the stack moved.
+         */
+        resizeTracks(distance, from = self.resizableTrackHeights) {
+            const tracks = self.tracks.filter(t => !t.minimized && from.has(t.id));
+            const start = tracks.map(t => from.get(t.id));
+            const next = scaleBandHeights(start, distance, MIN_DISPLAY_HEIGHT);
+            for (const [i, track] of tracks.entries()) {
+                const display = track.activeDisplay;
+                const delta = next[i] - display.height;
+                if (delta !== 0) {
+                    display.resizeHeight(delta);
+                }
+            }
+            return sum(next) - sum(start);
         },
         /**
          * #action
+         * A resize keeps the window in bp, so `bpPerPx` follows the new width
+         * and the view keeps framing the same sequence (ADR-070).
          */
-        // A resize needs no arithmetic: the window is what is stored, so a new
-        // width simply divides into it and `bpPerPx` follows. The view keeps the
-        // sequence it was framing rather than letting the right edge eat into it.
-        //
-        // Keeping the scale instead — which is what storing pixels amounted to —
-        // was a block-cache optimization: block boundaries are
-        // `blockNum * ceil(800 * bpPerPx)` and block keys embed start/end, so
-        // holding bpPerPx across a resize kept every block key, and so every
-        // fetched region, identical. Rescaling makes a resize a zoom, and a zoom
-        // is already a solved case: FetchVisibleRegions' 300ms debounce coalesces
-        // the gesture into one refetch, its in-flight guard caps concurrent
-        // batches at one, and rpcDataMap is overwritten in place rather than
-        // cleared, so nothing blanks (ADR-008, ADR-006).
         setWidth(newWidth) {
+            const unmeasured = self.bpPerPx <= 0;
             self.volatileWidth = newWidth;
             if (newWidth > 0 && self.windowWidthBp <= 0) {
                 // First measure, and nothing has established a window yet: a migrated
@@ -1073,6 +1193,12 @@ export function stateModelFactory(pluginManager) {
                 self.windowWidthBp = (self.legacyBpPerPx || 1) * newWidth;
                 self.legacyBpPerPx = 0;
             }
+            if (unmeasured && self.bpPerPx > 0) {
+                // The debounced coarse autorun is 500ms out; a restored snapshot's
+                // consumers would lay out and fetch at 1 bp/px until then.
+                self.coarseBpPerPx = self.bpPerPx;
+                self.coarseOffsetPx = self.offsetPx;
+            }
         },
         /**
          * #action
@@ -1086,12 +1212,6 @@ export function stateModelFactory(pluginManager) {
         setIsScalebarRefNameMenuOpen(isOpen) {
             self.isScalebarRefNameMenuOpen = isOpen;
         },
-        /**
-         * #action
-         */
-        setScalebarRefNameClickPending(pending) {
-            self.scalebarRefNameClickPending = pending;
-        },
         /**
          * #action
          */
@@ -1119,14 +1239,8 @@ export function stateModelFactory(pluginManager) {
         /**
          * #action
          */
-        setShowGridlines(b) {
-            self.showGridlines = b;
-        },
-        /**
-         * #action
-         */
-        setLabelsVisible(arg) {
-            self.labelsVisible = arg;
+        setAxisGrid(grid) {
+            self.axis = cast({ ...getSnapshot(self.axis), grid });
         },
         /**
          * #action
@@ -1200,18 +1314,49 @@ export function stateModelFactory(pluginManager) {
         },
         /**
          * #action
-         */
-        setSearchResults(searchResults, searchQuery, assemblyName) {
-            getDialogHost(self).queueDialog(handleClose => [
-                SearchResultsDialog,
-                {
-                    model: self,
-                    searchResults,
-                    searchQuery,
-                    handleClose,
-                    assemblyName,
+         * Raise the picker over search results that name more than one place.
+         * @param onPick - where a picked result lands; by default it navigates
+         * there and shows the track its index came from
+         */
+        setSearchResults(searchResults, searchQuery, assemblyName, onPick = result => navToOption({
+            option: result,
+            model: self,
+            assemblyName,
+        })) {
+            const hits = searchHitsOf(self, searchResults, searchQuery, assemblyName, onPick);
+            const picker = {
+                ...hits,
+                pick: async (id) => {
+                    await hits.pick(id);
+                    if (isAlive(self) && self.searchPicker === picker) {
+                        self.closeSearchPicker();
+                    }
                 },
-            ]);
+            };
+            self.searchPicker = picker;
+        },
+        /**
+         * #action
+         * Search the view's assembly by name, for a host listing the hits
+         * itself. A row's `pick` lands as the search box does: it navigates
+         * there and shows the track the hit's index came from.
+         */
+        async search(query, opts) {
+            const assemblyName = self.assemblyNames[0] ?? self.launchAssemblyName;
+            if (!assemblyName) {
+                throw new Error('the view has no assembly to search yet');
+            }
+            const results = await fetchResults({
+                session: getSession(self),
+                queryString: query,
+                assemblyName,
+                signal: opts?.signal,
+            });
+            return searchHitsOf(self, results, query, assemblyName, result => navToOption({
+                option: result,
+                model: self,
+                assemblyName,
+            }));
         },
         /**
          * #action
@@ -1227,6 +1372,16 @@ export function stateModelFactory(pluginManager) {
         },
     }))
         .actions(self => ({
+        /**
+         * #action
+         * Resize every unminimized track so the view is exactly as tall as the
+         * scroll port it sits in. Does nothing until the view has measured one.
+         */
+        fitTracksToWindow() {
+            if (self.scrollPortExcess) {
+                self.resizeTracks(-self.scrollPortExcess);
+            }
+        },
         /**
          * #action
          * showTrack for a track whose display state model may be lazily
@@ -1235,68 +1390,108 @@ export function stateModelFactory(pluginManager) {
         async launchTrack(trackId, initialSnapshot = {}, displayInitialSnapshot = {}, inlineConf) {
             return launchTrackGeneric(self, trackId, initialSnapshot, displayInitialSnapshot, inlineConf);
         },
-    }))
-        .actions(self => ({
         /**
          * #action
+         * Replace the highlights `highlights` reads, each written as the launch
+         * spec's `highlight` writes one: a locstring, or an object whose
+         * `assemblyName` defaults to the view's. Throws on one that names no
+         * region, writing none.
          */
-        moveTrackDown(id) {
-            const section = self.trackSection(id);
-            const idx = section.findIndex(t => t.id === id);
-            if (idx !== -1 && idx < section.length - 1) {
-                this.moveTrack(id, section[idx + 1].id);
-            }
+        setHighlights(highlights) {
+            const session = getSession(self);
+            const assemblyName = self.assemblyNames[0] ?? self.launchAssemblyName ?? '';
+            session.setHighlights(highlights.map(h => {
+                const highlight = coerceHighlight(h, assemblyName, (ref, asm) => session.assemblyManager.isValidRefName(ref, asm ?? assemblyName));
+                if (!highlight) {
+                    throw new Error(`not a region to highlight: ${JSON.stringify(h)}`);
+                }
+                return highlight;
+            }));
         },
         /**
          * #action
+         * Show files from the user's disk as session tracks: one per data file,
+         * beside the index among them that names it, its type guessed from its
+         * name. Adds nothing when one file has no known type. Resolves the new
+         * tracks' ids.
          */
-        moveTrackUp(id) {
-            const section = self.trackSection(id);
-            const idx = section.findIndex(t => t.id === id);
-            if (idx > 0) {
-                this.moveTrack(id, section[idx - 1].id);
-            }
+        async showFiles(files) {
+            return showFiles(self, files);
         },
+    }))
+        .views(self => ({
         /**
-         * #action
+         * #method
+         * The shown track a move action means: the menu passes a track model's
+         * own `id`, an agent passes the `trackId` it knows the track by, and
+         * both name one shown track. Answers the model id, or the argument
+         * unchanged when nothing shown matches, so the move reports it.
          */
-        moveTrackToTop(id) {
-            const section = self.trackSection(id);
-            if (section.length && section[0].id !== id) {
-                this.moveTrack(id, section[0].id);
-            }
+        trackModelId(idOrTrackId) {
+            return ((self.tracks.find(t => t.id === idOrTrackId) ??
+                self.tracks.find(t => t.configuration.trackId === idOrTrackId))?.id ?? idOrTrackId);
         },
-        /**
-         * #action
-         */
-        moveTrackToBottom(id) {
-            const section = self.trackSection(id);
-            const last = section[section.length - 1];
-            if (last && last.id !== id) {
-                this.moveTrack(id, last.id);
+    }))
+        .actions(self => {
+        function shownIndex(idOrTrackId) {
+            const id = self.trackModelId(idOrTrackId);
+            const index = self.tracks.findIndex(track => track.id === id);
+            if (index === -1) {
+                throw new Error(`No shown track has id or trackId "${idOrTrackId}" — the view's tracks are ${self.tracks.map(t => t.configuration.trackId).join(', ') || 'none'}`);
             }
-        },
+            return index;
+        }
         /**
          * #action
-         */
-        moveTrack(movingId, targetId) {
-            const oldIndex = self.tracks.findIndex(track => track.id === movingId);
-            if (oldIndex === -1) {
-                throw new Error(`Track ID ${movingId} not found`);
-            }
-            const newIndex = self.tracks.findIndex(track => track.id === targetId);
-            if (newIndex === -1) {
-                throw new Error(`Track ID ${targetId} not found`);
-            }
-            // direction-aware placement: filtering out oldIndex shifts the target
-            // left by one when dragging down (oldIndex < newIndex), so splicing at
-            // newIndex lands the track *after* the target; dragging up leaves the
-            // target's index intact, landing *before* it. This matches the side
-            // the dragged track approaches from.
+         * Move one shown track to another's position; each is a track model id
+         * or a trackId.
+         */
+        function moveTrack(moving, target) {
+            const oldIndex = shownIndex(moving);
+            const newIndex = shownIndex(target);
+            // splicing at newIndex after removing oldIndex lands a track dragged
+            // down after its target and one dragged up before it
             const tracks = self.tracks.filter((_, idx) => idx !== oldIndex);
             tracks.splice(newIndex, 0, self.tracks[oldIndex]);
             self.tracks = cast(tracks);
-        },
+        }
+        function moveWithinSection(idOrTrackId, pick) {
+            const moving = self.tracks[shownIndex(idOrTrackId)];
+            const section = self.trackSection(moving.id);
+            const target = pick(section, section.indexOf(moving));
+            if (target && target !== moving) {
+                moveTrack(moving.id, target.id);
+            }
+        }
+        return {
+            moveTrack,
+            /**
+             * #action
+             */
+            moveTrackDown(idOrTrackId) {
+                moveWithinSection(idOrTrackId, (section, i) => section[i + 1]);
+            },
+            /**
+             * #action
+             */
+            moveTrackUp(idOrTrackId) {
+                moveWithinSection(idOrTrackId, (section, i) => section[i - 1]);
+            },
+            /**
+             * #action
+             */
+            moveTrackToTop(idOrTrackId) {
+                moveWithinSection(idOrTrackId, section => section[0]);
+            },
+            /**
+             * #action
+             */
+            moveTrackToBottom(idOrTrackId) {
+                moveWithinSection(idOrTrackId, section => section.at(-1));
+            },
+        };
+    })
+        .actions(self => ({
         /**
          * #action
          */
@@ -1315,12 +1510,14 @@ export function stateModelFactory(pluginManager) {
          */
         setTrackLabels(setting) {
             self.trackLabels = setting;
+            localStorageSetItem('lgv-trackLabels', setting);
         },
         /**
          * #action
          */
         setShowCenterLine(b) {
             self.showCenterLine = b;
+            localStorageSetBoolean('lgv-showCenterLine', b);
         },
         /**
          * #action
@@ -1334,8 +1531,9 @@ export function stateModelFactory(pluginManager) {
          * #action
          */
         toggleTrackSelector() {
+            const wasVisible = isTrackSelectorVisible(self);
             const { session, selector } = openTrackSelectorWidget(self);
-            if (isTrackSelectorVisible(self)) {
+            if (wasVisible) {
                 session.hideWidget(selector);
             }
             else {
@@ -1343,39 +1541,6 @@ export function stateModelFactory(pluginManager) {
             }
             return selector;
         },
-        /**
-         * #method
-         * Helper method for the fetchSequence.
-         * Retrieves the corresponding regions that were selected by the
-         * rubberband
-         *
-         * @param leftOffset - `object as {start, end, index, offset}`, offset = start
-         * of user drag
-         * @param rightOffset - `object as {start, end, index, offset}`,
-         * offset = end of user drag
-         * @returns array of Region[]
-         */
-        getSelectedRegions(leftOffset, rightOffset) {
-            if (!leftOffset || !rightOffset) {
-                return [];
-            }
-            const layout = {
-                displayedRegions: self.displayedRegions,
-                bpPerPx: self.bpPerPx,
-                offsetPx: self.offsetPx,
-                width: self.width,
-                minimumBlockWidth: self.minimumBlockWidth,
-            };
-            const { bpPerPx, offsetPx: rawOffsetPx } = computeMoveToLayout(layout, leftOffset, rightOffset);
-            // mirror Base1DView.scrollTo clamping: raw offsetPx can be far outside
-            // the valid range when both offsets are oob on the same side
-            const offsetPx = clamp(rawOffsetPx, self.minOffset, self.totalBp / bpPerPx - MAX_OFFSET_PADDING_PX);
-            return wholeBaseRegions(calculateDynamicBlocks({
-                ...layout,
-                bpPerPx,
-                offsetPx,
-            }).contentBlocks);
-        },
         /**
          * #action
          */
@@ -1394,12 +1559,6 @@ export function stateModelFactory(pluginManager) {
                 self.lastTrackDragY = undefined;
             }
         },
-        /**
-         * #action
-         */
-        setLastTrackDragY(y) {
-            self.lastTrackDragY = y;
-        },
         /**
          * #action
          * called while dragging a track over the track at `targetId`; reorders
@@ -1415,7 +1574,7 @@ export function stateModelFactory(pluginManager) {
                     const movingDown = targetIdx > draggingIdx;
                     if (shouldSwapTracks(self.lastTrackDragY, currentY, movingDown)) {
                         self.lastTrackDragY = currentY;
-                        this.moveTrack(draggingTrackId, targetId);
+                        self.moveTrack(draggingTrackId, targetId);
                     }
                 }
             }
@@ -1426,15 +1585,41 @@ export function stateModelFactory(pluginManager) {
         setLaunch(launch) {
             self.launch = launch;
         },
+    }))
+        .views(self => ({
         /**
          * #method
-         * creates an svg export and save using FileSaver
+         * Helper method for the fetchSequence.
+         * Returns the regions the user selected with the
+         * rubberband
+         *
+         * @param leftOffset - `object as {start, end, index, offset}`, offset = start
+         * of user drag
+         * @param rightOffset - `object as {start, end, index, offset}`,
+         * offset = end of user drag
+         * @returns array of Region[]
          */
-        async exportSvg(opts = {}) {
-            const { renderToSvg } = await import('./svgcomponents/SVGLinearGenomeView.js');
-            const html = await renderToSvg(self, opts);
-            const { saveSvgAsImage } = await import('@jbrowse/core/svg/saveSvgAsImage');
-            await saveSvgAsImage(html, opts);
+        getSelectedRegions(leftOffset, rightOffset) {
+            if (!leftOffset || !rightOffset) {
+                return [];
+            }
+            const layout = {
+                displayedRegions: self.displayedRegions,
+                bpPerPx: self.bpPerPx,
+                offsetPx: self.offsetPx,
+                width: self.width,
+                minimumBlockWidth: self.minimumBlockWidth,
+            };
+            const { bpPerPx, offsetPx: rawOffsetPx } = computeMoveToLayout(layout, leftOffset, rightOffset);
+            // mirror Base1DView.scrollTo clamping: raw offsetPx can be far outside
+            // the valid range when both offsets are oob on the same side
+            const { min, max } = offsetBounds(self.totalBp / bpPerPx, self.width);
+            const offsetPx = clamp(rawOffsetPx, min, max);
+            return wholeBaseRegions(calculateDynamicBlocks({
+                ...layout,
+                bpPerPx,
+                offsetPx,
+            }).contentBlocks);
         },
     }))
         .actions(self => {
@@ -1491,8 +1676,8 @@ export function stateModelFactory(pluginManager) {
         }
         /**
          * #action
-         * cancel an in-flight animated zoom. The animation already yields to any
-         * other zoom on its own, so this is for stopping it *without* changing the
+         * cancel an in-flight animated zoom. Any other zoom already stops the
+         * animation, so this is for stopping it *without* changing the
          * zoom — the slider grabbing the thumb, before it has a value to commit.
          */
         function cancelZoomAnimation() {
@@ -1520,25 +1705,26 @@ export function stateModelFactory(pluginManager) {
          * #getter
          * an ideogram only reads correctly against an entire chromosome: on a
          * sub-region it is a meaningless slice of bands, and the centromere shows
-         * up as a lone half-triangle
+         * up as a lone half-triangle. The chromosome also needs bands: a cytoband
+         * file often lists only the main chromosomes, not chrM or the
+         * unplaced scaffolds
          */
         get canShowCytobands() {
-            return this.showsWholeChromosome && this.anyCytobandsExist;
+            const region = self.displayedRegions[0];
+            return (this.showsWholeChromosome &&
+                !!region &&
+                getCytobands(getSession(self).assemblyManager.get(region.assemblyName), region.refName).length > 0);
         },
         /**
          * #getter
          * the `showCytobands` setting gated by whether cytobands can be shown at
-         * all (whole chromosome + data present) — i.e. actually on screen
+         * all (whole chromosome with bands in the cytoband file) and by the header
+         * overview they draw in being on, which the SVG export follows too
          */
         get effectiveShowCytobands() {
-            return this.canShowCytobands && self.showCytobands;
-        },
-        /**
-         * #getter
-         */
-        get anyCytobandsExist() {
-            const { assemblyManager } = getSession(self);
-            return self.assemblyNames.some(a => assemblyManager.get(a)?.cytobands?.length);
+            return (this.canShowCytobands &&
+                self.showCytobands &&
+                !self.hideHeaderOverview);
         },
         /**
          * #getter
@@ -1565,6 +1751,13 @@ export function stateModelFactory(pluginManager) {
         menuItems() {
             return buildMenuItems(self);
         },
+        /**
+         * #method
+         * the view menu's Highlights submenu; extend this to add a row there
+         */
+        highlightsSubMenuItems() {
+            return buildHighlightsSubMenuItems(self);
+        },
         /**
          * #method
          * what a plugin can start from the selected region — a synteny view, a
@@ -1595,7 +1788,6 @@ export function stateModelFactory(pluginManager) {
         let coverageRightPx = 0;
         let prevBpPerPx;
         let prevWidth;
-        let prevMinimumBlockWidth;
         let prevDisplayedRegions;
         return {
             /**
@@ -1607,16 +1799,13 @@ export function stateModelFactory(pluginManager) {
              * blocks to render their data for the region represented by the block
              */
             get staticBlocks() {
-                const { offsetPx, bpPerPx, width, minimumBlockWidth, displayedRegions, } = self;
+                const { offsetPx, bpPerPx, width, displayedRegions } = self;
                 // Fast path: if only offsetPx changed and viewport is still within
                 // the coverage range of existing blocks, skip the expensive
-                // calculateStaticBlocks call entirely. minimumBlockWidth is read here
-                // (not just in calculateStaticBlocks) so MobX still invalidates this
-                // computed if it changes while the viewport stays within coverage.
+                // calculateStaticBlocks call entirely.
                 if (currentlyCalculatedStaticBlocks !== undefined &&
                     bpPerPx === prevBpPerPx &&
                     width === prevWidth &&
-                    minimumBlockWidth === prevMinimumBlockWidth &&
                     displayedRegions === prevDisplayedRegions &&
                     offsetPx >= coverageLeftPx &&
                     offsetPx + width <= coverageRightPx) {
@@ -1625,16 +1814,13 @@ export function stateModelFactory(pluginManager) {
                 const newBlocks = calculateStaticBlocks(self);
                 // Hand back the previous BlockSet when the recompute produced the same
                 // blocks, so a sideways scroll past the coverage edge doesn't re-render
-                // every track. minimumBlockWidth is part of the guard because block
-                // keys don't encode ContentBlock-vs-ElidedBlock, so a region can flip
-                // type with an unchanged key. Geometry is compared first: on a zoom it
-                // always differs, which skips the key walk entirely — the whole-genome
-                // view has one block per refName, so joining those keys into a string
-                // (as this used to) allocated an array and a string per zoom frame.
+                // every track. Geometry is compared first: on a zoom it always
+                // differs, which skips the key walk entirely — the whole-genome view
+                // has one block per refName, so joining those keys into a string (as
+                // this used to) allocated an array and a string per zoom frame.
                 if (currentlyCalculatedStaticBlocks === undefined ||
                     bpPerPx !== prevBpPerPx ||
                     width !== prevWidth ||
-                    minimumBlockWidth !== prevMinimumBlockWidth ||
                     !sameBlockKeys(currentlyCalculatedStaticBlocks, newBlocks)) {
                     currentlyCalculatedStaticBlocks = newBlocks;
                 }
@@ -1650,16 +1836,14 @@ export function stateModelFactory(pluginManager) {
                 }
                 prevBpPerPx = bpPerPx;
                 prevWidth = width;
-                prevMinimumBlockWidth = minimumBlockWidth;
                 prevDisplayedRegions = displayedRegions;
                 return currentlyCalculatedStaticBlocks;
             },
             /**
              * #getter
              * dynamic blocks represent the exact coordinates of the currently
-             * visible genome regions on the screen. they are similar to static
-             * blocks, but static blocks can go offscreen while dynamic blocks
-             * represent exactly what is on screen
+             * visible genome regions on the screen. Static blocks can go
+             * offscreen, while dynamic blocks represent exactly what is on screen
              */
             get dynamicBlocks() {
                 return calculateDynamicBlocks(self);
@@ -1701,12 +1885,10 @@ export function stateModelFactory(pluginManager) {
              * The frame exists because those three are laid out across every
              * displayed region rather than across the viewport — it overhangs on
              * both sides — so their `x` values are stable under a scroll and only
-             * this number moves. `scalebarRefNameLabels` is the exception and says
-             * so: its `transform` is already a screen x, because a sticky label's
+             * this number moves. `scalebarRefNameLabels` is the exception: its `transform` is already a screen x, because a sticky label's
              * position is a function of the scroll rather than of block geometry.
              *
-             * **The subtraction must happen here, in float64, and that is the
-             * load-bearing part.** `offsetPx` is a whole-genome pixel coordinate —
+             * **The subtraction must happen here, in float64.** `offsetPx` is a whole-genome pixel coordinate —
              * hg38 chr1 at base resolution is already past 1e10 — and a length that
              * size does not survive the trip through CSS: the transform matrix is
              * float32 by the time it reaches the compositor, where consecutive
@@ -1718,13 +1900,12 @@ export function stateModelFactory(pluginManager) {
              * assemblies at high zoom, which is not where anyone tests. Both
              * operands here are large and their difference is bounded by the
              * overhang (a block or two), so what reaches CSS is small and exact.
-             * Same rule as the GPU side, one layer up —
+             * This applies the GPU side's rule one layer up; see
              * `agent-docs/reference/BP_PRECISION.md`.
              *
              * Published because it is the one piece of coordinate arithmetic a host
              * drawing its own chrome would otherwise have to know, and because
-             * having it written out at each call site is how the two in-tree copies
-             * came to disagree about rounding. Round it where the content is text
+             * copies written out at each call site disagree about rounding. Round it where the content is text
              * (a fractional offset blurs a label); leave it alone for paths and
              * boxes.
              */
@@ -1739,21 +1920,12 @@ export function stateModelFactory(pluginManager) {
              * than recomputing the makeTicks loop per component.
              */
             get gridlineTicks() {
-                const { bpPerPx } = self;
                 const { blocks, offsetPx: firstBlockOffset } = this.staticBlocks;
-                const ticks = [];
-                // iterate merged region runs (like scalebarLabels) so a tick on an
-                // internal ~800px chunk boundary isn't emitted twice (once as a
-                // chunk's right edge, once as the next chunk's left edge)
-                for (const run of groupContiguousBlocks(blocks)) {
-                    const runLeft = run.offsetPx - firstBlockOffset;
-                    for (const { type, x } of makeBlockTicks(run, bpPerPx)) {
-                        if (x >= 0 && x <= run.widthPx) {
-                            ticks.push({ x: runLeft + x, major: type === 'major' });
-                        }
-                    }
-                }
-                return ticks;
+                return getGridlineTicks({
+                    blocks,
+                    firstBlockOffset,
+                    bpPerPx: self.bpPerPx,
+                });
             },
             /**
              * #getter
@@ -1771,33 +1943,13 @@ export function stateModelFactory(pluginManager) {
              * reads as the same number repeated across the row.
              */
             get scalebarLabels() {
-                const { bpPerPx } = self;
                 const { blocks, offsetPx: firstBlockOffset } = this.staticBlocks;
-                const labels = [];
-                const runs = groupContiguousBlocks(blocks);
-                const refNameLabelPx = runRefNameLabelPx(runs, self.displayedRegionsOrientation);
-                for (const [i, run] of runs.entries()) {
-                    const runLeft = run.offsetPx - firstBlockOffset;
-                    const runLabels = [];
-                    for (const { base, x } of makeBlockTicks(run, bpPerPx, true, false)) {
-                        const label = getTickDisplayStr(base + 1, bpPerPx);
-                        const w = tickLabelWidth(label);
-                        // the bold refName label pinned at the run's left edge takes
-                        // precedence, as it does on the overview scalebar
-                        if (x - w / 2 >= refNameLabelPx[i] &&
-                            labelFitsInBlock(x - w / 2, w, run.widthPx)) {
-                            runLabels.push({
-                                x: runLeft + x,
-                                label,
-                                key: `${run.offsetPx}-${base}`,
-                            });
-                        }
-                    }
-                    if (tickLabelsWorthDrawing(runLabels.length)) {
-                        labels.push(...runLabels);
-                    }
-                }
-                return labels;
+                return getScalebarLabels({
+                    blocks,
+                    firstBlockOffset,
+                    bpPerPx: self.bpPerPx,
+                    orientation: self.displayedRegionsOrientation,
+                });
             },
             /**
              * #getter
@@ -1806,11 +1958,11 @@ export function stateModelFactory(pluginManager) {
              * sticky, transform, maxWidth, paddingLeft, text}` each. One per run of
              * same-refName regions, plus a "sticky" one pinned to the viewport's
              * left edge naming the refName under it, so panning into a chromosome
-             * does not scroll its own name off the screen.
+             * does not scroll the chromosome's name off the screen.
              *
-             * Three rules live in here that a host drawing region names will
-             * otherwise rediscover the hard way, and two of them are invisible until
-             * the data is awkward:
+             * This getter applies three rules that a host drawing region names would
+             * otherwise have to rediscover, and two of them are invisible until the
+             * data is awkward:
              *
              * - the sticky label rides the rightmost run that has scrolled off the
              *   left, not the region's first block — that one is gone from
@@ -1822,7 +1974,7 @@ export function stateModelFactory(pluginManager) {
              *   is fitted to the whole run, and `displayedRegionIndex` /
              *   `lastDisplayedRegionIndex` bracket what it stands for.
              * - a name is drawn whole or not at all, measured against the space its
-             *   run leaves. Clipped to its own width, `chr16` reads as `chr1` —
+             *   run leaves. Clipped to that space, `chr16` reads as `chr1` —
              *   a different chromosome rather than a shortened name, which is why
              *   this is a fit test rather than an ellipsis.
              *
@@ -1838,10 +1990,11 @@ export function stateModelFactory(pluginManager) {
              * into that through `scalebarDisplayPrefix`) and whether it is flipped.
              * A ` [rev]` there is a fact about the ROW; the same marker on a
              * chromosome name means that one region, which only happens under mixed
-             * orientation. `captionSpanPx` is the width it takes, which the
-             * coordinate numbers stay out from under. The SVG export deliberately
+             * orientation. `captionSpanPx` is the width it takes: the sticky label
+             * pins to its right edge rather than the viewport's, and the coordinate
+             * numbers stay out from under it. The SVG export deliberately
              * calls `getScalebarRefNameLabels` itself with no prefix rather than
-             * reading this, since it draws its own assembly name above the ruler.
+             * reading this, since it draws the assembly name itself above the ruler.
              */
             get scalebarRefNameLabels() {
                 return getScalebarRefNameLabels({
@@ -1856,36 +2009,36 @@ export function stateModelFactory(pluginManager) {
              * Every span along the row that is not track data, as plain geometry in
              * the staticBlocks frame — the same frame as gridlineTicks and
              * scalebarLabels, so one `translateX(staticBlocksTranslateX)` places all
-             * three. Three kinds, and a host drawing its own chrome needs all of
-             * them:
+             * three. A host that draws the row's chrome itself needs all three kinds:
              *
              * - `seam`: the 3px bar at a region's right edge. Displayed regions are
-             *   laid out **contiguously** — calculateStaticBlocks emits boundary
-             *   padding only before the first region and after the last — so this
+             *   laid out **contiguously** (calculateStaticBlocks emits boundary
+             *   padding only before the first region and after the last), so this
              *   bar is the only thing separating two of them. Without it a
-             *   two-region view reads as a one-region view scrolled somewhere
-             *   strange. `isRightEndOfDisplayedRegion` is what marks it, and the
-             *   right edge of the blocks currently *loaded* — which is what block
-             *   geometry hands you — is not the same filter.
+             *   two-region view looks like a single region.
+             *   `isRightEndOfDisplayedRegion` marks it; the right edge of the
+             *   currently *loaded* blocks, which block geometry gives you, is a
+             *   different set.
              * - `elided`: a region too narrow to draw at this zoom. Whole-genome on
-             *   a real assembly is mostly these — hg38 has 455 sequences and all
-             *   but the 24 chromosomes land sub-pixel — so a host that skips them
-             *   renders that tail as nothing at all.
+             *   a real assembly is mostly these (hg38 has 455 sequences, and all
+             *   but the 24 chromosomes are under a pixel wide), so a host that
+             *   skips them leaves that part of the row empty.
              * - `boundary`: past the start of the first region or the end of the
-             *   last. Greying it is what makes the last region's seam read as the
-             *   edge of a filled area rather than a rule floating in the track.
+             *   last. Greying it makes the last region's seam read as the edge of a
+             *   filled area, where it would otherwise look like a line in the
+             *   middle of the track.
              *
-             * Elided blocks get no seam even though they carry the flag: at the
-             * zoom where regions elide, one bar per region is a solid grey wall.
+             * Elided blocks get no seam even though they have the flag: at the
+             * zoom where regions elide, one bar per region would fill the row solid
+             * grey.
              *
-             * PaddingBlocks is the in-tree consumer. The SVG export is deliberately
-             * NOT one: `SVGRegionSeparators` walks dynamicBlocks itself and draws
-             * only the seam, because `elided` and `boundary` are chrome for an
-             * interactive row rather than information a figure carries — striped
-             * grey saying "regions here are too narrow to draw" is noise in a
-             * static image, and at whole-genome zoom it would be most of the row.
-             * The seam is the one that must survive: regions lay out contiguously,
-             * so it is all that separates two of them.
+             * PaddingBlocks is the in-tree consumer. The SVG export does not use
+             * it: `SVGRegionSeparators` walks dynamicBlocks itself and draws only
+             * the seam, because `elided` and `boundary` mark state for an
+             * interactive row. In a static figure the striped grey would cover most
+             * of the row at whole-genome zoom. The export keeps the seam because
+             * regions lay out contiguously and the seam is all that separates two
+             * of them.
              */
             // Annotated with the shape spelled out rather than as `PaddingSpan`,
             // because the API doc's type column is where a host drawing its own
@@ -1894,38 +2047,7 @@ export function stateModelFactory(pluginManager) {
             // cannot drift without failing here.
             get paddingSpans() {
                 const { blocks, offsetPx: firstBlockOffset } = this.staticBlocks;
-                const spans = [];
-                for (const block of blocks) {
-                    const x = block.offsetPx - firstBlockOffset;
-                    if (block.type === 'ContentBlock') {
-                        if (block.isRightEndOfDisplayedRegion) {
-                            spans.push({
-                                key: `${block.key}-sep`,
-                                x: x + block.widthPx - 1,
-                                width: 3,
-                                kind: 'seam',
-                            });
-                        }
-                    }
-                    else {
-                        spans.push({
-                            key: block.key,
-                            x,
-                            width: block.widthPx,
-                            kind: block.type === 'ElidedBlock'
-                                ? 'elided'
-                                : 'boundary',
-                        });
-                    }
-                }
-                // One shared array when there is nothing to draw, so the computed's
-                // value repeats and MobX's `===` stops the chain here. This is the
-                // COMMON case, not an edge one: a view sitting inside one contig has
-                // no region seam, no elision and no boundary, and that is where a
-                // reader spends nearly all of a session. A fresh `[]` each frame
-                // instead re-rendered a PaddingBlocks per track plus one for the
-                // container, every frame of every gesture, to draw nothing.
-                return spans.length > 0 ? spans : NO_PADDING_SPANS;
+                return getPaddingSpans(blocks, firstBlockOffset);
             },
             /**
              * #getter
@@ -1957,8 +2079,8 @@ export function stateModelFactory(pluginManager) {
              * viewport. False both when the view holds no regions at all and when
              * it holds some but is scrolled entirely off them; either way there is
              * no visible span for the scalebar, ruler and refName labels to
-             * describe, which is what the SVG export's header checks before drawing
-             * one. Distinct from `hasDisplayedRegions`, which only asks whether the
+             * describe. The SVG export checks it before drawing its header.
+             * Distinct from `hasDisplayedRegions`, which only asks whether the
              * view has been given regions, not whether any are on screen.
              */
             get hasVisibleContent() {
@@ -1998,7 +2120,7 @@ export function stateModelFactory(pluginManager) {
             /**
              * #getter
              * Right edge (px, viewport-relative) of the on-screen content, clamped
-             * to the track — where a right-pinned overlay such as a wiggle's colour
+             * to the track — where a right-pinned overlay such as a wiggle's color
              * or score legend belongs, rather than out in the empty gutter the
              * regions can leave at whole-genome zoom. `@jbrowse/display-kit`'s
              * `contentRightEdgePx` states the rule; an SVG export applies the same
@@ -2008,7 +2130,7 @@ export function stateModelFactory(pluginManager) {
              * array of fresh objects on every pan and zoom frame, so a component
              * that derived this number itself re-rendered on every frame of every
              * gesture — to produce, whenever content fills the track, the unchanged
-             * `trackWidthPx`. Reading the scalar lets MobX's `===` stop the chain at
+             * `trackWidthPx`. A component that reads the scalar lets MobX's `===` stop the chain at
              * this computed instead. Measured over 20 zoom frames: the wiggle
              * family's three body instances fell from 66 renders to 7.
              */
@@ -2060,23 +2182,22 @@ export function stateModelFactory(pluginManager) {
             },
             /**
              * #getter
-             * **What a debounced consumer clips to**: the coarse blocks once the
-             * view has settled at least once, the live ones before that.
+             * **The blocks a debounced consumer clips to**: the coarse blocks once
+             * the view has settled at least once, the live ones before that.
              *
-             * The coarse blocks exist so a per-bp scan does not recompute on every
-             * animation frame during a pan or zoom — wiggle's autoscale domain, the
-             * alignments coverage scale and MAF's coverage band are the three — and
-             * while they are stale
-             * the answer is merely a frame or two old, which is what the debounce
-             * means. **Empty is different in kind.** A scan over no blocks yields no
-             * entries, and no entries is not a stale domain, it is the fallback one:
-             * `[0,1]`, which draws a line plot blank and a density plot saturated.
-             * That window is the 500ms between a view initializing and the coarse
-             * autorun's first run, and data can now land inside it — the per-region
-             * fetch used to be trailing-edge at 600ms, so it never did.
+             * The coarse blocks stop a per-bp scan from recomputing on every
+             * animation frame during a pan or zoom. Wiggle's autoscale domain, the
+             * alignments coverage scale and MAF's coverage band use them. While the
+             * coarse blocks are stale the result is a frame or two old, as the
+             * debounce intends. **Empty coarse blocks are a different case.** A scan
+             * over no blocks yields no entries, and the consumer falls back to the
+             * domain `[0,1]`, which draws a line plot blank and a density plot
+             * saturated. The coarse blocks are empty for the 500ms between a view
+             * initializing and the coarse autorun's first run, and data can load
+             * within that window.
              *
-             * One recompute at that transition, against N per frame, which is the
-             * trade the guard was making anyway.
+             * Falling back to the live blocks costs one extra recompute at that
+             * transition, compared with N per frame without the debounce.
              */
             get settledDynamicBlocks() {
                 return self.coarseDynamicBlocks.length
@@ -2100,7 +2221,7 @@ export function stateModelFactory(pluginManager) {
              * #getter
              */
             get effectiveTotalBp() {
-                return self.bpPerPx * self.width;
+                return self.windowWidthBp;
             },
             /**
              * #getter
@@ -2130,6 +2251,9 @@ export function stateModelFactory(pluginManager) {
                 self.coarseTotalBp = blocks.totalBp;
                 self.coarseBpPerPx = bpPerPx;
             }
+            // on every call, since a scroll through the padding before the first
+            // region moves the viewport and leaves the blocks the same
+            self.coarseOffsetPx = self.offsetPx;
         },
     }))
         .actions(self => ({
@@ -2140,7 +2264,7 @@ export function stateModelFactory(pluginManager) {
          *
          * The coarse blocks are a 500ms throttle, and every consumer trades
          * freshness for not recomputing per animation frame — the location box,
-         * canvas's on-screen feature set, and the two per-bp scans behind
+         * the feature display's on-screen feature set, and the two per-bp scans behind
          * `settledDynamicBlocks`. That trade is only sound while the answer is a
          * few frames old. **A jump makes it unrelated instead**, because there is
          * nothing to coalesce: the viewport left behind is not an approximation of
@@ -2148,17 +2272,16 @@ export function stateModelFactory(pluginManager) {
          * as a navigation that didn't happen, and wiggle's autoscale domain is
          * computed over the window the user just left — measured at `[0,200]`
          * against a correct `[0,300]` when a 40bp coarse window survived a jump to
-         * 4040bp on screen. Only the per-region fetch moving to the leading edge
-         * made that reachable: at 600ms the data never landed inside the hole.
+         * 4040bp on screen.
          *
-         * **The continuous paths deliberately do not come through here.** The
+         * **The continuous paths do not call this.** The
          * spring zoom writes through `zoomTo` per frame and a drag through
          * `scrollTo`, so this adds no per-frame work; the settle is idempotent
          * (`setCoarseDynamicBlocks` compares block keys), so the debounced
-         * autorun's own follow-up run costs nothing.
+         * autorun's follow-up run costs nothing.
          *
-         * Every placer calls it, and `placersSettleCoarseBlocks.test.ts` is what
-         * makes that true of the next one — it scans this file for the writes and
+         * Every placer calls it, and `placersSettleCoarseBlocks.test.ts` enforces
+         * that for the next one: it scans this file for the writes and
          * fails on a placer that reaches neither the settle nor its named list of
          * continuous paths. Two passes by hand missed four.
          */
@@ -2168,6 +2291,42 @@ export function stateModelFactory(pluginManager) {
             }
         },
     }))
+        .actions(self => {
+        function layOutAt(width) {
+            self.setWidth(width);
+            self.settleCoarseBlocks();
+        }
+        return {
+            /**
+             * #method
+             * renders the view to SVG markup, which it returns; saves it through
+             * FileSaver unless `save: false`. A `viewWidth` lays the view out at
+             * that many pixels for the export, as a window that wide would, and
+             * puts the on-screen width back after.
+             */
+            // Promise<string> is stated: renderToSvg is typed against this very
+            // model, so an inferred return makes the type reference itself (TS2456)
+            async exportSvg(opts = {}) {
+                const { width } = self;
+                const { viewWidth = width } = opts;
+                // The on-screen tracks redraw at `viewWidth` until the export ends. A
+                // hidden copy of the view would keep them still, but it needs a
+                // session slot that autosave and undo skip, and new ids for the view,
+                // its tracks and displays, since widgets find them by id.
+                if (viewWidth !== width) {
+                    layOutAt(viewWidth);
+                }
+                try {
+                    return await exportViewSvg(self, opts, () => import('./svgcomponents/SVGLinearGenomeView.js'));
+                }
+                finally {
+                    if (viewWidth !== width) {
+                        layOutAt(width);
+                    }
+                }
+            },
+        };
+    })
         .actions(self => ({
         /**
          * #action
@@ -2183,11 +2342,11 @@ export function stateModelFactory(pluginManager) {
         },
         /**
          * #action
-         * Place the viewport by the pair of PIXEL quantities it used to be stored
-         * as. Prefer `setWindow`: pixels mean nothing without the width they were
+         * Place the viewport by `bpPerPx` and `offsetPx`, the pixel pair the view
+         * stored before it stored the window. Prefer `setWindow`: pixels mean nothing without the width they were
          * measured at, so a round trip through here is only exact while the width
          * holds still. Kept for callers that genuinely have pixels — a wheel
-         * gesture, a rubberband — and for reading old snapshots.
+         * gesture, a rubberband.
          */
         setNewView(bpPerPx, offsetPx) {
             self.zoomTo(bpPerPx);
@@ -2197,7 +2356,7 @@ export function stateModelFactory(pluginManager) {
         /**
          * #action
          * Place the viewport by the pair it is actually STORED as: the window's
-         * width and left edge, both in bp. `setNewView`'s bp-space twin, and the
+         * width and left edge, both in bp. The bp-space counterpart of `setNewView`, and the
          * right one for anything that captures a viewport and puts it back later
          * (an Undo, a saved location) — those two moments can be a window resize
          * apart, and this pair survives one where a pixel pair does not.
@@ -2227,8 +2386,8 @@ export function stateModelFactory(pluginManager) {
         },
         /**
          * #action
-         * The worst jump of them to leave unsettled: the coarse blocks are keyed
-         * by `displayedRegionIndex`, so a set that outlives the region list has a
+         * Settles the coarse blocks, since this is the worst jump to leave
+         * unsettled: they are keyed by `displayedRegionIndex`, so a set that outlives the region list has a
          * consumer reading one contig's data against another's blocks.
          */
         setDisplayedRegions(regions) {
@@ -2238,9 +2397,13 @@ export function stateModelFactory(pluginManager) {
             // [minOffset, maxOffset]. scrollTo is called explicitly rather than
             // left to zoomTo's internal scrollTo, which is skipped when bpPerPx
             // is already in range — shrinking the region set would otherwise
-            // strand the view scrolled past the end, on blank space.
-            self.zoomTo(self.bpPerPx);
-            self.scrollTo(self.offsetPx);
+            // strand the view scrolled past the end, on blank space. An unmeasured
+            // view has no bounds to clamp to, and keeps its window as a restored
+            // snapshot does.
+            if (self.bpPerPx > 0) {
+                self.zoomTo(self.bpPerPx);
+                self.scrollTo(self.offsetPx);
+            }
             self.settleCoarseBlocks();
         },
         /**
@@ -2339,14 +2502,6 @@ export function stateModelFactory(pluginManager) {
         clearView() {
             self.setDisplayedRegions([]);
             self.tracks.clear();
-            // it is necessary to run these after setting displayed regions empty
-            // or else model.offsetPx gets set to Infinity and breaks
-            // @jbrowse/mobx-state-tree snapshot
-            self.scrollTo(0);
-            self.zoomTo(10);
-            // after them, not through setDisplayedRegions, whose own settle ran at
-            // the intermediate viewport these two lines exist to leave
-            self.settleCoarseBlocks();
         },
         /**
          * #action
@@ -2455,8 +2610,7 @@ export function stateModelFactory(pluginManager) {
         // unrelated files lose their parameter types to it.
         async navToLocString(input, optAssemblyName, grow, opts) {
             const { assemblyNames } = self;
-            const session = getSession(self);
-            const { assemblyManager } = session;
+            const { assemblyManager } = getSession(self);
             const assemblyName = optAssemblyName || assemblyNames[0];
             if (assemblyName) {
                 await assemblyManager.waitForAssembly(assemblyName);
@@ -2491,7 +2645,18 @@ export function stateModelFactory(pluginManager) {
                 return;
             }
             const { assemblyManager } = getSession(self);
-            await when(() => self.volatileWidth !== undefined);
+            // A one-sided `volatileWidth !== undefined` parks forever on a view
+            // that never mounts, and `navToMultiLevelBreak` awaits a Promise.all of
+            // these one line before the `whenViewSettled` that was written to cure
+            // exactly that hang. `isAlive` is the second terminal state and the
+            // guard below is what it means. NOT `self.error`, which is a transient
+            // truth (`assembliesNotFound` while a session assembly is registering)
+            // independent of mounting, so it would return without navigating where
+            // waiting would have navigated correctly.
+            await when(() => self.volatileWidth !== undefined || !isAlive(self));
+            if (!isAlive(self) || self.volatileWidth === undefined) {
+                return;
+            }
             // Generate locations from the parsed regions
             const locations = await generateLocations({
                 regions,
@@ -2554,6 +2719,41 @@ export function stateModelFactory(pluginManager) {
         async navToLocation(parsedLocString, assemblyName, grow) {
             return self.navToLocations([parsedLocString], assemblyName, grow);
         },
+        /**
+         * #action
+         * adds the region in view to the session's highlights
+         */
+        highlightCurrentRegion() {
+            const [region] = self.visibleWholeBaseRegions;
+            if (region) {
+                getSession(self).addHighlight(region);
+            }
+        },
+        /**
+         * #action
+         * navigates to a highlight, zoomed out a little for context. Goes through
+         * a locstring so it reaches a refName the view is not displaying
+         */
+        navToHighlight(highlight) {
+            const { assemblyName, ...region } = highlight;
+            return self.navToLocString(assembleLocString(region), assemblyName, 0.2);
+        },
+    }))
+        .actions(self => ({
+        /**
+         * #action
+         * navigates to the most recently added highlight on this view's
+         * assemblies
+         */
+        async navigateNewestHighlight() {
+            const newest = self.highlights.at(-1);
+            if (newest) {
+                await self.navToHighlight(newest);
+            }
+            else {
+                getSession(self).notify('There are no highlights to navigate to.', 'info');
+            }
+        },
     }))
         .views(self => ({
         /**
@@ -2570,14 +2770,29 @@ export function stateModelFactory(pluginManager) {
         },
         /**
          * #method
-         * Map a highlight or bookmark region to its pixel position+width inside
+         * Map a highlight region to its pixel position+width inside
          * the tracks container. Falls back to the raw refName if the region's
          * assemblyName is missing or unknown so highlights authored without an
          * assembly still render in single-assembly views.
          */
         getHighlightCoords(region) {
-            const refName = resolveCanonicalRefName(self, region);
-            return getLayoutHighlightCoords(self, { ...region, refName });
+            return getLayoutHighlightCoords(self, canonicalHighlight(self, region));
+        },
+        /**
+         * #method
+         * y ranges, from the top of the highlight bands, of tracks whose display
+         * sets `drawsGenomicCoordinates` to false; the bands skip them
+         */
+        nonGenomicTrackBands() {
+            const y0 = self.headerHeight + self.scalebarHeight;
+            const { trackYOffsets } = self;
+            return [...self.pinnedTracks, ...self.unpinnedTracks].flatMap(track => {
+                const top = trackYOffsets.get(track.configuration.trackId);
+                return track.activeDisplay.drawsGenomicCoordinates === false &&
+                    top !== undefined
+                    ? [{ top: top - y0, height: self.trackHeight(track) }]
+                    : [];
+            });
         },
         /**
          * #method
@@ -2585,11 +2800,7 @@ export function stateModelFactory(pluginManager) {
          * shifted by the cytoband offset
          */
         getOverviewHighlightCoords(region) {
-            const refName = resolveCanonicalRefName(self, region);
-            const coords = getLayoutHighlightCoords(self.overviewLayout, {
-                ...region,
-                refName,
-            });
+            const coords = getLayoutHighlightCoords(self.overviewLayout, canonicalHighlight(self, region));
             return coords
                 ? { ...coords, left: coords.left + self.cytobandOffset }
                 : undefined;
@@ -2628,6 +2839,17 @@ export function stateModelFactory(pluginManager) {
                 ? this.pxToBp(self.width / 2)
                 : undefined;
         },
+    }))
+        .actions(self => ({
+        /**
+         * #action
+         * a region edit from the ruler's menu as one action, which a synteny
+         * stack's follow reads as the reader's gesture on this row; see
+         * `setDisplayedRegionsKeepingCenter`
+         */
+        editDisplayedRegions(edit) {
+            setDisplayedRegionsKeepingCenter(self, edit);
+        },
     }))
         .views(self => ({
         /**
@@ -2638,11 +2860,10 @@ export function stateModelFactory(pluginManager) {
         },
         /**
          * #method
-         * returns menu items for a highlight context menu. plugins can extend
-         * this via Core-extendPluggableElement to add their own items
+         * a highlight chip's menu rows after Dismiss; extend this to add one
          */
         highlightMenuItems(_highlight) {
-            return [];
+            return highlightListMenuItems(getSession(self), getEnv(self).pluginManager);
         },
     }))
         .actions(self => {
@@ -2656,21 +2877,21 @@ export function stateModelFactory(pluginManager) {
         let heading;
         /**
          * #action
-         * Travel to a window rather than appear in it: the Van Wijk arc from
-         * where the view is to where it is going, played over its own duration.
+         * Animate to a window along the Van Wijk arc from the current window to
+         * the target, over a duration derived from the arc.
          *
-         * WHAT LANDS IS WHAT `setWindow` WOULD HAVE LANDED — only the path in
-         * between is new. That is what lets a caller offer an Undo, a snackbar or
-         * a follow anchor around this exactly as it did around the instant move.
+         * The final state is the one `setWindow` would produce; only the path in
+         * between differs. A caller can therefore offer an Undo, a snackbar or a
+         * follow anchor around this exactly as around the instant move.
          *
-         * It YIELDS to anything else that moves the view, by reading back what it
-         * wrote and stopping the moment the view holds something else: a wheel
-         * zoom, a drag, a locstring nav, or the Undo on the very snackbar the
-         * flight was launched with. Compared against what was WRITTEN rather than
-         * what was asked for, because the write clamps — an arc that pulls back
-         * past `maxBpPerPx` reads its own clamped result back, and treating that
-         * as interference would end the flight one frame in. `springAnimate`
-         * defends the same value the same way.
+         * The flight stops when anything else moves the view: it reads back what
+         * it wrote and stops as soon as the view holds something else, such as a
+         * wheel zoom, a drag, a locstring nav, or the Undo on the snackbar the
+         * flight was launched with. It compares against the written value, not
+         * the requested one, because the write clamps: an arc that pulls back
+         * past `maxBpPerPx` reads back its clamped result, and treating that as
+         * interference would end the flight after one frame. `springAnimate`
+         * handles the same value the same way.
          */
         function flyTo(centerBp, windowWidthBp) {
             cancelLastFlight();
@@ -2737,7 +2958,7 @@ export function stateModelFactory(pluginManager) {
              * `centerAt`'s animated twin: the same destination, reached along the
              * arc instead of jumped to, at the zoom the view is already on.
              */
-            flyToCenter(coord, refName) {
+            flyToCenter(coord, refName, displayedRegionIndex) {
                 // `bpToLinearBp` rather than `bpToPx`, which rounds to a whole pixel
                 // at the current zoom: mid-flight that zoom is a point on somebody
                 // else's arc, and a destination quantized against it moves with it.
@@ -2745,11 +2966,22 @@ export function stateModelFactory(pluginManager) {
                     refName,
                     coord,
                     displayedRegions: self.displayedRegions,
+                    displayedRegionIndex,
                 });
                 if (centerBp !== undefined) {
                     flyTo(centerBp, heading ? heading.windowWidthBp : self.windowWidthBp);
                 }
             },
+            /**
+             * #action
+             * A flight to a linear bp centre at the zoom the view is on, or is
+             * already flying to, widened where that is narrower than `fitWidthBp`.
+             * The current width mid-flight is a point on the arc, so a second
+             * flight read from it would land pulled back.
+             */
+            flyToFit(centerBp, fitWidthBp) {
+                flyTo(centerBp, Math.max(heading ? heading.windowWidthBp : self.windowWidthBp, fitWidthBp));
+            },
         };
     })
         .actions(self => ({
@@ -2760,23 +2992,23 @@ export function stateModelFactory(pluginManager) {
             doAfterAttach(self);
         },
     }));
-    return withLaunchInput(model, lgvLaunchKeys)
+    return withLaunchInput(model, lgvLaunchKeys, {
+        registry: pluginManager,
+        materialized: snap => !!snap.displayedRegions?.length,
+    })
         .preProcessSnapshot((snap) => {
         if (!snap) {
             return snap;
         }
-        // The cytobands setting has been `showCytobandsSetting` and (briefly)
-        // `cytobandsVisible`; both now persist as the bare `showCytobands` prop
-        // (the capability-gated getter is `effectiveShowCytobands`).
-        const { highlight, showCytobandsSetting, cytobandsVisible, offsetPx, bpPerPx, ...rest } = snap;
-        const legacyShowCytobands = showCytobandsSetting ?? cytobandsVisible;
+        // v4's `showCytobandsSetting` persists as the bare `showCytobands` prop
+        // (the capability-gated getter is `effectiveShowCytobands`), and v4's
+        // `colorByCDS` as `colorByFrame`.
+        const { showCytobandsSetting, colorByCDS, offsetPx, bpPerPx, ...rest } = snap;
         return {
-            highlight: Array.isArray(highlight) || highlight === undefined
-                ? highlight
-                : [highlight],
-            ...(legacyShowCytobands !== undefined
-                ? { showCytobands: legacyShowCytobands }
+            ...(showCytobandsSetting !== undefined
+                ? { showCytobands: showCytobandsSetting }
                 : {}),
+            ...(colorByCDS !== undefined ? { colorByFrame: colorByCDS } : {}),
             // The viewport used to persist as pixels. Half of that converts
             // exactly and needs no width — the left edge in bp is offsetPx *
             // bpPerPx — and half of it cannot convert at all, because the width
@@ -2802,30 +3034,13 @@ export function stateModelFactory(pluginManager) {
         };
     })
         .postProcessSnapshot(snap => {
-        // launch is transient, never persisted. showCenterLine is
-        // purely a localStorage-backed preference (see setupLocalStorageAutorun
-        // in afterAttach.ts) and is never persisted into session snapshots. The
-        // remaining fields are also localStorage-backed, but still persist when
-        // non-default: their strip baseline is the universal default (hardcoded
-        // here), not the localStorage-derived creation default, so a
-        // localStorage-set value stays portable across browsers.
-        const { launch, showCenterLine, showCytobands, trackLabels, colorByCDS, showAminoAcids, showTrackOutlines, ...rest } = snap;
-        return {
-            ...rest,
-            // keep the launch state until displayedRegions exist, so a snapshot
-            // taken before the launch autorun navigates (e.g. autosave firing
-            // mid-load) can still rebuild the view instead of dropping to the
-            // import form. displayedRegions is stripDefault, so it's absent (not
-            // []) when empty — the optional chain is runtime-necessary despite the
-            // non-nullish type.
-            // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-            ...(launch && !snap.displayedRegions?.length ? { launch } : {}),
-            ...(!showCytobands ? { showCytobands } : {}),
-            ...(trackLabels ? { trackLabels } : {}),
-            ...(colorByCDS ? { colorByCDS } : {}),
-            ...(!showAminoAcids ? { showAminoAcids } : {}),
-            ...(!showTrackOutlines ? { showTrackOutlines } : {}),
-        };
+        // showCenterLine is a personal preference and stays out of the session.
+        // The other localStorage-seeded settings are always written: the
+        // receiving browser's localStorage fills an absent one, so stripping a
+        // default would show a share link's reader their own setting instead
+        // of the author's.
+        const { showCenterLine, ...rest } = snap;
+        return rest;
     });
 }
 // #endregion