@agentpaid/paid-nextjs-client 0.3.0-test.1 → 0.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (38) hide show
  1. package/README.md +246 -72
  2. package/dist/components/PaidActivityLog.d.ts +11 -24
  3. package/dist/components/PaidActivityLog.d.ts.map +1 -1
  4. package/dist/components/PaidActivityLog.js +53 -26
  5. package/dist/components/PaidActivityLog.js.map +1 -1
  6. package/dist/components/PaidContainer.d.ts +11 -24
  7. package/dist/components/PaidContainer.d.ts.map +1 -1
  8. package/dist/components/PaidContainer.js +18 -9
  9. package/dist/components/PaidContainer.js.map +1 -1
  10. package/dist/components/PaidInvoiceTable.d.ts +11 -24
  11. package/dist/components/PaidInvoiceTable.d.ts.map +1 -1
  12. package/dist/components/PaidInvoiceTable.js +57 -30
  13. package/dist/components/PaidInvoiceTable.js.map +1 -1
  14. package/dist/components/PaidPaymentsTable.d.ts +11 -24
  15. package/dist/components/PaidPaymentsTable.d.ts.map +1 -1
  16. package/dist/components/PaidPaymentsTable.js +58 -28
  17. package/dist/components/PaidPaymentsTable.js.map +1 -1
  18. package/dist/components/components/PaidActivityLog.js +98 -57
  19. package/dist/components/components/PaidContainer.js +42 -32
  20. package/dist/components/components/PaidInvoiceTable.js +103 -86
  21. package/dist/components/components/PaidPaymentsTable.js +107 -69
  22. package/dist/components/components/ui/Pagination.js +168 -0
  23. package/dist/components/ui/Pagination.d.ts +10 -0
  24. package/dist/components/ui/Pagination.d.ts.map +1 -0
  25. package/dist/components/ui/Pagination.js +111 -0
  26. package/dist/components/ui/Pagination.js.map +1 -0
  27. package/dist/index.d.ts +3 -1
  28. package/dist/index.d.ts.map +1 -1
  29. package/dist/index.js +3 -1
  30. package/dist/index.js.map +1 -1
  31. package/dist/styles/activity-log-table.css +94 -78
  32. package/dist/styles/paid-container.css +25 -16
  33. package/dist/styles/paid-invoice-table.css +135 -120
  34. package/dist/styles/paid-payments-table.css +65 -109
  35. package/dist/tsconfig.tsbuildinfo +1 -1
  36. package/dist/utils/cache.js +1 -1
  37. package/dist/utils/cache.js.map +1 -1
  38. package/package.json +1 -1
@@ -3,40 +3,39 @@
3
3
  import React, { useEffect, useState } from 'react';
4
4
  import { useIsInContainer } from './PaidContainer';
5
5
  import { cachedFetch, getCacheKey, CACHE_TTL } from '../utils/cache';
6
+ import { Pagination } from './ui/Pagination';
6
7
  import '../styles/paid-payments-table.css';
7
8
 
8
9
  interface PaidStyleProperties {
9
- paidTitleColor?: string;
10
- paidTitleFontWeight?: string;
11
- paidFontFamily?: string;
12
- paidWrapperBorder?: string;
13
- paidHeaderBorderBottom?: string;
14
- paidThBorderBottom?: string;
15
- paidTdBorderBottom?: string;
16
- paidTdBg?: string;
17
- paidTdFontWeight?: string;
18
- paidTitleFontSize?: string;
19
- paidToggleFontSize?: string;
20
- paidToggleFontWeight?: string;
21
- paidToggleColor?: string;
22
- paidThFontSize?: string;
23
- paidThFontWeight?: string;
24
- paidThColor?: string;
25
- paidTdFontSize?: string;
26
- paidTdColor?: string;
27
- paidEmptyColor?: string;
28
- paidWrapperBg?: string;
29
- paidHeaderBg?: string;
30
- paidTableBg?: string;
31
- paidThBg?: string;
32
- paidRowHoverBg?: string;
10
+ // Global - Font
11
+ fontFamily?: string;
12
+
13
+ // Global - Font Colors
14
+ primaryColor?: string;
15
+ secondaryColor?: string;
16
+
17
+ // Background Colors
18
+ containerBackgroundColor?: string;
19
+ tableBackgroundColor?: string;
20
+ tableHeaderBackgroundColor?: string;
21
+
22
+ // Tab Colors
23
+ tabBackgroundColor?: string;
24
+ tabActiveBackgroundColor?: string;
25
+ tabHoverBackgroundColor?: string;
26
+
27
+ // Table Hover
28
+ tableHoverColor?: string;
29
+
30
+ // Button Background (Status badges & Pagination)
31
+ buttonBgColor?: string;
33
32
  }
