I would like to provide a custom component when editing/displaying data the storybook example is here. However this prop muiTableBodyCellEditTextFieldProps
does not allow me to render a custom component nor is it flexible enough to take “any component” I feed into it.
<MaterialReactTable
columns={[
{
header: 'First Name',
accessorKey: 'firstName',
},
{
header: 'State',
accessorKey: 'state',
muiTableBodyCellEditTextFieldProps: () => ({
children: usStates.map((state) => (
<MenuItem key={state} value={state}>
{state}
</MenuItem>
)),
select: true,
}),
},
]}
data={tableData}
enableRowActions
enableEditing
muiTableBodyCellEditTextFieldProps={{ variant: 'outlined' }}
onEditingRowSave={handleSaveRow}
/>