@mui/x-data-grid-premium 7.5.0 → 7.6.0

package/hooks/features/export/serializer/excelSerializer.js

@@ -8,7 +8,7 @@ exports.buildExcel = buildExcel;
 exports.getDataForValueOptionsSheet = getDataForValueOptionsSheet;
 exports.serializeColumn = void 0;
 exports.serializeColumns = serializeColumns;
-exports.serializeRow = void 0;
+exports.serializeRowUnsafe = void 0;
 exports.setupExcelExportWebWorker = setupExcelExportWebWorker;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _xDataGridPro = require("@mui/x-data-grid-pro");
@@ -37,22 +37,30 @@ const getFormattedValueOptions = (colDef, row, valueOptions, api) => {
   }
   return valueOptionsFormatted.map(option => typeof option === 'object' ? option.label : option);
 };
-const serializeRow = (id, columns, api, defaultValueOptionsFormulae) => {
+/**
+ * FIXME: This function mutates the colspan info, but colspan info assumes that the columns
+ * passed to it are always consistent. In this case, the exported columns may differ from the
+ * actual rendered columns.
+ * The caller of this function MUST call `resetColSpan()` before and after usage.
+ */
+const serializeRowUnsafe = (id, columns, apiRef, defaultValueOptionsFormulae, options) => {
   const row = {};
   const dataValidation = {};
   const mergedCells = [];
-  const firstCellParams = api.getCellParams(id, columns[0].field);
+  const firstCellParams = apiRef.current.getCellParams(id, columns[0].field);
   const outlineLevel = firstCellParams.rowNode.depth;
-
-  // `colSpan` is only calculated for rendered rows, so we need to calculate it during export for every row
-  api.calculateColSpan({
-    rowId: id,
-    minFirstColumn: 0,
-    maxLastColumn: columns.length,
-    columns
-  });
+  const hasColSpan = (0, _internals.gridHasColSpanSelector)(apiRef);
+  if (hasColSpan) {
+    // `colSpan` is only calculated for rendered rows, so we need to calculate it during export for every row
+    apiRef.current.calculateColSpan({
+      rowId: id,
+      minFirstColumn: 0,
+      maxLastColumn: columns.length,
+      columns
+    });
+  }
   columns.forEach((column, colIndex) => {
-    const colSpanInfo = api.unstable_getCellColSpanInfo(id, colIndex);
+    const colSpanInfo = hasColSpan ? apiRef.current.unstable_getCellColSpanInfo(id, colIndex) : undefined;
     if (colSpanInfo && colSpanInfo.spannedByColSpan) {
       return;
     }
@@ -62,7 +70,8 @@ const serializeRow = (id, columns, api, defaultValueOptionsFormulae) => {
         rightIndex: colIndex + colSpanInfo.cellProps.colSpan
       });
     }
-    const cellParams = api.getCellParams(id, column.field);
+    const cellParams = apiRef.current.getCellParams(id, column.field);
+    let cellValue;
     switch (cellParams.colDef.type) {
       case 'singleSelect':
         {
@@ -75,7 +84,7 @@ const serializeRow = (id, columns, api, defaultValueOptionsFormulae) => {
               row,
               field: cellParams.field
             });
-            const formattedValueOptions = getFormattedValueOptions(castColumn, row, valueOptions, api);
+            const formattedValueOptions = getFormattedValueOptions(castColumn, row, valueOptions, apiRef.current);
             dataValidation[castColumn.field] = {
               type: 'list',
               allowBlank: true,
@@ -91,7 +100,7 @@ const serializeRow = (id, columns, api, defaultValueOptionsFormulae) => {
               formulae: [address]
             };
           }
-          const formattedValue = api.getCellParams(id, castColumn.field).formattedValue;
+          const formattedValue = apiRef.current.getCellParams(id, castColumn.field).formattedValue;
           if (process.env.NODE_ENV !== 'production') {
             if (String(cellParams.formattedValue) === '[object Object]') {
               warnInvalidFormattedValue();
@@ -106,7 +115,7 @@ const serializeRow = (id, columns, api, defaultValueOptionsFormulae) => {
         }
       case 'boolean':
       case 'number':
-        row[column.field] = api.getCellParams(id, column.field).value;
+        cellValue = apiRef.current.getCellParams(id, column.field).value;
         break;
       case 'date':
       case 'dateTime':
@@ -114,7 +123,7 @@ const serializeRow = (id, columns, api, defaultValueOptionsFormulae) => {
           // 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/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/UTC#exemples
-          const value = api.getCellParams(id, column.field).value;
+          const value = apiRef.current.getCellParams(id, column.field).value;
           // value may be `undefined` in auto-generated grouping rows
           if (!value) {
             break;
@@ -126,7 +135,7 @@ const serializeRow = (id, columns, api, defaultValueOptionsFormulae) => {
       case 'actions':
         break;
       default:
-        row[column.field] = api.getCellParams(id, column.field).formattedValue;
+        cellValue = apiRef.current.getCellParams(id, column.field).formattedValue;
         if (process.env.NODE_ENV !== 'production') {
           if (String(cellParams.formattedValue) === '[object Object]') {
             warnInvalidFormattedValue();
@@ -134,6 +143,15 @@ const serializeRow = (id, columns, api, defaultValueOptionsFormulae) => {
         }
         break;
     }
+    if (typeof cellValue === 'string' && options.escapeFormulas) {
+      // See https://owasp.org/www-community/attacks/CSV_Injection
+      if (['=', '+', '-', '@', '\t', '\r'].includes(cellValue[0])) {
+        cellValue = `'${cellValue}`;
+      }
+    }
+    if (typeof cellValue !== 'undefined') {
+      row[column.field] = cellValue;
+    }
   });
   return {
     row,
@@ -142,7 +160,7 @@ const serializeRow = (id, columns, api, defaultValueOptionsFormulae) => {
     mergedCells
   };
 };
-exports.serializeRow = serializeRow;
+exports.serializeRowUnsafe = serializeRowUnsafe;
 const defaultColumnsStyles = {
   [_xDataGridPro.GRID_DATE_COL_DEF.type]: {
     numFmt: 'dd.mm.yyyy'
@@ -282,7 +300,7 @@ async function createValueOptionsSheetIfNeeded(valueOptionsData, sheetName, work
     valueOptionsWorksheet.getColumn(field).values = values;
   });
 }
-async function buildExcel(options, api) {
+async function buildExcel(options, apiRef) {
   const {
     columns,
     rowIds,
@@ -306,20 +324,22 @@ async function buildExcel(options, api) {
   }
   if (includeColumnGroupsHeaders) {
     const columnGroupPaths = columns.reduce((acc, column) => {
-      acc[column.field] = api.getColumnGroupPath(column.field);
+      acc[column.field] = apiRef.current.getColumnGroupPath(column.field);
       return acc;
     }, {});
-    addColumnGroupingHeaders(worksheet, serializedColumns, columnGroupPaths, api.getAllGroupDetails());
+    addColumnGroupingHeaders(worksheet, serializedColumns, columnGroupPaths, apiRef.current.getAllGroupDetails());
   }
   if (includeHeaders) {
     worksheet.addRow(columns.map(column => column.headerName ?? column.field));
   }
-  const valueOptionsData = await getDataForValueOptionsSheet(columns, valueOptionsSheetName, api);
+  const valueOptionsData = await getDataForValueOptionsSheet(columns, valueOptionsSheetName, apiRef.current);
   createValueOptionsSheetIfNeeded(valueOptionsData, valueOptionsSheetName, workbook);
+  apiRef.current.resetColSpan();
   rowIds.forEach(id => {
-    const serializedRow = serializeRow(id, columns, api, valueOptionsData);
+    const serializedRow = serializeRowUnsafe(id, columns, apiRef, valueOptionsData, options);
     addSerializedRowToWorksheet(serializedRow, worksheet);
   });
+  apiRef.current.resetColSpan();
   if (exceljsPostProcess) {
     await exceljsPostProcess({
       workbook,

package/hooks/features/export/useGridExcelExport.js

@@ -42,8 +42,9 @@ const useGridExcelExport = (apiRef, props) => {
       valueOptionsSheetName: options?.valueOptionsSheetName || 'Options',
       columnsStyles: options?.columnsStyles,
       exceljsPreProcess: options?.exceljsPreProcess,
-      exceljsPostProcess: options?.exceljsPostProcess
-    }, apiRef.current);
+      exceljsPostProcess: options?.exceljsPostProcess,
+      escapeFormulas: options.escapeFormulas ?? true
+    }, apiRef);
   }, [logger, apiRef]);
   const exportDataAsExcel = React.useCallback(async (options = {}) => {
     const {
@@ -95,7 +96,11 @@ const useGridExcelExport = (apiRef, props) => {
     });
     const valueOptionsData = await (0, _excelSerializer.getDataForValueOptionsSheet)(exportedColumns, valueOptionsSheetName, apiRef.current);
     const serializedColumns = (0, _excelSerializer.serializeColumns)(exportedColumns, options.columnsStyles || {});
-    const serializedRows = exportedRowIds.map(id => (0, _excelSerializer.serializeRow)(id, exportedColumns, apiRef.current, valueOptionsData));
+    apiRef.current.resetColSpan();
+    const serializedRows = exportedRowIds.map(id => (0, _excelSerializer.serializeRowUnsafe)(id, exportedColumns, apiRef, valueOptionsData, {
+      escapeFormulas: options.escapeFormulas ?? true
+    }));
+    apiRef.current.resetColSpan();
     const columnGroupPaths = exportedColumns.reduce((acc, column) => {
       acc[column.field] = apiRef.current.getColumnGroupPath(column.field);
       return acc;

package/index.d.ts

@@ -22,6 +22,7 @@ export * from './hooks';
 export * from './models';
 export * from './components';
 export { GridColumnHeaders } from '@mui/x-data-grid-pro';
+export type { GridColumnHeadersProps } from '@mui/x-data-grid-pro';
 export type { DataGridPremiumProps, GridExperimentalPremiumFeatures, } from './models/dataGridPremiumProps';
 export { useGridApiContext, useGridApiRef, useGridRootProps } from './typeOverloads/reexports';
 export type { GridApi, GridInitialState, GridState } from './typeOverloads/reexports';

package/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-data-grid-premium v7.5.0
+ * @mui/x-data-grid-premium v7.6.0
  *
  * @license MUI X Commercial
  * This source code is licensed under the commercial license found in the

package/modern/DataGridPremium/DataGridPremium.js

@@ -51,7 +51,7 @@ export const DataGridPremium = /*#__PURE__*/React.memo(DataGridPremiumRaw);
 process.env.NODE_ENV !== "production" ? DataGridPremiumRaw.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
-  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // | To update them edit the TypeScript types and run "pnpm proptypes"  |
   // ----------------------------------------------------------------------
   /**
    * Aggregation functions available on the grid.
@@ -84,7 +84,7 @@ process.env.NODE_ENV !== "production" ? DataGridPremiumRaw.propTypes = {
    */
   'aria-labelledby': PropTypes.string,
   /**
-   * If `true`, the Data Grid height is dynamic and follow the number of rows in the Data Grid.
+   * If `true`, the Data Grid height is dynamic and follows the number of rows in the Data Grid.
    * @default false
    */
   autoHeight: PropTypes.bool,

package/modern/components/GridColumnMenuAggregationItem.js

@@ -100,7 +100,7 @@ function GridColumnMenuAggregationItem(props) {
 process.env.NODE_ENV !== "production" ? GridColumnMenuAggregationItem.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
-  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // | To update them edit the TypeScript types and run "pnpm proptypes"  |
   // ----------------------------------------------------------------------
   colDef: PropTypes.object.isRequired,
   onClick: PropTypes.func.isRequired

package/modern/components/GridColumnMenuRowGroupItem.js

@@ -1,5 +1,4 @@
 import * as React from 'react';
-import PropTypes from 'prop-types';
 import MenuItem from '@mui/material/MenuItem';
 import ListItemIcon from '@mui/material/ListItemIcon';
 import ListItemText from '@mui/material/ListItemText';
@@ -9,7 +8,7 @@ import { gridRowGroupingSanitizedModelSelector } from '../hooks/features/rowGrou
 import { getRowGroupingCriteriaFromGroupingField, GRID_ROW_GROUPING_SINGLE_GROUPING_FIELD, isGroupingColumn } from '../hooks/features/rowGrouping/gridRowGroupingUtils';
 import { useGridRootProps } from '../hooks/utils/useGridRootProps';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-function GridColumnMenuRowGroupItem(props) {
+export function GridColumnMenuRowGroupItem(props) {
   const {
     colDef,
     onClick
@@ -46,13 +45,4 @@ function GridColumnMenuRowGroupItem(props) {
     });
   }
   return renderUnGroupingMenuItem(getRowGroupingCriteriaFromGroupingField(colDef.field));
-}
-process.env.NODE_ENV !== "production" ? GridColumnMenuRowGroupItem.propTypes = {
-  // ----------------------------- Warning --------------------------------
-  // | These PropTypes are generated from the TypeScript type definitions |
-  // | To update them edit the TypeScript types and run "yarn proptypes"  |
-  // ----------------------------------------------------------------------
-  colDef: PropTypes.object.isRequired,
-  onClick: PropTypes.func.isRequired
-} : void 0;
-export { GridColumnMenuRowGroupItem };
+}

package/modern/components/GridColumnMenuRowUngroupItem.js

@@ -1,5 +1,4 @@
 import * as React from 'react';
-import PropTypes from 'prop-types';
 import MenuItem from '@mui/material/MenuItem';
 import ListItemIcon from '@mui/material/ListItemIcon';
 import ListItemText from '@mui/material/ListItemText';
@@ -8,7 +7,7 @@ import { useGridApiContext } from '../hooks/utils/useGridApiContext';
 import { gridRowGroupingSanitizedModelSelector } from '../hooks/features/rowGrouping/gridRowGroupingSelector';
 import { useGridRootProps } from '../hooks/utils/useGridRootProps';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-function GridColumnMenuRowUngroupItem(props) {
+export function GridColumnMenuRowUngroupItem(props) {
   const {
     colDef,
     onClick
@@ -51,13 +50,4 @@ function GridColumnMenuRowUngroupItem(props) {
       children: apiRef.current.getLocaleText('groupColumn')(name)
     })]
   });
-}
-process.env.NODE_ENV !== "production" ? GridColumnMenuRowUngroupItem.propTypes = {
-  // ----------------------------- Warning --------------------------------
-  // | These PropTypes are generated from the TypeScript type definitions |
-  // | To update them edit the TypeScript types and run "yarn proptypes"  |
-  // ----------------------------------------------------------------------
-  colDef: PropTypes.object.isRequired,
-  onClick: PropTypes.func.isRequired
-} : void 0;
-export { GridColumnMenuRowUngroupItem };
+}

package/modern/components/GridExcelExportMenuItem.js

@@ -25,13 +25,14 @@ function GridExcelExportMenuItem(props) {
 process.env.NODE_ENV !== "production" ? GridExcelExportMenuItem.propTypes = {
   // ----------------------------- Warning --------------------------------
   // | These PropTypes are generated from the TypeScript type definitions |
-  // | To update them edit the TypeScript types and run "yarn proptypes"  |
+  // | To update them edit the TypeScript types and run "pnpm proptypes"  |
   // ----------------------------------------------------------------------
   hideMenu: PropTypes.func,
   options: PropTypes.shape({
     allColumns: PropTypes.bool,
     columnsStyles: PropTypes.object,
     disableToolbarButton: PropTypes.bool,
+    escapeFormulas: PropTypes.bool,
     exceljsPostProcess: PropTypes.func,
     exceljsPreProcess: PropTypes.func,
     fields: PropTypes.arrayOf(PropTypes.string),

package/modern/components/GridPremiumColumnMenu.js

@@ -1,6 +1,5 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
-import PropTypes from 'prop-types';
 import { GridGenericColumnMenu, GRID_COLUMN_MENU_SLOTS, GRID_COLUMN_MENU_SLOT_PROPS } from '@mui/x-data-grid-pro';
 import { GridColumnMenuAggregationItem } from './GridColumnMenuAggregationItem';
 import { isGroupingColumn } from '../hooks/features/rowGrouping';
@@ -28,21 +27,11 @@ export const GRID_COLUMN_MENU_SLOT_PROPS_PREMIUM = _extends({}, GRID_COLUMN_MENU
     displayOrder: 27
   }
 });
-const GridPremiumColumnMenu = /*#__PURE__*/React.forwardRef(function GridPremiumColumnMenuSimple(props, ref) {
+export const GridPremiumColumnMenu = /*#__PURE__*/React.forwardRef(function GridPremiumColumnMenuSimple(props, ref) {
   return /*#__PURE__*/_jsx(GridGenericColumnMenu, _extends({
     ref: ref
   }, props, {
     defaultSlots: GRID_COLUMN_MENU_SLOTS_PREMIUM,
     defaultSlotProps: GRID_COLUMN_MENU_SLOT_PROPS_PREMIUM
   }));
-});
-process.env.NODE_ENV !== "production" ? GridPremiumColumnMenu.propTypes = {
-  // ----------------------------- Warning --------------------------------
-  // | These PropTypes are generated from the TypeScript type definitions |
-  // | To update them edit the TypeScript types and run "yarn proptypes"  |
-  // ----------------------------------------------------------------------
-  colDef: PropTypes.object.isRequired,
-  hideMenu: PropTypes.func.isRequired,
-  open: PropTypes.bool.isRequired
-} : void 0;
-export { GridPremiumColumnMenu };
+});

package/modern/hooks/features/cellSelection/useGridCellSelection.js

@@ -445,9 +445,12 @@ export const useGridCellSelection = (apiRef, props) => {
         if (fieldsMap[field]) {
           const cellParams = apiRef.current.getCellParams(rowId, field);
           cellData = serializeCellValue(cellParams, {
-            delimiterCharacter: clipboardCopyCellDelimiter,
-            ignoreValueFormatter,
-            shouldAppendQuotes: false
+            csvOptions: {
+              delimiter: clipboardCopyCellDelimiter,
+              shouldAppendQuotes: false,
+              escapeFormulas: false
+            },
+            ignoreValueFormatter
           });
         } else {
           cellData = '';

package/modern/hooks/features/export/serializer/excelSerializer.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import { GRID_DATE_COL_DEF, GRID_DATETIME_COL_DEF } from '@mui/x-data-grid-pro';
-import { buildWarning, isObject, isSingleSelectColDef } from '@mui/x-data-grid/internals';
+import { buildWarning, isObject, isSingleSelectColDef, gridHasColSpanSelector } from '@mui/x-data-grid/internals';
 const getExcelJs = async () => {
   const excelJsModule = await import('exceljs');
   return excelJsModule.default ?? excelJsModule;
@@ -23,22 +23,30 @@ const getFormattedValueOptions = (colDef, row, valueOptions, api) => {
   }
   return valueOptionsFormatted.map(option => typeof option === 'object' ? option.label : option);
 };
-export const serializeRow = (id, columns, api, defaultValueOptionsFormulae) => {
+/**
+ * FIXME: This function mutates the colspan info, but colspan info assumes that the columns
+ * passed to it are always consistent. In this case, the exported columns may differ from the
+ * actual rendered columns.
+ * The caller of this function MUST call `resetColSpan()` before and after usage.
+ */
+export const serializeRowUnsafe = (id, columns, apiRef, defaultValueOptionsFormulae, options) => {
   const row = {};
   const dataValidation = {};
   const mergedCells = [];
-  const firstCellParams = api.getCellParams(id, columns[0].field);
+  const firstCellParams = apiRef.current.getCellParams(id, columns[0].field);
   const outlineLevel = firstCellParams.rowNode.depth;
-
-  // `colSpan` is only calculated for rendered rows, so we need to calculate it during export for every row
-  api.calculateColSpan({
-    rowId: id,
-    minFirstColumn: 0,
-    maxLastColumn: columns.length,
-    columns
-  });
+  const hasColSpan = gridHasColSpanSelector(apiRef);
+  if (hasColSpan) {
+    // `colSpan` is only calculated for rendered rows, so we need to calculate it during export for every row
+    apiRef.current.calculateColSpan({
+      rowId: id,
+      minFirstColumn: 0,
+      maxLastColumn: columns.length,
+      columns
+    });
+  }
   columns.forEach((column, colIndex) => {
-    const colSpanInfo = api.unstable_getCellColSpanInfo(id, colIndex);
+    const colSpanInfo = hasColSpan ? apiRef.current.unstable_getCellColSpanInfo(id, colIndex) : undefined;
     if (colSpanInfo && colSpanInfo.spannedByColSpan) {
       return;
     }
@@ -48,7 +56,8 @@ export const serializeRow = (id, columns, api, defaultValueOptionsFormulae) => {
         rightIndex: colIndex + colSpanInfo.cellProps.colSpan
       });
     }
-    const cellParams = api.getCellParams(id, column.field);
+    const cellParams = apiRef.current.getCellParams(id, column.field);
+    let cellValue;
     switch (cellParams.colDef.type) {
       case 'singleSelect':
         {
@@ -61,7 +70,7 @@ export const serializeRow = (id, columns, api, defaultValueOptionsFormulae) => {
               row,
               field: cellParams.field
             });
-            const formattedValueOptions = getFormattedValueOptions(castColumn, row, valueOptions, api);
+            const formattedValueOptions = getFormattedValueOptions(castColumn, row, valueOptions, apiRef.current);
             dataValidation[castColumn.field] = {
               type: 'list',
               allowBlank: true,
@@ -77,7 +86,7 @@ export const serializeRow = (id, columns, api, defaultValueOptionsFormulae) => {
               formulae: [address]
             };
           }
-          const formattedValue = api.getCellParams(id, castColumn.field).formattedValue;
+          const formattedValue = apiRef.current.getCellParams(id, castColumn.field).formattedValue;
           if (process.env.NODE_ENV !== 'production') {
             if (String(cellParams.formattedValue) === '[object Object]') {
               warnInvalidFormattedValue();
@@ -92,7 +101,7 @@ export const serializeRow = (id, columns, api, defaultValueOptionsFormulae) => {
         }
       case 'boolean':
       case 'number':
-        row[column.field] = api.getCellParams(id, column.field).value;
+        cellValue = apiRef.current.getCellParams(id, column.field).value;
         break;
       case 'date':
       case 'dateTime':
@@ -100,7 +109,7 @@ export const serializeRow = (id, columns, api, defaultValueOptionsFormulae) => {
           // 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/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/UTC#exemples
-          const value = api.getCellParams(id, column.field).value;
+          const value = apiRef.current.getCellParams(id, column.field).value;
           // value may be `undefined` in auto-generated grouping rows
           if (!value) {
             break;
@@ -112,7 +121,7 @@ export const serializeRow = (id, columns, api, defaultValueOptionsFormulae) => {
       case 'actions':
         break;
       default:
-        row[column.field] = api.getCellParams(id, column.field).formattedValue;
+        cellValue = apiRef.current.getCellParams(id, column.field).formattedValue;
         if (process.env.NODE_ENV !== 'production') {
           if (String(cellParams.formattedValue) === '[object Object]') {
             warnInvalidFormattedValue();
@@ -120,6 +129,15 @@ export const serializeRow = (id, columns, api, defaultValueOptionsFormulae) => {
         }
         break;
     }
+    if (typeof cellValue === 'string' && options.escapeFormulas) {
+      // See https://owasp.org/www-community/attacks/CSV_Injection
+      if (['=', '+', '-', '@', '\t', '\r'].includes(cellValue[0])) {
+        cellValue = `'${cellValue}`;
+      }
+    }
+    if (typeof cellValue !== 'undefined') {
+      row[column.field] = cellValue;
+    }
   });
   return {
     row,
@@ -266,7 +284,7 @@ async function createValueOptionsSheetIfNeeded(valueOptionsData, sheetName, work
     valueOptionsWorksheet.getColumn(field).values = values;
   });
 }
-export async function buildExcel(options, api) {
+export async function buildExcel(options, apiRef) {
   const {
     columns,
     rowIds,
@@ -290,20 +308,22 @@ export async function buildExcel(options, api) {
   }
   if (includeColumnGroupsHeaders) {
     const columnGroupPaths = columns.reduce((acc, column) => {
-      acc[column.field] = api.getColumnGroupPath(column.field);
+      acc[column.field] = apiRef.current.getColumnGroupPath(column.field);
       return acc;
     }, {});
-    addColumnGroupingHeaders(worksheet, serializedColumns, columnGroupPaths, api.getAllGroupDetails());
+    addColumnGroupingHeaders(worksheet, serializedColumns, columnGroupPaths, apiRef.current.getAllGroupDetails());
   }
   if (includeHeaders) {
     worksheet.addRow(columns.map(column => column.headerName ?? column.field));
   }
-  const valueOptionsData = await getDataForValueOptionsSheet(columns, valueOptionsSheetName, api);
+  const valueOptionsData = await getDataForValueOptionsSheet(columns, valueOptionsSheetName, apiRef.current);
   createValueOptionsSheetIfNeeded(valueOptionsData, valueOptionsSheetName, workbook);
+  apiRef.current.resetColSpan();
   rowIds.forEach(id => {
-    const serializedRow = serializeRow(id, columns, api, valueOptionsData);
+    const serializedRow = serializeRowUnsafe(id, columns, apiRef, valueOptionsData, options);
     addSerializedRowToWorksheet(serializedRow, worksheet);
   });
+  apiRef.current.resetColSpan();
   if (exceljsPostProcess) {
     await exceljsPostProcess({
       workbook,

package/modern/hooks/features/export/useGridExcelExport.js

@@ -3,7 +3,7 @@ const _excluded = ["worker", "exceljsPostProcess", "exceljsPreProcess", "columns
 import * as React from 'react';
 import { useGridApiMethod, useGridLogger, useGridApiOptionHandler } from '@mui/x-data-grid';
 import { useGridRegisterPipeProcessor, exportAs, getColumnsToExport, defaultGetRowsToExport } from '@mui/x-data-grid/internals';
-import { buildExcel, getDataForValueOptionsSheet, serializeColumns, serializeRow } from './serializer/excelSerializer';
+import { buildExcel, getDataForValueOptionsSheet, serializeColumns, serializeRowUnsafe } from './serializer/excelSerializer';
 import { GridExcelExportMenuItem } from '../../../components';
 
 /**
@@ -34,8 +34,9 @@ export const useGridExcelExport = (apiRef, props) => {
       valueOptionsSheetName: options?.valueOptionsSheetName || 'Options',
       columnsStyles: options?.columnsStyles,
       exceljsPreProcess: options?.exceljsPreProcess,
-      exceljsPostProcess: options?.exceljsPostProcess
-    }, apiRef.current);
+      exceljsPostProcess: options?.exceljsPostProcess,
+      escapeFormulas: options.escapeFormulas ?? true
+    }, apiRef);
   }, [logger, apiRef]);
   const exportDataAsExcel = React.useCallback(async (options = {}) => {
     const {
@@ -87,7 +88,11 @@ export const useGridExcelExport = (apiRef, props) => {
     });
     const valueOptionsData = await getDataForValueOptionsSheet(exportedColumns, valueOptionsSheetName, apiRef.current);
     const serializedColumns = serializeColumns(exportedColumns, options.columnsStyles || {});
-    const serializedRows = exportedRowIds.map(id => serializeRow(id, exportedColumns, apiRef.current, valueOptionsData));
+    apiRef.current.resetColSpan();
+    const serializedRows = exportedRowIds.map(id => serializeRowUnsafe(id, exportedColumns, apiRef, valueOptionsData, {
+      escapeFormulas: options.escapeFormulas ?? true
+    }));
+    apiRef.current.resetColSpan();
     const columnGroupPaths = exportedColumns.reduce((acc, column) => {
       acc[column.field] = apiRef.current.getColumnGroupPath(column.field);
       return acc;

package/modern/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-data-grid-premium v7.5.0
+ * @mui/x-data-grid-premium v7.6.0
  *
  * @license MUI X Commercial
  * This source code is licensed under the commercial license found in the

package/modern/utils/releaseInfo.js

@@ -1,6 +1,6 @@
 import { ponyfillGlobal } from '@mui/utils';
 export const getReleaseInfo = () => {
-  const releaseInfo = "MTcxNTg5NjgwMDAwMA==";
+  const releaseInfo = "MTcxNzAxNjQwMDAwMA==";
   if (process.env.NODE_ENV !== 'production') {
     // A simple hack to set the value in the test environment (has no build step).
     // eslint-disable-next-line no-useless-concat

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-data-grid-premium",
-  "version": "7.5.0",
+  "version": "7.6.0",
   "description": "The Premium plan edition of the Data Grid Components (MUI X).",
   "author": "MUI Team",
   "main": "./index.js",
@@ -33,17 +33,17 @@
     "directory": "packages/x-data-grid-premium"
   },
   "dependencies": {
-    "@babel/runtime": "^7.24.5",
-    "@mui/system": "^5.15.14",
+    "@babel/runtime": "^7.24.6",
+    "@mui/system": "^5.15.15",
     "@mui/utils": "^5.15.14",
     "@types/format-util": "^1.0.4",
     "clsx": "^2.1.1",
     "exceljs": "^4.4.0",
     "prop-types": "^15.8.1",
     "reselect": "^4.1.8",
-    "@mui/x-data-grid": "7.5.0",
-    "@mui/x-data-grid-pro": "7.5.0",
-    "@mui/x-license": "7.2.0"
+    "@mui/x-data-grid-pro": "7.6.0",
+    "@mui/x-data-grid": "7.6.0",
+    "@mui/x-license": "7.6.0"
   },
   "peerDependencies": {
     "@mui/material": "^5.15.14",

package/utils/releaseInfo.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.getReleaseInfo = void 0;
 var _utils = require("@mui/utils");
 const getReleaseInfo = () => {
-  const releaseInfo = "MTcxNTg5NjgwMDAwMA==";
+  const releaseInfo = "MTcxNzAxNjQwMDAwMA==";
   if (process.env.NODE_ENV !== 'production') {
     // A simple hack to set the value in the test environment (has no build step).
     // eslint-disable-next-line no-useless-concat