@mui/x-data-grid 5.17.7 → 5.17.8

package/CHANGELOG.md

@@ -3,6 +3,36 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 5.17.8
+
+_Oct 20, 2022_
+
+We'd like to offer a big thanks to the 5 contributors who made this release possible. Here are some highlights ✨:
+
+- 🐞 Bugfixes
+- 🌍 Improve Turkish (tr-TR) locale on the data grid and pickers (#6573) @ramazansancar
+
+### `@mui/x-data-grid@v5.17.8` / `@mui/x-data-grid-pro@v5.17.8` / `@mui/x-data-grid-premium@v5.17.8`
+
+#### Changes
+
+- [DataGrid] Add `searchPredicate` prop to `GridColumnsPanel` component (#6572) @cherniavskii
+- [DataGrid] Fix grid not updating state on `rowCount` prop change (#6474) @cherniavskii
+- [DataGridPro] Fix row order being reset after updating the row (#6544) @cherniavskii
+- [l10n] Improve Turkish (tr-TR) locale on the data grid and pickers (#6542) (#6573) @ramazansancar
+
+### `@mui/x-date-pickers@v5.0.5` / `@mui/x-date-pickers-pro@v5.0.5`
+
+#### Changes
+
+- [CalendarPicker] Don't move to closest enabled date when `props.date` contains a disabled date (#6537) @flaviendelangle
+- [DateRangePicker] Fix calendar day outside of month layout shifting on hover (pick #6448) (#6538) @alexfauquette
+- [pickers] Fix typescript issues (#6510) @flaviendelangle
+
+### Docs
+
+- [docs] Fix 301 link to the sx prop page @oliviertassinari
+
 ## 5.17.7
 
 _Oct 13, 2022_

package/components/panel/GridColumnsPanel.d.ts

@@ -1,7 +1,9 @@
 /// <reference types="react" />
 import { GridPanelWrapperProps } from './GridPanelWrapper';
+import { GridStateColDef } from '../../models/colDef/gridColDef';
 export interface GridColumnsPanelProps extends GridPanelWrapperProps {
     sort?: 'asc' | 'desc';
+    searchPredicate?: (column: GridStateColDef, searchValue: string) => boolean;
 }
 declare function GridColumnsPanel(props: GridColumnsPanelProps): JSX.Element;
 declare namespace GridColumnsPanel {

package/components/panel/GridColumnsPanel.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["sort"];
+const _excluded = ["sort", "searchPredicate"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import { unstable_composeClasses as composeClasses } from '@mui/material';
@@ -59,6 +59,10 @@ const GridIconButtonRoot = styled(IconButton)({
 });
 const collator = new Intl.Collator();
 
+const defaultSearchPredicate = (column, searchValue) => {
+  return (column.headerName || column.field).toLowerCase().indexOf(searchValue) > -1;
+};
+
 function GridColumnsPanel(props) {
   var _rootProps$components, _rootProps$components3, _rootProps$components4;
 
@@ -74,7 +78,8 @@ function GridColumnsPanel(props) {
   const classes = useUtilityClasses(ownerState);
 
   const {
-    sort
+    sort,
+    searchPredicate = defaultSearchPredicate
   } = props,
         other = _objectWithoutPropertiesLoose(props, _excluded);
 
@@ -128,8 +133,8 @@ function GridColumnsPanel(props) {
     }
 
     const searchValueToCheck = searchValue.toLowerCase();
-    return sortedColumns.filter(column => (column.headerName || column.field).toLowerCase().indexOf(searchValueToCheck) > -1);
-  }, [sortedColumns, searchValue]);
+    return sortedColumns.filter(column => searchPredicate(column, searchValueToCheck));
+  }, [sortedColumns, searchValue, searchPredicate]);
   React.useEffect(() => {
     searchInputRef.current.focus();
   }, []);
@@ -191,6 +196,7 @@ process.env.NODE_ENV !== "production" ? GridColumnsPanel.propTypes = {
   // | These PropTypes are generated from the TypeScript type definitions |
   // | To update them edit the TypeScript types and run "yarn proptypes"  |
   // ----------------------------------------------------------------------
+  searchPredicate: PropTypes.func,
   sort: PropTypes.oneOf(['asc', 'desc'])
 } : void 0;
 export { GridColumnsPanel };

package/hooks/features/rows/gridRowsState.d.ts

@@ -31,6 +31,7 @@ export interface GridRowsInternalCache extends Omit<GridRowTreeCreationParams, '
      * The value of the `loading` prop since the last time that the rows state was updated.
      */
     loadingPropBeforePartialUpdates: DataGridProcessedProps['loading'];
+    rowCountPropBeforePartialUpdates: DataGridProcessedProps['rowCount'];
 }
 export interface GridRowsState extends GridRowTreeCreationValue {
     /**

package/hooks/features/rows/gridRowsUtils.d.ts

@@ -11,7 +11,7 @@ import { GridRowsInternalCache, GridRowsState } from './gridRowsState';
  */
 export declare function checkGridRowIdIsValid(id: GridRowId, row: GridRowModel | Partial<GridRowModel>, detailErrorMessage?: string): void;
 export declare const getRowIdFromRowModel: (rowModel: GridRowModel, getRowId?: GridRowIdGetter, detailErrorMessage?: string) => GridRowId;
-export declare const createRowsInternalCache: ({ rows, getRowId, loading, }: Pick<DataGridProcessedProps, 'rows' | 'getRowId' | 'loading'>) => GridRowsInternalCache;
+export declare const createRowsInternalCache: ({ rows, getRowId, loading, rowCount, }: Pick<DataGridProcessedProps, 'rows' | 'getRowId' | 'loading' | 'rowCount'>) => GridRowsInternalCache;
 export declare const getRowsStateFromCache: ({ apiRef, previousTree, rowCountProp, loadingProp, }: {
     apiRef: React.MutableRefObject<GridApiCommunity>;
     previousTree: GridRowTreeConfig | null;

package/hooks/features/rows/gridRowsUtils.js

@@ -22,11 +22,13 @@ export const getRowIdFromRowModel = (rowModel, getRowId, detailErrorMessage) =>
 export const createRowsInternalCache = ({
   rows,
   getRowId,
-  loading
+  loading,
+  rowCount
 }) => {
   const cache = {
     rowsBeforePartialUpdates: rows,
     loadingPropBeforePartialUpdates: loading,
+    rowCountPropBeforePartialUpdates: rowCount,
     idRowsLookup: {},
     idToIdLookup: {},
     ids: []

package/hooks/features/rows/useGridRows.js

@@ -13,7 +13,8 @@ export const rowsStateInitializer = (state, props, apiRef) => {
   apiRef.current.unstable_caches.rows = createRowsInternalCache({
     rows: props.rows,
     getRowId: props.getRowId,
-    loading: props.loading
+    loading: props.loading,
+    rowCount: props.rowCount
   });
   return _extends({}, state, {
     rows: getRowsStateFromCache({
@@ -94,9 +95,10 @@ export const useGridRows = (apiRef, props) => {
     throttledRowsChange(createRowsInternalCache({
       rows,
       getRowId: props.getRowId,
-      loading: props.loading
+      loading: props.loading,
+      rowCount: props.rowCount
     }), true);
-  }, [logger, props.getRowId, props.loading, throttledRowsChange]);
+  }, [logger, props.getRowId, props.loading, props.rowCount, throttledRowsChange]);
   const updateRows = React.useCallback(updates => {
     if (props.signature === GridSignature.DataGrid && updates.length > 1) {
       // TODO: Add test with direct call to `apiRef.current.updateRows` in DataGrid after enabling the `apiRef` on the free plan.
@@ -119,6 +121,7 @@ export const useGridRows = (apiRef, props) => {
     const newCache = {
       rowsBeforePartialUpdates: prevCache.rowsBeforePartialUpdates,
       loadingPropBeforePartialUpdates: prevCache.loadingPropBeforePartialUpdates,
+      rowCountPropBeforePartialUpdates: prevCache.rowCountPropBeforePartialUpdates,
       idRowsLookup: _extends({}, prevCache.idRowsLookup),
       idToIdLookup: _extends({}, prevCache.idToIdLookup),
       ids: [...prevCache.ids]
@@ -241,6 +244,7 @@ export const useGridRows = (apiRef, props) => {
         ids: updatedRows
       })
     }));
+    apiRef.current.unstable_caches.rows.ids = updatedRows;
     apiRef.current.publishEvent('rowsSet');
   }, [apiRef, logger]);
   const replaceRows = React.useCallback((firstRowToRender, newRows) => {
@@ -332,12 +336,13 @@ export const useGridRows = (apiRef, props) => {
       cache = createRowsInternalCache({
         rows: props.rows,
         getRowId: props.getRowId,
-        loading: props.loading
+        loading: props.loading,
+        rowCount: props.rowCount
       });
     }
 
     throttledRowsChange(cache, false);
-  }, [logger, apiRef, props.rows, props.getRowId, props.loading, throttledRowsChange]);
+  }, [logger, apiRef, props.rows, props.getRowId, props.loading, props.rowCount, throttledRowsChange]);
   const handleStrategyProcessorChange = React.useCallback(methodName => {
     if (methodName === 'rowTreeCreation') {
       groupRows();
@@ -386,7 +391,8 @@ export const useGridRows = (apiRef, props) => {
     }
 
     const areNewRowsAlreadyInState = apiRef.current.unstable_caches.rows.rowsBeforePartialUpdates === props.rows;
-    const isNewLoadingAlreadyInState = apiRef.current.unstable_caches.rows.loadingPropBeforePartialUpdates === props.loading; // The new rows have already been applied (most likely in the `'rowGroupsPreProcessingChange'` listener)
+    const isNewLoadingAlreadyInState = apiRef.current.unstable_caches.rows.loadingPropBeforePartialUpdates === props.loading;
+    const isNewRowCountAlreadyInState = apiRef.current.unstable_caches.rows.rowCountPropBeforePartialUpdates === props.rowCount; // The new rows have already been applied (most likely in the `'rowGroupsPreProcessingChange'` listener)
 
     if (areNewRowsAlreadyInState) {
       // If the loading prop has changed, we need to update its value in the state because it won't be done by `throttledRowsChange`
@@ -400,6 +406,17 @@ export const useGridRows = (apiRef, props) => {
         apiRef.current.forceUpdate();
       }
 
+      if (!isNewRowCountAlreadyInState) {
+        apiRef.current.setState(state => _extends({}, state, {
+          rows: _extends({}, state.rows, {
+            totalRowCount: Math.max(props.rowCount || 0, state.rows.totalRowCount),
+            totalTopLevelRowCount: Math.max(props.rowCount || 0, state.rows.totalTopLevelRowCount)
+          })
+        }));
+        apiRef.current.unstable_caches.rows.rowCountPropBeforePartialUpdates = props.rowCount;
+        apiRef.current.forceUpdate();
+      }
+
       return;
     }
 
@@ -407,7 +424,8 @@ export const useGridRows = (apiRef, props) => {
     throttledRowsChange(createRowsInternalCache({
       rows: props.rows,
       getRowId: props.getRowId,
-      loading: props.loading
+      loading: props.loading,
+      rowCount: props.rowCount
     }), false);
   }, [props.rows, props.rowCount, props.getRowId, props.loading, logger, throttledRowsChange, apiRef]);
 };

package/index.js

@@ -1,4 +1,4 @@
-/** @license MUI v5.17.7
+/** @license MUI v5.17.8
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.

package/legacy/components/panel/GridColumnsPanel.js

@@ -3,7 +3,7 @@ import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-var _excluded = ["sort"];
+var _excluded = ["sort", "searchPredicate"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import { unstable_composeClasses as composeClasses } from '@mui/material';
@@ -66,6 +66,10 @@ var GridIconButtonRoot = styled(IconButton)({
 });
 var collator = new Intl.Collator();
 
+var defaultSearchPredicate = function defaultSearchPredicate(column, searchValue) {
+  return (column.headerName || column.field).toLowerCase().indexOf(searchValue) > -1;
+};
+
 function GridColumnsPanel(props) {
   var _rootProps$components, _rootProps$components3, _rootProps$components4;
 
@@ -86,6 +90,8 @@ function GridColumnsPanel(props) {
   var classes = useUtilityClasses(ownerState);
 
   var sort = props.sort,
+      _props$searchPredicat = props.searchPredicate,
+      searchPredicate = _props$searchPredicat === void 0 ? defaultSearchPredicate : _props$searchPredicat,
       other = _objectWithoutProperties(props, _excluded);
 
   var sortedColumns = React.useMemo(function () {
@@ -146,9 +152,9 @@ function GridColumnsPanel(props) {
 
     var searchValueToCheck = searchValue.toLowerCase();
     return sortedColumns.filter(function (column) {
-      return (column.headerName || column.field).toLowerCase().indexOf(searchValueToCheck) > -1;
+      return searchPredicate(column, searchValueToCheck);
     });
-  }, [sortedColumns, searchValue]);
+  }, [sortedColumns, searchValue, searchPredicate]);
   React.useEffect(function () {
     searchInputRef.current.focus();
   }, []);
@@ -214,6 +220,7 @@ process.env.NODE_ENV !== "production" ? GridColumnsPanel.propTypes = {
   // | These PropTypes are generated from the TypeScript type definitions |
   // | To update them edit the TypeScript types and run "yarn proptypes"  |
   // ----------------------------------------------------------------------
+  searchPredicate: PropTypes.func,
   sort: PropTypes.oneOf(['asc', 'desc'])
 } : void 0;
 export { GridColumnsPanel };

package/legacy/hooks/features/rows/gridRowsUtils.js

@@ -25,10 +25,12 @@ export var getRowIdFromRowModel = function getRowIdFromRowModel(rowModel, getRow
 export var createRowsInternalCache = function createRowsInternalCache(_ref) {
   var rows = _ref.rows,
       getRowId = _ref.getRowId,
-      loading = _ref.loading;
+      loading = _ref.loading,
+      rowCount = _ref.rowCount;
   var cache = {
     rowsBeforePartialUpdates: rows,
     loadingPropBeforePartialUpdates: loading,
+    rowCountPropBeforePartialUpdates: rowCount,
     idRowsLookup: {},
     idToIdLookup: {},
     ids: []

package/legacy/hooks/features/rows/useGridRows.js

@@ -16,7 +16,8 @@ export var rowsStateInitializer = function rowsStateInitializer(state, props, ap
   apiRef.current.unstable_caches.rows = createRowsInternalCache({
     rows: props.rows,
     getRowId: props.getRowId,
-    loading: props.loading
+    loading: props.loading,
+    rowCount: props.rowCount
   });
   return _extends({}, state, {
     rows: getRowsStateFromCache({
@@ -100,9 +101,10 @@ export var useGridRows = function useGridRows(apiRef, props) {
     throttledRowsChange(createRowsInternalCache({
       rows: rows,
       getRowId: props.getRowId,
-      loading: props.loading
+      loading: props.loading,
+      rowCount: props.rowCount
     }), true);
-  }, [logger, props.getRowId, props.loading, throttledRowsChange]);
+  }, [logger, props.getRowId, props.loading, props.rowCount, throttledRowsChange]);
   var updateRows = React.useCallback(function (updates) {
     if (props.signature === GridSignature.DataGrid && updates.length > 1) {
       // TODO: Add test with direct call to `apiRef.current.updateRows` in DataGrid after enabling the `apiRef` on the free plan.
@@ -125,6 +127,7 @@ export var useGridRows = function useGridRows(apiRef, props) {
     var newCache = {
       rowsBeforePartialUpdates: prevCache.rowsBeforePartialUpdates,
       loadingPropBeforePartialUpdates: prevCache.loadingPropBeforePartialUpdates,
+      rowCountPropBeforePartialUpdates: prevCache.rowCountPropBeforePartialUpdates,
       idRowsLookup: _extends({}, prevCache.idRowsLookup),
       idToIdLookup: _extends({}, prevCache.idToIdLookup),
       ids: _toConsumableArray(prevCache.ids)
@@ -265,6 +268,7 @@ export var useGridRows = function useGridRows(apiRef, props) {
         })
       });
     });
+    apiRef.current.unstable_caches.rows.ids = updatedRows;
     apiRef.current.publishEvent('rowsSet');
   }, [apiRef, logger]);
   var replaceRows = React.useCallback(function (firstRowToRender, newRows) {
@@ -363,12 +367,13 @@ export var useGridRows = function useGridRows(apiRef, props) {
       cache = createRowsInternalCache({
         rows: props.rows,
         getRowId: props.getRowId,
-        loading: props.loading
+        loading: props.loading,
+        rowCount: props.rowCount
       });
     }
 
     throttledRowsChange(cache, false);
-  }, [logger, apiRef, props.rows, props.getRowId, props.loading, throttledRowsChange]);
+  }, [logger, apiRef, props.rows, props.getRowId, props.loading, props.rowCount, throttledRowsChange]);
   var handleStrategyProcessorChange = React.useCallback(function (methodName) {
     if (methodName === 'rowTreeCreation') {
       groupRows();
@@ -419,7 +424,8 @@ export var useGridRows = function useGridRows(apiRef, props) {
     }
 
     var areNewRowsAlreadyInState = apiRef.current.unstable_caches.rows.rowsBeforePartialUpdates === props.rows;
-    var isNewLoadingAlreadyInState = apiRef.current.unstable_caches.rows.loadingPropBeforePartialUpdates === props.loading; // The new rows have already been applied (most likely in the `'rowGroupsPreProcessingChange'` listener)
+    var isNewLoadingAlreadyInState = apiRef.current.unstable_caches.rows.loadingPropBeforePartialUpdates === props.loading;
+    var isNewRowCountAlreadyInState = apiRef.current.unstable_caches.rows.rowCountPropBeforePartialUpdates === props.rowCount; // The new rows have already been applied (most likely in the `'rowGroupsPreProcessingChange'` listener)
 
     if (areNewRowsAlreadyInState) {
       // If the loading prop has changed, we need to update its value in the state because it won't be done by `throttledRowsChange`
@@ -435,6 +441,19 @@ export var useGridRows = function useGridRows(apiRef, props) {
         apiRef.current.forceUpdate();
       }
 
+      if (!isNewRowCountAlreadyInState) {
+        apiRef.current.setState(function (state) {
+          return _extends({}, state, {
+            rows: _extends({}, state.rows, {
+              totalRowCount: Math.max(props.rowCount || 0, state.rows.totalRowCount),
+              totalTopLevelRowCount: Math.max(props.rowCount || 0, state.rows.totalTopLevelRowCount)
+            })
+          });
+        });
+        apiRef.current.unstable_caches.rows.rowCountPropBeforePartialUpdates = props.rowCount;
+        apiRef.current.forceUpdate();
+      }
+
       return;
     }
 
@@ -442,7 +461,8 @@ export var useGridRows = function useGridRows(apiRef, props) {
     throttledRowsChange(createRowsInternalCache({
       rows: props.rows,
       getRowId: props.getRowId,
-      loading: props.loading
+      loading: props.loading,
+      rowCount: props.rowCount
     }), false);
   }, [props.rows, props.rowCount, props.getRowId, props.loading, logger, throttledRowsChange, apiRef]);
 };

package/legacy/index.js

@@ -1,4 +1,4 @@
-/** @license MUI v5.17.7
+/** @license MUI v5.17.8
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.

package/legacy/locales/trTR.js

@@ -41,7 +41,7 @@ var trTRGrid = {
   // Filter panel text
   filterPanelAddFilter: 'Filtre Ekle',
   filterPanelDeleteIconLabel: 'Kaldır',
-  // filterPanelLinkOperator: 'Logic operator',
+  filterPanelLinkOperator: 'Mantıksal operatörler',
   filterPanelOperators: 'Operatör',
   // TODO v6: rename to filterPanelOperator
   filterPanelOperatorAnd: 'Ve',
@@ -93,13 +93,13 @@ var trTRGrid = {
   },
   // Checkbox selection text
   checkboxSelectionHeaderName: 'Seçim',
-  // checkboxSelectionSelectAllRows: 'Select all rows',
-  // checkboxSelectionUnselectAllRows: 'Unselect all rows',
-  // checkboxSelectionSelectRow: 'Select row',
-  // checkboxSelectionUnselectRow: 'Unselect row',
+  checkboxSelectionSelectAllRows: 'Tüm satırları seç',
+  checkboxSelectionUnselectAllRows: 'Tüm satırların seçimini kaldır',
+  checkboxSelectionSelectRow: 'Satırı seç',
+  checkboxSelectionUnselectRow: 'Satır seçimini bırak',
   // Boolean cell text
-  // booleanCellTrueLabel: 'yes',
-  // booleanCellFalseLabel: 'no',
+  booleanCellTrueLabel: 'Evet',
+  booleanCellFalseLabel: 'Hayır',
   // Actions cell more text
   actionsCellMore: 'daha fazla',
   // Column pinning text
@@ -119,17 +119,17 @@ var trTRGrid = {
     return "".concat(name, " i\xE7in gruplamay\u0131 kald\u0131r");
   },
   // Master/detail
-  // detailPanelToggle: 'Detail panel toggle',
+  detailPanelToggle: 'Detay görünümüne geçiş',
   expandDetailPanel: 'Genişlet',
-  collapseDetailPanel: 'Gizle' // Row reordering text
-  // rowReorderingHeaderName: 'Row reordering',
+  collapseDetailPanel: 'Gizle',
+  // Row reordering text
+  rowReorderingHeaderName: 'Satırı yeniden sırala',
   // Aggregation
-  // aggregationMenuItemHeader: 'Aggregation',
-  // aggregationFunctionLabelSum: 'sum',
-  // aggregationFunctionLabelAvg: 'avg',
-  // aggregationFunctionLabelMin: 'min',
-  // aggregationFunctionLabelMax: 'max',
-  // aggregationFunctionLabelSize: 'size',
-
+  aggregationMenuItemHeader: 'Toplama',
+  aggregationFunctionLabelSum: 'top',
+  aggregationFunctionLabelAvg: 'ort',
+  aggregationFunctionLabelMin: 'min',
+  aggregationFunctionLabelMax: 'maks',
+  aggregationFunctionLabelSize: 'boyut'
 };
 export var trTR = getGridLocalization(trTRGrid, trTRCore);

package/locales/trTR.js

@@ -39,7 +39,7 @@ const trTRGrid = {
   // Filter panel text
   filterPanelAddFilter: 'Filtre Ekle',
   filterPanelDeleteIconLabel: 'Kaldır',
-  // filterPanelLinkOperator: 'Logic operator',
+  filterPanelLinkOperator: 'Mantıksal operatörler',
   filterPanelOperators: 'Operatör',
   // TODO v6: rename to filterPanelOperator
   filterPanelOperatorAnd: 'Ve',
@@ -85,13 +85,13 @@ const trTRGrid = {
   footerTotalVisibleRows: (visibleCount, totalCount) => `${visibleCount.toLocaleString()} / ${totalCount.toLocaleString()}`,
   // Checkbox selection text
   checkboxSelectionHeaderName: 'Seçim',
-  // checkboxSelectionSelectAllRows: 'Select all rows',
-  // checkboxSelectionUnselectAllRows: 'Unselect all rows',
-  // checkboxSelectionSelectRow: 'Select row',
-  // checkboxSelectionUnselectRow: 'Unselect row',
+  checkboxSelectionSelectAllRows: 'Tüm satırları seç',
+  checkboxSelectionUnselectAllRows: 'Tüm satırların seçimini kaldır',
+  checkboxSelectionSelectRow: 'Satırı seç',
+  checkboxSelectionUnselectRow: 'Satır seçimini bırak',
   // Boolean cell text
-  // booleanCellTrueLabel: 'yes',
-  // booleanCellFalseLabel: 'no',
+  booleanCellTrueLabel: 'Evet',
+  booleanCellFalseLabel: 'Hayır',
   // Actions cell more text
   actionsCellMore: 'daha fazla',
   // Column pinning text
@@ -107,17 +107,17 @@ const trTRGrid = {
   groupColumn: name => `${name} için grupla`,
   unGroupColumn: name => `${name} için gruplamayı kaldır`,
   // Master/detail
-  // detailPanelToggle: 'Detail panel toggle',
+  detailPanelToggle: 'Detay görünümüne geçiş',
   expandDetailPanel: 'Genişlet',
-  collapseDetailPanel: 'Gizle' // Row reordering text
-  // rowReorderingHeaderName: 'Row reordering',
+  collapseDetailPanel: 'Gizle',
+  // Row reordering text
+  rowReorderingHeaderName: 'Satırı yeniden sırala',
   // Aggregation
-  // aggregationMenuItemHeader: 'Aggregation',
-  // aggregationFunctionLabelSum: 'sum',
-  // aggregationFunctionLabelAvg: 'avg',
-  // aggregationFunctionLabelMin: 'min',
-  // aggregationFunctionLabelMax: 'max',
-  // aggregationFunctionLabelSize: 'size',
-
+  aggregationMenuItemHeader: 'Toplama',
+  aggregationFunctionLabelSum: 'top',
+  aggregationFunctionLabelAvg: 'ort',
+  aggregationFunctionLabelMin: 'min',
+  aggregationFunctionLabelMax: 'maks',
+  aggregationFunctionLabelSize: 'boyut'
 };
 export const trTR = getGridLocalization(trTRGrid, trTRCore);

package/modern/components/panel/GridColumnsPanel.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["sort"];
+const _excluded = ["sort", "searchPredicate"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import { unstable_composeClasses as composeClasses } from '@mui/material';
@@ -59,6 +59,10 @@ const GridIconButtonRoot = styled(IconButton)({
 });
 const collator = new Intl.Collator();
 
+const defaultSearchPredicate = (column, searchValue) => {
+  return (column.headerName || column.field).toLowerCase().indexOf(searchValue) > -1;
+};
+
 function GridColumnsPanel(props) {
   const apiRef = useGridApiContext();
   const searchInputRef = React.useRef(null);
@@ -72,7 +76,8 @@ function GridColumnsPanel(props) {
   const classes = useUtilityClasses(ownerState);
 
   const {
-    sort
+    sort,
+    searchPredicate = defaultSearchPredicate
   } = props,
         other = _objectWithoutPropertiesLoose(props, _excluded);
 
@@ -126,8 +131,8 @@ function GridColumnsPanel(props) {
     }
 
     const searchValueToCheck = searchValue.toLowerCase();
-    return sortedColumns.filter(column => (column.headerName || column.field).toLowerCase().indexOf(searchValueToCheck) > -1);
-  }, [sortedColumns, searchValue]);
+    return sortedColumns.filter(column => searchPredicate(column, searchValueToCheck));
+  }, [sortedColumns, searchValue, searchPredicate]);
   React.useEffect(() => {
     searchInputRef.current.focus();
   }, []);
@@ -185,6 +190,7 @@ process.env.NODE_ENV !== "production" ? GridColumnsPanel.propTypes = {
   // | These PropTypes are generated from the TypeScript type definitions |
   // | To update them edit the TypeScript types and run "yarn proptypes"  |
   // ----------------------------------------------------------------------
+  searchPredicate: PropTypes.func,
   sort: PropTypes.oneOf(['asc', 'desc'])
 } : void 0;
 export { GridColumnsPanel };

package/modern/hooks/features/rows/gridRowsUtils.js

@@ -22,11 +22,13 @@ export const getRowIdFromRowModel = (rowModel, getRowId, detailErrorMessage) =>
 export const createRowsInternalCache = ({
   rows,
   getRowId,
-  loading
+  loading,
+  rowCount
 }) => {
   const cache = {
     rowsBeforePartialUpdates: rows,
     loadingPropBeforePartialUpdates: loading,
+    rowCountPropBeforePartialUpdates: rowCount,
     idRowsLookup: {},
     idToIdLookup: {},
     ids: []

package/modern/hooks/features/rows/useGridRows.js

@@ -13,7 +13,8 @@ export const rowsStateInitializer = (state, props, apiRef) => {
   apiRef.current.unstable_caches.rows = createRowsInternalCache({
     rows: props.rows,
     getRowId: props.getRowId,
-    loading: props.loading
+    loading: props.loading,
+    rowCount: props.rowCount
   });
   return _extends({}, state, {
     rows: getRowsStateFromCache({
@@ -90,9 +91,10 @@ export const useGridRows = (apiRef, props) => {
     throttledRowsChange(createRowsInternalCache({
       rows,
       getRowId: props.getRowId,
-      loading: props.loading
+      loading: props.loading,
+      rowCount: props.rowCount
     }), true);
-  }, [logger, props.getRowId, props.loading, throttledRowsChange]);
+  }, [logger, props.getRowId, props.loading, props.rowCount, throttledRowsChange]);
   const updateRows = React.useCallback(updates => {
     if (props.signature === GridSignature.DataGrid && updates.length > 1) {
       // TODO: Add test with direct call to `apiRef.current.updateRows` in DataGrid after enabling the `apiRef` on the free plan.
@@ -115,6 +117,7 @@ export const useGridRows = (apiRef, props) => {
     const newCache = {
       rowsBeforePartialUpdates: prevCache.rowsBeforePartialUpdates,
       loadingPropBeforePartialUpdates: prevCache.loadingPropBeforePartialUpdates,
+      rowCountPropBeforePartialUpdates: prevCache.rowCountPropBeforePartialUpdates,
       idRowsLookup: _extends({}, prevCache.idRowsLookup),
       idToIdLookup: _extends({}, prevCache.idToIdLookup),
       ids: [...prevCache.ids]
@@ -233,6 +236,7 @@ export const useGridRows = (apiRef, props) => {
         ids: updatedRows
       })
     }));
+    apiRef.current.unstable_caches.rows.ids = updatedRows;
     apiRef.current.publishEvent('rowsSet');
   }, [apiRef, logger]);
   const replaceRows = React.useCallback((firstRowToRender, newRows) => {
@@ -324,12 +328,13 @@ export const useGridRows = (apiRef, props) => {
       cache = createRowsInternalCache({
         rows: props.rows,
         getRowId: props.getRowId,
-        loading: props.loading
+        loading: props.loading,
+        rowCount: props.rowCount
       });
     }
 
     throttledRowsChange(cache, false);
-  }, [logger, apiRef, props.rows, props.getRowId, props.loading, throttledRowsChange]);
+  }, [logger, apiRef, props.rows, props.getRowId, props.loading, props.rowCount, throttledRowsChange]);
   const handleStrategyProcessorChange = React.useCallback(methodName => {
     if (methodName === 'rowTreeCreation') {
       groupRows();
@@ -378,7 +383,8 @@ export const useGridRows = (apiRef, props) => {
     }
 
     const areNewRowsAlreadyInState = apiRef.current.unstable_caches.rows.rowsBeforePartialUpdates === props.rows;
-    const isNewLoadingAlreadyInState = apiRef.current.unstable_caches.rows.loadingPropBeforePartialUpdates === props.loading; // The new rows have already been applied (most likely in the `'rowGroupsPreProcessingChange'` listener)
+    const isNewLoadingAlreadyInState = apiRef.current.unstable_caches.rows.loadingPropBeforePartialUpdates === props.loading;
+    const isNewRowCountAlreadyInState = apiRef.current.unstable_caches.rows.rowCountPropBeforePartialUpdates === props.rowCount; // The new rows have already been applied (most likely in the `'rowGroupsPreProcessingChange'` listener)
 
     if (areNewRowsAlreadyInState) {
       // If the loading prop has changed, we need to update its value in the state because it won't be done by `throttledRowsChange`
@@ -392,6 +398,17 @@ export const useGridRows = (apiRef, props) => {
         apiRef.current.forceUpdate();
       }
 
+      if (!isNewRowCountAlreadyInState) {
+        apiRef.current.setState(state => _extends({}, state, {
+          rows: _extends({}, state.rows, {
+            totalRowCount: Math.max(props.rowCount || 0, state.rows.totalRowCount),
+            totalTopLevelRowCount: Math.max(props.rowCount || 0, state.rows.totalTopLevelRowCount)
+          })
+        }));
+        apiRef.current.unstable_caches.rows.rowCountPropBeforePartialUpdates = props.rowCount;
+        apiRef.current.forceUpdate();
+      }
+
       return;
     }
 
@@ -399,7 +416,8 @@ export const useGridRows = (apiRef, props) => {
     throttledRowsChange(createRowsInternalCache({
       rows: props.rows,
       getRowId: props.getRowId,
-      loading: props.loading
+      loading: props.loading,
+      rowCount: props.rowCount
     }), false);
   }, [props.rows, props.rowCount, props.getRowId, props.loading, logger, throttledRowsChange, apiRef]);
 };

package/modern/index.js

@@ -1,4 +1,4 @@
-/** @license MUI v5.17.7
+/** @license MUI v5.17.8
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.

package/modern/locales/trTR.js

@@ -39,7 +39,7 @@ const trTRGrid = {
   // Filter panel text
   filterPanelAddFilter: 'Filtre Ekle',
   filterPanelDeleteIconLabel: 'Kaldır',
-  // filterPanelLinkOperator: 'Logic operator',
+  filterPanelLinkOperator: 'Mantıksal operatörler',
   filterPanelOperators: 'Operatör',
   // TODO v6: rename to filterPanelOperator
   filterPanelOperatorAnd: 'Ve',
@@ -85,13 +85,13 @@ const trTRGrid = {
   footerTotalVisibleRows: (visibleCount, totalCount) => `${visibleCount.toLocaleString()} / ${totalCount.toLocaleString()}`,
   // Checkbox selection text
   checkboxSelectionHeaderName: 'Seçim',
-  // checkboxSelectionSelectAllRows: 'Select all rows',
-  // checkboxSelectionUnselectAllRows: 'Unselect all rows',
-  // checkboxSelectionSelectRow: 'Select row',
-  // checkboxSelectionUnselectRow: 'Unselect row',
+  checkboxSelectionSelectAllRows: 'Tüm satırları seç',
+  checkboxSelectionUnselectAllRows: 'Tüm satırların seçimini kaldır',
+  checkboxSelectionSelectRow: 'Satırı seç',
+  checkboxSelectionUnselectRow: 'Satır seçimini bırak',
   // Boolean cell text
-  // booleanCellTrueLabel: 'yes',
-  // booleanCellFalseLabel: 'no',
+  booleanCellTrueLabel: 'Evet',
+  booleanCellFalseLabel: 'Hayır',
   // Actions cell more text
   actionsCellMore: 'daha fazla',
   // Column pinning text
@@ -107,17 +107,17 @@ const trTRGrid = {
   groupColumn: name => `${name} için grupla`,
   unGroupColumn: name => `${name} için gruplamayı kaldır`,
   // Master/detail
-  // detailPanelToggle: 'Detail panel toggle',
+  detailPanelToggle: 'Detay görünümüne geçiş',
   expandDetailPanel: 'Genişlet',
-  collapseDetailPanel: 'Gizle' // Row reordering text
-  // rowReorderingHeaderName: 'Row reordering',
+  collapseDetailPanel: 'Gizle',
+  // Row reordering text
+  rowReorderingHeaderName: 'Satırı yeniden sırala',
   // Aggregation
-  // aggregationMenuItemHeader: 'Aggregation',
-  // aggregationFunctionLabelSum: 'sum',
-  // aggregationFunctionLabelAvg: 'avg',
-  // aggregationFunctionLabelMin: 'min',
-  // aggregationFunctionLabelMax: 'max',
-  // aggregationFunctionLabelSize: 'size',
-
+  aggregationMenuItemHeader: 'Toplama',
+  aggregationFunctionLabelSum: 'top',
+  aggregationFunctionLabelAvg: 'ort',
+  aggregationFunctionLabelMin: 'min',
+  aggregationFunctionLabelMax: 'maks',
+  aggregationFunctionLabelSize: 'boyut'
 };
 export const trTR = getGridLocalization(trTRGrid, trTRCore);

package/node/components/panel/GridColumnsPanel.js

@@ -49,7 +49,7 @@ var _gridClasses = require("../../constants/gridClasses");
 
 var _jsxRuntime = require("react/jsx-runtime");
 
-const _excluded = ["sort"];
+const _excluded = ["sort", "searchPredicate"];
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
@@ -92,6 +92,10 @@ const GridIconButtonRoot = (0, _styles.styled)(_IconButton.default)({
 });
 const collator = new Intl.Collator();
 
+const defaultSearchPredicate = (column, searchValue) => {
+  return (column.headerName || column.field).toLowerCase().indexOf(searchValue) > -1;
+};
+
 function GridColumnsPanel(props) {
   var _rootProps$components, _rootProps$components3, _rootProps$components4;
 
@@ -106,7 +110,8 @@ function GridColumnsPanel(props) {
   };
   const classes = useUtilityClasses(ownerState);
   const {
-    sort
+    sort,
+    searchPredicate = defaultSearchPredicate
   } = props,
         other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
   const sortedColumns = React.useMemo(() => {
@@ -159,8 +164,8 @@ function GridColumnsPanel(props) {
     }
 
     const searchValueToCheck = searchValue.toLowerCase();
-    return sortedColumns.filter(column => (column.headerName || column.field).toLowerCase().indexOf(searchValueToCheck) > -1);
-  }, [sortedColumns, searchValue]);
+    return sortedColumns.filter(column => searchPredicate(column, searchValueToCheck));
+  }, [sortedColumns, searchValue, searchPredicate]);
   React.useEffect(() => {
     searchInputRef.current.focus();
   }, []);
@@ -222,5 +227,6 @@ process.env.NODE_ENV !== "production" ? GridColumnsPanel.propTypes = {
   // | These PropTypes are generated from the TypeScript type definitions |
   // | To update them edit the TypeScript types and run "yarn proptypes"  |
   // ----------------------------------------------------------------------
+  searchPredicate: _propTypes.default.func,
   sort: _propTypes.default.oneOf(['asc', 'desc'])
 } : void 0;

package/node/hooks/features/rows/gridRowsUtils.js

@@ -40,11 +40,13 @@ exports.getRowIdFromRowModel = getRowIdFromRowModel;
 const createRowsInternalCache = ({
   rows,
   getRowId,
-  loading
+  loading,
+  rowCount
 }) => {
   const cache = {
     rowsBeforePartialUpdates: rows,
     loadingPropBeforePartialUpdates: loading,
+    rowCountPropBeforePartialUpdates: rowCount,
     idRowsLookup: {},
     idToIdLookup: {},
     ids: []

package/node/hooks/features/rows/useGridRows.js

@@ -37,7 +37,8 @@ const rowsStateInitializer = (state, props, apiRef) => {
   apiRef.current.unstable_caches.rows = (0, _gridRowsUtils.createRowsInternalCache)({
     rows: props.rows,
     getRowId: props.getRowId,
-    loading: props.loading
+    loading: props.loading,
+    rowCount: props.rowCount
   });
   return (0, _extends2.default)({}, state, {
     rows: (0, _gridRowsUtils.getRowsStateFromCache)({
@@ -121,9 +122,10 @@ const useGridRows = (apiRef, props) => {
     throttledRowsChange((0, _gridRowsUtils.createRowsInternalCache)({
       rows,
       getRowId: props.getRowId,
-      loading: props.loading
+      loading: props.loading,
+      rowCount: props.rowCount
     }), true);
-  }, [logger, props.getRowId, props.loading, throttledRowsChange]);
+  }, [logger, props.getRowId, props.loading, props.rowCount, throttledRowsChange]);
   const updateRows = React.useCallback(updates => {
     if (props.signature === _useGridApiEventHandler.GridSignature.DataGrid && updates.length > 1) {
       // TODO: Add test with direct call to `apiRef.current.updateRows` in DataGrid after enabling the `apiRef` on the free plan.
@@ -146,6 +148,7 @@ const useGridRows = (apiRef, props) => {
     const newCache = {
       rowsBeforePartialUpdates: prevCache.rowsBeforePartialUpdates,
       loadingPropBeforePartialUpdates: prevCache.loadingPropBeforePartialUpdates,
+      rowCountPropBeforePartialUpdates: prevCache.rowCountPropBeforePartialUpdates,
       idRowsLookup: (0, _extends2.default)({}, prevCache.idRowsLookup),
       idToIdLookup: (0, _extends2.default)({}, prevCache.idToIdLookup),
       ids: [...prevCache.ids]
@@ -267,6 +270,7 @@ const useGridRows = (apiRef, props) => {
         ids: updatedRows
       })
     }));
+    apiRef.current.unstable_caches.rows.ids = updatedRows;
     apiRef.current.publishEvent('rowsSet');
   }, [apiRef, logger]);
   const replaceRows = React.useCallback((firstRowToRender, newRows) => {
@@ -354,12 +358,13 @@ const useGridRows = (apiRef, props) => {
       cache = (0, _gridRowsUtils.createRowsInternalCache)({
         rows: props.rows,
         getRowId: props.getRowId,
-        loading: props.loading
+        loading: props.loading,
+        rowCount: props.rowCount
       });
     }
 
     throttledRowsChange(cache, false);
-  }, [logger, apiRef, props.rows, props.getRowId, props.loading, throttledRowsChange]);
+  }, [logger, apiRef, props.rows, props.getRowId, props.loading, props.rowCount, throttledRowsChange]);
   const handleStrategyProcessorChange = React.useCallback(methodName => {
     if (methodName === 'rowTreeCreation') {
       groupRows();
@@ -408,7 +413,8 @@ const useGridRows = (apiRef, props) => {
     }
 
     const areNewRowsAlreadyInState = apiRef.current.unstable_caches.rows.rowsBeforePartialUpdates === props.rows;
-    const isNewLoadingAlreadyInState = apiRef.current.unstable_caches.rows.loadingPropBeforePartialUpdates === props.loading; // The new rows have already been applied (most likely in the `'rowGroupsPreProcessingChange'` listener)
+    const isNewLoadingAlreadyInState = apiRef.current.unstable_caches.rows.loadingPropBeforePartialUpdates === props.loading;
+    const isNewRowCountAlreadyInState = apiRef.current.unstable_caches.rows.rowCountPropBeforePartialUpdates === props.rowCount; // The new rows have already been applied (most likely in the `'rowGroupsPreProcessingChange'` listener)
 
     if (areNewRowsAlreadyInState) {
       // If the loading prop has changed, we need to update its value in the state because it won't be done by `throttledRowsChange`
@@ -422,6 +428,17 @@ const useGridRows = (apiRef, props) => {
         apiRef.current.forceUpdate();
       }
 
+      if (!isNewRowCountAlreadyInState) {
+        apiRef.current.setState(state => (0, _extends2.default)({}, state, {
+          rows: (0, _extends2.default)({}, state.rows, {
+            totalRowCount: Math.max(props.rowCount || 0, state.rows.totalRowCount),
+            totalTopLevelRowCount: Math.max(props.rowCount || 0, state.rows.totalTopLevelRowCount)
+          })
+        }));
+        apiRef.current.unstable_caches.rows.rowCountPropBeforePartialUpdates = props.rowCount;
+        apiRef.current.forceUpdate();
+      }
+
       return;
     }
 
@@ -429,7 +446,8 @@ const useGridRows = (apiRef, props) => {
     throttledRowsChange((0, _gridRowsUtils.createRowsInternalCache)({
       rows: props.rows,
       getRowId: props.getRowId,
-      loading: props.loading
+      loading: props.loading,
+      rowCount: props.rowCount
     }), false);
   }, [props.rows, props.rowCount, props.getRowId, props.loading, logger, throttledRowsChange, apiRef]);
 };

package/node/index.js

@@ -1,4 +1,4 @@
-/** @license MUI v5.17.7
+/** @license MUI v5.17.8
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.

package/node/locales/trTR.js

@@ -48,7 +48,7 @@ const trTRGrid = {
   // Filter panel text
   filterPanelAddFilter: 'Filtre Ekle',
   filterPanelDeleteIconLabel: 'Kaldır',
-  // filterPanelLinkOperator: 'Logic operator',
+  filterPanelLinkOperator: 'Mantıksal operatörler',
   filterPanelOperators: 'Operatör',
   // TODO v6: rename to filterPanelOperator
   filterPanelOperatorAnd: 'Ve',
@@ -94,13 +94,13 @@ const trTRGrid = {
   footerTotalVisibleRows: (visibleCount, totalCount) => `${visibleCount.toLocaleString()} / ${totalCount.toLocaleString()}`,
   // Checkbox selection text
   checkboxSelectionHeaderName: 'Seçim',
-  // checkboxSelectionSelectAllRows: 'Select all rows',
-  // checkboxSelectionUnselectAllRows: 'Unselect all rows',
-  // checkboxSelectionSelectRow: 'Select row',
-  // checkboxSelectionUnselectRow: 'Unselect row',
+  checkboxSelectionSelectAllRows: 'Tüm satırları seç',
+  checkboxSelectionUnselectAllRows: 'Tüm satırların seçimini kaldır',
+  checkboxSelectionSelectRow: 'Satırı seç',
+  checkboxSelectionUnselectRow: 'Satır seçimini bırak',
   // Boolean cell text
-  // booleanCellTrueLabel: 'yes',
-  // booleanCellFalseLabel: 'no',
+  booleanCellTrueLabel: 'Evet',
+  booleanCellFalseLabel: 'Hayır',
   // Actions cell more text
   actionsCellMore: 'daha fazla',
   // Column pinning text
@@ -116,18 +116,18 @@ const trTRGrid = {
   groupColumn: name => `${name} için grupla`,
   unGroupColumn: name => `${name} için gruplamayı kaldır`,
   // Master/detail
-  // detailPanelToggle: 'Detail panel toggle',
+  detailPanelToggle: 'Detay görünümüne geçiş',
   expandDetailPanel: 'Genişlet',
-  collapseDetailPanel: 'Gizle' // Row reordering text
-  // rowReorderingHeaderName: 'Row reordering',
+  collapseDetailPanel: 'Gizle',
+  // Row reordering text
+  rowReorderingHeaderName: 'Satırı yeniden sırala',
   // Aggregation
-  // aggregationMenuItemHeader: 'Aggregation',
-  // aggregationFunctionLabelSum: 'sum',
-  // aggregationFunctionLabelAvg: 'avg',
-  // aggregationFunctionLabelMin: 'min',
-  // aggregationFunctionLabelMax: 'max',
-  // aggregationFunctionLabelSize: 'size',
-
+  aggregationMenuItemHeader: 'Toplama',
+  aggregationFunctionLabelSum: 'top',
+  aggregationFunctionLabelAvg: 'ort',
+  aggregationFunctionLabelMin: 'min',
+  aggregationFunctionLabelMax: 'maks',
+  aggregationFunctionLabelSize: 'boyut'
 };
 const trTR = (0, _getGridLocalization.getGridLocalization)(trTRGrid, _locale.trTR);
 exports.trTR = trTR;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-data-grid",
-  "version": "5.17.7",
+  "version": "5.17.8",
   "description": "The community edition of the data grid component (MUI X).",
   "author": "MUI Team",
   "main": "./node/index.js",