@eztrak/shared 0.4.1 → 0.4.6

package/dist/chunk-5OG22DIX.mjs

@@ -0,0 +1,82 @@
+// src/utils/cn.ts
+import clsx from "clsx";
+import { twMerge } from "tailwind-merge";
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+
+// src/utils/handleApiError.ts
+import toast from "react-hot-toast";
+import Swal from "sweetalert2";
+function formatValidationErrorsHtml(errors) {
+  const items = Object.keys(errors).flatMap(
+    (field) => (errors[field] || []).map((msg) => `<li>${msg}</li>`)
+  );
+  return `
+        <div style="text-align:left">
+          <p>Please review and correct the following:</p>
+          <ul style="margin:8px 0 0 16px; list-style:disc;">
+            ${items.join("")}
+          </ul>
+        </div>
+      `;
+}
+function showValidationAlert(html) {
+  void Swal.fire({
+    title: "Validation errors",
+    html,
+    icon: "error",
+    confirmButtonText: "OK",
+    showCancelButton: false,
+    confirmButtonColor: "#FF7335"
+  });
+}
+function handleApiError(error, { showAlert = false, fallbackMessage } = {}) {
+  if (!error) return;
+  const status = error.status ?? error.originalStatus;
+  const data = error.data;
+  if (status === 200) {
+    return;
+  }
+  if (data?.errors && typeof data.errors === "object") {
+    const errors = data.errors;
+    if (showAlert) {
+      showValidationAlert(formatValidationErrorsHtml(errors));
+    } else {
+      Object.keys(errors).forEach((field) => {
+        (errors[field] || []).forEach((errorMessage) => {
+          toast.error(errorMessage);
+        });
+      });
+    }
+    return;
+  }
+  if (status === 404) {
+    return;
+  }
+  const message = fallbackMessage || data?.message || data?.title || error.error || "An error occurred. Please try again.";
+  toast.error(message);
+}
+function confirmationAlert(onConfirm, options = {}) {
+  void Swal.fire({
+    title: options.title ?? "Are you sure?",
+    text: options.text,
+    icon: options.icon ?? "warning",
+    showCancelButton: true,
+    confirmButtonText: options.confirmButtonText ?? "Yes",
+    cancelButtonText: options.cancelButtonText ?? "Cancel",
+    confirmButtonColor: "#FF7335"
+  }).then((result) => {
+    if (result.isConfirmed) {
+      onConfirm();
+    }
+  });
+}
+
+export {
+  cn,
+  formatValidationErrorsHtml,
+  handleApiError,
+  confirmationAlert
+};
+//# sourceMappingURL=chunk-5OG22DIX.mjs.map

