@jbrowse/core 2.1.4 → 2.1.6

package/ui/AboutDialog.d.ts

@@ -1,5 +1,11 @@
 /// <reference types="react" />
 import { AnyConfigurationModel } from '../configuration';
+export declare function FileInfo({ config }: {
+    config: AnyConfigurationModel;
+}): JSX.Element | null;
+export declare function AboutContents({ config }: {
+    config: AnyConfigurationModel;
+}): JSX.Element;
 export default function AboutDialog({ config, handleClose, }: {
     config: AnyConfigurationModel;
     handleClose: () => void;

package/ui/AboutDialog.js

@@ -26,6 +26,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.AboutContents = exports.FileInfo = void 0;
 const react_1 = __importStar(require("react"));
 const copy_to_clipboard_1 = __importDefault(require("copy-to-clipboard"));
 const material_1 = require("@mui/material");
@@ -33,6 +34,7 @@ const Close_1 = __importDefault(require("@mui/icons-material/Close"));
 const mui_1 = require("tss-react/mui");
 const configuration_1 = require("../configuration");
 const util_1 = require("../util");
+const tracks_1 = require("../util/tracks");
 const BaseFeatureDetail_1 = require("../BaseFeatureWidget/BaseFeatureDetail");
 const useStyles = (0, mui_1.makeStyles)()(theme => ({
     closeButton: {
@@ -45,14 +47,11 @@ const useStyles = (0, mui_1.makeStyles)()(theme => ({
         minWidth: 800,
     },
 }));
-function AboutDialog({ config, handleClose, }) {
-    const { classes } = useStyles();
-    const [info, setInfo] = (0, react_1.useState)();
+function FileInfo({ config }) {
     const [error, setError] = (0, react_1.useState)();
-    const [copied, setCopied] = (0, react_1.useState)(false);
+    const [info, setInfo] = (0, react_1.useState)();
     const session = (0, util_1.getSession)(config);
     const { rpcManager } = session;
-    const conf = (0, configuration_1.readConfObject)(config);
     (0, react_1.useEffect)(() => {
         const aborter = new AbortController();
         const { signal } = aborter;
@@ -80,13 +79,6 @@ function AboutDialog({ config, handleClose, }) {
             cancelled = true;
         };
     }, [config, rpcManager]);
-    let trackName = (0, configuration_1.readConfObject)(config, 'name');
-    if ((0, configuration_1.readConfObject)(config, 'type') === 'ReferenceSequenceTrack') {
-        const asm = session.assemblies.find(a => a.sequence === config.configuration);
-        trackName = asm
-            ? `Reference Sequence (${(0, configuration_1.readConfObject)(asm, 'displayName') || (0, configuration_1.readConfObject)(asm, 'name')})`
-            : 'Reference Sequence';
-    }
     const details = typeof info === 'string'
         ? {
             header: `<pre>${info
@@ -94,19 +86,49 @@ function AboutDialog({ config, handleClose, }) {
                 .replace(/>/g, '&gt;')}</pre>`,
         }
         : info || {};
+    return info !== null ? (react_1.default.createElement(BaseFeatureDetail_1.BaseCard, { title: "File info" }, error ? (react_1.default.createElement(material_1.Typography, { color: "error" }, `${error}`)) : info === undefined ? ('Loading file data...') : (react_1.default.createElement(BaseFeatureDetail_1.Attributes, { attributes: details })))) : null;
+}
+exports.FileInfo = FileInfo;
+function AboutContents({ config }) {
+    const [copied, setCopied] = (0, react_1.useState)(false);
+    const conf = (0, configuration_1.readConfObject)(config);
+    const session = (0, util_1.getSession)(config);
+    const hideUris = (0, configuration_1.getConf)(session, ['formatAbout', 'hideUris']) ||
+        (0, configuration_1.readConfObject)(config, ['formatAbout', 'hideUris']);
+    const { pluginManager } = (0, util_1.getEnv)(session);
+    const confPostExt = pluginManager.evaluateExtensionPoint('Core-customizeAbout', {
+        config: {
+            ...conf,
+            ...(0, configuration_1.getConf)(session, ['formatAbout', 'config'], { config: conf }),
+            ...(0, configuration_1.readConfObject)(config, ['formatAbout', 'config'], { config: conf }),
+        },
+    }, { session, config });
+    const ExtraPanel = pluginManager.evaluateExtensionPoint('Core-extraAboutPanel', null, { session, config });
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(BaseFeatureDetail_1.BaseCard, { title: "Configuration" },
+            !hideUris ? (react_1.default.createElement(material_1.Button, { variant: "contained", style: { float: 'right' }, onClick: () => {
+                    (0, copy_to_clipboard_1.default)(JSON.stringify(conf, null, 2));
+                    setCopied(true);
+                    setTimeout(() => setCopied(false), 1000);
+                } }, copied ? 'Copied to clipboard!' : 'Copy config')) : null,
+            react_1.default.createElement(BaseFeatureDetail_1.Attributes, { attributes: confPostExt, omit: ['displays', 'baseUri', 'refNames', 'formatAbout'], hideUris: hideUris })),
+        ExtraPanel ? (react_1.default.createElement(BaseFeatureDetail_1.BaseCard, { title: ExtraPanel.name },
+            react_1.default.createElement(ExtraPanel.Component, { config: config }))) : null,
+        react_1.default.createElement(FileInfo, { config: config })));
+}
+exports.AboutContents = AboutContents;
+function AboutDialog({ config, handleClose, }) {
+    const { classes } = useStyles();
+    const session = (0, util_1.getSession)(config);
+    const trackName = (0, tracks_1.getTrackName)(config, session);
+    const { pluginManager } = (0, util_1.getEnv)(session);
+    const AboutComponent = pluginManager.evaluateExtensionPoint('Core-replaceAbout', AboutContents, { session, config });
     return (react_1.default.createElement(material_1.Dialog, { open: true, onClose: handleClose, maxWidth: "xl" },
         react_1.default.createElement(material_1.DialogTitle, null,
             trackName,
             react_1.default.createElement(material_1.IconButton, { className: classes.closeButton, onClick: () => handleClose(), size: "large" },
                 react_1.default.createElement(Close_1.default, null))),
         react_1.default.createElement(material_1.DialogContent, { className: classes.content },
-            react_1.default.createElement(BaseFeatureDetail_1.BaseCard, { title: "Configuration" },
-                react_1.default.createElement(material_1.Button, { variant: "contained", style: { float: 'right' }, onClick: () => {
-                        (0, copy_to_clipboard_1.default)(JSON.stringify(conf, null, 2));
-                        setCopied(true);
-                        setTimeout(() => setCopied(false), 1000);
-                    } }, copied ? 'Copied to clipboard!' : 'Copy config'),
-                react_1.default.createElement(BaseFeatureDetail_1.Attributes, { attributes: conf, omit: ['displays', 'baseUri', 'refNames'] })),
-            info !== null ? (react_1.default.createElement(BaseFeatureDetail_1.BaseCard, { title: "File info" }, error ? (react_1.default.createElement(material_1.Typography, { color: "error" }, `${error}`)) : info === undefined ? ('Loading file data...') : (react_1.default.createElement(BaseFeatureDetail_1.Attributes, { attributes: details })))) : null)));
+            react_1.default.createElement(AboutComponent, { config: config }))));
 }
 exports.default = AboutDialog;

package/ui/App.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import { NotificationLevel, SessionWithDrawerWidgets, SnackAction } from '../util';
 import { MenuItem as JBMenuItem } from './index';
 declare type SnackbarMessage = [string, NotificationLevel, SnackAction];
-declare const App: ({ session, HeaderButtons, }: {
+declare const App: (props: {
     HeaderButtons?: React.ReactElement<any, string | React.JSXElementConstructor<any>> | undefined;
     session: SessionWithDrawerWidgets & {
         savedSessionNames: string[];

package/ui/App.js

@@ -30,12 +30,14 @@ const react_1 = __importStar(require("react"));
 const material_1 = require("@mui/material");
 const mui_1 = require("tss-react/mui");
 const Launch_1 = __importDefault(require("@mui/icons-material/Launch"));
+const react_error_boundary_1 = require("react-error-boundary");
 const mobx_react_1 = require("mobx-react");
 const mobx_state_tree_1 = require("mobx-state-tree");
 // locals
 const configuration_1 = require("../configuration");
 const DrawerWidget_1 = __importDefault(require("./DrawerWidget"));
 const DropDownMenu_1 = __importDefault(require("./DropDownMenu"));
+const ErrorMessage_1 = __importDefault(require("./ErrorMessage"));
 const EditableTypography_1 = __importDefault(require("./EditableTypography"));
 const Logo_1 = require("./Logo");
 const Snackbar_1 = __importDefault(require("./Snackbar"));
@@ -104,13 +106,9 @@ const Logo = (0, mobx_react_1.observer)(({ session }) => {
         return react_1.default.createElement("img", { src: logoPath.uri, alt: "Custom logo" });
     }
 });
-const App = (0, mobx_react_1.observer)(({ session, HeaderButtons = react_1.default.createElement("div", null), }) => {
-    var _a;
+const AppToolbar = (0, mobx_react_1.observer)(({ session, HeaderButtons = react_1.default.createElement("div", null), }) => {
     const { classes } = useStyles();
-    const { pluginManager } = (0, mobx_state_tree_1.getEnv)(session);
-    const viewTypes = pluginManager.getElementTypeRecord('view').all();
-    const [value, setValue] = (0, react_1.useState)((_a = viewTypes[0]) === null || _a === void 0 ? void 0 : _a.name);
-    const { visibleWidget, drawerWidth, minimized, activeWidgets, savedSessionNames, name, menus, views, drawerPosition, } = session;
+    const { savedSessionNames, name, menus } = session;
     function handleNameChange(newName) {
         if (savedSessionNames === null || savedSessionNames === void 0 ? void 0 : savedSessionNames.includes(newName)) {
             session.notify(`Cannot rename session to "${newName}", a saved session with that name already exists`, 'warning');
@@ -119,6 +117,48 @@ const App = (0, mobx_react_1.observer)(({ session, HeaderButtons = react_1.defau
             session.renameCurrentSession(newName);
         }
     }
+    return (react_1.default.createElement(material_1.Toolbar, null,
+        menus.map(menu => (react_1.default.createElement(DropDownMenu_1.default, { key: menu.label, menuTitle: menu.label, menuItems: menu.menuItems, session: session }))),
+        react_1.default.createElement("div", { className: classes.grow }),
+        react_1.default.createElement(material_1.Tooltip, { title: "Rename Session", arrow: true },
+            react_1.default.createElement(EditableTypography_1.default, { value: name, setValue: handleNameChange, variant: "body1", classes: {
+                    inputBase: classes.inputBase,
+                    inputRoot: classes.inputRoot,
+                    inputFocused: classes.inputFocused,
+                } })),
+        HeaderButtons,
+        react_1.default.createElement("div", { className: classes.grow }),
+        react_1.default.createElement("div", { style: { width: 150, maxHeight: 48 } },
+            react_1.default.createElement(Logo, { session: session }))));
+});
+const ViewLauncher = (0, mobx_react_1.observer)(({ session }) => {
+    var _a;
+    const { classes } = useStyles();
+    const { pluginManager } = (0, mobx_state_tree_1.getEnv)(session);
+    const viewTypes = pluginManager.getElementTypeRecord('view').all();
+    const [value, setValue] = (0, react_1.useState)((_a = viewTypes[0]) === null || _a === void 0 ? void 0 : _a.name);
+    return (react_1.default.createElement(material_1.Paper, { className: classes.selectPaper },
+        react_1.default.createElement(material_1.Typography, null, "Select a view to launch"),
+        react_1.default.createElement(material_1.Select, { value: value, onChange: event => setValue(event.target.value) }, viewTypes.map(({ name }) => (react_1.default.createElement(material_1.MenuItem, { key: name, value: name }, name)))),
+        react_1.default.createElement(material_1.Button, { onClick: () => {
+                session.addView(value, {});
+            }, variant: "contained", color: "primary" }, "Launch view")));
+});
+const ViewPanel = (0, mobx_react_1.observer)(({ view, session }) => {
+    const { pluginManager } = (0, mobx_state_tree_1.getEnv)(session);
+    const viewType = pluginManager.getViewType(view.type);
+    if (!viewType) {
+        throw new Error(`unknown view type ${view.type}`);
+    }
+    const { ReactComponent } = viewType;
+    return (react_1.default.createElement(ViewContainer_1.default, { view: view, onClose: () => session.removeView(view) },
+        react_1.default.createElement(react_1.Suspense, { fallback: react_1.default.createElement("div", null, "Loading...") },
+            react_1.default.createElement(ReactComponent, { model: view, session: session, getTrackType: pluginManager.getTrackType }))));
+});
+const App = (0, mobx_react_1.observer)((props) => {
+    const { session } = props;
+    const { classes } = useStyles();
+    const { minimized, visibleWidget, drawerWidth, activeWidgets, views, drawerPosition, } = session;
     const drawerVisible = visibleWidget && !minimized;
     let grid;
     if (drawerPosition === 'right') {
@@ -142,43 +182,10 @@ const App = (0, mobx_react_1.observer)(({ session, HeaderButtons = react_1.defau
         react_1.default.createElement("div", { className: classes.menuBarAndComponents },
             react_1.default.createElement("div", { className: classes.menuBar },
                 react_1.default.createElement(material_1.AppBar, { className: classes.appBar, position: "static" },
-                    react_1.default.createElement(material_1.Toolbar, null,
-                        menus.map(menu => (react_1.default.createElement(DropDownMenu_1.default, { key: menu.label, menuTitle: menu.label, menuItems: menu.menuItems, session: session }))),
-                        react_1.default.createElement("div", { className: classes.grow }),
-                        react_1.default.createElement(material_1.Tooltip, { title: "Rename Session", arrow: true },
-                            react_1.default.createElement(EditableTypography_1.default, { value: name, setValue: handleNameChange, variant: "body1", classes: {
-                                    inputBase: classes.inputBase,
-                                    inputRoot: classes.inputRoot,
-                                    inputFocused: classes.inputFocused,
-                                } })),
-                        HeaderButtons,
-                        react_1.default.createElement("div", { className: classes.grow }),
-                        react_1.default.createElement("div", { style: { width: 150, maxHeight: 48 } },
-                            react_1.default.createElement(Logo, { session: session }))))),
+                    react_1.default.createElement(AppToolbar, { ...props }))),
             react_1.default.createElement("div", { className: classes.components },
-                views.length ? (views.map(view => {
-                    const viewType = pluginManager.getViewType(view.type);
-                    if (!viewType) {
-                        throw new Error(`unknown view type ${view.type}`);
-                    }
-                    const { ReactComponent } = viewType;
-                    return (react_1.default.createElement(ViewContainer_1.default, { key: `view-${view.id}`, view: view, onClose: () => {
-                            session.removeView(view);
-                            session.notify(`A view has been closed`, 'info', {
-                                name: 'undo',
-                                onClick: () => {
-                                    pluginManager.rootModel.history.undo();
-                                },
-                            });
-                        } },
-                        react_1.default.createElement(react_1.Suspense, { fallback: react_1.default.createElement("div", null, "Loading...") },
-                            react_1.default.createElement(ReactComponent, { model: view, session: session, getTrackType: pluginManager.getTrackType }))));
-                })) : (react_1.default.createElement(material_1.Paper, { className: classes.selectPaper },
-                    react_1.default.createElement(material_1.Typography, null, "Select a view to launch"),
-                    react_1.default.createElement(material_1.Select, { value: value, onChange: event => setValue(event.target.value) }, viewTypes.map(({ name }) => (react_1.default.createElement(material_1.MenuItem, { key: name, value: name }, name)))),
-                    react_1.default.createElement(material_1.Button, { onClick: () => {
-                            session.addView(value, {});
-                        }, variant: "contained", color: "primary" }, "Launch view"))),
+                views.length ? (views.map(view => (react_1.default.createElement(react_error_boundary_1.ErrorBoundary, { key: `view-${view.id}`, FallbackComponent: ({ error }) => (react_1.default.createElement(ErrorMessage_1.default, { error: error })) },
+                    react_1.default.createElement(ViewPanel, { view: view, session: session }))))) : (react_1.default.createElement(ViewLauncher, { ...props })),
                 react_1.default.createElement("div", { style: { height: 300 } }))),
         activeWidgets.size > 0 && minimized ? (react_1.default.createElement(material_1.Tooltip, { title: "Open drawer widget" },
             react_1.default.createElement(material_1.Fab, { className: drawerPosition === 'right' ? classes.fabRight : classes.fabLeft, color: "primary", "data-testid": "drawer-maximize", onClick: () => session.showWidgetDrawer() },

package/ui/DrawerWidget.js

@@ -27,10 +27,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importStar(require("react"));
+const react_error_boundary_1 = require("react-error-boundary");
 const material_1 = require("@mui/material");
 const mui_1 = require("tss-react/mui");
 const mobx_react_1 = require("mobx-react");
-const mobx_state_tree_1 = require("mobx-state-tree");
+const util_1 = require("../util");
 // icons
 const Delete_1 = __importDefault(require("@mui/icons-material/Delete"));
 const Close_1 = __importDefault(require("@mui/icons-material/Close"));
@@ -38,6 +39,7 @@ const Minimize_1 = __importDefault(require("@mui/icons-material/Minimize"));
 const MoreVert_1 = __importDefault(require("@mui/icons-material/MoreVert"));
 // locals
 const Drawer_1 = __importDefault(require("./Drawer"));
+const ErrorMessage_1 = __importDefault(require("./ErrorMessage"));
 const useStyles = (0, mui_1.makeStyles)()(theme => ({
     formControl: {
         margin: 0,
@@ -57,10 +59,10 @@ const useStyles = (0, mui_1.makeStyles)()(theme => ({
     },
 }));
 const DrawerHeader = (0, mobx_react_1.observer)(({ session, setToolbarHeight, }) => {
-    const { pluginManager } = (0, mobx_state_tree_1.getEnv)(session);
+    const { pluginManager } = (0, util_1.getEnv)(session);
     const { visibleWidget, activeWidgets, drawerPosition } = session;
     const { classes } = useStyles();
-    const [anchorEl, setAnchorEl] = react_1.default.useState(null);
+    const [anchorEl, setAnchorEl] = (0, react_1.useState)(null);
     return (react_1.default.createElement(material_1.AppBar, { position: "sticky", className: classes.header, ref: ref => setToolbarHeight((ref === null || ref === void 0 ? void 0 : ref.getBoundingClientRect().height) || 0) },
         react_1.default.createElement(material_1.Toolbar, { disableGutters: true },
             react_1.default.createElement(material_1.FormControl, { className: classes.formControl },
@@ -108,9 +110,12 @@ const DrawerHeader = (0, mobx_react_1.observer)(({ session, setToolbarHeight, })
 });
 const DrawerWidget = (0, mobx_react_1.observer)(({ session }) => {
     const { visibleWidget } = session;
-    const { pluginManager } = (0, mobx_state_tree_1.getEnv)(session);
+    const { pluginManager } = (0, util_1.getEnv)(session);
     const DrawerComponent = visibleWidget
-        ? pluginManager.getWidgetType(visibleWidget.type).ReactComponent
+        ? pluginManager.evaluateExtensionPoint('Core-replaceWidget', pluginManager.getWidgetType(visibleWidget.type).ReactComponent, {
+            session,
+            model: visibleWidget,
+        })
         : null;
     // we track the toolbar height because components that use virtualized
     // height want to be able to fill the contained, minus the toolbar height
@@ -119,6 +124,6 @@ const DrawerWidget = (0, mobx_react_1.observer)(({ session }) => {
     return (react_1.default.createElement(Drawer_1.default, { session: session },
         react_1.default.createElement(DrawerHeader, { session: session, setToolbarHeight: setToolbarHeight }),
         react_1.default.createElement(react_1.Suspense, { fallback: react_1.default.createElement("div", null, "Loading...") },
-            react_1.default.createElement(DrawerComponent, { model: visibleWidget, session: session, toolbarHeight: toolbarHeight }))));
+            react_1.default.createElement(react_error_boundary_1.ErrorBoundary, { FallbackComponent: ({ error }) => react_1.default.createElement(ErrorMessage_1.default, { error: error }) }, DrawerComponent ? (react_1.default.createElement(DrawerComponent, { model: visibleWidget, session: session, toolbarHeight: toolbarHeight })) : null))));
 });
 exports.default = DrawerWidget;

package/ui/FatalErrorDialog.d.ts

@@ -1,24 +1,8 @@
 /// <reference types="react" />
-import PropTypes from 'prop-types';
-declare const FatalErrorDialog: {
-    ({ componentStack, error, onFactoryReset, resetButtonText, }: {
-        componentStack: string;
-        error: Error;
-        onFactoryReset: Function;
-        resetButtonText: string;
-    }): JSX.Element;
-    propTypes: {
-        componentStack: PropTypes.Requireable<string>;
-        error: PropTypes.Requireable<PropTypes.InferProps<{}>>;
-        onFactoryReset: PropTypes.Validator<(...args: any[]) => any>;
-        resetButtonText: PropTypes.Requireable<string>;
-    };
-    defaultProps: {
-        error: {
-            message: string;
-        };
-        componentStack: string;
-        resetButtonText: string;
-    };
-};
+declare const FatalErrorDialog: ({ componentStack, error, onFactoryReset, resetButtonText, }: {
+    componentStack?: string | undefined;
+    error?: unknown;
+    onFactoryReset: Function;
+    resetButtonText?: string | undefined;
+}) => JSX.Element;
 export default FatalErrorDialog;

package/ui/FatalErrorDialog.js

@@ -26,44 +26,25 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-const Button_1 = __importDefault(require("@mui/material/Button"));
-const Dialog_1 = __importDefault(require("@mui/material/Dialog"));
-const DialogActions_1 = __importDefault(require("@mui/material/DialogActions"));
-const DialogContent_1 = __importDefault(require("@mui/material/DialogContent"));
-const DialogTitle_1 = __importDefault(require("@mui/material/DialogTitle"));
-const prop_types_1 = __importDefault(require("prop-types"));
 const react_1 = __importStar(require("react"));
+const material_1 = require("@mui/material");
 const FactoryResetDialog_1 = __importDefault(require("./FactoryResetDialog"));
 const ResetComponent = ({ onFactoryReset, resetButtonText, }) => {
     const [dialogOpen, setDialogOpen] = (0, react_1.useState)(false);
     return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(Button_1.default, { "data-testid": "fatal-error", color: "primary", variant: "contained", onClick: () => setDialogOpen(true) }, resetButtonText),
+        react_1.default.createElement(material_1.Button, { "data-testid": "fatal-error", color: "primary", variant: "contained", onClick: () => setDialogOpen(true) }, resetButtonText),
         react_1.default.createElement(FactoryResetDialog_1.default, { onClose: () => setDialogOpen(false), open: dialogOpen, onFactoryReset: onFactoryReset })));
 };
-ResetComponent.propTypes = {
-    onFactoryReset: prop_types_1.default.func.isRequired,
-    resetButtonText: prop_types_1.default.string.isRequired,
-};
-const FatalErrorDialog = ({ componentStack, error, onFactoryReset, resetButtonText, }) => {
-    return (react_1.default.createElement(Dialog_1.default, { open: true },
-        react_1.default.createElement(DialogTitle_1.default, { style: { backgroundColor: '#e88' } }, "Fatal error"),
-        react_1.default.createElement(DialogContent_1.default, null,
+const FatalErrorDialog = ({ componentStack, error = 'No error message provided', onFactoryReset, resetButtonText = 'Factory Reset', }) => {
+    console.error(error);
+    return (react_1.default.createElement(material_1.Dialog, { open: true },
+        react_1.default.createElement(material_1.DialogTitle, { style: { background: '#e88' } }, "Fatal error"),
+        react_1.default.createElement(material_1.DialogContent, null,
             react_1.default.createElement("pre", null,
-                error.toString(),
+                `${error}`,
                 componentStack)),
-        react_1.default.createElement(DialogActions_1.default, null,
-            react_1.default.createElement(Button_1.default, { color: "secondary", variant: "contained", onClick: () => window.location.reload() }, "Refresh"),
+        react_1.default.createElement(material_1.DialogActions, null,
+            react_1.default.createElement(material_1.Button, { color: "secondary", variant: "contained", onClick: () => window.location.reload() }, "Refresh"),
             react_1.default.createElement(ResetComponent, { onFactoryReset: onFactoryReset, resetButtonText: resetButtonText }))));
 };
-FatalErrorDialog.propTypes = {
-    componentStack: prop_types_1.default.string,
-    error: prop_types_1.default.shape({}),
-    onFactoryReset: prop_types_1.default.func.isRequired,
-    resetButtonText: prop_types_1.default.string,
-};
-FatalErrorDialog.defaultProps = {
-    error: { message: 'No error message provided' },
-    componentStack: '',
-    resetButtonText: 'Factory Reset',
-};
 exports.default = FatalErrorDialog;

package/ui/theme.d.ts

@@ -1,3 +1,4 @@
+import { ThemeOptions } from '@mui/material/styles';
 import type { PaletteOptions } from '@mui/material/styles/createPalette';
 declare module '@mui/material/styles/createPalette' {
     interface Palette {
@@ -43,7 +44,7 @@ export declare function createJBrowseDefaultProps(): {
     components: {
         MuiButton: {
             defaultProps: {
-                size: string;
+                size: "small";
             };
         };
         MuiAccordion: {
@@ -56,43 +57,43 @@ export declare function createJBrowseDefaultProps(): {
         };
         MuiFilledInput: {
             defaultProps: {
-                margin: string;
+                margin: "dense";
             };
         };
         MuiFormControl: {
             defaultProps: {
-                margin: string;
-                size: string;
+                margin: "dense";
+                size: "small";
             };
         };
         MuiFormHelperText: {
             defaultProps: {
-                margin: string;
+                margin: "dense";
             };
         };
         MuiIconButton: {
             defaultProps: {
-                size: string;
+                size: "small";
             };
         };
         MuiInputBase: {
             defaultProps: {
-                margin: string;
+                margin: "dense";
             };
         };
         MuiAutocomplete: {
             defaultProps: {
-                size: string;
+                size: "small";
             };
         };
         MuiInputLabel: {
             defaultProps: {
-                margin: string;
+                margin: "dense";
             };
         };
         MuiToolbar: {
             defaultProps: {
-                variant: string;
+                variant: "dense";
             };
         };
         MuiListItem: {
@@ -102,17 +103,17 @@ export declare function createJBrowseDefaultProps(): {
         };
         MuiOutlinedInput: {
             defaultProps: {
-                margin: string;
+                margin: "dense";
             };
         };
         MuiFab: {
             defaultProps: {
-                size: string;
+                size: "small";
             };
         };
         MuiTable: {
             defaultProps: {
-                size: string;
+                size: "small";
             };
         };
         MuiMenuList: {
@@ -127,8 +128,8 @@ export declare function createJBrowseDefaultProps(): {
         };
         MuiTextField: {
             defaultProps: {
-                margin: string;
-                variant: string;
+                margin: "dense";
+                variant: "standard";
             };
         };
     };
@@ -175,159 +176,5 @@ export declare function createJBrowseDefaultOverrides(palette?: PaletteOptions):
         };
     };
 };
-export declare const jbrowseBaseTheme: {
-    components: {
-        MuiButton: {
-            defaultProps: {
-                size: string;
-            };
-        };
-        MuiAccordion: {
-            defaultProps: {
-                disableGutters: boolean;
-                TransitionProps: {
-                    timeout: number;
-                };
-            };
-        };
-        MuiFilledInput: {
-            defaultProps: {
-                margin: string;
-            };
-        };
-        MuiFormControl: {
-            defaultProps: {
-                margin: string;
-                size: string;
-            };
-        };
-        MuiFormHelperText: {
-            defaultProps: {
-                margin: string;
-            };
-        };
-        MuiIconButton: {
-            defaultProps: {
-                size: string;
-            };
-        };
-        MuiInputBase: {
-            defaultProps: {
-                margin: string;
-            };
-        };
-        MuiAutocomplete: {
-            defaultProps: {
-                size: string;
-            };
-        };
-        MuiInputLabel: {
-            defaultProps: {
-                margin: string;
-            };
-        };
-        MuiToolbar: {
-            defaultProps: {
-                variant: string;
-            };
-        };
-        MuiListItem: {
-            defaultProps: {
-                dense: boolean;
-            };
-        };
-        MuiOutlinedInput: {
-            defaultProps: {
-                margin: string;
-            };
-        };
-        MuiFab: {
-            defaultProps: {
-                size: string;
-            };
-        };
-        MuiTable: {
-            defaultProps: {
-                size: string;
-            };
-        };
-        MuiMenuList: {
-            defaultProps: {
-                dense: boolean;
-            };
-        };
-        MuiMenuItem: {
-            defaultProps: {
-                dense: boolean;
-            };
-        };
-        MuiTextField: {
-            defaultProps: {
-                margin: string;
-                variant: string;
-            };
-        };
-    } & {
-        MuiIconButton: {
-            styleOverrides: {
-                colorSecondary: {
-                    color: string;
-                };
-            };
-        };
-        MuiButton: {
-            styleOverrides: {
-                textSecondary: {
-                    color: string;
-                };
-            };
-        };
-        MuiFab: {
-            styleOverrides: {
-                secondary: {
-                    backgroundColor: string;
-                };
-            };
-        };
-        MuiLink: {
-            styleOverrides: {
-                root: {
-                    color: string;
-                };
-            };
-        };
-        MuiAccordionSummary: {
-            styleOverrides: {
-                root: {
-                    backgroundColor: string;
-                };
-                content: {
-                    color: string;
-                };
-            };
-        };
-    };
-    palette: {
-        primary: {
-            main: string;
-        };
-        secondary: {
-            main: string;
-        };
-        tertiary: import("@mui/material/styles").PaletteColor;
-        quaternary: import("@mui/material/styles").PaletteColor;
-        stopCodon: string;
-        startCodon: string;
-        bases: {
-            A: import("@mui/material/styles").PaletteColor;
-            C: import("@mui/material/styles").PaletteColor;
-            G: import("@mui/material/styles").PaletteColor;
-            T: import("@mui/material/styles").PaletteColor;
-        };
-    };
-    typography: {
-        fontSize: number;
-    };
-    spacing: number;
-};
-export declare function createJBrowseTheme(theme?: any): import("@mui/material/styles").Theme;
+export declare function createJBrowseBaseTheme(palette?: PaletteOptions): ThemeOptions;
+export declare function createJBrowseTheme(theme?: ThemeOptions): import("@mui/material/styles").Theme;