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

package/dist/LinearGenomeView/components/OverviewRubberband.js

@@ -1,32 +1,10 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : 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 __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const util_1 = require("@jbrowse/core/util");
 const material_1 = require("@mui/material");
 const mobx_react_1 = require("mobx-react");
@@ -60,10 +38,9 @@ const HoverTooltip = (0, mobx_react_1.observer)(function ({ model, open, guideX,
     const cytoband = (_a = assembly === null || assembly === void 0 ? void 0 : assembly.cytobands) === null || _a === void 0 ? void 0 : _a.find(f => px.coord > f.get('start') &&
         px.coord < f.get('end') &&
         px.refName === assembly.getCanonicalRefName(f.get('refName')));
-    return (react_1.default.createElement(material_1.Tooltip, { open: open, placement: "top", title: [(0, util_1.stringify)(px), cytoband === null || cytoband === void 0 ? void 0 : cytoband.get('name')].join(' '), arrow: true },
-        react_1.default.createElement("div", { className: classes.guide, style: { left: guideX } })));
+    return ((0, jsx_runtime_1.jsx)(material_1.Tooltip, { open: open, placement: "top", title: [(0, util_1.stringify)(px), cytoband === null || cytoband === void 0 ? void 0 : cytoband.get('name')].join(' '), arrow: true, children: (0, jsx_runtime_1.jsx)("div", { className: classes.guide, style: { left: guideX } }) }));
 });
-const OverviewRubberband = (0, mobx_react_1.observer)(function OverviewRubberband({ model, overview, ControlComponent = react_1.default.createElement("div", null), }) {
+const OverviewRubberband = (0, mobx_react_1.observer)(function OverviewRubberband({ model, overview, ControlComponent = (0, jsx_runtime_1.jsx)("div", {}), }) {
     const { cytobandOffset } = model;
     const [startX, setStartX] = (0, react_1.useState)();
     const [currentX, setCurrentX] = (0, react_1.useState)();
@@ -132,9 +109,7 @@ const OverviewRubberband = (0, mobx_react_1.observer)(function OverviewRubberban
         setGuideX(undefined);
     }
     if (startX === undefined) {
-        return (react_1.default.createElement("div", { className: classes.rel },
-            guideX !== undefined ? (react_1.default.createElement(HoverTooltip, { model: model, open: !mouseDragging, overview: overview, guideX: guideX })) : null,
-            react_1.default.createElement("div", { className: classes.rubberbandControl, ref: controlsRef, onMouseDown: mouseDown, onMouseOut: mouseOut, onMouseMove: mouseMove }, ControlComponent)));
+        return ((0, jsx_runtime_1.jsxs)("div", { className: classes.rel, children: [guideX !== undefined ? ((0, jsx_runtime_1.jsx)(HoverTooltip, { model: model, open: !mouseDragging, overview: overview, guideX: guideX })) : null, (0, jsx_runtime_1.jsx)("div", { className: classes.rubberbandControl, ref: controlsRef, onMouseDown: mouseDown, onMouseOut: mouseOut, onMouseMove: mouseMove, children: ControlComponent })] }));
     }
     let left = startX || 0;
     let width = 0;
@@ -152,8 +127,6 @@ const OverviewRubberband = (0, mobx_react_1.observer)(function OverviewRubberban
             [leftBpOffset, rightBpOffset] = [rightBpOffset, leftBpOffset];
         }
     }
-    return (react_1.default.createElement("div", { className: classes.rel },
-        leftBpOffset && rightBpOffset ? (react_1.default.createElement(RubberbandSpan_1.default, { leftBpOffset: leftBpOffset, rightBpOffset: rightBpOffset, width: Math.abs(width), left: left })) : null,
-        react_1.default.createElement("div", { "data-testid": "rubberband_controls", className: classes.rubberbandControl, ref: controlsRef, onMouseDown: mouseDown, onMouseOut: mouseOut, onMouseMove: mouseMove }, ControlComponent)));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: classes.rel, children: [leftBpOffset && rightBpOffset ? ((0, jsx_runtime_1.jsx)(RubberbandSpan_1.default, { leftBpOffset: leftBpOffset, rightBpOffset: rightBpOffset, width: Math.abs(width), left: left })) : null, (0, jsx_runtime_1.jsx)("div", { "data-testid": "rubberband_controls", className: classes.rubberbandControl, ref: controlsRef, onMouseDown: mouseDown, onMouseOut: mouseOut, onMouseMove: mouseMove, children: ControlComponent })] }));
 });
 exports.default = OverviewRubberband;

