Blocks

Auth Form

Centered auth card resting on a faint lumen glow.

Welcome back

Sign in and pick up right where the light left off.

New here?

Install

Copies the component source — plus its small internal deps — into your project. You own the code from the first minute.

terminal
npx lumora-ui@latest add auth-form

Import

Using the workspace package instead? Deep imports keep cold starts lean; the barrel is fully tree-shakable either way.

app/page.tsx
import { AuthForm } from "@lumora/ui/blocks/auth-form";
// or from the barrel:
import { AuthForm } from "@lumora/ui";

Props worth knowing

Switches between sign-in and sign-up via the footer toggle — controlled with mode/onModeChange or uncontrolled via defaultMode. onSubmit receives { email, password } plus the mode; ssoProviders and onSsoSelect fill the divider row; error renders above the submit button. Props extend the natural HTML element, so className, event handlers, and aria attributes pass straight through.