Recur Docs

Integration

Drop-in React components, hooks, and server adapters. Add subscriptions to your app in three steps.

@recur/react and @recur/server are planned packages — currently in development. Use @recur/sdk directly for all functionality. See the SDK Quickstart for working examples.

Integration

Recur will ship three layers so you can integrate at exactly the level of control you want — no Web3 knowledge required.

LayerPackageStatusUse when
Components@recur/reactComing SoonYou want a button or modal that just works
Hooks@recur/reactComing SoonYou want to keep your own UI but skip the wallet/transaction plumbing
Server@recur/serverComing SoonYou want framework-specific webhook middleware
SDK@recur/sdkAvailable nowRaw transaction builders, webhook verification, full control

Available today with @recur/sdk

Releasing soon on npm. The SDK is fully built — the npm release is imminent.

npm install @recur/sdk @solana/web3.js @solana/spl-token

The SDK provides all the building blocks:

  • RecurClient — subscribe, cancel, reapprove, authenticate, plan queries
  • verifyWebhookSignature / parseWebhookPayload — webhook verification
  • signAndSend — transaction helper
  • Typed errors for every failure mode

See the SDK documentation for complete usage.

Planned three-step setup (when @recur/react ships)

1. Install

npm install @recur/react @recur/server

2. Wrap your app

app/layout.tsx
"use client";
import { RecurProvider } from "@recur/react";
 
export default function RootLayout({ children }) {
  return (
    <RecurProvider
      apiBaseUrl={process.env.NEXT_PUBLIC_RECUR_API_URL!}
      cluster="devnet"
    >
      {children}
    </RecurProvider>
  );
}

3. Drop in a button

import { SubscribeButton } from "@recur/react";
 
<SubscribeButton appId="app_xxx" planId="plan_xxx">
  Subscribe — $9.99/month
</SubscribeButton>

Where to next

On this page