backport SL2155

This commit is contained in:
Cory LaViska
2024-09-23 12:12:35 -04:00
parent ff11d86a9d
commit 6e1520c868
2 changed files with 17 additions and 5 deletions

View File

@@ -14,15 +14,17 @@ During the alpha period, things might break! We take breaking changes very serio
## Next
- Fixed form controls to behave like their native counterparts for value and defaultValue properties / attributes respectively. [#157]
- Fixed a bug in `<wa-input>` around value attributes and properties to behave like native `<input>`. [#157]
- Added SSR support to all components [#157]
- Added `scroll-margin-top` to children of `wa-page` [#157]
- Added `--scroll-margin-top` css variable `wa-page` [#157]
- Added SSR support to all components [#157]
- Fixed form controls to behave like their native counterparts for value and defaultValue properties / attributes respectively. [#157]
- Fixed a bug in `<wa-input>` around value attributes and properties to behave like native `<input>`. [#157]
- Fixed a bug in `<wa-select>` that made the suffix slot collide with the clear button [#2145]
- Fixed a bug in `<wa-checkbox>` where unchecking and then checking would "clear" its value. [#157]
- Fixed a bug where `<wa-relative-time>` would announce the full time instead of the relative time in screen readers [#22](https://github.com/shoelace-style/webawesome-alpha/issues/22)
- Fixed a bug in `<wa-tab-group>` in Firefox where the overflow container would keep focus. [#14](https://github.com/shoelace-style/webawesome-alpha/issues/14)
- Fixed a bug in `<wa-input>` where `minlength` and `maxlength` were not being properly validated. [#35](https://github.com/shoelace-style/webawesome-alpha/issues/35)
0 Fixed a bug in `<sl-carousel>` that made pagination work incorrectly [#2155]
## 1.0.0-alpha.1

View File

@@ -462,12 +462,22 @@ export default class WaCarousel extends WebAwesomeElement {
}
// Sets the next index without taking into account clones, if any.
const newActiveSlide = loop ? (index + slides.length) % slides.length : clamp(index, 0, slides.length - 1);
const newActiveSlide = loop
? (index + slides.length) % slides.length
: clamp(index, 0, slides.length - slidesPerPage);
this.activeSlide = newActiveSlide;
const isRtl = this.matches(':dir(rtl)');
// Get the index of the next slide. For looping carousel it adds `slidesPerPage`
// to normalize the starting index in order to ignore the first nth clones.
const nextSlideIndex = clamp(index + (loop ? slidesPerPage : 0), 0, slidesWithClones.length - 1);
// For RTL it needs to scroll to the last slide of the page.
const nextSlideIndex = clamp(
index + (loop ? slidesPerPage : 0) + (isRtl ? slidesPerPage - 1 : 0),
0,
slidesWithClones.length - 1
);
const nextSlide = slidesWithClones[nextSlideIndex];
this.scrollToSlide(nextSlide, prefersReducedMotion() ? 'auto' : behavior);