A typewriter effect library for React.
Apply the typewriter (or, ahem, "windup") effect to:
- anything you can put in React's children prop!
Use the API to:
- Control the pacing of your windups
- Trigger animations, sounds or any effect you can think of!
- Intelligently handle line breaking in text!
Examples, API docs, and guides can all be found at the docs site!
???? Code landmarks
Where the action is happening in this codebase.
The bulk of the file are functions which return modified versions of a windup (e.g.
rewind), utilities (e.g.
isUnplayed), or functions for creating a Windup data structure (e.g.
The windup data structure is also described here:
- It has three elements, representing collections of members in three states: played, in progress, and unplayed.
- It is a recursive data structure, i.e. a windup can be a member of any of these three parts.
This is a hook that is used internally by
useWindupString. It does the bulk of the work of a windup: scheduling the next update, triggering effects, returning callbacks for rewinding/skipping etc.
This hook does very little: it just turns a string into a windup and passes it along to
A lot going on in this one: transforming the
children data type into a Windup, and a rough heuristic to determine when the value of
children has 'changed' (big quotation marks).