package/dist/LinearGenomeView/components/OverviewScalebar.d.ts

@@ -1,8 +1,7 @@
-import React from 'react';
 import type { LinearGenomeViewModel } from '..';
 type LGV = LinearGenomeViewModel;
 declare const OverviewScalebar: ({ model, children, }: {
     model: LGV;
     children: React.ReactNode;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default OverviewScalebar;

package/dist/LinearGenomeView/components/OverviewScalebar.js

@@ -1,32 +1,10 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : 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 __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const util_1 = require("@jbrowse/core/util");
 const Base1DViewModel_1 = __importDefault(require("@jbrowse/core/util/Base1DViewModel"));
 const material_1 = require("@mui/material");
@@ -94,23 +72,20 @@ const OverviewBox = (0, mobx_react_1.observer)(function ({ scale, model, block,
     const assembly = assemblyManager.get(assemblyName);
     const refNameColor = assembly === null || assembly === void 0 ? void 0 : assembly.getRefNameColor(refName);
     const canDisplayCytobands = showCytobands && (0, util_2.getCytobands)(assembly, block.refName).length;
-    return (react_1.default.createElement("div", null,
-        react_1.default.createElement(material_1.Typography, { style: {
-                left: block.offsetPx + 3,
-                color: canDisplayCytobands
-                    ? theme.palette.text.primary
-                    : refNameColor,
-            }, className: classes.scalebarRefName }, refName),
-        react_1.default.createElement("div", { className: cx(classes.scalebarContig, canDisplayCytobands
-                ? undefined
-                : reversed
-                    ? classes.scalebarContigReverse
-                    : classes.scalebarContigForward, !canDisplayCytobands ? classes.scalebarBorder : undefined), style: {
-                left: block.offsetPx + cytobandOffset,
-                width: block.widthPx,
-                borderColor: refNameColor,
-            } }, canDisplayCytobands ? (react_1.default.createElement("svg", { style: { width: '100%' } },
-            react_1.default.createElement(Cytobands_1.default, { overview: overview, assembly: assembly, block: block }))) : (react_1.default.createElement(OverviewScalebarTickLabels_1.default, { model: model, overview: overview, scale: scale, block: block })))));
+    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { style: {
+                    left: block.offsetPx + 3,
+                    color: canDisplayCytobands
+                        ? theme.palette.text.primary
+                        : refNameColor,
+                }, className: classes.scalebarRefName, children: refName }), (0, jsx_runtime_1.jsx)("div", { className: cx(classes.scalebarContig, canDisplayCytobands
+                    ? undefined
+                    : reversed
+                        ? classes.scalebarContigReverse
+                        : classes.scalebarContigForward, !canDisplayCytobands ? classes.scalebarBorder : undefined), style: {
+                    left: block.offsetPx + cytobandOffset,
+                    width: block.widthPx,
+                    borderColor: refNameColor,
+                }, children: canDisplayCytobands ? ((0, jsx_runtime_1.jsx)("svg", { style: { width: '100%' }, children: (0, jsx_runtime_1.jsx)(Cytobands_1.default, { overview: overview, assembly: assembly, block: block }) })) : ((0, jsx_runtime_1.jsx)(OverviewScalebarTickLabels_1.default, { model: model, overview: overview, scale: scale, block: block })) })] }));
 });
 const Scalebar = (0, mobx_react_1.observer)(function ({ model, scale, overview, }) {
     const { classes } = useStyles();
@@ -136,23 +111,19 @@ const Scalebar = (0, mobx_react_1.observer)(function ({ model, scale, overview,
     const color = showCytobands ? '#f00' : scalebarColor;
     const transparency = showCytobands ? 0.1 : 0.3;
     const additional = pluginManager.evaluateExtensionPoint('LinearGenomeView-OverviewScalebarComponent', undefined, { model, overview });
-    return (react_1.default.createElement("div", { className: classes.scalebar },
-        react_1.default.createElement("div", { className: classes.scalebarVisibleRegion, style: {
-                width: lastOverviewPx - firstOverviewPx,
-                left: firstOverviewPx + cytobandOffset,
-                background: (0, material_1.alpha)(color, transparency),
-                borderColor: color,
-            } }),
-        overviewVisibleRegions.map((block, idx) => {
-            return !(block.type === 'ContentBlock') ? (react_1.default.createElement("div", { key: `${JSON.stringify(block)}-${idx}`, className: classes.scalebarContig, style: {
-                    width: block.widthPx,
-                    left: block.offsetPx,
-                    backgroundColor: '#999',
-                    backgroundImage: 'repeating-linear-gradient(90deg, transparent, transparent 1px, rgba(255,255,255,.5) 1px, rgba(255,255,255,.5) 3px)',
-                } })) : (react_1.default.createElement(OverviewBox, { scale: scale, block: block, model: model, overview: overview, key: `${JSON.stringify(block)}-${idx}` }));
-        }),
-        react_1.default.createElement(OverviewHighlight_1.default, { model: model, overview: overview }),
-        additional));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: classes.scalebar, children: [(0, jsx_runtime_1.jsx)("div", { className: classes.scalebarVisibleRegion, style: {
+                    width: lastOverviewPx - firstOverviewPx,
+                    left: firstOverviewPx + cytobandOffset,
+                    background: (0, material_1.alpha)(color, transparency),
+                    borderColor: color,
+                } }), overviewVisibleRegions.map((block, idx) => {
+                return !(block.type === 'ContentBlock') ? ((0, jsx_runtime_1.jsx)("div", { className: classes.scalebarContig, style: {
+                        width: block.widthPx,
+                        left: block.offsetPx,
+                        backgroundColor: '#999',
+                        backgroundImage: 'repeating-linear-gradient(90deg, transparent, transparent 1px, rgba(255,255,255,.5) 1px, rgba(255,255,255,.5) 3px)',
+                    } }, `${JSON.stringify(block)}-${idx}`)) : ((0, jsx_runtime_1.jsx)(OverviewBox, { scale: scale, block: block, model: model, overview: overview }, `${JSON.stringify(block)}-${idx}`));
+            }), (0, jsx_runtime_1.jsx)(OverviewHighlight_1.default, { model: model, overview: overview }), additional] }));
 });
 const OverviewScalebar = (0, mobx_react_1.observer)(function ({ model, children, }) {
     const { classes } = useStyles();
@@ -170,11 +141,6 @@ const OverviewScalebar = (0, mobx_react_1.observer)(function ({ model, children,
         return overview;
     }, [str, minimumBlockWidth, modWidth]);
     const scale = totalBp / (modWidth - (displayedRegions.length - 1) * wholeSeqSpacer);
-    return (react_1.default.createElement("div", null,
-        react_1.default.createElement(OverviewRubberband_1.default, { model: model, overview: overview, ControlComponent: react_1.default.createElement(Scalebar, { model: model, overview: overview, scale: scale }) }),
-        react_1.default.createElement("div", { className: classes.overview },
-            react_1.default.createElement("svg", { height: consts_1.HEADER_BAR_HEIGHT, className: classes.overviewSvg },
-                react_1.default.createElement(OverviewScalebarPolygon_1.default, { model: model, overview: overview })),
-            children)));
+    return ((0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)(OverviewRubberband_1.default, { model: model, overview: overview, ControlComponent: (0, jsx_runtime_1.jsx)(Scalebar, { model: model, overview: overview, scale: scale }) }), (0, jsx_runtime_1.jsxs)("div", { className: classes.overview, children: [(0, jsx_runtime_1.jsx)("svg", { height: consts_1.HEADER_BAR_HEIGHT, className: classes.overviewSvg, children: (0, jsx_runtime_1.jsx)(OverviewScalebarPolygon_1.default, { model: model, overview: overview }) }), children] })] }));
 });
 exports.default = OverviewScalebar;

