@ztwoint/z-ui 0.1.115 → 0.1.117

package/dist/components/chart-card/config/defaults.d.ts

@@ -0,0 +1,164 @@
+import { ChartOptions } from '../chart-card.config.types';
+export declare const DEFAULT_CHART_HEIGHT = 400;
+export declare const DEFAULT_CHART_WIDTH = "100%";
+export declare const DEFAULT_FONT_FAMILY = "Inter Variable, sans-serif";
+export declare const COMMON_TEXT_STYLE: {
+    fontFamily: string;
+    color: "#000000";
+};
+export declare function buildTitleConfig(title: string, options?: ChartOptions['title']): {
+    text: string;
+    textStyle: {
+        fontFamily: string;
+        fontSize: number;
+        fontWeight: number;
+        color: string;
+    };
+    left: "center" | "left" | "right";
+    top: number;
+    padding: number[];
+} | undefined;
+export declare function buildTooltipConfig(options?: ChartOptions['tooltip']): {
+    trigger: "axis" | "item";
+    backgroundColor: "#ffffff";
+    borderColor: "#d1d1d1";
+    borderWidth: number;
+    textStyle: {
+        fontFamily: string;
+        color: "#000000";
+    };
+} | undefined;
+export declare function buildLegendConfig(data: string[], hasTitle?: boolean, options?: ChartOptions['legend']): {
+    data: string[];
+    top: string | number;
+    bottom: string | number | undefined;
+    left: string | number;
+    right: string | number | undefined;
+    orient: "horizontal" | "vertical";
+    itemGap: number;
+    padding: number[];
+    textStyle: {
+        fontSize: number;
+        fontFamily: string;
+        color: "#000000";
+    };
+    itemWidth: number;
+    itemHeight: number;
+} | undefined;
+export declare function buildAxisLabelConfig(rotate?: number): {
+    rotate?: number | undefined;
+    color: "#5d5d5d";
+    fontFamily: string;
+    fontSize: number;
+};
+export declare function buildAxisLineConfig(show?: boolean): {
+    show: boolean;
+    lineStyle: {
+        color: "#d1d1d1";
+    };
+};
+export declare function buildSplitLineConfig(show?: boolean): {
+    show: boolean;
+    lineStyle: {
+        color: "#e7e7e7";
+    };
+};
+export declare function buildGridConfig(hasTitle: boolean, hasLegend?: boolean, legendPosition?: 'top' | 'bottom' | 'left' | 'right', customGrid?: ChartOptions['grid']): {
+    left: string | number;
+    right: string | number;
+    bottom: string | number;
+    top: string | number;
+    containLabel: boolean;
+};
+export declare function buildXAxisConfig(data: string[], boundaryGap?: boolean, options?: ChartOptions['xAxis']): {
+    show: boolean;
+    type?: undefined;
+    data?: undefined;
+    boundaryGap?: undefined;
+    name?: undefined;
+    nameLocation?: undefined;
+    nameGap?: undefined;
+    nameTextStyle?: undefined;
+    axisLine?: undefined;
+    axisLabel?: undefined;
+    splitLine?: undefined;
+} | {
+    type: "category";
+    data: string[];
+    boundaryGap: boolean;
+    name: string | undefined;
+    nameLocation: "end" | "middle" | "start";
+    nameGap: number | undefined;
+    nameTextStyle: {
+        fontSize: number;
+        fontWeight: number;
+        fontFamily: string;
+        color: "#000000";
+    } | undefined;
+    axisLine: {
+        show: boolean;
+        lineStyle: {
+            color: "#d1d1d1";
+        };
+    };
+    axisLabel: {
+        rotate?: number | undefined;
+        color: "#5d5d5d";
+        fontFamily: string;
+        fontSize: number;
+    };
+    splitLine: {
+        show: boolean;
+        lineStyle: {
+            color: "#e7e7e7";
+        };
+    };
+    show?: undefined;
+};
+export declare function buildYAxisConfig(options?: ChartOptions['yAxis']): {
+    show: boolean;
+    type?: undefined;
+    name?: undefined;
+    nameLocation?: undefined;
+    nameGap?: undefined;
+    nameRotate?: undefined;
+    nameTextStyle?: undefined;
+    min?: undefined;
+    max?: undefined;
+    axisLine?: undefined;
+    axisLabel?: undefined;
+    splitLine?: undefined;
+} | {
+    type: "value";
+    name: string | undefined;
+    nameLocation: "end" | "middle" | "start";
+    nameGap: number | undefined;
+    nameRotate: number;
+    nameTextStyle: {
+        fontSize: number;
+        fontWeight: number;
+        fontFamily: string;
+        color: "#000000";
+    } | undefined;
+    min: number | undefined;
+    max: number | undefined;
+    axisLine: {
+        show: boolean;
+        lineStyle: {
+            color: "#d1d1d1";
+        };
+    };
+    axisLabel: {
+        rotate?: number | undefined;
+        color: "#5d5d5d";
+        fontFamily: string;
+        fontSize: number;
+    };
+    splitLine: {
+        show: boolean;
+        lineStyle: {
+            color: "#e7e7e7";
+        };
+    };
+    show?: undefined;
+};

