@juv/codego-react-ui 3.0.6 → 3.0.8

package/dist/index.cjs

@@ -4858,7 +4858,19 @@ function useServerDataGrid({ url, params }) {
     import_axios.default.get(url, { params: { ...params, page: currentPage } }).then(({ data: res }) => {
       if (cancelled) return;
       setData(res.data);
-      setPagination(res.pagination);
+      const rawTotal = res.total;
+      const rawPerPage = res.per_page;
+      const lastPage = Math.ceil(rawTotal / rawPerPage);
+      const pg = res.pagination ?? {
+        first_page_url: res.first_page_url ?? `${url}?page=1`,
+        last_page_url: res.last_page_url ?? `${url}?page=${lastPage}`,
+        next_page_url: res.next_page_url !== void 0 ? res.next_page_url : currentPage < lastPage ? `${url}?page=${currentPage + 1}` : null,
+        prev_page_url: res.prev_page_url !== void 0 ? res.prev_page_url : currentPage > 1 ? `${url}?page=${currentPage - 1}` : null,
+        per_page: rawPerPage,
+        total: rawTotal,
+        links: res.links ?? []
+      };
+      setPagination(pg);
       if (res.data.length > 0) {
         setColumns(
           Object.keys(res.data[0]).map((key) => ({
@@ -5358,45 +5370,52 @@ function DataGrid({
         onPageChange: setPage
       }
     ),
-    serverPagination && /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex items-center justify-between gap-2 flex-wrap", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("span", { className: "text-xs text-muted-foreground", children: [
-        serverPagination.pagination.total,
-        " total rows \xB7 page ",
-        serverPagination.currentPage
-      ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex items-center gap-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
-          "button",
-          {
-            onClick: () => serverPagination.goToPage(serverPagination.currentPage - 1),
-            disabled: !serverPagination.pagination.prev_page_url,
-            className: "flex h-8 w-8 items-center justify-center rounded-lg border border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none",
-            children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_lucide_react15.ChevronLeft, { className: "h-4 w-4" })
-          }
-        ),
-        serverPagination.pagination.links.map((link) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
-          "button",
-          {
-            onClick: () => serverPagination.goToPage(link.page),
-            className: cn(
-              "flex h-8 w-8 items-center justify-center rounded-lg border text-xs font-medium transition-colors",
-              link.active ? "border-primary bg-primary text-primary-foreground shadow-sm" : "border-border text-muted-foreground hover:bg-muted hover:text-foreground"
-            ),
-            children: link.page
-          },
-          link.page
-        )),
-        /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
-          "button",
-          {
-            onClick: () => serverPagination.goToPage(serverPagination.currentPage + 1),
-            disabled: !serverPagination.pagination.next_page_url,
-            className: "flex h-8 w-8 items-center justify-center rounded-lg border border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none",
-            children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_lucide_react15.ChevronRight, { className: "h-4 w-4" })
-          }
-        )
-      ] })
-    ] }),
+    serverPagination && (() => {
+      const { pagination, currentPage: cp, goToPage } = serverPagination;
+      const totalServerPages = Math.ceil(pagination.total / pagination.per_page);
+      const pageLinks = Array.from({ length: totalServerPages }, (_, i) => i + 1);
+      return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex items-center justify-between gap-2 flex-wrap", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("span", { className: "text-xs text-muted-foreground", children: [
+          pagination.total,
+          " total rows \xB7 page ",
+          cp,
+          " of ",
+          totalServerPages
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex items-center gap-1", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+            "button",
+            {
+              onClick: () => goToPage(cp - 1),
+              disabled: !pagination.prev_page_url,
+              className: "flex h-8 w-8 items-center justify-center rounded-lg border border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none",
+              children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_lucide_react15.ChevronLeft, { className: "h-4 w-4" })
+            }
+          ),
+          pageLinks.map((p) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+            "button",
+            {
+              onClick: () => goToPage(p),
+              className: cn(
+                "flex h-8 w-8 items-center justify-center rounded-lg border text-xs font-medium transition-colors",
+                p === cp ? "border-primary bg-primary text-primary-foreground shadow-sm" : "border-border text-muted-foreground hover:bg-muted hover:text-foreground"
+              ),
+              children: p
+            },
+            p
+          )),
+          /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+            "button",
+            {
+              onClick: () => goToPage(cp + 1),
+              disabled: !pagination.next_page_url,
+              className: "flex h-8 w-8 items-center justify-center rounded-lg border border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none",
+              children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_lucide_react15.ChevronRight, { className: "h-4 w-4" })
+            }
+          )
+        ] })
+      ] });
+    })(),
     defaultActions && viewItem && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(DGViewModal, { item: viewItem, fields: viewFields, onClose: () => setViewItem(null) }),
     defaultActions && editItem && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
       DGEditModal,
