@jbrowse/plugin-linear-genome-view 5.0.0-beta.7 → 5.0.0-beta.9

package/esm/LinearGenomeView/svgcomponents/util.js

@@ -80,7 +80,7 @@ export function defaultTextHeight(fontSize) {
 export function offsetLabelBaselineY(textHeight, fontSize) {
     return textHeight - LABEL_PAD_BOTTOM - labelDescent(fontSize);
 }
-// Baseline for a label inset into the top of the box it draws over ('overlay'
+// Baseline for a label inset into the top of the box it draws over ('overlapping'
 // mode), measured down from that top edge so the ascenders stay inside it.
 export function insetLabelBaselineY(fontSize) {
     return labelBaselineFromTop(LABEL_PAD_TOP, fontSize);
@@ -99,7 +99,14 @@ export function insetLabelBaselineY(fontSize) {
 // scale in each row the only thing saying whether two rows are at the same zoom
 // is their ruler coordinates, which are unreadable at the size a figure is
 // published at. The standalone LGV export has drawn this bar all along.
-export function getRowHeaderLayout({ fontSize, showScalebar, }) {
+//
+// `reserveAssemblyName` keeps the name's band whether or not the row draws one,
+// which is what a stack of one genome at several loci wants: a breakpoint split
+// view names its first row only, and the rest stay the same height as it. The
+// close-ups export is the case that says false — every row there is the
+// host's own assembly, so no row names it and the band is space no glyph is
+// drawn in.
+export function getRowHeaderLayout({ fontSize, showScalebar, reserveAssemblyName = true, }) {
     const label = labelInkHeight(fontSize);
     // the bp label hangs a cap below the bar's line and its own ink box ends a gap
     // above the ruler at y=0
@@ -114,6 +121,14 @@ export function getRowHeaderLayout({ fontSize, showScalebar, }) {
     const assemblyInkTop = scalebarLineY === undefined
         ? -label
         : scalebarLineY - SVG_SCALEBAR_CAP - ROW_GAP - label;
+    // up from the ruler to the topmost ink the row draws above it: the assembly
+    // label's box where there is one to reserve, else the scalebar's upper cap,
+    // else nothing
+    const bandHeight = reserveAssemblyName
+        ? -assemblyInkTop
+        : scalebarLineY === undefined
+            ? 0
+            : SVG_SCALEBAR_CAP - scalebarLineY;
     return {
         // undefined rather than an unused number: a row without a scalebar has no
         // line to place, and the caller draws nothing
@@ -123,9 +138,7 @@ export function getRowHeaderLayout({ fontSize, showScalebar, }) {
         assemblyLabelBaselineY: showScalebar
             ? labelBaselineFromTop(assemblyInkTop, fontSize)
             : 0,
-        // up from the ruler to the top of the topmost ink box — the assembly
-        // label's, in both cases
-        bandHeight: -assemblyInkTop,
+        bandHeight,
     };
 }
 // Compact vertical layout for the exported header: rows (assembly name,
@@ -161,7 +174,6 @@ export function getHeaderLayout({ fontSize, showCytobands, rulerHeight, }) {
 // Ruler tick geometry, shared by the tick marks and their number labels.
 export const RULER_MAJOR_TICK = 5;
 export const RULER_MINOR_TICK = 3;
-export const RULER_TICK_FONT_SIZE = 11;
 // clearance between the tick-number baseline and the marks below it
 const RULER_TICK_LABEL_GAP = 2;
 // Vertical positions within a ruler of the given budget: tick marks hang just
@@ -180,9 +192,17 @@ export function getRulerLayout(rulerHeight) {
 // 13, and both ends of the glyphs at any smaller export font.
 export const refNameLabelBoxHeight = labelInkHeight(REF_NAME_LABEL_FONT_SIZE);
 export const refNameLabelBaselineY = labelBaselineFromTop(0, REF_NAME_LABEL_FONT_SIZE);
-// space the label pushes a track down by; only 'offset' mode does
-export function labelOffset(trackLabels, textHeight) {
-    return trackLabels === 'offset' ? textHeight : 0;
+// The mode one track's label is drawn in. 'overlapping' yields to 'offset' for a
+// display that `prefersOffset`, as TrackContainer does on screen: its left edge
+// carries content — an axis, a sample's genotypes — the label would print over.
+export function trackLabelMode(track, trackLabels) {
+    return trackLabels === 'overlapping' && track.displays[0]?.prefersOffset
+        ? 'offset'
+        : trackLabels;
+}
+// space the label pushes a track's body down by; only 'offset' mode does
+export function labelOffset(track, trackLabels, textHeight) {
+    return trackLabelMode(track, trackLabels) === 'offset' ? textHeight : 0;
 }
 // Gap between a 'left' track label's right edge and the track body.
 // SVGTrackLabel right-aligns its text at `trackLabelOffset - TRACK_LABEL_GAP`,
@@ -216,23 +236,24 @@ export function trackLabelLeftOffset({ tracks, trackLabels, fontSize, fontFamily
 }
 // vertical box a single track occupies. Shared by totalHeight (sum) and
 // trackBoxOffsets (prefix-sum) so the two can't drift.
-export function trackBoxHeight(track, textOffset) {
-    return track.displays[0].height + textOffset + trackSpacing;
+export function trackBoxHeight(track, trackLabels, textHeight) {
+    return (track.displays[0].height +
+        labelOffset(track, trackLabels, textHeight) +
+        trackSpacing);
 }
 // Top y of each track's box within a stack of them. SVGTracks lays the bodies
 // out with it and the breakpoint-split export anchors its overlay ribbons with
 // it, so one implementation rather than two prefix-sums that must agree —
 // they drifted by trackSpacing per track when they didn't.
-export function trackBoxOffsets(tracks, textOffset) {
+export function trackBoxOffsets(tracks, trackLabels, textHeight) {
     const offsets = [];
     let total = 0;
     for (const track of tracks) {
         offsets.push(total);
-        total += trackBoxHeight(track, textOffset);
+        total += trackBoxHeight(track, trackLabels, textHeight);
     }
     return offsets;
 }
-export function totalHeight(tracks, textHeight, trackLabels) {
-    const textOffset = labelOffset(trackLabels, textHeight);
-    return sum(tracks.map(t => trackBoxHeight(t, textOffset)));
+export function totalHeight(tracks, trackLabels, textHeight) {
+    return sum(tracks.map(t => trackBoxHeight(t, trackLabels, textHeight)));
 }

package/esm/LinearGenomeView/types.d.ts

@@ -1,5 +1,5 @@
 import type { LinearGenomeViewStateModel } from './model.ts';
-import type { HighlightType } from '@jbrowse/core/util/highlights';
+import type { HighlightInput, HighlightType } from '@jbrowse/core/util/highlights';
 import type { TrackInit } from '@jbrowse/core/util/tracks';
 import type { SnapshotIn } from '@jbrowse/mobx-state-tree';
 export interface BpOffset {
@@ -13,8 +13,8 @@ export interface BpOffset {
     assemblyName?: string;
     oob?: boolean;
 }
-export type { ExportSvgOptions, TrackLabelMode, } from '@jbrowse/display-kit/types';
-export type { HighlightType };
+export type { ExportSvgOptions, TrackLabelMode, ViewTrackLabelMode, } from '@jbrowse/display-kit/types';
+export type { HighlightInput, HighlightType };
 export interface NavLocation {
     refName: string;
     start?: number;
@@ -34,11 +34,12 @@ export interface InitState {
      */
     loc?: string;
     grow?: number;
+    showHitTrack?: boolean;
     assembly: string;
     displayedRegionNames?: string[];
     tracks?: TrackInit[];
     tracklist?: boolean;
     nav?: boolean;
-    highlight?: (string | HighlightType)[];
+    highlight?: (string | HighlightInput)[];
 }
 export type LinearGenomeViewLaunchProps = Partial<Omit<SnapshotIn<LinearGenomeViewStateModel>, keyof InitState | 'id' | 'type' | 'launch'>>;

package/esm/LinearGenomeView/util.d.ts

@@ -112,48 +112,31 @@ export interface ScalebarRefNameLabel {
 }
 /**
  * Builds the refName labels drawn along the scalebar as plain data (no JSX): one
- * label per run of same-refName regions (deduped so collapsed introns don't
- * repeat the name) plus a "sticky" label pinned to the left edge naming the
- * refName under the viewport's left border.
+ * label per run of same-refName regions, the leftmost of them "sticky" — pinned
+ * so the run under the left edge stays named once its own left edge scrolls off.
  *
- * `caption` is the row-level chip at the viewport's left edge, and it says two
- * things: which assembly this row is (`prefix`, an assembly name, synteny only)
- * and whether the row is flipped. Without it a row of stacked genomes would
- * label some rows with the assembly name and some without, depending only on
- * how wide their leftmost chromosome happens to be.
+ * `caption` is the row-level chip at the viewport's left edge: which assembly
+ * the row is (`prefix`, synteny only) and whether the whole row is flipped. The
+ * chip takes `captionSpanPx` of the strip and the labels get the rest, so the
+ * sticky label pins to the chip's right edge ("hg38" then "chr1") and rides the
+ * run under THAT edge. A run the chip covers entirely goes unnamed, and the
+ * chip is not shortened to uncover it: a width fitted to the run under it
+ * changes with every run that pans past, and a fixed cap short enough to
+ * uncover a 55px chromosome cuts ordinary names. The assembly's `displayName`
+ * is where a long name gets shortened.
  *
- * The assembly name alone folds into the sticky label instead — "prefix:refName"
- * — whenever the two would collide at the left edge, and stands alone when the
- * sticky label sits far enough right not to (a view scrolled left of its first
- * region, so the row's data starts mid-viewport) or when there is no sticky
- * label at all.
+ * `orientation` decides the ` [rev]` marker, following `assembleLocStrings`: say
+ * it where it distinguishes, once where it does not.
  *
- * `orientation` decides the ` [rev]` marker, and it is the row's
- * (`displayedRegionsOrientation`) rather than anything read off the blocks —
- * blocks cover the window, and a row is flipped or not whatever part of it you
- * are looking at. The rule is `assembleLocStrings`': say it where it
- * distinguishes, once where it does not.
- *
- * - `reversed`: the whole row is flipped, which is a fact about the row, so the
- *   caption carries it and NO name does. The caption cannot fold in this state
- *   — the sticky label is pushed clear of it instead — because a marker sitting
- *   on a chromosome name is how the mixed case spells a fact about that one
- *   region. `chr1 [rev] | chr2` would otherwise mean both "the row is flipped,
- *   said once" and "chr1 is flipped and chr2 is not", in identical pixels.
- * - `mixed`: only some regions are flipped — reachable through the label menu's
- *   per-region "Reverse region" — so every reversed run is marked and the
- *   forward ones are left alone. Here the marker on a name is the only thing
- *   telling two labels apart.
+ * - `reversed`: the caption carries the marker and no name does. A marker on a
+ *   chromosome name is how the mixed case flags that one region.
+ * - `mixed`: every reversed run is marked. A marked label that fails the fit
+ *   test falls back to the bare name rather than dropping.
  * - `forward`: no marker.
  *
- * Saying it once is the point: a flipped whole-genome row would otherwise
- * repeat `[rev]` after all 24 chromosomes to say a single thing about the row.
- *
- * Under `mixed` the marker never costs a name: a suffixed label that fails the
- * fit test falls back to the bare name rather than being dropped. Widening the
- * text moves the region width a name needs from ~30px to ~56px at 11px bold,
- * and a feature meant to surface information should not be deleting chromosome
- * names in the narrow half of that gap.
+ * `maxWidth` is the whole label box, `paddingLeft` included — both consumers
+ * clip from the box's left edge. A name is drawn whole or not at all: clipped
+ * mid-glyph, "chr16" reads as "chr1".
  */
 export declare function getScalebarRefNameLabels({ blocks, offsetPx, prefix, orientation, }: {
     blocks: BaseBlock[];

package/esm/LinearGenomeView/util.js

@@ -177,13 +177,12 @@ function refNameRuns(blocks) {
     return runs;
 }
 /**
- * Index of the run carrying the "sticky" refName label pinned to the left edge:
- * the rightmost run whose left edge has scrolled off the left of the viewport,
- * or the first run when none have.
+ * Index of the run carrying the "sticky" refName label pinned to the strip's
+ * left edge: the rightmost run starting left of `leftEdgePx` (block frame), or
+ * the first run when none does.
  */
-function stickyRunIndex(runs, offsetPx) {
-    const scrolledOff = runs.findLastIndex(run => run.offsetPx < offsetPx);
-    return scrolledOff === -1 ? 0 : scrolledOff;
+function stickyRunIndex(runs, leftEdgePx) {
+    return Math.max(0, runs.findLastIndex(run => run.offsetPx < leftEdgePx));
 }
 export function regionsOrientation(regions) {
     const first = !!regions[0]?.reversed;
@@ -202,161 +201,79 @@ export function regionsOrientation(regions) {
  * upstream is whole-or-nothing, and it would go on believing a glyph fits.
  */
 const REV_MARKER = ' [rev]';
-/** Clearance between the standalone assembly-name chip and a sticky label. */
-const PREFIX_GAP = 4;
-/** Left inset of a non-sticky refName label from its region's left edge. */
-const REF_NAME_LABEL_PADDING_PX = 7;
+/** Clearance between the caption chip and the sticky label after it. */
+const CAPTION_GAP = 4;
 /**
- * translateX, maxWidth and paddingLeft for one refName label. Sticky labels
- * start at the viewport's left edge; others start at their run's left edge.
- *
- * maxWidth is the width of the whole label box, paddingLeft included, so the
- * text has `maxWidth - paddingLeft` to draw in — that is what both consumers
- * clip to (a border-box max-width on the span, an SVG clip rect from the box's
- * own left edge). The caller decides whether the name it wants to draw fits in
- * that (see refNameLabelWidth); a name is drawn whole or not at all.
+ * Left inset of a non-sticky refName label from its region's left edge, clear
+ * of the 3px region divider drawn there.
  */
-function refLabelLayout({ run, offsetPx, sticky, 
-// left-edge x a sticky label may not start before, so a caption chip drawn
-// there keeps the strip to itself. Zero wherever the caption folds into the
-// label instead (the assembly prefix does)
-minTransform = 0, }) {
-    const transform = sticky
-        ? Math.max(minTransform, -offsetPx)
-        : run.offsetPx - offsetPx - 1;
-    // block-frame x where the label actually starts. Derived from `transform` (=
-    // transform + offsetPx) so the width-to-run-end clip stays in lockstep with
-    // where the label is drawn: a sticky label pins to the run's left edge, not
-    // the viewport's, whenever the view is left-overscrolled (offsetPx < 0) —
-    // reading offsetPx directly there over-counted the available width by
-    // |offsetPx|, letting the name bleed past its run's right edge.
-    const labelStartPx = transform + offsetPx;
-    // A non-sticky label's transform anchors at the same x as the region
-    // divider drawn just to its left (SVGRegionSeparators, a 3px bar spanning
-    // local [0,3] from this same run.offsetPx edge), so paddingLeft must clear
-    // that bar plus a few px of breathing room, else the text visually touches
-    // the divider. Sticky labels sit at the viewport's own left edge, no divider.
-    const paddingLeft = sticky ? 0 : REF_NAME_LABEL_PADDING_PX;
-    return { transform, maxWidth: run.endPx - labelStartPx - 1, paddingLeft };
-}
+const REF_NAME_LABEL_PADDING_PX = 7;
 /**
  * Builds the refName labels drawn along the scalebar as plain data (no JSX): one
- * label per run of same-refName regions (deduped so collapsed introns don't
- * repeat the name) plus a "sticky" label pinned to the left edge naming the
- * refName under the viewport's left border.
- *
- * `caption` is the row-level chip at the viewport's left edge, and it says two
- * things: which assembly this row is (`prefix`, an assembly name, synteny only)
- * and whether the row is flipped. Without it a row of stacked genomes would
- * label some rows with the assembly name and some without, depending only on
- * how wide their leftmost chromosome happens to be.
+ * label per run of same-refName regions, the leftmost of them "sticky" — pinned
+ * so the run under the left edge stays named once its own left edge scrolls off.
  *
- * The assembly name alone folds into the sticky label instead — "prefix:refName"
- * — whenever the two would collide at the left edge, and stands alone when the
- * sticky label sits far enough right not to (a view scrolled left of its first
- * region, so the row's data starts mid-viewport) or when there is no sticky
- * label at all.
+ * `caption` is the row-level chip at the viewport's left edge: which assembly
+ * the row is (`prefix`, synteny only) and whether the whole row is flipped. The
+ * chip takes `captionSpanPx` of the strip and the labels get the rest, so the
+ * sticky label pins to the chip's right edge ("hg38" then "chr1") and rides the
+ * run under THAT edge. A run the chip covers entirely goes unnamed, and the
+ * chip is not shortened to uncover it: a width fitted to the run under it
+ * changes with every run that pans past, and a fixed cap short enough to
+ * uncover a 55px chromosome cuts ordinary names. The assembly's `displayName`
+ * is where a long name gets shortened.
  *
- * `orientation` decides the ` [rev]` marker, and it is the row's
- * (`displayedRegionsOrientation`) rather than anything read off the blocks —
- * blocks cover the window, and a row is flipped or not whatever part of it you
- * are looking at. The rule is `assembleLocStrings`': say it where it
- * distinguishes, once where it does not.
+ * `orientation` decides the ` [rev]` marker, following `assembleLocStrings`: say
+ * it where it distinguishes, once where it does not.
  *
- * - `reversed`: the whole row is flipped, which is a fact about the row, so the
- *   caption carries it and NO name does. The caption cannot fold in this state
- *   — the sticky label is pushed clear of it instead — because a marker sitting
- *   on a chromosome name is how the mixed case spells a fact about that one
- *   region. `chr1 [rev] | chr2` would otherwise mean both "the row is flipped,
- *   said once" and "chr1 is flipped and chr2 is not", in identical pixels.
- * - `mixed`: only some regions are flipped — reachable through the label menu's
- *   per-region "Reverse region" — so every reversed run is marked and the
- *   forward ones are left alone. Here the marker on a name is the only thing
- *   telling two labels apart.
+ * - `reversed`: the caption carries the marker and no name does. A marker on a
+ *   chromosome name is how the mixed case flags that one region.
+ * - `mixed`: every reversed run is marked. A marked label that fails the fit
+ *   test falls back to the bare name rather than dropping.
  * - `forward`: no marker.
  *
- * Saying it once is the point: a flipped whole-genome row would otherwise
- * repeat `[rev]` after all 24 chromosomes to say a single thing about the row.
- *
- * Under `mixed` the marker never costs a name: a suffixed label that fails the
- * fit test falls back to the bare name rather than being dropped. Widening the
- * text moves the region width a name needs from ~30px to ~56px at 11px bold,
- * and a feature meant to surface information should not be deleting chromosome
- * names in the narrow half of that gap.
+ * `maxWidth` is the whole label box, `paddingLeft` included — both consumers
+ * clip from the box's left edge. A name is drawn whole or not at all: clipped
+ * mid-glyph, "chr16" reads as "chr1".
  */
 export function getScalebarRefNameLabels({ blocks, offsetPx, prefix, orientation = 'forward', }) {
-    const hasPrefix = prefix !== undefined && prefix !== '';
-    const rowIsReversed = orientation === 'reversed';
-    const captionText = rowIsReversed
-        ? `${hasPrefix ? prefix : ''}${REV_MARKER}`.trimStart()
-        : prefix;
-    // the caption chip occupies the viewport's left edge, so a sticky label
-    // starting inside that span has to yield: absorb the assembly name, or, where
-    // the caption carries the row's orientation and so cannot fold, start after
-    // it. The gap is part of the span: a sticky label carries no padding of its
-    // own, so one starting at exactly the chip's right edge abuts it and the two
-    // read as a single word ("volvoxctgA") for the few px of scroll around the
-    // threshold
-    const captionSpanPx = captionText
-        ? refNameLabelWidth(captionText) + PREFIX_GAP
-        : 0;
+    const caption = [prefix, orientation === 'reversed' ? REV_MARKER.trim() : undefined]
+        .filter(Boolean)
+        .join(' ') || undefined;
+    const captionSpanPx = caption ? refNameLabelWidth(caption) + CAPTION_GAP : 0;
     const runs = refNameRuns(blocks);
-    const stickyIdx = stickyRunIndex(runs, offsetPx);
+    const stickyIdx = stickyRunIndex(runs, offsetPx + captionSpanPx);
     const labels = [];
-    let stickyHasPrefix = false;
     for (const [i, run] of runs.entries()) {
         const sticky = i === stickyIdx;
-        // A non-sticky run starting left of the viewport is entirely off-screen:
-        // the sticky run is by definition the rightmost one starting there, so
-        // every earlier run also *ends* left of the viewport. Its label would just
-        // repeat the name the sticky label already shows, drawn off-canvas —
-        // invisible on screen (overflow:clip) but bleeding into the margin of an
-        // SVG export, which has no such clip.
-        const runStart = run.offsetPx >= offsetPx && run.isLeftEndOfDisplayedRegion;
-        if (!(sticky || runStart)) {
+        // runs left of the sticky one end under the caption or off screen
+        if (i < stickyIdx || !(sticky || run.isLeftEndOfDisplayedRegion)) {
             continue;
         }
-        const layout = refLabelLayout({
-            run,
-            offsetPx,
-            sticky,
-            minTransform: rowIsReversed ? captionSpanPx : 0,
-        });
-        const withPrefix = !rowIsReversed && sticky && hasPrefix && layout.transform < captionSpanPx;
-        const name = withPrefix ? `${prefix}:${run.refName}` : run.refName;
-        // draw the name whole or not at all: a name clipped mid-glyph reads as a
-        // different chromosome ("LG2" cut to "LG"), and measuring it means a short
-        // name gets its label in a region a fixed minimum width would have skipped.
-        // The marker is the one part that degrades instead of dropping the label
+        const runStartPx = run.offsetPx - offsetPx;
+        const transform = sticky
+            ? Math.max(captionSpanPx, runStartPx)
+            : runStartPx - 1;
+        const paddingLeft = sticky ? 0 : REF_NAME_LABEL_PADDING_PX;
+        const maxWidth = run.endPx - offsetPx - transform - 1;
         const text = (orientation === 'mixed' && run.reversed
-            ? [`${name}${REV_MARKER}`, name]
-            : [name]).find(candidate => layout.maxWidth >= layout.paddingLeft + refNameLabelWidth(candidate));
-        if (text === undefined) {
-            continue;
+            ? [`${run.refName}${REV_MARKER}`, run.refName]
+            : [run.refName]).find(candidate => maxWidth >= paddingLeft + refNameLabelWidth(candidate));
+        if (text !== undefined) {
+            labels.push({
+                key: run.key,
+                refName: run.refName,
+                displayedRegionIndex: run.firstRegionIndex,
+                lastDisplayedRegionIndex: run.lastRegionIndex,
+                sticky,
+                transform,
+                maxWidth,
+                paddingLeft,
+                text,
+            });
         }
-        stickyHasPrefix ||= withPrefix;
-        labels.push({
-            key: run.key,
-            refName: run.refName,
-            displayedRegionIndex: run.firstRegionIndex,
-            lastDisplayedRegionIndex: run.lastRegionIndex,
-            sticky,
-            transform: layout.transform,
-            maxWidth: layout.maxWidth,
-            paddingLeft: layout.paddingLeft,
-            text,
-        });
     }
-    return {
-        labels,
-        // the chip to draw at the left edge, or undefined for none. A caption
-        // carrying the orientation always draws; one carrying only the assembly
-        // name draws when no sticky label folded it in
-        caption: rowIsReversed || (hasPrefix && !stickyHasPrefix)
-            ? captionText
-            : undefined,
-        captionSpanPx,
-    };
+    return { labels, caption, captionSpanPx };
 }
 /**
  * Screen-x span a refName label paints over: its padding and its glyphs, which