Hypery

Add checkout to your AI app

One-click checkout, login included

An unauthenticated visitor clicks buy and @hyperyai/sdk walks them through login, card entry, and payment — popup or redirect — without you building any of it. Purchases and AI-credit top-ups, from one flow.

Start buildingCheckout docs

How it works

Press buy, we handle the rest

Press buy

A visitor clicks buy or add-credits. No account, no card, no problem — one action kicks off the whole chain.

Log in, then charge

If they're signed out, checkout logs them in first — as a popup on desktop or a redirect on mobile — then charges the card on file.

Add a card, then retry

No card yet? The add-card step opens automatically, and the charge retries the moment it's saved. Idempotent, so nothing double-bills.

Two ways to charge

A button, or the hook underneath

Drop in <BuyButton> for marketplace purchases, or call useCheckout yourself for credit top-ups and custom buttons. Both run the same seamless auth and charge flow.

  • BuyButton — one-click marketplace purchases (Stripe Connect)
  • useCheckout — top-ups and custom checkout on your own UI
  • interactionMode: popup on desktop, redirect on mobile — auto by default
  • Idempotent charges that resume after a redirect and retry after add-card
Checkout and payments
buy.tsx
import { BuyButton } from "@hyperyai/sdk"
 
// drop-in "buy with Hypery" — runs login → charge → add-card → retry
<BuyButton
  appId="app_123"
  amountCents={499}
  description="Pro upgrade"
  onSuccess={(r) => toast.success(`paid ${r.paymentIntentId}`)}
  onError={(e) => toast.error(e.message)}
/>

FAQ

Questions

What does the checkout flow actually do?
One action runs the whole chain: press buy → log in if signed out → charge → add a card if there isn't one → retry → done. An unauthenticated visitor can click buy and be walked through all of it without you writing the glue.
Popup or redirect?
Both. interactionMode is 'auto' by default — a popup on desktop so checkout finishes in-page, and a redirect on mobile or when popups are blocked. Redirect mode persists the pending checkout and resumes it automatically when the user returns.
What's the difference between BuyButton and useCheckout?
BuyButton is a drop-in 'Buy with Hypery' button for marketplace purchases (a Stripe Connect charge credited to the seller). useCheckout is the hook underneath — use it on your own button, or for AI-credit top-ups, which BuyButton doesn't cover.
Will a customer ever get double-charged?
No. Purchases carry an idempotency key, so a charge that's resumed after a redirect or retried after adding a card settles exactly once.

Add checkout to your AI app

Let visitors buy in one click

Drop in BuyButton or useCheckout and turn a signed-out visitor into a paid customer — login, card, and charge handled for you. See the full API in the checkout docs.

$npm install @hyperyai/sdk
Start buildingCheckout docs