@@ -9484,7 +9503,19 @@ function useServerTable({ url, params }) {
     }).then(({ data: res }) => {
       if (cancelled) return;
       setData(res.data);
-      setPagination(res.pagination);
+      const rawTotal = res.total;
+      const rawPerPage = res.per_page;
+      const lastPage = Math.ceil(rawTotal / rawPerPage);
+      const pg = res.pagination ?? {
+        first_page_url: res.first_page_url ?? `${url}?page=1`,
+        last_page_url: res.last_page_url ?? `${url}?page=${lastPage}`,
+        next_page_url: res.next_page_url !== void 0 ? res.next_page_url : currentPage < lastPage ? `${url}?page=${currentPage + 1}` : null,
+        prev_page_url: res.prev_page_url !== void 0 ? res.prev_page_url : currentPage > 1 ? `${url}?page=${currentPage - 1}` : null,
+        per_page: rawPerPage,
+        total: rawTotal,
+        links: res.links ?? []
+      };
+      setPagination(pg);
       if (res.data.length > 0) {
         setColumns(
           Object.keys(res.data[0]).map((key) => ({
@@ -10145,45 +10176,52 @@ function Table({
           )
         ] })
       ] }),
-      serverPagination && /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "flex items-center justify-between gap-2 flex-wrap", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("span", { className: "text-xs text-muted-foreground", children: [
-          serverPagination.pagination.total,
-          " total rows \xB7 page ",
-          serverPagination.currentPage
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "flex items-center gap-1", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
-            "button",
-            {
-              onClick: () => serverPagination.goToPage(serverPagination.currentPage - 1),
-              disabled: !serverPagination.pagination.prev_page_url,
-              className: "flex h-8 w-8 items-center justify-center rounded-lg border border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none",
-              children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_lucide_react28.ChevronLeft, { className: "h-4 w-4" })
-            }
-          ),
-          serverPagination.pagination.links.map((link) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
-            "button",
-            {
-              onClick: () => serverPagination.goToPage(link.page),
-              className: cn(
-                "flex h-8 w-8 items-center justify-center rounded-lg border text-xs font-medium transition-colors",
-                link.active ? "border-primary bg-primary text-primary-foreground shadow-sm" : "border-border text-muted-foreground hover:bg-muted hover:text-foreground"
-              ),
-              children: link.page
-            },
-            link.page
-          )),
-          /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
-            "button",
-            {
-              onClick: () => serverPagination.goToPage(serverPagination.currentPage + 1),
-              disabled: !serverPagination.pagination.next_page_url,
-              className: "flex h-8 w-8 items-center justify-center rounded-lg border border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none",
-              children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_lucide_react28.ChevronRight, { className: "h-4 w-4" })
-            }
-          )
-        ] })
-      ] })
+      serverPagination && (() => {
+        const { pagination: pagination2, currentPage: cp, goToPage } = serverPagination;
+        const totalServerPages = Math.ceil(pagination2.total / pagination2.per_page);
+        const pageLinks = Array.from({ length: totalServerPages }, (_, i) => i + 1);
+        return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "flex items-center justify-between gap-2 flex-wrap", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("span", { className: "text-xs text-muted-foreground", children: [
+            pagination2.total,
+            " total rows \xB7 page ",
+            cp,
+            " of ",
+            totalServerPages
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "flex items-center gap-1", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+              "button",
+              {
+                onClick: () => goToPage(cp - 1),
+                disabled: !pagination2.prev_page_url,
+                className: "flex h-8 w-8 items-center justify-center rounded-lg border border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none",
+                children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_lucide_react28.ChevronLeft, { className: "h-4 w-4" })
+              }
+            ),
+            pageLinks.map((p) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+              "button",
+              {
+                onClick: () => goToPage(p),
+                className: cn(
+                  "flex h-8 w-8 items-center justify-center rounded-lg border text-xs font-medium transition-colors",
+                  p === cp ? "border-primary bg-primary text-primary-foreground shadow-sm" : "border-border text-muted-foreground hover:bg-muted hover:text-foreground"
+                ),
+                children: p
+              },
+              p
+            )),
+            /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+              "button",
+              {
+                onClick: () => goToPage(cp + 1),
+                disabled: !pagination2.next_page_url,
+                className: "flex h-8 w-8 items-center justify-center rounded-lg border border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none",
+                children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_lucide_react28.ChevronRight, { className: "h-4 w-4" })
+              }
+            )
+          ] })
+        ] });
+      })()
     ] }),
     defaultActions && viewItem && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
       ViewModal,

