@moonpay/platform-sdk-web

Browser SDK for the MoonPay Developer Platform. Connect customers to MoonPay, fetch quotes and payment methods, and render MoonPay frames (widget, Apple Pay, Google Pay, buy, add-card, challenge) as iframes in your web app.

Installation

npm install @moonpay/platform-sdk-web

Quick start

Create a session server-side with @moonpay/platform-sdk-node, pass the session token to the browser, then create a client:

import { createClient } from '@moonpay/platform-sdk-web';

const client = createClient({ sessionToken });

// Check whether the customer already has an active MoonPay connection
const connection = await client.getConnection();
if (!connection.ok) {
  console.error(connection.error);
  return;
}

if (connection.value.status === 'connectionRequired') {
  // Render the connect frame so the customer can sign in to MoonPay
  await client.connect({
    container: document.getElementById('moonpay-container'),
    onEvent: (event) => console.log(event.kind),
  });
}

All client methods return a Result<T, E> discriminated union instead of throwing — check result.ok before using result.value.

Pass an optional theme to render every MoonPay frame in light or dark mode (omit it to follow the customer's system preference). The connect flow can override it per call:

const client = createClient({ sessionToken, theme: { appearance: 'dark' } });

// Override for a single frame:
await client.connect({ container, theme: { appearance: 'light' } });

What the client provides

• Connection — getConnection(), connect(), setupAuth(), resetConnection()
• Payments data — getQuote(), getPaymentMethods(), deletePaymentMethod(), listTransactions(), getTransaction()
• Frames — setupWidget(), setupApplePay(), setupGooglePay(), setupBuy(), setupBuyButton(), setupAddCard(), setupChallenge(), setupCustomerExport()
• Customer — getCustomer(), submitCustomerKyc(), getCustomerUploadUrl(), submitCustomerFiles() for headless integrations
• Identity (deprecated, use Customer above) — createIdentity(), getIdentity(), updateIdentity(), verifyIdentity() and file upload helpers

Related packages

| Package | Use it for | |---------|------------| | @moonpay/platform-sdk-node | Server-side session creation | | @moonpay/platform-sdk-react-native | React Native apps | | @moonpay/platform-protocol | Shared protocol and API types |

Documentation

Full guides and API reference: dev.moonpay.com

• Introduction
• API & SDK credentials
• Connect a customer
• Pay with Widget
• Pay with Apple Pay

License

MIT