@jbrowse/plugin-grid-bookmark 2.6.2 → 2.7.0

package/dist/index.js

@@ -19,92 +19,117 @@ class default_1 extends Plugin_1.default {
         pluginManager.addToExtensionPoint('Core-extendPluggableElement', (pluggableElement) => {
             if (pluggableElement.name === 'LinearGenomeView') {
                 const { stateModel } = pluggableElement;
-                const newStateModel = stateModel.extend((self) => {
+                const lgv = stateModel;
+                const newStateModel = lgv
+                    .actions(self => ({
+                    activateBookmarkWidget() {
+                        const session = (0, util_1.getSession)(self);
+                        if ((0, util_1.isSessionModelWithWidgets)(session)) {
+                            let bookmarkWidget = session.widgets.get('GridBookmark');
+                            if (!bookmarkWidget) {
+                                bookmarkWidget = session.addWidget('GridBookmarkWidget', 'GridBookmark');
+                            }
+                            session.showWidget(bookmarkWidget);
+                            return session.widgets.get('GridBookmark');
+                        }
+                        throw new Error('Could not open bookmark widget');
+                    },
+                }))
+                    .actions(self => ({
+                    navigateNewestBookmark() {
+                        const session = (0, util_1.getSession)(self);
+                        const bookmarkWidget = self.activateBookmarkWidget();
+                        const regions = bookmarkWidget.bookmarks;
+                        if (regions === null || regions === void 0 ? void 0 : regions.length) {
+                            self.navTo(regions.at(-1));
+                        }
+                        else {
+                            session.notify('There are no recent bookmarks to navigate to.', 'info');
+                        }
+                    },
+                    bookmarkCurrentRegion() {
+                        if (self.id === (0, util_1.getSession)(self).focusedViewId) {
+                            const selectedRegions = self.getSelectedRegions(undefined, undefined);
+                            const bookmarkWidget = self.activateBookmarkWidget();
+                            bookmarkWidget.addBookmark(selectedRegions[0]);
+                        }
+                    },
+                }))
+                    .views(self => {
                     const superMenuItems = self.menuItems;
                     const superRubberBandMenuItems = self.rubberBandMenuItems;
                     return {
-                        actions: {
-                            activateBookmarkWidget() {
-                                const session = (0, util_1.getSession)(self);
-                                if ((0, util_1.isSessionModelWithWidgets)(session)) {
-                                    let bookmarkWidget = session.widgets.get('GridBookmark');
-                                    if (!bookmarkWidget) {
-                                        bookmarkWidget = session.addWidget('GridBookmarkWidget', 'GridBookmark', { view: self });
-                                    }
-                                    session.showWidget(bookmarkWidget);
-                                    return bookmarkWidget;
-                                }
-                                throw new Error('Could not open bookmark widget');
-                            },
-                            bookmarkCurrentRegion() {
-                                const selectedRegions = self.getSelectedRegions(self.leftOffset, self.rightOffset);
-                                const firstRegion = selectedRegions[0];
-                                const session = (0, util_1.getSession)(self);
-                                if ((0, util_1.isSessionModelWithWidgets)(session)) {
-                                    const { widgets } = session;
-                                    let bookmarkWidget = widgets.get('GridBookmark');
-                                    if (!bookmarkWidget) {
-                                        this.activateBookmarkWidget();
-                                        bookmarkWidget = widgets.get('GridBookmark');
-                                    }
-                                    // @ts-expect-error
-                                    bookmarkWidget.addBookmark(firstRegion);
-                                }
-                            },
+                        menuItems() {
+                            return [
+                                ...superMenuItems(),
+                                { type: 'divider' },
+                                {
+                                    label: 'Open bookmark widget',
+                                    icon: Bookmarks_1.default,
+                                    onClick: () => self.activateBookmarkWidget(),
+                                },
+                                {
+                                    label: 'Bookmark current region',
+                                    icon: Bookmark_1.default,
+                                    onClick: () => self.bookmarkCurrentRegion(),
+                                },
+                            ];
                         },
-                        views: {
-                            menuItems() {
-                                return [
-                                    ...superMenuItems(),
-                                    { type: 'divider' },
-                                    {
-                                        label: 'Open bookmark widget',
-                                        icon: Bookmarks_1.default,
-                                        // @ts-expect-error
-                                        onClick: self.activateBookmarkWidget,
+                        rubberBandMenuItems() {
+                            return [
+                                ...superRubberBandMenuItems(),
+                                {
+                                    label: 'Bookmark region',
+                                    icon: Bookmark_1.default,
+                                    onClick: () => {
+                                        const { leftOffset, rightOffset } = self;
+                                        const selectedRegions = self.getSelectedRegions(leftOffset, rightOffset);
+                                        const bookmarkWidget = self.activateBookmarkWidget();
+                                        bookmarkWidget.addBookmark(selectedRegions[0]);
                                     },
-                                    {
-                                        label: 'Bookmark current region',
-                                        icon: Bookmark_1.default,
-                                        // @ts-expect-error
-                                        onClick: self.bookmarkCurrentRegion,
-                                    },
-                                ];
-                            },
-                            rubberBandMenuItems() {
-                                return [
-                                    ...superRubberBandMenuItems(),
-                                    {
-                                        label: 'Bookmark region',
-                                        icon: Bookmark_1.default,
-                                        onClick: () => {
-                                            const { leftOffset, rightOffset } = self;
-                                            const selectedRegions = self.getSelectedRegions(leftOffset, rightOffset);
-                                            const firstRegion = selectedRegions[0];
-                                            const session = (0, util_1.getSession)(self);
-                                            if ((0, util_1.isSessionModelWithWidgets)(session)) {
-                                                const { widgets } = session;
-                                                let bookmarkWidget = widgets.get('GridBookmark');
-                                                if (!bookmarkWidget) {
-                                                    // @ts-expect-error
-                                                    self.activateBookmarkWidget();
-                                                    bookmarkWidget = widgets.get('GridBookmark');
-                                                }
-                                                // @ts-expect-error
-                                                bookmarkWidget.addBookmark(firstRegion);
-                                            }
-                                        },
-                                    },
-                                ];
-                            },
+                                },
+                            ];
                         },
                     };
-                });
+                })
+                    .actions(self => ({
+                    afterCreate() {
+                        document.addEventListener('keydown', e => {
+                            const activationSequence = (e.ctrlKey || e.metaKey) && e.shiftKey;
+                            // ctrl+shift+d or cmd+shift+d
+                            if (activationSequence && e.code === 'KeyD') {
+                                e.preventDefault();
+                                self.activateBookmarkWidget();
+                                self.bookmarkCurrentRegion();
+                                (0, util_1.getSession)(self).notify('Bookmark created.', 'success');
+                            }
+                            // ctrl+shift+m or cmd+shift+m
+                            if (activationSequence && e.code === 'KeyM') {
+                                e.preventDefault();
+                                self.navigateNewestBookmark();
+                            }
+                        });
+                    },
+                }));
                 pluggableElement.stateModel = newStateModel;
             }
             return pluggableElement;
         });
     }
-    configure(_pluginManager) { }
+    configure(pluginManager) {
+        if ((0, util_1.isAbstractMenuManager)(pluginManager.rootModel)) {
+            pluginManager.rootModel.appendToMenu('Tools', {
+                label: 'Bookmarks',
+                icon: Bookmarks_1.default,
+                onClick: (session) => {
+                    let bookmarkWidget = session.widgets.get('GridBookmark');
+                    if (!bookmarkWidget) {
+                        bookmarkWidget = session.addWidget('GridBookmarkWidget', 'GridBookmark');
+                    }
+                    session.showWidget(bookmarkWidget);
+                },
+            });
+        }
+    }
 }
 exports.default = default_1;

package/esm/GridBookmarkWidget/components/AssemblySelector.d.ts

@@ -1,7 +1,6 @@
 import React from 'react';
 import { GridBookmarkModel } from '../model';
-declare function AssemblySelector({ model }: {
+declare const AssemblySelector: ({ model, }: {
     model: GridBookmarkModel;
-}): React.JSX.Element;
-declare const _default: typeof AssemblySelector;
-export default _default;
+}) => React.JSX.Element;
+export default AssemblySelector;

package/esm/GridBookmarkWidget/components/AssemblySelector.js

@@ -1,40 +1,30 @@
 import React from 'react';
 import { observer } from 'mobx-react';
-import { Typography, Select, MenuItem, FormControl } from '@mui/material';
-import { makeStyles } from 'tss-react/mui';
-const useStyles = makeStyles()(() => ({
-    container: {
-        display: 'flex',
-        flexDirection: 'row',
-        margin: 5,
-    },
-    selectText: {
-        marginRight: 8,
-        marginTop: 10,
-    },
-    flexItem: {
-        marginRight: 8,
-    },
-}));
-function AssemblySelector({ model }) {
-    const { classes } = useStyles();
-    const { assemblies, selectedAssembly, setSelectedAssembly } = model;
-    const noAssemblies = assemblies.length === 0 ? true : false;
-    const determineCurrentValue = (selectedAssembly) => {
-        if (selectedAssembly === 'all') {
-            return 'all';
-        }
-        else if (assemblies.includes(selectedAssembly)) {
-            return selectedAssembly;
-        }
-        return 'none';
-    };
-    return (React.createElement("div", { className: classes.container },
-        React.createElement(Typography, { className: classes.selectText }, "Select assembly:"),
-        React.createElement(FormControl, { className: classes.flexItem, disabled: noAssemblies },
-            React.createElement(Select, { value: determineCurrentValue(selectedAssembly), onChange: event => setSelectedAssembly(event.target.value) },
-                React.createElement(MenuItem, { value: "none" }, "none"),
-                React.createElement(MenuItem, { value: "all" }, "all"),
-                assemblies.map(assembly => (React.createElement(MenuItem, { value: assembly, key: assembly }, assembly)))))));
-}
-export default observer(AssemblySelector);
+import { Checkbox, FormControl, InputLabel, ListItemText, MenuItem, OutlinedInput, Select, } from '@mui/material';
+const AssemblySelector = observer(function ({ model, }) {
+    const { validAssemblies, selectedAssemblies } = model;
+    const noAssemblies = validAssemblies.size === 0 ? true : false;
+    const label = 'Select assemblies';
+    const id = 'select-assemblies-label';
+    const selectedSet = new Set(selectedAssemblies);
+    const isAllSelected = [...validAssemblies].every(e => selectedSet.has(e));
+    return (React.createElement(FormControl, { disabled: noAssemblies, fullWidth: true },
+        React.createElement(InputLabel, { id: id }, label),
+        React.createElement(Select, { labelId: id, multiple: true, value: selectedAssemblies, onChange: event => model.setSelectedAssemblies([...event.target.value]), input: React.createElement(OutlinedInput, { label: label }), renderValue: selected => selected.join(', ') },
+            React.createElement(MenuItem, { onClickCapture: event => {
+                    // onClickCapture allows us to avoid the parent Select onChange from triggering
+                    if (isAllSelected) {
+                        model.setSelectedAssemblies([]);
+                    }
+                    else {
+                        model.setSelectedAssemblies(undefined);
+                    }
+                    event.preventDefault();
+                } },
+                React.createElement(Checkbox, { checked: isAllSelected, indeterminate: !isAllSelected && selectedAssemblies.length > 0 }),
+                React.createElement(ListItemText, { primary: "Select all" })),
+            [...validAssemblies].map(name => (React.createElement(MenuItem, { key: name, value: name },
+                React.createElement(Checkbox, { checked: selectedAssemblies.includes(name) }),
+                React.createElement(ListItemText, { primary: name })))))));
+});
+export default AssemblySelector;

package/esm/GridBookmarkWidget/components/BookmarkGrid.d.ts

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

package/esm/GridBookmarkWidget/components/BookmarkGrid.js

@@ -0,0 +1,92 @@
+import React, { Suspense, lazy, useState } from 'react';
+import { observer } from 'mobx-react';
+import { Link } from '@mui/material';
+import { makeStyles } from 'tss-react/mui';
+import { DataGrid, GRID_CHECKBOX_SELECTION_COL_DEF } from '@mui/x-data-grid';
+import { getSession, assembleLocString, measureGridWidth, measureText, } from '@jbrowse/core/util';
+// locals
+import { navToBookmark } from '../utils';
+import { useResizeBar } from '@jbrowse/core/ui/useResizeBar';
+import ResizeBar from '@jbrowse/core/ui/ResizeBar';
+const EditBookmarkLabelDialog = lazy(() => import('./EditBookmarkLabelDialog'));
+const useStyles = makeStyles()(() => ({
+    link: {
+        cursor: 'pointer',
+    },
+    cell: {
+        whiteSpace: 'nowrap',
+        overflow: 'hidden',
+        textOverflow: 'ellipsis',
+    },
+}));
+const BookmarkGrid = observer(function ({ model, }) {
+    const { classes, cx } = useStyles();
+    const [dialogRow, setDialogRow] = useState();
+    const { ref, scrollLeft } = useResizeBar();
+    const { bookmarks, bookmarksWithValidAssemblies, selectedAssemblies, selectedBookmarks, } = model;
+    const session = getSession(model);
+    const selectedSet = new Set(selectedAssemblies);
+    const rows = bookmarks
+        .filter(r => selectedSet.has(r.assemblyName))
+        .map((region, index) => {
+        const { assemblyName, ...rest } = region;
+        return {
+            ...region,
+            id: index,
+            assemblyName,
+            locString: assembleLocString(rest),
+            correspondingObj: region,
+        };
+    });
+    // reset selections if bookmarked regions change
+    // needed especially if bookmarked regions are deleted, then
+    const [widths, setWidths] = useState([
+        40,
+        Math.max(measureText('Bookmark link'), measureGridWidth(rows.map(row => row.locString))),
+        Math.max(measureText('Label'), measureGridWidth(rows.map(row => row.label))),
+        Math.max(measureText('Assembly'), measureGridWidth(rows.map(row => row.assemblyName))),
+    ]);
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", { ref: ref },
+            React.createElement(ResizeBar, { widths: widths, setWidths: setWidths, scrollLeft: scrollLeft }),
+            React.createElement(DataGrid, { autoHeight: true, density: "compact", rows: rows, columns: [
+                    {
+                        ...GRID_CHECKBOX_SELECTION_COL_DEF,
+                        width: widths[0],
+                    },
+                    {
+                        field: 'locString',
+                        headerName: 'Bookmark link',
+                        width: widths[1],
+                        renderCell: ({ value, row }) => (React.createElement(Link, { className: cx(classes.link, classes.cell), href: "#", onClick: async (event) => {
+                                event.preventDefault();
+                                const { views } = session;
+                                await navToBookmark(value, row.assemblyName, views, model);
+                            } }, value)),
+                    },
+                    {
+                        field: 'label',
+                        headerName: 'Label',
+                        width: widths[2],
+                        editable: true,
+                    },
+                    {
+                        field: 'assemblyName',
+                        headerName: 'Assembly',
+                        width: widths[3],
+                    },
+                ], onCellDoubleClick: ({ row }) => setDialogRow(row), processRowUpdate: row => {
+                    const target = rows[row.id];
+                    model.updateBookmarkLabel(target, row.label);
+                    return row;
+                }, onProcessRowUpdateError: e => session.notify(e.message, 'error'), checkboxSelection: true, onRowSelectionModelChange: newRowSelectionModel => {
+                    if (bookmarksWithValidAssemblies.length > 0) {
+                        model.setSelectedBookmarks(newRowSelectionModel.map(value => ({
+                            ...rows[value],
+                        })));
+                    }
+                }, rowSelectionModel: selectedBookmarks.map(r => r.id), disableRowSelectionOnClick: true })),
+        dialogRow ? (React.createElement(Suspense, { fallback: React.createElement(React.Fragment, null) },
+            React.createElement(EditBookmarkLabelDialog, { onClose: () => setDialogRow(undefined), model: model, dialogRow: dialogRow }))) : null));
+});
+export default BookmarkGrid;