package/dist/index.d.cts

@@ -350,10 +350,10 @@ interface ServerPagination {
     total: number;
     links: ServerPaginationLink[];
 }
-interface ServerTableResponse<T> {
+interface ServerTableResponse<T> extends ServerPagination {
     current_page: number;
     data: T[];
-    pagination: ServerPagination;
+    pagination?: ServerPagination;
 }
 interface UseServerTableOptions {
     /** Base URL — page param appended automatically: `url?page=N` */
@@ -449,7 +449,7 @@ interface TableProps<T> {
     /** When provided, appends an Actions column with View / Edit / Delete buttons */
     defaultActions?: DefaultActionsConfig<T>;
     /** Pass the serverPagination object from useServerTable to enable server-side pagination */
-    serverPagination?: ServerPaginationProp;
+    serverPagination?: ServerPaginationProp | null;
     className?: string;
 }
 declare function Table<T extends Record<string, any>>({ data, columns, searchable, searchPlaceholder, pagination, itemsPerPage, selectable, onBulkDelete, idKey, defaultActions, serverPagination, className, }: TableProps<T>): react_jsx_runtime.JSX.Element;

package/dist/index.d.ts

@@ -350,10 +350,10 @@ interface ServerPagination {
     total: number;
     links: ServerPaginationLink[];
 }
-interface ServerTableResponse<T> {
+interface ServerTableResponse<T> extends ServerPagination {
     current_page: number;
     data: T[];
-    pagination: ServerPagination;
+    pagination?: ServerPagination;
 }
 interface UseServerTableOptions {
     /** Base URL — page param appended automatically: `url?page=N` */
@@ -449,7 +449,7 @@ interface TableProps<T> {
     /** When provided, appends an Actions column with View / Edit / Delete buttons */
     defaultActions?: DefaultActionsConfig<T>;
     /** Pass the serverPagination object from useServerTable to enable server-side pagination */
-    serverPagination?: ServerPaginationProp;
+    serverPagination?: ServerPaginationProp | null;
     className?: string;
 }
 declare function Table<T extends Record<string, any>>({ data, columns, searchable, searchPlaceholder, pagination, itemsPerPage, selectable, onBulkDelete, idKey, defaultActions, serverPagination, className, }: TableProps<T>): react_jsx_runtime.JSX.Element;

package/dist/index.global.js

@@ -61433,7 +61433,19 @@ ${n2.shaderPreludeCode.vertexSource}`, define: n2.shaderDefine }, defaultProject
       axios_default.get(url2, { params: { ...params, page: currentPage } }).then(({ data: res }) => {
         if (cancelled) return;
         setData(res.data);
-        setPagination(res.pagination);
+        const rawTotal = res.total;
+        const rawPerPage = res.per_page;
+        const lastPage = Math.ceil(rawTotal / rawPerPage);
+        const pg = res.pagination ?? {
+          first_page_url: res.first_page_url ?? `${url2}?page=1`,
+          last_page_url: res.last_page_url ?? `${url2}?page=${lastPage}`,
+          next_page_url: res.next_page_url !== void 0 ? res.next_page_url : currentPage < lastPage ? `${url2}?page=${currentPage + 1}` : null,
+          prev_page_url: res.prev_page_url !== void 0 ? res.prev_page_url : currentPage > 1 ? `${url2}?page=${currentPage - 1}` : null,
+          per_page: rawPerPage,
+          total: rawTotal,
+          links: res.links ?? []
+        };
+        setPagination(pg);
         if (res.data.length > 0) {
           setColumns(
             Object.keys(res.data[0]).map((key) => ({
@@ -61933,45 +61945,52 @@ ${n2.shaderPreludeCode.vertexSource}`, define: n2.shaderDefine }, defaultProject
           onPageChange: setPage
         }
       ),
-      serverPagination && /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex items-center justify-between gap-2 flex-wrap", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("span", { className: "text-xs text-muted-foreground", children: [
-          serverPagination.pagination.total,
-          " total rows \xB7 page ",
-          serverPagination.currentPage
-        ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex items-center gap-1", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
-            "button",
-            {
-              onClick: () => serverPagination.goToPage(serverPagination.currentPage - 1),
-              disabled: !serverPagination.pagination.prev_page_url,
-              className: "flex h-8 w-8 items-center justify-center rounded-lg border border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none",
-              children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ChevronLeft, { className: "h-4 w-4" })
-            }
-          ),
-          serverPagination.pagination.links.map((link) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
-            "button",
-            {
-              onClick: () => serverPagination.goToPage(link.page),
-              className: cn(
-                "flex h-8 w-8 items-center justify-center rounded-lg border text-xs font-medium transition-colors",
-                link.active ? "border-primary bg-primary text-primary-foreground shadow-sm" : "border-border text-muted-foreground hover:bg-muted hover:text-foreground"
-              ),
-              children: link.page
-            },
-            link.page
-          )),
-          /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
-            "button",
-            {
-              onClick: () => serverPagination.goToPage(serverPagination.currentPage + 1),
-              disabled: !serverPagination.pagination.next_page_url,
-              className: "flex h-8 w-8 items-center justify-center rounded-lg border border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none",
-              children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ChevronRight, { className: "h-4 w-4" })
-            }
-          )
-        ] })
-      ] }),
+      serverPagination && (() => {
+        const { pagination, currentPage: cp, goToPage } = serverPagination;
+        const totalServerPages = Math.ceil(pagination.total / pagination.per_page);
+        const pageLinks = Array.from({ length: totalServerPages }, (_, i) => i + 1);
+        return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex items-center justify-between gap-2 flex-wrap", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("span", { className: "text-xs text-muted-foreground", children: [
+            pagination.total,
+            " total rows \xB7 page ",
+            cp,
+            " of ",
+            totalServerPages
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex items-center gap-1", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+              "button",
+              {
+                onClick: () => goToPage(cp - 1),
+                disabled: !pagination.prev_page_url,
+                className: "flex h-8 w-8 items-center justify-center rounded-lg border border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none",
+                children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ChevronLeft, { className: "h-4 w-4" })
+              }
+            ),
+            pageLinks.map((p) => /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+              "button",
+              {
+                onClick: () => goToPage(p),
+                className: cn(
+                  "flex h-8 w-8 items-center justify-center rounded-lg border text-xs font-medium transition-colors",
+                  p === cp ? "border-primary bg-primary text-primary-foreground shadow-sm" : "border-border text-muted-foreground hover:bg-muted hover:text-foreground"
+                ),
+                children: p
+              },
+              p
+            )),
+            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+              "button",
+              {
+                onClick: () => goToPage(cp + 1),
+                disabled: !pagination.next_page_url,
+                className: "flex h-8 w-8 items-center justify-center rounded-lg border border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none",
+                children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(ChevronRight, { className: "h-4 w-4" })
+              }
+            )
+          ] })
+        ] });
+      })(),
       defaultActions && viewItem && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(DGViewModal, { item: viewItem, fields: viewFields, onClose: () => setViewItem(null) }),
       defaultActions && editItem && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
         DGEditModal,
