When using custom edit component muiTableBodyCellEditTextFieldProps not firing in table edit mode

[mbmohib]

material-react-table version

v1.13.0

react & react-dom versions

react: 18.2.12, react dom: 18.2.5

Describe the bug and the steps to reproduce it

1. Set editingMode to table
2. Use any custom edit component like DatePicker, Select
3. muiTableBodyCellEditTextFieldProps not firing with onBlur or onChange

Minimal, Reproducible Example - (Optional, but Recommended)

https://codesandbox.io/p/sandbox/dazzling-shadow-cvvzmf?file=/package.json:25,27-25,33

Screenshots or Videos (Optional)

No response

Do you intend to try to help solve this bug with your own PR?

Yes, I exactly don't know how to fix it, but I have some idea and open to discuss it in the comments of this issue

Terms

• [X] I understand that if my bug cannot be reliably reproduced in a debuggable environment, it will probably not be fixed and this issue may even be closed.

[mbmohib]

Hi @KevinVandy, if we already have any solutions please let me know, otherwise let me know your thoughts on this.

In the MRT_EditCellTextField component on line 90, it's not exposing any onChange/onBlur/onSelect handler for custom edit component.

And the current onBlur or onChange is tightly coupled with the TextField component, so we need to pass the respected event, So instead I think we can expose some custom generic handler that will accept a key value, and internally update the value and also the cache value. In this way when we are using the row edit mode. We don't need to update it like this

row._valuesCache.key = value and also it will reflect the updated value on the component, this will solve this issue 599 also.

Also for table edit mode, we can introduce another generic prop like muiTableBodyCellEditProps that will fire for every edit component regardless of custom or internal.