@mui/x-data-grid 8.0.0-alpha.12 → 8.0.0-alpha.14

package/esm/utils/css/context.js

@@ -0,0 +1,54 @@
+import * as React from 'react';
+import { useGridConfiguration } from "../../hooks/utils/useGridConfiguration.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+const CLASSNAME_PREFIX = 'MuiDataGridVariables';
+const CSSVariablesContext = /*#__PURE__*/React.createContext({
+  className: 'unset',
+  tag: /*#__PURE__*/_jsx("style", {
+    href: "/unset"
+  })
+});
+export function useCSSVariablesClass() {
+  return React.useContext(CSSVariablesContext).className;
+}
+export function useCSSVariablesContext() {
+  return React.useContext(CSSVariablesContext);
+}
+export function GridPortalWrapper({
+  children
+}) {
+  const className = useCSSVariablesClass();
+  return /*#__PURE__*/_jsx("div", {
+    className: className,
+    children: children
+  });
+}
+export function GridCSSVariablesContext(props) {
+  const config = useGridConfiguration();
+  const description = config.hooks.useCSSVariables();
+  const context = React.useMemo(() => {
+    const className = `${CLASSNAME_PREFIX}-${description.id}`;
+    const cssString = `.${className}{${variablesToString(description.variables)}}`;
+    const tag = /*#__PURE__*/_jsx("style", {
+      href: `/${className}`,
+      children: cssString
+    });
+    return {
+      className,
+      tag
+    };
+  }, [description]);
+  return /*#__PURE__*/_jsx(CSSVariablesContext.Provider, {
+    value: context,
+    children: props.children
+  });
+}
+function variablesToString(variables) {
+  let output = '';
+  for (const key in variables) {
+    if (Object.hasOwn(variables, key)) {
+      output += `${key}:${variables[key]};`;
+    }
+  }
+  return output;
+}

package/esm/utils/index.d.ts

@@ -1 +1,2 @@
-export type { OutputSelector } from './createSelector';
+export type { OutputSelector } from './createSelector';
+export { GridPortalWrapper } from "./css/context.js";

package/esm/utils/index.js

@@ -1 +1 @@
-export {};
+export { GridPortalWrapper } from "./css/context.js";

package/hooks/features/clipboard/useGridClipboard.js

@@ -10,6 +10,7 @@ var _utils = require("../../utils");
 var _gridFocusStateSelector = require("../focus/gridFocusStateSelector");
 var _csvSerializer = require("../export/serializers/csvSerializer");
 var _keyboardUtils = require("../../../utils/keyboardUtils");