package/dist/chunk-5OG22DIX.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/utils/cn.ts","../src/utils/handleApiError.ts"],"sourcesContent":["import clsx from \"clsx\";\r\nimport { twMerge } from \"tailwind-merge\";\r\n\r\nexport function cn(...inputs: Parameters<typeof clsx>) {\r\n  return twMerge(clsx(inputs));\r\n}\r\n","import toast from \"react-hot-toast\";\r\nimport Swal from \"sweetalert2\";\r\n\r\nexport type RtkQueryError = {\r\n  status?: number | string;\r\n  originalStatus?: number;\r\n  data?: {\r\n    errors?: Record<string, string[]>;\r\n    message?: string;\r\n    title?: string;\r\n  };\r\n  error?: string;\r\n};\r\n\r\nexport interface HandleApiErrorOptions {\r\n  showAlert?: boolean;\r\n  fallbackMessage?: string;\r\n}\r\n\r\nexport function formatValidationErrorsHtml(\r\n  errors: Record<string, string[]>\r\n): string {\r\n  const items = Object.keys(errors).flatMap((field) =>\r\n    (errors[field] || []).map((msg) => `<li>${msg}</li>`)\r\n  );\r\n  return `\r\n        <div style=\"text-align:left\">\r\n          <p>Please review and correct the following:</p>\r\n          <ul style=\"margin:8px 0 0 16px; list-style:disc;\">\r\n            ${items.join(\"\")}\r\n          </ul>\r\n        </div>\r\n      `;\r\n}\r\n\r\nfunction showValidationAlert(html: string): void {\r\n  void Swal.fire({\r\n    title: \"Validation errors\",\r\n    html,\r\n    icon: \"error\",\r\n    confirmButtonText: \"OK\",\r\n    showCancelButton: false,\r\n    confirmButtonColor: \"#FF7335\",\r\n  });\r\n}\r\n\r\n/** Handles RTK Query errors with built-in toast.error or SweetAlert (when showAlert is true). */\r\nexport function handleApiError(\r\n  error: RtkQueryError | null | undefined,\r\n  { showAlert = false, fallbackMessage }: HandleApiErrorOptions = {}\r\n): void {\r\n  if (!error) return;\r\n\r\n  const status = error.status ?? error.originalStatus;\r\n  const data = error.data;\r\n\r\n  if (status === 200) {\r\n    return;\r\n  }\r\n\r\n  if (data?.errors && typeof data.errors === \"object\") {\r\n    const errors = data.errors;\r\n\r\n    if (showAlert) {\r\n      showValidationAlert(formatValidationErrorsHtml(errors));\r\n    } else {\r\n      Object.keys(errors).forEach((field) => {\r\n        (errors[field] || []).forEach((errorMessage) => {\r\n          toast.error(errorMessage);\r\n        });\r\n      });\r\n    }\r\n    return;\r\n  }\r\n\r\n  if (status === 404) {\r\n    return;\r\n  }\r\n\r\n  const message =\r\n    fallbackMessage ||\r\n    data?.message ||\r\n    data?.title ||\r\n    error.error ||\r\n    \"An error occurred. Please try again.\";\r\n\r\n  toast.error(message);\r\n}\r\n\r\nexport interface ConfirmationAlertOptions {\r\n  title?: string;\r\n  text?: string;\r\n  icon?: \"warning\" | \"info\" | \"question\" | \"error\" | \"success\";\r\n  confirmButtonText?: string;\r\n  cancelButtonText?: string;\r\n}\r\n\r\nexport function confirmationAlert(\r\n  onConfirm: () => void,\r\n  options: ConfirmationAlertOptions = {}\r\n): void {\r\n  void Swal.fire({\r\n    title: options.title ?? \"Are you sure?\",\r\n    text: options.text,\r\n    icon: options.icon ?? \"warning\",\r\n    showCancelButton: true,\r\n    confirmButtonText: options.confirmButtonText ?? \"Yes\",\r\n    cancelButtonText: options.cancelButtonText ?? \"Cancel\",\r\n    confirmButtonColor: \"#FF7335\",\r\n  }).then((result) => {\r\n    if (result.isConfirmed) {\r\n      onConfirm();\r\n    }\r\n  });\r\n}\r\n"],"mappings":";AAAA,OAAO,UAAU;AACjB,SAAS,eAAe;AAEjB,SAAS,MAAM,QAAiC;AACrD,SAAO,QAAQ,KAAK,MAAM,CAAC;AAC7B;;;ACLA,OAAO,WAAW;AAClB,OAAO,UAAU;AAkBV,SAAS,2BACd,QACQ;AACR,QAAM,QAAQ,OAAO,KAAK,MAAM,EAAE;AAAA,IAAQ,CAAC,WACxC,OAAO,KAAK,KAAK,CAAC,GAAG,IAAI,CAAC,QAAQ,OAAO,GAAG,OAAO;AAAA,EACtD;AACA,SAAO;AAAA;AAAA;AAAA;AAAA,cAIK,MAAM,KAAK,EAAE,CAAC;AAAA;AAAA;AAAA;AAI5B;AAEA,SAAS,oBAAoB,MAAoB;AAC/C,OAAK,KAAK,KAAK;AAAA,IACb,OAAO;AAAA,IACP;AAAA,IACA,MAAM;AAAA,IACN,mBAAmB;AAAA,IACnB,kBAAkB;AAAA,IAClB,oBAAoB;AAAA,EACtB,CAAC;AACH;AAGO,SAAS,eACd,OACA,EAAE,YAAY,OAAO,gBAAgB,IAA2B,CAAC,GAC3D;AACN,MAAI,CAAC,MAAO;AAEZ,QAAM,SAAS,MAAM,UAAU,MAAM;AACrC,QAAM,OAAO,MAAM;AAEnB,MAAI,WAAW,KAAK;AAClB;AAAA,EACF;AAEA,MAAI,MAAM,UAAU,OAAO,KAAK,WAAW,UAAU;AACnD,UAAM,SAAS,KAAK;AAEpB,QAAI,WAAW;AACb,0BAAoB,2BAA2B,MAAM,CAAC;AAAA,IACxD,OAAO;AACL,aAAO,KAAK,MAAM,EAAE,QAAQ,CAAC,UAAU;AACrC,SAAC,OAAO,KAAK,KAAK,CAAC,GAAG,QAAQ,CAAC,iBAAiB;AAC9C,gBAAM,MAAM,YAAY;AAAA,QAC1B,CAAC;AAAA,MACH,CAAC;AAAA,IACH;AACA;AAAA,EACF;AAEA,MAAI,WAAW,KAAK;AAClB;AAAA,EACF;AAEA,QAAM,UACJ,mBACA,MAAM,WACN,MAAM,SACN,MAAM,SACN;AAEF,QAAM,MAAM,OAAO;AACrB;AAUO,SAAS,kBACd,WACA,UAAoC,CAAC,GAC/B;AACN,OAAK,KAAK,KAAK;AAAA,IACb,OAAO,QAAQ,SAAS;AAAA,IACxB,MAAM,QAAQ;AAAA,IACd,MAAM,QAAQ,QAAQ;AAAA,IACtB,kBAAkB;AAAA,IAClB,mBAAmB,QAAQ,qBAAqB;AAAA,IAChD,kBAAkB,QAAQ,oBAAoB;AAAA,IAC9C,oBAAoB;AAAA,EACtB,CAAC,EAAE,KAAK,CAAC,WAAW;AAClB,QAAI,OAAO,aAAa;AACtB,gBAAU;AAAA,IACZ;AAAA,EACF,CAAC;AACH;","names":[]}

