@jbrowse/plugin-spreadsheet-view 2.6.1

package/esm/SpreadsheetView/components/ColumnMenu.js

@@ -0,0 +1,122 @@
+import React from 'react';
+import { observer } from 'mobx-react';
+import { iterMap } from '@jbrowse/core/util';
+import { Menu } from '@jbrowse/core/ui';
+// icons
+import CheckIcon from '@mui/icons-material/Check';
+import FilterListIcon from '@mui/icons-material/FilterList';
+import PermDataSettingIcon from '@mui/icons-material/PermDataSetting';
+import SortIcon from '@mui/icons-material/Sort';
+const ColumnMenu = observer(function ({ viewModel, spreadsheetModel, currentColumnMenu, setColumnMenu, }) {
+    const columnMenuClose = () => setColumnMenu(undefined);
+    const columnNumber = (currentColumnMenu === null || currentColumnMenu === void 0 ? void 0 : currentColumnMenu.colNumber) || 0;
+    const sortMenuClick = (descending) => {
+        spreadsheetModel.setSortColumns([
+            {
+                columnNumber,
+                descending,
+            },
+        ]);
+    };
+    const { dataTypeChoices } = spreadsheetModel;
+    const dataTypeTopLevelMenu = new Map();
+    dataTypeChoices.forEach(dataTypeRecord => {
+        const { displayName, categoryName } = dataTypeRecord;
+        if (categoryName) {
+            let entry = dataTypeTopLevelMenu.get(categoryName);
+            if (!entry) {
+                entry = {
+                    isCategory: true,
+                    subMenuItems: [],
+                };
+                dataTypeTopLevelMenu.set(categoryName, entry);
+            }
+            entry.subMenuItems.push(dataTypeRecord);
+        }
+        else {
+            dataTypeTopLevelMenu.set(displayName, dataTypeRecord);
+        }
+    });
+    const { columns, sortColumns } = spreadsheetModel;
+    const dataType = currentColumnMenu && columns[columnNumber].dataType;
+    const dataTypeName = (dataType === null || dataType === void 0 ? void 0 : dataType.type) || '';
+    const dataTypeDisplayName = (currentColumnMenu && columns[columnNumber].dataType.displayName) || '';
+    const isSortingAscending = !!currentColumnMenu &&
+        sortColumns.some(c => c.columnNumber === currentColumnMenu.colNumber && !c.descending);
+    const isSortingDescending = !!currentColumnMenu &&
+        sortColumns.some(c => c.columnNumber === currentColumnMenu.colNumber && c.descending);
+    const menuItems = [
+        // top-level column menu
+        {
+            label: 'Sort ascending',
+            icon: SortIcon,
+            type: 'radio',
+            checked: isSortingAscending,
+            onClick: () => sortMenuClick(false),
+        },
+        {
+            label: 'Sort descending',
+            icon: SortIcon,
+            type: 'radio',
+            checked: isSortingDescending,
+            onClick: () => sortMenuClick(true),
+        },
+        {
+            label: 'No sort',
+            icon: SortIcon,
+            type: 'radio',
+            checked: !isSortingDescending && !isSortingAscending,
+            onClick: () => spreadsheetModel.setSortColumns([]),
+        },
+        // data type menu
+        {
+            label: `Type: ${dataTypeDisplayName}`,
+            icon: PermDataSettingIcon,
+            subMenu: iterMap(dataTypeTopLevelMenu.entries(), ([displayName, record]) => {
+                if ('typeName' in record && record.typeName) {
+                    const { typeName } = record;
+                    return {
+                        label: displayName || typeName,
+                        icon: dataTypeName === typeName ? CheckIcon : undefined,
+                        onClick: () => spreadsheetModel.setColumnType(columnNumber, typeName),
+                    };
+                }
+                else if ('subMenuItems' in record && record.subMenuItems) {
+                    const { subMenuItems } = record;
+                    return {
+                        label: displayName,
+                        icon: subMenuItems.some(i => i.typeName === dataTypeName)
+                            ? CheckIcon
+                            : undefined,
+                        subMenu: subMenuItems.map(({ typeName, displayName }) => ({
+                            label: displayName,
+                            icon: typeName === dataTypeName ? CheckIcon : undefined,
+                            onClick: () => spreadsheetModel.setColumnType(columnNumber, typeName),
+                        })),
+                    };
+                }
+                else {
+                    return null;
+                }
+            }).filter(Boolean),
+        },
+    ];
+    // don't display the filter item if this data type doesn't have filtering
+    // implemented
+    if (dataType === null || dataType === void 0 ? void 0 : dataType.hasFilter) {
+        menuItems.push({
+            label: 'Create filter',
+            icon: FilterListIcon,
+            onClick: () => viewModel.filterControls.addBlankColumnFilter(columnNumber),
+        });
+    }
+    return (React.createElement(Menu, { anchorEl: currentColumnMenu === null || currentColumnMenu === void 0 ? void 0 : currentColumnMenu.anchorEl, open: Boolean(currentColumnMenu), onMenuItemClick: (_event, callback) => {
+            callback();
+            columnMenuClose();
+        }, onClose: columnMenuClose, menuItems: menuItems, anchorOrigin: {
+            vertical: 'bottom',
+            horizontal: 'right',
+        } }));
+});
+export default ColumnMenu;
+//# sourceMappingURL=ColumnMenu.js.map

