@bot-brewers/chat-widget 1.13.0 → 1.14.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.
Files changed (3) hide show
  1. package/README.md +210 -18
  2. package/dist/assistant-widget.js +5045 -2884
  3. package/package.json +1 -1
package/README.md CHANGED
@@ -5,11 +5,24 @@ Zero-code embeddable AI chat widget for any website. Add intelligent support wit
5
5
  ## Quick Start
6
6
 
7
7
  ### CDN (Recommended)
8
+
9
+ **Production (version pinned):**
8
10
  ```html
9
- <script src="https://cdn.jsdelivr.net/gh/ai-enhanced-engineer/chat-widget-dist@latest/dist/assistant-widget.js"></script>
11
+ <script src="https://cdn.jsdelivr.net/gh/ai-enhanced-engineer/chat-widget-dist@1.13.0/dist/assistant-widget.js"></script>
10
12
  <assistant-widget client-id="your-client-id"></assistant-widget>
11
13
  ```
12
14
 
15
+ **Alternative CDN sources:**
16
+ ```html
17
+ <!-- jsDelivr (npm) -->
18
+ <script src="https://cdn.jsdelivr.net/npm/@bot-brewers/chat-widget@1.13.0/dist/assistant-widget.js"></script>
19
+
20
+ <!-- unpkg (npm) -->
21
+ <script src="https://unpkg.com/@bot-brewers/chat-widget@1.13.0/dist/assistant-widget.js"></script>
22
+ ```
23
+
24
+ > **Note:** Pin to a specific version (e.g., `@1.13.0`) to avoid breaking changes. Using `@latest` may point to untagged commits without widget files.
25
+
13
26
  ### npm
14
27
  ```bash
15
28
  npm install @bot-brewers/chat-widget
@@ -21,10 +34,14 @@ import '@bot-brewers/chat-widget';
21
34
 
22
35
  ## Configuration
23
36
 
37
+ ### All Available Attributes
38
+
24
39
  ```html
25
40
  <assistant-widget
26
41
  client-id="your-client-id"
27
42
  title="Chat with us!"
43
+ theme="dark"
44
+ initial-message="Hello! How can I help you today?"
28
45
  position="bottom-right"
29
46
  accent-color="#6366f1">
30
47
  </assistant-widget>
@@ -32,29 +49,204 @@ import '@bot-brewers/chat-widget';
32
49
 
33
50
  | Attribute | Type | Default | Description |
34
51
  |-----------|------|---------|-------------|
35
- | `client-id` | string | **required** | Your unique client ID |
52
+ | `client-id` | string | **required** | Your unique client identifier |
36
53
  | `title` | string | "AI Assistant" | Widget header title |