package/dist/LinearGenomeView/components/OverviewScalebarPolygon.d.ts

@@ -1,9 +1,8 @@
-import React from 'react';
 import type { LinearGenomeViewModel } from '..';
 import type { Base1DViewModel } from '@jbrowse/core/util/Base1DViewModel';
 declare const OverviewScalebarPolygon: ({ model, overview, useOffset, }: {
     model: LinearGenomeViewModel;
     overview: Base1DViewModel;
     useOffset?: boolean;
-}) => React.JSX.Element | null;
+}) => import("react/jsx-runtime").JSX.Element | null;
 export default OverviewScalebarPolygon;

package/dist/LinearGenomeView/components/OverviewScalebarPolygon.js

@@ -1,9 +1,6 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-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");
 const mobx_react_1 = require("mobx-react");
@@ -39,6 +36,6 @@ const OverviewScalebarPolygon = (0, mobx_react_1.observer)(function ({ model, ov
         [topRight, 0],
         [topLeft, 0],
     ];
-    return (react_1.default.createElement("polygon", { points: points.toString(), ...(0, util_1.getFillProps)((0, material_1.alpha)(polygonColor, 0.3)), ...(0, util_1.getStrokeProps)((0, material_1.alpha)(polygonColor, 0.8)) }));
+    return ((0, jsx_runtime_1.jsx)("polygon", { points: points.toString(), ...(0, util_1.getFillProps)((0, material_1.alpha)(polygonColor, 0.3)), ...(0, util_1.getStrokeProps)((0, material_1.alpha)(polygonColor, 0.8)) }));
 });
 exports.default = OverviewScalebarPolygon;

