Row expansion and nested table: nested row instead of nested tables

Is your feature request related to a problem? Please describe.
When using the nested table feature, if the nested table data has the same type than the parent table, there is an issue with columns width not maching parent columns width, it's also not compatible with column resizing.

Of course we can use fixed columns width some issues, but it then adapt poorly to dynamic content.

Describe the solution you'd like
Instead of adding an extra row with colspan and a new table inside, we could have an option to set new rows.
We can't use collapse with table tr, but in this example we can see a way to animate toggling rows : https://stackoverflow.com/a/37376274
We could have an extra property to add new content "as rows":

return (
  <DataTable
    withTableBorder
    withColumnBorders
    columns={[{ accessor: 'name' }, { accessor: 'city' }, { accessor: 'state' }]}
    records={records}
    rowExpansion={{
      rows: [], // 👈 set this to add new "nested" rows
      // ...
    }}
  />
);

This could exists along with the content property to both add rows and nested content (and not breaking curent implementations)

Start at the DataTable rowExpansion implementation and existing content behavior, then compare the proposed rows API with the linked table-row animation example. Done means nested same-type data can render as rows aligned with parent columns and coexist with content without breaking current implementations.