@@ -66470,7 +66489,19 @@ ${n2.shaderPreludeCode.vertexSource}`, define: n2.shaderDefine }, defaultProject
       }).then(({ data: res }) => {
         if (cancelled) return;
         setData(res.data);
-        setPagination(res.pagination);
+        const rawTotal = res.total;
+        const rawPerPage = res.per_page;
+        const lastPage = Math.ceil(rawTotal / rawPerPage);
+        const pg = res.pagination ?? {
+          first_page_url: res.first_page_url ?? `${url2}?page=1`,
+          last_page_url: res.last_page_url ?? `${url2}?page=${lastPage}`,
+          next_page_url: res.next_page_url !== void 0 ? res.next_page_url : currentPage < lastPage ? `${url2}?page=${currentPage + 1}` : null,
+          prev_page_url: res.prev_page_url !== void 0 ? res.prev_page_url : currentPage > 1 ? `${url2}?page=${currentPage - 1}` : null,
+          per_page: rawPerPage,
+          total: rawTotal,
+          links: res.links ?? []
+        };
+        setPagination(pg);
         if (res.data.length > 0) {
           setColumns(
             Object.keys(res.data[0]).map((key) => ({
@@ -67131,45 +67162,52 @@ ${n2.shaderPreludeCode.vertexSource}`, define: n2.shaderDefine }, defaultProject
             )
           ] })
         ] }),
