@accurix/centrinfo-widget 1.0.0 โ 1.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +115 -12
- package/dist/cdn/centrinfo-widget.js +2388 -235
- package/dist/cdn/manifest.json +6 -6
- package/dist/config-BfVMFkZ4.cjs +36 -0
- package/dist/config-CHvO9tW1.mjs +30 -0
- package/dist/index.cjs +2358 -234
- package/dist/index.d.cts +4 -292
- package/dist/index.d.mts +3 -294
- package/dist/index.d.ts +3 -294
- package/dist/index.mjs +2358 -234
- package/dist/runtime.cjs +1 -0
- package/dist/runtime.d.cts +249 -0
- package/dist/runtime.d.mts +249 -0
- package/dist/runtime.mjs +1 -0
- package/dist/types-BwixZ4yh.d.mts +715 -0
- package/dist/types-CiW6Ilds.d.cts +712 -0
- package/package.json +34 -17
package/dist/index.mjs
CHANGED
|
@@ -1,11 +1,4 @@
|
|
|
1
|
-
import{createContext as e,render as t}from"preact";import{useCallback as n,useContext as r,useEffect as i,useMemo as a,useRef as o,useState as s}from"preact/hooks";import{Fragment as c,jsx as l,jsxs as u}from"preact/jsx-runtime";var d=class extends Error{constructor(e,t){super(t),this.status=e,this.name=`ApiError`}};const f=()=>({agentName:`Assistant`,greeting:`Hi! ๐ How can I help you today?`,allowVoiceInput:!1,availableActions:[]});var p=class{constructor(e,t,n){this.baseUrl=e,this.token=t,this.gifApiKey=n}headers(e=!0){let t={Authorization:`Bearer ${this.token}`};return e&&(t[`Content-Type`]=`application/json`),t}async json(e){let t;try{t=await e.json()}catch{t=void 0}if(!e.ok){let n=h(t)??`request failed (${e.status})`;throw new d(e.status,n)}return t?.data??t}async bootstrap(){try{let e=await fetch(`${this.baseUrl}/public-chat/bootstrap`,{headers:this.headers(!1)});if(!e.ok)return f();let t=await this.json(e);return{...f(),...t}}catch{return f()}}async stream(e,t,n){let r=await fetch(`${this.baseUrl}/public-chat/stream`,{method:`POST`,headers:this.headers(),body:JSON.stringify({question:e,sessionId:t}),signal:n.signal});return!r.ok||!r.body?this.send(e,t,n):g(r.body,n)}async send(e,t,n){let r=await fetch(`${this.baseUrl}/public-chat`,{method:`POST`,headers:this.headers(),body:JSON.stringify({question:e,sessionId:t}),signal:n.signal}),i=await this.json(r);return n.onChunk(i.answer??``),{answer:i.answer??``,sources:i.sources??[],suggestedReplies:i.suggestedReplies??[],availableActions:i.availableActions??[],handoffOffered:i.handoffOffered??!1,requestedContactFields:v(i.requestedContactFields),conversationEnded:i.conversationEnded??!1}}async action(e,t){let n=await fetch(`${this.baseUrl}/public-chat/${e}`,{method:`POST`,headers:this.headers(),body:JSON.stringify(t)}),r=await this.json(n);return{ok:!0,note:r?.note,booking:r?.booking}}async identify(e,t){if(!(!e||!t))try{let n=await fetch(`${this.baseUrl}/public-chat/identify`,{method:`POST`,headers:this.headers(),body:JSON.stringify(m(e,t))});if(!n.ok)try{await n.text()}catch{}}catch{}}async transcribe(e,t){let n=await fetch(`${this.baseUrl}/public-chat/transcribe`,{method:`POST`,headers:this.headers(),body:JSON.stringify({audioBase64:e,mimeType:t})});return(await this.json(n)).text??``}async endConversation(e){try{let t=await fetch(`${this.baseUrl}/public-chat/end`,{method:`POST`,headers:this.headers(),body:JSON.stringify({sessionId:e})});if(!t.ok)try{await t.text()}catch{}}catch{}}async sendFeedback(e){try{let t=await fetch(`${this.baseUrl}/public-chat/feedback`,{method:`POST`,headers:this.headers(),body:JSON.stringify(e)});if(!t.ok)try{await t.text()}catch{}}catch{}}async extract(e,t,n){let r=await fetch(`${this.baseUrl}/public-chat/extract`,{method:`POST`,headers:this.headers(),body:JSON.stringify({fileBase64:e,mimeType:t,filename:n})});return(await this.json(r)).text??``}async demoSlots(e,t){try{let n=`from=${encodeURIComponent(e)}&to=${encodeURIComponent(t)}`,r=await fetch(`${this.baseUrl}/public-chat/demo-slots?${n}`,{headers:this.headers(!1)});if(!r.ok)return{taken:[],busy:[]};let i=await this.json(r);return{taken:i?.taken??[],busy:i?.busy??[]}}catch{return{taken:[],busy:[]}}}async searchGifs(e){if(!this.gifApiKey)return[];let t=`https://tenor.googleapis.com/v2/search?q=${encodeURIComponent(e.trim()||`trending`)}&key=${this.gifApiKey}&limit=24&media_filter=tinygif,gif&contentfilter=high`;try{let e=await fetch(t);return e.ok?((await e.json()).results??[]).map(e=>({id:e.id,url:e.media_formats?.gif?.url??e.media_formats?.tinygif?.url??``,preview:e.media_formats?.tinygif?.url??e.media_formats?.gif?.url??``,alt:e.content_description||`GIF`})).filter(e=>e.url):[]}catch{return[]}}};const m=(e,t)=>{let n={...t.customAttributes??{},...t.metadata??{}};t.createdAt!==void 0&&(n.createdAt=t.createdAt),t.avatarUrl&&(n.avatarUrl=t.avatarUrl),t.company&&(n.company=t.company);let r={sessionId:e},i=t.externalId??t.userId;return i&&(r.externalId=i),t.email&&(r.email=t.email),t.firstName&&(r.firstName=t.firstName),t.lastName&&(r.lastName=t.lastName),t.name&&(r.name=t.name),t.phone&&(r.phone=t.phone),Object.keys(n).length>0&&(r.metadata=n),r},h=e=>{let t=e?.message;if(Array.isArray(t))return t.join(`, `);if(typeof t==`string`)return t},g=async(e,t)=>{let n=e.getReader(),r=new TextDecoder,i={answer:``,sources:[],suggestedReplies:[],availableActions:[],handoffOffered:!1,requestedContactFields:[],conversationEnded:!1},a=``;for(;;){let{done:e,value:o}=await n.read();if(e)break;a+=r.decode(o,{stream:!0});let s;for(;(s=a.indexOf(`
|
|
2
|
-
|
|
3
|
-
`))!==-1;){let e=a.slice(0,s);a=a.slice(s+2);let n=_(e);if(n){if(n.event===`error`)throw new d(502,n.data?.message??`stream error`);if(n.event===`chunk`&&typeof n.data?.text==`string`)i.answer+=n.data.text,t.onChunk(n.data.text);else if(n.event===`final`&&n.data)i.sources=n.data.sources??[],i.suggestedReplies=n.data.suggestedReplies??[],i.availableActions=n.data.availableActions??[],i.handoffOffered=!!n.data.handoffOffered,i.requestedContactFields=v(n.data.requestedContactFields),i.conversationEnded=!!n.data.conversationEnded;else if(n.event===`done`)return i}}}return i},_=e=>{let t=`message`,n=[];for(let r of e.split(`
|
|
4
|
-
`))r.startsWith(`event:`)?t=r.slice(6).trim():r.startsWith(`data:`)&&n.push(r.slice(5).trim());if(n.length===0)return{event:t};try{return{event:t,data:JSON.parse(n.join(`
|
|
5
|
-
`))}}catch{return{event:t}}},v=e=>Array.isArray(e)?e.filter(e=>typeof e==`string`):[],y=e=>new Promise(t=>setTimeout(t,e)),b={agentName:`Sara`,agentAvatarUrl:``,greeting:`Hi! ๐ I'm Sara, the Northwind assistant. Ask me anything about tracking, customs, or pricing โ or book a demo.`,allowVoiceInput:!0,availableActions:[`public_book_demo`,`public_capture_contact`,`public_submit_inquiry`],agentDescription:`I help with shipment tracking, customs, and pricing.`,welcomeSubtitle:`Ask me anything โ most answers are instant.`,disclaimerText:`Sara is an AI assistant; answers may be imperfect.`,starterQuestions:[`How do I track a shipment?`,`How does customs work?`,`What's your pricing?`]},x=[{match:/^\s*(hi+|hey+|hello|yo|sup|howdy|hola|thanks|thank you|thx|good (morning|afternoon|evening))\b/i,result:{answer:`Hello! ๐ How can I help you today?`,sources:[],suggestedReplies:[`How do I track a shipment?`,`How does customs work?`],handoffOffered:!1}},{match:/track|shipment|where|status/i,result:{answer:`You can track any shipment in real time from the **Tracking** tab โ we merge GPS pings with carrier scan events, so the status is usually fresher than the carrier's own site. Each shipment also has a shareable link you can send to customers.`,sources:[{title:`Real-time tracking`,url:`https://northwind.example/docs/tracking`},{title:`Shareable tracking links`,url:`https://northwind.example/docs/share`}],suggestedReplies:[`How fresh is the data?`,`Can customers track too?`],handoffOffered:!1}},{match:/custom|clear|duty|tariff|import/i,result:{answer:`Customs is automated end-to-end: HS codes are auto-classified from your product catalog, duties are estimated up front, and most lanes are pre-cleared before the freight lands. If a shipment needs a human broker, we flag it early so it never sits at the border.`,sources:[{title:`Smart customs`,url:`https://northwind.example/docs/customs`}],suggestedReplies:[`Which countries are pre-cleared?`,`What does it cost?`],handoffOffered:!1}},{match:/price|cost|pricing|plan|quote/i,result:{answer:`Pricing is usage-based โ you pay per shipment, with volume tiers that kick in automatically. There's no platform fee and no per-seat charge. I can have someone put together a quote for your lanes if you'd like.`,sources:[{title:`Pricing`,url:`https://northwind.example/pricing`}],suggestedReplies:[`How do volume tiers work?`,`Is there a free trial?`],handoffOffered:!1}}],S={answer:`That's a great question โ I don't have a confident answer from Northwind's published docs yet. Want me to pass it to the team so a human can follow up? You can also book a quick demo.`,sources:[],suggestedReplies:[`What can you help with?`],handoffOffered:!0};var C=class{async bootstrap(){return await y(180),b}async stream(e,t,n){await y(550);let r=x.find(t=>t.match.test(e)),i=r?r.result:S,a=i.answer.split(/(\s+)/);for(let e of a){if(n.signal?.aborted)break;n.onChunk(e),await y(18+Math.min(40,e.length*6))}return{...i,availableActions:b.availableActions}}async action(e,t){return await y(450),{ok:!0,note:{"book-demo":`Demo requested โ we'll email you a few times that work. ๐
`,contact:`Got it โ saved your details. โ
`,inquiry:`Thanks! We'll get back to you shortly. โ๏ธ`,"request-callback":`We'll call you back soon. ๐`,"subscribe-newsletter":`You're subscribed. ๐`}[e]}}async transcribe(e,t){return await y(700),`How do I track a shipment?`}async extract(e,t,n){return await y(600),`[Attached file${n?`: ${n}`:``}] Invoice #4821 โ 3 pallets, Rotterdam โ Lagos, ETA 12 days.`}async identify(e,t){await y(50)}async endConversation(e){await y(50)}async sendFeedback(){await y(50)}async demoSlots(e,t){return await y(150),{taken:[[11,0],[15,0]].map(([e,t])=>{let n=new Date;return n.setHours(e,t,0,0),n.toISOString()}),busy:[]}}async searchGifs(e){await y(280);let t=e.trim().toLowerCase(),n=t?D.filter(e=>e.alt.includes(t)||e.tags.some(e=>e.includes(t)||t.includes(e))):D;return(n.length>0?n:D).map(e=>({id:e.id,url:E(e.emoji,e.anim),preview:E(e.emoji,e.anim),alt:e.alt}))}};const w=`<animateTransform attributeName='transform' attributeType='XML' type='translate' values='0 0;0 -16;0 0' dur='0.7s' repeatCount='indefinite'/>`,T=`<animateTransform attributeName='transform' attributeType='XML' type='rotate' values='-14 64 110;14 64 110;-14 64 110' dur='0.9s' repeatCount='indefinite'/>`,E=(e,t)=>{let n=`<svg xmlns='http://www.w3.org/2000/svg' width='128' height='128'><rect width='128' height='128' rx='14' fill='#eef1f4'/><text x='64' y='88' font-size='64' text-anchor='middle'>${e}${t}</text></svg>`;return`data:image/svg+xml,${encodeURIComponent(n)}`},D=[{id:`g1`,emoji:`๐`,alt:`thumbs up`,tags:[`thumbs`,`yes`,`ok`,`great`,`good`],anim:w},{id:`g2`,emoji:`๐`,alt:`celebrate`,tags:[`party`,`yay`,`congrats`,`celebrate`],anim:T},{id:`g3`,emoji:`๐`,alt:`wave hello`,tags:[`hi`,`hello`,`hey`,`wave`,`bye`],anim:T},{id:`g4`,emoji:`โค๏ธ`,alt:`heart`,tags:[`love`,`thanks`,`heart`],anim:w},{id:`g5`,emoji:`๐ค`,alt:`thinking`,tags:[`hmm`,`think`,`thinking`],anim:T},{id:`g6`,emoji:`๐`,alt:`laughing`,tags:[`lol`,`funny`,`haha`,`laugh`],anim:w},{id:`g7`,emoji:`๐ฅ`,alt:`fire`,tags:[`fire`,`hot`,`lit`,`awesome`],anim:w},{id:`g8`,emoji:`๐`,alt:`rocket`,tags:[`rocket`,`launch`,`fast`,`go`],anim:T}],O=e=>new Promise(t=>setTimeout(t,e));var k=class{constructor(e,t){this.real=e,this.strings=t}bootstrap(){return this.real.bootstrap()}async stream(e,t,n){await O(300);for(let e of this.strings.previewReply.split(/(\s+)/)){if(n.signal?.aborted)break;n.onChunk(e),await O(16)}return{answer:this.strings.previewReply,sources:[],suggestedReplies:[],availableActions:[],handoffOffered:!1}}async action(){return await O(250),{ok:!0,note:this.strings.previewActionNote}}async identify(){}async endConversation(){}async sendFeedback(){}async transcribe(){return``}async extract(){return``}async searchGifs(){return[]}async demoSlots(){return{taken:[],busy:[]}}};const A=[{name:`Smileys`,emojis:`๐.๐.๐.๐.๐
.๐.๐คฃ.๐.๐.๐.๐.๐.๐.๐.๐ฅฐ.๐.๐.๐.๐.๐คช.๐ค.๐คญ.๐ค.๐ค.๐.๐ถ.๐.๐.๐ด.๐ฅณ.๐.๐ค.๐ฅบ.๐ข.๐ญ.๐ค.๐ .๐คฏ.๐ฌ.๐ฑ.๐คฉ.๐ฅฑ`.split(`.`)},{name:`Gestures`,emojis:[`๐`,`๐`,`๐`,`๐ค`,`โ๏ธ`,`๐ค`,`๐ค`,`๐ค`,`๐ค`,`๐`,`๐`,`๐`,`๐`,`โ`,`๐๏ธ`,`๐`,`๐ค`,`๐`,`๐ช`,`๐`,`๐`,`๐`,`๐คฒ`,`๐ซถ`]},{name:`Hearts & symbols`,emojis:`โค๏ธ.๐งก.๐.๐.๐.๐.๐ค.๐ค.๐.โฃ๏ธ.๐.๐.๐.๐.โจ.โญ.๐.๐ซ.๐ฅ.๐.๐.โ
.โ.โก.๐ฏ.๐`.split(`.`)},{name:`Animals & nature`,emojis:[`๐ถ`,`๐ฑ`,`๐ฆ`,`๐ป`,`๐ผ`,`๐จ`,`๐ฆ`,`๐ฎ`,`๐ธ`,`๐ต`,`๐ง`,`๐ฆ`,`๐`,`๐ฆ`,`๐ข`,`๐ฌ`,`๐ท`,`๐ธ`,`๐น`,`๐ป`,`๐ณ`,`๐`]},{name:`Food & drink`,emojis:[`๐`,`๐`,`๐`,`๐`,`๐`,`๐ฅ`,`๐`,`๐`,`๐`,`๐ฎ`,`๐ฟ`,`๐ฉ`,`๐ช`,`๐`,`โ`,`๐ต`,`๐บ`,`๐ฅ`,`๐ท`]},{name:`Objects & travel`,emojis:`๐.โ๏ธ.๐.๐ .๐ฆ.๐ฑ.๐ป.โ.๐ท.๐ก.๐.๐.๐.โ๏ธ.๐.๐.๐ง.๐ฐ.๐.โฐ.๐.๐ฏ.๐.๐ฎ.๐ต.๐ฌ.๐`.split(`.`)}],j={inquiry:{title:`Leave a message`,submit:`Send message`,fields:[{key:`visitorName`,label:`Name`,kind:`text`,identity:`name`},{key:`visitorEmail`,label:`Email`,kind:`email`,required:!0,identity:`email`},{key:`message`,label:`Message`,kind:`textarea`,required:!0,placeholder:`How can we help?`}]},contact:{title:`Share your details`,submit:`Save`,fields:[{key:`name`,label:`Name`,kind:`text`,identity:`name`},{key:`email`,label:`Email`,kind:`email`,required:!0,identity:`email`},{key:`phone`,label:`Phone`,kind:`tel`,identity:`phone`}]},"book-demo":{title:`Book a demo`,submit:`Request demo`,fields:[{key:`visitorName`,label:`Name`,kind:`text`,identity:`name`},{key:`visitorEmail`,label:`Email`,kind:`email`,required:!0,identity:`email`},{key:`preferredAt`,label:`Preferred time`,kind:`text`,placeholder:`e.g. Thursday 3pm`},{key:`notes`,label:`Notes`,kind:`textarea`,placeholder:`Anything we should know?`}]},"request-callback":{title:`Request a callback`,submit:`Request callback`,fields:[{key:`visitorName`,label:`Name`,kind:`text`,identity:`name`},{key:`visitorPhone`,label:`Phone`,kind:`tel`,required:!0,identity:`phone`},{key:`bestTime`,label:`Best time to call`,kind:`text`,placeholder:`e.g. tomorrow afternoon`},{key:`topic`,label:`Topic`,kind:`text`,placeholder:`What should we call about?`}]},"subscribe-newsletter":{title:`Subscribe`,submit:`Subscribe`,fields:[{key:`visitorName`,label:`Name`,kind:`text`,identity:`name`},{key:`visitorEmail`,label:`Email`,kind:`email`,required:!0,identity:`email`}]}},M={openChat:`Open chat`,closeChat:`Close chat`,muteSounds:`Mute sounds`,unmuteSounds:`Unmute sounds`,statusOnline:`Online ยท replies instantly`,statusOffline:`Away ยท leave a message`,composerPlaceholder:`Type your messageโฆ`,send:`Send message`,emoji:`Emoji`,gifs:`GIFs`,attachFile:`Attach a file`,recordVoice:`Record a voice message`,stopRecording:`Stop recording`,stop:`Stop`,copy:`Copy`,copied:`Copied`,retry:`Retry`,clearChat:`Clear conversation`,clearChatConfirm:`Clear this conversation?`,clearChatConfirmBody:`This clears the messages on this device and starts a fresh chat.`,clearConfirmCta:`Clear chat`,endChat:`End conversation`,endChatConfirm:`End this conversation?`,endChatConfirmBody:`You won't be able to send more messages in this chat, but you can start a new one anytime.`,endConfirmCta:`End conversation`,conversationEnded:`This conversation has ended.`,startNewChat:`Start a new conversation`,pastConversations:`Past conversations`,viewingPast:`Viewing a past conversation (read-only)`,backToChat:`Back to current chat`,historyEnded:`ended`,feedbackHelpful:`Helpful`,feedbackNotHelpful:`Not helpful`,feedbackThanks:`Thanks for the feedback`,csatPrompt:`How was this chat?`,feedbackCommentPlaceholder:`What went wrong? (optional)`,feedbackSend:`Send`,cancel:`Cancel`,newMessages:`New messages`,poweredBy:`Powered by`,searchGifs:`Search GIFsโฆ`,searchingGifs:`Searchingโฆ`,noGifs:`No GIFs found`,assistantTyping:`Assistant is typing`,emptyReply:`Sorry, I couldn't generate a reply.`,errorGeneric:`Something went wrong reaching the assistant. Please try again.`,errorRateLimit:`Youโre sending messages a little fast โ give it a second and try again.`,attaching:`Reading fileโฆ`,attachTooLarge:`That file is too large (max 8 MB).`,attachFailed:`Couldnโt read that file โ try another.`,handoffTitle:`Want our team to follow up?`,handoffName:`Name (optional)`,handoffEmail:`Your email`,handoffNotify:`Notify the team`,sending:`Sendingโฆ`,handoffShared:`Iโve shared this with our team โ theyโll get back to you at {email}.`,formThanks:`Thanks! Weโll be in touch.`,formError:`Something went wrong โ please try again.`,bookingPickTime:`What time works best?`,bookingDuration:`30-minute demo`,bookingRequested:`Requested for {when} โ weโll confirm by email.`,bookingConfirmed:`Youโre booked for {when}! A calendar invite is on its way. ๐
`,bookingSlotTaken:`That time was just taken โ please pick another.`,bookingViaProvider:`Pick a time that works for you on {provider}.`,bookingOpenScheduler:`Open the scheduler`,bookingLinkOpened:`Opening the scheduler โ pick a time that suits you. ๐
`,bookingMeetingLink:`Meeting link`,previewReply:`๐ This is a preview โ replies here are samples. Publish the widget on your site to chat with the live AI.`,previewActionNote:`Preview โ nothing was actually sent. This works for real once you publish.`,previewBanner:`Preview โ sample replies, no AI`},N=(e,t)=>e.replace(/\{(\w+)\}/g,(e,n)=>t[n]??``),ee=e=>e?{...M,...e}:M,te=e(M),ne=te.Provider,P=()=>r(te),F=(e,t)=>l(`svg`,{viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`,"stroke-linejoin":`round`,"aria-hidden":`true`,...t,children:e}),re=e=>l(`svg`,{viewBox:`0 0 24 24`,fill:`currentColor`,"aria-hidden":`true`,...e,children:l(`path`,{"fill-rule":`evenodd`,"clip-rule":`evenodd`,d:`M5 3.25h14A3.75 3.75 0 0 1 22.75 7v6A3.75 3.75 0 0 1 19 16.75h-7.19l-4.26 3.84A.75.75 0 0 1 6.25 20v-3.32A3.75 3.75 0 0 1 2.25 13V7A3.75 3.75 0 0 1 6 3.25Zm3 7.75a1.25 1.25 0 1 0 0-2.5 1.25 1.25 0 0 0 0 2.5Zm4 0a1.25 1.25 0 1 0 0-2.5 1.25 1.25 0 0 0 0 2.5Zm4 0a1.25 1.25 0 1 0 0-2.5 1.25 1.25 0 0 0 0 2.5Z`})}),ie=e=>F(l(`path`,{d:`m6 9 6 6 6-6`}),e),I=e=>F(u(c,{children:[l(`path`,{d:`m22 2-7 20-4-9-9-4Z`}),l(`path`,{d:`M22 2 11 13`})]}),e),L=e=>F(u(c,{children:[l(`path`,{d:`M12 2a3 3 0 0 0-3 3v7a3 3 0 0 0 6 0V5a3 3 0 0 0-3-3Z`}),l(`path`,{d:`M19 10v2a7 7 0 0 1-14 0v-2`}),l(`line`,{x1:`12`,y1:`19`,x2:`12`,y2:`22`})]}),e),R=e=>F(u(c,{children:[l(`path`,{d:`M15 3h6v6`}),l(`path`,{d:`M10 14 21 3`}),l(`path`,{d:`M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6`})]}),e),z=e=>F(u(c,{children:[l(`rect`,{x:`3`,y:`4`,width:`18`,height:`18`,rx:`2`}),l(`line`,{x1:`16`,y1:`2`,x2:`16`,y2:`6`}),l(`line`,{x1:`8`,y1:`2`,x2:`8`,y2:`6`}),l(`line`,{x1:`3`,y1:`10`,x2:`21`,y2:`10`})]}),e),B=e=>F(u(c,{children:[l(`rect`,{x:`2`,y:`4`,width:`20`,height:`16`,rx:`2`}),l(`path`,{d:`m22 7-10 5L2 7`})]}),e),V=e=>F(l(`path`,{d:`M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.96.36 1.9.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.91.34 1.85.57 2.81.7A2 2 0 0 1 22 16.92Z`}),e),H=e=>F(u(c,{children:[l(`circle`,{cx:`12`,cy:`12`,r:`9`}),l(`path`,{d:`M8.5 14.5a4 4 0 0 0 7 0`}),l(`line`,{x1:`9`,y1:`9.5`,x2:`9.01`,y2:`9.5`}),l(`line`,{x1:`15`,y1:`9.5`,x2:`15.01`,y2:`9.5`})]}),e),ae=e=>F(u(c,{children:[l(`line`,{x1:`18`,y1:`6`,x2:`6`,y2:`18`}),l(`line`,{x1:`6`,y1:`6`,x2:`18`,y2:`18`})]}),e),oe=e=>F(u(c,{children:[l(`path`,{d:`M11 5 6 9H2v6h4l5 4z`}),l(`path`,{d:`M15.5 8.5a5 5 0 0 1 0 7`}),l(`path`,{d:`M19 5a9 9 0 0 1 0 14`})]}),e),se=e=>F(u(c,{children:[l(`path`,{d:`M11 5 6 9H2v6h4l5 4z`}),l(`line`,{x1:`22`,y1:`9`,x2:`16`,y2:`15`}),l(`line`,{x1:`16`,y1:`9`,x2:`22`,y2:`15`})]}),e),ce=e=>F(l(`path`,{d:`M20 6 9 17l-5-5`}),e),le=e=>F(u(c,{children:[l(`rect`,{x:`9`,y:`9`,width:`13`,height:`13`,rx:`2`}),l(`path`,{d:`M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1`})]}),e),ue=e=>F(u(c,{children:[l(`path`,{d:`M1 4v6h6`}),l(`path`,{d:`M3.51 15a9 9 0 1 0 2.13-9.36L1 10`})]}),e),de=e=>F(l(`rect`,{x:`6`,y:`6`,width:`12`,height:`12`,rx:`2`}),e),U=e=>F(l(`path`,{d:`M21.44 11.05 12.25 20.24a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48`}),e),fe=e=>F(u(c,{children:[l(`path`,{d:`M18.36 6.64a9 9 0 1 1-12.73 0`}),l(`line`,{x1:`12`,y1:`2`,x2:`12`,y2:`12`})]}),e),pe=e=>F(u(c,{children:[l(`circle`,{cx:`12`,cy:`12`,r:`9`}),l(`path`,{d:`M12 7v5l3 2`})]}),e),me=e=>F(u(c,{children:[l(`path`,{d:`M7 10v12`}),l(`path`,{d:`M15 5.88 14 10h5.83a2 2 0 0 1 1.92 2.56l-2.33 8A2 2 0 0 1 17.5 22H4a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2h2.76a2 2 0 0 0 1.79-1.11L12 2a3.13 3.13 0 0 1 3 3.88Z`})]}),e),he=e=>F(u(c,{children:[l(`path`,{d:`M17 14V2`}),l(`path`,{d:`M9 18.12 10 14H4.17a2 2 0 0 1-1.92-2.56l2.33-8A2 2 0 0 1 6.5 2H20a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2h-2.76a2 2 0 0 0-1.79 1.11L12 22a3.13 3.13 0 0 1-3-3.88Z`})]}),e),ge=e=>F(u(c,{children:[l(`line`,{x1:`12`,y1:`5`,x2:`12`,y2:`19`}),l(`path`,{d:`m19 12-7 7-7-7`})]}),e),_e=/(`[^`]+`)|(\*\*[^*]+\*\*)|(\[[^\]]+\]\(https?:\/\/[^\s)]+\))|(https?:\/\/[^\s)]+)/g,W=e=>{let t=[],n=0,r=0,i;for(_e.lastIndex=0;(i=_e.exec(e))!==null;){i.index>n&&t.push(e.slice(n,i.index));let a=i[0];if(a.startsWith("`"))t.push(l(`code`,{class:`cf-md-code`,children:a.slice(1,-1)},r++));else if(a.startsWith(`**`))t.push(l(`strong`,{children:a.slice(2,-2)},r++));else if(a.startsWith(`[`)){let e=/^\[([^\]]+)\]\((https?:\/\/[^\s)]+)\)$/.exec(a),n=e?e[1]:a,i=e?e[2]:`#`;t.push(l(`a`,{href:i,target:`_blank`,rel:`noopener noreferrer nofollow`,children:n},r++))}else t.push(l(`a`,{href:a,target:`_blank`,rel:`noopener noreferrer nofollow`,children:a},r++));n=i.index+a.length}return n<e.length&&t.push(e.slice(n)),t},ve=/^(```|#{1,6}\s|\s*[-*]\s|\s*\d+\.\s)/,ye=e=>{let t=e.replace(/\r\n/g,`
|
|
6
|
-
`).split(`
|
|
7
|
-
`),n=[],r=0,i=0;for(;i<t.length;){let e=t[i];if(e.trim().startsWith("```")){let e=[];for(i++;i<t.length&&!t[i].trim().startsWith("```");)e.push(t[i]),i++;i++,n.push(l(`pre`,{class:`cf-md-pre`,children:l(`code`,{children:e.join(`
|
|
8
|
-
`)})},r++));continue}if(e.trim()===``){i++;continue}let a=/^(#{1,6})\s+(.*)$/.exec(e);if(a){n.push(l(`div`,{class:`cf-md-h`,children:W(a[2])},r++)),i++;continue}if(/^\s*[-*]\s+/.test(e)){let e=[];for(;i<t.length&&/^\s*[-*]\s+/.test(t[i]);)e.push(l(`li`,{children:W(t[i].replace(/^\s*[-*]\s+/,``))},e.length)),i++;n.push(l(`ul`,{class:`cf-md-list`,children:e},r++));continue}if(/^\s*\d+\.\s+/.test(e)){let e=[];for(;i<t.length&&/^\s*\d+\.\s+/.test(t[i]);)e.push(l(`li`,{children:W(t[i].replace(/^\s*\d+\.\s+/,``))},e.length)),i++;n.push(l(`ol`,{class:`cf-md-list`,children:e},r++));continue}let o=[e];for(i++;i<t.length&&t[i].trim()!==``&&!ve.test(t[i]);)o.push(t[i]),i++;n.push(l(`p`,{children:W(o.join(` `))},r++))}return n},G=()=>{let e=o(null);return i(()=>{let t=requestAnimationFrame(()=>e.current?.scrollIntoView({block:`end`}));return()=>cancelAnimationFrame(t)},[]),e},K=e=>e.trim().split(/\s+/).slice(0,2).map(e=>e[0]?.toUpperCase()??``).join(``)||`๐ค`,be=({persona:e,small:t})=>{let n=t?`cf-msg__avatar`:`cf-header__avatar`;return e?.agentAvatarUrl?l(`span`,{class:n,children:l(`img`,{src:e.agentAvatarUrl,alt:``})}):l(`span`,{class:n,children:e?K(e.agentName):`ยท`})},q=()=>{let e=P();return u(`div`,{class:`cf-msg__bubble cf-typing`,"aria-label":e.assistantTyping,children:[l(`span`,{class:`cf-typing__dot`}),l(`span`,{class:`cf-typing__dot`}),l(`span`,{class:`cf-typing__dot`})]})},xe=({msg:e})=>{if(!e.sources||e.sources.length===0)return null;let t=new Set,n=[];for(let r of e.sources){let e=(r.url||r.title||``).toLowerCase();!e||t.has(e)||(t.add(e),n.push(r))}if(n.length===0)return null;let r=n.slice(0,3),i=n.length-r.length;return u(`div`,{class:`cf-sources`,children:[r.map((e,t)=>e.url?u(`a`,{class:`cf-source`,href:e.url,target:`_blank`,rel:`noopener noreferrer nofollow`,title:e.title||e.url,children:[l(R,{}),l(`span`,{children:e.title||e.url})]},t):u(`span`,{class:`cf-source`,title:e.title,children:[l(R,{}),l(`span`,{children:e.title})]},t)),i>0&&u(`span`,{class:`cf-source cf-source--more`,children:[`+`,i,` more`]})]})},Se=({replies:e,onPick:t})=>e&&e.length>0?l(`div`,{class:`cf-chips`,children:e.map((e,n)=>l(`button`,{type:`button`,class:`cf-chip`,onClick:()=>t(e),children:e},n))}):null,Ce={public_book_demo:{type:`book-demo`,label:`Book a demo`,Icon:z},public_submit_inquiry:{type:`inquiry`,label:`Leave a message`,Icon:B},public_request_callback:{type:`request-callback`,label:`Request a callback`,Icon:V},public_subscribe_newsletter:{type:`subscribe-newsletter`,label:`Subscribe`,Icon:B}},we=({field:e,value:t,onInput:n})=>{let r=e.placeholder??e.label,i={class:`cf-form__input`,placeholder:e.required?`${r} *`:r,value:t,"aria-label":e.label,onInput:e=>n(e.target.value)};return e.kind===`textarea`?l(`textarea`,{rows:2,...i}):l(`input`,{type:e.kind,...i})},Te=({spec:e,visitor:t,onSubmit:n,onCancel:r})=>{let i=P(),a=G(),[o,c]=s(()=>{let n={};for(let r of e.fields)r.identity&&t[r.identity]&&(n[r.key]=t[r.identity]);return n}),[d,f]=s(`idle`),[p,m]=s(``),h=e=>!!(e.identity&&t[e.identity]?.trim()),g=e.fields.filter(e=>!h(e)),_=g.every(e=>!e.required||(o[e.key]?.trim()??``)!==``),v=t.email||t.name||``;return d===`done`?u(`div`,{class:`cf-form cf-form--done`,children:[l(ce,{}),l(`span`,{children:p})]}):u(`div`,{class:`cf-form`,ref:a,children:[l(`div`,{class:`cf-form__title`,children:e.title}),g.length===0&&v&&u(`div`,{class:`cf-form__as`,children:[`as `,v]}),g.map(e=>l(we,{field:e,value:o[e.key]??``,onInput:t=>c(n=>({...n,[e.key]:t}))},e.key)),d===`error`&&l(`div`,{class:`cf-form__err`,children:i.formError}),u(`div`,{class:`cf-form__actions`,children:[r&&l(`button`,{type:`button`,class:`cf-form__cancel`,onClick:r,children:`Cancel`}),l(`button`,{type:`button`,class:`cf-form__submit`,disabled:!_||d===`submitting`,onClick:async()=>{if(!_||d===`submitting`)return;f(`submitting`);let t={},r={};for(let n of e.fields){let e=o[n.key]?.trim();e&&(t[n.key]=e,n.identity&&(r[n.identity]=e))}try{m((await n(t,r)).note||i.formThanks),f(`done`)}catch{f(`error`)}},children:d===`submitting`?i.sending:e.submit})]})]})},J=e=>String(e).padStart(2,`0`),Ee=()=>{let e=[];for(let t=9;t<=17;t++)e.push(`${J(t)}:00`),e.push(`${J(t)}:30`);return e},De=e=>{let t=new Date;return t.setHours(0,0,0,0),Array.from({length:e},(e,n)=>{let r=new Date(t);return r.setDate(t.getDate()+n),r})},Y=(e,t)=>{let[n,r]=t.split(`:`).map(Number),i=new Date(e.getFullYear(),e.getMonth(),e.getDate(),n??0,r??0);try{return new Intl.DateTimeFormat(void 0,{weekday:`short`,day:`numeric`,month:`short`,year:`numeric`,hour:`2-digit`,minute:`2-digit`,timeZoneName:`short`}).format(i)}catch{return`${e.toDateString()} ${t}`}},X=(e,t)=>{let[n,r]=t.split(`:`).map(Number);return new Date(e.getFullYear(),e.getMonth(),e.getDate(),n??0,r??0)},Oe=({visitor:e,onSubmit:t,onCancel:n,onDemoSlots:r,scheduler:o})=>{let d=P(),f=G(),p=a(()=>De(14),[]),m=a(()=>Ee(),[]),[h,g]=s(a(()=>{let e=Date.now();for(let t=0;t<p.length;t++)if(m.some(n=>X(p[t],n).getTime()>e))return t;return 0},[p,m])),[_,v]=s(null),[y,b]=s(e.name??``),[x,S]=s(e.email??``),[C,w]=s(`idle`),[T,E]=s(``),[D,O]=s(``),[k,A]=s(``),M=o?.connected&&o.mode===`link`,ee=async()=>{if(C===`submitting`||!e.email?.trim()&&!x.trim())return;w(`submitting`),O(``);let n={};x.trim()&&(n.email=x.trim()),y.trim()&&(n.name=y.trim());try{let e=await t({...x.trim()?{visitorEmail:x.trim()}:{},...y.trim()?{visitorName:y.trim()}:{}},n),r=e.booking?.schedulingLink||o?.bookingLink||``;if(!r){w(`error`);return}try{window.open(r,`_blank`,`noopener,noreferrer`)}catch{}A(r),E(e.note||d.bookingLinkOpened),w(`done`)}catch{w(`error`)}},[te,ne]=s(new Set),[F,re]=s([]),[ie,I]=s(0),[L,z]=s(!1);i(()=>{if(!r)return;let e=!0,t=new Date,n=new Date;return n.setDate(n.getDate()+15),r(t.toISOString(),n.toISOString()).then(t=>{e&&(ne(new Set(t.taken.map(e=>Date.parse(e)).filter(e=>!Number.isNaN(e)))),re(t.busy.map(e=>[Date.parse(e.start),Date.parse(e.end)]).filter(([e,t])=>!Number.isNaN(e)&&!Number.isNaN(t))))}).catch(()=>{}),()=>{e=!1}},[r,ie]);let B=!!e.email?.trim(),V=!!_&&(B||x.trim()!==``),H=e.email||e.name||``,ae=e=>te.has(X(p[h],e).getTime()),oe=e=>X(p[h],e).getTime()<=Date.now(),se=e=>{let t=X(p[h],e).getTime(),n=t+18e5;return F.some(([e,r])=>t<r&&n>e)},le=async()=>{if(!V||C===`submitting`||!_)return;w(`submitting`),z(!1),O(``);let e=X(p[h],_),n=Y(p[h],_),r={};x.trim()&&(r.email=x.trim()),y.trim()&&(r.name=y.trim());try{let i=await t({preferredAt:n,slotAt:e.toISOString(),...x.trim()?{visitorEmail:x.trim()}:{},...y.trim()?{visitorName:y.trim()}:{}},r);i.booking?.confirmed?(E(i.note||N(d.bookingConfirmed,{when:n})),A(i.booking.meetingUrl||i.booking.eventLink||``)):E(i.note||N(d.bookingRequested,{when:n})),w(`done`)}catch(t){if(t?.status===409)ne(t=>new Set(t).add(e.getTime())),v(null),z(!0),I(e=>e+1),w(`idle`);else{let e=t?.message;O(e&&e.length<120?e:``),w(`error`)}}};return C===`done`?u(`div`,{class:`cf-form cf-form--done`,children:[l(ce,{}),l(`span`,{children:T}),k&&u(`a`,{class:`cf-booking__link`,href:k,target:`_blank`,rel:`noopener noreferrer`,children:[M?d.bookingOpenScheduler:d.bookingMeetingLink,` `,l(R,{})]})]}):M?u(`div`,{class:`cf-form cf-booking`,ref:f,children:[l(`div`,{class:`cf-form__title`,children:j[`book-demo`].title}),l(`div`,{class:`cf-booking__hint`,children:N(d.bookingViaProvider,{provider:o?.label??`the scheduler`})}),B?H?u(`div`,{class:`cf-form__as`,children:[`as `,H]}):null:u(c,{children:[l(`input`,{class:`cf-form__input`,type:`text`,placeholder:d.handoffName,value:y,"aria-label":d.handoffName,onInput:e=>b(e.target.value)}),l(`input`,{class:`cf-form__input`,type:`email`,placeholder:`${d.handoffEmail} *`,value:x,"aria-label":d.handoffEmail,onInput:e=>S(e.target.value)})]}),C===`error`&&l(`div`,{class:`cf-form__err`,children:D||d.formError}),u(`div`,{class:`cf-form__actions`,children:[n&&l(`button`,{type:`button`,class:`cf-form__cancel`,onClick:n,children:d.cancel}),l(`button`,{type:`button`,class:`cf-form__submit`,disabled:C===`submitting`||!B&&x.trim()===``,onClick:ee,children:C===`submitting`?d.sending:d.bookingOpenScheduler})]})]}):u(`div`,{class:`cf-form cf-booking`,ref:f,children:[l(`div`,{class:`cf-form__title`,children:j[`book-demo`].title}),u(`div`,{class:`cf-booking__hint`,children:[d.bookingPickTime,` ยท `,l(`span`,{class:`cf-booking__dur`,children:d.bookingDuration})]}),l(`div`,{class:`cf-booking__dates`,role:`tablist`,"aria-label":`Pick a day`,children:p.map((e,t)=>u(`button`,{type:`button`,role:`tab`,"aria-selected":t===h,class:`cf-booking__date ${t===h?`is-selected`:``}`,onClick:()=>{g(t),v(null)},children:[l(`span`,{class:`cf-booking__dow`,children:e.toLocaleDateString(void 0,{weekday:`short`})}),l(`span`,{class:`cf-booking__dom`,children:e.getDate()})]},t))}),l(`div`,{class:`cf-booking__slots`,role:`listbox`,"aria-label":`Pick a time`,children:m.map(e=>{let t=oe(e),n=se(e),r=ae(e),i=r||t||n;return l(`button`,{type:`button`,role:`option`,"aria-selected":_===e,disabled:i,title:t?`Earlier today`:n?`Busy on the calendar`:r?`Already booked`:void 0,class:`cf-booking__slot ${_===e?`is-selected`:``} ${i?`is-taken`:``}`,onClick:()=>v(e),children:e},e)})}),L&&l(`div`,{class:`cf-form__err`,children:d.bookingSlotTaken}),B?H?u(`div`,{class:`cf-form__as`,children:[`as `,H]}):null:u(c,{children:[l(`input`,{class:`cf-form__input`,type:`text`,placeholder:d.handoffName,value:y,"aria-label":d.handoffName,onInput:e=>b(e.target.value)}),l(`input`,{class:`cf-form__input`,type:`email`,placeholder:`${d.handoffEmail} *`,value:x,"aria-label":d.handoffEmail,onInput:e=>S(e.target.value)})]}),C===`error`&&l(`div`,{class:`cf-form__err`,children:D||d.formError}),u(`div`,{class:`cf-form__actions`,children:[n&&l(`button`,{type:`button`,class:`cf-form__cancel`,onClick:n,children:d.cancel}),l(`button`,{type:`button`,class:`cf-form__submit`,disabled:!V||C===`submitting`,onClick:le,children:C===`submitting`?d.sending:j[`book-demo`].submit})]})]})},ke=({actions:e,visitor:t,onSubmitForm:n,onDemoSlots:r,scheduler:i,exclude:a=[]})=>{let[o,c]=s(null),d=(e??[]).map(e=>Ce[e]).filter(e=>!!e&&!a.includes(e.type));return d.length===0?null:o===`book-demo`?l(Oe,{visitor:t,onCancel:()=>c(null),onSubmit:(e,t)=>n(`book-demo`,e,t),onDemoSlots:r,scheduler:i}):o?l(Te,{spec:j[o],visitor:t,onCancel:()=>c(null),onSubmit:(e,t)=>n(o,e,t)}):l(`div`,{class:`cf-actions`,children:d.map(({type:e,label:t,Icon:n})=>u(`button`,{type:`button`,class:`cf-action`,onClick:()=>c(e),children:[l(n,{}),t]},e))})},Ae=({hasEmail:e,visitor:t,question:n,onSubmitForm:r})=>{let i=P(),[a,o]=s(!1),[c,d]=s(!1),[f,p]=s(t.name??``),[m,h]=s(t.email??``);if(e)return null;if(a){let e=t.email||m;return u(`div`,{class:`cf-handoff cf-handoff--done`,children:[l(ce,{}),l(`span`,{children:N(i.handoffShared,{email:e})})]})}let g=async()=>{if(!(!m.trim()||c)){d(!0);try{await r(`inquiry`,{visitorEmail:m.trim(),...f.trim()?{visitorName:f.trim()}:{},message:n||`I had a question the assistant couldnโt answer.`,subject:`Help request from chat`},{email:m.trim(),name:f.trim()||void 0}),o(!0)}catch{d(!1)}}};return u(`div`,{class:`cf-handoff`,children:[l(`div`,{class:`cf-handoff__title`,children:i.handoffTitle}),l(`input`,{class:`cf-form__input`,type:`text`,placeholder:i.handoffName,value:f,"aria-label":i.handoffName,onInput:e=>p(e.target.value)}),l(`input`,{class:`cf-form__input`,type:`email`,placeholder:`${i.handoffEmail} *`,value:m,"aria-label":i.handoffEmail,onInput:e=>h(e.target.value)}),l(`button`,{type:`button`,class:`cf-form__submit`,disabled:!m.trim()||c,onClick:g,children:c?i.sending:i.handoffNotify})]})},je=({text:e})=>{let t=P(),[n,r]=s(!1);return u(`button`,{type:`button`,class:`cf-tool`,onClick:async()=>{try{await navigator.clipboard.writeText(e),r(!0),setTimeout(()=>r(!1),1500)}catch{}},"aria-label":t.copy,children:[l(n?ce:le,{}),n?t.copied:t.copy]})},Me=({items:e,onPick:t})=>e.length===0?null:l(`div`,{class:`cf-starters`,children:e.map((e,n)=>l(`button`,{type:`button`,class:`cf-starter`,onClick:()=>t(e),children:e},n))}),Ne=({msg:e,onRate:t})=>{let n=P(),[r,i]=s(!1),[a,o]=s(``),c=e.feedback,d=()=>{t(e.id,`up`),i(!1)},f=()=>{t(e.id,`down`),i(!0)},p=()=>{t(e.id,`down`,a.trim()),i(!1)};return u(`div`,{class:`cf-feedback`,children:[u(`div`,{class:`cf-feedback__row`,children:[l(`button`,{type:`button`,class:`cf-feedback__btn ${c===`up`?`is-active`:``}`,"aria-label":n.feedbackHelpful,"aria-pressed":c===`up`,onClick:d,children:l(me,{})}),l(`button`,{type:`button`,class:`cf-feedback__btn ${c===`down`?`is-active`:``}`,"aria-label":n.feedbackNotHelpful,"aria-pressed":c===`down`,onClick:f,children:l(he,{})}),c&&!r&&l(`span`,{class:`cf-feedback__thanks`,children:n.feedbackThanks})]}),r&&c===`down`&&u(`div`,{class:`cf-feedback__comment`,children:[l(`textarea`,{class:`cf-feedback__input`,rows:2,placeholder:n.feedbackCommentPlaceholder,value:a,onInput:e=>o(e.target.value)}),l(`button`,{type:`button`,class:`cf-feedback__send`,onClick:p,children:n.feedbackSend})]})]})},Pe=({msg:e,persona:t,isLast:n,visitor:r,hasEmail:i,lastQuestion:a,showActions:o,onPickReply:s,onSubmitForm:d,onDemoSlots:f,onRetry:p,ratable:m,onRate:h})=>{let g=P(),_=e.role===`user`,v=e.requestedContactFields?.includes(`email`)===!0,y=n&&!_&&!!(e.handoffOffered||v),b=y&&!i?[`inquiry`]:[],x=!e.pending&&!e.streaming;return u(`div`,{class:`cf-msg cf-msg--${_?`user`:`agent`}`,children:[!_&&l(be,{persona:t,small:!0}),u(`div`,{class:`cf-msg__col`,children:[e.pending&&e.content===``?l(q,{}):e.imageUrl?u(`div`,{class:`cf-msg__bubble cf-msg__bubble--media`,children:[l(`img`,{class:`cf-msg__media`,src:e.imageUrl,alt:`GIF`}),e.content&&l(`span`,{class:`cf-msg__caption`,children:e.content})]}):u(`div`,{class:`cf-msg__bubble`,children:[_?e.content:ye(e.content),e.streaming&&l(`span`,{class:`cf-caret`,"aria-hidden":`true`})]}),_&&e.attachmentName&&u(`div`,{class:`cf-attach-chip`,title:e.attachmentName,children:[l(U,{}),l(`span`,{children:e.attachmentName})]}),!_&&u(c,{children:[x&&(e.error||e.content)&&l(`div`,{class:`cf-msg__tools`,children:e.error?u(`button`,{type:`button`,class:`cf-tool`,onClick:()=>p(e.id,e.retryText??``),children:[l(ue,{}),g.retry]}):l(je,{text:e.content})}),x&&m&&!e.error&&e.content&&l(Ne,{msg:e,onRate:h}),l(xe,{msg:e}),n&&l(Se,{replies:e.suggestedReplies,onPick:s}),y&&l(Ae,{hasEmail:i,visitor:r,question:a,onSubmitForm:d}),o&&l(ke,{actions:e.availableActions,visitor:r,onSubmitForm:d,onDemoSlots:f,scheduler:t?.scheduler,exclude:b})]})]})]})},Fe=e=>new Promise((t,n)=>{let r=new FileReader;r.onload=()=>t(String(r.result).split(`,`)[1]??``),r.onerror=n,r.readAsDataURL(e)}),Ie=({onPick:e})=>l(`div`,{class:`cf-picker cf-emoji`,children:A.map(t=>u(`div`,{class:`cf-emoji__group`,children:[l(`div`,{class:`cf-emoji__label`,children:t.name}),l(`div`,{class:`cf-emoji__grid`,children:t.emojis.map((t,n)=>l(`button`,{type:`button`,class:`cf-emoji__btn`,onClick:()=>e(t),"aria-label":t,children:t},n))})]},t.name))}),Le=({onSearch:e,onPick:t})=>{let n=P(),[r,a]=s(``),[o,c]=s([]),[d,f]=s(!0);return i(()=>{let t=!0;f(!0);let n=setTimeout(()=>{e(r).then(e=>t&&(c(e),f(!1))).catch(()=>t&&(c([]),f(!1)))},300);return()=>{t=!1,clearTimeout(n)}},[r,e]),u(`div`,{class:`cf-picker cf-gif`,children:[l(`input`,{class:`cf-gif__search`,placeholder:n.searchGifs,value:r,"aria-label":n.searchGifs,onInput:e=>a(e.target.value)}),l(`div`,{class:`cf-gif__grid`,children:d?l(`div`,{class:`cf-gif__hint`,children:n.searchingGifs}):o.length===0?l(`div`,{class:`cf-gif__hint`,children:n.noGifs}):o.map(e=>l(`button`,{type:`button`,class:`cf-gif__item`,onClick:()=>t(e.url),"aria-label":e.alt,children:l(`img`,{src:e.preview,alt:e.alt,loading:`lazy`})},e.id))}),l(`div`,{class:`cf-gif__powered`,children:`via Tenor`})]})},Re=({onSend:e,onSendGif:t,disabled:n,allowVoice:r,onTranscribe:a,gifEnabled:d,onSearchGifs:f,allowAttach:p,onExtract:m})=>{let h=P(),[g,_]=s(``),[v,y]=s(!1),[b,x]=s(`none`),[S,C]=s(null),[w,T]=s(!1),[E,D]=s(``),O=o(null),k=o(null),A=o(null),j=o(null),M=o([]);i(()=>{let e=O.current;e&&(e.style.height=`auto`,e.style.height=`${Math.min(e.scrollHeight,110)}px`)},[g]),i(()=>{if(b===`none`)return;let e=e=>{k.current&&!e.composedPath().includes(k.current)&&x(`none`)};return document.addEventListener(`mousedown`,e),()=>document.removeEventListener(`mousedown`,e)},[b]);let N=e=>x(t=>t===e?`none`:e),ee=e=>{let t=O.current;if(!t){_(t=>t+e);return}let n=t.selectionStart??g.length,r=t.selectionEnd??g.length;_(g.slice(0,n)+e+g.slice(r)),requestAnimationFrame(()=>{t.focus();let r=n+e.length;t.setSelectionRange(r,r)})},te=e=>{x(`none`),t(e)},ne=async e=>{let t=e.target,n=t.files?.[0];if(t.value=``,n){if(D(``),n.size>8388608){D(h.attachTooLarge);return}T(!0);try{let e=await m(await Fe(n),n.type||`application/octet-stream`,n.name);if(!e){D(h.attachFailed);return}C({name:n.name,text:e})}catch{D(h.attachFailed)}finally{T(!1)}}},F=(!!g.trim()||!!S)&&!n&&!w,re=()=>{F&&(e(g,S?{attachmentName:S.name,attachmentText:S.text}:void 0),_(``),C(null),D(``))},ie=e=>{e.key===`Enter`&&!e.shiftKey?(e.preventDefault(),re()):e.key===`Escape`&&b!==`none`&&(e.preventDefault(),e.stopPropagation(),x(`none`))},R=async()=>{if(v){j.current?.stop();return}try{let e=await navigator.mediaDevices.getUserMedia({audio:!0}),t=new MediaRecorder(e);M.current=[],t.ondataavailable=e=>e.data.size>0&&M.current.push(e.data),t.onstop=async()=>{e.getTracks().forEach(e=>e.stop()),y(!1);let n=new Blob(M.current,{type:t.mimeType||`audio/webm`});try{let e=await a(await Fe(n),n.type);e&&_(t=>t?`${t} ${e}`:e)}catch{}},j.current=t,t.start(),y(!0)}catch{let e=await a(``,`audio/webm`).catch(()=>``);e&&_(t=>t?`${t} ${e}`:e)}};return u(`div`,{class:`cf-composer`,ref:k,children:[b===`emoji`&&l(Ie,{onPick:ee}),b===`gif`&&l(Le,{onSearch:f,onPick:te}),(S||w||E)&&l(`div`,{class:`cf-attach-row`,children:w?l(`span`,{class:`cf-attach-status`,children:h.attaching}):E?l(`span`,{class:`cf-attach-status cf-attach-status--err`,children:E}):S&&u(`span`,{class:`cf-attach-chip`,title:S.name,children:[l(U,{}),l(`span`,{children:S.name}),l(`button`,{type:`button`,class:`cf-attach-x`,"aria-label":`Remove attachment`,onClick:()=>C(null),children:l(ae,{})})]})}),u(`div`,{class:`cf-composer__field`,children:[l(`button`,{type:`button`,class:`cf-iconbtn ${b===`emoji`?`is-active`:``}`,"aria-label":h.emoji,"aria-pressed":b===`emoji`,onClick:()=>N(`emoji`),children:l(b===`emoji`?ae:H,{})}),d&&l(`button`,{type:`button`,class:`cf-iconbtn cf-gifbtn ${b===`gif`?`is-active`:``}`,"aria-label":h.gifs,"aria-pressed":b===`gif`,onClick:()=>N(`gif`),children:l(`span`,{class:`cf-gif-label`,children:`GIF`})}),p&&u(c,{children:[l(`input`,{ref:A,type:`file`,class:`cf-file-input`,accept:`image/png,image/jpeg,image/webp,image/gif,application/pdf`,onChange:ne,tabIndex:-1,"aria-hidden":`true`}),l(`button`,{type:`button`,class:`cf-iconbtn`,"aria-label":h.attachFile,disabled:w,onClick:()=>A.current?.click(),children:l(U,{})})]}),l(`textarea`,{ref:O,class:`cf-textarea`,rows:1,placeholder:h.composerPlaceholder,value:g,"aria-label":h.composerPlaceholder,disabled:n,onInput:e=>_(e.target.value),onKeyDown:ie}),r&&l(`button`,{type:`button`,class:`cf-iconbtn cf-mic ${v?`is-recording`:``}`,"aria-label":v?h.stopRecording:h.recordVoice,"aria-pressed":v,onClick:R,children:l(L,{})}),l(`button`,{type:`button`,class:`cf-send`,"aria-label":h.send,disabled:!F,onClick:re,children:l(I,{})})]})]})};let ze=!0,Z=null;const Be=e=>{ze=e},Ve=()=>{let e=typeof window<`u`?window.AudioContext??window.webkitAudioContext:void 0;if(!e)return null;if(!Z)try{Z=new e}catch{return null}return Z.state===`suspended`&&Z.resume(),Z},He=(e,t,n,r,i,a)=>{let o=e.createOscillator(),s=e.createGain();o.type=i,o.frequency.setValueAtTime(t,n),o.connect(s),s.connect(e.destination),s.gain.setValueAtTime(1e-4,n),s.gain.exponentialRampToValueAtTime(a,n+.012),s.gain.exponentialRampToValueAtTime(1e-4,n+r),o.start(n),o.stop(n+r+.03)},Ue=e=>{if(!ze)return;let t=Ve();if(!t)return;let n=t.currentTime;try{e===`open`?(He(t,523,n,.12,`sine`,.05),He(t,784,n+.08,.16,`sine`,.05)):e===`send`?He(t,660,n,.08,`triangle`,.04):e===`receive`&&(He(t,880,n,.1,`sine`,.045),He(t,1175,n+.09,.14,`sine`,.045))}catch{}},Q=()=>typeof crypto<`u`&&crypto.randomUUID?crypto.randomUUID():`${Date.now()}-${Math.round(Math.random()*1e9)}`,$=e=>{try{return e===`none`?null:e===`session`?sessionStorage:localStorage}catch{return null}},We=e=>`centrinfo:session:${e.slice(0,12)}`,Ge=e=>`centrinfo:visitor:${e.slice(0,12)}`,Ke=(e,t)=>`centrinfo:chat:${e.slice(0,12)}:${t}`,qe=e=>`centrinfo:history:${e.slice(0,12)}`,Je=720*60*60*1e3,Ye=(e,t)=>{try{return JSON.parse(e?.getItem(Ge(t))||`{}`)}catch{return{}}},Xe=(e,t)=>{if(!e)return Q();try{let n=We(t),r=e.getItem(n);if(r)return r;let i=Q();return e.setItem(n,i),i}catch{return Q()}},Ze=(e,t,n)=>{if(!e)return{};try{let r=e.getItem(Ke(t,n));return r?JSON.parse(r):{}}catch{return{}}},Qe=(e,t,n)=>{let{ts:r,messages:i}=Ze(e,t,n);return!Array.isArray(i)||typeof r==`number`&&Date.now()-r>Je?[]:i},$e=(e,t,n)=>{let{ts:r,messages:i,ended:a}=Ze(e,t,n);return!Array.isArray(i)||i.length===0||typeof r==`number`&&Date.now()-r>Je?!1:a===!0||typeof r==`number`&&Date.now()-r>864e5},et=(e,t,n,r,i)=>{if(e)try{let a=r.filter(e=>!e.pending).slice(-50);if(a.length===0)return;e.setItem(Ke(t,n),JSON.stringify({ts:Date.now(),messages:a,ended:i}))}catch{}},tt=(e,t)=>{if(!e)return[];try{let n=e.getItem(qe(t)),r=n?JSON.parse(n):[];return Array.isArray(r)?r:[]}catch{return[]}},nt=(e,t,n)=>{if(e)try{e.setItem(qe(t),JSON.stringify(n.slice(0,20)))}catch{}},rt=(e,t)=>{if(e)try{let n=`centrinfo:chat:${t.slice(0,12)}:`,r=new Set([We(t),Ge(t),qe(t)]),i=[];for(let t=0;t<e.length;t++){let a=e.key(t);a&&(r.has(a)||a.startsWith(n))&&i.push(a)}i.forEach(t=>e.removeItem(t))}catch{}},it=e=>{let t=(e.find(e=>e.role===`user`&&e.content.trim())?.content||e.find(e=>e.content.trim())?.content||``).trim().replace(/\s+/g,` `);return t.length>60?t.slice(0,60)+`โฆ`:t||`Conversation`},at=(e,t)=>{let r=o($(t.persistence)).current,a=o(Xe(r,t.token)),c=o(null),[l,u]=s(null),[d,f]=s(()=>Qe(r,t.token,a.current)),[p,m]=s(!1),[h,g]=s(()=>$e(r,t.token,a.current)),[_,v]=s(()=>Ye(r,t.token)),[y,b]=s(()=>tt(r,t.token)),[x,S]=s(null),[C,w]=s([]),T=o(_);i(()=>{T.current=_},[_]);let E=n(()=>{c.current?.abort(),rt(r,t.token);let e=Q();a.current=e;try{r?.setItem(We(t.token),e)}catch{}S(null),w([]),g(!1),b([]),v({}),f(l?[{id:Q(),role:`assistant`,content:l.greeting,availableActions:l.availableActions}]:[])},[r,t.token,l]),D=n(e=>{try{r?.setItem(Ge(t.token),JSON.stringify(e))}catch{}},[r,t.token]),O=n(t=>{let n=(t.email??``).trim().toLowerCase(),r=(T.current.email??``).trim().toLowerCase();n&&r&&n!==r&&E();let i={};t.email?.trim()&&(i.email=t.email.trim()),t.phone?.trim()&&(i.phone=t.phone.trim());let o=[t.firstName,t.lastName].filter(e=>!!e?.trim()).join(` `).trim()||t.name?.trim()||``;o&&(i.name=o),Object.keys(i).length>0&&v(e=>{let t={...i,...e};return D(t),t}),e.identify(a.current,t).catch(()=>{})},[e,D,E]);i(()=>{let n=!0;return e.bootstrap().then(e=>{n&&(u(e),f(t=>t.length>0?t:[{id:Q(),role:`assistant`,content:e.greeting,availableActions:e.availableActions}]))}),t.user&&O(t.user),()=>{n=!1}},[]),i(()=>{et(r,t.token,a.current,d,h)},[d,h,r,t.token]),i(()=>{d.some(e=>e.role===`user`)&&b(e=>{let n=a.current,i=[{sessionId:n,ts:Date.now(),title:it(d),ended:h},...e.filter(e=>e.sessionId!==n)];return nt(r,t.token,i),i.slice(0,20)})},[d,h,r,t.token]);let k=n((e,t)=>{f(n=>n.map(n=>n.id===e?{...n,...t}:n))},[]),A=n((n,r)=>{m(!0);let i=new AbortController;c.current=i,e.stream(n,a.current,{signal:i.signal,onChunk:e=>f(t=>t.map(t=>t.id===r?{...t,content:t.content+e,pending:!1,streaming:!0}:t))}).then(e=>{f(n=>n.map(n=>n.id===r?{...n,content:e.answer||n.content||t.strings.emptyReply,pending:!1,streaming:!1,error:!1,retryText:void 0,sources:e.sources,suggestedReplies:e.suggestedReplies,availableActions:e.availableActions,handoffOffered:e.handoffOffered,requestedContactFields:e.requestedContactFields}:n)),Ue(`receive`),t.onMessage?.({role:`assistant`,content:e.answer}),e.handoffOffered&&t.onHandoff?.(),e.conversationEnded&&g(!0)}).catch(e=>{if(i.signal.aborted){k(r,{pending:!1,streaming:!1});return}k(r,{content:e?.status===429?t.strings.errorRateLimit:t.strings.errorGeneric,pending:!1,streaming:!1,error:!0,retryText:n})}).finally(()=>{m(!1),c.current=null})},[e,t,k]),j=n((e,n={})=>{let r=e.trim(),{imageUrl:i,attachmentName:a,attachmentText:o}=n;if(!r&&!i&&!o||p||h)return;let s=r;o?s=`${r}\n\n[Attached file${a?` "${a}"`:``}]:\n${o}`.trim():!s&&i&&(s=i);let c={id:Q(),role:`user`,content:r,imageUrl:i,attachmentName:a},l=Q();f(e=>[...e,c,{id:l,role:`assistant`,content:``,pending:!0}]),Ue(`send`),t.onMessage?.({role:`user`,content:s}),A(s,l)},[p,h,t,A]),M=n(()=>c.current?.abort(),[]),N=n((e,t)=>{p||h||!t||(k(e,{content:``,pending:!0,streaming:!1,error:!1}),Ue(`send`),A(t,e))},[p,h,k,A]),ee=n((t,n,r)=>{k(t,{feedback:n});let i=d.findIndex(e=>e.id===t),o=i>=0?d[i]?.content:void 0,s;for(let e=i-1;e>=0;e--)if(d[e]?.role===`user`){s=d[e]?.content;break}e.sendFeedback({sessionId:a.current,messageId:t,rating:n,comment:r,question:s,answer:o}).catch(()=>{})},[e,k,d]),te=n(async(n,r,i={})=>{t.onAction?.(n);let o=await e.action(n,{sessionId:a.current,...r}),s={};return i.name?.trim()&&(s.name=i.name.trim()),i.email?.trim()&&(s.email=i.email.trim()),i.phone?.trim()&&(s.phone=i.phone.trim()),Object.keys(s).length>0&&(v(e=>{let t={...e,...s};return D(t),t}),s.email&&n!==`contact`&&e.action(`contact`,{sessionId:a.current,...s}).catch(()=>{})),Ue(`receive`),o},[e,t,D]),ne=n(e=>{let t=e.trim();t&&f(e=>e.some(e=>e.role===`assistant`&&e.content===t)?e:[...e,{id:Q(),role:`assistant`,content:t}])},[]),P=n((t,n)=>{e.sendFeedback({sessionId:a.current,messageId:`__csat__`,rating:t,comment:n}).catch(()=>{})},[e]),F=n((t,n)=>e.transcribe(t,n),[e]),re=n((t,n,r)=>e.extract(t,n,r),[e]),ie=n(t=>e.searchGifs(t),[e]),I=n((t,n)=>e.demoSlots(t,n),[e]),L=n(e=>j(``,{imageUrl:e}),[j]),R=t.demo||!!t.gifApiKey,z=n(()=>{c.current?.abort(),g(!0),e.endConversation(a.current).catch(()=>{})},[e]),B=n(()=>{c.current?.abort();let e=Q();a.current=e;try{r?.setItem(We(t.token),e)}catch{}S(null),w([]),g(!1),f(l?[{id:Q(),role:`assistant`,content:l.greeting,availableActions:l.availableActions}]:[])},[r,t.token,l]),V=n(e=>{if(e===a.current){S(null);return}w(Qe(r,t.token,e)),S(e)},[r,t.token]),H=n(()=>{S(null),w([])},[]);return{persona:l,messages:d,sending:p,visitor:_,starters:t.starters.length>0?t.starters:l?.starterQuestions??[],hasEmail:!!_.email,send:j,sendGif:L,stop:M,retry:N,rateMessage:ee,injectAssistant:ne,submitCsat:P,submitForm:te,transcribe:F,extract:re,searchGifs:ie,demoSlots:I,gifEnabled:R,identify:O,ended:h,endConversation:z,startNew:B,history:y,viewingSessionId:x,viewMessages:C,openConversation:V,closeHistoryView:H,shutdown:E}},ot=e=>{let[t,n]=s(`light`);return i(()=>{if(e!==`auto`||typeof matchMedia>`u`)return;let t=matchMedia(`(prefers-color-scheme: dark)`),r=()=>n(t.matches?`dark`:`light`);return r(),t.addEventListener(`change`,r),()=>t.removeEventListener(`change`,r)},[e]),e===`auto`?t:e},st=({transport:e,config:t,bindControls:r})=>{let a=t.strings,{persona:c,messages:d,sending:f,visitor:p,hasEmail:m,starters:h,send:g,sendGif:_,stop:v,retry:y,rateMessage:b,injectAssistant:x,submitCsat:S,submitForm:C,transcribe:w,extract:T,searchGifs:E,demoSlots:D,gifEnabled:O,identify:k,ended:A,endConversation:j,startNew:M,history:N,viewingSessionId:ee,viewMessages:te,openConversation:P,closeHistoryView:F,shutdown:I}=at(e,t),[L,R]=s(t.openByDefault),[z,B]=s(0),[V,H]=s(()=>{try{return localStorage.getItem(`centrinfo:muted`)===`1`}catch{return!1}}),ae=ot(t.theme);i(()=>{Be(t.sound&&!V)},[t.sound,V]);let ce=n(()=>{H(e=>{let t=!e;try{localStorage.setItem(`centrinfo:muted`,t?`1`:`0`)}catch{}return t})},[]),le=o(null),ue=o(null),U=o(null),_e=o(0),[W,ve]=s(!0),[ye,G]=s(!1),[K,q]=s(!1),xe=o(null),[Se,Ce]=s(!1),[we,Te]=s(!1),J=!!ee,Ee=J?te:d,De=n(()=>{R(!0),B(0),Ue(`open`),t.onOpen?.(),t.onShow?.()},[t]),Y=n(()=>{R(!1),t.onClose?.(),t.onHide?.(),ue.current?.focus()},[t]),X=n(()=>L?Y():De(),[L,De,Y]),Oe=n(()=>q(!0),[]),ke=n(()=>{j(),q(!1)},[j]),Ae=n(()=>{M(),G(!1),ve(!0)},[M]);i(()=>{K&&xe.current?.focus()},[K]),i(()=>{r({open:De,close:Y,toggle:X,identify:k,startNew:M,endConversation:j,shutdown:I})},[r,De,Y,X,k,M,j,I]),i(()=>{let e=d.filter(e=>e.role===`assistant`&&!e.pending).length;if(L){_e.current=e;return}e>_e.current&&B(e-_e.current)},[d,L]),i(()=>{t.onUnreadChange?.(z)},[z,t]),i(()=>{let e=t.sessionDurationMinutes;if(!e||e<=0)return;let n=setTimeout(()=>I(),e*60*1e3);return()=>clearTimeout(n)},[t.sessionDurationMinutes,d,L,I]),i(()=>{let e=t.customLauncherSelector;if(!e||typeof document>`u`)return;let n=[];try{n=Array.from(document.querySelectorAll(e))}catch{return}let r=e=>{e.preventDefault(),X()};return n.forEach(e=>e.addEventListener(`click`,r)),()=>n.forEach(e=>e.removeEventListener(`click`,r))},[t.customLauncherSelector,X]);let je=o(!1);i(()=>{let e=t.proactiveMessage?.trim();if(!e||je.current)return;let n=t.proactiveOnPaths??[],r=typeof location<`u`?location.pathname:``;if(n.length>0&&!n.some(e=>r.includes(e)))return;let i=`centrinfo:proactive:${t.token.slice(0,12)}`;try{if(sessionStorage.getItem(i)===`1`)return}catch{}let a=setTimeout(()=>{if(!(L||A||d.some(e=>e.role===`user`))){je.current=!0;try{sessionStorage.setItem(i,`1`)}catch{}x(e),De()}},Math.max(0,t.proactiveDelaySeconds)*1e3);return()=>clearTimeout(a)},[t.proactiveMessage]),i(()=>{let e=U.current;!L||!e||(d[d.length-1]?.role===`user`||W?(e.scrollTop=e.scrollHeight,G(!1)):G(!0))},[d,L,f,W]);let Ne=n(()=>{let e=U.current;if(!e)return;let t=e.scrollHeight-e.scrollTop-e.clientHeight<80;ve(t),t&&G(!1)},[]),Fe=n(()=>{let e=U.current;e&&(e.scrollTop=e.scrollHeight),G(!1),ve(!0)},[]),[Ie,Le]=s(``),ze=o(!1);i(()=>{if(ze.current&&!f){let e=[...d].reverse().find(e=>e.role===`assistant`&&!e.streaming&&!e.pending&&e.content);e&&Le(e.content)}ze.current=f},[f,d]),i(()=>{if(!L)return;let e=le.current;K||e?.querySelector(`.cf-textarea`)?.focus();let t=t=>{if(t.key===`Escape`){if(t.preventDefault(),K){q(!1);return}Y();return}if(t.key!==`Tab`||!e)return;let n=e.querySelectorAll(`button, [href], textarea, input, [tabindex]:not([tabindex="-1"])`),r=Array.from(n).filter(e=>!e.hasAttribute(`disabled`));if(r.length===0)return;let i=r[0],a=r[r.length-1],o=e.getRootNode()instanceof ShadowRoot?e.getRootNode().activeElement:document.activeElement;t.shiftKey&&o===i?(t.preventDefault(),a.focus()):!t.shiftKey&&o===a&&(t.preventDefault(),i.focus())};return e?.addEventListener(`keydown`,t),()=>e?.removeEventListener(`keydown`,t)},[L,Y,K]),i(()=>{let e=le.current;e&&(L?e.removeAttribute(`inert`):e.setAttribute(`inert`,``))},[L]);let Z=t.accentColor??c?.accentColor,Ve={zIndex:t.zIndex,"--cf-h-pad":`${t.horizontalPadding}px`,"--cf-v-pad":`${t.verticalPadding}px`,...Z?{"--cf-accent":Z,"--cf-accent-2":`color-mix(in oklab, ${Z} 76%, #14141f)`}:{}},He=e=>g(e),Q=[...d].reverse().find(e=>e.role===`user`&&e.content.trim())?.content??``,$=d.some(e=>e.role===`user`),We=!$&&!!(c?.agentDescription||c?.welcomeSubtitle);return l(ne,{value:a,children:u(`div`,{class:`cf-root`,"data-theme":ae,"data-align":t.alignment,style:Ve,children:[u(`div`,{ref:le,class:`cf-panel ${L?`is-open`:``}`,role:`dialog`,"aria-modal":`false`,"aria-label":`Chat with ${c?.agentName??`us`}`,"aria-hidden":!L,children:[u(`div`,{class:`cf-header`,children:[l(be,{persona:c}),u(`div`,{class:`cf-header__meta`,children:[l(`div`,{class:`cf-header__name`,children:c?.agentName??`Chat`}),l(`div`,{class:`cf-header__status ${c?.offline?`cf-header__status--offline`:``}`,children:l(`span`,{class:`cf-header__status-text`,children:c?.offline?a.statusOffline:a.statusOnline})})]}),u(`div`,{class:`cf-header__actions`,children:[N.length>0&&l(`button`,{type:`button`,class:`cf-header__btn`,"aria-label":a.pastConversations,title:a.pastConversations,"aria-pressed":Se,onClick:()=>Ce(e=>!e),children:l(pe,{})}),$&&!A&&!J&&l(`button`,{type:`button`,class:`cf-header__btn`,"aria-label":a.endChat,title:a.endChat,onClick:Oe,children:l(fe,{})}),t.sound&&l(`button`,{type:`button`,class:`cf-header__btn`,"aria-label":V?a.unmuteSounds:a.muteSounds,"aria-pressed":V,onClick:ce,children:l(V?se:oe,{})}),l(`button`,{type:`button`,class:`cf-header__btn`,"aria-label":a.closeChat,onClick:Y,children:l(ie,{})})]})]}),t.preview&&l(`div`,{class:`cf-preview-banner`,children:a.previewBanner}),J&&l(`div`,{class:`cf-viewing-banner`,children:a.viewingPast}),u(`div`,{class:`cf-body`,ref:U,role:`log`,onScroll:Ne,children:[We&&!J&&u(`div`,{class:`cf-welcome`,children:[c?.agentDescription&&l(`p`,{class:`cf-welcome__desc`,children:c.agentDescription}),c?.welcomeSubtitle&&l(`p`,{class:`cf-welcome__sub`,children:c.welcomeSubtitle})]}),Ee.map((e,t)=>l(Pe,{msg:e,persona:c,isLast:!J&&t===Ee.length-1,visitor:p,hasEmail:m,lastQuestion:Q,showActions:!J&&t===Ee.length-1&&(!$||!!e.handoffOffered),onPickReply:He,onSubmitForm:C,onDemoSlots:D,onRetry:y,ratable:!J&&Ee.slice(0,t).some(e=>e.role===`user`),onRate:b},e.id)),!$&&!J&&l(Me,{items:h,onPick:g}),ye&&u(`button`,{type:`button`,class:`cf-newmsg`,onClick:Fe,children:[l(ge,{}),a.newMessages]})]}),l(`div`,{class:`cf-sr-live`,"aria-live":`polite`,"aria-atomic":`true`,children:Ie}),f&&!A&&!J&&l(`div`,{class:`cf-stopbar`,children:u(`button`,{type:`button`,class:`cf-stop`,onClick:v,children:[l(de,{}),a.stop]})}),J?l(`div`,{class:`cf-ended`,children:l(`button`,{type:`button`,class:`cf-ended__btn`,onClick:F,children:a.backToChat})}):A?u(`div`,{class:`cf-ended`,children:[l(`p`,{class:`cf-ended__text`,children:a.conversationEnded}),t.csat&&$?we?l(`p`,{class:`cf-ended__text`,children:a.feedbackThanks}):u(`div`,{class:`cf-csat`,children:[l(`span`,{class:`cf-csat__q`,children:a.csatPrompt}),l(`button`,{type:`button`,class:`cf-csat__btn`,"aria-label":a.feedbackHelpful,onClick:()=>{S(`up`),Te(!0)},children:l(me,{})}),l(`button`,{type:`button`,class:`cf-csat__btn`,"aria-label":a.feedbackNotHelpful,onClick:()=>{S(`down`),Te(!0)},children:l(he,{})})]}):null,l(`button`,{type:`button`,class:`cf-ended__btn`,onClick:Ae,children:a.startNewChat})]}):l(Re,{onSend:g,onSendGif:_,disabled:f,allowVoice:!!c?.allowVoiceInput,onTranscribe:w,gifEnabled:O,onSearchGifs:E,allowAttach:t.attachments,onExtract:T}),!A&&c?.disclaimerText&&l(`div`,{class:`cf-disclaimer`,children:c.disclaimerText}),u(`div`,{class:`cf-footer`,children:[a.poweredBy,` `,l(`a`,{href:`https://accurix.tech/centrinfo`,target:`_blank`,rel:`noopener noreferrer`,children:`Centrinfo`})]}),K&&l(`div`,{class:`cf-confirm`,onClick:()=>q(!1),children:u(`div`,{class:`cf-confirm__card`,role:`alertdialog`,"aria-modal":`true`,"aria-label":a.endChatConfirm,onClick:e=>e.stopPropagation(),children:[l(`div`,{class:`cf-confirm__title`,children:a.endChatConfirm}),l(`div`,{class:`cf-confirm__body`,children:a.endChatConfirmBody}),u(`div`,{class:`cf-confirm__actions`,children:[l(`button`,{ref:xe,type:`button`,class:`cf-confirm__btn cf-confirm__btn--cancel`,onClick:()=>q(!1),children:a.cancel}),l(`button`,{type:`button`,class:`cf-confirm__btn cf-confirm__btn--danger`,onClick:ke,children:a.endConfirmCta})]})]})}),Se&&l(`div`,{class:`cf-confirm`,onClick:()=>Ce(!1),children:u(`div`,{class:`cf-history`,role:`dialog`,"aria-modal":`true`,"aria-label":a.pastConversations,onClick:e=>e.stopPropagation(),children:[u(`div`,{class:`cf-history__head`,children:[l(`span`,{children:a.pastConversations}),l(`button`,{type:`button`,class:`cf-header__btn`,"aria-label":a.closeChat,onClick:()=>Ce(!1),children:l(ie,{})})]}),l(`div`,{class:`cf-history__list`,children:N.map(e=>u(`button`,{type:`button`,class:`cf-history__item ${e.sessionId===ee?`is-active`:``}`,onClick:()=>{P(e.sessionId),Ce(!1)},children:[l(`span`,{class:`cf-history__title`,children:e.title}),u(`span`,{class:`cf-history__meta`,children:[new Date(e.ts).toLocaleDateString(void 0,{month:`short`,day:`numeric`}),e.ended?` ยท ${a.historyEnded}`:``]})]},e.sessionId))})]})})]}),!t.hideDefaultLauncher&&u(`button`,{ref:ue,type:`button`,class:`cf-launcher`,"aria-label":L?a.closeChat:a.openChat,"aria-expanded":L,onClick:X,children:[t.launcherIcon?l(`img`,{class:`cf-launcher__img`,src:t.launcherIcon,alt:``}):l(re,{}),!L&&z>0&&l(`span`,{class:`cf-launcher__badge`,children:z})]})]})})},ct=e=>{if(!e||typeof e.token!=`string`||e.token.length===0)throw Error("[centrinfo-widget] `token` is required โ pass your pub_* token to Centrinfo.init({ token }).");return{token:e.token,apiBaseUrl:(e.apiBaseUrl??`https://api.accurixtech.com`).replace(/\/$/,``),accentColor:e.accentColor,launcherIcon:e.launcherIcon,gifApiKey:e.gifApiKey,theme:e.theme??`auto`,openByDefault:e.openByDefault??!1,sound:e.sound??!0,starters:e.starters??[],strings:ee(e.labels),persistence:e.persistence??`local`,attachments:e.attachments??!0,zIndex:e.zIndex??2147483e3,demo:e.demo??!1,preview:e.preview??!1,alignment:e.alignment===`left`?`left`:`right`,horizontalPadding:typeof e.horizontalPadding==`number`?e.horizontalPadding:20,verticalPadding:typeof e.verticalPadding==`number`?e.verticalPadding:20,hideDefaultLauncher:e.hideDefaultLauncher??!1,customLauncherSelector:e.customLauncherSelector,sessionDurationMinutes:typeof e.sessionDurationMinutes==`number`?e.sessionDurationMinutes:0,proactiveMessage:e.proactiveMessage,proactiveDelaySeconds:typeof e.proactiveDelaySeconds==`number`?e.proactiveDelaySeconds:5,proactiveOnPaths:e.proactiveOnPaths,csat:e.csat??!0,user:e.user,onOpen:e.onOpen,onClose:e.onClose,onShow:e.onShow,onHide:e.onHide,onUnreadChange:e.onUnreadChange,onMessage:e.onMessage,onAction:e.onAction,onHandoff:e.onHandoff}},lt=`
|
|
1
|
+
import{_ as e,a as t,c as n,f as r,g as i,h as a,i as o,l as s,m as c,n as l,o as u,p as d,r as f,s as p,t as m,v as h,y as g}from"./config-CHvO9tW1.mjs";import{render as _}from"preact";import{useCallback as v,useEffect as y,useMemo as b,useRef as x,useState as S}from"preact/hooks";import{Fragment as C,jsx as w,jsxs as T}from"preact/jsx-runtime";const E=[`audio/webm;codecs=opus`,`audio/webm`,`audio/ogg;codecs=opus`,`audio/ogg`],ee=e=>{let t=globalThis.MediaRecorder;if(typeof t?.isTypeSupported==`function`){for(let n of E)if(t.isTypeSupported(n))try{return new t(e,{mimeType:n})}catch{}}return new t(e)},D=e=>{if(!(!e||e.state!==`recording`)){try{e.requestData()}catch{}e.stop()}},te=[{name:`Smileys`,emojis:`๐.๐.๐.๐.๐
.๐.๐คฃ.๐.๐.๐.๐.๐.๐.๐.๐ฅฐ.๐.๐.๐.๐.๐คช.๐ค.๐คญ.๐ค.๐ค.๐.๐ถ.๐.๐.๐ด.๐ฅณ.๐.๐ค.๐ฅบ.๐ข.๐ญ.๐ค.๐ .๐คฏ.๐ฌ.๐ฑ.๐คฉ.๐ฅฑ`.split(`.`)},{name:`Gestures`,emojis:[`๐`,`๐`,`๐`,`๐ค`,`โ๏ธ`,`๐ค`,`๐ค`,`๐ค`,`๐ค`,`๐`,`๐`,`๐`,`๐`,`โ`,`๐๏ธ`,`๐`,`๐ค`,`๐`,`๐ช`,`๐`,`๐`,`๐`,`๐คฒ`,`๐ซถ`]},{name:`Hearts & symbols`,emojis:`โค๏ธ.๐งก.๐.๐.๐.๐.๐ค.๐ค.๐.โฃ๏ธ.๐.๐.๐.๐.โจ.โญ.๐.๐ซ.๐ฅ.๐.๐.โ
.โ.โก.๐ฏ.๐`.split(`.`)},{name:`Animals & nature`,emojis:[`๐ถ`,`๐ฑ`,`๐ฆ`,`๐ป`,`๐ผ`,`๐จ`,`๐ฆ`,`๐ฎ`,`๐ธ`,`๐ต`,`๐ง`,`๐ฆ`,`๐`,`๐ฆ`,`๐ข`,`๐ฌ`,`๐ท`,`๐ธ`,`๐น`,`๐ป`,`๐ณ`,`๐`]},{name:`Food & drink`,emojis:[`๐`,`๐`,`๐`,`๐`,`๐`,`๐ฅ`,`๐`,`๐`,`๐`,`๐ฎ`,`๐ฟ`,`๐ฉ`,`๐ช`,`๐`,`โ`,`๐ต`,`๐บ`,`๐ฅ`,`๐ท`]},{name:`Objects & travel`,emojis:`๐.โ๏ธ.๐.๐ .๐ฆ.๐ฑ.๐ป.โ.๐ท.๐ก.๐.๐.๐.โ๏ธ.๐.๐.๐ง.๐ฐ.๐.โฐ.๐.๐ฏ.๐.๐ฎ.๐ต.๐ฌ.๐`.split(`.`)}],O={inquiry:{title:`Leave a message`,submit:`Send message`,fields:[{key:`visitorName`,label:`Full name`,kind:`text`,required:!0,identity:`name`},{key:`visitorEmail`,label:`Email`,kind:`email`,required:!0,identity:`email`},{key:`message`,label:`Message`,kind:`textarea`,required:!0,placeholder:`How can we help?`}]},contact:{title:`Share your details`,submit:`Save`,fields:[{key:`name`,label:`Full name`,kind:`text`,required:!0,identity:`name`},{key:`email`,label:`Email`,kind:`email`,required:!0,identity:`email`},{key:`phone`,label:`Phone`,kind:`tel`,required:!0,identity:`phone`}]},"book-demo":{title:`Book a demo`,submit:`Request demo`,fields:[{key:`visitorName`,label:`Full name`,kind:`text`,required:!0,identity:`name`},{key:`visitorEmail`,label:`Email`,kind:`email`,required:!0,identity:`email`},{key:`preferredAt`,label:`Preferred time`,kind:`text`,placeholder:`e.g. Thursday 3pm`},{key:`notes`,label:`Notes`,kind:`textarea`,placeholder:`Anything we should know?`}]},"request-callback":{title:`Request a callback`,submit:`Request callback`,fields:[{key:`visitorName`,label:`Full name`,kind:`text`,required:!0,identity:`name`},{key:`visitorPhone`,label:`Phone`,kind:`tel`,required:!0,identity:`phone`},{key:`bestTime`,label:`Best time to call`,kind:`text`,placeholder:`e.g. tomorrow afternoon`},{key:`topic`,label:`Topic`,kind:`text`,placeholder:`What should we call about?`}]},"subscribe-newsletter":{title:`Subscribe`,submit:`Subscribe`,fields:[{key:`visitorName`,label:`Full name`,kind:`text`,required:!0,identity:`name`},{key:`visitorEmail`,label:`Email`,kind:`email`,required:!0,identity:`email`}]}},k=(e,t)=>w(`svg`,{viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,"stroke-width":`2`,"stroke-linecap":`round`,"stroke-linejoin":`round`,"aria-hidden":`true`,...t,children:e}),A=e=>w(`svg`,{viewBox:`0 0 24 24`,fill:`currentColor`,"aria-hidden":`true`,...e,children:w(`path`,{"fill-rule":`evenodd`,"clip-rule":`evenodd`,d:`M5 3.25h14A3.75 3.75 0 0 1 22.75 7v6A3.75 3.75 0 0 1 19 16.75h-7.19l-4.26 3.84A.75.75 0 0 1 6.25 20v-3.32A3.75 3.75 0 0 1 2.25 13V7A3.75 3.75 0 0 1 6 3.25Zm3 7.75a1.25 1.25 0 1 0 0-2.5 1.25 1.25 0 0 0 0 2.5Zm4 0a1.25 1.25 0 1 0 0-2.5 1.25 1.25 0 0 0 0 2.5Zm4 0a1.25 1.25 0 1 0 0-2.5 1.25 1.25 0 0 0 0 2.5Z`})}),j=e=>k(w(`path`,{d:`m6 9 6 6 6-6`}),e),ne=e=>k(T(C,{children:[w(`path`,{d:`m22 2-7 20-4-9-9-4Z`}),w(`path`,{d:`M22 2 11 13`})]}),e),M=e=>k(T(C,{children:[w(`path`,{d:`M12 2a3 3 0 0 0-3 3v7a3 3 0 0 0 6 0V5a3 3 0 0 0-3-3Z`}),w(`path`,{d:`M19 10v2a7 7 0 0 1-14 0v-2`}),w(`line`,{x1:`12`,y1:`19`,x2:`12`,y2:`22`})]}),e),re=e=>k(T(C,{children:[w(`path`,{d:`M9 9v1a3 3 0 0 0 4.24 2.73`}),w(`path`,{d:`M15 5.5V5a3 3 0 0 0-5.94-.6`}),w(`path`,{d:`M19 10v2a7 7 0 0 1-9.9 6.36`}),w(`path`,{d:`M5 10v2a6.98 6.98 0 0 0 1.11 3.79`}),w(`line`,{x1:`12`,y1:`19`,x2:`12`,y2:`22`}),w(`line`,{x1:`2`,y1:`2`,x2:`22`,y2:`22`})]}),e),ie=e=>k(T(C,{children:[w(`path`,{d:`M15 3h6v6`}),w(`path`,{d:`M10 14 21 3`}),w(`path`,{d:`M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6`})]}),e),N=e=>k(T(C,{children:[w(`rect`,{x:`3`,y:`4`,width:`18`,height:`18`,rx:`2`}),w(`line`,{x1:`16`,y1:`2`,x2:`16`,y2:`6`}),w(`line`,{x1:`8`,y1:`2`,x2:`8`,y2:`6`}),w(`line`,{x1:`3`,y1:`10`,x2:`21`,y2:`10`})]}),e),P=e=>k(T(C,{children:[w(`rect`,{x:`2`,y:`4`,width:`20`,height:`16`,rx:`2`}),w(`path`,{d:`m22 7-10 5L2 7`})]}),e),F=e=>k(w(`path`,{d:`M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.13.96.36 1.9.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.91.34 1.85.57 2.81.7A2 2 0 0 1 22 16.92Z`}),e),ae=e=>k(T(C,{children:[w(`circle`,{cx:`12`,cy:`12`,r:`9`}),w(`path`,{d:`M8.5 14.5a4 4 0 0 0 7 0`}),w(`line`,{x1:`9`,y1:`9.5`,x2:`9.01`,y2:`9.5`}),w(`line`,{x1:`15`,y1:`9.5`,x2:`15.01`,y2:`9.5`})]}),e),I=e=>k(T(C,{children:[w(`line`,{x1:`18`,y1:`6`,x2:`6`,y2:`18`}),w(`line`,{x1:`6`,y1:`6`,x2:`18`,y2:`18`})]}),e),oe=e=>k(T(C,{children:[w(`path`,{d:`M11 5 6 9H2v6h4l5 4z`}),w(`path`,{d:`M15.5 8.5a5 5 0 0 1 0 7`}),w(`path`,{d:`M19 5a9 9 0 0 1 0 14`})]}),e),se=e=>k(T(C,{children:[w(`path`,{d:`M11 5 6 9H2v6h4l5 4z`}),w(`line`,{x1:`22`,y1:`9`,x2:`16`,y2:`15`}),w(`line`,{x1:`16`,y1:`9`,x2:`22`,y2:`15`})]}),e),L=e=>k(w(`path`,{d:`M20 6 9 17l-5-5`}),e),R=e=>k(T(C,{children:[w(`rect`,{x:`9`,y:`9`,width:`13`,height:`13`,rx:`2`}),w(`path`,{d:`M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1`})]}),e),ce=e=>k(T(C,{children:[w(`path`,{d:`M1 4v6h6`}),w(`path`,{d:`M3.51 15a9 9 0 1 0 2.13-9.36L1 10`})]}),e),le=e=>k(w(`rect`,{x:`6`,y:`6`,width:`12`,height:`12`,rx:`2`}),e),ue=e=>k(w(`path`,{d:`M21.44 11.05 12.25 20.24a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48`}),e),de=e=>k(T(C,{children:[w(`path`,{d:`M18.36 6.64a9 9 0 1 1-12.73 0`}),w(`line`,{x1:`12`,y1:`2`,x2:`12`,y2:`12`})]}),e),fe=e=>k(T(C,{children:[w(`circle`,{cx:`12`,cy:`12`,r:`9`}),w(`path`,{d:`M12 7v5l3 2`})]}),e),z=e=>k(T(C,{children:[w(`path`,{d:`M7 10v12`}),w(`path`,{d:`M15 5.88 14 10h5.83a2 2 0 0 1 1.92 2.56l-2.33 8A2 2 0 0 1 17.5 22H4a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2h2.76a2 2 0 0 0 1.79-1.11L12 2a3.13 3.13 0 0 1 3 3.88Z`})]}),e),pe=e=>k(T(C,{children:[w(`path`,{d:`M17 14V2`}),w(`path`,{d:`M9 18.12 10 14H4.17a2 2 0 0 1-1.92-2.56l2.33-8A2 2 0 0 1 6.5 2H20a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2h-2.76a2 2 0 0 0-1.79 1.11L12 22a3.13 3.13 0 0 1-3-3.88Z`})]}),e),me=e=>k(T(C,{children:[w(`path`,{d:`M15 3h6v6`}),w(`path`,{d:`M9 21H3v-6`}),w(`path`,{d:`M21 3l-7 7`}),w(`path`,{d:`M3 21l7-7`})]}),e),he=e=>k(T(C,{children:[w(`path`,{d:`M9 3v6H3`}),w(`path`,{d:`M15 21v-6h6`}),w(`path`,{d:`M9 9 2 2`}),w(`path`,{d:`M15 15l7 7`})]}),e),ge=e=>k(T(C,{children:[w(`rect`,{x:`3`,y:`4`,width:`18`,height:`14`,rx:`2`}),w(`rect`,{x:`11`,y:`11`,width:`8`,height:`6`,rx:`1`,fill:`currentColor`,stroke:`none`})]}),e),B=e=>k(T(C,{children:[w(`rect`,{x:`4`,y:`5`,width:`16`,height:`14`,rx:`2`}),w(`path`,{d:`M12 15V9`}),w(`path`,{d:`m8.5 12.5 3.5-3.5 3.5 3.5`})]}),e),_e=e=>k(T(C,{children:[w(`line`,{x1:`12`,y1:`5`,x2:`12`,y2:`19`}),w(`path`,{d:`m19 12-7 7-7-7`})]}),e),ve=e=>{if(!e)return`Live data`;let t=new Date(e);return Number.isNaN(t.getTime())?`Live data`:`Updated ${new Intl.DateTimeFormat(void 0,{hour:`numeric`,minute:`2-digit`}).format(t)}`},ye=({answeredAt:e,reportingPeriod:t,filters:n=[],rowCount:r})=>T(`div`,{class:`cf-analytics-meta`,"data-testid":`analytics-result-meta`,"aria-label":`Result details`,children:[T(`span`,{children:[w(`span`,{"aria-hidden":`true`,class:`cf-analytics-meta__dot`}),ve(e)]}),t?.label?w(`span`,{children:t.label}):null,typeof r==`number`?T(`span`,{children:[r,` `,r===1?`row`:`rows`]}):null,n.length>0?T(`span`,{children:[n.length,` applied `,n.length===1?`filter`:`filters`]}):null]}),be=({label:e,value:t,detail:n})=>T(`section`,{class:`cf-analytics-kpi`,"aria-label":e,"data-testid":`analytics-kpi`,children:[w(`div`,{class:`cf-analytics-kpi__label`,children:e}),w(`div`,{class:`cf-analytics-kpi__value`,children:t}),n?w(`div`,{class:`cf-analytics-kpi__detail`,children:n}):null]}),xe=({title:e=`No matching data`,description:t=`No approved records matched this question.`})=>T(`section`,{class:`cf-analytics-empty`,role:`status`,"data-testid":`analytics-empty-state`,children:[w(`p`,{children:e}),w(`p`,{children:t})]}),Se=({explanation:e,onFollowUp:t,showLead:n=!1,maxFollowUps:r=3})=>T(`section`,{class:`cf-analytics-explanation`,"data-testid":`inline-analytics-explanation`,"aria-label":`Analysis and supporting evidence`,children:[n?T(`div`,{class:`cf-analytics-explanation__lead`,"data-testid":`analytics-explanation-lead`,children:[T(`div`,{class:`cf-analytics-explanation__lead-meta`,children:[w(`span`,{class:`cf-analytics-explanation__eyebrow`,children:`Answer from your data`}),T(`span`,{class:`cf-analytics-explanation__provenance`,children:[w(`span`,{"aria-hidden":`true`,class:`cf-analytics-explanation__provenance-dot`}),e.source===`ai_grounded`?`AI-assisted ยท evidence checked`:`Based on current values`]})]}),w(`h3`,{class:`cf-analytics-explanation__headline`,children:e.headline}),w(`p`,{class:`cf-analytics-explanation__summary`,children:e.summary})]}):null,T(`div`,{class:`cf-analytics-explanation__body`,children:[(e.evidence?.length??0)>0?T(`section`,{class:`cf-analytics-explanation__section`,children:[w(`h4`,{class:`cf-analytics-explanation__heading`,children:`What the numbers show`}),w(`ul`,{class:`cf-analytics-explanation__evidence`,children:e.evidence?.slice(0,4).map(e=>T(`li`,{class:`cf-analytics-explanation__evidence-item`,children:[w(`span`,{"aria-hidden":`true`,class:`cf-analytics-explanation__evidence-bullet`}),w(`span`,{children:e})]},e))})]}):null,e.businessMeaning?T(`section`,{class:`cf-analytics-explanation__meaning`,children:[w(`h4`,{class:`cf-analytics-explanation__heading`,children:`Why this may matter`}),w(`p`,{class:`cf-analytics-explanation__paragraph`,children:e.businessMeaning})]}):null,(e.possibleDrivers?.length??0)>0?T(`section`,{class:`cf-analytics-explanation__section`,children:[T(`div`,{class:`cf-analytics-explanation__section-heading`,children:[w(`h4`,{class:`cf-analytics-explanation__heading`,children:`Possibilities worth checking`}),w(`span`,{class:`cf-analytics-explanation__hint`,children:`These are not proven causes`})]}),w(`div`,{class:`cf-analytics-explanation__drivers`,children:e.possibleDrivers?.slice(0,2).map(e=>T(`article`,{class:`cf-analytics-explanation__driver`,children:[w(`p`,{class:`cf-analytics-explanation__driver-title`,children:e.hypothesis}),T(`p`,{class:`cf-analytics-explanation__driver-body`,children:[w(`span`,{class:`cf-analytics-explanation__driver-label`,children:`How to check:`}),` `,e.howToCheck]})]},`${e.hypothesis}-${e.howToCheck}`))})]}):null,(e.recommendations?.length??0)>0?T(`section`,{class:`cf-analytics-explanation__section`,children:[w(`h4`,{class:`cf-analytics-explanation__heading`,children:`Useful next steps`}),w(`div`,{class:`cf-analytics-explanation__recommendations`,children:e.recommendations?.slice(0,3).map((e,t)=>T(`article`,{class:`cf-analytics-explanation__recommendation`,children:[w(`span`,{class:`cf-analytics-explanation__recommendation-index`,children:t+1}),T(`div`,{children:[w(`p`,{class:`cf-analytics-explanation__recommendation-title`,children:e.action}),w(`p`,{class:`cf-analytics-explanation__recommendation-body`,children:e.why}),e.successMetric?T(`p`,{class:`cf-analytics-explanation__recommendation-body`,children:[w(`span`,{class:`cf-analytics-explanation__driver-label`,children:`Watch:`}),` `,e.successMetric]}):null]})]},`${e.action}-${e.why}`))})]}):null,e.forecast?T(`section`,{class:`cf-analytics-explanation__outlook`,children:[T(`div`,{class:`cf-analytics-explanation__outlook-header`,children:[w(`h4`,{class:`cf-analytics-explanation__heading`,children:`Outlook`}),w(`span`,{class:`cf-analytics-explanation__outlook-badge`,children:`Validated estimate`})]}),w(`p`,{class:`cf-analytics-explanation__paragraph`,children:e.forecast.text}),e.forecast.limitations?w(`p`,{class:`cf-analytics-explanation__recommendation-body`,children:e.forecast.limitations}):null]}):null,t&&(e.followUps?.length??0)>0?T(`section`,{class:`cf-analytics-explanation__section cf-analytics-explanation__follow-up`,children:[w(`h4`,{class:`cf-analytics-explanation__heading`,children:`Ask a follow-up`}),w(`div`,{class:`cf-analytics-explanation__questions`,children:e.followUps?.slice(0,r).map(e=>w(`button`,{type:`button`,class:`cf-analytics-explanation__question`,onClick:()=>t(e),children:e},e))})]}):null,(e.limitations?.length??0)>0?T(`details`,{class:`cf-analytics-explanation__limits`,children:[w(`summary`,{class:`cf-analytics-explanation__limits-summary`,children:`Important limits`}),w(`ul`,{class:`cf-analytics-explanation__limits-list`,children:e.limitations?.map(e=>w(`li`,{children:e},e))})]}):null]}),w(`p`,{class:`cf-analytics-explanation__source`,children:e.source===`ai_grounded`?`AI-assisted wording, checked against the live values shown here.`:`Based only on the live values shown here.`})]}),Ce=()=>{let e=x(null);return y(()=>{let t=requestAnimationFrame(()=>e.current?.scrollIntoView({block:`end`}));return()=>cancelAnimationFrame(t)},[]),e},we=e=>e.trim().split(/\s+/).slice(0,2).map(e=>e[0]?.toUpperCase()??``).join(``)||`๐ค`,Te=e=>{let t=e?.avatarId?.trim().toLowerCase().replace(/[^a-z0-9-]/g,`-`);return t?` cf-avatar-preset--${t}`:``},Ee={"support-guide":`SG`,"sales-host":`SH`,"calm-advisor":`CA`,"technical-guide":`TG`,"school-desk":`SD`,"front-office":`FO`},V=e=>{let t=e?.avatarId?.trim().toLowerCase();return t&&Ee[t]||(e?we(e.agentName):`ยท`)},De=({persona:e,small:t,hideWhenMissing:n})=>{let r=t?`cf-msg__avatar`:`cf-header__avatar`,i=e?.agentAvatarUrl?.trim();return i?w(`span`,{class:r,children:w(`img`,{src:i,alt:``})}):n?null:w(`span`,{class:`${r}${Te(e)}`,children:V(e)})},Oe=()=>{let e=n(),[t,r]=S(0),i=[`Thinking`,`Checking available information`,`Preparing your response`];return y(()=>{let e=[window.setTimeout(()=>r(1),1800),window.setTimeout(()=>r(2),5e3)];return()=>e.forEach(e=>window.clearTimeout(e))},[]),T(`div`,{class:`cf-msg__bubble cf-typing`,"aria-label":e.assistantTyping,children:[w(`span`,{class:`cf-typing__label`,"aria-live":`polite`,children:i[t]}),w(`span`,{class:`cf-typing__dot`}),w(`span`,{class:`cf-typing__dot`}),w(`span`,{class:`cf-typing__dot`})]})},ke=({msg:e})=>{if(!e.sources||e.sources.length===0)return null;let t=new Set,n=[];for(let r of e.sources){let e=(r.url||r.title||``).toLowerCase();!e||t.has(e)||(t.add(e),n.push(r))}if(n.length===0)return null;let r=n.slice(0,3),i=n.length-r.length;return T(`div`,{class:`cf-sources`,children:[r.map((e,t)=>e.url?T(`a`,{class:`cf-source`,href:e.url,target:`_blank`,rel:`noopener noreferrer nofollow`,title:e.title||e.url,children:[w(ie,{}),w(`span`,{children:e.title||e.url})]},t):T(`span`,{class:`cf-source`,title:e.title,children:[w(ie,{}),w(`span`,{children:e.title})]},t)),i>0&&T(`span`,{class:`cf-source cf-source--more`,children:[`+`,i,` more`]})]})},H=({replies:e,onPick:t})=>e&&e.length>0?w(`div`,{class:`cf-chips`,children:e.map((e,n)=>w(`button`,{type:`button`,class:`cf-chip`,onClick:()=>t(e),children:e},n))}):null,Ae=({persona:e,starters:t,onPick:n,onFocusComposer:r,speaking:i,voiceState:a=`idle`,replyPending:o=!1,pinned:s=!1,muted:c=!1,onToggleMute:l,onEndCall:u,onTalkNow:d,showTalkNow:f=!1,micLevel:p=0,theaterMode:m=!1,onToggleTheater:h,onMinimize:g,audioDevices:_=[],selectedAudioDeviceId:v=``,onSelectAudioDevice:y,connectingOnly:b=!1})=>{if(!e||!(e.talkbackMode===`avatar`||e.widgetModule===`assistant`||e.allowVoiceInput))return null;let x=e.agentAvatarUrl?.trim()||``,S=e.assistantMediaUrl?.trim()||x,E=e.assistantMediaKind===`video`&&!!S,ee=t.slice(0,3),D=a!==`idle`,te=a===`idle`?`Speak with ${e.agentName}`:`End voice chat`,O=s&&!D&&!i,k=a===`connecting`||a===`processing`||D&&o,A=[`cf-assistant-card__stage`,`cf-assistant-card__stage--local`,D?`is-live`:``,k?`is-thinking`:``,a===`listening`&&!c?`is-listening`:``,i||a===`speaking`?`is-speaking`:``,c?`is-muted`:``].filter(Boolean).join(` `),j=a===`listening`&&!c?{"--cf-listen":String(Math.max(.18,Math.min(1,p*8)))}:void 0,ne=k&&T(`span`,{class:`cf-call-ripple`,"aria-hidden":`true`,children:[w(`span`,{}),w(`span`,{}),w(`span`,{})]});if(b)return T(`div`,{class:`cf-assistant-card cf-assistant-card--connecting`,"aria-live":`polite`,children:[T(`div`,{class:`cf-assistant-card__connecting-avatar`,children:[x?w(`img`,{src:x,alt:``}):w(`span`,{class:`cf-assistant-card__connecting-face${Te(e)}`,children:V(e)}),ne]}),T(`div`,{class:`cf-assistant-card__connecting-copy`,children:[w(`span`,{class:`cf-assistant-card__connecting-eyebrow`,children:e.agentName}),w(`strong`,{children:`Connecting with the AIโฆ`})]})]});let re=D&&u&&w(Ze,{voiceState:a,muted:c,onToggleMute:l??(()=>{}),onEndCall:u,onTalkNow:d??(()=>{}),showTalkNow:f,micLevel:p,theaterMode:m,onToggleTheater:h??(()=>{}),onMinimize:g??(()=>{}),audioDevices:_,selectedAudioDeviceId:v,onSelectAudioDevice:y??(()=>{})});return O?w(`div`,{class:`cf-assistant-card cf-assistant-card--pinned cf-assistant-card--compact`,children:T(`button`,{type:`button`,class:`cf-assistant-card__compact-speak`,onClick:r,children:[x?w(`span`,{class:`cf-assistant-card__compact-avatar`,children:w(`img`,{src:x,alt:``})}):null,w(`span`,{class:`cf-assistant-card__compact-mic`,"aria-hidden":`true`,children:w(M,{})}),w(`span`,{class:`cf-assistant-card__compact-label`,children:te})]})}):T(`div`,{class:`cf-assistant-card ${s?`cf-assistant-card--pinned`:``} ${i?`is-speaking`:``}`,children:[(S||e.allowVoiceInput)&&T(`div`,{class:A,style:j,children:[T(`div`,{class:`cf-assistant-card__media ${S?`cf-assistant-card__media--uploaded`:`cf-assistant-card__media--generated`}${Te(e)}`,children:[E?w(`video`,{src:S,muted:!0,loop:!0,playsInline:!0,autoPlay:!0}):S?w(`img`,{src:S,alt:``}):w(`div`,{class:`cf-assistant-card__avatar-stage${Te(e)}`,children:T(`div`,{class:`cf-assistant-card__face`,children:[w(`span`,{class:`cf-assistant-card__initials`,children:V(e)}),w(`span`,{class:`cf-assistant-card__eye cf-assistant-card__eye--left`}),w(`span`,{class:`cf-assistant-card__eye cf-assistant-card__eye--right`}),w(`span`,{class:`cf-assistant-card__mouth`})]})}),S&&!E&&w(`span`,{class:`cf-assistant-card__mouth cf-assistant-card__mouth--overlay`}),w(`span`,{class:`cf-avatar-aura cf-avatar-aura--one`,"aria-hidden":`true`}),w(`span`,{class:`cf-avatar-aura cf-avatar-aura--two`,"aria-hidden":`true`}),w(`span`,{class:`cf-avatar-listen-ring`,"aria-hidden":`true`}),T(`span`,{class:`cf-avatar-wave`,"aria-hidden":`true`,children:[w(`span`,{}),w(`span`,{}),w(`span`,{}),w(`span`,{})]})]}),ne,e.allowVoiceInput&&(re||T(`button`,{type:`button`,class:`cf-assistant-card__speak`,onClick:r,children:[w(M,{}),te]}))]}),!s&&T(C,{children:[e.agentDescription?w(`p`,{class:`cf-assistant-card__copy`,children:e.agentDescription}):w(`p`,{class:`cf-assistant-card__copy`,children:e.greeting}),ee.length>0&&w(`div`,{class:`cf-assistant-card__chips`,children:ee.map(e=>w(`button`,{type:`button`,class:`cf-assistant-card__chip`,onClick:()=>n(e),children:e},e))}),e.disclaimerText||e.assistantPrivacyUrl?T(`p`,{class:`cf-assistant-card__privacy`,children:[e.disclaimerText||`This chat may be recorded for quality and support.`,e.assistantPrivacyUrl?T(C,{children:[` `,w(`a`,{href:e.assistantPrivacyUrl,target:`_blank`,rel:`noopener noreferrer nofollow`,children:`Privacy Policy`})]}):null]}):null]})]})},U={public_book_demo:{type:`book-demo`,label:`Book a demo`,description:`Pick a time or request a demo from the team.`,Icon:N},public_submit_inquiry:{type:`inquiry`,label:`Leave a message`,description:`Send your question and contact details.`,Icon:P},public_request_callback:{type:`request-callback`,label:`Request a callback`,description:`Share your phone number and best time to call.`,Icon:F},public_subscribe_newsletter:{type:`subscribe-newsletter`,label:`Subscribe`,description:`Get product updates and useful announcements.`,Icon:P}},W=({field:e,value:t,onInput:n})=>{let r=e.placeholder??e.label,i={class:`cf-form__input`,placeholder:e.required?`${r} *`:r,value:t,"aria-label":e.label,onInput:e=>n(e.target.value)};return e.kind===`textarea`?w(`textarea`,{rows:2,...i}):w(`input`,{type:e.kind,...i})},je=({spec:e,visitor:t,onSubmit:r,onCancel:i})=>{let a=n(),o=Ce(),[s,c]=S(()=>{let n={};for(let r of e.fields)r.identity&&t[r.identity]&&(n[r.key]=t[r.identity]);return n}),[l,u]=S(`idle`),[d,f]=S(``),p=e=>!!(e.identity&&t[e.identity]?.trim()),m=e.fields.filter(e=>!p(e)),h=m.every(e=>!e.required||(s[e.key]?.trim()??``)!==``),g=t.email||t.name||``;return l===`done`?T(`div`,{class:`cf-form cf-form--done`,children:[w(L,{}),w(`span`,{children:d})]}):T(`div`,{class:`cf-form`,ref:o,children:[w(`div`,{class:`cf-form__title`,children:e.title}),m.length===0&&g&&T(`div`,{class:`cf-form__as`,children:[`as `,g]}),m.map(e=>w(W,{field:e,value:s[e.key]??``,onInput:t=>c(n=>({...n,[e.key]:t}))},e.key)),l===`error`&&w(`div`,{class:`cf-form__err`,children:a.formError}),T(`div`,{class:`cf-form__actions`,children:[i&&w(`button`,{type:`button`,class:`cf-form__cancel`,onClick:i,children:`Cancel`}),w(`button`,{type:`button`,class:`cf-form__submit`,disabled:!h||l===`submitting`,onClick:async()=>{if(!h||l===`submitting`)return;u(`submitting`);let t={},n={};for(let r of e.fields){let e=s[r.key]?.trim();e&&(t[r.key]=e,r.identity&&(n[r.identity]=e))}try{f((await r(t,n)).note||a.formThanks),u(`done`)}catch{u(`error`)}},children:l===`submitting`?a.sending:e.submit})]})]})},G=e=>String(e).padStart(2,`0`),Me=()=>{let e=[];for(let t=9;t<=17;t++)e.push(`${G(t)}:00`),e.push(`${G(t)}:30`);return e},Ne=e=>{let t=new Date;return t.setHours(0,0,0,0),Array.from({length:e},(e,n)=>{let r=new Date(t);return r.setDate(t.getDate()+n),r})},Pe=(e,t)=>{let[n,r]=t.split(`:`).map(Number),i=new Date(e.getFullYear(),e.getMonth(),e.getDate(),n??0,r??0);try{return new Intl.DateTimeFormat(void 0,{weekday:`short`,day:`numeric`,month:`short`,year:`numeric`,hour:`2-digit`,minute:`2-digit`,timeZoneName:`short`}).format(i)}catch{return`${e.toDateString()} ${t}`}},K=(e,t)=>{let[n,r]=t.split(`:`).map(Number);return new Date(e.getFullYear(),e.getMonth(),e.getDate(),n??0,r??0)},Fe=({visitor:e,onSubmit:t,onCancel:r,onDemoSlots:i,scheduler:a})=>{let o=n(),s=Ce(),c=b(()=>Ne(14),[]),l=b(()=>Me(),[]),[u,d]=S(b(()=>{let e=Date.now();for(let t=0;t<c.length;t++)if(l.some(n=>K(c[t],n).getTime()>e))return t;return 0},[c,l])),[f,m]=S(null),[h,g]=S(e.name??``),[_,v]=S(e.email??``),[x,E]=S(`idle`),[ee,D]=S(``),[te,k]=S(``),[A,j]=S(``),ne=a?.connected&&a.mode===`link`,M=async()=>{if(x===`submitting`||!e.name?.trim()&&!h.trim()||!e.email?.trim()&&!_.trim())return;E(`submitting`),k(``);let n={};_.trim()&&(n.email=_.trim()),h.trim()&&(n.name=h.trim());try{let e=await t({..._.trim()?{visitorEmail:_.trim()}:{},...h.trim()?{visitorName:h.trim()}:{}},n),r=e.booking?.schedulingLink||a?.bookingLink||``;if(!r){E(`error`);return}try{window.open(r,`_blank`,`noopener,noreferrer`)}catch{}j(r),D(e.note||o.bookingLinkOpened),E(`done`)}catch{E(`error`)}},[re,N]=S(new Set),[P,F]=S([]),[ae,I]=S(0),[oe,se]=S(!1);y(()=>{if(!i)return;let e=!0,t=new Date,n=new Date;return n.setDate(n.getDate()+15),i(t.toISOString(),n.toISOString()).then(t=>{e&&(N(new Set(t.taken.map(e=>Date.parse(e)).filter(e=>!Number.isNaN(e)))),F(t.busy.map(e=>[Date.parse(e.start),Date.parse(e.end)]).filter(([e,t])=>!Number.isNaN(e)&&!Number.isNaN(t))))}).catch(()=>{}),()=>{e=!1}},[i,ae]);let R=!!e.email?.trim(),ce=!!e.name?.trim(),le=!!f&&(ce||h.trim()!==``)&&(R||_.trim()!==``),ue=e.email||e.name||``,de=e=>re.has(K(c[u],e).getTime()),fe=e=>K(c[u],e).getTime()<=Date.now(),z=e=>{let t=K(c[u],e).getTime(),n=t+18e5;return P.some(([e,r])=>t<r&&n>e)},pe=async()=>{if(!le||x===`submitting`||!f)return;E(`submitting`),se(!1),k(``);let e=K(c[u],f),n=Pe(c[u],f),r={};_.trim()&&(r.email=_.trim()),h.trim()&&(r.name=h.trim());try{let i=await t({preferredAt:n,slotAt:e.toISOString(),..._.trim()?{visitorEmail:_.trim()}:{},...h.trim()?{visitorName:h.trim()}:{}},r);i.booking?.confirmed?(D(i.note||p(o.bookingConfirmed,{when:n})),j(i.booking.meetingUrl||i.booking.eventLink||``)):D(i.note||p(o.bookingRequested,{when:n})),E(`done`)}catch(t){if(t?.status===409)N(t=>new Set(t).add(e.getTime())),m(null),se(!0),I(e=>e+1),E(`idle`);else{let e=t?.message;k(e&&e.length<120?e:``),E(`error`)}}};return x===`done`?T(`div`,{class:`cf-form cf-form--done`,children:[w(L,{}),w(`span`,{children:ee}),A&&T(`a`,{class:`cf-booking__link`,href:A,target:`_blank`,rel:`noopener noreferrer`,children:[ne?o.bookingOpenScheduler:o.bookingMeetingLink,` `,w(ie,{})]})]}):ne?T(`div`,{class:`cf-form cf-booking`,ref:s,children:[w(`div`,{class:`cf-form__title`,children:O[`book-demo`].title}),w(`div`,{class:`cf-booking__hint`,children:p(o.bookingViaProvider,{provider:a?.label??`the scheduler`})}),R?ue?T(`div`,{class:`cf-form__as`,children:[`as `,ue]}):null:T(C,{children:[!e.name?.trim()&&w(`input`,{class:`cf-form__input`,type:`text`,placeholder:`${o.handoffName} *`,value:h,"aria-label":o.handoffName,onInput:e=>g(e.target.value)}),w(`input`,{class:`cf-form__input`,type:`email`,placeholder:`${o.handoffEmail} *`,value:_,"aria-label":o.handoffEmail,onInput:e=>v(e.target.value)})]}),x===`error`&&w(`div`,{class:`cf-form__err`,children:te||o.formError}),T(`div`,{class:`cf-form__actions`,children:[r&&w(`button`,{type:`button`,class:`cf-form__cancel`,onClick:r,children:o.cancel}),w(`button`,{type:`button`,class:`cf-form__submit`,disabled:x===`submitting`||!e.name?.trim()&&h.trim()===``||!R&&_.trim()===``,onClick:M,children:x===`submitting`?o.sending:o.bookingOpenScheduler})]})]}):T(`div`,{class:`cf-form cf-booking`,ref:s,children:[w(`div`,{class:`cf-form__title`,children:O[`book-demo`].title}),T(`div`,{class:`cf-booking__hint`,children:[o.bookingPickTime,` ยท `,w(`span`,{class:`cf-booking__dur`,children:o.bookingDuration})]}),w(`div`,{class:`cf-booking__dates`,role:`tablist`,"aria-label":`Pick a day`,children:c.map((e,t)=>T(`button`,{type:`button`,role:`tab`,"aria-selected":t===u,class:`cf-booking__date ${t===u?`is-selected`:``}`,onClick:()=>{d(t),m(null)},children:[w(`span`,{class:`cf-booking__dow`,children:e.toLocaleDateString(void 0,{weekday:`short`})}),w(`span`,{class:`cf-booking__dom`,children:e.getDate()})]},t))}),w(`div`,{class:`cf-booking__slots`,role:`listbox`,"aria-label":`Pick a time`,children:l.map(e=>{let t=fe(e),n=z(e),r=de(e),i=r||t||n;return w(`button`,{type:`button`,role:`option`,"aria-selected":f===e,disabled:i,title:t?`Earlier today`:n?`Busy on the calendar`:r?`Already booked`:void 0,class:`cf-booking__slot ${f===e?`is-selected`:``} ${i?`is-taken`:``}`,onClick:()=>m(e),children:e},e)})}),oe&&w(`div`,{class:`cf-form__err`,children:o.bookingSlotTaken}),ue?T(`div`,{class:`cf-form__as`,children:[`as `,ue]}):null,!ce&&w(`input`,{class:`cf-form__input`,type:`text`,placeholder:`${o.handoffName} *`,value:h,"aria-label":o.handoffName,onInput:e=>g(e.target.value)}),!R&&w(C,{children:w(`input`,{class:`cf-form__input`,type:`email`,placeholder:`${o.handoffEmail} *`,value:_,"aria-label":o.handoffEmail,onInput:e=>v(e.target.value)})}),x===`error`&&w(`div`,{class:`cf-form__err`,children:te||o.formError}),T(`div`,{class:`cf-form__actions`,children:[r&&w(`button`,{type:`button`,class:`cf-form__cancel`,onClick:r,children:o.cancel}),w(`button`,{type:`button`,class:`cf-form__submit`,disabled:!le||x===`submitting`,onClick:pe,children:x===`submitting`?o.sending:O[`book-demo`].submit})]})]})},Ie=({actions:e,visitor:t,onSubmitForm:n,onDemoSlots:r,scheduler:i,exclude:a=[]})=>{let[o,s]=S(null),[c,l]=S(!1),u=(e??[]).map(e=>U[e]).filter(e=>!!e&&!a.includes(e.type));if(u.length===0)return null;let d=()=>{s(null),l(!1)},f=()=>s(null);if(o===`book-demo`)return T(`div`,{class:`cf-action-drawer is-open`,role:`dialog`,"aria-label":`Book a demo`,children:[w(`div`,{class:`cf-action-drawer__handle`,"aria-hidden":`true`}),T(`div`,{class:`cf-action-drawer__head`,children:[T(`div`,{children:[w(`span`,{class:`cf-action-drawer__eyebrow`,children:`Contact options`}),w(`strong`,{children:`Book a demo`})]}),w(`button`,{type:`button`,class:`cf-action-drawer__close`,onClick:f,children:w(I,{})})]}),w(Fe,{visitor:t,onCancel:f,onSubmit:(e,t)=>n(`book-demo`,e,t),onDemoSlots:r,scheduler:i})]});if(o){let e=u.find(e=>e.type===o);return T(`div`,{class:`cf-action-drawer is-open`,role:`dialog`,"aria-label":e?.label??`Contact`,children:[w(`div`,{class:`cf-action-drawer__handle`,"aria-hidden":`true`}),T(`div`,{class:`cf-action-drawer__head`,children:[T(`div`,{children:[w(`span`,{class:`cf-action-drawer__eyebrow`,children:`Contact options`}),w(`strong`,{children:e?.label??O[o].title})]}),w(`button`,{type:`button`,class:`cf-action-drawer__close`,onClick:f,children:w(I,{})})]}),w(je,{spec:O[o],visitor:t,onCancel:f,onSubmit:(e,t)=>n(o,e,t)})]})}return c?T(`div`,{class:`cf-action-drawer cf-action-drawer--menu`,children:[w(`div`,{class:`cf-action-drawer__handle`,"aria-hidden":`true`}),T(`div`,{class:`cf-action-drawer__head`,children:[T(`div`,{children:[w(`span`,{class:`cf-action-drawer__eyebrow`,children:`Need help?`}),w(`strong`,{children:`Choose what you want to do`})]}),w(`button`,{type:`button`,class:`cf-action-drawer__close`,onClick:d,children:w(I,{})})]}),w(`div`,{class:`cf-action-drawer__grid`,children:u.map(({type:e,label:t,description:n,Icon:r})=>T(`button`,{type:`button`,class:`cf-action-card`,onClick:()=>s(e),children:[w(`span`,{class:`cf-action-card__icon`,children:w(r,{})}),T(`span`,{class:`cf-action-card__copy`,children:[w(`strong`,{children:t}),w(`small`,{children:n})]}),w(j,{})]},e))}),w(`p`,{class:`cf-action-drawer__note`,children:`Weโll ask for your full name and the best email or phone so the team can reach you.`})]}):T(`button`,{type:`button`,class:`cf-action-trigger`,onClick:()=>l(!0),children:[w(`span`,{class:`cf-action-trigger__icon`,children:w(P,{})}),T(`span`,{class:`cf-action-trigger__copy`,children:[w(`strong`,{children:`Contact options`}),w(`small`,{children:`Demo, message, callback`})]}),w(j,{})]})},Le=({hasEmail:e,visitor:t,question:r,onSubmitForm:i})=>{let a=n(),[o,s]=S(!1),[c,l]=S(!1),[u,d]=S(t.name??``),[f,m]=S(t.email??``);if(e)return T(`div`,{class:`cf-handoff cf-handoff--done`,children:[w(L,{}),w(`span`,{children:`Weโve alerted the team. If someone is available, they can continue here.`})]});if(o){let e=t.email||f;return T(`div`,{class:`cf-handoff cf-handoff--done`,children:[w(L,{}),w(`span`,{children:p(a.handoffShared,{email:e})})]})}let h=async()=>{if(!(!f.trim()||c)){l(!0);try{await i(`inquiry`,{visitorEmail:f.trim(),...u.trim()?{visitorName:u.trim()}:{},message:r||`I had a question the assistant couldnโt answer.`,subject:`Help request from chat`},{email:f.trim(),name:u.trim()||void 0}),s(!0)}catch{l(!1)}}};return T(`div`,{class:`cf-handoff`,children:[w(`div`,{class:`cf-handoff__title`,children:a.handoffTitle}),w(`input`,{class:`cf-form__input`,type:`text`,placeholder:a.handoffName,value:u,"aria-label":a.handoffName,onInput:e=>d(e.target.value)}),w(`input`,{class:`cf-form__input`,type:`email`,placeholder:`${a.handoffEmail} *`,value:f,"aria-label":a.handoffEmail,onInput:e=>m(e.target.value)}),w(`button`,{type:`button`,class:`cf-form__submit`,disabled:!f.trim()||c,onClick:h,children:c?a.sending:a.handoffNotify})]})},Re=({text:e})=>{let t=n(),[r,i]=S(!1);return T(`button`,{type:`button`,class:`cf-tool`,onClick:async()=>{try{await navigator.clipboard.writeText(e),i(!0),setTimeout(()=>i(!1),1500)}catch{}},"aria-label":t.copy,children:[w(r?L:R,{}),r?t.copied:t.copy]})},ze=({items:e,onPick:t})=>e.length===0?null:w(`div`,{class:`cf-starters`,children:e.map((e,n)=>w(`button`,{type:`button`,class:`cf-starter`,onClick:()=>t(e),children:e},n))}),Be=({items:e})=>{let t=e.filter(e=>e.label.trim()&&e.url.trim()).slice(0,4);return t.length===0?null:w(`div`,{class:`cf-featured-links`,children:t.map((e,t)=>T(`a`,{class:`cf-featured-link`,href:e.url,target:`_blank`,rel:`noopener noreferrer nofollow`,title:e.label,children:[w(ie,{}),w(`span`,{children:e.label})]},`${e.url}-${t}`))})},Ve=({msg:e,onRate:t})=>{let r=n(),[i,a]=S(!1),[o,s]=S(``),c=e.feedback,l=()=>{t(e.id,`up`),a(!1)},u=()=>{t(e.id,`down`),a(!0)},d=()=>{t(e.id,`down`,o.trim()),a(!1)};return T(`div`,{class:`cf-feedback`,children:[T(`div`,{class:`cf-feedback__row`,children:[w(`button`,{type:`button`,class:`cf-feedback__btn ${c===`up`?`is-active`:``}`,"aria-label":r.feedbackHelpful,"aria-pressed":c===`up`,onClick:l,children:w(z,{})}),w(`button`,{type:`button`,class:`cf-feedback__btn ${c===`down`?`is-active`:``}`,"aria-label":r.feedbackNotHelpful,"aria-pressed":c===`down`,onClick:u,children:w(pe,{})}),c&&!i&&w(`span`,{class:`cf-feedback__thanks`,children:r.feedbackThanks})]}),i&&c===`down`&&T(`div`,{class:`cf-feedback__comment`,children:[w(`textarea`,{class:`cf-feedback__input`,rows:2,placeholder:r.feedbackCommentPlaceholder,value:o,onInput:e=>s(e.target.value)}),w(`button`,{type:`button`,class:`cf-feedback__send`,onClick:d,children:r.feedbackSend})]})]})},He=({msg:e,persona:r,isLast:i,visitor:a,hasEmail:o,lastQuestion:s,showActions:c,onPickReply:l,onSubmitForm:u,onDemoSlots:d,onRetry:f,ratable:p,onRate:m,onExpandVisualization:h})=>{let g=n(),_=e.role===`user`,v=e.liveEventType??``,y=e.content.trim().toLowerCase(),b=v===`handoff_queued`||v===`agent_joined`||v===`agent_left`||v===`conversation_ended`||y.includes(`joined the chat`)||y.includes(`left the chat`)||y.includes(`support agents will be with you`),x=e.role===`system`||b,S=e.requestedContactFields?.includes(`email`)===!0,E=i&&!_&&!x&&!!(e.handoffOffered||S),ee=E&&!o?[`inquiry`]:[],D=!e.pending&&!e.streaming;return x?w(`div`,{class:`cf-msg cf-msg--system`,children:T(`div`,{class:`cf-system-event`,children:[w(`div`,{class:`cf-system-event__mark`,"aria-hidden":`true`}),w(`div`,{class:`cf-system-event__text`,children:e.content}),e.createdAt&&w(`div`,{class:`cf-system-event__time`,children:new Date(e.createdAt).toLocaleString(void 0,{day:`2-digit`,month:`short`,year:`numeric`,hour:`numeric`,minute:`2-digit`})})]})}):T(`div`,{class:`cf-msg cf-msg--${_?`user`:`agent`}`,children:[!_&&w(De,{persona:r,small:!0}),T(`div`,{class:`cf-msg__col`,children:[e.pending&&e.content===``?w(Oe,{}):e.imageUrl?T(`div`,{class:`cf-msg__bubble cf-msg__bubble--media`,children:[w(`img`,{class:`cf-msg__media`,src:e.imageUrl,alt:`GIF`}),e.content&&w(`span`,{class:`cf-msg__caption`,children:e.content})]}):T(`div`,{class:`cf-msg__bubble`,children:[_?e.content:t(e.content),e.streaming&&w(`span`,{class:`cf-caret`,"aria-hidden":`true`})]}),!_&&e.visualization?w(Ue,{visualization:e.visualization,onExpand:h?()=>h(e.id):void 0,expandControlId:e.id}):null,!_&&e.visualization?.explanation?w(Se,{explanation:e.visualization.explanation,onFollowUp:l,showLead:!e.content.toLocaleLowerCase().includes(e.visualization.explanation.headline.toLocaleLowerCase())}):null,_&&e.attachmentName&&T(`div`,{class:`cf-attach-chip`,title:e.attachmentName,children:[w(ue,{}),w(`span`,{children:e.attachmentName})]}),!_&&T(C,{children:[D&&(e.error||e.content)&&T(`div`,{class:`cf-msg__actions`,children:[w(`div`,{class:`cf-msg__tools`,children:e.error?T(`button`,{type:`button`,class:`cf-tool`,onClick:()=>f(e.id,e.retryText??``),children:[w(ce,{}),g.retry]}):w(Re,{text:e.content})}),p&&!e.error&&e.content&&w(Ve,{msg:e,onRate:m})]}),w(ke,{msg:e}),i&&w(H,{replies:e.suggestedReplies,onPick:l}),E&&w(Le,{hasEmail:o,visitor:a,question:s,onSubmitForm:u}),c&&w(Ie,{actions:e.availableActions,visitor:a,onSubmitForm:u,onDemoSlots:d,scheduler:r?.scheduler,exclude:ee})]})]})]})},Ue=({visualization:e,expanded:t=!1,onExpand:n,onClose:r,expandControlId:o})=>{let l=b(()=>c(e),[e]),[u,f]=S(l?.type);y(()=>f(l?.type),[l]);let p=b(()=>i(e),[e]),m=b(()=>c(e,u),[u,e]),h=e.rows??[],g=e.columns?.length?e.columns:Object.keys(h[0]??{}),_=g.map(t=>{let n=e.columnMetadata?.find(e=>e.key===t);return n?{key:t,label:n.label,dataType:n.dataType,currencyCode:n.currencyCode}:t});if(h.length===0)return w(xe,{});let v=w(ye,{answeredAt:e.freshness?.answeredAt,reportingPeriod:e.reportingPeriod,filters:e.appliedFilters,rowCount:e.rowCount??h.length}),x=()=>e.tableAvailable===!1||g.length===0?null:T(`div`,{class:`cf-analytics-visualization${t?` is-expanded`:``}`,children:[T(`div`,{class:`cf-analytics-visualization__header`,children:[T(`div`,{children:[w(`div`,{class:`cf-analytics-visualization__title`,children:e.title?.trim()||`Result details`}),v]}),T(`div`,{class:`cf-analytics-visualization__actions`,children:[e.downloadAvailable?w(`button`,{type:`button`,class:`cf-analytics-visualization__download`,onClick:()=>We(g,h),children:`Download`}):null,t&&r?w(`button`,{type:`button`,class:`cf-analytics-visualization__close`,"aria-label":`Restore assistant view`,onClick:r,children:w(I,{})}):n&&e.expandable!==!1?w(`button`,{type:`button`,class:`cf-analytics-visualization__expand`,"aria-label":`Expand table`,"data-visualization-message":o,onClick:n,children:w(me,{})}):null]})]}),w(s,{rows:h,columns:_,maxRows:100,expanded:t,classPrefix:`cf`})]});if(e.presentation===`table`||!e.presentation&&e.type===`table`)return x();let C=e.chartRecommendation?.valueFields?.[0]??e.valueFields?.[0]??e.value??g[1];if(e.presentation===`kpi`||!e.presentation&&e.type===`kpi`){let n=h[0]?.[C??g[0]??``],i=typeof n==`number`?n:Number(n),o=e.columnMetadata?.find(e=>e.key===C),s=Number.isFinite(i)?a(i,o,e):String(n??`No value`);return T(`div`,{class:`cf-analytics-visualization${t?` is-expanded`:``}`,children:[T(`div`,{class:`cf-analytics-visualization__header`,children:[T(`div`,{children:[w(`div`,{class:`cf-analytics-visualization__title`,children:`Live metric`}),v]}),t&&r?w(`button`,{type:`button`,class:`cf-analytics-visualization__close`,"aria-label":`Restore assistant view`,onClick:r,children:w(I,{})}):null]}),w(be,{label:o?.label??C??`Current value`,value:s,detail:e.explanation?.summary})]})}return m?T(`div`,{class:`cf-analytics-visualization${t?` is-expanded`:``}`,children:[T(`div`,{class:`cf-analytics-visualization__header`,children:[T(`div`,{children:[w(`div`,{class:`cf-analytics-visualization__title`,children:m.title}),v]}),T(`div`,{class:`cf-analytics-visualization__actions`,children:[p.length>1?T(`label`,{class:`cf-analytics-chart-picker`,children:[w(`span`,{children:`Chart`}),w(`select`,{"aria-label":`Chart type`,value:u??m.type,onChange:e=>f(e.currentTarget.value),children:p.map(e=>w(`option`,{value:e.type,children:e.label},e.type))})]}):null,t&&r?w(`button`,{type:`button`,class:`cf-analytics-visualization__close`,"aria-label":`Restore assistant view`,onClick:r,children:w(I,{})}):n&&e.expandable!==!1?w(`button`,{type:`button`,class:`cf-analytics-visualization__expand`,"aria-label":`Expand chart`,"data-visualization-message":o,onClick:n,children:w(me,{})}):null]})]}),w(d,{model:m,expanded:t}),w(`p`,{class:`cf-analytics-chart__summary`,children:m.summary}),e.downloadAvailable?w(`button`,{type:`button`,class:`cf-analytics-visualization__download`,onClick:()=>We(g,h),children:`Download this data`}):null]}):x()},We=(e,t)=>{if(typeof document>`u`||e.length===0)return;let n=r(t,e),i=URL.createObjectURL(new Blob([n],{type:`text/csv;charset=utf-8`})),a=document.createElement(`a`);a.href=i,a.download=`analytics-result.csv`,a.click(),URL.revokeObjectURL(i)},Ge=e=>new Promise((t,n)=>{let r=new FileReader;r.onload=()=>t(String(r.result).split(`,`)[1]??``),r.onerror=n,r.readAsDataURL(e)}),Ke=({onPick:e})=>w(`div`,{class:`cf-picker cf-emoji`,children:te.map(t=>T(`div`,{class:`cf-emoji__group`,children:[w(`div`,{class:`cf-emoji__label`,children:t.name}),w(`div`,{class:`cf-emoji__grid`,children:t.emojis.map((t,n)=>w(`button`,{type:`button`,class:`cf-emoji__btn`,onClick:()=>e(t),"aria-label":t,children:t},n))})]},t.name))}),qe=({onSearch:e,onPick:t})=>{let r=n(),[i,a]=S(``),[o,s]=S([]),[c,l]=S(!0);return y(()=>{let t=!0;l(!0);let n=setTimeout(()=>{e(i).then(e=>t&&(s(e),l(!1))).catch(()=>t&&(s([]),l(!1)))},300);return()=>{t=!1,clearTimeout(n)}},[i,e]),T(`div`,{class:`cf-picker cf-gif`,children:[w(`input`,{class:`cf-gif__search`,placeholder:r.searchGifs,value:i,"aria-label":r.searchGifs,onInput:e=>a(e.target.value)}),w(`div`,{class:`cf-gif__grid`,children:c?w(`div`,{class:`cf-gif__hint`,children:r.searchingGifs}):o.length===0?w(`div`,{class:`cf-gif__hint`,children:r.noGifs}):o.map(e=>w(`button`,{type:`button`,class:`cf-gif__item`,onClick:()=>t(e.url),"aria-label":e.alt,children:w(`img`,{src:e.preview,alt:e.alt,loading:`lazy`})},e.id))}),w(`div`,{class:`cf-gif__powered`,children:`via Tenor`})]})},Je=e=>{switch(e){case`connecting`:return`Connecting with AIโฆ`;case`listening`:return`Listening now โ go ahead.`;case`speaking`:return`AI is speaking โ talk to interrupt.`;case`processing`:return`Understanding what you saidโฆ`;case`noise`:return`I couldn't hear clear words. Try again closer to the mic.`;case`misunderstood`:return`I didn't understand that. Please try again.`;case`denied`:return`Microphone access is blocked. Allow the mic or type your question.`;case`muted`:return`Muted โ tap the mic to unmute.`;case`timeout`:return`Didn't hear anything for a while โ ending the call.`;default:return``}},Ye=({muted:e,listening:t,micLevel:n,onToggleMute:r})=>w(`button`,{type:`button`,class:`cf-call-btn ${e?`is-muted`:``} ${t?`is-listening`:``} ${t&&n>=.004?`is-hot`:``}`,"aria-label":e?`Unmute microphone`:`Mute microphone`,"aria-pressed":e,onClick:r,style:t?{"--cf-wave":String(Math.max(.2,Math.min(1,n*6)))}:void 0,children:w(e?re:M,{})}),Xe=({audioDevices:e,selectedAudioDeviceId:t,onSelectAudioDevice:n})=>{let[r,i]=S(!1),a=x(null);y(()=>{if(!r)return;let e=e=>{a.current&&!e.composedPath().includes(a.current)&&i(!1)};return document.addEventListener(`mousedown`,e),()=>document.removeEventListener(`mousedown`,e)},[r]);let o=[{deviceId:``,label:`Default microphone`},...e];return T(`div`,{class:`cf-call-more`,ref:a,children:[w(`button`,{type:`button`,class:`cf-call-btn cf-call-btn--microphones`,"aria-label":`Choose microphone`,"aria-expanded":r,onClick:()=>i(e=>!e),children:w(j,{})}),r&&T(`div`,{class:`cf-call-menu`,role:`menu`,children:[w(`div`,{class:`cf-call-menu__label`,children:`Microphone`}),o.map(e=>T(`button`,{type:`button`,role:`menuitemradio`,"aria-checked":e.deviceId===t,class:`cf-call-menu__item ${e.deviceId===t?`is-active`:``}`,onClick:()=>{n(e.deviceId),i(!1)},children:[e.deviceId===t?w(L,{}):w(`span`,{class:`cf-call-menu__spacer`}),w(`span`,{children:e.label})]},e.deviceId))]})]})},Ze=({voiceState:e,muted:t,onToggleMute:n,onEndCall:r,onTalkNow:i,showTalkNow:a,micLevel:o,theaterMode:s,onToggleTheater:c,onMinimize:l,audioDevices:u,selectedAudioDeviceId:d,onSelectAudioDevice:f})=>T(`div`,{class:`cf-call-controls`,children:[w(Ye,{muted:t,listening:e===`listening`&&!t,micLevel:o,onToggleMute:n}),w(Xe,{audioDevices:u,selectedAudioDeviceId:d,onSelectAudioDevice:f}),a&&w(`button`,{type:`button`,class:`cf-call-btn cf-call-btn--talk`,"aria-label":`Talk now`,onClick:i,children:w(M,{})}),w(`button`,{type:`button`,class:`cf-call-btn`,"aria-label":s?`Exit expanded view`:`Expand view`,"aria-pressed":s,onClick:c,children:w(s?he:me,{})}),w(`button`,{type:`button`,class:`cf-call-btn`,"aria-label":`Minimize voice chat`,onClick:l,children:w(ge,{})}),w(`button`,{type:`button`,class:`cf-call-btn cf-call-btn--end`,"aria-label":`End voice chat`,onClick:r,children:w(de,{})})]}),Qe=({persona:e,voiceState:t,muted:n,onToggleMute:r,onEndCall:i,micLevel:a,onExpand:o})=>{let s=e=>e.stopPropagation(),c=e?.assistantMediaUrl?.trim()||e?.agentAvatarUrl?.trim()||``,l=e?.assistantMediaKind===`video`&&!!c,u=e?.agentName||`Assistant`;return T(`div`,{class:[`cf-floating-call-card`,t===`listening`&&!n?`is-listening`:``,t===`speaking`?`is-speaking`:``,t===`processing`||t===`connecting`?`is-thinking`:``,n?`is-muted`:``].filter(Boolean).join(` `),style:t===`listening`&&!n?{"--cf-listen":String(Math.max(.18,Math.min(1,a*8)))}:void 0,role:`button`,tabIndex:0,"aria-label":`Reopen voice chat with ${u}`,onClick:o,onKeyDown:e=>{(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),o())},children:[w(`div`,{class:`cf-floating-call-card__media`,"aria-hidden":`true`,children:c?l?w(`video`,{src:c,muted:!0,loop:!0,playsInline:!0,autoPlay:!0}):w(`img`,{src:c,alt:``}):T(`div`,{class:`cf-floating-call-card__avatar${Te(e)}`,children:[w(`span`,{children:V(e)}),w(`span`,{class:`cf-floating-call-card__eye cf-floating-call-card__eye--left`}),w(`span`,{class:`cf-floating-call-card__eye cf-floating-call-card__eye--right`}),w(`span`,{class:`cf-floating-call-card__mouth`})]})}),w(`div`,{class:`cf-floating-call-card__shade`,"aria-hidden":`true`}),T(`div`,{class:`cf-floating-call-card__controls`,onClick:s,onKeyDown:s,role:`presentation`,children:[w(Ye,{muted:n,listening:t===`listening`&&!n,micLevel:a,onToggleMute:r}),w(`button`,{type:`button`,class:`cf-call-btn cf-call-btn--restore`,"aria-label":`Restore voice chat`,onClick:e=>{s(e),o()},children:w(B,{})}),w(`button`,{type:`button`,class:`cf-call-btn cf-call-btn--end`,"aria-label":`End voice chat`,onClick:e=>{s(e),i()},children:w(de,{})})]})]})},$e=({onSend:e,onSendGif:t,onTyping:r,disabled:i,allowVoice:a,onTranscribe:o,gifEnabled:s,onSearchGifs:c,allowAttach:l,onExtract:u,voiceStartSignal:d=0,onVoiceStateChange:f})=>{let p=n(),[m,h]=S(``),[g,_]=S(!1),[v,b]=S(!1),[E,te]=S(`idle`),[O,k]=S(`none`),[A,j]=S(null),[re,ie]=S(!1),[N,P]=S(``),F=x(null),oe=x(null),se=x(null),L=x(null),R=x([]),ce=x(void 0),le=x(null),de=x(void 0),fe=x(0),z=e=>{te(e),f?.(e)},pe=()=>{ce.current&&window.clearTimeout(ce.current),ce.current=void 0,de.current&&cancelAnimationFrame(de.current),de.current=void 0,le.current?.close().catch(()=>void 0),le.current=null};y(()=>{let e=F.current;e&&(e.style.height=`auto`,e.style.height=`${Math.min(e.scrollHeight,110)}px`)},[m]),y(()=>{if(O===`none`)return;let e=e=>{oe.current&&!e.composedPath().includes(oe.current)&&k(`none`)};return document.addEventListener(`mousedown`,e),()=>document.removeEventListener(`mousedown`,e)},[O]);let me=e=>k(t=>t===e?`none`:e),he=e=>{let t=F.current;if(!t){h(t=>t+e);return}let n=t.selectionStart??m.length,r=t.selectionEnd??m.length;h(m.slice(0,n)+e+m.slice(r)),requestAnimationFrame(()=>{t.focus();let r=n+e.length;t.setSelectionRange(r,r)})},ge=e=>{k(`none`),t(e)},B=async e=>{let t=e.target,n=t.files?.[0];if(t.value=``,n){if(P(``),n.size>8388608){P(p.attachTooLarge);return}ie(!0);try{let e=await u(await Ge(n),n.type||`application/octet-stream`,n.name);if(!e){P(p.attachFailed);return}j({name:n.name,text:e})}catch{P(p.attachFailed)}finally{ie(!1)}}},_e=(!!m.trim()||!!A)&&!i&&!re&&!v,ve=()=>{_e&&(e(m,A?{attachmentName:A.name,attachmentText:A.text}:void 0),r?.(!1),h(``),j(null),P(``))},ye=t=>{let n=t.trim();if(!n||i){z(`misunderstood`),window.setTimeout(()=>z(`idle`),2500);return}let a=m.trim();e(a?`${a} ${n}`:n),r?.(!1),h(``),j(null),P(``),z(`idle`)},be=e=>{e.key===`Enter`&&!e.shiftKey?(e.preventDefault(),ve()):e.key===`Escape`&&O!==`none`&&(e.preventDefault(),e.stopPropagation(),k(`none`))},xe=async()=>{if(g){D(L.current);return}try{z(`connecting`);let e=await navigator.mediaDevices.getUserMedia({audio:!0}),t=ee(e);R.current=[],fe.current=0;try{let t=window.AudioContext??window.webkitAudioContext;if(t){let n=new t;le.current=n;let r=n.createMediaStreamSource(e),i=n.createAnalyser();i.fftSize=512,r.connect(i);let a=new Uint8Array(i.frequencyBinCount),o=()=>{i.getByteTimeDomainData(a);let e=0;for(let t of a){let n=(t-128)/128;e+=n*n}fe.current=Math.max(fe.current,Math.sqrt(e/a.length)),de.current=requestAnimationFrame(o)};o()}}catch{}t.ondataavailable=e=>e.data.size>0&&R.current.push(e.data),t.onstop=async()=>{pe(),e.getTracks().forEach(e=>e.stop()),_(!1);let n=new Blob(R.current,{type:t.mimeType||`audio/webm`});if(n.size===0||n.size<900||fe.current<.006){z(`noise`),window.setTimeout(()=>z(`idle`),3200);return}b(!0),z(`processing`);try{let e=await Ge(n);if(!e.trim()){z(`noise`),window.setTimeout(()=>z(`idle`),3200);return}let t=typeof navigator<`u`&&(navigator.languages?.[0]||navigator.language)||void 0;ye(await o(e,n.type,t))}catch{z(`misunderstood`),window.setTimeout(()=>z(`idle`),3e3)}finally{b(!1)}},L.current=t,t.start(250),_(!0),z(`listening`),ce.current=window.setTimeout(()=>{D(L.current)},12e3)}catch{z(`denied`),window.setTimeout(()=>z(`idle`),3500)}};return y(()=>{!d||!a||i||g||v||xe()},[d]),y(()=>()=>pe(),[]),T(`div`,{class:`cf-composer`,ref:oe,children:[O===`emoji`&&w(Ke,{onPick:he}),O===`gif`&&w(qe,{onSearch:c,onPick:ge}),(A||re||N)&&w(`div`,{class:`cf-attach-row`,children:re?w(`span`,{class:`cf-attach-status`,children:p.attaching}):N?w(`span`,{class:`cf-attach-status cf-attach-status--err`,children:N}):A&&T(`span`,{class:`cf-attach-chip`,title:A.name,children:[w(ue,{}),w(`span`,{children:A.name}),w(`button`,{type:`button`,class:`cf-attach-x`,"aria-label":`Remove attachment`,onClick:()=>j(null),children:w(I,{})})]})}),E!==`idle`&&T(`div`,{class:`cf-voice-state`,"aria-live":`polite`,children:[w(`span`,{class:`cf-voice-state__dot ${g?`is-live`:``}`}),Je(E)]}),T(`div`,{class:`cf-composer__field`,children:[w(`button`,{type:`button`,class:`cf-iconbtn ${O===`emoji`?`is-active`:``}`,"aria-label":p.emoji,"aria-pressed":O===`emoji`,onClick:()=>me(`emoji`),children:w(O===`emoji`?I:ae,{})}),s&&w(`button`,{type:`button`,class:`cf-iconbtn cf-gifbtn ${O===`gif`?`is-active`:``}`,"aria-label":p.gifs,"aria-pressed":O===`gif`,onClick:()=>me(`gif`),children:w(`span`,{class:`cf-gif-label`,children:`GIF`})}),l&&T(C,{children:[w(`input`,{ref:se,type:`file`,class:`cf-file-input`,accept:`image/png,image/jpeg,image/webp,image/gif,application/pdf`,onChange:B,tabIndex:-1,"aria-hidden":`true`}),w(`button`,{type:`button`,class:`cf-iconbtn`,"aria-label":p.attachFile,disabled:re,onClick:()=>se.current?.click(),children:w(ue,{})})]}),w(`textarea`,{ref:F,class:`cf-textarea`,rows:1,placeholder:p.composerPlaceholder,value:m,"aria-label":p.composerPlaceholder,disabled:i,onInput:e=>{let t=e.target.value;h(t),r?.(!!t.trim())},onKeyDown:be}),a&&w(`button`,{type:`button`,class:`cf-iconbtn cf-mic ${g?`is-recording`:``}`,"aria-label":g?p.stopRecording:p.recordVoice,"aria-pressed":g,disabled:v||i,onClick:xe,children:w(M,{})}),w(`button`,{type:`button`,class:`cf-send`,"aria-label":p.send,disabled:!_e,onClick:ve,children:w(ne,{})})]})]})},et=({name:e,greeting:t})=>T(`section`,{class:`cf-empty-welcome`,"aria-label":`${e} welcome`,children:[w(`span`,{class:`cf-empty-welcome__eyebrow`,children:`Ready when you are`}),w(`h2`,{children:e}),t?w(`p`,{children:t}):w(`p`,{children:`Ask a question, leave a message, or book a demo.`})]}),tt=e=>{let[t,n]=S(`light`);return y(()=>{if(e!==`auto`||typeof matchMedia>`u`)return;let t=matchMedia(`(prefers-color-scheme: dark)`),r=()=>n(t.matches?`dark`:`light`);return r(),t.addEventListener(`change`,r),()=>t.removeEventListener(`change`,r)},[e]),e===`auto`?t:e},nt=1e4,rt=.0022,it=1600,at=6e4,ot=e=>e.replace(/\[[^\]]{0,60}\]/g,` `).replace(/\(([^)]{0,60})\)/g,(e,t)=>st.has(t.trim().toLowerCase().replace(/[.!?,โฆ]+$/,``).replace(/\s+/g,` `))?` `:e).replace(/\*[^*]{0,60}\*/g,` `).replace(/\s+/g,` `).trim(),st=new Set(`background noise.engine noise.noise.inaudible.unintelligible.silence.no speech.static.music.laughter.applause.wind.breathing.click.clicks.clicking.mouse click.mouse clicks.beep.beeps.beeping.tap.taps.tapping.typing.keyboard typing.cough.coughing.sigh.hmm.mm.mmm.uh.um.ah.oh`.split(`.`)),ct=e=>{let t=e.trim().toLowerCase().replace(/[()[\]*]/g,` `).replace(/[.!?,โฆ]+$/,``).replace(/\s+/g,` `).trim();return!t||/^(?:sh+\s*)+$/.test(t)?!0:st.has(t)},lt=e=>{let t=e.trim().toLowerCase().replace(/\s+/g,` `);return t?t.includes(`transcribe this audio recording verbatim`)||t.includes(`preserve the spoken language and any code-switching`)||t.includes(`output only the transcribed text, no commentary`):!1},ut={end:`end the call`,mute:`mute your microphone`,minimize:`minimize the chat`,expand:`expand the view`,shrink:`exit the expanded view`},dt=e=>e.trim().toLowerCase().replace(/[^\p{L}\p{N}\s']/gu,` `).replace(/\s+/g,` `).trim(),ft=[{action:`shrink`,re:/\b(?:exit|leave|quit|close)\b[\s\w]*\b(?:full ?screen|expanded|theat(?:er|re))\b|\bshrink\b|\bsmaller view\b/},{action:`end`,re:/\b(?:end|close|stop|finish|hang ?up|quit|exit)\b[\s\w]*\b(?:call|chat|conversation|convo|session|talking)\b|\bhang ?up\b|\bgood ?bye\b|^bye(?: bye)?$/},{action:`mute`,re:/\bmute\b|\bstop listening\b/},{action:`minimize`,re:/\bminimi[sz]e\b|\bhide\b[\s\w]*\b(?:chat|call|window|widget)\b/},{action:`expand`,re:/\bexpand\b|\bmaximi[sz]e\b|\bfull ?screen\b|\btheat(?:er|re) mode\b|\bbigger view\b/}],pt=/^(?:yes|yeah|yep|yup|sure|correct|confirm|affirmative|go ahead|do it|please do|ok(?:ay)?)\b/,mt=/^(?:no|nope|nah|cancel|never ?mind|don'?t|stop)\b/,ht=/^(?:end|close|stop|finish|hang ?up|quit|exit|bye|good ?bye)\b/,gt=e=>{let t=dt(e);if(!t)return null;for(let{action:e,re:n}of ft)if(n.test(t)){let n=t.split(` `).length;return{action:e,confident:e===`end`?n<=10:n<=6}}return null},_t=e=>`I didn't catch yes or no. Say yes to ${ut[e]}, or no to keep talking.`,vt=e=>`I caught some audio, but not enough clear words. Try again a little closer to the mic, or type your question for ${e?.agentName?.trim()||`the assistant`}.`,yt=e=>{let t=dt(e).replace(/\b(?:um|uh|erm|hmm)\b/g,``).trim();return!t||t.split(/\s+/).length<=2&&/^(?:can|could|would|will|do|does|is|are|what|why|how|where|when)\b/.test(t)?!0:/\b(?:can you|could you|would you|will you|do you|can i|could i|would i|i want to|i need to|tell me about|what about|how about|about|with|to|for|please)$/i.test(t)},bt=e=>new Promise((t,n)=>{let r=new FileReader;r.onload=()=>t(String(r.result??``).split(`,`)[1]??``),r.onerror=()=>n(r.error),r.readAsDataURL(e)}),xt=(e,t)=>{let n=window.AudioContext??window.webkitAudioContext;if(!n)return null;let r,i=!1,a=new n;try{let n=a.createMediaStreamSource(e),o=a.createAnalyser();o.fftSize=512,n.connect(o);let s=new Uint8Array(o.frequencyBinCount),c=()=>{if(i)return;o.getByteTimeDomainData(s);let e=0;for(let t of s){let n=(t-128)/128;e+=n*n}t(Math.sqrt(e/s.length),performance.now()),i||(r=requestAnimationFrame(c))};c()}catch{return a.close().catch(()=>void 0),null}return{stop:()=>{i||(i=!0,r!==void 0&&cancelAnimationFrame(r),r=void 0,a.close().catch(()=>void 0))}}},St=e=>({...e?{deviceId:{exact:e}}:{},echoCancellation:!0,noiseSuppression:!0,autoGainControl:!0}),Ct=({transport:e,config:t,bindControls:n})=>{let r=t.strings,[i,a]=S(t.openByDefault),{persona:s,messages:c,sending:d,assistantSpeaking:p,visitor:m,hasEmail:h,liveMode:g,assignedAgentName:_,agentTypingName:b,starters:E,featuredLinks:te,send:O,sendGif:k,notifyTyping:ne,stop:M,retry:re,rateMessage:ie,injectAssistant:N,appendUserDraft:P,patchMessage:F,removeMessage:ae,submitCsat:I,submitForm:L,transcribe:R,extract:ce,searchGifs:ue,demoSlots:me,gifEnabled:he,identify:ge,ended:B,endConversation:ve,startNew:ye,history:be,viewingSessionId:xe,viewMessages:Se,openConversation:Ce,closeHistoryView:we,shutdown:Te,stopSpeaking:Ee,speakAssistantText:V}=l(e,t,i),[Oe,ke]=S(0),[H,U]=S(`idle`),[W,je]=S(!1),[G,Me]=S(!1),[Ne,Pe]=S(0),[K,Fe]=S(!1),[Le,Re]=S(null),[Ve,We]=S([]),[Ge,Ke]=S(``),[qe,Je]=S(()=>{try{return localStorage.getItem(`centrinfo:muted`)===`1`}catch{return!1}}),Ye=tt(t.theme),Xe=c.some(e=>e.role===`assistant`&&(e.pending||e.streaming)),Ze=d||Xe||p,st=s?.soundEnabled??!0;y(()=>{o(t.sound&&st&&!qe)},[t.sound,st,qe]);let ft=v(()=>{Je(e=>{let t=!e;try{localStorage.setItem(`centrinfo:muted`,t?`1`:`0`)}catch{}return t})},[]),Ct=x(null),wt=x(null),Tt=x(null),Et=x(0),q=x(!1),J=x(!1),Y=x(!1),Dt=x(0),Ot=x(!1),X=x(null),kt=x(null),At=x([]),jt=x(void 0),Mt=x(void 0),Nt=x(null),Pt=x(0),Ft=x(0),It=x(!1),Lt=x(0),Rt=x(null),zt=x(null),Bt=x(0),Vt=x(null),Ht=x([]),Ut=x(0),Wt=x(0),Gt=x(0),Kt=x(null),qt=x(!1),Jt=x(null),Yt=x(``),Xt=x(()=>{}),Zt=x(``),Qt=x(d),$t=x(p),en=x(Ze),tn=x(H),nn=x(0);y(()=>{Qt.current=d},[d]),y(()=>{$t.current=p},[p]),y(()=>{en.current=Ze},[Ze]),y(()=>{tn.current=H},[H]);let[rn,an]=S(!0),[on,sn]=S(!1),cn=x(0),[ln,un]=S(!1),dn=x(null),[fn,pn]=S(!1),[mn,hn]=S(!1),Z=!!xe,gn=Z?Se:c,_n=gn.find(e=>e.id===Le&&e.visualization)?.visualization;y(()=>{!Le||_n||(Re(null),Fe(!1))},[_n,Le]);let vn=v(()=>{a(!0),ke(0),f(`open`),t.onOpen?.(),t.onShow?.()},[t]),yn=v(()=>{a(!1),Fe(!1),Re(null),t.onClose?.(),t.onHide?.(),wt.current?.focus()},[t]),bn=v(()=>i?yn():vn(),[i,vn,yn]),xn=v(()=>un(!0),[]),Sn=v(()=>{ve(),un(!1)},[ve]),Cn=v(()=>{ye(),sn(!1),an(!0)},[ye]);y(()=>{ln&&dn.current?.focus()},[ln]),y(()=>{n({open:vn,close:yn,toggle:bn,identify:ge,startNew:ye,endConversation:ve,shutdown:Te})},[n,vn,yn,bn,ge,ye,ve,Te]),y(()=>{let e=c.filter(e=>e.role===`assistant`&&!e.pending).length;if(i){Et.current=e;return}e>Et.current&&ke(e-Et.current)},[c,i]),y(()=>{t.onUnreadChange?.(Oe)},[Oe,t]),y(()=>{let e=t.sessionDurationMinutes;if(!e||e<=0)return;let n=setTimeout(()=>Te(),e*60*1e3);return()=>clearTimeout(n)},[t.sessionDurationMinutes,c,i,Te]),y(()=>{let e=t.customLauncherSelector;if(!e||typeof document>`u`)return;let n=[];try{n=Array.from(document.querySelectorAll(e))}catch{return}let r=e=>{e.preventDefault(),bn()};return n.forEach(e=>e.addEventListener(`click`,r)),()=>n.forEach(e=>e.removeEventListener(`click`,r))},[t.customLauncherSelector,bn]);let wn=x(!1);y(()=>{let e=t.proactiveMessage?.trim();if(!e||wn.current)return;let n=t.proactiveOnPaths??[],r=typeof location<`u`?location.pathname:``;if(n.length>0&&!n.some(e=>r.includes(e)))return;let a=`centrinfo:proactive:${t.token.slice(0,12)}`;try{if(sessionStorage.getItem(a)===`1`)return}catch{}let o=setTimeout(()=>{if(!(i||B||c.some(e=>e.role===`user`))){wn.current=!0;try{sessionStorage.setItem(a,`1`)}catch{}N(e),vn()}},Math.max(0,t.proactiveDelaySeconds)*1e3);return()=>clearTimeout(o)},[t.proactiveMessage]),y(()=>{let e=Tt.current;if(!i||!e)return;let t=c[c.length-1],n=Date.now()<cn.current;t?.role===`user`||rn||n?(requestAnimationFrame(()=>{e.scrollTop=e.scrollHeight}),sn(!1),n&&an(!0)):sn(!0)},[c,i,d,rn]);let Tn=v(()=>{let e=Tt.current;if(!e)return;if(q.current&&!Z){an(!0),sn(!1);return}let t=e.scrollHeight-e.scrollTop-e.clientHeight<80;an(t),t&&sn(!1)},[Z]),En=v(()=>{let e=Tt.current;e&&(e.scrollTop=e.scrollHeight),sn(!1),an(!0)},[]),Dn=v(()=>{cn.current=Date.now()+3e3,requestAnimationFrame(En)},[En]);y(()=>{if(!i||Z||!W||H===`connecting`)return;cn.current=Date.now()+6e4,En();let e=requestAnimationFrame(()=>{En(),requestAnimationFrame(En)}),t=[80,180,360].map(e=>window.setTimeout(En,e));return()=>{cancelAnimationFrame(e),t.forEach(e=>window.clearTimeout(e))}},[p,c,i,En,d,W,Z,H]);let On=v(()=>{Ct.current?.querySelector(`.cf-textarea`)?.focus()},[]),kn=v(()=>{jt.current&&window.clearTimeout(jt.current),jt.current=void 0,Mt.current&&window.clearTimeout(Mt.current),Mt.current=void 0,Nt.current?.stop(),Nt.current=null,Pe(0)},[]),An=v(()=>{zt.current?.stop(),zt.current=null,D(Vt.current),Rt.current?.getTracks().forEach(e=>e.stop()),Rt.current=null,Bt.current=0,Wt.current=0},[]),jn=v(()=>{kn(),kt.current?.getTracks().forEach(e=>e.stop()),kt.current=null},[kn]),Q=v(()=>{q.current=!1,Y.current=!1,J.current=!1,Ot.current=!1,Kt.current=null,qt.current=!1,Jt.current=null,Yt.current=``,je(!1),Me(!1),Fe(!1),Re(null),An(),Ee();let e=X.current;e?.state===`recording`?D(e):(jn(),U(`idle`))},[An,Ee,jn]),Mn=v(()=>{K&&Re(null),Fe(!K)},[K]),Nn=v(e=>{Re(e),Fe(!0)},[]),Pn=v(()=>{let e=Le;Re(null),Fe(!1),window.requestAnimationFrame(()=>{Array.from(Ct.current?.querySelectorAll(`[data-visualization-message]`)??[]).find(t=>t.dataset.visualizationMessage===e)?.focus()})},[Le]),Fn=v(()=>{Re(null),Fe(!1)},[]),In=v((e,t)=>{if(Date.now()-Dt.current>=at){U(`timeout`),Mt.current=window.setTimeout(()=>Q(),2400);return}U(e),Mt.current=window.setTimeout(()=>{q.current&&!J.current&&!$t.current&&t()},1400)},[Q]),Ln=v((e,t,n)=>{Date.now()-Dt.current<at&&!J.current&&(Y.current=!0,V(t)),In(e,n)},[In,V]),Rn=v((e,t)=>{Dn(),Dt.current=Date.now(),Y.current=!0,t&&F(t,{content:e,pending:!0,streaming:!1});let n=()=>{if(q.current){if(Qt.current){window.setTimeout(n,80);return}t&&Jt.current===t&&(Jt.current=null),O(e,{forceVoicePlayback:!0,userMessageId:t})}};n()},[Dn,F,O]),zn=v(async(e,t,n,r=`normal`,i)=>{let a=null,o=e=>a||(Dn(),a=Jt.current||P(e),Jt.current=a,F(a,{content:Yt.current||e,pending:!0,streaming:!1}),a),c=()=>{a&&(Jt.current===a&&(Jt.current=null),Yt.current=``,ae(a),a=null)},l=()=>{Yt.current=``,U(`listening`),window.setTimeout(()=>{q.current&&!J.current&&!Qt.current&&!X.current&&n()},120)},u=e.size===0,d=e.size<350&&t<.001;if(u||d){if(r===`barge`){l();return}let e=Kt.current;Ln(`noise`,e?_t(e):vt(s),n),Yt.current=``;return}U(`processing`);let f=++nn.current,p=o(`Listening...`);try{let t=typeof navigator<`u`&&(navigator.languages?.[0]||navigator.language)||void 0;F(p,{content:Yt.current?`${Yt.current} ...`:`Transcribing...`,pending:!0});let a=await bt(e);if(!a.trim()){if(c(),r===`barge`){l();return}Ln(`noise`,Kt.current?_t(Kt.current):vt(s),n);return}let o=ot(await R(a,e.type,t,i));if(f!==nn.current){c();return}let u=[Yt.current,o].map(e=>e.trim()).filter(Boolean).join(` `).replace(/\s+/g,` `).trim();if(!u||ct(u)||lt(u)){if(c(),r===`barge`){l();return}let e=Kt.current;Ln(`misunderstood`,e?_t(e):vt(s),n);return}let d=Kt.current;if(d){let e=dt(u);if(pt.test(e)||d===`end`&&ht.test(e)){c(),Kt.current=null,Xt.current(d);return}if(mt.test(e)){c(),Kt.current=null;let e=`Okay, never mind โ what would you like to know?`;N(e),Y.current=!0,U(`speaking`),V(e);return}c();let t=_t(d);N(t),Y.current=!0,U(`speaking`),V(t);return}let m=gt(u);if(m){if(c(),Dt.current=Date.now(),m.confident){Xt.current(m.action);return}Kt.current=m.action;let e=`Just to confirm โ you want me to ${ut[m.action]}? Please say yes or no.`;N(e),Y.current=!0,U(`speaking`),V(e);return}if(F(p,{content:u,pending:!0}),yt(u)){Yt.current=u,U(`listening`),n();return}Yt.current=``,Rn(u,p)}catch(e){if(c(),r===`barge`){l();return}Ln(`misunderstood`,`I couldn't convert your speech to text. Please check the speech service configuration or type your question.${e instanceof Error&&e.message.trim()?` (${e.message.trim()})`:``}`,n)}},[P,Dn,Ln,N,F,s,ae,Rn,V,R]),$=v(async()=>{if(!(!q.current||J.current)&&!(!s?.allowVoiceInput||B||Z)&&!Qt.current&&!X.current){An(),Y.current=!1;try{U(`connecting`);let e=await navigator.mediaDevices.getUserMedia({audio:St(Zt.current)});if(!q.current||J.current){e.getTracks().forEach(e=>e.stop());return}navigator.mediaDevices.enumerateDevices().then(e=>{We(e.filter(e=>e.kind===`audioinput`).map((e,t)=>({deviceId:e.deviceId,label:e.label||`Microphone ${t+1}`})))}).catch(()=>{});let t=ee(e);X.current=t,kt.current=e,At.current=[],Pt.current=0,It.current=!1,Lt.current=0;let n=performance.now();Nt.current=xt(e,(e,r)=>{if(Pt.current=Math.max(Pt.current,e),e>=.0038)It.current=!0,Lt.current=0;else if(It.current&&e<=rt){Lt.current||(Lt.current=r);let e=r-Lt.current,i=r-n;if(e>=it&&i>=550&&t.state===`recording`){D(t);return}}else Lt.current=0;r-Ft.current>90&&(Ft.current=r,Pe(e))}),t.ondataavailable=e=>{e.data.size>0&&At.current.push(e.data)},t.onstop=async()=>{if(jn(),X.current=null,Ot.current){Ot.current=!1,q.current&&!J.current?(U(`idle`),$()):U(q.current&&J.current?`muted`:`idle`);return}if(!q.current){U(`idle`);return}await zn(new Blob(At.current,{type:t.mimeType||`audio/webm`}),Pt.current,$,`normal`,Math.max(0,(performance.now()-n)/1e3))},t.start(250),U(`listening`),jt.current=window.setTimeout(()=>{D(X.current)},nt)}catch{U(`denied`),Mt.current=window.setTimeout(()=>Q(),3500)}}},[B,Q,zn,s,s?.allowVoiceInput,An,jn,Z]),Bn=v(()=>{if(q.current){Q();return}On(),!(!s?.allowVoiceInput||Qt.current||B||Z)&&(Dt.current=Date.now(),Y.current=!1,J.current=!1,q.current=!0,Me(!1),je(!0),U(`connecting`),$())},[B,Q,On,s,s?.allowVoiceInput,$,Z]),Vn=v(()=>{Me(e=>{let t=!e;if(J.current=t,t){let e=X.current;e?.state===`recording`?(Ot.current=!0,D(e)):(jn(),U(`muted`))}else q.current&&!B&&!Z&&(U(`idle`),$());return t})},[B,$,jn,Z]),Hn=v((e,t)=>{N(e),t&&(Y.current=!0),U(`speaking`),V(e)},[N,V]),Un=v(e=>{switch(Dt.current=Date.now(),e){case`end`:Y.current=!1,qt.current=!0,Hn(`Okay โ ending our call now. Goodbye!`,!1),window.setTimeout(()=>{qt.current&&(qt.current=!1,Q())},2e3);break;case`mute`:{J.current||Vn();let e=`Muted. Tap the mic button when you want me to listen again.`;N(e),V(e);break}case`minimize`:yn(),Hn(`Minimized โ I'm still listening. Tap the call pill to bring the chat back.`,!0);break;case`expand`:Fe(!0),Hn(`Sure โ expanding the view.`,!0);break;case`shrink`:Re(null),Fe(!1),Hn(`Okay โ back to the smaller view.`,!0);break}},[yn,Q,N,V,Hn,Vn]);y(()=>{Xt.current=Un},[Un]);let Wn=x(!1);y(()=>{Wn.current&&!p&&qt.current&&(qt.current=!1,Q()),Wn.current=p},[p,Q]);let Gn=v(e=>{Zt.current=e,Ke(e);let t=X.current;t?.state===`recording`&&(Ot.current=!0,D(t))},[]),Kn=v(()=>{if(!(!q.current||J.current)){if(An(),M(),Ee(),Dt.current=Date.now(),U(`listening`),Qt.current){let e=()=>{if(!(!q.current||J.current)){if(Qt.current){window.setTimeout(e,70);return}Y.current=!1,$()}};window.setTimeout(e,70);return}Y.current=!1,$()}},[$,M,An,Ee]),qn=v(async()=>{if(!(Rt.current||zt.current)&&!(!q.current||J.current))try{let e=await navigator.mediaDevices.getUserMedia({audio:St(Zt.current)});if(!q.current||J.current||X.current||Rt.current||!en.current&&tn.current!==`processing`){e.getTracks().forEach(e=>e.stop());return}Rt.current=e,Bt.current=0,Wt.current=0,Gt.current=0;let t=()=>{if(Vt.current)return;M(),Ee(),nn.current+=1,Dt.current=Date.now(),Y.current=!1,U(`listening`);let t=ee(e);Vt.current=t,Ht.current=[],Ut.current=performance.now(),Wt.current=0,t.ondataavailable=e=>{e.data.size>0&&Ht.current.push(e.data)},t.onstop=async()=>{let e=Ht.current,n=Gt.current,r=t.mimeType||`audio/webm`;Vt.current=null,Ht.current=[],An(),q.current&&await zn(new Blob(e,{type:r}),n,$,`barge`,Math.max(0,(performance.now()-Ut.current)/1e3))},t.start(250)};zt.current=xt(e,(e,n)=>{if(Gt.current=Math.max(Gt.current,e),n-Ft.current>90&&(Ft.current=n,Pe(e)),e>=.009)Bt.current||(Bt.current=n),n-Bt.current>=280&&t(),Wt.current=0;else if(Vt.current&&e<=rt){Wt.current||(Wt.current=n);let e=n-Wt.current,t=n-Ut.current;e>=it&&t>=550&&Vt.current.state===`recording`&&D(Vt.current)}else Vt.current&&n-Ut.current>=nt&&Vt.current.state===`recording`?D(Vt.current):(Bt.current=0,Wt.current=0)}),zt.current||An()}catch{}},[zn,$,M,An,Ee]);y(()=>{if(!(W&&!G&&!B&&!Z&&(Ze||H===`processing`))){An();return}let e=window.setTimeout(()=>void qn(),250);return()=>window.clearTimeout(e)},[Ze,B,qn,An,W,G,H,Z]);let Jn=W&&!G&&(d||p||H===`processing`);y(()=>{!W||G||p&&U(`speaking`)},[p,W,G]),y(()=>{if(!W||G||!Y.current||d||p||![`processing`,`speaking`,`noise`,`misunderstood`].includes(H))return;let e=window.setTimeout(()=>{!q.current||J.current||Qt.current||(Y.current=!1,$())},700);return()=>window.clearTimeout(e)},[p,d,$,W,G,H]),y(()=>()=>Q(),[Q]);let[Yn,Xn]=S(``),Zn=x(!1);y(()=>{if(Zn.current&&!d){let e=[...c].reverse().find(e=>e.role===`assistant`&&!e.streaming&&!e.pending&&e.content);e&&Xn(e.content)}Zn.current=d},[d,c]),y(()=>{if(!i)return;let e=Ct.current;ln||e?.querySelector(`.cf-textarea`)?.focus();let t=t=>{if(t.key===`Escape`){if(t.preventDefault(),ln){un(!1);return}yn();return}if(t.key!==`Tab`||!e)return;let n=e.querySelectorAll(`button, [href], textarea, input, [tabindex]:not([tabindex="-1"])`),r=Array.from(n).filter(e=>!e.hasAttribute(`disabled`));if(r.length===0)return;let i=r[0],a=r[r.length-1],o=e.getRootNode()instanceof ShadowRoot?e.getRootNode().activeElement:document.activeElement;t.shiftKey&&o===i?(t.preventDefault(),a.focus()):!t.shiftKey&&o===a&&(t.preventDefault(),i.focus())};return e?.addEventListener(`keydown`,t),()=>e?.removeEventListener(`keydown`,t)},[i,yn,ln]),y(()=>{let e=Ct.current;e&&(i?e.removeAttribute(`inert`):e.setAttribute(`inert`,``))},[i]);let Qn=t.accentColor??t.themeTokens?.accent??s?.accentColor,$n={zIndex:t.zIndex,"--cf-h-pad":`${t.horizontalPadding}px`,"--cf-v-pad":`${t.verticalPadding}px`,...t.themeTokens?.accentText?{"--cf-accent-ink":t.themeTokens.accentText}:{},...t.themeTokens?.accentStrong?{"--cf-accent-2":t.themeTokens.accentStrong}:{},...t.themeTokens?.background?{"--cf-bg":t.themeTokens.background}:{},...t.themeTokens?.surface?{"--cf-surface":t.themeTokens.surface}:{},...t.themeTokens?.surfaceMuted?{"--cf-surface-2":t.themeTokens.surfaceMuted}:{},...t.themeTokens?.text?{"--cf-text":t.themeTokens.text}:{},...t.themeTokens?.mutedText?{"--cf-muted":t.themeTokens.mutedText}:{},...t.themeTokens?.border?{"--cf-border":t.themeTokens.border}:{},...t.themeTokens?.shadow?{"--cf-shadow":t.themeTokens.shadow}:{},...t.themeTokens?.radius?{"--cf-radius":t.themeTokens.radius}:{},...t.themeTokens?.fontFamily?{"--cf-font":t.themeTokens.fontFamily}:{},...Qn?{"--cf-accent":Qn,"--cf-accent-2":t.themeTokens?.accentStrong??`color-mix(in oklab, ${Qn} 76%, #14141f)`}:{}},er=e=>O(e),tr=[...c].reverse().find(e=>e.role===`user`&&e.content.trim())?.content??``,nr=c.some(e=>e.role===`user`),rr=s?.talkbackMode===`avatar`||s?.widgetModule===`assistant`||!!s?.allowVoiceInput,ir=!Z&&rr&&!nr?gn.filter((e,t)=>!(t===0&&e.role===`assistant`)):gn,ar=g===`human`&&_?_:s?.agentName??`Chat`,or=g===`human`?`Live support`:g===`queued`?`Waiting for the team`:s?.offline?r.statusOffline:r.statusOnline,sr=!B&&!Z?s?.availableActions:void 0,cr=W&&H===`connecting`&&!Z;return w(u,{value:r,children:T(`div`,{class:`cf-root`,"data-theme":Ye,"data-align":t.alignment,"data-display":`floating`,style:$n,children:[K&&i&&w(`div`,{class:`cf-theater-backdrop`,onClick:Fn}),T(`div`,{ref:Ct,class:`cf-panel ${i?`is-open`:``} ${W?`cf-panel--call`:``} ${cr?`cf-panel--voice-connecting`:``} ${K&&i?`cf-panel--theater`:``} ${_n?`cf-panel--analytics-focus`:``}`,role:`dialog`,"aria-modal":`false`,"aria-label":`Chat with ${s?.agentName??`us`}`,"aria-hidden":!i,children:[T(`div`,{class:`cf-header`,children:[w(De,{persona:s,hideWhenMissing:!0}),T(`div`,{class:`cf-header__meta`,children:[w(`div`,{class:`cf-header__name`,children:ar}),w(`div`,{class:`cf-header__status ${g===`ai`&&s?.offline?`cf-header__status--offline`:``}`,children:w(`span`,{class:`cf-header__status-text`,children:or})})]}),T(`div`,{class:`cf-header__actions`,children:[be.length>0&&w(`button`,{type:`button`,class:`cf-header__btn`,"aria-label":r.pastConversations,title:r.pastConversations,"aria-pressed":fn,onClick:()=>pn(e=>!e),children:w(fe,{})}),nr&&!B&&!Z&&w(`button`,{type:`button`,class:`cf-header__btn`,"aria-label":r.endChat,title:r.endChat,onClick:xn,children:w(de,{})}),t.sound&&st&&w(`button`,{type:`button`,class:`cf-header__btn`,"aria-label":qe?r.unmuteSounds:r.muteSounds,"aria-pressed":qe,onClick:ft,children:w(qe?se:oe,{})}),w(`button`,{type:`button`,class:`cf-header__btn cf-header__close`,"aria-label":r.closeChat,onClick:yn,children:w(j,{})})]})]}),w(`div`,{class:`cf-panel__video`,children:_n?w(`div`,{class:`cf-analytics-focus`,role:`region`,"aria-label":`Expanded analytics result`,children:w(Ue,{visualization:_n,expanded:!0,onClose:Pn})}):!Z&&rr?w(Ae,{persona:s,starters:[],onPick:O,onFocusComposer:Bn,speaking:p,voiceState:H,replyPending:W&&d&&!p,pinned:!0,muted:G,onToggleMute:Vn,onEndCall:Q,onTalkNow:Kn,showTalkNow:Jn,micLevel:Ne,theaterMode:K,onToggleTheater:Mn,onMinimize:yn,audioDevices:Ve,selectedAudioDeviceId:Ge,onSelectAudioDevice:Gn,connectingOnly:cr}):null}),!cr&&T(`div`,{class:`cf-panel__chat`,children:[t.preview&&w(`div`,{class:`cf-preview-banner`,children:r.previewBanner}),Z&&w(`div`,{class:`cf-viewing-banner`,children:r.viewingPast}),T(`div`,{class:`cf-body`,ref:Tt,role:`log`,onScroll:Tn,children:[ir.map((e,t)=>w(He,{msg:e,persona:s,isLast:!Z&&t===ir.length-1,visitor:m,hasEmail:h,lastQuestion:tr,showActions:!Z&&t===ir.length-1&&!!e.handoffOffered,onPickReply:er,onSubmitForm:L,onDemoSlots:me,onRetry:re,ratable:!Z&&ir.slice(0,t).some(e=>e.role===`user`),onRate:ie,onExpandVisualization:Z?void 0:Nn},e.id)),!nr&&!Z&&T(C,{children:[ir.length===0&&w(et,{name:s?.agentName??`Assistant`,greeting:s?.greeting}),w(ze,{items:E,onPick:O}),w(Be,{items:te})]}),on&&T(`button`,{type:`button`,class:`cf-newmsg`,onClick:En,children:[w(_e,{}),r.newMessages]})]}),w(`div`,{class:`cf-sr-live`,"aria-live":`polite`,"aria-atomic":`true`,children:Yn}),d&&!B&&!Z&&w(`div`,{class:`cf-stopbar`,children:T(`button`,{type:`button`,class:`cf-stop`,onClick:M,children:[w(le,{}),r.stop]})}),Z?w(`div`,{class:`cf-ended`,children:w(`button`,{type:`button`,class:`cf-ended__btn`,onClick:we,children:r.backToChat})}):B?T(`div`,{class:`cf-ended`,children:[w(`p`,{class:`cf-ended__text`,children:r.conversationEnded}),t.csat&&nr?mn?w(`p`,{class:`cf-ended__text`,children:r.feedbackThanks}):T(`div`,{class:`cf-csat`,children:[w(`span`,{class:`cf-csat__q`,children:r.csatPrompt}),w(`button`,{type:`button`,class:`cf-csat__btn`,"aria-label":r.feedbackHelpful,onClick:()=>{I(`up`),hn(!0)},children:w(z,{})}),w(`button`,{type:`button`,class:`cf-csat__btn`,"aria-label":r.feedbackNotHelpful,onClick:()=>{I(`down`),hn(!0)},children:w(pe,{})})]}):null,w(`button`,{type:`button`,class:`cf-ended__btn`,onClick:Cn,children:r.startNewChat})]}):T(C,{children:[b?T(`div`,{class:`cf-live-typing`,"aria-live":`polite`,children:[b,` is typingโฆ`]}):null,sr&&sr.length>0&&w(`div`,{class:`cf-footer-actions`,children:w(Ie,{actions:sr,visitor:m,onSubmitForm:L,onDemoSlots:me,scheduler:s?.scheduler})}),w($e,{onSend:O,onSendGif:k,onTyping:ne,disabled:d,allowVoice:!!s?.allowVoiceInput,onTranscribe:R,gifEnabled:he,onSearchGifs:ue,allowAttach:t.attachments,onExtract:ce})]}),!B&&s?.disclaimerText&&w(`div`,{class:`cf-disclaimer`,children:s.disclaimerText}),T(`div`,{class:`cf-footer`,children:[r.poweredBy,` `,w(`a`,{href:`https://accurix.tech/centrinfo`,target:`_blank`,rel:`noopener noreferrer`,children:`Centrinfo`})]})]}),ln&&w(`div`,{class:`cf-confirm`,onClick:()=>un(!1),children:T(`div`,{class:`cf-confirm__card`,role:`alertdialog`,"aria-modal":`true`,"aria-label":r.endChatConfirm,onClick:e=>e.stopPropagation(),children:[w(`div`,{class:`cf-confirm__title`,children:r.endChatConfirm}),w(`div`,{class:`cf-confirm__body`,children:r.endChatConfirmBody}),T(`div`,{class:`cf-confirm__actions`,children:[w(`button`,{ref:dn,type:`button`,class:`cf-confirm__btn cf-confirm__btn--cancel`,onClick:()=>un(!1),children:r.cancel}),w(`button`,{type:`button`,class:`cf-confirm__btn cf-confirm__btn--danger`,onClick:Sn,children:r.endConfirmCta})]})]})}),fn&&w(`div`,{class:`cf-confirm`,onClick:()=>pn(!1),children:T(`div`,{class:`cf-history`,role:`dialog`,"aria-modal":`true`,"aria-label":r.pastConversations,onClick:e=>e.stopPropagation(),children:[T(`div`,{class:`cf-history__head`,children:[w(`span`,{children:r.pastConversations}),w(`button`,{type:`button`,class:`cf-header__btn`,"aria-label":r.closeChat,onClick:()=>pn(!1),children:w(j,{})})]}),w(`div`,{class:`cf-history__list`,children:be.map(e=>T(`button`,{type:`button`,class:`cf-history__item ${e.sessionId===xe?`is-active`:``}`,onClick:()=>{Ce(e.sessionId),pn(!1)},children:[w(`span`,{class:`cf-history__title`,children:e.title}),T(`span`,{class:`cf-history__meta`,children:[new Date(e.ts).toLocaleDateString(void 0,{month:`short`,day:`numeric`}),e.ended?` ยท ${r.historyEnded}`:``]})]},e.sessionId))})]})})]}),W&&!i?w(Qe,{persona:s,voiceState:H,muted:G,onToggleMute:Vn,onEndCall:Q,micLevel:Ne,onExpand:vn}):K&&i?null:!t.hideDefaultLauncher&&T(`button`,{ref:wt,type:`button`,class:`cf-launcher`,"aria-label":i?r.closeChat:r.openChat,"aria-expanded":i,onClick:bn,children:[t.launcherIcon?w(`img`,{class:`cf-launcher__img`,src:t.launcherIcon,alt:``}):w(A,{}),!i&&Oe>0&&w(`span`,{class:`cf-launcher__badge`,children:Oe})]})]})})},wt=`
|
|
9
2
|
:host {
|
|
10
3
|
all: initial;
|
|
11
4
|
}
|
|
@@ -27,8 +20,8 @@ import{createContext as e,render as t}from"preact";import{useCallback as n,useCo
|
|
|
27
20
|
bottom: 0;
|
|
28
21
|
right: 0;
|
|
29
22
|
font-family: var(--cf-font);
|
|
30
|
-
font-size:
|
|
31
|
-
line-height: 1.
|
|
23
|
+
font-size: 14px;
|
|
24
|
+
line-height: 1.45;
|
|
32
25
|
color: var(--cf-text);
|
|
33
26
|
-webkit-font-smoothing: antialiased;
|
|
34
27
|
}
|
|
@@ -135,24 +128,132 @@ import{createContext as e,render as t}from"preact";import{useCallback as n,useCo
|
|
|
135
128
|
z-index: 2;
|
|
136
129
|
width: 384px;
|
|
137
130
|
max-width: calc(100vw - 32px);
|
|
138
|
-
height:
|
|
131
|
+
height: min(88vh, 820px);
|
|
132
|
+
min-height: 560px;
|
|
139
133
|
max-height: calc(100vh - 40px);
|
|
140
134
|
background: var(--cf-bg);
|
|
141
135
|
border-radius: var(--cf-radius);
|
|
142
136
|
box-shadow: var(--cf-shadow);
|
|
143
|
-
|
|
144
|
-
|
|
137
|
+
/* Grid (not flex) so theater mode below can reflow header/video/chat into a
|
|
138
|
+
two-column split purely in CSS, without reordering the DOM. */
|
|
139
|
+
display: grid;
|
|
140
|
+
grid-template-columns: 1fr;
|
|
141
|
+
grid-template-rows: auto auto minmax(0, 1fr);
|
|
142
|
+
grid-template-areas: 'header' 'video' 'chat';
|
|
145
143
|
overflow: hidden;
|
|
146
144
|
transform-origin: bottom right;
|
|
147
145
|
opacity: 0;
|
|
148
|
-
transform: translateY(
|
|
146
|
+
transform: translateY(22px) scale(0.94);
|
|
149
147
|
pointer-events: none;
|
|
150
|
-
transition: opacity 0.
|
|
148
|
+
transition: opacity 0.22s ease, transform 0.3s cubic-bezier(0.22, 1, 0.36, 1),
|
|
149
|
+
height 0.28s ease, width 0.28s ease;
|
|
151
150
|
}
|
|
152
151
|
.cf-panel.is-open {
|
|
153
152
|
opacity: 1;
|
|
154
153
|
transform: translateY(0) scale(1);
|
|
155
154
|
pointer-events: auto;
|
|
155
|
+
animation: cf-panel-open 0.34s cubic-bezier(0.16, 1, 0.3, 1) both;
|
|
156
|
+
}
|
|
157
|
+
|
|
158
|
+
.cf-panel > .cf-header { grid-area: header; }
|
|
159
|
+
/* Stacked ABOVE .cf-panel__chat (which sits right below it in the docked
|
|
160
|
+
layout) so the call bar's popover โ which opens downward and overlaps
|
|
161
|
+
that space โ paints over the transcript instead of getting interleaved
|
|
162
|
+
with message bubbles underneath it. */
|
|
163
|
+
.cf-panel__video {
|
|
164
|
+
grid-area: video;
|
|
165
|
+
position: relative;
|
|
166
|
+
z-index: 5;
|
|
167
|
+
min-width: 0;
|
|
168
|
+
}
|
|
169
|
+
.cf-panel__chat {
|
|
170
|
+
grid-area: chat;
|
|
171
|
+
display: flex;
|
|
172
|
+
flex-direction: column;
|
|
173
|
+
min-height: 0;
|
|
174
|
+
min-width: 0;
|
|
175
|
+
}
|
|
176
|
+
/* A live voice call gets more room for the transcript underneath the avatar card. */
|
|
177
|
+
.cf-panel.cf-panel--call {
|
|
178
|
+
height: min(90vh, 840px);
|
|
179
|
+
}
|
|
180
|
+
.cf-panel.cf-panel--voice-connecting {
|
|
181
|
+
height: min(72vh, 560px);
|
|
182
|
+
min-height: 420px;
|
|
183
|
+
grid-template-rows: auto minmax(0, 1fr);
|
|
184
|
+
grid-template-areas: 'header' 'video';
|
|
185
|
+
}
|
|
186
|
+
.cf-panel--voice-connecting .cf-panel__video {
|
|
187
|
+
display: grid;
|
|
188
|
+
min-height: 0;
|
|
189
|
+
}
|
|
190
|
+
/* Expanded "theater" view โ video and chat side by side in a large centered
|
|
191
|
+
modal instead of the corner bubble. Only reachable from an active call's
|
|
192
|
+
expand button, so it never applies below the existing mobile breakpoint. */
|
|
193
|
+
@media (min-width: 640px) {
|
|
194
|
+
.cf-panel.cf-panel--theater {
|
|
195
|
+
inset: 0;
|
|
196
|
+
margin: auto;
|
|
197
|
+
width: min(1040px, calc(100vw - 48px));
|
|
198
|
+
height: min(760px, calc(100vh - 48px));
|
|
199
|
+
max-width: none;
|
|
200
|
+
max-height: none;
|
|
201
|
+
grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
|
|
202
|
+
grid-template-rows: auto minmax(0, 1fr);
|
|
203
|
+
grid-template-areas: 'header header' 'video chat';
|
|
204
|
+
}
|
|
205
|
+
.cf-panel.cf-panel--theater.is-open {
|
|
206
|
+
transform: none;
|
|
207
|
+
}
|
|
208
|
+
.cf-panel--theater .cf-panel__video { height: 100%; }
|
|
209
|
+
.cf-panel--theater .cf-assistant-card--pinned {
|
|
210
|
+
height: 100%;
|
|
211
|
+
margin: 0;
|
|
212
|
+
padding: 0;
|
|
213
|
+
border: 0;
|
|
214
|
+
border-right: 1px solid var(--cf-border);
|
|
215
|
+
}
|
|
216
|
+
.cf-panel--theater .cf-assistant-card--pinned .cf-assistant-card__stage {
|
|
217
|
+
height: 100%;
|
|
218
|
+
border-radius: 0;
|
|
219
|
+
}
|
|
220
|
+
.cf-panel--theater .cf-assistant-card__media--generated .cf-assistant-card__face {
|
|
221
|
+
width: min(220px, 38vw);
|
|
222
|
+
height: min(220px, 38vw);
|
|
223
|
+
}
|
|
224
|
+
.cf-panel--theater .cf-assistant-card__media--generated .cf-assistant-card__initials {
|
|
225
|
+
font-size: clamp(42px, 7vw, 76px);
|
|
226
|
+
transform: translateY(-14px);
|
|
227
|
+
}
|
|
228
|
+
.cf-panel--theater .cf-assistant-card__media--generated .cf-assistant-card__eye {
|
|
229
|
+
top: 43%;
|
|
230
|
+
width: 11px;
|
|
231
|
+
height: 11px;
|
|
232
|
+
}
|
|
233
|
+
.cf-panel--theater .cf-assistant-card__media--generated .cf-assistant-card__eye--left { left: 34%; }
|
|
234
|
+
.cf-panel--theater .cf-assistant-card__media--generated .cf-assistant-card__eye--right { right: 34%; }
|
|
235
|
+
.cf-panel--theater .cf-assistant-card__media--generated .cf-assistant-card__mouth {
|
|
236
|
+
bottom: 27%;
|
|
237
|
+
width: 52px;
|
|
238
|
+
height: 8px;
|
|
239
|
+
}
|
|
240
|
+
.cf-panel--theater .cf-avatar-wave {
|
|
241
|
+
bottom: 92px;
|
|
242
|
+
}
|
|
243
|
+
/* The call bar sits near the BOTTOM of the full-height theater video pane
|
|
244
|
+
(vs. near the top of the short docked card), so its popover flips to
|
|
245
|
+
open upward here โ there's room above it, none below. */
|
|
246
|
+
.cf-panel--theater .cf-call-menu {
|
|
247
|
+
top: auto;
|
|
248
|
+
bottom: calc(100% + 8px);
|
|
249
|
+
}
|
|
250
|
+
}
|
|
251
|
+
.cf-theater-backdrop {
|
|
252
|
+
position: fixed;
|
|
253
|
+
inset: 0;
|
|
254
|
+
z-index: 1;
|
|
255
|
+
background: rgba(10, 14, 20, 0.55);
|
|
256
|
+
pointer-events: auto;
|
|
156
257
|
}
|
|
157
258
|
|
|
158
259
|
/* Left-aligned messenger (alignment: 'left') โ dock to the left edge. */
|
|
@@ -188,6 +289,10 @@ import{createContext as e,render as t}from"preact";import{useCallback as n,useCo
|
|
|
188
289
|
height: 100%;
|
|
189
290
|
object-fit: cover;
|
|
190
291
|
}
|
|
292
|
+
.cf-header__avatar[class*='cf-avatar-preset--'],
|
|
293
|
+
.cf-msg__avatar[class*='cf-avatar-preset--'] {
|
|
294
|
+
background: linear-gradient(135deg, var(--cf-avatar-a, var(--cf-accent)), var(--cf-avatar-b, var(--cf-accent-2)));
|
|
295
|
+
}
|
|
191
296
|
.cf-header__meta {
|
|
192
297
|
min-width: 0;
|
|
193
298
|
flex: 1 1 auto;
|
|
@@ -276,12 +381,13 @@ import{createContext as e,render as t}from"preact";import{useCallback as n,useCo
|
|
|
276
381
|
|
|
277
382
|
/* ---------- Body / messages ---------- */
|
|
278
383
|
.cf-body {
|
|
279
|
-
flex: 1;
|
|
384
|
+
flex: 1 1 0;
|
|
385
|
+
min-height: 0;
|
|
280
386
|
overflow-y: auto;
|
|
281
387
|
/* Never scroll/shift horizontally โ a long source pill or code line is
|
|
282
388
|
clipped, not allowed to push the whole thread sideways. */
|
|
283
389
|
overflow-x: hidden;
|
|
284
|
-
padding:
|
|
390
|
+
padding: 12px 14px 8px;
|
|
285
391
|
display: flex;
|
|
286
392
|
flex-direction: column;
|
|
287
393
|
gap: 12px;
|
|
@@ -295,6 +401,38 @@ import{createContext as e,render as t}from"preact";import{useCallback as n,useCo
|
|
|
295
401
|
background: var(--cf-border);
|
|
296
402
|
border-radius: 4px;
|
|
297
403
|
}
|
|
404
|
+
.cf-empty-welcome {
|
|
405
|
+
display: flex;
|
|
406
|
+
flex-direction: column;
|
|
407
|
+
gap: 5px;
|
|
408
|
+
margin: 4px 0 2px;
|
|
409
|
+
padding: 14px 14px 13px;
|
|
410
|
+
border-radius: 18px;
|
|
411
|
+
background:
|
|
412
|
+
radial-gradient(circle at 14% 0%, color-mix(in oklab, var(--cf-accent) 20%, transparent), transparent 34%),
|
|
413
|
+
linear-gradient(135deg, color-mix(in oklab, var(--cf-surface) 88%, var(--cf-bg)), var(--cf-bg));
|
|
414
|
+
border: 1px solid color-mix(in oklab, var(--cf-border) 78%, var(--cf-accent));
|
|
415
|
+
}
|
|
416
|
+
.cf-empty-welcome__eyebrow {
|
|
417
|
+
color: var(--cf-accent);
|
|
418
|
+
font-size: 10px;
|
|
419
|
+
font-weight: 800;
|
|
420
|
+
letter-spacing: 0.11em;
|
|
421
|
+
text-transform: uppercase;
|
|
422
|
+
}
|
|
423
|
+
.cf-empty-welcome h2 {
|
|
424
|
+
margin: 0;
|
|
425
|
+
color: var(--cf-text);
|
|
426
|
+
font-size: 17px;
|
|
427
|
+
line-height: 1.15;
|
|
428
|
+
letter-spacing: -0.02em;
|
|
429
|
+
}
|
|
430
|
+
.cf-empty-welcome p {
|
|
431
|
+
margin: 0;
|
|
432
|
+
color: var(--cf-muted);
|
|
433
|
+
font-size: 12.8px;
|
|
434
|
+
line-height: 1.45;
|
|
435
|
+
}
|
|
298
436
|
.cf-msg {
|
|
299
437
|
display: flex;
|
|
300
438
|
gap: 8px;
|
|
@@ -304,6 +442,10 @@ import{createContext as e,render as t}from"preact";import{useCallback as n,useCo
|
|
|
304
442
|
.cf-msg--user {
|
|
305
443
|
justify-content: flex-end;
|
|
306
444
|
}
|
|
445
|
+
.cf-msg--system {
|
|
446
|
+
justify-content: center;
|
|
447
|
+
margin: 4px 0;
|
|
448
|
+
}
|
|
307
449
|
.cf-msg__avatar {
|
|
308
450
|
width: 26px;
|
|
309
451
|
height: 26px;
|
|
@@ -327,7 +469,7 @@ import{createContext as e,render as t}from"preact";import{useCallback as n,useCo
|
|
|
327
469
|
words like "Hello" never split mid-word. */
|
|
328
470
|
overflow-wrap: break-word;
|
|
329
471
|
white-space: pre-wrap;
|
|
330
|
-
font-size:
|
|
472
|
+
font-size: 13.5px;
|
|
331
473
|
}
|
|
332
474
|
.cf-msg--agent .cf-msg__bubble {
|
|
333
475
|
background: var(--cf-surface);
|
|
@@ -348,11 +490,103 @@ import{createContext as e,render as t}from"preact";import{useCallback as n,useCo
|
|
|
348
490
|
.cf-msg__bubble p:last-child { margin-bottom: 0; }
|
|
349
491
|
.cf-msg__col { min-width: 0; max-width: 85%; display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
|
|
350
492
|
.cf-msg--user .cf-msg__col { align-items: flex-end; }
|
|
493
|
+
.cf-system-event {
|
|
494
|
+
width: min(280px, 88%);
|
|
495
|
+
display: flex;
|
|
496
|
+
flex-direction: column;
|
|
497
|
+
align-items: center;
|
|
498
|
+
gap: 4px;
|
|
499
|
+
text-align: center;
|
|
500
|
+
color: var(--cf-muted);
|
|
501
|
+
}
|
|
502
|
+
.cf-system-event__mark {
|
|
503
|
+
width: 7px;
|
|
504
|
+
height: 7px;
|
|
505
|
+
border-radius: 999px;
|
|
506
|
+
background: color-mix(in srgb, var(--cf-accent, #2f7f55) 72%, transparent);
|
|
507
|
+
box-shadow: 0 0 0 4px color-mix(in srgb, var(--cf-accent, #2f7f55) 12%, transparent);
|
|
508
|
+
}
|
|
509
|
+
.cf-system-event__text {
|
|
510
|
+
max-width: 100%;
|
|
511
|
+
padding: 7px 11px;
|
|
512
|
+
border: 1px solid var(--cf-border);
|
|
513
|
+
border-radius: 999px;
|
|
514
|
+
background: color-mix(in srgb, var(--cf-surface, #ffffff) 86%, transparent);
|
|
515
|
+
font-size: 12.5px;
|
|
516
|
+
font-weight: 600;
|
|
517
|
+
line-height: 1.35;
|
|
518
|
+
color: var(--cf-muted);
|
|
519
|
+
overflow-wrap: break-word;
|
|
520
|
+
}
|
|
521
|
+
.cf-system-event__time {
|
|
522
|
+
font-size: 11px;
|
|
523
|
+
line-height: 1.2;
|
|
524
|
+
color: var(--cf-muted);
|
|
525
|
+
}
|
|
351
526
|
|
|
352
527
|
/* ---------- Markdown in answers ---------- */
|
|
353
|
-
.cf-msg__bubble .cf-md-h {
|
|
354
|
-
|
|
355
|
-
|
|
528
|
+
.cf-msg__bubble .cf-md-h {
|
|
529
|
+
margin: 12px 0 5px;
|
|
530
|
+
color: var(--cf-text);
|
|
531
|
+
font-size: 14.5px;
|
|
532
|
+
font-weight: 750;
|
|
533
|
+
line-height: 1.3;
|
|
534
|
+
}
|
|
535
|
+
.cf-msg__bubble .cf-md-h:first-child { margin-top: 0; }
|
|
536
|
+
.cf-msg__bubble .cf-md-h--1,
|
|
537
|
+
.cf-msg__bubble .cf-md-h--2 { font-size: 15.5px; }
|
|
538
|
+
.cf-msg__bubble p.cf-md-list-intro {
|
|
539
|
+
margin: 11px 0 5px;
|
|
540
|
+
color: var(--cf-text);
|
|
541
|
+
font-weight: 750;
|
|
542
|
+
line-height: 1.35;
|
|
543
|
+
}
|
|
544
|
+
.cf-msg__bubble ul.cf-md-list,
|
|
545
|
+
.cf-msg__bubble ol.cf-md-list {
|
|
546
|
+
display: grid;
|
|
547
|
+
gap: 9px;
|
|
548
|
+
margin: 8px 0 11px;
|
|
549
|
+
padding: 0;
|
|
550
|
+
list-style: none;
|
|
551
|
+
}
|
|
552
|
+
.cf-msg__bubble .cf-md-list li {
|
|
553
|
+
position: relative;
|
|
554
|
+
min-width: 0;
|
|
555
|
+
padding-left: 18px;
|
|
556
|
+
line-height: 1.52;
|
|
557
|
+
}
|
|
558
|
+
.cf-msg__bubble ul.cf-md-list > li::before {
|
|
559
|
+
position: absolute;
|
|
560
|
+
top: .58em;
|
|
561
|
+
left: 2px;
|
|
562
|
+
width: 6px;
|
|
563
|
+
height: 6px;
|
|
564
|
+
border-radius: 50%;
|
|
565
|
+
background: var(--cf-accent);
|
|
566
|
+
content: "";
|
|
567
|
+
}
|
|
568
|
+
.cf-msg__bubble ol.cf-md-list { counter-reset: cf-answer-item; }
|
|
569
|
+
.cf-msg__bubble ol.cf-md-list > li { padding-left: 25px; counter-increment: cf-answer-item; }
|
|
570
|
+
.cf-msg__bubble ol.cf-md-list > li::before {
|
|
571
|
+
position: absolute;
|
|
572
|
+
top: .08em;
|
|
573
|
+
left: 0;
|
|
574
|
+
display: grid;
|
|
575
|
+
width: 19px;
|
|
576
|
+
height: 19px;
|
|
577
|
+
place-items: center;
|
|
578
|
+
border-radius: 50%;
|
|
579
|
+
color: var(--cf-accent);
|
|
580
|
+
background: var(--cf-accent-soft);
|
|
581
|
+
content: counter(cf-answer-item);
|
|
582
|
+
font-size: 10px;
|
|
583
|
+
font-weight: 750;
|
|
584
|
+
}
|
|
585
|
+
.cf-msg__bubble .cf-md-list li > strong:first-child {
|
|
586
|
+
display: inline;
|
|
587
|
+
color: var(--cf-text);
|
|
588
|
+
font-weight: 750;
|
|
589
|
+
}
|
|
356
590
|
.cf-md-code {
|
|
357
591
|
font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
|
|
358
592
|
font-size: 0.86em;
|
|
@@ -390,6 +624,7 @@ import{createContext as e,render as t}from"preact";import{useCallback as n,useCo
|
|
|
390
624
|
}
|
|
391
625
|
|
|
392
626
|
/* message tools (copy / retry) */
|
|
627
|
+
.cf-msg__actions { display: flex; align-items: flex-start; gap: 2px; }
|
|
393
628
|
.cf-msg__tools { display: flex; gap: 6px; }
|
|
394
629
|
.cf-tool {
|
|
395
630
|
display: inline-flex;
|
|
@@ -407,7 +642,7 @@ import{createContext as e,render as t}from"preact";import{useCallback as n,useCo
|
|
|
407
642
|
.cf-tool svg { width: 13px; height: 13px; }
|
|
408
643
|
|
|
409
644
|
/* Per-message ๐/๐ feedback. */
|
|
410
|
-
.cf-feedback { margin-top:
|
|
645
|
+
.cf-feedback { margin-top: 0; }
|
|
411
646
|
.cf-feedback__row { display: flex; align-items: center; gap: 4px; }
|
|
412
647
|
.cf-feedback__btn {
|
|
413
648
|
display: inline-flex;
|
|
@@ -456,20 +691,85 @@ import{createContext as e,render as t}from"preact";import{useCallback as n,useCo
|
|
|
456
691
|
.cf-feedback__send:hover { opacity: 0.9; }
|
|
457
692
|
|
|
458
693
|
/* conversation starters */
|
|
459
|
-
.cf-starters {
|
|
694
|
+
.cf-starters {
|
|
695
|
+
display: flex;
|
|
696
|
+
flex-direction: column;
|
|
697
|
+
align-items: flex-start;
|
|
698
|
+
min-width: 0;
|
|
699
|
+
gap: 8px;
|
|
700
|
+
margin: 2px 0 4px 34px;
|
|
701
|
+
}
|
|
460
702
|
.cf-starter {
|
|
461
|
-
|
|
703
|
+
max-width: 100%;
|
|
704
|
+
padding: 8px 12px;
|
|
462
705
|
border-radius: 14px;
|
|
463
706
|
border: 1px solid var(--cf-border);
|
|
464
707
|
background: var(--cf-bg);
|
|
465
708
|
color: var(--cf-text);
|
|
466
|
-
font-size:
|
|
709
|
+
font-size: 12.8px;
|
|
467
710
|
font-weight: 500;
|
|
468
711
|
text-align: left;
|
|
712
|
+
overflow-wrap: anywhere;
|
|
469
713
|
transition: border-color 0.15s ease, transform 0.1s ease;
|
|
470
714
|
}
|
|
471
715
|
.cf-starter:hover { border-color: var(--cf-accent); }
|
|
472
716
|
.cf-starter:active { transform: scale(0.98); }
|
|
717
|
+
.cf-starter:focus-visible {
|
|
718
|
+
outline: 2px solid var(--cf-accent-2);
|
|
719
|
+
outline-offset: 2px;
|
|
720
|
+
}
|
|
721
|
+
.cf-featured-links {
|
|
722
|
+
display: flex;
|
|
723
|
+
flex-wrap: wrap;
|
|
724
|
+
align-items: flex-start;
|
|
725
|
+
min-width: 0;
|
|
726
|
+
gap: 8px;
|
|
727
|
+
margin: 2px 0 4px;
|
|
728
|
+
}
|
|
729
|
+
.cf-featured-link {
|
|
730
|
+
flex: 0 1 auto;
|
|
731
|
+
min-width: 0;
|
|
732
|
+
max-width: 100%;
|
|
733
|
+
display: inline-flex;
|
|
734
|
+
align-items: center;
|
|
735
|
+
gap: 7px;
|
|
736
|
+
min-width: 0;
|
|
737
|
+
min-height: 34px;
|
|
738
|
+
padding: 7px 11px;
|
|
739
|
+
border-radius: 999px;
|
|
740
|
+
border: 1px solid color-mix(in srgb, var(--cf-accent) 55%, var(--cf-border));
|
|
741
|
+
background: color-mix(in srgb, var(--cf-accent) 10%, var(--cf-bg));
|
|
742
|
+
color: var(--cf-text);
|
|
743
|
+
font-size: 13px;
|
|
744
|
+
font-weight: 500;
|
|
745
|
+
text-decoration: none;
|
|
746
|
+
transition: border-color 0.15s ease, background-color 0.15s ease;
|
|
747
|
+
}
|
|
748
|
+
.cf-featured-link svg {
|
|
749
|
+
width: 14px;
|
|
750
|
+
height: 14px;
|
|
751
|
+
flex: 0 0 14px;
|
|
752
|
+
}
|
|
753
|
+
.cf-featured-link svg {
|
|
754
|
+
width: 14px;
|
|
755
|
+
height: 14px;
|
|
756
|
+
flex: 0 0 14px;
|
|
757
|
+
color: var(--cf-accent);
|
|
758
|
+
}
|
|
759
|
+
.cf-featured-link span {
|
|
760
|
+
min-width: 0;
|
|
761
|
+
overflow: hidden;
|
|
762
|
+
text-overflow: ellipsis;
|
|
763
|
+
white-space: nowrap;
|
|
764
|
+
}
|
|
765
|
+
.cf-featured-link:hover {
|
|
766
|
+
border-color: var(--cf-accent);
|
|
767
|
+
background: color-mix(in srgb, var(--cf-accent) 16%, var(--cf-bg));
|
|
768
|
+
}
|
|
769
|
+
.cf-featured-link:focus-visible {
|
|
770
|
+
outline: 2px solid var(--cf-accent-2);
|
|
771
|
+
outline-offset: 2px;
|
|
772
|
+
}
|
|
473
773
|
|
|
474
774
|
/* stop generating */
|
|
475
775
|
.cf-stopbar { display: flex; justify-content: center; padding: 6px 0 2px; flex-shrink: 0; }
|
|
@@ -492,13 +792,25 @@ import{createContext as e,render as t}from"preact";import{useCallback as n,useCo
|
|
|
492
792
|
|
|
493
793
|
/* typing */
|
|
494
794
|
.cf-typing {
|
|
795
|
+
max-width: 100%;
|
|
796
|
+
flex-wrap: wrap;
|
|
495
797
|
display: inline-flex;
|
|
798
|
+
align-items: center;
|
|
496
799
|
gap: 4px;
|
|
497
|
-
padding: 13px
|
|
800
|
+
padding: 10px 13px;
|
|
801
|
+
min-width: 98px;
|
|
802
|
+
}
|
|
803
|
+
.cf-typing__label {
|
|
804
|
+
min-width: 0;
|
|
805
|
+
overflow-wrap: anywhere;
|
|
806
|
+
margin-right: 3px;
|
|
807
|
+
color: var(--cf-muted);
|
|
808
|
+
font-size: 12px;
|
|
809
|
+
font-weight: 650;
|
|
498
810
|
}
|
|
499
811
|
.cf-typing__dot {
|
|
500
|
-
width:
|
|
501
|
-
height:
|
|
812
|
+
width: 5px;
|
|
813
|
+
height: 5px;
|
|
502
814
|
border-radius: 50%;
|
|
503
815
|
background: var(--cf-muted);
|
|
504
816
|
animation: cf-typing 1.1s infinite ease-in-out;
|
|
@@ -565,7 +877,7 @@ import{createContext as e,render as t}from"preact";import{useCallback as n,useCo
|
|
|
565
877
|
background: var(--cf-surface);
|
|
566
878
|
border: 1px solid var(--cf-border);
|
|
567
879
|
color: var(--cf-text);
|
|
568
|
-
font-size:
|
|
880
|
+
font-size: 12.8px;
|
|
569
881
|
font-weight: 600;
|
|
570
882
|
transition: border-color 0.15s ease, transform 0.1s ease;
|
|
571
883
|
}
|
|
@@ -756,6 +1068,13 @@ import{createContext as e,render as t}from"preact";import{useCallback as n,useCo
|
|
|
756
1068
|
border-top: 1px solid var(--cf-border);
|
|
757
1069
|
background: var(--cf-bg);
|
|
758
1070
|
}
|
|
1071
|
+
.cf-live-typing {
|
|
1072
|
+
flex-shrink: 0;
|
|
1073
|
+
padding: 8px 14px 0;
|
|
1074
|
+
color: var(--cf-muted);
|
|
1075
|
+
font-size: 12px;
|
|
1076
|
+
background: var(--cf-bg);
|
|
1077
|
+
}
|
|
759
1078
|
.cf-composer__field {
|
|
760
1079
|
display: flex;
|
|
761
1080
|
align-items: flex-end;
|
|
@@ -767,6 +1086,23 @@ import{createContext as e,render as t}from"preact";import{useCallback as n,useCo
|
|
|
767
1086
|
transition: border-color 0.15s ease;
|
|
768
1087
|
}
|
|
769
1088
|
.cf-composer__field:focus-within { border-color: var(--cf-accent); }
|
|
1089
|
+
.cf-voice-state {
|
|
1090
|
+
display: inline-flex;
|
|
1091
|
+
align-items: center;
|
|
1092
|
+
gap: 8px;
|
|
1093
|
+
margin: 0 0 8px 2px;
|
|
1094
|
+
color: var(--cf-muted);
|
|
1095
|
+
font-size: 12.5px;
|
|
1096
|
+
}
|
|
1097
|
+
.cf-voice-state__dot {
|
|
1098
|
+
width: 8px;
|
|
1099
|
+
height: 8px;
|
|
1100
|
+
border-radius: 999px;
|
|
1101
|
+
background: var(--cf-accent);
|
|
1102
|
+
}
|
|
1103
|
+
.cf-voice-state__dot.is-live {
|
|
1104
|
+
animation: cf-pulse 1s infinite;
|
|
1105
|
+
}
|
|
770
1106
|
.cf-textarea {
|
|
771
1107
|
flex: 1;
|
|
772
1108
|
border: none;
|
|
@@ -899,255 +1235,2043 @@ import{createContext as e,render as t}from"preact";import{useCallback as n,useCo
|
|
|
899
1235
|
.cf-footer a { color: var(--cf-muted); text-decoration: none; font-weight: 600; }
|
|
900
1236
|
.cf-footer a:hover { color: var(--cf-accent); }
|
|
901
1237
|
|
|
902
|
-
/* ----------
|
|
903
|
-
.cf-
|
|
904
|
-
.cf-welcome__desc { margin: 0 0 4px; font-size: 14px; font-weight: 600; color: var(--cf-text); }
|
|
905
|
-
.cf-welcome__sub { margin: 0; font-size: 12.5px; color: var(--cf-muted); }
|
|
906
|
-
|
|
907
|
-
/* Offline presence dot (amber instead of green). */
|
|
908
|
-
.cf-header__status--offline::before { background: #e2c07e; box-shadow: 0 0 0 2px rgba(226, 192, 126, 0.3); }
|
|
909
|
-
|
|
910
|
-
/* Disclaimer fine-print under the composer. */
|
|
911
|
-
.cf-disclaimer { padding: 0 16px 2px; font-size: 10.5px; line-height: 1.45; color: var(--cf-muted); text-align: center; }
|
|
912
|
-
|
|
913
|
-
/* Read-only banner shown while viewing a past conversation. */
|
|
914
|
-
.cf-viewing-banner {
|
|
915
|
-
padding: 7px 16px;
|
|
916
|
-
font-size: 12px;
|
|
917
|
-
font-weight: 600;
|
|
918
|
-
text-align: center;
|
|
919
|
-
color: var(--cf-muted);
|
|
920
|
-
background: var(--cf-surface);
|
|
921
|
-
border-bottom: 1px solid var(--cf-border);
|
|
1238
|
+
/* ---------- Footer lead actions ---------- */
|
|
1239
|
+
.cf-footer-actions {
|
|
922
1240
|
flex-shrink: 0;
|
|
923
|
-
|
|
924
|
-
|
|
925
|
-
/* Past-conversations history panel (over the chat, like the confirm dialog). */
|
|
926
|
-
.cf-history {
|
|
927
|
-
width: min(340px, 90%);
|
|
928
|
-
max-height: 70%;
|
|
929
|
-
display: flex;
|
|
930
|
-
flex-direction: column;
|
|
1241
|
+
padding: 6px 14px 5px;
|
|
931
1242
|
background: var(--cf-bg);
|
|
932
|
-
border-
|
|
933
|
-
box-shadow: var(--cf-shadow);
|
|
934
|
-
overflow: hidden;
|
|
1243
|
+
border-top: 1px solid var(--cf-border);
|
|
935
1244
|
}
|
|
936
|
-
.cf-
|
|
937
|
-
display:
|
|
1245
|
+
.cf-action-trigger {
|
|
1246
|
+
display: grid;
|
|
1247
|
+
grid-template-columns: 28px minmax(0, 1fr) 16px;
|
|
938
1248
|
align-items: center;
|
|
939
|
-
|
|
940
|
-
padding: 12px 14px;
|
|
941
|
-
font-size: 14px;
|
|
942
|
-
font-weight: 700;
|
|
943
|
-
color: var(--cf-text);
|
|
944
|
-
border-bottom: 1px solid var(--cf-border);
|
|
945
|
-
}
|
|
946
|
-
.cf-history__list { overflow-y: auto; padding: 6px; }
|
|
947
|
-
.cf-history__item {
|
|
948
|
-
display: flex;
|
|
949
|
-
flex-direction: column;
|
|
950
|
-
gap: 2px;
|
|
1249
|
+
gap: 8px;
|
|
951
1250
|
width: 100%;
|
|
1251
|
+
min-height: 40px;
|
|
1252
|
+
border: 1px solid color-mix(in oklab, var(--cf-border) 86%, var(--cf-accent));
|
|
1253
|
+
border-radius: 14px;
|
|
1254
|
+
padding: 6px 9px;
|
|
1255
|
+
background:
|
|
1256
|
+
radial-gradient(circle at 15% 0%, color-mix(in oklab, var(--cf-accent) 15%, transparent), transparent 40%),
|
|
1257
|
+
color-mix(in oklab, var(--cf-bg-soft) 78%, transparent);
|
|
1258
|
+
color: var(--cf-text);
|
|
952
1259
|
text-align: left;
|
|
953
|
-
padding: 9px 10px;
|
|
954
|
-
border-radius: 9px;
|
|
955
1260
|
cursor: pointer;
|
|
956
|
-
|
|
1261
|
+
box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
|
|
957
1262
|
}
|
|
958
|
-
.cf-
|
|
959
|
-
|
|
960
|
-
.cf-history__title { font-size: 13px; color: var(--cf-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
|
|
961
|
-
.cf-history__meta { font-size: 11px; color: var(--cf-muted); }
|
|
962
|
-
|
|
963
|
-
/* Ended-conversation bar โ replaces the composer once the chat is closed. */
|
|
964
|
-
.cf-ended {
|
|
965
|
-
display: flex;
|
|
966
|
-
flex-direction: column;
|
|
967
|
-
align-items: center;
|
|
968
|
-
gap: 10px;
|
|
969
|
-
padding: 14px 16px 16px;
|
|
970
|
-
flex-shrink: 0;
|
|
971
|
-
text-align: center;
|
|
1263
|
+
.cf-action-trigger:hover {
|
|
1264
|
+
border-color: color-mix(in oklab, var(--cf-accent) 46%, var(--cf-border));
|
|
972
1265
|
}
|
|
973
|
-
.cf-
|
|
974
|
-
|
|
975
|
-
|
|
976
|
-
|
|
1266
|
+
.cf-action-trigger > svg {
|
|
1267
|
+
width: 14px;
|
|
1268
|
+
height: 14px;
|
|
1269
|
+
color: var(--cf-muted);
|
|
1270
|
+
}
|
|
1271
|
+
.cf-action-trigger__icon {
|
|
977
1272
|
display: inline-flex;
|
|
978
1273
|
align-items: center;
|
|
979
1274
|
justify-content: center;
|
|
980
|
-
width:
|
|
981
|
-
height:
|
|
982
|
-
border-radius:
|
|
1275
|
+
width: 28px;
|
|
1276
|
+
height: 28px;
|
|
1277
|
+
border-radius: 10px;
|
|
1278
|
+
background: color-mix(in oklab, var(--cf-accent) 15%, transparent);
|
|
1279
|
+
color: var(--cf-accent);
|
|
1280
|
+
}
|
|
1281
|
+
.cf-action-trigger__icon svg { width: 14px; height: 14px; }
|
|
1282
|
+
.cf-action-trigger__copy {
|
|
1283
|
+
display: grid;
|
|
1284
|
+
gap: 1px;
|
|
1285
|
+
min-width: 0;
|
|
1286
|
+
}
|
|
1287
|
+
.cf-action-trigger__copy strong {
|
|
1288
|
+
font-size: 12px;
|
|
1289
|
+
line-height: 1.1;
|
|
1290
|
+
}
|
|
1291
|
+
.cf-action-trigger__copy small {
|
|
1292
|
+
overflow: hidden;
|
|
983
1293
|
color: var(--cf-muted);
|
|
984
|
-
|
|
985
|
-
|
|
1294
|
+
font-size: 10.5px;
|
|
1295
|
+
line-height: 1.2;
|
|
1296
|
+
text-overflow: ellipsis;
|
|
1297
|
+
white-space: nowrap;
|
|
986
1298
|
}
|
|
987
|
-
.cf-
|
|
988
|
-
|
|
989
|
-
|
|
990
|
-
|
|
991
|
-
|
|
992
|
-
|
|
993
|
-
|
|
994
|
-
|
|
1299
|
+
.cf-action-drawer {
|
|
1300
|
+
border: 1px solid color-mix(in oklab, var(--cf-border) 86%, var(--cf-accent));
|
|
1301
|
+
border-radius: 18px 18px 12px 12px;
|
|
1302
|
+
padding: 7px;
|
|
1303
|
+
background:
|
|
1304
|
+
radial-gradient(circle at 18% 0%, color-mix(in oklab, var(--cf-accent) 16%, transparent), transparent 38%),
|
|
1305
|
+
color-mix(in oklab, var(--cf-bg) 94%, #ffffff);
|
|
1306
|
+
box-shadow: 0 -10px 34px rgba(15, 23, 42, 0.14);
|
|
1307
|
+
animation: cf-drawer-up 0.24s cubic-bezier(0.22, 1, 0.36, 1) both;
|
|
1308
|
+
}
|
|
1309
|
+
.cf-action-drawer__handle {
|
|
1310
|
+
width: 36px;
|
|
1311
|
+
height: 3px;
|
|
1312
|
+
margin: 0 auto 6px;
|
|
995
1313
|
border-radius: 999px;
|
|
996
|
-
|
|
997
|
-
cursor: pointer;
|
|
998
|
-
transition: opacity 0.15s ease;
|
|
1314
|
+
background: color-mix(in oklab, var(--cf-muted) 42%, transparent);
|
|
999
1315
|
}
|
|
1000
|
-
.cf-
|
|
1001
|
-
|
|
1002
|
-
|
|
1003
|
-
|
|
1004
|
-
|
|
1005
|
-
|
|
1006
|
-
|
|
1007
|
-
|
|
1008
|
-
|
|
1009
|
-
|
|
1010
|
-
|
|
1011
|
-
|
|
1012
|
-
|
|
1316
|
+
.cf-action-drawer__head {
|
|
1317
|
+
display: flex;
|
|
1318
|
+
align-items: center;
|
|
1319
|
+
justify-content: space-between;
|
|
1320
|
+
gap: 10px;
|
|
1321
|
+
padding: 0 3px 6px;
|
|
1322
|
+
color: var(--cf-text);
|
|
1323
|
+
}
|
|
1324
|
+
.cf-action-drawer__head strong {
|
|
1325
|
+
display: block;
|
|
1326
|
+
font-size: 13px;
|
|
1327
|
+
line-height: 1.2;
|
|
1328
|
+
}
|
|
1329
|
+
.cf-action-drawer__eyebrow {
|
|
1330
|
+
display: block;
|
|
1331
|
+
margin-bottom: 2px;
|
|
1332
|
+
font-size: 9px;
|
|
1333
|
+
font-weight: 800;
|
|
1334
|
+
letter-spacing: 0.16em;
|
|
1335
|
+
text-transform: uppercase;
|
|
1336
|
+
color: var(--cf-muted);
|
|
1337
|
+
}
|
|
1338
|
+
.cf-action-drawer__close {
|
|
1013
1339
|
display: inline-flex;
|
|
1014
1340
|
align-items: center;
|
|
1015
|
-
|
|
1016
|
-
|
|
1017
|
-
|
|
1018
|
-
|
|
1019
|
-
background: linear-gradient(135deg, var(--cf-accent, #2f7f55) 0%, var(--cf-accent-2, #2f7de8) 160%);
|
|
1341
|
+
justify-content: center;
|
|
1342
|
+
width: 28px;
|
|
1343
|
+
height: 28px;
|
|
1344
|
+
border: 1px solid var(--cf-border);
|
|
1020
1345
|
border-radius: 999px;
|
|
1021
|
-
|
|
1022
|
-
|
|
1023
|
-
|
|
1346
|
+
background: var(--cf-bg-soft);
|
|
1347
|
+
color: var(--cf-muted);
|
|
1348
|
+
cursor: pointer;
|
|
1024
1349
|
}
|
|
1025
|
-
.cf-
|
|
1026
|
-
|
|
1027
|
-
/* ---------- Clear-chat confirm dialog (in-widget, replaces window.confirm) ---------- */
|
|
1028
|
-
.cf-confirm {
|
|
1029
|
-
position: absolute;
|
|
1030
|
-
inset: 0;
|
|
1031
|
-
z-index: 6;
|
|
1032
|
-
pointer-events: auto;
|
|
1350
|
+
.cf-action-drawer__close svg { width: 14px; height: 14px; }
|
|
1351
|
+
.cf-action-drawer__grid {
|
|
1033
1352
|
display: grid;
|
|
1034
|
-
|
|
1035
|
-
padding: 22px;
|
|
1036
|
-
background: color-mix(in oklab, var(--cf-bg) 62%, transparent);
|
|
1037
|
-
backdrop-filter: blur(2px);
|
|
1038
|
-
animation: cf-fade-in 0.14s ease both;
|
|
1353
|
+
gap: 6px;
|
|
1039
1354
|
}
|
|
1040
|
-
.cf-
|
|
1355
|
+
.cf-action-card {
|
|
1356
|
+
display: grid;
|
|
1357
|
+
grid-template-columns: 30px minmax(0, 1fr) 14px;
|
|
1358
|
+
align-items: center;
|
|
1359
|
+
gap: 8px;
|
|
1041
1360
|
width: 100%;
|
|
1042
|
-
max-width: 300px;
|
|
1043
|
-
background: var(--cf-bg);
|
|
1044
1361
|
border: 1px solid var(--cf-border);
|
|
1045
|
-
border-radius:
|
|
1046
|
-
|
|
1047
|
-
|
|
1048
|
-
|
|
1049
|
-
|
|
1362
|
+
border-radius: 14px;
|
|
1363
|
+
padding: 7px 8px;
|
|
1364
|
+
background: color-mix(in oklab, var(--cf-bg-soft) 72%, transparent);
|
|
1365
|
+
color: var(--cf-text);
|
|
1366
|
+
text-align: left;
|
|
1367
|
+
cursor: pointer;
|
|
1368
|
+
transition:
|
|
1369
|
+
transform 0.16s ease,
|
|
1370
|
+
border-color 0.16s ease,
|
|
1371
|
+
background 0.16s ease;
|
|
1372
|
+
}
|
|
1373
|
+
.cf-action-card:hover {
|
|
1374
|
+
border-color: color-mix(in oklab, var(--cf-accent) 44%, var(--cf-border));
|
|
1375
|
+
background: color-mix(in oklab, var(--cf-accent) 9%, var(--cf-bg-soft));
|
|
1376
|
+
}
|
|
1377
|
+
.cf-action-card:active { transform: translateY(1px); }
|
|
1378
|
+
.cf-action-card > svg {
|
|
1379
|
+
width: 13px;
|
|
1380
|
+
height: 13px;
|
|
1381
|
+
color: var(--cf-muted);
|
|
1382
|
+
transform: rotate(-90deg);
|
|
1050
1383
|
}
|
|
1051
|
-
.cf-
|
|
1052
|
-
|
|
1053
|
-
|
|
1054
|
-
|
|
1055
|
-
|
|
1384
|
+
.cf-action-card__icon {
|
|
1385
|
+
display: inline-flex;
|
|
1386
|
+
align-items: center;
|
|
1387
|
+
justify-content: center;
|
|
1388
|
+
width: 30px;
|
|
1389
|
+
height: 30px;
|
|
1056
1390
|
border-radius: 10px;
|
|
1057
|
-
|
|
1058
|
-
|
|
1059
|
-
transition: transform 0.1s ease, opacity 0.15s ease, border-color 0.15s ease, background 0.15s ease;
|
|
1391
|
+
background: color-mix(in oklab, var(--cf-accent) 14%, transparent);
|
|
1392
|
+
color: var(--cf-accent);
|
|
1060
1393
|
}
|
|
1061
|
-
.cf-
|
|
1062
|
-
.cf-
|
|
1063
|
-
|
|
1064
|
-
|
|
1065
|
-
|
|
1066
|
-
|
|
1067
|
-
|
|
1068
|
-
|
|
1069
|
-
|
|
1070
|
-
|
|
1071
|
-
|
|
1072
|
-
height: 1px;
|
|
1073
|
-
padding: 0;
|
|
1074
|
-
margin: -1px;
|
|
1394
|
+
.cf-action-card__icon svg { width: 14px; height: 14px; }
|
|
1395
|
+
.cf-action-card__copy {
|
|
1396
|
+
display: grid;
|
|
1397
|
+
gap: 2px;
|
|
1398
|
+
min-width: 0;
|
|
1399
|
+
}
|
|
1400
|
+
.cf-action-card__copy strong {
|
|
1401
|
+
font-size: 12px;
|
|
1402
|
+
line-height: 1.2;
|
|
1403
|
+
}
|
|
1404
|
+
.cf-action-card__copy small {
|
|
1075
1405
|
overflow: hidden;
|
|
1076
|
-
|
|
1406
|
+
color: var(--cf-muted);
|
|
1407
|
+
font-size: 10.5px;
|
|
1408
|
+
line-height: 1.25;
|
|
1409
|
+
text-overflow: ellipsis;
|
|
1077
1410
|
white-space: nowrap;
|
|
1411
|
+
}
|
|
1412
|
+
.cf-action-drawer__note {
|
|
1413
|
+
margin: 6px 3px 0;
|
|
1414
|
+
color: var(--cf-muted);
|
|
1415
|
+
font-size: 10px;
|
|
1416
|
+
line-height: 1.25;
|
|
1417
|
+
}
|
|
1418
|
+
.cf-action-drawer .cf-form,
|
|
1419
|
+
.cf-action-drawer .cf-booking {
|
|
1420
|
+
max-width: none;
|
|
1421
|
+
margin: 0;
|
|
1078
1422
|
border: 0;
|
|
1423
|
+
background: transparent;
|
|
1424
|
+
box-shadow: none;
|
|
1425
|
+
}
|
|
1426
|
+
.cf-footer-actions .cf-actions {
|
|
1427
|
+
display: grid;
|
|
1428
|
+
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
1429
|
+
gap: 7px;
|
|
1430
|
+
}
|
|
1431
|
+
.cf-footer-actions .cf-action {
|
|
1432
|
+
justify-content: center;
|
|
1433
|
+
min-width: 0;
|
|
1434
|
+
gap: 5px;
|
|
1435
|
+
min-height: 32px;
|
|
1436
|
+
border-radius: 11px;
|
|
1437
|
+
padding: 6px 8px;
|
|
1438
|
+
font-size: 12px;
|
|
1439
|
+
line-height: 1.15;
|
|
1440
|
+
font-weight: 650;
|
|
1441
|
+
}
|
|
1442
|
+
.cf-footer-actions .cf-action svg {
|
|
1443
|
+
width: 13px;
|
|
1444
|
+
height: 13px;
|
|
1445
|
+
}
|
|
1446
|
+
.cf-footer-actions .cf-form,
|
|
1447
|
+
.cf-footer-actions .cf-booking {
|
|
1448
|
+
max-width: none;
|
|
1079
1449
|
}
|
|
1080
1450
|
|
|
1081
|
-
|
|
1082
|
-
|
|
1083
|
-
|
|
1084
|
-
|
|
1085
|
-
|
|
1086
|
-
|
|
1087
|
-
|
|
1451
|
+
@keyframes cf-drawer-up {
|
|
1452
|
+
from {
|
|
1453
|
+
opacity: 0;
|
|
1454
|
+
transform: translateY(14px) scale(0.98);
|
|
1455
|
+
}
|
|
1456
|
+
to {
|
|
1457
|
+
opacity: 1;
|
|
1458
|
+
transform: translateY(0) scale(1);
|
|
1459
|
+
}
|
|
1460
|
+
}
|
|
1461
|
+
|
|
1462
|
+
/* ---------- Assistant card module ---------- */
|
|
1463
|
+
.cf-assistant-card {
|
|
1464
|
+
display: flex;
|
|
1465
|
+
flex-direction: column;
|
|
1466
|
+
gap: 12px;
|
|
1467
|
+
margin: 0 2px 4px;
|
|
1468
|
+
animation: cf-msg-in 0.32s cubic-bezier(0.22, 1, 0.36, 1) both;
|
|
1469
|
+
}
|
|
1470
|
+
.cf-assistant-card--pinned {
|
|
1471
|
+
flex-shrink: 0;
|
|
1472
|
+
gap: 0;
|
|
1473
|
+
margin: 0;
|
|
1474
|
+
padding: 8px 14px 10px;
|
|
1475
|
+
border-bottom: 1px solid var(--cf-border);
|
|
1476
|
+
background: var(--cf-bg);
|
|
1477
|
+
}
|
|
1478
|
+
.cf-assistant-card--compact {
|
|
1479
|
+
align-items: flex-start;
|
|
1480
|
+
padding-top: 10px;
|
|
1481
|
+
padding-bottom: 12px;
|
|
1482
|
+
}
|
|
1483
|
+
.cf-assistant-card__compact-speak {
|
|
1484
|
+
position: relative;
|
|
1485
|
+
isolation: isolate;
|
|
1088
1486
|
display: inline-flex;
|
|
1089
1487
|
align-items: center;
|
|
1090
|
-
gap:
|
|
1488
|
+
gap: 8px;
|
|
1091
1489
|
max-width: 100%;
|
|
1092
|
-
|
|
1490
|
+
min-height: 44px;
|
|
1491
|
+
padding: 5px 15px 5px 6px;
|
|
1093
1492
|
border-radius: 999px;
|
|
1094
|
-
background:
|
|
1095
|
-
|
|
1493
|
+
background:
|
|
1494
|
+
linear-gradient(180deg, color-mix(in oklab, var(--cf-accent) 13%, var(--cf-surface)), color-mix(in oklab, var(--cf-bg) 92%, var(--cf-surface))),
|
|
1495
|
+
var(--cf-bg);
|
|
1496
|
+
border: 1px solid color-mix(in oklab, var(--cf-accent) 58%, var(--cf-border));
|
|
1096
1497
|
color: var(--cf-text);
|
|
1097
|
-
|
|
1498
|
+
box-shadow:
|
|
1499
|
+
inset 0 1px 0 color-mix(in oklab, #fff 13%, transparent),
|
|
1500
|
+
0 13px 30px -22px color-mix(in oklab, var(--cf-accent) 60%, #000);
|
|
1501
|
+
font-size: 12.25px;
|
|
1502
|
+
font-weight: 750;
|
|
1503
|
+
line-height: 1;
|
|
1504
|
+
transition: border-color 0.15s ease, transform 0.12s ease, background 0.15s ease, box-shadow 0.15s ease;
|
|
1505
|
+
overflow: hidden;
|
|
1098
1506
|
}
|
|
1099
|
-
.cf-
|
|
1100
|
-
|
|
1101
|
-
|
|
1102
|
-
|
|
1103
|
-
|
|
1104
|
-
|
|
1105
|
-
|
|
1106
|
-
|
|
1107
|
-
|
|
1108
|
-
|
|
1109
|
-
|
|
1110
|
-
width: 100vw;
|
|
1111
|
-
max-width: 100vw;
|
|
1112
|
-
height: 100dvh;
|
|
1113
|
-
max-height: 100dvh;
|
|
1114
|
-
border-radius: 0;
|
|
1115
|
-
}
|
|
1116
|
-
.cf-launcher { bottom: 16px; right: 16px; }
|
|
1507
|
+
.cf-assistant-card__compact-speak::before {
|
|
1508
|
+
content: '';
|
|
1509
|
+
position: absolute;
|
|
1510
|
+
inset: 1px;
|
|
1511
|
+
z-index: -1;
|
|
1512
|
+
border-radius: inherit;
|
|
1513
|
+
background:
|
|
1514
|
+
radial-gradient(circle at 20% 10%, color-mix(in oklab, var(--cf-accent) 28%, transparent), transparent 42%),
|
|
1515
|
+
radial-gradient(circle at 85% 100%, color-mix(in oklab, var(--cf-accent-2) 18%, transparent), transparent 38%);
|
|
1516
|
+
opacity: 0.76;
|
|
1517
|
+
pointer-events: none;
|
|
1117
1518
|
}
|
|
1118
|
-
|
|
1119
|
-
|
|
1120
|
-
|
|
1121
|
-
|
|
1122
|
-
|
|
1519
|
+
.cf-assistant-card__compact-speak:hover {
|
|
1520
|
+
border-color: color-mix(in oklab, var(--cf-accent) 82%, var(--cf-border));
|
|
1521
|
+
box-shadow:
|
|
1522
|
+
inset 0 1px 0 color-mix(in oklab, #fff 15%, transparent),
|
|
1523
|
+
0 16px 34px -22px color-mix(in oklab, var(--cf-accent) 76%, #000);
|
|
1524
|
+
}
|
|
1525
|
+
.cf-assistant-card__compact-speak:active { transform: scale(0.98); }
|
|
1526
|
+
.cf-assistant-card__compact-speak:focus-visible {
|
|
1527
|
+
outline: 2px solid var(--cf-accent-2);
|
|
1528
|
+
outline-offset: 2px;
|
|
1529
|
+
}
|
|
1530
|
+
.cf-assistant-card__compact-mic {
|
|
1531
|
+
width: 24px;
|
|
1532
|
+
height: 24px;
|
|
1533
|
+
margin-left: -14px;
|
|
1534
|
+
border-radius: 999px;
|
|
1535
|
+
display: inline-flex;
|
|
1536
|
+
align-items: center;
|
|
1537
|
+
justify-content: center;
|
|
1538
|
+
flex-shrink: 0;
|
|
1539
|
+
color: var(--cf-accent);
|
|
1540
|
+
background: color-mix(in oklab, var(--cf-bg) 90%, transparent);
|
|
1541
|
+
border: 1px solid color-mix(in oklab, var(--cf-accent) 48%, var(--cf-border));
|
|
1542
|
+
box-shadow: 0 7px 18px -12px rgba(0, 0, 0, 0.75);
|
|
1123
1543
|
}
|
|
1124
|
-
|
|
1125
|
-
|
|
1126
|
-
|
|
1544
|
+
.cf-assistant-card__compact-mic svg {
|
|
1545
|
+
width: 13px;
|
|
1546
|
+
height: 13px;
|
|
1547
|
+
color: var(--cf-accent);
|
|
1548
|
+
flex-shrink: 0;
|
|
1127
1549
|
}
|
|
1128
|
-
|
|
1129
|
-
|
|
1130
|
-
to { opacity: 1; transform: none; }
|
|
1550
|
+
.cf-assistant-card__compact-mic:first-child {
|
|
1551
|
+
margin-left: 0;
|
|
1131
1552
|
}
|
|
1132
|
-
|
|
1133
|
-
|
|
1134
|
-
|
|
1553
|
+
.cf-assistant-card__compact-label {
|
|
1554
|
+
min-width: 0;
|
|
1555
|
+
overflow: hidden;
|
|
1556
|
+
text-overflow: ellipsis;
|
|
1557
|
+
white-space: nowrap;
|
|
1558
|
+
letter-spacing: 0.01em;
|
|
1135
1559
|
}
|
|
1136
|
-
|
|
1137
|
-
|
|
1138
|
-
|
|
1560
|
+
.cf-assistant-card__compact-avatar {
|
|
1561
|
+
width: 34px;
|
|
1562
|
+
height: 34px;
|
|
1563
|
+
border-radius: 999px;
|
|
1564
|
+
display: grid;
|
|
1565
|
+
place-items: center;
|
|
1566
|
+
flex-shrink: 0;
|
|
1567
|
+
overflow: hidden;
|
|
1568
|
+
color: #fff;
|
|
1569
|
+
background: linear-gradient(135deg, var(--cf-avatar-a, var(--cf-accent)), var(--cf-avatar-b, var(--cf-accent-2)));
|
|
1570
|
+
border: 1px solid color-mix(in oklab, #fff 24%, transparent);
|
|
1571
|
+
box-shadow:
|
|
1572
|
+
0 0 0 3px color-mix(in oklab, var(--cf-accent) 16%, transparent),
|
|
1573
|
+
inset 0 1px 0 color-mix(in oklab, #fff 18%, transparent);
|
|
1574
|
+
font-size: 11px;
|
|
1575
|
+
font-weight: 800;
|
|
1139
1576
|
}
|
|
1140
|
-
|
|
1141
|
-
|
|
1142
|
-
|
|
1577
|
+
.cf-assistant-card__compact-avatar img {
|
|
1578
|
+
width: 100%;
|
|
1579
|
+
height: 100%;
|
|
1580
|
+
object-fit: cover;
|
|
1143
1581
|
}
|
|
1144
|
-
|
|
1145
|
-
|
|
1146
|
-
|
|
1147
|
-
|
|
1148
|
-
|
|
1149
|
-
|
|
1150
|
-
|
|
1582
|
+
.cf-assistant-card--pinned .cf-assistant-card__stage {
|
|
1583
|
+
height: 132px;
|
|
1584
|
+
min-height: 0;
|
|
1585
|
+
border-radius: 13px;
|
|
1586
|
+
}
|
|
1587
|
+
/* The stage sizes/positions the card's video area; .cf-assistant-card__media
|
|
1588
|
+
inside it stays overflow: hidden for the rounded image/video corners,
|
|
1589
|
+
while interactive controls sit as a stage sibling so their popovers
|
|
1590
|
+
aren't clipped by it. */
|
|
1591
|
+
.cf-assistant-card__stage {
|
|
1592
|
+
position: relative;
|
|
1593
|
+
border-radius: 12px;
|
|
1594
|
+
aspect-ratio: 16 / 9;
|
|
1595
|
+
}
|
|
1596
|
+
.cf-assistant-card__voice-only {
|
|
1597
|
+
position: relative;
|
|
1598
|
+
display: flex;
|
|
1599
|
+
align-items: center;
|
|
1600
|
+
justify-content: center;
|
|
1601
|
+
width: 100%;
|
|
1602
|
+
min-height: 44px;
|
|
1603
|
+
align-self: stretch;
|
|
1604
|
+
}
|
|
1605
|
+
.cf-assistant-card__media {
|
|
1606
|
+
position: absolute;
|
|
1607
|
+
inset: 0;
|
|
1608
|
+
overflow: hidden;
|
|
1609
|
+
border-radius: inherit;
|
|
1610
|
+
background: var(--cf-surface);
|
|
1611
|
+
border: 1px solid var(--cf-border);
|
|
1612
|
+
}
|
|
1613
|
+
.cf-assistant-card__stage--local {
|
|
1614
|
+
isolation: isolate;
|
|
1615
|
+
overflow: hidden;
|
|
1616
|
+
background:
|
|
1617
|
+
radial-gradient(circle at 30% 18%, color-mix(in oklab, var(--cf-accent) 18%, transparent), transparent 36%),
|
|
1618
|
+
linear-gradient(145deg, color-mix(in oklab, var(--cf-surface) 72%, var(--cf-bg)), var(--cf-bg));
|
|
1619
|
+
border: 1px solid color-mix(in oklab, var(--cf-border) 82%, var(--cf-accent));
|
|
1620
|
+
box-shadow:
|
|
1621
|
+
inset 0 1px 0 color-mix(in oklab, #fff 9%, transparent),
|
|
1622
|
+
0 22px 44px -34px color-mix(in oklab, var(--cf-accent) 46%, #000);
|
|
1623
|
+
}
|
|
1624
|
+
.cf-assistant-card__stage--local.is-live {
|
|
1625
|
+
height: 188px;
|
|
1626
|
+
aspect-ratio: auto;
|
|
1627
|
+
}
|
|
1628
|
+
.cf-assistant-card--pinned .cf-assistant-card__stage--local.is-live {
|
|
1629
|
+
height: 154px;
|
|
1630
|
+
}
|
|
1631
|
+
.cf-assistant-card__stage--local.is-speaking {
|
|
1632
|
+
box-shadow:
|
|
1633
|
+
inset 0 1px 0 color-mix(in oklab, #fff 11%, transparent),
|
|
1634
|
+
0 20px 54px -28px color-mix(in oklab, var(--cf-accent) 72%, #000);
|
|
1635
|
+
}
|
|
1636
|
+
.cf-assistant-card__stage--local.is-listening {
|
|
1637
|
+
border-color: color-mix(in oklab, var(--cf-accent) 62%, var(--cf-border));
|
|
1638
|
+
}
|
|
1639
|
+
.cf-assistant-card__stage--local.is-muted {
|
|
1640
|
+
filter: saturate(0.72);
|
|
1641
|
+
}
|
|
1642
|
+
.cf-assistant-card__stage--local .cf-assistant-card__media {
|
|
1643
|
+
z-index: 1;
|
|
1644
|
+
border: 0;
|
|
1645
|
+
background:
|
|
1646
|
+
radial-gradient(circle at 50% 42%, color-mix(in oklab, var(--cf-accent) 18%, transparent), transparent 38%),
|
|
1647
|
+
color-mix(in oklab, var(--cf-bg) 92%, var(--cf-surface));
|
|
1648
|
+
}
|
|
1649
|
+
.cf-assistant-card__media--uploaded::after {
|
|
1650
|
+
content: '';
|
|
1651
|
+
position: absolute;
|
|
1652
|
+
inset: 0;
|
|
1653
|
+
pointer-events: none;
|
|
1654
|
+
background:
|
|
1655
|
+
radial-gradient(circle at 50% 50%, transparent 28%, rgba(2, 6, 23, 0.08) 62%, rgba(2, 6, 23, 0.34) 100%),
|
|
1656
|
+
linear-gradient(180deg, transparent 52%, rgba(2, 6, 23, 0.26));
|
|
1657
|
+
}
|
|
1658
|
+
.cf-assistant-card__media img,
|
|
1659
|
+
.cf-assistant-card__media video {
|
|
1660
|
+
width: 100%;
|
|
1661
|
+
height: 100%;
|
|
1662
|
+
display: block;
|
|
1663
|
+
object-fit: cover;
|
|
1664
|
+
}
|
|
1665
|
+
.cf-avatar-aura {
|
|
1666
|
+
position: absolute;
|
|
1667
|
+
left: 50%;
|
|
1668
|
+
top: 50%;
|
|
1669
|
+
width: 104px;
|
|
1670
|
+
height: 104px;
|
|
1671
|
+
border-radius: 999px;
|
|
1672
|
+
transform: translate(-50%, -50%) scale(0.88);
|
|
1673
|
+
border: 1px solid color-mix(in oklab, var(--cf-accent) 42%, transparent);
|
|
1674
|
+
opacity: 0;
|
|
1675
|
+
pointer-events: none;
|
|
1676
|
+
z-index: 3;
|
|
1677
|
+
}
|
|
1678
|
+
.cf-avatar-aura--two {
|
|
1679
|
+
width: 142px;
|
|
1680
|
+
height: 142px;
|
|
1681
|
+
}
|
|
1682
|
+
.cf-assistant-card__stage--local.is-speaking .cf-avatar-aura--one {
|
|
1683
|
+
animation: cf-avatar-breathe 1.35s ease-in-out infinite;
|
|
1684
|
+
}
|
|
1685
|
+
.cf-assistant-card__stage--local.is-speaking .cf-avatar-aura--two {
|
|
1686
|
+
animation: cf-avatar-breathe 1.35s ease-in-out infinite 0.32s;
|
|
1687
|
+
}
|
|
1688
|
+
.cf-avatar-listen-ring {
|
|
1689
|
+
position: absolute;
|
|
1690
|
+
left: 50%;
|
|
1691
|
+
top: 50%;
|
|
1692
|
+
width: calc(112px + (var(--cf-listen, 0.2) * 42px));
|
|
1693
|
+
height: calc(112px + (var(--cf-listen, 0.2) * 42px));
|
|
1694
|
+
border-radius: 999px;
|
|
1695
|
+
transform: translate(-50%, -50%);
|
|
1696
|
+
border: 2px solid color-mix(in oklab, var(--cf-accent) 58%, transparent);
|
|
1697
|
+
box-shadow: 0 0 calc(14px + (var(--cf-listen, 0.2) * 24px)) color-mix(in oklab, var(--cf-accent) 34%, transparent);
|
|
1698
|
+
opacity: 0;
|
|
1699
|
+
pointer-events: none;
|
|
1700
|
+
z-index: 4;
|
|
1701
|
+
}
|
|
1702
|
+
.cf-assistant-card__stage--local.is-listening .cf-avatar-listen-ring {
|
|
1703
|
+
opacity: calc(0.36 + (var(--cf-listen, 0.2) * 0.42));
|
|
1704
|
+
}
|
|
1705
|
+
.cf-avatar-wave {
|
|
1706
|
+
position: absolute;
|
|
1707
|
+
left: 50%;
|
|
1708
|
+
bottom: 46px;
|
|
1709
|
+
z-index: 6;
|
|
1710
|
+
display: inline-flex;
|
|
1711
|
+
align-items: center;
|
|
1712
|
+
justify-content: center;
|
|
1713
|
+
gap: 4px;
|
|
1714
|
+
min-width: 58px;
|
|
1715
|
+
height: 25px;
|
|
1716
|
+
padding: 5px 8px;
|
|
1717
|
+
border-radius: 999px;
|
|
1718
|
+
transform: translateX(-50%) translateY(8px);
|
|
1719
|
+
background: color-mix(in oklab, var(--cf-bg) 82%, transparent);
|
|
1720
|
+
border: 1px solid color-mix(in oklab, var(--cf-accent) 36%, transparent);
|
|
1721
|
+
opacity: 0;
|
|
1722
|
+
pointer-events: none;
|
|
1723
|
+
backdrop-filter: blur(10px);
|
|
1724
|
+
}
|
|
1725
|
+
.cf-avatar-wave span {
|
|
1726
|
+
width: 4px;
|
|
1727
|
+
height: 8px;
|
|
1728
|
+
border-radius: 999px;
|
|
1729
|
+
background: color-mix(in oklab, var(--cf-accent) 88%, #fff);
|
|
1730
|
+
transform-origin: center;
|
|
1731
|
+
}
|
|
1732
|
+
.cf-assistant-card__stage--local.is-speaking .cf-avatar-wave {
|
|
1733
|
+
opacity: 1;
|
|
1734
|
+
transform: translateX(-50%) translateY(0);
|
|
1735
|
+
}
|
|
1736
|
+
.cf-assistant-card__stage--local.is-speaking .cf-avatar-wave span {
|
|
1737
|
+
animation: cf-avatar-wave 0.58s ease-in-out infinite;
|
|
1738
|
+
}
|
|
1739
|
+
.cf-assistant-card__stage--local.is-speaking .cf-avatar-wave span:nth-child(2) { animation-delay: 0.1s; }
|
|
1740
|
+
.cf-assistant-card__stage--local.is-speaking .cf-avatar-wave span:nth-child(3) { animation-delay: 0.2s; }
|
|
1741
|
+
.cf-assistant-card__stage--local.is-speaking .cf-avatar-wave span:nth-child(4) { animation-delay: 0.3s; }
|
|
1742
|
+
.cf-assistant-card__stage--local.is-thinking .cf-assistant-card__media::before {
|
|
1743
|
+
content: '';
|
|
1744
|
+
position: absolute;
|
|
1745
|
+
inset: -35%;
|
|
1746
|
+
z-index: 5;
|
|
1747
|
+
pointer-events: none;
|
|
1748
|
+
background: linear-gradient(115deg, transparent 42%, color-mix(in oklab, var(--cf-accent) 20%, transparent) 50%, transparent 58%);
|
|
1749
|
+
animation: cf-avatar-thinking 1.45s ease-in-out infinite;
|
|
1750
|
+
}
|
|
1751
|
+
.cf-assistant-card__avatar-stage {
|
|
1752
|
+
position: absolute;
|
|
1753
|
+
inset: 0;
|
|
1754
|
+
display: grid;
|
|
1755
|
+
place-items: center;
|
|
1756
|
+
--cf-avatar-a: var(--cf-accent);
|
|
1757
|
+
--cf-avatar-b: color-mix(in oklab, var(--cf-accent) 70%, #0f1f2e);
|
|
1758
|
+
--cf-avatar-glow: color-mix(in oklab, var(--cf-accent) 38%, transparent);
|
|
1759
|
+
background:
|
|
1760
|
+
radial-gradient(circle at 35% 30%, var(--cf-avatar-glow), transparent 32%),
|
|
1761
|
+
linear-gradient(145deg, color-mix(in oklab, var(--cf-avatar-a) 18%, var(--cf-bg)), var(--cf-surface-2));
|
|
1762
|
+
}
|
|
1763
|
+
.cf-assistant-card__face {
|
|
1764
|
+
position: relative;
|
|
1765
|
+
width: 128px;
|
|
1766
|
+
height: 128px;
|
|
1767
|
+
border-radius: 999px;
|
|
1768
|
+
display: grid;
|
|
1769
|
+
place-items: center;
|
|
1770
|
+
color: #fff;
|
|
1771
|
+
background: linear-gradient(145deg, var(--cf-avatar-a), var(--cf-avatar-b));
|
|
1772
|
+
box-shadow: 0 22px 44px -28px rgba(0, 0, 0, 0.75);
|
|
1773
|
+
z-index: 2;
|
|
1774
|
+
}
|
|
1775
|
+
.cf-assistant-card__stage--local.is-speaking .cf-assistant-card__face {
|
|
1776
|
+
animation: cf-avatar-nod 1.6s ease-in-out infinite;
|
|
1777
|
+
}
|
|
1778
|
+
.cf-assistant-card__stage--local.is-listening .cf-assistant-card__face {
|
|
1779
|
+
box-shadow:
|
|
1780
|
+
0 22px 44px -28px rgba(0, 0, 0, 0.75),
|
|
1781
|
+
0 0 0 calc(5px + (var(--cf-listen, 0.2) * 6px)) color-mix(in oklab, var(--cf-accent) 16%, transparent);
|
|
1782
|
+
}
|
|
1783
|
+
.cf-assistant-card--pinned .cf-assistant-card__face {
|
|
1784
|
+
width: 72px;
|
|
1785
|
+
height: 72px;
|
|
1786
|
+
}
|
|
1787
|
+
.cf-avatar-preset--support-guide {
|
|
1788
|
+
--cf-avatar-a: #10b981;
|
|
1789
|
+
--cf-avatar-b: #0f766e;
|
|
1790
|
+
--cf-avatar-glow: rgba(16, 185, 129, 0.34);
|
|
1791
|
+
}
|
|
1792
|
+
.cf-avatar-preset--sales-host {
|
|
1793
|
+
--cf-avatar-a: #3b82f6;
|
|
1794
|
+
--cf-avatar-b: #4338ca;
|
|
1795
|
+
--cf-avatar-glow: rgba(59, 130, 246, 0.34);
|
|
1796
|
+
}
|
|
1797
|
+
.cf-avatar-preset--calm-advisor {
|
|
1798
|
+
--cf-avatar-a: #64748b;
|
|
1799
|
+
--cf-avatar-b: #0f172a;
|
|
1800
|
+
--cf-avatar-glow: rgba(100, 116, 139, 0.34);
|
|
1801
|
+
}
|
|
1802
|
+
.cf-avatar-preset--technical-guide {
|
|
1803
|
+
--cf-avatar-a: #06b6d4;
|
|
1804
|
+
--cf-avatar-b: #1d4ed8;
|
|
1805
|
+
--cf-avatar-glow: rgba(6, 182, 212, 0.34);
|
|
1806
|
+
}
|
|
1807
|
+
.cf-avatar-preset--school-desk {
|
|
1808
|
+
--cf-avatar-a: #8b5cf6;
|
|
1809
|
+
--cf-avatar-b: #6d28d9;
|
|
1810
|
+
--cf-avatar-glow: rgba(139, 92, 246, 0.34);
|
|
1811
|
+
}
|
|
1812
|
+
.cf-avatar-preset--front-office {
|
|
1813
|
+
--cf-avatar-a: #f59e0b;
|
|
1814
|
+
--cf-avatar-b: #c2410c;
|
|
1815
|
+
--cf-avatar-glow: rgba(245, 158, 11, 0.34);
|
|
1816
|
+
}
|
|
1817
|
+
.cf-assistant-card__initials {
|
|
1818
|
+
transform: translateY(-12px);
|
|
1819
|
+
font-size: 34px;
|
|
1820
|
+
font-weight: 800;
|
|
1821
|
+
}
|
|
1822
|
+
.cf-assistant-card--pinned .cf-assistant-card__initials {
|
|
1823
|
+
transform: translateY(-6px);
|
|
1824
|
+
font-size: 19px;
|
|
1825
|
+
}
|
|
1826
|
+
.cf-assistant-card__eye {
|
|
1827
|
+
position: absolute;
|
|
1828
|
+
top: 58px;
|
|
1829
|
+
width: 8px;
|
|
1830
|
+
height: 8px;
|
|
1831
|
+
border-radius: 999px;
|
|
1832
|
+
background: rgba(255, 255, 255, 0.9);
|
|
1833
|
+
}
|
|
1834
|
+
.cf-assistant-card__eye--left { left: 42px; }
|
|
1835
|
+
.cf-assistant-card__eye--right { right: 42px; }
|
|
1836
|
+
.cf-assistant-card--pinned .cf-assistant-card__eye {
|
|
1837
|
+
top: 33px;
|
|
1838
|
+
width: 5px;
|
|
1839
|
+
height: 5px;
|
|
1840
|
+
}
|
|
1841
|
+
.cf-assistant-card--pinned .cf-assistant-card__eye--left { left: 23px; }
|
|
1842
|
+
.cf-assistant-card--pinned .cf-assistant-card__eye--right { right: 23px; }
|
|
1843
|
+
.cf-assistant-card__mouth {
|
|
1844
|
+
position: absolute;
|
|
1845
|
+
left: 50%;
|
|
1846
|
+
bottom: 31px;
|
|
1847
|
+
width: 34px;
|
|
1848
|
+
height: 6px;
|
|
1849
|
+
transform: translateX(-50%);
|
|
1850
|
+
border-radius: 999px;
|
|
1851
|
+
background: rgba(255, 255, 255, 0.9);
|
|
1852
|
+
}
|
|
1853
|
+
.cf-assistant-card--pinned .cf-assistant-card__mouth {
|
|
1854
|
+
bottom: 18px;
|
|
1855
|
+
width: 20px;
|
|
1856
|
+
height: 4px;
|
|
1857
|
+
}
|
|
1858
|
+
.cf-assistant-card.is-speaking .cf-assistant-card__mouth {
|
|
1859
|
+
animation: cf-mouth-talk 0.24s ease-in-out infinite alternate;
|
|
1860
|
+
}
|
|
1861
|
+
.cf-assistant-card__stage--local.is-speaking .cf-assistant-card__mouth {
|
|
1862
|
+
animation: cf-mouth-talk 0.24s ease-in-out infinite alternate;
|
|
1863
|
+
}
|
|
1864
|
+
.cf-assistant-card__mouth--overlay {
|
|
1865
|
+
z-index: 6;
|
|
1866
|
+
bottom: 39px;
|
|
1867
|
+
width: 42px;
|
|
1868
|
+
height: 7px;
|
|
1869
|
+
opacity: 0;
|
|
1870
|
+
background: color-mix(in oklab, #fff 90%, var(--cf-accent));
|
|
1871
|
+
box-shadow:
|
|
1872
|
+
0 0 0 4px rgba(2, 6, 23, 0.22),
|
|
1873
|
+
0 10px 22px -10px rgba(0, 0, 0, 0.85);
|
|
1874
|
+
}
|
|
1875
|
+
.cf-assistant-card__stage--local.is-speaking .cf-assistant-card__mouth--overlay {
|
|
1876
|
+
opacity: 1;
|
|
1877
|
+
}
|
|
1878
|
+
.cf-assistant-card--pinned .cf-assistant-card__mouth--overlay {
|
|
1879
|
+
bottom: 42px;
|
|
1880
|
+
}
|
|
1881
|
+
@keyframes cf-mouth-talk {
|
|
1882
|
+
from { height: 5px; width: 28px; border-radius: 999px; }
|
|
1883
|
+
to { height: 20px; width: 22px; border-radius: 45% 45% 55% 55%; }
|
|
1884
|
+
}
|
|
1885
|
+
@keyframes cf-avatar-breathe {
|
|
1886
|
+
0%, 100% { opacity: 0.16; transform: translate(-50%, -50%) scale(0.82); }
|
|
1887
|
+
50% { opacity: 0.58; transform: translate(-50%, -50%) scale(1.12); }
|
|
1888
|
+
}
|
|
1889
|
+
@keyframes cf-avatar-wave {
|
|
1890
|
+
0%, 100% { transform: scaleY(0.62); opacity: 0.72; }
|
|
1891
|
+
50% { transform: scaleY(1.85); opacity: 1; }
|
|
1892
|
+
}
|
|
1893
|
+
@keyframes cf-avatar-thinking {
|
|
1894
|
+
0% { transform: translateX(-18%); opacity: 0; }
|
|
1895
|
+
38% { opacity: 1; }
|
|
1896
|
+
100% { transform: translateX(18%); opacity: 0; }
|
|
1897
|
+
}
|
|
1898
|
+
@keyframes cf-avatar-nod {
|
|
1899
|
+
0%, 100% { transform: translateY(0) scale(1); }
|
|
1900
|
+
45% { transform: translateY(-2px) scale(1.012); }
|
|
1901
|
+
}
|
|
1902
|
+
.cf-assistant-card__speak {
|
|
1903
|
+
position: absolute;
|
|
1904
|
+
left: 50%;
|
|
1905
|
+
bottom: 12px;
|
|
1906
|
+
transform: translateX(-50%);
|
|
1907
|
+
display: inline-flex;
|
|
1908
|
+
align-items: center;
|
|
1909
|
+
gap: 7px;
|
|
1910
|
+
max-width: calc(100% - 24px);
|
|
1911
|
+
padding: 8px 12px;
|
|
1912
|
+
border-radius: 999px;
|
|
1913
|
+
background: color-mix(in oklab, var(--cf-bg) 92%, transparent);
|
|
1914
|
+
color: var(--cf-accent);
|
|
1915
|
+
box-shadow: 0 10px 22px -14px rgba(15, 30, 42, 0.6);
|
|
1916
|
+
font-size: 12.5px;
|
|
1917
|
+
font-weight: 700;
|
|
1918
|
+
white-space: nowrap;
|
|
1919
|
+
}
|
|
1920
|
+
.cf-assistant-card--pinned .cf-assistant-card__speak {
|
|
1921
|
+
padding: 6px 10px;
|
|
1922
|
+
font-size: 11.5px;
|
|
1923
|
+
}
|
|
1924
|
+
.cf-assistant-card__speak svg { width: 15px; height: 15px; }
|
|
1925
|
+
.cf-assistant-card__voice-only .cf-assistant-card__speak,
|
|
1926
|
+
.cf-assistant-card__voice-only .cf-call-controls {
|
|
1927
|
+
position: static;
|
|
1928
|
+
transform: none;
|
|
1929
|
+
max-width: 100%;
|
|
1930
|
+
}
|
|
1931
|
+
.cf-assistant-card--connecting {
|
|
1932
|
+
min-height: 100%;
|
|
1933
|
+
display: grid;
|
|
1934
|
+
place-items: center;
|
|
1935
|
+
align-content: center;
|
|
1936
|
+
gap: 18px;
|
|
1937
|
+
padding: 34px 24px 42px;
|
|
1938
|
+
text-align: center;
|
|
1939
|
+
border-top: 1px solid var(--cf-border);
|
|
1940
|
+
background:
|
|
1941
|
+
radial-gradient(circle at 50% 38%, color-mix(in oklab, var(--cf-accent) 16%, transparent), transparent 36%),
|
|
1942
|
+
linear-gradient(180deg, color-mix(in oklab, var(--cf-surface) 72%, var(--cf-bg)), var(--cf-bg));
|
|
1943
|
+
}
|
|
1944
|
+
.cf-assistant-card__connecting-avatar {
|
|
1945
|
+
position: relative;
|
|
1946
|
+
width: 118px;
|
|
1947
|
+
height: 118px;
|
|
1948
|
+
display: grid;
|
|
1949
|
+
place-items: center;
|
|
1950
|
+
}
|
|
1951
|
+
.cf-assistant-card__connecting-avatar img,
|
|
1952
|
+
.cf-assistant-card__connecting-face {
|
|
1953
|
+
width: 92px;
|
|
1954
|
+
height: 92px;
|
|
1955
|
+
border-radius: 999px;
|
|
1956
|
+
display: grid;
|
|
1957
|
+
place-items: center;
|
|
1958
|
+
object-fit: cover;
|
|
1959
|
+
color: #fff;
|
|
1960
|
+
font-size: 28px;
|
|
1961
|
+
font-weight: 850;
|
|
1962
|
+
letter-spacing: -0.04em;
|
|
1963
|
+
background: linear-gradient(145deg, var(--cf-accent), var(--cf-accent-2));
|
|
1964
|
+
border: 1px solid color-mix(in oklab, #fff 30%, transparent);
|
|
1965
|
+
box-shadow:
|
|
1966
|
+
0 22px 48px -24px color-mix(in oklab, var(--cf-accent) 60%, #000),
|
|
1967
|
+
0 0 0 8px color-mix(in oklab, var(--cf-accent) 10%, transparent);
|
|
1968
|
+
z-index: 2;
|
|
1969
|
+
}
|
|
1970
|
+
.cf-assistant-card__connecting-copy {
|
|
1971
|
+
display: grid;
|
|
1972
|
+
gap: 6px;
|
|
1973
|
+
}
|
|
1974
|
+
.cf-assistant-card__connecting-eyebrow {
|
|
1975
|
+
color: var(--cf-muted);
|
|
1976
|
+
font-size: 11px;
|
|
1977
|
+
font-weight: 800;
|
|
1978
|
+
letter-spacing: 0.12em;
|
|
1979
|
+
text-transform: uppercase;
|
|
1980
|
+
}
|
|
1981
|
+
.cf-assistant-card__connecting-copy strong {
|
|
1982
|
+
color: var(--cf-text);
|
|
1983
|
+
font-size: 18px;
|
|
1984
|
+
line-height: 1.25;
|
|
1985
|
+
}
|
|
1986
|
+
.cf-assistant-card--connecting .cf-call-ripple {
|
|
1987
|
+
inset: -18px;
|
|
1988
|
+
border-radius: 999px;
|
|
1989
|
+
}
|
|
1990
|
+
.cf-assistant-card--connecting .cf-call-ripple span {
|
|
1991
|
+
width: 92px;
|
|
1992
|
+
height: 92px;
|
|
1993
|
+
}
|
|
1994
|
+
|
|
1995
|
+
/* ---------- Call "working" ripple ----------
|
|
1996
|
+
Concentric rings pulsing out from the avatar's center while the call is
|
|
1997
|
+
connecting / transcribing / waiting for the reply โ the classic "ringing
|
|
1998
|
+
call" cue, so busy moments read as live activity instead of a freeze. */
|
|
1999
|
+
.cf-call-ripple {
|
|
2000
|
+
position: absolute;
|
|
2001
|
+
inset: 0;
|
|
2002
|
+
display: grid;
|
|
2003
|
+
place-items: center;
|
|
2004
|
+
pointer-events: none;
|
|
2005
|
+
overflow: hidden;
|
|
2006
|
+
border-radius: inherit;
|
|
2007
|
+
}
|
|
2008
|
+
.cf-call-ripple span {
|
|
2009
|
+
position: absolute;
|
|
2010
|
+
width: 74px;
|
|
2011
|
+
height: 74px;
|
|
2012
|
+
border-radius: 999px;
|
|
2013
|
+
border: 2px solid var(--cf-accent);
|
|
2014
|
+
opacity: 0;
|
|
2015
|
+
animation: cf-call-ripple 1.8s ease-out infinite;
|
|
2016
|
+
}
|
|
2017
|
+
.cf-call-ripple span:nth-child(2) { animation-delay: 0.6s; }
|
|
2018
|
+
.cf-call-ripple span:nth-child(3) { animation-delay: 1.2s; }
|
|
2019
|
+
@keyframes cf-call-ripple {
|
|
2020
|
+
0% { transform: scale(0.9); opacity: 0.55; }
|
|
2021
|
+
100% { transform: scale(2.6); opacity: 0; }
|
|
2022
|
+
}
|
|
2023
|
+
@media (prefers-reduced-motion: reduce) {
|
|
2024
|
+
.cf-call-ripple span { animation: none; opacity: 0.25; transform: scale(1.4); }
|
|
2025
|
+
.cf-call-ripple span:nth-child(2), .cf-call-ripple span:nth-child(3) { display: none; }
|
|
2026
|
+
}
|
|
2027
|
+
|
|
2028
|
+
/* ---------- In-call controls (mic / audio picker / expand / minimize / end) ---------- */
|
|
2029
|
+
.cf-call-controls {
|
|
2030
|
+
position: absolute;
|
|
2031
|
+
left: 50%;
|
|
2032
|
+
bottom: 12px;
|
|
2033
|
+
transform: translateX(-50%);
|
|
2034
|
+
display: inline-flex;
|
|
2035
|
+
align-items: center;
|
|
2036
|
+
gap: 4px;
|
|
2037
|
+
max-width: calc(100% - 24px);
|
|
2038
|
+
padding: 5px 7px;
|
|
2039
|
+
border-radius: 999px;
|
|
2040
|
+
background: color-mix(in oklab, var(--cf-bg) 94%, transparent);
|
|
2041
|
+
border: 1px solid color-mix(in oklab, var(--cf-border) 72%, transparent);
|
|
2042
|
+
box-shadow: 0 14px 34px -16px rgba(0, 0, 0, 0.7);
|
|
2043
|
+
z-index: 30;
|
|
2044
|
+
}
|
|
2045
|
+
.cf-assistant-card--pinned .cf-call-controls { padding: 4px 6px; gap: 4px; }
|
|
2046
|
+
.cf-call-btn {
|
|
2047
|
+
position: relative;
|
|
2048
|
+
flex-shrink: 0;
|
|
2049
|
+
width: 30px;
|
|
2050
|
+
height: 30px;
|
|
2051
|
+
border-radius: 999px;
|
|
2052
|
+
display: inline-flex;
|
|
2053
|
+
align-items: center;
|
|
2054
|
+
justify-content: center;
|
|
2055
|
+
gap: 6px;
|
|
2056
|
+
color: var(--cf-text);
|
|
2057
|
+
background: color-mix(in oklab, var(--cf-surface) 88%, transparent);
|
|
2058
|
+
border: 1px solid color-mix(in oklab, var(--cf-border) 76%, transparent);
|
|
2059
|
+
transition: background 0.15s ease, transform 0.12s ease, color 0.15s ease;
|
|
2060
|
+
}
|
|
2061
|
+
.cf-call-btn:hover { background: color-mix(in oklab, var(--cf-accent) 10%, var(--cf-surface)); }
|
|
2062
|
+
.cf-call-btn:active { transform: scale(0.94); }
|
|
2063
|
+
.cf-call-btn svg { width: 14px; height: 14px; }
|
|
2064
|
+
.cf-call-btn--microphones {
|
|
2065
|
+
width: 24px;
|
|
2066
|
+
margin-left: -5px;
|
|
2067
|
+
border-top-left-radius: 10px;
|
|
2068
|
+
border-bottom-left-radius: 10px;
|
|
2069
|
+
}
|
|
2070
|
+
.cf-call-btn--microphones svg { width: 13px; height: 13px; }
|
|
2071
|
+
.cf-call-btn--restore svg { width: 15px; height: 15px; }
|
|
2072
|
+
.cf-call-btn.is-muted {
|
|
2073
|
+
color: #fff;
|
|
2074
|
+
background: var(--cf-muted);
|
|
2075
|
+
border-color: transparent;
|
|
2076
|
+
}
|
|
2077
|
+
/* Live-listening cue: a soft ring around the mic button that breathes with
|
|
2078
|
+
the mic level, instead of a separate waveform element eating up row width. */
|
|
2079
|
+
.cf-call-btn.is-listening::after {
|
|
2080
|
+
content: '';
|
|
2081
|
+
position: absolute;
|
|
2082
|
+
inset: -4px;
|
|
2083
|
+
border-radius: inherit;
|
|
2084
|
+
border: 2px solid var(--cf-accent);
|
|
2085
|
+
opacity: calc(0.25 + var(--cf-wave, 0.2) * 0.5);
|
|
2086
|
+
transform: scale(calc(1 + var(--cf-wave, 0.2) * 0.22));
|
|
2087
|
+
transition: transform 0.09s ease, opacity 0.09s ease;
|
|
2088
|
+
pointer-events: none;
|
|
2089
|
+
}
|
|
2090
|
+
/* Your voice is actually registering: the mic fills with the accent color
|
|
2091
|
+
and the ring flares, so "it hears me" is unmistakable at a glance. */
|
|
2092
|
+
.cf-call-btn.is-listening.is-hot {
|
|
2093
|
+
color: var(--cf-accent-ink);
|
|
2094
|
+
background: var(--cf-accent);
|
|
2095
|
+
border-color: transparent;
|
|
2096
|
+
}
|
|
2097
|
+
.cf-call-btn.is-listening.is-hot::after {
|
|
2098
|
+
border-width: 3px;
|
|
2099
|
+
opacity: calc(0.5 + var(--cf-wave, 0.2) * 0.5);
|
|
2100
|
+
transform: scale(calc(1.08 + var(--cf-wave, 0.2) * 0.35));
|
|
2101
|
+
box-shadow: 0 0 12px 2px color-mix(in oklab, var(--cf-accent) 55%, transparent);
|
|
2102
|
+
}
|
|
2103
|
+
.cf-call-btn--talk {
|
|
2104
|
+
color: var(--cf-accent-ink);
|
|
2105
|
+
background: var(--cf-accent);
|
|
2106
|
+
border-color: transparent;
|
|
2107
|
+
}
|
|
2108
|
+
.cf-call-btn--end {
|
|
2109
|
+
color: #fff;
|
|
2110
|
+
background: #e5484d;
|
|
2111
|
+
border-color: transparent;
|
|
2112
|
+
}
|
|
2113
|
+
.cf-call-btn--end:hover { background: #dc3d42; }
|
|
2114
|
+
/* Microphone selector popover. */
|
|
2115
|
+
.cf-call-more { position: static; display: inline-flex; z-index: 40; }
|
|
2116
|
+
.cf-call-menu {
|
|
2117
|
+
position: absolute;
|
|
2118
|
+
top: calc(100% + 8px);
|
|
2119
|
+
bottom: auto;
|
|
2120
|
+
left: 50%;
|
|
2121
|
+
transform: translateX(-50%);
|
|
2122
|
+
display: flex;
|
|
2123
|
+
flex-direction: column;
|
|
2124
|
+
gap: 2px;
|
|
2125
|
+
width: min(240px, calc(var(--cf-panel-w, 388px) - 72px), calc(100vw - 64px));
|
|
2126
|
+
min-width: 0;
|
|
2127
|
+
max-width: calc(100vw - 64px);
|
|
2128
|
+
max-height: min(300px, calc(100vh - 220px));
|
|
2129
|
+
overflow-y: auto;
|
|
2130
|
+
padding: 8px;
|
|
2131
|
+
border-radius: 14px;
|
|
2132
|
+
background: color-mix(in oklab, var(--cf-bg) 98%, #000);
|
|
2133
|
+
border: 1px solid color-mix(in oklab, var(--cf-border) 74%, transparent);
|
|
2134
|
+
box-shadow: 0 18px 45px -20px rgba(0, 0, 0, 0.78);
|
|
2135
|
+
z-index: 60;
|
|
2136
|
+
}
|
|
2137
|
+
.cf-call-menu__label {
|
|
2138
|
+
margin: 8px 8px 4px;
|
|
2139
|
+
color: var(--cf-muted);
|
|
2140
|
+
font-size: 11px;
|
|
2141
|
+
font-weight: 700;
|
|
2142
|
+
text-transform: uppercase;
|
|
2143
|
+
letter-spacing: 0.08em;
|
|
2144
|
+
}
|
|
2145
|
+
.cf-call-menu__item {
|
|
2146
|
+
display: flex;
|
|
2147
|
+
align-items: center;
|
|
2148
|
+
gap: 8px;
|
|
2149
|
+
min-width: 0;
|
|
2150
|
+
padding: 8px 9px;
|
|
2151
|
+
border-radius: 10px;
|
|
2152
|
+
color: var(--cf-text);
|
|
2153
|
+
font-size: 12.5px;
|
|
2154
|
+
text-align: left;
|
|
2155
|
+
white-space: nowrap;
|
|
2156
|
+
overflow: hidden;
|
|
2157
|
+
}
|
|
2158
|
+
.cf-call-menu__item span:last-child {
|
|
2159
|
+
min-width: 0;
|
|
2160
|
+
overflow: hidden;
|
|
2161
|
+
text-overflow: ellipsis;
|
|
2162
|
+
}
|
|
2163
|
+
.cf-call-menu__item:hover { background: color-mix(in oklab, var(--cf-accent) 12%, var(--cf-surface)); }
|
|
2164
|
+
.cf-call-menu__item.is-active { color: var(--cf-accent); font-weight: 600; }
|
|
2165
|
+
.cf-call-menu__item svg { width: 13px; height: 13px; flex-shrink: 0; }
|
|
2166
|
+
.cf-call-menu__spacer { width: 13px; flex-shrink: 0; }
|
|
2167
|
+
/* Detached floating avatar card โ replaces the launcher while a call runs minimized. */
|
|
2168
|
+
.cf-floating-call-card {
|
|
2169
|
+
position: fixed;
|
|
2170
|
+
bottom: var(--cf-v-pad, 20px);
|
|
2171
|
+
right: var(--cf-h-pad, 20px);
|
|
2172
|
+
z-index: 1;
|
|
2173
|
+
pointer-events: auto;
|
|
2174
|
+
width: min(340px, calc(100vw - 32px));
|
|
2175
|
+
aspect-ratio: 16 / 9;
|
|
2176
|
+
overflow: hidden;
|
|
2177
|
+
border-radius: 14px;
|
|
2178
|
+
background: var(--cf-bg);
|
|
2179
|
+
border: 1px solid color-mix(in oklab, var(--cf-border) 74%, transparent);
|
|
2180
|
+
box-shadow: 0 20px 48px -20px rgba(0, 0, 0, 0.72);
|
|
2181
|
+
animation: cf-pop 0.4s cubic-bezier(0.34, 1.56, 0.64, 1) both;
|
|
2182
|
+
}
|
|
2183
|
+
.cf-root[data-align='left'] .cf-floating-call-card { right: auto; left: var(--cf-h-pad, 20px); }
|
|
2184
|
+
.cf-floating-call-card__media,
|
|
2185
|
+
.cf-floating-call-card__shade {
|
|
2186
|
+
position: absolute;
|
|
2187
|
+
inset: 0;
|
|
2188
|
+
}
|
|
2189
|
+
.cf-floating-call-card__media img,
|
|
2190
|
+
.cf-floating-call-card__media video {
|
|
2191
|
+
width: 100%;
|
|
2192
|
+
height: 100%;
|
|
2193
|
+
object-fit: cover;
|
|
2194
|
+
}
|
|
2195
|
+
.cf-floating-call-card__shade {
|
|
2196
|
+
background:
|
|
2197
|
+
linear-gradient(to bottom, rgba(0, 0, 0, 0.06), rgba(0, 0, 0, 0.18)),
|
|
2198
|
+
radial-gradient(circle at 50% 100%, rgba(255, 255, 255, 0.08), transparent 42%);
|
|
2199
|
+
pointer-events: none;
|
|
2200
|
+
}
|
|
2201
|
+
.cf-floating-call-card__avatar {
|
|
2202
|
+
position: absolute;
|
|
2203
|
+
inset: 0;
|
|
2204
|
+
display: flex;
|
|
2205
|
+
align-items: center;
|
|
2206
|
+
justify-content: center;
|
|
2207
|
+
color: #fff;
|
|
2208
|
+
background: linear-gradient(145deg, var(--cf-accent), var(--cf-accent-2));
|
|
2209
|
+
}
|
|
2210
|
+
.cf-floating-call-card.is-muted {
|
|
2211
|
+
filter: saturate(0.72);
|
|
2212
|
+
}
|
|
2213
|
+
.cf-floating-call-card.is-listening {
|
|
2214
|
+
border-color: color-mix(in oklab, var(--cf-accent) 62%, var(--cf-border));
|
|
2215
|
+
box-shadow:
|
|
2216
|
+
0 20px 48px -20px rgba(0, 0, 0, 0.72),
|
|
2217
|
+
0 0 calc(12px + (var(--cf-listen, 0.2) * 18px)) color-mix(in oklab, var(--cf-accent) 28%, transparent);
|
|
2218
|
+
}
|
|
2219
|
+
.cf-floating-call-card.is-thinking .cf-floating-call-card__shade::before {
|
|
2220
|
+
content: '';
|
|
2221
|
+
position: absolute;
|
|
2222
|
+
inset: -45%;
|
|
2223
|
+
background: linear-gradient(115deg, transparent 42%, color-mix(in oklab, var(--cf-accent) 22%, transparent) 50%, transparent 58%);
|
|
2224
|
+
animation: cf-avatar-thinking 1.45s ease-in-out infinite;
|
|
2225
|
+
}
|
|
2226
|
+
.cf-floating-call-card.is-speaking .cf-floating-call-card__avatar,
|
|
2227
|
+
.cf-floating-call-card.is-speaking .cf-floating-call-card__media img {
|
|
2228
|
+
animation: cf-avatar-nod 1.6s ease-in-out infinite;
|
|
2229
|
+
}
|
|
2230
|
+
.cf-floating-call-card__avatar > span:first-child {
|
|
2231
|
+
font-size: clamp(64px, 22vw, 118px);
|
|
2232
|
+
font-weight: 800;
|
|
2233
|
+
line-height: 1;
|
|
2234
|
+
}
|
|
2235
|
+
.cf-floating-call-card__eye,
|
|
2236
|
+
.cf-floating-call-card__mouth {
|
|
2237
|
+
position: absolute;
|
|
2238
|
+
background: rgba(255, 255, 255, 0.9);
|
|
2239
|
+
}
|
|
2240
|
+
.cf-floating-call-card__eye {
|
|
2241
|
+
top: 37%;
|
|
2242
|
+
width: 8px;
|
|
2243
|
+
height: 8px;
|
|
2244
|
+
border-radius: 999px;
|
|
2245
|
+
}
|
|
2246
|
+
.cf-floating-call-card__eye--left { left: 38%; }
|
|
2247
|
+
.cf-floating-call-card__eye--right { right: 38%; }
|
|
2248
|
+
.cf-floating-call-card__mouth {
|
|
2249
|
+
bottom: 31%;
|
|
2250
|
+
width: 34px;
|
|
2251
|
+
height: 6px;
|
|
2252
|
+
border-radius: 999px;
|
|
2253
|
+
}
|
|
2254
|
+
.cf-floating-call-card.is-speaking .cf-floating-call-card__mouth {
|
|
2255
|
+
animation: cf-mouth-talk 0.24s ease-in-out infinite alternate;
|
|
2256
|
+
}
|
|
2257
|
+
.cf-floating-call-card__controls {
|
|
2258
|
+
position: absolute;
|
|
2259
|
+
left: 50%;
|
|
2260
|
+
bottom: 12px;
|
|
2261
|
+
transform: translateX(-50%);
|
|
2262
|
+
display: inline-flex;
|
|
2263
|
+
align-items: center;
|
|
2264
|
+
gap: 4px;
|
|
2265
|
+
padding: 5px 7px;
|
|
2266
|
+
border-radius: 999px;
|
|
2267
|
+
background: color-mix(in oklab, var(--cf-bg) 92%, transparent);
|
|
2268
|
+
border: 1px solid color-mix(in oklab, var(--cf-border) 70%, transparent);
|
|
2269
|
+
box-shadow: 0 14px 30px -16px rgba(0, 0, 0, 0.74);
|
|
2270
|
+
}
|
|
2271
|
+
.cf-assistant-card__copy {
|
|
2272
|
+
margin: 0;
|
|
2273
|
+
color: var(--cf-text);
|
|
2274
|
+
font-size: 14px;
|
|
2275
|
+
line-height: 1.55;
|
|
2276
|
+
}
|
|
2277
|
+
.cf-assistant-card__chips {
|
|
2278
|
+
display: flex;
|
|
2279
|
+
flex-wrap: wrap;
|
|
2280
|
+
gap: 7px;
|
|
2281
|
+
}
|
|
2282
|
+
.cf-assistant-card__chip {
|
|
2283
|
+
max-width: 100%;
|
|
2284
|
+
border-radius: 6px;
|
|
2285
|
+
padding: 7px 9px;
|
|
2286
|
+
background: color-mix(in oklab, var(--cf-accent) 12%, var(--cf-bg));
|
|
2287
|
+
color: var(--cf-accent);
|
|
2288
|
+
font-size: 12.5px;
|
|
2289
|
+
line-height: 1.2;
|
|
2290
|
+
}
|
|
2291
|
+
.cf-assistant-card__chip:hover { background: color-mix(in oklab, var(--cf-accent) 18%, var(--cf-bg)); }
|
|
2292
|
+
.cf-assistant-card__privacy {
|
|
2293
|
+
margin: -2px 0 0;
|
|
2294
|
+
color: var(--cf-muted);
|
|
2295
|
+
font-size: 10.5px;
|
|
2296
|
+
line-height: 1.4;
|
|
2297
|
+
text-align: center;
|
|
2298
|
+
}
|
|
2299
|
+
.cf-assistant-card__privacy a {
|
|
2300
|
+
color: var(--cf-muted);
|
|
2301
|
+
text-decoration: underline;
|
|
2302
|
+
text-underline-offset: 2px;
|
|
2303
|
+
}
|
|
2304
|
+
|
|
2305
|
+
/* Offline presence dot (amber instead of green). */
|
|
2306
|
+
.cf-header__status--offline::before { background: #e2c07e; box-shadow: 0 0 0 2px rgba(226, 192, 126, 0.3); }
|
|
2307
|
+
|
|
2308
|
+
/* Disclaimer fine-print under the composer. */
|
|
2309
|
+
.cf-disclaimer { padding: 0 16px 2px; font-size: 10.5px; line-height: 1.45; color: var(--cf-muted); text-align: center; }
|
|
2310
|
+
|
|
2311
|
+
/* Read-only banner shown while viewing a past conversation. */
|
|
2312
|
+
.cf-viewing-banner {
|
|
2313
|
+
padding: 7px 16px;
|
|
2314
|
+
font-size: 12px;
|
|
2315
|
+
font-weight: 600;
|
|
2316
|
+
text-align: center;
|
|
2317
|
+
color: var(--cf-muted);
|
|
2318
|
+
background: var(--cf-surface);
|
|
2319
|
+
border-bottom: 1px solid var(--cf-border);
|
|
2320
|
+
flex-shrink: 0;
|
|
2321
|
+
}
|
|
2322
|
+
|
|
2323
|
+
/* Past-conversations history panel (over the chat, like the confirm dialog). */
|
|
2324
|
+
.cf-history {
|
|
2325
|
+
width: min(340px, 90%);
|
|
2326
|
+
max-height: 70%;
|
|
2327
|
+
display: flex;
|
|
2328
|
+
flex-direction: column;
|
|
2329
|
+
background: var(--cf-bg);
|
|
2330
|
+
border-radius: 14px;
|
|
2331
|
+
box-shadow: var(--cf-shadow);
|
|
2332
|
+
overflow: hidden;
|
|
2333
|
+
}
|
|
2334
|
+
.cf-history__head {
|
|
2335
|
+
display: flex;
|
|
2336
|
+
align-items: center;
|
|
2337
|
+
justify-content: space-between;
|
|
2338
|
+
padding: 12px 14px;
|
|
2339
|
+
font-size: 14px;
|
|
2340
|
+
font-weight: 700;
|
|
2341
|
+
color: var(--cf-text);
|
|
2342
|
+
border-bottom: 1px solid var(--cf-border);
|
|
2343
|
+
}
|
|
2344
|
+
.cf-history__list { overflow-y: auto; padding: 6px; }
|
|
2345
|
+
.cf-history__item {
|
|
2346
|
+
display: flex;
|
|
2347
|
+
flex-direction: column;
|
|
2348
|
+
gap: 2px;
|
|
2349
|
+
width: 100%;
|
|
2350
|
+
text-align: left;
|
|
2351
|
+
padding: 9px 10px;
|
|
2352
|
+
border-radius: 9px;
|
|
2353
|
+
cursor: pointer;
|
|
2354
|
+
transition: background 0.15s ease;
|
|
2355
|
+
}
|
|
2356
|
+
.cf-history__item:hover { background: var(--cf-surface); }
|
|
2357
|
+
.cf-history__item.is-active { background: var(--cf-surface); }
|
|
2358
|
+
.cf-history__title { font-size: 13px; color: var(--cf-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
|
|
2359
|
+
.cf-history__meta { font-size: 11px; color: var(--cf-muted); }
|
|
2360
|
+
|
|
2361
|
+
/* Ended-conversation bar โ replaces the composer once the chat is closed. */
|
|
2362
|
+
.cf-ended {
|
|
2363
|
+
display: flex;
|
|
2364
|
+
flex-direction: column;
|
|
2365
|
+
align-items: center;
|
|
2366
|
+
gap: 10px;
|
|
2367
|
+
padding: 14px 16px 16px;
|
|
2368
|
+
flex-shrink: 0;
|
|
2369
|
+
text-align: center;
|
|
2370
|
+
}
|
|
2371
|
+
.cf-ended__text { margin: 0; font-size: 12.5px; line-height: 1.45; color: var(--cf-muted); }
|
|
2372
|
+
.cf-csat { display: inline-flex; align-items: center; gap: 8px; }
|
|
2373
|
+
.cf-csat__q { font-size: 12.5px; color: var(--cf-muted); }
|
|
2374
|
+
.cf-csat__btn {
|
|
2375
|
+
display: inline-flex;
|
|
2376
|
+
align-items: center;
|
|
2377
|
+
justify-content: center;
|
|
2378
|
+
width: 30px;
|
|
2379
|
+
height: 30px;
|
|
2380
|
+
border-radius: 8px;
|
|
2381
|
+
color: var(--cf-muted);
|
|
2382
|
+
cursor: pointer;
|
|
2383
|
+
transition: background 0.15s ease, color 0.15s ease;
|
|
2384
|
+
}
|
|
2385
|
+
.cf-csat__btn:hover { background: var(--cf-surface); color: var(--cf-accent); }
|
|
2386
|
+
.cf-csat__btn svg { width: 16px; height: 16px; }
|
|
2387
|
+
.cf-ended__btn {
|
|
2388
|
+
font-size: 13px;
|
|
2389
|
+
font-weight: 600;
|
|
2390
|
+
color: var(--cf-accent-ink);
|
|
2391
|
+
background: var(--cf-accent);
|
|
2392
|
+
border: none;
|
|
2393
|
+
border-radius: 999px;
|
|
2394
|
+
padding: 9px 18px;
|
|
2395
|
+
cursor: pointer;
|
|
2396
|
+
transition: opacity 0.15s ease;
|
|
2397
|
+
}
|
|
2398
|
+
.cf-ended__btn:hover { opacity: 0.9; }
|
|
2399
|
+
.cf-ended__btn:focus-visible { outline: 2px solid var(--cf-accent); outline-offset: 2px; }
|
|
2400
|
+
|
|
2401
|
+
/* "โ New messages" pill โ shown when a reply streams in while scrolled up. */
|
|
2402
|
+
.cf-newmsg {
|
|
2403
|
+
/* Sticky inside the scroll body: pins to the bottom of the visible thread,
|
|
2404
|
+
just above the composer (never overlapping it). Horizontal centering via
|
|
2405
|
+
align-self so it doesn't fight the entrance animation's transform. */
|
|
2406
|
+
position: sticky;
|
|
2407
|
+
bottom: 10px;
|
|
2408
|
+
align-self: center;
|
|
2409
|
+
z-index: 3;
|
|
2410
|
+
pointer-events: auto;
|
|
2411
|
+
display: inline-flex;
|
|
2412
|
+
align-items: center;
|
|
2413
|
+
gap: 6px;
|
|
2414
|
+
font-size: 12.5px;
|
|
2415
|
+
font-weight: 600;
|
|
2416
|
+
color: var(--cf-accent-ink);
|
|
2417
|
+
background: linear-gradient(135deg, var(--cf-accent, #2f7f55) 0%, var(--cf-accent-2, #2f7de8) 160%);
|
|
2418
|
+
border-radius: 999px;
|
|
2419
|
+
padding: 7px 14px;
|
|
2420
|
+
box-shadow: var(--cf-shadow);
|
|
2421
|
+
animation: cf-msg-in 0.2s ease both;
|
|
2422
|
+
}
|
|
2423
|
+
.cf-newmsg svg { width: 14px; height: 14px; }
|
|
2424
|
+
|
|
2425
|
+
/* ---------- Clear-chat confirm dialog (in-widget, replaces window.confirm) ---------- */
|
|
2426
|
+
.cf-confirm {
|
|
2427
|
+
position: absolute;
|
|
2428
|
+
inset: 0;
|
|
2429
|
+
z-index: 6;
|
|
2430
|
+
pointer-events: auto;
|
|
2431
|
+
display: grid;
|
|
2432
|
+
place-items: center;
|
|
2433
|
+
padding: 22px;
|
|
2434
|
+
background: color-mix(in oklab, var(--cf-bg) 62%, transparent);
|
|
2435
|
+
backdrop-filter: blur(2px);
|
|
2436
|
+
animation: cf-fade-in 0.14s ease both;
|
|
2437
|
+
}
|
|
2438
|
+
.cf-confirm__card {
|
|
2439
|
+
width: 100%;
|
|
2440
|
+
max-width: 300px;
|
|
2441
|
+
background: var(--cf-bg);
|
|
2442
|
+
border: 1px solid var(--cf-border);
|
|
2443
|
+
border-radius: 16px;
|
|
2444
|
+
box-shadow: var(--cf-shadow);
|
|
2445
|
+
padding: 18px;
|
|
2446
|
+
text-align: center;
|
|
2447
|
+
animation: cf-msg-in 0.18s cubic-bezier(0.22, 1, 0.36, 1) both;
|
|
2448
|
+
}
|
|
2449
|
+
.cf-confirm__title { font-size: 15px; font-weight: 700; color: var(--cf-text); }
|
|
2450
|
+
.cf-confirm__body { margin-top: 6px; font-size: 13px; line-height: 1.45; color: var(--cf-muted); }
|
|
2451
|
+
.cf-confirm__actions { margin-top: 16px; display: flex; gap: 8px; justify-content: center; }
|
|
2452
|
+
.cf-confirm__btn {
|
|
2453
|
+
padding: 9px 16px;
|
|
2454
|
+
border-radius: 10px;
|
|
2455
|
+
font-size: 13.5px;
|
|
2456
|
+
font-weight: 600;
|
|
2457
|
+
transition: transform 0.1s ease, opacity 0.15s ease, border-color 0.15s ease, background 0.15s ease;
|
|
2458
|
+
}
|
|
2459
|
+
.cf-confirm__btn:active { transform: scale(0.97); }
|
|
2460
|
+
.cf-confirm__btn:focus-visible { outline: 2px solid var(--cf-accent-2); outline-offset: 2px; }
|
|
2461
|
+
.cf-confirm__btn--cancel { background: var(--cf-surface); color: var(--cf-text); border: 1px solid var(--cf-border); }
|
|
2462
|
+
.cf-confirm__btn--cancel:hover { border-color: var(--cf-accent); }
|
|
2463
|
+
.cf-confirm__btn--danger { background: #f25767; color: #fff; }
|
|
2464
|
+
.cf-confirm__btn--danger:hover { opacity: 0.9; }
|
|
2465
|
+
|
|
2466
|
+
/* Visually-hidden live region (announces the final answer only). */
|
|
2467
|
+
.cf-sr-live {
|
|
2468
|
+
position: absolute;
|
|
2469
|
+
width: 1px;
|
|
2470
|
+
height: 1px;
|
|
2471
|
+
padding: 0;
|
|
2472
|
+
margin: -1px;
|
|
2473
|
+
overflow: hidden;
|
|
2474
|
+
clip: rect(0 0 0 0);
|
|
2475
|
+
white-space: nowrap;
|
|
2476
|
+
border: 0;
|
|
2477
|
+
}
|
|
2478
|
+
|
|
2479
|
+
/* ---------- Attachments ---------- */
|
|
2480
|
+
.cf-file-input { display: none; }
|
|
2481
|
+
.cf-iconbtn:disabled { opacity: 0.4; cursor: default; }
|
|
2482
|
+
.cf-attach-row { padding: 0 4px 8px; }
|
|
2483
|
+
.cf-attach-status { font-size: 12px; color: var(--cf-muted); }
|
|
2484
|
+
.cf-attach-status--err { color: #f25767; }
|
|
2485
|
+
.cf-attach-chip {
|
|
2486
|
+
display: inline-flex;
|
|
2487
|
+
align-items: center;
|
|
2488
|
+
gap: 6px;
|
|
2489
|
+
max-width: 100%;
|
|
2490
|
+
padding: 5px 6px 5px 10px;
|
|
2491
|
+
border-radius: 999px;
|
|
2492
|
+
background: var(--cf-surface-2);
|
|
2493
|
+
border: 1px solid var(--cf-border);
|
|
2494
|
+
color: var(--cf-text);
|
|
2495
|
+
font-size: 12px;
|
|
2496
|
+
}
|
|
2497
|
+
.cf-attach-chip > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
|
|
2498
|
+
.cf-attach-chip svg { width: 13px; height: 13px; flex-shrink: 0; color: var(--cf-muted); }
|
|
2499
|
+
.cf-attach-x { display: grid; place-items: center; width: 18px; height: 18px; border-radius: 50%; color: var(--cf-muted); flex-shrink: 0; }
|
|
2500
|
+
.cf-attach-x:hover { background: var(--cf-surface); color: var(--cf-text); }
|
|
2501
|
+
.cf-attach-x svg { width: 11px; height: 11px; }
|
|
2502
|
+
|
|
2503
|
+
/* ---------- Mobile: full-screen panel ---------- */
|
|
2504
|
+
@media (max-width: 480px) {
|
|
2505
|
+
.cf-panel {
|
|
2506
|
+
bottom: 0;
|
|
2507
|
+
right: 0;
|
|
2508
|
+
width: 100vw;
|
|
2509
|
+
max-width: 100vw;
|
|
2510
|
+
height: 100dvh;
|
|
2511
|
+
max-height: 100dvh;
|
|
2512
|
+
border-radius: 0;
|
|
2513
|
+
}
|
|
2514
|
+
.cf-launcher { bottom: 16px; right: 16px; }
|
|
2515
|
+
}
|
|
2516
|
+
|
|
2517
|
+
/* ---------- Keyframes ---------- */
|
|
2518
|
+
@keyframes cf-pop {
|
|
2519
|
+
from { transform: scale(0); opacity: 0; }
|
|
2520
|
+
to { transform: scale(1); opacity: 1; }
|
|
2521
|
+
}
|
|
2522
|
+
@keyframes cf-badge-pop {
|
|
2523
|
+
from { transform: scale(0); }
|
|
2524
|
+
to { transform: scale(1); }
|
|
2525
|
+
}
|
|
2526
|
+
@keyframes cf-panel-open {
|
|
2527
|
+
0% {
|
|
2528
|
+
opacity: 0;
|
|
2529
|
+
transform: translateY(24px) scale(0.93);
|
|
2530
|
+
filter: blur(2px);
|
|
2531
|
+
}
|
|
2532
|
+
58% {
|
|
2533
|
+
opacity: 1;
|
|
2534
|
+
transform: translateY(-3px) scale(1.006);
|
|
2535
|
+
filter: blur(0);
|
|
2536
|
+
}
|
|
2537
|
+
100% {
|
|
2538
|
+
opacity: 1;
|
|
2539
|
+
transform: translateY(0) scale(1);
|
|
2540
|
+
filter: blur(0);
|
|
2541
|
+
}
|
|
2542
|
+
}
|
|
2543
|
+
@keyframes cf-msg-in {
|
|
2544
|
+
from { opacity: 0; transform: translateY(8px); }
|
|
2545
|
+
to { opacity: 1; transform: none; }
|
|
2546
|
+
}
|
|
2547
|
+
@keyframes cf-fade-in {
|
|
2548
|
+
from { opacity: 0; }
|
|
2549
|
+
to { opacity: 1; }
|
|
2550
|
+
}
|
|
2551
|
+
@keyframes cf-typing {
|
|
2552
|
+
0%, 80%, 100% { opacity: 0.35; transform: translateY(0); }
|
|
2553
|
+
40% { opacity: 1; transform: translateY(-4px); }
|
|
2554
|
+
}
|
|
2555
|
+
@keyframes cf-pulse {
|
|
2556
|
+
0%, 100% { opacity: 1; }
|
|
2557
|
+
50% { opacity: 0.4; }
|
|
2558
|
+
}
|
|
2559
|
+
|
|
2560
|
+
@media (prefers-reduced-motion: reduce) {
|
|
2561
|
+
.cf-root *, .cf-root *::before, .cf-root *::after {
|
|
2562
|
+
animation-duration: 0.01ms !important;
|
|
2563
|
+
animation-iteration-count: 1 !important;
|
|
2564
|
+
transition-duration: 0.01ms !important;
|
|
2565
|
+
scroll-behavior: auto !important;
|
|
2566
|
+
}
|
|
2567
|
+
}
|
|
2568
|
+
.cf-analytics-visualization {
|
|
2569
|
+
box-sizing: border-box;
|
|
2570
|
+
width: 100%;
|
|
2571
|
+
max-width: 100%;
|
|
2572
|
+
margin-top: 8px;
|
|
2573
|
+
min-width: 0;
|
|
2574
|
+
overflow: hidden;
|
|
2575
|
+
border: 1px solid var(--cf-border);
|
|
2576
|
+
border-radius: 13px;
|
|
2577
|
+
background: var(--cf-surface);
|
|
2578
|
+
padding: 12px;
|
|
2579
|
+
color: var(--cf-muted);
|
|
2580
|
+
font-size: 11px;
|
|
2581
|
+
}
|
|
2582
|
+
.cf-analytics-visualization.is-expanded {
|
|
2583
|
+
display: flex;
|
|
2584
|
+
min-height: 100%;
|
|
2585
|
+
flex-direction: column;
|
|
2586
|
+
margin: 0;
|
|
2587
|
+
border: 0;
|
|
2588
|
+
border-radius: 0;
|
|
2589
|
+
background: transparent;
|
|
2590
|
+
padding: 0;
|
|
2591
|
+
}
|
|
2592
|
+
.cf-analytics-visualization__header {
|
|
2593
|
+
display: flex;
|
|
2594
|
+
width: 100%;
|
|
2595
|
+
min-width: 0;
|
|
2596
|
+
min-height: 32px;
|
|
2597
|
+
align-items: center;
|
|
2598
|
+
justify-content: space-between;
|
|
2599
|
+
gap: 10px;
|
|
2600
|
+
}
|
|
2601
|
+
.cf-analytics-visualization__header > div:first-child {
|
|
2602
|
+
min-width: 0;
|
|
2603
|
+
}
|
|
2604
|
+
.cf-analytics-visualization__actions {
|
|
2605
|
+
display: flex;
|
|
2606
|
+
flex: 0 0 auto;
|
|
2607
|
+
align-items: center;
|
|
2608
|
+
gap: 6px;
|
|
2609
|
+
}
|
|
2610
|
+
.cf-analytics-chart-picker {
|
|
2611
|
+
display: flex;
|
|
2612
|
+
align-items: center;
|
|
2613
|
+
gap: 5px;
|
|
2614
|
+
color: var(--cf-muted);
|
|
2615
|
+
font-size: 9px;
|
|
2616
|
+
font-weight: 700;
|
|
2617
|
+
}
|
|
2618
|
+
.cf-analytics-chart-picker select {
|
|
2619
|
+
max-width: 112px;
|
|
2620
|
+
height: 30px;
|
|
2621
|
+
border: 1px solid var(--cf-border);
|
|
2622
|
+
border-radius: 8px;
|
|
2623
|
+
background: var(--cf-bg);
|
|
2624
|
+
padding: 0 22px 0 8px;
|
|
2625
|
+
color: var(--cf-text);
|
|
2626
|
+
font: inherit;
|
|
2627
|
+
}
|
|
2628
|
+
.cf-analytics-chart-picker select:focus-visible {
|
|
2629
|
+
outline: 2px solid var(--cf-accent);
|
|
2630
|
+
outline-offset: 2px;
|
|
2631
|
+
}
|
|
2632
|
+
.cf-analytics-visualization__title {
|
|
2633
|
+
overflow: hidden;
|
|
2634
|
+
color: var(--cf-muted);
|
|
2635
|
+
font-size: 10px;
|
|
2636
|
+
font-weight: 750;
|
|
2637
|
+
letter-spacing: .08em;
|
|
2638
|
+
text-overflow: ellipsis;
|
|
2639
|
+
text-transform: uppercase;
|
|
2640
|
+
white-space: nowrap;
|
|
2641
|
+
}
|
|
2642
|
+
.cf-analytics-meta {
|
|
2643
|
+
display: flex;
|
|
2644
|
+
flex-wrap: wrap;
|
|
2645
|
+
align-items: center;
|
|
2646
|
+
gap: 3px 7px;
|
|
2647
|
+
margin-top: 4px;
|
|
2648
|
+
color: var(--cf-muted);
|
|
2649
|
+
font-size: 9px;
|
|
2650
|
+
line-height: 1.35;
|
|
2651
|
+
}
|
|
2652
|
+
.cf-analytics-meta__dot {
|
|
2653
|
+
display: inline-block;
|
|
2654
|
+
width: 5px;
|
|
2655
|
+
height: 5px;
|
|
2656
|
+
margin-right: 4px;
|
|
2657
|
+
border-radius: 999px;
|
|
2658
|
+
background: var(--cf-accent);
|
|
2659
|
+
}
|
|
2660
|
+
.cf-analytics-visualization__download {
|
|
2661
|
+
width: fit-content;
|
|
2662
|
+
border: 1px solid var(--cf-border) !important;
|
|
2663
|
+
border-radius: 8px;
|
|
2664
|
+
background: var(--cf-surface) !important;
|
|
2665
|
+
padding: 6px 9px;
|
|
2666
|
+
color: var(--cf-text) !important;
|
|
2667
|
+
font-size: 10px;
|
|
2668
|
+
font-weight: 700;
|
|
2669
|
+
}
|
|
2670
|
+
.cf-analytics-visualization__download:hover {
|
|
2671
|
+
border-color: var(--cf-accent) !important;
|
|
2672
|
+
color: var(--cf-accent) !important;
|
|
2673
|
+
}
|
|
2674
|
+
.cf-analytics-table-wrap {
|
|
2675
|
+
box-sizing: border-box;
|
|
2676
|
+
width: 100%;
|
|
2677
|
+
max-width: 100%;
|
|
2678
|
+
margin-top: 9px;
|
|
2679
|
+
max-height: 210px;
|
|
2680
|
+
overflow: auto;
|
|
2681
|
+
border: 1px solid var(--cf-border);
|
|
2682
|
+
border-radius: 9px;
|
|
2683
|
+
scrollbar-width: thin;
|
|
2684
|
+
}
|
|
2685
|
+
.cf-analytics-visualization.is-expanded .cf-analytics-table-wrap {
|
|
2686
|
+
min-height: 0;
|
|
2687
|
+
max-height: none;
|
|
2688
|
+
flex: 1;
|
|
2689
|
+
margin-top: 14px;
|
|
2690
|
+
}
|
|
2691
|
+
.cf-analytics-table {
|
|
2692
|
+
width: 100%;
|
|
2693
|
+
border-collapse: collapse;
|
|
2694
|
+
color: var(--cf-text);
|
|
2695
|
+
font-size: 10px;
|
|
2696
|
+
white-space: nowrap;
|
|
2697
|
+
}
|
|
2698
|
+
.cf-analytics-table th,
|
|
2699
|
+
.cf-analytics-table td {
|
|
2700
|
+
border-bottom: 1px solid var(--cf-border);
|
|
2701
|
+
padding: 8px 9px;
|
|
2702
|
+
text-align: left;
|
|
2703
|
+
}
|
|
2704
|
+
.cf-analytics-table th {
|
|
2705
|
+
position: sticky;
|
|
2706
|
+
top: 0;
|
|
2707
|
+
background: var(--cf-surface-2);
|
|
2708
|
+
color: var(--cf-muted);
|
|
2709
|
+
font-weight: 700;
|
|
2710
|
+
text-transform: capitalize;
|
|
2711
|
+
}
|
|
2712
|
+
.cf-analytics-table tbody tr:last-child td { border-bottom: 0; }
|
|
2713
|
+
.cf-analytics-table-note {
|
|
2714
|
+
margin: 7px 2px 0;
|
|
2715
|
+
color: var(--cf-muted);
|
|
2716
|
+
font-size: 9px;
|
|
2717
|
+
line-height: 1.4;
|
|
2718
|
+
}
|
|
2719
|
+
.cf-data-table {
|
|
2720
|
+
display: flex;
|
|
2721
|
+
min-width: 0;
|
|
2722
|
+
min-height: 0;
|
|
2723
|
+
flex: 1;
|
|
2724
|
+
flex-direction: column;
|
|
2725
|
+
margin-top: 10px;
|
|
2726
|
+
overflow: hidden;
|
|
2727
|
+
border: 1px solid var(--cf-border);
|
|
2728
|
+
border-radius: 9px;
|
|
2729
|
+
background: var(--cf-bg);
|
|
2730
|
+
}
|
|
2731
|
+
.cf-table-fields {
|
|
2732
|
+
display: flex;
|
|
2733
|
+
min-width: 0;
|
|
2734
|
+
min-height: 38px;
|
|
2735
|
+
align-items: center;
|
|
2736
|
+
gap: 6px;
|
|
2737
|
+
padding: 7px 8px;
|
|
2738
|
+
border-bottom: 1px solid var(--cf-border);
|
|
2739
|
+
color: var(--cf-muted);
|
|
2740
|
+
font-size: 9px;
|
|
2741
|
+
}
|
|
2742
|
+
.cf-table-fields > strong {
|
|
2743
|
+
flex: 0 0 auto;
|
|
2744
|
+
color: var(--cf-muted);
|
|
2745
|
+
font-size: 8px;
|
|
2746
|
+
letter-spacing: .06em;
|
|
2747
|
+
text-transform: uppercase;
|
|
2748
|
+
}
|
|
2749
|
+
.cf-field-list {
|
|
2750
|
+
display: flex;
|
|
2751
|
+
min-width: 0;
|
|
2752
|
+
gap: 5px;
|
|
2753
|
+
overflow: auto hidden;
|
|
2754
|
+
scrollbar-width: none;
|
|
2755
|
+
}
|
|
2756
|
+
.cf-field-chip {
|
|
2757
|
+
flex: 0 0 auto;
|
|
2758
|
+
padding: 4px 6px;
|
|
2759
|
+
border-radius: 6px;
|
|
2760
|
+
background: color-mix(in srgb, var(--cf-accent) 11%, var(--cf-bg));
|
|
2761
|
+
color: var(--cf-accent);
|
|
2762
|
+
font-weight: 650;
|
|
2763
|
+
}
|
|
2764
|
+
.cf-table-field-count { margin-left: auto;white-space: nowrap; }
|
|
2765
|
+
.cf-table-controls {
|
|
2766
|
+
display: grid;
|
|
2767
|
+
grid-template-columns: minmax(110px, 1fr) auto;
|
|
2768
|
+
gap: 6px;
|
|
2769
|
+
padding: 7px 8px 5px;
|
|
2770
|
+
}
|
|
2771
|
+
.cf-table-search {
|
|
2772
|
+
display: flex;
|
|
2773
|
+
min-width: 0;
|
|
2774
|
+
align-items: center;
|
|
2775
|
+
gap: 5px;
|
|
2776
|
+
padding: 0 7px;
|
|
2777
|
+
border: 1px solid var(--cf-border);
|
|
2778
|
+
border-radius: 7px;
|
|
2779
|
+
background: var(--cf-bg);
|
|
2780
|
+
color: var(--cf-muted);
|
|
2781
|
+
}
|
|
2782
|
+
.cf-table-search input {
|
|
2783
|
+
width: 100%;
|
|
2784
|
+
min-width: 0;
|
|
2785
|
+
height: 28px;
|
|
2786
|
+
border: 0;
|
|
2787
|
+
outline: 0;
|
|
2788
|
+
background: transparent;
|
|
2789
|
+
color: var(--cf-text);
|
|
2790
|
+
font: 500 9px/1 var(--cf-font);
|
|
2791
|
+
}
|
|
2792
|
+
.cf-table-modes {
|
|
2793
|
+
display: inline-flex;
|
|
2794
|
+
padding: 2px;
|
|
2795
|
+
border: 1px solid var(--cf-border);
|
|
2796
|
+
border-radius: 8px;
|
|
2797
|
+
background: var(--cf-surface);
|
|
2798
|
+
}
|
|
2799
|
+
.cf-segment {
|
|
2800
|
+
min-height: 26px;
|
|
2801
|
+
border-radius: 6px;
|
|
2802
|
+
padding: 0 7px !important;
|
|
2803
|
+
color: var(--cf-muted) !important;
|
|
2804
|
+
font-size: 9px;
|
|
2805
|
+
font-weight: 650;
|
|
2806
|
+
}
|
|
2807
|
+
.cf-segment.is-active { background: var(--cf-accent) !important;color: var(--cf-accent-ink) !important; }
|
|
2808
|
+
.cf-table-column-bar { display: flex;align-items: center;padding: 0 8px 7px; }
|
|
2809
|
+
.cf-column-picker { position: relative; }
|
|
2810
|
+
.cf-column-picker > summary {
|
|
2811
|
+
min-height: 27px;
|
|
2812
|
+
padding: 6px 8px;
|
|
2813
|
+
border: 1px solid var(--cf-border);
|
|
2814
|
+
border-radius: 7px;
|
|
2815
|
+
cursor: pointer;
|
|
2816
|
+
list-style: none;
|
|
2817
|
+
color: var(--cf-text);
|
|
2818
|
+
font-size: 9px;
|
|
2819
|
+
font-weight: 650;
|
|
2820
|
+
}
|
|
2821
|
+
.cf-column-picker > summary::-webkit-details-marker { display: none; }
|
|
2822
|
+
.cf-column-menu {
|
|
2823
|
+
position: absolute;
|
|
2824
|
+
z-index: 5;
|
|
2825
|
+
top: calc(100% + 4px);
|
|
2826
|
+
left: 0;
|
|
2827
|
+
display: grid;
|
|
2828
|
+
min-width: 160px;
|
|
2829
|
+
gap: 6px;
|
|
2830
|
+
padding: 9px;
|
|
2831
|
+
border: 1px solid var(--cf-border);
|
|
2832
|
+
border-radius: 8px;
|
|
2833
|
+
background: var(--cf-bg);
|
|
2834
|
+
box-shadow: 0 10px 24px rgba(15,30,42,.16);
|
|
2835
|
+
}
|
|
2836
|
+
.cf-column-menu label { display: flex;align-items: center;gap: 7px;color: var(--cf-text);font-size: 9px; }
|
|
2837
|
+
.cf-table-wrap {
|
|
2838
|
+
position: relative;
|
|
2839
|
+
min-height: 0;
|
|
2840
|
+
max-height: 210px;
|
|
2841
|
+
overflow: auto;
|
|
2842
|
+
border-top: 1px solid var(--cf-border);
|
|
2843
|
+
scrollbar-width: thin;
|
|
2844
|
+
}
|
|
2845
|
+
.cf-analytics-visualization.is-expanded .cf-table-wrap { max-height: none;flex: 1; }
|
|
2846
|
+
.cf-table { width: 100%;border-collapse: separate;border-spacing: 0;color: var(--cf-text);font-size: 10px; }
|
|
2847
|
+
.cf-table th { position: sticky;top: 0;z-index: 1;background: var(--cf-surface);color: var(--cf-muted);font-size: 9px;font-weight: 720;text-align: left; }
|
|
2848
|
+
.cf-table th,.cf-table td { padding: 8px 9px;border-bottom: 1px solid var(--cf-border);white-space: nowrap; }
|
|
2849
|
+
.cf-table .cf-select-cell { width: 28px;padding-right: 3px;text-align: center; }
|
|
2850
|
+
.cf-table input[type="checkbox"],.cf-column-menu input[type="checkbox"] { width: 13px;height: 13px;accent-color: var(--cf-accent); }
|
|
2851
|
+
.cf-table-sort { display: flex !important;width: 100%;align-items: center;gap: 5px;color: inherit !important;font: inherit;text-align: left; }
|
|
2852
|
+
.cf-sort-direction { color: var(--cf-muted);font-size: 10px; }
|
|
2853
|
+
.cf-table.is-matrix tbody td:not(.cf-select-cell) { background: color-mix(in srgb,var(--cf-accent) 7%,var(--cf-bg)); }
|
|
2854
|
+
.cf-table tbody tr:hover,.cf-table tbody tr.is-selected { background: color-mix(in srgb,var(--cf-accent) 10%,var(--cf-bg)); }
|
|
2855
|
+
.cf-table tbody tr.is-selected td:first-child { box-shadow: inset 3px 0 0 var(--cf-accent); }
|
|
2856
|
+
.cf-show-more { position: sticky;left: 50%;bottom: 6px;transform: translateX(-50%);margin: 8px auto;padding: 6px 9px !important;border: 1px solid var(--cf-border) !important;border-radius: 7px;background: var(--cf-bg) !important;font-size: 9px;font-weight: 650; }
|
|
2857
|
+
.cf-table-summary { display: flex;align-items: center;justify-content: space-between;gap: 8px;padding: 7px 9px;color: var(--cf-muted);font-size: 8px; }
|
|
2858
|
+
.cf-visually-hidden { position: absolute;width: 1px;height: 1px;overflow: hidden;clip: rect(0 0 0 0); }
|
|
2859
|
+
@media (max-width: 430px) {
|
|
2860
|
+
.cf-table-modes { display: none; }
|
|
2861
|
+
.cf-table-controls { grid-template-columns: 1fr; }
|
|
2862
|
+
.cf-table-summary span:last-child { display: none; }
|
|
2863
|
+
}
|
|
2864
|
+
.cf-analytics-visualization__expand,
|
|
2865
|
+
.cf-analytics-visualization__close {
|
|
2866
|
+
display: grid;
|
|
2867
|
+
width: 30px;
|
|
2868
|
+
height: 30px;
|
|
2869
|
+
flex: 0 0 auto;
|
|
2870
|
+
place-items: center;
|
|
2871
|
+
border: 1px solid var(--cf-border) !important;
|
|
2872
|
+
border-radius: 9px;
|
|
2873
|
+
background: var(--cf-bg) !important;
|
|
2874
|
+
color: var(--cf-text) !important;
|
|
2875
|
+
}
|
|
2876
|
+
.cf-analytics-visualization__expand:hover,
|
|
2877
|
+
.cf-analytics-visualization__close:hover { background: var(--cf-surface-2) !important; }
|
|
2878
|
+
.cf-analytics-visualization__expand:focus-visible,
|
|
2879
|
+
.cf-analytics-visualization__close:focus-visible {
|
|
2880
|
+
outline: 2px solid var(--cf-accent);
|
|
2881
|
+
outline-offset: 2px;
|
|
2882
|
+
}
|
|
2883
|
+
.cf-analytics-visualization__expand svg,
|
|
2884
|
+
.cf-analytics-visualization__close svg { width: 15px; height: 15px; }
|
|
2885
|
+
.cf-analytics-visualization__kpi {
|
|
2886
|
+
padding: 8px 0 6px;
|
|
2887
|
+
color: var(--cf-text);
|
|
2888
|
+
font-size: 30px;
|
|
2889
|
+
font-weight: 750;
|
|
2890
|
+
letter-spacing: -.035em;
|
|
2891
|
+
}
|
|
2892
|
+
.cf-analytics-kpi {
|
|
2893
|
+
padding: 9px 0 5px;
|
|
2894
|
+
}
|
|
2895
|
+
.cf-analytics-kpi__label {
|
|
2896
|
+
color: var(--cf-muted);
|
|
2897
|
+
font-size: 9px;
|
|
2898
|
+
font-weight: 700;
|
|
2899
|
+
letter-spacing: .06em;
|
|
2900
|
+
text-transform: uppercase;
|
|
2901
|
+
}
|
|
2902
|
+
.cf-analytics-kpi__value {
|
|
2903
|
+
margin-top: 5px;
|
|
2904
|
+
color: var(--cf-text);
|
|
2905
|
+
font-size: 30px;
|
|
2906
|
+
font-weight: 750;
|
|
2907
|
+
letter-spacing: -.035em;
|
|
2908
|
+
line-height: 1;
|
|
2909
|
+
}
|
|
2910
|
+
.cf-analytics-kpi__detail {
|
|
2911
|
+
margin-top: 8px;
|
|
2912
|
+
color: var(--cf-muted);
|
|
2913
|
+
font-size: 10px;
|
|
2914
|
+
line-height: 1.5;
|
|
2915
|
+
}
|
|
2916
|
+
.cf-analytics-empty {
|
|
2917
|
+
margin-top: 8px;
|
|
2918
|
+
border: 1px dashed var(--cf-border);
|
|
2919
|
+
border-radius: 11px;
|
|
2920
|
+
padding: 18px 14px;
|
|
2921
|
+
color: var(--cf-text);
|
|
2922
|
+
text-align: center;
|
|
2923
|
+
}
|
|
2924
|
+
.cf-analytics-empty p { margin: 0; }
|
|
2925
|
+
.cf-analytics-empty p + p {
|
|
2926
|
+
margin-top: 4px;
|
|
2927
|
+
color: var(--cf-muted);
|
|
2928
|
+
font-size: 10px;
|
|
2929
|
+
}
|
|
2930
|
+
.cf-analytics-echart {
|
|
2931
|
+
position: relative;
|
|
2932
|
+
width: 100%;
|
|
2933
|
+
height: 196px;
|
|
2934
|
+
min-width: 0;
|
|
2935
|
+
}
|
|
2936
|
+
.cf-analytics-visualization.is-expanded .cf-analytics-echart {
|
|
2937
|
+
height: auto;
|
|
2938
|
+
min-height: 310px;
|
|
2939
|
+
flex: 1;
|
|
2940
|
+
}
|
|
2941
|
+
.cf-analytics-echart canvas:focus-visible {
|
|
2942
|
+
outline: 2px solid var(--cf-accent);
|
|
2943
|
+
outline-offset: -2px;
|
|
2944
|
+
}
|
|
2945
|
+
.cf-analytics-echart__fallback {
|
|
2946
|
+
display: grid;
|
|
2947
|
+
height: 100%;
|
|
2948
|
+
place-items: center;
|
|
2949
|
+
border: 1px dashed var(--cf-border);
|
|
2950
|
+
border-radius: 9px;
|
|
2951
|
+
padding: 16px;
|
|
2952
|
+
color: var(--cf-muted);
|
|
2953
|
+
text-align: center;
|
|
2954
|
+
line-height: 1.5;
|
|
2955
|
+
}
|
|
2956
|
+
.cf-analytics-zoom {
|
|
2957
|
+
display: flex;
|
|
2958
|
+
min-width: 0;
|
|
2959
|
+
align-items: center;
|
|
2960
|
+
justify-content: space-between;
|
|
2961
|
+
gap: 8px;
|
|
2962
|
+
margin-top: 4px;
|
|
2963
|
+
border-top: 1px solid var(--cf-border);
|
|
2964
|
+
padding-top: 8px;
|
|
2965
|
+
}
|
|
2966
|
+
.cf-analytics-zoom__range {
|
|
2967
|
+
min-width: 0;
|
|
2968
|
+
overflow: hidden;
|
|
2969
|
+
color: var(--cf-muted);
|
|
2970
|
+
font-size: 10px;
|
|
2971
|
+
font-weight: 650;
|
|
2972
|
+
line-height: 1.3;
|
|
2973
|
+
text-overflow: ellipsis;
|
|
2974
|
+
white-space: nowrap;
|
|
2975
|
+
}
|
|
2976
|
+
.cf-analytics-zoom__controls {
|
|
2977
|
+
display: inline-flex;
|
|
2978
|
+
flex: 0 0 auto;
|
|
2979
|
+
align-items: center;
|
|
2980
|
+
overflow: hidden;
|
|
2981
|
+
border: 1px solid var(--cf-border);
|
|
2982
|
+
border-radius: 9px;
|
|
2983
|
+
background: var(--cf-bg);
|
|
2984
|
+
}
|
|
2985
|
+
.cf-analytics-zoom__controls button {
|
|
2986
|
+
display: grid;
|
|
2987
|
+
min-width: 40px;
|
|
2988
|
+
height: 40px;
|
|
2989
|
+
place-items: center;
|
|
2990
|
+
border: 0 !important;
|
|
2991
|
+
border-radius: 0;
|
|
2992
|
+
background: transparent !important;
|
|
2993
|
+
color: var(--cf-text) !important;
|
|
2994
|
+
font: inherit;
|
|
2995
|
+
font-size: 16px;
|
|
2996
|
+
font-weight: 700;
|
|
2997
|
+
line-height: 1;
|
|
2998
|
+
}
|
|
2999
|
+
.cf-analytics-zoom__controls button + button { border-left: 1px solid var(--cf-border) !important; }
|
|
3000
|
+
.cf-analytics-zoom__controls button:hover:not(:disabled) { background: var(--cf-surface-2) !important; }
|
|
3001
|
+
.cf-analytics-zoom__controls button:focus-visible {
|
|
3002
|
+
position: relative;
|
|
3003
|
+
z-index: 1;
|
|
3004
|
+
outline: 2px solid var(--cf-accent);
|
|
3005
|
+
outline-offset: -2px;
|
|
3006
|
+
}
|
|
3007
|
+
.cf-analytics-zoom__controls button:disabled { cursor: not-allowed; opacity: .38; }
|
|
3008
|
+
.cf-analytics-zoom__controls .cf-analytics-zoom__reset {
|
|
3009
|
+
min-width: 56px;
|
|
3010
|
+
padding: 0 10px;
|
|
3011
|
+
font-size: 10px;
|
|
3012
|
+
font-weight: 700;
|
|
3013
|
+
}
|
|
3014
|
+
.cf-analytics-chart__summary {
|
|
3015
|
+
margin: 2px 0 0;
|
|
3016
|
+
color: var(--cf-muted);
|
|
3017
|
+
font-size: 11px;
|
|
3018
|
+
line-height: 1.45;
|
|
3019
|
+
}
|
|
3020
|
+
.cf-analytics-focus {
|
|
3021
|
+
height: 100%;
|
|
3022
|
+
min-height: 0;
|
|
3023
|
+
overflow: auto;
|
|
3024
|
+
background: var(--cf-bg);
|
|
3025
|
+
padding: 18px;
|
|
3026
|
+
}
|
|
3027
|
+
@media (min-width: 640px) {
|
|
3028
|
+
.cf-panel.cf-panel--analytics-focus {
|
|
3029
|
+
grid-template-columns: minmax(0, 1fr);
|
|
3030
|
+
grid-template-rows: auto minmax(0, 1fr);
|
|
3031
|
+
grid-template-areas: 'header' 'video';
|
|
3032
|
+
}
|
|
3033
|
+
.cf-panel--analytics-focus .cf-panel__video { height: 100%; }
|
|
3034
|
+
.cf-panel--analytics-focus .cf-panel__chat { display: none; }
|
|
3035
|
+
}
|
|
3036
|
+
.cf-analytics-explanation {
|
|
3037
|
+
margin-top: 10px;
|
|
3038
|
+
overflow: hidden;
|
|
3039
|
+
border: 1px solid var(--cf-border);
|
|
3040
|
+
border-radius: 12px;
|
|
3041
|
+
background: var(--cf-surface);
|
|
3042
|
+
color: var(--cf-text);
|
|
3043
|
+
font-size: 12px;
|
|
3044
|
+
line-height: 1.55;
|
|
3045
|
+
}
|
|
3046
|
+
.cf-analytics-explanation h3,
|
|
3047
|
+
.cf-analytics-explanation h4,
|
|
3048
|
+
.cf-analytics-explanation p { margin: 0; }
|
|
3049
|
+
.cf-analytics-explanation__lead {
|
|
3050
|
+
border-bottom: 1px solid var(--cf-border);
|
|
3051
|
+
padding: 12px;
|
|
3052
|
+
}
|
|
3053
|
+
.cf-analytics-explanation__lead-meta {
|
|
3054
|
+
display: flex;
|
|
3055
|
+
flex-wrap: wrap;
|
|
3056
|
+
align-items: center;
|
|
3057
|
+
gap: 5px 8px;
|
|
3058
|
+
}
|
|
3059
|
+
.cf-analytics-explanation__eyebrow {
|
|
3060
|
+
color: var(--cf-accent);
|
|
3061
|
+
font-size: 9px;
|
|
3062
|
+
font-weight: 750;
|
|
3063
|
+
letter-spacing: .1em;
|
|
3064
|
+
text-transform: uppercase;
|
|
3065
|
+
}
|
|
3066
|
+
.cf-analytics-explanation__provenance {
|
|
3067
|
+
display: inline-flex;
|
|
3068
|
+
align-items: center;
|
|
3069
|
+
gap: 5px;
|
|
3070
|
+
color: var(--cf-muted);
|
|
3071
|
+
font-size: 9px;
|
|
3072
|
+
font-weight: 650;
|
|
3073
|
+
}
|
|
3074
|
+
.cf-analytics-explanation__provenance-dot {
|
|
3075
|
+
width: 5px;
|
|
3076
|
+
height: 5px;
|
|
3077
|
+
border-radius: 999px;
|
|
3078
|
+
background: var(--cf-accent);
|
|
3079
|
+
}
|
|
3080
|
+
.cf-analytics-explanation__headline {
|
|
3081
|
+
margin-top: 8px !important;
|
|
3082
|
+
color: var(--cf-text);
|
|
3083
|
+
font-size: 15px;
|
|
3084
|
+
font-weight: 750;
|
|
3085
|
+
letter-spacing: -.012em;
|
|
3086
|
+
line-height: 1.45;
|
|
3087
|
+
}
|
|
3088
|
+
.cf-analytics-explanation__summary {
|
|
3089
|
+
margin-top: 5px !important;
|
|
3090
|
+
color: var(--cf-muted);
|
|
3091
|
+
font-size: 12px;
|
|
3092
|
+
line-height: 1.6;
|
|
3093
|
+
}
|
|
3094
|
+
.cf-analytics-explanation__body {
|
|
3095
|
+
display: grid;
|
|
3096
|
+
gap: 14px;
|
|
3097
|
+
padding: 12px;
|
|
3098
|
+
}
|
|
3099
|
+
.cf-analytics-explanation__status { color: var(--cf-muted); }
|
|
3100
|
+
.cf-analytics-explanation__error {
|
|
3101
|
+
border-radius: 8px;
|
|
3102
|
+
background: color-mix(in srgb, #d97706 10%, var(--cf-surface));
|
|
3103
|
+
padding: 9px 10px;
|
|
3104
|
+
color: var(--cf-text);
|
|
3105
|
+
}
|
|
3106
|
+
.cf-analytics-explanation__heading {
|
|
3107
|
+
color: var(--cf-text);
|
|
3108
|
+
font-size: 12px;
|
|
3109
|
+
font-weight: 750;
|
|
3110
|
+
line-height: 1.45;
|
|
3111
|
+
}
|
|
3112
|
+
.cf-analytics-explanation__evidence {
|
|
3113
|
+
display: grid;
|
|
3114
|
+
gap: 7px;
|
|
3115
|
+
margin: 8px 0 0;
|
|
3116
|
+
padding: 0;
|
|
3117
|
+
list-style: none;
|
|
3118
|
+
color: var(--cf-muted);
|
|
3119
|
+
}
|
|
3120
|
+
.cf-analytics-explanation__evidence-item {
|
|
3121
|
+
display: flex;
|
|
3122
|
+
gap: 8px;
|
|
3123
|
+
align-items: flex-start;
|
|
3124
|
+
}
|
|
3125
|
+
.cf-analytics-explanation__evidence-bullet {
|
|
3126
|
+
width: 5px;
|
|
3127
|
+
height: 5px;
|
|
3128
|
+
flex: 0 0 auto;
|
|
3129
|
+
margin-top: 7px;
|
|
3130
|
+
border-radius: 999px;
|
|
3131
|
+
background: var(--cf-accent);
|
|
3132
|
+
}
|
|
3133
|
+
.cf-analytics-explanation__meaning {
|
|
3134
|
+
border-left: 2px solid var(--cf-accent);
|
|
3135
|
+
border-radius: 0 8px 8px 0;
|
|
3136
|
+
background: color-mix(in srgb, var(--cf-accent) 7%, var(--cf-surface));
|
|
3137
|
+
padding: 10px 11px;
|
|
3138
|
+
}
|
|
3139
|
+
.cf-analytics-explanation__paragraph {
|
|
3140
|
+
margin-top: 5px !important;
|
|
3141
|
+
color: var(--cf-muted);
|
|
3142
|
+
}
|
|
3143
|
+
.cf-analytics-explanation__section-heading,
|
|
3144
|
+
.cf-analytics-explanation__outlook-header {
|
|
3145
|
+
display: flex;
|
|
3146
|
+
flex-wrap: wrap;
|
|
3147
|
+
align-items: baseline;
|
|
3148
|
+
justify-content: space-between;
|
|
3149
|
+
gap: 4px 8px;
|
|
3150
|
+
}
|
|
3151
|
+
.cf-analytics-explanation__hint,
|
|
3152
|
+
.cf-analytics-explanation__outlook-badge {
|
|
3153
|
+
color: var(--cf-muted);
|
|
3154
|
+
font-size: 9px;
|
|
3155
|
+
font-weight: 650;
|
|
3156
|
+
}
|
|
3157
|
+
.cf-analytics-explanation__outlook-badge {
|
|
3158
|
+
color: var(--cf-accent);
|
|
3159
|
+
letter-spacing: .06em;
|
|
3160
|
+
text-transform: uppercase;
|
|
3161
|
+
}
|
|
3162
|
+
.cf-analytics-explanation__drivers,
|
|
3163
|
+
.cf-analytics-explanation__recommendations {
|
|
3164
|
+
display: grid;
|
|
3165
|
+
gap: 7px;
|
|
3166
|
+
margin-top: 8px;
|
|
3167
|
+
}
|
|
3168
|
+
.cf-analytics-explanation__driver {
|
|
3169
|
+
border-radius: 8px;
|
|
3170
|
+
background: var(--cf-bg);
|
|
3171
|
+
padding: 9px 10px;
|
|
3172
|
+
}
|
|
3173
|
+
.cf-analytics-explanation__driver-title,
|
|
3174
|
+
.cf-analytics-explanation__recommendation-title {
|
|
3175
|
+
color: var(--cf-text);
|
|
3176
|
+
font-weight: 750;
|
|
3177
|
+
}
|
|
3178
|
+
.cf-analytics-explanation__driver-body,
|
|
3179
|
+
.cf-analytics-explanation__recommendation-body {
|
|
3180
|
+
margin-top: 3px !important;
|
|
3181
|
+
color: var(--cf-muted);
|
|
3182
|
+
font-size: 11px;
|
|
3183
|
+
}
|
|
3184
|
+
.cf-analytics-explanation__driver-label { color: var(--cf-text); font-weight: 700; }
|
|
3185
|
+
.cf-analytics-explanation__recommendation {
|
|
3186
|
+
display: grid;
|
|
3187
|
+
grid-template-columns: 22px minmax(0, 1fr);
|
|
3188
|
+
gap: 8px;
|
|
3189
|
+
border-radius: 8px;
|
|
3190
|
+
background: var(--cf-bg);
|
|
3191
|
+
padding: 9px 10px;
|
|
3192
|
+
}
|
|
3193
|
+
.cf-analytics-explanation__recommendation-index {
|
|
3194
|
+
display: grid;
|
|
3195
|
+
width: 22px;
|
|
3196
|
+
height: 22px;
|
|
3197
|
+
place-items: center;
|
|
3198
|
+
border-radius: 999px;
|
|
3199
|
+
background: color-mix(in srgb, var(--cf-accent) 12%, var(--cf-surface));
|
|
3200
|
+
color: var(--cf-accent);
|
|
3201
|
+
font-size: 10px;
|
|
3202
|
+
font-weight: 750;
|
|
3203
|
+
}
|
|
3204
|
+
.cf-analytics-explanation__outlook {
|
|
3205
|
+
border-radius: 8px;
|
|
3206
|
+
background: var(--cf-bg);
|
|
3207
|
+
padding: 10px 11px;
|
|
3208
|
+
}
|
|
3209
|
+
.cf-analytics-explanation__follow-up {
|
|
3210
|
+
border-top: 1px solid var(--cf-border);
|
|
3211
|
+
padding-top: 12px;
|
|
3212
|
+
}
|
|
3213
|
+
.cf-analytics-explanation__questions {
|
|
3214
|
+
display: grid;
|
|
3215
|
+
gap: 6px;
|
|
3216
|
+
margin-top: 8px;
|
|
3217
|
+
}
|
|
3218
|
+
.cf-analytics-explanation__question {
|
|
3219
|
+
width: 100%;
|
|
3220
|
+
border: 1px solid var(--cf-border);
|
|
3221
|
+
border-radius: 8px;
|
|
3222
|
+
background: var(--cf-bg);
|
|
3223
|
+
padding: 8px 9px;
|
|
3224
|
+
color: var(--cf-text);
|
|
3225
|
+
font: inherit;
|
|
3226
|
+
text-align: left;
|
|
3227
|
+
cursor: pointer;
|
|
3228
|
+
}
|
|
3229
|
+
.cf-analytics-explanation__question:hover {
|
|
3230
|
+
border-color: color-mix(in srgb, var(--cf-accent) 45%, var(--cf-border));
|
|
3231
|
+
background: color-mix(in srgb, var(--cf-accent) 6%, var(--cf-bg));
|
|
3232
|
+
}
|
|
3233
|
+
.cf-analytics-explanation__question:focus-visible,
|
|
3234
|
+
.cf-analytics-explanation__limits-summary:focus-visible {
|
|
3235
|
+
outline: 2px solid var(--cf-accent);
|
|
3236
|
+
outline-offset: 2px;
|
|
3237
|
+
}
|
|
3238
|
+
.cf-analytics-explanation__limits {
|
|
3239
|
+
border-top: 1px solid var(--cf-border);
|
|
3240
|
+
padding-top: 10px;
|
|
3241
|
+
}
|
|
3242
|
+
.cf-analytics-explanation__limits-summary {
|
|
3243
|
+
cursor: pointer;
|
|
3244
|
+
color: var(--cf-text);
|
|
3245
|
+
font-weight: 700;
|
|
3246
|
+
}
|
|
3247
|
+
.cf-analytics-explanation__limits-list {
|
|
3248
|
+
margin: 8px 0 0;
|
|
3249
|
+
padding-left: 17px;
|
|
3250
|
+
color: var(--cf-muted);
|
|
3251
|
+
}
|
|
3252
|
+
.cf-analytics-explanation__source {
|
|
3253
|
+
border-top: 1px solid var(--cf-border);
|
|
3254
|
+
margin: 0;
|
|
3255
|
+
padding: 9px 12px;
|
|
3256
|
+
color: var(--cf-muted);
|
|
3257
|
+
font-size: 10px;
|
|
3258
|
+
}
|
|
3259
|
+
|
|
3260
|
+
@media (max-width: 639px) {
|
|
3261
|
+
.cf-panel.cf-panel--analytics-focus {
|
|
3262
|
+
inset: 12px;
|
|
3263
|
+
width: auto;
|
|
3264
|
+
height: auto;
|
|
3265
|
+
min-height: 0;
|
|
3266
|
+
max-width: none;
|
|
3267
|
+
max-height: none;
|
|
3268
|
+
grid-template-rows: auto minmax(0, 1fr);
|
|
3269
|
+
grid-template-areas: 'header' 'video';
|
|
3270
|
+
transform-origin: center;
|
|
1151
3271
|
}
|
|
3272
|
+
.cf-panel--analytics-focus .cf-panel__video { height: 100%; }
|
|
3273
|
+
.cf-panel--analytics-focus .cf-panel__chat { display: none; }
|
|
3274
|
+
.cf-analytics-focus { padding: 14px; }
|
|
3275
|
+
.cf-analytics-visualization.is-expanded .cf-analytics-echart { min-height: 260px; }
|
|
1152
3276
|
}
|
|
1153
|
-
`;function
|
|
3277
|
+
`;function Tt(e){"@babel/helpers - typeof";return Tt=typeof Symbol==`function`&&typeof Symbol.iterator==`symbol`?function(e){return typeof e}:function(e){return e&&typeof Symbol==`function`&&e.constructor===Symbol&&e!==Symbol.prototype?`symbol`:typeof e},Tt(e)}function Et(e,t){if(Tt(e)!=`object`||!e)return e;var n=e[Symbol.toPrimitive];if(n!==void 0){var r=n.call(e,t||`default`);if(Tt(r)!=`object`)return r;throw TypeError(`@@toPrimitive must return a primitive value.`)}return(t===`string`?String:Number)(e)}function q(e){var t=Et(e,`string`);return Tt(t)==`symbol`?t:t+``}function J(e,t,n){return(t=q(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}const Y=`centrinfo-widget`;var Dt=class extends HTMLElement{constructor(...e){super(...e),J(this,`controls`,null)}mountWith(t){let n=m(t),r=this.shadowRoot??this.attachShadow({mode:`open`});if(this.style.zIndex=String(n.zIndex),`adoptedStyleSheets`in Document.prototype&&typeof CSSStyleSheet<`u`){let e=new CSSStyleSheet;e.replaceSync(wt),r.adoptedStyleSheets=[e]}else{let e=document.createElement(`style`);e.textContent=wt,r.appendChild(e)}_(w(Ct,{transport:n.demo?new h:n.preview?new e(new g(n.apiBaseUrl,n.token,n.gifApiKey,n.analyticsContextToken,{agentName:n.agentName,agentAvatarUrl:n.agentAvatarUrl},n.identityToken,n.getIdentityToken,n.chatSurface),n.strings):new g(n.apiBaseUrl,n.token,n.gifApiKey,n.analyticsContextToken,{agentName:n.agentName,agentAvatarUrl:n.agentAvatarUrl},n.identityToken,n.getIdentityToken,n.chatSurface),config:n,bindControls:e=>this.controls=e}),r)}open(){this.controls?.open()}close(){this.controls?.close()}toggle(){this.controls?.toggle()}identify(e){this.controls?.identify(e)}clear(){this.controls?.startNew()}shutdown(){this.controls?.shutdown()}unmount(){this.shadowRoot&&_(null,this.shadowRoot)}};typeof customElements<`u`&&!customElements.get(Y)&&customElements.define(Y,Dt);const Ot=(e,t=document.body)=>{if(typeof document>`u`)throw Error(`[centrinfo-widget] createWidget must run in a browser.`);let n=document.createElement(Y);return n.style.pointerEvents=`none`,n.style.position=`fixed`,n.style.inset=`0`,n.style.width=`0`,n.style.height=`0`,t.appendChild(n),n.mountWith(e),{open:()=>n.open(),close:()=>n.close(),toggle:()=>n.toggle(),show:()=>n.open(),hide:()=>n.close(),identify:e=>n.identify(e),update:e=>n.identify(e),clear:()=>n.clear(),shutdown:()=>n.shutdown(),logout:()=>n.shutdown(),destroy:()=>{n.unmount(),n.remove()}}},X=e=>Ot(e);let kt=null;const At=e=>{kt?.destroy();let t=X(e);return kt=t,t},jt={init:At,createWidget:X};export{jt as Centrinfo,X as createWidget,At as init};
|