package/esm/SpreadsheetView/components/ColumnMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColumnMenu.js","sourceRoot":"","sources":["../../../src/SpreadsheetView/components/ColumnMenu.tsx"],"names":[],"mappings":"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"}

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

@@ -0,0 +1,12 @@
+import React from 'react';
+import { Instance } from 'mobx-state-tree';
+import SpreadsheetStateModel from '../models/Spreadsheet';
+import RowStateModel from '../models/Row';
+type SpreadsheetModel = Instance<typeof SpreadsheetStateModel>;
+type RowModel = Instance<typeof RowStateModel>;
+declare const DataRow: ({ rowModel, rowNumber, spreadsheetModel, }: {
+    rowModel: RowModel;
+    rowNumber: string;
+    spreadsheetModel: SpreadsheetModel;
+}) => React.JSX.Element;
+export default DataRow;

package/esm/SpreadsheetView/components/DataRow.js

@@ -0,0 +1,77 @@
+import React from 'react';
+import { Checkbox, IconButton, FormControlLabel } from '@mui/material';
+import { observer } from 'mobx-react';
+import { indigo } from '@mui/material/colors';
+import { makeStyles } from 'tss-react/mui';
+// icons
+import ArrowDropDown from '@mui/icons-material/ArrowDropDown';
+import CellData from './CellData';
+const useStyles = makeStyles()(theme => ({
+    rowNumCell: {
+        textAlign: 'left',
+        border: `1px solid ${theme.palette.action.disabledBackground}`,
+        position: 'relative',
+        padding: '0 2px 0 0',
+        whiteSpace: 'nowrap',
+        userSelect: 'none',
+    },
+    rowNumber: {
+        fontWeight: 'normal',
+        display: 'inline-block',
+        flex: 'none',
+        paddingRight: '20px',
+        margin: 0,
+        whiteSpace: 'nowrap',
+    },
+    rowMenuButton: {
+        padding: 0,
+        margin: 0,
+        position: 'absolute',
+        right: 0,
+        display: 'inline-block',
+        whiteSpace: 'nowrap',
+        flex: 'none',
+    },
+    rowMenuButtonIcon: {},
+    rowSelector: {
+        position: 'relative',
+        top: '-2px',
+        margin: 0,
+        padding: '0 0.2rem',
+    },
+    dataRowSelected: {
+        background: indigo[100],
+        '& th': {
+            background: indigo[100],
+        },
+    },
+}));
+const DataRow = observer(function ({ rowModel, rowNumber, spreadsheetModel, }) {
+    const { classes } = useStyles();
+    const { hideRowSelection, columnDisplayOrder } = spreadsheetModel;
+    let rowClass = '';
+    if (rowModel.isSelected) {
+        rowClass += `${classes.dataRowSelected}`;
+    }
+    function labelClick(evt) {
+        rowModel.toggleSelect();
+        evt.stopPropagation();
+        evt.preventDefault();
+    }
+    return (React.createElement("tr", { className: rowClass },
+        React.createElement("td", { className: classes.rowNumCell, onClick: labelClick },
+            hideRowSelection ? (React.createElement(FormControlLabel, { className: classes.rowNumber, control: React.createElement(Checkbox, { className: classes.rowSelector, checked: rowModel.isSelected, onClick: labelClick }), label: rowModel.id })) : null,
+            React.createElement(IconButton, { className: classes.rowMenuButton, onClick: event => {
+                    spreadsheetModel.setRowMenuPosition({
+                        anchorEl: event.currentTarget,
+                        rowNumber,
+                    });
+                    event.preventDefault();
+                    event.stopPropagation();
+                } },
+                React.createElement(ArrowDropDown, { className: classes.rowMenuButtonIcon }))),
+        columnDisplayOrder.map(colNumber => (React.createElement("td", { key: colNumber },
+            React.createElement(CellData, { cell: rowModel.cellsWithDerived[colNumber], spreadsheetModel: spreadsheetModel, columnNumber: colNumber }))))));
+});
+export default DataRow;
+//# sourceMappingURL=DataRow.js.map

