Hiding & showing slides in grid mode

[djrees]

Check that this is really a bug

• I confirm

Reproduction link

https://codepen.io/djrees/pen/qEOxPBZ

Bug description

Hey,

I currently have a swiper with multiple slides that I want the visitor to be able to turn off and off via a list of external filters. The swiper is setup in grid mode, and show 3 rows of 4 slides for a total of 16 slides. I'm using css display: none and display: block to hide and show the slides based on filter options.

Demo here: https://codepen.io/djrees/pen/qEOxPBZ

When the visitors enables one filter, the swiper is correclty updated. But as a second or third filter is enabled, the number of slides is incorrect shown and/or the swiper isn't correctly enable. There should be 8 slides per filter.

If I disable "grid mode" then the functionality works as expected.

If I enable "freeMode: sticky" then the swiper breaks even more and doesn't current align the slides to the left hand side and isn't functional until all or no filters are enabled.

Am I incorrectly update the swiper? Or is there a better way to "hide and show" the slides?

Thanks!

Expected Behavior

Slides to correctly update as different external slides are hidden or shown.

Actual Behavior

No response

Swiper version

11.2.10

Platform/Target and Browser Versions

All

Validations

• Follow our Code of Conduct
• Read the docs.
• Check that there isn't already an issue that request the same feature to avoid creating a duplicate.
• Make sure this is a Swiper issue and not a framework-specific issue

Would you like to open a PR for this bug?

• I'm willing to open a PR