@tonder.io/ionic-full-sdk 0.0.61 → 0.0.62-beta.DEV-2106.1

package/dist/helpers/card_on_file.d.ts

@@ -0,0 +1,177 @@
+export interface AcquirerInstance {
+    requestSecureInit: (params: SecureInitParams, callback: (response: SecureInitResponse | AcquirerErrorResponse) => void) => void;
+    requestValidate3DS: (params: Validate3DSParams, callback: (response: Validate3DSResponse | AcquirerErrorResponse) => void) => void;
+}
+export interface SecureInitParams {
+    card: {
+        number: string;
+    };
+}
+export interface SecureInitResponse {
+    jwt: string;
+}
+export interface Validate3DSParams {
+    secureId: string;
+    security: SecurityInfo;
+}
+export interface Validate3DSResponse {
+    code?: string;
+    message?: string;
+    isValid?: boolean;
+}
+export interface AcquirerErrorResponse {
+    code: string;
+    message: string;
+}
+export interface SecurityInfo {
+    acsURL: string;
+    authenticationTransactionId: string;
+    authRequired: boolean;
+    paReq: string;
+    specificationVersion: string;
+}
+export interface CardOnFileTokenRequest {
+    card: {
+        name: string;
+        number: string;
+        expiryMonth: string;
+        expiryYear: string;
+        cvv: string;
+    };
+    currency: string;
+    jwt: string;
+}
+export interface CardOnFileTokenResponse {
+    token: string;
+    secureId?: string;
+    secureService?: string;
+    security?: SecurityInfo;
+    details?: {
+        secureId?: string;
+        security?: SecurityInfo;
+    };
+}
+export interface CardOnFileSubscriptionRequest {
+    token: string;
+    contactDetails: {
+        firstName: string;
+        lastName: string;
+        email: string;
+    };
+    metadata: {
+        customerId: string;
+        notes?: string;
+    };
+    currency: string;
+}
+export interface CardOnFileSubscriptionResponse {
+    details: {
+        amount: {
+            subtotalIva: number;
+            subtotalIva0: number;
+            ice: number;
+            iva: number;
+            currency: string;
+        };
+        binCard: string;
+        binInfo: {
+            bank: string;
+            type: string;
+        };
+        cardHolderName: string;
+        contactDetails: {
+            firstName: string;
+            lastName: string;
+            email: string;
+        };
+        created: string;
+        lastFourDigits: string;
+        maskedCreditCard: string;
+        merchantId: string;
+        merchantName: string;
+        paymentBrand: string;
+        periodicity: string;
+        planName: string;
+        processorBankName: string;
+        startDate: string;
+    };
+    subscriptionId: string;
+}
+export interface SkyflowCollectFields {
+    card_number: string;
+    cvv: string;
+    expiration_month: string;
+    expiration_year: string;
+    cardholder_name: string;
+    skyflow_id: string;
+    [key: string]: string;
+}
+export interface SkyflowCollectRecord {
+    fields: SkyflowCollectFields;
+}
+export interface SkyflowCollectResponse {
+    records?: SkyflowCollectRecord[];
+}
+export interface CardTokens {
+    name: string;
+    number: string;
+    expiryMonth: string;
+    expiryYear: string;
+    cvv: string;
+}
+export interface ContactDetails {
+    firstName: string;
+    lastName: string;
+    email: string;
+}
+export interface ProcessParams {
+    cardTokens: CardTokens;
+    cardBin: string;
+    contactDetails: ContactDetails;
+    customerId: string;
+    currency: string;
+}
+declare global {
+    interface Window {
+        Kushki: new (config: {
+            merchantId: string;
+            inTestEnvironment: boolean;
+        }) => AcquirerInstance;
+    }
+}
+export declare class CardOnFile {
+    private readonly apiUrl;
+    private readonly merchantId;
+    private readonly apiKey;
+    private readonly isTestEnvironment;
+    private acquirerInstance;
+    constructor(config: {
+        merchantId: string;
+        apiKey: string;
+        isTestEnvironment?: boolean;
+    });
+    initialize(): Promise<void>;
+    private getAcquirerInstance;
+    /**
+     * Get JWT for 3DS authentication
+     * @param cardBin - First 8 digits of the card number
+     */
+    getJwt(cardBin: string): Promise<string>;
+    /**
+     * Generate a recurring charge token
+     */
+    generateToken(request: CardOnFileTokenRequest): Promise<CardOnFileTokenResponse>;
+    /**
+     * Create a subscription with the generated token
+     */
+    createSubscription(request: CardOnFileSubscriptionRequest): Promise<CardOnFileSubscriptionResponse>;
+    /**
+     * Validate 3DS challenge
+     * @returns true if validation passed, throws error otherwise
+     */
+    validate3DS(secureId: string, security: SecurityInfo): Promise<boolean>;
+    /**
+     * Complete flow: JWT → Token → 3DS validation → Subscription
+     */
+    process(params: ProcessParams): Promise<CardOnFileSubscriptionResponse>;
+}

package/dist/helpers/sdkInfo.d.ts

@@ -0,0 +1,4 @@
+export declare const SDK_INFO: Readonly<{
+    name: string;
+    version: string;
+}>;

package/dist/index.js

