All of Frigade’s Javascript SDKs share the same Flow Step type definition which is defined in the Frigade JS SDK.
The Step type is a representation of a step in a Flow.
It contains all the data and methods needed to build custom components with Frigade and to interact with the Frigade API without writing a single custom network call.
$state: Object
The state of the step for the given user in the given Flow. Example:
Optional
autoMarkCompleted: boolean
Automatically mark the step as completed when the primary button is clicked. Default is false.
Optional
backButtonTitle: string
Text on button if a back button is present.
complete: (#propertypayload), optimistic?
: boolean
) => Promise
<void
>
Marks the step completed.
Param
If true, the step will be marked as completed without waiting for the API and validation of any targeting rules.
Parameters
Name | Type | Description |
---|---|---|
properties? | PropertyPayload | - |
optimistic? | boolean | If true, the step will be marked as completed without waiting for the API and validation of any targeting rules. |
Returns
Promise
<void
>
Optional
completionCriteria: string
Criteria that needs to be met for the step to complete. Completion criteria uses Frigade’s Targeting Engine to determine if the step should be completed.
Optional
dismissible: boolean
Whether the step is dismissible (for instance, tooltips or other non-essential steps).
flow: Flow
Reference to this step’s parent Flow
Optional
iconUri: string
Icon url to be shown for components supporting icons.
id: string
Optional
imageUri: string
Image url to be shown for components supporting image.
onStateChange: (callback
: (step
: FlowStep
, previousStep?
: FlowStep
) => void
) => void
Event handler called when this step’s state changes.
Deprecated
Use frigade.on('step.complete' | 'step.skip' | 'step.reset' | 'step.start', handler)
instead.
Parameters
Name | Type |
---|---|
callback | (step : FlowStep , previousStep? : FlowStep ) => void |
Returns
void
Deprecated
Use frigade.on('step.complete' | 'step.skip' | 'step.reset' | 'step.start', handler)
instead.
order: number
Order of the step in the Flow.
Optional
primaryButton: Object
Config for the primary button in this step
| action?
| StepAction
| Primary button action. (defaults to step.complete) |
| target?
| string
| Primary button URI target (defaults to _self). |
| title?
| string
| Primary button title. If omitted, the primary button will not be shown. |
| uri?
| string
| Primary button URI. |
Optional
primaryButtonTitle: string
Deprecated
Use primaryButton.title instead
Description
Primary button title. If omitted, the primary button will not be shown.
Optional
primaryButtonUri: string
Deprecated
Use primaryButton.uri instead
Description
Primary button URI.
Optional
primaryButtonUriTarget: string
Deprecated
Use primaryButton.target instead
Description
Primary button URI target (defaults to _self).
Optional
progress: number
Progress if the step is tied to another Frigade Flow through completionCriteria.
removeStateChangeHandler: (callback
: (step
: FlowStep
, previousStep?
: FlowStep
) => void
) => void
Removes the given callback from the list of event handlers.
Parameters
Name | Type |
---|---|
callback | (step : FlowStep , previousStep? : FlowStep ) => void |
Returns
void
reset: () => Promise
<void
>
Resets the step (useful for undoing a finished step).
Returns
Promise
<void
>
Optional
secondaryButton: Object
Config for the secondary button in this step
| action?
| StepAction
| Secondary button action. (defaults to step.complete) |
| target?
| string
| Secondary button URI target (defaults to _self). |
| title?
| string
| Secondary button title. If omitted, the secondary button will not be shown. |
| uri?
| string
| Secondary button URI. |
Optional
secondaryButtonTitle: string
Deprecated
Use secondaryButton.title instead
Description
Secondary button title. If omitted, the secondary button will not be shown.
Optional
secondaryButtonUri: string
Deprecated
Use secondaryButton.uri instead
Description
Secondary button URI.
Optional
secondaryButtonUriTarget: string
Deprecated
Use secondaryButton.target instead
Description
Secondary button URI target (defaults to _self)
skip: (#propertypayload), optimistic?
: boolean
) => Promise
<void
>
Marks the step skipped. Works similar to step.complete()
Parameters
Name | Type |
---|---|
properties? | PropertyPayload |
optimistic? | boolean |
Returns
Promise
<void
>
Optional
skippable: boolean
If true, the step will be marked as completed when the secondary button is clicked.
start: (#propertypayload)) => Promise
<void
>
Marks the step started. This will move the current step index to the given step.
Parameters
Name | Type |
---|---|
properties? | PropertyPayload |
Returns
Promise
<void
>
Optional
startCriteria: string
Criteria that needs to be met for the step to start. Start criteria uses Frigade’s Targeting Engine to determine if the step should be started.
Optional
stepName: string
Name of the step when shown in a list view.
Optional
subtitle: string
Subtitle of the step.
Optional
title: string
Title of the step.
Optional
videoUri: string
Video url to be shown for components supporting video.
Optional
visibilityCriteria: string
Criteria that needs to be met for the step to be visible. Visibility criteria uses Frigade’s Targeting Engine to determine if the step should be visible.
All of Frigade’s Javascript SDKs share the same Flow Step type definition which is defined in the Frigade JS SDK.
The Step type is a representation of a step in a Flow.
It contains all the data and methods needed to build custom components with Frigade and to interact with the Frigade API without writing a single custom network call.
$state: Object
The state of the step for the given user in the given Flow. Example:
Optional
autoMarkCompleted: boolean
Automatically mark the step as completed when the primary button is clicked. Default is false.
Optional
backButtonTitle: string
Text on button if a back button is present.
complete: (#propertypayload), optimistic?
: boolean
) => Promise
<void
>
Marks the step completed.
Param
If true, the step will be marked as completed without waiting for the API and validation of any targeting rules.
Parameters
Name | Type | Description |
---|---|---|
properties? | PropertyPayload | - |
optimistic? | boolean | If true, the step will be marked as completed without waiting for the API and validation of any targeting rules. |
Returns
Promise
<void
>
Optional
completionCriteria: string
Criteria that needs to be met for the step to complete. Completion criteria uses Frigade’s Targeting Engine to determine if the step should be completed.
Optional
dismissible: boolean
Whether the step is dismissible (for instance, tooltips or other non-essential steps).
flow: Flow
Reference to this step’s parent Flow
Optional
iconUri: string
Icon url to be shown for components supporting icons.
id: string
Optional
imageUri: string
Image url to be shown for components supporting image.
onStateChange: (callback
: (step
: FlowStep
, previousStep?
: FlowStep
) => void
) => void
Event handler called when this step’s state changes.
Deprecated
Use frigade.on('step.complete' | 'step.skip' | 'step.reset' | 'step.start', handler)
instead.
Parameters
Name | Type |
---|---|
callback | (step : FlowStep , previousStep? : FlowStep ) => void |
Returns
void
Deprecated
Use frigade.on('step.complete' | 'step.skip' | 'step.reset' | 'step.start', handler)
instead.
order: number
Order of the step in the Flow.
Optional
primaryButton: Object
Config for the primary button in this step
| action?
| StepAction
| Primary button action. (defaults to step.complete) |
| target?
| string
| Primary button URI target (defaults to _self). |
| title?
| string
| Primary button title. If omitted, the primary button will not be shown. |
| uri?
| string
| Primary button URI. |
Optional
primaryButtonTitle: string
Deprecated
Use primaryButton.title instead
Description
Primary button title. If omitted, the primary button will not be shown.
Optional
primaryButtonUri: string
Deprecated
Use primaryButton.uri instead
Description
Primary button URI.
Optional
primaryButtonUriTarget: string
Deprecated
Use primaryButton.target instead
Description
Primary button URI target (defaults to _self).
Optional
progress: number
Progress if the step is tied to another Frigade Flow through completionCriteria.
removeStateChangeHandler: (callback
: (step
: FlowStep
, previousStep?
: FlowStep
) => void
) => void
Removes the given callback from the list of event handlers.
Parameters
Name | Type |
---|---|
callback | (step : FlowStep , previousStep? : FlowStep ) => void |
Returns
void
reset: () => Promise
<void
>
Resets the step (useful for undoing a finished step).
Returns
Promise
<void
>
Optional
secondaryButton: Object
Config for the secondary button in this step
| action?
| StepAction
| Secondary button action. (defaults to step.complete) |
| target?
| string
| Secondary button URI target (defaults to _self). |
| title?
| string
| Secondary button title. If omitted, the secondary button will not be shown. |
| uri?
| string
| Secondary button URI. |
Optional
secondaryButtonTitle: string
Deprecated
Use secondaryButton.title instead
Description
Secondary button title. If omitted, the secondary button will not be shown.
Optional
secondaryButtonUri: string
Deprecated
Use secondaryButton.uri instead
Description
Secondary button URI.
Optional
secondaryButtonUriTarget: string
Deprecated
Use secondaryButton.target instead
Description
Secondary button URI target (defaults to _self)
skip: (#propertypayload), optimistic?
: boolean
) => Promise
<void
>
Marks the step skipped. Works similar to step.complete()
Parameters
Name | Type |
---|---|
properties? | PropertyPayload |
optimistic? | boolean |
Returns
Promise
<void
>
Optional
skippable: boolean
If true, the step will be marked as completed when the secondary button is clicked.
start: (#propertypayload)) => Promise
<void
>
Marks the step started. This will move the current step index to the given step.
Parameters
Name | Type |
---|---|
properties? | PropertyPayload |
Returns
Promise
<void
>
Optional
startCriteria: string
Criteria that needs to be met for the step to start. Start criteria uses Frigade’s Targeting Engine to determine if the step should be started.
Optional
stepName: string
Name of the step when shown in a list view.
Optional
subtitle: string
Subtitle of the step.
Optional
title: string
Title of the step.
Optional
videoUri: string
Video url to be shown for components supporting video.
Optional
visibilityCriteria: string
Criteria that needs to be met for the step to be visible. Visibility criteria uses Frigade’s Targeting Engine to determine if the step should be visible.