@jbrowse/plugin-spreadsheet-view 2.17.0 → 2.18.0

package/esm/SpreadsheetView/SpreadsheetViewModel.d.ts

@@ -0,0 +1,299 @@
+import type { SpreadsheetModel } from './SpreadsheetModel';
+import type { MenuItem } from '@jbrowse/core/ui';
+import type { Instance } from 'mobx-state-tree';
+export default function stateModelFactory(): import("mobx-state-tree").IModelType<{
+    id: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<string>, [undefined]>;
+    displayName: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<string>>;
+    minimized: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
+} & {
+    type: import("mobx-state-tree").ISimpleType<"SpreadsheetView">;
+    offsetPx: import("mobx-state-tree").IType<number | undefined, number, number>;
+    height: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<number>, [undefined]>;
+    hideVerticalResizeHandle: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
+    hideFilterControls: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
+    importWizard: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").IModelType<{
+        fileType: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<string>, [undefined]>;
+        hasColumnNameLine: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
+        columnNameLineNumber: import("mobx-state-tree").IType<number | undefined, number, number>;
+        selectedAssemblyName: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<string>>;
+        cachedFileLocation: import("mobx-state-tree").IType<import("@jbrowse/core/util").FileLocation | undefined, import("@jbrowse/core/util").FileLocation | undefined, import("@jbrowse/core/util").FileLocation | undefined>;
+    }, {
+        fileTypes: string[];
+        fileSource: any;
+        error: unknown;
+        loading: boolean;
+    } & {
+        readonly isReadyToOpen: any;
+        readonly fileName: any;
+        readonly requiresUnzip: any;
+        isValidRefName(refName: string, assemblyName?: string): boolean;
+        tracksForAssembly(selectedAssembly: string): {
+            track: {
+                [x: string]: any;
+            } & import("mobx-state-tree/dist/internal").NonEmptyObject & {
+                setSubschema(slotName: string, data: Record<string, unknown>): Record<string, unknown> | ({
+                    [x: string]: any;
+                } & import("mobx-state-tree/dist/internal").NonEmptyObject & {
+                    setSubschema(slotName: string, data: Record<string, unknown>): Record<string, unknown> | ({
+                        [x: string]: any;
+                    } & import("mobx-state-tree/dist/internal").NonEmptyObject & any & import("mobx-state-tree").IStateTreeNode<import("@jbrowse/core/configuration").AnyConfigurationSchemaType>);
+                } & import("mobx-state-tree").IStateTreeNode<import("@jbrowse/core/configuration").AnyConfigurationSchemaType>);
+            } & import("mobx-state-tree").IStateTreeNode<import("@jbrowse/core/configuration").AnyConfigurationSchemaType>;
+            label: string;
+            assemblyNames: any;
+            type: string;
+            loc: import("@jbrowse/core/util").FileLocation;
+        }[];
+    } & {
+        setSelectedAssemblyName(s: string): void;
+        setFileSource(newSource: unknown): void;
+        setColumnNameLineNumber(newnumber: number): void;
+        setFileType(typeName: string): void;
+        setError(error: unknown): void;
+        setLoading(arg: boolean): void;
+        cancelButton(): void;
+        setCachedFileHandle(arg: import("@jbrowse/core/util").FileLocation): void;
+    } & {
+        import(assemblyName: string): Promise<void>;
+    } & {
+        afterAttach(): void;
+    }, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>, [undefined]>;
+    spreadsheet: import("mobx-state-tree").IMaybe<import("mobx-state-tree").IModelType<{
+        rowSet: import("mobx-state-tree").IType<import("./SpreadsheetModel").RowSet | undefined, import("./SpreadsheetModel").RowSet | undefined, import("./SpreadsheetModel").RowSet | undefined>;
+        columns: import("mobx-state-tree").IType<{
+            name: string;
+        }[], {
+            name: string;
+        }[], {
+            name: string;
+        }[]>;
+        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: {
+            id: number;
+            feature: import("@jbrowse/core/util").SimpleFeatureSerialized | undefined;
+        }[] | undefined;
+        readonly initialized: boolean | undefined;
+    } & {
+        readonly dataGridColumns: ({
+            field: string;
+            width: number;
+        } | {
+            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";
+            valueGetter?: undefined;
+            valueFormatter?: undefined;
+        } | {
+            field: string;
+            width: number;
+            valueGetter: (_val: unknown, row: {
+                feature?: import("@jbrowse/core/util").SimpleFeatureSerialized;
+            }) => number | undefined;
+            valueFormatter: (arg: never) => string;
+            renderCell?: undefined;
+        })[] | undefined;
+    } & {
+        readonly visibleRows: {
+            id: number;
+            feature: import("@jbrowse/core/util").SimpleFeatureSerialized | undefined;
+        }[] | undefined;
+    } & {
+        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<{
+            name: string;
+        }[], {
+            name: string;
+        }[], {
+            name: string;
+        }[]>;
+        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>>;
+    }>>, import("mobx-state-tree")._NotCustomized>>;
+}, {
+    width: number;
+} & {
+    menuItems(): MenuItem[];
+} & {
+    setDisplayName(name: string): void;
+    setWidth(newWidth: number): void;
+    setMinimized(flag: boolean): void;
+} & {
+    width: number;
+    rowMenuItems: MenuItem[];
+} & {
+    readonly assembly: any;
+} & {
+    setRowMenuItems(newItems: MenuItem[]): void;
+    setWidth(newWidth: number): number;
+    setHeight(newHeight: number): number;
+    resizeHeight(distance: number): number;
+    resizeWidth(distance: number): number;
+    displaySpreadsheet(spreadsheet?: SpreadsheetModel): void;
+} & {
+    menuItems(): {
+        label: string;
+        icon: import("@mui/material/OverridableComponent").OverridableComponent<import("@mui/material").SvgIconTypeMap<{}, "svg">> & {
+            muiName: string;
+        };
+        onClick: () => void;
+    }[];
+}, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree").ModelSnapshotType<{
+    id: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<string>, [undefined]>;
+    displayName: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<string>>;
+    minimized: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
+} & {
+    type: import("mobx-state-tree").ISimpleType<"SpreadsheetView">;
+    offsetPx: import("mobx-state-tree").IType<number | undefined, number, number>;
+    height: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<number>, [undefined]>;
+    hideVerticalResizeHandle: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
+    hideFilterControls: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
+    importWizard: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").IModelType<{
+        fileType: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<string>, [undefined]>;
+        hasColumnNameLine: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
+        columnNameLineNumber: import("mobx-state-tree").IType<number | undefined, number, number>;
+        selectedAssemblyName: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<string>>;
+        cachedFileLocation: import("mobx-state-tree").IType<import("@jbrowse/core/util").FileLocation | undefined, import("@jbrowse/core/util").FileLocation | undefined, import("@jbrowse/core/util").FileLocation | undefined>;
+    }, {
+        fileTypes: string[];
+        fileSource: any;
+        error: unknown;
+        loading: boolean;
+    } & {
+        readonly isReadyToOpen: any;
+        readonly fileName: any;
+        readonly requiresUnzip: any;
+        isValidRefName(refName: string, assemblyName?: string): boolean;
+        tracksForAssembly(selectedAssembly: string): {
+            track: {
+                [x: string]: any;
+            } & import("mobx-state-tree/dist/internal").NonEmptyObject & {
+                setSubschema(slotName: string, data: Record<string, unknown>): Record<string, unknown> | ({
+                    [x: string]: any;
+                } & import("mobx-state-tree/dist/internal").NonEmptyObject & {
+                    setSubschema(slotName: string, data: Record<string, unknown>): Record<string, unknown> | ({
+                        [x: string]: any;
+                    } & import("mobx-state-tree/dist/internal").NonEmptyObject & any & import("mobx-state-tree").IStateTreeNode<import("@jbrowse/core/configuration").AnyConfigurationSchemaType>);
+                } & import("mobx-state-tree").IStateTreeNode<import("@jbrowse/core/configuration").AnyConfigurationSchemaType>);
+            } & import("mobx-state-tree").IStateTreeNode<import("@jbrowse/core/configuration").AnyConfigurationSchemaType>;
+            label: string;
+            assemblyNames: any;
+            type: string;
+            loc: import("@jbrowse/core/util").FileLocation;
+        }[];
+    } & {
+        setSelectedAssemblyName(s: string): void;
+        setFileSource(newSource: unknown): void;
+        setColumnNameLineNumber(newnumber: number): void;
+        setFileType(typeName: string): void;
+        setError(error: unknown): void;
+        setLoading(arg: boolean): void;
+        cancelButton(): void;
+        setCachedFileHandle(arg: import("@jbrowse/core/util").FileLocation): void;
+    } & {
+        import(assemblyName: string): Promise<void>;
+    } & {
+        afterAttach(): void;
+    }, import("mobx-state-tree")._NotCustomized, import("mobx-state-tree")._NotCustomized>, [undefined]>;
+    spreadsheet: import("mobx-state-tree").IMaybe<import("mobx-state-tree").IModelType<{
+        rowSet: import("mobx-state-tree").IType<import("./SpreadsheetModel").RowSet | undefined, import("./SpreadsheetModel").RowSet | undefined, import("./SpreadsheetModel").RowSet | undefined>;
+        columns: import("mobx-state-tree").IType<{
+            name: string;
+        }[], {
+            name: string;
+        }[], {
+            name: string;
+        }[]>;
+        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: {
+            id: number;
+            feature: import("@jbrowse/core/util").SimpleFeatureSerialized | undefined;
+        }[] | undefined;
+        readonly initialized: boolean | undefined;
+    } & {
+        readonly dataGridColumns: ({
+            field: string;
+            width: number;
+        } | {
+            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";
+            valueGetter?: undefined;
+            valueFormatter?: undefined;
+        } | {
+            field: string;
+            width: number;
+            valueGetter: (_val: unknown, row: {
+                feature?: import("@jbrowse/core/util").SimpleFeatureSerialized;
+            }) => number | undefined;
+            valueFormatter: (arg: never) => string;
+            renderCell?: undefined;
+        })[] | undefined;
+    } & {
+        readonly visibleRows: {
+            id: number;
+            feature: import("@jbrowse/core/util").SimpleFeatureSerialized | undefined;
+        }[] | undefined;
+    } & {
+        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<{
+            name: string;
+        }[], {
+            name: string;
+        }[], {
+            name: string;
+        }[]>;
+        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>>;
+    }>>, import("mobx-state-tree")._NotCustomized>>;
+}> | {
+    spreadsheet: {
+        columns: {
+            name: string;
+        }[];
+        assemblyName: string | undefined;
+        visibleColumns: Record<string, boolean>;
+    };
+    id: string;
+    type: "SpreadsheetView";
+    height: number;
+    displayName: string | undefined;
+    minimized: boolean;
+    hideVerticalResizeHandle: boolean;
+    offsetPx: number;
+    hideFilterControls: boolean;
+    importWizard: import("mobx-state-tree").ModelSnapshotType<{
+        fileType: import("mobx-state-tree").IOptionalIType<import("mobx-state-tree").ISimpleType<string>, [undefined]>;
+        hasColumnNameLine: import("mobx-state-tree").IType<boolean | undefined, boolean, boolean>;
+        columnNameLineNumber: import("mobx-state-tree").IType<number | undefined, number, number>;
+        selectedAssemblyName: import("mobx-state-tree").IMaybe<import("mobx-state-tree").ISimpleType<string>>;
+        cachedFileLocation: import("mobx-state-tree").IType<import("@jbrowse/core/util").FileLocation | undefined, import("@jbrowse/core/util").FileLocation | undefined, import("@jbrowse/core/util").FileLocation | undefined>;
+    }>;
+}>;
+export type SpreadsheetViewStateModel = ReturnType<typeof stateModelFactory>;
+export type SpreadsheetViewModel = Instance<SpreadsheetViewStateModel>;