package/dist/LinearGenomeView/components/OverviewScalebarTickLabels.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
 import type { LinearGenomeViewModel } from '..';
 import type { Base1DViewModel } from '@jbrowse/core/util/Base1DViewModel';
 import type { ContentBlock } from '@jbrowse/core/util/blockTypes';
@@ -7,5 +6,5 @@ declare const OverviewScalebarTickLabels: ({ block, scale, overview, model, }: {
     scale: number;
     block: ContentBlock;
     overview: Base1DViewModel;
-}) => React.JSX.Element[];
+}) => import("react/jsx-runtime").JSX.Element[];
 export default OverviewScalebarTickLabels;

package/dist/LinearGenomeView/components/OverviewScalebarTickLabels.js

@@ -1,9 +1,6 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-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");
 const mobx_react_1 = require("mobx-react");
@@ -31,10 +28,10 @@ const OverviewScalebarTickLabels = (0, mobx_react_1.observer)(function ({ block,
         const offsetLabel = (i + 1) * majorPitch;
         tickLabels.push(reversed ? end - offsetLabel : start + offsetLabel);
     }
-    return tickLabels.map((tickLabel, labelIdx) => (react_1.default.createElement(material_1.Typography, { key: `${JSON.stringify(block)}-${tickLabel}-${labelIdx}`, className: classes.scalebarLabel, variant: "body2", style: {
+    return tickLabels.map((tickLabel, labelIdx) => ((0, jsx_runtime_1.jsx)(material_1.Typography, { className: classes.scalebarLabel, variant: "body2", style: {
             left: ((labelIdx + 1) * majorPitch) / scale,
             pointerEvents: 'none',
             color: refNameColor,
-        } }, (0, util_1.getTickDisplayStr)(tickLabel, overview.bpPerPx))));
+        }, children: (0, util_1.getTickDisplayStr)(tickLabel, overview.bpPerPx) }, `${JSON.stringify(block)}-${tickLabel}-${labelIdx}`)));
 });
 exports.default = OverviewScalebarTickLabels;

