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

package/esm/LinearGenomeView/svgcomponents/renderViewTracks.d.ts

@@ -1,4 +1,5 @@
 import type { ExportSvgOptions, TrackLabelMode } from '../types.ts';
+import type { LgvSvgExportable } from '@jbrowse/display-kit/renderDisplaySvg';
 import type { ExportSvgDisplayOptions } from '@jbrowse/display-kit/types';
 import type { ThemeOptions } from '@mui/material';
 import type { ReactNode } from 'react';
@@ -6,7 +7,8 @@ export interface SvgExportTrack {
     minimized: boolean;
     displays: {
         height: number;
-        svgLegendWidth?: () => number;
+        regionTooLarge?: boolean;
+        svgSidebarWidth?: LgvSvgExportable['svgSidebarWidth'];
         /**
          * Optional, and the option is the point: SVG export is a substantial extra
          * implementation for a display type, and a third-party plugin that has not
@@ -21,13 +23,18 @@ export interface SvgExportTrack {
 export interface ViewTracksSvg<T> {
     /** the tracks that were rendered, in the order they were laid out */
     tracks: T[];
+    /**
+     * `legendHeight` is the room a track's key has in the gutter, absent for a
+     * track with no key to draw
+     */
     displayResults: {
         track: T;
         result: ReactNode;
+        legendHeight?: number;
     }[];
     /** total height of the stack, valid only because the renders above resolved */
     tracksHeight: number;
-    /** 0 unless `reserveLegendWidth` was asked for */
+    /** px the caller widens its canvas by for the keys right of the plot */
     legendWidth: number;
     /**
      * Visible tracks left out because their display implements no `renderSvg`.
@@ -40,30 +47,28 @@ export interface ViewTracksSvg<T> {
  * One view's worth of exported track bodies: which tracks are in, their
  * rendered SVG, and how tall the stack ends up.
  *
- * It exists to own the two orderings that each of the three view exports got
- * wrong at least once, because neither is visible at a call site that merely
- * lists the same statements in some order:
+ * It exists to own an ordering that each of the three view exports got wrong at
+ * least once, because it is not visible at a call site that merely lists the
+ * same statements in some order: the geometry is measured **after** the
+ * awaits.
  *
- * - `legendWidth` is measured **before** the awaits, because it is an input to
- *   them: a display draws its legend beside its body or floating over it
- *   depending on whether the container reserved room. That is why
- *   `svgLegendWidth` is specified as a function of the *settings* and not of
- *   the loaded data — see LinearHicDisplay's implementation.
- * - `tracksHeight` is measured **after** them. A display whose height follows
- *   its data (grow mode; `LinearMultiRowFeatureDisplay` is `nrow *
- *   effectiveRowHeight`) only reaches its final height once `renderSvg`'s
- *   readiness wait resolves, and `SVGTracks` re-reads `displays[0].height`
- *   later still. Measuring up front sized the canvas for the pre-fetch height
- *   and the taller bodies ran off the bottom of the export — and in the
- *   breakpoint-split export it also desynced the overlay anchors, resolved
- *   after, from the view tops, which weren't.
+ * - `tracksHeight`: a display whose height follows its data (grow mode;
+ *   `LinearMultiRowFeatureDisplay` is `nrow * effectiveRowHeight`) only reaches
+ *   its final height once `renderSvg`'s readiness wait resolves, and
+ *   `SVGTracks` re-reads `displays[0].height` later still. Measuring up front
+ *   sized the canvas for the pre-fetch height and the taller bodies ran off the
+ *   bottom of the export — and in the breakpoint-split export it also desynced
+ *   the overlay anchors, resolved after, from the view tops, which weren't.
+ * - `legendWidth`: most keys list what was loaded, and on a headless export
+ *   (jbrowse-img) nothing has loaded before the waits. Measured after, a track
+ *   with no key reserves nothing and the figure has no empty strip.
  *
  * The minimized filter and the track order are here for the same reason: the
  * reserved height, the rendered bodies, the label gutter and (breakpoint-split)
  * the ribbon anchors must all be derived from one list, and pinned tracks are
  * drawn at the top of a view on screen.
  */
-export declare function renderViewTracks<T extends SvgExportTrack>({ view, opts, theme, textHeight, trackLabels, reserveLegendWidth, }: {
+export declare function renderViewTracks<T extends SvgExportTrack>({ view, opts, theme, textHeight, trackLabels, }: {
     view: {
         pinnedTracks: T[];
         unpinnedTracks: T[];
@@ -72,5 +77,4 @@ export declare function renderViewTracks<T extends SvgExportTrack>({ view, opts,
     theme: ThemeOptions | undefined;
     textHeight: number;
     trackLabels: TrackLabelMode;
-    reserveLegendWidth?: boolean;
 }): Promise<ViewTracksSvg<T>>;

package/esm/LinearGenomeView/svgcomponents/renderViewTracks.js

@@ -1,34 +1,33 @@
 import { awaitSvgRenders } from '@jbrowse/core/svg/svgReady';
 import { max } from '@jbrowse/core/util';
-import { totalHeight } from './util.js';
+import { svgLegendGutterWidth } from '@jbrowse/display-kit/renderDisplaySvg';
+import { labelOffset, totalHeight, trackBoxOffsets } from './util.js';
 /**
  * One view's worth of exported track bodies: which tracks are in, their
  * rendered SVG, and how tall the stack ends up.
  *
- * It exists to own the two orderings that each of the three view exports got
- * wrong at least once, because neither is visible at a call site that merely
- * lists the same statements in some order:
+ * It exists to own an ordering that each of the three view exports got wrong at
+ * least once, because it is not visible at a call site that merely lists the
+ * same statements in some order: the geometry is measured **after** the
+ * awaits.
  *
- * - `legendWidth` is measured **before** the awaits, because it is an input to
- *   them: a display draws its legend beside its body or floating over it
- *   depending on whether the container reserved room. That is why
- *   `svgLegendWidth` is specified as a function of the *settings* and not of
- *   the loaded data — see LinearHicDisplay's implementation.
- * - `tracksHeight` is measured **after** them. A display whose height follows
- *   its data (grow mode; `LinearMultiRowFeatureDisplay` is `nrow *
- *   effectiveRowHeight`) only reaches its final height once `renderSvg`'s
- *   readiness wait resolves, and `SVGTracks` re-reads `displays[0].height`
- *   later still. Measuring up front sized the canvas for the pre-fetch height
- *   and the taller bodies ran off the bottom of the export — and in the
- *   breakpoint-split export it also desynced the overlay anchors, resolved
- *   after, from the view tops, which weren't.
+ * - `tracksHeight`: a display whose height follows its data (grow mode;
+ *   `LinearMultiRowFeatureDisplay` is `nrow * effectiveRowHeight`) only reaches
+ *   its final height once `renderSvg`'s readiness wait resolves, and
+ *   `SVGTracks` re-reads `displays[0].height` later still. Measuring up front
+ *   sized the canvas for the pre-fetch height and the taller bodies ran off the
+ *   bottom of the export — and in the breakpoint-split export it also desynced
+ *   the overlay anchors, resolved after, from the view tops, which weren't.
+ * - `legendWidth`: most keys list what was loaded, and on a headless export
+ *   (jbrowse-img) nothing has loaded before the waits. Measured after, a track
+ *   with no key reserves nothing and the figure has no empty strip.
  *
  * The minimized filter and the track order are here for the same reason: the
  * reserved height, the rendered bodies, the label gutter and (breakpoint-split)
  * the ribbon anchors must all be derived from one list, and pinned tracks are
  * drawn at the top of a view on screen.
  */
-export async function renderViewTracks({ view, opts, theme, textHeight, trackLabels, reserveLegendWidth = false, }) {
+export async function renderViewTracks({ view, opts, theme, textHeight, trackLabels, }) {
     // Partitioned before anything is measured, so a skipped track reserves no
     // height and takes no place in the label gutter — the alternative is a figure
     // with a labelled empty band where the track would have been. One pass, so
@@ -42,25 +41,39 @@ export async function renderViewTracks({ view, opts, theme, textHeight, trackLab
             (track.displays[0]?.renderSvg ? tracks : skippedTracks).push(track);
         }
     }
-    const legendWidth = reserveLegendWidth
-        ? max(tracks.map(track => track.displays[0].svgLegendWidth?.() ?? 0), 0)
-        : 0;
     // `awaitSvgRenders` over `Promise.all`: a track whose data won't load fails
     // the export, and a view with three broken tracks should say so once rather
     // than name whichever rejected first
     const displayResults = await awaitSvgRenders(tracks.map(async (track) => ({
         track,
-        result: await track.displays[0].renderSvg({
-            ...opts,
-            theme,
-            legendWidth,
-        }),
+        result: await track.displays[0].renderSvg({ ...opts, theme }),
     })));
+    const tracksHeight = totalHeight(tracks, trackLabels, textHeight);
+    const keyed = tracks.map(track => !track.displays[0].regionTooLarge &&
+        svgLegendGutterWidth(track.displays[0], theme, Infinity) > 0);
+    const bodyTops = trackBoxOffsets(tracks, trackLabels, textHeight).map((top, i) => top + labelOffset(tracks[i], trackLabels, textHeight));
+    // A key runs from its body's top to the next keyed body's, or to the foot of
+    // the stack, so a long key beside a short track carries on past the unkeyed
+    // tracks below it before it cuts to "+N more".
+    const legendHeights = keyed.map((isKeyed, i) => {
+        const next = keyed.findIndex((k, j) => k && j > i);
+        return isKeyed
+            ? (next === -1 ? tracksHeight : bodyTops[next]) - bodyTops[i]
+            : undefined;
+    });
     return {
         tracks,
-        displayResults,
-        tracksHeight: totalHeight(tracks, textHeight, trackLabels),
-        legendWidth,
+        displayResults: displayResults.map((r, i) => ({
+            ...r,
+            legendHeight: legendHeights[i],
+        })),
+        tracksHeight,
+        legendWidth: max(tracks.map((track, i) => {
+            const height = legendHeights[i];
+            return height === undefined
+                ? 0
+                : svgLegendGutterWidth(track.displays[0], theme, height);
+        }), 0),
         skippedTracks,
     };
 }

package/esm/LinearGenomeView/svgcomponents/useViewSvgFigure.js

@@ -1,17 +1,14 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { memo, useCallback, useEffect, useRef, useSyncExternalStore, } from 'react';
+import { SvgThemeProviders } from '@jbrowse/core/svg/SvgThemeProviders';
 import { exportMargin } from '@jbrowse/core/svg/constants';
+import { svgNodeId } from '@jbrowse/core/svg/svgId';
 import { svgTrackName } from '@jbrowse/core/svg/trackNames';
-import { StyleThemeProvider } from '@jbrowse/core/ui/PaletteContext';
-import { resolveStyleTheme } from '@jbrowse/core/ui/styleTheme';
-import { createJBrowseTheme } from '@jbrowse/core/ui/theme';
 import { getSession } from '@jbrowse/core/util';
 import { useFetch } from '@jbrowse/core/util/useFetch';
-import { isAlive } from '@jbrowse/mobx-state-tree';
-import { ThemeProvider } from '@mui/material';
+import { getSnapshot, isAlive } from '@jbrowse/mobx-state-tree';
 import { reaction } from 'mobx';
-import SVGRowHeader from './SVGRowHeader.js';
-import SVGView from './SVGView.js';
+import SVGStackedRow from './SVGStackedRow.js';
 import { useFrozenFigureContract, useOneFigurePerView, } from './figureContract.js';
 import { renderViewTracks } from './renderViewTracks.js';
 import { defaultTextHeight, getRowHeaderLayout, trackLabelLeftOffset, } from './util.js';
@@ -19,12 +16,11 @@ import { defaultTextHeight, getRowHeaderLayout, trackLabelLeftOffset, } from './
  * One figure: every visible track rendered to SVG elements, and the geometry
  * that lays them out.
  *
- * `renderViewTracks` owns the two orderings this cannot state for itself — the
- * legend gutter measured before the renders (a display draws its key beside the
- * plot or floating over it depending on whether the container reserved room),
- * the stack height after them (a display whose height follows its data only
- * reaches its final height once its readiness wait resolves). Everything read
- * below is read after the awaits for the same reason.
+ * `renderViewTracks` owns the ordering this cannot state for itself: the stack
+ * height and the legend gutter are measured after the renders, since a
+ * display's height and its key follow data that lands only once its readiness
+ * wait resolves. Everything read below is read after the awaits for the same
+ * reason.
  */
 async function renderFigure(view, opts) {
     const { fontSize, rulerHeight, trackLabels, rasterizeLayers, showScalebar } = opts;
@@ -42,9 +38,6 @@ async function renderFigure(view, opts) {
         theme,
         textHeight,
         trackLabels,
-        // an inline figure has room to give: a legend sits beside the plot rather
-        // than over it
-        reserveLegendWidth: true,
     });
     // the room the row header needs *above* its own origin — it draws the assembly
     // name and the scalebar at negative y, so the caller reserves the band and
@@ -64,7 +57,6 @@ async function renderFigure(view, opts) {
         height: bandHeight + rulerHeight + tracksHeight + opts.margin,
         bandHeight,
         tracksHeight,
-        legendWidth,
         trackLabelOffset,
         textHeight,
         locstring: view.visibleLocStrings,
@@ -87,17 +79,16 @@ async function renderFigure(view, opts) {
  * render. Where it matters, this line is the only thing holding the two halves
  * together.
  *
- * Both providers, as `wrapSvgExport` mounts for the file path, and for the same
- * reason: the chrome takes its colors from the Material UI theme and a
- * `makeStyles` component would take its own from the style theme, so a figure
- * mounted in a host that installs neither would otherwise draw itself in
- * JBrowse's *default light* theme whatever the session is set to.
+ * The export's theme providers, as the file path mounts them: a host that
+ * installs neither would otherwise get JBrowse's default light theme whatever
+ * the session is set to.
  *
  * No background rect, unlike a file — that has nothing behind it, and a figure
- * in a page has the page. No `resetSvgClipIds` either, and that is the opposite
- * decision from the file path on purpose: the counter is document-global, so
- * resetting it here would renumber ids that a figure already on the page is
- * pointing at. Letting it run is what makes several live figures unique.
+ * in a page has the page. No `withFreshSvgClipIds` either, and that is the
+ * opposite decision from the file path on purpose: the counter is
+ * document-global, so restarting it here would reuse ids that a figure already
+ * on the page is pointing at. Letting it run is what makes several live figures
+ * unique.
  */
 const FrozenSvgFigure = memo(function FrozenSvgFigure({ view, snapshot, }) {
     const { width, height, margin, theme } = snapshot;
@@ -105,20 +96,14 @@ const FrozenSvgFigure = memo(function FrozenSvgFigure({ view, snapshot, }) {
     // INSIDE the tree, which the memo above is not between
     const ref = useRef(null);
     useFrozenFigureContract(ref, snapshot);
-    return (_jsx(ThemeProvider, { theme: createJBrowseTheme(theme), children: _jsx(StyleThemeProvider, { theme: resolveStyleTheme({ configTheme: theme }), children: _jsx("svg", { ref: ref, width: width, height: height, viewBox: `0 0 ${width} ${height}`, 
-                // It is a vector, so a narrower container scales it rather than
-                // clipping it; the height attribute stays, so a box reserved for it
-                // does not change size when that happens. Deliberately not a prop:
-                // anything passed per-render would have to reach past the memo above,
-                // which is the one thing holding the figure's two halves together. A
-                // host that wants other sizing wraps this in a box of its own.
-                style: { display: 'block', maxWidth: '100%' }, children: _jsx("g", { transform: `translate(${margin} ${snapshot.bandHeight})`, children: _jsx(SVGView, { view: view, displayResults: snapshot.displayResults, header: _jsx(SVGRowHeader, { view: view, fontSize: snapshot.fontSize, rulerHeight: snapshot.rulerHeight, showScalebar: snapshot.showScalebar }), fontSize: snapshot.fontSize, textHeight: snapshot.textHeight, trackLabels: snapshot.trackLabels, trackLabelOffset: snapshot.trackLabelOffset, 
-                        // the row header is exactly the ruler, so the bodies start at its
-                        // height
-                        contentTop: snapshot.rulerHeight, tracksHeight: snapshot.tracksHeight, showGridlines: snapshot.showGridlines, 
-                        // the left gutter the per-track clip may bleed into, so content
-                        // drawn left of zero — a wiggle's y-axis — survives
-                        leftBuffer: snapshot.margin, legendWidth: snapshot.legendWidth }) }) }) }) }));
+    return (_jsx(SvgThemeProviders, { theme: theme, children: _jsx("svg", { ref: ref, width: width, height: height, viewBox: `0 0 ${width} ${height}`, 
+            // It is a vector, so a narrower container scales it rather than
+            // clipping it; the height attribute stays, so a box reserved for it
+            // does not change size when that happens. Deliberately not a prop:
+            // anything passed per-render would have to reach past the memo above,
+            // which is the one thing holding the figure's two halves together. A
+            // host that wants other sizing wraps this in a box of its own.
+            style: { display: 'block', maxWidth: '100%' }, children: _jsx(SVGStackedRow, { view: view, rendered: snapshot, top: snapshot.bandHeight, margin: margin, fontSize: snapshot.fontSize, textHeight: snapshot.textHeight, rulerHeight: snapshot.rulerHeight, trackLabels: snapshot.trackLabels, trackLabelOffset: snapshot.trackLabelOffset, showGridlines: snapshot.showGridlines, showScalebar: snapshot.showScalebar }) }) }));
 });
 /**
  * What "the figure is out of date" means, as a string.
@@ -135,17 +120,26 @@ const FrozenSvgFigure = memo(function FrozenSvgFigure({ view, snapshot, }) {
  * question about regions and is true before a track is instantiated (the first
  * figure then draws a header over nothing, and nothing else ever changes to
  * correct it); **their heights and minimized flags**, since the geometry is
- * derived from them; **the width**, since a resize can widen the canvas without
+ * derived from them; **their configs**, since a display's settings are slots on
+ * the track config and a shown track's snapshot spells that config as its id;
+ * **the legend sections a reader dismissed** and **the per-group state**
+ * (hidden sections, collapses, height overrides: `groupStateKey`), which are
+ * volatile and in no snapshot; **the reload counter**, since a Retry or a Force
+ * load leaves every snapshot as it was while the figure has an error or a
+ * too-large note to replace; **the view's coloring toggles** (`colorByFrame`,
+ * `showAminoAcids`), named one by one because the view's own snapshot moves
+ * every pan frame; **the width**, since a resize can widen the canvas without
  * moving the locus; **the theme**, since each display bakes colors into its own
  * bodies, so a figure from the other mode is not stale but unreadable; and **the
  * highlight bands**, which are drawn in the figure and are the one thing in it a
  * reader adds without navigating anywhere.
  *
- * A plugin's own overlay (grid-bookmark's bookmarks, through
- * `LinearGenomeView-HighlightSVGComponent`) is state this cannot see, so a
- * bookmark added under a drawn figure shows up at its next redraw rather than at
- * once. Subscribing from inside the figure is the thing that must not happen —
- * see the note at the top of the file.
+ * A plugin's own overlay, through `LinearGenomeView-HighlightSVGComponent`, is
+ * state this cannot see, so a change to it shows up at the figure's next
+ * redraw rather than at once. So does a track's vertical scroll, which moves
+ * every wheel frame and has no settled copy to key on. Subscribing from inside
+ * the figure is the thing that must not happen — see the note at the top of
+ * the file.
  */
 function figureKey(view, themeName) {
     // A closed view is not an error, it is a host doing an ordinary thing in an
@@ -156,10 +150,10 @@ function figureKey(view, themeName) {
     // throw a TypeError inside the reaction, where MobX swallows it. No key means
     // no figure, which is what a host that closed the view wanted anyway.
     //
-    // `view.width` throws by design before the view has been measured, and
-    // `ready` is the gate that says it has been — and that there are regions to
-    // draw, which is the second async step `initialized` does not cover
-    if (!isAlive(view) || !view.ready) {
+    // `view.width` throws by design before the view has been measured. `status`
+    // is ready only once it has been AND there are regions to draw — `ready` is
+    // also true for a view nothing has told where to look, measured or not
+    if (!isAlive(view) || view.status.type !== 'ready') {
         return '';
     }
     const session = getSession(view);
@@ -167,14 +161,22 @@ function figureKey(view, themeName) {
         view.coarseVisibleLocStrings,
         view.coarseBpPerPx,
         view.width,
-        view.tracks.map(track => [
-            track.configuration.trackId,
-            track.minimized,
-            track.displays[0]?.height,
-        ]),
+        view.tracks.map(track => {
+            const display = track.displays[0];
+            return [
+                getSnapshot(track),
+                getSnapshot(track.configuration),
+                display?.height,
+                display?.dismissedLegendSections,
+                display?.groupStateKey,
+                display?.reloadCounter,
+            ];
+        }),
+        view.colorByFrame,
+        view.showAminoAcids,
         session.getActiveThemeOptions?.(themeName),
-        session.highlightsVisible ? view.highlight : false,
-        view.labelsVisible,
+        session.highlightsVisible ? view.highlights : false,
+        session.highlightLabelsVisible,
     ]);
 }
 /**
@@ -212,25 +214,7 @@ function useFigureKey(view, themeName) {
 export function useViewSvgFigure(view, { fontSize = 12, rulerHeight = 30, trackLabels = 'offset', showGridlines = true, showScalebar = true, rasterizeLayers = false, margin = exportMargin, themeName, } = {}) {
     const key = useFigureKey(view, themeName);
     useOneFigurePerView(view);
-    const { data: snapshot, error, isLoading, } = useFetch(
-    // Every option is in the key by value, so an inline options object costs
-    // nothing and a changed option redraws. A null key is `useFetch`'s own "not
-    // yet", which is what an unready view reports.
-    key
-        ? [
-            'lgv-svg-figure',
-            key,
-            JSON.stringify([
-                fontSize,
-                rulerHeight,
-                trackLabels,
-                showGridlines,
-                showScalebar,
-                rasterizeLayers,
-                margin,
-            ]),
-        ]
-        : null, () => renderFigure(view, {
+    const opts = {
         fontSize,
         rulerHeight,
         trackLabels,
@@ -239,7 +223,20 @@ export function useViewSvgFigure(view, { fontSize = 12, rulerHeight = 30, trackL
         rasterizeLayers,
         margin,
         themeName,
-    }));
+    };
+    const { data: snapshot, error, isLoading, } = useFetch(
+    // Every option is in the key by value, so an inline options object costs
+    // nothing and a changed option redraws. The view's id too: two views can
+    // share every other term. A null key is `useFetch`'s own "not yet", which
+    // is what an unready view reports.
+    key
+        ? [
+            'lgv-svg-figure',
+            svgNodeId(view),
+            key,
+            JSON.stringify(opts),
+        ]
+        : null, () => renderFigure(view, opts));
     // Written in an effect and read during render, which is the order that makes
     // it work: a key change clears `data` on the render where the ref still holds
     // the previous commit's size, so the host's box keeps the height it had rather

package/esm/LinearGenomeView/svgcomponents/util.d.ts

@@ -1,20 +1,28 @@
 import type { TrackLabelMode } from '../types.ts';
 import type { AnyConfigurationModel } from '@jbrowse/core/configuration';
 import type { TrackCatalog } from '@jbrowse/core/util';
+import type { LgvSvgExportable } from '@jbrowse/display-kit/renderDisplaySvg';
+import type { ExportTextStyle } from '@jbrowse/display-kit/types';
 import type { ReactNode } from 'react';
+type SidebarDisplay = Pick<LgvSvgExportable, 'svgSidebarWidth'>;
 interface TrackHeights {
-    displays: {
+    displays: ({
         height: number;
-    }[];
+        prefersOffset?: boolean;
+    } & SidebarDisplay)[];
 }
 export interface SvgDisplayResult {
     track: {
         configuration: AnyConfigurationModel;
-        displays: {
+        displays: ({
             height: number;
-        }[];
+            regionTooLarge?: boolean;
+            drawsGenomicCoordinates?: boolean;
+        } & SidebarDisplay)[];
     };
     result: ReactNode;
+    /** the room its key has in the export's legend gutter, absent for no key */
+    legendHeight?: number;
 }
 export declare const trackSpacing = 2;
 export declare function gridlineTickXs(model: {
@@ -58,6 +66,7 @@ export declare function getRowHeaderLayout({ fontSize, showScalebar, }: {
     assemblyLabelBaselineY: number;
     bandHeight: number;
 };
+export type HeaderLayout = ReturnType<typeof getHeaderLayout>;
 export declare function getHeaderLayout({ fontSize, showCytobands, rulerHeight, }: {
     fontSize: number;
     showCytobands: boolean;
@@ -71,25 +80,32 @@ export declare function getHeaderLayout({ fontSize, showCytobands, rulerHeight,
 };
 export declare const RULER_MAJOR_TICK = 5;
 export declare const RULER_MINOR_TICK = 3;
-export declare const RULER_TICK_FONT_SIZE = 11;
 export declare function getRulerLayout(rulerHeight: number): {
     tickTopY: number;
     numbersBaselineY: number;
 };
 export declare const refNameLabelBoxHeight: number;
 export declare const refNameLabelBaselineY: number;
-export declare function labelOffset(trackLabels: TrackLabelMode, textHeight: number): number;
+export declare function trackLabelMode(track: {
+    displays: ({
+        prefersOffset?: boolean;
+    } & SidebarDisplay)[];
+}, trackLabels: TrackLabelMode): TrackLabelMode;
+export declare function labelOffset(track: TrackHeights, trackLabels: TrackLabelMode, textHeight: number): number;
+interface SidebarTrack {
+    configuration: AnyConfigurationModel;
+    displays: SidebarDisplay[];
+}
 export declare const TRACK_LABEL_GAP = 40;
 export declare function trackLabelLeftOffset({ tracks, trackLabels, fontSize, fontFamily, session, }: {
-    tracks: {
-        configuration: AnyConfigurationModel;
-    }[];
+    tracks: SidebarTrack[];
     trackLabels: TrackLabelMode;
     fontSize: number;
     fontFamily?: string;
     session: TrackCatalog;
 }): number;
-export declare function trackBoxHeight(track: TrackHeights, textOffset: number): number;
-export declare function trackBoxOffsets(tracks: TrackHeights[], textOffset: number): number[];
-export declare function totalHeight(tracks: TrackHeights[], textHeight: number, trackLabels: TrackLabelMode): number;
+export declare function trackSidebarWidth(track: Pick<SidebarTrack, 'displays'>, text?: ExportTextStyle): number;
+export declare function trackBoxHeight(track: TrackHeights, trackLabels: TrackLabelMode, textHeight: number): number;
+export declare function trackBoxOffsets(tracks: TrackHeights[], trackLabels: TrackLabelMode, textHeight: number): number[];
+export declare function totalHeight(tracks: TrackHeights[], trackLabels: TrackLabelMode, textHeight: number): number;
 export {};