package/esm/SpreadsheetView/components/DataRow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataRow.js","sourceRoot":"","sources":["../../../src/SpreadsheetView/components/DataRow.tsx"],"names":[],"mappings":"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"}

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

@@ -0,0 +1,10 @@
+import React from 'react';
+import { Instance } from 'mobx-state-tree';
+import SpreadsheetStateModel from '../models/Spreadsheet';
+type SpreadsheetModel = Instance<typeof SpreadsheetStateModel>;
+declare const DataTable: ({ model, page, rowsPerPage, }: {
+    model: SpreadsheetModel;
+    page: number;
+    rowsPerPage: number;
+}) => React.JSX.Element;
+export default DataTable;

package/esm/SpreadsheetView/components/DataTable.js

@@ -0,0 +1,38 @@
+import React from 'react';
+import { observer } from 'mobx-react';
+import { getParent } from 'mobx-state-tree';
+import { makeStyles } from 'tss-react/mui';
+import RowMenu from './RowMenu';
+import DataRow from './DataRow';
+import DataTableHeader from './DataTableHeader';
+const useStyles = makeStyles()(theme => ({
+    dataTable: {
+        borderCollapse: 'collapse',
+        '& td': {
+            border: `1px solid ${theme.palette.action.disabledBackground}`,
+            padding: '0.2rem',
+            maxWidth: '50em',
+            overflow: 'hidden',
+            textOverflow: 'ellipsis',
+        },
+    },
+    emptyMessage: {
+        captionSide: 'bottom',
+    },
+}));
+const DataTableBody = observer(function ({ rows, spreadsheetModel, page, rowsPerPage, }) {
+    return (React.createElement("tbody", null, rows.slice(rowsPerPage * page, rowsPerPage * (page + 1)).map(row => (React.createElement(DataRow, { key: row.id, rowNumber: row.id, spreadsheetModel: spreadsheetModel, rowModel: row })))));
+});
+const DataTable = observer(function ({ model, page, rowsPerPage, }) {
+    const { rowSet } = model;
+    const { classes } = useStyles();
+    const rows = rowSet.sortedFilteredRows;
+    return (React.createElement(React.Fragment, null,
+        React.createElement(RowMenu, { viewModel: getParent(model), spreadsheetModel: model }),
+        React.createElement("table", { className: classes.dataTable },
+            React.createElement(DataTableHeader, { model: model }),
+            React.createElement(DataTableBody, { rows: rows, spreadsheetModel: model, page: page, rowsPerPage: rowsPerPage }),
+            !rows.length ? (React.createElement("caption", { className: classes.emptyMessage }, rowSet.count ? 'no rows match criteria' : 'no rows present')) : null)));
+});
+export default DataTable;
+//# sourceMappingURL=DataTable.js.map