package/dist/LinearGenomeView/components/RefNameAutocomplete/AutocompleteTextField.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
 import type { AutocompleteRenderInputParams, TextFieldProps as TFP } from '@mui/material';
 export default function AutocompleteTextField({ TextFieldProps, inputBoxVal, params, showHelp, setInputValue, setCurrentSearch, }: {
     TextFieldProps: TFP;
@@ -7,4 +6,4 @@ export default function AutocompleteTextField({ TextFieldProps, inputBoxVal, par
     params: AutocompleteRenderInputParams;
     setInputValue: (arg: string) => void;
     setCurrentSearch: (arg: string) => void;
-}): React.JSX.Element;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/LinearGenomeView/components/RefNameAutocomplete/AutocompleteTextField.js

@@ -4,18 +4,18 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = AutocompleteTextField;
-const react_1 = __importDefault(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
 const material_1 = require("@mui/material");
 const EndAdornment_1 = __importDefault(require("./EndAdornment"));
 function AutocompleteTextField({ TextFieldProps, inputBoxVal, params, showHelp, setInputValue, setCurrentSearch, }) {
     const { helperText, InputProps = {} } = TextFieldProps;
-    return (react_1.default.createElement(material_1.TextField, { onBlur: () => {
+    return ((0, jsx_runtime_1.jsx)(material_1.TextField, { onBlur: () => {
             setInputValue(inputBoxVal);
         }, ...params, ...TextFieldProps, size: "small", helperText: helperText, slotProps: {
             input: {
                 ...params.InputProps,
                 ...InputProps,
-                endAdornment: (react_1.default.createElement(EndAdornment_1.default, { showHelp: showHelp, endAdornment: params.InputProps.endAdornment })),
+                endAdornment: ((0, jsx_runtime_1.jsx)(EndAdornment_1.default, { showHelp: showHelp, endAdornment: params.InputProps.endAdornment })),
             },
         }, placeholder: "Search for location", onChange: e => {
             setCurrentSearch(e.target.value);

package/dist/LinearGenomeView/components/RefNameAutocomplete/EndAdornment.d.ts

@@ -1,5 +1,4 @@
-import React from 'react';
 export default function EndAdornment({ showHelp, endAdornment, }: {
     showHelp?: boolean;
     endAdornment: React.ReactNode;
-}): React.JSX.Element;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/LinearGenomeView/components/RefNameAutocomplete/EndAdornment.js

@@ -15,39 +15,42 @@ 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 };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = EndAdornment;
-const react_1 = __importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const Help_1 = __importDefault(require("@mui/icons-material/Help"));
 const Search_1 = __importDefault(require("@mui/icons-material/Search"));
 const material_1 = require("@mui/material");
 const HelpDialog = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./HelpDialog'))));
 function HelpAdornment() {
     const [isHelpDialogDisplayed, setHelpDialogDisplayed] = (0, react_1.useState)(false);
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(material_1.IconButton, { onClick: () => {
-                setHelpDialogDisplayed(true);
-            }, size: "small" },
-            react_1.default.createElement(Help_1.default, { fontSize: "small" })),
-        isHelpDialogDisplayed ? (react_1.default.createElement(react_1.Suspense, { fallback: null },
-            react_1.default.createElement(HelpDialog, { handleClose: () => {
-                    setHelpDialogDisplayed(false);
-                } }))) : null));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(material_1.IconButton, { onClick: () => {
+                    setHelpDialogDisplayed(true);
+                }, size: "small", children: (0, jsx_runtime_1.jsx)(Help_1.default, { fontSize: "small" }) }), isHelpDialogDisplayed ? ((0, jsx_runtime_1.jsx)(react_1.Suspense, { fallback: null, children: (0, jsx_runtime_1.jsx)(HelpDialog, { handleClose: () => {
+                        setHelpDialogDisplayed(false);
+                    } }) })) : null] }));
 }
 function EndAdornment({ showHelp, endAdornment, }) {
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(material_1.InputAdornment, { position: "end", style: { marginRight: 7 } },
-            react_1.default.createElement(Search_1.default, { fontSize: "small" }),
-            showHelp ? react_1.default.createElement(HelpAdornment, null) : null),
-        endAdornment));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(material_1.InputAdornment, { position: "end", style: { marginRight: 7 }, children: [(0, jsx_runtime_1.jsx)(Search_1.default, { fontSize: "small" }), showHelp ? (0, jsx_runtime_1.jsx)(HelpAdornment, {}) : null] }), endAdornment] }));
 }

