A config-driven wizard system with a drag-and-drop visual flow editor, expression language, and variable accumulation.
Wizard Flow lets you define entire multi-step wizard forms in JSON — conditional navigation, field validation, variable accumulation, and template processing. But the real feature is the visual flow editor built with React Flow.
You drag and drop pages to create the wizard flow, connect them with conditional edges, and see the entire user journey as a graph. Monaco Editor (the VS Code engine) handles JSON editing for fine-tuning.
The expression language supports comparisons, logic operators, and functions like min() and length(). Variables accumulate as the user progresses, accessible via {{variables.name}} template syntax. Zod handles schema validation.
The monorepo (Turborepo + pnpm) has 4 packages: @wizard-flow/shared, runtime, editor, and demo. The demo includes 4 wizards: user registration, health assessment (with BMI calculation), product recommendation quiz, and customer satisfaction survey. Full ARIA accessibility and keyboard navigation.