@mui/x-data-grid 7.0.0-alpha.9 → 7.0.0-beta.1

package/modern/locales/skSK.js

@@ -37,12 +37,11 @@ const skSKGrid = {
   toolbarExportCSV: 'Stiahnuť ako CSV',
   toolbarExportPrint: 'Vytlačiť',
   toolbarExportExcel: 'Stiahnuť ako Excel',
-  // Columns panel text
-  columnsPanelTextFieldLabel: 'Nájsť stĺpec',
-  columnsPanelTextFieldPlaceholder: 'Názov stĺpca',
-  columnsPanelDragIconLabel: 'Usporiadť stĺpce',
-  columnsPanelShowAllButton: 'Zobraziť všetko',
-  columnsPanelHideAllButton: 'Skryť všetko',
+  // Columns management text
+  // columnsManagementSearchTitle: 'Search',
+  // columnsManagementNoColumns: 'No columns',
+  // columnsManagementShowHideAllText: 'Show/Hide All',
+
   // Filter panel text
   filterPanelAddFilter: 'Pridať filter',
   filterPanelRemoveAll: 'Odstrániť všetky',

package/modern/locales/svSE.js

@@ -29,12 +29,11 @@ const svSEGrid = {
   toolbarExportCSV: 'Ladda ner som CSV',
   toolbarExportPrint: 'Skriv ut',
   toolbarExportExcel: 'Ladda ner som Excel',
-  // Columns panel text
-  columnsPanelTextFieldLabel: 'Hitta kolumn',
-  columnsPanelTextFieldPlaceholder: 'Kolumntitel',
-  columnsPanelDragIconLabel: 'Ordna om kolumnen',
-  columnsPanelShowAllButton: 'Visa alla',
-  columnsPanelHideAllButton: 'Dölj alla',
+  // Columns management text
+  // columnsManagementSearchTitle: 'Search',
+  // columnsManagementNoColumns: 'No columns',
+  // columnsManagementShowHideAllText: 'Show/Hide All',
+
   // Filter panel text
   filterPanelAddFilter: 'Lägg till filter',
   filterPanelRemoveAll: 'Ta bort alla',

package/modern/locales/trTR.js

@@ -29,12 +29,11 @@ const trTRGrid = {
   toolbarExportCSV: 'CSV olarak aktar',
   toolbarExportPrint: 'Yazdır',
   toolbarExportExcel: 'Excel olarak aktar',
-  // Columns panel text
-  columnsPanelTextFieldLabel: 'Sütun ara',
-  columnsPanelTextFieldPlaceholder: 'Sütun adı',
-  columnsPanelDragIconLabel: 'Sütunları yeniden sırala',
-  columnsPanelShowAllButton: 'Hepsini göster',
-  columnsPanelHideAllButton: 'Hepsini gizle',
+  // Columns management text
+  // columnsManagementSearchTitle: 'Search',
+  // columnsManagementNoColumns: 'No columns',
+  // columnsManagementShowHideAllText: 'Show/Hide All',
+
   // Filter panel text
   filterPanelAddFilter: 'Filtre Ekle',
   filterPanelRemoveAll: 'Hepsini kaldır',

package/modern/locales/ukUA.js

@@ -43,12 +43,11 @@ const ukUAGrid = {
   toolbarExportCSV: 'Завантажити у форматі CSV',
   toolbarExportPrint: 'Друк',
   toolbarExportExcel: 'Завантажити у форматі Excel',
-  // Columns panel text
-  columnsPanelTextFieldLabel: 'Знайти стовпець',
-  columnsPanelTextFieldPlaceholder: 'Заголовок стовпця',
-  columnsPanelDragIconLabel: 'Змінити порядок стовпця',
-  columnsPanelShowAllButton: 'Показати всі',
-  columnsPanelHideAllButton: 'Приховати всі',
+  // Columns management text
+  // columnsManagementSearchTitle: 'Search',
+  // columnsManagementNoColumns: 'No columns',
+  // columnsManagementShowHideAllText: 'Show/Hide All',
+
   // Filter panel text
   filterPanelAddFilter: 'Додати фільтр',
   filterPanelRemoveAll: 'Видалити всі',

package/modern/locales/urPK.js

@@ -29,12 +29,11 @@ const urPKGrid = {
   toolbarExportCSV: 'CSV کے طور پر ڈاوٴنلوڈ کریں',
   toolbarExportPrint: 'پرنٹ کریں',
   toolbarExportExcel: 'ایکسل کے طور پر ڈاوٴنلوڈ کریں',
-  // Columns panel text
-  columnsPanelTextFieldLabel: 'کالم کو تلاش کریں',
-  columnsPanelTextFieldPlaceholder: 'کالم کا عنوان',
-  columnsPanelDragIconLabel: 'کالم کی ترتیب تبدیل کریں',
-  columnsPanelShowAllButton: 'سارے دکھائیں',
-  columnsPanelHideAllButton: 'سارے چھپائیں',
+  // Columns management text
+  // columnsManagementSearchTitle: 'Search',
+  // columnsManagementNoColumns: 'No columns',
+  // columnsManagementShowHideAllText: 'Show/Hide All',
+
   // Filter panel text
   filterPanelAddFilter: 'نیا فلٹر',
   filterPanelRemoveAll: 'سارے ختم کریں',

package/modern/locales/viVN.js

@@ -29,12 +29,11 @@ const viVNGrid = {
   toolbarExportCSV: 'Xuất CSV',
   toolbarExportPrint: 'In',
   toolbarExportExcel: 'Xuất Excel',
-  // Columns panel text
-  columnsPanelTextFieldLabel: 'Tìm kiếm',
-  columnsPanelTextFieldPlaceholder: 'Tiêu đề cột',
-  columnsPanelDragIconLabel: 'Sắp xếp',
-  columnsPanelShowAllButton: 'Hiện tất cả',
-  columnsPanelHideAllButton: 'Ẩn tất cả',
+  // Columns management text
+  // columnsManagementSearchTitle: 'Search',
+  // columnsManagementNoColumns: 'No columns',
+  // columnsManagementShowHideAllText: 'Show/Hide All',
+
   // Filter panel text
   filterPanelAddFilter: 'Thêm bộ lọc',
   filterPanelRemoveAll: 'Xóa tất cả',

package/modern/locales/zhCN.js

@@ -29,12 +29,11 @@ const zhCNGrid = {
   toolbarExportCSV: '导出至CSV',
   toolbarExportPrint: '打印',
   toolbarExportExcel: '导出至Excel',
-  // Columns panel text
-  columnsPanelTextFieldLabel: '搜索列',
-  columnsPanelTextFieldPlaceholder: '列名',
-  columnsPanelDragIconLabel: '重排序列',
-  columnsPanelShowAllButton: '显示所有',
-  columnsPanelHideAllButton: '隐藏所有',
+  // Columns management text
+  // columnsManagementSearchTitle: 'Search',
+  // columnsManagementNoColumns: 'No columns',
+  // columnsManagementShowHideAllText: 'Show/Hide All',
+
   // Filter panel text
   filterPanelAddFilter: '添加筛选器',
   filterPanelRemoveAll: '清除全部',

package/modern/locales/zhHK.js

@@ -29,12 +29,11 @@ const zhHKGrid = {
   toolbarExportCSV: '下載為 CSV',
   toolbarExportPrint: '列印',
   toolbarExportExcel: '下載為 Excel',
-  // Columns panel text
-  columnsPanelTextFieldLabel: '查找欄目',
-  columnsPanelTextFieldPlaceholder: '欄目標題',
-  columnsPanelDragIconLabel: '重新排序列',
-  columnsPanelShowAllButton: '顯示所有',
-  columnsPanelHideAllButton: '全部藏起來',
+  // Columns management text
+  // columnsManagementSearchTitle: 'Search',
+  // columnsManagementNoColumns: 'No columns',
+  // columnsManagementShowHideAllText: 'Show/Hide All',
+
   // Filter panel text
   filterPanelAddFilter: '新增過濾器',
   filterPanelRemoveAll: '移除所有',

package/modern/locales/zhTW.js

@@ -29,12 +29,11 @@ const zhTWGrid = {
   toolbarExportCSV: '匯出 CSV',
   toolbarExportPrint: '列印',
   toolbarExportExcel: '匯出 Excel',
-  // Columns panel text
-  columnsPanelTextFieldLabel: '欄位搜尋',
-  columnsPanelTextFieldPlaceholder: '欄位名稱',
-  columnsPanelDragIconLabel: '排序欄位',
-  columnsPanelShowAllButton: '顯示所有',
-  columnsPanelHideAllButton: '隱藏所有',
+  // Columns management text
+  // columnsManagementSearchTitle: 'Search',
+  // columnsManagementNoColumns: 'No columns',
+  // columnsManagementShowHideAllText: 'Show/Hide All',
+
   // Filter panel text
   filterPanelAddFilter: '增加篩選器',
   filterPanelRemoveAll: '清除所有',

package/node/DataGrid/useDataGridComponent.js

@@ -63,7 +63,7 @@ const useDataGridComponent = (inputApiRef, props) => {
   (0, _useGridRowSelection.useGridRowSelection)(apiRef, props);
   (0, _useGridColumns.useGridColumns)(apiRef, props);
   (0, _useGridRows.useGridRows)(apiRef, props);
-  (0, _useGridParamsApi.useGridParamsApi)(apiRef, props);
+  (0, _useGridParamsApi.useGridParamsApi)(apiRef);
   (0, _useGridColumnSpanning.useGridColumnSpanning)(apiRef);
   (0, _useGridColumnGrouping.useGridColumnGrouping)(apiRef, props);
   (0, _useGridEditing.useGridEditing)(apiRef, props);

package/node/colDef/gridBooleanColDef.js

@@ -11,12 +11,9 @@ var _GridBooleanCell = require("../components/cell/GridBooleanCell");
 var _GridEditBooleanCell = require("../components/cell/GridEditBooleanCell");
 var _gridSortingUtils = require("../hooks/features/sorting/gridSortingUtils");
 var _gridBooleanOperators = require("./gridBooleanOperators");
-function gridBooleanFormatter({
-  value,
-  api
-}) {
-  return value ? api.getLocaleText('booleanCellTrueLabel') : api.getLocaleText('booleanCellFalseLabel');
-}
+const gridBooleanFormatter = (value, row, column, apiRef) => {
+  return value ? apiRef.current.getLocaleText('booleanCellTrueLabel') : apiRef.current.getLocaleText('booleanCellFalseLabel');
+};
 const stringToBoolean = value => {
   switch (value.toLowerCase().trim()) {
     case 'true':

package/node/colDef/gridCheckboxSelectionColDef.js

@@ -28,9 +28,10 @@ const GRID_CHECKBOX_SELECTION_COL_DEF = exports.GRID_CHECKBOX_SELECTION_COL_DEF
   disableReorder: true,
   disableExport: true,
   getApplyQuickFilterFn: undefined,
-  valueGetter: params => {
-    const selectionLookup = (0, _gridRowSelectionSelector.selectedIdsLookupSelector)(params.api.state, params.api.instanceId);
-    return selectionLookup[params.id] !== undefined;
+  valueGetter: (value, row, column, apiRef) => {
+    const selectionLookup = (0, _gridRowSelectionSelector.selectedIdsLookupSelector)(apiRef);
+    const rowId = apiRef.current.getRowId(row);
+    return selectionLookup[rowId] !== undefined;
   },
   renderHeader: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_GridHeaderCheckbox.GridHeaderCheckbox, (0, _extends2.default)({}, params)),
   renderCell: params => /*#__PURE__*/(0, _jsxRuntime.jsx)(_GridCellCheckboxRenderer.GridCellCheckboxRenderer, (0, _extends2.default)({}, params))

package/node/colDef/gridDateColDef.js

@@ -4,9 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.GRID_DATE_COL_DEF = exports.GRID_DATETIME_COL_DEF = void 0;
-exports.gridDateFormatter = gridDateFormatter;
-exports.gridDateTimeFormatter = gridDateTimeFormatter;
+exports.gridDateTimeFormatter = exports.gridDateFormatter = exports.GRID_DATE_COL_DEF = exports.GRID_DATETIME_COL_DEF = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _gridSortingUtils = require("../hooks/features/sorting/gridSortingUtils");
 var _gridDateOperators = require("./gridDateOperators");
@@ -22,38 +20,34 @@ function throwIfNotDateObject({
     throw new Error([`MUI X: \`${columnType}\` column type only accepts \`Date\` objects as values.`, 'Use `valueGetter` to transform the value into a `Date` object.', `Row ID: ${rowId}, field: "${field}".`].join('\n'));
   }
 }
-function gridDateFormatter({
-  value,
-  field,
-  id
-}) {
+const gridDateFormatter = (value, row, column, apiRef) => {
   if (!value) {
     return '';
   }
+  const rowId = apiRef.current.getRowId(row);
   throwIfNotDateObject({
     value,
     columnType: 'date',
-    rowId: id,
-    field
+    rowId,
+    field: column.field
   });
   return value.toLocaleDateString();
-}
-function gridDateTimeFormatter({
-  value,
-  field,
-  id
-}) {
+};
+exports.gridDateFormatter = gridDateFormatter;
+const gridDateTimeFormatter = (value, row, column, apiRef) => {
   if (!value) {
     return '';
   }
+  const rowId = apiRef.current.getRowId(row);
   throwIfNotDateObject({
     value,
     columnType: 'dateTime',
-    rowId: id,
-    field
+    rowId,
+    field: column.field
   });
   return value.toLocaleString();
-}
+};
+exports.gridDateTimeFormatter = gridDateTimeFormatter;
 const GRID_DATE_COL_DEF = exports.GRID_DATE_COL_DEF = (0, _extends2.default)({}, _gridStringColDef.GRID_STRING_COL_DEF, {
   type: 'date',
   sortComparator: _gridSortingUtils.gridDateComparator,

package/node/colDef/gridNumericColDef.js

@@ -16,9 +16,7 @@ const GRID_NUMERIC_COL_DEF = exports.GRID_NUMERIC_COL_DEF = (0, _extends2.defaul
   headerAlign: 'right',
   sortComparator: _gridSortingUtils.gridNumberComparator,
   valueParser: value => value === '' ? null : Number(value),
-  valueFormatter: ({
-    value
-  }) => (0, _utils.isNumber)(value) ? value.toLocaleString() : value || '',
+  valueFormatter: value => (0, _utils.isNumber)(value) ? value.toLocaleString() : value || '',
   filterOperators: (0, _gridNumericOperators.getGridNumericOperators)(),
   getApplyQuickFilterFn: _gridNumericOperators.getGridNumericQuickFilterFn
 });

package/node/colDef/gridSingleSelectColDef.js

@@ -24,20 +24,15 @@ const GRID_SINGLE_SELECT_COL_DEF = exports.GRID_SINGLE_SELECT_COL_DEF = (0, _ext
   type: 'singleSelect',
   getOptionLabel: defaultGetOptionLabel,
   getOptionValue: defaultGetOptionValue,
-  valueFormatter(params) {
-    const {
-      id,
-      field,
-      value,
-      api
-    } = params;
-    const colDef = params.api.getColumn(field);
+  valueFormatter(value, row, colDef, apiRef) {
+    // const { id, field, value, api } = params;
+    const rowId = apiRef.current.getRowId(row);
     if (!(0, _filterPanelUtils.isSingleSelectColDef)(colDef)) {
       return '';
     }
     const valueOptions = (0, _filterPanelUtils.getValueOptions)(colDef, {
-      id,
-      row: id ? api.getRow(id) : null
+      id: rowId,
+      row
     });
     if (value == null) {
       return '';
@@ -54,8 +49,8 @@ const GRID_SINGLE_SELECT_COL_DEF = exports.GRID_SINGLE_SELECT_COL_DEF = (0, _ext
   renderEditCell: _GridEditSingleSelectCell.renderEditSingleSelectCell,
   filterOperators: (0, _gridSingleSelectOperators.getGridSingleSelectOperators)(),
   // @ts-ignore
-  pastedValueParser: (value, params) => {
-    const colDef = params.colDef;
+  pastedValueParser: (value, row, column) => {
+    const colDef = column;
     const valueOptions = (0, _filterPanelUtils.getValueOptions)(colDef) || [];
     const getOptionValue = colDef.getOptionValue;
     const valueOption = valueOptions.find(option => {

package/node/components/GridRow.js

@@ -441,106 +441,7 @@ process.env.NODE_ENV !== "production" ? GridRow.propTypes = {
   onDoubleClick: _propTypes.default.func,
   onMouseEnter: _propTypes.default.func,
   onMouseLeave: _propTypes.default.func,
-  pinnedColumns: _propTypes.default.shape({
-    left: _propTypes.default.arrayOf(_propTypes.default.shape({
-      align: _propTypes.default.oneOf(['center', 'left', 'right']),
-      cellClassName: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.string]),
-      colSpan: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.number]),
-      computedWidth: _propTypes.default.number.isRequired,
-      description: _propTypes.default.string,
-      disableColumnMenu: _propTypes.default.bool,
-      disableExport: _propTypes.default.bool,
-      disableReorder: _propTypes.default.bool,
-      editable: _propTypes.default.bool,
-      field: _propTypes.default.string.isRequired,
-      filterable: _propTypes.default.bool,
-      filterOperators: _propTypes.default.arrayOf(_propTypes.default.shape({
-        getApplyFilterFn: _propTypes.default.func.isRequired,
-        getValueAsString: _propTypes.default.func,
-        headerLabel: _propTypes.default.string,
-        InputComponent: _propTypes.default.elementType,
-        InputComponentProps: _propTypes.default.object,
-        label: _propTypes.default.string,
-        requiresFilterValue: _propTypes.default.bool,
-        value: _propTypes.default.string.isRequired
-      })),
-      flex: _propTypes.default.number,
-      getApplyQuickFilterFn: _propTypes.default.func,
-      groupable: _propTypes.default.bool,
-      hasBeenResized: _propTypes.default.bool,
-      headerAlign: _propTypes.default.oneOf(['center', 'left', 'right']),
-      headerClassName: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.string]),
-      headerName: _propTypes.default.string,
-      hideable: _propTypes.default.bool,
-      hideSortIcons: _propTypes.default.bool,
-      maxWidth: _propTypes.default.number,
-      minWidth: _propTypes.default.number,
-      pinnable: _propTypes.default.bool,
-      preProcessEditCellProps: _propTypes.default.func,
-      renderCell: _propTypes.default.func,
-      renderEditCell: _propTypes.default.func,
-      renderHeader: _propTypes.default.func,
-      resizable: _propTypes.default.bool,
-      sortable: _propTypes.default.bool,
-      sortComparator: _propTypes.default.func,
-      sortingOrder: _propTypes.default.arrayOf(_propTypes.default.oneOf(['asc', 'desc'])),
-      type: _propTypes.default.oneOf(['actions', 'boolean', 'custom', 'date', 'dateTime', 'number', 'singleSelect', 'string']),
-      valueFormatter: _propTypes.default.func,
-      valueGetter: _propTypes.default.func,
-      valueParser: _propTypes.default.func,
-      valueSetter: _propTypes.default.func,
-      width: _propTypes.default.number
-    })).isRequired,
-    right: _propTypes.default.arrayOf(_propTypes.default.shape({
-      align: _propTypes.default.oneOf(['center', 'left', 'right']),
-      cellClassName: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.string]),
-      colSpan: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.number]),
-      computedWidth: _propTypes.default.number.isRequired,
-      description: _propTypes.default.string,
-      disableColumnMenu: _propTypes.default.bool,
-      disableExport: _propTypes.default.bool,
-      disableReorder: _propTypes.default.bool,
-      editable: _propTypes.default.bool,
-      field: _propTypes.default.string.isRequired,
-      filterable: _propTypes.default.bool,
-      filterOperators: _propTypes.default.arrayOf(_propTypes.default.shape({
-        getApplyFilterFn: _propTypes.default.func.isRequired,
-        getValueAsString: _propTypes.default.func,
-        headerLabel: _propTypes.default.string,
-        InputComponent: _propTypes.default.elementType,
-        InputComponentProps: _propTypes.default.object,
-        label: _propTypes.default.string,
-        requiresFilterValue: _propTypes.default.bool,
-        value: _propTypes.default.string.isRequired
-      })),
-      flex: _propTypes.default.number,
-      getApplyQuickFilterFn: _propTypes.default.func,
-      groupable: _propTypes.default.bool,
-      hasBeenResized: _propTypes.default.bool,
-      headerAlign: _propTypes.default.oneOf(['center', 'left', 'right']),
-      headerClassName: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.string]),
-      headerName: _propTypes.default.string,
-      hideable: _propTypes.default.bool,
-      hideSortIcons: _propTypes.default.bool,
-      maxWidth: _propTypes.default.number,
-      minWidth: _propTypes.default.number,
-      pinnable: _propTypes.default.bool,
-      preProcessEditCellProps: _propTypes.default.func,
-      renderCell: _propTypes.default.func,
-      renderEditCell: _propTypes.default.func,
-      renderHeader: _propTypes.default.func,
-      resizable: _propTypes.default.bool,
-      sortable: _propTypes.default.bool,
-      sortComparator: _propTypes.default.func,
-      sortingOrder: _propTypes.default.arrayOf(_propTypes.default.oneOf(['asc', 'desc'])),
-      type: _propTypes.default.oneOf(['actions', 'boolean', 'custom', 'date', 'dateTime', 'number', 'singleSelect', 'string']),
-      valueFormatter: _propTypes.default.func,
-      valueGetter: _propTypes.default.func,
-      valueParser: _propTypes.default.func,
-      valueSetter: _propTypes.default.func,
-      width: _propTypes.default.number
-    })).isRequired
-  }).isRequired,
+  pinnedColumns: _propTypes.default.object.isRequired,
   renderedColumns: _propTypes.default.arrayOf(_propTypes.default.object).isRequired,
   row: _propTypes.default.object,
   rowHeight: _propTypes.default.oneOfType([_propTypes.default.oneOf(['auto']), _propTypes.default.number]).isRequired,

package/node/components/cell/GridEditInputCell.js

@@ -66,7 +66,7 @@ const GridEditInputCell = exports.GridEditInputCell = /*#__PURE__*/React.forward
     const column = apiRef.current.getColumn(field);
     let parsedValue = newValue;
     if (column.valueParser) {
-      parsedValue = column.valueParser(newValue, apiRef.current.getCellParams(id, field));
+      parsedValue = column.valueParser(newValue, apiRef.current.getRow(id), column, apiRef);
     }
     setValueState(parsedValue);
     apiRef.current.setEditCellValue({