@ztwoint/z-ui 0.1.116 → 0.1.117

package/dist/components/assets/icons/double-chevron-left.js

@@ -13,8 +13,7 @@ function l({
         fill: "none",
         stroke: o,
         strokeLinecap: "round",
-        strokeLinejoin: "round",
-        strokeWidth: "2"
+        strokeLinejoin: "round"
       }
     ) })
   ] });

package/dist/components/assets/icons/double-chevron-right.js

@@ -13,8 +13,7 @@ function h({
         fill: "none",
         stroke: r,
         strokeLinecap: "round",
-        strokeLinejoin: "round",
-        strokeWidth: "2"
+        strokeLinejoin: "round"
       }
     ) })
   ] });

package/dist/components/dynamic-table/z2-table-pagination.d.ts

@@ -1,5 +1,6 @@
 import { ReactNode } from 'react';
 interface Z2TablePaginationProps {
+    showSizeToggle?: boolean;
     sizes?: number[];
     sizesInfo?: string;
     sizesLabel?: string;
@@ -14,6 +15,7 @@ interface Z2TablePaginationProps {
     previousPageLabel?: string;
     nextPageLabel?: string;
     ellipsisText?: string;
+    showGoToPage?: boolean;
 }
 declare function Z2TablePagination(props: Z2TablePaginationProps): import("react/jsx-runtime").JSX.Element;
 export { Z2TablePagination, type Z2TablePaginationProps };

package/dist/components/dynamic-table/z2-table-pagination.js

@@ -1,59 +1,65 @@
-import { jsx as t, jsxs as l, Fragment as v } from "react/jsx-runtime";
-import { ChevronLeftIcon as P, ChevronRightIcon as I } from "lucide-react";
-import { useZ2Table as L } from "./z2-table-context.js";
-import { Z2Skeleton as S } from "../skeleton/skeleton.js";
-import { Button as r } from "../button/button.js";
+import { jsx as t, jsxs as l, Fragment as f } from "react/jsx-runtime";
+import { useZ2Table as z } from "./z2-table-context.js";
+import { Z2Skeleton as N } from "../skeleton/skeleton.js";
+import { Button as s } from "../button/button.js";
 import "react";
-import { cn as Z } from "../../lib/utils.js";
-import { Z2Select as y, Z2SelectTrigger as T, Z2SelectValue as $, Z2SelectContent as j, Z2SelectItem as B } from "../select/z2-select.js";
-function H(N) {
+import { cn as I } from "../../lib/utils.js";
+import { Z2Select as L, Z2SelectTrigger as y, Z2SelectValue as T, Z2SelectContent as Z, Z2SelectItem as G } from "../select/z2-select.js";
+import $ from "../assets/icons/double-chevron-left.js";
+import j from "../assets/icons/double-chevron-right.js";
+import B from "../assets/icons/chevron-left.js";
+import M from "../assets/icons/chevron-right.js";
+import { Input as D } from "../input/input.js";
+function X(P) {
   var b;
-  const { table: n, recordCount: m, isLoading: u } = L(), e = { ...{
-    sizes: [5, 10, 25, 50, 100],
+  const { table: a, recordCount: g, isLoading: h } = z(), e = { ...{
+    showSizeToggle: !1,
+    sizes: [25, 50, 100],
     sizesLabel: "Show",
     sizesDescription: "per page",
-    sizesSkeleton: /* @__PURE__ */ t(S, { className: "h-8 w-44" }),
+    sizesSkeleton: /* @__PURE__ */ t(N, { className: "h-6 w-44" }),
     moreLimit: 5,
     more: !1,
-    info: "{from} - {to} of {count}",
-    infoSkeleton: /* @__PURE__ */ t(S, { className: "h-8 w-60" }),
+    info: "Viewing {from} - {to} out of {count}",
+    infoSkeleton: /* @__PURE__ */ t(N, { className: "h-6 w-32" }),
     rowsPerPageLabel: "Rows per page",
     previousPageLabel: "Go to previous page",
     nextPageLabel: "Go to next page",
-    ellipsisText: "..."
-  }, ...N }, g = " rtl:transform rtl:rotate-180", o = n.getState().pagination.pageIndex, i = n.getState().pagination.pageSize, x = o * i + 1, h = Math.min((o + 1) * i, m), p = n.getPageCount(), w = e != null && e.info ? e.info.replace("{from}", x.toString()).replace("{to}", h.toString()).replace("{count}", m.toString()) : `${x} - ${h} of ${m}`, f = (e == null ? void 0 : e.moreLimit) || 5, c = Math.floor(o / f) * f, d = Math.min(c + f, p), z = () => {
-    const s = [];
-    for (let a = c; a < d; a++)
-      s.push(
+    ellipsisText: "...",
+    showGoToPage: !1
+  }, ...P }, r = " rtl:transform rtl:rotate-180", i = a.getState().pagination.pageIndex, c = a.getState().pagination.pageSize, x = i * c + 1, v = Math.min((i + 1) * c, g), d = a.getPageCount(), w = e != null && e.info ? e.info.replace("{from}", x.toString()).replace("{to}", v.toString()).replace("{count}", g.toString()) : `${x} - ${v} of ${g}`, p = (e == null ? void 0 : e.moreLimit) || 5, m = Math.floor(i / p) * p, u = Math.min(m + p, d), S = () => {
+    const o = [];
+    for (let n = m; n < u; n++)
+      o.push(
         /* @__PURE__ */ t(
-          r,
+          s,
           {
             size: "small",
             variant: "stroke",
-            disabled: o === a,
+            disabled: i === n,
             onClick: () => {
-              o !== a && n.setPageIndex(a);
+              i !== n && a.setPageIndex(n);
             },
-            leftIcon: a + 1
+            leftIcon: n + 1
           },
-          a
+          n
         )
       );
-    return s;
-  }, k = () => c > 0 ? /* @__PURE__ */ t(
-    r,
+    return o;
+  }, C = () => m > 0 ? /* @__PURE__ */ t(
+    s,
     {
       size: "small",
       variant: "stroke",
-      onClick: () => n.setPageIndex(c - 1),
+      onClick: () => a.setPageIndex(m - 1),
       label: e.ellipsisText
     }
-  ) : null, C = () => d < p ? /* @__PURE__ */ t(
-    r,
+  ) : null, k = () => u < d ? /* @__PURE__ */ t(
+    s,
     {
       variant: "stroke",
       size: "small",
-      onClick: () => n.setPageIndex(d),
+      onClick: () => a.setPageIndex(u),
       label: e.ellipsisText
     }
   ) : null;
@@ -61,55 +67,98 @@ function H(N) {
     "div",
     {
       "data-slot": "data-grid-pagination",
-      className: Z(
+      className: I(
         "flex flex-wrap flex-col sm:flex-row justify-between items-center gap-2.5 py-2.5 sm:py-0 grow",
         e == null ? void 0 : e.className
       ),
       children: [
-        /* @__PURE__ */ t("div", { className: "flex flex-wrap items-center space-x-2.5 pb-2.5 sm:pb-0 order-2 sm:order-1", children: u ? e == null ? void 0 : e.sizesSkeleton : /* @__PURE__ */ l(v, { children: [
-          /* @__PURE__ */ t("div", { className: "text-sm text-muted-foreground", children: e.rowsPerPageLabel }),
-          /* @__PURE__ */ l(
-            y,
-            {
-              value: `${i}`,
-              onValueChange: (s) => {
-                const a = Number(s);
-                n.setPageSize(a);
-              },
-              children: [
-                /* @__PURE__ */ t(T, { className: "w-fit", size: "sm", children: /* @__PURE__ */ t($, { placeholder: `${i}` }) }),
-                /* @__PURE__ */ t(j, { side: "top", className: "min-w-[50px]", children: (b = e == null ? void 0 : e.sizes) == null ? void 0 : b.map((s) => /* @__PURE__ */ t(B, { value: `${s}`, children: s }, s)) })
-              ]
-            }
-          )
-        ] }) }),
-        /* @__PURE__ */ t("div", { className: "flex flex-col sm:flex-row justify-center sm:justify-end items-center gap-2.5 pt-2.5 sm:pt-0 order-1 sm:order-2", children: u ? e == null ? void 0 : e.infoSkeleton : /* @__PURE__ */ l(v, { children: [
-          /* @__PURE__ */ t("div", { className: "text-sm text-muted-foreground text-nowrap order-2 sm:order-1", children: w }),
-          p > 1 && /* @__PURE__ */ l("div", { className: "flex items-center space-x-1 order-1 sm:order-2", children: [
+        /* @__PURE__ */ t("div", { className: "flex flex-wrap items-center space-x-2.5 pb-2.5 sm:pb-0 order-2 sm:order-1", children: h ? e == null ? void 0 : e.infoSkeleton : /* @__PURE__ */ t(f, { children: /* @__PURE__ */ t("div", { className: "leading-none-medium-sm text-neutral-secondary text-nowrap", children: w }) }) }),
+        /* @__PURE__ */ t("div", { className: "flex flex-col sm:flex-row justify-center sm:justify-end items-center gap-2.5 pt-2.5 sm:pt-0 order-1 sm:order-2", children: h ? e == null ? void 0 : e.sizesSkeleton : /* @__PURE__ */ l(f, { children: [
+          e.showSizeToggle && /* @__PURE__ */ l(f, { children: [
+            /* @__PURE__ */ t("div", { className: "leading-none-medium-sm text-neutral-secondary", children: e.rowsPerPageLabel }),
+            /* @__PURE__ */ l(
+              L,
+              {
+                value: `${c}`,
+                onValueChange: (o) => {
+                  const n = Number(o);
+                  a.setPageSize(n);
+                },
+                children: [
+                  /* @__PURE__ */ t(y, { className: "w-fit", size: "sm", children: /* @__PURE__ */ t(T, { placeholder: `${c}` }) }),
+                  /* @__PURE__ */ t(Z, { side: "top", className: "min-w-[50px]", children: (b = e == null ? void 0 : e.sizes) == null ? void 0 : b.map((o) => /* @__PURE__ */ t(G, { value: `${o}`, children: o }, o)) })
+                ]
+              }
+            )
+          ] }),
+          e.showGoToPage && /* @__PURE__ */ l("div", { className: "leading-none-medium-sm text-neutral-secondary text-nowrap order-2 sm:order-1 flex items-center gap-1", children: [
+            "Go to page:",
+            " ",
+            /* @__PURE__ */ t(
+              D,
+              {
+                size: "small",
+                className: "w-10",
+                type: "number",
+                min: 1,
+                placeholder: `${a.getState().pagination.pageIndex + 1}`,
+                max: a.getPageCount(),
+                onBlur: (o) => {
+                  let n = Number(o.target.value);
+                  n = n - 1, n <= a.getPageCount() && a.setPageIndex(n);
+                }
+              }
+            )
+          ] }),
+          d > 1 && /* @__PURE__ */ l("div", { className: "flex items-center space-x-1 order-1 sm:order-2", children: [
             /* @__PURE__ */ t(
-              r,
+              s,
               {
                 size: "small",
                 variant: "stroke",
-                className: g,
-                onClick: () => n.previousPage(),
-                disabled: !n.getCanPreviousPage(),
-                leftIcon: /* @__PURE__ */ t(P, { className: "size-full" }),
+                className: r,
+                onClick: () => a.firstPage(),
+                disabled: !a.getCanPreviousPage(),
+                leftIcon: /* @__PURE__ */ t($, {}),
+                children: /* @__PURE__ */ t("span", { className: "sr-only", children: e.previousPageLabel })
+              }
+            ),
+            /* @__PURE__ */ t(
+              s,
+              {
+                size: "small",
+                variant: "stroke",
+                className: r,
+                onClick: () => a.previousPage(),
+                disabled: !a.getCanPreviousPage(),
+                leftIcon: /* @__PURE__ */ t(B, {}),
                 children: /* @__PURE__ */ t("span", { className: "sr-only", children: e.previousPageLabel })
               }
             ),
-            k(),
-            z(),
             C(),
+            S(),
+            k(),
+            /* @__PURE__ */ t(
+              s,
+              {
+                size: "small",
+                variant: "stroke",
+                className: r,
+                onClick: () => a.nextPage(),
+                disabled: !a.getCanNextPage(),
+                leftIcon: /* @__PURE__ */ t(M, {}),
+                children: /* @__PURE__ */ t("span", { className: "sr-only", children: e.nextPageLabel })
+              }
+            ),
             /* @__PURE__ */ t(
-              r,
+              s,
               {
                 size: "small",
                 variant: "stroke",
-                className: g,
-                onClick: () => n.nextPage(),
-                disabled: !n.getCanNextPage(),
-                leftIcon: /* @__PURE__ */ t(I, { className: "size-full" }),
+                className: r,
+                onClick: () => a.lastPage(),
+                disabled: !a.getCanNextPage(),
+                leftIcon: /* @__PURE__ */ t(j, {}),
                 children: /* @__PURE__ */ t("span", { className: "sr-only", children: e.nextPageLabel })
               }
             )
@@ -120,5 +169,5 @@ function H(N) {
   );
 }
 export {
-  H as Z2TablePagination
+  X as Z2TablePagination
 };