flutterwave-next/dist/client.cjs

Flutterwave checkout wrapper for React/Next.js apps

"use client";
"use client";
var __defProp = Object.defineProperty;
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
var __getOwnPropNames = Object.getOwnPropertyNames;
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 __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);

// src/client.js
var client_exports = {};
__export(client_exports, {
  FlutterwaveButton: () => FlutterwaveButton,
  useCheckoutStatus: () => useCheckoutStatus,
  useFlutterwaveCheckout: () => useFlutterwaveCheckout,
  useFlutterwaveScript: () => useFlutterwaveScript
});
module.exports = __toCommonJS(client_exports);

// src/hooks/useFlutterwaveCheckout.js
var import_react = require("react");
var isScriptLoaded = false;
function useFlutterwaveScript() {
  const [loaded, setLoaded] = (0, import_react.useState)(false);
  (0, import_react.useEffect)(() => {
    if (typeof window === "undefined" || isScriptLoaded) {
      setLoaded(true);
      return;
    }
    const script = document.createElement("script");
    script.src = "https://checkout.flutterwave.com/v3.js";
    script.async = true;
    script.onload = () => {
      isScriptLoaded = true;
      setLoaded(true);
    };
    script.onerror = () => console.error("Failed to load Flutterwave script");
    document.body.appendChild(script);
    return () => {
      document.body.removeChild(script);
    };
  }, []);
  return loaded;
}
function useFlutterwaveCheckout(config) {
  const ready = useFlutterwaveScript();
  const initiatePayment = (0, import_react.useCallback)(() => {
    if (!ready || !window.FlutterwaveCheckout) return;
    window.FlutterwaveCheckout(config);
  }, [ready, config]);
  return {
    initiatePayment,
    ready
  };
}

// src/components/FlutterwaveButton.jsx
function FlutterwaveButton({
  public_key,
  tx_ref,
  amount,
  currency = "NGN",
  payment_options = [
    "card",
    "account",
    "banktransfer",
    "mpesa",
    "mobilemoneyghana",
    "mobilemoneyfranco",
    "mobilemoneyuganda",
    "mobilemoneyrwanda",
    "barter",
    "nqr",
    "ussd",
    "credit"
  ].join(", "),
  customer,
  meta,
  customizations,
  callback = (data) => console.log("Flutterwave callback:", data),
  onclose = () => console.log("Flutterwave closed"),
  className = "",
  children = "Pay Now"
}) {
  const loaded = useFlutterwaveScript();
  const handleClick = () => {
    if (!window.FlutterwaveCheckout) return;
    window.FlutterwaveCheckout({
      public_key,
      tx_ref,
      amount,
      currency,
      payment_options: payment_options.join(", "),
      customer,
      meta,
      customizations,
      callback,
      onclose
    });
  };
  return /* @__PURE__ */ React.createElement(
    "button",
    {
      type: "button",
      disabled: !loaded,
      onClick: handleClick,
      className
    },
    loaded ? children : "Loading..."
  );
}

// src/hooks/useCheckoutStatus.js
var import_react2 = require("react");
function useCheckoutStatus() {
  const [status, setStatus] = (0, import_react2.useState)(null);
  const onSuccess = (data) => {
    setStatus({ status: "success", data });
  };
  const onClose = () => {
    setStatus({ status: "closed" });
  };
  return { status, onSuccess, onClose };
}
// Annotate the CommonJS export names for ESM import in node:
0 && (module.exports = {
  FlutterwaveButton,
  useCheckoutStatus,
  useFlutterwaveCheckout,
  useFlutterwaveScript
});