package/dist/LinearGenomeView/components/RefNameAutocomplete/HelpDialog.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
 export default function HelpDialog({ handleClose, }: {
     handleClose: () => void;
-}): React.JSX.Element;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/LinearGenomeView/components/RefNameAutocomplete/HelpDialog.js

@@ -1,50 +1,11 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.default = HelpDialog;
-const react_1 = __importDefault(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
 const ui_1 = require("@jbrowse/core/ui");
 const material_1 = require("@mui/material");
 function HelpDialog({ handleClose, }) {
-    return (react_1.default.createElement(ui_1.Dialog, { open: true, maxWidth: "xl", onClose: handleClose, title: "Using the search box" },
-        react_1.default.createElement(material_1.DialogContent, null,
-            react_1.default.createElement("h3", null, "Searching"),
-            react_1.default.createElement("ul", null,
-                react_1.default.createElement("li", null, "Jump to a feature or reference sequence by typing its name in the location box and pressing Enter."),
-                react_1.default.createElement("li", null,
-                    "Jump to a specific region by typing the region into the location box as: ",
-                    react_1.default.createElement("code", null, "ref:start..end"),
-                    " or ",
-                    react_1.default.createElement("code", null, "ref:start-end"),
-                    ". Commas are allowed in the start and end coordinates. A space-separated list of locstrings can be used to open up multiple chromosomes at a time")),
-            react_1.default.createElement("h3", null, "Example Searches"),
-            react_1.default.createElement("ul", null,
-                react_1.default.createElement("li", null,
-                    react_1.default.createElement("code", null, "BRCA"),
-                    " - searches for the feature named BRCA"),
-                react_1.default.createElement("li", null,
-                    react_1.default.createElement("code", null, "chr4"),
-                    " - jumps to chromosome 4"),
-                react_1.default.createElement("li", null,
-                    react_1.default.createElement("code", null, "chr4:79,500,000..80,000,000"),
-                    " - jumps the region on chromosome 4 between 79.5Mb and 80Mb."),
-                react_1.default.createElement("li", null,
-                    react_1.default.createElement("code", null, "chr1:1-100 chr2:1-100"),
-                    " - create a split view of chr1:1-100 and chr2:1-100"),
-                react_1.default.createElement("li", null,
-                    react_1.default.createElement("code", null, "chr1 chr2 chr3"),
-                    " - open up multiple chromosomes at once"),
-                react_1.default.createElement("li", null,
-                    react_1.default.createElement("code", null, "chr1:1-100[rev] chr2:1-100"),
-                    " - open up the first region in the horizontally flipped orientation"),
-                react_1.default.createElement("li", null,
-                    react_1.default.createElement("code", null, "chr1 100 200"),
-                    " - use whitespace separated refname, start, end"))),
-        react_1.default.createElement(material_1.Divider, null),
-        react_1.default.createElement(material_1.DialogActions, null,
-            react_1.default.createElement(material_1.Button, { onClick: () => {
-                    handleClose();
-                }, color: "primary" }, "Close"))));
+    return ((0, jsx_runtime_1.jsxs)(ui_1.Dialog, { open: true, maxWidth: "xl", onClose: handleClose, title: "Using the search box", children: [(0, jsx_runtime_1.jsxs)(material_1.DialogContent, { children: [(0, jsx_runtime_1.jsx)("h3", { children: "Searching" }), (0, jsx_runtime_1.jsxs)("ul", { children: [(0, jsx_runtime_1.jsx)("li", { children: "Jump to a feature or reference sequence by typing its name in the location box and pressing Enter." }), (0, jsx_runtime_1.jsxs)("li", { children: ["Jump to a specific region by typing the region into the location box as: ", (0, jsx_runtime_1.jsx)("code", { children: "ref:start..end" }), " or ", (0, jsx_runtime_1.jsx)("code", { children: "ref:start-end" }), ". Commas are allowed in the start and end coordinates. A space-separated list of locstrings can be used to open up multiple chromosomes at a time"] })] }), (0, jsx_runtime_1.jsx)("h3", { children: "Example Searches" }), (0, jsx_runtime_1.jsxs)("ul", { children: [(0, jsx_runtime_1.jsxs)("li", { children: [(0, jsx_runtime_1.jsx)("code", { children: "BRCA" }), " - searches for the feature named BRCA"] }), (0, jsx_runtime_1.jsxs)("li", { children: [(0, jsx_runtime_1.jsx)("code", { children: "chr4" }), " - jumps to chromosome 4"] }), (0, jsx_runtime_1.jsxs)("li", { children: [(0, jsx_runtime_1.jsx)("code", { children: "chr4:79,500,000..80,000,000" }), " - jumps the region on chromosome 4 between 79.5Mb and 80Mb."] }), (0, jsx_runtime_1.jsxs)("li", { children: [(0, jsx_runtime_1.jsx)("code", { children: "chr1:1-100 chr2:1-100" }), " - create a split view of chr1:1-100 and chr2:1-100"] }), (0, jsx_runtime_1.jsxs)("li", { children: [(0, jsx_runtime_1.jsx)("code", { children: "chr1 chr2 chr3" }), " - open up multiple chromosomes at once"] }), (0, jsx_runtime_1.jsxs)("li", { children: [(0, jsx_runtime_1.jsx)("code", { children: "chr1:1-100[rev] chr2:1-100" }), " - open up the first region in the horizontally flipped orientation"] }), (0, jsx_runtime_1.jsxs)("li", { children: [(0, jsx_runtime_1.jsx)("code", { children: "chr1 100 200" }), " - use whitespace separated refname, start, end"] })] })] }), (0, jsx_runtime_1.jsx)(material_1.Divider, {}), (0, jsx_runtime_1.jsx)(material_1.DialogActions, { children: (0, jsx_runtime_1.jsx)(material_1.Button, { onClick: () => {
+                        handleClose();
+                    }, color: "primary", children: "Close" }) })] }));
 }

package/dist/LinearGenomeView/components/RefNameAutocomplete/index.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
 import BaseResult from '@jbrowse/core/TextSearch/BaseResults';
 import type { LinearGenomeViewModel } from '../../model';
 import type { TextFieldProps as TFP } from '@mui/material';
@@ -14,5 +13,5 @@ declare const RefNameAutocomplete: ({ model, onSelect, assemblyName, style, fetc
     maxWidth?: number;
     showHelp?: boolean;
     TextFieldProps?: TFP;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default RefNameAutocomplete;

package/dist/LinearGenomeView/components/RefNameAutocomplete/index.js

@@ -15,18 +15,29 @@ 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 };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = __importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const BaseResults_1 = __importStar(require("@jbrowse/core/TextSearch/BaseResults"));
 const util_1 = require("@jbrowse/core/util");
 const material_1 = require("@mui/material");
@@ -72,7 +83,7 @@ const RefNameAutocomplete = (0, mobx_react_1.observer)(function ({ model, onSele
             matchedAttribute: 'refName',
         }),
     }))) || [];
