#31 : Add progress indicator prop

src/components/Carousel/Carousel.svelte

@@ -86,6 +86,11 @@
    */
   export let pauseOnFocus = true
 
+  /**
+   * Show autoplay duration progress indicator
+   */
+  export let autoplayProgressVisible = false
+
   /**
    * Current page indicator dots
    */

src/components/Carousel/stories/CarouselView.svelte

@@ -47,6 +47,11 @@
    */
   export let pauseOnFocus = false
 
+  /**
+   * Show autoplay duration progress indicator
+   */
+  export let autoplayProgressVisible = false
+
   /**
    * Current page indicator dots
    */
@@ -83,6 +88,7 @@
     {autoplayDuration}
     {autoplayDirection}
     {pauseOnFocus}
+    {autoplayProgressVisible}
     {dots}
     on:pageChange={
       event => console.log(`Current page index: ${event.detail}`)
@@ -108,6 +114,7 @@
     {autoplayDuration}
     {autoplayDirection}
     {pauseOnFocus}
+    {autoplayProgressVisible}
     {dots}
   >
     {#each colors2 as { color, text } (color)}

src/components/Carousel/stories/CarouselViewCustomArrows.svelte

@@ -47,6 +47,11 @@
    */
   export let pauseOnFocus = false
 
+  /**
+   * Show autoplay duration progress indicator
+   */
+  export let autoplayProgressVisible = false
+
   /**
    * Current page indicator dots
    */
@@ -77,6 +82,7 @@
     {autoplayDuration}
     {autoplayDirection}
     {pauseOnFocus}
+    {autoplayProgressVisible}
     {dots}
     let:showPrevPage
     let:showNextPage

src/components/Carousel/stories/CarouselViewCustomDots.svelte

@@ -47,6 +47,11 @@
    */
   export let pauseOnFocus = false
 
+  /**
+   * Show autoplay duration progress indicator
+   */
+  export let autoplayProgressVisible = false
+
   /**
    * Current page indicator dots
    */
@@ -81,6 +86,7 @@
     {autoplayDuration}
     {autoplayDirection}
     {pauseOnFocus}
+    {autoplayProgressVisible}
     {dots}
     let:currentPageIndex
     let:pagesCount