AuthDone
A brief success mark, then the flow carries on by itself.
SourcePackage @kerf-js/veneer
Preview
tsx
import { AuthDone } from '@kerf-js/veneer'export function SignedIn() { return ( <AuthDone heading="h3" title="You're in" lede="Signed in as mara@kerf.dev." delay={3600000} /> )}Installation
npm install @kerf-js/veneerUsage
tsx
import { AuthDone } from '@kerf-js/veneer'<AuthDone heading="h3" title="You're in" lede="Signed in as mara@kerf.dev." delay={3600000}/>Accessibility
- This has no shortcuts of its own: controls inside it use Tab, Enter and Space as usual, and veneer's parts keep their roles and labels.
API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
title | unknown | — | The heading. |
lede | unknown | — | One line under it. |
heading | Heading | — | The title's level. |
delay | number | 1200 | Milliseconds before onContinue. |
| Event | Type | Default | Description |
|---|---|---|---|
onContinue | (() => void) | — | Goes on to the app. |
Parts
Every element carries a stable name, so you can style it from your own CSS: [data-scope="stack"] [data-part="lede"]
lede