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

package/dist/components/components/PaidPaymentsTable.js

@@ -3,40 +3,39 @@
 import React, { useEffect, useState } from 'react';
 import { useIsInContainer } from './PaidContainer';
 import { cachedFetch, getCacheKey, CACHE_TTL } from '../utils/cache';
+import { Pagination } from './ui/Pagination';
 import '../styles/paid-payments-table.css';
 
 interface PaidStyleProperties {
-    paidTitleColor?: string;
-    paidTitleFontWeight?: string;
-    paidFontFamily?: string;
-    paidWrapperBorder?: string;
-    paidHeaderBorderBottom?: string;
-    paidThBorderBottom?: string;
-    paidTdBorderBottom?: string;
-    paidTdBg?: string;
-    paidTdFontWeight?: string;
-    paidTitleFontSize?: string;
-    paidToggleFontSize?: string;
-    paidToggleFontWeight?: string;
-    paidToggleColor?: string;
-    paidThFontSize?: string;
-    paidThFontWeight?: string;
-    paidThColor?: string;
-    paidTdFontSize?: string;
-    paidTdColor?: string;
-    paidEmptyColor?: string;
-    paidWrapperBg?: string;
-    paidHeaderBg?: string;
-    paidTableBg?: string;
-    paidThBg?: string;
-    paidRowHoverBg?: string;
+    // Global - Font
+    fontFamily?: string;
+    
+    // Global - Font Colors
+    primaryColor?: string;
+    secondaryColor?: string;
+    
+    // Background Colors
+    containerBackgroundColor?: string;
+    tableBackgroundColor?: string;
+    tableHeaderBackgroundColor?: string;
+    
+    // Tab Colors
+    tabBackgroundColor?: string;
+    tabActiveBackgroundColor?: string;
+    tabHoverBackgroundColor?: string;
+    
+    // Table Hover
+    tableHoverColor?: string;
+    
+    // Button Background (Status badges & Pagination)
+    buttonBgColor?: string;
 }
 
 interface Payment {
     id: string;
     paymentType: string;
     paymentDate: string;
-    status: string;
+    paymentStatus: string;
     amount: number;
     currency: string;
 }