package/esm/SpreadsheetView/SpreadsheetViewModel.js

@@ -0,0 +1,88 @@
+import { BaseViewModel } from '@jbrowse/core/pluggableElementTypes/models';
+import { getSession } from '@jbrowse/core/util';
+import FolderOpenIcon from '@mui/icons-material/FolderOpen';
+import { cast, types } from 'mobx-state-tree';
+import ImportWizard from './ImportWizard';
+import Spreadsheet from './SpreadsheetModel';
+const minHeight = 40;
+const defaultHeight = 440;
+function x() { }
+export default function stateModelFactory() {
+    const ImportWizardModel = ImportWizard();
+    return types
+        .compose(BaseViewModel, types
+        .model('SpreadsheetView', {
+        type: types.literal('SpreadsheetView'),
+        offsetPx: 0,
+        height: types.optional(types.number, defaultHeight),
+        hideVerticalResizeHandle: false,
+        hideFilterControls: false,
+        importWizard: types.optional(ImportWizardModel, () => ImportWizardModel.create()),
+        spreadsheet: types.maybe(Spreadsheet()),
+    })
+        .volatile(() => ({
+        width: 400,
+        rowMenuItems: [],
+    }))
+        .views(self => ({
+        get assembly() {
+            var _a, _b;
+            const name = (_a = self.spreadsheet) === null || _a === void 0 ? void 0 : _a.assemblyName;
+            return name
+                ? (_b = getSession(self).assemblyManager.get(name)) === null || _b === void 0 ? void 0 : _b.configuration
+                : undefined;
+        },
+    }))
+        .actions(self => ({
+        setRowMenuItems(newItems) {
+            self.rowMenuItems = newItems;
+        },
+        setWidth(newWidth) {
+            self.width = newWidth;
+            return self.width;
+        },
+        setHeight(newHeight) {
+            self.height = Math.max(newHeight, minHeight);
+            return self.height;
+        },
+        resizeHeight(distance) {
+            const oldHeight = self.height;
+            const newHeight = this.setHeight(self.height + distance);
+            return newHeight - oldHeight;
+        },
+        resizeWidth(distance) {
+            const oldWidth = self.width;
+            const newWidth = this.setWidth(self.width + distance);
+            return newWidth - oldWidth;
+        },
+        displaySpreadsheet(spreadsheet) {
+            self.spreadsheet = cast(spreadsheet);
+        },
+    }))
+        .views(self => ({
+        menuItems() {
+            return [
+                {
+                    label: 'Return to import form',
+                    icon: FolderOpenIcon,
+                    onClick: () => {
+                        self.displaySpreadsheet(undefined);
+                    },
+                },
+            ];
+        },
+    })))
+        .postProcessSnapshot(snap => {
+        const { importWizard, spreadsheet } = snap;
+        if (importWizard.cachedFileLocation && spreadsheet) {
+            const { rowSet, ...rest } = spreadsheet;
+            return {
+                ...snap,
+                spreadsheet: rest,
+            };
+        }
+        else {
+            return snap;
+        }
+    });
+}

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