-    return (react_1.default.createElement(material_1.Autocomplete, { "data-testid": "autocomplete", disableListWrap: true, disableClearable: true, disabled: !assemblyName, freeSolo: true, includeInputInList: true, selectOnFocus: true, style: { ...style, width }, value: inputBoxVal, loading: !loaded, inputValue: inputValue, onInputChange: (_event, newInputValue) => {
+    return ((0, jsx_runtime_1.jsx)(material_1.Autocomplete, { "data-testid": "autocomplete", disableListWrap: true, disableClearable: true, disabled: !assemblyName, freeSolo: true, includeInputInList: true, selectOnFocus: true, style: { ...style, width }, value: inputBoxVal, loading: !loaded, inputValue: inputValue, onInputChange: (_event, newInputValue) => {
             setInputValue(newInputValue);
             onChange === null || onChange === void 0 ? void 0 : onChange(newInputValue);
         }, loadingText: "loading results", open: open, onOpen: () => {
@@ -95,6 +106,6 @@ const RefNameAutocomplete = (0, mobx_react_1.observer)(function ({ model, onSele
                 onSelect === null || onSelect === void 0 ? void 0 : onSelect(selectedOption.result);
             }
             setInputValue(inputBoxVal);
-        }, options: (searchOptions === null || searchOptions === void 0 ? void 0 : searchOptions.length) ? searchOptions : regionOptions, getOptionDisabled: option => option.group === 'limitOption', filterOptions: (opts, { inputValue }) => (0, util_2.getFiltered)(opts, inputValue), renderInput: params => (react_1.default.createElement(AutocompleteTextField_1.default, { showHelp: showHelp, params: params, inputBoxVal: inputBoxVal, TextFieldProps: TextFieldProps, setCurrentSearch: setCurrentSearch, setInputValue: setInputValue })), getOptionLabel: opt => typeof opt === 'string' ? opt : opt.result.getDisplayString() }));
+        }, options: (searchOptions === null || searchOptions === void 0 ? void 0 : searchOptions.length) ? searchOptions : regionOptions, getOptionDisabled: option => option.group === 'limitOption', filterOptions: (opts, { inputValue }) => (0, util_2.getFiltered)(opts, inputValue), renderInput: params => ((0, jsx_runtime_1.jsx)(AutocompleteTextField_1.default, { showHelp: showHelp, params: params, inputBoxVal: inputBoxVal, TextFieldProps: TextFieldProps, setCurrentSearch: setCurrentSearch, setInputValue: setInputValue })), getOptionLabel: opt => typeof opt === 'string' ? opt : opt.result.getDisplayString() }));
 });
 exports.default = RefNameAutocomplete;

