@mui/x-data-grid 5.4.0 → 5.6.0

package/node/hooks/features/editRows/useGridRowEditing.js

@@ -0,0 +1,354 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useGridRowEditing = void 0;
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+
+var React = _interopRequireWildcard(require("react"));
+
+var _utils = require("@mui/material/utils");
+
+var _useGridApiMethod = require("../../utils/useGridApiMethod");
+
+var _gridEditRowModel = require("../../../models/gridEditRowModel");
+
+var _useGridSelector = require("../../utils/useGridSelector");
+
+var _gridColumnsSelector = require("../columns/gridColumnsSelector");
+
+var _gridEditRowsSelector = require("./gridEditRowsSelector");
+
+var _gridEvents = require("../../../models/events/gridEvents");
+
+var _gridFocusStateSelector = require("../focus/gridFocusStateSelector");
+
+var _useGridApiEventHandler = require("../../utils/useGridApiEventHandler");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+const useGridRowEditing = (apiRef, props) => {
+  var _props$experimentalFe2, _props$experimentalFe4;
+
+  const focusTimeout = React.useRef(null);
+  const nextFocusedCell = React.useRef(null);
+  const columnFields = (0, _useGridSelector.useGridSelector)(apiRef, _gridColumnsSelector.gridColumnFieldsSelector);
+
+  const buildCallback = callback => (...args) => {
+    if (props.editMode === _gridEditRowModel.GridEditModes.Row) {
+      callback(...args);
+    }
+  };
+
+  const setRowMode = React.useCallback((id, mode) => {
+    if (mode === apiRef.current.getRowMode(id)) {
+      return;
+    }
+
+    apiRef.current.setState(state => {
+      const newEditRowsState = (0, _extends2.default)({}, state.editRows);
+
+      if (mode === _gridEditRowModel.GridRowModes.Edit) {
+        newEditRowsState[id] = {};
+        columnFields.forEach(field => {
+          const cellParams = apiRef.current.getCellParams(id, field);
+
+          if (cellParams.isEditable) {
+            newEditRowsState[id][field] = {
+              value: cellParams.value
+            };
+          }
+        });
+      } else {
+        delete newEditRowsState[id];
+      }
+
+      return (0, _extends2.default)({}, state, {
+        editRows: newEditRowsState
+      });
+    });
+    apiRef.current.forceUpdate();
+  }, [apiRef, columnFields]);
+  const getRowMode = React.useCallback(id => {
+    if (props.editMode === _gridEditRowModel.GridEditModes.Cell) {
+      return _gridEditRowModel.GridRowModes.View;
+    }
+
+    const editRowsState = (0, _gridEditRowsSelector.gridEditRowsStateSelector)(apiRef.current.state);
+    return editRowsState[id] ? _gridEditRowModel.GridRowModes.Edit : _gridEditRowModel.GridRowModes.View;
+  }, [apiRef, props.editMode]);
+  const commitRowChange = React.useCallback((id, event = {}) => {
+    var _props$experimentalFe;
+
+    if (props.editMode === _gridEditRowModel.GridEditModes.Cell) {
+      throw new Error(`MUI: You can't commit changes when the edit mode is 'cell'.`);
+    }
+
+    apiRef.current.unstable_runPendingEditCellValueChangeDebounce(id);
+    const model = apiRef.current.getEditRowsModel();
+    const editRowProps = model[id];
+
+    if (!editRowProps) {
+      throw new Error(`MUI: Row at id: ${id} is not being edited.`);
+    }
+
+    if ((_props$experimentalFe = props.experimentalFeatures) != null && _props$experimentalFe.preventCommitWhileValidating) {
+      const isValid = Object.keys(editRowProps).reduce((acc, field) => {
+        return acc && !editRowProps[field].isValidating && !editRowProps[field].error;
+      }, true);
+
+      if (!isValid) {
+        return false;
+      }
+    }
+
+    const hasFieldWithError = Object.values(editRowProps).some(value => !!value.error);
+
+    if (hasFieldWithError) {
+      return false;
+    }
+
+    const fieldsWithValidator = Object.keys(editRowProps).filter(field => {
+      const column = apiRef.current.getColumn(field);
+      return typeof column.preProcessEditCellProps === 'function';
+    });
+
+    if (fieldsWithValidator.length > 0) {
+      const row = apiRef.current.getRow(id);
+      const validatorErrors = fieldsWithValidator.map(async field => {
+        const column = apiRef.current.getColumn(field);
+        const newEditCellProps = await Promise.resolve(column.preProcessEditCellProps({
+          id,
+          row,
+          props: editRowProps[field]
+        }));
+        apiRef.current.unstable_setEditCellProps({
+          id,
+          field,
+          props: newEditCellProps
+        });
+        return newEditCellProps.error;
+      });
+      return Promise.all(validatorErrors).then(errors => {
+        if (errors.some(error => !!error)) {
+          return false;
+        }
+
+        apiRef.current.publishEvent(_gridEvents.GridEvents.rowEditCommit, id, event);
+        return true;
+      });
+    }
+
+    apiRef.current.publishEvent(_gridEvents.GridEvents.rowEditCommit, id, event);
+    return true;
+  }, [apiRef, props.editMode, (_props$experimentalFe2 = props.experimentalFeatures) == null ? void 0 : _props$experimentalFe2.preventCommitWhileValidating]);
+  const setRowEditingEditCellValue = React.useCallback(params => {
+    const model = apiRef.current.getEditRowsModel();
+    const editRow = model[params.id];
+    const row = apiRef.current.getRow(params.id);
+    let isValid = true;
+    return new Promise(resolve => {
+      Object.keys(editRow).forEach(async field => {
+        const column = apiRef.current.getColumn(field);
+        let editCellProps = field === params.field ? {
+          value: params.value
+        } : editRow[field]; // setEditCellProps runs the value parser and returns the updated props
+
+        editCellProps = apiRef.current.unstable_setEditCellProps({
+          id: params.id,
+          field,
+          props: (0, _extends2.default)({}, editCellProps, {
+            isValidating: true
+          })
+        });
+
+        if (column.preProcessEditCellProps) {
+          editCellProps = await Promise.resolve(column.preProcessEditCellProps({
+            id: params.id,
+            row,
+            props: (0, _extends2.default)({}, editCellProps, {
+              value: field === params.field ? apiRef.current.unstable_parseValue(params.id, field, params.value) : editCellProps.value
+            })
+          }));
+        }
+
+        if (editCellProps.error) {
+          isValid = false;
+        }
+
+        apiRef.current.unstable_setEditCellProps({
+          id: params.id,
+          field,
+          props: (0, _extends2.default)({}, editCellProps, {
+            isValidating: false
+          })
+        });
+      });
+      resolve(isValid);
+    });
+  }, [apiRef]);
+  const rowEditingApi = {
+    setRowMode,
+    getRowMode,
+    commitRowChange,
+    unstable_setRowEditingEditCellValue: setRowEditingEditCellValue
+  };
+  (0, _useGridApiMethod.useGridApiMethod)(apiRef, rowEditingApi, 'EditRowApi');
+  const handleCellKeyDown = React.useCallback(async (params, event) => {
+    const {
+      cellMode,
+      isEditable
+    } = params;
+
+    if (!isEditable) {
+      return;
+    }
+
+    const isEditMode = cellMode === _gridEditRowModel.GridCellModes.Edit;
+    const rowParams = apiRef.current.getRowParams(params.id);
+
+    if (isEditMode) {
+      if (event.key === 'Enter') {
+        var _props$experimentalFe3;
+
+        // TODO: check the return before firing GridEvents.rowEditStop
+        // On cell editing, it won't exits the edit mode with error
+        const isValid = await apiRef.current.commitRowChange(params.id);
+
+        if (!isValid && (_props$experimentalFe3 = props.experimentalFeatures) != null && _props$experimentalFe3.preventCommitWhileValidating) {
+          return;
+        }
+
+        apiRef.current.publishEvent(_gridEvents.GridEvents.rowEditStop, rowParams, event);
+      } else if (event.key === 'Escape') {
+        apiRef.current.publishEvent(_gridEvents.GridEvents.rowEditStop, rowParams, event);
+      }
+    } else if (event.key === 'Enter') {
+      apiRef.current.publishEvent(_gridEvents.GridEvents.rowEditStart, rowParams, event);
+    }
+  }, [apiRef, (_props$experimentalFe4 = props.experimentalFeatures) == null ? void 0 : _props$experimentalFe4.preventCommitWhileValidating]);
+  const handleCellDoubleClick = React.useCallback((params, event) => {
+    if (!params.isEditable) {
+      return;
+    }
+
+    const rowParams = apiRef.current.getRowParams(params.id);
+    apiRef.current.publishEvent(_gridEvents.GridEvents.rowEditStart, rowParams, event);
+  }, [apiRef]);
+  const handleEditCellPropsChange = React.useCallback(params => {
+    const row = apiRef.current.getRow(params.id);
+    const model = apiRef.current.getEditRowsModel();
+    const editRow = model[params.id];
+    Object.keys(editRow).forEach(async field => {
+      const column = apiRef.current.getColumn(field);
+
+      if (column.preProcessEditCellProps) {
+        const editCellProps = field === params.field ? params.props : editRow[field];
+        const newEditCellProps = await Promise.resolve(column.preProcessEditCellProps({
+          id: params.id,
+          row,
+          props: editCellProps
+        }));
+        apiRef.current.unstable_setEditCellProps({
+          id: params.id,
+          field,
+          props: newEditCellProps
+        });
+      } else if (field === params.field) {
+        apiRef.current.unstable_setEditCellProps(params);
+      }
+    });
+  }, [apiRef]);
+  const handleRowEditStart = React.useCallback(params => {
+    apiRef.current.setRowMode(params.id, _gridEditRowModel.GridRowModes.Edit);
+  }, [apiRef]);
+  const handleRowEditStop = React.useCallback((params, event) => {
+    apiRef.current.setRowMode(params.id, _gridEditRowModel.GridRowModes.View);
+
+    if (event.key === 'Enter') {
+      apiRef.current.publishEvent(_gridEvents.GridEvents.cellNavigationKeyDown, params, event);
+    }
+  }, [apiRef]);
+  const handleRowEditCommit = React.useCallback(id => {
+    const model = apiRef.current.getEditRowsModel();
+    const editRow = model[id];
+
+    if (!editRow) {
+      throw new Error(`MUI: Row at id: ${id} is not being edited.`);
+    }
+
+    const row = apiRef.current.getRow(id);
+
+    if (row) {
+      let rowUpdate = (0, _extends2.default)({}, row);
+      Object.keys(editRow).forEach(field => {
+        const column = apiRef.current.getColumn(field);
+        const value = editRow[field].value;
+
+        if (column.valueSetter) {
+          rowUpdate = column.valueSetter({
+            row: rowUpdate,
+            value
+          });
+        } else {
+          rowUpdate[field] = value;
+        }
+      });
+      apiRef.current.updateRows([rowUpdate]);
+    }
+  }, [apiRef]);
+  const handleCellFocusIn = React.useCallback(params => {
+    nextFocusedCell.current = params;
+  }, []);
+
+  const commitPropsAndExit = async (params, event) => {
+    if (params.cellMode === _gridEditRowModel.GridCellModes.View) {
+      return;
+    }
+
+    nextFocusedCell.current = null;
+    focusTimeout.current = setTimeout(async () => {
+      var _nextFocusedCell$curr;
+
+      if (((_nextFocusedCell$curr = nextFocusedCell.current) == null ? void 0 : _nextFocusedCell$curr.id) !== params.id) {
+        await apiRef.current.commitRowChange(params.id, event);
+        const rowParams = apiRef.current.getRowParams(params.id);
+        apiRef.current.publishEvent(_gridEvents.GridEvents.rowEditStop, rowParams, event);
+      }
+    });
+  };
+
+  const handleCellFocusOut = (0, _utils.useEventCallback)((params, event) => {
+    commitPropsAndExit(params, event);
+  });
+  const handleColumnHeaderDragStart = (0, _utils.useEventCallback)(() => {
+    const cell = (0, _gridFocusStateSelector.gridFocusCellSelector)(apiRef);
+
+    if (!cell) {
+      return;
+    }
+
+    const params = apiRef.current.getCellParams(cell.id, cell.field);
+    commitPropsAndExit(params, {});
+  });
+  (0, _useGridApiEventHandler.useGridApiEventHandler)(apiRef, _gridEvents.GridEvents.cellKeyDown, buildCallback(handleCellKeyDown));
+  (0, _useGridApiEventHandler.useGridApiEventHandler)(apiRef, _gridEvents.GridEvents.cellDoubleClick, buildCallback(handleCellDoubleClick));
+  (0, _useGridApiEventHandler.useGridApiEventHandler)(apiRef, _gridEvents.GridEvents.editCellPropsChange, buildCallback(handleEditCellPropsChange));
+  (0, _useGridApiEventHandler.useGridApiEventHandler)(apiRef, _gridEvents.GridEvents.rowEditStart, buildCallback(handleRowEditStart));
+  (0, _useGridApiEventHandler.useGridApiEventHandler)(apiRef, _gridEvents.GridEvents.rowEditStop, buildCallback(handleRowEditStop));
+  (0, _useGridApiEventHandler.useGridApiEventHandler)(apiRef, _gridEvents.GridEvents.rowEditCommit, buildCallback(handleRowEditCommit));
+  (0, _useGridApiEventHandler.useGridApiEventHandler)(apiRef, _gridEvents.GridEvents.cellFocusIn, buildCallback(handleCellFocusIn));
+  (0, _useGridApiEventHandler.useGridApiEventHandler)(apiRef, _gridEvents.GridEvents.cellFocusOut, buildCallback(handleCellFocusOut));
+  (0, _useGridApiEventHandler.useGridApiEventHandler)(apiRef, _gridEvents.GridEvents.columnHeaderDragStart, buildCallback(handleColumnHeaderDragStart));
+  (0, _useGridApiEventHandler.useGridApiOptionHandler)(apiRef, _gridEvents.GridEvents.rowEditCommit, props.onRowEditCommit);
+  (0, _useGridApiEventHandler.useGridApiOptionHandler)(apiRef, _gridEvents.GridEvents.rowEditStart, props.onRowEditStart);
+  (0, _useGridApiEventHandler.useGridApiOptionHandler)(apiRef, _gridEvents.GridEvents.rowEditStop, props.onRowEditStop);
+};
+
+exports.useGridRowEditing = useGridRowEditing;

