@mui/x-data-grid 7.1.1 → 7.2.0

package/node/hooks/features/columnHeaders/useGridColumnHeaders.js

@@ -7,6 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.useGridColumnHeaders = exports.GridColumnHeaderRow = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
+var _clsx = _interopRequireDefault(require("clsx"));
 var _styles = require("@mui/material/styles");
 var _utils = require("../../utils");
 var _useGridRootProps = require("../../utils/useGridRootProps");
@@ -59,6 +60,7 @@ const useGridColumnHeaders = props => {
   const renderContext = (0, _utils.useGridSelector)(apiRef, _virtualization.gridRenderContextColumnsSelector);
   const pinnedColumns = (0, _utils.useGridSelector)(apiRef, _columns.gridVisiblePinnedColumnDefinitionsSelector);
   const offsetLeft = (0, _useGridVirtualScroller.computeOffsetLeft)(columnPositions, renderContext, theme.direction, pinnedColumns.left.length);
+  const gridHasFiller = dimensions.columnsTotalWidth < dimensions.viewportOuterSize.width;
   React.useEffect(() => {
     apiRef.current.columnHeadersContainerRef.current.scrollLeft = 0;
   }, [apiRef]);
@@ -112,7 +114,7 @@ const useGridColumnHeaders = props => {
         }
       }), children, isNotPinned && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
         role: "presentation",
-        className: _gridClasses.gridClasses.filler
+        className: (0, _clsx.default)(_gridClasses.gridClasses.filler, borderTop && _gridClasses.gridClasses['filler--borderTop'])
       }), hasScrollbarFiller && /*#__PURE__*/(0, _jsxRuntime.jsx)(_GridScrollbarFillerCell.GridScrollbarFillerCell, {
         header: true,
         borderTop: borderTop,
@@ -173,7 +175,8 @@ const useGridColumnHeaders = props => {
         pinnedPosition: pinnedPosition,
         style: style,
         indexInSection: i,
-        sectionLength: renderedColumns.length
+        sectionLength: renderedColumns.length,
+        gridHasFiller: gridHasFiller
       }, other), colDef.field));
     }
     return getFillers(params, columns, 0);
@@ -283,7 +286,8 @@ const useGridColumnHeaders = props => {
         pinnedPosition: pinnedPosition,
         style: style,
         indexInSection: indexInSection,
-        sectionLength: renderedColumns.length
+        sectionLength: renderedColumns.length,
+        gridHasFiller: gridHasFiller
       }, index);
     });
     return getFillers(params, children, leftOverflow);

package/node/hooks/features/editing/useGridCellEditing.js

