@tonder.io/ionic-full-sdk 0.0.47 → 0.0.48-beta.DEV-1610.2

package/dist/classes/inlineCheckout.d.ts

@@ -2,9 +2,9 @@ import { CollectorIds } from '../helpers/template';
 import { BaseInlineCheckout } from "@tonder.io/ionic-lite-sdk";
 import { IProcessPaymentRequest } from "@tonder.io/ionic-lite-sdk/dist/types/checkout";
 import { ITonderPaymentMethod } from "@tonder.io/ionic-lite-sdk/dist/types/paymentMethod";
-import { IInlineCheckoutOptions, InCollectorContainer } from "../types/commons";
+import { IInlineCheckoutOptions, IInlineCustomizationOptions, InCollectorContainer } from "../types/commons";
 import { IInlineCheckout } from "../types/inlineCheckout";
-export declare class InlineCheckout extends BaseInlineCheckout implements IInlineCheckout {
+export declare class InlineCheckout extends BaseInlineCheckout<IInlineCustomizationOptions> implements IInlineCheckout {
     #private;
     paymentData: {};
     collectContainer: InCollectorContainer | null;
@@ -16,12 +16,10 @@ export declare class InlineCheckout extends BaseInlineCheckout implements IInlin
     injectInterval: any;
     abortRefreshCardsController: AbortController;
     containerId: string;
-    accordionC: {
-        open: any;
-        closeAll: any;
-    } | null;
     injected: boolean;
     cardsInjected: boolean;
+    accordionCards: any;
+    accordionPaymentMethods: any;
     apmsInjected: boolean;
     apmsData: ITonderPaymentMethod[];
     collectorIds: CollectorIds;

package/dist/helpers/constants.d.ts

@@ -3,6 +3,7 @@ declare enum PAYMENT_METHOD {
     OXXO = "OXXO",
     SPEI = "SPEI",
     CODI = "CODI",
+    OXXOPAY = "OXXOPAY",
     MERCADOPAGO = "MERCADOPAGO",
     PAYPAL = "PAYPAL",
     COMERCIALMEXICANA = "COMERCIALMEXICANA",

package/dist/helpers/skyflow.d.ts

@@ -3,8 +3,8 @@ import { CollectorIds } from "./template";
 import RevealElement from "skyflow-js/types/core/external/reveal/reveal-element";
 import ComposableElement from "skyflow-js/types/core/external/collect/compose-collect-element";
 import { InCollectorContainer } from "../types/commons";
-export declare function initSkyflow(vaultId: string, vaultUrl: string, baseUrl: string, signal: AbortSignal, customStyles: any, collectorIds: CollectorIds, apiKey: string): Promise<InCollectorContainer>;
-export declare function initUpdateSkyflow(skyflowId: string, vaultId: string, vaultUrl: string, baseUrl: string, signal: AbortSignal, customStyles: any, collectorIds: CollectorIds, apiKey: string): Promise<{
+export declare function initSkyflow(vaultId: string, vaultUrl: string, baseUrl: string, signal: AbortSignal, customStyles: any | undefined, collectorIds: CollectorIds, apiKey: string): Promise<InCollectorContainer>;
+export declare function initUpdateSkyflow(skyflowId: string, vaultId: string, vaultUrl: string, baseUrl: string, signal: AbortSignal, customStyles: any | undefined, collectorIds: CollectorIds, apiKey: string): Promise<{
     container: import("skyflow-js/types/core/external/collect/collect-container").default | import("skyflow-js/types/core/external/collect/compose-collect-container").default | import("skyflow-js/types/core/external/reveal/reveal-container").default;
     elements: {
         cvvElement: CollectElement | ComposableElement | RevealElement;

package/dist/helpers/template.d.ts

@@ -1,5 +1,5 @@
 import { ITonderPaymentMethod } from "@tonder.io/ionic-lite-sdk/dist/types/paymentMethod";
-import { CustomizationOptions } from "@tonder.io/ionic-lite-sdk/dist/types/commons";
+import { IInlineCustomizationOptions } from "../types/commons";
 export type CollectorIds = {
     holderName: string;
     cardNumber: string;
@@ -12,7 +12,9 @@ export type CollectorIds = {
     msgNotification: string;
     cardsListContainer: string;
     apmsListContainer?: string;
+    msgErrorText?: string;
     tdsIframe?: string;
+    msgNotificationText?: string;
 };
 export type Card = {
     card_scheme: string;
@@ -24,7 +26,8 @@ export type Card = {
 };
 export declare const cardTemplate: (data?: {
     renderPaymentButton?: boolean;
-    customization?: CustomizationOptions;
+    renderSaveCardButton?: boolean;
+    customization?: IInlineCustomizationOptions;
     collectorIds: CollectorIds;
     isEnrollmentCard?: boolean;
     customStyles?: any;
@@ -33,7 +36,12 @@ export declare const cardItemsTemplate: (data: {
     cards: Card[];
     collectorIds: CollectorIds;
     renderPaymentButton: boolean;
-    acId: string;
     customStyles: any;
+    customization?: IInlineCustomizationOptions;
+}) => string;
+export declare const apmItemsTemplate: (data: {
+    apms: ITonderPaymentMethod[];
+    collectorIds: CollectorIds;
+    renderPaymentButton?: boolean;
+    customization?: IInlineCustomizationOptions;
 }) => string;
-export declare const apmItemsTemplate: (external: boolean, apms: ITonderPaymentMethod[]) => string;

package/dist/helpers/utils.d.ts

@@ -1,8 +1,8 @@
 import { Card } from "./template";
 export declare function addScripts(): Promise<void>;
 export declare function toCurrency(value: string | number): string | false;
-export declare function showError(message: string, containerId: string, payButtonId: string): void;
-export declare function showMessage(message: string, containerId: string): void;
+export declare function showError(message: string, selectedId?: string | null, containerId?: string, containerTextId?: string): void;
+export declare function showMessage(message: string, selectedId?: string | null, containerId?: string, containerTextId?: string): void;
 export declare const createObserver: ({ target }: {
     target: string;
 }) => Promise<any>;

package/dist/index.d.ts

@@ -1,3 +1,2 @@
-import { Checkout } from './classes/checkout';
 import { InlineCheckout } from './classes/inlineCheckout';
-export { Checkout, InlineCheckout };
+export { InlineCheckout };

package/dist/index.js

@@ -1 +1 @@
-import{AES as n}from"crypto-js";import e from"lodash.get";import t from"skyflow-js";import{BaseInlineCheckout as o}from"@tonder.io/ionic-lite-sdk";import i from"accordion-js";class l{constructor({apiKey:e,type:t="payment",backgroundColor:o="#141414",color:i="#EBEBEB",cb:l=()=>{},url:a="http://checkout.tonder.io/#/"}){this.generateButton=n=>{this.buttonText=n||this.buttonText,this.tonderButton=document.createElement("button"),this.tonderButton.innerHTML=this.buttonText,this.stylishButton(this.tonderButton),this.tonderButton.onclick=this.openCheckout},this.getButton=({buttonText:n})=>(this.generateButton(n),this.tonderButton),this.mountButton=({buttonText:n})=>{this.generateButton(n);const e=document.getElementById("tonder-checkout");try{e&&(e.innerHTML="",e.append(this.tonderButton))}catch(n){console.error(n)}},this.stylishButton=n=>{n.style.backgroundColor=this.backgroundColor,n.style.color=this.color,n.style.display="flex",n.style.justifyContent="center",n.style.border="none",n.style.padding="1rem",n.style.borderRadius="10px",n.style.fontSize="1rem",n.style.width="100%",n.style.boxShadow="0 3px 6px 0 rgba(0,0,0,0.16)"},this.setOrder=({products:n,email:e,shippingCost:t})=>{let o={};return n&&(o.products=n),e&&(o.email=e),t&&(o.shippingCost=t),this.order=Object.assign(Object.assign({},this.order),o),this.order},this.openTabListener=(n,e)=>{const t=setInterval((()=>{n.closed&&(clearInterval(t),e.disabled=!1,e.innerHTML=this.buttonText)}),500)},this.openCheckout=()=>{const e=this.getUrlParams(),t=n.encrypt(e,"url-params-encrypt").toString(),o=encodeURIComponent(t);this.params="?"+o;const i=window.open(this.url+this.params,"_blank","width=1200,height=$800,left=0,top=0");this.tonderButton.disabled=!0,this.tonderButton.innerHTML=`\n      <div class="loader"></div>\n      <style>\n      .loader {\n        border: 4px solid ${this.color};\n        border-radius: 50%;\n        border-top: 4px solid ${this.backgroundColor};\n        width: 0.625rem;\n        height: 0.625rem;\n        -webkit-animation: spin 2s linear infinite; /* Safari */\n          animation: spin 2s linear infinite;\n      }\n\n    /* Safari */\n      @-webkit-keyframes spin {\n        0% { -webkit-transform: rotate(0deg); }\n        100% { -webkit-transform: rotate(360deg); }\n      }\n\n    @keyframes spin {\n      0% { transform: rotate(0deg); }\n      100% { transform: rotate(360deg); }\n    }\n      </style>\n      `,this.openTabListener(i,this.tonderButton)},this.getUrlParams=()=>{const n=Object.assign(Object.assign({apiKey:this.apiKey},this.order),{type:this.type});n.products&&(n.products=JSON.stringify(n.products));return new URLSearchParams(n).toString()},this.url=a,this.apiKey=e,this.type=t,this.backgroundColor=o,this.color=i,this.params="",this.order={},this.buttonText="Proceder al pago",this.cb=l,window.addEventListener("message",this.receiveMessage.bind(this),!1)}receiveMessage(n){try{const e=JSON.parse(n.data);this.cb(e)}catch(e){this.cb(n.data)}}}function a(n,e,t,o){return new(t||(t=Promise))((function(i,l){function a(n){try{s(o.next(n))}catch(n){l(n)}}function r(n){try{s(o.throw(n))}catch(n){l(n)}}function s(n){var e;n.done?i(n.value):(e=n.value,e instanceof t?e:new t((function(n){n(e)}))).then(a,r)}s((o=o.apply(n,e||[])).next())}))}function r(n,e,t,o){if("a"===t&&!o)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof e?n!==e||!o:!e.has(n))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===t?o:"a"===t?o.call(n):o?o.value:e.get(n)}var s;"function"==typeof SuppressedError&&SuppressedError,function(n){n.SORIANA="SORIANA",n.OXXO="OXXO",n.SPEI="SPEI",n.CODI="CODI",n.MERCADOPAGO="MERCADOPAGO",n.PAYPAL="PAYPAL",n.COMERCIALMEXICANA="COMERCIALMEXICANA",n.BANCOMER="BANCOMER",n.WALMART="WALMART",n.BODEGA="BODEGA",n.SAMSCLUB="SAMSCLUB",n.SUPERAMA="SUPERAMA",n.CALIMAX="CALIMAX",n.EXTRA="EXTRA",n.CIRCULOK="CIRCULOK",n.SEVEN11="7ELEVEN",n.TELECOMM="TELECOMM",n.BANORTE="BANORTE",n.BENAVIDES="BENAVIDES",n.DELAHORRO="DELAHORRO",n.ELASTURIANO="ELASTURIANO",n.WALDOS="WALDOS",n.ALSUPER="ALSUPER",n.KIOSKO="KIOSKO",n.STAMARIA="STAMARIA",n.LAMASBARATA="LAMASBARATA",n.FARMROMA="FARMROMA",n.FARMUNION="FARMUNION",n.FARMATODO="FARMATODO",n.SFDEASIS="SFDEASIS",n.FARM911="FARM911",n.FARMECONOMICAS="FARMECONOMICAS",n.FARMMEDICITY="FARMMEDICITY",n.RIANXEIRA="RIANXEIRA",n.WESTERNUNION="WESTERNUNION",n.ZONAPAGO="ZONAPAGO",n.CAJALOSANDES="CAJALOSANDES",n.CAJAPAITA="CAJAPAITA",n.CAJASANTA="CAJASANTA",n.CAJASULLANA="CAJASULLANA",n.CAJATRUJILLO="CAJATRUJILLO",n.EDPYME="EDPYME",n.KASNET="KASNET",n.NORANDINO="NORANDINO",n.QAPAQ="QAPAQ",n.RAIZ="RAIZ",n.PAYSER="PAYSER",n.WUNION="WUNION",n.BANCOCONTINENTAL="BANCOCONTINENTAL",n.GMONEY="GMONEY",n.GOPAY="GOPAY",n.WU="WU",n.PUNTOSHEY="PUNTOSHEY",n.AMPM="AMPM",n.JUMBOMARKET="JUMBOMARKET",n.SMELPUEBLO="SMELPUEBLO",n.BAM="BAM",n.REFACIL="REFACIL",n.ACYVALORES="ACYVALORES"}(s||(s={}));const d={inputStyles:{base:{border:"1px solid #e0e0e0",padding:"10px 7px",borderRadius:"5px",color:"#1d1d1d",marginTop:"2px",backgroundColor:"white",fontFamily:'"Inter", sans-serif',fontSize:"16px","&::placeholder":{color:"#ccc"}},cardIcon:{position:"absolute",left:"6px",bottom:"calc(50% - 12px)"},complete:{color:"#4caf50"},empty:{},focus:{},invalid:{border:"1px solid #f44336"},global:{"@import":'url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;700&display=swap")'}},labelStyles:{base:{fontSize:"12px",fontWeight:"500",fontFamily:'"Inter", sans-serif'}},errorTextStyles:{base:{fontSize:"12px",fontWeight:"500",color:"#f44336",fontFamily:'"Inter", sans-serif'}},labels:{nameLabel:"Titular de la tarjeta",cardLabel:"Número de tarjeta",cvvLabel:"CVC/CVV",expiryDateLabel:"Fecha de expiración"},placeholders:{namePlaceholder:"Nombre como aparece en la tarjeta",cardPlaceholder:"1234 1234 1234 1234",cvvPlaceholder:"3-4 dígitos",expiryMonthPlaceholder:"MM",expiryYearPlaceholder:"AA"}};function c(n,e,t){const o=document.getElementById(`${e}`);o&&(o.classList.add("error-container"),o.innerHTML=n,setTimeout((function(){try{document.querySelector(`#${t}`).disabled=!1}catch(n){}o.classList.remove("error-container"),o.innerHTML=""}),3e3))}function p(n,e){const t=document.getElementById(`${e}`);t&&(t.classList.add("message-container"),t.innerHTML=n,setTimeout((function(){t.classList.remove("message-container"),t.innerHTML=""}),3e3))}const u=n=>"Visa"===n?"https://d35a75syrgujp0.cloudfront.net/cards/visa.png":"Mastercard"===n?"https://d35a75syrgujp0.cloudfront.net/cards/mastercard.png":"American Express"===n?"https://d35a75syrgujp0.cloudfront.net/cards/american_express.png":"https://d35a75syrgujp0.cloudfront.net/cards/default_card.png",m=n=>{const e=Object.assign({},n.fields),t=e.card_number.split("-"),o=t[t.length-1];return e.card_number=`••••${o}`,e},h=n=>n.trim().replace(/\s+/g,"");const v=(n={isEnrollmentCard:!1,collectorIds:{}})=>{var e,t,o,i,l,a,r,s,c,p,m,h,v,y,b,g,f,x,C,E,A,I,S,L,P,_,w,O,j,k,N,M,B,T,R,D,$,U,z,F,Y,H,G,V,W,K,q,X,J,Z,Q,nn,en,tn,on,ln,an,rn,sn,dn,cn,pn,un,mn,hn,vn,yn,bn,gn,fn;return`\n<div class="container-tonder">\n  ${(null===(t=null===(e=n.customization)||void 0===e?void 0:e.saveCards)||void 0===t?void 0:t.showSaved)?`<div id="${n.collectorIds.cardsListContainer}" class="cards-list-container"></div>`:""}\n  ${n.isEnrollmentCard?"":`\n    <div class="pay-new-card">\n      <input checked id="new" class="card_selected" name="card_selected" type="radio"/>\n      <label class="card-item-label-new" for="new">\n        <img class="card-image" src="${u("XXXX")}" />\n        <div class="card-number">Pagar con tarjeta</div>\n      </label>\n    </div>\n  `}\n  <div class="container-form">\n    <div id="${n.collectorIds.holderName}" class="empty-div empty-div-card"></div>\n    <div id="${n.collectorIds.cardNumber}" class="empty-div empty-div-card"></div>\n    <div class="collect-row">\n      <div id="${n.collectorIds.expirationMonth}" class="empty-div empty-div-card"></div>\n      <div id="${n.collectorIds.expirationYear}" class="expiration-year"></div>\n      <div id="${n.collectorIds.cvv}" class="empty-div empty-div-card"></div>\n    </div>\n    ${!n.isEnrollmentCard&&(null===(i=null===(o=n.customization)||void 0===o?void 0:o.saveCards)||void 0===i?void 0:i.showSaveCardOption)?'\n      <div class="checkbox">\n        <input id="save-checkout-card" type="checkbox">\n        <label for="save-checkout-card">\n          Guardar tarjeta para futuros pagos\n        </label>\n      </div>\n    ':""}\n    <div id="${n.collectorIds.msgError}"></div>\n    <div id="${n.collectorIds.msgNotification}"></div>\n  </div>\n  ${n.isEnrollmentCard?"":'\n    <div id="apmsListContainer" class="apms-list-container"></div>\n  '}\n  <div class="container-pay-button">\n    <button id="${n.collectorIds.tonderPayButton}" class="pay-button hidden">Pagar</button>\n  ${n.isEnrollmentCard?`\n    <button id="${n.collectorIds.tonderSaveCardButton?n.collectorIds.tonderSaveCardButton:""}" class="save-card-button">Guardar</button>\n  `:""}  </div>\n  <iframe class="tds-iframe" allowtransparency="true" id="${n.collectorIds.tdsIframe}"></iframe>\n</div>\n\n<style>\n\n@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;700&display=swap");\n\n.tds-iframe {\n  border: none;\n  width: 100vw;\n  height: 100vh;\n  z-index: 30;\n  background-color: transparent;\n}\n\n.error-custom-inputs-tonder {\n  background-color: white;\n  position: absolute;\n  left: 0px;\n  bottom: -1px;\n  width: 100%;\n  font-size: 12px;\n  color: red;\n  font-family: "Inter", sans-serif !important;\n}\n\n.container-form {\n  padding: 25px 30px 0px 30px;\n}\n\n#${n.collectorIds.tdsIframe} {\n  display: none;\n  position: fixed;\n  width: 100vw;\n  height: 100vh;\n  inset: 0px;\n}\n\n.expiration-year .error-custom-inputs-tonder {\n  background-color: white;\n  position: absolute;\n  left: 0px;\n  bottom: 3px;\n  width: 100%;\n  font-size: 12px;\n  color: red;\n  font-family: "Inter", sans-serif !important;\n}\n\n.container-tonder {\n  background-color: #F9F9F9;\n  margin: 0 auto !important;\n  padding: 30px 0px 30px 0px;\n  overflow: hidden;\n  transition: max-height 0.5s ease-out;\n  max-width: 600px;\n  border: solid 1px #e3e3e3;\n}\n\n.container-pay-button{\n  padding: ${n.renderPaymentButton?"30px 30px":""};\n}\n\n.collect-row {\n  display: flex !important;\n  justify-content: space-between !important;\n  width: 100% !important;\n  gap: 16px;\n}\n\n.collect-row > :first-child {\n  min-width: 120px; !important\n}\n\n.expiration-year {\n  position: relative !important;\n  padding-top: 24px !important;\n}\n\n.empty-div {\n  position: relative;\n  margin-top: 2px;\n  margin-bottom: 4px;\n}\n.empty-div-card {\n    height: 80px !important;\n}\n.error-container{\n  color: red !important;\n  background-color: #FFDBDB !important;\n  margin-bottom: 13px !important;\n  font-size: 80% !important;\n  padding: 8px 10px !important;\n  border-radius: 10px !important;\n  text-align: left !important;\n}\n\n.message-container{\n  color: #3bc635 !important;\n  background-color: #DAFCE4 !important;\n  margin-bottom: 13px !important;\n  font-size: 80% !important;\n  padding: 8px 10px !important;\n  border-radius: 10px !important;\n  text-align: left !important;\n}\n\n.pay-button {\n  font-size: 16px;\n  font-weight: bold;\n  min-height: 2.3rem;\n  border-radius: 0.5rem;\n  cursor: pointer;\n  width: 100%;\n  padding: 1rem;\n  text-align: center;\n  border: none;\n  background-color: #000;\n  color: #fff;\n  margin-bottom: 10px;\n  font-family: "Inter", sans-serif !important;\n}\n.hidden{\n  display: none;\n}\n.pay-button:disabled, pay-button[disabled] {\n  background-color: #B9B9B9;\n}\n\n.save-card-button {\n  font-size: 16px;\n  font-weight: bold;\n  min-height: 2.3rem;\n  border-radius: 0.5rem;\n  cursor: pointer;\n  width: 100%;\n  padding: 1rem;\n  text-align: center;\n  border: none;\n  background-color: #000;\n  color: #fff;\n  margin-bottom: 10px;\n  margin-top: 25px;\n  display: none;\n  font-family: "Inter", sans-serif !important;\n}\n\n.save-card-button:disabled, save-card-button[disabled] {\n  background-color: #B9B9B9;\n}\n\n  .tndr-simulate-input-cvv-container{\n      height: 100%;\n      width: 100%;\n      position: absolute;\n      pointer-events: none;\n      \n  }\n  .tndr-simulate-input-cvv {\n      width: 100%;\n      pointer-events: none;\n      position: relative;\n  }\n  .tndr-simulate-input-cvv-container label{\n    line-height: ${(null===(r=null===(a=null===(l=null==n?void 0:n.customStyles)||void 0===l?void 0:l.labelStyles)||void 0===a?void 0:a.base)||void 0===r?void 0:r.lineHeight)?null===(p=null===(c=null===(s=null==n?void 0:n.customStyles)||void 0===s?void 0:s.labelStyles)||void 0===c?void 0:c.base)||void 0===p?void 0:p.lineHeight:""};\n    color: transparent;\n    font-size: ${(null===(v=null===(h=null===(m=null==n?void 0:n.customStyles)||void 0===m?void 0:m.labelStyles)||void 0===h?void 0:h.base)||void 0===v?void 0:v.fontSize)?null===(g=null===(b=null===(y=null==n?void 0:n.customStyles)||void 0===y?void 0:y.labelStyles)||void 0===b?void 0:b.base)||void 0===g?void 0:g.fontSize:d.labelStyles.base.fontSize};\n    font-family: ${(null===(C=null===(x=null===(f=null==n?void 0:n.customStyles)||void 0===f?void 0:f.labelStyles)||void 0===x?void 0:x.base)||void 0===C?void 0:C.fontFamily)?null===(I=null===(A=null===(E=null==n?void 0:n.customStyles)||void 0===E?void 0:E.labelStyles)||void 0===A?void 0:A.base)||void 0===I?void 0:I.fontFamily:d.labelStyles.base.fontFamily};\n    font-weight: ${(null===(P=null===(L=null===(S=null==n?void 0:n.customStyles)||void 0===S?void 0:S.labelStyles)||void 0===L?void 0:L.base)||void 0===P?void 0:P.fontWeight)?null===(O=null===(w=null===(_=null==n?void 0:n.customStyles)||void 0===_?void 0:_.labelStyles)||void 0===w?void 0:w.base)||void 0===O?void 0:O.fontWeight:d.labelStyles.base.fontWeight};\n    text-align: ${(null===(N=null===(k=null===(j=null==n?void 0:n.customStyles)||void 0===j?void 0:j.labelStyles)||void 0===k?void 0:k.base)||void 0===N?void 0:N.textAlign)?null===(T=null===(B=null===(M=null==n?void 0:n.customStyles)||void 0===M?void 0:M.labelStyles)||void 0===B?void 0:B.base)||void 0===T?void 0:T.textAlign:d.labelStyles.base.textAlign};\n    pointer-events: none;\n  }\n  .tndr-simulate-input-cvv input {\n      width: 100%;\n      margin: 0;\n      padding: 0;\n      border: 0;\n      min-height: 44px;\n      background-color: transparent;\n      pointer-events: none;\n  }\n  .tndr-form-label{\n    line-height: ${(null===($=null===(D=null===(R=null==n?void 0:n.customStyles)||void 0===R?void 0:R.labelStyles)||void 0===D?void 0:D.base)||void 0===$?void 0:$.lineHeight)?null===(F=null===(z=null===(U=null==n?void 0:n.customStyles)||void 0===U?void 0:U.labelStyles)||void 0===z?void 0:z.base)||void 0===F?void 0:F.lineHeight:"22px"};\n    color: ${(null===(G=null===(H=null===(Y=null==n?void 0:n.customStyles)||void 0===Y?void 0:Y.labelStyles)||void 0===H?void 0:H.base)||void 0===G?void 0:G.color)?null===(K=null===(W=null===(V=null==n?void 0:n.customStyles)||void 0===V?void 0:V.labelStyles)||void 0===W?void 0:W.base)||void 0===K?void 0:K.color:d.labelStyles.base.color};\n    font-size: ${(null===(J=null===(X=null===(q=null==n?void 0:n.customStyles)||void 0===q?void 0:q.labelStyles)||void 0===X?void 0:X.base)||void 0===J?void 0:J.fontSize)?null===(nn=null===(Q=null===(Z=null==n?void 0:n.customStyles)||void 0===Z?void 0:Z.labelStyles)||void 0===Q?void 0:Q.base)||void 0===nn?void 0:nn.fontSize:d.labelStyles.base.fontSize};\n    font-family: ${(null===(on=null===(tn=null===(en=null==n?void 0:n.customStyles)||void 0===en?void 0:en.labelStyles)||void 0===tn?void 0:tn.base)||void 0===on?void 0:on.fontFamily)?null===(rn=null===(an=null===(ln=null==n?void 0:n.customStyles)||void 0===ln?void 0:ln.labelStyles)||void 0===an?void 0:an.base)||void 0===rn?void 0:rn.fontFamily:d.labelStyles.base.fontFamily};\n    font-weight: ${(null===(cn=null===(dn=null===(sn=null==n?void 0:n.customStyles)||void 0===sn?void 0:sn.labelStyles)||void 0===dn?void 0:dn.base)||void 0===cn?void 0:cn.fontWeight)?null===(mn=null===(un=null===(pn=null==n?void 0:n.customStyles)||void 0===pn?void 0:pn.labelStyles)||void 0===un?void 0:un.base)||void 0===mn?void 0:mn.fontWeight:d.labelStyles.base.fontWeight};\n    text-align: ${(null===(yn=null===(vn=null===(hn=null==n?void 0:n.customStyles)||void 0===hn?void 0:hn.labelStyles)||void 0===vn?void 0:vn.base)||void 0===yn?void 0:yn.textAlign)?null===(fn=null===(gn=null===(bn=null==n?void 0:n.customStyles)||void 0===bn?void 0:bn.labelStyles)||void 0===gn?void 0:gn.base)||void 0===fn?void 0:fn.textAlign:d.labelStyles.base.textAlign};\n  }\n.lds-dual-ring {\n  display: inline-block;\n  width: 14px;\n  height: 14px;\n}\n\n.lds-dual-ring:after {\n  content: " ";\n  display: block;\n  width: 14px;\n  height: 14px;\n  border-radius: 50%;\n  border: 6px solid #fff;\n  border-color: #fff transparent #fff transparent;\n  animation: lds-dual-ring 1.2s linear infinite;\n}\n\n@keyframes lds-dual-ring {\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n}\n\n@media screen and (max-width: 600px) {\n  .payment_method_zplit {\n    font-size: 16px !important;\n    width: 100% !important;\n  }\n\n  .payment_method_zplit  label img {\n    display: none !important;\n  }\n}\n\n.cards-list-container {\n  display: flex;\n  flex-direction: column;\n  padding: 0px;\n  gap: 33% 20px;\n}\n\n.apms-list-container {\n  display: flex;\n  flex-direction: column;\n  gap: 33% 20px;\n  max-height: 300px;\n  overflow-y: auto;\n}\n\n.checkbox label {\n  margin-left: 10px;\n  font-size: 12px;\n  font-weight: 500;\n  color: #1D1D1D;\n  font-family: "Inter", sans-serif !important;\n}\n\n.checkbox {\n  margin-top: 10px;\n  margin-bottom: 20px;\n  margin-left: 10px !important;\n  margin-right: 10px !important;\n  width: 100%;\n  text-align: left;\n}\n\n.pay-new-card {\n  display: flex;\n  justify-content: start;\n  align-items: center;\n  color: #1D1D1D;\n  gap: 33% 15px;\n  margin-top: 10px;\n  margin-bottom: 10px;\n  padding: 0px 30px;\n  width: 100%;\n  position: relative;\n}\n\n.pay-new-card .card-number {\n  font-size: 16px;\n  font-family: "Inter", sans-serif !important;\n}\n\n.card-image {\n  width: 39px;\n  height: 24px;\n  text-align: left;\n}\n\n.card-item-label-new {\n  display: flex;\n  justify-content: start;\n  align-items: center;\n  color: #1D1D1D;\n  gap: 33% 20px;\n  margin-top: 10px;\n  margin-bottom: 10px;\n  width: 100%;\n}\n\n.card_selected {\n  position: relative;\n  width: 16px;\n  height: 16px;\n  appearance: none;\n  cursor: pointer;\n  border-radius: 100%;\n  border: 1px #3bc635 solid;\n  color: #3bc635;\n  transition-property: all;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 150ms;\n}\n\n.card_selected:before {\n  width: 8px;\n  height: 8px;\n  content: "";\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  display: block;\n  transform: translate(-50%, -50%);\n  border-radius: 100%;\n  background-color: #3bc635;\n  opacity: 0;\n  transition-property: opacity;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 150ms;\n}\n\n.card_selected:checked {\n  border: 1px #3bc635 solid;\n  position: relative;\n  width: 16px;\n  height: 16px;\n  appearance: none;\n  cursor: pointer;\n  border-radius: 100%;\n  color: #3bc635;\n  transition-property: all;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 150ms;\n}\n\n.card_selected:checked:before {\n  content: "";\n  border: 1px #3bc635 solid;\n  width: 8px;\n  height: 8px;\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  display: block;\n  transform: translate(-50%, -50%);\n  border-radius: 100%;\n  background-color: #3bc635;\n  opacity: 50;\n  transition-property: opacity;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 150ms;\n}\n\n.card_selected:hover:before {\n  width: 8px;\n  height: 8px;\n  content: "";\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  display: block;\n  transform: translate(-50%, -50%);\n  border-radius: 100%;\n  background-color: #3bc635;\n  transition-property: opacity;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 150ms;\n  opacity: 10;\n}\n\n</style>\n`},y=n=>{const t=n.cards.reduce(((t,o)=>{const{cvvLabel:i}=(l=n.customStyles,{labels:{nameLabel:e(l,"labels.nameLabel",d.labels.nameLabel),cardLabel:e(l,"labels.cardLabel",d.labels.cardLabel),cvvLabel:e(l,"labels.cvvLabel",d.labels.cvvLabel),expiryDateLabel:e(l,"labels.expiryDateLabel",d.labels.expiryDateLabel)},placeholders:{namePlaceholder:e(l,"placeholders.namePlaceholder",d.placeholders.namePlaceholder),cardPlaceholder:e(l,"placeholders.cardPlaceholder",d.placeholders.cardPlaceholder),cvvPlaceholder:e(l,"placeholders.cvvPlaceholder",d.placeholders.cvvPlaceholder),expiryMonthPlaceholder:e(l,"placeholders.expiryMonthPlaceholder",d.placeholders.expiryMonthPlaceholder),expiryYearPlaceholder:e(l,"placeholders.expiryYearPlaceholder",d.placeholders.expiryYearPlaceholder)}}).labels;var l;return`${t}\n    <div class="ac" id="card_container-${o.skyflow_id}">\n      <div class="card-item">\n          <input id="${o.skyflow_id}" class="card_selected" name="card_selected" type="radio"/>\n          <label class="card-item-label" for="${o.skyflow_id}">\n            <img class="card-image" src="${u(o.card_scheme)}" />\n            <div class="card-number">${o.card_number}</div>\n            <div class="card-expiration">Exp. ${o.expiration_month}/${o.expiration_year}</div>\n            <div class="card-delete-icon">\n              <button id="delete_button_${o.skyflow_id}" class="card-delete-button">\n                <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px">\n                  <path fill="currentColor" d="M292.309-140.001q-30.308 0-51.308-21t-21-51.308V-720h-40v-59.999H360v-35.384h240v35.384h179.999V-720h-40v507.691q0 30.308-21 51.308t-51.308 21H292.309ZM376.155-280h59.999v-360h-59.999v360Zm147.691 0h59.999v-360h-59.999v360Z"/>\n                </svg>\n              </button>\n            </div>\n          </label>\n      </div>\n      <div class="ac-panel">\n        <div class="ac-card-panel-container" id="acContainer${o.skyflow_id}">\n        \n           <div class="cvvContainer" id="cvvContainer${o.skyflow_id}">\n             <label class="tndr-form-label label-cvv-cards">${i}</label>\n              <div id="${n.collectorIds.cvv}${o.skyflow_id}" class="empty-div">\n                <div class="tndr-simulate-input-cvv-container">\n                   <div class="tndr-simulate-input-cvv">\n                      <svg class="cvvIcon" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="24" viewBox="0 0 270 178">\n                        <defs>\n                          <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">\n                            <stop offset="0" stop-color="#386bbf"/>\n                            <stop offset="1" stop-color="#032ea3"/>\n                          </linearGradient>\n                          <linearGradient id="linear-gradient-2" x1="0.5" y1="0.115" x2="0.5" y2="1" gradientUnits="objectBoundingBox">\n                            <stop offset="0" stop-color="#1c1c1c"/>\n                            <stop offset="1" stop-color="#151515"/>\n                          </linearGradient>\n                        </defs>\n                        <g id="Grupo_3" data-name="Grupo 3" transform="translate(-69 -312)">\n                          <g id="Grupo_2" data-name="Grupo 2">\n                            <rect id="Rectángulo_58" data-name="Rectángulo 58" width="253" height="165" rx="25" transform="translate(69 312)" fill="url(#linear-gradient)"/>\n                            <rect id="Rectángulo_61" data-name="Rectángulo 61" width="68" height="8" rx="4" transform="translate(86 437)" fill="#fff" opacity="0.877"/>\n                            <rect id="Rectángulo_66" data-name="Rectángulo 66" width="253" height="24" transform="translate(69 347)" fill="url(#linear-gradient-2)"/>\n                            <g id="Elipse_4" data-name="Elipse 4" transform="translate(221 374)" fill="#fff" stroke="#191919" stroke-width="1">\n                              <ellipse cx="59" cy="58" rx="59" ry="58" stroke="none"/>\n                              <ellipse cx="59" cy="58" rx="58.5" ry="57.5" fill="none"/>\n                            </g>\n                          </g>\n                          <text id="_123" data-name="123" transform="translate(240 448)" font-size="45" font-family="Menlo-Regular, Menlo"><tspan x="0" y="0">123</tspan></text>\n                        </g>\n                      </svg>\n                      <input tabindex="-1"/>\n                   </div>\n                 </div>\n              \n              </div>\n           </div>\n           ${(null==n?void 0:n.renderPaymentButton)?`<div class="container-card-pay-button">\n                      <button id="${n.collectorIds.tonderPayButton?n.collectorIds.tonderPayButton:""}${o.skyflow_id}" class="card-pay-button pay-button">Pagar</button>\n                     </div> `:""}\n        </div>\n      </div>\n    </div>`}),""),o=`\n    <style>\n      @import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;700&display=swap");\n      .ac {\n        border: none;\n        background-color: transparent;\n        box-sizing: border-box;\n        margin-bottom: 0;\n        border-bottom: 1px solid #e2e8f0;\n      }\n      .ac-card-panel-container{\n        padding: ${(null==n?void 0:n.renderPaymentButton)?"20px 32px 0px 32px":"20px 32px 20px 32px"};\n      }\n      .cvvContainer{\n       max-width: 60%; \n       position: relative;\n       padding: 0 0 0 29px;\n      }\n      .cvvIcon {\n        position: absolute;\n        right: 8px;\n        top: 12px;\n        opacity: 0;\n        transform: translateY(10px);\n        transition: opacity 0.3s ease, transform 0.3s ease;\n      }\n      .label-cvv-cards {\n        opacity: 0;\n      }\n      .cvvContainer.show .label-cvv-cards{\n        opacity: 1;\n        transition-delay: 0.3s;\n      }\n      .cvvContainer.show .cvvIcon,\n      .ac-card-panel-container.show .card-pay-button {\n        opacity: 1;\n        transform: translateY(0);\n        transition-delay: 0.3s;\n      }\n      .error-custom-inputs-tonder-cards{\n        bottom: 2px !important;\n      }\n      .container-card-pay-button{\n        margin: 20px 0px;\n      }\n      .card-pay-button{\n        display: block;\n        opacity: 0;\n        transform: translateY(10px);\n        transition: opacity 0.3s ease, transform 0.3s ease;\n      }\n      \n      .ac .ac-header {\n        margin: 0;\n        padding: 0;\n      }\n      \n      .ac .ac-trigger {\n        font:\n          bold 16px "Arial",\n          sans-serif;\n        color: var(--color-black);\n        text-align: left;\n        width: 100%;\n        padding: 8px 32px 8px 8px;\n        display: block;\n        cursor: pointer;\n        background-color: transparent;\n        transition: color 0.25s ease;\n        position: relative;\n        text-decoration: none;\n        margin: 0;\n        border: 0;\n      }\n      \n      .ac .ac-trigger::after {\n        content: "+";\n        text-align: center;\n        width: 15px;\n        transform: translate(0, -50%);\n        position: absolute;\n        right: 10px;\n        top: 50%;\n      }\n      \n      .ac .ac-trigger:focus {\n        color: var(--color-grey);\n      }\n      \n      .ac .ac-panel {\n        overflow: hidden;\n        transition-property: height, visibility;\n        transition-timing-function: ease;\n      }\n      \n      .ac .ac-panel .ac-text {\n        font:\n          15px/24px "Arial",\n          sans-serif;\n        color: var(--color-black);\n        padding: 8px;\n        margin: 0;\n      }\n      \n      .ac.js-enabled .ac-panel {\n        visibility: hidden;\n      }\n      \n      .ac.is-active .ac-panel {\n        visibility: visible;\n      }\n      \n      .ac.is-active > .ac-header .ac-trigger::after {\n        content: "\\2013";\n      }\n      \n      .card-item-label {\n        display: flex;\n        justify-content: space-between;\n        align-items: center;\n        color: #1D1D1D;\n        gap: 33% 20px;\n        margin-top: 15px;\n        margin-bottom: 15px;\n        width: 100%;\n      }\n\n      .card-item {\n        position: relative;\n        display: flex;\n        justify-content: start;\n        align-items: center;\n        gap: 33% 15px;\n        padding: 0px 30px;\n      }\n\n      .card-item .card-number {\n        font-size: 16px;\n        font-family: "Inter", sans-serif !important;\n      }\n\n      .card-item .card-expiration {\n        font-size: 16px;\n        font-family: "Inter", sans-serif !important;\n      }\n\n      .card-image {\n        width: 39px;\n        height: 24px;\n        text-align: left;\n      }\n\n      .card-delete-button {\n        background-color: transparent !important;\n        color: #000000 !important;\n      }\n\n      .card-delete-button:hover {\n        background-color: transparent !important;\n        color: #D91C1C !important;\n      }\n\n      .card_selected {\n        position: relative;\n        width: 16px;\n        height: 16px;\n        appearance: none;\n        cursor: pointer;\n        border-radius: 100%;\n        border: 1px #3bc635 solid;\n        color: #3bc635;\n        transition-property: all;\n        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n        transition-duration: 150ms;\n      }\n      \n      .card_selected:before {\n        width: 8px;\n        height: 8px;\n        content: "";\n        position: absolute;\n        top: 50%;\n        left: 50%;\n        display: block;\n        transform: translate(-50%, -50%);\n        border-radius: 100%;\n        background-color: #3bc635;\n        opacity: 0;\n        transition-property: opacity;\n        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n        transition-duration: 150ms;\n      }\n      \n      .card_selected:checked {\n        border: 1px #3bc635 solid;\n        position: relative;\n        width: 16px;\n        height: 16px;\n        appearance: none;\n        cursor: pointer;\n        border-radius: 100%;\n        color: #3bc635;\n        transition-property: all;\n        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n        transition-duration: 150ms;\n      }\n      \n      .card_selected:checked:before {\n        content: "";\n        border: 1px #3bc635 solid;\n        width: 8px;\n        height: 8px;\n        position: absolute;\n        top: 50%;\n        left: 50%;\n        display: block;\n        transform: translate(-50%, -50%);\n        border-radius: 100%;\n        background-color: #3bc635;\n        opacity: 50;\n        transition-property: opacity;\n        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n        transition-duration: 150ms;\n      }\n      \n      .card_selected:hover:before {\n        width: 8px;\n        height: 8px;\n        content: "";\n        position: absolute;\n        top: 50%;\n        left: 50%;\n        display: block;\n        transform: translate(-50%, -50%);\n        border-radius: 100%;\n        background-color: #3bc635;\n        transition-property: opacity;\n        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n        transition-duration: 150ms;\n        opacity: 10;\n      }\n      @media screen and (max-width: 768px) {\n        .cvvContainer {\n          max-width: 70%;\n        }\n      }\n    \n      @media screen and (max-width: 480px) {\n        .cvvContainer {\n          max-width: 100%;\n        }\n      }\n    </style>\n  `;return`\n  <div class="accordion-container${n.acId}">\n    ${t}\n  </div>\n  ${o}\n  `},b=(n,e)=>`\n  ${e.reduce(((n,e)=>{const t=(n=>{const e=h(n.toUpperCase());return{[s.SORIANA]:{label:"Soriana",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/soriana.png"},[s.OXXO]:{label:"Oxxo",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/oxxo.png"},[s.CODI]:{label:"CoDi",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/codi.png"},[s.SPEI]:{label:"SPEI",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/spei.png"},[s.PAYPAL]:{label:"Paypal",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/paypal.png"},[s.COMERCIALMEXICANA]:{label:"Comercial Mexicana",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/comercial_exicana.png"},[s.BANCOMER]:{label:"Bancomer",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/bancomer.png"},[s.WALMART]:{label:"Walmart",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/walmart.png"},[s.BODEGA]:{label:"Bodega Aurrera",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/bodega_aurrera.png"},[s.SAMSCLUB]:{label:"Sam´s Club",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/sams_club.png"},[s.SUPERAMA]:{label:"Superama",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/superama.png"},[s.CALIMAX]:{label:"Calimax",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/calimax.png"},[s.EXTRA]:{label:"Tiendas Extra",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/tiendas_extra.png"},[s.CIRCULOK]:{label:"Círculo K",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/circulo_k.png"},[s.SEVEN11]:{label:"7 Eleven",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/7_eleven.png"},[s.TELECOMM]:{label:"Telecomm",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/telecomm.png"},[s.BANORTE]:{label:"Banorte",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/banorte.png"},[s.BENAVIDES]:{label:"Farmacias Benavides",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_benavides.png"},[s.DELAHORRO]:{label:"Farmacias del Ahorro",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_ahorro.png"},[s.ELASTURIANO]:{label:"El Asturiano",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/asturiano.png"},[s.WALDOS]:{label:"Waldos",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/waldos.png"},[s.ALSUPER]:{label:"Alsuper",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/al_super.png"},[s.KIOSKO]:{label:"Kiosko",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/kiosko.png"},[s.STAMARIA]:{label:"Farmacias Santa María",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_santa_maria.png"},[s.LAMASBARATA]:{label:"Farmacias la más barata",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_barata.png"},[s.FARMROMA]:{label:"Farmacias Roma",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_roma.png"},[s.FARMUNION]:{label:"Pago en Farmacias Unión",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_union.png"},[s.FARMATODO]:{label:"Pago en Farmacias Farmatodo",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_farmatodo.png\t"},[s.SFDEASIS]:{label:"Pago en Farmacias San Francisco de Asís",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_san_francisco.png"},[s.FARM911]:{label:"Farmacias 911",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[s.FARMECONOMICAS]:{label:"Farmacias Economicas",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[s.FARMMEDICITY]:{label:"Farmacias Medicity",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[s.RIANXEIRA]:{label:"Rianxeira",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[s.WESTERNUNION]:{label:"Western Union",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[s.ZONAPAGO]:{label:"Zona Pago",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[s.CAJALOSANDES]:{label:"Caja Los Andes",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[s.CAJAPAITA]:{label:"Caja Paita",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[s.CAJASANTA]:{label:"Caja Santa",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[s.CAJASULLANA]:{label:"Caja Sullana",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[s.CAJATRUJILLO]:{label:"Caja Trujillo",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[s.EDPYME]:{label:"Edpyme",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[s.KASNET]:{label:"KasNet",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[s.NORANDINO]:{label:"Norandino",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[s.QAPAQ]:{label:"Qapaq",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[s.RAIZ]:{label:"Raiz",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[s.PAYSER]:{label:"Paysera",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[s.WUNION]:{label:"Western Union",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[s.BANCOCONTINENTAL]:{label:"Banco Continental",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[s.GMONEY]:{label:"Go money",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[s.GOPAY]:{label:"Go pay",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[s.WU]:{label:"Western Union",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[s.PUNTOSHEY]:{label:"Puntoshey",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[s.AMPM]:{label:"Ampm",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[s.JUMBOMARKET]:{label:"Jumbomarket",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[s.SMELPUEBLO]:{label:"Smelpueblo",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[s.BAM]:{label:"Bam",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[s.REFACIL]:{label:"Refacil",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[s.ACYVALORES]:{label:"Acyvalores",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"}}[e]||{icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png",label:""}})(e.payment_method);return`\n    ${n}\n    <div class="apm-item" id="card_container-${e.pk}">\n        <input id="${e.pk}" class="card_selected" name="card_selected" type="radio"/>\n        <label class="apm-item-label" for="${e.pk}">\n          <div class="apm-image">\n            <div class="apm-image-border"></div>\n            <img src="${t.icon}" />\n          </div>\n          <div class="apm-name">${t.label}</div>\n        </label>\n    </div>`}),"")}\n  \n    <style>\n      .apm-item-label {\n        display: flex;\n        justify-content: flex-start;\n        align-items: center;\n        color: #1D1D1D;\n        gap: 33% 10px;\n        margin-top: 15px;\n        margin-bottom: 15px;\n        width: 100%;\n      }\n\n      .apm-item {\n        position: relative;\n        display: flex;\n        justify-content: start;\n        align-items: center;\n        gap: 33% 15px;\n        border-bottom: 1px solid #e2e8f0;\n        padding: 0px 30px;\n      }\n\n      .apm-item:first-child {\n        border-top: 1px solid #e2e8f0;\n      }\n\n      .apm-item .apm-name {\n        font-size: 16px;\n      }\n      .apm-image {\n        width: 30px;\n        height: 30px;\n        position: relative;\n        display: flex;\n        justify-content: center;\n        align-items: center;\n      }\n      .apm-image img {\n        width: auto;\n        height: 30px;\n      }\n      .apm-image-border{\n        position: absolute;\n        border: 1px solid #bababa36;\n        border-radius: 4px;\n        pointer-events: none;\n        box-sizing: border-box;\n        width: 100%;\n        height: 97%;\n      }\n\n      .card_selected {\n        position: relative;\n        width: 16px;\n        min-width: 16px;\n        height: 16px;\n        appearance: none;\n        cursor: pointer;\n        border-radius: 100%;\n        border: 1px #bababa solid;\n        color: #3bc635;\n        transition-property: all;\n        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n        transition-duration: 150ms;\n      }\n      \n      .card_selected:before {\n        width: 8px;\n        height: 8px;\n        content: "";\n        position: absolute;\n        top: 50%;\n        left: 50%;\n        display: block;\n        transform: translate(-50%, -50%);\n        border-radius: 100%;\n        background-color: #3bc635;\n        opacity: 0;\n        transition-property: opacity;\n        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n        transition-duration: 150ms;\n      }\n      \n      .card_selected:checked {\n        border: 1px #3bc635 solid;\n        position: relative;\n        width: 16px;\n        height: 16px;\n        min-width: 16px;\n        appearance: none;\n        cursor: pointer;\n        border-radius: 100%;\n        color: #3bc635;\n        transition-property: all;\n        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n        transition-duration: 150ms;\n      }\n      \n      .card_selected:checked:before {\n        content: "";\n        border: 1px #3bc635 solid;\n        width: 8px;\n        height: 8px;\n        position: absolute;\n        top: 50%;\n        left: 50%;\n        display: block;\n        transform: translate(-50%, -50%);\n        border-radius: 100%;\n        background-color: #3bc635;\n        opacity: 50;\n        transition-property: opacity;\n        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n        transition-duration: 150ms;\n      }\n      \n      .card_selected:hover:before {\n        width: 8px;\n        height: 8px;\n        content: "";\n        position: absolute;\n        top: 50%;\n        left: 50%;\n        display: block;\n        transform: translate(-50%, -50%);\n        border-radius: 100%;\n        background-color: #3bc635;\n        transition-property: opacity;\n        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n        transition-duration: 150ms;\n        opacity: 10;\n      }\n\n    </style>\n  \n  `;function g(n,e,o,i){return a(this,arguments,void 0,(function*(n,e,o,i,l={},a,r){var s,c,p,u,m,h,v,y,b,g,C,A,I,S,L,P,_,w,O,j,k,N,M,B,T,R,D,$,U,z,F,Y,H,G,V,W;const K=(yield f(n,e,o,r,i)).container(t.ContainerType.COLLECT);var q=0===Object.keys(l).length?d:Object.assign(Object.assign({},l),{labels:{nameLabel:(null===(s=null==l?void 0:l.labels)||void 0===s?void 0:s.nameLabel)&&""!==(null===(c=null==l?void 0:l.labels)||void 0===c?void 0:c.nameLabel)?null===(p=null==l?void 0:l.labels)||void 0===p?void 0:p.nameLabel:d.labels.nameLabel,cardLabel:(null===(u=null==l?void 0:l.labels)||void 0===u?void 0:u.cardLabel)&&""!==(null===(m=null==l?void 0:l.labels)||void 0===m?void 0:m.cardLabel)?null===(h=null==l?void 0:l.labels)||void 0===h?void 0:h.cardLabel:d.labels.cardLabel,cvvLabel:(null===(v=null==l?void 0:l.labels)||void 0===v?void 0:v.cvvLabel)&&""!==(null===(y=null==l?void 0:l.labels)||void 0===y?void 0:y.cvvLabel)?null===(b=null==l?void 0:l.labels)||void 0===b?void 0:b.cvvLabel:d.labels.cvvLabel,expiryDateLabel:(null===(g=null==l?void 0:l.labels)||void 0===g?void 0:g.expiryDateLabel)&&""!==(null===(C=null==l?void 0:l.labels)||void 0===C?void 0:C.expiryDateLabel)?null===(A=null==l?void 0:l.labels)||void 0===A?void 0:A.expiryDateLabel:d.labels.expiryDateLabel},placeholders:{namePlaceholder:(null===(I=null==l?void 0:l.placeholders)||void 0===I?void 0:I.namePlaceholder)&&""!==(null===(S=null==l?void 0:l.placeholders)||void 0===S?void 0:S.namePlaceholder)?null===(L=null==l?void 0:l.placeholders)||void 0===L?void 0:L.namePlaceholder:d.placeholders.namePlaceholder,cardPlaceholder:(null===(P=null==l?void 0:l.placeholders)||void 0===P?void 0:P.cardPlaceholder)&&""!==(null===(_=null==l?void 0:l.placeholders)||void 0===_?void 0:_.cardPlaceholder)?null===(w=null==l?void 0:l.placeholders)||void 0===w?void 0:w.cardPlaceholder:d.placeholders.cardPlaceholder,cvvPlaceholder:(null===(O=null==l?void 0:l.placeholders)||void 0===O?void 0:O.cvvPlaceholder)&&""!==(null===(j=null==l?void 0:l.placeholders)||void 0===j?void 0:j.cvvPlaceholder)?null===(k=null==l?void 0:l.placeholders)||void 0===k?void 0:k.cvvPlaceholder:d.placeholders.cvvPlaceholder,expiryMonthPlaceholder:(null===(N=null==l?void 0:l.placeholders)||void 0===N?void 0:N.expiryMonthPlaceholder)&&""!==(null===(M=null==l?void 0:l.placeholders)||void 0===M?void 0:M.expiryMonthPlaceholder)?null===(B=null==l?void 0:l.placeholders)||void 0===B?void 0:B.expiryMonthPlaceholder:d.placeholders.expiryMonthPlaceholder,expiryYearPlaceholder:(null===(T=null==l?void 0:l.placeholders)||void 0===T?void 0:T.expiryYearPlaceholder)&&""!==(null===(R=null==l?void 0:l.placeholders)||void 0===R?void 0:R.expiryYearPlaceholder)?null===(D=null==l?void 0:l.placeholders)||void 0===D?void 0:D.expiryYearPlaceholder:d.placeholders.expiryYearPlaceholder}});const X=Object.assign({},q.inputStyles.base);X.textIndent="44px";const J={type:t.ValidationRuleType.LENGTH_MATCH_RULE,params:{max:70,error:"El campo nombre del titular debe tener menos de 70 caracteres"}},Z=K.create(Object.assign(Object.assign({table:"cards",column:"cardholder_name"},q),{label:null===($=null==q?void 0:q.labels)||void 0===$?void 0:$.nameLabel,placeholder:null===(U=null==q?void 0:q.placeholders)||void 0===U?void 0:U.namePlaceholder,type:t.ElementType.CARDHOLDER_NAME,validations:[J,E]}));"on"in Z&&(Z.on(t.EventName.CHANGE,(n=>{let e=document.getElementById("errorCardHolderIdTonder");e&&n.isValid&&!n.isEmpty&&e.remove()})),Z.on(t.EventName.BLUR,(n=>{let e=document.getElementById(a.holderName),t=document.getElementById("errorCardHolderIdTonder");if(t&&t.remove(),!n.isValid){let t=document.createElement("div");t.classList.add("error-custom-inputs-tonder"),t.id="errorCardHolderIdTonder",t.textContent=n.isEmpty?"El campo es requerido":"El campo titular de la tarjeta es inválido",null==e||e.appendChild(t)}})));const Q=K.create(Object.assign(Object.assign({table:"cards",column:"card_number"},q),{inputStyles:Object.assign(Object.assign({},q.inputStyles),{base:X}),label:null===(z=q.labels)||void 0===z?void 0:z.cardLabel,placeholder:null===(F=q.placeholders)||void 0===F?void 0:F.cardPlaceholder,type:t.ElementType.CARD_NUMBER,validations:[E]}));"on"in Q&&(Q.on(t.EventName.CHANGE,(n=>{let e=document.getElementById("errorCardNumberIdTonder");e&&n.isValid&&!n.isEmpty&&e.remove()})),Q.on(t.EventName.BLUR,(n=>{let e=document.getElementById(a.cardNumber),t=document.getElementById("errorCardNumberIdTonder");if(t&&t.remove(),!n.isValid){let t=document.createElement("div");t.classList.add("error-custom-inputs-tonder"),t.id="errorCardNumberIdTonder",t.textContent=n.isEmpty?"El campo es requerido":"El campo número de tarjeta es inválido",null==e||e.appendChild(t)}})));const nn=K.create(Object.assign(Object.assign({table:"cards",column:"cvv"},q),{label:null===(Y=q.labels)||void 0===Y?void 0:Y.cvvLabel,placeholder:null===(H=q.placeholders)||void 0===H?void 0:H.cvvPlaceholder,type:t.ElementType.CVV,validations:[E]}));"on"in nn&&(nn.on(t.EventName.CHANGE,(n=>{let e=document.getElementById("errorCvvIdTonder");e&&n.isValid&&!n.isEmpty&&e.remove()})),nn.on(t.EventName.BLUR,(n=>{let e=document.getElementById(a.cvv),t=document.getElementById("errorCvvIdTonder");if(t&&t.remove(),!n.isValid){let t=document.createElement("div");t.classList.add("error-custom-inputs-tonder"),t.id="errorCvvIdTonder",t.textContent=n.isEmpty?"El campo es requerido":"El campo es inválido",null==e||e.appendChild(t)}})));const en=K.create(Object.assign(Object.assign({table:"cards",column:"expiration_month"},q),{label:null===(G=q.labels)||void 0===G?void 0:G.expiryDateLabel,placeholder:null===(V=q.placeholders)||void 0===V?void 0:V.expiryMonthPlaceholder,type:t.ElementType.EXPIRATION_MONTH,validations:[E]}));"on"in en&&(en.on(t.EventName.CHANGE,(n=>{let e=document.getElementById("errorExpiryMonthIdTonder");e&&n.isValid&&!n.isEmpty&&e.remove()})),en.on(t.EventName.BLUR,(n=>{let e=document.getElementById(a.expirationMonth),t=document.getElementById("errorExpiryMonthIdTonder");if(t&&t.remove(),!n.isValid){let t=document.createElement("div");t.classList.add("error-custom-inputs-tonder"),t.id="errorExpiryMonthIdTonder",t.textContent=n.isEmpty?"El campo es requerido":"El campo es inválido",null==e||e.appendChild(t)}}))),console.log("collectStylesOptions ====",q);const tn=K.create(Object.assign(Object.assign({table:"cards",column:"expiration_year"},q),{label:"",placeholder:null===(W=q.placeholders)||void 0===W?void 0:W.expiryYearPlaceholder,type:t.ElementType.EXPIRATION_YEAR,validations:[E]}));"on"in tn&&(tn.on(t.EventName.CHANGE,(n=>{let e=document.getElementById("errorExpiryYearIdTonder");e&&n.isValid&&!n.isEmpty&&e.remove()})),tn.on(t.EventName.BLUR,(n=>{let e=document.getElementById(a.expirationYear),t=document.getElementById("errorExpiryYearIdTonder");if(t&&t.remove(),!n.isValid){let t=document.createElement("div");t.classList.add("error-custom-inputs-tonder"),t.id="errorExpiryYearIdTonder",t.textContent=n.isEmpty?"El campo es requerido":"El campo es inválido",null==e||e.appendChild(t)}})));const on={cardNumber:{element:Q,container:`#${a.cardNumber}`},cvv:{element:nn,container:`#${a.cvv}`},expiryMonth:{element:en,container:`#${a.expirationMonth}`},expiryYear:{element:tn,container:`#${a.expirationYear}`},cardHolderName:{element:Z,container:`#${a.holderName}`}};return yield x(on),{container:K,elements:{cardHolderNameElement:Z,cardNumberElement:Q,cvvElement:nn,expiryMonthElement:en,expiryYearElement:tn}}}))}function f(n,e,o,i,l){return a(this,void 0,void 0,(function*(){return t.init({vaultID:n,vaultURL:e,getBearerToken:()=>a(this,void 0,void 0,(function*(){const n=yield fetch(`${o}/api/v1/vault-token/`,{method:"GET",headers:{Authorization:`Token ${i}`},signal:l});if(n.ok){return(yield n.json()).token}throw new Error("Failed to retrieve bearer token")})),options:{logLevel:t.LogLevel.ERROR,env:t.Env.DEV}})}))}function x(n){return a(this,void 0,void 0,(function*(){if("object"!=typeof n||null===n)throw new Error("Invalid configuration object");for(const[e,{element:t,container:o}]of Object.entries(n))t&&o?t.mount(o):console.warn(`Skipping mount for '${e}' due to missing element or container.`)}))}const C=RegExp("^(?!s*$).+"),E={type:t.ValidationRuleType.REGEX_MATCH_RULE,params:{regex:C,error:"El campo es requerido"}};var A,I,S,L,P,_,w,O,j,k,N,M,B,T,R,D,$,U,z,F,Y,H,G;class V extends o{constructor({apiKey:n,returnUrl:e,renderPaymentButton:t=!1,callBack:o=()=>{},styles:i,containerId:l,collectorIds:a,isOpenPaySandbox:r,isEnrollmentCard:s,renderSaveCardButton:d,mode:c="stage",customization:p}){super({apiKey:n,returnUrl:e,mode:c,callBack:o,customization:p,tdsIframeId:a&&"tdsIframe"in a?null==a?void 0:a.tdsIframe:"tdsIframe",tonderPayButtonId:a?null==a?void 0:a.tonderPayButton:"tonderPayButton"}),A.add(this),this.paymentData={},this.deletingCards=[],this.accordionC=null,this.apmsInjected=!1,this.apmsData=[],this.isOpenPaySandbox=!0,this.isEnrollmentCard=!1,this.renderPaymentButton=t||!1,this.renderSaveCardButton=d,this.customStyles=i,this.abortRefreshCardsController=new AbortController,this.containerId=l||"tonder-checkout",this.injected=!1,this.cardsInjected=!1,this.collectorIds={cardsListContainer:"cardsListContainer",holderName:"collectCardholderName",cardNumber:"collectCardNumber",expirationMonth:"collectExpirationMonth",expirationYear:"collectExpirationYear",cvv:"collectCvv",tonderPayButton:"tonderPayButton",msgError:"msgError",msgNotification:"msgNotification",tonderSaveCardButton:"tonderSaveCardButton",apmsListContainer:"apmsListContainer",tdsIframe:"tdsIframe"},this.collectorIds=a?Object.assign(Object.assign({},this.collectorIds),a):this.collectorIds,this.radioChecked="new",this.collectContainer=null,this.updateCollectContainer=null,this.isOpenPaySandbox=void 0===r||r,this.isEnrollmentCard=void 0!==s&&s}setCustomerEmail(n){this.customer=Object.assign(Object.assign({},this.customer),{email:n})}setPaymentData(n){var e;n&&(this.paymentData=n,this.setCartTotal((null===(e=n.cart)||void 0===e?void 0:e.total)||"0"))}injectCheckout(){return a(this,void 0,void 0,(function*(){if(this.injected)return;const n=document.querySelector(`#${this.containerId}`);if(n)return n.innerHTML=v({collectorIds:this.collectorIds,customStyles:this.customStyles,isEnrollmentCard:this.isEnrollmentCard,renderPaymentButton:this.renderPaymentButton,customization:this.customization}),yield r(this,A,"m",$).call(this),void(this.injected=!0);const e=new MutationObserver(((n,e)=>a(this,void 0,void 0,(function*(){const n=document.querySelector(`#${this.containerId}`);n&&(n.innerHTML=v({collectorIds:this.collectorIds,customStyles:this.customStyles,isEnrollmentCard:this.isEnrollmentCard,renderPaymentButton:this.renderPaymentButton,customization:this.customization}),yield r(this,A,"m",$).call(this),this.injected=!0,e.disconnect())}))));e.observe(document.body,{childList:!0,subtree:!0,attributeFilter:["id"]})}))}removeCheckout(){this.injected=!1,this.cardsInjected=!1,this.apmsInjected=!1,this.abortController.abort(),this.abortController=new AbortController,clearInterval(this.injectInterval),console.log("InlineCheckout removed from DOM and cleaned up.")}saveCard(){return a(this,void 0,void 0,(function*(){return new Promise(((n,e)=>a(this,void 0,void 0,(function*(){try{yield r(this,A,"m",Y).call(this,!0,"Guardando..."),yield r(this,A,"m",H).call(this),yield r(this,A,"m",Y).call(this,!1),n("Tarjeta registrada con éxito")}catch(n){e(n)}}))))}))}_setCartTotal(n){this.cartTotal=n,r(this,A,"m",j).call(this)}setCartTotal(n){this.cartTotal=n,r(this,A,"m",j).call(this)}_checkout(){return a(this,void 0,void 0,(function*(){try{if(r(this,A,"m",j).call(this,{cardId:this.radioChecked,textContent:"Cargando...",disabled:!0}),this.merchantData){if("openpay_keys"in this.merchantData){const{business:n}=this.merchantData;let e;"new"===this.radioChecked||void 0===this.radioChecked?e=yield r(this,A,"m",F).call(this,this.collectorIds.tonderPayButton,this.radioChecked):(yield r(this,A,"m",F).call(this,this.collectorIds.tonderPayButton,this.radioChecked),e={skyflow_id:this.radioChecked});const t=yield this._getCustomer(),{auth_token:o}=t;o&&this.customer.email&&(yield r(this,A,"m",G).call(this,o,n.pk,e));const i=this.apmsData?this.apmsData.find((n=>n.pk===this.radioChecked)):null,l=yield this._handleCheckout(Object.assign(Object.assign({},i&&Object.keys(i).length>0?{payment_method:i.payment_method}:{card:e}),{customer:t}));return r(this,A,"m",j).call(this,{cardId:this.radioChecked,disabled:!1}),l||(c("No se ha podido procesar el pago",this.collectorIds.msgError,this.collectorIds.tonderPayButton),!1)}}else c("No se han configurado los datos del proveedor de servicio",this.collectorIds.msgError,this.collectorIds.tonderPayButton)}catch(n){throw console.log(n),c("Ha ocurrido un error",this.collectorIds.msgError,this.collectorIds.tonderPayButton),n}finally{r(this,A,"m",j).call(this,{cardId:this.radioChecked,disabled:!1})}}))}}A=new WeakSet,I=function(n){return a(this,void 0,void 0,(function*(){var e;if(this.cardsInjected||!(null===(e=this.customization.saveCards)||void 0===e?void 0:e.showSaved))return;this.cardsInjected=!1;const t=yield this._getCustomerCards(n,this.merchantData.business.pk);let o=[];if("cards"in t){o=t.cards.map(m);const e=setInterval((()=>{const t=document.querySelector(`#${this.collectorIds.cardsListContainer}`);if(t&&this.injected){const i=function(n){const e="abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ";let t="";for(let o=0;o<n;o++)t+=e[Math.floor(52*Math.random())];return t}(10);t.innerHTML=y({cards:o,acId:i,collectorIds:this.collectorIds,renderPaymentButton:this.renderPaymentButton,customStyles:this.customStyles}),clearInterval(e),r(this,A,"m",S).call(this,i),r(this,A,"m",k).call(this,n),this.cardsInjected=!0}}),500)}}))},S=function(n){this.accordionC=new i(`.accordion-container${n}`,{triggerClass:"card-item-label",duration:300,collapse:!0,showMultiple:!1,onOpen:n=>a(this,void 0,void 0,(function*(){yield r(this,A,"m",L).call(this,n)}))})},L=function(n){return a(this,void 0,void 0,(function*(){var e,o;const{vault_id:i,vault_url:l}=this.merchantData,s=n.id.replace("card_container-","");this.updateCollectContainer&&"unmount"in(null===(o=null===(e=this.updateCollectContainer)||void 0===e?void 0:e.elements)||void 0===o?void 0:o.cvvElement)&&this.updateCollectContainer.elements.cvvElement.unmount(),document.querySelectorAll(".cvvContainer").forEach((n=>{n.classList.remove("show")}));const c=document.getElementById(s);c&&(c.checked=!0);try{this.updateCollectContainer=yield function(n,e,o,i,l){return a(this,arguments,void 0,(function*(n,e,o,i,l,a={},r,s){var c,p,u,m,h,v,y,b,g,C,A,I,S,L,P,_,w,O,j,k,N,M,B,T,R,D,$,U;const z=yield f(e,o,i,s,l);var F=0===Object.keys(a).length?d:Object.assign(Object.assign({},a),{labels:{nameLabel:(null===(c=null==a?void 0:a.labels)||void 0===c?void 0:c.nameLabel)&&""!==(null===(p=null==a?void 0:a.labels)||void 0===p?void 0:p.nameLabel)?null===(u=null==a?void 0:a.labels)||void 0===u?void 0:u.nameLabel:d.labels.nameLabel,cardLabel:(null===(m=null==a?void 0:a.labels)||void 0===m?void 0:m.cardLabel)&&""!==(null===(h=null==a?void 0:a.labels)||void 0===h?void 0:h.cardLabel)?null===(v=null==a?void 0:a.labels)||void 0===v?void 0:v.cardLabel:d.labels.cardLabel,cvvLabel:(null===(y=null==a?void 0:a.labels)||void 0===y?void 0:y.cvvLabel)&&""!==(null===(b=null==a?void 0:a.labels)||void 0===b?void 0:b.cvvLabel)?null===(g=null==a?void 0:a.labels)||void 0===g?void 0:g.cvvLabel:d.labels.cvvLabel,expiryDateLabel:(null===(C=null==a?void 0:a.labels)||void 0===C?void 0:C.expiryDateLabel)&&""!==(null===(A=null==a?void 0:a.labels)||void 0===A?void 0:A.expiryDateLabel)?null===(I=null==a?void 0:a.labels)||void 0===I?void 0:I.expiryDateLabel:d.labels.expiryDateLabel},placeholders:{namePlaceholder:(null===(S=null==a?void 0:a.placeholders)||void 0===S?void 0:S.namePlaceholder)&&""!==(null===(L=null==a?void 0:a.placeholders)||void 0===L?void 0:L.namePlaceholder)?null===(P=null==a?void 0:a.placeholders)||void 0===P?void 0:P.namePlaceholder:d.placeholders.namePlaceholder,cardPlaceholder:(null===(_=null==a?void 0:a.placeholders)||void 0===_?void 0:_.cardPlaceholder)&&""!==(null===(w=null==a?void 0:a.placeholders)||void 0===w?void 0:w.cardPlaceholder)?null===(O=null==a?void 0:a.placeholders)||void 0===O?void 0:O.cardPlaceholder:d.placeholders.cardPlaceholder,cvvPlaceholder:(null===(j=null==a?void 0:a.placeholders)||void 0===j?void 0:j.cvvPlaceholder)&&""!==(null===(k=null==a?void 0:a.placeholders)||void 0===k?void 0:k.cvvPlaceholder)?null===(N=null==a?void 0:a.placeholders)||void 0===N?void 0:N.cvvPlaceholder:d.placeholders.cvvPlaceholder,expiryMonthPlaceholder:(null===(M=null==a?void 0:a.placeholders)||void 0===M?void 0:M.expiryMonthPlaceholder)&&""!==(null===(B=null==a?void 0:a.placeholders)||void 0===B?void 0:B.expiryMonthPlaceholder)?null===(T=null==a?void 0:a.placeholders)||void 0===T?void 0:T.expiryMonthPlaceholder:d.placeholders.expiryMonthPlaceholder,expiryYearPlaceholder:(null===(R=null==a?void 0:a.placeholders)||void 0===R?void 0:R.expiryYearPlaceholder)&&""!==(null===(D=null==a?void 0:a.placeholders)||void 0===D?void 0:D.expiryYearPlaceholder)?null===($=null==a?void 0:a.placeholders)||void 0===$?void 0:$.expiryYearPlaceholder:d.placeholders.expiryYearPlaceholder}});const Y=z.container(t.ContainerType.COLLECT),H=Y.create(Object.assign(Object.assign({table:"cards",column:"cvv"},F),{label:"",placeholder:null===(U=F.placeholders)||void 0===U?void 0:U.cvvPlaceholder,type:t.ElementType.CVV,validations:[E],skyflowID:n}));"on"in H&&(H.on(t.EventName.CHANGE,(e=>{let t=document.getElementById(`errorCvvIdTonder${n}`);t&&e.isValid&&!e.isEmpty&&t.remove()})),H.on(t.EventName.BLUR,(e=>{let t=document.getElementById(r.cvv+n),o=document.getElementById("errorCvvIdTonder"+n);if(o&&o.remove(),!e.isValid){let o=document.createElement("div");o.classList.add("error-custom-inputs-tonder-cards"),o.classList.add("error-custom-inputs-tonder"),o.id="errorCvvIdTonder"+n,o.textContent=e.isEmpty?"El campo es requerido":"El campo es inválido",null==t||t.appendChild(o)}})));const G={cvv:{element:H,container:`#${r.cvv}${n}`}};return yield x(G),{container:Y,elements:{cvvElement:H}}}))}(s,i,l,this.baseUrl,this.abortController.signal,this.customStyles,this.collectorIds,this.apiKeyTonder),setTimeout((()=>{const n=document.querySelector(`#cvvContainer${s}`);n&&n.classList.add("show")}),5),r(this,A,"m",P).call(this,s)}catch(n){console.error("Ha ocurrido un error",n)}c&&(yield r(this,A,"m",B).call(this,c))}))},P=function(n=""){if(!this.renderPaymentButton)return;const e=`#${this.collectorIds.tonderPayButton}${n}`,t=document.querySelector(e),o=`#acContainer${n}`,i=document.querySelector(o);if(!t)return void console.error("Pay button not found");if(""!==n){const n=document.querySelector(`#${this.collectorIds.tonderPayButton}`);n&&(n.style.display="none")}t.style.display="block";const l=Intl.NumberFormat("en-Latn-US",{minimumFractionDigits:2}).format(Number(this.cartTotal||0));t.textContent=`Pagar $${l}`,document.querySelectorAll(".ac-card-panel-container").forEach((n=>{n.classList.remove("show")})),i&&i.classList.add("show"),t.onclick=n=>a(this,void 0,void 0,(function*(){n.preventDefault(),yield r(this,A,"m",_).call(this,t)}))},_=function(n){return a(this,void 0,void 0,(function*(){try{yield this.payment({})}catch(n){console.error("Payment error:",n)}}))},w=function(){if(!this.renderSaveCardButton)return;const n=document.querySelector(`#${this.collectorIds.tonderSaveCardButton}`);n?(n.style.display="block",n.textContent="Guardar",n.onclick=e=>a(this,void 0,void 0,(function*(){e.preventDefault(),yield r(this,A,"m",O).call(this,n)}))):console.error("Save button not found")},O=function(n){return a(this,void 0,void 0,(function*(){const e=n.innerHTML;n.innerHTML='<div class="lds-dual-ring"></div>';try{const n=yield this.saveCard();this.callBack({message:n})}catch(n){console.error("Save card error:",n)}finally{n.innerHTML=e}}))},j=function(n){try{const e=(null==n?void 0:n.cardId)&&"new"!==(null==n?void 0:n.cardId)?`#${this.collectorIds.tonderPayButton}${n.cardId}`:`#${this.collectorIds.tonderPayButton}`,t=(null==n?void 0:n.updatedTextContent)||!0,o=(null==n?void 0:n.textContent)||`Pagar $${this.cartTotal}`,i=null==n?void 0:n.disabled,l=document.querySelector(e);if(!l)return;t&&(l.textContent=o),void 0!==i&&"disabled"in l&&(l.disabled=i)}catch(n){console.error("Pay button not found due to update",n)}},k=function(n=""){const e=document.getElementsByName("card_selected");for(const n of e)n.style.display="block",n.onclick=t=>a(this,void 0,void 0,(function*(){const t=Array.from(e).indexOf(n);yield r(this,A,"m",B).call(this,n,t)}));const t=document.getElementsByClassName("card-delete-button");for(const e of t)e.addEventListener("click",(t=>a(this,void 0,void 0,(function*(){t.preventDefault(),t.stopImmediatePropagation(),yield r(this,A,"m",N).call(this,n,e)}))),!1)},N=function(n,e){return a(this,void 0,void 0,(function*(){var t,o;const i=e.attributes.getNamedItem("id"),l=null===(o=null===(t=null==i?void 0:i.value)||void 0===t?void 0:t.split("_"))||void 0===o?void 0:o[2];if(l){const e=document.querySelector(`#card_container-${l}`);e&&(e.style.display="none");try{this.deletingCards.push(l),this.abortRefreshCardsController&&(this.abortRefreshCardsController.abort(),this.abortRefreshCardsController=new AbortController),yield this._removeCustomerCard(n,this.merchantData.business.pk,l)}catch(n){}finally{this.deletingCards=this.deletingCards.filter((n=>n!==l)),yield r(this,A,"m",M).call(this,n)}}}))},M=function(n){return a(this,void 0,void 0,(function*(){this.deletingCards.length>0||(this.cardsInjected=!1,yield r(this,A,"m",I).call(this,n))}))},B=function(n){return a(this,arguments,void 0,(function*(n,e=null){const t=document.querySelector(".container-form");t&&(t.style.display="new"===n.id?"block":"none"),"new"===n.id?(r(this,A,"m",T).call(this,null,!0),this.radioChecked!==n.id&&(yield r(this,A,"m",z).call(this),r(this,A,"m",P).call(this))):(r(this,A,"m",T).call(this,e,null!==e),r(this,A,"m",U).call(this)),this.radioChecked=n.id}))},T=function(n=null,e=!1){e&&this.accordionC&&"closeAll"in this.accordionC&&this.accordionC.closeAll(),null!==n&&this.accordionC&&"open"in this.accordionC&&this.accordionC.open(n)},R=function(){return a(this,void 0,void 0,(function*(){try{const n=yield this._fetchCustomerPaymentMethods();n&&n.results&&n.results.length>0&&(this.apmsData=n.results,r(this,A,"m",D).call(this,n.results))}catch(n){console.warn("Error getting APMS")}}))},D=function(n){if(this.apmsInjected)return;const e=setInterval((()=>{const t=document.querySelector(`#${this.collectorIds.apmsListContainer}`);t&&this.injected&&(t.innerHTML=b(this.customStyles,n),clearInterval(e),r(this,A,"m",k).call(this),this.apmsInjected=!0)}),500)},$=function(){return a(this,void 0,void 0,(function*(){this.isEnrollmentCard?r(this,A,"m",w).call(this):r(this,A,"m",P).call(this),yield this._initializeCheckout();const{vault_id:n,vault_url:e}=this.merchantData;if(n){if(this.customer.email&&!this.isEnrollmentCard){const n=yield this._getCustomer();if("auth_token"in n){const{auth_token:e}=n;yield r(this,A,"m",I).call(this,e)}}this.isEnrollmentCard||(yield r(this,A,"m",R).call(this)),this.collectContainer=yield g(n,e,this.baseUrl,this.abortController.signal,this.customStyles,this.collectorIds,this.apiKeyTonder)}}))},U=function(){this.injected=!1,this.collectContainer&&("unmount"in this.collectContainer.elements.cardHolderNameElement&&this.collectContainer.elements.cardHolderNameElement.unmount(),"unmount"in this.collectContainer.elements.cardNumberElement&&this.collectContainer.elements.cardNumberElement.unmount(),"unmount"in this.collectContainer.elements.expiryYearElement&&this.collectContainer.elements.expiryYearElement.unmount(),"unmount"in this.collectContainer.elements.expiryMonthElement&&this.collectContainer.elements.expiryMonthElement.unmount(),"unmount"in this.collectContainer.elements.cvvElement&&this.collectContainer.elements.cvvElement.unmount())},z=function(){return a(this,void 0,void 0,(function*(){yield this._initializeCheckout();const{vault_id:n,vault_url:e}=this.merchantData;n&&(this.collectContainer=yield g(n,e,this.baseUrl,this.abortController.signal,this.customStyles,this.collectorIds,this.apiKeyTonder))}))},F=function(n){return a(this,arguments,void 0,(function*(n,e=null){var t,o;try{const i=e&&"new"!==e?null===(t=this.updateCollectContainer)||void 0===t?void 0:t.container:null===(o=this.collectContainer)||void 0===o?void 0:o.container;if(i&&"collect"in i){const n=yield i.collect();return yield n.records[0].fields}c("Por favor, verifica todos los campos de tu tarjeta",this.collectorIds.msgError,n)}catch(e){throw c("Por favor, verifica todos los campos de tu tarjeta",this.collectorIds.msgError,n),e}}))},Y=function(){return a(this,arguments,void 0,(function*(n=!1,e="Guardar"){try{const t=document.querySelector(`#${this.collectorIds.tonderSaveCardButton}`);t&&(t.disabled=n,t.innerHTML=e)}catch(n){}}))},H=function(){return a(this,void 0,void 0,(function*(){if(this.customer.email)try{if(this.merchantData&&"openpay_keys"in this.merchantData){const n=yield r(this,A,"m",F).call(this,this.collectorIds.tonderSaveCardButton),e=yield this._getCustomer();if("auth_token"in e&&this.secureToken){const{auth_token:t}=e;yield this._saveCustomerCard(t,this.merchantData.business.pk,{skyflow_id:n.skyflow_id}),p("Tarjeta registrada con éxito",this.collectorIds.msgNotification)}else c("No se han configurado los datos de seguridad para guardar tarjeta",this.collectorIds.msgError,this.collectorIds.tonderSaveCardButton)}else c("No se han configurado los datos del proveedor de servicio",this.collectorIds.msgError,this.collectorIds.tonderSaveCardButton)}catch(n){throw c("object"==typeof n&&null!==n&&"message"in n?null==n?void 0:n.message:"Ha ocurrido un error",this.collectorIds.msgError,this.collectorIds.tonderSaveCardButton),n}}))},G=function(n,e,t){return a(this,void 0,void 0,(function*(){var o;const i=document.getElementById("save-checkout-card");if(i&&"checked"in i&&i.checked||(null===(o=this.customization.saveCards)||void 0===o?void 0:o.autoSave))try{this.secureToken?(yield this._saveCustomerCard(n,e,t),this.cardsInjected=!1,yield r(this,A,"m",I).call(this,n),p("Tarjeta registrada con éxito",this.collectorIds.msgNotification)):c("No se han configurado los datos de seguridad para guardar tarjeta",this.collectorIds.msgError,this.collectorIds.tonderSaveCardButton)}catch(n){"object"==typeof n&&null!==n&&"message"in n&&"Error"!==(null==n?void 0:n.message)&&c(null==n?void 0:n.message,this.collectorIds.msgError,this.collectorIds.tonderPayButton)}}))};export{l as Checkout,V as InlineCheckout};
+import n from"lodash.get";import t from"skyflow-js";import{BaseInlineCheckout as e}from"@tonder.io/ionic-lite-sdk";import o from"accordion-js";function i(n,t,e,o){return new(e||(e=Promise))((function(i,a){function l(n){try{s(o.next(n))}catch(n){a(n)}}function r(n){try{s(o.throw(n))}catch(n){a(n)}}function s(n){var t;n.done?i(n.value):(t=n.value,t instanceof e?t:new e((function(n){n(t)}))).then(l,r)}s((o=o.apply(n,t||[])).next())}))}function a(n,t,e,o){if("a"===e&&!o)throw new TypeError("Private accessor was defined without a getter");if("function"==typeof t?n!==t||!o:!t.has(n))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===e?o:"a"===e?o.call(n):o?o.value:t.get(n)}var l;"function"==typeof SuppressedError&&SuppressedError,function(n){n.SORIANA="SORIANA",n.OXXO="OXXO",n.SPEI="SPEI",n.CODI="CODI",n.OXXOPAY="OXXOPAY",n.MERCADOPAGO="MERCADOPAGO",n.PAYPAL="PAYPAL",n.COMERCIALMEXICANA="COMERCIALMEXICANA",n.BANCOMER="BANCOMER",n.WALMART="WALMART",n.BODEGA="BODEGA",n.SAMSCLUB="SAMSCLUB",n.SUPERAMA="SUPERAMA",n.CALIMAX="CALIMAX",n.EXTRA="EXTRA",n.CIRCULOK="CIRCULOK",n.SEVEN11="7ELEVEN",n.TELECOMM="TELECOMM",n.BANORTE="BANORTE",n.BENAVIDES="BENAVIDES",n.DELAHORRO="DELAHORRO",n.ELASTURIANO="ELASTURIANO",n.WALDOS="WALDOS",n.ALSUPER="ALSUPER",n.KIOSKO="KIOSKO",n.STAMARIA="STAMARIA",n.LAMASBARATA="LAMASBARATA",n.FARMROMA="FARMROMA",n.FARMUNION="FARMUNION",n.FARMATODO="FARMATODO",n.SFDEASIS="SFDEASIS",n.FARM911="FARM911",n.FARMECONOMICAS="FARMECONOMICAS",n.FARMMEDICITY="FARMMEDICITY",n.RIANXEIRA="RIANXEIRA",n.WESTERNUNION="WESTERNUNION",n.ZONAPAGO="ZONAPAGO",n.CAJALOSANDES="CAJALOSANDES",n.CAJAPAITA="CAJAPAITA",n.CAJASANTA="CAJASANTA",n.CAJASULLANA="CAJASULLANA",n.CAJATRUJILLO="CAJATRUJILLO",n.EDPYME="EDPYME",n.KASNET="KASNET",n.NORANDINO="NORANDINO",n.QAPAQ="QAPAQ",n.RAIZ="RAIZ",n.PAYSER="PAYSER",n.WUNION="WUNION",n.BANCOCONTINENTAL="BANCOCONTINENTAL",n.GMONEY="GMONEY",n.GOPAY="GOPAY",n.WU="WU",n.PUNTOSHEY="PUNTOSHEY",n.AMPM="AMPM",n.JUMBOMARKET="JUMBOMARKET",n.SMELPUEBLO="SMELPUEBLO",n.BAM="BAM",n.REFACIL="REFACIL",n.ACYVALORES="ACYVALORES"}(l||(l={}));const r={inputStyles:{base:{border:"1px solid #e0e0e0",padding:"10px 7px",borderRadius:"5px",color:"#1d1d1d",marginTop:"2px",backgroundColor:"white",fontFamily:'"Inter", sans-serif',fontSize:"16px","&::placeholder":{color:"#ccc"}},cardIcon:{position:"absolute",left:"6px",bottom:"calc(50% - 12px)"},complete:{color:"#4caf50"},empty:{},focus:{},invalid:{border:"1px solid #f44336"},global:{"@import":'url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;700&display=swap")'}},labelStyles:{base:{fontSize:"12px",fontWeight:"500",fontFamily:'"Inter", sans-serif'}},errorTextStyles:{base:{fontSize:"12px",fontWeight:"500",color:"#f44336",fontFamily:'"Inter", sans-serif'}},labels:{nameLabel:"Titular de la tarjeta",cardLabel:"Número de tarjeta",cvvLabel:"CVC/CVV",expiryDateLabel:"Fecha de expiración"},placeholders:{namePlaceholder:"Nombre como aparece en la tarjeta",cardPlaceholder:"1234 1234 1234 1234",cvvPlaceholder:"3-4 dígitos",expiryMonthPlaceholder:"MM",expiryYearPlaceholder:"AA"}};function s(n,t=null,e="msgError",o="msgErrorText"){try{const i=t&&"new"!==t;let a=document.getElementById(`${e}${i?t:""}`),l=document.getElementById(`${o}${i?t:""}`);l.innerHTML="",l.innerHTML=n,a.style.display="flex",console.log("msgErrorDiv",a),setTimeout((function(){a.style.display="none",l.innerHTML=""}),3e4)}catch(n){console.warn("Error showing message error",n)}}function d(n,t=null,e="msgNotification",o="msgNotificationText"){try{const i=t&&"new"!==t,a=document.getElementById(`${e}${i?t:""}`);if(a){let e=document.getElementById(`${o}${i?t:""}`);a.style.display="flex",e.innerHTML="",e.innerHTML=n,setTimeout((function(){a.style.display="none",e.innerHTML=""}),3e4)}}catch(n){console.error("Error showing message",n)}}const c=n=>"Visa"===n?"https://d35a75syrgujp0.cloudfront.net/cards/visa.png":"Mastercard"===n?"https://d35a75syrgujp0.cloudfront.net/cards/mastercard.png":"American Express"===n?"https://d35a75syrgujp0.cloudfront.net/cards/american_express.png":"https://d35a75syrgujp0.cloudfront.net/cards/default_card.png",p=n=>{const t=Object.assign({},n.fields),e=t.card_number.split("-"),o=e[e.length-1];return t.card_number=`••••${o}`,t},u=n=>n.trim().replace(/\s+/g,"");const m=(n={isEnrollmentCard:!1,collectorIds:{}})=>{var t,e,o,i,a,l,s,d,p,u,m,h,v,b,g,f,x,C,E,A,I,S,w,P,L,_,O,N,k,B,M,j,T,R,$,D,z,U,Y,F,H,G,V,W,X,q,K,J,Z,Q,nn,tn,en,on,an,ln,rn,sn,dn,cn,pn,un,mn,hn,vn,yn,bn,gn,fn,xn,Cn,En;return`\n<div class="container-tonder">\n  ${(null===(e=null===(t=n.customization)||void 0===t?void 0:t.saveCards)||void 0===e?void 0:e.showSaved)?`<div id="${n.collectorIds.cardsListContainer}" class="cards-list-container"></div>`:""}\n  ${n.isEnrollmentCard?"":`\n    <div class="pay-new-card">\n      <input checked id="new" class="card_selected" name="card_selected" type="radio"/>\n      <label class="card-item-label-new" for="new">\n        <img class="card-image" src="${c("XXXX")}" />\n        <div class="card-number">Pagar con tarjeta</div>\n      </label>\n    </div>\n  `}\n  <div class="container-form">\n    <div id="${n.collectorIds.holderName}" class="empty-div empty-div-card"></div>\n    <div id="${n.collectorIds.cardNumber}" class="empty-div empty-div-card"></div>\n    <div class="collect-row">\n      <div id="${n.collectorIds.expirationMonth}" class="empty-div empty-div-card"></div>\n      <div id="${n.collectorIds.expirationYear}" class="expiration-year"></div>\n      <div id="${n.collectorIds.cvv}" class="empty-div empty-div-card"></div>\n    </div>\n    ${!n.isEnrollmentCard&&(null===(i=null===(o=n.customization)||void 0===o?void 0:o.saveCards)||void 0===i?void 0:i.showSaveCardOption)?'\n      <div class="checkbox">\n        <input id="save-checkout-card" type="checkbox">\n        <label for="save-checkout-card">\n          Guardar tarjeta para futuros pagos\n        </label>\n      </div>\n    ':""}\n    ${y({showButton:n.isEnrollmentCard?n.renderSaveCardButton||!1:n.renderPaymentButton||!1,classContainerButton:"container-pay-button",tonderButtonId:n.isEnrollmentCard?n.collectorIds.tonderSaveCardButton:n.collectorIds.tonderPayButton,classButton:n.isEnrollmentCard?"tndr-button save-card-button":"tndr-button pay-button hidden",msgErrorId:n.collectorIds.msgError,msgErrorTextId:n.collectorIds.msgErrorText,msgNotificationId:n.collectorIds.msgNotification,msgNotificationTextId:n.collectorIds.msgNotificationText,buttonText:n.isEnrollmentCard?"Guardar":null===(l=null===(a=n.customization)||void 0===a?void 0:a.paymentButton)||void 0===l?void 0:l.text})}\n  </div>\n  ${n.isEnrollmentCard?"":'\n    <div id="apmsListContainer" class="apms-list-container"></div>\n  '}\n  \n  <iframe class="tds-iframe" allowtransparency="true" id="${n.collectorIds.tdsIframe}"></iframe>\n</div>\n\n<style>\n\n@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;700&display=swap");\n\n.tds-iframe {\n  border: none;\n  width: 100vw;\n  height: 100vh;\n  z-index: 30;\n  background-color: transparent;\n}\n\n.error-custom-inputs-tonder {\n  background-color: white;\n  position: absolute;\n  left: 0px;\n  bottom: -1px;\n  width: 100%;\n  font-size: 12px;\n  color: red;\n  font-family: "Inter", sans-serif !important;\n}\n\n.container-form {\n  padding: 25px 30px 0px 30px;\n}\n\n#${n.collectorIds.tdsIframe} {\n  display: none;\n  position: fixed;\n  width: 100vw;\n  height: 100vh;\n  inset: 0px;\n}\n\n.expiration-year .error-custom-inputs-tonder {\n  background-color: white;\n  position: absolute;\n  left: 0px;\n  bottom: 3px;\n  width: 100%;\n  font-size: 12px;\n  color: red;\n  font-family: "Inter", sans-serif !important;\n}\n\n.container-tonder {\n  background-color: #F9F9F9;\n  margin: 0 auto !important;\n  padding: 30px 0px 30px 0px;\n  overflow: hidden;\n  transition: max-height 0.5s ease-out;\n  max-width: 600px;\n  border: solid 1px #e3e3e3;\n}\n\n.container-pay-button{\n  padding-top: ${n.renderPaymentButton?"10px":""};\n  padding-bottom: ${n.renderPaymentButton?"10px":""};\n}\n\n.collect-row {\n  display: flex !important;\n  justify-content: space-between !important;\n  width: 100% !important;\n  gap: 16px;\n}\n\n.collect-row > :first-child {\n  min-width: 120px; !important\n}\n\n.expiration-year {\n  position: relative !important;\n  padding-top: 24px !important;\n}\n\n.empty-div {\n  position: relative;\n  margin-top: 2px;\n  margin-bottom: 4px;\n}\n.empty-div-card {\n    height: 80px !important;\n}\n.error-container{\n    display: none;\n    color: #832828 !important;\n    background-color: #FDE7E7 !important;\n    margin-bottom: 13px !important;\n    font-size: 14px !important;\n    padding: 10px 10px !important;\n    border-radius: 5px !important;\n    text-align: left !important;\n    align-items: center;\n    gap: 8px;\n    margin-top: 5px;\n}\n\n.message-container{\n    display: none;\n    color: #28832C !important;\n    background-color: #ECFDE7 !important;\n    margin-bottom: 13px !important;\n    font-size: 14px !important;\n    padding: 10px 10px !important;\n    border-radius: 5px !important;\n    text-align: left !important;\n    align-items: center;\n    gap: 8px;\n    margin-top: ${n.renderPaymentButton||n.renderSaveCardButton?"0px":"5px"};\n}\n.error-container p,\n.message-container p {\n  margin: 0;\n}\n.pay-button {\n  font-size: 16px;\n  font-weight: bold;\n  min-height: 2.3rem;\n  border-radius: 0.5rem;\n  cursor: pointer;\n  width: 100%;\n  padding: 1rem;\n  text-align: center;\n  border: none;\n  background-color: #000;\n  color: #fff;\n  margin-bottom: 10px;\n  font-family: "Inter", sans-serif !important;\n}\n.hidden{\n  display: none;\n}\n.pay-button:disabled, pay-button[disabled] {\n  background-color: #B9B9B9;\n}\n\n.save-card-button {\n  font-size: 16px;\n  font-weight: bold;\n  min-height: 2.3rem;\n  border-radius: 0.5rem;\n  cursor: pointer;\n  width: 100%;\n  padding: 1rem;\n  text-align: center;\n  border: none;\n  background-color: #000;\n  color: #fff;\n  margin-bottom: 10px;\n  margin-top: 25px;\n  display: none;\n  font-family: "Inter", sans-serif !important;\n}\n\n.save-card-button:disabled, save-card-button[disabled] {\n  background-color: #B9B9B9;\n}\n\n  .tndr-simulate-input-cvv-container{\n      height: 100%;\n      width: 100%;\n      position: absolute;\n      pointer-events: none;\n      \n  }\n  .tndr-simulate-input-cvv {\n      width: 100%;\n      pointer-events: none;\n      position: relative;\n  }\n  .tndr-simulate-input-cvv-container label{\n    line-height: ${(null===(p=null===(d=null===(s=null==n?void 0:n.customStyles)||void 0===s?void 0:s.labelStyles)||void 0===d?void 0:d.base)||void 0===p?void 0:p.lineHeight)?null===(h=null===(m=null===(u=null==n?void 0:n.customStyles)||void 0===u?void 0:u.labelStyles)||void 0===m?void 0:m.base)||void 0===h?void 0:h.lineHeight:""};\n    color: transparent;\n    font-size: ${(null===(g=null===(b=null===(v=null==n?void 0:n.customStyles)||void 0===v?void 0:v.labelStyles)||void 0===b?void 0:b.base)||void 0===g?void 0:g.fontSize)?null===(C=null===(x=null===(f=null==n?void 0:n.customStyles)||void 0===f?void 0:f.labelStyles)||void 0===x?void 0:x.base)||void 0===C?void 0:C.fontSize:r.labelStyles.base.fontSize};\n    font-family: ${(null===(I=null===(A=null===(E=null==n?void 0:n.customStyles)||void 0===E?void 0:E.labelStyles)||void 0===A?void 0:A.base)||void 0===I?void 0:I.fontFamily)?null===(P=null===(w=null===(S=null==n?void 0:n.customStyles)||void 0===S?void 0:S.labelStyles)||void 0===w?void 0:w.base)||void 0===P?void 0:P.fontFamily:r.labelStyles.base.fontFamily};\n    font-weight: ${(null===(O=null===(_=null===(L=null==n?void 0:n.customStyles)||void 0===L?void 0:L.labelStyles)||void 0===_?void 0:_.base)||void 0===O?void 0:O.fontWeight)?null===(B=null===(k=null===(N=null==n?void 0:n.customStyles)||void 0===N?void 0:N.labelStyles)||void 0===k?void 0:k.base)||void 0===B?void 0:B.fontWeight:r.labelStyles.base.fontWeight};\n    text-align: ${(null===(T=null===(j=null===(M=null==n?void 0:n.customStyles)||void 0===M?void 0:M.labelStyles)||void 0===j?void 0:j.base)||void 0===T?void 0:T.textAlign)?null===(D=null===($=null===(R=null==n?void 0:n.customStyles)||void 0===R?void 0:R.labelStyles)||void 0===$?void 0:$.base)||void 0===D?void 0:D.textAlign:r.labelStyles.base.textAlign};\n    pointer-events: none;\n  }\n  .tndr-simulate-input-cvv input {\n      width: 100%;\n      margin: 0;\n      padding: 0;\n      border: 0;\n      min-height: 44px;\n      background-color: transparent;\n      pointer-events: none;\n  }\n  .tndr-form-label{\n    line-height: ${(null===(Y=null===(U=null===(z=null==n?void 0:n.customStyles)||void 0===z?void 0:z.labelStyles)||void 0===U?void 0:U.base)||void 0===Y?void 0:Y.lineHeight)?null===(G=null===(H=null===(F=null==n?void 0:n.customStyles)||void 0===F?void 0:F.labelStyles)||void 0===H?void 0:H.base)||void 0===G?void 0:G.lineHeight:"22px"};\n    color: ${(null===(X=null===(W=null===(V=null==n?void 0:n.customStyles)||void 0===V?void 0:V.labelStyles)||void 0===W?void 0:W.base)||void 0===X?void 0:X.color)?null===(J=null===(K=null===(q=null==n?void 0:n.customStyles)||void 0===q?void 0:q.labelStyles)||void 0===K?void 0:K.base)||void 0===J?void 0:J.color:r.labelStyles.base.color};\n    font-size: ${(null===(nn=null===(Q=null===(Z=null==n?void 0:n.customStyles)||void 0===Z?void 0:Z.labelStyles)||void 0===Q?void 0:Q.base)||void 0===nn?void 0:nn.fontSize)?null===(on=null===(en=null===(tn=null==n?void 0:n.customStyles)||void 0===tn?void 0:tn.labelStyles)||void 0===en?void 0:en.base)||void 0===on?void 0:on.fontSize:r.labelStyles.base.fontSize};\n    font-family: ${(null===(rn=null===(ln=null===(an=null==n?void 0:n.customStyles)||void 0===an?void 0:an.labelStyles)||void 0===ln?void 0:ln.base)||void 0===rn?void 0:rn.fontFamily)?null===(cn=null===(dn=null===(sn=null==n?void 0:n.customStyles)||void 0===sn?void 0:sn.labelStyles)||void 0===dn?void 0:dn.base)||void 0===cn?void 0:cn.fontFamily:r.labelStyles.base.fontFamily};\n    font-weight: ${(null===(mn=null===(un=null===(pn=null==n?void 0:n.customStyles)||void 0===pn?void 0:pn.labelStyles)||void 0===un?void 0:un.base)||void 0===mn?void 0:mn.fontWeight)?null===(yn=null===(vn=null===(hn=null==n?void 0:n.customStyles)||void 0===hn?void 0:hn.labelStyles)||void 0===vn?void 0:vn.base)||void 0===yn?void 0:yn.fontWeight:r.labelStyles.base.fontWeight};\n    text-align: ${(null===(fn=null===(gn=null===(bn=null==n?void 0:n.customStyles)||void 0===bn?void 0:bn.labelStyles)||void 0===gn?void 0:gn.base)||void 0===fn?void 0:fn.textAlign)?null===(En=null===(Cn=null===(xn=null==n?void 0:n.customStyles)||void 0===xn?void 0:xn.labelStyles)||void 0===Cn?void 0:Cn.base)||void 0===En?void 0:En.textAlign:r.labelStyles.base.textAlign};\n  }\n.lds-dual-ring {\n  display: inline-block;\n  width: 14px;\n  height: 14px;\n}\n\n.lds-dual-ring:after {\n  content: " ";\n  display: block;\n  width: 14px;\n  height: 14px;\n  border-radius: 50%;\n  border: 6px solid #fff;\n  border-color: #fff transparent #fff transparent;\n  animation: lds-dual-ring 1.2s linear infinite;\n}\n\n@keyframes lds-dual-ring {\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n}\n\n@media screen and (max-width: 600px) {\n  .payment_method_zplit {\n    font-size: 16px !important;\n    width: 100% !important;\n  }\n\n  .payment_method_zplit  label img {\n    display: none !important;\n  }\n}\n\n.cards-list-container {\n  display: flex;\n  flex-direction: column;\n  padding: 0px;\n  gap: 33% 20px;\n}\n\n.apms-list-container {\n  display: flex;\n  flex-direction: column;\n  gap: 33% 20px;\n  max-height: 300px;\n  overflow-y: auto;\n}\n\n.checkbox label {\n  margin-left: 10px;\n  font-size: 12px;\n  font-weight: 500;\n  color: #1D1D1D;\n  font-family: "Inter", sans-serif !important;\n}\n\n.checkbox {\n  margin-top: 10px;\n  margin-bottom: 20px;\n  margin-left: 10px !important;\n  margin-right: 10px !important;\n  width: 100%;\n  text-align: left;\n}\n\n.pay-new-card {\n  display: flex;\n  justify-content: start;\n  align-items: center;\n  color: #1D1D1D;\n  gap: 33% 15px;\n  margin-top: 10px;\n  margin-bottom: 10px;\n  padding: 0px 30px;\n  width: 100%;\n  position: relative;\n}\n\n.pay-new-card .card-number {\n  font-size: 16px;\n  font-family: "Inter", sans-serif !important;\n}\n\n.card-image {\n  width: 39px;\n  height: 24px;\n  text-align: left;\n}\n\n.card-item-label-new {\n  display: flex;\n  justify-content: start;\n  align-items: center;\n  color: #1D1D1D;\n  gap: 33% 20px;\n  margin-top: 10px;\n  margin-bottom: 10px;\n  width: 100%;\n}\n\n.card_selected {\n  position: relative;\n  width: 16px;\n  height: 16px;\n  appearance: none;\n  cursor: pointer;\n  border-radius: 100%;\n  border: 1px #3bc635 solid;\n  color: #3bc635;\n  transition-property: all;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 150ms;\n}\n\n.card_selected:before {\n  width: 8px;\n  height: 8px;\n  content: "";\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  display: block;\n  transform: translate(-50%, -50%);\n  border-radius: 100%;\n  background-color: #3bc635;\n  opacity: 0;\n  transition-property: opacity;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 150ms;\n}\n\n.card_selected:checked {\n  border: 1px #3bc635 solid;\n  position: relative;\n  width: 16px;\n  height: 16px;\n  appearance: none;\n  cursor: pointer;\n  border-radius: 100%;\n  color: #3bc635;\n  transition-property: all;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 150ms;\n}\n\n.card_selected:checked:before {\n  content: "";\n  border: 1px #3bc635 solid;\n  width: 8px;\n  height: 8px;\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  display: block;\n  transform: translate(-50%, -50%);\n  border-radius: 100%;\n  background-color: #3bc635;\n  opacity: 50;\n  transition-property: opacity;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 150ms;\n}\n\n.card_selected:hover:before {\n  width: 8px;\n  height: 8px;\n  content: "";\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  display: block;\n  transform: translate(-50%, -50%);\n  border-radius: 100%;\n  background-color: #3bc635;\n  transition-property: opacity;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 150ms;\n  opacity: 10;\n}\n\n</style>\n`},h=t=>`\n  <div class="accordion-container">\n    ${t.cards.reduce(((e,o)=>{var i,a;const{cvvLabel:l}=(s=t.customStyles,{labels:{nameLabel:n(s,"labels.nameLabel",r.labels.nameLabel),cardLabel:n(s,"labels.cardLabel",r.labels.cardLabel),cvvLabel:n(s,"labels.cvvLabel",r.labels.cvvLabel),expiryDateLabel:n(s,"labels.expiryDateLabel",r.labels.expiryDateLabel)},placeholders:{namePlaceholder:n(s,"placeholders.namePlaceholder",r.placeholders.namePlaceholder),cardPlaceholder:n(s,"placeholders.cardPlaceholder",r.placeholders.cardPlaceholder),cvvPlaceholder:n(s,"placeholders.cvvPlaceholder",r.placeholders.cvvPlaceholder),expiryMonthPlaceholder:n(s,"placeholders.expiryMonthPlaceholder",r.placeholders.expiryMonthPlaceholder),expiryYearPlaceholder:n(s,"placeholders.expiryYearPlaceholder",r.placeholders.expiryYearPlaceholder)}}).labels;var s;return`${e}\n    <div class="ac" id="option_container-${o.skyflow_id}">\n      <div class="card-item">\n          <input id="${o.skyflow_id}" class="cards card_selected" name="card_selected" type="radio"/>\n          <label class="card-item-label" for="${o.skyflow_id}">\n            <img class="card-image" src="${c(o.card_scheme)}" />\n            <div class="card-number">${o.card_number}</div>\n            <div class="card-expiration">Exp. ${o.expiration_month}/${o.expiration_year}</div>\n            <div class="card-delete-icon">\n              <button id="delete_button_${o.skyflow_id}" class="card-delete-button">\n                <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px">\n                  <path fill="currentColor" d="M292.309-140.001q-30.308 0-51.308-21t-21-51.308V-720h-40v-59.999H360v-35.384h240v35.384h179.999V-720h-40v507.691q0 30.308-21 51.308t-51.308 21H292.309ZM376.155-280h59.999v-360h-59.999v360Zm147.691 0h59.999v-360h-59.999v360Z"/>\n                </svg>\n              </button>\n            </div>\n          </label>\n      </div>\n      <div class="ac-panel">\n        <div class="ac-option-panel-container" id="acContainer${o.skyflow_id}">\n        \n           <div class="cvvContainer" id="cvvContainer${o.skyflow_id}">\n             <label class="tndr-form-label label-cvv-cards">${l}</label>\n              <div id="${t.collectorIds.cvv}${o.skyflow_id}" class="empty-div">\n                <div class="tndr-simulate-input-cvv-container">\n                   <div class="tndr-simulate-input-cvv">\n                      <svg class="cvvIcon" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="40" height="24" viewBox="0 0 270 178">\n                        <defs>\n                          <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">\n                            <stop offset="0" stop-color="#386bbf"/>\n                            <stop offset="1" stop-color="#032ea3"/>\n                          </linearGradient>\n                          <linearGradient id="linear-gradient-2" x1="0.5" y1="0.115" x2="0.5" y2="1" gradientUnits="objectBoundingBox">\n                            <stop offset="0" stop-color="#1c1c1c"/>\n                            <stop offset="1" stop-color="#151515"/>\n                          </linearGradient>\n                        </defs>\n                        <g id="Grupo_3" data-name="Grupo 3" transform="translate(-69 -312)">\n                          <g id="Grupo_2" data-name="Grupo 2">\n                            <rect id="Rectángulo_58" data-name="Rectángulo 58" width="253" height="165" rx="25" transform="translate(69 312)" fill="url(#linear-gradient)"/>\n                            <rect id="Rectángulo_61" data-name="Rectángulo 61" width="68" height="8" rx="4" transform="translate(86 437)" fill="#fff" opacity="0.877"/>\n                            <rect id="Rectángulo_66" data-name="Rectángulo 66" width="253" height="24" transform="translate(69 347)" fill="url(#linear-gradient-2)"/>\n                            <g id="Elipse_4" data-name="Elipse 4" transform="translate(221 374)" fill="#fff" stroke="#191919" stroke-width="1">\n                              <ellipse cx="59" cy="58" rx="59" ry="58" stroke="none"/>\n                              <ellipse cx="59" cy="58" rx="58.5" ry="57.5" fill="none"/>\n                            </g>\n                          </g>\n                          <text id="_123" data-name="123" transform="translate(240 448)" font-size="45" font-family="Menlo-Regular, Menlo"><tspan x="0" y="0">123</tspan></text>\n                        </g>\n                      </svg>\n                      <input tabindex="-1"/>\n                   </div>\n                 </div>\n              \n              </div>\n           </div>\n           ${y({showButton:t.renderPaymentButton||!1,classContainerButton:"container-pay-button",tonderButtonId:`${t.collectorIds.tonderPayButton}${o.skyflow_id}`,classButton:"tndr-button card-pay-button pay-button",msgErrorId:`${t.collectorIds.msgError}${o.skyflow_id}`,msgErrorTextId:`${t.collectorIds.msgErrorText}${o.skyflow_id}`,msgNotificationId:`${t.collectorIds.msgNotification}${o.skyflow_id}`,msgNotificationTextId:`${t.collectorIds.msgNotificationText}${o.skyflow_id}`,buttonText:null===(a=null===(i=t.customization)||void 0===i?void 0:i.paymentButton)||void 0===a?void 0:a.text})}\n        </div>\n      </div>\n    </div>`}),"")}\n  </div>\n  ${`\n    <style>\n      @import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;700&display=swap");\n      .ac {\n        border: none;\n        background-color: transparent;\n        box-sizing: border-box;\n        margin-bottom: 0;\n        border-bottom: 1px solid #e2e8f0;\n      }\n      .ac-option-panel-container{\n        padding: ${(null==t?void 0:t.renderPaymentButton)?"20px 32px 0px 32px":"20px 32px 20px 32px"};\n      }\n      .cvvContainer{\n       max-width: 60%; \n       position: relative;\n       padding: 0 0 0 29px;\n      }\n      .cvvIcon {\n        position: absolute;\n        right: 8px;\n        top: 12px;\n        opacity: 0;\n        transform: translateY(10px);\n        transition: opacity 0.3s ease, transform 0.3s ease;\n      }\n      .label-cvv-cards {\n        opacity: 0;\n      }\n      .cvvContainer.show .label-cvv-cards{\n        opacity: 1;\n        transition-delay: 0.3s;\n      }\n      .cvvContainer.show .cvvIcon,\n      .ac-option-panel-container.show .card-pay-button {\n        opacity: 1;\n        transform: translateY(0);\n        transition-delay: 0.3s;\n      }\n      .error-custom-inputs-tonder-cards{\n        bottom: 2px !important;\n      }\n      .container-card-pay-button{\n        margin: 20px 0px;\n      }\n      .card-pay-button{\n        display: block;\n        opacity: 0;\n        transform: translateY(10px);\n        transition: opacity 0.3s ease, transform 0.3s ease;\n      }\n      \n      .ac .ac-header {\n        margin: 0;\n        padding: 0;\n      }\n      \n      .ac .ac-trigger {\n        font:\n          bold 16px "Arial",\n          sans-serif;\n        color: var(--color-black);\n        text-align: left;\n        width: 100%;\n        padding: 8px 32px 8px 8px;\n        display: block;\n        cursor: pointer;\n        background-color: transparent;\n        transition: color 0.25s ease;\n        position: relative;\n        text-decoration: none;\n        margin: 0;\n        border: 0;\n      }\n      \n      .ac .ac-trigger::after {\n        content: "+";\n        text-align: center;\n        width: 15px;\n        transform: translate(0, -50%);\n        position: absolute;\n        right: 10px;\n        top: 50%;\n      }\n      \n      .ac .ac-trigger:focus {\n        color: var(--color-grey);\n      }\n      \n      .ac .ac-panel {\n        overflow: hidden;\n        transition-property: height, visibility;\n        transition-timing-function: ease;\n      }\n      \n      .ac .ac-panel .ac-text {\n        font:\n          15px/24px "Arial",\n          sans-serif;\n        color: var(--color-black);\n        padding: 8px;\n        margin: 0;\n      }\n      \n      .ac.js-enabled .ac-panel {\n        visibility: hidden;\n      }\n      \n      .ac.is-active .ac-panel {\n        visibility: visible;\n      }\n      \n      .ac.is-active > .ac-header .ac-trigger::after {\n        content: "\\2013";\n      }\n      \n      .card-item-label {\n        display: flex;\n        justify-content: space-between;\n        align-items: center;\n        color: #1D1D1D;\n        gap: 33% 20px;\n        margin-top: 15px;\n        margin-bottom: 15px;\n        width: 100%;\n      }\n\n      .card-item {\n        position: relative;\n        display: flex;\n        justify-content: start;\n        align-items: center;\n        gap: 33% 15px;\n        padding: 0px 30px;\n      }\n\n      .card-item .card-number {\n        font-size: 16px;\n        font-family: "Inter", sans-serif !important;\n      }\n\n      .card-item .card-expiration {\n        font-size: 16px;\n        font-family: "Inter", sans-serif !important;\n      }\n\n      .card-image {\n        width: 39px;\n        height: 24px;\n        text-align: left;\n      }\n\n      .card-delete-button {\n        background-color: transparent !important;\n        color: #000000 !important;\n      }\n\n      .card-delete-button:hover {\n        background-color: transparent !important;\n        color: #D91C1C !important;\n      }\n\n      .card_selected {\n        position: relative;\n        width: 16px;\n        height: 16px;\n        appearance: none;\n        cursor: pointer;\n        border-radius: 100%;\n        border: 1px #3bc635 solid;\n        color: #3bc635;\n        transition-property: all;\n        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n        transition-duration: 150ms;\n      }\n      \n      .card_selected:before {\n        width: 8px;\n        height: 8px;\n        content: "";\n        position: absolute;\n        top: 50%;\n        left: 50%;\n        display: block;\n        transform: translate(-50%, -50%);\n        border-radius: 100%;\n        background-color: #3bc635;\n        opacity: 0;\n        transition-property: opacity;\n        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n        transition-duration: 150ms;\n      }\n      \n      .card_selected:checked {\n        border: 1px #3bc635 solid;\n        position: relative;\n        width: 16px;\n        height: 16px;\n        appearance: none;\n        cursor: pointer;\n        border-radius: 100%;\n        color: #3bc635;\n        transition-property: all;\n        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n        transition-duration: 150ms;\n      }\n      \n      .card_selected:checked:before {\n        content: "";\n        border: 1px #3bc635 solid;\n        width: 8px;\n        height: 8px;\n        position: absolute;\n        top: 50%;\n        left: 50%;\n        display: block;\n        transform: translate(-50%, -50%);\n        border-radius: 100%;\n        background-color: #3bc635;\n        opacity: 50;\n        transition-property: opacity;\n        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n        transition-duration: 150ms;\n      }\n      \n      .card_selected:hover:before {\n        width: 8px;\n        height: 8px;\n        content: "";\n        position: absolute;\n        top: 50%;\n        left: 50%;\n        display: block;\n        transform: translate(-50%, -50%);\n        border-radius: 100%;\n        background-color: #3bc635;\n        transition-property: opacity;\n        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n        transition-duration: 150ms;\n        opacity: 10;\n      }\n      @media screen and (max-width: 768px) {\n        .cvvContainer {\n          max-width: 70%;\n        }\n      }\n    \n      @media screen and (max-width: 480px) {\n        .cvvContainer {\n          max-width: 100%;\n        }\n      }\n    </style>\n  `}\n  `,v=n=>`\n  <div class="accordion-container-apm">\n    ${n.apms.reduce(((t,e)=>{var o,i;const a=(n=>{const t=u(n.toUpperCase());return{[l.SORIANA]:{label:"Soriana",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/soriana.png"},[l.OXXO]:{label:"Oxxo",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/oxxo.png"},[l.CODI]:{label:"CoDi",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/codi.png"},[l.SPEI]:{label:"SPEI",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/spei.png"},[l.PAYPAL]:{label:"Paypal",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/paypal.png"},[l.COMERCIALMEXICANA]:{label:"Comercial Mexicana",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/comercial_exicana.png"},[l.BANCOMER]:{label:"Bancomer",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/bancomer.png"},[l.WALMART]:{label:"Walmart",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/walmart.png"},[l.BODEGA]:{label:"Bodega Aurrera",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/bodega_aurrera.png"},[l.SAMSCLUB]:{label:"Sam´s Club",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/sams_club.png"},[l.SUPERAMA]:{label:"Superama",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/superama.png"},[l.CALIMAX]:{label:"Calimax",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/calimax.png"},[l.EXTRA]:{label:"Tiendas Extra",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/tiendas_extra.png"},[l.CIRCULOK]:{label:"Círculo K",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/circulo_k.png"},[l.MERCADOPAGO]:{label:"Mercado Pago",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/mercadopago.png"},[l.OXXOPAY]:{label:"Oxxo Pay",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/oxxopay.png"},[l.SEVEN11]:{label:"7 Eleven",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/7_eleven.png"},[l.TELECOMM]:{label:"Telecomm",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/telecomm.png"},[l.BANORTE]:{label:"Banorte",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/banorte.png"},[l.BENAVIDES]:{label:"Farmacias Benavides",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_benavides.png"},[l.DELAHORRO]:{label:"Farmacias del Ahorro",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_ahorro.png"},[l.ELASTURIANO]:{label:"El Asturiano",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/asturiano.png"},[l.WALDOS]:{label:"Waldos",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/waldos.png"},[l.ALSUPER]:{label:"Alsuper",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/al_super.png"},[l.KIOSKO]:{label:"Kiosko",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/kiosko.png"},[l.STAMARIA]:{label:"Farmacias Santa María",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_santa_maria.png"},[l.LAMASBARATA]:{label:"Farmacias la más barata",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_barata.png"},[l.FARMROMA]:{label:"Farmacias Roma",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_roma.png"},[l.FARMUNION]:{label:"Pago en Farmacias Unión",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_union.png"},[l.FARMATODO]:{label:"Pago en Farmacias Farmatodo",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_farmatodo.png\t"},[l.SFDEASIS]:{label:"Pago en Farmacias San Francisco de Asís",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_san_francisco.png"},[l.FARM911]:{label:"Farmacias 911",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[l.FARMECONOMICAS]:{label:"Farmacias Economicas",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[l.FARMMEDICITY]:{label:"Farmacias Medicity",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[l.RIANXEIRA]:{label:"Rianxeira",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[l.WESTERNUNION]:{label:"Western Union",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[l.ZONAPAGO]:{label:"Zona Pago",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[l.CAJALOSANDES]:{label:"Caja Los Andes",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[l.CAJAPAITA]:{label:"Caja Paita",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[l.CAJASANTA]:{label:"Caja Santa",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[l.CAJASULLANA]:{label:"Caja Sullana",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[l.CAJATRUJILLO]:{label:"Caja Trujillo",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[l.EDPYME]:{label:"Edpyme",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[l.KASNET]:{label:"KasNet",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[l.NORANDINO]:{label:"Norandino",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[l.QAPAQ]:{label:"Qapaq",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[l.RAIZ]:{label:"Raiz",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[l.PAYSER]:{label:"Paysera",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[l.WUNION]:{label:"Western Union",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[l.BANCOCONTINENTAL]:{label:"Banco Continental",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[l.GMONEY]:{label:"Go money",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[l.GOPAY]:{label:"Go pay",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[l.WU]:{label:"Western Union",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[l.PUNTOSHEY]:{label:"Puntoshey",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[l.AMPM]:{label:"Ampm",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[l.JUMBOMARKET]:{label:"Jumbomarket",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[l.SMELPUEBLO]:{label:"Smelpueblo",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[l.BAM]:{label:"Bam",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[l.REFACIL]:{label:"Refacil",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[l.ACYVALORES]:{label:"Acyvalores",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"}}[t]||{icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png",label:""}})(e.payment_method);return`\n    ${t}\n    <div class="ac ac-paymentMethods" id="option_container-${e.pk}">\n      <div class="apm-item">\n          <input id="${e.pk}" class="paymentMethods card_selected" name="card_selected" type="radio"/>\n          <label class="apm-item-label" for="${e.pk}">\n            <div class="apm-image">\n              <div class="apm-image-border"></div>\n              <img src="${a.icon}" />\n            </div>\n            <div class="apm-name">${a.label}</div>\n          </label>\n      </div>\n      <div class="ac-panel">\n        <div class="ac-option-panel-container tndr-pm-item-container" id="acContainer${e.pk}">\n         ${y({showButton:n.renderPaymentButton||!1,classContainerButton:"container-pay-button",tonderButtonId:`${n.collectorIds.tonderPayButton}${e.pk}`,classButton:"tndr-button card-pay-button pay-button",msgErrorId:`${n.collectorIds.msgError}${e.pk}`,msgErrorTextId:`${n.collectorIds.msgErrorText}${e.pk}`,msgNotificationId:`${n.collectorIds.msgNotification}${e.pk}`,msgNotificationTextId:`${n.collectorIds.msgNotificationText}${e.pk}`,buttonText:null===(i=null===(o=n.customization)||void 0===o?void 0:o.paymentButton)||void 0===i?void 0:i.text})}\n        </div>\n      </div>\n    </div>\n`}),"")}\n  </div>\n  \n    <style>\n      .apm-item-label {\n        display: flex;\n        justify-content: flex-start;\n        align-items: center;\n        color: #1D1D1D;\n        gap: 33% 10px;\n        margin-top: 15px;\n        margin-bottom: 15px;\n        width: 100%;\n      }\n      .ac-option-panel-container.tndr-pm-item-container{\n        padding-top: 0;\n      }\n      .apm-item {\n        position: relative;\n        display: flex;\n        justify-content: start;\n        align-items: center;\n        gap: 33% 15px;\n        padding: 0px 30px;\n      }\n\n      .apm-item:first-child {\n        border-top: 1px solid #e2e8f0;\n      }\n\n      .apm-item .apm-name {\n        font-size: 16px;\n      }\n      .apm-image {\n        width: 30px;\n        height: 30px;\n        position: relative;\n        display: flex;\n        justify-content: center;\n        align-items: center;\n      }\n      .apm-image img {\n        width: auto;\n        height: 30px;\n      }\n      .apm-image-border{\n        position: absolute;\n        border: 1px solid #bababa36;\n        border-radius: 4px;\n        pointer-events: none;\n        box-sizing: border-box;\n        width: 100%;\n        height: 97%;\n      }\n\n      .card_selected {\n        position: relative;\n        width: 16px;\n        min-width: 16px;\n        height: 16px;\n        appearance: none;\n        cursor: pointer;\n        border-radius: 100%;\n        border: 1px #bababa solid;\n        color: #3bc635;\n        transition-property: all;\n        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n        transition-duration: 150ms;\n      }\n      \n      .card_selected:before {\n        width: 8px;\n        height: 8px;\n        content: "";\n        position: absolute;\n        top: 50%;\n        left: 50%;\n        display: block;\n        transform: translate(-50%, -50%);\n        border-radius: 100%;\n        background-color: #3bc635;\n        opacity: 0;\n        transition-property: opacity;\n        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n        transition-duration: 150ms;\n      }\n      \n      .card_selected:checked {\n        border: 1px #3bc635 solid;\n        position: relative;\n        width: 16px;\n        height: 16px;\n        min-width: 16px;\n        appearance: none;\n        cursor: pointer;\n        border-radius: 100%;\n        color: #3bc635;\n        transition-property: all;\n        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n        transition-duration: 150ms;\n      }\n      \n      .card_selected:checked:before {\n        content: "";\n        border: 1px #3bc635 solid;\n        width: 8px;\n        height: 8px;\n        position: absolute;\n        top: 50%;\n        left: 50%;\n        display: block;\n        transform: translate(-50%, -50%);\n        border-radius: 100%;\n        background-color: #3bc635;\n        opacity: 50;\n        transition-property: opacity;\n        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n        transition-duration: 150ms;\n      }\n      \n      .card_selected:hover:before {\n        width: 8px;\n        height: 8px;\n        content: "";\n        position: absolute;\n        top: 50%;\n        left: 50%;\n        display: block;\n        transform: translate(-50%, -50%);\n        border-radius: 100%;\n        background-color: #3bc635;\n        transition-property: opacity;\n        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n        transition-duration: 150ms;\n        opacity: 10;\n      }\n\n    </style>\n  \n  `,y=n=>`\n      ${n.showButton?`\n         <div class="${n.classContainerButton}">\n          <button id="${n.tonderButtonId}" class="${n.classButton}">${n.buttonText}</button>\n        </div>\n        `:""}\n        <div id="${n.msgErrorId}" class="error-container">\n            <svg xmlns="http://www.w3.org/2000/svg" width="18" height="17" viewBox="0 0 28.25 27.828">\n              <path id="Cancel_Icon" data-name="Cancel Icon" d="M89.04-859.129l5.085-5.009,5.085,5.009,1.978-1.948L96.1-866.086l5.085-5.009-1.978-1.948-5.085,5.009-5.085-5.009L87.063-871.1l5.085,5.009-5.085,5.009Zm5.085,6.957a13.935,13.935,0,0,1-5.509-1.1,14.276,14.276,0,0,1-4.485-2.974,14.04,14.04,0,0,1-3.019-4.418A13.375,13.375,0,0,1,80-866.086a13.374,13.374,0,0,1,1.112-5.426,14.041,14.041,0,0,1,3.019-4.418,14.277,14.277,0,0,1,4.485-2.974,13.932,13.932,0,0,1,5.509-1.1,13.933,13.933,0,0,1,5.509,1.1,14.278,14.278,0,0,1,4.485,2.974,14.041,14.041,0,0,1,3.019,4.418,13.374,13.374,0,0,1,1.112,5.426,13.375,13.375,0,0,1-1.112,5.426,14.04,14.04,0,0,1-3.019,4.418,14.276,14.276,0,0,1-4.485,2.974A13.935,13.935,0,0,1,94.125-852.172Z" transform="translate(-80 880)" fill="#832828"/>\n            </svg>\n            <p id="${n.msgErrorTextId}"></p>\n          </div>\n          <div id="${n.msgNotificationId}" class="message-container">\n            <svg xmlns="http://www.w3.org/2000/svg" width="18" height="17" viewBox="0 0 28.25 27.828">\n              <path id="Check_Circle_Icon" data-name="Check Circle Icon" d="M92.147-859.686l9.958-9.809-1.977-1.948-7.981,7.861-4.026-3.965L86.144-865.6Zm1.978,7.513a13.935,13.935,0,0,1-5.509-1.1,14.278,14.278,0,0,1-4.485-2.974,14.041,14.041,0,0,1-3.019-4.418A13.374,13.374,0,0,1,80-866.086a13.374,13.374,0,0,1,1.112-5.426,14.041,14.041,0,0,1,3.019-4.418,14.278,14.278,0,0,1,4.485-2.974,13.935,13.935,0,0,1,5.509-1.1,13.935,13.935,0,0,1,5.509,1.1,14.278,14.278,0,0,1,4.485,2.974,14.041,14.041,0,0,1,3.019,4.418,13.374,13.374,0,0,1,1.112,5.426,13.374,13.374,0,0,1-1.112,5.426,14.041,14.041,0,0,1-3.019,4.418,14.278,14.278,0,0,1-4.485,2.974A13.935,13.935,0,0,1,94.125-852.172Z" transform="translate(-80 880)" fill="#28832c"/>\n            </svg>\n            <p id="${n.msgNotificationTextId}"></p>\n          </div> \n  `;function b(n,e,o,a){return i(this,arguments,void 0,(function*(n,e,o,i,a={},l,s){var d,c,p,u,m,h,v,y,b,x,E,A,I,S,w,P,L,_,O,N,k,B,M,j,T,R,$,D,z,U,Y,F,H,G,V,W;const X=(yield g(n,e,o,s,i)).container(t.ContainerType.COLLECT);var q=0===Object.keys(a).length?r:Object.assign(Object.assign({},a),{labels:{nameLabel:(null===(d=null==a?void 0:a.labels)||void 0===d?void 0:d.nameLabel)&&""!==(null===(c=null==a?void 0:a.labels)||void 0===c?void 0:c.nameLabel)?null===(p=null==a?void 0:a.labels)||void 0===p?void 0:p.nameLabel:r.labels.nameLabel,cardLabel:(null===(u=null==a?void 0:a.labels)||void 0===u?void 0:u.cardLabel)&&""!==(null===(m=null==a?void 0:a.labels)||void 0===m?void 0:m.cardLabel)?null===(h=null==a?void 0:a.labels)||void 0===h?void 0:h.cardLabel:r.labels.cardLabel,cvvLabel:(null===(v=null==a?void 0:a.labels)||void 0===v?void 0:v.cvvLabel)&&""!==(null===(y=null==a?void 0:a.labels)||void 0===y?void 0:y.cvvLabel)?null===(b=null==a?void 0:a.labels)||void 0===b?void 0:b.cvvLabel:r.labels.cvvLabel,expiryDateLabel:(null===(x=null==a?void 0:a.labels)||void 0===x?void 0:x.expiryDateLabel)&&""!==(null===(E=null==a?void 0:a.labels)||void 0===E?void 0:E.expiryDateLabel)?null===(A=null==a?void 0:a.labels)||void 0===A?void 0:A.expiryDateLabel:r.labels.expiryDateLabel},placeholders:{namePlaceholder:(null===(I=null==a?void 0:a.placeholders)||void 0===I?void 0:I.namePlaceholder)&&""!==(null===(S=null==a?void 0:a.placeholders)||void 0===S?void 0:S.namePlaceholder)?null===(w=null==a?void 0:a.placeholders)||void 0===w?void 0:w.namePlaceholder:r.placeholders.namePlaceholder,cardPlaceholder:(null===(P=null==a?void 0:a.placeholders)||void 0===P?void 0:P.cardPlaceholder)&&""!==(null===(L=null==a?void 0:a.placeholders)||void 0===L?void 0:L.cardPlaceholder)?null===(_=null==a?void 0:a.placeholders)||void 0===_?void 0:_.cardPlaceholder:r.placeholders.cardPlaceholder,cvvPlaceholder:(null===(O=null==a?void 0:a.placeholders)||void 0===O?void 0:O.cvvPlaceholder)&&""!==(null===(N=null==a?void 0:a.placeholders)||void 0===N?void 0:N.cvvPlaceholder)?null===(k=null==a?void 0:a.placeholders)||void 0===k?void 0:k.cvvPlaceholder:r.placeholders.cvvPlaceholder,expiryMonthPlaceholder:(null===(B=null==a?void 0:a.placeholders)||void 0===B?void 0:B.expiryMonthPlaceholder)&&""!==(null===(M=null==a?void 0:a.placeholders)||void 0===M?void 0:M.expiryMonthPlaceholder)?null===(j=null==a?void 0:a.placeholders)||void 0===j?void 0:j.expiryMonthPlaceholder:r.placeholders.expiryMonthPlaceholder,expiryYearPlaceholder:(null===(T=null==a?void 0:a.placeholders)||void 0===T?void 0:T.expiryYearPlaceholder)&&""!==(null===(R=null==a?void 0:a.placeholders)||void 0===R?void 0:R.expiryYearPlaceholder)?null===($=null==a?void 0:a.placeholders)||void 0===$?void 0:$.expiryYearPlaceholder:r.placeholders.expiryYearPlaceholder}});const K=Object.assign({},q.inputStyles.base);K.textIndent="44px";const J={type:t.ValidationRuleType.LENGTH_MATCH_RULE,params:{max:70,error:"El campo nombre del titular debe tener menos de 70 caracteres"}},Z=X.create(Object.assign(Object.assign({table:"cards",column:"cardholder_name"},q),{label:null===(D=null==q?void 0:q.labels)||void 0===D?void 0:D.nameLabel,placeholder:null===(z=null==q?void 0:q.placeholders)||void 0===z?void 0:z.namePlaceholder,type:t.ElementType.CARDHOLDER_NAME,validations:[J,C]}));"on"in Z&&(Z.on(t.EventName.CHANGE,(n=>{let t=document.getElementById("errorCardHolderIdTonder");t&&n.isValid&&!n.isEmpty&&t.remove()})),Z.on(t.EventName.BLUR,(n=>{let t=document.getElementById(l.holderName),e=document.getElementById("errorCardHolderIdTonder");if(e&&e.remove(),!n.isValid){let e=document.createElement("div");e.classList.add("error-custom-inputs-tonder"),e.id="errorCardHolderIdTonder",e.textContent=n.isEmpty?"El campo es requerido":"El campo titular de la tarjeta es inválido",null==t||t.appendChild(e)}})));const Q=X.create(Object.assign(Object.assign({table:"cards",column:"card_number"},q),{inputStyles:Object.assign(Object.assign({},q.inputStyles),{base:K}),label:null===(U=q.labels)||void 0===U?void 0:U.cardLabel,placeholder:null===(Y=q.placeholders)||void 0===Y?void 0:Y.cardPlaceholder,type:t.ElementType.CARD_NUMBER,validations:[C]}));"on"in Q&&(Q.on(t.EventName.CHANGE,(n=>{let t=document.getElementById("errorCardNumberIdTonder");t&&n.isValid&&!n.isEmpty&&t.remove()})),Q.on(t.EventName.BLUR,(n=>{let t=document.getElementById(l.cardNumber),e=document.getElementById("errorCardNumberIdTonder");if(e&&e.remove(),!n.isValid){let e=document.createElement("div");e.classList.add("error-custom-inputs-tonder"),e.id="errorCardNumberIdTonder",e.textContent=n.isEmpty?"El campo es requerido":"El campo número de tarjeta es inválido",null==t||t.appendChild(e)}})));const nn=X.create(Object.assign(Object.assign({table:"cards",column:"cvv"},q),{label:null===(F=q.labels)||void 0===F?void 0:F.cvvLabel,placeholder:null===(H=q.placeholders)||void 0===H?void 0:H.cvvPlaceholder,type:t.ElementType.CVV,validations:[C]}));"on"in nn&&(nn.on(t.EventName.CHANGE,(n=>{let t=document.getElementById("errorCvvIdTonder");t&&n.isValid&&!n.isEmpty&&t.remove()})),nn.on(t.EventName.BLUR,(n=>{let t=document.getElementById(l.cvv),e=document.getElementById("errorCvvIdTonder");if(e&&e.remove(),!n.isValid){let e=document.createElement("div");e.classList.add("error-custom-inputs-tonder"),e.id="errorCvvIdTonder",e.textContent=n.isEmpty?"El campo es requerido":"El campo es inválido",null==t||t.appendChild(e)}})));const tn=X.create(Object.assign(Object.assign({table:"cards",column:"expiration_month"},q),{label:null===(G=q.labels)||void 0===G?void 0:G.expiryDateLabel,placeholder:null===(V=q.placeholders)||void 0===V?void 0:V.expiryMonthPlaceholder,type:t.ElementType.EXPIRATION_MONTH,validations:[C]}));"on"in tn&&(tn.on(t.EventName.CHANGE,(n=>{let t=document.getElementById("errorExpiryMonthIdTonder");t&&n.isValid&&!n.isEmpty&&t.remove()})),tn.on(t.EventName.BLUR,(n=>{let t=document.getElementById(l.expirationMonth),e=document.getElementById("errorExpiryMonthIdTonder");if(e&&e.remove(),!n.isValid){let e=document.createElement("div");e.classList.add("error-custom-inputs-tonder"),e.id="errorExpiryMonthIdTonder",e.textContent=n.isEmpty?"El campo es requerido":"El campo es inválido",null==t||t.appendChild(e)}}))),console.log("collectStylesOptions ====",q);const en=X.create(Object.assign(Object.assign({table:"cards",column:"expiration_year"},q),{label:"",placeholder:null===(W=q.placeholders)||void 0===W?void 0:W.expiryYearPlaceholder,type:t.ElementType.EXPIRATION_YEAR,validations:[C]}));"on"in en&&(en.on(t.EventName.CHANGE,(n=>{let t=document.getElementById("errorExpiryYearIdTonder");t&&n.isValid&&!n.isEmpty&&t.remove()})),en.on(t.EventName.BLUR,(n=>{let t=document.getElementById(l.expirationYear),e=document.getElementById("errorExpiryYearIdTonder");if(e&&e.remove(),!n.isValid){let e=document.createElement("div");e.classList.add("error-custom-inputs-tonder"),e.id="errorExpiryYearIdTonder",e.textContent=n.isEmpty?"El campo es requerido":"El campo es inválido",null==t||t.appendChild(e)}})));const on={cardNumber:{element:Q,container:`#${l.cardNumber}`},cvv:{element:nn,container:`#${l.cvv}`},expiryMonth:{element:tn,container:`#${l.expirationMonth}`},expiryYear:{element:en,container:`#${l.expirationYear}`},cardHolderName:{element:Z,container:`#${l.holderName}`}};return yield f(on),{container:X,elements:{cardHolderNameElement:Z,cardNumberElement:Q,cvvElement:nn,expiryMonthElement:tn,expiryYearElement:en}}}))}function g(n,e,o,a,l){return i(this,void 0,void 0,(function*(){return t.init({vaultID:n,vaultURL:e,getBearerToken:()=>i(this,void 0,void 0,(function*(){const n=yield fetch(`${o}/api/v1/vault-token/`,{method:"GET",headers:{Authorization:`Token ${a}`},signal:l});if(n.ok){return(yield n.json()).token}throw new Error("Failed to retrieve bearer token")})),options:{logLevel:t.LogLevel.ERROR,env:t.Env.DEV}})}))}function f(n){return i(this,void 0,void 0,(function*(){if("object"!=typeof n||null===n)throw new Error("Invalid configuration object");for(const[t,{element:e,container:o}]of Object.entries(n))e&&o?e.mount(o):console.warn(`Skipping mount for '${t}' due to missing element or container.`)}))}const x=RegExp("^(?!s*$).+"),C={type:t.ValidationRuleType.REGEX_MATCH_RULE,params:{regex:x,error:"El campo es requerido"}};var E,A,I,S,w,P,L,_,O,N,k,B,M,j,T,R,$,D,z,U,Y,F,H,G,V,W;class X extends e{constructor({apiKey:n,returnUrl:t,renderPaymentButton:e=!1,callBack:o=()=>{},styles:i,containerId:l,collectorIds:r,isOpenPaySandbox:s,isEnrollmentCard:d,renderSaveCardButton:c,mode:p="stage",customization:u}){var m,h;super({apiKey:n,returnUrl:t,mode:p,callBack:o,customization:u,tdsIframeId:r&&"tdsIframe"in r?null==r?void 0:r.tdsIframe:"tdsIframe",tonderPayButtonId:r?null==r?void 0:r.tonderPayButton:"tonderPayButton"}),E.add(this),this.paymentData={},this.deletingCards=[],A.set(this,[]),this.accordionCards=null,this.accordionPaymentMethods=null,this.apmsInjected=!1,this.apmsData=[],this.isOpenPaySandbox=!0,this.isEnrollmentCard=!1,I.set(this,{paymentButton:{show:!1,text:"Pagars",showAmount:!0}}),this.renderPaymentButton=e||!1,this.renderSaveCardButton=c,this.customStyles=i,this.abortRefreshCardsController=new AbortController,this.containerId=l||"tonder-checkout",this.injected=!1,this.cardsInjected=!1,this.collectorIds={cardsListContainer:"cardsListContainer",holderName:"collectCardholderName",cardNumber:"collectCardNumber",expirationMonth:"collectExpirationMonth",expirationYear:"collectExpirationYear",cvv:"collectCvv",tonderPayButton:"tonderPayButton",msgError:"msgError",msgErrorText:"msgErrorText",msgNotification:"msgNotification",tonderSaveCardButton:"tonderSaveCardButton",apmsListContainer:"apmsListContainer",msgNotificationText:"msgNotificationText",tdsIframe:"tdsIframe"},this.collectorIds=r?Object.assign(Object.assign({},this.collectorIds),r):this.collectorIds,this.radioChecked="new",this.collectContainer=null,this.updateCollectContainer=null,this.isOpenPaySandbox=void 0===s||s,this.isEnrollmentCard=void 0!==d&&d,this.customization=Object.assign(Object.assign(Object.assign({},this.customization),u||{}),{paymentButton:Object.assign(Object.assign(Object.assign({},a(this,I,"f").paymentButton),(null==u?void 0:u.paymentButton)||{}),{show:(null===(m=null==u?void 0:u.paymentButton)||void 0===m?void 0:m.show)||this.renderPaymentButton||(null===(h=a(this,I,"f").paymentButton)||void 0===h?void 0:h.show)})})}setCustomerEmail(n){this.customer=Object.assign(Object.assign({},this.customer),{email:n})}setPaymentData(n){var t;n&&(this.paymentData=n,this.setCartTotal((null===(t=n.cart)||void 0===t?void 0:t.total)||"0"))}injectCheckout(){return i(this,void 0,void 0,(function*(){if(this.injected)return;const n=document.querySelector(`#${this.containerId}`);if(n)return n.innerHTML=m({collectorIds:this.collectorIds,customStyles:this.customStyles,isEnrollmentCard:this.isEnrollmentCard,renderPaymentButton:this.renderPaymentButton,customization:this.customization,renderSaveCardButton:this.renderSaveCardButton}),yield a(this,E,"m",U).call(this),void(this.injected=!0);const t=new MutationObserver(((n,t)=>i(this,void 0,void 0,(function*(){const n=document.querySelector(`#${this.containerId}`);n&&(n.innerHTML=m({collectorIds:this.collectorIds,customStyles:this.customStyles,isEnrollmentCard:this.isEnrollmentCard,renderSaveCardButton:this.renderSaveCardButton,renderPaymentButton:this.renderPaymentButton,customization:this.customization}),yield a(this,E,"m",U).call(this),this.injected=!0,t.disconnect())}))));t.observe(document.body,{childList:!0,subtree:!0,attributeFilter:["id"]})}))}removeCheckout(){this.injected=!1,this.cardsInjected=!1,this.apmsInjected=!1,this.abortController.abort(),this.abortController=new AbortController,clearInterval(this.injectInterval),console.log("InlineCheckout removed from DOM and cleaned up.")}saveCard(){return i(this,void 0,void 0,(function*(){return new Promise(((n,t)=>i(this,void 0,void 0,(function*(){try{yield a(this,E,"m",G).call(this,!0,"Guardando..."),yield a(this,E,"m",V).call(this),n("Tarjeta registrada con éxito")}catch(n){t(n)}finally{yield a(this,E,"m",G).call(this)}}))))}))}_setCartTotal(n){this.cartTotal=n,a(this,E,"m",M).call(this)}setCartTotal(n){this.cartTotal=n,a(this,E,"m",M).call(this)}_checkout(){return i(this,void 0,void 0,(function*(){try{if(a(this,E,"m",M).call(this,{cardId:this.radioChecked,textContent:"Cargando...",disabled:!0}),this.merchantData){if("openpay_keys"in this.merchantData){const{business:n}=this.merchantData;let t;"new"===this.radioChecked||void 0===this.radioChecked?t=yield a(this,E,"m",H).call(this,this.collectorIds.tonderPayButton,this.radioChecked):(yield a(this,E,"m",H).call(this,this.collectorIds.tonderPayButton,this.radioChecked),t={skyflow_id:this.radioChecked});const e=yield this._getCustomer(),{auth_token:o}=e;o&&this.customer.email&&(yield a(this,E,"m",W).call(this,o,n.pk,t));const i=this.apmsData?this.apmsData.find((n=>n.pk===this.radioChecked)):null,l=yield this._handleCheckout(Object.assign(Object.assign({},i&&Object.keys(i).length>0?{payment_method:i.payment_method}:{card:t}),{customer:e}));return a(this,E,"m",M).call(this,{cardId:this.radioChecked,disabled:!1}),l||(s("No se ha podido procesar el pago",this.radioChecked,this.collectorIds.msgError),!1)}}else s("No se han configurado los datos del proveedor de servicio",this.radioChecked,this.collectorIds.msgError)}catch(n){throw console.log(n),s("Ha ocurrido un error",this.radioChecked,this.collectorIds.msgError),n}finally{a(this,E,"m",M).call(this,{cardId:this.radioChecked,disabled:!1})}}))}}A=new WeakMap,I=new WeakMap,E=new WeakSet,S=function(t){return i(this,void 0,void 0,(function*(){var e;if(this.cardsInjected||!(null===(e=this.customization.saveCards)||void 0===e?void 0:e.showSaved)||this.isEnrollmentCard)return;this.cardsInjected=!1;const o=yield this._getCustomerCards(t,this.merchantData.business.pk);!function(n,t,e,o,i){if("m"===o)throw new TypeError("Private method is not writable");if("a"===o&&!i)throw new TypeError("Private accessor was defined without a setter");if("function"==typeof t?n!==t||!i:!t.has(n))throw new TypeError("Cannot write private member to an object whose class did not declare it");"a"===o?i.call(n,e):i?i.value=e:t.set(n,e)}(this,A,n(o,"cards",[]),"f");let i=[];if("cards"in o){i=o.cards.map(p);const n=setInterval((()=>{const e=document.querySelector(`#${this.collectorIds.cardsListContainer}`);e&&this.injected&&(e.innerHTML=h({cards:i,collectorIds:this.collectorIds,renderPaymentButton:this.renderPaymentButton,customStyles:this.customStyles,customization:this.customization}),clearInterval(n),a(this,E,"m",w).call(this),a(this,E,"m",j).call(this,t),this.cardsInjected=!0)}),500)}}))},w=function(n="cards"){const t={cards:{accClass:"accordion-container",triggerClass:"card-item-label"},paymentMethods:{accClass:"accordion-container-apm",triggerClass:"apm-item-label"}},e=new o("."+t[n].accClass,{triggerClass:t[n].triggerClass,duration:300,collapse:!0,showMultiple:!1,onOpen:t=>i(this,void 0,void 0,(function*(){yield a(this,E,"m",_).call(this,t,n)}))});"cards"===n?this.accordionCards=e:"paymentMethods"===n&&(this.accordionPaymentMethods=e)},P=function(n="",t=null,e=!1,o=!1){[{type:"cards",accordion:this.accordionCards},{type:"paymentMethods",accordion:this.accordionPaymentMethods}].forEach((({accordion:i,type:l})=>{i&&(e&&"closeAll"in i&&i.closeAll(),o&&l!==n&&i.closeAll&&i.closeAll(),null!==t&&l===n&&i.open&&i.open("paymentMethods"!==l?t:t-(a(this,A,"f").length+1)))}))},L=function(n=[],t="show"){n.forEach((n=>{document.querySelectorAll("."+n).forEach((n=>{n.classList.remove(t)}))}))},_=function(n){return i(this,arguments,void 0,(function*(n,e="cards"){var o,l;console.log("Handling open card accordion for type:",e);const{vault_id:s,vault_url:d}=this.merchantData,c=n.id.replace("option_container-","");this.updateCollectContainer&&"unmount"in(null===(l=null===(o=this.updateCollectContainer)||void 0===o?void 0:o.elements)||void 0===l?void 0:l.cvvElement)&&this.updateCollectContainer.elements.cvvElement.unmount(),document.querySelectorAll(".cvvContainer").forEach((n=>{n.classList.remove("show")})),a(this,E,"m",L).call(this,["cvvContainer"]);const p=document.getElementById(c);p&&(p.checked=!0);try{"cards"===e&&(this.updateCollectContainer=yield function(n,e,o,a,l){return i(this,arguments,void 0,(function*(n,e,o,i,a,l={},s,d){var c,p,u,m,h,v,y,b,x,E,A,I,S,w,P,L,_,O,N,k,B,M,j,T,R,$,D,z;const U=yield g(e,o,i,d,a);var Y=0===Object.keys(l).length?r:Object.assign(Object.assign({},l),{labels:{nameLabel:(null===(c=null==l?void 0:l.labels)||void 0===c?void 0:c.nameLabel)&&""!==(null===(p=null==l?void 0:l.labels)||void 0===p?void 0:p.nameLabel)?null===(u=null==l?void 0:l.labels)||void 0===u?void 0:u.nameLabel:r.labels.nameLabel,cardLabel:(null===(m=null==l?void 0:l.labels)||void 0===m?void 0:m.cardLabel)&&""!==(null===(h=null==l?void 0:l.labels)||void 0===h?void 0:h.cardLabel)?null===(v=null==l?void 0:l.labels)||void 0===v?void 0:v.cardLabel:r.labels.cardLabel,cvvLabel:(null===(y=null==l?void 0:l.labels)||void 0===y?void 0:y.cvvLabel)&&""!==(null===(b=null==l?void 0:l.labels)||void 0===b?void 0:b.cvvLabel)?null===(x=null==l?void 0:l.labels)||void 0===x?void 0:x.cvvLabel:r.labels.cvvLabel,expiryDateLabel:(null===(E=null==l?void 0:l.labels)||void 0===E?void 0:E.expiryDateLabel)&&""!==(null===(A=null==l?void 0:l.labels)||void 0===A?void 0:A.expiryDateLabel)?null===(I=null==l?void 0:l.labels)||void 0===I?void 0:I.expiryDateLabel:r.labels.expiryDateLabel},placeholders:{namePlaceholder:(null===(S=null==l?void 0:l.placeholders)||void 0===S?void 0:S.namePlaceholder)&&""!==(null===(w=null==l?void 0:l.placeholders)||void 0===w?void 0:w.namePlaceholder)?null===(P=null==l?void 0:l.placeholders)||void 0===P?void 0:P.namePlaceholder:r.placeholders.namePlaceholder,cardPlaceholder:(null===(L=null==l?void 0:l.placeholders)||void 0===L?void 0:L.cardPlaceholder)&&""!==(null===(_=null==l?void 0:l.placeholders)||void 0===_?void 0:_.cardPlaceholder)?null===(O=null==l?void 0:l.placeholders)||void 0===O?void 0:O.cardPlaceholder:r.placeholders.cardPlaceholder,cvvPlaceholder:(null===(N=null==l?void 0:l.placeholders)||void 0===N?void 0:N.cvvPlaceholder)&&""!==(null===(k=null==l?void 0:l.placeholders)||void 0===k?void 0:k.cvvPlaceholder)?null===(B=null==l?void 0:l.placeholders)||void 0===B?void 0:B.cvvPlaceholder:r.placeholders.cvvPlaceholder,expiryMonthPlaceholder:(null===(M=null==l?void 0:l.placeholders)||void 0===M?void 0:M.expiryMonthPlaceholder)&&""!==(null===(j=null==l?void 0:l.placeholders)||void 0===j?void 0:j.expiryMonthPlaceholder)?null===(T=null==l?void 0:l.placeholders)||void 0===T?void 0:T.expiryMonthPlaceholder:r.placeholders.expiryMonthPlaceholder,expiryYearPlaceholder:(null===(R=null==l?void 0:l.placeholders)||void 0===R?void 0:R.expiryYearPlaceholder)&&""!==(null===($=null==l?void 0:l.placeholders)||void 0===$?void 0:$.expiryYearPlaceholder)?null===(D=null==l?void 0:l.placeholders)||void 0===D?void 0:D.expiryYearPlaceholder:r.placeholders.expiryYearPlaceholder}});const F=U.container(t.ContainerType.COLLECT),H=F.create(Object.assign(Object.assign({table:"cards",column:"cvv"},Y),{label:"",placeholder:null===(z=Y.placeholders)||void 0===z?void 0:z.cvvPlaceholder,type:t.ElementType.CVV,validations:[C],skyflowID:n}));"on"in H&&(H.on(t.EventName.CHANGE,(t=>{let e=document.getElementById(`errorCvvIdTonder${n}`);e&&t.isValid&&!t.isEmpty&&e.remove()})),H.on(t.EventName.BLUR,(t=>{let e=document.getElementById(s.cvv+n),o=document.getElementById("errorCvvIdTonder"+n);if(o&&o.remove(),!t.isValid){let o=document.createElement("div");o.classList.add("error-custom-inputs-tonder-cards"),o.classList.add("error-custom-inputs-tonder"),o.id="errorCvvIdTonder"+n,o.textContent=t.isEmpty?"El campo es requerido":"El campo es inválido",null==e||e.appendChild(o)}})));const G={cvv:{element:H,container:`#${s.cvv}${n}`}};return yield f(G),{container:F,elements:{cvvElement:H}}}))}(c,s,d,this.baseUrl,this.abortController.signal,this.customStyles,this.collectorIds,this.apiKeyTonder),setTimeout((()=>{const n=document.querySelector(`#cvvContainer${c}`);n&&n.classList.add("show")}),5)),a(this,E,"m",O).call(this,c)}catch(n){console.error("Ha ocurrido un error",n)}yield a(this,E,"m",$).call(this,p,null,e)}))},O=function(n=""){var t,e,o;if(console.log("Mounting pay button with cardId:",n),!this.renderPaymentButton)return;const l=`#${this.collectorIds.tonderPayButton}${n}`;let r=document.querySelector(l);r||(r=document.querySelector(`#${this.collectorIds.tonderPayButton}`));const s=`#acContainer${n}`,d=document.querySelector(s);if(!r)return void console.error("Pay button not found");if(""!==n){const n=document.querySelector(`#${this.collectorIds.tonderPayButton}`);n&&(n.style.display="none")}r.style.display="block";const c=Intl.NumberFormat("en-Latn-US",{minimumFractionDigits:2}).format(Number(this.cartTotal||0));r.textContent=`${null===(e=null===(t=this.customization)||void 0===t?void 0:t.paymentButton)||void 0===e?void 0:e.text} ${(null===(o=this.customization.paymentButton)||void 0===o?void 0:o.showAmount)?`$${c}`:""}`,document.querySelectorAll(".ac-option-panel-container").forEach((n=>{n.classList.remove("show")})),d&&d.classList.add("show"),r.onclick=n=>i(this,void 0,void 0,(function*(){n.preventDefault(),yield a(this,E,"m",N).call(this)}))},N=function(){return i(this,void 0,void 0,(function*(){try{yield this.payment({})}catch(n){console.error("Payment error:",n)}}))},k=function(){if(!this.renderSaveCardButton)return;const n=document.querySelector(`#${this.collectorIds.tonderSaveCardButton}`);n?(n.style.display="block",n.textContent="Guardar",n.onclick=t=>i(this,void 0,void 0,(function*(){t.preventDefault(),yield a(this,E,"m",B).call(this,n)}))):console.error("Save button not found")},B=function(n){return i(this,void 0,void 0,(function*(){const t=n.innerHTML;n.innerHTML='<div class="lds-dual-ring"></div>';try{const n=yield this.saveCard();this.callBack({message:n})}catch(n){console.error("Save card error:",n)}finally{n.innerHTML=t}}))},M=function(n){var t,e,o;try{const i=(null==n?void 0:n.cardId)&&"new"!==(null==n?void 0:n.cardId)?`#${this.collectorIds.tonderPayButton}${n.cardId}`:`#${this.collectorIds.tonderPayButton}`,a=(null==n?void 0:n.updatedTextContent)||!0,l=(null==n?void 0:n.textContent)||`${null===(e=null===(t=this.customization)||void 0===t?void 0:t.paymentButton)||void 0===e?void 0:e.text} ${(null===(o=this.customization.paymentButton)||void 0===o?void 0:o.showAmount)?`$${this.cartTotal}`:""}`,r=null==n?void 0:n.disabled,s=document.querySelector(i);if(!s)return;a&&(s.textContent=l),void 0!==r&&"disabled"in s&&(s.disabled=r)}catch(n){console.error("Pay button not found due to update",n)}},j=function(n=""){const t=document.getElementsByName("card_selected");for(const n of t)n.style.display="block",n.onclick=e=>i(this,void 0,void 0,(function*(){const e=n.classList[0],o=Array.from(t).indexOf(n);yield a(this,E,"m",$).call(this,n,o,e)}));const e=document.getElementsByClassName("card-delete-button");for(const t of e)t.addEventListener("click",(e=>i(this,void 0,void 0,(function*(){e.preventDefault(),e.stopImmediatePropagation(),yield a(this,E,"m",T).call(this,n,t)}))),!1)},T=function(n,t){return i(this,void 0,void 0,(function*(){var e,o;const i=t.attributes.getNamedItem("id"),l=null===(o=null===(e=null==i?void 0:i.value)||void 0===e?void 0:e.split("_"))||void 0===o?void 0:o[2];if(l){const t=document.querySelector(`#card_container-${l}`);t&&(t.style.display="none");try{this.deletingCards.push(l),this.abortRefreshCardsController&&(this.abortRefreshCardsController.abort(),this.abortRefreshCardsController=new AbortController),yield this._removeCustomerCard(n,this.merchantData.business.pk,l)}catch(n){}finally{this.deletingCards=this.deletingCards.filter((n=>n!==l)),yield a(this,E,"m",R).call(this,n)}}}))},R=function(n){return i(this,void 0,void 0,(function*(){this.deletingCards.length>0||(this.cardsInjected=!1,yield a(this,E,"m",S).call(this,n))}))},$=function(n){return i(this,arguments,void 0,(function*(n,t=null,e=""){if(n.id===this.radioChecked||"new"===n.id&&void 0===this.radioChecked)return;const o=document.querySelector(".container-form");o&&(o.style.display="new"===n.id?"block":"none"),console.log("radio.id",n.id),"new"===n.id?(a(this,E,"m",L).call(this,["cvvContainer"]),a(this,E,"m",P).call(this,"",null,!0),this.radioChecked!==n.id&&(yield a(this,E,"m",F).call(this),a(this,E,"m",O).call(this))):(a(this,E,"m",P).call(this,e,null,!1,!0),null!==t&&a(this,E,"m",P).call(this,e,t,!0),a(this,E,"m",Y).call(this)),this.radioChecked=n.id}))},D=function(){return i(this,void 0,void 0,(function*(){try{const n=yield this._fetchCustomerPaymentMethods();n&&n.results&&n.results.length>0&&(this.apmsData=n.results,a(this,E,"m",z).call(this,n.results))}catch(n){console.warn("Error getting APMS")}}))},z=function(n){if(this.apmsInjected)return;const t=setInterval((()=>{const e=document.querySelector(`#${this.collectorIds.apmsListContainer}`);e&&this.injected&&(e.innerHTML=v({apms:n,collectorIds:this.collectorIds,renderPaymentButton:this.renderPaymentButton,customization:this.customization}),clearInterval(t),a(this,E,"m",w).call(this,"paymentMethods"),a(this,E,"m",j).call(this),this.apmsInjected=!0)}),500)},U=function(){return i(this,void 0,void 0,(function*(){this.isEnrollmentCard?a(this,E,"m",k).call(this):a(this,E,"m",O).call(this),yield this._initializeCheckout();const{vault_id:n,vault_url:t}=this.merchantData;if(n){if(this.customer.email&&!this.isEnrollmentCard){const n=yield this._getCustomer();if("auth_token"in n){const{auth_token:t}=n;yield a(this,E,"m",S).call(this,t)}}this.isEnrollmentCard||(yield a(this,E,"m",D).call(this)),this.collectContainer=yield b(n,t,this.baseUrl,this.abortController.signal,this.customStyles,this.collectorIds,this.apiKeyTonder)}}))},Y=function(){this.injected=!1,this.collectContainer&&("unmount"in this.collectContainer.elements.cardHolderNameElement&&this.collectContainer.elements.cardHolderNameElement.unmount(),"unmount"in this.collectContainer.elements.cardNumberElement&&this.collectContainer.elements.cardNumberElement.unmount(),"unmount"in this.collectContainer.elements.expiryYearElement&&this.collectContainer.elements.expiryYearElement.unmount(),"unmount"in this.collectContainer.elements.expiryMonthElement&&this.collectContainer.elements.expiryMonthElement.unmount(),"unmount"in this.collectContainer.elements.cvvElement&&this.collectContainer.elements.cvvElement.unmount())},F=function(){return i(this,void 0,void 0,(function*(){yield this._initializeCheckout();const{vault_id:n,vault_url:t}=this.merchantData;n&&(this.collectContainer=yield b(n,t,this.baseUrl,this.abortController.signal,this.customStyles,this.collectorIds,this.apiKeyTonder))}))},H=function(n){return i(this,arguments,void 0,(function*(n,t=null){var e,o;try{const n=t&&"new"!==t?null===(e=this.updateCollectContainer)||void 0===e?void 0:e.container:null===(o=this.collectContainer)||void 0===o?void 0:o.container;if(n&&"collect"in n){const t=yield n.collect();return yield t.records[0].fields}s("Por favor, verifica todos los campos de tu tarjeta",this.radioChecked,this.collectorIds.msgError)}catch(n){throw s("Por favor, verifica todos los campos de tu tarjeta",this.radioChecked,this.collectorIds.msgError),n}}))},G=function(){return i(this,arguments,void 0,(function*(n=!1,t="Guardar"){try{const e=document.querySelector(`#${this.collectorIds.tonderSaveCardButton}`);e&&(e.disabled=n,e.innerHTML=t)}catch(n){}}))},V=function(){return i(this,void 0,void 0,(function*(){if(this.customer.email)try{if(this.merchantData&&"openpay_keys"in this.merchantData){const n=yield a(this,E,"m",H).call(this,this.collectorIds.tonderSaveCardButton),t=yield this._getCustomer();if("auth_token"in t&&this.secureToken){const{auth_token:e}=t;yield this._saveCustomerCard(e,this.merchantData.business.pk,{skyflow_id:n.skyflow_id}),d("Tarjeta registrada con éxito",this.radioChecked,this.collectorIds.msgNotification)}else s("No se han configurado los datos de seguridad para guardar tarjeta",this.radioChecked,this.collectorIds.msgError)}else s("No se han configurado los datos del proveedor de servicio",this.radioChecked,this.collectorIds.msgError)}catch(n){throw s("object"==typeof n&&null!==n&&"message"in n?null==n?void 0:n.message:"Ha ocurrido un error",this.radioChecked,this.collectorIds.msgError),n}}))},W=function(n,t,e){return i(this,void 0,void 0,(function*(){var o;const i=document.getElementById("save-checkout-card");if(i&&"checked"in i&&i.checked||(null===(o=this.customization.saveCards)||void 0===o?void 0:o.autoSave))try{this.secureToken?(yield this._saveCustomerCard(n,t,e),this.cardsInjected=!1,yield a(this,E,"m",S).call(this,n),d("Tarjeta registrada con éxito",this.radioChecked,this.collectorIds.msgNotification)):s("No se han configurado los datos de seguridad para guardar tarjeta",this.radioChecked,this.collectorIds.msgError)}catch(n){"object"==typeof n&&null!==n&&"message"in n&&"Error"!==(null==n?void 0:n.message)&&s(null==n?void 0:n.message,this.radioChecked,this.collectorIds.msgError)}}))};export{X as InlineCheckout};

package/dist/shared/enums/AccordionType.d.ts

@@ -0,0 +1 @@
+type AccordionType = "cards" | "paymentMethods";

package/dist/types/commons.d.ts

@@ -75,10 +75,22 @@ export interface InCollectorContainer {
         [index: string]: CollectElement | ComposableElement | RevealElement;
     };
 }
+export interface IInlineCustomizationOptions extends CustomizationOptions {
+    paymentButton?: {
+        show?: boolean;
+        text?: string;
+        showAmount?: boolean;
+    };
+    saveCards?: {
+        showSaveCardOption?: boolean;
+        showSaved?: boolean;
+        autoSave?: boolean;
+    };
+}
 export interface IInlineCheckoutOptions extends IInlineCheckoutBaseOptions {
     styles?: Record<string, string>;
     renderPaymentButton?: boolean;
-    customization?: CustomizationOptions;
+    customization?: IInlineCustomizationOptions;
     renderSaveCardButton?: boolean;
     containerId?: string;
     collectorIds?: CollectorIds;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tonder.io/ionic-full-sdk",
-  "version": "0.0.47",
+  "version": "0.0.48-beta.DEV-1610.2",
   "description": "Tonder ionic full SDK",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -10,7 +10,7 @@
   "author": "",
   "license": "ISC",
   "dependencies": {
-    "@tonder.io/ionic-lite-sdk": "^0.0.51",
+    "@tonder.io/ionic-lite-sdk": "0.0.52-beta.DEV-1610.2",
     "accordion-js": "^3.4.0",
     "crypto-js": "^4.1.1",
     "lodash.get": "^4.4.2",

package/src/classes/3dsHandler.ts

@@ -268,7 +268,8 @@ export class ThreeDSHandler {
   async requestTransactionStatus() {
 
     const verifyUrl = this.getUrlWithExpiration();
-    const url = `${this.baseUrl}${verifyUrl}`;
+    console.log('verifyUrls: ', verifyUrl);
+    const url = verifyUrl.startsWith("https://") ? verifyUrl : `${this.baseUrl}${verifyUrl}`;
     const response = await fetch(url, {
       method: "GET",
       headers: {
@@ -292,7 +293,7 @@ export class ThreeDSHandler {
     const verifyUrl = this.getUrlWithExpiration();
 
     if (verifyUrl) {
-      const url = `${this.baseUrl}${verifyUrl}`;
+      const url = verifyUrl.startsWith("https://") ? verifyUrl : `${this.baseUrl}${verifyUrl}`;
       try {
         const response = await fetch(url, {
           method: "GET",