package/dist/{chunk-AR7LUJY3.mjs → chunk-BZPURU6Q.mjs}

@@ -179,59 +179,6 @@ var getFieldsByInputType = (fields = [], key) => {
   return fields.filter(({ inputType = "" }) => inputType === key);
 };
 
-// src/utils/handleApiError.ts
-import toast from "react-hot-toast";
-import Swal from "sweetalert2";
-function formatValidationErrorsHtml(errors) {
-  const items = Object.keys(errors).flatMap(
-    (field) => (errors[field] || []).map((msg) => `<li>${msg}</li>`)
-  );
-  return `
-        <div style="text-align:left">
-          <p>Please review and correct the following:</p>
-          <ul style="margin:8px 0 0 16px; list-style:disc;">
-            ${items.join("")}
-          </ul>
-        </div>
-      `;
-}
-function showValidationAlert(html) {
-  void Swal.fire({
-    title: "Validation errors",
-    html,
-    icon: "error",
-    confirmButtonText: "OK",
-    showCancelButton: false,
-    confirmButtonColor: "#FF7335"
-  });
-}
-function handleApiError(error, { showAlert = false, fallbackMessage } = {}) {
-  if (!error) return;
-  const status = error.status ?? error.originalStatus;
-  const data = error.data;
-  if (status === 200) {
-    return;
-  }
-  if (data?.errors && typeof data.errors === "object") {
-    const errors = data.errors;
-    if (showAlert) {
-      showValidationAlert(formatValidationErrorsHtml(errors));
-    } else {
-      Object.keys(errors).forEach((field) => {
-        (errors[field] || []).forEach((errorMessage) => {
-          toast.error(errorMessage);
-        });
-      });
-    }
-    return;
-  }
-  if (status === 404) {
-    return;
-  }
-  const message = fallbackMessage || data?.message || data?.title || error.error || "An error occurred. Please try again.";
-  toast.error(message);
-}
-
 export {
   truncateText,
   getApiError,
@@ -252,8 +199,6 @@ export {
   deserializeJson,
   formatDateTime,
   removeByPropertyValues,
-  getFieldsByInputType,
-  formatValidationErrorsHtml,
-  handleApiError
+  getFieldsByInputType
 };
-//# sourceMappingURL=chunk-AR7LUJY3.mjs.map
+//# sourceMappingURL=chunk-BZPURU6Q.mjs.map

package/dist/chunk-BZPURU6Q.mjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/utils/helpers.ts"],"sourcesContent":["export const truncateText = (text: string | null | undefined, maxLength = 20) => {\n  if (!text) return \"\";\n  if (text.length <= maxLength) {\n    return text;\n  }\n  return text.slice(0, maxLength - 3) + \"...\";\n};\n\nexport function getApiError(apiError: unknown): string {\n  if (!apiError) return \"An unknown error occurred\";\n\n  if (typeof apiError === \"string\") {\n    return apiError;\n  }\n\n  const error = apiError as {\n    response?: { data?: Record<string, unknown> };\n    message?: string;\n  };\n\n  if (error.response?.data) {\n    const responseData = error.response.data;\n\n    if (typeof responseData === \"string\") {\n      return responseData;\n    }\n\n    const errors = responseData.errors;\n    if (errors && typeof errors === \"object\") {\n      for (const key in errors) {\n        const messages = (errors as Record<string, unknown>)[key];\n        if (Array.isArray(messages) && messages.length > 0) {\n          return String(messages[0]);\n        }\n      }\n    }\n\n    if (responseData.message) {\n      return String(responseData.message);\n    }\n\n    if (responseData.title) {\n      return String(responseData.title);\n    }\n  }\n\n  if (error.message) {\n    return error.message;\n  }\n\n  return \"An unknown error occurred\";\n}\n\nexport const normalizeApiListItems = (responseData: unknown): unknown[] => {\n  if (responseData == null) return [];\n  if (Array.isArray(responseData)) return responseData;\n\n  const record = responseData as Record<string, unknown>;\n  const data = record.data;\n\n  if (\n    data &&\n    typeof data === \"object\" &&\n    !Array.isArray(data) &&\n    Array.isArray((data as { items?: unknown[] }).items)\n  ) {\n    return (data as { items: unknown[] }).items;\n  }\n\n  const returnModel = record.returnModel as { items?: unknown[] } | undefined;\n  if (Array.isArray(returnModel?.items)) return returnModel.items;\n  if (Array.isArray(data)) return data;\n  if (typeof data === \"object\" && data !== null) {\n    return [data];\n  }\n  return [];\n};\n\nexport function capitalizeText(name: string | null | undefined): string {\n  if (!name) return \"\";\n  return name\n    .split(\" \")\n    .map((word) => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase())\n    .join(\" \");\n}\n\nexport function toLowerCaseText(text: string | null | undefined): string {\n  if (!text) return \"\";\n  return text.toLowerCase();\n}\n\nexport const formatDate = (dateString: string | null | undefined): string => {\n  if (dateString === null || dateString === undefined) return \"-\";\n  const date = new Date(dateString);\n\n  if (isNaN(date.getTime())) {\n    return dateString;\n  }\n\n  const month = (date.getMonth() + 1).toString().padStart(2, \"0\");\n  const day = date.getDate().toString().padStart(2, \"0\");\n  const year = date.getFullYear().toString().slice(-2);\n  return `${month}/${day}/${year}`;\n};\n\nexport const isEmpty = (obj: object): boolean => {\n  return Object.keys(obj).length === 0;\n};\n\nexport const toDateInputValue = (date: string | Date | null | undefined): string => {\n  if (!date) return \"\";\n\n  let d: Date;\n\n  if (typeof date === \"string\") {\n    if (/^\\d{4}-\\d{2}-\\d{2}$/.test(date)) {\n      return date;\n    }\n    d = new Date(date);\n  } else {\n    d = new Date(date);\n  }\n\n  if (isNaN(d.getTime())) return \"\";\n\n  const localDate = new Date(d.getTime() - d.getTimezoneOffset() * 60000);\n  const year = localDate.getFullYear();\n  const month = (localDate.getMonth() + 1).toString().padStart(2, \"0\");\n  const day = localDate.getDate().toString().padStart(2, \"0\");\n\n  return `${year}-${month}-${day}`;\n};\n\nexport function convertCommaDataToArray(data: string | null | undefined): string[] {\n  if (!data || data.trim() === \"\") {\n    return [];\n  }\n  return data.split(\",\").map((item) => item.trim());\n}\n\nexport function checkIfExistsInArray<T>(array: T[], searchValue: T): boolean {\n  return array.includes(searchValue);\n}\n\nexport const currencyFormatter = (value: number | null | undefined): string => {\n  return value?.toLocaleString(\"en-US\", {\n    style: \"currency\",\n    currency: \"USD\",\n  }) ?? \"\";\n};\n\nexport const parseCurrencyValueToNumber = (value: unknown): number => {\n  if (value == null || value === \"\") return 0;\n\n  const raw =\n    typeof value === \"object\" && value !== null && \"value\" in value\n      ? (value as { value: unknown }).value\n      : value;\n\n  const stringValue = raw == null || raw === \"\" ? \"\" : String(raw);\n  const numericValue = stringValue.replace(/[$,]/g, \"\");\n  return parseFloat(numericValue) || 0;\n};\n\nexport function flattenTableData<T extends Record<string, unknown>>(\n  data: T[] | null | undefined,\n  columns: { field?: string }[] | null | undefined\n): T[] {\n  if (!Array.isArray(data)) return [];\n  return data.map((row) => {\n    const flatRow = { ...row };\n    (columns ?? []).forEach((col) => {\n      const key = col.field;\n      if (!key) return;\n      if (key.includes(\".\")) {\n        const value = key.split(\".\").reduce<unknown>(\n          (acc, part) => (acc as Record<string, unknown> | undefined)?.[part],\n          row\n        );\n        (flatRow as Record<string, unknown>)[key] = value ?? \"\";\n      }\n    });\n    return flatRow;\n  });\n}\n\nexport const getErrorMessages = (error: {\n  data?: {\n    errors?: Record<string, string[]>;\n    title?: string;\n    error?: { name?: string[] };\n  };\n} | null | undefined): string => {\n  if (error?.data?.errors) {\n    return Object.values(error.data.errors).flat().join(\"\\n\");\n  }\n  return (\n    error?.data?.title ??\n    error?.data?.error?.name?.[0] ??\n    \"Failed to save\"\n  );\n};\n\nexport const getFieldsByCategory = <T extends { category?: string }>(\n  fields: T[] = [],\n  key: string\n): T[] => {\n  return fields?.filter(({ category = \"\" }) => category === key);\n};\n\nexport const getFieldsByName = <T extends { name?: string }>(\n  fields: T[] = [],\n  key: string\n): T[] => {\n  return fields.filter(({ name = \"\" }) => name === key);\n};\n\nexport const deserializeJson = <T = unknown>(jsonString: string): T | null => {\n  try {\n    return JSON.parse(jsonString) as T;\n  } catch (error) {\n    console.error(\"Error parsing JSON:\", error);\n    return null;\n  }\n};\n\nexport const formatDateTime = (dateString: string | null | undefined): string => {\n  if (!dateString) return \"Invalid Date\";\n  const date = new Date(dateString);\n  if (isNaN(date.getTime())) return \"Invalid Date\";\n  const options: Intl.DateTimeFormatOptions = {\n    year: \"numeric\",\n    month: \"numeric\",\n    day: \"numeric\",\n    hour: \"numeric\",\n    minute: \"numeric\",\n    hour12: true,\n  };\n  return date.toLocaleString(\"en-US\", options);\n};\n\nexport const removeByPropertyValues = <T extends Record<string, unknown>>(\n  items: T[] = [],\n  property: keyof T & string,\n  values: unknown[] = [],\n  { caseInsensitive = false }: { caseInsensitive?: boolean } = {}\n): T[] => {\n  if (!Array.isArray(items) || !property) return Array.isArray(items) ? items : [];\n  const normalize = (v: unknown) =>\n    caseInsensitive && typeof v === \"string\" ? v.toLowerCase() : v;\n  const valuesArr = Array.isArray(values) ? values : [values];\n  const toRemove = new Set(valuesArr.map(normalize));\n  return items.filter((item) => !toRemove.has(normalize(item?.[property])));\n};\n\nexport const getFieldsByInputType = <T extends { inputType?: string }>(\n  fields: T[] = [],\n  key: string\n): T[] => {\n  return fields.filter(({ inputType = \"\" }) => inputType === key);\n};\n"],"mappings":"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","names":[]}