package/{dist/GridBookmarkWidget/components/DownloadBookmarks.d.ts → esm/GridBookmarkWidget/components/DeleteBookmarks.d.ts}

@@ -1,7 +1,6 @@
 import React from 'react';
 import { GridBookmarkModel } from '../model';
-declare function DownloadBookmarks({ model }: {
+declare function DeleteBookmarks({ model }: {
     model: GridBookmarkModel;
 }): React.JSX.Element;
-declare const _default: typeof DownloadBookmarks;
-export default _default;
+export default DeleteBookmarks;

package/esm/GridBookmarkWidget/components/DeleteBookmarks.js

@@ -0,0 +1,13 @@
+import React, { Suspense, lazy, useState } from 'react';
+import { Button } from '@mui/material';
+// icons
+import DeleteIcon from '@mui/icons-material/Delete';
+const DeleteBookmarksDialog = lazy(() => import('./DeleteBookmarksDialog'));
+function DeleteBookmarks({ model }) {
+    const [open, setOpen] = useState(false);
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Button, { startIcon: React.createElement(DeleteIcon, null), "aria-label": "clear bookmarks", onClick: () => setOpen(true) }, "Delete"),
+        open ? (React.createElement(Suspense, { fallback: React.createElement(React.Fragment, null) },
+            React.createElement(DeleteBookmarksDialog, { model: model, onClose: () => setOpen(false) }))) : null));
+}
+export default DeleteBookmarks;

