type-writer-text

lightweight typewriter text animation library

Install

npm install --save type-writer-text

Usage

Basic

import * as React from 'react'

import { TypeWriterText } from 'type-writer-text'

class App extends React.Component {
  render () {
    return (
      <TypeWriterText text={"Happy Quarantine"} />
    )
  }
}

Passing Props

The component takes in following props

Text :

• Mandatory paramter, to render the string you want

Animation Speed :

• Optional paramter, to provide the speed to text rendering, defaults to 100

Cursor Props :

• Optional paramter, to provide color and blink-speed to cursor
• Should be passed in as an object, eg. {color:'grey', blinkSpeed: '1s'}, defaults to rgba(0,0,0,0.87) for color and '0.8s' for blinkSpeed

Show Cursor :

• Optional paramter, to show/hide cursor, defaults to true

import * as React from 'react'

import { TypeWriterText } from 'type-writer-text'

class App extends React.Component {
  render () {
    return (
      <TypeWriterText text={"Happy Quarantine"} animationSpeed = {100} cursorProps = {{ color: 'rgba(0,0,0,0.87)', blinkSpeed: '0.8s' }} showCursor = {true} />
    )
  }
}

License

MIT © HRSHDG8