@mui/x-data-grid-premium 8.0.0-beta.2 → 8.0.0

package/esm/components/resizablePanel/ResizablePanelHandle.js

@@ -0,0 +1,108 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["className", "children"];
+import * as React from 'react';
+import { styled } from '@mui/system';
+import { vars } from '@mui/x-data-grid-pro/internals';
+import { unstable_composeClasses as composeClasses } from '@mui/utils';
+import { getDataGridUtilityClass, gridClasses } from '@mui/x-data-grid-pro';
+import clsx from 'clsx';
+import { useResize } from "../../hooks/utils/useResize.js";
+import { useResizablePanelContext } from "./ResizablePanelContext.js";
+import { useGridRootProps } from "../../hooks/utils/useGridRootProps.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes,
+    direction
+  } = ownerState;
+  const slots = {
+    root: ['resizablePanelHandle', `resizablePanelHandle--${direction}`]
+  };
+  return composeClasses(slots, getDataGridUtilityClass, classes);
+};
+const ResizablePanelHandleRoot = styled('div', {
+  name: 'MuiDataGrid',
+  slot: 'ResizablePanelHandle',
+  overridesResolver: (props, styles) => [{
+    [`&.${gridClasses['resizablePanelHandle--horizontal']}`]: styles['resizablePanelHandle--horizontal']
+  }, {
+    [`&.${gridClasses['resizablePanelHandle--vertical']}`]: styles['resizablePanelHandle--vertical']
+  }, styles.resizablePanelHandle]
+})({
+  position: 'absolute',
+  zIndex: 3,
+  top: 0,
+  left: 0,
+  userSelect: 'none',
+  transition: vars.transition(['border-color'], {
+    duration: vars.transitions.duration.short,
+    easing: vars.transitions.easing.easeInOut
+  }),
+  '&:hover': {
+    borderWidth: 2,
+    borderColor: vars.colors.interactive.selected
+  },
+  variants: [{
+    props: {
+      direction: 'horizontal'
+    },
+    style: {
+      height: '100%',
+      width: 8,
+      cursor: 'ew-resize',
+      borderLeft: `1px solid ${vars.colors.border.base}`,
+      touchAction: 'pan-x'
+    }
+  }, {
+    props: {
+      direction: 'vertical'
+    },
+    style: {
+      width: '100%',
+      height: 8,
+      cursor: 'ns-resize',
+      borderTop: `1px solid ${vars.colors.border.base}`,
+      touchAction: 'pan-y'
+    }
+  }]
+});
+function ResizablePanelHandle(props) {
+  const {
+      className
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const {
+    rootRef,
+    direction
+  } = useResizablePanelContext();
+  const rootProps = useGridRootProps();
+  const ownerState = {
+    classes: rootProps.classes,
+    direction
+  };
+  const classes = useUtilityClasses(ownerState);
+  const {
+    ref
+  } = useResize({
+    direction,
+    getInitialSize: () => {
+      return direction === 'horizontal' ? rootRef.current.offsetWidth : rootRef.current.offsetHeight;
+    },
+    onSizeChange: newSize => {
+      if (direction === 'horizontal') {
+        rootRef.current.style.width = `${newSize}px`;
+      } else {
+        rootRef.current.style.height = `${newSize}px`;
+      }
+    }
+  });
+  return /*#__PURE__*/_jsx(ResizablePanelHandleRoot, _extends({
+    className: clsx(classes.root, className),
+    ownerState: ownerState,
+    direction: direction
+  }, other, {
+    ref: ref
+  }));
+}
+export { ResizablePanelHandle };

package/esm/components/resizablePanel/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./ResizablePanel.js";
+export * from "./ResizablePanelContext.js";
+export * from "./ResizablePanelHandle.js";

package/esm/components/resizablePanel/index.js

@@ -0,0 +1,3 @@
+export * from "./ResizablePanel.js";
+export * from "./ResizablePanelContext.js";
+export * from "./ResizablePanelHandle.js";

package/esm/components/sidebar/Sidebar.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+export type SidebarProps = React.HTMLAttributes<HTMLDivElement>;
+declare function Sidebar(props: SidebarProps): React.JSX.Element;
+export { Sidebar };

package/esm/components/sidebar/Sidebar.js

@@ -0,0 +1,47 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["className", "children"];
+import * as React from 'react';
+import clsx from 'clsx';
+import { styled } from '@mui/system';
+import { getDataGridUtilityClass } from '@mui/x-data-grid-pro';
+import { unstable_composeClasses as composeClasses } from '@mui/utils';
+import { ResizablePanel, ResizablePanelHandle } from "../resizablePanel/index.js";
+import { useGridRootProps } from "../../hooks/utils/useGridRootProps.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['sidebar']
+  };
+  return composeClasses(slots, getDataGridUtilityClass, classes);
+};
+const SidebarRoot = styled(ResizablePanel, {
+  name: 'MuiDataGrid',
+  slot: 'Sidebar'
+})({
+  display: 'flex',
+  flexDirection: 'column',
+  width: 300,
+  minWidth: 260,
+  maxWidth: 400,
+  overflow: 'hidden'
+});
+function Sidebar(props) {
+  const {
+      className,
+      children
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const rootProps = useGridRootProps();
+  const classes = useUtilityClasses(rootProps);
+  return /*#__PURE__*/_jsxs(SidebarRoot, _extends({
+    className: clsx(className, classes.root),
+    ownerState: rootProps
+  }, other, {
+    children: [/*#__PURE__*/_jsx(ResizablePanelHandle, {}), children]
+  }));
+}
+export { Sidebar };

package/esm/components/sidebar/SidebarHeader.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+export type SidebarHeaderProps = React.HTMLAttributes<HTMLDivElement>;
+declare function SidebarHeader(props: SidebarHeaderProps): React.JSX.Element;
+export { SidebarHeader };

package/esm/components/sidebar/SidebarHeader.js

@@ -0,0 +1,44 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+const _excluded = ["className", "children"];
+import * as React from 'react';
+import { styled } from '@mui/system';
+import { getDataGridUtilityClass } from '@mui/x-data-grid-pro';
+import { vars } from '@mui/x-data-grid-pro/internals';
+import { unstable_composeClasses as composeClasses } from '@mui/utils';
+import clsx from 'clsx';
+import { useGridRootProps } from "../../hooks/utils/useGridRootProps.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+const useUtilityClasses = ownerState => {
+  const {
+    classes
+  } = ownerState;
+  const slots = {
+    root: ['sidebarHeader']
+  };
+  return composeClasses(slots, getDataGridUtilityClass, classes);
+};
+const SidebarHeaderRoot = styled('div', {
+  name: 'MuiDataGrid',
+  slot: 'SidebarHeader'
+})({
+  position: 'sticky',
+  top: 0,
+  borderBottom: `1px solid ${vars.colors.border.base}`
+});
+function SidebarHeader(props) {
+  const {
+      className,
+      children
+    } = props,
+    other = _objectWithoutPropertiesLoose(props, _excluded);
+  const rootProps = useGridRootProps();
+  const classes = useUtilityClasses(rootProps);
+  return /*#__PURE__*/_jsx(SidebarHeaderRoot, _extends({
+    className: clsx(className, classes.root),
+    ownerState: rootProps
+  }, other, {
+    children: children
+  }));
+}
+export { SidebarHeader };

