ProAgent Chat Widget

A lightweight, AI-powered chat widget that can be seamlessly integrated into any website. Train your AI agent with your documents to provide instant support to your customers.

Table of Contents

• Getting Started
  • Account Setup
  • Installation
    • Using CDN (HTML)
    • For React Applications
    • For Next.js Applications (Preventing Hydration Errors)
• Demo
• Features
• Browser Support
• Important Note
• Support

Getting Started

1. Account Setup

1. Sign Up: Register at ProAgent Signup.

2. Login: Access your account through the ProAgent Dashboard.

3. Create an Agent: Set up a new agent from your dashboard.

4. Access Key: Copy your agent's access key for integration.

5. Document Upload: Train your agent by uploading relevant documents.

2. Installation

Using CDN (HTML)

<!-- Chat Widget Placement -->
<div id="proagent-module"></div>

<!-- ProAgent Script from jsDelivr -->
<script src="https://cdn.jsdelivr.net/npm/proagent-module/dist/index.umd.js"></script>
<script>
  const ACCESS = 'YOUR_ACCESS_KEY';
  Proagent.render('proagent-module', ACCESS);
</script>

or

<!-- Chat Widget Placement -->
<div id="proagent-module"></div>

<!-- ProAgent Script from jsDelivr -->
<script src="https://unpkg.com/proagent-module/dist/index.umd.js"></script>
<script>
  const ACCESS = 'YOUR_ACCESS_KEY';
  Proagent.render('proagent-module', ACCESS);
</script>

For React Applications

npm install proagent-module
# or
yarn add proagent-module

import { Proagent } from 'proagent-module';

function App() {
  return <Proagent apiKey="YOUR_ACCESS_KEY" />;
}

export default App;

For Next.js Applications (Preventing Hydration Errors)

'use client';
import { Proagent } from 'proagent-module';

export default function ChatWidget() {
  return <Proagent apiKey="YOUR_ACCESS_KEY" />;
}

import ChatWidget from '../your_path/ChatWidget';

export default function App() {
  return (
    <div>
      <ChatWidget />
    </div>
  );
}

Demo

ProAgent Welcome Interface

Chat User Interface

Features

• AI-powered Responses: Get real-time answers powered by artificial intelligence.
• Responsive Design: Ensures optimal viewing across all devices.
• Real-time Chat Interface: Engage with customers immediately.
• Document Training Capability: Improve agent responses by training with specific documents.
• Quick Message Suggestions: Speed up response times with AI suggestions.
• Secure Communication: Safeguard data with advanced security measures.

Browser Support

Supported on the latest versions of Chrome, Firefox, Safari, and Edge.

Important Note

For optimal performance, remember to regularly update the documents used to train your agent.

Support

For assistance, reach out to us at [email protected].