@mui/x-data-grid 8.22.1 → 8.24.0

package/hooks/features/columns/gridColumnsUtils.js

@@ -251,8 +251,7 @@ const createColumnsState = ({
     const currentState = (0, _gridColumnsSelector.gridColumnsStateSelector)(apiRef);
     columnsState = {
       orderedFields: keepOnlyColumnsToUpsert ? [] : [...currentState.orderedFields],
-      lookup: (0, _extends2.default)({}, currentState.lookup),
-      // Will be cleaned later if keepOnlyColumnsToUpsert=true
+      lookup: keepOnlyColumnsToUpsert ? {} : (0, _extends2.default)({}, currentState.lookup),
       columnVisibilityModel,
       initialColumnVisibilityModel: updateInitialVisibilityModel ? columnVisibilityModel : currentState.initialColumnVisibilityModel
     };
@@ -265,12 +264,10 @@ const createColumnsState = ({
       }
     }
   }
-  const columnsToUpsertLookup = {};
   columnsToUpsert.forEach(newColumn => {
     const {
       field
     } = newColumn;
-    columnsToUpsertLookup[field] = true;
     columnsToKeep[field] = true;
     let existingState = columnsState.lookup[field];
     if (existingState == null) {

package/hooks/features/dataSource/useGridDataSourceBase.d.ts

@@ -21,8 +21,8 @@ export declare const useGridDataSourceBase: <Api extends GridPrivateApiCommunity
   cache: GridDataSourceCache;
   events: {
     strategyAvailabilityChange: GridEventListener<"strategyAvailabilityChange">;
-    sortModelChange: (params: unknown) => void;
-    filterModelChange: (params: unknown) => void;
-    paginationModelChange: (params: unknown) => void;
+    sortModelChange: (...params: unknown[]) => void;
+    filterModelChange: (...params: unknown[]) => void;
+    paginationModelChange: (...params: unknown[]) => void;
   };
 };

package/hooks/features/editing/useGridCellEditing.js

@@ -114,6 +114,7 @@ const useGridCellEditing = (apiRef, props) => {
         reason = _gridEditCellParams.GridCellEditStartReasons.pasteKeyDown;
       } else if (event.key === 'Enter') {
         reason = _gridEditCellParams.GridCellEditStartReasons.enterKeyDown;
+        event.preventDefault();
       } else if (event.key === 'Backspace' || event.key === 'Delete') {
         reason = _gridEditCellParams.GridCellEditStartReasons.deleteKeyDown;
       }

package/hooks/features/pagination/gridPaginationSelector.js

@@ -66,6 +66,9 @@ const gridPaginationRowRangeSelector = exports.gridPaginationRowRangeSelector =
   if (!clientSidePaginationEnabled) {
     return null;
   }
+  if (!visibleSortedRowEntries || visibleSortedRowEntries.length === 0) {
+    return null;
+  }
   const visibleTopLevelRowCount = visibleSortedTopLevelRowEntries.length;
   const topLevelFirstRowIndex = Math.min(paginationModel.pageSize * paginationModel.page, visibleTopLevelRowCount - 1);
   const topLevelLastRowIndex = paginationModel.pageSize === ALL_RESULTS_PAGE_VALUE ? visibleTopLevelRowCount - 1 : Math.min(topLevelFirstRowIndex + paginationModel.pageSize - 1, visibleTopLevelRowCount - 1);

package/hooks/features/rowSelection/useGridRowSelection.js

@@ -27,6 +27,7 @@ var _constants = require("../../../internals/constants");
 var _gridClasses = require("../../../constants/gridClasses");
 var _domUtils = require("../../../utils/domUtils");
 var _utils = require("./utils");
+var _utils2 = require("../../../utils/utils");
 var _gridRowSelectionManager = require("../../../models/gridRowSelectionManager");
 var _pagination = require("../pagination");
 const emptyModel = {
@@ -46,11 +47,6 @@ const rowSelectionStateInitializer = (state, props) => (0, _extends2.default)({}
 exports.rowSelectionStateInitializer = rowSelectionStateInitializer;
 const useGridRowSelection = (apiRef, props) => {
   const logger = (0, _useGridLogger.useGridLogger)(apiRef, 'useGridSelection');
-  const runIfRowSelectionIsEnabled = React.useCallback(callback => (...args) => {
-    if (props.rowSelection) {
-      callback(...args);
-    }
-  }, [props.rowSelection]);
   const isNestedData = (0, _useGridSelector.useGridSelector)(apiRef, _gridRowsSelector.gridRowMaximumTreeDepthSelector) > 1;
   const applyAutoSelection = props.signature !== _signature.GridSignature.DataGrid && (props.rowSelectionPropagation?.parents || props.rowSelectionPropagation?.descendants) && isNestedData;
   const propRowSelectionModel = React.useMemo(() => {
@@ -129,6 +125,12 @@ const useGridRowSelection = (apiRef, props) => {
     if (props.rowSelection === false) {
       return false;
     }
+
+    // If `keepNonExistentRowsSelected` is true, we might run in a case where row selectability is checked for a row that does not exist.
+    // Since that row was previously selected (otherwise it would not be checked at this point), we return true.
+    if (props.keepNonExistentRowsSelected && !apiRef.current.getRow(id)) {
+      return true;
+    }
     if (propIsRowSelectable && !propIsRowSelectable(apiRef.current.getRowParams(id))) {
       return false;
     }
@@ -137,7 +139,7 @@ const useGridRowSelection = (apiRef, props) => {
       return false;
     }
     return true;
-  }, [apiRef, props.rowSelection, propIsRowSelectable]);
+  }, [apiRef, props.rowSelection, props.keepNonExistentRowsSelected, propIsRowSelectable]);
   const getSelectedRows = React.useCallback(() => (0, _gridRowSelectionSelector.gridRowSelectionIdsSelector)(apiRef), [apiRef]);
   const selectRow = React.useCallback((id, isSelected = true, resetSelection = false) => {
     if (!apiRef.current.isRowSelectable(id)) {
@@ -311,7 +313,7 @@ const useGridRowSelection = (apiRef, props) => {
    * EVENTS
    */
   const isFirstRender = React.useRef(true);
-  const removeOutdatedSelection = React.useCallback((sortModelUpdated = false) => {
+  const removeOutdatedSelection = React.useCallback(() => {
     if (isFirstRender.current) {
       return;
     }
@@ -365,7 +367,7 @@ const useGridRowSelection = (apiRef, props) => {
     const shouldReapplyPropagation = isNestedData && props.rowSelectionPropagation?.parents && (newSelectionModel.ids.size > 0 ||
     // In case of exclude selection, newSelectionModel.ids.size === 0 means all rows are selected
     newSelectionModel.type === 'exclude');
-    if (hasChanged || shouldReapplyPropagation && !sortModelUpdated) {
+    if (hasChanged || shouldReapplyPropagation) {
       if (shouldReapplyPropagation) {
         if (newSelectionModel.type === 'exclude') {
           const unfilteredSelectedRowIds = getRowsToBeSelected();
@@ -548,12 +550,12 @@ const useGridRowSelection = (apiRef, props) => {
     }
     apiRef.current.setRowSelectionModel(propRowSelectionModel);
   });
-  (0, _useGridEvent.useGridEvent)(apiRef, 'filteredRowsSet', runIfRowSelectionIsEnabled(() => removeOutdatedSelection()));
-  (0, _useGridEvent.useGridEvent)(apiRef, 'rowClick', runIfRowSelectionIsEnabled(handleRowClick));
-  (0, _useGridEvent.useGridEvent)(apiRef, 'rowSelectionCheckboxChange', runIfRowSelectionIsEnabled(handleRowSelectionCheckboxChange));
+  (0, _useGridEvent.useGridEvent)(apiRef, 'filteredRowsSet', (0, _utils2.runIf)(props.rowSelection, removeOutdatedSelection));
+  (0, _useGridEvent.useGridEvent)(apiRef, 'rowClick', (0, _utils2.runIf)(props.rowSelection, handleRowClick));
+  (0, _useGridEvent.useGridEvent)(apiRef, 'rowSelectionCheckboxChange', (0, _utils2.runIf)(props.rowSelection, handleRowSelectionCheckboxChange));
   (0, _useGridEvent.useGridEvent)(apiRef, 'headerSelectionCheckboxChange', handleHeaderSelectionCheckboxChange);
-  (0, _useGridEvent.useGridEvent)(apiRef, 'cellMouseDown', runIfRowSelectionIsEnabled(preventSelectionOnShift));
-  (0, _useGridEvent.useGridEvent)(apiRef, 'cellKeyDown', runIfRowSelectionIsEnabled(handleCellKeyDown));
+  (0, _useGridEvent.useGridEvent)(apiRef, 'cellMouseDown', (0, _utils2.runIf)(props.rowSelection, preventSelectionOnShift));
+  (0, _useGridEvent.useGridEvent)(apiRef, 'cellKeyDown', (0, _utils2.runIf)(props.rowSelection, handleCellKeyDown));
 
   /*
    * EFFECTS
@@ -596,8 +598,8 @@ const useGridRowSelection = (apiRef, props) => {
     }
   }, [apiRef, canHaveMultipleSelection, checkboxSelection, isStateControlled, props.rowSelection]);
   React.useEffect(() => {
-    runIfRowSelectionIsEnabled(removeOutdatedSelection);
-  }, [removeOutdatedSelection, runIfRowSelectionIsEnabled]);
+    (0, _utils2.runIf)(props.rowSelection, removeOutdatedSelection);
+  }, [props.rowSelection, removeOutdatedSelection]);
   React.useEffect(() => {
     if (isFirstRender.current) {
       isFirstRender.current = false;

package/hooks/features/rowSelection/utils.js

@@ -47,7 +47,7 @@ const checkboxPropsSelector = exports.checkboxPropsSelector = (0, _createSelecto
     columns
   };
   let isSelectable = true;
-  if (typeof isRowSelectable === 'function') {
+  if (typeof isRowSelectable === 'function' && rowsLookup[groupId]) {
     isSelectable = isRowSelectable(rowParams);
   }
   if (!groupNode || groupNode.type !== 'group' || rowSelectionManager.has(groupId)) {
@@ -76,7 +76,7 @@ const checkboxPropsSelector = exports.checkboxPropsSelector = (0, _createSelecto
       row: rowsLookup[itemToTraverseId],
       columns
     };
-    const rowIsSelectable = typeof isRowSelectable === 'function' ? isRowSelectable(descendantRowParams) : true;
+    const rowIsSelectable = typeof isRowSelectable === 'function' && rowsLookup[itemToTraverseId] ? isRowSelectable(descendantRowParams) : true;
 
     // Only consider selectable rows when determining parent selection state
     if (rowIsSelectable) {

package/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-data-grid v8.22.1
+ * @mui/x-data-grid v8.24.0
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/internals/index.d.ts

@@ -8,6 +8,7 @@ export { GridHeaders } from "../components/GridHeaders.js";
 export { GridToolbar, GridToolbarDivider } from "../components/toolbarV8/GridToolbar.js";
 export type { GridToolbarProps } from "../components/toolbarV8/GridToolbar.js";
 export { GridColumnSortButton } from "../components/GridColumnSortButton.js";
+export { GridFooterCell } from "../components/cell/GridFooterCell.js";
 export { GridBaseColumnHeaders } from "../components/columnHeaders/GridBaseColumnHeaders.js";
 export { DATA_GRID_DEFAULT_SLOTS_COMPONENTS } from "../constants/defaultGridSlotsComponents.js";
 export * from "../constants/signature.js";
@@ -88,6 +89,7 @@ export { useGridInitializeState } from "../hooks/utils/useGridInitializeState.js
 export type { GridStateInitializer } from "../hooks/utils/useGridInitializeState.js";
 export type * as BaseSlots from "../models/gridBaseSlots.js";
 export type * from "../models/props/DataGridProps.js";
+export type { GridAggregationPosition, GridAggregationCellMeta } from "../models/gridAggregation.js";
 export type { GridDataSourceApiBase, GridDataSourceApi, GridDataSourceBaseOptions, GridDataSourceFetchRowsParams } from "../hooks/features/dataSource/models.js";
 export { DataSourceRowsUpdateStrategy } from "../hooks/features/dataSource/utils.js";
 export { useGridDataSourceBase } from "../hooks/features/dataSource/useGridDataSourceBase.js";

package/internals/index.js

@@ -11,6 +11,7 @@ var _exportNames = {
   GridToolbar: true,
   GridToolbarDivider: true,
   GridColumnSortButton: true,
+  GridFooterCell: true,
   GridBaseColumnHeaders: true,
   DATA_GRID_DEFAULT_SLOTS_COMPONENTS: true,
   vars: true,
@@ -169,6 +170,12 @@ Object.defineProperty(exports, "GridColumnSortButton", {
     return _GridColumnSortButton.GridColumnSortButton;
   }
 });
+Object.defineProperty(exports, "GridFooterCell", {
+  enumerable: true,
+  get: function () {
+    return _GridFooterCell.GridFooterCell;
+  }
+});
 Object.defineProperty(exports, "GridHeaders", {
   enumerable: true,
   get: function () {
@@ -865,6 +872,7 @@ var _GridVirtualScrollerRenderZone = require("../components/virtualization/GridV
 var _GridHeaders = require("../components/GridHeaders");
 var _GridToolbar = require("../components/toolbarV8/GridToolbar");
 var _GridColumnSortButton = require("../components/GridColumnSortButton");
+var _GridFooterCell = require("../components/cell/GridFooterCell");
 var _GridBaseColumnHeaders = require("../components/columnHeaders/GridBaseColumnHeaders");
 var _defaultGridSlotsComponents = require("../constants/defaultGridSlotsComponents");
 var _signature = require("../constants/signature");

package/locales/arSD.js

@@ -29,7 +29,7 @@ const arSDGrid = {
   toolbarFiltersTooltipShow: 'اظهر المرشِحات',
   toolbarFiltersTooltipActive: count => count !== 1 ? `${count} من المرشِحات النشطة` : `مرشِح نشط`,
   // Quick filter toolbar field
-  toolbarQuickFilterPlaceholder: 'بحث...',
+  toolbarQuickFilterPlaceholder: 'بحث…',
   toolbarQuickFilterLabel: 'بحث',
   toolbarQuickFilterDeleteIconLabel: 'أزال',
   // Export selector toolbar button text

package/locales/daDK.js

@@ -9,8 +9,8 @@ const daDKGrid = {
   // Root
   noRowsLabel: 'Ingen rækker',
   noResultsOverlayLabel: 'Ingen resultater',
-  // noColumnsOverlayLabel: 'No columns',
-  // noColumnsOverlayManageColumns: 'Manage columns',
+  noColumnsOverlayLabel: 'Ingen kolonner',
+  noColumnsOverlayManageColumns: 'Administrer kolonner',
   // emptyPivotOverlayLabel: 'Add fields to rows, columns, and values to create a pivot table',
 
   // Density selector toolbar button text
@@ -109,8 +109,7 @@ const daDKGrid = {
   'headerFilterOperator>=': 'Større end eller lig med',
   'headerFilterOperator<': 'Mindre end',
   'headerFilterOperator<=': 'Mindre end eller lig med',
-  // headerFilterClear: 'Clear filter',
-
+  headerFilterClear: 'Ryd filter',
   // Filter values text
   filterValueAny: 'hvilken som helst',
   filterValueTrue: 'positiv',

package/locales/faIR.js

@@ -29,7 +29,7 @@ const faIRGrid = {
   toolbarFiltersTooltipShow: 'نمایش فیلترها',
   toolbarFiltersTooltipActive: count => count !== 1 ? `${count} فیلترهای فعال` : `${count} فیلتر فعال`,
   // Quick filter toolbar field
-  toolbarQuickFilterPlaceholder: 'جستجو...',
+  toolbarQuickFilterPlaceholder: 'جستجو…',
   toolbarQuickFilterLabel: 'جستجو',
   toolbarQuickFilterDeleteIconLabel: 'حذف',
   // Export selector toolbar button text

package/locales/jaJP.js

@@ -109,8 +109,7 @@ const jaJPGrid = {
   'headerFilterOperator>=': '以上',
   'headerFilterOperator<': '未満',
   'headerFilterOperator<=': '以下',
-  // headerFilterClear: 'Clear filter',
-
+  headerFilterClear: 'フィルターを削除',
   // Filter values text
   filterValueAny: 'いずれか',
   filterValueTrue: '真',
@@ -125,9 +124,8 @@ const jaJPGrid = {
   columnMenuUnsort: 'ソート解除',
   columnMenuSortAsc: '昇順ソート',
   columnMenuSortDesc: '降順ソート',
-  // columnMenuManagePivot: 'Manage pivot',
-  // columnMenuManageCharts: 'Manage charts',
-
+  columnMenuManagePivot: 'ピボットを管理',
+  columnMenuManageCharts: 'チャートを管理',
   // Column header text
   columnHeaderFiltersTooltipActive: count => `${count}件のフィルターを適用中`,
   columnHeaderFiltersLabel: 'フィルター表示',
@@ -167,18 +165,18 @@ const jaJPGrid = {
   collapseDetailPanel: '折りたたみ',
   // Pagination
   paginationRowsPerPage: 'ページあたりの行数:',
-  // paginationDisplayedRows: ({
-  //   from,
-  //   to,
-  //   count,
-  //   estimated
-  // }) => {
-  //   if (!estimated) {
-  //     return `${from}–${to} of ${count !== -1 ? count : `more than ${to}`}`;
-  //   }
-  //   const estimatedLabel = estimated && estimated > to ? `around ${estimated}` : `more than ${to}`;
-  //   return `${from}–${to} of ${count !== -1 ? count : estimatedLabel}`;
-  // },
+  paginationDisplayedRows: ({
+    from,
+    to,
+    count,
+    estimated
+  }) => {
+    if (!estimated) {
+      return `${from}–${to} of ${count !== -1 ? count : `${to}以上`}`;
+    }
+    const estimatedLabel = estimated && estimated > to ? `${estimated}前後` : `${to}以上`;
+    return `${from}–${to} of ${count !== -1 ? count : estimatedLabel}`;
+  },
   paginationItemAriaLabel: type => {
     if (type === 'first') {
       return '最初のページへ';
@@ -201,8 +199,7 @@ const jaJPGrid = {
   aggregationFunctionLabelAvg: '平均',
   aggregationFunctionLabelMin: '最小値',
   aggregationFunctionLabelMax: '最大値',
-  aggregationFunctionLabelSize: 'サイズ'
-
+  aggregationFunctionLabelSize: 'サイズ',
   // Pivot panel
   // pivotToggleLabel: 'Pivot',
   // pivotRows: 'Rows',
@@ -237,16 +234,16 @@ const jaJPGrid = {
   // chartsChartNotSelected: 'Select a chart type to configure its options',
   // chartsTabChart: 'Chart',
   // chartsTabFields: 'Fields',
-  // chartsTabCustomize: 'Customize',
+  chartsTabCustomize: 'カスタマイズ',
   // chartsCloseButton: 'Close charts configuration',
   // chartsSyncButtonLabel: 'Sync chart',
   // chartsSearchPlaceholder: 'Search fields',
-  // chartsSearchLabel: 'Search fields',
+  chartsSearchLabel: 'フィールドを検索する',
   // chartsSearchClear: 'Clear search',
   // chartsNoFields: 'No fields',
   // chartsFieldBlocked: 'This field cannot be added to any section',
-  // chartsCategories: 'Categories',
-  // chartsSeries: 'Series',
+  chartsCategories: 'カテゴリ',
+  chartsSeries: 'シリーズ',
   // chartsMenuAddToDimensions: (dimensionLabel: string) => `Add to ${dimensionLabel}`,
   // chartsMenuAddToValues: (valuesLabel: string) => `Add to ${valuesLabel}`,
   // chartsMenuMoveUp: 'Move up',
@@ -259,27 +256,25 @@ const jaJPGrid = {
   // chartsDragToValues: (valuesLabel: string) => `Drag here to use column as ${valuesLabel}`,
 
   // AI Assistant panel
-  // aiAssistantPanelTitle: 'AI Assistant',
-  // aiAssistantPanelClose: 'Close AI Assistant',
-  // aiAssistantPanelNewConversation: 'New conversation',
-  // aiAssistantPanelConversationHistory: 'Conversation history',
+  aiAssistantPanelTitle: 'AIアシスタント',
+  aiAssistantPanelClose: 'AIアシスタントパネルを閉じる',
+  aiAssistantPanelNewConversation: '新しい会話を開始する',
+  aiAssistantPanelConversationHistory: '会話の履歴',
   // aiAssistantPanelEmptyConversation: 'No prompt history',
-  // aiAssistantSuggestions: 'Suggestions',
-
+  aiAssistantSuggestions: '提案',
   // Prompt field
-  // promptFieldLabel: 'Prompt',
-  // promptFieldPlaceholder: 'Type a prompt…',
+  promptFieldLabel: 'プロンプト',
+  promptFieldPlaceholder: 'プロンプトを入力...',
   // promptFieldPlaceholderWithRecording: 'Type or record a prompt…',
   // promptFieldPlaceholderListening: 'Listening for prompt…',
   // promptFieldSpeechRecognitionNotSupported: 'Speech recognition is not supported in this browser',
-  // promptFieldSend: 'Send',
-  // promptFieldRecord: 'Record',
-  // promptFieldStopRecording: 'Stop recording',
-
+  promptFieldSend: '送信',
+  promptFieldRecord: '録音',
+  promptFieldStopRecording: '録音を止める',
   // Prompt
-  // promptRerun: 'Run again',
-  // promptProcessing: 'Processing…',
-  // promptAppliedChanges: 'Applied changes',
+  promptRerun: '再試行',
+  promptProcessing: '実行中…',
+  promptAppliedChanges: '変更を適用済み'
 
   // Prompt changes
   // promptChangeGroupDescription: (column: string) => `Group by ${column}`,

package/locales/ptPT.d.ts

@@ -1 +1,2 @@
-export declare const ptPT: import("../internals/index.js").Localization;
+import { Localization } from "../utils/getGridLocalization.js";
+export declare const ptPT: Localization;