@@ -0,0 +1 @@
+export { BreakendMultiLevelOptionDialog as default } from '@jbrowse/sv-core';

package/esm/SpreadsheetView/components/BreakendMultiLevelOptionDialog.js

@@ -0,0 +1 @@
+export { BreakendMultiLevelOptionDialog as default } from '@jbrowse/sv-core';

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

@@ -0,0 +1 @@
+export { BreakendSingleLevelOptionDialog as default } from '@jbrowse/sv-core';

package/esm/SpreadsheetView/components/BreakendSingleLevelOptionDialog.js

@@ -0,0 +1 @@
+export { BreakendSingleLevelOptionDialog as default } from '@jbrowse/sv-core';

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

@@ -0,0 +1,8 @@
+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;

package/esm/SpreadsheetView/components/FeatureMenu.js

@@ -0,0 +1,66 @@
+import React, { lazy } from 'react';
+import CascadingMenuButton from '@jbrowse/core/ui/CascadingMenuButton';
+import { SimpleFeature, assembleLocStringFast } from '@jbrowse/core/util';
+import ArrowDropDownIcon from '@mui/icons-material/ArrowDropDown';
+import { getEnv } from 'mobx-state-tree';
+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: [
+            {
+                label: 'Open in linear genome view',
+                onClick: async () => {
+                    try {
+                        await locationLinkClick({
+                            spreadsheetViewId,
+                            assemblyName,
+                            session,
+                            locString: assembleLocStringFast(feature),
+                        });
+                    }
+                    catch (e) {
+                        console.error(e);
+                        session.notifyError(`${e}`, e);
+                    }
+                },
+            },
+            {
+                label: 'Open in single-level split view',
+                onClick: async () => {
+                    const { pluginManager } = getEnv(session);
+                    const viewType = pluginManager.getViewType('BreakpointSplitView');
+                    session.queueDialog(handleClose => [
+                        BreakendSingleLevelOptionDialog,
+                        {
+                            handleClose,
+                            session,
+                            stableViewId: `${spreadsheetViewId}_${assemblyName}_breakpointsplitview_singlelevel`,
+                            feature: new SimpleFeature(feature),
+                            viewType,
+                            assemblyName,
+                        },
+                    ]);
+                },
+            },
+            {
+                label: 'Open in multi-level split view',
+                onClick: async () => {
+                    const { pluginManager } = getEnv(session);
+                    const viewType = pluginManager.getViewType('BreakpointSplitView');
+                    session.queueDialog(handleClose => [
+                        BreakendMultiLevelOptionDialog,
+                        {
+                            handleClose,
+                            session,
+                            stableViewId: `${spreadsheetViewId}_${assemblyName}_breakpointsplitview_multilevel`,
+                            feature: new SimpleFeature(feature),
+                            viewType,
+                            assemblyName,
+                        },
+                    ]);
+                },
+            },
+        ] },
+        React.createElement(ArrowDropDownIcon, null)));
+}

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

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

