@mui/x-data-grid 8.0.0-alpha.3 → 8.0.0-alpha.4

package/CHANGELOG.md

@@ -5,6 +5,133 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 8.0.0-alpha.4
+
+_Dec 13, 2024_
+
+We'd like to offer a big thanks to the 11 contributors who made this release possible. Here are some highlights ✨:
+
+- 🌍 Improve Romanian locale on the Data Grid and Pickers
+- 📚 Documentation improvements
+- 🐞 Bugfixes
+
+Special thanks go out to the community contributors who have helped make this release possible:
+@k-rajat19, @nusr, @rares985, @zivl.
+Following are all team members who have contributed to this release:
+@alexfauquette, @arminmeh, @flaviendelangle, @JCQuintas, @KenanYusuf, @LukasTy, @MBilalShafi.
+
+<!--/ HIGHLIGHT_ABOVE_SEPARATOR /-->
+
+### Data Grid
+
+#### Breaking changes
+
+- The selectors signature has been updated due to the support of arguments in the selectors. Pass `undefined` as `arguments` if the selector doesn't use any arguments.
+
+  ```diff
+  -mySelector(state, instanceId)
+  +mySelector(state, arguments, instanceId)
+  ```
+
+- The `useGridSelector` signature has been updated due to the introduction of arguments parameter in the selectors. Pass `undefined` as `arguments` if the selector doesn't use any arguments.
+
+  ```diff
+  -const output = useGridSelector(apiRef, selector, equals)
+  +const output = useGridSelector(apiRef, selector, arguments, equals)
+  ```
+- The default variant for text fields and selects in the filter panel has been changed to `outlined`.
+- The "row spanning" feature is now stable.
+  ```diff
+   <DataGrid
+  -  unstable_rowSpanning
+  +  rowSpanning
+   />
+  ```
+- Selected row is now deselected when clicked again.
+
+#### `@mui/x-data-grid@8.0.0-alpha.4`
+
+- [DataGrid] Deselect selected row on click (#15509) @k-rajat19
+- [DataGrid] Fix "No rows" displaying when all rows are pinned (#15335) @nusr
+- [DataGrid] Make row spanning feature stable (#15742) @MBilalShafi
+- [DataGrid] Round dimensions to avoid subpixel rendering error (#15850) @KenanYusuf
+- [DataGrid] Toggle menu on click in `<GridActionsCell />` (#15867) @k-rajat19
+- [DataGrid] Trigger row spanning computation on rows update (#15858) @MBilalShafi
+- [DataGrid] Update filter panel input variant (#15807) @KenanYusuf
+- [DataGrid] Use `columnsManagement` slot (#15817) @k-rajat19
+- [DataGrid] Use new selector signature (#15200) @MBilalShafi
+- [l10n] Improve Romanian (ro-RO) locale (#15745) @rares985
+
+#### `@mui/x-data-grid-pro@8.0.0-alpha.4` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-data-grid@8.0.0-alpha.4`, plus:
+
+- [DataGridPro] Make row reordering work with pagination (#15355) @k-rajat19
+
+#### `@mui/x-data-grid-premium@8.0.0-alpha.4` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
+
+Same changes as in `@mui/x-data-grid-pro@8.0.0-alpha.4`, plus:
+
+- [DataGridPremium] Fix group column ignoring `valueOptions` for `singleSelect` column type (#15739) @arminmeh
+
+### Date and Time Pickers
+
+#### `@mui/x-date-pickers@8.0.0-alpha.4`
+
+- [l10n] Improve Romanian (ro-RO) locale (#15745) @rares985
+- [pickers] Clean `usePicker` logic (#15763) @flaviendelangle
+- [pickers] Rename layout `ownerState` property from `isRtl` to `layoutDirection` (#15803) @flaviendelangle
+- [pickers] Use the new `ownerState` in `useClearableField` (#15776) @flaviendelangle
+- [pickers] Use the new `ownerState` in the toolbar components (#15777) @flaviendelangle
+- [pickers] Use the new `ownerState` object for the clock components and the desktop / mobile wrappers (#15669) @flaviendelangle
+
+#### `@mui/x-date-pickers-pro@8.0.0-alpha.4` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-date-pickers@8.0.0-alpha.4`.
+
+### Charts
+
+#### Breaking changes
+
+- The default styling of the charts tooltip has been updated.
+
+#### `@mui/x-charts@8.0.0-alpha.4`
+
+- [charts] Fix hydration missmatch (#15647) @alexfauquette
+- [charts] Fix internal spelling typo (#15805) @zivl
+- [charts] Fix scatter dataset with missing data (#15802) @alexfauquette
+- [charts] HTML Labels (#15813) @JCQuintas
+- [charts] Only access store values by using hooks (#15764) @alexfauquette
+- [charts] Update Tooltip style (#15630) @alexfauquette
+
+#### `@mui/x-charts-pro@8.0.0-alpha.4` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-charts@8.0.0-alpha.4`.
+
+### Tree View
+
+#### `@mui/x-tree-view@8.0.0-alpha.4`
+
+No changes, releasing to keep the versions in sync.
+
+#### `@mui/x-tree-view-pro@8.0.0-alpha.4` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Releasing to benefit from license package fix (#15814).
+
+### Docs
+
+- [docs] Clean Joy and Browser custom field demos (#15707) @flaviendelangle
+- [docs] Fix outdated link to handbook (#15855) @oliviertassinari
+- [docs] Improve Pickers accessible DOM migration section description (#15596) @LukasTy
+- [docs] Use `updateRows` method for list view demos (#15732) @KenanYusuf
+- [docs] Use date library version from package dev dependencies for sandboxes (#15762) @LukasTy
+
+### Core
+
+- [code-infra] Add Charts sandbox generation (#15830) @JCQuintas
+- [code-infra] Remove redundant `@type/react-test-renderer` dep (#15766) @LukasTy
+- [license] Use `console.log` for the error message on Codesandbox to avoid rendering error (#15814) @arminmeh
+
 ## 8.0.0-alpha.3
 
 _Dec 5, 2024_
@@ -567,6 +694,153 @@ Same changes as in `@mui/x-charts@8.0.0-alpha.0`.
 - [release] v8 preparation (#15054) @michelengelen
 - [test] Fix advanced list view regression test snapshot (#15260) @KenanYusuf
 
+## 7.23.2
+
+_Dec 12, 2024_
+
+We'd like to offer a big thanks to the 11 contributors who made this release possible. Here are some highlights ✨:
+
+- 🌍 Improve Romanian and Turkish locales on the Data Grid
+- 🌍 Improve Romanian locale on the Pickers
+- 📚 Documentation improvements
+- 🐞 Bugfixes
+
+Special thanks go out to the community contributors who have helped make this release possible:
+@ihsanberkozcan, @k-rajat19, @lhilgert9, @nusr, @rares985.
+
+Following are all team members who have contributed to this release:
+@alexfauquette, @arminmeh, @flaviendelangle, @JCQuintas, @KenanYusuf, @LukasTy.
+
+<!--/ HIGHLIGHT_ABOVE_SEPARATOR /-->
+
+### Data Grid
+
+#### `@mui/x-data-grid@7.23.2`
+
+- [DataGrid] Fix "No rows" displaying when all rows are pinned (#15851) @nusr
+- [DataGrid] Use `columnsManagement` slot (#15821) @k-rajat19
+- [l10n] Improve Romanian (ro-RO) locale (#15751) @rares985
+- [l10n] Improve Turkish (tr-TR) locale (#15748) @ihsanberkozcan
+
+#### `@mui/x-data-grid-pro@7.23.2` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-data-grid@7.23.2`, plus:
+
+- [DataGridPro] Make Row reordering work with pagination (#15782) @k-rajat19
+
+#### `@mui/x-data-grid-premium@7.23.2` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
+
+Same changes as in `@mui/x-data-grid-pro@7.23.2`, plus:
+
+- [DataGridPremium] Fix group column ignoring `valueOptions` for `singleSelect` column type (#15754) @arminmeh
+
+### Date and Time Pickers
+
+#### `@mui/x-date-pickers@7.23.2`
+
+- [l10n] Improve Romanian (ro-RO) locale (#15751) @rares985
+
+#### `@mui/x-date-pickers-pro@7.23.2` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-date-pickers@7.23.2`.
+
+### Charts
+
+#### `@mui/x-charts@7.23.2`
+
+- [charts] Fix key generation for the ChartsGrid (#15864) @alexfauquette
+- [charts] Fix scatter dataset with missing data (#15804) @alexfauquette
+
+#### `@mui/x-charts-pro@7.23.2` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-charts@7.23.2`.
+
+#### `@mui/x-tree-view@v7.23.2`
+
+No changes, releasing to keep the versions in sync.
+
+#### `@mui/x-tree-view-pro@7.23.2` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Releasing to benefit from license package fix (#15818).
+
+### Docs
+
+- [docs] Fix typo in charts axis documentation (#15746) @JCQuintas
+- [docs] Improve Pickers accessible DOM structure description (#15752) @LukasTy
+- [docs] Use `updateRows` method for list view demos (#15824) @KenanYusuf
+- [docs] Use date library version from package dev dependencies for sandboxes (#15767) @LukasTy
+
+### Core
+
+- [core] Add `@mui/x-tree-view-pro` to `releaseChangelog` (#15747) @flaviendelangle
+- [license] Use `console.log` for the error message on Codesandbox to avoid rendering error (#15818) @arminmeh
+
+## 7.23.1
+
+_Dec 5, 2024_
+
+We'd like to offer a big thanks to the 7 contributors who made this release possible. Here are some highlights ✨:
+
+- 🌍 Improve German locale on the Data Grid component
+- 🐞 Bugfixes
+
+Special thanks go out to the community contributors who have helped make this release possible:
+@lhilgert9.
+
+Following are all team members who have contributed to this release:
+@arthurbalduini, @cherniavskii, @flaviendelangle, @JCQuintas, @LukasTy and @MBilalShafi.
+
+<!--/ HIGHLIGHT_ABOVE_SEPARATOR /-->
+
+### Data Grid
+
+#### `@mui/x-data-grid@7.23.1`
+
+- [DataGrid] Make column autosizing work with flex columns (#15712) @cherniavskii
+- [l10n] Improve German (de-DE) locale (#15641) @lhilgert9
+
+#### `@mui/x-data-grid-pro@7.23.1` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-data-grid@7.23.1`, plus:
+
+- [DataGridPro] Cleanup pinned rows on removal (#15702) @cherniavskii
+
+#### `@mui/x-data-grid-premium@7.23.1` [![premium](https://mui.com/r/x-premium-svg)](https://mui.com/r/x-premium-svg-link 'Premium plan')
+
+Same changes as in `@mui/x-data-grid-pro@7.23.1`.
+
+### Date and Time Pickers
+
+#### `@mui/x-date-pickers@7.23.1`
+
+- [TimePicker] Prevent mouse events after `touchend` event (#15430) @arthurbalduini
+
+#### `@mui/x-date-pickers-pro@7.23.1` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-date-pickers@7.23.1`.
+
+### Charts
+
+#### `@mui/x-charts@7.23.1`
+
+- [charts] Improve SVG `pattern` and `gradient` support (#15724) @JCQuintas
+
+#### `@mui/x-charts-pro@7.23.1` [![pro](https://mui.com/r/x-pro-svg)](https://mui.com/r/x-pro-svg-link 'Pro plan')
+
+Same changes as in `@mui/x-charts@7.23.1`.
+
+### Docs
+
+- [docs] Fix Pickers theme augmentation example (#15675) @LukasTy
+- [docs] Remove duplicated warning (#15715) @cherniavskii
+- [test] Force hover in headless Chrome (#15711) @cherniavskii
+- [docs-infra] Bump `@mui/internal-markdown` to support nested demo imports (#15738) @alexfauquette
+- [docs] Improve SEO titles for the Data Grid (#15695) @MBilalShafi
+
+### Core
+
+- [core] Add `@mui/x-tree-view-pro` to `releaseChangelog` (#15747) @flaviendelangle
+
 ## 7.23.0
 
 _Nov 29, 2024_

package/DataGrid/DataGrid.js

@@ -701,6 +701,11 @@ DataGridRaw.propTypes = {
    * @default "margin"
    */
   rowSpacingType: PropTypes.oneOf(['border', 'margin']),
+  /**
+   * If `true`, the Data Grid will auto span the cells over the rows having the same value.
+   * @default false
+   */
+  rowSpanning: PropTypes.bool,
   /**
    * Override the height/width of the Data Grid inner scrollbar.
    */
@@ -746,11 +751,6 @@ DataGridRaw.propTypes = {
    * The system prop that allows defining system overrides as well as additional CSS styles.
    */
   sx: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.func, PropTypes.object, PropTypes.bool])), PropTypes.func, PropTypes.object]),
-  /**
-   * If `true`, the Data Grid will auto span the cells over the rows having the same value.
-   * @default false
-   */
-  unstable_rowSpanning: PropTypes.bool,
   /**
    * If `true`, the Data Grid enables column virtualization when `getRowHeight` is set to `() => 'auto'`.
    * By default, column virtualization is disabled when dynamic row height is enabled to measure the row height correctly.

package/README.md

@@ -1,7 +1,7 @@
 # MUI X Data Grid
 
 This package is the Community plan edition of the Data Grid components.
-It's part of [MUI X](https://mui.com/x/), an open-core extension of MUI Core, with advanced components.
+It's part of [MUI X](https://mui.com/x/), an open-core extension of our Core libraries, with advanced components.
 
 ## Installation
 

package/components/GridRow.js

@@ -144,7 +144,7 @@ const GridRow = /*#__PURE__*/React.forwardRef(function GridRow(props, refProp) {
     disableColumnReorder
   } = rootProps;
   const rowReordering = rootProps.rowReordering;
-  const heightEntry = useGridSelector(apiRef, () => _extends({}, apiRef.current.getRowHeightEntry(rowId)), objectShallowCompare);
+  const heightEntry = useGridSelector(apiRef, () => _extends({}, apiRef.current.getRowHeightEntry(rowId)), undefined, objectShallowCompare);
   const style = React.useMemo(() => {
     if (isNotVisible) {
       return {

package/components/cell/GridActionsCell.js

@@ -89,6 +89,13 @@ function GridActionsCell(props) {
   const hideMenu = () => {
     setOpen(false);
   };
+  const toggleMenu = () => {
+    if (open) {
+      hideMenu();
+    } else {
+      showMenu();
+    }
+  };
   const handleTouchRippleRef = index => instance => {
     touchRippleRefs.current[index] = instance;
   };
@@ -159,7 +166,7 @@ function GridActionsCell(props) {
       "aria-controls": open ? menuId : undefined,
       role: "menuitem",
       size: "small",
-      onClick: showMenu,
+      onClick: toggleMenu,
       touchRippleRef: handleTouchRippleRef(buttonId),
       tabIndex: focusedButtonIndex === iconButtons.length ? tabIndex : -1
     }, rootProps.slotProps?.baseIconButton, {

package/components/cell/GridCell.js

@@ -120,7 +120,7 @@ const GridCell = /*#__PURE__*/React.forwardRef(function GridCell(props, ref) {
     const result = apiRef.current.getCellParams(rowId, field);
     result.api = apiRef.current;
     return result;
-  }, objectShallowCompare);
+  }, undefined, objectShallowCompare);
   const isSelected = useGridSelector(apiRef, () => apiRef.current.unstable_applyPipeProcessors('isCellSelected', false, {
     id: rowId,
     field

package/components/panel/GridColumnsPanel.js

@@ -2,13 +2,12 @@ import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import { GridPanelWrapper } from "./GridPanelWrapper.js";
-import { GridColumnsManagement } from "../columnsManagement/index.js";
 import { useGridRootProps } from "../../hooks/utils/useGridRootProps.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 function GridColumnsPanel(props) {
   const rootProps = useGridRootProps();
   return /*#__PURE__*/_jsx(GridPanelWrapper, _extends({}, props, {
-    children: /*#__PURE__*/_jsx(GridColumnsManagement, _extends({}, rootProps.slotProps?.columnsManagement))
+    children: /*#__PURE__*/_jsx(rootProps.slots.columnsManagement, _extends({}, rootProps.slotProps?.columnsManagement))
   }));
 }
 process.env.NODE_ENV !== "production" ? GridColumnsPanel.propTypes = {

package/components/panel/GridPanelContent.js

@@ -22,13 +22,17 @@ const GridPanelContentRoot = styled('div', {
   name: 'MuiDataGrid',
   slot: 'PanelContent',
   overridesResolver: (props, styles) => styles.panelContent
-})({
+})(({
+  theme
+}) => ({
   display: 'flex',
   flexDirection: 'column',
   overflow: 'auto',
   flex: '1 1',
-  maxHeight: 400
-});
+  maxHeight: 400,
+  padding: theme.spacing(2.5, 1.5, 2, 1),
+  gap: theme.spacing(2.5)
+}));
 function GridPanelContent(props) {
   const {
       className

package/components/panel/GridPanelFooter.d.ts

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { SxProps, Theme } from '@mui/system';
+import { SxProps, Theme } from '@mui/material/styles';
 declare function GridPanelFooter(props: React.HTMLAttributes<HTMLDivElement> & {
     sx?: SxProps<Theme>;
 }): React.JSX.Element;

package/components/panel/GridPanelFooter.js

@@ -4,7 +4,7 @@ const _excluded = ["className"];
 import * as React from 'react';
 import PropTypes from 'prop-types';
 import clsx from 'clsx';
-import { styled } from '@mui/system';
+import { styled } from '@mui/material/styles';
 import composeClasses from '@mui/utils/composeClasses';
 import { getDataGridUtilityClass } from "../../constants/gridClasses.js";
 import { useGridRootProps } from "../../hooks/utils/useGridRootProps.js";
@@ -25,9 +25,10 @@ const GridPanelFooterRoot = styled('div', {
 })(({
   theme
 }) => ({
-  padding: theme.spacing(0.5),
+  padding: theme.spacing(1),
   display: 'flex',
-  justifyContent: 'space-between'
+  justifyContent: 'space-between',
+  borderTop: `1px solid ${theme.palette.divider}`
 }));
 function GridPanelFooter(props) {
   const {

package/components/panel/filterPanel/GridFilterForm.js

@@ -39,27 +39,22 @@ const GridFilterFormRoot = styled('div', {
   theme
 }) => ({
   display: 'flex',
-  padding: theme.spacing(1)
+  gap: theme.spacing(1.5)
 }));
 const FilterFormDeleteIcon = styled('div', {
   name: 'MuiDataGrid',
   slot: 'FilterFormDeleteIcon',
   overridesResolver: (_, styles) => styles.filterFormDeleteIcon
-})(({
-  theme
-}) => ({
+})({
   flexShrink: 0,
-  justifyContent: 'flex-end',
-  marginRight: theme.spacing(0.5),
-  marginBottom: theme.spacing(0.2)
-}));
+  justifyContent: 'center'
+});
 const FilterFormLogicOperatorInput = styled('div', {
   name: 'MuiDataGrid',
   slot: 'FilterFormLogicOperatorInput',
   overridesResolver: (_, styles) => styles.filterFormLogicOperatorInput
 })({
-  minWidth: 55,
-  marginRight: 5,
+  minWidth: 75,
   justifyContent: 'end'
 });
 const FilterFormColumnInput = styled('div', {
@@ -261,7 +256,6 @@ const GridFilterForm = /*#__PURE__*/React.forwardRef(function GridFilterForm(pro
     ownerState: rootProps
   }, other, {
     children: [/*#__PURE__*/_jsx(FilterFormDeleteIcon, _extends({
-      variant: "standard",
       as: rootProps.slots.baseFormControl
     }, baseFormControlProps, deleteIconProps, {
       className: clsx(classes.deleteIcon, baseFormControlProps.className, deleteIconProps.className),
@@ -278,7 +272,8 @@ const GridFilterForm = /*#__PURE__*/React.forwardRef(function GridFilterForm(pro
         })
       }))
     })), /*#__PURE__*/_jsx(FilterFormLogicOperatorInput, _extends({
-      variant: "standard",
+      variant: "outlined",
+      size: "small",
       as: rootProps.slots.baseFormControl
     }, baseFormControlProps, logicOperatorInputProps, {
       sx: [hasLogicOperatorColumn ? {
@@ -308,7 +303,8 @@ const GridFilterForm = /*#__PURE__*/React.forwardRef(function GridFilterForm(pro
         }), apiRef.current.getLocaleText(getLogicOperatorLocaleKey(logicOperator))))
       }))
     })), /*#__PURE__*/_jsxs(FilterFormColumnInput, _extends({
-      variant: "standard",
+      variant: "outlined",
+      size: "small",
       as: rootProps.slots.baseFormControl
     }, baseFormControlProps, columnInputProps, {
       className: clsx(classes.columnInput, baseFormControlProps.className, columnInputProps.className),
@@ -333,7 +329,8 @@ const GridFilterForm = /*#__PURE__*/React.forwardRef(function GridFilterForm(pro
         }), getColumnLabel(col)))
       }))]
     })), /*#__PURE__*/_jsxs(FilterFormOperatorInput, _extends({
-      variant: "standard",
+      variant: "outlined",
+      size: "small",
       as: rootProps.slots.baseFormControl
     }, baseFormControlProps, operatorInputProps, {
       className: clsx(classes.operatorInput, baseFormControlProps.className, operatorInputProps.className),
@@ -359,12 +356,15 @@ const GridFilterForm = /*#__PURE__*/React.forwardRef(function GridFilterForm(pro
         }), operator.label || apiRef.current.getLocaleText(`filterOperator${capitalize(operator.value)}`)))
       }))]
     })), /*#__PURE__*/_jsx(FilterFormValueInput, _extends({
-      variant: "standard",
+      variant: "outlined",
+      size: "small",
       as: rootProps.slots.baseFormControl
     }, baseFormControlProps, valueInputPropsOther, {
       className: clsx(classes.valueInput, baseFormControlProps.className, valueInputPropsOther.className),
       ownerState: rootProps,
       children: currentOperator?.InputComponent ? /*#__PURE__*/_jsx(currentOperator.InputComponent, _extends({
+        variant: "outlined",
+        size: "small",
         apiRef: apiRef,
         item: item,
         applyValue: applyFilterChanges,

package/constants/dataGridPropsDefaultValues.js

@@ -48,11 +48,11 @@ export const DATA_GRID_PROPS_DEFAULT_VALUES = {
   rows: [],
   rowSelection: true,
   rowSpacingType: 'margin',
+  rowSpanning: false,
   showCellVerticalBorder: false,
   showColumnVerticalBorder: false,
   sortingMode: 'client',
   sortingOrder: ['asc', 'desc', null],
   throttleRowsMs: 0,
-  unstable_rowSpanning: false,
   virtualizeColumnsWithAutoRowHeight: false
 };

package/hooks/core/useGridStateInitialization.js

@@ -24,8 +24,8 @@ export const useGridStateInitialization = apiRef => {
     const updatedControlStateIds = [];
     Object.keys(controlStateMapRef.current).forEach(stateId => {
       const controlState = controlStateMapRef.current[stateId];
-      const oldSubState = controlState.stateSelector(apiRef.current.state, apiRef.current.instanceId);
-      const newSubState = controlState.stateSelector(newState, apiRef.current.instanceId);
+      const oldSubState = controlState.stateSelector(apiRef.current.state, undefined, apiRef.current.instanceId);
+      const newSubState = controlState.stateSelector(newState, undefined, apiRef.current.instanceId);
       if (newSubState === oldSubState) {
         return;
       }
@@ -57,7 +57,7 @@ export const useGridStateInitialization = apiRef => {
         hasPropChanged
       } = updatedControlStateIds[0];
       const controlState = controlStateMapRef.current[stateId];
-      const model = controlState.stateSelector(newState, apiRef.current.instanceId);
+      const model = controlState.stateSelector(newState, undefined, apiRef.current.instanceId);
       if (controlState.propOnChange && hasPropChanged) {
         controlState.propOnChange(model, {
           reason,

package/hooks/features/columnGrouping/gridColumnGroupsSelector.d.ts

@@ -4,9 +4,9 @@ import { GridStateCommunity } from '../../../models/gridStateCommunity';
  * @ignore - do not document.
  */
 export declare const gridColumnGroupingSelector: (state: GridStateCommunity) => import("./gridColumnGroupsInterfaces").GridColumnsGroupingState;
-export declare const gridColumnGroupsUnwrappedModelSelector: import("../../..").OutputSelector<GridStateCommunity, {
+export declare const gridColumnGroupsUnwrappedModelSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridColumnGroupsInterfaces").GridColumnsGroupingState, {
     [columnField: string]: string[];
 }>;
-export declare const gridColumnGroupsLookupSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridColumnGroupsInterfaces").GridColumnGroupLookup>;
-export declare const gridColumnGroupsHeaderStructureSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridColumnGroupsInterfaces").GridGroupingStructure[][]>;
-export declare const gridColumnGroupsHeaderMaxDepthSelector: import("../../..").OutputSelector<GridStateCommunity, number>;
+export declare const gridColumnGroupsLookupSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridColumnGroupsInterfaces").GridColumnsGroupingState, import("./gridColumnGroupsInterfaces").GridColumnGroupLookup>;
+export declare const gridColumnGroupsHeaderStructureSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridColumnGroupsInterfaces").GridColumnsGroupingState, import("./gridColumnGroupsInterfaces").GridGroupingStructure[][]>;
+export declare const gridColumnGroupsHeaderMaxDepthSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridColumnGroupsInterfaces").GridColumnsGroupingState, number>;

package/hooks/features/columnResize/columnResizeSelector.d.ts

@@ -1,3 +1,3 @@
 import { GridStateCommunity } from '../../../models/gridStateCommunity';
 export declare const gridColumnResizeSelector: (state: GridStateCommunity) => import("./columnResizeState").GridColumnResizeState;
-export declare const gridResizingColumnFieldSelector: import("../../..").OutputSelector<GridStateCommunity, string>;
+export declare const gridResizingColumnFieldSelector: import("../../..").OutputSelector<GridStateCommunity, import("./columnResizeState").GridColumnResizeState, string>;

package/hooks/features/columns/gridColumnsSelector.d.ts

@@ -9,33 +9,33 @@ export declare const gridColumnsStateSelector: (state: GridStateCommunity) => im
  * Get an array of column fields in the order rendered on screen.
  * @category Columns
  */
-export declare const gridColumnFieldsSelector: import("../../..").OutputSelector<GridStateCommunity, string[]>;
+export declare const gridColumnFieldsSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridColumnsInterfaces").GridColumnsState, string[]>;
 /**
  * Get the columns as a lookup (an object containing the field for keys and the definition for values).
  * @category Columns
  */
-export declare const gridColumnLookupSelector: import("../../..").OutputSelector<GridStateCommunity, GridColumnLookup>;
+export declare const gridColumnLookupSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridColumnsInterfaces").GridColumnsState, GridColumnLookup>;
 /**
  * Get an array of column definitions in the order rendered on screen..
  * @category Columns
  */
-export declare const gridColumnDefinitionsSelector: import("../../..").OutputSelector<GridStateCommunity, import("../../../internals").GridStateColDef[]>;
+export declare const gridColumnDefinitionsSelector: import("../../..").OutputSelector<GridStateCommunity, GridColumnLookup, import("../../../internals").GridStateColDef[]>;
 /**
  * Get the column visibility model, containing the visibility status of each column.
  * If a column is not registered in the model, it is visible.
  * @category Visible Columns
  */
-export declare const gridColumnVisibilityModelSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridColumnsInterfaces").GridColumnVisibilityModel>;
+export declare const gridColumnVisibilityModelSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridColumnsInterfaces").GridColumnsState, import("./gridColumnsInterfaces").GridColumnVisibilityModel>;
 /**
  * Get the visible columns as a lookup (an object containing the field for keys and the definition for values).
  * @category Visible Columns
  */
-export declare const gridVisibleColumnDefinitionsSelector: import("../../..").OutputSelector<GridStateCommunity, import("../../../internals").GridStateColDef[]>;
+export declare const gridVisibleColumnDefinitionsSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridColumnsInterfaces").GridColumnVisibilityModel, import("../../../internals").GridStateColDef[]>;
 /**
  * Get the field of each visible column.
  * @category Visible Columns
  */
-export declare const gridVisibleColumnFieldsSelector: import("../../..").OutputSelector<GridStateCommunity, string[]>;
+export declare const gridVisibleColumnFieldsSelector: import("../../..").OutputSelector<GridStateCommunity, import("../../../internals").GridStateColDef[], string[]>;
 /**
  * Get the visible pinned columns model.
  * @category Visible Columns
@@ -45,7 +45,7 @@ export declare const gridPinnedColumnsSelector: (state: GridStateCommunity) => G
  * Get the visible pinned columns.
  * @category Visible Columns
  */
-export declare const gridVisiblePinnedColumnDefinitionsSelector: import("../../..").OutputSelector<GridStateCommunity, {
+export declare const gridVisiblePinnedColumnDefinitionsSelector: import("../../..").OutputSelector<GridStateCommunity, boolean, {
     left: import("../../../internals").GridStateColDef[];
     right: import("../../../internals").GridStateColDef[];
 }>;
@@ -53,25 +53,25 @@ export declare const gridVisiblePinnedColumnDefinitionsSelector: import("../../.
  * Get the left position in pixel of each visible columns relative to the left of the first column.
  * @category Visible Columns
  */
-export declare const gridColumnPositionsSelector: import("../../..").OutputSelector<GridStateCommunity, number[]>;
+export declare const gridColumnPositionsSelector: import("../../..").OutputSelector<GridStateCommunity, import("../../../internals").GridStateColDef[], number[]>;
 /**
  * Get the summed width of all the visible columns.
  * @category Visible Columns
  */
-export declare const gridColumnsTotalWidthSelector: import("../../..").OutputSelector<GridStateCommunity, number>;
+export declare const gridColumnsTotalWidthSelector: import("../../..").OutputSelector<GridStateCommunity, number[], number>;
 /**
  * Get the filterable columns as an array.
  * @category Columns
  */
-export declare const gridFilterableColumnDefinitionsSelector: import("../../..").OutputSelector<GridStateCommunity, import("../../../internals").GridStateColDef[]>;
+export declare const gridFilterableColumnDefinitionsSelector: import("../../..").OutputSelector<GridStateCommunity, import("../../../internals").GridStateColDef[], import("../../../internals").GridStateColDef[]>;
 /**
  * Get the filterable columns as a lookup (an object containing the field for keys and the definition for values).
  * @category Columns
  */
-export declare const gridFilterableColumnLookupSelector: import("../../..").OutputSelector<GridStateCommunity, GridColumnLookup>;
+export declare const gridFilterableColumnLookupSelector: import("../../..").OutputSelector<GridStateCommunity, import("../../../internals").GridStateColDef[], GridColumnLookup>;
 /**
  * Checks if some column has a colSpan field.
  * @category Columns
  * @ignore - Do not document
  */
-export declare const gridHasColSpanSelector: import("../../..").OutputSelector<GridStateCommunity, boolean>;
+export declare const gridHasColSpanSelector: import("../../..").OutputSelector<GridStateCommunity, import("../../../internals").GridStateColDef[], boolean>;