quirk-ui 0.0.177 → 0.0.179

package/dist/components/Carousel/index.js

@@ -1,4 +1,4 @@
-import { jsxs as A, jsx as a } from "react/jsx-runtime";
+import { jsxs as A, jsx as r } from "react/jsx-runtime";
 import { useState as c, useRef as C, useEffect as E } from "react";
 import { A as Mt } from "../../arrow-left-BIJvHwNQ.js";
 import { A as bt } from "../../arrow-right-QEwnX3Sk.js";
@@ -18,51 +18,51 @@ import '../../assets/index31.css';const gt = "_carousel_wqwci_1", xt = "_noPoint
   next: At
 };
 function Pt({
-  items: m,
-  itemsPerPage: l = 9,
-  itemsPerRow: W = 3,
+  items: M,
+  itemsPerPage: i = 9,
+  itemsPerRow: J = 3,
   autoplay: K = !1,
-  autoplayInterval: D = 3,
+  autoplayInterval: W = 3,
   className: Q,
   externalRef: V,
-  siblingRef: i,
-  isSplit: S = !1
+  siblingRef: l,
+  isSplit: D = !1
 }) {
-  const [d, u] = c(0), [w, M] = c(0), [L, Z] = c(0), [b, tt] = c(l), [f, et] = c(!1), [P, nt] = c(K), ot = C(null), g = C(null), p = C(null), x = V, [v, X] = c(!1), [z, Y] = c(null), [$, j] = c(null), [R, U] = c(null), [st, B] = c(!1), [_, G] = c(null), [y, O] = c(null), ct = (t) => {
-    Math.abs((y ?? 0) - (_ ?? 0)) > 25 && (t.stopPropagation(), t.preventDefault());
-  }, at = (t) => {
-    G(t.clientX);
+  const [d, u] = c(0), [w, b] = c(0), [S, Z] = c(0), [f, tt] = c(i), [p, et] = c(!1), [L, nt] = c(K), ot = C(null), g = C(null), v = C(null), x = V, [_, X] = c(!1), [P, z] = c(null), [$, Y] = c(null), [R, j] = c(null), [st, U] = c(!1), [m, B] = c(null), [y, G] = c(null), ct = (t) => {
+    Math.abs((y ?? 0) - (m ?? 0)) > 25 && (t.stopPropagation(), t.preventDefault());
   }, rt = (t) => {
-    _ !== null && Math.abs(t.clientX - _) > 5 && (B(!0), O(t.clientX));
-  }, lt = () => {
-    if (!_ || !y) {
+    B(t.clientX);
+  }, at = (t) => {
+    m !== null && Math.abs(t.clientX - m) > 5 && (U(!0), G(t.clientX));
+  }, it = () => {
+    if (!m || !y) {
       I();
       return;
     }
-    const t = _ - y;
+    const t = m - y;
     Math.abs(t) > 50 && (t > 0 ? q() : T()), I();
-  }, it = () => {
+  }, lt = () => {
     I();
   }, I = () => {
-    B(!1), G(null), O(null);
+    U(!1), B(null), G(null);
   }, dt = (t) => {
-    j(t.touches[0].clientX), Y(t.touches[0].clientY), X(!1);
-  }, F = C(null);
+    Y(t.touches[0].clientX), z(t.touches[0].clientY), X(!1);
+  }, O = C(null);
   E(() => {
-    const t = F.current;
+    const t = O.current;
     if (!t) return;
     const e = (n) => {
-      const s = n.touches[0].clientX - ($ ?? 0), r = n.touches[0].clientY - (z ?? 0);
-      !v && Math.abs(s) > Math.abs(r) && X(!0), v && (n.preventDefault(), U(n.touches[0].clientX));
+      const s = n.touches[0].clientX - ($ ?? 0), a = n.touches[0].clientY - (P ?? 0);
+      !_ && Math.abs(s) > Math.abs(a) && X(!0), _ && (n.preventDefault(), j(n.touches[0].clientX));
     };
     return t.addEventListener("touchmove", e), () => {
       t.removeEventListener("touchmove", e);
     };
-  }, [v, $, z]);
+  }, [_, $, P]);
   const ut = () => {
     if ($ === null || R === null) return;
     const t = $ - R;
-    Math.abs(t) > 50 && (t > 0 ? q() : T()), j(null), U(null), Y(null), X(!1);
+    Math.abs(t) > 50 && (t > 0 ? q() : T()), Y(null), j(null), z(null), X(!1);
   }, ht = (t, e) => {
     const n = [];
     for (let s = 0; s < t.length; s += e)
@@ -72,90 +72,90 @@ function Pt({
   E(() => {
     if (typeof window < "u") {
       const t = () => {
-        const e = window.innerWidth < 768, n = e ? 1 : l;
-        et(e), tt(e ? 1 : l), u(
-          (s) => Math.min(s, Math.ceil(m.length / n) - 1)
+        const e = window.innerWidth < 768, n = e ? 1 : i;
+        et(e), tt(e ? 1 : i), u(
+          (s) => Math.min(s, Math.ceil(M.length / n) - 1)
         );
       };
       return t(), window.addEventListener("resize", t), () => window.removeEventListener("resize", t);
     }
-  }, [l]);
-  const N = Math.ceil(b / W), H = ht(m, b), h = H.length, wt = 3 * 16, ft = 3 * 16;
+  }, [i]);
+  const N = Math.ceil(f / J), F = ht(M, f), h = F.length, wt = 3 * 16, ft = 3 * 16;
   E(() => {
     const t = new ResizeObserver((e) => {
       var n, s;
-      for (let r of e)
-        if (r.contentRect) {
-          f ? M(r.contentRect.width - ft) : S ? i != null && i.current ? M(
-            r.contentRect.width - ((n = i == null ? void 0 : i.current) == null ? void 0 : n.offsetWidth) - wt
-          ) : M(r.contentRect.width) : (M(r.contentRect.width), Z(
+      for (let a of e)
+        if (a.contentRect) {
+          p ? b(a.contentRect.width - ft) : D ? l != null && l.current ? b(
+            a.contentRect.width - ((n = l == null ? void 0 : l.current) == null ? void 0 : n.offsetWidth) - wt
+          ) : b(a.contentRect.width) : (b(a.contentRect.width), Z(
             ((s = g == null ? void 0 : g.current) == null ? void 0 : s.children[0].children[0].children[0].getBoundingClientRect().width) ?? 0
           ));
-          const _t = f ? 1 : l;
+          const _t = p ? 1 : i;
           u(
-            (mt) => Math.min(mt, Math.ceil(m.length / _t) - 1)
+            (mt) => Math.min(mt, Math.ceil(M.length / _t) - 1)
           );
         }
     });
     return x != null && x.current && t.observe(x.current), () => t.disconnect();
-  }, [f, S]);
+  }, [p, D]);
   const k = () => {
-    p.current && clearInterval(p.current), nt(!1);
+    v.current && clearInterval(v.current), nt(!1);
   }, q = () => {
     k(), u((t) => Math.min(t + 1, h - 1));
   }, T = () => {
     k(), u((t) => Math.max(t - 1, 0));
   }, pt = (t) => {
     k(), u(t);
-  }, vt = () => w ? `translateX(-${d * w}px)` : "translateX(0px)", J = () => {
+  }, vt = () => w ? `translateX(-${d * w}px)` : "translateX(0px)", H = () => {
     u((t) => t >= h - 1 ? 0 : t + 1);
   };
-  return E(() => (P && (p.current = setInterval(
-    J,
-    D * 1e3
+  return E(() => (L && (v.current = setInterval(
+    H,
+    W * 1e3
   )), () => {
-    p.current && clearInterval(p.current);
-  }), [P, D, J]), /* @__PURE__ */ A("div", { className: `${Q ?? ""} ${o.carousel}`, ref: ot, children: [
-    /* @__PURE__ */ a(
+    v.current && clearInterval(v.current);
+  }), [L, W, H]), /* @__PURE__ */ A("div", { className: `${Q ?? ""} ${o.carousel}`, ref: ot, children: [
+    /* @__PURE__ */ r(
       "div",
       {
-        ref: F,
-        className: `${o.trackContainer} ${st || v ? o.noPointerEvents : ""}
+        ref: O,
+        className: `${o.trackContainer} ${st || _ ? o.noPointerEvents : ""}
           `,
         style: {
           maxWidth: `${w}px`,
-          touchAction: v ? "none" : "pan-y"
+          touchAction: _ ? "none" : "pan-y"
         },
         onTouchStart: dt,
         onTouchEnd: ut,
-        onMouseDown: at,
-        onMouseMove: rt,
-        onMouseUp: lt,
-        onMouseLeave: it,
-        children: /* @__PURE__ */ a(
+        onMouseDown: rt,
+        onMouseMove: at,
+        onMouseUp: it,
+        onMouseLeave: lt,
+        children: /* @__PURE__ */ r(
           "div",
           {
             ref: g,
             className: o.track,
             style: { width: `${h * 100}%`, transform: vt() },
-            children: H.map((t, e) => /* @__PURE__ */ a(
+            children: F.map((t, e) => /* @__PURE__ */ r(
               "div",
               {
                 className: o.page,
                 style: {
                   display: N > 1 ? "grid" : "flex",
                   gridTemplateColumns: `repeat(${Math.ceil(
-                    b / N
+                    f / N
                   )}, 1fr)`,
                   gridTemplateRows: `repeat(${N}, auto)`,
                   width: `${w}px`
                 },
-                children: t.map((n, s) => /* @__PURE__ */ a(
+                children: t.map((n, s) => /* @__PURE__ */ r(
                   "div",
                   {
                     onClickCapture: ct,
                     style: {
-                      width: f ? `${w / W - 16}px` : "unset"
+                      width: p ? `${w / f - 16}px` : "unset"
                     },
                     children: n
                   },
@@ -173,10 +173,10 @@ function Pt({
       {
         className: o.controls,
         style: {
-          maxWidth: L > 0 && l === 1 && !f ? `${L}px` : "unset"
+          maxWidth: S > 0 && i === 1 && !p ? `${S}px` : "unset"
         },
         children: [
-          /* @__PURE__ */ a("div", { className: o.indicators, children: Array.from({ length: h }).map((t, e) => /* @__PURE__ */ a(
+          /* @__PURE__ */ r("div", { className: o.indicators, children: Array.from({ length: h }).map((t, e) => /* @__PURE__ */ r(
             "button",
             {
               className: `${o.indicator} ${e === d ? o.active : ""}`,
@@ -186,24 +186,24 @@ function Pt({
             e
           )) }),
           /* @__PURE__ */ A("div", { className: o.buttons, children: [
-            /* @__PURE__ */ a(
+            /* @__PURE__ */ r(
               "button",
               {
                 "aria-label": "Previous slide",
                 className: `${o.prev} ${d === 0 ? o.disabled : ""}`,
                 onClick: T,
                 disabled: d === 0,
-                children: /* @__PURE__ */ a(Mt, { size: 36 })
+                children: /* @__PURE__ */ r(Mt, { size: 36 })
               }
             ),
-            /* @__PURE__ */ a(
+            /* @__PURE__ */ r(
               "button",
               {
                 "aria-label": "Next slide",
                 className: `${o.next} ${d >= h - 1 ? o.disabled : ""}`,
                 onClick: q,
-                disabled: d >= m.length - b,
-                children: /* @__PURE__ */ a(bt, { size: 36 })
+                disabled: d >= M.length - f,
+                children: /* @__PURE__ */ r(bt, { size: 36 })
               }
             )
           ] })

package/package.json

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