@jbrowse/plugin-spreadsheet-view 2.6.1

package/dist/SpreadsheetView/components/DataTable.js

@@ -0,0 +1,43 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const mobx_react_1 = require("mobx-react");
+const mobx_state_tree_1 = require("mobx-state-tree");
+const mui_1 = require("tss-react/mui");
+const RowMenu_1 = __importDefault(require("./RowMenu"));
+const DataRow_1 = __importDefault(require("./DataRow"));
+const DataTableHeader_1 = __importDefault(require("./DataTableHeader"));
+const useStyles = (0, mui_1.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 = (0, mobx_react_1.observer)(function ({ rows, spreadsheetModel, page, rowsPerPage, }) {
+    return (react_1.default.createElement("tbody", null, rows.slice(rowsPerPage * page, rowsPerPage * (page + 1)).map(row => (react_1.default.createElement(DataRow_1.default, { key: row.id, rowNumber: row.id, spreadsheetModel: spreadsheetModel, rowModel: row })))));
+});
+const DataTable = (0, mobx_react_1.observer)(function ({ model, page, rowsPerPage, }) {
+    const { rowSet } = model;
+    const { classes } = useStyles();
+    const rows = rowSet.sortedFilteredRows;
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement(RowMenu_1.default, { viewModel: (0, mobx_state_tree_1.getParent)(model), spreadsheetModel: model }),
+        react_1.default.createElement("table", { className: classes.dataTable },
+            react_1.default.createElement(DataTableHeader_1.default, { model: model }),
+            react_1.default.createElement(DataTableBody, { rows: rows, spreadsheetModel: model, page: page, rowsPerPage: rowsPerPage }),
+            !rows.length ? (react_1.default.createElement("caption", { className: classes.emptyMessage }, rowSet.count ? 'no rows match criteria' : 'no rows present')) : null)));
+});
+exports.default = DataTable;
+//# sourceMappingURL=DataTable.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"DataTable.js","sourceRoot":"","sources":["../../../src/SpreadsheetView/components/DataTable.tsx"],"names":[],"mappings":";;;;;AAAA,kDAAyB;AACzB,2CAAqC;AACrC,qDAAqD;AACrD,uCAA0C;AAK1C,wDAA+B;AAC/B,wDAA+B;AAC/B,wEAA+C;AAK/C,MAAM,SAAS,GAAG,IAAA,gBAAU,GAAE,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,IAAA,qBAAQ,EAAC,UAAU,EACvC,IAAI,EACJ,gBAAgB,EAChB,IAAI,EACJ,WAAW,GAMZ;IACC,OAAO,CACL,6CACG,IAAI,CAAC,KAAK,CAAC,WAAW,GAAG,IAAI,EAAE,WAAW,GAAG,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,CACnE,8BAAC,iBAAO,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,IAAA,qBAAQ,EAAC,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,8BAAC,iBAAO,IAAC,SAAS,EAAE,IAAA,2BAAS,EAAC,KAAK,CAAC,EAAE,gBAAgB,EAAE,KAAK,GAAI;QACjE,yCAAO,SAAS,EAAE,OAAO,CAAC,SAAS;YACjC,8BAAC,yBAAe,IAAC,KAAK,EAAE,KAAK,GAAI;YACjC,8BAAC,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,2CAAS,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,kBAAe,SAAS,CAAA"}

package/dist/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/dist/SpreadsheetView/components/DataTableHeader.js