package/esm/GridBookmarkWidget/components/DeleteBookmarksDialog.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { GridBookmarkModel } from '../model';
+declare const DeleteBookmarksDialog: ({ onClose, model, }: {
+    onClose: () => void;
+    model: GridBookmarkModel;
+}) => React.JSX.Element;
+export default DeleteBookmarksDialog;

package/esm/GridBookmarkWidget/components/DeleteBookmarksDialog.js

@@ -0,0 +1,24 @@
+import React from 'react';
+import { observer } from 'mobx-react';
+import { Button, DialogContent, DialogActions, Alert } from '@mui/material';
+import { Dialog } from '@jbrowse/core/ui';
+const DeleteBookmarksDialog = observer(function ({ onClose, model, }) {
+    const { selectedBookmarks } = model;
+    const deleteAll = selectedBookmarks.length === 0;
+    return (React.createElement(Dialog, { open: true, onClose: onClose, title: "Delete bookmarks" },
+        React.createElement(DialogContent, null,
+            React.createElement(Alert, { severity: "warning" }, deleteAll ? (React.createElement(React.Fragment, null,
+                React.createElement("span", null, "All bookmarks will be deleted."),
+                React.createElement("br", null),
+                React.createElement("span", null, "Use the checkboxes to select individual bookmarks to delete."))) : ('Only selected bookmarks will be deleted.'))),
+        React.createElement(DialogActions, null,
+            React.createElement(Button, { variant: "contained", color: "secondary", onClick: () => onClose() }, "Cancel"),
+            React.createElement(Button, { variant: "contained", color: "primary", onClick: () => {
+                    if (deleteAll) {
+                        model.clearAllBookmarks();
+                    }
+                    model.clearSelectedBookmarks();
+                    onClose();
+                } }, "Confirm"))));
+});
+export default DeleteBookmarksDialog;

