1.0.2 • Published 6 years ago
react-chat-box v1.0.2
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.