@bleepay/web2

Vanilla JavaScript/TypeScript SDK for accepting Bleepay payments in any web app — no wallet connection required.

The user pays by entering a 6-digit code from the Bleepay mobile app. The SDK handles the full payment flow: modal UI, voucher reservation, redemption, and polling until the payment is confirmed on-chain.

Installation

npm install @bleepay/web2 @bleepay/core @bleepay/ui

Usage

import { BleepayClient } from '@bleepay/web2';

const bleepayClient = new BleepayClient({
  appName: 'My Store',
  appUrl: 'https://mystore.com',
  appIconUrl: 'https://mystore.com/icon.png',
});

Trigger a payment

Call submit() when the user clicks your "Pay" button. It opens a modal where the user enters their 6-digit Bleepay code, then resolves when the payment is confirmed.

const payBtn = document.getElementById('pay-btn');

payBtn.addEventListener('click', async () => {
  try {
    const result = await bleepayClient.submit({
      merchant: 'My Store',
      amount: '$5.00',
      description: 'Order #1234',
      expectedPayment: {
        network: 'ethereum',
        currency: 'USDT',
        currencyAddress: '0xdAC17F958D2ee523a2206206994597C13D831ec7',
        amount: '5',
        wallet: { address: '0xYourReceivingWalletAddress' },
      },
    });

    console.log('Payment approved!');
    console.log('Voucher ID:', result.voucherId);
    console.log('Payment IDs:', result.paymentIds);
  } catch (error) {
    if (error.message === 'Payment cancelled by user') {
      console.log('User cancelled');
    } else {
      console.error('Payment failed:', error.message);
    }
  }
});

Cancel programmatically

If you need to close the modal and discard the active voucher from your own code:

bleepayClient.cancel();

API

new BleepayClient(config)

| Option | Type | Required | Description | |--------|------|----------|-------------| | appName | string | Yes | Your app name, shown to the payer in the Bleepay mobile app | | appUrl | string | Yes | Your app URL | | appIconUrl | string | Yes | Your app icon URL | | apiBaseUrl | string | No | Override the default Bleepay API base URL |

bleepayClient.submit(request): Promise<BleepayClientmentResult>

Opens the payment modal and returns a promise that resolves when payment is confirmed, or rejects if it fails or is cancelled.

BleepayClientmentRequest

| Field | Type | Required | Description | |-------|------|----------|-------------| | merchant | string | Yes | Merchant name shown in the modal | | amount | string | Yes | Human-readable amount shown in the modal (e.g. '$5.00') | | description | string | No | Payment description shown in the modal | | expectedPayment | object \| null | Yes | On-chain payment details (network, currency, amount, destination wallet) |

BleepayClientmentResult

| Field | Type | Description | |-------|------|-------------| | status | 'approved' | Always 'approved' on resolve | | voucherId | string | The Bleepay voucher ID | | paymentIds | string[] | On-chain payment/transaction IDs from the receipts |

bleepayClient.cancel(): void

Closes the modal and discards the active voucher if one has been reserved.

Payment flow

1. User clicks "Pay" — submit() is called, modal opens.
2. User enters their 6-digit Bleepay code from the mobile app.
3. SDK authenticates with the code, reserves a one-time voucher, and redeems it with the expected payment details.
4. The Bleepay mobile app prompts the user to confirm the transaction.
5. SDK polls until the voucher is resolved (payment confirmed on-chain).
6. submit() resolves with the payment result.