@makemore/agent-frontend 2.8.3 → 2.9.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/chat-widget.cjs.js +348 -239
- package/dist/chat-widget.css +340 -16
- package/dist/chat-widget.esm.js +359 -250
- package/dist/chat-widget.js +306 -197
- package/dist/react.cjs.js +353 -244
- package/dist/react.esm.js +364 -255
- package/package.json +2 -2
- package/src/components/ChatWidget.js +38 -6
- package/src/components/DevToolbar.js +135 -0
- package/src/hooks/useSystems.js +163 -0
- package/src/index.js +17 -0
- package/src/utils/config.js +6 -0
package/dist/react.cjs.js
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
var
|
|
2
|
-
<div class="cw-header" style=${{backgroundColor:
|
|
3
|
-
${
|
|
1
|
+
var ve=Object.defineProperty;var ot=Object.getOwnPropertyDescriptor;var rt=Object.getOwnPropertyNames;var lt=Object.prototype.hasOwnProperty;var it=(e,t,s)=>t in e?ve(e,t,{enumerable:!0,configurable:!0,writable:!0,value:s}):e[t]=s;var ct=(e,t)=>{for(var s in t)ve(e,s,{get:t[s],enumerable:!0})},dt=(e,t,s,n)=>{if(t&&typeof t=="object"||typeof t=="function")for(let a of rt(t))!lt.call(e,a)&&a!==s&&ve(e,a,{get:()=>t[a],enumerable:!(n=ot(t,a))||n.enumerable});return e};var ut=e=>dt(ve({},"__esModule",{value:!0}),e);var Ge=(e,t,s)=>(it(e,typeof t!="symbol"?t+"":t,s),s);var At={};ct(At,{ChatWidget:()=>fe,ChatWidgetAPI:()=>Ne,DEFAULT_CONFIG:()=>Le,Header:()=>Te,InputForm:()=>xe,Message:()=>_e,MessageList:()=>Me,ModelSelector:()=>Ie,Sidebar:()=>Ee,TaskList:()=>Ae,camelToSnake:()=>$e,createApiClient:()=>Pe,createStorage:()=>Ce,default:()=>It,formatDate:()=>ke,formatFileSize:()=>he,generateId:()=>pe,getCSRFToken:()=>Se,getFileTypeIcon:()=>me,keysToCamel:()=>de,keysToSnake:()=>ue,mergeConfig:()=>Ke,parseMarkdown:()=>be,snakeToCamel:()=>He,useChat:()=>Re,useModels:()=>De,useTasks:()=>Fe});module.exports=ut(At);var Z=require("htm/preact"),R=require("preact/compat");var ae=require("htm/preact");function He(e){return e.replace(/_([a-z])/g,(t,s)=>s.toUpperCase())}function $e(e){return e.replace(/[A-Z]/g,t=>`_${t.toLowerCase()}`)}function de(e){return Array.isArray(e)?e.map(de):e!==null&&typeof e=="object"?Object.fromEntries(Object.entries(e).map(([t,s])=>[He(t),de(s)])):e}function ue(e){return Array.isArray(e)?e.map(ue):e!==null&&typeof e=="object"?Object.fromEntries(Object.entries(e).map(([t,s])=>[$e(t),ue(s)])):e}function pe(){return"msg-"+Date.now()+"-"+Math.random().toString(36).substr(2,9)}function U(e){let t=document.createElement("div");return t.textContent=e,t.innerHTML}function ke(e){if(!e)return"";try{let t=new Date(e),n=new Date-t,a=Math.floor(n/6e4),l=Math.floor(n/36e5),$=Math.floor(n/864e5);return a<1?"Just now":a<60?`${a}m ago`:l<24?`${l}h ago`:$<7?`${$}d ago`:t.toLocaleDateString()}catch{return""}}function be(e,t=null){if(t)return t(e);let s=U(e);return s=s.replace(/\*\*(.+?)\*\*/g,"<strong>$1</strong>"),s=s.replace(/__(.+?)__/g,"<strong>$1</strong>"),s=s.replace(/\*(.+?)\*/g,"<em>$1</em>"),s=s.replace(/_(.+?)_/g,"<em>$1</em>"),s=s.replace(/`(.+?)`/g,"<code>$1</code>"),s=s.replace(/\[(.+?)\]\((.+?)\)/g,'<a href="$2" target="_blank" rel="noopener noreferrer">$1</a>'),s=s.replace(/\n/g,"<br>"),s}function Ce(e=""){let t=s=>e?`${s}_${e}`:s;return{get(s){try{return localStorage.getItem(t(s))}catch{return null}},set(s,n){try{let a=t(s);n===null?localStorage.removeItem(a):localStorage.setItem(a,n)}catch{}}}}function Se(e="csrftoken"){let t=document.cookie.split(";");for(let n of t){let[a,l]=n.trim().split("=");if(a===e)return decodeURIComponent(l)}let s=document.querySelector('meta[name="csrf-token"]');return s?s.getAttribute("content"):null}function he(e){if(e===0)return"0 B";let t=1024,s=["B","KB","MB","GB"],n=Math.floor(Math.log(e)/Math.log(t));return parseFloat((e/Math.pow(t,n)).toFixed(1))+" "+s[n]}function me(e){return e?e.startsWith("image/")?"\u{1F5BC}\uFE0F":e.startsWith("video/")?"\u{1F3AC}":e.startsWith("audio/")?"\u{1F3B5}":e.includes("pdf")?"\u{1F4D5}":e.includes("spreadsheet")||e.includes("excel")?"\u{1F4CA}":e.includes("document")||e.includes("word")?"\u{1F4DD}":e.includes("presentation")||e.includes("powerpoint")?"\u{1F4FD}\uFE0F":e.includes("zip")||e.includes("compressed")?"\u{1F5DC}\uFE0F":(e.includes("text/"),"\u{1F4C4}"):"\u{1F4C4}"}function pt(e){if(!e||typeof e!="string")return 0;let t=e.replace("#","");if(t.length!==6&&t.length!==3)return 0;let s=t.length===3?t.split("").map(i=>i+i).join(""):t,n=parseInt(s.substr(0,2),16)/255,a=parseInt(s.substr(2,2),16)/255,l=parseInt(s.substr(4,2),16)/255,$=i=>i<=.03928?i/12.92:Math.pow((i+.055)/1.055,2.4);return .2126*$(n)+.7152*$(a)+.0722*$(l)}function qe(e){return pt(e)>.179?"#000000":"#ffffff"}function Te({config:e,debugMode:t,isExpanded:s,isSpeaking:n,messagesCount:a,isLoading:l,currentAgent:$,onClose:i,onToggleExpand:f,onToggleDebug:y,onToggleTTS:u,onClear:k,onToggleSidebar:c}){let{title:C,primaryColor:o,embedded:g,showConversationSidebar:w,showClearButton:v,showDebugButton:T,enableDebugMode:m,showTTSButton:H,showExpandButton:J,enableTTS:I,elevenLabsApiKey:D,ttsProxyUrl:F}=e,L=D||F;return ae.html`
|
|
2
|
+
<div class="cw-header" style=${{backgroundColor:o}}>
|
|
3
|
+
${w&&ae.html`
|
|
4
4
|
<button
|
|
5
5
|
class="cw-header-btn cw-hamburger"
|
|
6
|
-
onClick=${
|
|
6
|
+
onClick=${c}
|
|
7
7
|
title="Conversations"
|
|
8
8
|
>
|
|
9
9
|
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="16" height="16">
|
|
@@ -15,26 +15,26 @@ var ye=Object.defineProperty;var Ye=Object.getOwnPropertyDescriptor;var Ze=Objec
|
|
|
15
15
|
`}
|
|
16
16
|
|
|
17
17
|
<div class="cw-title-container">
|
|
18
|
-
<span class="cw-title">${
|
|
19
|
-
${
|
|
18
|
+
<span class="cw-title">${U(C)}</span>
|
|
19
|
+
${$&&ae.html`
|
|
20
20
|
<span class="cw-current-agent" title="Currently active agent">
|
|
21
21
|
<span class="cw-agent-indicator">🤖</span>
|
|
22
|
-
<span class="cw-agent-name">${
|
|
22
|
+
<span class="cw-agent-name">${U($.name||$.key)}</span>
|
|
23
23
|
</span>
|
|
24
24
|
`}
|
|
25
25
|
</div>
|
|
26
26
|
|
|
27
27
|
<div class="cw-header-actions">
|
|
28
|
-
${
|
|
28
|
+
${v&&ae.html`
|
|
29
29
|
<button
|
|
30
30
|
class="cw-header-btn"
|
|
31
31
|
onClick=${k}
|
|
32
32
|
title="Clear"
|
|
33
|
-
disabled=${l||
|
|
33
|
+
disabled=${l||a===0}
|
|
34
34
|
>🗑️</button>
|
|
35
35
|
`}
|
|
36
36
|
|
|
37
|
-
${
|
|
37
|
+
${T&&m&&ae.html`
|
|
38
38
|
<button
|
|
39
39
|
class="cw-header-btn ${t?"cw-btn-active":""}"
|
|
40
40
|
onClick=${y}
|
|
@@ -42,45 +42,45 @@ var ye=Object.defineProperty;var Ye=Object.getOwnPropertyDescriptor;var Ze=Objec
|
|
|
42
42
|
>🐛</button>
|
|
43
43
|
`}
|
|
44
44
|
|
|
45
|
-
${
|
|
45
|
+
${H&&L&&ae.html`
|
|
46
46
|
<button
|
|
47
|
-
class="cw-header-btn ${
|
|
48
|
-
onClick=${
|
|
47
|
+
class="cw-header-btn ${I?"cw-btn-active":""}"
|
|
48
|
+
onClick=${u}
|
|
49
49
|
title="TTS"
|
|
50
|
-
>${
|
|
50
|
+
>${I?"\u{1F50A}":"\u{1F507}"}</button>
|
|
51
51
|
`}
|
|
52
52
|
|
|
53
|
-
${
|
|
53
|
+
${J&&!g&&ae.html`
|
|
54
54
|
<button
|
|
55
55
|
class="cw-header-btn"
|
|
56
|
-
onClick=${
|
|
57
|
-
title=${
|
|
58
|
-
>${
|
|
56
|
+
onClick=${f}
|
|
57
|
+
title=${s?"Minimize":"Expand"}
|
|
58
|
+
>${s?"\u2296":"\u2295"}</button>
|
|
59
59
|
`}
|
|
60
60
|
|
|
61
|
-
${!
|
|
61
|
+
${!g&&ae.html`
|
|
62
62
|
<button
|
|
63
63
|
class="cw-header-btn"
|
|
64
|
-
onClick=${
|
|
64
|
+
onClick=${i}
|
|
65
65
|
title="Close"
|
|
66
66
|
>✕</button>
|
|
67
67
|
`}
|
|
68
68
|
</div>
|
|
69
69
|
</div>
|
|
70
|
-
`}var
|
|
70
|
+
`}var ie=require("htm/preact"),ge=require("preact/compat");var N=require("htm/preact"),oe=require("preact/compat");function Ve({msg:e,show:t,onToggle:s}){return t?N.html`
|
|
71
71
|
<div class="cw-debug-payload">
|
|
72
|
-
<button class="cw-debug-payload-close" onClick=${
|
|
72
|
+
<button class="cw-debug-payload-close" onClick=${s}>×</button>
|
|
73
73
|
<pre class="cw-debug-payload-content">${JSON.stringify(e,null,2)}</pre>
|
|
74
74
|
</div>
|
|
75
|
-
`:
|
|
75
|
+
`:N.html`
|
|
76
76
|
<button
|
|
77
77
|
class="cw-debug-payload-btn"
|
|
78
|
-
onClick=${
|
|
78
|
+
onClick=${s}
|
|
79
79
|
title="Show message payload"
|
|
80
80
|
>{ }</button>
|
|
81
|
-
`}function
|
|
82
|
-
<div class="cw-message-actions cw-message-actions-${
|
|
83
|
-
${
|
|
81
|
+
`}function Ye({onEdit:e,onRetry:t,isLoading:s,position:n,showEdit:a=!0}){return s?null:N.html`
|
|
82
|
+
<div class="cw-message-actions cw-message-actions-${n||"left"}">
|
|
83
|
+
${a&&N.html`
|
|
84
84
|
<button
|
|
85
85
|
class="cw-message-action-btn"
|
|
86
86
|
onClick=${e}
|
|
@@ -104,135 +104,135 @@ var ye=Object.defineProperty;var Ye=Object.getOwnPropertyDescriptor;var Ze=Objec
|
|
|
104
104
|
</svg>
|
|
105
105
|
</button>
|
|
106
106
|
</div>
|
|
107
|
-
`}function
|
|
107
|
+
`}function ht({initialContent:e,onSave:t,onCancel:s}){let[n,a]=(0,oe.useState)(e),l=(0,oe.useRef)(null);return(0,oe.useEffect)(()=>{l.current&&(l.current.focus(),l.current.setSelectionRange(n.length,n.length),l.current.style.height="auto",l.current.style.height=l.current.scrollHeight+"px")},[]),N.html`
|
|
108
108
|
<div class="cw-inline-edit">
|
|
109
109
|
<textarea
|
|
110
110
|
ref=${l}
|
|
111
111
|
class="cw-inline-edit-input"
|
|
112
|
-
value=${
|
|
113
|
-
onInput=${
|
|
114
|
-
onKeyDown=${
|
|
112
|
+
value=${n}
|
|
113
|
+
onInput=${f=>{a(f.target.value),f.target.style.height="auto",f.target.style.height=f.target.scrollHeight+"px"}}
|
|
114
|
+
onKeyDown=${f=>{f.key==="Enter"&&!f.shiftKey?(f.preventDefault(),n.trim()&&t(n.trim())):f.key==="Escape"&&s()}}
|
|
115
115
|
rows="1"
|
|
116
116
|
/>
|
|
117
117
|
<div class="cw-inline-edit-actions">
|
|
118
118
|
<button
|
|
119
119
|
class="cw-inline-edit-btn cw-inline-edit-cancel"
|
|
120
|
-
onClick=${
|
|
120
|
+
onClick=${s}
|
|
121
121
|
title="Cancel (Esc)"
|
|
122
122
|
>Cancel</button>
|
|
123
123
|
<button
|
|
124
124
|
class="cw-inline-edit-btn cw-inline-edit-save"
|
|
125
|
-
onClick=${()=>
|
|
126
|
-
disabled=${!
|
|
125
|
+
onClick=${()=>n.trim()&&t(n.trim())}
|
|
126
|
+
disabled=${!n.trim()}
|
|
127
127
|
title="Save & Resend (Enter)"
|
|
128
128
|
>Save & Send</button>
|
|
129
129
|
</div>
|
|
130
130
|
</div>
|
|
131
|
-
`}function
|
|
132
|
-
<div class="cw-agent-context ${
|
|
133
|
-
<span class="cw-agent-context-icon">${
|
|
131
|
+
`}function _e({msg:e,debugMode:t,markdownParser:s,onEdit:n,onRetry:a,isLoading:l,messageIndex:$}){let[i,f]=(0,oe.useState)(!1),[y,u]=(0,oe.useState)(!1),[k,c]=(0,oe.useState)(!1),C=e.role==="user",o=e.role==="system",g=e.type==="tool_call",w=e.type==="tool_result",v=e.type==="error",T=e.type==="sub_agent_start",m=e.type==="sub_agent_end",H=e.type==="agent_context";if(o&&!t)return null;if(T||m||H)return N.html`
|
|
132
|
+
<div class="cw-agent-context ${T?"cw-agent-delegating":""} ${m?"cw-agent-returned":""}" style="position: relative;">
|
|
133
|
+
<span class="cw-agent-context-icon">${T?"\u{1F517}":m?"\u2713":"\u{1F916}"}</span>
|
|
134
134
|
<span class="cw-agent-context-text">${e.content}</span>
|
|
135
|
-
${e.metadata?.agentName&&
|
|
135
|
+
${e.metadata?.agentName&&N.html`
|
|
136
136
|
<span class="cw-agent-context-name">${e.metadata.agentName}</span>
|
|
137
137
|
`}
|
|
138
|
-
${t&&
|
|
138
|
+
${t&&N.html`<${Ve} msg=${e} show=${y} onToggle=${()=>u(!y)} />`}
|
|
139
139
|
</div>
|
|
140
|
-
`;if(
|
|
141
|
-
<div class="cw-tool-message ${
|
|
142
|
-
<span class="cw-tool-label" onClick=${()=>b&&
|
|
140
|
+
`;if(g||w){let b=e.metadata?.arguments||e.metadata?.result,x=d=>{if(typeof d=="string")try{return JSON.stringify(JSON.parse(d),null,2)}catch{return d}return JSON.stringify(d,null,2)};return N.html`
|
|
141
|
+
<div class="cw-tool-message ${w?"cw-tool-result":"cw-tool-call"}" style="position: relative;">
|
|
142
|
+
<span class="cw-tool-label" onClick=${()=>b&&f(!i)}>
|
|
143
143
|
${e.content}
|
|
144
|
-
${b&&
|
|
144
|
+
${b&&N.html`<span class="cw-tool-expand">${i?"\u25BC":"\u25B6"}</span>`}
|
|
145
145
|
</span>
|
|
146
|
-
${
|
|
147
|
-
<pre class="cw-tool-details">${
|
|
146
|
+
${i&&b&&N.html`
|
|
147
|
+
<pre class="cw-tool-details">${U(x(g?e.metadata.arguments:e.metadata.result))}</pre>
|
|
148
148
|
`}
|
|
149
|
-
${t&&
|
|
149
|
+
${t&&N.html`<${Ve} msg=${e} show=${y} onToggle=${()=>u(!y)} />`}
|
|
150
150
|
</div>
|
|
151
|
-
`}let
|
|
151
|
+
`}let J=["cw-message",C&&"cw-message-user",v&&"cw-message-error"].filter(Boolean).join(" "),I=`cw-message-row ${C?"cw-message-row-user":""}`,D=e.role==="assistant"?be(e.content,s):U(e.content),F=e.files&&e.files.length>0,L=()=>F?N.html`
|
|
152
152
|
<div class="cw-message-attachments">
|
|
153
|
-
${e.files.map(b=>b.type&&b.type.startsWith("image/")?
|
|
153
|
+
${e.files.map(b=>b.type&&b.type.startsWith("image/")?N.html`
|
|
154
154
|
<a class="cw-attachment-thumbnail" href=${b.url} target="_blank" title=${b.name}>
|
|
155
155
|
<img src=${b.url} alt=${b.name} />
|
|
156
156
|
</a>
|
|
157
|
-
`:
|
|
157
|
+
`:N.html`
|
|
158
158
|
<a class="cw-attachment-file" href=${b.url} target="_blank" title=${b.name}>
|
|
159
|
-
<span class="cw-attachment-icon">${
|
|
159
|
+
<span class="cw-attachment-icon">${me(b.type)}</span>
|
|
160
160
|
<span class="cw-attachment-info">
|
|
161
161
|
<span class="cw-attachment-name">${b.name}</span>
|
|
162
|
-
<span class="cw-attachment-size">${
|
|
162
|
+
<span class="cw-attachment-size">${he(b.size)}</span>
|
|
163
163
|
</span>
|
|
164
164
|
</a>
|
|
165
165
|
`)}
|
|
166
166
|
</div>
|
|
167
|
-
`:null,
|
|
168
|
-
<div class=${
|
|
169
|
-
${
|
|
170
|
-
<${
|
|
167
|
+
`:null,z=b=>{c(!1),n&&n($,b)},V=()=>{a&&a($)};if(C&&k)return N.html`
|
|
168
|
+
<div class=${I} style="position: relative;">
|
|
169
|
+
${L()}
|
|
170
|
+
<${ht}
|
|
171
171
|
initialContent=${e.content}
|
|
172
|
-
onSave=${
|
|
173
|
-
onCancel=${()=>
|
|
172
|
+
onSave=${z}
|
|
173
|
+
onCancel=${()=>c(!1)}
|
|
174
174
|
/>
|
|
175
175
|
</div>
|
|
176
|
-
`;let
|
|
177
|
-
<div class="${
|
|
178
|
-
${
|
|
179
|
-
${
|
|
176
|
+
`;let h=C&&n&&a,p=e.role==="assistant"&&a&&!l;return N.html`
|
|
177
|
+
<div class="${I} ${h||p?"cw-message-row-with-actions":""}">
|
|
178
|
+
${L()}
|
|
179
|
+
${h&&N.html`
|
|
180
180
|
<div class="cw-user-actions-wrapper">
|
|
181
|
-
<${
|
|
182
|
-
onEdit=${()=>
|
|
183
|
-
onRetry=${
|
|
181
|
+
<${Ye}
|
|
182
|
+
onEdit=${()=>c(!0)}
|
|
183
|
+
onRetry=${V}
|
|
184
184
|
isLoading=${l}
|
|
185
185
|
position="left"
|
|
186
186
|
showEdit=${!0}
|
|
187
187
|
/>
|
|
188
|
-
<div class=${
|
|
188
|
+
<div class=${J} dangerouslySetInnerHTML=${{__html:D}} />
|
|
189
189
|
</div>
|
|
190
190
|
`}
|
|
191
|
-
${!
|
|
192
|
-
<div class=${
|
|
191
|
+
${!h&&N.html`
|
|
192
|
+
<div class=${J} dangerouslySetInnerHTML=${{__html:D}} />
|
|
193
193
|
`}
|
|
194
|
-
${
|
|
195
|
-
<${
|
|
196
|
-
onRetry=${
|
|
194
|
+
${p&&N.html`
|
|
195
|
+
<${Ye}
|
|
196
|
+
onRetry=${V}
|
|
197
197
|
isLoading=${l}
|
|
198
198
|
position="right"
|
|
199
199
|
showEdit=${!1}
|
|
200
200
|
/>
|
|
201
201
|
`}
|
|
202
|
-
${t&&
|
|
202
|
+
${t&&N.html`<${Ve} msg=${e} show=${y} onToggle=${()=>u(!y)} />`}
|
|
203
203
|
</div>
|
|
204
|
-
`}function
|
|
205
|
-
<div class="cw-messages" ref=${k} onScroll=${
|
|
206
|
-
${
|
|
204
|
+
`}function Me({messages:e,isLoading:t,hasMoreMessages:s,loadingMoreMessages:n,onLoadMore:a,onEditMessage:l,onRetryMessage:$,debugMode:i,markdownParser:f,emptyStateTitle:y,emptyStateMessage:u}){let k=(0,ge.useRef)(null),c=(0,ge.useRef)(!0),C=g=>{let w=g.target,v=w.scrollHeight-w.scrollTop-w.clientHeight<100;if(c.current=v,w.scrollTop<50&&s&&!n){let T=w.scrollHeight;a().then(()=>{let m=w.scrollHeight;w.scrollTop=m-T+w.scrollTop})}};(0,ge.useEffect)(()=>{let g=k.current;g&&c.current&&requestAnimationFrame(()=>{g.scrollTop=g.scrollHeight})},[e,t]),(0,ge.useEffect)(()=>{let g=k.current;g&&e.length<=2&&(c.current=!0,requestAnimationFrame(()=>{g.scrollTop=g.scrollHeight}))},[e.length]);let o=e.length===0;return ie.html`
|
|
205
|
+
<div class="cw-messages" ref=${k} onScroll=${C}>
|
|
206
|
+
${o&&ie.html`
|
|
207
207
|
<div class="cw-empty-state">
|
|
208
208
|
<svg class="cw-empty-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
209
209
|
<path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"></path>
|
|
210
210
|
</svg>
|
|
211
|
-
<h3>${
|
|
212
|
-
<p>${
|
|
211
|
+
<h3>${U(y)}</h3>
|
|
212
|
+
<p>${U(u)}</p>
|
|
213
213
|
</div>
|
|
214
214
|
`}
|
|
215
215
|
|
|
216
|
-
${!
|
|
217
|
-
<div class="cw-load-more" onClick=${
|
|
218
|
-
${
|
|
216
|
+
${!o&&s&&ie.html`
|
|
217
|
+
<div class="cw-load-more" onClick=${a}>
|
|
218
|
+
${n?ie.html`<span class="cw-spinner"></span><span>Loading...</span>`:ie.html`<span>↑ Scroll up or click to load older messages</span>`}
|
|
219
219
|
</div>
|
|
220
220
|
`}
|
|
221
221
|
|
|
222
|
-
${e.map((
|
|
223
|
-
<${
|
|
224
|
-
key=${
|
|
225
|
-
msg=${
|
|
226
|
-
messageIndex=${
|
|
227
|
-
debugMode=${
|
|
228
|
-
markdownParser=${
|
|
222
|
+
${e.map((g,w)=>ie.html`
|
|
223
|
+
<${_e}
|
|
224
|
+
key=${g.id}
|
|
225
|
+
msg=${g}
|
|
226
|
+
messageIndex=${w}
|
|
227
|
+
debugMode=${i}
|
|
228
|
+
markdownParser=${f}
|
|
229
229
|
onEdit=${l}
|
|
230
|
-
onRetry=${
|
|
230
|
+
onRetry=${$}
|
|
231
231
|
isLoading=${t}
|
|
232
232
|
/>
|
|
233
233
|
`)}
|
|
234
234
|
|
|
235
|
-
${t&&
|
|
235
|
+
${t&&ie.html`
|
|
236
236
|
<div class="cw-message-row">
|
|
237
237
|
<div class="cw-typing">
|
|
238
238
|
<span class="cw-spinner"></span>
|
|
@@ -241,41 +241,41 @@ var ye=Object.defineProperty;var Ye=Object.getOwnPropertyDescriptor;var Ze=Objec
|
|
|
241
241
|
</div>
|
|
242
242
|
`}
|
|
243
243
|
</div>
|
|
244
|
-
`}var
|
|
244
|
+
`}var te=require("htm/preact"),G=require("preact/compat");var Ue=typeof window<"u"?window.SpeechRecognition||window.webkitSpeechRecognition:null;function xe({onSend:e,onCancel:t,isLoading:s,placeholder:n,primaryColor:a,enableVoice:l=!0,enableFiles:$=!0}){let[i,f]=(0,G.useState)(""),[y,u]=(0,G.useState)([]),[k,c]=(0,G.useState)(!1),[C,o]=(0,G.useState)(!1),[g]=(0,G.useState)(()=>!!Ue),w=(0,G.useRef)(null),v=(0,G.useRef)(null),T=(0,G.useRef)(null),m=(0,G.useRef)(!1);(0,G.useEffect)(()=>{!s&&w.current&&w.current.focus()},[s]),(0,G.useEffect)(()=>{w.current&&(w.current.style.height="auto",w.current.style.height=Math.min(w.current.scrollHeight,150)+"px")},[i]),(0,G.useEffect)(()=>()=>{m.current=!1,T.current&&T.current.abort()},[]);let H=d=>{d.preventDefault(),(i.trim()||y.length>0)&&!s&&(e(i,y),f(""),u([]),w.current&&(w.current.style.height="auto"),v.current&&(v.current.value=""))},J=d=>{let A=Array.from(d.target.files||[]);A.length>0&&u(P=>[...P,...A])},I=d=>{u(A=>A.filter((P,r)=>r!==d))},D=d=>{d.preventDefault(),v.current&&!s&&v.current.click()},F=d=>{d.key==="Enter"&&!d.shiftKey&&(d.preventDefault(),H(d))},L=d=>{s&&t&&(d.preventDefault(),t())},z=()=>{if(!Ue||s)return;m.current=!0;let d=new Ue;d.continuous=!0,d.interimResults=!0,d.lang=navigator.language||"en-US";let A=i,P="";d.onstart=()=>{o(!0)},d.onresult=r=>{P="";for(let E=r.resultIndex;E<r.results.length;E++){let W=r.results[E][0].transcript;r.results[E].isFinal?A+=(A?" ":"")+W:P+=W}f(A+(P?" "+P:""))},d.onerror=r=>{if(r.error==="no-speech"||r.error==="aborted"){console.log("[ChatWidget] Speech recognition:",r.error,"- continuing...");return}console.warn("[ChatWidget] Speech recognition error:",r.error),m.current=!1,o(!1),f(A||i)},d.onend=()=>{if(m.current){console.log("[ChatWidget] Recognition paused, restarting...");try{d.start();return}catch(r){console.warn("[ChatWidget] Could not restart recognition:",r)}}o(!1),A&&f(A),T.current=null},T.current=d,d.start()},V=()=>{m.current=!1,T.current&&T.current.stop()},h=d=>{d.preventDefault(),C?V():z()},M=te.html`
|
|
245
245
|
<svg width="14" height="14" viewBox="0 0 14 14" fill="currentColor">
|
|
246
246
|
<rect x="2" y="2" width="10" height="10" rx="1" />
|
|
247
247
|
</svg>
|
|
248
|
-
`,
|
|
248
|
+
`,p=te.html`
|
|
249
249
|
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
250
250
|
<path d="M12 1a3 3 0 0 0-3 3v8a3 3 0 0 0 6 0V4a3 3 0 0 0-3-3z"></path>
|
|
251
251
|
<path d="M19 10v2a7 7 0 0 1-14 0v-2"></path>
|
|
252
252
|
<line x1="12" y1="19" x2="12" y2="23"></line>
|
|
253
253
|
<line x1="8" y1="23" x2="16" y2="23"></line>
|
|
254
254
|
</svg>
|
|
255
|
-
`,
|
|
255
|
+
`,S=te.html`
|
|
256
256
|
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
257
257
|
<path d="M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48"></path>
|
|
258
258
|
</svg>
|
|
259
|
-
`,b=l&&
|
|
260
|
-
<form class="cw-input-form" onSubmit=${
|
|
259
|
+
`,b=l&&g,x=$;return te.html`
|
|
260
|
+
<form class="cw-input-form" onSubmit=${H}>
|
|
261
261
|
<input
|
|
262
262
|
type="file"
|
|
263
|
-
ref=${
|
|
263
|
+
ref=${v}
|
|
264
264
|
style="display: none"
|
|
265
265
|
multiple
|
|
266
|
-
onChange=${
|
|
266
|
+
onChange=${J}
|
|
267
267
|
/>
|
|
268
|
-
${y.length>0&&
|
|
268
|
+
${y.length>0&&te.html`
|
|
269
269
|
<div class="cw-file-chips">
|
|
270
|
-
${y.map((
|
|
271
|
-
<div class="cw-file-chip" key=${
|
|
272
|
-
<span class="cw-file-chip-icon">${
|
|
273
|
-
<span class="cw-file-chip-name" title=${
|
|
274
|
-
<span class="cw-file-chip-size">(${
|
|
270
|
+
${y.map((d,A)=>te.html`
|
|
271
|
+
<div class="cw-file-chip" key=${A}>
|
|
272
|
+
<span class="cw-file-chip-icon">${me(d.type)}</span>
|
|
273
|
+
<span class="cw-file-chip-name" title=${d.name}>${d.name.length>20?d.name.substring(0,17)+"...":d.name}</span>
|
|
274
|
+
<span class="cw-file-chip-size">(${he(d.size)})</span>
|
|
275
275
|
<button
|
|
276
276
|
type="button"
|
|
277
277
|
class="cw-file-chip-remove"
|
|
278
|
-
onClick=${()=>
|
|
278
|
+
onClick=${()=>I(A)}
|
|
279
279
|
title="Remove file"
|
|
280
280
|
>×</button>
|
|
281
281
|
</div>
|
|
@@ -283,54 +283,54 @@ var ye=Object.defineProperty;var Ye=Object.getOwnPropertyDescriptor;var Ze=Objec
|
|
|
283
283
|
</div>
|
|
284
284
|
`}
|
|
285
285
|
<textarea
|
|
286
|
-
ref=${
|
|
286
|
+
ref=${w}
|
|
287
287
|
class="cw-input"
|
|
288
|
-
placeholder=${
|
|
289
|
-
value=${
|
|
290
|
-
onInput=${
|
|
291
|
-
onKeyDown=${
|
|
292
|
-
disabled=${
|
|
288
|
+
placeholder=${U(n)}
|
|
289
|
+
value=${i}
|
|
290
|
+
onInput=${d=>f(d.target.value)}
|
|
291
|
+
onKeyDown=${F}
|
|
292
|
+
disabled=${s}
|
|
293
293
|
rows="1"
|
|
294
294
|
/>
|
|
295
|
-
${
|
|
295
|
+
${x&&te.html`
|
|
296
296
|
<button
|
|
297
297
|
type="button"
|
|
298
298
|
class="cw-attach-btn"
|
|
299
|
-
onClick=${
|
|
300
|
-
disabled=${
|
|
299
|
+
onClick=${D}
|
|
300
|
+
disabled=${s}
|
|
301
301
|
title="Attach files"
|
|
302
302
|
>
|
|
303
|
-
${
|
|
303
|
+
${S}
|
|
304
304
|
</button>
|
|
305
305
|
`}
|
|
306
|
-
${b&&
|
|
306
|
+
${b&&te.html`
|
|
307
307
|
<button
|
|
308
308
|
type="button"
|
|
309
|
-
class=${`cw-voice-btn ${
|
|
310
|
-
onClick=${
|
|
311
|
-
disabled=${
|
|
312
|
-
title=${
|
|
309
|
+
class=${`cw-voice-btn ${C?"cw-voice-btn-recording":""}`}
|
|
310
|
+
onClick=${h}
|
|
311
|
+
disabled=${s}
|
|
312
|
+
title=${C?"Stop recording":"Voice input"}
|
|
313
313
|
>
|
|
314
|
-
${
|
|
314
|
+
${p}
|
|
315
315
|
</button>
|
|
316
316
|
`}
|
|
317
317
|
<button
|
|
318
|
-
type=${
|
|
319
|
-
class=${`cw-send-btn ${
|
|
320
|
-
style=${{backgroundColor:
|
|
321
|
-
onClick=${
|
|
322
|
-
onMouseEnter=${()=>
|
|
323
|
-
onMouseLeave=${()=>
|
|
324
|
-
title=${
|
|
318
|
+
type=${s?"button":"submit"}
|
|
319
|
+
class=${`cw-send-btn ${s?"cw-send-btn-loading":""} ${s&&k?"cw-send-btn-stop":""}`}
|
|
320
|
+
style=${{backgroundColor:s&&k?"#dc2626":a}}
|
|
321
|
+
onClick=${L}
|
|
322
|
+
onMouseEnter=${()=>c(!0)}
|
|
323
|
+
onMouseLeave=${()=>c(!1)}
|
|
324
|
+
title=${s?"Stop":"Send"}
|
|
325
325
|
>
|
|
326
|
-
${
|
|
326
|
+
${s?k?M:te.html`<span class="cw-spinner"></span>`:"\u27A4"}
|
|
327
327
|
</button>
|
|
328
328
|
</form>
|
|
329
|
-
`}var
|
|
329
|
+
`}var ye=require("htm/preact");function Ee({isOpen:e,conversations:t,conversationsLoading:s,currentConversationId:n,onClose:a,onNewConversation:l,onSwitchConversation:$}){return ye.html`
|
|
330
330
|
<div class="cw-sidebar ${e?"cw-sidebar-open":""}">
|
|
331
331
|
<div class="cw-sidebar-header">
|
|
332
332
|
<span>Conversations</span>
|
|
333
|
-
<button class="cw-sidebar-close" onClick=${
|
|
333
|
+
<button class="cw-sidebar-close" onClick=${a}>✕</button>
|
|
334
334
|
</div>
|
|
335
335
|
|
|
336
336
|
<button class="cw-new-conversation" onClick=${l}>
|
|
@@ -338,24 +338,24 @@ var ye=Object.defineProperty;var Ye=Object.getOwnPropertyDescriptor;var Ze=Objec
|
|
|
338
338
|
</button>
|
|
339
339
|
|
|
340
340
|
<div class="cw-conversation-list">
|
|
341
|
-
${
|
|
341
|
+
${s&&ye.html`
|
|
342
342
|
<div class="cw-sidebar-loading">
|
|
343
343
|
<span class="cw-spinner"></span>
|
|
344
344
|
</div>
|
|
345
345
|
`}
|
|
346
346
|
|
|
347
|
-
${!
|
|
347
|
+
${!s&&t.length===0&&ye.html`
|
|
348
348
|
<div class="cw-sidebar-empty">No conversations yet</div>
|
|
349
349
|
`}
|
|
350
350
|
|
|
351
|
-
${t.map(
|
|
351
|
+
${t.map(i=>ye.html`
|
|
352
352
|
<div
|
|
353
|
-
key=${
|
|
354
|
-
class="cw-conversation-item ${
|
|
355
|
-
onClick=${()
|
|
353
|
+
key=${i.id}
|
|
354
|
+
class="cw-conversation-item ${i.id===n?"cw-conversation-active":""}"
|
|
355
|
+
onClick=${()=>$(i.id)}
|
|
356
356
|
>
|
|
357
|
-
<div class="cw-conversation-title">${
|
|
358
|
-
<div class="cw-conversation-date">${
|
|
357
|
+
<div class="cw-conversation-title">${U(i.title||"Untitled")}</div>
|
|
358
|
+
<div class="cw-conversation-date">${ke(i.updatedAt||i.createdAt)}</div>
|
|
359
359
|
</div>
|
|
360
360
|
`)}
|
|
361
361
|
</div>
|
|
@@ -363,9 +363,9 @@ var ye=Object.defineProperty;var Ye=Object.getOwnPropertyDescriptor;var Ze=Objec
|
|
|
363
363
|
|
|
364
364
|
<div
|
|
365
365
|
class="cw-sidebar-overlay ${e?"cw-sidebar-overlay-visible":""}"
|
|
366
|
-
onClick=${
|
|
366
|
+
onClick=${a}
|
|
367
367
|
/>
|
|
368
|
-
`}var
|
|
368
|
+
`}var ce=require("htm/preact"),Xe=require("preact/compat");function Ie({availableModels:e,selectedModel:t,onSelectModel:s,thinkingEnabled:n,onToggleThinking:a,disabled:l}){let[$,i]=(0,Xe.useState)(!1);if(!e||e.length===0)return null;let f=e.find(o=>o.id===t),y=f?.name||"Select Model",u=f?.supports_thinking||!1,k=()=>{l||i(!$)},c=o=>{s(o),i(!1)},C=o=>{o.stopPropagation(),a&&u&&a(!n)};return ce.html`
|
|
369
369
|
<div class="cw-model-selector">
|
|
370
370
|
<button
|
|
371
371
|
class="cw-model-btn"
|
|
@@ -374,63 +374,63 @@ var ye=Object.defineProperty;var Ye=Object.getOwnPropertyDescriptor;var Ze=Objec
|
|
|
374
374
|
title="Select Model"
|
|
375
375
|
>
|
|
376
376
|
<span class="cw-model-icon">🤖</span>
|
|
377
|
-
<span class="cw-model-name">${
|
|
378
|
-
<span class="cw-model-chevron">${
|
|
377
|
+
<span class="cw-model-name">${U(y)}</span>
|
|
378
|
+
<span class="cw-model-chevron">${$?"\u25B2":"\u25BC"}</span>
|
|
379
379
|
</button>
|
|
380
380
|
|
|
381
|
-
${
|
|
381
|
+
${u&&a&&ce.html`
|
|
382
382
|
<button
|
|
383
|
-
class="cw-thinking-toggle ${
|
|
384
|
-
onClick=${
|
|
383
|
+
class="cw-thinking-toggle ${n?"cw-thinking-enabled":""}"
|
|
384
|
+
onClick=${C}
|
|
385
385
|
disabled=${l}
|
|
386
|
-
title=${
|
|
386
|
+
title=${n?"Thinking enabled - click to disable":"Enable extended thinking"}
|
|
387
387
|
>
|
|
388
388
|
<span class="cw-thinking-icon">🧠</span>
|
|
389
389
|
</button>
|
|
390
390
|
`}
|
|
391
391
|
|
|
392
|
-
${
|
|
392
|
+
${$&&ce.html`
|
|
393
393
|
<div class="cw-model-dropdown">
|
|
394
|
-
${e.map(
|
|
394
|
+
${e.map(o=>ce.html`
|
|
395
395
|
<button
|
|
396
|
-
key=${
|
|
397
|
-
class="cw-model-option ${
|
|
398
|
-
onClick=${()=>
|
|
396
|
+
key=${o.id}
|
|
397
|
+
class="cw-model-option ${o.id===t?"cw-model-option-selected":""}"
|
|
398
|
+
onClick=${()=>c(o.id)}
|
|
399
399
|
>
|
|
400
400
|
<span class="cw-model-option-name">
|
|
401
|
-
${
|
|
402
|
-
${
|
|
401
|
+
${U(o.name)}
|
|
402
|
+
${o.supports_thinking&&ce.html`<span class="cw-thinking-badge" title="Supports extended thinking">🧠</span>`}
|
|
403
403
|
</span>
|
|
404
|
-
<span class="cw-model-option-provider">${
|
|
405
|
-
${
|
|
406
|
-
<span class="cw-model-option-desc">${
|
|
404
|
+
<span class="cw-model-option-provider">${U(o.provider)}</span>
|
|
405
|
+
${o.description&&ce.html`
|
|
406
|
+
<span class="cw-model-option-desc">${U(o.description)}</span>
|
|
407
407
|
`}
|
|
408
408
|
</button>
|
|
409
409
|
`)}
|
|
410
410
|
</div>
|
|
411
411
|
`}
|
|
412
412
|
</div>
|
|
413
|
-
`}var
|
|
414
|
-
<div class="cw-task-item ${k}" style=${{paddingLeft:`${
|
|
413
|
+
`}var se=require("htm/preact"),re=require("preact/compat"),mt={not_started:"\u25CB",in_progress:"\u25D0",complete:"\u25CF",cancelled:"\u2298"},gt={not_started:"Not Started",in_progress:"In Progress",complete:"Complete",cancelled:"Cancelled"};function ft({task:e,onUpdate:t,onRemove:s,depth:n=0}){let[a,l]=(0,re.useState)(!1),[$,i]=(0,re.useState)(e.name),f=(0,re.useCallback)(()=>{let c={not_started:"in_progress",in_progress:"complete",complete:"not_started",cancelled:"not_started"};t(e.id,{state:c[e.state]||"not_started"})},[e,t]),y=(0,re.useCallback)(()=>{$.trim()&&$!==e.name&&t(e.id,{name:$.trim()}),l(!1)},[e,$,t]),u=(0,re.useCallback)(c=>{c.key==="Enter"&&y(),c.key==="Escape"&&(i(e.name),l(!1))},[y,e.name]),k=`cw-task-state-${e.state.replace("_","-")}`;return se.html`
|
|
414
|
+
<div class="cw-task-item ${k}" style=${{paddingLeft:`${n*16+8}px`}}>
|
|
415
415
|
<button
|
|
416
416
|
class="cw-task-state-btn"
|
|
417
|
-
onClick=${
|
|
418
|
-
title=${
|
|
417
|
+
onClick=${f}
|
|
418
|
+
title=${gt[e.state]}
|
|
419
419
|
>
|
|
420
|
-
${
|
|
420
|
+
${mt[e.state]}
|
|
421
421
|
</button>
|
|
422
422
|
|
|
423
|
-
${
|
|
423
|
+
${a?se.html`
|
|
424
424
|
<input
|
|
425
425
|
type="text"
|
|
426
426
|
class="cw-task-edit-input"
|
|
427
|
-
value=${
|
|
428
|
-
onInput=${
|
|
427
|
+
value=${$}
|
|
428
|
+
onInput=${c=>i(c.target.value)}
|
|
429
429
|
onBlur=${y}
|
|
430
|
-
onKeyDown=${
|
|
430
|
+
onKeyDown=${u}
|
|
431
431
|
autoFocus
|
|
432
432
|
/>
|
|
433
|
-
`:
|
|
433
|
+
`:se.html`
|
|
434
434
|
<span
|
|
435
435
|
class="cw-task-name"
|
|
436
436
|
onClick=${()=>l(!0)}
|
|
@@ -442,22 +442,22 @@ var ye=Object.defineProperty;var Ye=Object.getOwnPropertyDescriptor;var Ze=Objec
|
|
|
442
442
|
|
|
443
443
|
<button
|
|
444
444
|
class="cw-task-remove-btn"
|
|
445
|
-
onClick=${()=>
|
|
445
|
+
onClick=${()=>s(e.id)}
|
|
446
446
|
title="Remove task"
|
|
447
447
|
>
|
|
448
448
|
×
|
|
449
449
|
</button>
|
|
450
450
|
</div>
|
|
451
|
-
`}function
|
|
452
|
-
<${
|
|
451
|
+
`}function Ae({tasks:e,progress:t,isLoading:s,error:n,onUpdate:a,onRemove:l,onClear:$,onRefresh:i}){let f=(0,re.useCallback)(k=>{let c=new Map,C=[];return k.forEach(o=>{c.set(o.id,{...o,children:[]})}),k.forEach(o=>{let g=c.get(o.id);o.parent_id&&c.has(o.parent_id)?c.get(o.parent_id).children.push(g):C.push(g)}),C},[]),y=(0,re.useCallback)((k,c=0)=>se.html`
|
|
452
|
+
<${ft}
|
|
453
453
|
key=${k.id}
|
|
454
454
|
task=${k}
|
|
455
|
-
depth=${
|
|
456
|
-
onUpdate=${
|
|
455
|
+
depth=${c}
|
|
456
|
+
onUpdate=${a}
|
|
457
457
|
onRemove=${l}
|
|
458
458
|
/>
|
|
459
|
-
${k.children?.map(
|
|
460
|
-
`,[
|
|
459
|
+
${k.children?.map(C=>y(C,c+1))}
|
|
460
|
+
`,[a,l]),u=f(e);return s&&e.length===0?se.html`<div class="cw-tasks-loading">Loading tasks...</div>`:se.html`
|
|
461
461
|
<div class="cw-tasks-container">
|
|
462
462
|
<div class="cw-tasks-header">
|
|
463
463
|
<div class="cw-tasks-progress">
|
|
@@ -472,25 +472,118 @@ var ye=Object.defineProperty;var Ye=Object.getOwnPropertyDescriptor;var Ze=Objec
|
|
|
472
472
|
</div>
|
|
473
473
|
</div>
|
|
474
474
|
<div class="cw-tasks-actions">
|
|
475
|
-
<button class="cw-tasks-action-btn" onClick=${
|
|
476
|
-
${e.length>0&&
|
|
477
|
-
<button class="cw-tasks-action-btn" onClick=${
|
|
475
|
+
<button class="cw-tasks-action-btn" onClick=${i} title="Refresh">↻</button>
|
|
476
|
+
${e.length>0&&se.html`
|
|
477
|
+
<button class="cw-tasks-action-btn" onClick=${$} title="Clear all">🗑</button>
|
|
478
478
|
`}
|
|
479
479
|
</div>
|
|
480
480
|
</div>
|
|
481
481
|
|
|
482
|
-
${
|
|
482
|
+
${n&&se.html`<div class="cw-tasks-error">${n}</div>`}
|
|
483
483
|
|
|
484
484
|
<div class="cw-tasks-list">
|
|
485
|
-
${
|
|
485
|
+
${u.length===0?se.html`
|
|
486
486
|
<div class="cw-tasks-empty">
|
|
487
487
|
<p>No tasks yet</p>
|
|
488
488
|
<p class="cw-tasks-empty-hint">Tasks will appear here when the agent creates them</p>
|
|
489
489
|
</div>
|
|
490
|
-
`:
|
|
490
|
+
`:u.map(k=>y(k))}
|
|
491
|
+
</div>
|
|
492
|
+
</div>
|
|
493
|
+
`}var Y=require("htm/preact");function Ze({systems:e,agents:t,selectedSystem:s,selectedAgent:n,selectedSystemVersion:a,selectedAgentVersion:l,onSelectSystem:$,onSelectAgent:i,onSelectSystemVersion:f,onSelectAgentVersion:y,disabled:u}){let k=e.find(m=>m.slug===s),c=t.find(m=>m.slug===n),C=k?.versions||[],o=c?.versions||[];if(e.length===0&&t.length===0)return null;let g=e.length>1,w=t.length>1,v=C.length>1,T=o.length>1;return Y.html`
|
|
494
|
+
<div class="cw-dev-toolbar">
|
|
495
|
+
<div class="cw-dev-toolbar-label">
|
|
496
|
+
<span class="cw-dev-toolbar-icon">🛠️</span>
|
|
497
|
+
<span>Dev</span>
|
|
498
|
+
</div>
|
|
499
|
+
|
|
500
|
+
<div class="cw-dev-toolbar-selectors">
|
|
501
|
+
<!-- System -->
|
|
502
|
+
<div class="cw-dev-select-group">
|
|
503
|
+
<label class="cw-dev-label">System</label>
|
|
504
|
+
${g?Y.html`
|
|
505
|
+
<select
|
|
506
|
+
class="cw-dev-select"
|
|
507
|
+
value=${s||""}
|
|
508
|
+
onChange=${m=>$(m.target.value)}
|
|
509
|
+
disabled=${u}
|
|
510
|
+
>
|
|
511
|
+
${e.map(m=>Y.html`
|
|
512
|
+
<option key=${m.slug} value=${m.slug}>
|
|
513
|
+
${m.name}
|
|
514
|
+
</option>
|
|
515
|
+
`)}
|
|
516
|
+
</select>
|
|
517
|
+
`:Y.html`
|
|
518
|
+
<span class="cw-dev-badge">${k?.name||"\u2014"}</span>
|
|
519
|
+
`}
|
|
520
|
+
</div>
|
|
521
|
+
|
|
522
|
+
<!-- System Version -->
|
|
523
|
+
<div class="cw-dev-select-group">
|
|
524
|
+
<label class="cw-dev-label">Sys Ver</label>
|
|
525
|
+
${v?Y.html`
|
|
526
|
+
<select
|
|
527
|
+
class="cw-dev-select"
|
|
528
|
+
value=${a||""}
|
|
529
|
+
onChange=${m=>f(m.target.value||null)}
|
|
530
|
+
disabled=${u}
|
|
531
|
+
>
|
|
532
|
+
${C.map(m=>Y.html`
|
|
533
|
+
<option key=${m.version} value=${m.version}>
|
|
534
|
+
${m.version}${m.is_active?" \u2713":""}${m.is_draft?" (draft)":""}
|
|
535
|
+
</option>
|
|
536
|
+
`)}
|
|
537
|
+
</select>
|
|
538
|
+
`:Y.html`
|
|
539
|
+
<span class="cw-dev-badge">${C.length===1?C[0].version:"none"}</span>
|
|
540
|
+
`}
|
|
541
|
+
</div>
|
|
542
|
+
|
|
543
|
+
<!-- Agent -->
|
|
544
|
+
<div class="cw-dev-select-group">
|
|
545
|
+
<label class="cw-dev-label">Agent</label>
|
|
546
|
+
${w?Y.html`
|
|
547
|
+
<select
|
|
548
|
+
class="cw-dev-select"
|
|
549
|
+
value=${n||""}
|
|
550
|
+
onChange=${m=>i(m.target.value)}
|
|
551
|
+
disabled=${u}
|
|
552
|
+
>
|
|
553
|
+
${t.map(m=>Y.html`
|
|
554
|
+
<option key=${m.slug} value=${m.slug}>
|
|
555
|
+
${m.name}${k?.entry_agent?.slug===m.slug?" \u2605":""}
|
|
556
|
+
</option>
|
|
557
|
+
`)}
|
|
558
|
+
</select>
|
|
559
|
+
`:Y.html`
|
|
560
|
+
<span class="cw-dev-badge">${c?.name||t[0]?.name||"\u2014"}${k?.entry_agent?.slug===(c?.slug||t[0]?.slug)?" \u2605":""}</span>
|
|
561
|
+
`}
|
|
562
|
+
</div>
|
|
563
|
+
|
|
564
|
+
<!-- Agent Version -->
|
|
565
|
+
<div class="cw-dev-select-group">
|
|
566
|
+
<label class="cw-dev-label">Agent Ver</label>
|
|
567
|
+
${T?Y.html`
|
|
568
|
+
<select
|
|
569
|
+
class="cw-dev-select"
|
|
570
|
+
value=${l||""}
|
|
571
|
+
onChange=${m=>y(m.target.value||null)}
|
|
572
|
+
disabled=${u}
|
|
573
|
+
>
|
|
574
|
+
${o.map(m=>Y.html`
|
|
575
|
+
<option key=${m.version} value=${m.version}>
|
|
576
|
+
${m.version}${m.is_active?" \u2713":""}${m.is_draft?" (draft)":""}
|
|
577
|
+
</option>
|
|
578
|
+
`)}
|
|
579
|
+
</select>
|
|
580
|
+
`:Y.html`
|
|
581
|
+
<span class="cw-dev-badge">${o.length===1?o[0].version:c?.active_version||"\u2014"}</span>
|
|
582
|
+
`}
|
|
583
|
+
</div>
|
|
491
584
|
</div>
|
|
492
585
|
</div>
|
|
493
|
-
`}var D=require("preact/compat");function Ee(e,t,n){let[a,o]=(0,D.useState)([]),[l,h]=(0,D.useState)(!1),[u,m]=(0,D.useState)(null),[y,f]=(0,D.useState)(()=>n?.get(e.conversationIdKey)||null),[k,d]=(0,D.useState)(!1),[v,c]=(0,D.useState)(!1),[p,g]=(0,D.useState)(0),$=(0,D.useRef)(null),S=(0,D.useRef)(null);(0,D.useEffect)(()=>{y&&n?.set(e.conversationIdKey,y)},[y,e.conversationIdKey,n]);let R=(0,D.useCallback)(async(s,C,T)=>{$.current&&$.current.close();let _=e.apiPaths.runEvents.replace("{runId}",s),b=`${e.backendUrl}${_}`;C&&(b+=`?anonymous_token=${encodeURIComponent(C)}`);let M=new EventSource(b);$.current=M;let i="";M.addEventListener("assistant.message",A=>{try{let r=JSON.parse(A.data);e.onEvent&&e.onEvent("assistant.message",r.payload);let x=r.payload.content;x&&(i+=x,o(w=>{let O=w[w.length-1];return O?.role==="assistant"&&O.id.startsWith("assistant-stream-")?[...w.slice(0,-1),{...O,content:i}]:[...w,{id:"assistant-stream-"+Date.now(),role:"assistant",content:i,timestamp:new Date,type:"message"}]}))}catch(r){console.error("[ChatWidget] Parse error:",r)}}),M.addEventListener("tool.call",A=>{try{let r=JSON.parse(A.data);e.onEvent&&e.onEvent("tool.call",r.payload),o(x=>[...x,{id:"tool-call-"+Date.now(),role:"assistant",content:`\u{1F527} ${r.payload.name}`,timestamp:new Date,type:"tool_call",metadata:{toolName:r.payload.name,arguments:r.payload.arguments,toolCallId:r.payload.id}}])}catch(r){console.error("[ChatWidget] Parse error:",r)}}),M.addEventListener("tool.result",A=>{try{let r=JSON.parse(A.data);e.onEvent&&e.onEvent("tool.result",r.payload);let x=r.payload.result,w=x?.error;o(O=>[...O,{id:"tool-result-"+Date.now(),role:"system",content:w?`\u274C ${x.error}`:"\u2713 Done",timestamp:new Date,type:"tool_result",metadata:{toolName:r.payload.name,result:x,toolCallId:r.payload.tool_call_id}}])}catch(r){console.error("[ChatWidget] Parse error:",r)}}),M.addEventListener("custom",A=>{try{let r=JSON.parse(A.data);e.onEvent&&e.onEvent("custom",r.payload),r.payload?.type==="ui_control"&&e.onUIControl&&e.onUIControl(r.payload),r.payload?.type==="agent_context"&&o(x=>[...x,{id:"agent-context-"+Date.now(),role:"system",content:`\u{1F517} ${r.payload.agent_name||"Sub-agent"} is now handling this request`,timestamp:new Date,type:"agent_context",metadata:{agentKey:r.payload.agent_key,agentName:r.payload.agent_name,action:r.payload.action}}])}catch(r){console.error("[ChatWidget] Parse error:",r)}}),M.addEventListener("sub_agent.start",A=>{try{let r=JSON.parse(A.data);e.onEvent&&e.onEvent("sub_agent.start",r.payload),o(x=>[...x,{id:"sub-agent-start-"+Date.now(),role:"system",content:`\u{1F517} Delegating to ${r.payload.agent_name||r.payload.sub_agent_key||"sub-agent"}...`,timestamp:new Date,type:"sub_agent_start",metadata:{subAgentKey:r.payload.sub_agent_key,agentName:r.payload.agent_name,invocationMode:r.payload.invocation_mode}}])}catch(r){console.error("[ChatWidget] Parse error:",r)}}),M.addEventListener("sub_agent.end",A=>{try{let r=JSON.parse(A.data);e.onEvent&&e.onEvent("sub_agent.end",r.payload),o(x=>[...x,{id:"sub-agent-end-"+Date.now(),role:"system",content:`\u2713 ${r.payload.agent_name||"Sub-agent"} completed`,timestamp:new Date,type:"sub_agent_end",metadata:{subAgentKey:r.payload.sub_agent_key,agentName:r.payload.agent_name}}])}catch(r){console.error("[ChatWidget] Parse error:",r)}});let I=A=>{try{let r=JSON.parse(A.data);if(e.onEvent&&e.onEvent(r.type,r.payload),r.type==="run.failed"){let x=r.payload.error||"Agent run failed";m(x),o(w=>[...w,{id:"error-"+Date.now(),role:"system",content:`\u274C Error: ${x}`,timestamp:new Date,type:"error"}])}}catch(r){console.error("[ChatWidget] Parse error:",r)}h(!1),M.close(),$.current=null,i&&T&&T(i)};M.addEventListener("run.succeeded",I),M.addEventListener("run.failed",I),M.addEventListener("run.cancelled",I),M.addEventListener("run.timed_out",I),M.onerror=()=>{h(!1),M.close(),$.current=null}},[e]),W=(0,D.useCallback)(async(s,C={},T={})=>{if(!s.trim()||l)return;let _=[],b={};typeof C=="function"?b={onAssistantMessage:C}:Array.isArray(C)?(_=C,b=T):b=C||{};let{model:M,thinking:i,onAssistantMessage:I,supersedeFromMessageIndex:A}=b;h(!0),m(null);let r={id:le(),role:"user",content:s.trim(),timestamp:new Date,type:"message",files:_.length>0?_.map(x=>({name:x.name,size:x.size,type:x.type})):void 0};o(x=>[...x,r]);try{let x=await t.getOrCreateSession(),w;if(_.length>0){let V=e.apiCaseStyle!=="camel",Be=$e=>V?he($e):$e,ne=new FormData;ne.append(Be("agentKey"),e.agentKey),y&&ne.append(Be("conversationId"),y),ne.append("messages",JSON.stringify([{role:"user",content:s.trim()}])),ne.append("metadata",JSON.stringify(V?{...e.metadata,journey_type:e.defaultJourneyType}:{...e.metadata,journeyType:e.defaultJourneyType})),M&&ne.append("model",M),i&&ne.append("thinking","true"),_.forEach($e=>{ne.append("files",$e)}),w=t.getFetchOptions({method:"POST",body:ne},x)}else{let V=t.transformRequest({agentKey:e.agentKey,conversationId:y,messages:[{role:"user",content:s.trim()}],metadata:{...e.metadata,journeyType:e.defaultJourneyType},...M&&{model:M},...i&&{thinking:!0},...A!==void 0&&{supersedeFromMessageIndex:A}});w=t.getFetchOptions({method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(V)},x)}let O=await fetch(`${e.backendUrl}${e.apiPaths.runs}`,w),ae=x;if(O.status===401){t.clearSession();let V=await t.getOrCreateSession(!0);V&&(ae=V,_.length>0?w=t.getFetchOptions({method:"POST",body:w.body},V):w=t.getFetchOptions({method:"POST",headers:{"Content-Type":"application/json"},body:w.body},V),O=await fetch(`${e.backendUrl}${e.apiPaths.runs}`,w))}if(!O.ok){let V=await O.json().catch(()=>({}));throw new Error(V.error||V.detail||`HTTP ${O.status}`)}let fe=await O.json(),ge=t.transformResponse(fe);S.current=ge.id,!y&&ge.conversationId&&f(ge.conversationId),await R(ge.id,ae,I)}catch(x){m(x.message||"Failed to send message"),h(!1)}finally{S.current=null}},[e,t,y,l,R]),N=(0,D.useCallback)(async()=>{let s=S.current;if(!(!s||!l))try{let C=e.apiPaths.cancelRun?e.apiPaths.cancelRun.replace("{runId}",s):`${e.apiPaths.runs}${s}/cancel/`;(await fetch(`${e.backendUrl}${C}`,t.getFetchOptions({method:"POST",headers:{"Content-Type":"application/json"}}))).ok&&($.current&&($.current.close(),$.current=null),h(!1),S.current=null,o(_=>[..._,{id:"cancelled-"+Date.now(),role:"system",content:"\u23F9 Run cancelled",timestamp:new Date,type:"cancelled"}]))}catch(C){console.error("[ChatWidget] Failed to cancel run:",C)}},[e,t,l]),J=(0,D.useCallback)(()=>{o([]),f(null),m(null),d(!1),g(0),n?.set(e.conversationIdKey,null)},[e.conversationIdKey,n]),H=s=>{let C={id:le(),role:s.role,timestamp:s.timestamp?new Date(s.timestamp):new Date};if(s.role==="tool")return{...C,role:"system",content:"\u2713 Done",type:"tool_result",metadata:{result:s.content,toolCallId:s.toolCallId}};if(s.role==="assistant"&&s.toolCalls&&s.toolCalls.length>0)return s.toolCalls.map(_=>({id:le(),role:"assistant",content:`\u{1F527} ${_.function?.name||_.name||"tool"}`,timestamp:C.timestamp,type:"tool_call",metadata:{toolName:_.function?.name||_.name,arguments:_.function?.arguments||_.arguments,toolCallId:_.id}}));let T=typeof s.content=="string"?s.content:JSON.stringify(s.content);return s.role==="assistant"&&!T?.trim()?null:{...C,content:T,type:"message"}},U=(0,D.useCallback)(async s=>{console.log("[ChatWidget] loadConversation called with:",s),h(!0),o([]),f(s);try{let C=await t.getOrCreateSession(),_=`${e.backendUrl}${e.apiPaths.conversations}${s}/?limit=10&offset=0`;console.log("[ChatWidget] Fetching conversation from:",_);let b=await fetch(_,t.getFetchOptions({method:"GET"},C));if(console.log("[ChatWidget] Response status:",b.status),b.ok){let M=await b.json();console.log("[ChatWidget] Raw conversation:",M);let i=t.transformResponse(M);if(console.log("[ChatWidget] Transformed conversation:",i),i.messages){let I=i.messages.flatMap(H).filter(Boolean);console.log("[ChatWidget] Mapped messages:",I),o(I)}d(i.hasMore||!1),g(i.messages?.length||0)}else b.status===404?(console.log("[ChatWidget] Conversation not found, clearing"),f(null),n?.set(e.conversationIdKey,null)):console.error("[ChatWidget] Unexpected response status:",b.status)}catch(C){console.error("[ChatWidget] Failed to load conversation:",C)}finally{h(!1)}},[e,t,n]),B=(0,D.useCallback)(async()=>{if(!(!y||v||!k)){c(!0);try{let s=await t.getOrCreateSession(),T=`${e.backendUrl}${e.apiPaths.conversations}${y}/?limit=10&offset=${p}`,_=await fetch(T,t.getFetchOptions({method:"GET"},s));if(_.ok){let b=await _.json(),M=t.transformResponse(b);if(M.messages?.length>0){let i=M.messages.flatMap(H).filter(Boolean);o(I=>[...i,...I]),g(I=>I+M.messages.length),d(M.hasMore||!1)}else d(!1)}}catch(s){console.error("[ChatWidget] Failed to load more messages:",s)}finally{c(!1)}}},[e,t,y,p,v,k]),Z=(0,D.useCallback)(async(s,C,T={})=>{if(l)return;let _=a[s];if(!_||_.role!=="user")return;let b=a.slice(0,s);o(b),await W(C,{...T,supersedeFromMessageIndex:s})},[a,l,W]),z=(0,D.useCallback)(async(s,C={})=>{if(l)return;let T=a[s];if(!T)return;let _=s,b=T;if(T.role==="assistant"){for(let i=s-1;i>=0;i--)if(a[i].role==="user"){_=i,b=a[i];break}if(b.role!=="user")return}else if(T.role!=="user")return;let M=a.slice(0,_);o(M),await W(b.content,{...C,supersedeFromMessageIndex:_})},[a,l,W]);return(0,D.useEffect)(()=>()=>{$.current&&$.current.close()},[]),{messages:a,isLoading:l,error:u,conversationId:y,hasMoreMessages:k,loadingMoreMessages:v,sendMessage:W,cancelRun:N,clearMessages:J,loadConversation:U,loadMoreMessages:B,setConversationId:f,editMessage:Z,retryMessage:z}}var j=require("preact/compat"),Ge="cw_thinking_enabled";function Re(e,t,n){let[a,o]=(0,j.useState)([]),[l,h]=(0,j.useState)(null),[u,m]=(0,j.useState)(null),[y,f]=(0,j.useState)(!1),[k,d]=(0,j.useState)(!1);(0,j.useEffect)(()=>{(async()=>{if(e.showModelSelector){f(!0);try{let S=await fetch(`${e.backendUrl}${e.apiPaths.models}`,t.getFetchOptions({method:"GET"}));if(S.ok){let R=await S.json(),W=R.models||[];o(W),m(R.default);let N=n?.get(e.modelKey);N&&W.some(H=>H.id===N)?h(N):h(R.default),n?.get(Ge)==="true"&&d(!0)}}catch(S){console.warn("[ChatWidget] Failed to load models:",S)}finally{f(!1)}}})()},[e.backendUrl,e.apiPaths.models,e.showModelSelector,e.modelKey,t,n]);let v=(0,j.useCallback)($=>{h($),n?.set(e.modelKey,$)},[e.modelKey,n]),c=(0,j.useCallback)($=>{d($),n?.set(Ge,$?"true":"false")},[n]),p=(0,j.useCallback)(()=>a.find($=>$.id===l)||null,[a,l]),g=(0,j.useCallback)(()=>p()?.supports_thinking||!1,[p]);return{availableModels:a,selectedModel:l,defaultModel:u,isLoading:y,selectModel:v,getSelectedModelInfo:p,thinkingEnabled:k,toggleThinking:c,supportsThinking:g}}var G=require("preact/compat");function Ae(e,t){let[n,a]=(0,G.useState)(null),[o,l]=(0,G.useState)(!1),[h,u]=(0,G.useState)(null),m=e.apiPaths?.tasks||"/api/agent/tasks/",y=(0,G.useCallback)(async()=>{l(!0),u(null);try{let p=`${e.backendUrl}${m}`,g=await fetch(p,t.getFetchOptions({method:"GET"}));if(g.ok){let $=await g.json();a($)}else{let $=await g.json().catch(()=>({}));u($.error||"Failed to load tasks")}}catch(p){console.error("[useTasks] Failed to load task list:",p),u("Failed to load tasks")}finally{l(!1)}},[e.backendUrl,m,t]),f=(0,G.useCallback)(async p=>{if(!n)return null;try{let g=`${e.backendUrl}${m}${n.id}/add_task/`,$=await fetch(g,t.getFetchOptions({method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(p)}));if($.ok){let S=await $.json();return await y(),S}else{let S=await $.json().catch(()=>({}));return u(S.error||"Failed to add task"),null}}catch(g){return console.error("[useTasks] Failed to add task:",g),u("Failed to add task"),null}},[e.backendUrl,m,n,t,y]),k=(0,G.useCallback)(async(p,g)=>{if(!n)return null;try{let $=`${e.backendUrl}${m}${n.id}/update_task/${p}/`,S=await fetch($,t.getFetchOptions({method:"PUT",headers:{"Content-Type":"application/json"},body:JSON.stringify(g)}));if(S.ok){let R=await S.json();return await y(),R}else{let R=await S.json().catch(()=>({}));return u(R.error||"Failed to update task"),null}}catch($){return console.error("[useTasks] Failed to update task:",$),u("Failed to update task"),null}},[e.backendUrl,m,n,t,y]),d=(0,G.useCallback)(async p=>{if(!n)return!1;try{let g=`${e.backendUrl}${m}${n.id}/remove_task/${p}/`,$=await fetch(g,t.getFetchOptions({method:"DELETE"}));if($.ok)return await y(),!0;{let S=await $.json().catch(()=>({}));return u(S.error||"Failed to remove task"),!1}}catch(g){return console.error("[useTasks] Failed to remove task:",g),u("Failed to remove task"),!1}},[e.backendUrl,m,n,t,y]),v=(0,G.useCallback)(async()=>{if(!n)return!1;try{let p=`${e.backendUrl}${m}${n.id}/clear/`,g=await fetch(p,t.getFetchOptions({method:"POST"}));if(g.ok)return await y(),!0;{let $=await g.json().catch(()=>({}));return u($.error||"Failed to clear tasks"),!1}}catch(p){return console.error("[useTasks] Failed to clear tasks:",p),u("Failed to clear tasks"),!1}},[e.backendUrl,m,n,t,y]),c=(0,G.useCallback)(()=>u(null),[]);return{taskList:n,tasks:n?.tasks||[],progress:n?.progress||{total:0,completed:0,percent_complete:0},isLoading:o,error:h,loadTaskList:y,addTask:f,updateTask:k,removeTask:d,clearTasks:v,clearError:c}}function Fe(e,t,n){let a=f=>!f||typeof f!="object"||e.apiCaseStyle==="camel"?f:ie(f),o=f=>!f||typeof f!="object"||e.apiCaseStyle==="snake"?f:re(f),l=()=>e.authStrategy?e.authStrategy:e.authToken?"token":e.apiPaths.anonymousSession||e.anonymousSessionEndpoint?"anonymous":"none",h=(f=null)=>{let k=l(),d={},v=f||e.authToken||t().authToken;if(k==="token"&&v){let c=e.authHeader||"Authorization",p=e.authTokenPrefix!==void 0?e.authTokenPrefix:"Token";d[c]=p?`${p} ${v}`:v}else if(k==="jwt"&&v){let c=e.authHeader||"Authorization",p=e.authTokenPrefix!==void 0?e.authTokenPrefix:"Bearer";d[c]=p?`${p} ${v}`:v}else if(k==="anonymous"&&v){let c=e.authHeader||e.anonymousTokenHeader||"X-Anonymous-Token";d[c]=v}if(k==="session"){let c=be(e.csrfCookieName);c&&(d["X-CSRFToken"]=c)}return d};return{getAuthStrategy:l,getAuthHeaders:h,getFetchOptions:(f={},k=null)=>{let d=l(),v={...f},c=h(k);return console.log("[ChatWidget] getFetchOptions - strategy:",d,"overrideToken:",k,"authHeaders:",c),v.headers={...v.headers,...c},d==="session"&&(v.credentials="include"),v},getOrCreateSession:async(f=!1)=>{let k=l(),d=t(),v=e.anonymousTokenKey||e.sessionTokenKey;if(k!=="anonymous")return e.authToken||d.authToken;if(!f){if(d.authToken)return d.authToken;let c=d.storage?.get(v);if(c)return n(p=>({...p,authToken:c})),c}try{let c=e.anonymousSessionEndpoint||e.apiPaths.anonymousSession,p=await fetch(`${e.backendUrl}${c}`,{method:"POST",headers:{"Content-Type":"application/json"}});if(p.ok){let g=await p.json();return n($=>({...$,authToken:g.token})),d.storage?.set(v,g.token),g.token}}catch(c){console.warn("[ChatWidget] Failed to create session:",c)}return null},clearSession:()=>{let f=e.anonymousTokenKey||e.sessionTokenKey,k=t();n(d=>({...d,authToken:null})),k.storage?.set(f,null)},transformRequest:a,transformResponse:o}}function pe({config:e,onStateChange:t,markdownParser:n,apiRef:a}){console.log("[ChatWidget] Config:",{showConversationSidebar:e.showConversationSidebar,apiPaths:e.apiPaths});let[o,l]=(0,E.useState)(e.embedded||e.forceOpen===!0),[h,u]=(0,E.useState)(!1),[m,y]=(0,E.useState)(!1),[f,k]=(0,E.useState)(!1),[d,v]=(0,E.useState)([]),[c,p]=(0,E.useState)("chat"),[g,$]=(0,E.useState)(!1),[S,R]=(0,E.useState)(e.enableTTS),[W,N]=(0,E.useState)(!1),[J,H]=(0,E.useState)(null);(0,E.useEffect)(()=>{e.forceOpen!==void 0&&l(e.forceOpen)},[e.forceOpen]);let U=(0,E.useMemo)(()=>ve(e.containerId),[e.containerId]),[B,Z]=(0,E.useState)(e.authToken||null),z=(0,E.useMemo)(()=>Fe(e,()=>({authToken:B,storage:U}),ae=>{let fe=ae({authToken:B,storage:U});fe.authToken!==B&&Z(fe.authToken)}),[e,B,U]),s=Ee(e,z,U),C=Re(e,z,U),T=Ae(e,z);(0,E.useEffect)(()=>{for(let w=s.messages.length-1;w>=0;w--){let O=s.messages[w];if(O.type==="sub_agent_start"){H({key:O.metadata?.subAgentKey,name:O.metadata?.agentName});return}if(O.type==="sub_agent_end"){H(null);return}}},[s.messages]),(0,E.useEffect)(()=>{let w=U.get(e.conversationIdKey);console.log("[ChatWidget] Initial load - storedConvId:",w,"key:",e.conversationIdKey),console.log("[ChatWidget] apiPaths.conversations:",e.apiPaths.conversations),w&&(console.log("[ChatWidget] Loading conversation:",w),s.loadConversation(w))},[]),(0,E.useEffect)(()=>{t&&t({isOpen:o,isExpanded:h,debugMode:m,messages:s.messages,conversationId:s.conversationId,isLoading:s.isLoading,error:s.error})},[o,h,m,s.messages,s.conversationId,s.isLoading,s.error]);let _=(0,E.useCallback)(async()=>{if(e.showConversationSidebar){$(!0);try{let w=`${e.backendUrl}${e.apiPaths.conversations}?agent_key=${encodeURIComponent(e.agentKey)}`,O=await fetch(w,z.getFetchOptions({method:"GET"}));if(O.ok){let ae=await O.json();v(ae.results||ae)}}catch(w){console.error("[ChatWidget] Failed to load conversations:",w),v([])}finally{$(!1)}}},[e,z]),b=(0,E.useCallback)(()=>{let w=!f;k(w),w&&_()},[f,_]),M=(0,E.useCallback)(w=>{w!==s.conversationId&&s.loadConversation(w),k(!1)},[s]),i=(0,E.useCallback)(()=>{s.clearMessages(),k(!1)},[s]),I=(0,E.useCallback)(w=>{s.sendMessage(w,{model:C.selectedModel,thinking:C.thinkingEnabled&&C.supportsThinking(),onAssistantMessage:O=>{}})},[s,S,C.selectedModel,C.thinkingEnabled,C.supportsThinking]),A=(0,E.useCallback)(w=>{p(w),w==="tasks"&&T.loadTaskList()},[T]);if((0,E.useEffect)(()=>{a&&(a.current={open:()=>l(!0),close:()=>l(!1),send:w=>I(w),clearMessages:()=>s.clearMessages(),toggleTTS:()=>R(w=>!w),stopSpeech:()=>N(!1),setAuth:w=>{w.token!==void 0&&Z(w.token)},clearAuth:()=>Z(null)})},[s,a,I]),!e.embedded&&!o)return q.html`
|
|
586
|
+
`}var K=require("preact/compat");function Re(e,t,s){let[n,a]=(0,K.useState)([]),[l,$]=(0,K.useState)(!1),[i,f]=(0,K.useState)(null),[y,u]=(0,K.useState)(()=>s?.get(e.conversationIdKey)||null),[k,c]=(0,K.useState)(!1),[C,o]=(0,K.useState)(!1),[g,w]=(0,K.useState)(0),v=(0,K.useRef)(null),T=(0,K.useRef)(null);(0,K.useEffect)(()=>{y&&s?.set(e.conversationIdKey,y)},[y,e.conversationIdKey,s]);let m=(0,K.useCallback)(async(h,M,p)=>{v.current&&v.current.close();let S=e.apiPaths.runEvents.replace("{runId}",h),b=`${e.backendUrl}${S}`;M&&(b+=`?anonymous_token=${encodeURIComponent(M)}`);let x=new EventSource(b);v.current=x;let d="";x.addEventListener("assistant.message",P=>{try{let r=JSON.parse(P.data);e.onEvent&&e.onEvent("assistant.message",r.payload);let E=r.payload.content;E&&(d+=E,a(W=>{let q=W[W.length-1];return q?.role==="assistant"&&q.id.startsWith("assistant-stream-")?[...W.slice(0,-1),{...q,content:d}]:[...W,{id:"assistant-stream-"+Date.now(),role:"assistant",content:d,timestamp:new Date,type:"message"}]}))}catch(r){console.error("[ChatWidget] Parse error:",r)}}),x.addEventListener("tool.call",P=>{try{let r=JSON.parse(P.data);e.onEvent&&e.onEvent("tool.call",r.payload),a(E=>[...E,{id:"tool-call-"+Date.now(),role:"assistant",content:`\u{1F527} ${r.payload.name}`,timestamp:new Date,type:"tool_call",metadata:{toolName:r.payload.name,arguments:r.payload.arguments,toolCallId:r.payload.id}}])}catch(r){console.error("[ChatWidget] Parse error:",r)}}),x.addEventListener("tool.result",P=>{try{let r=JSON.parse(P.data);e.onEvent&&e.onEvent("tool.result",r.payload);let E=r.payload.result,W=E?.error;a(q=>[...q,{id:"tool-result-"+Date.now(),role:"system",content:W?`\u274C ${E.error}`:"\u2713 Done",timestamp:new Date,type:"tool_result",metadata:{toolName:r.payload.name,result:E,toolCallId:r.payload.tool_call_id}}])}catch(r){console.error("[ChatWidget] Parse error:",r)}}),x.addEventListener("custom",P=>{try{let r=JSON.parse(P.data);e.onEvent&&e.onEvent("custom",r.payload),r.payload?.type==="ui_control"&&e.onUIControl&&e.onUIControl(r.payload),r.payload?.type==="agent_context"&&a(E=>[...E,{id:"agent-context-"+Date.now(),role:"system",content:`\u{1F517} ${r.payload.agent_name||"Sub-agent"} is now handling this request`,timestamp:new Date,type:"agent_context",metadata:{agentKey:r.payload.agent_key,agentName:r.payload.agent_name,action:r.payload.action}}])}catch(r){console.error("[ChatWidget] Parse error:",r)}}),x.addEventListener("sub_agent.start",P=>{try{let r=JSON.parse(P.data);e.onEvent&&e.onEvent("sub_agent.start",r.payload),a(E=>[...E,{id:"sub-agent-start-"+Date.now(),role:"system",content:`\u{1F517} Delegating to ${r.payload.agent_name||r.payload.sub_agent_key||"sub-agent"}...`,timestamp:new Date,type:"sub_agent_start",metadata:{subAgentKey:r.payload.sub_agent_key,agentName:r.payload.agent_name,invocationMode:r.payload.invocation_mode}}])}catch(r){console.error("[ChatWidget] Parse error:",r)}}),x.addEventListener("sub_agent.end",P=>{try{let r=JSON.parse(P.data);e.onEvent&&e.onEvent("sub_agent.end",r.payload),a(E=>[...E,{id:"sub-agent-end-"+Date.now(),role:"system",content:`\u2713 ${r.payload.agent_name||"Sub-agent"} completed`,timestamp:new Date,type:"sub_agent_end",metadata:{subAgentKey:r.payload.sub_agent_key,agentName:r.payload.agent_name}}])}catch(r){console.error("[ChatWidget] Parse error:",r)}});let A=P=>{try{let r=JSON.parse(P.data);if(e.onEvent&&e.onEvent(r.type,r.payload),r.type==="run.failed"){let E=r.payload.error||"Agent run failed";f(E),a(W=>[...W,{id:"error-"+Date.now(),role:"system",content:`\u274C Error: ${E}`,timestamp:new Date,type:"error"}])}}catch(r){console.error("[ChatWidget] Parse error:",r)}$(!1),x.close(),v.current=null,d&&p&&p(d)};x.addEventListener("run.succeeded",A),x.addEventListener("run.failed",A),x.addEventListener("run.cancelled",A),x.addEventListener("run.timed_out",A),x.onerror=()=>{$(!1),x.close(),v.current=null}},[e]),H=(0,K.useCallback)(async(h,M={},p={})=>{if(!h.trim()||l)return;let S=[],b={};typeof M=="function"?b={onAssistantMessage:M}:Array.isArray(M)?(S=M,b=p):b=M||{};let{model:x,thinking:d,onAssistantMessage:A,supersedeFromMessageIndex:P}=b;$(!0),f(null);let r={id:pe(),role:"user",content:h.trim(),timestamp:new Date,type:"message",files:S.length>0?S.map(E=>({name:E.name,size:E.size,type:E.type})):void 0};a(E=>[...E,r]);try{let E=await t.getOrCreateSession(),W;if(S.length>0){let B=e.apiCaseStyle!=="camel",ze=we=>B?$e(we):we,le=new FormData;le.append(ze("agentKey"),e.agentKey),y&&le.append(ze("conversationId"),y),le.append("messages",JSON.stringify([{role:"user",content:h.trim()}])),le.append("metadata",JSON.stringify(B?{...e.metadata,journey_type:e.defaultJourneyType}:{...e.metadata,journeyType:e.defaultJourneyType})),x&&le.append("model",x),d&&le.append("thinking","true"),S.forEach(we=>{le.append("files",we)}),W=t.getFetchOptions({method:"POST",body:le},E)}else{let B=t.transformRequest({agentKey:e.agentKey,conversationId:y,messages:[{role:"user",content:h.trim()}],metadata:{...e.metadata,journeyType:e.defaultJourneyType},...x&&{model:x},...d&&{thinking:!0},...P!==void 0&&{supersedeFromMessageIndex:P}});W=t.getFetchOptions({method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(B)},E)}let q=await fetch(`${e.backendUrl}${e.apiPaths.runs}`,W),_=E;if(q.status===401){t.clearSession();let B=await t.getOrCreateSession(!0);B&&(_=B,S.length>0?W=t.getFetchOptions({method:"POST",body:W.body},B):W=t.getFetchOptions({method:"POST",headers:{"Content-Type":"application/json"},body:W.body},B),q=await fetch(`${e.backendUrl}${e.apiPaths.runs}`,W))}if(!q.ok){let B=await q.json().catch(()=>({}));throw new Error(B.error||B.detail||`HTTP ${q.status}`)}let Q=await q.json(),ne=t.transformResponse(Q);T.current=ne.id,!y&&ne.conversationId&&u(ne.conversationId),await m(ne.id,_,A)}catch(E){f(E.message||"Failed to send message"),$(!1)}finally{T.current=null}},[e,t,y,l,m]),J=(0,K.useCallback)(async()=>{let h=T.current;if(!(!h||!l))try{let M=e.apiPaths.cancelRun?e.apiPaths.cancelRun.replace("{runId}",h):`${e.apiPaths.runs}${h}/cancel/`;(await fetch(`${e.backendUrl}${M}`,t.getFetchOptions({method:"POST",headers:{"Content-Type":"application/json"}}))).ok&&(v.current&&(v.current.close(),v.current=null),$(!1),T.current=null,a(S=>[...S,{id:"cancelled-"+Date.now(),role:"system",content:"\u23F9 Run cancelled",timestamp:new Date,type:"cancelled"}]))}catch(M){console.error("[ChatWidget] Failed to cancel run:",M)}},[e,t,l]),I=(0,K.useCallback)(()=>{a([]),u(null),f(null),c(!1),w(0),s?.set(e.conversationIdKey,null)},[e.conversationIdKey,s]),D=h=>{let M={id:pe(),role:h.role,timestamp:h.timestamp?new Date(h.timestamp):new Date};if(h.role==="tool")return{...M,role:"system",content:"\u2713 Done",type:"tool_result",metadata:{result:h.content,toolCallId:h.toolCallId}};if(h.role==="assistant"&&h.toolCalls&&h.toolCalls.length>0)return h.toolCalls.map(S=>({id:pe(),role:"assistant",content:`\u{1F527} ${S.function?.name||S.name||"tool"}`,timestamp:M.timestamp,type:"tool_call",metadata:{toolName:S.function?.name||S.name,arguments:S.function?.arguments||S.arguments,toolCallId:S.id}}));let p=typeof h.content=="string"?h.content:JSON.stringify(h.content);return h.role==="assistant"&&!p?.trim()?null:{...M,content:p,type:"message"}},F=(0,K.useCallback)(async h=>{console.log("[ChatWidget] loadConversation called with:",h),$(!0),a([]),u(h);try{let M=await t.getOrCreateSession(),S=`${e.backendUrl}${e.apiPaths.conversations}${h}/?limit=10&offset=0`;console.log("[ChatWidget] Fetching conversation from:",S);let b=await fetch(S,t.getFetchOptions({method:"GET"},M));if(console.log("[ChatWidget] Response status:",b.status),b.ok){let x=await b.json();console.log("[ChatWidget] Raw conversation:",x);let d=t.transformResponse(x);if(console.log("[ChatWidget] Transformed conversation:",d),d.messages){let A=d.messages.flatMap(D).filter(Boolean);console.log("[ChatWidget] Mapped messages:",A),a(A)}c(d.hasMore||!1),w(d.messages?.length||0)}else b.status===404?(console.log("[ChatWidget] Conversation not found, clearing"),u(null),s?.set(e.conversationIdKey,null)):console.error("[ChatWidget] Unexpected response status:",b.status)}catch(M){console.error("[ChatWidget] Failed to load conversation:",M)}finally{$(!1)}},[e,t,s]),L=(0,K.useCallback)(async()=>{if(!(!y||C||!k)){o(!0);try{let h=await t.getOrCreateSession(),p=`${e.backendUrl}${e.apiPaths.conversations}${y}/?limit=10&offset=${g}`,S=await fetch(p,t.getFetchOptions({method:"GET"},h));if(S.ok){let b=await S.json(),x=t.transformResponse(b);if(x.messages?.length>0){let d=x.messages.flatMap(D).filter(Boolean);a(A=>[...d,...A]),w(A=>A+x.messages.length),c(x.hasMore||!1)}else c(!1)}}catch(h){console.error("[ChatWidget] Failed to load more messages:",h)}finally{o(!1)}}},[e,t,y,g,C,k]),z=(0,K.useCallback)(async(h,M,p={})=>{if(l)return;let S=n[h];if(!S||S.role!=="user")return;let b=n.slice(0,h);a(b),await H(M,{...p,supersedeFromMessageIndex:h})},[n,l,H]),V=(0,K.useCallback)(async(h,M={})=>{if(l)return;let p=n[h];if(!p)return;let S=h,b=p;if(p.role==="assistant"){for(let d=h-1;d>=0;d--)if(n[d].role==="user"){S=d,b=n[d];break}if(b.role!=="user")return}else if(p.role!=="user")return;let x=n.slice(0,S);a(x),await H(b.content,{...M,supersedeFromMessageIndex:S})},[n,l,H]);return(0,K.useEffect)(()=>()=>{v.current&&v.current.close()},[]),{messages:n,isLoading:l,error:i,conversationId:y,hasMoreMessages:k,loadingMoreMessages:C,sendMessage:H,cancelRun:J,clearMessages:I,loadConversation:F,loadMoreMessages:L,setConversationId:u,editMessage:z,retryMessage:V}}var X=require("preact/compat"),Qe="cw_thinking_enabled";function De(e,t,s){let[n,a]=(0,X.useState)([]),[l,$]=(0,X.useState)(null),[i,f]=(0,X.useState)(null),[y,u]=(0,X.useState)(!1),[k,c]=(0,X.useState)(!1);(0,X.useEffect)(()=>{(async()=>{if(e.showModelSelector){u(!0);try{let T=await fetch(`${e.backendUrl}${e.apiPaths.models}`,t.getFetchOptions({method:"GET"}));if(T.ok){let m=await T.json(),H=m.models||[];a(H),f(m.default);let J=s?.get(e.modelKey);J&&H.some(D=>D.id===J)?$(J):$(m.default),s?.get(Qe)==="true"&&c(!0)}}catch(T){console.warn("[ChatWidget] Failed to load models:",T)}finally{u(!1)}}})()},[e.backendUrl,e.apiPaths.models,e.showModelSelector,e.modelKey,t,s]);let C=(0,X.useCallback)(v=>{$(v),s?.set(e.modelKey,v)},[e.modelKey,s]),o=(0,X.useCallback)(v=>{c(v),s?.set(Qe,v?"true":"false")},[s]),g=(0,X.useCallback)(()=>n.find(v=>v.id===l)||null,[n,l]),w=(0,X.useCallback)(()=>g()?.supports_thinking||!1,[g]);return{availableModels:n,selectedModel:l,defaultModel:i,isLoading:y,selectModel:C,getSelectedModelInfo:g,thinkingEnabled:k,toggleThinking:o,supportsThinking:w}}var ee=require("preact/compat");function Fe(e,t){let[s,n]=(0,ee.useState)(null),[a,l]=(0,ee.useState)(!1),[$,i]=(0,ee.useState)(null),f=e.apiPaths?.tasks||"/api/agent/tasks/",y=(0,ee.useCallback)(async()=>{l(!0),i(null);try{let g=`${e.backendUrl}${f}`,w=await fetch(g,t.getFetchOptions({method:"GET"}));if(w.ok){let v=await w.json();n(v)}else{let v=await w.json().catch(()=>({}));i(v.error||"Failed to load tasks")}}catch(g){console.error("[useTasks] Failed to load task list:",g),i("Failed to load tasks")}finally{l(!1)}},[e.backendUrl,f,t]),u=(0,ee.useCallback)(async g=>{if(!s)return null;try{let w=`${e.backendUrl}${f}${s.id}/add_task/`,v=await fetch(w,t.getFetchOptions({method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(g)}));if(v.ok){let T=await v.json();return await y(),T}else{let T=await v.json().catch(()=>({}));return i(T.error||"Failed to add task"),null}}catch(w){return console.error("[useTasks] Failed to add task:",w),i("Failed to add task"),null}},[e.backendUrl,f,s,t,y]),k=(0,ee.useCallback)(async(g,w)=>{if(!s)return null;try{let v=`${e.backendUrl}${f}${s.id}/update_task/${g}/`,T=await fetch(v,t.getFetchOptions({method:"PUT",headers:{"Content-Type":"application/json"},body:JSON.stringify(w)}));if(T.ok){let m=await T.json();return await y(),m}else{let m=await T.json().catch(()=>({}));return i(m.error||"Failed to update task"),null}}catch(v){return console.error("[useTasks] Failed to update task:",v),i("Failed to update task"),null}},[e.backendUrl,f,s,t,y]),c=(0,ee.useCallback)(async g=>{if(!s)return!1;try{let w=`${e.backendUrl}${f}${s.id}/remove_task/${g}/`,v=await fetch(w,t.getFetchOptions({method:"DELETE"}));if(v.ok)return await y(),!0;{let T=await v.json().catch(()=>({}));return i(T.error||"Failed to remove task"),!1}}catch(w){return console.error("[useTasks] Failed to remove task:",w),i("Failed to remove task"),!1}},[e.backendUrl,f,s,t,y]),C=(0,ee.useCallback)(async()=>{if(!s)return!1;try{let g=`${e.backendUrl}${f}${s.id}/clear/`,w=await fetch(g,t.getFetchOptions({method:"POST"}));if(w.ok)return await y(),!0;{let v=await w.json().catch(()=>({}));return i(v.error||"Failed to clear tasks"),!1}}catch(g){return console.error("[useTasks] Failed to clear tasks:",g),i("Failed to clear tasks"),!1}},[e.backendUrl,f,s,t,y]),o=(0,ee.useCallback)(()=>i(null),[]);return{taskList:s,tasks:s?.tasks||[],progress:s?.progress||{total:0,completed:0,percent_complete:0},isLoading:a,error:$,loadTaskList:y,addTask:u,updateTask:k,removeTask:c,clearTasks:C,clearError:o}}var j=require("preact/compat"),et="cw_selected_system",Be="cw_selected_agent",tt="cw_selected_system_version",Oe="cw_selected_agent_version";function st(e,t,s){let[n,a]=(0,j.useState)([]),[l,$]=(0,j.useState)([]),[i,f]=(0,j.useState)(null),[y,u]=(0,j.useState)(null),[k,c]=(0,j.useState)(null),[C,o]=(0,j.useState)(null),[g,w]=(0,j.useState)(!1),v=(0,j.useCallback)(()=>{if(y)return y;if(i){let I=n.find(D=>D.slug===i);if(I?.entry_agent)return I.entry_agent.slug}return e.agentKey},[y,i,n,e.agentKey]);(0,j.useEffect)(()=>{if(!e.showDevTools)return;(async()=>{w(!0);try{let D=await fetch(`${e.backendUrl}${e.apiPaths.systems}`,t.getFetchOptions({method:"GET"}));if(D.ok){let F=await D.json(),L=F.results||F;a(L);let z=s?.get(et);z&&L.some(V=>V.slug===z)?f(z):L.length===1&&f(L[0].slug)}}catch(D){console.warn("[ChatWidget] Failed to load systems:",D)}finally{w(!1)}})()},[e.backendUrl,e.apiPaths.systems,e.showDevTools,t,s]),(0,j.useEffect)(()=>{if(!e.showDevTools)return;(async()=>{try{let D=i?`?system=${encodeURIComponent(i)}`:"",F=await fetch(`${e.backendUrl}${e.apiPaths.agents}${D}`,t.getFetchOptions({method:"GET"}));if(F.ok){let L=await F.json(),z=L.results||L;$(z);let V=s?.get(Be);if(V&&z.some(M=>M.slug===V))u(V);else if(i){let M=n.find(p=>p.slug===i);M?.entry_agent&&u(M.entry_agent.slug)}let h=s?.get(Oe);h&&o(h)}}catch(D){console.warn("[ChatWidget] Failed to load agents:",D)}})()},[e.backendUrl,e.apiPaths.agents,e.showDevTools,i,t,s,n]);let T=(0,j.useCallback)(I=>{f(I),s?.set(et,I),u(null),o(null),s?.set(Be,null),s?.set(Oe,null);let F=n.find(L=>L.slug===I)?.active_version||null;c(F),s?.set(tt,F)},[s,n]),m=(0,j.useCallback)(I=>{u(I),s?.set(Be,I);let F=l.find(L=>L.slug===I)?.active_version||null;o(F),s?.set(Oe,F)},[s,l]),H=(0,j.useCallback)(I=>{c(I),s?.set(tt,I)},[s]),J=(0,j.useCallback)(I=>{o(I),s?.set(Oe,I)},[s]);return{systems:n,agents:l,selectedSystem:i,selectedAgent:y,selectedSystemVersion:k,selectedAgentVersion:C,isLoading:g,selectSystem:T,selectAgent:m,selectSystemVersion:H,selectAgentVersion:J,getEffectiveAgentKey:v}}function Pe(e,t,s){let n=u=>!u||typeof u!="object"||e.apiCaseStyle==="camel"?u:ue(u),a=u=>!u||typeof u!="object"||e.apiCaseStyle==="snake"?u:de(u),l=()=>e.authStrategy?e.authStrategy:e.authToken?"token":e.apiPaths.anonymousSession||e.anonymousSessionEndpoint?"anonymous":"none",$=(u=null)=>{let k=l(),c={},C=u||e.authToken||t().authToken;if(k==="token"&&C){let o=e.authHeader||"Authorization",g=e.authTokenPrefix!==void 0?e.authTokenPrefix:"Token";c[o]=g?`${g} ${C}`:C}else if(k==="jwt"&&C){let o=e.authHeader||"Authorization",g=e.authTokenPrefix!==void 0?e.authTokenPrefix:"Bearer";c[o]=g?`${g} ${C}`:C}else if(k==="anonymous"&&C){let o=e.authHeader||e.anonymousTokenHeader||"X-Anonymous-Token";c[o]=C}if(k==="session"){let o=Se(e.csrfCookieName);o&&(c["X-CSRFToken"]=o)}return c};return{getAuthStrategy:l,getAuthHeaders:$,getFetchOptions:(u={},k=null)=>{let c=l(),C={...u},o=$(k);return console.log("[ChatWidget] getFetchOptions - strategy:",c,"overrideToken:",k,"authHeaders:",o),C.headers={...C.headers,...o},c==="session"&&(C.credentials="include"),C},getOrCreateSession:async(u=!1)=>{let k=l(),c=t(),C=e.anonymousTokenKey||e.sessionTokenKey;if(k!=="anonymous")return e.authToken||c.authToken;if(!u){if(c.authToken)return c.authToken;let o=c.storage?.get(C);if(o)return s(g=>({...g,authToken:o})),o}try{let o=e.anonymousSessionEndpoint||e.apiPaths.anonymousSession,g=await fetch(`${e.backendUrl}${o}`,{method:"POST",headers:{"Content-Type":"application/json"}});if(g.ok){let w=await g.json();return s(v=>({...v,authToken:w.token})),c.storage?.set(C,w.token),w.token}}catch(o){console.warn("[ChatWidget] Failed to create session:",o)}return null},clearSession:()=>{let u=e.anonymousTokenKey||e.sessionTokenKey,k=t();s(c=>({...c,authToken:null})),k.storage?.set(u,null)},transformRequest:n,transformResponse:a}}function fe({config:e,onStateChange:t,markdownParser:s,apiRef:n}){console.log("[ChatWidget] Config:",{showConversationSidebar:e.showConversationSidebar,apiPaths:e.apiPaths});let[a,l]=(0,R.useState)(e.embedded||e.forceOpen===!0),[$,i]=(0,R.useState)(!1),[f,y]=(0,R.useState)(!1),[u,k]=(0,R.useState)(!1),[c,C]=(0,R.useState)([]),[o,g]=(0,R.useState)("chat"),[w,v]=(0,R.useState)(!1),[T,m]=(0,R.useState)(e.enableTTS),[H,J]=(0,R.useState)(!1),[I,D]=(0,R.useState)(null);(0,R.useEffect)(()=>{e.forceOpen!==void 0&&l(e.forceOpen)},[e.forceOpen]);let F=(0,R.useMemo)(()=>Ce(e.containerId),[e.containerId]),[L,z]=(0,R.useState)(e.authToken||null),V=(0,R.useMemo)(()=>Pe(e,()=>({authToken:L,storage:F}),ne=>{let B=ne({authToken:L,storage:F});B.authToken!==L&&z(B.authToken)}),[e,L,F]),h=st(e,V,F),M=(0,R.useMemo)(()=>{if(!e.showDevTools)return e;let _=h.getEffectiveAgentKey();return _&&_!==e.agentKey?{...e,agentKey:_}:e},[e,h.getEffectiveAgentKey]),p=Re(M,V,F),S=De(e,V,F),b=Fe(e,V);(0,R.useEffect)(()=>{for(let _=p.messages.length-1;_>=0;_--){let Q=p.messages[_];if(Q.type==="sub_agent_start"){D({key:Q.metadata?.subAgentKey,name:Q.metadata?.agentName});return}if(Q.type==="sub_agent_end"){D(null);return}}},[p.messages]),(0,R.useEffect)(()=>{let _=F.get(e.conversationIdKey);console.log("[ChatWidget] Initial load - storedConvId:",_,"key:",e.conversationIdKey),console.log("[ChatWidget] apiPaths.conversations:",e.apiPaths.conversations),_&&(console.log("[ChatWidget] Loading conversation:",_),p.loadConversation(_))},[]),(0,R.useEffect)(()=>{t&&t({isOpen:a,isExpanded:$,debugMode:f,messages:p.messages,conversationId:p.conversationId,isLoading:p.isLoading,error:p.error})},[a,$,f,p.messages,p.conversationId,p.isLoading,p.error]);let x=(0,R.useCallback)(async()=>{if(e.showConversationSidebar){v(!0);try{let _=M.agentKey,Q=`${e.backendUrl}${e.apiPaths.conversations}?agent_key=${encodeURIComponent(_)}`,ne=await fetch(Q,V.getFetchOptions({method:"GET"}));if(ne.ok){let B=await ne.json();C(B.results||B)}}catch(_){console.error("[ChatWidget] Failed to load conversations:",_),C([])}finally{v(!1)}}},[e,M,V]),d=(0,R.useCallback)(()=>{let _=!u;k(_),_&&x()},[u,x]),A=(0,R.useCallback)(_=>{_!==p.conversationId&&p.loadConversation(_),k(!1)},[p]),P=(0,R.useCallback)(()=>{p.clearMessages(),k(!1)},[p]),r=(0,R.useCallback)(_=>{p.sendMessage(_,{model:S.selectedModel,thinking:S.thinkingEnabled&&S.supportsThinking(),onAssistantMessage:Q=>{}})},[p,T,S.selectedModel,S.thinkingEnabled,S.supportsThinking]),E=(0,R.useCallback)(_=>{g(_),_==="tasks"&&b.loadTaskList()},[b]);if((0,R.useEffect)(()=>{n&&(n.current={open:()=>l(!0),close:()=>l(!1),send:_=>r(_),clearMessages:()=>p.clearMessages(),toggleTTS:()=>m(_=>!_),stopSpeech:()=>J(!1),setAuth:_=>{_.token!==void 0&&z(_.token)},clearAuth:()=>z(null)})},[p,n,r]),!e.embedded&&!a)return Z.html`
|
|
494
587
|
<button
|
|
495
588
|
class="cw-fab"
|
|
496
589
|
style=${{backgroundColor:e.primaryColor}}
|
|
@@ -500,107 +593,123 @@ var ye=Object.defineProperty;var Ye=Object.getOwnPropertyDescriptor;var Ze=Objec
|
|
|
500
593
|
<path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"></path>
|
|
501
594
|
</svg>
|
|
502
595
|
</button>
|
|
503
|
-
`;let
|
|
504
|
-
<div class=${
|
|
505
|
-
${e.showConversationSidebar&&
|
|
506
|
-
<${
|
|
507
|
-
isOpen=${
|
|
508
|
-
conversations=${
|
|
509
|
-
conversationsLoading=${
|
|
510
|
-
currentConversationId=${
|
|
596
|
+
`;let W=["cw-widget",$&&"cw-widget-expanded",e.embedded&&"cw-widget-embedded"].filter(Boolean).join(" "),q=e.headerTextColor||qe(e.primaryColor);return Z.html`
|
|
597
|
+
<div class=${W} style=${{"--cw-primary":e.primaryColor,"--cw-header-text":q}}>
|
|
598
|
+
${e.showConversationSidebar&&Z.html`
|
|
599
|
+
<${Ee}
|
|
600
|
+
isOpen=${u}
|
|
601
|
+
conversations=${c}
|
|
602
|
+
conversationsLoading=${w}
|
|
603
|
+
currentConversationId=${p.conversationId}
|
|
511
604
|
onClose=${()=>k(!1)}
|
|
512
|
-
onNewConversation=${
|
|
513
|
-
onSwitchConversation=${
|
|
605
|
+
onNewConversation=${P}
|
|
606
|
+
onSwitchConversation=${A}
|
|
514
607
|
/>
|
|
515
608
|
`}
|
|
516
609
|
|
|
517
|
-
<${
|
|
610
|
+
<${Te}
|
|
518
611
|
config=${e}
|
|
519
|
-
debugMode=${
|
|
520
|
-
isExpanded=${
|
|
521
|
-
isSpeaking=${
|
|
522
|
-
messagesCount=${
|
|
523
|
-
isLoading=${
|
|
524
|
-
currentAgent=${
|
|
612
|
+
debugMode=${f}
|
|
613
|
+
isExpanded=${$}
|
|
614
|
+
isSpeaking=${H}
|
|
615
|
+
messagesCount=${p.messages.length}
|
|
616
|
+
isLoading=${p.isLoading}
|
|
617
|
+
currentAgent=${I}
|
|
525
618
|
onClose=${()=>l(!1)}
|
|
526
|
-
onToggleExpand=${()=>
|
|
527
|
-
onToggleDebug=${()=>y(!
|
|
528
|
-
onToggleTTS=${()=>
|
|
529
|
-
onClear=${
|
|
530
|
-
onToggleSidebar=${
|
|
619
|
+
onToggleExpand=${()=>i(!$)}
|
|
620
|
+
onToggleDebug=${()=>y(!f)}
|
|
621
|
+
onToggleTTS=${()=>m(!T)}
|
|
622
|
+
onClear=${p.clearMessages}
|
|
623
|
+
onToggleSidebar=${d}
|
|
531
624
|
/>
|
|
532
625
|
|
|
533
|
-
${e.
|
|
626
|
+
${e.showDevTools&&Z.html`
|
|
627
|
+
<${Ze}
|
|
628
|
+
systems=${h.systems}
|
|
629
|
+
agents=${h.agents}
|
|
630
|
+
selectedSystem=${h.selectedSystem}
|
|
631
|
+
selectedAgent=${h.selectedAgent}
|
|
632
|
+
selectedSystemVersion=${h.selectedSystemVersion}
|
|
633
|
+
selectedAgentVersion=${h.selectedAgentVersion}
|
|
634
|
+
onSelectSystem=${h.selectSystem}
|
|
635
|
+
onSelectAgent=${h.selectAgent}
|
|
636
|
+
onSelectSystemVersion=${h.selectSystemVersion}
|
|
637
|
+
onSelectAgentVersion=${h.selectAgentVersion}
|
|
638
|
+
disabled=${p.isLoading}
|
|
639
|
+
/>
|
|
640
|
+
`}
|
|
641
|
+
|
|
642
|
+
${e.showTasksTab!==!1&&Z.html`
|
|
534
643
|
<div class="cw-tabs">
|
|
535
644
|
<button
|
|
536
|
-
class=${`cw-tab ${
|
|
537
|
-
onClick=${()=>
|
|
645
|
+
class=${`cw-tab ${o==="chat"?"cw-tab-active":""}`}
|
|
646
|
+
onClick=${()=>E("chat")}
|
|
538
647
|
>
|
|
539
648
|
Chat
|
|
540
649
|
</button>
|
|
541
650
|
<button
|
|
542
|
-
class=${`cw-tab ${
|
|
543
|
-
onClick=${()=>
|
|
651
|
+
class=${`cw-tab ${o==="tasks"?"cw-tab-active":""}`}
|
|
652
|
+
onClick=${()=>E("tasks")}
|
|
544
653
|
>
|
|
545
|
-
Tasks ${
|
|
654
|
+
Tasks ${b.progress.total>0?Z.html`<span class="cw-tab-badge">${b.progress.completed}/${b.progress.total}</span>`:""}
|
|
546
655
|
</button>
|
|
547
656
|
</div>
|
|
548
657
|
`}
|
|
549
658
|
|
|
550
|
-
${
|
|
659
|
+
${f&&Z.html`<div class="cw-status-bar"><span>🐛 Debug</span></div>`}
|
|
551
660
|
|
|
552
|
-
${
|
|
553
|
-
<${
|
|
554
|
-
messages=${
|
|
555
|
-
isLoading=${
|
|
556
|
-
hasMoreMessages=${
|
|
557
|
-
loadingMoreMessages=${
|
|
558
|
-
onLoadMore=${
|
|
559
|
-
onEditMessage=${
|
|
560
|
-
onRetryMessage=${
|
|
561
|
-
debugMode=${
|
|
562
|
-
markdownParser=${
|
|
661
|
+
${o==="chat"?Z.html`
|
|
662
|
+
<${Me}
|
|
663
|
+
messages=${p.messages}
|
|
664
|
+
isLoading=${p.isLoading}
|
|
665
|
+
hasMoreMessages=${p.hasMoreMessages}
|
|
666
|
+
loadingMoreMessages=${p.loadingMoreMessages}
|
|
667
|
+
onLoadMore=${p.loadMoreMessages}
|
|
668
|
+
onEditMessage=${p.editMessage}
|
|
669
|
+
onRetryMessage=${p.retryMessage}
|
|
670
|
+
debugMode=${f}
|
|
671
|
+
markdownParser=${s}
|
|
563
672
|
emptyStateTitle=${e.emptyStateTitle}
|
|
564
673
|
emptyStateMessage=${e.emptyStateMessage}
|
|
565
674
|
/>
|
|
566
675
|
|
|
567
|
-
${
|
|
676
|
+
${p.error&&Z.html`<div class="cw-error-bar">${p.error}</div>`}
|
|
568
677
|
|
|
569
|
-
${e.showModelSelector&&
|
|
570
|
-
<${
|
|
571
|
-
availableModels=${
|
|
572
|
-
selectedModel=${
|
|
573
|
-
onSelectModel=${
|
|
574
|
-
thinkingEnabled=${
|
|
575
|
-
onToggleThinking=${
|
|
576
|
-
disabled=${
|
|
678
|
+
${e.showModelSelector&&S.availableModels.length>0&&Z.html`
|
|
679
|
+
<${Ie}
|
|
680
|
+
availableModels=${S.availableModels}
|
|
681
|
+
selectedModel=${S.selectedModel}
|
|
682
|
+
onSelectModel=${S.selectModel}
|
|
683
|
+
thinkingEnabled=${S.thinkingEnabled}
|
|
684
|
+
onToggleThinking=${S.toggleThinking}
|
|
685
|
+
disabled=${p.isLoading}
|
|
577
686
|
/>
|
|
578
687
|
`}
|
|
579
688
|
|
|
580
|
-
<${
|
|
581
|
-
onSend=${
|
|
582
|
-
onCancel=${
|
|
583
|
-
isLoading=${
|
|
689
|
+
<${xe}
|
|
690
|
+
onSend=${r}
|
|
691
|
+
onCancel=${p.cancelRun}
|
|
692
|
+
isLoading=${p.isLoading}
|
|
584
693
|
placeholder=${e.placeholder}
|
|
585
694
|
primaryColor=${e.primaryColor}
|
|
586
695
|
enableVoice=${e.enableVoice}
|
|
587
696
|
/>
|
|
588
|
-
`:
|
|
589
|
-
<${
|
|
590
|
-
tasks=${
|
|
591
|
-
progress=${
|
|
592
|
-
isLoading=${
|
|
593
|
-
error=${
|
|
594
|
-
onUpdate=${
|
|
595
|
-
onRemove=${
|
|
596
|
-
onClear=${
|
|
597
|
-
onRefresh=${
|
|
697
|
+
`:Z.html`
|
|
698
|
+
<${Ae}
|
|
699
|
+
tasks=${b.tasks}
|
|
700
|
+
progress=${b.progress}
|
|
701
|
+
isLoading=${b.isLoading}
|
|
702
|
+
error=${b.error}
|
|
703
|
+
onUpdate=${b.updateTask}
|
|
704
|
+
onRemove=${b.removeTask}
|
|
705
|
+
onClear=${b.clearTasks}
|
|
706
|
+
onRefresh=${b.loadTaskList}
|
|
598
707
|
/>
|
|
599
708
|
`}
|
|
600
709
|
</div>
|
|
601
|
-
`}var
|
|
710
|
+
`}var Le={backendUrl:"http://localhost:8000",agentKey:"default-agent",title:"Chat Assistant",subtitle:"How can we help you today?",primaryColor:"#0066cc",headerTextColor:null,position:"bottom-right",defaultJourneyType:"general",enableDebugMode:!0,enableAutoRun:!0,journeyTypes:{},customerPrompts:{},placeholder:"Type your message...",emptyStateTitle:"Start a Conversation",emptyStateMessage:"Send a message to get started.",authStrategy:null,authToken:null,authHeader:null,authTokenPrefix:null,anonymousSessionEndpoint:null,anonymousTokenKey:"chat_widget_anonymous_token",onAuthError:null,anonymousTokenHeader:"X-Anonymous-Token",conversationIdKey:"chat_widget_conversation_id",sessionTokenKey:"chat_widget_session_token",apiPaths:{anonymousSession:"/api/accounts/anonymous-session/",conversations:"/api/agent-runtime/conversations/",runs:"/api/agent-runtime/runs/",runEvents:"/api/agent-runtime/runs/{runId}/events/",simulateCustomer:"/api/agent-runtime/simulate-customer/",ttsVoices:"/api/tts/voices/",ttsSetVoice:"/api/tts/set-voice/",models:"/api/agent-runtime/models/",systems:"/api/agent-runtime/systems/",agents:"/api/agent-runtime/agents/"},apiCaseStyle:"auto",theme:"light",showConversationSidebar:!0,showClearButton:!0,showDebugButton:!0,showTTSButton:!0,showVoiceSettings:!0,showExpandButton:!0,showModelSelector:!1,showDevTools:!1,enableVoice:!0,modelKey:"chat_widget_selected_model",autoRunDelay:1e3,autoRunMode:"automatic",enableTTS:!1,ttsProxyUrl:null,elevenLabsApiKey:null,ttsVoices:{assistant:null,user:null},ttsModel:"eleven_turbo_v2_5",ttsSettings:{stability:.5,similarity_boost:.75,style:0,use_speaker_boost:!0},availableVoices:[],onEvent:null,containerId:null,embedded:!1,metadata:{}};function Ke(e){let t={...Le.apiPaths,...e.apiPaths||{}};return{...Le,...e,apiPaths:t}}var je=require("preact/compat"),nt=require("htm/preact");var We=new Map,$t=0,O=null,Je=class{constructor(t={}){Ge(this,"_handleStateChange",t=>{this._state=t});this.instanceId=`cw-${++$t}`,this.config=Ke(t),this.container=null,this._state={},this._apiRef={current:null},We.set(this.instanceId,this)}init(){if(this.config.containerId){if(this.container=document.getElementById(this.config.containerId),!this.container)return console.error(`[ChatWidget] Container not found: ${this.config.containerId}`),this;this.container.classList.add("cw-container-embedded")}else this.container=document.createElement("div"),this.container.id=this.instanceId,this.container.className=`cw-container cw-position-${this.config.position}`,document.body.appendChild(this.container);return this._applyTheme(),this._render(),console.log(`[ChatWidget] Instance ${this.instanceId} initialized`),this}_applyTheme(){this.container&&(this.container.classList.remove("cw-dark","cw-auto"),this.config.theme==="dark"?this.container.classList.add("cw-dark"):this.config.theme==="auto"&&this.container.classList.add("cw-auto"))}_render(t={}){this.container&&(0,je.render)(nt.html`<${fe}
|
|
602
711
|
config=${{...this.config,...t}}
|
|
603
712
|
onStateChange=${this._handleStateChange}
|
|
604
|
-
markdownParser=${
|
|
713
|
+
markdownParser=${Ne._enhancedMarkdownParser}
|
|
605
714
|
apiRef=${this._apiRef}
|
|
606
|
-
/>`,this.container)}destroy(){this.container&&((0,
|
|
715
|
+
/>`,this.container)}destroy(){this.container&&((0,je.render)(null,this.container),this.config.containerId?this.container.classList.remove("cw-container-embedded"):this.container.remove(),this.container=null),We.delete(this.instanceId),console.log(`[ChatWidget] Instance ${this.instanceId} destroyed`)}open(){this._apiRef.current?this._apiRef.current.open():this._render({forceOpen:!0})}close(){this._apiRef.current?this._apiRef.current.close():this._render({forceOpen:!1})}send(t){this._apiRef.current&&this._apiRef.current.send(t)}clearMessages(){this._apiRef.current&&this._apiRef.current.clearMessages()}toggleTTS(){this._apiRef.current&&this._apiRef.current.toggleTTS()}stopSpeech(){this._apiRef.current&&this._apiRef.current.stopSpeech()}setAuth(t){this._apiRef.current&&this._apiRef.current.setAuth(t)}clearAuth(){this._apiRef.current&&this._apiRef.current.clearAuth()}getState(){return{...this._state}}getConfig(){return{...this.config}}updateMetadata(t){this.config.metadata={...this.config.metadata,...t},this._render(),console.log(`[ChatWidget] Instance ${this.instanceId} metadata updated:`,t)}updateConfig(t){this.config={...this.config,...t},"theme"in t&&this._applyTheme(),this._render(),console.log(`[ChatWidget] Instance ${this.instanceId} config updated`)}};function at(e={}){return new Je(e).init()}function yt(e={}){return O&&O.destroy(),O=at(e),O}function wt(){O&&(O.destroy(),O=null)}function vt(){O&&O.open()}function kt(){O&&O.close()}function bt(e){O&&O.send(e)}function Ct(){O&&O.clearMessages()}function St(){O&&O.toggleTTS()}function Tt(){O&&O.stopSpeech()}function _t(e){O&&O.setAuth(e)}function Mt(){O&&O.clearAuth()}function xt(){return O?O.getState():null}function Et(){return O?O.getConfig():null}var Ne={createInstance:at,getInstance:e=>We.get(e),getAllInstances:()=>Array.from(We.values()),init:yt,destroy:wt,open:vt,close:kt,send:bt,clearMessages:Ct,toggleTTS:St,stopSpeech:Tt,setAuth:_t,clearAuth:Mt,getState:xt,getConfig:Et,_enhancedMarkdownParser:null};typeof window<"u"&&(window.ChatWidget=Ne);var It=fe;
|