-        serverPagination && /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "flex items-center justify-between gap-2 flex-wrap", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("span", { className: "text-xs text-muted-foreground", children: [
-            serverPagination.pagination.total,
-            " total rows \xB7 page ",
-            serverPagination.currentPage
-          ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "flex items-center gap-1", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
-              "button",
-              {
-                onClick: () => serverPagination.goToPage(serverPagination.currentPage - 1),
-                disabled: !serverPagination.pagination.prev_page_url,
-                className: "flex h-8 w-8 items-center justify-center rounded-lg border border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none",
-                children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(ChevronLeft, { className: "h-4 w-4" })
-              }
-            ),
-            serverPagination.pagination.links.map((link) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
-              "button",
-              {
-                onClick: () => serverPagination.goToPage(link.page),
-                className: cn(
-                  "flex h-8 w-8 items-center justify-center rounded-lg border text-xs font-medium transition-colors",
-                  link.active ? "border-primary bg-primary text-primary-foreground shadow-sm" : "border-border text-muted-foreground hover:bg-muted hover:text-foreground"
-                ),
-                children: link.page
-              },
-              link.page
-            )),
-            /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
-              "button",
-              {
-                onClick: () => serverPagination.goToPage(serverPagination.currentPage + 1),
-                disabled: !serverPagination.pagination.next_page_url,
-                className: "flex h-8 w-8 items-center justify-center rounded-lg border border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none",
-                children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(ChevronRight, { className: "h-4 w-4" })
-              }
-            )
-          ] })
-        ] })
+        serverPagination && (() => {
+          const { pagination: pagination2, currentPage: cp, goToPage } = serverPagination;
+          const totalServerPages = Math.ceil(pagination2.total / pagination2.per_page);
+          const pageLinks = Array.from({ length: totalServerPages }, (_, i) => i + 1);
+          return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "flex items-center justify-between gap-2 flex-wrap", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("span", { className: "text-xs text-muted-foreground", children: [
+              pagination2.total,
+              " total rows \xB7 page ",
+              cp,
+              " of ",
+              totalServerPages
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "flex items-center gap-1", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+                "button",
+                {
+                  onClick: () => goToPage(cp - 1),
+                  disabled: !pagination2.prev_page_url,
+                  className: "flex h-8 w-8 items-center justify-center rounded-lg border border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none",
+                  children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(ChevronLeft, { className: "h-4 w-4" })
+                }
+              ),
+              pageLinks.map((p) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+                "button",
+                {
+                  onClick: () => goToPage(p),
+                  className: cn(
+                    "flex h-8 w-8 items-center justify-center rounded-lg border text-xs font-medium transition-colors",
+                    p === cp ? "border-primary bg-primary text-primary-foreground shadow-sm" : "border-border text-muted-foreground hover:bg-muted hover:text-foreground"
+                  ),
+                  children: p
+                },
+                p
+              )),
+              /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+                "button",
+                {
+                  onClick: () => goToPage(cp + 1),
+                  disabled: !pagination2.next_page_url,
+                  className: "flex h-8 w-8 items-center justify-center rounded-lg border border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none",
+                  children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(ChevronRight, { className: "h-4 w-4" })
+                }
+              )
+            ] })
+          ] });
+        })()
       ] }),
       defaultActions && viewItem && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
         ViewModal,

