@prodantix/sdk 0.4.2-beta.389 → 0.5.0-beta.395
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.cjs +20 -77
- package/dist/chat.d.cts +15 -5
- package/dist/chat.d.ts +15 -5
- package/dist/chat.js +20 -77
- package/dist/{config-BGZ6cbgG.d.cts → config-CM4nTGof.d.cts} +34 -2
- package/dist/{config-R3BY9rvi.d.ts → config-DJX2zFaa.d.ts} +34 -2
- package/dist/csp.cjs +2 -2
- package/dist/csp.d.cts +2 -1
- package/dist/csp.d.ts +2 -1
- package/dist/csp.js +2 -2
- package/dist/messenger.cjs +1 -1
- package/dist/messenger.d.cts +1 -1
- package/dist/messenger.d.ts +1 -1
- package/dist/messenger.iife.js +18 -75
- package/dist/messenger.js +1 -1
- package/package.json +1 -1
package/dist/chat.cjs
CHANGED
|
@@ -1,41 +1,30 @@
|
|
|
1
|
-
'use strict';var G=Object.defineProperty;var q=(a,e,t)=>e in a?G(a,e,{enumerable:true,configurable:true,writable:true,value:t}):a[e]=t;var l=(a,e,t)=>q(a,typeof e!="symbol"?e+"":e,t);function F(a){if(a)return a;let e=globalThis.fetch;if(typeof e=="function")return e.bind(globalThis)}function H(a){return a.replace(/\/+$/,"")}var W="X-Prodantix-Conversation-Token",L="prodantix.chat.handle";function Y(){let a=globalThis.localStorage;if(a)return {get:e=>a.getItem(e),remove:e=>a.removeItem(e),set:(e,t)=>a.setItem(e,t)}}var k=class{constructor(e){this.options=e;l(this,"fetchImpl");l(this,"host");l(this,"storage");l(this,"handle");l(this,"identity",null);this.fetchImpl=F(e.fetchImpl),this.host=H(e.host),this.storage=e.storage??Y(),this.handle=this.readHandle();}get hasThread(){return this.handle!==null}avatarUrl(e){return e.startsWith("/")?`${this.host}${e}?api_key=${encodeURIComponent(this.options.apiKey)}`:e}get socketAuth(){return this.handle?{conversationId:this.handle.conversationId,conversationToken:this.handle.token,projectKey:this.options.apiKey}:null}identify(e){this.identity=e;}async ensureThread(e){if(this.handle)return true;let t=await this.request("POST","/v1/conversations",{body:{distinctId:this.options.distinctId,subject:e,userHash:this.identity?.userHash,userId:this.identity?.userId}});return !t?.conversationId||!t.token?false:(this.handle={conversationId:t.conversationId,token:t.token},this.storage?.set(L,JSON.stringify(this.handle)),true)}async send(e,t){if(!await this.ensureThread())return null;let n=this.handle;return n?(await this.request("POST",`/v1/conversations/${encodeURIComponent(n.conversationId)}/turns`,{body:{body:e,pageContext:t},token:n.token}))?.turn??null:null}async load(){let e=this.handle;return e?this.request("GET",`/v1/conversations/${encodeURIComponent(e.conversationId)}`,{token:e.token}):null}readHandle(){let e=this.storage?.get(L);if(!e)return null;try{let t=JSON.parse(e);if(typeof t.conversationId=="string"&&typeof t.token=="string")return {conversationId:t.conversationId,token:t.token}}catch{}return this.storage?.remove(L),null}async request(e,t,n={}){let r=this.fetchImpl;if(!r)return this.options.onError?.(new Error("no fetch available for prodantix chat")),null;let o={authorization:`Bearer ${this.options.apiKey}`,"content-type":"application/json"};n.token&&(o[W]=n.token);try{let s=await r(`${this.host}${t}`,{body:n.body===void 0?void 0:JSON.stringify(n.body),headers:o,method:e}),i=await s.text();return s.ok?i?JSON.parse(i):{}:(this.options.onError?.(new Error(`prodantix chat ${t}: ${s.status}`)),null)}catch(s){return this.options.onError?.(s),null}}};var j={Fri:"fri",Mon:"mon",Sat:"sat",Sun:"sun",Thu:"thu",Tue:"tue",Wed:"wed"};function w(a,e){let t=new Intl.DateTimeFormat(void 0,{hour:"2-digit",hour12:false,minute:"2-digit",timeZone:a.timezone,weekday:"short"}).formatToParts(e),n=j[t.find(i=>i.type==="weekday")?.value??""];if(!n)return false;let r=t.find(i=>i.type==="hour")?.value??"",o=t.find(i=>i.type==="minute")?.value??"",s=`${r}:${o}`;return a.windows.some(i=>i.days.includes(n)&&i.open<=s&&s<i.close)}var u={bubbleFill:"filled",bubbleShape:"tailed",composerShape:"round",dayDividers:true,launcherContent:"glyph",launcherFill:"outlined",launcherShape:"circle",launcherSize:"small",nameAvatar:true,namePlacement:"hidden",skin:"standard",stampContent:"time",stampPlacement:"none"},V=["quiet","standard"],J=["round","square"],X=["rounded","tailed"],Z=["filled","outlined"],Q=["circle","pill","squircle"],ee=["filled","outlined"],te=["avatar","glyph","team_faces"],ne=["large","medium","small"],ae=["above","hidden","inline"],re=["beside_name","none","under_turn"],ie=["time","time_and_latency"],f=(a,e,t)=>typeof a=="string"&&e.includes(a)?a:t,R=(a,e)=>typeof a=="boolean"?a:e,oe={avatar_circle:["circle","outlined","avatar","large"],circle_filled:["circle","filled","glyph","medium"],circle_outlined:["circle","outlined","glyph","small"],pill_labelled:["pill","filled","glyph","medium"],pill_team:["pill","outlined","team_faces","medium"],squircle_filled:["squircle","filled","glyph","medium"]},se={above:["above",false],avatar_only:["hidden",true],gutter:["above",true],hidden:["hidden",false],inline:["inline",false]},le={cluster:[true,"none","time"],latency:[false,"beside_name","time_and_latency"],none:[false,"none","time"],trailing:[false,"under_turn","time"],with_name:[false,"beside_name","time"]},ce={concierge:["standard","round"],console:["standard","square"],quiet:["quiet","square"]},de={hairline:["rounded","outlined"],outlined:["rounded","outlined"],rounded:["rounded","filled"],tailed:["tailed","filled"]};function C(a){let e=typeof a=="object"&&a!==null?a:{},t=typeof e.launcherStyle=="string"?e.launcherStyle:void 0,n=t===void 0?void 0:oe[t],r=typeof e.namePlacement=="string"?e.namePlacement:void 0,o=r===void 0?void 0:se[r],s=typeof e.timestampStyle=="string"?e.timestampStyle:void 0,i=s===void 0?void 0:le[s],h=typeof e.skin=="string"?e.skin:void 0,d=h===void 0?void 0:ce[h],c=typeof e.bubbleStyle=="string"?e.bubbleStyle:void 0,p=c===void 0?void 0:de[c],m={bubbleFill:f(e.bubbleFill,Z,p?.[1]??u.bubbleFill),bubbleShape:f(e.bubbleShape,X,p?.[0]??u.bubbleShape),composerShape:f(e.composerShape,J,d?.[1]??u.composerShape),dayDividers:R(e.dayDividers,i?.[0]??u.dayDividers),launcherContent:f(e.launcherContent,te,n?.[2]??u.launcherContent),launcherFill:f(e.launcherFill,ee,n?.[1]??u.launcherFill),launcherShape:f(e.launcherShape,Q,n?.[0]??u.launcherShape),launcherSize:f(e.launcherSize,ne,n?.[3]??u.launcherSize),nameAvatar:R(e.nameAvatar,o?.[1]??u.nameAvatar),namePlacement:f(e.namePlacement,ae,o?.[0]??u.namePlacement),skin:f(e.skin,V,d?.[0]??u.skin),stampContent:f(e.stampContent,ie,i?.[2]??u.stampContent),stampPlacement:f(e.stampPlacement,re,i?.[1]??u.stampPlacement)};return m.stampPlacement==="beside_name"&&m.namePlacement==="hidden"&&(m.stampPlacement="under_turn"),m}function M(a){let e=a.split(/\s+/).filter(n=>n.length>0);return (e.length>1?`${e[0]?.slice(0,1)}${e[1]?.slice(0,1)}`:e[0]?.slice(0,2)??"").toUpperCase()}var pe="M20 11.6a7.4 7.4 0 0 1-7.4 7.4H8.2L4 21.8l1-4.1A7.4 7.4 0 1 1 20 11.6Z",he={large:66,medium:56,small:46},ue={circle:"width:var(--fab-size);height:var(--fab-size);border-radius:calc(var(--fab-size) / 2);",pill:"width:auto;height:var(--fab-size);border-radius:calc(var(--fab-size) / 2);padding:0 22px;gap:10px;",squircle:"width:var(--fab-size);height:var(--fab-size);border-radius:16px;"},me={filled:"background:var(--a);color:#fff;",outlined:"background:var(--paper);border:1px solid var(--hairline);color:var(--ink-2);box-shadow:0 1px 2px rgba(0,0,0,.08);"},ge={avatar:"",glyph:".launcher svg{width:calc(var(--fab-size) * 0.375);height:calc(var(--fab-size) * 0.375);}",team_faces:".launcher .faces{display:flex;}.launcher .faces .av{box-shadow:0 0 0 2px var(--paper);}.launcher .faces .av+.av{margin-left:-10px;}"},fe=".launcher .live{width:10px;height:10px;position:absolute;right:3px;bottom:3px;border-radius:50%;background:var(--online);box-shadow:0 0 0 2px var(--paper);}.launcher.closed .live{display:none}",be={circle:"",pill:".badge{position:static;box-shadow:none}",squircle:""},ye={filled:"",outlined:".badge{background:var(--a);top:-7px;right:-7px;min-width:19px;height:19px;font-size:11.5px}"},xe={circle:"",pill:".launcher .label{font-size:14px;font-weight:600;white-space:nowrap;}",squircle:""},ve={circle:"",pill:"@media (max-width:480px){.launcher{width:var(--fab-size);padding:0}.launcher .label{display:none}}",squircle:""};function O(a,e,t,n){return `.launcher{--fab-size:${he[n]}px;${ue[a]}${me[e]}}${ge[t]}${fe}${be[a]}${ye[e]}${xe[a]}${ve[a]}`}function $(a,e,t,n=r=>r){let r=document.createDocumentFragment();if(a==="glyph"||t.length===0){let o=document.createElement("span");return o.innerHTML=`<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="${pe}"/></svg>`,r.append(...o.childNodes,N()),r}return a==="avatar"?(r.append(z(t[0],e,n),N()),r):(r.append(P(t,e,n),N()),r)}function P(a,e,t=n=>n){let n=document.createElement("span");n.className="faces";for(let r of a.slice(0,2))n.append(z(r,e,t));return n}function z(a,e,t){let n=document.createElement("span");if(n.className="av",n.setAttribute("aria-hidden","true"),a&&(n.style.background=a.tone),a?.avatarUrl){let r=document.createElement("img");return r.alt="",r.src=t(a.avatarUrl),n.append(r),n}return n.textContent=a?a.initials:e.agentLabel.slice(0,2).toUpperCase(),n}function N(){let a=document.createElement("span");return a.className="live",a.setAttribute("aria-hidden","true"),a}var Se={agentLabel:"Agent",aiLabel:"AI",awayBody:"We are away right now, but we will reply as soon as we are back.",closeLabel:"Close chat",emptyBody:"We usually reply within a few minutes.",emptyTitle:"Ask us anything.",inputPlaceholder:"Type a message",launcherLabel:"Chat with us",replyTime:"Usually replying in a few minutes",retryLabel:"Not delivered. Retry",sendLabel:"Send",timeLabel:a=>{let e=new Date(a);return Number.isNaN(e.getTime())?"":`${String(e.getHours()).padStart(2,"0")}:${String(e.getMinutes()).padStart(2,"0")}`},title:"Support",unreadLabel:a=>`${a} unread`},x={accentColor:"#5b5bff",availability:{timezone:"UTC",windows:[]},awayMessage:"",greeting:"",launcherOffsetX:20,launcherOffsetY:20,launcherPosition:"bottom_right",starterPrompts:[],team:[],...u},ke={quiet:".composer{position:relative;padding:8px 10px 10px}.composer input{padding-right:36px}.composer button{position:absolute;top:50%;right:14px;width:28px;min-width:28px;height:28px;padding:0;background:transparent;color:var(--ink);border-radius:7px;transform:translateY(-50%)}.composer button .sendglyph{display:block;width:16px;height:16px}.composer button .sendtext{display:none}.panel{border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,.12)}.header{background:var(--paper);color:var(--ink);height:44px;padding:0 8px 0 16px;border-bottom:1px solid var(--hairline)}.header h2{font-size:11px;letter-spacing:.11em;text-transform:uppercase;color:var(--ink-3)}.header .status{color:var(--ink-3)}.header .av,.header .status .live{box-shadow:0 0 0 2px var(--paper)}.close{color:var(--ink-2)}",standard:".panel{border-radius:16px;box-shadow:0 16px 40px rgba(0,0,0,.2)}.header{background:var(--a);color:#fff;flex-direction:column;align-items:flex-start;gap:14px;padding:18px 14px 20px 20px}.header h2{font-size:19px;font-weight:640}"},Ce={round:".composer{padding:10px 10px 12px;gap:6px}.composer input{height:36px;border-radius:18px;padding:0 14px}.composer button{width:36px;min-width:36px;height:36px;padding:0;border-radius:18px}.composer button .sendglyph{display:block}.composer button .sendtext{display:none}",square:".composer input{height:36px;border-radius:8px;padding:0 12px}"},Ee={rounded:".turn{border-radius:18px;padding:10px 15px}",tailed:".turn.agent,.turn.ai{border-radius:12px 12px 12px 4px}.turn.end_user{border-radius:12px 12px 4px 12px}"},we={filled:"",outlined:".turn{background:none;border:1px solid var(--hairline)}.turn.end_user{background:none;border-color:var(--a);color:var(--ink)}"},Te={above:"",hidden:".turn.agent .author,.turn.ai .author:not(.ai){display:none}",inline:".body .author.below{display:block;margin:4px 0 0;font-size:11.5px;font-weight:500;color:var(--ink-2);text-transform:none;letter-spacing:0;opacity:1}"},Ae=".turn.agent,.turn.ai{display:flex;gap:10px;max-width:100%;background:none;padding:0}.turn.agent .body,.turn.ai .body{background:var(--fill);padding:9px 13px;border-radius:inherit}.author{text-transform:none;letter-spacing:0;font-size:12.5px;font-weight:600;opacity:1}",Le='.divider{display:flex;align-items:center;gap:10px;margin:0;font-size:11px;opacity:.6}.divider:before,.divider:after{content:"";flex:1;height:1px;background:var(--hairline)}',Ne={beside_name:".stamp{font-size:11px;opacity:.7;margin-left:6px}",none:"",under_turn:".stamp{display:block;font-size:11px;opacity:.7;margin-top:4px}.turn.end_user .stamp{text-align:right}"},Pe=".lat{font-size:11px;opacity:.7;margin-left:6px}",B=`--paper: oklch(24.6% 0.015 257); --ink: #fff; --ink-3: rgba(255,255,255,.55);
|
|
1
|
+
'use strict';var Y=Object.defineProperty;var W=(r,e,t)=>e in r?Y(r,e,{enumerable:true,configurable:true,writable:true,value:t}):r[e]=t;var c=(r,e,t)=>W(r,typeof e!="symbol"?e+"":e,t);function H(r){if(r)return r;let e=globalThis.fetch;if(typeof e=="function")return e.bind(globalThis)}function $(r){return r.replace(/\/+$/,"")}var M="X-Prodantix-Conversation-Token",A="prodantix.chat.handle";function J(){let r=globalThis.localStorage;if(r)return {get:e=>r.getItem(e),remove:e=>r.removeItem(e),set:(e,t)=>r.setItem(e,t)}}var C=class{constructor(e){this.options=e;c(this,"fetchImpl");c(this,"fileFetchImpl");c(this,"host");c(this,"storage");c(this,"handle");c(this,"identity",null);this.fetchImpl=H(e.fetchImpl),this.fileFetchImpl=e.fileFetchImpl??((t,n)=>fetch(t,n)),this.host=$(e.host),this.storage=e.storage??J(),this.handle=this.readHandle();}get hasThread(){return this.handle!==null}avatarUrl(e){return e.startsWith("/")?`${this.host}${e}?api_key=${encodeURIComponent(this.options.apiKey)}`:e}get socketAuth(){return this.handle?{conversationId:this.handle.conversationId,conversationToken:this.handle.token,projectKey:this.options.apiKey}:null}identify(e){this.identity=e;}async ensureThread(e){if(this.handle)return true;let t=await this.request("POST","/v1/conversations",{body:{distinctId:this.options.distinctId,subject:e,userHash:this.identity?.userHash,userId:this.identity?.userId}});return !t?.conversationId||!t.token?false:(this.handle={conversationId:t.conversationId,token:t.token},this.storage?.set(A,JSON.stringify(this.handle)),true)}async send(e,t,n){if(!await this.ensureThread())return null;let a=this.handle;return a?(await this.request("POST",`/v1/conversations/${encodeURIComponent(a.conversationId)}/turns`,{body:{attachmentIds:n,body:e,pageContext:t},token:a.token}))?.turn??null:null}async upload(e){if(!await this.ensureThread())return null;let t=this.handle;return t?this.fileRequest("POST",`/v1/conversations/${encodeURIComponent(t.conversationId)}/attachments?name=${encodeURIComponent(e.name)}`,t.token,async n=>JSON.parse(await n.text()),e):null}async file(e){let t=this.handle;return t?this.fileRequest("GET",e,t.token,n=>n.blob()):null}async load(){let e=this.handle;return e?this.request("GET",`/v1/conversations/${encodeURIComponent(e.conversationId)}`,{token:e.token}):null}readHandle(){let e=this.storage?.get(A);if(!e)return null;try{let t=JSON.parse(e);if(typeof t.conversationId=="string"&&typeof t.token=="string")return {conversationId:t.conversationId,token:t.token}}catch{}return this.storage?.remove(A),null}async fileRequest(e,t,n,a,o){let i={authorization:`Bearer ${this.options.apiKey}`,[M]:n};o&&(i["content-type"]=o.type||"application/octet-stream");try{let s=await this.fileFetchImpl(`${this.host}${t}`,{body:o,headers:i,method:e});if(s.ok)return await a(s);this.options.onError?.(new Error(`prodantix chat ${t}: ${s.status}`));}catch(s){this.options.onError?.(s);}return null}async request(e,t,n={}){let a=this.fetchImpl;if(!a)return this.options.onError?.(new Error("no fetch available for prodantix chat")),null;let o={authorization:`Bearer ${this.options.apiKey}`,"content-type":"application/json"};n.token&&(o[M]=n.token);try{let i=await a(`${this.host}${t}`,{body:n.body===void 0?void 0:JSON.stringify(n.body),headers:o,method:e}),s=await i.text();return i.ok?s?JSON.parse(s):{}:(this.options.onError?.(new Error(`prodantix chat ${t}: ${i.status}`)),null)}catch(i){return this.options.onError?.(i),null}}};var V={Fri:"fri",Mon:"mon",Sat:"sat",Sun:"sun",Thu:"thu",Tue:"tue",Wed:"wed"};function w(r,e){let t=new Intl.DateTimeFormat(void 0,{hour:"2-digit",hour12:false,minute:"2-digit",timeZone:r.timezone,weekday:"short"}).formatToParts(e),n=V[t.find(s=>s.type==="weekday")?.value??""];if(!n)return false;let a=t.find(s=>s.type==="hour")?.value??"",o=t.find(s=>s.type==="minute")?.value??"",i=`${a}:${o}`;return r.windows.some(s=>s.days.includes(n)&&s.open<=i&&i<s.close)}var g={bubbleFill:"filled",bubbleShape:"tailed",composerShape:"round",dayDividers:true,launcherContent:"glyph",launcherFill:"outlined",launcherShape:"circle",launcherSize:"small",nameAvatar:true,namePlacement:"hidden",skin:"standard",stampContent:"time",stampPlacement:"none"},X=["quiet","standard"],Z=["round","square"],Q=["rounded","tailed"],ee=["filled","outlined"],te=["circle","pill","squircle"],ne=["filled","outlined"],re=["avatar","glyph","team_faces"],ae=["large","medium","small"],ie=["above","hidden","inline"],oe=["beside_name","none","under_turn"],se=["time","time_and_latency"],x=(r,e,t)=>typeof r=="string"&&e.includes(r)?r:t,O=(r,e)=>typeof r=="boolean"?r:e,le={avatar_circle:["circle","outlined","avatar","large"],circle_filled:["circle","filled","glyph","medium"],circle_outlined:["circle","outlined","glyph","small"],pill_labelled:["pill","filled","glyph","medium"],pill_team:["pill","outlined","team_faces","medium"],squircle_filled:["squircle","filled","glyph","medium"]},ce={above:["above",false],avatar_only:["hidden",true],gutter:["above",true],hidden:["hidden",false],inline:["inline",false]},de={cluster:[true,"none","time"],latency:[false,"beside_name","time_and_latency"],none:[false,"none","time"],trailing:[false,"under_turn","time"],with_name:[false,"beside_name","time"]},pe={concierge:["standard","round"],console:["standard","square"],quiet:["quiet","square"]},ue={hairline:["rounded","outlined"],outlined:["rounded","outlined"],rounded:["rounded","filled"],tailed:["tailed","filled"]};function E(r){let e=typeof r=="object"&&r!==null?r:{},t=typeof e.launcherStyle=="string"?e.launcherStyle:void 0,n=t===void 0?void 0:le[t],a=typeof e.namePlacement=="string"?e.namePlacement:void 0,o=a===void 0?void 0:ce[a],i=typeof e.timestampStyle=="string"?e.timestampStyle:void 0,s=i===void 0?void 0:de[i],d=typeof e.skin=="string"?e.skin:void 0,u=d===void 0?void 0:pe[d],p=typeof e.bubbleStyle=="string"?e.bubbleStyle:void 0,l=p===void 0?void 0:ue[p],m={bubbleFill:x(e.bubbleFill,ee,l?.[1]??g.bubbleFill),bubbleShape:x(e.bubbleShape,Q,l?.[0]??g.bubbleShape),composerShape:x(e.composerShape,Z,u?.[1]??g.composerShape),dayDividers:O(e.dayDividers,s?.[0]??g.dayDividers),launcherContent:x(e.launcherContent,re,n?.[2]??g.launcherContent),launcherFill:x(e.launcherFill,ne,n?.[1]??g.launcherFill),launcherShape:x(e.launcherShape,te,n?.[0]??g.launcherShape),launcherSize:x(e.launcherSize,ae,n?.[3]??g.launcherSize),nameAvatar:O(e.nameAvatar,o?.[1]??g.nameAvatar),namePlacement:x(e.namePlacement,ie,o?.[0]??g.namePlacement),skin:x(e.skin,X,u?.[0]??g.skin),stampContent:x(e.stampContent,se,s?.[2]??g.stampContent),stampPlacement:x(e.stampPlacement,oe,s?.[1]??g.stampPlacement)};return m.stampPlacement==="beside_name"&&m.namePlacement==="hidden"&&(m.stampPlacement="under_turn"),m}function z(r){let e=r.split(/\s+/).filter(n=>n.length>0);return (e.length>1?`${e[0]?.slice(0,1)}${e[1]?.slice(0,1)}`:e[0]?.slice(0,2)??"").toUpperCase()}var he="M20 11.6a7.4 7.4 0 0 1-7.4 7.4H8.2L4 21.8l1-4.1A7.4 7.4 0 1 1 20 11.6Z",me={large:66,medium:56,small:46},ge={circle:"width:var(--fab-size);height:var(--fab-size);border-radius:calc(var(--fab-size) / 2);",pill:"width:auto;height:var(--fab-size);border-radius:calc(var(--fab-size) / 2);padding:0 22px;gap:10px;",squircle:"width:var(--fab-size);height:var(--fab-size);border-radius:16px;"},fe={filled:"background:var(--a);color:#fff;",outlined:"background:var(--paper);border:1px solid var(--hairline);color:var(--ink-2);box-shadow:0 1px 2px rgba(0,0,0,.08);"},be={avatar:"",glyph:".launcher svg{width:calc(var(--fab-size) * 0.375);height:calc(var(--fab-size) * 0.375);}",team_faces:".launcher .faces{display:flex;}.launcher .faces .av{box-shadow:0 0 0 2px var(--paper);}.launcher .faces .av+.av{margin-left:-10px;}"},xe=".launcher .live{width:10px;height:10px;position:absolute;right:3px;bottom:3px;border-radius:50%;background:var(--online);box-shadow:0 0 0 2px var(--paper);}.launcher.closed .live{display:none}",ye={circle:"",pill:".badge{position:static;box-shadow:none}",squircle:""},ve={filled:"",outlined:".badge{background:var(--a);top:-7px;right:-7px;min-width:19px;height:19px;font-size:11.5px}"},ke={circle:"",pill:".launcher .label{font-size:14px;font-weight:600;white-space:nowrap;}",squircle:""},Se={circle:"",pill:"@media (max-width:480px){.launcher{width:var(--fab-size);padding:0}.launcher .label{display:none}}",squircle:""};function U(r,e,t,n){return `.launcher{--fab-size:${me[n]}px;${ge[r]}${fe[e]}}${be[t]}${xe}${ye[r]}${ve[e]}${ke[r]}${Se[r]}`}function B(r,e,t,n=a=>a){let a=document.createDocumentFragment();if(r==="glyph"||t.length===0){let o=document.createElement("span");return o.innerHTML=`<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="${he}"/></svg>`,a.append(...o.childNodes,N()),a}return r==="avatar"?(a.append(D(t[0],e,n),N()),a):(a.append(P(t,e,n),N()),a)}function P(r,e,t=n=>n){let n=document.createElement("span");n.className="faces";for(let a of r.slice(0,2))n.append(D(a,e,t));return n}function D(r,e,t){let n=document.createElement("span");if(n.className="av",n.setAttribute("aria-hidden","true"),r&&(n.style.background=r.tone),r?.avatarUrl){let a=document.createElement("img");return a.alt="",a.src=t(r.avatarUrl),n.append(a),n}return n.textContent=r?r.initials:e.agentLabel.slice(0,2).toUpperCase(),n}function N(){let r=document.createElement("span");return r.className="live",r.setAttribute("aria-hidden","true"),r}var Ce={agentLabel:"Agent",aiLabel:"AI",attachLabel:"Attach a file",awayBody:"We are away right now, but we will reply as soon as we are back.",closeLabel:"Close chat",emptyBody:"We usually reply within a few minutes.",emptyTitle:"Ask us anything.",fileRefusal:(r,e)=>`That file is ${r}. Send a PNG, JPEG, WebP, GIF or PDF up to ${e}.`,inputPlaceholder:"Type a message",launcherLabel:"Chat with us",removeFileLabel:"Remove file",replyTime:"Usually replying in a few minutes",retryLabel:"Not delivered. Retry",sendLabel:"Send",timeLabel:r=>{let e=new Date(r);return Number.isNaN(e.getTime())?"":`${String(e.getHours()).padStart(2,"0")}:${String(e.getMinutes()).padStart(2,"0")}`},title:"Support",unreadLabel:r=>`${r} unread`},S={accentColor:"#5b5bff",availability:{timezone:"UTC",windows:[]},awayMessage:"",greeting:"",launcherOffsetX:20,launcherOffsetY:20,launcherPosition:"bottom_right",starterPrompts:[],team:[],...g},Ee={quiet:".composer{position:relative;padding:8px 10px 10px}.composer input{padding-right:36px}.composer button{position:absolute;top:50%;right:14px;width:28px;min-width:28px;height:28px;padding:0;background:transparent;color:var(--ink);border-radius:7px;transform:translateY(-50%)}.composer button .sendglyph{display:block;width:16px;height:16px}.composer button .sendtext{display:none}.panel{border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,.12)}.header{background:var(--paper);color:var(--ink);height:44px;padding:0 8px 0 16px;border-bottom:1px solid var(--hairline)}.header h2{font-size:11px;letter-spacing:.11em;text-transform:uppercase;color:var(--ink-3)}.header .faces,.header .status{display:none}.header .close{top:6px}.close{color:var(--ink-2)}",standard:".panel{border-radius:16px;box-shadow:0 16px 40px rgba(0,0,0,.2)}.header{background:var(--a);color:#fff;flex-direction:column;align-items:flex-start;gap:14px;padding:18px 14px 20px 20px}.header h2{font-size:19px;font-weight:640}"},Te={round:".composer{padding:10px 10px 12px;gap:6px}.composer input{height:36px;border-radius:18px;padding:0 14px}.composer button{width:36px;min-width:36px;height:36px;padding:0;border-radius:18px}.composer button .sendglyph{display:block}.composer button .sendtext{display:none}",square:".composer input{height:36px;border-radius:8px;padding:0 12px}"},we={rounded:".turn{border-radius:18px;padding:10px 15px}",tailed:".turn.agent,.turn.ai{border-radius:12px 12px 12px 4px}.turn.end_user{border-radius:12px 12px 4px 12px}"},Le={filled:"",outlined:".turn{background:none;border:1px solid var(--hairline)}.turn.end_user{background:none;border-color:var(--a);color:var(--ink)}"},Ae={above:"",hidden:".turn.agent .author,.turn.ai .author:not(.ai){display:none}",inline:".body .author.below{display:block;margin:4px 0 0;font-size:11.5px;font-weight:500;color:var(--ink-2);text-transform:none;letter-spacing:0;opacity:1}"},Ne=".turn.agent,.turn.ai{display:flex;gap:10px;max-width:100%;background:none;padding:0}.turn.agent .body,.turn.ai .body{background:var(--fill);padding:9px 13px;border-radius:inherit}.author{text-transform:none;letter-spacing:0;font-size:12.5px;font-weight:600;opacity:1}",Pe='.divider{display:flex;align-items:center;gap:10px;margin:0;font-size:11px;opacity:.6}.divider:before,.divider:after{content:"";flex:1;height:1px;background:var(--hairline)}',_e={beside_name:".stamp{font-size:11px;opacity:.7;margin-left:6px}",none:"",under_turn:".stamp{display:block;font-size:11px;opacity:.7;margin-top:4px}.turn.end_user .stamp{text-align:right}"},Fe=".lat{font-size:11px;opacity:.7;margin-left:6px}",Ie=".att{display:block;width:180px;margin-bottom:6px;border-radius:8px;overflow:hidden}.att img{display:block;width:100%}.pdfc{display:inline-flex;gap:8px;align-items:center;margin-bottom:6px;padding:6px 8px;border-radius:8px;background:color-mix(in srgb,currentColor 16%,transparent);color:inherit;font-size:12.5px;text-decoration:none;overflow-wrap:anywhere}.pdfc b,.file b{flex:none;display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:4px;font-size:9px;letter-spacing:.04em;background:color-mix(in srgb,currentColor 22%,transparent)}.att:last-child,.pdfc:last-child{margin-bottom:0}";function Re(r){let e=r==="round"?14:12;return `.field{position:relative;flex:1;min-width:0;display:flex}.composer .field input{padding-left:${e+26}px}.composer button.clip{position:absolute;top:50%;left:${e-5}px;right:auto;width:28px;min-width:28px;height:28px;padding:0;border-radius:7px;background:none;color:var(--ink-2);transform:translateY(-50%)}.composer button.clip:hover{background:color-mix(in srgb,currentColor 14%,transparent)}.clip svg{display:block;width:18px;height:18px}.file{display:inline-flex;gap:8px;align-items:center;align-self:flex-start;max-width:calc(100% - 20px);margin:0 10px 8px;padding:6px 10px 6px 6px;font-size:12.5px;color:var(--ink);border:1px solid var(--hairline);border-radius:8px}.file .th{flex:none;width:28px;height:28px;border-radius:4px;object-fit:cover}.file .name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file .sz,.file .x{flex:none;color:var(--ink-3)}.file .x{margin-left:4px;padding:0;border:0;background:none;font:inherit;font-size:16px;line-height:1;cursor:pointer}.ferr{margin:0 10px 6px;font-size:12px;color:oklch(60% 0.2 27)}`}function _(r){return r<999500?`${Math.max(1,Math.round(r/1e3))} KB`:`${(r/1e6).toFixed(1)} MB`}var G=`--paper: oklch(24.6% 0.015 257); --ink: #fff; --ink-3: rgba(255,255,255,.55);
|
|
2
2
|
--fill: rgba(255,255,255,.06); --hairline: rgba(255,255,255,.13); --ink-2: rgba(255,255,255,.70);
|
|
3
|
-
--online: oklch(72% 0.13 163.23);`;function
|
|
3
|
+
--online: oklch(72% 0.13 163.23);`;function He(r){return r==="light"?"":r==="dark"?`:host { ${G} }`:`@media (prefers-color-scheme: dark) {
|
|
4
4
|
:host {
|
|
5
|
-
${
|
|
5
|
+
${G}
|
|
6
6
|
}
|
|
7
|
-
}`}function
|
|
7
|
+
}`}var $e=/https?:\/\/[^\s<>"]+/g,Me=/[.,;:!?)]$/,Oe=r=>{let e=r;for(;Me.test(e);){let t=e.split("(").length-1,n=e.split(")").length-1;if(e.endsWith(")")&&t>=n)break;e=e.slice(0,-1);}return e};function ze(r,e){let t=0;for(let n of e.matchAll($e)){let a=n.index??0,o=Oe(n[0]);a>t&&r.append(e.slice(t,a));let i=document.createElement("a");i.href=o,i.target="_blank",i.rel="noopener noreferrer",i.textContent=o,r.append(i),t=a+o.length;}t<e.length&&r.append(e.slice(t));}function F(r,e="system"){let t=E(r),n=r.launcherPosition==="bottom_left"?"left":"right",a=r.accentColor;return `${`
|
|
8
8
|
:host {
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
document floor and anything the page raises (a cookie bar, a dev chip)
|
|
12
|
-
draws over them: the WebMCP chip covered the launcher on clepit's landing.
|
|
13
|
-
Below the 32-bit ceiling so a host can still put something over us
|
|
14
|
-
deliberately. */
|
|
15
|
-
all: initial; z-index: 2147483000; --a: ${r};
|
|
16
|
-
--paper: #fff; --ink: #0f172a; --ink-3: var(--ink-3);
|
|
9
|
+
all: initial; z-index: 2147483000; --a: ${a};
|
|
10
|
+
--paper: #fff; --ink: #0f172a; --ink-3: rgba(0,0,0,.55);
|
|
17
11
|
--fill: #f1f5f9; --hairline: #e2e8f0; --ink-2: rgba(0,0,0,.72);
|
|
18
12
|
--online: oklch(53.8% 0.1274 163.23);
|
|
19
13
|
color-scheme: ${e==="system"?"light dark":e};
|
|
20
14
|
}
|
|
21
|
-
${
|
|
15
|
+
${He(e)}
|
|
22
16
|
* { box-sizing: border-box; font-family: system-ui, sans-serif; }
|
|
23
17
|
.launcher {
|
|
24
|
-
z-index: 2147483000; position: fixed; ${n}: ${
|
|
18
|
+
z-index: 2147483000; position: fixed; ${n}: ${r.launcherOffsetX}px; bottom: ${r.launcherOffsetY}px; width: 56px; height: 56px;
|
|
25
19
|
border-radius: 28px; border: none; cursor: pointer;
|
|
26
20
|
display: inline-flex; align-items: center; justify-content: center;
|
|
27
|
-
background: ${
|
|
21
|
+
background: ${a}; color: #fff; font-size: 24px;
|
|
28
22
|
box-shadow: 0 4px 12px rgba(0,0,0,.2);
|
|
29
23
|
}
|
|
30
24
|
.launcher:focus-visible { outline: 3px solid #0b0e14; outline-offset: 2px; }
|
|
31
|
-
/* A BACKGROUND change, never a position change. Nothing else in the fleet
|
|
32
|
-
moves under the pointer: .button[data-variant] and .iconButton all hover by
|
|
33
|
-
background alone. This used to lift by translateY(-1px), which made the one
|
|
34
|
-
control a visitor is meant to click the only element in the product that
|
|
35
|
-
shifted when pointed at. */
|
|
36
25
|
.launcher { transition: background-color 120ms ease; }
|
|
37
|
-
.launcher:hover { background: color-mix(in srgb, #000 12%, ${
|
|
38
|
-
.launcher:active { background: color-mix(in srgb, #000 20%, ${
|
|
26
|
+
.launcher:hover { background: color-mix(in srgb, #000 12%, ${a}); }
|
|
27
|
+
.launcher:active { background: color-mix(in srgb, #000 20%, ${a}); }
|
|
39
28
|
@media (prefers-reduced-motion: reduce) {
|
|
40
29
|
.launcher { transition: none; }
|
|
41
30
|
}
|
|
@@ -44,54 +33,23 @@ ${_e(e)}
|
|
|
44
33
|
border-radius: 10px; background: #dc2626; color: #fff; font-size: 12px;
|
|
45
34
|
display: flex; align-items: center; justify-content: center; padding: 0 4px;
|
|
46
35
|
}
|
|
47
|
-
/* renderBadge hides this with the hidden attribute, which is UA display:none
|
|
48
|
-
and is beaten by ANY author display. The rule above is one, so the badge
|
|
49
|
-
rendered for every visitor with no unread messages: an empty red circle on
|
|
50
|
-
the launcher, in production, for as long as it has shipped. The hiding code
|
|
51
|
-
read as if it worked, which is why nothing caught it. Keep this rule beside
|
|
52
|
-
the one that needs it. */
|
|
53
36
|
.badge[hidden] { display: none; }
|
|
54
37
|
.panel {
|
|
55
|
-
z-index: 2147483001; position: fixed; ${n}: ${
|
|
38
|
+
z-index: 2147483001; position: fixed; ${n}: ${r.launcherOffsetX}px; bottom: ${r.launcherOffsetY+68}px; width: 360px; max-width: calc(100vw - 40px);
|
|
56
39
|
height: 520px; max-height: calc(100vh - 120px); background: var(--paper); color: var(--ink);
|
|
57
40
|
border-radius: 12px; box-shadow: 0 8px 32px rgba(0,0,0,.24);
|
|
58
41
|
display: flex; flex-direction: column; overflow: hidden;
|
|
59
42
|
}
|
|
60
43
|
.header { position: relative; padding: 14px 16px; background: #0b0e14; color: #fff; display: flex; align-items: center; justify-content: space-between; }
|
|
61
44
|
.header h2 { margin: 0; font-size: 15px; }
|
|
62
|
-
/* Sized from the Configure tab's own head: 36px faces overlapping by 12, the
|
|
63
|
-
status line 12.5px at 80% under the title. The ring is the header's own
|
|
64
|
-
ground so overlapping faces separate from it and from each other. */
|
|
65
45
|
.header .faces { display: flex; }
|
|
66
|
-
/* The fill is the face's own tone, set inline from the served config: one of
|
|
67
|
-
the record's two face tones, never the accent this header is painted in. The
|
|
68
|
-
ring is the accent because its job is to part two OVERLAPPING discs from each
|
|
69
|
-
other and from the header behind them. */
|
|
70
46
|
.header .av { width: 36px; height: 36px; box-shadow: 0 0 0 2px var(--a); }
|
|
71
47
|
.header .av + .av { margin-left: -12px; }
|
|
72
48
|
.headmain { display: flex; flex-direction: column; }
|
|
73
49
|
.header .status { display: flex; align-items: center; gap: 6px; margin: 5px 0 0; font-size: 12.5px; color: rgb(255 255 255 / 80%); }
|
|
74
|
-
/* The dot's ring is the PAPER, not the accent. An accent ring on the standard
|
|
75
|
-
skin is the header's own background and draws nothing, which is how this
|
|
76
|
-
shipped looking ringless beside a preview that had one. The faces above keep
|
|
77
|
-
the accent ring, which is a different job: separating two overlapping discs
|
|
78
|
-
from each other and from the header. */
|
|
79
50
|
.header .status .live { flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--online); box-shadow: 0 0 0 2px var(--paper); }
|
|
80
|
-
/* Hours, the same fact the launcher's dot carries. A green dot and a sentence
|
|
81
|
-
promising a reply in minutes are both claims about somebody being there, so
|
|
82
|
-
outside the project's hours neither is drawn: the away message in the thread
|
|
83
|
-
is what speaks then. */
|
|
84
51
|
.panel.closed .status { display: none; }
|
|
85
|
-
/* Pinned rather than laid out: the standard skin turns this header into a
|
|
86
|
-
column so the title can carry a line under it, and a close button that is
|
|
87
|
-
merely a flex sibling then stacks BELOW the title on the left, which is where
|
|
88
|
-
clepit's landing showed it. */
|
|
89
52
|
.header .close { position: absolute; top: 8px; right: 8px; }
|
|
90
|
-
/* The fleet's icon button: a padded square, a radius, and a hover that tints
|
|
91
|
-
the background. This carried none of them, so the messenger's close was the
|
|
92
|
-
one icon button in the product with no radius and no hover at all. The tint
|
|
93
|
-
is mixed from currentColor rather than a fixed white because the header is
|
|
94
|
-
the accent on some skins and the paper on others. */
|
|
95
53
|
.close {
|
|
96
54
|
display: inline-flex; align-items: center; justify-content: center;
|
|
97
55
|
width: 32px; height: 32px; padding: 0;
|
|
@@ -104,19 +62,14 @@ ${_e(e)}
|
|
|
104
62
|
.close:focus-visible { outline: 2px solid currentColor; outline-offset: 1px; }
|
|
105
63
|
.log { flex: 1; overflow-y: auto; padding: 12px; display: flex; flex-direction: column; gap: 8px; }
|
|
106
64
|
.turn { max-width: 80%; padding: 8px 12px; border-radius: 12px; font-size: 14px; }
|
|
107
|
-
.turn.end_user { align-self: flex-end; background: ${
|
|
65
|
+
.turn.end_user { align-self: flex-end; background: ${a}; color: #fff; }
|
|
108
66
|
.turn.agent, .turn.ai { align-self: flex-start; background: var(--fill); color: var(--ink); }
|
|
67
|
+
.turn.ai a { color: ${a}; text-decoration: underline; overflow-wrap: anywhere; }
|
|
109
68
|
.author { font-size: 11px; opacity: .7; margin-bottom: 2px; }
|
|
110
|
-
/* In flight. Dimmed rather than spinner'd or greyed out: the words are already
|
|
111
|
-
readable and the only thing not yet true is that anyone else has them. No
|
|
112
|
-
transition, because a fade running as the bubble appears reads as the lag
|
|
113
|
-
this change exists to remove. */
|
|
114
69
|
.turn[data-pending] { opacity: .6; }
|
|
115
70
|
.turn[data-failed] { opacity: 1; box-shadow: inset 0 0 0 1px #dc2626; }
|
|
116
|
-
/* Inside the bubble, under the words it belongs to. A failure notice parked
|
|
117
|
-
somewhere else in the panel does not say WHICH message went nowhere. */
|
|
118
71
|
.retry { display: block; margin: 5px 0 0; padding: 0; background: none; border: 0; color: inherit; font: inherit; font-size: 11.5px; text-decoration: underline; cursor: pointer; opacity: .85; }
|
|
119
|
-
.away { display: flex; gap: 10px; align-items: flex-start; margin: 12px 12px 0; padding: 10px 14px; font-size: 13px; line-height: 1.43; color: ${
|
|
72
|
+
.away { display: flex; gap: 10px; align-items: flex-start; margin: 12px 12px 0; padding: 10px 14px; font-size: 13px; line-height: 1.43; color: ${a}; background: color-mix(in srgb, ${a} 12%, transparent); border-radius: 4px; }
|
|
120
73
|
.awayglyph { flex: none; width: 16px; height: 16px; margin-top: 1px; border: 1.5px solid currentColor; border-radius: 50%; }
|
|
121
74
|
.empty { display: flex; flex-direction: column; gap: 8px; padding: 20px 16px; }
|
|
122
75
|
.empty h3 { margin: 0; font-size: 18px; font-weight: 640; letter-spacing: -.015em; }
|
|
@@ -126,25 +79,15 @@ ${_e(e)}
|
|
|
126
79
|
font-family: inherit; font-size: 13.5px; font-weight: 500; color: var(--ink);
|
|
127
80
|
background: none; border: 1px solid var(--hairline); border-radius: 8px; cursor: pointer;
|
|
128
81
|
}
|
|
129
|
-
.prompt:focus-visible { outline: 2px solid ${
|
|
82
|
+
.prompt:focus-visible { outline: 2px solid ${a}; outline-offset: 2px; }
|
|
130
83
|
.av { width: 30px; height: 30px; border-radius: 50%; flex: none; display: inline-flex; align-items: center; justify-content: center; font-size: 11.5px; font-weight: 650; color: #fff; background: oklch(52% 0.17 22); }
|
|
131
84
|
.av.bot { border-radius: 9px; background: var(--fill); color: var(--ink); }
|
|
132
85
|
.av img { width: 100%; height: 100%; display: block; object-fit: cover; border-radius: inherit; }
|
|
133
|
-
/* 36px, against a message bubble measured at 33px in the panel (14px type,
|
|
134
|
-
8px of padding, rendered). The field was 46px round and 44px square, half
|
|
135
|
-
again the height of anything it produced, which is what read as too much air
|
|
136
|
-
inside it; 36 sits a hair above a bubble, which is the room a field wants for
|
|
137
|
-
a caret and a placeholder and a bubble does not. The type stays at 14px, the
|
|
138
|
-
same size the messages are set in: the box came down, not the words.
|
|
139
|
-
|
|
140
|
-
No backtick in this comment, or in any other inside this sheet. It is a
|
|
141
|
-
template literal, so one ends the string and the rest of the CSS becomes a
|
|
142
|
-
tagged-template call. Writing a selector as code here cost 124 tests. */
|
|
143
86
|
.composer { display: flex; gap: 6px; padding: 10px; border-top: 1px solid var(--hairline); }
|
|
144
87
|
.composer input { flex: 1; min-width: 0; height: 36px; padding: 0 12px; border: 0; border-radius: 8px; font-size: 14px; background: var(--fill); color: var(--ink); }
|
|
145
|
-
.composer input:focus-visible { outline: 2px solid ${
|
|
146
|
-
.composer button { display: inline-flex; align-items: center; justify-content: center; gap: 0; min-width: 56px; height: 36px; padding: 0 14px; background: ${
|
|
147
|
-
.composer button:hover { background: color-mix(in srgb, #000 12%, ${
|
|
88
|
+
.composer input:focus-visible { outline: 2px solid ${a}; }
|
|
89
|
+
.composer button { display: inline-flex; align-items: center; justify-content: center; gap: 0; min-width: 56px; height: 36px; padding: 0 14px; background: ${a}; color: #fff; border: none; border-radius: 8px; cursor: pointer; font-family: inherit; font-size: 13.5px; font-weight: 550; }
|
|
90
|
+
.composer button:hover { background: color-mix(in srgb, #000 12%, ${a}); }
|
|
148
91
|
.composer button:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
|
|
149
92
|
.composer button .sendglyph { display: none; width: 17px; height: 17px; }
|
|
150
93
|
.composer button:focus-visible { outline: 2px solid #0b0e14; }
|
|
@@ -152,5 +95,5 @@ ${_e(e)}
|
|
|
152
95
|
.panel { animation: rise 180ms ease-out; }
|
|
153
96
|
@keyframes rise { from { transform: translateY(8px); opacity: 0; } to { transform: none; opacity: 1; } }
|
|
154
97
|
}
|
|
155
|
-
`}${Ce[t.composerShape]}${ke[t.skin]}${O(t.launcherShape,t.launcherFill,t.launcherContent,t.launcherSize)}${Ee[t.bubbleShape]}${we[t.bubbleFill]}${Te[t.namePlacement]}${t.nameAvatar?Ae:""}${t.dayDividers?Le:""}${Ne[t.stampPlacement]}${t.stampContent==="time_and_latency"?Pe:""}`}var Ie=["end_user","agent","ai"];function Fe(){let a=globalThis.location;if(a)return {host:a.host,path:a.pathname,title:document.title}}var He='<svg viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M15.88 9.29 12 13.17 8.12 9.29a.996.996 0 0 0-1.41 0c-.39.39-.39 1.02 0 1.41l4.59 4.59c.39.39 1.02.39 1.41 0l4.59-4.59c.39-.39.39-1.02 0-1.41-.39-.38-1.03-.39-1.42 0"/></svg>',E=class{constructor(e,t,n={},r={},o={}){this.host=e;this.client=t;l(this,"root");l(this,"strings");l(this,"settings");l(this,"appearance");l(this,"launcher");l(this,"badge");l(this,"panel",null);l(this,"lastFocused",null);l(this,"unread",0);l(this,"pendingTurns",0);l(this,"openNow");l(this,"style");l(this,"scheme");this.strings={...Se,...n},this.appearance={...x,...r},this.settings=C({...x,...r}),this.root=e.attachShadow({mode:o.shadowMode??"closed"}),this.openNow=w(this.appearance.availability,new Date),this.scheme=o.scheme,this.style=document.createElement("style"),this.style.textContent=_(this.appearance,this.scheme),this.root.append(this.style),this.launcher=document.createElement("button"),this.launcher.className="launcher",this.launcher.type="button",this.launcher.setAttribute("aria-haspopup","dialog"),this.launcher.addEventListener("click",()=>this.toggle()),this.badge=document.createElement("span"),this.badge.className="badge",this.badge.hidden=true,this.drawLauncher(),this.root.append(this.launcher);}drawLauncher(){if(this.launcher.setAttribute("aria-label",this.strings.launcherLabel),this.launcher.replaceChildren(),this.launcher.append($(this.settings.launcherContent,this.strings,this.appearance.team,e=>this.client.avatarUrl(e))),this.settings.launcherShape==="pill"){let e=document.createElement("span");e.className="label",e.textContent=this.settings.launcherContent==="team_faces"?this.strings.agentLabel:this.strings.launcherLabel,this.launcher.append(e);}this.launcher.append(this.badge),this.launcher.classList.toggle("closed",!this.openNow);}update(e,t){this.appearance={...x,...e},this.settings=C(this.appearance),t!==void 0&&(this.scheme=t),this.style.textContent=_(this.appearance,this.scheme),this.drawLauncher(),this.panel&&(this.close(),this.open());}toggle(){this.panel?this.close():this.open();}setOpenNow(e){this.openNow=e,this.launcher.classList.toggle("closed",!e),this.panel?.classList.toggle("closed",!e);}async open(){if(this.panel)return;this.lastFocused=this.host.ownerDocument.activeElement,this.unread=0,this.renderBadge();let e=document.createElement("section");e.className=this.openNow?"panel":"panel closed",e.setAttribute("role","dialog"),e.setAttribute("aria-modal","true"),e.setAttribute("aria-label",this.strings.title);let t=document.createElement("div");t.className="header";let n=this.appearance.team??[];n.length>0&&t.append(P(n,this.strings,b=>this.client.avatarUrl(b)));let r=document.createElement("div");r.className="headmain";let o=document.createElement("h2");o.textContent=this.strings.title;let s=document.createElement("p");s.className="status";let i=document.createElement("span");i.className="live",i.setAttribute("aria-hidden","true"),s.append(i,this.strings.replyTime),r.append(o,s);let h=document.createElement("button");h.className="close",h.type="button",h.setAttribute("aria-label",this.strings.closeLabel),h.innerHTML=He,h.addEventListener("click",()=>this.close()),t.append(r,h);let d=document.createElement("div");d.className="log",d.setAttribute("role","log"),d.setAttribute("aria-live","polite"),d.setAttribute("aria-label",this.strings.title);let c=document.createElement("form");c.className="composer";let p=document.createElement("input");p.type="text",p.setAttribute("aria-label",this.strings.inputPlaceholder),p.placeholder=this.strings.inputPlaceholder;let m=document.createElement("button");m.type="submit",m.setAttribute("aria-label",this.strings.sendLabel),m.innerHTML='<svg class="sendglyph" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4.5 12 20 4.5 15 20l-3.6-5.4L4.5 12Z"/></svg>';let v=document.createElement("span");v.className="sendtext",v.textContent=this.strings.sendLabel,m.append(v),c.append(p,m),c.addEventListener("submit",b=>{b.preventDefault(),this.submit(p,d);}),e.append(t,d,c),e.addEventListener("keydown",b=>this.onKeydown(b,e,h)),this.root.append(e),this.panel=e,p.focus();let y=await this.client.load();y&&y.turns.length>0?this.renderThread(d,y):this.renderFirstRun(d,p),this.openNow||this.renderAway(t);}renderFirstRun(e,t){let n=document.createElement("div");n.className="empty";let r=document.createElement("h3");r.textContent=this.appearance.greeting.trim()||this.strings.emptyTitle;let o=document.createElement("p");o.textContent=this.strings.emptyBody,n.append(r,o);for(let s of this.appearance.starterPrompts){let i=document.createElement("button");i.className="prompt",i.type="button",i.textContent=s,i.addEventListener("click",()=>{t.value=s,this.submit(t,e);}),n.append(i);}e.replaceChildren(n);}renderAway(e){let t=document.createElement("div");t.className="away";let n=document.createElement("span");n.className="awayglyph",n.setAttribute("aria-hidden","true");let r=document.createElement("span");r.textContent=this.appearance.awayMessage.trim()||this.strings.awayBody,t.append(n,r),e.after(t);}close(){this.panel&&(this.panel.remove(),this.panel=null,this.lastFocused instanceof HTMLElement?this.lastFocused.focus():this.launcher.focus());}onIncomingTurn(e){if(this.panel){let t=this.panel.querySelector(".log");t instanceof HTMLElement&&!this.hasTurn(t,e.id)&&this.appendTurn(t,e);return}e.authorKind!=="end_user"&&(this.unread+=1,this.renderBadge());}async submit(e,t){let n=e.value.trim();n&&(e.value="",await this.sendBody(t,n));}async sendBody(e,t){e.querySelector(".empty")?.remove(),this.pendingTurns+=1;let n=this.appendTurn(e,{authorId:null,authorKind:"end_user",body:t,createdAt:new Date().toISOString(),id:`pending-${this.pendingTurns}`});n.setAttribute("data-pending","");let r=await this.client.send(t,Fe());if(n.removeAttribute("data-pending"),r){n.dataset.turnId=r.id;return}this.markFailed(e,n,t);}markFailed(e,t,n){t.setAttribute("data-failed","");let r=document.createElement("button");r.type="button",r.className="retry",r.textContent=this.strings.retryLabel,r.addEventListener("click",()=>{t.remove(),this.sendBody(e,n);}),(t.querySelector(".body")??t).append(r);}hasTurn(e,t){for(let n of e.children)if(n instanceof HTMLElement&&n.dataset.turnId===t)return true;return false}renderThread(e,t){e.replaceChildren();for(let n of t.turns)this.appendTurn(e,n);}appendTurn(e,t){e.querySelector(".empty")?.remove();let n=Ie.includes(t.authorKind)?t.authorKind:"agent",r=this.settings,o=document.createElement("div");if(o.className=`turn ${n}`,o.dataset.turnId=t.id,n!=="end_user"&&r.nameAvatar){let c=document.createElement("span");if(c.className=n==="ai"?"av bot":"av",c.setAttribute("aria-hidden","true"),n==="agent"&&t.authorAvatarUrl){let p=document.createElement("img");p.alt="",p.src=this.client.avatarUrl(t.authorAvatarUrl),c.append(p);}else {c.textContent=n==="ai"?this.strings.aiLabel:M(this.agentName(t));let p=n==="agent"?this.appearance.team?.find(m=>m.name===t.authorName)?.tone:void 0;p&&(c.style.background=p);}o.append(c);}let i=document.createElement("div");i.className="body";let h=n!=="end_user"&&r.namePlacement!=="hidden",d=document.createElement("div");if(d.textContent=t.body,h||n==="ai"&&r.namePlacement==="hidden"){let c=document.createElement("div");c.className=n==="ai"?"author ai":"author",c.textContent=n==="ai"?this.strings.aiLabel:this.agentName(t),r.stampPlacement==="beside_name"&&c.append(this.stamp(t)),r.namePlacement==="inline"?(c.classList.add("below"),i.append(d,c)):i.append(c,d);}else i.append(d);return r.stampPlacement==="under_turn"&&i.append(this.stamp(t)),o.append(i),e.append(o),e.scrollTop=e.scrollHeight,o}agentName(e){return e.authorName||this.strings.agentLabel}stamp(e){let t=document.createElement("span");return t.className="stamp",t.textContent=this.strings.timeLabel(e.createdAt),t}onKeydown(e,t,n){if(e.key==="Escape"){e.preventDefault(),this.close();return}if(e.key!=="Tab")return;let r=t.querySelectorAll('button, input, [tabindex]:not([tabindex="-1"])');if(r.length===0)return;let o=r[0],s=r[r.length-1],i=this.root.activeElement;e.shiftKey&&i===o?(e.preventDefault(),s.focus()):!e.shiftKey&&i===s?(e.preventDefault(),o.focus()):i===null&&(e.preventDefault(),n.focus());}renderBadge(){this.unread>0?(this.badge.hidden=false,this.badge.textContent=String(this.unread),this.launcher.setAttribute("aria-label",`${this.strings.launcherLabel}, ${this.strings.unreadLabel(this.unread)}`)):(this.badge.hidden=true,this.badge.textContent="",this.launcher.setAttribute("aria-label",this.strings.launcherLabel));}};function U(a){return `40${JSON.stringify(a)}`}function D(){return "3"}function K(a){let e=a.charAt(0),t=a.slice(1);if(e==="2")return {kind:"ping"};if(e==="1")return {kind:"disconnect"};if(e==="0"){let s=I(t);return {kind:"open",pingInterval:typeof s?.pingInterval=="number"?s.pingInterval:25e3,pingTimeout:typeof s?.pingTimeout=="number"?s.pingTimeout:2e4}}if(e!=="4")return {kind:"other"};let n=t.charAt(0),r=t.slice(1);if(n==="0")return {kind:"connected"};if(n==="1")return {kind:"disconnect"};if(n==="4"){let s=I(r);return {kind:"connectError",message:typeof s?.message=="string"?s.message:"refused"}}if(n!=="2")return {kind:"other"};let o=I(r);return !Array.isArray(o)||typeof o[0]!="string"?{kind:"other"}:{kind:"event",name:o[0],payload:o[1]}}function I(a){try{return JSON.parse(a)}catch{return null}}var Re="/socket.io/?EIO=4&transport=websocket",T=class{constructor(e){this.options=e;l(this,"socket",null);l(this,"heartbeat",null);l(this,"ready",false);l(this,"closed",false);l(this,"heartbeatWindow",45e3);l(this,"factory");l(this,"setTimer");l(this,"clearTimer");this.factory=e.socketFactory??Me,this.setTimer=e.setTimer??((t,n)=>setTimeout(t,n)),this.clearTimer=e.clearTimer??(t=>clearTimeout(t));}open(){if(this.socket||this.closed)return;let e=`${this.options.host.replace(/^http/,"ws").replace(/\/+$/,"")}${Re}`,t;try{t=this.factory(e);}catch{this.options.onClosed(false);return}this.socket=t,t.onmessage=n=>this.receive(String(n.data)),t.onerror=()=>t.close(),t.onclose=()=>this.fell();}close(){this.closed=true,this.stopHeartbeat();let e=this.socket;this.socket=null,e?.close();}receive(e){let t=K(e);if(t.kind==="open"){this.armHeartbeat(t.pingInterval+t.pingTimeout),this.socket?.send(U(this.options.auth));return}if(t.kind==="ping"){this.armHeartbeat(),this.socket?.send(D());return}if(t.kind==="connectError"||t.kind==="disconnect"){this.stopHeartbeat(),this.socket?.close();return}if(t.kind==="event"){if(t.name==="ready"){this.ready=true,this.options.onReady();return}if(t.name==="conversation.turn"){let n=t.payload?.turn;n&&this.options.onTurn(n);}}}fell(){this.stopHeartbeat();let e=this.ready;this.socket=null,this.ready=false,this.closed||this.options.onClosed(e);}armHeartbeat(e){e!==void 0&&(this.heartbeatWindow=e),this.stopHeartbeat(),this.heartbeat=this.setTimer(()=>this.socket?.close(),this.heartbeatWindow);}stopHeartbeat(){this.heartbeat!==null&&this.clearTimer(this.heartbeat),this.heartbeat=null;}};function Me(a){let e=globalThis.WebSocket;if(!e)throw new Error("no WebSocket");return new e(a)}var Oe=6e4;function it(a){let e=globalThis.document;if(!e)throw new Error("prodantix chat requires a document; mount it in the browser");let t=a.mountPoint??e.createElement("div");a.mountPoint||e.body.append(t);let n=new k(a),r=new E(t,n,a.strings,a.appearance),o=a.appearance?.availability??x.availability,s,i=()=>{r.setOpenNow(w(o,new Date)),s=setTimeout(i,Oe);};i();let h=new Set,d,c=null,p=a.pollIntervalMs??15e3,m=g=>{h.has(g.id)||g.authorKind==="end_user"||(h.add(g.id),r.onIncomingTurn(g));},v=async()=>{if(!n.hasThread)return;let g=await n.load();if(g){for(let S of g.turns)m(S);h=new Set(g.turns.map(S=>S.id));}},y=()=>{d||p<=0||(d=setInterval(()=>void v(),p));},b=()=>{d&&clearInterval(d),d=void 0;},A=()=>{if(c||!a.socketHost)return;let g=n.socketAuth;g&&(c=new T({auth:g,host:a.socketHost,onClosed:S=>{c=null,y(),S&&A();},onReady:b,onTurn:m,socketFactory:a.socketFactory}),c.open());};return y(),A(),{close:()=>r.close(),destroy:()=>{b(),clearTimeout(s),c?.close(),c=null,r.close(),t.remove();},identify:g=>n.identify(g),open:()=>{r.open().then(A);}}}exports.ChatClient=k;exports.ChatPanel=E;exports.DEFAULT_APPEARANCE=x;exports.DEFAULT_APPEARANCE_SETTINGS=u;exports.mountChat=it;exports.panelStyles=_;exports.resolveAppearance=C;//# sourceMappingURL=chat.cjs.map
|
|
98
|
+
`}${Te[t.composerShape]}${Ee[t.skin]}${U(t.launcherShape,t.launcherFill,t.launcherContent,t.launcherSize)}${we[t.bubbleShape]}${Le[t.bubbleFill]}${Ae[t.namePlacement]}${t.nameAvatar?Ne:""}${t.dayDividers?Pe:""}${_e[t.stampPlacement]}${t.stampContent==="time_and_latency"?Fe:""}${Ie}${r.attachments?.enabled?Re(t.composerShape):""}`}var Ue=["end_user","agent","ai"];function Be(){let r=globalThis.location;if(r)return {host:r.host,path:r.pathname,title:document.title}}var De='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="m16.5 6.5-7.8 7.8a2.1 2.1 0 0 0 3 3l8.1-8.1a4.2 4.2 0 0 0-6-6L5.7 11.3a6.3 6.3 0 0 0 8.9 8.9l6.6-6.6"/></svg>',Ge='<svg viewBox="0 0 24 24" fill="currentColor" aria-hidden="true"><path d="M15.88 9.29 12 13.17 8.12 9.29a.996.996 0 0 0-1.41 0c-.39.39-.39 1.02 0 1.41l4.59 4.59c.39.39 1.02.39 1.41 0l4.59-4.59c.39-.39.39-1.02 0-1.41-.39-.38-1.03-.39-1.42 0"/></svg>',T=class{constructor(e,t,n={},a={},o={}){this.host=e;this.client=t;c(this,"root");c(this,"strings");c(this,"settings");c(this,"appearance");c(this,"launcher");c(this,"badge");c(this,"panel",null);c(this,"lastFocused",null);c(this,"unread",0);c(this,"pendingTurns",0);c(this,"openNow");c(this,"style");c(this,"scheme");c(this,"picked",null);c(this,"objectUrls",[]);this.strings={...Ce,...n},this.appearance={...S,...a},this.settings=E({...S,...a}),this.root=e.attachShadow({mode:o.shadowMode??"closed"}),this.openNow=w(this.appearance.availability,new Date),this.scheme=o.scheme,this.style=document.createElement("style"),this.style.textContent=F(this.appearance,this.scheme),this.root.append(this.style),this.launcher=document.createElement("button"),this.launcher.className="launcher",this.launcher.type="button",this.launcher.setAttribute("aria-haspopup","dialog"),this.launcher.addEventListener("click",()=>this.toggle()),this.badge=document.createElement("span"),this.badge.className="badge",this.badge.hidden=true,this.drawLauncher(),this.root.append(this.launcher);}drawLauncher(){if(this.launcher.setAttribute("aria-label",this.strings.launcherLabel),this.launcher.replaceChildren(),this.launcher.append(B(this.settings.launcherContent,this.strings,this.appearance.team,e=>this.client.avatarUrl(e))),this.settings.launcherShape==="pill"){let e=document.createElement("span");e.className="label",e.textContent=this.settings.launcherContent==="team_faces"?this.strings.agentLabel:this.strings.launcherLabel,this.launcher.append(e);}this.launcher.append(this.badge),this.launcher.classList.toggle("closed",!this.openNow);}update(e,t){this.appearance={...S,...e},this.settings=E(this.appearance),t!==void 0&&(this.scheme=t),this.style.textContent=F(this.appearance,this.scheme),this.drawLauncher(),this.panel&&(this.close(),this.open());}toggle(){this.panel?this.close():this.open();}setOpenNow(e){this.openNow=e,this.launcher.classList.toggle("closed",!e),this.panel?.classList.toggle("closed",!e);}async open(){if(this.panel)return;this.lastFocused=this.host.ownerDocument.activeElement,this.unread=0,this.renderBadge();let e=document.createElement("section");e.className=this.openNow?"panel":"panel closed",e.setAttribute("role","dialog"),e.setAttribute("aria-modal","true"),e.setAttribute("aria-label",this.strings.title);let t=document.createElement("div");t.className="header";let n=this.appearance.team??[];n.length>0&&t.append(P(n,this.strings,f=>this.client.avatarUrl(f)));let a=document.createElement("div");a.className="headmain";let o=document.createElement("h2");o.textContent=this.strings.title;let i=document.createElement("p");i.className="status";let s=document.createElement("span");s.className="live",s.setAttribute("aria-hidden","true"),i.append(s,this.strings.replyTime),a.append(o,i);let d=document.createElement("button");d.className="close",d.type="button",d.setAttribute("aria-label",this.strings.closeLabel),d.innerHTML=Ge,d.addEventListener("click",()=>this.close()),t.append(a,d);let u=document.createElement("div");u.className="log",u.setAttribute("role","log"),u.setAttribute("aria-live","polite"),u.setAttribute("aria-label",this.strings.title);let p=document.createElement("form");p.className="composer";let l=document.createElement("input");l.type="text",l.setAttribute("aria-label",this.strings.inputPlaceholder),l.placeholder=this.strings.inputPlaceholder;let m=document.createElement("button");m.type="submit",m.setAttribute("aria-label",this.strings.sendLabel),m.innerHTML='<svg class="sendglyph" aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4.5 12 20 4.5 15 20l-3.6-5.4L4.5 12Z"/></svg>';let y=document.createElement("span");y.className="sendtext",y.textContent=this.strings.sendLabel,m.append(y);let v=this.appearance.attachments;if(v?.enabled&&this.client.upload){let f=document.createElement("span");f.className="field";let h=document.createElement("input");h.type="file",h.accept=v.accept.join(","),h.hidden=true,h.addEventListener("change",()=>{let R=h.files?.[0];h.value="",R&&this.pick(u,p,v,R);});let b=document.createElement("button");b.type="button",b.className="clip",b.setAttribute("aria-label",this.strings.attachLabel),b.innerHTML=De,b.addEventListener("click",()=>h.click()),f.append(b,l,h),p.append(f,m);}else p.append(l,m);p.addEventListener("submit",f=>{f.preventDefault(),this.submit(l,u);}),e.append(t,u,p),e.addEventListener("keydown",f=>this.onKeydown(f,e,d)),this.root.append(e),this.panel=e,l.focus();let k=await this.client.load();k&&k.turns.length>0?this.renderThread(u,k):this.renderFirstRun(u,l),this.openNow||this.renderAway(t);}renderFirstRun(e,t){let n=document.createElement("div");n.className="empty";let a=document.createElement("h3");a.textContent=this.appearance.greeting.trim()||this.strings.emptyTitle;let o=document.createElement("p");o.textContent=this.strings.emptyBody,n.append(a,o);for(let i of this.appearance.starterPrompts){let s=document.createElement("button");s.className="prompt",s.type="button",s.textContent=i,s.addEventListener("click",()=>{t.value=i,this.submit(t,e);}),n.append(s);}e.replaceChildren(n);}renderAway(e){let t=document.createElement("div");t.className="away";let n=document.createElement("span");n.className="awayglyph",n.setAttribute("aria-hidden","true");let a=document.createElement("span");a.textContent=this.appearance.awayMessage.trim()||this.strings.awayBody,t.append(n,a),e.after(t);}pick(e,t,n,a){let o=a.size>n.maxBytes||!n.accept.includes(a.type);for(let l of this.root.querySelectorAll(o?".ferr":".file,.ferr"))l.remove();if(o){let l=document.createElement("p");l.className="ferr",l.setAttribute("role","alert"),l.textContent=this.strings.fileRefusal(_(a.size),`${n.maxBytes/1e6} MB`),t.before(l),e.scrollTop=e.scrollHeight;return}this.picked=a;let i=document.createElement("span");i.className="file";let s;if(a.type==="application/pdf")s=document.createElement("b"),s.textContent="PDF";else {let l=document.createElement("img");l.className="th",l.alt="",l.src=this.objectUrl(a),s=l;}let d=document.createElement("span");d.className="name",d.textContent=a.name;let u=document.createElement("span");u.className="sz",u.textContent=`\xB7 ${_(a.size)}`;let p=document.createElement("button");p.type="button",p.className="x",p.setAttribute("aria-label",this.strings.removeFileLabel),p.textContent="\xD7",p.addEventListener("click",()=>{this.picked=null,i.remove();}),i.append(s,d,u,p),t.before(i),e.scrollTop=e.scrollHeight;}objectUrl(e){let t=URL.createObjectURL(e);return this.objectUrls.push(t),t}close(){if(this.panel){this.panel.remove(),this.panel=null,this.picked=null;for(let e of this.objectUrls)URL.revokeObjectURL(e);this.objectUrls=[],this.lastFocused instanceof HTMLElement?this.lastFocused.focus():this.launcher.focus();}}onIncomingTurn(e){if(this.panel){let t=this.panel.querySelector(".log");t instanceof HTMLElement&&!this.hasTurn(t,e.id)&&this.appendTurn(t,e);return}e.authorKind!=="end_user"&&(this.unread+=1,this.renderBadge());}async submit(e,t){let n=e.value.trim(),a=this.picked;if(!(!n&&!a)){e.value="",this.picked=null;for(let o of this.root.querySelectorAll(".file,.ferr"))o.remove();await this.sendBody(t,n,a);}}async sendBody(e,t,n=null){e.querySelector(".empty")?.remove(),this.pendingTurns+=1;let a=this.appendTurn(e,{authorId:null,authorKind:"end_user",body:t,createdAt:new Date().toISOString(),id:`pending-${this.pendingTurns}`},n);a.setAttribute("data-pending","");let o=n?await this.client.upload?.(n):void 0,i=o===null?null:await this.client.send(t,Be(),o?[o.id]:void 0);if(a.removeAttribute("data-pending"),i){a.dataset.turnId=i.id;return}this.markFailed(e,a,t,n);}markFailed(e,t,n,a){t.setAttribute("data-failed","");let o=document.createElement("button");o.type="button",o.className="retry",o.textContent=this.strings.retryLabel,o.addEventListener("click",()=>{t.remove(),this.sendBody(e,n,a);}),(t.querySelector(".body")??t).append(o);}hasTurn(e,t){for(let n of e.children)if(n instanceof HTMLElement&&n.dataset.turnId===t)return true;return false}renderThread(e,t){e.replaceChildren();for(let n of t.turns)this.appendTurn(e,n);}appendTurn(e,t,n=null){e.querySelector(".empty")?.remove();let a=Ue.includes(t.authorKind)?t.authorKind:"agent",o=this.settings,i=document.createElement("div");if(i.className=`turn ${a}`,i.dataset.turnId=t.id,a!=="end_user"&&o.nameAvatar){let l=document.createElement("span");if(l.className=a==="ai"?"av bot":"av",l.setAttribute("aria-hidden","true"),a==="agent"&&t.authorAvatarUrl){let m=document.createElement("img");m.alt="",m.src=this.client.avatarUrl(t.authorAvatarUrl),l.append(m);}else {l.textContent=a==="ai"?this.strings.aiLabel:z(this.agentName(t));let m=a==="agent"?this.appearance.team?.find(y=>y.name===t.authorName)?.tone:void 0;m&&(l.style.background=m);}i.append(l);}let d=document.createElement("div");if(d.className="body",a==="end_user"){n&&this.drawFile(d,n.name,n.type,n.size,Promise.resolve(n));for(let l of t.attachments??[])this.drawFile(d,l.name,l.contentType,l.bytes,this.client.file?.(l.url)??Promise.resolve(null));}let u=a!=="end_user"&&o.namePlacement!=="hidden",p=document.createElement("div");if(a==="ai"?ze(p,t.body):p.textContent=t.body,u||a==="ai"&&o.namePlacement==="hidden"){let l=document.createElement("div");l.className=a==="ai"?"author ai":"author",l.textContent=a==="ai"?this.strings.aiLabel:this.agentName(t),o.stampPlacement==="beside_name"&&l.append(this.stamp(t)),o.namePlacement==="inline"?(l.classList.add("below"),d.append(p,l)):d.append(l,p);}else t.body&&d.append(p);return o.stampPlacement==="under_turn"&&d.append(this.stamp(t)),i.append(d),e.append(i),e.scrollTop=e.scrollHeight,i}drawFile(e,t,n,a,o){let i=document.createElement("a");if(n==="application/pdf"){i.className="pdfc",i.download=t;let s=document.createElement("b");s.textContent="PDF",i.append(s,`${t} \xB7 ${_(a)}`);}else {i.className="att",i.target="_blank",i.rel="noopener noreferrer";let s=document.createElement("img");s.alt=t,s.addEventListener("load",()=>{let d=i.closest(".log");d&&(d.scrollTop=d.scrollHeight);}),i.append(s);}e.append(i),o.then(s=>{s&&(i.href=this.objectUrl(s),i.querySelector("img")?.setAttribute("src",i.href));});}agentName(e){return e.authorName||this.strings.agentLabel}stamp(e){let t=document.createElement("span");return t.className="stamp",t.textContent=this.strings.timeLabel(e.createdAt),t}onKeydown(e,t,n){if(e.key==="Escape"){e.preventDefault(),this.close();return}if(e.key!=="Tab")return;let a=t.querySelectorAll('button, input, [tabindex]:not([tabindex="-1"])');if(a.length===0)return;let o=a[0],i=a[a.length-1],s=this.root.activeElement;e.shiftKey&&s===o?(e.preventDefault(),i.focus()):!e.shiftKey&&s===i?(e.preventDefault(),o.focus()):s===null&&(e.preventDefault(),n.focus());}renderBadge(){this.unread>0?(this.badge.hidden=false,this.badge.textContent=String(this.unread),this.launcher.setAttribute("aria-label",`${this.strings.launcherLabel}, ${this.strings.unreadLabel(this.unread)}`)):(this.badge.hidden=true,this.badge.textContent="",this.launcher.setAttribute("aria-label",this.strings.launcherLabel));}};function K(r){return `40${JSON.stringify(r)}`}function q(){return "3"}function j(r){let e=r.charAt(0),t=r.slice(1);if(e==="2")return {kind:"ping"};if(e==="1")return {kind:"disconnect"};if(e==="0"){let i=I(t);return {kind:"open",pingInterval:typeof i?.pingInterval=="number"?i.pingInterval:25e3,pingTimeout:typeof i?.pingTimeout=="number"?i.pingTimeout:2e4}}if(e!=="4")return {kind:"other"};let n=t.charAt(0),a=t.slice(1);if(n==="0")return {kind:"connected"};if(n==="1")return {kind:"disconnect"};if(n==="4"){let i=I(a);return {kind:"connectError",message:typeof i?.message=="string"?i.message:"refused"}}if(n!=="2")return {kind:"other"};let o=I(a);return !Array.isArray(o)||typeof o[0]!="string"?{kind:"other"}:{kind:"event",name:o[0],payload:o[1]}}function I(r){try{return JSON.parse(r)}catch{return null}}var Ke="/socket.io/?EIO=4&transport=websocket",L=class{constructor(e){this.options=e;c(this,"socket",null);c(this,"heartbeat",null);c(this,"ready",false);c(this,"closed",false);c(this,"heartbeatWindow",45e3);c(this,"factory");c(this,"setTimer");c(this,"clearTimer");this.factory=e.socketFactory??qe,this.setTimer=e.setTimer??((t,n)=>setTimeout(t,n)),this.clearTimer=e.clearTimer??(t=>clearTimeout(t));}open(){if(this.socket||this.closed)return;let e=`${this.options.host.replace(/^http/,"ws").replace(/\/+$/,"")}${Ke}`,t;try{t=this.factory(e);}catch{this.options.onClosed(false);return}this.socket=t,t.onmessage=n=>this.receive(String(n.data)),t.onerror=()=>t.close(),t.onclose=()=>this.fell();}close(){this.closed=true,this.stopHeartbeat();let e=this.socket;this.socket=null,e?.close();}receive(e){let t=j(e);if(t.kind==="open"){this.armHeartbeat(t.pingInterval+t.pingTimeout),this.socket?.send(K(this.options.auth));return}if(t.kind==="ping"){this.armHeartbeat(),this.socket?.send(q());return}if(t.kind==="connectError"||t.kind==="disconnect"){this.stopHeartbeat(),this.socket?.close();return}if(t.kind==="event"){if(t.name==="ready"){this.ready=true,this.options.onReady();return}if(t.name==="conversation.turn"){let n=t.payload?.turn;n&&this.options.onTurn(n);}}}fell(){this.stopHeartbeat();let e=this.ready;this.socket=null,this.ready=false,this.closed||this.options.onClosed(e);}armHeartbeat(e){e!==void 0&&(this.heartbeatWindow=e),this.stopHeartbeat(),this.heartbeat=this.setTimer(()=>this.socket?.close(),this.heartbeatWindow);}stopHeartbeat(){this.heartbeat!==null&&this.clearTimer(this.heartbeat),this.heartbeat=null;}};function qe(r){let e=globalThis.WebSocket;if(!e)throw new Error("no WebSocket");return new e(r)}var je=6e4;function mt(r){let e=globalThis.document;if(!e)throw new Error("prodantix chat requires a document; mount it in the browser");let t=r.mountPoint??e.createElement("div");r.mountPoint||e.body.append(t);let n=new C(r),a=new T(t,n,r.strings,r.appearance),o=r.appearance?.availability??S.availability,i,s=()=>{a.setOpenNow(w(o,new Date)),i=setTimeout(s,je);};s();let d=new Set,u,p=null,l=r.pollIntervalMs??15e3,m=h=>{d.has(h.id)||h.authorKind==="end_user"||(d.add(h.id),a.onIncomingTurn(h));},y=async()=>{if(!n.hasThread)return;let h=await n.load();if(h){for(let b of h.turns)m(b);d=new Set(h.turns.map(b=>b.id));}},v=()=>{u||l<=0||(u=setInterval(()=>void y(),l));},k=()=>{u&&clearInterval(u),u=void 0;},f=()=>{if(p||!r.socketHost)return;let h=n.socketAuth;h&&(p=new L({auth:h,host:r.socketHost,onClosed:b=>{p=null,v(),b&&f();},onReady:k,onTurn:m,socketFactory:r.socketFactory}),p.open());};return v(),f(),{close:()=>a.close(),destroy:()=>{k(),clearTimeout(i),p?.close(),p=null,a.close(),t.remove();},identify:h=>n.identify(h),open:()=>{a.open().then(f);}}}exports.ChatClient=C;exports.ChatPanel=T;exports.DEFAULT_APPEARANCE=S;exports.DEFAULT_APPEARANCE_SETTINGS=g;exports.mountChat=mt;exports.panelStyles=F;exports.resolveAppearance=E;//# sourceMappingURL=chat.cjs.map
|
|
156
99
|
//# sourceMappingURL=chat.cjs.map
|
package/dist/chat.d.cts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { C as ChatThread, P as PageContext, a as ChatTurn, M as MessengerConfig, A as AppearanceSettings,
|
|
2
|
-
export { B as BubbleFill,
|
|
1
|
+
import { C as ChatThread, P as PageContext, a as ChatTurn, b as ChatUpload, M as MessengerConfig, A as AppearanceSettings, c as ChatIdentity, d as ChatClientOptions } from './config-CM4nTGof.cjs';
|
|
2
|
+
export { B as BubbleFill, e as BubbleShape, f as ChatAttachment, g as ChatClient, h as ChatStorage, i as ComposerShape, D as DEFAULT_APPEARANCE_SETTINGS, F as FileFetchLike, j as FileResponseLike, L as LauncherContent, k as LauncherFill, l as LauncherShape, m as LauncherSize, n as MessengerSkin, N as NamePlacement, S as StampContent, o as StampPlacement, r as resolveAppearance } from './config-CM4nTGof.cjs';
|
|
3
3
|
import { S as SocketFactory } from './types-DjMXp6Wg.cjs';
|
|
4
4
|
import './http-BCh716Vs.cjs';
|
|
5
5
|
|
|
@@ -18,13 +18,18 @@ interface ChatStrings {
|
|
|
18
18
|
emptyBody: string;
|
|
19
19
|
replyTime: string;
|
|
20
20
|
retryLabel: string;
|
|
21
|
+
attachLabel: string;
|
|
22
|
+
removeFileLabel: string;
|
|
23
|
+
fileRefusal: (size: string, limit: string) => string;
|
|
21
24
|
}
|
|
22
|
-
type MessengerAppearance = Pick<MessengerConfig, 'accentColor' | 'availability' | 'awayMessage' | 'greeting' | 'launcherOffsetX' | 'launcherOffsetY' | 'launcherPosition' | 'starterPrompts' | 'team'> & AppearanceSettings;
|
|
25
|
+
type MessengerAppearance = Pick<MessengerConfig, 'accentColor' | 'attachments' | 'availability' | 'awayMessage' | 'greeting' | 'launcherOffsetX' | 'launcherOffsetY' | 'launcherPosition' | 'starterPrompts' | 'team'> & AppearanceSettings;
|
|
23
26
|
declare const DEFAULT_APPEARANCE: MessengerAppearance;
|
|
24
27
|
interface ChatSource {
|
|
25
28
|
avatarUrl(url: string): string;
|
|
26
29
|
load(): Promise<ChatThread | null>;
|
|
27
|
-
send(body: string, pageContext?: PageContext): Promise<ChatTurn | null>;
|
|
30
|
+
send(body: string, pageContext?: PageContext, attachmentIds?: string[]): Promise<ChatTurn | null>;
|
|
31
|
+
upload?(file: File): Promise<ChatUpload | null>;
|
|
32
|
+
file?(path: string): Promise<Blob | null>;
|
|
28
33
|
}
|
|
29
34
|
type ChatScheme = 'dark' | 'light' | 'system';
|
|
30
35
|
interface ChatPanelOptions {
|
|
@@ -48,6 +53,8 @@ declare class ChatPanel {
|
|
|
48
53
|
private openNow;
|
|
49
54
|
private readonly style;
|
|
50
55
|
private scheme;
|
|
56
|
+
private picked;
|
|
57
|
+
private objectUrls;
|
|
51
58
|
constructor(host: HTMLElement, client: ChatSource, strings?: Partial<ChatStrings>, appearance?: Partial<MessengerAppearance>, options?: ChatPanelOptions);
|
|
52
59
|
private drawLauncher;
|
|
53
60
|
update(appearance: Partial<MessengerAppearance>, scheme?: ChatScheme): void;
|
|
@@ -56,6 +63,8 @@ declare class ChatPanel {
|
|
|
56
63
|
open(): Promise<void>;
|
|
57
64
|
private renderFirstRun;
|
|
58
65
|
private renderAway;
|
|
66
|
+
private pick;
|
|
67
|
+
private objectUrl;
|
|
59
68
|
close(): void;
|
|
60
69
|
onIncomingTurn(turn: ChatTurn): void;
|
|
61
70
|
private submit;
|
|
@@ -86,6 +95,7 @@ declare class ChatPanel {
|
|
|
86
95
|
private hasTurn;
|
|
87
96
|
private renderThread;
|
|
88
97
|
private appendTurn;
|
|
98
|
+
private drawFile;
|
|
89
99
|
private agentName;
|
|
90
100
|
private stamp;
|
|
91
101
|
private onKeydown;
|
|
@@ -108,4 +118,4 @@ interface ChatHandle {
|
|
|
108
118
|
}
|
|
109
119
|
declare function mountChat(options: MountChatOptions): ChatHandle;
|
|
110
120
|
|
|
111
|
-
export { AppearanceSettings, ChatClientOptions, type ChatHandle, ChatIdentity, ChatPanel, type ChatStrings, ChatThread, ChatTurn, DEFAULT_APPEARANCE, type MessengerAppearance, type MountChatOptions, mountChat, panelStyles };
|
|
121
|
+
export { AppearanceSettings, ChatClientOptions, type ChatHandle, ChatIdentity, ChatPanel, type ChatStrings, ChatThread, ChatTurn, ChatUpload, DEFAULT_APPEARANCE, type MessengerAppearance, type MountChatOptions, mountChat, panelStyles };
|
package/dist/chat.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { C as ChatThread, P as PageContext, a as ChatTurn, M as MessengerConfig, A as AppearanceSettings,
|
|
2
|
-
export { B as BubbleFill,
|
|
1
|
+
import { C as ChatThread, P as PageContext, a as ChatTurn, b as ChatUpload, M as MessengerConfig, A as AppearanceSettings, c as ChatIdentity, d as ChatClientOptions } from './config-DJX2zFaa.js';
|
|
2
|
+
export { B as BubbleFill, e as BubbleShape, f as ChatAttachment, g as ChatClient, h as ChatStorage, i as ComposerShape, D as DEFAULT_APPEARANCE_SETTINGS, F as FileFetchLike, j as FileResponseLike, L as LauncherContent, k as LauncherFill, l as LauncherShape, m as LauncherSize, n as MessengerSkin, N as NamePlacement, S as StampContent, o as StampPlacement, r as resolveAppearance } from './config-DJX2zFaa.js';
|
|
3
3
|
import { S as SocketFactory } from './types-DjMXp6Wg.js';
|
|
4
4
|
import './http-BCh716Vs.js';
|
|
5
5
|
|
|
@@ -18,13 +18,18 @@ interface ChatStrings {
|
|
|
18
18
|
emptyBody: string;
|
|
19
19
|
replyTime: string;
|
|
20
20
|
retryLabel: string;
|
|
21
|
+
attachLabel: string;
|
|
22
|
+
removeFileLabel: string;
|
|
23
|
+
fileRefusal: (size: string, limit: string) => string;
|
|
21
24
|
}
|
|
22
|
-
type MessengerAppearance = Pick<MessengerConfig, 'accentColor' | 'availability' | 'awayMessage' | 'greeting' | 'launcherOffsetX' | 'launcherOffsetY' | 'launcherPosition' | 'starterPrompts' | 'team'> & AppearanceSettings;
|
|
25
|
+
type MessengerAppearance = Pick<MessengerConfig, 'accentColor' | 'attachments' | 'availability' | 'awayMessage' | 'greeting' | 'launcherOffsetX' | 'launcherOffsetY' | 'launcherPosition' | 'starterPrompts' | 'team'> & AppearanceSettings;
|
|
23
26
|
declare const DEFAULT_APPEARANCE: MessengerAppearance;
|
|
24
27
|
interface ChatSource {
|
|
25
28
|
avatarUrl(url: string): string;
|
|
26
29
|
load(): Promise<ChatThread | null>;
|
|
27
|
-
send(body: string, pageContext?: PageContext): Promise<ChatTurn | null>;
|
|
30
|
+
send(body: string, pageContext?: PageContext, attachmentIds?: string[]): Promise<ChatTurn | null>;
|
|
31
|
+
upload?(file: File): Promise<ChatUpload | null>;
|
|
32
|
+
file?(path: string): Promise<Blob | null>;
|
|
28
33
|
}
|
|
29
34
|
type ChatScheme = 'dark' | 'light' | 'system';
|
|
30
35
|
interface ChatPanelOptions {
|
|
@@ -48,6 +53,8 @@ declare class ChatPanel {
|
|
|
48
53
|
private openNow;
|
|
49
54
|
private readonly style;
|
|
50
55
|
private scheme;
|
|
56
|
+
private picked;
|
|
57
|
+
private objectUrls;
|
|
51
58
|
constructor(host: HTMLElement, client: ChatSource, strings?: Partial<ChatStrings>, appearance?: Partial<MessengerAppearance>, options?: ChatPanelOptions);
|
|
52
59
|
private drawLauncher;
|
|
53
60
|
update(appearance: Partial<MessengerAppearance>, scheme?: ChatScheme): void;
|
|
@@ -56,6 +63,8 @@ declare class ChatPanel {
|
|
|
56
63
|
open(): Promise<void>;
|
|
57
64
|
private renderFirstRun;
|
|
58
65
|
private renderAway;
|
|
66
|
+
private pick;
|
|
67
|
+
private objectUrl;
|
|
59
68
|
close(): void;
|
|
60
69
|
onIncomingTurn(turn: ChatTurn): void;
|
|
61
70
|
private submit;
|
|
@@ -86,6 +95,7 @@ declare class ChatPanel {
|
|
|
86
95
|
private hasTurn;
|
|
87
96
|
private renderThread;
|
|
88
97
|
private appendTurn;
|
|
98
|
+
private drawFile;
|
|
89
99
|
private agentName;
|
|
90
100
|
private stamp;
|
|
91
101
|
private onKeydown;
|
|
@@ -108,4 +118,4 @@ interface ChatHandle {
|
|
|
108
118
|
}
|
|
109
119
|
declare function mountChat(options: MountChatOptions): ChatHandle;
|
|
110
120
|
|
|
111
|
-
export { AppearanceSettings, ChatClientOptions, type ChatHandle, ChatIdentity, ChatPanel, type ChatStrings, ChatThread, ChatTurn, DEFAULT_APPEARANCE, type MessengerAppearance, type MountChatOptions, mountChat, panelStyles };
|
|
121
|
+
export { AppearanceSettings, ChatClientOptions, type ChatHandle, ChatIdentity, ChatPanel, type ChatStrings, ChatThread, ChatTurn, ChatUpload, DEFAULT_APPEARANCE, type MessengerAppearance, type MountChatOptions, mountChat, panelStyles };
|