package/dist/LinearGenomeView/components/RegionWidthEditorDialog.d.ts

@@ -0,0 +1,6 @@
+import type { LinearGenomeViewModel } from '../model';
+declare const RegionWidthEditorDialog: ({ model, handleClose, }: {
+    model: LinearGenomeViewModel;
+    handleClose: () => void;
+}) => import("react/jsx-runtime").JSX.Element;
+export default RegionWidthEditorDialog;

package/dist/LinearGenomeView/components/RegionWidthEditorDialog.js

@@ -0,0 +1,30 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const ui_1 = require("@jbrowse/core/ui");
+const util_1 = require("@jbrowse/core/util");
+const material_1 = require("@mui/material");
+const mobx_react_1 = require("mobx-react");
+const toP = (s = 0) => +(+s).toFixed(1);
+const RegionWidthEditorDialog = (0, mobx_react_1.observer)(function ({ model, handleClose, }) {
+    const { bpPerPx, width } = model;
+    const [val, setVal] = (0, react_1.useState)((0, util_1.toLocale)(toP(bpPerPx * width)));
+    (0, react_1.useEffect)(() => {
+        setVal((0, util_1.toLocale)(bpPerPx * width));
+    }, [bpPerPx, width]);
+    const val2 = val.replace(/,/g, '');
+    return ((0, jsx_runtime_1.jsxs)(ui_1.Dialog, { title: "Edit zoom level", open: true, onClose: handleClose, children: [(0, jsx_runtime_1.jsxs)(material_1.DialogContent, { style: {
+                    display: 'flex',
+                    flexDirection: 'column',
+                    gap: 30,
+                }, children: [(0, jsx_runtime_1.jsx)(material_1.Typography, { children: "Enter a specific number of base pairs to change the viewport to show. This is approximate and does not account for padding between regions or off-screen scrolling" }), (0, jsx_runtime_1.jsx)(material_1.TextField, { helperText: "current zoom level (in bp)", value: val, onChange: event => {
+                            setVal(event.target.value);
+                        } })] }), (0, jsx_runtime_1.jsxs)(material_1.DialogActions, { children: [(0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", color: "secondary", onClick: () => {
+                            handleClose();
+                        }, children: "Cancel" }), (0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", color: "primary", onClick: () => {
+                            model.zoomTo(+val2 / model.width);
+                            handleClose();
+                        }, children: "Submit" })] })] }));
+});
+exports.default = RegionWidthEditorDialog;

package/dist/LinearGenomeView/components/Rubberband.d.ts

@@ -1,8 +1,7 @@
-import React from 'react';
 import type { LinearGenomeViewModel } from '..';
 type LGV = LinearGenomeViewModel;
 declare const Rubberband: ({ model, ControlComponent, }: {
     model: LGV;
     ControlComponent?: React.ReactElement;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default Rubberband;