feat: remove loopedSlides parameter, add loopAdditionalSlides par…

…ameter
nolimits4web · Oct 18, 2023 · d647985 · d647985
1 parent 37eaf1e
commit d647985
Show file tree

Hide file tree

Showing 5 changed files with 14 additions and 12 deletions.
diff --git a/src/components-shared/params-list.mjs b/src/components-shared/params-list.mjs
@@ -68,7 +68,7 @@ const paramsList = [
   'preventClicksPropagation',
   '_slideToClickedSlide',
   '_loop',
-  'loopedSlides',
+  'loopAdditionalSlides',
   'loopAddBlankSlides',
   'loopPreventsSliding',
   '_rewind',

diff --git a/src/core/defaults.mjs b/src/core/defaults.mjs
@@ -101,7 +101,7 @@ export default {
   // loop
   loop: false,
   loopAddBlankSlides: true,
-  loopedSlides: null,
+  loopAdditionalSlides: 0,
   loopPreventsSliding: true,
 
   // rewind

diff --git a/src/core/loop/loopFix.mjs b/src/core/loop/loopFix.mjs
@@ -42,11 +42,13 @@ export default function loopFix({
     }
   }
 
-  let loopedSlides = params.loopedSlides || params.slidesPerGroup;
-  if (loopedSlides % params.slidesPerGroup !== 0) {
-    loopedSlides += params.slidesPerGroup - (loopedSlides % params.slidesPerGroup);
+  const slidesPerGroup = params.slidesPerGroupAuto ? slidesPerView : params.slidesPerGroup;
+  let loopedSlides = slidesPerGroup;
+
+  if (loopedSlides % slidesPerGroup !== 0) {
+    loopedSlides += slidesPerGroup - (loopedSlides % slidesPerGroup);
   }
-  swiper.loopedSlides = loopedSlides;
+  swiper.loopedSlides = loopedSlides + params.loopAdditionalSlides;
   const gridEnabled = swiper.grid && params.grid && params.grid.rows > 1;
 
   if (slides.length < slidesPerView + loopedSlides) {
@@ -83,7 +85,7 @@ export default function loopFix({
     (centeredSlides && typeof setTranslate === 'undefined' ? -slidesPerView / 2 + 0.5 : 0);
   // prepend last slides before start
   if (activeColIndexWithShift < loopedSlides) {
-    slidesPrepended = Math.max(loopedSlides - activeColIndexWithShift, params.slidesPerGroup);
+    slidesPrepended = Math.max(loopedSlides - activeColIndexWithShift, slidesPerGroup);
     for (let i = 0; i < loopedSlides - activeColIndexWithShift; i += 1) {
       const index = i - Math.floor(i / cols) * cols;
       if (gridEnabled) {
@@ -101,7 +103,7 @@ export default function loopFix({
   } else if (activeColIndexWithShift + slidesPerView > cols - loopedSlides) {
     slidesAppended = Math.max(
       activeColIndexWithShift - (cols - loopedSlides * 2),
-      params.slidesPerGroup,
+      slidesPerGroup,
     );
     for (let i = 0; i < slidesAppended; i += 1) {
       const index = i - Math.floor(i / cols) * cols;

diff --git a/src/swiper-vue.d.ts b/src/swiper-vue.d.ts
@@ -253,7 +253,7 @@ declare const Swiper: DefineComponent<
     };
     loop: { type: BooleanConstructor; default: undefined };
     loopAddBlankSlides: { type: BooleanConstructor; default: undefined };
-    loopedSlides: {
+    loopAdditionalSlides: {
       type: NumberConstructor;
       default: undefined;
     };

diff --git a/src/types/swiper-options.d.ts b/src/types/swiper-options.d.ts
@@ -649,11 +649,11 @@ export interface SwiperOptions {
   loopAddBlankSlides?: boolean;
 
   /**
-   * Defines how many slides before end/beginning it should rearrange (loop) slides. If not specified, defaults to `slidesPerView`
+   * Allows to increase amount of looped slides
    *
-   * @default null
+   * @default 0
    */
-  loopedSlides?: number | null;
+  loopAdditionalSlides?: number;
 
   /**
    * If enabled then slideNext/Prev will do nothing while slider is animating in loop mode