fix(pagination): support bulle multiple classes

fixes #6447
nolimits4web · Mar 16, 2023 · 20b05fa · 20b05fa
1 parent bcb275f
commit 20b05fa
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 8 deletions.
diff --git a/src/modules/a11y/a11y.js b/src/modules/a11y/a11y.js
@@ -189,7 +189,7 @@ export default function A11y({ swiper, extendParams, on }) {
           );
         }
       }
-      if (bulletEl.matches(`.${swiper.params.pagination.bulletActiveClass}`)) {
+      if (bulletEl.matches(classesToSelector(swiper.params.pagination.bulletActiveClass))) {
         bulletEl.setAttribute('aria-current', 'true');
       } else {
         bulletEl.removeAttribute('aria-current');

diff --git a/src/modules/pagination/pagination.js b/src/modules/pagination/pagination.js
@@ -151,22 +151,25 @@ export default function Pagination({ swiper, extendParams, on, emit }) {
         midIndex = (lastIndex + firstIndex) / 2;
       }
       bullets.forEach((bulletEl) => {
-        bulletEl.classList.remove(
+        const classesToRemove = [
           ...['', '-next', '-next-next', '-prev', '-prev-prev', '-main'].map(
             (suffix) => `${params.bulletActiveClass}${suffix}`,
           ),
-        );
+        ]
+          .map((s) => (typeof s === 'string' && s.includes(' ') ? s.split(' ') : s))
+          .flat();
+        bulletEl.classList.remove(...classesToRemove);
       });
 
       if (el.length > 1) {
         bullets.forEach((bullet) => {
           const bulletIndex = elementIndex(bullet);
           if (bulletIndex === current) {
-            bullet.classList.add(params.bulletActiveClass);
+            bullet.classList.add(...params.bulletActiveClass.split(' '));
           }
           if (params.dynamicBullets) {
             if (bulletIndex >= firstIndex && bulletIndex <= lastIndex) {
-              bullet.classList.add(`${params.bulletActiveClass}-main`);
+              bullet.classList.add(...`${params.bulletActiveClass}-main`.split(' '));
             }
             if (bulletIndex === firstIndex) {
               setSideBullets(bullet, 'prev');
@@ -179,15 +182,15 @@ export default function Pagination({ swiper, extendParams, on, emit }) {
       } else {
         const bullet = bullets[current];
         if (bullet) {
-          bullet.classList.add(params.bulletActiveClass);
+          bullet.classList.add(...params.bulletActiveClass.split(' '));
         }
 
         if (params.dynamicBullets) {
           const firstDisplayedBullet = bullets[firstIndex];
           const lastDisplayedBullet = bullets[lastIndex];
           for (let i = firstIndex; i <= lastIndex; i += 1) {
             if (bullets[i]) {
-              bullets[i].classList.add(`${params.bulletActiveClass}-main`);
+              bullets[i].classList.add(...`${params.bulletActiveClass}-main`.split(' '));
             }
           }
 
@@ -403,7 +406,7 @@ export default function Pagination({ swiper, extendParams, on, emit }) {
 
     if (swiper.pagination.bullets)
       swiper.pagination.bullets.forEach((subEl) =>
-        subEl.classList.remove(params.bulletActiveClass),
+        subEl.classList.remove(...params.bulletActiveClass.split(' ')),
       );
   }