schummar-table 0.5.4 → 0.7.0

package/dist/cjs/mui4Theme.js

@@ -36,8 +36,8 @@ var core = require("@material-ui/core");
 var react = require("react");
 var tableTheme = require("./tableTheme.js");
 var jsxRuntime = require("@emotion/react/jsx-runtime");
-require("@emotion/react");
 require("react-dom");
+require("@emotion/react");
 const mui4Theme = {
   components: {
     Button: (props) => jsxRuntime.jsx(core.Button, __spreadProps(__spreadValues({}, props), {

package/dist/cjs/mui4Theme.js.map

@@ -1 +1 @@
-{"version":3,"file":"mui4Theme.js","sources":["../../src/theme/mui4Theme/index.tsx"],"sourcesContent":["import { Badge, Button, Checkbox, CircularProgress, IconButton, TextField, useTheme } from '@material-ui/core';\nimport { ReactNode, useMemo } from 'react';\nimport { PartialTableTheme, TableTheme } from '../../types';\nimport { Popover } from '../defaultTheme/popover';\nimport { mergeThemes, TableThemeContext } from '../tableTheme';\n\nexport const mui4Theme: Partial<TableTheme> = {\n  components: {\n    Button: (props) => (\n      <Button\n        {...props}\n        size=\"small\"\n        fullWidth\n        css={{ justifyContent: 'start !important' }}\n        color={props.variant === 'contained' ? 'primary' : 'inherit'}\n      />\n    ),\n    IconButton: (props) => <IconButton {...props} size=\"small\" color=\"inherit\" />,\n    Checkbox: (props) => <Checkbox {...props} color=\"primary\" size=\"medium\" />,\n    Popover,\n    Badge,\n    TextField: ({ endIcon, ...props }) => <TextField {...props} InputProps={{ endAdornment: endIcon }} size=\"small\" variant=\"outlined\" />,\n    Spinner: CircularProgress,\n  },\n};\n\nexport function Mui4TableThemeProvider({ theme, children }: { theme?: PartialTableTheme; children: ReactNode }) {\n  const muiTheme = useTheme();\n\n  const _theme = useMemo(() => {\n    return mergeThemes(\n      {\n        colors: {\n          primary: muiTheme.palette.primary,\n          secondary: muiTheme.palette.secondary,\n        },\n      },\n      mui4Theme,\n      theme ?? {},\n    );\n  }, [muiTheme, theme]);\n\n  return <TableThemeContext.Provider value={_theme}>{children}</TableThemeContext.Provider>;\n}\n"],"names":["mui4Theme","components","Button","props","_jsx","justifyContent","variant","IconButton","Checkbox","Popover","Badge","TextField","endIcon","endAdornment","Spinner","CircularProgress","theme","children","muiTheme","useTheme","_theme","useMemo","mergeThemes","colors","primary","palette","secondary","TableThemeContext"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAMaA,YAAiC;AAAA,EAC5CC,YAAY;AAAA,IACVC,QAASC,WACPC,eAACF,8CACKC;MACJ,MAAK;AAAA,MACL;MACA,KAAK;AAAA,QAAEE,gBAAgB;AAAA;AAAA,MACvB,OAAOF,MAAMG,YAAY,cAAc,YAAY;AAAA;AAAA,IAGvDC,YAAaJ,WAAUC,eAACG,kDAAeJ;MAAO,MAAK;AAAA,MAAQ,OAAM;AAAA;AAAA,IACjEK,UAAWL,WAAUC,eAACI,gDAAaL;MAAO,OAAM;AAAA,MAAU,MAAK;AAAA;AAAA,aAC/DM;WACAC;IACAC,WAAW,CAAC;AAAA,mBAAEC;AAAAA;AAAAA,UAAF,IAAcT,kBAAd,IAAcA;AAAAA,QAAZS;AAAAA;AAAwBR,4BAACO,iDAAcR;QAAO,YAAY;AAAA,UAAEU,cAAcD;AAAAA;AAAAA,QAAW,MAAK;AAAA,QAAQ,SAAQ;AAAA;AAAA;AAAA,IACxHE,SAASC;;;gCAI0B;AAAA,EAAEC;AAAAA,EAAOC;AAAAA,GAAgE;QACxGC,WAAWC;QAEXC,SAASC,cAAQ,MAAM;WACpBC,uBACL;AAAA,MACEC,QAAQ;AAAA,QACNC,SAASN,SAASO,QAAQD;AAAAA,QAC1BE,WAAWR,SAASO,QAAQC;AAAAA;AAAAA,OAGhC1B,WACAgB,wBAAS;AAAA,KAEV,CAACE,UAAUF;SAEPZ,eAACuB,6BAAkB;IAAS,OAAOP;AAAAA;;;;;"}
+{"version":3,"file":"mui4Theme.js","sources":["../../src/theme/mui4Theme/index.tsx"],"sourcesContent":["import { Badge, Button, Checkbox, CircularProgress, IconButton, TextField, useTheme } from '@material-ui/core';\nimport { ReactNode, useMemo } from 'react';\nimport { PartialTableTheme } from '../../types';\nimport { Popover } from '../defaultTheme/popover';\nimport { mergeThemes, TableThemeContext } from '../tableTheme';\n\nexport const mui4Theme: PartialTableTheme = {\n  components: {\n    Button: (props) => (\n      <Button\n        {...props}\n        size=\"small\"\n        fullWidth\n        css={{ justifyContent: 'start !important' }}\n        color={props.variant === 'contained' ? 'primary' : 'inherit'}\n      />\n    ),\n    IconButton: (props) => <IconButton {...props} size=\"small\" color=\"inherit\" />,\n    Checkbox: (props) => <Checkbox {...props} color=\"primary\" size=\"medium\" />,\n    Popover,\n    Badge,\n    TextField: ({ endIcon, ...props }) => <TextField {...props} InputProps={{ endAdornment: endIcon }} size=\"small\" variant=\"outlined\" />,\n    Spinner: CircularProgress,\n  },\n};\n\nexport function Mui4TableThemeProvider({ theme, children }: { theme?: PartialTableTheme; children: ReactNode }) {\n  const muiTheme = useTheme();\n\n  const _theme = useMemo(() => {\n    return mergeThemes(\n      {\n        colors: {\n          primary: muiTheme.palette.primary,\n          secondary: muiTheme.palette.secondary,\n        },\n      },\n      mui4Theme,\n      theme ?? {},\n    );\n  }, [muiTheme, theme]);\n\n  return <TableThemeContext.Provider value={_theme}>{children}</TableThemeContext.Provider>;\n}\n"],"names":["mui4Theme","components","Button","props","_jsx","justifyContent","variant","IconButton","Checkbox","Popover","Badge","TextField","endIcon","endAdornment","Spinner","CircularProgress","theme","children","muiTheme","useTheme","_theme","useMemo","mergeThemes","colors","primary","palette","secondary","TableThemeContext"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAMaA,YAA+B;AAAA,EAC1CC,YAAY;AAAA,IACVC,QAASC,WACPC,eAACF,8CACKC;MACJ,MAAK;AAAA,MACL;MACA,KAAK;AAAA,QAAEE,gBAAgB;AAAA;AAAA,MACvB,OAAOF,MAAMG,YAAY,cAAc,YAAY;AAAA;AAAA,IAGvDC,YAAaJ,WAAUC,eAACG,kDAAeJ;MAAO,MAAK;AAAA,MAAQ,OAAM;AAAA;AAAA,IACjEK,UAAWL,WAAUC,eAACI,gDAAaL;MAAO,OAAM;AAAA,MAAU,MAAK;AAAA;AAAA,aAC/DM;WACAC;IACAC,WAAW,CAAC;AAAA,mBAAEC;AAAAA;AAAAA,UAAF,IAAcT,kBAAd,IAAcA;AAAAA,QAAZS;AAAAA;AAAwBR,4BAACO,iDAAcR;QAAO,YAAY;AAAA,UAAEU,cAAcD;AAAAA;AAAAA,QAAW,MAAK;AAAA,QAAQ,SAAQ;AAAA;AAAA;AAAA,IACxHE,SAASC;;;gCAI0B;AAAA,EAAEC;AAAAA,EAAOC;AAAAA,GAAgE;QACxGC,WAAWC;QAEXC,SAASC,cAAQ,MAAM;WACpBC,uBACL;AAAA,MACEC,QAAQ;AAAA,QACNC,SAASN,SAASO,QAAQD;AAAAA,QAC1BE,WAAWR,SAASO,QAAQC;AAAAA;AAAAA,OAGhC1B,WACAgB,wBAAS;AAAA,KAEV,CAACE,UAAUF;SAEPZ,eAACuB,6BAAkB;IAAS,OAAOP;AAAAA;;;;;"}

package/dist/cjs/mui5Theme.js

@@ -36,8 +36,8 @@ var material = require("@mui/material");
 var react = require("react");
 var tableTheme = require("./tableTheme.js");
 var jsxRuntime = require("@emotion/react/jsx-runtime");
-require("@emotion/react");
 require("react-dom");
+require("@emotion/react");
 const mui5Theme = {
   components: {
     Button: (props) => jsxRuntime.jsx(material.Button, __spreadProps(__spreadValues({}, props), {

package/dist/cjs/mui5Theme.js.map

@@ -1 +1 @@
-{"version":3,"file":"mui5Theme.js","sources":["../../src/theme/mui5Theme/index.tsx"],"sourcesContent":["import { Badge, Button, Checkbox, CircularProgress, IconButton, TextField, useTheme } from '@mui/material';\nimport { ReactNode, useMemo } from 'react';\nimport { PartialTableTheme, TableTheme } from '../../types';\nimport { Popover } from '../defaultTheme/popover';\nimport { mergeThemes, TableThemeContext } from '../tableTheme';\n\nexport const mui5Theme: Partial<TableTheme> = {\n  components: {\n    Button: (props) => (\n      <Button\n        {...props}\n        size=\"small\"\n        fullWidth\n        css={{ justifyContent: 'start !important' }}\n        color={props.variant === 'contained' ? 'primary' : 'inherit'}\n      />\n    ),\n    IconButton: (props) => <IconButton {...props} size=\"small\" css={{ fontSize: '0.8em' }} color=\"inherit\" />,\n    Checkbox: (props) => <Checkbox {...props} color=\"primary\" size=\"small\" />,\n    Popover,\n    Badge,\n    TextField: ({ endIcon, ...props }) => <TextField {...props} InputProps={{ endAdornment: endIcon }} size=\"small\" />,\n    Spinner: (props) => <CircularProgress {...props} size={20} />,\n  },\n};\n\nexport function Mui5TableThemeProvider({ theme, children }: { theme?: PartialTableTheme; children: ReactNode }) {\n  const muiTheme = useTheme();\n\n  const _theme = useMemo(() => {\n    return mergeThemes(\n      {\n        colors: {\n          primary: muiTheme.palette.primary,\n          secondary: muiTheme.palette.secondary,\n        },\n      },\n      mui5Theme,\n      theme ?? {},\n    );\n  }, [muiTheme, theme]);\n\n  return <TableThemeContext.Provider value={_theme}>{children}</TableThemeContext.Provider>;\n}\n"],"names":["mui5Theme","components","Button","props","_jsx","justifyContent","variant","IconButton","fontSize","Checkbox","Popover","Badge","TextField","endIcon","endAdornment","Spinner","CircularProgress","theme","children","muiTheme","useTheme","_theme","useMemo","mergeThemes","colors","primary","palette","secondary","TableThemeContext"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAMaA,YAAiC;AAAA,EAC5CC,YAAY;AAAA,IACVC,QAASC,WACPC,eAACF,kDACKC;MACJ,MAAK;AAAA,MACL;MACA,KAAK;AAAA,QAAEE,gBAAgB;AAAA;AAAA,MACvB,OAAOF,MAAMG,YAAY,cAAc,YAAY;AAAA;AAAA,IAGvDC,YAAaJ,WAAUC,eAACG,sDAAeJ;MAAO,MAAK;AAAA,MAAQ,KAAK;AAAA,QAAEK,UAAU;AAAA;AAAA,MAAW,OAAM;AAAA;AAAA,IAC7FC,UAAWN,WAAUC,eAACK,oDAAaN;MAAO,OAAM;AAAA,MAAU,MAAK;AAAA;AAAA,aAC/DO;WACAC;IACAC,WAAW,CAAC;AAAA,mBAAEC;AAAAA;AAAAA,UAAF,IAAcV,kBAAd,IAAcA;AAAAA,QAAZU;AAAAA;AAAwBT,4BAACQ,qDAAcT;QAAO,YAAY;AAAA,UAAEW,cAAcD;AAAAA;AAAAA,QAAW,MAAK;AAAA;AAAA;AAAA,IACxGE,SAAUZ,WAAUC,eAACY,4DAAqBb;MAAO,MAAM;AAAA;AAAA;AAAA;gCAIpB;AAAA,EAAEc;AAAAA,EAAOC;AAAAA,GAAgE;QACxGC,WAAWC;QAEXC,SAASC,cAAQ,MAAM;WACpBC,uBACL;AAAA,MACEC,QAAQ;AAAA,QACNC,SAASN,SAASO,QAAQD;AAAAA,QAC1BE,WAAWR,SAASO,QAAQC;AAAAA;AAAAA,OAGhC3B,WACAiB,wBAAS;AAAA,KAEV,CAACE,UAAUF;SAEPb,eAACwB,6BAAkB;IAAS,OAAOP;AAAAA;;;;;"}
+{"version":3,"file":"mui5Theme.js","sources":["../../src/theme/mui5Theme/index.tsx"],"sourcesContent":["import { Badge, Button, Checkbox, CircularProgress, IconButton, TextField, useTheme } from '@mui/material';\nimport { ReactNode, useMemo } from 'react';\nimport { PartialTableTheme } from '../../types';\nimport { Popover } from '../defaultTheme/popover';\nimport { mergeThemes, TableThemeContext } from '../tableTheme';\n\nexport const mui5Theme: PartialTableTheme = {\n  components: {\n    Button: (props) => (\n      <Button\n        {...props}\n        size=\"small\"\n        fullWidth\n        css={{ justifyContent: 'start !important' }}\n        color={props.variant === 'contained' ? 'primary' : 'inherit'}\n      />\n    ),\n    IconButton: (props) => <IconButton {...props} size=\"small\" css={{ fontSize: '0.8em' }} color=\"inherit\" />,\n    Checkbox: (props) => <Checkbox {...props} color=\"primary\" size=\"small\" />,\n    Popover,\n    Badge,\n    TextField: ({ endIcon, ...props }) => <TextField {...props} InputProps={{ endAdornment: endIcon }} size=\"small\" />,\n    Spinner: (props) => <CircularProgress {...props} size={20} />,\n  },\n};\n\nexport function Mui5TableThemeProvider({ theme, children }: { theme?: PartialTableTheme; children: ReactNode }) {\n  const muiTheme = useTheme();\n\n  const _theme = useMemo(() => {\n    return mergeThemes(\n      {\n        colors: {\n          primary: muiTheme.palette.primary,\n          secondary: muiTheme.palette.secondary,\n        },\n      },\n      mui5Theme,\n      theme ?? {},\n    );\n  }, [muiTheme, theme]);\n\n  return <TableThemeContext.Provider value={_theme}>{children}</TableThemeContext.Provider>;\n}\n"],"names":["mui5Theme","components","Button","props","_jsx","justifyContent","variant","IconButton","fontSize","Checkbox","Popover","Badge","TextField","endIcon","endAdornment","Spinner","CircularProgress","theme","children","muiTheme","useTheme","_theme","useMemo","mergeThemes","colors","primary","palette","secondary","TableThemeContext"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAMaA,YAA+B;AAAA,EAC1CC,YAAY;AAAA,IACVC,QAASC,WACPC,eAACF,kDACKC;MACJ,MAAK;AAAA,MACL;MACA,KAAK;AAAA,QAAEE,gBAAgB;AAAA;AAAA,MACvB,OAAOF,MAAMG,YAAY,cAAc,YAAY;AAAA;AAAA,IAGvDC,YAAaJ,WAAUC,eAACG,sDAAeJ;MAAO,MAAK;AAAA,MAAQ,KAAK;AAAA,QAAEK,UAAU;AAAA;AAAA,MAAW,OAAM;AAAA;AAAA,IAC7FC,UAAWN,WAAUC,eAACK,oDAAaN;MAAO,OAAM;AAAA,MAAU,MAAK;AAAA;AAAA,aAC/DO;WACAC;IACAC,WAAW,CAAC;AAAA,mBAAEC;AAAAA;AAAAA,UAAF,IAAcV,kBAAd,IAAcA;AAAAA,QAAZU;AAAAA;AAAwBT,4BAACQ,qDAAcT;QAAO,YAAY;AAAA,UAAEW,cAAcD;AAAAA;AAAAA,QAAW,MAAK;AAAA;AAAA;AAAA,IACxGE,SAAUZ,WAAUC,eAACY,4DAAqBb;MAAO,MAAM;AAAA;AAAA;AAAA;gCAIpB;AAAA,EAAEc;AAAAA,EAAOC;AAAAA,GAAgE;QACxGC,WAAWC;QAEXC,SAASC,cAAQ,MAAM;WACpBC,uBACL;AAAA,MACEC,QAAQ;AAAA,QACNC,SAASN,SAASO,QAAQD;AAAAA,QAC1BE,WAAWR,SAASO,QAAQC;AAAAA;AAAAA,OAGhC3B,WACAiB,wBAAS;AAAA,KAEV,CAACE,UAAUF;SAEPb,eAACwB,6BAAkB;IAAS,OAAOP;AAAAA;;;;;"}

package/dist/cjs/tableTheme.js

@@ -18,22 +18,10 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
 var react$1 = require("react");
+var reactDom = require("react-dom");
 var react = require("@emotion/react");
 var jsxRuntime = require("@emotion/react/jsx-runtime");
-var reactDom = require("react-dom");
 const white = "#ffffff";
 const lightGray = "#eeeeee";
 const gray = "#bdbdbd";
@@ -92,7 +80,7 @@ const PopoverContext = react$1.createContext({
 });
 const Popover = ({
   anchorEl,
-  open: open2,
+  open,
   hidden,
   onClose,
   children,
@@ -102,7 +90,7 @@ const Popover = ({
   const popper = react$1.useRef(null);
   const [position, setPosition] = react$1.useState();
   react$1.useLayoutEffect(() => {
-    if (!anchorEl || !open2) {
+    if (!anchorEl || !open) {
       setPosition(void 0);
       return;
     }
@@ -142,7 +130,7 @@ const Popover = ({
     return () => {
       clearInterval(handle);
     };
-  }, [anchorEl, open2]);
+  }, [anchorEl, open]);
   const {
     depth
   } = react$1.useContext(PopoverContext);
@@ -151,7 +139,7 @@ const Popover = ({
     depth: depth + 1,
     visible
   }), [depth, visible]);
-  if (!open2)
+  if (!open)
     return null;
   return jsxRuntime.jsx(PopoverContext.Provider, {
     value: context,
@@ -187,443 +175,9 @@ const Popover = ({
     }), document.body)
   });
 };
-const defaultColors = {
-  primary: { main: "#1976d2", light: "#42a5f5", contrastText: "#fff" },
-  secondary: { main: "#9c27b0", light: "#ba68c8", contrastText: "#fff" }
-};
-function Spinner({
-  className
-}) {
-  return jsxRuntime.jsxs("div", {
-    className,
-    css: react.css`
-        display: inline-block;
-        position: relative;
-        width: 1em;
-        height: 1em;
-
-        div {
-          box-sizing: border-box;
-          display: block;
-          position: absolute;
-          width: 0.8em;
-          height: 0.8em;
-          margin: 0.1em;
-          border: 0.1em solid #fff;
-          border-radius: 50%;
-          animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
-          border-color: currentColor transparent transparent transparent;
-        }
-        div:nth-of-type(1) {
-          animation-delay: -0.45s;
-        }
-        div:nth-of-type(2) {
-          animation-delay: -0.3s;
-        }
-        div:nth-of-type(3) {
-          animation-delay: -0.15s;
-        }
-        @keyframes lds-ring {
-          0% {
-            transform: rotate(0deg);
-          }
-          100% {
-            transform: rotate(360deg);
-          }
-        }
-      `,
-    children: [jsxRuntime.jsx("div", {}), jsxRuntime.jsx("div", {}), jsxRuntime.jsx("div", {})]
-  });
-}
-const Badge = ({
-  badgeContent,
-  children
-}) => {
-  if (!open)
-    return null;
-  return jsxRuntime.jsxs("span", {
-    css: {
-      display: "inline-flex",
-      position: "relative",
-      flexShrink: 0,
-      verticalAlign: "middle"
-    },
-    children: [children, jsxRuntime.jsx("span", {
-      css: [{
-        top: 0,
-        right: 0,
-        transform: "scale(1) translate(50%, -50%)",
-        transformOrigin: "100% 0%",
-        height: 20,
-        display: "flex",
-        padding: "0 6px",
-        zIndex: 1,
-        position: "absolute",
-        flexWrap: "wrap",
-        minWidth: 20,
-        transition: "transform 225ms cubic-bezier(0.4, 0, 0.2, 1) 0ms",
-        alignItems: "center",
-        lineHeight: 1,
-        alignContent: "center",
-        borderRadius: 10,
-        justifyContent: "center",
-        fontSize: "0.8em"
-      }, !badgeContent && {
-        transform: "scale(0) translate(50%, -50%)",
-        transition: "transform 195ms cubic-bezier(0.4, 0, 0.2, 1) 0ms"
-      }],
-      children: badgeContent
-    })]
-  });
-};
-const Button = (_a) => {
-  var _b = _a, {
-    startIcon,
-    children,
-    variant = "text"
-  } = _b, props = __objRest(_b, [
-    "startIcon",
-    "children",
-    "variant"
-  ]);
-  return jsxRuntime.jsxs("button", __spreadProps(__spreadValues({
-    css: [{
-      padding: `var(--spacing) calc(var(--spacing) * 2)`,
-      display: "inline-flex",
-      alignItems: "center",
-      transition: "background-color 150ms",
-      border: "none",
-      cursor: "pointer",
-      background: "transparent",
-      borderRadius: 4,
-      "&:active:not(:disabled)": {
-        transform: "scale3d(0.95, 0.95, 1)"
-      }
-    }, variant === "text" && {
-      "&:hover": {
-        background: "rgba(0, 0, 0, 0.1)"
-      }
-    }, variant === "outlined" && {
-      border: `1px solid ${darkGray}`,
-      "&:disabled": {
-        borderColor: lightGray
-      }
-    }, variant === "contained" && {
-      color: "var(--primaryContrastText)",
-      backgroundColor: "var(--primaryMain)",
-      boxShadow: "0px 3px 1px -2px rgb(0 0 0 / 20%), 0px 2px 2px 0px rgb(0 0 0 / 14%), 0px 1px 5px 0px rgb(0 0 0 / 12%)",
-      "&:hover": {
-        filter: "brightness(0.9)"
-      },
-      "&:disabled": {
-        filter: "grayscale()",
-        opacity: 0.5
-      }
-    }]
-  }, props), {
-    children: [startIcon && jsxRuntime.jsx("span", {
-      css: {
-        marginRight: `calc(var(--spacing) * 2)`
-      },
-      children: startIcon
-    }), jsxRuntime.jsx("span", {
-      children
-    })]
-  }));
-};
-const Checkbox = (_c) => {
-  var _d = _c, {
-    className
-  } = _d, props = __objRest(_d, [
-    "className"
-  ]);
-  return jsxRuntime.jsxs("label", {
-    css: [{
-      padding: "calc(var(--spacing) * 1.8)",
-      display: "flex",
-      color: "currentcolor",
-      userSelect: "none",
-      "& input": {
-        appearance: "none",
-        margin: 0
-      }
-    }, props.disabled && {
-      color: "rgba(0, 0, 0, 0.26)"
-    }],
-    className,
-    children: [jsxRuntime.jsx("input", __spreadValues({
-      type: "checkbox"
-    }, props)), props.checked ? jsxRuntime.jsx("svg", {
-      css: {
-        fontSize: "1.25rem",
-        width: "1em",
-        height: "1em",
-        fill: "var(--primaryMain)"
-      },
-      focusable: "false",
-      viewBox: "0 0 24 24",
-      "aria-hidden": "true",
-      children: jsxRuntime.jsx("path", {
-        d: "M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"
-      })
-    }) : jsxRuntime.jsx("svg", {
-      css: {
-        fontSize: "1.25rem",
-        width: "1em",
-        height: "1em",
-        fill: "currentColor"
-      },
-      focusable: "false",
-      viewBox: "0 0 24 24",
-      "aria-hidden": "true",
-      children: jsxRuntime.jsx("path", {
-        d: "M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
-      })
-    })]
-  });
-};
-const IconButton = (props) => {
-  return jsxRuntime.jsx("button", __spreadValues({
-    css: {
-      padding: "var(--spacing)",
-      borderRadius: "50%",
-      display: "inline-flex",
-      justifyContent: "center",
-      alignItems: "center",
-      transition: "background-color 150ms",
-      border: "none",
-      cursor: "pointer",
-      color: "inherit",
-      background: "transparent",
-      "&:hover": {
-        backgroundColor: "rgba(0, 0, 0, 0.04)"
-      },
-      "&:active": {
-        transformColor: "scale3d(0.95, 0.95, 1)"
-      }
-    }
-  }, props));
-};
-const TextField = (_e) => {
-  var _f = _e, {
-    endIcon,
-    className,
-    inputRef
-  } = _f, props = __objRest(_f, [
-    "endIcon",
-    "className",
-    "inputRef"
-  ]);
-  var _a;
-  const [focus, setFocus] = react$1.useState(false);
-  return jsxRuntime.jsx("div", {
-    className,
-    css: {
-      display: "flex"
-    },
-    children: jsxRuntime.jsxs("span", {
-      css: [{
-        flex: 1,
-        display: "flex",
-        alignItems: "center",
-        border: `1px solid ${darkGray}`,
-        borderRadius: 4
-      }, focus && {
-        border: "2px solid var(--primaryMain)",
-        margin: -1
-      }],
-      children: [jsxRuntime.jsx("input", __spreadProps(__spreadValues({
-        ref: inputRef
-      }, props), {
-        value: (_a = props.value) != null ? _a : "",
-        onFocus: () => setFocus(true),
-        onBlur: () => setFocus(false),
-        css: {
-          flex: 1,
-          border: "none",
-          outline: "none",
-          borderRadius: 4,
-          padding: "calc(var(--spacing) * 2)",
-          paddingRight: 0,
-          transition: "outline 500ms"
-        }
-      })), endIcon]
-    })
-  });
-};
-const defaultComponents = {
-  IconButton,
-  Checkbox,
-  Popover,
-  Button,
-  Badge,
-  TextField,
-  Spinner
-};
-const IconDefaultStyle = react.css({
-  width: "1.5em",
-  height: "1.5em",
-  color: "inherit"
-});
-function Icon(svg) {
-  return (props) => jsxRuntime.jsx(react.ClassNames, {
-    children: ({
-      css: css2
-    }) => react$1.cloneElement(svg, __spreadProps(__spreadValues({}, props), {
-      className: css2(IconDefaultStyle, props.className)
-    }))
-  });
-}
-const Settings = Icon(jsxRuntime.jsxs("svg", {
-  xmlns: "http://www.w3.org/2000/svg",
-  height: "24px",
-  viewBox: "0 0 24 24",
-  width: "24px",
-  fill: "currentColor",
-  children: [jsxRuntime.jsx("path", {
-    d: "M0 0h24v24H0V0z",
-    fill: "none"
-  }), jsxRuntime.jsx("path", {
-    d: "M3 17v2h6v-2H3zM3 5v2h10V5H3zm10 16v-2h8v-2h-8v-2h-2v6h2zM7 9v2H3v2h4v2h2V9H7zm14 4v-2H11v2h10zm-6-4h2V7h4V5h-4V3h-2v6z"
-  })]
-}));
-const Export = Icon(jsxRuntime.jsxs("svg", {
-  xmlns: "http://www.w3.org/2000/svg",
-  enableBackground: "new 0 0 24 24",
-  height: "24px",
-  viewBox: "0 0 24 24",
-  width: "24px",
-  fill: "currentColor",
-  children: [jsxRuntime.jsx("g", {
-    children: jsxRuntime.jsx("rect", {
-      fill: "none",
-      height: "24",
-      width: "24"
-    })
-  }), jsxRuntime.jsx("g", {
-    children: jsxRuntime.jsx("path", {
-      d: "M18,15v3H6v-3H4v3c0,1.1,0.9,2,2,2h12c1.1,0,2-0.9,2-2v-3H18z M17,11l-1.41-1.41L13,12.17V4h-2v8.17L8.41,9.59L7,11l5,5 L17,11z"
-    })
-  })]
-}));
-const Clipboard = Icon(jsxRuntime.jsxs("svg", {
-  xmlns: "http://www.w3.org/2000/svg",
-  height: "24px",
-  viewBox: "0 0 24 24",
-  width: "24px",
-  fill: "currentColor",
-  children: [jsxRuntime.jsx("path", {
-    d: "M0 0h24v24H0V0z",
-    fill: "none"
-  }), jsxRuntime.jsx("path", {
-    d: "M19 2h-4.18C14.4.84 13.3 0 12 0S9.6.84 9.18 2H5c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-7 0c.55 0 1 .45 1 1s-.45 1-1 1-1-.45-1-1 .45-1 1-1zm7 18H5V4h2v3h10V4h2v16z"
-  })]
-}));
-const ChevronRight = Icon(jsxRuntime.jsxs("svg", {
-  xmlns: "http://www.w3.org/2000/svg",
-  height: "24px",
-  viewBox: "0 0 24 24",
-  width: "24px",
-  fill: "currentColor",
-  children: [jsxRuntime.jsx("path", {
-    d: "M0 0h24v24H0V0z",
-    fill: "none"
-  }), jsxRuntime.jsx("path", {
-    d: "M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6-6-6z"
-  })]
-}));
-const Search = Icon(jsxRuntime.jsxs("svg", {
-  xmlns: "http://www.w3.org/2000/svg",
-  height: "24px",
-  viewBox: "0 0 24 24",
-  width: "24px",
-  fill: "currentColor",
-  children: [jsxRuntime.jsx("path", {
-    d: "M0 0h24v24H0V0z",
-    fill: "none"
-  }), jsxRuntime.jsx("path", {
-    d: "M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"
-  })]
-}));
-const Clear = Icon(jsxRuntime.jsxs("svg", {
-  xmlns: "http://www.w3.org/2000/svg",
-  height: "24px",
-  viewBox: "0 0 24 24",
-  width: "24px",
-  fill: "currentColor",
-  children: [jsxRuntime.jsx("path", {
-    d: "M0 0h24v24H0V0z",
-    fill: "none"
-  }), jsxRuntime.jsx("path", {
-    d: "M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12 19 6.41z"
-  })]
-}));
-const ArrowDropDown = Icon(jsxRuntime.jsxs("svg", {
-  xmlns: "http://www.w3.org/2000/svg",
-  height: "24px",
-  viewBox: "0 0 24 24",
-  width: "24px",
-  fill: "currentColor",
-  children: [jsxRuntime.jsx("path", {
-    d: "M0 0h24v24H0V0z",
-    fill: "none"
-  }), jsxRuntime.jsx("path", {
-    d: "M7 10l5 5 5-5H7z"
-  })]
-}));
-const FilterList = Icon(jsxRuntime.jsx("svg", {
-  viewBox: "0 0 24 24",
-  children: jsxRuntime.jsx("path", {
-    fill: "currentColor",
-    d: "M14,12V19.88C14.04,20.18 13.94,20.5 13.71,20.71C13.32,21.1 12.69,21.1 12.3,20.71L10.29,18.7C10.06,18.47 9.96,18.16 10,17.87V12H9.97L4.21,4.62C3.87,4.19 3.95,3.56 4.38,3.22C4.57,3.08 4.78,3 5,3V3H19V3C19.22,3 19.43,3.08 19.62,3.22C20.05,3.56 20.13,4.19 19.79,4.62L14.03,12H14Z"
-  })
-}));
-const ArrowUpward = Icon(jsxRuntime.jsxs("svg", {
-  xmlns: "http://www.w3.org/2000/svg",
-  height: "24px",
-  viewBox: "0 0 24 24",
-  width: "24px",
-  fill: "currentColor",
-  children: [jsxRuntime.jsx("path", {
-    d: "M0 0h24v24H0V0z",
-    fill: "none"
-  }), jsxRuntime.jsx("path", {
-    d: "M4 12l1.41 1.41L11 7.83V20h2V7.83l5.58 5.59L20 12l-8-8-8 8z"
-  })]
-}));
-const defaultIcons = {
-  Settings,
-  Export,
-  Clipboard,
-  ChevronRight,
-  Search,
-  Clear,
-  ArrowDropDown,
-  FilterList,
-  ArrowUpward
-};
-const defaultTexts = {
-  selectColumns: "Select visible columns",
-  noResults: "No results",
-  exportTitle: "Export",
-  exportCopy: "To clipboard",
-  exportDownload: "Download",
-  today: "Today",
-  thisWeek: "This week",
-  reset: "Reset",
-  loading: "Loading",
-  selected: (count) => `${count} selected`
-};
-const defaultTableTheme = {
-  text: defaultTexts,
-  components: defaultComponents,
-  icons: defaultIcons,
-  colors: defaultColors,
-  spacing: "5px"
-};
-let globalTableTheme = {};
+exports.globalTableTheme = {};
 function configureTableTheme(tableTheme) {
-  globalTableTheme = tableTheme;
+  exports.globalTableTheme = tableTheme;
 }
 const TableThemeContext = react$1.createContext({});
 function TableThemeProvider({
@@ -654,17 +208,14 @@ function mergeThemes(...themes) {
     spacing: themes.map((theme) => theme.spacing).reverse().find((x) => x !== void 0)
   };
 }
-function useTableTheme(props) {
-  const contextTableTheme = react$1.useContext(TableThemeContext);
-  return mergeThemes(defaultTableTheme, globalTableTheme, contextTableTheme, props);
-}
 exports.Popover = Popover;
 exports.PopoverContext = PopoverContext;
 exports.TableThemeContext = TableThemeContext;
 exports.TableThemeProvider = TableThemeProvider;
 exports.configureTableTheme = configureTableTheme;
+exports.darkGray = darkGray;
 exports.defaultClasses = defaultClasses;
 exports.gray = gray;
+exports.lightGray = lightGray;
 exports.mergeThemes = mergeThemes;
-exports.useTableTheme = useTableTheme;
 //# sourceMappingURL=tableTheme.js.map