NPS Survey React Component
Preview
A floating <FrigadeNPSSurvey/>
Setup Guide
Check out our guide on how to create and target an NPS Survey in your product.
Code
config.yml props
The following props are available in config.yml
in the steps
array:
React component props
- appearance
- className
- customVariables
- dismissible
- flowId
- hideOnFlowCompletion
- onButtonClick
- onComplete
- onDismiss
- onStepCompletion
- style
- type
appearance
Optional
appearance: Appearance
The appearance of the flow. See https://docs.frigade.com/sdk/styling
className
Optional
className: string
customVariables
Optional
customVariables: Object
Dynamic variables to use in config.yml. See https://docs.frigade.com/flows/dynamic-variables
Index signature
▪ [key: string
]: string
| number
| boolean
dismissible
Optional
dismissible: boolean
flowId
flowId: string
hideOnFlowCompletion
Optional
hideOnFlowCompletion: boolean
onButtonClick
Optional
onButtonClick: (step
: StepData
, index?
: number
, cta?
: "primary"
| "secondary"
| "link"
| "back"
| "collapse"
| "expand"
, nextStep?
: StepData
) => boolean
Handler for when a primary or secondary CTA is clicked (regardless if step is completed or not). Return true if your app performs an action (e.g. open other modal or page transition).
Parameters
Name | Type |
---|---|
step | StepData |
index? | number |
cta? | "primary" | "secondary" | "link" | "back" | "collapse" | "expand" |
nextStep? | StepData |
Returns
boolean
onComplete
Optional
onComplete: () => void
Returns
void
onDismiss
Optional
onDismiss: () => void
Returns
void
onStepCompletion
Optional
onStepCompletion: (step
: StepData
, index
: number
, nextStep?
: StepData
, allFormData?
: any
, stepSpecificFormData?
: any
) => boolean
Handler for when a step is completed.
Parameters
Name | Type | Description |
---|---|---|
step | StepData | |
index | number | |
nextStep? | StepData | |
allFormData? | any | All form data collected so far (only applicable to FrigadeForms) |
stepSpecificFormData? | any | Form data collected for the finished step (only applicable to FrigadeForms) |
Returns
boolean
style
Optional
style: CSSProperties
type
Optional
type: "inline"
| "modal"