material-react-table 0.14.0 → 0.14.3

package/README.md

@@ -1,17 +1,20 @@
 # Material React Table
 
+<a href="https://npmjs.com/package/material-react-table" target="_blank_">
+  <img alt="" src="https://badgen.net/npm/v/material-react-table" />
+</a>
 <a href="https://bundlephobia.com/result?p=material-react-table" target="_blank_">
   <img alt="" src="https://badgen.net/bundlephobia/minzip/material-react-table@latest" />
 </a>
-
 <a href="https://npmjs.com/package/material-react-table" target="_blank_">
   <img alt="" src="https://img.shields.io/npm/dm/material-react-table.svg" />
 </a>
-
 <a href="https://github.com/KevinVandy/material-react-table" target="_blank_">
   <img alt="" src="https://img.shields.io/github/stars/KevinVandy/material-react-table.svg?style=social&label=Star" />
 </a>
 
+---
+
 > This Project is based on `@tanstack/react-table` v8, which itself is still in beta, so therefore this package is also still in alpha/beta
 
 - A fully featured Material UI V5 implementation of Tanstack React Table v8 (beta)
@@ -31,6 +34,8 @@ View the [github source code](https://github.com/KevinVandy/material-react-table
 
 Join the [discord](https://discord.gg/5wqyRx6fnm) server to join in on the development discussion or ask questions
 
+---
+
 ### Features (All Features work and are MVP, but are still being polished)
 
 _All features can easily be enabled/disabled_
@@ -65,6 +70,8 @@ _All features can easily be enabled/disabled_
 - [x] Tree Data / Expanding Sub-rows
 - [x] Virtualization (react-virtual)
 
+---
+
 ### Installation
 
 1. Install Peer Dependencies (Material UI v5)
@@ -79,4 +86,14 @@ npm install @mui/material @mui/icons-material @emotion/react @emotion/styled
 npm install material-react-table
 ```
 
-_`@tanstack/react-table`, `react-virtual` and `react-dnd`_ are internal dependencies, so you don't need to install them yourself.
+_`@tanstack/react-table`, `react-virtual` and `react-dnd`_ are internal dependencies, so you don't need to install them yourself.
+
+---
+
+### Contributors
+
+<a href="https://github.com/kevinvandy/material-react-table/graphs/contributors">
+  <img src="https://contrib.rocks/image?repo=kevinvandy/material-react-table" />
+</a>
+
+PRs are Welcome, but please discuss in [GitHub Discussions](https://github.com/KevinVandy/material-react-table/discussions) or the [Discord Server](https://discord.gg/5wqyRx6fnm) first!

package/dist/{buttons/MRT_ToggleColumnActionMenuButton.d.ts → head/MRT_TableHeadCellColumnActionsButton.d.ts}

@@ -4,5 +4,5 @@ interface Props {
     header: MRT_Header;
     instance: MRT_TableInstance;
 }
-export declare const MRT_ToggleColumnActionMenuButton: FC<Props>;
+export declare const MRT_TableHeadCellColumnActionsButton: FC<Props>;
 export {};

package/dist/material-react-table.cjs.development.js

@@ -5687,7 +5687,9 @@ var MRT_ToolbarBottom = function MRT_ToolbarBottom(_ref) {
       }), {
         bottom: isFullScreen ? '0' : undefined,
         boxShadow: "-3px 0 6px " + material.alpha(theme.palette.common.black, 0.1),
-        position: isFullScreen ? 'fixed' : 'relative'
+        left: 0,
+        position: isFullScreen ? 'fixed' : 'relative',
+        right: 0
       }, toolbarProps == null ? void 0 : toolbarProps.sx);
     }
   }), React__default.createElement(MRT_LinearProgressBar, {
@@ -6052,7 +6054,8 @@ var MRT_TableHeadCellFilterLabel = function MRT_TableHeadCellFilterLabel(_ref) {
       '&:hover': {
         backgroundColor: 'transparent',
         opacity: 0.8
-      }
+      },
+      width: '1.5ch'
     }
   }, showFilters && !column.getFilterValue() ? React__default.createElement(FilterAltOffIcon, null) : React__default.createElement(FilterAltIcon, null)));
 };
@@ -6081,6 +6084,7 @@ var MRT_TableHeadCellResizeHandle = function MRT_TableHeadCellResizeHandle(_ref)
         height: showFilters && columnDefType === 'data' ? '4rem' : '2rem',
         opacity: 0.8,
         position: 'absolute',
+        mr: '-1rem',
         right: '1px',
         touchAction: 'none',
         transition: column.getIsResizing() ? undefined : 'all 0.2s ease-in-out',
@@ -6114,11 +6118,15 @@ var MRT_TableHeadCellSortLabel = function MRT_TableHeadCellSortLabel(_ref) {
   }, React__default.createElement(material.TableSortLabel, {
     "aria-label": sortTooltip,
     active: !!column.getIsSorted(),
-    direction: column.getIsSorted() ? column.getIsSorted() : undefined
+    direction: column.getIsSorted() ? column.getIsSorted() : undefined,
+    sx: {
+      width: '2ch',
+      transform: 'translateX(-0.5ch)'
+    }
   }));
 };
 
-var MRT_ToggleColumnActionMenuButton = function MRT_ToggleColumnActionMenuButton(_ref) {
+var MRT_TableHeadCellColumnActionsButton = function MRT_TableHeadCellColumnActionsButton(_ref) {
   var header = _ref.header,
       instance = _ref.instance;
   var _instance$options = instance.options,
@@ -6162,7 +6170,6 @@ var MRT_ToggleColumnActionMenuButton = function MRT_ToggleColumnActionMenuButton
   }, iconButtonProps, {
     sx: _extends({
       height: '2rem',
-      mr: '2px',
       mt: '-0.2rem',
       opacity: 0.5,
       transition: 'opacity 0.2s',
@@ -6268,6 +6275,7 @@ var MRT_TableHeadCell = function MRT_TableHeadCell(_ref) {
       display: 'flex',
       justifyContent: columnDefType === 'group' ? 'center' : 'space-between',
       opacity: isDragging ? 0.5 : 1,
+      position: 'relative',
       width: '100%'
     }
   }, React__default.createElement(material.Box, {
@@ -6294,7 +6302,7 @@ var MRT_TableHeadCell = function MRT_TableHeadCell(_ref) {
   }, columnDefType === 'data' && (enableColumnOrdering && columnDef.enableColumnOrdering !== false || enableGrouping && columnDef.enableGrouping !== false) && React__default.createElement(MRT_GrabHandleButton, {
     ref: dragRef,
     instance: instance
-  }), (enableColumnActions || columnDef.enableColumnActions) && columnDef.enableColumnActions !== false && columnDefType !== 'group' && React__default.createElement(MRT_ToggleColumnActionMenuButton, {
+  }), (enableColumnActions || columnDef.enableColumnActions) && columnDef.enableColumnActions !== false && columnDefType !== 'group' && React__default.createElement(MRT_TableHeadCellColumnActionsButton, {
     header: header,
     instance: instance
   })), column.getCanResize() && React__default.createElement(MRT_TableHeadCellResizeHandle, {
@@ -7060,6 +7068,7 @@ var MRT_TableBodyCell = function MRT_TableBodyCell(_ref) {
       muiTableBodyCellProps = _instance$options.muiTableBodyCellProps,
       muiTableBodyCellSkeletonProps = _instance$options.muiTableBodyCellSkeletonProps,
       onCellClick = _instance$options.onCellClick,
+      onRowClick = _instance$options.onRowClick,
       rowNumberMode = _instance$options.rowNumberMode,
       tableId = _instance$options.tableId,
       setColumnOrder = instance.setColumnOrder,
@@ -7146,7 +7155,7 @@ var MRT_TableBodyCell = function MRT_TableBodyCell(_ref) {
       return _extends({
         backgroundColor: column.getIsPinned() ? material.alpha(material.lighten(theme.palette.background["default"], 0.04), 0.95) : undefined,
         boxShadow: getIsLastLeftPinnedColumn() ? "4px 0 4px -2px " + material.alpha(theme.palette.common.black, 0.1) : getIsFirstRightPinnedColumn() ? "-4px 0 4px -2px " + material.alpha(theme.palette.common.black, 0.1) : undefined,
-        cursor: isEditable && editingMode === 'cell' ? 'pointer' : 'text',
+        cursor: isEditable && editingMode === 'cell' || onRowClick || onCellClick ? 'pointer' : 'text',
         left: column.getIsPinned() === 'left' ? column.getStart('left') + "px" : undefined,
         overflow: 'hidden',
         p: density === 'compact' ? columnDefType === 'display' ? '0 0.5rem' : '0.5rem' : density === 'comfortable' ? columnDefType === 'display' ? '0.5rem 0.75rem' : '1rem' : columnDefType === 'display' ? '1rem 1.25rem' : '1.5rem',