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.

Properties

$state

$state: Object The state of the step for the given user in the given Flow. Example:
{
 completed: true,
 skipped: false,
 started: true,
 visible: true,
 blocked: false,
 lastActionAt: "2014-01-01T23:28:56.782Z"
}

autoMarkCompleted

Optional autoMarkCompleted: boolean Automatically mark the step as completed when the primary button is clicked. Default is false.

backButtonTitle

Optional backButtonTitle: string Text on button if a back button is present.

complete

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
NameTypeDescription
properties?PropertyPayload-
optimistic?booleanIf true, the step will be marked as completed without waiting for the API and validation of any targeting rules.
Returns Promise<void>

completionCriteria

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.

dismissible

Optional dismissible: boolean Whether the step is dismissible (for instance, tooltips or other non-essential steps).

flow

flow: Flow Reference to this step’s parent Flow

iconUri

Optional iconUri: string Icon url to be shown for components supporting icons.

id

id: string

imageUri

Optional imageUri: string Image url to be shown for components supporting image.

onStateChange

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
NameType
callback(step: FlowStep, previousStep?: FlowStep) => void
Returns void Deprecated Use frigade.on('step.complete' | 'step.skip' | 'step.reset' | 'step.start', handler) instead.

order

order: number Order of the step in the Flow.

primaryButton

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. |

primaryButtonTitle

Optional primaryButtonTitle: string Deprecated Use primaryButton.title instead Description Primary button title. If omitted, the primary button will not be shown.

primaryButtonUri

Optional primaryButtonUri: string Deprecated Use primaryButton.uri instead Description Primary button URI.

primaryButtonUriTarget

Optional primaryButtonUriTarget: string Deprecated Use primaryButton.target instead Description Primary button URI target (defaults to _self).

progress

Optional progress: number Progress if the step is tied to another Frigade Flow through completionCriteria.

removeStateChangeHandler

removeStateChangeHandler: (callback: (step: FlowStep, previousStep?: FlowStep) => void) => void Removes the given callback from the list of event handlers. Parameters
NameType
callback(step: FlowStep, previousStep?: FlowStep) => void
Returns void

reset

reset: () => Promise<void> Resets the step (useful for undoing a finished step). Returns Promise<void>

secondaryButton

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. |

secondaryButtonTitle

Optional secondaryButtonTitle: string Deprecated Use secondaryButton.title instead Description Secondary button title. If omitted, the secondary button will not be shown.

secondaryButtonUri

Optional secondaryButtonUri: string Deprecated Use secondaryButton.uri instead Description Secondary button URI.

secondaryButtonUriTarget

Optional secondaryButtonUriTarget: string Deprecated Use secondaryButton.target instead Description Secondary button URI target (defaults to _self)

skip

skip: (#propertypayload), optimistic?: boolean) => Promise<void> Marks the step skipped. Works similar to step.complete() Parameters
NameType
properties?PropertyPayload
optimistic?boolean
Returns Promise<void>

skippable

Optional skippable: boolean If true, the step will be marked as completed when the secondary button is clicked.

start

start: (#propertypayload)) => Promise<void> Marks the step started. This will move the current step index to the given step. Parameters
NameType
properties?PropertyPayload
Returns Promise<void>

startCriteria

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.

stepName

Optional stepName: string Name of the step when shown in a list view.

subtitle

Optional subtitle: string Subtitle of the step.

title

Optional title: string Title of the step.

videoUri

Optional videoUri: string Video url to be shown for components supporting video.

visibilityCriteria

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. View definition