package/node/hooks/features/events/useGridEvents.js

@@ -0,0 +1,32 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useGridEvents = useGridEvents;
+
+var _events = require("../../../models/events");
+
+var _useGridApiEventHandler = require("../../utils/useGridApiEventHandler");
+
+/**
+ * @requires useGridFocus (event) - can be after, async only
+ * @requires useGridColumns (event) - can be after, async only
+ */
+function useGridEvents(apiRef, props) {
+  (0, _useGridApiEventHandler.useGridApiOptionHandler)(apiRef, _events.GridEvents.columnHeaderClick, props.onColumnHeaderClick);
+  (0, _useGridApiEventHandler.useGridApiOptionHandler)(apiRef, _events.GridEvents.columnHeaderDoubleClick, props.onColumnHeaderDoubleClick);
+  (0, _useGridApiEventHandler.useGridApiOptionHandler)(apiRef, _events.GridEvents.columnHeaderOver, props.onColumnHeaderOver);
+  (0, _useGridApiEventHandler.useGridApiOptionHandler)(apiRef, _events.GridEvents.columnHeaderOut, props.onColumnHeaderOut);
+  (0, _useGridApiEventHandler.useGridApiOptionHandler)(apiRef, _events.GridEvents.columnHeaderEnter, props.onColumnHeaderEnter);
+  (0, _useGridApiEventHandler.useGridApiOptionHandler)(apiRef, _events.GridEvents.columnHeaderLeave, props.onColumnHeaderLeave);
+  (0, _useGridApiEventHandler.useGridApiOptionHandler)(apiRef, _events.GridEvents.columnOrderChange, props.onColumnOrderChange);
+  (0, _useGridApiEventHandler.useGridApiOptionHandler)(apiRef, _events.GridEvents.cellClick, props.onCellClick);
+  (0, _useGridApiEventHandler.useGridApiOptionHandler)(apiRef, _events.GridEvents.cellDoubleClick, props.onCellDoubleClick);
+  (0, _useGridApiEventHandler.useGridApiOptionHandler)(apiRef, _events.GridEvents.cellKeyDown, props.onCellKeyDown);
+  (0, _useGridApiEventHandler.useGridApiOptionHandler)(apiRef, _events.GridEvents.cellFocusOut, props.onCellFocusOut);
+  (0, _useGridApiEventHandler.useGridApiOptionHandler)(apiRef, _events.GridEvents.rowDoubleClick, props.onRowDoubleClick);
+  (0, _useGridApiEventHandler.useGridApiOptionHandler)(apiRef, _events.GridEvents.rowClick, props.onRowClick);
+  (0, _useGridApiEventHandler.useGridApiOptionHandler)(apiRef, _events.GridEvents.componentError, props.onError);
+  (0, _useGridApiEventHandler.useGridApiOptionHandler)(apiRef, _events.GridEvents.stateChange, props.onStateChange);
+}

