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

package/README.md

@@ -94,3 +94,60 @@ export default function AgentDashboard() {
 }
 ```
 
+---
+
+## Styling & Customization
+
+The `PaidActivityLog` component is fully customizable through the `paidStyle` prop. You can override the visual design of the component, such as fonts, colors, borders, and layout, by passing an object with our predefined styling variables.
+
+These custom CSS properties map directly to visual elements inside the component and allow full control over typography, layout, and colors without modifying any stylesheets.
+
+## Example
+
+```html
+<PaidActivityLog 
+  accountExternalId="customer_123" 
+  paidStyle={{
+    paidTitleColor: '#ff0000',
+    paidTitleFontWeight: 'bold',
+    paidFontFamily: 'Comic Sans MS, Comic Sans, sans-serif',
+    paidWrapperBorder: 'none',
+    paidHeaderBorderBottom: 'none',
+    paidThBorderBottom: 'none',
+    paidTdBorderBottom: 'none',
+    paidTdColor: '#00ff00',
+    paidTdBg: '#0000ff',
+    paidRowHoverBg: '#000000',
+  }}
+/>
+```
+
+## Available Style Variables
+
+| Variable Name | CSS Custom Property | Description |
+| --- | --- | --- |
+| `paidFontFamily` | `--paid-font-family` | Global font for all content |
+| `paidTitleFontSize` | `--paid-title-font-size` | Title font size |
+| `paidTitleFontWeight` | `--paid-title-font-weight` | Title font weight |
+| `paidTitleColor` | `--paid-title-color` | Title color |
+| `paidToggleFontSize` | `--paid-toggle-font-size` | Toggle font size |
+| `paidToggleFontWeight` | `--paid-toggle-font-weight` | Toggle font weight |
+| `paidToggleColor` | `--paid-toggle-color` | Toggle color |
+| `paidThFontSize` | `--paid-th-font-size` | Table header font size |
+| `paidThFontWeight` | `--paid-th-font-weight` | Table header font weight |
+| `paidThColor` | `--paid-th-color` | Table header text color |
+| `paidTdFontSize` | `--paid-td-font-size` | Table data font size |
+| `paidTdFontWeight` | `--paid-td-font-weight` | Table data font weight |
+| `paidTdColor` | `--paid-td-color` | Table data text color |
+| `paidEmptyColor` | `--paid-empty-color` | “No usage data” message color |
+| `paidWrapperBg` | `--paid-wrapper-bg` | Outer wrapper background |
+| `paidWrapperBorder` | `--paid-wrapper-border` | Outer wrapper border |
+| `paidHeaderBg` | `--paid-header-bg` | Header bar background |
+| `paidHeaderBorderBottom` | `--paid-header-border-bottom` | Header bottom border |
+| `paidTableBg` | `--paid-table-bg` | Table background |
+| `paidThBg` | `--paid-th-bg` | Header cell background |
+| `paidThBorderBottom` | `--paid-th-border-bottom` | Header cell bottom border |
+| `paidTdBg` | `--paid-td-bg` | Data cell background |
+| `paidTdBorderBottom` | `--paid-td-border-bottom` | Data cell bottom border |
+| `paidRowHoverBg` | `--paid-row-hover-bg` | Data row hover background |
+

package/dist/api/api/handlePaidInvoicePdf.ts

@@ -0,0 +1,79 @@
+export function handlePaidInvoicePdf(apiKey: string, apiBase?: string) {
+    return async function GET(
+      _: Request,
+      { params }: { params: { invoiceId: string } }
+    ) {
+      try {
+        if (!apiBase) {
+            apiBase = 'https://api.agentpaid.io';
+        }
+
+        const { invoiceId } = params;
+  
+        if (!apiKey) {
+          return new Response(
+            JSON.stringify({ error: 'API key not configured' }),
+            { 
+              status: 500,
+              headers: { 'Content-Type': 'application/json' }
+            }
+          );
+        }
+
+        const url = `${apiBase}/api/organizations/org/invoices/${invoiceId}/pdf`;
+  
+        const response = await fetch(url, {
+            headers: {
+              'Authorization': `Bearer ${apiKey}`,
+            },
+          }
+        );
+
+        if (!response.ok) {
+          let errorMessage = `HTTP ${response.status}: ${response.statusText}`;
+          try {
+            const errorData = await response.json();
+            errorMessage = errorData.error || errorData.message || errorMessage;
+          } catch (parseError) {
+            try {
+              const errorText = await response.text();
+              if (errorText) {
+                errorMessage = errorText;
+              }
+            } catch (textError) {
+              console.log('handlePaidInvoicePdf - Could not parse error response');
+            }
+          }
+          
+          return new Response(
+            JSON.stringify({ error: errorMessage }),
+            { 
+              status: response.status,
+              headers: { 'Content-Type': 'application/json' }
+            }
+          );
+        }
+  
+        const data = await response.json();
+        return new Response(
+          JSON.stringify(data),
+          { 
+            status: 200,
+            headers: { 'Content-Type': 'application/json' }
+          }
+        );
+      } catch (error) {
+        console.error('Error fetching invoice PDF:', error);
+        return new Response(
+          JSON.stringify({ 
+            error: 'Failed to fetch invoice PDF', 
+            details: error instanceof Error ? error.message : String(error)
+          }),
+          { 
+            status: 500,
+            headers: { 'Content-Type': 'application/json' }
+          }
+        );
+      }
+    }
+  } 

package/dist/api/api/handlePaidInvoices.ts

@@ -0,0 +1,77 @@
+export function handlePaidInvoices(apiKey: string, apiBase?: string) {
+    return async function GET(
+      _: Request,
+      { params }: { params: { accountExternalId: string } }
+    ) {
+      try {
+        
+        if (!apiBase) {
+            apiBase = 'https://api.agentpaid.io';
+        }
+
+        const { accountExternalId } = params;
+  
+        if (!apiKey) {
+          console.log('handlePaidInvoices - No API key provided');
+          return new Response(
+            JSON.stringify({ error: 'API key not configured' }),
+            { 
+              status: 500,
+              headers: { 'Content-Type': 'application/json' }
+            }
+          );
+        }
+
+        const url = `${apiBase}/api/organizations/org/customer/external/${accountExternalId}/invoices`;
+
+        const response = await fetch(url, {
+            headers: {
+              'Authorization': `Bearer ${apiKey}`,
+            },
+          }
+        );
+
+        if (!response.ok) {
+          let errorMessage = `HTTP ${response.status}: ${response.statusText}`;
+          try {
+            // Try to read as JSON first
+            const errorData = await response.json();
+            errorMessage = errorData.error || errorData.message || errorMessage;
+          } catch (parseError) {
+            // If JSON parsing fails, the body has been consumed, so we can't read it as text
+            // Just use the HTTP status message
+            console.log('handlePaidInvoices - Could not parse error response as JSON');
+          }
+          
+          return new Response(
+            JSON.stringify({ error: errorMessage }),
+            { 
+              status: response.status,
+              headers: { 'Content-Type': 'application/json' }
+            }
+          );
+        }
+  
+        const data = await response.json();
+        return new Response(
+          JSON.stringify(data),
+          { 
+            status: 200,
+            headers: { 'Content-Type': 'application/json' }
+          }
+        );
+      } catch (error) {
+        console.error('Error fetching invoices:', error);
+        return new Response(
+          JSON.stringify({ 
+            error: 'Failed to fetch invoices', 
+            details: error instanceof Error ? error.message : String(error)
+          }),
+          { 
+            status: 500,
+            headers: { 'Content-Type': 'application/json' }
+          }
+        );
+      }
+    }
+  } 

package/dist/api/api/handlePaidPayments.ts

@@ -0,0 +1,77 @@
+export function handlePaidPayments(apiKey: string, apiBase?: string) {
+    return async function GET(
+      _: Request,
+      { params }: { params: { accountExternalId: string } }
+    ) {
+      try {
+        
+        if (!apiBase) {
+            apiBase = 'https://api.agentpaid.io';
+        }
+
+        const { accountExternalId } = params;
+  
+        if (!apiKey) {
+          console.log('handlePaidPayments - No API key provided');
+          return new Response(
+            JSON.stringify({ error: 'API key not configured' }),
+            { 
+              status: 500,
+              headers: { 'Content-Type': 'application/json' }
+            }
+          );
+        }
+
+        const url = `${apiBase}/api/organizations/org/customer/external/${accountExternalId}/payments`;
+
+        const response = await fetch(url, {
+            headers: {
+              'Authorization': `Bearer ${apiKey}`,
+            },
+          }
+        );
+
+        if (!response.ok) {
+          let errorMessage = `HTTP ${response.status}: ${response.statusText}`;
+          try {
+            // Try to read as JSON first
+            const errorData = await response.json();
+            errorMessage = errorData.error || errorData.message || errorMessage;
+          } catch (parseError) {
+            // If JSON parsing fails, the body has been consumed, so we can't read it as text
+            // Just use the HTTP status message
+            console.log('handlePaidPayments - Could not parse error response as JSON');
+          }
+          
+          return new Response(
+            JSON.stringify({ error: errorMessage }),
+            { 
+              status: response.status,
+              headers: { 'Content-Type': 'application/json' }
+            }
+          );
+        }
+  
+        const data = await response.json();
+        return new Response(
+          JSON.stringify(data),
+          { 
+            status: 200,
+            headers: { 'Content-Type': 'application/json' }
+          }
+        );
+      } catch (error) {
+        console.error('Error fetching payments:', error);
+        return new Response(
+          JSON.stringify({ 
+            error: 'Failed to fetch payments', 
+            details: error instanceof Error ? error.message : String(error)
+          }),
+          { 
+            status: 500,
+            headers: { 'Content-Type': 'application/json' }
+          }
+        );
+      }
+    }
+  } 

package/dist/api/handlePaidInvoicePdf.d.ts

@@ -0,0 +1,6 @@
+export declare function handlePaidInvoicePdf(apiKey: string, apiBase?: string): (_: Request, { params }: {
+    params: {
+        invoiceId: string;
+    };
+}) => Promise<Response>;
+//# sourceMappingURL=handlePaidInvoicePdf.d.ts.map

package/dist/api/handlePaidInvoicePdf.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"handlePaidInvoicePdf.d.ts","sourceRoot":"","sources":["../../src/api/handlePaidInvoicePdf.ts"],"names":[],"mappings":"AAAA,wBAAgB,oBAAoB,CAAC,MAAM,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,MAAM,OAE5D,OAAO;YACY;QAAE,SAAS,EAAE,MAAM,CAAA;KAAE;wBA2E9C"}

package/dist/api/handlePaidInvoicePdf.js

@@ -0,0 +1,60 @@
+export function handlePaidInvoicePdf(apiKey, apiBase) {
+    return async function GET(_, { params }) {
+        try {
+            if (!apiBase) {
+                apiBase = 'https://api.agentpaid.io';
+            }
+            const { invoiceId } = params;
+            if (!apiKey) {
+                return new Response(JSON.stringify({ error: 'API key not configured' }), {
+                    status: 500,
+                    headers: { 'Content-Type': 'application/json' }
+                });
+            }
+            const url = `${apiBase}/api/organizations/org/invoices/${invoiceId}/pdf`;
+            const response = await fetch(url, {
+                headers: {
+                    'Authorization': `Bearer ${apiKey}`,
+                },
+            });
+            if (!response.ok) {
+                let errorMessage = `HTTP ${response.status}: ${response.statusText}`;
+                try {
+                    const errorData = await response.json();
+                    errorMessage = errorData.error || errorData.message || errorMessage;
+                }
+                catch (parseError) {
+                    try {
+                        const errorText = await response.text();
+                        if (errorText) {
+                            errorMessage = errorText;
+                        }
+                    }
+                    catch (textError) {
+                        console.log('handlePaidInvoicePdf - Could not parse error response');
+                    }
+                }
+                return new Response(JSON.stringify({ error: errorMessage }), {
+                    status: response.status,
+                    headers: { 'Content-Type': 'application/json' }
+                });
+            }
+            const data = await response.json();
+            return new Response(JSON.stringify(data), {
+                status: 200,
+                headers: { 'Content-Type': 'application/json' }
+            });
+        }
+        catch (error) {
+            console.error('Error fetching invoice PDF:', error);
+            return new Response(JSON.stringify({
+                error: 'Failed to fetch invoice PDF',
+                details: error instanceof Error ? error.message : String(error)
+            }), {
+                status: 500,
+                headers: { 'Content-Type': 'application/json' }
+            });
+        }
+    };
+}
+//# sourceMappingURL=handlePaidInvoicePdf.js.map

package/dist/api/handlePaidInvoicePdf.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"handlePaidInvoicePdf.js","sourceRoot":"","sources":["../../src/api/handlePaidInvoicePdf.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,oBAAoB,CAAC,MAAc,EAAE,OAAgB;IACjE,OAAO,KAAK,UAAU,GAAG,CACvB,CAAU,EACV,EAAE,MAAM,EAAqC;QAE7C,IAAI,CAAC;YACH,IAAI,CAAC,OAAO,EAAE,CAAC;gBACX,OAAO,GAAG,0BAA0B,CAAC;YACzC,CAAC;YAED,MAAM,EAAE,SAAS,EAAE,GAAG,MAAM,CAAC;YAE7B,IAAI,CAAC,MAAM,EAAE,CAAC;gBACZ,OAAO,IAAI,QAAQ,CACjB,IAAI,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,wBAAwB,EAAE,CAAC,EACnD;oBACE,MAAM,EAAE,GAAG;oBACX,OAAO,EAAE,EAAE,cAAc,EAAE,kBAAkB,EAAE;iBAChD,CACF,CAAC;YACJ,CAAC;YAED,MAAM,GAAG,GAAG,GAAG,OAAO,mCAAmC,SAAS,MAAM,CAAC;YAEzE,MAAM,QAAQ,GAAG,MAAM,KAAK,CAAC,GAAG,EAAE;gBAC9B,OAAO,EAAE;oBACP,eAAe,EAAE,UAAU,MAAM,EAAE;iBACpC;aACF,CACF,CAAC;YAEF,IAAI,CAAC,QAAQ,CAAC,EAAE,EAAE,CAAC;gBACjB,IAAI,YAAY,GAAG,QAAQ,QAAQ,CAAC,MAAM,KAAK,QAAQ,CAAC,UAAU,EAAE,CAAC;gBACrE,IAAI,CAAC;oBACH,MAAM,SAAS,GAAG,MAAM,QAAQ,CAAC,IAAI,EAAE,CAAC;oBACxC,YAAY,GAAG,SAAS,CAAC,KAAK,IAAI,SAAS,CAAC,OAAO,IAAI,YAAY,CAAC;gBACtE,CAAC;gBAAC,OAAO,UAAU,EAAE,CAAC;oBACpB,IAAI,CAAC;wBACH,MAAM,SAAS,GAAG,MAAM,QAAQ,CAAC,IAAI,EAAE,CAAC;wBACxC,IAAI,SAAS,EAAE,CAAC;4BACd,YAAY,GAAG,SAAS,CAAC;wBAC3B,CAAC;oBACH,CAAC;oBAAC,OAAO,SAAS,EAAE,CAAC;wBACnB,OAAO,CAAC,GAAG,CAAC,uDAAuD,CAAC,CAAC;oBACvE,CAAC;gBACH,CAAC;gBAED,OAAO,IAAI,QAAQ,CACjB,IAAI,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,CAAC,EACvC;oBACE,MAAM,EAAE,QAAQ,CAAC,MAAM;oBACvB,OAAO,EAAE,EAAE,cAAc,EAAE,kBAAkB,EAAE;iBAChD,CACF,CAAC;YACJ,CAAC;YAED,MAAM,IAAI,GAAG,MAAM,QAAQ,CAAC,IAAI,EAAE,CAAC;YACnC,OAAO,IAAI,QAAQ,CACjB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,EACpB;gBACE,MAAM,EAAE,GAAG;gBACX,OAAO,EAAE,EAAE,cAAc,EAAE,kBAAkB,EAAE;aAChD,CACF,CAAC;QACJ,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YACf,OAAO,CAAC,KAAK,CAAC,6BAA6B,EAAE,KAAK,CAAC,CAAC;YACpD,OAAO,IAAI,QAAQ,CACjB,IAAI,CAAC,SAAS,CAAC;gBACb,KAAK,EAAE,6BAA6B;gBACpC,OAAO,EAAE,KAAK,YAAY,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;aAChE,CAAC,EACF;gBACE,MAAM,EAAE,GAAG;gBACX,OAAO,EAAE,EAAE,cAAc,EAAE,kBAAkB,EAAE;aAChD,CACF,CAAC;QACJ,CAAC;IACH,CAAC,CAAA;AACH,CAAC"}

package/dist/api/handlePaidInvoices.d.ts

@@ -0,0 +1,6 @@
+export declare function handlePaidInvoices(apiKey: string, apiBase?: string): (_: Request, { params }: {
+    params: {
+        accountExternalId: string;
+    };
+}) => Promise<Response>;
+//# sourceMappingURL=handlePaidInvoices.d.ts.map

package/dist/api/handlePaidInvoices.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"handlePaidInvoices.d.ts","sourceRoot":"","sources":["../../src/api/handlePaidInvoices.ts"],"names":[],"mappings":"AAAA,wBAAgB,kBAAkB,CAAC,MAAM,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,MAAM,OAE1D,OAAO;YACY;QAAE,iBAAiB,EAAE,MAAM,CAAA;KAAE;wBAyEtD"}

package/dist/api/handlePaidInvoices.js

@@ -0,0 +1,56 @@
+export function handlePaidInvoices(apiKey, apiBase) {
+    return async function GET(_, { params }) {
+        try {
+            if (!apiBase) {
+                apiBase = 'https://api.agentpaid.io';
+            }
+            const { accountExternalId } = params;
+            if (!apiKey) {
+                console.log('handlePaidInvoices - No API key provided');
+                return new Response(JSON.stringify({ error: 'API key not configured' }), {
+                    status: 500,
+                    headers: { 'Content-Type': 'application/json' }
+                });
+            }
+            const url = `${apiBase}/api/organizations/org/customer/external/${accountExternalId}/invoices`;
+            const response = await fetch(url, {
+                headers: {
+                    'Authorization': `Bearer ${apiKey}`,
+                },
+            });
+            if (!response.ok) {
+                let errorMessage = `HTTP ${response.status}: ${response.statusText}`;
+                try {
+                    // Try to read as JSON first
+                    const errorData = await response.json();
+                    errorMessage = errorData.error || errorData.message || errorMessage;
+                }
+                catch (parseError) {
+                    // If JSON parsing fails, the body has been consumed, so we can't read it as text
+                    // Just use the HTTP status message
+                    console.log('handlePaidInvoices - Could not parse error response as JSON');
+                }
+                return new Response(JSON.stringify({ error: errorMessage }), {
+                    status: response.status,
+                    headers: { 'Content-Type': 'application/json' }
+                });
+            }
+            const data = await response.json();
+            return new Response(JSON.stringify(data), {
+                status: 200,
+                headers: { 'Content-Type': 'application/json' }
+            });
+        }
+        catch (error) {
+            console.error('Error fetching invoices:', error);
+            return new Response(JSON.stringify({
+                error: 'Failed to fetch invoices',
+                details: error instanceof Error ? error.message : String(error)
+            }), {
+                status: 500,
+                headers: { 'Content-Type': 'application/json' }
+            });
+        }
+    };
+}
+//# sourceMappingURL=handlePaidInvoices.js.map

package/dist/api/handlePaidInvoices.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"handlePaidInvoices.js","sourceRoot":"","sources":["../../src/api/handlePaidInvoices.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,kBAAkB,CAAC,MAAc,EAAE,OAAgB;IAC/D,OAAO,KAAK,UAAU,GAAG,CACvB,CAAU,EACV,EAAE,MAAM,EAA6C;QAErD,IAAI,CAAC;YAEH,IAAI,CAAC,OAAO,EAAE,CAAC;gBACX,OAAO,GAAG,0BAA0B,CAAC;YACzC,CAAC;YAED,MAAM,EAAE,iBAAiB,EAAE,GAAG,MAAM,CAAC;YAErC,IAAI,CAAC,MAAM,EAAE,CAAC;gBACZ,OAAO,CAAC,GAAG,CAAC,0CAA0C,CAAC,CAAC;gBACxD,OAAO,IAAI,QAAQ,CACjB,IAAI,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,wBAAwB,EAAE,CAAC,EACnD;oBACE,MAAM,EAAE,GAAG;oBACX,OAAO,EAAE,EAAE,cAAc,EAAE,kBAAkB,EAAE;iBAChD,CACF,CAAC;YACJ,CAAC;YAED,MAAM,GAAG,GAAG,GAAG,OAAO,4CAA4C,iBAAiB,WAAW,CAAC;YAE/F,MAAM,QAAQ,GAAG,MAAM,KAAK,CAAC,GAAG,EAAE;gBAC9B,OAAO,EAAE;oBACP,eAAe,EAAE,UAAU,MAAM,EAAE;iBACpC;aACF,CACF,CAAC;YAEF,IAAI,CAAC,QAAQ,CAAC,EAAE,EAAE,CAAC;gBACjB,IAAI,YAAY,GAAG,QAAQ,QAAQ,CAAC,MAAM,KAAK,QAAQ,CAAC,UAAU,EAAE,CAAC;gBACrE,IAAI,CAAC;oBACH,4BAA4B;oBAC5B,MAAM,SAAS,GAAG,MAAM,QAAQ,CAAC,IAAI,EAAE,CAAC;oBACxC,YAAY,GAAG,SAAS,CAAC,KAAK,IAAI,SAAS,CAAC,OAAO,IAAI,YAAY,CAAC;gBACtE,CAAC;gBAAC,OAAO,UAAU,EAAE,CAAC;oBACpB,iFAAiF;oBACjF,mCAAmC;oBACnC,OAAO,CAAC,GAAG,CAAC,6DAA6D,CAAC,CAAC;gBAC7E,CAAC;gBAED,OAAO,IAAI,QAAQ,CACjB,IAAI,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,CAAC,EACvC;oBACE,MAAM,EAAE,QAAQ,CAAC,MAAM;oBACvB,OAAO,EAAE,EAAE,cAAc,EAAE,kBAAkB,EAAE;iBAChD,CACF,CAAC;YACJ,CAAC;YAED,MAAM,IAAI,GAAG,MAAM,QAAQ,CAAC,IAAI,EAAE,CAAC;YACnC,OAAO,IAAI,QAAQ,CACjB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,EACpB;gBACE,MAAM,EAAE,GAAG;gBACX,OAAO,EAAE,EAAE,cAAc,EAAE,kBAAkB,EAAE;aAChD,CACF,CAAC;QACJ,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YACf,OAAO,CAAC,KAAK,CAAC,0BAA0B,EAAE,KAAK,CAAC,CAAC;YACjD,OAAO,IAAI,QAAQ,CACjB,IAAI,CAAC,SAAS,CAAC;gBACb,KAAK,EAAE,0BAA0B;gBACjC,OAAO,EAAE,KAAK,YAAY,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;aAChE,CAAC,EACF;gBACE,MAAM,EAAE,GAAG;gBACX,OAAO,EAAE,EAAE,cAAc,EAAE,kBAAkB,EAAE;aAChD,CACF,CAAC;QACJ,CAAC;IACH,CAAC,CAAA;AACH,CAAC"}

package/dist/api/handlePaidPayments.d.ts

@@ -0,0 +1,6 @@
+export declare function handlePaidPayments(apiKey: string, apiBase?: string): (_: Request, { params }: {
+    params: {
+        accountExternalId: string;
+    };
+}) => Promise<Response>;
+//# sourceMappingURL=handlePaidPayments.d.ts.map

package/dist/api/handlePaidPayments.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"handlePaidPayments.d.ts","sourceRoot":"","sources":["../../src/api/handlePaidPayments.ts"],"names":[],"mappings":"AAAA,wBAAgB,kBAAkB,CAAC,MAAM,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,MAAM,OAE1D,OAAO;YACY;QAAE,iBAAiB,EAAE,MAAM,CAAA;KAAE;wBAyEtD"}

package/dist/api/handlePaidPayments.js

@@ -0,0 +1,56 @@
+export function handlePaidPayments(apiKey, apiBase) {
+    return async function GET(_, { params }) {
+        try {
+            if (!apiBase) {
+                apiBase = 'https://api.agentpaid.io';
+            }
+            const { accountExternalId } = params;
+            if (!apiKey) {
+                console.log('handlePaidPayments - No API key provided');
+                return new Response(JSON.stringify({ error: 'API key not configured' }), {
+                    status: 500,
+                    headers: { 'Content-Type': 'application/json' }
+                });
+            }
+            const url = `${apiBase}/api/organizations/org/customer/external/${accountExternalId}/payments`;
+            const response = await fetch(url, {
+                headers: {
+                    'Authorization': `Bearer ${apiKey}`,
+                },
+            });
+            if (!response.ok) {
+                let errorMessage = `HTTP ${response.status}: ${response.statusText}`;
+                try {
+                    // Try to read as JSON first
+                    const errorData = await response.json();
+                    errorMessage = errorData.error || errorData.message || errorMessage;
+                }
+                catch (parseError) {
+                    // If JSON parsing fails, the body has been consumed, so we can't read it as text
+                    // Just use the HTTP status message
+                    console.log('handlePaidPayments - Could not parse error response as JSON');
+                }
+                return new Response(JSON.stringify({ error: errorMessage }), {
+                    status: response.status,
+                    headers: { 'Content-Type': 'application/json' }
+                });
+            }
+            const data = await response.json();
+            return new Response(JSON.stringify(data), {
+                status: 200,
+                headers: { 'Content-Type': 'application/json' }
+            });
+        }
+        catch (error) {
+            console.error('Error fetching payments:', error);
+            return new Response(JSON.stringify({
+                error: 'Failed to fetch payments',
+                details: error instanceof Error ? error.message : String(error)
+            }), {
+                status: 500,
+                headers: { 'Content-Type': 'application/json' }
+            });
+        }
+    };
+}
+//# sourceMappingURL=handlePaidPayments.js.map

package/dist/api/handlePaidPayments.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"handlePaidPayments.js","sourceRoot":"","sources":["../../src/api/handlePaidPayments.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,kBAAkB,CAAC,MAAc,EAAE,OAAgB;IAC/D,OAAO,KAAK,UAAU,GAAG,CACvB,CAAU,EACV,EAAE,MAAM,EAA6C;QAErD,IAAI,CAAC;YAEH,IAAI,CAAC,OAAO,EAAE,CAAC;gBACX,OAAO,GAAG,0BAA0B,CAAC;YACzC,CAAC;YAED,MAAM,EAAE,iBAAiB,EAAE,GAAG,MAAM,CAAC;YAErC,IAAI,CAAC,MAAM,EAAE,CAAC;gBACZ,OAAO,CAAC,GAAG,CAAC,0CAA0C,CAAC,CAAC;gBACxD,OAAO,IAAI,QAAQ,CACjB,IAAI,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,wBAAwB,EAAE,CAAC,EACnD;oBACE,MAAM,EAAE,GAAG;oBACX,OAAO,EAAE,EAAE,cAAc,EAAE,kBAAkB,EAAE;iBAChD,CACF,CAAC;YACJ,CAAC;YAED,MAAM,GAAG,GAAG,GAAG,OAAO,4CAA4C,iBAAiB,WAAW,CAAC;YAE/F,MAAM,QAAQ,GAAG,MAAM,KAAK,CAAC,GAAG,EAAE;gBAC9B,OAAO,EAAE;oBACP,eAAe,EAAE,UAAU,MAAM,EAAE;iBACpC;aACF,CACF,CAAC;YAEF,IAAI,CAAC,QAAQ,CAAC,EAAE,EAAE,CAAC;gBACjB,IAAI,YAAY,GAAG,QAAQ,QAAQ,CAAC,MAAM,KAAK,QAAQ,CAAC,UAAU,EAAE,CAAC;gBACrE,IAAI,CAAC;oBACH,4BAA4B;oBAC5B,MAAM,SAAS,GAAG,MAAM,QAAQ,CAAC,IAAI,EAAE,CAAC;oBACxC,YAAY,GAAG,SAAS,CAAC,KAAK,IAAI,SAAS,CAAC,OAAO,IAAI,YAAY,CAAC;gBACtE,CAAC;gBAAC,OAAO,UAAU,EAAE,CAAC;oBACpB,iFAAiF;oBACjF,mCAAmC;oBACnC,OAAO,CAAC,GAAG,CAAC,6DAA6D,CAAC,CAAC;gBAC7E,CAAC;gBAED,OAAO,IAAI,QAAQ,CACjB,IAAI,CAAC,SAAS,CAAC,EAAE,KAAK,EAAE,YAAY,EAAE,CAAC,EACvC;oBACE,MAAM,EAAE,QAAQ,CAAC,MAAM;oBACvB,OAAO,EAAE,EAAE,cAAc,EAAE,kBAAkB,EAAE;iBAChD,CACF,CAAC;YACJ,CAAC;YAED,MAAM,IAAI,GAAG,MAAM,QAAQ,CAAC,IAAI,EAAE,CAAC;YACnC,OAAO,IAAI,QAAQ,CACjB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,EACpB;gBACE,MAAM,EAAE,GAAG;gBACX,OAAO,EAAE,EAAE,cAAc,EAAE,kBAAkB,EAAE;aAChD,CACF,CAAC;QACJ,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YACf,OAAO,CAAC,KAAK,CAAC,0BAA0B,EAAE,KAAK,CAAC,CAAC;YACjD,OAAO,IAAI,QAAQ,CACjB,IAAI,CAAC,SAAS,CAAC;gBACb,KAAK,EAAE,0BAA0B;gBACjC,OAAO,EAAE,KAAK,YAAY,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;aAChE,CAAC,EACF;gBACE,MAAM,EAAE,GAAG;gBACX,OAAO,EAAE,EAAE,cAAc,EAAE,kBAAkB,EAAE;aAChD,CACF,CAAC;QACJ,CAAC;IACH,CAAC,CAAA;AACH,CAAC"}

package/dist/components/PaidActivityLog.d.ts

@@ -1,8 +1,34 @@
 import React from 'react';
 import '../styles/activity-log-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;
+}
 interface PaidActivityLogProps {
     accountExternalId: string;
-    host?: string;
+    paidStyle?: PaidStyleProperties;
 }
 export declare const PaidActivityLog: React.FC<PaidActivityLogProps>;
 export {};

package/dist/components/PaidActivityLog.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PaidActivityLog.d.ts","sourceRoot":"","sources":["../../src/components/PaidActivityLog.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA8B,MAAM,OAAO,CAAC;AACnD,OAAO,kCAAkC,CAAC;AAoB1C,UAAU,oBAAoB;IAC1B,iBAAiB,EAAE,MAAM,CAAC;IAC1B,IAAI,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAoH1D,CAAC"}
+{"version":3,"file":"PaidActivityLog.d.ts","sourceRoot":"","sources":["../../src/components/PaidActivityLog.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAGnD,OAAO,kCAAkC,CAAC;AAE1C,UAAU,mBAAmB;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,cAAc,CAAC,EAAE,MAAM,CAAC;CAC3B;AAyBD,UAAU,oBAAoB;IAC1B,iBAAiB,EAAE,MAAM,CAAC;IAC1B,SAAS,CAAC,EAAE,mBAAmB,CAAC;CACnC;AAED,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAuI1D,CAAC"}

package/dist/components/PaidActivityLog.js

@@ -1,12 +1,27 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useState } from 'react';
+import { useIsInContainer } from './PaidContainer';
 import '../styles/activity-log-table.css';
-export const PaidActivityLog = ({ accountExternalId, host }) => {
+export const PaidActivityLog = ({ accountExternalId, paidStyle = {} }) => {
     const [usageSummaries, setUsageSummaries] = useState([]);
     const [loading, setLoading] = useState(true);
     const [error, setError] = useState(null);
-    const [showAll, setShowAll] = useState(false);
+    const isInContainer = useIsInContainer();
+    // Convert paidStyle entries into CSS custom properties
+    const cssVariables = Object.entries(paidStyle).reduce((vars, [key, value]) => {
+        let varName;
+        if (key.startsWith('--')) {
+            varName = key;
+        }
+        else {
+            const raw = key.replace(/([A-Z])/g, '-$1').toLowerCase();
+            varName = raw.startsWith('--') ? raw : `--${raw}`;
+        }
+        // @ts-ignore allow custom property
+        vars[varName] = value;
+        return vars;
+    }, {});
     const formatCurrency = (amount) => {
         return new Intl.NumberFormat("en-US", {
             style: "currency",
@@ -32,9 +47,17 @@ export const PaidActivityLog = ({ accountExternalId, host }) => {
         const fetchUsageData = async () => {
             try {
                 setLoading(true);
+                // TEMPORARILY DISABLED: Use cached fetch for usage data
+                // const cacheKey = getCacheKey.usage(accountExternalId);
+                // const data = await cachedFetch<UsageApiResponse>(
+                //     `/api/usage/${accountExternalId}`,
+                //     cacheKey,
+                //     CACHE_TTL.DATA
+                // );
+                // Direct fetch without caching
                 const response = await fetch(`/api/usage/${accountExternalId}`);
                 if (!response.ok) {
-                    throw new Error('Failed to fetch usage data');
+                    throw new Error(`Failed to fetch: ${response.statusText}`);
                 }
                 const data = await response.json();
                 const mappedUsageSummaries = (data.data.usageSummary || []).map((summary) => ({
@@ -52,14 +75,13 @@ export const PaidActivityLog = ({ accountExternalId, host }) => {
         };
         fetchUsageData();
     }, [accountExternalId]);
-    const displayedSummaries = showAll ? usageSummaries : usageSummaries.slice(0, 4);
-    const hasMoreSummaries = usageSummaries.length > 4;
+    const displayedSummaries = usageSummaries;
     if (loading) {
         return _jsx("div", { children: "Loading usage data..." });
     }
     if (error) {
         return _jsxs("div", { children: ["Error: ", error] });
     }
-    return (_jsx("div", { className: "paid-activity-log-container", style: { position: 'relative', minWidth: 0 }, children: _jsxs("div", { className: "paid-activity-log-table-wrapper", style: { position: 'static', width: '100%', height: 'auto', left: undefined, top: undefined, boxShadow: undefined, cursor: undefined }, children: [_jsxs("div", { className: "paid-activity-log-header", children: [_jsx("h3", { className: "paid-activity-log-title", children: "Paid.ai Activity Log" }), hasMoreSummaries && (_jsx("button", { onClick: () => setShowAll(!showAll), className: "paid-activity-log-toggle-btn", children: showAll ? 'Show less' : 'Show all usage' }))] }), _jsx("div", { style: { background: '#fff', overflow: 'auto' }, children: _jsxs("table", { className: "paid-activity-log-table", children: [_jsx("thead", { children: _jsxs("tr", { children: [_jsx("th", { children: "Event" }), _jsx("th", { children: "Start Date" }), _jsx("th", { children: "End Date" }), _jsx("th", { style: { textAlign: 'center' }, children: "Current Usage" }), _jsx("th", { style: { textAlign: 'center' }, children: "Total" })] }) }), _jsx("tbody", { children: displayedSummaries.length === 0 ? (_jsx("tr", { children: _jsx("td", { colSpan: 5, className: "paid-activity-log-empty", children: "No usage data found" }) })) : (displayedSummaries.map((summary) => (_jsxs("tr", { children: [_jsx("td", { style: { fontWeight: 500 }, children: formatEventName(summary.eventName) }), _jsx("td", { children: formatDate(summary.startDate) }), _jsx("td", { children: formatDate(summary.endDate) }), _jsx("td", { style: { textAlign: 'center' }, children: summary.eventsQuantity }), _jsx("td", { style: { textAlign: 'center', fontWeight: 500 }, children: formatCurrency(summary.subtotal) })] }, summary.id)))) })] }) })] }) }));
+    return (_jsx("div", { className: "paid-activity-log-container", style: { position: 'relative', minWidth: 0, ...cssVariables }, children: _jsxs("div", { className: "paid-activity-log-table-wrapper", style: { position: 'static', width: '100%', height: 'auto', left: undefined, top: undefined, boxShadow: undefined, cursor: undefined }, children: [!isInContainer && (_jsx("div", { className: "paid-activity-log-header", children: _jsx("h3", { className: "paid-activity-log-title", children: "Paid.ai Activity Log" }) })), _jsx("div", { style: { background: '#fff', overflow: 'auto' }, children: _jsxs("table", { className: "paid-activity-log-table", children: [_jsx("thead", { children: _jsxs("tr", { children: [_jsx("th", { children: "Event" }), _jsx("th", { children: "Start Date" }), _jsx("th", { children: "End Date" }), _jsx("th", { style: { textAlign: 'center' }, children: "Current Usage" }), _jsx("th", { style: { textAlign: 'center' }, children: "Total" })] }) }), _jsx("tbody", { children: displayedSummaries.length === 0 ? (_jsx("tr", { children: _jsx("td", { colSpan: 5, className: "paid-activity-log-empty", children: "No usage data found" }) })) : (displayedSummaries.map((summary) => (_jsxs("tr", { children: [_jsx("td", { style: { fontWeight: 500 }, children: formatEventName(summary.eventName) }), _jsx("td", { children: formatDate(summary.startDate) }), _jsx("td", { children: formatDate(summary.endDate) }), _jsx("td", { style: { textAlign: 'center' }, children: summary.eventsQuantity }), _jsx("td", { style: { textAlign: 'center', fontWeight: 500 }, children: formatCurrency(summary.subtotal) })] }, summary.id)))) })] }) })] }) }));
 };
 //# sourceMappingURL=PaidActivityLog.js.map