@@ -177,7 +177,9 @@ const useGridCellEditing = (apiRef, props) => {
   const updateCellModesModel = (0, _utils.unstable_useEventCallback)(newModel => {
     const isNewModelDifferentFromProp = newModel !== props.cellModesModel;
     if (onCellModesModelChange && isNewModelDifferentFromProp) {
-      onCellModesModelChange(newModel, {});
+      onCellModesModelChange(newModel, {
+        api: apiRef.current
+      });
     }
     if (props.cellModesModel && isNewModelDifferentFromProp) {
       return; // The prop always win

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

@@ -251,7 +251,9 @@ const useGridRowEditing = (apiRef, props) => {
   const updateRowModesModel = (0, _utils.unstable_useEventCallback)(newModel => {
     const isNewModelDifferentFromProp = newModel !== props.rowModesModel;
     if (onRowModesModelChange && isNewModelDifferentFromProp) {
-      onRowModesModelChange(newModel, {});
+      onRowModesModelChange(newModel, {
+        api: apiRef.current
+      });
     }
     if (props.rowModesModel && isNewModelDifferentFromProp) {
       return; // The prop always win

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

@@ -9,12 +9,13 @@ var _colDef = require("../../../../colDef");
 var _warning = require("../../../../utils/warning");
 function sanitizeCellValue(value, delimiterCharacter, shouldAppendQuotes) {
   if (typeof value === 'string') {
-    // Make sure value containing delimiter or line break won't be split into multiple rows
-    if ([delimiterCharacter, '\n', '\r', '"'].some(delimiter => value.includes(delimiter))) {
-      if (shouldAppendQuotes) {
-        return `"${value.replace(/"/g, '""')}"`;
+    if (shouldAppendQuotes) {
+      const escapedValue = value.replace(/"/g, '""');
+      // Make sure value containing delimiter or line break won't be split into multiple rows
+      if ([delimiterCharacter, '\n', '\r', '"'].some(delimiter => value.includes(delimiter))) {
+        return `"${escapedValue}"`;
       }
-      return `${value.replace(/"/g, '""')}`;
+      return escapedValue;
     }
     return value;
   }

package/node/index.js

@@ -1,5 +1,5 @@
 /**
- * @mui/x-data-grid v7.1.1
+ * @mui/x-data-grid v7.2.0
  *
  * @license MIT
  * This source code is licensed under the MIT license found in the

package/node/locales/deDE.js

@@ -36,10 +36,9 @@ const deDEGrid = {
   toolbarExportPrint: 'Drucken',
   toolbarExportExcel: 'Download als Excel',
   // Columns management text
-  // columnsManagementSearchTitle: 'Search',
-  // columnsManagementNoColumns: 'No columns',
-  // columnsManagementShowHideAllText: 'Show/Hide All',
-
+  columnsManagementSearchTitle: 'Suche',
+  columnsManagementNoColumns: 'Keine Spalten',
+  columnsManagementShowHideAllText: 'Alle anzeigen/verbergen',
   // Filter panel text
   filterPanelAddFilter: 'Filter hinzufügen',
   filterPanelRemoveAll: 'Alle entfernen',

package/node/locales/frFR.js

@@ -22,7 +22,7 @@ const frFRGrid = {
   // Filters toolbar button text
   toolbarFilters: 'Filtres',
   toolbarFiltersLabel: 'Afficher les filtres',
-  toolbarFiltersTooltipHide: 'Cacher les filtres',
+  toolbarFiltersTooltipHide: 'Masquer les filtres',
   toolbarFiltersTooltipShow: 'Afficher les filtres',
   toolbarFiltersTooltipActive: count => count > 1 ? `${count} filtres actifs` : `${count} filtre actif`,
   // Quick filter toolbar field
@@ -36,10 +36,9 @@ const frFRGrid = {
   toolbarExportPrint: 'Imprimer',
   toolbarExportExcel: 'Télécharger pour Excel',
   // Columns management text
-  // columnsManagementSearchTitle: 'Search',
-  // columnsManagementNoColumns: 'No columns',
-  // columnsManagementShowHideAllText: 'Show/Hide All',
-
+  columnsManagementSearchTitle: 'Rechercher',
+  columnsManagementNoColumns: 'Pas de colonnes',
+  columnsManagementShowHideAllText: 'Afficher/masquer toutes',
   // Filter panel text
   filterPanelAddFilter: 'Ajouter un filtre',
   filterPanelRemoveAll: 'Tout supprimer',
@@ -100,7 +99,7 @@ const frFRGrid = {
   columnMenuShowColumns: 'Afficher les colonnes',
   columnMenuManageColumns: 'Gérer les colonnes',
   columnMenuFilter: 'Filtrer',
-  columnMenuHideColumn: 'Cacher',
+  columnMenuHideColumn: 'Masquer',
   columnMenuUnsort: 'Annuler le tri',
   columnMenuSortAsc: 'Tri ascendant',
   columnMenuSortDesc: 'Tri descendant',

package/node/locales/svSE.js

@@ -36,10 +36,9 @@ const svSEGrid = {
   toolbarExportPrint: 'Skriv ut',
   toolbarExportExcel: 'Ladda ner som Excel',
   // Columns management text
-  // columnsManagementSearchTitle: 'Search',
-  // columnsManagementNoColumns: 'No columns',
-  // columnsManagementShowHideAllText: 'Show/Hide All',
-
+  columnsManagementSearchTitle: 'Sök',
+  columnsManagementNoColumns: 'Inga kolumner',
+  columnsManagementShowHideAllText: 'Visa/Dölj alla',
   // Filter panel text
   filterPanelAddFilter: 'Lägg till filter',
   filterPanelRemoveAll: 'Ta bort alla',

package/node/utils/cellBorderUtils.js

@@ -5,9 +5,22 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.shouldCellShowRightBorder = exports.shouldCellShowLeftBorder = void 0;
 var _gridColumnsInterfaces = require("../hooks/features/columns/gridColumnsInterfaces");
-const shouldCellShowRightBorder = (pinnedPosition, indexInSection, sectionLength, showCellVerticalBorderRootProp) => {
+const shouldCellShowRightBorder = (pinnedPosition, indexInSection, sectionLength, showCellVerticalBorderRootProp, gridHasFiller) => {
   const isSectionLastCell = indexInSection === sectionLength - 1;
-  return showCellVerticalBorderRootProp && (pinnedPosition !== _gridColumnsInterfaces.GridPinnedColumnPosition.LEFT ? !isSectionLastCell : true) || pinnedPosition === _gridColumnsInterfaces.GridPinnedColumnPosition.LEFT && isSectionLastCell;
+  if (pinnedPosition === _gridColumnsInterfaces.GridPinnedColumnPosition.LEFT && isSectionLastCell) {
+    return true;
+  }
+  if (showCellVerticalBorderRootProp) {
+    if (pinnedPosition === _gridColumnsInterfaces.GridPinnedColumnPosition.LEFT) {
+      return true;
+    }
+    if (pinnedPosition === _gridColumnsInterfaces.GridPinnedColumnPosition.RIGHT) {
+      return !isSectionLastCell;
+    }
+    // pinnedPosition === undefined, middle section
+    return !isSectionLastCell || gridHasFiller;
+  }
+  return false;
 };
 exports.shouldCellShowRightBorder = shouldCellShowRightBorder;
 const shouldCellShowLeftBorder = (pinnedPosition, indexInSection) => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mui/x-data-grid",
-  "version": "7.1.1",
+  "version": "7.2.0",
   "description": "The Community plan edition of the Data Grid components (MUI X).",
   "author": "MUI Team",
   "main": "./node/index.js",

package/themeAugmentation/overrides.d.ts

@@ -5,4 +5,10 @@ export interface DataGridComponentNameToClassKey {
 declare module '@mui/material/styles' {
     interface ComponentNameToClassKey extends DataGridComponentNameToClassKey {
     }
+    interface Mixins {
+        MuiDataGrid?: {
+            containerBackground?: string;
+            pinnedBackground?: string;
+        };
+    }
 }

package/utils/cellBorderUtils.d.ts

@@ -1,3 +1,3 @@
 import { GridPinnedColumnPosition } from '../hooks/features/columns/gridColumnsInterfaces';
-export declare const shouldCellShowRightBorder: (pinnedPosition: GridPinnedColumnPosition | undefined, indexInSection: number, sectionLength: number, showCellVerticalBorderRootProp: boolean) => boolean;
+export declare const shouldCellShowRightBorder: (pinnedPosition: GridPinnedColumnPosition | undefined, indexInSection: number, sectionLength: number, showCellVerticalBorderRootProp: boolean, gridHasFiller: boolean) => boolean;
 export declare const shouldCellShowLeftBorder: (pinnedPosition: GridPinnedColumnPosition | undefined, indexInSection: number) => boolean;

package/utils/cellBorderUtils.js

@@ -1,7 +1,20 @@
 import { GridPinnedColumnPosition } from '../hooks/features/columns/gridColumnsInterfaces';
-export const shouldCellShowRightBorder = (pinnedPosition, indexInSection, sectionLength, showCellVerticalBorderRootProp) => {
+export const shouldCellShowRightBorder = (pinnedPosition, indexInSection, sectionLength, showCellVerticalBorderRootProp, gridHasFiller) => {
   const isSectionLastCell = indexInSection === sectionLength - 1;
-  return showCellVerticalBorderRootProp && (pinnedPosition !== GridPinnedColumnPosition.LEFT ? !isSectionLastCell : true) || pinnedPosition === GridPinnedColumnPosition.LEFT && isSectionLastCell;
+  if (pinnedPosition === GridPinnedColumnPosition.LEFT && isSectionLastCell) {
+    return true;
+  }
+  if (showCellVerticalBorderRootProp) {
+    if (pinnedPosition === GridPinnedColumnPosition.LEFT) {
+      return true;
+    }
+    if (pinnedPosition === GridPinnedColumnPosition.RIGHT) {
+      return !isSectionLastCell;
+    }
+    // pinnedPosition === undefined, middle section
+    return !isSectionLastCell || gridHasFiller;
+  }
+  return false;
 };
 export const shouldCellShowLeftBorder = (pinnedPosition, indexInSection) => {
   return pinnedPosition === GridPinnedColumnPosition.RIGHT && indexInSection === 0;