package/dist/components/index.d.mts

@@ -39,4 +39,57 @@ type EztrakTabsProps = {
 
 declare function EztrakTabs({ tabs, activeTab, defaultTabId, onTabChange, showPanels, keepMounted, classNames, className, }: EztrakTabsProps): react.JSX.Element | null;
 
-export { type EztrakTab, EztrakTabs, type EztrakTabsClassNames, type EztrakTabsProps };
+interface PaginationData {
+    currentPage: number;
+    pageCount: number;
+    perPage: number;
+    totalCount: number;
+}
+interface CustomPaginationClassNames {
+    root?: string;
+    info?: string;
+    nav?: string;
+    pageButton?: string;
+    activePageButton?: string;
+    select?: string;
+}
+interface LayoutStatus {
+    isLayoutLoading?: boolean;
+    isLayoutSaving?: boolean;
+    isLayoutResetting?: boolean;
+}
+interface ResetColumnsButtonProps {
+    onReset: () => void;
+    disabled?: boolean;
+    isLoading?: boolean;
+}
+interface TableLayoutToolbarControlsProps {
+    layoutStatus?: LayoutStatus;
+    onResetLayout?: () => void;
+    renderResetControl?: (onReset: () => void) => ReactNode;
+    isLoading?: boolean;
+}
+interface CustomPaginationProps {
+    paginationData: PaginationData | null;
+    /** @deprecated Use pageSizeOptions instead */
+    paginationPageSize?: number[];
+    pageSizeOptions?: number[];
+    isLoading?: boolean;
+    paramNames?: {
+        page?: string;
+        perPage?: string;
+    };
+    onPageChange?: (page: number) => void;
+    onPageSizeChange?: (perPage: number) => void;
+    onResetLayout?: () => void;
+    renderResetControl?: (onReset: () => void) => ReactNode;
+    layoutStatus?: LayoutStatus;
+    classNames?: CustomPaginationClassNames;
+    className?: string;
+}
+
+declare function ResetColumnsButton({ onReset, disabled, isLoading, }: ResetColumnsButtonProps): react.JSX.Element;
+declare function TableLayoutToolbarControls({ layoutStatus, onResetLayout, renderResetControl, isLoading, }: TableLayoutToolbarControlsProps): react.JSX.Element;
+declare function CustomPagination({ paginationData, paginationPageSize, pageSizeOptions: pageSizeOptionsProp, isLoading, paramNames, onPageChange, onPageSizeChange, onResetLayout, renderResetControl, layoutStatus, classNames, className, }: CustomPaginationProps): react.JSX.Element;
+
+export { CustomPagination, type CustomPaginationClassNames, type CustomPaginationProps, type EztrakTab, EztrakTabs, type EztrakTabsClassNames, type EztrakTabsProps, type LayoutStatus, type PaginationData, ResetColumnsButton, type ResetColumnsButtonProps, TableLayoutToolbarControls, type TableLayoutToolbarControlsProps };

package/dist/components/index.d.ts

@@ -39,4 +39,57 @@ type EztrakTabsProps = {
 
 declare function EztrakTabs({ tabs, activeTab, defaultTabId, onTabChange, showPanels, keepMounted, classNames, className, }: EztrakTabsProps): react.JSX.Element | null;
 
-export { type EztrakTab, EztrakTabs, type EztrakTabsClassNames, type EztrakTabsProps };
+interface PaginationData {
+    currentPage: number;
+    pageCount: number;
+    perPage: number;
+    totalCount: number;
+}
+interface CustomPaginationClassNames {
+    root?: string;
+    info?: string;
+    nav?: string;
+    pageButton?: string;
+    activePageButton?: string;
+    select?: string;
+}
+interface LayoutStatus {
+    isLayoutLoading?: boolean;
+    isLayoutSaving?: boolean;
+    isLayoutResetting?: boolean;
+}
+interface ResetColumnsButtonProps {
+    onReset: () => void;
+    disabled?: boolean;
+    isLoading?: boolean;
+}
+interface TableLayoutToolbarControlsProps {
+    layoutStatus?: LayoutStatus;
+    onResetLayout?: () => void;
+    renderResetControl?: (onReset: () => void) => ReactNode;
+    isLoading?: boolean;
+}
+interface CustomPaginationProps {
+    paginationData: PaginationData | null;
+    /** @deprecated Use pageSizeOptions instead */
+    paginationPageSize?: number[];
+    pageSizeOptions?: number[];
+    isLoading?: boolean;
+    paramNames?: {
+        page?: string;
+        perPage?: string;
+    };
+    onPageChange?: (page: number) => void;
+    onPageSizeChange?: (perPage: number) => void;
+    onResetLayout?: () => void;
+    renderResetControl?: (onReset: () => void) => ReactNode;
+    layoutStatus?: LayoutStatus;
+    classNames?: CustomPaginationClassNames;
+    className?: string;
+}
+
+declare function ResetColumnsButton({ onReset, disabled, isLoading, }: ResetColumnsButtonProps): react.JSX.Element;
+declare function TableLayoutToolbarControls({ layoutStatus, onResetLayout, renderResetControl, isLoading, }: TableLayoutToolbarControlsProps): react.JSX.Element;
+declare function CustomPagination({ paginationData, paginationPageSize, pageSizeOptions: pageSizeOptionsProp, isLoading, paramNames, onPageChange, onPageSizeChange, onResetLayout, renderResetControl, layoutStatus, classNames, className, }: CustomPaginationProps): react.JSX.Element;
+
+export { CustomPagination, type CustomPaginationClassNames, type CustomPaginationProps, type EztrakTab, EztrakTabs, type EztrakTabsClassNames, type EztrakTabsProps, type LayoutStatus, type PaginationData, ResetColumnsButton, type ResetColumnsButtonProps, TableLayoutToolbarControls, type TableLayoutToolbarControlsProps };

package/dist/components/index.js

@@ -30,7 +30,10 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/components/index.ts
 var components_exports = {};
 __export(components_exports, {
-  EztrakTabs: () => EztrakTabs
+  CustomPagination: () => CustomPagination,
+  EztrakTabs: () => EztrakTabs,
+  ResetColumnsButton: () => ResetColumnsButton,
+  TableLayoutToolbarControls: () => TableLayoutToolbarControls
 });
 module.exports = __toCommonJS(components_exports);
 
@@ -248,8 +251,348 @@ function EztrakTabs({
     }) }) : null
   ] }) });
 }