package/node/hooks/features/export/serializers/csvSerializer.js

@@ -0,0 +1,55 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.buildCSV = buildCSV;
+
+var _colDef = require("../../../../colDef");
+
+const serialiseCellValue = (value, delimiterCharacter) => {
+  if (typeof value === 'string') {
+    const formattedValue = value.replace(/"/g, '""'); // Make sure value containing delimiter or line break won't be split into multiple rows
+
+    if ([delimiterCharacter, '\n', '\r'].some(delimiter => formattedValue.includes(delimiter))) {
+      return `"${formattedValue}"`;
+    }
+
+    return formattedValue;
+  }
+
+  return value;
+};
+
+let warnedOnce = false;
+
+const serialiseRow = (id, columns, getCellParams, delimiterCharacter) => columns.map(column => {
+  const cellParams = getCellParams(id, column.field);
+
+  if (process.env.NODE_ENV !== 'production') {
+    if (!warnedOnce && String(cellParams.formattedValue) === '[object Object]') {
+      console.warn(['MUI: When the value of a field is an object or a `renderCell` is provided, the CSV export might not display the value correctly.', 'You can provide a `valueFormatter` with a string representation to be used.'].join('\n'));
+      warnedOnce = true;
+    }
+  }
+
+  return serialiseCellValue(cellParams.formattedValue, delimiterCharacter);
+});
+
+function buildCSV(options) {
+  const {
+    columns,
+    rowIds,
+    getCellParams,
+    delimiterCharacter,
+    includeHeaders
+  } = options;
+  const CSVBody = rowIds.reduce((acc, id) => `${acc}${serialiseRow(id, columns, getCellParams, delimiterCharacter).join(delimiterCharacter)}\r\n`, '').trim();
+
+  if (!includeHeaders) {
+    return CSVBody;
+  }
+
+  const CSVHead = `${columns.filter(column => column.field !== _colDef.GRID_CHECKBOX_SELECTION_COL_DEF.field).map(column => serialiseCellValue(column.headerName || column.field, delimiterCharacter)).join(delimiterCharacter)}\r\n`;
+  return `${CSVHead}${CSVBody}`.trim();
+}

package/node/hooks/features/export/useGridCsvExport.js

@@ -0,0 +1,84 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useGridCsvExport = void 0;
+
+var React = _interopRequireWildcard(require("react"));
+
+var _useGridApiMethod = require("../../utils/useGridApiMethod");
+
+var _filter = require("../filter");
+
+var _useGridLogger = require("../../utils/useGridLogger");
+
+var _exportAs = require("../../../utils/exportAs");
+
+var _csvSerializer = require("./serializers/csvSerializer");
+
+var _utils = require("./utils");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+const defaultGetRowsToExport = ({
+  apiRef
+}) => {
+  const filteredSortedRowIds = (0, _filter.gridFilteredSortedRowIdsSelector)(apiRef);
+  const selectedRows = apiRef.current.getSelectedRows();
+
+  if (selectedRows.size > 0) {
+    return filteredSortedRowIds.filter(id => selectedRows.has(id));
+  }
+
+  return filteredSortedRowIds;
+};
+/**
+ * @requires useGridColumns (state)
+ * @requires useGridFilter (state)
+ * @requires useGridSorting (state)
+ * @requires useGridSelection (state)
+ * @requires useGridParamsApi (method)
+ */
+
+
+const useGridCsvExport = apiRef => {
+  const logger = (0, _useGridLogger.useGridLogger)(apiRef, 'useGridCsvExport');
+  const getDataAsCsv = React.useCallback((options = {}) => {
+    var _options$getRowsToExp, _options$includeHeade;
+
+    logger.debug(`Get data as CSV`);
+    const exportedColumns = (0, _utils.getColumnsToExport)({
+      apiRef,
+      options
+    });
+    const getRowsToExport = (_options$getRowsToExp = options.getRowsToExport) != null ? _options$getRowsToExp : defaultGetRowsToExport;
+    const exportedRowIds = getRowsToExport({
+      apiRef
+    });
+    return (0, _csvSerializer.buildCSV)({
+      columns: exportedColumns,
+      rowIds: exportedRowIds,
+      getCellParams: apiRef.current.getCellParams,
+      delimiterCharacter: options.delimiter || ',',
+      includeHeaders: (_options$includeHeade = options.includeHeaders) != null ? _options$includeHeade : true
+    });
+  }, [logger, apiRef]);
+  const exportDataAsCsv = React.useCallback(options => {
+    logger.debug(`Export data as CSV`);
+    const csv = getDataAsCsv(options);
+    const blob = new Blob([options != null && options.utf8WithBom ? new Uint8Array([0xef, 0xbb, 0xbf]) : '', csv], {
+      type: 'text/csv'
+    });
+    (0, _exportAs.exportAs)(blob, 'csv', options == null ? void 0 : options.fileName);
+  }, [logger, getDataAsCsv]);
+  const csvExportApi = {
+    getDataAsCsv,
+    exportDataAsCsv
+  };
+  (0, _useGridApiMethod.useGridApiMethod)(apiRef, csvExportApi, 'GridCsvExportApi');
+};
+
+exports.useGridCsvExport = useGridCsvExport;