Customization
Fully customize our components, or build your own Flows and components headless.
Related: Styling Frigade Components
Building your own components
If you want to build something entirely custom, you can also build your own components and/or UI and use Frigade to manage content, state management, targeting, etc.
You’ll leverage the useFlows()
hook to directly access Flow data and control the state of your users’ progress through the Flow. See Flow Hook for more details and Building a Custom Component for a guided walkthrough.
Embedding Custom React Components
Frigade’s library of onboarding components allow developers to add and embed custom React components within them.
For instance, the <FrigadeChecklist />
component supports the customStepTypes
prop, which allows you to specify a mapping of Step types to custom React components. This allows you to do things like: show custom code snippets, embed custom widgets (e.g. invite a user), and utilize your existing experiences inside of Frigade checklists, forms, etc.
Each custom Step will receive stepData
(containing the step data from config.yml
), appearance
, and other useful props for rendering the Step.
For example, if you wanted to add a custom Step type in a checklist called myCustomizedStep
, you could do the following:
The corresponding config.yml
in the admin dashboard would be: