wip:milestone 0 fixes
Some checks failed
CI/CD Pipeline / unit-tests (push) Failing after 1m16s
CI/CD Pipeline / integration-tests (push) Failing after 2m32s
CI/CD Pipeline / lint (push) Successful in 5m22s
CI/CD Pipeline / e2e-tests (push) Has been skipped
CI/CD Pipeline / build (push) Has been skipped

This commit is contained in:
2026-03-15 12:35:42 +02:00
parent 6708cf28a7
commit cffdf8af86
61266 changed files with 4511646 additions and 1938 deletions

View File

@@ -0,0 +1,123 @@
import { createSelector, createSelectorMemoized } from '../../../utils/createSelector';
import { gridExpandedSortedRowEntriesSelector, gridExpandedSortedRowIdsSelector, gridFilteredSortedTopLevelRowEntriesSelector } from '../filter/gridFilterSelector';
import { gridRowMaximumTreeDepthSelector, gridRowTreeSelector } from '../rows/gridRowsSelector';
import { getPageCount } from './gridPaginationUtils';
/**
* @category Pagination
* @ignore - do not document.
*/
export var gridPaginationSelector = function gridPaginationSelector(state) {
return state.pagination;
};
/**
* Get the pagination model
* @category Pagination
*/
export var gridPaginationModelSelector = createSelector(gridPaginationSelector, function (pagination) {
return pagination.paginationModel;
});
/**
* Get the row count
* @category Pagination
*/
export var gridPaginationRowCountSelector = createSelector(gridPaginationSelector, function (pagination) {
return pagination.rowCount;
});
/**
* Get the index of the page to render if the pagination is enabled
* @category Pagination
*/
export var gridPageSelector = createSelector(gridPaginationModelSelector, function (paginationModel) {
return paginationModel.page;
});
/**
* Get the maximum amount of rows to display on a single page if the pagination is enabled
* @category Pagination
*/
export var gridPageSizeSelector = createSelector(gridPaginationModelSelector, function (paginationModel) {
return paginationModel.pageSize;
});
/**
* Get the amount of pages needed to display all the rows if the pagination is enabled
* @category Pagination
*/
export var gridPageCountSelector = createSelector(gridPageSizeSelector, gridPaginationRowCountSelector, function (pageSize, rowCount) {
return getPageCount(rowCount, pageSize);
});
/**
* Get the index of the first and the last row to include in the current page if the pagination is enabled.
* @category Pagination
*/
export var gridPaginationRowRangeSelector = createSelectorMemoized(gridPaginationModelSelector, gridRowTreeSelector, gridRowMaximumTreeDepthSelector, gridExpandedSortedRowEntriesSelector, gridFilteredSortedTopLevelRowEntriesSelector, function (paginationModel, rowTree, rowTreeDepth, visibleSortedRowEntries, visibleSortedTopLevelRowEntries) {
var visibleTopLevelRowCount = visibleSortedTopLevelRowEntries.length;
var topLevelFirstRowIndex = Math.min(paginationModel.pageSize * paginationModel.page, visibleTopLevelRowCount - 1);
var topLevelLastRowIndex = Math.min(topLevelFirstRowIndex + paginationModel.pageSize - 1, visibleTopLevelRowCount - 1);
// The range contains no element
if (topLevelFirstRowIndex === -1 || topLevelLastRowIndex === -1) {
return null;
}
// The tree is flat, there is no need to look for children
if (rowTreeDepth < 2) {
return {
firstRowIndex: topLevelFirstRowIndex,
lastRowIndex: topLevelLastRowIndex
};
}
var topLevelFirstRow = visibleSortedTopLevelRowEntries[topLevelFirstRowIndex];
var topLevelRowsInCurrentPageCount = topLevelLastRowIndex - topLevelFirstRowIndex + 1;
var firstRowIndex = visibleSortedRowEntries.findIndex(function (row) {
return row.id === topLevelFirstRow.id;
});
var lastRowIndex = firstRowIndex;
var topLevelRowAdded = 0;
while (lastRowIndex < visibleSortedRowEntries.length && topLevelRowAdded <= topLevelRowsInCurrentPageCount) {
var _rowTree$row$id;
var row = visibleSortedRowEntries[lastRowIndex];
var depth = (_rowTree$row$id = rowTree[row.id]) == null ? void 0 : _rowTree$row$id.depth;
if (depth === undefined) {
lastRowIndex += 1;
} else {
if (topLevelRowAdded < topLevelRowsInCurrentPageCount || depth > 0) {
lastRowIndex += 1;
}
if (depth === 0) {
topLevelRowAdded += 1;
}
}
}
return {
firstRowIndex: firstRowIndex,
lastRowIndex: lastRowIndex - 1
};
});
/**
* Get the id and the model of each row to include in the current page if the pagination is enabled.
* @category Pagination
*/
export var gridPaginatedVisibleSortedGridRowEntriesSelector = createSelectorMemoized(gridExpandedSortedRowEntriesSelector, gridPaginationRowRangeSelector, function (visibleSortedRowEntries, paginationRange) {
if (!paginationRange) {
return [];
}
return visibleSortedRowEntries.slice(paginationRange.firstRowIndex, paginationRange.lastRowIndex + 1);
});
/**
* Get the id of each row to include in the current page if the pagination is enabled.
* @category Pagination
*/
export var gridPaginatedVisibleSortedGridRowIdsSelector = createSelectorMemoized(gridExpandedSortedRowIdsSelector, gridPaginationRowRangeSelector, function (visibleSortedRowIds, paginationRange) {
if (!paginationRange) {
return [];
}
return visibleSortedRowIds.slice(paginationRange.firstRowIndex, paginationRange.lastRowIndex + 1);
});

View File

@@ -0,0 +1,31 @@
import { buildWarning } from '../../../utils/warning';
import { GridSignature } from '../../utils';
var MAX_PAGE_SIZE = 100;
export var defaultPageSize = function defaultPageSize(autoPageSize) {
return autoPageSize ? 0 : 100;
};
export var getPageCount = function getPageCount(rowCount, pageSize) {
if (pageSize > 0 && rowCount > 0) {
return Math.ceil(rowCount / pageSize);
}
return 0;
};
export var noRowCountInServerMode = buildWarning(["MUI: the 'rowCount' prop is undefined while using paginationMode='server'", 'For more detail, see http://mui.com/components/data-grid/pagination/#basic-implementation'], 'error');
export var getDefaultGridPaginationModel = function getDefaultGridPaginationModel(autoPageSize) {
return {
page: 0,
pageSize: autoPageSize ? 0 : 100
};
};
export var getValidPage = function getValidPage(page) {
var pageCount = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
if (pageCount === 0) {
return page;
}
return Math.max(Math.min(page, pageCount - 1), 0);
};
export var throwIfPageSizeExceedsTheLimit = function throwIfPageSizeExceedsTheLimit(pageSize, signatureProp) {
if (signatureProp === GridSignature.DataGrid && pageSize > MAX_PAGE_SIZE) {
throw new Error(['MUI: `pageSize` cannot exceed 100 in the MIT version of the DataGrid.', 'You need to upgrade to DataGridPro or DataGridPremium component to unlock this feature.'].join('\n'));
}
};

View File

@@ -0,0 +1,2 @@
export * from './gridPaginationSelector';
export {};

View File

@@ -0,0 +1,25 @@
import _extends from "@babel/runtime/helpers/esm/extends";
import { throwIfPageSizeExceedsTheLimit, getDefaultGridPaginationModel } from './gridPaginationUtils';
import { useGridPaginationModel } from './useGridPaginationModel';
import { useGridRowCount } from './useGridRowCount';
export var paginationStateInitializer = function paginationStateInitializer(state, props) {
var _props$paginationMode, _props$initialState, _ref, _props$rowCount, _props$initialState2;
var paginationModel = _extends({}, getDefaultGridPaginationModel(props.autoPageSize), (_props$paginationMode = props.paginationModel) != null ? _props$paginationMode : (_props$initialState = props.initialState) == null || (_props$initialState = _props$initialState.pagination) == null ? void 0 : _props$initialState.paginationModel);
throwIfPageSizeExceedsTheLimit(paginationModel.pageSize, props.signature);
var rowCount = (_ref = (_props$rowCount = props.rowCount) != null ? _props$rowCount : (_props$initialState2 = props.initialState) == null || (_props$initialState2 = _props$initialState2.pagination) == null ? void 0 : _props$initialState2.rowCount) != null ? _ref : 0;
return _extends({}, state, {
pagination: {
paginationModel: paginationModel,
rowCount: rowCount
}
});
};
/**
* @requires useGridFilter (state)
* @requires useGridDimensions (event) - can be after
*/
export var useGridPagination = function useGridPagination(apiRef, props) {
useGridPaginationModel(apiRef, props);
useGridRowCount(apiRef, props);
};

