@mui/x-data-grid 8.10.2 → 8.11.1

package/hooks/features/rows/useGridRows.js

@@ -44,7 +44,7 @@ const rowsStateInitializer = (state, props, apiRef) => {
   });
 };
 exports.rowsStateInitializer = rowsStateInitializer;
-const useGridRows = (apiRef, props) => {
+const useGridRows = (apiRef, props, configuration) => {
   if (process.env.NODE_ENV !== 'production') {
     try {
       // Freeze the `rows` prop so developers have a fast failure if they try to use Array.prototype.push().
@@ -57,6 +57,11 @@ const useGridRows = (apiRef, props) => {
   const lastUpdateMs = React.useRef(Date.now());
   const lastRowCount = React.useRef(props.rowCount);
   const timeout = (0, _useTimeout.useTimeout)();
+
+  // Get overridable methods from configuration
+  const {
+    setRowIndex
+  } = configuration.hooks.useGridRowsOverridableMethods(apiRef, props);
   const getRow = React.useCallback(id => {
     const model = (0, _gridRowsSelector.gridRowsLookupSelector)(apiRef)[id];
     if (model) {
@@ -234,39 +239,6 @@ const useGridRows = (apiRef, props) => {
     }
     return children;
   }, [apiRef]);
-  const setRowIndex = React.useCallback((rowId, targetIndex) => {
-    const node = (0, _gridRowsSelector.gridRowNodeSelector)(apiRef, rowId);
-    if (!node) {
-      throw new Error(`MUI X: No row with id #${rowId} found.`);
-    }
-    if (node.parent !== _gridRowsUtils.GRID_ROOT_GROUP_ID) {
-      throw new Error(`MUI X: The row reordering do not support reordering of grouped rows yet.`);
-    }
-    if (node.type !== 'leaf') {
-      throw new Error(`MUI X: The row reordering do not support reordering of footer or grouping rows.`);
-    }
-    apiRef.current.setState(state => {
-      const group = (0, _gridRowsSelector.gridRowTreeSelector)(apiRef)[_gridRowsUtils.GRID_ROOT_GROUP_ID];
-      const allRows = group.children;
-      const oldIndex = allRows.findIndex(row => row === rowId);
-      if (oldIndex === -1 || oldIndex === targetIndex) {
-        return state;
-      }
-      logger.debug(`Moving row ${rowId} to index ${targetIndex}`);
-      const updatedRows = [...allRows];
-      updatedRows.splice(targetIndex, 0, updatedRows.splice(oldIndex, 1)[0]);
-      return (0, _extends2.default)({}, state, {
-        rows: (0, _extends2.default)({}, state.rows, {
-          tree: (0, _extends2.default)({}, state.rows.tree, {
-            [_gridRowsUtils.GRID_ROOT_GROUP_ID]: (0, _extends2.default)({}, group, {
-              children: updatedRows
-            })
-          })
-        })
-      });
-    });
-    apiRef.current.publishEvent('rowsSet');
-  }, [apiRef, logger]);
   const replaceRows = React.useCallback((firstRowToRender, newRows) => {
     if (props.signature === _signature.GridSignature.DataGrid && newRows.length > 1) {
       throw new Error(['MUI X: You cannot replace rows using `apiRef.current.unstable_replaceRows` on the DataGrid.', 'You need to upgrade to DataGridPro or DataGridPremium component to unlock this feature.'].join('\n'));

package/hooks/features/rows/useGridRowsOverridableMethods.d.ts

@@ -0,0 +1,6 @@
+import { RefObject } from '@mui/x-internals/types';
+import { GridRowId } from "../../../models/gridRows.js";
+import { GridPrivateApiCommunity } from "../../../models/api/gridApiCommunity.js";
+export declare const useGridRowsOverridableMethods: (apiRef: RefObject<GridPrivateApiCommunity>) => {
+  setRowIndex: (rowId: GridRowId, targetIndex: number) => void;
+};

package/hooks/features/rows/useGridRowsOverridableMethods.js

@@ -0,0 +1,52 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.useGridRowsOverridableMethods = void 0;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var React = _interopRequireWildcard(require("react"));
+var _gridRowsSelector = require("./gridRowsSelector");
+var _gridRowsUtils = require("./gridRowsUtils");
+const useGridRowsOverridableMethods = apiRef => {
+  const setRowIndex = React.useCallback((rowId, targetIndex) => {
+    const node = (0, _gridRowsSelector.gridRowNodeSelector)(apiRef, rowId);
+    if (!node) {
+      throw new Error(`MUI X: No row with id #${rowId} found.`);
+    }
+
+    // TODO: Remove irrelevant checks
+    if (node.parent !== _gridRowsUtils.GRID_ROOT_GROUP_ID) {
+      throw new Error(`MUI X: The row reordering do not support reordering of grouped rows yet.`);
+    }
+    if (node.type !== 'leaf') {
+      throw new Error(`MUI X: The row reordering do not support reordering of footer or grouping rows.`);
+    }
+    apiRef.current.setState(state => {
+      const group = (0, _gridRowsSelector.gridRowTreeSelector)(apiRef)[_gridRowsUtils.GRID_ROOT_GROUP_ID];
+      const allRows = group.children;
+      const oldIndex = allRows.findIndex(row => row === rowId);
+      if (oldIndex === -1 || oldIndex === targetIndex) {
+        return state;
+      }
+      const updatedRows = [...allRows];
+      updatedRows.splice(targetIndex, 0, updatedRows.splice(oldIndex, 1)[0]);
+      return (0, _extends2.default)({}, state, {
+        rows: (0, _extends2.default)({}, state.rows, {
+          tree: (0, _extends2.default)({}, state.rows.tree, {
+            [_gridRowsUtils.GRID_ROOT_GROUP_ID]: (0, _extends2.default)({}, group, {
+              children: updatedRows
+            })
+          })
+        })
+      });
+    });
+    apiRef.current.publishEvent('rowsSet');
+  }, [apiRef]);
+  return {
+    setRowIndex
+  };
+};
+exports.useGridRowsOverridableMethods = useGridRowsOverridableMethods;

package/hooks/features/scroll/useGridScroll.js

@@ -99,7 +99,7 @@ const useGridScroll = (apiRef, props) => {
       });
     }
     scrollCoordinates = apiRef.current.unstable_applyPipeProcessors('scrollToIndexes', scrollCoordinates, params);
-    if (typeof scrollCoordinates.left !== undefined || typeof scrollCoordinates.top !== undefined) {
+    if (typeof scrollCoordinates.left !== 'undefined' || typeof scrollCoordinates.top !== 'undefined') {
       apiRef.current.scroll(scrollCoordinates);
       return true;
     }

package/hooks/utils/useGridConfiguration.d.ts

@@ -1,2 +1,4 @@
 import { GridConfiguration } from "../../models/configuration/gridConfiguration.js";
-export declare const useGridConfiguration: () => GridConfiguration;
+import type { GridPrivateApiCommon } from "../../models/api/gridApiCommon.js";
+import type { GridPrivateApiCommunity } from "../../models/api/gridApiCommunity.js";
+export declare const useGridConfiguration: <Api extends GridPrivateApiCommon = GridPrivateApiCommunity>() => GridConfiguration<Api>;

package/index.js

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

package/internals/index.d.ts

@@ -41,7 +41,7 @@ export { useGridPrintExport } from "../hooks/features/export/useGridPrintExport.
 export { useGridFilter, filterStateInitializer } from "../hooks/features/filter/useGridFilter.js";
 export { defaultGridFilterLookup } from "../hooks/features/filter/gridFilterState.js";
 export { passFilterLogic } from "../hooks/features/filter/gridFilterUtils.js";
-export { gridFilteredChildrenCountLookupSelector, gridExpandedSortedRowTreeLevelPositionLookupSelector } from "../hooks/features/filter/gridFilterSelector.js";
+export { gridFilteredChildrenCountLookupSelector, gridExpandedSortedRowTreeLevelPositionLookupSelector, gridExpandedSortedRowIndexLookupSelector } from "../hooks/features/filter/gridFilterSelector.js";
 export { isSingleSelectColDef } from "../components/panel/filterPanel/filterPanelUtils.js";
 export type { GridAggregatedFilterItemApplier, GridAggregatedFilterItemApplierResult } from "../hooks/features/filter/gridFilterState.js";
 export { useGridFocus, focusStateInitializer } from "../hooks/features/focus/useGridFocus.js";
@@ -54,6 +54,7 @@ export { useGridRows, rowsStateInitializer } from "../hooks/features/rows/useGri
 export { useGridRowSpanning, rowSpanningStateInitializer } from "../hooks/features/rows/useGridRowSpanning.js";
 export { useGridAriaAttributes } from "../hooks/utils/useGridAriaAttributes.js";
 export { useGridRowAriaAttributes } from "../hooks/features/rows/useGridRowAriaAttributes.js";
+export { useGridRowsOverridableMethods } from "../hooks/features/rows/useGridRowsOverridableMethods.js";
 export { useGridRowsPreProcessors } from "../hooks/features/rows/useGridRowsPreProcessors.js";
 export type { GridRowTreeCreationParams, GridRowTreeCreationValue, GridHydrateRowsValue, GridRowsPartialUpdates, GridRowsPartialUpdateAction, GridTreeDepths, GridRowTreeUpdatedGroupsManager, GridRowTreeUpdateGroupAction, GridPinnedRowsState } from "../hooks/features/rows/gridRowsInterfaces.js";
 export { getTreeNodeDescendants, buildRootGroup } from "../hooks/features/rows/gridRowsUtils.js";

package/internals/index.js

@@ -46,6 +46,7 @@ var _exportNames = {
   passFilterLogic: true,
   gridFilteredChildrenCountLookupSelector: true,
   gridExpandedSortedRowTreeLevelPositionLookupSelector: true,
+  gridExpandedSortedRowIndexLookupSelector: true,
   useGridFocus: true,
   focusStateInitializer: true,
   useGridKeyboardNavigation: true,
@@ -62,6 +63,7 @@ var _exportNames = {
   rowSpanningStateInitializer: true,
   useGridAriaAttributes: true,
   useGridRowAriaAttributes: true,
+  useGridRowsOverridableMethods: true,
   useGridRowsPreProcessors: true,
   getTreeNodeDescendants: true,
   buildRootGroup: true,
@@ -391,6 +393,12 @@ Object.defineProperty(exports, "gridEditRowsStateSelector", {
     return _gridEditingSelectors.gridEditRowsStateSelector;
   }
 });
+Object.defineProperty(exports, "gridExpandedSortedRowIndexLookupSelector", {
+  enumerable: true,
+  get: function () {
+    return _gridFilterSelector.gridExpandedSortedRowIndexLookupSelector;
+  }
+});
 Object.defineProperty(exports, "gridExpandedSortedRowTreeLevelPositionLookupSelector", {
   enumerable: true,
   get: function () {
@@ -769,6 +777,12 @@ Object.defineProperty(exports, "useGridRowsMeta", {
     return _useGridRowsMeta.useGridRowsMeta;
   }
 });
+Object.defineProperty(exports, "useGridRowsOverridableMethods", {
+  enumerable: true,
+  get: function () {
+    return _useGridRowsOverridableMethods.useGridRowsOverridableMethods;
+  }
+});
 Object.defineProperty(exports, "useGridRowsPreProcessors", {
   enumerable: true,
   get: function () {
@@ -905,6 +919,7 @@ var _useGridRows = require("../hooks/features/rows/useGridRows");
 var _useGridRowSpanning = require("../hooks/features/rows/useGridRowSpanning");
 var _useGridAriaAttributes = require("../hooks/utils/useGridAriaAttributes");
 var _useGridRowAriaAttributes = require("../hooks/features/rows/useGridRowAriaAttributes");
+var _useGridRowsOverridableMethods = require("../hooks/features/rows/useGridRowsOverridableMethods");
 var _useGridRowsPreProcessors = require("../hooks/features/rows/useGridRowsPreProcessors");
 var _gridRowsUtils = require("../hooks/features/rows/gridRowsUtils");
 var _useGridRowsMeta = require("../hooks/features/rows/useGridRowsMeta");

package/material/index.js

@@ -50,6 +50,7 @@ var _InputLabel = _interopRequireDefault(require("@mui/material/InputLabel"));
 var _Skeleton = _interopRequireDefault(require("@mui/material/Skeleton"));
 var _forwardRef = require("@mui/x-internals/forwardRef");
 var _icons = require("./icons");
+var _GridColumnUnsortedIcon = require("../components/GridColumnUnsortedIcon");
 var _useGridApiContext = require("../hooks/utils/useGridApiContext");
 var _useGridRootProps = require("../hooks/utils/useGridRootProps");
 require("./augmentation");
@@ -676,6 +677,7 @@ const iconSlots = {
   filterPanelDeleteIcon: _icons.GridCloseIcon,
   columnFilteredIcon: _icons.GridFilterAltIcon,
   columnSelectorIcon: _icons.GridColumnIcon,
+  columnUnsortedIcon: _GridColumnUnsortedIcon.GridColumnUnsortedIcon,
   columnSortedAscendingIcon: _icons.GridArrowUpwardIcon,
   columnSortedDescendingIcon: _icons.GridArrowDownwardIcon,
   columnResizeIcon: _icons.GridSeparatorIcon,

package/models/api/gridParamsApi.d.ts

@@ -13,7 +13,7 @@ export interface GridParamsApi {
    * @param {string} field The column field.
    * @returns {v} The cell value.
    */
-  getCellValue: <V extends any = any>(id: GridRowId, field: string) => V;
+  getCellValue: <V = any>(id: GridRowId, field: string) => V;
   /**
    * Gets the cell value.
    * Use it instead of `getCellValue` for better performance if you have `row` and `colDef`.
@@ -23,7 +23,7 @@ export interface GridParamsApi {
    * @returns {v} The cell value.
    * @ignore - do not document
    */
-  getRowValue: <V extends any = any>(row: GridRowModel, colDef: GridColDef) => V;
+  getRowValue: <V = any>(row: GridRowModel, colDef: GridColDef) => V;
   /**
    * Gets the cell formatted value
    * Use it instead of `getCellParams` for better performance if you only need the formatted value.
@@ -33,7 +33,7 @@ export interface GridParamsApi {
    * @returns {v} The cell value.
    * @ignore - do not document
    */
-  getRowFormattedValue: <V extends any = any>(row: GridRowModel, colDef: GridColDef) => V;
+  getRowFormattedValue: <V = any>(row: GridRowModel, colDef: GridColDef) => V;
   /**
    * Gets the [[GridCellParams]] object that is passed as argument in events.
    * @param {GridRowId} id The id of the row.

package/models/colDef/gridColDef.d.ts

@@ -279,14 +279,16 @@ export interface GridSingleSelectColDef<R extends GridValidRowModel = any, V = a
    * Used to determine the label displayed for a given value option.
    * @param {ValueOptions} value The current value option.
    * @returns {string} The text to be displayed.
+   * @default {defaultGetOptionLabel}
    */
-  getOptionLabel?: (value: ValueOptions) => string;
+  getOptionLabel: (value: ValueOptions) => string;
   /**
    * Used to determine the value used for a value option.
    * @param {ValueOptions} value The current value option.
    * @returns {string} The value to be used.
+   * @default {defaultGetOptionValue}
    */
-  getOptionValue?: (value: ValueOptions) => any;
+  getOptionValue: (value: ValueOptions) => any;
 }
 /**
  * Column Definition interface.

package/models/configuration/gridConfiguration.d.ts

@@ -1,11 +1,13 @@
 import * as React from 'react';
-import { GridRowAriaAttributesInternalHook } from "./gridRowConfiguration.js";
+import { GridRowAriaAttributesInternalHook, GridRowsOverridableMethodsInternalHook } from "./gridRowConfiguration.js";
 import type { GridCSSVariablesInterface } from "../../constants/cssVariables.js";
 import type { GridRowId } from "../gridRows.js";
+import type { GridPrivateApiCommon } from "../api/gridApiCommon.js";
+import type { GridPrivateApiCommunity } from "../api/gridApiCommunity.js";
 export interface GridAriaAttributesInternalHook {
   useGridAriaAttributes: () => React.HTMLAttributes<HTMLElement>;
 }
-export interface GridInternalHook extends GridAriaAttributesInternalHook, GridRowAriaAttributesInternalHook {
+export interface GridInternalHook<Api> extends GridAriaAttributesInternalHook, GridRowAriaAttributesInternalHook, GridRowsOverridableMethodsInternalHook<Api> {
   useCSSVariables: () => {
     id: string;
     variables: GridCSSVariablesInterface;
@@ -15,6 +17,6 @@ export interface GridInternalHook extends GridAriaAttributesInternalHook, GridRo
     value: any;
   } | null;
 }
-export interface GridConfiguration {
-  hooks: GridInternalHook;
+export interface GridConfiguration<Api extends GridPrivateApiCommon = GridPrivateApiCommunity> {
+  hooks: GridInternalHook<Api>;
 }

package/models/configuration/gridRowConfiguration.d.ts

@@ -1,5 +1,7 @@
 import * as React from 'react';
-import { GridTreeNode } from "../gridRows.js";
+import { RefObject } from '@mui/x-internals/types';
+import { GridTreeNode, GridRowId } from "../gridRows.js";
+import { DataGridProcessedProps } from "../props/DataGridProps.js";
 /**
  * Get the ARIA attributes for a row
  * @param {GridTreeNode} rowNode The row node
@@ -9,4 +11,12 @@ import { GridTreeNode } from "../gridRows.js";
 export type GetRowAriaAttributesFn = (rowNode: GridTreeNode, index: number) => React.HTMLAttributes<HTMLElement>;
 export interface GridRowAriaAttributesInternalHook {
   useGridRowAriaAttributes: () => GetRowAriaAttributesFn;
+}
+/**
+ * Overridable row methods interface, these methods could be overriden in a higher plan package.
+ */
+export interface GridRowsOverridableMethodsInternalHook<Api> {
+  useGridRowsOverridableMethods: (apiRef: RefObject<Api>, props: Pick<DataGridProcessedProps, 'processRowUpdate' | 'onProcessRowUpdateError' | 'dataSource'>) => {
+    setRowIndex: (rowId: GridRowId, targetIndex: number) => void;
+  };
 }

package/models/gridIconSlotsComponent.d.ts

@@ -1,5 +1,6 @@
 import * as React from 'react';
 import { IconProps } from "./gridBaseSlots.js";
+import type { GridColumnUnsortedIconProps } from "../components/GridColumnUnsortedIcon.js";
 /**
  * Set of icons used in the grid component UI.
  */
@@ -34,6 +35,11 @@ export interface GridIconSlotsComponent {
    * @default GridColumnIcon
    */
   columnSelectorIcon: React.JSXElementConstructor<IconProps>;
+  /**
+   * Icon displayed on the side of the column header title when unsorted.
+   * @default GridColumnUnsortedIcon
+   */
+  columnUnsortedIcon: React.JSXElementConstructor<GridColumnUnsortedIconProps> | null;
   /**
    * Icon displayed on the side of the column header title when sorted in ascending order.
    * @default GridArrowUpwardIcon

package/models/props/DataGridProps.d.ts

@@ -787,7 +787,7 @@ export interface DataGridPropsWithoutDefaultValue<R extends GridValidRowModel =
     rowId: GridRowId;
   }) => Promise<R> | R;
   /**
-   * Callback called when `processRowUpdate` throws an error or rejects.
+   * Callback called when `processRowUpdate()` throws an error or rejects.
    * @param {any} error The error thrown.
    */
   onProcessRowUpdateError?: (error: any) => void;

package/package.json

@@ -1,9 +1,8 @@
 {
   "name": "@mui/x-data-grid",
-  "version": "8.10.2",
+  "version": "8.11.1",
   "author": "MUI Team",
   "description": "The Community plan edition of the MUI X Data Grid components.",
-  "main": "./index.js",
   "license": "MIT",
   "bugs": {
     "url": "https://github.com/mui/mui-x/issues"
@@ -43,8 +42,8 @@
     "clsx": "^2.1.1",
     "prop-types": "^15.8.1",
     "use-sync-external-store": "^1.5.0",
-    "@mui/x-internals": "8.10.2",
-    "@mui/x-virtualizer": "0.1.3"
+    "@mui/x-internals": "8.11.1",
+    "@mui/x-virtualizer": "0.1.5"
   },
   "peerDependencies": {
     "@emotion/react": "^11.9.0",
@@ -66,6 +65,7 @@
     "node": ">=14.0.0"
   },
   "type": "commonjs",
+  "main": "./index.js",
   "types": "./index.d.ts",
   "exports": {
     "./package.json": "./package.json",
@@ -74,7 +74,7 @@
         "types": "./index.d.ts",
         "default": "./index.js"
       },
-      "import": {
+      "default": {
         "types": "./esm/index.d.ts",
         "default": "./esm/index.js"
       }
@@ -84,7 +84,7 @@
         "types": "./*/index.d.ts",
         "default": "./*/index.js"
       },
-      "import": {
+      "default": {
         "types": "./esm/*/index.d.ts",
         "default": "./esm/*/index.js"
       }

package/utils/cleanupTracking/FinalizationRegistryBasedCleanupTracking.js

@@ -16,8 +16,6 @@ class FinalizationRegistryBasedCleanupTracking {
   unregister(unregisterToken) {
     this.registry.unregister(unregisterToken);
   }
-
-  // eslint-disable-next-line class-methods-use-this
   reset() {}
 }
 exports.FinalizationRegistryBasedCleanupTracking = FinalizationRegistryBasedCleanupTracking;