Merge branch 'master' into fix-chrome-print-preview-regression

CHANGELOG.md

@@ -3,6 +3,93 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## v5.17.21
+
+_Jan 27, 2023_
+
+We'd like to offer a big thanks to the 13 contributors who made this release possible. Here are some highlights ✨:
+
+- 🌍 Add Belarusian (be-BY), Czech (cs-CZ), and Russian (ru-RU) locales
+- 🌍 Improve Slovak (sk-SK), Japanese (ja-JP), Vietnamese (vi-VN), and Spanish (es-ES) locales
+- 🐞 Bugfixes
+
+### `@mui/[email protected]` / `@mui/[email protected]` / `@mui/[email protected]`
+
+#### Changes
+
+- [DataGrid] Add `title` attribute to cells (#7695) @thupi
+- [DataGrid] Fix grid state not being updated after print preview is closed (#7680) @cherniavskii
+- [DataGrid] Fix non-hideable columns visibility toggling (#7716) @cherniavskii
+- [DataGrid] Fix scrolling on resize for data grids inside shadow root (#7722) @cherniavskii
+- [DataGridPremium] Create aggregation footer row with `isAutoGenerated: true` (#7681) @m4theushw
+- [l10n] Add Belarusian (be-BY) locale (#7718) @volhalink
+- [l10n] Add Slovak (sk-SK) translation for aggregation functions (#7690) @msidlo
+- [l10n] Add missing core locales for `MuiTablePagination` (#7719) @MBilalShafi
+- [l10n] Improve Japanese (ja-JP) locale (#7627) @makoto14
+- [l10n] Improve Vietnamese (vi-VN) locale (#7601) @SpacerZ
+
+### `@mui/[email protected]` / `@mui/[email protected]`
+
+#### Changes
+
+- [pickers] Add missing components to `themeAugmentation` (#7677) @LukasTy
+- [l10n] Add Czech (cs-CZ) locale (#7666) @OndrejHj04
+- [l10n] Add Russian (ru-RU) locale (#7708) @rstmzh
+- [l10n] Improve Spanish (es-ES) locale (#7614) @WiXSL
+
+### Docs
+
+- [docs] Add info callout about available component `slots` (#7723) @Vivek-Prajapatii
+
+## 5.17.20
+
+_Jan 19, 2023_
+
+We'd like to offer a big thanks to the 5 contributors who made this release possible. Here are some highlights ✨:
+
+- 🌍 Improve Italian (it-IT) and Swedish (sv-SE) locales
+- 🐞 Bugfixes
+
+### `@mui/[email protected]` / `@mui/[email protected]` / `@mui/[email protected]`
+
+#### Changes
+
+- [DataGrid] Fix flickering on grid scroll (#7609) @cherniavskii
+- [DataGrid] Remove tag limit from `isAnyOf` operator input (#7616) @m4theushw
+- [l10n] Improve Swedish (sv-SE) locale (#7463) @MaanTyringe
+
+### `@mui/[email protected]` / `@mui/[email protected]`
+
+#### Changes
+
+- [pickers] Ensure `key` is passed without object spreading (#7584) @alexfauquette
+- [l10n] Improve Italian (it-IT) locale (#7547) @marikadeveloper
+
+## 5.17.19
+
+_Jan 16, 2023_
+
+We'd like to offer a big thanks to the 4 contributors who made this release possible. Here are some highlights ✨:
+
+- 🌍 Improve Spanish (es-ES) and add Belarusian (be-BY) and Urdu (ur-PK) locales
+- 🐞 Bugfixes
+
+### `@mui/[email protected]` / `@mui/[email protected]` / `@mui/[email protected]`
+
+#### Changes
+
+- [DataGrid] Improve print support (#7407) @cherniavskii
+- [DataGrid] Improve Spanish (es-ES) locale (#7438) @Anderssxn
+- [DataGridPremium] Fix Excel export not working with date strings (#7478) @cherniavskii
+- [DataGridPro] Fix missing column headers border with top-pinned rows (#7399) @cherniavskii
+
+### `@mui/[email protected]` / `@mui/[email protected]`
+
+#### Changes
+
+- [pickers] Add Belarusian (be-BY) locale (#7450) @volhalink
+- [pickers] Add Urdu (ur-PK) locale (#7449) @MBilalShafi
+
 ## 5.17.18
 
 _Jan 5, 2023_

docs/data/data-grid/localization/data.json

@@ -7,6 +7,14 @@
     "totalKeysCount": 93,
     "githubLink": "https://github.com/mui/mui-x/blob/master/packages/grid/x-data-grid/src/locales/arSD.ts/"
   },
+  {
+    "languageTag": "be-BY",
+    "importName": "beBY",
+    "localeName": "Belarusian",
+    "missingKeysCount": 1,
+    "totalKeysCount": 93,
+    "githubLink": "https://github.com/mui/mui-x/blob/master/packages/grid/x-data-grid/src/locales/beBY.ts/"
+  },
   {
     "languageTag": "bg-BG",
     "importName": "bgBG",
@@ -115,7 +123,7 @@
     "languageTag": "ja-JP",
     "importName": "jaJP",
     "localeName": "Japanese",
-    "missingKeysCount": 12,
+    "missingKeysCount": 0,
     "totalKeysCount": 93,
     "githubLink": "https://github.com/mui/mui-x/blob/master/packages/grid/x-data-grid/src/locales/jaJP.ts/"
   },
@@ -179,23 +187,23 @@
     "languageTag": "sk-SK",
     "importName": "skSK",
     "localeName": "Slovak",
-    "missingKeysCount": 6,
+    "missingKeysCount": 0,
     "totalKeysCount": 93,
     "githubLink": "https://github.com/mui/mui-x/blob/master/packages/grid/x-data-grid/src/locales/skSK.ts/"
   },
   {
     "languageTag": "es-ES",
     "importName": "esES",
     "localeName": "Spanish",
-    "missingKeysCount": 37,
+    "missingKeysCount": 0,
     "totalKeysCount": 93,
     "githubLink": "https://github.com/mui/mui-x/blob/master/packages/grid/x-data-grid/src/locales/esES.ts/"
   },
   {
     "languageTag": "sv-SE",
     "importName": "svSE",
     "localeName": "Swedish",
-    "missingKeysCount": 7,
+    "missingKeysCount": 0,
     "totalKeysCount": 93,
     "githubLink": "https://github.com/mui/mui-x/blob/master/packages/grid/x-data-grid/src/locales/svSE.ts/"
   },
@@ -215,11 +223,19 @@
     "totalKeysCount": 93,
     "githubLink": "https://github.com/mui/mui-x/blob/master/packages/grid/x-data-grid/src/locales/ukUA.ts/"
   },
+  {
+    "languageTag": "ur-PK",
+    "importName": "urPK",
+    "localeName": "Urdu (Pakistan)",
+    "missingKeysCount": 0,
+    "totalKeysCount": 93,
+    "githubLink": "https://github.com/mui/mui-x/blob/master/packages/grid/x-data-grid/src/locales/urPK.ts/"
+  },
   {
     "languageTag": "vi-VN",
     "importName": "viVN",
     "localeName": "Vietnamese",
-    "missingKeysCount": 23,
+    "missingKeysCount": 7,
     "totalKeysCount": 93,
     "githubLink": "https://github.com/mui/mui-x/blob/master/packages/grid/x-data-grid/src/locales/viVN.ts/"
   }

docs/data/date-pickers/custom-components/custom-components.md

@@ -7,6 +7,11 @@ title: Date and Time pickers - Custom components
 
 <p class="description">The date picker lets users select a date from a menu.</p>
 
+:::info
+The components that can be customized are listed under `slots` section in Date and Time Pickers [API Reference](/x/api/date-pickers/).
+For example, available Date Picker slots can be found [here](/x/api/date-pickers/date-picker/#slots).
+:::
+
 ## Overriding components
 
 You can override the internal elements of the component (known as "slots") using the `components` prop.

docs/data/date-pickers/localization/data.json

@@ -1,4 +1,12 @@
 [
+  {
+    "languageTag": "be-BY",
+    "importName": "beBY",
+    "localeName": "Belarusian",
+    "missingKeysCount": 0,
+    "totalKeysCount": 24,
+    "githubLink": "https://github.com/mui/mui-x/blob/master/packages/x-date-pickers/src/locales/beBY.ts/"
+  },
   {
     "languageTag": "zh-CN",
     "importName": "zhCN",
@@ -7,6 +15,14 @@
     "totalKeysCount": 24,
     "githubLink": "https://github.com/mui/mui-x/blob/master/packages/x-date-pickers/src/locales/zhCN.ts/"
   },
+  {
+    "languageTag": "cs-CZ",
+    "importName": "csCZ",
+    "localeName": "Czech",
+    "missingKeysCount": 0,
+    "totalKeysCount": 24,
+    "githubLink": "https://github.com/mui/mui-x/blob/master/packages/x-date-pickers/src/locales/csCZ.ts/"
+  },
   {
     "languageTag": "nl-NL",
     "importName": "nlNL",
@@ -51,7 +67,7 @@
     "languageTag": "it-IT",
     "importName": "itIT",
     "localeName": "Italian",
-    "missingKeysCount": 5,
+    "missingKeysCount": 0,
     "totalKeysCount": 24,
     "githubLink": "https://github.com/mui/mui-x/blob/master/packages/x-date-pickers/src/locales/itIT.ts/"
   },
@@ -103,11 +119,19 @@
     "totalKeysCount": 24,
     "githubLink": "https://github.com/mui/mui-x/blob/master/packages/x-date-pickers/src/locales/ptBR.ts/"
   },
+  {
+    "languageTag": "ru-RU",
+    "importName": "ruRU",
+    "localeName": "Russian",
+    "missingKeysCount": 0,
+    "totalKeysCount": 24,
+    "githubLink": "https://github.com/mui/mui-x/blob/master/packages/x-date-pickers/src/locales/ruRU.ts/"
+  },
   {
     "languageTag": "es-ES",
     "importName": "esES",
     "localeName": "Spanish",
-    "missingKeysCount": 5,
+    "missingKeysCount": 0,
     "totalKeysCount": 24,
     "githubLink": "https://github.com/mui/mui-x/blob/master/packages/x-date-pickers/src/locales/esES.ts/"
   },
@@ -134,5 +158,13 @@
     "missingKeysCount": 0,
     "totalKeysCount": 24,
     "githubLink": "https://github.com/mui/mui-x/blob/master/packages/x-date-pickers/src/locales/ukUA.ts/"
+  },
+  {
+    "languageTag": "ur-PK",
+    "importName": "urPK",
+    "localeName": "Urdu (Pakistan)",
+    "missingKeysCount": 0,
+    "totalKeysCount": 24,
+    "githubLink": "https://github.com/mui/mui-x/blob/master/packages/x-date-pickers/src/locales/urPK.ts/"
   }
 ]

docs/package.json

@@ -1,6 +1,6 @@
 {
   "name": "docs",
-  "version": "5.17.18",
+  "version": "5.17.21",
   "private": true,
   "author": "MUI Team",
   "license": "MIT",

docs/pages/x/api/data-grid/grid-api.md

@@ -28,7 +28,7 @@ import { GridApi } from '@mui/x-data-grid-pro';
 | <span class="prop-name">getAllRowIds</span>                                                                                                                                  | <span class="prop-type">() =&gt; GridRowId[]</span>                                                                                                               | Gets the list of row ids.                                                                                                                                                                                                |
 | <span class="prop-name">getCellElement</span>                                                                                                                                | <span class="prop-type">(id: GridRowId, field: string) =&gt; HTMLDivElement \| null</span>                                                                        | Gets the underlying DOM element for a cell at the given `id` and `field`.                                                                                                                                                |
 | <span class="prop-name">getCellMode</span>                                                                                                                                   | <span class="prop-type">(id: GridRowId, field: string) =&gt; GridCellMode</span>                                                                                  | Gets the mode of a cell.                                                                                                                                                                                                 |
-| <span class="prop-name">getCellParams</span>                                                                                                                                 | <span class="prop-type">&lt;V = any, R extends GridValidRowModel = any, F = V&gt;(id: GridRowId, field: string) =&gt; GridCellParams&lt;V, R, F&gt;</span>        | Gets the [GridCellParams](/x/api/data-grid/grid-cell-params/) object that is passed as argument in events.                                                                                                               |
+| <span class="prop-name">getCellParams</span>                                                                                                                                 | <span class="prop-type">&lt;V = unknown, R extends GridValidRowModel = any, F = V&gt;(id: GridRowId, field: string) =&gt; GridCellParams&lt;V, R, F&gt;</span>    | Gets the [GridCellParams](/x/api/data-grid/grid-cell-params/) object that is passed as argument in events.                                                                                                               |
 | <span class="prop-name">getCellValue</span>                                                                                                                                  | <span class="prop-type">&lt;V extends any = any&gt;(id: GridRowId, field: string) =&gt; V</span>                                                                  | Gets the value of a cell at the given `id` and `field`.                                                                                                                                                                  |
 | <span class="prop-name">getColumn</span>                                                                                                                                     | <span class="prop-type">(field: string) =&gt; GridStateColDef</span>                                                                                              | Returns the [GridColDef](/x/api/data-grid/grid-col-def/) for the given `field`.                                                                                                                                          |
 | <span class="prop-name">getColumnHeaderElement</span>                                                                                                                        | <span class="prop-type">(field: string) =&gt; HTMLDivElement \| null</span>                                                                                       | Gets the underlying DOM element for the column header with the given `field`.                                                                                                                                            |

package.json

@@ -1,5 +1,5 @@
 {
-  "version": "5.17.18",
+  "version": "5.17.21",
   "private": true,
   "scripts": {
     "start": "yarn docs:dev",

packages/grid/x-data-grid-generator/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-data-grid-generator",
-  "version": "5.17.18",
+  "version": "5.17.20",
   "description": "Generate fake data for demo purposes only.",
   "author": "MUI Team",
   "main": "src/index.ts",
@@ -32,7 +32,7 @@
   "dependencies": {
     "@babel/runtime": "^7.18.9",
     "@mui/base": "^5.0.0-alpha.97",
-    "@mui/x-data-grid-premium": "5.17.18",
+    "@mui/x-data-grid-premium": "5.17.21",
     "chance": "^1.1.8",
     "clsx": "^1.2.1",
     "lru-cache": "^7.14.0"

packages/grid/x-data-grid-premium/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-data-grid-premium",
-  "version": "5.17.18",
+  "version": "5.17.21",
   "description": "The Premium plan edition of the data grid component (MUI X).",
   "author": "MUI Team",
   "main": "src/index.ts",
@@ -44,8 +44,8 @@
   "dependencies": {
     "@babel/runtime": "^7.18.9",
     "@mui/utils": "^5.10.3",
-    "@mui/x-data-grid": "5.17.18",
-    "@mui/x-data-grid-pro": "5.17.18",
+    "@mui/x-data-grid": "5.17.21",
+    "@mui/x-data-grid-pro": "5.17.21",
     "@mui/x-license-pro": "5.17.12",
     "@types/format-util": "^1.0.2",
     "clsx": "^1.2.1",

packages/grid/x-data-grid-premium/src/hooks/features/aggregation/gridAggregationUtils.ts

@@ -184,6 +184,7 @@ export const addFooterRows = ({
       rowId: getAggregationFooterRowIdFromGroupId(null),
       position: 'bottom',
       apiRef,
+      isAutoGenerated: true,
     });
   }
 

packages/grid/x-data-grid-premium/src/hooks/features/export/serializer/excelSerializer.ts

@@ -9,7 +9,7 @@ import {
   GRID_DATE_COL_DEF,
   GRID_DATETIME_COL_DEF,
 } from '@mui/x-data-grid-pro';
-import { buildWarning } from '@mui/x-data-grid/internals';
+import { buildWarning, isObject } from '@mui/x-data-grid/internals';
 import { GridExceljsProcessInput, ColumnsStylesInterface } from '../gridExcelExportInterface';
 
 const getExcelJs = async () => {
@@ -47,6 +47,8 @@ const getFormattedValueOptions = (
   );
 };
 
+let invalidDateValueWarnedOnce = false;
+
 const serializeRow = (
   id: GridRowId,
   columns: GridStateColDef[],
@@ -117,23 +119,50 @@ const serializeRow = (
             warnInvalidFormattedValue();
           }
         }
-        row[column.field] = formattedValue?.label ?? formattedValue;
+        if (isObject<{ label: any }>(formattedValue)) {
+          row[column.field] = formattedValue?.label;
+        } else {
+          row[column.field] = formattedValue as any;
+        }
         break;
       }
       case 'boolean':
       case 'number':
-        row[column.field] = api.getCellParams(id, column.field).value;
+        row[column.field] = api.getCellParams(id, column.field).value as any;
         break;
       case 'date':
       case 'dateTime': {
         // Excel does not do any timezone conversion, so we create a date using UTC instead of local timezone
         // Solution from: https://github.com/exceljs/exceljs/issues/486#issuecomment-432557582
         // About Date.UTC(): https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Global_Objects/Date/UTC#exemples
-        const date = api.getCellParams(id, column.field).value;
+        const value = api.getCellParams(id, column.field).value;
         // value may be `undefined` in auto-generated grouping rows
-        if (!date) {
+        if (!value) {
           break;
         }
+        let date: Date;
+        if (value instanceof Date) {
+          date = value;
+        } else {
+          const valueString = (value ?? '').toString();
+          date = new Date(valueString);
+
+          if (Number.isNaN(date.getTime())) {
+            // Invalid date
+            row[column.field] = valueString;
+            if (process.env.NODE_ENV !== 'production' && !invalidDateValueWarnedOnce) {
+              console.warn(
+                [
+                  `MUI: The cell value "${value}" not a valid value for the \`${column.type}\` column type.`,
+                  `Row id: ${id}, field: ${column.field}.`,
+                  `This value will be exported as is in the Excel file.`,
+                ].join('\n'),
+              );
+              invalidDateValueWarnedOnce = true;
+            }
+            break;
+          }
+        }
         const utcDate = new Date(
           Date.UTC(
             date.getFullYear(),
@@ -150,7 +179,7 @@ const serializeRow = (
       case 'actions':
         break;
       default:
-        row[column.field] = api.getCellParams(id, column.field).formattedValue;
+        row[column.field] = api.getCellParams(id, column.field).formattedValue as any;
         if (process.env.NODE_ENV !== 'production') {
           if (String(cellParams.formattedValue) === '[object Object]') {
             warnInvalidFormattedValue();