rebill-web-components-sdk 1.8.11 → 1.8.13
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/assets/icons/etpay.svg +1 -1
- package/dist/assets/icons/etpay.svg +1 -1
- package/dist/cjs/apm-checkout_19.cjs.entry.js +3 -3
- package/dist/collection/assets/icons/etpay.svg +1 -1
- package/dist/collection/components/checkout/payment-method-selector/payment-method-selector.js +2 -2
- package/dist/collection/components/checkout/payment-method-selector/payment-method-selector.js.map +1 -1
- package/dist/collection/components/shared/singlePaymentMethod/singlePaymentMethod.js +1 -1
- package/dist/collection/components/shared/singlePaymentMethod/singlePaymentMethod.js.map +1 -1
- package/dist/components/{p-C46Y_yrU.js → p-Bp-N_G2i.js} +3 -3
- package/dist/components/p-Bp-N_G2i.js.map +1 -0
- package/dist/components/{p-CxevLjFD.js → p-DioD4ps1.js} +5 -5
- package/dist/components/p-DioD4ps1.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_19.entry.js +3 -3
- package/dist/rebill-web-components-sdk/assets/icons/etpay.svg +1 -1
- package/dist/rebill-web-components-sdk/p-a3ad56d1.entry.js +2 -0
- package/dist/rebill-web-components-sdk/p-a3ad56d1.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-C46Y_yrU.js.map +0 -1
- package/dist/components/p-CxevLjFD.js.map +0 -1
- package/dist/rebill-web-components-sdk/p-d99d4450.entry.js +0 -2
- package/dist/rebill-web-components-sdk/p-d99d4450.entry.js.map +0 -1
package/assets/icons/etpay.svg
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
<svg width="
|
|
1
|
+
<svg width="60" height="20" viewBox="0 0 1153 296" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
2
|
<g clip-path="url(#clip0_48_28)">
|
|
3
3
|
<path d="M521.591 155.607H399.747C402.09 188.403 416.149 201.242 446.751 201.242C469.573 201.242 479.438 195.497 486.936 175.889L518.264 187.38C506.689 215.779 479.789 229.247 446.399 229.247C396.677 229.247 364.389 196.125 364.389 145.071C364.389 94.0162 397.779 60.2202 444.783 60.2202C490.404 60.2202 522.107 91.667 522.107 141.349C521.943 146.466 521.943 149.188 521.591 155.607ZM400.028 130.254H487.194C485.835 99.1565 473.135 87.3175 445.017 87.3175C417.719 87.3175 403.074 100.831 400.028 130.254Z" fill="#140F33"/>
|
|
4
4
|
<path d="M589.707 94.41V195.147H634.227V225.919H600.275C573.024 225.919 554.982 208.009 554.982 180.959V94.41H520.584V63.661H554.982V13.9556H589.707V63.661H639.429V94.41H589.707Z" fill="#140F33"/>
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
<svg width="
|
|
1
|
+
<svg width="60" height="20" viewBox="0 0 1153 296" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
2
|
<g clip-path="url(#clip0_48_28)">
|
|
3
3
|
<path d="M521.591 155.607H399.747C402.09 188.403 416.149 201.242 446.751 201.242C469.573 201.242 479.438 195.497 486.936 175.889L518.264 187.38C506.689 215.779 479.789 229.247 446.399 229.247C396.677 229.247 364.389 196.125 364.389 145.071C364.389 94.0162 397.779 60.2202 444.783 60.2202C490.404 60.2202 522.107 91.667 522.107 141.349C521.943 146.466 521.943 149.188 521.591 155.607ZM400.028 130.254H487.194C485.835 99.1565 473.135 87.3175 445.017 87.3175C417.719 87.3175 403.074 100.831 400.028 130.254Z" fill="#140F33"/>
|
|
4
4
|
<path d="M589.707 94.41V195.147H634.227V225.919H600.275C573.024 225.919 554.982 208.009 554.982 180.959V94.41H520.584V63.661H554.982V13.9556H589.707V63.661H639.429V94.41H589.707Z" fill="#140F33"/>
|
|
@@ -650,8 +650,8 @@ const PaymentMethodSelector = class {
|
|
|
650
650
|
})(), this.enabledPaymentMethods.length > 1 &&
|
|
651
651
|
this.enabledPaymentMethods.map(paymentMethod => {
|
|
652
652
|
const config = this.getPaymentMethodConfig(paymentMethod);
|
|
653
|
-
return (index$1.h("selectable-card", { style: { flex: '1 1 0' }, selected: this.selectedPaymentMethod === paymentMethod, "card-key": config.key, label: config.label, disabled: this.disabled }, index$1.h("span", { slot: "icon" }, index$1.h("div", { style: { display: 'flex', alignItems: 'center', gap: '8px' } }, config.icons.map(iconName => {
|
|
654
|
-
return (index$1.h("rebill-icon", { name: iconName,
|
|
653
|
+
return (index$1.h("selectable-card", { style: { flex: '1 1 0' }, selected: this.selectedPaymentMethod === paymentMethod, "card-key": config.key, label: config.label, disabled: this.disabled }, index$1.h("span", { slot: "icon" }, index$1.h("div", { style: { display: 'flex', alignItems: 'center', gap: '8px', height: '24px' } }, config.icons.map(iconName => {
|
|
654
|
+
return (index$1.h("rebill-icon", { name: iconName, color: this.disabled && paymentMethod === i18n_service.PAYMENT_METHOD_ENUM.CARD
|
|
655
655
|
? colorClassMapper.COLORS_ENUM.NEUTRALS_500
|
|
656
656
|
: 'currentColor' }));
|
|
657
657
|
})))));
|
|
@@ -4739,7 +4739,7 @@ const SinglePaymentMethod = class {
|
|
|
4739
4739
|
paymentMethodDetails;
|
|
4740
4740
|
icons = [];
|
|
4741
4741
|
render() {
|
|
4742
|
-
return (index$1.h("div", { key: '1b67f3ad6f8c124d38702bb02310b389856cba33', class: "single-payment-method" }, index$1.h("div", { key: '67fd4d2d50e6d9105a7ee68f45fbc2471fed0508', class: "payment-method" }, this.paymentMethod === i18n_service.PAYMENT_METHOD_ENUM.CARD && index$1.h("rebill-icon", { key: '241a57e9c0ac45ea1d95d0267ec094b4d62ffaad', name: "card" }), this.paymentMethod === i18n_service.PAYMENT_METHOD_ENUM.BANK_TRANSFER && index$1.h("rebill-icon", { key: '24565cd588fb71671535f6cd6a5d9c4083e4817d', name: "bank" }), index$1.h("rebill-typography", { key: '
|
|
4742
|
+
return (index$1.h("div", { key: '1b67f3ad6f8c124d38702bb02310b389856cba33', class: "single-payment-method" }, index$1.h("div", { key: '67fd4d2d50e6d9105a7ee68f45fbc2471fed0508', class: "payment-method" }, this.paymentMethod === i18n_service.PAYMENT_METHOD_ENUM.CARD && index$1.h("rebill-icon", { key: '241a57e9c0ac45ea1d95d0267ec094b4d62ffaad', name: "card" }), this.paymentMethod === i18n_service.PAYMENT_METHOD_ENUM.BANK_TRANSFER && index$1.h("rebill-icon", { key: '24565cd588fb71671535f6cd6a5d9c4083e4817d', name: "bank" }), index$1.h("rebill-typography", { key: '5376b30092e68b43ce714f1b5cc39696784299fc', variant: "body2-small", color: colorClassMapper.COLORS_ENUM.NEUTRALS_700, style: { display: 'flex', alignItems: 'center' } }, i18n_service.I18nService.translate(`paymentMethods.${this.paymentMethod === i18n_service.PAYMENT_METHOD_ENUM.CARD ? 'cardDescription' : this.paymentMethod}`))), this.paymentMethod === i18n_service.PAYMENT_METHOD_ENUM.BANK_TRANSFER && (index$1.h("div", { key: '255168b75a2d349c92b204adfeac42645eb26636', class: "icon-container" }, this.icons.length > 0 ? (this.icons.map(iconName => index$1.h("rebill-icon", { name: iconName, key: iconName }))) : (index$1.h("rebill-icon", { name: "card" }))))));
|
|
4743
4743
|
}
|
|
4744
4744
|
};
|
|
4745
4745
|
SinglePaymentMethod.style = singlePaymentMethodCss;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
<svg width="
|
|
1
|
+
<svg width="60" height="20" viewBox="0 0 1153 296" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
2
|
<g clip-path="url(#clip0_48_28)">
|
|
3
3
|
<path d="M521.591 155.607H399.747C402.09 188.403 416.149 201.242 446.751 201.242C469.573 201.242 479.438 195.497 486.936 175.889L518.264 187.38C506.689 215.779 479.789 229.247 446.399 229.247C396.677 229.247 364.389 196.125 364.389 145.071C364.389 94.0162 397.779 60.2202 444.783 60.2202C490.404 60.2202 522.107 91.667 522.107 141.349C521.943 146.466 521.943 149.188 521.591 155.607ZM400.028 130.254H487.194C485.835 99.1565 473.135 87.3175 445.017 87.3175C417.719 87.3175 403.074 100.831 400.028 130.254Z" fill="#140F33"/>
|
|
4
4
|
<path d="M589.707 94.41V195.147H634.227V225.919H600.275C573.024 225.919 554.982 208.009 554.982 180.959V94.41H520.584V63.661H554.982V13.9556H589.707V63.661H639.429V94.41H589.707Z" fill="#140F33"/>
|
package/dist/collection/components/checkout/payment-method-selector/payment-method-selector.js
CHANGED
|
@@ -109,8 +109,8 @@ export class PaymentMethodSelector {
|
|
|
109
109
|
})(), this.enabledPaymentMethods.length > 1 &&
|
|
110
110
|
this.enabledPaymentMethods.map(paymentMethod => {
|
|
111
111
|
const config = this.getPaymentMethodConfig(paymentMethod);
|
|
112
|
-
return (h("selectable-card", { style: { flex: '1 1 0' }, selected: this.selectedPaymentMethod === paymentMethod, "card-key": config.key, label: config.label, disabled: this.disabled }, h("span", { slot: "icon" }, h("div", { style: { display: 'flex', alignItems: 'center', gap: '8px' } }, config.icons.map(iconName => {
|
|
113
|
-
return (h("rebill-icon", { name: iconName,
|
|
112
|
+
return (h("selectable-card", { style: { flex: '1 1 0' }, selected: this.selectedPaymentMethod === paymentMethod, "card-key": config.key, label: config.label, disabled: this.disabled }, h("span", { slot: "icon" }, h("div", { style: { display: 'flex', alignItems: 'center', gap: '8px', height: '24px' } }, config.icons.map(iconName => {
|
|
113
|
+
return (h("rebill-icon", { name: iconName, color: this.disabled && paymentMethod === PAYMENT_METHOD_ENUM.CARD
|
|
114
114
|
? COLORS_ENUM.NEUTRALS_500
|
|
115
115
|
: 'currentColor' }));
|
|
116
116
|
})))));
|
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 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: ['doblecard'],\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 size=\"24px\"\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 disabled={this.disabled}\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: ['doblecard'],\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\n style={{ display: 'flex', alignItems: 'center', gap: '8px', height: '24px' }}\n >\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 disabled={this.disabled}\n />\n </div>\n )}\n </div>\n );\n }\n}\n"]}
|
|
@@ -8,7 +8,7 @@ export class SinglePaymentMethod {
|
|
|
8
8
|
paymentMethodDetails;
|
|
9
9
|
icons = [];
|
|
10
10
|
render() {
|
|
11
|
-
return (h("div", { key: '1b67f3ad6f8c124d38702bb02310b389856cba33', class: "single-payment-method" }, h("div", { key: '67fd4d2d50e6d9105a7ee68f45fbc2471fed0508', class: "payment-method" }, this.paymentMethod === PAYMENT_METHOD_ENUM.CARD && h("rebill-icon", { key: '241a57e9c0ac45ea1d95d0267ec094b4d62ffaad', name: "card" }), this.paymentMethod === PAYMENT_METHOD_ENUM.BANK_TRANSFER && h("rebill-icon", { key: '24565cd588fb71671535f6cd6a5d9c4083e4817d', name: "bank" }), h("rebill-typography", { key: '
|
|
11
|
+
return (h("div", { key: '1b67f3ad6f8c124d38702bb02310b389856cba33', class: "single-payment-method" }, h("div", { key: '67fd4d2d50e6d9105a7ee68f45fbc2471fed0508', class: "payment-method" }, this.paymentMethod === PAYMENT_METHOD_ENUM.CARD && h("rebill-icon", { key: '241a57e9c0ac45ea1d95d0267ec094b4d62ffaad', name: "card" }), this.paymentMethod === PAYMENT_METHOD_ENUM.BANK_TRANSFER && h("rebill-icon", { key: '24565cd588fb71671535f6cd6a5d9c4083e4817d', name: "bank" }), h("rebill-typography", { key: '5376b30092e68b43ce714f1b5cc39696784299fc', variant: "body2-small", color: COLORS_ENUM.NEUTRALS_700, style: { display: 'flex', alignItems: 'center' } }, I18nService.translate(`paymentMethods.${this.paymentMethod === PAYMENT_METHOD_ENUM.CARD ? 'cardDescription' : this.paymentMethod}`))), this.paymentMethod === PAYMENT_METHOD_ENUM.BANK_TRANSFER && (h("div", { key: '255168b75a2d349c92b204adfeac42645eb26636', class: "icon-container" }, this.icons.length > 0 ? (this.icons.map(iconName => h("rebill-icon", { name: iconName, key: iconName }))) : (h("rebill-icon", { name: "card" }))))));
|
|
12
12
|
}
|
|
13
13
|
static get is() { return "single-payment-method"; }
|
|
14
14
|
static get originalStyleUrls() {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"singlePaymentMethod.js","sourceRoot":"","sources":["../../../../src/components/shared/singlePaymentMethod/singlePaymentMethod.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AACzD,OAAO,EAAE,mBAAmB,EAAE,MAAM,4CAA4C,CAAC;AAEjF,OAAO,EAAE,WAAW,EAAE,MAAM,mCAAmC,CAAC;AAOhE,MAAM,OAAO,mBAAmB;IACtB,aAAa,CAAsB;IACnC,eAAe,CAAS;IACxB,oBAAoB,CAAyB;IAC7C,KAAK,GAAa,EAAE,CAAC;IAC7B,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EAAC,uBAAuB;YAChC,4DAAK,KAAK,EAAC,gBAAgB;gBACxB,IAAI,CAAC,aAAa,KAAK,mBAAmB,CAAC,IAAI,IAAI,oEAAa,IAAI,EAAC,MAAM,GAAG;gBAC9E,IAAI,CAAC,aAAa,KAAK,mBAAmB,CAAC,aAAa,IAAI,oEAAa,IAAI,EAAC,MAAM,GAAG;gBACxF,
|
|
1
|
+
{"version":3,"file":"singlePaymentMethod.js","sourceRoot":"","sources":["../../../../src/components/shared/singlePaymentMethod/singlePaymentMethod.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AACnD,OAAO,EAAE,WAAW,EAAE,MAAM,4BAA4B,CAAC;AACzD,OAAO,EAAE,mBAAmB,EAAE,MAAM,4CAA4C,CAAC;AAEjF,OAAO,EAAE,WAAW,EAAE,MAAM,mCAAmC,CAAC;AAOhE,MAAM,OAAO,mBAAmB;IACtB,aAAa,CAAsB;IACnC,eAAe,CAAS;IACxB,oBAAoB,CAAyB;IAC7C,KAAK,GAAa,EAAE,CAAC;IAC7B,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EAAC,uBAAuB;YAChC,4DAAK,KAAK,EAAC,gBAAgB;gBACxB,IAAI,CAAC,aAAa,KAAK,mBAAmB,CAAC,IAAI,IAAI,oEAAa,IAAI,EAAC,MAAM,GAAG;gBAC9E,IAAI,CAAC,aAAa,KAAK,mBAAmB,CAAC,aAAa,IAAI,oEAAa,IAAI,EAAC,MAAM,GAAG;gBACxF,0EACE,OAAO,EAAC,aAAa,EACrB,KAAK,EAAE,WAAW,CAAC,YAAY,EAC/B,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,IAE/C,WAAW,CAAC,SAAS,CACpB,kBAAkB,IAAI,CAAC,aAAa,KAAK,mBAAmB,CAAC,IAAI,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,IAAI,CAAC,aAAa,EAAE,CAC7G,CACiB,CAChB;YAEL,IAAI,CAAC,aAAa,KAAK,mBAAmB,CAAC,aAAa,IAAI,CAC3D,4DAAK,KAAK,EAAC,gBAAgB,IACxB,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,CACvB,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,QAAQ,CAAC,EAAE,CAAC,mBAAa,IAAI,EAAE,QAAQ,EAAE,GAAG,EAAE,QAAQ,GAAI,CAAC,CAC3E,CAAC,CAAC,CAAC,CACF,mBAAa,IAAI,EAAC,MAAM,GAAG,CAC5B,CACG,CACP,CACG,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["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\n variant=\"body2-small\"\n color={COLORS_ENUM.NEUTRALS_700}\n style={{ display: 'flex', alignItems: 'center' }}\n >\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"]}
|
|
@@ -18,7 +18,7 @@ const SinglePaymentMethod = /*@__PURE__*/ proxyCustomElement(class SinglePayment
|
|
|
18
18
|
paymentMethodDetails;
|
|
19
19
|
icons = [];
|
|
20
20
|
render() {
|
|
21
|
-
return (h("div", { key: '1b67f3ad6f8c124d38702bb02310b389856cba33', class: "single-payment-method" }, h("div", { key: '67fd4d2d50e6d9105a7ee68f45fbc2471fed0508', class: "payment-method" }, this.paymentMethod === PAYMENT_METHOD_ENUM.CARD && h("rebill-icon", { key: '241a57e9c0ac45ea1d95d0267ec094b4d62ffaad', name: "card" }), this.paymentMethod === PAYMENT_METHOD_ENUM.BANK_TRANSFER && h("rebill-icon", { key: '24565cd588fb71671535f6cd6a5d9c4083e4817d', name: "bank" }), h("rebill-typography", { key: '
|
|
21
|
+
return (h("div", { key: '1b67f3ad6f8c124d38702bb02310b389856cba33', class: "single-payment-method" }, h("div", { key: '67fd4d2d50e6d9105a7ee68f45fbc2471fed0508', class: "payment-method" }, this.paymentMethod === PAYMENT_METHOD_ENUM.CARD && h("rebill-icon", { key: '241a57e9c0ac45ea1d95d0267ec094b4d62ffaad', name: "card" }), this.paymentMethod === PAYMENT_METHOD_ENUM.BANK_TRANSFER && h("rebill-icon", { key: '24565cd588fb71671535f6cd6a5d9c4083e4817d', name: "bank" }), h("rebill-typography", { key: '5376b30092e68b43ce714f1b5cc39696784299fc', variant: "body2-small", color: COLORS_ENUM.NEUTRALS_700, style: { display: 'flex', alignItems: 'center' } }, I18nService.translate(`paymentMethods.${this.paymentMethod === PAYMENT_METHOD_ENUM.CARD ? 'cardDescription' : this.paymentMethod}`))), this.paymentMethod === PAYMENT_METHOD_ENUM.BANK_TRANSFER && (h("div", { key: '255168b75a2d349c92b204adfeac42645eb26636', class: "icon-container" }, this.icons.length > 0 ? (this.icons.map(iconName => h("rebill-icon", { name: iconName, key: iconName }))) : (h("rebill-icon", { name: "card" }))))));
|
|
22
22
|
}
|
|
23
23
|
static get style() { return singlePaymentMethodCss; }
|
|
24
24
|
}, [256, "single-payment-method", {
|
|
@@ -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-Bp-N_G2i.js.map
|
|
57
57
|
|
|
58
|
-
//# sourceMappingURL=p-
|
|
58
|
+
//# sourceMappingURL=p-Bp-N_G2i.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"p-Bp-N_G2i.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,CACE,CAAA,mBAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,OAAO,EAAC,aAAa,EACrB,KAAK,EAAE,WAAW,CAAC,YAAY,EAC/B,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,EAE/C,EAAA,WAAW,CAAC,SAAS,CACpB,CAAA,eAAA,EAAkB,IAAI,CAAC,aAAa,KAAK,mBAAmB,CAAC,IAAI,GAAG,iBAAiB,GAAG,IAAI,CAAC,aAAa,CAAE,CAAA,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 height: 32px;\n width: auto;\n display: flex;\n align-items: center;\n justify-content: center;\n}\n\n.payment-method rebill-icon {\n height: 32px;\n width: auto;\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\n variant=\"body2-small\"\n color={COLORS_ENUM.NEUTRALS_700}\n style={{ display: 'flex', alignItems: 'center' }}\n >\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-CRss3Wug.js';
|
|
|
14
14
|
import { d as defineCustomElement$4 } from './p-CW7bdfSw.js';
|
|
15
15
|
import { d as defineCustomElement$3 } from './p-C_txMekS.js';
|
|
16
16
|
import { d as defineCustomElement$2 } from './p-xpOb67FC.js';
|
|
17
|
-
import { d as defineCustomElement$1 } from './p-
|
|
17
|
+
import { d as defineCustomElement$1 } from './p-Bp-N_G2i.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
|
|
|
@@ -128,8 +128,8 @@ const PaymentMethodSelector = /*@__PURE__*/ proxyCustomElement(class PaymentMeth
|
|
|
128
128
|
})(), this.enabledPaymentMethods.length > 1 &&
|
|
129
129
|
this.enabledPaymentMethods.map(paymentMethod => {
|
|
130
130
|
const config = this.getPaymentMethodConfig(paymentMethod);
|
|
131
|
-
return (h("selectable-card", { style: { flex: '1 1 0' }, selected: this.selectedPaymentMethod === paymentMethod, "card-key": config.key, label: config.label, disabled: this.disabled }, h("span", { slot: "icon" }, h("div", { style: { display: 'flex', alignItems: 'center', gap: '8px' } }, config.icons.map(iconName => {
|
|
132
|
-
return (h("rebill-icon", { name: iconName,
|
|
131
|
+
return (h("selectable-card", { style: { flex: '1 1 0' }, selected: this.selectedPaymentMethod === paymentMethod, "card-key": config.key, label: config.label, disabled: this.disabled }, h("span", { slot: "icon" }, h("div", { style: { display: 'flex', alignItems: 'center', gap: '8px', height: '24px' } }, config.icons.map(iconName => {
|
|
132
|
+
return (h("rebill-icon", { name: iconName, color: this.disabled && paymentMethod === PAYMENT_METHOD_ENUM.CARD
|
|
133
133
|
? COLORS_ENUM.NEUTRALS_500
|
|
134
134
|
: 'currentColor' }));
|
|
135
135
|
})))));
|
|
@@ -242,6 +242,6 @@ function defineCustomElement() {
|
|
|
242
242
|
defineCustomElement();
|
|
243
243
|
|
|
244
244
|
export { PaymentMethodSelector as P, defineCustomElement as d };
|
|
245
|
-
//# sourceMappingURL=p-
|
|
245
|
+
//# sourceMappingURL=p-DioD4ps1.js.map
|
|
246
246
|
|
|
247
|
-
//# sourceMappingURL=p-
|
|
247
|
+
//# sourceMappingURL=p-DioD4ps1.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"p-DioD4ps1.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: ['doblecard'],\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\n style={{ display: 'flex', alignItems: 'center', gap: '8px', height: '24px' }}\n >\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 disabled={this.disabled}\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-DioD4ps1.js';
|
|
2
2
|
|
|
3
3
|
const PaymentMethodSelector = PaymentMethodSelector$1;
|
|
4
4
|
const defineCustomElement = defineCustomElement$1;
|
|
@@ -22,7 +22,7 @@ import { d as defineCustomElement$I } from './p-CRM3annx.js';
|
|
|
22
22
|
import { d as defineCustomElement$H } from './p-DaWrWvmM.js';
|
|
23
23
|
import { d as defineCustomElement$G } from './p-B4UufS5i.js';
|
|
24
24
|
import { d as defineCustomElement$E } from './p-g4Upvkup.js';
|
|
25
|
-
import { d as defineCustomElement$C } from './p-
|
|
25
|
+
import { d as defineCustomElement$C } from './p-DioD4ps1.js';
|
|
26
26
|
import { d as defineCustomElement$B } from './p-Cas__-EW.js';
|
|
27
27
|
import { d as defineCustomElement$A } from './p-CQkIjsYc.js';
|
|
28
28
|
import { d as defineCustomElement$z } from './p-Dq507-5G.js';
|
|
@@ -50,7 +50,7 @@ import { d as defineCustomElement$a } from './p-C_txMekS.js';
|
|
|
50
50
|
import { d as defineCustomElement$9 } from './p-DTk6aYAr.js';
|
|
51
51
|
import { d as defineCustomElement$8 } from './p-D2QunLfP.js';
|
|
52
52
|
import { d as defineCustomElement$7 } from './p-xpOb67FC.js';
|
|
53
|
-
import { d as defineCustomElement$6 } from './p-
|
|
53
|
+
import { d as defineCustomElement$6 } from './p-Bp-N_G2i.js';
|
|
54
54
|
import { d as defineCustomElement$5 } from './p-BIat5a1z.js';
|
|
55
55
|
import { d as defineCustomElement$4 } from './p-CXdtDEge.js';
|
|
56
56
|
import { d as defineCustomElement$3 } from './p-Ckay0XNX.js';
|
|
@@ -18,7 +18,7 @@ import { d as defineCustomElement$y } from './p-C1PdnVhw.js';
|
|
|
18
18
|
import { d as defineCustomElement$x } from './p-CRM3annx.js';
|
|
19
19
|
import { d as defineCustomElement$w } from './p-DPNVk29S.js';
|
|
20
20
|
import { d as defineCustomElement$v } from './p-D664TKNk.js';
|
|
21
|
-
import { d as defineCustomElement$u } from './p-
|
|
21
|
+
import { d as defineCustomElement$u } from './p-DioD4ps1.js';
|
|
22
22
|
import { d as defineCustomElement$t } from './p-Cas__-EW.js';
|
|
23
23
|
import { d as defineCustomElement$s } from './p-CQkIjsYc.js';
|
|
24
24
|
import { d as defineCustomElement$r } from './p-Dq507-5G.js';
|
|
@@ -42,7 +42,7 @@ import { d as defineCustomElement$8 } from './p-D2QunLfP.js';
|
|
|
42
42
|
import { d as defineCustomElement$7 } from './p-CSqJ7ePk.js';
|
|
43
43
|
import { d as defineCustomElement$6 } from './p-_JK6tf3L.js';
|
|
44
44
|
import { d as defineCustomElement$5 } from './p-xpOb67FC.js';
|
|
45
|
-
import { d as defineCustomElement$4 } from './p-
|
|
45
|
+
import { d as defineCustomElement$4 } from './p-Bp-N_G2i.js';
|
|
46
46
|
import { d as defineCustomElement$3 } from './p-Ckay0XNX.js';
|
|
47
47
|
import { d as defineCustomElement$2 } from './p-CYUYlOu3.js';
|
|
48
48
|
|
|
@@ -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-Bp-N_G2i.js';
|
|
2
2
|
|
|
3
3
|
const SinglePaymentMethod = SinglePaymentMethod$1;
|
|
4
4
|
const defineCustomElement = defineCustomElement$1;
|
|
@@ -648,8 +648,8 @@ const PaymentMethodSelector = class {
|
|
|
648
648
|
})(), this.enabledPaymentMethods.length > 1 &&
|
|
649
649
|
this.enabledPaymentMethods.map(paymentMethod => {
|
|
650
650
|
const config = this.getPaymentMethodConfig(paymentMethod);
|
|
651
|
-
return (h("selectable-card", { style: { flex: '1 1 0' }, selected: this.selectedPaymentMethod === paymentMethod, "card-key": config.key, label: config.label, disabled: this.disabled }, h("span", { slot: "icon" }, h("div", { style: { display: 'flex', alignItems: 'center', gap: '8px' } }, config.icons.map(iconName => {
|
|
652
|
-
return (h("rebill-icon", { name: iconName,
|
|
651
|
+
return (h("selectable-card", { style: { flex: '1 1 0' }, selected: this.selectedPaymentMethod === paymentMethod, "card-key": config.key, label: config.label, disabled: this.disabled }, h("span", { slot: "icon" }, h("div", { style: { display: 'flex', alignItems: 'center', gap: '8px', height: '24px' } }, config.icons.map(iconName => {
|
|
652
|
+
return (h("rebill-icon", { name: iconName, color: this.disabled && paymentMethod === PAYMENT_METHOD_ENUM.CARD
|
|
653
653
|
? COLORS_ENUM.NEUTRALS_500
|
|
654
654
|
: 'currentColor' }));
|
|
655
655
|
})))));
|
|
@@ -4737,7 +4737,7 @@ const SinglePaymentMethod = class {
|
|
|
4737
4737
|
paymentMethodDetails;
|
|
4738
4738
|
icons = [];
|
|
4739
4739
|
render() {
|
|
4740
|
-
return (h("div", { key: '1b67f3ad6f8c124d38702bb02310b389856cba33', class: "single-payment-method" }, h("div", { key: '67fd4d2d50e6d9105a7ee68f45fbc2471fed0508', class: "payment-method" }, this.paymentMethod === PAYMENT_METHOD_ENUM.CARD && h("rebill-icon", { key: '241a57e9c0ac45ea1d95d0267ec094b4d62ffaad', name: "card" }), this.paymentMethod === PAYMENT_METHOD_ENUM.BANK_TRANSFER && h("rebill-icon", { key: '24565cd588fb71671535f6cd6a5d9c4083e4817d', name: "bank" }), h("rebill-typography", { key: '
|
|
4740
|
+
return (h("div", { key: '1b67f3ad6f8c124d38702bb02310b389856cba33', class: "single-payment-method" }, h("div", { key: '67fd4d2d50e6d9105a7ee68f45fbc2471fed0508', class: "payment-method" }, this.paymentMethod === PAYMENT_METHOD_ENUM.CARD && h("rebill-icon", { key: '241a57e9c0ac45ea1d95d0267ec094b4d62ffaad', name: "card" }), this.paymentMethod === PAYMENT_METHOD_ENUM.BANK_TRANSFER && h("rebill-icon", { key: '24565cd588fb71671535f6cd6a5d9c4083e4817d', name: "bank" }), h("rebill-typography", { key: '5376b30092e68b43ce714f1b5cc39696784299fc', variant: "body2-small", color: COLORS_ENUM.NEUTRALS_700, style: { display: 'flex', alignItems: 'center' } }, I18nService.translate(`paymentMethods.${this.paymentMethod === PAYMENT_METHOD_ENUM.CARD ? 'cardDescription' : this.paymentMethod}`))), this.paymentMethod === PAYMENT_METHOD_ENUM.BANK_TRANSFER && (h("div", { key: '255168b75a2d349c92b204adfeac42645eb26636', class: "icon-container" }, this.icons.length > 0 ? (this.icons.map(iconName => h("rebill-icon", { name: iconName, key: iconName }))) : (h("rebill-icon", { name: "card" }))))));
|
|
4741
4741
|
}
|
|
4742
4742
|
};
|
|
4743
4743
|
SinglePaymentMethod.style = singlePaymentMethodCss;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
<svg width="
|
|
1
|
+
<svg width="60" height="20" viewBox="0 0 1153 296" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
2
|
<g clip-path="url(#clip0_48_28)">
|
|
3
3
|
<path d="M521.591 155.607H399.747C402.09 188.403 416.149 201.242 446.751 201.242C469.573 201.242 479.438 195.497 486.936 175.889L518.264 187.38C506.689 215.779 479.789 229.247 446.399 229.247C396.677 229.247 364.389 196.125 364.389 145.071C364.389 94.0162 397.779 60.2202 444.783 60.2202C490.404 60.2202 522.107 91.667 522.107 141.349C521.943 146.466 521.943 149.188 521.591 155.607ZM400.028 130.254H487.194C485.835 99.1565 473.135 87.3175 445.017 87.3175C417.719 87.3175 403.074 100.831 400.028 130.254Z" fill="#140F33"/>
|
|
4
4
|
<path d="M589.707 94.41V195.147H634.227V225.919H600.275C573.024 225.919 554.982 208.009 554.982 180.959V94.41H520.584V63.661H554.982V13.9556H589.707V63.661H639.429V94.41H589.707Z" fill="#140F33"/>
|