react-talkbot v0.1.20

React TalkBot

Convey your message to your users through displaying a beautiful animation. Visit the repo here.

Installation

$ npm i react-talkbot

Usage

    import { TalkBox } from 'react-talkbot';

    const msgDemo = [
        {
            sent: false,
            msg: "Hi, How can I build an impressive resume?",
        },
        {
            sent: true,
            msg: "Hello, Do you have a good Github Profile?",
        },
        {
            sent: false,
            msg: "Yeah, I do have one. All of my projects are on Github.",
        },
        {
            sent: true,
            msg:
            "Cool, You can head over to <a href='https://resume-github.vercel.app' style='color: #74c'>https://resume-github.vercel.app</a> and generate a resume with your username.",
        },
        {
            sent: false,
            msg: "Ohh, wow! I'll check it out.",
        },
        {
            sent: true,
            msg: "and the best part is you can customize it too.",
        },
        {
            sent: false,
            msg: "Great, Thanks buddy :)",
        },
    ];

    const App = () => {
        return (
            <div>
                // some code here
                <TalkBox
                    messages={messages}
                    senderAvatar={"🧑🏻"}
                    receiverAvatar={"👨🏻‍💻"}
                    containerStyle={{background: "antiquewhite", borderColor: "gainsboro"}}
                    msgWrapperStyle={{borderRadius: "24px"}}
                />
            </div>
        )
    }

API and Configuration