React SDK

Embed forms in React and Next.js with SSR-safe components over the embed script.

tsx

import { FormFlowEmbed, FormFlowPopupButton, useFormFlow } from "@/sdk/react";

<FormFlowEmbed slug="contact" baseUrl="https://YOUR_HOST" onSubmit={(r) => track(r.submissionId)} />

<FormFlowEmbed slug="demo" prefill={{ email: user.email }} hidden={{ plan: "pro" }} />

<FormFlowPopupButton slug="feedback" mode="slider" autoClose={2500}>Give feedback</FormFlowPopupButton>

const { open, ready } = useFormFlow();
<button disabled={!ready} onClick={() => open("pricing-help", { mode: "popup" })}>Talk to sales</button>

Props

mode: inline, popup, modal, drawer, slider, fullscreen, floating, popover. Also prefill, hidden, launcher, trigger, autoClose, prefillFromUrl, prefillFromDataLayer, transitiveSearchParams and the callbacks onReady, onSubmit, onProgress, onError, onClose. See the Embed SDK page for their behavior.

SSR

Components render an empty container on the server and load embed.js once after hydration; callbacks can change on every render without rebuilding the widget.