@useknest/widget-react 0.1.0-beta.11 → 0.1.0-beta.12

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 (5) hide show
  1. package/dist/ChatMessage.d.ts +4 -1
  2. package/dist/ChatMessage.d.ts.map +1 -1
  3. package/dist/ChatWidget.d.ts.map +1 -1
  4. package/dist/index.js +324 -146
  5. package/package.json +2 -2
package/dist/ChatMessage.d.ts CHANGED
@@ -5,6 +5,9 @@ export interface ChatMessageProps {
5
5
  avatarUrl?: string;
6
6
  brandColor?: string;
7
7
  showAvatar?: boolean;
8
+ /** Required for lazy signed URL resolution (widget context). */
9
+ publishableApiKey?: string;
10
+ baseUrl?: string;
8
11
  }
9
- export declare function ChatMessage({ message, isLoading, avatarUrl, brandColor, showAvatar }: ChatMessageProps): import("react/jsx-runtime").JSX.Element;
12
+ export declare function ChatMessage({ message, isLoading, avatarUrl, brandColor, showAvatar, publishableApiKey, baseUrl }: ChatMessageProps): import("react/jsx-runtime").JSX.Element;
10
13
  //# sourceMappingURL=ChatMessage.d.ts.map
package/dist/ChatMessage.d.ts.map CHANGED
@@ -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,UAAgC,EAChC,UAAiB,EACjB,EAAE,gBAAgB,2CAkFlB"}
1
+ {"version":3,"file":"ChatMessage.d.ts","sourceRoot":"","sources":["../src/ChatMessage.tsx"],"names":[],"mappings":"AAOA,OAAO,KAAK,EAAE,OAAO,EAAc,MAAM,uBAAuB,CAAC;AAGjE,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;IACrB,gEAAgE;IAChE,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,OAAO,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,wBAAgB,WAAW,CAAC,EAC3B,OAAO,EACP,SAAiB,EACjB,SAAiC,EACjC,UAAgC,EAChC,UAAiB,EACjB,iBAAiB,EACjB,OAAO,EACP,EAAE,gBAAgB,2CAgKlB"}
package/dist/ChatWidget.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ChatWidget.d.ts","sourceRoot":"","sources":["../src/ChatWidget.tsx"],"names":[],"mappings":"AAmBA,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,2CA2ajB"}
1
+ {"version":3,"file":"ChatWidget.d.ts","sourceRoot":"","sources":["../src/ChatWidget.tsx"],"names":[],"mappings":"AAuBA,OAAO,KAAK,EAMX,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,2CA0iBjB"}
package/dist/index.js CHANGED
@@ -1,39 +1,106 @@
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-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-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
- import { jsx as e, jsxs as r } from "react/jsx-runtime";
3
- import { useState as d, useRef as q, useEffect as E } from "react";
4
- import { formatContent as K, DEFAULT_BRAND_COLOR as O, DEFAULT_AVATAR_URL as X, DEFAULT_EXAMPLE_QUESTIONS as Y, initWidgetSentry as T, PUBLIC_SUPABASE_URL as $, PUBLIC_SUPABASE_ANON_KEY as J, initWidgetAuth as Z, saveChatStateDebounced as ee, subscribeToThread as te, AUTH_ERROR_MESSAGE as ne, fetchWidgetConfig as se, loadChatState as re, DEFAULT_WELCOME_MESSAGE as R, streamChatMessage as ae, captureWidgetException as oe, clearChatState as ce } from "@useknest/widget-core";
5
- function le({
6
- message: a,
7
- isLoading: M = !1,
8
- avatarUrl: y = "/default-avatar.svg",
9
- brandColor: h = O,
10
- showAvatar: v = !0
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
+ import { jsx as e, jsxs as l } from "react/jsx-runtime";
3
+ import { useState as h, useEffect as U, useRef as Q } from "react";
4
+ import { fetchSignedUrl as ae, formatContent as oe, DEFAULT_BRAND_COLOR as $, isImageType as le, formatFileSize as ce, DEFAULT_AVATAR_URL as ie, DEFAULT_EXAMPLE_QUESTIONS as de, initWidgetSentry as V, PUBLIC_SUPABASE_URL as he, PUBLIC_SUPABASE_ANON_KEY as ue, initWidgetAuth as me, saveChatStateDebounced as fe, subscribeToThread as ke, AUTH_ERROR_MESSAGE as ge, ACCEPTED_FILE_TYPES_STRING as ve, fetchWidgetConfig as pe, loadChatState as Ce, DEFAULT_WELCOME_MESSAGE as X, validateAttachment as be, MAX_ATTACHMENTS_PER_MESSAGE as Ne, uploadAttachment as Ee, captureWidgetException as Y, streamChatMessage as Le, clearChatState as we } from "@useknest/widget-core";
5
+ function Me({
6
+ message: r,
7
+ isLoading: P = !1,
8
+ avatarUrl: T = "/default-avatar.svg",
9
+ brandColor: u = $,
10
+ showAvatar: L = !0,
11
+ publishableApiKey: w,
12
+ baseUrl: p
11
13
  }) {
12
- const [L, k] = d(!1), x = () => {
13
- k(!0);
14
- }, A = a.content ? K(a.content) : "";
15
- return /* @__PURE__ */ e("div", { className: "knest-message-wrapper", children: /* @__PURE__ */ r("div", { className: "knest-message", children: [
16
- v && /* @__PURE__ */ e("div", { className: "knest-message-avatar", children: a.role === "assistant" ? L ? /* @__PURE__ */ e("div", { className: "knest-user-avatar", style: { backgroundColor: h }, children: "AI" }) : /* @__PURE__ */ e(
14
+ const [y, W] = h(!1), [x, N] = h({});
15
+ U(() => {
16
+ if (!r.attachments?.length || !w) return;
17
+ const s = r.attachments.filter(
18
+ (o) => o.storagePath && !o.url && !x[o.storagePath]
19
+ );
20
+ s.length !== 0 && Promise.all(
21
+ s.map(async (o) => {
22
+ const c = await ae({
23
+ publishableApiKey: w,
24
+ storagePath: o.storagePath,
25
+ baseUrl: p
26
+ });
27
+ return { storagePath: o.storagePath, url: c };
28
+ })
29
+ ).then((o) => {
30
+ const c = {};
31
+ for (const { storagePath: E, url: d } of o)
32
+ d && (c[E] = d);
33
+ Object.keys(c).length > 0 && N((E) => ({ ...E, ...c }));
34
+ });
35
+ }, [r.attachments, w, p]);
36
+ const _ = (s) => s.url || (s.storagePath ? x[s.storagePath] : void 0), m = () => W(!0), f = r.content ? oe(r.content) : "";
37
+ return /* @__PURE__ */ e("div", { className: "knest-message-wrapper", children: /* @__PURE__ */ l("div", { className: "knest-message", children: [
38
+ L && /* @__PURE__ */ e("div", { className: "knest-message-avatar", children: r.role === "assistant" ? y ? /* @__PURE__ */ e("div", { className: "knest-user-avatar", style: { backgroundColor: u }, children: "AI" }) : /* @__PURE__ */ e(
17
39
  "img",
18
40
  {
19
- src: y,
41
+ src: T,
20
42
  alt: "Avatar",
21
43
  className: "knest-avatar-img",
22
- onError: x
44
+ onError: m
23
45
  }
24
- ) : /* @__PURE__ */ e("div", { className: "knest-user-avatar", style: { backgroundColor: h }, children: "U" }) }),
25
- /* @__PURE__ */ r("div", { className: "knest-message-content", children: [
26
- !a.content && M && a.role === "assistant" ? /* @__PURE__ */ r("div", { className: "knest-loading", children: [
46
+ ) : /* @__PURE__ */ e("div", { className: "knest-user-avatar", style: { backgroundColor: u }, children: "U" }) }),
47
+ /* @__PURE__ */ l("div", { className: "knest-message-content", children: [
48
+ !r.content && P && r.role === "assistant" ? /* @__PURE__ */ l("div", { className: "knest-loading", children: [
27
49
  /* @__PURE__ */ e("div", { className: "knest-dot" }),
28
50
  /* @__PURE__ */ e("div", { className: "knest-dot" }),
29
51
  /* @__PURE__ */ e("div", { className: "knest-dot" })
30
- ] }) : /* @__PURE__ */ e("div", { dangerouslySetInnerHTML: { __html: A } }),
31
- a.sources && a.sources.length > 0 && /* @__PURE__ */ r("div", { className: "knest-sources", children: [
52
+ ] }) : /* @__PURE__ */ e("div", { dangerouslySetInnerHTML: { __html: f } }),
53
+ r.attachments && r.attachments.length > 0 && /* @__PURE__ */ e("div", { className: "knest-attachments", children: r.attachments.map((s, o) => {
54
+ const c = _(s);
55
+ return le(s.fileType) ? c ? /* @__PURE__ */ e(
56
+ "a",
57
+ {
58
+ href: c,
59
+ target: "_blank",
60
+ rel: "noopener noreferrer",
61
+ className: "knest-attachment-image-link",
62
+ children: /* @__PURE__ */ e("img", { src: c, alt: s.fileName, className: "knest-attachment-image" })
63
+ },
64
+ o
65
+ ) : null : /* @__PURE__ */ l(
66
+ "a",
67
+ {
68
+ href: c || "#",
69
+ target: "_blank",
70
+ rel: "noopener noreferrer",
71
+ className: ["knest-attachment-file", !c && "knest-attachment-disabled"].filter(Boolean).join(" "),
72
+ children: [
73
+ /* @__PURE__ */ e(
74
+ "svg",
75
+ {
76
+ className: "knest-attachment-file-icon",
77
+ fill: "none",
78
+ stroke: "currentColor",
79
+ viewBox: "0 0 24 24",
80
+ children: /* @__PURE__ */ e(
81
+ "path",
82
+ {
83
+ strokeLinecap: "round",
84
+ strokeLinejoin: "round",
85
+ strokeWidth: "2",
86
+ d: "M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"
87
+ }
88
+ )
89
+ }
90
+ ),
91
+ /* @__PURE__ */ e("span", { className: "knest-attachment-file-name", children: s.fileName }),
92
+ /* @__PURE__ */ e("span", { className: "knest-attachment-file-size", children: ce(s.fileSize) })
93
+ ]
94
+ },
95
+ o
96
+ );
97
+ }) }),
98
+ r.sources && r.sources.length > 0 && /* @__PURE__ */ l("div", { className: "knest-sources", children: [
32
99
  /* @__PURE__ */ e("div", { className: "knest-sources-label", children: "Sources" }),
33
- a.sources.slice(0, 1).map((C, f) => /* @__PURE__ */ r(
100
+ r.sources.slice(0, 1).map((s, o) => /* @__PURE__ */ l(
34
101
  "a",
35
102
  {
36
- href: C.url,
103
+ href: s.url,
37
104
  target: "_blank",
38
105
  rel: "noopener noreferrer",
39
106
  className: "knest-source-item",
@@ -56,176 +123,287 @@ function le({
56
123
  )
57
124
  }
58
125
  ),
59
- /* @__PURE__ */ r("div", { className: "knest-source-text", children: [
60
- C.breadcrumb && /* @__PURE__ */ e("div", { className: "knest-source-breadcrumb", children: C.breadcrumb }),
61
- /* @__PURE__ */ e("div", { className: "knest-source-title", children: C.title })
126
+ /* @__PURE__ */ l("div", { className: "knest-source-text", children: [
127
+ s.breadcrumb && /* @__PURE__ */ e("div", { className: "knest-source-breadcrumb", children: s.breadcrumb }),
128
+ /* @__PURE__ */ e("div", { className: "knest-source-title", children: s.title })
62
129
  ] })
63
130
  ]
64
131
  },
65
- f
132
+ o
66
133
  ))
67
134
  ] })
68
135
  ] })
69
136
  ] }) });
70
137
  }
71
- function ue({
72
- publishableApiKey: a,
73
- mode: M = "inline",
74
- defaultOpen: y = !1,
75
- _internal: h
138
+ function Ae({
139
+ publishableApiKey: r,
140
+ mode: P = "inline",
141
+ defaultOpen: T = !1,
142
+ _internal: u
76
143
  }) {
77
- const [v, L] = d(null), [k, x] = d(!0), [A, C] = d(null), [f, D] = d(!1), [l, i] = d([]), [g, b] = d(""), [p, B] = d(!1), [m, U] = d(void 0), [w, P] = d(y), S = q(null), j = v?.avatarUrl || X, F = v?.exampleQuestions || Y, W = v?.brandColor || O;
78
- E(() => {
79
- typeof requestIdleCallback < "u" ? requestIdleCallback(() => T()) : setTimeout(() => T(), 0);
80
- const t = h?.supabaseUrl || $, s = h?.supabaseAnonKey || J, u = Z(t, s);
144
+ const [L, w] = h(null), [p, y] = h(!0), [W, x] = h(null), [N, _] = h(!1), [m, f] = h([]), [s, o] = h(""), [c, E] = h(!1), [d, B] = h(void 0), [A, q] = h(T), [S, I] = h([]), [R, j] = h(!1), [z, M] = h(null), D = Q(null), G = Q(null), J = L?.avatarUrl || ie, Z = L?.exampleQuestions || de, O = L?.brandColor || $;
145
+ U(() => {
146
+ typeof requestIdleCallback < "u" ? requestIdleCallback(() => V()) : setTimeout(() => V(), 0);
147
+ const t = u?.supabaseUrl || he, n = u?.supabaseAnonKey || ue, k = me(t, n);
81
148
  (async () => {
82
- const n = await se(
83
- a,
84
- h?.baseUrl,
85
- (V) => {
86
- L(V);
149
+ const g = await pe(
150
+ r,
151
+ u?.baseUrl,
152
+ (v) => {
153
+ w(v);
87
154
  }
88
155
  );
89
- if (n.error) {
90
- C(n.error), x(!1);
156
+ if (g.error) {
157
+ x(g.error), y(!1);
91
158
  return;
92
159
  }
93
- L(n.config), x(!1);
94
- const o = re(a);
95
- o && o.messages.length > 0 ? (i(o.messages), U(o.threadId), b(o.input)) : i([
160
+ w(g.config), y(!1);
161
+ const C = Ce(r);
162
+ C && C.messages.length > 0 ? (f(C.messages), B(C.threadId), o(C.input)) : f([
96
163
  {
97
164
  role: "assistant",
98
- content: n.config?.welcomeMessage || R
165
+ content: g.config?.welcomeMessage || X
99
166
  }
100
167
  ]);
101
- const c = await u;
102
- c || console.warn("Widget auth initialization failed"), D(c);
168
+ const a = await k;
169
+ a || console.warn("Widget auth initialization failed"), _(a);
103
170
  })();
104
- }, [a, h]), E(() => {
105
- l.length > 0 && S.current && S.current.scrollIntoView({ behavior: "smooth" });
106
- }, [l]), E(() => {
107
- l.length <= 1 && !g || ee(a, {
108
- threadId: m,
109
- messages: l,
110
- input: g,
171
+ }, [r, u]), U(() => {
172
+ m.length > 0 && D.current && D.current.scrollIntoView({ behavior: "smooth" });
173
+ }, [m]), U(() => {
174
+ m.length <= 1 && !s || fe(r, {
175
+ threadId: d,
176
+ messages: m,
177
+ input: s,
111
178
  savedAt: Date.now()
112
179
  });
113
- }, [l, m, g, a]), E(() => !m || !f ? void 0 : te(m, (s) => {
114
- s.role === "human" && i(
115
- (u) => u.some((N) => N.id === s.id) ? u : [...u, { id: s.id, role: "assistant", content: s.content }]
180
+ }, [m, d, s, r]), U(() => !d || !N ? void 0 : ke(d, (n) => {
181
+ if (n.role !== "human") return;
182
+ const k = n.metadata?.attachments ?? [];
183
+ f(
184
+ (i) => i.some((g) => g.id === n.id) ? i : [
185
+ ...i,
186
+ {
187
+ id: n.id,
188
+ role: "assistant",
189
+ content: n.content,
190
+ ...k.length > 0 ? { attachments: k } : {}
191
+ }
192
+ ]
116
193
  );
117
- }), [m, f]);
118
- const I = async () => {
119
- if (!g.trim() || p || !f) return;
120
- const t = g.trim();
121
- b(""), B(!0), i((n) => [...n, { role: "user", content: t }]);
122
- const s = l.length + 1;
123
- i((n) => [...n, { role: "assistant", content: "" }]);
124
- let u = "", N = [];
125
- await ae({
126
- publishableApiKey: a,
194
+ }), [d, N]);
195
+ const K = (t) => {
196
+ const n = Array.from(t.target.files || []);
197
+ t.target.value = "", M(null);
198
+ for (const k of n) {
199
+ const i = be(k);
200
+ if (i) {
201
+ M(i);
202
+ return;
203
+ }
204
+ }
205
+ I((k) => {
206
+ const i = Ne - k.length;
207
+ return [...k, ...n.slice(0, i)];
208
+ });
209
+ }, ee = (t) => {
210
+ I((n) => n.filter((k, i) => i !== t));
211
+ }, F = async () => {
212
+ if (!s.trim() || c || !N) return;
213
+ const t = s.trim();
214
+ o(""), E(!0), M(null);
215
+ let n = [];
216
+ if (S.length > 0 && d) {
217
+ j(!0);
218
+ try {
219
+ n = await Promise.all(
220
+ S.map(
221
+ (a) => Ee({
222
+ publishableApiKey: r,
223
+ threadId: d,
224
+ file: a,
225
+ baseUrl: u?.baseUrl
226
+ })
227
+ )
228
+ );
229
+ } catch (a) {
230
+ Y(a instanceof Error ? a.message : "Upload failed", {
231
+ threadId: d,
232
+ baseUrl: u?.baseUrl
233
+ }), M(a instanceof Error ? a.message : "Upload failed."), E(!1), j(!1);
234
+ return;
235
+ }
236
+ j(!1), I([]);
237
+ }
238
+ const k = n.length > 0 ? { attachments: n } : void 0;
239
+ f((a) => [
240
+ ...a,
241
+ { role: "user", content: t, ...n.length > 0 ? { attachments: n } : {} }
242
+ ]);
243
+ const i = m.length + 1;
244
+ f((a) => [...a, { role: "assistant", content: "" }]);
245
+ let g = "", C = [];
246
+ await Le({
247
+ publishableApiKey: r,
127
248
  content: t,
128
- threadId: m,
129
- baseUrl: h?.baseUrl,
249
+ threadId: d,
250
+ baseUrl: u?.baseUrl,
251
+ metadata: k,
130
252
  callbacks: {
131
- onInit: (n) => {
132
- m || U(n);
253
+ onInit: (a) => {
254
+ d || B(a);
133
255
  },
134
- onContent: (n) => {
135
- u += n, i((o) => {
136
- const c = [...o];
137
- return c[s] = {
256
+ onContent: (a) => {
257
+ g += a, f((v) => {
258
+ const b = [...v];
259
+ return b[i] = {
138
260
  role: "assistant",
139
- content: u
140
- }, c;
261
+ content: g
262
+ }, b;
141
263
  });
142
264
  },
143
- onComplete: (n) => {
144
- N = n, i((o) => {
145
- const c = [...o];
146
- return c[s] = {
265
+ onComplete: (a) => {
266
+ C = a, f((v) => {
267
+ const b = [...v];
268
+ return b[i] = {
147
269
  role: "assistant",
148
- content: u,
149
- sources: N
150
- }, c;
270
+ content: g,
271
+ sources: C
272
+ }, b;
151
273
  });
152
274
  },
153
- onDone: ({ humanTakeover: n }) => {
154
- n && i((o) => [
155
- ...o.slice(0, s),
156
- ...o.slice(s + 1)
275
+ onDone: ({ humanTakeover: a }) => {
276
+ a && f((v) => [
277
+ ...v.slice(0, i),
278
+ ...v.slice(i + 1)
157
279
  ]);
158
280
  },
159
- onError: (n) => {
160
- oe(n, { userMessage: t, threadId: m, baseUrl: h?.baseUrl }), i((o) => {
161
- const c = [...o];
162
- return c[s] = {
281
+ onError: (a) => {
282
+ Y(a, { userMessage: t, threadId: d, baseUrl: u?.baseUrl }), f((v) => {
283
+ const b = [...v];
284
+ return b[i] = {
163
285
  role: "assistant",
164
- content: `Error: ${n}`
165
- }, c;
286
+ content: `Error: ${a}`
287
+ }, b;
166
288
  });
167
289
  }
168
290
  }
169
- }), B(!1);
170
- }, Q = () => {
171
- ce(a), U(void 0), i([
172
- { role: "assistant", content: v?.welcomeMessage || R }
173
- ]), b("");
174
- }, z = (t) => {
175
- t.key === "Enter" && !t.shiftKey && (t.preventDefault(), I());
176
- }, G = async (t) => {
177
- b(t), setTimeout(() => I(), 0);
178
- }, _ = k ? /* @__PURE__ */ e("div", { className: "knest-chat-card", children: /* @__PURE__ */ e("div", { className: "knest-loading-container", children: /* @__PURE__ */ r("div", { className: "knest-loading-content", children: [
291
+ }), E(!1);
292
+ }, te = () => {
293
+ we(r), B(void 0), f([
294
+ { role: "assistant", content: L?.welcomeMessage || X }
295
+ ]), o(""), I([]), M(null);
296
+ }, ne = (t) => {
297
+ t.key === "Enter" && !t.shiftKey && (t.preventDefault(), F());
298
+ }, se = async (t) => {
299
+ o(t), setTimeout(() => F(), 0);
300
+ }, H = p ? /* @__PURE__ */ e("div", { className: "knest-chat-card", children: /* @__PURE__ */ e("div", { className: "knest-loading-container", children: /* @__PURE__ */ l("div", { className: "knest-loading-content", children: [
179
301
  /* @__PURE__ */ e("div", { className: "knest-spinner-ring" }),
180
302
  /* @__PURE__ */ e("p", { className: "knest-loading-text", children: "Loading chat..." })
181
- ] }) }) }) : A === "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: ne }) }) }) }) : /* @__PURE__ */ r("div", { className: "knest-chat-card", children: [
182
- /* @__PURE__ */ r("div", { className: "knest-messages-container", children: [
183
- l.map((t, s) => /* @__PURE__ */ r("div", { children: [
303
+ ] }) }) }) : W === "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: ge }) }) }) }) : /* @__PURE__ */ l("div", { className: "knest-chat-card", children: [
304
+ /* @__PURE__ */ l("div", { className: "knest-messages-container", children: [
305
+ m.map((t, n) => /* @__PURE__ */ l("div", { children: [
184
306
  /* @__PURE__ */ e(
185
- le,
307
+ Me,
186
308
  {
187
309
  message: t,
188
- isLoading: !t.content && p && t.role === "assistant",
189
- avatarUrl: j,
190
- brandColor: W
310
+ isLoading: !t.content && c && t.role === "assistant",
311
+ avatarUrl: J,
312
+ brandColor: O,
313
+ publishableApiKey: r,
314
+ baseUrl: u?.baseUrl
191
315
  }
192
316
  ),
193
- s < l.length - 1 && /* @__PURE__ */ e("div", { className: "knest-separator" })
194
- ] }, s)),
195
- l.length === 1 && !k && /* @__PURE__ */ r("div", { className: "knest-examples", children: [
317
+ n < m.length - 1 && /* @__PURE__ */ e("div", { className: "knest-separator" })
318
+ ] }, n)),
319
+ m.length === 1 && !p && /* @__PURE__ */ l("div", { className: "knest-examples", children: [
196
320
  /* @__PURE__ */ e("h3", { children: "Example Questions" }),
197
- F.map((t, s) => /* @__PURE__ */ e(
321
+ Z.map((t, n) => /* @__PURE__ */ e(
198
322
  "button",
199
323
  {
200
- onClick: () => G(t),
324
+ onClick: () => se(t),
201
325
  className: "knest-example-btn",
202
- style: s === 0 ? { borderColor: W, borderWidth: "2px" } : {},
326
+ style: n === 0 ? { borderColor: O, borderWidth: "2px" } : {},
203
327
  children: t
204
328
  },
205
- s
329
+ n
206
330
  ))
207
331
  ] }),
208
- /* @__PURE__ */ e("div", { ref: S })
332
+ /* @__PURE__ */ e("div", { ref: D })
209
333
  ] }),
210
- /* @__PURE__ */ r("div", { className: "knest-input-section", children: [
211
- /* @__PURE__ */ r("div", { className: "knest-input-wrapper", children: [
334
+ /* @__PURE__ */ l("div", { className: "knest-input-section", children: [
335
+ /* @__PURE__ */ e(
336
+ "input",
337
+ {
338
+ ref: G,
339
+ type: "file",
340
+ accept: ve,
341
+ multiple: !0,
342
+ style: { display: "none" },
343
+ onChange: K
344
+ }
345
+ ),
346
+ S.length > 0 && /* @__PURE__ */ e("div", { className: "knest-file-preview", children: S.map((t, n) => /* @__PURE__ */ l("span", { className: "knest-file-chip", children: [
347
+ t.name,
348
+ /* @__PURE__ */ e(
349
+ "button",
350
+ {
351
+ type: "button",
352
+ className: "knest-chip-remove",
353
+ onClick: () => ee(n),
354
+ "aria-label": `Remove ${t.name}`,
355
+ children: "×"
356
+ }
357
+ )
358
+ ] }, n)) }),
359
+ z && /* @__PURE__ */ e("p", { className: "knest-attach-error", children: z }),
360
+ /* @__PURE__ */ l("div", { className: "knest-input-wrapper", children: [
212
361
  /* @__PURE__ */ e(
213
362
  "input",
214
363
  {
215
364
  type: "text",
216
- value: g,
217
- onChange: (t) => b(t.target.value),
218
- onKeyPress: z,
365
+ value: s,
366
+ onChange: (t) => o(t.target.value),
367
+ onKeyDown: ne,
219
368
  placeholder: "Ask me anything...",
220
- disabled: p || !f,
369
+ disabled: c || R || !N,
221
370
  className: "knest-input-field"
222
371
  }
223
372
  ),
224
373
  /* @__PURE__ */ e(
225
374
  "button",
226
375
  {
227
- onClick: I,
228
- disabled: p || !g.trim() || !f,
376
+ onClick: () => G.current?.click(),
377
+ disabled: !d || c || R,
378
+ className: "knest-attach-btn",
379
+ type: "button",
380
+ title: d ? "Attach file" : "Send a message first to enable attachments",
381
+ "aria-label": "Attach file",
382
+ children: /* @__PURE__ */ e(
383
+ "svg",
384
+ {
385
+ className: "knest-attach-icon",
386
+ fill: "none",
387
+ stroke: "currentColor",
388
+ viewBox: "0 0 24 24",
389
+ children: /* @__PURE__ */ e(
390
+ "path",
391
+ {
392
+ strokeLinecap: "round",
393
+ strokeLinejoin: "round",
394
+ strokeWidth: "2",
395
+ d: "M15.172 7l-6.586 6.586a2 2 0 102.828 2.828l6.414-6.586a4 4 0 00-5.656-5.656l-6.415 6.585a6 6 0 108.486 8.486L20.5 13"
396
+ }
397
+ )
398
+ }
399
+ )
400
+ }
401
+ ),
402
+ /* @__PURE__ */ e(
403
+ "button",
404
+ {
405
+ onClick: F,
406
+ disabled: c || R || !s.trim() || !N,
229
407
  className: "knest-send-btn",
230
408
  "aria-label": "Send message",
231
409
  children: /* @__PURE__ */ e("svg", { className: "knest-send-icon", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ e(
@@ -240,8 +418,8 @@ function ue({
240
418
  }
241
419
  )
242
420
  ] }),
243
- l.length > 1 && !p && /* @__PURE__ */ e("div", { className: "knest-reset-row", children: /* @__PURE__ */ e("button", { onClick: Q, className: "knest-reset-btn", children: "Clear chat" }) }),
244
- /* @__PURE__ */ e("div", { className: "knest-footer", children: /* @__PURE__ */ r(
421
+ m.length > 1 && !c && /* @__PURE__ */ e("div", { className: "knest-reset-row", children: /* @__PURE__ */ e("button", { onClick: te, className: "knest-reset-btn", children: "Clear chat" }) }),
422
+ /* @__PURE__ */ e("div", { className: "knest-footer", children: /* @__PURE__ */ l(
245
423
  "a",
246
424
  {
247
425
  href: "https://useknest.com",
@@ -250,7 +428,7 @@ function ue({
250
428
  className: "knest-powered-by",
251
429
  children: [
252
430
  /* @__PURE__ */ e("span", { children: "Powered by" }),
253
- /* @__PURE__ */ r(
431
+ /* @__PURE__ */ l(
254
432
  "svg",
255
433
  {
256
434
  width: "14",
@@ -317,19 +495,19 @@ function ue({
317
495
  ) })
318
496
  ] })
319
497
  ] });
320
- if (M === "inline")
321
- return _;
322
- const H = k ? "#9ca3af" : W;
323
- return /* @__PURE__ */ r("div", { className: "knest-bubble-container", children: [
324
- w && /* @__PURE__ */ e("div", { className: "knest-bubble-panel", children: _ }),
498
+ if (P === "inline")
499
+ return H;
500
+ const re = p ? "#9ca3af" : O;
501
+ return /* @__PURE__ */ l("div", { className: "knest-bubble-container", children: [
502
+ A && /* @__PURE__ */ e("div", { className: "knest-bubble-panel", children: H }),
325
503
  /* @__PURE__ */ e(
326
504
  "button",
327
505
  {
328
- className: ["knest-bubble-button", k && "knest-bubble-loading"].filter(Boolean).join(" "),
329
- onClick: () => P(!w),
330
- "aria-label": k ? "Loading chat" : w ? "Close chat" : "Open chat",
331
- style: { backgroundColor: H },
332
- children: k ? /* @__PURE__ */ r(
506
+ className: ["knest-bubble-button", p && "knest-bubble-loading"].filter(Boolean).join(" "),
507
+ onClick: () => q(!A),
508
+ "aria-label": p ? "Loading chat" : A ? "Close chat" : "Open chat",
509
+ style: { backgroundColor: re },
510
+ children: p ? /* @__PURE__ */ l(
333
511
  "svg",
334
512
  {
335
513
  width: "24",
@@ -362,7 +540,7 @@ function ue({
362
540
  )
363
541
  ]
364
542
  }
365
- ) : w ? /* @__PURE__ */ e(
543
+ ) : A ? /* @__PURE__ */ e(
366
544
  "svg",
367
545
  {
368
546
  width: "24",
@@ -397,6 +575,6 @@ function ue({
397
575
  ] });
398
576
  }
399
577
  export {
400
- le as ChatMessage,
401
- ue as ChatWidget
578
+ Me as ChatMessage,
579
+ Ae as ChatWidget
402
580
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@useknest/widget-react",
3
- "version": "0.1.0-beta.11",
3
+ "version": "0.1.0-beta.12",
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.11"
25
+ "@useknest/widget-core": "0.1.0-beta.12"
26
26
  },
27
27
  "devDependencies": {
28
28
  "@types/react": "^18.3.3",