@mobil80-dev/chatbot-widget 1.0.7 β 1.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.
- package/README.md +3 -3
- package/index.js +19 -27
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
|
|
1
|
+
## π€Chatbot
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
A lightweight JavaScript chatbot widget powered by VaultChat, designed to be embedded into any website without iframes or frameworks.
|
|
4
4
|
|
|
5
5
|
## β¨ Features
|
|
6
6
|
|
|
@@ -30,7 +30,7 @@ npm install @mobil80-dev/chatbot-widget
|
|
|
30
30
|
```
|
|
31
31
|
|
|
32
32
|
## 𧩠Vue
|
|
33
|
-
|
|
33
|
+
### π Usage (Vue 3)
|
|
34
34
|
```
|
|
35
35
|
import { onMounted } from 'vue'
|
|
36
36
|
import VaultChat from '@mobil80-dev/chatbot-widget'
|
package/index.js
CHANGED
|
@@ -1,10 +1,5 @@
|
|
|
1
1
|
const VaultChat = {
|
|
2
|
-
init (config) {
|
|
3
|
-
// if (!config || !config.apiKey) {
|
|
4
|
-
// console.error('VaultChat: apiKey is required')
|
|
5
|
-
// return
|
|
6
|
-
// }
|
|
7
|
-
|
|
2
|
+
init (config = {}) {
|
|
8
3
|
const button = document.createElement('div')
|
|
9
4
|
button.innerHTML = 'π¬'
|
|
10
5
|
|
|
@@ -27,33 +22,22 @@ const VaultChat = {
|
|
|
27
22
|
|
|
28
23
|
const card = document.createElement('div')
|
|
29
24
|
card.innerHTML = `
|
|
30
|
-
|
|
31
|
-
<div style="padding:12px;font-weight:bold;border-bottom:1px solid #eee">
|
|
25
|
+
<div style="padding:12px;border-bottom:1px solid #eee">
|
|
32
26
|
<div style="
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
</div>
|
|
27
|
+
text-align:left;
|
|
28
|
+
font-size:14px;
|
|
29
|
+
color:#94a3b8;
|
|
30
|
+
user-select:none;
|
|
31
|
+
opacity:0.8">
|
|
32
|
+
Powered by <strong>VaultChat</strong>
|
|
33
|
+
</div>
|
|
41
34
|
</div>
|
|
42
|
-
|
|
43
35
|
|
|
44
36
|
<div id="vc-messages" style="
|
|
45
37
|
flex:1;
|
|
46
38
|
padding:12px;
|
|
47
39
|
overflow-y:auto;
|
|
48
40
|
background:#f8fafc">
|
|
49
|
-
<div style="
|
|
50
|
-
background:#e5e7eb;
|
|
51
|
-
padding:8px 12px;
|
|
52
|
-
border-radius:12px;
|
|
53
|
-
max-width:80%;
|
|
54
|
-
margin-bottom:8px">
|
|
55
|
-
Hi! How can I help you?
|
|
56
|
-
</div>
|
|
57
41
|
</div>
|
|
58
42
|
|
|
59
43
|
<div style="display:flex;padding:10px;border-top:1px solid #eee">
|
|
@@ -64,7 +48,8 @@ const VaultChat = {
|
|
|
64
48
|
flex:1;
|
|
65
49
|
padding:10px;
|
|
66
50
|
border-radius:8px;
|
|
67
|
-
border:1px solid #ccc
|
|
51
|
+
border:1px solid #ccc;
|
|
52
|
+
outline:none"
|
|
68
53
|
/>
|
|
69
54
|
<button id="vc-send" style="
|
|
70
55
|
margin-left:8px;
|
|
@@ -140,6 +125,12 @@ const VaultChat = {
|
|
|
140
125
|
addUserMessage(text)
|
|
141
126
|
input.value = ''
|
|
142
127
|
|
|
128
|
+
// β
apiKey not configured β internal message only
|
|
129
|
+
if (!config.apiKey) {
|
|
130
|
+
addBotMessage('β οΈ API key not configured. Please add apiKey in VaultChat.init()')
|
|
131
|
+
return
|
|
132
|
+
}
|
|
133
|
+
|
|
143
134
|
try {
|
|
144
135
|
const res = await fetch('https://api.vaultchat.io/askChatbot', {
|
|
145
136
|
method: 'POST',
|
|
@@ -152,7 +143,8 @@ const VaultChat = {
|
|
|
152
143
|
|
|
153
144
|
const data = await res.json()
|
|
154
145
|
const reply =
|
|
155
|
-
data?.data?.blocks?.map(b => b.text).join('\n') ||
|
|
146
|
+
data?.data?.blocks?.map(b => b.text).join('\n') ||
|
|
147
|
+
'No response received'
|
|
156
148
|
|
|
157
149
|
addBotMessage(reply)
|
|
158
150
|
} catch {
|