37
- | `position` | string | "bottom-right" | Widget position: `bottom-right`, `bottom-left` |
38
- | `accent-color` | string | "#6366f1" | Primary widget color |
54
+ | `theme` | string | "light" | Theme mode: `light` or `dark` |
55
+ | `initial-message` | string | - | Custom welcome message shown when widget opens |
56
+ | `position` | string | "bottom-right" | Widget placement: `bottom-right` or `bottom-left` |
57
+ | `accent-color` | string | "#6366f1" | Primary color for widget UI elements |
58
+ | `open` | boolean | false | Programmatically open/close the widget |
59
+
60
+ ### Theme Support
61
+
62
+ The widget automatically adapts to your site's color scheme:
63
+ - **Explicit theme:** Set `theme="dark"` or `theme="light"`
64
+ - **System preference:** Omit `theme` to respect `prefers-color-scheme`
65
+ - **Override:** `data-theme="dark"` takes precedence
66
+
67
+ ## Installation Examples
68
+
69
+ ### Basic Installation
70
+ ```html
71
+ <!DOCTYPE html>
72
+ <html>
73
+ <head>
74
+ <title>My Website</title>
75
+ </head>
76
+ <body>
77
+ <h1>Welcome to my site</h1>
78
+
79
+ <!-- Add widget at end of body -->
80
+ <script src="https://cdn.jsdelivr.net/gh/ai-enhanced-engineer/chat-widget-dist@1.13.0/dist/assistant-widget.js"></script>
81
+ <assistant-widget client-id="my-site"></assistant-widget>
82
+ </body>
83
+ </html>
84
+ ```
85
+
86
+ ### With Dark Theme
87
+ ```html
88
+ <assistant-widget
89
+ client-id="my-site"
90
+ theme="dark"
91
+ title="Support Chat"
92
+ initial-message="Hi! How can we help you today?">
93
+ </assistant-widget>
94
+ ```
95
+
96
+ ### Multiple Pages with Different Messages
97
+ ```html
98
+ <!-- Homepage -->
99
+ <assistant-widget
100
+ client-id="my-site"
101
+ initial-message="Welcome! I'm here to help you navigate our site.">
102
+ </assistant-widget>
103
+
104
+ <!-- Product page -->
105
+ <assistant-widget
106
+ client-id="my-site"
107
+ initial-message="Questions about this product? I'm here to help!">
108
+ </assistant-widget>
109
+
110
+ <!-- Support page -->
111
+ <assistant-widget
112
+ client-id="my-site"
113
+ initial-message="Let me help resolve your issue.">
114
+ </assistant-widget>
115
+ ```
116
+
117
+ ### Custom Styling
118
+ ```html
119
+ <assistant-widget
120
+ client-id="my-site"
121
+ accent-color="#10b981"
122
+ position="bottom-left">
123
+ </assistant-widget>
124
+ ```
125
+
126
+ ## Versions
39
127
 
40
- ## For Maintainers: Manual Release
128
+ ### CDN Support by Version
41
129
 
42
- To manually publish a new version:
130
+ | Version | CDN Support | Status | Notes |
131
+ |---------|-------------|--------|-------|
132
+ | v1.13.0 | ✅ Yes | Latest | Recommended for production |
133
+ | v1.12.0 | ✅ Yes | Stable | |
134
+ | v1.11.0 | ✅ Yes | Stable | |
135
+ | v1.10.0 | ✅ Yes | Stable | |
136
+ | v1.9.0 | ✅ Yes | Stable | |
137
+ | v1.8.0 | ✅ Yes | Stable | |
138
+ | v1.7.2 | ✅ Yes | Stable | First version with artifact-based publishing |
139
+ | v1.7.1 | ✅ Yes | Stable | CDN workflow fixed |
140
+ | v1.7.0 | ❌ No | Broken | Missing widget files in repository |
141
+ | v1.0.1 | ❌ No | Broken | Pre-CDN era |
43
142
 
