You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Hi! I have a scenario where I am building a stepper component. Inside the stepper is a virtualized GridList. When advancing to the next step, I display: none the prior step so that if the user clicks "back" I can display the state of the previous step instead of conditionally mounting/unmounting the component and losing that state.
Anyways, I discovered if you resize the grid, click the next step, and then click back, the virtualizer doesn't re-mount correctly. In the stackblitz this actually results in no results being displayed. In my app, when re-displaying the first step, it only shows the first row...not sure the discrepancy but both are a result that the virtualizer isn't recalculating the height of the items when it becomes visible again...assuming it should be doing that? I will show videos of both and include a codesandbox for a minimum repro.
🤔 Expected Behavior?
I expect to be able to "hide" a virtualized list and that when it is "displayed" again that it should be the height it originally was.
😯 Current Behavior
The codesandbox causes all items to not be displayed at all
Shrink the preview window to where the grid is 3 columns
Click the "next step"
Go "Back" to the previous step
Observe that the list is no longer displayed
EDIT: I also actually observe strange behavior without even needing to resize. If you simply toggle between step 1 and 2 TWICE it will cause all items to disappear completely. The first time you toggle, the items will show up but not anymore after the second time, which is interesting to note too...
Provide a general summary of the issue here
Hi! I have a scenario where I am building a stepper component. Inside the stepper is a virtualized GridList. When advancing to the next step, I
display: nonethe prior step so that if the user clicks "back" I can display the state of the previous step instead of conditionally mounting/unmounting the component and losing that state.Anyways, I discovered if you resize the grid, click the next step, and then click back, the virtualizer doesn't re-mount correctly. In the stackblitz this actually results in no results being displayed. In my app, when re-displaying the first step, it only shows the first row...not sure the discrepancy but both are a result that the virtualizer isn't recalculating the height of the items when it becomes visible again...assuming it should be doing that? I will show videos of both and include a codesandbox for a minimum repro.
🤔 Expected Behavior?
I expect to be able to "hide" a virtualized list and that when it is "displayed" again that it should be the height it originally was.
😯 Current Behavior
The codesandbox causes all items to not be displayed at all
💁 Possible Solution
No response
🔦 Context
** Codesandbox Repro **
Screen.Recording.2026-06-08.at.12.56.25.PM.mov
** App Example **
Screen.Recording.2026-06-08.at.12.58.17.PM.mov
🖥️ Steps to Reproduce
Repro: https://codesandbox.io/p/sandbox/react-aria-components-template-g7wmmk
EDIT: I also actually observe strange behavior without even needing to resize. If you simply toggle between step 1 and 2 TWICE it will cause all items to disappear completely. The first time you toggle, the items will show up but not anymore after the second time, which is interesting to note too...
Version
1.18.0
What browsers are you seeing the problem on?
Chrome
If other, please specify.
No response
What operating system are you using?
Mac OS
🧢 Your Company/Team
No response
🕷 Tracking Issue
No response