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

package/esm/LinearGenomeView/afterAttach.d.ts

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

package/esm/LinearGenomeView/afterAttach.js

@@ -2,10 +2,9 @@ import { getSession, isSessionModelWithWidgets, resolveNamedRegions, } from '@jb
 import { coerceHighlight } from '@jbrowse/core/util/highlights';
 import { installInitAutorun } from '@jbrowse/core/util/installInitAutorun';
 import { normalizeTrackInit, warmTrackDisplayGeneric, } from '@jbrowse/core/util/tracks';
-import { requestedDisplayType } from '@jbrowse/launch-args/displaySettings';
+import { requestedDisplayType } from '@jbrowse/launch-args/displayAlias';
 import { addDisposer } from '@jbrowse/mobx-state-tree';
 import { autorun, untracked, when } from 'mobx';
-import { launchTrackInit } from '../TrackModifiers/index.js';
 import { SearchResultsNotFoundError } from '../searchUtils.js';
 // `init` is a frozen blob that often comes from hand-authored JSON, where a
 // lone entry gets written bare (`tracks: 'genes'`). A string is iterable, so
@@ -83,53 +82,82 @@ function showNamedRegions(self, session, assemblyName, names) {
         }
     }
 }
-async function navigateInit(self, session, init) {
+function reportInitNavError(session, e) {
+    console.error(e);
+    if (e instanceof SearchResultsNotFoundError) {
+        // a gene name that matched nothing is a soft miss, not an app error
+        session.notify(e.message, 'warning');
+    }
+    else {
+        session.notifyError(`${e}`, e);
+    }
+}
+/**
+ * Navigate a view to an init blob's `loc`, reporting a bad one as a warning
+ * (a gene that matched nothing) or an error rather than throwing. Exported
+ * because a LinearSyntenyView row is a LinearGenomeView that does not go
+ * through this file's init autorun, so it navigates each row itself.
+ */
+export async function navToInitLoc(view, session, init) {
     try {
-        if (init.loc) {
-            // navToLocString waits for the assembly itself, and this autorun only
-            // runs once `initialized` confirms init.assembly has loaded regions, so
-            // no explicit waitForAssembly is needed here
-            // a spec that listed its tracks gets those tracks; one that only named
-            // a gene gets the track the gene was found in, as the search box would
-            await self.navToLocString(init.loc, init.assembly, init.grow, {
-                showHitTrack: init.showHitTrack ?? asArray(init.tracks).length === 0,
-            });
-        }
-        else if (init.displayedRegionNames?.length) {
-            // an explicit region list is a navigation request just like `loc`, so it
-            // applies even when regions already exist (URL params layered onto a
-            // defaultSession that already navigated)
-            //
-            // `?.length`, not the bare key: an empty array is truthy, so a spec
-            // writing `displayedRegionNames: []` took this path with nothing to name
-            // and got told its list of no names had matched no regions. That is why
-            // LinearSyntenyView's doSubmit omits the key rather than passing [].
-            showNamedRegions(self, session, init.assembly, init.displayedRegionNames);
-        }
-        else if (!self.hasDisplayedRegions) {
-            // a highlight-only init (nothing to navigate to) must not clobber a
-            // defaultSession's existing navigation, so only auto-navigate when
-            // nothing is shown yet
-            self.showAllRegionsInAssembly(init.assembly);
-        }
+        // navToLocString waits for the assembly itself. A spec that listed its
+        // tracks gets those tracks; one that only named a gene gets the track the
+        // gene was found in, as the search box would
+        await view.navToLocString(init.loc, init.assembly, init.grow, {
+            showHitTrack: init.showHitTrack ?? asArray(init.tracks).length === 0,
+        });
     }
     catch (e) {
-        console.error(init, e);
-        if (e instanceof SearchResultsNotFoundError) {
-            // a &loc= gene name that matched nothing is a soft miss, not an app error
-            session.notify(e.message, 'warning');
+        reportInitNavError(session, e);
+    }
+}
+async function navigateInit(self, session, init) {
+    if (init.loc) {
+        await navToInitLoc(self, session, { ...init, loc: init.loc });
+    }
+    else {
+        try {
+            navigateWithoutLoc(self, session, init);
         }
-        else {
-            session.notifyError(`${e}`, e);
+        catch (e) {
+            reportInitNavError(session, e);
         }
     }
 }
-// launchTrack funnels through showTrackGeneric, which surfaces any failure
-// (unresolved id, bad config, etc) as its own snackbar, and loads the picked
-// display's state model first when it is registered lazily
-async function showInitTracks(self, init) {
-    for (const t of asArray(init.tracks)) {
-        await launchTrackInit(self, t);
+function navigateWithoutLoc(self, session, init) {
+    if (init.displayedRegionNames?.length) {
+        // an explicit region list is a navigation request just like `loc`, so it
+        // applies even when regions already exist (URL params layered onto a
+        // defaultSession that already navigated)
+        //
+        // `?.length`, not the bare key: an empty array is truthy, so a spec
+        // writing `displayedRegionNames: []` took this path with nothing to name
+        // and got told its list of no names had matched no regions. That is why
+        // LinearSyntenyView's doSubmit omits the key rather than passing [].
+        showNamedRegions(self, session, init.assembly, init.displayedRegionNames);
+    }
+    else if (!self.hasDisplayedRegions) {
+        // a highlight-only init (nothing to navigate to) must not clobber a
+        // defaultSession's existing navigation, so only auto-navigate when
+        // nothing is shown yet
+        self.showAllRegionsInAssembly(init.assembly);
+    }
+}
+/**
+ * Open an init blob's `tracks`, one at a time, a bare string taken as a list
+ * of one. launchTrack funnels through showTrackGeneric, which surfaces any
+ * failure (unresolved id, bad config) as its own snackbar, and loads the
+ * picked display's state model first when it is registered lazily. Exported
+ * for the LinearSyntenyView rows, as `navToInitLoc` is.
+ */
+export async function showInitTracks(self, init) {
+    const tracks = asArray(init.tracks);
+    if (tracks.length) {
+        // lazy, so the modifier and slot tables stay out of every page's first load
+        const { launchTrackInit } = await import('../TrackModifiers/index.js');
+        for (const t of tracks) {
+            await launchTrackInit(self, t);
+        }
     }
 }
 /**
@@ -147,7 +175,7 @@ export function applyInitHighlights(session, init) {
         // parseLocString throws on an unknown refName or a malformed locstring, and
         // one bad entry must take out neither its siblings nor the rest of init
         try {
-            const highlight = coerceHighlight(h, init.assembly, refName => session.assemblyManager.isValidRefName(refName, init.assembly));
+            const highlight = coerceHighlight(h, init.assembly, (refName, asm) => session.assemblyManager.isValidRefName(refName, asm ?? init.assembly));
             if (highlight) {
                 session.addHighlight(highlight);
             }

package/esm/LinearGenomeView/components/CenterLine.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { clamp } from '@jbrowse/core/util';
-import { basePaintedAt } from '@jbrowse/core/util/Base1DUtils';
+import { basePaintedAt, bpIntoPaintedBase, } from '@jbrowse/core/util/Base1DUtils';
 import { makeStyles } from '@jbrowse/core/util/tss-react';
 import CloseIcon from '@mui/icons-material/Close';
 import { IconButton, Tooltip } from '@mui/material';
@@ -36,9 +36,12 @@ const useStyles = makeStyles()(theme => ({
 const CenterLine = observer(function CenterLine({ model }) {
     const { bpPerPx, centerLineInfo, tracks, width } = model;
     const { classes } = useStyles();
-    const startingPosition = width / 2;
+    const left = centerLineInfo && bpPerPx < 1
+        ? width / 2 -
+            bpIntoPaintedBase(centerLineInfo, centerLineInfo.offset) / bpPerPx
+        : width / 2;
     return tracks.length ? (_jsx("div", { "data-testid": "centerline_container", className: classes.centerLineContainer, role: "presentation", style: {
-            transform: `translateX(${startingPosition}px)`,
+            transform: `translateX(${left}px)`,
             width: Math.max(1 / bpPerPx, 1),
         }, children: centerLineInfo && (_jsxs("div", { "data-testid": "centerline_text", className: classes.centerLineText, role: "presentation", style: {
                 transform: `translateX(${Math.max(1 / bpPerPx, 1) + 5}px)`,

package/esm/LinearGenomeView/components/ConnectedHoverHighlight.js

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

package/esm/LinearGenomeView/components/ExportSvgDialog.js

@@ -5,6 +5,12 @@ import { MenuItem, TextField } from '@mui/material';
 import { observer } from 'mobx-react';
 const MIN_WIDTH = 100;
 const MAX_WIDTH = 10000;
+const TRACK_LABEL_MODES = [
+    { mode: 'offset', label: 'Offset' },
+    { mode: 'overlapping', label: 'Overlapping' },
+    { mode: 'left', label: 'Left' },
+    { mode: 'hidden', label: 'Hidden' },
+];
 // Shared track-label + gridlines export dialog. Used by LGV, linear-synteny and
 // breakpoint-split views (their lazyDialogs re-export this). Only a caller
 // passing `chooseWidth` offers the width field, whose model lays itself out at
@@ -29,9 +35,12 @@ const ExportSvgDialog = observer(function ExportSvgDialog({ model, handleClose,
             viewWidth: chooseWidth && widthValid ? typedWidth : undefined,
         }), checkboxes: _jsx(LabeledCheckbox, { checked: showGridlines, onChange: val => {
                 setShowGridlines(val);
-            }, label: "Show gridlines" }), children: [_jsxs(TextField, { select: true, label: "Track label positioning", variant: "outlined", style: { minWidth: 200 }, value: trackLabels, onChange: event => {
-                    setTrackLabels(event.target.value);
-                }, children: [_jsx(MenuItem, { value: "offset", children: "Offset" }), _jsx(MenuItem, { value: "overlapping", children: "Overlapping" }), _jsx(MenuItem, { value: "left", children: "Left" }), _jsx(MenuItem, { value: "hidden", children: "Hidden" })] }), chooseWidth ? (_jsx(TextField, { label: "Width (px)", variant: "outlined", type: "number", value: widthText, error: !widthValid, helperText: widthValid
+            }, label: "Show gridlines" }), children: [_jsx(TextField, { select: true, label: "Track label positioning", variant: "outlined", style: { minWidth: 200 }, value: trackLabels, onChange: event => {
+                    const picked = TRACK_LABEL_MODES.find(m => m.mode === event.target.value);
+                    if (picked) {
+                        setTrackLabels(picked.mode);
+                    }
+                }, children: TRACK_LABEL_MODES.map(({ mode, label }) => (_jsx(MenuItem, { value: mode, children: label }, mode))) }), chooseWidth ? (_jsx(TextField, { label: "Width (px)", variant: "outlined", type: "number", value: widthText, error: !widthValid, helperText: widthValid
                     ? 'Lays the tracks out as a window this wide would; text keeps its size'
                     : `A whole number from ${MIN_WIDTH} to ${MAX_WIDTH}`, slotProps: {
                     htmlInput: { min: MIN_WIDTH, max: MAX_WIDTH, step: 1 },

package/esm/LinearGenomeView/components/Header.js

@@ -50,7 +50,7 @@ const Controls = observer(function Controls({ model, }) {
         viewMenu,
         touch,
     });
-    return (_jsxs("div", { className: classes.headerBar, ref: ref, children: [viewMenu ? (_jsx(CascadingMenuButton, { menuItems: () => model.menuItems(), "data-testid": "view_menu_icon", children: _jsx(MenuIcon, {}) })) : null, _jsx(HeaderTrackSelectorButton, { model: model, indent: fit.trackSelectorIndent }), touch ? null : (_jsx(ScrollZoomToggle, { model: model, iconOnly: !fit.scrollZoomLabel })), _jsx("div", { className: classes.spacer }), touch ? null : (_jsx(HeaderPanControls, { model: model, compact: !fit.panButtonSpacing })), _jsx(SearchBox, { model: model }), _jsx(HeaderClearHighlightButton, { highlighted: highlighted }), fit.regionWidth ? _jsx(HeaderRegionWidth, { model: model }) : null, _jsx(HeaderZoomControls, { model: model, showSlider: fit.zoomSlider }), _jsx("div", { className: classes.spacer })] }));
+    return (_jsxs("div", { className: classes.headerBar, ref: ref, children: [viewMenu ? (_jsx(CascadingMenuButton, { tooltip: "View menu", menuItems: () => model.menuItems(), "data-testid": "view_menu_icon", children: _jsx(MenuIcon, {}) })) : null, _jsx(HeaderTrackSelectorButton, { model: model, indent: fit.trackSelectorIndent }), touch ? null : (_jsx(ScrollZoomToggle, { model: model, iconOnly: !fit.scrollZoomLabel })), _jsx("div", { className: classes.spacer }), touch ? null : (_jsx(HeaderPanControls, { model: model, compact: !fit.panButtonSpacing })), _jsx(SearchBox, { model: model }), _jsx(HeaderClearHighlightButton, { highlighted: highlighted }), fit.regionWidth ? _jsx(HeaderRegionWidth, { model: model }) : null, _jsx(HeaderZoomControls, { model: model, showSlider: fit.zoomSlider }), _jsx("div", { className: classes.spacer })] }));
 });
 const LinearGenomeViewHeader = observer(function LinearGenomeViewHeader({ model, }) {
     const { hideHeader, hideHeaderOverview } = model;

package/esm/LinearGenomeView/components/HeaderZoomControls.js

@@ -37,11 +37,12 @@ const ZoomSlider = observer(function ZoomSlider({ model, }) {
     const { width, maxBpPerPx, minBpPerPx, bpPerPx } = model;
     const [dragValue, setDragValue] = useState(null);
     const value = dragValue ?? -Math.log2(bpPerPx) * 100;
+    const windowSize = (sliderValue) => `Window size: ${getBpDisplayStr(2 ** (-sliderValue / 100) * width)}`;
     return (_jsx(SingleSlider, { size: "small", className: classes.slider, value: value, min: -Math.log2(maxBpPerPx) * 100, max: -Math.log2(minBpPerPx) * 100, onChangeCommitted: val => {
             setDragValue(null);
             model.cancelZoomAnimation();
             model.zoomTo(2 ** (-val / 100));
-        }, valueLabelDisplay: "auto", valueLabelFormat: newValue => `Window size: ${getBpDisplayStr(2 ** (-newValue / 100) * width)}`, onChange: val => {
+        }, valueLabelDisplay: "auto", "aria-label": "Zoom level", valueLabelFormat: newValue => windowSize(newValue), getAriaValueText: newValue => windowSize(newValue), onChange: val => {
             // Take over from any in-flight animated zoom as soon as the user grabs
             // the thumb, so the view stops lurching underneath the drag.
             if (dragValue === null) {
@@ -52,6 +53,6 @@ const ZoomSlider = observer(function ZoomSlider({ model, }) {
 });
 const HeaderZoomControls = observer(function HeaderZoomControls({ model, showSlider = true, }) {
     const { classes } = useStyles();
-    return (_jsxs("div", { className: classes.container, children: [_jsx(ZoomButton, { model: model, direction: "out" }), showSlider ? _jsx(ZoomSlider, { model: model }) : null, _jsx(ZoomButton, { model: model, direction: "in" }), _jsx(CascadingMenuButton, { menuItems: () => zoomMenuItems(model), children: _jsx(MoreVert, {}) })] }));
+    return (_jsxs("div", { className: classes.container, children: [_jsx(ZoomButton, { model: model, direction: "out" }), showSlider ? _jsx(ZoomSlider, { model: model }) : null, _jsx(ZoomButton, { model: model, direction: "in" }), _jsx(CascadingMenuButton, { tooltip: "Zoom options", menuItems: () => zoomMenuItems(model), children: _jsx(MoreVert, {}) })] }));
 });
 export default HeaderZoomControls;

package/esm/LinearGenomeView/components/HighlightBand.js

@@ -39,21 +39,21 @@ export function gapMask(gaps) {
     ]);
     return `linear-gradient(to bottom, ${stops.join(', ')})`;
 }
-// OverviewHighlight stays separate (different bpToPx API). A non-interactive
-// colored band with an optional top label; when `children` (the highlight
-// chip) is passed it renders that instead of the plain label. Visibility is
-// toggled from the view menu
+// A colored band with an optional top label; when `children` (the highlight
+// chip) is passed it renders that instead of the plain label. Clicks fall
+// through it to the tracks, which is what keeps it apart from the hoverable
+// OverviewHighlightBand. Visibility is toggled from the view menu
 const HighlightBand = observer(function HighlightBand({ coords, background, label, gaps, children, }) {
     const { classes } = useStyles();
+    const mask = gaps?.length ? gapMask(gaps) : undefined;
     const content = children ??
         (label ? (_jsx(Typography, { variant: "caption", className: classes.label, noWrap: true, children: label })) : null);
     return (_jsxs(_Fragment, { children: [_jsx("div", { "data-testid": "highlight-band", className: classes.highlight, style: {
                     transform: `translateX(${coords.left}px)`,
                     width: coords.width,
                     background,
-                    ...(gaps?.length
-                        ? { maskImage: gapMask(gaps), WebkitMaskImage: gapMask(gaps) }
-                        : undefined),
+                    maskImage: mask,
+                    WebkitMaskImage: mask,
                 } }), content ? (_jsx("div", { className: classes.overlay, style: { transform: `translateX(${coords.left}px)` }, children: content })) : null] }));
 });
 export default HighlightBand;

package/esm/LinearGenomeView/components/ImportForm.js

@@ -44,12 +44,12 @@ const LinearGenomeViewImportForm = observer(function LinearGenomeViewImportForm(
         model.setError(undefined);
         if (selectedAsm) {
             try {
-                await navigateToSelectedOption({
+                const moved = await navigateToSelectedOption({
                     option,
                     model,
                     assemblyName: selectedAsm,
                 });
-                if (record) {
+                if (record && moved) {
                     addRecentLocation(recentLocationOf(option));
                 }
             }
@@ -61,7 +61,7 @@ const LinearGenomeViewImportForm = observer(function LinearGenomeViewImportForm(
     const recentMenuItems = recentLocationsMenu({
         recentLocations,
         onNavigate: option => {
-            navigate({ option, record: true }).catch(() => { });
+            void navigate({ option, record: true });
         },
         onClear: clearRecentLocations,
     });

package/esm/LinearGenomeView/components/MiniControls.js

@@ -33,7 +33,7 @@ const MiniControls = observer(function MiniControls({ model, }) {
             ? { top: model.scalebarHeight, transform: 'translateY(-100%)' }
             : undefined, children: _jsxs(Paper, { className: focusedViewId === id ? classes.focusedBackground : undefined, children: [_jsx(Tooltip, { title: "Open track selector", children: _jsx(IconButton, { size: "small", onClick: () => {
                             model.activateTrackSelector();
-                        }, children: _jsx(TrackSelectorIcon, { fontSize: "small" }) }) }), _jsx(CascadingMenuButton, { menuItems: () => model.menuItems(), children: _jsx(MoreVertIcon, { fontSize: "small" }) }), _jsx(Tooltip, { title: scalebarOnly ? 'Show tracks' : 'Show ruler only', children: _jsx(IconButton, { size: "small", onClick: () => {
+                        }, children: _jsx(TrackSelectorIcon, { fontSize: "small" }) }) }), _jsx(CascadingMenuButton, { tooltip: "View menu", menuItems: () => model.menuItems(), children: _jsx(MoreVertIcon, { fontSize: "small" }) }), _jsx(Tooltip, { title: scalebarOnly ? 'Show tracks' : 'Show ruler only', children: _jsx(IconButton, { size: "small", onClick: () => {
                             model.setScalebarOnly(!scalebarOnly);
                         }, children: scalebarOnly ? (_jsx(AddIcon, { fontSize: "small" })) : (_jsx(RemoveIcon, { fontSize: "small" })) }) }), _jsx(ZoomButton, { model: model, direction: "out", small: true }), _jsx(ZoomButton, { model: model, direction: "in", small: true })] }) }));
 });

package/esm/LinearGenomeView/components/OverviewRubberband.js

@@ -52,9 +52,11 @@ const OverviewRubberband = observer(function OverviewRubberband({ model, overvie
         },
     });
     function mouseDown(event) {
-        event.preventDefault();
-        event.stopPropagation();
-        setStartX(getRelativeX(event, controlsRef.current));
+        if (event.button === 0) {
+            event.preventDefault();
+            event.stopPropagation();
+            setStartX(getRelativeX(event, controlsRef.current));
+        }
     }
     function mouseMove(event) {
         setGuideX(getRelativeX(event, controlsRef.current));

package/esm/LinearGenomeView/components/ResizeAllTracksHandle.js

@@ -40,7 +40,7 @@ function useScrollPortExcess(ref, model, enabled) {
 }
 const ResizeAllTracksHandle = observer(function ResizeAllTracksHandle({ model, }) {
     const ref = useRef(null);
-    const drag = useRef({ from: new Map(), moved: 0 });
+    const drag = useRef({ from: new Map() });
     const { isTopLevelView } = model;
     useScrollPortExcess(ref, model, isTopLevelView);
     return (_jsx("div", { ref: ref, style: isTopLevelView
@@ -54,12 +54,15 @@ const ResizeAllTracksHandle = observer(function ResizeAllTracksHandle({ model, }
                     position: 'absolute',
                     bottom: 0,
                 }, onDragStart: () => {
-                drag.current = { from: model.resizableTrackHeights, moved: 0 };
+                drag.current = { from: model.resizableTrackHeights };
                 for (const track of model.tracks) {
                     track.setResizing(true);
                 }
-            }, onDrag: distance => {
-                drag.current.moved = model.resizeTracks(drag.current.moved + distance, drag.current.from);
+            }, 
+            // no value, so the distance from the press, every track scaled from
+            // where it was
+            onChange: distance => {
+                model.resizeTracks(distance, drag.current.from);
             }, onDragEnd: () => {
                 for (const track of model.tracks) {
                     track.setResizing(false);

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

@@ -1,9 +1,18 @@
-export default function SVGHighlightBand({ coords, height, color, label, labelColor, }: {
+export interface BandGap {
+    top: number;
+    height: number;
+}
+export declare function spansAround(gaps: BandGap[], height: number): {
+    top: number;
+    height: number;
+}[];
+export default function SVGHighlightBand({ coords, height, gaps, color, label, labelColor, }: {
     coords: {
         left: number;
         width: number;
     };
     height: number;
+    gaps: BandGap[];
     color: string;
     label?: string;
     labelColor: string;

package/esm/LinearGenomeView/components/SVGHighlightBand.js

@@ -1,8 +1,20 @@
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { getFillProps } from '@jbrowse/core/util';
+// The stretches of a band `height` tall left once the sorted, disjoint `gaps`
+// are cut out of it.
+export function spansAround(gaps, height) {
+    const edges = [0, ...gaps.flatMap(g => [g.top, g.top + g.height]), height];
+    return edges.flatMap((top, i) => {
+        const bottom = edges[i + 1];
+        return i % 2 === 0 && bottom !== undefined && bottom > top
+            ? [{ top, height: bottom - top }]
+            : [];
+    });
+}
 // One full-height SVG highlight band with an optional label at the top,
 // mirroring the on-screen HighlightBand div: a label wider than its band runs
-// past the band's right edge.
-export default function SVGHighlightBand({ coords, height, color, label, labelColor, }) {
-    return (_jsxs(_Fragment, { children: [_jsx("rect", { x: coords.left, y: 0, width: coords.width, height: height, ...getFillProps(color) }), label ? (_jsx("text", { x: coords.left + 3, y: 2, fontSize: 11, dominantBaseline: "hanging", ...getFillProps(labelColor), children: label })) : null] }));
+// past the band's right edge, and the band leaves out `gaps`, the tracks that
+// do not draw in genomic coordinates.
+export default function SVGHighlightBand({ coords, height, gaps, color, label, labelColor, }) {
+    return (_jsxs(_Fragment, { children: [spansAround(gaps, height).map(span => (_jsx("rect", { x: coords.left, y: span.top, width: coords.width, height: span.height, ...getFillProps(color) }, span.top))), label ? (_jsx("text", { x: coords.left + 3, y: 2, fontSize: 11, dominantBaseline: "hanging", ...getFillProps(labelColor), children: label })) : null] }));
 }

package/esm/LinearGenomeView/components/SearchBox.js

@@ -39,8 +39,9 @@ const SearchBox = observer(function SearchBox({ model, showHelp = true, minWidth
     const { recentLocations, addRecentLocation, clearRecentLocations } = useRecentLocations(assemblyName);
     async function navigate(option) {
         try {
-            await navigateToSelectedOption({ model, assemblyName, option });
-            addRecentLocation(recentLocationOf(option));
+            if (await navigateToSelectedOption({ model, assemblyName, option })) {
+                addRecentLocation(recentLocationOf(option));
+            }
         }
         catch (e) {
             notifySearchFailure(session, e);

package/esm/LinearGenomeView/components/SearchResultsTable.js

@@ -15,7 +15,7 @@ export function filterRows(rows, text) {
 const SearchResultsTable = observer(function SearchResultsTable({ picker, }) {
     const [filter, setFilter] = useState('');
     const rows = filterRows(picker.rows, filter);
-    return (_jsxs(_Fragment, { children: [picker.rows.length > FILTER_AT ? (_jsx(TextField, { autoFocus: true, fullWidth: true, size: "small", margin: "dense", placeholder: "Filter by name, location or track", value: filter, onChange: event => {
+    return (_jsxs(_Fragment, { children: [picker.rows.length > FILTER_AT ? (_jsx(TextField, { autoFocus: true, fullWidth: true, size: "small", margin: "dense", placeholder: "Filter by name, location or track", slotProps: { htmlInput: { 'aria-label': 'Filter search results' } }, value: filter, onChange: event => {
                     setFilter(event.target.value);
                 }, onKeyDown: event => {
                     if (event.key === 'Enter' && rows.length === 1) {
@@ -23,6 +23,6 @@ const SearchResultsTable = observer(function SearchResultsTable({ picker, }) {
                     }
                 }, helperText: filter ? `${rows.length} of ${picker.rows.length}` : undefined })) : null, _jsx(TableContainer, { component: Paper, children: _jsxs(Table, { children: [_jsx(TableHead, { children: _jsxs(TableRow, { children: [_jsx(TableCell, { children: "Name" }), _jsx(TableCell, { align: "right", children: "Location" }), _jsx(TableCell, { align: "right", children: "Track" }), _jsx(TableCell, { align: "right" })] }) }), _jsx(TableBody, { children: rows.map(row => (_jsxs(TableRow, { children: [_jsx(TableCell, { component: "th", scope: "row", children: row.label }), _jsx(TableCell, { align: "right", children: row.location }), _jsx(TableCell, { align: "right", children: _jsx(SanitizedHTML, { html: row.trackName || 'N/A' }) }), _jsx(TableCell, { align: "right", children: _jsx(Button, { onClick: () => {
                                                 void picker.pick(row.id);
-                                            }, color: "primary", variant: "contained", children: "Go" }) })] }, row.id))) })] }) })] }));
+                                            }, color: "primary", variant: "contained", "aria-label": `Go to ${row.label} at ${row.location}`, children: "Go" }) })] }, row.id))) })] }) })] }));
 });
 export default SearchResultsTable;

package/esm/LinearGenomeView/components/TrackContainer.js

@@ -134,7 +134,7 @@ const TrackContainer = observer(function TrackContainer({ model, track, }) {
     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 }, labelBand: model.trackLabelBand(track), children: _jsx(ErrorBoundary, { FallbackComponent: e => (_jsx("div", { className: classes.crashBanner, "data-gesture-owner": "true", children: _jsx(ErrorBanner, { error: e.error, onReset: e.resetErrorBoundary }) })), children: _jsx(TrackRenderingContainer, { model: model, track: track, display: display, ref: setContainer }) }, display.id) }), _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 }, labelBand: model.trackLabelBand(track), children: _jsx(ErrorBoundary, { FallbackComponent: e => (_jsx("div", { className: classes.crashBanner, "data-gesture-owner": "true", children: _jsx(ErrorBanner, { error: e.error, onReset: e.resetErrorBoundary }) })), children: _jsx(TrackRenderingContainer, { model: model, track: track, display: display, ref: setContainer }) }, display.id) }), _jsx(PaddingBlocks, { model: model, offset: outlineOffset }), _jsx(ResizeHandle, { style: { height: RESIZE_HANDLE_HEIGHT }, value: display.height, onChange: height => display.resizeHeight(height - display.height), 
                 // 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/TrackLabelDragHandle.js

@@ -18,9 +18,8 @@ const TrackLabelDragHandle = observer(function TrackLabelDragHandle({ track, })
     const view = containingLgv(track);
     const trackId = track.trackId;
     return (_jsx("span", { draggable: true, className: classes.dragHandle, onDragStart: event => {
-            const target = event.currentTarget;
-            if (target.parentNode) {
-                const parent = target.parentNode;
+            const parent = event.currentTarget.parentElement;
+            if (parent) {
                 event.dataTransfer.setDragImage(parent, 20, 20);
                 view.setDraggingTrackId(track.id);
             }

package/esm/LinearGenomeView/components/fetchSequence.js

@@ -1,5 +1,5 @@
 import { getSequenceAdapterConfig } from '@jbrowse/core/assemblyManager/assembly';
-import { getSession } from '@jbrowse/core/util';
+import { assembleLocString, getSession } from '@jbrowse/core/util';
 export async function fetchSequence(model, regions, opts = {}) {
     const session = getSession(model);
     const assemblyNames = new Set(regions.map(r => r.assemblyName));
@@ -25,10 +25,18 @@ export async function fetchSequence(model, regions, opts = {}) {
     if (!adapterConfig) {
         throw new Error(`assembly ${assemblyName} has no resolved configuration, so its sequence adapter cannot be read`);
     }
-    const sessionId = 'getSequence';
-    return rpcManager.call(sessionId, 'CoreGetFeatures', {
-        adapterConfig,
-        regions,
-        ...opts,
-    });
+    // one call per region: a multi-region fetch merges its regions' streams in
+    // the order they finish, and a region the sequence lacks yields nothing,
+    // where the reader wants one entry per selected region, in selection order
+    return Promise.all(regions.map(async (region) => {
+        const [feature] = await rpcManager.call('getSequence', 'CoreGetFeatures', {
+            adapterConfig,
+            regions: [region],
+            ...opts,
+        });
+        if (!feature) {
+            throw new Error(`no sequence found for ${assembleLocString(region)} in assembly ${assemblyName}`);
+        }
+        return feature;
+    }));
 }

package/esm/LinearGenomeView/components/useRangeSelect.js

@@ -1,6 +1,6 @@
 import { useCallback, useState } from 'react';
 import { getRelativeX } from '@jbrowse/core/util/getRelativeX';
-import { isFromPortal } from '@jbrowse/core/util/pressOwner';
+import { isClaimedPress, isFromPortal } from '@jbrowse/core/util/pressOwner';
 import { useWindowDrag } from '../../shared/useWindowDrag.js';
 import { isOnScalebarRefLabel } from './util.js';
 export function useRangeSelect(ref, model, shiftOnly) {
@@ -45,7 +45,10 @@ export function useRangeSelect(ref, model, shiftOnly) {
         },
     });
     function mouseDown(event) {
-        if (isFromPortal(event) || (shiftOnly && !event.shiftKey)) {
+        if (event.button !== 0 ||
+            (shiftOnly
+                ? !event.shiftKey || isClaimedPress(event)
+                : isFromPortal(event))) {
             return;
         }
         // a press with the refName menu already open reopens it on the label under

package/esm/LinearGenomeView/menuItems.js

@@ -320,7 +320,8 @@ export function buildRubberBandMenuItems(self, launchItems) {
     // reversed region it names neither the base painted at the pixel nor the ends
     // in ascending order, and a `leftRef === rightRef` test calls a selection
     // crossing a collapsed intron one range when it is two.
-    const rangeString = assembleLocStrings(self.getSelectedRegions(leftOffset, rightOffset));
+    const regions = self.getSelectedRegions(leftOffset, rightOffset);
+    const rangeString = assembleLocStrings(regions);
     const launch = [
         ...(self.isTopLevelView
             ? [
@@ -348,7 +349,6 @@ export function buildRubberBandMenuItems(self, launchItems) {
             label: 'Get sequence...',
             icon: MenuOpenIcon,
             onClick: () => {
-                const regions = self.getSelectedRegions(leftOffset, rightOffset);
                 getDialogHost(self).queueDialog(handleClose => [
                     GetSequenceDialog,
                     {
@@ -373,9 +373,9 @@ export function buildRubberBandMenuItems(self, launchItems) {
             label: 'Highlight region',
             icon: Highlighter,
             onClick: () => {
-                const [region] = self.getSelectedRegions(leftOffset, rightOffset);
-                if (region) {
-                    getSession(self).addHighlight(region);
+                const session = getSession(self);
+                for (const region of regions) {
+                    session.addHighlight(region);
                 }
             },
         },