Row height on content size

[Pabliomen]

Use case

We are using a custom component in a row which can grow in height. With the current rowHeight prop u have to specify a height. It would be nice if the height of a row can grow by the content of the data / child component.

Proposed solution

Instead of defaulting to a rowHeight of 35px. can we default to the data / component height? Or add a possibility to use auto height.

[amanmahajan7]

This is a tricky feature to implement as the grid needs fixed height to support virtualization. We would be happy to accept a PR if anyone has any idea

[iranana]

I had a brief look at this, and it seems like a fair amount of refactoring would be needed, since measurement occurs before the content is rendered. Even if it was possible to re-run and measure the content in the rowHeight function, I guess the scroll height would jump around as you scroll, which is a bit weird for usability.

Disabling virtualization and applying a CSS hack is probably the most straightforward way to accomplish this - something like the snippet below. This solution isn't ideal, but it appears to behave OK.

.test-grid {
    grid-template-rows: 35px !important;
    grid-auto-rows: max-content !important;

    .rdg-cell {
        contain: none !important;
    }
}