⚠️ Mobile is not supported yet.
Search for a command to run...
Copy-paste, session-gated access blocks for React — PIN/Knock Code unlock screens, protected routes/layouts/modals, a headless useKnockCodes hook, and full-page templates.
A static "you don't have access" view with no PIN form in it at all — distinct from the PIN entry UI. Use it as a custom unauthorizedFallback or any hard denial state.
A small session audit strip shown after unlock — timestamp, storage mode, timeout, and verification strategy. Requires a Session Provider.
A split-screen, logo-forward access screen — brand panel on one side, code entry on the other. The brand panel collapses on small screens.
Tiny local classname joiner used across blocks. Installed automatically.
Knock Codes fixed to the inline shell — sits naturally inside an existing layout (a sidebar widget, a section of a longer page) instead of taking over the full viewport.
The shared outer-positioning primitive (full-page centered vs. inline) every visible block composes on. Use it directly to build a fully custom gate layout.
The main gate: renders children when unlocked, otherwise a PIN prompt. Local SHA-256 verification by default; pass a `verify` function for server-mode protection.
Framework-agnostic hash/session/storage/verify logic. Installed automatically as a dependency of every React block — install directly only if you're building a custom framework binding.
A complete, single-file "restricted access" screen — full-page dark backdrop, centered card, segmented code entry, support link, footer help text. Everything in one component.
Shared config/defaults/label types used by every React block. Installed automatically — not meant to be added on its own.
Reads the shared session from a Session Provider and clears it on click.
The leanest access screen — a single masked field, a small plain card, no segmented boxes and no default footer copy. Everything in one component.
Gates one section of an already-visible page — the content stays mounted and blurred behind a centered dialog instead of disappearing entirely.
Masked PIN/passphrase input with paste support, show/hide toggle, and accessible loading/error states. No verification logic of its own.
A card-shaped gate for protecting one section of a page rather than the whole viewport — locked content stays mounted and blurred behind an Unlock button so the card's size never jumps.
`<KnockCodes>` shaped for a full-page shell (a Next.js layout.tsx): header/footer render even while locked, so persistent site chrome survives the gate.
Content stays mounted (blurred and inert) behind a modal Unlock Dialog instead of being replaced outright — useful when the protected content's layout should stay stable underneath the prompt.
`<KnockCodes>` shaped for route-level guarding (a React Router `element`, a layout redirect guard), with an optional `unauthorizedFallback` for routes that shouldn't show an inline PIN prompt.
Shares one useKnockCodes session across a tree, so a gate, a Logout Button, and a Session Timeout Banner all read and act on the same unlock state.
Warns before the shared session expires, with a one-click way to log out immediately instead of waiting for automatic expiry. Requires a Session Provider.
The fastest path to a working gate: wrap your app, pass a hash, done. A deliberately smaller prop surface than Knock Codes.
A non-dismissable modal PIN prompt — no backdrop click, no Escape-to-close. Composable standalone, or used by Protected Modal.
The headless session/verification hook every stateful block is built on. Installed automatically — use it directly only if you're building a fully custom PIN UI.
A small presentational spinner + label for the in-flight verification moment, for a fully custom PIN form built directly on useKnockCodes.