material-react-table 0.4.5 → 0.4.6

package/dist/useMRT.d.ts

@@ -1,12 +1,16 @@
 import React, { PropsWithChildren } from 'react';
 import { Row, TableInstance } from 'react-table';
+import { MRT_Icons } from './icons';
+import { MRT_Localization } from './localization';
 import { MaterialReactTableProps } from './MaterialReactTable';
-export interface UseMRT<D extends {} = {}> extends MaterialReactTableProps<D> {
+export declare type UseMRT<D extends {} = {}> = MaterialReactTableProps<D> & {
     anyRowsCanExpand: boolean;
     anyRowsExpanded: boolean;
     currentEditingRow: Row<D> | null;
     densePadding: boolean;
     fullScreen: boolean;
+    icons: MRT_Icons;
+    localization: MRT_Localization;
     setCurrentEditingRow: (currentRowEditingId: Row<D> | null) => void;
     setDensePadding: (densePadding: boolean) => void;
     setFullScreen: (fullScreen: boolean) => void;
@@ -15,6 +19,6 @@ export interface UseMRT<D extends {} = {}> extends MaterialReactTableProps<D> {
     showFilters: boolean;
     showSearch: boolean;
     tableInstance: TableInstance<D>;
-}
+};
 export declare const MaterialReactTableProvider: <D extends {}>(props: React.PropsWithChildren<MaterialReactTableProps<D>>) => JSX.Element;
 export declare const useMRT: <D extends {}>() => UseMRT<D>;

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.4.5",
+  "version": "0.4.6",
   "license": "MIT",
   "name": "material-react-table",
   "description": "A fully featured Material-UI implementation of react-table, inspired by material-table and the mui DataGrid, written from the ground up in TypeScript.",

package/src/MaterialReactTable.tsx

@@ -33,8 +33,9 @@ import {
 } from 'react-table';
 import { MaterialReactTableProvider } from './useMRT';
 import { MRT_TableContainer } from './table/MRT_TableContainer';
-import { defaultLocalization, MRT_Localization } from './utils/localization';
 import { MRT_ColumnInterface } from './@types/react-table-config';
+import { MRT_Localization, MRT_DefaultLocalization_EN } from './localization';
+import { MRT_Default_Icons, MRT_Icons } from './icons';
 
 export type MaterialReactTableProps<D extends {} = {}> = TableOptions<D> &
   UseTableOptions<D> &
@@ -70,6 +71,7 @@ export type MaterialReactTableProps<D extends {} = {}> = TableOptions<D> &
     hideToolbarInternalActions?: boolean;
     hideToolbarBottom?: boolean;
     hideToolbarTop?: boolean;
+    icons?: Partial<MRT_Icons>;
     isFetching?: boolean;
     isLoading?: boolean;
     localization?: Partial<MRT_Localization>;
@@ -175,7 +177,8 @@ export type MaterialReactTableProps<D extends {} = {}> = TableOptions<D> &
 
 export default <D extends {}>({
   defaultColumn = { minWidth: 50, maxWidth: 1000 },
-  localization = defaultLocalization,
+  icons,
+  localization,
   positionActionsColumn = 'first',
   positionPagination = 'bottom',
   positionToolbarActions = 'top',
@@ -184,7 +187,8 @@ export default <D extends {}>({
 }: MaterialReactTableProps<D>) => (
   <MaterialReactTableProvider
     defaultColumn={defaultColumn}
-    localization={{ ...defaultLocalization, ...localization }}
+    icons={{ ...MRT_Default_Icons, ...icons }}
+    localization={{ ...MRT_DefaultLocalization_EN, ...localization }}
     positionActionsColumn={positionActionsColumn}
     positionPagination={positionPagination}
     positionToolbarActions={positionToolbarActions}

package/src/body/MRT_TableBodyRow.tsx

@@ -63,9 +63,10 @@ export const MRT_TableBodyRow: FC<Props> = ({ row }) => {
         {enableRowNumbers && (
           <MRT_StyledTableBodyCell>{row.index + 1}</MRT_StyledTableBodyCell>
         )}
-        {(enableRowActions || enableRowEditing) && positionActionsColumn === 'first' && (
-          <MRT_ToggleRowActionMenuButton row={row} />
-        )}
+        {(enableRowActions || enableRowEditing) &&
+          positionActionsColumn === 'first' && (
+            <MRT_ToggleRowActionMenuButton row={row} />
+          )}
         {(anyRowsCanExpand || renderDetailPanel) && (
           <MRT_ExpandButton row={row} />
         )}
@@ -73,9 +74,10 @@ export const MRT_TableBodyRow: FC<Props> = ({ row }) => {
         {row.cells.map((cell) => (
           <MRT_TableBodyCell key={cell.getCellProps().key} cell={cell} />
         ))}
-        {(enableRowActions || enableRowEditing) && positionActionsColumn === 'last' && (
-          <MRT_ToggleRowActionMenuButton row={row} />
-        )}
+        {(enableRowActions || enableRowEditing) &&
+          positionActionsColumn === 'last' && (
+            <MRT_ToggleRowActionMenuButton row={row} />
+          )}
       </TableRow>
       {renderDetailPanel && <MRT_TableDetailPanel row={row} />}
     </>

package/src/buttons/MRT_EditActionButtons.tsx

@@ -1,7 +1,5 @@
 import React, { FC } from 'react';
 import { IconButton, styled, Tooltip } from '@mui/material';
-import SaveIcon from '@mui/icons-material/Save';
-import CancelIcon from '@mui/icons-material/Cancel';
 import { useMRT } from '../useMRT';
 import { Row } from 'react-table';
 
@@ -16,6 +14,7 @@ interface Props {
 
 export const MRT_EditActionButtons: FC<Props> = ({ row }) => {
   const {
+    icons: { CancelIcon, SaveIcon },
     localization,
     setCurrentEditingRow,
     onRowEditSubmit,
@@ -34,17 +33,17 @@ export const MRT_EditActionButtons: FC<Props> = ({ row }) => {
 
   return (
     <EditActionButtonWrappers>
-      <Tooltip arrow title={localization?.rowActionButtonCancel ?? ''}>
+      <Tooltip arrow title={localization.rowActionButtonCancel}>
         <IconButton
-          aria-label={localization?.rowActionButtonCancel}
+          aria-label={localization.rowActionButtonCancel}
           onClick={handleCancel}
         >
           <CancelIcon />
         </IconButton>
       </Tooltip>
-      <Tooltip arrow title={localization?.rowActionButtonSave ?? ''}>
+      <Tooltip arrow title={localization.rowActionButtonSave}>
         <IconButton
-          aria-label={localization?.rowActionButtonSave}
+          aria-label={localization.rowActionButtonSave}
           color="info"
           onClick={handleSave}
         >

package/src/buttons/MRT_ExpandAllButton.tsx

@@ -1,21 +1,18 @@
 import React, { FC } from 'react';
-import { IconButton, styled } from '@mui/material';
-import MuiArrowRightIcon from '@mui/icons-material/KeyboardDoubleArrowDown';
+import { IconButton } from '@mui/material';
 import { useMRT } from '../useMRT';
 import { MRT_TableButtonCell } from '../table/MRT_TableButtonCell';
 
-const ArrowRightIcon = styled(MuiArrowRightIcon, {
-  shouldForwardProp: (prop) => prop !== 'rotation',
-})<{ rotation?: number }>(({ rotation }) => ({
-  transform: `rotate(${rotation}deg)`,
-  transition: 'transform 0.2s',
-}));
-
 interface Props {}
 
 export const MRT_ExpandAllButton: FC<Props> = () => {
-  const { tableInstance, localization, anyRowsExpanded, densePadding } =
-    useMRT();
+  const {
+    tableInstance,
+    localization,
+    anyRowsExpanded,
+    densePadding,
+    icons: { DoubleArrowDownIcon },
+  } = useMRT();
 
   return (
     <MRT_TableButtonCell
@@ -24,14 +21,16 @@ export const MRT_ExpandAllButton: FC<Props> = () => {
       {...tableInstance.getToggleAllRowsExpandedProps()}
     >
       <IconButton
-        aria-label={localization?.expandAllButtonTitle}
-        title={localization?.expandAllButtonTitle}
+        aria-label={localization.expandAllButtonTitle}
+        title={localization.expandAllButtonTitle}
       >
-        <ArrowRightIcon
-          fontSize="small"
-          rotation={
-            tableInstance.isAllRowsExpanded ? -180 : anyRowsExpanded ? -90 : 0
-          }
+        <DoubleArrowDownIcon
+          style={{
+            transform: `rotate(${
+              tableInstance.isAllRowsExpanded ? -180 : anyRowsExpanded ? -90 : 0
+            }deg)`,
+            transition: 'transform 0.2s',
+          }}
         />
       </IconButton>
     </MRT_TableButtonCell>

package/src/buttons/MRT_ExpandButton.tsx

@@ -1,7 +1,6 @@
 import React, { FC } from 'react';
 import { IconButton, styled } from '@mui/material';
 import { Row } from 'react-table';
-import MuiExpandMoreIcon from '@mui/icons-material/ExpandMore';
 import { useMRT } from '../useMRT';
 import { MRT_TableButtonCell } from '../table/MRT_TableButtonCell';
 
@@ -12,37 +11,37 @@ const TableCell = styled(MRT_TableButtonCell, {
   textAlign: 'left',
 }));
 
-const ExpandMoreIcon = styled(MuiExpandMoreIcon, {
-  shouldForwardProp: (prop) => prop !== 'rotation',
-})<{ rotation?: number }>(({ rotation }) => ({
-  transform: `rotate(${rotation}deg)`,
-  transition: 'transform 0.2s',
-}));
-
 interface Props {
   row: Row;
 }
 
 export const MRT_ExpandButton: FC<Props> = ({ row }) => {
-  const { localization, densePadding, renderDetailPanel } = useMRT();
+  const {
+    densePadding,
+    icons: { ExpandMoreIcon },
+    localization,
+    renderDetailPanel,
+  } = useMRT();
 
   return (
     <TableCell size="small" densePadding={densePadding} depth={row.depth}>
       <IconButton
-        aria-label={localization?.expandButtonTitle}
+        aria-label={localization.expandButtonTitle}
         disabled={!row.canExpand && !renderDetailPanel}
-        title={localization?.expandButtonTitle}
+        title={localization.expandButtonTitle}
         {...row.getToggleRowExpandedProps()}
       >
         <ExpandMoreIcon
-          fontSize={row.canExpand || renderDetailPanel ? 'medium' : 'small'}
-          rotation={
-            !row.canExpand && !renderDetailPanel
-              ? -90
-              : row.isExpanded
-              ? -180
-              : 0
-          }
+          style={{
+            transform: `rotate(${
+              !row.canExpand && !renderDetailPanel
+                ? -90
+                : row.isExpanded
+                ? -180
+                : 0
+            }deg)`,
+            transition: 'transform 0.2s',
+          }}
         />
       </IconButton>
     </TableCell>

package/src/buttons/MRT_FullScreenToggleButton.tsx

@@ -1,23 +1,26 @@
 import React, { FC } from 'react';
 import { IconButton, IconButtonProps, Tooltip } from '@mui/material';
 import { useMRT } from '../useMRT';
-import FilterListIcon from '@mui/icons-material/Fullscreen';
-import FilterListOffIcon from '@mui/icons-material/FullscreenExit';
 
 interface Props extends IconButtonProps {}
 
 export const MRT_FullScreenToggleButton: FC<Props> = ({ ...rest }) => {
-  const { localization, setFullScreen, fullScreen } = useMRT();
+  const {
+    fullScreen,
+    icons: { FullscreenExitIcon, FullscreenIcon },
+    localization,
+    setFullScreen,
+  } = useMRT();
 
   return (
-    <Tooltip arrow title={localization?.toggleFullScreenButtonTitle ?? ''}>
+    <Tooltip arrow title={localization.toggleFullScreenButtonTitle}>
       <IconButton
-        aria-label={localization?.toggleFilterButtonTitle}
+        aria-label={localization.toggleFilterButtonTitle}
         onClick={() => setFullScreen(!fullScreen)}
         size="small"
         {...rest}
       >
-        {fullScreen ? <FilterListOffIcon /> : <FilterListIcon />}
+        {fullScreen ? <FullscreenExitIcon /> : <FullscreenIcon />}
       </IconButton>
     </Tooltip>
   );

package/src/buttons/MRT_ShowHideColumnsButton.tsx

@@ -8,7 +8,6 @@ import {
   Divider,
   IconButtonProps,
 } from '@mui/material';
-import ViewColumnIcon from '@mui/icons-material/ViewColumn';
 import { useMRT } from '../useMRT';
 import { MRT_ShowHideColumnsMenu } from '../menus/MRT_ShowHideColumnsMenu';
 
@@ -21,7 +20,11 @@ const MenuButtons = styled('div')({
 interface Props extends IconButtonProps {}
 
 export const MRT_ShowHideColumnsButton: FC<Props> = ({ ...rest }) => {
-  const { tableInstance, localization } = useMRT();
+  const {
+    tableInstance,
+    localization,
+    icons: { ViewColumnIcon },
+  } = useMRT();
 
   const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);
 
@@ -31,9 +34,9 @@ export const MRT_ShowHideColumnsButton: FC<Props> = ({ ...rest }) => {
 
   return (
     <>
-      <Tooltip arrow title={localization?.showHideColumnsButtonTitle ?? ''}>
+      <Tooltip arrow title={localization.showHideColumnsButtonTitle}>
         <IconButton
-          aria-label={localization?.showHideColumnsButtonTitle}
+          aria-label={localization.showHideColumnsButtonTitle}
           onClick={handleClick}
           size="small"
           {...rest}
@@ -54,13 +57,13 @@ export const MRT_ShowHideColumnsButton: FC<Props> = ({ ...rest }) => {
             }
             onClick={() => tableInstance.toggleHideAllColumns(true)}
           >
-            {localization?.columnShowHideMenuHideAll}
+            {localization.columnShowHideMenuHideAll}
           </Button>
           <Button
             disabled={tableInstance.getToggleHideAllColumnsProps().checked}
             onClick={() => tableInstance.toggleHideAllColumns(false)}
           >
-            {localization?.columnShowHideMenuShowAll}
+            {localization.columnShowHideMenuShowAll}
           </Button>
         </MenuButtons>
         <Divider />

package/src/buttons/MRT_ToggleColumnActionMenuButton.tsx

@@ -1,6 +1,5 @@
 import React, { FC, MouseEvent, useState } from 'react';
 import { IconButton as MuiIconButton, styled, Tooltip } from '@mui/material';
-import MoreVertIcon from '@mui/icons-material/MoreVert';
 import { useMRT } from '../useMRT';
 import { MRT_ColumnActionMenu } from '../menus/MRT_ColumnActionMenu';
 import { HeaderGroup } from 'react-table';
@@ -21,7 +20,10 @@ interface Props {
 }
 
 export const MRT_ToggleColumnActionMenuButton: FC<Props> = ({ column }) => {
-  const { localization } = useMRT();
+  const {
+    localization,
+    icons: { MoreVertIcon },
+  } = useMRT();
 
   const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);
 
@@ -37,10 +39,10 @@ export const MRT_ToggleColumnActionMenuButton: FC<Props> = ({ column }) => {
         arrow
         enterDelay={1000}
         enterNextDelay={1000}
-        title={localization?.columnActionMenuButtonTitle ?? ''}
+        title={localization.columnActionMenuButtonTitle}
       >
         <IconButton
-          aria-label={localization?.columnActionMenuButtonTitle}
+          aria-label={localization.columnActionMenuButtonTitle}
           onClick={handleClick}
           size="small"
         >

package/src/buttons/MRT_ToggleDensePaddingButton.tsx

@@ -1,18 +1,21 @@
 import React, { FC } from 'react';
 import { IconButton, IconButtonProps, Tooltip } from '@mui/material';
 import { useMRT } from '../useMRT';
-import DensityMediumIcon from '@mui/icons-material/DensityMedium';
-import DensitySmallIcon from '@mui/icons-material/DensitySmall';
 
 interface Props extends IconButtonProps {}
 
 export const MRT_ToggleDensePaddingButton: FC<Props> = ({ ...rest }) => {
-  const { densePadding, setDensePadding, localization } = useMRT();
+  const {
+    densePadding,
+    setDensePadding,
+    localization,
+    icons: { DensityMediumIcon, DensitySmallIcon },
+  } = useMRT();
 
   return (
-    <Tooltip arrow title={localization?.toggleDensePaddingSwitchTitle ?? ''}>
+    <Tooltip arrow title={localization.toggleDensePaddingSwitchTitle}>
       <IconButton
-        aria-label={localization?.toggleDensePaddingSwitchTitle}
+        aria-label={localization.toggleDensePaddingSwitchTitle}
         onClick={() => setDensePadding(!densePadding)}
         size="small"
         {...rest}

package/src/buttons/MRT_ToggleFiltersButton.tsx

@@ -1,18 +1,21 @@
 import React, { FC } from 'react';
 import { IconButton, IconButtonProps, Tooltip } from '@mui/material';
 import { useMRT } from '../useMRT';
-import FilterListIcon from '@mui/icons-material/FilterList';
-import FilterListOffIcon from '@mui/icons-material/FilterListOff';
 
 interface Props extends IconButtonProps {}
 
 export const MRT_ToggleFiltersButton: FC<Props> = ({ ...rest }) => {
-  const { localization, setShowFilters, showFilters } = useMRT();
+  const {
+    localization,
+    setShowFilters,
+    showFilters,
+    icons: { FilterListIcon, FilterListOffIcon },
+  } = useMRT();
 
   return (
-    <Tooltip arrow title={localization?.toggleFilterButtonTitle ?? ''}>
+    <Tooltip arrow title={localization.toggleFilterButtonTitle}>
       <IconButton
-        aria-label={localization?.toggleFilterButtonTitle}
+        aria-label={localization.toggleFilterButtonTitle}
         onClick={() => setShowFilters(!showFilters)}
         size="small"
         {...rest}

package/src/buttons/MRT_ToggleRowActionMenuButton.tsx

@@ -1,7 +1,5 @@
 import React, { FC, MouseEvent, useState } from 'react';
 import { IconButton as MuiIconButton, styled, Tooltip } from '@mui/material';
-import MoreHorizIcon from '@mui/icons-material/MoreHoriz';
-import EditIcon from '@mui/icons-material/Edit';
 import { useMRT } from '../useMRT';
 import { Row } from 'react-table';
 import { MRT_RowActionMenu } from '../menus/MRT_RowActionMenu';
@@ -27,11 +25,12 @@ export const MRT_ToggleRowActionMenuButton: FC<Props> = ({ row }) => {
   const {
     currentEditingRow,
     densePadding,
+    enableRowEditing,
+    icons: {EditIcon, MoreHorizIcon},
     localization,
     renderRowActionMenuItems,
-    enableRowEditing,
-    setCurrentEditingRow,
     renderRowActions,
+    setCurrentEditingRow,
     tableInstance,
   } = useMRT();
 
@@ -58,7 +57,7 @@ export const MRT_ToggleRowActionMenuButton: FC<Props> = ({ row }) => {
         <Tooltip
           placement="right"
           arrow
-          title={localization?.rowActionMenuItemEdit ?? ''}
+          title={localization.rowActionMenuItemEdit}
         >
           <IconButton onClick={handleEdit}>
             <EditIcon />
@@ -67,8 +66,8 @@ export const MRT_ToggleRowActionMenuButton: FC<Props> = ({ row }) => {
       ) : renderRowActionMenuItems ? (
         <>
           <IconButton
-            aria-label={localization?.rowActionMenuButtonTitle}
-            title={localization?.rowActionMenuButtonTitle}
+            aria-label={localization.rowActionMenuButtonTitle}
+            title={localization.rowActionMenuButtonTitle}
             onClick={handleOpenRowActionMenu}
             size="small"
           >

package/src/buttons/MRT_ToggleSearchButton.tsx

@@ -1,14 +1,17 @@
 import React, { FC } from 'react';
 import { IconButton, IconButtonProps, Tooltip } from '@mui/material';
 import { useMRT } from '../useMRT';
-import SearchIcon from '@mui/icons-material/Search';
-import SearchOffIcon from '@mui/icons-material/SearchOff';
 
 interface Props extends IconButtonProps {}
 
 export const MRT_ToggleSearchButton: FC<Props> = ({ ...rest }) => {
-  const { localization, setShowSearch, showSearch, muiSearchTextFieldProps } =
-    useMRT();
+  const {
+    icons: { SearchIcon, SearchOffIcon },
+    localization,
+    muiSearchTextFieldProps,
+    setShowSearch,
+    showSearch,
+  } = useMRT();
 
   const handleToggleSearch = () => {
     setShowSearch(!showSearch);
@@ -24,7 +27,7 @@ export const MRT_ToggleSearchButton: FC<Props> = ({ ...rest }) => {
   };
 
   return (
-    <Tooltip arrow title={localization?.toggleSearchButtonTitle ?? ''}>
+    <Tooltip arrow title={localization.toggleSearchButtonTitle}>
       <IconButton size="small" onClick={handleToggleSearch} {...rest}>
         {showSearch ? <SearchOffIcon /> : <SearchIcon />}
       </IconButton>

package/src/head/MRT_TableHeadCell.tsx

@@ -92,15 +92,15 @@ export const MRT_TableHeadCell: FC<Props> = ({ column }) => {
 
   const sortTooltip = column.isSorted
     ? column.isSortedDesc
-      ? localization?.columnActionMenuItemClearSort ?? ''
-      : localization?.columnActionMenuItemSortDesc?.replace(
+      ? localization.columnActionMenuItemClearSort
+      : localization.columnActionMenuItemSortDesc?.replace(
           '{column}',
           column.Header as string,
-        ) ?? ''
-    : localization?.columnActionMenuItemSortAsc?.replace(
+        )
+    : localization.columnActionMenuItemSortAsc?.replace(
         '{column}',
         column.Header as string,
-      ) ?? '';
+      );
 
   return (
     <MRT_StyledTableHeadCell

package/src/head/MRT_TableHeadCellActions.tsx

@@ -12,7 +12,7 @@ export const MRT_TableHeadCellActions: FC<Props> = () => {
       densePadding={densePadding}
       style={{ textAlign: 'center' }}
     >
-      {localization?.actionsHeadColumnTitle}
+      {localization.actionsHeadColumnTitle}
     </MRT_StyledTableHeadCell>
   );
 };

package/src/icons.tsx

@@ -0,0 +1,72 @@
+import CancelIcon from '@mui/icons-material/Cancel';
+import ClearAllIcon from '@mui/icons-material/ClearAll';
+import CloseIcon from '@mui/icons-material/Close';
+import DensityMediumIcon from '@mui/icons-material/DensityMedium';
+import DensitySmallIcon from '@mui/icons-material/DensitySmall';
+import DoubleArrowDownIcon from '@mui/icons-material/KeyboardDoubleArrowDown';
+import DynamicFeedIcon from '@mui/icons-material/DynamicFeed';
+import EditIcon from '@mui/icons-material/Edit';
+import ExpandLessIcon from '@mui/icons-material/ExpandLess';
+import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
+import FilterListIcon from '@mui/icons-material/FilterList';
+import FilterListOffIcon from '@mui/icons-material/FilterListOff';
+import FullscreenExitIcon from '@mui/icons-material/FullscreenExit';
+import FullscreenIcon from '@mui/icons-material/Fullscreen';
+import MoreHorizIcon from '@mui/icons-material/MoreHoriz';
+import MoreVertIcon from '@mui/icons-material/MoreVert';
+import SaveIcon from '@mui/icons-material/Save';
+import SearchIcon from '@mui/icons-material/Search';
+import SearchOffIcon from '@mui/icons-material/SearchOff';
+import SortIcon from '@mui/icons-material/Sort';
+import ViewColumnIcon from '@mui/icons-material/ViewColumn';
+import VisibilityOffIcon from '@mui/icons-material/VisibilityOff';
+
+export interface MRT_Icons {
+  CancelIcon: any;
+  ClearAllIcon: any;
+  CloseIcon: any;
+  DensityMediumIcon: any;
+  DensitySmallIcon: any;
+  DoubleArrowDownIcon: any;
+  DynamicFeedIcon: any;
+  EditIcon: any;
+  ExpandLessIcon: any;
+  ExpandMoreIcon: any;
+  FilterListIcon: any;
+  FilterListOffIcon: any;
+  FullscreenExitIcon: any;
+  FullscreenIcon: any;
+  MoreHorizIcon: any;
+  MoreVertIcon: any;
+  SaveIcon: any;
+  SearchIcon: any;
+  SearchOffIcon: any;
+  SortIcon: any;
+  ViewColumnIcon: any;
+  VisibilityOffIcon: any;
+}
+
+export const MRT_Default_Icons: MRT_Icons = {
+  CancelIcon,
+  ClearAllIcon,
+  CloseIcon,
+  DensityMediumIcon,
+  DensitySmallIcon,
+  DoubleArrowDownIcon,
+  DynamicFeedIcon,
+  EditIcon,
+  ExpandLessIcon,
+  ExpandMoreIcon,
+  FilterListIcon,
+  FilterListOffIcon,
+  FullscreenExitIcon,
+  FullscreenIcon,
+  MoreHorizIcon,
+  MoreVertIcon,
+  SaveIcon,
+  SearchIcon,
+  SearchOffIcon,
+  SortIcon,
+  ViewColumnIcon,
+  VisibilityOffIcon,
+};