Skip to content

Commit 20b05fa

Browse files
committed
fix(pagination): support bulle multiple classes
fixes #6447
1 parent bcb275f commit 20b05fa

File tree

2 files changed

+11
-8
lines changed

2 files changed

+11
-8
lines changed

src/modules/a11y/a11y.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -189,7 +189,7 @@ export default function A11y({ swiper, extendParams, on }) {
189189
);
190190
}
191191
}
192-
if (bulletEl.matches(`.${swiper.params.pagination.bulletActiveClass}`)) {
192+
if (bulletEl.matches(classesToSelector(swiper.params.pagination.bulletActiveClass))) {
193193
bulletEl.setAttribute('aria-current', 'true');
194194
} else {
195195
bulletEl.removeAttribute('aria-current');

src/modules/pagination/pagination.js

Lines changed: 10 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -151,22 +151,25 @@ export default function Pagination({ swiper, extendParams, on, emit }) {
151151
midIndex = (lastIndex + firstIndex) / 2;
152152
}
153153
bullets.forEach((bulletEl) => {
154-
bulletEl.classList.remove(
154+
const classesToRemove = [
155155
...['', '-next', '-next-next', '-prev', '-prev-prev', '-main'].map(
156156
(suffix) => `${params.bulletActiveClass}${suffix}`,
157157
),
158-
);
158+
]
159+
.map((s) => (typeof s === 'string' && s.includes(' ') ? s.split(' ') : s))
160+
.flat();
161+
bulletEl.classList.remove(...classesToRemove);
159162
});
160163

161164
if (el.length > 1) {
162165
bullets.forEach((bullet) => {
163166
const bulletIndex = elementIndex(bullet);
164167
if (bulletIndex === current) {
165-
bullet.classList.add(params.bulletActiveClass);
168+
bullet.classList.add(...params.bulletActiveClass.split(' '));
166169
}
167170
if (params.dynamicBullets) {
168171
if (bulletIndex >= firstIndex && bulletIndex <= lastIndex) {
169-
bullet.classList.add(`${params.bulletActiveClass}-main`);
172+
bullet.classList.add(...`${params.bulletActiveClass}-main`.split(' '));
170173
}
171174
if (bulletIndex === firstIndex) {
172175
setSideBullets(bullet, 'prev');
@@ -179,15 +182,15 @@ export default function Pagination({ swiper, extendParams, on, emit }) {
179182
} else {
180183
const bullet = bullets[current];
181184
if (bullet) {
182-
bullet.classList.add(params.bulletActiveClass);
185+
bullet.classList.add(...params.bulletActiveClass.split(' '));
183186
}
184187

185188
if (params.dynamicBullets) {
186189
const firstDisplayedBullet = bullets[firstIndex];
187190
const lastDisplayedBullet = bullets[lastIndex];
188191
for (let i = firstIndex; i <= lastIndex; i += 1) {
189192
if (bullets[i]) {
190-
bullets[i].classList.add(`${params.bulletActiveClass}-main`);
193+
bullets[i].classList.add(...`${params.bulletActiveClass}-main`.split(' '));
191194
}
192195
}
193196

@@ -403,7 +406,7 @@ export default function Pagination({ swiper, extendParams, on, emit }) {
403406

404407
if (swiper.pagination.bullets)
405408
swiper.pagination.bullets.forEach((subEl) =>
406-
subEl.classList.remove(params.bulletActiveClass),
409+
subEl.classList.remove(...params.bulletActiveClass.split(' ')),
407410
);
408411
}
409412

0 commit comments

Comments
 (0)