1.1.1 • Published 5 years ago

@tehlordvortex/react-typewriter-hook v1.1.1

Weekly downloads
-
License
MIT
Repository
github
Last release
5 years ago

react-typewriter-hook

⌨️ Use react hooks for typing effect easily

Original

See here

Sample

Install

npm i react-typewriter-hook --save

Example

View example at codesandbox

Usage

// 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:

const typing = useTypewrite(word, {
  duration: 1000,
  // etc
})
OptionTypeDescriptionDefault Value
intervalnumberThe interval between each 'stroke' of a letter, in milliseconds. Overidden by duration if presentA random number
durationnumberThe 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