Recovery Phrase Entry

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

Usage

The file also exports auth47Demo, 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 { Auth47, auth47Demo } from "@/components/blocks/auth/auth47";

export default function Page() {
  return <Auth47 {...auth47Demo} />;
}

Props

Behavior notes

• Client component: each box is a controlled <input> tracked in state so the restore button's disabled state can react to every box being non-empty.
• Paste-to-fill only intercepts the paste on the first input, and only when the pasted text splits into more than one whitespace-separated word; a single pasted word falls through to normal input behavior. It calls event.preventDefault() and distributes each word into its own input starting from the first box, overwriting whatever was already in those boxes.
• The restore button is disabled via real derived state (every word non-empty) rather than a static prop, but its click handler performs no real account-recovery call, it is left inert.
• Each input has a distinct aria-label ("Word 1", "Word 2", ...) in addition to its visible numbered prefix, since the numbers alone are not programmatically associated with the input without it.