package/esm/SpreadsheetView/components/DataTable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTable.js","sourceRoot":"","sources":["../../../src/SpreadsheetView/components/DataTable.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EAAE,SAAS,EAAY,MAAM,iBAAiB,CAAA;AACrD,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAK1C,OAAO,OAAO,MAAM,WAAW,CAAA;AAC/B,OAAO,OAAO,MAAM,WAAW,CAAA;AAC/B,OAAO,eAAe,MAAM,mBAAmB,CAAA;AAK/C,MAAM,SAAS,GAAG,UAAU,EAAE,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;IACvC,SAAS,EAAE;QACT,cAAc,EAAE,UAAU;QAC1B,MAAM,EAAE;YACN,MAAM,EAAE,aAAa,KAAK,CAAC,OAAO,CAAC,MAAM,CAAC,kBAAkB,EAAE;YAC9D,OAAO,EAAE,QAAQ;YACjB,QAAQ,EAAE,MAAM;YAChB,QAAQ,EAAE,QAAQ;YAClB,YAAY,EAAE,UAAU;SACzB;KACF;IAED,YAAY,EAAE;QACZ,WAAW,EAAE,QAAQ;KACtB;CACF,CAAC,CAAC,CAAA;AAEH,MAAM,aAAa,GAAG,QAAQ,CAAC,UAAU,EACvC,IAAI,EACJ,gBAAgB,EAChB,IAAI,EACJ,WAAW,GAMZ;IACC,OAAO,CACL,mCACG,IAAI,CAAC,KAAK,CAAC,WAAW,GAAG,IAAI,EAAE,WAAW,GAAG,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,CACnE,oBAAC,OAAO,IACN,GAAG,EAAE,GAAG,CAAC,EAAE,EACX,SAAS,EAAE,GAAG,CAAC,EAAE,EACjB,gBAAgB,EAAE,gBAAgB,EAClC,QAAQ,EAAE,GAAG,GACb,CACH,CAAC,CACI,CACT,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,MAAM,SAAS,GAAG,QAAQ,CAAC,UAAU,EACnC,KAAK,EACL,IAAI,EACJ,WAAW,GAKZ;IACC,MAAM,EAAE,MAAM,EAAE,GAAG,KAAK,CAAA;IACxB,MAAM,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,CAAA;IAC/B,MAAM,IAAI,GAAG,MAAM,CAAC,kBAAkB,CAAA;IACtC,OAAO,CACL;QACE,oBAAC,OAAO,IAAC,SAAS,EAAE,SAAS,CAAC,KAAK,CAAC,EAAE,gBAAgB,EAAE,KAAK,GAAI;QACjE,+BAAO,SAAS,EAAE,OAAO,CAAC,SAAS;YACjC,oBAAC,eAAe,IAAC,KAAK,EAAE,KAAK,GAAI;YACjC,oBAAC,aAAa,IACZ,IAAI,EAAE,IAAI,EACV,gBAAgB,EAAE,KAAK,EACvB,IAAI,EAAE,IAAI,EACV,WAAW,EAAE,WAAW,GACxB;YACD,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CACd,iCAAS,SAAS,EAAE,OAAO,CAAC,YAAY,IACrC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,wBAAwB,CAAC,CAAC,CAAC,iBAAiB,CACpD,CACX,CAAC,CAAC,CAAC,IAAI,CACF,CACP,CACJ,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,eAAe,SAAS,CAAA"}

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

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

package/esm/SpreadsheetView/components/DataTableHeader.js

@@ -0,0 +1,74 @@
+import React, { useState } from 'react';
+import { IconButton, Tooltip } from '@mui/material';
+import { observer } from 'mobx-react';
+import { getParent } from 'mobx-state-tree';
+import { makeStyles } from 'tss-react/mui';
+// icons
+import CropFreeIcon from '@mui/icons-material/CropFree';
+import ArrowDropDown from '@mui/icons-material/ArrowDropDown';
+import ColumnMenu from './ColumnMenu';
+import SortIndicator from './SortIndicator';
+import { numToColName } from './util';
+const useStyles = makeStyles()(theme => ({
+    columnHead: {
+        fontWeight: 'normal',
+        background: theme.palette.mode === 'dark' ? '#333' : '#eee',
+        position: 'sticky',
+        top: 0,
+        zIndex: 2,
+        whiteSpace: 'nowrap',
+    },
+    columnButtonContainer: {
+        display: 'none',
+        position: 'absolute',
+        right: 0,
+        top: 0,
+        background: theme.palette.background.paper,
+        height: '100%',
+    },
+    topLeftCorner: {
+        background: theme.palette.mode === 'dark' ? '#333' : '#eee',
+        zIndex: 2,
+        position: 'sticky',
+        top: 0,
+        minWidth: theme.spacing(2),
+        textAlign: 'left',
+    },
+}));
+const DataTableHeader = observer(function ({ model, }) {
+    const { classes } = useStyles();
+    const { columnDisplayOrder, columns, hasColumnNames, rowSet } = model;
+    const [currentColumnMenu, setColumnMenu] = useState();
+    const [currentHoveredColumn, setHoveredColumn] = useState();
+    return (React.createElement(React.Fragment, null,
+        React.createElement("thead", null,
+            React.createElement("tr", null,
+                React.createElement("th", { className: classes.topLeftCorner },
+                    React.createElement(Tooltip, { title: "Unselect all", placement: "right" },
+                        React.createElement("span", null,
+                            React.createElement(IconButton, { onClick: () => model.unselectAll(), disabled: !rowSet.selectedCount },
+                                React.createElement(CropFreeIcon, null))))),
+                columnDisplayOrder.map(colNumber => {
+                    var _a;
+                    return (React.createElement("th", { className: classes.columnHead, key: colNumber, onMouseOver: () => setHoveredColumn(colNumber), onMouseOut: () => setHoveredColumn(undefined) },
+                        React.createElement(SortIndicator, { model: model, columnNumber: colNumber }),
+                        (hasColumnNames && ((_a = columns[colNumber]) === null || _a === void 0 ? void 0 : _a.name)) ||
+                            numToColName(colNumber),
+                        React.createElement("div", { className: classes.columnButtonContainer, style: {
+                                display: currentHoveredColumn === colNumber ||
+                                    (currentColumnMenu === null || currentColumnMenu === void 0 ? void 0 : currentColumnMenu.colNumber) === colNumber
+                                    ? 'block'
+                                    : 'none',
+                            } },
+                            React.createElement(IconButton, { onClick: evt => {
+                                    setColumnMenu({
+                                        colNumber,
+                                        anchorEl: evt.currentTarget,
+                                    });
+                                } },
+                                React.createElement(ArrowDropDown, null)))));
+                }))),
+        React.createElement(ColumnMenu, { viewModel: getParent(model), spreadsheetModel: model, currentColumnMenu: currentColumnMenu, setColumnMenu: setColumnMenu })));
+});
+export default DataTableHeader;
+//# sourceMappingURL=DataTableHeader.js.map

