diff --git a/docs/data/data-grid/events/events.json b/docs/data/data-grid/events/events.json
index 43db01c989297..a130883a42adc 100644
--- a/docs/data/data-grid/events/events.json
+++ b/docs/data/data-grid/events/events.json
@@ -167,6 +167,18 @@
"params": "GridHeaderSelectionCheckboxParams",
"event": "MuiEvent<{}>"
},
+ {
+ "name": "menuClose",
+ "description": "Fired when the grid menu is closed.",
+ "params": "GridMenuParams",
+ "event": "MuiEvent<{}>"
+ },
+ {
+ "name": "menuOpen",
+ "description": "Fired when the menu is opened.",
+ "params": "GridMenuParams",
+ "event": "MuiEvent<{}>"
+ },
{
"name": "pageChange",
"description": "Fired when the page changes.",
diff --git a/docs/pages/x/api/data-grid/data-grid-premium.json b/docs/pages/x/api/data-grid/data-grid-premium.json
index 67e9801b7d783..b53954f27f334 100644
--- a/docs/pages/x/api/data-grid/data-grid-premium.json
+++ b/docs/pages/x/api/data-grid/data-grid-premium.json
@@ -143,6 +143,8 @@
"onEditRowsModelChange": { "type": { "name": "func" } },
"onError": { "type": { "name": "func" } },
"onFilterModelChange": { "type": { "name": "func" } },
+ "onMenuClose": { "type": { "name": "func" } },
+ "onMenuOpen": { "type": { "name": "func" } },
"onPageChange": { "type": { "name": "func" } },
"onPageSizeChange": { "type": { "name": "func" } },
"onPinnedColumnsChange": { "type": { "name": "func" } },
diff --git a/docs/pages/x/api/data-grid/data-grid-pro.json b/docs/pages/x/api/data-grid/data-grid-pro.json
index 58d3cff7e8b2b..1cbd969c3317c 100644
--- a/docs/pages/x/api/data-grid/data-grid-pro.json
+++ b/docs/pages/x/api/data-grid/data-grid-pro.json
@@ -143,6 +143,8 @@
"onEditRowsModelChange": { "type": { "name": "func" } },
"onError": { "type": { "name": "func" } },
"onFilterModelChange": { "type": { "name": "func" } },
+ "onMenuClose": { "type": { "name": "func" } },
+ "onMenuOpen": { "type": { "name": "func" } },
"onPageChange": { "type": { "name": "func" } },
"onPageSizeChange": { "type": { "name": "func" } },
"onPinnedColumnsChange": { "type": { "name": "func" } },
diff --git a/docs/pages/x/api/data-grid/data-grid.json b/docs/pages/x/api/data-grid/data-grid.json
index 7236fa568729d..b43bd679ed799 100644
--- a/docs/pages/x/api/data-grid/data-grid.json
+++ b/docs/pages/x/api/data-grid/data-grid.json
@@ -111,6 +111,8 @@
"onEditRowsModelChange": { "type": { "name": "func" } },
"onError": { "type": { "name": "func" } },
"onFilterModelChange": { "type": { "name": "func" } },
+ "onMenuClose": { "type": { "name": "func" } },
+ "onMenuOpen": { "type": { "name": "func" } },
"onPageChange": { "type": { "name": "func" } },
"onPageSizeChange": { "type": { "name": "func" } },
"onPreferencePanelClose": { "type": { "name": "func" } },
diff --git a/docs/translations/api-docs/data-grid/data-grid-premium-pt.json b/docs/translations/api-docs/data-grid/data-grid-premium-pt.json
index 8934aff24aa7a..d6a64421c38c5 100644
--- a/docs/translations/api-docs/data-grid/data-grid-premium-pt.json
+++ b/docs/translations/api-docs/data-grid/data-grid-premium-pt.json
@@ -90,6 +90,8 @@
"onEditRowsModelChange": "Callback fired when the editRowsModel changes.
Signature:
function(editRowsModel: GridEditRowsModel, details: GridCallbackDetails) => void
editRowsModel: With all properties from GridEditRowsModel.
details: Additional details for this callback.",
"onError": "Callback fired when an exception is thrown in the grid.
Signature:
function(args: any, event: MuiEvent<{}>, details: GridCallbackDetails) => void
args: The arguments passed to the showError call.
event: The event object.
details: Additional details for this callback.",
"onFilterModelChange": "Callback fired when the Filter model changes before the filters are applied.
Signature:
function(model: GridFilterModel, details: GridCallbackDetails) => void
model: With all properties from GridFilterModel.
details: Additional details for this callback.",
+ "onMenuClose": "Callback fired when the menu is closed.
Signature:
function(params: GridMenuParams, event: MuiEvent<{}>, details: GridCallbackDetails) => void
params: With all properties from GridMenuParams.
event: The event object.
details: Additional details for this callback.",
+ "onMenuOpen": "Callback fired when the menu is opened.
Signature:
function(params: GridMenuParams, event: MuiEvent<{}>, details: GridCallbackDetails) => void
params: With all properties from GridMenuParams.
event: The event object.
details: Additional details for this callback.",
"onPageChange": "Callback fired when the current page has changed.
Signature:
function(page: number, details: GridCallbackDetails) => void
page: Index of the page displayed on the Grid.
details: Additional details for this callback.",
"onPageSizeChange": "Callback fired when the page size has changed.
Signature:
function(pageSize: number, details: GridCallbackDetails) => void
pageSize: Size of the page displayed on the Grid.
details: Additional details for this callback.",
"onPinnedColumnsChange": "Callback fired when the pinned columns have changed.
Signature:
function(pinnedColumns: GridPinnedColumns, details: GridCallbackDetails) => void
pinnedColumns: The changed pinned columns.
details: Additional details for this callback.",
diff --git a/docs/translations/api-docs/data-grid/data-grid-premium-zh.json b/docs/translations/api-docs/data-grid/data-grid-premium-zh.json
index 8934aff24aa7a..d6a64421c38c5 100644
--- a/docs/translations/api-docs/data-grid/data-grid-premium-zh.json
+++ b/docs/translations/api-docs/data-grid/data-grid-premium-zh.json
@@ -90,6 +90,8 @@
"onEditRowsModelChange": "Callback fired when the editRowsModel changes.
Signature:
function(editRowsModel: GridEditRowsModel, details: GridCallbackDetails) => void
editRowsModel: With all properties from GridEditRowsModel.
details: Additional details for this callback.",
"onError": "Callback fired when an exception is thrown in the grid.
Signature:
function(args: any, event: MuiEvent<{}>, details: GridCallbackDetails) => void
args: The arguments passed to the showError call.
event: The event object.
details: Additional details for this callback.",
"onFilterModelChange": "Callback fired when the Filter model changes before the filters are applied.
Signature:
function(model: GridFilterModel, details: GridCallbackDetails) => void
model: With all properties from GridFilterModel.
details: Additional details for this callback.",
+ "onMenuClose": "Callback fired when the menu is closed.
Signature:
function(params: GridMenuParams, event: MuiEvent<{}>, details: GridCallbackDetails) => void
params: With all properties from GridMenuParams.
event: The event object.
details: Additional details for this callback.",
+ "onMenuOpen": "Callback fired when the menu is opened.
Signature:
function(params: GridMenuParams, event: MuiEvent<{}>, details: GridCallbackDetails) => void
params: With all properties from GridMenuParams.
event: The event object.
details: Additional details for this callback.",
"onPageChange": "Callback fired when the current page has changed.
Signature:
function(page: number, details: GridCallbackDetails) => void
page: Index of the page displayed on the Grid.
details: Additional details for this callback.",
"onPageSizeChange": "Callback fired when the page size has changed.
Signature:
function(pageSize: number, details: GridCallbackDetails) => void
pageSize: Size of the page displayed on the Grid.
details: Additional details for this callback.",
"onPinnedColumnsChange": "Callback fired when the pinned columns have changed.
Signature:
function(pinnedColumns: GridPinnedColumns, details: GridCallbackDetails) => void
pinnedColumns: The changed pinned columns.
details: Additional details for this callback.",
diff --git a/docs/translations/api-docs/data-grid/data-grid-premium.json b/docs/translations/api-docs/data-grid/data-grid-premium.json
index 8934aff24aa7a..d6a64421c38c5 100644
--- a/docs/translations/api-docs/data-grid/data-grid-premium.json
+++ b/docs/translations/api-docs/data-grid/data-grid-premium.json
@@ -90,6 +90,8 @@
"onEditRowsModelChange": "Callback fired when the editRowsModel changes.
Signature:
function(editRowsModel: GridEditRowsModel, details: GridCallbackDetails) => void
editRowsModel: With all properties from GridEditRowsModel.
details: Additional details for this callback.",
"onError": "Callback fired when an exception is thrown in the grid.
Signature:
function(args: any, event: MuiEvent<{}>, details: GridCallbackDetails) => void
args: The arguments passed to the showError call.
event: The event object.
details: Additional details for this callback.",
"onFilterModelChange": "Callback fired when the Filter model changes before the filters are applied.
Signature:
function(model: GridFilterModel, details: GridCallbackDetails) => void
model: With all properties from GridFilterModel.
details: Additional details for this callback.",
+ "onMenuClose": "Callback fired when the menu is closed.
Signature:
function(params: GridMenuParams, event: MuiEvent<{}>, details: GridCallbackDetails) => void
params: With all properties from GridMenuParams.
event: The event object.
details: Additional details for this callback.",
+ "onMenuOpen": "Callback fired when the menu is opened.
Signature:
function(params: GridMenuParams, event: MuiEvent<{}>, details: GridCallbackDetails) => void
params: With all properties from GridMenuParams.
event: The event object.
details: Additional details for this callback.",
"onPageChange": "Callback fired when the current page has changed.
Signature:
function(page: number, details: GridCallbackDetails) => void
page: Index of the page displayed on the Grid.
details: Additional details for this callback.",
"onPageSizeChange": "Callback fired when the page size has changed.
Signature:
function(pageSize: number, details: GridCallbackDetails) => void
pageSize: Size of the page displayed on the Grid.
details: Additional details for this callback.",
"onPinnedColumnsChange": "Callback fired when the pinned columns have changed.
Signature:
function(pinnedColumns: GridPinnedColumns, details: GridCallbackDetails) => void
pinnedColumns: The changed pinned columns.
details: Additional details for this callback.",
diff --git a/docs/translations/api-docs/data-grid/data-grid-pro-pt.json b/docs/translations/api-docs/data-grid/data-grid-pro-pt.json
index 7e676e3eb9045..5369389083256 100644
--- a/docs/translations/api-docs/data-grid/data-grid-pro-pt.json
+++ b/docs/translations/api-docs/data-grid/data-grid-pro-pt.json
@@ -90,6 +90,8 @@
"onEditRowsModelChange": "Callback fired when the editRowsModel changes.
Signature:
function(editRowsModel: GridEditRowsModel, details: GridCallbackDetails) => void
editRowsModel: With all properties from GridEditRowsModel.
details: Additional details for this callback.",
"onError": "Callback fired when an exception is thrown in the grid.
Signature:
function(args: any, event: MuiEvent<{}>, details: GridCallbackDetails) => void
args: The arguments passed to the showError call.
event: The event object.
details: Additional details for this callback.",
"onFilterModelChange": "Callback fired when the Filter model changes before the filters are applied.
Signature:
function(model: GridFilterModel, details: GridCallbackDetails) => void
model: With all properties from GridFilterModel.
details: Additional details for this callback.",
+ "onMenuClose": "Callback fired when the menu is closed.
Signature:
function(params: GridMenuParams, event: MuiEvent<{}>, details: GridCallbackDetails) => void
params: With all properties from GridMenuParams.
event: The event object.
details: Additional details for this callback.",
+ "onMenuOpen": "Callback fired when the menu is opened.
Signature:
function(params: GridMenuParams, event: MuiEvent<{}>, details: GridCallbackDetails) => void
params: With all properties from GridMenuParams.
event: The event object.
details: Additional details for this callback.",
"onPageChange": "Callback fired when the current page has changed.
Signature:
function(page: number, details: GridCallbackDetails) => void
page: Index of the page displayed on the Grid.
details: Additional details for this callback.",
"onPageSizeChange": "Callback fired when the page size has changed.
Signature:
function(pageSize: number, details: GridCallbackDetails) => void
pageSize: Size of the page displayed on the Grid.
details: Additional details for this callback.",
"onPinnedColumnsChange": "Callback fired when the pinned columns have changed.
Signature:
function(pinnedColumns: GridPinnedColumns, details: GridCallbackDetails) => void
pinnedColumns: The changed pinned columns.
details: Additional details for this callback.",
diff --git a/docs/translations/api-docs/data-grid/data-grid-pro-zh.json b/docs/translations/api-docs/data-grid/data-grid-pro-zh.json
index 7e676e3eb9045..5369389083256 100644
--- a/docs/translations/api-docs/data-grid/data-grid-pro-zh.json
+++ b/docs/translations/api-docs/data-grid/data-grid-pro-zh.json
@@ -90,6 +90,8 @@
"onEditRowsModelChange": "Callback fired when the editRowsModel changes.
Signature:
function(editRowsModel: GridEditRowsModel, details: GridCallbackDetails) => void
editRowsModel: With all properties from GridEditRowsModel.
details: Additional details for this callback.",
"onError": "Callback fired when an exception is thrown in the grid.
Signature:
function(args: any, event: MuiEvent<{}>, details: GridCallbackDetails) => void
args: The arguments passed to the showError call.
event: The event object.
details: Additional details for this callback.",
"onFilterModelChange": "Callback fired when the Filter model changes before the filters are applied.
Signature:
function(model: GridFilterModel, details: GridCallbackDetails) => void
model: With all properties from GridFilterModel.
details: Additional details for this callback.",
+ "onMenuClose": "Callback fired when the menu is closed.
Signature:
function(params: GridMenuParams, event: MuiEvent<{}>, details: GridCallbackDetails) => void
params: With all properties from GridMenuParams.
event: The event object.
details: Additional details for this callback.",
+ "onMenuOpen": "Callback fired when the menu is opened.
Signature:
function(params: GridMenuParams, event: MuiEvent<{}>, details: GridCallbackDetails) => void
params: With all properties from GridMenuParams.
event: The event object.
details: Additional details for this callback.",
"onPageChange": "Callback fired when the current page has changed.
Signature:
function(page: number, details: GridCallbackDetails) => void
page: Index of the page displayed on the Grid.
details: Additional details for this callback.",
"onPageSizeChange": "Callback fired when the page size has changed.
Signature:
function(pageSize: number, details: GridCallbackDetails) => void
pageSize: Size of the page displayed on the Grid.
details: Additional details for this callback.",
"onPinnedColumnsChange": "Callback fired when the pinned columns have changed.
Signature:
function(pinnedColumns: GridPinnedColumns, details: GridCallbackDetails) => void
pinnedColumns: The changed pinned columns.
details: Additional details for this callback.",
diff --git a/docs/translations/api-docs/data-grid/data-grid-pro.json b/docs/translations/api-docs/data-grid/data-grid-pro.json
index 7e676e3eb9045..5369389083256 100644
--- a/docs/translations/api-docs/data-grid/data-grid-pro.json
+++ b/docs/translations/api-docs/data-grid/data-grid-pro.json
@@ -90,6 +90,8 @@
"onEditRowsModelChange": "Callback fired when the editRowsModel changes.
Signature:
function(editRowsModel: GridEditRowsModel, details: GridCallbackDetails) => void
editRowsModel: With all properties from GridEditRowsModel.
details: Additional details for this callback.",
"onError": "Callback fired when an exception is thrown in the grid.
Signature:
function(args: any, event: MuiEvent<{}>, details: GridCallbackDetails) => void
args: The arguments passed to the showError call.
event: The event object.
details: Additional details for this callback.",
"onFilterModelChange": "Callback fired when the Filter model changes before the filters are applied.
Signature:
function(model: GridFilterModel, details: GridCallbackDetails) => void
model: With all properties from GridFilterModel.
details: Additional details for this callback.",
+ "onMenuClose": "Callback fired when the menu is closed.
Signature:
function(params: GridMenuParams, event: MuiEvent<{}>, details: GridCallbackDetails) => void
params: With all properties from GridMenuParams.
event: The event object.
details: Additional details for this callback.",
+ "onMenuOpen": "Callback fired when the menu is opened.
Signature:
function(params: GridMenuParams, event: MuiEvent<{}>, details: GridCallbackDetails) => void
params: With all properties from GridMenuParams.
event: The event object.
details: Additional details for this callback.",
"onPageChange": "Callback fired when the current page has changed.
Signature:
function(page: number, details: GridCallbackDetails) => void
page: Index of the page displayed on the Grid.
details: Additional details for this callback.",
"onPageSizeChange": "Callback fired when the page size has changed.
Signature:
function(pageSize: number, details: GridCallbackDetails) => void
pageSize: Size of the page displayed on the Grid.
details: Additional details for this callback.",
"onPinnedColumnsChange": "Callback fired when the pinned columns have changed.
Signature:
function(pinnedColumns: GridPinnedColumns, details: GridCallbackDetails) => void
pinnedColumns: The changed pinned columns.
details: Additional details for this callback.",
diff --git a/docs/translations/api-docs/data-grid/data-grid-pt.json b/docs/translations/api-docs/data-grid/data-grid-pt.json
index 360892c8b220d..4d8089602fef9 100644
--- a/docs/translations/api-docs/data-grid/data-grid-pt.json
+++ b/docs/translations/api-docs/data-grid/data-grid-pt.json
@@ -69,6 +69,8 @@
"onEditRowsModelChange": "Callback fired when the editRowsModel changes.
Signature:
function(editRowsModel: GridEditRowsModel, details: GridCallbackDetails) => void
editRowsModel: With all properties from GridEditRowsModel.
details: Additional details for this callback.",
"onError": "Callback fired when an exception is thrown in the grid.
Signature:
function(args: any, event: MuiEvent<{}>, details: GridCallbackDetails) => void
args: The arguments passed to the showError call.
event: The event object.
details: Additional details for this callback.",
"onFilterModelChange": "Callback fired when the Filter model changes before the filters are applied.
Signature:
function(model: GridFilterModel, details: GridCallbackDetails) => void
model: With all properties from GridFilterModel.
details: Additional details for this callback.",
+ "onMenuClose": "Callback fired when the menu is closed.
Signature:
function(params: GridMenuParams, event: MuiEvent<{}>, details: GridCallbackDetails) => void
params: With all properties from GridMenuParams.
event: The event object.
details: Additional details for this callback.",
+ "onMenuOpen": "Callback fired when the menu is opened.
Signature:
function(params: GridMenuParams, event: MuiEvent<{}>, details: GridCallbackDetails) => void
params: With all properties from GridMenuParams.
event: The event object.
details: Additional details for this callback.",
"onPageChange": "Callback fired when the current page has changed.
Signature:
function(page: number, details: GridCallbackDetails) => void
page: Index of the page displayed on the Grid.
details: Additional details for this callback.",
"onPageSizeChange": "Callback fired when the page size has changed.
Signature:
function(pageSize: number, details: GridCallbackDetails) => void
pageSize: Size of the page displayed on the Grid.
details: Additional details for this callback.",
"onPreferencePanelClose": "Callback fired when the preferences panel is closed.
Signature:
function(params: GridPreferencePanelParams, event: MuiEvent<{}>, details: GridCallbackDetails) => void
params: With all properties from GridPreferencePanelParams.
event: The event object.
details: Additional details for this callback.",
diff --git a/docs/translations/api-docs/data-grid/data-grid-zh.json b/docs/translations/api-docs/data-grid/data-grid-zh.json
index 360892c8b220d..4d8089602fef9 100644
--- a/docs/translations/api-docs/data-grid/data-grid-zh.json
+++ b/docs/translations/api-docs/data-grid/data-grid-zh.json
@@ -69,6 +69,8 @@
"onEditRowsModelChange": "Callback fired when the editRowsModel changes.
Signature:
function(editRowsModel: GridEditRowsModel, details: GridCallbackDetails) => void
editRowsModel: With all properties from GridEditRowsModel.
details: Additional details for this callback.",
"onError": "Callback fired when an exception is thrown in the grid.
Signature:
function(args: any, event: MuiEvent<{}>, details: GridCallbackDetails) => void
args: The arguments passed to the showError call.
event: The event object.
details: Additional details for this callback.",
"onFilterModelChange": "Callback fired when the Filter model changes before the filters are applied.
Signature:
function(model: GridFilterModel, details: GridCallbackDetails) => void
model: With all properties from GridFilterModel.
details: Additional details for this callback.",
+ "onMenuClose": "Callback fired when the menu is closed.
Signature:
function(params: GridMenuParams, event: MuiEvent<{}>, details: GridCallbackDetails) => void
params: With all properties from GridMenuParams.
event: The event object.
details: Additional details for this callback.",
+ "onMenuOpen": "Callback fired when the menu is opened.
Signature:
function(params: GridMenuParams, event: MuiEvent<{}>, details: GridCallbackDetails) => void
params: With all properties from GridMenuParams.
event: The event object.
details: Additional details for this callback.",
"onPageChange": "Callback fired when the current page has changed.
Signature:
function(page: number, details: GridCallbackDetails) => void
page: Index of the page displayed on the Grid.
details: Additional details for this callback.",
"onPageSizeChange": "Callback fired when the page size has changed.
Signature:
function(pageSize: number, details: GridCallbackDetails) => void
pageSize: Size of the page displayed on the Grid.
details: Additional details for this callback.",
"onPreferencePanelClose": "Callback fired when the preferences panel is closed.
Signature:
function(params: GridPreferencePanelParams, event: MuiEvent<{}>, details: GridCallbackDetails) => void
params: With all properties from GridPreferencePanelParams.
event: The event object.
details: Additional details for this callback.",
diff --git a/docs/translations/api-docs/data-grid/data-grid.json b/docs/translations/api-docs/data-grid/data-grid.json
index 360892c8b220d..4d8089602fef9 100644
--- a/docs/translations/api-docs/data-grid/data-grid.json
+++ b/docs/translations/api-docs/data-grid/data-grid.json
@@ -69,6 +69,8 @@
"onEditRowsModelChange": "Callback fired when the editRowsModel changes.
Signature:
function(editRowsModel: GridEditRowsModel, details: GridCallbackDetails) => void
editRowsModel: With all properties from GridEditRowsModel.
details: Additional details for this callback.",
"onError": "Callback fired when an exception is thrown in the grid.
Signature:
function(args: any, event: MuiEvent<{}>, details: GridCallbackDetails) => void
args: The arguments passed to the showError call.
event: The event object.
details: Additional details for this callback.",
"onFilterModelChange": "Callback fired when the Filter model changes before the filters are applied.
Signature:
function(model: GridFilterModel, details: GridCallbackDetails) => void
model: With all properties from GridFilterModel.
details: Additional details for this callback.",
+ "onMenuClose": "Callback fired when the menu is closed.
Signature:
function(params: GridMenuParams, event: MuiEvent<{}>, details: GridCallbackDetails) => void
params: With all properties from GridMenuParams.
event: The event object.
details: Additional details for this callback.",
+ "onMenuOpen": "Callback fired when the menu is opened.
Signature:
function(params: GridMenuParams, event: MuiEvent<{}>, details: GridCallbackDetails) => void
params: With all properties from GridMenuParams.
event: The event object.
details: Additional details for this callback.",
"onPageChange": "Callback fired when the current page has changed.
Signature:
function(page: number, details: GridCallbackDetails) => void
page: Index of the page displayed on the Grid.
details: Additional details for this callback.",
"onPageSizeChange": "Callback fired when the page size has changed.
Signature:
function(pageSize: number, details: GridCallbackDetails) => void
pageSize: Size of the page displayed on the Grid.
details: Additional details for this callback.",
"onPreferencePanelClose": "Callback fired when the preferences panel is closed.
Signature:
function(params: GridPreferencePanelParams, event: MuiEvent<{}>, details: GridCallbackDetails) => void
params: With all properties from GridPreferencePanelParams.
event: The event object.
details: Additional details for this callback.",
diff --git a/packages/grid/x-data-grid-premium/src/DataGridPremium/DataGridPremium.tsx b/packages/grid/x-data-grid-premium/src/DataGridPremium/DataGridPremium.tsx
index 5041846f5caf8..1888288ac51da 100644
--- a/packages/grid/x-data-grid-premium/src/DataGridPremium/DataGridPremium.tsx
+++ b/packages/grid/x-data-grid-premium/src/DataGridPremium/DataGridPremium.tsx
@@ -604,6 +604,20 @@ DataGridPremiumRaw.propTypes = {
* @param {GridCallbackDetails} details Additional details for this callback.
*/
onFilterModelChange: PropTypes.func,
+ /**
+ * Callback fired when the menu is closed.
+ * @param {GridMenuParams} params With all properties from [[GridMenuParams]].
+ * @param {MuiEvent<{}>} event The event object.
+ * @param {GridCallbackDetails} details Additional details for this callback.
+ */
+ onMenuClose: PropTypes.func,
+ /**
+ * Callback fired when the menu is opened.
+ * @param {GridMenuParams} params With all properties from [[GridMenuParams]].
+ * @param {MuiEvent<{}>} event The event object.
+ * @param {GridCallbackDetails} details Additional details for this callback.
+ */
+ onMenuOpen: PropTypes.func,
/**
* Callback fired when the current page has changed.
* @param {number} page Index of the page displayed on the Grid.
diff --git a/packages/grid/x-data-grid-pro/src/DataGridPro/DataGridPro.tsx b/packages/grid/x-data-grid-pro/src/DataGridPro/DataGridPro.tsx
index 9e9b451ad59cb..8c081a3d59db6 100644
--- a/packages/grid/x-data-grid-pro/src/DataGridPro/DataGridPro.tsx
+++ b/packages/grid/x-data-grid-pro/src/DataGridPro/DataGridPro.tsx
@@ -601,6 +601,20 @@ DataGridProRaw.propTypes = {
* @param {GridCallbackDetails} details Additional details for this callback.
*/
onFilterModelChange: PropTypes.func,
+ /**
+ * Callback fired when the menu is closed.
+ * @param {GridMenuParams} params With all properties from [[GridMenuParams]].
+ * @param {MuiEvent<{}>} event The event object.
+ * @param {GridCallbackDetails} details Additional details for this callback.
+ */
+ onMenuClose: PropTypes.func,
+ /**
+ * Callback fired when the menu is opened.
+ * @param {GridMenuParams} params With all properties from [[GridMenuParams]].
+ * @param {MuiEvent<{}>} event The event object.
+ * @param {GridCallbackDetails} details Additional details for this callback.
+ */
+ onMenuOpen: PropTypes.func,
/**
* Callback fired when the current page has changed.
* @param {number} page Index of the page displayed on the Grid.
diff --git a/packages/grid/x-data-grid/src/DataGrid/DataGrid.tsx b/packages/grid/x-data-grid/src/DataGrid/DataGrid.tsx
index 0d7b34b455e1e..5a8e1124ab14d 100644
--- a/packages/grid/x-data-grid/src/DataGrid/DataGrid.tsx
+++ b/packages/grid/x-data-grid/src/DataGrid/DataGrid.tsx
@@ -463,6 +463,20 @@ DataGridRaw.propTypes = {
* @param {GridCallbackDetails} details Additional details for this callback.
*/
onFilterModelChange: PropTypes.func,
+ /**
+ * Callback fired when the menu is closed.
+ * @param {GridMenuParams} params With all properties from [[GridMenuParams]].
+ * @param {MuiEvent<{}>} event The event object.
+ * @param {GridCallbackDetails} details Additional details for this callback.
+ */
+ onMenuClose: PropTypes.func,
+ /**
+ * Callback fired when the menu is opened.
+ * @param {GridMenuParams} params With all properties from [[GridMenuParams]].
+ * @param {MuiEvent<{}>} event The event object.
+ * @param {GridCallbackDetails} details Additional details for this callback.
+ */
+ onMenuOpen: PropTypes.func,
/**
* Callback fired when the current page has changed.
* @param {number} page Index of the page displayed on the Grid.
diff --git a/packages/grid/x-data-grid/src/components/menu/GridMenu.tsx b/packages/grid/x-data-grid/src/components/menu/GridMenu.tsx
index 53b83b37b529d..3ebbe07bbaeff 100644
--- a/packages/grid/x-data-grid/src/components/menu/GridMenu.tsx
+++ b/packages/grid/x-data-grid/src/components/menu/GridMenu.tsx
@@ -11,6 +11,7 @@ import { HTMLElementType } from '@mui/utils';
import { getDataGridUtilityClass, gridClasses } from '../../constants/gridClasses';
import { DataGridProcessedProps } from '../../models/props/DataGridProps';
import { useGridRootProps } from '../../hooks/utils/useGridRootProps';
+import { useGridApiContext } from '../../hooks/utils/useGridApiContext';
type MenuPosition =
| 'bottom-end'
@@ -65,6 +66,7 @@ const transformOrigin = {
const GridMenu = (props: GridMenuProps) => {
const { open, target, onClickAway, children, position, className, onExited, ...other } = props;
+ const apiRef = useGridApiContext();
const prevTarget = React.useRef(target);
const prevOpen = React.useRef(open);
const rootProps = useGridRootProps();
@@ -76,9 +78,13 @@ const GridMenu = (props: GridMenuProps) => {
(prevTarget.current as HTMLElement).focus();
}
+ // Emit menuOpen or menuClose events
+ const eventName = open ? 'menuOpen' : 'menuClose';
+ apiRef.current.publishEvent(eventName, { target });
+
prevOpen.current = open;
prevTarget.current = target;
- }, [open, target]);
+ }, [apiRef, open, target]);
const handleExited = (popperOnExited: (() => {}) | undefined) => (node: HTMLElement) => {
if (popperOnExited) {
diff --git a/packages/grid/x-data-grid/src/hooks/features/events/useGridEvents.ts b/packages/grid/x-data-grid/src/hooks/features/events/useGridEvents.ts
index d875d023520d1..1b2f696b0e903 100644
--- a/packages/grid/x-data-grid/src/hooks/features/events/useGridEvents.ts
+++ b/packages/grid/x-data-grid/src/hooks/features/events/useGridEvents.ts
@@ -28,6 +28,8 @@ export function useGridEvents(
| 'onRowClick'
| 'onError'
| 'onStateChange'
+ | 'onMenuOpen'
+ | 'onMenuClose'
>,
): void {
useGridApiOptionHandler(apiRef, 'columnHeaderClick', props.onColumnHeaderClick);
@@ -46,6 +48,9 @@ export function useGridEvents(
useGridApiOptionHandler(apiRef, 'preferencePanelClose', props.onPreferencePanelClose);
useGridApiOptionHandler(apiRef, 'preferencePanelOpen', props.onPreferencePanelOpen);
+ useGridApiOptionHandler(apiRef, 'menuOpen', props.onMenuOpen);
+ useGridApiOptionHandler(apiRef, 'menuClose', props.onMenuClose);
+
useGridApiOptionHandler(apiRef, 'rowDoubleClick', props.onRowDoubleClick);
useGridApiOptionHandler(apiRef, 'rowClick', props.onRowClick);
diff --git a/packages/grid/x-data-grid/src/models/events/gridEventLookup.ts b/packages/grid/x-data-grid/src/models/events/gridEventLookup.ts
index 2f930f7e2f597..e58c89a7a628a 100644
--- a/packages/grid/x-data-grid/src/models/events/gridEventLookup.ts
+++ b/packages/grid/x-data-grid/src/models/events/gridEventLookup.ts
@@ -7,6 +7,7 @@ import type {
GridColumnVisibilityChangeParams,
GridEditCellPropsParams,
GridHeaderSelectionCheckboxParams,
+ GridMenuParams,
GridPreferencePanelParams,
GridRowParams,
GridRowSelectionCheckboxParams,
@@ -502,4 +503,14 @@ export interface GridEventLookup
* Fired when the preference panel is opened.
*/
preferencePanelOpen: { params: GridPreferencePanelParams };
+
+ // Menu
+ /**
+ * Fired when the menu is opened.
+ */
+ menuOpen: { params: GridMenuParams };
+ /**
+ * Fired when the grid menu is closed.
+ */
+ menuClose: { params: GridMenuParams };
}
diff --git a/packages/grid/x-data-grid/src/models/events/gridEvents.ts b/packages/grid/x-data-grid/src/models/events/gridEvents.ts
index b159add1114ba..c0ed8b4b0cbd9 100644
--- a/packages/grid/x-data-grid/src/models/events/gridEvents.ts
+++ b/packages/grid/x-data-grid/src/models/events/gridEvents.ts
@@ -82,6 +82,8 @@ enum GridEvents {
virtualScrollerTouchMove = 'virtualScrollerTouchMove',
preferencePanelClose = 'preferencePanelClose',
preferencePanelOpen = 'preferencePanelOpen',
+ menuOpen = 'menuOpen',
+ menuClose = 'menuClose',
}
export type GridEventsStr = keyof GridEventLookup;
diff --git a/packages/grid/x-data-grid/src/models/params/gridMenuParams.ts b/packages/grid/x-data-grid/src/models/params/gridMenuParams.ts
new file mode 100644
index 0000000000000..3fa784e15a029
--- /dev/null
+++ b/packages/grid/x-data-grid/src/models/params/gridMenuParams.ts
@@ -0,0 +1,6 @@
+export interface GridMenuParams {
+ /**
+ * The element that opens the menu.
+ */
+ target: React.ReactNode;
+}
diff --git a/packages/grid/x-data-grid/src/models/params/index.ts b/packages/grid/x-data-grid/src/models/params/index.ts
index 7ffe98df88917..42de04598300a 100644
--- a/packages/grid/x-data-grid/src/models/params/index.ts
+++ b/packages/grid/x-data-grid/src/models/params/index.ts
@@ -11,3 +11,4 @@ export * from './gridValueOptionsParams';
export * from './gridCellParams';
export * from './gridSortModelParams';
export * from './gridPreferencePanelParams';
+export * from './gridMenuParams';
diff --git a/packages/grid/x-data-grid/src/models/props/DataGridProps.ts b/packages/grid/x-data-grid/src/models/props/DataGridProps.ts
index 8af3305e4d71e..9098df9d7c7ea 100644
--- a/packages/grid/x-data-grid/src/models/props/DataGridProps.ts
+++ b/packages/grid/x-data-grid/src/models/props/DataGridProps.ts
@@ -612,6 +612,20 @@ export interface DataGridPropsWithoutDefaultValue;
+ /**
+ * Callback fired when the menu is opened.
+ * @param {GridMenuParams} params With all properties from [[GridMenuParams]].
+ * @param {MuiEvent<{}>} event The event object.
+ * @param {GridCallbackDetails} details Additional details for this callback.
+ */
+ onMenuOpen?: GridEventListener<'menuOpen'>;
+ /**
+ * Callback fired when the menu is closed.
+ * @param {GridMenuParams} params With all properties from [[GridMenuParams]].
+ * @param {MuiEvent<{}>} event The event object.
+ * @param {GridCallbackDetails} details Additional details for this callback.
+ */
+ onMenuClose?: GridEventListener<'menuClose'>;
/**
* Set the edit rows model of the grid.
*/
diff --git a/scripts/x-data-grid-premium.exports.json b/scripts/x-data-grid-premium.exports.json
index a7534bacbf687..8b905f8f3b702 100644
--- a/scripts/x-data-grid-premium.exports.json
+++ b/scripts/x-data-grid-premium.exports.json
@@ -296,6 +296,7 @@
{ "name": "GridLocaleTextApi", "kind": "Interface" },
{ "name": "GridMenu", "kind": "Variable" },
{ "name": "GridMenuIcon", "kind": "Variable" },
+ { "name": "GridMenuParams", "kind": "Interface" },
{ "name": "GridMenuProps", "kind": "Interface" },
{ "name": "GridMoreVertIcon", "kind": "Variable" },
{ "name": "GridNativeColTypes", "kind": "TypeAlias" },
diff --git a/scripts/x-data-grid-pro.exports.json b/scripts/x-data-grid-pro.exports.json
index c1d7607ce07f0..ad7cac5664091 100644
--- a/scripts/x-data-grid-pro.exports.json
+++ b/scripts/x-data-grid-pro.exports.json
@@ -290,6 +290,7 @@
{ "name": "GridLocaleTextApi", "kind": "Interface" },
{ "name": "GridMenu", "kind": "Variable" },
{ "name": "GridMenuIcon", "kind": "Variable" },
+ { "name": "GridMenuParams", "kind": "Interface" },
{ "name": "GridMenuProps", "kind": "Interface" },
{ "name": "GridMoreVertIcon", "kind": "Variable" },
{ "name": "GridNativeColTypes", "kind": "TypeAlias" },
diff --git a/scripts/x-data-grid.exports.json b/scripts/x-data-grid.exports.json
index 98ef7204d11e9..4ba642f990fa1 100644
--- a/scripts/x-data-grid.exports.json
+++ b/scripts/x-data-grid.exports.json
@@ -265,6 +265,7 @@
{ "name": "GridLocaleTextApi", "kind": "Interface" },
{ "name": "GridMenu", "kind": "Variable" },
{ "name": "GridMenuIcon", "kind": "Variable" },
+ { "name": "GridMenuParams", "kind": "Interface" },
{ "name": "GridMenuProps", "kind": "Interface" },
{ "name": "GridMoreVertIcon", "kind": "Variable" },
{ "name": "GridNativeColTypes", "kind": "TypeAlias" },