vk-payments 0.2.0 → 0.2.2

package/vk-payments.metadata.json

@@ -1 +1 @@
-{"__symbolic":"module","version":4,"metadata":{"VkPaymentsModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":14,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","name":"ɵe"},{"__symbolic":"reference","name":"ɵh"},{"__symbolic":"reference","name":"ɵj"}],"exports":[{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","name":"ɵe"},{"__symbolic":"reference","name":"ɵh"},{"__symbolic":"reference","name":"ɵj"}]}]}],"members":{}},"ɵa":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":13,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"ɵb"},{"__symbolic":"reference","name":"ɵd"}],"exports":[{"__symbolic":"reference","name":"ɵb"},{"__symbolic":"reference","name":"ɵd"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":17,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":18,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"ReactiveFormsModule","line":19,"character":4},{"__symbolic":"reference","module":"@angular/router","name":"RouterModule","line":20,"character":4}]}]}],"members":{}},"ɵb":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":11,"character":1},"arguments":[{"selector":"mp-form-pay","template":"<form (ngSubmit)=\"onSubmit(f)\" class=\"mp-payment\" #f=\"ngForm\" autocomplete=\"off\">\r\n  <!-- Titular -->\r\n  <div class=\"formRow\">\r\n    <label for=\"cardholderName\">Nombre y Apellido</label>\r\n    <span>\r\n      <input id=\"cardholderName\" type=\"text\" name=\"cardholderName\" required maxlength=\"22\"\r\n        data-checkout=\"cardholderName\" [disabled]=\"disabled\" (paste)=\"onPaste()\" (input)=\"onPayerNameChange()\"\r\n        [(ngModel)]=\"defaultName\" #cardholderName=\"ngModel\" />\r\n    </span>\r\n    <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!cardholderName.valid && submitted\">\r\n      Ingresá el nombre completo que figura en la tarjeta.\r\n    </p>\r\n  </div>\r\n\r\n  <!-- Numero de tarjeta -->\r\n  <div class=\"formRow\">\r\n    <label for=\"cardNumber\">Nº de Tarjeta</label>\r\n    <span>\r\n      <input id=\"cardNumber\" type=\"text\" name=\"cardNumber\" data-checkout=\"cardNumber\" maxlength=\"19\" required thumbnail\r\n        [disabled]=\"disabled\" (input)=\"onCardChange()\" (keyup)=\"checkPaymentMethod()\" \r\n        (paste)=\"onPaste()\" [(ngModel)]=\"cardText\" #cardNumber=\"ngModel\" />\r\n    </span>\r\n    <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!cardNumber.valid && submitted\">\r\n      Ingresá el número de tarjeta.\r\n    </p>\r\n  </div>\r\n\r\n  <!-- Emisor-->\r\n  <div class=\"formRow\">\r\n    <label for=\"issuer\">Emisor</label>\r\n    <div class=\"select-icon\">\r\n      <select id=\"issuer\" name=\"issuer\" required [disabled]=\"!requiredIssuer || disabled\" [(ngModel)]=\"issuerId\"\r\n        #issuer=\"ngModel\" (change)=\"checkInstallments(true)\">\r\n        <option *ngFor=\"let iss of currentIssuers\" value=\"{{ iss.id }}\">\r\n          {{ iss.name }}\r\n        </option>\r\n      </select>\r\n    </div>\r\n    <p class=\"alert-text\" *ngIf=\"!issuer.valid && requiredIssuer && submitted\">Seleccioná el emisor de la tarjeta.</p>\r\n  </div>\r\n\r\n  <div class=\"form-row-3col\">\r\n    <!-- Expiry-month-->\r\n    <div class=\"formRow\">\r\n      <label for=\"cardExpirationMonth\">Mes</label>\r\n      <span>\r\n        <input id=\"cardExpirationMonth\" type=\"text\" name=\"cardExpirationMonth\" placeholder=\"MM\" minlength=\"2\"\r\n          maxlength=\"2\" data-checkout=\"cardExpirationMonth\" required [disabled]=\"disabled\" (paste)=\"onPaste()\"\r\n          (input)=\"onMonthChange()\" (focusout)=\"onMonthLostFocus()\" [(ngModel)]=\"monthText\"\r\n          #cardExpirationMonth=\"ngModel\" />\r\n      </span>\r\n    </div>\r\n\r\n    <!-- Expiry-year-->\r\n    <div class=\"formRow\">\r\n      <label for=\"cardExpirationYear\">Año</label>\r\n      <span>\r\n        <input id=\"cardExpirationYear\" type=\"text\" name=\"cardExpirationYear\" placeholder=\"AAAA\" minlength=\"4\"\r\n          maxlength=\"4\" data-checkout=\"cardExpirationYear\" required [disabled]=\"disabled\" (paste)=\"onPaste()\"\r\n          (input)=\"onYearChange()\" [(ngModel)]=\"yearText\" #cardExpirationYear=\"ngModel\" />\r\n      </span>\r\n    </div>\r\n\r\n    <!-- CVC -->\r\n    <div class=\"formRow\">\r\n      <label for=\"securityCode\">CVC</label>\r\n      <span>\r\n        <input id=\"securityCode\" type=\"text\" name=\"securityCode\" placeholder=\"CVC\" minlength=\"3\" maxlength=\"4\"\r\n          data-checkout=\"securityCode\" required [disabled]=\"disabled\" (paste)=\"onPaste()\" (input)=\"onCodeChange()\"\r\n          [(ngModel)]=\"cvcText\" #securityCode=\"ngModel\" />\r\n      </span>\r\n    </div>\r\n  </div>\r\n  <div>\r\n    <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!cardExpirationMonth.valid && submitted\">\r\n      Completá el mes de vencimiento.\r\n    </p>\r\n    <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!cardExpirationYear.valid && submitted\">\r\n      Completá el año de vencimiento.\r\n    </p>\r\n    <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!securityCode.valid && submitted\">\r\n      Ingresá el código de seguridad.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"formRow\">\r\n    <div class=\"form-row-2col\">\r\n\r\n      <!-- Tipo de documento-->\r\n      <div class=\"formRow\">\r\n        <label for=\"docType\">Tipo de Doc.</label>\r\n        <div class=\"select-icon\">\r\n          <select id=\"docType\" name=\"docType\" data-checkout=\"docType\" required ngModel [disabled]=\"disabled\"\r\n            [(ngModel)]=\"defaultDocType\" #docType=\"ngModel\">\r\n          </select>\r\n        </div>\r\n      </div>\r\n\r\n      <!-- DNI -->\r\n      <div class=\"formRow\">\r\n        <label for=\"docNumber\">Nº de Doc.</label>\r\n        <span>\r\n          <input id=\"docNumber\" type=\"text\" name=\"docNumber\" data-checkout=\"docNumber\" minlength=\"7\" maxlength=\"8\"\r\n            required [disabled]=\"disabled\" (paste)=\"onPaste()\" (input)=\"onDniChange()\" [(ngModel)]=\"dniText\"\r\n            #docNumber=\"ngModel\" />\r\n        </span>\r\n      </div>\r\n\r\n    </div>\r\n    <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!docNumber.valid && submitted\">\r\n      Completá el número de documento.\r\n    </p>\r\n    <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!docType.valid && submitted\">\r\n      Seleccioná el tipo de documento.\r\n    </p>\r\n  </div>\r\n\r\n  <!--Cantidad de cuotas-->\r\n  <div class=\"formRow\">\r\n    <label for=\"installments\">Cantidad de Cuotas</label>\r\n    <div class=\"select-icon\">\r\n      <select id=\"installments\" name=\"installments\" aria-required=\"true\" aria-invalid=\"false\" required ngModel\r\n        [disabled]=\"disabled\" (change)=\"onDuesSelection(f)\" #installments=\"ngModel\">\r\n        <option *ngFor=\"let current of currentInstallments \" value=\"{{ current.installments }}\">\r\n          {{ current.recommended_message }}\r\n        </option>\r\n      </select>\r\n    </div>\r\n    <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!installments.valid && submitted\">\r\n      Elegí la cantidad de cuotas.\r\n    </p>\r\n  </div>\r\n\r\n  <div>\r\n    <div>\r\n      <div class=\"amount-resume\" *ngIf=\"f.valid\">\r\n        <p>Total al contado</p>\r\n        <h1>$ {{ totalAmount | number:'2.2-2' }}</h1>\r\n        <p>Total financiado</p>\r\n        <h3>$ {{ totalFinancedAmount | number:'2.2-2' }}</h3>\r\n        <p>{{ currentTEA }}</p>\r\n        <p>{{ currentCFT }}</p>\r\n        <div *ngIf=\"paymentState === 'unsubmitted'\r\n          || paymentState.substring(0, 11) === 'cc_rejected'\r\n          || paymentState === 'error'\">\r\n          <button type=\"submit\" (click)=\"onSubmit(f)\">\r\n            Pagar $ {{ totalFinancedAmount | number:'2.2-2' }}\r\n          </button>\r\n        </div>\r\n      </div>\r\n      <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!f.valid\">Completá los campos faltantes.</p>\r\n      <div *ngIf=\"!f.valid\">\r\n        <div *ngIf=\"paymentState !== 'accredited' &&\r\n              paymentState !== 'pending_contingency' &&\r\n              paymentState !== 'pending_review_manual'\">\r\n          <button type=\"submit\" (click)=\"onSubmit(f)\">\r\n            Pagar $ {{ paymentAmount | number:'2.2-2' }}\r\n          </button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</form>\r\n\r\n<div class=\"logo\">\r\n  <img [src]=\"imgMercadoPago\" alt=\"Mercado Pago\" class=\"responsive-img\" style=\"width: 150px;\">\r\n</div>\r\n\r\n<!--IFs-->\r\n<div>\r\n  <div class=\"pay-message info\" *ngIf=\"paymentState === 'processing'\">\r\n    <i class=\"material-icons\">info</i>\r\n    <p>\r\n      Procesando pago...\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message success\" *ngIf=\"paymentState === 'accredited'\">\r\n    <i class=\"material-icons\">check_circle</i>\r\n    <p>\r\n      Tu pago se ha confirmado!\r\n      <br>\r\n      Estos son los datos de la transacción:\r\n    </p>\r\n    <i class=\"data\">Ticket: {{ ticket }}</i>\r\n  </div>\r\n\r\n  <div class=\"pay-message info\" *ngIf=\"paymentState === 'pending_contingency'\">\r\n    <i class=\"material-icons\">info</i>\r\n    <p>\r\n      Estamos procesando el pago.\r\n      <br>\r\n      En menos de una hora te enviaremos por e-mail el resultado.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message info\" *ngIf=\"paymentState === 'pending_review_manual'\">\r\n    <i class=\"material-icons\">info</i>\r\n    <p>\r\n      Estamos procesando el pago.\r\n      <br>\r\n      En menos de 2 días hábiles te diremos por e-mail si se acreditó o si necesitamos más información.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'cc_rejected_bad_filled_card_number'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      Pago Rechazado.\r\n      <br>\r\n      Revisa el número de tarjeta.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'cc_rejected_bad_filled_date'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      Pago Rechazado.\r\n      <br>\r\n      Revisa la fecha de vencimiento.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'cc_rejected_bad_filled_other'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      Pago Rechazado.\r\n      <br>\r\n      Revisa los datos ingresados.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'cc_rejected_bad_filled_security_code'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      Pago Rechazado.\r\n      <br>\r\n      Revisa el código de seguridad.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'cc_rejected_blacklist'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      Pago Rechazado.\r\n      <br>\r\n      No pudimos procesar tu pago.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'cc_rejected_call_for_authorize'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      Pago Rechazado.\r\n      <br>\r\n      Debes autorizar el pago. El teléfono está al dorso de tu tarjeta.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'cc_rejected_card_disabled'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      Pago Rechazado.\r\n      <br>\r\n      Llama para activar tu tarjeta. El teléfono está al dorso de tu tarjeta.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'cc_rejected_card_error'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      Pago Rechazado.\r\n      <br>\r\n      No pudimos procesar tu pago.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'cc_rejected_duplicated_payment'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      Pago Rechazado, ya hiciste un pago por ese valor.\r\n      <br>\r\n      Si necesitas volver a pagar usa otra tarjeta u otro medio de pago..\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'cc_rejected_high_risk'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      Pago Rechazado.\r\n      <br>\r\n      Tu pago fue rechazado.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'cc_rejected_insufficient_amount'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      Pago Rechazado.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'cc_rejected_invalid_installments'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      Pago Rechazado.\r\n      <br>\r\n      No se pudo pocesar el pago en esa cantidad de cuotas.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'cc_rejected_max_attempts'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      Pago Rechazado! Límite de intentos permitidos.\r\n      <br>\r\n      Elige otra tarjeta u otro medio de pago.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'cc_rejected_other_reason'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      Pago Rechazado.\r\n      <br>\r\n      No se procesó el pago.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'error'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      {{ errorMessage }}\r\n      <br>No se procesó el pago.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'apiError'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>Error al procesar el pago (Vitnik).</p>\r\n  </div>\r\n\r\n  <button *ngIf=\"paymentState != 'pending_review_manual' && paymentState != 'pending_contingency'\r\n  && paymentState != 'accredited' && paymentState != 'processing' && paymentState != 'unsubmitted'\" (click)=\"resetForm()\">\r\n    Limpiar formulario\r\n  </button>\r\n\r\n</div>\r\n","styles":["@charset \"UTF-8\";.mp-payment{background-color:transparent;font-family:inherit,sans-serif}.mp-payment label{font-size:14px;color:#888}.formRow{margin-top:10px}:focus{outline:0}.form-row-2col{display:flex;flex-direction:row;justify-content:space-between;align-items:center;margin-top:10px}.form-row-2col .formRow{width:49%;margin-top:0}.form-row-3col{display:flex;flex-direction:row;justify-content:space-between;align-items:center;margin-top:10px}.form-row-3col .formRow{width:32%;margin-top:0}span{background-color:#fff;border:.5px solid #707070;border-radius:2px;padding:2px 10px;display:block;margin-top:4px}input[type=password],input[type=text]{background:0 0;border:none;color:#000;font-size:15px;height:23px;width:100%;text-transform:uppercase;vertical-align:top}select{width:100%;font-size:15px;height:30px;padding:2px 10px;border:.5px solid #707070;border-radius:2px;display:block;margin-top:4px;-webkit-appearance:none;-moz-appearance:none;position:relative;z-index:1;background:0 0}.select-icon{position:relative}.select-icon::after{content:\"\";font-family:\"Material Icons\";position:absolute;right:0;top:3px;font-size:24px}.icon-select{width:24px;position:absolute;right:13px}.alert-text{font-size:13px;color:#009ee3;margin-top:7px;margin-bottom:0}.warn-text{font-size:15px;color:#c62626;margin:10px 0;text-align:center}.confirm-text{font-size:15px;color:#388a22;margin:10px 0;text-align:center}.in-progress-text{font-size:15px;color:#009ee3;margin:10px 0;text-align:center}button{background-color:#009ee3;color:#fff;font-size:18px;text-align:center;padding:10px 0;width:100%;border:none;border-radius:20px;margin-top:20px;cursor:pointer}button:disabled{background-color:#525252}.amount-resume h1,.amount-resume h3{margin-top:0;margin-bottom:10px}.amount-resume p{font-size:13px;color:#525252;margin:5px 0;text-transform:uppercase}.pay-message{margin-top:10px;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:20px}.pay-message p{font-size:1.1rem;text-align:center;line-height:130%;margin-bottom:10px}.pay-message i.data{font-size:.9rem;text-align:center}.pay-message i.material-icons{font-size:2rem;margin-bottom:5px}.success{background-color:#dff2bf;color:#4f8a10}.error{color:#d8000c;background-color:#ffd2d2}.info{color:#00529b;background-color:#bde5f8}.logo{display:flex;flex-direction:column;align-items:flex-end;justify-content:flex-end;padding-top:10px}.responsive-img{width:100%;height:auto}"]}]}],"members":{"paymentAmount":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":50,"character":3}}]}],"payerName":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":51,"character":3}}]}],"payerEmail":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":52,"character":3}}]}],"accessToken":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":53,"character":3}}]}],"vkUrlApi":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":54,"character":3}}]}],"description":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":55,"character":3}}]}],"publishableKey":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":56,"character":3}}]}],"successUrl":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":57,"character":3}}]}],"failureUrl":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":58,"character":3}}]}],"imgCreditCards":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":59,"character":3}}]}],"imgMercadoPago":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":60,"character":3}}]}],"iconExpandMore":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":61,"character":3}}]}],"debugLog":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":62,"character":3}}]}],"storeId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":63,"character":3}}]}],"idVen":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":64,"character":3}}]}],"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":65,"character":3}}]}],"statusPay":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":66,"character":3}}]}],"checkOutForm":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":68,"character":3},"arguments":["f",{"static":false}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":70,"character":30},{"__symbolic":"reference","name":"ɵc"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"initMercadoPago":[{"__symbolic":"method"}],"addMercadopagoScript":[{"__symbolic":"method"}],"createToken":[{"__symbolic":"method"}],"makePayment":[{"__symbolic":"method"}],"hashText":[{"__symbolic":"method"}],"paymentResponseHandler":[{"__symbolic":"method"}],"checkPaymentMethod":[{"__symbolic":"method"}],"setCurrentMethod":[{"__symbolic":"method"}],"checkInstallments":[{"__symbolic":"method"}],"setInstallments":[{"__symbolic":"method"}],"setIssuers":[{"__symbolic":"method"}],"onDuesSelection":[{"__symbolic":"method"}],"onSubmit":[{"__symbolic":"method"}],"onYearChange":[{"__symbolic":"method"}],"onMonthLostFocus":[{"__symbolic":"method"}],"onMonthChange":[{"__symbolic":"method"}],"onCodeChange":[{"__symbolic":"method"}],"onDniChange":[{"__symbolic":"method"}],"onPayerNameChange":[{"__symbolic":"method"}],"onCardChange":[{"__symbolic":"method"}],"onPaste":[{"__symbolic":"method"}],"logger":[{"__symbolic":"method"}],"mercadoPagoPayment":[{"__symbolic":"method"}],"resetForm":[{"__symbolic":"method"}]}},"ɵc":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":6,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClient","line":12,"character":34}]}],"makePayment":[{"__symbolic":"method"}],"getMercadoPagoPromotions":[{"__symbolic":"method"}],"normalizeUrl":[{"__symbolic":"method"}],"_setAuthHeaders":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}},"ɵd":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"mp-promotion","template":"<div *ngIf=\"contentSource === 'api'\" class=\"payments summary\">\r\n  <div id=\"promoBancos\" class=\"promoBancos\">\r\n\r\n    <div *ngFor=\"let promo of cardPromotions | slice:2\" name=\"promociones\" class=\"bank-block col-md-4 col-sm-4\">\r\n      <div class=\"banklogoContainer\">\r\n        <img class=\"img-regular img-responsive\" [src]=\"promo.payment_methods[0].secure_thumbnail\">\r\n      </div>\r\n      <p>\r\n        <span class=\"issuer\">{{promo.issuer.name}}</span>\r\n      </p>\r\n      <p>\r\n        <span class=\"installments\">{{promo.max_installments}} cuotas sin interés</span>\r\n      </p>\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n<iframe src=\"https://www.mercadopago.com.ar/cuotas?iframe=true\"\r\n        width=\"100%\"\r\n        height=\"450px\"\r\n        scrolling=\"yes\"\r\n        frameborder=\"0\"\r\n        style=\"position: relative;\"\r\n        *ngIf=\"contentSource === 'iframe'\">\r\n</iframe>\r\n","styles":[""]}]}],"members":{"url":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":11,"character":3}}]}],"contentSource":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":12,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵc"}]}],"ngOnInit":[{"__symbolic":"method"}]}},"ɵe":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":8,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":10,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":11,"character":4},{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClientModule","line":12,"character":4},{"__symbolic":"reference","module":"@angular/router","name":"RouterModule","line":13,"character":4}],"declarations":[{"__symbolic":"reference","name":"ɵf"}],"exports":[{"__symbolic":"reference","name":"ɵf"}]}]}],"members":{}},"ɵf":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":19,"character":1},"arguments":[{"selector":"sps-form-pay","template":"<!-- https://github.com/decidir/sdk-javascript-v2 -->\r\n\r\n<form action=\"\" method=\"POST\" id=\"formulario\" #f=\"ngForm\" autocomplete=\"off\">\r\n  <!-- Numero de tarjeta -->\r\n  <div class=\"formRow\">\r\n    <label for=\"card_number\">{{ language.toLowerCase() === 'en' ? 'Card number' : 'Número de Tarjeta' }}</label>\r\n    <span>\r\n      <input id=\"card_number\"\r\n             type=\"text\"\r\n             name=\"card\"\r\n             placeholder=\"{{ language.toLowerCase() === 'en' ? 'Card number' : 'Número de Tarjeta' }}\"\r\n             minlength=\"12\"\r\n             maxlength=\"19\"\r\n             pattern=\"[0-9]*\"\r\n             data-decidir=\"card_number\"\r\n             required\r\n             (input)=\"onCardChange()\"\r\n             (paste)=\"onPaste()\"\r\n             [disabled]=\"disabled\"\r\n             [(ngModel)]=\"cardText\"\r\n             #card=\"ngModel\" />\r\n    </span>\r\n    <p class=\"alert-text\" *ngIf=\"card.errors?.required && submitPressed\">\r\n      {{ language.toLowerCase() === 'en' ? 'Required' : 'Completá el número de tarjeta' }}\r\n    </p>\r\n    <p class=\"alert-text\" *ngIf=\"card.errors?.minlength && submitPressed\">\r\n      {{ language.toLowerCase() === 'en' ? 'Required' : 'Requiere 13 digitos mínimo' }}\r\n    </p>\r\n  </div>\r\n\r\n  <!-- Card-issuer -->\r\n  <div class=\"formRow\">\r\n    <label>{{ language.toLowerCase() === 'en' ? 'Pay with' : 'Pagar con' }}</label>\r\n    <div class=\"select-icon\">\r\n      <select name=\"iss\"\r\n              required\r\n              #iss=\"ngModel\"\r\n              [disabled]=\"disableSelect\"\r\n              (change)=\"selectedCreditCard()\"\r\n              [(ngModel)]=\"issuer\">\r\n        <option [value]=\"null\" selected disabled>\r\n          {{ language.toLowerCase() === 'en' ? 'SELECT...' : 'Sin Seleccionar...' }}\r\n        </option>\r\n        <ng-container *ngIf=\"currency === 'USD'; else credCardsArgTemplate\">\r\n          <option [value]=\"1\">Visa</option>\r\n          <option [value]=\"15\">MasterCard</option>\r\n        </ng-container>\r\n        <ng-template #credCardsArgTemplate>\r\n          <option [ngValue]=\"item.id\" *ngFor=\"let item of creditCards\">{{item.name}}</option>\r\n        </ng-template>\r\n      </select>\r\n    </div>\r\n    <p class=\"alert-text\" *ngIf=\"iss.invalid && submitPressed\">\r\n      {{ language.toLowerCase() === 'en' ? 'Required' : 'Seleccioná el emisor de la tarjeta' }}\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"formRow\">\r\n    <div class=\"form-row-2col\">\r\n      <!-- Expiry-month-->\r\n      <div class=\"formRow\">\r\n        <label>\r\n          {{ language.toLowerCase() === 'en' ? 'Month of expiration' : 'Mes de expiración' }}\r\n        </label>\r\n        <span>\r\n          <input type=\"text\"\r\n                 name=\"month\"\r\n                 placeholder=\"MM\"\r\n                 minlength=\"2\"\r\n                 maxlength=\"2\"\r\n                 data-decidir=\"card_expiration_month\"\r\n                 required\r\n                 [disabled]=\"disabled\"\r\n                 (input)=\"onMonthChange()\"\r\n                 (focusout)=\"onMonthLostFocus()\"\r\n                 (paste)=\"onPaste()\"\r\n                 [(ngModel)]=\"monthText\"\r\n                 #month=\"ngModel\" />\r\n        </span>\r\n      </div>\r\n      <!-- Expiry-year-->\r\n      <div class=\"formRow\">\r\n        <label>\r\n          {{ language.toLowerCase() === 'en' ? 'Year of expiration' : 'Año de expiración' }}\r\n        </label>\r\n        <span>\r\n          <input type=\"text\"\r\n                 name=\"year\"\r\n                 placeholder=\"AA\"\r\n                 minlength=\"2\"\r\n                 maxlength=\"2\"\r\n                 data-decidir=\"card_expiration_year\"\r\n                 required\r\n                 [disabled]=\"disabled\"\r\n                 (input)=\"onYearChange()\"\r\n                 (blur)=\"onYearBlur($event)\"\r\n                 (paste)=\"onPaste()\"\r\n                 [(ngModel)]=\"yearText\"\r\n                 #year=\"ngModel\"/>\r\n        </span>\r\n      </div>\r\n    </div>\r\n    <p class=\"alert-text\" *ngIf=\"month.invalid && submitPressed\">\r\n      {{ language.toLowerCase() === 'en' ? 'Required' : 'Completá el mes de vencimiento de la tarjeta' }}</p>\r\n    <p class=\"alert-text\" *ngIf=\"year.invalid && submitPressed\">\r\n      {{ language.toLowerCase() === 'en' ? 'Required' : 'Completá el año de vencimiento de la tarjeta' }}</p>\r\n    <p class=\"alert-text\" *ngIf=\"invalidDate\">\r\n      {{ language.toLowerCase() === 'en' ? 'Enter a valid expiration date' : 'La fecha de la tarjeta ingresada está vencida'}}\r\n    </p>\r\n  </div>\r\n\r\n  <!-- Card-name -->\r\n  <div class=\"formRow\">\r\n    <label>\r\n      {{ language.toLowerCase() === 'en' ? 'Holder name' : 'Nombre y apellido impreso en la tarjeta' }}\r\n    </label>\r\n\r\n    <span>\r\n      <input type=\"text\"\r\n             name=\"payername\"\r\n             placeholder=\"{{language.toLowerCase() === 'en' ? 'Holder name' : 'TITULAR'}}\" value=\"{{payerName}}\"\r\n             maxlength=\"22\"\r\n             data-decidir=\"card_holder_name\"\r\n             required\r\n             [disabled]=\"disabled\"\r\n             (input)=\"onPayerNameChange()\"\r\n             (paste)=\"onPaste()\"\r\n             [(ngModel)]=\"payerNameText\"\r\n             #payername=\"ngModel\" />\r\n    </span>\r\n    <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!payername.valid && submitPressed\">\r\n      {{ language.toLowerCase() === 'en' ? 'Required' : 'Completá el nombre del titular de la tarjeta' }}\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"formRow\" *ngIf=\"currency === 'USD'\">\r\n    <input type=\"hidden\" data-decidir=\"card_holder_doc_type\" name=\"type\">\r\n    <input type=\"hidden\" data-decidir=\"card_holder_doc_number\" name=\"dni\">\r\n  </div>\r\n\r\n\r\n  <div class=\"formRow\" *ngIf=\"currency === 'ARS'\">\r\n    <label for=\"card_holder_doc_type\">Número de documento del titular</label>\r\n    <div class=\"form-row-2col\">\r\n      <!-- Tipo de documento-->\r\n      <div class=\"formRow\">\r\n        <div class=\"select-icon\">\r\n          <select data-decidir=\"card_holder_doc_type\" ngModel required #type=\"ngModel\" name=\"type\"\r\n                  [disabled]=\"disabled\">\r\n            <option value=\"\" disabled selected>Seleccionar...</option>\r\n            <option value=\"dni\">DNI</option>\r\n            <option value=\"cuil\">CUIL</option>\r\n          </select>\r\n        </div>\r\n      </div>\r\n      <!-- DNI -->\r\n      <div class=\"formRow\">\r\n        <span>\r\n          <input id=\"card_holder_doc_type\"\r\n                 type=\"text\"\r\n                 name=\"dni\"\r\n                 minlength=\"7\"\r\n                 maxlength=\"11\"\r\n                 data-decidir=\"card_holder_doc_number\"\r\n                 required\r\n                 [disabled]=\"disabled\"\r\n                 (input)=\"onDniChange()\"\r\n                 (paste)=\"onPaste()\"\r\n                 [(ngModel)]=\"dniText\"\r\n                 #dni=\"ngModel\" />\r\n        </span>\r\n      </div>\r\n    </div>\r\n    <p class=\"alert-text\" *ngIf=\"type.invalid && submitPressed\">Seleccioná tipo de documento</p>\r\n    <p class=\"alert-text\" *ngIf=\"dni.errors?.minlength && submitPressed\">Requiere 7 digitos mínimo</p>\r\n    <p class=\"alert-text\" *ngIf=\"dni.errors?.required && submitPressed\">Completá el número de documento</p>\r\n  </div>\r\n  <!-- CVV -->\r\n  <div class=\"formRow\">\r\n    <label for=\"security_code\">{{ language.toLowerCase() === 'en' ? 'CSC' : 'Código de seguridad' }}</label>\r\n    <span>\r\n      <input id=\"security_code\"\r\n             type=\"password\"\r\n             name=\"cvc\"\r\n             placeholder=\"CSC\"\r\n             minlength=\"3\"\r\n             maxlength=\"4\"\r\n             data-decidir=\"security_code\"\r\n             required\r\n             [disabled]=\"disabled\"\r\n             (input)=\"onCodeChange()\"\r\n             (paste)=\"onPaste()\"\r\n             [(ngModel)]=\"cvcText\"\r\n             #cvc=\"ngModel\" />\r\n    </span>\r\n    <p class=\"alert-text\" *ngIf=\"cvc.errors?.minlength && submitPressed\">\r\n      {{ language.toLowerCase() === 'en' ? 'Enter a valid csc' : 'Requiere 3 digitos mínimo' }}\r\n    </p>\r\n    <p class=\"alert-text\" *ngIf=\"cvc.errors?.required && submitPressed\">\r\n      {{ language.toLowerCase() === 'en' ? 'Required' : 'Completá el código de seguridad' }}\r\n    </p>\r\n  </div>\r\n\r\n  <!-- Cuotas -->\r\n  <ng-container *ngIf=\"currency === 'ARS'\">\r\n    <div class=\"formRow\">\r\n      <label>Cuotas</label>\r\n      <div class=\"select-icon\">\r\n        <select name=\"ins\"\r\n                required\r\n                [disabled]=\"disabled\"\r\n                [(ngModel)]=\"selectCreditCardPlan\"\r\n                (change)=\"selectedCreditCardPlan()\"\r\n                #ins=\"ngModel\">\r\n          <option [value]=\"null\" selected disabled>Sin Seleccionar...</option>\r\n          <option [ngValue]=\"item\" *ngFor=\"let item of creditCardPlans\">{{ item.description }}</option>\r\n        </select>\r\n      </div>\r\n      <p class=\"alert-text\" *ngIf=\"ins.invalid && submitPressed\">Seleccioná cantidad de cuotas</p>\r\n    </div>\r\n  </ng-container>\r\n\r\n  <div>\r\n    <div>\r\n      <div class=\"amount-resume\" *ngIf=\"f.valid\">\r\n        <ng-container *ngIf=\"currency === 'ARS'\">\r\n          <p>Total al contado</p>\r\n          <h1>$ {{ totalAmount | number:'2.2-2' }}</h1>\r\n          <p>Total financiado</p>\r\n          <h3>$ {{ totalFinancedAmount | number:'2.2-2'}}</h3>\r\n          <p>TEA: {{ currentTEA }}%</p>\r\n          <p>CFT: {{ currentCFT }}%</p>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"currency === 'USD'\">\r\n          <p>Total</p>\r\n          <h1>{{ labelButton }}</h1>\r\n        </ng-container>\r\n        <div *ngIf=\"paymentState === 'unsubmitted'\">\r\n          <button *ngIf=\"currency === 'ARS'\" type=\"submit\" (click)=\"onSubmit($event)\">\r\n            Pagar ${{ totalFinancedAmount | number:'2.2-2' }}\r\n          </button>\r\n\r\n          <button *ngIf=\"currency === 'USD'\" type=\"submit\" (click)=\"onSubmit($event)\">\r\n            {{ labelButton }}\r\n          </button>\r\n        </div>\r\n        <div *ngIf=\"paymentState === 'success' || paymentState === 'processing'\">\r\n          <button *ngIf=\"currency === 'ARS'\" disabled>Pagar $ {{totalFinancedAmount | number:'2.2-2'}}</button>\r\n          <button *ngIf=\"currency === 'USD'\" disabled>{{ labelButton }}</button>\r\n        </div>\r\n      </div>\r\n      <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!f.valid\">\r\n        {{ language.toLowerCase() === 'en' ? 'Complete all fields' : 'Completá los campos faltantes' }}\r\n      </p>\r\n      <div *ngIf=\"!f.valid && paymentState !== 'success' && paymentState !== 'apiError' && paymentState !== 'error'\">\r\n        <button *ngIf=\"currency === 'ARS'\" type=\"submit\" (click)=\"onSubmit($event)\">Pagar $\r\n          {{ paymentAmount | number:'2.2-2' }}\r\n        </button>\r\n        <button *ngIf=\"currency === 'USD'\" type=\"submit\" (click)=\"onSubmit($event)\">\r\n          {{ labelButton }}\r\n        </button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"logo\">\r\n    <img [src]=\"logoSps\" alt=\"SPS Decidir\" class=\"responsive-img\" style=\"width: 50px;\">\r\n  </div>\r\n  <div>\r\n    <div class=\"pay-message info\" *ngIf=\"paymentState === 'processing'\">\r\n      <i class=\"material-icons\">info</i>\r\n      <p>\r\n        {{ language.toLowerCase() === 'en' ? 'Processing payment...' : 'Procesando pago...' }}\r\n      </p>\r\n    </div>\r\n    <div class=\"pay-message error\" *ngIf=\"paymentState === 'error'\">\r\n      <i class=\"material-icons\">error</i>\r\n      <p>\r\n        {{errorMessage}}\r\n        <br>\r\n        {{ language.toLowerCase() === 'en' ? 'Error processing the payment' : 'No se procesó el pago' }}\r\n      </p>\r\n    </div>\r\n    <div *ngIf=\"language.toLowerCase() !== 'en' && paymentState === 'success'\" class=\"pay-message success\">\r\n      <i class=\"material-icons\">check_circle</i>\r\n      <p>\r\n        Tu pago se ha confirmado!\r\n        <br>\r\n        Estos son los datos de la transacción:\r\n      </p>\r\n      <i class=\"data\">Nro. de Pago: {{paymentSuccessInfo.payment_id}}</i>\r\n      <i class=\"data\">Ticket: {{paymentSuccessInfo.ticket}}</i>\r\n      <i class=\"data\">Cod. Autorización: {{paymentSuccessInfo.card_authorization_code}}</i>\r\n    </div>\r\n\r\n    <div *ngIf=\"language.toLowerCase() === 'en' && paymentState === 'success'\" class=\"pay-message success\">\r\n      <i class=\"material-icons\">check_circle</i>\r\n      <p>\r\n        Your payment has been confirmed!\r\n        <br>\r\n        These are the transaction data:\r\n      </p>\r\n      <i class=\"data\">Payment No.: {{paymentSuccessInfo.payment_id}}</i>\r\n      <i class=\"data\">Ticket: {{paymentSuccessInfo.ticket}}</i>\r\n      <i class=\"data\">Authorization Code: {{paymentSuccessInfo.card_authorization_code}}</i>\r\n    </div>\r\n\r\n    <div class=\"pay-message error\" *ngIf=\"paymentState === 'apiError'\">\r\n      <i class=\"material-icons\">error</i>\r\n      <p>\r\n        {{ language.toLowerCase() === 'en' ? 'Error processing the payment (Vitnik)' : 'Error al procesar el pago (Vitnik)'}}\r\n      </p>\r\n    </div>\r\n\r\n    <button *ngIf=\"language.toLowerCase() === 'es' && (paymentState === 'apiError' || paymentState === 'error')\" (click)=\"resetForm()\">\r\n      Limpiar formulario\r\n    </button>\r\n    <button *ngIf=\"language.toLowerCase() === 'en' && (paymentState === 'apiError' || paymentState === 'error')\" (click)=\"resetForm()\">\r\n      Clear form\r\n    </button>\r\n\r\n  </div>\r\n</form>\r\n","styles":["@charset \"UTF-8\";.flex-row-wrap{display:flex;flex-flow:row wrap;flex-direction:row;justify-content:space-between;align-items:center}.flex-row-wrap div{margin:10px;width:200px;flex-grow:1}#formulario{background-color:transparent;font-family:inherit,sans-serif}#formulario label{font-size:14px;color:#888}.formRow{margin-top:10px}.form-row-2col{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.form-row-2col .formRow{width:49%;margin-top:0}.form-row-3col{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.form-row-3col .formRow{width:32%;margin-top:0}span{background-color:#fff;border:.5px solid #707070;border-radius:2px;padding:2px 10px;display:block;margin-top:4px}input[type=password],input[type=text]{background:0 0;border:none;color:#000;font-size:15px;height:23px;width:100%;text-transform:uppercase;vertical-align:top}select{width:100%;font-size:15px;height:30px;padding:2px 10px;border:.5px solid #707070;border-radius:2px;display:block;margin-top:4px;-webkit-appearance:none;-moz-appearance:none;position:relative;z-index:1;background:0 0}.select-icon{position:relative}.select-icon::after{content:\"\";font-family:\"Material Icons\";position:absolute;right:5px;top:3px;font-size:24px}.icon-select{width:24px;position:absolute;right:13px}.alert-text{font-size:15px;color:#009ee3;margin-top:7px;margin-bottom:0}:focus{outline:0}.pay-message{margin-top:10px;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:20px}.pay-message p{font-size:1.1rem;text-align:center;line-height:130%;margin-bottom:10px}.pay-message i.data{font-size:.9rem;text-align:center}.pay-message i.material-icons{font-size:2rem;margin-bottom:5px}.success{background-color:#dff2bf;color:#4f8a10}.error{color:#d8000c;background-color:#ffd2d2}.info{color:#00529b;background-color:#bde5f8}button{background-color:#009ee3;color:#fff;font-size:18px;text-align:center;padding:10px 0;width:100%;border:none;border-radius:20px;margin-top:20px;cursor:pointer}button:disabled{background-color:#525252;cursor:default}.amount-resume h1,.amount-resume h3{margin-top:0;margin-bottom:10px}.amount-resume p{font-size:13px;color:#525252;margin:5px 0;text-transform:uppercase;line-height:130%}.logo{display:flex;flex-direction:column;align-items:flex-end;justify-content:flex-end;padding-top:10px}.responsive-img{width:100%;height:auto}"]}]}],"members":{"checkOutForm":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":26,"character":3},"arguments":["f",{"static":false}]}]}],"accessToken":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":27,"character":3}}]}],"spsUrlApi":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":28,"character":3}}]}],"vkUrlApi":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":29,"character":3}}]}],"paymentAmount":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":30,"character":3}}]}],"logoSps":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":31,"character":3}}]}],"currency":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":32,"character":3}}]}],"defaultPublishableKey":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":33,"character":3}}]}],"superviellePublishableKey":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":34,"character":3}}]}],"successUrl":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":35,"character":3}}]}],"failureUrl":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":36,"character":3}}]}],"useCybersource":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":37,"character":3}}]}],"debugLog":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":38,"character":3}}]}],"storeId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":39,"character":3}}]}],"domainId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":40,"character":3}}]}],"idVen":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":41,"character":3}}]}],"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":42,"character":3}}]}],"labelButton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":43,"character":3}}]}],"language":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":44,"character":3}}]}],"statusPay":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":45,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":79,"character":30},{"__symbolic":"reference","name":"ɵg"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"initDecidir":[{"__symbolic":"method"}],"addDecidirScript":[{"__symbolic":"method"}],"getCreditCards":[{"__symbolic":"method"}],"getPlansByCreditCardId":[{"__symbolic":"method"}],"initializeSpsDecidir":[{"__symbolic":"method"}],"logger":[{"__symbolic":"method"}],"selectedCreditCard":[{"__symbolic":"method"}],"selectedCreditCardPlan":[{"__symbolic":"method"}],"onSubmit":[{"__symbolic":"method"}],"makePayment":[{"__symbolic":"method"}],"hashText":[{"__symbolic":"method"}],"paymentResponseHandler":[{"__symbolic":"method"}],"processErrorToken":[{"__symbolic":"method"}],"processErrorMessage":[{"__symbolic":"method"}],"compareDate":[{"__symbolic":"method"}],"onYearChange":[{"__symbolic":"method"}],"onYearBlur":[{"__symbolic":"method"}],"onMonthLostFocus":[{"__symbolic":"method"}],"onMonthChange":[{"__symbolic":"method"}],"onCodeChange":[{"__symbolic":"method"}],"onDniChange":[{"__symbolic":"method"}],"onPayerNameChange":[{"__symbolic":"method"}],"onCardChange":[{"__symbolic":"method"}],"setCreditType":[{"__symbolic":"method"}],"onPaste":[{"__symbolic":"method"}],"resetForm":[{"__symbolic":"method"}]}},"ɵg":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":6,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClient","line":12,"character":34}]}],"makePayment":[{"__symbolic":"method"}],"getDecidirConfigByBin":[{"__symbolic":"method"}],"normalizeUrl":[{"__symbolic":"method"}],"getCreditCards":[{"__symbolic":"method"}],"getPlansByCreditCardId":[{"__symbolic":"method"}],"_setAuthHeaders":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}},"ɵh":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":8,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":10,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":11,"character":4},{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClientModule","line":12,"character":4},{"__symbolic":"reference","module":"@angular/router","name":"RouterModule","line":13,"character":4}],"declarations":[{"__symbolic":"reference","name":"ɵi"}],"exports":[{"__symbolic":"reference","name":"ɵi"}]}]}],"members":{}},"ɵi":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":6,"character":1},"arguments":[{"selector":"paypal-new-form-pay","template":"<div *ngIf=\"loading\">Loading...</div>\r\n<input type=\"hidden\" id=\"amount\" [(ngModel)]=\"amount\">\r\n<input type=\"hidden\" id=\"userId\" [(ngModel)]=\"userId\">\r\n<input type=\"hidden\" id=\"storeId\" [(ngModel)]=\"storeId\">\r\n<input type=\"hidden\" id=\"successUrl\" [(ngModel)]=\"successUrl\">\r\n<input type=\"hidden\" id=\"cancelUrl\" [(ngModel)]=\"cancelUrl\">\r\n<input type=\"hidden\" id=\"vkUrlApi\" [(ngModel)]=\"vkUrlApi\">\r\n<input type=\"hidden\" id=\"transactionId\" [(ngModel)]=\"transactionId\">\r\n<input type=\"hidden\" id=\"data\" [(ngModel)]=\"data\">\r\n<input type=\"hidden\" id=\"accessToken\" [(ngModel)]=\"accessToken\">\r\n<div id=\"paypal-button-container\"></div>\r\n","styles":["label{font-size:11px;color:#888;text-transform:uppercase;font-weight:500}.flex-row-wrap{display:flex;flex-flow:row wrap;flex-direction:row;justify-content:space-between;align-items:center}.flex-row-wrap div{margin:10px;width:200px;flex-grow:1}:focus{outline:0}.formRow{margin-top:10px;margin-bottom:10px}.formRow span{background-color:#fff;border:.5px solid #707070;border-radius:5px;padding:5px 10px;display:block;margin-top:7px}input[type=password],input[type=text]{background:0 0;border:none;color:#000;font-size:13px;height:23px;width:100%;text-transform:uppercase}select{width:100%;font-size:13px;height:36px;padding:5px 10px;background-color:#fff;border:.5px solid #707070;border-radius:5px;display:block;margin-top:7px}.icon-select{width:24px;position:absolute;right:13px}.alert-text{font-size:13px;color:#009ee3;margin-top:7px;margin-bottom:0}.warn-text{font-size:15px;color:#c62626;margin:10px 0;text-align:center}.confirm-text{font-size:15px;color:#8cd876;margin:10px 0;text-align:center}.in-progress-text{font-size:15px;color:#009ee3;margin:10px 0;text-align:center}button{background-color:#009ee3;color:#fff;font-size:18px;text-align:center;padding:10px 0;width:100%;border:none;border-radius:20px;margin-top:20px;cursor:pointer}button:disabled{background-color:#525252}.amount-resume h1,.amount-resume h3{margin-top:0;margin-bottom:10px}.amount-resume p{font-size:13px;color:#525252;margin:5px 0;text-transform:uppercase}"]}]}],"members":{"accessToken":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":12,"character":3}}]}],"clientId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":13,"character":3}}]}],"vkUrlApi":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":3}}]}],"storeId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":15,"character":3}}]}],"userId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":16,"character":3}}]}],"transactionId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":3}}]}],"amount":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":18,"character":3}}]}],"currency":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"cancelUrl":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":3}}]}],"successUrl":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":21,"character":3}}]}],"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":22,"character":3}}]}],"urlSignout":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":23,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterViewChecked":[{"__symbolic":"method"}],"addPaypalScript":[{"__symbolic":"method"}]}},"ɵj":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":15,"character":1},"arguments":[{"declarations":[[{"__symbolic":"reference","name":"ɵk"},{"__symbolic":"reference","name":"ɵl"}]],"exports":[[{"__symbolic":"reference","name":"ɵk"},{"__symbolic":"reference","name":"ɵl"}]],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":23,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":24,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"ReactiveFormsModule","line":25,"character":4},{"__symbolic":"reference","module":"@angular/router","name":"RouterModule","line":26,"character":4},{"__symbolic":"reference","module":"@angular/material","name":"MatSnackBarModule","line":27,"character":4}],"providers":[{"__symbolic":"reference","name":"ɵm"},{"__symbolic":"reference","name":"ɵn"}]}]}],"members":{}},"ɵk":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":7,"character":1},"arguments":[{"selector":"lib-go-cuotas","template":"<div *ngIf=\"isLoading && paymentStatus === 'unsubmitted'\" class=\"loading-overlay\">\n  <div class=\"loading-message\">\n    <p>{{ loadingMessage }}</p>\n    <div *ngIf=\"!paymentCompleted\" class=\"spinner\"></div>\n  </div>\n</div>\n\n<form\n  (ngSubmit)=\"onSubmit($event)\"\n  class=\"gc-payment\"\n  id=\"formulario\"\n  #f=\"ngForm\"\n  autocomplete=\"off\"\n>\n  <div class=\"formRow\">\n    <label for=\"cardholderName\">Nombre y Apellido impreso en la tarjeta</label>\n    <span>\n      <input\n        id=\"cardholderName\"\n        type=\"text\"\n        name=\"cardholderName\"\n        required\n        maxlength=\"22\"\n        data-checkout=\"cardholderName\"\n        [disabled]=\"disabled\"\n        (paste)=\"onPaste()\"\n        (input)=\"onPayerNameChange()\"\n        [(ngModel)]=\"defaultName\"\n        pattern=\"^[a-zA-Z\\s]+$\"\n        #cardholderName=\"ngModel\"\n      />\n    </span>\n    <p\n      [hidden]=\"disabled\"\n      class=\"alert-text\"\n      *ngIf=\"!cardholderName.valid && submitted\"\n    >\n      Ingresá el nombre completo que figura en la tarjeta.\n    </p>\n  </div>\n\n  <div class=\"formRow\">\n    <div class=\"form-row-2col\">\n      <!-- Tipo de documento-->\n      <div class=\"formRow\">\n        <label for=\"docType\">Tipo Doc.</label>\n        <div class=\"select-icon\">\n          <select\n            id=\"docType\"\n            name=\"docType\"\n            data-checkout=\"docType\"\n            required\n            ngModel\n            [disabled]=\"disabledSelect\"\n            [(ngModel)]=\"defaultDocType\"\n            #docType=\"ngModel\"\n          >\n            <option value=\"\" disabled selected>Sin Seleccionar...</option>\n            <option value=\"dni\">DNI</option>\n            <option value=\"cuil\">CUIL</option>\n          </select>\n        </div>\n      </div>\n\n      <!-- DNI -->\n      <div class=\"formRow\">\n        <label for=\"docNumber\">Nº de Doc.</label>\n        <span>\n          <input\n            id=\"docNumber\"\n            type=\"text\"\n            name=\"docNumber\"\n            data-checkout=\"docNumber\"\n            minlength=\"7\"\n            maxlength=\"8\"\n            required\n            [disabled]=\"disabled\"\n            (paste)=\"onPaste()\"\n            (input)=\"onDniChange()\"\n            [(ngModel)]=\"dniText\"\n            #docNumber=\"ngModel\"\n          />\n        </span>\n      </div>\n    </div>\n    <p\n      [hidden]=\"disabled\"\n      class=\"alert-text\"\n      *ngIf=\"!docNumber.valid && submitted\"\n    >\n      Completá el número de documento.\n    </p>\n    <p\n      [hidden]=\"disabled\"\n      class=\"alert-text\"\n      *ngIf=\"!docType.valid && submitted\"\n    >\n      Seleccioná el tipo de documento.\n    </p>\n  </div>\n\n  <!-- Numero de tarjeta -->\n  <div class=\"formRow\">\n    <label for=\"cardNumber\">Número de Tarjeta</label>\n    <span>\n      <input\n        id=\"cardNumber\"\n        type=\"text\"\n        name=\"cardNumber\"\n        data-checkout=\"cardNumber\"\n        maxlength=\"19\"\n        required\n        thumbnail\n        (input)=\"onCardChange()\"\n        (paste)=\"onPaste()\"\n        [disabled]=\"disabled\"\n        [(ngModel)]=\"cardText\"\n        #cardNumber=\"ngModel\"\n      />\n    </span>\n    <p\n      [hidden]=\"disabled\"\n      class=\"alert-text\"\n      *ngIf=\"!cardNumber.valid && submitted\"\n    >\n      Ingresá el número de tarjeta.\n    </p>\n  </div>\n\n  <div class=\"form-row-3col\">\n    <!-- Expiry-month-->\n    <div class=\"formRow\">\n      <label for=\"cardExpirationMonth\">Mes de expiración</label>\n      <span>\n        <input\n          id=\"cardExpirationMonth\"\n          type=\"text\"\n          name=\"cardExpirationMonth\"\n          placeholder=\"MM\"\n          minlength=\"2\"\n          maxlength=\"2\"\n          data-checkout=\"cardExpirationMonth\"\n          required\n          [disabled]=\"disabled\"\n          (paste)=\"onPaste()\"\n          (input)=\"onMonthChange()\"\n          (focusout)=\"onMonthLostFocus()\"\n          [(ngModel)]=\"monthText\"\n          #cardExpirationMonth=\"ngModel\"\n        />\n      </span>\n    </div>\n\n    <!-- Expiry-year-->\n    <div class=\"formRow\">\n      <label for=\"cardExpirationYear\">Año de expiración</label>\n      <span>\n        <input\n          id=\"cardExpirationYear\"\n          type=\"text\"\n          name=\"cardExpirationYear\"\n          placeholder=\"AA\"\n          minlength=\"2\"\n          maxlength=\"2\"\n          data-checkout=\"cardExpirationYear\"\n          required\n          [disabled]=\"disabled\"\n          (paste)=\"onPaste()\"\n          (input)=\"onYearChange()\"\n          [(ngModel)]=\"yearText\"\n          #cardExpirationYear=\"ngModel\"\n        />\n      </span>\n    </div>\n\n    <!-- CVC -->\n    <div class=\"formRow\">\n      <label for=\"securityCode\">Código de seguridad</label>\n      <span>\n        <input\n          id=\"securityCode\"\n          type=\"text\"\n          name=\"securityCode\"\n          placeholder=\"CSC\"\n          minlength=\"3\"\n          maxlength=\"4\"\n          data-checkout=\"securityCode\"\n          required\n          [disabled]=\"disabled\"\n          (paste)=\"onPaste()\"\n          (input)=\"onCodeChange()\"\n          [(ngModel)]=\"cvcText\"\n          #securityCode=\"ngModel\"\n        />\n      </span>\n    </div>\n  </div>\n\n  <div>\n    <p\n      [hidden]=\"disabled\"\n      class=\"alert-text\"\n      *ngIf=\"!cardExpirationMonth.valid && submitted\"\n    >\n      Completá el mes de vencimiento.\n    </p>\n    <p\n      [hidden]=\"disabled\"\n      class=\"alert-text\"\n      *ngIf=\"!cardExpirationYear.valid && submitted\"\n    >\n      Completá el año de vencimiento.\n    </p>\n    <p\n      [hidden]=\"disabled\"\n      class=\"alert-text\"\n      *ngIf=\"!securityCode.valid && submitted\"\n    >\n      Ingresá el código de seguridad.\n    </p>\n  </div>\n\n  <!--Cantidad de cuotas-->\n  <div class=\"formRow\">\n    <label for=\"installments\">Cuotas</label>\n    <div class=\"select-icon\">\n      <select\n        id=\"installments\"\n        name=\"installments\"\n        aria-required=\"true\"\n        required\n        ngModel\n        [(ngModel)]=\"installments\"\n        (change)=\"onInstallmentsChange()\"\n        [disabled]=\"disabledSelect\"\n        #inst=\"ngModel\"\n      >\n        <option value=\"0\" disabled selected>Sin Seleccionar...</option>\n        <option\n          *ngFor=\"let current of currentInstallments\"\n          [value]=\"current.value\"\n        >\n          {{ current.label }}\n        </option>\n      </select>\n    </div>\n    <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!inst.valid && submitted\">\n      Elegí la cantidad de cuotas.\n    </p>\n  </div>\n\n  <div class=\"formRow\">\n    <div class=\"form-row-3col\">\n      <!-- Correo electrónico -->\n      <div class=\"formRow\">\n        <label for=\"mail\">Correo electrónico</label>\n        <span>\n          <input\n            id=\"mail\"\n            type=\"text\"\n            name=\"mail\"\n            data-checkout=\"mail\"\n            pattern=\"^[a-z0-9._%+-]+@[a-z0-9.-]+\\.[a-z]{2,4}$\"\n            required\n            [disabled]=\"disabled\"\n            (paste)=\"onPaste()\"\n            (input)=\"onMailChange()\"\n            [(ngModel)]=\"mailText\"\n            #mail=\"ngModel\"\n          />\n        </span>\n      </div>\n\n      <!-- Código de área -->\n      <div class=\"formRow\">\n        <label for=\"codArea\">Cod. Área</label>\n        <span>\n          <input\n            id=\"codArea\"\n            type=\"text\"\n            name=\"codArea\"\n            data-checkout=\"codArea\"\n            minlength=\"2\"\n            maxlength=\"4\"\n            required\n            [disabled]=\"disabled\"\n            (paste)=\"onPaste()\"\n            (input)=\"onCodAreaChange()\"\n            [(ngModel)]=\"codAreaText\"\n            #codArea=\"ngModel\"\n          />\n        </span>\n      </div>\n\n      <!-- Teléfono -->\n      <div class=\"formRow\">\n        <label for=\"tel\">Teléfono</label>\n        <span>\n          <input\n            id=\"tel\"\n            type=\"text\"\n            name=\"tel\"\n            data-checkout=\"tel\"\n            minlength=\"6\"\n            maxlength=\"8\"\n            required\n            [disabled]=\"disabled\"\n            (paste)=\"onPaste()\"\n            (input)=\"onTelChange()\"\n            [(ngModel)]=\"telText\"\n            #tel=\"ngModel\"\n          />\n        </span>\n      </div>\n    </div>\n  </div>\n\n  <div>\n    <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!mail.valid && submitted\">\n      Completá el correo electrónico.\n    </p>\n    <p\n      [hidden]=\"disabled\"\n      class=\"alert-text\"\n      *ngIf=\"!codArea.valid && submitted\"\n    >\n      Completá el código de área.\n    </p>\n    <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!tel.valid && submitted\">\n      Ingresá el teléfono.\n    </p>\n  </div>\n\n  <div *ngIf=\"paymentStatus === 'unsubmitted'\" >\n    <button type=\"submit\">Pagar ${{ totalAmount | number : \"2.2-2\" }}</button>\n  </div>\n\n  <div *ngIf=\"paymentStatus === 'sentCode' || paymentStatus === 'processing'\" >\n    <button type=\"submit\" disabled>Pagar ${{ totalAmount | number : \"2.2-2\" }}</button>\n  </div>\n\n  <div class=\"logo\">\n    <img\n      [src]=\"logoGC\"\n      alt=\"Go Cuotas\"\n      class=\"responsive-img\"\n      style=\"width: 150px\"\n    />\n  </div>\n\n  <div>\n    <div class=\"pay-message info\" *ngIf=\"paymentStatus === 'processing'\">\n      <i class=\"material-icons\">info</i>\n      <p>\n        {{ loadingMessage }}\n      </p>\n    </div>\n  \n    <div class=\"pay-message error\" *ngIf=\"paymentStatus === 'error'\">\n      <i class=\"material-icons\">error</i>\n      <p>\n        {{ error_message }}\n      </p>\n    </div>\n  \n    <div *ngIf=\"paymentStatus === 'success' && paymentCompleted\" class=\"pay-message success\">\n      <i class=\"material-icons\">check_circle</i>\n      <p>\n        Tu pago se ha confirmado!\n        <br />\n        Estos son los datos de la transacción:\n      </p>\n  \n      <i class=\"data\">Nro. de Pago: {{ Opayment.paymentId }}</i>\n      <i class=\"data\">Cod. Autorización: {{ Opayment.sale_token }}</i>\n    </div>\n  \n      <button *ngIf=\"paymentStatus === 'error'\" (click)=\"restartForm()\">\n        Limpiar formulario\n      </button>\n  </div>\n</form>\n\n<lib-modal (codeVerified)=\"onCodeSent($event)\"></lib-modal>","styles":["@charset \"UTF-8\";.gc-payment{background-color:transparent;font-family:inherit,sans-serif}.gc-payment label{font-size:14px;color:#888}.formRow{margin-top:10px}:focus{outline:0}.form-row-2col{display:flex;flex-direction:row;justify-content:space-between;align-items:center;margin-top:10px}.form-row-2col .formRow{width:49%;margin-top:0}.form-row-3col{display:flex;flex-direction:row;justify-content:space-between;align-items:center;margin-top:10px}.form-row-3col .formRow{width:32%;margin-top:0}span{background-color:#fff;border:.5px solid #707070;border-radius:2px;padding:2px 10px;display:block;margin-top:4px}input[type=password],input[type=text]{background:0 0;border:none;color:#000;font-size:15px;height:23px;width:100%;text-transform:uppercase;vertical-align:top}select{width:100%;font-size:15px;height:30px;padding:2px 10px;border:.5px solid #707070;border-radius:2px;display:block;margin-top:4px;-webkit-appearance:none;-moz-appearance:none;position:relative;z-index:1;background:0 0}select:focus{background-color:#e0e0e0;border-color:#009ee3;outline:0}option[disabled]{color:#bbb;font-weight:400}.select-icon{position:relative}.select-icon::after{content:\"\";font-family:\"Material Icons\";position:absolute;right:0;top:3px;font-size:24px}.icon-select{width:24px;position:absolute;right:13px}.alert-text{font-size:13px;color:#009ee3;margin-top:7px;margin-bottom:0}button{background-color:#009ee3;color:#fff;font-size:18px;text-align:center;padding:10px 0;width:100%;border:none;border-radius:20px;margin-top:20px;cursor:pointer}button:disabled{background-color:#525252}.loading-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.8);z-index:2000;display:flex;justify-content:center;align-items:center;color:#fff}.loading-message{display:flex;flex-direction:column;align-items:center;gap:1rem;text-align:center}.spinner{border:4px solid rgba(255,255,255,.2);border-left-color:#fff;border-radius:50%;width:40px;height:40px;-webkit-animation:1s linear infinite spin;animation:1s linear infinite spin}@-webkit-keyframes spin{to{transform:rotate(360deg)}}@keyframes spin{to{transform:rotate(360deg)}}.error-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.8);z-index:2000;display:flex;justify-content:center;align-items:center;color:#fff}.error-message{display:flex;flex-direction:column;align-items:center;text-align:center;gap:1rem;max-width:600px}.error-message p{font-size:1.2rem}.error-message button{background-color:#ff4d4d;color:#fff;border:none;padding:.5rem 1rem;font-size:1rem;border-radius:5px;cursor:pointer;min-width:250px;max-width:250px}.error-message button:hover{background-color:#f33}.success-icon{font-size:3rem;color:#4caf50;margin-bottom:1rem}.logo{display:flex;flex-direction:column;align-items:flex-end;justify-content:flex-end;padding-top:10px}.pay-message{margin-top:10px;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:20px}.pay-message p{font-size:1.1rem;text-align:center;line-height:130%;margin-bottom:10px}.pay-message i.data{font-size:.9rem;text-align:center}.pay-message i.material-icons{font-size:2rem;margin-bottom:5px}.success{background-color:#dff2bf;color:#4f8a10}.error{color:#d8000c;background-color:#ffd2d2}.info{color:#00529b;background-color:#bde5f8}"]}]}],"members":{"accessToken":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":3}}]}],"gcUrlApi":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":15,"character":3}}]}],"vkUrlApi":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":16,"character":3}}]}],"paymentAmount":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":3}}]}],"logoGC":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":18,"character":3}}]}],"idVen":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"storeId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":3}}]}],"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":21,"character":3}}]}],"statusPay":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":22,"character":3}}]}],"checkOutForm":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":58,"character":3},"arguments":["f",{"static":false}]}]}],"modal":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":59,"character":3},"arguments":[{"__symbolic":"reference","name":"ɵl"},{"static":false}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵm"},{"__symbolic":"reference","name":"ɵn"}]}],"ngOnInit":[{"__symbolic":"method"}],"onSubmit":[{"__symbolic":"method"}],"initPayment":[{"__symbolic":"method"}],"initPaymentResponseHandler":[{"__symbolic":"method"}],"onCodeSent":[{"__symbolic":"method"}],"finishPayment":[{"__symbolic":"method"}],"ResponseHandlerError":[{"__symbolic":"method"}],"FinishPaymentResponseHandler":[{"__symbolic":"method"}],"restartForm":[{"__symbolic":"method"}],"onYearChange":[{"__symbolic":"method"}],"onMonthLostFocus":[{"__symbolic":"method"}],"onMonthChange":[{"__symbolic":"method"}],"onCodeChange":[{"__symbolic":"method"}],"onDniChange":[{"__symbolic":"method"}],"onMailChange":[{"__symbolic":"method"}],"onCodAreaChange":[{"__symbolic":"method"}],"onTelChange":[{"__symbolic":"method"}],"onPayerNameChange":[{"__symbolic":"method"}],"onCardChange":[{"__symbolic":"method"}],"onInstallmentsChange":[{"__symbolic":"method"}],"onPaste":[{"__symbolic":"method"}]}},"ɵl":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":2,"character":1},"arguments":[{"selector":"lib-modal","template":"<div class=\"custom-modal-overlay\" [ngClass]=\"{ show: modalVisible }\" *ngIf=\"modalVisible\">\n  <div class=\"custom-modal\">\n    <div class=\"custom-modal-header\">\n      <h5 class=\"custom-modal-title\">Ingrese el código</h5>\n      <button type=\"button\" class=\"custom-modal-close\" (click)=\"closeModal()\">\n        &times;\n      </button>\n    </div>\n    <div class=\"custom-modal-body\">\n      <form (ngSubmit)=\"onSubmitCode()\">\n        <div class=\"form-group\">\n          <label for=\"verificationCode\">Código de verificación:</label>\n          <input type=\"text\" class=\"custom-input\" id=\"verificationCode\" [(ngModel)]=\"verificationCode\" name=\"verificationCode\"\n            required minlength=\"4\" maxlength=\"4\" (input)=\"onVerificationCodeChange()\" #verificationCodeInput=\"ngModel\"/>\n        </div>\n\n        <div *ngIf=\"verificationCodeInput.invalid && verificationCodeInput.touched\" class=\"error-message\">\n            <p *ngIf=\"verificationCodeInput.errors && verificationCodeInput.errors.minlength\"\n                >El código debe tener 4 caracteres.\n            </p>\n            <p *ngIf=\"verificationCodeInput.errors && verificationCodeInput.errors.minlength\">\n                El código debe tener 4 caracteres.\n            </p>\n        </div>\n\n        <button type=\"submit\" class=\"custom-button\" [disabled]=\"verificationCodeInput.invalid\">\n            Verificar\n        </button>\n      </form>\n    </div>\n  </div>\n</div>\n","styles":[".custom-modal-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:rgba(0,0,0,.5);display:flex;justify-content:center;align-items:center;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s;pointer-events:none;z-index:1050}.custom-modal-overlay.show{opacity:1;visibility:visible;pointer-events:auto}.custom-modal{background-color:#fff;border-radius:8px;width:90%;max-width:400px;box-shadow:0 4px 6px rgba(0,0,0,.1);overflow:hidden;-webkit-animation:.3s ease-out fadeIn;animation:.3s ease-out fadeIn;z-index:1060}.custom-modal-header{background-color:#009ee3;color:#fff;padding:15px;display:flex;justify-content:space-between;align-items:center}.custom-modal-title{margin:0;font-size:18px;font-weight:700}.custom-modal-close{background:0 0;border:none;font-size:24px;color:#fff;cursor:pointer}.custom-modal-body{padding:20px}.custom-input{width:100%;padding:10px;border:1px solid #ddd;border-radius:4px;font-size:16px;margin-top:5px;box-sizing:border-box}.custom-button{background-color:#009ee3;color:#fff;border:none;border-radius:4px;padding:10px 20px;font-size:16px;cursor:pointer;margin-top:15px;display:block;width:100%;text-align:center;transition:background-color .3s}.custom-button:hover{background-color:#009ee3}.error-message{color:red;font-size:14px;margin-top:5px}.custom-input.ng-touched.ng-invalid{border-color:red}@-webkit-keyframes fadeIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}"]}]}],"members":{"codeVerified":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":12,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"openModal":[{"__symbolic":"method"}],"closeModal":[{"__symbolic":"method"}],"onSubmitCode":[{"__symbolic":"method"}],"onVerificationCodeChange":[{"__symbolic":"method"}]}},"ɵm":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":5,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClient","line":13,"character":28}]}],"normalizeUrl":[{"__symbolic":"method"}],"initPayment":[{"__symbolic":"method"}],"getOrders":[{"__symbolic":"method"}],"payment":[{"__symbolic":"method"}],"_setAuthHeaders":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}},"ɵn":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":3,"character":1}}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/material/snack-bar","name":"MatSnackBar","line":7,"character":26}]}],"hideNotification":[{"__symbolic":"method"}],"showSnackBarMessage":[{"__symbolic":"method"}],"showSuccess":[{"__symbolic":"method"}],"showError":[{"__symbolic":"method"}],"showWarning":[{"__symbolic":"method"}],"showInfo":[{"__symbolic":"method"}]}}},"origins":{"VkPaymentsModule":"./lib/vk-payments.module","ɵa":"./lib/mercadopago/mercadopago.module","ɵb":"./lib/mercadopago/components/mercadopago.component","ɵc":"./lib/mercadopago/services/mercadopago.api.service","ɵd":"./lib/mercadopago/components/promotion-bank.component","ɵe":"./lib/sps-decidir/sps-decidir.module","ɵf":"./lib/sps-decidir/components/sps-decidir.component","ɵg":"./lib/sps-decidir/services/sps-decidir.api.service","ɵh":"./lib/paypal/paypal.module","ɵi":"./lib/paypal/components/paypal-new.component","ɵj":"./lib/go-cuotas/go-cuotas.module","ɵk":"./lib/go-cuotas/components/go-cuotas.component","ɵl":"./lib/go-cuotas/components/modal/modal.component","ɵm":"./lib/go-cuotas/services/go-cuotas.api.service","ɵn":"./lib/go-cuotas/services/notification.service"},"importAs":"vk-payments"}
+{"__symbolic":"module","version":4,"metadata":{"VkPaymentsModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":14,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","name":"ɵe"},{"__symbolic":"reference","name":"ɵh"},{"__symbolic":"reference","name":"ɵj"}],"exports":[{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","name":"ɵe"},{"__symbolic":"reference","name":"ɵh"},{"__symbolic":"reference","name":"ɵj"}]}]}],"members":{}},"ɵa":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":13,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"ɵb"},{"__symbolic":"reference","name":"ɵd"}],"exports":[{"__symbolic":"reference","name":"ɵb"},{"__symbolic":"reference","name":"ɵd"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":17,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":18,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"ReactiveFormsModule","line":19,"character":4},{"__symbolic":"reference","module":"@angular/router","name":"RouterModule","line":20,"character":4}]}]}],"members":{}},"ɵb":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":11,"character":1},"arguments":[{"selector":"mp-form-pay","template":"<form (ngSubmit)=\"onSubmit(f)\" class=\"mp-payment\" #f=\"ngForm\" autocomplete=\"off\">\r\n  <!-- Titular -->\r\n  <div class=\"formRow\">\r\n    <label for=\"cardholderName\">Nombre y Apellido</label>\r\n    <span>\r\n      <input id=\"cardholderName\" type=\"text\" name=\"cardholderName\" required maxlength=\"22\"\r\n        data-checkout=\"cardholderName\" [disabled]=\"disabled\" (paste)=\"onPaste()\" (input)=\"onPayerNameChange()\"\r\n        [(ngModel)]=\"defaultName\" #cardholderName=\"ngModel\" />\r\n    </span>\r\n    <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!cardholderName.valid && submitted\">\r\n      Ingresá el nombre completo que figura en la tarjeta.\r\n    </p>\r\n  </div>\r\n\r\n  <!-- Numero de tarjeta -->\r\n  <div class=\"formRow\">\r\n    <label for=\"cardNumber\">Nº de Tarjeta</label>\r\n    <span>\r\n      <input id=\"cardNumber\" type=\"text\" name=\"cardNumber\" data-checkout=\"cardNumber\" maxlength=\"19\" required thumbnail\r\n        [disabled]=\"disabled\" (input)=\"onCardChange()\" (keyup)=\"checkPaymentMethod()\" \r\n        (paste)=\"onPaste()\" [(ngModel)]=\"cardText\" #cardNumber=\"ngModel\" />\r\n    </span>\r\n    <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!cardNumber.valid && submitted\">\r\n      Ingresá el número de tarjeta.\r\n    </p>\r\n  </div>\r\n\r\n  <!-- Emisor-->\r\n  <div class=\"formRow\">\r\n    <label for=\"issuer\">Emisor</label>\r\n    <div class=\"select-icon\">\r\n      <select id=\"issuer\" name=\"issuer\" required [disabled]=\"!requiredIssuer || disabled\" [(ngModel)]=\"issuerId\"\r\n        #issuer=\"ngModel\" (change)=\"checkInstallments(true)\">\r\n        <option *ngFor=\"let iss of currentIssuers\" value=\"{{ iss.id }}\">\r\n          {{ iss.name }}\r\n        </option>\r\n      </select>\r\n    </div>\r\n    <p class=\"alert-text\" *ngIf=\"!issuer.valid && requiredIssuer && submitted\">Seleccioná el emisor de la tarjeta.</p>\r\n  </div>\r\n\r\n  <div class=\"form-row-3col\">\r\n    <!-- Expiry-month-->\r\n    <div class=\"formRow\">\r\n      <label for=\"cardExpirationMonth\">Mes</label>\r\n      <span>\r\n        <input id=\"cardExpirationMonth\" type=\"text\" name=\"cardExpirationMonth\" placeholder=\"MM\" minlength=\"2\"\r\n          maxlength=\"2\" data-checkout=\"cardExpirationMonth\" required [disabled]=\"disabled\" (paste)=\"onPaste()\"\r\n          (input)=\"onMonthChange()\" (focusout)=\"onMonthLostFocus()\" [(ngModel)]=\"monthText\"\r\n          #cardExpirationMonth=\"ngModel\" />\r\n      </span>\r\n    </div>\r\n\r\n    <!-- Expiry-year-->\r\n    <div class=\"formRow\">\r\n      <label for=\"cardExpirationYear\">Año</label>\r\n      <span>\r\n        <input id=\"cardExpirationYear\" type=\"text\" name=\"cardExpirationYear\" placeholder=\"AAAA\" minlength=\"4\"\r\n          maxlength=\"4\" data-checkout=\"cardExpirationYear\" required [disabled]=\"disabled\" (paste)=\"onPaste()\"\r\n          (input)=\"onYearChange()\" [(ngModel)]=\"yearText\" #cardExpirationYear=\"ngModel\" />\r\n      </span>\r\n    </div>\r\n\r\n    <!-- CVC -->\r\n    <div class=\"formRow\">\r\n      <label for=\"securityCode\">CVC</label>\r\n      <span>\r\n        <input id=\"securityCode\" type=\"text\" name=\"securityCode\" placeholder=\"CVC\" minlength=\"3\" maxlength=\"4\"\r\n          data-checkout=\"securityCode\" required [disabled]=\"disabled\" (paste)=\"onPaste()\" (input)=\"onCodeChange()\"\r\n          [(ngModel)]=\"cvcText\" #securityCode=\"ngModel\" />\r\n      </span>\r\n    </div>\r\n  </div>\r\n  <div>\r\n    <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!cardExpirationMonth.valid && submitted\">\r\n      Completá el mes de vencimiento.\r\n    </p>\r\n    <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!cardExpirationYear.valid && submitted\">\r\n      Completá el año de vencimiento.\r\n    </p>\r\n    <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!securityCode.valid && submitted\">\r\n      Ingresá el código de seguridad.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"formRow\">\r\n    <div class=\"form-row-2col\">\r\n\r\n      <!-- Tipo de documento-->\r\n      <div class=\"formRow\">\r\n        <label for=\"docType\">Tipo de Doc.</label>\r\n        <div class=\"select-icon\">\r\n          <select id=\"docType\" name=\"docType\" data-checkout=\"docType\" required ngModel [disabled]=\"disabled\"\r\n            [(ngModel)]=\"defaultDocType\" #docType=\"ngModel\">\r\n          </select>\r\n        </div>\r\n      </div>\r\n\r\n      <!-- DNI -->\r\n      <div class=\"formRow\">\r\n        <label for=\"docNumber\">Nº de Doc.</label>\r\n        <span>\r\n          <input id=\"docNumber\" type=\"text\" name=\"docNumber\" data-checkout=\"docNumber\" minlength=\"7\" maxlength=\"8\"\r\n            required [disabled]=\"disabled\" (paste)=\"onPaste()\" (input)=\"onDniChange()\" [(ngModel)]=\"dniText\"\r\n            #docNumber=\"ngModel\" />\r\n        </span>\r\n      </div>\r\n\r\n    </div>\r\n    <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!docNumber.valid && submitted\">\r\n      Completá el número de documento.\r\n    </p>\r\n    <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!docType.valid && submitted\">\r\n      Seleccioná el tipo de documento.\r\n    </p>\r\n  </div>\r\n\r\n  <!--Cantidad de cuotas-->\r\n  <div class=\"formRow\">\r\n    <label for=\"installments\">Cantidad de Cuotas</label>\r\n    <div class=\"select-icon\">\r\n      <select id=\"installments\" name=\"installments\" aria-required=\"true\" aria-invalid=\"false\" required ngModel\r\n        [disabled]=\"disabled\" (change)=\"onDuesSelection(f)\" #installments=\"ngModel\">\r\n        <option *ngFor=\"let current of currentInstallments \" value=\"{{ current.installments }}\">\r\n          {{ current.recommended_message }}\r\n        </option>\r\n      </select>\r\n    </div>\r\n    <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!installments.valid && submitted\">\r\n      Elegí la cantidad de cuotas.\r\n    </p>\r\n  </div>\r\n\r\n  <div>\r\n    <div>\r\n      <div class=\"amount-resume\" *ngIf=\"f.valid\">\r\n        <p>Total al contado</p>\r\n        <h1>$ {{ totalAmount | number:'2.2-2' }}</h1>\r\n        <p>Total financiado</p>\r\n        <h3>$ {{ totalFinancedAmount | number:'2.2-2' }}</h3>\r\n        <p>{{ currentTEA }}</p>\r\n        <p>{{ currentCFT }}</p>\r\n        <div *ngIf=\"paymentState === 'unsubmitted'\r\n          || paymentState.substring(0, 11) === 'cc_rejected'\r\n          || paymentState === 'error'\">\r\n          <button type=\"submit\" (click)=\"onSubmit(f)\">\r\n            Pagar $ {{ totalFinancedAmount | number:'2.2-2' }}\r\n          </button>\r\n        </div>\r\n      </div>\r\n      <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!f.valid\">Completá los campos faltantes.</p>\r\n      <div *ngIf=\"!f.valid\">\r\n        <div *ngIf=\"paymentState !== 'accredited' &&\r\n              paymentState !== 'pending_contingency' &&\r\n              paymentState !== 'pending_review_manual'\">\r\n          <button type=\"submit\" (click)=\"onSubmit(f)\">\r\n            Pagar $ {{ paymentAmount | number:'2.2-2' }}\r\n          </button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</form>\r\n\r\n<div class=\"logo\">\r\n  <img [src]=\"imgMercadoPago\" alt=\"Mercado Pago\" class=\"responsive-img\" style=\"width: 150px;\">\r\n</div>\r\n\r\n<!--IFs-->\r\n<div>\r\n  <div class=\"pay-message info\" *ngIf=\"paymentState === 'processing'\">\r\n    <i class=\"material-icons\">info</i>\r\n    <p>\r\n      Procesando pago...\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message success\" *ngIf=\"paymentState === 'accredited'\">\r\n    <i class=\"material-icons\">check_circle</i>\r\n    <p>\r\n      Tu pago se ha confirmado!\r\n      <br>\r\n      Estos son los datos de la transacción:\r\n    </p>\r\n    <i class=\"data\">Ticket: {{ ticket }}</i>\r\n  </div>\r\n\r\n  <div class=\"pay-message info\" *ngIf=\"paymentState === 'pending_contingency'\">\r\n    <i class=\"material-icons\">info</i>\r\n    <p>\r\n      Estamos procesando el pago.\r\n      <br>\r\n      En menos de una hora te enviaremos por e-mail el resultado.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message info\" *ngIf=\"paymentState === 'pending_review_manual'\">\r\n    <i class=\"material-icons\">info</i>\r\n    <p>\r\n      Estamos procesando el pago.\r\n      <br>\r\n      En menos de 2 días hábiles te diremos por e-mail si se acreditó o si necesitamos más información.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'cc_rejected_bad_filled_card_number'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      Pago Rechazado.\r\n      <br>\r\n      Revisa el número de tarjeta.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'cc_rejected_bad_filled_date'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      Pago Rechazado.\r\n      <br>\r\n      Revisa la fecha de vencimiento.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'cc_rejected_bad_filled_other'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      Pago Rechazado.\r\n      <br>\r\n      Revisa los datos ingresados.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'cc_rejected_bad_filled_security_code'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      Pago Rechazado.\r\n      <br>\r\n      Revisa el código de seguridad.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'cc_rejected_blacklist'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      Pago Rechazado.\r\n      <br>\r\n      No pudimos procesar tu pago.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'cc_rejected_call_for_authorize'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      Pago Rechazado.\r\n      <br>\r\n      Debes autorizar el pago. El teléfono está al dorso de tu tarjeta.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'cc_rejected_card_disabled'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      Pago Rechazado.\r\n      <br>\r\n      Llama para activar tu tarjeta. El teléfono está al dorso de tu tarjeta.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'cc_rejected_card_error'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      Pago Rechazado.\r\n      <br>\r\n      No pudimos procesar tu pago.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'cc_rejected_duplicated_payment'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      Pago Rechazado, ya hiciste un pago por ese valor.\r\n      <br>\r\n      Si necesitas volver a pagar usa otra tarjeta u otro medio de pago..\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'cc_rejected_high_risk'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      Pago Rechazado.\r\n      <br>\r\n      Tu pago fue rechazado.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'cc_rejected_insufficient_amount'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      Pago Rechazado.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'cc_rejected_invalid_installments'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      Pago Rechazado.\r\n      <br>\r\n      No se pudo pocesar el pago en esa cantidad de cuotas.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'cc_rejected_max_attempts'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      Pago Rechazado! Límite de intentos permitidos.\r\n      <br>\r\n      Elige otra tarjeta u otro medio de pago.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'cc_rejected_other_reason'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      Pago Rechazado.\r\n      <br>\r\n      No se procesó el pago.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'error'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>\r\n      {{ errorMessage }}\r\n      <br>No se procesó el pago.\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"pay-message error\" *ngIf=\"paymentState === 'apiError'\">\r\n    <i class=\"material-icons\">error</i>\r\n    <p>Error al procesar el pago (Vitnik).</p>\r\n  </div>\r\n\r\n  <button *ngIf=\"paymentState != 'pending_review_manual' && paymentState != 'pending_contingency'\r\n  && paymentState != 'accredited' && paymentState != 'processing' && paymentState != 'unsubmitted'\" (click)=\"resetForm()\">\r\n    Limpiar formulario\r\n  </button>\r\n\r\n</div>\r\n","styles":["@charset \"UTF-8\";.mp-payment{background-color:transparent;font-family:inherit,sans-serif}.mp-payment label{font-size:14px;color:#888}.formRow{margin-top:10px}:focus{outline:0}.form-row-2col{display:flex;flex-direction:row;justify-content:space-between;align-items:center;margin-top:10px}.form-row-2col .formRow{width:49%;margin-top:0}.form-row-3col{display:flex;flex-direction:row;justify-content:space-between;align-items:center;margin-top:10px}.form-row-3col .formRow{width:32%;margin-top:0}span{background-color:#fff;border:.5px solid #707070;border-radius:2px;padding:2px 10px;display:block;margin-top:4px}input[type=password],input[type=text]{background:0 0;border:none;color:#000;font-size:15px;height:23px;width:100%;text-transform:uppercase;vertical-align:top}select{width:100%;font-size:15px;height:30px;padding:2px 10px;border:.5px solid #707070;border-radius:2px;display:block;margin-top:4px;-webkit-appearance:none;-moz-appearance:none;position:relative;z-index:1;background:0 0}.select-icon{position:relative}.select-icon::after{content:\"\";font-family:\"Material Icons\";position:absolute;right:0;top:3px;font-size:24px}.icon-select{width:24px;position:absolute;right:13px}.alert-text{font-size:13px;color:#009ee3;margin-top:7px;margin-bottom:0}.warn-text{font-size:15px;color:#c62626;margin:10px 0;text-align:center}.confirm-text{font-size:15px;color:#388a22;margin:10px 0;text-align:center}.in-progress-text{font-size:15px;color:#009ee3;margin:10px 0;text-align:center}button{background-color:#009ee3;color:#fff;font-size:18px;text-align:center;padding:10px 0;width:100%;border:none;border-radius:20px;margin-top:20px;cursor:pointer}button:disabled{background-color:#525252}.amount-resume h1,.amount-resume h3{margin-top:0;margin-bottom:10px}.amount-resume p{font-size:13px;color:#525252;margin:5px 0;text-transform:uppercase}.pay-message{margin-top:10px;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:20px}.pay-message p{font-size:1.1rem;text-align:center;line-height:130%;margin-bottom:10px}.pay-message i.data{font-size:.9rem;text-align:center}.pay-message i.material-icons{font-size:2rem;margin-bottom:5px}.success{background-color:#dff2bf;color:#4f8a10}.error{color:#d8000c;background-color:#ffd2d2}.info{color:#00529b;background-color:#bde5f8}.logo{display:flex;flex-direction:column;align-items:flex-end;justify-content:flex-end;padding-top:10px}.responsive-img{width:100%;height:auto}"]}]}],"members":{"paymentAmount":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":50,"character":3}}]}],"payerName":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":51,"character":3}}]}],"payerEmail":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":52,"character":3}}]}],"accessToken":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":53,"character":3}}]}],"vkUrlApi":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":54,"character":3}}]}],"description":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":55,"character":3}}]}],"publishableKey":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":56,"character":3}}]}],"successUrl":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":57,"character":3}}]}],"failureUrl":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":58,"character":3}}]}],"imgCreditCards":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":59,"character":3}}]}],"imgMercadoPago":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":60,"character":3}}]}],"iconExpandMore":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":61,"character":3}}]}],"debugLog":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":62,"character":3}}]}],"storeId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":63,"character":3}}]}],"idVen":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":64,"character":3}}]}],"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":65,"character":3}}]}],"statusPay":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":66,"character":3}}]}],"checkOutForm":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":68,"character":3},"arguments":["f",{"static":false}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":70,"character":30},{"__symbolic":"reference","name":"ɵc"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"initMercadoPago":[{"__symbolic":"method"}],"addMercadopagoScript":[{"__symbolic":"method"}],"createToken":[{"__symbolic":"method"}],"makePayment":[{"__symbolic":"method"}],"hashText":[{"__symbolic":"method"}],"paymentResponseHandler":[{"__symbolic":"method"}],"checkPaymentMethod":[{"__symbolic":"method"}],"setCurrentMethod":[{"__symbolic":"method"}],"checkInstallments":[{"__symbolic":"method"}],"setInstallments":[{"__symbolic":"method"}],"setIssuers":[{"__symbolic":"method"}],"onDuesSelection":[{"__symbolic":"method"}],"onSubmit":[{"__symbolic":"method"}],"onYearChange":[{"__symbolic":"method"}],"onMonthLostFocus":[{"__symbolic":"method"}],"onMonthChange":[{"__symbolic":"method"}],"onCodeChange":[{"__symbolic":"method"}],"onDniChange":[{"__symbolic":"method"}],"onPayerNameChange":[{"__symbolic":"method"}],"onCardChange":[{"__symbolic":"method"}],"onPaste":[{"__symbolic":"method"}],"logger":[{"__symbolic":"method"}],"mercadoPagoPayment":[{"__symbolic":"method"}],"resetForm":[{"__symbolic":"method"}]}},"ɵc":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":6,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClient","line":12,"character":34}]}],"makePayment":[{"__symbolic":"method"}],"getMercadoPagoPromotions":[{"__symbolic":"method"}],"normalizeUrl":[{"__symbolic":"method"}],"_setAuthHeaders":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}},"ɵd":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"mp-promotion","template":"<div *ngIf=\"contentSource === 'api'\" class=\"payments summary\">\r\n  <div id=\"promoBancos\" class=\"promoBancos\">\r\n\r\n    <div *ngFor=\"let promo of cardPromotions | slice:2\" name=\"promociones\" class=\"bank-block col-md-4 col-sm-4\">\r\n      <div class=\"banklogoContainer\">\r\n        <img class=\"img-regular img-responsive\" [src]=\"promo.payment_methods[0].secure_thumbnail\">\r\n      </div>\r\n      <p>\r\n        <span class=\"issuer\">{{promo.issuer.name}}</span>\r\n      </p>\r\n      <p>\r\n        <span class=\"installments\">{{promo.max_installments}} cuotas sin interés</span>\r\n      </p>\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n<iframe src=\"https://www.mercadopago.com.ar/cuotas?iframe=true\"\r\n        width=\"100%\"\r\n        height=\"450px\"\r\n        scrolling=\"yes\"\r\n        frameborder=\"0\"\r\n        style=\"position: relative;\"\r\n        *ngIf=\"contentSource === 'iframe'\">\r\n</iframe>\r\n","styles":[""]}]}],"members":{"url":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":11,"character":3}}]}],"contentSource":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":12,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵc"}]}],"ngOnInit":[{"__symbolic":"method"}]}},"ɵe":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":8,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":10,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":11,"character":4},{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClientModule","line":12,"character":4},{"__symbolic":"reference","module":"@angular/router","name":"RouterModule","line":13,"character":4}],"declarations":[{"__symbolic":"reference","name":"ɵf"}],"exports":[{"__symbolic":"reference","name":"ɵf"}]}]}],"members":{}},"ɵf":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":19,"character":1},"arguments":[{"selector":"sps-form-pay","template":"<!-- https://github.com/decidir/sdk-javascript-v2 -->\r\n\r\n<form action=\"\" method=\"POST\" id=\"formulario\" #f=\"ngForm\" autocomplete=\"off\">\r\n  <!-- Numero de tarjeta -->\r\n  <div class=\"formRow\">\r\n    <label for=\"card_number\">{{ language.toLowerCase() === 'en' ? 'Card number' : 'Número de Tarjeta' }}</label>\r\n    <span>\r\n      <input id=\"card_number\"\r\n             type=\"text\"\r\n             name=\"card\"\r\n             placeholder=\"{{ language.toLowerCase() === 'en' ? 'Card number' : 'Número de Tarjeta' }}\"\r\n             minlength=\"12\"\r\n             maxlength=\"19\"\r\n             pattern=\"[0-9]*\"\r\n             data-decidir=\"card_number\"\r\n             required\r\n             (input)=\"onCardChange()\"\r\n             (paste)=\"onPaste()\"\r\n             [disabled]=\"disabled\"\r\n             [(ngModel)]=\"cardText\"\r\n             #card=\"ngModel\" />\r\n    </span>\r\n    <p class=\"alert-text\" *ngIf=\"card.errors?.required && submitPressed\">\r\n      {{ language.toLowerCase() === 'en' ? 'Required' : 'Completá el número de tarjeta' }}\r\n    </p>\r\n    <p class=\"alert-text\" *ngIf=\"card.errors?.minlength && submitPressed\">\r\n      {{ language.toLowerCase() === 'en' ? 'Required' : 'Requiere 13 digitos mínimo' }}\r\n    </p>\r\n  </div>\r\n\r\n  <!-- Card-issuer -->\r\n  <div class=\"formRow\">\r\n    <label>{{ language.toLowerCase() === 'en' ? 'Pay with' : 'Pagar con' }}</label>\r\n    <div class=\"select-icon\">\r\n      <select name=\"iss\"\r\n              required\r\n              #iss=\"ngModel\"\r\n              [disabled]=\"disableSelect\"\r\n              (change)=\"selectedCreditCard()\"\r\n              [(ngModel)]=\"issuer\">\r\n        <option [value]=\"null\" selected disabled>\r\n          {{ language.toLowerCase() === 'en' ? 'SELECT...' : 'Sin Seleccionar...' }}\r\n        </option>\r\n        <ng-container *ngIf=\"currency === 'USD'; else credCardsArgTemplate\">\r\n          <option [value]=\"1\">Visa</option>\r\n          <option [value]=\"15\">MasterCard</option>\r\n        </ng-container>\r\n        <ng-template #credCardsArgTemplate>\r\n          <option [ngValue]=\"item.id\" *ngFor=\"let item of creditCards\">{{item.name}}</option>\r\n        </ng-template>\r\n      </select>\r\n    </div>\r\n    <p class=\"alert-text\" *ngIf=\"iss.invalid && submitPressed\">\r\n      {{ language.toLowerCase() === 'en' ? 'Required' : 'Seleccioná el emisor de la tarjeta' }}\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"formRow\">\r\n    <div class=\"form-row-2col\">\r\n      <!-- Expiry-month-->\r\n      <div class=\"formRow\">\r\n        <label>\r\n          {{ language.toLowerCase() === 'en' ? 'Month of expiration' : 'Mes de expiración' }}\r\n        </label>\r\n        <span>\r\n          <input type=\"text\"\r\n                 name=\"month\"\r\n                 placeholder=\"MM\"\r\n                 minlength=\"2\"\r\n                 maxlength=\"2\"\r\n                 data-decidir=\"card_expiration_month\"\r\n                 required\r\n                 [disabled]=\"disabled\"\r\n                 (input)=\"onMonthChange()\"\r\n                 (focusout)=\"onMonthLostFocus()\"\r\n                 (paste)=\"onPaste()\"\r\n                 [(ngModel)]=\"monthText\"\r\n                 #month=\"ngModel\" />\r\n        </span>\r\n      </div>\r\n      <!-- Expiry-year-->\r\n      <div class=\"formRow\">\r\n        <label>\r\n          {{ language.toLowerCase() === 'en' ? 'Year of expiration' : 'Año de expiración' }}\r\n        </label>\r\n        <span>\r\n          <input type=\"text\"\r\n                 name=\"year\"\r\n                 placeholder=\"AA\"\r\n                 minlength=\"2\"\r\n                 maxlength=\"2\"\r\n                 data-decidir=\"card_expiration_year\"\r\n                 required\r\n                 [disabled]=\"disabled\"\r\n                 (input)=\"onYearChange()\"\r\n                 (blur)=\"onYearBlur($event)\"\r\n                 (paste)=\"onPaste()\"\r\n                 [(ngModel)]=\"yearText\"\r\n                 #year=\"ngModel\"/>\r\n        </span>\r\n      </div>\r\n    </div>\r\n    <p class=\"alert-text\" *ngIf=\"month.invalid && submitPressed\">\r\n      {{ language.toLowerCase() === 'en' ? 'Required' : 'Completá el mes de vencimiento de la tarjeta' }}</p>\r\n    <p class=\"alert-text\" *ngIf=\"year.invalid && submitPressed\">\r\n      {{ language.toLowerCase() === 'en' ? 'Required' : 'Completá el año de vencimiento de la tarjeta' }}</p>\r\n    <p class=\"alert-text\" *ngIf=\"invalidDate\">\r\n      {{ language.toLowerCase() === 'en' ? 'Enter a valid expiration date' : 'La fecha de la tarjeta ingresada está vencida'}}\r\n    </p>\r\n  </div>\r\n\r\n  <!-- Card-name -->\r\n  <div class=\"formRow\">\r\n    <label>\r\n      {{ language.toLowerCase() === 'en' ? 'Holder name' : 'Nombre y apellido impreso en la tarjeta' }}\r\n    </label>\r\n\r\n    <span>\r\n      <input type=\"text\"\r\n             name=\"payername\"\r\n             placeholder=\"{{language.toLowerCase() === 'en' ? 'Holder name' : 'TITULAR'}}\" value=\"{{payerName}}\"\r\n             maxlength=\"22\"\r\n             data-decidir=\"card_holder_name\"\r\n             required\r\n             [disabled]=\"disabled\"\r\n             (input)=\"onPayerNameChange()\"\r\n             (paste)=\"onPaste()\"\r\n             [(ngModel)]=\"payerNameText\"\r\n             #payername=\"ngModel\" />\r\n    </span>\r\n    <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!payername.valid && submitPressed\">\r\n      {{ language.toLowerCase() === 'en' ? 'Required' : 'Completá el nombre del titular de la tarjeta' }}\r\n    </p>\r\n  </div>\r\n\r\n  <div class=\"formRow\" *ngIf=\"currency === 'USD'\">\r\n    <input type=\"hidden\" data-decidir=\"card_holder_doc_type\" name=\"type\">\r\n    <input type=\"hidden\" data-decidir=\"card_holder_doc_number\" name=\"dni\">\r\n  </div>\r\n\r\n\r\n  <div class=\"formRow\" *ngIf=\"currency === 'ARS'\">\r\n    <label for=\"card_holder_doc_type\">Número de documento del titular</label>\r\n    <div class=\"form-row-2col\">\r\n      <!-- Tipo de documento-->\r\n      <div class=\"formRow\">\r\n        <div class=\"select-icon\">\r\n          <select data-decidir=\"card_holder_doc_type\" ngModel required #type=\"ngModel\" name=\"type\"\r\n                  [disabled]=\"disabled\">\r\n            <option value=\"\" disabled selected>Seleccionar...</option>\r\n            <option value=\"dni\">DNI</option>\r\n            <option value=\"cuil\">CUIL</option>\r\n          </select>\r\n        </div>\r\n      </div>\r\n      <!-- DNI -->\r\n      <div class=\"formRow\">\r\n        <span>\r\n          <input id=\"card_holder_doc_type\"\r\n                 type=\"text\"\r\n                 name=\"dni\"\r\n                 minlength=\"7\"\r\n                 maxlength=\"11\"\r\n                 data-decidir=\"card_holder_doc_number\"\r\n                 required\r\n                 [disabled]=\"disabled\"\r\n                 (input)=\"onDniChange()\"\r\n                 (paste)=\"onPaste()\"\r\n                 [(ngModel)]=\"dniText\"\r\n                 #dni=\"ngModel\" />\r\n        </span>\r\n      </div>\r\n    </div>\r\n    <p class=\"alert-text\" *ngIf=\"type.invalid && submitPressed\">Seleccioná tipo de documento</p>\r\n    <p class=\"alert-text\" *ngIf=\"dni.errors?.minlength && submitPressed\">Requiere 7 digitos mínimo</p>\r\n    <p class=\"alert-text\" *ngIf=\"dni.errors?.required && submitPressed\">Completá el número de documento</p>\r\n  </div>\r\n  <!-- CVV -->\r\n  <div class=\"formRow\">\r\n    <label for=\"security_code\">{{ language.toLowerCase() === 'en' ? 'CSC' : 'Código de seguridad' }}</label>\r\n    <span>\r\n      <input id=\"security_code\"\r\n             type=\"password\"\r\n             name=\"cvc\"\r\n             placeholder=\"CSC\"\r\n             minlength=\"3\"\r\n             maxlength=\"4\"\r\n             data-decidir=\"security_code\"\r\n             required\r\n             [disabled]=\"disabled\"\r\n             (input)=\"onCodeChange()\"\r\n             (paste)=\"onPaste()\"\r\n             [(ngModel)]=\"cvcText\"\r\n             #cvc=\"ngModel\" />\r\n    </span>\r\n    <p class=\"alert-text\" *ngIf=\"cvc.errors?.minlength && submitPressed\">\r\n      {{ language.toLowerCase() === 'en' ? 'Enter a valid csc' : 'Requiere 3 digitos mínimo' }}\r\n    </p>\r\n    <p class=\"alert-text\" *ngIf=\"cvc.errors?.required && submitPressed\">\r\n      {{ language.toLowerCase() === 'en' ? 'Required' : 'Completá el código de seguridad' }}\r\n    </p>\r\n  </div>\r\n\r\n  <!-- Cuotas -->\r\n  <ng-container *ngIf=\"currency === 'ARS'\">\r\n    <div class=\"formRow\">\r\n      <label>Cuotas</label>\r\n      <div class=\"select-icon\">\r\n        <select name=\"ins\"\r\n                required\r\n                [disabled]=\"disabled\"\r\n                [(ngModel)]=\"selectCreditCardPlan\"\r\n                (change)=\"selectedCreditCardPlan()\"\r\n                #ins=\"ngModel\">\r\n          <option [value]=\"null\" selected disabled>Sin Seleccionar...</option>\r\n          <option [ngValue]=\"item\" *ngFor=\"let item of creditCardPlans\">{{ item.description }}</option>\r\n        </select>\r\n      </div>\r\n      <p class=\"alert-text\" *ngIf=\"ins.invalid && submitPressed\">Seleccioná cantidad de cuotas</p>\r\n    </div>\r\n  </ng-container>\r\n\r\n  <div>\r\n    <div>\r\n      <div class=\"amount-resume\" *ngIf=\"f.valid\">\r\n        <ng-container *ngIf=\"currency === 'ARS'\">\r\n          <p>Total al contado</p>\r\n          <h1>$ {{ totalAmount | number:'2.2-2' }}</h1>\r\n          <p>Total financiado</p>\r\n          <h3>$ {{ totalFinancedAmount | number:'2.2-2'}}</h3>\r\n          <p>TEA: {{ currentTEA }}%</p>\r\n          <p>CFT: {{ currentCFT }}%</p>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"currency === 'USD'\">\r\n          <p>Total</p>\r\n          <h1>{{ labelButton }}</h1>\r\n        </ng-container>\r\n        <div *ngIf=\"paymentState === 'unsubmitted'\">\r\n          <button *ngIf=\"currency === 'ARS'\" type=\"submit\" (click)=\"onSubmit($event)\">\r\n            Pagar ${{ totalFinancedAmount | number:'2.2-2' }}\r\n          </button>\r\n\r\n          <button *ngIf=\"currency === 'USD'\" type=\"submit\" (click)=\"onSubmit($event)\">\r\n            {{ labelButton }}\r\n          </button>\r\n        </div>\r\n        <div *ngIf=\"paymentState === 'success' || paymentState === 'processing'\">\r\n          <button *ngIf=\"currency === 'ARS'\" disabled>Pagar $ {{totalFinancedAmount | number:'2.2-2'}}</button>\r\n          <button *ngIf=\"currency === 'USD'\" disabled>{{ labelButton }}</button>\r\n        </div>\r\n      </div>\r\n      <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!f.valid\">\r\n        {{ language.toLowerCase() === 'en' ? 'Complete all fields' : 'Completá los campos faltantes' }}\r\n      </p>\r\n      <div *ngIf=\"!f.valid && paymentState !== 'success' && paymentState !== 'apiError' && paymentState !== 'error'\">\r\n        <button *ngIf=\"currency === 'ARS'\" type=\"submit\" (click)=\"onSubmit($event)\">Pagar $\r\n          {{ paymentAmount | number:'2.2-2' }}\r\n        </button>\r\n        <button *ngIf=\"currency === 'USD'\" type=\"submit\" (click)=\"onSubmit($event)\">\r\n          {{ labelButton }}\r\n        </button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"logo\">\r\n    <img [src]=\"logoSps\" alt=\"SPS Decidir\" class=\"responsive-img\" style=\"width: 50px;\">\r\n  </div>\r\n  <div>\r\n    <div class=\"pay-message info\" *ngIf=\"paymentState === 'processing'\">\r\n      <i class=\"material-icons\">info</i>\r\n      <p>\r\n        {{ language.toLowerCase() === 'en' ? 'Processing payment...' : 'Procesando pago...' }}\r\n      </p>\r\n    </div>\r\n    <div class=\"pay-message error\" *ngIf=\"paymentState === 'error'\">\r\n      <i class=\"material-icons\">error</i>\r\n      <p>\r\n        {{errorMessage}}\r\n        <br>\r\n        {{ language.toLowerCase() === 'en' ? 'Error processing the payment' : 'No se procesó el pago' }}\r\n      </p>\r\n    </div>\r\n    <div *ngIf=\"language.toLowerCase() !== 'en' && paymentState === 'success'\" class=\"pay-message success\">\r\n      <i class=\"material-icons\">check_circle</i>\r\n      <p>\r\n        Tu pago se ha confirmado!\r\n        <br>\r\n        Estos son los datos de la transacción:\r\n      </p>\r\n      <i class=\"data\">Nro. de Pago: {{paymentSuccessInfo.payment_id}}</i>\r\n      <i class=\"data\">Ticket: {{paymentSuccessInfo.ticket}}</i>\r\n      <i class=\"data\">Cod. Autorización: {{paymentSuccessInfo.card_authorization_code}}</i>\r\n    </div>\r\n\r\n    <div *ngIf=\"language.toLowerCase() === 'en' && paymentState === 'success'\" class=\"pay-message success\">\r\n      <i class=\"material-icons\">check_circle</i>\r\n      <p>\r\n        Your payment has been confirmed!\r\n        <br>\r\n        These are the transaction data:\r\n      </p>\r\n      <i class=\"data\">Payment No.: {{paymentSuccessInfo.payment_id}}</i>\r\n      <i class=\"data\">Ticket: {{paymentSuccessInfo.ticket}}</i>\r\n      <i class=\"data\">Authorization Code: {{paymentSuccessInfo.card_authorization_code}}</i>\r\n    </div>\r\n\r\n    <div class=\"pay-message error\" *ngIf=\"paymentState === 'apiError'\">\r\n      <i class=\"material-icons\">error</i>\r\n      <p>\r\n        {{ language.toLowerCase() === 'en' ? 'Error processing the payment (Vitnik)' : 'Error al procesar el pago (Vitnik)'}}\r\n      </p>\r\n    </div>\r\n\r\n    <button *ngIf=\"language.toLowerCase() === 'es' && (paymentState === 'apiError' || paymentState === 'error')\" (click)=\"resetForm()\">\r\n      Limpiar formulario\r\n    </button>\r\n    <button *ngIf=\"language.toLowerCase() === 'en' && (paymentState === 'apiError' || paymentState === 'error')\" (click)=\"resetForm()\">\r\n      Clear form\r\n    </button>\r\n\r\n  </div>\r\n</form>\r\n","styles":["@charset \"UTF-8\";.flex-row-wrap{display:flex;flex-flow:row wrap;flex-direction:row;justify-content:space-between;align-items:center}.flex-row-wrap div{margin:10px;width:200px;flex-grow:1}#formulario{background-color:transparent;font-family:inherit,sans-serif}#formulario label{font-size:14px;color:#888}.formRow{margin-top:10px}.form-row-2col{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.form-row-2col .formRow{width:49%;margin-top:0}.form-row-3col{display:flex;flex-direction:row;justify-content:space-between;align-items:center}.form-row-3col .formRow{width:32%;margin-top:0}span{background-color:#fff;border:.5px solid #707070;border-radius:2px;padding:2px 10px;display:block;margin-top:4px}input[type=password],input[type=text]{background:0 0;border:none;color:#000;font-size:15px;height:23px;width:100%;text-transform:uppercase;vertical-align:top}select{width:100%;font-size:15px;height:30px;padding:2px 10px;border:.5px solid #707070;border-radius:2px;display:block;margin-top:4px;-webkit-appearance:none;-moz-appearance:none;position:relative;z-index:1;background:0 0}.select-icon{position:relative}.select-icon::after{content:\"\";font-family:\"Material Icons\";position:absolute;right:5px;top:3px;font-size:24px}.icon-select{width:24px;position:absolute;right:13px}.alert-text{font-size:15px;color:#009ee3;margin-top:7px;margin-bottom:0}:focus{outline:0}.pay-message{margin-top:10px;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:20px}.pay-message p{font-size:1.1rem;text-align:center;line-height:130%;margin-bottom:10px}.pay-message i.data{font-size:.9rem;text-align:center}.pay-message i.material-icons{font-size:2rem;margin-bottom:5px}.success{background-color:#dff2bf;color:#4f8a10}.error{color:#d8000c;background-color:#ffd2d2}.info{color:#00529b;background-color:#bde5f8}button{background-color:#009ee3;color:#fff;font-size:18px;text-align:center;padding:10px 0;width:100%;border:none;border-radius:20px;margin-top:20px;cursor:pointer}button:disabled{background-color:#525252;cursor:default}.amount-resume h1,.amount-resume h3{margin-top:0;margin-bottom:10px}.amount-resume p{font-size:13px;color:#525252;margin:5px 0;text-transform:uppercase;line-height:130%}.logo{display:flex;flex-direction:column;align-items:flex-end;justify-content:flex-end;padding-top:10px}.responsive-img{width:100%;height:auto}"]}]}],"members":{"checkOutForm":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":26,"character":3},"arguments":["f",{"static":false}]}]}],"accessToken":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":27,"character":3}}]}],"spsUrlApi":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":28,"character":3}}]}],"vkUrlApi":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":29,"character":3}}]}],"paymentAmount":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":30,"character":3}}]}],"logoSps":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":31,"character":3}}]}],"currency":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":32,"character":3}}]}],"defaultPublishableKey":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":33,"character":3}}]}],"superviellePublishableKey":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":34,"character":3}}]}],"successUrl":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":35,"character":3}}]}],"failureUrl":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":36,"character":3}}]}],"useCybersource":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":37,"character":3}}]}],"debugLog":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":38,"character":3}}]}],"storeId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":39,"character":3}}]}],"domainId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":40,"character":3}}]}],"idVen":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":41,"character":3}}]}],"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":42,"character":3}}]}],"labelButton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":43,"character":3}}]}],"language":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":44,"character":3}}]}],"statusPay":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":45,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":79,"character":30},{"__symbolic":"reference","name":"ɵg"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"initDecidir":[{"__symbolic":"method"}],"addDecidirScript":[{"__symbolic":"method"}],"getCreditCards":[{"__symbolic":"method"}],"getPlansByCreditCardId":[{"__symbolic":"method"}],"initializeSpsDecidir":[{"__symbolic":"method"}],"logger":[{"__symbolic":"method"}],"selectedCreditCard":[{"__symbolic":"method"}],"selectedCreditCardPlan":[{"__symbolic":"method"}],"onSubmit":[{"__symbolic":"method"}],"makePayment":[{"__symbolic":"method"}],"hashText":[{"__symbolic":"method"}],"paymentResponseHandler":[{"__symbolic":"method"}],"processErrorToken":[{"__symbolic":"method"}],"processErrorMessage":[{"__symbolic":"method"}],"compareDate":[{"__symbolic":"method"}],"onYearChange":[{"__symbolic":"method"}],"onYearBlur":[{"__symbolic":"method"}],"onMonthLostFocus":[{"__symbolic":"method"}],"onMonthChange":[{"__symbolic":"method"}],"onCodeChange":[{"__symbolic":"method"}],"onDniChange":[{"__symbolic":"method"}],"onPayerNameChange":[{"__symbolic":"method"}],"onCardChange":[{"__symbolic":"method"}],"setCreditType":[{"__symbolic":"method"}],"onPaste":[{"__symbolic":"method"}],"resetForm":[{"__symbolic":"method"}]}},"ɵg":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":6,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClient","line":12,"character":34}]}],"makePayment":[{"__symbolic":"method"}],"getDecidirConfigByBin":[{"__symbolic":"method"}],"normalizeUrl":[{"__symbolic":"method"}],"getCreditCards":[{"__symbolic":"method"}],"getPlansByCreditCardId":[{"__symbolic":"method"}],"_setAuthHeaders":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}},"ɵh":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":8,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":10,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":11,"character":4},{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClientModule","line":12,"character":4},{"__symbolic":"reference","module":"@angular/router","name":"RouterModule","line":13,"character":4}],"declarations":[{"__symbolic":"reference","name":"ɵi"}],"exports":[{"__symbolic":"reference","name":"ɵi"}]}]}],"members":{}},"ɵi":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":6,"character":1},"arguments":[{"selector":"paypal-new-form-pay","template":"<div *ngIf=\"loading\">Loading...</div>\r\n<input type=\"hidden\" id=\"amount\" [(ngModel)]=\"amount\">\r\n<input type=\"hidden\" id=\"userId\" [(ngModel)]=\"userId\">\r\n<input type=\"hidden\" id=\"storeId\" [(ngModel)]=\"storeId\">\r\n<input type=\"hidden\" id=\"successUrl\" [(ngModel)]=\"successUrl\">\r\n<input type=\"hidden\" id=\"cancelUrl\" [(ngModel)]=\"cancelUrl\">\r\n<input type=\"hidden\" id=\"vkUrlApi\" [(ngModel)]=\"vkUrlApi\">\r\n<input type=\"hidden\" id=\"transactionId\" [(ngModel)]=\"transactionId\">\r\n<input type=\"hidden\" id=\"data\" [(ngModel)]=\"data\">\r\n<input type=\"hidden\" id=\"accessToken\" [(ngModel)]=\"accessToken\">\r\n<div id=\"paypal-button-container\"></div>\r\n","styles":["label{font-size:11px;color:#888;text-transform:uppercase;font-weight:500}.flex-row-wrap{display:flex;flex-flow:row wrap;flex-direction:row;justify-content:space-between;align-items:center}.flex-row-wrap div{margin:10px;width:200px;flex-grow:1}:focus{outline:0}.formRow{margin-top:10px;margin-bottom:10px}.formRow span{background-color:#fff;border:.5px solid #707070;border-radius:5px;padding:5px 10px;display:block;margin-top:7px}input[type=password],input[type=text]{background:0 0;border:none;color:#000;font-size:13px;height:23px;width:100%;text-transform:uppercase}select{width:100%;font-size:13px;height:36px;padding:5px 10px;background-color:#fff;border:.5px solid #707070;border-radius:5px;display:block;margin-top:7px}.icon-select{width:24px;position:absolute;right:13px}.alert-text{font-size:13px;color:#009ee3;margin-top:7px;margin-bottom:0}.warn-text{font-size:15px;color:#c62626;margin:10px 0;text-align:center}.confirm-text{font-size:15px;color:#8cd876;margin:10px 0;text-align:center}.in-progress-text{font-size:15px;color:#009ee3;margin:10px 0;text-align:center}button{background-color:#009ee3;color:#fff;font-size:18px;text-align:center;padding:10px 0;width:100%;border:none;border-radius:20px;margin-top:20px;cursor:pointer}button:disabled{background-color:#525252}.amount-resume h1,.amount-resume h3{margin-top:0;margin-bottom:10px}.amount-resume p{font-size:13px;color:#525252;margin:5px 0;text-transform:uppercase}"]}]}],"members":{"accessToken":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":12,"character":3}}]}],"clientId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":13,"character":3}}]}],"vkUrlApi":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":3}}]}],"storeId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":15,"character":3}}]}],"userId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":16,"character":3}}]}],"transactionId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":3}}]}],"amount":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":18,"character":3}}]}],"currency":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"cancelUrl":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":3}}]}],"successUrl":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":21,"character":3}}]}],"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":22,"character":3}}]}],"urlSignout":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":23,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterViewChecked":[{"__symbolic":"method"}],"addPaypalScript":[{"__symbolic":"method"}]}},"ɵj":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":14,"character":1},"arguments":[{"declarations":[[{"__symbolic":"reference","name":"ɵk"},{"__symbolic":"reference","name":"ɵl"}]],"exports":[[{"__symbolic":"reference","name":"ɵk"},{"__symbolic":"reference","name":"ɵl"}]],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":22,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":23,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"ReactiveFormsModule","line":24,"character":4},{"__symbolic":"reference","module":"@angular/router","name":"RouterModule","line":25,"character":4},{"__symbolic":"reference","module":"@angular/material","name":"MatSnackBarModule","line":26,"character":4}],"providers":[{"__symbolic":"reference","name":"ɵm"}]}]}],"members":{}},"ɵk":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":6,"character":1},"arguments":[{"selector":"lib-go-cuotas","template":"<div *ngIf=\"isLoading && paymentStatus === 'unsubmitted'\" class=\"loading-overlay\">\n  <div class=\"loading-message\">\n    <p>{{ loadingMessage }}</p>\n    <div *ngIf=\"!paymentCompleted\" class=\"spinner\"></div>\n  </div>\n</div>\n\n<form\n  (ngSubmit)=\"onSubmit($event)\"\n  class=\"gc-payment\"\n  id=\"formulario\"\n  #f=\"ngForm\"\n  autocomplete=\"off\"\n>\n  <div class=\"formRow\">\n    <label for=\"cardholderName\">Nombre y Apellido impreso en la tarjeta</label>\n    <span>\n      <input\n        id=\"cardholderName\"\n        type=\"text\"\n        name=\"cardholderName\"\n        required\n        maxlength=\"22\"\n        data-checkout=\"cardholderName\"\n        [disabled]=\"disabled\"\n        (paste)=\"onPaste()\"\n        (input)=\"onPayerNameChange()\"\n        [(ngModel)]=\"defaultName\"\n        pattern=\"^[a-zA-Z\\s]+$\"\n        #cardholderName=\"ngModel\"\n      />\n    </span>\n    <p\n      [hidden]=\"disabled\"\n      class=\"alert-text\"\n      *ngIf=\"!cardholderName.valid && submitted\"\n    >\n      Ingresá el nombre completo que figura en la tarjeta.\n    </p>\n  </div>\n\n  <div class=\"formRow\">\n    <div class=\"form-row-2col\">\n      <!-- Tipo de documento-->\n      <div class=\"formRow\">\n        <label for=\"docType\">Tipo Doc.</label>\n        <div class=\"select-icon\">\n          <select\n            id=\"docType\"\n            name=\"docType\"\n            data-checkout=\"docType\"\n            required\n            ngModel\n            [disabled]=\"disabledSelect\"\n            [(ngModel)]=\"defaultDocType\"\n            #docType=\"ngModel\"\n          >\n            <option value=\"\" disabled selected>Sin Seleccionar...</option>\n            <option value=\"dni\">DNI</option>\n            <option value=\"cuil\">CUIL</option>\n          </select>\n        </div>\n      </div>\n\n      <!-- DNI -->\n      <div class=\"formRow\">\n        <label for=\"docNumber\">Nº de Doc.</label>\n        <span>\n          <input\n            id=\"docNumber\"\n            type=\"text\"\n            name=\"docNumber\"\n            data-checkout=\"docNumber\"\n            minlength=\"7\"\n            maxlength=\"8\"\n            required\n            [disabled]=\"disabled\"\n            (paste)=\"onPaste()\"\n            (input)=\"onDniChange()\"\n            [(ngModel)]=\"dniText\"\n            #docNumber=\"ngModel\"\n          />\n        </span>\n      </div>\n    </div>\n    <p\n      [hidden]=\"disabled\"\n      class=\"alert-text\"\n      *ngIf=\"!docNumber.valid && submitted\"\n    >\n      Completá el número de documento.\n    </p>\n    <p\n      [hidden]=\"disabled\"\n      class=\"alert-text\"\n      *ngIf=\"!docType.valid && submitted\"\n    >\n      Seleccioná el tipo de documento.\n    </p>\n  </div>\n\n  <!-- Numero de tarjeta -->\n  <div class=\"formRow\">\n    <label for=\"cardNumber\">Número de Tarjeta</label>\n    <span>\n      <input\n        id=\"cardNumber\"\n        type=\"text\"\n        name=\"cardNumber\"\n        data-checkout=\"cardNumber\"\n        maxlength=\"19\"\n        required\n        thumbnail\n        (input)=\"onCardChange()\"\n        (paste)=\"onPaste()\"\n        [disabled]=\"disabled\"\n        [(ngModel)]=\"cardText\"\n        #cardNumber=\"ngModel\"\n      />\n    </span>\n    <p\n      [hidden]=\"disabled\"\n      class=\"alert-text\"\n      *ngIf=\"!cardNumber.valid && submitted\"\n    >\n      Ingresá el número de tarjeta.\n    </p>\n  </div>\n\n  <div class=\"form-row-3col\">\n    <!-- Expiry-month-->\n    <div class=\"formRow\">\n      <label for=\"cardExpirationMonth\">Mes de expiración</label>\n      <span>\n        <input\n          id=\"cardExpirationMonth\"\n          type=\"text\"\n          name=\"cardExpirationMonth\"\n          placeholder=\"MM\"\n          minlength=\"2\"\n          maxlength=\"2\"\n          data-checkout=\"cardExpirationMonth\"\n          required\n          [disabled]=\"disabled\"\n          (paste)=\"onPaste()\"\n          (input)=\"onMonthChange()\"\n          (focusout)=\"onMonthLostFocus()\"\n          [(ngModel)]=\"monthText\"\n          #cardExpirationMonth=\"ngModel\"\n        />\n      </span>\n    </div>\n\n    <!-- Expiry-year-->\n    <div class=\"formRow\">\n      <label for=\"cardExpirationYear\">Año de expiración</label>\n      <span>\n        <input\n          id=\"cardExpirationYear\"\n          type=\"text\"\n          name=\"cardExpirationYear\"\n          placeholder=\"AA\"\n          minlength=\"2\"\n          maxlength=\"2\"\n          data-checkout=\"cardExpirationYear\"\n          required\n          [disabled]=\"disabled\"\n          (paste)=\"onPaste()\"\n          (input)=\"onYearChange()\"\n          [(ngModel)]=\"yearText\"\n          #cardExpirationYear=\"ngModel\"\n        />\n      </span>\n    </div>\n\n    <!-- CVC -->\n    <div class=\"formRow\">\n      <label for=\"securityCode\">Código de seguridad</label>\n      <span>\n        <input\n          id=\"securityCode\"\n          type=\"text\"\n          name=\"securityCode\"\n          placeholder=\"CSC\"\n          minlength=\"3\"\n          maxlength=\"4\"\n          data-checkout=\"securityCode\"\n          required\n          [disabled]=\"disabled\"\n          (paste)=\"onPaste()\"\n          (input)=\"onCodeChange()\"\n          [(ngModel)]=\"cvcText\"\n          #securityCode=\"ngModel\"\n        />\n      </span>\n    </div>\n  </div>\n\n  <div>\n    <p\n      [hidden]=\"disabled\"\n      class=\"alert-text\"\n      *ngIf=\"!cardExpirationMonth.valid && submitted\"\n    >\n      Completá el mes de vencimiento.\n    </p>\n    <p\n      [hidden]=\"disabled\"\n      class=\"alert-text\"\n      *ngIf=\"!cardExpirationYear.valid && submitted\"\n    >\n      Completá el año de vencimiento.\n    </p>\n    <p\n      [hidden]=\"disabled\"\n      class=\"alert-text\"\n      *ngIf=\"!securityCode.valid && submitted\"\n    >\n      Ingresá el código de seguridad.\n    </p>\n  </div>\n\n  <!--Cantidad de cuotas-->\n  <div class=\"formRow\">\n    <label for=\"installments\">Cuotas</label>\n    <div class=\"select-icon\">\n      <select\n        id=\"installments\"\n        name=\"installments\"\n        aria-required=\"true\"\n        required\n        ngModel\n        [(ngModel)]=\"installments\"\n        (change)=\"onInstallmentsChange()\"\n        [disabled]=\"disabledSelect\"\n        #inst=\"ngModel\"\n      >\n        <option value=\"0\" disabled selected>Sin Seleccionar...</option>\n        <option\n          *ngFor=\"let current of currentInstallments\"\n          [value]=\"current.value\"\n        >\n          {{ current.label }}\n        </option>\n      </select>\n    </div>\n    <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!inst.valid && submitted\">\n      Elegí la cantidad de cuotas.\n    </p>\n  </div>\n\n  <div class=\"formRow\">\n    <div class=\"form-row-3col\">\n      <!-- Correo electrónico -->\n      <div class=\"formRow\">\n        <label for=\"mail\">Correo electrónico</label>\n        <span>\n          <input\n            id=\"mail\"\n            type=\"text\"\n            name=\"mail\"\n            data-checkout=\"mail\"\n            pattern=\"^[a-z0-9._%+-]+@[a-z0-9.-]+\\.[a-z]{2,4}$\"\n            required\n            [disabled]=\"disabled\"\n            (paste)=\"onPaste()\"\n            (input)=\"onMailChange()\"\n            [(ngModel)]=\"mailText\"\n            #mail=\"ngModel\"\n          />\n        </span>\n      </div>\n\n      <!-- Código de área -->\n      <div class=\"formRow\">\n        <label for=\"codArea\">Cod. Área</label>\n        <span>\n          <input\n            id=\"codArea\"\n            type=\"text\"\n            name=\"codArea\"\n            data-checkout=\"codArea\"\n            minlength=\"2\"\n            maxlength=\"4\"\n            required\n            [disabled]=\"disabled\"\n            (paste)=\"onPaste()\"\n            (input)=\"onCodAreaChange()\"\n            [(ngModel)]=\"codAreaText\"\n            #codArea=\"ngModel\"\n          />\n        </span>\n      </div>\n\n      <!-- Teléfono -->\n      <div class=\"formRow\">\n        <label for=\"tel\">Teléfono</label>\n        <span>\n          <input\n            id=\"tel\"\n            type=\"text\"\n            name=\"tel\"\n            data-checkout=\"tel\"\n            minlength=\"6\"\n            maxlength=\"8\"\n            required\n            [disabled]=\"disabled\"\n            (paste)=\"onPaste()\"\n            (input)=\"onTelChange()\"\n            [(ngModel)]=\"telText\"\n            #tel=\"ngModel\"\n          />\n        </span>\n      </div>\n    </div>\n  </div>\n\n  <div>\n    <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!mail.valid && submitted\">\n      Completá el correo electrónico.\n    </p>\n    <p\n      [hidden]=\"disabled\"\n      class=\"alert-text\"\n      *ngIf=\"!codArea.valid && submitted\"\n    >\n      Completá el código de área.\n    </p>\n    <p [hidden]=\"disabled\" class=\"alert-text\" *ngIf=\"!tel.valid && submitted\">\n      Ingresá el teléfono.\n    </p>\n  </div>\n\n  <div *ngIf=\"paymentStatus === 'unsubmitted'\" >\n    <button type=\"submit\">Pagar ${{ totalAmount | number : \"2.2-2\" }}</button>\n  </div>\n\n  <div *ngIf=\"paymentStatus === 'sentCode' || paymentStatus === 'processing'\" >\n    <button type=\"submit\" disabled>Pagar ${{ totalAmount | number : \"2.2-2\" }}</button>\n  </div>\n\n  <div class=\"logo\">\n    <img\n      [src]=\"logoGC\"\n      alt=\"Go Cuotas\"\n      class=\"responsive-img\"\n      style=\"width: 150px\"\n    />\n  </div>\n\n  <div>\n    <div class=\"pay-message info\" *ngIf=\"paymentStatus === 'processing'\">\n      <i class=\"material-icons\">info</i>\n      <p>\n        {{ loadingMessage }}\n      </p>\n    </div>\n  \n    <div class=\"pay-message error\" *ngIf=\"paymentStatus === 'error'\">\n      <i class=\"material-icons\">error</i>\n      <p>\n        {{ error_message }}\n      </p>\n    </div>\n  \n    <div *ngIf=\"paymentStatus === 'success' && paymentCompleted\" class=\"pay-message success\">\n      <i class=\"material-icons\">check_circle</i>\n      <p>\n        Tu pago se ha confirmado!\n        <br />\n        Estos son los datos de la transacción:\n      </p>\n  \n      <i class=\"data\">Nro. de Pago: {{ Opayment.paymentId }}</i>\n      <i class=\"data\">Cod. Autorización: {{ Opayment.sale_token }}</i>\n    </div>\n  \n      <button *ngIf=\"paymentStatus === 'error'\" (click)=\"restartForm()\">\n        Limpiar formulario\n      </button>\n  </div>\n</form>\n\n<lib-modal (codeVerified)=\"onCodeSent($event)\"></lib-modal>","styles":["@charset \"UTF-8\";.gc-payment{background-color:transparent;font-family:inherit,sans-serif}.gc-payment label{font-size:14px;color:#888}.formRow{margin-top:10px}:focus{outline:0}.form-row-2col{display:flex;flex-direction:row;justify-content:space-between;align-items:center;margin-top:10px}.form-row-2col .formRow{width:49%;margin-top:0}.form-row-3col{display:flex;flex-direction:row;justify-content:space-between;align-items:center;margin-top:10px}.form-row-3col .formRow{width:32%;margin-top:0}span{background-color:#fff;border:.5px solid #707070;border-radius:2px;padding:2px 10px;display:block;margin-top:4px}input[type=password],input[type=text]{background:0 0;border:none;color:#000;font-size:15px;height:23px;width:100%;text-transform:uppercase;vertical-align:top}select{width:100%;font-size:15px;height:30px;padding:2px 10px;border:.5px solid #707070;border-radius:2px;display:block;margin-top:4px;-webkit-appearance:none;-moz-appearance:none;position:relative;z-index:1;background:0 0}select:focus{background-color:#e0e0e0;border-color:#009ee3;outline:0}option[disabled]{color:#bbb;font-weight:400}.select-icon{position:relative}.select-icon::after{content:\"\";font-family:\"Material Icons\";position:absolute;right:0;top:3px;font-size:24px}.icon-select{width:24px;position:absolute;right:13px}.alert-text{font-size:13px;color:#009ee3;margin-top:7px;margin-bottom:0}button{background-color:#009ee3;color:#fff;font-size:18px;text-align:center;padding:10px 0;width:100%;border:none;border-radius:20px;margin-top:20px;cursor:pointer}button:disabled{background-color:#525252}.loading-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.8);z-index:2000;display:flex;justify-content:center;align-items:center;color:#fff}.loading-message{display:flex;flex-direction:column;align-items:center;gap:1rem;text-align:center}.spinner{border:4px solid rgba(255,255,255,.2);border-left-color:#fff;border-radius:50%;width:40px;height:40px;-webkit-animation:1s linear infinite spin;animation:1s linear infinite spin}@-webkit-keyframes spin{to{transform:rotate(360deg)}}@keyframes spin{to{transform:rotate(360deg)}}.error-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.8);z-index:2000;display:flex;justify-content:center;align-items:center;color:#fff}.error-message{display:flex;flex-direction:column;align-items:center;text-align:center;gap:1rem;max-width:600px}.error-message p{font-size:1.2rem}.error-message button{background-color:#ff4d4d;color:#fff;border:none;padding:.5rem 1rem;font-size:1rem;border-radius:5px;cursor:pointer;min-width:250px;max-width:250px}.error-message button:hover{background-color:#f33}.success-icon{font-size:3rem;color:#4caf50;margin-bottom:1rem}.logo{display:flex;flex-direction:column;align-items:flex-end;justify-content:flex-end;padding-top:10px}.pay-message{margin-top:10px;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:20px}.pay-message p{font-size:1.1rem;text-align:center;line-height:130%;margin-bottom:10px}.pay-message i.data{font-size:.9rem;text-align:center}.pay-message i.material-icons{font-size:2rem;margin-bottom:5px}.success{background-color:#dff2bf;color:#4f8a10}.error{color:#d8000c;background-color:#ffd2d2}.info{color:#00529b;background-color:#bde5f8}"]}]}],"members":{"accessToken":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":13,"character":3}}]}],"gcUrlApi":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":3}}]}],"vkUrlApi":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":15,"character":3}}]}],"paymentAmount":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":16,"character":3}}]}],"logoGC":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":3}}]}],"idVen":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":18,"character":3}}]}],"storeId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":3}}]}],"statusPay":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":21,"character":3}}]}],"checkOutForm":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":55,"character":3},"arguments":["f",{"static":false}]}]}],"modal":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":56,"character":3},"arguments":[{"__symbolic":"reference","name":"ɵl"},{"static":false}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"ɵm"}]}],"ngOnInit":[{"__symbolic":"method"}],"onSubmit":[{"__symbolic":"method"}],"initPayment":[{"__symbolic":"method"}],"initPaymentResponseHandler":[{"__symbolic":"method"}],"onCodeSent":[{"__symbolic":"method"}],"finishPayment":[{"__symbolic":"method"}],"ResponseHandlerError":[{"__symbolic":"method"}],"FinishPaymentResponseHandler":[{"__symbolic":"method"}],"restartForm":[{"__symbolic":"method"}],"onYearChange":[{"__symbolic":"method"}],"onMonthLostFocus":[{"__symbolic":"method"}],"onMonthChange":[{"__symbolic":"method"}],"onCodeChange":[{"__symbolic":"method"}],"onDniChange":[{"__symbolic":"method"}],"onMailChange":[{"__symbolic":"method"}],"onCodAreaChange":[{"__symbolic":"method"}],"onTelChange":[{"__symbolic":"method"}],"onPayerNameChange":[{"__symbolic":"method"}],"onCardChange":[{"__symbolic":"method"}],"onInstallmentsChange":[{"__symbolic":"method"}],"onPaste":[{"__symbolic":"method"}]}},"ɵl":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":2,"character":1},"arguments":[{"selector":"lib-modal","template":"<div class=\"custom-modal-overlay\" [ngClass]=\"{ show: modalVisible }\" *ngIf=\"modalVisible\">\n  <div class=\"custom-modal\">\n    <div class=\"custom-modal-header\">\n      <h5 class=\"custom-modal-title\">Ingrese el código</h5>\n      <button type=\"button\" class=\"custom-modal-close\" (click)=\"closeModal()\">\n        &times;\n      </button>\n    </div>\n    <div class=\"custom-modal-body\">\n      <form (ngSubmit)=\"onSubmitCode()\">\n        <div class=\"form-group\">\n          <label for=\"verificationCode\">Código de verificación:</label>\n          <input type=\"text\" class=\"custom-input\" id=\"verificationCode\" [(ngModel)]=\"verificationCode\" name=\"verificationCode\"\n            required minlength=\"4\" maxlength=\"4\" (input)=\"onVerificationCodeChange()\" #verificationCodeInput=\"ngModel\"/>\n        </div>\n\n        <div *ngIf=\"verificationCodeInput.invalid && verificationCodeInput.touched\" class=\"error-message\">\n            <p *ngIf=\"verificationCodeInput.errors && verificationCodeInput.errors.minlength\"\n                >El código debe tener 4 caracteres.\n            </p>\n            <p *ngIf=\"verificationCodeInput.errors && verificationCodeInput.errors.minlength\">\n                El código debe tener 4 caracteres.\n            </p>\n        </div>\n\n        <button type=\"submit\" class=\"custom-button\" [disabled]=\"verificationCodeInput.invalid\">\n            Verificar\n        </button>\n      </form>\n    </div>\n  </div>\n</div>\n","styles":[".custom-modal-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:rgba(0,0,0,.5);display:flex;justify-content:center;align-items:center;opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s;pointer-events:none;z-index:1050}.custom-modal-overlay.show{opacity:1;visibility:visible;pointer-events:auto}.custom-modal{background-color:#fff;border-radius:8px;width:90%;max-width:400px;box-shadow:0 4px 6px rgba(0,0,0,.1);overflow:hidden;-webkit-animation:.3s ease-out fadeIn;animation:.3s ease-out fadeIn;z-index:1060}.custom-modal-header{background-color:#009ee3;color:#fff;padding:15px;display:flex;justify-content:space-between;align-items:center}.custom-modal-title{margin:0;font-size:18px;font-weight:700}.custom-modal-close{background:0 0;border:none;font-size:24px;color:#fff;cursor:pointer}.custom-modal-body{padding:20px}.custom-input{width:100%;padding:10px;border:1px solid #ddd;border-radius:4px;font-size:16px;margin-top:5px;box-sizing:border-box}.custom-button{background-color:#009ee3;color:#fff;border:none;border-radius:4px;padding:10px 20px;font-size:16px;cursor:pointer;margin-top:15px;display:block;width:100%;text-align:center;transition:background-color .3s}.custom-button:hover{background-color:#009ee3}.error-message{color:red;font-size:14px;margin-top:5px}.custom-input.ng-touched.ng-invalid{border-color:red}@-webkit-keyframes fadeIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}"]}]}],"members":{"codeVerified":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":12,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"openModal":[{"__symbolic":"method"}],"closeModal":[{"__symbolic":"method"}],"onSubmitCode":[{"__symbolic":"method"}],"onVerificationCodeChange":[{"__symbolic":"method"}]}},"ɵm":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":5,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/common/http","name":"HttpClient","line":13,"character":28}]}],"normalizeUrl":[{"__symbolic":"method"}],"initPayment":[{"__symbolic":"method"}],"getOrders":[{"__symbolic":"method"}],"payment":[{"__symbolic":"method"}],"_setAuthHeaders":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}}},"origins":{"VkPaymentsModule":"./lib/vk-payments.module","ɵa":"./lib/mercadopago/mercadopago.module","ɵb":"./lib/mercadopago/components/mercadopago.component","ɵc":"./lib/mercadopago/services/mercadopago.api.service","ɵd":"./lib/mercadopago/components/promotion-bank.component","ɵe":"./lib/sps-decidir/sps-decidir.module","ɵf":"./lib/sps-decidir/components/sps-decidir.component","ɵg":"./lib/sps-decidir/services/sps-decidir.api.service","ɵh":"./lib/paypal/paypal.module","ɵi":"./lib/paypal/components/paypal-new.component","ɵj":"./lib/go-cuotas/go-cuotas.module","ɵk":"./lib/go-cuotas/components/go-cuotas.component","ɵl":"./lib/go-cuotas/components/modal/modal.component","ɵm":"./lib/go-cuotas/services/go-cuotas.api.service"},"importAs":"vk-payments"}

package/esm2015/lib/go-cuotas/services/notification.service.js

@@ -1,86 +0,0 @@
-/**
- * @fileoverview added by tsickle
- * Generated from: lib/go-cuotas/services/notification.service.ts
- * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
- */
-import { Injectable } from '@angular/core';
-import { MatSnackBar } from '@angular/material/snack-bar';
-export class NotificationService {
-    /**
-     * @param {?} snackbar
-     */
-    constructor(snackbar) {
-        this.snackbar = snackbar;
-    }
-    /**
-     * @return {?}
-     */
-    hideNotification() {
-        this.snackbar.dismiss();
-    }
-    /**
-     * @param {?} message
-     * @param {?=} duration
-     * @return {?}
-     */
-    showSnackBarMessage(message, duration) {
-        this.snackbar.open(message, undefined, {
-            duration: duration
-        });
-    }
-    /**
-     * @param {?} message
-     * @param {?} title
-     * @return {?}
-     */
-    showSuccess(message, title) {
-        this.snackbar.open(title + ' ' + message, undefined, {
-            duration: 6000, panelClass: ['success-snackbar']
-        });
-    }
-    /**
-     * @param {?} message
-     * @param {?} title
-     * @return {?}
-     */
-    showError(message, title) {
-        this.snackbar.open(title + ' ' + message, undefined, {
-            duration: 6000, panelClass: ['error-snackbar']
-        });
-    }
-    /**
-     * @param {?} message
-     * @param {?} title
-     * @return {?}
-     */
-    showWarning(message, title) {
-        this.snackbar.open(title + ' ' + message, undefined, {
-            duration: 6000, panelClass: ['warning-snackbar']
-        });
-    }
-    /**
-     * @param {?} message
-     * @param {?} title
-     * @return {?}
-     */
-    showInfo(message, title) {
-        this.snackbar.open(title + ' ' + message, undefined, {
-            duration: 6000, panelClass: ['info-snackbar']
-        });
-    }
-}
-NotificationService.decorators = [
-    { type: Injectable }
-];
-/** @nocollapse */
-NotificationService.ctorParameters = () => [
-    { type: MatSnackBar }
-];
-if (false) {
-    /**
-     * @type {?}
-     * @private
-     */
-    NotificationService.prototype.snackbar;
-}
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibm90aWZpY2F0aW9uLnNlcnZpY2UuanMiLCJzb3VyY2VSb290Ijoibmc6Ly92ay1wYXltZW50cy8iLCJzb3VyY2VzIjpbImxpYi9nby1jdW90YXMvc2VydmljZXMvbm90aWZpY2F0aW9uLnNlcnZpY2UudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7QUFBQSxPQUFPLEVBQUUsVUFBVSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQzNDLE9BQU8sRUFBRSxXQUFXLEVBQUUsTUFBTSw2QkFBNkIsQ0FBQztBQUcxRCxNQUFNLE9BQU8sbUJBQW1COzs7O0lBRTVCLFlBQ1ksUUFBcUI7UUFBckIsYUFBUSxHQUFSLFFBQVEsQ0FBYTtJQUMxQixDQUFDOzs7O0lBRVIsZ0JBQWdCO1FBQ1osSUFBSSxDQUFDLFFBQVEsQ0FBQyxPQUFPLEVBQUUsQ0FBQztJQUM1QixDQUFDOzs7Ozs7SUFFRCxtQkFBbUIsQ0FBQyxPQUFlLEVBQUUsUUFBaUI7UUFDbEQsSUFBSSxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsT0FBTyxFQUFFLFNBQVMsRUFBRTtZQUNuQyxRQUFRLEVBQUUsUUFBUTtTQUNyQixDQUFDLENBQUM7SUFDUCxDQUFDOzs7Ozs7SUFFRCxXQUFXLENBQUMsT0FBZSxFQUFFLEtBQWE7UUFDdEMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsS0FBSyxHQUFHLEdBQUcsR0FBRyxPQUFPLEVBQUUsU0FBUyxFQUFFO1lBQ2pELFFBQVEsRUFBRSxJQUFJLEVBQUUsVUFBVSxFQUFFLENBQUMsa0JBQWtCLENBQUM7U0FDbkQsQ0FBQyxDQUFDO0lBQ1AsQ0FBQzs7Ozs7O0lBRUQsU0FBUyxDQUFDLE9BQWUsRUFBRSxLQUFhO1FBQ3BDLElBQUksQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLEtBQUssR0FBRyxHQUFHLEdBQUcsT0FBTyxFQUFFLFNBQVMsRUFBRTtZQUNqRCxRQUFRLEVBQUUsSUFBSSxFQUFFLFVBQVUsRUFBRSxDQUFDLGdCQUFnQixDQUFDO1NBQ2pELENBQUMsQ0FBQztJQUNQLENBQUM7Ozs7OztJQUVELFdBQVcsQ0FBQyxPQUFlLEVBQUUsS0FBYTtRQUN0QyxJQUFJLENBQUMsUUFBUSxDQUFDLElBQUksQ0FBQyxLQUFLLEdBQUcsR0FBRyxHQUFHLE9BQU8sRUFBRSxTQUFTLEVBQUU7WUFDakQsUUFBUSxFQUFFLElBQUksRUFBRSxVQUFVLEVBQUUsQ0FBQyxrQkFBa0IsQ0FBQztTQUNuRCxDQUFDLENBQUM7SUFDUCxDQUFDOzs7Ozs7SUFFRCxRQUFRLENBQUMsT0FBZSxFQUFFLEtBQWE7UUFDbkMsSUFBSSxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsS0FBSyxHQUFHLEdBQUcsR0FBRyxPQUFPLEVBQUUsU0FBUyxFQUFFO1lBQ2pELFFBQVEsRUFBRSxJQUFJLEVBQUUsVUFBVSxFQUFFLENBQUMsZUFBZSxDQUFDO1NBQ2hELENBQUMsQ0FBQztJQUNQLENBQUM7OztZQXZDSixVQUFVOzs7O1lBRkYsV0FBVzs7Ozs7OztJQU1aLHVDQUE2QiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEluamVjdGFibGUgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgTWF0U25hY2tCYXIgfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbC9zbmFjay1iYXInO1xyXG5cclxuQEluamVjdGFibGUoKVxyXG5leHBvcnQgY2xhc3MgTm90aWZpY2F0aW9uU2VydmljZSB7XHJcblxyXG4gICAgY29uc3RydWN0b3IoXHJcbiAgICAgICAgcHJpdmF0ZSBzbmFja2JhcjogTWF0U25hY2tCYXJcclxuICAgICAgICkgeyB9XHJcblxyXG4gICAgaGlkZU5vdGlmaWNhdGlvbiAoKSB7XHJcbiAgICAgICAgdGhpcy5zbmFja2Jhci5kaXNtaXNzKCk7XHJcbiAgICB9XHJcblxyXG4gICAgc2hvd1NuYWNrQmFyTWVzc2FnZShtZXNzYWdlOiBzdHJpbmcsIGR1cmF0aW9uPzogbnVtYmVyKSB7XHJcbiAgICAgICAgdGhpcy5zbmFja2Jhci5vcGVuKG1lc3NhZ2UsIHVuZGVmaW5lZCwge1xyXG4gICAgICAgICAgICBkdXJhdGlvbjogZHVyYXRpb25cclxuICAgICAgICB9KTtcclxuICAgIH1cclxuXHJcbiAgICBzaG93U3VjY2VzcyhtZXNzYWdlOiBzdHJpbmcsIHRpdGxlOiBzdHJpbmcpIHtcclxuICAgICAgICB0aGlzLnNuYWNrYmFyLm9wZW4odGl0bGUgKyAnICcgKyBtZXNzYWdlLCB1bmRlZmluZWQsIHtcclxuICAgICAgICAgICAgZHVyYXRpb246IDYwMDAsIHBhbmVsQ2xhc3M6IFsnc3VjY2Vzcy1zbmFja2JhciddXHJcbiAgICAgICAgfSk7XHJcbiAgICB9XHJcblxyXG4gICAgc2hvd0Vycm9yKG1lc3NhZ2U6IHN0cmluZywgdGl0bGU6IHN0cmluZywpIHtcclxuICAgICAgICB0aGlzLnNuYWNrYmFyLm9wZW4odGl0bGUgKyAnICcgKyBtZXNzYWdlLCB1bmRlZmluZWQsIHtcclxuICAgICAgICAgICAgZHVyYXRpb246IDYwMDAsIHBhbmVsQ2xhc3M6IFsnZXJyb3Itc25hY2tiYXInXVxyXG4gICAgICAgIH0pO1xyXG4gICAgfVxyXG5cclxuICAgIHNob3dXYXJuaW5nKG1lc3NhZ2U6IHN0cmluZywgdGl0bGU6IHN0cmluZykge1xyXG4gICAgICAgIHRoaXMuc25hY2tiYXIub3Blbih0aXRsZSArICcgJyArIG1lc3NhZ2UsIHVuZGVmaW5lZCwge1xyXG4gICAgICAgICAgICBkdXJhdGlvbjogNjAwMCwgcGFuZWxDbGFzczogWyd3YXJuaW5nLXNuYWNrYmFyJ11cclxuICAgICAgICB9KTtcclxuICAgIH1cclxuXHJcbiAgICBzaG93SW5mbyhtZXNzYWdlOiBzdHJpbmcsIHRpdGxlOiBzdHJpbmcpIHtcclxuICAgICAgICB0aGlzLnNuYWNrYmFyLm9wZW4odGl0bGUgKyAnICcgKyBtZXNzYWdlLCB1bmRlZmluZWQsIHtcclxuICAgICAgICAgICAgZHVyYXRpb246IDYwMDAsIHBhbmVsQ2xhc3M6IFsnaW5mby1zbmFja2JhciddXHJcbiAgICAgICAgfSk7XHJcbiAgICB9XHJcbn0iXX0=