44
- 1. Go to the [Actions tab](https://github.com/ai-enhanced-engineer/chat-widget-dist/actions)
143
+ ### Choosing a Version
144
+
145
+ **For production:**
146
+ ```html
147
+ <!-- Pin to specific version -->
148
+ <script src="https://cdn.jsdelivr.net/gh/ai-enhanced-engineer/chat-widget-dist@1.13.0/dist/assistant-widget.js"></script>
149
+ ```
150
+
151
+ **For development/testing:**
152
+ ```html
153
+ <!-- Use npm @latest (may have caching delays) -->
154
+ <script src="https://cdn.jsdelivr.net/npm/@bot-brewers/chat-widget@latest/dist/assistant-widget.js"></script>
155
+ ```
156
+
157
+ ### Migration from v1.7.0
158
+
159
+ If you're using v1.7.0 and experiencing 404 errors:
160
+ 1. Update CDN URL to `@1.13.0` or later
161
+ 2. If using self-hosted files, migrate to CDN to get automatic updates
162
+
163
+ ## Troubleshooting
164
+
165
+ ### Widget Not Loading (404 Error)
166
+
167
+ **Symptom:** Browser console shows "Failed to load resource: 404"
168
+
169
+ **Cause:** Using a version without CDN support (v1.7.0 or earlier)
170
+
171
+ **Solution:**
172
+ ```html
173
+ <!-- Change from -->
174
+ <script src="...@1.7.0/dist/assistant-widget.js"></script>
175
+
176
+ <!-- To -->
177
+ <script src="...@1.13.0/dist/assistant-widget.js"></script>
178
+ ```
179
+
180
+ ### Widget Not Visible
181
+
182
+ **Check these:**
183
+ 1. Is `client-id` set correctly?
184
+ 2. Is the script loading? (Check Network tab in DevTools)
185
+ 3. Any console errors? (Check Console tab in DevTools)
186
+ 4. Is the widget hidden by CSS? (Check z-index conflicts)
187
+
188
+ ### Theme Not Applied
189
+
190
+ **Ensure:**
191
+ - Use `theme="dark"` or `theme="light"` (lowercase)
192
+ - Not `data-theme` (unless you want to override)
193
+ - Widget supports both automatic detection and manual theme setting
194
+
195
+ ## For Maintainers
196
+
197
+ ### Automated Release Process
198
+
199
+ Releases are automatically triggered when the main widget repository (`ai-assistant-widget`) publishes a new version:
200
+
201
+ 1. Widget build workflow runs in `ai-assistant-widget`
202
+ 2. Artifacts are uploaded (assistant-widget.js, style.css)
203
+ 3. Publish workflow in this repo is triggered
204
+ 4. Downloads artifacts from source repository
205
+ 5. Commits files to `dist/` directory
206
+ 6. Creates git tag (e.g., v1.13.0)
207
+ 7. Publishes to npm as `@bot-brewers/chat-widget`
208
+ 8. Creates GitHub release
209
+
210
+ ### Manual Release (Emergency)
211
+
212
+ If automated release fails:
213
+
214
+ 1. Go to [Actions tab](https://github.com/ai-enhanced-engineer/chat-widget-dist/actions)
45
215
  2. Select "Publish Release" workflow
46
216
  3. Click "Run workflow"
47
- 4. Fill in the required inputs:
48
- - **Version**: The version to publish (e.g., "1.0.0")
49
- - **Widget URL**: Direct download URL for the widget file from the main repository release
50
- - **Release notes**: Optional description of the release
51
- 5. Click "Run workflow" to start the release process
52
-
53
- The workflow will:
54
- - Download the widget file
55
- - Publish to npm as `@bot-brewers/chat-widget`
56
- - Create a GitHub release
57
- - Update the package version
217
+ 4. Fill in:
218
+ - **Version**: Semantic version (e.g., "1.13.1")
219
+ - **Source Repo**: `ai-enhanced-engineer/ai-assistant-widget`
220
+ - **Run ID**: Build workflow run ID from source repo
221
+ - **Artifact Name**: Name of the uploaded artifact (e.g., "widget-dist-1.13.1")
222
+ - **Release Notes**: Changelog or description
223
+
224
+ ### Verifying a Release
225
+
226
+ After publishing, verify:
227
+ ```bash
228
+ # Check git tag has files
229
+ git ls-tree -r v1.13.0 dist/
230
+
231
+ # Should show:
232
+ # dist/.gitkeep
233
+ # dist/assistant-widget.js
234
+ # dist/style.css
235
+
236
+ # Test CDN URL
237
+ curl -I https://cdn.jsdelivr.net/gh/ai-enhanced-engineer/chat-widget-dist@1.13.0/dist/assistant-widget.js
238
+ # Should return: HTTP 200 OK
239
+
240
+ # Test npm
241
+ npm view @bot-brewers/chat-widget version
242
+ # Should return: 1.13.0
243
+ ```
244
+
245
+ ### CDN Cache Purging
246
+
247
+ jsDelivr caches are automatic, but you can manually purge:
248
+ - GitHub CDN: `https://purge.jsdelivr.net/gh/ai-enhanced-engineer/chat-widget-dist@1.13.0/dist/assistant-widget.js`
249
+ - npm CDN: `https://purge.jsdelivr.net/npm/@bot-brewers/chat-widget@1.13.0/dist/assistant-widget.js`
58
250
 
59
251
  ## Browser Support
60
252