[data grid] Is it possible to expand detail panel on row click or on any other columns

[niralivasoya]

Steps to reproduce

I want to expand and collapse the detail panel when we click on the full row or the name(column) of the row.

Current behavior

we can expand the detail panel when we click on the + icon.

Expected behavior

I want to expand and collapse the detail panel content when we click on the full row or on the name column (either).

Context

No response

Your environment

I am using the Brave browser. This is the version I have:

Search keywords: data grid, master detail, detail panel, data grid pro

[rajeshreddy-bheemireddy]

@niralivasoya I think we can customize the toggle using the toggleDetailPanel prop.
You can refer here to the closed issues.
Link
Hope this helps.

[cherniavskii]

Hi @niralivasoya
Sure, it's possible.
Here's a working demo: https://stackblitz.com/edit/react-djm6e5?file=Demo.tsx

[cherniavskii]

@michelengelen Should we add a recipe for this?

[niralivasoya]

Thank you @cherniavskii for the working example. It is really helpful.