@odus/checkout 0.30.0-beta.3 → 0.30.0

package/dist/checkout.es.js

@@ -1,4 +1,4 @@
-import { l as fe, c as me, a as ye, f as q, d as be, C as A, I as pe, b as P, g as ve, S as _, e as ee, H as Se, V as te, h as D, A as Ce, P as Ee, E as Fe, i as Me, j as Ne, k as we, m as Pe, n as ke, o as Ae, F as xe, p as De, q as Ie } from "./shared.js";
+import { l as fe, c as me, a as ye, f as j, d as be, C as A, I as pe, b as P, g as ve, S as _, e as ee, H as Se, V as te, h as D, A as Ce, P as Ee, E as Fe, i as Me, j as Ne, k as we, m as Pe, n as ke, o as Ae, F as xe, p as De, q as Ie } from "./shared.js";
 import { r as _t, s as Rt, t as Bt, u as Ut, v as Ot, w as Ht, x as zt, y as $t } from "./shared.js";
 const F = {
   // Checkout lifecycle events
@@ -20,30 +20,30 @@ const F = {
   PAYMENT_AUTHORIZATION_TIME: "payment.authorization_time",
   CHECKOUT_LOAD_TIME: "checkout.load_time",
   FORM_RENDER_TIME: "form.render_time"
-}, Te = /^\s*at (?:(.+?) ?\()?((?:file|https?|chrome-extension|webpack-internal):\/\/.+?):(\d+):(\d+)\)?\s*$/, Le = /^([^@]+)@((?:file|https?|chrome-extension|webpack-internal):\/\/[^\s:]+):(\d+):(\d+)$/, Ve = /^(?:([^@]+)@)?((?:file|https?):\/\/[^\s:]+):(\d+):(\d+)$/, Z = (i) => {
-  if (!i)
+}, Te = /^\s*at (?:(.+?) ?\()?((?:file|https?|chrome-extension|webpack-internal):\/\/.+?):(\d+):(\d+)\)?\s*$/, Le = /^([^@]+)@((?:file|https?|chrome-extension|webpack-internal):\/\/[^\s:]+):(\d+):(\d+)$/, Ve = /^(?:([^@]+)@)?((?:file|https?):\/\/[^\s:]+):(\d+):(\d+)$/, Z = (n) => {
+  if (!n)
     return [];
-  const e = [], t = i.split(`
+  const e = [], t = n.split(`
 `);
   for (const s of t) {
     const a = s.trim();
     if (!a)
       continue;
-    let n = Te.exec(a);
-    if (n) {
+    let i = Te.exec(a);
+    if (i) {
       e.push({
-        function: n[1] || "(anonymous)",
-        filename: n[2],
-        lineno: parseInt(n[3], 10),
-        colno: parseInt(n[4], 10)
+        function: i[1] || "(anonymous)",
+        filename: i[2],
+        lineno: parseInt(i[3], 10),
+        colno: parseInt(i[4], 10)
       });
       continue;
     }
-    n = Le.exec(a) ?? Ve.exec(a), n && e.push({
-      function: n[1] || "(anonymous)",
-      filename: n[2],
-      lineno: parseInt(n[3], 10),
-      colno: parseInt(n[4], 10)
+    i = Le.exec(a) ?? Ve.exec(a), i && e.push({
+      function: i[1] || "(anonymous)",
+      filename: i[2],
+      lineno: parseInt(i[3], 10),
+      colno: parseInt(i[4], 10)
     });
   }
   return e;
@@ -52,10 +52,10 @@ let z, $, X;
 const Be = () => {
   if (typeof navigator > "u")
     return {};
-  const i = navigator.userAgent;
+  const n = navigator.userAgent;
   let e, t, s;
-  i.includes("Firefox/") ? (e = "Firefox", t = i.match(/Firefox\/([\d.]+)/)?.[1]) : i.includes("Edg/") ? (e = "Edge", t = i.match(/Edg\/([\d.]+)/)?.[1]) : i.includes("Chrome/") ? (e = "Chrome", t = i.match(/Chrome\/([\d.]+)/)?.[1]) : i.includes("Safari/") && (e = "Safari", t = i.match(/Version\/([\d.]+)/)?.[1]), i.includes("Windows") ? s = "Windows" : i.includes("Mac OS") ? s = "macOS" : i.includes("Linux") ? s = "Linux" : i.includes("Android") ? s = "Android" : (i.includes("iPhone") || i.includes("iPad")) && (s = "iOS");
-  const a = /Mobi|Android|iPhone|iPad/i.test(i) || void 0;
+  n.includes("Firefox/") ? (e = "Firefox", t = n.match(/Firefox\/([\d.]+)/)?.[1]) : n.includes("Edg/") ? (e = "Edge", t = n.match(/Edg\/([\d.]+)/)?.[1]) : n.includes("Chrome/") ? (e = "Chrome", t = n.match(/Chrome\/([\d.]+)/)?.[1]) : n.includes("Safari/") && (e = "Safari", t = n.match(/Version\/([\d.]+)/)?.[1]), n.includes("Windows") ? s = "Windows" : n.includes("Mac OS") ? s = "macOS" : n.includes("Linux") ? s = "Linux" : n.includes("Android") ? s = "Android" : (n.includes("iPhone") || n.includes("iPad")) && (s = "iOS");
+  const a = /Mobi|Android|iPhone|iPad/i.test(n) || void 0;
   return {
     name: e,
     version: t,
@@ -64,21 +64,21 @@ const Be = () => {
     language: navigator.language,
     viewportWidth: String(window.innerWidth),
     viewportHeight: String(window.innerHeight),
-    userAgent: i
+    userAgent: n
   };
-}, Ue = () => typeof window > "u" ? {} : { url: window.location.href }, Oe = (i) => {
-  z = void 0, X = void 0, $ = i.sessionTracking?.session ? { id: i.sessionTracking.session.id } : void 0;
-}, He = (i) => {
-  z = i;
+}, Ue = () => typeof window > "u" ? {} : { url: window.location.href }, Oe = (n) => {
+  z = void 0, X = void 0, $ = n.sessionTracking?.session ? { id: n.sessionTracking.session.id } : void 0;
+}, He = (n) => {
+  z = n;
 }, ze = () => {
   z = void 0;
-}, $e = (i) => {
-  $ = i;
-}, Ke = (i) => {
-  X = i;
-}, qe = () => $?.id, je = (i) => ({
+}, $e = (n) => {
+  $ = n;
+}, Ke = (n) => {
+  X = n;
+}, je = () => $?.id, qe = (n) => ({
   sdk: { name: _e, version: Re },
-  app: i.app,
+  app: n.app,
   user: z,
   session: $,
   page: Ue(),
@@ -86,18 +86,18 @@ const Be = () => {
   view: X
 }), We = 30, Ye = 250, Ge = 6e4;
 let I = [], k = null, Q = 0, R = null, B = null;
-const Ze = (i) => {
+const Ze = (n) => {
   if (k)
     return;
-  const e = i.batching?.sendTimeout ?? Ye;
+  const e = n.batching?.sendTimeout ?? Ye;
   k = setTimeout(() => {
-    K(i);
+    K(n);
   }, e);
-}, Je = (i, e) => {
+}, Je = (n, e) => {
   const t = {
-    meta: je(e)
+    meta: qe(e)
   };
-  for (const s of i)
+  for (const s of n)
     switch (s.type) {
       case "exception":
         (t.exceptions ??= []).push(s.payload);
@@ -113,11 +113,11 @@ const Ze = (i) => {
         break;
     }
   return t;
-}, Xe = (i, e, t = !1) => {
-  const s = JSON.stringify(i), a = qe(), n = {
+}, Xe = (n, e, t = !1) => {
+  const s = JSON.stringify(n), a = je(), i = {
     "Content-Type": "application/json"
   };
-  if (a && (n["x-faro-session-id"] = a), t && typeof navigator < "u" && navigator.sendBeacon) {
+  if (a && (i["x-faro-session-id"] = a), t && typeof navigator < "u" && navigator.sendBeacon) {
     const o = new Blob([s], { type: "application/json" });
     navigator.sendBeacon(e, o);
     return;
@@ -125,7 +125,7 @@ const Ze = (i) => {
   const r = s.length < Ge;
   fetch(e, {
     method: "POST",
-    headers: n,
+    headers: i,
     body: s,
     keepalive: r
   }).then((o) => {
@@ -135,7 +135,7 @@ const Ze = (i) => {
     }
   }).catch(() => {
   });
-}, K = (i, e = !1) => {
+}, K = (n, e = !1) => {
   if (k && (clearTimeout(k), k = null), I.length === 0)
     return;
   if (Date.now() < Q) {
@@ -145,35 +145,35 @@ const Ze = (i) => {
   const t = I;
   I = [];
   try {
-    let s = Je(t, i);
-    if (i.beforeSend) {
-      const a = i.beforeSend(s);
+    let s = Je(t, n);
+    if (n.beforeSend) {
+      const a = n.beforeSend(s);
       if (!a)
         return;
       s = a;
     }
-    Xe(s, i.url, e);
+    Xe(s, n.url, e);
   } catch {
   }
-}, w = (i, e) => {
-  I.push(i);
+}, w = (n, e) => {
+  I.push(n);
   const t = e.batching?.itemLimit ?? We;
   if (I.length >= t) {
     K(e);
     return;
   }
   Ze(e);
-}, Qe = (i) => {
+}, Qe = (n) => {
   if (I = [], Q = 0, k && (clearTimeout(k), k = null), typeof document > "u")
     return;
   R && document.removeEventListener("visibilitychange", R), B && window.removeEventListener("pagehide", B);
-  const e = () => K(i, !0);
+  const e = () => K(n, !0);
   R = () => {
     document.visibilityState === "hidden" && e();
   }, B = e, document.addEventListener("visibilitychange", R), window.addEventListener("pagehide", B);
 }, ne = () => (/* @__PURE__ */ new Date()).toISOString();
 let ie = null, ae = null;
-const et = (i) => {
+const et = (n) => {
   typeof window > "u" || (ie = (e) => {
     const t = e.error instanceof Error ? e.error : new Error(e.message);
     w({
@@ -184,7 +184,7 @@ const et = (i) => {
         timestamp: ne(),
         stacktrace: t.stack ? { frames: Z(t.stack) } : void 0
       }
-    }, i);
+    }, n);
   }, ae = (e) => {
     const t = e.reason, s = t instanceof Error ? t : new Error(String(t));
     w({
@@ -196,38 +196,38 @@ const et = (i) => {
         stacktrace: s.stack ? { frames: Z(s.stack) } : void 0,
         context: { source: "unhandledrejection" }
       }
-    }, i);
+    }, n);
   }, window.addEventListener("error", ie), window.addEventListener("unhandledrejection", ae));
-}, re = "odus_telemetry_session_id", j = () => {
-  const i = new Uint8Array(16);
-  return crypto.getRandomValues(i), Array.from(i, (e) => e.toString(16).padStart(2, "0")).join("");
-}, tt = (i) => {
-  if (i)
-    return i;
+}, re = "odus_telemetry_session_id", q = () => {
+  const n = new Uint8Array(16);
+  return crypto.getRandomValues(n), Array.from(n, (e) => e.toString(16).padStart(2, "0")).join("");
+}, tt = (n) => {
+  if (n)
+    return n;
   if (typeof sessionStorage > "u")
-    return j();
+    return q();
   try {
     const e = sessionStorage.getItem(re);
     if (e)
       return e;
-    const t = j();
+    const t = q();
     return sessionStorage.setItem(re, t), t;
   } catch {
-    return j();
+    return q();
   }
-}, st = (i) => {
-  if (!i.sessionTracking?.enabled)
+}, st = (n) => {
+  if (!n.sessionTracking?.enabled)
     return;
-  const e = tt(i.sessionTracking.session?.id);
+  const e = tt(n.sessionTracking.session?.id);
   $e({ id: e });
-}, W = () => (/* @__PURE__ */ new Date()).toISOString(), Y = (i, e) => {
-  if (typeof PerformanceObserver > "u" || !PerformanceObserver.supportedEntryTypes?.includes(i))
+}, W = () => (/* @__PURE__ */ new Date()).toISOString(), Y = (n, e) => {
+  if (typeof PerformanceObserver > "u" || !PerformanceObserver.supportedEntryTypes?.includes(n))
     return;
   new PerformanceObserver((s) => {
     for (const a of s.getEntries())
       e(a);
-  }).observe({ type: i, buffered: !0 });
-}, nt = (i) => {
+  }).observe({ type: n, buffered: !0 });
+}, nt = (n) => {
   if (typeof window > "u")
     return;
   Y("largest-contentful-paint", (t) => {
@@ -238,7 +238,7 @@ const et = (i) => {
         values: { lcp: t.startTime },
         timestamp: W()
       }
-    }, i);
+    }, n);
   });
   let e = 0;
   Y("layout-shift", (t) => {
@@ -250,7 +250,7 @@ const et = (i) => {
         values: { cls: e },
         timestamp: W()
       }
-    }, i));
+    }, n));
   }), Y("event", (t) => {
     const s = t;
     s.duration > 0 && w({
@@ -260,20 +260,20 @@ const et = (i) => {
         values: { inp: s.duration },
         timestamp: W()
       }
-    }, i);
+    }, n);
   });
 }, H = {
   INFO: "info",
   WARN: "warn",
   ERROR: "error"
-}, U = () => (/* @__PURE__ */ new Date()).toISOString(), it = (i) => {
-  Oe(i), Qe(i);
-  const e = i.instrumentations ?? {
+}, U = () => (/* @__PURE__ */ new Date()).toISOString(), it = (n) => {
+  Oe(n), Qe(n);
+  const e = n.instrumentations ?? {
     errors: !0,
     webVitals: !0,
     session: !0
   };
-  return e.session !== !1 && st(i), e.errors !== !1 && et(i), e.webVitals !== !1 && nt(i), {
+  return e.session !== !1 && st(n), e.errors !== !1 && et(n), e.webVitals !== !1 && nt(n), {
     pushError(t, s) {
       w({
         type: "exception",
@@ -284,7 +284,7 @@ const et = (i) => {
           stacktrace: t.stack ? { frames: Z(t.stack) } : void 0,
           context: s?.context
         }
-      }, i);
+      }, n);
     },
     pushEvent(t, s) {
       w({
@@ -294,7 +294,7 @@ const et = (i) => {
           timestamp: U(),
           attributes: s
         }
-      }, i);
+      }, n);
     },
     pushMeasurement(t) {
       w({
@@ -305,7 +305,7 @@ const et = (i) => {
           timestamp: U(),
           context: t.context
         }
-      }, i);
+      }, n);
     },
     pushLog(t, s) {
       w({
@@ -316,7 +316,7 @@ const et = (i) => {
           timestamp: U(),
           context: s?.context
         }
-      }, i);
+      }, n);
     },
     setUser(t) {
       He(t);
@@ -328,33 +328,33 @@ const et = (i) => {
       Ke(t);
     },
     flush() {
-      K(i);
+      K(n);
     }
   };
-}, at = (i) => i === "test" ? "https://sandbox-analytics.odus.com/collect" : "https://analytics.odus.com/collect", rt = () => {
+}, at = (n) => n === "test" ? "https://sandbox-analytics.odus.com/collect" : "https://analytics.odus.com/collect", rt = () => {
   if (typeof window > "u")
     return !1;
-  const i = window.location.hostname;
-  return i === "localhost" || i === "127.0.0.1" || i === "0.0.0.0" || i === "::1" || i === "[::1]" || i.endsWith(".localhost");
+  const n = window.location.hostname;
+  return n === "localhost" || n === "127.0.0.1" || n === "0.0.0.0" || n === "::1" || n === "[::1]" || n.endsWith(".localhost");
 };
 let C = null;
-const ot = (i) => {
+const ot = (n) => {
   if (C)
     return C;
   if (rt())
     return null;
-  const e = at(i.environment);
+  const e = at(n.environment);
   return C = it({
     url: e,
     app: {
       name: "odus-checkout",
-      environment: i.environment === "test" ? "sandbox" : "production"
+      environment: n.environment === "test" ? "sandbox" : "production"
     },
     isolate: !0,
     sessionTracking: {
       enabled: !0,
       session: {
-        id: i.sessionId
+        id: n.sessionId
       }
     },
     beforeSend: (t) => {
@@ -368,35 +368,35 @@ const ot = (i) => {
             "card",
             "cvv",
             "pan"
-          ].forEach((n) => {
-            s.searchParams.has(n) && s.searchParams.set(n, "[REDACTED]");
+          ].forEach((i) => {
+            s.searchParams.has(i) && s.searchParams.set(i, "[REDACTED]");
           }), t.meta.view.name = s.toString();
         } catch {
         }
       return t;
     }
   }), C;
-}, lt = (i, e) => {
-  C && C.pushError(i, { context: e });
-}, M = (i, e) => {
-  C && C.pushEvent(i, e);
-}, oe = (i, e, t, s) => {
+}, lt = (n, e) => {
+  C && C.pushError(n, { context: e });
+}, M = (n, e) => {
+  C && C.pushEvent(n, e);
+}, oe = (n, e, t, s) => {
   C && C.pushMeasurement({
-    type: i,
-    values: { [i]: e },
+    type: n,
+    values: { [n]: e },
     context: {
       ...t && { unit: t },
       ...s
     }
   });
-}, Tt = (i, e = "info", t) => {
+}, Tt = (n, e = "info", t) => {
   if (!C) return;
   const s = {
     info: H.INFO,
     warn: H.WARN,
     error: H.ERROR
   };
-  C.pushLog([i], {
+  C.pushLog([n], {
     level: s[e],
     context: t
   });
@@ -441,7 +441,7 @@ class L {
     if (!this.vgsForm)
       throw new Error("VGS form not initialized");
     if (e.cardNumber) {
-      const n = this.vgsForm.cardNumberField(e.cardNumber, {
+      const i = this.vgsForm.cardNumberField(e.cardNumber, {
         placeholder: s.cardNumber,
         autoComplete: "cc-number",
         validations: ["required", "validCardNumber"],
@@ -481,12 +481,12 @@ class L {
         ],
         css: t.cardNumber
       });
-      n.on("update", (r) => {
+      i.on("update", (r) => {
         a && a(L.mapCardType(r.cardType));
-      }), this.fields.push(n);
+      }), this.fields.push(i);
     }
     if (e.cardExpiry) {
-      const n = this.vgsForm.cardExpirationDateField(
+      const i = this.vgsForm.cardExpirationDateField(
         e.cardExpiry,
         {
           placeholder: s.cardExpiry,
@@ -501,19 +501,19 @@ class L {
           css: t.cardExpiry
         }
       );
-      this.fields.push(n);
+      this.fields.push(i);
     }
     if (e.cardCvv) {
-      const n = this.vgsForm.cardCVCField(e.cardCvv, {
+      const i = this.vgsForm.cardCVCField(e.cardCvv, {
         placeholder: s.cardCvv,
         autoComplete: "cc-csc",
         validations: ["required", "validCardSecurityCode"],
         css: t.cardCvv
       });
-      this.fields.push(n);
+      this.fields.push(i);
     }
     if (e.cardholderName) {
-      const n = this.vgsForm.cardholderNameField(
+      const i = this.vgsForm.cardholderNameField(
         e.cardholderName,
         {
           placeholder: s.cardholderName,
@@ -522,7 +522,7 @@ class L {
           css: t.cardholderName
         }
       );
-      this.fields.push(n);
+      this.fields.push(i);
     }
   }
   waitForFieldsReady() {
@@ -535,7 +535,7 @@ class L {
     return new Promise((s, a) => {
       t.createCard(
         { auth: e },
-        (n, r) => {
+        (i, r) => {
           if (r?.errors) {
             a(r.errors);
             return;
@@ -545,14 +545,14 @@ class L {
             a(new Error("Card creation failed: no card ID returned"));
             return;
           }
-          if (n === 303) {
+          if (i === 303) {
             this.patchCard(e, o.id).then(s).catch(a);
             return;
           }
           s(L.extractCardResult(o));
         },
-        (n) => {
-          a(n);
+        (i) => {
+          a(i);
         }
       );
     });
@@ -561,7 +561,7 @@ class L {
     if (!this.vgsForm || !this.environment)
       return Promise.reject(new Error("VGS not initialized"));
     const s = this.vgsForm;
-    return new Promise((a, n) => {
+    return new Promise((a, i) => {
       s.submit(
         `/cards/${t}`,
         {
@@ -584,22 +584,22 @@ class L {
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         (r, o) => {
           if (r >= 400 || o?.errors) {
-            n(o?.errors ?? new Error("Card update failed"));
+            i(o?.errors ?? new Error("Card update failed"));
             return;
           }
           const d = o?.data;
           if (!d?.id) {
-            n(new Error("Card update failed: no card ID returned"));
+            i(new Error("Card update failed: no card ID returned"));
             return;
           }
-          const c = L.extractCardResult(d), u = o.included?.find(
+          const c = L.extractCardResult(d), m = o.included?.find(
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
             (S) => S.type === "card_updates"
           );
-          u?.attributes?.updated_values?.length && (c.updatedValues = u.attributes.updated_values), a(c);
+          m?.attributes?.updated_values?.length && (c.updatedValues = m.attributes.updated_values), a(c);
         },
         (r) => {
-          n(r);
+          i(r);
         }
       );
     });
@@ -633,11 +633,11 @@ class L {
     }[e] ?? "unknown" : "unknown";
   }
 }
-function G(i) {
+function G(n) {
   return {
     name: "Custom Appearance",
-    additionalPaymentMethods: i.additionalPaymentMethods || {},
-    styles: i.styles || {
+    additionalPaymentMethods: n.additionalPaymentMethods || {},
+    styles: n.styles || {
       fontSize: 14,
       textColor: "#000000",
       buttonColor: "#0070f3",
@@ -647,102 +647,104 @@ function G(i) {
       buttonFontSize: 16
     },
     layout: {
-      grouped: i.layout?.grouped,
-      actionButton: i.layout?.actionButton || {
+      grouped: n.layout?.grouped,
+      actionButton: n.layout?.actionButton || {
         translationKey: null
       },
-      phoneNumber: i.layout?.phoneNumber ? {
-        enabled: i.layout.phoneNumber.enabled,
-        label: i.layout.phoneNumber.label,
-        defaultCountry: i.layout.phoneNumber.defaultCountry,
-        allowedCountries: i.layout.phoneNumber.allowedCountries
+      phoneNumber: n.layout?.phoneNumber ? {
+        enabled: n.layout.phoneNumber.enabled,
+        label: n.layout.phoneNumber.label,
+        defaultCountry: n.layout.phoneNumber.defaultCountry,
+        allowedCountries: n.layout.phoneNumber.allowedCountries
       } : void 0,
       billingFields: {
         street: {
-          enabled: i.layout?.billingFields?.street?.enabled ?? !1,
-          label: i.layout?.billingFields?.street?.label
+          enabled: n.layout?.billingFields?.street?.enabled ?? !1,
+          label: n.layout?.billingFields?.street?.label,
+          maxLength: n.layout?.billingFields?.street?.maxLength
         },
         city: {
-          enabled: i.layout?.billingFields?.city?.enabled ?? !1,
-          label: i.layout?.billingFields?.city?.label
+          enabled: n.layout?.billingFields?.city?.enabled ?? !1,
+          label: n.layout?.billingFields?.city?.label
         },
         state: {
-          enabled: i.layout?.billingFields?.state?.enabled ?? !1,
-          label: i.layout?.billingFields?.state?.label,
-          hiddenForCountries: i.layout?.billingFields?.state?.hiddenForCountries
+          enabled: n.layout?.billingFields?.state?.enabled ?? !1,
+          label: n.layout?.billingFields?.state?.label,
+          hiddenForCountries: n.layout?.billingFields?.state?.hiddenForCountries
         },
         zipCode: {
-          enabled: i.layout?.billingFields?.zipCode?.enabled ?? !1,
-          label: i.layout?.billingFields?.zipCode?.label
+          enabled: n.layout?.billingFields?.zipCode?.enabled ?? !1,
+          label: n.layout?.billingFields?.zipCode?.label
         },
         firstName: {
-          enabled: i.layout?.billingFields?.firstName?.enabled ?? !1,
-          label: i.layout?.billingFields?.firstName?.label
+          enabled: n.layout?.billingFields?.firstName?.enabled ?? !1,
+          label: n.layout?.billingFields?.firstName?.label
         },
         lastName: {
-          enabled: i.layout?.billingFields?.lastName?.enabled ?? !1,
-          label: i.layout?.billingFields?.lastName?.label
+          enabled: n.layout?.billingFields?.lastName?.enabled ?? !1,
+          label: n.layout?.billingFields?.lastName?.label
         },
         country: {
-          enabled: i.layout?.billingFields?.country?.enabled ?? !1,
-          label: i.layout?.billingFields?.country?.label,
-          options: i.layout?.billingFields?.country?.options
+          enabled: n.layout?.billingFields?.country?.enabled ?? !1,
+          label: n.layout?.billingFields?.country?.label,
+          options: n.layout?.billingFields?.country?.options
         }
       },
-      shippingFields: i.layout?.shippingFields ? {
+      shippingFields: n.layout?.shippingFields ? {
         street: {
-          enabled: i.layout.shippingFields.street?.enabled ?? !1,
-          label: i.layout.shippingFields.street?.label
+          enabled: n.layout.shippingFields.street?.enabled ?? !1,
+          label: n.layout.shippingFields.street?.label,
+          maxLength: n.layout.shippingFields.street?.maxLength
         },
         firstName: {
-          enabled: i.layout.shippingFields.firstName?.enabled ?? !1,
-          label: i.layout.shippingFields.firstName?.label
+          enabled: n.layout.shippingFields.firstName?.enabled ?? !1,
+          label: n.layout.shippingFields.firstName?.label
         },
         lastName: {
-          enabled: i.layout.shippingFields.lastName?.enabled ?? !1,
-          label: i.layout.shippingFields.lastName?.label
+          enabled: n.layout.shippingFields.lastName?.enabled ?? !1,
+          label: n.layout.shippingFields.lastName?.label
         },
         city: {
-          enabled: i.layout.shippingFields.city?.enabled ?? !1,
-          label: i.layout.shippingFields.city?.label
+          enabled: n.layout.shippingFields.city?.enabled ?? !1,
+          label: n.layout.shippingFields.city?.label
         },
         state: {
-          enabled: i.layout.shippingFields.state?.enabled ?? !1,
-          label: i.layout.shippingFields.state?.label,
-          hiddenForCountries: i.layout.shippingFields.state?.hiddenForCountries
+          enabled: n.layout.shippingFields.state?.enabled ?? !1,
+          label: n.layout.shippingFields.state?.label,
+          hiddenForCountries: n.layout.shippingFields.state?.hiddenForCountries
         },
         zipCode: {
-          enabled: i.layout.shippingFields.zipCode?.enabled ?? !1,
-          label: i.layout.shippingFields.zipCode?.label
+          enabled: n.layout.shippingFields.zipCode?.enabled ?? !1,
+          label: n.layout.shippingFields.zipCode?.label
         },
         country: {
-          enabled: i.layout.shippingFields.country?.enabled ?? !1,
-          label: i.layout.shippingFields.country?.label,
-          options: i.layout.shippingFields.country?.options
+          enabled: n.layout.shippingFields.country?.enabled ?? !1,
+          label: n.layout.shippingFields.country?.label,
+          options: n.layout.shippingFields.country?.options
         }
       } : void 0
     },
     appearance: {
-      additionalPaymentMethods: i.additionalPaymentMethods ? {
-        applePay: i.additionalPaymentMethods.applePay ? {
-          displayName: i.additionalPaymentMethods.applePay.displayName,
-          requiredBillingContactFields: i.additionalPaymentMethods.applePay.requiredBillingContactFields,
-          requiredShippingContactFields: i.additionalPaymentMethods.applePay.requiredShippingContactFields
+      additionalPaymentMethods: n.additionalPaymentMethods ? {
+        applePay: n.additionalPaymentMethods.applePay ? {
+          displayName: n.additionalPaymentMethods.applePay.displayName,
+          requiredBillingContactFields: n.additionalPaymentMethods.applePay.requiredBillingContactFields,
+          requiredShippingContactFields: n.additionalPaymentMethods.applePay.requiredShippingContactFields
         } : void 0
       } : void 0
     }
   };
 }
 function dt({
-  appearance: i
+  appearance: n
 }) {
   const e = me({
     checkoutProfile: void 0,
     isLoading: !0,
     error: null
   });
-  if (i) {
-    const s = G(i);
+  if (n) {
+    const s = G(n);
     return Promise.resolve().then(() => {
       e.setState({
         checkoutProfile: s,
@@ -753,9 +755,9 @@ function dt({
       getState: e.getState.bind(e),
       subscribe: e.subscribe.bind(e),
       updateProfile: (a) => {
-        const n = G(a);
+        const i = G(a);
         e.setState({
-          checkoutProfile: n,
+          checkoutProfile: i,
           isLoading: !1,
           error: null
         });
@@ -814,7 +816,7 @@ function dt({
   };
 }
 const ct = () => {
-  const i = ye(), e = me({
+  const n = ye(), e = me({
     formData: {
       name: "",
       email: "",
@@ -831,62 +833,62 @@ const ct = () => {
       cardCvv: !1
     },
     isValid: !1
-  }), t = (l, p, y, m) => {
+  }), t = (l, p, y, u) => {
     if (l === "cardCvv")
-      return i.cardCvv(p, y);
-    if (l === "phoneNumber" && m)
-      return i.phoneNumber(p, m);
-    const g = i[l];
+      return n.cardCvv(p, y);
+    if (l === "phoneNumber" && u)
+      return n.phoneNumber(p, u);
+    const g = n[l];
     return g?.(p);
   }, s = (l) => {
     const p = {};
-    return Object.keys(l).forEach((m) => {
-      const g = l[m];
+    return Object.keys(l).forEach((u) => {
+      const g = l[u];
       if (g === void 0) return;
       let h;
-      m === "cardCvv" ? h = t(m, g, l.cardNumber) : m === "phoneNumber" ? h = t(
-        m,
+      u === "cardCvv" ? h = t(u, g, l.cardNumber) : u === "phoneNumber" ? h = t(
+        u,
         g,
         void 0,
         l.phoneCountryCode
-      ) : h = t(m, g), h && (p[m] = h);
+      ) : h = t(u, g), h && (p[u] = h);
     }), [
       "billingAddress",
       "shippingAddress"
-    ].forEach((m) => {
-      const g = l[m];
+    ].forEach((u) => {
+      const g = l[u];
       if (g && typeof g == "object") {
         const h = {};
         Object.keys(g).forEach(
           (b) => {
             const f = g[b];
             if (f === void 0) return;
-            const v = i[b];
+            const v = n[b];
             if (v) {
-              const E = b === "state" ? i.state(f, g.country) : v(
+              const E = b === "state" ? n.state(f, g.country) : v(
                 f
               );
               E && (h[b] = E);
             }
           }
-        ), Object.keys(h).length > 0 && (p[m] = h);
+        ), Object.keys(h).length > 0 && (p[u] = h);
       }
     }), p;
   }, a = (l) => {
     const p = s(l);
     return Object.keys(p).length === 0;
-  }, n = "billingAddress.", r = "shippingAddress.", o = (l) => l.startsWith(n) ? {
+  }, i = "billingAddress.", r = "shippingAddress.", o = (l) => l.startsWith(i) ? {
     parent: "billingAddress",
-    field: l.slice(n.length)
+    field: l.slice(i.length)
   } : l.startsWith(r) ? {
     parent: "shippingAddress",
     field: l.slice(r.length)
-  } : null, d = (l, p, y, m) => {
+  } : null, d = (l, p, y, u) => {
     const g = { ...l };
-    if (m)
+    if (u)
       g[p] = {
         ...g[p],
-        [y]: m
+        [y]: u
       };
     else {
       const h = {
@@ -897,14 +899,14 @@ const ct = () => {
     return g;
   }, c = (l, p) => {
     const y = e.getState();
-    let m = p;
+    let u = p;
     const g = o(l);
-    if (!g && l in q)
+    if (!g && l in j)
       if (l === "cardCvv") {
         const v = be(y.formData.cardNumber) === "amex" ? 4 : 3;
-        m = q.cardCvv(p, v);
+        u = j.cardCvv(p, v);
       } else
-        m = q[l](p);
+        u = j[l](p);
     let h;
     if (g) {
       const { parent: f, field: v } = g;
@@ -912,13 +914,13 @@ const ct = () => {
         ...y.formData,
         [f]: {
           ...y.formData[f] ?? {},
-          [v]: m
+          [v]: u
         }
       };
     } else
       h = {
         ...y.formData,
-        [l]: m
+        [l]: u
       };
     let b = { ...y.errors };
     if (l === "phoneCountryCode" && h.phoneNumber) {
@@ -926,7 +928,7 @@ const ct = () => {
         "phoneNumber",
         h.phoneNumber,
         void 0,
-        m
+        u
       );
       f ? b.phoneNumber = f : delete b.phoneNumber;
     }
@@ -935,32 +937,32 @@ const ct = () => {
         const { parent: f, field: v } = g, E = h[f];
         let N;
         if (v === "state")
-          N = i.state(m, E?.country);
+          N = n.state(u, E?.country);
         else {
-          const x = i[v];
+          const x = n[v];
           N = x ? x(
-            m
+            u
           ) : void 0;
         }
         b = d(b, f, v, N);
       } else {
         let f;
-        l === "cardCvv" ? f = t(l, m, h.cardNumber) : l === "phoneNumber" ? f = t(
+        l === "cardCvv" ? f = t(l, u, h.cardNumber) : l === "phoneNumber" ? f = t(
           l,
-          m,
+          u,
           void 0,
           h.phoneCountryCode
-        ) : f = t(l, m), f ? b[l] = f : delete b[l];
+        ) : f = t(l, u), f ? b[l] = f : delete b[l];
       }
     e.setState({
       formData: h,
       errors: b,
       isValid: a(h)
     });
-  }, u = (l, p) => {
-    const y = e.getState(), m = o(l);
-    if (m) {
-      const { parent: f, field: v } = m, E = {
+  }, m = (l, p) => {
+    const y = e.getState(), u = o(l);
+    if (u) {
+      const { parent: f, field: v } = u, E = {
         ...y.formData,
         [f]: {
           ...y.formData[f] ?? {},
@@ -970,9 +972,9 @@ const ct = () => {
       let N;
       if (v === "state") {
         const V = E[f];
-        N = i.state(p, V?.country);
+        N = n.state(p, V?.country);
       } else {
-        const V = i[v];
+        const V = n[v];
         N = V ? V(p) : void 0;
       }
       const x = d(y.errors, f, v, N);
@@ -1017,33 +1019,33 @@ const ct = () => {
     getFormState: e.getState.bind(e),
     subscribe: e.subscribe.bind(e),
     handleChange: c,
-    handleBlur: u,
+    handleBlur: m,
     setFormData: S,
     reset: e.resetState.bind(e)
   };
 }, ht = "https://fonts.googleapis.com/css2", ut = /src:\s*url\(([^)]+\.woff2[^)]*)\)/, mt = /\/\*\s*latin\s*\*\/\s*@font-face\s*\{[^}]*src:\s*url\(([^)]+\.woff2[^)]*)\)[^}]*\}/;
-async function pt(i) {
-  if (!i) return null;
-  const e = i.trim().replace(/\s+/g, "+"), t = `${ht}?family=${e}:wght@400;700&display=swap`;
+async function pt(n) {
+  if (!n) return null;
+  const e = n.trim().replace(/\s+/g, "+"), t = `${ht}?family=${e}:wght@400;700&display=swap`;
   try {
     const s = await fetch(t);
     if (!s.ok) return null;
-    const a = await s.text(), n = mt.exec(a);
-    if (n?.[1]) return n[1];
+    const a = await s.text(), i = mt.exec(a);
+    if (i?.[1]) return i[1];
     const r = ut.exec(a);
     return r?.[1] ? r[1] : null;
   } catch {
     return null;
   }
 }
-function gt(i) {
-  if (!i) return !1;
-  const { billingFields: e, shippingFields: t } = i, s = e && Object.values(e).some((n) => n?.enabled), a = t && Object.values(t).some((n) => n?.enabled);
+function gt(n) {
+  if (!n) return !1;
+  const { billingFields: e, shippingFields: t } = n, s = e && Object.values(e).some((i) => i?.enabled), a = t && Object.values(t).some((i) => i?.enabled);
   return !!(s || a);
 }
-function J(i) {
-  if (!i) return !1;
-  const { billingFields: e, shippingFields: t } = i, s = e?.firstName?.enabled && e?.lastName?.enabled, a = t?.firstName?.enabled && t?.lastName?.enabled;
+function J(n) {
+  if (!n) return !1;
+  const { billingFields: e, shippingFields: t } = n, s = e?.firstName?.enabled && e?.lastName?.enabled, a = t?.firstName?.enabled && t?.lastName?.enabled;
   return !!(s || a);
 }
 const O = /* @__PURE__ */ new Set(["US", "CA"]);
@@ -1062,25 +1064,25 @@ class ce extends A {
   stateStyles;
   constructor(e) {
     super("div", ["address-section"]), this.type = e.type, this.onChange = e.onChange, this.onBlur = e.onBlur, this.translationFunc = e.translationFunc, this.locale = e.locale, this.grouped = e.grouped ?? !0;
-    const { title: t, checkoutProfile: s, fieldsConfig: a, values: n, errors: r, touched: o } = e;
+    const { title: t, checkoutProfile: s, fieldsConfig: a, values: i, errors: r, touched: o } = e;
     if (this.grouped) {
       const d = document.createElement("h3");
       d.className = "address-section-title", d.textContent = t, d.style.color = s.styles.textColor, d.style.fontFamily = `"${s.styles.fontFamily}", sans-serif`, d.style.fontSize = `${s.styles.fontSize}px`, d.style.fontWeight = "normal", this.getElement().appendChild(d);
     }
-    this.fieldsContainer = document.createElement("div"), this.fieldsContainer.className = "address-fields", this.grouped || this.fieldsContainer.classList.add("address-fields--ungrouped"), this.getElement().appendChild(this.fieldsContainer), this.createFields(s, a, n, r, o);
+    this.fieldsContainer = document.createElement("div"), this.fieldsContainer.className = "address-fields", this.grouped || this.fieldsContainer.classList.add("address-fields--ungrouped"), this.getElement().appendChild(this.fieldsContainer), this.createFields(s, a, i, r, o);
   }
-  borderRadius(e, t, s, a, n) {
+  borderRadius(e, t, s, a, i) {
     const r = (o) => o ? `${e}px` : "0px";
-    return `${r(t)} ${r(s)} ${r(a)} ${r(n)}`;
+    return `${r(t)} ${r(s)} ${r(a)} ${r(i)}`;
   }
-  createFields(e, t, s, a, n) {
+  createFields(e, t, s, a, i) {
     if (!this.grouped) {
       this.createUngroupedFields(
         e,
         t,
         s,
         a,
-        n
+        i
       );
       return;
     }
@@ -1092,18 +1094,18 @@ class ce extends A {
     t.street?.enabled && d.push({ kind: "street" });
     const c = [];
     t.firstName?.enabled && c.push("firstName"), t.lastName?.enabled && c.push("lastName"), c.length > 0 && d.push({ kind: "name", fields: c }), t.country?.enabled && d.push({ kind: "country" });
-    const u = [];
-    t.city?.enabled && u.push("city"), t.zipCode?.enabled && u.push("zipCode"), u.length > 0 && d.push({ kind: "cityZip", fields: u }), t.state?.enabled && d.push({ kind: "state" });
+    const m = [];
+    t.city?.enabled && m.push("city"), t.zipCode?.enabled && m.push("zipCode"), m.length > 0 && d.push({ kind: "cityZip", fields: m }), t.state?.enabled && d.push({ kind: "state" });
     const S = d.length;
     d.forEach((l, p) => {
-      const y = p === 0, m = p === S - 1, g = (h, b) => ({
+      const y = p === 0, u = p === S - 1, g = (h, b) => ({
         ...o,
         borderRadius: this.borderRadius(
           r,
           y && h,
           y && b,
-          m && b,
-          m && h
+          u && b,
+          u && h
         )
       });
       if (l.kind === "street") {
@@ -1112,9 +1114,10 @@ class ce extends A {
           t.street?.label ?? this.translationFunc("address.addressLine1"),
           s.street,
           a.street,
-          n.street,
+          i.street,
           g(!0, !0),
-          "street-address"
+          "street-address",
+          t.street?.maxLength
         );
         this.inputs.set("street", b), h.appendChild(b.getElement()), this.fieldsContainer.appendChild(h);
         return;
@@ -1127,7 +1130,7 @@ class ce extends A {
             t.firstName?.label ?? this.translationFunc("address.firstName"),
             s.firstName,
             a.firstName,
-            n.firstName,
+            i.firstName,
             g(!0, f),
             "given-name"
           );
@@ -1139,7 +1142,7 @@ class ce extends A {
             t.lastName?.label ?? this.translationFunc("address.lastName"),
             s.lastName,
             a.lastName,
-            n.lastName,
+            i.lastName,
             g(f, !0),
             "family-name"
           );
@@ -1152,7 +1155,7 @@ class ce extends A {
         const h = this.createRow(["full"]), b = this.createCountrySelect(
           s.country,
           a.country,
-          n.country,
+          i.country,
           g(!0, !0),
           t.country?.options,
           t.country?.label
@@ -1168,7 +1171,7 @@ class ce extends A {
             t.city?.label ?? this.translationFunc("address.townCity"),
             s.city,
             a.city,
-            n.city,
+            i.city,
             g(!0, f),
             "address-level2"
           );
@@ -1180,7 +1183,7 @@ class ce extends A {
             t.zipCode?.label ?? this.translationFunc("address.postalCode"),
             s.zipCode,
             a.zipCode,
-            n.zipCode,
+            i.zipCode,
             g(f, !0),
             "postal-code"
           );
@@ -1197,7 +1200,7 @@ class ce extends A {
           const v = this.createStateSelect(
             s.state,
             a.state,
-            n.state,
+            i.state,
             this.stateStyles,
             s.country,
             t.state?.label
@@ -1209,7 +1212,7 @@ class ce extends A {
             t.state?.label ?? this.translationFunc("address.state"),
             s.state,
             a.state,
-            n.state,
+            i.state,
             this.stateStyles,
             "address-level1"
           );
@@ -1223,47 +1226,54 @@ class ce extends A {
     const t = document.createElement("div");
     return t.className = `address-row address-row-${e.length === 1 ? "single" : "double"}`, t;
   }
-  createInput(e, t, s, a, n, r, o) {
-    const d = `${this.type}Address.${e}`, c = new pe({
-      name: d,
+  createInput(e, t, s, a, i, r, o, d) {
+    const c = `${this.type}Address.${e}`, m = new pe({
+      name: c,
       error: !1,
       errorMsg: void 0,
       styles: r,
+      maxLength: d,
       ...this.grouped ? { placeholder: t } : {
         label: t,
         placeholder: (() => {
-          const u = `address.placeholder.${e}`, S = this.translationFunc(u);
-          return S !== u ? S : t;
+          const S = `address.placeholder.${e}`, l = this.translationFunc(S);
+          return l !== S ? l : t;
         })()
       },
       value: s,
       autocomplete: o,
-      onChange: (u) => {
-        c.setError(!1), this.onChange(
+      onChange: (S) => {
+        const l = S.target.value;
+        if (d && l.length >= d) {
+          const p = this.translationFunc("validation.maxLengthExceeded");
+          m.setError(!0, p.replace("{{max}}", String(d)));
+        } else
+          m.setError(!1);
+        this.onChange(
           P({
             type: "input",
             target: {
-              name: d,
-              value: u.target.value
+              name: c,
+              value: l
             }
           })
         );
       }
     });
-    return c.addEventListener("blur", (u) => {
+    return m.addEventListener("blur", (S) => {
       this.onBlur(
         P({
           type: "blur",
           target: {
-            name: d,
-            value: u.target.value
+            name: c,
+            value: S.target.value
           }
         })
       );
-    }), c;
+    }), m;
   }
-  createCountrySelect(e, t, s, a, n, r) {
-    const o = `${this.type}Address.country`, d = ve(n, this.locale), c = new _({
+  createCountrySelect(e, t, s, a, i, r) {
+    const o = `${this.type}Address.country`, d = ve(i, this.locale), c = new _({
       name: o,
       error: !1,
       errorMsg: void 0,
@@ -1275,9 +1285,9 @@ class ce extends A {
       value: e,
       options: d,
       autocomplete: "country",
-      onChange: (u) => {
+      onChange: (m) => {
         c.setError(!1);
-        const S = u.target.value;
+        const S = m.target.value;
         this.onChange(
           P({
             type: "change",
@@ -1286,13 +1296,13 @@ class ce extends A {
         ), this.handleCountryChange(S);
       }
     });
-    return c.addEventListener("blur", (u) => {
+    return c.addEventListener("blur", (m) => {
       this.onBlur(
         P({
           type: "blur",
           target: {
             name: o,
-            value: u.target.value
+            value: m.target.value
           }
         })
       );
@@ -1307,21 +1317,21 @@ class ce extends A {
       return;
     }
     if (!a && s && (this.stateRow.style.display = ""), a) return;
-    const n = this.inputs.get("state") instanceof _, r = O.has(e);
-    if (n && r) {
+    const i = this.inputs.get("state") instanceof _, r = O.has(e);
+    if (i && r) {
       const o = this.inputs.get("state");
       if (o instanceof _) {
-        const d = e === "CA" ? "CA" : "US", c = ee(d), u = d === "CA" ? this.translationFunc("address.chooseProvince") : this.translationFunc("address.chooseState");
-        o.setOptions(c, u);
+        const d = e === "CA" ? "CA" : "US", c = ee(d), m = d === "CA" ? this.translationFunc("address.chooseProvince") : this.translationFunc("address.chooseState");
+        o.setOptions(c, m);
       }
       this.clearStateValue();
       return;
     }
-    if (n !== r) {
+    if (i !== r) {
       this.rebuildStateField(e), this.clearStateValue();
       return;
     }
-    !n && !r && t !== e && this.clearStateValue();
+    !i && !r && t !== e && this.clearStateValue();
   }
   rebuildStateField(e) {
     if (!this.stateRow || !this.stateStyles) return;
@@ -1361,14 +1371,14 @@ class ce extends A {
       })
     );
   }
-  createStateSelect(e, t, s, a, n, r) {
-    const o = `${this.type}Address.state`, d = n === "CA" ? "CA" : "US", c = ee(d), u = d === "CA" ? this.translationFunc("address.chooseProvince") : this.translationFunc("address.chooseState"), S = new _({
+  createStateSelect(e, t, s, a, i, r) {
+    const o = `${this.type}Address.state`, d = i === "CA" ? "CA" : "US", c = ee(d), m = d === "CA" ? this.translationFunc("address.chooseProvince") : this.translationFunc("address.chooseState"), S = new _({
       name: o,
       error: !1,
       errorMsg: void 0,
       styles: a,
-      placeholder: u,
-      ...!this.grouped && { label: r ?? u },
+      placeholder: m,
+      ...!this.grouped && { label: r ?? m },
       value: e,
       options: c,
       autocomplete: "address-level1",
@@ -1396,35 +1406,41 @@ class ce extends A {
       );
     }), S;
   }
-  createUngroupedFields(e, t, s, a, n) {
+  createUngroupedFields(e, t, s, a, i) {
     const r = e.styles.borderRadius, o = {
       color: e.styles.textColor,
       fontSize: e.styles.fontSize,
       fontFamily: e.styles.fontFamily,
       borderRadius: `${r}px`
-    }, d = (c, u, S) => {
+    }, d = (c, m, S, l) => {
       if (!t[c]?.enabled) return;
-      const l = t[c]?.label ?? this.translationFunc(u), p = this.createRow(["full"]), y = this.createInput(
+      const p = t[c]?.label ?? this.translationFunc(m), y = this.createRow(["full"]), u = this.createInput(
         c,
-        l,
+        p,
         s[c],
         a[c],
-        n[c],
+        i[c],
         o,
-        S
+        S,
+        l
       );
-      this.inputs.set(c, y), p.appendChild(y.getElement()), this.fieldsContainer.appendChild(p);
+      this.inputs.set(c, u), y.appendChild(u.getElement()), this.fieldsContainer.appendChild(y);
     };
-    if (d("firstName", "address.firstName", "given-name"), d("lastName", "address.lastName", "family-name"), d("street", "address.addressLine1", "street-address"), d("city", "address.townCity", "address-level2"), t.country?.enabled) {
-      const c = t.country?.label ?? this.translationFunc("address.chooseCountry"), u = this.createRow(["full"]), S = this.createCountrySelect(
+    if (d("firstName", "address.firstName", "given-name"), d("lastName", "address.lastName", "family-name"), d(
+      "street",
+      "address.addressLine1",
+      "street-address",
+      t.street?.maxLength
+    ), d("city", "address.townCity", "address-level2"), t.country?.enabled) {
+      const c = t.country?.label ?? this.translationFunc("address.chooseCountry"), m = this.createRow(["full"]), S = this.createCountrySelect(
         s.country,
         a.country,
-        n.country,
+        i.country,
         o,
         t.country?.options,
         c
       );
-      this.inputs.set("country", S), u.appendChild(S.getElement()), this.fieldsContainer.appendChild(u);
+      this.inputs.set("country", S), m.appendChild(S.getElement()), this.fieldsContainer.appendChild(m);
     }
     if (t.state?.enabled) {
       this.stateFieldConfig = t.state;
@@ -1437,7 +1453,7 @@ class ce extends A {
         const p = this.createStateSelect(
           s.state,
           a.state,
-          n.state,
+          i.state,
           o,
           s.country,
           l
@@ -1449,7 +1465,7 @@ class ce extends A {
           l,
           s.state,
           a.state,
-          n.state,
+          i.state,
           o,
           "address-level1"
         );
@@ -1484,17 +1500,17 @@ class ce extends A {
   setError(e, t, s) {
     const a = this.inputs.get(e);
     if (a) {
-      const n = a.getElement().querySelector("input") || a.getElement().querySelector("select");
-      document.activeElement !== n && a.setError(t, s);
+      const i = a.getElement().querySelector("input") || a.getElement().querySelector("select");
+      document.activeElement !== i && a.setError(t, s);
     }
   }
   updateField(e, t, s, a) {
-    const n = this.inputs.get(e);
-    if (!n) return;
-    const r = n.getElement().querySelector("input") || n.getElement().querySelector("select"), o = n.getValue();
+    const i = this.inputs.get(e);
+    if (!i) return;
+    const r = i.getElement().querySelector("input") || i.getElement().querySelector("select"), o = i.getValue();
     !(document.activeElement === r) && !(t === "" && o !== "") && this.setValue(e, t);
-    const u = !!(a && s);
-    this.setError(e, u, s);
+    const m = !!(a && s);
+    this.setError(e, m, s);
   }
   updateAllFields(e, t, s) {
     Object.keys(e).forEach((a) => {
@@ -1524,7 +1540,7 @@ class ft {
       value: t,
       onChange: s,
       onBlur: a,
-      errorMsg: n,
+      errorMsg: i,
       checkoutProfile: r,
       translationFunc: o,
       autocomplete: d = "cc-name",
@@ -1534,7 +1550,7 @@ class ft {
       t,
       s,
       a,
-      n,
+      i,
       r,
       o,
       d
@@ -1543,29 +1559,29 @@ class ft {
   buildVgsLayout(e, t) {
     const s = e.styles.borderRadius, a = document.createElement("div");
     a.style.marginBottom = "4px";
-    const n = document.createElement("label");
-    n.className = "input-label", n.textContent = t("cardholderNameLabel"), n.style.fontFamily = `"${e.styles.fontFamily}", sans-serif`, a.appendChild(n), this.wrapperElement.appendChild(a), this.vgsWrapper = document.createElement("div"), this.vgsWrapper.className = "vgs-wrap", this.vgsWrapper.style.position = "relative", this.vgsWrapper.style.borderRadius = `${s}px`, this.vgsWrapper.style.height = "38.5px", this.vgsWrapper.style.width = "100%", this.vgsWrapper.style.overflow = "hidden";
+    const i = document.createElement("label");
+    i.className = "input-label", i.textContent = t("cardholderNameLabel"), i.style.fontFamily = `"${e.styles.fontFamily}", sans-serif`, i.style.fontSize = `${e.styles.fontSize}px`, a.appendChild(i), this.wrapperElement.appendChild(a), this.vgsWrapper = document.createElement("div"), this.vgsWrapper.className = "vgs-wrap", this.vgsWrapper.style.position = "relative", this.vgsWrapper.style.borderRadius = `${s}px`, this.vgsWrapper.style.height = "38.5px", this.vgsWrapper.style.width = "100%", this.vgsWrapper.style.overflow = "hidden";
     const r = document.createElement("div");
     r.className = "vgs-field-skeleton", this.vgsWrapper.appendChild(r), this.vgsContainer = document.createElement("div"), this.vgsContainer.id = `vgs-cc-name-${Date.now()}`, this.vgsContainer.style.position = "relative", this.vgsContainer.style.zIndex = "1", this.vgsContainer.style.width = "100%", this.vgsContainer.style.height = "100%", this.vgsWrapper.appendChild(this.vgsContainer), this.wrapperElement.appendChild(this.vgsWrapper), this.vgsHelperText = new Se({ visible: !1 }), this.wrapperElement.appendChild(this.vgsHelperText.getElement());
   }
-  buildNativeLayout(e, t, s, a, n, r, o) {
+  buildNativeLayout(e, t, s, a, i, r, o) {
     this.input = new pe({
       name: "name",
       label: r("cardholderNameLabel"),
       error: !1,
       errorMsg: a,
       styles: {
-        color: n.styles.textColor,
-        borderRadius: `${n.styles.borderRadius}px`,
-        fontSize: n.styles.fontSize,
-        fontFamily: n.styles.fontFamily
+        color: i.styles.textColor,
+        borderRadius: `${i.styles.borderRadius}px`,
+        fontSize: i.styles.fontSize,
+        fontFamily: i.styles.fontFamily
       },
       placeholder: r("cardholderNamePlaceholder"),
       value: e,
       autocomplete: o,
       onChange: (d) => {
-        const u = d.target.value, S = u.replace(/[^a-zA-Z\s\-'.]/g, "");
-        u !== S && this.input?.setValue(S), this.input?.setError(!1), this.trim(), t(d);
+        const m = d.target.value, S = m.replace(/[^a-zA-Z\s\-'.]/g, "");
+        m !== S && this.input?.setValue(S), this.input?.setError(!1), this.trim(), t(d);
       }
     }), this.input.addEventListener("blur", (d) => {
       s(d);
@@ -1641,12 +1657,12 @@ class yt extends A {
   constructor(e) {
     const { translationFunc: t, checkoutProfile: s } = e;
     super("div", ["payment-separator"]);
-    const a = this.getElement(), n = document.createElement("span");
-    n.className = "payment-separator__line";
+    const a = this.getElement(), i = document.createElement("span");
+    i.className = "payment-separator__line";
     const r = document.createElement("p");
     r.textContent = t("pay-with-card"), r.className = "payment-separator__text", r.style.fontFamily = `${s.styles.fontFamily}, sans-serif`;
     const o = document.createElement("span");
-    o.className = "payment-separator__line", a.appendChild(n), a.appendChild(r), a.appendChild(o);
+    o.className = "payment-separator__line", a.appendChild(i), a.appendChild(r), a.appendChild(o);
   }
 }
 class bt extends A {
@@ -1658,12 +1674,12 @@ class bt extends A {
       checkoutProfile: t,
       formData: s,
       onPaypalSubmit: a,
-      onApplePaySubmit: n,
+      onApplePaySubmit: i,
       supportedPaymentMethods: r,
       translationFunc: o,
       paymentId: d,
       checkoutKey: c,
-      checkoutDetails: u,
+      checkoutDetails: m,
       environment: S,
       countryCode: l
     } = e;
@@ -1677,10 +1693,10 @@ class bt extends A {
     }
     const p = Object.entries(
       t.additionalPaymentMethods
-    ).filter(([y, m]) => {
-      const g = m.enabled, h = r ? r[y] === !0 : !0, b = !m.countries || l && m.countries.includes(l);
+    ).filter(([y, u]) => {
+      const g = u.enabled, h = r ? r[y] === !0 : !0, b = !u.countries || l && u.countries.includes(l);
       return g && h && b;
-    }).sort((y, m) => y[1].order - m[1].order);
+    }).sort((y, u) => y[1].order - u[1].order);
     if (p.length === 0) {
       this.getElement().style.display = "none";
       return;
@@ -1689,28 +1705,28 @@ class bt extends A {
       switch (y) {
         case "paypal": {
           if (a) {
-            const m = new Ee({
+            const u = new Ee({
               checkoutProfile: t,
               formData: s,
               onSubmit: a
             });
-            this.paymentMethods.set("paypal", m), m.appendTo(this.getElement());
+            this.paymentMethods.set("paypal", u), u.appendTo(this.getElement());
           }
           break;
         }
         case "applePay": {
-          if (n && d && c) {
-            const m = t.appearance?.additionalPaymentMethods?.applePay, g = new Ce({
+          if (i && d && c) {
+            const u = t.appearance?.additionalPaymentMethods?.applePay, g = new Ce({
               checkoutProfile: t,
               formData: s,
-              onSubmit: n,
+              onSubmit: i,
               paymentId: d,
               checkoutKey: c,
-              checkoutDetails: u,
+              checkoutDetails: m,
               environment: S,
-              displayName: m?.displayName,
-              requiredBillingContactFields: m?.requiredBillingContactFields,
-              requiredShippingContactFields: m?.requiredShippingContactFields
+              displayName: u?.displayName,
+              requiredBillingContactFields: u?.requiredBillingContactFields,
+              requiredShippingContactFields: u?.requiredShippingContactFields
             });
             this.paymentMethods.set("applePay", g), g.appendTo(this.getElement());
           }
@@ -1868,7 +1884,7 @@ class Et {
   }
   createEmailField(e, t, s, a) {
     try {
-      const n = e.layout.billingFields && Object.values(e.layout.billingFields).some(
+      const i = e.layout.billingFields && Object.values(e.layout.billingFields).some(
         (r) => r?.enabled
       ) || e.layout.shippingFields && Object.values(e.layout.shippingFields).some(
         (r) => r?.enabled
@@ -1877,7 +1893,7 @@ class Et {
         value: t.email,
         onChange: this.onChange,
         onBlur: this.onBlur,
-        onTab: n ? void 0 : () => this.focusManager.focusField(
+        onTab: i ? void 0 : () => this.focusManager.focusField(
           e.layout.phoneNumber?.enabled ? "phoneNumber" : "cardNumber"
         ),
         error: !!(s.email && a.email),
@@ -1885,14 +1901,14 @@ class Et {
         checkoutProfile: e,
         translationFunc: this.translationFunc
       }), this.emailFocusHandler = () => this.onFieldFocus("email"), this.emailField.getElement().addEventListener("focus", this.emailFocusHandler, !0), this.focusManager.registerField("email", this.emailField), this.formElement.appendChild(this.emailField.getElement());
-    } catch (n) {
-      throw console.error("Error creating email field:", n), n;
+    } catch (i) {
+      throw console.error("Error creating email field:", i), i;
     }
   }
   createPhoneNumberField(e, t, s, a) {
-    const n = document.createElement("div");
-    this.phonePlaceholder = n, this.formElement.appendChild(n), Me().then(({ PhoneNumberField: r }) => {
-      n.isConnected && (this.phoneNumberField = new r({
+    const i = document.createElement("div");
+    this.phonePlaceholder = i, this.formElement.appendChild(i), Me().then(({ PhoneNumberField: r }) => {
+      i.isConnected && (this.phoneNumberField = new r({
         value: t.phoneNumber ?? "",
         onChange: this.onChange,
         onBlur: this.onBlur,
@@ -1904,9 +1920,9 @@ class Et {
         defaultCountry: e.layout.phoneNumber?.defaultCountry || "US",
         allowedCountries: e.layout.phoneNumber?.allowedCountries,
         locale: this.locale
-      }), this.phoneNumberFocusHandler = () => this.onFieldFocus("phoneNumber"), this.phoneNumberField.getElement().addEventListener("focus", this.phoneNumberFocusHandler, !0), this.focusManager.registerField("phoneNumber", this.phoneNumberField), n.replaceWith(this.phoneNumberField.getElement()), this.phonePlaceholder = void 0);
+      }), this.phoneNumberFocusHandler = () => this.onFieldFocus("phoneNumber"), this.phoneNumberField.getElement().addEventListener("focus", this.phoneNumberFocusHandler, !0), this.focusManager.registerField("phoneNumber", this.phoneNumberField), i.replaceWith(this.phoneNumberField.getElement()), this.phonePlaceholder = void 0);
     }).catch((r) => {
-      console.error("Error creating phone number field:", r), n.remove(), this.phonePlaceholder = void 0;
+      console.error("Error creating phone number field:", r), i.remove(), this.phonePlaceholder = void 0;
     });
   }
   setCheckoutDetailsLoaded(e) {
@@ -1943,8 +1959,8 @@ class Et {
         vgsService: this.vgsService,
         onVgsStateChange: this.onVgsStateChange
       }), !this.vgsService) {
-        const n = this.cardSection.getElement().querySelector('input[name="cardExpiry"]');
-        n && (this.cardExpiryFocusHandler = () => this.onFieldFocus("cardExpiry"), n.addEventListener(
+        const i = this.cardSection.getElement().querySelector('input[name="cardExpiry"]');
+        i && (this.cardExpiryFocusHandler = () => this.onFieldFocus("cardExpiry"), i.addEventListener(
           "focus",
           this.cardExpiryFocusHandler
         ));
@@ -1963,8 +1979,8 @@ class Et {
       }), this.focusManager.registerField("cardCvv", {
         focus: () => this.cardSection?.focusField("cardCvv")
       }), this.formElement.appendChild(this.cardSection.getElement());
-    } catch (n) {
-      throw console.error("Error creating card section:", n), n;
+    } catch (i) {
+      throw console.error("Error creating card section:", i), i;
     }
   }
   createCardholderSection(e, t, s, a) {
@@ -1983,18 +1999,18 @@ class Et {
         translationFunc: this.translationFunc,
         isVgsMode: !!this.vgsService
       }), !this.vgsService) {
-        const n = this.cardholderSection.getElement().querySelector('input[name="name"]');
-        n && (this.nameFocusHandler = () => this.onFieldFocus("name"), n.addEventListener("focus", this.nameFocusHandler));
+        const i = this.cardholderSection.getElement().querySelector('input[name="name"]');
+        i && (this.nameFocusHandler = () => this.onFieldFocus("name"), i.addEventListener("focus", this.nameFocusHandler));
       }
       this.focusManager.registerField("name", this.cardholderSection), this.formElement.appendChild(this.cardholderSection.getElement());
-    } catch (n) {
-      throw console.error("Error creating cardholder section:", n), n;
+    } catch (i) {
+      throw console.error("Error creating cardholder section:", i), i;
     }
   }
   createBillingAddressSection(e, t, s, a) {
     try {
-      const n = e.layout.billingFields;
-      if (!n || !Object.values(n).some(
+      const i = e.layout.billingFields;
+      if (!i || !Object.values(i).some(
         (d) => d?.enabled
       )) return;
       const o = {
@@ -2010,7 +2026,7 @@ class Et {
         type: "billing",
         title: this.translationFunc("address.billingTitle"),
         checkoutProfile: e,
-        fieldsConfig: n,
+        fieldsConfig: i,
         values: t.billingAddress ?? o,
         errors: s.billingAddress ?? {},
         touched: a.billingAddress ?? {},
@@ -2020,14 +2036,14 @@ class Et {
         locale: this.locale,
         grouped: e.layout.grouped
       }), this.formElement.appendChild(this.billingAddressSection.getElement());
-    } catch (n) {
-      throw console.error("Error creating billing address section:", n), n;
+    } catch (i) {
+      throw console.error("Error creating billing address section:", i), i;
     }
   }
   createShippingAddressSection(e, t, s, a) {
     try {
-      const n = e.layout.shippingFields;
-      if (!n || !Object.values(n).some(
+      const i = e.layout.shippingFields;
+      if (!i || !Object.values(i).some(
         (d) => d?.enabled
       )) return;
       const o = {
@@ -2043,7 +2059,7 @@ class Et {
         type: "shipping",
         title: this.translationFunc("address.shippingTitle"),
         checkoutProfile: e,
-        fieldsConfig: n,
+        fieldsConfig: i,
         values: t.shippingAddress ?? o,
         errors: s.shippingAddress ?? {},
         touched: a.shippingAddress ?? {},
@@ -2053,8 +2069,8 @@ class Et {
         locale: this.locale,
         grouped: e.layout.grouped
       }), this.formElement.appendChild(this.shippingAddressSection.getElement());
-    } catch (n) {
-      throw console.error("Error creating shipping address section:", n), n;
+    } catch (i) {
+      throw console.error("Error creating shipping address section:", i), i;
     }
   }
   createSubmitButton(e, t) {
@@ -2074,12 +2090,12 @@ class Et {
   updatePhoneNumberField(e, t, s) {
     this.phoneNumberField && (this.phoneNumberField.setValue(e), this.phoneNumberField.setError(t, s));
   }
-  updateCardSection(e, t, s, a, n, r, o, d, c) {
+  updateCardSection(e, t, s, a, i, r, o, d, c) {
     this.cardSection && (this.cardSection.updateCardNumber(
       e,
       t,
       s
-    ), this.cardSection.updateCardCvv(a, n, r), this.cardSection.updateCardExpiry(
+    ), this.cardSection.updateCardCvv(a, i, r), this.cardSection.updateCardExpiry(
       o,
       d,
       c
@@ -2118,8 +2134,8 @@ class Et {
   buildCardSkeleton(e) {
     const t = e.styles.borderRadius, s = document.createElement("div"), a = document.createElement("div");
     a.style.marginBottom = "4px";
-    const n = document.createElement("label");
-    n.className = "input-label", n.textContent = this.translationFunc("cardInformation"), n.style.fontFamily = `"${e.styles.fontFamily}", sans-serif`, a.appendChild(n), s.appendChild(a);
+    const i = document.createElement("label");
+    i.className = "input-label", i.textContent = this.translationFunc("cardInformation"), i.style.fontFamily = `"${e.styles.fontFamily}", sans-serif`, a.appendChild(i), s.appendChild(a);
     const r = document.createElement("div");
     r.className = "vgs-card-group", r.style.borderRadius = `${t}px`, r.style.background = "#fff", r.style.display = "flex", r.style.flexDirection = "column", r.style.gap = "8px";
     const o = document.createElement("div");
@@ -2128,8 +2144,8 @@ class Et {
     d.style.display = "flex", d.style.gap = "8px";
     const c = document.createElement("div");
     c.style.position = "relative", c.style.flex = "1", c.style.height = "38.5px", c.style.overflow = "hidden", c.style.borderRadius = `${t}px`, c.appendChild(this.createSkeletonDiv()), d.appendChild(c);
-    const u = document.createElement("div");
-    return u.style.position = "relative", u.style.flex = "1", u.style.height = "38.5px", u.style.overflow = "hidden", u.style.borderRadius = `${t}px`, u.appendChild(this.createSkeletonDiv()), d.appendChild(u), r.appendChild(d), s.appendChild(r), s;
+    const m = document.createElement("div");
+    return m.style.position = "relative", m.style.flex = "1", m.style.height = "38.5px", m.style.overflow = "hidden", m.style.borderRadius = `${t}px`, m.appendChild(this.createSkeletonDiv()), d.appendChild(m), r.appendChild(d), s.appendChild(r), s;
   }
   createSkeletonDiv() {
     const e = document.createElement("div");
@@ -2138,8 +2154,8 @@ class Et {
   buildCardholderSkeleton(e) {
     const t = e.styles.borderRadius, s = document.createElement("div"), a = document.createElement("div");
     a.style.marginBottom = "4px";
-    const n = document.createElement("label");
-    n.className = "input-label", n.textContent = this.translationFunc("cardholderNameLabel"), n.style.fontFamily = `"${e.styles.fontFamily}", sans-serif`, a.appendChild(n), s.appendChild(a);
+    const i = document.createElement("label");
+    i.className = "input-label", i.textContent = this.translationFunc("cardholderNameLabel"), i.style.fontFamily = `"${e.styles.fontFamily}", sans-serif`, a.appendChild(i), s.appendChild(a);
     const r = document.createElement("div");
     return r.style.position = "relative", r.style.borderRadius = `${t}px`, r.style.height = "38.5px", r.style.width = "100%", r.style.overflow = "hidden", r.style.background = "#fff", r.appendChild(this.createSkeletonDiv()), s.appendChild(r), s;
   }
@@ -2148,7 +2164,7 @@ class Et {
     await this.vgsService.whenReady();
     const t = this.cardSection.getVgsContainerIds(), s = this.cardholderSection?.getVgsContainerId(), a = await pt(
       e.styles.fontFamily
-    ), n = this.cardSection.buildVgsFieldCss(
+    ), i = this.cardSection.buildVgsFieldCss(
       e,
       a
     );
@@ -2159,7 +2175,7 @@ class Et {
         cardCvv: t.cardCvv ? `#${t.cardCvv}` : void 0,
         cardholderName: s ? `#${s}` : void 0
       },
-      n,
+      i,
       {
         cardNumber: "1234 5678 9012 3456",
         cardExpiry: this.translationFunc("cardExpiry"),
@@ -2216,18 +2232,18 @@ class Ft {
     this.formManager = e.formManager, this.focusManager = e.focusManager, this.onFormSubmit = e.onFormSubmit, this.onUIUpdate = e.onUIUpdate;
   }
   handleChange = (e) => {
-    const t = e.target, { name: s, value: a } = t, n = s;
-    this.formManager.handleChange(n, a), e instanceof CustomEvent && e.detail?.programmatic ? this.localTouchedFields.delete(n) : this.localTouchedFields.has(n) || (this.localTouchedFields.add(n), this.formManager.handleBlur(n, a));
+    const t = e.target, { name: s, value: a } = t, i = s;
+    this.formManager.handleChange(i, a), e instanceof CustomEvent && e.detail?.programmatic ? this.localTouchedFields.delete(i) : this.localTouchedFields.has(i) || (this.localTouchedFields.add(i), this.formManager.handleBlur(i, a));
     const { formData: o, errors: d, touched: c } = this.formManager.getFormState();
     this.focusManager.handleStateUpdate(o, d, c);
   };
   handleBlur = (e) => {
-    const t = e.target, { name: s, value: a } = t, n = s;
-    this.localTouchedFields.add(n), this.formManager.handleBlur(n, a), setTimeout(() => {
+    const t = e.target, { name: s, value: a } = t, i = s;
+    this.localTouchedFields.add(i), this.formManager.handleBlur(i, a), setTimeout(() => {
       this.onUIUpdate();
     }, 0);
     const { formData: r, errors: o, touched: d } = this.formManager.getFormState();
-    d[n] || this.focusManager.handleStateUpdate(r, o, d);
+    d[i] || this.focusManager.handleStateUpdate(r, o, d);
   };
   handleSubmit = async (e) => {
     e.preventDefault(), await this.onFormSubmit(e);
@@ -2289,15 +2305,15 @@ class Mt {
   isFormDisabled() {
     const e = this.formManager.getFormState(), t = this.checkoutProfile.getState(), s = Object.keys(e.errors).filter(
       (f) => f !== "billingAddress" && f !== "shippingAddress"
-    ).length > 0, a = e.errors.billingAddress, n = a && typeof a == "object" ? Object.keys(a).length > 0 : !1, r = e.errors.shippingAddress, o = r && typeof r == "object" ? Object.keys(r).length > 0 : !1, d = s || n || o, u = J(
+    ).length > 0, a = e.errors.billingAddress, i = a && typeof a == "object" ? Object.keys(a).length > 0 : !1, r = e.errors.shippingAddress, o = r && typeof r == "object" ? Object.keys(r).length > 0 : !1, d = s || i || o, m = J(
       t.checkoutProfile?.layout
-    ) ? !!(e.formData.billingAddress?.firstName || e.formData.billingAddress?.lastName || e.formData.shippingAddress?.firstName || e.formData.shippingAddress?.lastName) : !!e.formData.name, l = t.checkoutProfile?.layout.phoneNumber?.enabled ?? !1 ? !!e.formData.phoneNumber : !0, { billingFields: p, shippingFields: y } = t.checkoutProfile?.layout ?? {}, m = /* @__PURE__ */ new Set(["US", "CA"]), g = (f, v) => {
+    ) ? !!(e.formData.billingAddress?.firstName || e.formData.billingAddress?.lastName || e.formData.shippingAddress?.firstName || e.formData.shippingAddress?.lastName) : !!e.formData.name, l = t.checkoutProfile?.layout.phoneNumber?.enabled ?? !1 ? !!e.formData.phoneNumber : !0, { billingFields: p, shippingFields: y } = t.checkoutProfile?.layout ?? {}, u = /* @__PURE__ */ new Set(["US", "CA"]), g = (f, v) => {
       if (!f) return !0;
       const E = v?.country ?? "";
-      return Object.entries(f).every(([N, x]) => !x?.enabled || N === "state" && (!m.has(E) || x.hiddenForCountries?.includes(E)) ? !0 : !!v?.[N]?.trim());
+      return Object.entries(f).every(([N, x]) => !x?.enabled || N === "state" && (!u.has(E) || x.hiddenForCountries?.includes(E)) ? !0 : !!v?.[N]?.trim());
     }, h = !this.isVgsMode || Object.values(this.vgsFieldsState).every(
       (f) => f?.isValid === !0
-    ), b = this.isVgsMode ? !!e.formData.email && l && h && g(p, e.formData.billingAddress) && g(y, e.formData.shippingAddress) : !!e.formData.email && l && u && !!e.formData.cardNumber && !!e.formData.cardCvv && !!e.formData.cardExpiry && g(p, e.formData.billingAddress) && g(y, e.formData.shippingAddress);
+    ), b = this.isVgsMode ? !!e.formData.email && l && h && g(p, e.formData.billingAddress) && g(y, e.formData.shippingAddress) : !!e.formData.email && l && m && !!e.formData.cardNumber && !!e.formData.cardCvv && !!e.formData.cardExpiry && g(p, e.formData.billingAddress) && g(y, e.formData.shippingAddress);
     return d || !b || this.isSubmitting;
   }
   setSubmitting(e) {
@@ -2314,9 +2330,9 @@ class Mt {
     for (const [s, a] of Object.entries(this.vgsFieldsState)) {
       if (!a?.isTouched || a.isFocused || a.isValid)
         continue;
-      const n = a.errors?.[0];
-      if (!n) continue;
-      const r = Pe(s, n.code);
+      const i = a.errors?.[0];
+      if (!i) continue;
+      const r = Pe(s, i.code);
       r && (t[s] = e(r));
     }
     return t;
@@ -2347,12 +2363,12 @@ const he = {
   city: "",
   zipCode: "",
   country: ""
-}, ue = (i, e) => {
+}, ue = (n, e) => {
   const t = {}, s = `${e}.`;
-  return Object.keys(i).forEach((a) => {
+  return Object.keys(n).forEach((a) => {
     if (a.startsWith(s)) {
-      const n = a.slice(s.length);
-      t[n] = i[a];
+      const i = a.slice(s.length);
+      t[i] = n[a];
     }
   }), t;
 };
@@ -2428,7 +2444,7 @@ class wt {
     this.spinner && (this.spinner.getElement().remove(), this.spinner = void 0), this.formSkeleton && (this.formSkeleton.getElement().remove(), this.formSkeleton = void 0), this.alert && (this.alert.getElement().remove(), this.alert = void 0);
   }
 }
-const T = (i) => ({
+const T = (n) => ({
   street: "",
   firstName: "",
   lastName: "",
@@ -2436,7 +2452,7 @@ const T = (i) => ({
   city: "",
   zipCode: "",
   country: "",
-  ...i
+  ...n
 });
 class Pt extends A {
   options;
@@ -2568,7 +2584,7 @@ class Pt extends A {
     }), e.checkoutProfile.layout.shippingFields && this.formManager.getFormState().formData.shippingAddress === void 0 && this.formManager.setFormData({
       shippingAddress: T()
     });
-    const { formData: t, errors: s, touched: a } = this._getFormStateData(), n = gt(
+    const { formData: t, errors: s, touched: a } = this._getFormStateData(), i = gt(
       e.checkoutProfile.layout
     );
     try {
@@ -2589,7 +2605,7 @@ class Pt extends A {
     } catch (o) {
       console.error("Failed to create email field:", o);
     }
-    if (n) {
+    if (i) {
       try {
         this.componentManager.createBillingAddressSection(
           e.checkoutProfile,
@@ -2675,7 +2691,7 @@ class Pt extends A {
     )) return;
     const { formData: s } = this._getFormStateData(), a = s.billingAddress ?? s.shippingAddress;
     if (!a) return;
-    const n = a.firstName?.trim() ?? "", r = a.lastName?.trim() ?? "", o = [n, r].filter(Boolean).join(" ");
+    const i = a.firstName?.trim() ?? "", r = a.lastName?.trim() ?? "", o = [i, r].filter(Boolean).join(" ");
     o && this.formManager.setFormData({ name: o });
   }
   /**
@@ -2686,10 +2702,10 @@ class Pt extends A {
   inferAddresses() {
     const e = this.checkoutProfile.getState();
     if (!e.checkoutProfile) return;
-    const { billingFields: t, shippingFields: s } = e.checkoutProfile.layout, a = t && Object.values(t).some((o) => o?.enabled), n = s && Object.values(s).some((o) => o?.enabled), { formData: r } = this._getFormStateData();
-    !a && n && r.shippingAddress ? this.formManager.setFormData({
+    const { billingFields: t, shippingFields: s } = e.checkoutProfile.layout, a = t && Object.values(t).some((o) => o?.enabled), i = s && Object.values(s).some((o) => o?.enabled), { formData: r } = this._getFormStateData();
+    !a && i && r.shippingAddress ? this.formManager.setFormData({
       billingAddress: { ...r.shippingAddress }
-    }) : !n && a && r.billingAddress && this.formManager.setFormData({
+    }) : !i && a && r.billingAddress && this.formManager.setFormData({
       shippingAddress: { ...r.billingAddress }
     });
   }
@@ -2777,8 +2793,8 @@ class Pt extends A {
       this.eventHandler.handleKeyDown
     ), this.componentManager.cleanup(), this.uiManager.cleanup(), this.getElement().remove();
   }
-  associatePayment(e, t, s, a, n) {
-    this.options.paymentId = e, this.options.checkoutKey = t, this.options.supportedPaymentMethods = s, this.options.checkoutDetails = a, this.componentManager.setCheckoutDetailsLoaded(!0), n && !this.vgsService && (this.vgsJwt = n, this.vgsService = new L(), this.componentManager.setVgsService(this.vgsService), this.stateCoordinator.setVgsMode(!0), this.vgsService.init(this.options.environment).then((o) => {
+  associatePayment(e, t, s, a, i) {
+    this.options.paymentId = e, this.options.checkoutKey = t, this.options.supportedPaymentMethods = s, this.options.checkoutDetails = a, this.componentManager.setCheckoutDetailsLoaded(!0), i && !this.vgsService && (this.vgsJwt = i, this.vgsService = new L(), this.componentManager.setVgsService(this.vgsService), this.stateCoordinator.setVgsMode(!0), this.vgsService.init(this.options.environment).then((o) => {
       this.vgsService?.createForm(
         o,
         (d) => this.handleVgsStateChange(d)
@@ -2791,7 +2807,7 @@ class Pt extends A {
       e,
       t,
       a
-    ), !n && this.checkoutProfile.getState().checkoutProfile && this.renderFormComponents();
+    ), !i && this.checkoutProfile.getState().checkoutProfile && this.renderFormComponents();
     const r = this.checkoutProfile.getState();
     if (r.checkoutProfile) {
       const { formData: o } = this._getFormStateData();
@@ -2854,13 +2870,13 @@ class kt {
   clearError() {
     this.form && this.form.clearErrorMessage();
   }
-  async associatePayment(e, t, s, a, n) {
-    this.options.paymentId = e, this.options.checkoutKey = t, this.options.checkoutDetails = a, this.options.vgsJwt = n, this.form && this.form.associatePayment(
+  async associatePayment(e, t, s, a, i) {
+    this.options.paymentId = e, this.options.checkoutKey = t, this.options.checkoutDetails = a, this.options.vgsJwt = i, this.form && this.form.associatePayment(
       e,
       t,
       s,
       a,
-      n
+      i
     );
   }
 }
@@ -2889,13 +2905,14 @@ class At {
 const xt = "en";
 class Dt {
   config;
+  _callbacks;
   paymentState;
   apiService;
   formManager;
   stateManager;
   sessionId;
   constructor(e) {
-    this.config = this.validateConfig(e), this.paymentState = {}, this.sessionId = crypto.randomUUID(), ot({
+    this.config = this.validateConfig(e), this._callbacks = { ...this.config.callbacks }, this.paymentState = {}, this.sessionId = crypto.randomUUID(), ot({
       environment: this.config.environment,
       sessionId: this.sessionId
     }), M(F.CHECKOUT_INITIALIZED, {
@@ -2913,7 +2930,7 @@ class Dt {
         disableErrorMessages: this.config.disableErrorMessages,
         environment: this.config.environment,
         appearance: this.config.appearance,
-        onLoadingStateChange: this.config.callbacks.onLoadingStateChange,
+        onLoadingStateChange: (...t) => this._callbacks.onLoadingStateChange?.(...t),
         initialValues: this.config.initialValues
       },
       this.handleSubmit.bind(this)
@@ -2979,7 +2996,7 @@ class Dt {
     });
     const a = performance.now();
     try {
-      const n = await this.apiService.authorizePayment({
+      const i = await this.apiService.authorizePayment({
         checkoutKey: this.paymentState.checkoutKey,
         formData: e || null,
         paymentId: this.paymentState.paymentId,
@@ -2998,8 +3015,8 @@ class Dt {
       ), M(F.PAYMENT_SUBMIT_SUCCESS, {
         payment_id: this.paymentState.paymentId,
         payment_method: s
-      }), this.handlePaymentResponse(n);
-    } catch (n) {
+      }), this.handlePaymentResponse(i);
+    } catch (i) {
       const r = performance.now() - a;
       oe(
         se.PAYMENT_AUTHORIZATION_TIME,
@@ -3013,29 +3030,27 @@ class Dt {
       ), M(F.PAYMENT_SUBMIT_FAILED, {
         payment_id: this.paymentState.paymentId,
         payment_method: s,
-        error_message: n.details?.message ?? "Unknown error"
-      }), this.handleAuthorizationError(n);
+        error_message: i.details?.message ?? "Unknown error"
+      }), this.handleAuthorizationError(i);
     }
   }
   handlePaymentResponse(e) {
     if (e.latestTransaction.status === "authorized" && (M(F.PAYMENT_AUTHORIZED, {
       payment_id: this.paymentState.paymentId ?? "",
       status: e.latestTransaction.status
-    }), this.config.callbacks.onPaymentSucceeded?.(
-      e.latestTransaction.status
-    )), e.latestTransaction.status === "failed" && (M(F.PAYMENT_FAILED, {
+    }), this._callbacks.onPaymentSucceeded?.(e.latestTransaction.status)), e.latestTransaction.status === "failed" && (M(F.PAYMENT_FAILED, {
       payment_id: this.paymentState.paymentId ?? "",
       status: e.latestTransaction.status
-    }), this.config.callbacks.onPaymentFailed?.(e.latestTransaction.status)), e.status === "requires_action") {
+    }), this._callbacks.onPaymentFailed?.(e.latestTransaction.status)), e.status === "requires_action") {
       const { redirectUrl: t } = e.action;
       M(F.PAYMENT_ACTION_REQUIRED, {
         payment_id: this.paymentState.paymentId ?? "",
         status: e.status
-      }), this.config.manualActionHandling ? this.config.callbacks.onActionRequired?.(t) : globalThis.location.href = t;
+      }), this.config.manualActionHandling ? this._callbacks.onActionRequired?.(t) : globalThis.location.href = t;
     }
   }
   handleAuthorizationError(e) {
-    this.config.callbacks.onPaymentFailed?.(e.details?.message);
+    this._callbacks.onPaymentFailed?.(e.details?.message);
     const { form: t } = this.stateManager.getState();
     t && this.formManager.update({ errorMsg: e.details?.message });
   }
@@ -3078,7 +3093,7 @@ class Dt {
           "Invalid response: supportedPaymentMethods must be an array"
         );
       if (!s.supportedPaymentMethods.every(
-        (n) => typeof n == "string"
+        (i) => typeof i == "string"
       ))
         throw new Error(
           "Invalid response: all supportedPaymentMethods must be strings"
@@ -3089,7 +3104,7 @@ class Dt {
         countryCode: s.countryCode
       };
       const a = s.supportedPaymentMethods.reduce(
-        (n, r) => (n[r] = !0, n),
+        (i, r) => (i[r] = !0, i),
         {}
       );
       await this.formManager.associatePayment(
@@ -3113,6 +3128,9 @@ class Dt {
       ), s;
     }
   }
+  setCallbacks(e) {
+    Object.assign(this._callbacks, e);
+  }
 }
 typeof globalThis < "u" && (globalThis.OdusCheckout = Dt);
 export {