package/esm/GridBookmarkWidget/components/EditBookmarkLabelDialog.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+import { GridBookmarkModel, IExtendedLabeledRegionModel } from '../model';
+declare const EditBookmarkLabelDialog: ({ model, onClose, dialogRow, }: {
+    model: GridBookmarkModel;
+    dialogRow: IExtendedLabeledRegionModel;
+    onClose: () => void;
+}) => React.JSX.Element;
+export default EditBookmarkLabelDialog;

package/esm/GridBookmarkWidget/components/EditBookmarkLabelDialog.js

@@ -0,0 +1,25 @@
+import React, { useState } from 'react';
+import { Alert, DialogContent, DialogActions, Button, TextField, } from '@mui/material';
+import { Dialog } from '@jbrowse/core/ui';
+import { observer } from 'mobx-react';
+import { assembleLocString } from '@jbrowse/core/util';
+const EditBookmarkLabelDialog = observer(function ({ model, onClose, dialogRow, }) {
+    const [newLabel, setNewLabel] = useState(dialogRow.label || '');
+    return (React.createElement(Dialog, { open: true, onClose: onClose, title: "Edit bookmark label" },
+        React.createElement(DialogContent, null,
+            React.createElement(Alert, null,
+                "Editing label for bookmark",
+                ' ',
+                React.createElement("strong", null, assembleLocString(dialogRow.correspondingObj)),
+                ":"),
+            React.createElement(TextField, { fullWidth: true, inputProps: { 'data-testid': 'edit-bookmark-label-field' }, variant: "outlined", value: newLabel, onChange: e => setNewLabel(e.target.value), autoFocus: true })),
+        React.createElement(DialogActions, null,
+            React.createElement(Button, { variant: "contained", color: "primary", onClick: () => {
+                    if (newLabel && dialogRow) {
+                        model.updateBookmarkLabel(dialogRow, newLabel);
+                    }
+                    setNewLabel('');
+                    onClose();
+                } }, "Confirm"))));
+});
+export default EditBookmarkLabelDialog;