package/esm/components/sidebar/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./Sidebar.js";
+export * from "./SidebarHeader.js";

package/esm/components/sidebar/index.js

@@ -0,0 +1,2 @@
+export * from "./Sidebar.js";
+export * from "./SidebarHeader.js";

package/esm/constants/dataGridPremiumDefaultSlotsComponents.js

@@ -3,9 +3,12 @@ import { DATA_GRID_PRO_DEFAULT_SLOTS_COMPONENTS } from '@mui/x-data-grid-pro/int
 import { GridPremiumColumnMenu } from "../components/GridPremiumColumnMenu.js";
 import materialSlots from "../material/index.js";
 import { GridBottomContainer } from "../components/GridBottomContainer.js";
+import { GridEmptyPivotOverlay } from "../components/GridEmptyPivotOverlay.js";
 import { GridPremiumToolbar } from "../components/GridPremiumToolbar.js";
 export const DATA_GRID_PREMIUM_DEFAULT_SLOTS_COMPONENTS = _extends({}, DATA_GRID_PRO_DEFAULT_SLOTS_COMPONENTS, materialSlots, {
+  aiAssistantPanel: null,
   columnMenu: GridPremiumColumnMenu,
   bottomContainer: GridBottomContainer,
+  emptyPivotOverlay: GridEmptyPivotOverlay,
   toolbar: GridPremiumToolbar
 });

