Ceremonies
Irreversible actions are never one tap. Broadcasting funds takes a press-and-hold with the aurum fill; revealing the seed takes typing the covenant phrase word-perfect. Friction here is the feature — the ceremony is the confirmation.
HoldToConfirm — fill progress
The aurum fill sweeps over 1.5s of continuous press; releasing early springs it back to zero. The progress prop pins any fraction statically for review.
<HoldToConfirm progress={0}>Hold to send</HoldToConfirm>--ch-surface--ch-accent--ch-radius-pill
Resting state — the action label reads plainly.
<HoldToConfirm progress={0.5} state="holding" holdingLabel="Keep holding…" />--ch-accent--ch-surface
Mid-press — the fill is at half and the label has flipped to the coaching line.
<HoldToConfirm progress={1} state="holding" />--ch-accent--ch-surface
Fill complete — the instant before release confirms.
<HoldToConfirm state="confirmed" confirmedLabel="Transaction sent" />--ch-accent--ch-accent-fg
Committed — check plus label on the full aurum fill. There is no undo past this point.
<HoldToConfirm holdMs={1500} onConfirm={broadcast}>Hold to send</HoldToConfirm>--ch-accent--ch-surface--ch-focus
Interactive — press and hold for 1.5 seconds. Release early and the fill springs back.
TypedConfirmation — phrase matching
The expected phrase renders above a mono input with per-word grading: completed words go success or danger, the word in progress underlines in primary, and Confirm stays disabled until the match is exact.
<TypedConfirmation phrase="I control my keys" value="" />--ch-fg-faint--ch-bg-raised--ch-border
Nothing typed — the phrase waits in faint, the input carries it as placeholder.
<TypedConfirmation phrase="I control my keys" value="I control my" />--ch-success--ch-primary--ch-border
On track — completed words read success, the current word underlines in primary.
<TypedConfirmation phrase="I control my keys" value="I control my keys" />--ch-success--ch-primary--ch-primary-fg
Word-perfect — the input border goes success and Confirm enables.
<TypedConfirmation phrase="I control my keys" value="I control my kys" />--ch-danger--ch-border--ch-bg-raised
A wrong word — danger border, shake, aria-invalid, and Confirm stays disabled.
<TypedConfirmation phrase="I control my keys" onConfirm={revealSeed} />--ch-success--ch-danger--ch-focus
Interactive — type the phrase. State derives from the value; no forcing.
Across themes
The confirmed ceremony under dark, light, and Harbor Mode — the full fill rides the accent, so a commit in Harbor Mode seals in beacon aurum.
<HoldToConfirm state="confirmed" confirmedLabel="Transaction sent">Hold to send</HoldToConfirm>--ch-accent--ch-accent-fg--ch-radius-pill