quirk-ui 0.0.61 → 0.0.62

package/dist/components/Carousel/index.js

@@ -1,33 +1,33 @@
 import { jsxs as w, jsx as r } from "react/jsx-runtime";
-import { useState as v, useRef as M, useEffect as x } from "react";
-import { A as q } from "../../arrow-left-BIJvHwNQ.js";
-import { A as B } from "../../arrow-right-QEwnX3Sk.js";
-import '../../assets/index31.css';const F = "_carousel_u7gup_1", H = "_trackContainer_u7gup_9", J = "_track_u7gup_9", K = "_page_u7gup_24", Q = "_controls_u7gup_30", S = "_indicators_u7gup_47", U = "_indicator_u7gup_47", V = "_active_u7gup_64", Y = "_buttons_u7gup_68", Z = "_prev_u7gup_73", P = "_disabled_u7gup_73", tt = "_next_u7gup_74", n = {
-  carousel: F,
-  trackContainer: H,
-  track: J,
-  page: K,
-  controls: Q,
-  indicators: S,
-  indicator: U,
-  active: V,
-  buttons: Y,
+import { useState as v, useRef as A, useEffect as x } from "react";
+import { A as S } from "../../arrow-left-BIJvHwNQ.js";
+import { A as U } from "../../arrow-right-QEwnX3Sk.js";
+import '../../assets/index31.css';const Y = "_carousel_u7gup_1", q = "_trackContainer_u7gup_9", B = "_track_u7gup_9", F = "_page_u7gup_24", H = "_controls_u7gup_30", J = "_indicators_u7gup_47", K = "_indicator_u7gup_47", Q = "_active_u7gup_64", V = "_buttons_u7gup_68", Z = "_prev_u7gup_73", P = "_disabled_u7gup_73", tt = "_next_u7gup_74", n = {
+  carousel: Y,
+  trackContainer: q,
+  track: B,
+  page: F,
+  controls: H,
+  indicators: J,
+  indicator: K,
+  active: Q,
+  buttons: V,
   prev: Z,
   disabled: P,
   next: tt
 };
 function ct({
-  items: $,
+  items: N,
   itemsPerPage: f = 9,
-  itemsPerRow: W = 3,
+  itemsPerRow: M = 3,
   autoPlay: o = !1,
-  autoPlayInterval: N = 3,
-  className: A,
+  autoPlayInterval: $ = 3,
+  className: W,
   externalRef: z,
   siblingRef: a,
   isSplit: b = !1
 }) {
-  const [i, l] = v(0), [u, h] = v(0), [p, y] = v(f), [k, T] = v(!1), E = M(null), g = M(null), _ = z, L = (t, e) => {
+  const [i, l] = v(0), [u, h] = v(0), [p, T] = v(f), [k, y] = v(!1), L = A(null), g = A(null), _ = z, E = (t, e) => {
     const c = [];
     for (let s = 0; s < t.length; s += e)
       c.push(t.slice(s, s + e));
@@ -36,36 +36,36 @@ function ct({
   x(() => {
     const t = () => {
       const e = window.innerWidth < 768;
-      T(e), y(e ? 1 : f), l(0);
+      y(e), T(e ? 1 : f), l(0);
     };
     return t(), window.addEventListener("resize", t), () => window.removeEventListener("resize", t);
   }, [f]);
-  const m = Math.ceil(p / W), C = L($, p), d = C.length, j = 3 * 16, R = 6 * 16;
+  const m = Math.ceil(p / M), C = E(N, p), d = C.length, O = 3 * 16, j = 6 * 16;
   x(() => {
     const t = new ResizeObserver((e) => {
       var c;
       for (let s of e)
-        s.contentRect && (k ? h(s.contentRect.width - R) : b && a != null && a.current ? h(
-          s.contentRect.width - ((c = a == null ? void 0 : a.current) == null ? void 0 : c.offsetWidth) - j
+        s.contentRect && (k ? h(s.contentRect.width - j) : b && a != null && a.current ? h(
+          s.contentRect.width - ((c = a == null ? void 0 : a.current) == null ? void 0 : c.offsetWidth) - O
         ) : h(s.contentRect.width), l(0));
     });
     return _ != null && _.current && t.observe(_.current), () => t.disconnect();
   }, [k, b]);
-  const X = () => {
+  const R = () => {
     l((t) => Math.min(t + 1, d - 1));
-  }, D = () => {
+  }, X = () => {
     l((t) => Math.max(t - 1, 0));
-  }, G = (t) => {
+  }, D = (t) => {
     l(t);
-  }, O = () => u ? `translateX(-${i * u}px)` : "translateX(0px)", I = () => {
+  }, G = () => u ? `translateX(-${i * u}px)` : "translateX(0px)", I = () => {
     l((t) => t >= d - 1 ? 0 : t + 1);
   };
-  return x(() => (o && (g.current = setInterval(
+  return x(() => (o && (console.log("AUTOPLAY IS ON"), g.current = setInterval(
     I,
-    N * 1e3
+    $ * 1e3
   )), () => {
     g.current && clearInterval(g.current);
-  }), [o, N, I]), /* @__PURE__ */ w("div", { className: `${A ?? ""} ${n.carousel}`, ref: E, children: [
+  }), [o, $, I]), /* @__PURE__ */ w("div", { className: `${W ?? ""} ${n.carousel}`, ref: L, children: [
     /* @__PURE__ */ r(
       "div",
       {
@@ -75,7 +75,7 @@ function ct({
           "div",
           {
             className: n.track,
-            style: { width: `${d * 100}%`, transform: O() },
+            style: { width: `${d * 100}%`, transform: G() },
             children: C.map((t, e) => /* @__PURE__ */ r(
               "div",
               {
@@ -111,7 +111,7 @@ function ct({
         "button",
         {
           className: `${n.indicator} ${e === i ? n.active : ""}`,
-          onClick: () => G(e),
+          onClick: () => D(e),
           "aria-label": `Go to group ${e + 1}`
         },
         e
@@ -122,9 +122,9 @@ function ct({
           {
             "aria-label": "Previous slide",
             className: `${n.prev} ${!o && i === 0 ? n.disabled : ""}`,
-            onClick: D,
+            onClick: X,
             disabled: !o && i === 0,
-            children: /* @__PURE__ */ r(q, { size: 36 })
+            children: /* @__PURE__ */ r(S, { size: 36 })
           }
         ),
         /* @__PURE__ */ r(
@@ -132,9 +132,9 @@ function ct({
           {
             "aria-label": "Next slide",
             className: `${n.next} ${!o && i >= d - 1 ? n.disabled : ""}`,
-            onClick: X,
-            disabled: !o && i >= $.length - p,
-            children: /* @__PURE__ */ r(B, { size: 36 })
+            onClick: R,
+            disabled: !o && i >= N.length - p,
+            children: /* @__PURE__ */ r(U, { size: 36 })
           }
         )
       ] })

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "quirk-ui",
   "private": false,
-  "version": "0.0.61",
+  "version": "0.0.62",
   "type": "module",
   "exports": {
     ".": {