rebill-web-components-sdk 1.8.5 → 1.8.6

package/dist/components/{p-tWMR1_gF.js → p-fStqPH4y.js}

@@ -8389,7 +8389,7 @@ class ReceiptTemplate {
             justify-content: center;
           }
 
-          .container {
+          .rb-receipt-container {
             max-width: 360px;
             width: 100%;
             background: white;
@@ -8399,7 +8399,7 @@ class ReceiptTemplate {
             margin: 20px;
           }
 
-          .header {
+          .rb-receipt-header {
             display: flex;
             justify-content: flex-start;
             align-items: center;
@@ -8409,7 +8409,7 @@ class ReceiptTemplate {
             border-bottom: 1px solid #e5e7eb;
           }
 
-          .logo {
+          .rb-receipt-logo {
             display: flex;
             align-items: center;
             gap: 6px;
@@ -8418,12 +8418,12 @@ class ReceiptTemplate {
             height: 24px;
           }
 
-          .logo img {
+          .rb-receipt-logo img {
             max-height: 24px;
             max-width: 72px;
           }
 
-          .main-content {
+          .rb-receipt-main-content {
             display: flex;
             justify-content: center;
             align-items: center;
@@ -8431,7 +8431,7 @@ class ReceiptTemplate {
             min-height: 180px;
           }
 
-          .success-content {
+          .rb-receipt-success-content {
             display: flex;
             flex-direction: column;
             align-items: center;
@@ -8440,7 +8440,7 @@ class ReceiptTemplate {
             width: 100%;
           }
 
-          .success-title {
+          .rb-receipt-success-title {
             font-size: 12px;
             font-weight: 700;
             color: #1f2937;
@@ -8449,18 +8449,18 @@ class ReceiptTemplate {
             text-align: center;
           }
 
-          .success-icon {
+          .rb-receipt-success-icon {
             display: flex;
             justify-content: center;
             margin: 3px 0;
           }
 
-          .success-icon svg {
+          .rb-receipt-success-icon svg {
             width: 48px;
             height: 48px;
           }
 
-          .info-card {
+          .rb-receipt-info-card {
             padding: 10px;
             gap: 6px;
             width: 270px;
@@ -8472,7 +8472,7 @@ class ReceiptTemplate {
             margin-bottom: 6px;
           }
 
-          .card-row {
+          .rb-receipt-card-row {
             display: flex;
             justify-content: space-between;
             align-items: center;
@@ -8480,29 +8480,29 @@ class ReceiptTemplate {
             padding: 1px 0;
           }
 
-          .card-row:last-of-type {
+          .rb-receipt-card-row:last-of-type {
             margin-bottom: 0;
           }
 
-          .card-value {
+          .rb-receipt-card-value {
             display: flex;
             align-items: center;
             gap: 4px;
           }
 
-          .card-label {
+          .rb-receipt-card-label {
             font-size: 7px;
             color: #6b7280;
             font-weight: 500;
           }
 
-          .card-text {
+          .rb-receipt-card-text {
             font-size: 7px;
             color: #6b7280;
             font-weight: 600;
           }
 
-          .installments-text {
+          .rb-receipt-installments-text {
             font-size: 7px;
             color: #6b7280;
             font-weight: 600;
@@ -8511,31 +8511,31 @@ class ReceiptTemplate {
             line-height: 1.2;
           }
 
-          .card-divider {
+          .rb-receipt-card-divider {
             height: 1px;
             background: #e5e7eb;
             margin: 6px 0;
           }
 
-          .contact-info {
+          .rb-receipt-contact-info {
             text-align: left;
             margin-top: 6px;
           }
 
-          .contact-text {
+          .rb-receipt-contact-text {
             font-size: 6px;
             color: #6b7280;
             margin-bottom: 1px;
           }
 
-          .contact-email {
+          .rb-receipt-contact-email {
             font-size: 6px;
             color: #35B093;
             text-decoration: none;
             font-weight: 600;
           }
 
-          .trial-pill {
+          .rb-receipt-trial-pill {
             background-color: #d1fae5;
             border-radius: 3px;
             padding: 2px 4px;
@@ -8545,13 +8545,13 @@ class ReceiptTemplate {
             margin-right: 4px;
           }
 
-          .trial-pill-text {
+          .rb-receipt-trial-pill-text {
             font-size: 6px;
             color: #059669;
             font-weight: 600;
           }
 
-          .total-amount-container {
+          .rb-receipt-total-amount-container {
             display: flex;
             align-items: center;
             justify-content: flex-end;
@@ -8559,32 +8559,32 @@ class ReceiptTemplate {
             flex-direction: row;
           }
 
-          .next-charge-section {
+          .rb-receipt-next-charge-section {
             margin-top: 6px;
             padding-top: 6px;
           }
 
-          .next-charge-header {
+          .rb-receipt-next-charge-header {
             display: flex;
             justify-content: space-between;
             align-items: flex-start;
             margin-bottom: 4px;
           }
 
-          .next-charge-title {
+          .rb-receipt-next-charge-title {
             font-size: 7px;
             font-weight: 600;
             color: #1f2937;
           }
 
-          .next-charge-date {
+          .rb-receipt-next-charge-date {
             font-size: 7px;
             font-weight: 600;
             color: #1f2937;
             text-align: right;
           }
 
-          .next-charge-row {
+          .rb-receipt-next-charge-row {
             display: flex;
             justify-content: space-between;
             align-items: center;
@@ -8592,13 +8592,13 @@ class ReceiptTemplate {
             padding: 1px 0;
           }
 
-          .next-charge-description {
+          .rb-receipt-next-charge-description {
             font-size: 6px;
             color: #6b7280;
             font-weight: 500;
           }
 
-          .next-charge-amount {
+          .rb-receipt-next-charge-amount {
             font-size: 6px;
             color: #6b7280;
             font-weight: 600;
@@ -8610,7 +8610,7 @@ class ReceiptTemplate {
               padding: 0;
             }
 
-            .container {
+            .rb-receipt-container {
               box-shadow: none;
               border: 1px solid #ddd;
             }
@@ -8618,12 +8618,12 @@ class ReceiptTemplate {
         </style>
       </head>
       <body>
-        <div class="container">
-          <div class="main-content">
-            <div class="success-content">
-              <div class="success-title">${I18nService.translate('processing.successTitle')}</div>
+        <div class="rb-receipt-container">
+          <div class="rb-receipt-main-content">
+            <div class="rb-receipt-success-content">
+              <div class="rb-receipt-success-title">${I18nService.translate('processing.successTitle')}</div>
 
-              <div class="success-icon">
+              <div class="rb-receipt-success-icon">
                 <svg viewBox="0 0 96 96" fill="none" xmlns="http://www.w3.org/2000/svg">
                   <path
                     fill-rule="evenodd"
@@ -8634,103 +8634,103 @@ class ReceiptTemplate {
                 </svg>
               </div>
 
-              <div class="info-card">
-                <div class="card-row">
-                  <div class="card-label">${I18nService.translate('processing.paymentMethod')}</div>
-                  <div class="card-value">
+              <div class="rb-receipt-info-card">
+                <div class="rb-receipt-card-row">
+                  <div class="rb-receipt-card-label">${I18nService.translate('processing.paymentMethod')}</div>
+                  <div class="rb-receipt-card-value">
                     ${data.isBankTransfer ? '' : getCardIconSVG(data.cardBrand)}
-                    <span class="card-text">${data.isBankTransfer ? I18nService.translate('paymentMethods.bank_transfer') : data.cardBrand && data.cardLastFour ? `${data.cardBrand} - ${data.cardLastFour}` : data.cardBrand || ''}</span>
+                    <span class="rb-receipt-card-text">${data.isBankTransfer ? I18nService.translate('paymentMethods.bank_transfer') : data.cardBrand && data.cardLastFour ? `${data.cardBrand} - ${data.cardLastFour}` : data.cardBrand || ''}</span>
                   </div>
                 </div>
 
                 ${data.installments
             ? `
-                <div class="card-row">
-                  <div class="card-label">${I18nService.translate('summary.installments')}</div>
-                  <div class="installments-text">${data.installments}</div>
+                <div class="rb-receipt-card-row">
+                  <div class="rb-receipt-card-label">${I18nService.translate('summary.installments')}</div>
+                  <div class="rb-receipt-installments-text">${data.installments}</div>
                 </div>
                 `
             : ''}
 
                 ${data.discountAmount
             ? `
-                <div class="card-row">
-                  <div class="card-label">${I18nService.translate('summary.discount')}</div>
-                  <div class="card-text">${data.discountAmount}</div>
+                <div class="rb-receipt-card-row">
+                  <div class="rb-receipt-card-label">${I18nService.translate('summary.discount')}</div>
+                  <div class="rb-receipt-card-text">${data.discountAmount}</div>
                 </div>
                 `
             : ''}
-                <div class="card-row">
-                  <div class="card-label">${I18nService.translate('processing.paymentDate')}</div>
-                  <div class="card-text">${data.paymentDate}</div>
+                <div class="rb-receipt-card-row">
+                  <div class="rb-receipt-card-label">${I18nService.translate('processing.paymentDate')}</div>
+                  <div class="rb-receipt-card-text">${data.paymentDate}</div>
                 </div>
 
-                <div class="card-row">
-                  <div class="card-label">${I18nService.translate('processing.paymentEmail')}</div>
-                  <div class="card-text">${data.email}</div>
+                <div class="rb-receipt-card-row">
+                  <div class="rb-receipt-card-label">${I18nService.translate('processing.paymentEmail')}</div>
+                  <div class="rb-receipt-card-text">${data.email}</div>
                 </div>
 
-                <div class="card-row">
-                  <div class="card-label">${I18nService.translate('processing.paymentReference')}</div>
-                  <div class="card-text">${data.referenceNumber}</div>
+                <div class="rb-receipt-card-row">
+                  <div class="rb-receipt-card-label">${I18nService.translate('processing.paymentReference')}</div>
+                  <div class="rb-receipt-card-text">${data.referenceNumber}</div>
                 </div>
               </div>
 
-              <div class="info-card">
-                <div class="card-label" style="font-size: 8px; font-weight: 600; color: #1f2937; margin-bottom: 6px;">
+              <div class="rb-receipt-info-card">
+                <div class="rb-receipt-card-label" style="font-size: 8px; font-weight: 600; color: #1f2937; margin-bottom: 6px;">
                   ${I18nService.translate('processing.purchaseDetails')}
                 </div>
 
-                <div class="card-row">
-                  <div class="card-label">${I18nService.translate('processing.purchaseDetail')}</div>
-                  <div class="card-text">${data.productTitle}</div>
+                <div class="rb-receipt-card-row">
+                  <div class="rb-receipt-card-label">${I18nService.translate('processing.purchaseDetail')}</div>
+                  <div class="rb-receipt-card-text">${data.productTitle}</div>
                 </div>
 
                 ${!data.trialPeriodDays
             ? `
-                <div class="card-row">
-                  <div class="card-label">${I18nService.translate('processing.purchaseSubtotal')}</div>
-                  <div class="card-text">${data.subtotal}</div>
+                <div class="rb-receipt-card-row">
+                  <div class="rb-receipt-card-label">${I18nService.translate('processing.purchaseSubtotal')}</div>
+                  <div class="rb-receipt-card-text">${data.subtotal}</div>
                 </div>
                 `
             : ''}
 
-                <div class="card-row">
-                  <div class="card-label">${I18nService.translate('processing.purchaseTotal')}</div>
-                  <div class="total-amount-container">
+                <div class="rb-receipt-card-row">
+                  <div class="rb-receipt-card-label">${I18nService.translate('processing.purchaseTotal')}</div>
+                  <div class="rb-receipt-total-amount-container">
                     ${data.trialPeriodDays && data.trialPeriodDays > 0
             ? `
-                    <div class="trial-pill">
-                      <span class="trial-pill-text">${I18nService.translate('processing.trialPill', {
+                    <div class="rb-receipt-trial-pill">
+                      <span class="rb-receipt-trial-pill-text">${I18nService.translate('processing.trialPill', {
                 days: data.trialPeriodDays,
                 count: data.trialPeriodDays,
             })}</span>
                     </div>
                     `
             : ''}
-                    <div class="card-text">${data.total}</div>
+                    <div class="rb-receipt-card-text">${data.total}</div>
                   </div>
                 </div>
 
                 ${(data.trialPeriodDays && data.trialPeriodDays > 0) ||
             (data.debitDay && data.debitDay > 0)
             ? `
-                <div class="card-divider"></div>
+                <div class="rb-receipt-card-divider"></div>
 
-                <div class="next-charge-section">
-                  <div class="next-charge-header">
-                    <div class="next-charge-title">${I18nService.translate('processing.nextCharge')}</div>
-                    <div class="next-charge-date">${I18nService.translate('processing.onDate', {
+                <div class="rb-receipt-next-charge-section">
+                  <div class="rb-receipt-next-charge-header">
+                    <div class="rb-receipt-next-charge-title">${I18nService.translate('processing.nextCharge')}</div>
+                    <div class="rb-receipt-next-charge-date">${I18nService.translate('processing.onDate', {
                 date: data.trialPeriodDays && data.trialPeriodDays > 0
                     ? data.trialEndDate
                     : data.debitDate,
             })}</div>
                   </div>
-                  <div class="next-charge-row">
-                    <div class="next-charge-description">
+                  <div class="rb-receipt-next-charge-row">
+                    <div class="rb-receipt-next-charge-description">
                       ${data.trialPeriodDays && data.trialPeriodDays > 0 ? I18nService.translate('processing.atEndOfTrial') : ''}
                     </div>
-                    <div class="next-charge-amount">
+                    <div class="rb-receipt-next-charge-amount">
                       ${data.planAmount} ${I18nService.translate('processing.perMonth')}
                     </div>
                   </div>
@@ -8738,10 +8738,10 @@ class ReceiptTemplate {
                 `
             : ''}
 
-                <div class="card-divider"></div>
+                <div class="rb-receipt-card-divider"></div>
 
-                <div class="contact-info">
-                  <div class="contact-text">${I18nService.translate('processing.downloadDescription')}</div>
+                <div class="rb-receipt-contact-info">
+                  <div class="rb-receipt-contact-text">${I18nService.translate('processing.downloadDescription')}</div>
                 </div>
               </div>
             </div>
@@ -8760,7 +8760,7 @@ class PDFGenerator {
     static async generateAndDownloadPDF(data) {
         try {
             // Dynamically import jsPDF to avoid build issues
-            const { jsPDF } = await import('./p-LFMU1iYh.js').then(function (n) { return n.j; });
+            const { jsPDF } = await import('./p-1tbGUoeo.js').then(function (n) { return n.j; });
             // Create a temporary container for the HTML content
             const tempContainer = document.createElement('div');
             tempContainer.style.position = 'absolute';
@@ -8821,7 +8821,7 @@ class PDFGenerator {
     static async generateAndDownloadReceipt(data) {
         try {
             // Dynamically import jsPDF to avoid build issues
-            const { jsPDF } = await import('./p-LFMU1iYh.js').then(function (n) { return n.j; });
+            const { jsPDF } = await import('./p-1tbGUoeo.js').then(function (n) { return n.j; });
             // Create a temporary container for the HTML content
             const tempContainer = document.createElement('div');
             tempContainer.style.position = 'absolute';
@@ -8832,7 +8832,7 @@ class PDFGenerator {
             // Add to DOM temporarily
             document.body.appendChild(tempContainer);
             // Generate canvas from HTML
-            const canvas = await html2canvas(tempContainer.querySelector('.container'), {
+            const canvas = await html2canvas(tempContainer.querySelector('.rb-receipt-container'), {
                 backgroundColor: '#ffffff',
                 scale: 2,
                 useCORS: true,
@@ -8899,6 +8899,6 @@ class PDFGenerator {
 }
 
 export { PDFGenerator as P, html2canvas$1 as h };
-//# sourceMappingURL=p-tWMR1_gF.js.map
+//# sourceMappingURL=p-fStqPH4y.js.map
 
-//# sourceMappingURL=p-tWMR1_gF.js.map
+//# sourceMappingURL=p-fStqPH4y.js.map