Browser SDKs

<script src="https://unpkg.com/@minnha/pay-js@latest/dist/minnha-pay.umd.js"></script>
<button id="pay">Pay</button>
<script>
  document.getElementById("pay").onclick = async () => {
    const { sessionToken } = await fetch("/api/checkout", { method: "POST" }).then(r => r.json());
    const result = await MinnhaPay.open({ sessionToken, mode: "popup", locale: "ar" });
    if (result.status === "success") window.location.href = "/thanks";
  };
</script>

import { MinnhaCheckoutButton } from "@minnha/pay-react";

<MinnhaCheckoutButton
  createSession={async () => (await fetch("/api/checkout", { method: "POST" })).json()}
  checkoutOptions={{ mode: "popup", locale: "ar" }}
  onSuccess={({ transactionId }) => router.push(`/orders/${transactionId}`)}
  className="rounded-xl bg-indigo-600 px-6 py-3 text-white"
>
  Pay 199 SAR
</MinnhaCheckoutButton>

import { useMinnhaCheckout } from "@minnha/pay-react";

const { open, isLoading } = useMinnhaCheckout();
const result = await open({ sessionToken, mode: "popup" });

// app.config.ts
import { provideMinnha } from "@minnha/pay-angular";
export const appConfig = {
  providers: [ provideMinnha({ checkoutBaseUrl: "https://checkout.minnha.pay" }) ],
};

// component
import { MinnhaService } from "@minnha/pay-angular";
constructor(private minnha: MinnhaService) {}
async pay() {
  const { sessionToken } = await fetch("/api/checkout", { method: "POST" }).then(r => r.json());
  const result = await this.minnha.checkout({ sessionToken });
}