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

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 (115) 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.cjs.entry.js +5 -5
  5. package/dist/cjs/otp-component.cjs.entry.js.map +1 -1
  6. package/dist/cjs/otp-component.entry.cjs.js.map +1 -1
  7. 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
  8. package/dist/cjs/otp-component_7.cjs.entry.js +17 -17
  9. package/dist/cjs/otp-component_7.cjs.entry.js.map +1 -1
  10. package/dist/cjs/rebill-footer.cjs.entry.js +2 -2
  11. package/dist/cjs/rebill-footer.cjs.entry.js.map +1 -1
  12. package/dist/cjs/rebill-footer.entry.cjs.js.map +1 -1
  13. package/dist/cjs/rebill-mode-sandbox-mobile.cjs.entry.js +4 -4
  14. package/dist/cjs/rebill-mode-sandbox-mobile.cjs.entry.js.map +1 -1
  15. package/dist/cjs/rebill-mode-sandbox-mobile.entry.cjs.js.map +1 -1
  16. package/dist/cjs/renewal-success-page.cjs.entry.js +1 -1
  17. package/dist/cjs/renewal-success-page.cjs.entry.js.map +1 -1
  18. package/dist/cjs/renewal-success-page.entry.cjs.js.map +1 -1
  19. package/dist/cjs/renewal-success-page.renewal-summary.entry.cjs.js.map +1 -1
  20. package/dist/cjs/renewal-success-page_2.cjs.entry.js +1 -1
  21. package/dist/cjs/renewal-success-page_2.cjs.entry.js.map +1 -1
  22. package/dist/cjs/success-page.cjs.entry.js +8 -8
  23. package/dist/cjs/success-page.cjs.entry.js.map +1 -1
  24. package/dist/cjs/success-page.entry.cjs.js.map +1 -1
  25. package/dist/collection/components/checkout/card-success-page/success-page.css +7 -7
  26. package/dist/collection/components/checkout/card-success-page/success-page.js +7 -7
  27. package/dist/collection/components/checkout/card-success-page/success-page.js.map +1 -1
  28. package/dist/collection/components/checkout/otp/otp.css +16 -16
  29. package/dist/collection/components/checkout/otp/otp.js +4 -4
  30. package/dist/collection/components/checkout/otp/otp.js.map +1 -1
  31. package/dist/collection/components/checkout/rebill-footer/rebill-footer.css +1 -1
  32. package/dist/collection/components/checkout/rebill-footer/rebill-footer.js +1 -1
  33. package/dist/collection/components/checkout/rebill-footer/rebill-footer.js.map +1 -1
  34. package/dist/collection/components/renewal/renewal-success-page/renewal-success-page.css +7 -7
  35. package/dist/collection/components/shared/mode-sandbox/mode-sandbox-mobile.css +21 -16
  36. package/dist/collection/components/shared/mode-sandbox/mode-sandbox-mobile.js +3 -3
  37. package/dist/collection/components/shared/mode-sandbox/mode-sandbox-mobile.js.map +1 -1
  38. package/dist/components/mode-sandbox-mobile.js +4 -4
  39. package/dist/components/mode-sandbox-mobile.js.map +1 -1
  40. package/dist/components/otp.js +5 -5
  41. package/dist/components/otp.js.map +1 -1
  42. package/dist/components/{p-D8vRh8vG.js → p-BMR1f9Ny.js} +5 -5
  43. package/dist/components/{p-D8vRh8vG.js.map → p-BMR1f9Ny.js.map} +1 -1
  44. package/dist/components/{p-qOI5SAjq.js → p-BshrHj7X.js} +3 -3
  45. package/dist/components/{p-qOI5SAjq.js.map → p-BshrHj7X.js.map} +1 -1
  46. package/dist/components/{p-C-BFyHag.js → p-D3tnZHAe.js} +7 -7
  47. package/dist/components/p-D3tnZHAe.js.map +1 -0
  48. package/dist/components/{p-BEbMMBef.js → p-D6JNNodL.js} +4 -4
  49. package/dist/components/p-D6JNNodL.js.map +1 -0
  50. package/dist/components/{p-DQYI7toy.js → p-De6XbCCz.js} +12 -12
  51. package/dist/components/p-De6XbCCz.js.map +1 -0
  52. package/dist/components/p-Dp3ocPYP.js +85 -0
  53. package/dist/components/p-Dp3ocPYP.js.map +1 -0
  54. package/dist/components/{p-DgvctlA0.js → p-F4jLIfkG.js} +4 -4
  55. package/dist/components/{p-DgvctlA0.js.map → p-F4jLIfkG.js.map} +1 -1
  56. package/dist/components/rebill-footer2.js +2 -2
  57. package/dist/components/rebill-footer2.js.map +1 -1
  58. package/dist/components/renewal-success-page2.js +1 -1
  59. package/dist/components/renewal-success-page2.js.map +1 -1
  60. package/dist/components/success-page2.js +8 -8
  61. package/dist/components/success-page2.js.map +1 -1
  62. package/dist/esm/organization-logo.rebill-card-icon.rebill-checkout-single-column.rebill-footer.entry.js.map +1 -1
  63. package/dist/esm/organization-logo_4.entry.js +2 -2
  64. package/dist/esm/organization-logo_4.entry.js.map +1 -1
  65. package/dist/esm/otp-component.entry.js +5 -5
  66. package/dist/esm/otp-component.entry.js.map +1 -1
  67. 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
  68. package/dist/esm/otp-component_7.entry.js +17 -17
  69. package/dist/esm/otp-component_7.entry.js.map +1 -1
  70. package/dist/esm/rebill-footer.entry.js +2 -2
  71. package/dist/esm/rebill-footer.entry.js.map +1 -1
  72. package/dist/esm/rebill-mode-sandbox-mobile.entry.js +4 -4
  73. package/dist/esm/rebill-mode-sandbox-mobile.entry.js.map +1 -1
  74. package/dist/esm/renewal-success-page.entry.js +1 -1
  75. package/dist/esm/renewal-success-page.entry.js.map +1 -1
  76. package/dist/esm/renewal-success-page.renewal-summary.entry.js.map +1 -1
  77. package/dist/esm/renewal-success-page_2.entry.js +1 -1
  78. package/dist/esm/renewal-success-page_2.entry.js.map +1 -1
  79. package/dist/esm/success-page.entry.js +8 -8
  80. package/dist/esm/success-page.entry.js.map +1 -1
  81. package/dist/rebill-web-components-sdk/organization-logo.rebill-card-icon.rebill-checkout-single-column.rebill-footer.entry.esm.js.map +1 -1
  82. package/dist/rebill-web-components-sdk/otp-component.entry.esm.js.map +1 -1
  83. package/dist/rebill-web-components-sdk/otp-component.entry.js +5 -5
  84. package/dist/rebill-web-components-sdk/otp-component.entry.js.map +1 -1
  85. 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
  86. package/dist/rebill-web-components-sdk/p-3fca32f8.entry.js +2 -0
  87. package/dist/rebill-web-components-sdk/p-3fca32f8.entry.js.map +1 -0
  88. package/dist/rebill-web-components-sdk/p-8f949cf1.entry.js +2 -0
  89. package/dist/rebill-web-components-sdk/p-8f949cf1.entry.js.map +1 -0
  90. package/dist/rebill-web-components-sdk/p-d189dea8.entry.js +2 -0
  91. package/dist/rebill-web-components-sdk/{p-123616d2.entry.js.map → p-d189dea8.entry.js.map} +1 -1
  92. package/dist/rebill-web-components-sdk/rebill-footer.entry.esm.js.map +1 -1
  93. package/dist/rebill-web-components-sdk/rebill-footer.entry.js +2 -2
  94. package/dist/rebill-web-components-sdk/rebill-footer.entry.js.map +1 -1
  95. package/dist/rebill-web-components-sdk/rebill-mode-sandbox-mobile.entry.esm.js.map +1 -1
  96. package/dist/rebill-web-components-sdk/rebill-mode-sandbox-mobile.entry.js +4 -4
  97. package/dist/rebill-web-components-sdk/rebill-mode-sandbox-mobile.entry.js.map +1 -1
  98. package/dist/rebill-web-components-sdk/renewal-success-page.entry.esm.js.map +1 -1
  99. package/dist/rebill-web-components-sdk/renewal-success-page.entry.js +1 -1
  100. package/dist/rebill-web-components-sdk/renewal-success-page.entry.js.map +1 -1
  101. package/dist/rebill-web-components-sdk/renewal-success-page.renewal-summary.entry.esm.js.map +1 -1
  102. package/dist/rebill-web-components-sdk/success-page.entry.esm.js.map +1 -1
  103. package/dist/rebill-web-components-sdk/success-page.entry.js +8 -8
  104. package/dist/rebill-web-components-sdk/success-page.entry.js.map +1 -1
  105. package/package.json +1 -1
  106. package/dist/components/p-BEbMMBef.js.map +0 -1
  107. package/dist/components/p-Bl3lkRJY.js +0 -85
  108. package/dist/components/p-Bl3lkRJY.js.map +0 -1
  109. package/dist/components/p-C-BFyHag.js.map +0 -1
  110. package/dist/components/p-DQYI7toy.js.map +0 -1
  111. package/dist/rebill-web-components-sdk/p-123616d2.entry.js +0 -2
  112. package/dist/rebill-web-components-sdk/p-9dc5e835.entry.js +0 -2
  113. package/dist/rebill-web-components-sdk/p-9dc5e835.entry.js.map +0 -1
  114. package/dist/rebill-web-components-sdk/p-d6225f5e.entry.js +0 -2
  115. package/dist/rebill-web-components-sdk/p-d6225f5e.entry.js.map +0 -1
