@useknest/widget-react 0.1.0-beta.13 → 0.1.0-beta.14
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 +12 -12
- package/dist/ChatWidget.d.ts +1 -1
- package/dist/ChatWidget.d.ts.map +1 -1
- package/dist/index.js +40 -40
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -34,28 +34,28 @@ function App() {
|
|
|
34
34
|
|
|
35
35
|
### ChatWidget
|
|
36
36
|
|
|
37
|
-
| Prop | Type | Required | Default | Description
|
|
38
|
-
| ------------------- | ---------------------- | -------- | ---------- |
|
|
39
|
-
| `publishableApiKey` | `string` | Yes | - | Your project's publishable API key
|
|
40
|
-
| `mode` | `'inline' \| 'bubble'` | No | `'inline'` | Display mode: inline or floating bubble button
|
|
41
|
-
| `defaultOpen` | `boolean` | No | `false` | Whether the chat starts open (only applies to bubble mode)
|
|
42
|
-
| `user` | `WidgetUser` | No | - | Identifies the logged-in user; requires at least `id` or `email`
|
|
37
|
+
| Prop | Type | Required | Default | Description |
|
|
38
|
+
| ------------------- | ---------------------- | -------- | ---------- | ---------------------------------------------------------------- |
|
|
39
|
+
| `publishableApiKey` | `string` | Yes | - | Your project's publishable API key |
|
|
40
|
+
| `mode` | `'inline' \| 'bubble'` | No | `'inline'` | Display mode: inline or floating bubble button |
|
|
41
|
+
| `defaultOpen` | `boolean` | No | `false` | Whether the chat starts open (only applies to bubble mode) |
|
|
42
|
+
| `user` | `WidgetUser` | No | - | Identifies the logged-in user; requires at least `id` or `email` |
|
|
43
43
|
|
|
44
44
|
#### `WidgetUser`
|
|
45
45
|
|
|
46
46
|
```ts
|
|
47
47
|
interface WidgetUser {
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
48
|
+
id?: string; // Your system's user ID (cross-device dedup key)
|
|
49
|
+
email?: string;
|
|
50
|
+
fullName?: string;
|
|
51
|
+
metadata?: Record<string, unknown>; // Custom attributes (e.g. plan, company)
|
|
52
52
|
}
|
|
53
53
|
```
|
|
54
54
|
|
|
55
55
|
```tsx
|
|
56
56
|
<ChatWidget
|
|
57
|
-
|
|
58
|
-
|
|
57
|
+
publishableApiKey="pk_..."
|
|
58
|
+
user={{ id: currentUser.id, email: currentUser.email, fullName: currentUser.name }}
|
|
59
59
|
/>
|
|
60
60
|
```
|
|
61
61
|
|
package/dist/ChatWidget.d.ts
CHANGED
|
@@ -3,7 +3,7 @@ import { WidgetMode, WidgetUser } from '@useknest/widget-core';
|
|
|
3
3
|
export interface InternalConfig {
|
|
4
4
|
baseUrl?: string;
|
|
5
5
|
supabaseUrl?: string;
|
|
6
|
-
|
|
6
|
+
supabasePublishableKey?: string;
|
|
7
7
|
}
|
|
8
8
|
export interface ChatWidgetProps {
|
|
9
9
|
publishableApiKey: string;
|
package/dist/ChatWidget.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChatWidget.d.ts","sourceRoot":"","sources":["../src/ChatWidget.tsx"],"names":[],"mappings":"AAuBA,OAAO,KAAK,EAMX,UAAU,EACV,UAAU,EACV,MAAM,uBAAuB,CAAC;AAK/B,4EAA4E;AAC5E,MAAM,WAAW,cAAc;IAC9B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,
|
|
1
|
+
{"version":3,"file":"ChatWidget.d.ts","sourceRoot":"","sources":["../src/ChatWidget.tsx"],"names":[],"mappings":"AAuBA,OAAO,KAAK,EAMX,UAAU,EACV,UAAU,EACV,MAAM,uBAAuB,CAAC;AAK/B,4EAA4E;AAC5E,MAAM,WAAW,cAAc;IAC9B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,sBAAsB,CAAC,EAAE,MAAM,CAAC;CAChC;AAED,MAAM,WAAW,eAAe;IAC/B,iBAAiB,EAAE,MAAM,CAAC;IAC1B,qGAAqG;IACrG,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,uEAAuE;IACvE,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,+FAA+F;IAC/F,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,4EAA4E;IAC5E,SAAS,CAAC,EAAE,cAAc,CAAC;CAC3B;AAED,wBAAgB,UAAU,CAAC,EAC1B,iBAAiB,EACjB,IAAe,EACf,WAAmB,EACnB,IAAI,EACJ,SAAS,EACT,EAAE,eAAe,2CA2iBjB"}
|
package/dist/index.js
CHANGED
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode(".knest-chat-card{display:flex;flex-direction:column;height:100%;background:#fff;color:#374151;border-radius:1rem;box-shadow:0 10px 15px -3px #0000001a;overflow:hidden;font-family:system-ui,-apple-system,sans-serif}.knest-loading-container{display:flex;align-items:center;justify-content:center;height:100%;background:linear-gradient(135deg,#fdfbf7,#fff)}.knest-loading-content{display:flex;flex-direction:column;align-items:center;gap:1.5rem}.knest-spinner-ring{width:3rem;height:3rem;border:3px solid #f3f4f6;border-top-color:#3b82f6;border-radius:50%;animation:knest-spin .8s linear infinite}@keyframes knest-spin{to{transform:rotate(360deg)}}.knest-loading-text{font-size:.875rem;font-weight:500;color:#6b7280;margin:0}.knest-error-container{display:flex;align-items:center;justify-content:center;height:100%;background:linear-gradient(135deg,#fef2f2,#fff);padding:2rem}.knest-error-content{text-align:center;max-width:300px}.knest-error-text{font-size:.875rem;color:#991b1b;margin:0;line-height:1.5}.knest-header{border-bottom:1px solid #f3f4f6;padding:1rem}.knest-header-content{display:flex;align-items:center;gap:.75rem}.knest-avatar-img{width:2rem;height:2rem;object-fit:cover;border-radius:.25rem}.knest-header h2{font-size:1.125rem;font-weight:600;color:#111827;margin:0 0 .25rem}.knest-badge{display:inline-block;padding:.25rem .5rem;border-radius:9999px;font-size:.75rem;font-weight:500;color:#fff}.knest-messages-container{flex:1;overflow-y:auto}.knest-separator{margin:0 1.5rem;border-bottom:1px solid #e5e7eb}.knest-message-wrapper{display:flex;flex-direction:column}.knest-message{display:flex;gap:1rem;padding:1.25rem 1.5rem;align-items:center}.knest-message-avatar{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;flex-shrink:0}.knest-message-avatar .knest-avatar-img{width:100%;height:100%;border-radius:.25rem;object-fit:cover}.knest-user-avatar{width:2rem;height:2rem;border-radius:.25rem;display:flex;align-items:center;justify-content:center;color:#fff;font-size:.875rem;font-weight:500}.knest-message-content{flex:1;min-width:0}.knest-message-content p{margin:0 0 .5rem;font-size:.875rem;line-height:1.625;color:inherit;word-wrap:break-word}.knest-message-content p:last-child{margin-bottom:0}.knest-message-content code{background-color:#f3f4f6;padding:.125rem .375rem;border-radius:.25rem;font-family:ui-monospace,monospace;font-size:.8125rem;color:#ef4444}.knest-message-content pre{background-color:#1f2937;color:#f9fafb;padding:12px;border-radius:6px;overflow-x:auto;margin:8px 0}.knest-message-content pre code{background-color:transparent;padding:0;color:inherit;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.8125rem;line-height:1.5}.knest-message-content .token.keyword,.knest-message-content .token.builtin,.knest-message-content .token.tag{color:#ff7b72}.knest-message-content .token.string,.knest-message-content .token.attr-value{color:#a5d6ff}.knest-message-content .token.number,.knest-message-content .token.boolean{color:#79c0ff}.knest-message-content .token.function,.knest-message-content .token.class-name{color:#d2a8ff}.knest-message-content .token.comment{color:#8b949e;font-style:italic}.knest-message-content .token.variable,.knest-message-content .token.property{color:#ffa657}.knest-message-content .token.operator,.knest-message-content .token.punctuation{color:#c9d1d9}.knest-message-content a{color:inherit;text-decoration:underline}.knest-message-content ul,.knest-message-content ol{margin:8px 0;padding-left:24px}.knest-message-content li{margin:4px 0;color:inherit}.knest-message-content strong{font-weight:600;color:inherit}.knest-message-content em{font-style:italic}.knest-loading{display:flex;gap:.25rem;align-items:center}.knest-dot{width:.5rem;height:.5rem;background:#9ca3af;border-radius:50%;animation:knest-bounce 1.4s infinite ease-in-out both}.knest-dot:nth-child(2){animation-delay:.16s}.knest-dot:nth-child(3){animation-delay:.32s}@keyframes knest-bounce{0%,80%,to{transform:scale(0)}40%{transform:scale(1)}}.knest-sources{margin-top:.75rem}.knest-sources-label{font-size:.75rem;font-weight:500;color:#6b7280;margin-bottom:.5rem}.knest-source-item{display:flex;gap:.5rem;padding:.5rem .75rem;margin-bottom:.25rem;border:1px solid #e5e7eb;border-radius:.375rem;background:#f9fafb;text-decoration:none;transition:all .15s}.knest-source-item:hover{border-color:#d1d5db;background:#f3f4f6}.knest-source-icon{width:1rem;height:1rem;color:#6b7280;flex-shrink:0}.knest-source-text{flex:1;min-width:0}.knest-source-breadcrumb{font-size:.75rem;color:#6b7280;margin-bottom:.125rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.knest-source-title{font-size:.875rem;font-weight:500;color:#374151;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.knest-examples{border-top:1px solid #e5e7eb;padding:1.25rem 1.5rem}.knest-examples h3{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:#6b7280;margin:0 0 1rem}.knest-example-btn{width:100%;padding:.75rem;margin-bottom:.75rem;border:1px solid #e5e7eb;border-radius:.5rem;background:#fff;text-align:left;font-size:.875rem;color:#374151;cursor:pointer;transition:background .15s}.knest-example-btn:hover{background:#f9fafb}.knest-input-section{border-top:1px solid #f3f4f6;padding:1rem}.knest-input-wrapper{display:flex;align-items:center;gap:.5rem}.knest-input-field{flex:1;padding:.75rem 1rem;border:1px solid #e5e7eb;border-radius:.5rem;background:#f9fafb;font-size:.875rem;color:#374151;outline:none}.knest-input-field:focus{background:#fff;border-color:#d1d5db}.knest-input-field:disabled{opacity:.5}.knest-attach-btn{width:2.5rem;height:2.5rem;display:flex;align-items:center;justify-content:center;border:none;border-radius:.5rem;background:#e5e7eb;color:#6b7280;cursor:pointer;transition:background .15s;flex-shrink:0}.knest-attach-btn:hover:not(:disabled){background:#d1d5db}.knest-attach-btn:disabled{opacity:.4;cursor:not-allowed}.knest-attach-icon{width:1rem;height:1rem}.knest-file-preview{display:flex;flex-wrap:wrap;gap:.375rem;margin-bottom:.5rem}.knest-file-chip{display:inline-flex;align-items:center;gap:.25rem;padding:.25rem .5rem;background:#f3f4f6;border:1px solid #e5e7eb;border-radius:9999px;font-size:.75rem;color:#374151;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.knest-chip-remove{background:none;border:none;padding:0;font-size:1rem;line-height:1;color:#9ca3af;cursor:pointer;flex-shrink:0}.knest-chip-remove:hover{color:#374151}.knest-attach-error{font-size:.75rem;color:#dc2626;margin:0 0 .375rem}.knest-send-btn{width:2.5rem;height:2.5rem;display:flex;align-items:center;justify-content:center;border:none;border-radius:.5rem;background:#e5e7eb;color:#6b7280;cursor:pointer;transition:background .15s}.knest-send-btn:hover:not(:disabled){background:#d1d5db}.knest-send-btn:disabled{opacity:.5;cursor:not-allowed}.knest-send-icon{width:1rem;height:1rem}.knest-attachments{display:flex;flex-direction:column;gap:.5rem;margin-top:.5rem}.knest-attachment-image-link{display:inline-block}.knest-attachment-image{max-width:240px;border-radius:.5rem;display:block}.knest-attachment-file{display:inline-flex;align-items:center;gap:.375rem;padding:.375rem .625rem;border:1px solid #e5e7eb;border-radius:9999px;background:#f9fafb;text-decoration:none;font-size:.8125rem;color:#374151;transition:background .15s}.knest-attachment-file:hover:not(.knest-attachment-disabled){background:#f3f4f6}.knest-attachment-disabled{opacity:.5;pointer-events:none}.knest-attachment-file-icon{width:.875rem;height:.875rem;color:#6b7280;flex-shrink:0}.knest-attachment-file-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:160px}.knest-attachment-file-size{color:#9ca3af;flex-shrink:0}.knest-reset-row{display:flex;justify-content:center;margin-top:.5rem}.knest-reset-btn{background:none;border:none;padding:0;font-size:.75rem;color:#9ca3af;cursor:pointer;transition:color .15s}.knest-reset-btn:hover{color:#6b7280}.knest-footer{margin-top:.75rem;display:flex;justify-content:center}.knest-powered-by{display:flex;align-items:center;gap:.125rem;font-size:.75rem;color:#6b7280;text-decoration:none;transition:color .15s}.knest-powered-by:hover{color:#374151;text-decoration:underline}.knest-bubble-container{position:fixed;bottom:24px;right:24px;z-index:9999;display:flex;flex-direction:column;align-items:flex-end;gap:16px;font-family:system-ui,-apple-system,sans-serif}.knest-bubble-button{width:56px;height:56px;border-radius:50%;border:none;color:#fff;cursor:pointer;box-shadow:0 4px 12px #00000026;display:flex;align-items:center;justify-content:center;transition:transform .2s,box-shadow .2s}.knest-bubble-button:hover{transform:scale(1.05);box-shadow:0 6px 16px #0003}.knest-bubble-spinner{animation:knest-spin 1s linear infinite}.knest-bubble-panel{width:380px;height:520px;max-width:calc(100vw - 48px);max-height:calc(100vh - 100px);border-radius:1rem;border:1px solid rgba(0,0,0,.1);box-shadow:0 10px 15px -3px #0000001a;overflow:hidden}.knest-bubble-panel .knest-chat-card{height:100%}@media (max-width: 440px){.knest-bubble-container{bottom:16px;right:16px}.knest-bubble-panel{width:calc(100vw - 32px);height:calc(100vh - 100px)}}")),document.head.appendChild(e)}}catch(t){console.error("vite-plugin-css-injected-by-js",t)}})();
|
|
2
2
|
import { jsx as e, jsxs as l } from "react/jsx-runtime";
|
|
3
|
-
import { useState as d, useEffect as
|
|
4
|
-
import { fetchSignedUrl as oe, formatContent as le, DEFAULT_BRAND_COLOR as q, isImageType as ce, formatFileSize as ie, DEFAULT_AVATAR_URL as de, DEFAULT_EXAMPLE_QUESTIONS as he, initWidgetSentry as X, PUBLIC_SUPABASE_URL as ue,
|
|
5
|
-
function
|
|
3
|
+
import { useState as d, useEffect as M, useRef as V } from "react";
|
|
4
|
+
import { fetchSignedUrl as oe, formatContent as le, DEFAULT_BRAND_COLOR as q, isImageType as ce, formatFileSize as ie, DEFAULT_AVATAR_URL as de, DEFAULT_EXAMPLE_QUESTIONS as he, initWidgetSentry as X, PUBLIC_SUPABASE_URL as ue, PUBLIC_SUPABASE_PUBLISHABLE_KEY as me, initWidgetAuth as fe, saveChatStateDebounced as ke, subscribeToThread as ge, AUTH_ERROR_MESSAGE as ve, ACCEPTED_FILE_TYPES_STRING as pe, fetchWidgetConfig as Ce, loadChatState as be, DEFAULT_WELCOME_MESSAGE as Y, validateAttachment as Ne, MAX_ATTACHMENTS_PER_MESSAGE as Ee, uploadAttachment as Le, captureWidgetException as $, streamChatMessage as we, clearChatState as Ue } from "@useknest/widget-core";
|
|
5
|
+
function Me({
|
|
6
6
|
message: r,
|
|
7
7
|
isLoading: T = !1,
|
|
8
8
|
avatarUrl: W = "/default-avatar.svg",
|
|
@@ -11,11 +11,11 @@ function Ue({
|
|
|
11
11
|
publishableApiKey: p,
|
|
12
12
|
baseUrl: w
|
|
13
13
|
}) {
|
|
14
|
-
const [C, x] = d(!1), [
|
|
15
|
-
|
|
14
|
+
const [C, x] = d(!1), [S, B] = d({});
|
|
15
|
+
M(() => {
|
|
16
16
|
if (!r.attachments?.length || !p) return;
|
|
17
17
|
const n = r.attachments.filter(
|
|
18
|
-
(o) => o.storagePath && !o.url && !
|
|
18
|
+
(o) => o.storagePath && !o.url && !S[o.storagePath]
|
|
19
19
|
);
|
|
20
20
|
n.length !== 0 && Promise.all(
|
|
21
21
|
n.map(async (o) => {
|
|
@@ -30,10 +30,10 @@ function Ue({
|
|
|
30
30
|
const c = {};
|
|
31
31
|
for (const { storagePath: k, url: L } of o)
|
|
32
32
|
L && (c[k] = L);
|
|
33
|
-
Object.keys(c).length > 0 &&
|
|
33
|
+
Object.keys(c).length > 0 && B((k) => ({ ...k, ...c }));
|
|
34
34
|
});
|
|
35
35
|
}, [r.attachments, p, w]);
|
|
36
|
-
const E = (n) => n.url || (n.storagePath ?
|
|
36
|
+
const E = (n) => n.url || (n.storagePath ? S[n.storagePath] : void 0), _ = () => x(!0), u = r.content ? le(r.content) : "";
|
|
37
37
|
return /* @__PURE__ */ e("div", { className: "knest-message-wrapper", children: /* @__PURE__ */ l("div", { className: "knest-message", children: [
|
|
38
38
|
f && /* @__PURE__ */ e("div", { className: "knest-message-avatar", children: r.role === "assistant" ? C ? /* @__PURE__ */ e("div", { className: "knest-user-avatar", style: { backgroundColor: y }, children: "AI" }) : /* @__PURE__ */ e(
|
|
39
39
|
"img",
|
|
@@ -41,7 +41,7 @@ function Ue({
|
|
|
41
41
|
src: W,
|
|
42
42
|
alt: "Avatar",
|
|
43
43
|
className: "knest-avatar-img",
|
|
44
|
-
onError:
|
|
44
|
+
onError: _
|
|
45
45
|
}
|
|
46
46
|
) : /* @__PURE__ */ e("div", { className: "knest-user-avatar", style: { backgroundColor: y }, children: "U" }) }),
|
|
47
47
|
/* @__PURE__ */ l("div", { className: "knest-message-content", children: [
|
|
@@ -135,17 +135,17 @@ function Ue({
|
|
|
135
135
|
] })
|
|
136
136
|
] }) });
|
|
137
137
|
}
|
|
138
|
-
function
|
|
138
|
+
function Ae({
|
|
139
139
|
publishableApiKey: r,
|
|
140
140
|
mode: T = "inline",
|
|
141
141
|
defaultOpen: W = !1,
|
|
142
142
|
user: y,
|
|
143
143
|
_internal: f
|
|
144
144
|
}) {
|
|
145
|
-
const [p, w] = d(null), [C, x] = d(!0), [
|
|
146
|
-
|
|
145
|
+
const [p, w] = d(null), [C, x] = d(!0), [S, B] = d(null), [E, _] = d(!1), [u, n] = d([]), [o, c] = d(""), [k, L] = d(!1), [h, R] = d(void 0), [A, J] = d(W), [I, P] = d([]), [j, D] = d(!1), [H, U] = d(null), F = V(null), G = V(null), Z = p?.avatarUrl || de, K = p?.exampleQuestions || he, O = p?.brandColor || q;
|
|
146
|
+
M(() => {
|
|
147
147
|
typeof requestIdleCallback < "u" ? requestIdleCallback(() => X()) : setTimeout(() => X(), 0);
|
|
148
|
-
const t = f?.supabaseUrl || ue, s = f?.
|
|
148
|
+
const t = f?.supabaseUrl || ue, s = f?.supabasePublishableKey || me, m = fe(t, s);
|
|
149
149
|
(async () => {
|
|
150
150
|
const g = await Ce(
|
|
151
151
|
r,
|
|
@@ -155,7 +155,7 @@ function Se({
|
|
|
155
155
|
}
|
|
156
156
|
);
|
|
157
157
|
if (g.error) {
|
|
158
|
-
|
|
158
|
+
B(g.error), x(!1);
|
|
159
159
|
return;
|
|
160
160
|
}
|
|
161
161
|
w(g.config), x(!1);
|
|
@@ -167,18 +167,18 @@ function Se({
|
|
|
167
167
|
}
|
|
168
168
|
]);
|
|
169
169
|
const a = await m;
|
|
170
|
-
a || console.warn("Widget auth initialization failed"),
|
|
170
|
+
a || console.warn("Widget auth initialization failed"), _(a);
|
|
171
171
|
})();
|
|
172
|
-
}, [r, f]),
|
|
173
|
-
u.length > 0 &&
|
|
174
|
-
}, [u]),
|
|
172
|
+
}, [r, f]), M(() => {
|
|
173
|
+
u.length > 0 && F.current && F.current.scrollIntoView({ behavior: "smooth" });
|
|
174
|
+
}, [u]), M(() => {
|
|
175
175
|
u.length <= 1 && !o || ke(r, {
|
|
176
176
|
threadId: h,
|
|
177
177
|
messages: u,
|
|
178
178
|
input: o,
|
|
179
179
|
savedAt: Date.now()
|
|
180
180
|
});
|
|
181
|
-
}, [u, h, o, r]),
|
|
181
|
+
}, [u, h, o, r]), M(() => !h || !E ? void 0 : ge(h, (s) => {
|
|
182
182
|
if (s.role !== "human") return;
|
|
183
183
|
const m = s.metadata?.attachments ?? [];
|
|
184
184
|
n(
|
|
@@ -195,11 +195,11 @@ function Se({
|
|
|
195
195
|
}), [h, E]);
|
|
196
196
|
const ee = (t) => {
|
|
197
197
|
const s = Array.from(t.target.files || []);
|
|
198
|
-
t.target.value = "",
|
|
198
|
+
t.target.value = "", U(null);
|
|
199
199
|
for (const m of s) {
|
|
200
200
|
const i = Ne(m);
|
|
201
201
|
if (i) {
|
|
202
|
-
|
|
202
|
+
U(i);
|
|
203
203
|
return;
|
|
204
204
|
}
|
|
205
205
|
}
|
|
@@ -212,7 +212,7 @@ function Se({
|
|
|
212
212
|
}, z = async () => {
|
|
213
213
|
if (!o.trim() || k || !E) return;
|
|
214
214
|
const t = o.trim();
|
|
215
|
-
c(""), L(!0),
|
|
215
|
+
c(""), L(!0), U(null);
|
|
216
216
|
let s = [];
|
|
217
217
|
if (I.length > 0 && h) {
|
|
218
218
|
D(!0);
|
|
@@ -231,7 +231,7 @@ function Se({
|
|
|
231
231
|
$(a instanceof Error ? a.message : "Upload failed", {
|
|
232
232
|
threadId: h,
|
|
233
233
|
baseUrl: f?.baseUrl
|
|
234
|
-
}),
|
|
234
|
+
}), U(a instanceof Error ? a.message : "Upload failed."), L(!1), D(!1);
|
|
235
235
|
return;
|
|
236
236
|
}
|
|
237
237
|
D(!1), P([]);
|
|
@@ -292,9 +292,9 @@ function Se({
|
|
|
292
292
|
}
|
|
293
293
|
}), L(!1);
|
|
294
294
|
}, ne = () => {
|
|
295
|
-
|
|
295
|
+
Ue(r), R(void 0), n([
|
|
296
296
|
{ role: "assistant", content: p?.welcomeMessage || Y }
|
|
297
|
-
]), c(""), P([]),
|
|
297
|
+
]), c(""), P([]), U(null);
|
|
298
298
|
}, se = (t) => {
|
|
299
299
|
t.key === "Enter" && !t.shiftKey && (t.preventDefault(), z());
|
|
300
300
|
}, re = async (t) => {
|
|
@@ -302,16 +302,16 @@ function Se({
|
|
|
302
302
|
}, Q = C ? /* @__PURE__ */ e("div", { className: "knest-chat-card", children: /* @__PURE__ */ e("div", { className: "knest-loading-container", children: /* @__PURE__ */ l("div", { className: "knest-loading-content", children: [
|
|
303
303
|
/* @__PURE__ */ e("div", { className: "knest-spinner-ring" }),
|
|
304
304
|
/* @__PURE__ */ e("p", { className: "knest-loading-text", children: "Loading chat..." })
|
|
305
|
-
] }) }) }) :
|
|
305
|
+
] }) }) }) : S === "auth" ? /* @__PURE__ */ e("div", { className: "knest-chat-card", children: /* @__PURE__ */ e("div", { className: "knest-error-container", children: /* @__PURE__ */ e("div", { className: "knest-error-content", children: /* @__PURE__ */ e("p", { className: "knest-error-text", children: ve }) }) }) }) : /* @__PURE__ */ l("div", { className: "knest-chat-card", children: [
|
|
306
306
|
/* @__PURE__ */ l("div", { className: "knest-messages-container", children: [
|
|
307
307
|
u.map((t, s) => /* @__PURE__ */ l("div", { children: [
|
|
308
308
|
/* @__PURE__ */ e(
|
|
309
|
-
|
|
309
|
+
Me,
|
|
310
310
|
{
|
|
311
311
|
message: t,
|
|
312
312
|
isLoading: !t.content && k && t.role === "assistant",
|
|
313
313
|
avatarUrl: Z,
|
|
314
|
-
brandColor:
|
|
314
|
+
brandColor: O,
|
|
315
315
|
publishableApiKey: r,
|
|
316
316
|
baseUrl: f?.baseUrl
|
|
317
317
|
}
|
|
@@ -325,19 +325,19 @@ function Se({
|
|
|
325
325
|
{
|
|
326
326
|
onClick: () => re(t),
|
|
327
327
|
className: "knest-example-btn",
|
|
328
|
-
style: s === 0 ? { borderColor:
|
|
328
|
+
style: s === 0 ? { borderColor: O, borderWidth: "2px" } : {},
|
|
329
329
|
children: t
|
|
330
330
|
},
|
|
331
331
|
s
|
|
332
332
|
))
|
|
333
333
|
] }),
|
|
334
|
-
/* @__PURE__ */ e("div", { ref:
|
|
334
|
+
/* @__PURE__ */ e("div", { ref: F })
|
|
335
335
|
] }),
|
|
336
336
|
/* @__PURE__ */ l("div", { className: "knest-input-section", children: [
|
|
337
337
|
/* @__PURE__ */ e(
|
|
338
338
|
"input",
|
|
339
339
|
{
|
|
340
|
-
ref:
|
|
340
|
+
ref: G,
|
|
341
341
|
type: "file",
|
|
342
342
|
accept: pe,
|
|
343
343
|
multiple: !0,
|
|
@@ -358,7 +358,7 @@ function Se({
|
|
|
358
358
|
}
|
|
359
359
|
)
|
|
360
360
|
] }, s)) }),
|
|
361
|
-
|
|
361
|
+
H && /* @__PURE__ */ e("p", { className: "knest-attach-error", children: H }),
|
|
362
362
|
/* @__PURE__ */ l("div", { className: "knest-input-wrapper", children: [
|
|
363
363
|
/* @__PURE__ */ e(
|
|
364
364
|
"input",
|
|
@@ -375,7 +375,7 @@ function Se({
|
|
|
375
375
|
/* @__PURE__ */ e(
|
|
376
376
|
"button",
|
|
377
377
|
{
|
|
378
|
-
onClick: () =>
|
|
378
|
+
onClick: () => G.current?.click(),
|
|
379
379
|
disabled: !h || k || j,
|
|
380
380
|
className: "knest-attach-btn",
|
|
381
381
|
type: "button",
|
|
@@ -499,15 +499,15 @@ function Se({
|
|
|
499
499
|
] });
|
|
500
500
|
if (T === "inline")
|
|
501
501
|
return Q;
|
|
502
|
-
const ae = C ? "#9ca3af" :
|
|
502
|
+
const ae = C ? "#9ca3af" : O;
|
|
503
503
|
return /* @__PURE__ */ l("div", { className: "knest-bubble-container", children: [
|
|
504
|
-
|
|
504
|
+
A && /* @__PURE__ */ e("div", { className: "knest-bubble-panel", children: Q }),
|
|
505
505
|
/* @__PURE__ */ e(
|
|
506
506
|
"button",
|
|
507
507
|
{
|
|
508
508
|
className: ["knest-bubble-button", C && "knest-bubble-loading"].filter(Boolean).join(" "),
|
|
509
|
-
onClick: () => J(!
|
|
510
|
-
"aria-label": C ? "Loading chat" :
|
|
509
|
+
onClick: () => J(!A),
|
|
510
|
+
"aria-label": C ? "Loading chat" : A ? "Close chat" : "Open chat",
|
|
511
511
|
style: { backgroundColor: ae },
|
|
512
512
|
children: C ? /* @__PURE__ */ l(
|
|
513
513
|
"svg",
|
|
@@ -542,7 +542,7 @@ function Se({
|
|
|
542
542
|
)
|
|
543
543
|
]
|
|
544
544
|
}
|
|
545
|
-
) :
|
|
545
|
+
) : A ? /* @__PURE__ */ e(
|
|
546
546
|
"svg",
|
|
547
547
|
{
|
|
548
548
|
width: "24",
|
|
@@ -577,6 +577,6 @@ function Se({
|
|
|
577
577
|
] });
|
|
578
578
|
}
|
|
579
579
|
export {
|
|
580
|
-
|
|
581
|
-
|
|
580
|
+
Me as ChatMessage,
|
|
581
|
+
Ae as ChatWidget
|
|
582
582
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@useknest/widget-react",
|
|
3
|
-
"version": "0.1.0-beta.
|
|
3
|
+
"version": "0.1.0-beta.14",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "Native React component for Knest chat widget",
|
|
6
6
|
"files": [
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
"react-dom": "^18.0.0 || ^19.0.0"
|
|
23
23
|
},
|
|
24
24
|
"dependencies": {
|
|
25
|
-
"@useknest/widget-core": "0.1.0-beta.
|
|
25
|
+
"@useknest/widget-core": "0.1.0-beta.14"
|
|
26
26
|
},
|
|
27
27
|
"devDependencies": {
|
|
28
28
|
"@types/react": "^18.3.3",
|