@mui/x-data-grid-premium 8.0.0-alpha.8 → 8.0.0-beta.0

package/esm/hooks/features/dataSource/useGridDataSourcePremium.js

@@ -1,8 +1,10 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import { useGridApiEventHandler as addEventHandler, useGridApiMethod, GRID_ROOT_GROUP_ID } from '@mui/x-data-grid-pro';
-import { useGridDataSourceBase, useGridRegisterStrategyProcessor, useGridRegisterPipeProcessor } from '@mui/x-data-grid-pro/internals';
-import { getKeyPremium } from "./cache.js";
+import { useGridDataSourceBasePro, useGridRegisterStrategyProcessor, useGridRegisterPipeProcessor } from '@mui/x-data-grid-pro/internals';
+function getKeyPremium(params) {
+  return JSON.stringify([params.filterModel, params.sortModel, params.groupKeys, params.groupFields, params.start, params.end, params.aggregationModel]);
+}
 const options = {
   cacheOptions: {
     getKey: getKeyPremium
@@ -12,8 +14,9 @@ export const useGridDataSourcePremium = (apiRef, props) => {
   const {
     api,
     strategyProcessor,
-    events
-  } = useGridDataSourceBase(apiRef, props, options);
+    events,
+    setStrategyAvailability
+  } = useGridDataSourceBasePro(apiRef, props, options);
   const aggregateRowRef = React.useRef({});
   const processDataSourceRows = React.useCallback(({
     params,
@@ -35,11 +38,11 @@ export const useGridDataSourcePremium = (apiRef, props) => {
   }, [apiRef]);
   const resolveGroupAggregation = React.useCallback((groupId, field) => {
     if (groupId === GRID_ROOT_GROUP_ID) {
-      return props.unstable_dataSource?.getAggregatedValue?.(aggregateRowRef.current, field);
+      return props.dataSource?.getAggregatedValue?.(aggregateRowRef.current, field);
     }
     const row = apiRef.current.getRow(groupId);
-    return props.unstable_dataSource?.getAggregatedValue?.(row, field);
-  }, [apiRef, props.unstable_dataSource]);
+    return props.dataSource?.getAggregatedValue?.(row, field);
+  }, [apiRef, props.dataSource]);
   const privateApi = _extends({}, api.private, {
     resolveGroupAggregation
   });
@@ -50,4 +53,7 @@ export const useGridDataSourcePremium = (apiRef, props) => {
   Object.entries(events).forEach(([event, handler]) => {
     addEventHandler(apiRef, event, handler);
   });
+  React.useEffect(() => {
+    setStrategyAvailability();
+  }, [setStrategyAvailability]);
 };

package/esm/hooks/features/export/gridExcelExportInterface.d.ts

@@ -0,0 +1,71 @@
+import type * as Excel from 'exceljs';
+import { GridFileExportOptions, GridExportFormat as GridExportFormatCommunity, GridExportExtension as GridExportExtensionCommunity } from '@mui/x-data-grid-pro';
+export type GridExportFormat = GridExportFormatCommunity | 'excel';
+export type GridExportExtension = GridExportExtensionCommunity | 'xlsx';
+export interface GridExceljsProcessInput {
+  workbook: Excel.Workbook;
+  worksheet: Excel.Worksheet;
+}
+export interface ColumnsStylesInterface {
+  [field: string]: Partial<Excel.Style>;
+}
+/**
+ * The options to apply on the Excel export.
+ * @demos
+ *   - [Excel export](/x/react-data-grid/export/#excel-export)
+ */
+export interface GridExcelExportOptions extends GridFileExportOptions {
+  /**
+   * Function to return the Worker instance to be called.
+   * @returns {() => Worker} A Worker instance.
+   */
+  worker?: () => Worker;
+  /**
+   * Name given to the worksheet containing the columns valueOptions.
+   * valueOptions are added to this worksheet if they are provided as an array.
+   */
+  valueOptionsSheetName?: string;
+  /**
+   * Method called before adding the rows to the workbook.
+   * Not supported when `worker` is set.
+   * To use with web workers, use the option in `setupExcelExportWebWorker`.
+   * @param {GridExceljsProcessInput} processInput object containing the workbook and the worksheet.
+   * @returns {Promise<void>} A promise which resolves after processing the input.
+   * */
+  exceljsPreProcess?: (processInput: GridExceljsProcessInput) => Promise<void>;
+  /**
+   * Method called after adding the rows to the workbook.
+   * Not supported when `worker` is set.
+   * To use with web workers, use the option in `setupExcelExportWebWorker`.
+   * @param {GridExceljsProcessInput} processInput object containing the workbook and the worksheet.
+   * @returns {Promise<void>} A promise which resolves after processing the input.
+   * */
+  exceljsPostProcess?: (processInput: GridExceljsProcessInput) => Promise<void>;
+  /**
+   * Object mapping column field to Exceljs style
+   * */
+  columnsStyles?: ColumnsStylesInterface;
+  /**
+   * If `true`, the headers of the column groups will be added into the file.
+   * @default true
+   */
+  includeColumnGroupsHeaders?: boolean;
+}
+/**
+ * The excel export API interface that is available in the grid [[apiRef]].
+ */
+export interface GridExcelExportApi {
+  /**
+   * Returns the grid data as an exceljs workbook.
+   * This method is used internally by `exportDataAsExcel`.
+   * @param {GridExcelExportOptions} options The options to apply on the export.
+   * @returns {Promise<Excel.Workbook>} The data in a exceljs workbook object.
+   */
+  getDataAsExcel: (options?: GridExcelExportOptions) => Promise<Excel.Workbook> | null;
+  /**
+   * Downloads and exports an Excel file of the grid's data.
+   * @param {GridExcelExportOptions} options The options to apply on the export.
+   * @returns {Promise<void>} A promise which resolves after exporting to Excel.
+   */
+  exportDataAsExcel: (options?: GridExcelExportOptions) => Promise<void>;
+}

package/esm/hooks/features/export/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./gridExcelExportInterface.js";
+export { setupExcelExportWebWorker } from "./serializer/setupExcelExportWebWorker.js";

package/esm/hooks/features/export/index.js

@@ -1,2 +1,2 @@
 export * from "./gridExcelExportInterface.js";
-export { setupExcelExportWebWorker } from "./serializer/excelSerializer.js";
+export { setupExcelExportWebWorker } from "./serializer/setupExcelExportWebWorker.js";

package/esm/hooks/features/export/serializer/excelSerializer.d.ts

@@ -0,0 +1,40 @@
+import type * as Excel from 'exceljs';
+import { RefObject } from '@mui/x-internals/types';
+import { GridRowId, GridColDef } from '@mui/x-data-grid-pro';
+import { GridStateColDef } from '@mui/x-data-grid/internals';
+import { ColumnsStylesInterface, GridExcelExportOptions } from "../gridExcelExportInterface.js";
+import { GridPrivateApiPremium } from "../../../../models/gridApiPremium.js";
+import { SerializedColumns, SerializedRow, ValueOptionsData } from "./utils.js";
+export type { ExcelExportInitEvent } from './utils';
+/**
+ * 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 declare const serializeRowUnsafe: (id: GridRowId, columns: GridStateColDef[], apiRef: RefObject<GridPrivateApiPremium>, defaultValueOptionsFormulae: {
+  [field: string]: {
+    address: string;
+  };
+}, options: Pick<BuildExcelOptions, "escapeFormulas">) => SerializedRow;
+export declare const serializeColumn: (column: GridColDef, columnsStyles: ColumnsStylesInterface) => {
+  key: string;
+  headerText: string;
+  width: number;
+  style: {
+    numFmt?: string | undefined;
+    font?: Partial<Excel.Font> | undefined;
+    alignment?: Partial<Excel.Alignment> | undefined;
+    protection?: Partial<Excel.Protection> | undefined;
+    border?: Partial<Excel.Borders> | undefined;
+    fill?: Excel.Fill | undefined;
+  };
+};
+export declare function serializeColumns(columns: GridStateColDef[], styles: ColumnsStylesInterface): SerializedColumns;
+export declare function getDataForValueOptionsSheet(columns: GridStateColDef[], valueOptionsSheetName: string, api: GridPrivateApiPremium): Promise<ValueOptionsData>;
+interface BuildExcelOptions extends Pick<GridExcelExportOptions, 'exceljsPreProcess' | 'exceljsPostProcess'>, Pick<Required<GridExcelExportOptions>, 'valueOptionsSheetName' | 'includeHeaders' | 'includeColumnGroupsHeaders' | 'escapeFormulas'> {
+  columns: GridStateColDef[];
+  rowIds: GridRowId[];
+  columnsStyles?: ColumnsStylesInterface;
+}
+export declare function buildExcel(options: BuildExcelOptions, apiRef: RefObject<GridPrivateApiPremium>): Promise<Excel.Workbook>;

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

@@ -2,27 +2,32 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import { GRID_DATE_COL_DEF, GRID_DATETIME_COL_DEF } from '@mui/x-data-grid-pro';
 import { isObject, isSingleSelectColDef, gridHasColSpanSelector } from '@mui/x-data-grid/internals';
 import { warnOnce } from '@mui/x-internals/warning';
-const getExcelJs = async () => {
-  const excelJsModule = await import('exceljs');
-  return excelJsModule.default ?? excelJsModule;
-};
-const getFormattedValueOptions = (colDef, row, valueOptions, api) => {
+import { addColumnGroupingHeaders, addSerializedRowToWorksheet, createValueOptionsSheetIfNeeded, getExcelJs } from "./utils.js";
+const getFormattedValueOptions = (colDef, row, valueOptions, api, callback) => {
   if (!colDef.valueOptions) {
-    return [];
+    return;
   }
-  let valueOptionsFormatted = valueOptions;
-  if (colDef.valueFormatter) {
-    valueOptionsFormatted = valueOptionsFormatted.map(option => {
+  const valueFormatter = colDef.valueFormatter;
+  for (let i = 0; i < valueOptions.length; i += 1) {
+    const option = valueOptions[i];
+    let value;
+    if (valueFormatter) {
       if (typeof option === 'object') {
-        return option;
+        value = option.label;
+      } else {
+        value = String(colDef.valueFormatter(option, row, colDef, {
+          current: api
+        }));
       }
-      return String(colDef.valueFormatter(option, row, colDef, {
-        current: api
-      }));
-    });
+    } else {
+      value = typeof option === 'object' ? option.label : option;
+    }
+    callback(value, i);
   }
-  return valueOptionsFormatted.map(option => typeof option === 'object' ? option.label : option);
 };
+const commaRegex = /,/g;
+const commaReplacement = 'CHAR(44)';
+
 /**
  * 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
@@ -30,11 +35,15 @@ const getFormattedValueOptions = (colDef, row, valueOptions, api) => {
  * The caller of this function MUST call `resetColSpan()` before and after usage.
  */
 export const serializeRowUnsafe = (id, columns, apiRef, defaultValueOptionsFormulae, options) => {
-  const row = {};
+  const serializedRow = {};
   const dataValidation = {};
   const mergedCells = [];
-  const firstCellParams = apiRef.current.getCellParams(id, columns[0].field);
-  const outlineLevel = firstCellParams.rowNode.depth;
+  const row = apiRef.current.getRow(id);
+  const rowNode = apiRef.current.getRowNode(id);
+  if (!row || !rowNode) {
+    throw new Error(`No row with id #${id} found`);
+  }
+  const outlineLevel = rowNode.depth;
   const hasColSpan = gridHasColSpanSelector(apiRef);
   if (hasColSpan) {
     // `colSpan` is only calculated for rendered rows, so we need to calculate it during export for every row
@@ -56,25 +65,32 @@ export const serializeRowUnsafe = (id, columns, apiRef, defaultValueOptionsFormu
         rightIndex: colIndex + colSpanInfo.cellProps.colSpan
       });
     }
-    const cellParams = apiRef.current.getCellParams(id, column.field);
     let cellValue;
-    switch (cellParams.colDef.type) {
+    switch (column.type) {
       case 'singleSelect':
         {
-          const castColumn = cellParams.colDef;
+          const castColumn = column;
           if (typeof castColumn.valueOptions === 'function') {
             // If value option depends on the row, set specific options to the cell
             // This dataValidation is buggy with LibreOffice and does not allow to have coma
             const valueOptions = castColumn.valueOptions({
               id,
               row,
-              field: cellParams.field
+              field: column.field
+            });
+            let formulae = '"';
+            getFormattedValueOptions(castColumn, row, valueOptions, apiRef.current, (value, index) => {
+              const formatted = value.toString().replace(commaRegex, commaReplacement);
+              formulae += formatted;
+              if (index < valueOptions.length - 1) {
+                formulae += ',';
+              }
             });
-            const formattedValueOptions = getFormattedValueOptions(castColumn, row, valueOptions, apiRef.current);
+            formulae += '"';
             dataValidation[castColumn.field] = {
               type: 'list',
               allowBlank: true,
-              formulae: [`"${formattedValueOptions.map(x => x.toString().replaceAll(',', 'CHAR(44)')).join(',')}"`]
+              formulae: [formulae]
             };
           } else {
             const address = defaultValueOptionsFormulae[column.field].address;
@@ -86,22 +102,22 @@ export const serializeRowUnsafe = (id, columns, apiRef, defaultValueOptionsFormu
               formulae: [address]
             };
           }
-          const formattedValue = apiRef.current.getCellParams(id, castColumn.field).formattedValue;
+          const formattedValue = apiRef.current.getRowFormattedValue(row, castColumn);
           if (process.env.NODE_ENV !== 'production') {
-            if (String(cellParams.formattedValue) === '[object Object]') {
+            if (String(formattedValue) === '[object Object]') {
               warnOnce(['MUI X: When the value of a field is an object or a `renderCell` is provided, the Excel export might not display the value correctly.', 'You can provide a `valueFormatter` with a string representation to be used.']);
             }
           }
           if (isObject(formattedValue)) {
-            row[castColumn.field] = formattedValue?.label;
+            serializedRow[castColumn.field] = formattedValue?.label;
           } else {
-            row[castColumn.field] = formattedValue;
+            serializedRow[castColumn.field] = formattedValue;
           }
           break;
         }
       case 'boolean':
       case 'number':
-        cellValue = apiRef.current.getCellParams(id, column.field).value;
+        cellValue = apiRef.current.getRowValue(row, column);
         break;
       case 'date':
       case 'dateTime':
@@ -109,21 +125,21 @@ export const serializeRowUnsafe = (id, columns, apiRef, defaultValueOptionsFormu
           // 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 = apiRef.current.getCellParams(id, column.field).value;
+          const value = apiRef.current.getRowValue(row, column);
           // value may be `undefined` in auto-generated grouping rows
           if (!value) {
             break;
           }
           const utcDate = new Date(Date.UTC(value.getFullYear(), value.getMonth(), value.getDate(), value.getHours(), value.getMinutes(), value.getSeconds()));
-          row[column.field] = utcDate;
+          serializedRow[column.field] = utcDate;
           break;
         }
       case 'actions':
         break;
       default:
-        cellValue = apiRef.current.getCellParams(id, column.field).formattedValue;
+        cellValue = apiRef.current.getRowFormattedValue(row, column);
         if (process.env.NODE_ENV !== 'production') {
-          if (String(cellParams.formattedValue) === '[object Object]') {
+          if (String(cellValue) === '[object Object]') {
             warnOnce(['MUI X: When the value of a field is an object or a `renderCell` is provided, the Excel export might not display the value correctly.', 'You can provide a `valueFormatter` with a string representation to be used.']);
           }
         }
@@ -136,11 +152,11 @@ export const serializeRowUnsafe = (id, columns, apiRef, defaultValueOptionsFormu
       }
     }
     if (typeof cellValue !== 'undefined') {
-      row[column.field] = cellValue;
+      serializedRow[column.field] = cellValue;
     }
   });
   return {
-    row,
+    row: serializedRow,
     dataValidation,
     outlineLevel,
     mergedCells
@@ -169,120 +185,39 @@ export const serializeColumn = (column, columnsStyles) => {
     style: _extends({}, type && defaultColumnsStyles?.[type], columnsStyles?.[field])
   };
 };
-const addColumnGroupingHeaders = (worksheet, columns, columnGroupPaths, columnGroupDetails) => {
-  const maxDepth = Math.max(...columns.map(({
-    key
-  }) => columnGroupPaths[key]?.length ?? 0));
-  if (maxDepth === 0) {
-    return;
-  }
-  for (let rowIndex = 0; rowIndex < maxDepth; rowIndex += 1) {
-    const row = columns.map(({
-      key
-    }) => {
-      const groupingPath = columnGroupPaths[key];
-      if (groupingPath.length <= rowIndex) {
-        return {
-          groupId: null,
-          parents: groupingPath
-        };
-      }
-      return _extends({}, columnGroupDetails[groupingPath[rowIndex]], {
-        parents: groupingPath.slice(0, rowIndex)
-      });
-    });
-    const newRow = worksheet.addRow(row.map(group => group.groupId === null ? null : group?.headerName ?? group.groupId));
-
-    // use `rowCount`, since worksheet can have additional rows added in `exceljsPreProcess`
-    const lastRowIndex = newRow.worksheet.rowCount;
-    let leftIndex = 0;
-    let rightIndex = 1;
-    while (rightIndex < columns.length) {
-      const {
-        groupId: leftGroupId,
-        parents: leftParents
-      } = row[leftIndex];
-      const {
-        groupId: rightGroupId,
-        parents: rightParents
-      } = row[rightIndex];
-      const areInSameGroup = leftGroupId === rightGroupId && leftParents.length === rightParents.length && leftParents.every((leftParent, index) => rightParents[index] === leftParent);
-      if (areInSameGroup) {
-        rightIndex += 1;
-      } else {
-        if (rightIndex - leftIndex > 1) {
-          worksheet.mergeCells(lastRowIndex, leftIndex + 1, lastRowIndex, rightIndex);
-        }
-        leftIndex = rightIndex;
-        rightIndex += 1;
-      }
-    }
-    if (rightIndex - leftIndex > 1) {
-      worksheet.mergeCells(lastRowIndex, leftIndex + 1, lastRowIndex, rightIndex);
-    }
-  }
-};
 export function serializeColumns(columns, styles) {
   return columns.map(column => serializeColumn(column, styles));
 }
 export async function getDataForValueOptionsSheet(columns, valueOptionsSheetName, api) {
-  const candidateColumns = columns.filter(column => isSingleSelectColDef(column) && Array.isArray(column.valueOptions));
-
   // Creates a temp worksheet to obtain the column letters
   const excelJS = await getExcelJs();
   const workbook = new excelJS.Workbook();
   const worksheet = workbook.addWorksheet('Sheet1');
-  worksheet.columns = candidateColumns.map(column => ({
-    key: column.field
-  }));
-  return candidateColumns.reduce((acc, column) => {
-    const singleSelectColumn = column;
-    const formattedValueOptions = getFormattedValueOptions(singleSelectColumn, {}, singleSelectColumn.valueOptions, api);
+  const record = {};
+  const worksheetColumns = [];
+  for (let i = 0; i < columns.length; i += 1) {
+    const column = columns[i];
+    const isCandidateColumn = isSingleSelectColDef(column) && Array.isArray(column.valueOptions);
+    if (!isCandidateColumn) {
+      continue;
+    }
+    worksheetColumns.push({
+      key: column.field
+    });
+    worksheet.columns = worksheetColumns;
     const header = column.headerName ?? column.field;
-    const values = [header, ...formattedValueOptions];
+    const values = [header];
+    getFormattedValueOptions(column, {}, column.valueOptions, api, value => {
+      values.push(value);
+    });
     const letter = worksheet.getColumn(column.field).letter;
     const address = `${valueOptionsSheetName}!$${letter}$2:$${letter}$${values.length}`;
-    acc[column.field] = {
+    record[column.field] = {
       values,
       address
     };
-    return acc;
-  }, {});
-}
-function addSerializedRowToWorksheet(serializedRow, worksheet) {
-  const {
-    row,
-    dataValidation,
-    outlineLevel,
-    mergedCells
-  } = serializedRow;
-  const newRow = worksheet.addRow(row);
-  Object.keys(dataValidation).forEach(field => {
-    newRow.getCell(field).dataValidation = _extends({}, dataValidation[field]);
-  });
-  if (outlineLevel) {
-    newRow.outlineLevel = outlineLevel;
   }
-
-  // use `rowCount`, since worksheet can have additional rows added in `exceljsPreProcess`
-  const lastRowIndex = newRow.worksheet.rowCount;
-  mergedCells.forEach(mergedCell => {
-    worksheet.mergeCells(lastRowIndex, mergedCell.leftIndex, lastRowIndex, mergedCell.rightIndex);
-  });
-}
-async function createValueOptionsSheetIfNeeded(valueOptionsData, sheetName, workbook) {
-  if (Object.keys(valueOptionsData).length === 0) {
-    return;
-  }
-  const valueOptionsWorksheet = workbook.addWorksheet(sheetName);
-  valueOptionsWorksheet.columns = Object.keys(valueOptionsData).map(key => ({
-    key
-  }));
-  Object.entries(valueOptionsData).forEach(([field, {
-    values
-  }]) => {
-    valueOptionsWorksheet.getColumn(field).values = values;
-  });
+  return record;
 }
 export async function buildExcel(options, apiRef) {
   const {
@@ -331,50 +266,4 @@ export async function buildExcel(options, apiRef) {
     });
   }
   return workbook;
-}
-export function setupExcelExportWebWorker(workerOptions = {}) {
-  // eslint-disable-next-line no-restricted-globals
-  addEventListener('message', async event => {
-    const {
-      serializedColumns,
-      serializedRows,
-      options,
-      valueOptionsSheetName,
-      valueOptionsData,
-      columnGroupDetails,
-      columnGroupPaths
-    } = event.data;
-    const {
-      exceljsPostProcess,
-      exceljsPreProcess
-    } = workerOptions;
-    const excelJS = await getExcelJs();
-    const workbook = new excelJS.Workbook();
-    const worksheet = workbook.addWorksheet('Sheet1');
-    worksheet.columns = serializedColumns;
-    if (exceljsPreProcess) {
-      await exceljsPreProcess({
-        workbook,
-        worksheet
-      });
-    }
-    if (options.includeColumnGroupsHeaders) {
-      addColumnGroupingHeaders(worksheet, serializedColumns, columnGroupPaths, columnGroupDetails);
-    }
-    const includeHeaders = options.includeHeaders ?? true;
-    if (includeHeaders) {
-      worksheet.addRow(serializedColumns.map(column => column.headerText));
-    }
-    createValueOptionsSheetIfNeeded(valueOptionsData, valueOptionsSheetName, workbook);
-    serializedRows.forEach(serializedRow => {
-      addSerializedRowToWorksheet(serializedRow, worksheet);
-    });
-    if (exceljsPostProcess) {
-      await exceljsPostProcess({
-        workbook,
-        worksheet
-      });
-    }
-    postMessage(await workbook.xlsx.writeBuffer());
-  });
 }

package/esm/hooks/features/export/serializer/setupExcelExportWebWorker.d.ts

@@ -0,0 +1,2 @@
+import type { GridExcelExportOptions } from '../gridExcelExportInterface';
+export declare function setupExcelExportWebWorker(workerOptions?: Pick<GridExcelExportOptions, 'exceljsPostProcess' | 'exceljsPreProcess'>): void;

package/esm/hooks/features/export/serializer/setupExcelExportWebWorker.js

@@ -0,0 +1,53 @@
+import { addColumnGroupingHeaders, addSerializedRowToWorksheet, createValueOptionsSheetIfNeeded, getExcelJs } from "./utils.js";
+export function setupExcelExportWebWorker(workerOptions = {}) {
+  // eslint-disable-next-line no-restricted-globals
+  addEventListener('message', async event => {
+    const {
+      namespace,
+      serializedColumns,
+      serializedRows,
+      options,
+      valueOptionsSheetName,
+      valueOptionsData,
+      columnGroupDetails,
+      columnGroupPaths
+    } = event.data;
+
+    // workers share the pub-sub channel namespace. Use this property to filter out messages.
+    if (namespace !== 'mui-x-data-grid-export') {
+      return;
+    }
+    const {
+      exceljsPostProcess,
+      exceljsPreProcess
+    } = workerOptions;
+    const excelJS = await getExcelJs();
+    const workbook = new excelJS.Workbook();
+    const worksheet = workbook.addWorksheet('Sheet1');
+    worksheet.columns = serializedColumns;
+    if (exceljsPreProcess) {
+      await exceljsPreProcess({
+        workbook,
+        worksheet
+      });
+    }
+    if (options.includeColumnGroupsHeaders) {
+      addColumnGroupingHeaders(worksheet, serializedColumns, columnGroupPaths, columnGroupDetails);
+    }
+    const includeHeaders = options.includeHeaders ?? true;
+    if (includeHeaders) {
+      worksheet.addRow(serializedColumns.map(column => column.headerText));
+    }
+    createValueOptionsSheetIfNeeded(valueOptionsData, valueOptionsSheetName, workbook);
+    serializedRows.forEach(serializedRow => {
+      addSerializedRowToWorksheet(serializedRow, worksheet);
+    });
+    if (exceljsPostProcess) {
+      await exceljsPostProcess({
+        workbook,
+        worksheet
+      });
+    }
+    postMessage(await workbook.xlsx.writeBuffer());
+  });
+}

package/esm/hooks/features/export/serializer/utils.d.ts

@@ -0,0 +1,36 @@
+import type * as Excel from 'exceljs';
+import type { GridColumnGroupLookup } from '@mui/x-data-grid/internals';
+import type { GridExcelExportOptions } from '../gridExcelExportInterface';
+export declare const getExcelJs: () => Promise<typeof Excel>;
+export interface SerializedRow {
+  row: Record<string, undefined | number | boolean | string | Date>;
+  dataValidation: Record<string, Excel.DataValidation>;
+  outlineLevel: number;
+  mergedCells: {
+    leftIndex: number;
+    rightIndex: number;
+  }[];
+}
+export declare const addColumnGroupingHeaders: (worksheet: Excel.Worksheet, columns: SerializedColumns, columnGroupPaths: Record<string, string[]>, columnGroupDetails: GridColumnGroupLookup) => void;
+export type SerializedColumns = Array<{
+  key: string;
+  width: number;
+  style: Partial<Excel.Style>;
+  headerText: string;
+}>;
+export type ValueOptionsData = Record<string, {
+  values: (string | number)[];
+  address: string;
+}>;
+export declare function addSerializedRowToWorksheet(serializedRow: SerializedRow, worksheet: Excel.Worksheet): void;
+export declare function createValueOptionsSheetIfNeeded(valueOptionsData: ValueOptionsData, sheetName: string, workbook: Excel.Workbook): Promise<void>;
+export interface ExcelExportInitEvent {
+  namespace?: string;
+  serializedColumns: SerializedColumns;
+  serializedRows: SerializedRow[];
+  valueOptionsSheetName: string;
+  columnGroupPaths: Record<string, string[]>;
+  columnGroupDetails: GridColumnGroupLookup;
+  valueOptionsData: ValueOptionsData;
+  options: Omit<GridExcelExportOptions, 'exceljsPreProcess' | 'exceljsPostProcess' | 'columnsStyles' | 'valueOptionsSheetName'>;
+}