Allow to specify unmountOnExit for TabPanel or Tabs

Currently, tab content will unmount upon switching to another tab. That can remain the default. It would be great however to be able to specify for tab to “stay alive” when it’s no longer the active tab. Could be done at tab level, or if it’s too difficult, ad the Tabs level (i.e. the behaviour will apply to all tabs). Understandably there is a performance implication, hence by default this behaviour should not be enabled.

Summary 💡

per tab

<TabPanel value={value} index="one" unmountOnExit={false}>
    Item One
 </TabPanel>
<TabPanel value={value} index="two">
    Item Two
</TabPanel>

if too difficult – for all tabs

<Tabs value={value} onChange={handleChange} unmountOnExit={false} aria-label="wrapped label tabs example">
</Tabs>
<TabPanel value={value} index="one">
    Item One
</TabPanel>
<TabPanel value={value} index="two">
    Item Two
</TabPanel>

Motivation 🔦

I have tabs with fairly small amount of content. I would like them to maintain self-contained state. That state will be lost upon unmount. The solution is fairly simple to keep the state elsewhere, OR, have an option to simply not have the component unmount …

Thanks!!!

[clearwaterstream]

@eps1lon Thank for following up. Apologies, after reading your comment I realize may not be using the right terminology. Indeed in the samples TabPanel is a div with a hidden flag.

Let me better describe the problem:

What I find odd is that if I use Collapse or Accordion, the content in each of the accordion cards “survives” the expand / collapse cycle. When using Tabs, if I’m using the state hook for anything within the TabPanel, the state resets when I jump off and back into any particular tab. It’s as if the tab is getting created anew and the useState hook is not doing what it’s supposed to.

I’ll compile an example with Accordion and same one with Tabs to demonstrate the behaviour difference … if I can’g repro then it’s something on my end and I’ll just close the issue.

[nico-hernandez]

@oliviertassinari yes #21250 describes my issue perfectly – “Lost states between different panels (by keeping the panels mounted)”

Not sure why I did not find it in open issues, I think I was searching for tabs and unmountOnExit

Did you get any solution or workaround? I think we are in the same boat, I’m trying to replicate Accordion behaviour (unmount=false) in Tabs but I wasn’t successful.