@@ -1 +1 @@
1
- {"version":3,"file":"organization-logo.rebill-card-icon.rebill-checkout-single-column.rebill-footer.entry.cjs.js","sources":["src/components/shared/layouts/custom/single-column/checkout-single-column.css?tag=rebill-checkout-single-column","src/components/shared/layouts/custom/single-column/checkout-single-column.tsx","src/components/checkout/rebill-footer/rebill-footer.css?tag=rebill-footer","src/components/checkout/rebill-footer/rebill-footer.tsx"],"sourcesContent":[".checkout-single-column {\n min-height: 100vh;\n background: var(--rebill-color-background);\n display: flex;\n flex-direction: column;\n position: relative;\n overflow-x: hidden;\n min-width: 320px;\n}\n\n.header {\n display: flex;\n justify-content: flex-start;\n align-items: center;\n height: 72px;\n width: 100%;\n max-width: 1448px;\n min-width: 348px;\n background: var(--rebill-color-background);\n margin-left: 30px;\n box-sizing: border-box;\n}\n\n.main-content {\n flex: 1;\n display: flex;\n justify-content: center;\n align-items: center;\n min-height: 0;\n width: 100%;\n box-sizing: border-box;\n /* padding: 0 20px; */\n max-width: 450px;\n\n margin: 0 auto;\n gap: 2rem;\n}\n\n.footer-container {\n margin-top: auto;\n height: 60px;\n display: flex;\n align-items: center;\n justify-content: flex-start;\n width: 100%;\n box-sizing: border-box;\n}\n\n.footer-content {\n width: 100%;\n max-width: 450px;\n min-width: auto;\n flex-shrink: 1;\n flex-basis: auto;\n box-sizing: border-box;\n}\n\n@media (max-width: 1024px) {\n .header {\n width: 100%;\n max-width: 100%;\n\n justify-content: flex-start;\n }\n\n .main-content {\n /* padding: 0 20px; */\n gap: 0;\n align-items: center;\n justify-content: center;\n padding-top: 2rem;\n flex: 1;\n min-height: 0;\n width: 100%;\n }\n\n .footer-container {\n width: 100%;\n height: auto;\n min-height: 60px;\n justify-content: center;\n }\n\n .footer-content {\n width: 100%;\n min-width: auto;\n max-width: 100%;\n flex-basis: auto;\n }\n}\n\n@media (max-width: 767px) {\n .header {\n height: 60px;\n margin-left: 12px;\n margin-right: 12px;\n width: 100%;\n }\n\n .main-content {\n padding-top: 1rem;\n align-items: center;\n justify-content: center;\n flex: 1;\n width: 100%;\n }\n\n .footer-container {\n margin-left: 12px;\n margin-right: 12px;\n height: auto;\n min-height: 60px;\n width: 100%;\n justify-content: center;\n }\n}\n\n@media (min-width: 1025px) {\n .checkout-single-column {\n background: var(--rebill-color-background-left);\n }\n .footer-container {\n margin-left: 16px;\n }\n\n .header {\n background: var(--rebill-color-background-left);\n }\n}\n","import { Component, h } from '@stencil/core';\nimport { sessionState } from '../../../../../store/session.store';\n\n@Component({\n tag: 'rebill-checkout-single-column',\n styleUrl: 'checkout-single-column.css',\n shadow: false,\n})\nexport class LayoutCheckoutSingleColumn {\n render() {\n return (\n <div class=\"checkout-single-column\">\n <header class=\"header\">\n <div class=\"header-container\">\n <organization-logo organization={sessionState.data.organization} />\n </div>\n </header>\n <main class=\"main-content\">\n <slot />\n </main>\n <div class=\"footer-container\">\n <rebill-footer class=\"footer-content\" />\n </div>\n </div>\n );\n }\n}\n",".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":["h","sessionState","BREAKPOINT_ENUM","getBreakpoint","I18nService","SessionStore","isBreakpointBelow","COLORS_ENUM","LOCALES_ENUM"],"mappings":"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"}
1
+ {"version":3,"file":"organization-logo.rebill-card-icon.rebill-checkout-single-column.rebill-footer.entry.cjs.js","sources":["src/components/shared/layouts/custom/single-column/checkout-single-column.css?tag=rebill-checkout-single-column","src/components/shared/layouts/custom/single-column/checkout-single-column.tsx","src/components/checkout/rebill-footer/rebill-footer.css?tag=rebill-footer","src/components/checkout/rebill-footer/rebill-footer.tsx"],"sourcesContent":[".checkout-single-column {\n min-height: 100vh;\n background: var(--rebill-color-background);\n display: flex;\n flex-direction: column;\n position: relative;\n overflow-x: hidden;\n min-width: 320px;\n}\n\n.header {\n display: flex;\n justify-content: flex-start;\n align-items: center;\n height: 72px;\n width: 100%;\n max-width: 1448px;\n min-width: 348px;\n background: var(--rebill-color-background);\n margin-left: 30px;\n box-sizing: border-box;\n}\n\n.main-content {\n flex: 1;\n display: flex;\n justify-content: center;\n align-items: center;\n min-height: 0;\n width: 100%;\n box-sizing: border-box;\n /* padding: 0 20px; */\n max-width: 450px;\n\n margin: 0 auto;\n gap: 2rem;\n}\n\n.footer-container {\n margin-top: auto;\n height: 60px;\n display: flex;\n align-items: center;\n justify-content: flex-start;\n width: 100%;\n box-sizing: border-box;\n}\n\n.footer-content {\n width: 100%;\n max-width: 450px;\n min-width: auto;\n flex-shrink: 1;\n flex-basis: auto;\n box-sizing: border-box;\n}\n\n@media (max-width: 1024px) {\n .header {\n width: 100%;\n max-width: 100%;\n\n justify-content: flex-start;\n }\n\n .main-content {\n /* padding: 0 20px; */\n gap: 0;\n align-items: center;\n justify-content: center;\n padding-top: 2rem;\n flex: 1;\n min-height: 0;\n width: 100%;\n }\n\n .footer-container {\n width: 100%;\n height: auto;\n min-height: 60px;\n justify-content: center;\n }\n\n .footer-content {\n width: 100%;\n min-width: auto;\n max-width: 100%;\n flex-basis: auto;\n }\n}\n\n@media (max-width: 767px) {\n .header {\n height: 60px;\n margin-left: 12px;\n margin-right: 12px;\n width: 100%;\n }\n\n .main-content {\n padding-top: 1rem;\n align-items: center;\n justify-content: center;\n flex: 1;\n width: 100%;\n }\n\n .footer-container {\n margin-left: 12px;\n margin-right: 12px;\n height: auto;\n min-height: 60px;\n width: 100%;\n justify-content: center;\n }\n}\n\n@media (min-width: 1025px) {\n .checkout-single-column {\n background: var(--rebill-color-background-left);\n }\n .footer-container {\n margin-left: 16px;\n }\n\n .header {\n background: var(--rebill-color-background-left);\n }\n}\n","import { Component, h } from '@stencil/core';\nimport { sessionState } from '../../../../../store/session.store';\n\n@Component({\n tag: 'rebill-checkout-single-column',\n styleUrl: 'checkout-single-column.css',\n shadow: false,\n})\nexport class LayoutCheckoutSingleColumn {\n render() {\n return (\n <div class=\"checkout-single-column\">\n <header class=\"header\">\n <div class=\"header-container\">\n <organization-logo organization={sessionState.data.organization} />\n </div>\n </header>\n <main class=\"main-content\">\n <slot />\n </main>\n <div class=\"footer-container\">\n <rebill-footer class=\"footer-content\" />\n </div>\n </div>\n );\n }\n}\n",".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":["h","sessionState","BREAKPOINT_ENUM","getBreakpoint","I18nService","SessionStore","isBreakpointBelow","COLORS_ENUM","LOCALES_ENUM"],"mappings":"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"}
@@ -20,7 +20,7 @@ const LayoutCheckoutSingleColumn = class {
20
20
  };
21
21
  LayoutCheckoutSingleColumn.style = checkoutSingleColumnCss;
22
22
 
23
- 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}";
23
+ 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}";
24
24
 
