@jbrowse/plugin-spreadsheet-view 2.18.0 → 3.0.0

package/dist/SpreadsheetView/components/SpreadsheetView.js

@@ -15,51 +15,34 @@ 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 ui_1 = require("@jbrowse/core/ui");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const mobx_react_1 = require("mobx-react");
-const mui_1 = require("tss-react/mui");
-const SpreadsheetDataGrid_1 = __importDefault(require("./SpreadsheetDataGrid"));
+const SpreadsheetViewActual_1 = __importDefault(require("./SpreadsheetViewActual"));
 const ImportWizard = (0, react_1.lazy)(() => Promise.resolve().then(() => __importStar(require('./ImportWizard'))));
-const useStyles = (0, mui_1.makeStyles)()(theme => ({
-    contentArea: {
-        overflow: 'auto',
-        position: 'relative',
-        marginBottom: theme.spacing(1),
-        background: theme.palette.background.paper,
-    },
-    resizeHandle: {
-        height: 5,
-        boxSizing: 'border-box',
-        background: theme.palette.action.disabled,
-        borderTop: '1px solid #fafafa',
-    },
-}));
-const SpreadsheetView = (0, mobx_react_1.observer)(function ({ model, }) {
-    const [initialHeight, setInitialHeight] = (0, react_1.useState)(0);
-    const { classes } = useStyles();
-    const { spreadsheet, hideVerticalResizeHandle, height } = model;
-    return spreadsheet ? (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement("div", { style: { height }, className: classes.contentArea },
-            react_1.default.createElement(SpreadsheetDataGrid_1.default, { model: spreadsheet })),
-        hideVerticalResizeHandle ? null : (react_1.default.createElement(ui_1.ResizeHandle, { onMouseDown: () => {
-                setInitialHeight(height);
-            }, onDrag: (_, dist) => model.setHeight(initialHeight - dist), className: classes.resizeHandle })))) : (react_1.default.createElement("div", null, "Unknown"));
-});
 const SpreadsheetContainer = (0, mobx_react_1.observer)(function ({ model, }) {
     var _a;
-    return !((_a = model.spreadsheet) === null || _a === void 0 ? void 0 : _a.initialized) ? (react_1.default.createElement(react_1.Suspense, { fallback: null },
-        react_1.default.createElement(ImportWizard, { model: model.importWizard }))) : (react_1.default.createElement(SpreadsheetView, { model: model }));
+    return !((_a = model.spreadsheet) === null || _a === void 0 ? void 0 : _a.initialized) ? ((0, jsx_runtime_1.jsx)(react_1.Suspense, { fallback: null, children: (0, jsx_runtime_1.jsx)(ImportWizard, { model: model.importWizard }) })) : ((0, jsx_runtime_1.jsx)(SpreadsheetViewActual_1.default, { model: model }));
 });
 exports.default = SpreadsheetContainer;

package/dist/SpreadsheetView/components/SpreadsheetViewActual.d.ts

@@ -0,0 +1,5 @@
+import type { SpreadsheetViewModel } from '../SpreadsheetViewModel';
+declare const SpreadsheetViewActual: ({ model, }: {
+    model: SpreadsheetViewModel;
+}) => import("react/jsx-runtime").JSX.Element;
+export default SpreadsheetViewActual;

package/dist/SpreadsheetView/components/SpreadsheetViewActual.js

@@ -0,0 +1,34 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+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 mobx_react_1 = require("mobx-react");
+const mui_1 = require("tss-react/mui");
+const SpreadsheetDataGrid_1 = __importDefault(require("./SpreadsheetDataGrid"));
+const useStyles = (0, mui_1.makeStyles)()(theme => ({
+    contentArea: {
+        overflow: 'auto',
+        position: 'relative',
+        marginBottom: theme.spacing(1),
+        background: theme.palette.background.paper,
+    },
+    resizeHandle: {
+        height: 5,
+        boxSizing: 'border-box',
+        background: theme.palette.action.disabled,
+        borderTop: '1px solid #fafafa',
+    },
+}));
+const SpreadsheetViewActual = (0, mobx_react_1.observer)(function ({ model, }) {
+    const [initialHeight, setInitialHeight] = (0, react_1.useState)(0);
+    const { classes } = useStyles();
+    const { spreadsheet, hideVerticalResizeHandle, height } = model;
+    return spreadsheet ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { style: { height }, className: classes.contentArea, children: (0, jsx_runtime_1.jsx)(SpreadsheetDataGrid_1.default, { model: spreadsheet }) }), hideVerticalResizeHandle ? null : ((0, jsx_runtime_1.jsx)(ui_1.ResizeHandle, { onMouseDown: () => {
+                    setInitialHeight(height);
+                }, onDrag: (_, dist) => model.setHeight(initialHeight - dist), className: classes.resizeHandle }))] })) : ((0, jsx_runtime_1.jsx)("div", { children: "Unknown" }));
+});
+exports.default = SpreadsheetViewActual;

