@kvsnguyen/chatbot-widget 0.0.6 → 0.0.8

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.
Files changed (2) hide show
  1. package/README.md +25 -14
  2. package/package.json +1 -1
package/README.md CHANGED
@@ -1,28 +1,39 @@
1
1
  # Chatbot Widget
2
2
 
3
- A lightweight **AI Chatbot UI widget** that can be easily embedded into any website via a `<script>` tag.
4
- This project provides a **bubble chat** at the bottom-right corner with a mock AI backend.
3
+ A lightweight **AI Chatbot UI widget** that can be easily embedded into any website via **CDN** or **npm package**.
5
4
 
6
- > **Note:** Currently uses a mock API. Replace `mockReply` with your real API for AI functionality.
5
+ This version **auto-mounts** on page load no need to call `init()`. It comes with a floating chat bubble at the bottom-right corner and a mock AI backend for testing.
7
6
 
8
7
  ---
9
8
 
10
9
  ## Features
11
10
 
12
- - Floating chat bubble, fixed at bottom-right corner
13
- - Expandable chat panel with message list
14
- - Mock AI replies for testing
15
- - Easy to embed on any website via **CDN**
16
- - Fully customizable via init options
17
- - CSS isolated to avoid conflicts with host page
11
+ - Floating chat bubble, fixed position
12
+ - Expandable chat panel
13
+ - Mock AI replies (can replace with your API)
14
+ - Auto-mount, no `init()` needed
15
+ - CDN ready or npm install
16
+ - Fully customizable styling, theme, and position
17
+ - React + ReactDOM bundled for standalone usage
18
18
 
19
19
  ---
20
20
 
21
- ## Demo
21
+ ## 1️⃣ Use via CDN
22
+
23
+ Copy-paste **1 script tag** into your HTML:
22
24
 
23
25
  ```html
24
- <script src="https://cdn.jsdelivr.net/npm/@kvsnguyen/chatbot-widget/dist/widget.global.js"></script>
25
- <script>
26
- ChatbotWidget.init();
27
- </script>
26
+ <!DOCTYPE html>
27
+ <html lang="en">
28
+ <head>
29
+ <meta charset="UTF-8" />
30
+ <title>Chatbot Test</title>
31
+ </head>
32
+ <body>
33
+ Hello world
34
+
35
+ <!-- Chatbot Widget -->
36
+ <script src="https://cdn.jsdelivr.net/npm/@kvsnguyen/chatbot-widget/dist/widget.global.js"></script>
37
+ </body>
38
+ </html>
28
39
  ```
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kvsnguyen/chatbot-widget",
3
- "version": "0.0.6",
3
+ "version": "0.0.8",
4
4
  "type": "module",
5
5
  "main": "dist/widget.global.js",
6
6
  "files": [