@gem-sdk/swiper 0.0.15-dev.1 → 0.0.15

package/swiper.js

@@ -1,5 +1,5 @@
 /**
- * Swiper 0.0.15-dev.1
+ * Swiper 0.0.15
  * Gem SDK - Swiper, Customized of swiper
  * https://swiperjs.com
  *
@@ -829,6 +829,9 @@ var Swiper = (function () {
 
   function updateSlides() {
     const swiper = this;
+    function getDirectionPropertyValue(node, label) {
+      return parseFloat(node.getPropertyValue(swiper.getDirectionLabel(label)) || 0);
+    }
     const params = swiper.params;
     const {
       wrapperEl,
@@ -837,8 +840,10 @@ var Swiper = (function () {
       rtlTranslate: rtl,
       wrongRTL
     } = swiper;
+    const isVirtual = swiper.virtual && params.virtual.enabled;
+    const previousSlidesLength = isVirtual ? swiper.virtual.slides.length : swiper.slides.length;
     const slides = elementChildren(slidesEl, `.${swiper.params.slideClass}, swiper-slide`);
-    const slidesLength = slides.length;
+    const slidesLength = isVirtual ? swiper.virtual.slides.length : slides.length;
     let snapGrid = [];
     const slidesGrid = [];
     const slidesSizesGrid = [];
@@ -856,15 +861,15 @@ var Swiper = (function () {
     let slidePosition = -offsetBefore;
     let prevSlideSize = 0;
     let index = 0;
-    if (typeof swiperSize === 'undefined') return;
+    if (typeof swiperSize === 'undefined') {
+      return;
+    }
     if (typeof spaceBetween === 'string' && spaceBetween.indexOf('%') >= 0) {
       spaceBetween = parseFloat(spaceBetween.replace('%', '')) / 100 * swiperSize;
     } else if (typeof spaceBetween === 'string') {
       spaceBetween = parseFloat(spaceBetween);
     }
-
-    // core-lite: compute total slides size without optional modules
-    swiper.slidesTotalSize = -spaceBetween;
+    swiper.virtualSize = -spaceBetween;
 
     // reset margins
     slides.forEach(slideEl => {
@@ -882,34 +887,49 @@ var Swiper = (function () {
       setCSSProperty(wrapperEl, '--swiper-centered-offset-before', '');
       setCSSProperty(wrapperEl, '--swiper-centered-offset-after', '');
     }
+    const gridEnabled = params.grid && params.grid.rows > 1 && swiper.grid;
+    if (gridEnabled) {
+      swiper.grid.initSlides(slides);
+    } else if (swiper.grid) {
+      swiper.grid.unsetSlides();
+    }
 
     // Calc slides
     let slideSize;
-    const shouldResetSlideSize = params.slidesPerView === 'auto' && params.breakpoints && Object.keys(params.breakpoints).filter(key => typeof params.breakpoints[key].slidesPerView !== 'undefined').length > 0;
+    const shouldResetSlideSize = params.slidesPerView === 'auto' && params.breakpoints && Object.keys(params.breakpoints).filter(key => {
+      return typeof params.breakpoints[key].slidesPerView !== 'undefined';
+    }).length > 0;
     for (let i = 0; i < slidesLength; i += 1) {
       slideSize = 0;
       let slide;
       if (slides[i]) slide = slides[i];
+      if (gridEnabled) {
+        swiper.grid.updateSlide(i, slide, slides);
+      }
       if (slides[i] && elementStyle(slide, 'display') === 'none') continue; // eslint-disable-line
 
       if (params.slidesPerView === 'auto') {
-        if (shouldResetSlideSize && slides[i]) {
+        if (shouldResetSlideSize) {
           slides[i].style[swiper.getDirectionLabel('width')] = ``;
         }
         const slideStyles = getComputedStyle(slide);
         const currentTransform = slide.style.transform;
         const currentWebKitTransform = slide.style.webkitTransform;
-        if (currentTransform) slide.style.transform = 'none';
-        if (currentWebKitTransform) slide.style.webkitTransform = 'none';
+        if (currentTransform) {
+          slide.style.transform = 'none';
+        }
+        if (currentWebKitTransform) {
+          slide.style.webkitTransform = 'none';
+        }
         if (params.roundLengths) {
           slideSize = swiper.isHorizontal() ? elementOuterSize(slide, 'width', true) : elementOuterSize(slide, 'height', true);
         } else {
           // eslint-disable-next-line
-          const width = parseFloat(slideStyles.getPropertyValue('width')) || slide.offsetWidth;
-          const paddingLeft = parseFloat(slideStyles.getPropertyValue('padding-left')) || 0;
-          const paddingRight = parseFloat(slideStyles.getPropertyValue('padding-right')) || 0;
-          const marginLeft = parseFloat(slideStyles.getPropertyValue('margin-left')) || 0;
-          const marginRight = parseFloat(slideStyles.getPropertyValue('margin-right')) || 0;
+          const width = getDirectionPropertyValue(slideStyles, 'width');
+          const paddingLeft = getDirectionPropertyValue(slideStyles, 'padding-left');
+          const paddingRight = getDirectionPropertyValue(slideStyles, 'padding-right');
+          const marginLeft = getDirectionPropertyValue(slideStyles, 'margin-left');
+          const marginRight = getDirectionPropertyValue(slideStyles, 'margin-right');
           const boxSizing = slideStyles.getPropertyValue('box-sizing');
           if (boxSizing && boxSizing === 'border-box') {
             slideSize = width + marginLeft + marginRight;
@@ -921,8 +941,12 @@ var Swiper = (function () {
             slideSize = width + paddingLeft + paddingRight + marginLeft + marginRight + (offsetWidth - clientWidth);
           }
         }
-        if (currentTransform) slide.style.transform = currentTransform;
-        if (currentWebKitTransform) slide.style.webkitTransform = currentWebKitTransform;
+        if (currentTransform) {
+          slide.style.transform = currentTransform;
+        }
+        if (currentWebKitTransform) {
+          slide.style.webkitTransform = currentWebKitTransform;
+        }
         if (params.roundLengths) slideSize = Math.floor(slideSize);
       } else {
         slideSize = (swiperSize - (params.slidesPerView - 1) * spaceBetween) / params.slidesPerView;
@@ -931,13 +955,13 @@ var Swiper = (function () {
           slides[i].style[swiper.getDirectionLabel('width')] = `${slideSize}px`;
         }
       }
-      if (slides[i]) slides[i].swiperSlideSize = slideSize;
+      if (slides[i]) {
+        slides[i].swiperSlideSize = slideSize;
+      }
       slidesSizesGrid.push(slideSize);
       if (params.centeredSlides) {
         slidePosition = slidePosition + slideSize / 2 + prevSlideSize / 2 + spaceBetween;
-        if (prevSlideSize === 0 && i !== 0) {
-          slidePosition = slidePosition - swiperSize / 2 - spaceBetween;
-        }
+        if (prevSlideSize === 0 && i !== 0) slidePosition = slidePosition - swiperSize / 2 - spaceBetween;
         if (i === 0) slidePosition = slidePosition - swiperSize / 2 - spaceBetween;
         if (Math.abs(slidePosition) < 1 / 1000) slidePosition = 0;
         if (params.roundLengths) slidePosition = Math.floor(slidePosition);
@@ -945,37 +969,55 @@ var Swiper = (function () {
         slidesGrid.push(slidePosition);
       } else {
         if (params.roundLengths) slidePosition = Math.floor(slidePosition);
-        if ((index - Math.min(swiper.params.slidesPerGroupSkip, index)) % swiper.params.slidesPerGroup === 0) {
-          snapGrid.push(slidePosition);
-        }
+        if ((index - Math.min(swiper.params.slidesPerGroupSkip, index)) % swiper.params.slidesPerGroup === 0) snapGrid.push(slidePosition);
         slidesGrid.push(slidePosition);
         slidePosition = slidePosition + slideSize + spaceBetween;
       }
-      swiper.slidesTotalSize += slideSize + spaceBetween;
+      swiper.virtualSize += slideSize + spaceBetween;
       prevSlideSize = slideSize;
       index += 1;
     }
-    swiper.slidesTotalSize = Math.max(swiper.slidesTotalSize, swiperSize) + offsetAfter;
-    if (rtl && wrongRTL && params.effect === 'slide') {
-      wrapperEl.style.width = `${swiper.slidesTotalSize + spaceBetween}px`;
+    swiper.virtualSize = Math.max(swiper.virtualSize, swiperSize) + offsetAfter;
+    if (rtl && wrongRTL && (params.effect === 'slide' || params.effect === 'coverflow')) {
+      wrapperEl.style.width = `${swiper.virtualSize + spaceBetween}px`;
     }
     if (params.setWrapperSize) {
-      wrapperEl.style[swiper.getDirectionLabel('width')] = `${swiper.slidesTotalSize + spaceBetween}px`;
+      wrapperEl.style[swiper.getDirectionLabel('width')] = `${swiper.virtualSize + spaceBetween}px`;
+    }
+    if (gridEnabled) {
+      swiper.grid.updateWrapperSize(slideSize, snapGrid);
     }
 
-    // Remove last snap points depending on width (non-centered)
+    // Remove last grid elements depending on width
     if (!params.centeredSlides) {
       const newSlidesGrid = [];
       for (let i = 0; i < snapGrid.length; i += 1) {
         let slidesGridItem = snapGrid[i];
         if (params.roundLengths) slidesGridItem = Math.floor(slidesGridItem);
-        if (snapGrid[i] <= swiper.slidesTotalSize - swiperSize) {
+        if (snapGrid[i] <= swiper.virtualSize - swiperSize) {
           newSlidesGrid.push(slidesGridItem);
         }
       }
       snapGrid = newSlidesGrid;
-      if (Math.floor(swiper.slidesTotalSize - swiperSize) - Math.floor(snapGrid[snapGrid.length - 1]) > 1) {
-        snapGrid.push(swiper.slidesTotalSize - swiperSize);
+      if (Math.floor(swiper.virtualSize - swiperSize) - Math.floor(snapGrid[snapGrid.length - 1]) > 1) {
+        snapGrid.push(swiper.virtualSize - swiperSize);
+      }
+    }
+    if (isVirtual && params.loop) {
+      const size = slidesSizesGrid[0] + spaceBetween;
+      if (params.slidesPerGroup > 1) {
+        const groups = Math.ceil((swiper.virtual.slidesBefore + swiper.virtual.slidesAfter) / params.slidesPerGroup);
+        const groupSize = size * params.slidesPerGroup;
+        for (let i = 0; i < groups; i += 1) {
+          snapGrid.push(snapGrid[snapGrid.length - 1] + groupSize);
+        }
+      }
+      for (let i = 0; i < swiper.virtual.slidesBefore + swiper.virtual.slidesAfter; i += 1) {
+        if (params.slidesPerGroup === 1) {
+          snapGrid.push(snapGrid[snapGrid.length - 1] + size);
+        }
+        slidesGrid.push(slidesGrid[slidesGrid.length - 1] + size);
+        swiper.virtualSize += size;
       }
     }
     if (snapGrid.length === 0) snapGrid = [0];
@@ -983,7 +1025,9 @@ var Swiper = (function () {
       const key = swiper.isHorizontal() && rtl ? 'marginLeft' : swiper.getDirectionLabel('marginRight');
       slides.filter((_, slideIndex) => {
         if (!params.cssMode || params.loop) return true;
-        if (slideIndex === slides.length - 1) return false;
+        if (slideIndex === slides.length - 1) {
+          return false;
+        }
         return true;
       }).forEach(slideEl => {
         slideEl.style[key] = `${spaceBetween}px`;
@@ -1033,9 +1077,7 @@ var Swiper = (function () {
       swiper.snapGrid = swiper.snapGrid.map(v => v + addToSnapGrid);
       swiper.slidesGrid = swiper.slidesGrid.map(v => v + addToSlidesGrid);
     }
-
-    // Emit changes
-    if (slidesLength !== (previousSlidesGridLength ? slides.length : slides.length)) {
+    if (slidesLength !== previousSlidesLength) {
       swiper.emit('slidesLengthChange');
     }
     if (snapGrid.length !== previousSnapGridLength) {
@@ -1049,7 +1091,7 @@ var Swiper = (function () {
       swiper.updateSlidesOffset();
     }
     swiper.emit('slidesUpdated');
-    if (!params.cssMode && params.effect === 'slide') {
+    if (!isVirtual && !params.cssMode && (params.effect === 'slide' || params.effect === 'fade')) {
       const backFaceHiddenClass = `${params.containerModifierClass}backface-hidden`;
       const hasClassBackfaceClassAdded = swiper.el.classList.contains(backFaceHiddenClass);
       if (slidesLength <= params.maxBackfaceHiddenSlides) {
@@ -1063,13 +1105,20 @@ var Swiper = (function () {
   function updateAutoHeight(speed) {
     const swiper = this;
     const activeSlides = [];
+    const isVirtual = swiper.virtual && swiper.params.virtual.enabled;
+    let newHeight = 0;
+    let i;
     if (typeof speed === 'number') {
       swiper.setTransition(speed);
     } else if (speed === true) {
       swiper.setTransition(swiper.params.speed);
     }
-    const getSlideByIndex = index => swiper.slides[index];
-
+    const getSlideByIndex = index => {
+      if (isVirtual) {
+        return swiper.slides[swiper.getSlideIndexByData(index)];
+      }
+      return swiper.slides[index];
+    };
     // Find slides currently in view
     if (swiper.params.slidesPerView !== 'auto' && swiper.params.slidesPerView > 1) {
       if (swiper.params.centeredSlides) {
@@ -1077,9 +1126,9 @@ var Swiper = (function () {
           activeSlides.push(slide);
         });
       } else {
-        for (let i = 0; i < Math.ceil(swiper.params.slidesPerView); i += 1) {
+        for (i = 0; i < Math.ceil(swiper.params.slidesPerView); i += 1) {
           const index = swiper.activeIndex + i;
-          if (index > swiper.slides.length) break;
+          if (index > swiper.slides.length && !isVirtual) break;
           activeSlides.push(getSlideByIndex(index));
         }
       }
@@ -1088,13 +1137,14 @@ var Swiper = (function () {
     }
 
     // Find new height from highest slide in view
-    let newHeight = 0;
-    for (let i = 0; i < activeSlides.length; i += 1) {
+    for (i = 0; i < activeSlides.length; i += 1) {
       if (typeof activeSlides[i] !== 'undefined') {
         const height = activeSlides[i].offsetHeight;
         newHeight = height > newHeight ? height : newHeight;
       }
     }
+
+    // Update Height
     if (newHeight || newHeight === 0) swiper.wrapperEl.style.height = `${newHeight}px`;
   }
 
@@ -1239,16 +1289,46 @@ var Swiper = (function () {
       slidesEl,
       activeIndex
     } = swiper;
-    const getNextSlide = slideEl => elementNextAll(slideEl, `.${params.slideClass}, swiper-slide`)[0];
-    const getPrevSlide = slideEl => elementPrevAll(slideEl, `.${params.slideClass}, swiper-slide`)[0];
-    const activeSlide = slides[activeIndex];
-    let nextSlide;
+    const isVirtual = swiper.virtual && params.virtual.enabled;
+    const gridEnabled = swiper.grid && params.grid && params.grid.rows > 1;
+    const getFilteredSlide = selector => {
+      return elementChildren(slidesEl, `.${params.slideClass}${selector}, swiper-slide${selector}`)[0];
+    };
+    let activeSlide;
     let prevSlide;
+    let nextSlide;
+    if (isVirtual) {
+      if (params.loop) {
+        let slideIndex = activeIndex - swiper.virtual.slidesBefore;
+        if (slideIndex < 0) slideIndex = swiper.virtual.slides.length + slideIndex;
+        if (slideIndex >= swiper.virtual.slides.length) slideIndex -= swiper.virtual.slides.length;
+        activeSlide = getFilteredSlide(`[data-swiper-slide-index="${slideIndex}"]`);
+      } else {
+        activeSlide = getFilteredSlide(`[data-swiper-slide-index="${activeIndex}"]`);
+      }
+    } else {
+      if (gridEnabled) {
+        activeSlide = slides.find(slideEl => slideEl.column === activeIndex);
+        nextSlide = slides.find(slideEl => slideEl.column === activeIndex + 1);
+        prevSlide = slides.find(slideEl => slideEl.column === activeIndex - 1);
+      } else {
+        activeSlide = slides[activeIndex];
+      }
+    }
     if (activeSlide) {
-      nextSlide = getNextSlide(activeSlide);
-      prevSlide = getPrevSlide(activeSlide);
-      if (params.loop && !nextSlide) nextSlide = slides[0];
-      if (params.loop && !prevSlide) prevSlide = slides[slides.length - 1];
+      if (!gridEnabled) {
+        // Next Slide
+        nextSlide = elementNextAll(activeSlide, `.${params.slideClass}, swiper-slide`)[0];
+        if (params.loop && !nextSlide) {
+          nextSlide = slides[0];
+        }
+
+        // Prev Slide
+        prevSlide = elementPrevAll(activeSlide, `.${params.slideClass}, swiper-slide`)[0];
+        if (params.loop && !prevSlide === 0) {
+          prevSlide = slides[slides.length - 1];
+        }
+      }
     }
     slides.forEach(slideEl => {
       toggleSlideClasses(slideEl, slideEl === activeSlide, params.slideActiveClass);
@@ -1339,6 +1419,7 @@ var Swiper = (function () {
         activeIndex = i;
       }
     }
+    // Normalize slideIndex
     if (params.normalizeSlideIndex) {
       if (activeIndex < 0 || typeof activeIndex === 'undefined') activeIndex = 0;
     }
@@ -1356,6 +1437,16 @@ var Swiper = (function () {
     } = swiper;
     let activeIndex = newActiveIndex;
     let snapIndex;
+    const getVirtualRealIndex = aIndex => {
+      let realIndex = aIndex - swiper.virtual.slidesBefore;
+      if (realIndex < 0) {
+        realIndex = swiper.virtual.slides.length + realIndex;
+      }
+      if (realIndex >= swiper.virtual.slides.length) {
+        realIndex -= swiper.virtual.slides.length;
+      }
+      return realIndex;
+    };
     if (typeof activeIndex === 'undefined') {
       activeIndex = getActiveIndexByTranslate(swiper);
     }
@@ -1373,12 +1464,32 @@ var Swiper = (function () {
       }
       return;
     }
-    let realIndex = activeIndex;
-    if (swiper.slides[activeIndex]) {
+    if (activeIndex === previousIndex && swiper.params.loop && swiper.virtual && swiper.params.virtual.enabled) {
+      swiper.realIndex = getVirtualRealIndex(activeIndex);
+      return;
+    }
+    const gridEnabled = swiper.grid && params.grid && params.grid.rows > 1;
+
+    // Get real index
+    let realIndex;
+    if (swiper.virtual && params.virtual.enabled && params.loop) {
+      realIndex = getVirtualRealIndex(activeIndex);
+    } else if (gridEnabled) {
+      const firstSlideInColumn = swiper.slides.find(slideEl => slideEl.column === activeIndex);
+      let activeSlideIndex = parseInt(firstSlideInColumn.getAttribute('data-swiper-slide-index'), 10);
+      if (Number.isNaN(activeSlideIndex)) {
+        activeSlideIndex = Math.max(swiper.slides.indexOf(firstSlideInColumn), 0);
+      }
+      realIndex = Math.floor(activeSlideIndex / params.grid.rows);
+    } else if (swiper.slides[activeIndex]) {
       const slideIndex = swiper.slides[activeIndex].getAttribute('data-swiper-slide-index');
       if (slideIndex) {
         realIndex = parseInt(slideIndex, 10);
+      } else {
+        realIndex = activeIndex;
       }
+    } else {
+      realIndex = activeIndex;
     }
     Object.assign(swiper, {
       previousSnapIndex,
@@ -1425,7 +1536,11 @@ var Swiper = (function () {
     }
     if (slide && slideFound) {
       swiper.clickedSlide = slide;
-      swiper.clickedIndex = slideIndex;
+      if (swiper.virtual && swiper.params.virtual.enabled) {
+        swiper.clickedIndex = parseInt(slide.getAttribute('data-swiper-slide-index'), 10);
+      } else {
+        swiper.clickedIndex = slideIndex;
+      }
     } else {
       swiper.clickedSlide = undefined;
       swiper.clickedIndex = undefined;
@@ -1459,6 +1574,9 @@ var Swiper = (function () {
       translate,
       wrapperEl
     } = swiper;
+    if (params.virtualTranslate) {
+      return rtl ? -translate : translate;
+    }
     if (params.cssMode) {
       return translate;
     }
@@ -1492,7 +1610,7 @@ var Swiper = (function () {
     swiper.translate = swiper.isHorizontal() ? x : y;
     if (params.cssMode) {
       wrapperEl[swiper.isHorizontal() ? 'scrollLeft' : 'scrollTop'] = swiper.isHorizontal() ? -x : -y;
-    } else {
+    } else if (!params.virtualTranslate) {
       if (swiper.isHorizontal()) {
         x -= swiper.cssOverflowAdjustment();
       } else {
@@ -1729,6 +1847,7 @@ var Swiper = (function () {
     let snapIndex = skip + Math.floor((slideIndex - skip) / swiper.params.slidesPerGroup);
     if (snapIndex >= snapGrid.length) snapIndex = snapGrid.length - 1;
     const translate = -snapGrid[snapIndex];
+    // Normalize slideIndex
     if (params.normalizeSlideIndex) {
       for (let i = 0; i < slidesGrid.length; i += 1) {
         const normalizedTranslate = -Math.floor(translate * 100);
@@ -1745,24 +1864,33 @@ var Swiper = (function () {
         }
       }
     }
-
     // Directions locks
     if (swiper.initialized && slideIndex !== activeIndex) {
       if (!swiper.allowSlideNext && (rtl ? translate > swiper.translate && translate > swiper.minTranslate() : translate < swiper.translate && translate < swiper.minTranslate())) {
         return false;
       }
       if (!swiper.allowSlidePrev && translate > swiper.translate && translate > swiper.maxTranslate()) {
-        if ((activeIndex || 0) !== slideIndex) return false;
+        if ((activeIndex || 0) !== slideIndex) {
+          return false;
+        }
       }
     }
     if (slideIndex !== (previousIndex || 0) && runCallbacks) {
       swiper.emit('beforeSlideChangeStart');
     }
+
+    // Update progress
     swiper.updateProgress(translate);
     let direction;
     if (slideIndex > activeIndex) direction = 'next';else if (slideIndex < activeIndex) direction = 'prev';else direction = 'reset';
-    if (rtl && -translate === swiper.translate || !rtl && translate === swiper.translate) {
+
+    // initial virtual
+    const isVirtual = swiper.virtual && swiper.params.virtual.enabled;
+    const isInitialVirtual = isVirtual && initial;
+    // Update Index
+    if (!isInitialVirtual && (rtl && -translate === swiper.translate || !rtl && translate === swiper.translate)) {
       swiper.updateActiveIndex(slideIndex);
+      // Update Height
       if (params.autoHeight) {
         swiper.updateAutoHeight();
       }
@@ -1780,7 +1908,24 @@ var Swiper = (function () {
       const isH = swiper.isHorizontal();
       const t = rtl ? translate : -translate;
       if (speed === 0) {
-        wrapperEl[isH ? 'scrollLeft' : 'scrollTop'] = t;
+        if (isVirtual) {
+          swiper.wrapperEl.style.scrollSnapType = 'none';
+          swiper._immediateVirtual = true;
+        }
+        if (isVirtual && !swiper._cssModeVirtualInitialSet && swiper.params.initialSlide > 0) {
+          swiper._cssModeVirtualInitialSet = true;
+          requestAnimationFrame(() => {
+            wrapperEl[isH ? 'scrollLeft' : 'scrollTop'] = t;
+          });
+        } else {
+          wrapperEl[isH ? 'scrollLeft' : 'scrollTop'] = t;
+        }
+        if (isVirtual) {
+          requestAnimationFrame(() => {
+            swiper.wrapperEl.style.scrollSnapType = '';
+            swiper._immediateVirtual = false;
+          });
+        }
       } else {
         if (!swiper.support.smoothScroll) {
           animateCSSModeScroll({
@@ -1798,7 +1943,10 @@ var Swiper = (function () {
       return true;
     }
     const browser = getBrowser();
-    browser.isSafari;
+    const isSafari = browser.isSafari;
+    if (isVirtual && !initial && isSafari && swiper.isElement) {
+      swiper.virtual.update(false, false, slideIndex);
+    }
     swiper.setTransition(speed);
     swiper.setTranslate(translate);
     swiper.updateActiveIndex(slideIndex);
@@ -1969,6 +2117,8 @@ var Swiper = (function () {
     if (swiper.params?.isSneakPeekCenter && slides.length > 1 && swiper.activeIndex === 0) {
       const gap = Math.abs(swiper.snapGrid[1] - swiper.snapGrid[0]);
       const swiperTranslate = JSON.parse(JSON.stringify(swiper.snapGrid[1]));
+
+      // Move last item to first position only if active slide is the first slide
       const lastSlide = slides[slides.length - 1];
       lastSlide.swiperLoopMoveDOM = true;
       swiper.slidesEl.prepend(lastSlide);
@@ -2003,8 +2153,11 @@ var Swiper = (function () {
       perGroup = Math.max(swiper.slidesPerViewDynamic('current', true), 1);
     }
     const increment = swiper.activeIndex < params.slidesPerGroupSkip ? 1 : perGroup;
+    const isVirtual = swiper.virtual && params.virtual.enabled;
     if (params.loop) {
-      if (animating && params.loopPreventsSliding) return false;
+      if (animating && !isVirtual && params.loopPreventsSliding) return false;
+
+      // Kiểm tra xem loop có bị disable không
       const currentSlidesPerView = params.slidesPerView === 'auto' ? swiper.slidesPerViewDynamic() : Math.ceil(parseFloat(params.slidesPerView, 10));
       if (swiper.slides.length >= currentSlidesPerView) {
         swiper.loopFix({
@@ -2031,6 +2184,7 @@ var Swiper = (function () {
         const gap = Math.abs(swiper.snapGrid[lastSnapGridIndex] - swiper.snapGrid[lastSnapGridIndex - 1]);
         const swiperTranslate = structuredClone(swiper.snapGrid[lastSnapGridIndex - 1]);
         if (!swiper.params.loop) return;
+        // Move first item to last position only if active slide is the last slide
         const firstSlide = slides[0];
         firstSlide.swiperLoopMoveDOM = true;
         swiper.slidesEl.append(firstSlide);
@@ -2055,14 +2209,17 @@ var Swiper = (function () {
       params,
       snapGrid,
       slidesGrid,
-      rtlTranslate: rtlTranslate,
-      enabled
+      rtlTranslate,
+      enabled,
+      animating
     } = swiper;
     if (!enabled || swiper.destroyed) return swiper;
     if (typeof speed === 'undefined') {
       speed = swiper.params.speed;
     }
+    swiper.virtual && params.virtual.enabled;
     if (params.loop) {
+      // Kiểm tra xem loop có bị disable không
       const currentSlidesPerView = params.slidesPerView === 'auto' ? swiper.slidesPerViewDynamic() : Math.ceil(parseFloat(params.slidesPerView, 10));
       if (swiper.slides.length >= currentSlidesPerView) {
         swiper.loopFix({
@@ -2079,16 +2236,18 @@ var Swiper = (function () {
     }
     const normalizedTranslate = normalize(translate);
     const normalizedSnapGrid = snapGrid.map(val => normalize(val));
+    const isFreeMode = params.freeMode && params.freeMode.enabled;
     let prevSnap = snapGrid[normalizedSnapGrid.indexOf(normalizedTranslate) - 1];
-    if (typeof prevSnap === 'undefined' && params.cssMode) {
+    if (typeof prevSnap === 'undefined' && (params.cssMode || isFreeMode)) {
       let prevSnapIndex;
       snapGrid.forEach((snap, snapIndex) => {
         if (normalizedTranslate >= snap) {
+          // prevSnap = snap;
           prevSnapIndex = snapIndex;
         }
       });
       if (typeof prevSnapIndex !== 'undefined') {
-        prevSnap = snapGrid[prevSnapIndex > 0 ? prevSnapIndex - 1 : prevSnapIndex];
+        prevSnap = isFreeMode ? snapGrid[prevSnapIndex] : snapGrid[prevSnapIndex > 0 ? prevSnapIndex - 1 : prevSnapIndex];
       }
     }
     let prevIndex = 0;
@@ -2101,7 +2260,7 @@ var Swiper = (function () {
       }
     }
     if (params.rewind && swiper.isBeginning) {
-      const lastIndex = swiper.slides.length - 1;
+      const lastIndex = swiper.params.virtual && swiper.params.virtual.enabled && swiper.virtual ? swiper.virtual.slides.length - 1 : swiper.slides.length - 1;
       return swiper.slideTo(lastIndex, speed, runCallbacks, internal);
     } else if (params.loop && swiper.activeIndex === 0 && params.cssMode) {
       requestAnimationFrame(() => {
@@ -2115,6 +2274,8 @@ var Swiper = (function () {
       if (swiper.params?.isSneakPeekCenter && slides.length > 1 && swiper.activeIndex === 0) {
         const gap = Math.abs(swiper.snapGrid[1] - swiper.snapGrid[0]);
         const swiperTranslate = JSON.parse(JSON.stringify(swiper.snapGrid[1]));
+
+        // Move last item to first position only if active slide is the first slide
         if (!swiper.params.loop) return;
         const lastSlide = slides[slides.length - 1];
         lastSlide.swiperLoopMoveDOM = true;
@@ -2191,19 +2352,20 @@ var Swiper = (function () {
       slidesEl
     } = swiper;
     const slidesPerView = params.slidesPerView === 'auto' ? swiper.slidesPerViewDynamic() : params.slidesPerView;
-    const slideToIndex = swiper.clickedIndex;
+    let slideToIndex = swiper.getSlideIndexWhenGrid(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);
       if (params.centeredSlides) {
         swiper.slideToLoop(realIndex);
-      } 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();
-        const clickedEl = elementChildren(slidesEl, `${slideSelector}[data-swiper-slide-index="${realIndex}"]`)[0];
+        slideToIndex = swiper.getSlideIndex(elementChildren(slidesEl, `${slideSelector}[data-swiper-slide-index="${realIndex}"]`)[0]);
         nextTick(() => {
-          if (clickedEl) swiper.slideTo(swiper.getSlideIndex(clickedEl));
+          swiper.slideTo(slideToIndex);
         });
       } else {
         swiper.slideTo(slideToIndex);
@@ -2230,7 +2392,7 @@ var Swiper = (function () {
       params,
       slidesEl
     } = swiper;
-    if (!params.loop) return;
+    if (!params.loop || swiper.virtual && swiper.params.virtual.enabled) return;
     const initSlides = () => {
       const slides = elementChildren(slidesEl, `.${params.slideClass}, swiper-slide`);
       slides.forEach((el, index) => {
@@ -2239,17 +2401,21 @@ var Swiper = (function () {
     };
     const clearBlankSlides = () => {
       const slides = elementChildren(slidesEl, `.${params.slideBlankClass}`);
-      slides.forEach(el => el.remove());
+      slides.forEach(el => {
+        el.remove();
+      });
       if (slides.length > 0) {
         swiper.recalcSlides();
         swiper.updateSlides();
       }
     };
-    if (params.loopAddBlankSlides && params.slidesPerGroup > 1) {
+    const gridEnabled = swiper.grid && params.grid && params.grid.rows > 1;
+    if (params.loopAddBlankSlides && (params.slidesPerGroup > 1 || gridEnabled)) {
       clearBlankSlides();
     }
-    const slidesPerGroup = params.slidesPerGroup;
+    const slidesPerGroup = params.slidesPerGroup * (gridEnabled ? params.grid.rows : 1);
     const shouldFillGroup = swiper.slides.length % slidesPerGroup !== 0;
+    const shouldFillGrid = gridEnabled && swiper.slides.length % params.grid.rows !== 0;
     const addBlankSlides = amountOfSlides => {
       for (let i = 0; i < amountOfSlides; i += 1) {
         const slideEl = swiper.isElement ? createElement('swiper-slide', [params.slideBlankClass]) : createElement('div', [params.slideClass, params.slideBlankClass]);
@@ -2266,6 +2432,16 @@ var Swiper = (function () {
         showWarning('Swiper Loop Warning: The number of slides is not even to slidesPerGroup, loop mode may not function properly. You need to add more slides (or make duplicates, or empty slides)');
       }
       initSlides();
+    } else if (shouldFillGrid) {
+      if (params.loopAddBlankSlides) {
+        const slidesToAdd = params.grid.rows - swiper.slides.length % params.grid.rows;
+        addBlankSlides(slidesToAdd);
+        swiper.recalcSlides();
+        swiper.updateSlides();
+      } else {
+        showWarning('Swiper Loop Warning: The number of slides is not even to grid.rows, loop mode may not function properly. You need to add more slides (or make duplicates, or empty slides)');
+      }
+      initSlides();
     } else {
       initSlides();
     }
@@ -2284,12 +2460,13 @@ var Swiper = (function () {
       setTranslate,
       activeSlideIndex,
       initial,
+      byController,
       byMousewheel
     } = _temp === void 0 ? {} : _temp;
     const swiper = this;
     if (!swiper.params.loop) return;
 
-    // Disable loop mode if number of slides is smaller than slidesPerView
+    // Disable loop mode nếu số slides ít hơn slidesPerView
     const currentSlidesPerView = swiper.params.slidesPerView === 'auto' ? swiper.slidesPerViewDynamic() : Math.ceil(parseFloat(swiper.params.slidesPerView, 10));
     if (swiper.slides.length < currentSlidesPerView) {
       console.warn('Swiper: Loop mode disabled - slides.length < slidesPerView');
@@ -2309,6 +2486,21 @@ var Swiper = (function () {
     } = params;
     swiper.allowSlidePrev = true;
     swiper.allowSlideNext = true;
+    if (swiper.virtual && params.virtual.enabled) {
+      if (slideTo) {
+        if (!params.centeredSlides && swiper.snapIndex === 0) {
+          swiper.slideTo(swiper.virtual.slides.length, 0, false, true);
+        } else if (params.centeredSlides && swiper.snapIndex < params.slidesPerView) {
+          swiper.slideTo(swiper.virtual.slides.length + swiper.snapIndex, 0, false, true);
+        } else if (swiper.snapIndex === swiper.snapGrid.length - 1) {
+          swiper.slideTo(swiper.virtual.slidesBefore, 0, false, true);
+        }
+      }
+      swiper.allowSlidePrev = allowSlidePrev;
+      swiper.allowSlideNext = allowSlideNext;
+      swiper.emit('loopFix');
+      return;
+    }
     let slidesPerView = params.slidesPerView;
     if (slidesPerView === 'auto') {
       slidesPerView = swiper.slidesPerViewDynamic();
@@ -2318,19 +2510,22 @@ var Swiper = (function () {
         slidesPerView = slidesPerView + 1;
       }
     }
-    const slidesPerGroup = params.slidesPerGroup;
+    const slidesPerGroup = params.slidesPerGroupAuto ? slidesPerView : params.slidesPerGroup;
     let loopedSlides = centeredSlides ? Math.max(slidesPerGroup, Math.ceil(slidesPerView / 2)) : slidesPerGroup;
     if (loopedSlides % slidesPerGroup !== 0) {
       loopedSlides += slidesPerGroup - loopedSlides % slidesPerGroup;
     }
     loopedSlides += params.loopAdditionalSlides;
     swiper.loopedSlides = loopedSlides;
-    if (slides.length < slidesPerView + loopedSlides) {
+    const gridEnabled = swiper.grid && params.grid && params.grid.rows > 1;
+    if (slides.length < slidesPerView + loopedSlides || swiper.params.effect === 'cards' && slides.length < slidesPerView + loopedSlides * 2) {
       showWarning('Swiper Loop Warning: The number of slides is not enough for loop mode, it will be disabled or not function properly. You need to add more slides (or make duplicates) or lower the values of slidesPerView and slidesPerGroup parameters');
+    } else if (gridEnabled && params.grid.fill === 'row') {
+      showWarning('Swiper Loop Warning: Loop mode is not compatible with grid.fill = `row`');
     }
     const prependSlidesIndexes = [];
     const appendSlidesIndexes = [];
-    const cols = slides.length;
+    const cols = gridEnabled ? Math.ceil(slides.length / params.grid.rows) : slides.length;
     const isInitialOverflow = initial && cols - initialSlide < slidesPerView && !centeredSlides;
     let activeIndex = isInitialOverflow ? initialSlide : swiper.activeIndex;
     if (typeof activeSlideIndex === 'undefined') {
@@ -2342,15 +2537,24 @@ var Swiper = (function () {
     const isPrev = direction === 'prev' || !direction;
     let slidesPrepended = 0;
     let slidesAppended = 0;
-    const activeColIndex = activeSlideIndex;
+    const activeColIndex = gridEnabled ? slides[activeSlideIndex].column : activeSlideIndex;
     const activeColIndexWithShift = activeColIndex + (centeredSlides && typeof setTranslate === 'undefined' ? -slidesPerView / 2 + 0.5 : 0);
-
     // prepend last slides before start
     if (activeColIndexWithShift < loopedSlides) {
       slidesPrepended = Math.max(loopedSlides - activeColIndexWithShift, slidesPerGroup);
       for (let i = 0; i < loopedSlides - activeColIndexWithShift; i += 1) {
         const index = i - Math.floor(i / cols) * cols;
-        prependSlidesIndexes.push(cols - index - 1);
+        if (gridEnabled) {
+          const colIndexToPrepend = cols - index - 1;
+          for (let i = slides.length - 1; i >= 0; i -= 1) {
+            if (slides[i].column === colIndexToPrepend) prependSlidesIndexes.push(i);
+          }
+          // slides.forEach((slide, slideIndex) => {
+          //   if (slide.column === colIndexToPrepend) prependSlidesIndexes.push(slideIndex);
+          // });
+        } else {
+          prependSlidesIndexes.push(cols - index - 1);
+        }
       }
     } else if (activeColIndexWithShift + slidesPerView > cols - loopedSlides) {
       slidesAppended = Math.max(activeColIndexWithShift - (cols - loopedSlides * 2), slidesPerGroup);
@@ -2359,13 +2563,27 @@ var Swiper = (function () {
       }
       for (let i = 0; i < slidesAppended; i += 1) {
         const index = i - Math.floor(i / cols) * cols;
-        appendSlidesIndexes.push(index);
+        if (gridEnabled) {
+          slides.forEach((slide, slideIndex) => {
+            if (slide.column === index) appendSlidesIndexes.push(slideIndex);
+          });
+        } else {
+          appendSlidesIndexes.push(index);
+        }
       }
     }
     swiper.__preventObserver__ = true;
     requestAnimationFrame(() => {
       swiper.__preventObserver__ = false;
     });
+    if (swiper.params.effect === 'cards' && slides.length < slidesPerView + loopedSlides * 2) {
+      if (appendSlidesIndexes.includes(activeSlideIndex)) {
+        appendSlidesIndexes.splice(appendSlidesIndexes.indexOf(activeSlideIndex), 1);
+      }
+      if (prependSlidesIndexes.includes(activeSlideIndex)) {
+        prependSlidesIndexes.splice(prependSlidesIndexes.indexOf(activeSlideIndex), 1);
+      }
+    }
     if (isPrev) {
       prependSlidesIndexes.forEach(index => {
         slides[index].swiperLoopMoveDOM = true;
@@ -2383,6 +2601,10 @@ var Swiper = (function () {
     swiper.recalcSlides();
     if (params.slidesPerView === 'auto') {
       swiper.updateSlides();
+    } else if (gridEnabled && (prependSlidesIndexes.length > 0 && isPrev || appendSlidesIndexes.length > 0 && isNext)) {
+      swiper.slides.forEach((slide, slideIndex) => {
+        swiper.grid.updateSlide(slideIndex, slide, swiper.slides);
+      });
     }
     if (params.watchSlidesProgress) {
       swiper.updateSlidesOffset();
@@ -2402,10 +2624,12 @@ var Swiper = (function () {
               swiper.touchEventsData.currentTranslate = swiper.touchEventsData.currentTranslate - diff;
             }
           }
-        } else if (setTranslate) {
-          const shift = prependSlidesIndexes.length;
-          swiper.slideTo(swiper.activeIndex + shift, 0, false, true);
-          swiper.touchEventsData.currentTranslate = swiper.translate;
+        } else {
+          if (setTranslate) {
+            const shift = gridEnabled ? prependSlidesIndexes.length / params.grid.rows : prependSlidesIndexes.length;
+            swiper.slideTo(swiper.activeIndex + shift, 0, false, true);
+            swiper.touchEventsData.currentTranslate = swiper.translate;
+          }
         }
       } else if (appendSlidesIndexes.length > 0 && isNext) {
         if (typeof slideRealIndex === 'undefined') {
@@ -2421,14 +2645,36 @@ var Swiper = (function () {
               swiper.touchEventsData.currentTranslate = swiper.touchEventsData.currentTranslate - diff;
             }
           }
-        } else if (setTranslate) {
-          const shift = appendSlidesIndexes.length;
+        } else {
+          const shift = gridEnabled ? appendSlidesIndexes.length / params.grid.rows : appendSlidesIndexes.length;
           swiper.slideTo(swiper.activeIndex - shift, 0, false, true);
         }
       }
     }
     swiper.allowSlidePrev = allowSlidePrev;
     swiper.allowSlideNext = allowSlideNext;
+    if (swiper.controller && swiper.controller.control && !byController) {
+      const loopParams = {
+        slideRealIndex,
+        direction,
+        setTranslate,
+        activeSlideIndex,
+        byController: true
+      };
+      if (Array.isArray(swiper.controller.control)) {
+        swiper.controller.control.forEach(c => {
+          if (!c.destroyed && c.params.loop) c.loopFix({
+            ...loopParams,
+            slideTo: c.params.slidesPerView === params.slidesPerView ? slideTo : false
+          });
+        });
+      } else if (swiper.controller.control instanceof swiper.constructor && swiper.controller.control.params.loop) {
+        swiper.controller.control.loopFix({
+          ...loopParams,
+          slideTo: swiper.controller.control.params.slidesPerView === params.slidesPerView ? slideTo : false
+        });
+      }
+    }
     swiper.emit('loopFix');
   }
 
@@ -2445,7 +2691,7 @@ var Swiper = (function () {
     const swiper = this;
     if (!swiper.params.loop) return;
 
-    // Disable loop mode if number of slides is smaller than slidesPerView
+    // Disable loop mode nếu số slides ít hơn slidesPerView
     const currentSlidesPerView = swiper.params.slidesPerView === 'auto' ? swiper.slidesPerViewDynamic() : Math.ceil(parseFloat(swiper.params.slidesPerView, 10));
     if (swiper.slides.length < currentSlidesPerView) {
       console.warn('Swiper: Loop mode disabled - slides.length < slidesPerView');
@@ -2484,7 +2730,7 @@ var Swiper = (function () {
     }
     loopedSlides += params.loopAdditionalSlides;
     swiper.loopedSlides = loopedSlides;
-    if (slides.length < slidesPerView + loopedSlides) {
+    if (slides.length < slidesPerView + loopedSlides || swiper.params.effect === 'cards' && slides.length < slidesPerView + loopedSlides * 2) {
       showWarning('Swiper Loop Warning: The number of slides is not enough for loop mode, it will be disabled or not function properly. You need to add more slides (or make duplicates) or lower the values of slidesPerView and slidesPerGroup parameters');
     }
     const isNext = direction === 'next' || !direction;
@@ -2510,16 +2756,20 @@ var Swiper = (function () {
       activeSlideIndex = swiper.getSlideIndex(slides.find(el => el.classList.contains(params.slideActiveClass)));
     }
 
-    // DocumentFragment to hold slide clones
+    // Tạo DocumentFragment để chứa các slide clone
     const cloneFragment = document.createDocumentFragment();
 
-    // Clone slides according to numberOfSlidesNeedClone and append to fragment
+    // Clone các slide theo numberOfSlidesNeedClone (đã đảo ngược) và thêm vào fragment
     (isNext ? numberOfSlidesNeedClone : numberOfSlidesNeedClone.reverse()).forEach(index => {
       if (slides[index]) {
         const originalSlide = slides[index];
         const clonedSlide = originalSlide.cloneNode(true);
+
+        // Đánh dấu slide clone
         clonedSlide.setAttribute('data-swiper-clone', 'true');
         clonedSlide.classList.add('swiper-slide-clone');
+
+        // Thêm clone vào fragment
         cloneFragment.appendChild(clonedSlide);
       }
     });
@@ -2540,28 +2790,32 @@ var Swiper = (function () {
       });
     }
 
-    // Sort cloned slides by data-swiper-slide-index
+    // Sắp xếp cloneFragment theo data-swiper-slide-index tăng dần
     const clonedSlides = Array.from(cloneFragment.children);
     clonedSlides.sort((a, b) => {
       const indexA = parseInt(a.getAttribute('data-swiper-slide-index')) || 0;
       const indexB = parseInt(b.getAttribute('data-swiper-slide-index')) || 0;
       return indexA - indexB;
     });
+
+    // Xóa tất cả children cũ và thêm lại theo thứ tự đã sắp xếp
     cloneFragment.innerHTML = '';
     clonedSlides.forEach(slide => {
       cloneFragment.appendChild(slide);
     });
 
-    // Place fragment into the right position
+    // Thêm fragment vào vị trí phù hợp
     if (isPrev) {
+      // Nếu là prev, thêm fragment vào cuối slidesEl
       slidesEl.appendChild(cloneFragment);
     } else if (isNext) {
+      // Nếu là next, thêm fragment vào đầu slidesEl
       slidesEl.insertBefore(cloneFragment, slidesEl.firstChild);
     }
     swiper.recalcSlides();
     swiper.updateSlides();
 
-    // Find old active slide index after recalculation
+    // Tìm slide có data-swiper-slide-index tương ứng
     let oldActiveIndex = null;
     for (let i = 0; i < slidesEl.children.length; i++) {
       const child = slidesEl.children[i];
@@ -2574,7 +2828,7 @@ var Swiper = (function () {
       swiper.slideTo(oldActiveIndex, 0);
     }
 
-    // Update translate after removing clones for animation
+    // Tìm vị trí slide cũ sau khi remove clone để set lại translate tạo hiệu ứng animate
     const skip = Math.min(swiper.params.slidesPerGroupSkip, newIndex);
     let snapIndex = skip + Math.floor((newIndex - skip) / swiper.params.slidesPerGroup);
     if (snapIndex >= swiper.snapGrid.length) snapIndex = swiper.snapGrid.length - 1;
@@ -2600,8 +2854,7 @@ var Swiper = (function () {
       }
       swiper.setTranslate(updateTranslate);
     }
-
-    // Remove clones
+    // Remove slide clone ra khỏi slidesEl sau khi slideTo hoàn thành
     const cloneSlides = slidesEl.querySelectorAll('[data-swiper-clone="true"]');
     cloneSlides.forEach(cloneSlide => {
       if (cloneSlide.parentNode) {
@@ -2631,7 +2884,7 @@ var Swiper = (function () {
       params,
       slidesEl
     } = swiper;
-    if (!params.loop || !slidesEl) return;
+    if (!params.loop || !slidesEl || swiper.virtual && swiper.params.virtual.enabled) return;
     swiper.recalcSlides();
     const newSlidesOrder = [];
     swiper.slides.forEach(slideEl => {
@@ -2692,6 +2945,7 @@ var Swiper = (function () {
     unsetGrabCursor
   };
 
+  // Modified from https://stackoverflow.com/questions/54520554/custom-element-getrootnode-closest-function-crossing-multiple-parent-shadowd
   function closestElement(selector, base) {
     if (base === void 0) {
       base = this;
@@ -2700,7 +2954,9 @@ var Swiper = (function () {
       if (!el || el === getDocument() || el === getWindow()) return null;
       if (el.assignedSlot) el = el.assignedSlot;
       const found = el.closest(selector);
-      if (!found && !el.getRootNode) return null;
+      if (!found && !el.getRootNode) {
+        return null;
+      }
       return found || __closestFrom(el.getRootNode().host);
     }
     return __closestFrom(base);
@@ -2728,7 +2984,9 @@ var Swiper = (function () {
     if (e.originalEvent) e = e.originalEvent;
     const data = swiper.touchEventsData;
     if (e.type === 'pointerdown') {
-      if (data.pointerId !== null && data.pointerId !== e.pointerId) return;
+      if (data.pointerId !== null && data.pointerId !== e.pointerId) {
+        return;
+      }
       data.pointerId = e.pointerId;
     } else if (e.type === 'touchstart' && e.targetTouches.length === 1) {
       data.touchId = e.targetTouches[0].identifier;
@@ -2745,7 +3003,9 @@ var Swiper = (function () {
     } = swiper;
     if (!enabled) return;
     if (!params.simulateTouch && e.pointerType === 'mouse') return;
-    if (swiper.animating && params.preventInteractionOnTransition) return;
+    if (swiper.animating && params.preventInteractionOnTransition) {
+      return;
+    }
     if (!swiper.animating && params.cssMode && params.loop) {
       swiper.loopFix();
     }
@@ -2756,6 +3016,8 @@ var Swiper = (function () {
     if ('which' in e && e.which === 3) return;
     if ('button' in e && e.button > 0) return;
     if (data.isTouched && data.isMoved) return;
+
+    // change target el for shadow root component
     const swipingClassHasValue = !!params.noSwipingClass && params.noSwipingClass !== '';
     // eslint-disable-next-line
     const eventPath = e.composedPath ? e.composedPath() : e.path;
@@ -2764,6 +3026,8 @@ var Swiper = (function () {
     }
     const noSwipingSelector = params.noSwipingSelector ? params.noSwipingSelector : `.${params.noSwipingClass}`;
     const isTargetShadow = !!(e.target && e.target.shadowRoot);
+
+    // use closestElement for shadow root element to get the actual closest for nested shadow root element
     if (params.noSwiping && (isTargetShadow ? closestElement(noSwipingSelector, targetEl) : targetEl.closest(noSwipingSelector))) {
       swiper.allowClick = true;
       return;
@@ -2775,7 +3039,12 @@ var Swiper = (function () {
     touches.currentY = e.pageY;
     const startX = touches.currentX;
     const startY = touches.currentY;
-    if (!preventEdgeSwipe(swiper, e, startX)) return;
+
+    // Do NOT start if iOS edge swipe is detected. Otherwise iOS app cannot swipe-to-go-back anymore
+
+    if (!preventEdgeSwipe(swiper, e, startX)) {
+      return;
+    }
     Object.assign(data, {
       isTouched: true,
       isMoved: false,
@@ -2804,6 +3073,9 @@ var Swiper = (function () {
     if ((params.touchStartForcePreventDefault || shouldPreventDefault) && !targetEl.isContentEditable) {
       e.preventDefault();
     }
+    if (params.freeMode && params.freeMode.enabled && swiper.freeMode && swiper.animating && !params.cssMode) {
+      swiper.freeMode.onTouchStart();
+    }
     swiper.emit('touchStart', e);
   }
 
@@ -2822,7 +3094,7 @@ var Swiper = (function () {
     let e = event;
     if (e.originalEvent) e = e.originalEvent;
     if (e.type === 'pointermove') {
-      if (data.touchId !== null) return;
+      if (data.touchId !== null) return; // return from pointer if we use touch
       const id = e.pointerId;
       if (id !== data.pointerId) return;
     }
@@ -2863,6 +3135,7 @@ var Swiper = (function () {
     }
     if (params.touchReleaseOnEdges && !params.loop) {
       if (swiper.isVertical()) {
+        // Vertical
         if (pageY < touches.startY && swiper.translate <= swiper.maxTranslate() || pageY > touches.startY && swiper.translate >= swiper.minTranslate()) {
           data.isTouched = false;
           data.isMoved = false;
@@ -2964,6 +3237,7 @@ var Swiper = (function () {
         swiper.wrapperEl.dispatchEvent(evt);
       }
       data.allowMomentumBounce = false;
+      // Grab Cursor
       if (params.grabCursor && (swiper.allowSlideNext === true || swiper.allowSlidePrev === true)) {
         swiper.setGrabCursor(true);
       }
@@ -3034,6 +3308,8 @@ var Swiper = (function () {
     if (!swiper.allowSlidePrev && !swiper.allowSlideNext) {
       data.currentTranslate = data.startTranslate;
     }
+
+    // Threshold
     if (params.threshold > 0) {
       if (Math.abs(diff) > params.threshold || data.allowThresholdMove) {
         if (!data.allowThresholdMove) {
@@ -3051,12 +3327,17 @@ var Swiper = (function () {
     }
     if (!params.followFinger || params.cssMode) return;
 
-    // core-lite: no optional feature updates; only watchSlidesProgress
-    if (params.watchSlidesProgress) {
+    // Update active index in free mode
+    if (params.freeMode && params.freeMode.enabled && swiper.freeMode || params.watchSlidesProgress) {
       swiper.updateActiveIndex();
       swiper.updateSlidesClasses();
     }
+    if (params.freeMode && params.freeMode.enabled && swiper.freeMode) {
+      swiper.freeMode.onTouchMove();
+    }
+    // Update progress
     swiper.updateProgress(data.currentTranslate);
+    // Update translate
     swiper.setTranslate(data.currentTranslate);
   }
 
@@ -3068,7 +3349,7 @@ var Swiper = (function () {
     let targetTouch;
     const isTouchEvent = e.type === 'touchend' || e.type === 'touchcancel';
     if (!isTouchEvent) {
-      if (data.touchId !== null) return;
+      if (data.touchId !== null) return; // return from pointer if we use touch
       if (e.pointerId !== data.pointerId) return;
       targetTouch = e;
     } else {
@@ -3077,7 +3358,9 @@ var Swiper = (function () {
     }
     if (['pointercancel', 'pointerout', 'pointerleave', 'contextmenu'].includes(e.type)) {
       const proceed = ['pointercancel', 'contextmenu'].includes(e.type) && (swiper.browser.isSafari || swiper.browser.isWebView);
-      if (!proceed) return;
+      if (!proceed) {
+        return;
+      }
     }
     data.pointerId = null;
     data.touchId = null;
@@ -3095,7 +3378,9 @@ var Swiper = (function () {
     }
     data.allowTouchCallbacks = false;
     if (!data.isTouched) {
-      if (data.isMoved && params.grabCursor) swiper.setGrabCursor(false);
+      if (data.isMoved && params.grabCursor) {
+        swiper.setGrabCursor(false);
+      }
       data.isMoved = false;
       data.startMoving = false;
       return;
@@ -3105,6 +3390,8 @@ var Swiper = (function () {
     if (params.grabCursor && data.isMoved && data.isTouched && (swiper.allowSlideNext === true || swiper.allowSlidePrev === true)) {
       swiper.setGrabCursor(false);
     }
+
+    // Time diff
     const touchEndTime = now();
     const timeDiff = touchEndTime - data.touchStartTime;
 
@@ -3131,8 +3418,20 @@ var Swiper = (function () {
     data.isMoved = false;
     data.startMoving = false;
     let currentPos;
-    if (params.followFinger) currentPos = rtl ? swiper.translate : -swiper.translate;else currentPos = -data.currentTranslate;
-    if (params.cssMode) return;
+    if (params.followFinger) {
+      currentPos = rtl ? swiper.translate : -swiper.translate;
+    } else {
+      currentPos = -data.currentTranslate;
+    }
+    if (params.cssMode) {
+      return;
+    }
+    if (params.freeMode && params.freeMode.enabled) {
+      swiper.freeMode.onTouchEnd({
+        currentPos
+      });
+      return;
+    }
 
     // Find current slide
     const swipeToLast = currentPos >= -swiper.maxTranslate() && !swiper.params.loop;
@@ -3154,22 +3453,22 @@ var Swiper = (function () {
     let rewindLastIndex = null;
     if (params.rewind) {
       if (swiper.isBeginning) {
-        rewindLastIndex = swiper.slides.length - 1;
+        rewindLastIndex = params.virtual && params.virtual.enabled && swiper.virtual ? swiper.virtual.slides.length - 1 : swiper.slides.length - 1;
       } else if (swiper.isEnd) {
         rewindFirstIndex = 0;
       }
     }
+    // Find current slide size
     const ratio = (currentPos - slidesGrid[stopIndex]) / groupSize;
     const increment = stopIndex < params.slidesPerGroupSkip - 1 ? 1 : params.slidesPerGroup;
     if (timeDiff > params.longSwipesMs) {
+      // Long touches
       if (!params.longSwipes) {
         swiper.slideTo(swiper.activeIndex);
         return;
       }
       if (swiper.swipeDirection === 'next') {
-        if (ratio >= params.longSwipesRatio) {
-          swiper.slideTo(params.rewind && swiper.isEnd ? rewindFirstIndex : stopIndex + increment);
-        } else swiper.slideTo(stopIndex);
+        if (ratio >= params.longSwipesRatio) swiper.slideTo(params.rewind && swiper.isEnd ? rewindFirstIndex : stopIndex + increment);else swiper.slideTo(stopIndex);
       }
       if (swiper.swipeDirection === 'prev') {
         if (ratio > 1 - params.longSwipesRatio) {
@@ -3221,6 +3520,7 @@ var Swiper = (function () {
       allowSlidePrev,
       snapGrid
     } = swiper;
+    const isVirtual = swiper.virtual && swiper.params.virtual.enabled;
 
     // Disable locks on resize
     swiper.allowSlideNext = true;
@@ -3228,12 +3528,15 @@ var Swiper = (function () {
     swiper.updateSize();
     swiper.updateSlides();
     swiper.updateSlidesClasses();
-    if ((params.slidesPerView === 'auto' || params.slidesPerView > 1) && swiper.isEnd && !swiper.isBeginning && !swiper.params.centeredSlides) {
+    const isVirtualLoop = isVirtual && params.loop;
+    if ((params.slidesPerView === 'auto' || params.slidesPerView > 1) && swiper.isEnd && !swiper.isBeginning && !swiper.params.centeredSlides && !isVirtualLoop) {
       swiper.slideTo(swiper.slides.length - 1, 0, false, true);
-    } else if (swiper.params.loop) {
-      swiper.slideToLoop(swiper.realIndex, 0, false, true);
     } else {
-      swiper.slideTo(swiper.activeIndex, 0, false, true);
+      if (swiper.params.loop && !isVirtual) {
+        swiper.slideToLoop(swiper.realIndex, 0, false, true);
+      } else {
+        swiper.slideTo(swiper.activeIndex, 0, false, true);
+      }
     }
     if (swiper.autoplay && swiper.autoplay.running && swiper.autoplay.paused) {
       clearTimeout(swiper.autoplay.resizeTimeout);
@@ -3243,11 +3546,10 @@ var Swiper = (function () {
         }
       }, 500);
     }
-
     // Return locks after resize
     swiper.allowSlidePrev = allowSlidePrev;
     swiper.allowSlideNext = allowSlideNext;
-    if (params.watchOverflow && snapGrid !== swiper.snapGrid) {
+    if (swiper.params.watchOverflow && snapGrid !== swiper.snapGrid) {
       swiper.checkOverflow();
     }
   }
@@ -3301,10 +3603,6 @@ var Swiper = (function () {
     if (swiper.params.cssMode || swiper.params.slidesPerView !== 'auto' && !swiper.params.autoHeight) {
       return;
     }
-    const el = e?.target;
-    // IMG, IFRAME, EMBED with width/height attributes don't change slide size — no need to call swiper.update()
-    if (!el || !['IMG', 'IFRAME', 'EMBED'].includes(el.tagName)) return;
-    if (el.hasAttribute('width') && el.hasAttribute('height')) return;
     swiper.update();
   }
 
@@ -3416,15 +3714,8 @@ var Swiper = (function () {
     detachEvents
   };
 
-  const toggleModule = (swiper, params, breakpointParams, prop) => {
-    const wasModuleEnabled = params[prop] && params[prop].enabled;
-    const isModuleEnabled = breakpointParams[prop] && breakpointParams[prop].enabled;
-    if (wasModuleEnabled && !isModuleEnabled) {
-      swiper[prop].disable();
-    }
-    if (!wasModuleEnabled && isModuleEnabled) {
-      swiper[prop].enable();
-    }
+  const isGridEnabled = (swiper, params) => {
+    return swiper.grid && params.grid && params.grid.rows > 1;
   };
   function setBreakpoint() {
     const swiper = this;
@@ -3445,20 +3736,38 @@ var Swiper = (function () {
     if (!breakpoint || swiper.currentBreakpoint === breakpoint) return;
     const breakpointOnlyParams = breakpoint in breakpoints ? breakpoints[breakpoint] : undefined;
     const breakpointParams = breakpointOnlyParams || swiper.originalParams;
+    const wasMultiRow = isGridEnabled(swiper, params);
+    const isMultiRow = isGridEnabled(swiper, breakpointParams);
     const wasGrabCursor = swiper.params.grabCursor;
     const isGrabCursor = breakpointParams.grabCursor;
     const wasEnabled = params.enabled;
+    if (wasMultiRow && !isMultiRow) {
+      el.classList.remove(`${params.containerModifierClass}grid`, `${params.containerModifierClass}grid-column`);
+      swiper.emitContainerClasses();
+    } else if (!wasMultiRow && isMultiRow) {
+      el.classList.add(`${params.containerModifierClass}grid`);
+      if (breakpointParams.grid.fill && breakpointParams.grid.fill === 'column' || !breakpointParams.grid.fill && params.grid.fill === 'column') {
+        el.classList.add(`${params.containerModifierClass}grid-column`);
+      }
+      swiper.emitContainerClasses();
+    }
     if (wasGrabCursor && !isGrabCursor) {
       swiper.unsetGrabCursor();
     } else if (!wasGrabCursor && isGrabCursor) {
       swiper.setGrabCursor();
     }
 
-    // Core-lite: toggle navigation & pagination only.
-    const modules = ['navigation', 'pagination'];
-    modules.forEach(prop => {
+    // Toggle navigation, pagination, scrollbar
+    ['navigation', 'pagination', 'scrollbar'].forEach(prop => {
       if (typeof breakpointParams[prop] === 'undefined') return;
-      toggleModule(swiper, params, breakpointParams, prop);
+      const wasModuleEnabled = params[prop] && params[prop].enabled;
+      const isModuleEnabled = breakpointParams[prop] && breakpointParams[prop].enabled;
+      if (wasModuleEnabled && !isModuleEnabled) {
+        swiper[prop].disable();
+      }
+      if (!wasModuleEnabled && isModuleEnabled) {
+        swiper[prop].enable();
+      }
     });
     const directionChanged = breakpointParams.direction && breakpointParams.direction !== params.direction;
     const needsReLoop = params.loop && (breakpointParams.slidesPerView !== params.slidesPerView || directionChanged);
@@ -3540,7 +3849,7 @@ var Swiper = (function () {
     getBreakpoint
   };
 
-  const prepareClasses = (entries, prefix) => {
+  function prepareClasses(entries, prefix) {
     const resultClasses = [];
     entries.forEach(item => {
       if (typeof item === 'object') {
@@ -3554,7 +3863,7 @@ var Swiper = (function () {
       }
     });
     return resultClasses;
-  };
+  }
   function addClasses() {
     const swiper = this;
     const {
@@ -3564,12 +3873,17 @@ var Swiper = (function () {
       el,
       device
     } = swiper;
-    // core-lite: removed module-specific classes
     // prettier-ignore
     const suffixes = prepareClasses(['initialized', params.direction, {
+      'free-mode': swiper.params.freeMode && params.freeMode.enabled
+    }, {
       'autoheight': params.autoHeight
     }, {
       'rtl': rtl
+    }, {
+      'grid': params.grid && params.grid.rows > 1
+    }, {
+      'grid-column': params.grid && params.grid.rows > 1 && params.grid.fill === 'column'
     }, {
       'android': device.android
     }, {
@@ -3666,12 +3980,16 @@ var Swiper = (function () {
     autoHeight: false,
     // Set wrapper width
     setWrapperSize: false,
-    // Effects (core-lite only supports `slide`)
+    // Virtual Translate
+    virtualTranslate: false,
+    // Effects
     effect: 'slide',
+    // 'slide' or 'fade' or 'cube' or 'coverflow' or 'flip'
+
     // Breakpoints
     breakpoints: undefined,
     breakpointsBase: 'window',
-    // Slides
+    // Slides grid
     spaceBetween: 0,
     slidesPerView: 1,
     slidesPerGroup: 1,
@@ -3774,9 +4092,7 @@ var Swiper = (function () {
       if (moduleParamName === 'navigation' && params[moduleParamName] && params[moduleParamName].enabled && !params[moduleParamName].prevEl && !params[moduleParamName].nextEl) {
         params[moduleParamName].auto = true;
       }
-
-      // Core-lite: keep only pagination auto-init.
-      if (moduleParamName === 'pagination' && params[moduleParamName] && params[moduleParamName].enabled && !params[moduleParamName].el) {
+      if (['pagination', 'scrollbar'].indexOf(moduleParamName) >= 0 && params[moduleParamName] && params[moduleParamName].enabled && !params[moduleParamName].el) {
         params[moduleParamName].auto = true;
       }
       if (!(moduleParamName in params && 'enabled' in moduleParams)) {
@@ -3902,6 +4218,7 @@ var Swiper = (function () {
         // Indexes
         activeIndex: 0,
         realIndex: 0,
+        //
         isBeginning: true,
         isEnd: false,
         // Props
@@ -3928,9 +4245,12 @@ var Swiper = (function () {
           currentTranslate: undefined,
           startTranslate: undefined,
           allowThresholdMove: undefined,
+          // Form elements to match
           focusableElements: swiper.params.focusableElements,
+          // Last click time
           lastClickTime: 0,
           clickTimeout: undefined,
+          // Velocities
           velocities: [],
           allowMomentumBounce: undefined,
           startMoving: undefined,
@@ -3959,6 +4279,7 @@ var Swiper = (function () {
         swiper.init();
       }
 
+      // Return app instance
       // eslint-disable-next-line no-constructor-return
       return swiper;
     }
@@ -3990,6 +4311,16 @@ var Swiper = (function () {
     getSlideIndexByData(index) {
       return this.getSlideIndex(this.slides.find(slideEl => slideEl.getAttribute('data-swiper-slide-index') * 1 === index));
     }
+    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 {
@@ -4091,15 +4422,21 @@ var Swiper = (function () {
           }
         }
       } else {
+        // eslint-disable-next-line
         if (view === 'current') {
           for (let i = activeIndex + 1; i < slides.length; i += 1) {
             const slideInView = exact ? slidesGrid[i] + slidesSizesGrid[i] - slidesGrid[activeIndex] < swiperSize : slidesGrid[i] - slidesGrid[activeIndex] < swiperSize;
-            if (slideInView) spv += 1;
+            if (slideInView) {
+              spv += 1;
+            }
           }
         } else {
+          // previous
           for (let i = activeIndex - 1; i >= 0; i -= 1) {
             const slideInView = slidesGrid[activeIndex] - slidesGrid[i] < swiperSize;
-            if (slideInView) spv += 1;
+            if (slideInView) {
+              spv += 1;
+            }
           }
         }
       }
@@ -4112,11 +4449,14 @@ var Swiper = (function () {
         snapGrid,
         params
       } = swiper;
+      // Breakpoints
       if (params.breakpoints) {
         swiper.setBreakpoint();
       }
       [...swiper.el.querySelectorAll('[loading="lazy"]')].forEach(imageEl => {
-        if (imageEl.complete) processLazyPreloader(swiper, imageEl);
+        if (imageEl.complete) {
+          processLazyPreloader(swiper, imageEl);
+        }
       });
       swiper.updateSize();
       swiper.updateSlides();
@@ -4130,12 +4470,22 @@ var Swiper = (function () {
         swiper.updateSlidesClasses();
       }
       let translated;
-      if ((params.slidesPerView === 'auto' || params.slidesPerView > 1) && swiper.isEnd && !params.centeredSlides) {
-        translated = swiper.slideTo(swiper.slides.length - 1, 0, false, true);
+      if (params.freeMode && params.freeMode.enabled && !params.cssMode) {
+        setTranslate();
+        if (params.autoHeight) {
+          swiper.updateAutoHeight();
+        }
       } else {
-        translated = swiper.slideTo(swiper.activeIndex, 0, false, true);
+        if ((params.slidesPerView === 'auto' || params.slidesPerView > 1) && swiper.isEnd && !params.centeredSlides) {
+          const slides = swiper.virtual && params.virtual.enabled ? swiper.virtual.slides : swiper.slides;
+          translated = swiper.slideTo(slides.length - 1, 0, false, true);
+        } else {
+          translated = swiper.slideTo(swiper.activeIndex, 0, false, true);
+        }
+        if (!translated) {
+          setTranslate();
+        }
       }
-      if (!translated) setTranslate();
       if (params.watchOverflow && snapGrid !== swiper.snapGrid) {
         swiper.checkOverflow();
       }
@@ -4148,6 +4498,7 @@ var Swiper = (function () {
       const swiper = this;
       const currentDirection = swiper.params.direction;
       if (!newDirection) {
+        // eslint-disable-next-line
         newDirection = currentDirection === 'horizontal' ? 'vertical' : 'horizontal';
       }
       if (newDirection === currentDirection || newDirection !== 'horizontal' && newDirection !== 'vertical') {
@@ -4185,11 +4536,15 @@ var Swiper = (function () {
     mount(element) {
       const swiper = this;
       if (swiper.mounted) return true;
+
+      // Find el
       let el = element || swiper.params.el;
       if (typeof el === 'string') {
         el = document.querySelector(el);
       }
-      if (!el) return false;
+      if (!el) {
+        return false;
+      }
       el.swiper = swiper;
       if (el.parentNode && el.parentNode.host && el.parentNode.host.nodeName === swiper.params.swiperElementNodeName.toUpperCase()) {
         swiper.isElement = true;
@@ -4200,10 +4555,12 @@ var Swiper = (function () {
       const getWrapper = () => {
         if (el && el.shadowRoot && el.shadowRoot.querySelector) {
           const res = el.shadowRoot.querySelector(getWrapperSelector());
+          // Children needs to return slot items
           return res;
         }
         return elementChildren(el, getWrapperSelector())[0];
       };
+      // Find Wrapper
       let wrapperEl = getWrapper();
       if (!wrapperEl && swiper.params.createElements) {
         wrapperEl = createElement('div', swiper.params.wrapperClass);
@@ -4218,6 +4575,7 @@ var Swiper = (function () {
         slidesEl: swiper.isElement && !el.parentNode.host.slideSlots ? el.parentNode.host : wrapperEl,
         hostEl: swiper.isElement ? el.parentNode.host : el,
         mounted: true,
+        // RTL
         rtl: el.dir.toLowerCase() === 'rtl' || elementStyle(el, 'direction') === 'rtl',
         rtlTranslate: swiper.params.direction === 'horizontal' && (el.dir.toLowerCase() === 'rtl' || elementStyle(el, 'direction') === 'rtl'),
         wrongRTL: elementStyle(wrapperEl, 'display') === '-webkit-box'
@@ -4237,6 +4595,7 @@ var Swiper = (function () {
           const gap = Math.abs(swiper.snapGrid[1] - swiper.snapGrid[0]);
           const swiperTranslate = structuredClone(swiper.snapGrid[1]);
           if (isFirstSlide) {
+            // Move last item to first position when at first slide
             const lastSlide = slides.at(-1);
             lastSlide.swiperLoopMoveDOM = true;
             swiper.slidesEl.prepend(lastSlide);
@@ -4248,6 +4607,7 @@ var Swiper = (function () {
             swiper.setTransition(speed);
             swiper.setTranslate(-swiperTranslate);
           } else if (isLastSlide) {
+            // Move first item to last position when at last slide
             const firstSlide = slides[0];
             firstSlide.swiperLoopMoveDOM = true;
             swiper.slidesEl.append(firstSlide);
@@ -4268,24 +4628,42 @@ var Swiper = (function () {
       const mounted = swiper.mount(el);
       if (mounted === false) return swiper;
       swiper.emit('beforeInit');
+
+      // Set breakpoint
       if (swiper.params.breakpoints) {
         swiper.setBreakpoint();
       }
+
+      // Add Classes
       swiper.addClasses();
+
+      // Update size
       swiper.updateSize();
+
+      // Update slides
       swiper.updateSlides();
       if (swiper.params.watchOverflow) {
         swiper.checkOverflow();
       }
+
+      // Set Grab Cursor
       if (swiper.params.grabCursor && swiper.enabled) {
         swiper.setGrabCursor();
       }
 
-      // Slide to initial slide (core-lite: no optional feature initial offsets)
-      swiper.slideTo(swiper.params.initialSlide, 0, swiper.params.runCallbacksOnInit, false, true);
+      // Slide To Initial Slide
+      if (swiper.params.loop && swiper.virtual && swiper.params.virtual.enabled) {
+        swiper.slideTo(swiper.params.initialSlide + swiper.virtual.slidesBefore, 0, swiper.params.runCallbacksOnInit, false, true);
+      } else {
+        swiper.slideTo(swiper.params.initialSlide, 0, swiper.params.runCallbacksOnInit, false, true);
+      }
+
+      // Create loop
       if (swiper.params.loop) {
         swiper.loopCreate(undefined, true);
       }
+
+      // Attach events
       swiper.attachEvents();
       const lazyElements = [...swiper.el.querySelectorAll('[loading="lazy"]')];
       if (swiper.isElement) {
@@ -4295,12 +4673,18 @@ var Swiper = (function () {
         if (imageEl.complete) {
           processLazyPreloader(swiper, imageEl);
         } else {
-          imageEl.addEventListener('load', e => processLazyPreloader(swiper, e.target));
+          imageEl.addEventListener('load', e => {
+            processLazyPreloader(swiper, e.target);
+          });
         }
       });
       preload(swiper);
+
+      // Init Flag
       swiper.initialized = true;
       preload(swiper);
+
+      // Emit
       swiper.emit('init');
       swiper.emit('afterInit');
       return swiper;
@@ -4323,15 +4707,27 @@ var Swiper = (function () {
         return null;
       }
       swiper.emit('beforeDestroy');
+
+      // Init Flag
       swiper.initialized = false;
+
+      // Detach events
       swiper.detachEvents();
+
+      // Destroy loop
       if (params.loop) {
         swiper.loopDestroy();
       }
+
+      // Cleanup styles
       if (cleanStyles) {
         swiper.removeClasses();
-        if (el && typeof el !== 'string') el.removeAttribute('style');
-        if (wrapperEl) wrapperEl.removeAttribute('style');
+        if (el && typeof el !== 'string') {
+          el.removeAttribute('style');
+        }
+        if (wrapperEl) {
+          wrapperEl.removeAttribute('style');
+        }
         if (slides && slides.length) {
           slides.forEach(slideEl => {
             slideEl.classList.remove(params.slideVisibleClass, params.slideFullyVisibleClass, params.slideActiveClass, params.slideNextClass, params.slidePrevClass);
@@ -4341,6 +4737,8 @@ var Swiper = (function () {
         }
       }
       swiper.emit('destroy');
+
+      // Detach emitter events
       Object.keys(swiper.eventsListeners).forEach(eventName => {
         swiper.off(eventName);
       });