25
25
  const RebillFooter = class {
26
26
  constructor(hostRef) {
@@ -44,7 +44,7 @@ const RebillFooter = class {
44
44
  i18n_service.SessionStore.changeLanguage(event.detail.value);
45
45
  };
46
46
  render() {
47
- return (index.h("div", { key: 'b6e99239502e226ecdb919065aa658d37a62be7e', class: "footer-content" }, index.h("div", { key: '6a051ae87161c1bc4cea5e0ebe4497fbde322b3e', class: "terms-and-conditions" }, !breakpoint.isBreakpointBelow(this.breakpoint, breakpoint.BREAKPOINT_ENUM.DESKTOP) && (index.h("rebill-typography", { key: '4fc0741105dccf91d80785795ec284eb4c0293f1', variant: "subtitle3", color: colorClassMapper.COLORS_ENUM.SECONDARY, class: "footer-powered" }, i18n_service.I18nService.translate('footer.poweredBy'))), index.h("rebill-icon", { key: '33cb05cae19e5d70634f53699bc865405c6a0af9', name: "rebill-logo", color: colorClassMapper.COLORS_ENUM.SECONDARY }), index.h("rebill-icon", { key: '33800db2659d702117ade1bdf8b419803e75f44d', name: "rebill", color: colorClassMapper.COLORS_ENUM.SECONDARY }), index.h("rebill-typography", { key: 'edee6dfff0b4708e20ee2f99b26657261af1cda6', variant: "subtitle3", color: colorClassMapper.COLORS_ENUM.SECONDARY, class: "footer-separator" }, "|"), index.h("rebill-typography", { key: '79c88fe89f003fd8d1ef099ce6dcce4b96c906f3', variant: "subtitle3", color: colorClassMapper.COLORS_ENUM.SECONDARY, class: "footer-link" }, index.h("a", { key: '8642aa0cf493b2b18e60f3137a373e28b6da7f4b', href: "https://www.rebill.com/terminos-y-condiciones-usuarios-finales", target: "_blank" }, i18n_service.I18nService.translate('footer.termsAndConditions')))), index.h("div", { key: '0133fe5bdb10537a1d6ae2b7c774310f3da9b31d', class: "language-selector" }, index.h("rebill-icon", { key: '2b3fa0f964176992fc644b496b3f5b4ed834b806', name: "world" }), index.h("rebill-input-select", { key: 'c724a635ed6e7b1af6ba7ea071613dfe00e2d246', id: "language-selector", variant: "underlined", backgroundColor: breakpoint.isBreakpointBelow(this.breakpoint, breakpoint.BREAKPOINT_ENUM.DESKTOP)
47
+ return (index.h("div", { key: '2f848185be3cc0420977d5d4ac0ad07534a06a41', class: "rebill-footer__footer-content" }, index.h("div", { key: '2162f4c3728a073ed39d112864598cb5c0223be2', class: "terms-and-conditions" }, !breakpoint.isBreakpointBelow(this.breakpoint, breakpoint.BREAKPOINT_ENUM.DESKTOP) && (index.h("rebill-typography", { key: '07ba952b0de49dde3220f80c9e8406c50e36ef55', variant: "subtitle3", color: colorClassMapper.COLORS_ENUM.SECONDARY, class: "footer-powered" }, i18n_service.I18nService.translate('footer.poweredBy'))), index.h("rebill-icon", { key: '2c7dbdf01869cdce2ffcebb58383b87d418e75e3', name: "rebill-logo", color: colorClassMapper.COLORS_ENUM.SECONDARY }), index.h("rebill-icon", { key: 'bf44f24d92209550a380cf0bb9e4598cbad53b29', name: "rebill", color: colorClassMapper.COLORS_ENUM.SECONDARY }), index.h("rebill-typography", { key: '4d91e0c2a32a7e8d7a78c20a172a1f5f0ca90d37', variant: "subtitle3", color: colorClassMapper.COLORS_ENUM.SECONDARY, class: "footer-separator" }, "|"), index.h("rebill-typography", { key: 'e38d140112eddf6990d7de70a37245aa7f354e60', variant: "subtitle3", color: colorClassMapper.COLORS_ENUM.SECONDARY, class: "footer-link" }, index.h("a", { key: 'd2d31c2b577b80c27367491672187a4671c3d910', href: "https://www.rebill.com/terminos-y-condiciones-usuarios-finales", target: "_blank" }, i18n_service.I18nService.translate('footer.termsAndConditions')))), index.h("div", { key: 'e923b58c1442243d5d1469cbc895c92735df3446', class: "language-selector" }, index.h("rebill-icon", { key: 'bd9acbf6519dfdbbaf9f179b0375411d394afa4e', name: "world" }), index.h("rebill-input-select", { key: 'c3dcfb2bab369f6586ddba960fa6426ac55c0919', id: "language-selector", variant: "underlined", backgroundColor: breakpoint.isBreakpointBelow(this.breakpoint, breakpoint.BREAKPOINT_ENUM.DESKTOP)
48
48
  ? ''
49
49
  : 'var(--rebill-color-background-left)', options: [
50
50
  { label: 'EN', value: locales_enum.LOCALES_ENUM.EN },
@@ -1 +1 @@
1
- {"file":"organization-logo.rebill-card-icon.rebill-checkout-single-column.rebill-footer.entry.cjs.js","mappings":"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","names":["h","sessionState","BREAKPOINT_ENUM","getBreakpoint","I18nService","SessionStore","isBreakpointBelow","COLORS_ENUM","LOCALES_ENUM"],"sources":["src/components/shared/layouts/custom/single-column/checkout-single-column.css?tag=rebill-checkout-single-column","src/components/shared/layouts/custom/single-column/checkout-single-column.tsx","src/components/checkout/rebill-footer/rebill-footer.css?tag=rebill-footer","src/components/checkout/rebill-footer/rebill-footer.tsx"],"sourcesContent":[".checkout-single-column {\n min-height: 100vh;\n background: var(--rebill-color-background);\n display: flex;\n flex-direction: column;\n position: relative;\n overflow-x: hidden;\n min-width: 320px;\n}\n\n.header {\n display: flex;\n justify-content: flex-start;\n align-items: center;\n height: 72px;\n width: 100%;\n max-width: 1448px;\n min-width: 348px;\n background: var(--rebill-color-background);\n margin-left: 30px;\n box-sizing: border-box;\n}\n\n.main-content {\n flex: 1;\n display: flex;\n justify-content: center;\n align-items: center;\n min-height: 0;\n width: 100%;\n box-sizing: border-box;\n /* padding: 0 20px; */\n max-width: 450px;\n\n margin: 0 auto;\n gap: 2rem;\n}\n\n.footer-container {\n margin-top: auto;\n height: 60px;\n display: flex;\n align-items: center;\n justify-content: flex-start;\n width: 100%;\n box-sizing: border-box;\n}\n\n.footer-content {\n width: 100%;\n max-width: 450px;\n min-width: auto;\n flex-shrink: 1;\n flex-basis: auto;\n box-sizing: border-box;\n}\n\n@media (max-width: 1024px) {\n .header {\n width: 100%;\n max-width: 100%;\n\n justify-content: flex-start;\n }\n\n .main-content {\n /* padding: 0 20px; */\n gap: 0;\n align-items: center;\n justify-content: center;\n padding-top: 2rem;\n flex: 1;\n min-height: 0;\n width: 100%;\n }\n\n .footer-container {\n width: 100%;\n height: auto;\n min-height: 60px;\n justify-content: center;\n }\n\n .footer-content {\n width: 100%;\n min-width: auto;\n max-width: 100%;\n flex-basis: auto;\n }\n}\n\n@media (max-width: 767px) {\n .header {\n height: 60px;\n margin-left: 12px;\n margin-right: 12px;\n width: 100%;\n }\n\n .main-content {\n padding-top: 1rem;\n align-items: center;\n justify-content: center;\n flex: 1;\n width: 100%;\n }\n\n .footer-container {\n margin-left: 12px;\n margin-right: 12px;\n height: auto;\n min-height: 60px;\n width: 100%;\n justify-content: center;\n }\n}\n\n@media (min-width: 1025px) {\n .checkout-single-column {\n background: var(--rebill-color-background-left);\n }\n .footer-container {\n margin-left: 16px;\n }\n\n .header {\n background: var(--rebill-color-background-left);\n }\n}\n","import { Component, h } from '@stencil/core';\nimport { sessionState } from '../../../../../store/session.store';\n\n@Component({\n tag: 'rebill-checkout-single-column',\n styleUrl: 'checkout-single-column.css',\n shadow: false,\n})\nexport class LayoutCheckoutSingleColumn {\n render() {\n return (\n <div class=\"checkout-single-column\">\n <header class=\"header\">\n <div class=\"header-container\">\n <organization-logo organization={sessionState.data.organization} />\n </div>\n </header>\n <main class=\"main-content\">\n <slot />\n </main>\n <div class=\"footer-container\">\n <rebill-footer class=\"footer-content\" />\n </div>\n </div>\n );\n }\n}\n",".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"],"version":3}
1
+ {"file":"organization-logo.rebill-card-icon.rebill-checkout-single-column.rebill-footer.entry.cjs.js","mappings":";;;;;;;;;;AAAA,MAAM,uBAAuB,GAAG,ylDAAylD;;MCQ5mD,0BAA0B,GAAA,MAAA;;;;IACrC,MAAM,GAAA;QACJ,QACEA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,wBAAwB,EAAA,EACjCA,OAAQ,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,QAAQ,EAAA,EACpBA,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,kBAAkB,EAAA,EAC3BA,OAAmB,CAAA,mBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,YAAY,EAAEC,kBAAY,CAAC,IAAI,CAAC,YAAY,EAAI,CAAA,CAC/D,CACC,EACTD,OAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,cAAc,EAAA,EACxBA,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAQ,CACH,EACPA,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,kBAAkB,EAAA,EAC3BA,OAAA,CAAA,eAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAe,KAAK,EAAC,gBAAgB,GAAG,CACpC,CACF;;;;;ACvBZ,MAAM,eAAe,GAAG,mkBAAmkB;;MCY9kB,YAAY,GAAA,MAAA;;;;AACd,IAAA,UAAU,GAAoBE,0BAAe,CAAC,OAAO;IAE9D,aAAa,GAAG,MAAK;QACnB,IAAI,CAAC,UAAU,GAAGC,wBAAa,CAAC,MAAM,CAAC,UAAU,CAAC;AACpD,KAAC;IAED,oBAAoB,GAAA;QAClB,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,aAAa,CAAC;;AAG1D,IAAA,MAAM,iBAAiB,GAAA;QACrB,IAAI,CAAC,aAAa,EAAE;QACpB,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,aAAa,CAAC;AACrD,QAAA,MAAM,QAAQ,GAAGC,wBAAW,CAAC,kBAAkB,EAAE;AACjD,QAAAC,yBAAY,CAAC,cAAc,CAAC,QAAQ,CAAC;;AAE/B,IAAA,oBAAoB,GAAG,CAAC,KAAU,KAAI;QAC5CD,wBAAW,CAAC,cAAc,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;QAC9CC,yBAAY,CAAC,cAAc,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;AACjD,KAAC;IACD,MAAM,GAAA;AACJ,QAAA,QACEL,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,+BAA+B,EAAA,EACxCA,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,sBAAsB,EAAA,EAC9B,CAACM,4BAAiB,CAAC,IAAI,CAAC,UAAU,EAAEJ,0BAAe,CAAC,OAAO,CAAC,KAC3DF,OACE,CAAA,mBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,OAAO,EAAC,WAAW,EACnB,KAAK,EAAEO,4BAAW,CAAC,SAAS,EAC5B,KAAK,EAAC,gBAAgB,EAErB,EAAAH,wBAAW,CAAC,SAAS,CAAC,kBAAkB,CAAC,CACxB,CACrB,EACDJ,OAAa,CAAA,aAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,aAAa,EAAC,KAAK,EAAEO,4BAAW,CAAC,SAAS,EAAI,CAAA,EAChEP,OAAa,CAAA,aAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAEO,4BAAW,CAAC,SAAS,EAAI,CAAA,EAC3DP,OAAA,CAAA,mBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,OAAO,EAAC,WAAW,EACnB,KAAK,EAAEO,4BAAW,CAAC,SAAS,EAC5B,KAAK,EAAC,kBAAkB,EAGN,EAAA,GAAA,CAAA,EACpBP,OAAA,CAAA,mBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAmB,OAAO,EAAC,WAAW,EAAC,KAAK,EAAEO,4BAAW,CAAC,SAAS,EAAE,KAAK,EAAC,aAAa,EAAA,EACtFP,OAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,IAAI,EAAC,gEAAgE,EACrE,MAAM,EAAC,QAAQ,EAAA,EAEdI,wBAAW,CAAC,SAAS,CAAC,2BAA2B,CAAC,CACjD,CACc,CAChB,EACNJ,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,mBAAmB,EAAA,EAC5BA,OAAa,CAAA,aAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,OAAO,EAAG,CAAA,EAC5BA,OAAA,CAAA,qBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,EAAE,EAAC,mBAAmB,EACtB,OAAO,EAAC,YAAY,EACpB,eAAe,EACbM,4BAAiB,CAAC,IAAI,CAAC,UAAU,EAAEJ,0BAAe,CAAC,OAAO;AACxD,kBAAE;AACF,kBAAE,qCAAqC,EAE3C,OAAO,EAAE;gBACP,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAEM,yBAAY,CAAC,EAAE,EAAE;gBACvC,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAEA,yBAAY,CAAC,EAAE,EAAE;gBACvC,EAAE,KAAK,EAAE,IAAI,EAAE,KAAK,EAAEA,yBAAY,CAAC,EAAE,EAAE;AACxC,aAAA,EACD,KAAK,EAAEP,kBAAY,CAAC,aAAa,EAAA,UAAA,EACvB,IAAI,CAAC,oBAAoB,EACnC,QAAQ,EAAC,MAAM,EACf,YAAY,EAAC,IAAI,EACjB,SAAS,EAAC,MAAM,EAChB,KAAK,EAAC,yBAAyB,EAAA,CAC/B,CACE,CACF;;;;;;;;;;","names":["h","sessionState","BREAKPOINT_ENUM","getBreakpoint","I18nService","SessionStore","isBreakpointBelow","COLORS_ENUM","LOCALES_ENUM"],"sources":["src/components/shared/layouts/custom/single-column/checkout-single-column.css?tag=rebill-checkout-single-column","src/components/shared/layouts/custom/single-column/checkout-single-column.tsx","src/components/checkout/rebill-footer/rebill-footer.css?tag=rebill-footer","src/components/checkout/rebill-footer/rebill-footer.tsx"],"sourcesContent":[".checkout-single-column {\n min-height: 100vh;\n background: var(--rebill-color-background);\n display: flex;\n flex-direction: column;\n position: relative;\n overflow-x: hidden;\n min-width: 320px;\n}\n\n.header {\n display: flex;\n justify-content: flex-start;\n align-items: center;\n height: 72px;\n width: 100%;\n max-width: 1448px;\n min-width: 348px;\n background: var(--rebill-color-background);\n margin-left: 30px;\n box-sizing: border-box;\n}\n\n.main-content {\n flex: 1;\n display: flex;\n justify-content: center;\n align-items: center;\n min-height: 0;\n width: 100%;\n box-sizing: border-box;\n /* padding: 0 20px; */\n max-width: 450px;\n\n margin: 0 auto;\n gap: 2rem;\n}\n\n.footer-container {\n margin-top: auto;\n height: 60px;\n display: flex;\n align-items: center;\n justify-content: flex-start;\n width: 100%;\n box-sizing: border-box;\n}\n\n.footer-content {\n width: 100%;\n max-width: 450px;\n min-width: auto;\n flex-shrink: 1;\n flex-basis: auto;\n box-sizing: border-box;\n}\n\n@media (max-width: 1024px) {\n .header {\n width: 100%;\n max-width: 100%;\n\n justify-content: flex-start;\n }\n\n .main-content {\n /* padding: 0 20px; */\n gap: 0;\n align-items: center;\n justify-content: center;\n padding-top: 2rem;\n flex: 1;\n min-height: 0;\n width: 100%;\n }\n\n .footer-container {\n width: 100%;\n height: auto;\n min-height: 60px;\n justify-content: center;\n }\n\n .footer-content {\n width: 100%;\n min-width: auto;\n max-width: 100%;\n flex-basis: auto;\n }\n}\n\n@media (max-width: 767px) {\n .header {\n height: 60px;\n margin-left: 12px;\n margin-right: 12px;\n width: 100%;\n }\n\n .main-content {\n padding-top: 1rem;\n align-items: center;\n justify-content: center;\n flex: 1;\n width: 100%;\n }\n\n .footer-container {\n margin-left: 12px;\n margin-right: 12px;\n height: auto;\n min-height: 60px;\n width: 100%;\n justify-content: center;\n }\n}\n\n@media (min-width: 1025px) {\n .checkout-single-column {\n background: var(--rebill-color-background-left);\n }\n .footer-container {\n margin-left: 16px;\n }\n\n .header {\n background: var(--rebill-color-background-left);\n }\n}\n","import { Component, h } from '@stencil/core';\nimport { sessionState } from '../../../../../store/session.store';\n\n@Component({\n tag: 'rebill-checkout-single-column',\n styleUrl: 'checkout-single-column.css',\n shadow: false,\n})\nexport class LayoutCheckoutSingleColumn {\n render() {\n return (\n <div class=\"checkout-single-column\">\n <header class=\"header\">\n <div class=\"header-container\">\n <organization-logo organization={sessionState.data.organization} />\n </div>\n </header>\n <main class=\"main-content\">\n <slot />\n </main>\n <div class=\"footer-container\">\n <rebill-footer class=\"footer-content\" />\n </div>\n </div>\n );\n }\n}\n",".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"],"version":3}
@@ -9,7 +9,7 @@ require('./_commonjsHelpers-C4WPPtrG.js');
9
9
  require('./config-DXXQevZh.js');
10
10
  require('./cdn-DuxoLczM.js');
11
11
 
12
- const otpCss = ".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}}";
12
+ const otpCss = ".otp__otp-container{display:flex;flex-direction:column;align-items:center;gap:16px;width:100%;position:relative;margin-top:2rem}.otp__user-information{display:flex;align-items:center;justify-content:center;flex-direction:column;width:100%;gap:8px}.otp__otp-description-container{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:4px}.otp__change-email{cursor:pointer;text-decoration:underline;margin-left:0}.otp__change-email:hover{color:var(--rebill-primary-color);text-decoration:underline}.otp__alternative{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:16px;margin:32px;width:100%}.otp__rebill-alert{width:100%}.otp__guest-options{display:flex;flex-direction:column;width:100%;gap:8px;margin-top:auto}.otp__verifying-container{display:flex;align-items:center;justify-content:center;gap:16px;margin:8px 0}.otp__code-resent-container rebill-typography{display:flex;line-height:1}.otp__code-resent-container rebill-icon{flex-shrink:0;display:inline-flex;vertical-align:middle;margin-right:8px}.otp__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__otp-container{min-height:calc(100vh - 40px)}.otp__guest-options{margin-top:32px}}@media (min-width: 1025px){.otp__otp-container{justify-content:flex-start}.otp__guest-options{margin-top:auto;padding-bottom:2rem}}";
13
13
 
14
14
  const Otp = class {
15
15
  constructor(hostRef) {
@@ -107,17 +107,17 @@ const Otp = class {
107
107
  }
108
108
  };
109
109
  render() {
110
- return (index.h("div", { key: '68417e64c3df38a704f23e648b2332fe6a724b89', class: "otp-container" }, index.h("div", { key: '3789fcd10500d02a04125dca8fe402066deb6187', class: "user-information" }, index.h("div", { key: '837ace14791f0743ce5ba353f6d4fcfa8e028303', class: "otp-description-container" }, index.h("rebill-typography", { key: '2de626534b8a1224c65221d85f3267ad8c9c94b6', variant: "body2", class: "otp-description" }, i18n_service.I18nService.translate('otp.description')), index.h("rebill-typography", { key: '15db9a65007e3f082b52ae7e05c6ba38095bc712', variant: "subtitle-bold", class: "otp-description-digits" }, ' ', index.h("strong", { key: '4e91d38f6eb4111067491a8037fd2d940b9c8e00' }, i18n_service.I18nService.translate('otp.descriptionDigits')), ' '), index.h("rebill-typography", { key: 'e3fc02e8a44fe8f4eb3c8249e4324646804a8c32', variant: "body2", class: "otp-description-email" }, i18n_service.I18nService.translate('otp.descriptionEmail'))), index.h("rebill-typography", { key: '45e8be5727b9079d7293fb4e06bf5c2ce6fc76af', variant: "body2", class: "otp-email-line" }, i18n_service.state.data.userInformation.email, ' ', !i18n_service.state.data.prefilledData?.email && (index.h("span", { key: '3da79d5f2cd3d3e805897f0cff12ceeaafa5a7a1', class: "change-email", onClick: () => {
110
+ return (index.h("div", { key: '342b5631b2dfe15cc24880cf7d6d77b6c10ab12d', class: "otp__otp-container" }, index.h("div", { key: 'c6bf7502fa3f9c1940d1d07360a47c17cc2fdeb2', class: "otp__user-information" }, index.h("div", { key: '078a4cb4dd563ff1ddfbc02f70e8c923f6973d0f', class: "otp__otp-description-container" }, index.h("rebill-typography", { key: 'd8ae4e71ee4e35b033347c6bc99200e48e5b9705', variant: "body2", class: "otp__otp-description" }, i18n_service.I18nService.translate('otp.description')), index.h("rebill-typography", { key: '2466a357c835bcd8314aa5f53aefabb474fdf55f', variant: "subtitle-bold", class: "otp__otp-description-digits" }, ' ', index.h("strong", { key: '3a4263b93f5ad7f9aec482f1d1eef76952cf60d3' }, i18n_service.I18nService.translate('otp.descriptionDigits')), ' '), index.h("rebill-typography", { key: 'd77b23e3581d353e2fdd73debe4fbc0e987376c4', variant: "body2", class: "otp__otp-description-email" }, i18n_service.I18nService.translate('otp.descriptionEmail'))), index.h("rebill-typography", { key: '723a510062706eed71186cf6b1a252f58554a4fc', variant: "body2", class: "otp__otp-email-line" }, i18n_service.state.data.userInformation.email, ' ', !i18n_service.state.data.prefilledData?.email && (index.h("span", { key: '46fb8563cb20d2ae7a6d8bc8d369d8a985ff85f3', class: "otp__change-email", onClick: () => {
111
111
  this.otpValue = '';
112
112
  this.error = false;
113
113
  this.returnForm.emit(false);
114
- } }, i18n_service.I18nService.translate('otp.change'))))), index.h("input-otp", { key: '1670a83a1b473e58df2be1c6fc6a2ae2b721cec5', otp: this.otpValue, onOtpChange: event => this.handleOtpChange(event.detail), error: this.error ? i18n_service.I18nService.translate('otp.error') : '' }), this.isVerifying && (index.h("div", { key: 'de01ef16d0ca132542e1b932d14fb8dc5fb9d9fc', class: "verifying-container" }, index.h("rebill-typography", { key: '610c943e609849df748eb21f8f272cd4f4424c2c', variant: "subtitle2", color: colorClassMapper.COLORS_ENUM.PRIMARY }, i18n_service.I18nService.translate('otp.verifyingCode')), index.h("div", { key: 'e9c40ba2cc65ae7bfc5ee40fed6876270075c64a', class: "spinner" }))), index.h("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
114
+ } }, i18n_service.I18nService.translate('otp.change'))))), index.h("input-otp", { key: '8ed8dc00b9131753f6f23178e607049e6bc4ea72', otp: this.otpValue, onOtpChange: event => this.handleOtpChange(event.detail), error: this.error ? i18n_service.I18nService.translate('otp.error') : '' }), this.isVerifying && (index.h("div", { key: '364e208afc986a3272bf24b282c169fb243b86db', class: "otp__verifying-container" }, index.h("rebill-typography", { key: '02cec9d49145d0f953b84d9ee0fbf015f5004d8d', variant: "subtitle2", color: colorClassMapper.COLORS_ENUM.PRIMARY }, i18n_service.I18nService.translate('otp.verifyingCode')), index.h("div", { key: 'b436acb222dd7db455a86e4063567519e309d85e', class: "otp__spinner" }))), index.h("rebill-button", { key: 'ac5bcb96f2fac2426579ac33ca2f84f36e3dda51', type: "button", variant: "outline", theme: this.isTimerRunning ? 'secondary' : 'primary', disabled: this.isTimerRunning, onClick: this.handleResendCode, size: "small", style: { height: '24px', marginBottom: '8px' } }, this.isTimerRunning
115
115
  ? `${i18n_service.I18nService.translate('otp.resendCodeIn')} (${this.timer.getFormattedTime()})`
116
- : i18n_service.I18nService.translate('otp.resendCode')), this.codeResent && (index.h("div", { key: 'eee3c0fc0d9b63a6e040ba848588ea4de100374a', class: "code-resent-container" }, index.h("rebill-typography", { key: '9735a985961b5fa4a788d2f051ad984c2b06c1db', variant: "subtitle2", color: colorClassMapper.COLORS_ENUM.GREEN }, index.h("rebill-icon", { key: 'f22b2ee54b286926adb1a984f7c2288811ba8bd9', name: "check-radio" }), i18n_service.I18nService.translate('otp.codeResent')))), index.h("rebill-alert", { key: '8eb1e5c93b804f9b79f332a7788be9ed2cbab9e9', class: "rebill-alert", type: "secure", variant: "variant-info", message: i18n_service.I18nService.translate('otp.infoMessage'), icon: "circle-info", alertTitle: i18n_service.I18nService.translate('otp.infoTitle'), colorIcon: colorClassMapper.COLORS_ENUM.PRIMARY_DARK_LIGHT }), index.h("div", { key: '9d56b4008bb08be948282dedb9ccc8b47bb10126', class: "alternative" }, index.h("rebill-typography", { key: '854d5cca0f5ee1e74682e37a4fec2bfbf2be6097', variant: "body2", color: colorClassMapper.COLORS_ENUM.PRIMARY_DARK }, "o")), index.h("div", { key: 'ec364378f08786acd5dcf582a326367759c96ab4', class: "guest-options" }, index.h("rebill-button", { key: '7d7d28d5b813d41bf99436fb6f8d1031ec4ad999', type: "button", variant: "outline", theme: "secondary", size: "medium", onClick: () => {
116
+ : i18n_service.I18nService.translate('otp.resendCode')), this.codeResent && (index.h("div", { key: 'b5f54b7f537c0e382d2c1a3ff79a24f2cf4e63a9', class: "otp__code-resent-container" }, index.h("rebill-typography", { key: '4aeaeb7d4d37eab63ca63419dccb54e1b7d2fda8', variant: "subtitle2", color: colorClassMapper.COLORS_ENUM.GREEN }, index.h("rebill-icon", { key: '4fea914f167a28bb06e0cf69d833fda493752d55', name: "check-radio" }), i18n_service.I18nService.translate('otp.codeResent')))), index.h("rebill-alert", { key: 'a8bcbdbc5af7a9e6a12bc842dd8142812638f3fa', class: "otp__rebill-alert", type: "secure", variant: "variant-info", message: i18n_service.I18nService.translate('otp.infoMessage'), icon: "circle-info", alertTitle: i18n_service.I18nService.translate('otp.infoTitle'), colorIcon: colorClassMapper.COLORS_ENUM.PRIMARY_DARK_LIGHT }), index.h("div", { key: '9ff81fa5dce0deaec0a292d2e25d396f559a27a5', class: "otp__alternative" }, index.h("rebill-typography", { key: 'b8e4f23db473f1049f4f6eae5a489722053aa24a', variant: "body2", color: colorClassMapper.COLORS_ENUM.PRIMARY_DARK }, "o")), index.h("div", { key: '87a52e07d7c709c95517f0f3606d843c6580f9bf', class: "otp__guest-options" }, index.h("rebill-button", { key: '3fb138f038065cb6ec2852f313de1eae3d194748', type: "button", variant: "outline", theme: "secondary", size: "medium", onClick: () => {
117
117
  this.otpValue = '';
118
118
  this.error = false;
119
119
  this.returnForm.emit(false);
120
- } }, i18n_service.I18nService.translate('otp.continueAsGuest')), index.h("rebill-alert", { key: '871f3f30f989510da526b901e71491377e6fd426', type: "secure", variant: "variant-secure", icon: "lock-outline", message: i18n_service.I18nService.translate('otp.secureMessage') }))));
120
+ } }, i18n_service.I18nService.translate('otp.continueAsGuest')), index.h("rebill-alert", { key: '3bd11b6a8a91c2690998c2f7af36e872e485fffe', type: "secure", variant: "variant-secure", icon: "lock-outline", message: i18n_service.I18nService.translate('otp.secureMessage') }))));
121
121
  }
122
122
  };
123
123
  Otp.style = otpCss;
@@ -1 +1 @@
1
- {"file":"otp-component.entry.cjs.js","mappings":"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","names":["createCountdownTimer","api","sessionState","SessionStore","h","I18nService","COLORS_ENUM"],"sources":["src/components/checkout/otp/otp.css?tag=otp-component","src/components/checkout/otp/otp.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"],"version":3}
1
+ {"file":"otp-component.entry.cjs.js","mappings":"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","names":["createCountdownTimer","api","sessionState","SessionStore","h","I18nService","COLORS_ENUM"],"sources":["src/components/checkout/otp/otp.css?tag=otp-component","src/components/checkout/otp/otp.tsx"],"sourcesContent":[".otp__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.otp__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__otp-description-container {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: center;\n gap: 4px;\n}\n.otp__change-email {\n cursor: pointer;\n text-decoration: underline;\n margin-left: 0;\n}\n\n.otp__change-email:hover {\n color: var(--rebill-primary-color);\n text-decoration: underline;\n}\n\n.otp__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.otp__rebill-alert {\n width: 100%;\n}\n\n.otp__guest-options {\n display: flex;\n flex-direction: column;\n width: 100%;\n gap: 8px;\n margin-top: auto;\n}\n\n.otp__verifying-container {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 16px;\n margin: 8px 0;\n}\n\n.otp__code-resent-container rebill-typography {\n display: flex;\n line-height: 1;\n}\n\n.otp__code-resent-container rebill-icon {\n flex-shrink: 0;\n display: inline-flex;\n vertical-align: middle;\n margin-right: 8px;\n}\n\n.otp__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__otp-container {\n min-height: calc(100vh - 40px);\n }\n\n .otp__guest-options {\n margin-top: 32px;\n }\n}\n\n@media (min-width: 1025px) {\n .otp__otp-container {\n justify-content: flex-start;\n }\n\n .otp__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__otp-container\">\n <div class=\"otp__user-information\">\n <div class=\"otp__otp-description-container\">\n <rebill-typography variant=\"body2\" class=\"otp__otp-description\">\n {I18nService.translate('otp.description')}\n </rebill-typography>\n <rebill-typography variant=\"subtitle-bold\" class=\"otp__otp-description-digits\">\n {' '}\n <strong>{I18nService.translate('otp.descriptionDigits')}</strong>{' '}\n </rebill-typography>\n <rebill-typography variant=\"body2\" class=\"otp__otp-description-email\">\n {I18nService.translate('otp.descriptionEmail')}\n </rebill-typography>\n </div>\n <rebill-typography variant=\"body2\" class=\"otp__otp-email-line\">\n {sessionState.data.userInformation.email}{' '}\n {!sessionState.data.prefilledData?.email && (\n <span\n class=\"otp__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=\"otp__verifying-container\">\n <rebill-typography variant=\"subtitle2\" color={COLORS_ENUM.PRIMARY}>\n {I18nService.translate('otp.verifyingCode')}\n </rebill-typography>\n <div class=\"otp__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=\"otp__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=\"otp__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=\"otp__alternative\">\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.PRIMARY_DARK}>\n o\n </rebill-typography>\n </div>\n <div class=\"otp__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"],"version":3}
@@ -1 +1 @@
1
- {"version":3,"file":"otp-component.entry.cjs.js","sources":["src/components/checkout/otp/otp.css?tag=otp-component","src/components/checkout/otp/otp.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"],"names":["createCountdownTimer","api","sessionState","SessionStore","h","I18nService","COLORS_ENUM"],"mappings":"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"}
1
+ {"version":3,"file":"otp-component.entry.cjs.js","sources":["src/components/checkout/otp/otp.css?tag=otp-component","src/components/checkout/otp/otp.tsx"],"sourcesContent":[".otp__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.otp__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__otp-description-container {\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: center;\n gap: 4px;\n}\n.otp__change-email {\n cursor: pointer;\n text-decoration: underline;\n margin-left: 0;\n}\n\n.otp__change-email:hover {\n color: var(--rebill-primary-color);\n text-decoration: underline;\n}\n\n.otp__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.otp__rebill-alert {\n width: 100%;\n}\n\n.otp__guest-options {\n display: flex;\n flex-direction: column;\n width: 100%;\n gap: 8px;\n margin-top: auto;\n}\n\n.otp__verifying-container {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 16px;\n margin: 8px 0;\n}\n\n.otp__code-resent-container rebill-typography {\n display: flex;\n line-height: 1;\n}\n\n.otp__code-resent-container rebill-icon {\n flex-shrink: 0;\n display: inline-flex;\n vertical-align: middle;\n margin-right: 8px;\n}\n\n.otp__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__otp-container {\n min-height: calc(100vh - 40px);\n }\n\n .otp__guest-options {\n margin-top: 32px;\n }\n}\n\n@media (min-width: 1025px) {\n .otp__otp-container {\n justify-content: flex-start;\n }\n\n .otp__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__otp-container\">\n <div class=\"otp__user-information\">\n <div class=\"otp__otp-description-container\">\n <rebill-typography variant=\"body2\" class=\"otp__otp-description\">\n {I18nService.translate('otp.description')}\n </rebill-typography>\n <rebill-typography variant=\"subtitle-bold\" class=\"otp__otp-description-digits\">\n {' '}\n <strong>{I18nService.translate('otp.descriptionDigits')}</strong>{' '}\n </rebill-typography>\n <rebill-typography variant=\"body2\" class=\"otp__otp-description-email\">\n {I18nService.translate('otp.descriptionEmail')}\n </rebill-typography>\n </div>\n <rebill-typography variant=\"body2\" class=\"otp__otp-email-line\">\n {sessionState.data.userInformation.email}{' '}\n {!sessionState.data.prefilledData?.email && (\n <span\n class=\"otp__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=\"otp__verifying-container\">\n <rebill-typography variant=\"subtitle2\" color={COLORS_ENUM.PRIMARY}>\n {I18nService.translate('otp.verifyingCode')}\n </rebill-typography>\n <div class=\"otp__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=\"otp__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=\"otp__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=\"otp__alternative\">\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.PRIMARY_DARK}>\n o\n </rebill-typography>\n </div>\n <div class=\"otp__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"],"names":["createCountdownTimer","api","sessionState","SessionStore","h","I18nService","COLORS_ENUM"],"mappings":";;;;;;;;;;;AAAA,MAAM,MAAM,GAAG,sgDAAsgD;;MCaxgD,GAAG,GAAA,MAAA;;;;;;;AACL,IAAA,gBAAgB;IAChB,QAAQ,GAAW,EAAE;IACrB,cAAc,GAAY,KAAK;IAC/B,UAAU,GAAY,KAAK;IAC3B,WAAW,GAAY,KAAK;IAC5B,QAAQ,GAAW,EAAE;AACrB,IAAA,UAAU;AACV,IAAA,YAAY;IACZ,KAAK,GAAY,KAAK;IAEvB,KAAK,GAAGA,0BAAoB,CAAC;AACnC,QAAA,QAAQ,EAAE,EAAE;QACZ,MAAM,EAAE,QAAQ,IAAG;AACjB,YAAA,IAAI,CAAC,QAAQ,GAAG,QAAQ;SACzB;QACD,UAAU,EAAE,MAAK;AACf,YAAA,IAAI,CAAC,cAAc,GAAG,KAAK;SAC5B;AACF,KAAA,CAAC;IAEM,YAAY,GAAGA,0BAAoB,CAAC;AAC1C,QAAA,QAAQ,EAAE,CAAC;QACX,UAAU,EAAE,MAAK;AACf,YAAA,IAAI,CAAC,UAAU,GAAG,KAAK;SACxB;AACF,KAAA,CAAC;IAEF,oBAAoB,GAAA;AAClB,QAAA,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE;;IAGnB,UAAU,GAAA;AACR,QAAA,IAAI,CAAC,KAAK,CAAC,KAAK,EAAE;AAClB,QAAA,IAAI,CAAC,cAAc,GAAG,IAAI;;IAG5B,gBAAgB,GAAG,YAAW;AAC5B,QAAA,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE;YACxB,MAAMC,WAAG,CAAC,GAAG,CAAC,QAAQ,CAACC,kBAAY,CAAC,IAAI,CAAC,SAAS,EAAE;AAClD,gBAAA,KAAK,EAAEA,kBAAY,CAAC,IAAI,CAAC,eAAe,CAAC,KAAK;AAC/C,aAAA,CAAC;AACF,YAAA,IAAI,CAAC,UAAU,GAAG,IAAI;AACtB,YAAA,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE;YACzB,IAAI,CAAC,UAAU,EAAE;AAEjB,YAAA,IAAI,CAAC,KAAK,GAAG,KAAK;;AAEtB,KAAC;AAED,IAAA,eAAe,GAAG,CAAC,KAAa,KAAI;AAClC,QAAA,IAAI,CAAC,QAAQ,GAAG,KAAK;AAErB,QAAA,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE;AACtB,YAAA,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC;AAC3B,YAAA,IAAI,CAAC,KAAK,GAAG,KAAK;;AAEtB,KAAC;AAED,IAAA,eAAe,GAAG,OAAO,GAAW,KAAI;AACtC,QAAA,IAAI,CAAC,WAAW,GAAG,IAAI;AACvB,QAAA,IAAI;AACF,YAAA,MAAM,QAAQ,GAAG,MAAMD,WAAG,CAAC,GAAG,CAAC,MAAM,CAACC,kBAAY,CAAC,IAAI,CAAC,SAAS,EAAE;AACjE,gBAAA,KAAK,EAAEA,kBAAY,CAAC,IAAI,CAAC,eAAe,CAAC,KAAK;AAC9C,gBAAA,IAAI,EAAE,GAAG;AACV,aAAA,CAAC;YAEF,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC;YACrCC,yBAAY,CAAC,kBAAkB,CAAC;AAC9B,gBAAA,GAAG,QAAQ,CAAC,IAAI,CAAC,QAAQ;gBACzB,QAAQ,EAAE,GAAG,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAA,CAAA,EAAI,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAE,CAAA,CAAC,IAAI,EAAE;AACzF,gBAAA,WAAW,EAAE;AACX,oBAAA,MAAM,EAAE,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,MAAM;AACrD,oBAAA,WAAW,EAAE,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,WAAW;AAChE,iBAAA;AACD,gBAAA,OAAO,EAAE;AACP,oBAAA,cAAc,EAAE;AACd,wBAAA,OAAO,EAAE,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,OAAO;AACpD,wBAAA,GAAG,EAAE,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,OAAO;AAChD,wBAAA,IAAI,EAAE,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,IAAI;AAC9C,wBAAA,KAAK,EAAE,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,KAAK;AAChD,wBAAA,OAAO,EAAE,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,OAAO;AACrD,qBAAA;AACF,iBAAA;AACD,gBAAA,YAAY,EAAE,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,IAAI;AAC5D,gBAAA,cAAc,EAAE,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,KAAK;AAChE,aAAA,CAAC;YACFA,yBAAY,CAAC,cAAc,CAAC,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC;YACtDA,yBAAY,CAAC,aAAa,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE,CAAC;AACrD,YAAA,IAAI,CAAC,QAAQ,GAAG,EAAE;AAClB,YAAA,IAAI,CAAC,KAAK,GAAG,KAAK;;QAClB,OAAO,KAAK,EAAE;AACd,YAAA,IAAI,CAAC,KAAK,GAAG,IAAI;;gBACT;AACR,YAAA,IAAI,CAAC,WAAW,GAAG,KAAK;;AAE5B,KAAC;IAED,MAAM,GAAA;QACJ,QACEC,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,oBAAoB,EAAA,EAC7BA,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,uBAAuB,EAAA,EAChCA,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,gCAAgC,EAAA,EACzCA,OAAA,CAAA,mBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAmB,OAAO,EAAC,OAAO,EAAC,KAAK,EAAC,sBAAsB,EAC5D,EAAAC,wBAAW,CAAC,SAAS,CAAC,iBAAiB,CAAC,CACvB,EACpBD,OAAA,CAAA,mBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAmB,OAAO,EAAC,eAAe,EAAC,KAAK,EAAC,6BAA6B,EAAA,EAC3E,GAAG,EACJA,OAAA,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAASC,wBAAW,CAAC,SAAS,CAAC,uBAAuB,CAAC,CAAU,EAAC,GAAG,CACnD,EACpBD,OAAA,CAAA,mBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAmB,OAAO,EAAC,OAAO,EAAC,KAAK,EAAC,4BAA4B,EAClE,EAAAC,wBAAW,CAAC,SAAS,CAAC,sBAAsB,CAAC,CAC5B,CAChB,EACND,OAAA,CAAA,mBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAmB,OAAO,EAAC,OAAO,EAAC,KAAK,EAAC,qBAAqB,EAAA,EAC3DF,kBAAY,CAAC,IAAI,CAAC,eAAe,CAAC,KAAK,EAAE,GAAG,EAC5C,CAACA,kBAAY,CAAC,IAAI,CAAC,aAAa,EAAE,KAAK,KACtCE,OAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,mBAAmB,EACzB,OAAO,EAAE,MAAK;AACZ,gBAAA,IAAI,CAAC,QAAQ,GAAG,EAAE;AAClB,gBAAA,IAAI,CAAC,KAAK,GAAG,KAAK;AAClB,gBAAA,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC;aAC5B,EAAA,EAEAC,wBAAW,CAAC,SAAS,CAAC,YAAY,CAAC,CAC/B,CACR,CACiB,CAChB,EACND,OAAA,CAAA,WAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,GAAG,EAAE,IAAI,CAAC,QAAQ,EAClB,WAAW,EAAE,KAAK,IAAI,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC,MAAM,CAAC,EACxD,KAAK,EAAE,IAAI,CAAC,KAAK,GAAGC,wBAAW,CAAC,SAAS,CAAC,WAAW,CAAC,GAAG,EAAE,EAC3D,CAAA,EAED,IAAI,CAAC,WAAW,KACfD,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,0BAA0B,EAAA,EACnCA,OAAA,CAAA,mBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAmB,OAAO,EAAC,WAAW,EAAC,KAAK,EAAEE,4BAAW,CAAC,OAAO,EAAA,EAC9DD,wBAAW,CAAC,SAAS,CAAC,mBAAmB,CAAC,CACzB,EACpBD,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,cAAc,EAAA,CAAO,CAC5B,CACP,EACDA,OACE,CAAA,eAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,QAAQ,EACb,OAAO,EAAC,SAAS,EACjB,KAAK,EAAE,IAAI,CAAC,cAAc,GAAG,WAAW,GAAG,SAAS,EACpD,QAAQ,EAAE,IAAI,CAAC,cAAc,EAC7B,OAAO,EAAE,IAAI,CAAC,gBAAgB,EAC9B,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,YAAY,EAAE,KAAK,EAAE,EAAA,EAE7C,IAAI,CAAC;AACJ,cAAE,CAAA,EAAGC,wBAAW,CAAC,SAAS,CAAC,kBAAkB,CAAC,CAAA,EAAA,EAAK,IAAI,CAAC,KAAK,CAAC,gBAAgB,EAAE,CAAG,CAAA;cACjFA,wBAAW,CAAC,SAAS,CAAC,gBAAgB,CAAC,CAC7B,EAEf,IAAI,CAAC,UAAU,KACdD,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,4BAA4B,EAAA,EACrCA,OAAmB,CAAA,mBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,OAAO,EAAC,WAAW,EAAC,KAAK,EAAEE,4BAAW,CAAC,KAAK,EAAA,EAC7DF,OAAa,CAAA,aAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,aAAa,EAAG,CAAA,EACjCC,wBAAW,CAAC,SAAS,CAAC,gBAAgB,CAAC,CACtB,CAChB,CACP,EACDD,OAAA,CAAA,cAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAC,mBAAmB,EACzB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAC,cAAc,EACtB,OAAO,EAAEC,wBAAW,CAAC,SAAS,CAAC,iBAAiB,CAAC,EACjD,IAAI,EAAC,aAAa,EAClB,UAAU,EAAEA,wBAAW,CAAC,SAAS,CAAC,eAAe,CAAC,EAClD,SAAS,EAAEC,4BAAW,CAAC,kBAAkB,EACzC,CAAA,EACFF,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,kBAAkB,EAAA,EAC3BA,OAAmB,CAAA,mBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,OAAO,EAAC,OAAO,EAAC,KAAK,EAAEE,4BAAW,CAAC,YAAY,EAAA,EAAA,GAAA,CAE9C,CAChB,EACNF,OAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,oBAAoB,EAAA,EAC7BA,OAAA,CAAA,eAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAC,SAAS,EACjB,KAAK,EAAC,WAAW,EACjB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,MAAK;AACZ,gBAAA,IAAI,CAAC,QAAQ,GAAG,EAAE;AAClB,gBAAA,IAAI,CAAC,KAAK,GAAG,KAAK;AAClB,gBAAA,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK,CAAC;aAC5B,IAEAC,wBAAW,CAAC,SAAS,CAAC,qBAAqB,CAAC,CAC/B,EAEhBD,OACE,CAAA,cAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,QAAQ,EACb,OAAO,EAAC,gBAAgB,EACxB,IAAI,EAAC,cAAc,EACnB,OAAO,EAAEC,wBAAW,CAAC,SAAS,CAAC,mBAAmB,CAAC,EACnD,CAAA,CACE,CACF;;;;;;;"}