package/dist/components/chart-card/config/defaults.js

@@ -0,0 +1,156 @@
+import { UI_COLORS as m } from "./colors.js";
+const g = "Inter Variable, sans-serif", c = {
+  fontFamily: g,
+  color: m.text.primary
+};
+function y(e, l) {
+  if ((l == null ? void 0 : l.show) === !1)
+    return;
+  const r = (l == null ? void 0 : l.position) ?? "left", a = (l == null ? void 0 : l.fontSize) ?? 16, f = (l == null ? void 0 : l.color) ?? m.text.primary;
+  return {
+    text: e,
+    textStyle: {
+      fontFamily: g,
+      fontSize: a,
+      fontWeight: 500,
+      color: f
+    },
+    left: r,
+    top: 12,
+    padding: [0, 0, 8, 0]
+  };
+}
+function C(e) {
+  return (e == null ? void 0 : e.show) === !1 ? void 0 : {
+    trigger: (e == null ? void 0 : e.trigger) ?? "axis",
+    backgroundColor: m.background.default,
+    borderColor: m.border.default,
+    borderWidth: 1,
+    textStyle: {
+      ...c
+    }
+  };
+}
+function v(e, l = !1, r) {
+  if ((r == null ? void 0 : r.show) === !1)
+    return;
+  const a = (r == null ? void 0 : r.position) ?? "top", f = (r == null ? void 0 : r.orient) ?? "horizontal";
+  let u = l ? 48 : 16, t, d = "center", b;
+  return a === "bottom" ? (u = "auto", t = 10) : a === "left" ? (u = "middle", d = 10) : a === "right" && (u = "middle", d = "auto", b = 10), {
+    data: e,
+    top: u,
+    bottom: t,
+    left: d,
+    right: b,
+    orient: f,
+    itemGap: 20,
+    padding: [8, 0, 12, 0],
+    textStyle: {
+      ...c,
+      fontSize: 12
+    },
+    itemWidth: 25,
+    itemHeight: 14
+  };
+}
+function x(e) {
+  return {
+    color: m.text.secondary,
+    fontFamily: g,
+    fontSize: 11,
+    ...e && { rotate: e }
+  };
+}
+function S(e = !0) {
+  return {
+    show: e,
+    lineStyle: {
+      color: m.border.default
+    }
+  };
+}
+function h(e = !0) {
+  return {
+    show: e,
+    lineStyle: {
+      color: m.border.light
+    }
+  };
+}
+function T(e, l = !1, r = "top", a) {
+  if (a)
+    return {
+      left: a.left ?? "3%",
+      right: a.right ?? "4%",
+      bottom: a.bottom ?? "3%",
+      top: a.top ?? 20,
+      containLabel: !0
+    };
+  let f = 20;
+  e && (f += 48), l && r === "top" && (f += 40);
+  let u = "3%";
+  l && r === "bottom" && (u = 60);
+  let t = "3%";
+  l && r === "left" && (t = 100);
+  let d = "4%";
+  return l && r === "right" && (d = 100), {
+    left: t,
+    right: d,
+    bottom: u,
+    top: f,
+    containLabel: !0
+  };
+}
+function w(e, l = !0, r) {
+  return (r == null ? void 0 : r.show) === !1 ? { show: !1 } : {
+    type: "category",
+    data: e,
+    boundaryGap: l,
+    name: r == null ? void 0 : r.name,
+    nameLocation: (r == null ? void 0 : r.nameLocation) ?? "middle",
+    nameGap: r != null && r.name ? 30 : void 0,
+    nameTextStyle: r != null && r.name ? {
+      ...c,
+      fontSize: 12,
+      fontWeight: 500
+    } : void 0,
+    axisLine: S(),
+    axisLabel: x(r == null ? void 0 : r.labelRotate),
+    splitLine: h((r == null ? void 0 : r.gridLines) ?? !1)
+  };
+}
+function z(e) {
+  if ((e == null ? void 0 : e.show) === !1)
+    return { show: !1 };
+  const l = (e == null ? void 0 : e.min) === "auto" || e == null ? void 0 : e.min, r = (e == null ? void 0 : e.max) === "auto" || e == null ? void 0 : e.max;
+  return {
+    type: "value",
+    name: e == null ? void 0 : e.name,
+    nameLocation: (e == null ? void 0 : e.nameLocation) ?? "middle",
+    nameGap: e != null && e.name ? 50 : void 0,
+    nameRotate: 90,
+    nameTextStyle: e != null && e.name ? {
+      ...c,
+      fontSize: 12,
+      fontWeight: 500
+    } : void 0,
+    min: l,
+    max: r,
+    axisLine: S(!1),
+    axisLabel: x(),
+    splitLine: h((e == null ? void 0 : e.gridLines) ?? !0)
+  };
+}
+export {
+  c as COMMON_TEXT_STYLE,
+  g as DEFAULT_FONT_FAMILY,
+  x as buildAxisLabelConfig,
+  S as buildAxisLineConfig,
+  T as buildGridConfig,
+  v as buildLegendConfig,
+  h as buildSplitLineConfig,
+  y as buildTitleConfig,
+  C as buildTooltipConfig,
+  w as buildXAxisConfig,
+  z as buildYAxisConfig
+};

