rebill-web-components-sdk 1.8.3-beta.2 → 1.8.3-beta.3

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 (82) hide show
  1. package/dist/cjs/organization-logo.rebill-card-icon.rebill-checkout-single-column.rebill-footer.entry.cjs.js.map +1 -1
  2. package/dist/cjs/organization-logo_4.cjs.entry.js +2 -2
  3. package/dist/cjs/organization-logo_4.cjs.entry.js.map +1 -1
  4. package/dist/cjs/otp-component.rebill-modal-overlay.rebill-mode-sandbox.rebill-mode-sandbox-mobile.rebill-summary.success-page.user-information.entry.cjs.js.map +1 -1
  5. package/dist/cjs/otp-component_7.cjs.entry.js +8 -8
  6. package/dist/cjs/otp-component_7.cjs.entry.js.map +1 -1
  7. package/dist/cjs/rebill-footer.cjs.entry.js +2 -2
  8. package/dist/cjs/rebill-footer.cjs.entry.js.map +1 -1
  9. package/dist/cjs/rebill-footer.entry.cjs.js.map +1 -1
  10. package/dist/cjs/renewal-success-page.cjs.entry.js +1 -1
  11. package/dist/cjs/renewal-success-page.cjs.entry.js.map +1 -1
  12. package/dist/cjs/renewal-success-page.entry.cjs.js.map +1 -1
  13. package/dist/cjs/renewal-success-page.renewal-summary.entry.cjs.js.map +1 -1
  14. package/dist/cjs/renewal-success-page_2.cjs.entry.js +1 -1
  15. package/dist/cjs/renewal-success-page_2.cjs.entry.js.map +1 -1
  16. package/dist/cjs/success-page.cjs.entry.js +8 -8
  17. package/dist/cjs/success-page.cjs.entry.js.map +1 -1
  18. package/dist/cjs/success-page.entry.cjs.js.map +1 -1
  19. package/dist/collection/components/checkout/card-success-page/success-page.css +7 -7
  20. package/dist/collection/components/checkout/card-success-page/success-page.js +7 -7
  21. package/dist/collection/components/checkout/card-success-page/success-page.js.map +1 -1
  22. package/dist/collection/components/checkout/rebill-footer/rebill-footer.css +1 -1
  23. package/dist/collection/components/checkout/rebill-footer/rebill-footer.js +1 -1
  24. package/dist/collection/components/checkout/rebill-footer/rebill-footer.js.map +1 -1
  25. package/dist/collection/components/renewal/renewal-success-page/renewal-success-page.css +7 -7
  26. package/dist/components/{p-D8vRh8vG.js → p-BMR1f9Ny.js} +5 -5
  27. package/dist/components/{p-D8vRh8vG.js.map → p-BMR1f9Ny.js.map} +1 -1
  28. package/dist/components/{p-qOI5SAjq.js → p-BshrHj7X.js} +3 -3
  29. package/dist/components/{p-qOI5SAjq.js.map → p-BshrHj7X.js.map} +1 -1
  30. package/dist/components/{p-BEbMMBef.js → p-D6JNNodL.js} +4 -4
  31. package/dist/components/p-D6JNNodL.js.map +1 -0
  32. package/dist/components/{p-DQYI7toy.js → p-De6XbCCz.js} +12 -12
  33. package/dist/components/p-De6XbCCz.js.map +1 -0
  34. package/dist/components/{p-DgvctlA0.js → p-F4jLIfkG.js} +4 -4
  35. package/dist/components/{p-DgvctlA0.js.map → p-F4jLIfkG.js.map} +1 -1
  36. package/dist/components/rebill-footer2.js +2 -2
  37. package/dist/components/rebill-footer2.js.map +1 -1
  38. package/dist/components/renewal-success-page2.js +1 -1
  39. package/dist/components/renewal-success-page2.js.map +1 -1
  40. package/dist/components/success-page2.js +8 -8
  41. package/dist/components/success-page2.js.map +1 -1
  42. package/dist/esm/organization-logo.rebill-card-icon.rebill-checkout-single-column.rebill-footer.entry.js.map +1 -1
  43. package/dist/esm/organization-logo_4.entry.js +2 -2
  44. package/dist/esm/organization-logo_4.entry.js.map +1 -1
  45. package/dist/esm/otp-component.rebill-modal-overlay.rebill-mode-sandbox.rebill-mode-sandbox-mobile.rebill-summary.success-page.user-information.entry.js.map +1 -1
  46. package/dist/esm/otp-component_7.entry.js +8 -8
  47. package/dist/esm/otp-component_7.entry.js.map +1 -1
  48. package/dist/esm/rebill-footer.entry.js +2 -2
  49. package/dist/esm/rebill-footer.entry.js.map +1 -1
  50. package/dist/esm/renewal-success-page.entry.js +1 -1
  51. package/dist/esm/renewal-success-page.entry.js.map +1 -1
  52. package/dist/esm/renewal-success-page.renewal-summary.entry.js.map +1 -1
  53. package/dist/esm/renewal-success-page_2.entry.js +1 -1
  54. package/dist/esm/renewal-success-page_2.entry.js.map +1 -1
  55. package/dist/esm/success-page.entry.js +8 -8
  56. package/dist/esm/success-page.entry.js.map +1 -1
  57. package/dist/rebill-web-components-sdk/organization-logo.rebill-card-icon.rebill-checkout-single-column.rebill-footer.entry.esm.js.map +1 -1
  58. package/dist/rebill-web-components-sdk/otp-component.rebill-modal-overlay.rebill-mode-sandbox.rebill-mode-sandbox-mobile.rebill-summary.success-page.user-information.entry.esm.js.map +1 -1
  59. package/dist/rebill-web-components-sdk/p-3fca32f8.entry.js +2 -0
  60. package/dist/rebill-web-components-sdk/p-3fca32f8.entry.js.map +1 -0
  61. package/dist/rebill-web-components-sdk/p-d189dea8.entry.js +2 -0
  62. package/dist/rebill-web-components-sdk/{p-123616d2.entry.js.map → p-d189dea8.entry.js.map} +1 -1
  63. package/dist/rebill-web-components-sdk/p-daa7cbb2.entry.js +2 -0
  64. package/dist/rebill-web-components-sdk/p-daa7cbb2.entry.js.map +1 -0
  65. package/dist/rebill-web-components-sdk/rebill-footer.entry.esm.js.map +1 -1
  66. package/dist/rebill-web-components-sdk/rebill-footer.entry.js +2 -2
  67. package/dist/rebill-web-components-sdk/rebill-footer.entry.js.map +1 -1
  68. package/dist/rebill-web-components-sdk/renewal-success-page.entry.esm.js.map +1 -1
  69. package/dist/rebill-web-components-sdk/renewal-success-page.entry.js +1 -1
  70. package/dist/rebill-web-components-sdk/renewal-success-page.entry.js.map +1 -1
  71. package/dist/rebill-web-components-sdk/renewal-success-page.renewal-summary.entry.esm.js.map +1 -1
  72. package/dist/rebill-web-components-sdk/success-page.entry.esm.js.map +1 -1
  73. package/dist/rebill-web-components-sdk/success-page.entry.js +8 -8
  74. package/dist/rebill-web-components-sdk/success-page.entry.js.map +1 -1
  75. package/package.json +1 -1
  76. package/dist/components/p-BEbMMBef.js.map +0 -1
  77. package/dist/components/p-DQYI7toy.js.map +0 -1
  78. package/dist/rebill-web-components-sdk/p-123616d2.entry.js +0 -2
  79. package/dist/rebill-web-components-sdk/p-9dc5e835.entry.js +0 -2
  80. package/dist/rebill-web-components-sdk/p-9dc5e835.entry.js.map +0 -1
  81. package/dist/rebill-web-components-sdk/p-d6225f5e.entry.js +0 -2
  82. package/dist/rebill-web-components-sdk/p-d6225f5e.entry.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"names":["renewalSuccessPageCss","RenewalSuccessPage","typePaymentMethod","PAYMENT_METHOD_ENUM","CARD","country","bank","paymentMethodName","cardLastFour","paymentDate","referenceNumber","trialPeriodDays","debitDay","planAmount","currentLocale","breakpoint","BREAKPOINT_ENUM","DESKTOP","successRedirect","loaderProgress","isLoadingLottie","showRedirectMessage","timeToRedirect","progressInterval","lottieContainer","lottieAnimation","successDisplayTimeout","applyStartCaseToBrand","brand","toLowerCase","split","map","word","charAt","toUpperCase","slice","join","getPaymentDate","payment","renewalState","form","checkoutResponse","date","componentWillLoad","this","getBreakpoint","window","innerWidth","setTimeout","loadLottieAnimation","stopLoaderAnimation","componentDidLoad","addEventListener","handleResize","disconnectedCallback","clearTimeout","removeEventListener","async","lottie","import","then","n","l","animationData","fetch","getAssetPath","animationJson","json","default","loadAnimation","container","renderer","loop","autoplay","startLoaderAnimation","error","duration","interval","increment","setInterval","Math","min","clearInterval","undefined","destroy","handleDownloadReceipt","PDFGenerator","generateAndDownloadReceipt","paymentMethod","textPaymentMethodCard","BANK_TRANSFER","cardBrand","data","cardInformation","lastFour","formatDateTime","email","subscription","customerEmail","productTitle","name","text","subtotal","getFormattedSubtotal","total","getFormattedTotal","currency","price","discountAmount","getFormattedDiscountAmount","isBankTransfer","console","formatAmount","amount","formattedBrand","render","h","key","class","variant","color","COLORS_ENUM","PRIMARY_DARK_TEXT","I18nService","translate","width","isBreakpointBelow","height","viewBox","fill","xmlns","d","SECONDARY","Fragment","style","display","alignItems","gap","getPaymentMethodDisplayName","stroke","type","size","onClick","renewalSummaryCss","RenewalSummary","forceUpdate","displayedComponents","i18n","on","handleLanguageChange","off","totalAmount","subscriptionTitle","subscriptionAmount","nextChargeDate","frequency","getFrequencyText","period","count","translationKey","renderHeader","renderInfoRow","label","value","renderProduct","renderNextRenewal","formatDateByLocale","sessionState","renderSubtotal","renderTotal","renderDesktop","includes","header"],"sources":["src/components/renewal/renewal-success-page/renewal-success-page.css?tag=renewal-success-page","src/components/renewal/renewal-success-page/renewal-success-page.tsx","src/components/renewal/renewal-summary/renewal-summary.css?tag=renewal-summary","src/components/renewal/renewal-summary/renewal-summary.tsx"],"sourcesContent":["/* Reutilizar los estilos del success-page original */\n@import '../../checkout/card-success-page/success-page.css';\n","import { Component, Event, EventEmitter, getAssetPath, h, Prop, State } from '@stencil/core';\nimport { I18nService } from '../../../i18n/i18n.service';\nimport { PAYMENT_METHOD_ENUM } from '../../../models/enums/payment-methods.enum';\nimport { renewalState } from '../../../store/renewal.store';\nimport { formatDateTime } from '../../../utils';\nimport { BREAKPOINT_ENUM, getBreakpoint, isBreakpointBelow } from '../../../utils/breakpoint';\nimport { COLORS_ENUM } from '../../../utils/color-class-mapper';\nimport { formatAmount } from '../../../utils/currency-formatter';\nimport { getPaymentMethodDisplayName } from '../../../utils/get-payment-method-display-name';\nimport { PDFGenerator } from '../../../utils/pdf-generator';\n\n@Component({\n tag: 'renewal-success-page',\n styleUrl: 'renewal-success-page.css',\n shadow: false,\n})\nexport class RenewalSuccessPage {\n @Prop() typePaymentMethod: PAYMENT_METHOD_ENUM = PAYMENT_METHOD_ENUM.CARD;\n @Prop() country?: string = '';\n @Prop() bank?: string = '';\n @Prop() paymentMethodName?: string = '';\n @Prop() cardLastFour?: string = '';\n @Prop() paymentDate: string = '';\n @Prop() referenceNumber: string = '';\n @Prop() trialPeriodDays?: number = 0;\n @Prop() debitDay?: number = 0;\n @Prop() planAmount?: number = 0;\n @State() currentLocale: string = 'es';\n @State() breakpoint: BREAKPOINT_ENUM = BREAKPOINT_ENUM.DESKTOP;\n\n @Event() successRedirect: EventEmitter<any>;\n @State() loaderProgress: number = 0;\n @State() isLoadingLottie: boolean = true;\n @State() showRedirectMessage: boolean = false;\n @Prop() timeToRedirect: number = 3000;\n private progressInterval?: number;\n private lottieContainer?: HTMLElement;\n private lottieAnimation?: any;\n private successDisplayTimeout?: number;\n\n private applyStartCaseToBrand = (brand: string): string => {\n if (!brand) return '';\n\n return brand\n .toLowerCase()\n .split(/[\\s-]+/)\n .map(word => word.charAt(0).toUpperCase() + word.slice(1))\n .join(' ');\n };\n\n private getPaymentDate = (): string => {\n const payment = renewalState.form.checkoutResponse;\n if (!payment) return '';\n\n // El response tiene una propiedad 'date' en el nivel superior\n if ('date' in payment) {\n return payment.date as string;\n }\n\n return '';\n };\n\n componentWillLoad() {\n this.breakpoint = getBreakpoint(window.innerWidth);\n\n // Para renewal, no hay redirect por defecto, pero podríamos agregarlo si es necesario\n if (this.showRedirectMessage) {\n this.successDisplayTimeout = window.setTimeout(() => {\n this.showRedirectMessage = true;\n this.loadLottieAnimation();\n }, 1500);\n\n setTimeout(() => {\n // Aquí podrías agregar lógica de redirect si es necesaria\n this.stopLoaderAnimation();\n }, this.timeToRedirect);\n }\n }\n\n componentDidLoad() {\n window.addEventListener('resize', this.handleResize);\n if (!this.showRedirectMessage) {\n this.loadLottieAnimation();\n }\n }\n\n disconnectedCallback() {\n if (this.successDisplayTimeout) {\n clearTimeout(this.successDisplayTimeout);\n }\n window.removeEventListener('resize', this.handleResize);\n this.stopLoaderAnimation();\n }\n\n private handleResize = () => {\n this.breakpoint = getBreakpoint(window.innerWidth);\n };\n\n private loadLottieAnimation = async () => {\n try {\n const lottie = await import('lottie-web');\n const animationData = await fetch(getAssetPath(`./assets/loader-redirect1.json`));\n const animationJson = await animationData.json();\n\n if (this.lottieContainer) {\n this.lottieAnimation = lottie.default.loadAnimation({\n container: this.lottieContainer,\n renderer: 'svg',\n loop: true,\n autoplay: true,\n animationData: animationJson,\n });\n } else {\n this.startLoaderAnimation();\n }\n } catch (error) {\n this.startLoaderAnimation();\n }\n };\n\n private startLoaderAnimation = () => {\n const duration = 3000;\n const interval = 50;\n const increment = (interval / duration) * 100;\n\n this.progressInterval = window.setInterval(() => {\n this.loaderProgress = Math.min(this.loaderProgress + increment, 100);\n if (this.loaderProgress >= 100) {\n this.stopLoaderAnimation();\n }\n }, interval);\n };\n\n private stopLoaderAnimation = () => {\n if (this.progressInterval) {\n clearInterval(this.progressInterval);\n this.progressInterval = undefined;\n }\n if (this.lottieAnimation) {\n this.lottieAnimation.destroy();\n this.lottieAnimation = undefined;\n }\n };\n\n private handleDownloadReceipt = async () => {\n try {\n await PDFGenerator.generateAndDownloadReceipt({\n paymentMethod:\n this.typePaymentMethod === PAYMENT_METHOD_ENUM.CARD\n ? this.textPaymentMethodCard()\n : this.paymentMethodName,\n ...(this.typePaymentMethod === PAYMENT_METHOD_ENUM.BANK_TRANSFER && { bank: this.bank }),\n ...(this.typePaymentMethod === PAYMENT_METHOD_ENUM.CARD && {\n cardBrand: this.applyStartCaseToBrand(renewalState.data.cardInformation?.brand || ''),\n }),\n ...(this.typePaymentMethod === PAYMENT_METHOD_ENUM.CARD && {\n cardLastFour: this.cardLastFour ?? renewalState.data.cardInformation?.lastFour,\n }),\n paymentDate: formatDateTime(this.getPaymentDate()) || '',\n email: renewalState.data.subscription.customerEmail || '',\n referenceNumber: this.referenceNumber,\n productTitle: renewalState.data.subscription.name[0]?.text || 'Subscription',\n subtotal: this.getFormattedSubtotal(),\n total: this.getFormattedTotal(),\n currency: (renewalState.data.price.currency as any) || ' ',\n discountAmount: this.getFormattedDiscountAmount(),\n trialPeriodDays: this.trialPeriodDays,\n debitDay: this.debitDay,\n planAmount: this.getFormattedSubtotal(this.planAmount),\n isBankTransfer: this.typePaymentMethod === PAYMENT_METHOD_ENUM.BANK_TRANSFER,\n });\n } catch (error) {\n console.error('Error downloading receipt:', error);\n }\n };\n\n private getFormattedDiscountAmount = () => {\n // Para renewal, no hay descuentos por defecto\n return undefined;\n };\n\n private getFormattedSubtotal = (planAmount: number = 0 || null) => {\n return formatAmount(\n planAmount || renewalState.data.price.amount,\n renewalState.data.price.currency as any,\n );\n };\n\n private getFormattedTotal = () => {\n if (this.trialPeriodDays > 0) {\n return formatAmount(0, renewalState.data.price.currency as any);\n }\n return formatAmount(renewalState.data.price.amount, renewalState.data.price.currency as any);\n };\n\n private textPaymentMethodCard = () => {\n const cardBrand = renewalState.data?.cardInformation?.brand;\n const cardLastFour = this.cardLastFour || renewalState.data?.cardInformation?.lastFour;\n\n const formattedBrand = this.applyStartCaseToBrand(cardBrand || '');\n return cardBrand && cardLastFour ? `${formattedBrand} - ${cardLastFour}` : formattedBrand;\n };\n\n render() {\n return (\n <rebill-checkout-single-column>\n <div class=\"success-content\">\n <rebill-typography variant=\"h3\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {I18nService.translate('processing.successTitle')}\n </rebill-typography>\n\n <div class=\"success-icon\">\n <svg\n width={isBreakpointBelow(this.breakpoint, BREAKPOINT_ENUM.DESKTOP) ? '64' : '96'}\n height={isBreakpointBelow(this.breakpoint, BREAKPOINT_ENUM.DESKTOP) ? '64' : '96'}\n viewBox=\"0 0 96 96\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M7.99219 47.998C7.99219 25.9067 25.9008 7.99805 47.9922 7.99805C70.0836 7.99805 87.9922 25.9067 87.9922 47.998C87.9922 70.0894 70.0836 87.998 47.9922 87.998C25.9008 87.998 7.99219 70.0894 7.99219 47.998ZM61.5401 39.2645C62.2396 38.4096 62.1136 37.1496 61.2587 36.4501C60.4038 35.7507 59.1437 35.8767 58.4443 36.7316L41.8437 57.0211L35.4064 50.5838C34.6254 49.8028 33.359 49.8028 32.578 50.5838C31.7969 51.3649 31.7969 52.6312 32.578 53.4123L40.578 61.4123C40.9775 61.8118 41.5275 62.0237 42.0918 61.9956C42.6562 61.9674 43.1823 61.7019 43.5401 61.2645L61.5401 39.2645Z\"\n fill=\"#35B093\"\n />\n </svg>\n </div>\n\n {/* Payment Details Card */}\n <div class=\"info-card\">\n <div class=\"card-row\">\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.SECONDARY}>\n {I18nService.translate('processing.paymentMethod')}\n </rebill-typography>\n <div class=\"card-value\">\n <div class=\"payment-method-display\">\n {this.typePaymentMethod === PAYMENT_METHOD_ENUM.CARD && (\n <>\n <rebill-card-icon\n card-brand={renewalState.data?.cardInformation?.brand || ''}\n />\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {this.textPaymentMethodCard()}\n </rebill-typography>\n </>\n )}\n {this.typePaymentMethod === PAYMENT_METHOD_ENUM.BANK_TRANSFER && (\n <div style={{ display: 'flex', alignItems: 'center', gap: '8px' }}>\n <rebill-icon\n name={getPaymentMethodDisplayName(\n PAYMENT_METHOD_ENUM.BANK_TRANSFER,\n this.country,\n ).toLowerCase()}\n />\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {I18nService.translate('paymentMethods.bank_transfer')}\n </rebill-typography>\n </div>\n )}\n </div>\n </div>\n </div>\n <div class=\"card-row\">\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.SECONDARY}>\n {I18nService.translate('processing.paymentDate')}\n </rebill-typography>\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {formatDateTime(this.paymentDate || this.getPaymentDate()) || ''}\n </rebill-typography>\n </div>\n <div class=\"card-row\">\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.SECONDARY}>\n {I18nService.translate('processing.paymentEmail')}\n </rebill-typography>\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {renewalState.data.subscription.customerEmail}\n </rebill-typography>\n </div>\n <div class=\"card-row\">\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.SECONDARY}>\n {I18nService.translate('processing.paymentReference')}\n </rebill-typography>\n <rebill-typography\n variant=\"body2\"\n color={COLORS_ENUM.PRIMARY_DARK_TEXT}\n class=\"reference-number\"\n >\n {this.referenceNumber || ''}\n </rebill-typography>\n </div>\n </div>\n\n {/* Purchase Details Card */}\n <div class=\"info-card\">\n <rebill-typography variant=\"subtitle-bold\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {I18nService.translate('processing.purchaseDetails')}\n </rebill-typography>\n <div class=\"card-row\">\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.SECONDARY}>\n {I18nService.translate('processing.purchaseDetail')}\n </rebill-typography>\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {renewalState.data.subscription.name[0]?.text || 'Subscription'}\n </rebill-typography>\n </div>\n <div class=\"card-row\">\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.SECONDARY}>\n {I18nService.translate('processing.purchaseSubtotal')}\n </rebill-typography>\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {this.getFormattedSubtotal()}\n </rebill-typography>\n </div>\n <div class=\"card-row\">\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.SECONDARY}>\n {I18nService.translate('processing.purchaseMontoTotal')}\n </rebill-typography>\n <div class=\"total-amount-container\">\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {this.getFormattedTotal()}\n </rebill-typography>\n </div>\n </div>\n <div class=\"card-divider\"></div>\n <div class=\"download-container\">\n <svg\n class=\"download-icon\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M13.498 9.83333V12.1667C13.498 12.903 12.9011 13.5 12.1647 13.5H3.83138C3.095 13.5 2.49805 12.903 2.49805 12.1667V9.83333M7.99804 10V2.5M7.99804 10L5.66471 7.66667M7.99804 10L10.3314 7.66667\"\n stroke=\"currentColor\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n <rebill-button\n type=\"button\"\n variant=\"download\"\n size=\"small\"\n onClick={this.handleDownloadReceipt}\n >\n <rebill-typography variant=\"overline\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {I18nService.translate('processing.download')}\n </rebill-typography>\n </rebill-button>\n </div>\n\n {/* Contact Info */}\n <div class=\"contact-info\">\n <rebill-typography variant=\"information-text\" color={COLORS_ENUM.SECONDARY}>\n {I18nService.translate('processing.downloadDescription')}\n </rebill-typography>\n </div>\n </div>\n </div>\n </rebill-checkout-single-column>\n );\n }\n}\n",".wrapper {\n margin: 0 auto;\n display: flex;\n flex-direction: column;\n align-items: center;\n}\n.header {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 8px;\n}\n.title {\n font-size: 1rem;\n font-weight: 500;\n color: var(--rebill-color-primary-dark-text);\n text-align: center;\n}\n\n.amount {\n font-size: 2.25rem;\n font-weight: 500;\n color: var(--rebill-color-primary-dark-text);\n margin: 0 0 1.5rem 0;\n text-align: center;\n line-height: 1.1;\n}\n\n.per {\n font-size: 1.1rem;\n font-weight: 400;\n color: var(--rebill-color-text-secondary);\n}\n\n.label-muted {\n font-size: 1rem;\n color: var(--rebill-color-primary-dark);\n margin: 0 0 1.5rem 0;\n text-align: center;\n}\n\n.info {\n width: 100%;\n margin-top: 1.5rem;\n margin-bottom: 3rem;\n display: flex;\n flex-direction: column;\n gap: 1.4rem;\n}\n\n.row {\n display: flex;\n justify-content: space-between;\n align-items: center;\n font-size: 1rem;\n line-height: 1.4;\n width: 100%;\n}\n\n.left {\n color: var(--rebill-color-text-secondary);\n font-weight: 400;\n}\n\n.right {\n color: var(--rebill-color-primary-dark-text);\n font-weight: 400;\n text-align: right;\n}\n\n.divider {\n border: none;\n border-top: 1px solid var(--rebill-color-border);\n margin: 1rem 0;\n}\n\n@media (max-width: 1024px) {\n .amount {\n margin-bottom: 0;\n }\n .row {\n font-size: 0.9rem;\n }\n .row:not(:last-child) {\n margin-bottom: 0.5rem;\n }\n .left {\n color: var(--rebill-color-primary-dark-text);\n }\n}\n\n.total-row {\n width: 100%;\n display: flex;\n justify-content: space-between;\n align-items: center;\n font-size: 1.1rem;\n font-weight: 600;\n}\n\n.total-row .left {\n color: var(--rebill-color-primary-dark-text);\n}\n","import { Component, h, Prop, State } from '@stencil/core';\nimport i18n from '../../../i18n/i18n.config';\nimport { I18nService } from '../../../i18n/i18n.service';\nimport { sessionState } from '../../../store/session.store';\nimport { formatAmount } from '../../../utils/currency-formatter';\nimport { formatDate as formatDateByLocale } from '../../../utils/date-formatter';\n\n@Component({\n tag: 'renewal-summary',\n styleUrl: 'renewal-summary.css',\n shadow: false,\n})\nexport class RenewalSummary {\n @State() private forceUpdate = 0;\n @Prop() displayedComponents: ('header' | 'details' | 'summary')[] = [\n 'header',\n 'details',\n 'summary',\n ];\n\n componentWillLoad() {\n i18n.on('languageChanged', this.handleLanguageChange);\n }\n\n disconnectedCallback() {\n i18n.off('languageChanged', this.handleLanguageChange);\n }\n\n private handleLanguageChange = () => {\n this.forceUpdate = this.forceUpdate + 1;\n };\n\n @Prop() totalAmount!: number | string;\n @Prop() subscriptionTitle!: string;\n @Prop() subscriptionAmount!: number | string;\n @Prop() nextChargeDate?: string;\n @Prop() frequency?: { count: number; period: string };\n @Prop() currency: string;\n\n private getFrequencyText(): string {\n if (!this.frequency || !this.frequency.period) return '';\n\n const period = this.frequency.period.toLowerCase();\n const count = this.frequency.count;\n\n const translationKey = `summary.${period}`;\n return I18nService.translate(translationKey, { count });\n }\n\n renderHeader = () => {\n return (\n <div class=\"header\">\n <p class=\"title\">{I18nService.translate('renewal.title')}</p>\n <p class=\"amount\">\n {formatAmount(this.totalAmount, this.currency)}{' '}\n <span class=\"per\">/ {this.getFrequencyText().toLowerCase()}</span>\n </p>\n </div>\n );\n };\n\n renderInfoRow = (label: string, value: string) => {\n return (\n <div class=\"row\">\n <div class=\"left\">{label}</div>\n <div class=\"right\">{value}</div>\n </div>\n );\n };\n\n renderProduct = () => {\n return this.renderInfoRow(\n this.subscriptionTitle,\n formatAmount(this.subscriptionAmount, this.currency),\n );\n };\n\n renderNextRenewal = () => {\n return this.renderInfoRow(\n I18nService.translate('renewal.nextRenewal'),\n formatDateByLocale(this.nextChargeDate, undefined, sessionState.currentLocale),\n );\n };\n\n renderSubtotal = () => {\n return this.renderInfoRow(\n I18nService.translate('renewal.subtotal'),\n formatAmount(this.totalAmount, this.currency),\n );\n };\n\n renderTotal = () => {\n return (\n <div class=\"total-row\">\n <div class=\"left\">{I18nService.translate('renewal.totalToRenew')}</div>\n <div class=\"right\">{formatAmount(this.totalAmount, this.currency)}</div>\n </div>\n );\n };\n\n renderDesktop = () => {\n return (\n <div class=\"wrapper\">\n {this.renderHeader()}\n <div class=\"info\">\n <div class=\"row\">\n <div class=\"\">{I18nService.translate('renewal.subscriptionDetails')}</div>\n </div>\n {this.renderProduct()}\n {this.renderNextRenewal()}\n {this.renderSubtotal()}\n </div>\n {this.renderTotal()}\n </div>\n );\n };\n\n render() {\n if (\n this.displayedComponents.includes('header') &&\n this.displayedComponents.includes('details') &&\n this.displayedComponents.includes('summary')\n ) {\n return this.renderDesktop();\n }\n if (this.displayedComponents.includes('header')) {\n return this.renderHeader();\n }\n if (this.displayedComponents.includes('details')) {\n return (\n <collapsible-card header={I18nService.translate('summary.details')}>\n {this.renderProduct()}\n {this.renderNextRenewal()}\n </collapsible-card>\n );\n }\n if (this.displayedComponents.includes('summary')) {\n return (\n <collapsible-card header={I18nService.translate('summary.summary')}>\n {this.renderInfoRow(\n this.subscriptionTitle,\n '1 x ' + formatAmount(this.subscriptionAmount, this.currency),\n )}\n {this.renderSubtotal()}\n <hr color=\"#F4F5F6\" />\n {this.renderInfoRow(\n I18nService.translate('renewal.totalToRenew'),\n formatAmount(this.totalAmount, this.currency),\n )}\n </collapsible-card>\n );\n }\n }\n}\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"names":["renewalSuccessPageCss","RenewalSuccessPage","typePaymentMethod","PAYMENT_METHOD_ENUM","CARD","country","bank","paymentMethodName","cardLastFour","paymentDate","referenceNumber","trialPeriodDays","debitDay","planAmount","currentLocale","breakpoint","BREAKPOINT_ENUM","DESKTOP","successRedirect","loaderProgress","isLoadingLottie","showRedirectMessage","timeToRedirect","progressInterval","lottieContainer","lottieAnimation","successDisplayTimeout","applyStartCaseToBrand","brand","toLowerCase","split","map","word","charAt","toUpperCase","slice","join","getPaymentDate","payment","renewalState","form","checkoutResponse","date","componentWillLoad","this","getBreakpoint","window","innerWidth","setTimeout","loadLottieAnimation","stopLoaderAnimation","componentDidLoad","addEventListener","handleResize","disconnectedCallback","clearTimeout","removeEventListener","async","lottie","import","then","n","l","animationData","fetch","getAssetPath","animationJson","json","default","loadAnimation","container","renderer","loop","autoplay","startLoaderAnimation","error","duration","interval","increment","setInterval","Math","min","clearInterval","undefined","destroy","handleDownloadReceipt","PDFGenerator","generateAndDownloadReceipt","paymentMethod","textPaymentMethodCard","BANK_TRANSFER","cardBrand","data","cardInformation","lastFour","formatDateTime","email","subscription","customerEmail","productTitle","name","text","subtotal","getFormattedSubtotal","total","getFormattedTotal","currency","price","discountAmount","getFormattedDiscountAmount","isBankTransfer","console","formatAmount","amount","formattedBrand","render","h","key","class","variant","color","COLORS_ENUM","PRIMARY_DARK_TEXT","I18nService","translate","width","isBreakpointBelow","height","viewBox","fill","xmlns","d","SECONDARY","Fragment","style","display","alignItems","gap","getPaymentMethodDisplayName","stroke","type","size","onClick","renewalSummaryCss","RenewalSummary","forceUpdate","displayedComponents","i18n","on","handleLanguageChange","off","totalAmount","subscriptionTitle","subscriptionAmount","nextChargeDate","frequency","getFrequencyText","period","count","translationKey","renderHeader","renderInfoRow","label","value","renderProduct","renderNextRenewal","formatDateByLocale","sessionState","renderSubtotal","renderTotal","renderDesktop","includes","header"],"sources":["src/components/renewal/renewal-success-page/renewal-success-page.css?tag=renewal-success-page","src/components/renewal/renewal-success-page/renewal-success-page.tsx","src/components/renewal/renewal-summary/renewal-summary.css?tag=renewal-summary","src/components/renewal/renewal-summary/renewal-summary.tsx"],"sourcesContent":["/* Reutilizar los estilos del success-page original */\n@import '../../checkout/card-success-page/success-page.css';\n","import { Component, Event, EventEmitter, getAssetPath, h, Prop, State } from '@stencil/core';\nimport { I18nService } from '../../../i18n/i18n.service';\nimport { PAYMENT_METHOD_ENUM } from '../../../models/enums/payment-methods.enum';\nimport { renewalState } from '../../../store/renewal.store';\nimport { formatDateTime } from '../../../utils';\nimport { BREAKPOINT_ENUM, getBreakpoint, isBreakpointBelow } from '../../../utils/breakpoint';\nimport { COLORS_ENUM } from '../../../utils/color-class-mapper';\nimport { formatAmount } from '../../../utils/currency-formatter';\nimport { getPaymentMethodDisplayName } from '../../../utils/get-payment-method-display-name';\nimport { PDFGenerator } from '../../../utils/pdf-generator';\n\n@Component({\n tag: 'renewal-success-page',\n styleUrl: 'renewal-success-page.css',\n shadow: false,\n})\nexport class RenewalSuccessPage {\n @Prop() typePaymentMethod: PAYMENT_METHOD_ENUM = PAYMENT_METHOD_ENUM.CARD;\n @Prop() country?: string = '';\n @Prop() bank?: string = '';\n @Prop() paymentMethodName?: string = '';\n @Prop() cardLastFour?: string = '';\n @Prop() paymentDate: string = '';\n @Prop() referenceNumber: string = '';\n @Prop() trialPeriodDays?: number = 0;\n @Prop() debitDay?: number = 0;\n @Prop() planAmount?: number = 0;\n @State() currentLocale: string = 'es';\n @State() breakpoint: BREAKPOINT_ENUM = BREAKPOINT_ENUM.DESKTOP;\n\n @Event() successRedirect: EventEmitter<any>;\n @State() loaderProgress: number = 0;\n @State() isLoadingLottie: boolean = true;\n @State() showRedirectMessage: boolean = false;\n @Prop() timeToRedirect: number = 3000;\n private progressInterval?: number;\n private lottieContainer?: HTMLElement;\n private lottieAnimation?: any;\n private successDisplayTimeout?: number;\n\n private applyStartCaseToBrand = (brand: string): string => {\n if (!brand) return '';\n\n return brand\n .toLowerCase()\n .split(/[\\s-]+/)\n .map(word => word.charAt(0).toUpperCase() + word.slice(1))\n .join(' ');\n };\n\n private getPaymentDate = (): string => {\n const payment = renewalState.form.checkoutResponse;\n if (!payment) return '';\n\n // El response tiene una propiedad 'date' en el nivel superior\n if ('date' in payment) {\n return payment.date as string;\n }\n\n return '';\n };\n\n componentWillLoad() {\n this.breakpoint = getBreakpoint(window.innerWidth);\n\n // Para renewal, no hay redirect por defecto, pero podríamos agregarlo si es necesario\n if (this.showRedirectMessage) {\n this.successDisplayTimeout = window.setTimeout(() => {\n this.showRedirectMessage = true;\n this.loadLottieAnimation();\n }, 1500);\n\n setTimeout(() => {\n // Aquí podrías agregar lógica de redirect si es necesaria\n this.stopLoaderAnimation();\n }, this.timeToRedirect);\n }\n }\n\n componentDidLoad() {\n window.addEventListener('resize', this.handleResize);\n if (!this.showRedirectMessage) {\n this.loadLottieAnimation();\n }\n }\n\n disconnectedCallback() {\n if (this.successDisplayTimeout) {\n clearTimeout(this.successDisplayTimeout);\n }\n window.removeEventListener('resize', this.handleResize);\n this.stopLoaderAnimation();\n }\n\n private handleResize = () => {\n this.breakpoint = getBreakpoint(window.innerWidth);\n };\n\n private loadLottieAnimation = async () => {\n try {\n const lottie = await import('lottie-web');\n const animationData = await fetch(getAssetPath(`./assets/loader-redirect1.json`));\n const animationJson = await animationData.json();\n\n if (this.lottieContainer) {\n this.lottieAnimation = lottie.default.loadAnimation({\n container: this.lottieContainer,\n renderer: 'svg',\n loop: true,\n autoplay: true,\n animationData: animationJson,\n });\n } else {\n this.startLoaderAnimation();\n }\n } catch (error) {\n this.startLoaderAnimation();\n }\n };\n\n private startLoaderAnimation = () => {\n const duration = 3000;\n const interval = 50;\n const increment = (interval / duration) * 100;\n\n this.progressInterval = window.setInterval(() => {\n this.loaderProgress = Math.min(this.loaderProgress + increment, 100);\n if (this.loaderProgress >= 100) {\n this.stopLoaderAnimation();\n }\n }, interval);\n };\n\n private stopLoaderAnimation = () => {\n if (this.progressInterval) {\n clearInterval(this.progressInterval);\n this.progressInterval = undefined;\n }\n if (this.lottieAnimation) {\n this.lottieAnimation.destroy();\n this.lottieAnimation = undefined;\n }\n };\n\n private handleDownloadReceipt = async () => {\n try {\n await PDFGenerator.generateAndDownloadReceipt({\n paymentMethod:\n this.typePaymentMethod === PAYMENT_METHOD_ENUM.CARD\n ? this.textPaymentMethodCard()\n : this.paymentMethodName,\n ...(this.typePaymentMethod === PAYMENT_METHOD_ENUM.BANK_TRANSFER && { bank: this.bank }),\n ...(this.typePaymentMethod === PAYMENT_METHOD_ENUM.CARD && {\n cardBrand: this.applyStartCaseToBrand(renewalState.data.cardInformation?.brand || ''),\n }),\n ...(this.typePaymentMethod === PAYMENT_METHOD_ENUM.CARD && {\n cardLastFour: this.cardLastFour ?? renewalState.data.cardInformation?.lastFour,\n }),\n paymentDate: formatDateTime(this.getPaymentDate()) || '',\n email: renewalState.data.subscription.customerEmail || '',\n referenceNumber: this.referenceNumber,\n productTitle: renewalState.data.subscription.name[0]?.text || 'Subscription',\n subtotal: this.getFormattedSubtotal(),\n total: this.getFormattedTotal(),\n currency: (renewalState.data.price.currency as any) || ' ',\n discountAmount: this.getFormattedDiscountAmount(),\n trialPeriodDays: this.trialPeriodDays,\n debitDay: this.debitDay,\n planAmount: this.getFormattedSubtotal(this.planAmount),\n isBankTransfer: this.typePaymentMethod === PAYMENT_METHOD_ENUM.BANK_TRANSFER,\n });\n } catch (error) {\n console.error('Error downloading receipt:', error);\n }\n };\n\n private getFormattedDiscountAmount = () => {\n // Para renewal, no hay descuentos por defecto\n return undefined;\n };\n\n private getFormattedSubtotal = (planAmount: number = 0 || null) => {\n return formatAmount(\n planAmount || renewalState.data.price.amount,\n renewalState.data.price.currency as any,\n );\n };\n\n private getFormattedTotal = () => {\n if (this.trialPeriodDays > 0) {\n return formatAmount(0, renewalState.data.price.currency as any);\n }\n return formatAmount(renewalState.data.price.amount, renewalState.data.price.currency as any);\n };\n\n private textPaymentMethodCard = () => {\n const cardBrand = renewalState.data?.cardInformation?.brand;\n const cardLastFour = this.cardLastFour || renewalState.data?.cardInformation?.lastFour;\n\n const formattedBrand = this.applyStartCaseToBrand(cardBrand || '');\n return cardBrand && cardLastFour ? `${formattedBrand} - ${cardLastFour}` : formattedBrand;\n };\n\n render() {\n return (\n <rebill-checkout-single-column>\n <div class=\"success-content\">\n <rebill-typography variant=\"h3\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {I18nService.translate('processing.successTitle')}\n </rebill-typography>\n\n <div class=\"success-icon\">\n <svg\n width={isBreakpointBelow(this.breakpoint, BREAKPOINT_ENUM.DESKTOP) ? '64' : '96'}\n height={isBreakpointBelow(this.breakpoint, BREAKPOINT_ENUM.DESKTOP) ? '64' : '96'}\n viewBox=\"0 0 96 96\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M7.99219 47.998C7.99219 25.9067 25.9008 7.99805 47.9922 7.99805C70.0836 7.99805 87.9922 25.9067 87.9922 47.998C87.9922 70.0894 70.0836 87.998 47.9922 87.998C25.9008 87.998 7.99219 70.0894 7.99219 47.998ZM61.5401 39.2645C62.2396 38.4096 62.1136 37.1496 61.2587 36.4501C60.4038 35.7507 59.1437 35.8767 58.4443 36.7316L41.8437 57.0211L35.4064 50.5838C34.6254 49.8028 33.359 49.8028 32.578 50.5838C31.7969 51.3649 31.7969 52.6312 32.578 53.4123L40.578 61.4123C40.9775 61.8118 41.5275 62.0237 42.0918 61.9956C42.6562 61.9674 43.1823 61.7019 43.5401 61.2645L61.5401 39.2645Z\"\n fill=\"#35B093\"\n />\n </svg>\n </div>\n\n {/* Payment Details Card */}\n <div class=\"info-card\">\n <div class=\"card-row\">\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.SECONDARY}>\n {I18nService.translate('processing.paymentMethod')}\n </rebill-typography>\n <div class=\"card-value\">\n <div class=\"payment-method-display\">\n {this.typePaymentMethod === PAYMENT_METHOD_ENUM.CARD && (\n <>\n <rebill-card-icon\n card-brand={renewalState.data?.cardInformation?.brand || ''}\n />\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {this.textPaymentMethodCard()}\n </rebill-typography>\n </>\n )}\n {this.typePaymentMethod === PAYMENT_METHOD_ENUM.BANK_TRANSFER && (\n <div style={{ display: 'flex', alignItems: 'center', gap: '8px' }}>\n <rebill-icon\n name={getPaymentMethodDisplayName(\n PAYMENT_METHOD_ENUM.BANK_TRANSFER,\n this.country,\n ).toLowerCase()}\n />\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {I18nService.translate('paymentMethods.bank_transfer')}\n </rebill-typography>\n </div>\n )}\n </div>\n </div>\n </div>\n <div class=\"card-row\">\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.SECONDARY}>\n {I18nService.translate('processing.paymentDate')}\n </rebill-typography>\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {formatDateTime(this.paymentDate || this.getPaymentDate()) || ''}\n </rebill-typography>\n </div>\n <div class=\"card-row\">\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.SECONDARY}>\n {I18nService.translate('processing.paymentEmail')}\n </rebill-typography>\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {renewalState.data.subscription.customerEmail}\n </rebill-typography>\n </div>\n <div class=\"card-row\">\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.SECONDARY}>\n {I18nService.translate('processing.paymentReference')}\n </rebill-typography>\n <rebill-typography\n variant=\"body2\"\n color={COLORS_ENUM.PRIMARY_DARK_TEXT}\n class=\"reference-number\"\n >\n {this.referenceNumber || ''}\n </rebill-typography>\n </div>\n </div>\n\n {/* Purchase Details Card */}\n <div class=\"info-card\">\n <rebill-typography variant=\"subtitle-bold\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {I18nService.translate('processing.purchaseDetails')}\n </rebill-typography>\n <div class=\"card-row\">\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.SECONDARY}>\n {I18nService.translate('processing.purchaseDetail')}\n </rebill-typography>\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {renewalState.data.subscription.name[0]?.text || 'Subscription'}\n </rebill-typography>\n </div>\n <div class=\"card-row\">\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.SECONDARY}>\n {I18nService.translate('processing.purchaseSubtotal')}\n </rebill-typography>\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {this.getFormattedSubtotal()}\n </rebill-typography>\n </div>\n <div class=\"card-row\">\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.SECONDARY}>\n {I18nService.translate('processing.purchaseMontoTotal')}\n </rebill-typography>\n <div class=\"total-amount-container\">\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {this.getFormattedTotal()}\n </rebill-typography>\n </div>\n </div>\n <div class=\"card-divider\"></div>\n <div class=\"download-container\">\n <svg\n class=\"download-icon\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M13.498 9.83333V12.1667C13.498 12.903 12.9011 13.5 12.1647 13.5H3.83138C3.095 13.5 2.49805 12.903 2.49805 12.1667V9.83333M7.99804 10V2.5M7.99804 10L5.66471 7.66667M7.99804 10L10.3314 7.66667\"\n stroke=\"currentColor\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n <rebill-button\n type=\"button\"\n variant=\"download\"\n size=\"small\"\n onClick={this.handleDownloadReceipt}\n >\n <rebill-typography variant=\"overline\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {I18nService.translate('processing.download')}\n </rebill-typography>\n </rebill-button>\n </div>\n\n {/* Contact Info */}\n <div class=\"contact-info\">\n <rebill-typography variant=\"information-text\" color={COLORS_ENUM.SECONDARY}>\n {I18nService.translate('processing.downloadDescription')}\n </rebill-typography>\n </div>\n </div>\n </div>\n </rebill-checkout-single-column>\n );\n }\n}\n",".wrapper {\n margin: 0 auto;\n display: flex;\n flex-direction: column;\n align-items: center;\n}\n.header {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 8px;\n}\n.title {\n font-size: 1rem;\n font-weight: 500;\n color: var(--rebill-color-primary-dark-text);\n text-align: center;\n}\n\n.amount {\n font-size: 2.25rem;\n font-weight: 500;\n color: var(--rebill-color-primary-dark-text);\n margin: 0 0 1.5rem 0;\n text-align: center;\n line-height: 1.1;\n}\n\n.per {\n font-size: 1.1rem;\n font-weight: 400;\n color: var(--rebill-color-text-secondary);\n}\n\n.label-muted {\n font-size: 1rem;\n color: var(--rebill-color-primary-dark);\n margin: 0 0 1.5rem 0;\n text-align: center;\n}\n\n.info {\n width: 100%;\n margin-top: 1.5rem;\n margin-bottom: 3rem;\n display: flex;\n flex-direction: column;\n gap: 1.4rem;\n}\n\n.row {\n display: flex;\n justify-content: space-between;\n align-items: center;\n font-size: 1rem;\n line-height: 1.4;\n width: 100%;\n}\n\n.left {\n color: var(--rebill-color-text-secondary);\n font-weight: 400;\n}\n\n.right {\n color: var(--rebill-color-primary-dark-text);\n font-weight: 400;\n text-align: right;\n}\n\n.divider {\n border: none;\n border-top: 1px solid var(--rebill-color-border);\n margin: 1rem 0;\n}\n\n@media (max-width: 1024px) {\n .amount {\n margin-bottom: 0;\n }\n .row {\n font-size: 0.9rem;\n }\n .row:not(:last-child) {\n margin-bottom: 0.5rem;\n }\n .left {\n color: var(--rebill-color-primary-dark-text);\n }\n}\n\n.total-row {\n width: 100%;\n display: flex;\n justify-content: space-between;\n align-items: center;\n font-size: 1.1rem;\n font-weight: 600;\n}\n\n.total-row .left {\n color: var(--rebill-color-primary-dark-text);\n}\n","import { Component, h, Prop, State } from '@stencil/core';\nimport i18n from '../../../i18n/i18n.config';\nimport { I18nService } from '../../../i18n/i18n.service';\nimport { sessionState } from '../../../store/session.store';\nimport { formatAmount } from '../../../utils/currency-formatter';\nimport { formatDate as formatDateByLocale } from '../../../utils/date-formatter';\n\n@Component({\n tag: 'renewal-summary',\n styleUrl: 'renewal-summary.css',\n shadow: false,\n})\nexport class RenewalSummary {\n @State() private forceUpdate = 0;\n @Prop() displayedComponents: ('header' | 'details' | 'summary')[] = [\n 'header',\n 'details',\n 'summary',\n ];\n\n componentWillLoad() {\n i18n.on('languageChanged', this.handleLanguageChange);\n }\n\n disconnectedCallback() {\n i18n.off('languageChanged', this.handleLanguageChange);\n }\n\n private handleLanguageChange = () => {\n this.forceUpdate = this.forceUpdate + 1;\n };\n\n @Prop() totalAmount!: number | string;\n @Prop() subscriptionTitle!: string;\n @Prop() subscriptionAmount!: number | string;\n @Prop() nextChargeDate?: string;\n @Prop() frequency?: { count: number; period: string };\n @Prop() currency: string;\n\n private getFrequencyText(): string {\n if (!this.frequency || !this.frequency.period) return '';\n\n const period = this.frequency.period.toLowerCase();\n const count = this.frequency.count;\n\n const translationKey = `summary.${period}`;\n return I18nService.translate(translationKey, { count });\n }\n\n renderHeader = () => {\n return (\n <div class=\"header\">\n <p class=\"title\">{I18nService.translate('renewal.title')}</p>\n <p class=\"amount\">\n {formatAmount(this.totalAmount, this.currency)}{' '}\n <span class=\"per\">/ {this.getFrequencyText().toLowerCase()}</span>\n </p>\n </div>\n );\n };\n\n renderInfoRow = (label: string, value: string) => {\n return (\n <div class=\"row\">\n <div class=\"left\">{label}</div>\n <div class=\"right\">{value}</div>\n </div>\n );\n };\n\n renderProduct = () => {\n return this.renderInfoRow(\n this.subscriptionTitle,\n formatAmount(this.subscriptionAmount, this.currency),\n );\n };\n\n renderNextRenewal = () => {\n return this.renderInfoRow(\n I18nService.translate('renewal.nextRenewal'),\n formatDateByLocale(this.nextChargeDate, undefined, sessionState.currentLocale),\n );\n };\n\n renderSubtotal = () => {\n return this.renderInfoRow(\n I18nService.translate('renewal.subtotal'),\n formatAmount(this.totalAmount, this.currency),\n );\n };\n\n renderTotal = () => {\n return (\n <div class=\"total-row\">\n <div class=\"left\">{I18nService.translate('renewal.totalToRenew')}</div>\n <div class=\"right\">{formatAmount(this.totalAmount, this.currency)}</div>\n </div>\n );\n };\n\n renderDesktop = () => {\n return (\n <div class=\"wrapper\">\n {this.renderHeader()}\n <div class=\"info\">\n <div class=\"row\">\n <div class=\"\">{I18nService.translate('renewal.subscriptionDetails')}</div>\n </div>\n {this.renderProduct()}\n {this.renderNextRenewal()}\n {this.renderSubtotal()}\n </div>\n {this.renderTotal()}\n </div>\n );\n };\n\n render() {\n if (\n this.displayedComponents.includes('header') &&\n this.displayedComponents.includes('details') &&\n this.displayedComponents.includes('summary')\n ) {\n return this.renderDesktop();\n }\n if (this.displayedComponents.includes('header')) {\n return this.renderHeader();\n }\n if (this.displayedComponents.includes('details')) {\n return (\n <collapsible-card header={I18nService.translate('summary.details')}>\n {this.renderProduct()}\n {this.renderNextRenewal()}\n </collapsible-card>\n );\n }\n if (this.displayedComponents.includes('summary')) {\n return (\n <collapsible-card header={I18nService.translate('summary.summary')}>\n {this.renderInfoRow(\n this.subscriptionTitle,\n '1 x ' + formatAmount(this.subscriptionAmount, this.currency),\n )}\n {this.renderSubtotal()}\n <hr color=\"#F4F5F6\" />\n {this.renderInfoRow(\n I18nService.translate('renewal.totalToRenew'),\n formatAmount(this.totalAmount, this.currency),\n )}\n </collapsible-card>\n );\n }\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -0,0 +1,2 @@
1
+ import{r as e,c as a,h as t,g as i,H as r}from"./p-DyaDabZ4.js";import{a as o}from"./p-C6wUNEUc.js";import{s as l,S as n,I as s,i as c,P as d,a as p,b}from"./p-dYKOc01W.js";import{C as f}from"./p-DA598vBj.js";import{c as h}from"./p-bcHxwlBu.js";import{c as y}from"./p-2SuTTFdS.js";export{R as rebill_mode_sandbox,S as rebill_summary}from"./p-2SuTTFdS.js";import{e as g,E as u,c as m}from"./p-B2q13jSm.js";import"./p-BFhvUZPU.js";import"./p-BYrqevT1.js";import{P as x}from"./p-CTQZ1Sio.js";import{g as v}from"./p-Bf6g23G6.js";import{f as k}from"./p-DkiBa5Y3.js";import"./p-uZj1dMLQ.js";import{B as w,g as C,i as _}from"./p-Do_vNuMa.js";import{g as j}from"./p-C0jcntnC.js";import"./p-BFTU3MAI.js";import"./p-B2LDUv1-.js";const D=".otp-container{display:flex;flex-direction:column;align-items:center;gap:16px;width:100%;position:relative;margin-top:2rem}.user-information{display:flex;align-items:center;justify-content:center;flex-direction:column;width:100%;gap:8px}.otp-description-container{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:4px}.change-email{cursor:pointer;text-decoration:underline;margin-left:0}.change-email:hover{color:var(--rebill-primary-color);text-decoration:underline}.alternative{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:16px;margin:32px;width:100%}.rebill-alert{width:100%}.guest-options{display:flex;flex-direction:column;width:100%;gap:8px;margin-top:auto}.verifying-container{display:flex;align-items:center;justify-content:center;gap:16px;margin:8px 0}.code-resent-container rebill-typography{display:flex;line-height:1}.code-resent-container rebill-icon{flex-shrink:0;display:inline-flex;vertical-align:middle;margin-right:8px}.spinner{width:15px;height:15px;border:2px solid rgba(255, 255, 255, 0.3);border-radius:50%;border-top-color:var(--rebill-color-primary);animation:spin 1s linear infinite;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width: 1024px){.otp-container{min-height:calc(100vh - 40px)}.guest-options{margin-top:32px}}@media (min-width: 1025px){.otp-container{justify-content:flex-start}.guest-options{margin-top:auto;padding-bottom:2rem}}";const T=class{constructor(t){e(this,t);this.changeEmailClick=a(this,"changeEmailClick");this.returnForm=a(this,"returnForm");this.codeVerified=a(this,"codeVerified")}changeEmailClick;timeLeft=59;isTimerRunning=false;codeResent=false;isVerifying=false;otpValue="";returnForm;codeVerified;error=false;timer=h({duration:59,onTick:e=>{this.timeLeft=e},onComplete:()=>{this.isTimerRunning=false}});messageTimer=h({duration:5,onComplete:()=>{this.codeResent=false}});disconnectedCallback(){this.timer.stop()}startTimer(){this.timer.start();this.isTimerRunning=true}handleResendCode=async()=>{if(!this.isTimerRunning){await o.otp.generate(l.data.sessionId,{email:l.data.userInformation.email});this.codeResent=true;this.messageTimer.start();this.startTimer();this.error=false}};handleOtpChange=e=>{this.otpValue=e;if(e.length===6){this.handleVerifyOtp(e);this.error=false}};handleVerifyOtp=async e=>{this.isVerifying=true;try{const a=await o.otp.verify(l.data.sessionId,{email:l.data.userInformation.email,code:e});this.codeVerified.emit(a.data);n.setUserInformation({...a.data.customer,fullName:`${a.data.customer.firstName} ${a.data.customer.lastName}`.trim(),phoneNumber:{number:a.data.customer.phoneNumbers[0].number,countryCode:a.data.customer.phoneNumbers[0].countryCode},address:{billingAddress:{address:a.data.customer.addresses[0].lineOne,zip:a.data.customer.addresses[0].zipCode,city:a.data.customer.addresses[0].city,state:a.data.customer.addresses[0].state,country:a.data.customer.addresses[0].country}},documentType:a.data.customer.identifications[0].type,documentNumber:a.data.customer.identifications[0].value});n.setAccessToken(a.data.accessToken);n.setCustomerId(a.data.customer.id);this.otpValue="";this.error=false}catch(e){this.error=true}finally{this.isVerifying=false}};render(){return t("div",{key:"68417e64c3df38a704f23e648b2332fe6a724b89",class:"otp-container"},t("div",{key:"3789fcd10500d02a04125dca8fe402066deb6187",class:"user-information"},t("div",{key:"837ace14791f0743ce5ba353f6d4fcfa8e028303",class:"otp-description-container"},t("rebill-typography",{key:"2de626534b8a1224c65221d85f3267ad8c9c94b6",variant:"body2",class:"otp-description"},s.translate("otp.description")),t("rebill-typography",{key:"15db9a65007e3f082b52ae7e05c6ba38095bc712",variant:"subtitle-bold",class:"otp-description-digits"}," ",t("strong",{key:"4e91d38f6eb4111067491a8037fd2d940b9c8e00"},s.translate("otp.descriptionDigits"))," "),t("rebill-typography",{key:"e3fc02e8a44fe8f4eb3c8249e4324646804a8c32",variant:"body2",class:"otp-description-email"},s.translate("otp.descriptionEmail"))),t("rebill-typography",{key:"45e8be5727b9079d7293fb4e06bf5c2ce6fc76af",variant:"body2",class:"otp-email-line"},l.data.userInformation.email," ",!l.data.prefilledData?.email&&t("span",{key:"3da79d5f2cd3d3e805897f0cff12ceeaafa5a7a1",class:"change-email",onClick:()=>{this.otpValue="";this.error=false;this.returnForm.emit(false)}},s.translate("otp.change")))),t("input-otp",{key:"1670a83a1b473e58df2be1c6fc6a2ae2b721cec5",otp:this.otpValue,onOtpChange:e=>this.handleOtpChange(e.detail),error:this.error?s.translate("otp.error"):""}),this.isVerifying&&t("div",{key:"de01ef16d0ca132542e1b932d14fb8dc5fb9d9fc",class:"verifying-container"},t("rebill-typography",{key:"610c943e609849df748eb21f8f272cd4f4424c2c",variant:"subtitle2",color:f.PRIMARY},s.translate("otp.verifyingCode")),t("div",{key:"e9c40ba2cc65ae7bfc5ee40fed6876270075c64a",class:"spinner"})),t("rebill-button",{key:"b7d6cb97c0abdd55e3389a389eb51575271a7481",type:"button",variant:"outline",theme:this.isTimerRunning?"secondary":"primary",disabled:this.isTimerRunning,onClick:this.handleResendCode,size:"small",style:{height:"24px",marginBottom:"8px"}},this.isTimerRunning?`${s.translate("otp.resendCodeIn")} (${this.timer.getFormattedTime()})`:s.translate("otp.resendCode")),this.codeResent&&t("div",{key:"eee3c0fc0d9b63a6e040ba848588ea4de100374a",class:"code-resent-container"},t("rebill-typography",{key:"9735a985961b5fa4a788d2f051ad984c2b06c1db",variant:"subtitle2",color:f.GREEN},t("rebill-icon",{key:"f22b2ee54b286926adb1a984f7c2288811ba8bd9",name:"check-radio"}),s.translate("otp.codeResent"))),t("rebill-alert",{key:"8eb1e5c93b804f9b79f332a7788be9ed2cbab9e9",class:"rebill-alert",type:"secure",variant:"variant-info",message:s.translate("otp.infoMessage"),icon:"circle-info",alertTitle:s.translate("otp.infoTitle"),colorIcon:f.PRIMARY_DARK_LIGHT}),t("div",{key:"9d56b4008bb08be948282dedb9ccc8b47bb10126",class:"alternative"},t("rebill-typography",{key:"854d5cca0f5ee1e74682e37a4fec2bfbf2be6097",variant:"body2",color:f.PRIMARY_DARK},"o")),t("div",{key:"ec364378f08786acd5dcf582a326367759c96ab4",class:"guest-options"},t("rebill-button",{key:"7d7d28d5b813d41bf99436fb6f8d1031ec4ad999",type:"button",variant:"outline",theme:"secondary",size:"medium",onClick:()=>{this.otpValue="";this.error=false;this.returnForm.emit(false)}},s.translate("otp.continueAsGuest")),t("rebill-alert",{key:"871f3f30f989510da526b901e71491377e6fd426",type:"secure",variant:"variant-secure",icon:"lock-outline",message:s.translate("otp.secureMessage")})))}};T.style=D;const L=".modal-overlay{position:fixed;top:0;left:0;right:0;background-color:transparent;display:flex;align-items:center;justify-content:center;z-index:10000;padding:12px 16px;box-sizing:border-box}.modal-content{background:white;border-radius:8px;padding:16px 20px;width:350px;box-shadow:0 4px 12px -2px rgba(0, 0, 0, 0.15),\n 0 2px 4px -1px rgba(0, 0, 0, 0.1);position:relative;display:flex;align-items:center;gap:12px}.modal-content .alert{margin:0;flex:1;padding:0;background:transparent;border:none;box-shadow:none}.modal-content .alert{background-color:transparent !important;border-color:transparent !important}.modal-content .alert-message{display:flex;flex-direction:column;gap:4px}.modal-content .close-button{position:absolute;top:8px;right:8px;width:20px;height:20px;border:none;background:transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background-color 0.2s ease;padding:0;margin:0;outline:none;box-shadow:none;line-height:1}.modal-content .close-button:focus{outline:none;box-shadow:none}.modal-content .close-button:hover{background-color:#f0f0f0}.modal-content .close-button rebill-icon{width:16px;height:16px;display:flex;align-items:center;justify-content:center}@media (max-width: 768px){.modal-overlay{padding:8px 12px}.modal-content{padding:12px 16px;flex-direction:column;gap:8px;text-align:center}.modal-content .close-button{width:100%}}";const M=class{constructor(a){e(this,a)}visible=true;languageUpdateTrigger=0;unsubscribeCurrentLocaleStore;componentDidLoad(){this.unsubscribeCurrentLocaleStore=n.onChange("currentLocale",(()=>{this.languageUpdateTrigger++}))}disconnectedCallback(){if(this.unsubscribeCurrentLocaleStore){this.unsubscribeCurrentLocaleStore()}}closeModal=()=>{this.visible=false};render(){if(!this.visible)return null;return t("div",{class:"modal-overlay"},t("div",{class:"modal-content"},t("div",{class:"alert info filled medium"},t("div",{class:"alert-icon"},t("rebill-icon",{name:"circle-info",size:"16px",color:f.ORANGE})),t("div",{class:"alert-message"},t("div",{class:"alert-title"},t("rebill-typography",{variant:"subtitle-bold",color:f.PRIMARY_DARK},s.translate("session.refreshedTitle"))),t("div",{class:"alert-message-text"},t("rebill-typography",{variant:"subtitle2",color:f.PRIMARY_DARK},s.translate("session.refreshedMessage"))))),t("button",{onClick:this.closeModal,class:"close-button",type:"button"},t("rebill-icon",{name:"close",size:"20px"}))))}};M.style=L;const $=":host{display:flex;position:relative;width:100%;justify-content:center;align-items:center}.test-mode-container{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:8px;width:100%}.overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0, 0, 0, 0.5);z-index:5;animation:fadeIn 0.3s cubic-bezier(0.4, 0, 0.2, 1);pointer-events:auto;cursor:pointer}.test-mode-chip-mobile{display:flex;width:100%;min-width:auto;max-width:100%;height:40px;background:#ffffff;border:1px solid #e5e7eb;border-radius:20px;box-shadow:0 1px 3px rgba(0, 0, 0, 0.1);transition:all 0.3s cubic-bezier(0.4, 0, 0.2, 1);overflow:hidden;position:relative;z-index:20}.chip-content-mobile{display:flex;align-items:center;gap:2px;justify-content:flex-end;min-height:24px;flex-shrink:0;width:100%;margin:8px}.test-mode-chip-mobile.expanded .chip-content-mobile{justify-content:flex-end;width:100%}.cards-dropdown-panel-header{display:flex;align-items:center;gap:8px;padding:8px}.docs-section{display:flex;align-items:center;gap:8px;cursor:pointer;margin-left:0;transition:background-color 0.2s ease;justify-content:flex-end;padding:8px;margin-top:8px}.cards-dropdown-panel{position:absolute;top:100%;left:0;right:0;width:100%;background:#ffffff;border-top:none;border-left:1px solid #e5e7eb;border-right:1px solid #e5e7eb;border-bottom:1px solid #e5e7eb;margin-top:16px;z-index:25;animation:expandDown 0.3s cubic-bezier(0.4, 0, 0.2, 1);transform-origin:top center}.card-section{display:flex;flex-direction:column;justify-content:space-between}.header-content{display:flex;align-items:center;gap:8px;margin:8px}.card-details{background:#fafafa;border-radius:8px;border:1px solid #e5e7eb;margin:8px;min-height:208px;display:flex;flex-direction:column}.card-row{display:flex;gap:12px;align-items:stretch;background:#ffffff;justify-content:space-around;border-radius:8px;border:1px solid #e5e7eb;height:auto;padding:8px;margin:8px}.card-value{display:flex;flex-direction:column;gap:6px;flex:1}.field-value{display:flex;flex-direction:row;align-items:center;gap:8px;max-height:20px}.copy-button{align-items:center;margin-left:auto;margin-right:0}.icon-button{margin-left:auto;margin-right:16px}@keyframes expandDown{from{opacity:0;transform:translateY(-10px) scaleY(0.9)}to{opacity:1;transform:translateY(0) scaleY(1)}}@keyframes fadeIn{from{opacity:0}to{opacity:1}}";const z=class{constructor(a){e(this,a)}get el(){return i(this)}isPanelVisible=false;currentLanguage=s.getCurrentLanguage();componentWillLoad(){c.on("languageChanged",this.handleLanguageChange)}disconnectedCallback(){c.off("languageChanged",this.handleLanguageChange)}handleLanguageChange=()=>{this.currentLanguage=s.getCurrentLanguage()};togglePanel=()=>{this.isPanelVisible=!this.isPanelVisible};handleCopy=e=>{y(e);this.isPanelVisible=false};handleDocsClick=()=>{window.open("https://v3.docs.rebill.com/sdk/checkout","_blank")};renderBasicChip(){return t("div",{class:"chip-content-mobile"},t("div",{class:"info-icon"},t("rebill-icon",{name:"circle-info",size:"24px",color:f.ORANGE})),t("rebill-typography",{variant:"subtitle2",color:f.PRIMARY_DARK},s.translate("sandbox.testMode")),t("div",{class:"icon-button"},t("rebill-button",{variant:"text",size:"small",onClick:this.togglePanel},t("rebill-icon",{name:"hamburger"}))))}renderCardsPanel(){return t("div",{class:"cards-dropdown-panel"},t("div",{class:"cards-dropdown-panel-header"},t("rebill-icon",{name:"card-test"}),t("rebill-typography",{variant:"subtitle2",color:f.PRIMARY_DARK},s.translate("sandbox.cardTest"))),t("div",{class:"card-details"},t("div",{class:"card-section"},t("div",{class:"header-content"},t("rebill-icon",{name:"succes",color:f.GREEN}),t("rebill-typography",{variant:"subtitle2",color:f.PRIMARY_DARK},s.translate("sandbox.successPayment"))),t("div",{class:"card-row"},t("div",{class:"card-value"},t("rebill-typography",{variant:"subtitle3",color:f.GREY_700},s.translate("sandbox.cardNumber")),t("div",{class:"field-value"},t("rebill-icon",{name:"visa"}),t("rebill-typography",{variant:"subtitle2",color:f.PRIMARY_DARK},"4539148803436467"))),t("div",{class:"card-value"},t("rebill-typography",{variant:"subtitle3",color:f.GREY_700},s.translate("sandbox.exp")),t("div",{class:"field-value"},t("rebill-typography",{variant:"subtitle2",color:f.PRIMARY_DARK},"01/99"))),t("div",{class:"card-value"},t("rebill-typography",{variant:"subtitle3",color:f.GREY_700},s.translate("sandbox.cvv")),t("div",{class:"field-value field-value-with-copy"},t("rebill-typography",{variant:"subtitle2",color:f.PRIMARY_DARK},"123"),t("div",{class:"copy-button"},t("rebill-button",{variant:"text",size:"small",onClick:()=>this.handleCopy("4539148803436467 01/99 123")},t("rebill-icon",{name:"copy"}))))))),t("div",{class:"card-section"},t("div",{class:"header-content"},t("rebill-icon",{name:"rejected",color:f.ERROR}),t("rebill-typography",{variant:"subtitle2",color:f.PRIMARY_DARK},s.translate("sandbox.rejectedPayment"))),t("div",{class:"card-row"},t("div",{class:"card-value"},t("rebill-typography",{variant:"subtitle3",color:f.GREY_700},s.translate("sandbox.cardNumber")),t("div",{class:"field-value"},t("rebill-icon",{name:"visa"}),t("rebill-typography",{variant:"subtitle2",color:f.PRIMARY_DARK},"4485364739527352"))),t("div",{class:"card-value"},t("rebill-typography",{variant:"subtitle3",color:f.GREY_700},s.translate("sandbox.exp")),t("div",{class:"field-value"},t("rebill-typography",{variant:"subtitle2",color:f.PRIMARY_DARK},"01/99"))),t("div",{class:"card-value"},t("rebill-typography",{variant:"subtitle3",color:f.GREY_700},s.translate("sandbox.cvv")),t("div",{class:"field-value field-value-with-copy"},t("rebill-typography",{variant:"subtitle2",color:f.PRIMARY_DARK},"123"),t("div",{class:"copy-button"},t("rebill-button",{variant:"text",size:"small",onClick:()=>this.handleCopy("4485364739527352 01/99 123")},t("rebill-icon",{name:"copy"})))))))),t("div",{class:"docs-section",onClick:this.handleDocsClick},t("rebill-typography",{variant:"subtitle2",color:f.PRIMARY},s.translate("sandbox.docs")),t("rebill-icon",{name:"external-link"})))}render(){return t("div",{key:"9c89ecbf8e6ee940bd56c01cd6d1ade8106cc008",class:`test-mode-container ${this.isPanelVisible?"cards-visible":""}`},this.isPanelVisible&&t("div",{key:"df0e79c1765bfa496e25e2ac64a072ed8b806e08",class:"overlay"}),t("div",{key:"005349daa4967dabcb6ce2c8211e60114b606ecc",class:`test-mode-chip-mobile ${this.isPanelVisible?"expanded":""}`},this.renderBasicChip()),this.isPanelVisible&&this.renderCardsPanel())}};z.style=$;const I=":root{--rebill-color-primary:#3b82f6;--rebill-color-primary-light:rgba(59, 130, 246, 0.1);--rebill-color-primary-hover:#2563eb;--rebill-color-primary-dark:#001131;--rebill-color-primary-dark-text:#000000;--rebill-color-primary-dark-hover:#001c4a;--rebill-color-primary-dark-light:rgba(0, 17, 49, 0.1);--rebill-color-error:#ef4444;--rebill-color-error-background:#fef2f2;--rebill-color-error-light:rgba(239, 68, 68, 0.1);--rebill-color-error-dark:#6f101b;--rebill-color-background:#ffffff;--rebill-color-background-left:#fafafa;--rebill-color-background-right:#f4f5f6;--rebill-color-background-secondary:#f7f8fa;--rebill-color-border:#ebedef;--rebill-color-timeline-connector:#c4c8cf;--rebill-color-neutrals-700:#58616e;--rebill-color-neutrals-500:#9ca3af;--rebill-color-border-primary:#e4e4e7;--rebill-color-text-primary:#3b4049;--rebill-color-text-secondary:#6b7280;--rebill-color-grey-700:#7d7d7d;--rebill-color-text-secondary-light:#a1a1aa;--rebill-color-text-on-primary:#ffffff;--rebill-color-disabled:#9ca3af;--rebill-color-shadow:rgba(0, 0, 0, 0.1);--rebill-color-green:#10b981;--rebill-color-green-text:#257c67;--rebill-color-green-light:rgba(183, 233, 221, 0.15);--rebill-color-green-light-2:rgba(183, 233, 221, 1);--rebill-color-info-background:#d5e4ff;--rebill-color-info-border:#0156f6;--rebill-color-info-text:#172b85;--rebill-color-background-secondary-light:#f7f8fa;--rebill-breakpoint-mobile:768px;--rebill-breakpoint-tablet:1024px;--rebill-breakpoint-desktop:1025px;--rebill-color-orange:#ff9400;--rebill-color-black:#1e2025;--rebill-color-grey-300:#3b4049;--rebill-color-grey-100:#aeaeae}*{transition:none !important}.qr-container,.qr-image,.qr-image svg,.qr-image img,[class*='qr-'],[class*='success'],[class*='receipt']{transition:none !important;animation:none !important;will-change:auto !important}button:active,button:focus,button:hover{isolation:isolate}.text-content{margin-bottom:2rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}.success-content{display:flex;flex-direction:column;align-items:center;gap:1rem;width:100%;overflow-x:hidden;box-sizing:border-box}.lottie-container{width:80px;height:80px}.success-content rebill-typography[variant='h3']{margin:0 !important;padding:0 !important}.success-icon{display:flex;justify-content:center;margin:0.5rem 0}.success-page__info-card{padding:24px;gap:16px;width:100%;max-width:450px;border:1px solid #ebedef;border-radius:8px;display:flex;flex-direction:column;box-sizing:border-box}.success-page__card-row{display:flex;justify-content:space-between;align-items:start;min-height:20px;gap:15%}.success-page__card-row:last-of-type{margin-bottom:0}.success-page__card-value{display:flex;align-items:center;gap:0.5rem}.payment-method-display{display:flex;align-items:center;gap:8px;justify-content:center}.payment-method-display rebill-card-icon{display:inline-block;flex-shrink:0;margin-right:8px;vertical-align:middle}.payment-method-display rebill-card-icon svg{display:block}.payment-method-display rebill-icon{display:inline-block;vertical-align:middle;margin-right:8px}.payment-method-display rebill-icon div{display:block}.success-page__card-divider{height:1px;background:#e5e7eb}.download-container{display:flex;align-items:center;justify-content:flex-start;gap:2px;text-decoration:none;cursor:pointer}.contact-info{text-align:left}.reference-number{word-break:break-all;overflow-wrap:break-word;hyphens:auto;max-width:100%;text-align:right}.total-amount-container{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-direction:row}.trial-pill{background-color:var(--rebill-color-green-light-2);border-radius:4px;padding:4px 6px 4px 6px;display:flex;align-items:center;justify-content:center}.next-charge-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}.next-charge-details{display:flex;justify-content:space-between;align-items:flex-start}.next-charge-amount{display:flex;flex-direction:row;align-items:center;gap:4px}.next-charge-date{text-align:right}@media (max-width: 1024px){.success-content{max-width:100%;gap:1.5rem;margin-left:16px;margin-right:16px}.success-page__info-card{width:100%;max-width:100%;padding:12px}.text-content{gap:12px}}@media (max-width: 767px){.success-page__info-card{padding:12px}.processing-container{padding:0 16px}}";const P=class{constructor(t){e(this,t);this.successRedirect=a(this,"successRedirect")}typePaymentMethod=d.CARD;country="";bank="";paymentMethodName="";cardLastFour="";paymentDate="";referenceNumber="";trialPeriodDays=0;debitDay=0;planAmount=0;currentLocale=l.currentLocale;breakpoint=w.DESKTOP;successRedirect;loaderProgress=0;isLoadingLottie=true;showRedirectMessage=false;timeToRedirect=3e3;progressInterval;lottieContainer;lottieAnimation;unsubscribeCurrentLocaleStore;successDisplayTimeout;applyStartCaseToBrand=e=>{if(!e)return"";return e.toLowerCase().split(/[\s-]+/).map((e=>e.charAt(0).toUpperCase()+e.slice(1))).join(" ")};getPaymentDate=()=>{const e=l?.data?.payment;if(!e)return"";if("createdAt"in e){return e.createdAt}return""};componentWillLoad(){this.breakpoint=C(window.innerWidth);this.unsubscribeCurrentLocaleStore=n.onChange("currentLocale",(()=>{this.currentLocale=l.currentLocale}));if(l.data?.itemInformation?.redirectSuccess){this.successDisplayTimeout=window.setTimeout((()=>{this.showRedirectMessage=true;this.loadLottieAnimation()}),1500);setTimeout((()=>{let e=l.data?.itemInformation?.redirectSuccess;if(e){this.successRedirect.emit({redirectUrl:e});this.stopLoaderAnimation()}}),this.timeToRedirect)}}componentDidLoad(){window.addEventListener("resize",this.handleResize);if(!l.data?.itemInformation?.redirectSuccess||this.showRedirectMessage){this.loadLottieAnimation()}}disconnectedCallback(){if(this.unsubscribeCurrentLocaleStore){this.unsubscribeCurrentLocaleStore()}if(this.successDisplayTimeout){clearTimeout(this.successDisplayTimeout)}window.removeEventListener("resize",this.handleResize);this.stopLoaderAnimation()}handleResize=()=>{this.breakpoint=C(window.innerWidth)};loadLottieAnimation=async()=>{try{const e=await import("./p-DdEjhWUP.js").then((function(e){return e.l}));const a=await fetch(v(`loader-redirect1.json`));const t=await a.json();if(this.lottieContainer){this.lottieAnimation=e.default.loadAnimation({container:this.lottieContainer,renderer:"svg",loop:true,autoplay:true,animationData:t})}else{this.startLoaderAnimation()}}catch(e){this.startLoaderAnimation()}};startLoaderAnimation=()=>{const e=3e3;const a=50;const t=a/e*100;this.progressInterval=window.setInterval((()=>{this.loaderProgress=Math.min(this.loaderProgress+t,100);if(this.loaderProgress>=100){this.stopLoaderAnimation()}}),a)};stopLoaderAnimation=()=>{if(this.progressInterval){clearInterval(this.progressInterval);this.progressInterval=undefined}if(this.lottieAnimation){this.lottieAnimation.destroy();this.lottieAnimation=undefined}};handleDownloadReceipt=async()=>{try{await x.generateAndDownloadReceipt({paymentMethod:this.typePaymentMethod===d.CARD?this.textPaymentMethodCard():this.paymentMethodName,...this.typePaymentMethod===d.BANK_TRANSFER&&{bank:this.bank},...this.typePaymentMethod===d.CARD&&{cardBrand:this.applyStartCaseToBrand(l.data.cardInformation?.brand||"")},...this.typePaymentMethod===d.CARD&&{cardLastFour:this.cardLastFour??l.data.cardInformation?.lastFour},paymentDate:k(this.getPaymentDate())||"",email:l?.data?.userInformation?.email||"",referenceNumber:this.referenceNumber,productTitle:l?.data?.itemInformation?.title||"",subtotal:this.getFormattedSubtotal(),total:this.getFormattedTotal(),currency:l?.data?.pricing?.currency||" ",installments:l?.data?.pricing?.installments&&l?.data?.cardInformation?.installments?.selectedInstallment?`${g(l.data?.cardInformation?.installments?.selectedInstallment?.installment,m(l.data?.cardInformation?.installments?.selectedInstallment?.installmentAmount||0),l.data?.pricing?.currency,l.data?.cardInformation?.installments?.selectedInstallment?.cft,l.data?.cardInformation?.installments?.selectedInstallment?.model)}\n( ${s.translate("processing.purchaseTotal")}: ${this.getFormattedTotal()} )${l.data.cardInformation?.installments?.installments.find((e=>e.installment===l.data.cardInformation?.installments?.selectedInstallment?.installment))?.model===u.CUSTOMER_FINANCED?`\n${s.translate("installments.interest")}`:""}`:"",discountAmount:this.getFormattedDiscountAmount(),trialPeriodDays:this.trialPeriodDays||l.data?.itemInformation?.trial?.trialPeriodDays,debitDay:this.debitDay||l.data?.itemInformation?.debitDay,planAmount:this.getFormattedSubtotal(this.planAmount),trialEndDate:this.hasFreeTrial()?this.getTrialEndDateFormatted():undefined,debitDate:this.hasDebitDay()?this.getDebitDateFormatted():undefined,isBankTransfer:this.typePaymentMethod===d.BANK_TRANSFER})}catch(e){console.error("Error downloading receipt:",e)}};getFormattedDiscountAmount=()=>{if(l?.data?.pricing?.discountAmount>0){const e=p(l.data?.pricing?.discountAmount,l.data?.pricing?.currency);return`-${e}`}return undefined};getFormattedSubtotal=(e=null)=>p(e||l?.data?.pricing?.subtotal,l?.data?.pricing?.currency);getFormattedTotal=()=>{if(this.trialPeriodDays>0){return p(0,l?.data?.pricing?.currency)}return p(l?.data?.pricing?.total,l?.data?.pricing?.currency)};hasFreeTrial=()=>l.data?.itemInformation?.type===b.PLAN&&l.data?.itemInformation?.trial?.trialPeriodDays&&l.data?.itemInformation?.trial?.trialPeriodDays>0;hasDebitDay=()=>{const e=l.data?.itemInformation?.debitDay;return e&&e>0};getTrialEndDateFormatted=()=>{const e=l.data?.itemInformation?.trial?.trialPeriodEndsAt;if(!e)return"";const a=new Date(e);const t=s.getCurrentLanguage();const i=t==="es"?"es-ES":t==="pt"?"pt-BR":"en-US";if(t==="en"){return`${a.toLocaleDateString(i,{month:"long"})} ${a.getDate()}`}else{return`${a.getDate()} de ${a.toLocaleDateString(i,{month:"long"})}`}};getDebitDateFormatted=()=>{const e=l.data?.itemInformation?.debitDay;if(!e||e<=0)return"";const a=new Date;const t=new Date(a);const i=s.getCurrentLanguage();const r=i==="es"?"es-ES":i==="pt"?"pt-BR":"en-US";if(e<a.getDate()){t.setMonth(a.getMonth()+1)}t.setDate(e);while(t.getDate()!==e){t.setDate(t.getDate()-1)}if(i==="en"){return`${t.toLocaleDateString(r,{month:"long"})} ${t.getDate()}`}else{return`${t.getDate()} de ${t.toLocaleDateString(r,{month:"long"})}`}};textPaymentMethodCard=()=>{const e=l.data?.cardInformation?.brand;const a=this.cardLastFour||l?.data?.cardInformation?.lastFour;const t=this.applyStartCaseToBrand(e||"");return e&&a?`${t} - ${a}`:t};render(){const e=l.data?.itemInformation?.redirectSuccess;return t("rebill-checkout-single-column",{key:"d8a814c5353cd2dcaa053ea6c205be11870f7629"},t("div",{key:"300d2de040e3d30cd48fc33b311b6c068bb5706f",class:"success-content"},t("rebill-typography",{key:"10bd5be46e1adbd9eb61808ce8e74b5c78d735a8",variant:"h3",color:f.PRIMARY_DARK_TEXT},e&&this.showRedirectMessage?s.translate("processing.redirectMessage"):s.translate("processing.successTitle")),e&&this.showRedirectMessage?t("div",{class:"redirect-message"},t("div",{class:"lottie-container"},t("div",{ref:e=>this.lottieContainer=e,class:"lottie-animation"}))):t("div",{class:"success-icon"},t("svg",{width:_(this.breakpoint,w.DESKTOP)?"64":"96",height:_(this.breakpoint,w.DESKTOP)?"64":"96",viewBox:"0 0 96 96",fill:"none",xmlns:"http://www.w3.org/2000/svg"},t("path",{"fill-rule":"evenodd","clip-rule":"evenodd",d:"M7.99219 47.998C7.99219 25.9067 25.9008 7.99805 47.9922 7.99805C70.0836 7.99805 87.9922 25.9067 87.9922 47.998C87.9922 70.0894 70.0836 87.998 47.9922 87.998C25.9008 87.998 7.99219 70.0894 7.99219 47.998ZM61.5401 39.2645C62.2396 38.4096 62.1136 37.1496 61.2587 36.4501C60.4038 35.7507 59.1437 35.8767 58.4443 36.7316L41.8437 57.0211L35.4064 50.5838C34.6254 49.8028 33.359 49.8028 32.578 50.5838C31.7969 51.3649 31.7969 52.6312 32.578 53.4123L40.578 61.4123C40.9775 61.8118 41.5275 62.0237 42.0918 61.9956C42.6562 61.9674 43.1823 61.7019 43.5401 61.2645L61.5401 39.2645Z",fill:"#35B093"}))),t("div",{key:"a4bec3c9deb9d5cc33a104861b4dfd459f698680",class:"success-page__info-card"},t("div",{key:"8d1d7bacc956826e7d3c17ede9c1881006dd85d6",class:"success-page__card-row"},t("rebill-typography",{key:"9cefa0019d0b3111bfe4d86e5d45b3be5096a669",variant:"body2",color:f.SECONDARY},s.translate("processing.paymentMethod")),t("div",{key:"0daedd45d705bbf2cc6126978f6940f67c3adfcb",class:"success-page__card-value"},t("div",{key:"2046c5f0ce8e12b425a682ca7abc39ce1e595e7c",class:"payment-method-display"},this.typePaymentMethod===d.CARD&&t(t.Fragment,null,t("rebill-card-icon",{key:"b738832b38e50744656e9fcf45785062c13d9b2b","card-brand":l.data?.cardInformation?.brand||""}),t("rebill-typography",{key:"e9928ed3a6196280a3cb17883ebcd3cc985a2b43",variant:"body2",color:f.PRIMARY_DARK_TEXT},this.textPaymentMethodCard())),this.typePaymentMethod===d.BANK_TRANSFER&&t("div",{key:"df21f77c4b1029feb215343aeca6c43c12d95fd1",style:{display:"flex",alignItems:"center",gap:"8px"}},t("rebill-icon",{key:"272644ea6337654a62a73b9ade66ab15d7c940c5",name:j(d.BANK_TRANSFER,this.country)?.toLowerCase()||"card"}),t("rebill-typography",{key:"d7240cbef960d4dc28fcd0d0f3e2f2336739c752",variant:"body2",color:f.PRIMARY_DARK_TEXT},s.translate("paymentMethods.bank_transfer")))))),l?.data?.pricing?.installments&&l?.data?.cardInformation?.installments?.selectedInstallment&&t("div",{key:"5fe838e33d7f75f91c86c2849224ef2a49342b81"},t("div",{key:"1aa1b037dcd780c009499ee09df50e68b76df935",class:"success-page__card-row"},t("rebill-typography",{key:"3e907c933564379479f9ca2acf271916c2bc4928",variant:"body2",color:f.SECONDARY},s.translate("summary.installments")),t("div",{key:"b0ab2acd74e05f95838de8f6b7d61625fe764d4a",style:{display:"flex",flexDirection:"column",gap:"10px",alignItems:"end"}},t("rebill-typography",{key:"f61f0a2f3d005fa52cff9c17cadf02ef11b1322d",variant:"body2",color:f.PRIMARY_DARK_TEXT,style:{textAlign:"end"}},g(l.data?.cardInformation?.installments?.selectedInstallment?.installment,m(l.data?.cardInformation?.installments?.selectedInstallment?.installmentAmount||0),l.data?.pricing?.currency,l.data?.cardInformation?.installments?.selectedInstallment?.cft,l.data?.cardInformation?.installments?.selectedInstallment?.model)),t("rebill-typography",{key:"0f42f8250afec3d6b3a79b12a538e27c68fe11dc",variant:"body2",color:f.PRIMARY_DARK_TEXT},`( ${s.translate("processing.purchaseTotal")}: ${this.getFormattedTotal()} )`),l.data.cardInformation?.installments?.installments.find((e=>e.installment===l.data.cardInformation?.installments?.selectedInstallment?.installment))?.model===u.CUSTOMER_FINANCED&&t("rebill-typography",{key:"e60b60dd9d4140f0f68ac9337c4eeaeb16307e81",variant:"italic",color:f.SECONDARY,style:{textAlign:"end"}},`${s.translate("installments.interest")}`)))),t("div",{key:"0e16ac8326cd0542e8656593746fe2ab2c7394ed",class:"success-page__card-row"},t("rebill-typography",{key:"509f8b0a04aba8edefdf3da8e0f9039d3be47878",variant:"body2",color:f.SECONDARY},s.translate("processing.paymentDate")),t("rebill-typography",{key:"b3727f8eaab806ccecf422418c5d527ae18bfb31",variant:"body2",color:f.PRIMARY_DARK_TEXT},k(this.paymentDate||this.getPaymentDate()||l.createdAt)||"")),t("div",{key:"acf55b48d33c73b0fb1d5f8e68672ea2e33c7fbe",class:"success-page__card-row"},t("rebill-typography",{key:"d2c0becdd3096cfc995e7258f0c6741dbaaa5b28",variant:"body2",color:f.SECONDARY},s.translate("processing.paymentEmail")),t("rebill-typography",{key:"cd337abb3b8828129bf109875c3927ab5a76b507",variant:"body2",color:f.PRIMARY_DARK_TEXT},l?.data?.userInformation?.email)),t("div",{key:"7c78a3fc52c5c7966a5d1be7b2027f2e64893fa1",class:"success-page__card-row"},t("rebill-typography",{key:"d1097bda8329b97e7e19e15cf05c923899305723",variant:"body2",color:f.SECONDARY},s.translate("processing.paymentReference")),t("rebill-typography",{key:"0fe00585bc2b97f58e43e9647c31a38aa376b617",variant:"body2",color:f.PRIMARY_DARK_TEXT,class:"reference-number"},this.referenceNumber||""))),t("div",{key:"c9ce7fc78430de6ea3ed77a485832c2714cdfcfa",class:"success-page__info-card"},t("rebill-typography",{key:"f60ea9706de5730c2c6919b0cef92f545d80cce7",variant:"subtitle-bold",color:f.PRIMARY_DARK_TEXT},s.translate("processing.purchaseDetails")),t("div",{key:"65f24003ad3dad665b9c1ad1f09558caf43acaae",class:"success-page__card-row"},t("rebill-typography",{key:"f32902e2254725cc4b7788f70ef2fda36767676b",variant:"body2",color:f.SECONDARY},s.translate("processing.purchaseDetail")),t("rebill-typography",{key:"4ae4fed51cd2a89cdfc2b0e6c86336a5c39de38b",variant:"body2",color:f.PRIMARY_DARK_TEXT},l?.data?.itemInformation?.title||"")),!this.trialPeriodDays&&t("div",{key:"feb4816ba4e9d2fe8e852be99e1af07567eb704e",class:"success-page__card-row"},t("rebill-typography",{key:"d54c1b908a56af924dd93fcb32ece6dfecf88931",variant:"body2",color:f.SECONDARY},s.translate("processing.purchaseSubtotal")),t("rebill-typography",{key:"3a1d7af2bc28ae18efaedf5fb9d0489ab9ef295c",variant:"body2",color:f.PRIMARY_DARK_TEXT},this.getFormattedSubtotal())),l?.data?.pricing?.discountAmount>0&&t("div",{key:"e65e71710d6cd3c937f6aaf096543e496b1e2325",class:"success-page__card-row"},t("rebill-typography",{key:"a1a46e9e2b0f52c4cc8cdce002aaa1772c9ff696",variant:"body2",color:f.SECONDARY},s.translate("summary.discount")),t("rebill-typography",{key:"1af958f8c84761da45f0c3f20e172e8553006896",variant:"body2",color:f.PRIMARY_DARK_TEXT},this.getFormattedDiscountAmount())),t("div",{key:"9daf0cd1ba58159973ebb43bf9a54e27a4d2507b",class:"success-page__card-row"},t("rebill-typography",{key:"14d4365b7f5c4db15a2779e6d460293a2f0bddcb",variant:"body2",color:f.SECONDARY},s.translate("processing.purchaseMontoTotal")),t("div",{key:"688710a4705697093b56c93b2c88ea67d44f2e60",class:"total-amount-container"},this.trialPeriodDays>0&&t("div",{key:"9e387c929f2e52effcdc8a04985f7813af8e84e4",class:"trial-pill"},t("rebill-typography",{key:"f98ea49edec24bccad87ff8c142914c7ce4eee7b",variant:"body2",align:"center",color:f.GREEN_TEXT},s.translate("processing.trialPill",{days:this.trialPeriodDays,count:this.trialPeriodDays}))),t("rebill-typography",{key:"bd7340197baddea2e7131074841caec3ab1cc1d4",variant:"body2",color:f.PRIMARY_DARK_TEXT},this.getFormattedTotal()))),(this.trialPeriodDays||this.hasDebitDay())&&t("div",{key:"bb8305da72fe5f3a93f9350f1c60058d32734e21",class:"success-page__card-divider"}),(this.hasFreeTrial()||this.hasDebitDay())&&t("div",{key:"cb25a584c12fe4540c94e0d6c6256e54d3521f4e",class:"next-charge-section"},t("div",{key:"0e3a9c7d5b719f09476a1f44c783144f28169a85",class:"next-charge-header"},t("rebill-typography",{key:"4651348020cfbfaf44e70ea381a07f363a0a991a",variant:"subtitle-bold",color:f.PRIMARY_DARK_TEXT},s.translate("processing.nextCharge")),t("rebill-typography",{key:"a42507762f10f315c17a033dab4648f37eb46706",variant:"subtitle-bold",color:f.PRIMARY_DARK_TEXT},s.translate("processing.onDate",{date:this.hasFreeTrial()?this.getTrialEndDateFormatted():this.getDebitDateFormatted()}))),t("div",{key:"073b8086746ac54925028f40dcb6cc0388dc29d5",class:"success-page__card-row"},t("rebill-typography",{key:"f678239b390132e31e1a1992ce61899253ff7063",variant:"body2",color:f.PRIMARY_DARK_TEXT},this.hasFreeTrial()?s.translate("processing.atEndOfTrial"):""),t("rebill-typography",{key:"e3f59ea087b8fc704ae12b124e23835dee0f2e06",variant:"body2",color:f.PRIMARY_DARK_TEXT},this.getFormattedSubtotal(this.planAmount)," ",s.translate("processing.perMonth")))),t("div",{key:"7da44a91e541f2cad30c231165dfeb93a6fd5f4c",class:"success-page__card-divider"}),t("div",{key:"e0a328dd5e648474b89799c18083194c0f2ca4a8",class:"download-container"},t("svg",{key:"fbcbca40ea633f280a02307e356198d9cfe0d629",class:"download-icon",width:"16",height:"16",viewBox:"0 0 16 16",fill:"none",xmlns:"http://www.w3.org/2000/svg"},t("path",{key:"a1c03674854d117ea948858b0994eddacdadde0b",d:"M13.498 9.83333V12.1667C13.498 12.903 12.9011 13.5 12.1647 13.5H3.83138C3.095 13.5 2.49805 12.903 2.49805 12.1667V9.83333M7.99804 10V2.5M7.99804 10L5.66471 7.66667M7.99804 10L10.3314 7.66667",stroke:"currentColor","stroke-linecap":"round","stroke-linejoin":"round"})),t("rebill-button",{key:"434daabf2474882e211250ee56d03ed2a496adaf",type:"button",variant:"download",size:"small",onClick:this.handleDownloadReceipt},t("rebill-typography",{key:"b64910c30d0f64d83cac260a97409ce5a482176d",variant:"overline",color:f.PRIMARY_DARK_TEXT},s.translate("processing.download")))),t("div",{key:"2c2f930b614ac9194f7f496c1226ba724eb8c331",class:"contact-info"},t("rebill-typography",{key:"ffa8eb7284f57679d5e9725393c650c112680b98",variant:"information-text",color:f.SECONDARY},s.translate("processing.downloadDescription"))))))}};P.style=I;const B=":host{display:block}.inputs-container{display:flex;flex-direction:column;gap:16px;width:100%}.customer-exists{display:flex;justify-content:flex-end;margin-bottom:16px}";const A=class{constructor(t){e(this,t);this.onRebillAccountClick=a(this,"onRebillAccountClick")}userInformation={email:"",fullName:"",countryCode:""};errors=null;customerExists=false;disabled=false;onRebillAccountClick;translateError(e){if(!e)return"";if(e.includes("validation.")||e.includes("paymentErrors.")){return s.translate(e)}return e}handleInputChange(e){if(!e.detail)return;const{id:a,value:t}=e.detail;n.setUserInformation({[a]:t})}handleBlur(e){if(!e.detail)return;const{id:a,value:t}=e.detail;n.setUserInformation({[a]:t})}getCardLabels(){const e=[];if(l.data.prefilledData.email){e.push({label:s.translate("userInformation.emailPlaceholder"),value:l.data.prefilledData.email});n.setUserInformation({...l.data.userInformation,email:l.data.prefilledData.email})}if(l.data.prefilledData.fullName){e.push({label:s.translate("userInformation.fullNamePlaceholder"),value:l.data.prefilledData.fullName});n.setUserInformation({...l.data.userInformation,fullName:l.data.prefilledData.fullName})}return e}async handleRebillAccountClick(){o.otp.generate(l.data.sessionId,{email:l.data.userInformation.email});this.onRebillAccountClick.emit(true)}renderInputs(){const e=l.data.prefilledData.email;const a=l.data.prefilledData.fullName;const i=[];if(!e){i.push(t("rebill-input-text",{id:"email",variant:"floating",label:s.translate("userInformation.emailPlaceholder"),placeholder:s.translate("userInformation.emailPlaceholder"),"left-icon":"email",clearable:true,disabled:this.disabled,error:this.translateError(this.errors?.email)}))}if(!a){i.push(t("rebill-input-text",{id:"fullName",variant:"floating",label:s.translate("userInformation.fullNamePlaceholder"),placeholder:s.translate("userInformation.fullNamePlaceholder"),disabled:this.disabled,error:this.translateError(this.errors?.fullName)}))}return i.length>0?t("div",{class:"inputs-container",style:{marginTop:i.length>0&&(e||a)?"1rem":"0"}},i):null}render(){const e=t("div",{key:"46bb2f98219e56c8723289e3348514c4f27b4a53",class:"customer-exists"},t("rebill-button",{key:"eb6f81a732df9ef04a4c278588cd57998cbb6c25",style:{visibility:this.customerExists?"visible":"hidden",opacity:this.customerExists?"1":"0",transition:"opacity 0.3s ease-in-out"},variant:"text",size:"small",onClick:()=>this.handleRebillAccountClick(),icon:"lock"},s.translate("userInformation.rebillAccount"),t("rebill-icon",{key:"d270f5d5f8e2fecb9a6b39d439172c99233cc86d",name:"arrow-right"})));const a=l.data.prefilledData.email;const i=l.data.prefilledData.fullName;const o=a||i;return t(r,{key:"97e0d4dd9b6d3c798eee919274d4ed9be854319d"},e,o&&t("rebill-card",{key:"18f3d53e0386be0b4dff09bcfdcf69885d0093e7",cardTitle:s.translate("userInformation.personalInformation"),cardLabels:this.getCardLabels()}),this.renderInputs())}};A.style=B;export{T as otp_component,M as rebill_modal_overlay,z as rebill_mode_sandbox_mobile,P as success_page,A as user_information};
2
+ //# sourceMappingURL=p-daa7cbb2.entry.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"names":["otpCss","Otp","changeEmailClick","timeLeft","isTimerRunning","codeResent","isVerifying","otpValue","returnForm","codeVerified","error","timer","createCountdownTimer","duration","onTick","this","onComplete","messageTimer","disconnectedCallback","stop","startTimer","start","handleResendCode","async","api","otp","generate","sessionState","data","sessionId","email","userInformation","handleOtpChange","value","length","handleVerifyOtp","response","verify","code","emit","SessionStore","setUserInformation","customer","fullName","firstName","lastName","trim","phoneNumber","number","phoneNumbers","countryCode","address","billingAddress","addresses","lineOne","zip","zipCode","city","state","country","documentType","identifications","type","documentNumber","setAccessToken","accessToken","setCustomerId","id","render","h","key","class","variant","I18nService","translate","prefilledData","onClick","onOtpChange","event","detail","color","COLORS_ENUM","PRIMARY","theme","disabled","size","style","height","marginBottom","getFormattedTime","GREEN","name","message","icon","alertTitle","colorIcon","PRIMARY_DARK_LIGHT","PRIMARY_DARK","modalOverlayCss","ModalOverlay","visible","languageUpdateTrigger","unsubscribeCurrentLocaleStore","componentDidLoad","onChange","closeModal","ORANGE","modeSandboxMobileCss","RebillTestModeChipMobile","isPanelVisible","currentLanguage","getCurrentLanguage","componentWillLoad","i18n","on","handleLanguageChange","off","togglePanel","handleCopy","text","copyToClipboard","handleDocsClick","window","open","renderBasicChip","renderCardsPanel","GREY_700","ERROR","successPageCss","CardSuccessPage","typePaymentMethod","PAYMENT_METHOD_ENUM","CARD","bank","paymentMethodName","cardLastFour","paymentDate","referenceNumber","trialPeriodDays","debitDay","planAmount","currentLocale","breakpoint","BREAKPOINT_ENUM","DESKTOP","successRedirect","loaderProgress","isLoadingLottie","showRedirectMessage","timeToRedirect","progressInterval","lottieContainer","lottieAnimation","successDisplayTimeout","applyStartCaseToBrand","brand","toLowerCase","split","map","word","charAt","toUpperCase","slice","join","getPaymentDate","payment","createdAt","getBreakpoint","innerWidth","itemInformation","redirectSuccess","setTimeout","loadLottieAnimation","redirectUrl","stopLoaderAnimation","addEventListener","handleResize","clearTimeout","removeEventListener","lottie","import","then","n","l","animationData","fetch","getAssetURL","animationJson","json","default","loadAnimation","container","renderer","loop","autoplay","startLoaderAnimation","interval","increment","setInterval","Math","min","clearInterval","undefined","destroy","handleDownloadReceipt","PDFGenerator","generateAndDownloadReceipt","paymentMethod","textPaymentMethodCard","BANK_TRANSFER","cardBrand","cardInformation","lastFour","formatDateTime","productTitle","title","subtotal","getFormattedSubtotal","total","getFormattedTotal","currency","pricing","installments","selectedInstallment","getInstallmentLabelSummary","installment","getRecalculatedInstallmentAmount","installmentAmount","cft","model","find","ENUM_INSTALLMENT_MODEL","CUSTOMER_FINANCED","discountAmount","getFormattedDiscountAmount","trial","trialEndDate","hasFreeTrial","getTrialEndDateFormatted","debitDate","hasDebitDay","getDebitDateFormatted","isBankTransfer","console","formattedAmount","formatAmount","SESSION_ITEM_TYPE_ENUM","PLAN","trialEndsAt","trialPeriodEndsAt","date","Date","locale","toLocaleDateString","month","getDate","today","targetDate","setMonth","getMonth","setDate","formattedBrand","hasRedirect","PRIMARY_DARK_TEXT","ref","el","width","isBreakpointBelow","viewBox","fill","xmlns","d","SECONDARY","Fragment","display","alignItems","gap","getPaymentMethodDisplayName","flexDirection","textAlign","align","GREEN_TEXT","days","count","stroke","userInformationCss","UserInformation","errors","customerExists","onRebillAccountClick","translateError","errorKey","includes","handleInputChange","handleBlur","getCardLabels","labels","push","label","handleRebillAccountClick","renderInputs","hasPrefilledEmail","hasPrefilledName","inputs","placeholder","clearable","marginTop","customerExistsButton","visibility","opacity","transition","hasAnyPrefilled","Host","cardTitle","cardLabels"],"sources":["src/components/checkout/otp/otp.css?tag=otp-component","src/components/checkout/otp/otp.tsx","src/components/shared/modal-overlay/modal-overlay.css?tag=rebill-modal-overlay","src/components/shared/modal-overlay/modal-overlay.tsx","src/components/shared/mode-sandbox/mode-sandbox-mobile.css?tag=rebill-mode-sandbox-mobile","src/components/shared/mode-sandbox/mode-sandbox-mobile.tsx","src/components/checkout/card-success-page/success-page.css?tag=success-page","src/components/checkout/card-success-page/success-page.tsx","src/components/checkout/user-information/user-information.css?tag=user-information","src/components/checkout/user-information/user-information.tsx"],"sourcesContent":[".otp-container {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 16px;\n width: 100%;\n position: relative;\n margin-top: 2rem;\n}\n\n.user-information {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-direction: column;\n width: 100%;\n gap: 8px;\n}\n\n.otp-description-container {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: center;\n gap: 4px;\n}\n.change-email {\n cursor: pointer;\n text-decoration: underline;\n margin-left: 0;\n}\n\n.change-email:hover {\n color: var(--rebill-primary-color);\n text-decoration: underline;\n}\n\n.alternative {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: center;\n gap: 16px;\n margin: 32px;\n width: 100%;\n}\n\n.rebill-alert {\n width: 100%;\n}\n\n.guest-options {\n display: flex;\n flex-direction: column;\n width: 100%;\n gap: 8px;\n margin-top: auto;\n}\n\n.verifying-container {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 16px;\n margin: 8px 0;\n}\n\n.code-resent-container rebill-typography {\n display: flex;\n line-height: 1;\n}\n\n.code-resent-container rebill-icon {\n flex-shrink: 0;\n display: inline-flex;\n vertical-align: middle;\n margin-right: 8px;\n}\n\n.spinner {\n width: 15px;\n height: 15px;\n border: 2px solid rgba(255, 255, 255, 0.3);\n border-radius: 50%;\n border-top-color: var(--rebill-color-primary);\n animation: spin 1s linear infinite;\n display: inline-block;\n}\n\n@keyframes spin {\n to {\n transform: rotate(360deg);\n }\n}\n\n/* Responsive adjustments */\n@media (max-width: 1024px) {\n .otp-container {\n min-height: calc(100vh - 40px);\n }\n\n .guest-options {\n margin-top: 32px;\n }\n}\n\n@media (min-width: 1025px) {\n .otp-container {\n justify-content: flex-start;\n }\n\n .guest-options {\n margin-top: auto;\n padding-bottom: 2rem;\n }\n}\n","import { Component, Event, EventEmitter, h, State } from '@stencil/core';\nimport { api } from '../../../api';\nimport { OTPVerifyResponse } from '../../../api/entities/OTP/types';\nimport { I18nService } from '../../../i18n/i18n.service';\nimport { sessionState, SessionStore } from '../../../store/session.store';\nimport { COLORS_ENUM } from '../../../utils/color-class-mapper';\nimport { createCountdownTimer } from '../../../utils/timer';\n\n@Component({\n tag: 'otp-component',\n styleUrl: 'otp.css',\n shadow: false,\n})\nexport class Otp {\n @Event() changeEmailClick: EventEmitter<void>;\n @State() timeLeft: number = 59;\n @State() isTimerRunning: boolean = false;\n @State() codeResent: boolean = false;\n @State() isVerifying: boolean = false;\n @State() otpValue: string = '';\n @Event() returnForm: EventEmitter<boolean>;\n @Event() codeVerified: EventEmitter<OTPVerifyResponse>;\n @State() error: boolean = false;\n\n private timer = createCountdownTimer({\n duration: 59,\n onTick: timeLeft => {\n this.timeLeft = timeLeft;\n },\n onComplete: () => {\n this.isTimerRunning = false;\n },\n });\n\n private messageTimer = createCountdownTimer({\n duration: 5,\n onComplete: () => {\n this.codeResent = false;\n },\n });\n\n disconnectedCallback() {\n this.timer.stop();\n }\n\n startTimer() {\n this.timer.start();\n this.isTimerRunning = true;\n }\n\n handleResendCode = async () => {\n if (!this.isTimerRunning) {\n await api.otp.generate(sessionState.data.sessionId, {\n email: sessionState.data.userInformation.email,\n });\n this.codeResent = true;\n this.messageTimer.start();\n this.startTimer();\n\n this.error = false;\n }\n };\n\n handleOtpChange = (value: string) => {\n this.otpValue = value;\n\n if (value.length === 6) {\n this.handleVerifyOtp(value);\n this.error = false;\n }\n };\n\n handleVerifyOtp = async (otp: string) => {\n this.isVerifying = true;\n try {\n const response = await api.otp.verify(sessionState.data.sessionId, {\n email: sessionState.data.userInformation.email,\n code: otp,\n });\n\n this.codeVerified.emit(response.data);\n SessionStore.setUserInformation({\n ...response.data.customer,\n fullName: `${response.data.customer.firstName} ${response.data.customer.lastName}`.trim(),\n phoneNumber: {\n number: response.data.customer.phoneNumbers[0].number,\n countryCode: response.data.customer.phoneNumbers[0].countryCode,\n },\n address: {\n billingAddress: {\n address: response.data.customer.addresses[0].lineOne,\n zip: response.data.customer.addresses[0].zipCode,\n city: response.data.customer.addresses[0].city,\n state: response.data.customer.addresses[0].state,\n country: response.data.customer.addresses[0].country,\n },\n },\n documentType: response.data.customer.identifications[0].type,\n documentNumber: response.data.customer.identifications[0].value,\n });\n SessionStore.setAccessToken(response.data.accessToken);\n SessionStore.setCustomerId(response.data.customer.id);\n this.otpValue = '';\n this.error = false;\n } catch (error) {\n this.error = true;\n } finally {\n this.isVerifying = false;\n }\n };\n\n render() {\n return (\n <div class=\"otp-container\">\n <div class=\"user-information\">\n <div class=\"otp-description-container\">\n <rebill-typography variant=\"body2\" class=\"otp-description\">\n {I18nService.translate('otp.description')}\n </rebill-typography>\n <rebill-typography variant=\"subtitle-bold\" class=\"otp-description-digits\">\n {' '}\n <strong>{I18nService.translate('otp.descriptionDigits')}</strong>{' '}\n </rebill-typography>\n <rebill-typography variant=\"body2\" class=\"otp-description-email\">\n {I18nService.translate('otp.descriptionEmail')}\n </rebill-typography>\n </div>\n <rebill-typography variant=\"body2\" class=\"otp-email-line\">\n {sessionState.data.userInformation.email}{' '}\n {!sessionState.data.prefilledData?.email && (\n <span\n class=\"change-email\"\n onClick={() => {\n this.otpValue = '';\n this.error = false;\n this.returnForm.emit(false);\n }}\n >\n {I18nService.translate('otp.change')}\n </span>\n )}\n </rebill-typography>\n </div>\n <input-otp\n otp={this.otpValue}\n onOtpChange={event => this.handleOtpChange(event.detail)}\n error={this.error ? I18nService.translate('otp.error') : ''}\n />\n\n {this.isVerifying && (\n <div class=\"verifying-container\">\n <rebill-typography variant=\"subtitle2\" color={COLORS_ENUM.PRIMARY}>\n {I18nService.translate('otp.verifyingCode')}\n </rebill-typography>\n <div class=\"spinner\"></div>\n </div>\n )}\n <rebill-button\n type=\"button\"\n variant=\"outline\"\n theme={this.isTimerRunning ? 'secondary' : 'primary'}\n disabled={this.isTimerRunning}\n onClick={this.handleResendCode}\n size=\"small\"\n style={{ height: '24px', marginBottom: '8px' }}\n >\n {this.isTimerRunning\n ? `${I18nService.translate('otp.resendCodeIn')} (${this.timer.getFormattedTime()})`\n : I18nService.translate('otp.resendCode')}\n </rebill-button>\n\n {this.codeResent && (\n <div class=\"code-resent-container\">\n <rebill-typography variant=\"subtitle2\" color={COLORS_ENUM.GREEN}>\n <rebill-icon name=\"check-radio\" />\n {I18nService.translate('otp.codeResent')}\n </rebill-typography>\n </div>\n )}\n <rebill-alert\n class=\"rebill-alert\"\n type=\"secure\"\n variant=\"variant-info\"\n message={I18nService.translate('otp.infoMessage')}\n icon=\"circle-info\"\n alertTitle={I18nService.translate('otp.infoTitle')}\n colorIcon={COLORS_ENUM.PRIMARY_DARK_LIGHT}\n />\n <div class=\"alternative\">\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.PRIMARY_DARK}>\n o\n </rebill-typography>\n </div>\n <div class=\"guest-options\">\n <rebill-button\n type=\"button\"\n variant=\"outline\"\n theme=\"secondary\"\n size=\"medium\"\n onClick={() => {\n this.otpValue = '';\n this.error = false;\n this.returnForm.emit(false);\n }}\n >\n {I18nService.translate('otp.continueAsGuest')}\n </rebill-button>\n\n <rebill-alert\n type=\"secure\"\n variant=\"variant-secure\"\n icon=\"lock-outline\"\n message={I18nService.translate('otp.secureMessage')}\n />\n </div>\n </div>\n );\n }\n}\n",".modal-overlay {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n background-color: transparent;\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 10000;\n padding: 12px 16px;\n box-sizing: border-box;\n}\n\n.modal-content {\n background: white;\n border-radius: 8px;\n padding: 16px 20px;\n width: 350px;\n box-shadow:\n 0 4px 12px -2px rgba(0, 0, 0, 0.15),\n 0 2px 4px -1px rgba(0, 0, 0, 0.1);\n position: relative;\n display: flex;\n align-items: center;\n gap: 12px;\n}\n\n.modal-content .alert {\n margin: 0;\n flex: 1;\n padding: 0;\n background: transparent;\n border: none;\n box-shadow: none;\n}\n\n/* Override para quitar cualquier color de fondo del modal */\n.modal-content .alert {\n background-color: transparent !important;\n border-color: transparent !important;\n}\n\n.modal-content .alert-message {\n display: flex;\n flex-direction: column;\n gap: 4px;\n}\n\n.modal-content .close-button {\n position: absolute;\n top: 8px;\n right: 8px;\n width: 20px;\n height: 20px;\n border: none;\n background: transparent;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 50%;\n transition: background-color 0.2s ease;\n padding: 0;\n margin: 0;\n outline: none;\n box-shadow: none;\n line-height: 1;\n}\n\n.modal-content .close-button:focus {\n outline: none;\n box-shadow: none;\n}\n\n.modal-content .close-button:hover {\n background-color: #f0f0f0;\n}\n\n.modal-content .close-button rebill-icon {\n width: 16px;\n height: 16px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n@media (max-width: 768px) {\n .modal-overlay {\n padding: 8px 12px;\n }\n\n .modal-content {\n padding: 12px 16px;\n flex-direction: column;\n gap: 8px;\n text-align: center;\n }\n\n .modal-content .close-button {\n width: 100%;\n }\n}\n","import { Component, h, State } from '@stencil/core';\nimport { I18nService } from '../../../i18n/i18n.service';\nimport { SessionStore } from '../../../store/session.store';\nimport { COLORS_ENUM } from '../../../utils/color-class-mapper';\n\n@Component({\n tag: 'rebill-modal-overlay',\n styleUrl: 'modal-overlay.css',\n shadow: false,\n})\nexport class ModalOverlay {\n @State() visible: boolean = true;\n @State() languageUpdateTrigger: number = 0;\n private unsubscribeCurrentLocaleStore?: () => void;\n\n componentDidLoad() {\n this.unsubscribeCurrentLocaleStore = SessionStore.onChange('currentLocale', () => {\n this.languageUpdateTrigger++;\n });\n }\n\n disconnectedCallback() {\n if (this.unsubscribeCurrentLocaleStore) {\n this.unsubscribeCurrentLocaleStore();\n }\n }\n\n private closeModal = () => {\n this.visible = false;\n };\n\n render() {\n if (!this.visible) return null;\n\n return (\n <div class=\"modal-overlay\">\n <div class=\"modal-content\">\n <div class=\"alert info filled medium\">\n <div class=\"alert-icon\">\n <rebill-icon name=\"circle-info\" size=\"16px\" color={COLORS_ENUM.ORANGE} />\n </div>\n <div class=\"alert-message\">\n <div class=\"alert-title\">\n <rebill-typography variant=\"subtitle-bold\" color={COLORS_ENUM.PRIMARY_DARK}>\n {I18nService.translate('session.refreshedTitle')}\n </rebill-typography>\n </div>\n <div class=\"alert-message-text\">\n <rebill-typography variant=\"subtitle2\" color={COLORS_ENUM.PRIMARY_DARK}>\n {I18nService.translate('session.refreshedMessage')}\n </rebill-typography>\n </div>\n </div>\n </div>\n <button onClick={this.closeModal} class=\"close-button\" type=\"button\">\n <rebill-icon name=\"close\" size=\"20px\" />\n </button>\n </div>\n </div>\n );\n }\n}\n",":host {\n display: flex;\n position: relative;\n width: 100%;\n justify-content: center;\n align-items: center;\n}\n\n.test-mode-container {\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n gap: 8px;\n width: 100%;\n}\n\n.overlay {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: rgba(0, 0, 0, 0.5);\n z-index: 5;\n animation: fadeIn 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n pointer-events: auto;\n cursor: pointer;\n}\n\n.test-mode-chip-mobile {\n display: flex;\n width: 100%;\n min-width: auto;\n max-width: 100%;\n height: 40px;\n background: #ffffff;\n border: 1px solid #e5e7eb;\n border-radius: 20px;\n box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);\n transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n overflow: hidden;\n position: relative;\n z-index: 20;\n}\n\n.chip-content-mobile {\n display: flex;\n align-items: center;\n gap: 2px;\n justify-content: flex-end;\n min-height: 24px;\n flex-shrink: 0;\n width: 100%;\n margin: 8px;\n}\n\n.test-mode-chip-mobile.expanded .chip-content-mobile {\n justify-content: flex-end;\n width: 100%;\n}\n\n.cards-dropdown-panel-header {\n display: flex;\n align-items: center;\n gap: 8px;\n padding: 8px;\n}\n\n/* Sección de Docs */\n.docs-section {\n display: flex;\n align-items: center;\n gap: 8px;\n cursor: pointer;\n margin-left: 0;\n transition: background-color 0.2s ease;\n justify-content: flex-end;\n padding: 8px;\n margin-top: 8px;\n}\n\n.cards-dropdown-panel {\n position: absolute;\n top: 100%;\n left: 0;\n right: 0;\n width: 100%;\n background: #ffffff;\n border-top: none;\n border-left: 1px solid #e5e7eb;\n border-right: 1px solid #e5e7eb;\n border-bottom: 1px solid #e5e7eb;\n margin-top: 16px;\n z-index: 25;\n animation: expandDown 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n transform-origin: top center;\n}\n\n.card-section {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n}\n\n.header-content {\n display: flex;\n align-items: center;\n gap: 8px;\n margin: 8px;\n}\n\n.card-details {\n background: #fafafa;\n border-radius: 8px;\n border: 1px solid #e5e7eb;\n margin: 8px;\n min-height: 208px;\n display: flex;\n flex-direction: column;\n}\n\n.card-row {\n display: flex;\n gap: 12px;\n align-items: stretch;\n background: #ffffff;\n justify-content: space-around;\n border-radius: 8px;\n border: 1px solid #e5e7eb;\n height: auto;\n padding: 8px;\n margin: 8px;\n}\n\n.card-value {\n display: flex;\n flex-direction: column;\n gap: 6px;\n flex: 1;\n}\n\n.field-value {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 8px;\n max-height: 20px;\n}\n\n.copy-button {\n align-items: center;\n margin-left: auto;\n margin-right: 0;\n}\n\n.icon-button {\n margin-left: auto;\n margin-right: 16px;\n}\n\n/* Animaciones */\n\n@keyframes expandDown {\n from {\n opacity: 0;\n transform: translateY(-10px) scaleY(0.9);\n }\n to {\n opacity: 1;\n transform: translateY(0) scaleY(1);\n }\n}\n\n@keyframes fadeIn {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n}\n","import { Component, Element, h, State } from '@stencil/core';\nimport i18n from '../../../i18n/i18n.config';\nimport { I18nService } from '../../../i18n/i18n.service';\nimport { copyToClipboard } from '../../../utils/clipboard';\nimport { COLORS_ENUM } from '../../../utils/color-class-mapper';\n\n@Component({\n tag: 'rebill-mode-sandbox-mobile',\n styleUrl: 'mode-sandbox-mobile.css',\n shadow: false,\n})\nexport class RebillTestModeChipMobile {\n @Element() el: HTMLElement;\n @State() isPanelVisible = false;\n @State() currentLanguage: string = I18nService.getCurrentLanguage();\n\n componentWillLoad() {\n i18n.on('languageChanged', this.handleLanguageChange);\n }\n\n disconnectedCallback() {\n i18n.off('languageChanged', this.handleLanguageChange);\n }\n\n private handleLanguageChange = () => {\n this.currentLanguage = I18nService.getCurrentLanguage();\n };\n\n private togglePanel = () => {\n this.isPanelVisible = !this.isPanelVisible;\n };\n\n private handleCopy = (text: string) => {\n copyToClipboard(text);\n this.isPanelVisible = false;\n };\n\n private handleDocsClick = () => {\n window.open('https://v3.docs.rebill.com/sdk/checkout', '_blank');\n };\n\n private renderBasicChip() {\n return (\n <div class=\"chip-content-mobile\">\n <div class=\"info-icon\">\n <rebill-icon name=\"circle-info\" size=\"24px\" color={COLORS_ENUM.ORANGE} />\n </div>\n <rebill-typography variant=\"subtitle2\" color={COLORS_ENUM.PRIMARY_DARK}>\n {I18nService.translate('sandbox.testMode')}\n </rebill-typography>\n <div class=\"icon-button\">\n <rebill-button variant=\"text\" size=\"small\" onClick={this.togglePanel}>\n <rebill-icon name=\"hamburger\" />\n </rebill-button>\n </div>\n </div>\n );\n }\n\n private renderCardsPanel() {\n return (\n <div class=\"cards-dropdown-panel\">\n <div class=\"cards-dropdown-panel-header\">\n <rebill-icon name=\"card-test\" />\n <rebill-typography variant=\"subtitle2\" color={COLORS_ENUM.PRIMARY_DARK}>\n {I18nService.translate('sandbox.cardTest')}\n </rebill-typography>\n </div>\n <div class=\"card-details\">\n <div class=\"card-section\">\n <div class=\"header-content\">\n <rebill-icon name=\"succes\" color={COLORS_ENUM.GREEN} />\n <rebill-typography variant=\"subtitle2\" color={COLORS_ENUM.PRIMARY_DARK}>\n {I18nService.translate('sandbox.successPayment')}\n </rebill-typography>\n </div>\n <div class=\"card-row\">\n <div class=\"card-value\">\n <rebill-typography variant=\"subtitle3\" color={COLORS_ENUM.GREY_700}>\n {I18nService.translate('sandbox.cardNumber')}\n </rebill-typography>\n <div class=\"field-value\">\n <rebill-icon name=\"visa\" />\n <rebill-typography variant=\"subtitle2\" color={COLORS_ENUM.PRIMARY_DARK}>\n 4539148803436467\n </rebill-typography>\n </div>\n </div>\n <div class=\"card-value\">\n <rebill-typography variant=\"subtitle3\" color={COLORS_ENUM.GREY_700}>\n {I18nService.translate('sandbox.exp')}\n </rebill-typography>\n <div class=\"field-value\">\n <rebill-typography variant=\"subtitle2\" color={COLORS_ENUM.PRIMARY_DARK}>\n 01/99\n </rebill-typography>\n </div>\n </div>\n <div class=\"card-value\">\n <rebill-typography variant=\"subtitle3\" color={COLORS_ENUM.GREY_700}>\n {I18nService.translate('sandbox.cvv')}\n </rebill-typography>\n <div class=\"field-value field-value-with-copy\">\n <rebill-typography variant=\"subtitle2\" color={COLORS_ENUM.PRIMARY_DARK}>\n 123\n </rebill-typography>\n <div class=\"copy-button\">\n <rebill-button\n variant=\"text\"\n size=\"small\"\n onClick={() => this.handleCopy('4539148803436467 01/99 123')}\n >\n <rebill-icon name=\"copy\" />\n </rebill-button>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"card-section\">\n <div class=\"header-content\">\n <rebill-icon name=\"rejected\" color={COLORS_ENUM.ERROR} />\n <rebill-typography variant=\"subtitle2\" color={COLORS_ENUM.PRIMARY_DARK}>\n {I18nService.translate('sandbox.rejectedPayment')}\n </rebill-typography>\n </div>\n <div class=\"card-row\">\n <div class=\"card-value\">\n <rebill-typography variant=\"subtitle3\" color={COLORS_ENUM.GREY_700}>\n {I18nService.translate('sandbox.cardNumber')}\n </rebill-typography>\n <div class=\"field-value\">\n <rebill-icon name=\"visa\" />\n <rebill-typography variant=\"subtitle2\" color={COLORS_ENUM.PRIMARY_DARK}>\n 4485364739527352\n </rebill-typography>\n </div>\n </div>\n <div class=\"card-value\">\n <rebill-typography variant=\"subtitle3\" color={COLORS_ENUM.GREY_700}>\n {I18nService.translate('sandbox.exp')}\n </rebill-typography>\n <div class=\"field-value\">\n <rebill-typography variant=\"subtitle2\" color={COLORS_ENUM.PRIMARY_DARK}>\n 01/99\n </rebill-typography>\n </div>\n </div>\n <div class=\"card-value\">\n <rebill-typography variant=\"subtitle3\" color={COLORS_ENUM.GREY_700}>\n {I18nService.translate('sandbox.cvv')}\n </rebill-typography>\n <div class=\"field-value field-value-with-copy\">\n <rebill-typography variant=\"subtitle2\" color={COLORS_ENUM.PRIMARY_DARK}>\n 123\n </rebill-typography>\n <div class=\"copy-button\">\n <rebill-button\n variant=\"text\"\n size=\"small\"\n onClick={() => this.handleCopy('4485364739527352 01/99 123')}\n >\n <rebill-icon name=\"copy\" />\n </rebill-button>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"docs-section\" onClick={this.handleDocsClick}>\n <rebill-typography variant=\"subtitle2\" color={COLORS_ENUM.PRIMARY}>\n {I18nService.translate('sandbox.docs')}\n </rebill-typography>\n <rebill-icon name=\"external-link\" />\n </div>\n </div>\n );\n }\n\n render() {\n return (\n <div class={`test-mode-container ${this.isPanelVisible ? 'cards-visible' : ''}`}>\n {this.isPanelVisible && <div class=\"overlay\"></div>}\n <div class={`test-mode-chip-mobile ${this.isPanelVisible ? 'expanded' : ''}`}>\n {this.renderBasicChip()}\n </div>\n {this.isPanelVisible && this.renderCardsPanel()}\n </div>\n );\n }\n}\n","@import '../../../styles/variables.css';\n\n/* Text Content */\n.text-content {\n margin-bottom: 2rem;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 8px;\n}\n\n/* Success View Styles */\n.success-content {\n display: flex;\n flex-direction: column;\n align-items: center;\n gap: 1rem;\n width: 100%;\n overflow-x: hidden;\n box-sizing: border-box;\n}\n.lottie-container {\n width: 80px;\n height: 80px;\n}\n/* Eliminar márgenes del h3 en el componente de éxito */\n.success-content rebill-typography[variant='h3'] {\n margin: 0 !important;\n padding: 0 !important;\n}\n\n.success-icon {\n display: flex;\n justify-content: center;\n margin: 0.5rem 0;\n}\n\n/* Info Cards */\n.success-page__info-card {\n padding: 24px;\n gap: 16px;\n width: 100%;\n max-width: 450px;\n border: 1px solid #ebedef;\n border-radius: 8px;\n display: flex;\n flex-direction: column;\n box-sizing: border-box;\n}\n\n.success-page__card-row {\n display: flex;\n justify-content: space-between;\n align-items: start;\n min-height: 20px;\n gap: 15%;\n}\n\n.success-page__card-row:last-of-type {\n margin-bottom: 0;\n}\n\n.success-page__card-value {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n\n.payment-method-display {\n display: flex;\n align-items: center;\n gap: 8px;\n justify-content: center;\n}\n\n.payment-method-display rebill-card-icon {\n display: inline-block;\n flex-shrink: 0;\n margin-right: 8px;\n vertical-align: middle;\n}\n\n.payment-method-display rebill-card-icon svg {\n display: block;\n}\n\n.payment-method-display rebill-icon {\n display: inline-block;\n vertical-align: middle;\n margin-right: 8px;\n}\n\n.payment-method-display rebill-icon div {\n display: block;\n}\n\n.success-page__card-divider {\n height: 1px;\n background: #e5e7eb;\n}\n\n.download-container {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n gap: 2px;\n text-decoration: none;\n cursor: pointer;\n}\n\n.contact-info {\n text-align: left;\n}\n\n.reference-number {\n word-break: break-all;\n overflow-wrap: break-word;\n hyphens: auto;\n max-width: 100%;\n text-align: right;\n}\n\n.total-amount-container {\n display: flex;\n align-items: center;\n justify-content: flex-end;\n gap: 8px;\n flex-direction: row;\n}\n\n.trial-pill {\n background-color: var(--rebill-color-green-light-2);\n border-radius: 4px;\n padding: 4px 6px 4px 6px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.next-charge-header {\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n margin-bottom: 12px;\n}\n\n.next-charge-details {\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n}\n\n.next-charge-amount {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 4px;\n}\n\n.next-charge-date {\n text-align: right;\n}\n\n/* Responsive Styles */\n@media (max-width: 1024px) {\n .success-content {\n max-width: 100%;\n gap: 1.5rem;\n margin-left: 16px;\n margin-right: 16px;\n }\n\n .success-page__info-card {\n width: 100%;\n max-width: 100%;\n padding: 12px;\n }\n .text-content {\n gap: 12px;\n }\n}\n\n@media (max-width: 767px) {\n .success-page__info-card {\n padding: 12px;\n }\n\n .processing-container {\n padding: 0 16px;\n }\n}\n","import { Component, Event, EventEmitter, h, Prop, State } from '@stencil/core';\nimport { I18nService } from '../../../i18n/i18n.service';\nimport { ENUM_INSTALLMENT_MODEL } from '../../../models/enums/installment.enum';\nimport { PAYMENT_METHOD_ENUM } from '../../../models/enums/payment-methods.enum';\nimport { SESSION_ITEM_TYPE_ENUM } from '../../../models/enums/session.enum';\nimport { sessionState, SessionStore } from '../../../store/session.store';\nimport { formatDateTime } from '../../../utils';\nimport { getAssetURL } from '../../../utils/assets';\nimport { BREAKPOINT_ENUM, getBreakpoint, isBreakpointBelow } from '../../../utils/breakpoint';\nimport { COLORS_ENUM } from '../../../utils/color-class-mapper';\nimport { formatAmount } from '../../../utils/currency-formatter';\nimport { getPaymentMethodDisplayName } from '../../../utils/get-payment-method-display-name';\nimport {\n getInstallmentLabelSummary,\n getRecalculatedInstallmentAmount,\n} from '../../../utils/installment-utils';\nimport { PDFGenerator } from '../../../utils/pdf-generator';\n\n@Component({\n tag: 'success-page',\n styleUrl: 'success-page.css',\n shadow: false,\n})\nexport class CardSuccessPage {\n @Prop() typePaymentMethod: PAYMENT_METHOD_ENUM = PAYMENT_METHOD_ENUM.CARD;\n @Prop() country?: string = '';\n @Prop() bank?: string = '';\n @Prop() paymentMethodName?: string = '';\n @Prop() cardLastFour?: string = '';\n @Prop() paymentDate: string = '';\n @Prop() referenceNumber: string = '';\n @Prop() trialPeriodDays?: number = 0;\n @Prop() debitDay?: number = 0;\n @Prop() planAmount?: number = 0;\n @State() currentLocale: string = sessionState.currentLocale;\n @State() breakpoint: BREAKPOINT_ENUM = BREAKPOINT_ENUM.DESKTOP;\n\n @Event() successRedirect: EventEmitter<any>;\n @State() loaderProgress: number = 0;\n @State() isLoadingLottie: boolean = true;\n @State() showRedirectMessage: boolean = false;\n @Prop() timeToRedirect: number = 3000;\n private progressInterval?: number;\n private lottieContainer?: HTMLElement;\n private lottieAnimation?: any;\n private unsubscribeCurrentLocaleStore?: () => void;\n private successDisplayTimeout?: number;\n\n private applyStartCaseToBrand = (brand: string): string => {\n if (!brand) return '';\n\n return brand\n .toLowerCase()\n .split(/[\\s-]+/)\n .map(word => word.charAt(0).toUpperCase() + word.slice(1))\n .join(' ');\n };\n\n private getPaymentDate = (): string => {\n const payment = sessionState?.data?.payment;\n if (!payment) return '';\n\n if ('createdAt' in payment) {\n return payment.createdAt;\n }\n\n return '';\n };\n\n componentWillLoad() {\n this.breakpoint = getBreakpoint(window.innerWidth);\n this.unsubscribeCurrentLocaleStore = SessionStore.onChange('currentLocale', () => {\n this.currentLocale = sessionState.currentLocale;\n });\n\n if (sessionState.data?.itemInformation?.redirectSuccess) {\n this.successDisplayTimeout = window.setTimeout(() => {\n this.showRedirectMessage = true;\n this.loadLottieAnimation();\n }, 1500);\n\n setTimeout(() => {\n let redirectUrl = sessionState.data?.itemInformation?.redirectSuccess;\n if (redirectUrl) {\n this.successRedirect.emit({ redirectUrl });\n this.stopLoaderAnimation();\n }\n }, this.timeToRedirect);\n }\n }\n\n componentDidLoad() {\n window.addEventListener('resize', this.handleResize);\n if (!sessionState.data?.itemInformation?.redirectSuccess || this.showRedirectMessage) {\n this.loadLottieAnimation();\n }\n }\n\n disconnectedCallback() {\n if (this.unsubscribeCurrentLocaleStore) {\n this.unsubscribeCurrentLocaleStore();\n }\n if (this.successDisplayTimeout) {\n clearTimeout(this.successDisplayTimeout);\n }\n window.removeEventListener('resize', this.handleResize);\n this.stopLoaderAnimation();\n }\n\n private handleResize = () => {\n this.breakpoint = getBreakpoint(window.innerWidth);\n };\n private loadLottieAnimation = async () => {\n try {\n const lottie = await import('lottie-web');\n const animationData = await fetch(getAssetURL(`loader-redirect1.json`));\n const animationJson = await animationData.json();\n\n if (this.lottieContainer) {\n this.lottieAnimation = lottie.default.loadAnimation({\n container: this.lottieContainer,\n renderer: 'svg',\n loop: true,\n autoplay: true,\n animationData: animationJson,\n });\n } else {\n this.startLoaderAnimation();\n }\n } catch (error) {\n this.startLoaderAnimation();\n }\n };\n\n private startLoaderAnimation = () => {\n const duration = 3000;\n const interval = 50;\n const increment = (interval / duration) * 100;\n\n this.progressInterval = window.setInterval(() => {\n this.loaderProgress = Math.min(this.loaderProgress + increment, 100);\n if (this.loaderProgress >= 100) {\n this.stopLoaderAnimation();\n }\n }, interval);\n };\n\n private stopLoaderAnimation = () => {\n if (this.progressInterval) {\n clearInterval(this.progressInterval);\n this.progressInterval = undefined;\n }\n if (this.lottieAnimation) {\n this.lottieAnimation.destroy();\n this.lottieAnimation = undefined;\n }\n };\n\n private handleDownloadReceipt = async () => {\n try {\n await PDFGenerator.generateAndDownloadReceipt({\n paymentMethod:\n this.typePaymentMethod === PAYMENT_METHOD_ENUM.CARD\n ? this.textPaymentMethodCard()\n : this.paymentMethodName,\n ...(this.typePaymentMethod === PAYMENT_METHOD_ENUM.BANK_TRANSFER && { bank: this.bank }),\n ...(this.typePaymentMethod === PAYMENT_METHOD_ENUM.CARD && {\n cardBrand: this.applyStartCaseToBrand(sessionState.data.cardInformation?.brand || ''),\n }),\n ...(this.typePaymentMethod === PAYMENT_METHOD_ENUM.CARD && {\n cardLastFour: this.cardLastFour ?? sessionState.data.cardInformation?.lastFour,\n }),\n paymentDate: formatDateTime(this.getPaymentDate()) || '',\n email: sessionState?.data?.userInformation?.email || '',\n referenceNumber: this.referenceNumber,\n productTitle: sessionState?.data?.itemInformation?.title || '',\n subtotal: this.getFormattedSubtotal(),\n total: this.getFormattedTotal(),\n currency: sessionState?.data?.pricing?.currency || ' ',\n installments:\n sessionState?.data?.pricing?.installments &&\n sessionState?.data?.cardInformation?.installments?.selectedInstallment\n ? `${getInstallmentLabelSummary(\n sessionState.data?.cardInformation?.installments?.selectedInstallment?.installment,\n getRecalculatedInstallmentAmount(\n sessionState.data?.cardInformation?.installments?.selectedInstallment\n ?.installmentAmount || 0,\n ),\n sessionState.data?.pricing?.currency,\n sessionState.data?.cardInformation?.installments?.selectedInstallment?.cft,\n sessionState.data?.cardInformation?.installments?.selectedInstallment?.model,\n )}\\n( ${I18nService.translate('processing.purchaseTotal')}: ${this.getFormattedTotal()} )${\n sessionState.data.cardInformation?.installments?.installments.find(\n installment =>\n installment.installment ===\n sessionState.data.cardInformation?.installments?.selectedInstallment\n ?.installment,\n )?.model === ENUM_INSTALLMENT_MODEL.CUSTOMER_FINANCED\n ? `\\n${I18nService.translate('installments.interest')}`\n : ''\n }`\n : '',\n discountAmount: this.getFormattedDiscountAmount(),\n trialPeriodDays:\n this.trialPeriodDays || sessionState.data?.itemInformation?.trial?.trialPeriodDays,\n debitDay: this.debitDay || sessionState.data?.itemInformation?.debitDay,\n planAmount: this.getFormattedSubtotal(this.planAmount),\n trialEndDate: this.hasFreeTrial() ? this.getTrialEndDateFormatted() : undefined,\n debitDate: this.hasDebitDay() ? this.getDebitDateFormatted() : undefined,\n isBankTransfer: this.typePaymentMethod === PAYMENT_METHOD_ENUM.BANK_TRANSFER,\n });\n } catch (error) {\n console.error('Error downloading receipt:', error);\n }\n };\n\n private getFormattedDiscountAmount = () => {\n if (sessionState?.data?.pricing?.discountAmount > 0) {\n const formattedAmount = formatAmount(\n sessionState.data?.pricing?.discountAmount,\n sessionState.data?.pricing?.currency,\n );\n return `-${formattedAmount}`;\n }\n return undefined;\n };\n\n private getFormattedSubtotal = (planAmount: number = 0 || null) => {\n return formatAmount(\n planAmount || sessionState?.data?.pricing?.subtotal,\n sessionState?.data?.pricing?.currency,\n );\n };\n\n private getFormattedTotal = () => {\n if (this.trialPeriodDays > 0) {\n return formatAmount(0, sessionState?.data?.pricing?.currency);\n }\n return formatAmount(sessionState?.data?.pricing?.total, sessionState?.data?.pricing?.currency);\n };\n\n private hasFreeTrial = () => {\n return (\n sessionState.data?.itemInformation?.type === SESSION_ITEM_TYPE_ENUM.PLAN &&\n sessionState.data?.itemInformation?.trial?.trialPeriodDays &&\n sessionState.data?.itemInformation?.trial?.trialPeriodDays > 0\n );\n };\n\n private hasDebitDay = () => {\n const debitDay = sessionState.data?.itemInformation?.debitDay;\n return debitDay && debitDay > 0;\n };\n\n private getTrialEndDateFormatted = () => {\n const trialEndsAt = sessionState.data?.itemInformation?.trial?.trialPeriodEndsAt;\n if (!trialEndsAt) return '';\n\n const date = new Date(trialEndsAt);\n const currentLanguage = I18nService.getCurrentLanguage();\n const locale =\n currentLanguage === 'es' ? 'es-ES' : currentLanguage === 'pt' ? 'pt-BR' : 'en-US';\n\n if (currentLanguage === 'en') {\n return `${date.toLocaleDateString(locale, { month: 'long' })} ${date.getDate()}`;\n } else {\n return `${date.getDate()} de ${date.toLocaleDateString(locale, { month: 'long' })}`;\n }\n };\n\n private getDebitDateFormatted = () => {\n const debitDay = sessionState.data?.itemInformation?.debitDay;\n if (!debitDay || debitDay <= 0) return '';\n\n const today = new Date();\n const targetDate = new Date(today);\n const currentLanguage = I18nService.getCurrentLanguage();\n const locale =\n currentLanguage === 'es' ? 'es-ES' : currentLanguage === 'pt' ? 'pt-BR' : 'en-US';\n if (debitDay < today.getDate()) {\n targetDate.setMonth(today.getMonth() + 1);\n }\n targetDate.setDate(debitDay);\n\n while (targetDate.getDate() !== debitDay) {\n targetDate.setDate(targetDate.getDate() - 1);\n }\n\n if (currentLanguage === 'en') {\n return `${targetDate.toLocaleDateString(locale, { month: 'long' })} ${targetDate.getDate()}`;\n } else {\n return `${targetDate.getDate()} de ${targetDate.toLocaleDateString(locale, { month: 'long' })}`;\n }\n };\n\n private textPaymentMethodCard = () => {\n const cardBrand = sessionState.data?.cardInformation?.brand;\n const cardLastFour = this.cardLastFour || sessionState?.data?.cardInformation?.lastFour;\n\n const formattedBrand = this.applyStartCaseToBrand(cardBrand || '');\n return cardBrand && cardLastFour ? `${formattedBrand} - ${cardLastFour}` : formattedBrand;\n };\n\n render() {\n const hasRedirect = sessionState.data?.itemInformation?.redirectSuccess;\n\n return (\n <rebill-checkout-single-column>\n <div class=\"success-content\">\n <rebill-typography variant=\"h3\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {hasRedirect && this.showRedirectMessage\n ? I18nService.translate('processing.redirectMessage')\n : I18nService.translate('processing.successTitle')}\n </rebill-typography>\n\n {hasRedirect && this.showRedirectMessage ? (\n <div class=\"redirect-message\">\n <div class=\"lottie-container\">\n <div ref={el => (this.lottieContainer = el)} class=\"lottie-animation\"></div>\n </div>\n </div>\n ) : (\n <div class=\"success-icon\">\n <svg\n width={isBreakpointBelow(this.breakpoint, BREAKPOINT_ENUM.DESKTOP) ? '64' : '96'}\n height={isBreakpointBelow(this.breakpoint, BREAKPOINT_ENUM.DESKTOP) ? '64' : '96'}\n viewBox=\"0 0 96 96\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n fill-rule=\"evenodd\"\n clip-rule=\"evenodd\"\n d=\"M7.99219 47.998C7.99219 25.9067 25.9008 7.99805 47.9922 7.99805C70.0836 7.99805 87.9922 25.9067 87.9922 47.998C87.9922 70.0894 70.0836 87.998 47.9922 87.998C25.9008 87.998 7.99219 70.0894 7.99219 47.998ZM61.5401 39.2645C62.2396 38.4096 62.1136 37.1496 61.2587 36.4501C60.4038 35.7507 59.1437 35.8767 58.4443 36.7316L41.8437 57.0211L35.4064 50.5838C34.6254 49.8028 33.359 49.8028 32.578 50.5838C31.7969 51.3649 31.7969 52.6312 32.578 53.4123L40.578 61.4123C40.9775 61.8118 41.5275 62.0237 42.0918 61.9956C42.6562 61.9674 43.1823 61.7019 43.5401 61.2645L61.5401 39.2645Z\"\n fill=\"#35B093\"\n />\n </svg>\n </div>\n )}\n\n {/* Payment Details Card */}\n <div class=\"success-page__info-card\">\n <div class=\"success-page__card-row\">\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.SECONDARY}>\n {I18nService.translate('processing.paymentMethod')}\n </rebill-typography>\n <div class=\"success-page__card-value\">\n <div class=\"payment-method-display\">\n {this.typePaymentMethod === PAYMENT_METHOD_ENUM.CARD && (\n <>\n <rebill-card-icon\n card-brand={sessionState.data?.cardInformation?.brand || ''}\n />\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {this.textPaymentMethodCard()}\n </rebill-typography>\n </>\n )}\n {this.typePaymentMethod === PAYMENT_METHOD_ENUM.BANK_TRANSFER && (\n <div style={{ display: 'flex', alignItems: 'center', gap: '8px' }}>\n <rebill-icon\n name={\n getPaymentMethodDisplayName(\n PAYMENT_METHOD_ENUM.BANK_TRANSFER,\n this.country,\n )?.toLowerCase() || 'card'\n }\n />\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {I18nService.translate('paymentMethods.bank_transfer')}\n </rebill-typography>\n </div>\n )}\n </div>\n </div>\n </div>\n {sessionState?.data?.pricing?.installments &&\n sessionState?.data?.cardInformation?.installments?.selectedInstallment && (\n <div>\n <div class=\"success-page__card-row\">\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.SECONDARY}>\n {I18nService.translate('summary.installments')}\n </rebill-typography>\n <div\n style={{\n display: 'flex',\n flexDirection: 'column',\n gap: '10px',\n alignItems: 'end',\n }}\n >\n <rebill-typography\n variant=\"body2\"\n color={COLORS_ENUM.PRIMARY_DARK_TEXT}\n style={{ textAlign: 'end' }}\n >\n {getInstallmentLabelSummary(\n sessionState.data?.cardInformation?.installments?.selectedInstallment\n ?.installment,\n getRecalculatedInstallmentAmount(\n sessionState.data?.cardInformation?.installments?.selectedInstallment\n ?.installmentAmount || 0,\n ),\n sessionState.data?.pricing?.currency,\n sessionState.data?.cardInformation?.installments?.selectedInstallment\n ?.cft,\n sessionState.data?.cardInformation?.installments?.selectedInstallment\n ?.model,\n )}\n </rebill-typography>\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {`( ${I18nService.translate('processing.purchaseTotal')}: ${this.getFormattedTotal()} )`}\n </rebill-typography>\n {sessionState.data.cardInformation?.installments?.installments.find(\n installment =>\n installment.installment ===\n sessionState.data.cardInformation?.installments?.selectedInstallment\n ?.installment,\n )?.model === ENUM_INSTALLMENT_MODEL.CUSTOMER_FINANCED && (\n <rebill-typography\n variant=\"italic\"\n color={COLORS_ENUM.SECONDARY}\n style={{ textAlign: 'end' }}\n >\n {`${I18nService.translate('installments.interest')}`}\n </rebill-typography>\n )}\n </div>\n </div>\n </div>\n )}\n <div class=\"success-page__card-row\">\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.SECONDARY}>\n {I18nService.translate('processing.paymentDate')}\n </rebill-typography>\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {formatDateTime(\n this.paymentDate || this.getPaymentDate() || sessionState.createdAt,\n ) || ''}\n </rebill-typography>\n </div>\n <div class=\"success-page__card-row\">\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.SECONDARY}>\n {I18nService.translate('processing.paymentEmail')}\n </rebill-typography>\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {sessionState?.data?.userInformation?.email}\n </rebill-typography>\n </div>\n <div class=\"success-page__card-row\">\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.SECONDARY}>\n {I18nService.translate('processing.paymentReference')}\n </rebill-typography>\n <rebill-typography\n variant=\"body2\"\n color={COLORS_ENUM.PRIMARY_DARK_TEXT}\n class=\"reference-number\"\n >\n {this.referenceNumber || ''}\n </rebill-typography>\n </div>\n </div>\n\n {/* Purchase Details Card */}\n <div class=\"success-page__info-card\">\n <rebill-typography variant=\"subtitle-bold\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {I18nService.translate('processing.purchaseDetails')}\n </rebill-typography>\n <div class=\"success-page__card-row\">\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.SECONDARY}>\n {I18nService.translate('processing.purchaseDetail')}\n </rebill-typography>\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {sessionState?.data?.itemInformation?.title || ''}\n </rebill-typography>\n </div>\n {!this.trialPeriodDays && (\n <div class=\"success-page__card-row\">\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.SECONDARY}>\n {I18nService.translate('processing.purchaseSubtotal')}\n </rebill-typography>\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {this.getFormattedSubtotal()}\n </rebill-typography>\n </div>\n )}\n {sessionState?.data?.pricing?.discountAmount > 0 && (\n <div class=\"success-page__card-row\">\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.SECONDARY}>\n {I18nService.translate('summary.discount')}\n </rebill-typography>\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {this.getFormattedDiscountAmount()}\n </rebill-typography>\n </div>\n )}\n <div class=\"success-page__card-row\">\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.SECONDARY}>\n {I18nService.translate('processing.purchaseMontoTotal')}\n </rebill-typography>\n <div class=\"total-amount-container\">\n {this.trialPeriodDays > 0 && (\n <div class=\"trial-pill\">\n <rebill-typography\n variant=\"body2\"\n align=\"center\"\n color={COLORS_ENUM.GREEN_TEXT}\n >\n {I18nService.translate('processing.trialPill', {\n days: this.trialPeriodDays,\n count: this.trialPeriodDays,\n })}\n </rebill-typography>\n </div>\n )}\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {this.getFormattedTotal()}\n </rebill-typography>\n </div>\n </div>\n {(this.trialPeriodDays || this.hasDebitDay()) && (\n <div class=\"success-page__card-divider\"></div>\n )}\n\n {/* Next Charge Section */}\n {(this.hasFreeTrial() || this.hasDebitDay()) && (\n <div class=\"next-charge-section\">\n <div class=\"next-charge-header\">\n <rebill-typography variant=\"subtitle-bold\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {I18nService.translate('processing.nextCharge')}\n </rebill-typography>\n <rebill-typography variant=\"subtitle-bold\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {I18nService.translate('processing.onDate', {\n date: this.hasFreeTrial()\n ? this.getTrialEndDateFormatted()\n : this.getDebitDateFormatted(),\n })}\n </rebill-typography>\n </div>\n <div class=\"success-page__card-row\">\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {this.hasFreeTrial() ? I18nService.translate('processing.atEndOfTrial') : ''}\n </rebill-typography>\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {this.getFormattedSubtotal(this.planAmount)}{' '}\n {I18nService.translate('processing.perMonth')}\n </rebill-typography>\n </div>\n </div>\n )}\n <div class=\"success-page__card-divider\"></div>\n <div class=\"download-container\">\n <svg\n class=\"download-icon\"\n width=\"16\"\n height=\"16\"\n viewBox=\"0 0 16 16\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M13.498 9.83333V12.1667C13.498 12.903 12.9011 13.5 12.1647 13.5H3.83138C3.095 13.5 2.49805 12.903 2.49805 12.1667V9.83333M7.99804 10V2.5M7.99804 10L5.66471 7.66667M7.99804 10L10.3314 7.66667\"\n stroke=\"currentColor\"\n stroke-linecap=\"round\"\n stroke-linejoin=\"round\"\n />\n </svg>\n <rebill-button\n type=\"button\"\n variant=\"download\"\n size=\"small\"\n onClick={this.handleDownloadReceipt}\n >\n <rebill-typography variant=\"overline\" color={COLORS_ENUM.PRIMARY_DARK_TEXT}>\n {I18nService.translate('processing.download')}\n </rebill-typography>\n </rebill-button>\n </div>\n\n {/* Contact Info */}\n <div class=\"contact-info\">\n <rebill-typography variant=\"information-text\" color={COLORS_ENUM.SECONDARY}>\n {I18nService.translate('processing.downloadDescription')}\n </rebill-typography>\n </div>\n </div>\n </div>\n </rebill-checkout-single-column>\n );\n }\n}\n",":host {\n display: block;\n}\n\n.inputs-container {\n display: flex;\n flex-direction: column;\n gap: 16px;\n width: 100%;\n}\n.customer-exists {\n display: flex;\n justify-content: flex-end;\n margin-bottom: 16px;\n}\n","import { Component, Event, EventEmitter, h, Host, Listen, Prop } from '@stencil/core';\nimport { api } from '../../../api';\nimport { I18nService } from '../../../i18n/i18n.service';\nimport { sessionState, SessionStore } from '../../../store/session.store';\n\n@Component({\n tag: 'user-information',\n styleUrl: 'user-information.css',\n shadow: false,\n})\nexport class UserInformation {\n @Prop() userInformation: {\n email?: string;\n fullName?: string;\n countryCode?: string;\n phoneNumber?: {\n number: string;\n countryCode: string;\n };\n } = {\n email: '',\n fullName: '',\n countryCode: '',\n };\n\n @Prop() errors: {\n email?: string;\n fullName?: string;\n } | null = null;\n\n @Prop() customerExists: boolean = false;\n @Prop() disabled: boolean = false;\n @Event() onRebillAccountClick: EventEmitter<boolean>;\n\n private translateError(errorKey: string | undefined): string {\n if (!errorKey) return '';\n if (errorKey.includes('validation.') || errorKey.includes('paymentErrors.')) {\n return I18nService.translate(errorKey);\n }\n return errorKey;\n }\n\n @Listen('input')\n handleInputChange(event: CustomEvent<{ id: string; value: string }>) {\n if (!event.detail) return;\n\n const { id, value } = event.detail;\n SessionStore.setUserInformation({ [id]: value });\n }\n\n @Listen('blur')\n handleBlur(event: CustomEvent<{ id: string; value: string }>) {\n if (!event.detail) return;\n\n const { id, value } = event.detail;\n SessionStore.setUserInformation({ [id]: value });\n }\n\n private getCardLabels() {\n const labels = [];\n\n if (sessionState.data.prefilledData.email) {\n labels.push({\n label: I18nService.translate('userInformation.emailPlaceholder'),\n value: sessionState.data.prefilledData.email,\n });\n SessionStore.setUserInformation({\n ...sessionState.data.userInformation,\n email: sessionState.data.prefilledData.email,\n });\n }\n\n if (sessionState.data.prefilledData.fullName) {\n labels.push({\n label: I18nService.translate('userInformation.fullNamePlaceholder'),\n value: sessionState.data.prefilledData.fullName,\n });\n SessionStore.setUserInformation({\n ...sessionState.data.userInformation,\n fullName: sessionState.data.prefilledData.fullName,\n });\n }\n\n return labels;\n }\n private async handleRebillAccountClick() {\n api.otp.generate(sessionState.data.sessionId, {\n email: sessionState.data.userInformation.email,\n });\n this.onRebillAccountClick.emit(true);\n }\n\n private renderInputs() {\n const hasPrefilledEmail = sessionState.data.prefilledData.email;\n const hasPrefilledName = sessionState.data.prefilledData.fullName;\n\n const inputs = [];\n\n if (!hasPrefilledEmail) {\n inputs.push(\n <rebill-input-text\n id=\"email\"\n variant=\"floating\"\n label={I18nService.translate('userInformation.emailPlaceholder')}\n placeholder={I18nService.translate('userInformation.emailPlaceholder')}\n left-icon=\"email\"\n clearable={true}\n disabled={this.disabled}\n error={this.translateError(this.errors?.email)}\n />,\n );\n }\n\n if (!hasPrefilledName) {\n inputs.push(\n <rebill-input-text\n id=\"fullName\"\n variant=\"floating\"\n label={I18nService.translate('userInformation.fullNamePlaceholder')}\n placeholder={I18nService.translate('userInformation.fullNamePlaceholder')}\n disabled={this.disabled}\n error={this.translateError(this.errors?.fullName)}\n />,\n );\n }\n\n return inputs.length > 0 ? (\n <div\n class=\"inputs-container\"\n style={{\n marginTop: inputs.length > 0 && (hasPrefilledEmail || hasPrefilledName) ? '1rem' : '0',\n }}\n >\n {inputs}\n </div>\n ) : null;\n }\n\n render() {\n const customerExistsButton = (\n <div class=\"customer-exists\">\n <rebill-button\n style={{\n visibility: this.customerExists ? 'visible' : 'hidden',\n opacity: this.customerExists ? '1' : '0',\n transition: 'opacity 0.3s ease-in-out',\n }}\n variant=\"text\"\n size=\"small\"\n onClick={() => this.handleRebillAccountClick()}\n icon=\"lock\"\n >\n {I18nService.translate('userInformation.rebillAccount')}\n <rebill-icon name=\"arrow-right\" />\n </rebill-button>\n </div>\n );\n\n const hasPrefilledEmail = sessionState.data.prefilledData.email;\n const hasPrefilledName = sessionState.data.prefilledData.fullName;\n const hasAnyPrefilled = hasPrefilledEmail || hasPrefilledName;\n\n return (\n <Host>\n {customerExistsButton}\n {hasAnyPrefilled && (\n <rebill-card\n cardTitle={I18nService.translate('userInformation.personalInformation')}\n cardLabels={this.getCardLabels()}\n />\n )}\n {this.renderInputs()}\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
@@ -1 +1 @@
1
- {"version":3,"file":"rebill-footer.entry.esm.js","sources":["src/components/checkout/rebill-footer/rebill-footer.css?tag=rebill-footer","src/components/checkout/rebill-footer/rebill-footer.tsx"],"sourcesContent":[".language-selector {\n display: flex;\n align-items: center;\n margin-right: 12px;\n height: 24px;\n}\n.footer-content {\n display: flex;\n justify-content: space-between;\n align-items: center;\n width: 100%;\n margin-bottom: 18px;\n}\n\n.terms-and-conditions {\n display: flex;\n align-items: center;\n gap: 4px;\n margin-left: 12px;\n}\n\n.footer-powered {\n margin-right: 4px;\n}\n\n.footer-separator {\n margin-right: 6px;\n margin-left: 6px;\n}\n\n.footer-link,\n.footer-powered,\n.footer-separator {\n display: flex;\n align-items: center;\n}\n\n.footer-link a {\n font-size: inherit;\n font-weight: inherit;\n line-height: inherit;\n letter-spacing: inherit;\n color: inherit;\n text-decoration: none;\n}\n","import { Component, h, State } from '@stencil/core';\nimport { I18nService } from '../../../i18n/i18n.service';\nimport { LOCALES_ENUM } from '../../../models/enums/locales.enum';\nimport { sessionState, SessionStore } from '../../../store/session.store';\nimport { BREAKPOINT_ENUM, getBreakpoint, isBreakpointBelow } from '../../../utils/breakpoint';\nimport { COLORS_ENUM } from '../../../utils/color-class-mapper';\n\n@Component({\n tag: 'rebill-footer',\n styleUrl: 'rebill-footer.css',\n shadow: false,\n})\nexport class RebillFooter {\n @State() breakpoint: BREAKPOINT_ENUM = BREAKPOINT_ENUM.DESKTOP;\n\n resizeHandler = () => {\n this.breakpoint = getBreakpoint(window.innerWidth);\n };\n\n disconnectedCallback() {\n window.removeEventListener('resize', this.resizeHandler);\n }\n\n async componentWillLoad() {\n this.resizeHandler();\n window.addEventListener('resize', this.resizeHandler);\n const language = I18nService.getCurrentLanguage();\n SessionStore.changeLanguage(language);\n }\n private handleLanguageChange = (event: any) => {\n I18nService.changeLanguage(event.detail.value);\n SessionStore.changeLanguage(event.detail.value);\n };\n render() {\n return (\n <div class=\"footer-content\">\n <div class=\"terms-and-conditions\">\n {!isBreakpointBelow(this.breakpoint, BREAKPOINT_ENUM.DESKTOP) && (\n <rebill-typography\n variant=\"subtitle3\"\n color={COLORS_ENUM.SECONDARY}\n class=\"footer-powered\"\n >\n {I18nService.translate('footer.poweredBy')}\n </rebill-typography>\n )}\n <rebill-icon name=\"rebill-logo\" color={COLORS_ENUM.SECONDARY} />\n <rebill-icon name=\"rebill\" color={COLORS_ENUM.SECONDARY} />\n <rebill-typography\n variant=\"subtitle3\"\n color={COLORS_ENUM.SECONDARY}\n class=\"footer-separator\"\n >\n |\n </rebill-typography>\n <rebill-typography variant=\"subtitle3\" color={COLORS_ENUM.SECONDARY} class=\"footer-link\">\n <a\n href=\"https://www.rebill.com/terminos-y-condiciones-usuarios-finales\"\n target=\"_blank\"\n >\n {I18nService.translate('footer.termsAndConditions')}\n </a>\n </rebill-typography>\n </div>\n <div class=\"language-selector\">\n <rebill-icon name=\"world\" />\n <rebill-input-select\n id=\"language-selector\"\n variant=\"underlined\"\n backgroundColor={\n isBreakpointBelow(this.breakpoint, BREAKPOINT_ENUM.DESKTOP)\n ? ''\n : 'var(--rebill-color-background-left)'\n }\n options={[\n { label: 'EN', value: LOCALES_ENUM.EN },\n { label: 'ES', value: LOCALES_ENUM.ES },\n { label: 'PT', value: LOCALES_ENUM.PT },\n ]}\n value={sessionState.currentLocale}\n on-input={this.handleLanguageChange}\n fontSize=\"10px\"\n dropPosition=\"up\"\n arrowIcon=\"down\"\n class=\"language-selector-input\"\n />\n </div>\n </div>\n );\n }\n}\n"],"names":["sessionState"],"mappings":"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"}
1
+ {"version":3,"file":"rebill-footer.entry.esm.js","sources":["src/components/checkout/rebill-footer/rebill-footer.css?tag=rebill-footer","src/components/checkout/rebill-footer/rebill-footer.tsx"],"sourcesContent":[".language-selector {\n display: flex;\n align-items: center;\n margin-right: 12px;\n height: 24px;\n}\n.rebill-footer__footer-content {\n display: flex;\n justify-content: space-between;\n align-items: center;\n width: 100%;\n margin-bottom: 18px;\n}\n\n.terms-and-conditions {\n display: flex;\n align-items: center;\n gap: 4px;\n margin-left: 12px;\n}\n\n.footer-powered {\n margin-right: 4px;\n}\n\n.footer-separator {\n margin-right: 6px;\n margin-left: 6px;\n}\n\n.footer-link,\n.footer-powered,\n.footer-separator {\n display: flex;\n align-items: center;\n}\n\n.footer-link a {\n font-size: inherit;\n font-weight: inherit;\n line-height: inherit;\n letter-spacing: inherit;\n color: inherit;\n text-decoration: none;\n}\n","import { Component, h, State } from '@stencil/core';\nimport { I18nService } from '../../../i18n/i18n.service';\nimport { LOCALES_ENUM } from '../../../models/enums/locales.enum';\nimport { sessionState, SessionStore } from '../../../store/session.store';\nimport { BREAKPOINT_ENUM, getBreakpoint, isBreakpointBelow } from '../../../utils/breakpoint';\nimport { COLORS_ENUM } from '../../../utils/color-class-mapper';\n\n@Component({\n tag: 'rebill-footer',\n styleUrl: 'rebill-footer.css',\n shadow: false,\n})\nexport class RebillFooter {\n @State() breakpoint: BREAKPOINT_ENUM = BREAKPOINT_ENUM.DESKTOP;\n\n resizeHandler = () => {\n this.breakpoint = getBreakpoint(window.innerWidth);\n };\n\n disconnectedCallback() {\n window.removeEventListener('resize', this.resizeHandler);\n }\n\n async componentWillLoad() {\n this.resizeHandler();\n window.addEventListener('resize', this.resizeHandler);\n const language = I18nService.getCurrentLanguage();\n SessionStore.changeLanguage(language);\n }\n private handleLanguageChange = (event: any) => {\n I18nService.changeLanguage(event.detail.value);\n SessionStore.changeLanguage(event.detail.value);\n };\n render() {\n return (\n <div class=\"rebill-footer__footer-content\">\n <div class=\"terms-and-conditions\">\n {!isBreakpointBelow(this.breakpoint, BREAKPOINT_ENUM.DESKTOP) && (\n <rebill-typography\n variant=\"subtitle3\"\n color={COLORS_ENUM.SECONDARY}\n class=\"footer-powered\"\n >\n {I18nService.translate('footer.poweredBy')}\n </rebill-typography>\n )}\n <rebill-icon name=\"rebill-logo\" color={COLORS_ENUM.SECONDARY} />\n <rebill-icon name=\"rebill\" color={COLORS_ENUM.SECONDARY} />\n <rebill-typography\n variant=\"subtitle3\"\n color={COLORS_ENUM.SECONDARY}\n class=\"footer-separator\"\n >\n |\n </rebill-typography>\n <rebill-typography variant=\"subtitle3\" color={COLORS_ENUM.SECONDARY} class=\"footer-link\">\n <a\n href=\"https://www.rebill.com/terminos-y-condiciones-usuarios-finales\"\n target=\"_blank\"\n >\n {I18nService.translate('footer.termsAndConditions')}\n </a>\n </rebill-typography>\n </div>\n <div class=\"language-selector\">\n <rebill-icon name=\"world\" />\n <rebill-input-select\n id=\"language-selector\"\n variant=\"underlined\"\n backgroundColor={\n isBreakpointBelow(this.breakpoint, BREAKPOINT_ENUM.DESKTOP)\n ? ''\n : 'var(--rebill-color-background-left)'\n }\n options={[\n { label: 'EN', value: LOCALES_ENUM.EN },\n { label: 'ES', value: LOCALES_ENUM.ES },\n { label: 'PT', value: LOCALES_ENUM.PT },\n ]}\n value={sessionState.currentLocale}\n on-input={this.handleLanguageChange}\n fontSize=\"10px\"\n dropPosition=\"up\"\n arrowIcon=\"down\"\n class=\"language-selector-input\"\n />\n </div>\n </div>\n );\n }\n}\n"],"names":["sessionState"],"mappings":"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"}
@@ -4,7 +4,7 @@ import { L as LOCALES_ENUM } from './locales.enum-BzDRvtfU.js';
4
4
  import { B as BREAKPOINT_ENUM, g as getBreakpoint, i as isBreakpointBelow } from './breakpoint-Do_vNuMa.js';
5
5
  import { C as COLORS_ENUM } from './color-class-mapper-DA598vBj.js';
6
6
 
7
- const rebillFooterCss = ".language-selector{display:flex;align-items:center;margin-right:12px;height:24px}.footer-content{display:flex;justify-content:space-between;align-items:center;width:100%;margin-bottom:18px}.terms-and-conditions{display:flex;align-items:center;gap:4px;margin-left:12px}.footer-powered{margin-right:4px}.footer-separator{margin-right:6px;margin-left:6px}.footer-link,.footer-powered,.footer-separator{display:flex;align-items:center}.footer-link a{font-size:inherit;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;text-decoration:none}";
7
+ const rebillFooterCss = ".language-selector{display:flex;align-items:center;margin-right:12px;height:24px}.rebill-footer__footer-content{display:flex;justify-content:space-between;align-items:center;width:100%;margin-bottom:18px}.terms-and-conditions{display:flex;align-items:center;gap:4px;margin-left:12px}.footer-powered{margin-right:4px}.footer-separator{margin-right:6px;margin-left:6px}.footer-link,.footer-powered,.footer-separator{display:flex;align-items:center}.footer-link a{font-size:inherit;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;text-decoration:none}";
8
8
 
9
9
  const RebillFooter = class {
10
10
  constructor(hostRef) {
@@ -28,7 +28,7 @@ const RebillFooter = class {
28
28
  SessionStore.changeLanguage(event.detail.value);
29
29
  };
30
30
  render() {
31
- return (h("div", { key: 'b6e99239502e226ecdb919065aa658d37a62be7e', class: "footer-content" }, h("div", { key: '6a051ae87161c1bc4cea5e0ebe4497fbde322b3e', class: "terms-and-conditions" }, !isBreakpointBelow(this.breakpoint, BREAKPOINT_ENUM.DESKTOP) && (h("rebill-typography", { key: '4fc0741105dccf91d80785795ec284eb4c0293f1', variant: "subtitle3", color: COLORS_ENUM.SECONDARY, class: "footer-powered" }, I18nService.translate('footer.poweredBy'))), h("rebill-icon", { key: '33cb05cae19e5d70634f53699bc865405c6a0af9', name: "rebill-logo", color: COLORS_ENUM.SECONDARY }), h("rebill-icon", { key: '33800db2659d702117ade1bdf8b419803e75f44d', name: "rebill", color: COLORS_ENUM.SECONDARY }), h("rebill-typography", { key: 'edee6dfff0b4708e20ee2f99b26657261af1cda6', variant: "subtitle3", color: COLORS_ENUM.SECONDARY, class: "footer-separator" }, "|"), h("rebill-typography", { key: '79c88fe89f003fd8d1ef099ce6dcce4b96c906f3', variant: "subtitle3", color: COLORS_ENUM.SECONDARY, class: "footer-link" }, h("a", { key: '8642aa0cf493b2b18e60f3137a373e28b6da7f4b', href: "https://www.rebill.com/terminos-y-condiciones-usuarios-finales", target: "_blank" }, I18nService.translate('footer.termsAndConditions')))), h("div", { key: '0133fe5bdb10537a1d6ae2b7c774310f3da9b31d', class: "language-selector" }, h("rebill-icon", { key: '2b3fa0f964176992fc644b496b3f5b4ed834b806', name: "world" }), h("rebill-input-select", { key: 'c724a635ed6e7b1af6ba7ea071613dfe00e2d246', id: "language-selector", variant: "underlined", backgroundColor: isBreakpointBelow(this.breakpoint, BREAKPOINT_ENUM.DESKTOP)
31
+ return (h("div", { key: '2f848185be3cc0420977d5d4ac0ad07534a06a41', class: "rebill-footer__footer-content" }, h("div", { key: '2162f4c3728a073ed39d112864598cb5c0223be2', class: "terms-and-conditions" }, !isBreakpointBelow(this.breakpoint, BREAKPOINT_ENUM.DESKTOP) && (h("rebill-typography", { key: '07ba952b0de49dde3220f80c9e8406c50e36ef55', variant: "subtitle3", color: COLORS_ENUM.SECONDARY, class: "footer-powered" }, I18nService.translate('footer.poweredBy'))), h("rebill-icon", { key: '2c7dbdf01869cdce2ffcebb58383b87d418e75e3', name: "rebill-logo", color: COLORS_ENUM.SECONDARY }), h("rebill-icon", { key: 'bf44f24d92209550a380cf0bb9e4598cbad53b29', name: "rebill", color: COLORS_ENUM.SECONDARY }), h("rebill-typography", { key: '4d91e0c2a32a7e8d7a78c20a172a1f5f0ca90d37', variant: "subtitle3", color: COLORS_ENUM.SECONDARY, class: "footer-separator" }, "|"), h("rebill-typography", { key: 'e38d140112eddf6990d7de70a37245aa7f354e60', variant: "subtitle3", color: COLORS_ENUM.SECONDARY, class: "footer-link" }, h("a", { key: 'd2d31c2b577b80c27367491672187a4671c3d910', href: "https://www.rebill.com/terminos-y-condiciones-usuarios-finales", target: "_blank" }, I18nService.translate('footer.termsAndConditions')))), h("div", { key: 'e923b58c1442243d5d1469cbc895c92735df3446', class: "language-selector" }, h("rebill-icon", { key: 'bd9acbf6519dfdbbaf9f179b0375411d394afa4e', name: "world" }), h("rebill-input-select", { key: 'c3dcfb2bab369f6586ddba960fa6426ac55c0919', id: "language-selector", variant: "underlined", backgroundColor: isBreakpointBelow(this.breakpoint, BREAKPOINT_ENUM.DESKTOP)
32
32
  ? ''
33
33
  : 'var(--rebill-color-background-left)', options: [
34
34
  { label: 'EN', value: LOCALES_ENUM.EN },