@useknest/widget-react 0.1.0-beta.6 → 0.1.0-beta.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/dist/ChatMessage.d.ts.map +1 -1
- package/dist/ChatWidget.d.ts +9 -3
- package/dist/ChatWidget.d.ts.map +1 -1
- package/dist/index.js +148 -109
- package/package.json +2 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChatMessage.d.ts","sourceRoot":"","sources":["../src/ChatMessage.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAGrD,MAAM,WAAW,gBAAgB;IAChC,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,wBAAgB,WAAW,CAAC,EAC3B,OAAO,EACP,SAAiB,EACjB,SAAiC,EACjC,
|
|
1
|
+
{"version":3,"file":"ChatMessage.d.ts","sourceRoot":"","sources":["../src/ChatMessage.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAGrD,MAAM,WAAW,gBAAgB;IAChC,OAAO,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,wBAAgB,WAAW,CAAC,EAC3B,OAAO,EACP,SAAiB,EACjB,SAAiC,EACjC,UAAgC,EAChC,UAAiB,EACjB,EAAE,gBAAgB,2CAkFlB"}
|
package/dist/ChatWidget.d.ts
CHANGED
|
@@ -1,12 +1,18 @@
|
|
|
1
1
|
import { WidgetMode } from '@useknest/widget-core';
|
|
2
|
+
/** Internal config for testing/development - not part of the public API. */
|
|
3
|
+
export interface InternalConfig {
|
|
4
|
+
baseUrl?: string;
|
|
5
|
+
supabaseUrl?: string;
|
|
6
|
+
supabaseAnonKey?: string;
|
|
7
|
+
}
|
|
2
8
|
export interface ChatWidgetProps {
|
|
3
9
|
publishableApiKey: string;
|
|
4
|
-
/** Base URL for the API. Defaults to https://useknest.com. Pass empty string for relative paths. */
|
|
5
|
-
baseUrl?: string;
|
|
6
10
|
/** Display mode: 'inline' renders in place, 'bubble' shows floating button. Defaults to 'inline'. */
|
|
7
11
|
mode?: WidgetMode;
|
|
8
12
|
/** Whether to auto-open the chat in bubble mode. Defaults to false. */
|
|
9
13
|
defaultOpen?: boolean;
|
|
14
|
+
/** Internal config for testing/development - not part of the public API. */
|
|
15
|
+
_internal?: InternalConfig;
|
|
10
16
|
}
|
|
11
|
-
export declare function ChatWidget({ publishableApiKey,
|
|
17
|
+
export declare function ChatWidget({ publishableApiKey, mode, defaultOpen, _internal }: ChatWidgetProps): import("react/jsx-runtime").JSX.Element;
|
|
12
18
|
//# sourceMappingURL=ChatWidget.d.ts.map
|
package/dist/ChatWidget.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChatWidget.d.ts","sourceRoot":"","sources":["../src/ChatWidget.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ChatWidget.d.ts","sourceRoot":"","sources":["../src/ChatWidget.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAK,EAKX,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,eAAe,CAAC,EAAE,MAAM,CAAC;CACzB;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,4EAA4E;IAC5E,SAAS,CAAC,EAAE,cAAc,CAAC;CAC3B;AAED,wBAAgB,UAAU,CAAC,EAC1B,iBAAiB,EACjB,IAAe,EACf,WAAmB,EACnB,SAAS,EACT,EAAE,eAAe,2CA+WjB"}
|
package/dist/index.js
CHANGED
|
@@ -1,19 +1,19 @@
|
|
|
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;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:#
|
|
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:flex-start}.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-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-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 s } from "react/jsx-runtime";
|
|
3
|
-
import { useState as
|
|
4
|
-
import { formatContent as
|
|
5
|
-
function
|
|
3
|
+
import { useState as l, useRef as z, useEffect as B } from "react";
|
|
4
|
+
import { formatContent as G, DEFAULT_BRAND_COLOR as R, DEFAULT_AVATAR_URL as H, DEFAULT_EXAMPLE_QUESTIONS as V, initWidgetSentry as _, PUBLIC_SUPABASE_URL as q, PUBLIC_SUPABASE_ANON_KEY as X, initWidgetAuth as Y, AUTH_ERROR_MESSAGE as $, fetchWidgetConfig as J, DEFAULT_WELCOME_MESSAGE as Z, streamChatMessage as ee, captureWidgetException as te } from "@useknest/widget-core";
|
|
5
|
+
function ne({
|
|
6
6
|
message: r,
|
|
7
|
-
isLoading:
|
|
7
|
+
isLoading: L = !1,
|
|
8
8
|
avatarUrl: x = "/default-avatar.svg",
|
|
9
|
-
brandColor:
|
|
10
|
-
showAvatar:
|
|
9
|
+
brandColor: c = R,
|
|
10
|
+
showAvatar: m = !0
|
|
11
11
|
}) {
|
|
12
|
-
const [
|
|
13
|
-
|
|
14
|
-
},
|
|
12
|
+
const [v, i] = l(!1), p = () => {
|
|
13
|
+
i(!0);
|
|
14
|
+
}, y = r.content ? G(r.content) : "";
|
|
15
15
|
return /* @__PURE__ */ e("div", { className: "knest-message-wrapper", children: /* @__PURE__ */ s("div", { className: "knest-message", children: [
|
|
16
|
-
|
|
16
|
+
m && /* @__PURE__ */ e("div", { className: "knest-message-avatar", children: r.role === "assistant" ? v ? /* @__PURE__ */ e("div", { className: "knest-user-avatar", style: { backgroundColor: c }, children: "AI" }) : /* @__PURE__ */ e(
|
|
17
17
|
"img",
|
|
18
18
|
{
|
|
19
19
|
src: x,
|
|
@@ -21,19 +21,19 @@ function q({
|
|
|
21
21
|
className: "knest-avatar-img",
|
|
22
22
|
onError: p
|
|
23
23
|
}
|
|
24
|
-
) : /* @__PURE__ */ e("div", { className: "knest-user-avatar", style: { backgroundColor:
|
|
24
|
+
) : /* @__PURE__ */ e("div", { className: "knest-user-avatar", style: { backgroundColor: c }, children: "U" }) }),
|
|
25
25
|
/* @__PURE__ */ s("div", { className: "knest-message-content", children: [
|
|
26
|
-
!r.content &&
|
|
26
|
+
!r.content && L && r.role === "assistant" ? /* @__PURE__ */ s("div", { className: "knest-loading", children: [
|
|
27
27
|
/* @__PURE__ */ e("div", { className: "knest-dot" }),
|
|
28
28
|
/* @__PURE__ */ e("div", { className: "knest-dot" }),
|
|
29
29
|
/* @__PURE__ */ e("div", { className: "knest-dot" })
|
|
30
|
-
] }) : /* @__PURE__ */ e("div", { dangerouslySetInnerHTML: { __html:
|
|
30
|
+
] }) : /* @__PURE__ */ e("div", { dangerouslySetInnerHTML: { __html: y } }),
|
|
31
31
|
r.sources && r.sources.length > 0 && /* @__PURE__ */ s("div", { className: "knest-sources", children: [
|
|
32
32
|
/* @__PURE__ */ e("div", { className: "knest-sources-label", children: "Sources" }),
|
|
33
|
-
r.sources.slice(0, 1).map((
|
|
33
|
+
r.sources.slice(0, 1).map((h, f) => /* @__PURE__ */ s(
|
|
34
34
|
"a",
|
|
35
35
|
{
|
|
36
|
-
href:
|
|
36
|
+
href: h.url,
|
|
37
37
|
target: "_blank",
|
|
38
38
|
rel: "noopener noreferrer",
|
|
39
39
|
className: "knest-source-item",
|
|
@@ -57,129 +57,132 @@ function q({
|
|
|
57
57
|
}
|
|
58
58
|
),
|
|
59
59
|
/* @__PURE__ */ s("div", { className: "knest-source-text", children: [
|
|
60
|
-
|
|
61
|
-
/* @__PURE__ */ e("div", { className: "knest-source-title", children:
|
|
60
|
+
h.breadcrumb && /* @__PURE__ */ e("div", { className: "knest-source-breadcrumb", children: h.breadcrumb }),
|
|
61
|
+
/* @__PURE__ */ e("div", { className: "knest-source-title", children: h.title })
|
|
62
62
|
] })
|
|
63
63
|
]
|
|
64
64
|
},
|
|
65
|
-
|
|
65
|
+
f
|
|
66
66
|
))
|
|
67
67
|
] })
|
|
68
68
|
] })
|
|
69
69
|
] }) });
|
|
70
70
|
}
|
|
71
|
-
function
|
|
71
|
+
function ae({
|
|
72
72
|
publishableApiKey: r,
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
73
|
+
mode: L = "inline",
|
|
74
|
+
defaultOpen: x = !1,
|
|
75
|
+
_internal: c
|
|
76
76
|
}) {
|
|
77
|
-
const [
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
77
|
+
const [m, v] = l(null), [i, p] = l(!0), [y, h] = l(null), [f, T] = l(!1), [u, k] = l([]), [C, E] = l(""), [b, I] = l(!1), [w, O] = l(void 0), [N, P] = l(x), A = z(null), j = m?.avatarUrl || H, D = m?.exampleQuestions || V, M = m?.brandColor || R;
|
|
78
|
+
B(() => {
|
|
79
|
+
typeof requestIdleCallback < "u" ? requestIdleCallback(() => _()) : setTimeout(() => _(), 0);
|
|
80
|
+
const t = c?.supabaseUrl || q, o = c?.supabaseAnonKey || X, g = Y(t, o);
|
|
81
|
+
(async () => {
|
|
82
|
+
const n = await J(
|
|
83
|
+
r,
|
|
84
|
+
c?.baseUrl,
|
|
85
|
+
(a) => {
|
|
86
|
+
v(a);
|
|
87
|
+
}
|
|
88
|
+
);
|
|
89
|
+
if (n.error) {
|
|
90
|
+
h(n.error), p(!1);
|
|
83
91
|
return;
|
|
84
92
|
}
|
|
85
|
-
|
|
86
|
-
const u = await $(
|
|
87
|
-
t.config.supabaseUrl,
|
|
88
|
-
t.config.supabaseAnonKey
|
|
89
|
-
);
|
|
90
|
-
u || console.warn("Widget auth initialization failed"), T(u);
|
|
91
|
-
}
|
|
92
|
-
p(!1), h([
|
|
93
|
+
v(n.config), p(!1), k([
|
|
93
94
|
{
|
|
94
95
|
role: "assistant",
|
|
95
|
-
content:
|
|
96
|
+
content: n.config?.welcomeMessage || Z
|
|
96
97
|
}
|
|
97
98
|
]);
|
|
99
|
+
const d = await g;
|
|
100
|
+
d || console.warn("Widget auth initialization failed"), T(d);
|
|
98
101
|
})();
|
|
99
|
-
}, [r,
|
|
100
|
-
|
|
101
|
-
}, [
|
|
102
|
-
const
|
|
103
|
-
if (!C.trim() ||
|
|
104
|
-
const
|
|
105
|
-
|
|
106
|
-
const
|
|
107
|
-
|
|
108
|
-
let
|
|
109
|
-
await
|
|
102
|
+
}, [r, c]), B(() => {
|
|
103
|
+
u.length > 0 && A.current && A.current.scrollIntoView({ behavior: "smooth" });
|
|
104
|
+
}, [u]);
|
|
105
|
+
const U = async () => {
|
|
106
|
+
if (!C.trim() || b || !f) return;
|
|
107
|
+
const t = C.trim();
|
|
108
|
+
E(""), I(!0), k((n) => [...n, { role: "user", content: t }]);
|
|
109
|
+
const o = u.length + 1;
|
|
110
|
+
k((n) => [...n, { role: "assistant", content: "" }]);
|
|
111
|
+
let g = "", W = [];
|
|
112
|
+
await ee({
|
|
110
113
|
publishableApiKey: r,
|
|
111
|
-
content:
|
|
112
|
-
threadId:
|
|
113
|
-
baseUrl:
|
|
114
|
+
content: t,
|
|
115
|
+
threadId: w,
|
|
116
|
+
baseUrl: c?.baseUrl,
|
|
114
117
|
callbacks: {
|
|
115
|
-
onInit: (
|
|
116
|
-
|
|
118
|
+
onInit: (n) => {
|
|
119
|
+
w || O(n);
|
|
117
120
|
},
|
|
118
|
-
onContent: (
|
|
119
|
-
|
|
120
|
-
const
|
|
121
|
-
return
|
|
121
|
+
onContent: (n) => {
|
|
122
|
+
g += n, k((d) => {
|
|
123
|
+
const a = [...d];
|
|
124
|
+
return a[o] = {
|
|
122
125
|
role: "assistant",
|
|
123
|
-
content:
|
|
124
|
-
},
|
|
126
|
+
content: g
|
|
127
|
+
}, a;
|
|
125
128
|
});
|
|
126
129
|
},
|
|
127
|
-
onComplete: (
|
|
128
|
-
|
|
129
|
-
const
|
|
130
|
-
return
|
|
130
|
+
onComplete: (n) => {
|
|
131
|
+
W = n, k((d) => {
|
|
132
|
+
const a = [...d];
|
|
133
|
+
return a[o] = {
|
|
131
134
|
role: "assistant",
|
|
132
|
-
content:
|
|
133
|
-
sources:
|
|
134
|
-
},
|
|
135
|
+
content: g,
|
|
136
|
+
sources: W
|
|
137
|
+
}, a;
|
|
135
138
|
});
|
|
136
139
|
},
|
|
137
|
-
onError: (
|
|
138
|
-
|
|
139
|
-
const
|
|
140
|
-
return
|
|
140
|
+
onError: (n) => {
|
|
141
|
+
te(n, { userMessage: t, threadId: w, baseUrl: c?.baseUrl }), k((d) => {
|
|
142
|
+
const a = [...d];
|
|
143
|
+
return a[o] = {
|
|
141
144
|
role: "assistant",
|
|
142
|
-
content: `Error: ${
|
|
143
|
-
},
|
|
145
|
+
content: `Error: ${n}`
|
|
146
|
+
}, a;
|
|
144
147
|
});
|
|
145
148
|
}
|
|
146
149
|
}
|
|
147
|
-
}),
|
|
148
|
-
},
|
|
149
|
-
|
|
150
|
-
}, F = async (
|
|
151
|
-
|
|
152
|
-
},
|
|
150
|
+
}), I(!1);
|
|
151
|
+
}, K = (t) => {
|
|
152
|
+
t.key === "Enter" && !t.shiftKey && (t.preventDefault(), U());
|
|
153
|
+
}, F = async (t) => {
|
|
154
|
+
E(t), setTimeout(() => U(), 0);
|
|
155
|
+
}, S = i ? /* @__PURE__ */ e("div", { className: "knest-chat-card", children: /* @__PURE__ */ e("div", { className: "knest-loading-container", children: /* @__PURE__ */ s("div", { className: "knest-loading-content", children: [
|
|
153
156
|
/* @__PURE__ */ e("div", { className: "knest-spinner-ring" }),
|
|
154
157
|
/* @__PURE__ */ e("p", { className: "knest-loading-text", children: "Loading chat..." })
|
|
155
|
-
] }) }) }) :
|
|
158
|
+
] }) }) }) : y === "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: $ }) }) }) }) : /* @__PURE__ */ s("div", { className: "knest-chat-card", children: [
|
|
156
159
|
/* @__PURE__ */ s("div", { className: "knest-messages-container", children: [
|
|
157
|
-
|
|
160
|
+
u.map((t, o) => /* @__PURE__ */ s("div", { children: [
|
|
158
161
|
/* @__PURE__ */ e(
|
|
159
|
-
|
|
162
|
+
ne,
|
|
160
163
|
{
|
|
161
|
-
message:
|
|
162
|
-
isLoading: !
|
|
163
|
-
avatarUrl:
|
|
164
|
-
brandColor:
|
|
164
|
+
message: t,
|
|
165
|
+
isLoading: !t.content && b && t.role === "assistant",
|
|
166
|
+
avatarUrl: j,
|
|
167
|
+
brandColor: M
|
|
165
168
|
}
|
|
166
169
|
),
|
|
167
|
-
|
|
168
|
-
] },
|
|
169
|
-
|
|
170
|
+
o < u.length - 1 && /* @__PURE__ */ e("div", { className: "knest-separator" })
|
|
171
|
+
] }, o)),
|
|
172
|
+
u.length === 1 && !i && /* @__PURE__ */ s("div", { className: "knest-examples", children: [
|
|
170
173
|
/* @__PURE__ */ e("h3", { children: "Example Questions" }),
|
|
171
|
-
|
|
174
|
+
D.map((t, o) => /* @__PURE__ */ e(
|
|
172
175
|
"button",
|
|
173
176
|
{
|
|
174
|
-
onClick: () => F(
|
|
177
|
+
onClick: () => F(t),
|
|
175
178
|
className: "knest-example-btn",
|
|
176
|
-
style:
|
|
177
|
-
children:
|
|
179
|
+
style: o === 0 ? { borderColor: M, borderWidth: "2px" } : {},
|
|
180
|
+
children: t
|
|
178
181
|
},
|
|
179
|
-
|
|
182
|
+
o
|
|
180
183
|
))
|
|
181
184
|
] }),
|
|
182
|
-
/* @__PURE__ */ e("div", { ref:
|
|
185
|
+
/* @__PURE__ */ e("div", { ref: A })
|
|
183
186
|
] }),
|
|
184
187
|
/* @__PURE__ */ s("div", { className: "knest-input-section", children: [
|
|
185
188
|
/* @__PURE__ */ s("div", { className: "knest-input-wrapper", children: [
|
|
@@ -188,18 +191,18 @@ function se({
|
|
|
188
191
|
{
|
|
189
192
|
type: "text",
|
|
190
193
|
value: C,
|
|
191
|
-
onChange: (
|
|
192
|
-
onKeyPress:
|
|
194
|
+
onChange: (t) => E(t.target.value),
|
|
195
|
+
onKeyPress: K,
|
|
193
196
|
placeholder: "Ask me anything...",
|
|
194
|
-
disabled:
|
|
197
|
+
disabled: b || !f,
|
|
195
198
|
className: "knest-input-field"
|
|
196
199
|
}
|
|
197
200
|
),
|
|
198
201
|
/* @__PURE__ */ e(
|
|
199
202
|
"button",
|
|
200
203
|
{
|
|
201
|
-
onClick:
|
|
202
|
-
disabled:
|
|
204
|
+
onClick: U,
|
|
205
|
+
disabled: b || !C.trim() || !f,
|
|
203
206
|
className: "knest-send-btn",
|
|
204
207
|
"aria-label": "Send message",
|
|
205
208
|
children: /* @__PURE__ */ e("svg", { className: "knest-send-icon", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ e(
|
|
@@ -290,16 +293,52 @@ function se({
|
|
|
290
293
|
) })
|
|
291
294
|
] })
|
|
292
295
|
] });
|
|
293
|
-
|
|
294
|
-
|
|
296
|
+
if (L === "inline")
|
|
297
|
+
return S;
|
|
298
|
+
const Q = i ? "#9ca3af" : M;
|
|
299
|
+
return /* @__PURE__ */ s("div", { className: "knest-bubble-container", children: [
|
|
300
|
+
N && /* @__PURE__ */ e("div", { className: "knest-bubble-panel", children: S }),
|
|
295
301
|
/* @__PURE__ */ e(
|
|
296
302
|
"button",
|
|
297
303
|
{
|
|
298
|
-
className: "knest-bubble-button",
|
|
299
|
-
onClick: () =>
|
|
300
|
-
"aria-label":
|
|
301
|
-
style: { backgroundColor:
|
|
302
|
-
children:
|
|
304
|
+
className: ["knest-bubble-button", i && "knest-bubble-loading"].filter(Boolean).join(" "),
|
|
305
|
+
onClick: () => P(!N),
|
|
306
|
+
"aria-label": i ? "Loading chat" : N ? "Close chat" : "Open chat",
|
|
307
|
+
style: { backgroundColor: Q },
|
|
308
|
+
children: i ? /* @__PURE__ */ s(
|
|
309
|
+
"svg",
|
|
310
|
+
{
|
|
311
|
+
width: "24",
|
|
312
|
+
height: "24",
|
|
313
|
+
viewBox: "0 0 24 24",
|
|
314
|
+
fill: "none",
|
|
315
|
+
className: "knest-bubble-spinner",
|
|
316
|
+
children: [
|
|
317
|
+
/* @__PURE__ */ e(
|
|
318
|
+
"circle",
|
|
319
|
+
{
|
|
320
|
+
cx: "12",
|
|
321
|
+
cy: "12",
|
|
322
|
+
r: "9",
|
|
323
|
+
stroke: "currentColor",
|
|
324
|
+
strokeOpacity: "0.25",
|
|
325
|
+
strokeWidth: "3",
|
|
326
|
+
fill: "none"
|
|
327
|
+
}
|
|
328
|
+
),
|
|
329
|
+
/* @__PURE__ */ e(
|
|
330
|
+
"path",
|
|
331
|
+
{
|
|
332
|
+
d: "M12 3a9 9 0 0 1 9 9",
|
|
333
|
+
stroke: "currentColor",
|
|
334
|
+
strokeWidth: "3",
|
|
335
|
+
strokeLinecap: "round",
|
|
336
|
+
fill: "none"
|
|
337
|
+
}
|
|
338
|
+
)
|
|
339
|
+
]
|
|
340
|
+
}
|
|
341
|
+
) : N ? /* @__PURE__ */ e(
|
|
303
342
|
"svg",
|
|
304
343
|
{
|
|
305
344
|
width: "24",
|
|
@@ -334,6 +373,6 @@ function se({
|
|
|
334
373
|
] });
|
|
335
374
|
}
|
|
336
375
|
export {
|
|
337
|
-
|
|
338
|
-
|
|
376
|
+
ne as ChatMessage,
|
|
377
|
+
ae as ChatWidget
|
|
339
378
|
};
|
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.8",
|
|
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.8"
|
|
26
26
|
},
|
|
27
27
|
"devDependencies": {
|
|
28
28
|
"@types/react": "^18.3.3",
|