TypeScript icon, indicating that this package has built-in type declarations

1.0.2 • Public • Published

React Live Chat from Customerly

Add the most powerful Live Chat to your React app.

⚙️ Install

Using npm

Run npm install --save react-live-chat-customerly

Using yarn

Run yarn add react-live-chat-customerly

🚀 How to use

To integrate Customerly Livechat to your React app, you need to have an account with Customerly. Sign up here.

import {CustomerlyProvider} from "react-live-chat-customerly";

    <CustomerlyProvider appId={"YOUR_APP_ID"}>

And then, you can use the useCustomerly hook to load the messenger, and interact with it.

const App: FunctionComponent = () => {
    const { load } = useCustomerly();

    useEffect(() => {
        load({ ... })
    }, []);
    return (
        <Things />


This hook exposes all the available methods mentioned in the documentation, check it out.

  • load - The entry point of Customerly, it loads the messenger in the webpage
  • update - Same as load, but to refresh the messenger (e.g. after a sign in you might want to authenticate the user)
  • open - Open programmatically the messenger
  • close - Close programmatically the messenger
  • show - Show programmatically the messenger
  • hide - Hide programmatically the messenger
  • event - Track an event for the user in the current session
  • attribute - Track a property for the user in the current session
  • sendNewMessage - Send a new message
  • showNewMessage - Open and prefill the messenger with the specified message
  • registerCallback - Register a callback (see available callbacks) fired by the messenger during the lifecycle

🙋 Contributing

If you have improvements that you'd like to see, or encounter any bugs, feel free to create an issue. Alternatively, please open a PR, and make sure that the new code is properly tested and all the steps.

We follow the Conventional Commits specification.


DownloadsWeekly Downloads






Unpacked Size

73.8 kB

Total Files


Last publish


  • emdotem