fix(core): slideTo function does not work when grid.rows > 1 (#8030)

* Fix slideTo function when grid.rows > 1

* use getSlideIndexWhenGrid helper

---------

Co-authored-by: Vladimir Kharlampidi <nolimits4web@gmail.com>

Author: danielkorte

src/core/core.mjs

@@ -258,6 +258,17 @@ class Swiper {
     );
   }
 
+  getSlideIndexWhenGrid(index) {
+    if (this.grid && this.params.grid && this.params.grid.rows > 1) {
+      if (this.params.grid.fill === 'column') {
+        index = Math.floor(index / this.params.grid.rows);
+      } else if (this.params.grid.fill === 'row') {
+        index = index % Math.ceil(this.slides.length / this.params.grid.rows);
+      }
+    }
+    return index;
+  }
+
   recalcSlides() {
     const swiper = this;
     const { slidesEl, params } = swiper;

src/core/slide/slideToClickedSlide.mjs

@@ -8,8 +8,10 @@ export default function slideToClickedSlide() {
   const slidesPerView =
     params.slidesPerView === 'auto' ? swiper.slidesPerViewDynamic() : params.slidesPerView;
   let slideToIndex = swiper.clickedIndex;
+
   let realIndex;
   const slideSelector = swiper.isElement ? `swiper-slide` : `.${params.slideClass}`;
+  const isGrid = swiper.grid && swiper.params.grid && swiper.params.grid.rows > 1;
   if (params.loop) {
     if (swiper.animating) return;
     realIndex = parseInt(swiper.clickedSlide.getAttribute('data-swiper-slide-index'), 10);
@@ -29,7 +31,11 @@ export default function slideToClickedSlide() {
       } else {
         swiper.slideTo(slideToIndex);
       }
-    } else if (slideToIndex > swiper.slides.length - slidesPerView) {
+    } else if (
+      slideToIndex > isGrid
+        ? (swiper.slides.length - slidesPerView) / 2 - (swiper.params.grid.rows - 1)
+        : swiper.slides.length - slidesPerView
+    ) {
       swiper.loopFix();
       slideToIndex = swiper.getSlideIndex(
         elementChildren(slidesEl, `${slideSelector}[data-swiper-slide-index="${realIndex}"]`)[0],

src/core/update/updateClickedSlide.mjs

@@ -25,9 +25,11 @@ export default function updateClickedSlide(el, path) {
   if (slide && slideFound) {
     swiper.clickedSlide = slide;
     if (swiper.virtual && swiper.params.virtual.enabled) {
-      swiper.clickedIndex = parseInt(slide.getAttribute('data-swiper-slide-index'), 10);
+      swiper.clickedIndex = swiper.getSlideIndexWhenGrid(
+        parseInt(slide.getAttribute('data-swiper-slide-index'), 10),
+      );
     } else {
-      swiper.clickedIndex = slideIndex;
+      swiper.clickedIndex = swiper.getSlideIndexWhenGrid(slideIndex);
     }
   } else {
     swiper.clickedSlide = undefined;

src/modules/a11y/a11y.mjs

@@ -263,9 +263,12 @@ export default function A11y({ swiper, extendParams, on }) {
     requestAnimationFrame(() => {
       if (preventFocusHandler) return;
       if (swiper.params.loop) {
-        swiper.slideToLoop(parseInt(slideEl.getAttribute('data-swiper-slide-index')), 0);
+        swiper.slideToLoop(
+          swiper.getSlideIndexWhenGrid(parseInt(slideEl.getAttribute('data-swiper-slide-index'))),
+          0,
+        );
       } else {
-        swiper.slideTo(swiper.slides.indexOf(slideEl), 0);
+        swiper.slideTo(swiper.getSlideIndexWhenGrid(swiper.slides.indexOf(slideEl)), 0);
       }
 
       preventFocusHandler = false;