@geomak/ui 6.19.0 → 6.20.0

package/dist/index.js

@@ -1826,10 +1826,9 @@ function RotatingCarousel({
   const count = slides.length;
   const [active, setActive] = useState(0);
   const reduced = useReducedMotion();
-  const idx = Math.min(Math.max(active, 0), Math.max(0, count - 1));
-  const atStart = idx <= 0;
-  const atEnd = idx >= count - 1;
-  const step = (dir) => setActive((a) => Math.min(Math.max(a + dir, 0), count - 1));
+  const wrap = (n) => count > 0 ? (n % count + count) % count : 0;
+  const idx = wrap(active);
+  const step = (dir) => setActive((a) => wrap(a + dir));
   const w = typeof itemWidth === "number" ? itemWidth : parseInt(String(itemWidth), 10) || 320;
   const widthCss = typeof itemWidth === "number" ? `${itemWidth}px` : itemWidth;
   const SPACING = w * 0.6;
@@ -1854,11 +1853,12 @@ function RotatingCarousel({
       style,
       onKeyDown,
       children: [
-        showArrows && /* @__PURE__ */ jsx("button", { type: "button", "aria-label": "Previous", onClick: () => step(-1), disabled: atStart, className: `${arrowBtn} left-1`, children: /* @__PURE__ */ jsx(Arrow2, { dir: "left" }) }),
+        showArrows && /* @__PURE__ */ jsx("button", { type: "button", "aria-label": "Previous", onClick: () => step(-1), className: `${arrowBtn} left-1`, children: /* @__PURE__ */ jsx(Arrow2, { dir: "left" }) }),
         /* @__PURE__ */ jsxs("div", { className: "relative mx-auto overflow-hidden py-6", children: [
           count > 0 && /* @__PURE__ */ jsx("div", { className: "invisible mx-auto", style: { width: widthCss }, "aria-hidden": "true", children: slides[idx] }),
           slides.map((slide, i) => {
-            const offset = i - idx;
+            let offset = wrap(i - idx);
+            if (offset > count / 2) offset -= count;
             const abs = Math.abs(offset);
             if (abs > 2) return null;
             const isCenter = offset === 0;
@@ -1889,7 +1889,7 @@ function RotatingCarousel({
             );
           })
         ] }),
-        showArrows && /* @__PURE__ */ jsx("button", { type: "button", "aria-label": "Next", onClick: () => step(1), disabled: atEnd, className: `${arrowBtn} right-1`, children: /* @__PURE__ */ jsx(Arrow2, { dir: "right" }) }),
+        showArrows && /* @__PURE__ */ jsx("button", { type: "button", "aria-label": "Next", onClick: () => step(1), className: `${arrowBtn} right-1`, children: /* @__PURE__ */ jsx(Arrow2, { dir: "right" }) }),
         showDots && count > 1 && /* @__PURE__ */ jsx(Dots, { count, active: idx, onSelect: setActive })
       ]
     }