@dokowallet/pay

"Pay with DOKO" embed SDK — drop a DOKO checkout button on any merchant site. Zero runtime dependencies, inline styles only (no CSS file to load).

merchant server ──(dpk_ secret key)──▶ POST /api/v1/checkout/intent ──▶ intentId
merchant page  ──(intentId, public)──▶ @dokowallet/pay button ──▶ hosted checkout

The browser only ever sees an intentId. Never put your dpk_ secret key in client-side code — create intents server-side and hand the resulting id to the SDK.

CDN (any site, no build step)

<div id="doko-pay"></div>

<script src="https://cdn.jsdelivr.net/npm/@dokowallet/[email protected]/dist/doko-pay.js"></script>
<script>
  DokoPay.renderButton('doko-pay', {
    intentId: 'INTENT_ID_FROM_YOUR_SERVER',
    mode: 'popup', // or 'redirect' (default)
    onSuccess: function (e) { window.location.href = '/thanks?ref=' + e.intentId; },
    onCancel:  function ()  { /* user closed checkout */ },
    onError:   function (err) { console.error(err); },
  });
</script>

NPM (ESM)

npm install @dokowallet/pay

import { renderButton, openCheckout, pollIntentStatus } from '@dokowallet/pay';

const button = renderButton('doko-pay', {
  intentId,
  label: 'Pay with DOKO',
  mode: 'popup',
  onSuccess: (e) => showReceipt(e.intentId),
});

// Swap the intent later (e.g. cart total changed → new intent from your server):
button.setIntentId(newIntentId);
// Tear down:
button.remove();

React

import { DokoPayButton } from '@dokowallet/pay/react';

<DokoPayButton
  intentId={intentId}
  mode="popup"
  onSuccess={(e) => navigate(`/thanks?ref=${e.intentId}`)}
  onCancel={() => {}}
  onError={(err) => toast.error(err.message)}
/>

React is an optional peer dependency — it is never bundled into dist/doko-pay.js and only resolves when you import @dokowallet/pay/react.

API

renderButton(target, options) → { setIntentId, remove }

Renders the Vault-styled button into target (element id or element). Options: intentId, label (default 'Pay with DOKO'), mode ('redirect' | 'popup'), checkoutBase, onSuccess, onCancel, onError.

openCheckout(intentId, options) → { close } | undefined

Opens hosted checkout directly (the button calls this for you). mode: 'redirect' navigates to https://pay.dokowallet.com/<intentId>; completion then follows the intent's successUrl/cancelUrl. mode: 'popup' overlays a 420x640 iframe (?embed=1, allow="payment") and resolves via postMessage events DOKO_PAY_SUCCESS / DOKO_PAY_CANCEL / DOKO_PAY_ERROR (origin-checked against checkoutBase).

getIntentStatus(intentId, { apiBase }) → Promise<intent>

GET /api/v1/checkout/intent/:id, unwraps the backend's .data envelope.

pollIntentStatus(intentId, { onStatus, interval, timeout, apiBase }) → { stop }

Polls every interval ms (default 2000) until a terminal status (COMPLETED / CANCELLED / EXPIRED / FAILED), timeout ms elapse (default 900000 = 15 min → emits 'TIMEOUT'), or you call stop(). Use this as the server-of-record check after a popup success event.

Configuration

Defaults target production (backend.dokowallet.com / pay.dokowallet.com). Override per call via apiBase / checkoutBase options, or via SDK_API_BASE / SDK_CHECKOUT_BASE env vars in Node/SSR — see .env.example.

Development

npm run build   # esbuild → dist/doko-pay.js (IIFE, window.DokoPay)
npm run dev     # watch mode
npm test        # node --test (no test framework deps)

MIT