@sergonius/typa-react

Make words type themselves

Usage no npm install needed!

<script type="module">
  import sergoniusTypaReact from 'https://cdn.skypack.dev/@sergonius/typa-react';
</script>

README

typa-react

Make words type themselves

NPM JavaScript Style Guide

Install

npm install --save @sergonius/typa-react
# or
yarn add @sergonius/typa-react

Usage

It's a render prop, so you can use it however you want to.

import React from 'react';
import Typa from '@sergonius/typa-react';

class Example extends React.PureComponent {
  render() {
    return (
      <Typa
        strings={['do', 'your', 'thing']} // The strings to alternate between
        speed={85} // The wait time after each letter has been typed
        delay={1200} // How long to pause for after a string is complete
        loop={true} // Whether to start over after the last word in the string array
      >
        {string => (
          <React.Fragment>
            <span>{string}</span>
            <span className="cursor" />
          </React.Fragment>
        )}
      </Typa>
    );
  }
}

License

MIT © sergonius