Typewriter
A line that types itself one character at a time, at its finished width from the first frame.
55ms a character
shadcn add @afterglow/typewriter
writing components/ui/typewriter.tsx ... ok
Installation
npx shadcn@latest add @afterglow/typewriterAPI Reference
The element is its finished size from the first frame and the whole string stays in the accessibility tree, so nothing around it moves as the text arrives.
jitter varies each character's delay by that fraction of speed. Set it to 0 for an even cadence, which reads as a wipe rather than as typing.
Typewriter
Prints text a character at a time, roughly speed milliseconds apart. onDone fires when the line finishes, which is how you chain one into the next.
| Prop | Type | Default |
|---|---|---|
| text | string | - |
| speed | number | 55 |
| jitter | number | 0.45 |
| startDelay | number | 0 |
| caret | boolean | true |
| loop | boolean | false |
| loopDelay | number | 1800 |
| onDone | () => void | - |