package/esm/SpreadsheetView/components/DataTableHeader.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DataTableHeader.js","sourceRoot":"","sources":["../../../src/SpreadsheetView/components/DataTableHeader.tsx"],"names":[],"mappings":"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"}

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

@@ -0,0 +1,5 @@
+import React from 'react';
+declare const GlobalFilterControls: ({ model }: {
+    model: any;
+}) => React.JSX.Element;
+export default GlobalFilterControls;

package/esm/SpreadsheetView/components/GlobalFilterControls.js

@@ -0,0 +1,36 @@
+import React, { useState, useEffect } from 'react';
+import { IconButton, InputAdornment, TextField } from '@mui/material';
+import ClearIcon from '@mui/icons-material/Clear';
+import FilterIcon from '@mui/icons-material/FilterList';
+import { observer } from 'mobx-react';
+import { makeStyles } from 'tss-react/mui';
+import { useDebounce } from '@jbrowse/core/util';
+const useStyles = makeStyles()({
+    textFilterControlEndAdornment: {
+        marginRight: '-18px',
+    },
+});
+const TextFilter = observer(function ({ textFilter, }) {
+    const { classes } = useStyles();
+    // this paragraph is silliness to debounce the text filter input
+    const [textFilterValue, setTextFilterValue] = useState(textFilter.stringToFind);
+    const debouncedTextFilter = useDebounce(textFilterValue, 500);
+    useEffect(() => {
+        textFilter.setString(debouncedTextFilter);
+    }, [debouncedTextFilter, textFilter]);
+    return (React.createElement("div", null,
+        React.createElement(TextField, { label: "text filter", value: textFilterValue, onChange: evt => setTextFilterValue(evt.target.value), variant: "outlined", InputProps: {
+                startAdornment: (React.createElement(InputAdornment, { position: "start" },
+                    React.createElement(FilterIcon, null))),
+                endAdornment: (React.createElement(InputAdornment, { className: classes.textFilterControlEndAdornment, position: "end" },
+                    React.createElement(IconButton, { "aria-label": "clear filter", onClick: () => setTextFilterValue('') },
+                        React.createElement(ClearIcon, null)))),
+            } })));
+});
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+const GlobalFilterControls = observer(({ model }) => {
+    const textFilter = model.filterControls.rowFullText;
+    return React.createElement(TextFilter, { textFilter: textFilter });
+});
+export default GlobalFilterControls;
+//# sourceMappingURL=GlobalFilterControls.js.map

