From ed698731d5cfcfde0747a3094b60ce1a76af350e Mon Sep 17 00:00:00 2001 From: Marcelo JCS Date: Mon, 6 Jan 2025 17:51:29 -0300 Subject: [PATCH] fix(carousel): Fix gap calculation --- .../src/components/carousel/carousel.ts | 12 +++++------- 1 file changed, 5 insertions(+), 7 deletions(-) diff --git a/packages/web-components/src/components/carousel/carousel.ts b/packages/web-components/src/components/carousel/carousel.ts index 277aa6d3567..25f320e4817 100644 --- a/packages/web-components/src/components/carousel/carousel.ts +++ b/packages/web-components/src/components/carousel/carousel.ts @@ -564,19 +564,17 @@ class C4DCarousel extends HostListenerMixin(StableSelectorMixin(LitElement)) { * Calculates the width between cards. */ private _updateGap() { - const { _contentsNode: contentsNode, _slotNode: slotNode } = this; + const { _slotNode: slotNode } = this; const elems = slotNode! .assignedNodes() .filter((node) => node.nodeType === Node.ELEMENT_NODE); + const firstElementComputedStyle = getComputedStyle(elems[0] as HTMLElement); + this._gap = elems.length <= 1 ? 0 - : (contentsNode!.scrollWidth - - elems.reduce( - (acc, elem) => acc + ((elem as HTMLElement).offsetWidth ?? 0), - 0 - )) / - (elems.length - 1); + : parseFloat(firstElementComputedStyle.marginLeft) + + parseFloat(firstElementComputedStyle.marginRight) ?? 0; } private _updateContentsPosition(changedProperties) {