@@ -0,0 +1,102 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importStar(require("react"));
+const material_1 = require("@mui/material");
+const mobx_react_1 = require("mobx-react");
+const mobx_state_tree_1 = require("mobx-state-tree");
+const mui_1 = require("tss-react/mui");
+// icons
+const CropFree_1 = __importDefault(require("@mui/icons-material/CropFree"));
+const ArrowDropDown_1 = __importDefault(require("@mui/icons-material/ArrowDropDown"));
+const ColumnMenu_1 = __importDefault(require("./ColumnMenu"));
+const SortIndicator_1 = __importDefault(require("./SortIndicator"));
+const util_1 = require("./util");
+const useStyles = (0, mui_1.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 = (0, mobx_react_1.observer)(function ({ model, }) {
+    const { classes } = useStyles();
+    const { columnDisplayOrder, columns, hasColumnNames, rowSet } = model;
+    const [currentColumnMenu, setColumnMenu] = (0, react_1.useState)();
+    const [currentHoveredColumn, setHoveredColumn] = (0, react_1.useState)();
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement("thead", null,
+            react_1.default.createElement("tr", null,
+                react_1.default.createElement("th", { className: classes.topLeftCorner },
+                    react_1.default.createElement(material_1.Tooltip, { title: "Unselect all", placement: "right" },
+                        react_1.default.createElement("span", null,
+                            react_1.default.createElement(material_1.IconButton, { onClick: () => model.unselectAll(), disabled: !rowSet.selectedCount },
+                                react_1.default.createElement(CropFree_1.default, null))))),
+                columnDisplayOrder.map(colNumber => {
+                    var _a;
+                    return (react_1.default.createElement("th", { className: classes.columnHead, key: colNumber, onMouseOver: () => setHoveredColumn(colNumber), onMouseOut: () => setHoveredColumn(undefined) },
+                        react_1.default.createElement(SortIndicator_1.default, { model: model, columnNumber: colNumber }),
+                        (hasColumnNames && ((_a = columns[colNumber]) === null || _a === void 0 ? void 0 : _a.name)) ||
+                            (0, util_1.numToColName)(colNumber),
+                        react_1.default.createElement("div", { className: classes.columnButtonContainer, style: {
+                                display: currentHoveredColumn === colNumber ||
+                                    (currentColumnMenu === null || currentColumnMenu === void 0 ? void 0 : currentColumnMenu.colNumber) === colNumber
+                                    ? 'block'
+                                    : 'none',
+                            } },
+                            react_1.default.createElement(material_1.IconButton, { onClick: evt => {
+                                    setColumnMenu({
+                                        colNumber,
+                                        anchorEl: evt.currentTarget,
+                                    });
+                                } },
+                                react_1.default.createElement(ArrowDropDown_1.default, null)))));
+                }))),
+        react_1.default.createElement(ColumnMenu_1.default, { viewModel: (0, mobx_state_tree_1.getParent)(model), spreadsheetModel: model, currentColumnMenu: currentColumnMenu, setColumnMenu: setColumnMenu })));
+});
+exports.default = DataTableHeader;
+//# sourceMappingURL=DataTableHeader.js.map

package/dist/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/dist/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/dist/SpreadsheetView/components/GlobalFilterControls.js

