Main actors
HaapiStepper runs the flow; everything else is about how you render it.
HaapiStepper — runs the flow
A headless provider that manages multi-step HAAPI authentication workflows. Wrap your app in it.
<HaapiStepper>
{/* your UI goes here */}
</HaapiStepper>
useHaapiStepper() — read & advance the flow
A hook that exposes the ongoing HaapiStepper authentication flow: its current step and state
(currentStep, loading, error), the history of steps taken so far, and a nextStep
function to advance it.
const { currentStep, loading, error, history, nextStep } = useHaapiStepper();
HaapiStepperStepUI — the default UI
Renders any HAAPI flow step out of the box, providing a complete default opinionated login UI. It is the fastest way to get HAAPI flows running, and the starting point you customize from.
HAAPI stepper UI components — the building blocks
The UI representation of the HAAPI entities (HaapiStep → HaapiStepperStepUI, HaapiUserMessage → HaapiStepperMessageUI…). These are the building blocks HaapiStepperStepUI is made of, and what you compose your own UI from.