34
33
 
35
34
  interface Payment {
36
35
  id: string;
37
36
  paymentType: string;
38
37
  paymentDate: string;
39
- status: string;
38
+ paymentStatus: string;
40
39
  amount: number;
41
40
  currency: string;
42
41
  }
@@ -57,29 +56,69 @@ export const PaidPaymentsTable: React.FC<PaidPaymentsTableProps> = ({
57
56
  const [payments, setPayments] = useState<Payment[]>([]);
58
57
  const [loading, setLoading] = useState(true);
59
58
  const [error, setError] = useState<string | null>(null);
59
+ const [currentPage, setCurrentPage] = useState(1);
60
+ const itemsPerPage = 8;
60
61
  const isInContainer = useIsInContainer();
61
62
 
63
+ // Calculate pagination
64
+ const totalPages = Math.ceil(payments.length / itemsPerPage);
65
+ const startIndex = (currentPage - 1) * itemsPerPage;
66
+ const endIndex = startIndex + itemsPerPage;
67
+ const currentPayments = payments.slice(startIndex, endIndex);
68
+
69
+ const handlePageChange = (page: number) => {
70
+ setCurrentPage(page);
71
+ };
72
+
62
73
  // Convert paidStyle entries into CSS custom properties
63
74
  const cssVariables: React.CSSProperties = Object.entries(paidStyle).reduce((vars, [key, value]) => {
64
- let varName: string;
65
- if (key.startsWith('--')) {
66
- varName = key;
67
- } else {
68
- const raw = key.replace(/([A-Z])/g, '-$1').toLowerCase();
69
- varName = raw.startsWith('--') ? raw : `--${raw}`;
75
+ if (value !== undefined && value !== null && value !== '') {
76
+ // Map simplified properties to CSS custom properties
77
+ const propertyMap: Record<string, string> = {
78
+ fontFamily: '--paid-font-family',
79
+ primaryColor: '--paid-primary-color',
80
+ secondaryColor: '--paid-secondary-color',
81
+ containerBackgroundColor: '--paid-container-background-color',
82
+ tableBackgroundColor: '--paid-table-background-color',
83
+ tableHeaderBackgroundColor: '--paid-table-header-background-color',
84
+ tabBackgroundColor: '--paid-tab-background-color',
85
+ tabActiveBackgroundColor: '--paid-tab-active-background-color',
86
+ tabHoverBackgroundColor: '--paid-tab-hover-background-color',
87
+ tableHoverColor: '--paid-table-hover-color',
88
+ buttonBgColor: '--paid-button-bg-color'
89
+ };
90
+
91
+ const cssProperty = propertyMap[key];
92
+ if (cssProperty) {
93
+ // @ts-ignore allow custom property
94
+ vars[cssProperty] = value;
95
+ }
70
96
  }
71
- // @ts-ignore allow custom property
72
- vars[varName] = value;
97
+
73
98
  return vars;
74
99
  }, {} as React.CSSProperties);
75
100
 
76
- const formatCurrency = (amount: number) => {
101
+ const formatCurrency = (amount: number, currency: string) => {
102
+ const symbol = getCurrencySymbol(currency);
77
103
  return new Intl.NumberFormat("en-US", {
78
104
  style: "currency",
79
105
  currency: "USD",
80
- minimumFractionDigits: 0,
81
- maximumFractionDigits: 0,
82
- }).format(amount / 100);
106
+ minimumFractionDigits: 2,
107
+ maximumFractionDigits: 2,
108
+ }).format(amount / 100).replace('$', symbol);
109
+ };
110
+
111
+ const getCurrencySymbol = (currency: string) => {
112
+ switch (currency.toUpperCase()) {
113
+ case 'USD':
114
+ return '$';
115
+ case 'EUR':
116
+ return '€';
117
+ case 'GBP':
118
+ return '£';
119
+ default:
120
+ return '$'; // Default to USD symbol
121
+ }
83
122
  };
84
123
 
85
124
  const formatDate = (dateString: string) => {
@@ -91,6 +130,11 @@ export const PaidPaymentsTable: React.FC<PaidPaymentsTableProps> = ({
91
130
  };
92
131
 
93
132
  const getStatusBadge = (status: string) => {
133
+ // Handle undefined/null status
134
+ if (!status) {
135
+ return <span className="paid-payment-status">Unknown</span>;
136
+ }
137
+
94
138
  const statusClass = `paid-payment-status paid-payment-status-${status.toLowerCase()}`;
95
139
  const displayStatus = status.charAt(0).toUpperCase() + status.slice(1).toLowerCase();
96
140
  return <span className={statusClass}>{displayStatus}</span>;
@@ -102,21 +146,14 @@ export const PaidPaymentsTable: React.FC<PaidPaymentsTableProps> = ({
102
146
  setLoading(true);
103
147
  console.log('PaidPaymentsTable: Fetching payment data for', accountExternalId);
104
148
 
105
- // TEMPORARILY DISABLED: Use cached fetch for payment data
106
- // const cacheKey = getCacheKey.payments(accountExternalId);
107
- // console.log('PaidPaymentsTable: Using cache key', cacheKey);
108
- // const data = await cachedFetch<PaymentApiResponse>(
109
- // `/api/payments/${accountExternalId}`,
110
- // cacheKey,
111
- // CACHE_TTL.DATA
112
- // );
113
-
114
- // Direct fetch without caching
115
- const response = await fetch(`/api/payments/${accountExternalId}`);
116
- if (!response.ok) {
117
- throw new Error(`Failed to fetch: ${response.statusText}`);
118
- }
119
- const data = await response.json();
149
+ // Use cached fetch for payment data
150
+ const cacheKey = getCacheKey.payments(accountExternalId);
151
+ console.log('PaidPaymentsTable: Using cache key', cacheKey);
152
+ const data = await cachedFetch<PaymentApiResponse>(
153
+ `/api/payments/${accountExternalId}`,
154
+ cacheKey,
155
+ CACHE_TTL.DATA
156
+ );
120
157
 
121
158
  console.log('PaidPaymentsTable: Received data', data);
122
159
  setPayments(data.data || []);
@@ -156,58 +193,59 @@ export const PaidPaymentsTable: React.FC<PaidPaymentsTableProps> = ({
156
193
 
157
194
  return (
158
195
  <div className="paid-payment-container" style={{ position: 'relative', minWidth: 0, ...cssVariables }}>
159
- <div className="paid-payment-table-wrapper" style={{ position: 'static', width: '100%', height: 'auto', left: undefined, top: undefined, boxShadow: undefined, cursor: undefined }}>
196
+ <div className="paid-payment-table-wrapper" style={{ position: 'relative', width: '100%', height: 'auto', left: undefined, top: undefined, boxShadow: undefined, cursor: undefined }}>
160
197
  {!isInContainer && (
161
198
  <div className="paid-payment-header">
162
199
  <h3 className="paid-payment-title">Payments</h3>
163
200
  </div>
164
201
  )}
165
- <div style={{ background: '#fff', overflow: 'auto' }}>
166
- <table className="paid-payment-table">
202
+ <div style={{ background: '#fff', overflow: 'auto', width: '100%', boxSizing: 'border-box' }}>
203
+ <table className="paid-payment-table" style={{ width: '100%', maxWidth: '100%', tableLayout: 'fixed' }}>
167
204
  <thead>
168
205
  <tr>
169
206
  <th>Payment Number</th>
170
207
  <th>Payment type</th>
171
208
  <th>Due date</th>
172
209
  <th>Status</th>
173
- <th style={{ textAlign: 'right' }}>Amount</th>
174
- <th></th>
210
+ <th style={{ textAlign: 'center' }}>Amount</th>
175
211
  </tr>
176
212
  </thead>
177
213
  <tbody>
178
- {payments.length === 0 ? (
214
+ {currentPayments.length === 0 ? (
179
215
  <tr>
180
- <td colSpan={6} className="paid-payment-empty">
216
+ <td colSpan={5} className="paid-payment-empty">
181
217
  No payments found
182
218
  </td>
183
219
  </tr>
184
220
  ) : (
185
- payments.map((payment) => (
221
+ currentPayments.map((payment) => (
186
222
  <tr key={payment.id}>
187
- <td>
223
+ <td style={{ fontWeight: 500 }}>
188
224
  <div className="paid-payment-number">
189
- <span className="paid-payment-dollar">$</span>
190
225
  <span>PAY-1</span>
191
226
  </div>
192
227
  </td>
193
228
  <td>{payment.paymentType}</td>
194
229
  <td>{formatDate(payment.paymentDate)}</td>
195
- <td>{getStatusBadge(payment.status)}</td>
196
- <td style={{ textAlign: 'right' }}>
230
+ <td>{getStatusBadge(payment.paymentStatus)}</td>
231
+ <td style={{ textAlign: 'center' }}>
197
232
  <div className="paid-payment-amount">
198
- <span>{formatCurrency(payment.amount)}</span>
199
- <span className="paid-payment-dollar-right">$</span>
233
+ <span className="amount-number">{formatCurrency(payment.amount, payment.currency)}</span>
200
234
  </div>
201
235
  </td>
202
- <td style={{ textAlign: 'center' }}>
203
- <span className="paid-payment-currency">{payment.currency}</span>
204
- </td>
205
236
  </tr>
206
237
  ))
207
238
  )}
208
239
  </tbody>
209
240
  </table>
210
241
  </div>
242
+
243
+ {/* Pagination */}
244
+ <Pagination
245
+ currentPage={currentPage}
246
+ totalPages={totalPages}
247
+ onPageChange={handlePageChange}
248
+ />
211
249
  </div>
212
250
  </div>
213
251
  );
@@ -0,0 +1,168 @@
1
+ import React from 'react';
2
+
3
+ interface PaginationProps {
4
+ currentPage: number;
5
+ totalPages: number;
6
+ onPageChange: (page: number) => void;
7
+ className?: string;
8
+ }
9
+
10
+ export const Pagination: React.FC<PaginationProps> = ({
11
+ currentPage,
12
+ totalPages,
13
+ onPageChange,
14
+ className = ''
15
+ }) => {
16
+ if (totalPages <= 1) return null;
17
+
18
+ const getVisiblePages = () => {
19
+ const pages: (number | string)[] = [];
20
+ const maxVisible = 5;
21
+
22
+ if (totalPages <= maxVisible) {
23
+ // Show all pages if total is small
24
+ for (let i = 1; i <= totalPages; i++) {
25
+ pages.push(i);
26
+ }
27
+ } else {
28
+ // Always show first page
29
+ pages.push(1);
30
+
31
+ if (currentPage > 3) {
32
+ pages.push('...');
33
+ }
34
+
35
+ // Show pages around current page
36
+ const start = Math.max(2, currentPage - 1);
37
+ const end = Math.min(totalPages - 1, currentPage + 1);
38
+
39
+ for (let i = start; i <= end; i++) {
40
+ if (i !== 1 && i !== totalPages) {
41
+ pages.push(i);
42
+ }
43
+ }
44
+
45
+ if (currentPage < totalPages - 2) {
46
+ pages.push('...');
47
+ }
48
+
49
+ // Always show last page
50
+ if (totalPages > 1) {
51
+ pages.push(totalPages);
52
+ }
53
+ }
54
+
55
+ return pages;
56
+ };
57
+
58
+ const visiblePages = getVisiblePages();
59
+
60
+ return (
61
+ <>
62
+ <style>{`
63
+ .paid-pagination-btn {
64
+ padding: 6px 12px;
65
+ border: 1px solid #E5E7EB;
66
+ background-color: var(--paid-button-bg-color, #FFFFFF) !important;
67
+ color: var(--paid-primary-color, #374151) !important;
68
+ border-radius: 6px;
69
+ cursor: pointer;
70
+ fontSize: 13px;
71
+ font-weight: 500;
72
+ transition: all 0.15s ease;
73
+ outline: none !important;
74
+ user-select: none;
75
+ -webkit-appearance: none !important;
76
+ -moz-appearance: none !important;
77
+ appearance: none !important;
78
+ box-shadow: none !important;
79
+ }
80
+
81
+ .paid-pagination-btn:hover:not(:disabled) {
82
+ filter: brightness(0.9) !important;
83
+ transform: translateY(-1px) !important;
84
+ background-color: var(--paid-button-bg-color, #FFFFFF) !important;
85
+ }
86
+
87
+ .paid-pagination-btn:active:not(:disabled) {
88
+ filter: brightness(0.8) !important;
89
+ transform: translateY(0px) !important;
90
+ background-color: var(--paid-button-bg-color, #FFFFFF) !important;
91
+ }
92
+
93
+ .paid-pagination-btn:focus:not(:disabled) {
94
+ filter: brightness(0.9) !important;
95
+ background-color: var(--paid-button-bg-color, #FFFFFF) !important;
96
+ box-shadow: none !important;
97
+ outline: none !important;
98
+ }
99
+
100
+ .paid-pagination-btn:disabled {
101
+ background-color: var(--paid-button-bg-color, #F9FAFB) !important;
102
+ color: #9CA3AF !important;
103
+ cursor: not-allowed;
104
+ opacity: 0.6;
105
+ }
106
+
107
+ .paid-pagination-btn.current-page {
108
+ background-color: #F3F4F6 !important;
109
+ color: var(--paid-primary-color, #111827) !important;
110
+ font-weight: 600;
111
+ }
112
+
113
+ .paid-pagination-btn.page-number {
114
+ padding: 6px 10px;
115
+ min-width: 32px;
116
+ }
117
+ `}</style>
118
+ <div className={`pagination-container ${className}`} style={{
119
+ display: 'flex',
120
+ alignItems: 'center',
121
+ justifyContent: 'flex-end',
122
+ gap: '6px',
123
+ padding: '16px 24px',
124
+ fontSize: '13px',
125
+ fontFamily: 'inherit',
126
+ width: '100%',
127
+ boxSizing: 'border-box'
128
+ }}>
129
+ <button
130
+ onClick={() => onPageChange(currentPage - 1)}
131
+ disabled={currentPage === 1}
132
+ className="paid-pagination-btn"
133
+ >
134
+ Previous
135
+ </button>
136
+
137
+ {visiblePages.map((page, index) => (
138
+ <React.Fragment key={index}>
139
+ {page === '...' ? (
140
+ <span style={{
141
+ padding: '6px 4px',
142
+ color: '#9CA3AF',
143
+ fontSize: '13px'
144
+ }}>
145
+ ...
146
+ </span>
147
+ ) : (
148
+ <button
149
+ onClick={() => onPageChange(page as number)}
150
+ className={`paid-pagination-btn page-number ${currentPage === page ? 'current-page' : ''}`}
151
+ >
152
+ {page}
153
+ </button>
154
+ )}
155
+ </React.Fragment>
156
+ ))}
157
+
158
+ <button
159
+ onClick={() => onPageChange(currentPage + 1)}
160
+ disabled={currentPage === totalPages}
161
+ className="paid-pagination-btn"
162
+ >
163
+ Next
164
+ </button>
165
+ </div>
166
+ </>
167
+ );
168
+ };
@@ -0,0 +1,10 @@
1
+ import React from 'react';
2
+ interface PaginationProps {
3
+ currentPage: number;
4
+ totalPages: number;
5
+ onPageChange: (page: number) => void;
6
+ className?: string;
7
+ }
8
+ export declare const Pagination: React.FC<PaginationProps>;
9
+ export {};
10
+ //# sourceMappingURL=Pagination.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../../src/components/ui/Pagination.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,UAAU,eAAe;IACrB,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CA8JhD,CAAC"}
@@ -0,0 +1,111 @@
1
+ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
2
+ import React from 'react';
3
+ export const Pagination = ({ currentPage, totalPages, onPageChange, className = '' }) => {
4
+ if (totalPages <= 1)
5
+ return null;
6
+ const getVisiblePages = () => {
7
+ const pages = [];
8
+ const maxVisible = 5;
9
+ if (totalPages <= maxVisible) {
10
+ // Show all pages if total is small
11
+ for (let i = 1; i <= totalPages; i++) {
12
+ pages.push(i);
13
+ }
14
+ }
15
+ else {
16
+ // Always show first page
17
+ pages.push(1);
18
+ if (currentPage > 3) {
19
+ pages.push('...');
20
+ }
21
+ // Show pages around current page
22
+ const start = Math.max(2, currentPage - 1);
23
+ const end = Math.min(totalPages - 1, currentPage + 1);
24
+ for (let i = start; i <= end; i++) {
25
+ if (i !== 1 && i !== totalPages) {
26
+ pages.push(i);
27
+ }
28
+ }
29
+ if (currentPage < totalPages - 2) {
30
+ pages.push('...');
31
+ }
32
+ // Always show last page
33
+ if (totalPages > 1) {
34
+ pages.push(totalPages);
35
+ }
36
+ }
37
+ return pages;
38
+ };
39
+ const visiblePages = getVisiblePages();
40
+ return (_jsxs(_Fragment, { children: [_jsx("style", { children: `
41
+ .paid-pagination-btn {
42
+ padding: 6px 12px;
43
+ border: 1px solid #E5E7EB;
44
+ background-color: var(--paid-button-bg-color, #FFFFFF) !important;
45
+ color: var(--paid-primary-color, #374151) !important;
46
+ border-radius: 6px;
47
+ cursor: pointer;
48
+ fontSize: 13px;
49
+ font-weight: 500;
50
+ transition: all 0.15s ease;
51
+ outline: none !important;
52
+ user-select: none;
53
+ -webkit-appearance: none !important;
54
+ -moz-appearance: none !important;
55
+ appearance: none !important;
56
+ box-shadow: none !important;
57
+ }
58
+
59
+ .paid-pagination-btn:hover:not(:disabled) {
60
+ filter: brightness(0.9) !important;
61
+ transform: translateY(-1px) !important;
62
+ background-color: var(--paid-button-bg-color, #FFFFFF) !important;
63
+ }
64
+
65
+ .paid-pagination-btn:active:not(:disabled) {
66
+ filter: brightness(0.8) !important;
67
+ transform: translateY(0px) !important;
68
+ background-color: var(--paid-button-bg-color, #FFFFFF) !important;
69
+ }
70
+
71
+ .paid-pagination-btn:focus:not(:disabled) {
72
+ filter: brightness(0.9) !important;
73
+ background-color: var(--paid-button-bg-color, #FFFFFF) !important;
74
+ box-shadow: none !important;
75
+ outline: none !important;
76
+ }
77
+
78
+ .paid-pagination-btn:disabled {
79
+ background-color: var(--paid-button-bg-color, #F9FAFB) !important;
80
+ color: #9CA3AF !important;
81
+ cursor: not-allowed;
82
+ opacity: 0.6;
83
+ }
84
+
85
+ .paid-pagination-btn.current-page {
86
+ background-color: #F3F4F6 !important;
87
+ color: var(--paid-primary-color, #111827) !important;
88
+ font-weight: 600;
89
+ }
90
+
91
+ .paid-pagination-btn.page-number {
92
+ padding: 6px 10px;
93
+ min-width: 32px;
94
+ }
95
+ ` }), _jsxs("div", { className: `pagination-container ${className}`, style: {
96
+ display: 'flex',
97
+ alignItems: 'center',
98
+ justifyContent: 'flex-end',
99
+ gap: '6px',
100
+ padding: '16px 24px',
101
+ fontSize: '13px',
102
+ fontFamily: 'inherit',
103
+ width: '100%',
104
+ boxSizing: 'border-box'
105
+ }, children: [_jsx("button", { onClick: () => onPageChange(currentPage - 1), disabled: currentPage === 1, className: "paid-pagination-btn", children: "Previous" }), visiblePages.map((page, index) => (_jsx(React.Fragment, { children: page === '...' ? (_jsx("span", { style: {
106
+ padding: '6px 4px',
107
+ color: '#9CA3AF',
108
+ fontSize: '13px'
109
+ }, children: "..." })) : (_jsx("button", { onClick: () => onPageChange(page), className: `paid-pagination-btn page-number ${currentPage === page ? 'current-page' : ''}`, children: page })) }, index))), _jsx("button", { onClick: () => onPageChange(currentPage + 1), disabled: currentPage === totalPages, className: "paid-pagination-btn", children: "Next" })] })] }));
110
+ };
111
+ //# sourceMappingURL=Pagination.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Pagination.js","sourceRoot":"","sources":["../../../src/components/ui/Pagination.tsx"],"names":[],"mappings":"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"}
package/dist/index.d.ts CHANGED
@@ -6,4 +6,6 @@ export { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '.
6
6
  export { handlePaidUsage } from './api/handlePaidUsage';
7
7
  export { handlePaidInvoices } from './api/handlePaidInvoices';
8
8
  export { handlePaidInvoicePdf } from './api/handlePaidInvoicePdf';
9
- export { handlePaidPayments } from './api/handlePaidPayments';
9
+ export { handlePaidPayments } from './api/handlePaidPayments';
10
+ export { Pagination } from './components/ui/Pagination';
11
+ export { useCache } from './hooks/useCache';
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAC/D,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAC7E,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AACjE,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AACnE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACtG,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AACxD,OAAO,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AAC9D,OAAO,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAC;AAClE,OAAO,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAC/D,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAC7E,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AACjE,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AACnE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACtG,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AACxD,OAAO,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AAC9D,OAAO,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAC;AAClE,OAAO,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AAC9D,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AACxD,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC"}
package/dist/index.js CHANGED
@@ -6,4 +6,6 @@ export { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '.
6
6
  export { handlePaidUsage } from './api/handlePaidUsage';
7
7
  export { handlePaidInvoices } from './api/handlePaidInvoices';
8
8
  export { handlePaidInvoicePdf } from './api/handlePaidInvoicePdf';
9
- export { handlePaidPayments } from './api/handlePaidPayments';
9
+ export { handlePaidPayments } from './api/handlePaidPayments';
10
+ export { Pagination } from './components/ui/Pagination';
11
+ export { useCache } from './hooks/useCache';
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAC/D,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAC7E,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AACjE,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AACnE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACtG,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AACxD,OAAO,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AAC9D,OAAO,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAC;AAClE,OAAO,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAC/D,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAC7E,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AACjE,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AACnE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACtG,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AACxD,OAAO,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AAC9D,OAAO,EAAE,oBAAoB,EAAE,MAAM,4BAA4B,CAAC;AAClE,OAAO,EAAE,kBAAkB,EAAE,MAAM,0BAA0B,CAAC;AAC9D,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AACxD,OAAO,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC"}