From c9e73365326b7ba778558e93308a54feb903b4f9 Mon Sep 17 00:00:00 2001
From: ZIA-Hans <1025013204@qq.com>
Date: Tue, 28 May 2024 09:12:02 +0800
Subject: [PATCH 1/2] feat(carousel): slide item's gap use margin to complete

---
 packages/banana/src/carousel/index.styles.ts |  3 ++-
 packages/banana/src/carousel/index.ts        | 13 +++++++++++++
 2 files changed, 15 insertions(+), 1 deletion(-)

diff --git a/packages/banana/src/carousel/index.styles.ts b/packages/banana/src/carousel/index.styles.ts
index b21d03b0..7de34c7c 100644
--- a/packages/banana/src/carousel/index.styles.ts
+++ b/packages/banana/src/carousel/index.styles.ts
@@ -34,7 +34,6 @@ export default [
       transition: transform var(--banana-carousel-transition-duration, ${unsafeCSS(Var.TransitionNormal)});
       /* This variable should not be used directly, use the gap property instead */
       /* DO NOT PUT IT IN THE DOCUMENTATION */
-      gap: calc(var(--banana-carousel-gap, 0) * 1px);
     }
     .slides-wrapper--vertical {
       flex-direction: column;
@@ -55,6 +54,7 @@ export default [
       height: 100%;
       flex-grow: 0;
       flex-shrink: 0;
+      margin-right: calc(var(--banana-carousel-gap, 0) * 1px);
     }
 
     .slides-wrapper--vertical ::slotted(*) {
@@ -67,6 +67,7 @@ export default [
       width: 100%;
       flex-grow: 0;
       flex-shrink: 0;
+      margin-bottom: calc(var(--banana-carousel-gap, 0) * 1px);
     }
 
     .navigation-buttons {
diff --git a/packages/banana/src/carousel/index.ts b/packages/banana/src/carousel/index.ts
index 81bbcd82..ccee50b8 100644
--- a/packages/banana/src/carousel/index.ts
+++ b/packages/banana/src/carousel/index.ts
@@ -492,6 +492,19 @@ export default class BCarousel extends LitElement {
     this.requestUpdate();
     await this.updateComplete;
     this.calcHeight();
+    this._calcLastSlideGap();
+  }
+
+  private _calcLastSlideGap() {
+    if (this._loop) {
+      this.vertical
+        ? (this._slidesWithCopys[this._slidesWithCopys.length - 1].style.marginBottom = '0px')
+        : (this._slidesWithCopys[this._slidesWithCopys.length - 1].style.marginRight = '0px');
+    } else {
+      this.vertical
+        ? (this._slides[this._slides.length - 1].style.marginBottom = '0px')
+        : (this._slides[this._slides.length - 1].style.marginRight = '0px');
+    }
   }
 
   render() {

From 6800fbfc4d5dc280d8f4864bb003efeec5d6fdd2 Mon Sep 17 00:00:00 2001
From: ZIA-Hans <1025013204@qq.com>
Date: Tue, 28 May 2024 09:18:22 +0800
Subject: [PATCH 2/2] chore: new version

---
 .changeset/fifty-paws-play.md | 6 ++++++
 1 file changed, 6 insertions(+)
 create mode 100644 .changeset/fifty-paws-play.md

diff --git a/.changeset/fifty-paws-play.md b/.changeset/fifty-paws-play.md
new file mode 100644
index 00000000..985fa73a
--- /dev/null
+++ b/.changeset/fifty-paws-play.md
@@ -0,0 +1,6 @@
+---
+'@banana-ui/banana': patch
+'@banana-ui/react': patch
+---
+
+slide item's gap use margin to complete