View File

@@ -0,0 +1,182 @@
import _extends from "@babel/runtime/helpers/esm/extends";
import * as React from 'react';
import { gridDensityFactorSelector } from '../density';
import { calculatePinnedRowsHeight } from '../rows/gridRowsUtils';
import { useGridLogger, useGridSelector, useGridApiMethod, useGridApiEventHandler } from '../../utils';
import { useGridRegisterPipeProcessor } from '../../core/pipeProcessing';
import { gridPageCountSelector, gridPaginationModelSelector } from './gridPaginationSelector';
import { getPageCount, defaultPageSize, throwIfPageSizeExceedsTheLimit, getDefaultGridPaginationModel, getValidPage } from './gridPaginationUtils';
export var getDerivedPaginationModel = function getDerivedPaginationModel(paginationState, signature, paginationModelProp) {
var _paginationModelProp$;
var paginationModel = paginationState.paginationModel;
var rowCount = paginationState.rowCount;
var pageSize = (_paginationModelProp$ = paginationModelProp == null ? void 0 : paginationModelProp.pageSize) != null ? _paginationModelProp$ : paginationModel.pageSize;
var pageCount = getPageCount(rowCount, pageSize);
if (paginationModelProp && ((paginationModelProp == null ? void 0 : paginationModelProp.page) !== paginationModel.page || (paginationModelProp == null ? void 0 : paginationModelProp.pageSize) !== paginationModel.pageSize)) {
paginationModel = paginationModelProp;
}
var validPage = getValidPage(paginationModel.page, pageCount);
if (validPage !== paginationModel.page) {
paginationModel = _extends({}, paginationModel, {
page: validPage
});
}
throwIfPageSizeExceedsTheLimit(paginationModel.pageSize, signature);
return paginationModel;
};
/**
* @requires useGridFilter (state)
* @requires useGridDimensions (event) - can be after
*/
export var useGridPaginationModel = function useGridPaginationModel(apiRef, props) {
var _props$initialState2;
var logger = useGridLogger(apiRef, 'useGridPaginationModel');
var densityFactor = useGridSelector(apiRef, gridDensityFactorSelector);
var rowHeight = Math.floor(props.rowHeight * densityFactor);
apiRef.current.registerControlState({
stateId: 'paginationModel',
propModel: props.paginationModel,
propOnChange: props.onPaginationModelChange,
stateSelector: gridPaginationModelSelector,
changeEvent: 'paginationModelChange'
});
/**
* API METHODS
*/
var setPage = React.useCallback(function (page) {
var currentModel = gridPaginationModelSelector(apiRef);
if (page === currentModel.page) {
return;
}
logger.debug("Setting page to ".concat(page));
apiRef.current.setPaginationModel({
page: page,
pageSize: currentModel.pageSize
});
}, [apiRef, logger]);
var setPageSize = React.useCallback(function (pageSize) {
var currentModel = gridPaginationModelSelector(apiRef);
if (pageSize === currentModel.pageSize) {
return;
}
logger.debug("Setting page size to ".concat(pageSize));
apiRef.current.setPaginationModel({
pageSize: pageSize,
page: currentModel.page
});
}, [apiRef, logger]);
var setPaginationModel = React.useCallback(function (paginationModel) {
var currentModel = gridPaginationModelSelector(apiRef);
if (paginationModel === currentModel) {
return;
}
logger.debug("Setting 'paginationModel' to", paginationModel);
apiRef.current.setState(function (state) {
return _extends({}, state, {
pagination: _extends({}, state.pagination, {
paginationModel: getDerivedPaginationModel(state.pagination, props.signature, paginationModel)
})
});
});
}, [apiRef, logger, props.signature]);
var paginationModelApi = {
setPage: setPage,
setPageSize: setPageSize,
setPaginationModel: setPaginationModel
};
useGridApiMethod(apiRef, paginationModelApi, 'public');
/**
* PRE-PROCESSING
*/
var stateExportPreProcessing = React.useCallback(function (prevState, context) {
var _props$initialState;
var paginationModel = gridPaginationModelSelector(apiRef);
var shouldExportPaginationModel =
// Always export if the `exportOnlyDirtyModels` property is not activated
!context.exportOnlyDirtyModels ||
// Always export if the `paginationModel` is controlled
props.paginationModel != null ||
// Always export if the `paginationModel` has been initialized
((_props$initialState = props.initialState) == null || (_props$initialState = _props$initialState.pagination) == null ? void 0 : _props$initialState.paginationModel) != null ||
// Export if `page` or `pageSize` is not equal to the default value
paginationModel.page !== 0 && paginationModel.pageSize !== defaultPageSize(props.autoPageSize);
if (!shouldExportPaginationModel) {
return prevState;
}
return _extends({}, prevState, {
pagination: _extends({}, prevState.pagination, {
paginationModel: paginationModel
})
});
}, [apiRef, props.paginationModel, (_props$initialState2 = props.initialState) == null || (_props$initialState2 = _props$initialState2.pagination) == null ? void 0 : _props$initialState2.paginationModel, props.autoPageSize]);
var stateRestorePreProcessing = React.useCallback(function (params, context) {
var _context$stateToResto, _context$stateToResto2;
var paginationModel = (_context$stateToResto = context.stateToRestore.pagination) != null && _context$stateToResto.paginationModel ? _extends({}, getDefaultGridPaginationModel(props.autoPageSize), (_context$stateToResto2 = context.stateToRestore.pagination) == null ? void 0 : _context$stateToResto2.paginationModel) : gridPaginationModelSelector(apiRef);
apiRef.current.setState(function (state) {
return _extends({}, state, {
pagination: _extends({}, state.pagination, {
paginationModel: getDerivedPaginationModel(state.pagination, props.signature, paginationModel)
})
});
});
return params;
}, [apiRef, props.autoPageSize, props.signature]);
useGridRegisterPipeProcessor(apiRef, 'exportState', stateExportPreProcessing);
useGridRegisterPipeProcessor(apiRef, 'restoreState', stateRestorePreProcessing);
/**
* EVENTS
*/
var handlePaginationModelChange = function handlePaginationModelChange() {
var _apiRef$current$virtu;
var paginationModel = gridPaginationModelSelector(apiRef);
if ((_apiRef$current$virtu = apiRef.current.virtualScrollerRef) != null && _apiRef$current$virtu.current) {
apiRef.current.scrollToIndexes({
rowIndex: paginationModel.page * paginationModel.pageSize
});
}
};
var handleUpdateAutoPageSize = React.useCallback(function () {
if (!props.autoPageSize) {
return;
}
var dimensions = apiRef.current.getRootDimensions() || {
viewportInnerSize: {
height: 0
}
};
var pinnedRowsHeight = calculatePinnedRowsHeight(apiRef);
var maximumPageSizeWithoutScrollBar = Math.floor((dimensions.viewportInnerSize.height - pinnedRowsHeight.top - pinnedRowsHeight.bottom) / rowHeight);
apiRef.current.setPageSize(maximumPageSizeWithoutScrollBar);
}, [apiRef, props.autoPageSize, rowHeight]);
var handleRowCountChange = React.useCallback(function (newRowCount) {
if (newRowCount == null) {
return;
}
var paginationModel = gridPaginationModelSelector(apiRef);
var pageCount = gridPageCountSelector(apiRef);
if (paginationModel.page > pageCount - 1) {
apiRef.current.setPage(Math.max(0, pageCount - 1));
}
}, [apiRef]);
useGridApiEventHandler(apiRef, 'viewportInnerSizeChange', handleUpdateAutoPageSize);
useGridApiEventHandler(apiRef, 'paginationModelChange', handlePaginationModelChange);
useGridApiEventHandler(apiRef, 'rowCountChange', handleRowCountChange);
/**
* EFFECTS
*/
React.useEffect(function () {
apiRef.current.setState(function (state) {
return _extends({}, state, {
pagination: _extends({}, state.pagination, {
paginationModel: getDerivedPaginationModel(state.pagination, props.signature, props.paginationModel)
})
});
});
}, [apiRef, props.paginationModel, props.paginationMode, props.signature]);
React.useEffect(handleUpdateAutoPageSize, [handleUpdateAutoPageSize]);
};

