JSPM

  • Created
  • Published
  • 0
  • Score
    100M100P100Q46725F
  • License ISC

Chat Animations Library

Package Exports

  • chatanimations/BounceMessage
  • chatanimations/FadeInSlideInMessage
  • chatanimations/MessageFadeInAnimation
  • chatanimations/PopMessage
  • chatanimations/WordByWord

Readme

Usage

To use the Chat Animations Library in your React application, you can import the various animation components provided by the library and include them in your components.

WordByWord Component

The WordByWord component animates text word by word.

Props:

  • text: The text you want to animate word by word.
  • delay: The delay (in milliseconds) between each word animation.
  • getLoading: A function that can be used to handle loading state.
  • getValue: A function that can be used to get the value.

Example usage:

`jsx import WordByWord from 'chatanimations/WordByWord';

const getValue = (value) => { console.log(value); };

const getLoading = (value) => { console.log(value); };

function App() { return (

<div className='App'>
<WordByWord
text={'I am navneet vaishnav'}
delay={1000}
getLoading={getLoading}
getValue={getValue}
/>
</div>
);
}

`

BounceMessage Component

The BounceMessage component animates text with a bounce effect.

Props:

  • text: The text you want to animate with a bounce effect.
  • delay: The delay (in milliseconds) for the animation.

FadeInSlideInMessage Component

The FadeInSlideInMessage component animates text with a fade-in and slide-in effect..

Props:

  • text: The text you want to animate with a fade-in and slide-in effect.
  • delay: The delay (in milliseconds) for the animation.

MessageFadeInAnimation Component

The MessageFadeInAnimation component animates text with a fade-in effect.

Props:

  • text: The text you want to animate with a fade-in effect.
  • delay: The delay (in milliseconds) for the animation.

PopMessage Component

The PopMessage component animates text with a pop effect.

Props:

  • text: The text you want to animate with a pop effect.
  • delay: The delay (in milliseconds) for the animation.