React-TypeMe


A tiny typewriter animation React component, simple and powerful.

Overview

React-TypeMe is a typewriter animation simulator component built to be simple and powerful.
It was created primarily to learn about the awesome React Hooks. It is built as React functional component.

Features

* Extremely lightweight (< 2KB gzipped including styling).
* Create string looping animation.
* Customize where your line breaks.
* Simulate character deletions where necessary.
* Control typing and backspace speeds if desired.
* Use your own cursor character.
* Easily add custom delays.
* Control when to start your typing animation.
* Made solely for React - No external dependencies.
* Storybook implementation examples.

Installation

``bash
npm install react-typeme
`

$3

`jsx
import TypeMe, { LineBreak, Delete } from 'react-typeme';

// Example #1: text passed as children
The earth is but one country, and mankind its citizens.

// Example #2: text passed as prop, with a line break
'The earth is but one country,',
,
'And mankind its citizens.'
]} />

// Example #3: text passed as prop, with backspace simulation
'The earth is but one country and mankind its people',
,
'citizens.'
]} />
`

License options


React-TypeMe` is completely free to use within your open source or personal project. To use it in a commercial project, please purchase either a single license use or an unlimited license — I'll also gladly help if you encounter any issues / bugs.

Personal or Open Source - FREE!

Single Commercial License

Extended Commercial License

License

GPL-3.0 © Oliver Oxenham