@@ -57,29 +56,69 @@ export const PaidPaymentsTable: React.FC<PaidPaymentsTableProps> = ({
     const [payments, setPayments] = useState<Payment[]>([]);
     const [loading, setLoading] = useState(true);
     const [error, setError] = useState<string | null>(null);
+    const [currentPage, setCurrentPage] = useState(1);
+    const itemsPerPage = 8;
     const isInContainer = useIsInContainer();
 
+    // Calculate pagination
+    const totalPages = Math.ceil(payments.length / itemsPerPage);
+    const startIndex = (currentPage - 1) * itemsPerPage;
+    const endIndex = startIndex + itemsPerPage;
+    const currentPayments = payments.slice(startIndex, endIndex);
+
+    const handlePageChange = (page: number) => {
+        setCurrentPage(page);
+    };
+
     // Convert paidStyle entries into CSS custom properties
     const cssVariables: React.CSSProperties = Object.entries(paidStyle).reduce((vars, [key, value]) => {
-        let varName: string;
-        if (key.startsWith('--')) {
-            varName = key;
-        } else {
-            const raw = key.replace(/([A-Z])/g, '-$1').toLowerCase();
-            varName = raw.startsWith('--') ? raw : `--${raw}`;
+        if (value !== undefined && value !== null && value !== '') {
+            // Map simplified properties to CSS custom properties
+            const propertyMap: Record<string, string> = {
+                fontFamily: '--paid-font-family',
+                primaryColor: '--paid-primary-color',
+                secondaryColor: '--paid-secondary-color',
+                containerBackgroundColor: '--paid-container-background-color',
+                tableBackgroundColor: '--paid-table-background-color',
+                tableHeaderBackgroundColor: '--paid-table-header-background-color',
+                tabBackgroundColor: '--paid-tab-background-color',
+                tabActiveBackgroundColor: '--paid-tab-active-background-color',
+                tabHoverBackgroundColor: '--paid-tab-hover-background-color',
+                tableHoverColor: '--paid-table-hover-color',
+                buttonBgColor: '--paid-button-bg-color'
+            };
+
+            const cssProperty = propertyMap[key];
+            if (cssProperty) {
+                // @ts-ignore allow custom property
+                vars[cssProperty] = value;
+            }
         }
-        // @ts-ignore allow custom property
-        vars[varName] = value;
+        
         return vars;
     }, {} as React.CSSProperties);
 
-    const formatCurrency = (amount: number) => {
+    const formatCurrency = (amount: number, currency: string) => {
+        const symbol = getCurrencySymbol(currency);
         return new Intl.NumberFormat("en-US", {
             style: "currency",
             currency: "USD",
-            minimumFractionDigits: 0,
-            maximumFractionDigits: 0,
-        }).format(amount / 100);
+            minimumFractionDigits: 2,
+            maximumFractionDigits: 2,
+        }).format(amount / 100).replace('$', symbol);
+    };
+
+    const getCurrencySymbol = (currency: string) => {
+        switch (currency.toUpperCase()) {
+            case 'USD':
+                return '$';
+            case 'EUR':
+                return '€';
+            case 'GBP':
+                return '£';
+            default:
+                return '$'; // Default to USD symbol
+        }
     };
 
     const formatDate = (dateString: string) => {
@@ -107,21 +146,14 @@ export const PaidPaymentsTable: React.FC<PaidPaymentsTableProps> = ({
                 setLoading(true);
                 console.log('PaidPaymentsTable: Fetching payment data for', accountExternalId);
                 
-                // TEMPORARILY DISABLED: Use cached fetch for payment data
-                // const cacheKey = getCacheKey.payments(accountExternalId);
-                // console.log('PaidPaymentsTable: Using cache key', cacheKey);
-                // const data = await cachedFetch<PaymentApiResponse>(
-                //     `/api/payments/${accountExternalId}`,
-                //     cacheKey,
-                //     CACHE_TTL.DATA
-                // );
-                
-                // Direct fetch without caching
-                const response = await fetch(`/api/payments/${accountExternalId}`);
-                if (!response.ok) {
-                    throw new Error(`Failed to fetch: ${response.statusText}`);
-                }
-                const data = await response.json();
+                // Use cached fetch for payment data
+                const cacheKey = getCacheKey.payments(accountExternalId);
+                console.log('PaidPaymentsTable: Using cache key', cacheKey);
+                const data = await cachedFetch<PaymentApiResponse>(
+                    `/api/payments/${accountExternalId}`,
+                    cacheKey,
+                    CACHE_TTL.DATA
+                );
                 
                 console.log('PaidPaymentsTable: Received data', data);
                 setPayments(data.data || []);
@@ -161,58 +193,59 @@ export const PaidPaymentsTable: React.FC<PaidPaymentsTableProps> = ({
 
     return (
         <div className="paid-payment-container" style={{ position: 'relative', minWidth: 0, ...cssVariables }}>
-            <div className="paid-payment-table-wrapper" style={{ position: 'static', width: '100%', height: 'auto', left: undefined, top: undefined, boxShadow: undefined, cursor: undefined }}>
+            <div className="paid-payment-table-wrapper" style={{ position: 'relative', width: '100%', height: 'auto', left: undefined, top: undefined, boxShadow: undefined, cursor: undefined }}>
                 {!isInContainer && (
                     <div className="paid-payment-header">
                         <h3 className="paid-payment-title">Payments</h3>
                     </div>
                 )}
-                <div style={{ background: '#fff', overflow: 'auto' }}>
-                    <table className="paid-payment-table">
+                <div style={{ background: '#fff', overflow: 'auto', width: '100%', boxSizing: 'border-box' }}>
+                    <table className="paid-payment-table" style={{ width: '100%', maxWidth: '100%', tableLayout: 'fixed' }}>
                         <thead>
                             <tr>
                                 <th>Payment Number</th>
                                 <th>Payment type</th>
                                 <th>Due date</th>
                                 <th>Status</th>
-                                <th style={{ textAlign: 'right' }}>Amount</th>
-                                <th></th>
+                                <th style={{ textAlign: 'center' }}>Amount</th>
                             </tr>
                         </thead>
                         <tbody>
-                            {payments.length === 0 ? (
+                            {currentPayments.length === 0 ? (
                                 <tr>
-                                    <td colSpan={6} className="paid-payment-empty">
+                                    <td colSpan={5} className="paid-payment-empty">
                                         No payments found
                                     </td>
                                 </tr>
                             ) : (
-                                payments.map((payment) => (
+                                currentPayments.map((payment) => (
                                     <tr key={payment.id}>
-                                        <td>
+                                        <td style={{ fontWeight: 500 }}>
                                             <div className="paid-payment-number">
-                                                <span className="paid-payment-dollar">$</span>
                                                 <span>PAY-1</span>
                                             </div>
                                         </td>
                                         <td>{payment.paymentType}</td>
                                         <td>{formatDate(payment.paymentDate)}</td>
-                                        <td>{getStatusBadge(payment.status)}</td>
-                                        <td style={{ textAlign: 'right' }}>
+                                        <td>{getStatusBadge(payment.paymentStatus)}</td>
+                                        <td style={{ textAlign: 'center' }}>
                                             <div className="paid-payment-amount">
-                                                <span>{formatCurrency(payment.amount)}</span>
-                                                <span className="paid-payment-dollar-right">$</span>
+                                                <span className="amount-number">{formatCurrency(payment.amount, payment.currency)}</span>
                                             </div>
                                         </td>
-                                        <td style={{ textAlign: 'center' }}>
-                                            <span className="paid-payment-currency">{payment.currency}</span>
-                                        </td>
                                     </tr>
                                 ))
                             )}
                         </tbody>
                     </table>
                 </div>
+                
+                {/* Pagination */}
+                <Pagination
+                    currentPage={currentPage}
+                    totalPages={totalPages}
+                    onPageChange={handlePageChange}
+                />
             </div>
         </div>
     );

package/dist/components/components/ui/Pagination.js

@@ -0,0 +1,168 @@
+import React from 'react';
+
+interface PaginationProps {
+    currentPage: number;
+    totalPages: number;
+    onPageChange: (page: number) => void;
+    className?: string;
+}
+
+export const Pagination: React.FC<PaginationProps> = ({
+    currentPage,
+    totalPages,
+    onPageChange,
+    className = ''
+}) => {
+    if (totalPages <= 1) return null;
+
+    const getVisiblePages = () => {
+        const pages: (number | string)[] = [];
+        const maxVisible = 5;
+        
+        if (totalPages <= maxVisible) {
+            // Show all pages if total is small
+            for (let i = 1; i <= totalPages; i++) {
+                pages.push(i);
+            }
+        } else {
+            // Always show first page
+            pages.push(1);
+            
+            if (currentPage > 3) {
+                pages.push('...');
+            }
+            
+            // Show pages around current page
+            const start = Math.max(2, currentPage - 1);
+            const end = Math.min(totalPages - 1, currentPage + 1);
+            
+            for (let i = start; i <= end; i++) {
+                if (i !== 1 && i !== totalPages) {
+                    pages.push(i);
+                }
+            }
+            
+            if (currentPage < totalPages - 2) {
+                pages.push('...');
+            }
+            
+            // Always show last page
+            if (totalPages > 1) {
+                pages.push(totalPages);
+            }
+        }
+        
+        return pages;
+    };
+
+    const visiblePages = getVisiblePages();
+
+    return (
+        <>
+            <style>{`
+                .paid-pagination-btn {
+                    padding: 6px 12px;
+                    border: 1px solid #E5E7EB;
+                    background-color: var(--paid-button-bg-color, #FFFFFF) !important;
+                    color: var(--paid-primary-color, #374151) !important;
+                    border-radius: 6px;
+                    cursor: pointer;
+                    fontSize: 13px;
+                    font-weight: 500;
+                    transition: all 0.15s ease;
+                    outline: none !important;
+                    user-select: none;
+                    -webkit-appearance: none !important;
+                    -moz-appearance: none !important;
+                    appearance: none !important;
+                    box-shadow: none !important;
+                }
+                
+                .paid-pagination-btn:hover:not(:disabled) {
+                    filter: brightness(0.9) !important;
+                    transform: translateY(-1px) !important;
+                    background-color: var(--paid-button-bg-color, #FFFFFF) !important;
+                }
+                
+                .paid-pagination-btn:active:not(:disabled) {
+                    filter: brightness(0.8) !important;
+                    transform: translateY(0px) !important;
+                    background-color: var(--paid-button-bg-color, #FFFFFF) !important;
+                }
+                
+                .paid-pagination-btn:focus:not(:disabled) {
+                    filter: brightness(0.9) !important;
+                    background-color: var(--paid-button-bg-color, #FFFFFF) !important;
+                    box-shadow: none !important;
+                    outline: none !important;
+                }
+                
+                .paid-pagination-btn:disabled {
+                    background-color: var(--paid-button-bg-color, #F9FAFB) !important;
+                    color: #9CA3AF !important;
+                    cursor: not-allowed;
+                    opacity: 0.6;
+                }
+                
+                .paid-pagination-btn.current-page {
+                    background-color: #F3F4F6 !important;
+                    color: var(--paid-primary-color, #111827) !important;
+                    font-weight: 600;
+                }
+                
+                .paid-pagination-btn.page-number {
+                    padding: 6px 10px;
+                    min-width: 32px;
+                }
+            `}</style>
+            <div className={`pagination-container ${className}`} style={{
+                display: 'flex',
+                alignItems: 'center',
+                justifyContent: 'flex-end',
+                gap: '6px',
+                padding: '16px 24px',
+                fontSize: '13px',
+                fontFamily: 'inherit',
+                width: '100%',
+                boxSizing: 'border-box'
+            }}>
+                <button
+                    onClick={() => onPageChange(currentPage - 1)}
+                    disabled={currentPage === 1}
+                    className="paid-pagination-btn"
+                >
+                    Previous
+                </button>
+
+                {visiblePages.map((page, index) => (
+                    <React.Fragment key={index}>
+                        {page === '...' ? (
+                            <span style={{
+                                padding: '6px 4px',
+                                color: '#9CA3AF',
+                                fontSize: '13px'
+                            }}>
+                                ...
+                            </span>
+                        ) : (
+                            <button
+                                onClick={() => onPageChange(page as number)}
+                                className={`paid-pagination-btn page-number ${currentPage === page ? 'current-page' : ''}`}
+                            >
+                                {page}
+                            </button>
+                        )}
+                    </React.Fragment>
+                ))}
+
+                <button
+                    onClick={() => onPageChange(currentPage + 1)}
+                    disabled={currentPage === totalPages}
+                    className="paid-pagination-btn"
+                >
+                    Next
+                </button>
+            </div>
+        </>
+    );
+}; 

package/dist/components/ui/Pagination.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+interface PaginationProps {
+    currentPage: number;
+    totalPages: number;
+    onPageChange: (page: number) => void;
+    className?: string;
+}
+export declare const Pagination: React.FC<PaginationProps>;
+export {};
+//# sourceMappingURL=Pagination.d.ts.map

package/dist/components/ui/Pagination.d.ts.map

@@ -0,0 +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"}

package/dist/components/ui/Pagination.js

@@ -0,0 +1,111 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import React from 'react';
+export const Pagination = ({ currentPage, totalPages, onPageChange, className = '' }) => {
+    if (totalPages <= 1)
+        return null;
+    const getVisiblePages = () => {
+        const pages = [];
+        const maxVisible = 5;
+        if (totalPages <= maxVisible) {
+            // Show all pages if total is small
+            for (let i = 1; i <= totalPages; i++) {
+                pages.push(i);
+            }
+        }
+        else {
+            // Always show first page
+            pages.push(1);
+            if (currentPage > 3) {
+                pages.push('...');
+            }
+            // Show pages around current page
+            const start = Math.max(2, currentPage - 1);
+            const end = Math.min(totalPages - 1, currentPage + 1);
+            for (let i = start; i <= end; i++) {
+                if (i !== 1 && i !== totalPages) {
+                    pages.push(i);
+                }
+            }
+            if (currentPage < totalPages - 2) {
+                pages.push('...');
+            }
+            // Always show last page
+            if (totalPages > 1) {
+                pages.push(totalPages);
+            }
+        }
+        return pages;
+    };
+    const visiblePages = getVisiblePages();
+    return (_jsxs(_Fragment, { children: [_jsx("style", { children: `
+                .paid-pagination-btn {
+                    padding: 6px 12px;
+                    border: 1px solid #E5E7EB;
+                    background-color: var(--paid-button-bg-color, #FFFFFF) !important;
+                    color: var(--paid-primary-color, #374151) !important;
+                    border-radius: 6px;
+                    cursor: pointer;
+                    fontSize: 13px;
+                    font-weight: 500;
+                    transition: all 0.15s ease;
+                    outline: none !important;
+                    user-select: none;
+                    -webkit-appearance: none !important;
+                    -moz-appearance: none !important;
+                    appearance: none !important;
+                    box-shadow: none !important;
+                }
+                
+                .paid-pagination-btn:hover:not(:disabled) {
+                    filter: brightness(0.9) !important;
+                    transform: translateY(-1px) !important;
+                    background-color: var(--paid-button-bg-color, #FFFFFF) !important;
+                }
+                
+                .paid-pagination-btn:active:not(:disabled) {
+                    filter: brightness(0.8) !important;
+                    transform: translateY(0px) !important;
+                    background-color: var(--paid-button-bg-color, #FFFFFF) !important;
+                }
+                
+                .paid-pagination-btn:focus:not(:disabled) {
+                    filter: brightness(0.9) !important;
+                    background-color: var(--paid-button-bg-color, #FFFFFF) !important;
+                    box-shadow: none !important;
+                    outline: none !important;
+                }
+                
+                .paid-pagination-btn:disabled {
+                    background-color: var(--paid-button-bg-color, #F9FAFB) !important;
+                    color: #9CA3AF !important;
+                    cursor: not-allowed;
+                    opacity: 0.6;
+                }
+                
+                .paid-pagination-btn.current-page {
+                    background-color: #F3F4F6 !important;
+                    color: var(--paid-primary-color, #111827) !important;
+                    font-weight: 600;
+                }
+                
+                .paid-pagination-btn.page-number {
+                    padding: 6px 10px;
+                    min-width: 32px;
+                }
+            ` }), _jsxs("div", { className: `pagination-container ${className}`, style: {
+                    display: 'flex',
+                    alignItems: 'center',
+                    justifyContent: 'flex-end',
+                    gap: '6px',
+                    padding: '16px 24px',
+                    fontSize: '13px',
+                    fontFamily: 'inherit',
+                    width: '100%',
+                    boxSizing: 'border-box'
+                }, 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: {
+                                padding: '6px 4px',
+                                color: '#9CA3AF',
+                                fontSize: '13px'
+                            }, 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" })] })] }));
+};
+//# sourceMappingURL=Pagination.js.map

package/dist/components/ui/Pagination.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Pagination.js","sourceRoot":"","sources":["../../../src/components/ui/Pagination.tsx"],"names":[],"mappings":"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"}

package/dist/index.d.ts

@@ -6,4 +6,6 @@ export { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '.
 export { handlePaidUsage } from './api/handlePaidUsage';
 export { handlePaidInvoices } from './api/handlePaidInvoices';
 export { handlePaidInvoicePdf } from './api/handlePaidInvoicePdf'; 
-export { handlePaidPayments } from './api/handlePaidPayments';
+export { handlePaidPayments } from './api/handlePaidPayments';
+export { Pagination } from './components/ui/Pagination';
+export { useCache } from './hooks/useCache';

package/dist/index.d.ts.map

@@ -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"}
+{"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

@@ -6,4 +6,6 @@ export { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '.
 export { handlePaidUsage } from './api/handlePaidUsage';
 export { handlePaidInvoices } from './api/handlePaidInvoices';
 export { handlePaidInvoicePdf } from './api/handlePaidInvoicePdf'; 
-export { handlePaidPayments } from './api/handlePaidPayments';
+export { handlePaidPayments } from './api/handlePaidPayments';
+export { Pagination } from './components/ui/Pagination';
+export { useCache } from './hooks/useCache';

package/dist/index.js.map

@@ -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"}
+{"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"}