package/esm/GridBookmarkWidget/components/ExportBookmarks.d.ts

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

package/esm/GridBookmarkWidget/components/ExportBookmarks.js

@@ -0,0 +1,13 @@
+import React, { Suspense, lazy, useState } from 'react';
+import { observer } from 'mobx-react';
+import { Button } from '@mui/material';
+import GetAppIcon from '@mui/icons-material/GetApp';
+const ExportBookmarksDialog = lazy(() => import('./ExportBookmarksDialog'));
+const ExportBookmarks = observer(function ExportBookmarks({ model, }) {
+    const [open, setOpen] = useState(false);
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Button, { startIcon: React.createElement(GetAppIcon, null), onClick: () => setOpen(true), "data-testid": "export_button" }, "Export"),
+        open ? (React.createElement(Suspense, { fallback: React.createElement(React.Fragment, null) },
+            React.createElement(ExportBookmarksDialog, { onClose: () => setOpen(false), model: model }))) : null));
+});
+export default ExportBookmarks;

package/esm/GridBookmarkWidget/components/ExportBookmarksDialog.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { GridBookmarkModel } from '../model';
+declare const ExportBookmarksDialog: ({ model, onClose, }: {
+    model: GridBookmarkModel;
+    onClose: (arg: boolean) => void;
+}) => React.JSX.Element;
+export default ExportBookmarksDialog;

