@wajub/js

JavaScript SDK for Wajub Components.

Install

npm install @wajub/js

Or load from CDN (no bundler):

<script src="https://js.wajub.com"></script>

Quick start

import { loadWajub, mount } from "@wajub/js";

// Returns null on the server (SSR) — mount in the browser only.
const rt = await loadWajub();
if (!rt) return;

rt.wajub.mount("#checkout", {
  sessionId: "YOUR_SESSION_TOKEN",
  onSuccess: (txn) => console.log("paid", txn),
});

// Async helper:
await mount("#checkout", {
  sessionId: "YOUR_SESSION_TOKEN",
  onSuccess: () => (window.location.href = "/thanks"),
});

Create sessionId on your server, then pass it to the client. Never expose secret keys (sk_...) in the browser.

Deferred load

Import without auto-loading the SDK:

import { loadWajub } from "@wajub/js/pure";

const { Wajub } = (await loadWajub())!;
const client = Wajub.session("YOUR_SESSION_TOKEN");

Components

const { Wajub } = (await loadWajub())!;
const client = Wajub.session(sessionId);
const card = client.components().create("card").mount("#card");
await client.confirmPayment({ components: card });

Framework packages

Full documentation on this site — install via npm, integrate using the guides below:

| Package | Guide | |---------|-------| | @wajub/react | React / Next.js | | @wajub/vue | Vue 3 / Nuxt | | @wajub/svelte | Svelte / SvelteKit |

Each package provides WajubProvider, embed components, and helpers — same public API, framework-native syntax.

Documentation

docs.wajub.com/tools/components/js

License

MIT