Integrate RetainRabbit

Three steps to a working save flow:

1. Connect Stripe in Integrations (a restricted key — we never need your full secret).
2. Create a flow in Flows and design its look in the Flow Designer.
3. Drop it in — the quickest way is the drop-in script below. Grab your real workspace + flow ids from Flows → Install.

Every cancellation then runs your flow, personalizes the offer, and records the outcome under Sessions.

The simplest option: point your existing “Cancel” button or link at the hosted flow page. Append ?email= so the AI can tailor the offer and apply discounts to the right customer.

<a href="https://retainrabbit.com/flow/YOUR_WORKSPACE_ID/YOUR_FLOW_ID?email=CUSTOMER_EMAIL">
  Cancel subscription
</a>

Add the script once, then put two attributes on your existing Cancel button. We open the flow in a popup, personalize the offer, and — if the customer still cancels — let your button do exactly what it did before.

<!-- 1. Add once, before </body> -->
<script src="https://retainrabbit.com/embed.js"
        data-workspace="YOUR_WORKSPACE_ID"
        data-flow="YOUR_FLOW_ID"></script>

<!-- 2. On your existing Cancel button -->
<button data-retainrabbit-cancel data-email="CUSTOMER_EMAIL">
  Cancel subscription
</button>

Prefer an in-page modal? Add data-mode="overlay" to the script tag. Cancel wired up in JavaScript? Call RetainRabbit.open({ email, onCancel }) from your handler instead.

For React / Next.js apps. Wrap your app once, then wrap your Cancel button with <CancelGuard> — it intercepts the click, runs the flow, and only lets the real cancel through if the customer declines.

pnpm add @retainrabbit/react

import { RetainRabbitProvider, CancelGuard } from "@retainrabbit/react";

<RetainRabbitProvider origin="https://retainrabbit.com" workspaceId="YOUR_WORKSPACE_ID">
  {/* …your app… */}
</RetainRabbitProvider>

// Around your existing cancel button:
<CancelGuard flowId="YOUR_FLOW_ID" email={currentUser.email}>
  <button>Cancel subscription</button>
</CancelGuard>

The @retainrabbit npm packages publish under that scope — if pnpm addcan't find them yet, they're mid-release.

Framework-agnostic, fully typed, no script tag. Guard a selector and you're done.

pnpm add @retainrabbit/js

import { createRetainRabbit } from "@retainrabbit/js";

const rr = createRetainRabbit({ origin: "https://retainrabbit.com", workspaceId: "YOUR_WORKSPACE_ID" });
rr.guard("#cancel-btn", { flowId: "YOUR_FLOW_ID", email: currentUser.email });

The @retainrabbit npm packages publish under that scope — if pnpm addcan't find them yet, they're mid-release.

For programmatic use and backends. Mint a key in Integrations → API keys and send it as a bearer token. Read keys cover the GET endpoints; read+write also allows POST /sessions.

• GET /flows — list flows
• GET /flows/:id — one flow + steps + hostedUrl
• GET /sessions/:id — poll a session's outcome
• GET /stats — recovery summary (recovered MRR, save rate)
• POST /sessions — start a session (read+write)

curl -H "authorization: Bearer rk_live_…" \
  https://retainrabbit.com/api/v1/stats

Full API reference

Connect RetainRabbit to your AI coding assistant (Claude Desktop, Cursor, Claude Code). It can list flows, read recovery stats, and — with get_install_snippet — write the integration into your codebase for you. Add this to your client's MCP config:

{
  "mcpServers": {
    "retainrabbit": {
      "command": "npx",
      "args": ["-y", "@retainrabbit/mcp"],
      "env": {
        "RETAINRABBIT_API_KEY": "rk_live_…",
        "RETAINRABBIT_BASE_URL": "https://retainrabbit.com/api/v1"
      }
    }
  }
}

The @retainrabbit npm packages publish under that scope — if pnpm addcan't find them yet, they're mid-release.

By default the customer's email is trusted from your front end. To stop anyone passing an arbitrary email to grab a discount, sign the email server-side and turn on Require verified identity in Save policy. Your embed secret lives in Integrations.

import crypto from "crypto";
const verify = crypto
  .createHmac("sha256", process.env.RETAINRABBIT_EMBED_SECRET)
  .update(customerEmail.trim().toLowerCase())
  .digest("hex");
// pass as data-verify={verify} (script) or verify={verify} (SDK)

Key safety: rk_live_ API keys are server-side only — never put one in browser code. The script embed and the JS/React SDKs are keyless by design (they use your workspace id + the optional signed email), so the only place a key belongs is your backend or the MCP server.