Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.firstflow.app/llms.txt

Use this file to discover all available pages before exploring further.

import { useFirstflowSurvey } from "@firstflow/react";
useFirstflowSurvey() gives you survey state and handlers without any UI. Use it when you need to render survey questions with your own components, layout, or design system.

​
Usage

import { useFirstflowSurvey } from "@firstflow/react";

function CustomSurvey({ experienceId }: { experienceId: string }) {
  const {
    currentQuestion,
    answers,
    isSubmitting,
    answer,
    next,
    back,
    submit,
    dismiss,
  } = useFirstflowSurvey({ experienceId });

  if (!currentQuestion) return null;

  return (
    <div>
      <p>{currentQuestion.text}</p>

      {currentQuestion.type === "nps" && (
        <NpsScale
          value={answers[currentQuestion.id] as number}
          onChange={(val) => answer(currentQuestion.id, val)}
        />
      )}

      {currentQuestion.type === "open" && (
        <textarea
          value={(answers[currentQuestion.id] as string) ?? ""}
          onChange={(e) => answer(currentQuestion.id, e.target.value)}
        />
      )}

      <button onClick={back}>Back</button>
      <button onClick={next}>Next</button>
      <button onClick={submit} disabled={isSubmitting}>
        Submit
      </button>
      <button onClick={dismiss}>Skip</button>
    </div>
  );
}

​
Parameters

​
experienceId
string
required
The ID of the survey experience to drive.

​
Return value

​
currentQuestion
SurveyQuestion | null
The active question object, or null if the survey is complete or not yet loaded.
interface SurveyQuestion {
  id: string;
  type: "nps" | "open" | "multiple_choice" | "rating";
  text: string;
  required: boolean;
  options?: string[]; // for multiple_choice
}
​
answers
Record<string, unknown>
Map of question ID to the collected answer value so far.
​
isSubmitting
boolean
true while the submit request is in flight.
​
answer(questionId, value)
function
Record an answer for a question. Does not advance to the next question.
​
next()
function
Advance to the next question. No-op if the current question is required and has no answer yet.
​
back()
function
Go back to the previous question.
​
submit()
function
Submit all collected answers and mark the experience complete.
​
dismiss()
function
Dismiss the survey without submitting.