@spot-flow/checkout-inline-js 0.1.43-dev.2 → 0.1.43

package/dist/checkout-inline.es.js

@@ -29850,7 +29850,7 @@ class Hd {
 const Rd = `<div class="flex items-center justify-center md:justify-between w-full text-xxs mt-5">
   <div class="text-tone-60"><span>Powered by</span> <span class="font-bold">Spotflow</span></div>
   <div class="align-center text-tone-60 hidden md:flex gap-4">
-    <span id="test-cards-link"  class="hover:font-bold">Test Cards</span>
+    <!-- <span id="test-cards-link"  class="hover:font-bold">Test Cards</span> -->
     <a href="https://ribbon-scowl-35f.notion.site/Terms-Conditions-940742f0a1b144498ffc1786c5bc6a08?pvs=4" target="_blank" class="hover:font-bold">Terms</a>
     <a href="https://ribbon-scowl-35f.notion.site/Privacy-Policy-Spotflow-3997ee8d923d4cd39a3dc43b7249b713" target="_blank" class="hover:font-bold">Privacy</a>
     <a href="mailto:hello@spotflow.one" class="hover:font-bold">Contact</a>
@@ -30379,12 +30379,6 @@ class Vd {
           verification_status: "Failed",
           authentication_type: "PIN"
         }), this.cardResponse = l, this.cardResponseHeader = d, l.providerMessage ? this.warningScreen.setPaymentError(l.providerMessage) : this.warningScreen.setPaymentError("Payment failed"), this.warningScreen.hideReportIssue();
-      else if (["success", "successful"].includes(l.status))
-        this.currentStep = 5, this.cardResponse = l, this.cardResponseHeader = d, P.track("verify_payment", {
-          payment_method: "Card",
-          verification_status: "Success",
-          authentication_type: "PIN"
-        }), this.redirectTo(l, d, "success");
       else if (!["success", "successful"].includes(l.status) && l.status !== "failed")
         if (this.cardResponse = l, this.cardResponseHeader = d, l != null && l.authorization) {
           if (this.activeRef = l.reference, ((p = l == null ? void 0 : l.authorization) == null ? void 0 : p.mode) === "pin") {
@@ -30405,6 +30399,11 @@ class Vd {
           }
         } else
           this.currentStep = 4, l.providerMessage ? this.warningScreen.setPaymentError(l.providerMessage) : this.warningScreen.setPaymentError("Error with Payment"), this.warningScreen.hideReportIssue();
+      else ["success", "successful"].includes(l.status) && (this.currentStep = 5, this.cardResponse = l, this.cardResponseHeader = d, P.track("verify_payment", {
+        payment_method: "Card",
+        verification_status: "Success",
+        authentication_type: "PIN"
+      }), this.redirectTo(l, d, "success"));
     }).catch((l) => {
       P.track("verify_payment", {
         payment_method: "Card",

package/dist/checkout-inline.js

@@ -1046,7 +1046,7 @@ or you can use record.mirror to access the mirror instance during recording.`;le
   </div>`;class Gr{constructor(e){h(this,"container");h(this,"onAction");h(this,"onSuccess");h(this,"ref");h(this,"token");h(this,"initialTime",300);h(this,"abortController");h(this,"timeLeft");h(this,"timer");h(this,"timerId",null);h(this,"rdtCode");h(this,"url");h(this,"callBackUrl");h(this,"setPaymentResponses");h(this,"step");h(this,"paymentMethod");this.container=e.container,this.timeLeft=this.initialTime,this.onAction=e.onAction,this.ref=e.ref,this.token=e.token,this.rdtCode=e.rdtCode,this.url=e.url,this.onSuccess=e.onSuccess,this.callBackUrl=e.callBackUrl,this.setPaymentResponses=e.setPaymentResponses,this.step=e.step,this.paymentMethod=e.paymentMethod}attachListeners(){this.initialTime=300,this.timeLeft=this.initialTime;const e=3e4;this.abortController=new AbortController,setTimeout(()=>{this.verifyCardPayment(this.token,e,({data:i,headers:t})=>{this.onAction(this.step.success),this.redirectTo(i,t,"success")},()=>{this.onAction(this.step.failed)})},5e3),this.startTimer()}async verifyCardPayment(e,i,t,o){let s=0,a=i,l=!0,d;this.abortController&&(d=this.abortController.signal);const v=async()=>{if(this.timeLeft<=0){l=!1,this.onAction(this.step.end);return}s+=1;try{const p=await an(e,this.ref,d,this.rdtCode,this.url);p.data.status==="failed"&&(l=!1,clearTimeout(this.timer),clearInterval(this.timerId||void 0),this.setPaymentResponses(p.data,p.headers),P.track("verify_payment",{payment_method:this.paymentMethod,verification_status:"Failed"}),o(p)),p.data.status==="inProgress"&&(l&&(a=i*(s+1),this.timer=setTimeout(v,a)),this.setPaymentResponses(p.data,p.headers)),(p.data.status==="success"||p.data.status==="successful")&&(this.setPaymentResponses(p.data,p.headers),l=!1,clearTimeout(this.timer),clearInterval(this.timerId||void 0),P.track("verify_payment",{payment_method:this.paymentMethod,verification_status:"Success"}),t(p))}catch{l&&(a=i*(s+1),this.timer=setTimeout(v,a))}};v()}redirectTo(e,i,t){const o=i.get("spf-redirect-url");this.callBackUrl=o||this.callBackUrl,this.callBackUrl?setTimeout(()=>{const s=new URL(this.callBackUrl);s.searchParams.append("status",e.status),s.searchParams.append("reference",e.reference),window.location.href=s.toString()},1800):t==="success"&&this.onSuccess(e)}startTimer(){const e=this.container.querySelector("#ctd-timer");this.stopTimer(),this.timerId=window.setInterval(()=>{this.timeLeft>0?(this.timeLeft-=1,e&&(e.innerHTML=zn(this.timeLeft),this.startTimer())):(this.stopTimer(),this.onAction(this.step.end))},1e3)}stopTimer(){this.timerId!==null&&(clearInterval(this.timerId),this.timerId=null)}renderComponent(){this.container.innerHTML=this.render(),this.attachListeners()}render(){return Fr}}const zr=`<div class="flex items-center justify-center md:justify-between w-full text-xxs mt-5">
   <div class="text-tone-60"><span>Powered by</span> <span class="font-bold">Spotflow</span></div>
   <div class="align-center text-tone-60 hidden md:flex gap-4">
-    <span id="test-cards-link"  class="hover:font-bold">Test Cards</span>
+    <!-- <span id="test-cards-link"  class="hover:font-bold">Test Cards</span> -->
     <a href="https://ribbon-scowl-35f.notion.site/Terms-Conditions-940742f0a1b144498ffc1786c5bc6a08?pvs=4" target="_blank" class="hover:font-bold">Terms</a>
     <a href="https://ribbon-scowl-35f.notion.site/Privacy-Policy-Spotflow-3997ee8d923d4cd39a3dc43b7249b713" target="_blank" class="hover:font-bold">Privacy</a>
     <a href="mailto:hello@spotflow.one" class="hover:font-bold">Contact</a>
@@ -1365,7 +1365,7 @@ or you can use record.mirror to access the mirror instance during recording.`;le
               <path
                 d="M4.66667 3.99992V1.99992C4.66667 1.82311 4.7369 1.65354 4.86193 1.52851C4.98695 1.40349 5.15652 1.33325 5.33333 1.33325H13.3333C13.5101 1.33325 13.6797 1.40349 13.8047 1.52851C13.9298 1.65354 14 1.82311 14 1.99992V11.3333C14 11.5101 13.9298 11.6796 13.8047 11.8047C13.6797 11.9297 13.5101 11.9999 13.3333 11.9999H11.3333V13.9999C11.3333 14.3679 11.0333 14.6666 10.662 14.6666H2.67133C2.58342 14.6671 2.49626 14.6503 2.41488 14.617C2.3335 14.5837 2.25949 14.5347 2.19711 14.4728C2.13472 14.4108 2.0852 14.3372 2.05137 14.256C2.01754 14.1749 2.00009 14.0878 2 13.9999L2.002 4.66659C2.002 4.29859 2.302 3.99992 2.67333 3.99992H4.66667ZM3.33533 5.33325L3.33333 13.3333H10V5.33325H3.33533ZM6 3.99992H11.3333V10.6666H12.6667V2.66659H6V3.99992Z"
                 fill="#0D0716" />
-            </svg>`},1e3))})})}renderComponent(){this.container.innerHTML=this.render(),this.attachListener()}}function Wr(n){n.classList.remove("hidden"),requestAnimationFrame(()=>{n.classList.remove("opacity-0","scale-95")})}function Ri(n){n.classList.add("opacity-0","scale-95"),n.addEventListener("transitionend",()=>n.classList.add("hidden"),{once:!0})}class $o{constructor({container:e,testCardContainer:i}){h(this,"container");h(this,"testCardContainer");h(this,"testCardInstance",null);this.container=e,this.testCardContainer=i}attachListener(){const e=this.container.querySelector("#test-cards-link");e&&e.addEventListener("click",()=>{this.testCardInstance||(this.testCardInstance=new Jo({container:this.testCardContainer,closeCallback:()=>{this.testCardContainer.innerHTML="",Ri(this.testCardContainer),e.classList.remove("text-tone-100","font-bold")}})),this.testCardInstance.renderComponent(),Wr(this.testCardContainer),e.classList.add("text-tone-100","font-bold")})}renderComponent(){this.container.innerHTML=this.render(),this.attachListener()}render(){return zr}}class Zr{constructor({amount:e,totalAmount:i,container:t,customer:o,encryption:s,planId:a,token:l,currency:d,rdtCode:v,url:p,reference:g,onSuccess:f,callBackUrl:y,metadata:k,localCurrency:C,hidePaymentMethods:S,showPaymentMethods:M,onClose:A,restartTransactionProcess:_,retryingPayment:T}){h(this,"contents");h(this,"cardDetailForm");h(this,"cardOtpValidationForm");h(this,"merchantPlanDetail",{});h(this,"cardPinForm");h(this,"avsForm");h(this,"successScreen");h(this,"pageLoader");h(this,"warningScreen");h(this,"transactionIssuesScreen");h(this,"container");h(this,"onSuccess");h(this,"planId","");h(this,"customer");h(this,"token");h(this,"amount");h(this,"totalAmount");h(this,"encryption");h(this,"currency");h(this,"_currentStep");h(this,"activeRef");h(this,"rdtCode");h(this,"url");h(this,"reference");h(this,"callBackUrl");h(this,"metadata");h(this,"localCurrency");h(this,"hidePaymentMethods");h(this,"showPaymentMethods");h(this,"onClose");h(this,"cardResponse");h(this,"cardResponseHeader");h(this,"confirmationEnd");h(this,"confirmationProgress");h(this,"restartTransactionProcess");h(this,"retryingPayment");h(this,"isMaxRetriesReached");h(this,"isMobile",!1);this.currency=d,this.onSuccess=f||(()=>null),this.container=t,this.encryption=s,this.token=l,this.customer=o,this.planId=a,this.amount=e,this.totalAmount=i,this.rdtCode=v,this.url=p,this.reference=g,this.callBackUrl=y,this.metadata=k,this.localCurrency=C,this._currentStep=1,this.activeRef="",this.contents=this.container.querySelector("#payment-content-view"),this.cardResponse={},this.cardResponseHeader={},this.hidePaymentMethods=S,this.showPaymentMethods=M,this.onClose=A,this.restartTransactionProcess=_,this.retryingPayment=T,this.isMaxRetriesReached=!1,this.renderCardContent(),P.track("card_opens",{payment_method:"Card"}),this.isMobile=window.matchMedia("(max-width: 767px)").matches}get currentStep(){return this._currentStep}set currentStep(e){this._currentStep=e,this.renderCardContent()}async submitCardDetails(e,i){e.preventDefault(),P.track("input_cardDetails",{payment_method:"Card",authentication_type:"PIN"});const t=this.container.querySelector(".spinner"),o=this.container.querySelector("#details-form-button-text"),s=await js(JSON.stringify(i),this.encryption);t&&o&&(t.classList.remove("hidden"),o.classList.add("hidden")),(()=>{var l;if(this.retryingPayment){const d={channel:"card",reference:this.reference,encryptedCard:s};return ci(this.token,d,this.rdtCode,this.url)}else{const d={amount:this.amount,channel:"card",currency:this.currency||"USD",planId:this.planId,customer:this.customer,reference:this.reference,encryptedCard:s,callBackUrl:this.callBackUrl,metadata:this.metadata,...this.localCurrency&&{localCurrency:this.localCurrency},isCheckout:!0,...((l=this.merchantPlanDetail)==null?void 0:l.taxQuoteId)&&{taxQuoteId:this.merchantPlanDetail.taxQuoteId}};return As(this.token,d,this.rdtCode,this.url)}})().then(({data:l,headers:d})=>{var v,p,g,f,y,k,C,S;if(l.status==="failed")this.currentStep=4,this.reference=l.reference,P.track("verify_payment",{payment_method:"Card",verification_status:"Failed",authentication_type:"PIN"}),this.cardResponse=l,this.cardResponseHeader=d,l.providerMessage?this.warningScreen.setPaymentError(l.providerMessage):this.warningScreen.setPaymentError("Payment failed"),this.warningScreen.hideReportIssue();else if(["success","successful"].includes(l.status))this.currentStep=5,this.cardResponse=l,this.cardResponseHeader=d,P.track("verify_payment",{payment_method:"Card",verification_status:"Success",authentication_type:"PIN"}),this.redirectTo(l,d,"success");else if(!["success","successful"].includes(l.status)&&l.status!=="failed")if(this.cardResponse=l,this.cardResponseHeader=d,l!=null&&l.authorization){if(this.activeRef=l.reference,((v=l==null?void 0:l.authorization)==null?void 0:v.mode)==="pin"){this.currentStep=2;return}if(((p=l==null?void 0:l.authorization)==null?void 0:p.mode)==="3DS"){(g=l==null?void 0:l.authorization)!=null&&g.redirectUrl&&this.redirectTo3DS((f=l==null?void 0:l.authorization)==null?void 0:f.redirectUrl),(y=l==null?void 0:l.authorization)!=null&&y.embeddedHtml&&this.redirectToPreciumDoc((k=l==null?void 0:l.authorization)==null?void 0:k.embeddedHtml);return}if(((C=l==null?void 0:l.authorization)==null?void 0:C.mode)==="otp"){this.cardResponse=l,this.currentStep=3;return}if(((S=l==null?void 0:l.authorization)==null?void 0:S.mode)==="avs"){this.currentStep=7;return}}else this.currentStep=4,l.providerMessage?this.warningScreen.setPaymentError(l.providerMessage):this.warningScreen.setPaymentError("Error with Payment"),this.warningScreen.hideReportIssue()}).catch(l=>{P.track("verify_payment",{payment_method:"Card",verification_status:"Null",authentication_type:"PIN"}),l.code==="payment_max_retry_attempts"?(this.isMaxRetriesReached=!0,this.verifyPaymentProcess(),this.currentStep=4,this.warningScreen.setPaymentError("Maximum retries","You have reached the maximum number of retries allowed. Go back to merchant website to start the payment process again.","Go back to Merchant")):(this.currentStep=4,l.message?this.warningScreen.setPaymentError(l.message):this.warningScreen.setPaymentError("Payment failed"),this.warningScreen.hideReportIssue())}).finally(()=>{t&&o&&(t.classList.add("hidden"),o.classList.remove("hidden"))})}handlePinRequest(e){if(e.length===4){const i={authorization:{pin:e},reference:this.activeRef};P.track("input_cardPin",{payment_method:"Card",authentication_type:"PIN"}),setTimeout(()=>{const t=this.container.querySelector("#pin-loader"),o=this.container.querySelector("#cancel-payment");t&&(t.innerHTML=`<svg class="animate-spin" width="40" height="40" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+            </svg>`},1e3))})})}renderComponent(){this.container.innerHTML=this.render(),this.attachListener()}}function Wr(n){n.classList.remove("hidden"),requestAnimationFrame(()=>{n.classList.remove("opacity-0","scale-95")})}function Ri(n){n.classList.add("opacity-0","scale-95"),n.addEventListener("transitionend",()=>n.classList.add("hidden"),{once:!0})}class $o{constructor({container:e,testCardContainer:i}){h(this,"container");h(this,"testCardContainer");h(this,"testCardInstance",null);this.container=e,this.testCardContainer=i}attachListener(){const e=this.container.querySelector("#test-cards-link");e&&e.addEventListener("click",()=>{this.testCardInstance||(this.testCardInstance=new Jo({container:this.testCardContainer,closeCallback:()=>{this.testCardContainer.innerHTML="",Ri(this.testCardContainer),e.classList.remove("text-tone-100","font-bold")}})),this.testCardInstance.renderComponent(),Wr(this.testCardContainer),e.classList.add("text-tone-100","font-bold")})}renderComponent(){this.container.innerHTML=this.render(),this.attachListener()}render(){return zr}}class Zr{constructor({amount:e,totalAmount:i,container:t,customer:o,encryption:s,planId:a,token:l,currency:d,rdtCode:v,url:p,reference:g,onSuccess:f,callBackUrl:y,metadata:k,localCurrency:C,hidePaymentMethods:S,showPaymentMethods:M,onClose:A,restartTransactionProcess:_,retryingPayment:T}){h(this,"contents");h(this,"cardDetailForm");h(this,"cardOtpValidationForm");h(this,"merchantPlanDetail",{});h(this,"cardPinForm");h(this,"avsForm");h(this,"successScreen");h(this,"pageLoader");h(this,"warningScreen");h(this,"transactionIssuesScreen");h(this,"container");h(this,"onSuccess");h(this,"planId","");h(this,"customer");h(this,"token");h(this,"amount");h(this,"totalAmount");h(this,"encryption");h(this,"currency");h(this,"_currentStep");h(this,"activeRef");h(this,"rdtCode");h(this,"url");h(this,"reference");h(this,"callBackUrl");h(this,"metadata");h(this,"localCurrency");h(this,"hidePaymentMethods");h(this,"showPaymentMethods");h(this,"onClose");h(this,"cardResponse");h(this,"cardResponseHeader");h(this,"confirmationEnd");h(this,"confirmationProgress");h(this,"restartTransactionProcess");h(this,"retryingPayment");h(this,"isMaxRetriesReached");h(this,"isMobile",!1);this.currency=d,this.onSuccess=f||(()=>null),this.container=t,this.encryption=s,this.token=l,this.customer=o,this.planId=a,this.amount=e,this.totalAmount=i,this.rdtCode=v,this.url=p,this.reference=g,this.callBackUrl=y,this.metadata=k,this.localCurrency=C,this._currentStep=1,this.activeRef="",this.contents=this.container.querySelector("#payment-content-view"),this.cardResponse={},this.cardResponseHeader={},this.hidePaymentMethods=S,this.showPaymentMethods=M,this.onClose=A,this.restartTransactionProcess=_,this.retryingPayment=T,this.isMaxRetriesReached=!1,this.renderCardContent(),P.track("card_opens",{payment_method:"Card"}),this.isMobile=window.matchMedia("(max-width: 767px)").matches}get currentStep(){return this._currentStep}set currentStep(e){this._currentStep=e,this.renderCardContent()}async submitCardDetails(e,i){e.preventDefault(),P.track("input_cardDetails",{payment_method:"Card",authentication_type:"PIN"});const t=this.container.querySelector(".spinner"),o=this.container.querySelector("#details-form-button-text"),s=await js(JSON.stringify(i),this.encryption);t&&o&&(t.classList.remove("hidden"),o.classList.add("hidden")),(()=>{var l;if(this.retryingPayment){const d={channel:"card",reference:this.reference,encryptedCard:s};return ci(this.token,d,this.rdtCode,this.url)}else{const d={amount:this.amount,channel:"card",currency:this.currency||"USD",planId:this.planId,customer:this.customer,reference:this.reference,encryptedCard:s,callBackUrl:this.callBackUrl,metadata:this.metadata,...this.localCurrency&&{localCurrency:this.localCurrency},isCheckout:!0,...((l=this.merchantPlanDetail)==null?void 0:l.taxQuoteId)&&{taxQuoteId:this.merchantPlanDetail.taxQuoteId}};return As(this.token,d,this.rdtCode,this.url)}})().then(({data:l,headers:d})=>{var v,p,g,f,y,k,C,S;if(l.status==="failed")this.currentStep=4,this.reference=l.reference,P.track("verify_payment",{payment_method:"Card",verification_status:"Failed",authentication_type:"PIN"}),this.cardResponse=l,this.cardResponseHeader=d,l.providerMessage?this.warningScreen.setPaymentError(l.providerMessage):this.warningScreen.setPaymentError("Payment failed"),this.warningScreen.hideReportIssue();else if(!["success","successful"].includes(l.status)&&l.status!=="failed")if(this.cardResponse=l,this.cardResponseHeader=d,l!=null&&l.authorization){if(this.activeRef=l.reference,((v=l==null?void 0:l.authorization)==null?void 0:v.mode)==="pin"){this.currentStep=2;return}if(((p=l==null?void 0:l.authorization)==null?void 0:p.mode)==="3DS"){(g=l==null?void 0:l.authorization)!=null&&g.redirectUrl&&this.redirectTo3DS((f=l==null?void 0:l.authorization)==null?void 0:f.redirectUrl),(y=l==null?void 0:l.authorization)!=null&&y.embeddedHtml&&this.redirectToPreciumDoc((k=l==null?void 0:l.authorization)==null?void 0:k.embeddedHtml);return}if(((C=l==null?void 0:l.authorization)==null?void 0:C.mode)==="otp"){this.cardResponse=l,this.currentStep=3;return}if(((S=l==null?void 0:l.authorization)==null?void 0:S.mode)==="avs"){this.currentStep=7;return}}else this.currentStep=4,l.providerMessage?this.warningScreen.setPaymentError(l.providerMessage):this.warningScreen.setPaymentError("Error with Payment"),this.warningScreen.hideReportIssue();else["success","successful"].includes(l.status)&&(this.currentStep=5,this.cardResponse=l,this.cardResponseHeader=d,P.track("verify_payment",{payment_method:"Card",verification_status:"Success",authentication_type:"PIN"}),this.redirectTo(l,d,"success"))}).catch(l=>{P.track("verify_payment",{payment_method:"Card",verification_status:"Null",authentication_type:"PIN"}),l.code==="payment_max_retry_attempts"?(this.isMaxRetriesReached=!0,this.verifyPaymentProcess(),this.currentStep=4,this.warningScreen.setPaymentError("Maximum retries","You have reached the maximum number of retries allowed. Go back to merchant website to start the payment process again.","Go back to Merchant")):(this.currentStep=4,l.message?this.warningScreen.setPaymentError(l.message):this.warningScreen.setPaymentError("Payment failed"),this.warningScreen.hideReportIssue())}).finally(()=>{t&&o&&(t.classList.add("hidden"),o.classList.remove("hidden"))})}handlePinRequest(e){if(e.length===4){const i={authorization:{pin:e},reference:this.activeRef};P.track("input_cardPin",{payment_method:"Card",authentication_type:"PIN"}),setTimeout(()=>{const t=this.container.querySelector("#pin-loader"),o=this.container.querySelector("#cancel-payment");t&&(t.innerHTML=`<svg class="animate-spin" width="40" height="40" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
     <path
       d="M62 32C62 38.6156 59.8132 45.0457 55.78 50.2897C51.7468 55.5336 46.0932 59.2974 39.6992 60.9952C33.3052 62.693 26.5293 62.2297 20.4258 59.6774C14.3224 57.1251 9.2338 52.6268 5.95186 46.8827C2.66993 41.1385 1.37873 34.4707 2.2792 27.9166C3.17967 21.3626 6.22129 15.29 10.9308 10.6438C15.6402 5.9976 21.7534 3.0384 28.3191 2.22668C34.8847 1.41496 41.5345 2.79623 47.2337 6.15557"
       stroke="black" stroke-width="4" stroke-linejoin="round" />

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@spot-flow/checkout-inline-js",
-  "version": "0.1.43-dev.2",
+  "version": "0.1.43",
   "description": "",
   "main": "dist/checkout-inline.js",
   "module": "dist/checkout-inline.es.js",