package/dist/index.js

@@ -4744,7 +4744,19 @@ function useServerDataGrid({ url, params }) {
     axios.get(url, { params: { ...params, page: currentPage } }).then(({ data: res }) => {
       if (cancelled) return;
       setData(res.data);
-      setPagination(res.pagination);
+      const rawTotal = res.total;
+      const rawPerPage = res.per_page;
+      const lastPage = Math.ceil(rawTotal / rawPerPage);
+      const pg = res.pagination ?? {
+        first_page_url: res.first_page_url ?? `${url}?page=1`,
+        last_page_url: res.last_page_url ?? `${url}?page=${lastPage}`,
+        next_page_url: res.next_page_url !== void 0 ? res.next_page_url : currentPage < lastPage ? `${url}?page=${currentPage + 1}` : null,
+        prev_page_url: res.prev_page_url !== void 0 ? res.prev_page_url : currentPage > 1 ? `${url}?page=${currentPage - 1}` : null,
+        per_page: rawPerPage,
+        total: rawTotal,
+        links: res.links ?? []
+      };
+      setPagination(pg);
       if (res.data.length > 0) {
         setColumns(
           Object.keys(res.data[0]).map((key) => ({
@@ -5244,45 +5256,52 @@ function DataGrid({
         onPageChange: setPage
       }
     ),
-    serverPagination && /* @__PURE__ */ jsxs27("div", { className: "flex items-center justify-between gap-2 flex-wrap", children: [
-      /* @__PURE__ */ jsxs27("span", { className: "text-xs text-muted-foreground", children: [
-        serverPagination.pagination.total,
-        " total rows \xB7 page ",
-        serverPagination.currentPage
-      ] }),
-      /* @__PURE__ */ jsxs27("div", { className: "flex items-center gap-1", children: [
-        /* @__PURE__ */ jsx28(
-          "button",
-          {
-            onClick: () => serverPagination.goToPage(serverPagination.currentPage - 1),
-            disabled: !serverPagination.pagination.prev_page_url,
-            className: "flex h-8 w-8 items-center justify-center rounded-lg border border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none",
-            children: /* @__PURE__ */ jsx28(ChevronLeft5, { className: "h-4 w-4" })
-          }
-        ),
-        serverPagination.pagination.links.map((link) => /* @__PURE__ */ jsx28(
-          "button",
-          {
-            onClick: () => serverPagination.goToPage(link.page),
-            className: cn(
-              "flex h-8 w-8 items-center justify-center rounded-lg border text-xs font-medium transition-colors",
-              link.active ? "border-primary bg-primary text-primary-foreground shadow-sm" : "border-border text-muted-foreground hover:bg-muted hover:text-foreground"
-            ),
-            children: link.page
-          },
-          link.page
-        )),
-        /* @__PURE__ */ jsx28(
-          "button",
-          {
-            onClick: () => serverPagination.goToPage(serverPagination.currentPage + 1),
-            disabled: !serverPagination.pagination.next_page_url,
-            className: "flex h-8 w-8 items-center justify-center rounded-lg border border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none",
-            children: /* @__PURE__ */ jsx28(ChevronRight7, { className: "h-4 w-4" })
-          }
-        )
-      ] })
-    ] }),
+    serverPagination && (() => {
+      const { pagination, currentPage: cp, goToPage } = serverPagination;
+      const totalServerPages = Math.ceil(pagination.total / pagination.per_page);
+      const pageLinks = Array.from({ length: totalServerPages }, (_, i) => i + 1);
+      return /* @__PURE__ */ jsxs27("div", { className: "flex items-center justify-between gap-2 flex-wrap", children: [
+        /* @__PURE__ */ jsxs27("span", { className: "text-xs text-muted-foreground", children: [
+          pagination.total,
+          " total rows \xB7 page ",
+          cp,
+          " of ",
+          totalServerPages
+        ] }),
+        /* @__PURE__ */ jsxs27("div", { className: "flex items-center gap-1", children: [
+          /* @__PURE__ */ jsx28(
+            "button",
+            {
+              onClick: () => goToPage(cp - 1),
+              disabled: !pagination.prev_page_url,
+              className: "flex h-8 w-8 items-center justify-center rounded-lg border border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none",
+              children: /* @__PURE__ */ jsx28(ChevronLeft5, { className: "h-4 w-4" })
+            }
+          ),
+          pageLinks.map((p) => /* @__PURE__ */ jsx28(
+            "button",
+            {
+              onClick: () => goToPage(p),
+              className: cn(
+                "flex h-8 w-8 items-center justify-center rounded-lg border text-xs font-medium transition-colors",
+                p === cp ? "border-primary bg-primary text-primary-foreground shadow-sm" : "border-border text-muted-foreground hover:bg-muted hover:text-foreground"
+              ),
+              children: p
+            },
+            p
+          )),
+          /* @__PURE__ */ jsx28(
+            "button",
+            {
+              onClick: () => goToPage(cp + 1),
+              disabled: !pagination.next_page_url,
+              className: "flex h-8 w-8 items-center justify-center rounded-lg border border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none",
+              children: /* @__PURE__ */ jsx28(ChevronRight7, { className: "h-4 w-4" })
+            }
+          )
+        ] })
+      ] });
+    })(),
     defaultActions && viewItem && /* @__PURE__ */ jsx28(DGViewModal, { item: viewItem, fields: viewFields, onClose: () => setViewItem(null) }),
     defaultActions && editItem && /* @__PURE__ */ jsx28(
       DGEditModal,
@@ -9370,7 +9389,19 @@ function useServerTable({ url, params }) {
     }).then(({ data: res }) => {
       if (cancelled) return;
       setData(res.data);
-      setPagination(res.pagination);
+      const rawTotal = res.total;
+      const rawPerPage = res.per_page;
+      const lastPage = Math.ceil(rawTotal / rawPerPage);
+      const pg = res.pagination ?? {
+        first_page_url: res.first_page_url ?? `${url}?page=1`,
+        last_page_url: res.last_page_url ?? `${url}?page=${lastPage}`,
+        next_page_url: res.next_page_url !== void 0 ? res.next_page_url : currentPage < lastPage ? `${url}?page=${currentPage + 1}` : null,
+        prev_page_url: res.prev_page_url !== void 0 ? res.prev_page_url : currentPage > 1 ? `${url}?page=${currentPage - 1}` : null,
+        per_page: rawPerPage,
+        total: rawTotal,
+        links: res.links ?? []
+      };
+      setPagination(pg);
       if (res.data.length > 0) {
         setColumns(
           Object.keys(res.data[0]).map((key) => ({
@@ -10031,45 +10062,52 @@ function Table({
           )
         ] })
       ] }),
-      serverPagination && /* @__PURE__ */ jsxs48("div", { className: "flex items-center justify-between gap-2 flex-wrap", children: [
-        /* @__PURE__ */ jsxs48("span", { className: "text-xs text-muted-foreground", children: [
-          serverPagination.pagination.total,
-          " total rows \xB7 page ",
-          serverPagination.currentPage
-        ] }),
-        /* @__PURE__ */ jsxs48("div", { className: "flex items-center gap-1", children: [
-          /* @__PURE__ */ jsx55(
-            "button",
-            {
-              onClick: () => serverPagination.goToPage(serverPagination.currentPage - 1),
-              disabled: !serverPagination.pagination.prev_page_url,
-              className: "flex h-8 w-8 items-center justify-center rounded-lg border border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none",
-              children: /* @__PURE__ */ jsx55(ChevronLeft6, { className: "h-4 w-4" })
-            }
-          ),
-          serverPagination.pagination.links.map((link) => /* @__PURE__ */ jsx55(
-            "button",
-            {
-              onClick: () => serverPagination.goToPage(link.page),
-              className: cn(
-                "flex h-8 w-8 items-center justify-center rounded-lg border text-xs font-medium transition-colors",
-                link.active ? "border-primary bg-primary text-primary-foreground shadow-sm" : "border-border text-muted-foreground hover:bg-muted hover:text-foreground"
-              ),
-              children: link.page
-            },
-            link.page
-          )),
-          /* @__PURE__ */ jsx55(
-            "button",
-            {
-              onClick: () => serverPagination.goToPage(serverPagination.currentPage + 1),
-              disabled: !serverPagination.pagination.next_page_url,
-              className: "flex h-8 w-8 items-center justify-center rounded-lg border border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none",
-              children: /* @__PURE__ */ jsx55(ChevronRight9, { className: "h-4 w-4" })
-            }
-          )
-        ] })
-      ] })
+      serverPagination && (() => {
+        const { pagination: pagination2, currentPage: cp, goToPage } = serverPagination;
+        const totalServerPages = Math.ceil(pagination2.total / pagination2.per_page);
+        const pageLinks = Array.from({ length: totalServerPages }, (_, i) => i + 1);
+        return /* @__PURE__ */ jsxs48("div", { className: "flex items-center justify-between gap-2 flex-wrap", children: [
+          /* @__PURE__ */ jsxs48("span", { className: "text-xs text-muted-foreground", children: [
+            pagination2.total,
+            " total rows \xB7 page ",
+            cp,
+            " of ",
+            totalServerPages
+          ] }),
+          /* @__PURE__ */ jsxs48("div", { className: "flex items-center gap-1", children: [
+            /* @__PURE__ */ jsx55(
+              "button",
+              {
+                onClick: () => goToPage(cp - 1),
+                disabled: !pagination2.prev_page_url,
+                className: "flex h-8 w-8 items-center justify-center rounded-lg border border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none",
+                children: /* @__PURE__ */ jsx55(ChevronLeft6, { className: "h-4 w-4" })
+              }
+            ),
+            pageLinks.map((p) => /* @__PURE__ */ jsx55(
+              "button",
+              {
+                onClick: () => goToPage(p),
+                className: cn(
+                  "flex h-8 w-8 items-center justify-center rounded-lg border text-xs font-medium transition-colors",
+                  p === cp ? "border-primary bg-primary text-primary-foreground shadow-sm" : "border-border text-muted-foreground hover:bg-muted hover:text-foreground"
+                ),
+                children: p
+              },
+              p
+            )),
+            /* @__PURE__ */ jsx55(
+              "button",
+              {
+                onClick: () => goToPage(cp + 1),
+                disabled: !pagination2.next_page_url,
+                className: "flex h-8 w-8 items-center justify-center rounded-lg border border-border text-muted-foreground transition-colors hover:bg-muted hover:text-foreground disabled:opacity-40 disabled:pointer-events-none",
+                children: /* @__PURE__ */ jsx55(ChevronRight9, { className: "h-4 w-4" })
+              }
+            )
+          ] })
+        ] });
+      })()
     ] }),
     defaultActions && viewItem && /* @__PURE__ */ jsx55(
       ViewModal,

package/package.json

@@ -4,7 +4,7 @@
     "registry": "https://registry.npmjs.org/",
     "access": "public"
   },
-  "version": "3.0.6",
+  "version": "3.0.8",
   "description": "Reusable React UI components",
   "license": "MIT",
   "main": "dist/index.js",