rebill-web-components-sdk 1.8.8-beta-4 → 1.8.8-beta-5

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.
@@ -474,13 +474,7 @@ const PaymentMethodSelector = class {
474
474
  }
475
475
  getPaymentMethodConfig(method) {
476
476
  const countryPaymentMethods = this.country ? html2canvas.getCountryPaymentMethods(this.country) : null;
477
- let countrySpecificMethod;
478
- if (method === i18n_service.PAYMENT_METHOD_ENUM.BANK_TRANSFER) {
479
- countrySpecificMethod = countryPaymentMethods?.find(pm => pm.type === method && pm.icons.length > 1);
480
- }
481
- else {
482
- countrySpecificMethod = countryPaymentMethods?.find(pm => pm.type === method);
483
- }
477
+ const countrySpecificMethod = countryPaymentMethods?.find(pm => pm.type === method);
484
478
  // Default configurations (fallback)
485
479
  const defaultConfigs = {
486
480
  [i18n_service.PAYMENT_METHOD_ENUM.CARD]: {
@@ -4625,7 +4619,7 @@ const SelectableCard = class {
4625
4619
  };
4626
4620
  SelectableCard.style = selectableCardCss;
4627
4621
 
4628
- const singlePaymentMethodCss = ".single-payment-method{display:flex;align-items:center;justify-content:space-between;gap:16px;height:40px;width:100%;border-radius:8px;background-color:var(--rebill-color-background-right);padding:2px 4px 2px 4px;box-sizing:border-box}.payment-method{display:flex;align-items:center;gap:8px}.icon-container{height:32px;display:flex;align-items:center;gap:8px;justify-content:center;flex-shrink:0}.icon-container rebill-icon{width:32px;height:32px;display:flex;align-items:center;justify-content:center}";
4622
+ const singlePaymentMethodCss = ".single-payment-method{display:flex;align-items:center;justify-content:space-between;gap:16px;height:40px;width:100%;border-radius:8px;background-color:var(--rebill-color-background-right);padding:2px 4px 2px 4px;box-sizing:border-box}.payment-method{display:flex;align-items:center;gap:8px;height:100%}.icon-container{height:32px;display:flex;align-items:center;gap:8px;justify-content:center;flex-shrink:0}.icon-container rebill-icon{width:32px;height:32px;display:flex;align-items:center;justify-content:center}.payment-method rebill-icon{width:32px;height:32px;display:flex;align-items:center;justify-content:center;flex-shrink:0}";
4629
4623
 
4630
4624
  const SinglePaymentMethod = class {
4631
4625
  constructor(hostRef) {
@@ -41,13 +41,7 @@ export class PaymentMethodSelector {
41
41
  }
42
42
  getPaymentMethodConfig(method) {
43
43
  const countryPaymentMethods = this.country ? getCountryPaymentMethods(this.country) : null;
44
- let countrySpecificMethod;
45
- if (method === PAYMENT_METHOD_ENUM.BANK_TRANSFER) {
46
- countrySpecificMethod = countryPaymentMethods?.find(pm => pm.type === method && pm.icons.length > 1);
47
- }
48
- else {
49
- countrySpecificMethod = countryPaymentMethods?.find(pm => pm.type === method);
50
- }
44
+ const countrySpecificMethod = countryPaymentMethods?.find(pm => pm.type === method);
51
45
  // Default configurations (fallback)
52
46
  const defaultConfigs = {
53
47
  [PAYMENT_METHOD_ENUM.CARD]: {
@@ -1 +1 @@
1
- {"version":3,"file":"payment-method-selector.js","sourceRoot":"","sources":["../../../../src/components/checkout/payment-method-selector/payment-method-selector.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Event, EventEmitter, h, Listen, Prop, State } from '@stencil/core';\nimport { I18nService } from '../../../i18n/i18n.service';\nimport { SESSION_ITEM_TYPE_ENUM } from '../../../models';\nimport { PAYMENT_METHOD_ENUM } from '../../../models/enums/payment-methods.enum';\nimport { sessionState } from '../../../store/session.store';\nimport { COLORS_ENUM } from '../../../utils/color-class-mapper';\nimport { getCountryPaymentMethods } from '../../../utils/countries-payment-methods';\nimport { getPaymentMethodDisplayName } from '../../../utils/get-payment-method-display-name';\n\nexport interface CardError {\n showCardInvalid: boolean;\n type: 'tokenization_error' | 'card_error' | null;\n}\n@Component({\n tag: 'payment-method-selector',\n styleUrl: 'payment-method-selector.css',\n shadow: false,\n})\nexport class PaymentMethodSelector {\n @Prop() enabledPaymentMethods: PAYMENT_METHOD_ENUM[] = [];\n\n @Prop() defaultSelected?: PAYMENT_METHOD_ENUM;\n @Prop() showErrorComponent: boolean = false;\n @Prop() cardError: CardError;\n // currency country\n @Prop() country?: string;\n @Prop() installmentsError?: string;\n @Prop() documentTypeError?: string;\n @Prop() showDocument?: boolean;\n @Prop() documentNumberError?: string;\n @Prop() customCSS?: string;\n @Prop() errorComponent?: {\n showErrorComponent: boolean;\n alertTitle?: string;\n message: string;\n };\n @Prop() disabled?: boolean = false;\n @State() icon: string = '';\n\n @State() selectedPaymentMethod: PAYMENT_METHOD_ENUM;\n @State() saveCard: boolean = false;\n\n @Event() paymentMethodSelected: EventEmitter<PAYMENT_METHOD_ENUM>;\n\n componentWillLoad() {\n if (this.enabledPaymentMethods.length > 0) {\n this.selectedPaymentMethod = this.defaultSelected || this.enabledPaymentMethods[0];\n\n if (this.enabledPaymentMethods.length === 1) {\n this.paymentMethodSelected.emit(this.selectedPaymentMethod);\n }\n }\n this.getPaymentMethodIcon(this.selectedPaymentMethod);\n }\n\n componentWillUpdate() {\n // Update selected payment method when defaultSelected prop changes\n if (this.defaultSelected && this.selectedPaymentMethod !== this.defaultSelected) {\n this.selectedPaymentMethod = this.defaultSelected;\n }\n }\n\n private getPaymentMethodConfig(method: PAYMENT_METHOD_ENUM) {\n const countryPaymentMethods = this.country ? getCountryPaymentMethods(this.country) : null;\n\n let countrySpecificMethod;\n if (method === PAYMENT_METHOD_ENUM.BANK_TRANSFER) {\n countrySpecificMethod = countryPaymentMethods?.find(\n pm => pm.type === method && pm.icons.length > 1,\n );\n } else {\n countrySpecificMethod = countryPaymentMethods?.find(pm => pm.type === method);\n }\n\n // Default configurations (fallback)\n const defaultConfigs = {\n [PAYMENT_METHOD_ENUM.CARD]: {\n key: PAYMENT_METHOD_ENUM.CARD,\n label: I18nService.translate('paymentMethods.card'),\n icons: ['card'],\n },\n [PAYMENT_METHOD_ENUM.CASH]: {\n key: PAYMENT_METHOD_ENUM.CASH,\n label: I18nService.translate('paymentMethods.cash'),\n icons: ['pago-facil'],\n },\n [PAYMENT_METHOD_ENUM.BANK_TRANSFER]: {\n key: PAYMENT_METHOD_ENUM.BANK_TRANSFER,\n label: I18nService.translate('paymentMethods.bank_transfer'),\n icons: ['plus'],\n },\n };\n\n const defaultConfig = defaultConfigs[method];\n\n // If we have country-specific icons, use them; otherwise use defaults\n return {\n ...defaultConfig,\n icons: countrySpecificMethod?.icons || defaultConfig.icons,\n };\n }\n\n private getPaymentMethodIcon(paymentMethod: PAYMENT_METHOD_ENUM) {\n this.icon = getPaymentMethodDisplayName(paymentMethod, this.country)?.toLowerCase() || 'card';\n return this.icon;\n }\n\n handlePaymentMethodSelected(paymentMethod: PAYMENT_METHOD_ENUM) {\n if (this.disabled) {\n return;\n }\n this.selectedPaymentMethod = paymentMethod;\n this.paymentMethodSelected.emit(paymentMethod);\n }\n\n // handleSaveCardChange(event: any) {\n // this.saveCard = event?.target?.checked;\n // SessionStore.setSaveCard(this.saveCard);\n // }\n\n @Listen('selectableCardClick')\n handleSelectableCardClick(event: CustomEvent<string>) {\n if (this.disabled) {\n return;\n }\n const paymentMethodKey = event.detail as PAYMENT_METHOD_ENUM;\n this.handlePaymentMethodSelected(paymentMethodKey);\n }\n\n render() {\n if (this.enabledPaymentMethods.length === 0) {\n return null;\n }\n\n return (\n <div class=\"payment-method-selector\">\n <div\n style={{\n display: 'flex',\n flexDirection: 'row',\n gap: '8px',\n width: '100%',\n justifyContent: 'space-between',\n }}\n >\n {this.enabledPaymentMethods.length === 1 &&\n (() => {\n const config = this.getPaymentMethodConfig(this.enabledPaymentMethods[0]);\n return (\n <single-payment-method\n paymentMethod={this.enabledPaymentMethods[0]}\n currencyCountry={this.country}\n paymentMethodDetails={[]}\n icons={config.icons}\n style={{\n display: 'flex',\n flex: '1 1 0',\n }}\n />\n );\n })()}\n {this.enabledPaymentMethods.length > 1 &&\n this.enabledPaymentMethods.map(paymentMethod => {\n const config = this.getPaymentMethodConfig(paymentMethod);\n return (\n <selectable-card\n style={{ flex: '1 1 0' }}\n selected={this.selectedPaymentMethod === paymentMethod}\n card-key={config.key}\n label={config.label}\n disabled={this.disabled}\n >\n <span slot=\"icon\">\n <div style={{ display: 'flex', alignItems: 'center', gap: '8px' }}>\n {config.icons.map(iconName => {\n return (\n <rebill-icon\n name={iconName}\n color={\n this.disabled && paymentMethod === PAYMENT_METHOD_ENUM.CARD\n ? COLORS_ENUM.NEUTRALS_500\n : 'currentColor'\n }\n />\n );\n })}\n </div>\n </span>\n </selectable-card>\n );\n })}\n </div>\n <div>\n {this.cardError.showCardInvalid &&\n this.selectedPaymentMethod === PAYMENT_METHOD_ENUM.CARD ? (\n <rebill-alert\n type=\"error\"\n alertTitle={\n this.cardError.type === 'tokenization_error'\n ? I18nService.translate('validation.tokenError')\n : I18nService.translate('validation.cardInvalid')\n }\n variant=\"outlined\"\n message={\n this.cardError.type === 'tokenization_error'\n ? I18nService.translate('validation.tokenErrorDescription')\n : I18nService.translate('validation.cardInvalidDescription')\n }\n icon=\"error\"\n />\n ) : this.errorComponent.showErrorComponent ? (\n <rebill-alert\n type=\"error\"\n alertTitle={this.errorComponent.alertTitle}\n message={this.errorComponent.message}\n variant=\"outlined\"\n icon=\"error\"\n />\n ) : null}\n </div>\n {this.enabledPaymentMethods.length > 1 &&\n this.selectedPaymentMethod === PAYMENT_METHOD_ENUM.CARD &&\n sessionState.data?.itemInformation?.type !== SESSION_ITEM_TYPE_ENUM.PLAN && (\n <div\n style={{\n display: 'flex',\n justifyContent: 'flex-end',\n alignItems: 'center',\n }}\n >\n {/* <rebill-input-checkbox\n id=\"saveCard\"\n checked={this.saveCard}\n label={I18nService.translate('paymentMethods.saveCard')}\n onInput={event => this.handleSaveCardChange(event)}\n /> */}\n </div>\n )}\n {this.selectedPaymentMethod === PAYMENT_METHOD_ENUM.CARD && (\n <>\n {/* {this.enabledPaymentMethods.length > 1 && (\n <div class=\"card-description-container\">\n <div style={{ display: 'flex', alignItems: 'center', gap: '8px' }}>\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.TEXT_PRIMARY}>\n {I18nService.translate('paymentMethods.cardDescription')}\n </rebill-typography>\n <rebill-card-carousel\n size=\"24px\"\n color=\"currentColor\"\n show-all-cards=\"false\"\n ></rebill-card-carousel>\n </div>\n </div>\n )} */}\n <div>\n <card-fields-wrapper\n installmentsError={this.installmentsError}\n documentTypeError={this.documentTypeError}\n documentNumberError={this.documentNumberError}\n showDocument={this.showDocument}\n customCSS={this.customCSS}\n />\n </div>\n </>\n )}\n {/* Mostrar campos de documento para BANK_TRANSFER y CASH cuando showDocument es true */}\n {(this.selectedPaymentMethod === PAYMENT_METHOD_ENUM.BANK_TRANSFER ||\n this.selectedPaymentMethod === PAYMENT_METHOD_ENUM.CASH) &&\n this.showDocument && (\n <div>\n <card-identification\n documentTypeError={this.documentTypeError}\n documentNumberError={this.documentNumberError}\n />\n </div>\n )}\n </div>\n );\n }\n}\n"]}
1
+ {"version":3,"file":"payment-method-selector.js","sourceRoot":"","sources":["../../../../src/components/checkout/payment-method-selector/payment-method-selector.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Event, EventEmitter, h, Listen, Prop, State } from '@stencil/core';\nimport { I18nService } from '../../../i18n/i18n.service';\nimport { SESSION_ITEM_TYPE_ENUM } from '../../../models';\nimport { PAYMENT_METHOD_ENUM } from '../../../models/enums/payment-methods.enum';\nimport { sessionState } from '../../../store/session.store';\nimport { COLORS_ENUM } from '../../../utils/color-class-mapper';\nimport { getCountryPaymentMethods } from '../../../utils/countries-payment-methods';\nimport { getPaymentMethodDisplayName } from '../../../utils/get-payment-method-display-name';\n\nexport interface CardError {\n showCardInvalid: boolean;\n type: 'tokenization_error' | 'card_error' | null;\n}\n@Component({\n tag: 'payment-method-selector',\n styleUrl: 'payment-method-selector.css',\n shadow: false,\n})\nexport class PaymentMethodSelector {\n @Prop() enabledPaymentMethods: PAYMENT_METHOD_ENUM[] = [];\n\n @Prop() defaultSelected?: PAYMENT_METHOD_ENUM;\n @Prop() showErrorComponent: boolean = false;\n @Prop() cardError: CardError;\n // currency country\n @Prop() country?: string;\n @Prop() installmentsError?: string;\n @Prop() documentTypeError?: string;\n @Prop() showDocument?: boolean;\n @Prop() documentNumberError?: string;\n @Prop() customCSS?: string;\n @Prop() errorComponent?: {\n showErrorComponent: boolean;\n alertTitle?: string;\n message: string;\n };\n @Prop() disabled?: boolean = false;\n @State() icon: string = '';\n\n @State() selectedPaymentMethod: PAYMENT_METHOD_ENUM;\n @State() saveCard: boolean = false;\n\n @Event() paymentMethodSelected: EventEmitter<PAYMENT_METHOD_ENUM>;\n\n componentWillLoad() {\n if (this.enabledPaymentMethods.length > 0) {\n this.selectedPaymentMethod = this.defaultSelected || this.enabledPaymentMethods[0];\n\n if (this.enabledPaymentMethods.length === 1) {\n this.paymentMethodSelected.emit(this.selectedPaymentMethod);\n }\n }\n this.getPaymentMethodIcon(this.selectedPaymentMethod);\n }\n\n componentWillUpdate() {\n // Update selected payment method when defaultSelected prop changes\n if (this.defaultSelected && this.selectedPaymentMethod !== this.defaultSelected) {\n this.selectedPaymentMethod = this.defaultSelected;\n }\n }\n\n private getPaymentMethodConfig(method: PAYMENT_METHOD_ENUM) {\n const countryPaymentMethods = this.country ? getCountryPaymentMethods(this.country) : null;\n\n const countrySpecificMethod = countryPaymentMethods?.find(pm => pm.type === method);\n\n // Default configurations (fallback)\n const defaultConfigs = {\n [PAYMENT_METHOD_ENUM.CARD]: {\n key: PAYMENT_METHOD_ENUM.CARD,\n label: I18nService.translate('paymentMethods.card'),\n icons: ['card'],\n },\n [PAYMENT_METHOD_ENUM.CASH]: {\n key: PAYMENT_METHOD_ENUM.CASH,\n label: I18nService.translate('paymentMethods.cash'),\n icons: ['pago-facil'],\n },\n [PAYMENT_METHOD_ENUM.BANK_TRANSFER]: {\n key: PAYMENT_METHOD_ENUM.BANK_TRANSFER,\n label: I18nService.translate('paymentMethods.bank_transfer'),\n icons: ['plus'],\n },\n };\n\n const defaultConfig = defaultConfigs[method];\n\n // If we have country-specific icons, use them; otherwise use defaults\n return {\n ...defaultConfig,\n icons: countrySpecificMethod?.icons || defaultConfig.icons,\n };\n }\n\n private getPaymentMethodIcon(paymentMethod: PAYMENT_METHOD_ENUM) {\n this.icon = getPaymentMethodDisplayName(paymentMethod, this.country)?.toLowerCase() || 'card';\n return this.icon;\n }\n\n handlePaymentMethodSelected(paymentMethod: PAYMENT_METHOD_ENUM) {\n if (this.disabled) {\n return;\n }\n this.selectedPaymentMethod = paymentMethod;\n this.paymentMethodSelected.emit(paymentMethod);\n }\n\n // handleSaveCardChange(event: any) {\n // this.saveCard = event?.target?.checked;\n // SessionStore.setSaveCard(this.saveCard);\n // }\n\n @Listen('selectableCardClick')\n handleSelectableCardClick(event: CustomEvent<string>) {\n if (this.disabled) {\n return;\n }\n const paymentMethodKey = event.detail as PAYMENT_METHOD_ENUM;\n this.handlePaymentMethodSelected(paymentMethodKey);\n }\n\n render() {\n if (this.enabledPaymentMethods.length === 0) {\n return null;\n }\n\n return (\n <div class=\"payment-method-selector\">\n <div\n style={{\n display: 'flex',\n flexDirection: 'row',\n gap: '8px',\n width: '100%',\n justifyContent: 'space-between',\n }}\n >\n {this.enabledPaymentMethods.length === 1 &&\n (() => {\n const config = this.getPaymentMethodConfig(this.enabledPaymentMethods[0]);\n return (\n <single-payment-method\n paymentMethod={this.enabledPaymentMethods[0]}\n currencyCountry={this.country}\n paymentMethodDetails={[]}\n icons={config.icons}\n style={{\n display: 'flex',\n flex: '1 1 0',\n }}\n />\n );\n })()}\n {this.enabledPaymentMethods.length > 1 &&\n this.enabledPaymentMethods.map(paymentMethod => {\n const config = this.getPaymentMethodConfig(paymentMethod);\n return (\n <selectable-card\n style={{ flex: '1 1 0' }}\n selected={this.selectedPaymentMethod === paymentMethod}\n card-key={config.key}\n label={config.label}\n disabled={this.disabled}\n >\n <span slot=\"icon\">\n <div style={{ display: 'flex', alignItems: 'center', gap: '8px' }}>\n {config.icons.map(iconName => {\n return (\n <rebill-icon\n name={iconName}\n color={\n this.disabled && paymentMethod === PAYMENT_METHOD_ENUM.CARD\n ? COLORS_ENUM.NEUTRALS_500\n : 'currentColor'\n }\n />\n );\n })}\n </div>\n </span>\n </selectable-card>\n );\n })}\n </div>\n <div>\n {this.cardError.showCardInvalid &&\n this.selectedPaymentMethod === PAYMENT_METHOD_ENUM.CARD ? (\n <rebill-alert\n type=\"error\"\n alertTitle={\n this.cardError.type === 'tokenization_error'\n ? I18nService.translate('validation.tokenError')\n : I18nService.translate('validation.cardInvalid')\n }\n variant=\"outlined\"\n message={\n this.cardError.type === 'tokenization_error'\n ? I18nService.translate('validation.tokenErrorDescription')\n : I18nService.translate('validation.cardInvalidDescription')\n }\n icon=\"error\"\n />\n ) : this.errorComponent.showErrorComponent ? (\n <rebill-alert\n type=\"error\"\n alertTitle={this.errorComponent.alertTitle}\n message={this.errorComponent.message}\n variant=\"outlined\"\n icon=\"error\"\n />\n ) : null}\n </div>\n {this.enabledPaymentMethods.length > 1 &&\n this.selectedPaymentMethod === PAYMENT_METHOD_ENUM.CARD &&\n sessionState.data?.itemInformation?.type !== SESSION_ITEM_TYPE_ENUM.PLAN && (\n <div\n style={{\n display: 'flex',\n justifyContent: 'flex-end',\n alignItems: 'center',\n }}\n >\n {/* <rebill-input-checkbox\n id=\"saveCard\"\n checked={this.saveCard}\n label={I18nService.translate('paymentMethods.saveCard')}\n onInput={event => this.handleSaveCardChange(event)}\n /> */}\n </div>\n )}\n {this.selectedPaymentMethod === PAYMENT_METHOD_ENUM.CARD && (\n <>\n {/* {this.enabledPaymentMethods.length > 1 && (\n <div class=\"card-description-container\">\n <div style={{ display: 'flex', alignItems: 'center', gap: '8px' }}>\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.TEXT_PRIMARY}>\n {I18nService.translate('paymentMethods.cardDescription')}\n </rebill-typography>\n <rebill-card-carousel\n size=\"24px\"\n color=\"currentColor\"\n show-all-cards=\"false\"\n ></rebill-card-carousel>\n </div>\n </div>\n )} */}\n <div>\n <card-fields-wrapper\n installmentsError={this.installmentsError}\n documentTypeError={this.documentTypeError}\n documentNumberError={this.documentNumberError}\n showDocument={this.showDocument}\n customCSS={this.customCSS}\n />\n </div>\n </>\n )}\n {/* Mostrar campos de documento para BANK_TRANSFER y CASH cuando showDocument es true */}\n {(this.selectedPaymentMethod === PAYMENT_METHOD_ENUM.BANK_TRANSFER ||\n this.selectedPaymentMethod === PAYMENT_METHOD_ENUM.CASH) &&\n this.showDocument && (\n <div>\n <card-identification\n documentTypeError={this.documentTypeError}\n documentNumberError={this.documentNumberError}\n />\n </div>\n )}\n </div>\n );\n }\n}\n"]}
@@ -15,6 +15,7 @@
15
15
  display: flex;
16
16
  align-items: center;
17
17
  gap: 8px;
18
+ height: 100%;
18
19
  }
19
20
 
20
21
  .icon-container {
@@ -33,3 +34,12 @@
33
34
  align-items: center;
34
35
  justify-content: center;
35
36
  }
37
+
38
+ .payment-method rebill-icon {
39
+ width: 32px;
40
+ height: 32px;
41
+ display: flex;
42
+ align-items: center;
43
+ justify-content: center;
44
+ flex-shrink: 0;
45
+ }
@@ -4,7 +4,7 @@ import { C as COLORS_ENUM } from './p-DA598vBj.js';
4
4
  import { d as defineCustomElement$2 } from './p-CTgkZUJ9.js';
5
5
  import { d as defineCustomElement$1 } from './p-C_txMekS.js';
6
6
 
7
- const singlePaymentMethodCss = ".single-payment-method{display:flex;align-items:center;justify-content:space-between;gap:16px;height:40px;width:100%;border-radius:8px;background-color:var(--rebill-color-background-right);padding:2px 4px 2px 4px;box-sizing:border-box}.payment-method{display:flex;align-items:center;gap:8px}.icon-container{height:32px;display:flex;align-items:center;gap:8px;justify-content:center;flex-shrink:0}.icon-container rebill-icon{width:32px;height:32px;display:flex;align-items:center;justify-content:center}";
7
+ const singlePaymentMethodCss = ".single-payment-method{display:flex;align-items:center;justify-content:space-between;gap:16px;height:40px;width:100%;border-radius:8px;background-color:var(--rebill-color-background-right);padding:2px 4px 2px 4px;box-sizing:border-box}.payment-method{display:flex;align-items:center;gap:8px;height:100%}.icon-container{height:32px;display:flex;align-items:center;gap:8px;justify-content:center;flex-shrink:0}.icon-container rebill-icon{width:32px;height:32px;display:flex;align-items:center;justify-content:center}.payment-method rebill-icon{width:32px;height:32px;display:flex;align-items:center;justify-content:center;flex-shrink:0}";
8
8
 
9
9
  const SinglePaymentMethod = /*@__PURE__*/ proxyCustomElement(class SinglePaymentMethod extends H {
10
10
  constructor(registerHost) {
@@ -53,6 +53,6 @@ function defineCustomElement() {
53
53
  defineCustomElement();
54
54
 
55
55
  export { SinglePaymentMethod as S, defineCustomElement as d };
56
- //# sourceMappingURL=p-B9x9YyVr.js.map
56
+ //# sourceMappingURL=p-CmO_OY_q.js.map
57
57
 
58
- //# sourceMappingURL=p-B9x9YyVr.js.map
58
+ //# sourceMappingURL=p-CmO_OY_q.js.map
@@ -0,0 +1 @@
1
+ {"file":"p-CmO_OY_q.js","mappings":";;;;;;AAAA,MAAM,sBAAsB,GAAG,4nBAA4nB;;MCW9oB,mBAAmB,iBAAAA,kBAAA,CAAA,MAAA,mBAAA,SAAAC,CAAA,CAAA;;;;;;;AACtB,IAAA,aAAa;AACb,IAAA,eAAe;AACf,IAAA,oBAAoB;IACpB,KAAK,GAAa,EAAE;IAC5B,MAAM,GAAA;QACJ,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,uBAAuB,EAAA,EAChC,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,gBAAgB,EAAA,EACxB,IAAI,CAAC,aAAa,KAAK,mBAAmB,CAAC,IAAI,IAAI,CAAa,CAAA,aAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,MAAM,EAAG,CAAA,EAC9E,IAAI,CAAC,aAAa,KAAK,mBAAmB,CAAC,aAAa,IAAI,CAAa,CAAA,aAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAC,MAAM,EAAG,CAAA,EACxF,CAAA,CAAA,mBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAmB,OAAO,EAAC,aAAa,EAAC,KAAK,EAAE,WAAW,CAAC,YAAY,IACrE,WAAW,CAAC,SAAS,CACpB,CAAA,eAAA,EAAkB,IAAI,CAAC,aAAa,KAAK,mBAAmB,CAAC,IAAI,GAAG,iBAAiB,GAAG,IAAI,CAAC,aAAa,CAAA,CAAE,CAC7G,CACiB,CAChB,EAEL,IAAI,CAAC,aAAa,KAAK,mBAAmB,CAAC,aAAa,KACvD,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,gBAAgB,EAAA,EACxB,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,IACpB,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,QAAQ,IAAI,CAAA,CAAA,aAAA,EAAA,EAAa,IAAI,EAAE,QAAQ,EAAE,GAAG,EAAE,QAAQ,EAAA,CAAI,CAAC,KAE1E,CAAa,CAAA,aAAA,EAAA,EAAA,IAAI,EAAC,MAAM,EAAG,CAAA,CAC5B,CACG,CACP,CACG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/shared/singlePaymentMethod/single-payment-method.css?tag=single-payment-method","src/components/shared/singlePaymentMethod/singlePaymentMethod.tsx"],"sourcesContent":[".single-payment-method {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 16px;\n height: 40px;\n width: 100%;\n border-radius: 8px;\n background-color: var(--rebill-color-background-right);\n padding: 2px 4px 2px 4px;\n box-sizing: border-box;\n}\n\n.payment-method {\n display: flex;\n align-items: center;\n gap: 8px;\n height: 100%;\n}\n\n.icon-container {\n height: 32px;\n display: flex;\n align-items: center;\n gap: 8px;\n justify-content: center;\n flex-shrink: 0;\n}\n\n.icon-container rebill-icon {\n width: 32px;\n height: 32px;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.payment-method rebill-icon {\n width: 32px;\n height: 32px;\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n}\n","import { Component, h, Prop } from '@stencil/core';\nimport { I18nService } from '../../../i18n/i18n.service';\nimport { PAYMENT_METHOD_ENUM } from '../../../models/enums/payment-methods.enum';\nimport { PaymentMethodDetails } from '../../../store/session.store';\nimport { COLORS_ENUM } from '../../../utils/color-class-mapper';\n\n@Component({\n tag: 'single-payment-method',\n styleUrl: 'single-payment-method.css',\n shadow: false,\n})\nexport class SinglePaymentMethod {\n @Prop() paymentMethod: PAYMENT_METHOD_ENUM;\n @Prop() currencyCountry: string;\n @Prop() paymentMethodDetails: PaymentMethodDetails[];\n @Prop() icons: string[] = [];\n render() {\n return (\n <div class=\"single-payment-method\">\n <div class=\"payment-method\">\n {this.paymentMethod === PAYMENT_METHOD_ENUM.CARD && <rebill-icon name=\"card\" />}\n {this.paymentMethod === PAYMENT_METHOD_ENUM.BANK_TRANSFER && <rebill-icon name=\"bank\" />}\n <rebill-typography variant=\"body2-small\" color={COLORS_ENUM.NEUTRALS_700}>\n {I18nService.translate(\n `paymentMethods.${this.paymentMethod === PAYMENT_METHOD_ENUM.CARD ? 'cardDescription' : this.paymentMethod}`,\n )}\n </rebill-typography>\n </div>\n\n {this.paymentMethod === PAYMENT_METHOD_ENUM.BANK_TRANSFER && (\n <div class=\"icon-container\">\n {this.icons.length > 0 ? (\n this.icons.map(iconName => <rebill-icon name={iconName} key={iconName} />)\n ) : (\n <rebill-icon name=\"card\" />\n )}\n </div>\n )}\n </div>\n );\n }\n}\n"],"version":3}
@@ -14,7 +14,7 @@ import { d as defineCustomElement$5 } from './p-DfcXCFl6.js';
14
14
  import { d as defineCustomElement$4 } from './p-DPLa2TqM.js';
15
15
  import { d as defineCustomElement$3 } from './p-C_txMekS.js';
16
16
  import { d as defineCustomElement$2 } from './p-CJfuw7NA.js';
17
- import { d as defineCustomElement$1 } from './p-B9x9YyVr.js';
17
+ import { d as defineCustomElement$1 } from './p-CmO_OY_q.js';
18
18
 
19
19
  const paymentMethodSelectorCss = ".payment-method-selector{width:100%;display:flex;flex-direction:column;gap:8px}.card-description-container{display:flex;flex-direction:row;justify-content:space-between;align-items:flex-start;width:100%}";
20
20
 
@@ -60,13 +60,7 @@ const PaymentMethodSelector = /*@__PURE__*/ proxyCustomElement(class PaymentMeth
60
60
  }
61
61
  getPaymentMethodConfig(method) {
62
62
  const countryPaymentMethods = this.country ? getCountryPaymentMethods(this.country) : null;
63
- let countrySpecificMethod;
64
- if (method === PAYMENT_METHOD_ENUM.BANK_TRANSFER) {
65
- countrySpecificMethod = countryPaymentMethods?.find(pm => pm.type === method && pm.icons.length > 1);
66
- }
67
- else {
68
- countrySpecificMethod = countryPaymentMethods?.find(pm => pm.type === method);
69
- }
63
+ const countrySpecificMethod = countryPaymentMethods?.find(pm => pm.type === method);
70
64
  // Default configurations (fallback)
71
65
  const defaultConfigs = {
72
66
  [PAYMENT_METHOD_ENUM.CARD]: {
@@ -248,6 +242,6 @@ function defineCustomElement() {
248
242
  defineCustomElement();
249
243
 
250
244
  export { PaymentMethodSelector as P, defineCustomElement as d };
251
- //# sourceMappingURL=p-D2C4_4Yi.js.map
245
+ //# sourceMappingURL=p-PhkxIk-l.js.map
252
246
 
253
- //# sourceMappingURL=p-D2C4_4Yi.js.map
247
+ //# sourceMappingURL=p-PhkxIk-l.js.map
@@ -0,0 +1 @@
1
+ {"file":"p-PhkxIk-l.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement","sessionState"],"sources":["src/components/checkout/payment-method-selector/payment-method-selector.css?tag=payment-method-selector","src/components/checkout/payment-method-selector/payment-method-selector.tsx"],"sourcesContent":[".payment-method-selector {\n width: 100%;\n display: flex;\n flex-direction: column;\n gap: 8px;\n}\n.card-description-container {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: flex-start;\n width: 100%;\n}\n","import { Component, Event, EventEmitter, h, Listen, Prop, State } from '@stencil/core';\nimport { I18nService } from '../../../i18n/i18n.service';\nimport { SESSION_ITEM_TYPE_ENUM } from '../../../models';\nimport { PAYMENT_METHOD_ENUM } from '../../../models/enums/payment-methods.enum';\nimport { sessionState } from '../../../store/session.store';\nimport { COLORS_ENUM } from '../../../utils/color-class-mapper';\nimport { getCountryPaymentMethods } from '../../../utils/countries-payment-methods';\nimport { getPaymentMethodDisplayName } from '../../../utils/get-payment-method-display-name';\n\nexport interface CardError {\n showCardInvalid: boolean;\n type: 'tokenization_error' | 'card_error' | null;\n}\n@Component({\n tag: 'payment-method-selector',\n styleUrl: 'payment-method-selector.css',\n shadow: false,\n})\nexport class PaymentMethodSelector {\n @Prop() enabledPaymentMethods: PAYMENT_METHOD_ENUM[] = [];\n\n @Prop() defaultSelected?: PAYMENT_METHOD_ENUM;\n @Prop() showErrorComponent: boolean = false;\n @Prop() cardError: CardError;\n // currency country\n @Prop() country?: string;\n @Prop() installmentsError?: string;\n @Prop() documentTypeError?: string;\n @Prop() showDocument?: boolean;\n @Prop() documentNumberError?: string;\n @Prop() customCSS?: string;\n @Prop() errorComponent?: {\n showErrorComponent: boolean;\n alertTitle?: string;\n message: string;\n };\n @Prop() disabled?: boolean = false;\n @State() icon: string = '';\n\n @State() selectedPaymentMethod: PAYMENT_METHOD_ENUM;\n @State() saveCard: boolean = false;\n\n @Event() paymentMethodSelected: EventEmitter<PAYMENT_METHOD_ENUM>;\n\n componentWillLoad() {\n if (this.enabledPaymentMethods.length > 0) {\n this.selectedPaymentMethod = this.defaultSelected || this.enabledPaymentMethods[0];\n\n if (this.enabledPaymentMethods.length === 1) {\n this.paymentMethodSelected.emit(this.selectedPaymentMethod);\n }\n }\n this.getPaymentMethodIcon(this.selectedPaymentMethod);\n }\n\n componentWillUpdate() {\n // Update selected payment method when defaultSelected prop changes\n if (this.defaultSelected && this.selectedPaymentMethod !== this.defaultSelected) {\n this.selectedPaymentMethod = this.defaultSelected;\n }\n }\n\n private getPaymentMethodConfig(method: PAYMENT_METHOD_ENUM) {\n const countryPaymentMethods = this.country ? getCountryPaymentMethods(this.country) : null;\n\n const countrySpecificMethod = countryPaymentMethods?.find(pm => pm.type === method);\n\n // Default configurations (fallback)\n const defaultConfigs = {\n [PAYMENT_METHOD_ENUM.CARD]: {\n key: PAYMENT_METHOD_ENUM.CARD,\n label: I18nService.translate('paymentMethods.card'),\n icons: ['card'],\n },\n [PAYMENT_METHOD_ENUM.CASH]: {\n key: PAYMENT_METHOD_ENUM.CASH,\n label: I18nService.translate('paymentMethods.cash'),\n icons: ['pago-facil'],\n },\n [PAYMENT_METHOD_ENUM.BANK_TRANSFER]: {\n key: PAYMENT_METHOD_ENUM.BANK_TRANSFER,\n label: I18nService.translate('paymentMethods.bank_transfer'),\n icons: ['plus'],\n },\n };\n\n const defaultConfig = defaultConfigs[method];\n\n // If we have country-specific icons, use them; otherwise use defaults\n return {\n ...defaultConfig,\n icons: countrySpecificMethod?.icons || defaultConfig.icons,\n };\n }\n\n private getPaymentMethodIcon(paymentMethod: PAYMENT_METHOD_ENUM) {\n this.icon = getPaymentMethodDisplayName(paymentMethod, this.country)?.toLowerCase() || 'card';\n return this.icon;\n }\n\n handlePaymentMethodSelected(paymentMethod: PAYMENT_METHOD_ENUM) {\n if (this.disabled) {\n return;\n }\n this.selectedPaymentMethod = paymentMethod;\n this.paymentMethodSelected.emit(paymentMethod);\n }\n\n // handleSaveCardChange(event: any) {\n // this.saveCard = event?.target?.checked;\n // SessionStore.setSaveCard(this.saveCard);\n // }\n\n @Listen('selectableCardClick')\n handleSelectableCardClick(event: CustomEvent<string>) {\n if (this.disabled) {\n return;\n }\n const paymentMethodKey = event.detail as PAYMENT_METHOD_ENUM;\n this.handlePaymentMethodSelected(paymentMethodKey);\n }\n\n render() {\n if (this.enabledPaymentMethods.length === 0) {\n return null;\n }\n\n return (\n <div class=\"payment-method-selector\">\n <div\n style={{\n display: 'flex',\n flexDirection: 'row',\n gap: '8px',\n width: '100%',\n justifyContent: 'space-between',\n }}\n >\n {this.enabledPaymentMethods.length === 1 &&\n (() => {\n const config = this.getPaymentMethodConfig(this.enabledPaymentMethods[0]);\n return (\n <single-payment-method\n paymentMethod={this.enabledPaymentMethods[0]}\n currencyCountry={this.country}\n paymentMethodDetails={[]}\n icons={config.icons}\n style={{\n display: 'flex',\n flex: '1 1 0',\n }}\n />\n );\n })()}\n {this.enabledPaymentMethods.length > 1 &&\n this.enabledPaymentMethods.map(paymentMethod => {\n const config = this.getPaymentMethodConfig(paymentMethod);\n return (\n <selectable-card\n style={{ flex: '1 1 0' }}\n selected={this.selectedPaymentMethod === paymentMethod}\n card-key={config.key}\n label={config.label}\n disabled={this.disabled}\n >\n <span slot=\"icon\">\n <div style={{ display: 'flex', alignItems: 'center', gap: '8px' }}>\n {config.icons.map(iconName => {\n return (\n <rebill-icon\n name={iconName}\n color={\n this.disabled && paymentMethod === PAYMENT_METHOD_ENUM.CARD\n ? COLORS_ENUM.NEUTRALS_500\n : 'currentColor'\n }\n />\n );\n })}\n </div>\n </span>\n </selectable-card>\n );\n })}\n </div>\n <div>\n {this.cardError.showCardInvalid &&\n this.selectedPaymentMethod === PAYMENT_METHOD_ENUM.CARD ? (\n <rebill-alert\n type=\"error\"\n alertTitle={\n this.cardError.type === 'tokenization_error'\n ? I18nService.translate('validation.tokenError')\n : I18nService.translate('validation.cardInvalid')\n }\n variant=\"outlined\"\n message={\n this.cardError.type === 'tokenization_error'\n ? I18nService.translate('validation.tokenErrorDescription')\n : I18nService.translate('validation.cardInvalidDescription')\n }\n icon=\"error\"\n />\n ) : this.errorComponent.showErrorComponent ? (\n <rebill-alert\n type=\"error\"\n alertTitle={this.errorComponent.alertTitle}\n message={this.errorComponent.message}\n variant=\"outlined\"\n icon=\"error\"\n />\n ) : null}\n </div>\n {this.enabledPaymentMethods.length > 1 &&\n this.selectedPaymentMethod === PAYMENT_METHOD_ENUM.CARD &&\n sessionState.data?.itemInformation?.type !== SESSION_ITEM_TYPE_ENUM.PLAN && (\n <div\n style={{\n display: 'flex',\n justifyContent: 'flex-end',\n alignItems: 'center',\n }}\n >\n {/* <rebill-input-checkbox\n id=\"saveCard\"\n checked={this.saveCard}\n label={I18nService.translate('paymentMethods.saveCard')}\n onInput={event => this.handleSaveCardChange(event)}\n /> */}\n </div>\n )}\n {this.selectedPaymentMethod === PAYMENT_METHOD_ENUM.CARD && (\n <>\n {/* {this.enabledPaymentMethods.length > 1 && (\n <div class=\"card-description-container\">\n <div style={{ display: 'flex', alignItems: 'center', gap: '8px' }}>\n <rebill-typography variant=\"body2\" color={COLORS_ENUM.TEXT_PRIMARY}>\n {I18nService.translate('paymentMethods.cardDescription')}\n </rebill-typography>\n <rebill-card-carousel\n size=\"24px\"\n color=\"currentColor\"\n show-all-cards=\"false\"\n ></rebill-card-carousel>\n </div>\n </div>\n )} */}\n <div>\n <card-fields-wrapper\n installmentsError={this.installmentsError}\n documentTypeError={this.documentTypeError}\n documentNumberError={this.documentNumberError}\n showDocument={this.showDocument}\n customCSS={this.customCSS}\n />\n </div>\n </>\n )}\n {/* Mostrar campos de documento para BANK_TRANSFER y CASH cuando showDocument es true */}\n {(this.selectedPaymentMethod === PAYMENT_METHOD_ENUM.BANK_TRANSFER ||\n this.selectedPaymentMethod === PAYMENT_METHOD_ENUM.CASH) &&\n this.showDocument && (\n <div>\n <card-identification\n documentTypeError={this.documentTypeError}\n documentNumberError={this.documentNumberError}\n />\n </div>\n )}\n </div>\n );\n }\n}\n"],"version":3}
@@ -1,4 +1,4 @@
1
- import { P as PaymentMethodSelector$1, d as defineCustomElement$1 } from './p-D2C4_4Yi.js';
1
+ import { P as PaymentMethodSelector$1, d as defineCustomElement$1 } from './p-PhkxIk-l.js';
2
2
 
3
3
  const PaymentMethodSelector = PaymentMethodSelector$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -20,7 +20,7 @@ import { d as defineCustomElement$I } from './p-DWKdh2yQ.js';
20
20
  import { d as defineCustomElement$H } from './p-BnwyBJnh.js';
21
21
  import { d as defineCustomElement$G } from './p-CjLCcaJT.js';
22
22
  import { d as defineCustomElement$E } from './p-Bbv8DFQV.js';
23
- import { d as defineCustomElement$C } from './p-D2C4_4Yi.js';
23
+ import { d as defineCustomElement$C } from './p-PhkxIk-l.js';
24
24
  import { d as defineCustomElement$B } from './p-B4jBpnaA.js';
25
25
  import { d as defineCustomElement$A } from './p-BL1UfQF3.js';
26
26
  import { d as defineCustomElement$z } from './p-PPrdK-H6.js';
@@ -48,7 +48,7 @@ import { d as defineCustomElement$a } from './p-C_txMekS.js';
48
48
  import { d as defineCustomElement$9 } from './p-FQYyAgg1.js';
49
49
  import { d as defineCustomElement$8 } from './p-BD5pAH0V.js';
50
50
  import { d as defineCustomElement$7 } from './p-CJfuw7NA.js';
51
- import { d as defineCustomElement$6 } from './p-B9x9YyVr.js';
51
+ import { d as defineCustomElement$6 } from './p-CmO_OY_q.js';
52
52
  import { d as defineCustomElement$5 } from './p-D6qj-aDx.js';
53
53
  import { d as defineCustomElement$4 } from './p-lz17QseM.js';
54
54
  import { d as defineCustomElement$3 } from './p-Cfjs0nZw.js';
@@ -16,7 +16,7 @@ import { d as defineCustomElement$y } from './p-DypoldDs.js';
16
16
  import { d as defineCustomElement$x } from './p-DWKdh2yQ.js';
17
17
  import { d as defineCustomElement$w } from './p-DSgE2Das.js';
18
18
  import { d as defineCustomElement$v } from './p-BFW7cPvA.js';
19
- import { d as defineCustomElement$u } from './p-D2C4_4Yi.js';
19
+ import { d as defineCustomElement$u } from './p-PhkxIk-l.js';
20
20
  import { d as defineCustomElement$t } from './p-B4jBpnaA.js';
21
21
  import { d as defineCustomElement$s } from './p-BL1UfQF3.js';
22
22
  import { d as defineCustomElement$r } from './p-PPrdK-H6.js';
@@ -40,7 +40,7 @@ import { d as defineCustomElement$8 } from './p-BD5pAH0V.js';
40
40
  import { d as defineCustomElement$7 } from './p-BKHkC1rC.js';
41
41
  import { d as defineCustomElement$6 } from './p-Dse87Vrk.js';
42
42
  import { d as defineCustomElement$5 } from './p-CJfuw7NA.js';
43
- import { d as defineCustomElement$4 } from './p-B9x9YyVr.js';
43
+ import { d as defineCustomElement$4 } from './p-CmO_OY_q.js';
44
44
  import { d as defineCustomElement$3 } from './p-Cfjs0nZw.js';
45
45
  import { d as defineCustomElement$2 } from './p-BxANvGc6.js';
46
46
 
@@ -1,4 +1,4 @@
1
- import { S as SinglePaymentMethod$1, d as defineCustomElement$1 } from './p-B9x9YyVr.js';
1
+ import { S as SinglePaymentMethod$1, d as defineCustomElement$1 } from './p-CmO_OY_q.js';
2
2
 
3
3
  const SinglePaymentMethod = SinglePaymentMethod$1;
4
4
  const defineCustomElement = defineCustomElement$1;
@@ -472,13 +472,7 @@ const PaymentMethodSelector = class {
472
472
  }
473
473
  getPaymentMethodConfig(method) {
474
474
  const countryPaymentMethods = this.country ? getCountryPaymentMethods(this.country) : null;
475
- let countrySpecificMethod;
476
- if (method === PAYMENT_METHOD_ENUM.BANK_TRANSFER) {
477
- countrySpecificMethod = countryPaymentMethods?.find(pm => pm.type === method && pm.icons.length > 1);
478
- }
479
- else {
480
- countrySpecificMethod = countryPaymentMethods?.find(pm => pm.type === method);
481
- }
475
+ const countrySpecificMethod = countryPaymentMethods?.find(pm => pm.type === method);
482
476
  // Default configurations (fallback)
483
477
  const defaultConfigs = {
484
478
  [PAYMENT_METHOD_ENUM.CARD]: {
@@ -4623,7 +4617,7 @@ const SelectableCard = class {
4623
4617
  };
4624
4618
  SelectableCard.style = selectableCardCss;
4625
4619
 
4626
- const singlePaymentMethodCss = ".single-payment-method{display:flex;align-items:center;justify-content:space-between;gap:16px;height:40px;width:100%;border-radius:8px;background-color:var(--rebill-color-background-right);padding:2px 4px 2px 4px;box-sizing:border-box}.payment-method{display:flex;align-items:center;gap:8px}.icon-container{height:32px;display:flex;align-items:center;gap:8px;justify-content:center;flex-shrink:0}.icon-container rebill-icon{width:32px;height:32px;display:flex;align-items:center;justify-content:center}";
4620
+ const singlePaymentMethodCss = ".single-payment-method{display:flex;align-items:center;justify-content:space-between;gap:16px;height:40px;width:100%;border-radius:8px;background-color:var(--rebill-color-background-right);padding:2px 4px 2px 4px;box-sizing:border-box}.payment-method{display:flex;align-items:center;gap:8px;height:100%}.icon-container{height:32px;display:flex;align-items:center;gap:8px;justify-content:center;flex-shrink:0}.icon-container rebill-icon{width:32px;height:32px;display:flex;align-items:center;justify-content:center}.payment-method rebill-icon{width:32px;height:32px;display:flex;align-items:center;justify-content:center;flex-shrink:0}";
4627
4621
 
4628
4622
  const SinglePaymentMethod = class {
4629
4623
  constructor(hostRef) {