@@ -0,0 +1,64 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importStar(require("react"));
+const material_1 = require("@mui/material");
+const Clear_1 = __importDefault(require("@mui/icons-material/Clear"));
+const FilterList_1 = __importDefault(require("@mui/icons-material/FilterList"));
+const mobx_react_1 = require("mobx-react");
+const mui_1 = require("tss-react/mui");
+const util_1 = require("@jbrowse/core/util");
+const useStyles = (0, mui_1.makeStyles)()({
+    textFilterControlEndAdornment: {
+        marginRight: '-18px',
+    },
+});
+const TextFilter = (0, mobx_react_1.observer)(function ({ textFilter, }) {
+    const { classes } = useStyles();
+    // this paragraph is silliness to debounce the text filter input
+    const [textFilterValue, setTextFilterValue] = (0, react_1.useState)(textFilter.stringToFind);
+    const debouncedTextFilter = (0, util_1.useDebounce)(textFilterValue, 500);
+    (0, react_1.useEffect)(() => {
+        textFilter.setString(debouncedTextFilter);
+    }, [debouncedTextFilter, textFilter]);
+    return (react_1.default.createElement("div", null,
+        react_1.default.createElement(material_1.TextField, { label: "text filter", value: textFilterValue, onChange: evt => setTextFilterValue(evt.target.value), variant: "outlined", InputProps: {
+                startAdornment: (react_1.default.createElement(material_1.InputAdornment, { position: "start" },
+                    react_1.default.createElement(FilterList_1.default, null))),
+                endAdornment: (react_1.default.createElement(material_1.InputAdornment, { className: classes.textFilterControlEndAdornment, position: "end" },
+                    react_1.default.createElement(material_1.IconButton, { "aria-label": "clear filter", onClick: () => setTextFilterValue('') },
+                        react_1.default.createElement(Clear_1.default, null)))),
+            } })));
+});
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+const GlobalFilterControls = (0, mobx_react_1.observer)(({ model }) => {
+    const textFilter = model.filterControls.rowFullText;
+    return react_1.default.createElement(TextFilter, { textFilter: textFilter });
+});
+exports.default = GlobalFilterControls;
+//# sourceMappingURL=GlobalFilterControls.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"GlobalFilterControls.js","sourceRoot":"","sources":["../../../src/SpreadsheetView/components/GlobalFilterControls.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAkD;AAElD,4CAAqE;AACrE,sEAAiD;AACjD,gFAAuD;AAEvD,2CAAqC;AACrC,uCAA0C;AAC1C,6CAAgD;AAEhD,MAAM,SAAS,GAAG,IAAA,gBAAU,GAAE,CAAC;IAC7B,6BAA6B,EAAE;QAC7B,WAAW,EAAE,OAAO;KACrB;CACF,CAAC,CAAA;AAEF,MAAM,UAAU,GAAG,IAAA,qBAAQ,EAAC,UAAU,EACpC,UAAU,GAGX;IACC,MAAM,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,CAAA;IAC/B,gEAAgE;IAChE,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,IAAA,gBAAQ,EACpD,UAAU,CAAC,YAAY,CACxB,CAAA;IACD,MAAM,mBAAmB,GAAG,IAAA,kBAAW,EAAC,eAAe,EAAE,GAAG,CAAC,CAAA;IAC7D,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,UAAU,CAAC,SAAS,CAAC,mBAAmB,CAAC,CAAA;IAC3C,CAAC,EAAE,CAAC,mBAAmB,EAAE,UAAU,CAAC,CAAC,CAAA;IAErC,OAAO,CACL;QACE,8BAAC,oBAAS,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,8BAAC,yBAAc,IAAC,QAAQ,EAAC,OAAO;oBAC9B,8BAAC,oBAAU,OAAG,CACC,CAClB;gBACD,YAAY,EAAE,CACZ,8BAAC,yBAAc,IACb,SAAS,EAAE,OAAO,CAAC,6BAA6B,EAChD,QAAQ,EAAC,KAAK;oBAEd,8BAAC,qBAAU,kBACE,cAAc,EACzB,OAAO,EAAE,GAAG,EAAE,CAAC,kBAAkB,CAAC,EAAE,CAAC;wBAErC,8BAAC,eAAS,OAAG,CACF,CACE,CAClB;aACF,GACD,CACE,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,8DAA8D;AAC9D,MAAM,oBAAoB,GAAG,IAAA,qBAAQ,EAAC,CAAC,EAAE,KAAK,EAAkB,EAAE,EAAE;IAClE,MAAM,UAAU,GAAG,KAAK,CAAC,cAAc,CAAC,WAAW,CAAA;IACnD,OAAO,8BAAC,UAAU,IAAC,UAAU,EAAE,UAAU,GAAI,CAAA;AAC/C,CAAC,CAAC,CAAA;AAEF,kBAAe,oBAAoB,CAAA"}

package/dist/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/dist/SpreadsheetView/components/ImportWizard.js