package/dist/SpreadsheetView/components/TrackSelector.d.ts

@@ -1,7 +1,6 @@
-import React from 'react';
 import type { ImportWizardModel } from '../ImportWizard';
 declare const TrackSelector: ({ model, selectedAssembly, }: {
     model: ImportWizardModel;
     selectedAssembly: string;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default TrackSelector;

package/dist/SpreadsheetView/components/TrackSelector.js

@@ -1,29 +1,7 @@
 "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;
-};
 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 ui_1 = require("@jbrowse/core/ui");
 const util_1 = require("@jbrowse/core/util");
 const material_1 = require("@mui/material");
@@ -42,8 +20,8 @@ const TrackSelector = (0, mobx_react_1.observer)(function ({ model, selectedAsse
             model.setFileType(entry.type);
         }
     }, [model, selectedTrack, filteredTracks]);
-    return (react_1.default.createElement("div", null, (filteredTracks === null || filteredTracks === void 0 ? void 0 : filteredTracks.length) ? (react_1.default.createElement(material_1.TextField, { select: true, label: "Tracks", variant: "outlined", value: selectedTrack, onChange: event => {
-            setSelectedTrack(event.target.value);
-        } }, filteredTracks.map(({ track, label }) => (react_1.default.createElement(material_1.MenuItem, { key: track.trackId, value: track.trackId }, (0, util_1.coarseStripHTML)(label)))))) : (react_1.default.createElement(ui_1.ErrorMessage, { error: `No tracks found for ${selectedAssembly}` }))));
+    return ((0, jsx_runtime_1.jsx)("div", { children: (filteredTracks === null || filteredTracks === void 0 ? void 0 : filteredTracks.length) ? ((0, jsx_runtime_1.jsx)(material_1.TextField, { select: true, label: "Tracks", variant: "outlined", value: selectedTrack, onChange: event => {
+                setSelectedTrack(event.target.value);
+            }, children: filteredTracks.map(({ track, label }) => ((0, jsx_runtime_1.jsx)(material_1.MenuItem, { value: track.trackId, children: (0, util_1.coarseStripHTML)(label) }, track.trackId))) })) : ((0, jsx_runtime_1.jsx)(ui_1.ErrorMessage, { error: `No tracks found for ${selectedAssembly}` })) }));
 });
 exports.default = TrackSelector;

package/dist/SpreadsheetView/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 };
 };

package/esm/SpreadsheetView/SpreadsheetModel.d.ts

