Check Your Inbox

Installation

A real shadcn registry command, not a copy-paste stand-in: it fetches this block plus its button dependencies and any missing npm packages, and installs them straight into your project.

Prefer not to use the CLI? Copy the source from the Code toggle above into src/components/blocks/auth/auth20.tsx instead.

Usage

The file also exports auth20Demo, the exact props behind the preview above. Spread it to get a working section in one line, then replace it with your own data.

import { Auth20, auth20Demo } from "@/components/blocks/auth/auth20";

export default function Page() {
  return <Auth20 {...auth20Demo} />;
}

Props

Behavior notes

• The countdown is a real client-side timer: a single setInterval created in useEffect decrements local state once per second and clears itself at zero, no email is actually sent or resent.
• Once the countdown reaches zero, the "Resend" link/button appears in its place; clicking it resets the countdown back to resendSeconds and restarts the interval via a `cycle` state bump, it does not trigger a real resend request.
• "Open email app" is a plain button with no handler, opening a mail client is a backend/OS-level action left inert.