[Feature Request]: Enable `DataTable` to contain both expandable and non-expandable rows

[btepe]

The problem

We have a use-case, where we need both rows that are expandable and ones that are not expandable in the same DataTable. This is possible, but the styling is off, as a non-expandable row has no arrow button, so the cells of the different rows don't align anymore.

A possible hack is to use the TableExpandHeader in the rows that are not expandable: Stackblitz

This is however not perfect, as the component was built to be used in the header and the header cells have different padding. The content is better aligned, but not perfect, so some custom styling would be necessary.

The solution

The easiest solution imo would be to provide a component similar to the TableExpandHeader that people can use in the non-expandable rows.

An alternative would be to provide a Row component that has this built in, similar to the TableExpandRow.

The easiest solution as a user of the library would be if this was determined on the table level and the padding of the whole table including the header was adjusted without having to use additional components. I don't see a case for instance, where someone would use expandable rows and not need the header spacing.

Examples

No response

Application/PAL

No response

Business priority

None

Available extra resources

No response

Code of Conduct

• [X] I agree to follow this project's Code of Conduct

[sstrubberg]

hey @btepe thanks for submitting this feature request, after consulting with our design team, we would need to further understand your use-case more, perhaps with some designs mocks.