package/esm/hooks/features/aggregation/gridAggregationFunctions.js

@@ -30,6 +30,9 @@ const avgAgg = {
         sum += value;
       }
     }
+    if (sum === 0) {
+      return null;
+    }
     return sum / valuesCount;
   },
   columnTypes: ['number']
@@ -41,13 +44,18 @@ const minAgg = {
     if (values.length === 0) {
       return null;
     }
+    let hasValidValue = false;
     let min = +Infinity;
     for (let i = 0; i < values.length; i += 1) {
       const value = values[i];
       if (value != null && value < min) {
         min = value;
+        hasValidValue = true;
       }
     }
+    if (!hasValidValue) {
+      return null;
+    }
     return min;
   },
   columnTypes: ['number', 'date', 'dateTime']
@@ -59,13 +67,18 @@ const maxAgg = {
     if (values.length === 0) {
       return null;
     }
+    let hasValidValue = false;
     let max = -Infinity;
     for (let i = 0; i < values.length; i += 1) {
       const value = values[i];
       if (value != null && value > max) {
         max = value;
+        hasValidValue = true;
       }
     }
+    if (!hasValidValue) {
+      return null;
+    }
     return max;
   },
   columnTypes: ['number', 'date', 'dateTime']

package/esm/hooks/features/aggregation/gridAggregationSelectors.d.ts

@@ -1,4 +1,6 @@
+import { GridRowId } from '@mui/x-data-grid';
 import { GridStatePremium } from "../../../models/gridStatePremium.js";
+import { GridAggregationPosition } from "./gridAggregationInterfaces.js";
 export declare const gridAggregationStateSelector: import("@mui/x-data-grid").OutputSelector<GridStatePremium, unknown, import("./gridAggregationInterfaces").GridAggregationState>;
 /**
  * Get the aggregation model, containing the aggregation function of each column.
@@ -10,4 +12,11 @@ export declare const gridAggregationModelSelector: import("@mui/x-data-grid").Ou
  * Get the aggregation results as a lookup.
  * @category Aggregation
  */
-export declare const gridAggregationLookupSelector: import("@mui/x-data-grid").OutputSelector<GridStatePremium, import("./gridAggregationInterfaces").GridAggregationState, import("./gridAggregationInterfaces").GridAggregationLookup>;
+export declare const gridAggregationLookupSelector: import("@mui/x-data-grid").OutputSelector<GridStatePremium, import("./gridAggregationInterfaces").GridAggregationState, import("./gridAggregationInterfaces").GridAggregationLookup>;
+export declare const gridCellAggregationResultSelector: import("@mui/x-data-grid").OutputSelector<GridStatePremium, {
+  id: GridRowId;
+  field: string;
+}, {
+  position: GridAggregationPosition;
+  value: any;
+} | null>;

package/esm/hooks/features/aggregation/gridAggregationSelectors.js

@@ -1,4 +1,5 @@
 import { createSelector, createRootSelector } from '@mui/x-data-grid-pro/internals';
+import { gridRowTreeSelector } from '@mui/x-data-grid';
 export const gridAggregationStateSelector = createRootSelector(state => state.aggregation);
 
 /**
@@ -12,4 +13,30 @@ export const gridAggregationModelSelector = createSelector(gridAggregationStateS
  * Get the aggregation results as a lookup.
  * @category Aggregation
  */
