react-survey-maker

Embed a take-survey form in your React app.

Install

npm install react-survey-maker

Peer dependencies

• react >= 17
• react-dom >= 17

Usage

1. Import the component and styles in your app:

import { ReactSurveyMaker } from "react-survey-maker";
import "react-survey-maker/styles.css";

2. Render the component with your clientId, clientSecret, and surveyId:

<ReactSurveyMaker
  clientId="your-client-id"
  clientSecret="your-client-secret"
  surveyId="my-survey-slug"
  onComplete={(thankYouMessage) => console.log("Submitted!", thankYouMessage)}
/>

The survey is loaded and submitted using your client ID, client secret, and survey ID.

Props

| Prop | Type | Required | Description | | ----------------- | ------------------------------------ | -------- | ---------------------------------------------------------------------- | | clientId | string | Yes | Client ID for your organization. | | clientSecret | string | Yes | Client secret. requests. | | surveyId | string | Yes | Survey ID | | onComplete | (thankYouMessage?: string) => void | No | Callback when the user successfully submits the survey. | | launcherMessage | string | No | Message shown next to the chat icon (default: "New survey for you"). | | className | string | No | Extra class name(s) for the root container. | | style | React.CSSProperties | No | Inline styles for the root container. |

Styling

Import the default styles so the form looks correct:

import "react-survey-maker/styles.css";

License

MIT