# @tehlordvortex/react-typewriter-hook

> ⌨️ Use react hooks for typing effect easily

Latest version **1.1.1** (published 2019-08-12) · MIT license · 0 weekly downloads

## Install

```sh
npm install @tehlordvortex/react-typewriter-hook
pnpm add @tehlordvortex/react-typewriter-hook
yarn add @tehlordvortex/react-typewriter-hook
bun add @tehlordvortex/react-typewriter-hook
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.1.1 |
| Published | 2019-08-12 |
| First published | 2019-08-12 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 10.2 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | tehlordvortex |
| Maintainers | tehlordvortex |
| Keywords | react-hooks, typewriter, react |

## Links

- npm: https://www.npmjs.com/package/@tehlordvortex/react-typewriter-hook
- Repository: https://github.com/tehlordvortex/react-typewriter-hook
- Issues: https://github.com/tehlordvortex/react-typewriter-hook/issues
- npm.io page: https://npm.io/package/@tehlordvortex/react-typewriter-hook

## Alternatives

- [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads
- [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads
- [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads
- [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads
- [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads

## Recent versions

- 1.1.1 (latest) — 2019-08-12
- 1.1.0 — 2019-08-12

## README

# react-typewriter-hook
> ⌨️   Use react hooks for typing effect easily

## Original
See [here](https://github.com/haowen737/react-typewriter-hook/)

## Sample
<img src="https://github.com/haowen737/react-typewriter-hook/blob/master/docs/example.gif" alt="examplegif" width="620">

## Install
```sh
npm i react-typewriter-hook --save
```

## Example
View example at [codesandbox](https://codesandbox.io/s/lr3q0q32vq)

## Usage
```js
// useTypewriter will do these things
// Once Word changed, typewritter will automatically erase last word
// Then type down new word
import useTypewriter from "react-typewriter-hook"

function MagicWriter(word) {
  const typing = useTypewriter(word)
  return typing
}

```
## What happens after call useTypewriter hook
- Typewriter accept the word, ready to write
- Typewriter write down your word and waiting for the word change
- Typewriter once accept the new word, it erases the last word, and write down next

## Options

`useTypewriter` supports some optional configuration options. Use them as follows:
```js
const typing = useTypewrite(word, {
  duration: 1000,
  // etc
})
```


| Option | Type | Description | Default Value |
| ----   | ---- | ----        | ----          |
| interval | number | The interval between each 'stroke' of a letter, in milliseconds. Overidden by `duration` if present | A random number |
| duration | number | The total duration to spend typing, in milliseconds. If provided, the duration is evenly divided between the total number of letters in the provided string. Overrides `interval` | |

---
_Source: https://npm.io/package/@tehlordvortex/react-typewriter-hook · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._