package/esm/SpreadsheetView/components/GlobalFilterControls.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"GlobalFilterControls.js","sourceRoot":"","sources":["../../../src/SpreadsheetView/components/GlobalFilterControls.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAElD,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AACrE,OAAO,SAAS,MAAM,2BAA2B,CAAA;AACjD,OAAO,UAAU,MAAM,gCAAgC,CAAA;AAEvD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AACrC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAC1C,OAAO,EAAE,WAAW,EAAE,MAAM,oBAAoB,CAAA;AAEhD,MAAM,SAAS,GAAG,UAAU,EAAE,CAAC;IAC7B,6BAA6B,EAAE;QAC7B,WAAW,EAAE,OAAO;KACrB;CACF,CAAC,CAAA;AAEF,MAAM,UAAU,GAAG,QAAQ,CAAC,UAAU,EACpC,UAAU,GAGX;IACC,MAAM,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,CAAA;IAC/B,gEAAgE;IAChE,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CACpD,UAAU,CAAC,YAAY,CACxB,CAAA;IACD,MAAM,mBAAmB,GAAG,WAAW,CAAC,eAAe,EAAE,GAAG,CAAC,CAAA;IAC7D,SAAS,CAAC,GAAG,EAAE;QACb,UAAU,CAAC,SAAS,CAAC,mBAAmB,CAAC,CAAA;IAC3C,CAAC,EAAE,CAAC,mBAAmB,EAAE,UAAU,CAAC,CAAC,CAAA;IAErC,OAAO,CACL;QACE,oBAAC,SAAS,IACR,KAAK,EAAC,aAAa,EACnB,KAAK,EAAE,eAAe,EACtB,QAAQ,EAAE,GAAG,CAAC,EAAE,CAAC,kBAAkB,CAAC,GAAG,CAAC,MAAM,CAAC,KAAK,CAAC,EACrD,OAAO,EAAC,UAAU,EAClB,UAAU,EAAE;gBACV,cAAc,EAAE,CACd,oBAAC,cAAc,IAAC,QAAQ,EAAC,OAAO;oBAC9B,oBAAC,UAAU,OAAG,CACC,CAClB;gBACD,YAAY,EAAE,CACZ,oBAAC,cAAc,IACb,SAAS,EAAE,OAAO,CAAC,6BAA6B,EAChD,QAAQ,EAAC,KAAK;oBAEd,oBAAC,UAAU,kBACE,cAAc,EACzB,OAAO,EAAE,GAAG,EAAE,CAAC,kBAAkB,CAAC,EAAE,CAAC;wBAErC,oBAAC,SAAS,OAAG,CACF,CACE,CAClB;aACF,GACD,CACE,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,8DAA8D;AAC9D,MAAM,oBAAoB,GAAG,QAAQ,CAAC,CAAC,EAAE,KAAK,EAAkB,EAAE,EAAE;IAClE,MAAM,UAAU,GAAG,KAAK,CAAC,cAAc,CAAC,WAAW,CAAA;IACnD,OAAO,oBAAC,UAAU,IAAC,UAAU,EAAE,UAAU,GAAI,CAAA;AAC/C,CAAC,CAAC,CAAA;AAEF,eAAe,oBAAoB,CAAA"}

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

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

package/esm/SpreadsheetView/components/ImportWizard.js

