@gem-sdk/swiper 0.0.7 → 0.0.8

package/swiper-react.mjs

@@ -1,5 +1,5 @@
 /**
- * Swiper React 0.0.7
+ * Swiper React 0.0.8
  * Gem SDK - Swiper, Customized of swiper
  * https://swiperjs.com
  *

package/swiper-vue.d.ts

@@ -118,6 +118,10 @@ declare const Swiper: DefineComponent<
       type: PropType<SwiperOptions['spaceBetween']>;
       default: undefined;
     };
+    isSneakPeekCenter: {
+      type: PropType<SwiperOptions['isSneakPeekCenter']>;
+      default: undefined;
+    };
     slidesPerView: {
       type: PropType<SwiperOptions['slidesPerView']>;
       default: undefined;
@@ -711,6 +715,11 @@ declare const Swiper: DefineComponent<
    */
   loopFix: (swiper: SwiperClass) => void;
 
+  /**
+   * Event will be fired after "loop fix dot"
+   */
+  loopFixDot: (swiper: SwiperClass) => void;
+
   /**
    * Event will be fired on breakpoint change
    */

package/swiper-vue.mjs

@@ -1,5 +1,5 @@
 /**
- * Swiper Vue 0.0.7
+ * Swiper Vue 0.0.8
  * Gem SDK - Swiper, Customized of swiper
  * https://swiperjs.com
  *
@@ -220,6 +220,10 @@ const Swiper = {
       type: [Number, String],
       default: undefined
     },
+    isSneakPeekCenter: {
+      type: Boolean,
+      default: false
+    },
     slidesPerView: {
       type: [Number, String],
       default: undefined
@@ -565,7 +569,7 @@ const Swiper = {
       default: undefined
     }
   },
-  emits: ['_beforeBreakpoint', '_containerClasses', '_slideClass', '_slideClasses', '_swiper', '_freeModeNoMomentumRelease', '_virtualUpdated', 'activeIndexChange', 'afterInit', 'autoplay', 'autoplayStart', 'autoplayStop', 'autoplayPause', 'autoplayResume', 'autoplayTimeLeft', 'beforeDestroy', 'beforeInit', 'beforeLoopFix', 'beforeResize', 'beforeSlideChangeStart', 'beforeTransitionStart', 'breakpoint', 'changeDirection', 'click', 'disable', 'doubleTap', 'doubleClick', 'destroy', 'enable', 'fromEdge', 'hashChange', 'hashSet', 'init', 'keyPress', 'lock', 'loopFix', 'momentumBounce', 'navigationHide', 'navigationShow', 'navigationPrev', 'navigationNext', 'observerUpdate', 'orientationchange', 'paginationHide', 'paginationRender', 'paginationShow', 'paginationUpdate', 'progress', 'reachBeginning', 'reachEnd', 'realIndexChange', 'resize', 'scroll', 'scrollbarDragEnd', 'scrollbarDragMove', 'scrollbarDragStart', 'setTransition', 'setTranslate', 'slidesUpdated', 'slideChange', 'slideChangeTransitionEnd', 'slideChangeTransitionStart', 'slideNextTransitionEnd', 'slideNextTransitionStart', 'slidePrevTransitionEnd', 'slidePrevTransitionStart', 'slideResetTransitionStart', 'slideResetTransitionEnd', 'sliderMove', 'sliderFirstMove', 'slidesLengthChange', 'slidesGridLengthChange', 'snapGridLengthChange', 'snapIndexChange', 'swiper', 'tap', 'toEdge', 'touchEnd', 'touchMove', 'touchMoveOpposite', 'touchStart', 'transitionEnd', 'transitionStart', 'unlock', 'update', 'virtualUpdate', 'zoomChange'],
+  emits: ['_beforeBreakpoint', '_containerClasses', '_slideClass', '_slideClasses', '_swiper', '_freeModeNoMomentumRelease', '_virtualUpdated', 'activeIndexChange', 'afterInit', 'autoplay', 'autoplayStart', 'autoplayStop', 'autoplayPause', 'autoplayResume', 'autoplayTimeLeft', 'beforeDestroy', 'beforeInit', 'beforeLoopFix', 'beforeResize', 'beforeSlideChangeStart', 'beforeTransitionStart', 'breakpoint', 'changeDirection', 'click', 'disable', 'doubleTap', 'doubleClick', 'destroy', 'enable', 'fromEdge', 'hashChange', 'hashSet', 'init', 'keyPress', 'lock', 'loopFix', 'loopFixDot', 'loopFixDotSneakPeek', 'momentumBounce', 'navigationHide', 'navigationShow', 'navigationPrev', 'navigationNext', 'observerUpdate', 'orientationchange', 'paginationHide', 'paginationRender', 'paginationShow', 'paginationUpdate', 'progress', 'reachBeginning', 'reachEnd', 'realIndexChange', 'resize', 'scroll', 'scrollbarDragEnd', 'scrollbarDragMove', 'scrollbarDragStart', 'setTransition', 'setTranslate', 'slidesUpdated', 'slideChange', 'slideChangeTransitionEnd', 'slideChangeTransitionStart', 'slideNextTransitionEnd', 'slideNextTransitionStart', 'slidePrevTransitionEnd', 'slidePrevTransitionStart', 'slideResetTransitionStart', 'slideResetTransitionEnd', 'sliderMove', 'sliderFirstMove', 'slidesLengthChange', 'slidesGridLengthChange', 'snapGridLengthChange', 'snapIndexChange', 'swiper', 'tap', 'toEdge', 'touchEnd', 'touchMove', 'touchMoveOpposite', 'touchStart', 'transitionEnd', 'transitionStart', 'unlock', 'update', 'virtualUpdate', 'zoomChange'],
   setup(props, _ref) {
     let {
       slots: originalSlots,

package/swiper.css

@@ -1,5 +1,5 @@
 /**
- * Swiper 0.0.7
+ * Swiper 0.0.8
  * Gem SDK - Swiper, Customized of swiper
  * https://swiperjs.com
  *

package/swiper.js

@@ -1,5 +1,5 @@
 /**
- * Swiper 0.0.7
+ * Swiper 0.0.8
  * Gem SDK - Swiper, Customized of swiper
  * https://swiperjs.com
  *
@@ -1988,56 +1988,63 @@ var Swiper = (function () {
     if (typeof speed === 'undefined') {
       speed = swiper.params.speed;
     }
-    const gridEnabled = swiper.grid && swiper.params.grid && swiper.params.grid.rows > 1;
     let newIndex = index;
     if (swiper.params.loop) {
-      if (swiper.virtual && swiper.params.virtual.enabled) {
-        // eslint-disable-next-line
-        newIndex = newIndex + swiper.virtual.slidesBefore;
+      swiper.slides;
+      const totalSlides = swiper.slides.length;
+      let targetSlideIndex;
+      targetSlideIndex = swiper.getSlideIndexByData(newIndex);
+      const cols = swiper.slides.length;
+      const {
+        centeredSlides
+      } = swiper.params;
+      let slidesPerView = swiper.params.slidesPerView;
+      if (slidesPerView === 'auto') {
+        slidesPerView = swiper.slidesPerViewDynamic();
       } else {
-        let targetSlideIndex;
-        if (gridEnabled) {
-          const slideIndex = newIndex * swiper.params.grid.rows;
-          targetSlideIndex = swiper.slides.find(slideEl => slideEl.getAttribute('data-swiper-slide-index') * 1 === slideIndex).column;
-        } else {
-          targetSlideIndex = swiper.getSlideIndexByData(newIndex);
-        }
-        const cols = gridEnabled ? Math.ceil(swiper.slides.length / swiper.params.grid.rows) : swiper.slides.length;
-        const {
-          centeredSlides
-        } = swiper.params;
-        let slidesPerView = swiper.params.slidesPerView;
-        if (slidesPerView === 'auto') {
-          slidesPerView = swiper.slidesPerViewDynamic();
-        } else {
-          slidesPerView = Math.ceil(parseFloat(swiper.params.slidesPerView, 10));
-          if (centeredSlides && slidesPerView % 2 === 0) {
-            slidesPerView = slidesPerView + 1;
-          }
-        }
-        let needLoopFix = cols - targetSlideIndex < slidesPerView;
-        if (centeredSlides) {
-          needLoopFix = needLoopFix || targetSlideIndex < Math.ceil(slidesPerView / 2);
-        }
-        if (internal && centeredSlides && swiper.params.slidesPerView !== 'auto' && !gridEnabled) {
-          needLoopFix = false;
+        slidesPerView = Math.ceil(parseFloat(swiper.params.slidesPerView, 10));
+        if (centeredSlides && slidesPerView % 2 === 0) {
+          slidesPerView = slidesPerView + 1;
         }
-        if (needLoopFix) {
-          const direction = centeredSlides ? targetSlideIndex < swiper.activeIndex ? 'prev' : 'next' : targetSlideIndex - swiper.activeIndex - 1 < swiper.params.slidesPerView ? 'next' : 'prev';
-          swiper.loopFix({
-            direction,
-            slideTo: true,
-            activeSlideIndex: direction === 'next' ? targetSlideIndex + 1 : targetSlideIndex - cols + 1,
-            slideRealIndex: direction === 'next' ? swiper.realIndex : undefined
-          });
-        }
-        if (gridEnabled) {
-          const slideIndex = newIndex * swiper.params.grid.rows;
-          newIndex = swiper.slides.find(slideEl => slideEl.getAttribute('data-swiper-slide-index') * 1 === slideIndex).column;
+      }
+      let needLoopFix = cols - targetSlideIndex < slidesPerView;
+      if (centeredSlides) {
+        needLoopFix = needLoopFix || targetSlideIndex < Math.ceil(slidesPerView / 2);
+      }
+      if (internal && centeredSlides && swiper.params.slidesPerView !== 'auto') {
+        needLoopFix = false;
+      }
+      if (centeredSlides && needLoopFix) {
+        const direction = centeredSlides ? targetSlideIndex < swiper.activeIndex ? 'prev' : 'next' : targetSlideIndex - swiper.activeIndex - 1 < swiper.params.slidesPerView ? 'next' : 'prev';
+        swiper.loopFix({
+          direction,
+          slideTo: true,
+          activeSlideIndex: direction === 'next' ? targetSlideIndex + 1 : targetSlideIndex - cols + 1,
+          slideRealIndex: direction === 'next' ? swiper.realIndex : undefined
+        });
+      }
+      if (!centeredSlides && needLoopFix) {
+        let direction;
+        let nextSteps;
+        let prevSteps;
+        if (swiper.activeIndex < targetSlideIndex) {
+          nextSteps = targetSlideIndex - swiper.activeIndex;
+          prevSteps = swiper.activeIndex - (targetSlideIndex - totalSlides);
         } else {
-          newIndex = swiper.getSlideIndexByData(newIndex);
+          prevSteps = swiper.activeIndex - targetSlideIndex;
+          nextSteps = targetSlideIndex + totalSlides - swiper.activeIndex;
         }
+        direction = nextSteps > prevSteps ? 'prev' : 'next';
+        swiper.loopFixDot({
+          direction,
+          slideTo: true,
+          activeSlideIndex: direction === 'next' ? targetSlideIndex + 1 : targetSlideIndex - cols + 1,
+          slideRealIndex: direction === 'next' ? swiper.realIndex : undefined,
+          targetSlideIndex,
+          newIndex: swiper.getSlideIndexByData(newIndex)
+        });
       }
+      newIndex = swiper.getSlideIndexByData(newIndex);
     }
     requestAnimationFrame(() => {
       swiper.slideTo(newIndex, speed, runCallbacks, internal);
@@ -2045,6 +2052,87 @@ var Swiper = (function () {
     return swiper;
   }
 
+  function slideToLoopCenterSneakPeek(index, speed, runCallbacks, internal) {
+    if (index === void 0) {
+      index = 0;
+    }
+    if (runCallbacks === void 0) {
+      runCallbacks = true;
+    }
+    if (typeof index === 'string') {
+      const indexAsNumber = parseInt(index, 10);
+      index = indexAsNumber;
+    }
+    const swiper = this;
+    if (swiper.destroyed) return;
+    if (typeof speed === 'undefined') {
+      speed = swiper.params.speed;
+    }
+    let newIndex = index;
+    if (swiper.params.loop) {
+      swiper.slides;
+      const totalSlides = swiper.slides.length;
+      let targetSlideIndex;
+      targetSlideIndex = swiper.getSlideIndexByData(newIndex);
+      const cols = swiper.slides.length;
+      const {
+        centeredSlides
+      } = swiper.params;
+      let slidesPerView = swiper.params.slidesPerView;
+      if (slidesPerView === 'auto') {
+        slidesPerView = swiper.slidesPerViewDynamic();
+      } else {
+        slidesPerView = Math.ceil(parseFloat(swiper.params.slidesPerView, 10));
+        if (centeredSlides && slidesPerView % 2 === 0) {
+          slidesPerView = slidesPerView + 1;
+        }
+      }
+      if (internal && centeredSlides && swiper.params.slidesPerView !== 'auto') ;
+      const isSneakPeekCenter = swiper.params?.isSneakPeekCenter;
+      if (isSneakPeekCenter) {
+        let direction;
+        let nextSteps;
+        let prevSteps;
+        if (swiper.activeIndex < targetSlideIndex) {
+          nextSteps = targetSlideIndex - swiper.activeIndex;
+          prevSteps = swiper.activeIndex - (targetSlideIndex - totalSlides);
+        } else {
+          prevSteps = swiper.activeIndex - targetSlideIndex;
+          nextSteps = targetSlideIndex + totalSlides - swiper.activeIndex;
+        }
+        direction = nextSteps > prevSteps ? 'prev' : 'next';
+        swiper.loopFixDot({
+          direction,
+          slideTo: true,
+          activeSlideIndex: direction === 'next' ? targetSlideIndex + 1 : targetSlideIndex - cols + 1,
+          slideRealIndex: direction === 'next' ? swiper.realIndex : undefined,
+          targetSlideIndex,
+          newIndex: swiper.getSlideIndexByData(newIndex)
+        });
+      }
+      newIndex = swiper.getSlideIndexByData(newIndex);
+    }
+    swiper.slideTo(newIndex, speed, runCallbacks, internal);
+    const slides = swiper.slides;
+    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);
+      lastSlide.swiperLoopMoveDOM = false;
+      swiper.setTransition(0);
+      swiper.setTranslate(-(swiperTranslate + gap));
+      swiper.recalcSlides();
+      swiper.updateSlides();
+      swiper.setTransition(swiper.params.speed);
+      swiper.setTranslate(-swiperTranslate);
+    }
+    return;
+  }
+
   /* eslint no-unused-vars: "off" */
   function slideNext(speed, runCallbacks, internal) {
     if (runCallbacks === void 0) {
@@ -2069,7 +2157,7 @@ var Swiper = (function () {
     if (params.loop) {
       if (animating && !isVirtual && params.loopPreventsSliding) return false;
 
-      // Check if loop is disabled
+      // 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({
@@ -2109,11 +2197,9 @@ var Swiper = (function () {
     if (typeof speed === 'undefined') {
       speed = swiper.params.speed;
     }
-    const isVirtual = swiper.virtual && params.virtual.enabled;
+    swiper.virtual && params.virtual.enabled;
     if (params.loop) {
-      if (animating && !isVirtual && params.loopPreventsSliding) return false;
-
-      // Check if loop is disabled
+      // 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({
@@ -2162,7 +2248,27 @@ var Swiper = (function () {
       });
       return true;
     }
-    return swiper.slideTo(prevIndex, speed, runCallbacks, internal);
+    requestAnimationFrame(() => {
+      swiper.slideTo(prevIndex, speed, runCallbacks, internal);
+      const slides = swiper.slides;
+      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);
+        lastSlide.swiperLoopMoveDOM = false;
+        swiper.setTransition(0);
+        swiper.setTranslate(-(swiperTranslate + gap));
+        swiper.recalcSlides();
+        swiper.updateSlides();
+        swiper.setTransition(swiper.params.speed);
+        swiper.setTranslate(-swiperTranslate);
+      }
+    });
+    return;
   }
 
   /* eslint no-unused-vars: "off" */
@@ -2251,6 +2357,7 @@ var Swiper = (function () {
   var slide = {
     slideTo,
     slideToLoop,
+    slideToLoopCenterSneakPeek,
     slideNext,
     slidePrev,
     slideReset,
@@ -2338,7 +2445,7 @@ var Swiper = (function () {
     const swiper = this;
     if (!swiper.params.loop) return;
 
-    // Disable loop mode if the number of slides is less 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');
@@ -2550,6 +2657,206 @@ var Swiper = (function () {
     swiper.emit('loopFix');
   }
 
+  function loopFixDot(_temp) {
+    let {
+      slideRealIndex,
+      slideTo = true,
+      direction,
+      activeSlideIndex,
+      initial,
+      targetSlideIndex,
+      newIndex
+    } = _temp === void 0 ? {} : _temp;
+    const swiper = this;
+    if (!swiper.params.loop) return;
+
+    // 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');
+      return;
+    }
+    swiper.emit('beforeLoopFix');
+    const {
+      slides,
+      allowSlidePrev,
+      allowSlideNext,
+      slidesEl,
+      params
+    } = swiper;
+    const targetData = slidesEl.children[targetSlideIndex].getAttribute('data-swiper-slide-index');
+    const oldActiveData = Array.from(slidesEl.children).find(el => el.classList.contains(params.slideActiveClass)).getAttribute('data-swiper-slide-index');
+    const {
+      centeredSlides,
+      initialSlide
+    } = params;
+    const swiperDataOldActiveIndex = slidesEl.children[swiper.activeIndex].getAttribute('data-swiper-slide-index');
+    swiper.allowSlidePrev = true;
+    swiper.allowSlideNext = true;
+    let slidesPerView = params.slidesPerView;
+    if (slidesPerView === 'auto') {
+      slidesPerView = swiper.slidesPerViewDynamic();
+    } else {
+      slidesPerView = Math.ceil(parseFloat(params.slidesPerView, 10));
+      if (centeredSlides && slidesPerView % 2 === 0) {
+        slidesPerView = slidesPerView + 1;
+      }
+    }
+    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 || 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;
+    const isPrev = direction === 'prev' || !direction;
+    let numberOfSlidesNeedClone = [];
+    let slidesIndex = [];
+    for (let i = 0; i < slidesEl.children.length; i++) {
+      slidesIndex.push(slidesEl.children[i].getAttribute('data-swiper-slide-index'));
+    }
+    if (isPrev) {
+      for (let i = targetSlideIndex; i < slidesEl.children.length; i++) {
+        numberOfSlidesNeedClone.push(i);
+      }
+    } else if (isNext) {
+      for (let i = 0; i < slidesPerView - (slidesEl.children.length - targetSlideIndex); i++) {
+        numberOfSlidesNeedClone.push(i);
+      }
+    }
+    const cols = slides.length;
+    const isInitialOverflow = initial && cols - initialSlide < slidesPerView && !centeredSlides;
+    isInitialOverflow ? initialSlide : swiper.activeIndex;
+    if (typeof activeSlideIndex === 'undefined') {
+      activeSlideIndex = swiper.getSlideIndex(slides.find(el => el.classList.contains(params.slideActiveClass)));
+    }
+
+    // Tạo DocumentFragment để chứa các slide clone
+    const cloneFragment = document.createDocumentFragment();
+
+    // 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);
+      }
+    });
+    if (isPrev) {
+      numberOfSlidesNeedClone.forEach(index => {
+        const originalSlide = slides[index];
+        originalSlide.swiperLoopMoveDOM = true;
+        slidesEl.prepend(originalSlide);
+        originalSlide.swiperLoopMoveDOM = false;
+      });
+    }
+    if (isNext) {
+      numberOfSlidesNeedClone.forEach(index => {
+        const originalSlide = slides[index];
+        originalSlide.swiperLoopMoveDOM = true;
+        slidesEl.append(originalSlide);
+        originalSlide.swiperLoopMoveDOM = false;
+      });
+    }
+
+    // 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);
+    });
+
+    // 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();
+
+    // 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];
+      if (child.getAttribute('data-swiper-slide-index') === swiperDataOldActiveIndex) {
+        oldActiveIndex = i;
+        break;
+      }
+    }
+    if (slideTo && oldActiveIndex !== swiper.activeIndex) {
+      swiper.slideTo(oldActiveIndex, 0);
+    }
+
+    // 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;
+    const translate = -swiper.snapGrid[snapIndex];
+    if (translate === swiper.translate) {
+      let oldActiveIndexAfterRemoveClone;
+      for (let i = 0; i < slidesEl.children.length; i++) {
+        const child = slidesEl.children[i];
+        if (child.getAttribute('data-swiper-slide-index') === swiperDataOldActiveIndex) {
+          oldActiveIndexAfterRemoveClone = i;
+          break;
+        }
+      }
+      const skip = Math.min(swiper.params.slidesPerGroupSkip, oldActiveIndexAfterRemoveClone);
+      let snapIndex = skip + Math.floor((oldActiveIndexAfterRemoveClone - skip) / swiper.params.slidesPerGroup);
+      if (snapIndex >= swiper.snapGrid.length) snapIndex = swiper.snapGrid.length - 1;
+      const oldTranslate = -swiper.snapGrid[snapIndex];
+      let updateTranslate;
+      if (oldTranslate === swiper.translate) {
+        updateTranslate = swiper.snapGrid[snapIndex > 0 ? snapIndex - 1 : swiper.snapGrid.length - 1];
+      } else {
+        updateTranslate = oldTranslate;
+      }
+      swiper.setTranslate(updateTranslate);
+    }
+    // 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) {
+        cloneSlide.parentNode.removeChild(cloneSlide);
+      }
+    });
+    swiper.recalcSlides();
+    swiper.updateSlides();
+    const targetDataIndex = Array.from(slidesEl.children).findIndex(el => el.getAttribute('data-swiper-slide-index') * 1 === targetData * 1);
+    const oldDataIndex = Array.from(slidesEl.children).findIndex(el => el.getAttribute('data-swiper-slide-index') * 1 === oldActiveData * 1);
+    const snapIndexNew = skip + Math.floor((targetDataIndex - skip) / swiper.params.slidesPerGroup);
+    const snapIndexOld = skip + Math.floor((oldDataIndex - skip) / swiper.params.slidesPerGroup);
+    if (slideTo && snapIndexNew === targetDataIndex) {
+      const translateOld = -swiper.snapGrid[snapIndexOld > swiper.snapGrid.length - 1 ? snapIndexNew - 1 > swiper.snapGrid.length - 1 ? 0 : snapIndexNew - 1 : snapIndexOld];
+      swiper.setTranslate(translateOld);
+    }
+    swiper.recalcSlides();
+    swiper.updateSlides();
+    swiper.allowSlidePrev = allowSlidePrev;
+    swiper.allowSlideNext = allowSlideNext;
+    swiper.emit('loopFixDot');
+  }
+
   function loopDestroy() {
     const swiper = this;
     const {
@@ -2576,6 +2883,7 @@ var Swiper = (function () {
   var loop = {
     loopCreate,
     loopFix,
+    loopFixDot,
     loopDestroy
   };
 
@@ -3711,6 +4019,7 @@ var Swiper = (function () {
     loopAddBlankSlides: true,
     loopAdditionalSlides: 0,
     loopPreventsSliding: true,
+    isSneakPeekCenter: false,
     // rewind
     rewind: false,
     // Swiping/no swiping

package/swiper.less

@@ -1,5 +1,5 @@
 /**
- * Swiper 0.0.7
+ * Swiper 0.0.8
  * Gem SDK - Swiper, Customized of swiper
  * https://swiperjs.com
  *

package/swiper.min.css

@@ -1,5 +1,5 @@
 /**
- * Swiper 0.0.7
+ * Swiper 0.0.8
  * Gem SDK - Swiper, Customized of swiper
  * https://swiperjs.com
  *