@redsift/table 11.2.0-muiv5 → 11.2.1-muiv5

package/index.d.ts

@@ -1,5 +1,5 @@
 import * as _mui_x_data_grid_pro from '@mui/x-data-grid-pro';
-import { GridNativeColTypes, GridColumnTypesRecord, GridFilterItem, GridCellParams, GridFilterOperator, GridFilterInputValue, GridFilterInputMultipleValue, DataGridProProps, GridPinnedColumns, GridFilterModel, GridSortModel, GridSortItem, GridColumnVisibilityModel, GridSlotsComponent, GridSelectionModel, GridRowParams, GridToolbarExportProps, GridToolbarFilterButtonProps, GridToolbarColumnsButton, GridToolbarDensitySelector } from '@mui/x-data-grid-pro';
+import { GridNativeColTypes, GridColumnTypesRecord, GridFilterItem, GridCellParams, GridFilterOperator, GridFilterInputValue, GridFilterInputMultipleValue, DataGridProProps, GridFilterModel, GridSortModel, GridSortItem, GridColumnVisibilityModel, GridPinnedColumns, GridSlotsComponent, GridSelectionModel, GridRowParams, GridToolbarExportProps, GridToolbarFilterButtonProps, GridToolbarColumnsButton, GridToolbarDensitySelector } from '@mui/x-data-grid-pro';
 export { GridAlignment, GridColDef, GridColumns, GridFilterItem, GridFilterModel, GridSelectionModel, getGridBooleanOperators, getGridDateOperators, getGridSingleSelectOperators } from '@mui/x-data-grid-pro';
 import { GridInitialStatePro } from '@mui/x-data-grid-pro/models/gridStatePro';
 import React, { ReactNode, ComponentProps, MutableRefObject, RefObject } from 'react';
@@ -132,16 +132,6 @@ interface DataGridProps extends Partial<Pick<DataGridProProps, 'rows'>>, Omit<Da
     paginationProps?: Omit<TablePaginationProps, 'component' | 'count' | 'page' | 'onPageChange' | 'rowsPerPage' | 'onRowsPerPageChange' | 'rowsPerPageOptions' | 'paginationMode'>;
     /** Theme. */
     theme?: Theme;