View File

@@ -0,0 +1,101 @@
import _extends from "@babel/runtime/helpers/esm/extends";
import * as React from 'react';
import { gridFilteredTopLevelRowCountSelector } from '../filter';
import { useGridLogger, useGridSelector, useGridApiMethod } from '../../utils';
import { useGridRegisterPipeProcessor } from '../../core/pipeProcessing';
import { gridPaginationRowCountSelector } from './gridPaginationSelector';
import { noRowCountInServerMode } from './gridPaginationUtils';
/**
* @requires useGridFilter (state)
* @requires useGridDimensions (event) - can be after
*/
export var useGridRowCount = function useGridRowCount(apiRef, props) {
var _props$initialState2;
var logger = useGridLogger(apiRef, 'useGridRowCount');
var visibleTopLevelRowCount = useGridSelector(apiRef, gridFilteredTopLevelRowCountSelector);
var rowCount = useGridSelector(apiRef, gridPaginationRowCountSelector);
apiRef.current.registerControlState({
stateId: 'paginationRowCount',
propModel: props.rowCount,
propOnChange: props.onRowCountChange,
stateSelector: gridPaginationRowCountSelector,
changeEvent: 'rowCountChange'
});
/**
* API METHODS
*/
var setRowCount = React.useCallback(function (newRowCount) {
if (rowCount === newRowCount) {
return;
}
logger.debug("Setting 'rowCount' to", newRowCount);
apiRef.current.setState(function (state) {
return _extends({}, state, {
pagination: _extends({}, state.pagination, {
rowCount: newRowCount
})
});
});
}, [apiRef, logger, rowCount]);
var paginationRowCountApi = {
setRowCount: setRowCount
};
useGridApiMethod(apiRef, paginationRowCountApi, 'public');
/**
* PRE-PROCESSING
*/
var stateExportPreProcessing = React.useCallback(function (prevState, context) {
var _props$initialState;
var exportedRowCount = gridPaginationRowCountSelector(apiRef);
var shouldExportRowCount =
// Always export if the `exportOnlyDirtyModels` property is not activated
!context.exportOnlyDirtyModels ||
// Always export if the `rowCount` is controlled
props.rowCount != null ||
// Always export if the `rowCount` has been initialized
((_props$initialState = props.initialState) == null || (_props$initialState = _props$initialState.pagination) == null ? void 0 : _props$initialState.rowCount) != null;
if (!shouldExportRowCount) {
return prevState;
}
return _extends({}, prevState, {
pagination: _extends({}, prevState.pagination, {
rowCount: exportedRowCount
})
});
}, [apiRef, props.rowCount, (_props$initialState2 = props.initialState) == null || (_props$initialState2 = _props$initialState2.pagination) == null ? void 0 : _props$initialState2.rowCount]);
var stateRestorePreProcessing = React.useCallback(function (params, context) {
var _context$stateToResto;
var restoredRowCount = (_context$stateToResto = context.stateToRestore.pagination) != null && _context$stateToResto.rowCount ? context.stateToRestore.pagination.rowCount : gridPaginationRowCountSelector(apiRef);
apiRef.current.setState(function (state) {
return _extends({}, state, {
pagination: _extends({}, state.pagination, {
rowCount: restoredRowCount
})
});
});
return params;
}, [apiRef]);
useGridRegisterPipeProcessor(apiRef, 'exportState', stateExportPreProcessing);
useGridRegisterPipeProcessor(apiRef, 'restoreState', stateRestorePreProcessing);
/**
* EFFECTS
*/
React.useEffect(function () {
if (process.env.NODE_ENV !== 'production') {
if (props.paginationMode === 'server' && props.rowCount == null) {
noRowCountInServerMode();
}
}
}, [props.rowCount, props.paginationMode]);
React.useEffect(function () {
if (props.paginationMode === 'client') {
apiRef.current.setRowCount(visibleTopLevelRowCount);
} else if (props.rowCount != null) {
apiRef.current.setRowCount(props.rowCount);
}
}, [apiRef, visibleTopLevelRowCount, props.paginationMode, props.rowCount]);
};