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.
- package/dist/cjs/apm-checkout_17.cjs.entry.js +2 -8
- package/dist/collection/components/checkout/payment-method-selector/payment-method-selector.js +1 -7
- package/dist/collection/components/checkout/payment-method-selector/payment-method-selector.js.map +1 -1
- package/dist/collection/components/shared/singlePaymentMethod/single-payment-method.css +10 -0
- package/dist/components/{p-B9x9YyVr.js → p-CmO_OY_q.js} +3 -3
- package/dist/components/p-CmO_OY_q.js.map +1 -0
- package/dist/components/{p-D2C4_4Yi.js → p-PhkxIk-l.js} +4 -10
- package/dist/components/p-PhkxIk-l.js.map +1 -0
- package/dist/components/payment-method-selector.js +1 -1
- package/dist/components/rebill-checkout.js +2 -2
- package/dist/components/rebill-renewal.js +2 -2
- package/dist/components/single-payment-method.js +1 -1
- package/dist/esm/apm-checkout_17.entry.js +2 -8
- package/dist/rebill-web-components-sdk/p-4acabaf2.entry.js +2 -0
- package/dist/rebill-web-components-sdk/p-4acabaf2.entry.js.map +1 -0
- package/dist/rebill-web-components-sdk/rebill-web-components-sdk.esm.js +1 -1
- package/package.json +1 -1
- package/dist/components/p-B9x9YyVr.js.map +0 -1
- package/dist/components/p-D2C4_4Yi.js.map +0 -1
- package/dist/rebill-web-components-sdk/p-d98caaec.entry.js +0 -2
- package/dist/rebill-web-components-sdk/p-d98caaec.entry.js.map +0 -1
|
@@ -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
|
-
|
|
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) {
|
package/dist/collection/components/checkout/payment-method-selector/payment-method-selector.js
CHANGED
|
@@ -41,13 +41,7 @@ export class PaymentMethodSelector {
|
|
|
41
41
|
}
|
|
42
42
|
getPaymentMethodConfig(method) {
|
|
43
43
|
const countryPaymentMethods = this.country ? getCountryPaymentMethods(this.country) : null;
|
|
44
|
-
|
|
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]: {
|
package/dist/collection/components/checkout/payment-method-selector/payment-method-selector.js.map
CHANGED
|
@@ -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-
|
|
56
|
+
//# sourceMappingURL=p-CmO_OY_q.js.map
|
|
57
57
|
|
|
58
|
-
//# sourceMappingURL=p-
|
|
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-
|
|
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
|
-
|
|
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-
|
|
245
|
+
//# sourceMappingURL=p-PhkxIk-l.js.map
|
|
252
246
|
|
|
253
|
-
//# sourceMappingURL=p-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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-
|
|
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
|
-
|
|
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) {
|