general-ai-chat-bot 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +98 -0
- package/dist/cjs/index.js +12529 -0
- package/dist/cjs/index.js.map +1 -0
- package/dist/esm/index.js +12527 -0
- package/dist/esm/index.js.map +1 -0
- package/dist/index.d.ts +8 -0
- package/package.json +55 -0
package/README.md
ADDED
|
@@ -0,0 +1,98 @@
|
|
|
1
|
+
# DT Logic ChatBot React Component Library
|
|
2
|
+
|
|
3
|
+
A lightweight, customizable React ChatBot component for integrating conversational AI into your app.
|
|
4
|
+
This library is designed to work with your own backend or API service and uses an ApiProvider for secure configuration.
|
|
5
|
+
|
|
6
|
+
## Features
|
|
7
|
+
|
|
8
|
+
✅ Easy to integrate into any React app
|
|
9
|
+
✅ Supports custom API base URL
|
|
10
|
+
✅ Requires API Key and Assistant ID for initialization
|
|
11
|
+
✅ TypeScript support
|
|
12
|
+
✅ Fully customizable UI
|
|
13
|
+
|
|
14
|
+
## Installation
|
|
15
|
+
|
|
16
|
+
Install via npm or yarn:
|
|
17
|
+
|
|
18
|
+
npm install dt-logic-chat
|
|
19
|
+
|
|
20
|
+
### or
|
|
21
|
+
|
|
22
|
+
yarn add dt-logic-chat
|
|
23
|
+
|
|
24
|
+
## Requirements
|
|
25
|
+
|
|
26
|
+
React >=17
|
|
27
|
+
|
|
28
|
+
Node.js >=14
|
|
29
|
+
|
|
30
|
+
### You must provide:
|
|
31
|
+
|
|
32
|
+
API Key (for authenticating with your backend or external API)
|
|
33
|
+
|
|
34
|
+
Assistant ID (to identify which assistant to use)
|
|
35
|
+
|
|
36
|
+
## Quick Start
|
|
37
|
+
|
|
38
|
+
1. Import and Wrap with ApiProvider
|
|
39
|
+
import React from "react";
|
|
40
|
+
import { ApiProvider, ChatBot } from "@your-scope/chatbot";
|
|
41
|
+
|
|
42
|
+
```typescript
|
|
43
|
+
function App() {
|
|
44
|
+
return (
|
|
45
|
+
<ApiProvider
|
|
46
|
+
config={{
|
|
47
|
+
apiKey: process.env.API_KEY,
|
|
48
|
+
assistantId: "your-assistant-id",
|
|
49
|
+
}}
|
|
50
|
+
>
|
|
51
|
+
<ChatBot />
|
|
52
|
+
</ApiProvider>
|
|
53
|
+
);
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
export default App;
|
|
57
|
+
```
|
|
58
|
+
|
|
59
|
+
2. Set Environment Variables
|
|
60
|
+
|
|
61
|
+
In your .env file:
|
|
62
|
+
|
|
63
|
+
`API_KEY=your-api-key`
|
|
64
|
+
|
|
65
|
+
## Props
|
|
66
|
+
|
|
67
|
+
### ApiProvider
|
|
68
|
+
|
|
69
|
+
| Prop | Type | Required | Description |
|
|
70
|
+
| ------------------ | ------ | -------- | ---------------------------------------------------- |
|
|
71
|
+
| apiKey | string | ✅ | Your API key for authentication |
|
|
72
|
+
| assistantId string | | ✅ | ID of the assistant to interact with |
|
|
73
|
+
| baseUrl | string | ❌ | API base URL (default: https://api.your-service.com) |
|
|
74
|
+
|
|
75
|
+
### ChatBot
|
|
76
|
+
|
|
77
|
+
| Prop | Type | Required | Description |
|
|
78
|
+
| -------------- | ------ | -------- | ----------------------------- |
|
|
79
|
+
| welcomeMessage | string | ❌ | Initial message to display |
|
|
80
|
+
| theme | object | ❌ | Custom styles for the chatbot |
|
|
81
|
+
|
|
82
|
+
### Example
|
|
83
|
+
```typescript
|
|
84
|
+
<ChatBot welcomeMessage="Hi there! How can I help you today?" />
|
|
85
|
+
```
|
|
86
|
+
|
|
87
|
+
## Security Notice
|
|
88
|
+
|
|
89
|
+
⚠️ Never expose sensitive keys in the client if they should remain private. If your API key is secret, use a backend proxy instead.
|
|
90
|
+
|
|
91
|
+
## Build:
|
|
92
|
+
```
|
|
93
|
+
npm run build
|
|
94
|
+
```
|
|
95
|
+
|
|
96
|
+
## License
|
|
97
|
+
|
|
98
|
+
© DT Logic
|