@jbrowse/plugin-linear-genome-view 2.18.0 → 3.0.0

package/dist/LinearGenomeView/svgcomponents/SVGTrackLabel.d.ts

@@ -1,8 +1,7 @@
-import React from 'react';
 export default function SVGTrackLabel({ trackLabels, trackName, fontSize, trackLabelOffset, x, }: {
     trackName: string;
     trackLabels: string;
     fontSize: number;
     trackLabelOffset: number;
     x: number;
-}): React.JSX.Element | null;
+}): import("react/jsx-runtime").JSX.Element | null;

package/dist/LinearGenomeView/svgcomponents/SVGTrackLabel.js

@@ -1,10 +1,7 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = SVGTrackLabel;
-const react_1 = __importDefault(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
 const util_1 = require("@jbrowse/core/util");
 const material_1 = require("@mui/material");
 function SVGTrackLabel({ trackLabels, trackName, fontSize, trackLabelOffset, x, }) {
@@ -13,5 +10,5 @@ function SVGTrackLabel({ trackLabels, trackName, fontSize, trackLabelOffset, x,
     const xoff = trackLabels === 'overlay' ? 5 : 0;
     const yoff = trackLabels === 'offset' ? 5 : 0;
     const name = (0, util_1.coarseStripHTML)(trackName);
-    return trackLabels !== 'none' ? (react_1.default.createElement("g", null, trackLabels === 'left' ? (react_1.default.createElement("text", { x: trackLabelOffset - 40, y: 20, fill: fill, fontSize: fontSize, dominantBaseline: "hanging", textAnchor: "end" }, name)) : (react_1.default.createElement("text", { x: x + xoff, y: yoff, fill: fill, fontSize: fontSize, dominantBaseline: "hanging" }, name)))) : null;
+    return trackLabels !== 'none' ? ((0, jsx_runtime_1.jsx)("g", { children: trackLabels === 'left' ? ((0, jsx_runtime_1.jsx)("text", { x: trackLabelOffset - 40, y: 20, fill: fill, fontSize: fontSize, dominantBaseline: "hanging", textAnchor: "end", children: name })) : ((0, jsx_runtime_1.jsx)("text", { x: x + xoff, y: yoff, fill: fill, fontSize: fontSize, dominantBaseline: "hanging", children: name })) })) : null;
 }

package/dist/LinearGenomeView/svgcomponents/SVGTracks.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
 import type { LinearGenomeViewModel } from '..';
 import type { AnyConfigurationModel } from '@jbrowse/core/configuration';
 type LGV = LinearGenomeViewModel;
@@ -18,5 +17,5 @@ export default function SVGTracks({ displayResults, model, textHeight, fontSize,
     fontSize: number;
     trackLabels?: string;
     trackLabelOffset?: number;
-}): React.JSX.Element;
+}): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/LinearGenomeView/svgcomponents/SVGTracks.js

@@ -4,7 +4,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = SVGTracks;
-const react_1 = __importDefault(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
 const util_1 = require("@jbrowse/core/util");
 const tracks_1 = require("@jbrowse/core/util/tracks");
 const SVGRegionSeparators_1 = __importDefault(require("./SVGRegionSeparators"));
@@ -12,18 +12,21 @@ const SVGTrackLabel_1 = __importDefault(require("./SVGTrackLabel"));
 function SVGTracks({ displayResults, model, textHeight, fontSize, trackLabels = 'offset', trackLabelOffset = 0, }) {
     const session = (0, util_1.getSession)(model);
     const textOffset = trackLabels === 'offset' ? textHeight : 0;
-    let offset = 0;
-    return (react_1.default.createElement(react_1.default.Fragment, null, displayResults.map(({ track, result }) => {
-        const current = offset;
-        const conf = track.configuration;
-        const trackName = (0, tracks_1.getTrackName)(conf, session);
-        const display = track.displays[0];
-        const x = Math.max(-model.offsetPx, 0);
-        offset += display.height + textOffset;
-        return (react_1.default.createElement("g", { key: conf.trackId, transform: `translate(0 ${current})` },
-            react_1.default.createElement("g", { transform: `translate(${trackLabelOffset} ${textOffset})` },
-                react_1.default.createElement(SVGRegionSeparators_1.default, { model: model, height: display.height }),
-                result),
-            react_1.default.createElement(SVGTrackLabel_1.default, { trackName: trackName, fontSize: fontSize, trackLabels: trackLabels, trackLabelOffset: trackLabelOffset, x: x })));
-    })));
+    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: displayResults.reduce(({ prevOffset, reactElements }, { track, result }) => {
+            const conf = track.configuration;
+            const trackName = (0, tracks_1.getTrackName)(conf, session);
+            const display = track.displays[0];
+            const x = Math.max(-model.offsetPx, 0);
+            const currOffset = prevOffset + display.height + textOffset;
+            return {
+                prevOffset: currOffset,
+                reactElements: [
+                    ...reactElements,
+                    (0, jsx_runtime_1.jsxs)("g", { transform: `translate(0 ${prevOffset})`, children: [(0, jsx_runtime_1.jsxs)("g", { transform: `translate(${trackLabelOffset} ${textOffset})`, children: [(0, jsx_runtime_1.jsx)(SVGRegionSeparators_1.default, { model: model, height: display.height }), result] }), (0, jsx_runtime_1.jsx)(SVGTrackLabel_1.default, { trackName: trackName, fontSize: fontSize, trackLabels: trackLabels, trackLabelOffset: trackLabelOffset, x: x })] }, conf.trackId),
+                ],
+            };
+        }, {
+            prevOffset: 0,
+            reactElements: [],
+        }).reactElements }));
 }

