1.2.2 • Published 6 years ago

react-clicketyclack v1.2.2

Weekly downloads
26
License
MIT
Repository
github
Last release
6 years ago

react-clicketyclack

A React component that types out lines of text, one character at a time

Build Status

Preview

Kermit typing it out for you

(Demo)

Getting started

npm install --save react-clicketyclack
import React from 'react';
import ClicketyClack from 'react-clicketyclack'

const lines = [
  'Hello',
  'Goodbye',
];

const App = () => (
  <ClicketyClack lines={lines} erase repeat />
);

Props

PropertyPropTypeRequiredDefault Value
linesarrayOf(string)true-
classNamestringfalsenull
eraseboolfalsetrue
eraseSpeednumberfalse70
onCompletefuncfalsenull
pausenumberfalse600
repeatboolfalsetrue
speednumberfalse100

lines

An array of lines to be typed out, one after the other.

eraseSpeed

In milliseconds, how fast each character will be erased.

onComplete

Callback function to be called once all lines have been typed. Will be called multiple times when repeat is set to true.

pause

In milliseconds, the pause before starting to type or starting to erase.

repeat

If set to true, it will start over once all lines have been typed.

pause

In milliseconds, how fast each character will be typed.

Other projects

react-clicketyclack was created to emulate the behaviour of jquery.typer.js.

There are other React components that do similar things:

License

MIT License

1.2.2

6 years ago

1.2.1

7 years ago

1.2.0

7 years ago

1.1.0

7 years ago