@@ -0,0 +1,81 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importStar(require("react"));
+const material_1 = require("@mui/material");
+const mobx_react_1 = require("mobx-react");
+const mobx_state_tree_1 = require("mobx-state-tree");
+const util_1 = require("@jbrowse/core/util");
+const ui_1 = require("@jbrowse/core/ui");
+const NumberEditor_1 = __importDefault(require("./NumberEditor"));
+const mui_1 = require("tss-react/mui");
+const useStyles = (0, mui_1.makeStyles)()({
+    container: {
+        margin: '0 auto',
+        maxWidth: '25em',
+        padding: 20,
+    },
+});
+const ImportWizard = (0, mobx_react_1.observer)(({ model }) => {
+    var _a;
+    const session = (0, util_1.getSession)(model);
+    const { classes } = useStyles();
+    const { assemblyNames, assemblyManager } = session;
+    const { fileType, canCancel, fileSource, isReadyToOpen, fileTypes, hasColumnNameLine, error, } = model;
+    const [selected, setSelected] = (0, react_1.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 = (0, mobx_state_tree_1.getRoot)(model);
+    return (react_1.default.createElement("div", { className: classes.container },
+        err ? react_1.default.createElement(ui_1.ErrorMessage, { error: err }) : null,
+        react_1.default.createElement("div", null,
+            react_1.default.createElement(material_1.FormControl, { component: "fieldset" },
+                react_1.default.createElement(material_1.FormLabel, { component: "legend" }, "Tabular file"),
+                react_1.default.createElement(material_1.FormGroup, null,
+                    react_1.default.createElement(ui_1.FileSelector, { location: fileSource, setLocation: arg => model.setFileSource(arg), rootModel: rootModel })))),
+        react_1.default.createElement("div", null,
+            react_1.default.createElement(material_1.FormControl, { component: "fieldset" },
+                react_1.default.createElement(material_1.FormLabel, { component: "legend" }, "File Type"),
+                react_1.default.createElement(material_1.RadioGroup, { row: true, "aria-label": "file type", name: "type", value: fileType }, fileTypes.map(fileTypeName => (react_1.default.createElement(material_1.FormControlLabel, { key: fileTypeName, checked: fileType === fileTypeName, value: fileTypeName, onClick: () => model.setFileType(fileTypeName), control: react_1.default.createElement(material_1.Radio, null), label: fileTypeName })))))),
+        showRowControls ? (react_1.default.createElement("div", null,
+            react_1.default.createElement(material_1.FormControl, { component: "fieldset" },
+                react_1.default.createElement(material_1.FormLabel, { component: "legend" }, "Column Names"),
+                react_1.default.createElement(material_1.FormControlLabel, { disabled: !showRowControls, label: "has column names on line", labelPlacement: "end", control: react_1.default.createElement(material_1.Checkbox, { checked: hasColumnNameLine, onClick: () => model.toggleHasColumnNameLine() }) }),
+                react_1.default.createElement(NumberEditor_1.default, { model: model, disabled: !showRowControls || !hasColumnNameLine, modelPropName: "columnNameLineNumber", modelSetterName: "setColumnNameLineNumber" })))) : null,
+        react_1.default.createElement("div", null,
+            react_1.default.createElement(ui_1.AssemblySelector, { session: session, selected: selected, onChange: val => setSelected(val) })),
+        react_1.default.createElement("div", null,
+            canCancel ? (react_1.default.createElement(material_1.Button, { variant: "contained", color: "secondary", onClick: () => model.cancelButton(), disabled: !canCancel }, "Cancel")) : null,
+            ' ',
+            react_1.default.createElement(material_1.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"))));
+});
+exports.default = ImportWizard;
+//# sourceMappingURL=ImportWizard.js.map

package/dist/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/dist/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/dist/SpreadsheetView/components/NumberEditor.js

@@ -0,0 +1,54 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importStar(require("react"));
+const material_1 = require("@mui/material");
+const mui_1 = require("tss-react/mui");
+const mobx_react_1 = require("mobx-react");
+const useStyles = (0, mui_1.makeStyles)()({
+    textField: {
+        width: '2rem',
+        verticalAlign: 'baseline',
+    },
+});
+exports.default = (0, mobx_react_1.observer)(function ({ model, disabled, modelPropName, modelSetterName, }) {
+    // @ts-expect-error
+    const [val, setVal] = (0, react_1.useState)(model[modelPropName]);
+    const { classes } = useStyles();
+    (0, react_1.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_1.default.createElement(material_1.TextField, { value: val, disabled: disabled, type: "number", onChange: evt => setVal(evt.target.value), className: classes.textField }));
+});
+//# sourceMappingURL=NumberEditor.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"NumberEditor.js","sourceRoot":"","sources":["../../../src/SpreadsheetView/components/NumberEditor.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAkD;AAClD,4CAAyC;AACzC,uCAA0C;AAC1C,2CAAqC;AAKrC,MAAM,SAAS,GAAG,IAAA,gBAAU,GAAE,CAAC;IAC7B,SAAS,EAAE;QACT,KAAK,EAAE,MAAM;QACb,aAAa,EAAE,UAAU;KAC1B;CACF,CAAC,CAAA;AAEF,kBAAe,IAAA,qBAAQ,EAAC,UAAU,EAChC,KAAK,EACL,QAAQ,EACR,aAAa,EACb,eAAe,GAMhB;IACC,mBAAmB;IACnB,MAAM,CAAC,GAAG,EAAE,MAAM,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,aAAa,CAAC,CAAC,CAAA;IACpD,MAAM,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,CAAA;IAC/B,IAAA,iBAAS,EAAC,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,8BAAC,oBAAS,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/dist/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/dist/SpreadsheetView/components/RowCountMessage.js

@@ -0,0 +1,33 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const mobx_react_1 = require("mobx-react");
+const RowCountMessage = (0, mobx_react_1.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_1.default.createElement(react_1.default.Fragment, null, rowMessage);
+    }
+    return null;
+});
+exports.default = RowCountMessage;
+//# sourceMappingURL=RowCountMessage.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"RowCountMessage.js","sourceRoot":"","sources":["../../../src/SpreadsheetView/components/RowCountMessage.tsx"],"names":[],"mappings":";;;;;AAAA,kDAAyB;AACzB,2CAAqC;AAQrC,MAAM,eAAe,GAAG,IAAA,qBAAQ,EAAC,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,8DAAG,UAAU,CAAI,CAAA;KACzB;IACD,OAAO,IAAI,CAAA;AACb,CAAC,CAAC,CAAA;AACF,kBAAe,eAAe,CAAA"}

package/dist/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/dist/SpreadsheetView/components/RowMenu.js

@@ -0,0 +1,39 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const mobx_react_1 = require("mobx-react");
+const ui_1 = require("@jbrowse/core/ui");
+const RowMenu = (0, mobx_react_1.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_1.default.createElement(ui_1.Menu, { anchorEl: currentRowMenu && currentRowMenu.anchorEl, open: Boolean(currentRowMenu), onMenuItemClick: handleMenuItemClick, onClose: rowMenuClose, menuItems: menuItems, anchorOrigin: {
+            vertical: 'bottom',
+            horizontal: 'right',
+        } }));
+});
+exports.default = RowMenu;
+//# sourceMappingURL=RowMenu.js.map

package/dist/SpreadsheetView/components/RowMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RowMenu.js","sourceRoot":"","sources":["../../../src/SpreadsheetView/components/RowMenu.tsx"],"names":[],"mappings":";;;;;AAAA,kDAAyB;AACzB,2CAAqC;AACrC,yCAAiD;AAOjD,MAAM,OAAO,GAAG,IAAA,qBAAQ,EAAC,UAAU,EACjC,SAAS,EACT,gBAAgB,GAIjB;;IACC,MAAM,cAAc,GAAG,gBAAgB,CAAC,eAAe,CAAA;IACvD,MAAM,EAAE,kBAAkB,EAAE,GAAG,gBAAgB,CAAA;IAE/C,MAAM,YAAY,GAAG,GAAG,EAAE;QACxB,kBAAkB,CAAC,IAAI,CAAC,CAAA;IAC1B,CAAC,CAAA;IAED,MAAM,SAAS,GAAG,MAAA,gBAAgB,CAAC,eAAe,0CAAE,SAAS,CAAA;IAC7D,IAAI,SAAS,KAAK,SAAS,EAAE;QAC3B,OAAO,IAAI,CAAA;KACZ;IAED,MAAM,GAAG,GAAG,gBAAgB,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,SAAS,GAAG,CAAC,CAAC,CAAA;IAExD,SAAS,mBAAmB,CAAC,MAAe,EAAE,QAAkB;QAC9D,QAAQ,CAAC,SAAS,EAAE,gBAAgB,EAAE,SAAS,EAAE,GAAG,CAAC,CAAA;QACrD,YAAY,EAAE,CAAA;IAChB,CAAC;IAED,0EAA0E;IAC1E,MAAM,SAAS,GAAe,SAAS,CAAC,YAAY,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;QAC9D,IAAI,OAAO,IAAI,CAAC,QAAQ,KAAK,UAAU,EAAE;YACvC,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAC5B,SAAS,EACT,gBAAgB,EAChB,CAAC,SAAS,EACV,GAAG,CACJ,CAAA;YACD,OAAO,EAAE,GAAG,IAAI,EAAE,QAAQ,EAAE,CAAA;SAC7B;QACD,OAAO,IAAI,CAAA;IACb,CAAC,CAAC,CAAA;IAEF,OAAO,CACL,8BAAC,SAAI,IACH,QAAQ,EAAE,cAAc,IAAI,cAAc,CAAC,QAAQ,EACnD,IAAI,EAAE,OAAO,CAAC,cAAc,CAAC,EAC7B,eAAe,EAAE,mBAAmB,EACpC,OAAO,EAAE,YAAY,EACrB,SAAS,EAAE,SAAS,EACpB,YAAY,EAAE;YACZ,QAAQ,EAAE,QAAQ;YAClB,UAAU,EAAE,OAAO;SACpB,GACD,CACH,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,kBAAe,OAAO,CAAA"}

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

@@ -0,0 +1,6 @@
+import React from 'react';
+import { SpreadsheetModel } from '../models/Spreadsheet';
+export default function SortIndicator({ model, columnNumber, }: {
+    model: SpreadsheetModel;
+    columnNumber: number;
+}): React.JSX.Element | null;

package/dist/SpreadsheetView/components/SortIndicator.js

@@ -0,0 +1,28 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const mui_1 = require("tss-react/mui");
+// icons
+const KeyboardArrowUp_1 = __importDefault(require("@mui/icons-material/KeyboardArrowUp"));
+const KeyboardArrowDown_1 = __importDefault(require("@mui/icons-material/KeyboardArrowDown"));
+const useStyles = (0, mui_1.makeStyles)()({
+    sortIndicator: {
+        position: 'relative',
+        top: '0.2rem',
+        fontSize: '1rem',
+    },
+});
+function SortIndicator({ model, columnNumber, }) {
+    const { classes } = useStyles();
+    const sortSpec = model.sortColumns.find(c => c.columnNumber === columnNumber);
+    if (sortSpec) {
+        const { descending } = sortSpec;
+        return descending ? (react_1.default.createElement(KeyboardArrowUp_1.default, { className: classes.sortIndicator })) : (react_1.default.createElement(KeyboardArrowDown_1.default, { className: classes.sortIndicator }));
+    }
+    return null;
+}
+exports.default = SortIndicator;
+//# sourceMappingURL=SortIndicator.js.map

package/dist/SpreadsheetView/components/SortIndicator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SortIndicator.js","sourceRoot":"","sources":["../../../src/SpreadsheetView/components/SortIndicator.tsx"],"names":[],"mappings":";;;;;AAAA,kDAAyB;AACzB,uCAA0C;AAE1C,QAAQ;AACR,0FAAqE;AACrE,8FAAyE;AAGzE,MAAM,SAAS,GAAG,IAAA,gBAAU,GAAE,CAAC;IAC7B,aAAa,EAAE;QACb,QAAQ,EAAE,UAAU;QACpB,GAAG,EAAE,QAAQ;QACb,QAAQ,EAAE,MAAM;KACjB;CACF,CAAC,CAAA;AAEF,SAAwB,aAAa,CAAC,EACpC,KAAK,EACL,YAAY,GAIb;IACC,MAAM,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,CAAA;IAC/B,MAAM,QAAQ,GAAG,KAAK,CAAC,WAAW,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,KAAK,YAAY,CAAC,CAAA;IAE7E,IAAI,QAAQ,EAAE;QACZ,MAAM,EAAE,UAAU,EAAE,GAAG,QAAQ,CAAA;QAC/B,OAAO,UAAU,CAAC,CAAC,CAAC,CAClB,8BAAC,yBAAmB,IAAC,SAAS,EAAE,OAAO,CAAC,aAAa,GAAI,CAC1D,CAAC,CAAC,CAAC,CACF,8BAAC,2BAAqB,IAAC,SAAS,EAAE,OAAO,CAAC,aAAa,GAAI,CAC5D,CAAA;KACF;IACD,OAAO,IAAI,CAAA;AACb,CAAC;AAnBD,gCAmBC"}

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

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

package/dist/SpreadsheetView/components/Spreadsheet.js

@@ -0,0 +1,25 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const react_1 = __importDefault(require("react"));
+const mobx_react_1 = require("mobx-react");
+const mui_1 = require("tss-react/mui");
+const ui_1 = require("@jbrowse/core/ui");
+const DataTable_1 = __importDefault(require("./DataTable"));
+const useStyles = (0, mui_1.makeStyles)()(theme => ({
+    root: {
+        position: 'relative',
+        marginBottom: theme.spacing(1),
+        background: theme.palette.background.paper,
+        overflow: 'auto',
+    },
+}));
+const Spreadsheet = (0, mobx_react_1.observer)(function ({ model, height, page, rowsPerPage, }) {
+    var _a;
+    const { classes } = useStyles();
+    return (react_1.default.createElement("div", { className: classes.root, style: { height } }, ((_a = model === null || model === void 0 ? void 0 : model.rowSet) === null || _a === void 0 ? void 0 : _a.isLoaded) && model.initialized ? (react_1.default.createElement(DataTable_1.default, { model: model, page: page, rowsPerPage: rowsPerPage })) : (react_1.default.createElement(ui_1.LoadingEllipses, { variant: "h6" }))));
+});
+exports.default = Spreadsheet;
+//# sourceMappingURL=Spreadsheet.js.map

package/dist/SpreadsheetView/components/Spreadsheet.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Spreadsheet.js","sourceRoot":"","sources":["../../../src/SpreadsheetView/components/Spreadsheet.tsx"],"names":[],"mappings":";;;;;AAAA,kDAAyB;AACzB,2CAAqC;AAErC,uCAA0C;AAI1C,yCAAkD;AAClD,4DAAmC;AAInC,MAAM,SAAS,GAAG,IAAA,gBAAU,GAAE,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;IACvC,IAAI,EAAE;QACJ,QAAQ,EAAE,UAAU;QACpB,YAAY,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;QAC9B,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,UAAU,CAAC,KAAK;QAC1C,QAAQ,EAAE,MAAM;KACjB;CACF,CAAC,CAAC,CAAA;AAEH,MAAM,WAAW,GAAG,IAAA,qBAAQ,EAAC,UAAU,EACrC,KAAK,EACL,MAAM,EACN,IAAI,EACJ,WAAW,GAMZ;;IACC,MAAM,EAAE,OAAO,EAAE,GAAG,SAAS,EAAE,CAAA;IAE/B,OAAO,CACL,uCAAK,SAAS,EAAE,OAAO,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,MAAM,EAAE,IAC5C,CAAA,MAAA,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,0CAAE,QAAQ,KAAI,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,CAC9C,8BAAC,mBAAS,IAAC,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,WAAW,EAAE,WAAW,GAAI,CAClE,CAAC,CAAC,CAAC,CACF,8BAAC,oBAAe,IAAC,OAAO,EAAC,IAAI,GAAG,CACjC,CACG,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,kBAAe,WAAW,CAAA"}

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

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