react-telegram-chatbox

Chat widget connected to your Telegram account for instant messaging into your React websites. It uses react-chat-widget for the UI and telegram-socket-bot for the connection to Telegram.

Install

npm i react-telegram-chatbox

or

yarn add react-telegram-chatbox

Usage

1. Follow this link and type /start to sign up to TgSocketBot from your Telegram account and get your access token.
2. Install & import the library. Remember to include the styles from react-chat-widget/lib/styles.css
3. Put your token into the token attribute of Chatbox component

import { Chatbox } from "react-telegram-chatbox";
import "react-chat-widget/lib/styles.css";

const App = () => {
    const token = 'YourAccessToken';

    return <Chatbox token={token} />;
};

4. See and star telegram-socket-bot to know how to reply to users, allow hostnames to use your token and for recommendations about security and usage.

API

| Attribute | type | default | description | | -------------------- | ------------- | ---------------------------- | ---------------------------------------------------------- | | token | string | undefined | Token generated by TgSocketBot | | welcomeMessage? | string | undefined | Send a first message on chatbox creation | | welcomeMessageDelay? | number | 0 | Delay for the welcome message | | errorMessage? | string | 'Cannot connect to server' | Message to be sent if the connection cannot be established | | widgetProps? | WidgetProps | undefined | Props for react-chat-widget |

Compatibility

It support cjs and es modules. Typescript declarations available. Compatible with React ^16.0.0.

Dependencies

• react-chat-widget: >=3.0.5
• socket.io-client: >=3.1.2

Peer dependencies

• react: ^16.0.0
• react-dom: ^16.0.0

License

MIT @ Jonathan Mataloni