Human Verification

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/auth45.tsx instead.

Usage

The file also exports auth45Demo, 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 { Auth45, auth45Demo } from "@/components/blocks/auth/auth45";

export default function Page() {
  return <Auth45 {...auth45Demo} />;
}

Props

Behavior notes

• Client component: clicking the checkbox-style button moves it through idle -> verifying (a spinner, ~1.2s via a real setTimeout) -> verified (a check mark), at which point the continue button becomes enabled. This is a simulated timer, not a real bot-detection service.
• The checkbox control is a real focusable <button> with role="checkbox" and aria-checked reflecting the current state, not an unlabeled div, so it is keyboard-activatable.
• The setTimeout is cleared on unmount to avoid a state update after the component is gone.
• The continue button never performs a real navigation or submit; it is left inert once enabled.