popchat v0.1.4

Guide

A react module to manage your chatheads onscreen, on any page. 1. Load the component on any parent component. It takes in 4 props, they are 1. chatHead: Takes in a string to as the name of the tab 2. messages: Takes an array of messages to display. The array contains object of following structure,

    ``` js
        const messages = [
            {
                sender: 'me',   //displayed in pale background
                text: 'hey there!' 
            },
            {
                sender: 'others',//displayed in background color specified in themeColor prop
                text: 'what's up
            }
        ]
    ```
3. `getMessage`: A function to retriev the message in the bubbel input, fired on pressing the `Enter`. Here's to define,
``` js
    const getMessage = (msg) => { 
        //process msg, the message in string 
        console.log(msg)
    } 
```
4. `themeColor`: Optional prop t ospecify the theme color of the component, violet by default. 

Here's a complete picture,

      const msgs = [
    {
      sender: 'me',
      text: 'hey, whatsup!'
    },
    {
      sender: 'others',
      text: 'hey, whatsup!'
    }, 
    {
      sender: 'others',
      text: 'hey, whatsup!'
    },
    {
      sender: 'me',
      text: 'hey, whatsup!'
    },
  ]
  const getMessage = (msg) => {
    console.log('App', msg)
  }
  
  return (
    <div>
        <Popchat messages={msgs} getMessage={getMessage} themeColor={'lightseagreen'} chatHead={'John Doe'} />
    </div>
  )