Blocks

Building something custom?

A Template gets you shipped in one file. If you'd rather assemble your own layout, these are the same tested primitives the templates are built from — preview one live, copy the source, or install it with the shadcn CLI.

access-denied-screen

Feedback

Access Denied Screen

A static "you don't have access" view — no access-code form in it at all.

feedbackfallback
access-receipt

Session

Access Receipt

A small session audit strip shown after unlock — timestamp, storage mode, timeout, and verification strategy.

sessionfeedback
embedded-gate

Routing & Layout

Embedded Gate

Knock Codes fixed to the inline shell — sits naturally inside an existing layout.

layout
gate-wrapper

Core

Gate Wrapper

The shared outer-positioning primitive every visible block composes on.

corelayout
knock-codes

Core

Knock Codes

The main gate — renders children when unlocked, otherwise an access-code prompt.

coregate
logout-button

Session

Logout Button

Reads the shared session from a Session Provider and clears it on click.

sessionaction
pin-input

Core

PIN Input

Masked access-code input (PIN or passphrase) with paste support and accessible loading/error states.

coreform
protected-card

Modal & Overlay

Protected Card

A card-shaped gate for protecting one section of a page rather than the whole viewport.

cardwidget
protected-layout

Routing & Layout

Protected Layout

Knock Codes shaped for a full-page shell — header/footer stay visible even while locked.

routinglayout
protected-modal

Modal & Overlay

Protected Modal

Content stays mounted and blurred behind a modal Unlock Dialog instead of being replaced.

modal
protected-route

Routing & Layout

Protected Route

Knock Codes shaped for route-level guarding, with an optional custom unauthorized state.

routing
session-provider

Session

Session Provider

Shares one useKnockCodes session across a tree, so multiple components stay in sync.

contextsession
session-timeout-banner

Session

Session Timeout Banner

Warns before the shared session expires, with a one-click way to log out immediately.

sessionfeedback
standalone-gate

Routing & Layout

Standalone Gate

The fastest path to a working gate: wrap your app, pass a hash, done.

quickstart
unlock-dialog

Modal & Overlay

Unlock Dialog

A non-dismissable modal access-code prompt — no backdrop click, no Escape-to-close.

modaldialog
verification-loader

Feedback

Verification Loader

A small presentational spinner + label for the in-flight verification moment.

feedbackloading