-    /** If set, the DataGrid configuration will be stored and synced in the URL and the local storage. useRouter prop should be defined. */
-    isStateful?: boolean;
-    /** Hook returning pathname, search params and a method to update query params. Used in stateful mode only. */
-    useRouter?: () => {
-        pathname: string;
-        search: string;
-        historyReplace: (newSearch: string) => void;
-    };
-    /** Pinned custom columns. */
-    pinnedCustomColumns?: Required<GridPinnedColumns>;
 }
 type SelectionStatus = {
     type: 'page' | 'table' | 'other' | 'none';
@@ -165,8 +155,6 @@ interface StatefulDataGridProps extends DataGridProps {
         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;
 }
@@ -189,15 +177,15 @@ declare const numberOperatorDecoder: Record<string, string>;
 declare const getFilterModelFromString: (searchString: string, columns: DataGridProps['columns']) => GridFilterModel | 'invalid';
 declare const getSearchParamsFromFilterModel: (filterModel: GridFilterModel) => URLSearchParams;
 /** SORT */
-declare const getSortingFromString: (searchString: string, columns: DataGridProps['columns']) => GridSortModel | null;
+declare const getSortingFromString: (searchString: string, columns: DataGridProps['columns']) => GridSortModel | 'invalid';
 declare const getSearchParamsFromSorting: (sorting: GridSortItem[]) => URLSearchParams;
 /** PAGINATION */
-declare const getPaginationFromString: (searchString: string) => ExtendedGridPaginationModel | null;
+declare const getPaginationFromString: (searchString: string) => ExtendedGridPaginationModel | 'invalid';
 declare const getSearchParamsFromPagination: (pagination: ExtendedGridPaginationModel) => URLSearchParams;
 /** COLUMN VISIBILITY */
 declare const getSearchParamsFromColumnVisibility: (columnVisibility: GridColumnVisibilityModel, columns: DataGridProps['columns']) => URLSearchParams;
-declare const getColumnVisibilityFromString: (notParsed: string, tableColumns: DataGridProps['columns']) => GridColumnVisibilityModel | null;
-declare const getPinnedColumnsFromString: (notParsed: string, tableColumns: DataGridProps['columns']) => PinnedColumns | null;
+declare const getColumnVisibilityFromString: (notParsed: string, tableColumns: DataGridProps['columns']) => GridColumnVisibilityModel | 'invalid';
+declare const getPinnedColumnsFromString: (notParsed: string, tableColumns: DataGridProps['columns']) => PinnedColumns | 'invalid';
 declare const getSearchParamsFromPinnedColumns: (pinnedColumns: GridPinnedColumns) => URLSearchParams;
 declare const getSearchParamsFromTab: (search: string) => URLSearchParams;
 type FinalSearchInput = {

package/index.js

@@ -1,4 +1,4 @@
-import { GRID_DETAIL_PANEL_TOGGLE_COL_DEF, getGridNumericOperators as getGridNumericOperators$1, GridFilterInputValue, GridFilterInputMultipleValue, getGridStringOperators as getGridStringOperators$1, getGridBooleanOperators, getGridDateOperators, getGridSingleSelectOperators, GridLinkOperator, GridToolbarContainer, GridToolbarFilterButton, GridToolbarColumnsButton, GridToolbarDensitySelector, GridToolbarExport, gridVisibleSortedRowIdsSelector, gridPaginatedVisibleSortedGridRowEntriesSelector, gridPaginatedVisibleSortedGridRowIdsSelector, gridFilteredSortedRowEntriesSelector, gridFilteredSortedRowIdsSelector, useGridApiRef, DataGridPro, GRID_CHECKBOX_SELECTION_COL_DEF } from '@mui/x-data-grid-pro';
+import { GRID_DETAIL_PANEL_TOGGLE_COL_DEF, getGridNumericOperators as getGridNumericOperators$1, GridFilterInputValue, GridFilterInputMultipleValue, getGridStringOperators as getGridStringOperators$1, getGridBooleanOperators, getGridDateOperators, getGridSingleSelectOperators, GridLinkOperator, GridToolbarContainer, GridToolbarFilterButton, GridToolbarColumnsButton, GridToolbarDensitySelector, GridToolbarExport, gridVisibleSortedRowIdsSelector, gridPaginatedVisibleSortedGridRowEntriesSelector, gridPaginatedVisibleSortedGridRowIdsSelector, gridFilteredSortedRowEntriesSelector, gridFilteredSortedRowIdsSelector, useGridApiRef, DataGridPro } from '@mui/x-data-grid-pro';
 export { getGridBooleanOperators, getGridDateOperators, getGridSingleSelectOperators } from '@mui/x-data-grid-pro';
 import * as React from 'react';
 import React__default, { Children, isValidElement, cloneElement, forwardRef, useLayoutEffect, useEffect, useRef, useContext, useState, useCallback, createElement, useMemo } from 'react';
@@ -18250,7 +18250,7 @@ const getFilterModel = (search, columns, localStorageFilters, setLocalStorageFil
 
 const getSortingFromString = (searchString, columns) => {
   if (!searchString) {
-    return null;
+    return 'invalid';
   }
   const searchParams = new URLSearchParams(searchString);
   const value = searchParams.get('_sortColumn');
@@ -18265,7 +18265,7 @@ const getSortingFromString = (searchString, columns) => {
       sort: order
     }];
   }
-  return null;
+  return 'invalid';
 };
 const getSearchParamsFromSorting = sorting => {
   const searchParams = new URLSearchParams();
@@ -18277,9 +18277,10 @@ const getSearchParamsFromSorting = sorting => {
 // - if we have something in the URL, use that info
 // - if we don't have that, use the localStorage and update the URL
 // - if we don't have that, return an empty SortModel
-const getSortModel = (search, columns, localStorageSorting, setLocalStorageSorting) => {
+const getSortModel = (search, columns, localStorageSorting, setLocalStorageSorting, initialState) => {
+  var _initialState$sorting;
   const sorting = getSortingFromString(search, columns);
-  if (sorting) {
+  if (sorting !== 'invalid') {
     const searchFromSortModel = getSearchParamsFromSorting(sorting);
     const searchString = urlSearchParamsToString(searchFromSortModel);
     if (searchString !== localStorageSorting) {
@@ -18288,30 +18289,22 @@ const getSortModel = (search, columns, localStorageSorting, setLocalStorageSorti
     return sorting;
   }
   const sortModelFromLocalStorage = getSortingFromString(localStorageSorting, columns);
-  if (sortModelFromLocalStorage) {
+  if (sortModelFromLocalStorage !== 'invalid') {
     return sortModelFromLocalStorage;
   }
-  return [];
+  return initialState !== null && initialState !== void 0 && (_initialState$sorting = initialState.sorting) !== null && _initialState$sorting !== void 0 && _initialState$sorting.sortModel ? initialState.sorting.sortModel : [];
 };
 
 /** PAGINATION */
 
 const getPaginationFromString = searchString => {
   if (!searchString) {
-    return {
-      page: 0,
-      pageSize: 25,
-      direction: 'next'
-    };
+    return 'invalid';
   }
   const searchParams = new URLSearchParams(searchString);
   const value = searchParams.get('_pagination');
   if (value === '' || value === null || value === '[]') {
-    return {
-      page: 0,
-      pageSize: 25,
-      direction: 'next'
-    };
+    return 'invalid';
   }
   const pagination = value.slice(1, value.length - 1).split(',');
   const page = parseFloat(pagination[0]);
@@ -18324,11 +18317,7 @@ const getPaginationFromString = searchString => {
       direction: direction
     };
   }
-  return {
-    page: 0,
-    pageSize: 25,
-    direction: 'next'
-  };
+  return 'invalid';
 };
 const getSearchParamsFromPagination = pagination => {
   const searchParams = new URLSearchParams();
@@ -18340,9 +18329,9 @@ const getSearchParamsFromPagination = pagination => {
 // - if we have something in the URL, use that info
 // - if we don't have that, use the localStorage and update the URL
 // - if we don't have that, return an empty PaginationModel
-const getPaginationModel = (search, localStoragePagination, setLocalStoragePagination) => {
+const getPaginationModel = (search, localStoragePagination, setLocalStoragePagination, initialState) => {
   const pagination = getPaginationFromString(search);
-  if (pagination) {
+  if (pagination !== 'invalid') {
     const searchFromPaginationModel = getSearchParamsFromPagination(pagination);
     const searchString = urlSearchParamsToString(searchFromPaginationModel);
     if (searchString !== localStoragePagination) {
@@ -18351,10 +18340,14 @@ const getPaginationModel = (search, localStoragePagination, setLocalStoragePagin
     return pagination;
   }
   const paginationModelFromLocalStorage = getPaginationFromString(localStoragePagination);
-  if (paginationModelFromLocalStorage) {
+  if (paginationModelFromLocalStorage !== 'invalid') {
     return paginationModelFromLocalStorage;
   }
-  return {
+  return initialState !== null && initialState !== void 0 && initialState.pagination ? _objectSpread2({
+    page: 0,
+    pageSize: 25,
+    direction: 'next'
+  }, initialState.pagination) : {
     page: 0,
     pageSize: 25,
     direction: 'next'
@@ -18396,7 +18389,7 @@ const getSearchParamsFromColumnVisibility = (columnVisibility, columns) => {
 };
 const getColumnVisibilityFromString = (notParsed, tableColumns) => {
   if (!notParsed || notParsed.length === 1 && notParsed[0] === '?') {
-    return null;
+    return 'invalid';
   }
   // remove the initial ? if present
   const parsed = notParsed[0] === '?' ? notParsed.slice(1) : notParsed;
@@ -18433,7 +18426,7 @@ const getColumnVisibilityFromString = (notParsed, tableColumns) => {
     }
   }
   if (visibleColumnsCount === 0 && !exist) {
-    return null;
+    return 'invalid';
   }
   return visibility;
 };
@@ -18444,9 +18437,10 @@ const getColumnVisibilityFromString = (notParsed, tableColumns) => {
 // - if we don't have that, return an empty ColumnVisibilityModel (which is all columns)
 // NOTE: the `defaultHidden` is a custom field and not standard DataGrid
 // The reason is the following bug: https://github.com/mui/mui-x/issues/8407
-const getColumnsVisibility = (search, columns, localStorageColumnsVisibility, setLocalStorageColumnsVisibility) => {
+const getColumnsVisibility = (search, columns, localStorageColumnsVisibility, setLocalStorageColumnsVisibility, initialState) => {
+  var _initialState$columns;
   const columnVisibility = getColumnVisibilityFromString(search, columns);
-  if (columnVisibility) {
+  if (columnVisibility !== 'invalid') {
     const searchColumnVisibility = getSearchParamsFromColumnVisibility(columnVisibility, columns);
     if (searchColumnVisibility.toString() !== localStorageColumnsVisibility) {
       setLocalStorageColumnsVisibility(searchColumnVisibility.toString());
@@ -18454,9 +18448,12 @@ const getColumnsVisibility = (search, columns, localStorageColumnsVisibility, se
     return columnVisibility;
   }
   const columnVisibilityFromLocalStorage = getColumnVisibilityFromString(localStorageColumnsVisibility, columns);
-  if (columnVisibilityFromLocalStorage) {
+  if (columnVisibilityFromLocalStorage !== 'invalid') {
     return columnVisibilityFromLocalStorage;
   }
+  if (initialState !== null && initialState !== void 0 && (_initialState$columns = initialState.columns) !== null && _initialState$columns !== void 0 && _initialState$columns.columnVisibilityModel) {
+    return initialState.columns.columnVisibilityModel;
+  }
 
   // No columns in URL or localStorage, just show them all expect the hidden ones
   const res = {};
@@ -18469,7 +18466,7 @@ const getColumnsVisibility = (search, columns, localStorageColumnsVisibility, se
 };
 const getPinnedColumnsFromString = (notParsed, tableColumns) => {
   if (!notParsed || notParsed.length === 1 && notParsed[0] === '?') {
-    return null;
+    return 'invalid';
   }
   // remove the initial ? if present
   const parsed = notParsed[0] === '?' ? notParsed.slice(1) : notParsed;
@@ -18496,13 +18493,10 @@ const getPinnedColumnsFromString = (notParsed, tableColumns) => {
       pinnedColumns['right'] = columns;
     }
   }
-  if (pinnedColumns.left || pinnedColumns.right) {
-    return {
-      left: pinnedColumns['left'] || [],
-      right: pinnedColumns['right'] || []
-    };
-  }
-  return null;
+  return pinnedColumns['left'] || pinnedColumns['right'] ? {
+    left: pinnedColumns['left'] || [],
+    right: pinnedColumns['right'] || []
+  } : 'invalid';
 };
 const getSearchParamsFromPinnedColumns = pinnedColumns => {
   var _pinnedColumns$left, _pinnedColumns$right;
@@ -18518,9 +18512,9 @@ const getSearchParamsFromPinnedColumns = pinnedColumns => {
 // - if we have something in the URL, use that info
 // - if we don't have that, use the localStorage and update the URL
 // - if we don't have that, return an empty ColumnVisibilityModel (which is all columns)
-const getPinnedColumns = (search, columns, localStoragePinnedColumns, setLocalStoragePinnedColumns) => {
+const getPinnedColumns = (search, columns, localStoragePinnedColumns, setLocalStoragePinnedColumns, initialState) => {
   const pinnedColumns = getPinnedColumnsFromString(search, columns);
-  if (pinnedColumns) {
+  if (pinnedColumns !== 'invalid') {
     const searchPinnedColumns = getSearchParamsFromPinnedColumns(pinnedColumns);
     if (searchPinnedColumns.toString() !== localStoragePinnedColumns) {
       setLocalStoragePinnedColumns(searchPinnedColumns.toString());
@@ -18528,9 +18522,15 @@ const getPinnedColumns = (search, columns, localStoragePinnedColumns, setLocalSt
     return pinnedColumns;
   }
   const pinnedColumnsFromLocalStorage = getPinnedColumnsFromString(localStoragePinnedColumns, columns);
-  if (pinnedColumnsFromLocalStorage) {
+  if (pinnedColumnsFromLocalStorage !== 'invalid') {
     return pinnedColumnsFromLocalStorage;
   }
+  if (initialState !== null && initialState !== void 0 && initialState.pinnedColumns) {
+    return {
+      left: (initialState === null || initialState === void 0 ? void 0 : initialState.pinnedColumns['left']) || [],
+      right: (initialState === null || initialState === void 0 ? void 0 : initialState.pinnedColumns['right']) || []
+    };
+  }
 
   // No pinnedColumn in URL or localStorage, TODO: decide what is the default state
   const res = {
@@ -18586,10 +18586,10 @@ const getModelsParsedOrUpdateLocalStorage = (search, columns, historyReplace, in
     setLocalStoragePinnedColumns
   } = localStorage;
   const filterModel = getFilterModel(search, columns, localStorageFilters, setLocalStorageFilters, initialState);
-  const sortModel = getSortModel(search, columns, localStorageSorting, setLocalStorageSorting);
-  const paginationModel = getPaginationModel(search, localStoragePagination, setLocalStoragePagination);
-  const columnVisibilityModel = getColumnsVisibility(search, columns, localStorageColumnsVisibility, setLocalStorageColumnsVisibility);
-  const pinnedColumnsModel = getPinnedColumns(search, columns, localStoragePinnedColumns, setLocalStoragePinnedColumns);
+  const sortModel = getSortModel(search, columns, localStorageSorting, setLocalStorageSorting, initialState);
+  const paginationModel = getPaginationModel(search, localStoragePagination, setLocalStoragePagination, initialState);
+  const columnVisibilityModel = getColumnsVisibility(search, columns, localStorageColumnsVisibility, setLocalStorageColumnsVisibility, initialState);
+  const pinnedColumnsModel = getPinnedColumns(search, columns, localStoragePinnedColumns, setLocalStoragePinnedColumns, initialState);
   const finalSearch = getFinalSearch({
     search,
     filterModel,
@@ -27520,13 +27520,13 @@ const useFetchState = (defaultValue, key) => {
   return [parsedValue, updateValue];
 };
 
-const useTableStates = (id, version, customDefaults) => {
+const useTableStates = (id, version) => {
   const [paginationModel, setPaginationModel] = useFetchState('', buildStorageKey({
     id,
     version,
     category: PAGINATION_MODEL_KEY
   }));
-  const [sortModel, setSortModel] = useFetchState(customDefaults && customDefaults[SORT_MODEL_KEY] ? customDefaults[SORT_MODEL_KEY] : '', buildStorageKey({
+  const [sortModel, setSortModel] = useFetchState('', buildStorageKey({
     id,
     version,
     category: SORT_MODEL_KEY
@@ -27541,7 +27541,7 @@ const useTableStates = (id, version, customDefaults) => {
     version,
     category: VISIBILITY_MODEL_KEY
   }));
-  const [pinnedColumns, setPinnedColumns] = useFetchState(customDefaults ? customDefaults[PINNED_COLUMNS] : '_pinnedColumnsLeft=[]&_pinnedColumnsRight=[]', buildStorageKey({
+  const [pinnedColumns, setPinnedColumns] = useFetchState('_pinnedColumnsLeft=[]&_pinnedColumnsRight=[]', buildStorageKey({
     id,
     version,
     category: PINNED_COLUMNS
@@ -27580,10 +27580,6 @@ const useStatefulTable = props => {
     onPageSizeChange: propsOnPageSizeChange,
     onPinnedColumnsChange: propsOnPinnedColumnsChange,
     onSortModelChange: propsOnSortModelChange,
-    pinnedCustomColumns = {
-      left: [],
-      right: []
-    },
     useRouter,
     localStorageVersion = 2
   } = props;
@@ -27593,11 +27589,6 @@ const useStatefulTable = props => {
     historyReplace
   } = useRouter();
   const id = pathname;
-  const customDefaults = useMemo(() => {
-    return {
-      pinnedColumns: `_pinnedColumnsLeft=[${[GRID_CHECKBOX_SELECTION_COL_DEF.field, ...pinnedCustomColumns.left].join(',')}]&_pinnedColumnsRight=[${pinnedCustomColumns.right.join(',')}]`
-    };
-  }, [pinnedCustomColumns]);
 
   // States and setters persisted in the local storage for this table
   const {
@@ -27613,7 +27604,7 @@ const useStatefulTable = props => {
     setPinnedColumns,
     dimensionModel,
     setDimensionModel
-  } = useTableStates(id, localStorageVersion, customDefaults);
+  } = useTableStates(id, localStorageVersion);
 
   // clearing up old version keys, triggering only on first render
   useEffect(() => clearPreviousVersionStorage(id, localStorageVersion), [id, localStorageVersion]);
@@ -27748,7 +27739,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", "localStorageVersion", "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", "rows", "rowsPerPageOptions", "sx", "theme", "useRouter", "paginationMode", "rowCount"];
 const COMPONENT_NAME$1 = 'DataGrid';
 const CLASSNAME$1 = 'redsift-datagrid';
 const StatefulDataGrid = /*#__PURE__*/forwardRef((props, ref) => {
@@ -27785,7 +27776,6 @@ const StatefulDataGrid = /*#__PURE__*/forwardRef((props, ref) => {
       pagination,
       paginationPlacement = 'both',
       paginationProps,
-      pinnedCustomColumns,
       rows,
       rowsPerPageOptions,
       sx,
@@ -27849,7 +27839,6 @@ const StatefulDataGrid = /*#__PURE__*/forwardRef((props, ref) => {
     onPageSizeChange: controlledOnPageSizeChange,
     onPinnedColumnsChange: controlledOnPinnedColumnsChange,
     onSortModelChange: controlledOnSortModelChange,
-    pinnedCustomColumns,
     useRouter: useRouter,
     localStorageVersion
   });