@@ -1 +1 @@
-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,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 t;n.done?i(n.value):(t=n.value,t instanceof e?t:new e((function(n){n(t)}))).then(a,r)}s((o=o.apply(n,t||[])).next())}))}function l(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)}function a(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");return"a"===o?i.call(n,e):i?i.value=e:t.set(n,e),e}var r;"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",n.SAFETYPAYCASH="SAFETYPAYCASH",n.SAFETYPAYTRANSFER="SAFETYPAYTRANSFER",n.NEOSURF="NEOSURF"}(r||(r={}));const s={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 d(n,t=null,e="msgError",o="msgErrorText"){try{const i=t&&"new"!==t;let l=document.getElementById(`${e}${i?t:""}`),a=document.getElementById(`${o}${i?t:""}`);a.innerHTML="",a.innerHTML=n,l.style.display="flex",setTimeout((function(){l.style.display="none",a.innerHTML=""}),3e4)}catch(n){console.warn("Error showing message error",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 h=(n={isEnrollmentCard:!1,collectorIds:{}})=>{var t,e,o,i,l,a,r,d,p,u,h,m,v,b,f,g,x,C,A,E,I,S,w,_,O,P,k,N,L,M,j,T,B,R,$,D,F,z,Y,U,H,G,X,W,K,V,q,J,Z,Q,nn,tn,en,on,ln,an,rn,sn,dn,cn,pn,un,hn,mn,vn,yn,bn,fn,gn,xn,Cn,An;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===(a=null===(l=n.customization)||void 0===l?void 0:l.paymentButton)||void 0===a?void 0:a.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  position: relative;\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  max-height: 85px;\n  overflow: hidden;\n}\n\n.empty-div {\n  position: relative !important;\n  margin-top: 2px;\n  margin-bottom: 4px;\n  max-height: 85px;\n  overflow: hidden;\n}\n.empty-div-card {\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===(r=null==n?void 0:n.customStyles)||void 0===r?void 0:r.labelStyles)||void 0===d?void 0:d.base)||void 0===p?void 0:p.lineHeight)?null===(m=null===(h=null===(u=null==n?void 0:n.customStyles)||void 0===u?void 0:u.labelStyles)||void 0===h?void 0:h.base)||void 0===m?void 0:m.lineHeight:""};\n    color: transparent;\n    font-size: ${(null===(f=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===f?void 0:f.fontSize)?null===(C=null===(x=null===(g=null==n?void 0:n.customStyles)||void 0===g?void 0:g.labelStyles)||void 0===x?void 0:x.base)||void 0===C?void 0:C.fontSize:s.labelStyles.base.fontSize};\n    font-family: ${(null===(I=null===(E=null===(A=null==n?void 0:n.customStyles)||void 0===A?void 0:A.labelStyles)||void 0===E?void 0:E.base)||void 0===I?void 0:I.fontFamily)?null===(_=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===_?void 0:_.fontFamily:s.labelStyles.base.fontFamily};\n    font-weight: ${(null===(k=null===(P=null===(O=null==n?void 0:n.customStyles)||void 0===O?void 0:O.labelStyles)||void 0===P?void 0:P.base)||void 0===k?void 0:k.fontWeight)?null===(M=null===(L=null===(N=null==n?void 0:n.customStyles)||void 0===N?void 0:N.labelStyles)||void 0===L?void 0:L.base)||void 0===M?void 0:M.fontWeight:s.labelStyles.base.fontWeight};\n    text-align: ${(null===(B=null===(T=null===(j=null==n?void 0:n.customStyles)||void 0===j?void 0:j.labelStyles)||void 0===T?void 0:T.base)||void 0===B?void 0:B.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:s.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===(z=null===(F=null==n?void 0:n.customStyles)||void 0===F?void 0:F.labelStyles)||void 0===z?void 0:z.base)||void 0===Y?void 0:Y.lineHeight)?null===(G=null===(H=null===(U=null==n?void 0:n.customStyles)||void 0===U?void 0:U.labelStyles)||void 0===H?void 0:H.base)||void 0===G?void 0:G.lineHeight:"22px"};\n    color: ${(null===(K=null===(W=null===(X=null==n?void 0:n.customStyles)||void 0===X?void 0:X.labelStyles)||void 0===W?void 0:W.base)||void 0===K?void 0:K.color)?null===(J=null===(q=null===(V=null==n?void 0:n.customStyles)||void 0===V?void 0:V.labelStyles)||void 0===q?void 0:q.base)||void 0===J?void 0:J.color:s.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:s.labelStyles.base.fontSize};\n    font-family: ${(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)?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:s.labelStyles.base.fontFamily};\n    font-weight: ${(null===(hn=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===hn?void 0:hn.fontWeight)?null===(yn=null===(vn=null===(mn=null==n?void 0:n.customStyles)||void 0===mn?void 0:mn.labelStyles)||void 0===vn?void 0:vn.base)||void 0===yn?void 0:yn.fontWeight:s.labelStyles.base.fontWeight};\n    text-align: ${(null===(gn=null===(fn=null===(bn=null==n?void 0:n.customStyles)||void 0===bn?void 0:bn.labelStyles)||void 0===fn?void 0:fn.base)||void 0===gn?void 0:gn.textAlign)?null===(An=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===An?void 0:An.textAlign:s.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: 0px !important;\n  margin-right: 10px !important;\n  width: 100%;\n  text-align: left;\n  display: flex;\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`},m=t=>`\n  <div class="accordion-container">\n    ${t.cards.reduce(((e,o)=>{var i,l;const{cvvLabel:a}=(r=t.customStyles,{labels:{nameLabel:n(r,"labels.nameLabel",s.labels.nameLabel),cardLabel:n(r,"labels.cardLabel",s.labels.cardLabel),cvvLabel:n(r,"labels.cvvLabel",s.labels.cvvLabel),expiryDateLabel:n(r,"labels.expiryDateLabel",s.labels.expiryDateLabel)},placeholders:{namePlaceholder:n(r,"placeholders.namePlaceholder",s.placeholders.namePlaceholder),cardPlaceholder:n(r,"placeholders.cardPlaceholder",s.placeholders.cardPlaceholder),cvvPlaceholder:n(r,"placeholders.cvvPlaceholder",s.placeholders.cvvPlaceholder),expiryMonthPlaceholder:n(r,"placeholders.expiryMonthPlaceholder",s.placeholders.expiryMonthPlaceholder),expiryYearPlaceholder:n(r,"placeholders.expiryYearPlaceholder",s.placeholders.expiryYearPlaceholder)}}).labels;var r;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           ${o.subscription_id&&t.hasCOF?"":`\n           <div class="cvvContainer" id="cvvContainer${o.skyflow_id}">\n             <label class="tndr-form-label label-cvv-cards">${a}</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           `}\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===(l=null===(i=t.customization)||void 0===i?void 0:i.paymentButton)||void 0===l?void 0:l.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       overflow: hidden;\n       max-height: 90px;\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 l=(n=>{const t=u(n.toUpperCase());return{[r.SORIANA]:{label:"Soriana",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/soriana.png"},[r.OXXO]:{label:"Oxxo",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/oxxo.png"},[r.CODI]:{label:"CoDi",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/codi.png"},[r.SPEI]:{label:"SPEI",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/spei.png"},[r.PAYPAL]:{label:"Paypal",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/paypal.png"},[r.COMERCIALMEXICANA]:{label:"Comercial Mexicana",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/comercial_exicana.png"},[r.BANCOMER]:{label:"Bancomer",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/bancomer.png"},[r.WALMART]:{label:"Walmart",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/walmart.png"},[r.BODEGA]:{label:"Bodega Aurrera",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/bodega_aurrera.png"},[r.SAMSCLUB]:{label:"Sam´s Club",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/sams_club.png"},[r.SUPERAMA]:{label:"Superama",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/superama.png"},[r.CALIMAX]:{label:"Calimax",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/calimax.png"},[r.EXTRA]:{label:"Tiendas Extra",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/tiendas_extra.png"},[r.CIRCULOK]:{label:"Círculo K",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/circulo_k.png"},[r.MERCADOPAGO]:{label:"Mercado Pago",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/mercadopago.png"},[r.OXXOPAY]:{label:"Oxxo Pay",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/oxxopay.png"},[r.SEVEN11]:{label:"7 Eleven",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/7_eleven.png"},[r.TELECOMM]:{label:"Telecomm",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/telecomm.png"},[r.BANORTE]:{label:"Banorte",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/banorte.png"},[r.BENAVIDES]:{label:"Farmacias Benavides",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_benavides.png"},[r.DELAHORRO]:{label:"Farmacias del Ahorro",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_ahorro.png"},[r.ELASTURIANO]:{label:"El Asturiano",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/asturiano.png"},[r.WALDOS]:{label:"Waldos",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/waldos.png"},[r.ALSUPER]:{label:"Alsuper",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/al_super.png"},[r.KIOSKO]:{label:"Kiosko",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/kiosko.png"},[r.STAMARIA]:{label:"Farmacias Santa María",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_santa_maria.png"},[r.LAMASBARATA]:{label:"Farmacias la más barata",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_barata.png"},[r.FARMROMA]:{label:"Farmacias Roma",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_roma.png"},[r.FARMUNION]:{label:"Pago en Farmacias Unión",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_union.png"},[r.FARMATODO]:{label:"Pago en Farmacias Farmatodo",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_farmatodo.png\t"},[r.SFDEASIS]:{label:"Pago en Farmacias San Francisco de Asís",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_san_francisco.png"},[r.FARM911]:{label:"Farmacias 911",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.FARMECONOMICAS]:{label:"Farmacias Economicas",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.FARMMEDICITY]:{label:"Farmacias Medicity",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.RIANXEIRA]:{label:"Rianxeira",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.WESTERNUNION]:{label:"Western Union",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.ZONAPAGO]:{label:"Zona Pago",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.CAJALOSANDES]:{label:"Caja Los Andes",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.CAJAPAITA]:{label:"Caja Paita",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.CAJASANTA]:{label:"Caja Santa",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.CAJASULLANA]:{label:"Caja Sullana",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.CAJATRUJILLO]:{label:"Caja Trujillo",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.EDPYME]:{label:"Edpyme",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.KASNET]:{label:"KasNet",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.NORANDINO]:{label:"Norandino",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.QAPAQ]:{label:"Qapaq",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.RAIZ]:{label:"Raiz",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.PAYSER]:{label:"Paysera",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.WUNION]:{label:"Western Union",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.BANCOCONTINENTAL]:{label:"Banco Continental",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.GMONEY]:{label:"Go money",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.GOPAY]:{label:"Go pay",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.WU]:{label:"Western Union",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.PUNTOSHEY]:{label:"Puntoshey",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.AMPM]:{label:"Ampm",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.JUMBOMARKET]:{label:"Jumbomarket",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.SMELPUEBLO]:{label:"Smelpueblo",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.BAM]:{label:"Bam",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.REFACIL]:{label:"Refacil",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.ACYVALORES]:{label:"Acyvalores",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.SAFETYPAYCASH]:{label:"Paga en Efectivo",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/cash_apm_sp.png"},[r.SAFETYPAYTRANSFER]:{label:"Paga por Transferencia",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/transfer_apm_sp.png"},[r.NEOSURF]:{label:"Neosurf",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/neosurf.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="${l.icon}" />\n            </div>\n            <div class="apm-name">${l.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,l){return i(this,arguments,void 0,(function*(n,e,o,i,l={},a,r,d){var c,p,u,h,m,v,y,b,x,E,I,S,w,_,O,P,k,N,L,M,j,T,B,R,$,D,F,z,Y,U,H,G,X,W,K,V,q,J;const Z=(yield f(n,e,o,r,i)).container(t.ContainerType.COLLECT);var Q=0===Object.keys(l).length?s: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:s.labels.nameLabel,cardLabel:(null===(h=null==l?void 0:l.labels)||void 0===h?void 0:h.cardLabel)&&""!==(null===(m=null==l?void 0:l.labels)||void 0===m?void 0:m.cardLabel)?null===(v=null==l?void 0:l.labels)||void 0===v?void 0:v.cardLabel:s.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:s.labels.cvvLabel,expiryDateLabel:(null===(E=null==l?void 0:l.labels)||void 0===E?void 0:E.expiryDateLabel)&&""!==(null===(I=null==l?void 0:l.labels)||void 0===I?void 0:I.expiryDateLabel)?null===(S=null==l?void 0:l.labels)||void 0===S?void 0:S.expiryDateLabel:s.labels.expiryDateLabel},placeholders:{namePlaceholder:(null===(w=null==l?void 0:l.placeholders)||void 0===w?void 0:w.namePlaceholder)&&""!==(null===(_=null==l?void 0:l.placeholders)||void 0===_?void 0:_.namePlaceholder)?null===(O=null==l?void 0:l.placeholders)||void 0===O?void 0:O.namePlaceholder:s.placeholders.namePlaceholder,cardPlaceholder:(null===(P=null==l?void 0:l.placeholders)||void 0===P?void 0:P.cardPlaceholder)&&""!==(null===(k=null==l?void 0:l.placeholders)||void 0===k?void 0:k.cardPlaceholder)?null===(N=null==l?void 0:l.placeholders)||void 0===N?void 0:N.cardPlaceholder:s.placeholders.cardPlaceholder,cvvPlaceholder:(null===(L=null==l?void 0:l.placeholders)||void 0===L?void 0:L.cvvPlaceholder)&&""!==(null===(M=null==l?void 0:l.placeholders)||void 0===M?void 0:M.cvvPlaceholder)?null===(j=null==l?void 0:l.placeholders)||void 0===j?void 0:j.cvvPlaceholder:s.placeholders.cvvPlaceholder,expiryMonthPlaceholder:(null===(T=null==l?void 0:l.placeholders)||void 0===T?void 0:T.expiryMonthPlaceholder)&&""!==(null===(B=null==l?void 0:l.placeholders)||void 0===B?void 0:B.expiryMonthPlaceholder)?null===(R=null==l?void 0:l.placeholders)||void 0===R?void 0:R.expiryMonthPlaceholder:s.placeholders.expiryMonthPlaceholder,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)?null===(F=null==l?void 0:l.placeholders)||void 0===F?void 0:F.expiryYearPlaceholder:s.placeholders.expiryYearPlaceholder}});const nn=Object.assign({},Q.inputStyles.base);nn.textIndent="44px";const tn={type:t.ValidationRuleType.LENGTH_MATCH_RULE,params:{max:70,error:"El campo nombre del titular debe tener menos de 70 caracteres"}},en=Z.create(Object.assign(Object.assign({table:"cards",column:"cardholder_name"},Q),{label:null===(z=null==Q?void 0:Q.labels)||void 0===z?void 0:z.nameLabel,placeholder:null===(Y=null==Q?void 0:Q.placeholders)||void 0===Y?void 0:Y.namePlaceholder,type:t.ElementType.CARDHOLDER_NAME,validations:[tn,C]}));A({element:en,errorStyles:null==Q?void 0:Q.errorTextStyles,fieldMessage:null===(U=null==Q?void 0:Q.labels)||void 0===U?void 0:U.nameLabel,events:null==d?void 0:d.cardHolderEvents});const on=Z.create(Object.assign(Object.assign({table:"cards",column:"card_number"},Q),{inputStyles:Object.assign(Object.assign({},Q.inputStyles),{base:nn}),label:null===(H=Q.labels)||void 0===H?void 0:H.cardLabel,placeholder:null===(G=Q.placeholders)||void 0===G?void 0:G.cardPlaceholder,type:t.ElementType.CARD_NUMBER,validations:[C]}));A({element:on,errorStyles:null==Q?void 0:Q.errorTextStyles,fieldMessage:null===(X=null==Q?void 0:Q.labels)||void 0===X?void 0:X.cardLabel,events:null==d?void 0:d.cardNumberEvents});const ln=Z.create(Object.assign(Object.assign({table:"cards",column:"cvv"},Q),{label:null===(W=Q.labels)||void 0===W?void 0:W.cvvLabel,placeholder:null===(K=Q.placeholders)||void 0===K?void 0:K.cvvPlaceholder,type:t.ElementType.CVV,validations:[C]}));A({element:ln,errorStyles:null==Q?void 0:Q.errorTextStyles,fieldMessage:"",events:null==d?void 0:d.cvvEvents});const an=Z.create(Object.assign(Object.assign({table:"cards",column:"expiration_month"},Q),{label:null===(V=Q.labels)||void 0===V?void 0:V.expiryDateLabel,placeholder:null===(q=Q.placeholders)||void 0===q?void 0:q.expiryMonthPlaceholder,type:t.ElementType.EXPIRATION_MONTH,validations:[C]}));A({element:an,errorStyles:null==Q?void 0:Q.errorTextStyles,fieldMessage:"",events:null==d?void 0:d.monthEvents});const rn=Z.create(Object.assign(Object.assign({table:"cards",column:"expiration_year"},Q),{label:"",placeholder:null===(J=Q.placeholders)||void 0===J?void 0:J.expiryYearPlaceholder,type:t.ElementType.EXPIRATION_YEAR,validations:[C]}));A({element:rn,errorStyles:null==Q?void 0:Q.errorTextStyles,fieldMessage:"",events:null==d?void 0:d.yearEvents});const sn={cardNumber:{element:on,container:`#${a.cardNumber}`},cvv:{element:ln,container:`#${a.cvv}`},expiryMonth:{element:an,container:`#${a.expirationMonth}`},expiryYear:{element:rn,container:`#${a.expirationYear}`},cardHolderName:{element:en,container:`#${a.holderName}`}};return yield g(sn),{container:Z,elements:{cardHolderNameElement:en,cardNumberElement:on,cvvElement:ln,expiryMonthElement:an,expiryYearElement:rn}}}))}function f(n,e,o,l,a){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 ${l}`},signal:a});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 g(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:"Campo requerido"}};function A(n){const{element:e,fieldMessage:o="",errorStyles:i={},requiredMessage:l="Campo requerido",invalidMessage:a="Campo no válido",events:r}=n;"on"in e&&(e.on(t.EventName.CHANGE,(n=>{I({eventName:"onChange",data:n,events:r}),E({element:e,errorStyles:i,color:"transparent"})})),e.on(t.EventName.BLUR,(n=>{if(I({eventName:"onBlur",data:n,events:r}),!n.isValid){const t=n.isEmpty?l:""!=o?`El campo ${o} no es válido`:a;e.setError(t)}E({element:e,errorStyles:i})})),e.on(t.EventName.FOCUS,(n=>{I({eventName:"onFocus",data:n,events:r}),E({element:e,errorStyles:i,color:"transparent"}),e.resetError()})))}function E(n){const{element:t,errorStyles:e={},color:o=""}=n;Object.keys(e).length>0&&t.update({errorTextStyles:Object.assign(Object.assign({},e),{base:Object.assign(Object.assign({},e.base&&Object.assign({},e.base)),""!=o&&{color:o})})})}const I=t=>{const{eventName:e,data:o,events:i}=t;if(i&&e in i){const t=i[e];"function"==typeof t&&t({elementType:n(o,"elementType",""),isEmpty:n(o,"isEmpty",!1),isFocused:n(o,"isFocused",!1),isValid:n(o,"isValid",!1)})}};var S,w,_,O,P,k,N,L,M,j,T,B,R,$,D,F,z,Y,U,H,G,X,W,K,V,q,J,Z;class Q extends e{constructor({apiKey:n,returnUrl:t,renderPaymentButton:e=!1,callBack:o=()=>{},styles:i,containerId:r,collectorIds:s,isOpenPaySandbox:d,isEnrollmentCard:c,renderSaveCardButton:p,mode:u="stage",customization:h,events:m}){var v,y;super({apiKey:n,returnUrl:t,mode:u,callBack:o,customization:h,tdsIframeId:s&&"tdsIframe"in s?null==s?void 0:s.tdsIframe:"tdsIframe",tonderPayButtonId:s?null==s?void 0:s.tonderPayButton:"tonderPayButton"}),S.add(this),this.paymentData={},this.deletingCards=[],w.set(this,[]),this.accordionCards=null,this.accordionPaymentMethods=null,this.apmsInjected=!1,this.apmsData=[],this.isOpenPaySandbox=!0,this.isEnrollmentCard=!1,_.set(this,{paymentButton:{show:!1,text:"Pagar",showAmount:!0}}),O.set(this,void 0),this.renderPaymentButton=e||!1,this.renderSaveCardButton=p,this.customStyles=i,a(this,O,m,"f"),this.abortRefreshCardsController=new AbortController,this.containerId=r||"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=s?Object.assign(Object.assign({},this.collectorIds),s):this.collectorIds,this.radioChecked="new",this.collectContainer=null,this.updateCollectContainer=null,this.isOpenPaySandbox=void 0===d||d,this.isEnrollmentCard=void 0!==c&&c,this.customization=Object.assign(Object.assign(Object.assign({},this.customization),h||{}),{paymentButton:Object.assign(Object.assign(Object.assign({},l(this,_,"f").paymentButton),(null==h?void 0:h.paymentButton)||{}),{show:(null===(v=null==h?void 0:h.paymentButton)||void 0===v?void 0:v.show)||this.renderPaymentButton||(null===(y=l(this,_,"f").paymentButton)||void 0===y?void 0:y.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=h({collectorIds:this.collectorIds,customStyles:this.customStyles,isEnrollmentCard:this.isEnrollmentCard,renderPaymentButton:this.renderPaymentButton,customization:this.customization,renderSaveCardButton:this.renderSaveCardButton}),yield l(this,S,"m",G).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=h({collectorIds:this.collectorIds,customStyles:this.customStyles,isEnrollmentCard:this.isEnrollmentCard,renderSaveCardButton:this.renderSaveCardButton,renderPaymentButton:this.renderPaymentButton,customization:this.customization}),yield l(this,S,"m",G).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 l(this,S,"m",V).call(this,!0,"Guardando..."),yield l(this,S,"m",q).call(this),n("Tarjeta registrada con éxito")}catch(n){t(n)}finally{yield l(this,S,"m",V).call(this)}}))))}))}_setCartTotal(n){this.cartTotal=n,l(this,S,"m",$).call(this)}setCartTotal(n){this.cartTotal=n,l(this,S,"m",$).call(this)}_checkout(){return i(this,void 0,void 0,(function*(){var n;let t,e=null;try{if(l(this,S,"m",$).call(this,{cardId:this.radioChecked,textContent:"Cargando...",disabled:!0}),this.merchantData){const{business:o}=this.merchantData;let i,a=!1;const r="new"===this.radioChecked||void 0===this.radioChecked;let s=null;const c=this.apmsData?this.apmsData.find((n=>n.pk===this.radioChecked)):null,p=yield this._getCustomer(),{auth_token:u}=p;if(t=u,r){if(i=yield l(this,S,"m",K).call(this,this.collectorIds.tonderPayButton,this.radioChecked),this._hasCardOnFileKeys()&&i){const n={records:[{fields:i}]},t=yield l(this,S,"m",J).call(this,n);if(s={subscriptionId:t.subscriptionId},e=t.cardId,!e||!s.subscriptionId)throw new Error("Error processing card-on-file subscription");a=!0}}else if(!c){const t=l(this,w,"f").find((n=>{var t;return(null===(t=n.fields)||void 0===t?void 0:t.skyflow_id)===this.radioChecked}));(null===(n=null==t?void 0:t.fields)||void 0===n?void 0:n.subscription_id)&&this._hasCardOnFileKeys()?s={subscriptionId:t.fields.subscription_id}:yield l(this,S,"m",K).call(this,this.collectorIds.tonderPayButton,this.radioChecked),i={skyflow_id:this.radioChecked}}if(!a&&i){const n="skyflow_id"in i?i.skyflow_id:"",t=yield l(this,S,"m",Z).call(this,u,o.pk,{skyflow_id:n});e=(null==t?void 0:t.skyflow_id)||null}const h=Object.assign(Object.assign({},c&&Object.keys(c).length>0?{payment_method:c.payment_method}:{card:i}),{enable_card_on_file:!!(null==s?void 0:s.subscriptionId)&&this._hasCardOnFileKeys(),customer:p}),m=yield this._handleCheckout(h);return l(this,S,"m",$).call(this,{cardId:this.radioChecked,disabled:!1}),m||(d("No se ha podido procesar el pago",this.radioChecked,this.collectorIds.msgError),!1)}d("No se han configurado los datos del proveedor de servicio",this.radioChecked,this.collectorIds.msgError)}catch(n){throw e&&t&&(this.cardsInjected=!1,yield this._removeCustomerCard(t,this.merchantData.business.pk,e),yield l(this,S,"m",P).call(this,t)),d("Ha ocurrido un error",this.radioChecked,this.collectorIds.msgError),n}finally{l(this,S,"m",$).call(this,{cardId:this.radioChecked,disabled:!1})}}))}}w=new WeakMap,_=new WeakMap,O=new WeakMap,S=new WeakSet,P=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);a(this,w,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=m({cards:i,collectorIds:this.collectorIds,renderPaymentButton:this.renderPaymentButton,customStyles:this.customStyles,customization:this.customization,hasCOF:this._hasCardOnFileKeys()}),clearInterval(n),l(this,S,"m",k).call(this),l(this,S,"m",D).call(this,t),this.cardsInjected=!0)}),500)}}))},k=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 l(this,S,"m",M).call(this,t,n)}))});"cards"===n?this.accordionCards=e:"paymentMethods"===n&&(this.accordionPaymentMethods=e)},N=function(n="",t=null,e=!1,o=!1){[{type:"cards",accordion:this.accordionCards},{type:"paymentMethods",accordion:this.accordionPaymentMethods}].forEach((({accordion:i,type:a})=>{i&&(e&&"closeAll"in i&&i.closeAll(),o&&a!==n&&i.closeAll&&i.closeAll(),null!==t&&a===n&&i.open&&i.open("paymentMethods"!==a?t:t-(l(this,w,"f").length+1)))}))},L=function(n=[],t="show"){n.forEach((n=>{document.querySelectorAll("."+n).forEach((n=>{n.classList.remove(t)}))}))},M=function(n){return i(this,arguments,void 0,(function*(n,e="cards"){var o,a,r;const{vault_id:d,vault_url:c}=this.merchantData,p=n.id.replace("option_container-","");this.updateCollectContainer&&"unmount"in(null===(a=null===(o=this.updateCollectContainer)||void 0===o?void 0:o.elements)||void 0===a?void 0:a.cvvElement)&&this.updateCollectContainer.elements.cvvElement.unmount(),l(this,S,"m",L).call(this,["cvvContainer"]);const u=document.getElementById(p);u&&(u.checked=!0);const h=l(this,w,"f").find((n=>{var t;return(null===(t=n.fields)||void 0===t?void 0:t.skyflow_id)===p})),m=!!(null===(r=null==h?void 0:h.fields)||void 0===r?void 0:r.subscription_id);try{"cards"!==e||m&&this._hasCardOnFileKeys()||(this.updateCollectContainer=yield function(n,e,o,l,a){return i(this,arguments,void 0,(function*(n,e,o,i,l,a={},r,d,c){var p,u,h,m,v,y,b,x,E,I,S,w,_,O,P,k,N,L,M,j,T,B,R,$,D,F,z,Y;const U=yield f(e,o,i,d,l);var H=0===Object.keys(a).length?s:Object.assign(Object.assign({},a),{labels:{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)?null===(h=null==a?void 0:a.labels)||void 0===h?void 0:h.nameLabel:s.labels.nameLabel,cardLabel:(null===(m=null==a?void 0:a.labels)||void 0===m?void 0:m.cardLabel)&&""!==(null===(v=null==a?void 0:a.labels)||void 0===v?void 0:v.cardLabel)?null===(y=null==a?void 0:a.labels)||void 0===y?void 0:y.cardLabel:s.labels.cardLabel,cvvLabel:(null===(b=null==a?void 0:a.labels)||void 0===b?void 0:b.cvvLabel)&&""!==(null===(x=null==a?void 0:a.labels)||void 0===x?void 0:x.cvvLabel)?null===(E=null==a?void 0:a.labels)||void 0===E?void 0:E.cvvLabel:s.labels.cvvLabel,expiryDateLabel:(null===(I=null==a?void 0:a.labels)||void 0===I?void 0:I.expiryDateLabel)&&""!==(null===(S=null==a?void 0:a.labels)||void 0===S?void 0:S.expiryDateLabel)?null===(w=null==a?void 0:a.labels)||void 0===w?void 0:w.expiryDateLabel:s.labels.expiryDateLabel},placeholders:{namePlaceholder:(null===(_=null==a?void 0:a.placeholders)||void 0===_?void 0:_.namePlaceholder)&&""!==(null===(O=null==a?void 0:a.placeholders)||void 0===O?void 0:O.namePlaceholder)?null===(P=null==a?void 0:a.placeholders)||void 0===P?void 0:P.namePlaceholder:s.placeholders.namePlaceholder,cardPlaceholder:(null===(k=null==a?void 0:a.placeholders)||void 0===k?void 0:k.cardPlaceholder)&&""!==(null===(N=null==a?void 0:a.placeholders)||void 0===N?void 0:N.cardPlaceholder)?null===(L=null==a?void 0:a.placeholders)||void 0===L?void 0:L.cardPlaceholder:s.placeholders.cardPlaceholder,cvvPlaceholder:(null===(M=null==a?void 0:a.placeholders)||void 0===M?void 0:M.cvvPlaceholder)&&""!==(null===(j=null==a?void 0:a.placeholders)||void 0===j?void 0:j.cvvPlaceholder)?null===(T=null==a?void 0:a.placeholders)||void 0===T?void 0:T.cvvPlaceholder:s.placeholders.cvvPlaceholder,expiryMonthPlaceholder:(null===(B=null==a?void 0:a.placeholders)||void 0===B?void 0:B.expiryMonthPlaceholder)&&""!==(null===(R=null==a?void 0:a.placeholders)||void 0===R?void 0:R.expiryMonthPlaceholder)?null===($=null==a?void 0:a.placeholders)||void 0===$?void 0:$.expiryMonthPlaceholder:s.placeholders.expiryMonthPlaceholder,expiryYearPlaceholder:(null===(D=null==a?void 0:a.placeholders)||void 0===D?void 0:D.expiryYearPlaceholder)&&""!==(null===(F=null==a?void 0:a.placeholders)||void 0===F?void 0:F.expiryYearPlaceholder)?null===(z=null==a?void 0:a.placeholders)||void 0===z?void 0:z.expiryYearPlaceholder:s.placeholders.expiryYearPlaceholder}});const G=U.container(t.ContainerType.COLLECT),X=G.create(Object.assign(Object.assign({table:"cards",column:"cvv"},H),{label:"",placeholder:null===(Y=H.placeholders)||void 0===Y?void 0:Y.cvvPlaceholder,type:t.ElementType.CVV,validations:[C],skyflowID:n}));A({element:X,errorStyles:null==H?void 0:H.errorTextStyles,fieldMessage:"",events:null==c?void 0:c.cvvEvents});const W={cvv:{element:X,container:`#${r.cvv}${n}`}};return yield g(W),{container:G,elements:{cvvElement:X}}}))}(p,d,c,this.baseUrl,this.abortController.signal,this.customStyles,this.collectorIds,this.apiKeyTonder,l(this,O,"f")),setTimeout((()=>{const n=document.querySelector(`#cvvContainer${p}`);n&&n.classList.add("show")}),5)),l(this,S,"m",j).call(this,p)}catch(n){console.error("Ha ocurrido un error",n)}yield l(this,S,"m",Y).call(this,u,null,e)}))},j=function(n=""){var t,e,o;if(!this.renderPaymentButton)return;const a=`#${this.collectorIds.tonderPayButton}${n}`;let r=document.querySelector(a);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 l(this,S,"m",T).call(this)}))},T=function(){return i(this,void 0,void 0,(function*(){try{yield this.payment({})}catch(n){console.error("Payment error:",n)}}))},B=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 l(this,S,"m",R).call(this,n)}))):console.error("Save button not found")},R=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}}))},$=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}`,l=(null==n?void 0:n.updatedTextContent)||!0,a=(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;l&&(s.textContent=a),void 0!==r&&"disabled"in s&&(s.disabled=r)}catch(n){console.error("Pay button not found due to update",n)}},D=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 l(this,S,"m",Y).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 l(this,S,"m",F).call(this,n,t)}))),!1)},F=function(n,t){return i(this,void 0,void 0,(function*(){var e,o;const i=t.attributes.getNamedItem("id"),a=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(a){const t=document.querySelector(`#card_container-${a}`);t&&(t.style.display="none");try{this.deletingCards.push(a),this.abortRefreshCardsController&&(this.abortRefreshCardsController.abort(),this.abortRefreshCardsController=new AbortController),yield this._removeCustomerCard(n,this.merchantData.business.pk,a)}catch(n){}finally{this.deletingCards=this.deletingCards.filter((n=>n!==a)),yield l(this,S,"m",z).call(this,n)}}}))},z=function(n){return i(this,void 0,void 0,(function*(){this.deletingCards.length>0||(this.cardsInjected=!1,yield l(this,S,"m",P).call(this,n))}))},Y=function(n){return i(this,arguments,void 0,(function*(n,t=null,e=""){var o,i;if(n.id===this.radioChecked||"new"===n.id&&void 0===this.radioChecked)return;const a=document.querySelector(".container-form");a&&(a.style.display="new"===n.id?"block":"none"),"new"===n.id?(l(this,S,"m",L).call(this,["cvvContainer"]),this.updateCollectContainer&&"unmount"in(null===(i=null===(o=this.updateCollectContainer)||void 0===o?void 0:o.elements)||void 0===i?void 0:i.cvvElement)&&this.updateCollectContainer.elements.cvvElement.unmount(),l(this,S,"m",N).call(this,"",null,!0),this.radioChecked!==n.id&&(yield l(this,S,"m",W).call(this),l(this,S,"m",j).call(this))):(l(this,S,"m",N).call(this,e,null,!1,!0),null!==t&&l(this,S,"m",N).call(this,e,t,!0),l(this,S,"m",X).call(this)),this.radioChecked=n.id}))},U=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,l(this,S,"m",H).call(this,n.results))}catch(n){console.warn("Error getting APMS")}}))},H=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),l(this,S,"m",k).call(this,"paymentMethods"),l(this,S,"m",D).call(this),this.apmsInjected=!0)}),500)},G=function(){return i(this,void 0,void 0,(function*(){if(this.isEnrollmentCard?l(this,S,"m",B).call(this):l(this,S,"m",j).call(this),yield this._initializeCheckout(),this._hasCardOnFileKeys()){const n=document.getElementById("save-checkout-card");(null==n?void 0:n.parentElement)&&(n.parentElement.style.display="none")}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 l(this,S,"m",P).call(this,t)}}this.isEnrollmentCard||(yield l(this,S,"m",U).call(this)),this.collectContainer=yield b(n,t,this.baseUrl,this.abortController.signal,this.customStyles,this.collectorIds,this.apiKeyTonder,l(this,O,"f"))}}))},X=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())},W=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,l(this,O,"f")))}))},K=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}d("Por favor, verifica todos los campos de tu tarjeta",this.radioChecked,this.collectorIds.msgError)}catch(n){throw d("Por favor, verifica todos los campos de tu tarjeta",this.radioChecked,this.collectorIds.msgError),n}}))},V=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){}}))},q=function(){return i(this,void 0,void 0,(function*(){let n,t=null;if(this.customer.email)try{if(this.merchantData){const e=yield l(this,S,"m",K).call(this,this.collectorIds.tonderSaveCardButton),o=yield this._getCustomer();if("auth_token"in o&&this.secureToken){const{auth_token:i,first_name:a="",last_name:r="",email:s}=o;if(n=i,this._hasCardOnFileKeys()){const n=yield l(this,S,"m",Z).call(this,i,this.merchantData.business.pk,{skyflow_id:e.skyflow_id},{forceSave:!0,showNotification:!1,appOrigin:!0,refreshCards:!1});t=(null==n?void 0:n.skyflow_id)||null;const o=null==n?void 0:n.card_bin;if(!o)throw new Error("Card BIN not returned from save card");const d=yield this._initializeCardOnFile(),c=yield d.process({cardTokens:{name:e.cardholder_name,number:e.card_number,expiryMonth:e.expiration_month,expiryYear:e.expiration_year,cvv:e.cvv},cardBin:o,contactDetails:{firstName:a||"",lastName:r||"",email:s||""},customerId:i,currency:this.currency||"MXN"});yield l(this,S,"m",Z).call(this,i,this.merchantData.business.pk,{skyflow_id:e.skyflow_id,subscription_id:c.subscriptionId},{forceSave:!0,showNotification:!0})}else yield l(this,S,"m",Z).call(this,i,this.merchantData.business.pk,{skyflow_id:e.skyflow_id},{forceSave:!0,showNotification:!0})}else d("No se han configurado los datos de seguridad para guardar tarjeta",this.radioChecked,this.collectorIds.msgError)}else d("No se han configurado los datos del proveedor de servicio",this.radioChecked,this.collectorIds.msgError)}catch(e){t&&n&&(yield this._removeCustomerCard(n,this.merchantData.business.pk,t));throw d("object"==typeof e&&null!==e&&"message"in e?null==e?void 0:e.message:"Ha ocurrido un error",this.radioChecked,this.collectorIds.msgError),e}}))},J=function(n){return i(this,void 0,void 0,(function*(){var t,e;let o=null;try{const i=yield this._initializeCardOnFile(),a=null===(e=null===(t=n.records)||void 0===t?void 0:t[0])||void 0===e?void 0:e.fields;if(!a)throw new Error("No card data returned from collect");const r=yield this._getCustomer(),{auth_token:s,first_name:d="",last_name:c="",email:p}=r,u=yield l(this,S,"m",Z).call(this,s,this.merchantData.business.pk,{skyflow_id:a.skyflow_id},{forceSave:!0,showNotification:!1,appOrigin:!0,refreshCards:!1});o=(null==u?void 0:u.skyflow_id)||null;const h=null==u?void 0:u.card_bin;if(!h)throw new Error("Card BIN not returned from save card");const m=yield i.process({cardTokens:{name:a.cardholder_name,number:a.card_number,expiryMonth:a.expiration_month,expiryYear:a.expiration_year,cvv:a.cvv},cardBin:h,contactDetails:{firstName:d||"",lastName:c||"",email:p||""},customerId:s,currency:this.currency||"MXN"});return yield l(this,S,"m",Z).call(this,s,this.merchantData.business.pk,{skyflow_id:a.skyflow_id,subscription_id:m.subscriptionId},{forceSave:!0,showNotification:!1}),{subscriptionId:m.subscriptionId,cardId:u.skyflow_id}}catch(n){return{subscriptionId:null,cardId:o}}}))},Z=function(n,t,e){return i(this,arguments,void 0,(function*(n,t,e,o={}){var i,a;if(!n||!(null===(i=this.customer)||void 0===i?void 0:i.email))return;const{forceSave:r=!1,showNotification:s=!0,appOrigin:c=!1,refreshCards:p=!0}=o,u=document.getElementById("save-checkout-card");if(r||u&&"checked"in u&&u.checked||!!(null===(a=this.customization.saveCards)||void 0===a?void 0:a.autoSave))try{if(this.secureToken){const o=yield this._saveCustomerCard(n,t,e,c);return p&&(this.cardsInjected=!1,yield l(this,S,"m",P).call(this,n)),s&&function(n,t=null,e="msgNotification",o="msgNotificationText"){try{const i=t&&"new"!==t,l=document.getElementById(`${e}${i?t:""}`);if(l){let e=document.getElementById(`${o}${i?t:""}`);l.style.display="flex",e.innerHTML="",e.innerHTML=n,setTimeout((function(){l.style.display="none",e.innerHTML=""}),3e4)}}catch(n){console.error("Error showing message",n)}}("Tarjeta registrada con éxito",this.radioChecked,this.collectorIds.msgNotification),o}d("No se han configurado los datos de seguridad para guardar tarjeta",this.radioChecked,this.collectorIds.msgError)}catch(n){throw"object"==typeof n&&null!==n&&"message"in n&&"Error"!==(null==n?void 0:n.message)&&d(null==n?void 0:n.message,this.radioChecked,this.collectorIds.msgError),n}}))};export{Q as InlineCheckout};
+import n from"lodash.get";import e from"skyflow-js";import{BaseInlineCheckout as t}from"@tonder.io/ionic-lite-sdk";import o from"accordion-js";function i(n,e,t,o){return new(t||(t=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 e;n.done?i(n.value):(e=n.value,e instanceof t?e:new t((function(n){n(e)}))).then(l,r)}s((o=o.apply(n,e||[])).next())}))}function a(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)}function l(n,e,t,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 e?n!==e||!i:!e.has(n))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===o?i.call(n,t):i?i.value=t:e.set(n,t),t}var r;"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",n.SAFETYPAYCASH="SAFETYPAYCASH",n.SAFETYPAYTRANSFER="SAFETYPAYTRANSFER",n.NEOSURF="NEOSURF"}(r||(r={}));const s={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 d(n,e=null,t="msgError",o="msgErrorText"){try{const i=e&&"new"!==e;let a=document.getElementById(`${t}${i?e:""}`),l=document.getElementById(`${o}${i?e:""}`);l.innerHTML="",l.innerHTML=n,a.style.display="flex",setTimeout((function(){a.style.display="none",l.innerHTML=""}),3e4)}catch(n){console.warn("Error showing message error",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",u=n=>{const e=Object.assign({},n.fields),t=e.card_number.split("-"),o=t[t.length-1];return e.card_number=`••••${o}`,e},p=n=>n.trim().replace(/\s+/g,"");const h=(n={isEnrollmentCard:!1,collectorIds:{}})=>{var e,t,o,i,a,l,r,d,u,p,h,m,v,b,f,g,x,C,E,A,_,I,S,w,O,N,P,L,k,j,M,R,T,D,B,$,F,z,Y,U,H,G,X,W,K,V,q,J,Z,Q,nn,en,tn,on,an,ln,rn,sn,dn,cn,un,pn,hn,mn,vn,yn,bn,fn,gn,xn,Cn,En;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="${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  position: relative;\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  max-height: 85px;\n  overflow: hidden;\n}\n\n.empty-div {\n  position: relative !important;\n  margin-top: 2px;\n  margin-bottom: 4px;\n  max-height: 85px;\n  overflow: hidden;\n}\n.empty-div-card {\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===(u=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===u?void 0:u.lineHeight)?null===(m=null===(h=null===(p=null==n?void 0:n.customStyles)||void 0===p?void 0:p.labelStyles)||void 0===h?void 0:h.base)||void 0===m?void 0:m.lineHeight:""};\n    color: transparent;\n    font-size: ${(null===(f=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===f?void 0:f.fontSize)?null===(C=null===(x=null===(g=null==n?void 0:n.customStyles)||void 0===g?void 0:g.labelStyles)||void 0===x?void 0:x.base)||void 0===C?void 0:C.fontSize:s.labelStyles.base.fontSize};\n    font-family: ${(null===(_=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===_?void 0:_.fontFamily)?null===(w=null===(S=null===(I=null==n?void 0:n.customStyles)||void 0===I?void 0:I.labelStyles)||void 0===S?void 0:S.base)||void 0===w?void 0:w.fontFamily:s.labelStyles.base.fontFamily};\n    font-weight: ${(null===(P=null===(N=null===(O=null==n?void 0:n.customStyles)||void 0===O?void 0:O.labelStyles)||void 0===N?void 0:N.base)||void 0===P?void 0:P.fontWeight)?null===(j=null===(k=null===(L=null==n?void 0:n.customStyles)||void 0===L?void 0:L.labelStyles)||void 0===k?void 0:k.base)||void 0===j?void 0:j.fontWeight:s.labelStyles.base.fontWeight};\n    text-align: ${(null===(T=null===(R=null===(M=null==n?void 0:n.customStyles)||void 0===M?void 0:M.labelStyles)||void 0===R?void 0:R.base)||void 0===T?void 0:T.textAlign)?null===($=null===(B=null===(D=null==n?void 0:n.customStyles)||void 0===D?void 0:D.labelStyles)||void 0===B?void 0:B.base)||void 0===$?void 0:$.textAlign:s.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===(z=null===(F=null==n?void 0:n.customStyles)||void 0===F?void 0:F.labelStyles)||void 0===z?void 0:z.base)||void 0===Y?void 0:Y.lineHeight)?null===(G=null===(H=null===(U=null==n?void 0:n.customStyles)||void 0===U?void 0:U.labelStyles)||void 0===H?void 0:H.base)||void 0===G?void 0:G.lineHeight:"22px"};\n    color: ${(null===(K=null===(W=null===(X=null==n?void 0:n.customStyles)||void 0===X?void 0:X.labelStyles)||void 0===W?void 0:W.base)||void 0===K?void 0:K.color)?null===(J=null===(q=null===(V=null==n?void 0:n.customStyles)||void 0===V?void 0:V.labelStyles)||void 0===q?void 0:q.base)||void 0===J?void 0:J.color:s.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===(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.fontSize:s.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:s.labelStyles.base.fontFamily};\n    font-weight: ${(null===(hn=null===(pn=null===(un=null==n?void 0:n.customStyles)||void 0===un?void 0:un.labelStyles)||void 0===pn?void 0:pn.base)||void 0===hn?void 0:hn.fontWeight)?null===(yn=null===(vn=null===(mn=null==n?void 0:n.customStyles)||void 0===mn?void 0:mn.labelStyles)||void 0===vn?void 0:vn.base)||void 0===yn?void 0:yn.fontWeight:s.labelStyles.base.fontWeight};\n    text-align: ${(null===(gn=null===(fn=null===(bn=null==n?void 0:n.customStyles)||void 0===bn?void 0:bn.labelStyles)||void 0===fn?void 0:fn.base)||void 0===gn?void 0:gn.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:s.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: 0px !important;\n  margin-right: 10px !important;\n  width: 100%;\n  text-align: left;\n  display: flex;\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`},m=e=>`\n  <div class="accordion-container">\n    ${e.cards.reduce(((t,o)=>{var i,a;const{cvvLabel:l}=(r=e.customStyles,{labels:{nameLabel:n(r,"labels.nameLabel",s.labels.nameLabel),cardLabel:n(r,"labels.cardLabel",s.labels.cardLabel),cvvLabel:n(r,"labels.cvvLabel",s.labels.cvvLabel),expiryDateLabel:n(r,"labels.expiryDateLabel",s.labels.expiryDateLabel)},placeholders:{namePlaceholder:n(r,"placeholders.namePlaceholder",s.placeholders.namePlaceholder),cardPlaceholder:n(r,"placeholders.cardPlaceholder",s.placeholders.cardPlaceholder),cvvPlaceholder:n(r,"placeholders.cvvPlaceholder",s.placeholders.cvvPlaceholder),expiryMonthPlaceholder:n(r,"placeholders.expiryMonthPlaceholder",s.placeholders.expiryMonthPlaceholder),expiryYearPlaceholder:n(r,"placeholders.expiryYearPlaceholder",s.placeholders.expiryYearPlaceholder)}}).labels;var r;return`${t}\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           ${o.subscription_id&&e.hasCOF?"":`\n           <div class="cvvContainer" id="cvvContainer${o.skyflow_id}">\n             <label class="tndr-form-label label-cvv-cards">${l}</label>\n              <div id="${e.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           `}\n           ${y({showButton:e.renderPaymentButton||!1,classContainerButton:"container-pay-button",tonderButtonId:`${e.collectorIds.tonderPayButton}${o.skyflow_id}`,classButton:"tndr-button card-pay-button pay-button",msgErrorId:`${e.collectorIds.msgError}${o.skyflow_id}`,msgErrorTextId:`${e.collectorIds.msgErrorText}${o.skyflow_id}`,msgNotificationId:`${e.collectorIds.msgNotification}${o.skyflow_id}`,msgNotificationTextId:`${e.collectorIds.msgNotificationText}${o.skyflow_id}`,buttonText:null===(a=null===(i=e.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==e?void 0:e.renderPaymentButton)?"20px 32px 0px 32px":"20px 32px 20px 32px"};\n      }\n      .cvvContainer{\n       max-width: 60%; \n       overflow: hidden;\n       max-height: 90px;\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(((e,t)=>{var o,i;const a=(n=>{const e=p(n.toUpperCase());return{[r.SORIANA]:{label:"Soriana",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/soriana.png"},[r.OXXO]:{label:"Oxxo",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/oxxo.png"},[r.CODI]:{label:"CoDi",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/codi.png"},[r.SPEI]:{label:"SPEI",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/spei.png"},[r.PAYPAL]:{label:"Paypal",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/paypal.png"},[r.COMERCIALMEXICANA]:{label:"Comercial Mexicana",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/comercial_exicana.png"},[r.BANCOMER]:{label:"Bancomer",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/bancomer.png"},[r.WALMART]:{label:"Walmart",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/walmart.png"},[r.BODEGA]:{label:"Bodega Aurrera",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/bodega_aurrera.png"},[r.SAMSCLUB]:{label:"Sam´s Club",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/sams_club.png"},[r.SUPERAMA]:{label:"Superama",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/superama.png"},[r.CALIMAX]:{label:"Calimax",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/calimax.png"},[r.EXTRA]:{label:"Tiendas Extra",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/tiendas_extra.png"},[r.CIRCULOK]:{label:"Círculo K",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/circulo_k.png"},[r.MERCADOPAGO]:{label:"Mercado Pago",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/mercadopago.png"},[r.OXXOPAY]:{label:"Oxxo Pay",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/oxxopay.png"},[r.SEVEN11]:{label:"7 Eleven",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/7_eleven.png"},[r.TELECOMM]:{label:"Telecomm",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/telecomm.png"},[r.BANORTE]:{label:"Banorte",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/banorte.png"},[r.BENAVIDES]:{label:"Farmacias Benavides",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_benavides.png"},[r.DELAHORRO]:{label:"Farmacias del Ahorro",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_ahorro.png"},[r.ELASTURIANO]:{label:"El Asturiano",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/asturiano.png"},[r.WALDOS]:{label:"Waldos",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/waldos.png"},[r.ALSUPER]:{label:"Alsuper",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/al_super.png"},[r.KIOSKO]:{label:"Kiosko",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/kiosko.png"},[r.STAMARIA]:{label:"Farmacias Santa María",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_santa_maria.png"},[r.LAMASBARATA]:{label:"Farmacias la más barata",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_barata.png"},[r.FARMROMA]:{label:"Farmacias Roma",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_roma.png"},[r.FARMUNION]:{label:"Pago en Farmacias Unión",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_union.png"},[r.FARMATODO]:{label:"Pago en Farmacias Farmatodo",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_farmatodo.png\t"},[r.SFDEASIS]:{label:"Pago en Farmacias San Francisco de Asís",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/farmacias_san_francisco.png"},[r.FARM911]:{label:"Farmacias 911",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.FARMECONOMICAS]:{label:"Farmacias Economicas",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.FARMMEDICITY]:{label:"Farmacias Medicity",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.RIANXEIRA]:{label:"Rianxeira",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.WESTERNUNION]:{label:"Western Union",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.ZONAPAGO]:{label:"Zona Pago",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.CAJALOSANDES]:{label:"Caja Los Andes",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.CAJAPAITA]:{label:"Caja Paita",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.CAJASANTA]:{label:"Caja Santa",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.CAJASULLANA]:{label:"Caja Sullana",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.CAJATRUJILLO]:{label:"Caja Trujillo",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.EDPYME]:{label:"Edpyme",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.KASNET]:{label:"KasNet",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.NORANDINO]:{label:"Norandino",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.QAPAQ]:{label:"Qapaq",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.RAIZ]:{label:"Raiz",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.PAYSER]:{label:"Paysera",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.WUNION]:{label:"Western Union",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.BANCOCONTINENTAL]:{label:"Banco Continental",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.GMONEY]:{label:"Go money",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.GOPAY]:{label:"Go pay",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.WU]:{label:"Western Union",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.PUNTOSHEY]:{label:"Puntoshey",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.AMPM]:{label:"Ampm",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.JUMBOMARKET]:{label:"Jumbomarket",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.SMELPUEBLO]:{label:"Smelpueblo",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.BAM]:{label:"Bam",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.REFACIL]:{label:"Refacil",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.ACYVALORES]:{label:"Acyvalores",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png"},[r.SAFETYPAYCASH]:{label:"Paga en Efectivo",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/cash_apm_sp.png"},[r.SAFETYPAYTRANSFER]:{label:"Paga por Transferencia",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/transfer_apm_sp.png"},[r.NEOSURF]:{label:"Neosurf",icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/neosurf.png"}}[e]||{icon:"https://d35a75syrgujp0.cloudfront.net/payment_methods/store.png",label:""}})(t.payment_method);return`\n    ${e}\n    <div class="ac ac-paymentMethods" id="option_container-${t.pk}">\n      <div class="apm-item">\n          <input id="${t.pk}" class="paymentMethods card_selected" name="card_selected" type="radio"/>\n          <label class="apm-item-label" for="${t.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${t.pk}">\n         ${y({showButton:n.renderPaymentButton||!1,classContainerButton:"container-pay-button",tonderButtonId:`${n.collectorIds.tonderPayButton}${t.pk}`,classButton:"tndr-button card-pay-button pay-button",msgErrorId:`${n.collectorIds.msgError}${t.pk}`,msgErrorTextId:`${n.collectorIds.msgErrorText}${t.pk}`,msgNotificationId:`${n.collectorIds.msgNotification}${t.pk}`,msgNotificationTextId:`${n.collectorIds.msgNotificationText}${t.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,t,o,a){return i(this,arguments,void 0,(function*(n,t,o,i,a={},l,r,d){var c,u,p,h,m,v,y,b,x,A,_,I,S,w,O,N,P,L,k,j,M,R,T,D,B,$,F,z,Y,U,H,G,X,W,K,V,q,J;const Z=(yield f(n,t,o,r,i)).container(e.ContainerType.COLLECT);var Q=0===Object.keys(a).length?s:Object.assign(Object.assign({},a),{labels:{nameLabel:(null===(c=null==a?void 0:a.labels)||void 0===c?void 0:c.nameLabel)&&""!==(null===(u=null==a?void 0:a.labels)||void 0===u?void 0:u.nameLabel)?null===(p=null==a?void 0:a.labels)||void 0===p?void 0:p.nameLabel:s.labels.nameLabel,cardLabel:(null===(h=null==a?void 0:a.labels)||void 0===h?void 0:h.cardLabel)&&""!==(null===(m=null==a?void 0:a.labels)||void 0===m?void 0:m.cardLabel)?null===(v=null==a?void 0:a.labels)||void 0===v?void 0:v.cardLabel:s.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===(x=null==a?void 0:a.labels)||void 0===x?void 0:x.cvvLabel:s.labels.cvvLabel,expiryDateLabel:(null===(A=null==a?void 0:a.labels)||void 0===A?void 0:A.expiryDateLabel)&&""!==(null===(_=null==a?void 0:a.labels)||void 0===_?void 0:_.expiryDateLabel)?null===(I=null==a?void 0:a.labels)||void 0===I?void 0:I.expiryDateLabel:s.labels.expiryDateLabel},placeholders:{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)?null===(O=null==a?void 0:a.placeholders)||void 0===O?void 0:O.namePlaceholder:s.placeholders.namePlaceholder,cardPlaceholder:(null===(N=null==a?void 0:a.placeholders)||void 0===N?void 0:N.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:s.placeholders.cardPlaceholder,cvvPlaceholder:(null===(k=null==a?void 0:a.placeholders)||void 0===k?void 0:k.cvvPlaceholder)&&""!==(null===(j=null==a?void 0:a.placeholders)||void 0===j?void 0:j.cvvPlaceholder)?null===(M=null==a?void 0:a.placeholders)||void 0===M?void 0:M.cvvPlaceholder:s.placeholders.cvvPlaceholder,expiryMonthPlaceholder:(null===(R=null==a?void 0:a.placeholders)||void 0===R?void 0:R.expiryMonthPlaceholder)&&""!==(null===(T=null==a?void 0:a.placeholders)||void 0===T?void 0:T.expiryMonthPlaceholder)?null===(D=null==a?void 0:a.placeholders)||void 0===D?void 0:D.expiryMonthPlaceholder:s.placeholders.expiryMonthPlaceholder,expiryYearPlaceholder:(null===(B=null==a?void 0:a.placeholders)||void 0===B?void 0:B.expiryYearPlaceholder)&&""!==(null===($=null==a?void 0:a.placeholders)||void 0===$?void 0:$.expiryYearPlaceholder)?null===(F=null==a?void 0:a.placeholders)||void 0===F?void 0:F.expiryYearPlaceholder:s.placeholders.expiryYearPlaceholder}});const nn=Object.assign({},Q.inputStyles.base);nn.textIndent="44px";const en={type:e.ValidationRuleType.LENGTH_MATCH_RULE,params:{max:70,error:"El campo nombre del titular debe tener menos de 70 caracteres"}},tn=Z.create(Object.assign(Object.assign({table:"cards",column:"cardholder_name"},Q),{label:null===(z=null==Q?void 0:Q.labels)||void 0===z?void 0:z.nameLabel,placeholder:null===(Y=null==Q?void 0:Q.placeholders)||void 0===Y?void 0:Y.namePlaceholder,type:e.ElementType.CARDHOLDER_NAME,validations:[en,C]}));E({element:tn,errorStyles:null==Q?void 0:Q.errorTextStyles,fieldMessage:null===(U=null==Q?void 0:Q.labels)||void 0===U?void 0:U.nameLabel,events:null==d?void 0:d.cardHolderEvents});const on=Z.create(Object.assign(Object.assign({table:"cards",column:"card_number"},Q),{inputStyles:Object.assign(Object.assign({},Q.inputStyles),{base:nn}),label:null===(H=Q.labels)||void 0===H?void 0:H.cardLabel,placeholder:null===(G=Q.placeholders)||void 0===G?void 0:G.cardPlaceholder,type:e.ElementType.CARD_NUMBER,validations:[C]}));E({element:on,errorStyles:null==Q?void 0:Q.errorTextStyles,fieldMessage:null===(X=null==Q?void 0:Q.labels)||void 0===X?void 0:X.cardLabel,events:null==d?void 0:d.cardNumberEvents});const an=Z.create(Object.assign(Object.assign({table:"cards",column:"cvv"},Q),{label:null===(W=Q.labels)||void 0===W?void 0:W.cvvLabel,placeholder:null===(K=Q.placeholders)||void 0===K?void 0:K.cvvPlaceholder,type:e.ElementType.CVV,validations:[C]}));E({element:an,errorStyles:null==Q?void 0:Q.errorTextStyles,fieldMessage:"",events:null==d?void 0:d.cvvEvents});const ln=Z.create(Object.assign(Object.assign({table:"cards",column:"expiration_month"},Q),{label:null===(V=Q.labels)||void 0===V?void 0:V.expiryDateLabel,placeholder:null===(q=Q.placeholders)||void 0===q?void 0:q.expiryMonthPlaceholder,type:e.ElementType.EXPIRATION_MONTH,validations:[C]}));E({element:ln,errorStyles:null==Q?void 0:Q.errorTextStyles,fieldMessage:"",events:null==d?void 0:d.monthEvents});const rn=Z.create(Object.assign(Object.assign({table:"cards",column:"expiration_year"},Q),{label:"",placeholder:null===(J=Q.placeholders)||void 0===J?void 0:J.expiryYearPlaceholder,type:e.ElementType.EXPIRATION_YEAR,validations:[C]}));E({element:rn,errorStyles:null==Q?void 0:Q.errorTextStyles,fieldMessage:"",events:null==d?void 0:d.yearEvents});const sn={cardNumber:{element:on,container:`#${l.cardNumber}`},cvv:{element:an,container:`#${l.cvv}`},expiryMonth:{element:ln,container:`#${l.expirationMonth}`},expiryYear:{element:rn,container:`#${l.expirationYear}`},cardHolderName:{element:tn,container:`#${l.holderName}`}};return yield g(sn),{container:Z,elements:{cardHolderNameElement:tn,cardNumberElement:on,cvvElement:an,expiryMonthElement:ln,expiryYearElement:rn}}}))}function f(n,t,o,a,l){return i(this,void 0,void 0,(function*(){return e.init({vaultID:n,vaultURL:t,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:e.LogLevel.ERROR,env:e.Env.DEV}})}))}function g(n){return i(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 x=RegExp("^(?!s*$).+"),C={type:e.ValidationRuleType.REGEX_MATCH_RULE,params:{regex:x,error:"Campo requerido"}};function E(n){const{element:t,fieldMessage:o="",errorStyles:i={},requiredMessage:a="Campo requerido",invalidMessage:l="Campo no válido",events:r}=n;"on"in t&&(t.on(e.EventName.CHANGE,(n=>{_({eventName:"onChange",data:n,events:r}),A({element:t,errorStyles:i,color:"transparent"})})),t.on(e.EventName.BLUR,(n=>{if(_({eventName:"onBlur",data:n,events:r}),!n.isValid){const e=n.isEmpty?a:""!=o?`El campo ${o} no es válido`:l;t.setError(e)}A({element:t,errorStyles:i})})),t.on(e.EventName.FOCUS,(n=>{_({eventName:"onFocus",data:n,events:r}),A({element:t,errorStyles:i,color:"transparent"}),t.resetError()})))}function A(n){const{element:e,errorStyles:t={},color:o=""}=n;Object.keys(t).length>0&&e.update({errorTextStyles:Object.assign(Object.assign({},t),{base:Object.assign(Object.assign({},t.base&&Object.assign({},t.base)),""!=o&&{color:o})})})}const _=e=>{const{eventName:t,data:o,events:i}=e;if(i&&t in i){const e=i[t];"function"==typeof e&&e({elementType:n(o,"elementType",""),isEmpty:n(o,"isEmpty",!1),isFocused:n(o,"isFocused",!1),isValid:n(o,"isValid",!1)})}};class I extends Error{constructor(n){var e;const t=I.parseStatusCode(n.statusCode);super(n.message||"An unexpected error occurred."),this.status="error",Object.setPrototypeOf(this,new.target.prototype),this.name="TonderError",this.code=n.errorCode,this.statusCode=t;const o=Object.assign({},n.details||{}),i=I.extractSystemError(o);this.details=Object.assign(Object.assign({},o),{code:n.errorCode,statusCode:t,systemError:i}),null===(e=Error.captureStackTrace)||void 0===e||e.call(Error,this,I)}static parseStatusCode(n){const e=Number(n);return Number.isFinite(e)?e<100||e>599?500:Math.trunc(e):500}static isHttpStatusCode(n){const e=Number(n);return Number.isFinite(e)&&e>=100&&e<=599}static resolveSystemError(n){if("string"!=typeof n)return null;const e=n.trim();return e||null}static extractSystemError(n){var e,t;const o=null==n?void 0:n.cause,i=[null==n?void 0:n.systemError,null===(e=null==o?void 0:o.body)||void 0===e?void 0:e.code,null===(t=null==o?void 0:o.details)||void 0===t?void 0:t.code];for(const n of i){const e=I.resolveSystemError(n);if(e)return e}return"APP_INTERNAL_001"}}function S(n,e){var t;if(!(null==n?void 0:n.errorCode))throw new Error("buildPublicAppError requires errorCode");const o=!!n.details&&Object.keys(n.details).length>0,i=n.errorCode!==(null==e?void 0:e.code)||!!n.message||void 0!==n.statusCode||o;if(e instanceof I&&!i)return e;const a=null!==(t=n.statusCode)&&void 0!==t?t:I.isHttpStatusCode(null==e?void 0:e.statusCode)?Number(e.statusCode):I.isHttpStatusCode(null==e?void 0:e.code)?Number(e.code):I.isHttpStatusCode(null==e?void 0:e.status)?Number(e.status):500,l=Object.assign(Object.assign({},(null==e?void 0:e.details)||{}),n.details||{});return void 0===l.cause&&void 0!==e&&(l.cause=e),new I({errorCode:n.errorCode,message:n.message,details:l,statusCode:a})}var w;!function(n){n.SAVE_CARD_ERROR="SAVE_CARD_ERROR",n.PAYMENT_PROCESS_ERROR="PAYMENT_PROCESS_ERROR",n.CARD_ON_FILE_DECLINED="CARD_ON_FILE_DECLINED"}(w||(w={}));const O={[w.CARD_ON_FILE_DECLINED]:"Transaction declined. Please verify your card details."},N={[w.CARD_ON_FILE_DECLINED]:"Transaccion declinada. Verique los datos de su tarjeta."};var P,L,k,j,M,R,T,D,B,$,F,z,Y,U,H,G,X,W,K,V,q,J,Z,Q,nn,en,tn,on;class an extends t{constructor({apiKey:n,returnUrl:e,renderPaymentButton:t=!1,callBack:o=()=>{},styles:i,containerId:r,collectorIds:s,isOpenPaySandbox:d,isEnrollmentCard:c,renderSaveCardButton:u,mode:p="stage",customization:h,events:m}){var v,y;super({apiKey:n,returnUrl:e,mode:p,callBack:o,customization:h,tdsIframeId:s&&"tdsIframe"in s?null==s?void 0:s.tdsIframe:"tdsIframe",tonderPayButtonId:s?null==s?void 0:s.tonderPayButton:"tonderPayButton"}),P.add(this),this.paymentData={},this.deletingCards=[],L.set(this,[]),this.accordionCards=null,this.accordionPaymentMethods=null,this.apmsInjected=!1,this.apmsData=[],this.isOpenPaySandbox=!0,this.isEnrollmentCard=!1,k.set(this,{paymentButton:{show:!1,text:"Pagar",showAmount:!0}}),j.set(this,void 0),this.renderPaymentButton=t||!1,this.renderSaveCardButton=u,this.customStyles=i,l(this,j,m,"f"),this.abortRefreshCardsController=new AbortController,this.containerId=r||"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=s?Object.assign(Object.assign({},this.collectorIds),s):this.collectorIds,this.radioChecked="new",this.collectContainer=null,this.updateCollectContainer=null,this.isOpenPaySandbox=void 0===d||d,this.isEnrollmentCard=void 0!==c&&c,this.customization=Object.assign(Object.assign(Object.assign({},this.customization),h||{}),{paymentButton:Object.assign(Object.assign(Object.assign({},a(this,k,"f").paymentButton),(null==h?void 0:h.paymentButton)||{}),{show:(null===(v=null==h?void 0:h.paymentButton)||void 0===v?void 0:v.show)||this.renderPaymentButton||(null===(y=a(this,k,"f").paymentButton)||void 0===y?void 0:y.show)})})}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 i(this,void 0,void 0,(function*(){if(this.injected)return;const n=document.querySelector(`#${this.containerId}`);if(n)return n.innerHTML=h({collectorIds:this.collectorIds,customStyles:this.customStyles,isEnrollmentCard:this.isEnrollmentCard,renderPaymentButton:this.renderPaymentButton,customization:this.customization,renderSaveCardButton:this.renderSaveCardButton}),yield a(this,P,"m",q).call(this),void(this.injected=!0);const e=new MutationObserver(((n,e)=>i(this,void 0,void 0,(function*(){const n=document.querySelector(`#${this.containerId}`);n&&(n.innerHTML=h({collectorIds:this.collectorIds,customStyles:this.customStyles,isEnrollmentCard:this.isEnrollmentCard,renderSaveCardButton:this.renderSaveCardButton,renderPaymentButton:this.renderPaymentButton,customization:this.customization}),yield a(this,P,"m",q).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 i(this,void 0,void 0,(function*(){return new Promise(((n,e)=>i(this,void 0,void 0,(function*(){try{yield a(this,P,"m",nn).call(this,!0,"Guardando..."),yield a(this,P,"m",en).call(this),n("Tarjeta registrada con éxito")}catch(n){e(n)}finally{yield a(this,P,"m",nn).call(this)}}))))}))}_setCartTotal(n){this.cartTotal=n,a(this,P,"m",U).call(this)}setCartTotal(n){this.cartTotal=n,a(this,P,"m",U).call(this)}_checkout(){return i(this,void 0,void 0,(function*(){var n,e;let t,o=null;try{if(a(this,P,"m",U).call(this,{cardId:this.radioChecked,textContent:"Cargando...",disabled:!0}),this.merchantData){const{business:e}=this.merchantData;let i,l=!1;const r="new"===this.radioChecked||void 0===this.radioChecked;let s=null;const c=this.apmsData?this.apmsData.find((n=>n.pk===this.radioChecked)):null,u=yield this._getCustomer(),{auth_token:p}=u;if(t=p,r){if(i=yield a(this,P,"m",Q).call(this,this.collectorIds.tonderPayButton,this.radioChecked),this._hasCardOnFileKeys()&&i){const n={records:[{fields:i}]},e=yield a(this,P,"m",tn).call(this,n);if(s={subscriptionId:e.subscriptionId},o=e.cardId,!o||!s.subscriptionId)throw new Error("Error processing card-on-file subscription");l=!0}}else if(!c){const e=a(this,L,"f").find((n=>{var e;return(null===(e=n.fields)||void 0===e?void 0:e.skyflow_id)===this.radioChecked}));(null===(n=null==e?void 0:e.fields)||void 0===n?void 0:n.subscription_id)&&this._hasCardOnFileKeys()?s={subscriptionId:e.fields.subscription_id}:yield a(this,P,"m",Q).call(this,this.collectorIds.tonderPayButton,this.radioChecked),i={skyflow_id:this.radioChecked}}if(!l&&i){const n="skyflow_id"in i?i.skyflow_id:"",t=yield a(this,P,"m",on).call(this,p,e.pk,{skyflow_id:n});o=(null==t?void 0:t.skyflow_id)||null}const h=Object.assign(Object.assign({},c&&Object.keys(c).length>0?{payment_method:c.payment_method}:{card:i}),{enable_card_on_file:!!(null==s?void 0:s.subscriptionId)&&this._hasCardOnFileKeys(),customer:u}),m=yield this._handleCheckout(h);return a(this,P,"m",U).call(this,{cardId:this.radioChecked,disabled:!1}),m||(d("No se ha podido procesar el pago",this.radioChecked,this.collectorIds.msgError),!1)}d("No se han configurado los datos del proveedor de servicio",this.radioChecked,this.collectorIds.msgError)}catch(n){const i=null===(e=null==n?void 0:n.details)||void 0===e?void 0:e.cardId,l=o||i||null;l&&t&&(this.cardsInjected=!1,yield this._removeCustomerCard(t,this.merchantData.business.pk,l),yield a(this,P,"m",M).call(this,t)),this.reportSdkError(n,{feature:"payment",process_id:l||this.radioChecked||this.getCustomerId(),metadata:{step:"card_on_file"}});throw d((null==n?void 0:n.code)===w.CARD_ON_FILE_DECLINED?N[w.CARD_ON_FILE_DECLINED]:"Ha ocurrido un error",this.radioChecked,this.collectorIds.msgError),n}finally{a(this,P,"m",U).call(this,{cardId:this.radioChecked,disabled:!1})}}))}}L=new WeakMap,k=new WeakMap,j=new WeakMap,P=new WeakSet,M=function(e){return i(this,void 0,void 0,(function*(){var t;if(this.cardsInjected||!(null===(t=this.customization.saveCards)||void 0===t?void 0:t.showSaved)||this.isEnrollmentCard)return;this.cardsInjected=!1;const o=yield this._getCustomerCards(e,this.merchantData.business.pk);l(this,L,n(o,"cards",[]),"f");let i=[];if("cards"in o){i=o.cards.map(u);const n=setInterval((()=>{const t=document.querySelector(`#${this.collectorIds.cardsListContainer}`);t&&this.injected&&(t.innerHTML=m({cards:i,collectorIds:this.collectorIds,renderPaymentButton:this.renderPaymentButton,customStyles:this.customStyles,customization:this.customization,hasCOF:this._hasCardOnFileKeys()}),clearInterval(n),a(this,P,"m",R).call(this),a(this,P,"m",H).call(this,e),this.cardsInjected=!0)}),500)}}))},R=function(n="cards"){const e={cards:{accClass:"accordion-container",triggerClass:"card-item-label"},paymentMethods:{accClass:"accordion-container-apm",triggerClass:"apm-item-label"}},t=new o("."+e[n].accClass,{triggerClass:e[n].triggerClass,duration:300,collapse:!0,showMultiple:!1,onOpen:e=>i(this,void 0,void 0,(function*(){yield a(this,P,"m",B).call(this,e,n)}))});"cards"===n?this.accordionCards=t:"paymentMethods"===n&&(this.accordionPaymentMethods=t)},T=function(n="",e=null,t=!1,o=!1){[{type:"cards",accordion:this.accordionCards},{type:"paymentMethods",accordion:this.accordionPaymentMethods}].forEach((({accordion:i,type:l})=>{i&&(t&&"closeAll"in i&&i.closeAll(),o&&l!==n&&i.closeAll&&i.closeAll(),null!==e&&l===n&&i.open&&i.open("paymentMethods"!==l?e:e-(a(this,L,"f").length+1)))}))},D=function(n=[],e="show"){n.forEach((n=>{document.querySelectorAll("."+n).forEach((n=>{n.classList.remove(e)}))}))},B=function(n){return i(this,arguments,void 0,(function*(n,t="cards"){var o,l,r;const{vault_id:d,vault_url:c}=this.merchantData,u=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(),a(this,P,"m",D).call(this,["cvvContainer"]);const p=document.getElementById(u);p&&(p.checked=!0);const h=a(this,L,"f").find((n=>{var e;return(null===(e=n.fields)||void 0===e?void 0:e.skyflow_id)===u})),m=!!(null===(r=null==h?void 0:h.fields)||void 0===r?void 0:r.subscription_id);try{"cards"!==t||m&&this._hasCardOnFileKeys()||(this.updateCollectContainer=yield function(n,t,o,a,l){return i(this,arguments,void 0,(function*(n,t,o,i,a,l={},r,d,c){var u,p,h,m,v,y,b,x,A,_,I,S,w,O,N,P,L,k,j,M,R,T,D,B,$,F,z,Y;const U=yield f(t,o,i,d,a);var H=0===Object.keys(l).length?s:Object.assign(Object.assign({},l),{labels:{nameLabel:(null===(u=null==l?void 0:l.labels)||void 0===u?void 0:u.nameLabel)&&""!==(null===(p=null==l?void 0:l.labels)||void 0===p?void 0:p.nameLabel)?null===(h=null==l?void 0:l.labels)||void 0===h?void 0:h.nameLabel:s.labels.nameLabel,cardLabel:(null===(m=null==l?void 0:l.labels)||void 0===m?void 0:m.cardLabel)&&""!==(null===(v=null==l?void 0:l.labels)||void 0===v?void 0:v.cardLabel)?null===(y=null==l?void 0:l.labels)||void 0===y?void 0:y.cardLabel:s.labels.cardLabel,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)?null===(A=null==l?void 0:l.labels)||void 0===A?void 0:A.cvvLabel:s.labels.cvvLabel,expiryDateLabel:(null===(_=null==l?void 0:l.labels)||void 0===_?void 0:_.expiryDateLabel)&&""!==(null===(I=null==l?void 0:l.labels)||void 0===I?void 0:I.expiryDateLabel)?null===(S=null==l?void 0:l.labels)||void 0===S?void 0:S.expiryDateLabel:s.labels.expiryDateLabel},placeholders:{namePlaceholder:(null===(w=null==l?void 0:l.placeholders)||void 0===w?void 0:w.namePlaceholder)&&""!==(null===(O=null==l?void 0:l.placeholders)||void 0===O?void 0:O.namePlaceholder)?null===(N=null==l?void 0:l.placeholders)||void 0===N?void 0:N.namePlaceholder:s.placeholders.namePlaceholder,cardPlaceholder:(null===(P=null==l?void 0:l.placeholders)||void 0===P?void 0:P.cardPlaceholder)&&""!==(null===(L=null==l?void 0:l.placeholders)||void 0===L?void 0:L.cardPlaceholder)?null===(k=null==l?void 0:l.placeholders)||void 0===k?void 0:k.cardPlaceholder:s.placeholders.cardPlaceholder,cvvPlaceholder:(null===(j=null==l?void 0:l.placeholders)||void 0===j?void 0:j.cvvPlaceholder)&&""!==(null===(M=null==l?void 0:l.placeholders)||void 0===M?void 0:M.cvvPlaceholder)?null===(R=null==l?void 0:l.placeholders)||void 0===R?void 0:R.cvvPlaceholder:s.placeholders.cvvPlaceholder,expiryMonthPlaceholder:(null===(T=null==l?void 0:l.placeholders)||void 0===T?void 0:T.expiryMonthPlaceholder)&&""!==(null===(D=null==l?void 0:l.placeholders)||void 0===D?void 0:D.expiryMonthPlaceholder)?null===(B=null==l?void 0:l.placeholders)||void 0===B?void 0:B.expiryMonthPlaceholder:s.placeholders.expiryMonthPlaceholder,expiryYearPlaceholder:(null===($=null==l?void 0:l.placeholders)||void 0===$?void 0:$.expiryYearPlaceholder)&&""!==(null===(F=null==l?void 0:l.placeholders)||void 0===F?void 0:F.expiryYearPlaceholder)?null===(z=null==l?void 0:l.placeholders)||void 0===z?void 0:z.expiryYearPlaceholder:s.placeholders.expiryYearPlaceholder}});const G=U.container(e.ContainerType.COLLECT),X=G.create(Object.assign(Object.assign({table:"cards",column:"cvv"},H),{label:"",placeholder:null===(Y=H.placeholders)||void 0===Y?void 0:Y.cvvPlaceholder,type:e.ElementType.CVV,validations:[C],skyflowID:n}));E({element:X,errorStyles:null==H?void 0:H.errorTextStyles,fieldMessage:"",events:null==c?void 0:c.cvvEvents});const W={cvv:{element:X,container:`#${r.cvv}${n}`}};return yield g(W),{container:G,elements:{cvvElement:X}}}))}(u,d,c,this.baseUrl,this.abortController.signal,this.customStyles,this.collectorIds,this.apiKeyTonder,a(this,j,"f")),setTimeout((()=>{const n=document.querySelector(`#cvvContainer${u}`);n&&n.classList.add("show")}),5)),a(this,P,"m",$).call(this,u)}catch(n){console.error("Ha ocurrido un error",n),this.reportSdkError(n,{feature:"handle-open-card-accordion",process_id:u,metadata:{step:"#handleOpenCardAccordion",type:t}})}yield a(this,P,"m",W).call(this,p,null,t)}))},$=function(n=""){var e,t,o;if(!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===(t=null===(e=this.customization)||void 0===e?void 0:e.paymentButton)||void 0===t?void 0:t.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,P,"m",F).call(this)}))},F=function(){return i(this,void 0,void 0,(function*(){try{yield this.payment({})}catch(n){console.error("Payment error:",n)}}))},z=function(){if(!this.renderSaveCardButton)return;const n=document.querySelector(`#${this.collectorIds.tonderSaveCardButton}`);n?(n.style.display="block",n.textContent="Guardar",n.onclick=e=>i(this,void 0,void 0,(function*(){e.preventDefault(),yield a(this,P,"m",Y).call(this,n)}))):console.error("Save button not found")},Y=function(n){return i(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}}))},U=function(n){var e,t,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===(t=null===(e=this.customization)||void 0===e?void 0:e.paymentButton)||void 0===t?void 0:t.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)}},H=function(n=""){const e=document.getElementsByName("card_selected");for(const n of e)n.style.display="block",n.onclick=t=>i(this,void 0,void 0,(function*(){const t=n.classList[0],o=Array.from(e).indexOf(n);yield a(this,P,"m",W).call(this,n,o,t)}));const t=document.getElementsByClassName("card-delete-button");for(const e of t)e.addEventListener("click",(t=>i(this,void 0,void 0,(function*(){t.preventDefault(),t.stopImmediatePropagation(),yield a(this,P,"m",G).call(this,n,e)}))),!1)},G=function(n,e){return i(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 a(this,P,"m",X).call(this,n)}}}))},X=function(n){return i(this,void 0,void 0,(function*(){this.deletingCards.length>0||(this.cardsInjected=!1,yield a(this,P,"m",M).call(this,n))}))},W=function(n){return i(this,arguments,void 0,(function*(n,e=null,t=""){var o,i;if(n.id===this.radioChecked||"new"===n.id&&void 0===this.radioChecked)return;const l=document.querySelector(".container-form");l&&(l.style.display="new"===n.id?"block":"none"),"new"===n.id?(a(this,P,"m",D).call(this,["cvvContainer"]),this.updateCollectContainer&&"unmount"in(null===(i=null===(o=this.updateCollectContainer)||void 0===o?void 0:o.elements)||void 0===i?void 0:i.cvvElement)&&this.updateCollectContainer.elements.cvvElement.unmount(),a(this,P,"m",T).call(this,"",null,!0),this.radioChecked!==n.id&&(yield a(this,P,"m",Z).call(this),a(this,P,"m",$).call(this))):(a(this,P,"m",T).call(this,t,null,!1,!0),null!==e&&a(this,P,"m",T).call(this,t,e,!0),a(this,P,"m",J).call(this)),this.radioChecked=n.id}))},K=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,P,"m",V).call(this,n.results))}catch(n){console.warn("Error getting APMS")}}))},V=function(n){if(this.apmsInjected)return;const e=setInterval((()=>{const t=document.querySelector(`#${this.collectorIds.apmsListContainer}`);t&&this.injected&&(t.innerHTML=v({apms:n,collectorIds:this.collectorIds,renderPaymentButton:this.renderPaymentButton,customization:this.customization}),clearInterval(e),a(this,P,"m",R).call(this,"paymentMethods"),a(this,P,"m",H).call(this),this.apmsInjected=!0)}),500)},q=function(){return i(this,void 0,void 0,(function*(){if(this.isEnrollmentCard?a(this,P,"m",z).call(this):a(this,P,"m",$).call(this),yield this._initializeCheckout(),this._hasCardOnFileKeys()){const n=document.getElementById("save-checkout-card");(null==n?void 0:n.parentElement)&&(n.parentElement.style.display="none")}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 a(this,P,"m",M).call(this,e)}}this.isEnrollmentCard||(yield a(this,P,"m",K).call(this)),this.collectContainer=yield b(n,e,this.baseUrl,this.abortController.signal,this.customStyles,this.collectorIds,this.apiKeyTonder,a(this,j,"f"))}}))},J=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 i(this,void 0,void 0,(function*(){yield this._initializeCheckout();const{vault_id:n,vault_url:e}=this.merchantData;n&&(this.collectContainer=yield b(n,e,this.baseUrl,this.abortController.signal,this.customStyles,this.collectorIds,this.apiKeyTonder,a(this,j,"f")))}))},Q=function(n){return i(this,arguments,void 0,(function*(n,e=null){var t,o;try{const n=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(n&&"collect"in n){const e=yield n.collect();return yield e.records[0].fields}d("Por favor, verifica todos los campos de tu tarjeta",this.radioChecked,this.collectorIds.msgError)}catch(n){throw d("Por favor, verifica todos los campos de tu tarjeta",this.radioChecked,this.collectorIds.msgError),n}}))},nn=function(){return i(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){}}))},en=function(){return i(this,void 0,void 0,(function*(){let n,e=null;if(this.customer.email)try{if(this.merchantData){const t=yield a(this,P,"m",Q).call(this,this.collectorIds.tonderSaveCardButton),o=yield this._getCustomer();if("auth_token"in o&&this.secureToken){const{auth_token:i,first_name:l="",last_name:r="",email:s}=o;if(n=i,this._hasCardOnFileKeys()){const n=yield a(this,P,"m",on).call(this,i,this.merchantData.business.pk,{skyflow_id:t.skyflow_id},{forceSave:!0,showNotification:!1,appOrigin:!0,refreshCards:!1});e=(null==n?void 0:n.skyflow_id)||null;const o=null==n?void 0:n.card_bin;if(!o)throw new Error("Card BIN not returned from save card");const d=yield this._initializeCardOnFile();let c;try{c=yield d.process({cardTokens:{name:t.cardholder_name,number:t.card_number,expiryMonth:t.expiration_month,expiryYear:t.expiration_year,cvv:t.cvv},cardBin:o,contactDetails:{firstName:l||"",lastName:r||"",email:s||""},customerId:i,currency:this.currency||"MXN"})}catch(n){throw S({errorCode:w.CARD_ON_FILE_DECLINED,message:O[w.CARD_ON_FILE_DECLINED]},n)}yield a(this,P,"m",on).call(this,i,this.merchantData.business.pk,{skyflow_id:t.skyflow_id,subscription_id:c.subscriptionId},{forceSave:!0,showNotification:!0})}else yield a(this,P,"m",on).call(this,i,this.merchantData.business.pk,{skyflow_id:t.skyflow_id},{forceSave:!0,showNotification:!0})}else d("No se han configurado los datos de seguridad para guardar tarjeta",this.radioChecked,this.collectorIds.msgError)}else d("No se han configurado los datos del proveedor de servicio",this.radioChecked,this.collectorIds.msgError)}catch(t){e&&n&&(yield this._removeCustomerCard(n,this.merchantData.business.pk,e)),this.reportSdkError(t,{feature:"save-card",process_id:e,metadata:{step:"#validateAndSaveCard"}});const o="object"==typeof t&&null!==t&&"message"in t;throw d((null==t?void 0:t.code)===w.CARD_ON_FILE_DECLINED?N[w.CARD_ON_FILE_DECLINED]:o?null==t?void 0:t.message:"Ha ocurrido un error",this.radioChecked,this.collectorIds.msgError),t}}))},tn=function(n){return i(this,void 0,void 0,(function*(){var e,t;let o=null;try{const i=yield this._initializeCardOnFile(),l=null===(t=null===(e=n.records)||void 0===e?void 0:e[0])||void 0===t?void 0:t.fields;if(!l)throw new Error("No card data returned from collect");const r=yield this._getCustomer(),{auth_token:s,first_name:d="",last_name:c="",email:u}=r,p=yield a(this,P,"m",on).call(this,s,this.merchantData.business.pk,{skyflow_id:l.skyflow_id},{forceSave:!0,showNotification:!1,appOrigin:!0,refreshCards:!1});o=(null==p?void 0:p.skyflow_id)||null;const h=null==p?void 0:p.card_bin;if(!h)throw new Error("Card BIN not returned from save card");let m;try{m=yield i.process({cardTokens:{name:l.cardholder_name,number:l.card_number,expiryMonth:l.expiration_month,expiryYear:l.expiration_year,cvv:l.cvv},cardBin:h,contactDetails:{firstName:d||"",lastName:c||"",email:u||""},customerId:s,currency:this.currency||"MXN"})}catch(n){throw S({errorCode:w.CARD_ON_FILE_DECLINED,message:O[w.CARD_ON_FILE_DECLINED],details:{cardId:o}},n)}return yield a(this,P,"m",on).call(this,s,this.merchantData.business.pk,{skyflow_id:l.skyflow_id,subscription_id:m.subscriptionId},{forceSave:!0,showNotification:!1}),{subscriptionId:m.subscriptionId,cardId:p.skyflow_id}}catch(n){throw this.reportSdkError(n,{feature:"payment",process_id:o,metadata:{step:"#processCardOnFilePayment"}}),S({errorCode:w.CARD_ON_FILE_DECLINED,message:O[w.CARD_ON_FILE_DECLINED],details:{cardId:o}},n)}}))},on=function(n,e,t){return i(this,arguments,void 0,(function*(n,e,t,o={}){var i,l;if(!n||!(null===(i=this.customer)||void 0===i?void 0:i.email))return;const{forceSave:r=!1,showNotification:s=!0,appOrigin:c=!1,refreshCards:u=!0}=o,p=document.getElementById("save-checkout-card");if(r||p&&"checked"in p&&p.checked||!!(null===(l=this.customization.saveCards)||void 0===l?void 0:l.autoSave))try{if(this.secureToken){const o=yield this._saveCustomerCard(n,e,t,c);return u&&(this.cardsInjected=!1,yield a(this,P,"m",M).call(this,n)),s&&function(n,e=null,t="msgNotification",o="msgNotificationText"){try{const i=e&&"new"!==e,a=document.getElementById(`${t}${i?e:""}`);if(a){let t=document.getElementById(`${o}${i?e:""}`);a.style.display="flex",t.innerHTML="",t.innerHTML=n,setTimeout((function(){a.style.display="none",t.innerHTML=""}),3e4)}}catch(n){console.error("Error showing message",n)}}("Tarjeta registrada con éxito",this.radioChecked,this.collectorIds.msgNotification),o}d("No se han configurado los datos de seguridad para guardar tarjeta",this.radioChecked,this.collectorIds.msgError)}catch(n){this.reportSdkError(n,{feature:"save-card",process_id:t.skyflow_id||this.getCustomerId(),metadata:{step:"#handleSaveCard"}});throw"object"==typeof n&&null!==n&&"message"in n&&"Error"!==(null==n?void 0:n.message)&&d(null==n?void 0:n.message,this.radioChecked,this.collectorIds.msgError),n}}))};export{an as InlineCheckout};

package/dist/shared/constants/messages.d.ts

@@ -0,0 +1,2 @@
+export declare const MESSAGES_EN: Record<string, string>;
+export declare const MESSAGES_ES: Record<string, string>;

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

@@ -0,0 +1,5 @@
+export declare enum ErrorKeyEnum {
+    SAVE_CARD_ERROR = "SAVE_CARD_ERROR",
+    PAYMENT_PROCESS_ERROR = "PAYMENT_PROCESS_ERROR",
+    CARD_ON_FILE_DECLINED = "CARD_ON_FILE_DECLINED"
+}

package/dist/shared/utils/appError.d.ts

@@ -0,0 +1,24 @@
+export interface IAppErrorInput {
+    errorCode: string;
+    message?: string;
+    details?: Record<string, unknown>;
+    statusCode?: number;
+}
+export declare class AppError extends Error {
+    readonly status: 'error';
+    readonly code: string;
+    readonly statusCode: number;
+    details: Record<string, unknown>;
+    constructor(error: IAppErrorInput);
+    static parseStatusCode(code: unknown): number;
+    static isHttpStatusCode(value: unknown): boolean;
+    static resolveSystemError(value: unknown): string | null;
+    static extractSystemError(details: Record<string, unknown>): string;
+}
+export interface IBuildPublicAppErrorInput {
+    errorCode: string;
+    message?: string;
+    details?: Record<string, unknown>;
+    statusCode?: number;
+}
+export declare function buildPublicAppError(data: IBuildPublicAppErrorInput, error?: any): AppError;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tonder.io/ionic-full-sdk",
-  "version": "0.0.61",
+  "version": "0.0.62-beta.DEV-2106.1",
   "description": "Tonder ionic full SDK",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -10,13 +10,14 @@
   "author": "",
   "license": "ISC",
   "dependencies": {
-    "@tonder.io/ionic-lite-sdk": "^0.0.67",
+    "@tonder.io/ionic-lite-sdk": "0.0.68-beta.DEV-2106.1",
     "accordion-js": "^3.4.0",
     "crypto-js": "^4.1.1",
     "lodash.get": "^4.4.2",
     "skyflow-js": "2.5.0"
   },
   "devDependencies": {
+    "@rollup/plugin-replace": "^6.0.3",
     "@rollup/plugin-terser": "^0.4.4",
     "@rollup/plugin-typescript": "^11.1.6",
     "@types/crypto-js": "^4.2.2",

package/rollup.config.js

@@ -1,6 +1,8 @@
 const typescript = require('@rollup/plugin-typescript');
 const terser = require('@rollup/plugin-terser');
 const postcss = require('rollup-plugin-postcss');
+const replace = require('@rollup/plugin-replace');
+const packageJson = require('./package.json');
 
 module.exports = {
   input: './src/index.ts',
@@ -10,6 +12,13 @@ module.exports = {
     plugins: [terser()]
   },
   plugins: [
+    replace({
+      preventAssignment: true,
+      values: {
+        '__SDK_NAME__': JSON.stringify(packageJson.name),
+        '__SDK_VERSION__': JSON.stringify(packageJson.version)
+      }
+    }),
     typescript({
       exclude: ["tests/**", "jest.config.ts"]
     }),

package/src/classes/inlineCheckout.ts

@@ -7,13 +7,16 @@ import {
 import {initSkyflow, initUpdateSkyflow} from '../helpers/skyflow'
 import { ErrorResponse } from '@tonder.io/ionic-lite-sdk/dist/classes/errorResponse';
 import { CustomerRegisterResponse } from '@tonder.io/ionic-lite-sdk/dist/types/responses';
-import {BaseInlineCheckout} from "@tonder.io/ionic-lite-sdk";
+import { BaseInlineCheckout } from "@tonder.io/ionic-lite-sdk";
 import {IProcessPaymentRequest} from "@tonder.io/ionic-lite-sdk/dist/types/checkout";
 import {ISaveCardInternalResponse, ISaveCardSkyflowRequest} from "@tonder.io/ionic-lite-sdk/dist/types/card";
 import {ITonderPaymentMethod} from "@tonder.io/ionic-lite-sdk/dist/types/paymentMethod";
 import type { SkyflowCollectFields, SkyflowCollectResponse } from "@tonder.io/ionic-lite-sdk/dist/types/cardOnFile";
 import {IEvents, IInlineCheckoutOptions, IInlineCustomizationOptions, InCollectorContainer} from "../types/commons";
 import {IInlineCheckout} from "../types/inlineCheckout";
+import { buildPublicAppError } from "../shared/utils/appError";
+import { ErrorKeyEnum } from "../shared/enums/ErrorKeyEnum";
+import { MESSAGES_EN, MESSAGES_ES } from "../shared/constants/messages";
 import get from "lodash.get";
 // @ts-ignore
 import Accordion from "accordion-js";
@@ -334,6 +337,14 @@ export class InlineCheckout extends BaseInlineCheckout<IInlineCustomizationOptio
       this.#mountPayButton(container_radio_id)
     }catch (e){
       console.error("Ha ocurrido un error", e);
+      this.reportSdkError(e, {
+        feature: "handle-open-card-accordion",
+        process_id: container_radio_id,
+        metadata: {
+          step: "#handleOpenCardAccordion",
+          type,
+        },
+      });
     }
     await this.#handleRadioButtonClick(radio_card, null, type);
   }
@@ -702,23 +713,34 @@ export class InlineCheckout extends BaseInlineCheckout<IInlineCustomizationOptio
 
               // 2. Process card on file
               const cardOnFile = await this._initializeCardOnFile();
-              const result = await cardOnFile.process({
-                cardTokens: {
-                  name: cardTokensSkyflowTonder.cardholder_name,
-                  number: cardTokensSkyflowTonder.card_number,
-                  expiryMonth: cardTokensSkyflowTonder.expiration_month,
-                  expiryYear: cardTokensSkyflowTonder.expiration_year,
-                  cvv: cardTokensSkyflowTonder.cvv,
-                },
-                cardBin,
-                contactDetails: {
-                  firstName: first_name || '',
-                  lastName: last_name || '',
-                  email: email || '',
-                },
-                customerId: authToken,
-                currency: this.currency || 'MXN',
-              });
+              let result: { subscriptionId: string };
+              try {
+                result = await cardOnFile.process({
+                  cardTokens: {
+                    name: cardTokensSkyflowTonder.cardholder_name,
+                    number: cardTokensSkyflowTonder.card_number,
+                    expiryMonth: cardTokensSkyflowTonder.expiration_month,
+                    expiryYear: cardTokensSkyflowTonder.expiration_year,
+                    cvv: cardTokensSkyflowTonder.cvv,
+                  },
+                  cardBin,
+                  contactDetails: {
+                    firstName: first_name || '',
+                    lastName: last_name || '',
+                    email: email || '',
+                  },
+                  customerId: authToken,
+                  currency: this.currency || 'MXN',
+                });
+              } catch (processError) {
+                throw buildPublicAppError(
+                  {
+                    errorCode: ErrorKeyEnum.CARD_ON_FILE_DECLINED,
+                    message: MESSAGES_EN[ErrorKeyEnum.CARD_ON_FILE_DECLINED],
+                  },
+                  processError,
+                );
+              }
 
               // 3. Save card with subscription_id
               await this.#handleSaveCard(
@@ -749,8 +771,21 @@ export class InlineCheckout extends BaseInlineCheckout<IInlineCustomizationOptio
         if(cardId && auth_token){
             await this._removeCustomerCard(auth_token, this.merchantData!.business.pk, cardId)
         }
+        this.reportSdkError(error, {
+          feature: "save-card",
+          process_id: cardId,
+          metadata: {
+            step: "#validateAndSaveCard",
+          },
+        });
         const exist_msg_error = typeof error === "object" && error !== null && "message" in error;
-        showError(exist_msg_error ? error?.message as string:"Ha ocurrido un error", this.radioChecked, this.collectorIds.msgError)
+        const visualMessage =
+          (error as any)?.code === ErrorKeyEnum.CARD_ON_FILE_DECLINED
+            ? MESSAGES_ES[ErrorKeyEnum.CARD_ON_FILE_DECLINED]
+            : exist_msg_error
+              ? (error?.message as string)
+              : "Ha ocurrido un error";
+        showError(visualMessage, this.radioChecked, this.collectorIds.msgError)
         throw error;
       } finally {}
     }
@@ -786,23 +821,37 @@ export class InlineCheckout extends BaseInlineCheckout<IInlineCustomizationOptio
               throw new Error("Card BIN not returned from save card");
           }
 
-          const result = await cardOnFile.process({
-              cardTokens: {
-                  name: cardFields.cardholder_name,
-                  number: cardFields.card_number,
-                  expiryMonth: cardFields.expiration_month,
-                  expiryYear: cardFields.expiration_year,
-                  cvv: cardFields.cvv,
-              },
-              cardBin,
-              contactDetails: {
-                  firstName: first_name || '',
-                  lastName: last_name || '',
-                  email: email || '',
-              },
-              customerId: auth_token,
-              currency: this.currency || 'MXN',
-          });
+          let result: { subscriptionId: string };
+          try {
+              result = await cardOnFile.process({
+                  cardTokens: {
+                      name: cardFields.cardholder_name,
+                      number: cardFields.card_number,
+                      expiryMonth: cardFields.expiration_month,
+                      expiryYear: cardFields.expiration_year,
+                      cvv: cardFields.cvv,
+                  },
+                  cardBin,
+                  contactDetails: {
+                      firstName: first_name || '',
+                      lastName: last_name || '',
+                      email: email || '',
+                  },
+                  customerId: auth_token,
+                  currency: this.currency || 'MXN',
+              });
+          } catch (processError) {
+              throw buildPublicAppError(
+                  {
+                      errorCode: ErrorKeyEnum.CARD_ON_FILE_DECLINED,
+                      message: MESSAGES_EN[ErrorKeyEnum.CARD_ON_FILE_DECLINED],
+                      details: {
+                          cardId,
+                      },
+                  },
+                  processError,
+              );
+          }
 
           // Update saved card with subscription_id
           await this.#handleSaveCard(
@@ -817,7 +866,23 @@ export class InlineCheckout extends BaseInlineCheckout<IInlineCustomizationOptio
 
           return { subscriptionId: result.subscriptionId, cardId: saveCardResponse.skyflow_id };
       }catch (error) {
-          return { subscriptionId: null, cardId };
+          this.reportSdkError(error, {
+            feature: "payment",
+            process_id: cardId,
+            metadata: {
+              step: "#processCardOnFilePayment",
+            },
+          });
+          throw buildPublicAppError(
+            {
+              errorCode: ErrorKeyEnum.CARD_ON_FILE_DECLINED,
+              message: MESSAGES_EN[ErrorKeyEnum.CARD_ON_FILE_DECLINED],
+              details: {
+                cardId,
+              },
+            },
+            error,
+          );
       }
   }
 
@@ -901,12 +966,25 @@ export class InlineCheckout extends BaseInlineCheckout<IInlineCustomizationOptio
         showError("No se han configurado los datos del proveedor de servicio",  this.radioChecked, this.collectorIds.msgError)
       }
     } catch (error) {
-        if(cardIdSaved && auth_token){
+        const cardIdFromError = (error as any)?.details?.cardId as string | null | undefined;
+        const cardIdToCleanup = cardIdSaved || cardIdFromError || null;
+        if(cardIdToCleanup && auth_token){
             this.cardsInjected = false
-            await this._removeCustomerCard(auth_token, this.merchantData!.business.pk, cardIdSaved)
+            await this._removeCustomerCard(auth_token, this.merchantData!.business.pk, cardIdToCleanup)
             await this.#loadCardsList(auth_token)
         }
-      showError("Ha ocurrido un error", this.radioChecked, this.collectorIds.msgError)
+      this.reportSdkError(error, {
+        feature: "payment",
+        process_id: cardIdToCleanup || this.radioChecked || this.getCustomerId(),
+        metadata: {
+          step: "card_on_file",
+        },
+      });
+      const visualMessage =
+        (error as any)?.code === ErrorKeyEnum.CARD_ON_FILE_DECLINED
+          ? MESSAGES_ES[ErrorKeyEnum.CARD_ON_FILE_DECLINED]
+          : "Ha ocurrido un error";
+      showError(visualMessage, this.radioChecked, this.collectorIds.msgError)
       throw error;
     } finally {
       this.#updatePayButton({cardId: this.radioChecked, disabled: false});
@@ -916,7 +994,7 @@ export class InlineCheckout extends BaseInlineCheckout<IInlineCustomizationOptio
   async #handleSaveCard(
     authToken: string,
     businessId: string | number,
-    cardTokens: ISaveCardSkyflowRequest & { subscription_id?: string },
+    cardTokens: ISaveCardSkyflowRequest,
     options: { forceSave?: boolean; showNotification?: boolean; appOrigin?: boolean; refreshCards?: boolean } = {}
   ): Promise<ISaveCardInternalResponse | undefined> {
     // Validate required data
@@ -944,6 +1022,13 @@ export class InlineCheckout extends BaseInlineCheckout<IInlineCustomizationOptio
           showError("No se han configurado los datos de seguridad para guardar tarjeta", this.radioChecked, this.collectorIds.msgError);
         }
       } catch (error) {
+        this.reportSdkError(error, {
+          feature: "save-card",
+          process_id: cardTokens.skyflow_id || this.getCustomerId(),
+          metadata: {
+            step: "#handleSaveCard",
+          },
+        });
         const exist_msg_error = typeof error === "object" && error !== null && "message" in error;
         if (exist_msg_error && error?.message !== 'Error') {
           showError(error?.message as string, this.radioChecked, this.collectorIds.msgError);

package/src/helpers/sdkInfo.ts

@@ -0,0 +1,11 @@
+/**
+ * SDK information injected from package.json at build time
+ * Values are replaced by Rollup's replace plugin
+ */
+declare const __SDK_NAME__: string;
+declare const __SDK_VERSION__: string;
+
+export const SDK_INFO = Object.freeze({
+  name: __SDK_NAME__,
+  version: __SDK_VERSION__,
+});

package/src/shared/constants/messages.ts

@@ -0,0 +1,11 @@
+import { ErrorKeyEnum } from "../enums/ErrorKeyEnum";
+
+export const MESSAGES_EN: Record<string, string> = {
+  [ErrorKeyEnum.CARD_ON_FILE_DECLINED]:
+    "Transaction declined. Please verify your card details.",
+};
+
+export const MESSAGES_ES: Record<string, string> = {
+  [ErrorKeyEnum.CARD_ON_FILE_DECLINED]:
+    "Transaccion declinada. Verique los datos de su tarjeta.",
+};

package/src/shared/enums/ErrorKeyEnum.ts

@@ -0,0 +1,5 @@
+export enum ErrorKeyEnum {
+  SAVE_CARD_ERROR = "SAVE_CARD_ERROR",
+  PAYMENT_PROCESS_ERROR = "PAYMENT_PROCESS_ERROR",
+  CARD_ON_FILE_DECLINED = "CARD_ON_FILE_DECLINED",
+}

package/src/shared/utils/appError.ts

@@ -0,0 +1,131 @@
+const DEFAULT_SYSTEM_ERROR = 'APP_INTERNAL_001';
+const DEFAULT_MESSAGE = 'An unexpected error occurred.';
+
+export interface IAppErrorInput {
+    errorCode: string;
+    message?: string;
+    details?: Record<string, unknown>;
+    statusCode?: number;
+}
+
+export class AppError extends Error {
+    public readonly status: 'error' = 'error';
+    public readonly code: string;
+    public readonly statusCode: number;
+    public details: Record<string, unknown>;
+
+    constructor(error: IAppErrorInput) {
+        const resolvedStatusCode = AppError.parseStatusCode(error.statusCode);
+        const resolvedMessage = error.message || DEFAULT_MESSAGE;
+
+        super(resolvedMessage);
+
+        Object.setPrototypeOf(this, new.target.prototype);
+
+        this.name = 'TonderError';
+        this.code = error.errorCode;
+        this.statusCode = resolvedStatusCode;
+
+        const baseDetails = {
+            ...(error.details || {}),
+        };
+
+        const resolvedSystemError = AppError.extractSystemError(baseDetails);
+        this.details = {
+            ...baseDetails,
+            code: error.errorCode,
+            statusCode: resolvedStatusCode,
+            systemError: resolvedSystemError,
+        };
+
+        Error.captureStackTrace?.(this, AppError);
+    }
+
+    public static parseStatusCode(code: unknown): number {
+        const parsed = Number(code);
+        if (!Number.isFinite(parsed)) return 500;
+        if (parsed < 100 || parsed > 599) return 500;
+        return Math.trunc(parsed);
+    }
+
+    public static isHttpStatusCode(value: unknown): boolean {
+        const parsed = Number(value);
+        return Number.isFinite(parsed) && parsed >= 100 && parsed <= 599;
+    }
+
+    public static resolveSystemError(value: unknown): string | null {
+        if (typeof value !== 'string') return null;
+        const normalized = value.trim();
+        if (!normalized) return null;
+        return normalized;
+    }
+
+    public static extractSystemError(details: Record<string, unknown>): string {
+        const cause = details?.cause as any;
+        const candidates: unknown[] = [
+            details?.systemError,
+            cause?.body?.code,
+            cause?.details?.code,
+        ];
+
+        for (const candidate of candidates) {
+            const resolved = AppError.resolveSystemError(candidate);
+            if (resolved) return resolved;
+        }
+
+        return DEFAULT_SYSTEM_ERROR;
+    }
+}
+
+export interface IBuildPublicAppErrorInput {
+    errorCode: string;
+    message?: string;
+    details?: Record<string, unknown>;
+    statusCode?: number;
+}
+
+export function buildPublicAppError(
+    data: IBuildPublicAppErrorInput,
+    error?: any,
+): AppError {
+    if (!data?.errorCode) {
+        throw new Error('buildPublicAppError requires errorCode');
+    }
+
+    const hasDataDetails = !!data.details && Object.keys(data.details).length > 0;
+    const hasOverrides =
+        data.errorCode !== error?.code ||
+        !!data.message ||
+        data.statusCode !== undefined ||
+        hasDataDetails;
+
+    if (error instanceof AppError && !hasOverrides) {
+        return error;
+    }
+
+    const resolvedStatusCode =
+        data.statusCode ??
+        (AppError.isHttpStatusCode(error?.statusCode)
+            ? Number(error.statusCode)
+            : AppError.isHttpStatusCode(error?.code)
+                ? Number(error.code)
+                : AppError.isHttpStatusCode(error?.status)
+                    ? Number(error.status)
+                    : 500);
+
+    const resolvedDetails: Record<string, unknown> = {
+        ...(error?.details || {}),
+        ...(data.details || {}),
+    };
+
+    if (resolvedDetails.cause === undefined && error !== undefined) {
+        resolvedDetails.cause = error;
+    }
+
+    return new AppError({
+        errorCode: data.errorCode,
+        message: data.message,
+        details: resolvedDetails,
+        statusCode: resolvedStatusCode,
+    });
+}

package/tsconfig.json

@@ -7,6 +7,7 @@
     /* Modules */
     "module": "esnext",                                  /* Specify what module code is generated. */
     "moduleResolution": "node",                          /* Specify how TypeScript looks up a file from a given module specifier. */
+    "resolveJsonModule": true,                           /* Enable importing .json files. */
     /* Emit */
     "declaration": true,                              /* Generate .d.ts files from TypeScript and JavaScript files in your project. */
     "outDir": "./dist",                                   /* Specify an output folder for all emitted files. */