-export const gridAggregationLookupSelector = createSelector(gridAggregationStateSelector, aggregationState => aggregationState.lookup);
+export const gridAggregationLookupSelector = createSelector(gridAggregationStateSelector, aggregationState => aggregationState.lookup);
+export const gridCellAggregationResultSelector = createSelector(gridRowTreeSelector, gridAggregationLookupSelector, (rowTree, aggregationLookup, {
+  id,
+  field
+}) => {
+  let cellAggregationPosition = null;
+  const rowNode = rowTree[id];
+  if (!rowNode) {
+    return null;
+  }
+  if (rowNode.type === 'group') {
+    cellAggregationPosition = 'inline';
+  } else if (id.toString().startsWith('auto-generated-group-footer-')) {
+    cellAggregationPosition = 'footer';
+  }
+  if (cellAggregationPosition == null) {
+    return null;
+  }
+
+  // TODO: Add custom root id
+  const groupId = cellAggregationPosition === 'inline' ? id : rowNode.parent ?? '';
+  const aggregationResult = aggregationLookup?.[groupId]?.[field];
+  if (!aggregationResult || aggregationResult.position !== cellAggregationPosition) {
+    return null;
+  }
+  return aggregationResult;
+});

package/esm/hooks/features/aggregation/gridAggregationUtils.d.ts

@@ -3,7 +3,7 @@ import { GridColDef, GridRowId } from '@mui/x-data-grid-pro';
 import { GridColumnRawLookup, GridHydrateRowsValue } from '@mui/x-data-grid-pro/internals';
 import { GridAggregationFunction, GridAggregationFunctionDataSource, GridAggregationModel, GridAggregationRule, GridAggregationRules } from "./gridAggregationInterfaces.js";
 import { GridStatePremium } from "../../../models/gridStatePremium.js";
-import { DataGridPremiumProcessedProps } from "../../../models/dataGridPremiumProps.js";
+import type { DataGridPremiumProcessedProps } from '../../../models/dataGridPremiumProps';
 import { GridApiPremium, GridPrivateApiPremium } from "../../../models/gridApiPremium.js";
 export declare const GRID_AGGREGATION_ROOT_FOOTER_ROW_ID = "auto-generated-group-footer-root";
 export declare const getAggregationFooterRowIdFromGroupId: (groupId: GridRowId | null) => string;

package/esm/hooks/features/aggregation/index.d.ts

@@ -1,4 +1,4 @@
 export type { GridAggregationState, GridAggregationInitialState, GridAggregationInternalCache, GridAggregationApi, GridAggregationGetCellValueParams, GridAggregationFunction, GridAggregationFunctionDataSource, GridAggregationParams, GridAggregationModel, GridAggregationLookup, GridAggregationPosition, GridAggregationCellMeta, GridAggregationHeaderMeta, GridAggregationRule, GridAggregationRules } from './gridAggregationInterfaces';
-export * from "./gridAggregationSelectors.js";
+export { gridAggregationStateSelector, gridAggregationLookupSelector, gridAggregationModelSelector } from "./gridAggregationSelectors.js";
 export * from "./gridAggregationFunctions.js";
 export { GRID_AGGREGATION_ROOT_FOOTER_ROW_ID, getAggregationFooterRowIdFromGroupId } from "./gridAggregationUtils.js";

package/esm/hooks/features/aggregation/index.js

@@ -1,3 +1,3 @@
-export * from "./gridAggregationSelectors.js";
+export { gridAggregationStateSelector, gridAggregationLookupSelector, gridAggregationModelSelector } from "./gridAggregationSelectors.js";
 export * from "./gridAggregationFunctions.js";
 export { GRID_AGGREGATION_ROOT_FOOTER_ROW_ID, getAggregationFooterRowIdFromGroupId } from "./gridAggregationUtils.js";

package/esm/hooks/features/aggregation/useGridAggregation.js

