I want to change subrow css

[ChanoPark]

Hello!

I refer to the following page to implement subrow.
https://www.material-react-table.com/docs/guides/expanding-sub-rows

As mentioned in the previous question, the size of the table is fixed, so there is a problem that the indentation of subrows does not occur. So I'm trying to change the font-weight to put a difference.

So when I declared the columns I wrote:

If data.data.select.sub is true, isExpand set true.
row.depth is 0, I decide subrow and change the font-weight to bold. otherwise, normal.

Contrary to expectations, a random line turns bold every time it renders. (Presumed to be order dependent)

Can I change the color and thickness of only the row except the sub row?

Thank you!

[KevinVandy]

Welp don't do it that way. Manual mutations like that in React are not good. Just use the muiTableBodyCellProps directly in your column definitions. I suggest reading the Customizing Components Guide Docs where this is discussed

You probably want something like

muiTableBodyCellProps: ({ cell, row }) => ({ //get your data from row.original probably
  sx: {
    fontWeight: condition ? 'bold' : 'normal'
  }
})

[ChanoPark]

Thank you for always :)