Skip to content

Survey

A component for user surveys, allowing multi-step flows and keyboard navigation. Supports single and multiple-choice selection, and short or long text inputs.

Inline

What is your favorite color?

  • a

  • b

  • c

Press a key to select or ↑↓ to navigate

Code Editor

Survey Modal

Code Editor

Input Validation

Some fields have built-in validation. Custom regex is supported.

Input Validation

Press a key to select or ↑↓ to navigate

Code Editor

Modal with Prompt

Use the prompt prop with SurveyModal to display a prompt to start the survey.

Code Editor

Prompt with Toast

Use the promptWithToast prop to display the survey toast.

Code Editor

Hide If Already Seen

Use the hideIfAlreadySeen prop to prevent the survey modal from opening if the user has previously dismissed the survey toast or submitted the survey.

Code Editor

Asynchronous Submission

When you need a blocking network request prior to closing the modal.

Code Editor

Submission to Built-In Survey Endpoint

Submitting to the built-in survey endpoint is as simple as using the `createSurveyEntry` helper.

Code Editor

Skip Enabled

Use the enableSkip prop to display an explicit Skip button on the first step.