fix(esl-carousel): fix carousel empty state

Co-authored-by: ala'n (Alexey Stsefanovich) <astsefanovich@exadel.com>
exadel-inc · Jul 31, 2024 · 8f88589 · 8f88589
1 parent 420056d
commit 8f88589
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 0 deletions.
diff --git a/src/modules/esl-carousel/core/esl-carousel.less b/src/modules/esl-carousel/core/esl-carousel.less
@@ -44,6 +44,14 @@ esl-carousel {
     user-select: none;
     pointer-events: none;
   }
+
+  &[empty] {
+    --esl-carousel-side-space: 0;
+
+    [esl-carousel-slides] {
+      display: none;
+    }
+  }
 }
 
 /* Default carousel area styles */

diff --git a/src/modules/esl-carousel/renderers/esl-carousel.grid.renderer.ts b/src/modules/esl-carousel/renderers/esl-carousel.grid.renderer.ts
@@ -29,6 +29,7 @@ export class ESLGridCarouselRenderer extends ESLDefaultCarouselRenderer {
 
   /** Count of fake slides to fill the last "row" or incomplete carousel state */
   public get fakeSlidesCount(): number {
+    if (this.$carousel.$slides.length === 0) return 0;
     if (this.$carousel.$slides.length < this.count) {
       return this.count - this.$carousel.$slides.length;
     }