@fractalpay/fractalpay-next-dev 0.0.300 → 0.0.301

package/dist/index.js

@@ -39,7 +39,7 @@ var require_package = __commonJS({
   "package.json"(exports, module) {
     module.exports = {
       name: "@fractalpay/fractalpay-next-dev",
-      version: "0.0.300",
+      version: "0.0.301",
       private: false,
       type: "module",
       scripts: {
@@ -97,7 +97,12 @@ var require_package = __commonJS({
       },
       author: "Mukul",
       license: "MIT",
-      keywords: ["nextjs", "next", "typescript", "tailwindcss"],
+      keywords: [
+        "nextjs",
+        "next",
+        "typescript",
+        "tailwindcss"
+      ],
       publishConfig: {
         access: "public"
       }
@@ -254,8 +259,8 @@ var Loader_default = Loader;
 var { name } = require_package();
 var S3Url = "https://fractal-userdata-upload.s3.us-east-1.amazonaws.com/";
 if (name === "@fractalpay/fractalpay-next-dev") {
-  baseUrl = "http://localhost:8082/";
-  masterBaseUrl = "http://localhost:8081/";
+  masterBaseUrl = "https://api.dev.fractalpay.com/";
+  baseUrl = "https://widget.dev.fractalpay.com/";
   fractalGatewayUrl = "https://api-dev.merchant-trends.com/";
   datacapUrl = "https://token-cert.dcap.com/v1/client";
   threedsSecurePublicKey = "pk_test_51RH5Wc2SlJvyNZ80hpUDy88r4rVdpijfKbNaWaUyQEE6rOrPmG2JQyAj7G5amBD5z5daC56WaeT4jfNhrrPcGOEP00UyKu6AOw";
@@ -2867,25 +2872,25 @@ import Swal from "sweetalert2";
 import { useEffect as useEffect3 } from "react";
 function DataScript() {
   useEffect3(() => {
-    const src2 = datacapUrl;
+    const src = datacapUrl;
     if (typeof window === "undefined") return;
     if (window.DatacapWebToken) {
       return;
     }
-    if (!document.querySelector(`script[src="${src2}"]`)) {
-      const script2 = document.createElement("script");
-      script2.src = src2;
-      script2.async = true;
-      script2.onload = () => {
+    if (!document.querySelector(`script[src="${src}"]`)) {
+      const script = document.createElement("script");
+      script.src = src;
+      script.async = true;
+      script.onload = () => {
         if (window.DatacapWebToken) {
         } else {
           console.warn("\u26A0\uFE0F Script loaded, but DatacapWebToken not found");
         }
       };
-      script2.onerror = (err) => {
+      script.onerror = (err) => {
         console.error("\u274C Failed to load Datacap script", err);
       };
-      document.head.appendChild(script2);
+      document.head.appendChild(script);
     } else {
     }
   }, []);
@@ -3150,21 +3155,31 @@ function CardBankRadioStyles({}) {
 
 // src/app/components/FractalTokenizer.tsx
 import { useEffect as useEffect4 } from "react";
-function FractalTokenizerScript() {
+function FractalTokenizerScript({ onLoad }) {
   useEffect4(() => {
     const src = `${fractalGatewayUrl}tokenizer/static/js/fractal_tokenizer.js`;
-    if (document.querySelector(`script[src="${src}"]`)) return;
+    if (window.FractalTokenizer) {
+      onLoad == null ? void 0 : onLoad();
+      return;
+    }
+    const existing = document.querySelector(`script[src="${src}"]`);
+    if (existing) {
+      existing.addEventListener("load", () => onLoad == null ? void 0 : onLoad());
+      return;
+    }
     const script = document.createElement("script");
     script.src = src;
     script.async = true;
     script.onload = () => {
       try {
-        const TokenizerClass = eval("FractalTokenizer");
-        if (TokenizerClass) {
-          window.FractalTokenizer = TokenizerClass;
+        if (typeof FractalTokenizer !== "undefined") {
+          window.FractalTokenizer = FractalTokenizer;
+          onLoad == null ? void 0 : onLoad();
+        } else {
+          console.error("FractalTokenizer not defined in global scope");
         }
       } catch (err) {
-        console.error("FractalTokenizer not accessible:", err);
+        console.error(err);
       }
     };
     document.head.appendChild(script);
@@ -3323,30 +3338,62 @@ var FractalFields_default = FractalFields;
 
 // src/app/components/Datacap-Payment/DataCapScriptLoader.tsx
 import { useEffect as useEffect6 } from "react";
-var scriptLoaded = false;
-var DataCapScriptLoader = () => {
+var DataCapScriptLoader = ({
+  onReady,
+  onError
+}) => {
   useEffect6(() => {
-    if (scriptLoaded) {
+    const src = `${datacapUrl}/hosted`;
+    if (window.__DATACAP_SCRIPT_LOADED__ && window.DatacapHostedWebToken) {
+      onReady == null ? void 0 : onReady();
       return;
     }
+    if (window.__DATACAP_SCRIPT_LOADING__) {
+      const interval = setInterval(() => {
+        if (window.DatacapHostedWebToken) {
+          clearInterval(interval);
+          onReady == null ? void 0 : onReady();
+        }
+      }, 100);
+      return () => clearInterval(interval);
+    }
+    window.__DATACAP_SCRIPT_LOADING__ = true;
     const existingScript = document.querySelector(
-      `script[src="${datacapUrl}/hosted"]`
+      `script[src="${src}"]`
     );
-    console.log("\u{1F535} existingScript found:", !!existingScript);
-    if (!existingScript) {
-      const script2 = document.createElement("script");
-      script2.src = `${datacapUrl}/hosted`;
-      script2.async = true;
-      script2.onload = () => {
-        console.log("\u2705 DataCap script loaded successfully");
-        scriptLoaded = true;
-      };
-      script2.onerror = (err) => {
-        console.error("\u274C DataCap script failed to load", err);
-      };
-      document.head.appendChild(script2);
-    } else {
-      scriptLoaded = true;
+    if (existingScript) {
+      waitForSDK();
+      return;
+    }
+    const script = document.createElement("script");
+    script.src = src;
+    script.async = true;
+    script.onload = () => {
+      waitForSDK();
+    };
+    script.onerror = (err) => {
+      console.error("Datacap script failed");
+      window.__DATACAP_SCRIPT_LOADING__ = false;
+      onError == null ? void 0 : onError(err);
+    };
+    document.head.appendChild(script);
+    function waitForSDK() {
+      let attempts = 0;
+      const interval = setInterval(() => {
+        attempts++;
+        if (window.DatacapHostedWebToken) {
+          clearInterval(interval);
+          window.__DATACAP_SCRIPT_LOADING__ = false;
+          window.__DATACAP_SCRIPT_LOADED__ = true;
+          console.log("\u2705 Datacap SDK Ready");
+          onReady == null ? void 0 : onReady();
+        }
+        if (attempts > 100) {
+          clearInterval(interval);
+          window.__DATACAP_SCRIPT_LOADING__ = false;
+          onError == null ? void 0 : onError("SDK bootstrap timeout");
+        }
+      }, 100);
     }
   }, []);
   return null;
@@ -3355,7 +3402,7 @@ var DataCapScriptLoader = () => {
 // src/app/components/Datacap-Payment/DataCapFields.tsx
 import { useEffect as useEffect7, useRef as useRef2, useState as useState3 } from "react";
 import { jsx as jsx15 } from "react/jsx-runtime";
-var customCSS = `
+var baseCSS = `
     body { 
       margin: 0; 
       font-family: 'IBM Plex Mono', monospace !important; 
@@ -3434,6 +3481,8 @@ var customCSS = `
     }
 
   `;
+var datacapInitializing = false;
+var datacapInitialized = false;
 var DataCapFields = ({
   isOpen,
   tokenKey,
@@ -3446,6 +3495,7 @@ var DataCapFields = ({
   const iframeId = "datacap-iframe";
   const resolverRef = useRef2(null);
   const [iframeReady, setIframeReady] = useState3(false);
+  let customCSS = baseCSS;
   useEffect7(() => {
     if (!isOpen || !tokenKey) return;
     if (isAddCard) {
@@ -3490,11 +3540,13 @@ var DataCapFields = ({
       const waitForSDK = () => new Promise((resolve, reject) => {
         let attempts = 0;
         const interval = setInterval(() => {
+          attempts++;
           if (window.DatacapHostedWebToken) {
             clearInterval(interval);
+            console.log("\u2705 Datacap SDK Ready");
             resolve();
           }
-          if (attempts++ > 50) {
+          if (attempts > 100) {
             clearInterval(interval);
             reject("Datacap SDK not loaded");
           }
@@ -3502,10 +3554,28 @@ var DataCapFields = ({
       });
       await waitForSDK();
       const sdk = window.DatacapHostedWebToken;
+      if (datacapInitializing || datacapInitialized) {
+        console.log("\u{1F7E1} Datacap already initializing/initialized");
+        return;
+      }
+      datacapInitializing = true;
+      const initTimeout = setTimeout(() => {
+        var _a, _b;
+        console.error("\u274C Datacap iframe load timeout");
+        datacapInitializing = false;
+        setLoader == null ? void 0 : setLoader(false);
+        (_b = (_a = resolverRef.current) == null ? void 0 : _a.reject) == null ? void 0 : _b.call(
+          _a,
+          "Unable to load payment form"
+        );
+      }, 15e3);
       sdk.init(
         tokenKey,
         iframeId,
         (response) => {
+          clearTimeout(initTimeout);
+          datacapInitializing = false;
+          datacapInitialized = true;
           setLoader == null ? void 0 : setLoader(false);
           if (!resolverRef.current) return;
           if ((response == null ? void 0 : response.Error) || (response == null ? void 0 : response.Errors)) {
@@ -3519,6 +3589,9 @@ var DataCapFields = ({
       );
     };
     initialize();
+    return () => {
+      resolverRef.current = null;
+    };
   }, [isOpen, tokenKey]);
   useEffect7(() => {
     const uniqueId = Math.random();
@@ -3526,7 +3599,15 @@ var DataCapFields = ({
       return new Promise((resolve, reject) => {
         setLoader == null ? void 0 : setLoader(true);
         resolverRef.current = { resolve, reject };
-        window.DatacapHostedWebToken.requestToken();
+        if (!window.DatacapHostedWebToken) {
+          reject("Datacap SDK unavailable");
+          return;
+        }
+        try {
+          window.DatacapHostedWebToken.requestToken();
+        } catch (err) {
+          reject(err);
+        }
       });
     };
     window.requestDcToken = fn;
@@ -3534,23 +3615,55 @@ var DataCapFields = ({
       delete window.requestDcToken;
     };
   }, []);
-  return /* @__PURE__ */ jsx15(
-    "iframe",
-    {
-      id: iframeId,
-      onLoad: () => {
-        console.log("\u{1F7E2} Iframe visually loaded");
-        setIframeReady(true);
-        setLoader == null ? void 0 : setLoader(false);
-      },
-      style: {
-        width: "100%",
-        height: `${height || "250px"}`,
-        border: "none",
-        opacity: iframeReady ? 1 : 0,
-        transition: "opacity 0.3s ease"
+  useEffect7(() => {
+    if (!isOpen) {
+      datacapInitializing = false;
+      datacapInitialized = false;
+    }
+  }, [isOpen]);
+  return (
+    // <iframe
+    //   id={iframeId}
+    //   onLoad={() => {
+    //     console.log("🟢 Iframe visually loaded");
+    //     setIframeReady(true);
+    //     setLoader?.(false);
+    //   }}
+    //   style={{
+    //     width: "100%",
+    //     height: `${height || "250px"}`,
+    //     border: "none",
+    //     opacity: iframeReady ? 1 : 0,
+    //     transition: "opacity 0.3s ease",
+    //   }}
+    // />
+    /* @__PURE__ */ jsx15(
+      "iframe",
+      {
+        id: iframeId,
+        onLoad: () => {
+          console.log("\u{1F7E2} Iframe visually loaded");
+          setIframeReady(true);
+          setLoader == null ? void 0 : setLoader(false);
+        },
+        onError: () => {
+          var _a, _b;
+          console.error("\u274C iframe failed");
+          setLoader == null ? void 0 : setLoader(false);
+          (_b = (_a = resolverRef.current) == null ? void 0 : _a.reject) == null ? void 0 : _b.call(
+            _a,
+            "Payment form failed to load"
+          );
+        },
+        style: {
+          width: "100%",
+          height: `${height || "250px"}`,
+          border: "none",
+          opacity: iframeReady ? 1 : 0,
+          transition: "opacity 0.3s ease"
+        }
       }
-    }
+    )
   );
 };
 
@@ -4124,6 +4237,19 @@ function FractalCheckbox({ id, checked, onChange, children }) {
   ] });
 }
 
+// src/app/utils/Constant.js
+var PaymentMethodKeys = {
+  PROPAYKEY: "25",
+  PAYARCKEY: "26",
+  STRIPEKEYCC: "27",
+  PAYRIXKEY: "28",
+  SKYFIACHKEY: "29",
+  JUSTIFIKEY: "30",
+  INFINICEPTKEY: "31",
+  FRACTALKEY: "32"
+};
+var DcLoadingError = "Something went wrong while loading the payment form. Please try again after some time.";
+
 // src/app/components/Charge/GetPaymentPage.tsx
 import { Fragment as Fragment9, jsx as jsx18, jsxs as jsxs9 } from "react/jsx-runtime";
 function GetPaymentPage(props) {
@@ -4147,6 +4273,7 @@ function GetPaymentPage(props) {
   const [saveACHConsent1, setSaveACHConsent1] = useState4(false);
   const [errorBankConsentOther, setErrorBankConsentOther] = useState4("");
   const [loaderText, setLoderText] = useState4("");
+  const [isTokenizerReady, setTokenizerReady] = useState4(false);
   const fractalpayClientKey = props.merchantPublicKey;
   const isPreAuth = !!props.isPreAuth;
   const showButton = props.showButton !== false;
@@ -4698,6 +4825,7 @@ function GetPaymentPage(props) {
                   } catch (err) {
                     setErrorIframe(((_h2 = (_g2 = err == null ? void 0 : err.response) == null ? void 0 : _g2.data) == null ? void 0 : _h2.message) || (err == null ? void 0 : err.message) || "Something went wrong.");
                     setLoading2(false);
+                    return;
                   }
                   const card_issue_type = ((_i2 = tokenizeData == null ? void 0 : tokenizeData.bin_lookup_result) == null ? void 0 : _i2.card_issue_type) || null;
                   const feeExempt = ["debit", "prepaid"].includes(String(card_issue_type || "").toLowerCase());
@@ -5193,8 +5321,20 @@ function GetPaymentPage(props) {
   ] });
   return /* @__PURE__ */ jsxs9(Fragment9, { children: [
     /* @__PURE__ */ jsx18(DataScript, {}),
-    /* @__PURE__ */ jsx18(FractalTokenizerScript, {}),
-    /* @__PURE__ */ jsx18(DataCapScriptLoader, {}),
+    (paymentData == null ? void 0 : paymentData.paymentGateway) === 32 && /* @__PURE__ */ jsx18(FractalTokenizerScript, { onLoad: () => setTokenizerReady(true) }),
+    (paymentData == null ? void 0 : paymentData.paymentGateway) === 31 && /* @__PURE__ */ jsx18(
+      DataCapScriptLoader,
+      {
+        onReady: () => {
+          console.log("SDK Ready");
+        },
+        onError: (err) => {
+          setLoading(false);
+          setLoadingIframe(false);
+          setError(DcLoadingError);
+        }
+      }
+    ),
     /* @__PURE__ */ jsx18(Chargewidgetstyles, {}),
     /* @__PURE__ */ jsx18(CardBankRadioStyles, {}),
     /* @__PURE__ */ jsx18(FractalWidgetStyles, {}),
@@ -5387,7 +5527,7 @@ function GetPaymentPage(props) {
                                 }
                               }
                             ) }),
-                            /* @__PURE__ */ jsx18(FractalField, { label: (paymentData == null ? void 0 : paymentData.paymentGateway) === 32 ? "Card number" : "", error: cardError == null ? void 0 : cardError.cardNumber, children: /* @__PURE__ */ jsx18("div", { className: `fps-tokenizer ${(paymentData == null ? void 0 : paymentData.paymentGateway) !== 32 ? "dc-tokenizer" : ""}`, children: (paymentData == null ? void 0 : paymentData.paymentGateway) === 32 ? show && /* @__PURE__ */ jsx18(
+                            /* @__PURE__ */ jsx18(FractalField, { label: (paymentData == null ? void 0 : paymentData.paymentGateway) === 32 ? "Card number" : "", error: cardError == null ? void 0 : cardError.cardNumber, children: /* @__PURE__ */ jsx18("div", { className: `fps-tokenizer ${(paymentData == null ? void 0 : paymentData.paymentGateway) !== 32 ? "dc-tokenizer" : ""}`, children: (paymentData == null ? void 0 : paymentData.paymentGateway) === 32 ? show && isTokenizerReady && /* @__PURE__ */ jsx18(
                               FractalFields_default,
                               {
                                 fractalStyles,
@@ -5853,6 +5993,7 @@ function AddCardEasyPay(props) {
   const exp_year_ref = useRef4(null);
   const cvv_ref = useRef4(null);
   const name_ref = useRef4(null);
+  const [isTokenizerReady, setTokenizerReady] = useState5(false);
   const tokenizerRef = useRef4(null);
   const fractalStyles = {
     input: {
@@ -6125,8 +6266,20 @@ function AddCardEasyPay(props) {
   }, []);
   return /* @__PURE__ */ jsxs11(Fragment11, { children: [
     /* @__PURE__ */ jsx23(DataScript, {}),
-    /* @__PURE__ */ jsx23(FractalTokenizerScript, {}),
-    /* @__PURE__ */ jsx23(DataCapScriptLoader, {}),
+    (paymentData == null ? void 0 : paymentData.paymentGateway) === 32 && /* @__PURE__ */ jsx23(FractalTokenizerScript, { onLoad: () => setTokenizerReady(true) }),
+    (paymentData == null ? void 0 : paymentData.paymentGateway) === 31 && /* @__PURE__ */ jsx23(
+      DataCapScriptLoader,
+      {
+        onReady: () => {
+          console.log("SDK Ready");
+        },
+        onError: (err) => {
+          setLoading(false);
+          setLoadingIframe(false);
+          setError(DcLoadingError);
+        }
+      }
+    ),
     /* @__PURE__ */ jsx23(AddCardStyle, {}),
     /* @__PURE__ */ jsx23(Loader_default, { loading: loading || loadingIframe }),
     error && /* @__PURE__ */ jsx23("div", { style: { maxHeight: "606px", minHeight: "60vh", padding: "40px" }, children: /* @__PURE__ */ jsx23(ErrorCardMessage_default, { error, onClose: handleClose }) }),
@@ -6155,7 +6308,7 @@ function AddCardEasyPay(props) {
               /* @__PURE__ */ jsxs11("div", { style: { maxHeight: "350px", minHeight: "0" }, className: "card-scrl", children: [
                 /* @__PURE__ */ jsxs11("div", { className: "form-group", style: { marginTop: "0", marginBottom: "10px" }, children: [
                   /* @__PURE__ */ jsx23("label", { htmlFor: "cardNumber", children: "Card Number" }),
-                  (paymentData == null ? void 0 : paymentData.paymentGateway) === 32 && /* @__PURE__ */ jsx23(
+                  (paymentData == null ? void 0 : paymentData.paymentGateway) === 32 && isTokenizerReady && /* @__PURE__ */ jsx23(
                     FractalFields_default,
                     {
                       fractalStyles,
@@ -6290,18 +6443,6 @@ function AddCardEasyPay(props) {
 import { useEffect as useEffect11, useRef as useRef6, useState as useState6 } from "react";
 import axios5 from "axios";
 
-// src/app/utils/Constant.js
-var PaymentMethodKeys = {
-  PROPAYKEY: "25",
-  PAYARCKEY: "26",
-  STRIPEKEYCC: "27",
-  PAYRIXKEY: "28",
-  SKYFIACHKEY: "29",
-  JUSTIFIKEY: "30",
-  INFINICEPTKEY: "31",
-  FRACTALKEY: "32"
-};
-
 // src/app/components/AddCard/AddCardSkyStyle.tsx
 import { jsx as jsx24 } from "react/jsx-runtime";
 function AddCardSkyStyle({}) {
@@ -6509,8 +6650,12 @@ import { Fragment as Fragment12, jsx as jsx25, jsxs as jsxs12 } from "react/jsx-
 var FractalFieldsAddCardSky = ({ fractalStyles, tokenizerRef, extraInputs }) => {
   const instanceRef = useRef5(null);
   useEffect10(() => {
-    if (!window.FractalTokenizer) return;
-    const instance = new window.FractalTokenizer({
+    const Tokenizer = window.FractalTokenizer;
+    if (!Tokenizer) {
+      console.error("Tokenizer not available");
+      return;
+    }
+    const instance = new Tokenizer({
       styles: fractalStyles
     });
     instanceRef.current = instance;
@@ -6595,7 +6740,7 @@ var FractalFieldsAddCardSky_default = FractalFieldsAddCardSky;
 
 // src/app/components/AddCard/AddCardSky.tsx
 import { Fragment as Fragment13, jsx as jsx26, jsxs as jsxs13 } from "react/jsx-runtime";
-function CardOnFile({ session_token, callback, isloading, onCancel, showChecks, merchantName, signCheckbox, checkedSignCheckbox, onCheckSign, cancelbtnClass, savebtnClass, inputClass, isDual, customCSS: customCSS2, height }) {
+function CardOnFile({ session_token, callback, isloading, onCancel, showChecks, merchantName, signCheckbox, checkedSignCheckbox, onCheckSign, cancelbtnClass, savebtnClass, inputClass, isDual, customCSS, height }) {
   var _a, _b;
   const [loading, setLoading] = useState6(false);
   const [errorIframe, setErrorIframe] = useState6("");
@@ -6606,10 +6751,11 @@ function CardOnFile({ session_token, callback, isloading, onCancel, showChecks,
   const [error, setError] = useState6("");
   const showLoader = () => setLoading(true);
   const hideLoader = () => setLoading(false);
-  const [passFee, setPassFee] = useState6(false);
+  const [passFee, setPassFee] = useState6(null);
   const [paymentGateway, setPaymentGateway] = useState6();
   const [dcToken, setDCToken] = useState6();
   const tokenizerRef = useRef6(null);
+  const [isTokenizerReady, setTokenizerReady] = useState6(false);
   const fractalStyles = {
     input: {
       "font-family": "'Inter', sans-serif",
@@ -6872,8 +7018,20 @@ function CardOnFile({ session_token, callback, isloading, onCancel, showChecks,
   }, []);
   return /* @__PURE__ */ jsxs13(Fragment13, { children: [
     /* @__PURE__ */ jsx26(DataScript, {}),
-    /* @__PURE__ */ jsx26(FractalTokenizerScript, {}),
-    /* @__PURE__ */ jsx26(DataCapScriptLoader, {}),
+    paymentGateway == 32 && /* @__PURE__ */ jsx26(FractalTokenizerScript, { onLoad: () => setTokenizerReady(true) }),
+    paymentGateway == 31 && /* @__PURE__ */ jsx26(
+      DataCapScriptLoader,
+      {
+        onReady: () => {
+          console.log("SDK Ready");
+        },
+        onError: (err) => {
+          setLoading(false);
+          setLoadingIframe(false);
+          setError(DcLoadingError);
+        }
+      }
+    ),
     /* @__PURE__ */ jsx26(AddCardSkyStyle, {}),
     /* @__PURE__ */ jsx26(Loader_default, { loading: loading || isloading || loadingIframe }),
     error && /* @__PURE__ */ jsx26("div", { style: { maxHeight: "606px", minHeight: "60vh", padding: "40px" }, children: /* @__PURE__ */ jsx26(ErrorCardMessage_default, { error, onClose: handleClose }) }),
@@ -6934,7 +7092,7 @@ function CardOnFile({ session_token, callback, isloading, onCancel, showChecks,
           (cardError == null ? void 0 : cardError.lastName) && /* @__PURE__ */ jsx26("small", { className: "error", children: cardError == null ? void 0 : cardError.lastName })
         ] })
       ] }),
-      /* @__PURE__ */ jsx26(
+      isTokenizerReady && /* @__PURE__ */ jsx26(
         FractalFieldsAddCardSky_default,
         {
           fractalStyles,
@@ -6966,7 +7124,7 @@ function CardOnFile({ session_token, callback, isloading, onCancel, showChecks,
             type: "checkbox",
             id: "pass_fee",
             className: "toggle-checkbox",
-            checked: passFee,
+            checked: passFee != null ? passFee : false,
             onChange: (e) => {
               setPassFee(e.target.checked);
             }
@@ -7109,7 +7267,7 @@ function CardOnFile({ session_token, callback, isloading, onCancel, showChecks,
           isOpen: true,
           tokenKey: dcToken,
           setLoader: setLoadingIframe,
-          customCSS: customCSS2,
+          customCSS,
           height
         }
       ) }),
@@ -7138,7 +7296,7 @@ function CardOnFile({ session_token, callback, isloading, onCancel, showChecks,
             type: "checkbox",
             id: "pass_fee",
             className: "toggle-checkbox",
-            checked: passFee,
+            checked: passFee != null ? passFee : false,
             onChange: (e) => {
               setPassFee(e.target.checked);
             }
@@ -7377,6 +7535,7 @@ function PartialPayment(props) {
   const [errorBankConsentOther, setErrorBankConsentOther] = useState7("");
   const [loaderText, setLoderText] = useState7("");
   let [isDebitAdjusted, setIsDebitAdjusted] = useState7(false);
+  const [isTokenizerReady, setTokenizerReady] = useState7(false);
   const tokenizerRef = useRef7(null);
   const fractalStyles = {
     input: {
@@ -8101,8 +8260,20 @@ function PartialPayment(props) {
     /* @__PURE__ */ jsx29(DataScript, {}),
     /* @__PURE__ */ jsx29(Chargewidgetstyles, {}),
     /* @__PURE__ */ jsx29(CardBankRadioStyles, {}),
-    /* @__PURE__ */ jsx29(FractalTokenizerScript, {}),
-    /* @__PURE__ */ jsx29(DataCapScriptLoader, {}),
+    (paymentData == null ? void 0 : paymentData.paymentGateway) === 32 && /* @__PURE__ */ jsx29(FractalTokenizerScript, { onLoad: () => setTokenizerReady(true) }),
+    (paymentData == null ? void 0 : paymentData.paymentGateway) === 31 && /* @__PURE__ */ jsx29(
+      DataCapScriptLoader,
+      {
+        onReady: () => {
+          console.log("SDK Ready");
+        },
+        onError: (err) => {
+          setLoading(false);
+          setLoadingIframe(false);
+          setError(DcLoadingError);
+        }
+      }
+    ),
     /* @__PURE__ */ jsxs16(Fragment16, { children: [
       /* @__PURE__ */ jsx29("button", { ref: buttonRef, style: { display: "none" }, className: "paymentBtn", onClick: handleShow, children: "Pay" }),
       /* @__PURE__ */ jsxs16(
@@ -8318,7 +8489,7 @@ function PartialPayment(props) {
                               ] }),
                               /* @__PURE__ */ jsxs16("div", { className: "form-group", children: [
                                 /* @__PURE__ */ jsx29("label", { children: "CARD NUMBER" }),
-                                /* @__PURE__ */ jsx29("div", { className: "toggle-num-wrapper", children: show && (paymentData == null ? void 0 : paymentData.paymentGateway) === 32 && /* @__PURE__ */ jsx29(
+                                /* @__PURE__ */ jsx29("div", { className: "toggle-num-wrapper", children: show && (paymentData == null ? void 0 : paymentData.paymentGateway) === 32 && isTokenizerReady && /* @__PURE__ */ jsx29(
                                   FractalFields_default,
                                   {
                                     fractalStyles,
@@ -8626,7 +8797,7 @@ function PartialPayment(props) {
 }
 
 // src/app/components/Skysystemz/PayButtonWithForm.tsx
-import { useEffect as useEffect18, useState as useState11, useMemo } from "react";
+import { useEffect as useEffect16, useState as useState10, useMemo } from "react";
 
 // src/app/components/Skysystemz/SkyChargewidgetstyles.tsx
 import { jsx as jsx30 } from "react/jsx-runtime";
@@ -9472,7 +9643,7 @@ padding:0px !important;
 }
 
 // src/app/components/Atoms/ModelContentSky/ModelContentSky.tsx
-import { useCallback, useEffect as useEffect17, useRef as useRef11, useState as useState10 } from "react";
+import { useCallback, useEffect as useEffect15, useRef as useRef10, useState as useState9 } from "react";
 import axios8 from "axios";
 import Swal4 from "sweetalert2";
 
@@ -9758,200 +9929,9 @@ var ErrorCardOverlay = ({ onClose, error, autoTrigger = false }) => {
 };
 var ErrorCardOverlay_default = ErrorCardOverlay;
 
-// src/app/components/Atoms/Googlepay/Googlepay.tsx
-import { useRef as useRef9 } from "react";
-
-// src/app/components/Atoms/Googlepay/GooglePayScriptLoader.tsx
-import { useEffect as useEffect14 } from "react";
-var googlePayScriptLoaded = false;
-var GooglePayScriptLoader = ({
-  onLoad
-}) => {
-  useEffect14(() => {
-    if (googlePayScriptLoaded) {
-      onLoad == null ? void 0 : onLoad();
-      return;
-    }
-    const existingScript = document.querySelector(
-      `script[src="https://pay.google.com/gp/p/js/pay.js"]`
-    );
-    if (!existingScript) {
-      const script2 = document.createElement("script");
-      script2.src = "https://pay.google.com/gp/p/js/pay.js";
-      script2.async = true;
-      script2.onload = () => {
-        console.log("\u2705 Google Pay script loaded");
-        googlePayScriptLoaded = true;
-        console.log("google:", window.google);
-        onLoad == null ? void 0 : onLoad();
-      };
-      script2.onerror = (err) => {
-        console.error("\u274C Google Pay script failed", err);
-      };
-      document.head.appendChild(script2);
-    } else {
-      googlePayScriptLoaded = true;
-      onLoad == null ? void 0 : onLoad();
-    }
-  }, []);
-  return null;
-};
-
-// src/app/components/Atoms/Googlepay/Googlepay.tsx
-import { Fragment as Fragment18, jsx as jsx35, jsxs as jsxs19 } from "react/jsx-runtime";
-function GooglePayComponent({
-  amount,
-  googlePayEnvironment: googlePayEnvironment2,
-  googlePayGatewayMerchantId: googlePayGatewayMerchantId2,
-  googlePayMerchantId: googlePayMerchantId2,
-  googlePayMerchantName,
-  require3ds = false,
-  completeFractalFlow,
-  setLoading
-}) {
-  const containerRef = useRef9(null);
-  const paymentsClientRef = useRef9(null);
-  const baseRequest = {
-    apiVersion: 2,
-    apiVersionMinor: 0
-  };
-  const allowedCardNetworks = ["AMEX", "DISCOVER", "MASTERCARD", "VISA"];
-  const allowedCardAuthMethods = require3ds ? ["CRYPTOGRAM_3DS"] : ["PAN_ONLY", "CRYPTOGRAM_3DS"];
-  const baseCardPaymentMethod = {
-    type: "CARD",
-    parameters: {
-      allowedAuthMethods: allowedCardAuthMethods,
-      allowedCardNetworks
-    }
-  };
-  const cardPaymentMethod = __spreadProps(__spreadValues({}, baseCardPaymentMethod), {
-    tokenizationSpecification: {
-      type: "PAYMENT_GATEWAY",
-      parameters: {
-        gateway: googlePayGatewayMerchantId2,
-        gatewayMerchantId: googlePayGatewayMerchantId2
-      }
-    }
-  });
-  const handlePaymentAuthorization = async (paymentData) => {
-    var _a, _b;
-    try {
-      const token = (_b = (_a = paymentData == null ? void 0 : paymentData.paymentMethodData) == null ? void 0 : _a.tokenizationData) == null ? void 0 : _b.token;
-      if (!token) throw new Error("Missing token");
-      const parsed = JSON.parse(token);
-      console.log(parsed, "parsed token");
-      setLoading(true);
-      completeFractalFlow(parsed, null, "google_pay");
-      return {
-        transactionState: "SUCCESS"
-        // ✅ CLOSES GOOGLE PAY POPUP
-      };
-    } catch (err) {
-      console.error("Payment failed:", err);
-      return {
-        transactionState: "ERROR",
-        // ❌ CLOSES WITH ERROR UI
-        error: {
-          intent: "PAYMENT_AUTHORIZATION",
-          message: "Payment failed",
-          reason: "PAYMENT_DATA_INVALID"
-        }
-      };
-    }
-  };
-  const getPaymentsClient = () => {
-    if (!paymentsClientRef.current && typeof window !== "undefined") {
-      const google = window.google;
-      if (!google) return null;
-      paymentsClientRef.current = new google.payments.api.PaymentsClient({
-        environment: googlePayEnvironment2,
-        // ✅ ADD THIS
-        paymentDataCallbacks: {
-          onPaymentAuthorized: handlePaymentAuthorization
-        }
-      });
-    }
-    return paymentsClientRef.current;
-  };
-  const getIsReadyToPayRequest = () => __spreadProps(__spreadValues({}, baseRequest), {
-    allowedPaymentMethods: [baseCardPaymentMethod]
-  });
-  const getTransactionInfo = () => ({
-    countryCode: "US",
-    currencyCode: "USD",
-    totalPriceStatus: "FINAL",
-    totalPrice: amount,
-    checkoutOption: "COMPLETE_IMMEDIATE_PURCHASE"
-  });
-  const getPaymentDataRequest = () => __spreadProps(__spreadValues({}, baseRequest), {
-    allowedPaymentMethods: [cardPaymentMethod],
-    transactionInfo: getTransactionInfo(),
-    merchantInfo: {
-      merchantId: googlePayMerchantId2,
-      merchantName: googlePayMerchantName
-    },
-    // ✅ ADD THIS
-    callbackIntents: ["PAYMENT_AUTHORIZATION"]
-  });
-  const initializeGooglePay = async () => {
-    try {
-      const client = getPaymentsClient();
-      if (!client) {
-        console.error("Google Pay client not ready");
-        return;
-      }
-      const response = await client.isReadyToPay(
-        getIsReadyToPayRequest()
-      );
-      if (response.result && containerRef.current) {
-        const button = client.createButton({
-          onClick: onGooglePayClick,
-          allowedPaymentMethods: [baseCardPaymentMethod],
-          buttonType: "pay",
-          buttonColor: "black",
-          buttonRadius: 8
-        });
-        if (containerRef.current) {
-          containerRef.current.innerHTML = "";
-        }
-        containerRef.current.appendChild(button);
-      }
-    } catch (err) {
-      console.error("Google Pay init error:", err);
-    }
-  };
-  const onGooglePayClick = async () => {
-    const client = getPaymentsClient();
-    if (!client) {
-      console.error("Google Pay client not ready");
-      return;
-    }
-    try {
-      await client.loadPaymentData(getPaymentDataRequest());
-    } catch (err) {
-      if ((err == null ? void 0 : err.statusCode) !== "CANCELED") {
-        console.error(err);
-      }
-    }
-  };
-  const onScriptLoad = () => {
-    if (!googlePayEnvironment2 || !googlePayGatewayMerchantId2 || !amount || !googlePayMerchantId2) {
-      console.error("Missing Google Pay config");
-      return;
-    }
-    setTimeout(() => {
-      initializeGooglePay();
-    }, 0);
-  };
-  return /* @__PURE__ */ jsxs19(Fragment18, { children: [
-    /* @__PURE__ */ jsx35("div", { ref: containerRef, className: "text-center" }),
-    /* @__PURE__ */ jsx35(GooglePayScriptLoader, { onLoad: onScriptLoad })
-  ] });
-}
-
 // src/app/components/Atoms/Applepay/ApplePayButton.tsx
-import { useEffect as useEffect16, useRef as useRef10 } from "react";
-import { jsx as jsx36 } from "react/jsx-runtime";
+import { useEffect as useEffect14, useRef as useRef9 } from "react";
+import { jsx as jsx35 } from "react/jsx-runtime";
 function ApplePayButton({
   applePayMerchantId: applePayMerchantId2,
   applePayAmount,
@@ -9959,7 +9939,7 @@ function ApplePayButton({
   showLoader,
   completeFractalFlow
 }) {
-  const applePayRef = useRef10(null);
+  const applePayRef = useRef9(null);
   const paymentRequestMethods = [
     {
       supportedMethods: "https://apple.com/apple-pay",
@@ -10061,21 +10041,21 @@ function ApplePayButton({
       console.log("\u274C Apple Pay flow failed:", err == null ? void 0 : err.message);
     }
   }
-  useEffect16(() => {
+  useEffect14(() => {
     if (window.ApplePaySession && window.ApplePaySession.canMakePayments()) {
       console.log("\u2705 Apple Pay is available");
     } else {
       console.log("\u274C Apple Pay NOT available");
     }
   }, []);
-  useEffect16(() => {
+  useEffect14(() => {
     const btn = applePayRef.current;
     if (!btn) return;
     const handleClick = () => handleApplePayClick();
     btn.addEventListener("click", handleClick);
     return () => btn.removeEventListener("click", handleClick);
   }, [applePayMerchantId2, applePayAmount, applePayMerchantName]);
-  return /* @__PURE__ */ jsx36("div", { children: /* @__PURE__ */ jsx36(
+  return /* @__PURE__ */ jsx35("div", { children: /* @__PURE__ */ jsx35(
     "apple-pay-button",
     {
       ref: applePayRef,
@@ -10088,55 +10068,56 @@ function ApplePayButton({
 }
 
 // src/app/components/Atoms/ModelContentSky/ModelContentSky.tsx
-import { Fragment as Fragment19, jsx as jsx37, jsxs as jsxs20 } from "react/jsx-runtime";
-var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_token, customerId, callback, merchantName = "merchant", isPreAuth, surcharge = "0", submitBtnClass, submitBtnIcon, isRequest, pass_fee, pass_fee_amount, require3ds = false, autoTrigger = false, show, setShow, setHandleCloseRef, isPartial, bankSurcharge, partialRef, loadingPrev = false, orderGuid: ordGuid, remainingAmount: remAmount, onSubmit, onLoad = true, customCSS: customCSS2 }) => {
+import { Fragment as Fragment18, jsx as jsx36, jsxs as jsxs19 } from "react/jsx-runtime";
+var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_token, customerId, callback, merchantName = "merchant", isPreAuth, surcharge = "0", submitBtnClass, submitBtnIcon, isRequest, pass_fee, pass_fee_amount, require3ds = false, autoTrigger = false, show, setShow, setHandleCloseRef, isPartial, bankSurcharge, partialRef, loadingPrev = false, orderGuid: ordGuid, remainingAmount: remAmount, onSubmit, onLoad = true, customCSS }) => {
   var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u;
-  const hasRunRef = useRef11(false);
-  const cardFormRef = useRef11(null);
-  const bankFormRef = useRef11(null);
-  const expiryYearRef = useRef11(null);
-  const expiryMonthRef = useRef11(null);
-  const cardListRunRef = useRef11(false);
-  const threeDSContainerRef = useRef11(null);
-  const [activetab, setActive] = useState10("card");
-  const [activeList, setActiveList] = useState10("card");
-  const [cardData, setCardData] = useState10();
-  const [cardError, setCardError] = useState10({});
-  const [achData, setAchData] = useState10();
-  const [achError, setAchError] = useState10({});
-  const [saveACHinfo, setSaveACHinfo] = useState10(false);
-  const [saveACHConsent1, setSaveACHConsent1] = useState10(false);
-  const [saveCardInfo, setSaveCardInfo] = useState10(false);
-  const [error, setError] = useState10("");
-  const [errorIframe, setErrorIframe] = useState10("");
-  const [success, setSuccess] = useState10(false);
-  let [tranId, setTranId] = useState10("");
-  const [loading, setLoading] = useState10(false);
-  const [loading2, setLoading2] = useState10(false);
-  const [loadingIframe, setLoadingIframe] = useState10(false);
-  const [cardList, setCardList] = useState10([]);
-  const [bankList, setBankList] = useState10([]);
-  const [selectedCard, setSelectedCard] = useState10();
-  const [cashDiscount, setCashDiscount] = useState10(Number(amount));
-  const [activeinCard, setActiveinCard] = useState10("form");
-  const [activeinBank, setActiveinBank] = useState10("form");
-  const [isBankActive, setIsBankActive] = useState10(false);
-  const [processingFee, setProcessingFee] = useState10(0);
-  const [clientSecret, setClientSecret] = useState10("");
-  const [errorMessage, setErrorMessage] = useState10(null);
-  const [initialLoader, setInitialLoader] = useState10(false);
-  const [is3DSEnable, setIs3DSEnable] = useState10(false);
-  const [stripeResponse, setStripeResponse] = useState10(null);
-  const [orderLoader, setOrderLoader] = useState10(false);
-  const [orderGuid, setOrderGuid] = useState10(ordGuid || null);
-  const [partialAmount, setPartialAmount] = useState10("");
-  const [partialError, setPartialError] = useState10("");
-  const [remainingAmount, setRemainingAmount] = useState10("");
-  const [paymentGateway, setPaymentGateway] = useState10();
-  const [dcToken, setDCToken] = useState10();
-  const [isBankConsentChecked, setIsBankConsentChecked] = useState10(false);
-  const [errorBankConsent, setErrorBankConsent] = useState10("");
-  const [errorBankConsentOther, setErrorBankConsentOther] = useState10("");
+  const hasRunRef = useRef10(false);
+  const cardFormRef = useRef10(null);
+  const bankFormRef = useRef10(null);
+  const expiryYearRef = useRef10(null);
+  const expiryMonthRef = useRef10(null);
+  const cardListRunRef = useRef10(false);
+  const threeDSContainerRef = useRef10(null);
+  const [activetab, setActive] = useState9("card");
+  const [activeList, setActiveList] = useState9("card");
+  const [cardData, setCardData] = useState9();
+  const [cardError, setCardError] = useState9({});
+  const [achData, setAchData] = useState9();
+  const [achError, setAchError] = useState9({});
+  const [saveACHinfo, setSaveACHinfo] = useState9(false);
+  const [saveACHConsent1, setSaveACHConsent1] = useState9(false);
+  const [saveCardInfo, setSaveCardInfo] = useState9(false);
+  const [error, setError] = useState9("");
+  const [errorIframe, setErrorIframe] = useState9("");
+  const [success, setSuccess] = useState9(false);
+  let [tranId, setTranId] = useState9("");
+  const [loading, setLoading] = useState9(false);
+  const [loading2, setLoading2] = useState9(false);
+  const [loadingIframe, setLoadingIframe] = useState9(false);
+  const [cardList, setCardList] = useState9([]);
+  const [bankList, setBankList] = useState9([]);
+  const [selectedCard, setSelectedCard] = useState9();
+  const [cashDiscount, setCashDiscount] = useState9(Number(amount));
+  const [activeinCard, setActiveinCard] = useState9("form");
+  const [activeinBank, setActiveinBank] = useState9("form");
+  const [isBankActive, setIsBankActive] = useState9(false);
+  const [processingFee, setProcessingFee] = useState9(0);
+  const [clientSecret, setClientSecret] = useState9("");
+  const [errorMessage, setErrorMessage] = useState9(null);
+  const [initialLoader, setInitialLoader] = useState9(false);
+  const [is3DSEnable, setIs3DSEnable] = useState9(false);
+  const [stripeResponse, setStripeResponse] = useState9(null);
+  const [orderLoader, setOrderLoader] = useState9(false);
+  const [orderGuid, setOrderGuid] = useState9(ordGuid || null);
+  const [partialAmount, setPartialAmount] = useState9("");
+  const [partialError, setPartialError] = useState9("");
+  const [remainingAmount, setRemainingAmount] = useState9("");
+  const [paymentGateway, setPaymentGateway] = useState9();
+  const [dcToken, setDCToken] = useState9();
+  const [isBankConsentChecked, setIsBankConsentChecked] = useState9(false);
+  const [errorBankConsent, setErrorBankConsent] = useState9("");
+  const [errorBankConsentOther, setErrorBankConsentOther] = useState9("");
+  const [isTokenizerReady, setTokenizerReady] = useState9(false);
   let mastercard2 = S3Url + "widget/mc-img.svg";
   let visa2 = S3Url + "widget/visa-img.svg";
   let americanexp2 = S3Url + "widget/ae-img.svg";
@@ -10164,7 +10145,7 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
   const bankFeeAmount = Number(bankSurcharge || 0);
   const bankSavingsAmount = Math.max(bankFeeAmount > 0 ? cardFeeAmount - bankFeeAmount : cardFeeAmount, 0);
   const bankSavingsText = bankSavingsAmount > 0 ? `Save ${formatUSD(bankSavingsAmount.toFixed(2))}` : "";
-  const tokenizerRef = useRef11(null);
+  const tokenizerRef = useRef10(null);
   const fractalStyles = {
     input: {
       "font-family": "'Inter', sans-serif",
@@ -10237,7 +10218,8 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
       let dataObj = __spreadValues({
         Token: data == null ? void 0 : data.Token,
         amount,
-        postal_code: data == null ? void 0 : data.postalCode
+        postal_code: data == null ? void 0 : data.postalCode,
+        require3ds
       }, saveCardInfo ? {
         card: {
           postal_code: cardData == null ? void 0 : cardData.zipCode,
@@ -10343,8 +10325,13 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
     return Object.keys(errors).length > 0;
   };
   const completeFractalFlow = async (tokenizeData, intentid, typeoftoken) => {
-    var _a2, _b2, _c2, _d2, _e2, _f2, _g2, _h2;
+    var _a2, _b2, _c2, _d2, _e2, _f2, _g2;
     try {
+      console.log({
+        tokenizeData,
+        intentid,
+        typeoftoken
+      });
       if (typeoftoken == "google_pay" || typeoftoken == "apple_pay") {
         handleCharge({
           Token: tokenizeData,
@@ -10352,39 +10339,28 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
           typeoftoken
         });
         return;
-      }
-      let token = tokenizeData;
-      let verifyandsaveresp = await axios8.post(`${masterBaseUrl}api/v1/gateway/verify-and-save/${session_token}`, {
-        token,
-        require3ds,
-        pass_fee,
-        typeoftoken
-      });
-      if ((verifyandsaveresp == null ? void 0 : verifyandsaveresp.status) == 200) {
-        let responsetemp = (_a2 = verifyandsaveresp == null ? void 0 : verifyandsaveresp.data) == null ? void 0 : _a2.data;
-        let respData = {
-          Token: responsetemp.gateway_token,
-          Brand: responsetemp.card_data.brand,
-          ExpirationMonth: responsetemp.card_data.expire_mm,
-          ExpirationYear: responsetemp.card_data.expire_yy,
-          Last4: responsetemp.card_data.last4,
-          Bin: responsetemp.card_data.bin,
-          postalCode: cardData == null ? void 0 : cardData.zipCode,
-          stripe_3ds_auth_id: intentid
-        };
+      } else {
         if (isPreAuth) {
-          handlePreAuth(respData);
+          handlePreAuth(__spreadValues({
+            Token: tokenizeData,
+            postalCode: cardData == null ? void 0 : cardData.zipCode,
+            typeoftoken: "token"
+          }, intentid && { stripe_3ds_auth_id: intentid }));
         } else {
-          handleCharge(respData);
+          handleCharge(__spreadValues({
+            Token: tokenizeData,
+            postalCode: cardData == null ? void 0 : cardData.zipCode,
+            typeoftoken: "token"
+          }, intentid && { stripe_3ds_auth_id: intentid }));
         }
       }
     } catch (error2) {
       console.log(error2, "error");
-      setError(((_c2 = (_b2 = error2 == null ? void 0 : error2.response) == null ? void 0 : _b2.data) == null ? void 0 : _c2.message) || "Something went wrong!");
+      setError(((_b2 = (_a2 = error2 == null ? void 0 : error2.response) == null ? void 0 : _a2.data) == null ? void 0 : _b2.message) || "Something went wrong!");
       callback({
-        error: ((_e2 = (_d2 = error2 == null ? void 0 : error2.response) == null ? void 0 : _d2.data) == null ? void 0 : _e2.message) || "Something went wrong!",
-        result: (_g2 = (_f2 = error2 == null ? void 0 : error2.response) == null ? void 0 : _f2.data) == null ? void 0 : _g2.result,
-        statusCode: (_h2 = error2 == null ? void 0 : error2.response) == null ? void 0 : _h2.status
+        error: ((_d2 = (_c2 = error2 == null ? void 0 : error2.response) == null ? void 0 : _c2.data) == null ? void 0 : _d2.message) || "Something went wrong!",
+        result: (_f2 = (_e2 = error2 == null ? void 0 : error2.response) == null ? void 0 : _e2.data) == null ? void 0 : _f2.result,
+        statusCode: (_g2 = error2 == null ? void 0 : error2.response) == null ? void 0 : _g2.status
       });
       hideLoader();
     }
@@ -10956,7 +10932,7 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
             hideLoader();
           }
         } else {
-          setError("Please Select A Card/Bank");
+          setErrorIframe("Please Select A Card/Bank");
           callback({
             error: "Please Select A Card/Bank"
           });
@@ -11029,13 +11005,13 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
       setOrderLoader(false);
     }
   };
-  useEffect17(() => {
+  useEffect15(() => {
     if (!show && !autoTrigger) {
       hasRunRef.current = false;
       cardListRunRef.current = false;
     }
   }, [show, autoTrigger]);
-  useEffect17(() => {
+  useEffect15(() => {
     if (!hasRunRef.current && (show || autoTrigger) && onLoad) {
       getPaymentDetails();
       if (isPartial && !partialRef) {
@@ -11043,7 +11019,7 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
       }
     }
   }, [show, autoTrigger, isPartial, onLoad]);
-  useEffect17(() => {
+  useEffect15(() => {
     if ((show || autoTrigger) && pass_fee_amount) {
       let cashdisc = Number(amount) - Number(pass_fee_amount);
       if (cashdisc && !isNaN(cashdisc)) {
@@ -11105,7 +11081,7 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
     console.error("3DS Auth failed \u274C", status);
     setError(`3DS Authentication ${status}`);
   };
-  useEffect17(() => {
+  useEffect15(() => {
     if (setHandleCloseRef) {
       setHandleCloseRef(() => handleClose);
     }
@@ -11123,18 +11099,18 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
       setPartialError("");
     }
   };
-  useEffect17(() => {
+  useEffect15(() => {
     if (typeof FractalTokenizer === "undefined") return;
     const tokenizer = new FractalTokenizer({
       styles: {}
     });
   }, []);
-  const stateRef = useRef11({
+  const stateRef = useRef10({
     activeinBank,
     activeinCard,
     activetab
   });
-  useEffect17(() => {
+  useEffect15(() => {
     stateRef.current = {
       activeinBank,
       activeinCard,
@@ -11158,7 +11134,7 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
       }
     }
   }, []);
-  useEffect17(() => {
+  useEffect15(() => {
     onSubmit == null ? void 0 : onSubmit(submit);
   }, [onSubmit, submit]);
   function detectCardType(cardinput) {
@@ -11184,34 +11160,48 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
     const cardType = detectCardType(cardInput);
     switch (cardType) {
       case "visa":
-        return /* @__PURE__ */ jsx37("img", { src: visa2, alt: "visa", width: 33 });
+        return /* @__PURE__ */ jsx36("img", { src: visa2, alt: "visa", width: 33 });
       case "mastercard":
-        return /* @__PURE__ */ jsx37("img", { src: mastercard2, width: 33, alt: "mastercard" });
+        return /* @__PURE__ */ jsx36("img", { src: mastercard2, width: 33, alt: "mastercard" });
       case "amex":
-        return /* @__PURE__ */ jsx37("img", { src: americanexp2, alt: "amex", width: 33 });
+        return /* @__PURE__ */ jsx36("img", { src: americanexp2, alt: "amex", width: 33 });
       case "discover":
-        return /* @__PURE__ */ jsx37("img", { src: discover2, width: 33, alt: "discover" });
+        return /* @__PURE__ */ jsx36("img", { src: discover2, width: 33, alt: "discover" });
       case "diners":
-        return /* @__PURE__ */ jsx37("img", { src: dinersicon, alt: "Diners Club" });
+        return /* @__PURE__ */ jsx36("img", { src: dinersicon, alt: "Diners Club" });
       case "jcb":
-        return /* @__PURE__ */ jsx37("img", { src: jcbicon, alt: "JCB" });
+        return /* @__PURE__ */ jsx36("img", { src: jcbicon, alt: "JCB" });
       case "unionpay":
-        return /* @__PURE__ */ jsx37("img", { src: unionicon, alt: "UnionPay" });
+        return /* @__PURE__ */ jsx36("img", { src: unionicon, alt: "UnionPay" });
       default:
-        return /* @__PURE__ */ jsx37("img", { src: defualtcardborder, alt: "card" });
+        return /* @__PURE__ */ jsx36("img", { src: defualtcardborder, alt: "card" });
     }
   }
-  return /* @__PURE__ */ jsxs20(Fragment19, { children: [
-    (initialLoader || !onLoad) && /* @__PURE__ */ jsx37(Loader_default, { intensity: "dark", loading: initialLoader || !onLoad }),
-    error && /* @__PURE__ */ jsx37("div", { children: /* @__PURE__ */ jsx37(ErrorCardOverlay_default, { error, onClose: handleClose, autoTrigger }) }),
-    errorIframe && /* @__PURE__ */ jsx37("div", { children: /* @__PURE__ */ jsx37(ErrorCardOverlay_default, { error: errorIframe, onClose: () => {
+  return /* @__PURE__ */ jsxs19(Fragment18, { children: [
+    (initialLoader || !onLoad) && /* @__PURE__ */ jsx36(Loader_default, { intensity: "dark", loading: initialLoader || !onLoad }),
+    paymentGateway == 32 && /* @__PURE__ */ jsx36(FractalTokenizerScript, { onLoad: () => setTokenizerReady(true) }),
+    paymentGateway == 31 && /* @__PURE__ */ jsx36(
+      DataCapScriptLoader,
+      {
+        onReady: () => {
+          console.log("SDK Ready");
+        },
+        onError: (err) => {
+          setLoading(false);
+          setLoadingIframe(false);
+          setError(DcLoadingError);
+        }
+      }
+    ),
+    error && /* @__PURE__ */ jsx36("div", { children: /* @__PURE__ */ jsx36(ErrorCardOverlay_default, { error, onClose: handleClose, autoTrigger }) }),
+    errorIframe && /* @__PURE__ */ jsx36("div", { children: /* @__PURE__ */ jsx36(ErrorCardOverlay_default, { error: errorIframe, onClose: () => {
       setErrorIframe("");
     }, autoTrigger: onSubmit ? !onSubmit : autoTrigger }) }),
-    /* @__PURE__ */ jsxs20(Fragment19, { children: [
-      (loading || loading2 || loadingIframe) && /* @__PURE__ */ jsx37(Loader_default, { intensity: "light", loading: loading || loading2 || loadingPrev || orderLoader || loadingIframe }),
-      /* @__PURE__ */ jsxs20("div", { className: "frac-card-payment-page frac-form frac-new-form", children: [
-        /* @__PURE__ */ jsx37("div", { ref: threeDSContainerRef, style: { width: "100%", height: "100%" } }),
-        (stripeResponse == null ? void 0 : stripeResponse.challenge_url) ? /* @__PURE__ */ jsx37(
+    /* @__PURE__ */ jsxs19(Fragment18, { children: [
+      (loading || loading2 || loadingIframe) && /* @__PURE__ */ jsx36(Loader_default, { intensity: "light", loading: loading || loading2 || loadingPrev || orderLoader || loadingIframe }),
+      /* @__PURE__ */ jsxs19("div", { className: "frac-card-payment-page frac-form frac-new-form", children: [
+        /* @__PURE__ */ jsx36("div", { ref: threeDSContainerRef, style: { width: "100%", height: "100%" } }),
+        (stripeResponse == null ? void 0 : stripeResponse.challenge_url) ? /* @__PURE__ */ jsx36(
           ThreeDSChallenge,
           {
             containerRef: threeDSContainerRef,
@@ -11221,33 +11211,33 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
             onSuccess: handleSuccess,
             onError: handleError
           }
-        ) : /* @__PURE__ */ jsxs20("div", { className: "parent-pay-container", children: [
-          /* @__PURE__ */ jsx37("span", { style: { display: autoTrigger ? "none" : "block" }, className: "request-payment-close-popup", onClick: handleClose, children: /* @__PURE__ */ jsxs20("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: [
-            /* @__PURE__ */ jsx37("g", { clipPath: "url(#clip0_12425_52336)", children: /* @__PURE__ */ jsx37("path", { d: "M9.46585 8.01168L15.6959 1.7814C16.1014 1.37615 16.1014 0.720912 15.6959 0.315659C15.2907 -0.0895946 14.6354 -0.0895946 14.2302 0.315659L7.99991 6.54593L1.76983 0.315659C1.36438 -0.0895946 0.709336 -0.0895946 0.304082 0.315659C-0.101361 0.720912 -0.101361 1.37615 0.304082 1.7814L6.53416 8.01168L0.304082 14.2419C-0.101361 14.6472 -0.101361 15.3024 0.304082 15.7077C0.506045 15.9098 0.771595 16.0114 1.03695 16.0114C1.30232 16.0114 1.56768 15.9098 1.76983 15.7077L7.99991 9.47742L14.2302 15.7077C14.4323 15.9098 14.6977 16.0114 14.9631 16.0114C15.2284 16.0114 15.4938 15.9098 15.6959 15.7077C16.1014 15.3024 16.1014 14.6472 15.6959 14.2419L9.46585 8.01168Z", fill: "#727272" }) }),
-            /* @__PURE__ */ jsx37("defs", { children: /* @__PURE__ */ jsx37("clipPath", { id: "clip0_12425_52336", children: /* @__PURE__ */ jsx37("rect", { width: "16", height: "16", fill: "white" }) }) })
+        ) : /* @__PURE__ */ jsxs19("div", { className: "parent-pay-container", children: [
+          /* @__PURE__ */ jsx36("span", { style: { display: autoTrigger ? "none" : "block" }, className: "request-payment-close-popup", onClick: handleClose, children: /* @__PURE__ */ jsxs19("svg", { xmlns: "http://www.w3.org/2000/svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: [
+            /* @__PURE__ */ jsx36("g", { clipPath: "url(#clip0_12425_52336)", children: /* @__PURE__ */ jsx36("path", { d: "M9.46585 8.01168L15.6959 1.7814C16.1014 1.37615 16.1014 0.720912 15.6959 0.315659C15.2907 -0.0895946 14.6354 -0.0895946 14.2302 0.315659L7.99991 6.54593L1.76983 0.315659C1.36438 -0.0895946 0.709336 -0.0895946 0.304082 0.315659C-0.101361 0.720912 -0.101361 1.37615 0.304082 1.7814L6.53416 8.01168L0.304082 14.2419C-0.101361 14.6472 -0.101361 15.3024 0.304082 15.7077C0.506045 15.9098 0.771595 16.0114 1.03695 16.0114C1.30232 16.0114 1.56768 15.9098 1.76983 15.7077L7.99991 9.47742L14.2302 15.7077C14.4323 15.9098 14.6977 16.0114 14.9631 16.0114C15.2284 16.0114 15.4938 15.9098 15.6959 15.7077C16.1014 15.3024 16.1014 14.6472 15.6959 14.2419L9.46585 8.01168Z", fill: "#727272" }) }),
+            /* @__PURE__ */ jsx36("defs", { children: /* @__PURE__ */ jsx36("clipPath", { id: "clip0_12425_52336", children: /* @__PURE__ */ jsx36("rect", { width: "16", height: "16", fill: "white" }) }) })
           ] }) }),
-          /* @__PURE__ */ jsx37("div", { className: "pay-main-logo-res" }),
-          /* @__PURE__ */ jsxs20("div", { className: onSubmit ? "pay-container frac-pay-container " : "pay-container", children: [
-            !onSubmit && /* @__PURE__ */ jsxs20("div", { className: "pay-header pay-conatiner-one", children: [
-              /* @__PURE__ */ jsxs20("div", { className: "pay-conatiner-one-first", children: [
-                /* @__PURE__ */ jsxs20("div", { className: "pay-logo-container", children: [
-                  /* @__PURE__ */ jsx37("div", { className: "pay-main-logo" }),
-                  /* @__PURE__ */ jsx37("h1", { className: "pay-heading", children: "Pay" }),
-                  (cardList == null ? void 0 : cardList.length) > 0 && activetab !== "cardList" && /* @__PURE__ */ jsxs20("button", { className: "res-charge-payment-back-btn ", onClick: () => setActive("cardList"), children: [
+          /* @__PURE__ */ jsx36("div", { className: "pay-main-logo-res" }),
+          /* @__PURE__ */ jsxs19("div", { className: onSubmit ? "pay-container frac-pay-container " : "pay-container", children: [
+            !onSubmit && /* @__PURE__ */ jsxs19("div", { className: "pay-header pay-conatiner-one", children: [
+              /* @__PURE__ */ jsxs19("div", { className: "pay-conatiner-one-first", children: [
+                /* @__PURE__ */ jsxs19("div", { className: "pay-logo-container", children: [
+                  /* @__PURE__ */ jsx36("div", { className: "pay-main-logo" }),
+                  /* @__PURE__ */ jsx36("h1", { className: "pay-heading", children: "Pay" }),
+                  (cardList == null ? void 0 : cardList.length) > 0 && activetab !== "cardList" && /* @__PURE__ */ jsxs19("button", { className: "res-charge-payment-back-btn ", onClick: () => setActive("cardList"), children: [
                     " ",
-                    /* @__PURE__ */ jsx37(IoArrowBack2, {}),
+                    /* @__PURE__ */ jsx36(IoArrowBack2, {}),
                     " Back"
                   ] })
                 ] }),
-                /* @__PURE__ */ jsx37("div", { className: "amt-pay-con", children: /* @__PURE__ */ jsxs20("div", { className: "pay-amount-conatiner", children: [
-                  /* @__PURE__ */ jsx37("small", { className: "pay-payment-amount", children: "Select payment type" }),
-                  /* @__PURE__ */ jsxs20("div", { className: "frac-card-bank-radio-main", children: [
-                    /* @__PURE__ */ jsx37(CardBankRadio, { label: "Card", amount: (_a = Number(amount)) == null ? void 0 : _a.toFixed(2), value: "card", onChange: handletabchange, activetab }),
-                    !isPreAuth && isBankActive && !isPartial && /* @__PURE__ */ jsx37(CardBankRadio, { label: "Bank", amount: (_b = Number(bankAmount)) == null ? void 0 : _b.toFixed(2), value: "ach", onChange: handletabchange, activetab, savingsText: bankSavingsText })
+                /* @__PURE__ */ jsx36("div", { className: "amt-pay-con", children: /* @__PURE__ */ jsxs19("div", { className: "pay-amount-conatiner", children: [
+                  /* @__PURE__ */ jsx36("small", { className: "pay-payment-amount", children: "Select payment type" }),
+                  /* @__PURE__ */ jsxs19("div", { className: "frac-card-bank-radio-main", children: [
+                    /* @__PURE__ */ jsx36(CardBankRadio, { label: "Card", amount: (_a = Number(amount)) == null ? void 0 : _a.toFixed(2), value: "card", onChange: handletabchange, activetab }),
+                    !isPreAuth && isBankActive && !isPartial && /* @__PURE__ */ jsx36(CardBankRadio, { label: "Bank", amount: (_b = Number(bankAmount)) == null ? void 0 : _b.toFixed(2), value: "ach", onChange: handletabchange, activetab, savingsText: bankSavingsText })
                   ] }),
-                  isPartial && /* @__PURE__ */ jsxs20("div", { className: "frac-partial-payment-input", children: [
-                    /* @__PURE__ */ jsx37("label", { htmlFor: "partialpayment", children: "Partial Payment" }),
-                    /* @__PURE__ */ jsx37(
+                  isPartial && /* @__PURE__ */ jsxs19("div", { className: "frac-partial-payment-input", children: [
+                    /* @__PURE__ */ jsx36("label", { htmlFor: "partialpayment", children: "Partial Payment" }),
+                    /* @__PURE__ */ jsx36(
                       NumericFormat2,
                       {
                         prefix: "$",
@@ -11271,25 +11261,25 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
                         }
                       }
                     ),
-                    partialError && /* @__PURE__ */ jsx37("span", { className: "error-span", children: partialError })
+                    partialError && /* @__PURE__ */ jsx36("span", { className: "error-span", children: partialError })
                   ] })
                 ] }) })
               ] }),
-              /* @__PURE__ */ jsxs20("div", { className: "pay-conatiner-one-last", children: [
-                /* @__PURE__ */ jsx37("img", { src: secure2, alt: "" }),
-                /* @__PURE__ */ jsx37("img", { src: pov2, alt: "" }),
+              /* @__PURE__ */ jsxs19("div", { className: "pay-conatiner-one-last", children: [
+                /* @__PURE__ */ jsx36("img", { src: secure2, alt: "" }),
+                /* @__PURE__ */ jsx36("img", { src: pov2, alt: "" }),
                 "Secure payments powered by Fractal"
               ] })
             ] }),
-            /* @__PURE__ */ jsx37("div", { className: "pay-tab pay-conatiner-two", children: /* @__PURE__ */ jsx37("div", { className: "col-md-12", children: /* @__PURE__ */ jsxs20("div", { id: "payment-form-div ", className: onSubmit ? "frac-payment-form-div" : "", children: [
-              onSubmit && /* @__PURE__ */ jsx37("div", { className: "amt-pay-con", children: /* @__PURE__ */ jsxs20("div", { className: "pay-amount-conatiner", children: [
-                /* @__PURE__ */ jsxs20("div", { className: "frac-card-bank-radio-main", children: [
-                  /* @__PURE__ */ jsx37(CardBankRadio, { skydesign: true, label: "Card", amount: (_c = Number(amount)) == null ? void 0 : _c.toFixed(2), value: "card", onChange: handletabchange, activetab }),
-                  !isPreAuth && isBankActive && !isPartial && /* @__PURE__ */ jsx37(CardBankRadio, { skydesign: true, label: "Bank", amount: (_d = Number(bankAmount)) == null ? void 0 : _d.toFixed(2), value: "ach", onChange: handletabchange, activetab, savingsText: bankSavingsText })
+            /* @__PURE__ */ jsx36("div", { className: "pay-tab pay-conatiner-two", children: /* @__PURE__ */ jsx36("div", { className: "col-md-12", children: /* @__PURE__ */ jsxs19("div", { id: "payment-form-div ", className: onSubmit ? "frac-payment-form-div" : "", children: [
+              onSubmit && /* @__PURE__ */ jsx36("div", { className: "amt-pay-con", children: /* @__PURE__ */ jsxs19("div", { className: "pay-amount-conatiner", children: [
+                /* @__PURE__ */ jsxs19("div", { className: "frac-card-bank-radio-main", children: [
+                  /* @__PURE__ */ jsx36(CardBankRadio, { skydesign: true, label: "Card", amount: (_c = Number(amount)) == null ? void 0 : _c.toFixed(2), value: "card", onChange: handletabchange, activetab }),
+                  !isPreAuth && isBankActive && !isPartial && /* @__PURE__ */ jsx36(CardBankRadio, { skydesign: true, label: "Bank", amount: (_d = Number(bankAmount)) == null ? void 0 : _d.toFixed(2), value: "ach", onChange: handletabchange, activetab, savingsText: bankSavingsText })
                 ] }),
-                isPartial && /* @__PURE__ */ jsxs20("div", { className: "frac-partial-payment-input", children: [
-                  /* @__PURE__ */ jsx37("label", { htmlFor: "partialpayment", children: "Partial Payment" }),
-                  /* @__PURE__ */ jsx37(
+                isPartial && /* @__PURE__ */ jsxs19("div", { className: "frac-partial-payment-input", children: [
+                  /* @__PURE__ */ jsx36("label", { htmlFor: "partialpayment", children: "Partial Payment" }),
+                  /* @__PURE__ */ jsx36(
                     NumericFormat2,
                     {
                       prefix: "$",
@@ -11306,34 +11296,34 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
                       fixedDecimalScale: true
                     }
                   ),
-                  partialError && /* @__PURE__ */ jsx37("span", { className: "error-span", children: partialError })
+                  partialError && /* @__PURE__ */ jsx36("span", { className: "error-span", children: partialError })
                 ] })
               ] }) }),
-              is3DSEnable ? clientSecret && /* @__PURE__ */ jsx37(CheckoutWrapper, { onSuccess, clientSecret, amount, showLoader, hideLoader, callback, session_token, handleClose, setError, isPreAuth }) : /* @__PURE__ */ jsxs20(Fragment19, { children: [
-                /* @__PURE__ */ jsxs20("div", { id: "ach", style: { display: activetab === "card" ? "block" : "none" }, className: "tabcontent", children: [
-                  !onSubmit && /* @__PURE__ */ jsxs20(Fragment19, { children: [
-                    /* @__PURE__ */ jsxs20("div", { className: "frac-heading-card-wrap", children: [
-                      /* @__PURE__ */ jsx37("div", { className: "frac-backarrow", children: (cardList == null ? void 0 : cardList.length) > 0 && activeinCard === "form" && /* @__PURE__ */ jsxs20("button", { className: "charge-payment-back-btn ", onClick: () => setActiveinCard("list"), children: [
+              is3DSEnable ? clientSecret && /* @__PURE__ */ jsx36(CheckoutWrapper, { onSuccess, clientSecret, amount, showLoader, hideLoader, callback, session_token, handleClose, setError, isPreAuth }) : /* @__PURE__ */ jsxs19(Fragment18, { children: [
+                /* @__PURE__ */ jsxs19("div", { id: "ach", style: { display: activetab === "card" ? "block" : "none" }, className: "tabcontent", children: [
+                  !onSubmit && /* @__PURE__ */ jsxs19(Fragment18, { children: [
+                    /* @__PURE__ */ jsxs19("div", { className: "frac-heading-card-wrap", children: [
+                      /* @__PURE__ */ jsx36("div", { className: "frac-backarrow", children: (cardList == null ? void 0 : cardList.length) > 0 && activeinCard === "form" && /* @__PURE__ */ jsxs19("button", { className: "charge-payment-back-btn ", onClick: () => setActiveinCard("list"), children: [
                         " ",
-                        /* @__PURE__ */ jsx37(IoArrowBack2, {})
+                        /* @__PURE__ */ jsx36(IoArrowBack2, {})
                       ] }) }),
-                      /* @__PURE__ */ jsx37("h6", { className: "frac-card-payment-heading", children: "Card Payment" })
+                      /* @__PURE__ */ jsx36("h6", { className: "frac-card-payment-heading", children: "Card Payment" })
                     ] }),
-                    /* @__PURE__ */ jsxs20("div", { style: { display: "flex", gap: "8px", margin: "8px 0px 19px 0px" }, children: [
-                      /* @__PURE__ */ jsx37("img", { src: visa2, alt: "", width: 33 }),
-                      /* @__PURE__ */ jsx37("img", { src: mastercard2, width: 33, alt: "" }),
-                      /* @__PURE__ */ jsx37("img", { src: americanexp2, alt: "", width: 33 }),
-                      /* @__PURE__ */ jsx37("img", { src: discover2, width: 33, alt: "" })
+                    /* @__PURE__ */ jsxs19("div", { style: { display: "flex", gap: "8px", margin: "8px 0px 19px 0px" }, children: [
+                      /* @__PURE__ */ jsx36("img", { src: visa2, alt: "", width: 33 }),
+                      /* @__PURE__ */ jsx36("img", { src: mastercard2, width: 33, alt: "" }),
+                      /* @__PURE__ */ jsx36("img", { src: americanexp2, alt: "", width: 33 }),
+                      /* @__PURE__ */ jsx36("img", { src: discover2, width: 33, alt: "" })
                     ] })
                   ] }),
-                  activeinCard === "list" && (cardList == null ? void 0 : cardList.length) > 0 ? /* @__PURE__ */ jsxs20(Fragment19, { children: [
-                    /* @__PURE__ */ jsx37(CardList, { headingClass: "card-ach-heading-frac", listHeading: "Card", ListItems: cardList, selectedCard, setSelectedCard, handleDeleteCard, otherButtonLabel: "Pay With Other Card", otherButtonAction: () => {
+                  activeinCard === "list" && (cardList == null ? void 0 : cardList.length) > 0 ? /* @__PURE__ */ jsxs19(Fragment18, { children: [
+                    /* @__PURE__ */ jsx36(CardList, { headingClass: "card-ach-heading-frac", listHeading: "Card", ListItems: cardList, selectedCard, setSelectedCard, handleDeleteCard, otherButtonLabel: "Pay With Other Card", otherButtonAction: () => {
                       setActiveinCard("form");
                     } }),
-                    /* @__PURE__ */ jsx37("div", { className: "form-group-frac", style: { padding: "0", display: onSubmit ? "none" : "block" }, children: /* @__PURE__ */ jsx37("button", { className: "pay-button", style: { margin: "0px" }, type: "submit", onClick: handlechargeCustomer, children: partialAmount ? formatUSD((_e = Number(partialAmount)) == null ? void 0 : _e.toFixed(2)) : formatUSD((_f = Number(amount)) == null ? void 0 : _f.toFixed(2)) }) })
-                  ] }) : paymentGateway == 32 ? /* @__PURE__ */ jsxs20(Fragment19, { children: [
-                    onSubmit && /* @__PURE__ */ jsxs20(Fragment19, { children: [
-                      /* @__PURE__ */ jsx37(
+                    /* @__PURE__ */ jsx36("div", { className: "form-group-frac", style: { padding: "0", display: onSubmit ? "none" : "block" }, children: /* @__PURE__ */ jsx36("button", { className: "pay-button", style: { margin: "0px" }, type: "submit", onClick: handlechargeCustomer, children: partialAmount ? formatUSD((_e = Number(partialAmount)) == null ? void 0 : _e.toFixed(2)) : formatUSD((_f = Number(amount)) == null ? void 0 : _f.toFixed(2)) }) })
+                  ] }) : paymentGateway == 32 ? /* @__PURE__ */ jsxs19(Fragment18, { children: [
+                    onSubmit && /* @__PURE__ */ jsxs19(Fragment18, { children: [
+                      /* @__PURE__ */ jsx36(
                         ApplePayButton,
                         {
                           applePayAmount: partialAmount ? partialAmount : amount,
@@ -11343,40 +11333,28 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
                           showLoader
                         }
                       ),
-                      /* @__PURE__ */ jsx37(
-                        GooglePayComponent,
-                        {
-                          amount: partialAmount ? partialAmount : amount,
-                          googlePayEnvironment,
-                          googlePayGatewayMerchantId,
-                          googlePayMerchantId,
-                          googlePayMerchantName: merchantName,
-                          completeFractalFlow,
-                          setLoading
-                        }
-                      ),
-                      /* @__PURE__ */ jsx37("div", { id: "digital-wallet-or", className: "frac-or", children: /* @__PURE__ */ jsx37("span", { children: "or" }) })
+                      /* @__PURE__ */ jsx36("div", { id: "digital-wallet-or", className: "frac-or", children: /* @__PURE__ */ jsx36("span", { children: "or" }) })
                     ] }),
-                    /* @__PURE__ */ jsxs20("form", { id: "paymentForm", style: { textAlign: "start" }, ref: cardFormRef, onSubmit: submitFunc, onKeyDown: (e) => {
+                    /* @__PURE__ */ jsxs19("form", { id: "paymentForm", style: { textAlign: "start" }, ref: cardFormRef, onSubmit: submitFunc, onKeyDown: (e) => {
                       if (e.key === "Enter" && loading) {
                         e.preventDefault();
                         e.stopPropagation();
                       }
                     }, children: [
-                      /* @__PURE__ */ jsxs20("div", { className: "ach-scrl", style: { minHeight: "398px", maxHeight: "398px", overflow: "auto", marginRight: "5px" }, children: [
-                        /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
-                          /* @__PURE__ */ jsx37("label", { htmlFor: "cardHolderName", children: "NAME ON CARD " }),
-                          /* @__PURE__ */ jsx37("input", { type: "text", className: "form-control-frac", maxLength: 100, placeholder: "John Doe", value: (cardData == null ? void 0 : cardData.cardName) || "", onChange: (e) => {
+                      /* @__PURE__ */ jsxs19("div", { className: "ach-scrl", style: { minHeight: "398px", maxHeight: "398px", overflow: "auto", marginRight: "5px" }, children: [
+                        /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
+                          /* @__PURE__ */ jsx36("label", { htmlFor: "cardHolderName", children: "NAME ON CARD " }),
+                          /* @__PURE__ */ jsx36("input", { type: "text", className: "form-control-frac", maxLength: 100, placeholder: "John Doe", value: (cardData == null ? void 0 : cardData.cardName) || "", onChange: (e) => {
                             const value = e.target.value;
                             if (/^[a-zA-Z\s]*$/.test(value)) {
                               handleCardChange("cardName", value);
                             }
                           } }),
-                          (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */ jsx37("span", { className: "error-span", children: cardError == null ? void 0 : cardError.cardName })
+                          (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */ jsx36("span", { className: "error-span", children: cardError == null ? void 0 : cardError.cardName })
                         ] }),
-                        /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
-                          /* @__PURE__ */ jsx37("label", { htmlFor: "cardNumber", children: "CARD NUMBER" }),
-                          /* @__PURE__ */ jsx37("div", { className: "toggle-num-wrapper toggle-num-wrapper-new", children: (show || autoTrigger) && paymentGateway === 32 && /* @__PURE__ */ jsx37(
+                        /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
+                          /* @__PURE__ */ jsx36("label", { htmlFor: "cardNumber", children: "CARD NUMBER" }),
+                          /* @__PURE__ */ jsx36("div", { className: "toggle-num-wrapper toggle-num-wrapper-new", children: (show || autoTrigger) && paymentGateway === 32 && isTokenizerReady && /* @__PURE__ */ jsx36(
                             FractalFields_default,
                             {
                               fractalStyles,
@@ -11385,18 +11363,18 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
                             }
                           ) })
                         ] }),
-                        /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
-                          /* @__PURE__ */ jsx37("label", { htmlFor: "zip", children: "ZIP" }),
-                          /* @__PURE__ */ jsx37("input", { type: "text", className: "form-control-frac", maxLength: 100, placeholder: "000000", value: (_g = cardData == null ? void 0 : cardData.zipCode) != null ? _g : "", onChange: (e) => handleCardChange("zipCode", e.target.value) }),
-                          (cardError == null ? void 0 : cardError.zipCode) && /* @__PURE__ */ jsx37("span", { className: "error-span", children: cardError == null ? void 0 : cardError.zipCode }),
-                          pass_fee && cardFeeAmount > 0 && /* @__PURE__ */ jsxs20("small", { className: "frac-fee-text", children: [
+                        /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
+                          /* @__PURE__ */ jsx36("label", { htmlFor: "zip", children: "ZIP" }),
+                          /* @__PURE__ */ jsx36("input", { type: "text", className: "form-control-frac", maxLength: 100, placeholder: "000000", value: (_g = cardData == null ? void 0 : cardData.zipCode) != null ? _g : "", onChange: (e) => handleCardChange("zipCode", e.target.value) }),
+                          (cardError == null ? void 0 : cardError.zipCode) && /* @__PURE__ */ jsx36("span", { className: "error-span", children: cardError == null ? void 0 : cardError.zipCode }),
+                          pass_fee && cardFeeAmount > 0 && /* @__PURE__ */ jsxs19("small", { className: "frac-fee-text", children: [
                             "Cards include a fee amount of ",
-                            /* @__PURE__ */ jsx37("span", { className: "frac-fee-amount", children: formatUSD(cardFeeAmount.toFixed(2)) }),
+                            /* @__PURE__ */ jsx36("span", { className: "frac-fee-amount", children: formatUSD(cardFeeAmount.toFixed(2)) }),
                             "."
                           ] })
                         ] }),
-                        customerId && /* @__PURE__ */ jsx37("div", { className: "form-group-frac", children: /* @__PURE__ */ jsxs20("div", { className: "frac-tooltip-mn", style: { display: "flex", alignItems: "center", gap: "10px", paddingTop: "10px" }, children: [
-                          /* @__PURE__ */ jsx37(
+                        customerId && /* @__PURE__ */ jsx36("div", { className: "form-group-frac", children: /* @__PURE__ */ jsxs19("div", { className: "frac-tooltip-mn", style: { display: "flex", alignItems: "center", gap: "10px", paddingTop: "10px" }, children: [
+                          /* @__PURE__ */ jsx36(
                             "input",
                             {
                               type: "checkbox",
@@ -11406,10 +11384,10 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
                               onChange: (e) => setSaveCardInfo(e.target.checked)
                             }
                           ),
-                          /* @__PURE__ */ jsx37("label", { htmlFor: "save_card", className: "toggle-label" }),
-                          /* @__PURE__ */ jsx37("label", { htmlFor: "save_card", children: "Save card for future payments  " }),
-                          /* @__PURE__ */ jsxs20("div", { className: "frac-tooltip-wrapper", children: [
-                            /* @__PURE__ */ jsx37("div", { className: "frac-tooltip-icon", children: /* @__PURE__ */ jsxs20(
+                          /* @__PURE__ */ jsx36("label", { htmlFor: "save_card", className: "toggle-label" }),
+                          /* @__PURE__ */ jsx36("label", { htmlFor: "save_card", children: "Save card for future payments  " }),
+                          /* @__PURE__ */ jsxs19("div", { className: "frac-tooltip-wrapper", children: [
+                            /* @__PURE__ */ jsx36("div", { className: "frac-tooltip-icon", children: /* @__PURE__ */ jsxs19(
                               "svg",
                               {
                                 xmlns: "http://www.w3.org/2000/svg",
@@ -11418,8 +11396,8 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
                                 viewBox: "0 0 20 20",
                                 fill: "none",
                                 children: [
-                                  /* @__PURE__ */ jsx37("circle", { cx: "10", cy: "10", r: "10", fill: "#E0DFE2" }),
-                                  /* @__PURE__ */ jsx37(
+                                  /* @__PURE__ */ jsx36("circle", { cx: "10", cy: "10", r: "10", fill: "#E0DFE2" }),
+                                  /* @__PURE__ */ jsx36(
                                     "path",
                                     {
                                       d: "M9.03406 12.0979V12.0072C9.04055 11.4153 9.10057 10.9443 9.21411 10.5943C9.3309 10.2442 9.49635 9.96102 9.71046 9.74463C9.92457 9.52824 10.1825 9.33095 10.4842 9.15274C10.6788 9.03182 10.854 8.89658 11.0097 8.74702C11.1655 8.59745 11.2887 8.42562 11.3796 8.2315C11.4704 8.03739 11.5158 7.82259 11.5158 7.58711C11.5158 7.3039 11.4477 7.05887 11.3114 6.85203C11.1752 6.64519 10.9935 6.48608 10.7664 6.3747C10.5426 6.26014 10.2928 6.20286 10.017 6.20286C9.76723 6.20286 9.52879 6.25378 9.3017 6.35561C9.07461 6.45744 8.88646 6.61655 8.73723 6.83294C8.588 7.04614 8.50203 7.3214 8.47932 7.65871H7C7.02271 7.08592 7.17032 6.60223 7.44282 6.20764C7.71533 5.80986 8.07543 5.50915 8.52311 5.30549C8.97405 5.10183 9.47202 5 10.017 5C10.6139 5 11.1363 5.10979 11.5839 5.32936C12.0316 5.54574 12.3788 5.84964 12.6253 6.24105C12.8751 6.62928 13 7.08274 13 7.60143C13 7.95784 12.9432 8.27924 12.8297 8.56563C12.7161 8.84885 12.5539 9.10183 12.3431 9.32458C12.1354 9.54733 11.8856 9.74463 11.5937 9.91647C11.3179 10.0851 11.0941 10.2601 10.9221 10.4415C10.7534 10.6229 10.6302 10.8377 10.5523 11.0859C10.4745 11.3341 10.4323 11.6412 10.4258 12.0072V12.0979H9.03406ZM9.76886 15C9.50284 15 9.27413 14.9077 9.08273 14.7232C8.89132 14.5354 8.79562 14.3095 8.79562 14.0453C8.79562 13.7844 8.89132 13.5617 9.08273 13.3771C9.27413 13.1893 9.50284 13.0955 9.76886 13.0955C10.0316 13.0955 10.2587 13.1893 10.4501 13.3771C10.6448 13.5617 10.7421 13.7844 10.7421 14.0453C10.7421 14.2204 10.6967 14.3811 10.6058 14.5274C10.5182 14.6706 10.4015 14.7852 10.2555 14.8711C10.1095 14.957 9.94728 15 9.76886 15Z",
@@ -11429,55 +11407,55 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
                                 ]
                               }
                             ) }),
-                            /* @__PURE__ */ jsx37("div", { className: "frac-tooltip-text", children: /* @__PURE__ */ jsxs20("p", { children: [
+                            /* @__PURE__ */ jsx36("div", { className: "frac-tooltip-text", children: /* @__PURE__ */ jsxs19("p", { children: [
                               "If checked, I agree to give the ",
-                              /* @__PURE__ */ jsx37("b", { children: merchantName || "merchant" }),
+                              /* @__PURE__ */ jsx36("b", { children: merchantName || "merchant" }),
                               " permission to charge this credit card for agreed-upon purchases in the future."
                             ] }) })
                           ] })
                         ] }) })
                       ] }),
-                      /* @__PURE__ */ jsx37("div", { className: "form-group-frac", style: { marginTop: "20px", padding: "0" }, children: /* @__PURE__ */ jsx37("button", { type: "submit", style: { margin: 0, display: onSubmit ? "none" : "block" }, className: "pay-button", children: partialAmount ? formatUSD((_h = Number(partialAmount)) == null ? void 0 : _h.toFixed(2)) : formatUSD((_i = Number(amount)) == null ? void 0 : _i.toFixed(2)) }) })
+                      /* @__PURE__ */ jsx36("div", { className: "form-group-frac", style: { marginTop: "20px", padding: "0" }, children: /* @__PURE__ */ jsx36("button", { type: "submit", style: { margin: 0, display: onSubmit ? "none" : "block" }, className: "pay-button", children: partialAmount ? formatUSD((_h = Number(partialAmount)) == null ? void 0 : _h.toFixed(2)) : formatUSD((_i = Number(amount)) == null ? void 0 : _i.toFixed(2)) }) })
                     ] })
-                  ] }) : /* @__PURE__ */ jsxs20("form", { id: "PaymentForm", style: { textAlign: "start" }, ref: cardFormRef, onSubmit: submitFunc, onKeyDown: (e) => {
+                  ] }) : /* @__PURE__ */ jsxs19("form", { id: "PaymentForm", style: { textAlign: "start" }, ref: cardFormRef, onSubmit: submitFunc, onKeyDown: (e) => {
                     if (e.key === "Enter" && loading) {
                       e.preventDefault();
                       e.stopPropagation();
                     }
                   }, children: [
-                    /* @__PURE__ */ jsxs20("div", { className: "ach-scrl", style: { minHeight: "398px", maxHeight: "398px", overflow: "auto", marginRight: "5px" }, children: [
-                      /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
-                        /* @__PURE__ */ jsx37("label", { htmlFor: "cardHolderName", children: "NAME ON CARD " }),
-                        /* @__PURE__ */ jsx37("input", { type: "text", className: "form-control-frac", maxLength: 100, placeholder: "John Doe", value: (cardData == null ? void 0 : cardData.cardName) || "", onChange: (e) => {
+                    /* @__PURE__ */ jsxs19("div", { className: "ach-scrl", style: { minHeight: "398px", maxHeight: "398px", overflow: "auto", marginRight: "5px" }, children: [
+                      /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
+                        /* @__PURE__ */ jsx36("label", { htmlFor: "cardHolderName", children: "NAME ON CARD " }),
+                        /* @__PURE__ */ jsx36("input", { type: "text", className: "form-control-frac", maxLength: 100, placeholder: "John Doe", value: (cardData == null ? void 0 : cardData.cardName) || "", onChange: (e) => {
                           const value = e.target.value;
                           if (/^[a-zA-Z\s]*$/.test(value)) {
                             handleCardChange("cardName", value);
                           }
                         } }),
-                        (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */ jsx37("span", { className: "error-span", children: cardError == null ? void 0 : cardError.cardName })
+                        (cardError == null ? void 0 : cardError.cardName) && /* @__PURE__ */ jsx36("span", { className: "error-span", children: cardError == null ? void 0 : cardError.cardName })
                       ] }),
-                      /* @__PURE__ */ jsx37("div", { className: "form-group-frac", children: /* @__PURE__ */ jsx37(
+                      /* @__PURE__ */ jsx36("div", { className: "form-group-frac", children: /* @__PURE__ */ jsx36(
                         DataCapFields,
                         {
                           isOpen: show || autoTrigger,
                           tokenKey: dcToken,
                           setLoader: activeinCard === "form" ? setLoadingIframe : null,
                           isEmbedded: onSubmit ? true : false,
-                          customCSS: customCSS2
+                          customCSS
                         }
                       ) }),
-                      /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
-                        /* @__PURE__ */ jsx37("label", { htmlFor: "zip", children: "ZIP" }),
-                        /* @__PURE__ */ jsx37("input", { type: "text", className: "form-control-frac", maxLength: 100, placeholder: "000000", value: (_j = cardData == null ? void 0 : cardData.zipCode) != null ? _j : "", onChange: (e) => handleCardChange("zipCode", e.target.value) }),
-                        (cardError == null ? void 0 : cardError.zipCode) && /* @__PURE__ */ jsx37("span", { className: "error-span", children: cardError == null ? void 0 : cardError.zipCode }),
-                        pass_fee && cardFeeAmount > 0 && /* @__PURE__ */ jsxs20("small", { className: "frac-fee-text", children: [
+                      /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
+                        /* @__PURE__ */ jsx36("label", { htmlFor: "zip", children: "ZIP" }),
+                        /* @__PURE__ */ jsx36("input", { type: "text", className: "form-control-frac", maxLength: 100, placeholder: "000000", value: (_j = cardData == null ? void 0 : cardData.zipCode) != null ? _j : "", onChange: (e) => handleCardChange("zipCode", e.target.value) }),
+                        (cardError == null ? void 0 : cardError.zipCode) && /* @__PURE__ */ jsx36("span", { className: "error-span", children: cardError == null ? void 0 : cardError.zipCode }),
+                        pass_fee && cardFeeAmount > 0 && /* @__PURE__ */ jsxs19("small", { className: "frac-fee-text", children: [
                           "Cards include a fee amount of ",
-                          /* @__PURE__ */ jsx37("span", { className: "frac-fee-amount", children: formatUSD(cardFeeAmount.toFixed(2)) }),
+                          /* @__PURE__ */ jsx36("span", { className: "frac-fee-amount", children: formatUSD(cardFeeAmount.toFixed(2)) }),
                           "."
                         ] })
                       ] }),
-                      customerId && /* @__PURE__ */ jsx37("div", { className: "form-group-frac", children: /* @__PURE__ */ jsxs20("div", { className: "frac-tooltip-mn", style: { display: "flex", alignItems: "center", gap: "10px", paddingTop: "10px" }, children: [
-                        /* @__PURE__ */ jsx37(
+                      customerId && /* @__PURE__ */ jsx36("div", { className: "form-group-frac", children: /* @__PURE__ */ jsxs19("div", { className: "frac-tooltip-mn", style: { display: "flex", alignItems: "center", gap: "10px", paddingTop: "10px" }, children: [
+                        /* @__PURE__ */ jsx36(
                           "input",
                           {
                             type: "checkbox",
@@ -11487,10 +11465,10 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
                             onChange: (e) => setSaveCardInfo(e.target.checked)
                           }
                         ),
-                        /* @__PURE__ */ jsx37("label", { htmlFor: "save_card", className: "toggle-label" }),
-                        /* @__PURE__ */ jsx37("label", { htmlFor: "save_card", children: "Save card for future payments  " }),
-                        /* @__PURE__ */ jsxs20("div", { className: "frac-tooltip-wrapper", children: [
-                          /* @__PURE__ */ jsx37("div", { className: "frac-tooltip-icon", children: /* @__PURE__ */ jsxs20(
+                        /* @__PURE__ */ jsx36("label", { htmlFor: "save_card", className: "toggle-label" }),
+                        /* @__PURE__ */ jsx36("label", { htmlFor: "save_card", children: "Save card for future payments  " }),
+                        /* @__PURE__ */ jsxs19("div", { className: "frac-tooltip-wrapper", children: [
+                          /* @__PURE__ */ jsx36("div", { className: "frac-tooltip-icon", children: /* @__PURE__ */ jsxs19(
                             "svg",
                             {
                               xmlns: "http://www.w3.org/2000/svg",
@@ -11499,8 +11477,8 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
                               viewBox: "0 0 20 20",
                               fill: "none",
                               children: [
-                                /* @__PURE__ */ jsx37("circle", { cx: "10", cy: "10", r: "10", fill: "#E0DFE2" }),
-                                /* @__PURE__ */ jsx37(
+                                /* @__PURE__ */ jsx36("circle", { cx: "10", cy: "10", r: "10", fill: "#E0DFE2" }),
+                                /* @__PURE__ */ jsx36(
                                   "path",
                                   {
                                     d: "M9.03406 12.0979V12.0072C9.04055 11.4153 9.10057 10.9443 9.21411 10.5943C9.3309 10.2442 9.49635 9.96102 9.71046 9.74463C9.92457 9.52824 10.1825 9.33095 10.4842 9.15274C10.6788 9.03182 10.854 8.89658 11.0097 8.74702C11.1655 8.59745 11.2887 8.42562 11.3796 8.2315C11.4704 8.03739 11.5158 7.82259 11.5158 7.58711C11.5158 7.3039 11.4477 7.05887 11.3114 6.85203C11.1752 6.64519 10.9935 6.48608 10.7664 6.3747C10.5426 6.26014 10.2928 6.20286 10.017 6.20286C9.76723 6.20286 9.52879 6.25378 9.3017 6.35561C9.07461 6.45744 8.88646 6.61655 8.73723 6.83294C8.588 7.04614 8.50203 7.3214 8.47932 7.65871H7C7.02271 7.08592 7.17032 6.60223 7.44282 6.20764C7.71533 5.80986 8.07543 5.50915 8.52311 5.30549C8.97405 5.10183 9.47202 5 10.017 5C10.6139 5 11.1363 5.10979 11.5839 5.32936C12.0316 5.54574 12.3788 5.84964 12.6253 6.24105C12.8751 6.62928 13 7.08274 13 7.60143C13 7.95784 12.9432 8.27924 12.8297 8.56563C12.7161 8.84885 12.5539 9.10183 12.3431 9.32458C12.1354 9.54733 11.8856 9.74463 11.5937 9.91647C11.3179 10.0851 11.0941 10.2601 10.9221 10.4415C10.7534 10.6229 10.6302 10.8377 10.5523 11.0859C10.4745 11.3341 10.4323 11.6412 10.4258 12.0072V12.0979H9.03406ZM9.76886 15C9.50284 15 9.27413 14.9077 9.08273 14.7232C8.89132 14.5354 8.79562 14.3095 8.79562 14.0453C8.79562 13.7844 8.89132 13.5617 9.08273 13.3771C9.27413 13.1893 9.50284 13.0955 9.76886 13.0955C10.0316 13.0955 10.2587 13.1893 10.4501 13.3771C10.6448 13.5617 10.7421 13.7844 10.7421 14.0453C10.7421 14.2204 10.6967 14.3811 10.6058 14.5274C10.5182 14.6706 10.4015 14.7852 10.2555 14.8711C10.1095 14.957 9.94728 15 9.76886 15Z",
@@ -11510,48 +11488,48 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
                               ]
                             }
                           ) }),
-                          /* @__PURE__ */ jsx37("div", { className: "frac-tooltip-text", children: /* @__PURE__ */ jsxs20("p", { children: [
+                          /* @__PURE__ */ jsx36("div", { className: "frac-tooltip-text", children: /* @__PURE__ */ jsxs19("p", { children: [
                             "If checked, I agree to give the ",
-                            /* @__PURE__ */ jsx37("b", { children: merchantName || "merchant" }),
+                            /* @__PURE__ */ jsx36("b", { children: merchantName || "merchant" }),
                             " permission to charge this credit card for agreed-upon purchases in the future."
                           ] }) })
                         ] })
                       ] }) })
                     ] }),
-                    /* @__PURE__ */ jsx37("div", { className: "form-group-frac", style: { marginTop: "20px", padding: "0" }, children: /* @__PURE__ */ jsx37("button", { type: "submit", style: { margin: 0, display: onSubmit ? "none" : "block" }, className: "pay-button", children: partialAmount ? formatUSD((_k = Number(partialAmount)) == null ? void 0 : _k.toFixed(2)) : formatUSD((_l = Number(amount)) == null ? void 0 : _l.toFixed(2)) }) })
+                    /* @__PURE__ */ jsx36("div", { className: "form-group-frac", style: { marginTop: "20px", padding: "0" }, children: /* @__PURE__ */ jsx36("button", { type: "submit", style: { margin: 0, display: onSubmit ? "none" : "block" }, className: "pay-button", children: partialAmount ? formatUSD((_k = Number(partialAmount)) == null ? void 0 : _k.toFixed(2)) : formatUSD((_l = Number(amount)) == null ? void 0 : _l.toFixed(2)) }) })
                   ] })
                 ] }),
-                /* @__PURE__ */ jsx37("div", { id: "ach", style: { display: activetab === "ach" ? "block" : "none" }, className: "tabcontent", children: /* @__PURE__ */ jsxs20(Fragment19, { children: [
-                  !onSubmit && /* @__PURE__ */ jsxs20("div", { className: "frac-heading-card-wrap", children: [
-                    /* @__PURE__ */ jsx37("div", { className: "frac-backarrow", children: (bankList == null ? void 0 : bankList.length) > 0 && activeinBank === "form" && /* @__PURE__ */ jsxs20("button", { className: "charge-payment-back-btn ", onClick: () => setActiveinBank("list"), children: [
+                /* @__PURE__ */ jsx36("div", { id: "ach", style: { display: activetab === "ach" ? "block" : "none" }, className: "tabcontent", children: /* @__PURE__ */ jsxs19(Fragment18, { children: [
+                  !onSubmit && /* @__PURE__ */ jsxs19("div", { className: "frac-heading-card-wrap", children: [
+                    /* @__PURE__ */ jsx36("div", { className: "frac-backarrow", children: (bankList == null ? void 0 : bankList.length) > 0 && activeinBank === "form" && /* @__PURE__ */ jsxs19("button", { className: "charge-payment-back-btn ", onClick: () => setActiveinBank("list"), children: [
                       " ",
-                      /* @__PURE__ */ jsx37(IoArrowBack2, {})
+                      /* @__PURE__ */ jsx36(IoArrowBack2, {})
                     ] }) }),
-                    /* @__PURE__ */ jsx37("h6", { className: "frac-card-payment-heading", children: "Bank Payment" })
+                    /* @__PURE__ */ jsx36("h6", { className: "frac-card-payment-heading", children: "Bank Payment" })
                   ] }),
-                  activeinBank === "list" && (bankList == null ? void 0 : bankList.length) > 0 ? /* @__PURE__ */ jsxs20(Fragment19, { children: [
-                    /* @__PURE__ */ jsx37(CardList, { headingClass: "card-ach-heading-frac", listHeading: "Banks", ListItems: bankList, selectedCard, setSelectedCard, handleDeleteCard, otherButtonLabel: "Pay With Other Bank", otherButtonAction: () => {
+                  activeinBank === "list" && (bankList == null ? void 0 : bankList.length) > 0 ? /* @__PURE__ */ jsxs19(Fragment18, { children: [
+                    /* @__PURE__ */ jsx36(CardList, { headingClass: "card-ach-heading-frac", listHeading: "Banks", ListItems: bankList, selectedCard, setSelectedCard, handleDeleteCard, otherButtonLabel: "Pay With Other Bank", otherButtonAction: () => {
                       setActiveinBank("form");
                     } }),
-                    /* @__PURE__ */ jsx37("div", { className: "form-group-frac", style: { padding: "0", display: onSubmit ? "none" : "block" }, children: /* @__PURE__ */ jsx37("button", { className: "pay-button", style: { margin: "0px" }, type: "submit", onClick: handlechargeCustomer, children: formatUSD((_m = Number(bankAmount)) == null ? void 0 : _m.toFixed(2)) }) })
-                  ] }) : /* @__PURE__ */ jsxs20("form", { id: "ACHPaymentForm", style: { textAlign: "start" }, ref: bankFormRef, onSubmit: submitFunc, autoComplete: "off", onKeyDown: (e) => {
+                    /* @__PURE__ */ jsx36("div", { className: "form-group-frac", style: { padding: "0", display: onSubmit ? "none" : "block" }, children: /* @__PURE__ */ jsx36("button", { className: "pay-button", style: { margin: "0px" }, type: "submit", onClick: handlechargeCustomer, children: formatUSD((_m = Number(bankAmount)) == null ? void 0 : _m.toFixed(2)) }) })
+                  ] }) : /* @__PURE__ */ jsxs19("form", { id: "ACHPaymentForm", style: { textAlign: "start" }, ref: bankFormRef, onSubmit: submitFunc, autoComplete: "off", onKeyDown: (e) => {
                     if (e.key === "Enter" && loading) {
                       e.preventDefault();
                       e.stopPropagation();
                     }
                   }, children: [
-                    /* @__PURE__ */ jsxs20("div", { className: "ach-scrl", style: {
+                    /* @__PURE__ */ jsxs19("div", { className: "ach-scrl", style: {
                       minHeight: "444px",
                       maxHeight: "444px"
                     }, children: [
-                      /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
-                        /* @__PURE__ */ jsx37("label", { htmlFor: "nameonaccount", children: "Name on account" }),
-                        /* @__PURE__ */ jsx37("input", { type: "text", id: "nameonaccount", className: "form-control-frac", maxLength: 100, placeholder: "John Doe", name: "name", value: (_n = achData == null ? void 0 : achData.name) != null ? _n : "", onChange: handleChangeAch }),
-                        (achError == null ? void 0 : achError.name) && /* @__PURE__ */ jsx37("span", { className: "error-span", children: achError == null ? void 0 : achError.name })
+                      /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
+                        /* @__PURE__ */ jsx36("label", { htmlFor: "nameonaccount", children: "Name on account" }),
+                        /* @__PURE__ */ jsx36("input", { type: "text", id: "nameonaccount", className: "form-control-frac", maxLength: 100, placeholder: "John Doe", name: "name", value: (_n = achData == null ? void 0 : achData.name) != null ? _n : "", onChange: handleChangeAch }),
+                        (achError == null ? void 0 : achError.name) && /* @__PURE__ */ jsx36("span", { className: "error-span", children: achError == null ? void 0 : achError.name })
                       ] }),
-                      /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
-                        /* @__PURE__ */ jsx37("label", { htmlFor: "routingnumber", children: "Routing number" }),
-                        /* @__PURE__ */ jsx37(
+                      /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
+                        /* @__PURE__ */ jsx36("label", { htmlFor: "routingnumber", children: "Routing number" }),
+                        /* @__PURE__ */ jsx36(
                           "input",
                           {
                             type: "text",
@@ -11564,11 +11542,11 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
                             onChange: handleChangeAch
                           }
                         ),
-                        (achError == null ? void 0 : achError.routingNumber) && /* @__PURE__ */ jsx37("span", { className: "error-span", children: achError == null ? void 0 : achError.routingNumber })
+                        (achError == null ? void 0 : achError.routingNumber) && /* @__PURE__ */ jsx36("span", { className: "error-span", children: achError == null ? void 0 : achError.routingNumber })
                       ] }),
-                      /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
-                        /* @__PURE__ */ jsx37("label", { htmlFor: "accountnumber", children: "Account number" }),
-                        /* @__PURE__ */ jsx37(
+                      /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
+                        /* @__PURE__ */ jsx36("label", { htmlFor: "accountnumber", children: "Account number" }),
+                        /* @__PURE__ */ jsx36(
                           "input",
                           {
                             type: "text",
@@ -11581,11 +11559,11 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
                             onChange: handleChangeAch
                           }
                         ),
-                        (achError == null ? void 0 : achError.accountNumber) && /* @__PURE__ */ jsx37("span", { className: "error-span", children: achError == null ? void 0 : achError.accountNumber })
+                        (achError == null ? void 0 : achError.accountNumber) && /* @__PURE__ */ jsx36("span", { className: "error-span", children: achError == null ? void 0 : achError.accountNumber })
                       ] }),
-                      /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
-                        /* @__PURE__ */ jsx37("label", { htmlFor: "confirmaccountnumber", children: "Confirm account number" }),
-                        /* @__PURE__ */ jsx37(
+                      /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
+                        /* @__PURE__ */ jsx36("label", { htmlFor: "confirmaccountnumber", children: "Confirm account number" }),
+                        /* @__PURE__ */ jsx36(
                           "input",
                           {
                             type: "text",
@@ -11598,11 +11576,11 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
                             onChange: handleChangeAch
                           }
                         ),
-                        (achError == null ? void 0 : achError.confirmAccountNumber) && /* @__PURE__ */ jsx37("span", { className: "error-span", children: achError == null ? void 0 : achError.confirmAccountNumber })
+                        (achError == null ? void 0 : achError.confirmAccountNumber) && /* @__PURE__ */ jsx36("span", { className: "error-span", children: achError == null ? void 0 : achError.confirmAccountNumber })
                       ] }),
-                      /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
-                        /* @__PURE__ */ jsx37("label", { htmlFor: "bankname", children: "Bank name" }),
-                        /* @__PURE__ */ jsx37(
+                      /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
+                        /* @__PURE__ */ jsx36("label", { htmlFor: "bankname", children: "Bank name" }),
+                        /* @__PURE__ */ jsx36(
                           "input",
                           {
                             type: "text",
@@ -11615,11 +11593,11 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
                             onChange: handleChangeAch
                           }
                         ),
-                        (achError == null ? void 0 : achError.bankName) && /* @__PURE__ */ jsx37("span", { className: "error-span", children: achError == null ? void 0 : achError.bankName })
+                        (achError == null ? void 0 : achError.bankName) && /* @__PURE__ */ jsx36("span", { className: "error-span", children: achError == null ? void 0 : achError.bankName })
                       ] }),
-                      ((achData == null ? void 0 : achData.accountType) === "business saving" || (achData == null ? void 0 : achData.accountType) === "business checking") && /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
-                        /* @__PURE__ */ jsx37("label", { htmlFor: "companyName", children: "Company name" }),
-                        /* @__PURE__ */ jsx37(
+                      ((achData == null ? void 0 : achData.accountType) === "business saving" || (achData == null ? void 0 : achData.accountType) === "business checking") && /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
+                        /* @__PURE__ */ jsx36("label", { htmlFor: "companyName", children: "Company name" }),
+                        /* @__PURE__ */ jsx36(
                           "input",
                           {
                             type: "text",
@@ -11632,60 +11610,60 @@ var ModelContentSky = ({ amount, bankAmount, submitBtnText = "Pay", session_toke
                             onChange: handleChangeAch
                           }
                         ),
-                        (achError == null ? void 0 : achError.companyName) && /* @__PURE__ */ jsx37("span", { className: "error-span", children: achError == null ? void 0 : achError.companyName })
+                        (achError == null ? void 0 : achError.companyName) && /* @__PURE__ */ jsx36("span", { className: "error-span", children: achError == null ? void 0 : achError.companyName })
                       ] }),
-                      /* @__PURE__ */ jsxs20("div", { className: "form-group-frac", children: [
-                        /* @__PURE__ */ jsx37("label", { htmlFor: "accounttype", children: "Select account type" }),
-                        /* @__PURE__ */ jsxs20("select", { name: "accountType", id: "accounttype", className: "form-control-frac", value: (_t = achData == null ? void 0 : achData.accountType) != null ? _t : "", onChange: handleChangeAch, children: [
-                          /* @__PURE__ */ jsx37("option", { value: "", children: "Select account" }),
-                          accountTypes.map((type) => /* @__PURE__ */ jsx37("option", { value: type.value, children: type.label }, type.value))
+                      /* @__PURE__ */ jsxs19("div", { className: "form-group-frac", children: [
+                        /* @__PURE__ */ jsx36("label", { htmlFor: "accounttype", children: "Select account type" }),
+                        /* @__PURE__ */ jsxs19("select", { name: "accountType", id: "accounttype", className: "form-control-frac", value: (_t = achData == null ? void 0 : achData.accountType) != null ? _t : "", onChange: handleChangeAch, children: [
+                          /* @__PURE__ */ jsx36("option", { value: "", children: "Select account" }),
+                          accountTypes.map((type) => /* @__PURE__ */ jsx36("option", { value: type.value, children: type.label }, type.value))
                         ] }),
-                        bankFeeAmount > 0 && /* @__PURE__ */ jsxs20("small", { className: "frac-fee-text", children: [
+                        bankFeeAmount > 0 && /* @__PURE__ */ jsxs19("small", { className: "frac-fee-text", children: [
                           "There is a processing fee of ",
-                          /* @__PURE__ */ jsx37("span", { className: "frac-fee-amount", children: formatUSD(bankFeeAmount.toFixed(2)) }),
+                          /* @__PURE__ */ jsx36("span", { className: "frac-fee-amount", children: formatUSD(bankFeeAmount.toFixed(2)) }),
                           "."
                         ] }),
-                        !saveACHinfo && /* @__PURE__ */ jsxs20(Fragment19, { children: [
-                          /* @__PURE__ */ jsxs20("div", { className: "form-group-frac save-ach-div", style: { paddingTop: "5px" }, children: [
-                            /* @__PURE__ */ jsx37("input", { type: "checkbox", id: "achconsent", className: "", checked: isBankConsentChecked, onChange: (e) => {
+                        !saveACHinfo && /* @__PURE__ */ jsxs19(Fragment18, { children: [
+                          /* @__PURE__ */ jsxs19("div", { className: "form-group-frac save-ach-div", style: { paddingTop: "5px" }, children: [
+                            /* @__PURE__ */ jsx36("input", { type: "checkbox", id: "achconsent", className: "", checked: isBankConsentChecked, onChange: (e) => {
                               setIsBankConsentChecked(e.target.checked);
                               if (e.target.checked) {
                                 setErrorBankConsent("");
                               }
                             } }),
-                            /* @__PURE__ */ jsx37("label", { className: "saveachlabel", htmlFor: "achconsent", children: `By selecting this box, I authorize SkyFi, on behalf of ${merchantName || "merchant"}, to initiate a one-time electronic ACH debit from my bank account for the total amount displayed on this screen, including any applicable processing fee. I confirm that I am authorized to use this account and that the bank account information I provided is correct.` })
+                            /* @__PURE__ */ jsx36("label", { className: "saveachlabel", htmlFor: "achconsent", children: `By selecting this box, I authorize SkyFi, on behalf of ${merchantName || "merchant"}, to initiate a one-time electronic ACH debit from my bank account for the total amount displayed on this screen, including any applicable processing fee. I confirm that I am authorized to use this account and that the bank account information I provided is correct.` })
                           ] }),
-                          errorBankConsent && /* @__PURE__ */ jsx37("span", { className: "error-span", children: errorBankConsent })
+                          errorBankConsent && /* @__PURE__ */ jsx36("span", { className: "error-span", children: errorBankConsent })
                         ] }),
-                        customerId && /* @__PURE__ */ jsxs20("div", { className: "form-group-frac save-ach-div", style: { paddingTop: "5px" }, children: [
-                          /* @__PURE__ */ jsx37("input", { type: "checkbox", id: "saveACH", className: "", maxLength: 100, placeholder: "My Bank", checked: saveACHinfo, onChange: (e) => {
+                        customerId && /* @__PURE__ */ jsxs19("div", { className: "form-group-frac save-ach-div", style: { paddingTop: "5px" }, children: [
+                          /* @__PURE__ */ jsx36("input", { type: "checkbox", id: "saveACH", className: "", maxLength: 100, placeholder: "My Bank", checked: saveACHinfo, onChange: (e) => {
                             setSaveACHinfo(e.target.checked);
                             if (!e.target.checked) {
                               setSaveACHConsent1(false);
                               setErrorBankConsentOther("");
                             }
                           } }),
-                          /* @__PURE__ */ jsx37("label", { className: "saveachlabel", htmlFor: "saveACH", children: "Save for future use" })
+                          /* @__PURE__ */ jsx36("label", { className: "saveachlabel", htmlFor: "saveACH", children: "Save for future use" })
                         ] }),
-                        saveACHinfo && /* @__PURE__ */ jsxs20(Fragment19, { children: [
-                          /* @__PURE__ */ jsxs20("div", { className: "form-group-frac save-ach-div", style: { paddingTop: "5px" }, children: [
-                            /* @__PURE__ */ jsx37("input", { type: "checkbox", id: "saveACHConsent1", className: "", maxLength: 100, placeholder: "My Bank", checked: saveACHConsent1, onChange: (e) => {
+                        saveACHinfo && /* @__PURE__ */ jsxs19(Fragment18, { children: [
+                          /* @__PURE__ */ jsxs19("div", { className: "form-group-frac save-ach-div", style: { paddingTop: "5px" }, children: [
+                            /* @__PURE__ */ jsx36("input", { type: "checkbox", id: "saveACHConsent1", className: "", maxLength: 100, placeholder: "My Bank", checked: saveACHConsent1, onChange: (e) => {
                               setSaveACHConsent1(e.target.checked);
                               if (e.target.checked) {
                                 setErrorBankConsentOther("");
                               }
                             } }),
-                            /* @__PURE__ */ jsxs20("label", { className: "saveachlabel", htmlFor: "saveACHConsent1", children: [
+                            /* @__PURE__ */ jsxs19("label", { className: "saveachlabel", htmlFor: "saveACHConsent1", children: [
                               "By providing my bank account information and selecting \u2018Save for future payments\u2019, I authorize ",
                               merchantName || "merchant",
                               "  to store my bank account details for future ACH payments. I understand that future payments may be initiated using this saved account in accordance with my instructions. I confirm I am authorized to use this bank account."
                             ] })
                           ] }),
-                          errorBankConsentOther && /* @__PURE__ */ jsx37("span", { className: "error-span", children: errorBankConsentOther })
+                          errorBankConsentOther && /* @__PURE__ */ jsx36("span", { className: "error-span", children: errorBankConsentOther })
                         ] })
                       ] })
                     ] }),
-                    /* @__PURE__ */ jsx37("div", { className: "form-group-frac ", children: /* @__PURE__ */ jsx37("button", { className: "pay-button", style: { margin: "20px 0 0", display: onSubmit ? "none" : "block" }, type: "submit", children: formatUSD((_u = Number(bankAmount)) == null ? void 0 : _u.toFixed(2)) }) })
+                    /* @__PURE__ */ jsx36("div", { className: "form-group-frac ", children: /* @__PURE__ */ jsx36("button", { className: "pay-button", style: { margin: "20px 0 0", display: onSubmit ? "none" : "block" }, type: "submit", children: formatUSD((_u = Number(bankAmount)) == null ? void 0 : _u.toFixed(2)) }) })
                   ] })
                 ] }) })
               ] })
@@ -11700,7 +11678,7 @@ var ModelContentSky_default = ModelContentSky;
 
 // src/app/components/Skysystemz/PayButtonWithForm.tsx
 import axios9 from "axios";
-import { Fragment as Fragment20, jsx as jsx38, jsxs as jsxs21 } from "react/jsx-runtime";
+import { Fragment as Fragment19, jsx as jsx37, jsxs as jsxs20 } from "react/jsx-runtime";
 var PaymentWidget = ({
   amount,
   bankAmount,
@@ -11721,15 +11699,15 @@ var PaymentWidget = ({
   isPartial,
   bankSurcharge,
   partialRef,
-  customCSS: customCSS2,
+  customCSS,
   disableSubmitBtn = false
 }) => {
-  const [show, setShow] = useState11(autoTrigger || false);
-  const [loading, setLoading] = useState11(false);
-  const [childHandleClose, setChildHandleClose] = useState11(() => () => {
+  const [show, setShow] = useState10(autoTrigger || false);
+  const [loading, setLoading] = useState10(false);
+  const [childHandleClose, setChildHandleClose] = useState10(() => () => {
   });
-  const [orderGuid, setOrderGuid] = useState11(null);
-  const [remainingAmount, setRemainingAmount] = useState11(null);
+  const [orderGuid, setOrderGuid] = useState10(null);
+  const [remainingAmount, setRemainingAmount] = useState10(null);
   const initialCommonProps = useMemo(
     () => ({
       amount,
@@ -11753,7 +11731,7 @@ var PaymentWidget = ({
       isPartial,
       bankSurcharge,
       partialRef,
-      customCSS: customCSS2,
+      customCSS,
       disableSubmitBtn
     }),
     [
@@ -11779,8 +11757,8 @@ var PaymentWidget = ({
       disableSubmitBtn
     ]
   );
-  const [commonProps, setCommonProps] = useState11(initialCommonProps);
-  useEffect18(() => {
+  const [commonProps, setCommonProps] = useState10(initialCommonProps);
+  useEffect16(() => {
     if (show) {
       setCommonProps(initialCommonProps);
     }
@@ -11811,35 +11789,33 @@ var PaymentWidget = ({
       setLoading(false);
     }
   };
-  useEffect18(() => {
+  useEffect16(() => {
     if (show && isPartial && partialRef) {
       getskyosOrderDetails();
     }
   }, [show, isPartial, partialRef]);
-  return /* @__PURE__ */ jsxs21(Fragment20, { children: [
-    /* @__PURE__ */ jsx38("link", { href: "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/css/all.min.css" }),
-    /* @__PURE__ */ jsx38(DataScript, {}),
-    /* @__PURE__ */ jsx38(FractalTokenizerScript, {}),
-    /* @__PURE__ */ jsx38(SkyChargewidgetstyles, {}),
-    /* @__PURE__ */ jsx38(CardBankRadioStyles, {}),
-    /* @__PURE__ */ jsx38(CustomModal2styles_default, {}),
-    /* @__PURE__ */ jsx38(DataCapScriptLoader, {}),
-    !autoTrigger && /* @__PURE__ */ jsxs21("button", { className: submitBtnClass || "paymentBtn", disabled: disableSubmitBtn, onClick: () => setShow(true), children: [
+  return /* @__PURE__ */ jsxs20(Fragment19, { children: [
+    /* @__PURE__ */ jsx37("link", { href: "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/css/all.min.css" }),
+    /* @__PURE__ */ jsx37(DataScript, {}),
+    /* @__PURE__ */ jsx37(SkyChargewidgetstyles, {}),
+    /* @__PURE__ */ jsx37(CardBankRadioStyles, {}),
+    /* @__PURE__ */ jsx37(CustomModal2styles_default, {}),
+    !autoTrigger && /* @__PURE__ */ jsxs20("button", { className: submitBtnClass || "paymentBtn", disabled: disableSubmitBtn, onClick: () => setShow(true), children: [
       submitBtnText,
       submitBtnIcon
     ] }),
-    !autoTrigger ? /* @__PURE__ */ jsx38(CustomModal2_default, { open: show, onClose: childHandleClose, children: /* @__PURE__ */ jsx38(ModelContentSky_default, __spreadProps(__spreadValues({ show, loadingPrev: loading }, commonProps), { orderGuid, remainingAmount })) }) : /* @__PURE__ */ jsx38(ModelContentSky_default, __spreadProps(__spreadValues({ show, loadingPrev: loading }, commonProps), { orderGuid, remainingAmount }))
+    !autoTrigger ? /* @__PURE__ */ jsx37(CustomModal2_default, { open: show, onClose: childHandleClose, children: /* @__PURE__ */ jsx37(ModelContentSky_default, __spreadProps(__spreadValues({ show, loadingPrev: loading }, commonProps), { orderGuid, remainingAmount })) }) : /* @__PURE__ */ jsx37(ModelContentSky_default, __spreadProps(__spreadValues({ show, loadingPrev: loading }, commonProps), { orderGuid, remainingAmount }))
   ] });
 };
 
 // src/app/components/Skysystemz/EmbeddedCheckout.tsx
-import { useEffect as useEffect20, useState as useState12, useMemo as useMemo2 } from "react";
+import { useEffect as useEffect18, useState as useState11, useMemo as useMemo2 } from "react";
 import axios10 from "axios";
 
 // src/app/components/Skysystemz/EmbeddedCheckoutStyles.tsx
-import { jsx as jsx39 } from "react/jsx-runtime";
+import { jsx as jsx38 } from "react/jsx-runtime";
 function EmbeddedCheckoutStyles({ extraCustomCSS }) {
-  return /* @__PURE__ */ jsx39("style", { children: `
+  return /* @__PURE__ */ jsx38("style", { children: `
 
             .pay-amount-conatiner{
             margin-top: 20px !important;
@@ -12185,27 +12161,27 @@ padding:0px !important;
 }
 
 // src/app/components/Atoms/Applepay/ApplePayScriptLoader.tsx
-import { useEffect as useEffect19 } from "react";
+import { useEffect as useEffect17 } from "react";
 var applePayScriptLoaded = false;
 var ApplePayScriptLoader = () => {
-  useEffect19(() => {
+  useEffect17(() => {
     if (applePayScriptLoaded) return;
     const existingScript = document.querySelector(
       `script[src="https://applepay.cdn-apple.com/jsapi/v1/apple-pay-sdk.js"]`
     );
     if (!existingScript) {
-      const script2 = document.createElement("script");
-      script2.src = "https://applepay.cdn-apple.com/jsapi/v1/apple-pay-sdk.js";
-      script2.async = true;
-      script2.onload = () => {
+      const script = document.createElement("script");
+      script.src = "https://applepay.cdn-apple.com/jsapi/v1/apple-pay-sdk.js";
+      script.async = true;
+      script.onload = () => {
         console.log("\u2705 Apple Pay script loaded");
         applePayScriptLoaded = true;
         console.log("ApplePaySession:", window.ApplePaySession);
       };
-      script2.onerror = (err) => {
+      script.onerror = (err) => {
         console.error("\u274C Apple Pay script failed", err);
       };
-      document.head.appendChild(script2);
+      document.head.appendChild(script);
     } else {
       applePayScriptLoaded = true;
     }
@@ -12214,7 +12190,7 @@ var ApplePayScriptLoader = () => {
 };
 
 // src/app/components/Skysystemz/EmbeddedCheckout.tsx
-import { Fragment as Fragment21, jsx as jsx40, jsxs as jsxs22 } from "react/jsx-runtime";
+import { Fragment as Fragment20, jsx as jsx39, jsxs as jsxs21 } from "react/jsx-runtime";
 var EmbeddedCheckout = ({
   amount,
   bankAmount,
@@ -12237,14 +12213,15 @@ var EmbeddedCheckout = ({
   partialRef,
   onSubmit,
   onLoad,
-  customCSS: customCSS2
+  customCSS
 }) => {
-  const [show, setShow] = useState12(false);
-  const [loading, setLoading] = useState12(false);
-  const [childHandleClose, setChildHandleClose] = useState12(() => () => {
+  const [show, setShow] = useState11(false);
+  const [loading, setLoading] = useState11(false);
+  const [childHandleClose, setChildHandleClose] = useState11(() => () => {
   });
-  const [orderGuid, setOrderGuid] = useState12(null);
-  const [remainingAmount, setRemainingAmount] = useState12(null);
+  const [orderGuid, setOrderGuid] = useState11(null);
+  const [remainingAmount, setRemainingAmount] = useState11(null);
+  const [isTokenizerReady, setTokenizerReady] = useState11(false);
   const initialCommonProps = useMemo2(
     () => ({
       amount,
@@ -12291,8 +12268,8 @@ var EmbeddedCheckout = ({
       partialRef
     ]
   );
-  const [commonProps, setCommonProps] = useState12(initialCommonProps);
-  useEffect20(() => {
+  const [commonProps, setCommonProps] = useState11(initialCommonProps);
+  useEffect18(() => {
     if (show) {
       setCommonProps(initialCommonProps);
     }
@@ -12323,13 +12300,13 @@ var EmbeddedCheckout = ({
       setLoading(false);
     }
   };
-  useEffect20(() => {
-    if (show && isPartial && partialRef) {
+  useEffect18(() => {
+    if (autoTrigger && isPartial && partialRef) {
       getskyosOrderDetails();
     }
-  }, [show, isPartial, partialRef]);
+  }, [autoTrigger, isPartial, partialRef]);
   console.log(onLoad, "onLoad");
-  useEffect20(() => {
+  useEffect18(() => {
     const supported = !!window.ApplePaySession;
     let canPay = false;
     if (supported) {
@@ -12340,21 +12317,19 @@ var EmbeddedCheckout = ({
     }
     console.log(`ApplePaySession: ${supported}, canMakePayments: ${canPay}`);
   }, []);
-  return /* @__PURE__ */ jsxs22(Fragment21, { children: [
-    /* @__PURE__ */ jsx40("link", { href: "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/css/all.min.css" }),
-    /* @__PURE__ */ jsx40(DataScript, {}),
-    /* @__PURE__ */ jsx40(FractalTokenizerScript, {}),
-    /* @__PURE__ */ jsx40(SkyChargewidgetstyles, {}),
-    /* @__PURE__ */ jsx40(CardBankRadioStyles, {}),
-    /* @__PURE__ */ jsx40(CustomModal2styles_default, {}),
-    /* @__PURE__ */ jsx40(DataCapScriptLoader, {}),
-    /* @__PURE__ */ jsx40(ApplePayScriptLoader, {}),
-    /* @__PURE__ */ jsx40(EmbeddedCheckoutStyles, { extraCustomCSS: customCSS2 }),
-    !autoTrigger && /* @__PURE__ */ jsxs22("button", { className: submitBtnClass || "paymentBtn", onClick: () => setShow(true), children: [
+  return /* @__PURE__ */ jsxs21(Fragment20, { children: [
+    /* @__PURE__ */ jsx39("link", { href: "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/css/all.min.css" }),
+    /* @__PURE__ */ jsx39(DataScript, {}),
+    /* @__PURE__ */ jsx39(SkyChargewidgetstyles, {}),
+    /* @__PURE__ */ jsx39(CardBankRadioStyles, {}),
+    /* @__PURE__ */ jsx39(CustomModal2styles_default, {}),
+    /* @__PURE__ */ jsx39(ApplePayScriptLoader, {}),
+    /* @__PURE__ */ jsx39(EmbeddedCheckoutStyles, { extraCustomCSS: customCSS }),
+    !autoTrigger && /* @__PURE__ */ jsxs21("button", { className: submitBtnClass || "paymentBtn", onClick: () => setShow(true), children: [
       submitBtnText,
       submitBtnIcon
     ] }),
-    !autoTrigger ? /* @__PURE__ */ jsx40(CustomModal2_default, { open: show, onClose: childHandleClose, children: /* @__PURE__ */ jsx40(ModelContentSky_default, __spreadProps(__spreadValues({ onLoad, onSubmit, show, loadingPrev: loading }, commonProps), { orderGuid, remainingAmount })) }) : /* @__PURE__ */ jsx40(ModelContentSky_default, __spreadProps(__spreadValues({ onLoad, onSubmit, show, loadingPrev: loading }, commonProps), { orderGuid, remainingAmount }))
+    !autoTrigger ? /* @__PURE__ */ jsx39(CustomModal2_default, { open: show, onClose: childHandleClose, children: /* @__PURE__ */ jsx39(ModelContentSky_default, __spreadProps(__spreadValues({ onLoad, onSubmit, show, loadingPrev: loading }, commonProps), { orderGuid, remainingAmount })) }) : /* @__PURE__ */ jsx39(ModelContentSky_default, __spreadProps(__spreadValues({ onLoad, onSubmit, show, loadingPrev: loading }, commonProps), { orderGuid, remainingAmount }))
   ] });
 };
 export {