package/esm/GridBookmarkWidget/components/ExportBookmarksDialog.js

@@ -0,0 +1,35 @@
+import React, { useState } from 'react';
+import { observer } from 'mobx-react';
+import { Button, DialogContent, DialogActions, MenuItem, Select, Typography, Alert, } from '@mui/material';
+import GetAppIcon from '@mui/icons-material/GetApp';
+import { makeStyles } from 'tss-react/mui';
+import { Dialog } from '@jbrowse/core/ui';
+import { downloadBookmarkFile } from '../utils';
+const useStyles = makeStyles()(() => ({
+    flexItem: {
+        margin: 5,
+    },
+}));
+const ExportBookmarksDialog = observer(function ExportBookmarksDialog({ model, onClose, }) {
+    const { classes } = useStyles();
+    const [fileType, setFileType] = useState('BED');
+    const { selectedBookmarks } = model;
+    const exportAll = selectedBookmarks.length === 0;
+    return (React.createElement(Dialog, { open: true, onClose: onClose, title: "Export bookmarks" },
+        React.createElement(DialogContent, { style: { display: 'flex', flexFlow: 'column', gap: '5px' } },
+            React.createElement(Alert, { severity: "info" }, exportAll ? (React.createElement(React.Fragment, null,
+                React.createElement("span", null, "All bookmarks will be exported."),
+                React.createElement("br", null),
+                React.createElement("span", null, "Use the checkboxes to select individual bookmarks to export."))) : ('Only selected bookmarks will be exported.')),
+            React.createElement("div", { style: { display: 'flex', alignItems: 'center' } },
+                React.createElement(Typography, null, "Format to download:"),
+                React.createElement(Select, { size: "small", className: classes.flexItem, "data-testid": "selectFileType", value: fileType, onChange: event => setFileType(event.target.value) },
+                    React.createElement(MenuItem, { value: "BED" }, "BED"),
+                    React.createElement(MenuItem, { value: "TSV" }, "TSV")))),
+        React.createElement(DialogActions, null,
+            React.createElement(Button, { className: classes.flexItem, "data-testid": "dialogDownload", variant: "contained", color: "primary", startIcon: React.createElement(GetAppIcon, null), onClick: () => {
+                    downloadBookmarkFile(fileType, model);
+                    onClose(false);
+                } }, "Download"))));
+});
+export default ExportBookmarksDialog;

package/esm/GridBookmarkWidget/components/GridBookmarkWidget.d.ts

@@ -1,7 +1,6 @@
 import React from 'react';
 import { GridBookmarkModel } from '../model';
-declare function GridBookmarkWidget({ model }: {
+declare const GridBookmarkWidget: ({ model, }: {
     model: GridBookmarkModel;
-}): React.JSX.Element;
-declare const _default: typeof GridBookmarkWidget;
-export default _default;
+}) => React.JSX.Element | null;
+export default GridBookmarkWidget;