@dryinov8/zumbopay-ts 1.0.0

package/dist/react/index.js

@@ -0,0 +1,755 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/react/index.ts
+var react_exports = {};
+__export(react_exports, {
+  ZumboPayModal: () => ZumboPayModal,
+  useZumboPay: () => useZumboPay
+});
+module.exports = __toCommonJS(react_exports);
+
+// src/react/useZumboPay.ts
+var import_react = require("react");
+
+// src/phone.ts
+function normalizePhone(phone) {
+  let cleaned = phone.replace(/\D/g, "");
+  if (cleaned.startsWith("0")) {
+    cleaned = cleaned.slice(1);
+  }
+  if (cleaned.length === 9) {
+    cleaned = "258" + cleaned;
+  }
+  return cleaned;
+}
+function detectOperator(phone) {
+  const normalized = normalizePhone(phone);
+  if (normalized.length !== 12 || !normalized.startsWith("258")) {
+    return "unknown";
+  }
+  const prefix = normalized.slice(3, 5);
+  if (prefix === "84" || prefix === "85") {
+    return "mpesa";
+  }
+  if (prefix === "86" || prefix === "87") {
+    return "emola";
+  }
+  if (prefix === "82" || prefix === "83") {
+    return "mkesh";
+  }
+  return "unknown";
+}
+function getOperatorLabel(operator) {
+  switch (operator) {
+    case "mpesa":
+      return "Vodacom M-Pesa";
+    case "emola":
+      return "Movitel e-Mola";
+    case "mkesh":
+      return "Tmcel mKesh";
+    default:
+      return "Desconhecida";
+  }
+}
+function isValidMozPhone(phone) {
+  return detectOperator(phone) !== "unknown";
+}
+
+// src/client.ts
+var ZumboPayClient = class {
+  config;
+  cachedWallets = null;
+  walletsCacheExpiresAt = 0;
+  constructor(config) {
+    const envWallets = {};
+    let defaultEnabled = true;
+    if (typeof process !== "undefined" && process?.env) {
+      if (process.env.ZUMBOPAY_ENABLED !== void 0) {
+        defaultEnabled = process.env.ZUMBOPAY_ENABLED === "true" || process.env.ZUMBOPAY_ENABLED === "1";
+      }
+      if (process.env.ZUMBOPAY_WALLET_MPESA) {
+        envWallets.mpesa = process.env.ZUMBOPAY_WALLET_MPESA;
+      }
+      if (process.env.ZUMBOPAY_WALLET_EMOLA) {
+        envWallets.emola = process.env.ZUMBOPAY_WALLET_EMOLA;
+      }
+      if (process.env.ZUMBOPAY_WALLET_MKESH) {
+        envWallets.mkesh = process.env.ZUMBOPAY_WALLET_MKESH;
+      }
+      if (process.env.ZUMBOPAY_WALLET_CARD) {
+        envWallets.card = process.env.ZUMBOPAY_WALLET_CARD;
+      }
+    }
+    this.config = {
+      apiKey: config.apiKey,
+      merchantId: config.merchantId,
+      baseUrl: config.baseUrl?.replace(/\/+$/, "") || "https://zumbopay.com/api/public/v1",
+      webhookSecret: config.webhookSecret,
+      wallets: {
+        ...envWallets,
+        ...config.wallets || {}
+      },
+      enabled: config.enabled !== void 0 ? config.enabled : defaultEnabled,
+      timeout: config.timeout || 15e3
+    };
+  }
+  /**
+   * Returns whether the ZumboPay client is currently active.
+   * If false, all mutations (STK push, checkouts) are gracefully silenced.
+   */
+  isEnabled() {
+    return Boolean(this.config.enabled);
+  }
+  /**
+   * Programmatically enable or disable the gateway (kill-switch toggle).
+   */
+  setEnabled(enabled) {
+    this.config.enabled = enabled;
+  }
+  /**
+   * Returns configured base URL.
+   */
+  getBaseUrl() {
+    return this.config.baseUrl;
+  }
+  /**
+   * Resolves a valid Wallet UUID for a given operator or channel.
+   */
+  async resolveWalletId(channel) {
+    if (this.config.wallets[channel]) {
+      return this.config.wallets[channel];
+    }
+    const wallets = await this.listWallets();
+    const match = wallets.find(
+      (w) => w.is_active !== false && (w.method?.toLowerCase() === channel || w.wallet_code?.toLowerCase().includes(channel) || w.name?.toLowerCase().includes(channel))
+    );
+    if (match) {
+      return match.id;
+    }
+    const active = wallets.find((w) => w.is_active !== false);
+    return active?.id;
+  }
+  /**
+   * Resolves the proper wallet ID for a Mozambican phone number.
+   */
+  async resolveWalletIdForPhone(phone) {
+    const operator = detectOperator(phone);
+    if (operator === "unknown") {
+      return void 0;
+    }
+    return this.resolveWalletId(operator);
+  }
+  /**
+   * Initiates a direct STK Push prompt to a mobile phone (M-Pesa, e-Mola, mKesh).
+   */
+  async stkPush(request) {
+    if (!this.isEnabled()) {
+      return {
+        success: false,
+        status: "disabled",
+        reference: null,
+        message: "O gateway de pagamento ZumboPay est\xE1 temporariamente desativado."
+      };
+    }
+    const normalizedPhone = normalizePhone(request.phone);
+    const walletId = request.walletId || await this.resolveWalletIdForPhone(normalizedPhone);
+    const sourceId = request.reference || `stk-${Date.now()}`;
+    const payload = {
+      phone: normalizedPhone,
+      amount: request.amount,
+      wallet_id: walletId,
+      reference: sourceId,
+      customer_name: request.customerName,
+      description: request.description
+    };
+    try {
+      const res = await this.fetchWithTimeout("/charges", {
+        method: "POST",
+        headers: this.getHeaders(),
+        body: JSON.stringify(payload)
+      });
+      const data = await res.json().catch(() => ({}));
+      if (res.ok) {
+        const status = (data.data?.status || data.status || "pending").toLowerCase();
+        const code = data.code || data.data?.code;
+        const isSuccess = status === "success" || status === "succeeded" || status === "completed" || code === "INS-0";
+        return {
+          success: true,
+          status: isSuccess ? "success" : status,
+          reference: data.data?.reference || sourceId,
+          message: isSuccess ? "Pagamento efetuado com sucesso!" : "Pedido de pagamento enviado para o seu telem\xF3vel. Por favor confirme com o seu PIN.",
+          raw: data
+        };
+      }
+      return {
+        success: false,
+        status: "declined",
+        reference: null,
+        message: data.error?.message || data.message || "O pagamento foi recusado ou expirou no telem\xF3vel.",
+        raw: data
+      };
+    } catch (err) {
+      const error = err;
+      if (error.name === "AbortError" || error.message.includes("timeout")) {
+        return {
+          success: true,
+          status: "pending",
+          reference: sourceId,
+          message: "O pedido foi enviado. Por favor verifique o telem\xF3vel e confirme com o PIN.",
+          raw: { timeout: true }
+        };
+      }
+      return {
+        success: false,
+        status: "failed",
+        reference: null,
+        message: error.message || "Falha na comunica\xE7\xE3o com o ZumboPay."
+      };
+    }
+  }
+  /**
+   * Creates a Hosted Checkout URL for credit/debit card & multicanal payments.
+   */
+  async createCheckout(request) {
+    if (!this.isEnabled()) {
+      return {
+        success: false,
+        checkoutUrl: null,
+        reference: null,
+        message: "O gateway de pagamento ZumboPay est\xE1 temporariamente desativado."
+      };
+    }
+    const walletId = request.walletId || await this.resolveWalletId("card") || await this.resolveWalletId("mpesa");
+    const sourceId = request.reference || `chk-${Date.now()}`;
+    const payload = {
+      title: request.title,
+      amount: request.amount,
+      currency: request.currency || "MZN",
+      channels: request.channels || ["card", "mpesa", "emola", "mkesh"],
+      wallet_id: walletId,
+      reference: sourceId,
+      return_url: request.returnUrl,
+      redirect_url: request.returnUrl,
+      cancel_url: request.cancelUrl,
+      metadata: request.metadata
+    };
+    try {
+      const res = await this.fetchWithTimeout("/checkouts", {
+        method: "POST",
+        headers: this.getHeaders(),
+        body: JSON.stringify(payload)
+      });
+      const data = await res.json().catch(() => ({}));
+      if (res.ok) {
+        const checkoutUrl = data.data?.checkout_url || data.checkout_url || data.data?.url || data.url || null;
+        return {
+          success: true,
+          checkoutUrl,
+          reference: data.data?.reference || sourceId,
+          message: "Sess\xE3o de checkout criada com sucesso.",
+          raw: data
+        };
+      }
+      return {
+        success: false,
+        checkoutUrl: null,
+        reference: null,
+        message: data.error?.message || data.message || "N\xE3o foi poss\xEDvel gerar a p\xE1gina de checkout.",
+        raw: data
+      };
+    } catch (err) {
+      const error = err;
+      return {
+        success: false,
+        checkoutUrl: null,
+        reference: null,
+        message: error.message || "Erro de conex\xE3o ao criar checkout."
+      };
+    }
+  }
+  /**
+   * Queries status of an existing charge/checkout transaction.
+   */
+  async getStatus(referenceOrId) {
+    const res = await this.fetchWithTimeout(
+      `/charges/${encodeURIComponent(referenceOrId)}`,
+      {
+        method: "GET",
+        headers: this.getHeaders()
+      }
+    );
+    const data = await res.json().catch(() => ({}));
+    const payload = data.data || data;
+    const status = (payload.status || "pending").toLowerCase();
+    const isPaid = status === "success" || status === "succeeded" || status === "completed" || payload.is_paid === true;
+    return {
+      success: res.ok,
+      status,
+      paid: isPaid,
+      reference: payload.reference || referenceOrId,
+      amount: payload.amount,
+      currency: payload.currency || "MZN",
+      channel: payload.channel,
+      paidAt: payload.paid_at || payload.updated_at || null,
+      raw: data
+    };
+  }
+  /**
+   * Lists all wallets associated with the merchant account (cached for 10 minutes).
+   */
+  async listWallets() {
+    const now = Date.now();
+    if (this.cachedWallets && now < this.walletsCacheExpiresAt) {
+      return this.cachedWallets;
+    }
+    try {
+      const res = await this.fetchWithTimeout("/wallets", {
+        method: "GET",
+        headers: this.getHeaders()
+      });
+      if (res.ok) {
+        const data = await res.json();
+        this.cachedWallets = data.data || data || [];
+        this.walletsCacheExpiresAt = now + 10 * 60 * 1e3;
+        return this.cachedWallets;
+      }
+      return [];
+    } catch {
+      return [];
+    }
+  }
+  getHeaders() {
+    return {
+      Authorization: `Bearer ${this.config.apiKey}`,
+      "X-Merchant-Id": this.config.merchantId,
+      "Content-Type": "application/json",
+      Accept: "application/json"
+    };
+  }
+  async fetchWithTimeout(endpoint, options) {
+    const controller = new AbortController();
+    const timer = setTimeout(() => controller.abort(), this.config.timeout);
+    const url = `${this.config.baseUrl}${endpoint}`;
+    try {
+      return await fetch(url, {
+        ...options,
+        signal: controller.signal
+      });
+    } finally {
+      clearTimeout(timer);
+    }
+  }
+};
+
+// src/react/useZumboPay.ts
+function useZumboPay({
+  config,
+  onSuccess,
+  onError,
+  pollingIntervalMs = 3e3
+}) {
+  const clientRef = (0, import_react.useRef)(new ZumboPayClient(config));
+  (0, import_react.useEffect)(() => {
+    clientRef.current = new ZumboPayClient(config);
+  }, [config]);
+  const [phone, setPhone] = (0, import_react.useState)("");
+  const [operator, setOperator] = (0, import_react.useState)("unknown");
+  const [status, setStatus] = (0, import_react.useState)("pending");
+  const [isLoading, setIsLoading] = (0, import_react.useState)(false);
+  const [reference, setReference] = (0, import_react.useState)(null);
+  const [errorMessage, setErrorMessage] = (0, import_react.useState)(null);
+  const pollingRef = (0, import_react.useRef)(null);
+  const isEnabled = clientRef.current.isEnabled();
+  const stopPolling = (0, import_react.useCallback)(() => {
+    if (pollingRef.current) {
+      clearInterval(pollingRef.current);
+      pollingRef.current = null;
+    }
+  }, []);
+  (0, import_react.useEffect)(() => {
+    return () => stopPolling();
+  }, [stopPolling]);
+  const handlePhoneChange = (0, import_react.useCallback)((newPhone) => {
+    setPhone(newPhone);
+    setOperator(detectOperator(newPhone));
+  }, []);
+  const startPolling = (0, import_react.useCallback)(
+    (targetRef) => {
+      stopPolling();
+      let attempts = 0;
+      const maxAttempts = 40;
+      pollingRef.current = setInterval(async () => {
+        attempts++;
+        if (attempts > maxAttempts) {
+          stopPolling();
+          setStatus("expired");
+          setErrorMessage("O tempo limite para inser\xE7\xE3o do PIN expirou.");
+          return;
+        }
+        try {
+          const res = await clientRef.current.getStatus(targetRef);
+          setStatus(res.status);
+          if (res.paid) {
+            stopPolling();
+            setIsLoading(false);
+            onSuccess?.(res);
+          } else if (res.status === "failed" || res.status === "declined" || res.status === "cancelled") {
+            stopPolling();
+            setIsLoading(false);
+            setErrorMessage("O pagamento foi recusado ou cancelado.");
+            onError?.({ message: "Pagamento recusado." });
+          }
+        } catch {
+        }
+      }, pollingIntervalMs);
+    },
+    [stopPolling, pollingIntervalMs, onSuccess, onError]
+  );
+  const initiateStk = (0, import_react.useCallback)(
+    async (req) => {
+      const targetPhone = req.phone || phone;
+      if (!isEnabled) {
+        const msg = "O gateway ZumboPay est\xE1 temporariamente desativado.";
+        setErrorMessage(msg);
+        setStatus("disabled");
+        onError?.({ message: msg });
+        return false;
+      }
+      if (!isValidMozPhone(targetPhone)) {
+        const msg = "N\xFAmero de telefone mo\xE7ambicano inv\xE1lido.";
+        setErrorMessage(msg);
+        onError?.({ message: msg });
+        return false;
+      }
+      setIsLoading(true);
+      setErrorMessage(null);
+      const res = await clientRef.current.stkPush({
+        ...req,
+        phone: normalizePhone(targetPhone)
+      });
+      if (res.success) {
+        setStatus(res.status);
+        if (res.reference) {
+          setReference(res.reference);
+        }
+        if (res.status === "success") {
+          setIsLoading(false);
+          onSuccess?.({
+            success: true,
+            status: "success",
+            paid: true,
+            reference: res.reference || ""
+          });
+          return true;
+        }
+        if (res.reference) {
+          startPolling(res.reference);
+        }
+        return true;
+      }
+      setIsLoading(false);
+      setStatus(res.status);
+      setErrorMessage(res.message);
+      onError?.({ message: res.message });
+      return false;
+    },
+    [phone, isEnabled, startPolling, onSuccess, onError]
+  );
+  const createCheckout = (0, import_react.useCallback)(
+    async (req) => {
+      if (!isEnabled) {
+        const msg = "O gateway ZumboPay est\xE1 temporariamente desativado.";
+        setErrorMessage(msg);
+        setStatus("disabled");
+        onError?.({ message: msg });
+        return null;
+      }
+      setIsLoading(true);
+      setErrorMessage(null);
+      const res = await clientRef.current.createCheckout(req);
+      setIsLoading(false);
+      if (res.success && res.checkoutUrl) {
+        setReference(res.reference);
+        return res.checkoutUrl;
+      }
+      setErrorMessage(res.message);
+      onError?.({ message: res.message });
+      return null;
+    },
+    [isEnabled, onError]
+  );
+  const reset = (0, import_react.useCallback)(() => {
+    stopPolling();
+    setIsLoading(false);
+    setStatus("pending");
+    setErrorMessage(null);
+    setReference(null);
+  }, [stopPolling]);
+  return {
+    client: clientRef.current,
+    isEnabled,
+    phone,
+    operator,
+    status,
+    isLoading,
+    reference,
+    errorMessage,
+    setPhone: handlePhoneChange,
+    initiateStk,
+    createCheckout,
+    reset,
+    stopPolling
+  };
+}
+
+// src/react/ZumboPayModal.tsx
+var import_react2 = __toESM(require("react"));
+var import_jsx_runtime = require("react/jsx-runtime");
+function ZumboPayModal({
+  isOpen,
+  onClose,
+  config,
+  amount,
+  currency = "MZN",
+  reference,
+  title = "Pagamento Online",
+  customerName,
+  initialPhone = "",
+  onPaymentSuccess,
+  returnUrl,
+  cancelUrl
+}) {
+  const [activeTab, setActiveTab] = (0, import_react2.useState)("mobile");
+  const {
+    isEnabled,
+    phone,
+    operator,
+    status,
+    isLoading,
+    errorMessage,
+    setPhone,
+    initiateStk,
+    createCheckout,
+    reset
+  } = useZumboPay({
+    config,
+    onSuccess: (res) => {
+      onPaymentSuccess?.(res);
+    }
+  });
+  import_react2.default.useEffect(() => {
+    if (initialPhone && !phone) {
+      setPhone(initialPhone);
+    }
+  }, [initialPhone, phone, setPhone]);
+  if (!isOpen) {
+    return null;
+  }
+  const handleMobileSubmit = async (e) => {
+    e.preventDefault();
+    await initiateStk({
+      amount,
+      phone,
+      reference,
+      customerName,
+      description: title
+    });
+  };
+  const handleCardCheckout = async () => {
+    const checkoutUrl = await createCheckout({
+      amount,
+      currency,
+      title,
+      reference,
+      returnUrl,
+      cancelUrl,
+      channels: ["card", "mpesa", "emola", "mkesh"]
+    });
+    if (checkoutUrl) {
+      window.location.href = checkoutUrl;
+    }
+  };
+  const handleClose = () => {
+    reset();
+    onClose();
+  };
+  const formatCurrency = (val) => {
+    return new Intl.NumberFormat("pt-MZ", {
+      style: "currency",
+      currency
+    }).format(val);
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "fixed inset-0 z-50 flex items-center justify-center p-4 bg-black/60 backdrop-blur-xs animate-in fade-in duration-200", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "relative w-full max-w-md overflow-hidden bg-white dark:bg-neutral-900 rounded-2xl shadow-2xl border border-neutral-200 dark:border-neutral-800", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "flex items-center justify-between px-6 py-4 border-b border-neutral-100 dark:border-neutral-800", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h3", { className: "text-base font-bold text-neutral-900 dark:text-white", children: title }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-xs text-neutral-500 dark:text-neutral-400", children: reference ? `Ref: ${reference}` : "ZumboPay Gateway" })
+      ] }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+        "button",
+        {
+          type: "button",
+          onClick: handleClose,
+          className: "p-1 rounded-full text-neutral-400 hover:text-neutral-600 dark:hover:text-neutral-200 hover:bg-neutral-100 dark:hover:bg-neutral-800 transition",
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "sr-only", children: "Fechar" }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { className: "w-5 h-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) })
+          ]
+        }
+      )
+    ] }),
+    !isEnabled && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "p-6 text-center", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "inline-flex items-center justify-center w-12 h-12 mb-3 rounded-full bg-amber-100 text-amber-600 dark:bg-amber-950/50 dark:text-amber-400", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { className: "w-6 h-6", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z" }) }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h4", { className: "text-sm font-bold text-neutral-900 dark:text-white", children: "Pagamentos Temporariamente Indispon\xEDveis" }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "mt-1 text-xs text-neutral-500 dark:text-neutral-400", children: "O servi\xE7o de pagamentos online est\xE1 temporariamente desativado pela administra\xE7\xE3o." }),
+      /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+        "button",
+        {
+          type: "button",
+          onClick: handleClose,
+          className: "mt-5 w-full py-2.5 px-4 text-xs font-semibold rounded-xl bg-neutral-100 dark:bg-neutral-800 hover:bg-neutral-200 text-neutral-700 dark:text-neutral-200 transition",
+          children: "Fechar"
+        }
+      )
+    ] }),
+    isEnabled && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "p-6", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "mb-5 p-4 rounded-xl bg-neutral-50 dark:bg-neutral-800/60 border border-neutral-100 dark:border-neutral-800 text-center", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", { className: "text-xs font-medium text-neutral-500 dark:text-neutral-400", children: "Total a Pagar" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "text-2xl font-black text-neutral-900 dark:text-white", children: formatCurrency(amount) })
+      ] }),
+      status === "success" && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "py-6 text-center space-y-3", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "inline-flex items-center justify-center w-14 h-14 rounded-full bg-emerald-100 text-emerald-600 dark:bg-emerald-950/50 dark:text-emerald-400", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("svg", { className: "w-8 h-8", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2.5, d: "M5 13l4 4L19 7" }) }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h4", { className: "text-base font-bold text-emerald-900 dark:text-emerald-300", children: "Pagamento Confirmado!" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-xs text-neutral-500 dark:text-neutral-400", children: "O seu pagamento foi recebido e processado com sucesso." }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+          "button",
+          {
+            type: "button",
+            onClick: handleClose,
+            className: "mt-4 w-full py-2.5 px-4 text-xs font-semibold rounded-xl bg-emerald-600 hover:bg-emerald-700 text-white transition shadow-sm",
+            children: "Concluir"
+          }
+        )
+      ] }),
+      isLoading && status !== "success" && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "py-6 text-center space-y-3", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "inline-flex items-center justify-center w-12 h-12 rounded-full bg-primary/10 text-blue-600 dark:text-blue-400 animate-pulse", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("svg", { className: "w-6 h-6 animate-spin", fill: "none", viewBox: "0 0 24 24", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" })
+        ] }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h4", { className: "text-sm font-bold text-neutral-900 dark:text-white", children: "Confirme no seu telem\xF3vel" }),
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { className: "text-xs text-neutral-500 dark:text-neutral-400 max-w-xs mx-auto", children: [
+          "Envi\xE1mos um pedido para o n\xFAmero ",
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("strong", { className: "font-mono text-neutral-900 dark:text-white", children: phone }),
+          ". Introduza o seu PIN na notifica\xE7\xE3o USSD para confirmar."
+        ] })
+      ] }),
+      !isLoading && status !== "success" && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "grid grid-cols-2 p-1 mb-4 rounded-xl bg-neutral-100 dark:bg-neutral-800 text-xs font-semibold", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "button",
+            {
+              type: "button",
+              onClick: () => setActiveTab("mobile"),
+              className: `py-2 rounded-lg transition ${activeTab === "mobile" ? "bg-white dark:bg-neutral-700 text-neutral-900 dark:text-white shadow-xs" : "text-neutral-500 hover:text-neutral-900 dark:hover:text-white"}`,
+              children: "Carteira M\xF3vel"
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "button",
+            {
+              type: "button",
+              onClick: () => setActiveTab("card"),
+              className: `py-2 rounded-lg transition ${activeTab === "card" ? "bg-white dark:bg-neutral-700 text-neutral-900 dark:text-white shadow-xs" : "text-neutral-500 hover:text-neutral-900 dark:hover:text-white"}`,
+              children: "Cart\xE3o Banc\xE1rio"
+            }
+          )
+        ] }),
+        errorMessage && /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "mb-4 p-3 rounded-xl bg-rose-50 dark:bg-rose-950/40 border border-rose-200 dark:border-rose-900 text-xs text-rose-700 dark:text-rose-300", children: errorMessage }),
+        activeTab === "mobile" && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("form", { onSubmit: handleMobileSubmit, className: "space-y-4", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("label", { className: "block text-xs font-semibold text-neutral-700 dark:text-neutral-300 mb-1", children: "N\xFAmero de Telem\xF3vel" }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "relative", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                "input",
+                {
+                  type: "tel",
+                  required: true,
+                  placeholder: "84 / 85 / 86 / 87 / 82 / 83...",
+                  value: phone,
+                  onChange: (e) => setPhone(e.target.value),
+                  className: "w-full px-3.5 py-2.5 text-sm rounded-xl border border-neutral-300 dark:border-neutral-700 bg-white dark:bg-neutral-800 text-neutral-900 dark:text-white focus:outline-hidden focus:ring-2 focus:ring-blue-500"
+                }
+              ),
+              operator !== "unknown" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+                "span",
+                {
+                  className: `absolute right-2.5 top-2.5 px-2 py-0.5 text-[10px] font-bold rounded-md ${operator === "mpesa" ? "bg-red-100 text-red-700 dark:bg-red-950 dark:text-red-300" : operator === "emola" ? "bg-orange-100 text-orange-700 dark:bg-orange-950 dark:text-orange-300" : "bg-yellow-100 text-yellow-800 dark:bg-yellow-950 dark:text-yellow-300"}`,
+                  children: getOperatorLabel(operator)
+                }
+              )
+            ] }),
+            /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "mt-1.5 text-[11px] text-neutral-400", children: "Compat\xEDvel com M-Pesa (Vodacom), e-Mola (Movitel) e mKesh (Tmcel)." })
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
+            "button",
+            {
+              type: "submit",
+              disabled: isLoading,
+              className: "w-full py-3 px-4 text-xs font-bold rounded-xl bg-blue-600 hover:bg-blue-700 text-white transition shadow-sm",
+              children: [
+                "Pagar ",
+                formatCurrency(amount)
+              ]
+            }
+          )
+        ] }),
+        activeTab === "card" && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { className: "space-y-4 text-center", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "text-xs text-neutral-600 dark:text-neutral-400", children: "Ser\xE1 redirecionado para a p\xE1gina segura do ZumboPay para inserir os dados do seu cart\xE3o Visa ou Mastercard." }),
+          /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+            "button",
+            {
+              type: "button",
+              onClick: handleCardCheckout,
+              disabled: isLoading,
+              className: "w-full py-3 px-4 text-xs font-bold rounded-xl bg-neutral-900 hover:bg-neutral-800 dark:bg-white dark:hover:bg-neutral-100 text-white dark:text-neutral-900 transition shadow-sm",
+              children: "Continuar para Checkout com Cart\xE3o"
+            }
+          )
+        ] })
+      ] })
+    ] })
+  ] }) });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ZumboPayModal,
+  useZumboPay
+});
+//# sourceMappingURL=index.js.map