@reevit/vue 0.4.0 → 0.4.6

package/dist/index.mjs

@@ -1,334 +1,517 @@
-import { ref as $, watch as N, computed as w, readonly as _, defineComponent as V, createElementBlock as h, openBlock as v, createElementVNode as c, toDisplayString as I, unref as L, Fragment as q, renderList as Q, normalizeClass as D, createCommentVNode as E, withModifiers as X, withDirectives as oe, vModelText as ae, createTextVNode as Z, normalizeStyle as ee, onUnmounted as re, renderSlot as Y, createBlock as W, Teleport as se, createVNode as ie } from "vue";
-import { createInitialState as le, ReevitAPIClient as ce, generateReference as de, detectCountryFromCurrency as ue, reevitReducer as me, formatAmount as pe, cn as te, detectNetwork as ye, validatePhone as G, createThemeVariables as ve } from "@reevit/core";
-import { ReevitAPIClient as vt, cn as ht, createReevitClient as ft, detectCountryFromCurrency as bt, detectNetwork as wt, formatAmount as kt, formatPhone as Pt, validatePhone as Ct } from "@reevit/core";
-function he(t) {
-  const n = t.toLowerCase();
-  return n.includes("paystack") ? "paystack" : n.includes("hubtel") ? "hubtel" : n.includes("flutterwave") ? "flutterwave" : n.includes("stripe") ? "stripe" : n.includes("monnify") ? "monnify" : n.includes("mpesa") || n.includes("m-pesa") ? "mpesa" : "paystack";
+import { ref as V, watch as j, computed as f, readonly as N, defineComponent as ee, createElementBlock as v, openBlock as m, normalizeClass as z, createCommentVNode as L, createElementVNode as r, unref as q, Fragment as Y, renderList as re, normalizeStyle as Z, toDisplayString as I, renderSlot as ae, createVNode as ie, withModifiers as ue, withDirectives as ye, vModelText as be, createTextVNode as pe, onUnmounted as fe, createBlock as se, Teleport as _e, withCtx as ke } from "vue";
+import { createInitialState as we, ReevitAPIClient as Pe, generateReference as ge, detectCountryFromCurrency as Ce, reevitReducer as Se, cn as me, detectNetwork as Me, validatePhone as le, createReevitClient as Ie, createThemeVariables as Ee } from "@reevit/core";
+import { ReevitAPIClient as Zt, cn as en, createReevitClient as tn, detectCountryFromCurrency as nn, detectNetwork as on, formatAmount as sn, formatPhone as an, validatePhone as rn } from "@reevit/core";
+const Re = "https://api.reevit.io";
+function $e(e, t) {
+  return {
+    code: t?.code || "payment_link_error",
+    message: t?.message || "Payment link request failed",
+    recoverable: !0,
+    details: {
+      httpStatus: e.status,
+      ...t?.details || {}
+    }
+  };
 }
-function fe(t, n) {
+function xe(e) {
+  const t = e.toLowerCase();
+  return t.includes("paystack") ? "paystack" : t.includes("hubtel") ? "hubtel" : t.includes("flutterwave") ? "flutterwave" : t.includes("stripe") ? "stripe" : t.includes("monnify") ? "monnify" : t.includes("mpesa") || t.includes("m-pesa") ? "mpesa" : "paystack";
+}
+function Le(e) {
+  const t = e.toLowerCase().trim();
+  return t === "card" ? "card" : t === "mobile_money" || t === "momo" || t === "mobilemoney" ? "mobile_money" : t === "bank" || t === "bank_transfer" || t === "transfer" ? "bank_transfer" : null;
+}
+function Te(e) {
+  if (!(!e || e.length === 0))
+    return e.map((t) => {
+      const n = t.methods.map((d) => Le(d)).filter(Boolean);
+      return {
+        provider: t.provider,
+        name: t.name,
+        methods: n,
+        countries: t.countries
+      };
+    }).filter((t) => t.methods.length > 0);
+}
+function Ne(e, t) {
   return {
-    id: t.id,
-    clientSecret: t.client_secret,
-    pspPublicKey: t.psp_public_key,
-    pspCredentials: t.psp_credentials,
-    amount: t.amount,
-    currency: t.currency,
-    status: t.status,
-    recommendedPsp: he(t.provider),
-    availableMethods: n.paymentMethods || ["card", "mobile_money"],
-    reference: t.reference || n.reference,
-    connectionId: t.connection_id,
-    provider: t.provider,
-    feeAmount: t.fee_amount,
-    feeCurrency: t.fee_currency,
-    netAmount: t.net_amount,
-    metadata: n.metadata
+    id: e.id,
+    clientSecret: e.client_secret,
+    pspPublicKey: e.psp_public_key,
+    pspCredentials: e.psp_credentials,
+    amount: e.amount,
+    currency: e.currency,
+    status: e.status,
+    recommendedPsp: xe(e.provider),
+    availableMethods: t.paymentMethods || ["card", "mobile_money"],
+    reference: e.reference || t.reference,
+    connectionId: e.connection_id,
+    provider: e.provider,
+    feeAmount: e.fee_amount,
+    feeCurrency: e.fee_currency,
+    netAmount: e.net_amount,
+    metadata: t.metadata,
+    availableProviders: Te(e.available_psps),
+    branding: e.branding
   };
 }
-function be(t) {
-  const { config: n, onSuccess: e, onError: i, onClose: o, onStateChange: m, apiBaseUrl: d } = t, s = $(le());
-  if (n.initialPaymentIntent) {
-    const l = n.initialPaymentIntent;
-    s.value = {
-      ...s.value,
+function Ue(e) {
+  const { config: t, onSuccess: n, onError: d, onClose: i, onStateChange: p, apiBaseUrl: u } = e, a = V(we());
+  if (t.initialPaymentIntent) {
+    const b = t.initialPaymentIntent;
+    a.value = {
+      ...a.value,
       status: "ready",
-      paymentIntent: l,
-      selectedMethod: l.availableMethods?.length === 1 ? l.availableMethods[0] : null
+      paymentIntent: b,
+      selectedMethod: b.availableMethods?.length === 1 ? b.availableMethods[0] : null
     };
   }
-  const p = new ce({
-    publicKey: n.publicKey,
-    baseUrl: d
-  }), u = (l) => {
-    s.value = me(s.value, l);
+  const h = new Pe({
+    publicKey: t.publicKey,
+    baseUrl: u
+  }), o = (b) => {
+    a.value = Se(a.value, b);
   };
-  N(
-    () => s.value.status,
-    (l) => {
-      m?.(l);
+  j(
+    () => a.value.status,
+    (b) => {
+      p?.(b);
     }
   );
-  const a = async (l) => {
-    u({ type: "INIT_START" });
+  const l = async (b, w) => {
+    o({ type: "INIT_START" });
     try {
-      const r = n.reference || de(), y = ue(n.currency), b = l || n.paymentMethods?.[0] || "card", { data: P, error: H } = await p.createPaymentIntent(
-        { ...n, reference: r },
-        b,
-        y
-      );
-      if (H) {
-        u({ type: "INIT_ERROR", payload: H }), i?.(H);
+      const g = t.reference || ge(), E = Ce(t.currency), $ = t.paymentMethods && t.paymentMethods.length === 1 ? t.paymentMethods[0] : void 0, R = b ?? $;
+      let D, C;
+      if (t.paymentLinkCode) {
+        const x = await fetch(
+          `${u || Re}/v1/pay/${t.paymentLinkCode}/pay`,
+          {
+            method: "POST",
+            headers: {
+              "Content-Type": "application/json",
+              "Idempotency-Key": `${Date.now()}-${Math.random().toString(36).substring(2, 15)}`
+            },
+            body: JSON.stringify({
+              amount: t.amount,
+              email: t.email || "",
+              name: t.customerName || "",
+              phone: t.phone || "",
+              method: R,
+              country: E,
+              provider: w?.preferredProvider || w?.allowedProviders?.[0],
+              custom_fields: t.customFields
+            })
+          }
+        ), c = await x.json().catch(() => ({}));
+        x.ok ? D = c : C = $e(x, c);
+      } else {
+        const x = await h.createPaymentIntent(
+          { ...t, reference: g },
+          R,
+          E,
+          {
+            preferredProviders: w?.preferredProvider ? [w.preferredProvider] : void 0,
+            allowedProviders: w?.allowedProviders
+          }
+        );
+        D = x.data, C = x.error;
+      }
+      if (C) {
+        o({ type: "INIT_ERROR", payload: C }), d?.(C);
         return;
       }
-      if (!P) {
-        const B = {
+      if (!D) {
+        const x = {
           code: "INIT_FAILED",
           message: "No data received from API",
           recoverable: !0
         };
-        u({ type: "INIT_ERROR", payload: B }), i?.(B);
+        o({ type: "INIT_ERROR", payload: x }), d?.(x);
         return;
       }
-      const ne = fe(P, { ...n, reference: r });
-      u({ type: "INIT_SUCCESS", payload: ne });
-    } catch (r) {
-      const y = {
+      const H = Ne(D, { ...t, reference: g });
+      o({ type: "INIT_SUCCESS", payload: H });
+    } catch (g) {
+      const E = {
         code: "INIT_FAILED",
-        message: r instanceof Error ? r.message : "Failed to initialize checkout",
+        message: g instanceof Error ? g.message : "Failed to initialize checkout",
         recoverable: !0,
-        originalError: r
+        originalError: g
       };
-      u({ type: "INIT_ERROR", payload: y }), i?.(y);
+      o({ type: "INIT_ERROR", payload: E }), d?.(E);
     }
-  }, f = (l) => {
-    u({ type: "SELECT_METHOD", payload: l });
-  }, C = async (l) => {
-    if (!(!s.value.paymentIntent || !s.value.selectedMethod)) {
-      u({ type: "PROCESS_START" });
+  }, _ = (b) => {
+    o({ type: "SELECT_METHOD", payload: b });
+  }, T = async (b) => {
+    if (!(!a.value.paymentIntent || !a.value.selectedMethod)) {
+      o({ type: "PROCESS_START" });
       try {
-        let r;
-        if (s.value.paymentIntent.clientSecret) {
-          const { data: b, error: P } = await p.confirmPaymentIntent(
-            s.value.paymentIntent.id,
-            s.value.paymentIntent.clientSecret
+        let w;
+        if (a.value.paymentIntent.clientSecret) {
+          const { data: E, error: $ } = await h.confirmPaymentIntent(
+            a.value.paymentIntent.id,
+            a.value.paymentIntent.clientSecret
           );
-          if (P) {
-            u({ type: "PROCESS_ERROR", payload: P }), i?.(P);
+          if ($) {
+            o({ type: "PROCESS_ERROR", payload: $ }), d?.($);
             return;
           }
-          r = b;
+          w = E;
         } else {
-          const { data: b, error: P } = await p.confirmPayment(s.value.paymentIntent.id);
-          if (P) {
-            u({ type: "PROCESS_ERROR", payload: P }), i?.(P);
+          const { data: E, error: $ } = await h.confirmPayment(a.value.paymentIntent.id);
+          if ($) {
+            o({ type: "PROCESS_ERROR", payload: $ }), d?.($);
             return;
           }
-          r = b;
+          w = E;
         }
-        const y = {
-          paymentId: s.value.paymentIntent.id,
-          reference: l.reference || s.value.paymentIntent.reference || s.value.paymentIntent.metadata?.reference || "",
-          amount: s.value.paymentIntent.amount,
-          currency: s.value.paymentIntent.currency,
-          paymentMethod: s.value.selectedMethod,
-          psp: s.value.paymentIntent.recommendedPsp,
-          pspReference: l.pspReference || r?.provider_ref_id || "",
+        const g = {
+          paymentId: a.value.paymentIntent.id,
+          reference: b.reference || a.value.paymentIntent.reference || a.value.paymentIntent.metadata?.reference || "",
+          amount: a.value.paymentIntent.amount,
+          currency: a.value.paymentIntent.currency,
+          paymentMethod: a.value.selectedMethod,
+          psp: a.value.paymentIntent.recommendedPsp,
+          pspReference: b.pspReference || w?.provider_ref_id || "",
           status: "success",
-          metadata: l
+          metadata: b
         };
-        u({ type: "PROCESS_SUCCESS", payload: y }), e?.(y);
-      } catch (r) {
-        const y = {
+        o({ type: "PROCESS_SUCCESS", payload: g }), n?.(g);
+      } catch (w) {
+        const g = {
           code: "PAYMENT_FAILED",
-          message: r instanceof Error ? r.message : "Payment failed",
+          message: w instanceof Error ? w.message : "Payment failed",
           recoverable: !0,
-          originalError: r
+          originalError: w
         };
-        u({ type: "PROCESS_ERROR", payload: y }), i?.(y);
+        o({ type: "PROCESS_ERROR", payload: g }), d?.(g);
       }
     }
-  }, g = async (l) => {
-    await C(l);
-  }, A = (l) => {
-    u({ type: "PROCESS_ERROR", payload: l }), i?.(l);
-  }, S = () => {
-    u({ type: "RESET" });
-  }, U = async () => {
-    if (s.value.paymentIntent && s.value.status !== "success")
+  }, U = async (b) => {
+    await T(b);
+  }, ne = (b) => {
+    o({ type: "PROCESS_ERROR", payload: b }), d?.(b);
+  }, W = () => {
+    o({ type: "RESET" });
+  }, O = async () => {
+    if (a.value.paymentIntent && a.value.status !== "success")
       try {
-        await p.cancelPaymentIntent(s.value.paymentIntent.id);
+        await h.cancelPaymentIntent(a.value.paymentIntent.id);
       } catch {
       }
-    u({ type: "CLOSE" }), o?.();
-  }, M = w(() => s.value.status), K = w(() => s.value.paymentIntent), R = w(() => s.value.selectedMethod), j = w(() => s.value.error), k = w(() => s.value.result), O = w(
-    () => s.value.status === "loading" || s.value.status === "processing"
-  ), x = w(
-    () => s.value.status === "ready" || s.value.status === "method_selected" || s.value.status === "processing"
-  ), T = w(() => s.value.status === "success"), z = w(() => s.value.error?.recoverable ?? !1);
+    o({ type: "CLOSE" }), i?.();
+  }, M = f(() => a.value.status), G = f(() => a.value.paymentIntent), Q = f(() => a.value.selectedMethod), J = f(() => a.value.error), F = f(() => a.value.result), A = f(
+    () => a.value.status === "loading" || a.value.status === "processing"
+  ), S = f(
+    () => a.value.status === "ready" || a.value.status === "method_selected" || a.value.status === "processing"
+  ), X = f(() => a.value.status === "success"), oe = f(() => a.value.error?.recoverable ?? !1);
   return {
     // State (readonly refs)
-    status: _(M),
-    paymentIntent: _(K),
-    selectedMethod: _(R),
-    error: _(j),
-    result: _(k),
+    status: N(M),
+    paymentIntent: N(G),
+    selectedMethod: N(Q),
+    error: N(J),
+    result: N(F),
     // Actions
-    initialize: a,
-    selectMethod: f,
-    processPayment: C,
-    handlePspSuccess: g,
-    handlePspError: A,
-    reset: S,
-    close: U,
+    initialize: l,
+    selectMethod: _,
+    processPayment: T,
+    handlePspSuccess: U,
+    handlePspError: ne,
+    reset: W,
+    close: O,
     // Computed
-    isLoading: _(O),
-    isReady: _(x),
-    isComplete: _(T),
-    canRetry: _(z)
+    isLoading: N(A),
+    isReady: N(S),
+    isComplete: N(X),
+    canRetry: N(oe)
   };
 }
-const we = { class: "reevit-method-selector" }, ke = { class: "reevit-amount-display" }, Pe = { class: "reevit-methods-grid" }, Ce = ["onClick"], _e = { class: "reevit-method-icon" }, Se = { class: "reevit-method-info" }, Ee = { class: "reevit-method-name" }, Ie = { class: "reevit-method-description" }, ge = { class: "reevit-method-radio" }, Me = {
+const Oe = {
+  key: 0,
+  class: "reevit-method-selector__label"
+}, Fe = ["onClick"], Ae = { class: "reevit-method-option__icon-wrapper" }, De = { class: "reevit-method-option__icon" }, Ke = { class: "reevit-method-option__content" }, je = { class: "reevit-method-option__label" }, ze = {
   key: 0,
-  class: "reevit-radio-inner"
-}, Re = /* @__PURE__ */ V({
+  class: "reevit-method-option__description"
+}, He = {
+  key: 0,
+  class: "reevit-method-option__check"
+}, Be = {
+  key: 1,
+  class: "reevit-method-option__chevron"
+}, ve = /* @__PURE__ */ ee({
   __name: "PaymentMethodSelector",
   props: {
     methods: {},
     selected: {},
-    amount: {},
-    currency: {},
-    provider: {}
+    provider: {},
+    layout: {},
+    showLabel: { type: Boolean }
   },
   emits: ["select"],
-  setup(t, { emit: n }) {
-    const e = t, i = n, o = {
-      hubtel: "Hubtel",
-      paystack: "Paystack",
-      flutterwave: "Flutterwave",
-      monnify: "Monnify",
-      mpesa: "M-Pesa",
-      stripe: "Stripe"
-    }, m = (p) => e.provider?.toLowerCase().includes("hubtel") && p === "mobile_money" ? `Pay with ${o[e.provider.toLowerCase()] || "Hubtel"}` : {
-      card: "Card",
-      mobile_money: "Mobile Money",
-      bank_transfer: "Bank Transfer"
-    }[p], d = (p) => e.provider?.toLowerCase().includes("hubtel") ? "Card, Mobile Money, and Bank Transfer" : {
-      card: "Visa, Mastercard, Maestro",
-      mobile_money: "MTN, Vodafone, AirtelTigo",
-      bank_transfer: "Transfer directly from your bank"
-    }[p], s = w(() => [
+  setup(e, { emit: t }) {
+    const n = e, { showLabel: d = !0 } = n, i = t, p = f(() => (n.layout || "list") === "grid"), u = f(() => [
       {
         id: "card",
-        name: m("card"),
-        description: d("card"),
-        icon: "💳"
+        name: "Card",
+        icon: "💳",
+        description: "Pay with Visa, Mastercard, or other cards"
       },
       {
         id: "mobile_money",
-        name: m("mobile_money"),
-        description: d("mobile_money"),
-        icon: "📱"
+        name: "Mobile Money",
+        icon: "📱",
+        description: "MTN, Vodafone Cash, AirtelTigo Money"
       },
       {
         id: "bank_transfer",
-        name: m("bank_transfer"),
-        description: d("bank_transfer"),
-        icon: "🏦"
+        name: "Bank Transfer",
+        icon: "🏦",
+        description: "Pay directly from your bank account"
       }
-    ].filter((p) => e.methods.includes(p.id)));
-    return (p, u) => (v(), h("div", we, [
-      u[0] || (u[0] = c("h3", { class: "reevit-section-title" }, "Select Payment Method", -1)),
-      c("p", ke, " Pay " + I(L(pe)(t.amount, t.currency)), 1),
-      c("div", Pe, [
-        (v(!0), h(q, null, Q(s.value, (a) => (v(), h("button", {
-          key: a.id,
+    ].filter((a) => n.methods.includes(a.id)));
+    return (a, h) => (m(), v("div", {
+      class: z(["reevit-method-selector", { "reevit-method-selector--grid": p.value }])
+    }, [
+      q(d) ? (m(), v("div", Oe, "Select payment method")) : L("", !0),
+      r("div", {
+        class: z(["reevit-method-selector__options", p.value ? "reevit-method-selector__options--grid" : "reevit-method-selector__options--list"])
+      }, [
+        (m(!0), v(Y, null, re(u.value, (o, l) => (m(), v("button", {
+          key: o.id,
           type: "button",
-          class: D(L(te)("reevit-method-card", t.selected === a.id && "reevit-method-card--selected")),
-          onClick: (f) => i("select", a.id)
+          class: z(["reevit-method-option", [
+            p.value ? "reevit-method-option--grid" : "reevit-method-option--list",
+            { "reevit-method-option--selected": e.selected === o.id }
+          ]]),
+          style: Z({ animationDelay: `${l * 0.05}s` }),
+          onClick: (_) => i("select", o.id)
         }, [
-          c("span", _e, I(a.icon), 1),
-          c("div", Se, [
-            c("span", Ee, I(a.name), 1),
-            c("span", Ie, I(a.description), 1)
+          r("span", Ae, [
+            r("span", De, I(o.icon), 1)
           ]),
-          c("div", ge, [
-            t.selected === a.id ? (v(), h("div", Me)) : E("", !0)
-          ])
-        ], 10, Ce))), 128))
+          r("div", Ke, [
+            r("span", je, I(o.name), 1),
+            p.value ? L("", !0) : (m(), v("span", ze, I(o.description), 1))
+          ]),
+          p.value ? L("", !0) : (m(), v(Y, { key: 0 }, [
+            e.selected === o.id ? (m(), v("span", He, [...h[0] || (h[0] = [
+              r("svg", {
+                width: "20",
+                height: "20",
+                viewBox: "0 0 24 24",
+                fill: "none",
+                stroke: "currentColor",
+                "stroke-width": "3",
+                "stroke-linecap": "round",
+                "stroke-linejoin": "round"
+              }, [
+                r("polyline", { points: "20 6 9 17 4 12" })
+              ], -1)
+            ])])) : (m(), v("span", Be, [...h[1] || (h[1] = [
+              r("svg", {
+                width: "16",
+                height: "16",
+                viewBox: "0 0 24 24",
+                fill: "none",
+                stroke: "currentColor",
+                "stroke-width": "2.5",
+                "stroke-linecap": "round",
+                "stroke-linejoin": "round"
+              }, [
+                r("polyline", { points: "9 18 15 12 9 6" })
+              ], -1)
+            ])]))
+          ], 64))
+        ], 14, Fe))), 128))
+      ], 2)
+    ], 2));
+  }
+}), Ve = { class: "reevit-psp-selector" }, qe = { class: "reevit-psp-selector__options" }, Ye = ["disabled", "aria-expanded", "onClick"], Ge = {
+  class: "reevit-psp-option__logo",
+  "aria-hidden": "true"
+}, Je = ["src"], We = {
+  key: 1,
+  class: "reevit-psp-option__logo-fallback"
+}, Qe = { class: "reevit-psp-option__content" }, Xe = { class: "reevit-psp-option__name" }, Ze = { class: "reevit-psp-option__methods" }, et = {
+  key: 0,
+  class: "reevit-psp-accordion__content reevit-animate-fade-in"
+}, tt = { class: "reevit-psp-methods" }, nt = /* @__PURE__ */ ee({
+  __name: "ProviderSelector",
+  props: {
+    providers: {},
+    selectedProvider: {},
+    disabled: { type: Boolean },
+    theme: {},
+    selectedMethod: {}
+  },
+  emits: ["select", "methodSelect"],
+  setup(e, { emit: t }) {
+    const n = t, d = {
+      paystack: "https://reevit.io/images/providers/paystack.png",
+      stripe: "https://reevit.io/images/providers/stripe.png",
+      flutterwave: "https://reevit.io/images/providers/flutterwave.png",
+      hubtel: "https://reevit.io/images/providers/hubtel.png",
+      monnify: "https://reevit.io/images/providers/monnify.png",
+      mpesa: "https://reevit.io/images/providers/mpesa.png"
+    }, i = {
+      card: "Card",
+      mobile_money: "Mobile Money",
+      bank_transfer: "Bank Transfer"
+    }, p = (a) => a.length ? a.map((h) => i[h]).join(", ") : "Payment methods", u = (a, h) => a.toLowerCase().includes("hubtel") ? h.filter((o) => o === "card" || o === "mobile_money") : h;
+    return (a, h) => (m(), v("div", Ve, [
+      h[1] || (h[1] = r("div", { class: "reevit-psp-selector__label" }, "Select payment provider", -1)),
+      r("div", qe, [
+        (m(!0), v(Y, null, re(e.providers, (o) => (m(), v("div", {
+          key: o.provider,
+          class: "reevit-psp-accordion"
+        }, [
+          r("button", {
+            type: "button",
+            class: z(
+              q(me)(
+                "reevit-psp-option",
+                e.selectedProvider === o.provider && "reevit-psp-option--selected",
+                e.disabled && "reevit-psp-option--disabled"
+              )
+            ),
+            disabled: e.disabled,
+            "aria-expanded": e.selectedProvider === o.provider,
+            onClick: (l) => n("select", o.provider)
+          }, [
+            r("span", Ge, [
+              d[o.provider] ? (m(), v("img", {
+                key: 0,
+                src: d[o.provider],
+                alt: "",
+                class: "reevit-psp-option__logo-img",
+                loading: "lazy"
+              }, null, 8, Je)) : (m(), v("span", We, I(o.name.slice(0, 1).toUpperCase()), 1))
+            ]),
+            r("div", Qe, [
+              r("span", Xe, I(o.name), 1),
+              r("span", Ze, I(p(u(o.provider, o.methods))), 1)
+            ])
+          ], 10, Ye),
+          e.selectedProvider === o.provider ? (m(), v("div", et, [
+            r("div", tt, [
+              ie(ve, {
+                methods: u(o.provider, o.methods),
+                selected: e.selectedMethod || null,
+                provider: o.provider,
+                "show-label": !1,
+                layout: "list",
+                onSelect: h[0] || (h[0] = (l) => n("methodSelect", l))
+              }, null, 8, ["methods", "selected", "provider"])
+            ]),
+            ae(a.$slots, "method-content")
+          ])) : L("", !0)
+        ]))), 128))
       ])
     ]));
   }
-}), xe = { class: "reevit-form-group" }, Te = ["disabled"], $e = { class: "reevit-network-selector" }, Ne = { class: "reevit-networks-grid" }, Le = ["onClick", "disabled"], Ue = {
+}), ot = { class: "reevit-form-group" }, st = ["disabled"], at = { class: "reevit-network-selector" }, it = { class: "reevit-networks-grid" }, rt = ["onClick", "disabled"], lt = {
   key: 0,
   class: "reevit-error-message"
-}, Oe = ["disabled"], De = {
+}, dt = { class: "reevit-momo-form__actions" }, ct = ["disabled"], ut = ["disabled"], pt = {
   key: 0,
   class: "reevit-spinner"
-}, Fe = { key: 1 }, Ae = /* @__PURE__ */ V({
+}, mt = { key: 1 }, de = /* @__PURE__ */ ee({
   __name: "MobileMoneyForm",
   props: {
     initialPhone: {},
-    loading: { type: Boolean }
+    loading: { type: Boolean },
+    hideCancel: { type: Boolean }
   },
-  emits: ["submit"],
-  setup(t, { emit: n }) {
-    const e = t, i = n, o = $(e.initialPhone || ""), m = $(null), d = $(null);
-    N(o, (u) => {
-      const a = ye(u);
-      a && (m.value = a), d.value && (d.value = null);
+  emits: ["submit", "cancel"],
+  setup(e, { emit: t }) {
+    const n = e, d = t, i = V(n.initialPhone || ""), p = V(null), u = V(null);
+    j(i, (o) => {
+      const l = Me(o);
+      l && (p.value = l), u.value && (u.value = null);
     });
-    const s = () => {
-      if (!G(o.value)) {
-        d.value = "Please enter a valid phone number";
+    const a = () => {
+      if (!le(i.value)) {
+        u.value = "Please enter a valid phone number";
         return;
       }
-      if (!m.value) {
-        d.value = "Please select your mobile network";
+      if (!p.value) {
+        u.value = "Please select your mobile network";
         return;
       }
-      i("submit", {
-        phone: o.value,
-        network: m.value
+      d("submit", {
+        phone: i.value,
+        network: p.value
       });
-    }, p = [
+    }, h = [
       { id: "mtn", name: "MTN", color: "#FFCC00" },
       { id: "vodafone", name: "Vodafone", color: "#E60000" },
       { id: "airteltigo", name: "AirtelTigo", color: "#005596" }
     ];
-    return (u, a) => (v(), h("form", {
+    return (o, l) => (m(), v("form", {
       class: "reevit-momo-form",
-      onSubmit: X(s, ["prevent"])
+      onSubmit: ue(a, ["prevent"])
     }, [
-      c("div", xe, [
-        a[1] || (a[1] = c("label", {
+      r("div", ot, [
+        l[2] || (l[2] = r("label", {
           class: "reevit-label",
           for: "reevit-phone"
         }, "Phone Number", -1)),
-        oe(c("input", {
+        ye(r("input", {
           id: "reevit-phone",
-          "onUpdate:modelValue": a[0] || (a[0] = (f) => o.value = f),
+          "onUpdate:modelValue": l[0] || (l[0] = (_) => i.value = _),
           type: "tel",
-          class: D(["reevit-input", { "reevit-input--error": d.value && !L(G)(o.value) }]),
+          class: z(["reevit-input", { "reevit-input--error": u.value && !q(le)(i.value) }]),
           placeholder: "e.g. 024 123 4567",
-          disabled: t.loading,
+          disabled: e.loading,
           autocomplete: "tel"
-        }, null, 10, Te), [
-          [ae, o.value]
+        }, null, 10, st), [
+          [be, i.value]
         ])
       ]),
-      c("div", $e, [
-        a[2] || (a[2] = c("label", { class: "reevit-label" }, "Select Network", -1)),
-        c("div", Ne, [
-          (v(), h(q, null, Q(p, (f) => c("button", {
-            key: f.id,
+      r("div", at, [
+        l[3] || (l[3] = r("label", { class: "reevit-label" }, "Select Network", -1)),
+        r("div", it, [
+          (m(), v(Y, null, re(h, (_) => r("button", {
+            key: _.id,
             type: "button",
-            class: D(L(te)("reevit-network-btn", m.value === f.id && "reevit-network-btn--selected")),
-            onClick: (C) => m.value = f.id,
-            disabled: t.loading
+            class: z(q(me)("reevit-network-btn", p.value === _.id && "reevit-network-btn--selected")),
+            onClick: (T) => p.value = _.id,
+            disabled: e.loading
           }, [
-            c("div", {
+            r("div", {
               class: "reevit-network-dot",
-              style: ee({ backgroundColor: f.color })
+              style: Z({ backgroundColor: _.color })
             }, null, 4),
-            Z(" " + I(f.name), 1)
-          ], 10, Le)), 64))
+            pe(" " + I(_.name), 1)
+          ], 10, rt)), 64))
         ])
       ]),
-      d.value ? (v(), h("p", Ue, I(d.value), 1)) : E("", !0),
-      c("button", {
-        type: "submit",
-        class: "reevit-submit-btn",
-        disabled: t.loading || !o.value
-      }, [
-        t.loading ? (v(), h("span", De)) : (v(), h("span", Fe, "Continue"))
-      ], 8, Oe),
-      a[3] || (a[3] = c("p", { class: "reevit-secure-text" }, " 🔒 Secure mobile money payment via Reevit ", -1))
+      u.value ? (m(), v("p", lt, I(u.value), 1)) : L("", !0),
+      r("div", dt, [
+        e.hideCancel ? L("", !0) : (m(), v("button", {
+          key: 0,
+          type: "button",
+          class: "reevit-btn reevit-btn--secondary",
+          onClick: l[1] || (l[1] = (_) => d("cancel")),
+          disabled: e.loading
+        }, " Back ", 8, ct)),
+        r("button", {
+          type: "submit",
+          class: "reevit-btn reevit-btn--primary",
+          disabled: e.loading || !i.value
+        }, [
+          e.loading ? (m(), v("span", pt)) : (m(), v("span", mt, "Continue"))
+        ], 8, ut)
+      ]),
+      l[4] || (l[4] = r("p", { class: "reevit-secure-text" }, " 🔒 Secure mobile money payment via Reevit ", -1))
     ], 32));
   }
 });
-class Ke {
-  constructor(n) {
-    this.baseUrl = "https://unified-pay.hubtel.com", this.messageHandler = null, this.stylesInjected = !1, n && (this.baseUrl = n);
+class vt {
+  constructor(t) {
+    this.baseUrl = "https://unified-pay.hubtel.com", this.messageHandler = null, this.stylesInjected = !1, t && (this.baseUrl = t);
   }
   /**
   * Redirects the user to the checkout page with the provided purchase information and configuration.
@@ -336,9 +519,9 @@ class Ke {
   * @param config - The configuration.
   * @throws {Error} If the popup is blocked by the browser.
   */
-  redirect({ purchaseInfo: n, config: e }) {
-    const i = this.createCheckoutUrl(n, e), o = window.open(i);
-    if (!o || o.closed || typeof o.closed > "u")
+  redirect({ purchaseInfo: t, config: n }) {
+    const d = this.createCheckoutUrl(t, n), i = window.open(d);
+    if (!i || i.closed || typeof i.closed > "u")
       throw new Error("Popup was blocked by the browser. Please allow popups for this site.");
   }
   /**
@@ -350,30 +533,30 @@ class Ke {
   * @param iframeStyle - The style options for the iframe (optional).
   * @throws {Error} If the container element with id "hubtel-checkout-iframe" is not found.
   */
-  initIframe({ purchaseInfo: n, callBacks: e, config: i, iframeStyle: o }) {
-    var m, d, s;
-    this.registerEvents(e);
-    const p = document.getElementById("hubtel-checkout-iframe");
-    if (!p)
+  initIframe({ purchaseInfo: t, callBacks: n, config: d, iframeStyle: i }) {
+    var p, u, a;
+    this.registerEvents(n);
+    const h = document.getElementById("hubtel-checkout-iframe");
+    if (!h)
       throw new Error('Container element with id "hubtel-checkout-iframe" not found in the DOM.');
-    p.innerHTML = "";
-    const u = document.createElement("div");
-    u.textContent = "Loading...", p.appendChild(u);
-    const a = document.createElement("iframe");
-    a.setAttribute("id", "hubtel-iframe-element"), a.src = this.createCheckoutUrl(n, i), a.style.display = "none", a.style.width = (m = o?.width) !== null && m !== void 0 ? m : "100%", a.style.height = (d = o?.height) !== null && d !== void 0 ? d : "100%", a.style.minHeight = o?.minHeight || "400px", a.style.border = (s = o?.border) !== null && s !== void 0 ? s : "none", a.onload = () => {
-      var f;
-      p.removeChild(u), a.style.display = "block", (f = e.onLoad) === null || f === void 0 || f.call(e);
-    }, p.appendChild(a);
+    h.innerHTML = "";
+    const o = document.createElement("div");
+    o.textContent = "Loading...", h.appendChild(o);
+    const l = document.createElement("iframe");
+    l.setAttribute("id", "hubtel-iframe-element"), l.src = this.createCheckoutUrl(t, d), l.style.display = "none", l.style.width = (p = i?.width) !== null && p !== void 0 ? p : "100%", l.style.height = (u = i?.height) !== null && u !== void 0 ? u : "100%", l.style.minHeight = i?.minHeight || "400px", l.style.border = (a = i?.border) !== null && a !== void 0 ? a : "none", l.onload = () => {
+      var _;
+      h.removeChild(o), l.style.display = "block", (_ = n.onLoad) === null || _ === void 0 || _.call(n);
+    }, h.appendChild(l);
   }
-  openModal({ purchaseInfo: n, callBacks: e, config: i }) {
-    this.injectStyles(), this.createIframe(), this.handleBackButton(), this.registerEvents(e), this.renderWebpageInPopup(this.createCheckoutUrl(n, i), e.onClose, e.onLoad);
+  openModal({ purchaseInfo: t, callBacks: n, config: d }) {
+    this.injectStyles(), this.createIframe(), this.handleBackButton(), this.registerEvents(n), this.renderWebpageInPopup(this.createCheckoutUrl(t, d), n.onClose, n.onLoad);
   }
-  createCheckoutUrl(n, e) {
-    const i = Object.assign(Object.assign({}, n), e), o = Object.keys(i).reduce((u, a) => (i[a] !== null && i[a] !== void 0 && (u[a] = i[a]), u), {}), m = Object.keys(o).map((u) => `${u}=${encodeURIComponent(o[u])}`).join("&"), d = this.encodeBase64(m), s = encodeURIComponent(d);
-    return `${o?.branding === "disabled" ? `${this.baseUrl}/pay/direct` : `${this.baseUrl}/pay`}?p=${s}`;
+  createCheckoutUrl(t, n) {
+    const d = Object.assign(Object.assign({}, t), n), i = Object.keys(d).reduce((o, l) => (d[l] !== null && d[l] !== void 0 && (o[l] = d[l]), o), {}), p = Object.keys(i).map((o) => `${o}=${encodeURIComponent(i[o])}`).join("&"), u = this.encodeBase64(p), a = encodeURIComponent(u);
+    return `${i?.branding === "disabled" ? `${this.baseUrl}/pay/direct` : `${this.baseUrl}/pay`}?p=${a}`;
   }
-  encodeBase64(n) {
-    return btoa(unescape(encodeURIComponent(n)));
+  encodeBase64(t) {
+    return btoa(unescape(encodeURIComponent(t)));
   }
   handleBackButton() {
     window.addEventListener("popstate", () => {
@@ -381,32 +564,32 @@ class Ke {
     });
   }
   createIframe() {
-    const n = document.createElement("div");
-    n.setAttribute("id", "backdrop"), n.classList.add("backdrop");
-    const e = document.createElement("span");
-    e.classList.add("checkout-loader"), n.appendChild(e), document.body.appendChild(n);
+    const t = document.createElement("div");
+    t.setAttribute("id", "backdrop"), t.classList.add("backdrop");
+    const n = document.createElement("span");
+    n.classList.add("checkout-loader"), t.appendChild(n), document.body.appendChild(t);
   }
-  registerEvents(n) {
+  registerEvents(t) {
     this.messageHandler && window.removeEventListener("message", this.messageHandler, !1);
-    const e = (i) => {
-      var o, m, d, s, p, u;
-      if (i.origin !== this.baseUrl)
+    const n = (d) => {
+      var i, p, u, a, h, o;
+      if (d.origin !== this.baseUrl)
         return;
-      const { data: a } = i;
-      if (a.success === !0)
-        (o = n.onPaymentSuccess) === null || o === void 0 || o.call(n, a);
-      else if (a.success === !1)
-        (m = n.onPaymentFailure) === null || m === void 0 || m.call(n, a);
-      else if (a.initialized)
-        (d = n.init) === null || d === void 0 || d.call(n, a), (s = n.onInit) === null || s === void 0 || s.call(n, a);
-      else if (a.feesChanged)
-        (p = n.onFeesChanged) === null || p === void 0 || p.call(n, a.fees);
-      else if (a.resize) {
-        const f = document.getElementById("hubtel-iframe-element");
-        f && (f.style.height = a.height + "px"), (u = n?.onResize) === null || u === void 0 || u.call(n, a);
+      const { data: l } = d;
+      if (l.success === !0)
+        (i = t.onPaymentSuccess) === null || i === void 0 || i.call(t, l);
+      else if (l.success === !1)
+        (p = t.onPaymentFailure) === null || p === void 0 || p.call(t, l);
+      else if (l.initialized)
+        (u = t.init) === null || u === void 0 || u.call(t, l), (a = t.onInit) === null || a === void 0 || a.call(t, l);
+      else if (l.feesChanged)
+        (h = t.onFeesChanged) === null || h === void 0 || h.call(t, l.fees);
+      else if (l.resize) {
+        const _ = document.getElementById("hubtel-iframe-element");
+        _ && (_.style.height = l.height + "px"), (o = t?.onResize) === null || o === void 0 || o.call(t, l);
       }
     };
-    this.messageHandler = e, window.addEventListener("message", e, !1);
+    this.messageHandler = n, window.addEventListener("message", n, !1);
   }
   /**
    * Removes the message event listener to prevent memory leaks.
@@ -415,27 +598,27 @@ class Ke {
   destroy() {
     this.messageHandler && (window.removeEventListener("message", this.messageHandler, !1), this.messageHandler = null);
   }
-  renderWebpageInPopup(n, e, i) {
-    const o = document.createElement("div");
-    o.classList.add("checkout-modal");
-    const m = document.createElement("div");
-    m.setAttribute("id", "checkout-close-icon"), m.innerHTML = "×", m.classList.add("close-icon"), m.addEventListener("click", () => {
-      this.closePopUp(), e?.();
-    }), o.appendChild(m);
-    const d = document.createElement("iframe");
-    d.src = n, history.pushState({ modalOpen: !0 }, ""), d.classList.add("iframe"), o.appendChild(d), document.body.appendChild(o), o.style.opacity = "0", d.addEventListener("load", () => {
-      o.style.opacity = "1", i?.();
+  renderWebpageInPopup(t, n, d) {
+    const i = document.createElement("div");
+    i.classList.add("checkout-modal");
+    const p = document.createElement("div");
+    p.setAttribute("id", "checkout-close-icon"), p.innerHTML = "×", p.classList.add("close-icon"), p.addEventListener("click", () => {
+      this.closePopUp(), n?.();
+    }), i.appendChild(p);
+    const u = document.createElement("iframe");
+    u.src = t, history.pushState({ modalOpen: !0 }, ""), u.classList.add("iframe"), i.appendChild(u), document.body.appendChild(i), i.style.opacity = "0", u.addEventListener("load", () => {
+      i.style.opacity = "1", d?.();
     });
   }
   closePopUp() {
-    const n = document.querySelector(".backdrop"), e = document.querySelector(".checkout-modal");
-    n && document.body.removeChild(n), e && document.body.removeChild(e), history.replaceState(null, ""), window.removeEventListener("popstate", this.closePopUp);
+    const t = document.querySelector(".backdrop"), n = document.querySelector(".checkout-modal");
+    t && document.body.removeChild(t), n && document.body.removeChild(n), history.replaceState(null, ""), window.removeEventListener("popstate", this.closePopUp);
   }
   injectStyles() {
     if (this.stylesInjected)
       return;
-    const n = document.createElement("style");
-    n.type = "text/css", n.setAttribute("data-hubtel-checkout", "true"), n.innerHTML = `
+    const t = document.createElement("style");
+    t.type = "text/css", t.setAttribute("data-hubtel-checkout", "true"), t.innerHTML = `
         .backdrop {
             position: fixed;
             left: 0;
@@ -535,186 +718,197 @@ class Ke {
 
         }
       }
-    `, document.head.appendChild(n), this.stylesInjected = !0;
+    `, document.head.appendChild(t), this.stylesInjected = !0;
   }
 }
-const J = /* @__PURE__ */ new Map();
-function F(t, n) {
-  const e = J.get(n);
-  if (e) return e;
-  const i = new Promise((o, m) => {
-    if (document.getElementById(n)) {
-      o();
+const ce = /* @__PURE__ */ new Map();
+function te(e, t) {
+  const n = ce.get(t);
+  if (n) return n;
+  const d = new Promise((i, p) => {
+    if (document.getElementById(t)) {
+      i();
       return;
     }
-    const d = document.createElement("script");
-    d.id = n, d.src = t, d.async = !0, d.onload = () => o(), d.onerror = () => m(new Error(`Failed to load ${n} script`)), document.head.appendChild(d);
+    const u = document.createElement("script");
+    u.id = t, u.src = e, u.async = !0, u.onload = () => i(), u.onerror = () => p(new Error(`Failed to load ${t} script`)), document.head.appendChild(u);
   });
-  return J.set(n, i), i;
+  return ce.set(t, d), d;
 }
-function je() {
-  return F("https://js.paystack.co/v1/inline.js", "paystack-script");
+function ht() {
+  return te("https://js.paystack.co/v1/inline.js", "paystack-script");
 }
-function dt() {
+function Gt() {
   return Promise.resolve();
 }
-function ze() {
-  return F("https://checkout.flutterwave.com/v3.js", "flutterwave-script");
+function yt() {
+  return te("https://checkout.flutterwave.com/v3.js", "flutterwave-script");
 }
-function He() {
-  return F("https://js.stripe.com/v3/", "stripe-script");
+function bt() {
+  return te("https://js.stripe.com/v3/", "stripe-script");
 }
-function Ve() {
-  return F("https://sdk.monnify.com/plugin/monnify.js", "monnify-script");
+function ft() {
+  return te("https://sdk.monnify.com/plugin/monnify.js", "monnify-script");
 }
-async function qe(t) {
-  if (await je(), !window.PaystackPop)
+async function _t(e) {
+  if (await ht(), !window.PaystackPop)
     throw new Error("Paystack script not loaded");
   window.PaystackPop.setup({
-    key: t.key,
-    email: t.email,
-    amount: t.amount,
-    currency: t.currency,
-    ref: t.ref,
-    metadata: t.metadata,
-    callback: t.onSuccess,
-    onClose: t.onClose
+    key: e.key,
+    email: e.email,
+    amount: e.amount,
+    currency: e.currency,
+    ref: e.ref,
+    metadata: e.metadata,
+    callback: e.onSuccess,
+    onClose: e.onClose
   }).openIframe();
 }
-async function Be(t) {
-  const n = new Ke(), e = {
-    amount: t.amount,
-    purchaseDescription: t.purchaseDescription,
-    customerPhoneNumber: t.customerPhone || "",
-    clientReference: `hubtel_${Date.now()}`
-  }, i = {
+async function kt(e) {
+  const t = new vt(), n = e.preferredMethod === "mobile_money" ? "momo" : e.preferredMethod === "card" ? "card" : void 0, d = {
+    amount: e.amount,
+    purchaseDescription: e.purchaseDescription,
+    customerPhoneNumber: e.customerPhone || "",
+    clientReference: `hubtel_${Date.now()}`,
+    ...n ? { paymentMethod: n } : {}
+  }, i = e.hubtelSessionToken || e.basicAuth || "", p = {
     branding: "enabled",
-    callbackUrl: t.callbackUrl || (typeof window < "u" ? window.location.href : ""),
-    merchantAccount: typeof t.clientId == "string" ? parseInt(t.clientId, 10) : t.clientId,
-    basicAuth: t.basicAuth || ""
+    callbackUrl: e.callbackUrl || (typeof window < "u" ? window.location.href : ""),
+    merchantAccount: typeof e.clientId == "string" ? parseInt(e.clientId, 10) : e.clientId,
+    basicAuth: i,
+    ...n ? { paymentMethod: n } : {}
   };
-  n.openModal({
-    purchaseInfo: e,
-    config: i,
+  t.openModal({
+    purchaseInfo: d,
+    config: p,
     callBacks: {
-      onPaymentSuccess: (o) => {
-        t.onSuccess(o), n.closePopUp();
+      onPaymentSuccess: (u) => {
+        e.onSuccess(u), t.closePopUp();
       },
       onPaymentFailure: () => {
-        t.onClose();
+        e.onClose();
       },
       onClose: () => {
-        t.onClose();
+        e.onClose();
       }
     }
   });
 }
-async function Ye(t) {
-  if (await ze(), !window.FlutterwaveCheckout)
+async function wt(e) {
+  if (await yt(), !window.FlutterwaveCheckout)
     throw new Error("Flutterwave script not loaded");
   window.FlutterwaveCheckout({
-    public_key: t.public_key,
-    tx_ref: t.tx_ref,
-    amount: t.amount,
-    currency: t.currency,
-    customer: t.customer,
-    payment_options: t.payment_options,
-    customizations: t.customizations,
-    callback: t.callback,
-    onclose: t.onclose
+    public_key: e.public_key,
+    tx_ref: e.tx_ref,
+    amount: e.amount,
+    currency: e.currency,
+    customer: e.customer,
+    payment_options: e.payment_options,
+    customizations: e.customizations,
+    callback: e.callback,
+    onclose: e.onclose
   });
 }
-async function We(t) {
-  if (await He(), !window.Stripe)
+async function Pt(e) {
+  if (await bt(), !window.Stripe)
     throw new Error("Stripe.js not loaded");
-  return window.Stripe(t);
+  return window.Stripe(e);
 }
-async function ut(t) {
-  const e = await (await We(t.publishableKey)).confirmPayment({
-    elements: t.elements,
-    clientSecret: t.clientSecret,
+async function Jt(e) {
+  const n = await (await Pt(e.publishableKey)).confirmPayment({
+    elements: e.elements,
+    clientSecret: e.clientSecret,
     redirect: "if_required"
   });
-  e.error ? t.onError({ message: e.error.message || "Payment failed" }) : e.paymentIntent && t.onSuccess({
-    paymentIntentId: e.paymentIntent.id,
-    status: e.paymentIntent.status
+  n.error ? e.onError({ message: n.error.message || "Payment failed" }) : n.paymentIntent && e.onSuccess({
+    paymentIntentId: n.paymentIntent.id,
+    status: n.paymentIntent.status
   });
 }
-async function Ge(t) {
-  if (await Ve(), !window.MonnifySDK)
+async function gt(e) {
+  if (await ft(), !window.MonnifySDK)
     throw new Error("Monnify SDK not loaded");
   window.MonnifySDK.initialize({
-    amount: t.amount,
-    currency: t.currency,
-    reference: t.reference,
-    customerName: t.customerName,
-    customerEmail: t.customerEmail,
-    customerMobileNumber: t.customerPhone,
-    apiKey: t.apiKey,
-    contractCode: t.contractCode,
-    paymentDescription: t.paymentDescription || "Payment",
-    isTestMode: t.isTestMode ?? !1,
-    metadata: t.metadata,
-    onComplete: (n) => {
-      n.status === "SUCCESS" ? t.onSuccess({
-        transactionReference: n.transactionReference,
-        paymentReference: n.paymentReference,
-        ...n
-      }) : t.onError?.({ message: n.message || "Payment failed" });
+    amount: e.amount,
+    currency: e.currency,
+    reference: e.reference,
+    customerName: e.customerName,
+    customerEmail: e.customerEmail,
+    customerMobileNumber: e.customerPhone,
+    apiKey: e.apiKey,
+    contractCode: e.contractCode,
+    paymentDescription: e.paymentDescription || "Payment",
+    isTestMode: e.isTestMode ?? !1,
+    metadata: e.metadata,
+    onComplete: (t) => {
+      t.status === "SUCCESS" ? e.onSuccess({
+        transactionReference: t.transactionReference,
+        paymentReference: t.paymentReference,
+        ...t
+      }) : e.onError?.({ message: t.message || "Payment failed" });
     },
-    onClose: t.onClose
+    onClose: e.onClose
   });
 }
-async function Je(t, n) {
-  t.onInitiated();
+async function Ct(e, t) {
+  e.onInitiated();
   try {
-    const e = await fetch(n, {
+    const n = await fetch(t, {
       method: "POST",
       headers: { "Content-Type": "application/json" },
       body: JSON.stringify({
-        phone_number: t.phoneNumber,
-        amount: t.amount,
-        reference: t.reference,
-        description: t.description
+        phone_number: e.phoneNumber,
+        amount: e.amount,
+        reference: e.reference,
+        description: e.description
       })
     });
-    if (!e.ok) {
-      const m = (await e.json().catch(() => ({}))).message || "Failed to initiate M-Pesa payment";
-      return t.onError({ message: m }), { status: "failed", message: m };
+    if (!n.ok) {
+      const p = (await n.json().catch(() => ({}))).message || "Failed to initiate M-Pesa payment";
+      return e.onError({ message: p }), { status: "failed", message: p };
     }
-    const i = await e.json();
+    const d = await n.json();
     return {
       status: "initiated",
       message: "Please check your phone and enter your M-Pesa PIN to complete the payment.",
-      transactionId: i.checkout_request_id || i.transaction_id
+      transactionId: d.checkout_request_id || d.transaction_id
     };
-  } catch (e) {
-    const i = e instanceof Error ? e.message : "Network error";
-    return t.onError({ message: i }), { status: "failed", message: i };
+  } catch (n) {
+    const d = n instanceof Error ? n.message : "Network error";
+    return e.onError({ message: d }), { status: "failed", message: d };
   }
 }
-const Qe = ["disabled"], Xe = {
+const St = ["disabled"], Mt = {
   key: 0,
   class: "reevit-spinner"
-}, Ze = { class: "reevit-modal-body" }, et = {
+}, It = { class: "reevit-modal-header" }, Et = ["src"], Rt = { class: "reevit-modal-body" }, $t = {
   key: 0,
   class: "reevit-loading-state"
-}, tt = {
+}, xt = {
   key: 1,
   class: "reevit-error-state"
-}, nt = {
+}, Lt = {
   key: 2,
   class: "reevit-success-state"
-}, ot = {
+}, Tt = {
+  key: 3,
+  class: "reevit-method-step reevit-animate-slide-up"
+}, Nt = {
+  key: 0,
+  class: "reevit-inline-action reevit-animate-fade-in"
+}, Ut = ["disabled"], Ot = {
   key: 1,
-  class: "reevit-method-form-container"
-}, at = {
-  key: 2,
-  class: "reevit-card-info"
-}, rt = ["disabled"], st = {
+  class: "reevit-inline-action reevit-animate-fade-in"
+}, Ft = { class: "reevit-inline-action__hint" }, At = ["disabled"], Dt = {
+  key: 0,
+  class: "reevit-method-step__actions reevit-animate-slide-up"
+}, Kt = { key: 0 }, jt = {
+  key: 1,
+  class: "reevit-card-info reevit-animate-fade-in"
+}, zt = { class: "reevit-info-text" }, Ht = ["disabled"], Bt = {
   key: 0,
   class: "reevit-spinner"
-}, it = { key: 1 }, mt = /* @__PURE__ */ V({
+}, Vt = { key: 1 }, Wt = /* @__PURE__ */ ee({
   __name: "ReevitCheckout",
   props: {
     publicKey: {},
@@ -722,8 +916,11 @@ const Qe = ["disabled"], Xe = {
     currency: {},
     email: {},
     phone: {},
+    customerName: {},
     reference: {},
     metadata: {},
+    customFields: {},
+    paymentLinkCode: {},
     paymentMethods: {},
     theme: {},
     isOpen: { type: Boolean },
@@ -731,263 +928,389 @@ const Qe = ["disabled"], Xe = {
     initialPaymentIntent: {}
   },
   emits: ["success", "error", "close"],
-  setup(t, { emit: n }) {
-    const e = t, i = n, {
-      status: o,
-      paymentIntent: m,
-      selectedMethod: d,
-      error: s,
-      isLoading: p,
-      isReady: u,
-      initialize: a,
-      selectMethod: f,
-      handlePspSuccess: C,
-      handlePspError: g,
-      close: A
-    } = be({
+  setup(e, { emit: t }) {
+    const n = e, d = t, {
+      status: i,
+      paymentIntent: p,
+      selectedMethod: u,
+      error: a,
+      isLoading: h,
+      isReady: o,
+      initialize: l,
+      selectMethod: _,
+      handlePspSuccess: T,
+      handlePspError: U,
+      close: ne,
+      reset: W
+    } = Ue({
       config: {
-        publicKey: e.publicKey,
-        amount: e.amount,
-        currency: e.currency,
-        email: e.email,
-        phone: e.phone,
-        reference: e.reference,
-        metadata: e.metadata,
-        paymentMethods: e.paymentMethods,
-        initialPaymentIntent: e.initialPaymentIntent
+        publicKey: n.publicKey,
+        amount: n.amount,
+        currency: n.currency,
+        email: n.email,
+        phone: n.phone,
+        customerName: n.customerName,
+        reference: n.reference,
+        metadata: n.metadata,
+        customFields: n.customFields,
+        paymentLinkCode: n.paymentLinkCode,
+        paymentMethods: n.paymentMethods,
+        initialPaymentIntent: n.initialPaymentIntent
       },
-      apiBaseUrl: e.apiBaseUrl,
-      onSuccess: (l) => i("success", l),
-      onError: (l) => i("error", l),
-      onClose: () => i("close")
-    }), S = $(e.isOpen ?? !1);
-    N(() => e.isOpen, (l) => {
-      l !== void 0 && (S.value = l);
+      apiBaseUrl: n.apiBaseUrl,
+      onSuccess: (c) => d("success", c),
+      onError: (c) => d("error", c),
+      onClose: () => d("close")
+    }), O = V(n.isOpen ?? !1), M = V(null), G = {
+      hubtel: "Hubtel",
+      paystack: "Paystack",
+      flutterwave: "Flutterwave",
+      monnify: "Monnify",
+      mpesa: "M-Pesa",
+      stripe: "Stripe"
+    };
+    j(() => n.isOpen, (c) => {
+      c !== void 0 && (O.value = c);
     });
-    const U = () => {
-      S.value = !0, !m.value && o.value === "idle" && a();
+    const Q = () => {
+      O.value = !0, M.value = null, !p.value && i.value === "idle" && l();
     };
-    N([S, m, d], ([l, r, y]) => {
-      l && r && y && y === "card" && R(null);
+    j([O, p, u], ([c, s, k]) => {
+      if (c && s && k) {
+        const y = (M.value || s.recommendedPsp || "paystack").toLowerCase().includes("mpesa");
+        (k === "card" || k === "mobile_money" && (!y || n.phone)) && w(null);
+      }
+    });
+    const J = () => {
+      O.value = !1, ne(), M.value = null;
+    }, F = f(
+      () => n.paymentMethods?.length ? n.paymentMethods : ["card", "mobile_money"]
+    ), A = f(() => {
+      const c = p.value;
+      if (!c) return [];
+      const s = new Set(F.value), k = (c.availableProviders || []).map((y) => {
+        const K = y.provider.toLowerCase().includes("hubtel") ? y.methods.filter((B) => B === "card" || B === "mobile_money") : y.methods;
+        return {
+          ...y,
+          methods: K.filter((B) => s.has(B))
+        };
+      }).filter((y) => y.methods.length > 0);
+      if (k.length > 0)
+        return k;
+      const P = c.recommendedPsp.toLowerCase().includes("hubtel") ? F.value.filter((y) => y === "card" || y === "mobile_money") : F.value;
+      return [
+        {
+          provider: c.recommendedPsp,
+          name: G[c.recommendedPsp] || c.recommendedPsp,
+          methods: P
+        }
+      ];
+    }), S = f(() => {
+      const c = p.value;
+      return M.value || c?.recommendedPsp || "paystack";
+    }), X = f(() => {
+      const c = A.value.find(
+        (s) => s.provider === S.value
+      );
+      return c?.methods.length ? c.methods : F.value;
     });
-    const M = () => {
-      S.value = !1, A();
-    }, K = (l) => {
-      f(l);
-    }, R = async (l) => {
-      const r = m.value;
-      if (!r) return;
-      const y = r.recommendedPsp;
+    j(
+      () => A.value,
+      (c) => {
+        c.length && (M.value && c.some((s) => s.provider === M.value) || (c.length === 1 ? M.value = c[0].provider : M.value = null));
+      },
+      { immediate: !0 }
+    ), j([X, u], ([c, s]) => {
+      !s || c.length === 0 || c.includes(s) || _(c[0]);
+    });
+    const oe = (c) => {
+      if (c === M.value) {
+        M.value = null, W();
+        return;
+      }
+      const s = A.value.find((y) => y.provider === c), k = s?.methods.length ? s.methods : F.value, P = u.value && k.includes(u.value) ? u.value : k[0];
+      M.value = c, W(), l(P, { preferredProvider: c, allowedProviders: [c] });
+    }, b = (c) => {
+      _(c);
+    }, w = async (c) => {
+      const s = p.value;
+      if (!s) return;
+      const k = S.value;
       try {
-        if (y === "paystack")
-          await qe({
-            key: e.publicKey,
-            email: e.email || "",
-            amount: e.amount,
-            currency: e.currency,
-            ref: r.id,
-            onSuccess: (b) => C(b),
+        if (k === "paystack")
+          await _t({
+            key: s.pspPublicKey || n.publicKey || "",
+            email: n.email || "",
+            amount: n.amount,
+            currency: n.currency,
+            ref: s.id,
+            onSuccess: (P) => T(P),
             onClose: () => {
             }
           });
-        else if (y === "hubtel")
-          await Be({
-            clientId: r.pspCredentials?.merchantAccount || e.publicKey,
-            purchaseDescription: `Payment for ${e.amount} ${e.currency}`,
-            amount: e.amount,
-            customerPhone: l?.phone || e.phone,
-            customerEmail: e.email,
-            basicAuth: r.pspCredentials?.basicAuth,
-            onSuccess: (b) => C(b),
+        else if (k === "hubtel") {
+          const P = Ie({ publicKey: n.publicKey, baseUrl: n.apiBaseUrl }), { data: y, error: K } = await P.createHubtelSession(
+            s.id,
+            s.clientSecret
+          );
+          if (K || !y?.basicAuth) {
+            U({
+              code: K?.code || "hubtel_session_error",
+              message: K?.message || "Failed to create Hubtel session"
+            });
+            return;
+          }
+          const B = C.value === "card" || C.value === "mobile_money" ? C.value : void 0;
+          await kt({
+            clientId: y.merchantAccount || s.pspCredentials?.merchantAccount || n.publicKey || "",
+            purchaseDescription: `Payment for ${n.amount} ${n.currency}`,
+            amount: n.amount,
+            customerPhone: c?.phone || n.phone,
+            customerEmail: n.email,
+            basicAuth: y.basicAuth,
+            preferredMethod: B,
+            onSuccess: (he) => T(he),
             onClose: () => {
             }
           });
-        else if (y === "flutterwave")
-          await Ye({
-            public_key: e.publicKey,
-            tx_ref: r.id,
-            amount: e.amount,
-            currency: e.currency,
+        } else if (k === "flutterwave")
+          await wt({
+            public_key: s.pspPublicKey || n.publicKey || "",
+            tx_ref: s.id,
+            amount: n.amount,
+            currency: n.currency,
             customer: {
-              email: e.email || "",
-              phone_number: l?.phone || e.phone
+              email: n.email || "",
+              phone_number: c?.phone || n.phone
             },
-            callback: (b) => C(b),
+            callback: (P) => T(P),
             onclose: () => {
             }
           });
-        else if (y === "monnify")
-          await Ge({
-            apiKey: r.pspPublicKey || e.publicKey,
-            contractCode: e.metadata?.contract_code || e.publicKey,
-            amount: e.amount,
-            currency: e.currency,
-            reference: r.reference || r.id,
-            customerName: e.metadata?.customer_name || e.email || "",
-            customerEmail: e.email || "",
-            customerPhone: l?.phone || e.phone,
-            metadata: e.metadata,
-            onSuccess: (b) => C(b),
+        else if (k === "monnify") {
+          const P = s.pspPublicKey || n.publicKey || "", y = n.metadata?.contract_code || n.publicKey || "";
+          if (!P || !y) {
+            U({
+              code: "MONNIFY_CONFIG_MISSING",
+              message: "Monnify configuration is missing. Please check your API key and contract code."
+            });
+            return;
+          }
+          await gt({
+            apiKey: P,
+            contractCode: y,
+            amount: n.amount,
+            currency: n.currency,
+            reference: s.reference || s.id,
+            customerName: n.metadata?.customer_name || n.email || "",
+            customerEmail: n.email || "",
+            customerPhone: c?.phone || n.phone,
+            metadata: n.metadata,
+            onSuccess: (K) => T(K),
             onClose: () => {
             }
           });
-        else if (y === "mpesa") {
-          const b = `${e.apiBaseUrl || "https://api.reevit.io"}/v1/payments/${r.id}/mpesa`;
-          await Je({
-            phoneNumber: l?.phone || e.phone || "",
-            amount: e.amount,
-            reference: r.reference || r.id,
-            description: `Payment ${r.reference || ""}`,
+        } else if (k === "mpesa") {
+          const P = `${n.apiBaseUrl || "https://api.reevit.io"}/v1/payments/${s.id}/mpesa`;
+          await Ct({
+            phoneNumber: c?.phone || n.phone || "",
+            amount: n.amount,
+            reference: s.reference || s.id,
+            description: `Payment ${s.reference || ""}`,
             onInitiated: () => {
             },
-            onSuccess: (P) => C(P),
-            onError: (P) => g({ code: "MPESA_ERROR", message: P.message })
-          }, b);
-        } else g(y === "stripe" ? {
+            onSuccess: (y) => T(y),
+            onError: (y) => U({ code: "MPESA_ERROR", message: y.message })
+          }, P);
+        } else U(k === "stripe" ? {
           code: "STRIPE_NOT_IMPLEMENTED",
           message: "Stripe integration requires custom Elements setup. Please use the React SDK or implement custom Stripe Elements."
         } : {
           code: "UNSUPPORTED_PSP",
-          message: `Payment provider "${y}" is not supported in this checkout.`
+          message: `Payment provider "${k}" is not supported in this checkout.`
         });
-      } catch (b) {
-        g({
+      } catch (P) {
+        U({
           code: "BRIDGE_ERROR",
-          message: b instanceof Error ? b.message : "Failed to open payment gateway"
+          message: P instanceof Error ? P.message : "Failed to open payment gateway"
         });
       }
-    }, j = w(() => ve(e.theme || {}));
-    N(S, (l) => {
-      l ? document.body.style.overflow = "hidden" : document.body.style.overflow = "";
-    }), re(() => {
+    }, g = f(() => ({
+      ...p.value?.branding || {},
+      ...n.theme || {}
+    })), E = f(() => Ee(g.value)), $ = f(() => g.value?.darkMode);
+    j(O, (c) => {
+      c ? document.body.style.overflow = "hidden" : document.body.style.overflow = "";
+    }), fe(() => {
       document.body.style.overflow = "";
     });
-    const k = w(() => o.value), O = w(() => s.value), x = w(() => d.value), T = w(() => p.value), z = w(() => u.value);
-    return (l, r) => (v(), h("div", {
+    const R = f(() => i.value), D = f(() => a.value), C = f(() => u.value), H = f(() => h.value), x = f(() => o.value);
+    return (c, s) => (m(), v("div", {
       class: "reevit-sdk-container",
-      style: ee(j.value)
+      style: Z(E.value)
     }, [
-      Y(l.$slots, "default", {
-        open: U,
-        isLoading: T.value
+      ae(c.$slots, "default", {
+        open: Q,
+        isLoading: H.value
       }, () => [
-        c("button", {
+        r("button", {
           type: "button",
           class: "reevit-pay-button",
-          onClick: U,
-          disabled: T.value
+          onClick: Q,
+          disabled: H.value
         }, [
-          T.value ? (v(), h("span", Xe)) : Y(l.$slots, "button-text", { key: 1 }, () => [
-            r[1] || (r[1] = Z("Pay Now", -1))
+          H.value ? (m(), v("span", Mt)) : ae(c.$slots, "button-text", { key: 1 }, () => [
+            s[5] || (s[5] = pe("Pay Now", -1))
           ])
-        ], 8, Qe)
+        ], 8, St)
       ]),
-      (v(), W(se, { to: "body" }, [
-        S.value ? (v(), h("div", {
+      (m(), se(_e, { to: "body" }, [
+        O.value ? (m(), v("div", {
           key: 0,
           class: "reevit-modal-overlay",
-          onClick: X(M, ["self"])
+          onClick: ue(J, ["self"])
         }, [
-          c("div", {
-            class: D(["reevit-modal-content", { "reevit-modal--dark": e.theme?.darkMode }])
+          r("div", {
+            class: z(["reevit-modal-content", { "reevit-modal--dark": $.value }]),
+            style: Z(E.value)
           }, [
-            c("button", {
+            r("button", {
               class: "reevit-modal-close",
-              onClick: M,
+              onClick: J,
               "aria-label": "Close"
             }, " × "),
-            r[9] || (r[9] = c("div", { class: "reevit-modal-header" }, [
-              c("img", {
-                src: "https://i.imgur.com/bzUR5Lm.png",
-                alt: "Reevit",
+            r("div", It, [
+              r("img", {
+                src: g.value.logoUrl || "https://i.imgur.com/bzUR5Lm.png",
+                alt: "Checkout",
                 class: "reevit-modal__logo"
-              })
-            ], -1)),
-            c("div", Ze, [
-              k.value === "loading" ? (v(), h("div", et, [...r[2] || (r[2] = [
-                c("div", { class: "reevit-spinner reevit-spinner--large" }, null, -1),
-                c("p", null, "Initializing payment...", -1)
-              ])])) : k.value === "failed" && O.value ? (v(), h("div", tt, [
-                r[3] || (r[3] = c("div", { class: "reevit-error-icon" }, "⚠️", -1)),
-                r[4] || (r[4] = c("h3", null, "Payment Failed", -1)),
-                c("p", null, I(O.value.message), 1),
-                c("button", {
+              }, null, 8, Et)
+            ]),
+            r("div", Rt, [
+              R.value === "loading" ? (m(), v("div", $t, [...s[6] || (s[6] = [
+                r("div", { class: "reevit-spinner reevit-spinner--large" }, null, -1),
+                r("p", null, "Initializing payment...", -1)
+              ])])) : R.value === "failed" && D.value ? (m(), v("div", xt, [
+                s[7] || (s[7] = r("div", { class: "reevit-error-icon" }, "⚠️", -1)),
+                s[8] || (s[8] = r("h3", null, "Payment Failed", -1)),
+                r("p", null, I(D.value.message), 1),
+                r("button", {
                   class: "reevit-retry-btn",
-                  onClick: r[0] || (r[0] = (y) => L(a)())
+                  onClick: s[0] || (s[0] = (k) => q(l)())
                 }, "Retry")
-              ])) : k.value === "success" ? (v(), h("div", nt, [
-                r[5] || (r[5] = c("div", { class: "reevit-success-icon" }, "✅", -1)),
-                r[6] || (r[6] = c("h3", null, "Payment Successful", -1)),
-                r[7] || (r[7] = c("p", null, "Thank you for your payment.", -1)),
-                c("button", {
+              ])) : R.value === "success" ? (m(), v("div", Lt, [
+                s[9] || (s[9] = r("div", { class: "reevit-success-icon" }, "✅", -1)),
+                s[10] || (s[10] = r("h3", null, "Payment Successful", -1)),
+                s[11] || (s[11] = r("p", null, "Thank you for your payment.", -1)),
+                r("button", {
                   class: "reevit-done-btn",
-                  onClick: M
+                  onClick: J
                 }, "Done")
-              ])) : z.value ? (v(), h(q, { key: 3 }, [
-                k.value === "ready" || k.value === "method_selected" || k.value === "processing" ? (v(), W(Re, {
+              ])) : x.value ? (m(), v("div", Tt, [
+                A.value.length > 1 ? (m(), se(nt, {
                   key: 0,
-                  methods: e.paymentMethods || ["card", "mobile_money"],
-                  selected: x.value,
-                  amount: e.amount,
-                  currency: e.currency,
-                  provider: l.psp,
-                  onSelect: K
-                }, null, 8, ["methods", "selected", "amount", "currency", "provider"])) : E("", !0),
-                (k.value === "method_selected" || k.value === "processing") && x.value === "mobile_money" ? (v(), h("div", ot, [
-                  ie(Ae, {
-                    "initial-phone": e.phone,
-                    loading: k.value === "processing",
-                    onSubmit: R
-                  }, null, 8, ["initial-phone", "loading"])
-                ])) : E("", !0),
-                (k.value === "method_selected" || k.value === "processing") && x.value === "card" ? (v(), h("div", at, [
-                  r[8] || (r[8] = c("p", { class: "reevit-info-text" }, "You will be redirected to our secure payment partner to complete your card payment.", -1)),
-                  c("button", {
-                    class: "reevit-submit-btn",
-                    onClick: R,
-                    disabled: k.value === "processing"
-                  }, [
-                    k.value === "processing" ? (v(), h("span", st)) : (v(), h("span", it, "Proceed to Card Payment"))
-                  ], 8, rt)
-                ])) : E("", !0)
-              ], 64)) : E("", !0)
+                  providers: A.value,
+                  "selected-provider": M.value,
+                  disabled: H.value,
+                  theme: g.value,
+                  "selected-method": C.value,
+                  onSelect: oe,
+                  onMethodSelect: b
+                }, {
+                  "method-content": ke(() => [
+                    C.value === "card" ? (m(), v("div", Nt, [
+                      s[12] || (s[12] = r("p", { class: "reevit-inline-action__hint" }, " You'll be redirected to complete your card payment securely. ", -1)),
+                      r("button", {
+                        class: "reevit-btn reevit-btn--primary",
+                        onClick: s[1] || (s[1] = (k) => w(null)),
+                        disabled: R.value === "processing"
+                      }, " Pay with Card ", 8, Ut)
+                    ])) : C.value === "mobile_money" ? (m(), v("div", Ot, [
+                      S.value.includes("mpesa") && !n.phone ? (m(), se(de, {
+                        key: 0,
+                        "initial-phone": n.phone,
+                        loading: R.value === "processing",
+                        "hide-cancel": "",
+                        onSubmit: w
+                      }, null, 8, ["initial-phone", "loading"])) : (m(), v(Y, { key: 1 }, [
+                        r("p", Ft, I(S.value.includes("hubtel") ? "Opens the Hubtel checkout with Mobile Money selected." : `Continue to pay securely with Mobile Money via ${G[S.value] || S.value}.`), 1),
+                        r("button", {
+                          class: "reevit-btn reevit-btn--primary",
+                          onClick: s[2] || (s[2] = (k) => w(null)),
+                          disabled: R.value === "processing"
+                        }, I(S.value.includes("hubtel") ? "Continue with Hubtel" : "Pay with Mobile Money"), 9, At)
+                      ], 64))
+                    ])) : L("", !0)
+                  ]),
+                  _: 1
+                }, 8, ["providers", "selected-provider", "disabled", "theme", "selected-method"])) : (m(), v(Y, { key: 1 }, [
+                  ie(ve, {
+                    methods: X.value,
+                    selected: C.value,
+                    provider: S.value,
+                    "show-label": !1,
+                    layout: "grid",
+                    onSelect: b
+                  }, null, 8, ["methods", "selected", "provider"]),
+                  C.value ? (m(), v("div", Dt, [
+                    C.value === "mobile_money" && S.value.includes("mpesa") && !n.phone ? (m(), v("div", Kt, [
+                      ie(de, {
+                        "initial-phone": n.phone,
+                        loading: R.value === "processing",
+                        onSubmit: w,
+                        onCancel: s[3] || (s[3] = (k) => q(_)(null))
+                      }, null, 8, ["initial-phone", "loading"])
+                    ])) : (m(), v("div", jt, [
+                      r("p", zt, I(C.value === "card" ? "You will be redirected to complete your card payment securely." : S.value.includes("hubtel") ? "Opens the Hubtel checkout with Mobile Money selected." : `Continue to pay securely via ${G[S.value] || S.value}.`), 1),
+                      r("button", {
+                        class: "reevit-submit-btn",
+                        onClick: s[4] || (s[4] = (k) => w(null)),
+                        disabled: R.value === "processing"
+                      }, [
+                        R.value === "processing" ? (m(), v("span", Bt)) : (m(), v("span", Vt, I(C.value === "card" ? "Pay with Card" : S.value.includes("hubtel") ? "Continue with Hubtel" : "Pay with Mobile Money"), 1))
+                      ], 8, Ht)
+                    ]))
+                  ])) : L("", !0)
+                ], 64))
+              ])) : L("", !0)
             ]),
-            r[10] || (r[10] = c("div", { class: "reevit-modal-footer" }, [
-              c("div", { class: "reevit-trust-badges" }, [
-                c("span", null, "PCI DSS Compliant"),
-                c("span", null, "•"),
-                c("span", null, "SSL Secure")
+            s[13] || (s[13] = r("div", { class: "reevit-modal-footer" }, [
+              r("div", { class: "reevit-trust-badges" }, [
+                r("span", null, "PCI DSS Compliant"),
+                r("span", null, "•"),
+                r("span", null, "SSL Secure")
               ])
             ], -1))
-          ], 2)
-        ])) : E("", !0)
+          ], 6)
+        ])) : L("", !0)
       ]))
     ], 4));
   }
 });
 export {
-  Ae as MobileMoneyForm,
-  Re as PaymentMethodSelector,
-  vt as ReevitAPIClient,
-  mt as ReevitCheckout,
-  ht as cn,
-  ut as confirmStripePayment,
-  ft as createReevitClient,
-  We as createStripeInstance,
-  bt as detectCountryFromCurrency,
-  wt as detectNetwork,
-  kt as formatAmount,
-  Pt as formatPhone,
-  Je as initiateMPesaSTKPush,
-  ze as loadFlutterwaveScript,
-  dt as loadHubtelScript,
-  Ve as loadMonnifyScript,
-  je as loadPaystackScript,
-  He as loadStripeScript,
-  Ye as openFlutterwaveModal,
-  Be as openHubtelPopup,
-  Ge as openMonnifyModal,
-  qe as openPaystackPopup,
-  be as useReevit,
-  Ct as validatePhone
+  de as MobileMoneyForm,
+  ve as PaymentMethodSelector,
+  nt as ProviderSelector,
+  Zt as ReevitAPIClient,
+  Wt as ReevitCheckout,
+  en as cn,
+  Jt as confirmStripePayment,
+  tn as createReevitClient,
+  Pt as createStripeInstance,
+  nn as detectCountryFromCurrency,
+  on as detectNetwork,
+  sn as formatAmount,
+  an as formatPhone,
+  Ct as initiateMPesaSTKPush,
+  yt as loadFlutterwaveScript,
+  Gt as loadHubtelScript,
+  ft as loadMonnifyScript,
+  ht as loadPaystackScript,
+  bt as loadStripeScript,
+  wt as openFlutterwaveModal,
+  kt as openHubtelPopup,
+  gt as openMonnifyModal,
+  _t as openPaystackPopup,
+  Ue as useReevit,
+  rn as validatePhone
 };