@popmenu/admin-ui 0.18.4-alpha.3 → 0.19.0-alpha.0

package/build/index.js

@@ -39,8 +39,8 @@ require('@material-ui/core/ListItem');
 require('@material-ui/core/ListItemIcon');
 require('@material-ui/core/ListItemSecondaryAction');
 require('@material-ui/core/ListItemText');
-var Menu = require('@material-ui/core/Menu');
-var MenuItem = require('@material-ui/core/MenuItem');
+require('@material-ui/core/Menu');
+require('@material-ui/core/MenuItem');
 require('@material-ui/core/MenuList');
 var MuiRadio = require('@material-ui/core/Radio');
 require('@material-ui/core/TextField');
@@ -52,10 +52,6 @@ var MuiToggleButtonGroup = require('@material-ui/lab/ToggleButtonGroup');
 var MuiTooltip = require('@material-ui/core/Tooltip');
 var MuiAlertTitle = require('@material-ui/lab/AlertTitle');
 var Box = require('@material-ui/core/Box');
-var useTable_js = require('react-table/src/hooks/useTable.js');
-var usePagination_js = require('react-table/src/plugin-hooks/usePagination.js');
-var useSortBy_js = require('react-table/src/plugin-hooks/useSortBy.js');
-var lab = require('@material-ui/lab');
 var MuiSnackbar = require('@material-ui/core/Snackbar');
 var createTheme = require('@material-ui/core/styles/createTheme');
 
@@ -98,8 +94,6 @@ var MuiCheckbox__default = /*#__PURE__*/_interopDefaultLegacy(MuiCheckbox);
 var FormControlLabel__default = /*#__PURE__*/_interopDefaultLegacy(FormControlLabel);
 var Dialog__default = /*#__PURE__*/_interopDefaultLegacy(Dialog);
 var MuiLink__default = /*#__PURE__*/_interopDefaultLegacy(MuiLink);
-var Menu__default = /*#__PURE__*/_interopDefaultLegacy(Menu);
-var MenuItem__default = /*#__PURE__*/_interopDefaultLegacy(MenuItem);
 var MuiRadio__default = /*#__PURE__*/_interopDefaultLegacy(MuiRadio);
 var MuiSwitch__default = /*#__PURE__*/_interopDefaultLegacy(MuiSwitch);
 var MuiToggleButton__default = /*#__PURE__*/_interopDefaultLegacy(MuiToggleButton);
@@ -891,24 +885,6 @@ function SvgInfo(props) {
   })));
 }
 
-var _path$3K;
-
-function _extends$3$() { _extends$3$ = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$3$.apply(this, arguments); }
-
-function SvgMore(props) {
-  return /*#__PURE__*/React__namespace.createElement("svg", _extends$3$({
-    viewBox: "0 0 16 16",
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    stroke: "currentColor",
-    width: "1em",
-    height: "1em",
-    fill: "none"
-  }, props), _path$3K || (_path$3K = /*#__PURE__*/React__namespace.createElement("path", {
-    d: "M8 8.667a.667.667 0 100-1.334.667.667 0 000 1.334zM8 4a.667.667 0 100-1.333A.667.667 0 008 4zm0 9.333A.667.667 0 108 12a.667.667 0 000 1.333z"
-  })));
-}
-
 var _path$3a;
 
 function _extends$3q() { _extends$3q = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$3q.apply(this, arguments); }
@@ -945,42 +921,6 @@ function SvgWarning(props) {
   })));
 }
 
-var _path$2X;
-
-function _extends$3b() { _extends$3b = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$3b.apply(this, arguments); }
-
-function SvgChevronDown(props) {
-  return /*#__PURE__*/React__namespace.createElement("svg", _extends$3b({
-    viewBox: "0 0 16 16",
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    stroke: "currentColor",
-    width: "1em",
-    height: "1em",
-    fill: "none"
-  }, props), _path$2X || (_path$2X = /*#__PURE__*/React__namespace.createElement("path", {
-    d: "M4 6l4 4 4-4"
-  })));
-}
-
-var _path$2W;
-
-function _extends$3a() { _extends$3a = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$3a.apply(this, arguments); }
-
-function SvgChevronUp(props) {
-  return /*#__PURE__*/React__namespace.createElement("svg", _extends$3a({
-    viewBox: "0 0 16 16",
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    stroke: "currentColor",
-    width: "1em",
-    height: "1em",
-    fill: "none"
-  }, props), _path$2W || (_path$2W = /*#__PURE__*/React__namespace.createElement("path", {
-    d: "M12 10L8 6l-4 4"
-  })));
-}
-
 var _path$S;
 
 function _extends$10() { _extends$10 = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$10.apply(this, arguments); }
