@spot-flow/checkout-inline-js 0.1.39 → 0.1.40

package/dist/checkout-inline.es.js

@@ -34865,7 +34865,7 @@ class su {
 const ou = `<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>
@@ -35529,7 +35529,7 @@ class cu {
       );
       En && v && Number(v.length) === d.value.length && P.track("input_phone_number", {
         payment_method: "Mobile Money",
-        phone_number: t.value,
+        // phone_number: phoneNumberInput.value,
         network: s.value
       });
     }), s.addEventListener("change", () => {
@@ -35541,16 +35541,16 @@ class cu {
       }
     })), i && i.classList.add("hidden"), !(!s || !t || !a) && e && e.addEventListener("submit", (l) => {
       l.preventDefault();
-      const d = this.countryCode || this.currency, v = En.filter(
-        (y) => y.name === d
-      )[0].allowsZeros ? `0${t.value}` : t.value, g = s.value, f = o ? o.value : "";
+      const d = this.localCurrency !== this.currency ? this.localCurrency : this.currency, p = this.countryCode || d, g = En.filter(
+        (k) => k.name === p
+      )[0].allowsZeros ? `0${t.value}` : t.value, f = s.value, y = o ? o.value : "";
       this.onAction(l)({
-        code: g,
+        code: f,
         // "mtn-gh",
-        phoneNumber: v,
+        phoneNumber: g,
         // "233987654321"
-        ...g === "orange" && {
-          otp: f
+        ...f === "orange" && {
+          otp: y
         }
       }), P.track("start_payment", {
         payment_method: "Mobile Money"
@@ -35580,7 +35580,7 @@ class cu {
         i.appendChild(d), i.classList.remove("text-tone-50"), i.classList.add("text-tone-100");
       });
     }
-    const t = this.container.querySelector("#region-code"), s = this.localCurrency ? this.localCurrency : this.currency, o = En.find(
+    const t = this.container.querySelector("#region-code"), s = this.localCurrency !== this.currency ? this.localCurrency : this.currency, o = En.find(
       (a) => a.name === (this.countryCode || s)
     );
     if (t) {

package/dist/checkout-inline.js

@@ -1500,7 +1500,7 @@ or you can use record.mirror to access the mirror instance during recording.`;le
               `;a+="</div>"}a+="</div>"}a+="</div>",i.innerHTML=a}}}render(){return ul}}const ml=`<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>
@@ -1935,7 +1935,7 @@ or you can use record.mirror to access the mirror instance during recording.`;le
     </p>
   </div>
 
-</form>`;class yl{constructor(e){h(this,"container");h(this,"payment");h(this,"warningError");h(this,"pageLoader");h(this,"localCurrency");h(this,"amount");h(this,"totalAmount");h(this,"onAction");h(this,"switchScreen");h(this,"merchantKey");h(this,"rdtCode");h(this,"url");h(this,"currency");h(this,"restartTransactionProcess");h(this,"merchantDetails");h(this,"countryCode");this.container=e.container,this.onAction=e.onAction,this.switchScreen=e.switchScreen,this.url=e.url,this.merchantKey=e.merchantKey,this.rdtCode=e.rdtCode,this.currency=e.currency,this.localCurrency=e.localCurrency,this.amount=e.amount,this.totalAmount=e.totalAmount,this.merchantDetails=e.merchantDetails,this.restartTransactionProcess=e.restartTransactionProcess,this.warningError=new gn({container:this.container,onAction:this.restartTransactionProcess.bind(this)}),this.countryCode=e.countryCode}validateForm(){const e=this.container.querySelector("#phone-number-input"),i=this.container.querySelector("#network-search-input"),t=this.container.querySelector("#otp-input"),o=this.container.querySelector(".details-form-button"),s=this.container.querySelector("#phone-number-container"),a=this.container.querySelector("#phone-number-error");if(!e||!i||!o)return;const l=this.localCurrency?this.localCurrency:this.currency,d=Pn.find(v=>v.name===(this.countryCode||l));e.value.length>Number((d==null?void 0:d.length)||"9")?(s&&(s.classList.remove("border-tone-40"),s.classList.add("border-[#D62020]"),e.classList.remove("text-tone-100"),e.classList.add("text-[#D62020]")),a&&(a.classList.remove("hidden"),a.classList.add("block"),a.innerHTML="Please enter a valid phone number. You can remove the leading zero if it exists.")):(s&&(s.classList.remove("border-[#D62020]"),s.classList.add("border-tone-40"),e.classList.remove("text-[#D62020]"),e.classList.add("text-tone-100")),a&&(a.classList.remove("block"),a.classList.add("hidden"))),e.value.length>0&&e.value.length===Number((d==null?void 0:d.length)||"9")&&i.value?i.value==="orange"?t&&t.value.length>=6?o.disabled=!1:o.disabled=!0:o.disabled=!1:o.disabled=!0}attachListener(){const e=document.querySelector("#mobile-money-form"),i=document.querySelector("#pci-dss"),t=this.container.querySelector("#phone-number-input"),o=this.container.querySelector("#network-search-input"),s=this.container.querySelector("#otp-input"),a=this.container.querySelector(".details-form-button");a&&(a.disabled=!0),t&&o&&(t.addEventListener("input",l=>{const d=l.target;d.value=d.value.replace(/\D/g,""),this.validateForm();const v=this.localCurrency?this.localCurrency:this.currency,p=Pn.find(g=>g.name===(this.countryCode||v));Pn&&p&&Number(p.length)===d.value.length&&P.track("input_phone_number",{payment_method:"Mobile Money",phone_number:t.value,network:o.value})}),o.addEventListener("change",()=>{if(this.validateForm(),o.value==="orange"){const l=this.container.querySelector("#otp-message"),d=this.container.querySelector("#otp-input-container");l&&l.classList.remove("hidden"),d&&d.classList.remove("hidden")}})),i&&i.classList.add("hidden"),!(!o||!t||!a)&&e&&e.addEventListener("submit",l=>{l.preventDefault();const d=this.countryCode||this.currency,p=Pn.filter(y=>y.name===d)[0].allowsZeros?`0${t.value}`:t.value,g=o.value,f=s?s.value:"";this.onAction(l)({code:g,phoneNumber:p,...g==="orange"&&{otp:f}}),P.track("start_payment",{payment_method:"Mobile Money"})})}displayButtonText(e){var t,o;const i=this.container.querySelector("#mobile-money-button-text");if(i){const s=this.localCurrency&&this.localCurrency!==this.currency?this.localCurrency:this.currency;i.textContent=`Continue to pay ${s} ${xe(this.totalAmount!==this.amount?this.totalAmount:this.amount*(this.currency==="USD"?(o=(t=this.merchantDetails)==null?void 0:t.rate)==null?void 0:o.rate:1),2)}`}}renderComponent(e){this.container.innerHTML=this.render();const i=this.container.querySelector("#network-search-input");if(i){const a=new Option("Select your network","",!0,!0);a.disabled=!0,i.appendChild(a),i.classList.remove("text-tone-100"),i.classList.add("text-tone-50"),i&&e.forEach(l=>{const d=new Option(l.name,l.code);i.appendChild(d),i.classList.remove("text-tone-50"),i.classList.add("text-tone-100")})}const t=this.container.querySelector("#region-code"),o=this.localCurrency?this.localCurrency:this.currency,s=Pn.find(a=>a.name===(this.countryCode||o));if(t){t.innerHTML=`
+</form>`;class yl{constructor(e){h(this,"container");h(this,"payment");h(this,"warningError");h(this,"pageLoader");h(this,"localCurrency");h(this,"amount");h(this,"totalAmount");h(this,"onAction");h(this,"switchScreen");h(this,"merchantKey");h(this,"rdtCode");h(this,"url");h(this,"currency");h(this,"restartTransactionProcess");h(this,"merchantDetails");h(this,"countryCode");this.container=e.container,this.onAction=e.onAction,this.switchScreen=e.switchScreen,this.url=e.url,this.merchantKey=e.merchantKey,this.rdtCode=e.rdtCode,this.currency=e.currency,this.localCurrency=e.localCurrency,this.amount=e.amount,this.totalAmount=e.totalAmount,this.merchantDetails=e.merchantDetails,this.restartTransactionProcess=e.restartTransactionProcess,this.warningError=new gn({container:this.container,onAction:this.restartTransactionProcess.bind(this)}),this.countryCode=e.countryCode}validateForm(){const e=this.container.querySelector("#phone-number-input"),i=this.container.querySelector("#network-search-input"),t=this.container.querySelector("#otp-input"),o=this.container.querySelector(".details-form-button"),s=this.container.querySelector("#phone-number-container"),a=this.container.querySelector("#phone-number-error");if(!e||!i||!o)return;const l=this.localCurrency?this.localCurrency:this.currency,d=Pn.find(v=>v.name===(this.countryCode||l));e.value.length>Number((d==null?void 0:d.length)||"9")?(s&&(s.classList.remove("border-tone-40"),s.classList.add("border-[#D62020]"),e.classList.remove("text-tone-100"),e.classList.add("text-[#D62020]")),a&&(a.classList.remove("hidden"),a.classList.add("block"),a.innerHTML="Please enter a valid phone number. You can remove the leading zero if it exists.")):(s&&(s.classList.remove("border-[#D62020]"),s.classList.add("border-tone-40"),e.classList.remove("text-[#D62020]"),e.classList.add("text-tone-100")),a&&(a.classList.remove("block"),a.classList.add("hidden"))),e.value.length>0&&e.value.length===Number((d==null?void 0:d.length)||"9")&&i.value?i.value==="orange"?t&&t.value.length>=6?o.disabled=!1:o.disabled=!0:o.disabled=!1:o.disabled=!0}attachListener(){const e=document.querySelector("#mobile-money-form"),i=document.querySelector("#pci-dss"),t=this.container.querySelector("#phone-number-input"),o=this.container.querySelector("#network-search-input"),s=this.container.querySelector("#otp-input"),a=this.container.querySelector(".details-form-button");a&&(a.disabled=!0),t&&o&&(t.addEventListener("input",l=>{const d=l.target;d.value=d.value.replace(/\D/g,""),this.validateForm();const v=this.localCurrency?this.localCurrency:this.currency,p=Pn.find(g=>g.name===(this.countryCode||v));Pn&&p&&Number(p.length)===d.value.length&&P.track("input_phone_number",{payment_method:"Mobile Money",network:o.value})}),o.addEventListener("change",()=>{if(this.validateForm(),o.value==="orange"){const l=this.container.querySelector("#otp-message"),d=this.container.querySelector("#otp-input-container");l&&l.classList.remove("hidden"),d&&d.classList.remove("hidden")}})),i&&i.classList.add("hidden"),!(!o||!t||!a)&&e&&e.addEventListener("submit",l=>{l.preventDefault();const d=this.localCurrency!==this.currency?this.localCurrency:this.currency,v=this.countryCode||d,g=Pn.filter(k=>k.name===v)[0].allowsZeros?`0${t.value}`:t.value,f=o.value,y=s?s.value:"";this.onAction(l)({code:f,phoneNumber:g,...f==="orange"&&{otp:y}}),P.track("start_payment",{payment_method:"Mobile Money"})})}displayButtonText(e){var t,o;const i=this.container.querySelector("#mobile-money-button-text");if(i){const s=this.localCurrency&&this.localCurrency!==this.currency?this.localCurrency:this.currency;i.textContent=`Continue to pay ${s} ${xe(this.totalAmount!==this.amount?this.totalAmount:this.amount*(this.currency==="USD"?(o=(t=this.merchantDetails)==null?void 0:t.rate)==null?void 0:o.rate:1),2)}`}}renderComponent(e){this.container.innerHTML=this.render();const i=this.container.querySelector("#network-search-input");if(i){const a=new Option("Select your network","",!0,!0);a.disabled=!0,i.appendChild(a),i.classList.remove("text-tone-100"),i.classList.add("text-tone-50"),i&&e.forEach(l=>{const d=new Option(l.name,l.code);i.appendChild(d),i.classList.remove("text-tone-50"),i.classList.add("text-tone-100")})}const t=this.container.querySelector("#region-code"),o=this.localCurrency!==this.currency?this.localCurrency:this.currency,s=Pn.find(a=>a.name===(this.countryCode||o));if(t){t.innerHTML=`
       ${s==null?void 0:s.icon}
       <span class="text-tone-100 text-sm font-semibold">${s==null?void 0:s.dialCode}</span>
       `;const a=t.querySelector("svg");a&&(a.setAttribute("width","20"),a.setAttribute("height","20"))}this.displayButtonText(),this.attachListener()}renderContent(){this.switchScreen(2),Ls(this.merchantKey,this.currency,this.rdtCode,this.url,this.localCurrency).then(e=>{this.renderComponent(e),P.track("providers_loaded",{payment_method:"Mobile Money",provider_count:e.length})}).catch(e=>{this.switchScreen(5),P.track("providers_failed",{payment_method:"Mobile Money",error:e.message||"Unknown error"}),e.message?this.warningError.setPaymentError(e.message):this.warningError.setPaymentError("Unable to fetch network providers at this time.")})}render(){return gl}}const Cl=`<div id="checkoutMobileOtp">

package/package.json

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