@farmzone/fz-react-ui 1.0.15 → 1.0.16

package/dist/index.d.cts

@@ -331,7 +331,7 @@ interface PaginationProps {
     onPageChange?: (page: number) => void;
     showTotalCount?: boolean;
 }
-declare function Pagination(props: PaginationProps): react.JSX.Element | null;
+declare function Pagination(props: PaginationProps): react.JSX.Element;
 
 type BreadCrumbItem = {
     label: string;

package/dist/index.d.ts

@@ -331,7 +331,7 @@ interface PaginationProps {
     onPageChange?: (page: number) => void;
     showTotalCount?: boolean;
 }
-declare function Pagination(props: PaginationProps): react.JSX.Element | null;
+declare function Pagination(props: PaginationProps): react.JSX.Element;
 
 type BreadCrumbItem = {
     label: string;

package/dist/index.js

@@ -1397,7 +1397,8 @@ function getVisiblePageRange(currentPage, totalPages) {
   return { start, end };
 }
 function Pagination(props) {
-  const { page = 0, totalPages = 50, onPageChange } = props;
+  const { page = 0, totalPages: rawTotalPages = 0, onPageChange } = props;
+  const totalPages = Math.max(1, rawTotalPages);
   const [displayPage, setDisplayPage] = useState(page);
   useEffect(() => {
     setDisplayPage(page);
@@ -1409,6 +1410,7 @@ function Pagination(props) {
     },
     [onPageChange]
   );
+  const isEmpty = rawTotalPages === 0;
   const pageButtons = useMemo(() => {
     const { start, end } = getVisiblePageRange(displayPage, totalPages);
     const buttons = [];
@@ -1420,9 +1422,10 @@ function Pagination(props) {
           "button",
           {
             type: "button",
+            disabled: isEmpty,
             className: cn(
-              "min-w-7 min-h-7 rounded-[4px] text-[14px] px-[5px] font-medium cursor-pointer",
-              isActive ? "bg-[#2675e2] text-white font-bold" : "bg-white text-[#000000] font-normal hover:bg-gray-50"
+              "min-w-7 min-h-7 rounded-[4px] text-[14px] px-[5px] font-medium",
+              isEmpty ? "bg-[#2675e2] text-white font-bold cursor-default" : isActive ? "bg-[#2675e2] text-white font-bold cursor-pointer" : "bg-white text-[#000000] font-normal hover:bg-gray-50 cursor-pointer"
             ),
             onClick: () => handlePageChange(pageIndex),
             children: displayPageNumber
@@ -1432,7 +1435,7 @@ function Pagination(props) {
       );
     }
     return buttons;
-  }, [displayPage, totalPages, handlePageChange]);
+  }, [displayPage, totalPages, handlePageChange, isEmpty]);
   const isFirstDisabled = displayPage <= 0;
   const isPreviousDisabled = displayPage <= 0;
   const isNextDisabled = displayPage >= totalPages - 1;
@@ -1452,9 +1455,6 @@ function Pagination(props) {
       children
     }
   );
-  if (!totalPages || totalPages === 0) {
-    return null;
-  }
   return /* @__PURE__ */ jsxs("div", { className: "flex flex-row items-center gap-1.5", children: [
     renderNavButton(
       () => handlePageChange(0),
@@ -2794,7 +2794,7 @@ function DatePickerSingle(props) {
         "div",
         {
           role: "button",
-          tabIndex: disabled ? -1 : 0,
+          tabIndex: -1,
           "aria-hidden": disabled,
           onClick: () => {
             if (!disabled) toggleCalendar(inputValue);
@@ -5228,7 +5228,7 @@ function Table(props) {
         ] })
       }
     ),
-    !showEmpty && !showSkeleton && (paginationInfo || renderFooter?.renderLeft || renderFooter?.renderRight) && /* @__PURE__ */ jsx("div", { ref: footerRef, children: /* @__PURE__ */ jsx(
+    !showSkeleton && (paginationInfo || renderFooter?.renderLeft || renderFooter?.renderRight) && /* @__PURE__ */ jsx("div", { ref: footerRef, children: /* @__PURE__ */ jsx(
       TableFooter,
       {
         paginationInfo,