@redsift/table 11.0.0-muiv5-alpha.3 → 11.0.0-muiv5-alpha.4

package/index.d.ts

@@ -157,6 +157,21 @@ type StyledDataGridProps = {
 
 declare const DataGrid: Comp<DataGridProps, HTMLDivElement>;
 
+interface StatefulDataGridProps extends DataGridProps {
+    /** Hook returning pathname, search params and a method to update query params. */
+    useRouter: () => {
+        pathname: string;
+        search: string;
+        historyReplace: (newSearch: string) => void;
+    };
+    /** Pinned custom columns. */
+    pinnedCustomColumns?: Required<GridPinnedColumns>;
+    /** Local Storage version, to upgrade when we want to force a clean out. */
+    localStorageVersion?: number;
+}
+
+declare const StatefulDataGrid: Comp<StatefulDataGridProps, HTMLDivElement>;
+
 interface ExtendedGridPaginationModel {
     page: number;
     pageSize: number;
@@ -319,19 +334,6 @@ type ServerSideControlledPaginationProps = {
 declare const onServerSideSelectionStatusChange: (newSelectionModel: GridSelectionModel, apiRef: React.MutableRefObject<GridApiPro>, selectionStatus: React.MutableRefObject<SelectionStatus>, isRowSelectable: ((params: GridRowParams<any>) => boolean) | undefined, page: number, pageSize: number) => void;
 declare const ServerSideControlledPagination: React.FC<ServerSideControlledPaginationProps>;
 
-interface StatefulDataGridProps extends DataGridProps {
-    /** Hook returning pathname, search params and a method to update query params. */
-    useRouter: () => {
-        pathname: string;
-        search: string;
-        historyReplace: (newSearch: string) => void;
-    };
-    /** Pinned custom columns. */
-    pinnedCustomColumns?: Required<GridPinnedColumns>;
-}
-
-declare const StatefulDataGrid: Comp<StatefulDataGridProps, HTMLDivElement>;
-
 interface TextCellProps extends ComponentProps<'div'> {
     /** Including Badge Component. */
     badge?: ReactNode;

package/index.js

@@ -26167,7 +26167,6 @@ const useTableStates = (id, version, customDefaults) => {
   };
 };
 
-const DATAGRID_VERSION = 1;
 const useStatefulTable = props => {
   const {
     // density = 'standard',
@@ -26185,7 +26184,7 @@ const useStatefulTable = props => {
       right: []
     },
     useRouter,
-    version = DATAGRID_VERSION
+    localStorageVersion = 1
   } = props;
   const {
     search,
@@ -26213,10 +26212,10 @@ const useStatefulTable = props => {
     setPinnedColumns,
     dimensionModel,
     setDimensionModel
-  } = useTableStates(id, version, customDefaults);
+  } = useTableStates(id, localStorageVersion, customDefaults);
 
   // clearing up old version keys, triggering only on first render
-  useEffect(() => clearPreviousVersionStorage(id, version), [id, version]);
+  useEffect(() => clearPreviousVersionStorage(id, localStorageVersion), [id, localStorageVersion]);
   const onColumnDimensionChange = useCallback(_ref => {
     let {
       newWidth,
@@ -26248,6 +26247,11 @@ const useStatefulTable = props => {
     column.width = dimensionModel[column.field] || column.width || 100;
     return column;
   }), [propsColumns, dimensionModel]);
+
+  /** Add resetPage method to apiRef. */
+  apiRef.current.resetPage = () => {
+    apiRef.current.setPage(0);
+  };
   return {
     apiRef,
     columns,
@@ -26343,7 +26347,7 @@ const useStatefulTable = props => {
   };
 };
 
-const _excluded$1 = ["apiRef", "autoHeight", "className", "columns", "columnTypes", "components", "componentsProps", "filterModel", "columnVisibilityModel", "pinnedColumns", "sortModel", "page", "pageSize", "height", "hideToolbar", "initialState", "isRowSelectable", "license", "onFilterModelChange", "selectionModel", "onColumnWidthChange", "onPageChange", "onPageSizeChange", "onSelectionModelChange", "onColumnVisibilityModelChange", "onPinnedColumnsChange", "onSortModelChange", "pagination", "paginationPlacement", "paginationProps", "pinnedCustomColumns", "rows", "rowsPerPageOptions", "sx", "theme", "useRouter", "paginationMode", "rowCount"];
+const _excluded$1 = ["apiRef", "autoHeight", "className", "columns", "columnTypes", "components", "componentsProps", "filterModel", "columnVisibilityModel", "pinnedColumns", "sortModel", "page", "pageSize", "height", "hideToolbar", "initialState", "isRowSelectable", "license", "localStorageVersion", "onFilterModelChange", "selectionModel", "onColumnWidthChange", "onPageChange", "onPageSizeChange", "onSelectionModelChange", "onColumnVisibilityModelChange", "onPinnedColumnsChange", "onSortModelChange", "pagination", "paginationPlacement", "paginationProps", "pinnedCustomColumns", "rows", "rowsPerPageOptions", "sx", "theme", "useRouter", "paginationMode", "rowCount"];
 const COMPONENT_NAME$1 = 'DataGrid';
 const CLASSNAME$1 = 'redsift-datagrid';
 const StatefulDataGrid = /*#__PURE__*/forwardRef((props, ref) => {
@@ -26367,6 +26371,7 @@ const StatefulDataGrid = /*#__PURE__*/forwardRef((props, ref) => {
       initialState,
       isRowSelectable,
       license = process.env.MUI_LICENSE_KEY,
+      localStorageVersion,
       onFilterModelChange: propsOnFilterModelChange,
       selectionModel: propsSelectionModel,
       onColumnWidthChange: propsOnColumnWidthChange,
@@ -26443,7 +26448,8 @@ const StatefulDataGrid = /*#__PURE__*/forwardRef((props, ref) => {
     onPinnedColumnsChange: controlledOnPinnedColumnsChange,
     onSortModelChange: controlledOnSortModelChange,
     pinnedCustomColumns,
-    useRouter: useRouter
+    useRouter: useRouter,
+    localStorageVersion
   });
   const [selectionModel, setSelectionModel] = useState(propsSelectionModel !== null && propsSelectionModel !== void 0 ? propsSelectionModel : []);
   useEffect(() => {