+var _rowSelection = require("../rowSelection");
 function writeToClipboardPolyfill(data) {
   const span = document.createElement('span');
   span.style.whiteSpace = 'pre';
@@ -70,8 +71,8 @@ const useGridClipboard = (apiRef, props) => {
       return;
     }
     let textToCopy = '';
-    const selectedRows = apiRef.current.getSelectedRows();
-    if (selectedRows.size > 0) {
+    const selectedRowsCount = (0, _rowSelection.gridRowSelectionCountSelector)(apiRef);
+    if (selectedRowsCount > 0) {
       textToCopy = apiRef.current.getDataAsCsv({
         includeHeaders: false,
         delimiter: clipboardCopyCellDelimiter,

package/hooks/features/columnHeaders/useGridColumnHeaders.js

@@ -143,7 +143,7 @@ const useGridColumnHeaders = props => {
       const indexInSection = i;
       const sectionLength = renderedColumns.length;
       const showLeftBorder = (0, _cellBorderUtils.shouldCellShowLeftBorder)(pinnedPosition, indexInSection);
-      const showRightBorder = (0, _cellBorderUtils.shouldCellShowRightBorder)(pinnedPosition, indexInSection, sectionLength, rootProps.showCellVerticalBorder, gridHasFiller);
+      const showRightBorder = (0, _cellBorderUtils.shouldCellShowRightBorder)(pinnedPosition, indexInSection, sectionLength, rootProps.showColumnVerticalBorder, gridHasFiller);
       columns.push(/*#__PURE__*/(0, _jsxRuntime.jsx)(_GridColumnHeaderItem.GridColumnHeaderItem, (0, _extends2.default)({}, sortColumnLookup[colDef.field], {
         columnMenuOpen: open,
         filterItemsCounter: filterColumnLookup[colDef.field] && filterColumnLookup[colDef.field].length,
@@ -263,7 +263,7 @@ const useGridColumnHeaders = props => {
         pinnedPosition: pinnedPosition,
         pinnedOffset: pinnedOffset,
         showLeftBorder: (0, _cellBorderUtils.shouldCellShowLeftBorder)(pinnedPosition, indexInSection),
-        showRightBorder: (0, _cellBorderUtils.shouldCellShowRightBorder)(pinnedPosition, indexInSection, visibleColumnGroupHeader.length, rootProps.showCellVerticalBorder, gridHasFiller)
+        showRightBorder: (0, _cellBorderUtils.shouldCellShowRightBorder)(pinnedPosition, indexInSection, visibleColumnGroupHeader.length, rootProps.showColumnVerticalBorder, gridHasFiller)
       }, index);
     });
     return getFillers(params, children, leftOverflow);

package/hooks/features/columnResize/useGridColumnResize.js

@@ -8,16 +8,17 @@ Object.defineProperty(exports, "__esModule", {
 exports.useGridColumnResize = exports.columnResizeStateInitializer = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var React = _interopRequireWildcard(require("react"));
-var _utils = require("@mui/utils");
+var _useEventCallback = _interopRequireDefault(require("@mui/utils/useEventCallback"));
+var _ownerDocument = _interopRequireDefault(require("@mui/utils/ownerDocument"));
 var _useLazyRef = _interopRequireDefault(require("@mui/utils/useLazyRef"));
 var _RtlProvider = require("@mui/system/RtlProvider");
 var _domUtils = require("../../../utils/domUtils");
 var _gridColumnResizeApi = require("./gridColumnResizeApi");
 var _gridClasses = require("../../../constants/gridClasses");
-var _utils2 = require("../../utils");
+var _utils = require("../../utils");
 var _virtualization = require("../virtualization");
 var _createControllablePromise = require("../../../utils/createControllablePromise");
-var _utils3 = require("../../../utils/utils");
+var _utils2 = require("../../../utils/utils");
 var _useTimeout = require("../../utils/useTimeout");
 var _gridColumnsInterfaces = require("../columns/gridColumnsInterfaces");
 var _columns = require("../columns");
@@ -80,7 +81,7 @@ function preventClick(event) {
 function useColumnVirtualizationDisabled(apiRef) {
   const promise = React.useRef(undefined);
   const selector = () => (0, _virtualization.gridVirtualizationColumnEnabledSelector)(apiRef);
-  const value = (0, _utils2.useGridSelector)(apiRef, selector);
+  const value = (0, _utils.useGridSelector)(apiRef, selector);
   React.useEffect(() => {
     if (promise.current && value === false) {
       promise.current.resolve();
@@ -151,7 +152,7 @@ function extractColumnWidths(apiRef, options, columns) {
     const min = hasColumnMin ? column.minWidth : 0;
     const max = hasColumnMax ? column.maxWidth : Infinity;
     const maxContent = filteredWidths.length === 0 ? 0 : Math.max(...filteredWidths);
-    widthByField[column.field] = (0, _utils3.clamp)(maxContent, min, max);
+    widthByField[column.field] = (0, _utils2.clamp)(maxContent, min, max);
   });
   root.classList.remove(_gridClasses.gridClasses.autosizing);
   return widthByField;
@@ -187,7 +188,7 @@ function createResizeRefs() {
  */
 const useGridColumnResize = (apiRef, props) => {
   const isRtl = (0, _RtlProvider.useRtl)();
-  const logger = (0, _utils2.useGridLogger)(apiRef, 'useGridColumnResize');
+  const logger = (0, _utils.useGridLogger)(apiRef, 'useGridColumnResize');
   const refs = (0, _useLazyRef.default)(createResizeRefs).current;
 
   // To improve accessibility, the separator has padding on both sides.
@@ -323,15 +324,15 @@ const useGridColumnResize = (apiRef, props) => {
     resizeDirection.current = getResizeDirection(separator, isRtl);
     initialOffsetToSeparator.current = computeOffsetToSeparator(xStart, refs.columnHeaderElement.getBoundingClientRect(), resizeDirection.current);
   };
-  const handleResizeMouseUp = (0, _utils.unstable_useEventCallback)(finishResize);
-  const handleResizeMouseMove = (0, _utils.unstable_useEventCallback)(nativeEvent => {
+  const handleResizeMouseUp = (0, _useEventCallback.default)(finishResize);
+  const handleResizeMouseMove = (0, _useEventCallback.default)(nativeEvent => {
     // Cancel move in case some other element consumed a mouseup event and it was not fired.
     if (nativeEvent.buttons === 0) {
       handleResizeMouseUp(nativeEvent);
       return;
     }
     let newWidth = computeNewWidth(initialOffsetToSeparator.current, nativeEvent.clientX, refs.columnHeaderElement.getBoundingClientRect(), resizeDirection.current);
-    newWidth = (0, _utils3.clamp)(newWidth, refs.colDef.minWidth, refs.colDef.maxWidth);
+    newWidth = (0, _utils2.clamp)(newWidth, refs.colDef.minWidth, refs.colDef.maxWidth);
     updateWidth(newWidth);
     const params = {
       element: refs.columnHeaderElement,
@@ -340,14 +341,14 @@ const useGridColumnResize = (apiRef, props) => {
     };
     apiRef.current.publishEvent('columnResize', params, nativeEvent);
   });
-  const handleTouchEnd = (0, _utils.unstable_useEventCallback)(nativeEvent => {
+  const handleTouchEnd = (0, _useEventCallback.default)(nativeEvent => {
     const finger = trackFinger(nativeEvent, touchId.current);
     if (!finger) {
       return;
     }
     finishResize(nativeEvent);
   });
-  const handleTouchMove = (0, _utils.unstable_useEventCallback)(nativeEvent => {
+  const handleTouchMove = (0, _useEventCallback.default)(nativeEvent => {
     const finger = trackFinger(nativeEvent, touchId.current);
     if (!finger) {
       return;
@@ -359,7 +360,7 @@ const useGridColumnResize = (apiRef, props) => {
       return;
     }
     let newWidth = computeNewWidth(initialOffsetToSeparator.current, finger.x, refs.columnHeaderElement.getBoundingClientRect(), resizeDirection.current);
-    newWidth = (0, _utils3.clamp)(newWidth, refs.colDef.minWidth, refs.colDef.maxWidth);
+    newWidth = (0, _utils2.clamp)(newWidth, refs.colDef.minWidth, refs.colDef.maxWidth);
     updateWidth(newWidth);
     const params = {
       element: refs.columnHeaderElement,
@@ -368,7 +369,7 @@ const useGridColumnResize = (apiRef, props) => {
     };
     apiRef.current.publishEvent('columnResize', params, nativeEvent);
   });
-  const handleTouchStart = (0, _utils.unstable_useEventCallback)(event => {
+  const handleTouchStart = (0, _useEventCallback.default)(event => {
     const cellSeparator = (0, _domUtils.findParentElementFromClassName)(event.target, _gridClasses.gridClasses['columnSeparator--resizable']);
     // Let the event bubble if the target is not a col separator
     if (!cellSeparator) {
@@ -387,12 +388,12 @@ const useGridColumnResize = (apiRef, props) => {
       field
     }, event);
     storeReferences(colDef, cellSeparator, touch.clientX);
-    const doc = (0, _utils.unstable_ownerDocument)(event.currentTarget);
+    const doc = (0, _ownerDocument.default)(event.currentTarget);
     doc.addEventListener('touchmove', handleTouchMove);
     doc.addEventListener('touchend', handleTouchEnd);
   });
   const stopListening = React.useCallback(() => {
-    const doc = (0, _utils.unstable_ownerDocument)(apiRef.current.rootElementRef.current);
+    const doc = (0, _ownerDocument.default)(apiRef.current.rootElementRef.current);
     doc.body.style.removeProperty('cursor');
     doc.removeEventListener('mousemove', handleResizeMouseMove);
     doc.removeEventListener('mouseup', handleResizeMouseUp);
@@ -423,7 +424,7 @@ const useGridColumnResize = (apiRef, props) => {
       })
     }));
   }, [apiRef]);
-  const handleColumnResizeMouseDown = (0, _utils.unstable_useEventCallback)(({
+  const handleColumnResizeMouseDown = (0, _useEventCallback.default)(({
     colDef
   }, event) => {
     // Only handle left clicks
@@ -443,7 +444,7 @@ const useGridColumnResize = (apiRef, props) => {
       field: colDef.field
     }, event);
     storeReferences(colDef, event.currentTarget, event.clientX);
-    const doc = (0, _utils.unstable_ownerDocument)(apiRef.current.rootElementRef.current);
+    const doc = (0, _ownerDocument.default)(apiRef.current.rootElementRef.current);
     doc.body.style.cursor = 'col-resize';
     refs.previousMouseClickEvent = event.nativeEvent;
     doc.addEventListener('mousemove', handleResizeMouseMove);
@@ -453,7 +454,7 @@ const useGridColumnResize = (apiRef, props) => {
     // Fixes https://github.com/mui/mui-x/issues/4777
     doc.addEventListener('click', preventClick, true);
   });
-  const handleColumnSeparatorDoubleClick = (0, _utils.unstable_useEventCallback)((params, event) => {
+  const handleColumnSeparatorDoubleClick = (0, _useEventCallback.default)((params, event) => {
     if (props.disableAutosize) {
       return;
     }
@@ -542,25 +543,25 @@ const useGridColumnResize = (apiRef, props) => {
    */
 
   React.useEffect(() => stopListening, [stopListening]);
-  (0, _utils2.useOnMount)(() => {
+  (0, _utils.useOnMount)(() => {
     if (props.autosizeOnMount) {
       Promise.resolve().then(() => {
         apiRef.current.autosizeColumns(props.autosizeOptions);
       });
     }
   });
-  (0, _utils2.useGridNativeEventListener)(apiRef, () => apiRef.current.columnHeadersContainerRef?.current, 'touchstart', handleTouchStart, {
+  (0, _utils.useGridNativeEventListener)(apiRef, () => apiRef.current.columnHeadersContainerRef?.current, 'touchstart', handleTouchStart, {
     passive: true
   });
-  (0, _utils2.useGridApiMethod)(apiRef, {
+  (0, _utils.useGridApiMethod)(apiRef, {
     autosizeColumns
   }, 'public');
-  (0, _utils2.useGridApiEventHandler)(apiRef, 'columnResizeStop', handleResizeStop);
-  (0, _utils2.useGridApiEventHandler)(apiRef, 'columnResizeStart', handleResizeStart);
-  (0, _utils2.useGridApiEventHandler)(apiRef, 'columnSeparatorMouseDown', handleColumnResizeMouseDown);
-  (0, _utils2.useGridApiEventHandler)(apiRef, 'columnSeparatorDoubleClick', handleColumnSeparatorDoubleClick);
-  (0, _utils2.useGridApiOptionHandler)(apiRef, 'columnResize', props.onColumnResize);
-  (0, _utils2.useGridApiOptionHandler)(apiRef, 'columnWidthChange', props.onColumnWidthChange);
+  (0, _utils.useGridApiEventHandler)(apiRef, 'columnResizeStop', handleResizeStop);
+  (0, _utils.useGridApiEventHandler)(apiRef, 'columnResizeStart', handleResizeStart);
+  (0, _utils.useGridApiEventHandler)(apiRef, 'columnSeparatorMouseDown', handleColumnResizeMouseDown);
+  (0, _utils.useGridApiEventHandler)(apiRef, 'columnSeparatorDoubleClick', handleColumnSeparatorDoubleClick);
+  (0, _utils.useGridApiOptionHandler)(apiRef, 'columnResize', props.onColumnResize);
+  (0, _utils.useGridApiOptionHandler)(apiRef, 'columnWidthChange', props.onColumnWidthChange);
 };
 exports.useGridColumnResize = useGridColumnResize;
 function updateProperty(element, property, delta) {

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

@@ -14,6 +14,7 @@ export interface GridColumnsState {
   orderedFields: string[];
   lookup: GridColumnLookup;
   columnVisibilityModel: GridColumnVisibilityModel;
+  initialColumnVisibilityModel: GridColumnVisibilityModel;
 }
 export interface GridPinnedColumnFields {
   left?: string[];

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

@@ -26,6 +26,13 @@ export declare const gridColumnDefinitionsSelector: import("../../..").OutputSel
  * @category Visible Columns
  */
 export declare const gridColumnVisibilityModelSelector: import("../../..").OutputSelector<GridStateCommunity, import("./gridColumnsInterfaces").GridColumnsState, import("./gridColumnsInterfaces").GridColumnVisibilityModel>;
+/**
+ * Get the "initial" column visibility model, containing the visibility status of each column.
+ * It is updated when the `columns` prop is updated or when `updateColumns` API method is called.
+ * If a column is not registered in the model, it is visible.
+ * @category Visible Columns
+ */
+export declare const gridInitialColumnVisibilityModelSelector: 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

package/hooks/features/columns/gridColumnsSelector.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.gridVisiblePinnedColumnDefinitionsSelector = exports.gridVisibleColumnFieldsSelector = exports.gridVisibleColumnDefinitionsSelector = exports.gridPinnedColumnsSelector = exports.gridHasColSpanSelector = exports.gridFilterableColumnLookupSelector = exports.gridFilterableColumnDefinitionsSelector = exports.gridColumnsStateSelector = exports.gridColumnVisibilityModelSelector = exports.gridColumnPositionsSelector = exports.gridColumnLookupSelector = exports.gridColumnFieldsSelector = exports.gridColumnDefinitionsSelector = void 0;
+exports.gridVisiblePinnedColumnDefinitionsSelector = exports.gridVisibleColumnFieldsSelector = exports.gridVisibleColumnDefinitionsSelector = exports.gridPinnedColumnsSelector = exports.gridInitialColumnVisibilityModelSelector = exports.gridHasColSpanSelector = exports.gridFilterableColumnLookupSelector = exports.gridFilterableColumnDefinitionsSelector = exports.gridColumnsStateSelector = exports.gridColumnVisibilityModelSelector = exports.gridColumnPositionsSelector = exports.gridColumnLookupSelector = exports.gridColumnFieldsSelector = exports.gridColumnDefinitionsSelector = void 0;
 var _createSelector = require("../../../utils/createSelector");
 var _gridColumnsInterfaces = require("./gridColumnsInterfaces");
 var _gridCoreSelector = require("../../core/gridCoreSelector");
@@ -38,6 +38,14 @@ const gridColumnDefinitionsSelector = exports.gridColumnDefinitionsSelector = (0
  */
 const gridColumnVisibilityModelSelector = exports.gridColumnVisibilityModelSelector = (0, _createSelector.createSelector)(gridColumnsStateSelector, columnsState => columnsState.columnVisibilityModel);
 
+/**
+ * Get the "initial" column visibility model, containing the visibility status of each column.
+ * It is updated when the `columns` prop is updated or when `updateColumns` API method is called.
+ * If a column is not registered in the model, it is visible.
+ * @category Visible Columns
+ */
+const gridInitialColumnVisibilityModelSelector = exports.gridInitialColumnVisibilityModelSelector = (0, _createSelector.createSelector)(gridColumnsStateSelector, columnsState => columnsState.initialColumnVisibilityModel);
+
 /**
  * Get the visible columns as a lookup (an object containing the field for keys and the definition for values).
  * @category Visible Columns

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

@@ -48,12 +48,14 @@ export declare const createColumnsState: ({
   columnsToUpsert,
   initialState,
   columnVisibilityModel,
-  keepOnlyColumnsToUpsert
+  keepOnlyColumnsToUpsert,
+  updateInitialVisibilityModel
 }: {
   columnsToUpsert: readonly GridColDef[];
   initialState: GridColumnsInitialState | undefined;
   columnVisibilityModel?: GridColumnVisibilityModel;
   keepOnlyColumnsToUpsert: boolean;
+  updateInitialVisibilityModel?: boolean;
   apiRef: RefObject<GridApiCommunity>;
 }) => GridColumnsState;
 export declare function getFirstNonSpannedColumnToRender({

package/hooks/features/columns/gridColumnsUtils.js

@@ -232,7 +232,8 @@ const createColumnsState = ({
   columnsToUpsert,
   initialState,
   columnVisibilityModel = (0, _gridColumnsSelector.gridColumnVisibilityModelSelector)(apiRef),
-  keepOnlyColumnsToUpsert = false
+  keepOnlyColumnsToUpsert = false,
+  updateInitialVisibilityModel = false
 }) => {
   const isInsideStateInitializer = !apiRef.current.state.columns;
   let columnsState;
@@ -240,7 +241,8 @@ const createColumnsState = ({
     columnsState = {
       orderedFields: [],
       lookup: {},
-      columnVisibilityModel
+      columnVisibilityModel,
+      initialColumnVisibilityModel: columnVisibilityModel
     };
   } else {
     const currentState = (0, _gridColumnsSelector.gridColumnsStateSelector)(apiRef);
@@ -248,7 +250,8 @@ const createColumnsState = ({
       orderedFields: keepOnlyColumnsToUpsert ? [] : [...currentState.orderedFields],
       lookup: (0, _extends2.default)({}, currentState.lookup),
       // Will be cleaned later if keepOnlyColumnsToUpsert=true
-      columnVisibilityModel
+      columnVisibilityModel,
+      initialColumnVisibilityModel: updateInitialVisibilityModel ? columnVisibilityModel : currentState.initialColumnVisibilityModel
     };
   }
   let columnsToKeep = {};

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

@@ -1,2 +1,2 @@
-export * from "./gridColumnsSelector.js";
+export { gridColumnsStateSelector, gridColumnFieldsSelector, gridColumnLookupSelector, gridColumnVisibilityModelSelector, gridColumnDefinitionsSelector, gridVisibleColumnDefinitionsSelector, gridVisibleColumnFieldsSelector, gridPinnedColumnsSelector, gridVisiblePinnedColumnDefinitionsSelector, gridColumnPositionsSelector, gridFilterableColumnDefinitionsSelector, gridFilterableColumnLookupSelector, gridHasColSpanSelector } from "./gridColumnsSelector.js";
 export * from "./gridColumnsInterfaces.js";

package/hooks/features/columns/index.js

@@ -3,20 +3,104 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-var _gridColumnsSelector = require("./gridColumnsSelector");
-Object.keys(_gridColumnsSelector).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (key in exports && exports[key] === _gridColumnsSelector[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function () {
-      return _gridColumnsSelector[key];
-    }
-  });
+var _exportNames = {
+  gridColumnsStateSelector: true,
+  gridColumnFieldsSelector: true,
+  gridColumnLookupSelector: true,
+  gridColumnVisibilityModelSelector: true,
+  gridColumnDefinitionsSelector: true,
+  gridVisibleColumnDefinitionsSelector: true,
+  gridVisibleColumnFieldsSelector: true,
+  gridPinnedColumnsSelector: true,
+  gridVisiblePinnedColumnDefinitionsSelector: true,
+  gridColumnPositionsSelector: true,
+  gridFilterableColumnDefinitionsSelector: true,
+  gridFilterableColumnLookupSelector: true,
+  gridHasColSpanSelector: true
+};
+Object.defineProperty(exports, "gridColumnDefinitionsSelector", {
+  enumerable: true,
+  get: function () {
+    return _gridColumnsSelector.gridColumnDefinitionsSelector;
+  }
+});
+Object.defineProperty(exports, "gridColumnFieldsSelector", {
+  enumerable: true,
+  get: function () {
+    return _gridColumnsSelector.gridColumnFieldsSelector;
+  }
+});
+Object.defineProperty(exports, "gridColumnLookupSelector", {
+  enumerable: true,
+  get: function () {
+    return _gridColumnsSelector.gridColumnLookupSelector;
+  }
+});
+Object.defineProperty(exports, "gridColumnPositionsSelector", {
+  enumerable: true,
+  get: function () {
+    return _gridColumnsSelector.gridColumnPositionsSelector;
+  }
 });
+Object.defineProperty(exports, "gridColumnVisibilityModelSelector", {
+  enumerable: true,
+  get: function () {
+    return _gridColumnsSelector.gridColumnVisibilityModelSelector;
+  }
+});
+Object.defineProperty(exports, "gridColumnsStateSelector", {
+  enumerable: true,
+  get: function () {
+    return _gridColumnsSelector.gridColumnsStateSelector;
+  }
+});
+Object.defineProperty(exports, "gridFilterableColumnDefinitionsSelector", {
+  enumerable: true,
+  get: function () {
+    return _gridColumnsSelector.gridFilterableColumnDefinitionsSelector;
+  }
+});
+Object.defineProperty(exports, "gridFilterableColumnLookupSelector", {
+  enumerable: true,
+  get: function () {
+    return _gridColumnsSelector.gridFilterableColumnLookupSelector;
+  }
+});
+Object.defineProperty(exports, "gridHasColSpanSelector", {
+  enumerable: true,
+  get: function () {
+    return _gridColumnsSelector.gridHasColSpanSelector;
+  }
+});
+Object.defineProperty(exports, "gridPinnedColumnsSelector", {
+  enumerable: true,
+  get: function () {
+    return _gridColumnsSelector.gridPinnedColumnsSelector;
+  }
+});
+Object.defineProperty(exports, "gridVisibleColumnDefinitionsSelector", {
+  enumerable: true,
+  get: function () {
+    return _gridColumnsSelector.gridVisibleColumnDefinitionsSelector;
+  }
+});
+Object.defineProperty(exports, "gridVisibleColumnFieldsSelector", {
+  enumerable: true,
+  get: function () {
+    return _gridColumnsSelector.gridVisibleColumnFieldsSelector;
+  }
+});
+Object.defineProperty(exports, "gridVisiblePinnedColumnDefinitionsSelector", {
+  enumerable: true,
+  get: function () {
+    return _gridColumnsSelector.gridVisiblePinnedColumnDefinitionsSelector;
+  }
+});
+var _gridColumnsSelector = require("./gridColumnsSelector");
 var _gridColumnsInterfaces = require("./gridColumnsInterfaces");
 Object.keys(_gridColumnsInterfaces).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
   if (key in exports && exports[key] === _gridColumnsInterfaces[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,

package/hooks/features/columns/useGridColumns.js

@@ -92,7 +92,8 @@ function useGridColumns(apiRef, props) {
       apiRef,
       columnsToUpsert: columns,
       initialState: undefined,
-      keepOnlyColumnsToUpsert: false
+      keepOnlyColumnsToUpsert: false,
+      updateInitialVisibilityModel: true
     });
     setGridColumnsState(columnsState);
   }, [apiRef, setGridColumnsState]);
@@ -298,7 +299,8 @@ function useGridColumns(apiRef, props) {
       initialState: undefined,
       // If the user provides a model, we don't want to set it in the state here because it has it's dedicated `useEffect` which calls `setColumnVisibilityModel`
       columnsToUpsert: props.columns,
-      keepOnlyColumnsToUpsert: true
+      keepOnlyColumnsToUpsert: true,
+      updateInitialVisibilityModel: true
     });
     previousColumnsProp.current = props.columns;
     setGridColumnsState(columnsState);

package/hooks/features/dataSource/gridDataSourceError.d.ts

@@ -0,0 +1,31 @@
+import type { GridGetRowsParams, GridUpdateRowParams } from '../../../models/gridDataSource';
+export declare class GridGetRowsError<T extends GridGetRowsParams = GridGetRowsParams> extends Error {
+  /**
+   * The parameters used in the failed request
+   */
+  readonly params: T;
+  /**
+   * The original error that caused this error
+   */
+  readonly cause?: Error;
+  constructor(options: {
+    message: string;
+    params: T;
+    cause?: Error;
+  });
+}
+export declare class GridUpdateRowError extends Error {
+  /**
+   * The parameters used in the failed request
+   */
+  readonly params: GridUpdateRowParams;
+  /**
+   * The original error that caused this error
+   */
+  readonly cause?: Error;
+  constructor(options: {
+    message: string;
+    params: GridUpdateRowParams;
+    cause?: Error;
+  });
+}

package/hooks/features/dataSource/gridDataSourceError.js

@@ -0,0 +1,40 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.GridUpdateRowError = exports.GridGetRowsError = void 0;
+class GridGetRowsError extends Error {
+  constructor(options) {
+    super(options.message);
+    /**
+     * The parameters used in the failed request
+     */
+    this.params = void 0;
+    /**
+     * The original error that caused this error
+     */
+    this.cause = void 0;
+    this.name = 'GridGetRowsError';
+    this.params = options.params;
+    this.cause = options.cause;
+  }
+}
+exports.GridGetRowsError = GridGetRowsError;
+class GridUpdateRowError extends Error {
+  constructor(options) {
+    super(options.message);
+    /**
+     * The parameters used in the failed request
+     */
+    this.params = void 0;
+    /**
+     * The original error that caused this error
+     */
+    this.cause = void 0;
+    this.name = 'GridUpdateRowError';
+    this.params = options.params;
+    this.cause = options.cause;
+  }
+}
+exports.GridUpdateRowError = GridUpdateRowError;

package/hooks/features/dataSource/index.d.ts

@@ -0,0 +1,2 @@
+export { GridDataSourceCacheDefault, type GridDataSourceCacheDefaultConfig } from "./cache.js";
+export { GridGetRowsError, GridUpdateRowError } from "./gridDataSourceError.js";

package/hooks/features/dataSource/index.js

@@ -0,0 +1,25 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "GridDataSourceCacheDefault", {
+  enumerable: true,
+  get: function () {
+    return _cache.GridDataSourceCacheDefault;
+  }
+});
+Object.defineProperty(exports, "GridGetRowsError", {
+  enumerable: true,
+  get: function () {
+    return _gridDataSourceError.GridGetRowsError;
+  }
+});
+Object.defineProperty(exports, "GridUpdateRowError", {
+  enumerable: true,
+  get: function () {
+    return _gridDataSourceError.GridUpdateRowError;
+  }
+});
+var _cache = require("./cache");
+var _gridDataSourceError = require("./gridDataSourceError");

package/hooks/features/dataSource/models.d.ts

@@ -18,5 +18,5 @@ export interface GridDataSourceApi {
   /**
    * The data source API.
    */
-  unstable_dataSource: GridDataSourceApiBase;
+  dataSource: GridDataSourceApiBase;
 }

package/hooks/features/dataSource/useGridDataSourceBase.d.ts

@@ -8,7 +8,7 @@ import type { DataGridProcessedProps } from '../../../models/props/DataGridProps
 import type { GridStrategyProcessor } from '../../core/strategyProcessing';
 import type { GridEventListener } from '../../../models/events';
 import type { GridRowId } from '../../../models';
-export declare const useGridDataSourceBase: <Api extends GridPrivateApiCommunity>(apiRef: RefObject<Api>, props: Pick<DataGridProcessedProps, "unstable_dataSource" | "unstable_dataSourceCache" | "unstable_onDataSourceError" | "pageSizeOptions" | "signature">, options?: {
+export declare const useGridDataSourceBase: <Api extends GridPrivateApiCommunity>(apiRef: RefObject<Api>, props: Pick<DataGridProcessedProps, "dataSource" | "dataSourceCache" | "onDataSourceError" | "pageSizeOptions" | "signature">, options?: {
   cacheOptions?: GridDataSourceCacheDefaultConfig;
   fetchRowChildren?: (parents: GridRowId[]) => void;
   clearDataSourceState?: () => void;