package/dist/components/chart-card/index.d.ts

@@ -0,0 +1,10 @@
+export { ChartCard } from './chart-card';
+export type { ChartCardProps } from './chart-card.types';
+export { LoadingState, EmptyState, ErrorState } from './chart-card-states';
+export type { ChartType, ChartTheme, LineChartTheme, BarChartTheme, ChartConfig, BarChartConfig, LineChartConfig, ChartSeries, ChartData, ChartOptions, SeriesStyleConfig, } from './chart-card.config.types';
+export { UI_COLORS, COLOR_PALETTES, getThemePalette } from './config/colors';
+export { validateChartConfig, validateChartData } from './validators/config-validator';
+export type { ValidationResult } from './validators/config-validator';
+export { buildBarChartOptions } from './builders/bar-chart-builder';
+export { buildLineChartOptions } from './builders/line-chart-builder';
+export { buildChartOptions, isChartTypeSupported, registeredChartTypes, } from './builders/chart-builder-factory';

package/dist/components/chart-card/validators/config-validator.d.ts

@@ -0,0 +1,7 @@
+import { ChartConfig, ChartData } from '../chart-card.config.types';
+export interface ValidationResult {
+    valid: boolean;
+    error?: string;
+}
+export declare function validateChartConfig(config: ChartConfig): ValidationResult;
+export declare function validateChartData(data: ChartData): ValidationResult;

package/dist/components/chart-card/validators/config-validator.js

@@ -0,0 +1,40 @@
+const i = /* @__PURE__ */ new Set([
+  "basic",
+  "smooth"
+]), s = /* @__PURE__ */ new Set([
+  "basic",
+  "stacked"
+]);
+function n(e) {
+  var r;
+  return e != null && e.type ? (r = e.name) != null && r.trim() ? (e.type === "line" ? i.has(e.theme) : s.has(e.theme)) ? { valid: !0 } : {
+    valid: !1,
+    error: `Theme "${e.theme}" is not supported for ${e.type} charts`
+  } : { valid: !1, error: "Chart name is required" } : { valid: !1, error: "Chart type is required" };
+}
+function u(e) {
+  if (!e)
+    return { valid: !1, error: "Chart data is required" };
+  if (!Array.isArray(e.labels) || e.labels.length === 0)
+    return { valid: !1, error: "At least one label is required" };
+  if (!Array.isArray(e.series) || e.series.length === 0)
+    return { valid: !1, error: "At least one data series is required" };
+  const a = e.labels.length;
+  for (const r of e.series) {
+    const t = l(r, a);
+    if (!t.valid)
+      return t;
+  }
+  return { valid: !0 };
+}
+function l(e, a) {
+  var r;
+  return (r = e.name) != null && r.trim() ? Array.isArray(e.values) ? e.values.length !== a ? {
+    valid: !1,
+    error: `Series "${e.name}" contains ${e.values.length} points, expected ${a}`
+  } : { valid: !0 } : { valid: !1, error: `Series "${e.name}" is missing values` } : { valid: !1, error: "Each series requires a name" };
+}
+export {
+  n as validateChartConfig,
+  u as validateChartData
+};

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
 };