material-react-table 0.16.1 → 0.16.2

package/dist/material-react-table.esm.js

@@ -24,10 +24,6 @@ function _extends() {
   return _extends.apply(this, arguments);
 }
 
-function _objectDestructuringEmpty(obj) {
-  if (obj == null) throw new TypeError("Cannot destructure undefined");
-}
-
 function _objectWithoutPropertiesLoose(source, excluded) {
   if (source == null) return {};
   var target = {};
@@ -623,13 +619,13 @@ var createDataColumn = function createDataColumn(table, column, currentFilterFns
 var createDisplayColumn = function createDisplayColumn(table, column) {
   return table.createDisplayColumn(column);
 };
-var reorderColumn = function reorderColumn(movingColumn, receivingColumn, columnOrder, setColumnOrder) {
+var reorderColumn = function reorderColumn(movingColumn, receivingColumn, columnOrder) {
   if (movingColumn.getCanPin()) {
     movingColumn.pin(receivingColumn.getIsPinned());
   }
 
   columnOrder.splice(columnOrder.indexOf(receivingColumn.id), 0, columnOrder.splice(columnOrder.indexOf(movingColumn.id), 1)[0]);
-  setColumnOrder([].concat(columnOrder));
+  return [].concat(columnOrder);
 };
 var getLeadingDisplayColumnIds = function getLeadingDisplayColumnIds(props) {
   return [(props.positionActionsColumn === 'first' && props.enableRowActions || props.enableEditing && props.editingMode === 'row') && 'mrt-row-actions', (props.enableExpanding || props.enableGrouping) && 'mrt-expand', props.enableRowSelection && 'mrt-select', props.enableRowNumbers && 'mrt-row-numbers'].filter(Boolean);
@@ -656,12 +652,10 @@ var MRT_ShowHideColumnsMenuItems = function MRT_ShowHideColumnsMenuItems(_ref) {
       enableHiding = _instance$options.enableHiding,
       enablePinning = _instance$options.enablePinning,
       localization = _instance$options.localization,
-      onColumnVisibilityChanged = _instance$options.onColumnVisibilityChanged,
       setColumnOrder = instance.setColumnOrder;
 
   var _getState = getState(),
-      columnOrder = _getState.columnOrder,
-      columnVisibility = _getState.columnVisibility;
+      columnOrder = _getState.columnOrder;
 
   var columnDef = column.columnDef,
       columnDefType = column.columnDefType;
@@ -669,7 +663,8 @@ var MRT_ShowHideColumnsMenuItems = function MRT_ShowHideColumnsMenuItems(_ref) {
   var _useDrop = useDrop({
     accept: 'column',
     drop: function drop(movingColumn) {
-      return reorderColumn(movingColumn, column, columnOrder, setColumnOrder);
+      var newColumnOrder = reorderColumn(movingColumn, column, columnOrder);
+      setColumnOrder(newColumnOrder);
     }
   }),
       dropRef = _useDrop[1];
@@ -702,12 +697,6 @@ var MRT_ShowHideColumnsMenuItems = function MRT_ShowHideColumnsMenuItems(_ref) {
     } else {
       column.toggleVisibility();
     }
-
-    onColumnVisibilityChanged == null ? void 0 : onColumnVisibilityChanged({
-      column: column,
-      columnVisibility: columnVisibility,
-      instance: instance
-    });
   };
 
   return React.createElement(React.Fragment, null, React.createElement(MenuItem, {
@@ -2580,11 +2569,8 @@ var MRT_TableHeadCell = function MRT_TableHeadCell(_ref) {
 var MRT_DraggableTableHeadCell = function MRT_DraggableTableHeadCell(_ref) {
   var header = _ref.header,
       instance = _ref.instance;
-  var getState = instance.getState;
-
-  _objectDestructuringEmpty(instance.options);
-
-  var setColumnOrder = instance.setColumnOrder;
+  var getState = instance.getState,
+      setColumnOrder = instance.setColumnOrder;
 
   var _getState = getState(),
       columnOrder = _getState.columnOrder;
@@ -2594,7 +2580,8 @@ var MRT_DraggableTableHeadCell = function MRT_DraggableTableHeadCell(_ref) {
   var _useDrop = useDrop({
     accept: 'column',
     drop: function drop(movingColumn) {
-      return reorderColumn(movingColumn, column, columnOrder, setColumnOrder);
+      var newColumnOrder = reorderColumn(movingColumn, column, columnOrder);
+      setColumnOrder(newColumnOrder);
     }
   }),
       dropRef = _useDrop[1];
@@ -2861,7 +2848,8 @@ var MRT_TableBodyCell = function MRT_TableBodyCell(_ref) {
   var _useDrop = useDrop({
     accept: 'column',
     drop: function drop(movingColumn) {
-      return reorderColumn(movingColumn, column, columnOrder, setColumnOrder);
+      var newColumnOrder = reorderColumn(movingColumn, column, columnOrder);
+      setColumnOrder(newColumnOrder);
     }
   }),
       dropRef = _useDrop[1];
@@ -3611,6 +3599,27 @@ var MRT_TableRoot = function MRT_TableRoot(props) {
       (_sessionStorage = sessionStorage).setItem.apply(_sessionStorage, itemArgs);
     }
   }, [props.enablePersistentState, props.tableId, props.persistentStateMode, instance]);
+  useEffect(function () {
+    props == null ? void 0 : props.onColumnOrderChanged == null ? void 0 : props.onColumnOrderChanged({
+      columnOrder: instance.getState().columnOrder,
+      //@ts-ignore
+      instance: instance
+    });
+  }, [instance.getState().columnOrder]);
+  useEffect(function () {
+    props == null ? void 0 : props.onColumnPinningChanged == null ? void 0 : props.onColumnPinningChanged({
+      columnPinning: instance.getState().columnPinning,
+      //@ts-ignore
+      instance: instance
+    });
+  }, [instance.getState().columnPinning]);
+  useEffect(function () {
+    props == null ? void 0 : props.onColumnVisibilityChanged == null ? void 0 : props.onColumnVisibilityChanged({
+      columnPinning: instance.getState().columnVisibility,
+      //@ts-ignore
+      instance: instance
+    });
+  }, [instance.getState().columnVisibility]);
   return React.createElement(React.Fragment, null, React.createElement(Dialog, {
     PaperComponent: Box,
     TransitionComponent: Grow,