Tab Height Question

[mmacfadden]

Nice job on this library, it is very feature rich!

I have a question. It seems like tabs are shown and hidden partially by using the "height" attribute on the div that holds the tab. In my situation, I am using a flex layout, and the tab container is taking up 100% of the vertical width of the page. I am putting a text editor component in the tabs, and the text editor will control the vertical scrolling of the content. Therefore, when the current tab is selected, I need it to take up the remaining space in the layout.

However, it seems like the tab will remove all height attributes when it is shown. This would mean the child component is what would determine the height of the tab. But I need the reverse. I need to tab to take up all extra space in the layout and then set the child to be 100% of the tab.

Is anything like this possible?

I was perhaps thinking that the visibility of the tabs could be controlled with the CSS visibility: hidden / visible attribute rather than setting the height to 0px with an overflow of hidden. I was looking at the containerStyle and hiddenStyle, but am still not sure how those work.

[PeterSchulzNL]

Try this:

<Tab containerStyle={{height: "100%"}}>
    <YourComponent />
</Tab>

Make sure all your child components have 100% height as well.