Checkout SDK

Overview

@coinfat/checkout is a drop-in crypto-checkout widget you embed on your own page: inline, as a modal, or behind a button. It renders the full pay experience and drives it through CoinFat's public checkout endpoints. Your secret API key never touches the browser.

How it works

Two actors drive the flow. This is both the mental model and the security model:

Step 1

Your server

Creates the invoice with your secret key and receives a ulid.

Step 2

Your page

Passes the ulid to the widget, which drives the public checkout.

Your server creates an invoice with your secret key via the Create an invoice API and receives an invoice ulid.
Your page passes that ulid to @coinfat/checkout, which renders and drives a branded checkout using only the public, credential-less /api/v1/checkout endpoints.

The ulid is the only capability the browser needs. Never put your store secret key on the page, and never add auth headers to the checkout requests. These endpoints are public by design.

Install

Install from npm for bundler and framework apps, or drop in the script tag for a no-build-step page. It exposes a callable window.Coinfat global.

Framework-agnostic: works with vanilla JS, React, Vue, Svelte, and more, with no peer dependencies.
The widget renders inside a Shadow DOM, so the host page's CSS can't break it and its styles never leak out.
Build outputs, for reference: dist/coinfat.js (ESM), dist/coinfat.umd.cjs (UMD/CJS), dist/coinfat.iife.js (the script global), and dist/index.d.ts (TypeScript types).

The package is MIT-licensed and provenance-signed on npm (current version 1.0.2).

Learn by example: the repo ships runnable examples/inline.html and examples/modal.html. Browse the source on GitHub.

npm install @coinfat/checkout

ESM

import {Coinfat} from "@coinfat/checkout";