package/dist/LinearGenomeView/types.d.ts

@@ -0,0 +1,38 @@
+export interface BpOffset {
+    refName?: string;
+    index: number;
+    offset: number;
+    start?: number;
+    end?: number;
+    coord?: number;
+    reversed?: boolean;
+    assemblyName?: string;
+    oob?: boolean;
+}
+export interface ExportSvgOptions {
+    rasterizeLayers?: boolean;
+    filename?: string;
+    Wrapper?: React.FC<{
+        children: React.ReactNode;
+    }>;
+    fontSize?: number;
+    rulerHeight?: number;
+    textHeight?: number;
+    paddingHeight?: number;
+    headerHeight?: number;
+    cytobandHeight?: number;
+    trackLabels?: string;
+    themeName?: string;
+}
+export interface HighlightType {
+    start: number;
+    end: number;
+    assemblyName: string;
+    refName: string;
+}
+export interface NavLocation {
+    refName: string;
+    start?: number;
+    end?: number;
+    assemblyName?: string;
+}

package/dist/LinearGenomeView/types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/LinearGenomeView/util.d.ts

@@ -1,4 +1,5 @@
 import type { AssemblyManager, ParsedLocString } from '@jbrowse/core/util';
+import type { BaseBlock } from '@jbrowse/core/util/blockTypes';
 export declare function chooseGridPitch(scale: number, minMajorPitchPx: number, minMinorPitchPx: number): {
     majorPitch: number;
     minorPitch: number;
@@ -12,8 +13,9 @@ export declare function generateLocations(regions: ParsedLocString[], assemblyMa
     assemblyName: string;
     parentRegion: import("@jbrowse/core/assemblyManager/assembly").BasicRegion;
     end?: number | undefined;
-    reversed?: boolean | undefined;
     start?: number | undefined;
     refName: string;
+    reversed?: boolean | undefined;
 }[]>;
 export declare function parseLocStrings(input: string, assemblyName: string, isValidRefName: (str: string, assemblyName: string) => boolean): ParsedLocString[];
+export declare function calculateVisibleLocStrings(contentBlocks: BaseBlock[]): string;

package/dist/LinearGenomeView/util.js

@@ -4,6 +4,7 @@ exports.chooseGridPitch = chooseGridPitch;
 exports.makeTicks = makeTicks;
 exports.generateLocations = generateLocations;
 exports.parseLocStrings = parseLocStrings;
+exports.calculateVisibleLocStrings = calculateVisibleLocStrings;
 const util_1 = require("@jbrowse/core/util");
 function chooseGridPitch(scale, minMajorPitchPx, minMinorPitchPx) {
     scale = Math.abs(scale);
@@ -106,3 +107,18 @@ function parseLocStrings(input, assemblyName, isValidRefName) {
         throw e;
     }
 }
+function calculateVisibleLocStrings(contentBlocks) {
+    if (!contentBlocks.length) {
+        return '';
+    }
+    else {
+        const isSingleAssemblyName = contentBlocks.every(b => b.assemblyName === contentBlocks[0].assemblyName);
+        const locs = contentBlocks.map(block => (0, util_1.assembleLocString)({
+            ...block,
+            start: Math.round(block.start),
+            end: Math.round(block.end),
+            assemblyName: isSingleAssemblyName ? undefined : block.assemblyName,
+        }));
+        return locs.join(' ');
+    }
+}

package/dist/index.d.ts

@@ -6,7 +6,7 @@ export default class LinearGenomeViewPlugin extends Plugin {
         BaseLinearDisplayComponent: (props: {
             model: import("./BaseLinearDisplay").BaseLinearDisplayModel;
             children?: React.ReactNode;
-        }) => import("react").JSX.Element;
+        }) => import("react/jsx-runtime").JSX.Element;
         BaseLinearDisplay: import("mobx-state-tree").IModelType<{
             id: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<string>, [undefined]>;
             type: import("mobx-state-tree").ISimpleType<string>;
@@ -42,7 +42,7 @@ export default class LinearGenomeViewPlugin extends Plugin {
                         status?: string;
                         reactElement?: React.ReactElement;
                     };
-                }) => import("react").JSX.Element | undefined;
+                }) => import("react/jsx-runtime").JSX.Element | undefined;
                 renderProps: any;
             } & {
                 doReload(): void;
@@ -174,13 +174,13 @@ export default class LinearGenomeViewPlugin extends Plugin {
         } & {
             readonly statsReadyAndRegionNotTooLarge: boolean;
             regionCannotBeRenderedText(_region: import("@jbrowse/core/util").Region): "" | "Force load to see features";
-            regionCannotBeRendered(_region: import("@jbrowse/core/util").Region): import("react").JSX.Element | null;
+            regionCannotBeRendered(_region: import("@jbrowse/core/util").Region): import("react/jsx-runtime").JSX.Element | null;
         } & {
             featureIdUnderMouse: undefined | string;
             contextMenuFeature: undefined | import("@jbrowse/core/util").Feature;
         } & {
-            readonly DisplayMessageComponent: import("react").FC<any> | undefined;
-            readonly blockType: "dynamicBlocks" | "staticBlocks";
+            readonly DisplayMessageComponent: undefined | React.FC<any>;
+            readonly blockType: "staticBlocks" | "dynamicBlocks";
             readonly blockDefinitions: import("@jbrowse/core/util/blockTypes").BlockSet;
         } & {
             readonly renderDelay: number;
@@ -207,7 +207,7 @@ export default class LinearGenomeViewPlugin extends Plugin {
             contextMenuItems(): import("@jbrowse/core/ui").MenuItem[];
             renderProps(): any;
         } & {
-            renderSvg(opts: import("./BaseLinearDisplay").ExportSvgDisplayOptions): Promise<import("react").JSX.Element>;
+            renderSvg(opts: import("./BaseLinearDisplay").ExportSvgDisplayOptions): Promise<import("react/jsx-runtime").JSX.Element>;
             afterAttach(): void;
         }, import("mobx-state-tree").ModelCreationType<import("mobx-state-tree/dist/internal").ExtractCFromProps<{
             id: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<string>, [undefined]>;
@@ -244,7 +244,7 @@ export default class LinearGenomeViewPlugin extends Plugin {
                         status?: string;
                         reactElement?: React.ReactElement;
                     };
-                }) => import("react").JSX.Element | undefined;
+                }) => import("react/jsx-runtime").JSX.Element | undefined;
                 renderProps: any;
             } & {
                 doReload(): void;
@@ -325,13 +325,13 @@ export default class LinearGenomeViewPlugin extends Plugin {
         SearchBox: ({ model, showHelp, }: {
             showHelp?: boolean;
             model: import("./LinearGenomeView").LinearGenomeViewModel;
-        }) => import("react").JSX.Element;
+        }) => import("react/jsx-runtime").JSX.Element;
         ZoomControls: ({ model, }: {
             model: import("./LinearGenomeView").LinearGenomeViewModel;
-        }) => import("react").JSX.Element;
+        }) => import("react/jsx-runtime").JSX.Element;
         LinearGenomeView: ({ model, }: {
             model: import("./LinearGenomeView").LinearGenomeViewModel;
-        }) => import("react").JSX.Element;
+        }) => import("react/jsx-runtime").JSX.Element;
     };
     configurationSchema: import("@jbrowse/core/configuration/configurationSchema").ConfigurationSchemaType<{
         trackLabels: {

package/dist/index.js

@@ -15,13 +15,23 @@ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (
 }) : function(o, v) {
     o["default"] = v;
 });
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
@@ -39,6 +49,7 @@ const LaunchLinearGenomeView_1 = __importDefault(require("./LaunchLinearGenomeVi
 const LinearBareDisplay_1 = __importDefault(require("./LinearBareDisplay"));
 const LinearBasicDisplay_1 = __importDefault(require("./LinearBasicDisplay"));
 const LinearGenomeView_1 = __importStar(require("./LinearGenomeView"));
+const HeaderZoomControls_1 = __importDefault(require("./LinearGenomeView/components/HeaderZoomControls"));
 class LinearGenomeViewPlugin extends Plugin_1.default {
     constructor() {
         super(...arguments);
@@ -48,7 +59,7 @@ class LinearGenomeViewPlugin extends Plugin_1.default {
             BaseLinearDisplay: BaseLinearDisplay_1.BaseLinearDisplay,
             baseLinearDisplayConfigSchema: BaseLinearDisplay_1.baseLinearDisplayConfigSchema,
             SearchBox: LinearGenomeView_1.SearchBox,
-            ZoomControls: LinearGenomeView_1.ZoomControls,
+            ZoomControls: HeaderZoomControls_1.default,
             LinearGenomeView: LinearGenomeView_1.LinearGenomeView,
         };
         this.configurationSchema = (0, configuration_1.ConfigurationSchema)('LinearGenomeViewConfigSchema', {

package/esm/BaseLinearDisplay/components/BaseLinearDisplay.d.ts

@@ -1,9 +1,8 @@
-import React from 'react';
 import type { BaseLinearDisplayModel } from '../models/BaseLinearDisplayModel';
 declare const BaseLinearDisplay: (props: {
     model: BaseLinearDisplayModel;
     children?: React.ReactNode;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default BaseLinearDisplay;
 export { default as Tooltip } from './Tooltip';
 export { default as BlockMsg } from './BlockMsg';

package/esm/BaseLinearDisplay/components/BaseLinearDisplay.js

@@ -1,4 +1,5 @@
-import React, { Suspense, useRef, useState } from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Suspense, useRef, useState } from 'react';
 import { getConf } from '@jbrowse/core/configuration';
 import { Menu } from '@jbrowse/core/ui';
 import { useTheme } from '@mui/material';
@@ -25,7 +26,7 @@ const BaseLinearDisplay = observer(function (props) {
     const { model, children } = props;
     const { TooltipComponent, DisplayMessageComponent, height } = model;
     const items = model.contextMenuItems();
-    return (React.createElement("div", { ref: ref, "data-testid": `display-${getConf(model, 'displayId')}`, className: classes.display, onContextMenu: event => {
+    return (_jsxs("div", { ref: ref, "data-testid": `display-${getConf(model, 'displayId')}`, className: classes.display, onContextMenu: event => {
             event.preventDefault();
             if (contextCoord) {
                 setContextCoord(undefined);
@@ -42,27 +43,22 @@ const BaseLinearDisplay = observer(function (props) {
             setOffsetMouseCoord([event.clientX - left, event.clientY - top]);
             setClientMouseCoord([event.clientX, event.clientY]);
             setClientRect(rect);
-        } },
-        DisplayMessageComponent ? (React.createElement(DisplayMessageComponent, { model: model })) : (React.createElement(LinearBlocks, { ...props })),
-        children,
-        React.createElement(Suspense, { fallback: null },
-            React.createElement(TooltipComponent, { model: model, height: height, offsetMouseCoord: offsetMouseCoord, clientMouseCoord: clientMouseCoord, clientRect: clientRect, mouseCoord: offsetMouseCoord })),
-        React.createElement(Menu, { open: Boolean(contextCoord) && items.length > 0, onMenuItemClick: (_, callback) => {
-                callback();
-                setContextCoord(undefined);
-            }, onClose: () => {
-                setContextCoord(undefined);
-                model.setContextMenuFeature(undefined);
-            }, TransitionProps: {
-                onExit: () => {
+        }, children: [DisplayMessageComponent ? (_jsx(DisplayMessageComponent, { model: model })) : (_jsx(LinearBlocks, { ...props })), children, _jsx(Suspense, { fallback: null, children: _jsx(TooltipComponent, { model: model, height: height, offsetMouseCoord: offsetMouseCoord, clientMouseCoord: clientMouseCoord, clientRect: clientRect, mouseCoord: offsetMouseCoord }) }), _jsx(Menu, { open: Boolean(contextCoord) && items.length > 0, onMenuItemClick: (_, callback) => {
+                    callback();
+                    setContextCoord(undefined);
+                }, onClose: () => {
                     setContextCoord(undefined);
                     model.setContextMenuFeature(undefined);
-                },
-            }, anchorReference: "anchorPosition", anchorPosition: contextCoord
-                ? { top: contextCoord[1], left: contextCoord[0] }
-                : undefined, style: {
-                zIndex: theme.zIndex.tooltip,
-            }, menuItems: items })));
+                }, TransitionProps: {
+                    onExit: () => {
+                        setContextCoord(undefined);
+                        model.setContextMenuFeature(undefined);
+                    },
+                }, anchorReference: "anchorPosition", anchorPosition: contextCoord
+                    ? { top: contextCoord[1], left: contextCoord[0] }
+                    : undefined, style: {
+                    zIndex: theme.zIndex.tooltip,
+                }, menuItems: items })] }));
 });
 export default BaseLinearDisplay;
 export { default as Tooltip } from './Tooltip';

package/esm/BaseLinearDisplay/components/Block.d.ts

@@ -1,15 +1,14 @@
-import React from 'react';
 import type { BaseBlock } from '@jbrowse/core/util/blockTypes';
 declare const ContentBlock: ({ block, children, }: {
     block: BaseBlock;
     children: React.ReactNode;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 declare function ElidedBlock({ width }: {
     width: number;
-}): React.JSX.Element;
+}): import("react/jsx-runtime").JSX.Element;
 declare function InterRegionPaddingBlock({ boundary, width, style, }: {
     boundary: boolean;
     width: number;
     style?: React.CSSProperties;
-}): React.JSX.Element;
+}): import("react/jsx-runtime").JSX.Element;
 export { ContentBlock, ElidedBlock, InterRegionPaddingBlock };

package/esm/BaseLinearDisplay/components/Block.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
 import { observer } from 'mobx-react';
 import { makeStyles } from 'tss-react/mui';
 const useStyles = makeStyles()(theme => ({
@@ -27,15 +27,15 @@ const useStyles = makeStyles()(theme => ({
 const ContentBlock = observer(function ({ block, children, }) {
     const { classes } = useStyles();
     const { widthPx } = block;
-    return (React.createElement("div", { style: { width: widthPx }, className: classes.contentBlock }, children));
+    return (_jsx("div", { style: { width: widthPx }, className: classes.contentBlock, children: children }));
 });
 function ElidedBlock({ width }) {
     const { classes } = useStyles();
-    return React.createElement("div", { className: classes.elidedBlock, style: { width } });
+    return _jsx("div", { className: classes.elidedBlock, style: { width } });
 }
 function InterRegionPaddingBlock({ boundary, width, style = {}, }) {
     const { classes } = useStyles();
-    return (React.createElement("div", { style: {
+    return (_jsx("div", { style: {
             ...style,
             width,
         }, className: boundary

package/esm/BaseLinearDisplay/components/BlockError.d.ts

@@ -1,5 +1,4 @@
-import React from 'react';
 declare const BlockError: ({ model }: {
     model: any;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default BlockError;

package/esm/BaseLinearDisplay/components/BlockError.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import ErrorMessageStackTraceDialog from '@jbrowse/core/ui/ErrorMessageStackTraceDialog';
 import { getSession } from '@jbrowse/core/util';
 import RefreshIcon from '@mui/icons-material/Refresh';
@@ -7,19 +7,13 @@ import { IconButton, Tooltip } from '@mui/material';
 import { observer } from 'mobx-react';
 import BlockMsg from './BlockMsg';
 const BlockError = observer(function ({ model }) {
-    return (React.createElement(BlockMsg, { message: `${model.error}`, severity: "error", action: React.createElement(React.Fragment, null,
-            React.createElement(Tooltip, { title: "Reload track" },
-                React.createElement(IconButton, { "data-testid": "reload_button", onClick: () => {
-                        model.reload();
-                    } },
-                    React.createElement(RefreshIcon, null))),
-            React.createElement(Tooltip, { title: "Show stack trace" },
-                React.createElement(IconButton, { onClick: () => {
-                        getSession(model).queueDialog(onClose => [
-                            ErrorMessageStackTraceDialog,
-                            { onClose, error: model.error },
-                        ]);
-                    } },
-                    React.createElement(ReportIcon, null)))) }));
+    return (_jsx(BlockMsg, { message: `${model.error}`, severity: "error", action: _jsxs(_Fragment, { children: [_jsx(Tooltip, { title: "Reload track", children: _jsx(IconButton, { "data-testid": "reload_button", onClick: () => {
+                            model.reload();
+                        }, children: _jsx(RefreshIcon, {}) }) }), _jsx(Tooltip, { title: "Show stack trace", children: _jsx(IconButton, { onClick: () => {
+                            getSession(model).queueDialog(onClose => [
+                                ErrorMessageStackTraceDialog,
+                                { onClose, error: model.error },
+                            ]);
+                        }, children: _jsx(ReportIcon, {}) }) })] }) }));
 });
 export default BlockError;

package/esm/BaseLinearDisplay/components/BlockMsg.d.ts

@@ -1,7 +1,6 @@
-import React from 'react';
 import type { AlertColor } from '@mui/material';
 export default function BlockMsg({ message, severity, action, }: {
     message: string;
     severity?: AlertColor;
     action?: React.ReactNode;
-}): React.JSX.Element;
+}): import("react/jsx-runtime").JSX.Element;

package/esm/BaseLinearDisplay/components/BlockMsg.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
 import { Alert, Tooltip } from '@mui/material';
 import { makeStyles } from 'tss-react/mui';
 const useStyles = makeStyles()({
@@ -9,9 +9,7 @@ const useStyles = makeStyles()({
 });
 export default function BlockMsg({ message, severity, action, }) {
     const { classes } = useStyles();
-    return (React.createElement(Alert, { onClick: event => {
+    return (_jsx(Alert, { onClick: event => {
             event.stopPropagation();
-        }, severity: severity, action: action, classes: { message: classes.ellipses } },
-        React.createElement(Tooltip, { title: message },
-            React.createElement("div", null, message))));
+        }, severity: severity, action: action, classes: { message: classes.ellipses }, children: _jsx(Tooltip, { title: message, children: _jsx("div", { children: message }) }) }));
 }

package/esm/BaseLinearDisplay/components/LinearBlocks.d.ts

@@ -1,10 +1,9 @@
-import React from 'react';
 import type { BaseLinearDisplayModel } from '../models/BaseLinearDisplayModel';
 declare const RenderedBlocks: ({ model, }: {
     model: BaseLinearDisplayModel;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export { RenderedBlocks };
 declare const LinearBlocks: ({ model, }: {
     model: BaseLinearDisplayModel;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default LinearBlocks;

package/esm/BaseLinearDisplay/components/LinearBlocks.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { getContainingView } from '@jbrowse/core/util';
 import { observer } from 'mobx-react';
 import { makeStyles } from 'tss-react/mui';
@@ -27,35 +27,32 @@ const useStyles = makeStyles()({
 const RenderedBlocks = observer(function ({ model, }) {
     const { classes } = useStyles();
     const { blockDefinitions, blockState } = model;
-    return (React.createElement(React.Fragment, null, blockDefinitions.map(block => {
-        const key = `${model.id}-${block.key}`;
-        if (block.type === 'ContentBlock') {
-            const state = blockState.get(block.key);
-            return (React.createElement(ContentBlockComponent, { block: block, key: key },
-                (state === null || state === void 0 ? void 0 : state.ReactComponent) ? (React.createElement(state.ReactComponent, { model: state })) : null,
-                (state === null || state === void 0 ? void 0 : state.maxHeightReached) ? (React.createElement("div", { className: classes.heightOverflowed, style: {
-                        top: state.layout.getTotalHeight() - 16,
-                        pointerEvents: 'none',
-                        height: 16,
-                    } }, "Max height reached")) : null));
-        }
-        if (block.type === 'ElidedBlock') {
-            return React.createElement(ElidedBlockComponent, { key: key, width: block.widthPx });
-        }
-        if (block.type === 'InterRegionPaddingBlock') {
-            return (React.createElement(InterRegionPaddingBlockComponent, { key: key, width: block.widthPx, style: { background: 'none' }, boundary: block.variant === 'boundary' }));
-        }
-        throw new Error(`invalid block type ${JSON.stringify(block)}`);
-    })));
+    return (_jsx(_Fragment, { children: blockDefinitions.map(block => {
+            const key = `${model.id}-${block.key}`;
+            if (block.type === 'ContentBlock') {
+                const state = blockState.get(block.key);
+                return (_jsxs(ContentBlockComponent, { block: block, children: [(state === null || state === void 0 ? void 0 : state.ReactComponent) ? (_jsx(state.ReactComponent, { model: state })) : null, (state === null || state === void 0 ? void 0 : state.maxHeightReached) ? (_jsx("div", { className: classes.heightOverflowed, style: {
+                                top: state.layout.getTotalHeight() - 16,
+                                pointerEvents: 'none',
+                                height: 16,
+                            }, children: "Max height reached" })) : null] }, key));
+            }
+            if (block.type === 'ElidedBlock') {
+                return _jsx(ElidedBlockComponent, { width: block.widthPx }, key);
+            }
+            if (block.type === 'InterRegionPaddingBlock') {
+                return (_jsx(InterRegionPaddingBlockComponent, { width: block.widthPx, style: { background: 'none' }, boundary: block.variant === 'boundary' }, key));
+            }
+            throw new Error(`invalid block type ${JSON.stringify(block)}`);
+        }) }));
 });
 export { RenderedBlocks };
 const LinearBlocks = observer(function ({ model, }) {
     const { classes } = useStyles();
     const { blockDefinitions } = model;
     const viewModel = getContainingView(model);
-    return (React.createElement("div", { className: classes.linearBlocks, style: {
+    return (_jsx("div", { className: classes.linearBlocks, style: {
             left: blockDefinitions.offsetPx - viewModel.offsetPx,
-        } },
-        React.createElement(RenderedBlocks, { model: model })));
+        }, children: _jsx(RenderedBlocks, { model: model }) }));
 });
 export default LinearBlocks;

package/esm/BaseLinearDisplay/components/ServerSideRenderedBlockContent.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
 declare const ServerSideRenderedBlockContent: ({ model, }: {
     model: {
         error?: unknown;
@@ -8,5 +7,5 @@ declare const ServerSideRenderedBlockContent: ({ model, }: {
         status?: string;
         reactElement?: React.ReactElement;
     };
-}) => React.JSX.Element | undefined;
+}) => import("react/jsx-runtime").JSX.Element | undefined;
 export default ServerSideRenderedBlockContent;

package/esm/BaseLinearDisplay/components/ServerSideRenderedBlockContent.js

@@ -1,4 +1,5 @@
-import React, { Suspense, lazy } from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Suspense, isValidElement, lazy } from 'react';
 import { LoadingEllipses } from '@jbrowse/core/ui';
 import { observer } from 'mobx-react';
 import { getParent } from 'mobx-state-tree';
@@ -21,19 +22,17 @@ const LoadingMessage = observer(({ model }) => {
     const { status: blockStatus } = model;
     const { message: displayStatus } = getParent(model, 2);
     const status = displayStatus || blockStatus;
-    return (React.createElement("div", { className: classes.loading },
-        React.createElement(LoadingEllipses, { message: status })));
+    return (_jsx("div", { className: classes.loading, children: _jsx(LoadingEllipses, { message: status }) }));
 });
 const ServerSideRenderedBlockContent = observer(function ({ model, }) {
     if (model.error) {
-        return (React.createElement(Suspense, { fallback: null },
-            React.createElement(BlockError, { model: model })));
+        return (_jsx(Suspense, { fallback: null, children: _jsx(BlockError, { model: model }) }));
     }
     else if (model.message) {
-        return React.isValidElement(model.message) ? (model.message) : (React.createElement(BlockMsg, { message: `${model.message}`, severity: "info" }));
+        return isValidElement(model.message) ? (model.message) : (_jsx(BlockMsg, { message: `${model.message}`, severity: "info" }));
     }
     else if (!model.filled) {
-        return React.createElement(LoadingMessage, { model: model });
+        return _jsx(LoadingMessage, { model: model });
     }
     else {
         return model.reactElement;

package/esm/BaseLinearDisplay/components/TooLargeMessage.d.ts

@@ -1,11 +1,10 @@
-import React from 'react';
 import type { FeatureDensityStats } from '@jbrowse/core/data_adapters/BaseAdapter';
-declare function TooLargeMessage({ model, }: {
+declare const TooLargeMessage: ({ model, }: {
     model: {
         regionTooLargeReason: string;
         featureDensityStats?: FeatureDensityStats;
         setFeatureDensityStatsLimit: (s?: FeatureDensityStats) => void;
         reload: () => void;
     };
-}): React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default TooLargeMessage;