@@ -1,6 +1,6 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import * as React from 'react';
-import { gridColumnLookupSelector, useGridApiEventHandler, useGridApiMethod } from '@mui/x-data-grid-pro';
+import { gridColumnLookupSelector, useGridEvent, useGridApiMethod } from '@mui/x-data-grid-pro';
 import { useGridRegisterPipeProcessor } from '@mui/x-data-grid-pro/internals';
 import { gridAggregationModelSelector } from "./gridAggregationSelectors.js";
 import { getAggregationRules, mergeStateWithAggregationModel, areAggregationRulesEqual } from "./gridAggregationUtils.js";
@@ -74,13 +74,9 @@ export const useGridAggregation = (apiRef, props) => {
     const aggregationRules = props.disableAggregation ? {} : getAggregationRules(gridColumnLookupSelector(apiRef), gridAggregationModelSelector(apiRef), props.aggregationFunctions, !!props.dataSource);
 
     // Re-apply the row hydration to add / remove the aggregation footers
-    if (!areAggregationRulesEqual(rulesOnLastRowHydration, aggregationRules)) {
-      if (props.dataSource) {
-        apiRef.current.dataSource.fetchRows();
-      } else {
-        apiRef.current.requestPipeProcessorsApplication('hydrateRows');
-        applyAggregation();
-      }
+    if (!props.dataSource && !areAggregationRulesEqual(rulesOnLastRowHydration, aggregationRules)) {
+      apiRef.current.requestPipeProcessorsApplication('hydrateRows');
+      applyAggregation();
     }
 
     // Re-apply the column hydration to wrap / unwrap the aggregated columns
@@ -88,9 +84,9 @@ export const useGridAggregation = (apiRef, props) => {
       apiRef.current.requestPipeProcessorsApplication('hydrateColumns');
     }
   }, [apiRef, applyAggregation, props.aggregationFunctions, props.disableAggregation, props.dataSource]);
-  useGridApiEventHandler(apiRef, 'aggregationModelChange', checkAggregationRulesDiff);
-  useGridApiEventHandler(apiRef, 'columnsChange', checkAggregationRulesDiff);
-  useGridApiEventHandler(apiRef, 'filteredRowsSet', applyAggregation);
+  useGridEvent(apiRef, 'aggregationModelChange', checkAggregationRulesDiff);
+  useGridEvent(apiRef, 'columnsChange', checkAggregationRulesDiff);
+  useGridEvent(apiRef, 'filteredRowsSet', applyAggregation);
 
   /**
    * EFFECTS

package/esm/hooks/features/aggregation/useGridAggregationPreProcessors.js

@@ -16,16 +16,10 @@ export const useGridAggregationPreProcessors = (apiRef, props) => {
       const haveAggregationColumnValue = !!rulesOnLastColumnHydration.current[field];
       let column = columnsState.lookup[field];
       if (haveAggregationColumnValue) {
-        column = unwrapColumnFromAggregation({
-          column
-        });
+        column = unwrapColumnFromAggregation(column);
       }
       if (shouldHaveAggregationValue) {
-        column = wrapColumnWithAggregationValue({
-          column,
-          aggregationRule: aggregationRules[field],
-          apiRef
-        });
+        column = wrapColumnWithAggregationValue(column, aggregationRules[field], apiRef);
       }
       columnsState.lookup[field] = column;
     });

package/esm/hooks/features/aggregation/wrapColumnWithAggregation.d.ts

@@ -4,34 +4,14 @@ import { GridColDef, GridFilterOperator } from '@mui/x-data-grid-pro';
 import { type GridBaseColDef } from '@mui/x-data-grid-pro/internals';
 import { GridApiPremium } from "../../../models/gridApiPremium.js";
 import type { GridAggregationRule } from './gridAggregationInterfaces';
-type WrappableColumnProperty = 'valueGetter' | 'valueFormatter' | 'renderCell' | 'renderHeader' | 'filterOperators';
-interface GridColDefWithAggregationWrappers extends GridBaseColDef {
-  aggregationWrappedProperties: {
-    name: WrappableColumnProperty;
-    originalValue: GridBaseColDef[WrappableColumnProperty];
-    wrappedValue: GridBaseColDef[WrappableColumnProperty];
-  }[];
-}
 /**
  * Add a wrapper around each wrappable property of the column to customize the behavior of the aggregation cells.
  */