@@ -0,0 +1,53 @@
+import React, { useState } from 'react';
+import { Button, Checkbox, FormControl, FormGroup, FormLabel, FormControlLabel, RadioGroup, Radio, } 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';
+const useStyles = makeStyles()({
+    container: {
+        margin: '0 auto',
+        maxWidth: '25em',
+        padding: 20,
+    },
+});
+const ImportWizard = observer(({ 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 rootModel = getRoot(model);
+    return (React.createElement("div", { className: classes.container },
+        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: !showRowControls || !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"))));
+});
+export default ImportWizard;
+//# sourceMappingURL=ImportWizard.js.map

package/esm/SpreadsheetView/components/ImportWizard.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ImportWizard.js","sourceRoot":"","sources":["../../../src/SpreadsheetView/components/ImportWizard.tsx"],"names":[],"mappings":"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"}

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

@@ -0,0 +1,9 @@
+import React from 'react';
+import { ImportWizardModel } from '../models/ImportWizard';
+declare const _default: ({ model, disabled, modelPropName, modelSetterName, }: {
+    model: ImportWizardModel;
+    disabled: boolean;
+    modelPropName: string;
+    modelSetterName: string;
+}) => React.JSX.Element;
+export default _default;

package/esm/SpreadsheetView/components/NumberEditor.js

@@ -0,0 +1,29 @@
+import React, { useState, useEffect } from 'react';
+import { TextField } from '@mui/material';
+import { makeStyles } from 'tss-react/mui';
+import { observer } from 'mobx-react';
+const useStyles = makeStyles()({
+    textField: {
+        width: '2rem',
+        verticalAlign: 'baseline',
+    },
+});
+export default observer(function ({ model, disabled, modelPropName, modelSetterName, }) {
+    // @ts-expect-error
+    const [val, setVal] = useState(model[modelPropName]);
+    const { classes } = useStyles();
+    useEffect(() => {
+        const num = Number.parseInt(val, 10);
+        if (!Number.isNaN(num)) {
+            if (num > 0) {
+                // @ts-expect-error
+                model[modelSetterName](num);
+            }
+            else {
+                setVal(1);
+            }
+        }
+    }, [model, modelSetterName, val]);
+    return (React.createElement(TextField, { value: val, disabled: disabled, type: "number", onChange: evt => setVal(evt.target.value), className: classes.textField }));
+});
+//# sourceMappingURL=NumberEditor.js.map

package/esm/SpreadsheetView/components/NumberEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumberEditor.js","sourceRoot":"","sources":["../../../src/SpreadsheetView/components/NumberEditor.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAClD,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAA;AACzC,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAC1C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAKrC,MAAM,SAAS,GAAG,UAAU,EAAE,CAAC;IAC7B,SAAS,EAAE;QACT,KAAK,EAAE,MAAM;QACb,aAAa,EAAE,UAAU;KAC1B;CACF,CAAC,CAAA;AAEF,eAAe,QAAQ,CAAC,UAAU,EAChC,KAAK,EACL,QAAQ,EACR,aAAa,EACb,eAAe,GAMhB;IACC,mBAAmB;IACnB,MAAM,CAAC,GAAG,EAAE,MAAM,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,aAAa,CAAC,CAAC,CAAA;IACpD,MAAM,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,CAAA;IAC/B,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,GAAG,GAAG,MAAM,CAAC,QAAQ,CAAC,GAAG,EAAE,EAAE,CAAC,CAAA;QACpC,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,GAAG,CAAC,EAAE;YACtB,IAAI,GAAG,GAAG,CAAC,EAAE;gBACX,mBAAmB;gBACnB,KAAK,CAAC,eAAe,CAAC,CAAC,GAAG,CAAC,CAAA;aAC5B;iBAAM;gBACL,MAAM,CAAC,CAAC,CAAC,CAAA;aACV;SACF;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,EAAE,GAAG,CAAC,CAAC,CAAA;IACjC,OAAO,CACL,oBAAC,SAAS,IACR,KAAK,EAAE,GAAG,EACV,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAC,QAAQ,EACb,QAAQ,EAAE,GAAG,CAAC,EAAE,CAAC,MAAM,CAAC,GAAG,CAAC,MAAM,CAAC,KAAK,CAAC,EACzC,SAAS,EAAE,OAAO,CAAC,SAAS,GAC5B,CACH,CAAA;AACH,CAAC,CAAC,CAAA"}

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

@@ -0,0 +1,8 @@
+import React from 'react';
+import { Instance } from 'mobx-state-tree';
+import SpreadsheetStateModel from '../models/Spreadsheet';
+type SpreadsheetModel = Instance<typeof SpreadsheetStateModel>;
+declare const RowCountMessage: ({ spreadsheet, }: {
+    spreadsheet: SpreadsheetModel;
+}) => React.JSX.Element | null;
+export default RowCountMessage;

package/esm/SpreadsheetView/components/RowCountMessage.js

@@ -0,0 +1,28 @@
+import React from 'react';
+import { observer } from 'mobx-react';
+const RowCountMessage = observer(function ({ spreadsheet, }) {
+    if (spreadsheet.rowSet.isLoaded) {
+        const { passingFiltersCount, count, selectedCount, selectedAndPassingFiltersCount, } = spreadsheet.rowSet;
+        let rowMessage;
+        if (passingFiltersCount !== count) {
+            rowMessage = `${spreadsheet.rowSet.passingFiltersCount} rows of ${spreadsheet.rowSet.count} total`;
+            if (selectedCount) {
+                rowMessage += `, ${selectedAndPassingFiltersCount} selected`;
+                const selectedAndNotPassingFiltersCount = selectedCount - selectedAndPassingFiltersCount;
+                if (selectedAndNotPassingFiltersCount) {
+                    rowMessage += ` (${selectedAndNotPassingFiltersCount} selected rows do not pass filters)`;
+                }
+            }
+        }
+        else {
+            rowMessage = `${spreadsheet.rowSet.count} rows`;
+            if (selectedCount) {
+                rowMessage += `, ${selectedCount} selected`;
+            }
+        }
+        return React.createElement(React.Fragment, null, rowMessage);
+    }
+    return null;
+});
+export default RowCountMessage;
+//# sourceMappingURL=RowCountMessage.js.map

package/esm/SpreadsheetView/components/RowCountMessage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RowCountMessage.js","sourceRoot":"","sources":["../../../src/SpreadsheetView/components/RowCountMessage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAQrC,MAAM,eAAe,GAAG,QAAQ,CAAC,UAAU,EACzC,WAAW,GAGZ;IACC,IAAI,WAAW,CAAC,MAAM,CAAC,QAAQ,EAAE;QAC/B,MAAM,EACJ,mBAAmB,EACnB,KAAK,EACL,aAAa,EACb,8BAA8B,GAC/B,GAAG,WAAW,CAAC,MAAM,CAAA;QAEtB,IAAI,UAAU,CAAA;QACd,IAAI,mBAAmB,KAAK,KAAK,EAAE;YACjC,UAAU,GAAG,GAAG,WAAW,CAAC,MAAM,CAAC,mBAAmB,YAAY,WAAW,CAAC,MAAM,CAAC,KAAK,QAAQ,CAAA;YAClG,IAAI,aAAa,EAAE;gBACjB,UAAU,IAAI,KAAK,8BAA8B,WAAW,CAAA;gBAC5D,MAAM,iCAAiC,GACrC,aAAa,GAAG,8BAA8B,CAAA;gBAChD,IAAI,iCAAiC,EAAE;oBACrC,UAAU,IAAI,KAAK,iCAAiC,qCAAqC,CAAA;iBAC1F;aACF;SACF;aAAM;YACL,UAAU,GAAG,GAAG,WAAW,CAAC,MAAM,CAAC,KAAK,OAAO,CAAA;YAC/C,IAAI,aAAa,EAAE;gBACjB,UAAU,IAAI,KAAK,aAAa,WAAW,CAAA;aAC5C;SACF;QACD,OAAO,0CAAG,UAAU,CAAI,CAAA;KACzB;IACD,OAAO,IAAI,CAAA;AACb,CAAC,CAAC,CAAA;AACF,eAAe,eAAe,CAAA"}

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

@@ -0,0 +1,9 @@
+import React from 'react';
+import { Instance } from 'mobx-state-tree';
+import SpreadsheetModel from '../models/Spreadsheet';
+import ViewModel from '../models/SpreadsheetView';
+declare const RowMenu: ({ viewModel, spreadsheetModel, }: {
+    viewModel: Instance<typeof ViewModel>;
+    spreadsheetModel: Instance<typeof SpreadsheetModel>;
+}) => React.JSX.Element | null;
+export default RowMenu;

package/esm/SpreadsheetView/components/RowMenu.js

@@ -0,0 +1,34 @@
+import React from 'react';
+import { observer } from 'mobx-react';
+import { Menu } from '@jbrowse/core/ui';
+const RowMenu = observer(function ({ viewModel, spreadsheetModel, }) {
+    var _a;
+    const currentRowMenu = spreadsheetModel.rowMenuPosition;
+    const { setRowMenuPosition } = spreadsheetModel;
+    const rowMenuClose = () => {
+        setRowMenuPosition(null);
+    };
+    const rowNumber = (_a = spreadsheetModel.rowMenuPosition) === null || _a === void 0 ? void 0 : _a.rowNumber;
+    if (rowNumber === undefined) {
+        return null;
+    }
+    const row = spreadsheetModel.rowSet.rows[+rowNumber - 1];
+    function handleMenuItemClick(_event, callback) {
+        callback(viewModel, spreadsheetModel, rowNumber, row);
+        rowMenuClose();
+    }
+    // got through and evaluate all the `disabled` callbacks of the menu items
+    const menuItems = viewModel.rowMenuItems.map(item => {
+        if (typeof item.disabled === 'function') {
+            const disabled = item.disabled(viewModel, spreadsheetModel, +rowNumber, row);
+            return { ...item, disabled };
+        }
+        return item;
+    });
+    return (React.createElement(Menu, { anchorEl: currentRowMenu && currentRowMenu.anchorEl, open: Boolean(currentRowMenu), onMenuItemClick: handleMenuItemClick, onClose: rowMenuClose, menuItems: menuItems, anchorOrigin: {
+            vertical: 'bottom',
+            horizontal: 'right',
+        } }));
+});
+export default RowMenu;
+//# sourceMappingURL=RowMenu.js.map