OptionalchildrenThe children of the component. Leave empty to use the default sign-in flow UI.
If a function is provided, it will be called with the current state of the sign-in flow.
The function should return a ReactNode.
<SignIn>
{(state) => {
// Render a page title based on the current step
return (
<>
<SignInBackButton />
<SignInImage />
<h1>
{state.step === "credentials" && "Welcome"}
{state.step === "verification" && "Almost there"}
</h1>
<SignInTitle />
<SignInDescription />
<SignInForm />
{state.step === "credentials" && <SignInAuthMethodButtons activeMethod={state.authMethod} />}
<SignInFooter />
</>
);
}}
</SignIn>
OptionalonA function to call when the sign-in flow is successful.
Props for the SignIn component