fix: sync slides after complete initialization

shoelace-style · Nov 5, 2024 · 25c8169 · 25c8169
1 parent 8db6580
commit 25c8169
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 2 deletions.
diff --git a/docs/pages/components/carousel.md b/docs/pages/components/carousel.md
@@ -6,6 +6,7 @@ layout: component
 ---
 
 ```html:preview
+<sl-resize-observer>
 <sl-carousel pagination navigation mouse-dragging loop>
   <sl-carousel-item>
     <img
@@ -38,6 +39,7 @@ layout: component
     />
   </sl-carousel-item>
 </sl-carousel>
+</sl-resize-observer>
 ```
 
 ```jsx:react

diff --git a/src/components/carousel/carousel.component.ts b/src/components/carousel/carousel.component.ts
@@ -381,10 +381,10 @@ export default class SlCarousel extends ShoelaceElement {
       this.createClones();
     }
 
-    this.synchronizeSlides();
-
     // Because the DOM may be changed, restore the scroll position to the active slide
     this.goToSlide(this.activeSlide, 'auto');
+
+    this.synchronizeSlides();
   }
 
   private createClones() {