package/esm/SpreadsheetView/components/ImportWizard.js

@@ -1,62 +1,59 @@
 import React, { useState } from 'react';
-import { Button, Checkbox, FormControl, FormGroup, FormLabel, FormControlLabel, RadioGroup, Radio, } from '@mui/material';
+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';
 import { observer } from 'mobx-react';
 import { getRoot } from 'mobx-state-tree';
-import { getSession } from '@jbrowse/core/util';
-import { FileSelector, ErrorMessage, AssemblySelector } from '@jbrowse/core/ui';
-import NumberEditor from './NumberEditor';
 import { makeStyles } from 'tss-react/mui';
+import TrackSelector from './TrackSelector';
 const useStyles = makeStyles()({
     container: {
         margin: '0 auto',
-        maxWidth: '25em',
+        maxWidth: '40em',
         padding: 20,
     },
 });
-const ImportWizard = observer(({ model }) => {
+const ImportWizard = observer(function ({ model, }) {
     var _a;
     const session = getSession(model);
     const { classes } = useStyles();
     const { assemblyNames, assemblyManager } = session;
-    const { fileType, canCancel, fileSource, isReadyToOpen, fileTypes, hasColumnNameLine, error, } = model;
-    const [selected, setSelected] = useState(assemblyNames[0]);
-    const err = ((_a = assemblyManager.get(selected)) === null || _a === void 0 ? void 0 : _a.error) || error;
-    const showRowControls = fileType === 'CSV' || fileType === 'TSV';
+    const { loading, fileType, fileSource, isReadyToOpen, fileTypes, error } = model;
+    const [selectedAssembly, setSelectedAssembly] = useState(assemblyNames[0]);
+    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", { className: classes.container },
+    return (React.createElement("div", null,
         err ? React.createElement(ErrorMessage, { error: err }) : null,
-        React.createElement("div", null,
-            React.createElement(FormControl, { component: "fieldset" },
-                React.createElement(FormLabel, { component: "legend" }, "Tabular file"),
-                React.createElement(FormGroup, null,
-                    React.createElement(FileSelector, { location: fileSource, setLocation: arg => {
-                            model.setFileSource(arg);
-                        }, rootModel: rootModel })))),
-        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 }, fileTypes.map(fileTypeName => (React.createElement(FormControlLabel, { key: fileTypeName, checked: fileType === fileTypeName, value: fileTypeName, onClick: () => {
-                        model.setFileType(fileTypeName);
-                    }, control: React.createElement(Radio, null), label: fileTypeName })))))),
-        showRowControls ? (React.createElement("div", null,
-            React.createElement(FormControl, { component: "fieldset" },
-                React.createElement(FormLabel, { component: "legend" }, "Column Names"),
-                React.createElement(FormControlLabel, { disabled: !showRowControls, label: "has column names on line", labelPlacement: "end", control: React.createElement(Checkbox, { checked: hasColumnNameLine, onClick: () => {
-                            model.toggleHasColumnNameLine();
-                        } }) }),
-                React.createElement(NumberEditor, { model: model, disabled: !hasColumnNameLine, modelPropName: "columnNameLineNumber", modelSetterName: "setColumnNameLineNumber" })))) : null,
-        React.createElement("div", null,
-            React.createElement(AssemblySelector, { session: session, selected: selected, onChange: val => {
-                    setSelected(val);
-                } })),
-        React.createElement("div", null,
-            canCancel ? (React.createElement(Button, { variant: "contained", color: "secondary", onClick: () => {
-                    model.cancelButton();
-                }, disabled: !canCancel }, "Cancel")) : null,
-            ' ',
-            React.createElement(Button, { disabled: !isReadyToOpen || !!err, variant: "contained", "data-testid": "open_spreadsheet", color: "primary", onClick: () => {
-                    // eslint-disable-next-line @typescript-eslint/no-floating-promises
-                    model.import(selected);
-                } }, "Open"))));
+        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")))));
 });
 export default ImportWizard;

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

@@ -0,0 +1,8 @@
+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;

package/esm/SpreadsheetView/components/LocationCell.js

@@ -0,0 +1,25 @@
+import React from 'react';
+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))));
+}

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

@@ -1,5 +1,5 @@
 import React from 'react';
-import { ImportWizardModel } from '../models/ImportWizard';
+import type { ImportWizardModel } from '../ImportWizard';
 declare const NumberEditor: ({ model, disabled, modelPropName, modelSetterName, }: {
     model: ImportWizardModel;
     disabled: boolean;