@lomi/embed

Lomi Embedded Checkout SDK - Add a complete checkout experience to your site.

Installation

npm install @anthropic/lomi-embed

Quick Start

Modal Mode (Default)

Opens checkout as a centered overlay modal:

import { loadLomiCheckout } from '@anthropic/lomi-embed';

// When user clicks "Pay"
const checkout = loadLomiCheckout({
  publicKey: 'lomi_pk_...',
  sessionId: 'cs_...',  // From create_checkout_session
});

// Close programmatically if needed:
checkout.unmount();

Inline Mode

Mount checkout inside a specific element:

import { loadLomiCheckout } from '@anthropic/lomi-embed';

loadLomiCheckout({
  publicKey: 'lomi_pk_...',
  sessionId: 'cs_...',
  mode: 'inline',
  elementId: 'my-checkout-container',
});

<div id="my-checkout-container" style="width: 100%; height: 700px;"></div>

Options

| Option | Type | Default | Description | |--------|------|---------|-------------| | publicKey | string | required | Your Lomi publishable key | | sessionId | string | required | Checkout session ID | | mode | 'modal' | 'inline' | 'modal' | Display mode | | elementId | string | - | DOM element ID (inline mode) | | maxWidth | string | '500px' | Modal max width | | modalHeight | string | '85vh' | Modal height |

Server-Side: Create Checkout Session

const { data } = await supabase.rpc('create_checkout_session', {
  p_organization_id: 'your-org-id',
  p_amount: 10000,
  p_currency_code: 'XOF',
  p_customer_email: '[email protected]',
});

const sessionId = data.checkout_session_id;

License

MIT