@alfadocs/ui-kit 0.16.0 → 0.17.0

package/dist/_chunks/{pagination-OQBlnb1H.js → pagination-F1ei4khE.js}

@@ -1,14 +1,32 @@
-import { jsxs as f, jsx as i } from "react/jsx-runtime";
-import { forwardRef as g, useState as D, useEffect as z, useCallback as A, useMemo as C, useRef as _, useId as ee } from "react";
+import { jsxs as h, jsx as t } from "react/jsx-runtime";
+import { useState as Z, useRef as z, useEffect as y, useCallback as k, forwardRef as u, useMemo as _, useId as D } from "react";
 import * as m from "@radix-ui/react-select";
-import { c as se } from "./index-D2ZczOXr.js";
+import { c as ee } from "./index-D2ZczOXr.js";
 import { useTranslation as x } from "react-i18next";
-import { u as ae } from "./registry-C9nwlNyL.js";
-import { E as ie } from "./ellipsis-rgGdiK_9.js";
+import { u as se } from "./registry-C9nwlNyL.js";
+import { E as ae } from "./ellipsis-rgGdiK_9.js";
 import { C as F } from "./chevron-right-BrpYejk0.js";
-import { C as te } from "./chevron-left-CX1jqD2M.js";
-import { C as ne, a as re } from "./chevrons-right-d9MwesPG.js";
-import { C as de } from "./check-DPdL_Sm7.js";
+import { C as ie } from "./chevron-left-CX1jqD2M.js";
+import { C as te, a as ne } from "./chevrons-right-d9MwesPG.js";
+import { C as re } from "./check-DPdL_Sm7.js";
+function de({
+  value: e,
+  defaultValue: a,
+  onChange: i
+}) {
+  const s = e !== void 0, [d, r] = Z(a), n = z(i);
+  y(() => {
+    n.current = i;
+  }, [i]);
+  const p = s ? e : d, v = k(
+    (o) => {
+      var b;
+      s || r(o), (b = n.current) == null || b.call(n, o);
+    },
+    [s]
+  );
+  return [p, v];
+}
 const oe = {
   id: "pagination",
   capabilities: ["paginate", "range_navigate"],
@@ -69,7 +87,7 @@ const oe = {
   "ds:focus-visible:outline-[var(--ring)] ds:focus-visible:outline-offset-[length:var(--focus-ring-offset)]",
   "ds:disabled:cursor-not-allowed ds:disabled:opacity-50",
   "ds:aria-disabled:cursor-not-allowed ds:aria-disabled:opacity-50"
-].join(" "), j = se(le, {
+].join(" "), P = ee(le, {
   variants: {
     size: {
       sm: "ds:min-w-[var(--min-target-size)] ds:min-h-[var(--min-target-size)] ds:text-[length:var(--font-size-sm)] ds:ps-[var(--spacing-xs)] ds:pe-[var(--spacing-xs)]",
@@ -83,160 +101,164 @@ const oe = {
   },
   defaultVariants: { size: "md", active: !1 }
 });
-function y(e, a) {
-  const t = [];
-  for (let s = e; s <= a; s++) t.push(s);
-  return t;
+function w(e, a) {
+  const i = [];
+  for (let s = e; s <= a; s++) i.push(s);
+  return i;
 }
-function ce(e, a, t = 1, s = 1) {
+function ce(e, a, i = 1, s = 1) {
   if (a <= 0) return [];
-  if (t = Math.max(0, t), s = Math.max(1, s), s * 2 + t * 2 + 3 >= a) return y(1, a);
-  const r = y(1, s), n = y(a - s + 1, a), u = Math.max(
+  if (i = Math.max(0, i), s = Math.max(1, s), s * 2 + i * 2 + 3 >= a) return w(1, a);
+  const r = w(1, s), n = w(a - s + 1, a), p = Math.max(
     Math.min(
-      e - t,
-      a - s - t * 2 - 1
+      e - i,
+      a - s - i * 2 - 1
     ),
     s + 2
-  ), h = Math.min(
-    Math.max(e + t, s + t * 2 + 2),
+  ), v = Math.min(
+    Math.max(e + i, s + i * 2 + 2),
     n[0] - 2
-  ), l = [...r];
-  return u > s + 2 ? l.push("ellipsis-start") : s + 1 < a - s && l.push(s + 1), l.push(...y(u, h)), h < a - s - 1 ? l.push("ellipsis-end") : a - s > s && l.push(a - s), l.push(...n), l;
+  ), o = [...r];
+  return p > s + 2 ? o.push("ellipsis-start") : s + 1 < a - s && o.push(s + 1), o.push(...w(p, v)), v < a - s - 1 ? o.push("ellipsis-end") : a - s > s && o.push(a - s), o.push(...n), o;
 }
-const me = g(
+const me = u(
   ({
     totalPages: e,
     page: a,
-    defaultPage: t = 1,
+    defaultPage: i = 1,
     onPageChange: s,
-    siblingCount: o = 1,
+    siblingCount: d = 1,
     boundaryCount: r = 1,
     size: n = "md",
-    showEndpoints: u = !1,
-    align: h = "center",
-    pageSize: l,
-    useLocaleDigits: T = !1,
-    locale: M,
-    className: J,
-    id: P,
-    ...K
-  }, O) => {
-    const { t: R, i18n: S } = x(), b = a !== void 0, [Q, W] = D(t), c = b ? a : Q;
-    z(() => {
-      b && t !== 1 && console.warn(
+    showEndpoints: p = !1,
+    align: v = "center",
+    pageSize: o,
+    useLocaleDigits: b = !1,
+    locale: R,
+    className: K,
+    id: j,
+    ...O
+  }, Q) => {
+    const { t: S, i18n: C } = x(), [U, E] = de({
+      value: a,
+      defaultValue: i,
+      onChange: s
+    }), c = U ?? i;
+    y(() => {
+      a !== void 0 && i !== 1 && console.warn(
         "[Pagination] Both `page` and `defaultPage` were supplied. The `page` prop wins; remove `defaultPage` for controlled usage."
       );
-    }, [b, t]);
-    const p = A(
-      (d) => {
-        const w = Math.min(Math.max(d, 1), Math.max(1, e));
-        b || W(w), s == null || s(w);
+    }, [a, i]);
+    const g = k(
+      (l) => {
+        const I = Math.min(Math.max(l, 1), Math.max(1, e));
+        E(I);
       },
-      [b, s, e]
-    ), E = A(
-      (d) => {
-        if (!T) return String(d);
+      [E, e]
+    ), V = k(
+      (l) => {
+        if (!b) return String(l);
         try {
-          return new Intl.NumberFormat(M ?? S.language).format(d);
+          return new Intl.NumberFormat(R ?? C.language).format(l);
         } catch {
-          return String(d);
+          return String(l);
         }
       },
-      [S.language, M, T]
-    ), X = C(
-      () => ce(c, e, o, r),
-      [c, e, o, r]
-    ), B = c <= 1, L = c >= e, N = _(c);
-    z(() => {
+      [C.language, R, b]
+    ), W = _(
+      () => ce(c, e, d, r),
+      [c, e, d, r]
+    ), B = c <= 1, L = c >= e, N = z(c);
+    y(() => {
       N.current = c;
     }, [c]);
-    const V = _(e);
-    z(() => {
-      V.current = e;
+    const A = z(e);
+    y(() => {
+      A.current = e;
     }, [e]);
-    const Y = C(
+    const X = _(
       () => ({
         getCurrentPage: () => N.current,
-        getTotalPages: () => V.current,
-        goToPage: (d) => p(d),
-        next: () => p(N.current + 1),
-        previous: () => p(N.current - 1)
+        getTotalPages: () => A.current,
+        goToPage: (l) => g(l),
+        next: () => g(N.current + 1),
+        previous: () => g(N.current - 1)
       }),
-      [p]
+      [g]
     );
-    ae(oe, Y, P);
-    const Z = h === "start" ? "ds:justify-start" : h === "end" ? "ds:justify-end" : "ds:justify-center";
-    return /* @__PURE__ */ f(
+    se(oe, X, j);
+    const Y = v === "start" ? "ds:justify-start" : v === "end" ? "ds:justify-end" : "ds:justify-center";
+    return /* @__PURE__ */ h(
       "nav",
       {
-        ref: O,
-        "aria-label": R("navigation.pagination.label"),
-        id: P,
+        ref: Q,
+        "aria-label": S("navigation.pagination.label"),
+        id: j,
         "data-component": "pagination",
-        "data-component-id": P,
+        "data-component-id": j,
         className: [
           "ds:flex ds:items-center",
-          Z,
+          Y,
           "ds:gap-[var(--spacing-sm)]",
           "ds:flex-wrap",
-          J ?? ""
+          K ?? ""
         ].filter(Boolean).join(" "),
-        ...K,
+        ...O,
         children: [
-          /* @__PURE__ */ f(H, { size: n, children: [
-            u ? /* @__PURE__ */ i(v, { children: /* @__PURE__ */ i(
-              I,
+          /* @__PURE__ */ h(H, { size: n, children: [
+            p ? /* @__PURE__ */ t(f, { children: /* @__PURE__ */ t(
+              T,
               {
                 type: "first",
                 size: n,
                 disabled: B,
-                onClick: () => p(1)
+                onClick: () => g(1)
               }
             ) }) : null,
-            /* @__PURE__ */ i(v, { children: /* @__PURE__ */ i(
-              U,
+            /* @__PURE__ */ t(f, { children: /* @__PURE__ */ t(
+              q,
               {
                 size: n,
                 disabled: B,
-                onClick: () => p(c - 1)
+                onClick: () => g(c - 1)
               }
             ) }),
-            X.map((d, w) => d === "ellipsis-start" || d === "ellipsis-end" ? /* @__PURE__ */ i(v, { children: /* @__PURE__ */ i(G, {}) }, `e-${w}`) : /* @__PURE__ */ i(v, { children: /* @__PURE__ */ i(
+            W.map((l, I) => l === "ellipsis-start" || l === "ellipsis-end" ? /* @__PURE__ */ t(f, { children: /* @__PURE__ */ t(J, {}) }, `e-${I}`) : /* @__PURE__ */ t(f, { children: /* @__PURE__ */ t(
               $,
               {
                 size: n,
-                isActive: d === c,
-                "aria-label": R("navigation.pagination.pageN", { n: d }),
-                onClick: () => p(d),
-                children: E(d)
+                isActive: l === c,
+                "aria-label": S("navigation.pagination.pageN", { n: l }),
+                onClick: () => g(l),
+                children: V(l)
               }
-            ) }, `p-${d}`)),
-            /* @__PURE__ */ i(v, { children: /* @__PURE__ */ i(
-              q,
+            ) }, `p-${l}`)),
+            /* @__PURE__ */ t(f, { children: /* @__PURE__ */ t(
+              G,
               {
                 size: n,
                 disabled: L,
-                onClick: () => p(c + 1)
+                onClick: () => g(c + 1)
               }
             ) }),
-            u ? /* @__PURE__ */ i(v, { children: /* @__PURE__ */ i(
-              I,
+            p ? /* @__PURE__ */ t(f, { children: /* @__PURE__ */ t(
+              T,
               {
                 type: "last",
                 size: n,
                 disabled: L,
-                onClick: () => p(e)
+                onClick: () => g(e)
               }
             ) }) : null
           ] }),
-          l ? /* @__PURE__ */ i(
+          o ? /* @__PURE__ */ t(
             ve,
             {
               size: n,
-              value: l.value,
-              options: l.options ?? [10, 25, 50, 100],
-              onChange: l.onChange,
-              formatNumber: E
+              value: o.value,
+              options: o.options ?? [10, 25, 50, 100],
+              onChange: o.onChange,
+              formatNumber: V
             }
           ) : null
         ]
@@ -245,8 +267,8 @@ const me = g(
   }
 );
 me.displayName = "Pagination";
-const H = g(
-  ({ children: e, className: a, ...t }, s) => /* @__PURE__ */ i(
+const H = u(
+  ({ children: e, className: a, ...i }, s) => /* @__PURE__ */ t(
     "ul",
     {
       ref: s,
@@ -257,38 +279,38 @@ const H = g(
         "ds:list-none",
         a ?? ""
       ].filter(Boolean).join(" "),
-      ...t,
+      ...i,
       children: e
     }
   )
 );
 H.displayName = "PaginationList";
-const v = g(
-  ({ children: e, className: a, ...t }, s) => /* @__PURE__ */ i("li", { ref: s, className: a, ...t, children: e })
+const f = u(
+  ({ children: e, className: a, ...i }, s) => /* @__PURE__ */ t("li", { ref: s, className: a, ...i, children: e })
 );
-v.displayName = "PaginationItem";
-const $ = g(
-  ({ isActive: e = !1, size: a = "md", className: t, children: s, ...o }, r) => /* @__PURE__ */ i(
+f.displayName = "PaginationItem";
+const $ = u(
+  ({ isActive: e = !1, size: a = "md", className: i, children: s, ...d }, r) => /* @__PURE__ */ t(
     "button",
     {
       ref: r,
       type: "button",
       "aria-current": e ? "page" : void 0,
-      className: j({
+      className: P({
         size: a,
         active: e,
-        className: t
+        className: i
       }),
-      ...o,
+      ...d,
       children: s
     }
   )
 );
 $.displayName = "PaginationLink";
-const k = "ds:size-4 ds:rtl:-scale-x-100", U = g(
-  ({ size: e = "md", disabled: a, onClick: t }, s) => {
-    const { t: o } = x(), r = o("navigation.pagination.previous");
-    return /* @__PURE__ */ i(
+const M = "ds:size-4 ds:rtl:-scale-x-100", q = u(
+  ({ size: e = "md", disabled: a, onClick: i }, s) => {
+    const { t: d } = x(), r = d("navigation.pagination.previous");
+    return /* @__PURE__ */ t(
       "button",
       {
         ref: s,
@@ -296,18 +318,18 @@ const k = "ds:size-4 ds:rtl:-scale-x-100", U = g(
         "aria-label": r,
         "aria-disabled": a || void 0,
         disabled: a,
-        onClick: t,
-        className: j({ size: e }),
-        children: /* @__PURE__ */ i(te, { "aria-hidden": "true", className: k })
+        onClick: i,
+        className: P({ size: e }),
+        children: /* @__PURE__ */ t(ie, { "aria-hidden": "true", className: M })
       }
     );
   }
 );
-U.displayName = "PaginationPrevious";
-const q = g(
-  ({ size: e = "md", disabled: a, onClick: t }, s) => {
-    const { t: o } = x(), r = o("navigation.pagination.next");
-    return /* @__PURE__ */ i(
+q.displayName = "PaginationPrevious";
+const G = u(
+  ({ size: e = "md", disabled: a, onClick: i }, s) => {
+    const { t: d } = x(), r = d("navigation.pagination.next");
+    return /* @__PURE__ */ t(
       "button",
       {
         ref: s,
@@ -315,38 +337,38 @@ const q = g(
         "aria-label": r,
         "aria-disabled": a || void 0,
         disabled: a,
-        onClick: t,
-        className: j({ size: e }),
-        children: /* @__PURE__ */ i(F, { "aria-hidden": "true", className: k })
+        onClick: i,
+        className: P({ size: e }),
+        children: /* @__PURE__ */ t(F, { "aria-hidden": "true", className: M })
       }
     );
   }
 );
-q.displayName = "PaginationNext";
-const I = g(
-  ({ type: e, size: a = "md", disabled: t, onClick: s }, o) => {
-    const { t: r } = x(), n = r(e === "first" ? "navigation.pagination.first" : "navigation.pagination.last"), u = e === "first" ? ne : re;
-    return /* @__PURE__ */ i(
+G.displayName = "PaginationNext";
+const T = u(
+  ({ type: e, size: a = "md", disabled: i, onClick: s }, d) => {
+    const { t: r } = x(), n = r(e === "first" ? "navigation.pagination.first" : "navigation.pagination.last"), p = e === "first" ? te : ne;
+    return /* @__PURE__ */ t(
       "button",
       {
-        ref: o,
+        ref: d,
         type: "button",
         "aria-label": n,
-        "aria-disabled": t || void 0,
-        disabled: t,
+        "aria-disabled": i || void 0,
+        disabled: i,
         onClick: s,
-        className: j({ size: a }),
-        children: /* @__PURE__ */ i(u, { "aria-hidden": "true", className: k })
+        className: P({ size: a }),
+        children: /* @__PURE__ */ t(p, { "aria-hidden": "true", className: M })
       }
     );
   }
 );
-I.displayName = "PaginationEndpoint";
-const G = g(
-  ({ className: e, ...a }, t) => /* @__PURE__ */ i(
+T.displayName = "PaginationEndpoint";
+const J = u(
+  ({ className: e, ...a }, i) => /* @__PURE__ */ t(
     "span",
     {
-      ref: t,
+      ref: i,
       "aria-hidden": "true",
       role: "presentation",
       className: [
@@ -356,11 +378,11 @@ const G = g(
         e ?? ""
       ].filter(Boolean).join(" "),
       ...a,
-      children: /* @__PURE__ */ i(ie, { "aria-hidden": "true", className: "ds:size-4" })
+      children: /* @__PURE__ */ t(ae, { "aria-hidden": "true", className: "ds:size-4" })
     }
   )
 );
-G.displayName = "PaginationEllipsis";
+J.displayName = "PaginationEllipsis";
 const pe = [
   "ds:inline-flex ds:items-center ds:justify-between ds:gap-[var(--spacing-xs)]",
   "ds:rounded-[var(--radius-sm)] ds:border ds:border-[var(--border)] ds:bg-[var(--background)]",
@@ -388,33 +410,33 @@ const pe = [
 function ve({
   value: e,
   options: a,
-  onChange: t,
+  onChange: i,
   formatNumber: s
 }) {
-  const { t: o } = x(), r = ee();
-  return /* @__PURE__ */ f("div", { className: "ds:flex ds:items-center ds:gap-[var(--spacing-sm)]", children: [
-    /* @__PURE__ */ i(
+  const { t: d } = x(), r = D();
+  return /* @__PURE__ */ h("div", { className: "ds:flex ds:items-center ds:gap-[var(--spacing-sm)]", children: [
+    /* @__PURE__ */ t(
       "span",
       {
         id: r,
         className: "type-label ds:text-[var(--muted-foreground)]",
-        children: o("navigation.pagination.rowsPerPage")
+        children: d("navigation.pagination.rowsPerPage")
       }
     ),
-    /* @__PURE__ */ f(
+    /* @__PURE__ */ h(
       m.Root,
       {
         value: String(e),
-        onValueChange: (n) => t(Number(n)),
+        onValueChange: (n) => i(Number(n)),
         children: [
-          /* @__PURE__ */ f(
+          /* @__PURE__ */ h(
             m.Trigger,
             {
               "aria-labelledby": r,
               className: pe,
               children: [
-                /* @__PURE__ */ i(m.Value, {}),
-                /* @__PURE__ */ i(m.Icon, { asChild: !0, children: /* @__PURE__ */ i(
+                /* @__PURE__ */ t(m.Value, {}),
+                /* @__PURE__ */ t(m.Icon, { asChild: !0, children: /* @__PURE__ */ t(
                   F,
                   {
                     "aria-hidden": "true",
@@ -424,19 +446,19 @@ function ve({
               ]
             }
           ),
-          /* @__PURE__ */ i(m.Portal, { children: /* @__PURE__ */ i(
+          /* @__PURE__ */ t(m.Portal, { children: /* @__PURE__ */ t(
             m.Content,
             {
               className: ge,
               position: "popper",
-              children: /* @__PURE__ */ i(m.Viewport, { className: "ds:p-[var(--spacing-xs)]", children: a.map((n) => /* @__PURE__ */ f(
+              children: /* @__PURE__ */ t(m.Viewport, { className: "ds:p-[var(--spacing-xs)]", children: a.map((n) => /* @__PURE__ */ h(
                 m.Item,
                 {
                   value: String(n),
                   className: ue,
                   children: [
-                    /* @__PURE__ */ i(m.ItemIndicator, { className: "ds:absolute ds:inline-flex ds:items-center ds:justify-center ds:start-[var(--spacing-sm)]", children: /* @__PURE__ */ i(de, { "aria-hidden": "true", className: "ds:size-3.5" }) }),
-                    /* @__PURE__ */ i(m.ItemText, { children: s(n) })
+                    /* @__PURE__ */ t(m.ItemIndicator, { className: "ds:absolute ds:inline-flex ds:items-center ds:justify-center ds:start-[var(--spacing-sm)]", children: /* @__PURE__ */ t(re, { "aria-hidden": "true", className: "ds:size-3.5" }) }),
+                    /* @__PURE__ */ t(m.ItemText, { children: s(n) })
                   ]
                 },
                 n
@@ -450,13 +472,13 @@ function ve({
 }
 export {
   me as P,
-  G as a,
-  v as b,
+  J as a,
+  f as b,
   $ as c,
   H as d,
-  q as e,
-  U as f,
+  G as e,
+  q as f,
   ce as g,
   oe as p
 };
-//# sourceMappingURL=pagination-OQBlnb1H.js.map
+//# sourceMappingURL=pagination-F1ei4khE.js.map