@prodantix/sdk 0.2.0 → 0.3.0-beta.379

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 CHANGED
@@ -1,42 +1,102 @@
1
- 'use strict';var $=Object.defineProperty;var z=(n,e,t)=>e in n?$(n,e,{enumerable:true,configurable:true,writable:true,value:t}):n[e]=t;var l=(n,e,t)=>z(n,typeof e!="symbol"?e+"":e,t);function A(n){if(n)return n;let e=globalThis.fetch;if(typeof e=="function")return e.bind(globalThis)}function w(n){return n.replace(/\/+$/,"")}var D="X-Prodantix-Conversation-Token",C="prodantix.chat.handle";function K(){let n=globalThis.localStorage;if(n)return {get:e=>n.getItem(e),remove:e=>n.removeItem(e),set:(e,t)=>n.setItem(e,t)}}var b=class{constructor(e){this.options=e;l(this,"fetchImpl");l(this,"host");l(this,"storage");l(this,"handle");l(this,"identity",null);this.fetchImpl=A(e.fetchImpl),this.host=w(e.host),this.storage=e.storage??K(),this.handle=this.readHandle();}get hasThread(){return this.handle!==null}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(C,JSON.stringify(this.handle)),true)}async send(e,t){if(!await this.ensureThread())return null;let r=this.handle;return r?(await this.request("POST",`/v1/conversations/${encodeURIComponent(r.conversationId)}/turns`,{body:{body:e,pageContext:t},token:r.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(C);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(C),null}async request(e,t,r={}){let a=this.fetchImpl;if(!a)return this.options.onError?.(new Error("no fetch available for prodantix chat")),null;let s={authorization:`Bearer ${this.options.apiKey}`,"content-type":"application/json"};r.token&&(s[D]=r.token);try{let o=await a(`${this.host}${t}`,{body:r.body===void 0?void 0:JSON.stringify(r.body),headers:s,method:e}),i=await o.text();return o.ok?i?JSON.parse(i):{}:(this.options.onError?.(new Error(`prodantix chat ${t}: ${o.status}`)),null)}catch(o){return this.options.onError?.(o),null}}};var p={bubbleStyle:"tailed",dayDividers:true,launcherContent:"glyph",launcherFill:"outlined",launcherShape:"circle",launcherSize:"small",nameAvatar:true,namePlacement:"hidden",skin:"concierge",stampContent:"time",stampPlacement:"none"},G=["concierge","console","quiet"],U=["hairline","outlined","rounded","tailed"],B=["circle","pill","squircle"],q=["filled","outlined"],Y=["avatar","glyph","team_faces"],j=["large","medium","small"],W=["above","hidden","inline"],J=["beside_name","none","under_turn"],X=["time","time_and_latency"],m=(n,e,t)=>typeof n=="string"&&e.includes(n)?n:t,L=(n,e)=>typeof n=="boolean"?n:e,V={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"]},Z={above:["above",false],avatar_only:["hidden",true],gutter:["above",true],hidden:["hidden",false],inline:["inline",false]},Q={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"]};function y(n){let e=typeof n=="object"&&n!==null?n:{},t=typeof e.launcherStyle=="string"?e.launcherStyle:void 0,r=t===void 0?void 0:V[t],a=typeof e.namePlacement=="string"?e.namePlacement:void 0,s=a===void 0?void 0:Z[a],o=typeof e.timestampStyle=="string"?e.timestampStyle:void 0,i=o===void 0?void 0:Q[o],c={bubbleStyle:m(e.bubbleStyle,U,p.bubbleStyle),dayDividers:L(e.dayDividers,i?.[0]??p.dayDividers),launcherContent:m(e.launcherContent,Y,r?.[2]??p.launcherContent),launcherFill:m(e.launcherFill,q,r?.[1]??p.launcherFill),launcherShape:m(e.launcherShape,B,r?.[0]??p.launcherShape),launcherSize:m(e.launcherSize,j,r?.[3]??p.launcherSize),nameAvatar:L(e.nameAvatar,s?.[1]??p.nameAvatar),namePlacement:m(e.namePlacement,W,s?.[0]??p.namePlacement),skin:m(e.skin,G,p.skin),stampContent:m(e.stampContent,X,i?.[2]??p.stampContent),stampPlacement:m(e.stampPlacement,J,i?.[1]??p.stampPlacement)};return c.stampPlacement==="beside_name"&&c.namePlacement==="hidden"&&(c.stampPlacement="under_turn"),c.namePlacement==="inline"&&c.bubbleStyle==="hairline"&&(c.namePlacement="above"),c}var ee={Fri:"fri",Mon:"mon",Sat:"sat",Sun:"sun",Thu:"thu",Tue:"tue",Wed:"wed"};function N(n,e){let t=new Intl.DateTimeFormat(void 0,{hour:"2-digit",hour12:false,minute:"2-digit",timeZone:n.timezone,weekday:"short"}).formatToParts(e),r=ee[t.find(i=>i.type==="weekday")?.value??""];if(!r)return false;let a=t.find(i=>i.type==="hour")?.value??"",s=t.find(i=>i.type==="minute")?.value??"",o=`${a}:${s}`;return n.windows.some(i=>i.days.includes(r)&&i.open<=o&&o<i.close)}var te="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",ne={large:66,medium:56,small:46},re={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;"},ae={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);"},ie={avatar:".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);}",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;}.launcher .live{width:9px;height:9px;position:absolute;right:3px;bottom:3px;border-radius:50%;background:var(--online);box-shadow:0 0 0 2px var(--paper);}"},oe={circle:"",pill:".badge{position:static;box-shadow:none}",squircle:""},se={filled:"",outlined:".badge{background:var(--a);top:-7px;right:-7px;min-width:19px;height:19px;font-size:11.5px}"},le={circle:"",pill:".launcher .label{font-size:14px;font-weight:600;white-space:nowrap;}",squircle:""},ce={circle:"",pill:"@media (max-width:480px){.launcher{width:var(--fab-size);padding:0}.launcher .label{display:none}}",squircle:""};function I(n,e,t,r){return `.launcher{--fab-size:${ne[r]}px;${re[n]}${ae[e]}}${ie[t]}${oe[n]}${se[e]}${le[n]}${ce[n]}`}function H(n,e,t){let r=document.createDocumentFragment();if(n==="glyph"){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="${te}"/></svg>`,r.append(...o.childNodes),r}if(n==="avatar")return r.append(_(t[0],e),P()),r;let a=document.createElement("span");a.className="faces";let s=t.length>0?t.slice(0,2):[void 0];for(let o of s)a.append(_(o,e));return r.append(a,P()),r}function _(n,e){let t=document.createElement("span");return t.className="av",t.setAttribute("aria-hidden","true"),t.textContent=n?n.initials:e.agentLabel.slice(0,2).toUpperCase(),n&&(t.style.background=n.tone),t}function P(){let n=document.createElement("span");return n.className="live",n.setAttribute("aria-hidden","true"),n}var de={agentLabel:"Agent",aiLabel:"AI",closeLabel:"Close chat",emptyBody:"We usually reply within a few minutes.",emptyTitle:"Ask us anything.",inputPlaceholder:"Type a message",launcherLabel:"Open support chat",sendLabel:"Send",timeLabel:n=>{let e=new Date(n);return Number.isNaN(e.getTime())?"":`${String(e.getHours()).padStart(2,"0")}:${String(e.getMinutes()).padStart(2,"0")}`},title:"Support",unreadLabel:n=>`${n} unread`},v={accentColor:"#5b5bff",availability:{timezone:"UTC",windows:[]},awayMessage:"",greeting:"",launcherOffsetX:20,launcherOffsetY:20,launcherPosition:"bottom_right",starterPrompts:[],teamFaces:[],...p},pe={concierge:".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}.composer{padding:12px 12px 14px;gap:8px}.composer input{border:0;background:var(--fill);height:46px;border-radius:23px;padding:0 16px}.composer button{width:46px;min-width:46px;height:46px;padding:0;border-radius:23px}.composer button .sendglyph{display:block}.composer button .sendtext{display:none}",console:".panel{border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.16)}.header{background:var(--paper);color:var(--ink);border-bottom:1px solid var(--hairline)}.close{color:var(--ink-2)}",quiet:".composer{position:relative;padding:10px 12px 12px}.composer input{height:42px;padding-right:42px}.composer button{position:absolute;top:50%;right:16px;width:34px;min-width:34px;height:34px;padding:0;background:transparent;color:var(--ink);border-radius:7px;transform:translateY(-50%)}.composer button .sendglyph{display:block;width:18px;height:18px}.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)}.close{color:var(--ink-2)}"},ue={hairline:".turn{max-width:100%;padding:13px 0;border-top:1px solid var(--hairline);background:none;border-radius:0}.log>.turn:first-child{border-top:0}.turn.end_user{align-self:stretch;display:flex;flex-direction:column;align-items:flex-end}.turn.end_user .body{background:var(--fill);color:var(--ink);border-radius:8px;padding:9px 12px;max-width:85%}",outlined:".turn{background:none;border:1px solid var(--hairline);border-radius:12px}.turn.end_user{background:none;border-color:var(--a);color:var(--ink)}",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}"},he={above:"",hidden:".turn.agent .author,.turn.ai .author:not(.ai){display:none}",inline:".author{display:inline;margin-right:6px;font-weight:650}"},me=".turn.agent,.turn.ai{display:flex;gap:10px;max-width:100%;background:none;padding:0}.turn .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}",ge='.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)}',fe={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}"},be=".lat{font-size:11px;opacity:.7;margin-left:6px}";function F(n){let e=y(n),t=n.launcherPosition==="bottom_left"?"left":"right",r=n.accentColor;return `${`
1
+ 'use strict';var G=Object.defineProperty;var q=(n,e,t)=>e in n?G(n,e,{enumerable:true,configurable:true,writable:true,value:t}):n[e]=t;var l=(n,e,t)=>q(n,typeof e!="symbol"?e+"":e,t);function F(n){if(n)return n;let e=globalThis.fetch;if(typeof e=="function")return e.bind(globalThis)}function H(n){return n.replace(/\/+$/,"")}var Y="X-Prodantix-Conversation-Token",L="prodantix.chat.handle";function j(){let n=globalThis.localStorage;if(n)return {get:e=>n.getItem(e),remove:e=>n.removeItem(e),set:(e,t)=>n.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??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(L,JSON.stringify(this.handle)),true)}async send(e,t){if(!await this.ensureThread())return null;let a=this.handle;return a?(await this.request("POST",`/v1/conversations/${encodeURIComponent(a.conversationId)}/turns`,{body:{body:e,pageContext:t},token:a.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,a={}){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"};a.token&&(o[Y]=a.token);try{let s=await r(`${this.host}${t}`,{body:a.body===void 0?void 0:JSON.stringify(a.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 W={Fri:"fri",Mon:"mon",Sat:"sat",Sun:"sun",Thu:"thu",Tue:"tue",Wed:"wed"};function w(n,e){let t=new Intl.DateTimeFormat(void 0,{hour:"2-digit",hour12:false,minute:"2-digit",timeZone:n.timezone,weekday:"short"}).formatToParts(e),a=W[t.find(i=>i.type==="weekday")?.value??""];if(!a)return false;let r=t.find(i=>i.type==="hour")?.value??"",o=t.find(i=>i.type==="minute")?.value??"",s=`${r}:${o}`;return n.windows.some(i=>i.days.includes(a)&&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"},J=["quiet","standard"],V=["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=(n,e,t)=>typeof n=="string"&&e.includes(n)?n:t,R=(n,e)=>typeof n=="boolean"?n: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(n){let e=typeof n=="object"&&n!==null?n:{},t=typeof e.launcherStyle=="string"?e.launcherStyle:void 0,a=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,V,d?.[1]??u.composerShape),dayDividers:R(e.dayDividers,i?.[0]??u.dayDividers),launcherContent:f(e.launcherContent,te,a?.[2]??u.launcherContent),launcherFill:f(e.launcherFill,ee,a?.[1]??u.launcherFill),launcherShape:f(e.launcherShape,Q,a?.[0]??u.launcherShape),launcherSize:f(e.launcherSize,ne,a?.[3]??u.launcherSize),nameAvatar:R(e.nameAvatar,o?.[1]??u.nameAvatar),namePlacement:f(e.namePlacement,ae,o?.[0]??u.namePlacement),skin:f(e.skin,J,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 O(n){let e=n.split(/\s+/).filter(a=>a.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 M(n,e,t,a){return `.launcher{--fab-size:${he[a]}px;${ue[n]}${me[e]}}${ge[t]}${fe}${be[n]}${ye[e]}${xe[n]}${ve[n]}`}function $(n,e,t,a=r=>r){let r=document.createDocumentFragment();if(n==="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 n==="avatar"?(r.append(z(t[0],e,a),N()),r):(r.append(P(t,e,a),N()),r)}function P(n,e,t=a=>a){let a=document.createElement("span");a.className="faces";for(let r of n.slice(0,2))a.append(z(r,e,t));return a}function z(n,e,t){let a=document.createElement("span");if(a.className="av",a.setAttribute("aria-hidden","true"),n&&(a.style.background=n.tone),n?.avatarUrl){let r=document.createElement("img");return r.alt="",r.src=t(n.avatarUrl),a.append(r),a}return a.textContent=n?n.initials:e.agentLabel.slice(0,2).toUpperCase(),a}function N(){let n=document.createElement("span");return n.className="live",n.setAttribute("aria-hidden","true"),n}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",sendLabel:"Send",timeLabel:n=>{let e=new Date(n);return Number.isNaN(e.getTime())?"":`${String(e.getHours()).padStart(2,"0")}:${String(e.getMinutes()).padStart(2,"0")}`},title:"Support",unreadLabel:n=>`${n} 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:10px 12px 12px}.composer input{padding-right:42px}.composer button{position:absolute;top:50%;right:16px;width:34px;min-width:34px;height:34px;padding:0;background:transparent;color:var(--ink);border-radius:7px;transform:translateY(-50%)}.composer button .sendglyph{display:block;width:18px;height:18px}.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:12px 12px 14px;gap:8px}.composer input{height:46px;border-radius:23px;padding:0 16px}.composer button{width:46px;min-width:46px;height:46px;padding:0;border-radius:23px}.composer button .sendglyph{display:block}.composer button .sendtext{display:none}",square:".composer input{height:44px;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}",U=`--paper: oklch(24.6% 0.015 257); --ink: #fff; --ink-3: rgba(255,255,255,.55);
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 _e(n){return n==="light"?"":n==="dark"?`:host { ${U} }`:`@media (prefers-color-scheme: dark) {
4
+ :host {
5
+ ${U}
6
+ }
7
+ }`}function _(n,e="system"){let t=C(n),a=n.launcherPosition==="bottom_left"?"left":"right",r=n.accentColor;return `${`
2
8
  :host {
3
- all: initial; --a: ${r};
9
+ /* The widget sits above the host page's own furniture. The reset above sends
10
+ z-index back to auto, so without this the launcher and panel stack at the
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};
4
16
  --paper: #fff; --ink: #0f172a; --ink-3: var(--ink-3);
5
- --fill: #f1f5f9; --hairline: #e2e8f0; --field: #cbd5e1; --ink-2: rgba(0,0,0,.72);
17
+ --fill: #f1f5f9; --hairline: #e2e8f0; --ink-2: rgba(0,0,0,.72);
6
18
  --online: oklch(53.8% 0.1274 163.23);
7
- color-scheme: light dark;
8
- }
9
- @media (prefers-color-scheme: dark) {
10
- :host {
11
- --paper: oklch(24.6% 0.015 257); --ink: #fff; --ink-3: rgba(255,255,255,.55);
12
- --fill: rgba(255,255,255,.06); --hairline: rgba(255,255,255,.13); --field: rgba(255,255,255,.22); --ink-2: rgba(255,255,255,.70);
13
- --online: oklch(72% 0.13 163.23);
14
- }
19
+ color-scheme: ${e==="system"?"light dark":e};
15
20
  }
21
+ ${_e(e)}
16
22
  * { box-sizing: border-box; font-family: system-ui, sans-serif; }
17
23
  .launcher {
18
- position: fixed; ${t}: ${n.launcherOffsetX}px; bottom: ${n.launcherOffsetY}px; width: 56px; height: 56px;
24
+ z-index: 2147483000; position: fixed; ${a}: ${n.launcherOffsetX}px; bottom: ${n.launcherOffsetY}px; width: 56px; height: 56px;
19
25
  border-radius: 28px; border: none; cursor: pointer;
20
26
  display: inline-flex; align-items: center; justify-content: center;
21
27
  background: ${r}; color: #fff; font-size: 24px;
22
28
  box-shadow: 0 4px 12px rgba(0,0,0,.2);
23
29
  }
24
30
  .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
+ .launcher { transition: background-color 120ms ease; }
37
+ .launcher:hover { background: color-mix(in srgb, #000 12%, ${r}); }
38
+ .launcher:active { background: color-mix(in srgb, #000 20%, ${r}); }
39
+ @media (prefers-reduced-motion: reduce) {
40
+ .launcher { transition: none; }
41
+ }
25
42
  .badge {
26
43
  position: absolute; top: -4px; right: -4px; min-width: 20px; height: 20px;
27
44
  border-radius: 10px; background: #dc2626; color: #fff; font-size: 12px;
28
45
  display: flex; align-items: center; justify-content: center; padding: 0 4px;
29
46
  }
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
+ .badge[hidden] { display: none; }
30
54
  .panel {
31
- position: fixed; ${t}: ${n.launcherOffsetX}px; bottom: ${n.launcherOffsetY+68}px; width: 360px; max-width: calc(100vw - 40px);
55
+ z-index: 2147483001; position: fixed; ${a}: ${n.launcherOffsetX}px; bottom: ${n.launcherOffsetY+68}px; width: 360px; max-width: calc(100vw - 40px);
32
56
  height: 520px; max-height: calc(100vh - 120px); background: var(--paper); color: var(--ink);
33
57
  border-radius: 12px; box-shadow: 0 8px 32px rgba(0,0,0,.24);
34
58
  display: flex; flex-direction: column; overflow: hidden;
35
59
  }
36
- .header { padding: 14px 16px; background: #0b0e14; color: #fff; display: flex; align-items: center; justify-content: space-between; }
60
+ .header { position: relative; padding: 14px 16px; background: #0b0e14; color: #fff; display: flex; align-items: center; justify-content: space-between; }
37
61
  .header h2 { margin: 0; font-size: 15px; }
38
- .close { background: none; border: none; color: #fff; cursor: pointer; font-size: 18px; }
39
- .close:focus-visible { outline: 2px solid #fff; }
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
+ .header .faces { display: flex; }
66
+ .header .av { width: 36px; height: 36px; box-shadow: 0 0 0 2px var(--a); }
67
+ .header .av + .av { margin-left: -12px; }
68
+ .headmain { display: flex; flex-direction: column; }
69
+ .header .status { display: flex; align-items: center; gap: 6px; margin: 5px 0 0; font-size: 12.5px; color: rgb(255 255 255 / 80%); }
70
+ /* The dot's ring is the PAPER, not the accent. An accent ring on the standard
71
+ skin is the header's own background and draws nothing, which is how this
72
+ shipped looking ringless beside a preview that had one. The faces above keep
73
+ the accent ring, which is a different job: separating two overlapping discs
74
+ from each other and from the header. */
75
+ .header .status .live { flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--online); box-shadow: 0 0 0 2px var(--paper); }
76
+ /* Hours, the same fact the launcher's dot carries. A green dot and a sentence
77
+ promising a reply in minutes are both claims about somebody being there, so
78
+ outside the project's hours neither is drawn: the away message in the thread
79
+ is what speaks then. */
80
+ .panel.closed .status { display: none; }
81
+ /* Pinned rather than laid out: the standard skin turns this header into a
82
+ column so the title can carry a line under it, and a close button that is
83
+ merely a flex sibling then stacks BELOW the title on the left, which is where
84
+ clepit's landing showed it. */
85
+ .header .close { position: absolute; top: 8px; right: 8px; }
86
+ /* The fleet's icon button: a padded square, a radius, and a hover that tints
87
+ the background. This carried none of them, so the messenger's close was the
88
+ one icon button in the product with no radius and no hover at all. The tint
89
+ is mixed from currentColor rather than a fixed white because the header is
90
+ the accent on some skins and the paper on others. */
91
+ .close {
92
+ display: inline-flex; align-items: center; justify-content: center;
93
+ width: 32px; height: 32px; padding: 0;
94
+ background: none; border: none; border-radius: 8px;
95
+ color: inherit; cursor: pointer; font-size: 18px; line-height: 1;
96
+ transition: background-color 120ms ease;
97
+ }
98
+ .close:hover { background: color-mix(in srgb, currentColor 14%, transparent); }
99
+ .close:focus-visible { outline: 2px solid currentColor; outline-offset: 1px; }
40
100
  .log { flex: 1; overflow-y: auto; padding: 12px; display: flex; flex-direction: column; gap: 8px; }
41
101
  .turn { max-width: 80%; padding: 8px 12px; border-radius: 12px; font-size: 14px; }
42
102
  .turn.end_user { align-self: flex-end; background: ${r}; color: #fff; }
@@ -54,15 +114,18 @@
54
114
  .prompt:focus-visible { outline: 2px solid ${r}; outline-offset: 2px; }
55
115
  .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: #7c3f3f; }
56
116
  .av.bot { border-radius: 9px; background: var(--fill); color: var(--ink); }
117
+ .av img { width: 100%; height: 100%; display: block; object-fit: cover; border-radius: inherit; }
57
118
  .composer { display: flex; gap: 8px; padding: 12px; border-top: 1px solid var(--hairline); }
58
- .composer input { flex: 1; padding: 8px 10px; border: 1px solid var(--field); border-radius: 8px; font-size: 14px; background: transparent; color: var(--ink); }
119
+ .composer input { flex: 1; min-width: 0; height: 44px; padding: 0 12px; border: 0; border-radius: 8px; font-size: 14px; background: var(--fill); color: var(--ink); }
59
120
  .composer input:focus-visible { outline: 2px solid ${r}; }
60
121
  .composer button { display: inline-flex; align-items: center; justify-content: center; gap: 0; min-width: 64px; height: 44px; padding: 0 16px; background: ${r}; color: #fff; border: none; border-radius: 8px; cursor: pointer; font-family: inherit; font-size: 14.5px; font-weight: 550; }
122
+ .composer button:hover { background: color-mix(in srgb, #000 12%, ${r}); }
123
+ .composer button:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
61
124
  .composer button .sendglyph { display: none; width: 19px; height: 19px; }
62
125
  .composer button:focus-visible { outline: 2px solid #0b0e14; }
63
126
  @media (prefers-reduced-motion: no-preference) {
64
127
  .panel { animation: rise 180ms ease-out; }
65
128
  @keyframes rise { from { transform: translateY(8px); opacity: 0; } to { transform: none; opacity: 1; } }
66
129
  }
67
- `}${pe[e.skin]}${I(e.launcherShape,e.launcherFill,e.launcherContent,e.launcherSize)}${ue[e.bubbleStyle]}${he[e.namePlacement]}${e.nameAvatar?me:""}${e.dayDividers?ge:""}${fe[e.stampPlacement]}${e.stampContent==="time_and_latency"?be:""}`}var xe=["end_user","agent","ai"];function ye(){let n=globalThis.location;if(n)return {host:n.host,path:n.pathname,title:document.title}}var x=class{constructor(e,t,r={},a={}){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);this.strings={...de,...r},this.appearance={...v,...a},this.settings=y({...v,...a}),this.root=e.attachShadow({mode:"closed"});let s=document.createElement("style");if(s.textContent=F({...v,...a}),this.root.append(s),this.launcher=document.createElement("button"),this.launcher.className="launcher",this.launcher.type="button",this.launcher.setAttribute("aria-haspopup","dialog"),this.launcher.setAttribute("aria-label",this.strings.launcherLabel),this.launcher.append(H(this.settings.launcherContent,this.strings,this.appearance.teamFaces)),this.settings.launcherShape==="pill"){let o=document.createElement("span");o.className="label",o.textContent=this.settings.launcherContent==="team_faces"?this.strings.agentLabel:this.strings.launcherLabel,this.launcher.append(o);}this.launcher.addEventListener("click",()=>this.toggle()),this.badge=document.createElement("span"),this.badge.className="badge",this.badge.hidden=true,this.launcher.append(this.badge),this.root.append(this.launcher);}toggle(){this.panel?this.close():this.open();}async open(){if(this.panel)return;this.lastFocused=this.host.ownerDocument.activeElement,this.unread=0,this.renderBadge();let e=document.createElement("section");e.className="panel",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 r=document.createElement("h2");r.textContent=this.strings.title;let a=document.createElement("button");a.className="close",a.type="button",a.setAttribute("aria-label",this.strings.closeLabel),a.textContent="\xD7",a.addEventListener("click",()=>this.close()),t.append(r,a);let s=document.createElement("div");s.className="log",s.setAttribute("role","log"),s.setAttribute("aria-live","polite"),s.setAttribute("aria-label",this.strings.title);let o=document.createElement("form");o.className="composer";let i=document.createElement("input");i.type="text",i.setAttribute("aria-label",this.strings.inputPlaceholder),i.placeholder=this.strings.inputPlaceholder;let c=document.createElement("button");c.type="submit",c.setAttribute("aria-label",this.strings.sendLabel),c.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 h=document.createElement("span");h.className="sendtext",h.textContent=this.strings.sendLabel,c.append(h),o.append(i,c),o.addEventListener("submit",g=>{g.preventDefault(),this.submit(i,s);}),e.append(t,s,o),e.addEventListener("keydown",g=>this.onKeydown(g,e,a)),this.root.append(e),this.panel=e,i.focus();let d=await this.client.load();d&&d.turns.length>0?this.renderThread(s,d):this.renderFirstRun(s,i),!N(this.appearance.availability,new Date)&&this.appearance.awayMessage.trim()&&this.renderAway(s);}renderFirstRun(e,t){let r=document.createElement("div");r.className="empty";let a=document.createElement("h3");a.textContent=this.appearance.greeting.trim()||this.strings.emptyTitle;let s=document.createElement("p");s.textContent=this.strings.emptyBody,r.append(a,s);for(let o of this.appearance.starterPrompts){let i=document.createElement("button");i.className="prompt",i.type="button",i.textContent=o,i.addEventListener("click",()=>{t.value=o,this.submit(t,e);}),r.append(i);}e.replaceChildren(r);}renderAway(e){let t=document.createElement("div");t.className="away",t.textContent=this.appearance.awayMessage,e.prepend(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.appendTurn(t,e);return}e.authorKind!=="end_user"&&(this.unread+=1,this.renderBadge());}async submit(e,t){let r=e.value.trim();if(!r)return;e.value="",t.querySelector(".empty")?.remove();let a=await this.client.send(r,ye());a&&this.appendTurn(t,a);}renderThread(e,t){e.replaceChildren();for(let r of t.turns)this.appendTurn(e,r);}appendTurn(e,t){e.querySelector(".empty")?.remove();let r=xe.includes(t.authorKind)?t.authorKind:"agent",a=this.settings,s=document.createElement("div");if(s.className=`turn ${r}`,r!=="end_user"&&a.nameAvatar){let d=document.createElement("span");d.className=r==="ai"?"av bot":"av",d.textContent=r==="ai"?this.strings.aiLabel:this.strings.agentLabel.slice(0,2).toUpperCase(),d.setAttribute("aria-hidden","true"),s.append(d);}let i=document.createElement("div");if(i.className="body",r!=="end_user"&&a.namePlacement!=="hidden"||r==="ai"&&a.namePlacement==="hidden"){let d=document.createElement("div");d.className=r==="ai"?"author ai":"author",d.textContent=r==="ai"?this.strings.aiLabel:this.strings.agentLabel,a.stampPlacement==="beside_name"&&d.append(this.stamp(t)),i.append(d);}let h=document.createElement("div");h.textContent=t.body,i.append(h),a.stampPlacement==="under_turn"&&i.append(this.stamp(t)),s.append(i),e.append(s),e.scrollTop=e.scrollHeight;}stamp(e){let t=document.createElement("span");return t.className="stamp",t.textContent=this.strings.timeLabel(e.createdAt),t}onKeydown(e,t,r){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 s=a[0],o=a[a.length-1],i=this.root.activeElement;e.shiftKey&&i===s?(e.preventDefault(),o.focus()):!e.shiftKey&&i===o?(e.preventDefault(),s.focus()):i===null&&(e.preventDefault(),r.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 R(n){return `40${JSON.stringify(n)}`}function O(){return "3"}function M(n){let e=n.charAt(0),t=n.slice(1);if(e==="2")return {kind:"ping"};if(e==="1")return {kind:"disconnect"};if(e==="0"){let o=E(t);return {kind:"open",pingInterval:typeof o?.pingInterval=="number"?o.pingInterval:25e3,pingTimeout:typeof o?.pingTimeout=="number"?o.pingTimeout:2e4}}if(e!=="4")return {kind:"other"};let r=t.charAt(0),a=t.slice(1);if(r==="0")return {kind:"connected"};if(r==="1")return {kind:"disconnect"};if(r==="4"){let o=E(a);return {kind:"connectError",message:typeof o?.message=="string"?o.message:"refused"}}if(r!=="2")return {kind:"other"};let s=E(a);return !Array.isArray(s)||typeof s[0]!="string"?{kind:"other"}:{kind:"event",name:s[0],payload:s[1]}}function E(n){try{return JSON.parse(n)}catch{return null}}var ve="/socket.io/?EIO=4&transport=websocket",S=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??Se,this.setTimer=e.setTimer??((t,r)=>setTimeout(t,r)),this.clearTimer=e.clearTimer??(t=>clearTimeout(t));}open(){if(this.socket||this.closed)return;let e=`${this.options.host.replace(/^http/,"ws").replace(/\/+$/,"")}${ve}`,t;try{t=this.factory(e);}catch{this.options.onClosed(false);return}this.socket=t,t.onmessage=r=>this.receive(String(r.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=M(e);if(t.kind==="open"){this.armHeartbeat(t.pingInterval+t.pingTimeout),this.socket?.send(R(this.options.auth));return}if(t.kind==="ping"){this.armHeartbeat(),this.socket?.send(O());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 r=t.payload?.turn;r&&this.options.onTurn(r);}}}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 Se(n){let e=globalThis.WebSocket;if(!e)throw new Error("no WebSocket");return new e(n)}function Ge(n){let e=globalThis.document;if(!e)throw new Error("prodantix chat requires a document; mount it in the browser");let t=n.mountPoint??e.createElement("div");n.mountPoint||e.body.append(t);let r=new b(n),a=new x(t,r,n.strings,n.appearance),s=new Set,o,i=null,c=n.pollIntervalMs??15e3,h=u=>{s.has(u.id)||u.authorKind==="end_user"||(s.add(u.id),a.onIncomingTurn(u));},d=async()=>{if(!r.hasThread)return;let u=await r.load();if(u){for(let f of u.turns)h(f);s=new Set(u.turns.map(f=>f.id));}},g=()=>{o||c<=0||(o=setInterval(()=>void d(),c));},T=()=>{o&&clearInterval(o),o=void 0;},k=()=>{if(i||!n.socketHost)return;let u=r.socketAuth;u&&(i=new S({auth:u,host:n.socketHost,onClosed:f=>{i=null,g(),f&&k();},onReady:T,onTurn:h,socketFactory:n.socketFactory}),i.open());};return g(),k(),{close:()=>a.close(),destroy:()=>{T(),i?.close(),i=null,a.close(),t.remove();},identify:u=>r.identify(u),open:()=>{a.open().then(k);}}}exports.ChatClient=b;exports.ChatPanel=x;exports.DEFAULT_APPEARANCE=v;exports.DEFAULT_APPEARANCE_SETTINGS=p;exports.mountChat=Ge;exports.panelStyles=F;exports.resolveAppearance=y;//# sourceMappingURL=chat.cjs.map
130
+ `}${Ce[t.composerShape]}${ke[t.skin]}${M(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 n=globalThis.location;if(n)return {host:n.host,path:n.pathname,title:document.title}}var E=class{constructor(e,t,a={},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,"openNow");l(this,"style");l(this,"scheme");this.strings={...Se,...a},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 a=this.appearance.team??[];a.length>0&&t.append(P(a,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.textContent="\xD7",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(d);}renderFirstRun(e,t){let a=document.createElement("div");a.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,a.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);}),a.append(i);}e.replaceChildren(a);}renderAway(e){let t=document.createElement("div");t.className="away",t.textContent=this.appearance.awayMessage.trim()||this.strings.awayBody,e.prepend(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.appendTurn(t,e);return}e.authorKind!=="end_user"&&(this.unread+=1,this.renderBadge());}async submit(e,t){let a=e.value.trim();if(!a)return;e.value="",t.querySelector(".empty")?.remove();let r=await this.client.send(a,Fe());r&&this.appendTurn(t,r);}renderThread(e,t){e.replaceChildren();for(let a of t.turns)this.appendTurn(e,a);}appendTurn(e,t){e.querySelector(".empty")?.remove();let a=Ie.includes(t.authorKind)?t.authorKind:"agent",r=this.settings,o=document.createElement("div");if(o.className=`turn ${a}`,a!=="end_user"&&r.nameAvatar){let c=document.createElement("span");if(c.className=a==="ai"?"av bot":"av",c.setAttribute("aria-hidden","true"),a==="agent"&&t.authorAvatarUrl){let p=document.createElement("img");p.alt="",p.src=this.client.avatarUrl(t.authorAvatarUrl),c.append(p);}else c.textContent=a==="ai"?this.strings.aiLabel:O(this.agentName(t));o.append(c);}let i=document.createElement("div");i.className="body";let h=a!=="end_user"&&r.namePlacement!=="hidden",d=document.createElement("div");if(d.textContent=t.body,h||a==="ai"&&r.namePlacement==="hidden"){let c=document.createElement("div");c.className=a==="ai"?"author ai":"author",c.textContent=a==="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);r.stampPlacement==="under_turn"&&i.append(this.stamp(t)),o.append(i),e.append(o),e.scrollTop=e.scrollHeight;}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,a){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(),a.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 B(n){return `40${JSON.stringify(n)}`}function D(){return "3"}function K(n){let e=n.charAt(0),t=n.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 a=t.charAt(0),r=t.slice(1);if(a==="0")return {kind:"connected"};if(a==="1")return {kind:"disconnect"};if(a==="4"){let s=I(r);return {kind:"connectError",message:typeof s?.message=="string"?s.message:"refused"}}if(a!=="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(n){try{return JSON.parse(n)}catch{return null}}var He="/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??Re,this.setTimer=e.setTimer??((t,a)=>setTimeout(t,a)),this.clearTimer=e.clearTimer??(t=>clearTimeout(t));}open(){if(this.socket||this.closed)return;let e=`${this.options.host.replace(/^http/,"ws").replace(/\/+$/,"")}${He}`,t;try{t=this.factory(e);}catch{this.options.onClosed(false);return}this.socket=t,t.onmessage=a=>this.receive(String(a.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(B(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 a=t.payload?.turn;a&&this.options.onTurn(a);}}}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 Re(n){let e=globalThis.WebSocket;if(!e)throw new Error("no WebSocket");return new e(n)}var Oe=6e4;function rt(n){let e=globalThis.document;if(!e)throw new Error("prodantix chat requires a document; mount it in the browser");let t=n.mountPoint??e.createElement("div");n.mountPoint||e.body.append(t);let a=new k(n),r=new E(t,a,n.strings,n.appearance),o=n.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=n.pollIntervalMs??15e3,m=g=>{h.has(g.id)||g.authorKind==="end_user"||(h.add(g.id),r.onIncomingTurn(g));},v=async()=>{if(!a.hasThread)return;let g=await a.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||!n.socketHost)return;let g=a.socketAuth;g&&(c=new T({auth:g,host:n.socketHost,onClosed:S=>{c=null,y(),S&&A();},onReady:b,onTurn:m,socketFactory:n.socketFactory}),c.open());};return y(),A(),{close:()=>r.close(),destroy:()=>{b(),clearTimeout(s),c?.close(),c=null,r.close(),t.remove();},identify:g=>a.identify(g),open:()=>{r.open().then(A);}}}exports.ChatClient=k;exports.ChatPanel=E;exports.DEFAULT_APPEARANCE=x;exports.DEFAULT_APPEARANCE_SETTINGS=u;exports.mountChat=rt;exports.panelStyles=_;exports.resolveAppearance=C;//# sourceMappingURL=chat.cjs.map
68
131
  //# sourceMappingURL=chat.cjs.map
package/dist/chat.d.cts CHANGED
@@ -1,5 +1,5 @@
1
- import { C as ChatClient, M as MessengerConfig, A as AppearanceSettings, a as ChatTurn, b as ChatIdentity, c as ChatClientOptions } from './config-CWmtX8Gl.cjs';
2
- export { B as BubbleStyle, d as ChatStorage, e as ChatThread, D as DEFAULT_APPEARANCE_SETTINGS, L as LauncherContent, f as LauncherFill, g as LauncherShape, h as LauncherSize, i as MessengerSkin, N as NamePlacement, S as StampContent, j as StampPlacement, r as resolveAppearance } from './config-CWmtX8Gl.cjs';
1
+ import { C as ChatThread, P as PageContext, a as ChatTurn, M as MessengerConfig, A as AppearanceSettings, b as ChatIdentity, c as ChatClientOptions } from './config-D8-uiWM8.cjs';
2
+ export { B as BubbleFill, d as BubbleShape, e as ChatClient, f as ChatStorage, g as ComposerShape, D as DEFAULT_APPEARANCE_SETTINGS, L as LauncherContent, h as LauncherFill, i as LauncherShape, j as LauncherSize, k as MessengerSkin, N as NamePlacement, S as StampContent, l as StampPlacement, r as resolveAppearance } from './config-D8-uiWM8.cjs';
3
3
  import { S as SocketFactory } from './types-DjMXp6Wg.cjs';
4
4
  import './http-BCh716Vs.cjs';
5
5
 
@@ -8,6 +8,7 @@ interface ChatStrings {
8
8
  title: string;
9
9
  inputPlaceholder: string;
10
10
  sendLabel: string;
11
+ awayBody: string;
11
12
  closeLabel: string;
12
13
  agentLabel: string;
13
14
  aiLabel: string;
@@ -15,24 +16,41 @@ interface ChatStrings {
15
16
  timeLabel: (createdAt: string) => string;
16
17
  emptyTitle: string;
17
18
  emptyBody: string;
19
+ replyTime: string;
18
20
  }
19
- type MessengerAppearance = Pick<MessengerConfig, 'accentColor' | 'availability' | 'awayMessage' | 'greeting' | 'launcherOffsetX' | 'launcherOffsetY' | 'launcherPosition' | 'starterPrompts' | 'teamFaces'> & AppearanceSettings;
21
+ type MessengerAppearance = Pick<MessengerConfig, 'accentColor' | 'availability' | 'awayMessage' | 'greeting' | 'launcherOffsetX' | 'launcherOffsetY' | 'launcherPosition' | 'starterPrompts' | 'team'> & AppearanceSettings;
20
22
  declare const DEFAULT_APPEARANCE: MessengerAppearance;
21
- declare function panelStyles(appearance: MessengerAppearance): string;
23
+ interface ChatSource {
24
+ avatarUrl(url: string): string;
25
+ load(): Promise<ChatThread | null>;
26
+ send(body: string, pageContext?: PageContext): Promise<ChatTurn | null>;
27
+ }
28
+ type ChatScheme = 'dark' | 'light' | 'system';
29
+ interface ChatPanelOptions {
30
+ scheme?: ChatScheme;
31
+ shadowMode?: 'closed' | 'open';
32
+ }
33
+ declare function panelStyles(appearance: MessengerAppearance, scheme?: ChatScheme): string;
22
34
  declare class ChatPanel {
23
35
  private readonly host;
24
36
  private readonly client;
25
37
  private readonly root;
26
38
  private readonly strings;
27
- private readonly settings;
28
- private readonly appearance;
39
+ private settings;
40
+ private appearance;
29
41
  private readonly launcher;
30
42
  private readonly badge;
31
43
  private panel;
32
44
  private lastFocused;
33
45
  private unread;
34
- constructor(host: HTMLElement, client: ChatClient, strings?: Partial<ChatStrings>, appearance?: Partial<MessengerAppearance>);
46
+ private openNow;
47
+ private readonly style;
48
+ private scheme;
49
+ constructor(host: HTMLElement, client: ChatSource, strings?: Partial<ChatStrings>, appearance?: Partial<MessengerAppearance>, options?: ChatPanelOptions);
50
+ private drawLauncher;
51
+ update(appearance: Partial<MessengerAppearance>, scheme?: ChatScheme): void;
35
52
  private toggle;
53
+ setOpenNow(open: boolean): void;
36
54
  open(): Promise<void>;
37
55
  private renderFirstRun;
38
56
  private renderAway;
@@ -41,6 +59,7 @@ declare class ChatPanel {
41
59
  private submit;
42
60
  private renderThread;
43
61
  private appendTurn;
62
+ private agentName;
44
63
  private stamp;
45
64
  private onKeydown;
46
65
  private renderBadge;
@@ -62,4 +81,4 @@ interface ChatHandle {
62
81
  }
63
82
  declare function mountChat(options: MountChatOptions): ChatHandle;
64
83
 
65
- export { AppearanceSettings, ChatClient, ChatClientOptions, type ChatHandle, ChatIdentity, ChatPanel, type ChatStrings, ChatTurn, DEFAULT_APPEARANCE, type MessengerAppearance, type MountChatOptions, mountChat, panelStyles };
84
+ export { AppearanceSettings, ChatClientOptions, type ChatHandle, ChatIdentity, ChatPanel, type ChatStrings, ChatThread, ChatTurn, DEFAULT_APPEARANCE, type MessengerAppearance, type MountChatOptions, mountChat, panelStyles };
package/dist/chat.d.ts CHANGED
@@ -1,5 +1,5 @@
1
- import { C as ChatClient, M as MessengerConfig, A as AppearanceSettings, a as ChatTurn, b as ChatIdentity, c as ChatClientOptions } from './config-DDlHv52p.js';
2
- export { B as BubbleStyle, d as ChatStorage, e as ChatThread, D as DEFAULT_APPEARANCE_SETTINGS, L as LauncherContent, f as LauncherFill, g as LauncherShape, h as LauncherSize, i as MessengerSkin, N as NamePlacement, S as StampContent, j as StampPlacement, r as resolveAppearance } from './config-DDlHv52p.js';
1
+ import { C as ChatThread, P as PageContext, a as ChatTurn, M as MessengerConfig, A as AppearanceSettings, b as ChatIdentity, c as ChatClientOptions } from './config-DGUsxWOL.js';
2
+ export { B as BubbleFill, d as BubbleShape, e as ChatClient, f as ChatStorage, g as ComposerShape, D as DEFAULT_APPEARANCE_SETTINGS, L as LauncherContent, h as LauncherFill, i as LauncherShape, j as LauncherSize, k as MessengerSkin, N as NamePlacement, S as StampContent, l as StampPlacement, r as resolveAppearance } from './config-DGUsxWOL.js';
3
3
  import { S as SocketFactory } from './types-DjMXp6Wg.js';
4
4
  import './http-BCh716Vs.js';
5
5
 
@@ -8,6 +8,7 @@ interface ChatStrings {
8
8
  title: string;
9
9
  inputPlaceholder: string;
10
10
  sendLabel: string;
11
+ awayBody: string;
11
12
  closeLabel: string;
12
13
  agentLabel: string;
13
14
  aiLabel: string;
@@ -15,24 +16,41 @@ interface ChatStrings {
15
16
  timeLabel: (createdAt: string) => string;
16
17
  emptyTitle: string;
17
18
  emptyBody: string;
19
+ replyTime: string;
18
20
  }
19
- type MessengerAppearance = Pick<MessengerConfig, 'accentColor' | 'availability' | 'awayMessage' | 'greeting' | 'launcherOffsetX' | 'launcherOffsetY' | 'launcherPosition' | 'starterPrompts' | 'teamFaces'> & AppearanceSettings;
21
+ type MessengerAppearance = Pick<MessengerConfig, 'accentColor' | 'availability' | 'awayMessage' | 'greeting' | 'launcherOffsetX' | 'launcherOffsetY' | 'launcherPosition' | 'starterPrompts' | 'team'> & AppearanceSettings;
20
22
  declare const DEFAULT_APPEARANCE: MessengerAppearance;
21
- declare function panelStyles(appearance: MessengerAppearance): string;
23
+ interface ChatSource {
24
+ avatarUrl(url: string): string;
25
+ load(): Promise<ChatThread | null>;
26
+ send(body: string, pageContext?: PageContext): Promise<ChatTurn | null>;
27
+ }
28
+ type ChatScheme = 'dark' | 'light' | 'system';
29
+ interface ChatPanelOptions {
30
+ scheme?: ChatScheme;
31
+ shadowMode?: 'closed' | 'open';
32
+ }
33
+ declare function panelStyles(appearance: MessengerAppearance, scheme?: ChatScheme): string;
22
34
  declare class ChatPanel {
23
35
  private readonly host;
24
36
  private readonly client;
25
37
  private readonly root;
26
38
  private readonly strings;
27
- private readonly settings;
28
- private readonly appearance;
39
+ private settings;
40
+ private appearance;
29
41
  private readonly launcher;
30
42
  private readonly badge;
31
43
  private panel;
32
44
  private lastFocused;
33
45
  private unread;
34
- constructor(host: HTMLElement, client: ChatClient, strings?: Partial<ChatStrings>, appearance?: Partial<MessengerAppearance>);
46
+ private openNow;
47
+ private readonly style;
48
+ private scheme;
49
+ constructor(host: HTMLElement, client: ChatSource, strings?: Partial<ChatStrings>, appearance?: Partial<MessengerAppearance>, options?: ChatPanelOptions);
50
+ private drawLauncher;
51
+ update(appearance: Partial<MessengerAppearance>, scheme?: ChatScheme): void;
35
52
  private toggle;
53
+ setOpenNow(open: boolean): void;
36
54
  open(): Promise<void>;
37
55
  private renderFirstRun;
38
56
  private renderAway;
@@ -41,6 +59,7 @@ declare class ChatPanel {
41
59
  private submit;
42
60
  private renderThread;
43
61
  private appendTurn;
62
+ private agentName;
44
63
  private stamp;
45
64
  private onKeydown;
46
65
  private renderBadge;
@@ -62,4 +81,4 @@ interface ChatHandle {
62
81
  }
63
82
  declare function mountChat(options: MountChatOptions): ChatHandle;
64
83
 
65
- export { AppearanceSettings, ChatClient, ChatClientOptions, type ChatHandle, ChatIdentity, ChatPanel, type ChatStrings, ChatTurn, DEFAULT_APPEARANCE, type MessengerAppearance, type MountChatOptions, mountChat, panelStyles };
84
+ export { AppearanceSettings, ChatClientOptions, type ChatHandle, ChatIdentity, ChatPanel, type ChatStrings, ChatThread, ChatTurn, DEFAULT_APPEARANCE, type MessengerAppearance, type MountChatOptions, mountChat, panelStyles };