@popmenu/table 0.126.4 → 0.127.1

package/build/esm/components/FilterPanel/FilterPanelContext/FilterPanelContext.js

@@ -1,8 +1,8 @@
 import { createContext, useContext } from 'react';
 
-var FilterPanelContext = createContext(null);
-var useFilterPanelContext = function () {
-    var context = useContext(FilterPanelContext);
+const FilterPanelContext = createContext(null);
+const useFilterPanelContext = () => {
+    const context = useContext(FilterPanelContext);
     if (!context) {
         throw new Error('useFilterPanelContext has to be used within <FilterPanelContext.Provider>');
     }

package/build/esm/components/FilterPanel/FilterPanelContext/FilterPanelContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"FilterPanelContext.js","sources":["../../../../../src/components/FilterPanel/FilterPanelContext/FilterPanelContext.tsx"],"sourcesContent":["import React, { createContext, useContext } from 'react'\n\ntype FilterPanelContextValue = {\n  anchorState: [Element | null, React.Dispatch<React.SetStateAction<Element | null>>]\n}\n\nexport const FilterPanelContext = createContext<FilterPanelContextValue | null>(null)\n\nexport const useFilterPanelContext = () => {\n  const context = useContext(FilterPanelContext)\n\n  if (!context) {\n    throw new Error('useFilterPanelContext has to be used within <FilterPanelContext.Provider>')\n  }\n\n  return context\n}\n"],"names":[],"mappings":";;IAMa,kBAAkB,GAAG,aAAa,CAAiC,IAAI;AAEvE,IAAA,qBAAqB,GAAG,YAAA;AACnC,IAAA,IAAM,OAAO,GAAG,UAAU,CAAC,kBAAkB,CAAC;IAE9C,IAAI,CAAC,OAAO,EAAE;AACZ,QAAA,MAAM,IAAI,KAAK,CAAC,2EAA2E,CAAC;AAC7F;AAED,IAAA,OAAO,OAAO;AAChB;;;;"}
+{"version":3,"file":"FilterPanelContext.js","sources":["../../../../../src/components/FilterPanel/FilterPanelContext/FilterPanelContext.tsx"],"sourcesContent":["import React, { createContext, useContext } from 'react'\n\ntype FilterPanelContextValue = {\n  anchorState: [Element | null, React.Dispatch<React.SetStateAction<Element | null>>]\n}\n\nexport const FilterPanelContext = createContext<FilterPanelContextValue | null>(null)\n\nexport const useFilterPanelContext = () => {\n  const context = useContext(FilterPanelContext)\n\n  if (!context) {\n    throw new Error('useFilterPanelContext has to be used within <FilterPanelContext.Provider>')\n  }\n\n  return context\n}\n"],"names":[],"mappings":";;MAMa,kBAAkB,GAAG,aAAa,CAAiC,IAAI;AAE7E,MAAM,qBAAqB,GAAG,MAAK;AACxC,IAAA,MAAM,OAAO,GAAG,UAAU,CAAC,kBAAkB,CAAC;IAE9C,IAAI,CAAC,OAAO,EAAE;AACZ,QAAA,MAAM,IAAI,KAAK,CAAC,2EAA2E,CAAC;;AAG9F,IAAA,OAAO,OAAO;AAChB;;;;"}

package/build/esm/components/FilterPanel/FilterPanelProps.d.ts

@@ -1,5 +1,5 @@
-export declare type ColumnFilterInput = 'text' | 'number' | 'radio' | 'select' | 'multi-select';
-export declare type ColumnFilter = {
+export type ColumnFilterInput = 'text' | 'number' | 'radio' | 'select' | 'multi-select';
+export type ColumnFilter = {
     columnId: string;
     input: ColumnFilterInput;
     min?: number;

package/build/esm/components/FilterPanel/Panel/Panel.d.ts

@@ -1,5 +1,4 @@
-/// <reference types="react" />
-declare type PanelProps = {
+type PanelProps = {
     anchorEl: null | Element;
     onClose: () => void;
 };

package/build/esm/components/FilterPanel/Panel/Panel.js

@@ -1,4 +1,3 @@
-import { __assign } from 'tslib';
 import React, { useContext, useRef } from 'react';
 import { Popover, Paper, Box, Typography } from '@popmenu/common-ui';
 import { useStyles } from './PanelStyles.js';
@@ -7,32 +6,31 @@ import { TableContext } from '../../TableContext/index.js';
 import { useColumnFilters } from '../../../hooks/useColumnFilters.js';
 import { Button } from '@popmenu/admin-ui';
 
-var Panel = function (props) {
-    var anchorEl = props.anchorEl, onClose = props.onClose;
-    var classes = useStyles();
-    var _a = useContext(TableContext), table = _a.table, stagedColumnFilters = _a.stagedColumnFilters, stageFilterSelections = _a.stageFilterSelections;
-    var paperRef = useRef(null);
-    var _b = useColumnFilters(table), columnFilters = _b.columnFilters, resetColumnFilters = _b.resetColumnFilters;
-    var handleClick = function (e) {
-        var _a;
-        var rect = (_a = paperRef.current) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect();
+const Panel = (props) => {
+    const { anchorEl, onClose } = props;
+    const classes = useStyles();
+    const { table, stagedColumnFilters, stageFilterSelections } = useContext(TableContext);
+    const paperRef = useRef(null);
+    const { columnFilters, resetColumnFilters } = useColumnFilters(table);
+    const handleClick = (e) => {
+        const rect = paperRef.current?.getBoundingClientRect();
         if (rect) {
-            var buffer = 10;
-            var mouseX = e.nativeEvent.x;
-            var mouseY = e.nativeEvent.y;
-            var xHit = rect.x - buffer < mouseX && mouseX < rect.x + rect.width + buffer;
-            var yHit = rect.y - buffer < mouseY && mouseY < rect.y + rect.height + buffer;
+            const buffer = 10;
+            const mouseX = e.nativeEvent.x;
+            const mouseY = e.nativeEvent.y;
+            const xHit = rect.x - buffer < mouseX && mouseX < rect.x + rect.width + buffer;
+            const yHit = rect.y - buffer < mouseY && mouseY < rect.y + rect.height + buffer;
             if (!xHit || !yHit) {
                 onClose();
             }
         }
     };
-    var handleApplyClick = function () {
+    const handleApplyClick = () => {
         if (stagedColumnFilters.exist()) {
-            columnFilters.forEach(function (columnFilter) {
-                var columnInputValue = stagedColumnFilters.get(columnFilter.columnId);
+            columnFilters.forEach((columnFilter) => {
+                const columnInputValue = stagedColumnFilters.get(columnFilter.columnId);
                 if (columnInputValue) {
-                    var column = table.getColumn(columnFilter.columnId);
+                    const column = table.getColumn(columnFilter.columnId);
                     column.setFilterValue(columnInputValue);
                 }
             });
@@ -42,10 +40,10 @@ var Panel = function (props) {
         }
         onClose();
     };
-    var handleCancelClick = function () {
+    const handleCancelClick = () => {
         onClose();
     };
-    var open = Boolean(anchorEl);
+    const open = Boolean(anchorEl);
     return (React.createElement(Popover, { onClick: handleClick, anchorEl: anchorEl, anchorOrigin: {
             vertical: 'bottom',
             horizontal: 'right',
@@ -60,9 +58,9 @@ var Panel = function (props) {
             horizontal: 'right',
         } },
         React.createElement(Paper, { className: classes.filterPopoverContents, elevation: 2 },
-            React.createElement(Box, __assign({}, { ref: paperRef }, { padding: 3 }),
+            React.createElement(Box, { ref: paperRef, padding: 3 },
                 React.createElement(Typography, { className: classes.menuTitle }, "Filter By"),
-                columnFilters.map(function (columnFilter, i) { return (React.createElement(FilterControl, __assign({}, columnFilter, { key: i }))); })),
+                columnFilters.map((columnFilter, i) => (React.createElement(FilterControl, { ...columnFilter, key: i })))),
             stageFilterSelections && (React.createElement(Box, { className: classes.buttonBox },
                 React.createElement(Button, { variant: "secondary", onClick: handleCancelClick }, "Cancel"),
                 React.createElement(Button, { onClick: handleApplyClick }, "Apply"))))));

package/build/esm/components/FilterPanel/Panel/Panel.js.map

@@ -1 +1 @@
-{"version":3,"file":"Panel.js","sources":["../../../../../src/components/FilterPanel/Panel/Panel.tsx"],"sourcesContent":["import React, { MouseEvent, useContext, useRef } from 'react'\nimport { Paper, Box, Typography, Popover } from '@popmenu/common-ui'\n\nimport { useStyles } from './PanelStyles'\nimport { FilterControl } from '../FilterControl'\nimport { TableContext } from '../../TableContext'\nimport { useColumnFilters } from '../../../hooks'\nimport { Button } from '@popmenu/admin-ui'\n\ntype PanelProps = {\n  anchorEl: null | Element\n  onClose: () => void\n}\n\nexport const Panel = (props: PanelProps) => {\n  const { anchorEl, onClose } = props\n  const classes = useStyles()\n  const { table, stagedColumnFilters, stageFilterSelections } = useContext(TableContext)\n  const paperRef = useRef<HTMLDivElement>(null)\n  const { columnFilters, resetColumnFilters } = useColumnFilters(table)\n\n  const handleClick = (e: MouseEvent) => {\n    const rect = paperRef.current?.getBoundingClientRect()\n    if (rect) {\n      const buffer = 10\n      const mouseX = e.nativeEvent.x\n      const mouseY = e.nativeEvent.y\n      const xHit = rect.x - buffer < mouseX && mouseX < rect.x + rect.width + buffer\n      const yHit = rect.y - buffer < mouseY && mouseY < rect.y + rect.height + buffer\n      if (!xHit || !yHit) {\n        onClose()\n      }\n    }\n  }\n\n  const handleApplyClick = () => {\n    if (stagedColumnFilters.exist()) {\n      columnFilters.forEach((columnFilter) => {\n        const columnInputValue = stagedColumnFilters.get(columnFilter.columnId)\n        if (columnInputValue) {\n          const column = table.getColumn(columnFilter.columnId)\n          column.setFilterValue(columnInputValue)\n        }\n      })\n    } else {\n      resetColumnFilters()\n    }\n    onClose()\n  }\n\n  const handleCancelClick = () => {\n    onClose()\n  }\n  const open = Boolean(anchorEl)\n  return (\n    <Popover\n      onClick={handleClick}\n      anchorEl={anchorEl}\n      anchorOrigin={{\n        vertical: 'bottom',\n        horizontal: 'right',\n      }}\n      className={classes.filterPopover}\n      onClose={onClose}\n      open={open}\n      PaperProps={{\n        style: {\n          backgroundColor: 'transparent',\n          boxShadow: 'none',\n          borderRadius: 0,\n        },\n      }}\n      transformOrigin={{\n        vertical: 'top',\n        horizontal: 'right',\n      }}\n    >\n      <Paper className={classes.filterPopoverContents} elevation={2}>\n        <Box {...{ ref: paperRef }} padding={3}>\n          <Typography className={classes.menuTitle}>Filter By</Typography>\n          {columnFilters.map((columnFilter, i) => (\n            <FilterControl {...columnFilter} key={i} />\n          ))}\n        </Box>\n        {stageFilterSelections && (\n          <Box className={classes.buttonBox}>\n            <Button variant=\"secondary\" onClick={handleCancelClick}>\n              Cancel\n            </Button>\n            <Button onClick={handleApplyClick}>Apply</Button>\n          </Box>\n        )}\n      </Paper>\n    </Popover>\n  )\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Panel.js","sources":["../../../../../src/components/FilterPanel/Panel/Panel.tsx"],"sourcesContent":["import React, { MouseEvent, useContext, useRef } from 'react'\nimport { Paper, Box, Typography, Popover } from '@popmenu/common-ui'\n\nimport { useStyles } from './PanelStyles'\nimport { FilterControl } from '../FilterControl'\nimport { TableContext } from '../../TableContext'\nimport { useColumnFilters } from '../../../hooks'\nimport { Button } from '@popmenu/admin-ui'\n\ntype PanelProps = {\n  anchorEl: null | Element\n  onClose: () => void\n}\n\nexport const Panel = (props: PanelProps) => {\n  const { anchorEl, onClose } = props\n  const classes = useStyles()\n  const { table, stagedColumnFilters, stageFilterSelections } = useContext(TableContext)\n  const paperRef = useRef<HTMLDivElement>(null)\n  const { columnFilters, resetColumnFilters } = useColumnFilters(table)\n\n  const handleClick = (e: MouseEvent) => {\n    const rect = paperRef.current?.getBoundingClientRect()\n    if (rect) {\n      const buffer = 10\n      const mouseX = e.nativeEvent.x\n      const mouseY = e.nativeEvent.y\n      const xHit = rect.x - buffer < mouseX && mouseX < rect.x + rect.width + buffer\n      const yHit = rect.y - buffer < mouseY && mouseY < rect.y + rect.height + buffer\n      if (!xHit || !yHit) {\n        onClose()\n      }\n    }\n  }\n\n  const handleApplyClick = () => {\n    if (stagedColumnFilters.exist()) {\n      columnFilters.forEach((columnFilter) => {\n        const columnInputValue = stagedColumnFilters.get(columnFilter.columnId)\n        if (columnInputValue) {\n          const column = table.getColumn(columnFilter.columnId)\n          column.setFilterValue(columnInputValue)\n        }\n      })\n    } else {\n      resetColumnFilters()\n    }\n    onClose()\n  }\n\n  const handleCancelClick = () => {\n    onClose()\n  }\n  const open = Boolean(anchorEl)\n  return (\n    <Popover\n      onClick={handleClick}\n      anchorEl={anchorEl}\n      anchorOrigin={{\n        vertical: 'bottom',\n        horizontal: 'right',\n      }}\n      className={classes.filterPopover}\n      onClose={onClose}\n      open={open}\n      PaperProps={{\n        style: {\n          backgroundColor: 'transparent',\n          boxShadow: 'none',\n          borderRadius: 0,\n        },\n      }}\n      transformOrigin={{\n        vertical: 'top',\n        horizontal: 'right',\n      }}\n    >\n      <Paper className={classes.filterPopoverContents} elevation={2}>\n        <Box {...{ ref: paperRef }} padding={3}>\n          <Typography className={classes.menuTitle}>Filter By</Typography>\n          {columnFilters.map((columnFilter, i) => (\n            <FilterControl {...columnFilter} key={i} />\n          ))}\n        </Box>\n        {stageFilterSelections && (\n          <Box className={classes.buttonBox}>\n            <Button variant=\"secondary\" onClick={handleCancelClick}>\n              Cancel\n            </Button>\n            <Button onClick={handleApplyClick}>Apply</Button>\n          </Box>\n        )}\n      </Paper>\n    </Popover>\n  )\n}\n"],"names":[],"mappings":";;;;;;;;AAca,MAAA,KAAK,GAAG,CAAC,KAAiB,KAAI;AACzC,IAAA,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,GAAG,KAAK;AACnC,IAAA,MAAM,OAAO,GAAG,SAAS,EAAE;AAC3B,IAAA,MAAM,EAAE,KAAK,EAAE,mBAAmB,EAAE,qBAAqB,EAAE,GAAG,UAAU,CAAC,YAAY,CAAC;AACtF,IAAA,MAAM,QAAQ,GAAG,MAAM,CAAiB,IAAI,CAAC;IAC7C,MAAM,EAAE,aAAa,EAAE,kBAAkB,EAAE,GAAG,gBAAgB,CAAC,KAAK,CAAC;AAErE,IAAA,MAAM,WAAW,GAAG,CAAC,CAAa,KAAI;QACpC,MAAM,IAAI,GAAG,QAAQ,CAAC,OAAO,EAAE,qBAAqB,EAAE;QACtD,IAAI,IAAI,EAAE;YACR,MAAM,MAAM,GAAG,EAAE;AACjB,YAAA,MAAM,MAAM,GAAG,CAAC,CAAC,WAAW,CAAC,CAAC;AAC9B,YAAA,MAAM,MAAM,GAAG,CAAC,CAAC,WAAW,CAAC,CAAC;YAC9B,MAAM,IAAI,GAAG,IAAI,CAAC,CAAC,GAAG,MAAM,GAAG,MAAM,IAAI,MAAM,GAAG,IAAI,CAAC,CAAC,GAAG,IAAI,CAAC,KAAK,GAAG,MAAM;YAC9E,MAAM,IAAI,GAAG,IAAI,CAAC,CAAC,GAAG,MAAM,GAAG,MAAM,IAAI,MAAM,GAAG,IAAI,CAAC,CAAC,GAAG,IAAI,CAAC,MAAM,GAAG,MAAM;AAC/E,YAAA,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,EAAE;AAClB,gBAAA,OAAO,EAAE;;;AAGf,KAAC;IAED,MAAM,gBAAgB,GAAG,MAAK;AAC5B,QAAA,IAAI,mBAAmB,CAAC,KAAK,EAAE,EAAE;AAC/B,YAAA,aAAa,CAAC,OAAO,CAAC,CAAC,YAAY,KAAI;gBACrC,MAAM,gBAAgB,GAAG,mBAAmB,CAAC,GAAG,CAAC,YAAY,CAAC,QAAQ,CAAC;gBACvE,IAAI,gBAAgB,EAAE;oBACpB,MAAM,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC,YAAY,CAAC,QAAQ,CAAC;AACrD,oBAAA,MAAM,CAAC,cAAc,CAAC,gBAAgB,CAAC;;AAE3C,aAAC,CAAC;;aACG;AACL,YAAA,kBAAkB,EAAE;;AAEtB,QAAA,OAAO,EAAE;AACX,KAAC;IAED,MAAM,iBAAiB,GAAG,MAAK;AAC7B,QAAA,OAAO,EAAE;AACX,KAAC;AACD,IAAA,MAAM,IAAI,GAAG,OAAO,CAAC,QAAQ,CAAC;AAC9B,IAAA,QACE,KAAA,CAAA,aAAA,CAAC,OAAO,EAAA,EACN,OAAO,EAAE,WAAW,EACpB,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE;AACZ,YAAA,QAAQ,EAAE,QAAQ;AAClB,YAAA,UAAU,EAAE,OAAO;AACpB,SAAA,EACD,SAAS,EAAE,OAAO,CAAC,aAAa,EAChC,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,IAAI,EACV,UAAU,EAAE;AACV,YAAA,KAAK,EAAE;AACL,gBAAA,eAAe,EAAE,aAAa;AAC9B,gBAAA,SAAS,EAAE,MAAM;AACjB,gBAAA,YAAY,EAAE,CAAC;AAChB,aAAA;AACF,SAAA,EACD,eAAe,EAAE;AACf,YAAA,QAAQ,EAAE,KAAK;AACf,YAAA,UAAU,EAAE,OAAO;AACpB,SAAA,EAAA;QAED,KAAC,CAAA,aAAA,CAAA,KAAK,EAAC,EAAA,SAAS,EAAE,OAAO,CAAC,qBAAqB,EAAE,SAAS,EAAE,CAAC,EAAA;YAC3D,KAAC,CAAA,aAAA,CAAA,GAAG,IAAO,GAAG,EAAE,QAAQ,EAAI,OAAO,EAAE,CAAC,EAAA;AACpC,gBAAA,KAAA,CAAA,aAAA,CAAC,UAAU,EAAC,EAAA,SAAS,EAAE,OAAO,CAAC,SAAS,EAAwB,EAAA,WAAA,CAAA;gBAC/D,aAAa,CAAC,GAAG,CAAC,CAAC,YAAY,EAAE,CAAC,MACjC,oBAAC,aAAa,EAAA,EAAA,GAAK,YAAY,EAAE,GAAG,EAAE,CAAC,EAAA,CAAI,CAC5C,CAAC,CACE;YACL,qBAAqB,KACpB,KAAC,CAAA,aAAA,CAAA,GAAG,IAAC,SAAS,EAAE,OAAO,CAAC,SAAS,EAAA;gBAC/B,KAAC,CAAA,aAAA,CAAA,MAAM,IAAC,OAAO,EAAC,WAAW,EAAC,OAAO,EAAE,iBAAiB,EAE7C,EAAA,QAAA,CAAA;gBACT,KAAC,CAAA,aAAA,CAAA,MAAM,EAAC,EAAA,OAAO,EAAE,gBAAgB,EAAgB,EAAA,OAAA,CAAA,CAC7C,CACP,CACK,CACA;AAEd;;;;"}

package/build/esm/components/FilterPanel/Panel/PanelStyles.js

@@ -1,13 +1,13 @@
 import { makeStyles } from '@material-ui/core';
 
-var useStyles = makeStyles(function (theme) { return ({
+const useStyles = makeStyles((theme) => ({
     buttonBox: {
         '& > :last-child': {
             marginLeft: theme.spacing(2),
         },
         display: 'flex',
         justifyContent: 'flex-end',
-        padding: "0px " + theme.spacing(3) + "px " + theme.spacing(3) + "px " + theme.spacing(3) + "px",
+        padding: `0px ${theme.spacing(3)}px ${theme.spacing(3)}px ${theme.spacing(3)}px`,
     },
     buttonLabel: {
         fontWeight: 400,
@@ -52,7 +52,7 @@ var useStyles = makeStyles(function (theme) { return ({
     selectInput: {
         margin: '8px 0',
     },
-}); });
+}));
 
 export { useStyles };
 //# sourceMappingURL=PanelStyles.js.map

package/build/esm/components/FilterPanel/Panel/PanelStyles.js.map

@@ -1 +1 @@
-{"version":3,"file":"PanelStyles.js","sources":["../../../../../src/components/FilterPanel/Panel/PanelStyles.ts"],"sourcesContent":["import { makeStyles, Theme } from '@material-ui/core'\n\nexport const useStyles = makeStyles<Theme>((theme) => ({\n  buttonBox: {\n    '& > :last-child': {\n      marginLeft: theme.spacing(2),\n    },\n    display: 'flex',\n    justifyContent: 'flex-end',\n    padding: `0px ${theme.spacing(3)}px ${theme.spacing(3)}px ${theme.spacing(3)}px`,\n  },\n  buttonLabel: {\n    fontWeight: 400,\n  },\n  filterPopoverContents: {\n    backgroundColor: 'white',\n    borderRadius: theme.spacing(1),\n    position: 'relative',\n    margin: '10px',\n    marginTop: theme.spacing(2),\n    width: '323px',\n    '&::before': {\n      backgroundColor: 'white',\n      borderRadius: theme.spacing(0.5),\n      content: '\"\"',\n      display: 'block',\n      filter: 'drop-shadow(4px 4px 3px rgba(0, 0, 0, 0.14)) drop-shadow(0px 1px 5px rgba(0, 0, 0, 0.12))',\n      position: 'absolute',\n      width: theme.spacing(2.5),\n      height: theme.spacing(2.5),\n      top: -7,\n      transform: 'rotate(45deg)',\n      left: 'calc(90% - 12px)',\n      zIndex: 0,\n    },\n    '&::after': {\n      backgroundColor: 'white',\n      content: '\"\"',\n      display: 'block',\n      position: 'absolute',\n      top: 0,\n      left: 'calc(80%)',\n      width: theme.spacing(6),\n      height: theme.spacing(4),\n    },\n  },\n  menuTitle: {\n    fontWeight: 400,\n    fontSize: '20px',\n    paddingBottom: theme.spacing(2),\n  },\n  selectInput: {\n    margin: '8px 0',\n  },\n}))\n"],"names":[],"mappings":";;AAEa,IAAA,SAAS,GAAG,UAAU,CAAQ,UAAC,KAAK,EAAK,EAAA,QAAC;AACrD,IAAA,SAAS,EAAE;AACT,QAAA,iBAAiB,EAAE;AACjB,YAAA,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;AAC7B,SAAA;AACD,QAAA,OAAO,EAAE,MAAM;AACf,QAAA,cAAc,EAAE,UAAU;QAC1B,OAAO,EAAE,SAAO,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,GAAA,KAAA,GAAM,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,GAAM,KAAA,GAAA,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,GAAI,IAAA;AACjF,KAAA;AACD,IAAA,WAAW,EAAE;AACX,QAAA,UAAU,EAAE,GAAG;AAChB,KAAA;AACD,IAAA,qBAAqB,EAAE;AACrB,QAAA,eAAe,EAAE,OAAO;AACxB,QAAA,YAAY,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;AAC9B,QAAA,QAAQ,EAAE,UAAU;AACpB,QAAA,MAAM,EAAE,MAAM;AACd,QAAA,SAAS,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;AAC3B,QAAA,KAAK,EAAE,OAAO;AACd,QAAA,WAAW,EAAE;AACX,YAAA,eAAe,EAAE,OAAO;AACxB,YAAA,YAAY,EAAE,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC;AAChC,YAAA,OAAO,EAAE,IAAI;AACb,YAAA,OAAO,EAAE,OAAO;AAChB,YAAA,MAAM,EAAE,2FAA2F;AACnG,YAAA,QAAQ,EAAE,UAAU;AACpB,YAAA,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC;AACzB,YAAA,MAAM,EAAE,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC;YAC1B,GAAG,EAAE,EAAE;AACP,YAAA,SAAS,EAAE,eAAe;AAC1B,YAAA,IAAI,EAAE,kBAAkB;AACxB,YAAA,MAAM,EAAE,CAAC;AACV,SAAA;AACD,QAAA,UAAU,EAAE;AACV,YAAA,eAAe,EAAE,OAAO;AACxB,YAAA,OAAO,EAAE,IAAI;AACb,YAAA,OAAO,EAAE,OAAO;AAChB,YAAA,QAAQ,EAAE,UAAU;AACpB,YAAA,GAAG,EAAE,CAAC;AACN,YAAA,IAAI,EAAE,WAAW;AACjB,YAAA,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;AACvB,YAAA,MAAM,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;AACzB,SAAA;AACF,KAAA;AACD,IAAA,SAAS,EAAE;AACT,QAAA,UAAU,EAAE,GAAG;AACf,QAAA,QAAQ,EAAE,MAAM;AAChB,QAAA,aAAa,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;AAChC,KAAA;AACD,IAAA,WAAW,EAAE;AACX,QAAA,MAAM,EAAE,OAAO;AAChB,KAAA;CACF,EAAC,EAAA;;;;"}
+{"version":3,"file":"PanelStyles.js","sources":["../../../../../src/components/FilterPanel/Panel/PanelStyles.ts"],"sourcesContent":["import { makeStyles, Theme } from '@material-ui/core'\n\nexport const useStyles = makeStyles<Theme>((theme) => ({\n  buttonBox: {\n    '& > :last-child': {\n      marginLeft: theme.spacing(2),\n    },\n    display: 'flex',\n    justifyContent: 'flex-end',\n    padding: `0px ${theme.spacing(3)}px ${theme.spacing(3)}px ${theme.spacing(3)}px`,\n  },\n  buttonLabel: {\n    fontWeight: 400,\n  },\n  filterPopoverContents: {\n    backgroundColor: 'white',\n    borderRadius: theme.spacing(1),\n    position: 'relative',\n    margin: '10px',\n    marginTop: theme.spacing(2),\n    width: '323px',\n    '&::before': {\n      backgroundColor: 'white',\n      borderRadius: theme.spacing(0.5),\n      content: '\"\"',\n      display: 'block',\n      filter: 'drop-shadow(4px 4px 3px rgba(0, 0, 0, 0.14)) drop-shadow(0px 1px 5px rgba(0, 0, 0, 0.12))',\n      position: 'absolute',\n      width: theme.spacing(2.5),\n      height: theme.spacing(2.5),\n      top: -7,\n      transform: 'rotate(45deg)',\n      left: 'calc(90% - 12px)',\n      zIndex: 0,\n    },\n    '&::after': {\n      backgroundColor: 'white',\n      content: '\"\"',\n      display: 'block',\n      position: 'absolute',\n      top: 0,\n      left: 'calc(80%)',\n      width: theme.spacing(6),\n      height: theme.spacing(4),\n    },\n  },\n  menuTitle: {\n    fontWeight: 400,\n    fontSize: '20px',\n    paddingBottom: theme.spacing(2),\n  },\n  selectInput: {\n    margin: '8px 0',\n  },\n}))\n"],"names":[],"mappings":";;AAEa,MAAA,SAAS,GAAG,UAAU,CAAQ,CAAC,KAAK,MAAM;AACrD,IAAA,SAAS,EAAE;AACT,QAAA,iBAAiB,EAAE;AACjB,YAAA,UAAU,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;AAC7B,SAAA;AACD,QAAA,OAAO,EAAE,MAAM;AACf,QAAA,cAAc,EAAE,UAAU;QAC1B,OAAO,EAAE,OAAO,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAA,GAAA,EAAM,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAM,GAAA,EAAA,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAI,EAAA,CAAA;AACjF,KAAA;AACD,IAAA,WAAW,EAAE;AACX,QAAA,UAAU,EAAE,GAAG;AAChB,KAAA;AACD,IAAA,qBAAqB,EAAE;AACrB,QAAA,eAAe,EAAE,OAAO;AACxB,QAAA,YAAY,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;AAC9B,QAAA,QAAQ,EAAE,UAAU;AACpB,QAAA,MAAM,EAAE,MAAM;AACd,QAAA,SAAS,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;AAC3B,QAAA,KAAK,EAAE,OAAO;AACd,QAAA,WAAW,EAAE;AACX,YAAA,eAAe,EAAE,OAAO;AACxB,YAAA,YAAY,EAAE,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC;AAChC,YAAA,OAAO,EAAE,IAAI;AACb,YAAA,OAAO,EAAE,OAAO;AAChB,YAAA,MAAM,EAAE,2FAA2F;AACnG,YAAA,QAAQ,EAAE,UAAU;AACpB,YAAA,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC;AACzB,YAAA,MAAM,EAAE,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC;YAC1B,GAAG,EAAE,EAAE;AACP,YAAA,SAAS,EAAE,eAAe;AAC1B,YAAA,IAAI,EAAE,kBAAkB;AACxB,YAAA,MAAM,EAAE,CAAC;AACV,SAAA;AACD,QAAA,UAAU,EAAE;AACV,YAAA,eAAe,EAAE,OAAO;AACxB,YAAA,OAAO,EAAE,IAAI;AACb,YAAA,OAAO,EAAE,OAAO;AAChB,YAAA,QAAQ,EAAE,UAAU;AACpB,YAAA,GAAG,EAAE,CAAC;AACN,YAAA,IAAI,EAAE,WAAW;AACjB,YAAA,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;AACvB,YAAA,MAAM,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;AACzB,SAAA;AACF,KAAA;AACD,IAAA,SAAS,EAAE;AACT,QAAA,UAAU,EAAE,GAAG;AACf,QAAA,QAAQ,EAAE,MAAM;AAChB,QAAA,aAAa,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;AAChC,KAAA;AACD,IAAA,WAAW,EAAE;AACX,QAAA,MAAM,EAAE,OAAO;AAChB,KAAA;AACF,CAAA,CAAC;;;;"}

package/build/esm/components/FilterPanel/Trigger/Trigger.d.ts

@@ -1,5 +1,5 @@
 import { SyntheticEvent } from 'react';
-declare type FitlerPanelTriggerProps = {
+type FitlerPanelTriggerProps = {
     onClick: (event: SyntheticEvent) => void;
     label?: string;
 };

package/build/esm/components/FilterPanel/Trigger/Trigger.js

@@ -4,9 +4,9 @@ import { Button } from '@popmenu/admin-ui';
 import { Filter } from '@popmenu/web-icons';
 import { useStyles } from './TriggerStyles.js';
 
-var Trigger = function (props) {
-    var _a = props.label, label = _a === void 0 ? 'Filter' : _a, onClick = props.onClick;
-    var classes = useStyles();
+const Trigger = (props) => {
+    const { label = 'Filter', onClick } = props;
+    const classes = useStyles();
     return (React.createElement(Button, { className: classes.root, onClick: onClick, startIcon: React.createElement(Icon, { icon: Filter }), textTransform: "none", variant: "ghost" }, label));
 };
 

package/build/esm/components/FilterPanel/Trigger/Trigger.js.map

@@ -1 +1 @@
-{"version":3,"file":"Trigger.js","sources":["../../../../../src/components/FilterPanel/Trigger/Trigger.tsx"],"sourcesContent":["import React, { SyntheticEvent } from 'react'\nimport { Icon } from '@popmenu/common-ui'\nimport { Button } from '@popmenu/admin-ui'\nimport { Filter } from '@popmenu/web-icons'\nimport { useStyles } from './TriggerStyles'\n\ntype FitlerPanelTriggerProps = {\n  onClick: (event: SyntheticEvent) => void\n  label?: string\n}\n\nexport const Trigger = (props: FitlerPanelTriggerProps) => {\n  const { label = 'Filter', onClick } = props\n  const classes = useStyles()\n  return (\n    <Button\n      className={classes.root}\n      onClick={onClick}\n      startIcon={<Icon icon={Filter} />}\n      textTransform=\"none\"\n      variant=\"ghost\"\n    >\n      {label}\n    </Button>\n  )\n}\n"],"names":[],"mappings":";;;;;;AAWO,IAAM,OAAO,GAAG,UAAC,KAA8B,EAAA;AAC5C,IAAA,IAAA,EAA8B,GAAA,KAAK,CAAnB,KAAA,EAAhB,KAAK,GAAA,EAAA,KAAA,MAAA,GAAG,QAAQ,GAAA,EAAA,EAAE,OAAO,GAAK,KAAK,QAAV;AACjC,IAAA,IAAM,OAAO,GAAG,SAAS,EAAE;AAC3B,IAAA,QACE,KAAA,CAAA,aAAA,CAAC,MAAM,EAAA,EACL,SAAS,EAAE,OAAO,CAAC,IAAI,EACvB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,KAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,IAAI,EAAE,MAAM,EAAI,CAAA,EACjC,aAAa,EAAC,MAAM,EACpB,OAAO,EAAC,OAAO,EAAA,EAEd,KAAK,CACC;AAEb;;;;"}
+{"version":3,"file":"Trigger.js","sources":["../../../../../src/components/FilterPanel/Trigger/Trigger.tsx"],"sourcesContent":["import React, { SyntheticEvent } from 'react'\nimport { Icon } from '@popmenu/common-ui'\nimport { Button } from '@popmenu/admin-ui'\nimport { Filter } from '@popmenu/web-icons'\nimport { useStyles } from './TriggerStyles'\n\ntype FitlerPanelTriggerProps = {\n  onClick: (event: SyntheticEvent) => void\n  label?: string\n}\n\nexport const Trigger = (props: FitlerPanelTriggerProps) => {\n  const { label = 'Filter', onClick } = props\n  const classes = useStyles()\n  return (\n    <Button\n      className={classes.root}\n      onClick={onClick}\n      startIcon={<Icon icon={Filter} />}\n      textTransform=\"none\"\n      variant=\"ghost\"\n    >\n      {label}\n    </Button>\n  )\n}\n"],"names":[],"mappings":";;;;;;AAWa,MAAA,OAAO,GAAG,CAAC,KAA8B,KAAI;IACxD,MAAM,EAAE,KAAK,GAAG,QAAQ,EAAE,OAAO,EAAE,GAAG,KAAK;AAC3C,IAAA,MAAM,OAAO,GAAG,SAAS,EAAE;AAC3B,IAAA,QACE,KAAA,CAAA,aAAA,CAAC,MAAM,EAAA,EACL,SAAS,EAAE,OAAO,CAAC,IAAI,EACvB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,KAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,IAAI,EAAE,MAAM,EAAI,CAAA,EACjC,aAAa,EAAC,MAAM,EACpB,OAAO,EAAC,OAAO,EAAA,EAEd,KAAK,CACC;AAEb;;;;"}

package/build/esm/components/FilterPanel/Trigger/TriggerStyles.js

@@ -1,6 +1,6 @@
 import { makeStyles } from '@material-ui/core';
 
-var useStyles = makeStyles({
+const useStyles = makeStyles({
     root: {
         justifySelf: 'end',
         gridArea: 'columnFilter',

package/build/esm/components/FilterPanel/Trigger/TriggerStyles.js.map

@@ -1 +1 @@
-{"version":3,"file":"TriggerStyles.js","sources":["../../../../../src/components/FilterPanel/Trigger/TriggerStyles.ts"],"sourcesContent":["import { makeStyles } from '@material-ui/core'\n\nexport const useStyles = makeStyles({\n  root: {\n    justifySelf: 'end',\n    gridArea: 'columnFilter',\n  },\n})\n"],"names":[],"mappings":";;AAEO,IAAM,SAAS,GAAG,UAAU,CAAC;AAClC,IAAA,IAAI,EAAE;AACJ,QAAA,WAAW,EAAE,KAAK;AAClB,QAAA,QAAQ,EAAE,cAAc;AACzB,KAAA;AACF,CAAA;;;;"}
+{"version":3,"file":"TriggerStyles.js","sources":["../../../../../src/components/FilterPanel/Trigger/TriggerStyles.ts"],"sourcesContent":["import { makeStyles } from '@material-ui/core'\n\nexport const useStyles = makeStyles({\n  root: {\n    justifySelf: 'end',\n    gridArea: 'columnFilter',\n  },\n})\n"],"names":[],"mappings":";;AAEO,MAAM,SAAS,GAAG,UAAU,CAAC;AAClC,IAAA,IAAI,EAAE;AACJ,QAAA,WAAW,EAAE,KAAK;AAClB,QAAA,QAAQ,EAAE,cAAc;AACzB,KAAA;AACF,CAAA;;;;"}

package/build/esm/components/GlobalFilter/GlobalFilter.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { GlobalFilterProps } from './GlobalFilterProps';
 export declare const GlobalFilter: (props: GlobalFilterProps) => JSX.Element;

package/build/esm/components/GlobalFilter/GlobalFilter.js

@@ -1,20 +1,19 @@
-import { __rest, __assign } from 'tslib';
 import React from 'react';
 import { TextField, InputAdornment } from '@material-ui/core';
 import { Icon } from '@popmenu/common-ui';
 import { Search } from '@popmenu/web-icons';
 import { useStyles } from './GlobalFilterStyles.js';
 
-var GlobalFilter = function (props) {
-    var value = props.value, setValue = props.setValue, restProps = __rest(props, ["value", "setValue"]);
-    var classes = useStyles();
-    var handleChange = function (e) {
+const GlobalFilter = (props) => {
+    const { value, setValue, ...restProps } = props;
+    const classes = useStyles();
+    const handleChange = (e) => {
         setValue(e.target.value);
     };
-    return (React.createElement(TextField, __assign({ className: classes.root, variant: "outlined", value: value, onChange: handleChange, InputProps: {
+    return (React.createElement(TextField, { className: classes.root, variant: "outlined", value: value, onChange: handleChange, InputProps: {
             startAdornment: (React.createElement(InputAdornment, { position: "start" },
                 React.createElement(Icon, { icon: Search }))),
-        } }, restProps)));
+        }, ...restProps }));
 };
 
 export { GlobalFilter };

package/build/esm/components/GlobalFilter/GlobalFilter.js.map

@@ -1 +1 @@
-{"version":3,"file":"GlobalFilter.js","sources":["../../../../src/components/GlobalFilter/GlobalFilter.tsx"],"sourcesContent":["import React, { ChangeEventHandler } from 'react'\nimport { InputAdornment, TextField } from '@material-ui/core'\n\nimport { Icon } from '@popmenu/common-ui'\nimport { Search } from '@popmenu/web-icons'\nimport { useStyles } from './GlobalFilterStyles'\nimport { GlobalFilterProps } from './GlobalFilterProps'\n\nexport const GlobalFilter = (props: GlobalFilterProps) => {\n  const { value, setValue, ...restProps } = props\n  const classes = useStyles()\n  const handleChange: ChangeEventHandler<HTMLInputElement> = (e) => {\n    setValue(e.target.value)\n  }\n  return (\n    <TextField\n      className={classes.root}\n      variant=\"outlined\"\n      value={value}\n      onChange={handleChange}\n      InputProps={{\n        startAdornment: (\n          <InputAdornment position=\"start\">\n            <Icon icon={Search} />\n          </InputAdornment>\n        ),\n      }}\n      {...restProps}\n    />\n  )\n}\n"],"names":[],"mappings":";;;;;;;AAQO,IAAM,YAAY,GAAG,UAAC,KAAwB,EAAA;AAC3C,IAAA,IAAA,KAAK,GAA6B,KAAK,CAAlC,KAAA,EAAE,QAAQ,GAAmB,KAAK,CAAxB,QAAA,EAAK,SAAS,GAAK,MAAA,CAAA,KAAK,EAAzC,CAAA,OAAA,EAAA,UAAA,CAAiC,CAAF;AACrC,IAAA,IAAM,OAAO,GAAG,SAAS,EAAE;IAC3B,IAAM,YAAY,GAAyC,UAAC,CAAC,EAAA;AAC3D,QAAA,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;AAC1B,KAAC;IACD,QACE,oBAAC,SAAS,EAAA,QAAA,CAAA,EACR,SAAS,EAAE,OAAO,CAAC,IAAI,EACvB,OAAO,EAAC,UAAU,EAClB,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,YAAY,EACtB,UAAU,EAAE;AACV,YAAA,cAAc,GACZ,KAAA,CAAA,aAAA,CAAC,cAAc,EAAC,EAAA,QAAQ,EAAC,OAAO,EAAA;AAC9B,gBAAA,KAAA,CAAA,aAAA,CAAC,IAAI,EAAC,EAAA,IAAI,EAAE,MAAM,EAAA,CAAI,CACP,CAClB;SACF,EACG,EAAA,SAAS,CACb,CAAA;AAEN;;;;"}
+{"version":3,"file":"GlobalFilter.js","sources":["../../../../src/components/GlobalFilter/GlobalFilter.tsx"],"sourcesContent":["import React, { ChangeEventHandler } from 'react'\nimport { InputAdornment, TextField } from '@material-ui/core'\n\nimport { Icon } from '@popmenu/common-ui'\nimport { Search } from '@popmenu/web-icons'\nimport { useStyles } from './GlobalFilterStyles'\nimport { GlobalFilterProps } from './GlobalFilterProps'\n\nexport const GlobalFilter = (props: GlobalFilterProps) => {\n  const { value, setValue, ...restProps } = props\n  const classes = useStyles()\n  const handleChange: ChangeEventHandler<HTMLInputElement> = (e) => {\n    setValue(e.target.value)\n  }\n  return (\n    <TextField\n      className={classes.root}\n      variant=\"outlined\"\n      value={value}\n      onChange={handleChange}\n      InputProps={{\n        startAdornment: (\n          <InputAdornment position=\"start\">\n            <Icon icon={Search} />\n          </InputAdornment>\n        ),\n      }}\n      {...restProps}\n    />\n  )\n}\n"],"names":[],"mappings":";;;;;;AAQa,MAAA,YAAY,GAAG,CAAC,KAAwB,KAAI;IACvD,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK;AAC/C,IAAA,MAAM,OAAO,GAAG,SAAS,EAAE;AAC3B,IAAA,MAAM,YAAY,GAAyC,CAAC,CAAC,KAAI;AAC/D,QAAA,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;AAC1B,KAAC;IACD,QACE,oBAAC,SAAS,EAAA,EACR,SAAS,EAAE,OAAO,CAAC,IAAI,EACvB,OAAO,EAAC,UAAU,EAClB,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,YAAY,EACtB,UAAU,EAAE;AACV,YAAA,cAAc,GACZ,KAAA,CAAA,aAAA,CAAC,cAAc,EAAC,EAAA,QAAQ,EAAC,OAAO,EAAA;AAC9B,gBAAA,KAAA,CAAA,aAAA,CAAC,IAAI,EAAC,EAAA,IAAI,EAAE,MAAM,EAAA,CAAI,CACP,CAClB;SACF,EACG,GAAA,SAAS,EACb,CAAA;AAEN;;;;"}

package/build/esm/components/GlobalFilter/GlobalFilterStyles.js

@@ -1,6 +1,6 @@
 import { makeStyles } from '@material-ui/core';
 
-var useStyles = makeStyles({
+const useStyles = makeStyles({
     root: {
         justifySelf: 'start',
         maxWidth: 300,

package/build/esm/components/GlobalFilter/GlobalFilterStyles.js.map

@@ -1 +1 @@
-{"version":3,"file":"GlobalFilterStyles.js","sources":["../../../../src/components/GlobalFilter/GlobalFilterStyles.ts"],"sourcesContent":["import { makeStyles } from '@material-ui/core'\n\nexport const useStyles = makeStyles({\n  root: {\n    justifySelf: 'start',\n    maxWidth: 300,\n    minWidth: 200,\n    width: '100%',\n    gridArea: 'globalFilter',\n  },\n})\n"],"names":[],"mappings":";;AAEO,IAAM,SAAS,GAAG,UAAU,CAAC;AAClC,IAAA,IAAI,EAAE;AACJ,QAAA,WAAW,EAAE,OAAO;AACpB,QAAA,QAAQ,EAAE,GAAG;AACb,QAAA,QAAQ,EAAE,GAAG;AACb,QAAA,KAAK,EAAE,MAAM;AACb,QAAA,QAAQ,EAAE,cAAc;AACzB,KAAA;AACF,CAAA;;;;"}
+{"version":3,"file":"GlobalFilterStyles.js","sources":["../../../../src/components/GlobalFilter/GlobalFilterStyles.ts"],"sourcesContent":["import { makeStyles } from '@material-ui/core'\n\nexport const useStyles = makeStyles({\n  root: {\n    justifySelf: 'start',\n    maxWidth: 300,\n    minWidth: 200,\n    width: '100%',\n    gridArea: 'globalFilter',\n  },\n})\n"],"names":[],"mappings":";;AAEO,MAAM,SAAS,GAAG,UAAU,CAAC;AAClC,IAAA,IAAI,EAAE;AACJ,QAAA,WAAW,EAAE,OAAO;AACpB,QAAA,QAAQ,EAAE,GAAG;AACb,QAAA,QAAQ,EAAE,GAAG;AACb,QAAA,KAAK,EAAE,MAAM;AACb,QAAA,QAAQ,EAAE,cAAc;AACzB,KAAA;AACF,CAAA;;;;"}

package/build/esm/components/GlobalFilter/index.d.ts

@@ -1,2 +1,2 @@
 export { GlobalFilter } from './GlobalFilter';
-export { GlobalFilterProps } from './GlobalFilterProps';
+export type { GlobalFilterProps } from './GlobalFilterProps';

package/build/esm/components/RowActions/RowActions.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { RowActionsProps } from './RowActionsProps';
 export declare const RowActions: (props: RowActionsProps) => JSX.Element;

package/build/esm/components/RowActions/RowActions.js

@@ -1,41 +1,37 @@
-import { __rest, __assign } from 'tslib';
 import React from 'react';
 import { More } from '@popmenu/web-icons';
 import { Box, Tooltip, IconButton, Icon, Menu, MenuItem } from '@popmenu/common-ui';
 import { validateAction } from '../../util/validateRowAction.js';
 
-var RowActions = function (props) {
-    var context = props.context, actions = props.actions;
-    var validActions = actions.filter(validateAction);
-    var _a = React.useState(null), anchorEl = _a[0], setAnchorEl = _a[1];
-    var openMenu = function (event) {
+const RowActions = (props) => {
+    const { context, actions } = props;
+    const validActions = actions.filter(validateAction);
+    const [anchorEl, setAnchorEl] = React.useState(null);
+    const openMenu = (event) => {
         setAnchorEl(event.currentTarget);
     };
-    var closeMenu = function () {
+    const closeMenu = () => {
         setAnchorEl(null);
     };
-    var actionsCount = validActions.length;
-    var mainActions;
-    var overflowActions;
+    const actionsCount = validActions.length;
+    let mainActions;
+    let overflowActions;
     if (actionsCount <= 3) {
         mainActions = validActions;
     }
     else {
-        var firstAction = validActions[0], secondAction = validActions[1], restActions = validActions.slice(2);
+        const [firstAction, secondAction, ...restActions] = validActions;
         mainActions = [firstAction, secondAction];
         overflowActions = restActions;
     }
     return (React.createElement(Box, { display: "flex" },
-        mainActions.map(function (_a) {
-            var label = _a.label, onClick = _a.onClick, icon = _a.icon, restProps = __rest(_a, ["label", "onClick", "icon"]);
-            return (React.createElement(Tooltip, { title: label, key: label },
-                React.createElement(IconButton, __assign({ size: "small", onClick: function () { return onClick(context); } }, restProps),
-                    React.createElement(Icon, { icon: icon }))));
-        }),
+        mainActions.map(({ label, onClick, icon, ...restProps }) => (React.createElement(Tooltip, { title: label, key: label },
+            React.createElement(IconButton, { size: "small", onClick: () => onClick(context), ...restProps },
+                React.createElement(Icon, { icon: icon }))))),
         overflowActions && (React.createElement(React.Fragment, null,
             React.createElement(IconButton, { size: "small", onClick: openMenu },
                 React.createElement(Icon, { icon: More })),
-            React.createElement(Menu, { anchorEl: anchorEl, open: Boolean(anchorEl), onClose: closeMenu }, overflowActions.map(function (action) { return (React.createElement(MenuItem, { key: action.label, onClick: function () { return action.onClick(context); } }, action.label)); }))))));
+            React.createElement(Menu, { anchorEl: anchorEl, open: Boolean(anchorEl), onClose: closeMenu }, overflowActions.map((action) => (React.createElement(MenuItem, { key: action.label, onClick: () => action.onClick(context) }, action.label))))))));
 };
 
 export { RowActions };

package/build/esm/components/RowActions/RowActions.js.map

@@ -1 +1 @@
-{"version":3,"file":"RowActions.js","sources":["../../../../src/components/RowActions/RowActions.tsx"],"sourcesContent":["import React, { MouseEvent } from 'react'\nimport { More } from '@popmenu/web-icons'\nimport { RowActionsProps } from './RowActionsProps'\nimport { Tooltip, IconButton, Icon, Box, Menu, MenuItem } from '@popmenu/common-ui'\n\nimport { validateAction } from '../../util/validateRowAction'\n\nexport const RowActions = (props: RowActionsProps) => {\n  const { context, actions } = props\n  const validActions = actions.filter(validateAction)\n  const [anchorEl, setAnchorEl] = React.useState<(EventTarget & Element) | null>(null)\n  const openMenu = (event: MouseEvent) => {\n    setAnchorEl(event.currentTarget)\n  }\n  const closeMenu = () => {\n    setAnchorEl(null)\n  }\n  const actionsCount = validActions.length\n  let mainActions\n  let overflowActions\n  if (actionsCount <= 3) {\n    mainActions = validActions\n  } else {\n    const [firstAction, secondAction, ...restActions] = validActions\n    mainActions = [firstAction, secondAction]\n    overflowActions = restActions\n  }\n\n  return (\n    <Box display=\"flex\">\n      {mainActions.map(({ label, onClick, icon, ...restProps }) => (\n        <Tooltip title={label} key={label}>\n          <IconButton size=\"small\" onClick={() => onClick(context)} {...restProps}>\n            <Icon icon={icon} />\n          </IconButton>\n        </Tooltip>\n      ))}\n      {overflowActions && (\n        <>\n          <IconButton size=\"small\" onClick={openMenu}>\n            <Icon icon={More} />\n          </IconButton>\n          <Menu anchorEl={anchorEl} open={Boolean(anchorEl)} onClose={closeMenu}>\n            {overflowActions.map((action) => (\n              <MenuItem key={action.label} onClick={() => action.onClick(context)}>\n                {action.label}\n              </MenuItem>\n            ))}\n          </Menu>\n        </>\n      )}\n    </Box>\n  )\n}\n"],"names":[],"mappings":";;;;;;AAOO,IAAM,UAAU,GAAG,UAAC,KAAsB,EAAA;IACvC,IAAA,OAAO,GAAc,KAAK,CAAA,OAAnB,EAAE,OAAO,GAAK,KAAK,CAAA,OAAV;IACxB,IAAM,YAAY,GAAG,OAAO,CAAC,MAAM,CAAC,cAAc,CAAC;AAC7C,IAAA,IAAA,EAA0B,GAAA,KAAK,CAAC,QAAQ,CAAiC,IAAI,CAAC,EAA7E,QAAQ,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,WAAW,QAAwD;IACpF,IAAM,QAAQ,GAAG,UAAC,KAAiB,EAAA;AACjC,QAAA,WAAW,CAAC,KAAK,CAAC,aAAa,CAAC;AAClC,KAAC;AACD,IAAA,IAAM,SAAS,GAAG,YAAA;QAChB,WAAW,CAAC,IAAI,CAAC;AACnB,KAAC;AACD,IAAA,IAAM,YAAY,GAAG,YAAY,CAAC,MAAM;AACxC,IAAA,IAAI,WAAW;AACf,IAAA,IAAI,eAAe;IACnB,IAAI,YAAY,IAAI,CAAC,EAAE;QACrB,WAAW,GAAG,YAAY;AAC3B;AAAM,SAAA;AACE,QAAA,IAAA,WAAW,GAAkC,YAAY,CAAA,CAAA,CAA9C,EAAE,YAAY,GAAoB,YAAY,CAAA,CAAA,CAAhC,EAAK,WAAW,GAAI,YAAY,SAAhB;AAChD,QAAA,WAAW,GAAG,CAAC,WAAW,EAAE,YAAY,CAAC;QACzC,eAAe,GAAG,WAAW;AAC9B;AAED,IAAA,QACE,KAAC,CAAA,aAAA,CAAA,GAAG,EAAC,EAAA,OAAO,EAAC,MAAM,EAAA;AAChB,QAAA,WAAW,CAAC,GAAG,CAAC,UAAC,EAAsC,EAAA;AAApC,YAAA,IAAA,KAAK,GAAA,EAAA,CAAA,KAAA,EAAE,OAAO,GAAA,EAAA,CAAA,OAAA,EAAE,IAAI,GAAA,EAAA,CAAA,IAAA,EAAK,SAAS,GAApC,MAAA,CAAA,EAAA,EAAA,CAAA,OAAA,EAAA,SAAA,EAAA,MAAA,CAAsC,CAAF;YAAO,QAC3D,KAAC,CAAA,aAAA,CAAA,OAAO,EAAC,EAAA,KAAK,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK,EAAA;AAC/B,gBAAA,KAAA,CAAA,aAAA,CAAC,UAAU,EAAC,QAAA,CAAA,EAAA,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,YAAM,EAAA,OAAA,OAAO,CAAC,OAAO,CAAC,CAAhB,EAAgB,IAAM,SAAS,CAAA;oBACrE,KAAC,CAAA,aAAA,CAAA,IAAI,IAAC,IAAI,EAAE,IAAI,EAAI,CAAA,CACT,CACL;SACX,CAAC;AACD,QAAA,eAAe,KACd,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA;YACE,KAAC,CAAA,aAAA,CAAA,UAAU,IAAC,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,QAAQ,EAAA;AACxC,gBAAA,KAAA,CAAA,aAAA,CAAC,IAAI,EAAC,EAAA,IAAI,EAAE,IAAI,GAAI,CACT;AACb,YAAA,KAAA,CAAA,aAAA,CAAC,IAAI,EAAA,EAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,EAAE,OAAO,CAAC,QAAQ,CAAC,EAAE,OAAO,EAAE,SAAS,EAClE,EAAA,eAAe,CAAC,GAAG,CAAC,UAAC,MAAM,EAAA,EAAK,QAC/B,KAAC,CAAA,aAAA,CAAA,QAAQ,EAAC,EAAA,GAAG,EAAE,MAAM,CAAC,KAAK,EAAE,OAAO,EAAE,YAAA,EAAM,OAAA,MAAM,CAAC,OAAO,CAAC,OAAO,CAAC,CAAA,EAAA,EAAA,EAChE,MAAM,CAAC,KAAK,CACJ,EACZ,EAAA,CAAC,CACG,CACN,CACJ,CACG;AAEV;;;;"}
+{"version":3,"file":"RowActions.js","sources":["../../../../src/components/RowActions/RowActions.tsx"],"sourcesContent":["import React, { MouseEvent } from 'react'\nimport { More } from '@popmenu/web-icons'\nimport { RowActionsProps } from './RowActionsProps'\nimport { Tooltip, IconButton, Icon, Box, Menu, MenuItem } from '@popmenu/common-ui'\n\nimport { validateAction } from '../../util/validateRowAction'\n\nexport const RowActions = (props: RowActionsProps) => {\n  const { context, actions } = props\n  const validActions = actions.filter(validateAction)\n  const [anchorEl, setAnchorEl] = React.useState<(EventTarget & Element) | null>(null)\n  const openMenu = (event: MouseEvent) => {\n    setAnchorEl(event.currentTarget)\n  }\n  const closeMenu = () => {\n    setAnchorEl(null)\n  }\n  const actionsCount = validActions.length\n  let mainActions\n  let overflowActions\n  if (actionsCount <= 3) {\n    mainActions = validActions\n  } else {\n    const [firstAction, secondAction, ...restActions] = validActions\n    mainActions = [firstAction, secondAction]\n    overflowActions = restActions\n  }\n\n  return (\n    <Box display=\"flex\">\n      {mainActions.map(({ label, onClick, icon, ...restProps }) => (\n        <Tooltip title={label} key={label}>\n          <IconButton size=\"small\" onClick={() => onClick(context)} {...restProps}>\n            <Icon icon={icon} />\n          </IconButton>\n        </Tooltip>\n      ))}\n      {overflowActions && (\n        <>\n          <IconButton size=\"small\" onClick={openMenu}>\n            <Icon icon={More} />\n          </IconButton>\n          <Menu anchorEl={anchorEl} open={Boolean(anchorEl)} onClose={closeMenu}>\n            {overflowActions.map((action) => (\n              <MenuItem key={action.label} onClick={() => action.onClick(context)}>\n                {action.label}\n              </MenuItem>\n            ))}\n          </Menu>\n        </>\n      )}\n    </Box>\n  )\n}\n"],"names":[],"mappings":";;;;;AAOa,MAAA,UAAU,GAAG,CAAC,KAAsB,KAAI;AACnD,IAAA,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,KAAK;IAClC,MAAM,YAAY,GAAG,OAAO,CAAC,MAAM,CAAC,cAAc,CAAC;AACnD,IAAA,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAiC,IAAI,CAAC;AACpF,IAAA,MAAM,QAAQ,GAAG,CAAC,KAAiB,KAAI;AACrC,QAAA,WAAW,CAAC,KAAK,CAAC,aAAa,CAAC;AAClC,KAAC;IACD,MAAM,SAAS,GAAG,MAAK;QACrB,WAAW,CAAC,IAAI,CAAC;AACnB,KAAC;AACD,IAAA,MAAM,YAAY,GAAG,YAAY,CAAC,MAAM;AACxC,IAAA,IAAI,WAAW;AACf,IAAA,IAAI,eAAe;AACnB,IAAA,IAAI,YAAY,IAAI,CAAC,EAAE;QACrB,WAAW,GAAG,YAAY;;SACrB;QACL,MAAM,CAAC,WAAW,EAAE,YAAY,EAAE,GAAG,WAAW,CAAC,GAAG,YAAY;AAChE,QAAA,WAAW,GAAG,CAAC,WAAW,EAAE,YAAY,CAAC;QACzC,eAAe,GAAG,WAAW;;AAG/B,IAAA,QACE,KAAC,CAAA,aAAA,CAAA,GAAG,EAAC,EAAA,OAAO,EAAC,MAAM,EAAA;QAChB,WAAW,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,GAAG,SAAS,EAAE,MACtD,KAAA,CAAA,aAAA,CAAC,OAAO,EAAA,EAAC,KAAK,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK,EAAA;AAC/B,YAAA,KAAA,CAAA,aAAA,CAAC,UAAU,EAAC,EAAA,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,MAAM,OAAO,CAAC,OAAO,CAAC,KAAM,SAAS,EAAA;gBACrE,KAAC,CAAA,aAAA,CAAA,IAAI,IAAC,IAAI,EAAE,IAAI,EAAI,CAAA,CACT,CACL,CACX,CAAC;AACD,QAAA,eAAe,KACd,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA;YACE,KAAC,CAAA,aAAA,CAAA,UAAU,IAAC,IAAI,EAAC,OAAO,EAAC,OAAO,EAAE,QAAQ,EAAA;AACxC,gBAAA,KAAA,CAAA,aAAA,CAAC,IAAI,EAAC,EAAA,IAAI,EAAE,IAAI,GAAI,CACT;YACb,KAAC,CAAA,aAAA,CAAA,IAAI,EAAC,EAAA,QAAQ,EAAE,QAAQ,EAAE,IAAI,EAAE,OAAO,CAAC,QAAQ,CAAC,EAAE,OAAO,EAAE,SAAS,EAAA,EAClE,eAAe,CAAC,GAAG,CAAC,CAAC,MAAM,MAC1B,KAAC,CAAA,aAAA,CAAA,QAAQ,EAAC,EAAA,GAAG,EAAE,MAAM,CAAC,KAAK,EAAE,OAAO,EAAE,MAAM,MAAM,CAAC,OAAO,CAAC,OAAO,CAAC,EAChE,EAAA,MAAM,CAAC,KAAK,CACJ,CACZ,CAAC,CACG,CACN,CACJ,CACG;AAEV;;;;"}

package/build/esm/components/RowActions/index.d.ts

@@ -1,2 +1,2 @@
 export { RowActions } from './RowActions';
-export { RowActionsProps } from './RowActionsProps';
+export type { RowActionsProps } from './RowActionsProps';

package/build/esm/components/Table/Table.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { TableProps } from './TableProps';
 export declare const Table: <T>({ title, data, columns, enableSortingRemoval, fullWidth, loading, searchable, sortable, filterState: externalFilterState, globalFilterState: externalGlobalFilterState, paginationState: externalPaginationState, sortingState: externalSortingState, visibilityState: externalVisibilityState, paginated, pageCount, GlobalFilterProps, Empty, idBase, stageFilterSelections, }: TableProps<T>) => JSX.Element;

package/build/esm/components/Table/Table.js

@@ -1,84 +1,104 @@
-import { __assign } from 'tslib';
-import React, { useRef, isValidElement, createElement } from 'react';
 import { Typography } from '@material-ui/core';
 import { Pagination } from '@material-ui/lab';
 import { Box, CircularProgress } from '@popmenu/common-ui';
-import { useReactTable, getFilteredRowModel, getSortedRowModel, getCoreRowModel, getPaginationRowModel, flexRender } from '@tanstack/react-table';
-import { TableRow } from '../TableRow/TableRow.js';
-import { TableCell } from '../TableCell/TableCell.js';
-import { TableBody } from '../TableBody/TableBody.js';
-import { useStyles } from './TableStyles.js';
-import { TableHeader } from '../TableHeader/TableHeader.js';
-import { TableFooter } from '../TableFooter/TableFooter.js';
-import { FilterPanel } from '../FilterPanel/FilterPanel.js';
-import { TableContext } from '../TableContext/index.js';
-import { GlobalFilter } from '../GlobalFilter/GlobalFilter.js';
-import { TableHeaderRow } from '../TableHeaderRow/TableHeaderRow.js';
-import { TableHeaderCell } from '../TableHeaderCell/TableHeaderCell.js';
+import { useReactTable, getPaginationRowModel, getFilteredRowModel, getSortedRowModel, getCoreRowModel, flexRender } from '@tanstack/react-table';
+import React, { useRef, isValidElement, createElement } from 'react';
 import { useColumnFilters } from '../../hooks/useColumnFilters.js';
 import { useStagedColumnFilters } from '../../hooks/useStagedColumnFilters.js';
-import { ColumnFilterChip } from '../ColumnFilterChip/ColumnFilterChip.js';
-import { TableControlsContainer } from '../TableControlsContainer/TableControlsContainer.js';
-import { ColumnFilterResetButton } from '../ColumnFilterResetButton/ColumnFilterResetButton.js';
 import { coercedValueIncludesString } from '../../util/coercedValueIncludesString.js';
 import { getTableMinHeight } from '../../util/getTableMinHeight.js';
+import { ColumnFilterChip } from '../ColumnFilterChip/ColumnFilterChip.js';
+import { ColumnFilterResetButton } from '../ColumnFilterResetButton/ColumnFilterResetButton.js';
+import { FilterPanel } from '../FilterPanel/FilterPanel.js';
+import { GlobalFilter } from '../GlobalFilter/GlobalFilter.js';
+import { TableBody } from '../TableBody/TableBody.js';
+import { TableCell } from '../TableCell/TableCell.js';
+import { TableContext } from '../TableContext/index.js';
+import { TableControlsContainer } from '../TableControlsContainer/TableControlsContainer.js';
+import { TableFooter } from '../TableFooter/TableFooter.js';
+import { TableHeader } from '../TableHeader/TableHeader.js';
+import { TableHeaderCell } from '../TableHeaderCell/TableHeaderCell.js';
+import { TableHeaderRow } from '../TableHeaderRow/TableHeaderRow.js';
+import { TableRow } from '../TableRow/TableRow.js';
+import { useStyles } from './TableStyles.js';
 
-var Table = function (_a) {
-    var title = _a.title, data = _a.data, columns = _a.columns, _b = _a.enableSortingRemoval, enableSortingRemoval = _b === void 0 ? true : _b, _c = _a.fullWidth, fullWidth = _c === void 0 ? true : _c, loading = _a.loading, _d = _a.searchable, searchable = _d === void 0 ? false : _d, _f = _a.sortable, sortable = _f === void 0 ? false : _f, externalFilterState = _a.filterState, externalGlobalFilterState = _a.globalFilterState, externalPaginationState = _a.paginationState, externalSortingState = _a.sortingState, externalVisibilityState = _a.visibilityState, _g = _a.paginated, paginated = _g === void 0 ? true : _g, pageCount = _a.pageCount, GlobalFilterProps = _a.GlobalFilterProps, Empty = _a.Empty, idBase = _a.idBase, stageFilterSelections = _a.stageFilterSelections;
-    var classes = useStyles({ fullWidth: fullWidth });
-    var rootRef = useRef(null);
+const Table = ({ title, data, columns, enableSortingRemoval = true, fullWidth = true, loading, searchable = false, sortable = false, filterState: externalFilterState, globalFilterState: externalGlobalFilterState, paginationState: externalPaginationState, sortingState: externalSortingState, visibilityState: externalVisibilityState, paginated = true, pageCount, GlobalFilterProps, Empty, idBase, stageFilterSelections, }) => {
+    const classes = useStyles({ fullWidth });
+    const rootRef = useRef(null);
     // Prepare Empty State
-    var isEmpty = data.length === 0;
-    var isEmptyComponentValid = Empty && isValidElement(createElement(Empty));
+    const isEmpty = data.length === 0;
+    const isEmptyComponentValid = Empty && isValidElement(createElement(Empty));
     // Prepare Sorting
-    var _h = externalSortingState || [], sorting = _h[0], setSorting = _h[1];
-    var isControlledColumnSort = Boolean(externalSortingState);
-    var controlledColumnSortOptions = { onSortingChange: setSorting, manualSorting: true };
+    const [sorting, setSorting] = externalSortingState || [];
+    const isControlledColumnSort = Boolean(externalSortingState);
+    const controlledColumnSortOptions = { onSortingChange: setSorting, manualSorting: true };
     // Prepare Global Filtering
-    var _j = externalGlobalFilterState || [], globalFilter = _j[0], setGlobalFilter = _j[1];
-    var isControlledGlobalFilter = Boolean(externalGlobalFilterState);
-    var controlledGlobalFilterOptions = { onGlobalFilterChange: setGlobalFilter, manualFiltering: true };
+    const [globalFilter, setGlobalFilter] = externalGlobalFilterState || [];
+    const isControlledGlobalFilter = Boolean(externalGlobalFilterState);
+    const controlledGlobalFilterOptions = { onGlobalFilterChange: setGlobalFilter, manualFiltering: true };
     // Prepare ColumnFiltering
-    var _k = externalFilterState || [], columnFilters = _k[0], setColumnFilters = _k[1];
-    var isControlledColumnFilters = Boolean(externalFilterState);
-    var controlledColumnFiltersOptions = { onColumnFiltersChange: setColumnFilters, manualFiltering: true };
+    const [columnFilters, setColumnFilters] = externalFilterState || [];
+    const isControlledColumnFilters = Boolean(externalFilterState);
+    const controlledColumnFiltersOptions = { onColumnFiltersChange: setColumnFilters, manualFiltering: true };
     // Prepare Pagination
-    var _l = externalPaginationState || [], pagination = _l[0], setPagination = _l[1];
-    var isControlledPagination = Boolean(externalPaginationState && pageCount);
-    var controlledPaginationOptions = { manualPagination: true, onPaginationChange: setPagination, pageCount: pageCount };
+    const [pagination, setPagination] = externalPaginationState || [];
+    const isControlledPagination = Boolean(externalPaginationState && pageCount);
+    const controlledPaginationOptions = { manualPagination: true, onPaginationChange: setPagination, pageCount };
     // Prepare Column Visibility
-    var columnVisibility = (externalVisibilityState || [])[0];
-    var isControlledColumnVisibility = Boolean(externalVisibilityState);
+    const [columnVisibility] = externalVisibilityState || [];
+    const isControlledColumnVisibility = Boolean(externalVisibilityState);
     // Init table instance
-    var table = useReactTable(__assign(__assign(__assign(__assign(__assign(__assign({ data: data, columns: columns, state: __assign(__assign(__assign(__assign(__assign({}, (isControlledPagination && { pagination: pagination })), (isControlledGlobalFilter && { globalFilter: globalFilter })), (isControlledColumnFilters && { columnFilters: columnFilters })), (isControlledColumnVisibility && { columnVisibility: columnVisibility })), (isControlledColumnSort && { sorting: sorting })), enableSorting: sortable, enableSortingRemoval: enableSortingRemoval, globalFilterFn: coercedValueIncludesString, getCoreRowModel: getCoreRowModel(), getSortedRowModel: getSortedRowModel(), getFilteredRowModel: getFilteredRowModel() }, (paginated && { getPaginationRowModel: getPaginationRowModel() })), (isControlledPagination && controlledPaginationOptions)), (isControlledGlobalFilter && controlledGlobalFilterOptions)), (isControlledColumnFilters && controlledColumnFiltersOptions)), (isControlledColumnSort && controlledColumnSortOptions)), { meta: { idBase: idBase } }));
-    var _m = useColumnFilters(table), selectedColumnFilters = _m.selectedColumnFilters, hasColumnFilters = _m.hasColumnFilters, deselectColumnFilter = _m.deselectColumnFilter, formatSelectedFilterText = _m.formatSelectedFilterText, resetColumnFilters = _m.resetColumnFilters;
+    const table = useReactTable({
+        data,
+        columns,
+        state: {
+            ...(isControlledPagination && { pagination }),
+            ...(isControlledGlobalFilter && { globalFilter }),
+            ...(isControlledColumnFilters && { columnFilters }),
+            ...(isControlledColumnVisibility && { columnVisibility }),
+            ...(isControlledColumnSort && { sorting }),
+        },
+        enableSorting: sortable,
+        enableSortingRemoval,
+        globalFilterFn: coercedValueIncludesString,
+        getCoreRowModel: getCoreRowModel(),
+        getSortedRowModel: getSortedRowModel(),
+        getFilteredRowModel: getFilteredRowModel(),
+        ...(paginated && { getPaginationRowModel: getPaginationRowModel() }),
+        ...(isControlledPagination && controlledPaginationOptions),
+        ...(isControlledGlobalFilter && controlledGlobalFilterOptions),
+        ...(isControlledColumnFilters && controlledColumnFiltersOptions),
+        ...(isControlledColumnSort && controlledColumnSortOptions),
+        meta: { idBase: idBase },
+    });
+    const { selectedColumnFilters, hasColumnFilters, deselectColumnFilter, formatSelectedFilterText, resetColumnFilters, } = useColumnFilters(table);
     // stagedColumnFilters is only used when stageFilterSelections is enabled
-    var stagedColumnFilters = useStagedColumnFilters(selectedColumnFilters);
-    var handlePagination = function (_e, pageNumber) {
-        var pageIndex = pageNumber - 1;
+    const stagedColumnFilters = useStagedColumnFilters(selectedColumnFilters);
+    const handlePagination = (_e, pageNumber) => {
+        const pageIndex = pageNumber - 1;
         table.setPageIndex(pageIndex);
     };
-    var showTitle = Boolean(title);
-    var showGlobalSearch = Boolean(searchable || isControlledGlobalFilter);
-    var showColumnFilter = Boolean(hasColumnFilters);
-    var showControls = Boolean(showTitle || showGlobalSearch || showColumnFilter);
-    return (React.createElement(TableContext.Provider, { value: { table: table, stagedColumnFilters: stagedColumnFilters, stageFilterSelections: stageFilterSelections } },
-        React.createElement(Box, __assign({ className: classes.root }, { ref: rootRef }, { "data-table-element": "root" }, (table.getPageCount() > 1 && {
-            minHeight: getTableMinHeight(rootRef, table.getState().pagination.pageSize),
-        })),
+    const showTitle = Boolean(title);
+    const showGlobalSearch = Boolean(searchable || isControlledGlobalFilter);
+    const showColumnFilter = Boolean(hasColumnFilters);
+    const showControls = Boolean(showTitle || showGlobalSearch || showColumnFilter);
+    return (React.createElement(TableContext.Provider, { value: { table, stagedColumnFilters, stageFilterSelections } },
+        React.createElement(Box, { className: classes.root, ref: rootRef, "data-table-element": "root", ...(table.getPageCount() > 1 && {
+                minHeight: getTableMinHeight(rootRef, table.getState().pagination.pageSize),
+            }) },
             showControls && (React.createElement(Box, null,
                 React.createElement(TableControlsContainer, { showTitle: showTitle, showGlobalSearch: showGlobalSearch, showColumnFilter: showColumnFilter },
                     showTitle && (React.createElement(Typography, { style: { gridArea: 'title', alignSelf: 'center', fontSize: '18px', lineHeight: '27px' } }, title)),
-                    showGlobalSearch && (React.createElement(GlobalFilter, __assign({}, GlobalFilterProps, { value: table.getState().globalFilter, setValue: table.setGlobalFilter }))),
+                    showGlobalSearch && (React.createElement(GlobalFilter, { ...GlobalFilterProps, value: table.getState().globalFilter, setValue: table.setGlobalFilter })),
                     showColumnFilter && React.createElement(FilterPanel, null)),
                 React.createElement(Box, { display: "flex", flexWrap: "wrap", gridGap: 8 },
-                    selectedColumnFilters.map(function (selectedColumnFilter, i) { return (React.createElement(ColumnFilterChip, { key: "selected-column-filter-chip-" + i, columnFilter: selectedColumnFilter, label: formatSelectedFilterText(selectedColumnFilter), onClick: function (columnFilter) {
+                    selectedColumnFilters.map((selectedColumnFilter, i) => (React.createElement(ColumnFilterChip, { key: `selected-column-filter-chip-${i}`, columnFilter: selectedColumnFilter, label: formatSelectedFilterText(selectedColumnFilter), onClick: (columnFilter) => {
                             if (stageFilterSelections) {
                                 stagedColumnFilters.delete(columnFilter);
                             }
                             deselectColumnFilter(columnFilter);
-                        } })); }),
-                    selectedColumnFilters.length >= 1 && (React.createElement(ColumnFilterResetButton, { onClick: function () {
+                        } }))),
+                    selectedColumnFilters.length >= 1 && (React.createElement(ColumnFilterResetButton, { onClick: () => {
                             if (stageFilterSelections) {
                                 stagedColumnFilters.clear();
                             }
@@ -86,8 +106,8 @@ var Table = function (_a) {
                         } }))))),
             React.createElement(Box, { className: classes.tableContainer, flexGrow: loading || isEmpty ? 0 : 1 },
                 React.createElement("table", { className: classes.table },
-                    React.createElement(TableHeader, null, table.getHeaderGroups().map(function (headerGroup) { return (React.createElement(TableHeaderRow, { key: headerGroup.id }, headerGroup.headers.map(function (header) { return (React.createElement(TableHeaderCell, { key: header.id, context: header.getContext() }, flexRender(header.column.columnDef.header, header.getContext()))); }))); })),
-                    !loading && (React.createElement(TableBody, null, table.getRowModel().rows.map(function (row) { return (React.createElement(TableRow, { key: row.id }, row.getVisibleCells().map(function (cell) { return (React.createElement(TableCell, { key: cell.id }, flexRender(cell.column.columnDef.cell, cell.getContext()))); }))); }))))),
+                    React.createElement(TableHeader, null, table.getHeaderGroups().map((headerGroup) => (React.createElement(TableHeaderRow, { key: headerGroup.id }, headerGroup.headers.map((header) => (React.createElement(TableHeaderCell, { key: header.id, context: header.getContext() }, flexRender(header.column.columnDef.header, header.getContext())))))))),
+                    !loading && (React.createElement(TableBody, null, table.getRowModel().rows.map((row) => (React.createElement(TableRow, { key: row.id }, row.getVisibleCells().map((cell) => (React.createElement(TableCell, { key: cell.id }, flexRender(cell.column.columnDef.cell, cell.getContext()))))))))))),
             isEmpty && isEmptyComponentValid && Empty && !loading && (React.createElement(Box, { display: "flex", flexDirection: "column", justifyContent: "center", alignItems: "center", p: 2, flexGrow: 1 }, createElement(Empty))),
             loading && (React.createElement(Box, { display: "flex", flexDirection: "column", justifyContent: "center", alignItems: "center", p: 2, flexGrow: 1 },
                 React.createElement(CircularProgress, { size: 80, color: "inherit" }))),