React component which lists chat messages

This is not a full chat system, it is just a box which shows a conversation

Usage

import Box from 'react-chat-box';

const Something = props => <div>
	<Box />
</div>
...

How it works

It gets a conversation as a prop, and a conversation is just a list of messages. It shows each message with a set delay ( also a prop ), one by one. If it receives new messages ( conversation prop gets updated ) they will wait their turn. Not intended to change already shown messages, so it expects any update to conversation array to be just a push onto it. Invokes the onShowingAll callback when all the messages are shown.

Height is set to auto, if you want scroll functionality just put it inside a scrollable component.

Props

prop | type | default -------- | --- | -------- delay | number|1000 onShowingAll | function|null conversation| array|[{}]

For closer description of how a conversation item looks like, checkout react chat cloud.