UNPKG

@malga-checkout/core

Version:
39 lines (33 loc) 6.41 kB
'use strict'; Object.defineProperty(exports, '__esModule', { value: true }); const index = require('./index-ebe81290.js'); const i18n_es = require('./i18n.es-2b830471.js'); const payment = require('./payment-8a793522.js'); const settings = require('./settings-914617c5.js'); const savedCards = require('./saved-cards-368e2592.js'); const malgaPaymentsCss = "@import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap\"); :root{--malga-checkout-color-page-background:#eef2f6;--malga-checkout-color-brand-accent-light:#79DBD4;--malga-checkout-color-brand-accent-normal:#39BFAD;--malga-checkout-color-brand-clean:#C3F4EF;--malga-checkout-color-brand-light:#79DBD4;--malga-checkout-color-brand-normal:#39BFAD;--malga-checkout-color-brand-middle:#2FAC9B;--malga-checkout-color-brand-dark:#147F70;--malga-checkout-color-grey-light:#666666;--malga-checkout-color-grey-normal:#4D4D4D;--malga-checkout-color-grey-middle:#333333;--malga-checkout-color-grey-dark:#1A1A1A;--malga-checkout-color-grey-darkness:#000000;--malga-checkout-color-accent-light:#ffffff;--malga-checkout-color-accent-normal:#F1F1F1;--malga-checkout-color-accent-middle:#CBCBCB;--malga-checkout-color-warning-light:#FFF8E6;--malga-checkout-color-warning-normal:#F9DF8D;--malga-checkout-color-warning-middle:#FFA400;--malga-checkout-color-warning-dark:#ED3A3D;--malga-checkout-color-modal-success:#00AE42;--malga-checkout-color-modal-error:#ED3A3D;--malga-checkout-color-modal-neutral:#4D4D4D;--malga-checkout-color-disabled:#F9F9F9;--malga-checkout-color-modal-action-button-error:#000000;--malga-checkout-color-modal-action-button-error-hover:#333333;--malga-checkout-color-modal-action-button-success:#000000;--malga-checkout-color-modal-action-button-success-hover:#333333;--malga-checkout-color-modal-action-button-success-font-color:#ffffff;--malga-checkout-color-modal-action-button-error-font-color:#ffffff;--malga-checkout-typography-family:\"Inter\", sans-serif;--malga-checkout-spacing-xxs:4px;--malga-checkout-spacing-xs:8px;--malga-checkout-spacing-sm:16px;--malga-checkout-spacing-default:24px;--malga-checkout-spacing-md:32px;--malga-checkout-spacing-lg:48px;--malga-checkout-spacing-xlg:64px;--malga-checkout-spacing-xxlg:96px;--malga-checkout-size-min-width:250px;--malga-checkout-border-radius-default:4px;--malga-checkout-border-radius-md:6px;--malga-checkout-border-radius-lg:20px;--malga-checkout-transition-slow:0.3s;--malga-checkout-transition-default:0.5s}.malga-payments__container{display:flex;width:100%;margin-left:auto;margin-right:auto}.malga-payments__content{display:flex;flex-direction:column;width:100%}.malga-payments__content>checkout-radio-field{margin-bottom:calc( var(--malga-checkout-spacing-xxs) + var(--malga-checkout-spacing-xs) )}.malga-payments__content>malga-payments-boleto>checkout-manual-payment,.malga-payments__content>malga-payments-pix>checkout-manual-payment{margin-bottom:var(--malga-checkout-spacing-sm)}.malga-payments__content>malga-payments-boleto>checkout-manual-payment>checkout-typography,.malga-payments__content>malga-payments-pix>checkout-manual-payment>checkout-typography{padding:0px var(--malga-checkout-spacing-sm)}"; const MalgaPayments = class { constructor(hostRef) { index.registerInstance(this, hostRef); this.paymentFail = index.createEvent(this, "paymentFail", 7); this.paymentMethods = ['credit', 'pix', 'boleto', 'drip']; this.handlePaymentChange = (value) => { payment.state.selectedPaymentMethod = value; }; this.showCurrentPaymentMethod = (paymentMethod) => { const showPaymentMethod = this.paymentMethods.includes(paymentMethod); return showPaymentMethod; }; } renderCreditCardLabel() { if (savedCards.state.hasCards) { return i18n_es.Z('paymentMethods.card.newCardTitle', settings.state.locale); } return i18n_es.Z('paymentMethods.card.title', settings.state.locale); } render() { return (index.h(index.Host, { class: { 'malga-payments__container': true } }, index.h("section", { class: { 'malga-payments__content': true } }, this.showCurrentPaymentMethod('credit') && (index.h(index.Fragment, null, settings.state.transactionConfig.customerId && (index.h("malga-payments-credit-saved-cards", null)), index.h("checkout-radio-field", { fullWidth: true, label: this.renderCreditCardLabel(), value: "credit", isChecked: payment.state.selectedPaymentMethod === 'credit', onClicked: () => this.handlePaymentChange('credit') }), payment.state.selectedPaymentMethod === 'credit' && (index.h("malga-payments-credit", null)))), this.showCurrentPaymentMethod('boleto') && (index.h(index.Fragment, null, index.h("checkout-radio-field", { fullWidth: true, label: i18n_es.Z('paymentMethods.boleto.title', settings.state.locale), value: "boleto", isChecked: payment.state.selectedPaymentMethod === 'boleto', onClicked: () => this.handlePaymentChange('boleto') }), payment.state.selectedPaymentMethod === 'boleto' && (index.h("malga-payments-boleto", null)))), this.showCurrentPaymentMethod('pix') && (index.h(index.Fragment, null, index.h("checkout-radio-field", { fullWidth: true, label: i18n_es.Z('paymentMethods.pix.title', settings.state.locale), value: "pix", endIcon: "pix", isChecked: payment.state.selectedPaymentMethod === 'pix', onClicked: () => this.handlePaymentChange('pix') }), payment.state.selectedPaymentMethod === 'pix' && (index.h("malga-payments-pix", { onPixPaymentFailed: ({ detail: { error } }) => this.paymentFail.emit({ error }) })))), this.showCurrentPaymentMethod('nupay') && (index.h(index.Fragment, null, index.h("checkout-radio-field", { fullWidth: true, label: i18n_es.Z('paymentMethods.nupay.title', settings.state.locale), value: "nupay", endIcon: "nubank", isChecked: payment.state.selectedPaymentMethod === 'nupay', onClicked: () => this.handlePaymentChange('nupay') }), payment.state.selectedPaymentMethod === 'nupay' && (index.h("malga-payments-nupay", null)))), this.showCurrentPaymentMethod('drip') && (index.h(index.Fragment, null, index.h("checkout-radio-field", { fullWidth: true, label: i18n_es.Z('paymentMethods.drip.title', settings.state.locale), value: "drip", endIcon: "drip", isChecked: payment.state.selectedPaymentMethod === 'drip', onClicked: () => this.handlePaymentChange('drip') }), index.h("malga-payments-drip", null)))))); } }; MalgaPayments.style = malgaPaymentsCss; exports.malga_payments = MalgaPayments;