OnDemandChatBot

OnDemandChatBot is a React library that provides an easy-to-use AI-powered chatbot component for your application. Built on top of the OnDemand platform, it allows full customization and seamless AI integration.

Features

• Fully Configurable – Customize the chatbot’s logo, name, welcome message, input placeholder, and more.
• Agent System – Assign specialized AI agents for different tasks. For example, use a LinkedIn agent to search for users on LinkedIn.
• AI Model Selection – Choose from 10+ AI models, including ChatGPT, Gemini, DeepSeek, Claude, and more.
• OnDemand Platform Integration – Manage all configurations directly from the OnDemand platform without code changes.

Installation

Install the package using npm or yarn:

npm install ondemand-react-chat-bot

or

yarn add ondemand-react-chat-bot

Props

| Prop Name | Type | Required | Description | | ------------------ | ------------------- | -------- | -------------------------------------------------------------------------------------------- | | apiKey | string | ✅ | Your API key obtained from On-Demand.io. | | botId | string | ✅ | The ID of your chatbot created on On-Demand.io. | | contextVariables | contextVariable[] | ❌ | Attach metadata or user-specific context to a session. You can add up to 10 key-value pairs. |

Types

type contextVariable = {
  key: string;
  value: string;
};

Usage

Import and use the OnDemandChatBot component in your project:

import { OnDemandChatBot } from "ondemand-react-chat-bot";

const App = () => {
  const contextVariables = [
    { key: "name", value: "John Deo" },
    { key: "email", value: "[email protected]" },
  ];

  return (
    <OnDemandChatBot
      apiKey="your-api-key"
      botId="your-bot-id"
      contextVariables={contextVariables}
    />
  );
};

export default App;

Configuring the Chatbot

All chatbot configurations (logo, name, welcome message, input placeholder, agents, AI models) can be managed through the OnDemand platform:

1. Log in to your account on On-Demand.io.
2. Navigate to the Chatbot Settings section.
3. Adjust your chatbot’s appearance and functionality as needed.
4. Copy your API key and Bot ID, and use them in your React project.

OnDemandChatBot API Key Guide

Getting an API Key

To use OnDemandChatBot, you need an API key from On-Demand.io. Follow the steps below to obtain your API key:

Step 1: Navigate to API Key Management

1. Log in to your account on On-Demand.io.
2. From the sidebar, click on API Key Management.

Step 2: Create a New API Key

1. Click on the Create New Secret Key button.

2. Enter a name for your API and click on Create API Key.
3. We strongly suggest you use "Restricted Chat Only" to restrict the functionality of this key and add allowed domains. This prevents unauthorized access and ensures your key is not misused. For example, specifying yourdomain.com ensures that only your website can use the key.
4. ⚠️ Warning: If you do not set allowed domains and use an unrestricted key, bad actors could exploit it for malicious activities.

Step 3: Copy and Store Your API Key

1. Once the key is generated, copy it immediately as it will not be shown again.

2. Store the key securely as you will need it to authenticate requests in OnDemandChatBot.

OnDemandChatBot Creation Guide

Step 1: Navigate to Web Chat Bot Creator

1. Go to On-Demand.io.
2. Click on Web Chat Bot Creator.
3. Click on Create Chat Bot.

Step 2: Configure Your Chatbot

1. Fill in all the details like Primary Color , Secondary Color , Logo , Bot Name ,
2. Click Save to store your chatbot configuration.

Step 3: Copy and Store Your Bot ID

1. After saving, copy the Bot ID.
2. Store it securely as you will need it to integrate with your application.

Now your chatbot is ready to use!