Give an option to change height dynamically

[nitzanorchestra]

Hi, I want to change the height of one of dynamically when above it overflows (I have a collapse inside it), is there a way to do that?

If I change it by myself (by changing the flex property to 0 for example), it works only for the first time protecting the overflow.

Here's an illustration:

<ReflexElement
    propagateDimensionsRate={200}
    propagateDimensions={true}
    flex={this.state.maximizeGraph}
>
    {/* Let's say this element overflows */}
    <Elem onUserOpenButOverflow={() => {
               this.setState({ maximizeGraph: true })
               console.log('should maximize graph')
    }} />
</ReflexElement>
    <ReflexSplitter onResize={() => {
        // this.setState({ maximizeGraph: false });
        // console.log('should revert to the previous uncontrolled')
    }} />
    <ReflexElement minSize={225}>
        <Elem></Elem>
    </ReflexElement>
</ReflexContainer>

[leefsmp]

I'm not sure I understand correctly the question. Please provide a more accurate description along with a sandbox demo if possible.

Setting flex to 0 will provoke errors as the internal logic will be unable to recompute the size out of a 0 flex. A simple solution is to set a tiny minimal value for the minSize and if you want to completely hide a ReflexElement, you can just use a boolean flag that will skip rendering at all.

[leefsmp]

Closing for now, feel free to reopen with more detailed description as requested above. Thanks.