Currently, the visibility of the Tabs component cannot be managed consistently across the entire component and its subcomponents.
When applying styles to control visibility (e.g. hiding the Tabs), the styling is only applied to the Tabs header. The associated Tab content remains visible, which leads to inconsistent and unexpected UI behavior.
This makes it difficult to fully hide or conditionally render Tabs as a single, cohesive component.
Expected Behavior:
- Visibility styles applied to Tabs should affect the entire component
- Tabs header and Tab content should be hidden/shown together
Example to reproduce::
tabs = Tabs(
id="tabs", value=0, children=[tab1, tab2, tab3], style={"visibility": "hidden"}
)
style = {"visibility": "visible"} :
style = {"visibility": "hidden"} :