@@ -1,4 +1,3 @@
-import React from 'react';
 import type { SimpleFeatureSerialized } from '@jbrowse/core/util';
 import type { Instance } from 'mobx-state-tree';
 export interface Row {
@@ -23,7 +22,6 @@ export default function stateModelFactory(): import("mobx-state-tree").IModelTyp
     assemblyName: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<string>>;
     visibleColumns: import("mobx-state-tree").IType<Record<string, boolean>, Record<string, boolean>, Record<string, boolean>>;
 }, {
-    isLoaded: boolean;
     visibleRowFlags: Record<number, boolean> | undefined;
 } & {
     readonly rows: {
@@ -35,17 +33,20 @@ export default function stateModelFactory(): import("mobx-state-tree").IModelTyp
     readonly dataGridColumns: ({
         field: string;
         width: number;
+        type: "number" | undefined;
     } | {
         field: string;
         width: number;
         renderCell: ({ row }: import("@mui/x-data-grid").GridRenderCellParams<{
             id: number;
             feature: SimpleFeatureSerialized | undefined;
-        }, any, any, import("@mui/x-data-grid").GridTreeNodeWithRender>) => React.JSX.Element | "N/A";
+        }, any, any, import("@mui/x-data-grid").GridTreeNodeWithRender>) => import("react/jsx-runtime").JSX.Element | "N/A";
+        type?: undefined;
         valueGetter?: undefined;
         valueFormatter?: undefined;
     } | {
         field: string;
+        type: "number";
         width: number;
         valueGetter: (_val: unknown, row: {
             feature?: SimpleFeatureSerialized;
@@ -61,8 +62,6 @@ export default function stateModelFactory(): import("mobx-state-tree").IModelTyp
 } & {
     setVisibleRows(arg?: Record<number, boolean>): void;
     setVisibleColumns(arg: Record<string, boolean>): void;
-    setLoaded(flag: boolean): void;
-    afterAttach(): void;
 }, import("mobx-state-tree").ModelCreationType<import("mobx-state-tree/dist/internal").ExtractCFromProps<{
     rowSet: import("mobx-state-tree").IType<RowSet | undefined, RowSet | undefined, RowSet | undefined>;
     columns: import("mobx-state-tree").IType<{

package/esm/SpreadsheetView/SpreadsheetModel.js

@@ -1,7 +1,6 @@
-import React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
 import { assembleLocStringFast, getSession, measureGridWidth, toLocale, } from '@jbrowse/core/util';
-import { autorun } from 'mobx';
-import { addDisposer, types } from 'mobx-state-tree';
+import { types } from 'mobx-state-tree';
 import LocationCell from './components/LocationCell';
 export default function stateModelFactory() {
     return types
@@ -12,7 +11,6 @@ export default function stateModelFactory() {
         visibleColumns: types.frozen(),
     })
         .volatile(() => ({
-        isLoaded: false,
         visibleRowFlags: undefined,
     }))
         .views(self => ({
@@ -34,7 +32,8 @@ export default function stateModelFactory() {
             var _a;
             const session = getSession(self);
             const name = self.assemblyName;
-            return name ? (_a = session.assemblyManager.get(name)) === null || _a === void 0 ? void 0 : _a.initialized : false;
+            return (self.rowSet &&
+                (name ? (_a = session.assemblyManager.get(name)) === null || _a === void 0 ? void 0 : _a.initialized : false));
         },
     }))
         .views(self => ({
@@ -47,22 +46,28 @@ export default function stateModelFactory() {
                         width: measureGridWidth(rows.map(row => row.feature ? assembleLocStringFast(row.feature) : 0)) + 40,
                         renderCell: ({ row }) => {
                             const { feature } = row;
-                            return feature ? (React.createElement(LocationCell, { model: self, feature: feature })) : ('N/A');
+                            return feature ? (_jsx(LocationCell, { model: self, feature: feature })) : ('N/A');
                         },
                     },
                     {
                         field: 'Length',
-                        width: measureGridWidth(rows.map(r => r.feature ? toLocale(r.feature.end - r.feature.start) : 0)),
+                        type: 'number',
+                        width: measureGridWidth(rows.map(row => {
+                            const { feature } = row;
+                            return feature ? feature.end - feature.start : 0;
+                        })),
                         valueGetter: (_val, row) => {
-                            return row.feature
-                                ? row.feature.end - row.feature.start
-                                : undefined;
+                            const { feature } = row;
+                            return feature ? feature.end - feature.start : undefined;
                         },
                         valueFormatter: arg => toLocale(arg),
                     },
                     ...self.columns.map(f => ({
                         field: f.name,
                         width: measureGridWidth([...rows.map(r => r[f.name]), f.name], { minWidth: 20 }),
+                        type: typeof rows[0][f.name] === 'number'
+                            ? 'number'
+                            : undefined,
                     })),
                 ]
                 : undefined;
@@ -73,7 +78,7 @@ export default function stateModelFactory() {
             var _a;
             const { visibleRowFlags } = self;
             return visibleRowFlags
-                ? (_a = self.rows) === null || _a === void 0 ? void 0 : _a.filter((f, idx) => !!visibleRowFlags[idx])
+                ? (_a = self.rows) === null || _a === void 0 ? void 0 : _a.filter((_f, idx) => !!visibleRowFlags[idx])
                 : self.rows;
         },
     }))
@@ -84,25 +89,6 @@ export default function stateModelFactory() {
         setVisibleColumns(arg) {
             self.visibleColumns = arg;
         },
-        setLoaded(flag) {
-            self.isLoaded = flag;
-        },
-        afterAttach() {
-            addDisposer(self, autorun(async () => {
-                const session = getSession(self);
-                const { assemblyManager } = session;
-                try {
-                    if (self.assemblyName) {
-                        await assemblyManager.waitForAssembly(self.assemblyName);
-                        this.setLoaded(true);
-                    }
-                }
-                catch (e) {
-                    console.error(e);
-                    session.notifyError(`Failed to load assembly ${self.assemblyName} ${e}`, e);
-                }
-            }));
-        },
     }))
         .preProcessSnapshot(snap => {
         return snap

package/esm/SpreadsheetView/SpreadsheetViewModel.d.ts

@@ -70,7 +70,6 @@ export default function stateModelFactory(): import("mobx-state-tree").IModelTyp
         assemblyName: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<string>>;
         visibleColumns: import("mobx-state-tree").IType<Record<string, boolean>, Record<string, boolean>, Record<string, boolean>>;
     }, {
-        isLoaded: boolean;
         visibleRowFlags: Record<number, boolean> | undefined;
     } & {
         readonly rows: {
@@ -82,17 +81,20 @@ export default function stateModelFactory(): import("mobx-state-tree").IModelTyp
         readonly dataGridColumns: ({
             field: string;
             width: number;
+            type: "number" | undefined;
         } | {
             field: string;
             width: number;
             renderCell: ({ row }: import("@mui/x-data-grid").GridRenderCellParams<{
                 id: number;
                 feature: import("@jbrowse/core/util").SimpleFeatureSerialized | undefined;
-            }, any, any, import("@mui/x-data-grid").GridTreeNodeWithRender>) => import("react").JSX.Element | "N/A";
+            }, any, any, import("@mui/x-data-grid").GridTreeNodeWithRender>) => import("react/jsx-runtime").JSX.Element | "N/A";
+            type?: undefined;
             valueGetter?: undefined;
             valueFormatter?: undefined;
         } | {
             field: string;
+            type: "number";
             width: number;
             valueGetter: (_val: unknown, row: {
                 feature?: import("@jbrowse/core/util").SimpleFeatureSerialized;
@@ -108,8 +110,6 @@ export default function stateModelFactory(): import("mobx-state-tree").IModelTyp
     } & {
         setVisibleRows(arg?: Record<number, boolean>): void;
         setVisibleColumns(arg: Record<string, boolean>): void;
-        setLoaded(flag: boolean): void;
-        afterAttach(): void;
     }, import("mobx-state-tree").ModelCreationType<import("mobx-state-tree/dist/internal").ExtractCFromProps<{
         rowSet: import("mobx-state-tree").IType<import("./SpreadsheetModel").RowSet | undefined, import("./SpreadsheetModel").RowSet | undefined, import("./SpreadsheetModel").RowSet | undefined>;
         columns: import("mobx-state-tree").IType<{
@@ -219,7 +219,6 @@ export default function stateModelFactory(): import("mobx-state-tree").IModelTyp
         assemblyName: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<string>>;
         visibleColumns: import("mobx-state-tree").IType<Record<string, boolean>, Record<string, boolean>, Record<string, boolean>>;
     }, {
-        isLoaded: boolean;
         visibleRowFlags: Record<number, boolean> | undefined;
     } & {
         readonly rows: {
@@ -231,17 +230,20 @@ export default function stateModelFactory(): import("mobx-state-tree").IModelTyp
         readonly dataGridColumns: ({
             field: string;
             width: number;
+            type: "number" | undefined;
         } | {
             field: string;
             width: number;
             renderCell: ({ row }: import("@mui/x-data-grid").GridRenderCellParams<{
                 id: number;
                 feature: import("@jbrowse/core/util").SimpleFeatureSerialized | undefined;
-            }, any, any, import("@mui/x-data-grid").GridTreeNodeWithRender>) => import("react").JSX.Element | "N/A";
+            }, any, any, import("@mui/x-data-grid").GridTreeNodeWithRender>) => import("react/jsx-runtime").JSX.Element | "N/A";
+            type?: undefined;
             valueGetter?: undefined;
             valueFormatter?: undefined;
         } | {
             field: string;
+            type: "number";
             width: number;
             valueGetter: (_val: unknown, row: {
                 feature?: import("@jbrowse/core/util").SimpleFeatureSerialized;
@@ -257,8 +259,6 @@ export default function stateModelFactory(): import("mobx-state-tree").IModelTyp
     } & {
         setVisibleRows(arg?: Record<number, boolean>): void;
         setVisibleColumns(arg: Record<string, boolean>): void;
-        setLoaded(flag: boolean): void;
-        afterAttach(): void;
     }, import("mobx-state-tree").ModelCreationType<import("mobx-state-tree/dist/internal").ExtractCFromProps<{
         rowSet: import("mobx-state-tree").IType<import("./SpreadsheetModel").RowSet | undefined, import("./SpreadsheetModel").RowSet | undefined, import("./SpreadsheetModel").RowSet | undefined>;
         columns: import("mobx-state-tree").IType<{

package/esm/SpreadsheetView/SpreadsheetViewModel.js

@@ -81,8 +81,15 @@ export default function stateModelFactory() {
                 spreadsheet: rest,
             };
         }
-        else {
-            return snap;
+        else if (spreadsheet) {
+            const { rowSet, ...rest } = spreadsheet;
+            return rowSet && JSON.stringify(rowSet).length > 1000000
+                ? {
+                    ...snap,
+                    spreadsheet: rest,
+                }
+                : snap;
         }
+        return snap;
     });
 }

package/esm/SpreadsheetView/components/FeatureMenu.d.ts

@@ -1,8 +1,7 @@
-import React from 'react';
 import type { AbstractSessionModel, SimpleFeatureSerialized } from '@jbrowse/core/util';
 export default function FeatureMenu({ assemblyName, session, spreadsheetViewId, feature, }: {
     spreadsheetViewId: string;
     assemblyName: string;
     session: AbstractSessionModel;
     feature: SimpleFeatureSerialized;
-}): React.JSX.Element;
+}): import("react/jsx-runtime").JSX.Element;

package/esm/SpreadsheetView/components/FeatureMenu.js

@@ -1,4 +1,5 @@
-import React, { lazy } from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { lazy } from 'react';
 import CascadingMenuButton from '@jbrowse/core/ui/CascadingMenuButton';
 import { SimpleFeature, assembleLocStringFast } from '@jbrowse/core/util';
 import ArrowDropDownIcon from '@mui/icons-material/ArrowDropDown';
@@ -7,7 +8,7 @@ import { locationLinkClick } from '../util';
 const BreakendMultiLevelOptionDialog = lazy(() => import('./BreakendMultiLevelOptionDialog'));
 const BreakendSingleLevelOptionDialog = lazy(() => import('./BreakendSingleLevelOptionDialog'));
 export default function FeatureMenu({ assemblyName, session, spreadsheetViewId, feature, }) {
-    return (React.createElement(CascadingMenuButton, { menuItems: [
+    return (_jsx(CascadingMenuButton, { menuItems: [
             {
                 label: 'Open in linear genome view',
                 onClick: async () => {
@@ -61,6 +62,5 @@ export default function FeatureMenu({ assemblyName, session, spreadsheetViewId,
                     ]);
                 },
             },
-        ] },
-        React.createElement(ArrowDropDownIcon, null)));
+        ], children: _jsx(ArrowDropDownIcon, {}) }));
 }

package/esm/SpreadsheetView/components/ImportWizard.d.ts

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

package/esm/SpreadsheetView/components/ImportWizard.js

@@ -1,4 +1,5 @@
-import React, { useState } from 'react';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
 import { AssemblySelector, ErrorMessage, FileSelector, LoadingEllipses, } from '@jbrowse/core/ui';
 import { getSession } from '@jbrowse/core/util';
 import { Button, FormControl, FormControlLabel, FormGroup, FormLabel, Paper, Radio, RadioGroup, } from '@mui/material';
@@ -23,37 +24,19 @@ const ImportWizard = observer(function ({ model, }) {
     const [selectorType, setSelectorType] = useState('custom');
     const err = ((_a = assemblyManager.get(selectedAssembly)) === null || _a === void 0 ? void 0 : _a.error) || error;
     const rootModel = getRoot(model);
-    return (React.createElement("div", null,
-        err ? React.createElement(ErrorMessage, { error: err }) : null,
-        React.createElement(Paper, { className: classes.container },
-            loading ? React.createElement(LoadingEllipses, { variant: "h6" }) : null,
-            React.createElement("div", null,
-                React.createElement(FormControl, { component: "fieldset" },
-                    React.createElement(RadioGroup, { row: true, "aria-label": "file type", name: "type", value: fileType, onChange: event => {
-                            setSelectorType(event.target.value);
-                        } }, Object.entries({
-                        custom: 'Open file from URL or local computer',
-                        existing: 'Open from track',
-                    }).map(([key, val]) => (React.createElement(FormControlLabel, { key: key, checked: selectorType === key, value: key, control: React.createElement(Radio, null), label: val })))))),
-            selectorType === 'custom' ? (React.createElement("div", null,
-                React.createElement(FormControl, { component: "fieldset" },
-                    React.createElement(FormGroup, null,
-                        React.createElement(FileSelector, { inline: true, location: fileSource, rootModel: rootModel, setLocation: arg => {
-                                model.setFileSource(arg);
-                            } }))))) : selectedAssembly ? (React.createElement(TrackSelector, { model: model, selectedAssembly: selectedAssembly })) : (React.createElement("div", null, "Select assembly")),
-            React.createElement("div", null,
-                React.createElement(FormControl, { component: "fieldset" },
-                    React.createElement(FormLabel, { component: "legend" }, "File Type"),
-                    React.createElement(RadioGroup, { row: true, "aria-label": "file type", name: "type", value: fileType, onChange: event => {
-                            model.setFileType(event.target.value);
-                        } }, fileTypes.map(fileTypeName => (React.createElement(FormControlLabel, { key: fileTypeName, checked: fileType === fileTypeName, value: fileTypeName, control: React.createElement(Radio, null), label: fileTypeName })))))),
-            React.createElement("div", null,
-                React.createElement(AssemblySelector, { session: session, selected: selectedAssembly, onChange: val => {
-                        setSelectedAssembly(val);
-                    } })),
-            React.createElement("div", null,
-                React.createElement(Button, { disabled: !isReadyToOpen || !!err, variant: "contained", "data-testid": "open_spreadsheet", color: "primary", onClick: () => {
-                        model.import(selectedAssembly);
-                    } }, "Open")))));
+    return (_jsxs("div", { children: [err ? _jsx(ErrorMessage, { error: err }) : null, _jsxs(Paper, { className: classes.container, children: [loading ? _jsx(LoadingEllipses, { variant: "h6" }) : null, _jsx("div", { children: _jsx(FormControl, { component: "fieldset", children: _jsx(RadioGroup, { row: true, "aria-label": "file type", name: "type", value: fileType, onChange: event => {
+                                    setSelectorType(event.target.value);
+                                }, children: Object.entries({
+                                    custom: 'Open file from URL or local computer',
+                                    existing: 'Open from track',
+                                }).map(([key, val]) => (_jsx(FormControlLabel, { checked: selectorType === key, value: key, control: _jsx(Radio, {}), label: val }, key))) }) }) }), selectorType === 'custom' ? (_jsx("div", { children: _jsx(FormControl, { component: "fieldset", children: _jsx(FormGroup, { children: _jsx(FileSelector, { inline: true, location: fileSource, rootModel: rootModel, setLocation: arg => {
+                                        model.setFileSource(arg);
+                                    } }) }) }) })) : selectedAssembly ? (_jsx(TrackSelector, { model: model, selectedAssembly: selectedAssembly })) : (_jsx("div", { children: "Select assembly" })), _jsx("div", { children: _jsxs(FormControl, { component: "fieldset", children: [_jsx(FormLabel, { component: "legend", children: "File Type" }), _jsx(RadioGroup, { row: true, "aria-label": "file type", name: "type", value: fileType, onChange: event => {
+                                        model.setFileType(event.target.value);
+                                    }, children: fileTypes.map(fileTypeName => (_jsx(FormControlLabel, { checked: fileType === fileTypeName, value: fileTypeName, control: _jsx(Radio, {}), label: fileTypeName }, fileTypeName))) })] }) }), _jsx("div", { children: _jsx(AssemblySelector, { session: session, selected: selectedAssembly, onChange: val => {
+                                setSelectedAssembly(val);
+                            } }) }), _jsx("div", { children: _jsx(Button, { disabled: !isReadyToOpen || !!err, variant: "contained", "data-testid": "open_spreadsheet", color: "primary", onClick: () => {
+                                model.import(selectedAssembly);
+                            }, children: "Open" }) })] })] }));
 });
 export default ImportWizard;

package/esm/SpreadsheetView/components/LocationCell.d.ts

@@ -1,8 +1,7 @@
-import React from 'react';
 import type { SimpleFeatureSerialized } from '@jbrowse/core/util';
 export default function LocationCell({ model, feature, }: {
     model: {
         assemblyName?: string;
     };
     feature: SimpleFeatureSerialized;
-}): React.JSX.Element;
+}): import("react/jsx-runtime").JSX.Element;

package/esm/SpreadsheetView/components/LocationCell.js

@@ -1,25 +1,23 @@
-import React from 'react';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { assembleLocString, getSession } from '@jbrowse/core/util';
 import { Link } from '@mui/material';
 import { getParent } from 'mobx-state-tree';
 import { locationLinkClick } from '../util';
 import FeatureMenu from './FeatureMenu';
 export default function LocationCell({ model, feature, }) {
-    return (React.createElement(React.Fragment, null,
-        React.createElement(FeatureMenu, { session: getSession(model), spreadsheetViewId: getParent(model).id, assemblyName: model.assemblyName, feature: feature }),
-        React.createElement(Link, { href: "#", onClick: async (event) => {
-                try {
-                    event.preventDefault();
-                    await locationLinkClick({
-                        spreadsheetViewId: getParent(model).id,
-                        session: getSession(model),
-                        locString: assembleLocString(feature),
-                        assemblyName: model.assemblyName,
-                    });
-                }
-                catch (e) {
-                    console.error(e);
-                    getSession(model).notifyError(`${e}`, e);
-                }
-            } }, assembleLocString(feature))));
+    return (_jsxs(_Fragment, { children: [_jsx(FeatureMenu, { session: getSession(model), spreadsheetViewId: getParent(model).id, assemblyName: model.assemblyName, feature: feature }), _jsx(Link, { href: "#", onClick: async (event) => {
+                    try {
+                        event.preventDefault();
+                        await locationLinkClick({
+                            spreadsheetViewId: getParent(model).id,
+                            session: getSession(model),
+                            locString: assembleLocString(feature),
+                            assemblyName: model.assemblyName,
+                        });
+                    }
+                    catch (e) {
+                        console.error(e);
+                        getSession(model).notifyError(`${e}`, e);
+                    }
+                }, children: assembleLocString(feature) })] }));
 }

package/esm/SpreadsheetView/components/NumberEditor.d.ts

@@ -1,9 +1,8 @@
-import React from 'react';
 import type { ImportWizardModel } from '../ImportWizard';
 declare const NumberEditor: ({ model, disabled, modelPropName, modelSetterName, }: {
     model: ImportWizardModel;
     disabled: boolean;
     modelPropName: string;
     modelSetterName: string;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;
 export default NumberEditor;

package/esm/SpreadsheetView/components/NumberEditor.js

@@ -1,4 +1,5 @@
-import React, { useEffect, useState } from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
 import { TextField } from '@mui/material';
 import { observer } from 'mobx-react';
 import { makeStyles } from 'tss-react/mui';
@@ -22,7 +23,7 @@ const NumberEditor = observer(function ({ model, disabled, modelPropName, modelS
             }
         }
     }, [model, modelSetterName, val]);
-    return (React.createElement(TextField, { value: val, disabled: disabled, type: "number", onChange: evt => {
+    return (_jsx(TextField, { value: val, disabled: disabled, type: "number", onChange: evt => {
             setVal(evt.target.value);
         }, className: classes.textField }));
 });