Avoid resetting scroll state on switching tabs in tabbed container

I have a tabbed container, and my typical app flow is: browse a table in tab 1, then click to zoom into details on tab 2. The issue is that when I return to tab 1, it has reset the scroll of my table all the way back to the top

Hi @matt1 Thanks for reaching out -- I'll make a feature request to maintain the scroll position!

Hi @matt1,

While we don't yet have a component setting for maintaining the position, I wonder if you can solve this using scrollIntoView for the time being?

You could have a state variable that gets updated when you click to zoom into details on tab 2. In this example, I'm setting the variable (called scrollPosition) to be the name of the component I'll want to scroll back to when I go back to tab1:

Then, when you change back to tab 1, you could check if the state variable has been set, and if so, scroll to that component:

Hi @Tess, I'm just starting to get my feet wet on this platform and loving it so far. The Tab Container component is quite powerful but I see this as a significant user experience gap and hoping to throw some weight behind this request. Has there been any movement on it?

Thanks for the suggested work-around. I do have some peripheral use cases where this pattern could work, but typically a user will navigate to another tab by clicking the Tab itself. In those situations, we need some way of retrieving the current component in view. But if we do need to persist something, it would be ideal to save the current scroll bar position.

Anyway, keep up the good work!

Hi @Mark_Heimburger,

Welcome! Unfortunately, we haven't been able to prioritize this request yet :disappointed: