How to use custom component in Material React Table

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}
    />