+
+// src/components/pagination/CustomPagination.tsx
+var import_react_router_dom = require("react-router-dom");
+
+// src/utils/handleApiError.ts
+var import_react_hot_toast = __toESM(require("react-hot-toast"));
+var import_sweetalert2 = __toESM(require("sweetalert2"));
+function confirmationAlert(onConfirm, options = {}) {
+  void import_sweetalert2.default.fire({
+    title: options.title ?? "Are you sure?",
+    text: options.text,
+    icon: options.icon ?? "warning",
+    showCancelButton: true,
+    confirmButtonText: options.confirmButtonText ?? "Yes",
+    cancelButtonText: options.cancelButtonText ?? "Cancel",
+    confirmButtonColor: "#FF7335"
+  }).then((result) => {
+    if (result.isConfirmed) {
+      onConfirm();
+    }
+  });
+}
+
+// src/components/pagination/CustomPagination.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var DEFAULT_PAGE_SIZE_OPTIONS = [10, 20, 30, 50, 100];
+function padCount(num) {
+  return num.toString().padStart(2, "0");
+}
+function RefreshIcon({
+  size = 14,
+  className
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+    "svg",
+    {
+      width: size,
+      height: size,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      className,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M3 12a9 9 0 0 1 9-9 9.75 9.75 0 0 1 6.74 2.74L21 8" }),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M21 3v5h-5" }),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M21 12a9 9 0 0 1-9 9 9.75 9.75 0 0 1-6.74-2.74L3 16" }),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M8 16H3v5" })
+      ]
+    }
+  );
+}
+function ResetColumnsButton({
+  onReset,
+  disabled = false,
+  isLoading = false
+}) {
+  const handleClick = () => {
+    confirmationAlert(onReset, {
+      text: "Reset column order, widths, and visibility to defaults?",
+      icon: "warning",
+      title: "Reset column layout to default"
+    });
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+    "button",
+    {
+      type: "button",
+      onClick: handleClick,
+      disabled: disabled || isLoading,
+      title: "Reset column layout to default",
+      className: "inline-flex items-center gap-1.5 rounded-xl border border-primary-150 bg-white px-3 py-1.5 text-sm font-medium text-primary-150 hover:bg-gray-50 focus:outline-none disabled:hover:bg-white",
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(RefreshIcon, { size: 14, className: cn(isLoading ? "animate-spin" : "") }),
+        "Reset columns"
+      ]
+    }
+  );
+}
+function TableLayoutToolbarControls({
+  layoutStatus = {},
+  onResetLayout,
+  renderResetControl,
+  isLoading = false
+}) {
+  const { isLayoutLoading, isLayoutSaving, isLayoutResetting } = layoutStatus;
+  const isLayoutBusy = isLayoutLoading || isLayoutSaving || isLayoutResetting;
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "flex items-center gap-3", children: onResetLayout && (renderResetControl ? renderResetControl(onResetLayout) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    ResetColumnsButton,
+    {
+      onReset: onResetLayout,
+      disabled: isLayoutBusy,
+      isLoading
+    }
+  )) });
+}
+function CustomPagination({
+  paginationData,
+  paginationPageSize,
+  pageSizeOptions: pageSizeOptionsProp,
+  isLoading = false,
+  paramNames,
+  onPageChange,
+  onPageSizeChange,
+  onResetLayout,
+  renderResetControl,
+  layoutStatus,
+  classNames,
+  className
+}) {
+  const [searchParams, setSearchParams] = (0, import_react_router_dom.useSearchParams)();
+  const pageKey = paramNames?.page ?? "page";
+  const perPageKey = paramNames?.perPage ?? "perPage";
+  const pageSizeOptions = pageSizeOptionsProp ?? paginationPageSize ?? DEFAULT_PAGE_SIZE_OPTIONS;
+  const currentPage = paginationData ? Math.max(0, paginationData.currentPage - 1) : 0;
+  const handlePageChange = (pageNumber) => {
+    if (!paginationData || pageNumber < 0 || pageNumber >= paginationData.pageCount) {
+      return;
+    }
+    const safePage = Math.max(
+      1,
+      Math.min(pageNumber + 1, paginationData.pageCount)
+    );
+    const newParams = new URLSearchParams(searchParams);
+    newParams.set(pageKey, String(safePage));
+    setSearchParams(newParams, { replace: true });
+    onPageChange?.(safePage);
+  };
+  const handlePageSizeChange = (event) => {
+    const parsed = parseInt(event.target.value, 10);
+    if (!Number.isFinite(parsed) || parsed < 1) {
+      return;
+    }
+    const newParams = new URLSearchParams(searchParams);
+    newParams.set(pageKey, "1");
+    newParams.set(perPageKey, String(parsed));
+    setSearchParams(newParams, { replace: true });
+    onPageSizeChange?.(parsed);
+  };
+  const createPageButtons = () => {
+    const buttons = [];
+    const maxButtons = 5;
+    const totalPages = Math.max(1, paginationData?.pageCount ?? 1);
+    let startPage = Math.max(0, currentPage - Math.floor(maxButtons / 2));
+    let endPage = Math.min(totalPages - 1, startPage + maxButtons - 1);
+    if (endPage - startPage + 1 < maxButtons) {
+      startPage = Math.max(0, endPage - maxButtons + 1);
+    }
+    if (startPage > 0) {
+      buttons.push(
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+          "button",
+          {
+            type: "button",
+            onClick: () => handlePageChange(0),
+            "aria-label": "Page 1",
+            className: cn(
+              "px-3 py-2 text-sm text-gray-600 hover:text-blue-600 hover:bg-blue-50 rounded-md transition-colors",
+              classNames?.pageButton
+            ),
+            children: "1"
+          },
+          "1"
+        )
+      );
+      if (startPage > 1) {
+        buttons.push(
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+            "span",
+            {
+              "aria-hidden": "true",
+              className: "px-2 py-2 text-gray-400",
+              children: "..."
+            },
+            "ellipsis1"
+          )
+        );
+      }
+    }
+    for (let i = startPage; i <= endPage; i++) {
+      const isActive = currentPage === i;
+      buttons.push(
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+          "button",
+          {
+            type: "button",
+            onClick: () => handlePageChange(i),
+            "aria-label": `Page ${i + 1}`,
+            "aria-current": isActive ? "page" : void 0,
+            className: cn(
+              "px-3 py-2 text-sm rounded-md transition-colors",
+              isActive ? cn("bg-gray-400 text-white", classNames?.activePageButton) : cn(
+                "text-gray-600 hover:text-gray-600 hover:bg-gray-50",
+                classNames?.pageButton
+              )
+            ),
+            children: i + 1
+          },
+          i + 1
+        )
+      );
+    }
+    if (endPage < totalPages - 1) {
+      if (endPage < totalPages - 2) {
+        buttons.push(
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+            "span",
+            {
+              "aria-hidden": "true",
+              className: "px-2 py-2 text-gray-400",
+              children: "..."
+            },
+            "ellipsis2"
+          )
+        );
+      }
+      buttons.push(
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+          "button",
+          {
+            type: "button",
+            onClick: () => handlePageChange(totalPages - 1),
+            "aria-label": `Page ${totalPages}`,
+            className: cn(
+              "px-3 py-2 text-sm text-gray-600 hover:text-gray-600 hover:bg-gray-50 rounded-md transition-colors",
+              classNames?.pageButton
+            ),
+            children: totalPages
+          },
+          totalPages
+        )
+      );
+    }
+    return buttons;
+  };
+  if (isLoading || !paginationData) {
+    return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "flex items-center justify-center p-6 bg-gray-50", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "text-gray-500", children: isLoading ? "Loading..." : "No pagination data" }) });
+  }
+  const effectiveSizeOptions = pageSizeOptions.includes(paginationData.perPage) ? pageSizeOptions : [...pageSizeOptions, paginationData.perPage].sort((a, b) => a - b);
+  const startItem = paginationData.totalCount === 0 ? 0 : (paginationData.currentPage - 1) * paginationData.perPage + 1;
+  const endItem = Math.min(
+    startItem + paginationData.perPage - 1,
+    paginationData.totalCount
+  );
+  const { isLayoutLoading, isLayoutSaving, isLayoutResetting } = layoutStatus ?? {};
+  const isLayoutBusy = isLayoutLoading || isLayoutSaving || isLayoutResetting;
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+    "div",
+    {
+      className: cn(
+        "flex items-center justify-between pb-4",
+        className,
+        classNames?.root
+      ),
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: cn("flex-1", classNames?.info), children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("span", { className: "text-xs font-medium text-neutral-400", children: [
+          "Showing ",
+          padCount(startItem),
+          " - ",
+          padCount(endItem),
+          " of",
+          " ",
+          paginationData.totalCount ?? 0,
+          " results"
+        ] }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+          "nav",
+          {
+            "aria-label": "Pagination",
+            className: cn("flex items-center space-x-1", classNames?.nav),
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => handlePageChange(currentPage - 1),
+                  disabled: currentPage === 0,
+                  className: "p-2 text-gray-400 hover:text-gray-600 disabled:opacity-30 disabled:cursor-not-allowed transition-colors",
+                  "aria-label": "Previous page",
+                  children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M10.7 2.3a1 1 0 0 1 0 1.4L6.4 8l4.3 4.3a1 1 0 1 1-1.4 1.4l-5-5a1 1 0 0 1 0-1.4l5-5a1 1 0 0 1 1.4 0z" }) })
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "flex items-center space-x-1", children: createPageButtons() }),
+              /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => handlePageChange(currentPage + 1),
+                  disabled: currentPage >= paginationData.pageCount - 1,
+                  className: "p-2 text-gray-400 hover:text-gray-600 disabled:opacity-30 disabled:cursor-not-allowed transition-colors",
+                  "aria-label": "Next page",
+                  children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M5.3 13.7a1 1 0 0 1 0-1.4L9.6 8 5.3 3.7a1 1 0 0 1 1.4-1.4l5 5a1 1 0 0 1 0 1.4l-5 5a1 1 0 0 1-1.4 0z" }) })
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("div", { className: "flex-1 flex justify-end", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "flex items-center gap-3", children: [
+          onResetLayout && (renderResetControl ? renderResetControl(onResetLayout) : /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+            ResetColumnsButton,
+            {
+              onReset: onResetLayout,
+              disabled: isLayoutBusy,
+              isLoading
+            }
+          )),
+          /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "flex items-center space-x-2", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+              "label",
+              {
+                htmlFor: "pagination-per-page",
+                className: "text-sm text-gray-600",
+                children: "Items per page"
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+              "select",
+              {
+                id: "pagination-per-page",
+                value: paginationData.perPage || 10,
+                onChange: handlePageSizeChange,
+                className: cn(
+                  "px-3 py-1.5 text-sm border border-gray-300 rounded-md bg-white text-gray-700 hover:border-gray-400 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500 transition-colors",
+                  classNames?.select
+                ),
+                children: effectiveSizeOptions.map((option) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("option", { value: option, children: option }, option))
+              }
+            )
+          ] })
+        ] }) })
+      ]
+    }
+  );
+}
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  EztrakTabs
+  CustomPagination,
+  EztrakTabs,
+  ResetColumnsButton,
+  TableLayoutToolbarControls
 });
 //# sourceMappingURL=index.js.map