-export declare const wrapColumnWithAggregationValue: ({
-  column,
-  apiRef,
-  aggregationRule
-}: {
-  column: GridBaseColDef;
-  apiRef: RefObject<GridApiPremium>;
-  aggregationRule: GridAggregationRule;
-}) => GridBaseColDef;
+export declare const wrapColumnWithAggregationValue: (column: GridBaseColDef, aggregationRule: GridAggregationRule, apiRef: RefObject<GridApiPremium>) => GridBaseColDef;
 /**
  * Remove the aggregation wrappers around the wrappable properties of the column.
  */
-export declare const unwrapColumnFromAggregation: ({
-  column
-}: {
-  column: GridColDef | GridColDefWithAggregationWrappers;
-}) => GridBaseColDef<any, any, any> | {
+export declare const unwrapColumnFromAggregation: (column: GridColDef) => GridBaseColDef<any, any, any> | {
   field: string;
   headerName?: string;
   description?: string;
@@ -71,11 +51,11 @@ export declare const unwrapColumnFromAggregation: ({
   disableReorder?: boolean;
   disableExport?: boolean;
   colSpan?: number | import("@mui/x-data-grid").GridColSpanFn<import("@mui/x-data-grid").GridValidRowModel, any, any> | undefined;
-  unstable_examples?: any[] | undefined;
+  examples?: any[] | undefined;
   renderHeaderFilter?: (params: import("@mui/x-data-grid-pro").GridRenderHeaderFilterProps) => React.ReactNode;
   aggregable?: boolean;
   availableAggregationFunctions?: string[];
   groupingValueGetter?: import("../../..").GridGroupingValueGetter<import("@mui/x-data-grid").GridValidRowModel> | undefined;
   pastedValueParser?: import("../../..").GridPastedValueParser<import("@mui/x-data-grid").GridValidRowModel, any, any> | undefined;
-};
-export {};
+  pivotable?: boolean;
+};

package/esm/hooks/features/aggregation/wrapColumnWithAggregation.js

@@ -6,6 +6,7 @@ import { gridRowIdSelector, gridRowNodeSelector } from '@mui/x-data-grid-pro';
 import { gridAggregationLookupSelector } from "./gridAggregationSelectors.js";
 import { GridFooterCell } from "../../../components/GridFooterCell.js";
 import { GridAggregationHeader } from "../../../components/GridAggregationHeader.js";
+import { gridPivotActiveSelector } from "../pivoting/gridPivotingSelectors.js";
 import { jsx as _jsx } from "react/jsx-runtime";
 const getAggregationValueWrappedValueGetter = ({
   value: valueGetter,
@@ -52,8 +53,10 @@ const getAggregationValueWrappedValueFormatter = ({
 const getAggregationValueWrappedRenderCell = ({
   value: renderCell,
   aggregationRule,
-  getCellAggregationResult
+  getCellAggregationResult,
+  apiRef
 }) => {
+  const pivotActive = gridPivotActiveSelector(apiRef);
   const wrappedRenderCell = params => {
     const cellAggregationResult = getCellAggregationResult(params.id, params.field);
     if (cellAggregationResult != null) {
@@ -61,8 +64,14 @@ const getAggregationValueWrappedRenderCell = ({
         if (cellAggregationResult.position === 'footer') {
           return /*#__PURE__*/_jsx(GridFooterCell, _extends({}, params));
         }
+        if (pivotActive && cellAggregationResult.value === 0) {
+          return null;
+        }
         return params.formattedValue;
       }
+      if (pivotActive && cellAggregationResult.value === 0) {
+        return null;
+      }
       const aggregationMeta = {
         hasCellUnit: aggregationRule.aggregationFunction.hasCellUnit ?? true,
         aggregationFunctionName: aggregationRule.aggregationFunctionName
@@ -114,6 +123,10 @@ const getWrappedRenderHeader = ({
   aggregationRule
 }) => {
   const wrappedRenderHeader = params => {
+    // TODO: investigate why colDef is undefined
+    if (!params.colDef) {
+      return null;
+    }
     return /*#__PURE__*/_jsx(GridAggregationHeader, _extends({}, params, {
       aggregation: {
         aggregationRule
@@ -127,14 +140,13 @@ const getWrappedRenderHeader = ({
 /**
  * Add a wrapper around each wrappable property of the column to customize the behavior of the aggregation cells.
  */
-export const wrapColumnWithAggregationValue = ({
-  column,
-  apiRef,
-  aggregationRule
-}) => {
+export const wrapColumnWithAggregationValue = (column, aggregationRule, apiRef) => {
   const getCellAggregationResult = (id, field) => {
     let cellAggregationPosition = null;
     const rowNode = gridRowNodeSelector(apiRef, id);
+    if (!rowNode) {
+      return null;
+    }
     if (rowNode.type === 'group') {
       cellAggregationPosition = 'inline';
     } else if (id.toString().startsWith('auto-generated-group-footer-')) {
@@ -185,14 +197,15 @@ export const wrapColumnWithAggregationValue = ({
   }
   return wrappedColumn;
 };
+const isColumnWrappedWithAggregation = column => {
+  return typeof column.aggregationWrappedProperties !== 'undefined';
+};
 
 /**
  * Remove the aggregation wrappers around the wrappable properties of the column.
  */
-export const unwrapColumnFromAggregation = ({
-  column
-}) => {
-  if (!column.aggregationWrappedProperties) {
+export const unwrapColumnFromAggregation = column => {
+  if (!isColumnWrappedWithAggregation(column)) {
     return column;
   }
   const _ref = column,

package/esm/hooks/features/aiAssistant/api.d.ts

@@ -0,0 +1,12 @@
+import { PromptResponse } from "./gridAiAssistantInterfaces.js";
+/**
+ * Prompt resolver for the <DataGridPremium /> component.
+ * @param {string} url The URL to send the request to.
+ * @param {string} query The query to be processed.
+ * @param {string} context The prompt context containing necessary information about the current columns definition.
+ * Either use the `context` parameter of the `onPrompt` callback or the return value of the `unstable_getPromptContext()` API method.
+ * @param {string} conversationId The id of the conversation the prompt is part of. If not passed, prompt response will return a new conversation id that can be used to continue the newly started conversation.
+ * @param {string} additionalContext Optional, additional context to make the processing results more accurate.
+ * @returns {Promise<PromptResponse>} The grid state updates to be applied.
+ */
+export declare function gridDefaultPromptResolver(url: string, query: string, context: string, conversationId?: string, additionalContext?: string): Promise<PromptResponse>;

package/esm/hooks/features/aiAssistant/api.js

@@ -0,0 +1,31 @@
+/**
+ * Prompt resolver for the <DataGridPremium /> component.
+ * @param {string} url The URL to send the request to.
+ * @param {string} query The query to be processed.
+ * @param {string} context The prompt context containing necessary information about the current columns definition.
+ * Either use the `context` parameter of the `onPrompt` callback or the return value of the `unstable_getPromptContext()` API method.
+ * @param {string} conversationId The id of the conversation the prompt is part of. If not passed, prompt response will return a new conversation id that can be used to continue the newly started conversation.
+ * @param {string} additionalContext Optional, additional context to make the processing results more accurate.
+ * @returns {Promise<PromptResponse>} The grid state updates to be applied.
+ */
+export function gridDefaultPromptResolver(url, query, context, conversationId, additionalContext = '') {
+  return fetch(url, {
+    mode: 'cors',
+    method: 'POST',
+    headers: {
+      'content-type': 'application/json'
+    },
+    credentials: 'include',
+    body: JSON.stringify({
+      context,
+      query,
+      additionalContext,
+      conversationId
+    })
+  }).then(result => result.json()).then(result => {
+    if (result.ok === false) {
+      return Promise.reject(new Error(result.message));
+    }
+    return result.data;
+  });
+}