@@ -1668,201 +1608,6 @@ var SelectableCard = function (props) {
 };
 SelectableCard.displayName = 'SelectableCard';
 
-var TableFooter = function (props) {
-    return (React__default['default'].createElement(core.Box, { display: "flex", justifyContent: "center", alignItems: "end", paddingTop: 3, paddingBottom: 4, flexGrow: 1 }, props.children));
-};
-
-var TableHeader = function (props) {
-    var children = props.children, restProps = __rest$1(props, ["children"]);
-    return React__default['default'].createElement("thead", __assign$1({}, restProps), children);
-};
-
-var getWidth = function (props) {
-    var isActionColumn = props.column.isActionColumn, fullWidth = props.tableProps.fullWidth;
-    var width;
-    if (fullWidth && isActionColumn) {
-        width = '0.0000000001%';
-    }
-    if (fullWidth && !isActionColumn) {
-        width = '1%';
-    }
-    if (!fullWidth && isActionColumn) {
-        width = 72;
-    }
-    if (!fullWidth && !isActionColumn) {
-        width = undefined;
-    }
-    return width;
-};
-var useTableHeaderCellStyles = core.makeStyles(function (theme) { return ({
-    root: function (props) {
-        var width = getWidth(props);
-        return {
-            borderBottomStyle: 'solid',
-            borderBottomWidth: 2,
-            borderBottomColor: theme.palette.grey[100],
-            padding: theme.spacing(2),
-            textAlign: 'left',
-            fontWeight: 500,
-            width: width,
-        };
-    },
-}); });
-
-var TableHeaderCell = function (props) {
-    var children = props.children, column = props.column; props.tableProps; var restProps = __rest$1(props, ["children", "column", "tableProps"]);
-    var root = useTableHeaderCellStyles(props).root;
-    var _a = core.useTheme(), palette = _a.palette, spacing = _a.spacing;
-    //@ts-expect-error @types/react-table issue
-    var canSort = column.canSort, isSorted = column.isSorted, isSortedDesc = column.isSortedDesc, isActionColumn = column.isActionColumn;
-    var showSortIndicator = canSort && !isActionColumn;
-    return (React__default['default'].createElement("th", __assign$1({ className: root }, restProps),
-        React__default['default'].createElement(core.Box, { display: "flex", alignItems: "center", gridGap: spacing(1) },
-            children,
-            showSortIndicator && (React__default['default'].createElement(Icon, { icon: isSortedDesc ? SvgChevronDown : SvgChevronUp, color: isSorted ? palette.text.primary : palette.text.disabled, size: "large" })))));
-};
-
-var TableHeaderRow = function (props) {
-    var children = props.children, restProps = __rest$1(props, ["children"]);
-    return React__default['default'].createElement("tr", __assign$1({}, restProps), children);
-};
-
-var useTableRowStyles = core.makeStyles(function (theme) { return ({
-    root: function () { return ({
-        '&:nth-child(even)': {
-            backgroundColor: theme.palette.grey[100],
-        },
-    }); },
-}); });
-
-var TableRow = function (props) {
-    var children = props.children, restProps = __rest$1(props, ["children"]);
-    var root = useTableRowStyles(props).root;
-    return (React__default['default'].createElement("tr", __assign$1({ className: root }, restProps), children));
-};
-
-var TableBody = function (props) {
-    var children = props.children, restProps = __rest$1(props, ["children"]);
-    return React__default['default'].createElement("tbody", __assign$1({}, restProps), children);
-};
-
-var useTableCellStyles = core.makeStyles(function (theme) { return ({
-    root: function () { return ({
-        padding: theme.spacing(2),
-    }); },
-}); });
-
-var TableCell = function (props) {
-    var children = props.children, restProps = __rest$1(props, ["children"]);
-    var root = useTableCellStyles(props).root;
-    return (React__default['default'].createElement("td", __assign$1({ className: root }, restProps), children));
-};
-
-var useTableStyles = core.makeStyles(function (_a) {
-    var typography = _a.typography;
-    return ({
-        root: function (_a) {
-            var fullWidth = _a.fullWidth;
-            return ({
-                display: fullWidth ? 'flex' : 'inline-flex',
-                flexDirection: 'column',
-            });
-        },
-        table: function (_a) {
-            var fullWidth = _a.fullWidth;
-            return (__assign$1(__assign$1({ borderCollapse: 'collapse' }, (fullWidth && { width: '100%' })), typography.body1));
-        },
-        tableWrap: function () { return ({
-            maxWidth: '100%',
-            overflowX: 'auto',
-            overflowY: 'hidden',
-        }); },
-    });
-});
-
-var TableActionsCell = function (props) {
-    var _a = props.actions, primary = _a.primary, secondary = _a.secondary, intermediate = __rest$1(_a, ["primary", "secondary"]);
-    var tertiary = intermediate.tertiary, restActions = __rest$1(intermediate, ["tertiary"]);
-    var overflow = Object.keys(props.actions).length > 3;
-    var _b = React__default['default'].useState(null), anchorEl = _b[0], setAnchorEl = _b[1];
-    var openMenu = function (event) {
-        setAnchorEl(event.currentTarget);
-    };
-    var closeMenu = function () {
-        setAnchorEl(null);
-    };
-    var handleItemClick = function (action) {
-        action(props.cell);
-        closeMenu();
-    };
-    return (React__default['default'].createElement(core.Box, { display: "flex" },
-        primary && primary.icon && (React__default['default'].createElement(IconButton, { size: "small", onClick: function () { return primary.action(props.cell); } },
-            React__default['default'].createElement(Icon, { icon: primary.icon }))),
-        secondary && secondary.icon && (React__default['default'].createElement(IconButton, { size: "small", onClick: function () { return secondary.action(props.cell); } },
-            React__default['default'].createElement(Icon, { icon: secondary.icon }))),
-        !overflow && tertiary && tertiary.icon && (React__default['default'].createElement(IconButton, { size: "small", onClick: function () { return tertiary.action(props.cell); } },
-            React__default['default'].createElement(Icon, { icon: tertiary.icon }))),
-        overflow && restActions && (React__default['default'].createElement(React__default['default'].Fragment, null,
-            React__default['default'].createElement(IconButton, { size: "small", onClick: openMenu },
-                React__default['default'].createElement(Icon, { icon: SvgMore })),
-            React__default['default'].createElement(Menu__default['default'], { anchorEl: anchorEl, open: Boolean(anchorEl), onClose: closeMenu }, Object.values(__assign$1({ tertiary: tertiary }, restActions))
-                .filter(function (value) { return value; })
-                .map(function (_a, i) {
-                var label = _a.label, action = _a.action;
-                return (React__default['default'].createElement(MenuItem__default['default'], { key: i, onClick: function () { return handleItemClick(action); } }, label));
-            }))))));
-};
-
-var makeColumns = function (config) {
-    var columns = config.columns, actions = config.actions, actionColumnId = config.actionColumnId;
-    var actionColumn;
-    var memoizedColumns = __spreadArray([], columns);
-    if (actions) {
-        var CellComponent = function (props) { return React__default['default'].createElement(TableActionsCell, __assign$1({}, props, { actions: actions })); };
-        actionColumn = {
-            id: actionColumnId,
-            Header: function () { return null; },
-            Cell: CellComponent,
-        };
-        memoizedColumns = __spreadArray(__spreadArray([], columns), [actionColumn]);
-    }
-    return memoizedColumns;
-};
-
-/* eslint-disable react/jsx-key */
-var Table = function (props) {
-    var actionColumnId = 'table-actions-column';
-    var rawColumns = props.columns, data = props.data, actions = props.actions, sortable = props.sortable, emptyMessage = props.emptyMessage, EmptyImage = props.EmptyImage, isLoading = props.loading, enableMinHeight = props.enableMinHeight;
-    var classes = useTableStyles(props);
-    var columns = React.useMemo(function () { return makeColumns({ columns: rawColumns, actions: actions, actionColumnId: actionColumnId }); }, [rawColumns, actions]);
-    var instance = useTable_js.useTable({ columns: columns, data: data, disableSortBy: !sortable }, useSortBy_js.useSortBy, usePagination_js.usePagination);
-    var getTableProps = instance.getTableProps, getTableBodyProps = instance.getTableBodyProps, headerGroups = instance.headerGroups, page = instance.page, prepareRow = instance.prepareRow, pageCount = instance.pageCount, gotoPage = instance.gotoPage, state = instance.state, rows = instance.rows;
-    var isPaginated = pageCount > 1;
-    var isEmpty = rows.length === 0;
-    var handlePagination = function (_e, pageNumber) {
-        gotoPage(pageNumber - 1);
-    };
-    return (React__default['default'].createElement(core.Box, { className: classes.root, minHeight: (isLoading || isEmpty) && enableMinHeight ? 618 : 'unset' },
-        React__default['default'].createElement(core.Box, { className: classes.tableWrap, minHeight: page.length > 0 && !isLoading && enableMinHeight ? 618 : 'unset' },
-            React__default['default'].createElement("table", __assign$1({ className: classes.table }, getTableProps()),
-                React__default['default'].createElement(TableHeader, null, headerGroups.map(function (headerGroup) { return (React__default['default'].createElement(TableHeaderRow, __assign$1({}, headerGroup.getHeaderGroupProps()), headerGroup.headers.map(function (column) { return (React__default['default'].createElement(TableHeaderCell, __assign$1({}, column.getHeaderProps(column.getSortByToggleProps()), { column: __assign$1(__assign$1({}, column), { isActionColumn: column.id === actionColumnId }), tableProps: props }), column.render('Header'))); }))); })),
-                !isEmpty && !isLoading && (React__default['default'].createElement(TableBody, __assign$1({}, getTableBodyProps()), page.map(function (row) {
-                    prepareRow(row);
-                    return (React__default['default'].createElement(TableRow, __assign$1({}, row.getRowProps()), row.cells.map(function (cell) { return (React__default['default'].createElement(TableCell, __assign$1({}, cell.getCellProps()), cell.render('Cell'))); })));
-                }))))),
-        isEmpty && (React__default['default'].createElement(core.Box, { display: "flex", flexDirection: "column", justifyContent: "center", alignItems: "center", p: 2, flexGrow: 1 },
-            EmptyImage && EmptyImage(),
-            React__default['default'].createElement(Typography, null, emptyMessage))),
-        isLoading && (React__default['default'].createElement(core.Box, { display: "flex", flexDirection: "column", justifyContent: "center", alignItems: "center", p: 2, flexGrow: 1 },
-            React__default['default'].createElement(CircularProgress__default['default'], { size: 80, color: "inherit" }))),
-        isPaginated && !isLoading && (React__default['default'].createElement(TableFooter, null,
-            React__default['default'].createElement(lab.Pagination, { count: pageCount, page: state.pageIndex + 1, onChange: handlePagination })))));
-};
-Table.defaultProps = {
-    emptyMessage: 'No results.',
-    enableMinHeight: true,
-};
-
 var useToastStyles = styles.makeStyles(function (theme) { return ({
     root: {
         boxSizing: 'border-box',
@@ -2162,7 +1907,6 @@ exports.FullScreenStepper = FullScreenStepper;
 exports.FullScreenStepperContent = FullScreenStepperContent;
 exports.FullScreenStepperContext = FullScreenStepperContext;
 exports.SelectableCard = SelectableCard;
-exports.Table = Table;
 exports.Toast = Toast;
 exports.adminDark = adminDark;
 exports.adminDarkOptions = adminDarkOptions;