Material-table: Dynamic height based on parent div

[loganmcflurry]

Is your feature request related to a problem? Please describe.
I need to be able to dynamically adjust the height of a table based on the parent / context div's height. It appears as though the hooks exist for dynamic re-sizing vertically (i.e. through the vh capability in the maxBodyHeight prop) and the functionality is already fully implemented for re-sizing horizontally based on a div (i.e. if you have an expandable div in the width dimension, the table resizes accordingly), but it doesn't currently work in the height dimension when based on the div.

Describe the solution you'd like
Adding % functionality to the maxBodyHeight prop, or another way altogether that allows for dynamic height size based on the surrounding div.

Describe alternatives you've considered
Alternatively (a quicker but less direct solution), if classnames are added to the table's overflow-x: auto and overflow-y: auto divs, it's possible to override the CSS styling in such a way that height is resizable.

I noticed that ...props.style was added to the Container but if this was also added to those child divs, this behavior may be attainable, so long as each div is modifiable uniquely.

Additional context
There was an issue brought up and addressed a couple weeks ago (#556) regarding '%' handling in the table, and the reply was that it can't be applied based on the parent component that isn't specified a height. I still feel as though this is possible since all the hooks appear to be there when resizing based on the viewport (vh) and it already works in terms of the width.

[mbrn]

Hi @loganmcflurry

Actually maxBodyHeight is not an effective solution to give a height to body. I tried many ways but only this solution works. You can set only vh or px unit to maxBodyHeight.

[zhaoyao91]

@mbrn Hi

This feature is useful in our project, and I have made a workaround via pure css which may help you implement it.

see https://codesandbox.io/s/demo-material-table-strech-size-l3b4l

You can try to resize the .container to see the table properly stretch to fit the container.

[Cnordbo]

Is this fixed somehow? or is there still help wanted?

I think this issue should be left open if its not fixed.

[abhishekpokhrel]

My fix was to set the bodyheight in vh so that it is relative to every screen device's height.
E.g. maxBodyHeight: "75vh",
minBodyHeight: "75vh",