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

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

@@ -5,7 +5,7 @@ export default function ExportSvgDialog({ model, handleClose, }: {
         exportSvg(opts: BaseExportSvgOptions & {
             trackLabels: TrackLabelMode;
             showGridlines: boolean;
-        }): Promise<void>;
+        }): Promise<unknown>;
     };
     handleClose: () => void;
 }): import("react").JSX.Element;

package/esm/LinearGenomeView/components/ScalebarRefNameLabels.js

@@ -5,7 +5,7 @@ import { assembleLocString, assembleLocStrings } from '@jbrowse/core/util';
 import { copyText } from '@jbrowse/core/util/copyText';
 import { makeStyles } from '@jbrowse/core/util/tss-react';
 import { observer } from 'mobx-react';
-import { REF_NAME_LABEL_FONT_SIZE, regionMoveActions, withRegionMoved, withRegionRemoved, withRegionReversed, } from '../util.js';
+import { REF_NAME_LABEL_FONT_SIZE, regionMoveActions, regionRunBounds, setDisplayedRegionsKeepingCenter, withRegionMoved, withRegionRemoved, withRegionReversed, } from '../util.js';
 const useStyles = makeStyles()(theme => ({
     refLabel: {
         // the width the fit test in getScalebarRefNameLabels measures against
@@ -104,6 +104,16 @@ const RefNameMenu = observer(function RefNameMenu({ model, menuState, onClose, }
     const locString = oneRegion
         ? assembleLocString(displayedRegions[idx])
         : assembleLocStrings(labeled);
+    // The region this label's blocks were cut out of. Taken over the WHOLE run
+    // rather than `labeled`, which the viewport clips: a collapsed-introns view
+    // zoomed into two exons would otherwise offer a span that is not the gene's.
+    const { first: runFirst, last: runLast } = regionRunBounds(displayedRegions, idx, lastIdx);
+    const run = displayedRegions.slice(runFirst, runLast + 1);
+    const wholeSpan = {
+        ...run[0],
+        start: Math.min(...run.map(r => r.start)),
+        end: Math.max(...run.map(r => r.end)),
+    };
     return (_jsx(Menu, { anchorEl: menuState.anchorEl, open: true, onClose: onClose, onMenuItemClick: callback => {
             callback();
             onClose();
@@ -126,7 +136,31 @@ const RefNameMenu = observer(function RefNameMenu({ model, menuState, onClose, }
                             ? 'Show only this region'
                             : `Show only ${refName}`,
                         onClick: () => {
-                            model.setDisplayedRegions(labeled);
+                            setDisplayedRegionsKeepingCenter(model, labeled);
+                        },
+                    },
+                ]
+                : []),
+            ...(runLast > runFirst
+                ? [
+                    {
+                        // Names its subject the way the two rows above it do; the span
+                        // it lands on is not spelled into the label, which would move
+                        // under the reader as they navigate.
+                        label: `Show the whole span of ${refName}`,
+                        // Focused rather than centre-kept: the rejoined region is one
+                        // the old viewport never saw, so there is no centre to hold,
+                        // and showing the span is the whole point of the row.
+                        onClick: () => {
+                            model.setDisplayedRegions([
+                                ...displayedRegions.slice(0, runFirst),
+                                wholeSpan,
+                                ...displayedRegions.slice(runLast + 1),
+                            ]);
+                            model.moveTo({ index: runFirst, offset: 0 }, {
+                                index: runFirst,
+                                offset: wholeSpan.end - wholeSpan.start,
+                            });
                         },
                     },
                 ]
@@ -170,7 +204,7 @@ const RefNameMenu = observer(function RefNameMenu({ model, menuState, onClose, }
                                     {
                                         label: 'Remove this region from view',
                                         onClick: () => {
-                                            model.setDisplayedRegions(withRegionRemoved(displayedRegions, idx));
+                                            setDisplayedRegionsKeepingCenter(model, withRegionRemoved(displayedRegions, idx));
                                         },
                                     },
                                 ]

package/esm/LinearGenomeView/components/TrackContainer.js

@@ -1,8 +1,10 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
 import { ErrorBanner, ResizeHandle } from '@jbrowse/core/ui';
 import { ErrorBoundary } from '@jbrowse/core/ui/ErrorBoundary';
 import { cx, makeStyles } from '@jbrowse/core/util/tss-react';
 import { TrackOverlaySlot } from '@jbrowse/display-ui';
+import { isAlive } from '@jbrowse/mobx-state-tree';
 import { Paper } from '@mui/material';
 import { observer } from 'mobx-react';
 import { RESIZE_HANDLE_HEIGHT, TRACK_OUTLINE_BORDER, TRACK_TOP_GAP, } from '../consts.js';
@@ -16,8 +18,8 @@ const useStyles = makeStyles()({
     // described in TrackRenderingContainer. flow-root keeps the block formatting
     // context that `overflow: hidden` used to establish as a side effect (neither
     // `clip` nor no overflow does), so child margins still can't collapse through
-    // and shift the track — which the breakpoint split view would pick up, since
-    // its connector overlay measures trackRefs' getBoundingClientRect().top.
+    // and shift the track — which would put the pixels off the model's offset
+    // arithmetic, which the breakpoint split view draws its connectors from.
     root: {
         marginTop: TRACK_TOP_GAP,
         position: 'relative',
@@ -63,6 +65,45 @@ const useStyles = makeStyles()({
         position: 'absolute',
     },
 });
+// Measures the in-flow label band, the distance from the Paper's content top to
+// the rendering container, into the model. Observes the Paper: it grows and
+// shrinks with the label, the label setting, and the display, and each of those
+// can move the container. Published after a requestAnimationFrame like
+// useWidthSetter, and cleared on unmount so a removed track leaves no band.
+function useTrackLabelBand(model, trackId) {
+    const [paper, setPaper] = useState(null);
+    const [container, setContainer] = useState(null);
+    useEffect(() => {
+        if (paper && container && 'ResizeObserver' in window) {
+            let token;
+            const publish = () => {
+                token = requestAnimationFrame(() => {
+                    if (isAlive(model)) {
+                        const paperRect = paper.getBoundingClientRect();
+                        const band = container.getBoundingClientRect().top -
+                            paperRect.top -
+                            paper.clientTop;
+                        model.setTrackLabelBand(trackId, band);
+                    }
+                });
+            };
+            publish();
+            const observer = new ResizeObserver(publish);
+            observer.observe(paper);
+            return () => {
+                observer.disconnect();
+                if (token !== undefined) {
+                    cancelAnimationFrame(token);
+                }
+                if (isAlive(model)) {
+                    model.setTrackLabelBand(trackId, 0);
+                }
+            };
+        }
+        return undefined;
+    }, [paper, container, model, trackId]);
+    return { setPaper, setContainer };
+}
 const TrackContainer = observer(function TrackContainer({ model, track, }) {
     const { classes } = useStyles();
     // an LGV track always holds at least one linear display (activeDisplay =
@@ -79,9 +120,10 @@ const TrackContainer = observer(function TrackContainer({ model, track, }) {
     const trackLabelStyle = model.effectiveTrackLabels !== 'overlapping' || display.prefersOffset
         ? classes.trackLabelOffset
         : classes.trackLabelOverlap;
-    return (_jsxs(Paper, { className: cx(classes.root, track.pinned ? null : classes.unpinnedTrack), variant: showTrackOutlines ? 'outlined' : undefined, elevation: showTrackOutlines ? undefined : 0, onDragOver: event => {
+    const { setPaper, setContainer } = useTrackLabelBand(model, track.trackId);
+    return (_jsxs(Paper, { ref: setPaper, className: cx(classes.root, track.pinned ? null : classes.unpinnedTrack), variant: showTrackOutlines ? 'outlined' : undefined, elevation: showTrackOutlines ? undefined : 0, onDragOver: event => {
             model.onTrackDragOver(track.id, event.clientY);
-        }, children: [track.pinned ? _jsx(Gridlines, { model: model, offset: outlineOffset }) : null, model.effectiveTrackLabels !== 'hidden' ? (_jsx(TrackLabel, { track: track, className: trackLabelStyle })) : null, _jsx(TrackOverlaySlot, { zIndex: 100, overlayStyle: { left: -outlineOffset }, children: _jsx(ErrorBoundary, { resetKeys: [display.id], FallbackComponent: e => (_jsx(ErrorBanner, { error: e.error, onReset: e.resetErrorBoundary })), children: _jsx(TrackRenderingContainer, { model: model, track: track }) }) }), _jsx(PaddingBlocks, { model: model, offset: outlineOffset }), _jsx(ResizeHandle, { style: { height: RESIZE_HANDLE_HEIGHT }, onDrag: distance => display.resizeHeight(distance), 
+        }, children: [track.pinned ? _jsx(Gridlines, { model: model, offset: outlineOffset }) : null, model.effectiveTrackLabels !== 'hidden' ? (_jsx(TrackLabel, { track: track, className: trackLabelStyle })) : null, _jsx(TrackOverlaySlot, { zIndex: 100, overlayStyle: { left: -outlineOffset }, children: _jsx(ErrorBoundary, { resetKeys: [display.id], FallbackComponent: e => (_jsx(ErrorBanner, { error: e.error, onReset: e.resetErrorBoundary })), children: _jsx(TrackRenderingContainer, { model: model, track: track, ref: setContainer }) }) }), _jsx(PaddingBlocks, { model: model, offset: outlineOffset }), _jsx(ResizeHandle, { style: { height: RESIZE_HANDLE_HEIGHT }, onDrag: distance => display.resizeHeight(distance), 
                 // the drag's shortcut: grow the track by whatever it is scrolled over,
                 // so a pileup showing three rows of forty opens to all forty
                 // Optional: only a display that scrolls its own content has anything

package/esm/LinearGenomeView/components/TrackLabelButtons.js

@@ -1,11 +1,11 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { getContainingView } from '@jbrowse/core/util';
 import { makeStyles } from '@jbrowse/core/util/tss-react';
 import ArrowDropDownIcon from '@mui/icons-material/ArrowDropDown';
 import ArrowRightIcon from '@mui/icons-material/ArrowRight';
 import CloseIcon from '@mui/icons-material/Close';
 import { IconButton } from '@mui/material';
 import { observer } from 'mobx-react';
+import { containingLgv } from '../../LinearGenomeView/containingLgv.js';
 const useStyles = makeStyles()({
     iconButton: {
         padding: 0,
@@ -21,7 +21,7 @@ const useStyles = makeStyles()({
 // write it.
 export const TrackLabelCloseButton = observer(function TrackLabelCloseButton({ track, }) {
     const { classes } = useStyles();
-    const view = getContainingView(track);
+    const view = containingLgv(track);
     return (_jsx(IconButton, { onClick: () => view.hideTrack(track.trackId), className: classes.iconButton, title: "close this track", "data-testid": `track-close-${track.trackId}`, children: _jsx(CloseIcon, { fontSize: "small" }) }));
 });
 export const TrackLabelMinimizeButton = observer(function TrackLabelMinimizeButton({ track }) {

package/esm/LinearGenomeView/components/TrackLabelDragHandle.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { getContainingView } from '@jbrowse/core/util';
 import { makeStyles } from '@jbrowse/core/util/tss-react';
 import DragIcon from '@mui/icons-material/DragIndicator';
 import { observer } from 'mobx-react';
+import { containingLgv } from '../../LinearGenomeView/containingLgv.js';
 const useStyles = makeStyles()({
     dragHandle: {
         cursor: 'grab',
@@ -15,7 +15,7 @@ const useStyles = makeStyles()({
 });
 const TrackLabelDragHandle = observer(function TrackLabelDragHandle({ track, }) {
     const { classes } = useStyles();
-    const view = getContainingView(track);
+    const view = containingLgv(track);
     const trackId = track.trackId;
     return (_jsx("span", { draggable: true, className: classes.dragHandle, onDragStart: event => {
             const target = event.currentTarget;

package/esm/LinearGenomeView/components/TrackLabelMenu.js

@@ -1,10 +1,11 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import CascadingMenuButton from '@jbrowse/core/ui/CascadingMenuButton';
-import { getContainingView, getSession } from '@jbrowse/core/util';
+import { getSession } from '@jbrowse/core/util';
 import { makeStyles } from '@jbrowse/core/util/tss-react';
 import LowPriorityIcon from '@mui/icons-material/LowPriority';
 import MoreVertIcon from '@mui/icons-material/MoreVert';
 import { observer } from 'mobx-react';
+import { containingLgv } from '../../LinearGenomeView/containingLgv.js';
 import { getTrackOrderSubMenu } from './trackLabelMenuItems.js';
 // IconButton's default 5px padding made this the tallest thing in the label
 // (27px), so it, not the text or the other controls, set the label height and
@@ -17,7 +18,7 @@ const useStyles = makeStyles()({
 });
 const TrackLabelMenu = observer(function TrackLabelMenu({ track, }) {
     const { classes } = useStyles();
-    const view = getContainingView(track);
+    const view = containingLgv(track);
     const session = getSession(track);
     function getMenuItems() {
         const orderSubMenu = getTrackOrderSubMenu({ view, track });

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

@@ -1,8 +1,9 @@
 import type { LinearGenomeViewModel } from '../index.ts';
 import type { BaseTrackModel } from '@jbrowse/core/pluggableElementTypes/models';
 type LGV = LinearGenomeViewModel;
-declare const TrackRenderingContainer: ({ model, track, }: {
+declare const TrackRenderingContainer: ({ model, track, ref, }: {
     model: LGV;
     track: BaseTrackModel;
+    ref?: React.Ref<HTMLDivElement>;
 }) => import("react").JSX.Element;
 export default TrackRenderingContainer;

package/esm/LinearGenomeView/components/TrackRenderingContainer.js

@@ -1,5 +1,5 @@
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Suspense, useCallback } from 'react';
+import { Suspense } from 'react';
 import { LoadingOverlay } from '@jbrowse/core/ui';
 import { getSession } from '@jbrowse/core/util';
 import { getTrackName } from '@jbrowse/core/util/tracks';
@@ -72,28 +72,18 @@ const TrackDisplayRegion = observer(function TrackDisplayRegion({ model, track,
     const loc = model.coarseVisibleLocStrings;
     return (_jsx("div", { ...divProps, role: "figure", "aria-label": loc ? `${trackName} track, showing ${loc}` : `${trackName} track`, children: children }));
 });
-const TrackRenderingContainer = observer(function TrackRenderingContainer({ model, track, }) {
+const TrackRenderingContainer = observer(function TrackRenderingContainer({ model, track, ref, }) {
     const { classes } = useStyles();
     // an LGV track always holds at least one linear display (activeDisplay =
     // displays[0]); narrow to the linear shape for height/RenderingComponent
     const display = track.activeDisplay;
     const { height, RenderingComponent, DisplayBlurb } = display;
-    const { trackRefs, showTrackOutlines } = model;
+    const { showTrackOutlines } = model;
     const trackId = track.trackId;
     const minimized = track.minimized;
-    // callback ref keeps trackRefs in sync as the rendering div mounts/unmounts
-    // (e.g. on minimize/restore), unlike a useEffect that misses the toggle
-    const setRef = useCallback((el) => {
-        if (el) {
-            trackRefs[trackId] = el;
-        }
-        else {
-            delete trackRefs[trackId];
-        }
-    }, [trackRefs, trackId]);
-    return (_jsx("div", { className: classes.trackRenderingContainer, style: {
+    return (_jsx("div", { ref: ref, className: classes.trackRenderingContainer, style: {
             height: minimized ? MINIMIZED_TRACK_HEIGHT : height,
-        }, "data-testid": `trackRenderingContainer-${model.id}-${trackId}`, children: !minimized ? (_jsxs(_Fragment, { children: [_jsx(TrackDisplayRegion, { model: model, track: track, ref: setRef, className: classes.renderingComponentContainer, style: { left: showTrackOutlines ? -1 : 0 }, children: _jsx(Suspense, { fallback: _jsx(LoadingOverlay, { isVisible: true, immediate: true }), children: _jsx(RenderingComponent, { model: display, onHorizontalScroll: model.horizontalScroll }) }) }), DisplayBlurb ? (_jsx("div", { style: {
+        }, "data-testid": `trackRenderingContainer-${model.id}-${trackId}`, children: !minimized ? (_jsxs(_Fragment, { children: [_jsx(TrackDisplayRegion, { model: model, track: track, className: classes.renderingComponentContainer, style: { left: showTrackOutlines ? -1 : 0 }, children: _jsx(Suspense, { fallback: _jsx(LoadingOverlay, { isVisible: true, immediate: true }), children: _jsx(RenderingComponent, { model: display, onHorizontalScroll: model.horizontalScroll }) }) }), DisplayBlurb ? (_jsx("div", { style: {
                         position: 'absolute',
                         left: 0,
                         top: display.height - 20,

package/esm/LinearGenomeView/consts.js

@@ -14,7 +14,7 @@ export const SVG_SCALEBAR_CAP = 5;
 // TrackContainer lays its Paper out from these same three and nothing else —
 // the previous spelling had the model on a 3 while the CSS rendered 2 + 1 + 4,
 // which put every model-derived track offset 5px per track above the pixels.
-// The track *label* is deliberately not among them; see `trackChromeHeight`.
+// The track *label* is not among them: it is measured, see `trackLabelBand`.
 export const RESIZE_HANDLE_HEIGHT = 4;
 export const TRACK_TOP_GAP = 2;
 export const TRACK_OUTLINE_BORDER = 1;

package/esm/LinearGenomeView/containingLgv.d.ts

@@ -0,0 +1,15 @@
+import type { LinearGenomeViewModel } from './model.ts';
+import type { IStateTreeNode } from '@jbrowse/mobx-state-tree';
+/**
+ * The containing view as the linear genome view itself, for a display that
+ * needs `pxToBp`, `showTrack`, `navTo` or the view's own chrome settings.
+ *
+ * The twin of display-kit's `containingHost`, and deliberately not the same
+ * function: `RegionHost` is the region contract display-kit reads, and widening
+ * it to carry the LGV's own surface is how the display layer would come to
+ * depend on the view plugin. A display that wants the view names the view.
+ *
+ * Components and structural helpers taking duck-typed model shapes keep calling
+ * `getContainingView` — the same carve-out `containingHost` documents.
+ */
+export declare function containingLgv(self: IStateTreeNode): LinearGenomeViewModel;

package/esm/LinearGenomeView/containingLgv.js

@@ -0,0 +1,16 @@
+import { getContainingView } from '@jbrowse/core/util';
+/**
+ * The containing view as the linear genome view itself, for a display that
+ * needs `pxToBp`, `showTrack`, `navTo` or the view's own chrome settings.
+ *
+ * The twin of display-kit's `containingHost`, and deliberately not the same
+ * function: `RegionHost` is the region contract display-kit reads, and widening
+ * it to carry the LGV's own surface is how the display layer would come to
+ * depend on the view plugin. A display that wants the view names the view.
+ *
+ * Components and structural helpers taking duck-typed model shapes keep calling
+ * `getContainingView` — the same carve-out `containingHost` documents.
+ */
+export function containingLgv(self) {
+    return getContainingView(self);
+}

package/esm/LinearGenomeView/model.d.ts

@@ -88,9 +88,7 @@ export declare function stateModelFactory(pluginManager: PluginManager): import(
     readonly effectiveBodyMounted: boolean;
     menuItems(): MenuItem[];
     readonly ownTracks: import("@jbrowse/core/util").AbstractTrackModel[];
-    readonly allViews: import("@jbrowse/core/util").AbstractViewModel[];
-} & {
-    readonly allTracks: import("@jbrowse/core/util").AbstractTrackModel[];
+    readonly ownViews: import("@jbrowse/core/util").AbstractViewModel[];
 } & {
     setDisplayName(name: string): void;
     setWidth(newWidth: number): void;
@@ -105,6 +103,15 @@ export declare function stateModelFactory(pluginManager: PluginManager): import(
 } & {
     afterAttach(): void;
 } & {
+    /**
+     * #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.
+     */
+    trackLabelBands: import("mobx").ObservableMap<string, number>;
     /**
      * #volatile
      */
@@ -125,10 +132,6 @@ export declare function stateModelFactory(pluginManager: PluginManager): import(
      * #volatile
      */
     volatileError: unknown;
-    /**
-     * #volatile
-     */
-    trackRefs: Record<string, HTMLDivElement>;
     /**
      * #volatile
      */
@@ -239,6 +242,12 @@ export declare function stateModelFactory(pluginManager: PluginManager): import(
      */
     readonly stickyViewHeaders: boolean;
 } & {
+    /**
+     * #getter
+     * The census entry for this view: the tracks it holds itself. Declared
+     * rather than derived — see `BaseViewModel.ownTracks`.
+     */
+    readonly ownTracks: any[];
     /**
      * #getter
      * Assembly-name prefix for the scalebar refName labels, or undefined for
@@ -657,14 +666,10 @@ export declare function stateModelFactory(pluginManager: PluginManager): import(
      * #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.
      */
     readonly trackChromeHeight: number;
     /**
@@ -693,6 +698,12 @@ export declare function stateModelFactory(pluginManager: PluginManager): import(
      * can't diverge from what is on screen.
      */
     trackHeight(track: (import("@jbrowse/mobx-state-tree").IMSTArray<import("@jbrowse/mobx-state-tree").IAnyType> & import("@jbrowse/mobx-state-tree").IStateTreeNode<import("@jbrowse/mobx-state-tree").IArrayType<import("@jbrowse/mobx-state-tree").IAnyType>>)[number]): any;
+    /**
+     * #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: (import("@jbrowse/mobx-state-tree").IMSTArray<import("@jbrowse/mobx-state-tree").IAnyType> & import("@jbrowse/mobx-state-tree").IStateTreeNode<import("@jbrowse/mobx-state-tree").IArrayType<import("@jbrowse/mobx-state-tree").IAnyType>>)[number]): number;
     /**
      * #getter
      */
@@ -712,10 +723,10 @@ export declare function stateModelFactory(pluginManager: PluginManager): import(
      * 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: string): number | undefined;
     /**
@@ -827,6 +838,7 @@ export declare function stateModelFactory(pluginManager: PluginManager): import(
     /**
      * #action
      */
+    setTrackLabelBand(trackId: string, band: number): void;
     setWidth(newWidth: number): void;
     /**
      * #action
@@ -1004,9 +1016,10 @@ export declare function stateModelFactory(pluginManager: PluginManager): import(
     setLaunch(launch?: LaunchInput<InitState>): void;
     /**
      * #method
-     * creates an svg export and save using FileSaver
+     * renders the view to SVG markup, which it returns; saves it through
+     * FileSaver unless `save: false`
      */
-    exportSvg(opts?: ExportSvgOptions): Promise<void>;
+    exportSvg(opts?: ExportSvgOptions): Promise<string>;
 } & {
     slide: (viewWidths: number) => void;
     zoom: (targetBpPerPx: number) => void;
@@ -1706,7 +1719,7 @@ export declare function stateModelFactory(pluginManager: PluginManager): import(
      * `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: number, refName: string): void;
+    flyToCenter(coord: number, refName: string, displayedRegionIndex?: number): void;
 } & {
     afterCreate(): void;
     afterAttach(): void;
@@ -1746,9 +1759,7 @@ export declare function stateModelFactory(pluginManager: PluginManager): import(
     readonly effectiveBodyMounted: boolean;
     menuItems(): MenuItem[];
     readonly ownTracks: import("@jbrowse/core/util").AbstractTrackModel[];
-    readonly allViews: import("@jbrowse/core/util").AbstractViewModel[];
-} & {
-    readonly allTracks: import("@jbrowse/core/util").AbstractTrackModel[];
+    readonly ownViews: import("@jbrowse/core/util").AbstractViewModel[];
 } & {
     setDisplayName(name: string): void;
     setWidth(newWidth: number): void;
@@ -1763,6 +1774,15 @@ export declare function stateModelFactory(pluginManager: PluginManager): import(
 } & {
     afterAttach(): void;
 } & {
+    /**
+     * #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.
+     */
+    trackLabelBands: import("mobx").ObservableMap<string, number>;
     /**
      * #volatile
      */
@@ -1783,10 +1803,6 @@ export declare function stateModelFactory(pluginManager: PluginManager): import(
      * #volatile
      */
     volatileError: unknown;
-    /**
-     * #volatile
-     */
-    trackRefs: Record<string, HTMLDivElement>;
     /**
      * #volatile
      */
@@ -1897,6 +1913,12 @@ export declare function stateModelFactory(pluginManager: PluginManager): import(
      */
     readonly stickyViewHeaders: boolean;
 } & {
+    /**
+     * #getter
+     * The census entry for this view: the tracks it holds itself. Declared
+     * rather than derived — see `BaseViewModel.ownTracks`.
+     */
+    readonly ownTracks: any[];
     /**
      * #getter
      * Assembly-name prefix for the scalebar refName labels, or undefined for
@@ -2315,14 +2337,10 @@ export declare function stateModelFactory(pluginManager: PluginManager): import(
      * #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.
      */
     readonly trackChromeHeight: number;
     /**
@@ -2351,6 +2369,12 @@ export declare function stateModelFactory(pluginManager: PluginManager): import(
      * can't diverge from what is on screen.
      */
     trackHeight(track: (import("@jbrowse/mobx-state-tree").IMSTArray<import("@jbrowse/mobx-state-tree").IAnyType> & import("@jbrowse/mobx-state-tree").IStateTreeNode<import("@jbrowse/mobx-state-tree").IArrayType<import("@jbrowse/mobx-state-tree").IAnyType>>)[number]): any;
+    /**
+     * #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: (import("@jbrowse/mobx-state-tree").IMSTArray<import("@jbrowse/mobx-state-tree").IAnyType> & import("@jbrowse/mobx-state-tree").IStateTreeNode<import("@jbrowse/mobx-state-tree").IArrayType<import("@jbrowse/mobx-state-tree").IAnyType>>)[number]): number;
     /**
      * #getter
      */
@@ -2370,10 +2394,10 @@ export declare function stateModelFactory(pluginManager: PluginManager): import(
      * 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: string): number | undefined;
     /**
@@ -2485,6 +2509,7 @@ export declare function stateModelFactory(pluginManager: PluginManager): import(
     /**
      * #action
      */
+    setTrackLabelBand(trackId: string, band: number): void;
     setWidth(newWidth: number): void;
     /**
      * #action
@@ -2662,9 +2687,10 @@ export declare function stateModelFactory(pluginManager: PluginManager): import(
     setLaunch(launch?: LaunchInput<InitState>): void;
     /**
      * #method
-     * creates an svg export and save using FileSaver
+     * renders the view to SVG markup, which it returns; saves it through
+     * FileSaver unless `save: false`
      */
-    exportSvg(opts?: ExportSvgOptions): Promise<void>;
+    exportSvg(opts?: ExportSvgOptions): Promise<string>;
 } & {
     slide: (viewWidths: number) => void;
     zoom: (targetBpPerPx: number) => void;
@@ -3364,7 +3390,7 @@ export declare function stateModelFactory(pluginManager: PluginManager): import(
      * `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: number, refName: string): void;
+    flyToCenter(coord: number, refName: string, displayedRegionIndex?: number): void;
 } & {
     afterCreate(): void;
     afterAttach(): void;
@@ -3387,7 +3413,7 @@ export declare function stateModelFactory(pluginManager: PluginManager): import(
     showGridlines: boolean;
     labelsVisible: boolean;
     scalebarOnly: boolean;
-    launch?: LaunchInput<InitState> | undefined;
+    launch: LaunchInput<InitState> | undefined;
     showCytobands?: false | undefined;
     trackLabels?: string | undefined;
     colorByCDS?: true | undefined;