@opencx/widget-react 4.0.4 → 4.0.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +3 -3
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +2 -9
- package/dist/index.js +137 -137
- package/dist/index.js.map +1 -1
- package/dist/src/index.d.ts +9 -0
- package/dist-embed/script.js +43 -43
- package/dist-embed/script.js.map +1 -1
- package/package.json +5 -5
- /package/dist/{WidgetPopoverAnchor.d.ts → src/WidgetPopoverAnchor.d.ts} +0 -0
- /package/dist/{WidgetPopoverContent.d.ts → src/WidgetPopoverContent.d.ts} +0 -0
- /package/dist/{WidgetPopoverTrigger.d.ts → src/WidgetPopoverTrigger.d.ts} +0 -0
- /package/dist/{components → src/components}/AgentOrBotAvatar.d.ts +0 -0
- /package/dist/{components → src/components}/AttachmentPreview.d.ts +0 -0
- /package/dist/{components → src/components}/BotOrAgentMessage.d.ts +0 -0
- /package/dist/{components → src/components}/BotOrAgentMessageGroup.d.ts +0 -0
- /package/dist/{components → src/components}/Header.d.ts +0 -0
- /package/dist/{components → src/components}/MightSolveUserIssueSuggestedReplies.d.ts +0 -0
- /package/dist/{components → src/components}/PoweredByOpen.d.ts +0 -0
- /package/dist/{components → src/components}/SuggestedReplyButton.d.ts +0 -0
- /package/dist/{components → src/components}/UserMessage.d.ts +0 -0
- /package/dist/{components → src/components}/UserMessageGroup.d.ts +0 -0
- /package/dist/{components → src/components}/custom-components/BotOrAgentTextResponse.component.d.ts +0 -0
- /package/dist/{components → src/components}/custom-components/Fallback.component.d.ts +0 -0
- /package/dist/{components → src/components}/custom-components/Handoff.component.d.ts +0 -0
- /package/dist/{components → src/components}/custom-components/Loading.component.d.ts +0 -0
- /package/dist/{components → src/components}/lib/DynamicIcon.d.ts +0 -0
- /package/dist/{components → src/components}/lib/LoadingSpinner.d.ts +0 -0
- /package/dist/{components → src/components}/lib/MotionDiv.d.ts +0 -0
- /package/dist/{components → src/components}/lib/avatar.d.ts +0 -0
- /package/dist/{components → src/components}/lib/button.d.ts +0 -0
- /package/dist/{components → src/components}/lib/dialog.d.ts +0 -0
- /package/dist/{components → src/components}/lib/dropdown-menu.d.ts +0 -0
- /package/dist/{components → src/components}/lib/input.d.ts +0 -0
- /package/dist/{components → src/components}/lib/popover.d.ts +0 -0
- /package/dist/{components → src/components}/lib/skeleton.d.ts +0 -0
- /package/dist/{components → src/components}/lib/switch.d.ts +0 -0
- /package/dist/{components → src/components}/lib/tooltip.d.ts +0 -0
- /package/dist/{components → src/components}/lib/utils/cn.d.ts +0 -0
- /package/dist/{components → src/components}/lib/widget-portal.d.ts +0 -0
- /package/dist/{components → src/components}/lib/wobble.d.ts +0 -0
- /package/dist/{components → src/components}/markdown.d.ts +0 -0
- /package/dist/{components → src/components}/svg/ChatBubbleSvg.d.ts +0 -0
- /package/dist/{components → src/components}/svg/OpenLogoSvg.d.ts +0 -0
- /package/dist/{hooks → src/hooks}/useCanvas.d.ts +0 -0
- /package/dist/{hooks → src/hooks}/useIsSmallScreen.d.ts +0 -0
- /package/dist/{hooks → src/hooks}/useSetWidgetSize.d.ts +0 -0
- /package/dist/{hooks → src/hooks}/useTheme.d.ts +0 -0
- /package/dist/{hooks → src/hooks}/useTranslation.d.ts +0 -0
- /package/dist/{hooks → src/hooks}/useWidgetContentHeight.d.ts +0 -0
- /package/dist/{screens → src/screens}/chat/ChatCanvas.d.ts +0 -0
- /package/dist/{screens → src/screens}/chat/ChatFooter.d.ts +0 -0
- /package/dist/{screens → src/screens}/chat/ChatMain.d.ts +0 -0
- /package/dist/{screens → src/screens}/chat/index.d.ts +0 -0
- /package/dist/{screens → src/screens}/index.d.ts +0 -0
- /package/dist/{screens → src/screens}/sessions/index.d.ts +0 -0
- /package/dist/{screens → src/screens}/welcome/index.d.ts +0 -0
- /package/dist/{translation → src/translation}/ar.d.ts +0 -0
- /package/dist/{translation → src/translation}/de.d.ts +0 -0
- /package/dist/{translation → src/translation}/en.d.ts +0 -0
- /package/dist/{translation → src/translation}/es.d.ts +0 -0
- /package/dist/{translation → src/translation}/fr.d.ts +0 -0
- /package/dist/{translation → src/translation}/index.d.ts +0 -0
- /package/dist/{translation → src/translation}/nl.d.ts +0 -0
- /package/dist/{translation → src/translation}/pt.d.ts +0 -0
- /package/dist/{translation → src/translation}/tr.d.ts +0 -0
- /package/dist/{translation → src/translation}/translation.types.d.ts +0 -0
- /package/dist/{utils → src/utils}/data-component.d.ts +0 -0
- /package/dist/{utils → src/utils}/group-messages-by-type.d.ts +0 -0
package/dist/index.cjs
CHANGED
|
@@ -14,7 +14,7 @@
|
|
|
14
14
|
${f.screens.welcome.width},
|
|
15
15
|
${f.screens.sessions.width},
|
|
16
16
|
${f.screens.chat.width}
|
|
17
|
-
)`)};return{theme:f,computed:j,cssVars:Ut({palette:f.palette,primary:f.primaryColor})}}function Ut({palette:t,primary:o}){const s=pt(t),r=Ue(o).toHsl(),n=Ue(o).isLight()?s[950]:s[50];return{"--opencx-primary":`${r.h} ${r.s*100}% ${r.l*100}%`,"--opencx-primary-foreground":n,"--opencx-background":s[100],"--opencx-foreground":s[950],"--opencx-destructive":"0 72.2% 50.6%","--opencx-destructive-foreground":s[50],"--opencx-accent":s[200],"--opencx-accent-foreground":"var(--opencx-foreground)","--opencx-secondary":s[200],"--opencx-secondary-foreground":"var(--opencx-foreground)","--opencx-muted":s[200],"--opencx-muted-foreground":s[500],"--opencx-input":s[300],"--opencx-border":s[300],"--opencx-ring":"var(--opencx-foreground)"}}function pt(t){const o={50:"0 0% 98%",100:"0 0% 96.1%",200:"0 0% 89.8%",300:"0 0% 83.1%",400:"0 0% 63.9%",500:"0 0% 45.1%",600:"0 0% 32.2%",700:"0 0% 25.1%",800:"0 0% 14.9%",900:"0 0% 9%",950:"0 0% 3.9%"},s={50:"60 9.1% 97.8%",100:"60 4.8% 95.9%",200:"20 5.9% 90%",300:"24 5.7% 82.9%",400:"24 5.4% 63.9%",500:"25 5.3% 44.7%",600:"33.3 5.5% 32.4%",700:"30 6.3% 25.1%",800:"12 6.5% 15.1%",900:"24 9.8% 10%",950:"20 14.3% 4.1%"},r={50:"0 0% 98%",100:"240 4.8% 95.9%",200:"240 5.9% 90%",300:"240 4.9% 83.9%",400:"240 5% 64.9%",500:"240 3.8% 46.1%",600:"240 5.2% 33.9%",700:"240 5.3% 26.1%",800:"240 3.7% 15.9%",900:"240 5.9% 10%",950:"240 10% 3.9%"},n={50:"210 40% 98%",100:"210 40% 96.1%",200:"214.3 31.8% 91.4%",300:"212.7 26.8% 83.9%",400:"215 20.2% 65.1%",500:"215.4 16.3% 46.9%",600:"215.3 19.3% 34.5%",700:"215.3 25% 26.7%",800:"217.2 32.6% 17.5%",900:"222.2 47.4% 11.2%",950:"222.2 84% 4.9%"};switch(t){case"neutral":return o;case"stone":return s;case"zinc":return r;case"slate":return n;default:return D.isExhaustive(t,pt.name),o}}function ht(){const{contentIframeRef:t}=l.useWidget(),{inline:o}=l.useConfig();return{setWidth:s=>{var r;(r=t==null?void 0:t.current)==null||r.style.setProperty("--opencx-widget-width",o?"100%":s)},setHeight:s=>{var r;(r=t==null?void 0:t.current)==null||r.style.setProperty("--opencx-widget-height",o?"100%":s)}}}function ge({width:t,height:o}){const{isSmallScreen:s}=F(),{setWidth:r,setHeight:n}=ht();w.useEffect(()=>{t&&r(t),o&&n(o)},[s,o,t,r,n])}const Ke=m.CircleDashedIcon;function V({name:t,className:o}){const s=(()=>{switch(t){case"Check":return m.CheckIcon;case"CheckCheck":return m.CheckCheckIcon;case"CircleCheck":return m.CircleCheckIcon;case"CircleCheckBig":return m.CircleCheckBigIcon;case"CircleX":return m.CircleXIcon;case"Expand":return m.ExpandIcon;case"Maximize":return m.MaximizeIcon;case"Maximize2":return m.Maximize2Icon;case"Minimize":return m.MinimizeIcon;case"Minimize2":return m.Minimize2Icon;case"Shrink":return m.ShrinkIcon;case"SquareCheck":return m.SquareCheckIcon;case"SquareCheckBig":return m.SquareCheckBigIcon;case"SquareX":return m.SquareXIcon;case"X":return m.XIcon;case void 0:return Ke;default:return D.isExhaustive(t,V.name),Ke}})();return e.jsx(s,{className:d("size-4",o)})}function mt({className:t,...o}){return e.jsx("div",{className:d("animate-pulse rounded-md bg-secondary",t),...o})}function we(){var n;const{data:t}=l.usePreludeData(),{routerState:{screen:o}}=l.useWidgetRouter(),{textContent:s}=l.useConfig();return(()=>{var a,i;switch(o){case"chat":return(a=s==null?void 0:s.chatScreen)==null?void 0:a.headerTitle;case"sessions":return(i=s==null?void 0:s.sessionsScreen)==null?void 0:i.headerTitle;case"welcome":return;default:D.isExhaustive(o,we.name);return}})()??((n=t==null?void 0:t.data)==null?void 0:n.organizationName)??"Chat"}function Vt(t){switch(t){case"chat":return g("chat/header");case"sessions":return g("sessions/header");case"welcome":return;default:D.isExhaustive(t,we.name);return}}function Kt(){const{router:t}=l.useConfig(),{routerState:{screen:o},toSessionsScreen:s}=l.useWidgetRouter();return o!=="chat"||t!=null&&t.chatScreenOnly?null:e.jsx(S,{variant:"ghost",size:"fit",className:"rounded-full",onClick:s,children:e.jsx(m.ChevronLeftIcon,{className:"size-4 rtl:-scale-100"})})}function Gt({button:t}){const{setIsOpen:o}=l.useWidgetTrigger(),{isSmallScreen:s}=F();if(s&&t.hideOnSmallScreen||!s&&t.hideOnLargeScreen)return null;const r=()=>{if(t.handleClick)return t.handleClick();o(!1)};return e.jsx(S,{variant:"ghost",size:"fit",className:"rounded-full",onClick:r,children:e.jsx(V,{name:t.icon})})}function ie({button:t}){const[o,s]=w.useState(!1),{routerState:{screen:r}}=l.useWidgetRouter(),{isSmallScreen:n}=F(),{theme:a}=L(),{setWidth:i,setHeight:c}=ht();if(r!=="chat"&&r!=="sessions")return null;const p=(()=>{switch(r){case"chat":return a.screens.chat.height;case"sessions":return a.screens.sessions.height;default:return D.isExhaustive(r,ie.name),a.screens.chat.height}})(),f=(()=>{switch(r){case"chat":return a.screens.chat.width;case"sessions":return a.screens.sessions.width;default:return D.isExhaustive(r,ie.name),a.screens.chat.width}})(),j=()=>{s(k=>{const b=!k;return c(b?"100vh":p),i(b?`max(40vw, ${f})`:f),b})};return n&&t.hideOnSmallScreen||!n&&t.hideOnLargeScreen?null:e.jsx(S,{variant:"ghost",size:"fit",className:"rounded-full",onClick:j,children:e.jsx(V,{name:t.icon||(o?t.shrinkIcon:t.expandIcon)})})}function ut({button:t}){var I,C;const[o,s]=w.useState(!1),{widgetCtx:r}=l.useWidget(),{setIsOpen:n}=l.useWidgetTrigger(),{resolveSession:a,sessionState:i}=l.useSessions(),{isSmallScreen:c}=F(),p=!i.session,f=((I=i.session)==null?void 0:I.isOpened)===!1,j=t.onResolved||"stay-in-chat",k=t.behaviorBeforeSessionCreation||"disabled",b=t.behaviorIfSessionIsResolved||"disabled",h=!!(i.isResolvingSession||p&&k==="disabled"||f&&b==="disabled"),u=async()=>{const{success:T,error:M}=await a();if(s(!1),!T)return console.error(M);switch(j){case"stay-in-chat":return;case"close-widget":n(!1);break;case"reset-chat":r.resetChat();break;case"reset-chat-and-close-widget":n(!1),r.resetChat();break;default:D.isExhaustive(j,ut.name);break}},x=()=>{if(p)switch(k){case"disabled":return;case"close-widget":n(!1);break;default:D.isExhaustive(k,x.name)}if(f)switch(b){case"disabled":return;case"close-widget":n(!1);break;case"reset-chat":r.resetChat();break;case"reset-chat-and-close-widget":n(!1),r.resetChat();break;default:D.isExhaustive(b,x.name)}};return c&&t.hideOnSmallScreen||!c&&t.hideOnLargeScreen?null:((C=t.confirmation)==null?void 0:C.type)==="modal"&&!f&&!p?e.jsxs(et,{open:o,onOpenChange:s,children:[e.jsx(tt,{asChild:!0,children:e.jsx(S,{variant:"ghost",size:"fit",className:"rounded-full",disabled:h,children:e.jsx(V,{name:t.icon})})}),e.jsxs(de,{children:[e.jsx(ot,{children:e.jsx(pe,{children:t.confirmation.title||"Close conversation"})}),e.jsx(rt,{children:e.jsx(at,{children:t.confirmation.description||"Are you sure you want to close this conversation?"})}),e.jsxs(nt,{children:[e.jsx(S,{variant:"secondary",onClick:()=>s(!1),disabled:i.isResolvingSession,children:t.confirmation.cancelButtonText||"No"}),e.jsx(S,{variant:"destructive",onClick:u,disabled:i.isResolvingSession,children:t.confirmation.confirmButtonText||"Yes"})]})]})]}):e.jsx(S,{variant:"ghost",size:"fit",className:"rounded-full",onClick:f||p?x:u,disabled:h,children:e.jsx(V,{name:t.icon})})}function le({button:t}){switch(t.functionality){case"close-widget":return e.jsx(Gt,{button:t});case"expand-shrink":return e.jsx(ie,{button:t});case"resolve-session":return e.jsx(ut,{button:t});default:return D.isExhaustive(t,le.name),null}}const Zt={functionality:"close-widget",hideOnLargeScreen:!0,icon:"X"};function Jt(){const{routerState:{screen:t}}=l.useWidgetRouter(),{headerButtons:o}=l.useConfig(),s=t==="chat"?o==null?void 0:o.chatScreen:t==="sessions"?o==null?void 0:o.sessionsScreen:[];return!s||s.length===0?e.jsx(le,{button:Zt}):e.jsx(e.Fragment,{children:s.map(r=>e.jsx(le,{button:r},`${r.functionality}-${r.icon}`))})}function gt(){const{routerState:{screen:t}}=l.useWidgetRouter(),{isLoading:o}=l.usePreludeData(),s=Vt(t),r=we();return e.jsx("header",{...s,className:"py-2 px-4 shrink-0",children:e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(Kt,{}),e.jsx("div",{className:d("flex-1 h-8 flex items-center",t==="sessions"&&"ps-2"),children:e.jsx(N.AnimatePresence,{mode:"wait",children:o?e.jsx(v,{snapExit:!0,children:e.jsx(mt,{className:"h-5 w-1/2"})},"skeleton"):e.jsx(v,{children:e.jsx("h2",{className:"font-semibold",children:r})},"organization-name")})}),e.jsx(Jt,{})]})})}function wt({className:t}){return e.jsx(m.LoaderIcon,{className:d("size-4 animate-spin",t)})}function Qt(){const{messagesState:{isInitialFetchLoading:t}}=l.useMessages(),{isSmallScreen:o}=F(),{activeMode:s,Component:r}=l.useModes();return{isCanvasOpen:!t&&!o&&!!s&&!!r}}function es(){const{activeMode:t,Component:o}=l.useModes(),{sendMessage:s}=l.useMessages(),{createStateCheckpoint:r}=l.useSessions(),[n,a]=w.useState(!1),i=async c=>{try{a(!0),await s(c)}catch(p){console.error(p)}finally{a(!1)}};return!t||!o?null:e.jsx(o,{react:w,mode:t,createStateCheckpoint:r,sendMessage:i,isSendingMessage:n})}const ts={"write-a-message":"اكتب رسالة...","session-closed-lead":"تم حل مشكلتك!","new-conversation":"محادثة جديدة","welcome-title":"مرحبًا بك في دردشة الدعم الخاصة بنا","welcome-description":"نحن هنا للمساعدة! ابدأ محادثة وسنرد عليك في أقرب وقت ممكن.","your-name":"اسمك","your-email":"عنوان بريدك الإلكتروني","start-chat":"تحدث إلى الدعم","starting-chat":"جاري الاتصال...","i-need-more-help":"أحتاج المزيد من المساعدة","this-was-helpful":"كان هذا مفيدًا",optional:"اختياري","no-conversations-yet":"لا يوجد محادثات","back-to-conversations":"العودة إلى المحادثات","closed-conversations":"المحادثات المغلقة"},ss={"write-a-message":"Nachricht schreiben...","session-closed-lead":"Ihr Problem wurde gelöst!","new-conversation":"Neue Konversation","welcome-title":"Willkommen in unserem Support-Chat","welcome-description":"Wir sind hier, um zu helfen! Beginnen Sie ein Gesprách und wir werden so schnell wie mogelijk antworten.","your-name":"Ihr Name","your-email":"Ihre E-Mail-Adresse","start-chat":"Mit dem Support sprechen","starting-chat":"Verbindung wird hergestellt...","i-need-more-help":"Ich brauche weitere Hilfe","this-was-helpful":"Dies war hilfreich",optional:"Optional","no-conversations-yet":"noch keine Gespräche","back-to-conversations":"Zurück zur Konversationen","closed-conversations":"Geschlossene Konversationen"},os={"write-a-message":"Write a message...","session-closed-lead":"Your issue has been resolved!","new-conversation":"New conversation","welcome-title":"Welcome to our support chat","welcome-description":"We're here to help! Start a conversation and we'll get back to you as soon as possible.","your-name":"Your name","your-email":"Your email address","start-chat":"Talk to support","starting-chat":"Connecting...","i-need-more-help":"I need more help","this-was-helpful":"This was helpful",optional:"Optional","no-conversations-yet":"No conversations yet","back-to-conversations":"Back to conversations","closed-conversations":"Closed conversations"},rs={"write-a-message":"Écrivez un message...","session-closed-lead":"Votre problème a été résolu !","new-conversation":"Nouvelle conversation","welcome-title":"Bienvenue dans notre chat de support","welcome-description":"Nous sommes là pour vous aider ! Commencez une conversation et nous vous répondrons dès que possible.","your-name":"Votre nom","your-email":"Votre adresse e-mail","start-chat":"Parler au support","starting-chat":"Connexion...","i-need-more-help":"Je besoin d'aide plus","this-was-helpful":"C'était utile",optional:"Optionnel","no-conversations-yet":"Aucune conversation pour le moment","back-to-conversations":"Retour aux conversations","closed-conversations":"Conversations fermées"},ns={"write-a-message":"Schrijf een bericht...","session-closed-lead":"Uw probleem is opgelost!","new-conversation":"Nieuw gesprek","welcome-title":"Welkom bij onze supportchat","welcome-description":"We zijn hier om te helpen! Begin een gesprek en we nemen zo snel mogelijk contact met u op.","your-name":"Uw naam","your-email":"Uw e-mailadres","start-chat":"Praat met ondersteuning","starting-chat":"Verbinding maken...","i-need-more-help":"Ik heb nog meer hulp nodig","this-was-helpful":"Mijn vraag is opgelost",optional:"Optioneel","no-conversations-yet":"Nog geen gesprekken","back-to-conversations":"Terug naar gesprekken","closed-conversations":"Afgesloten gesprekken"},as={"write-a-message":"Escreva uma mensagem...","session-closed-lead":"Seu problema foi resolvido!","new-conversation":"Nova conversa","welcome-title":"Bem-vindo ao nosso chat de suporte","welcome-description":"Estamos aqui para ajudar! Inicie uma conversa e responderemos o mais rápido possível.","your-name":"Seu nome","your-email":"Seu endereço de email","start-chat":"Falar com o suporte","starting-chat":"Conectando...","i-need-more-help":"preciso de mais ajuda","this-was-helpful":"Isso foi útil",optional:"Opcional","no-conversations-yet":"Nenhuma conversa ainda","back-to-conversations":"Voltar para conversas","closed-conversations":"Conversas fechadas"},is={"write-a-message":"Escribe un mensaje...","session-closed-lead":"¡Tu problema fue resuelto!","new-conversation":"Nueva conversación","welcome-title":"Bienvenido a nuestro chat de soporte","welcome-description":"¡Estamos aquí para ayudarte! Inicia una conversación y responderemos lo antes posible.","your-name":"Tu nombre","your-email":"Tu correo electrónico","start-chat":"Hablar con soporte","starting-chat":"Conectando...","i-need-more-help":"Necesito más ayuda","this-was-helpful":"Esto fue útil",optional:"Opcional","no-conversations-yet":"Sin conversaciones aún","back-to-conversations":"Volver a conversaciones","closed-conversations":"Conversaciones cerradas"},ls={"write-a-message":"Bir mesaj yazın...","session-closed-lead":"Sorununuz çözüldü!","new-conversation":"Yeni konuşma","welcome-title":"Destek sohbetimize hoş geldiniz","welcome-description":"Yardım etmek için buradayız! Bir konuşma başlatın, en kısa sürede size geri döneceğiz.","your-name":"Adınız","your-email":"E-posta adresiniz","start-chat":"Destekle konuş","starting-chat":"Bağlanıyor...","i-need-more-help":"Daha fazla yardıma ihtiyacım var","this-was-helpful":"Bu yardımcı oldu",optional:"İsteğe bağlı","no-conversations-yet":"Henüz konuşma yok","back-to-conversations":"Konuşmalara geri dön","closed-conversations":"Kapatılan konuşmalar"},ft={en:os,ar:ts,nl:ns,fr:rs,de:ss,pt:as,es:is,tr:ls},cs=Object.keys(ft);function ds(t){return cs.includes(t)}function ps(t,o){const s=ft[o];return s&&s[t]||""}function X(){const{dir:t}=l.useDocumentDir(),o=l.useConfig();return w.useMemo(()=>{const s=ds(o.language)?o.language:"en";return{t:r=>ps(r,s),language:s,dir:s==="ar"?"rtl":"ltr",hostDocumentDir:t}},[o.language,t])}function fe({suggestion:t,className:o,...s}){const{sendMessage:r}=l.useMessages(),n=()=>{const a=t.trim();a&&r({content:a})};return e.jsx(S,{...g("chat/suggested_reply_btn"),size:"sm",className:d("rounded-xl w-fit",o),...s,onClick:n,children:t})}function hs(){const{t}=X(),o=[t("i-need-more-help"),t("this-was-helpful")];return e.jsx("div",{...g("chat/might_solve_user_issue_suggested_replies_container"),className:"flex items-center gap-2 p-2 pb-0 flex-wrap",children:o.map(s=>e.jsx(fe,{suggestion:s,className:"flex-1"},s))})}function ms({file:{status:t,file:o,error:s},onCancel:r}){const[n,a]=w.useState(null);w.useEffect(()=>{if(!o.type.startsWith("image/"))return;const p=new FileReader;return p.onload=()=>a(p.result),p.onerror=()=>console.error("Error reading file"),p.readAsDataURL(o),()=>p.abort()},[o]);const i=()=>{switch(t){case"uploading":return e.jsx(m.Loader2,{className:"size-4 animate-spin"});case"error":return e.jsx(m.AlertCircle,{className:"size-4 text-destructive"});default:return null}},c=()=>{const p=o.type.split("/")[0];return p==="image"&&n?e.jsx("img",{src:typeof n=="string"?n:"",className:"object-cover bg-secondary size-full",alt:o.name}):p==="audio"?e.jsx(m.FileAudio2Icon,{}):p==="video"?e.jsx(m.FileVideo2Icon,{}):e.jsx(m.FileIcon,{})};return e.jsx(U,{side:"bottom",content:t==="error"?e.jsxs("span",{className:"text-destructive",children:["Failed to upload: ",s]}):o.name,children:e.jsxs("div",{className:d(t==="uploading"&&"opacity-50","group","size-12 border rounded-2xl overflow-hidden relative","flex items-center justify-center shrink-0"),children:[e.jsx("div",{className:"absolute inset-0 flex items-center justify-center",children:i()}),e.jsx("button",{type:"button",className:d("absolute bg-black/50 inset-0 size-full z-10 opacity-0","flex items-center justify-center","opacity-0 group-hover:opacity-100 transition"),onClick:r,children:e.jsx(m.XIcon,{className:"size-4 text-primary-foreground"})}),e.jsx(c,{})]})})}function us(){var P;const{isSmallScreen:t}=F(),o=w.useRef(null),{sendMessage:s}=l.useMessages(),{sessionState:r}=l.useSessions(),{t:n}=X(),[a,i]=w.useState(""),{allFiles:c,emptyTheFiles:p,handleCancelUpload:f,appendFiles:j,isUploading:k,successFiles:b}=l.useUploadFiles(),h=!!((P=r.session)!=null&&P.isHandedOff),{isAwaitingBotReply:u}=l.useIsAwaitingBotReply(),x=y=>{j(y)},I=!a.trim()&&b.length===0,C=async()=>{if(u||I)return;k&&console.info("please wait for the file(s) to upload");const y=a.trim();s({content:y,attachments:b.flatMap(z=>z.fileUrl?[{url:z.fileUrl,type:z.file.type,name:z.file.name,id:z.id,size:z.file.size}]:[])}),i(""),p()},{getRootProps:T,getInputProps:M,open:O}=Mt.useDropzone({onDrop:x,noClick:!0,onDropRejected(){console.error("unsupported file type, or the file is too large")},maxSize:5*1024*1024,accept:h?{"text/*":[".txt"],"image/*":[".png",".jpg",".jpeg",".gif"],"application/pdf":[".pdf"]}:{"image/png":[".png"],"image/jpeg":[".jpg",".jpeg"],"image/gif":[".gif"],"image/webp":[".webp"]}}),W=y=>{const z=y.clipboardData;z&&z.files.length>0&&x(Array.from(z.files))};return e.jsxs("div",{...g("chat/input_box/root"),className:"p-2 relative space-y-1",...T(),children:[e.jsx("input",{...M()}),e.jsxs("div",{...g("chat/input_box/inner_root"),className:d("transition-all","bg-white","relative rounded-3xl flex flex-col gap-2 p-2","hover:border-primary focus-within:border-primary"),children:[e.jsxs("div",{...g("chat/input_box/textarea_and_attachments_container"),className:"flex flex-col gap-2",children:[c.length>0&&e.jsx("div",{...g("chat/input_box/attachments_container"),className:"flex items-center gap-1",children:e.jsx(N.AnimatePresence,{mode:"popLayout",children:c.map(y=>e.jsx(v,{snapExit:!0,children:e.jsx(ms,{onCancel:()=>f(y.id),file:y})},y.id))})}),e.jsx("textarea",{...g("chat/input_box/textarea"),onPaste:W,ref:o,id:"chat-input",value:a,rows:3,className:d("max-h-16 [field-sizing:content]","w-full resize-none px-2",c.length===0&&"pt-1","bg-transparent outline-none","placeholder:text-muted-foreground",t?"text-[16px]":"text-sm"),onChange:y=>i(y.target.value),onKeyDown:async y=>{y.key==="Enter"&&!y.shiftKey&&(y.preventDefault(),C())},placeholder:n("write-a-message")})]}),e.jsxs("div",{className:"gap-2 flex justify-between",children:[e.jsx(U,{side:"top",align:"start",content:"attach files, (maximum size 5mb)",children:e.jsx(S,{onClick:O,size:"fit",variant:"ghost",className:d("rounded-full size-8 flex items-center justify-center p-0 overflow-hidden"),children:e.jsx(N.AnimatePresence,{mode:"wait",children:h?e.jsx(v,{children:e.jsx(m.PaperclipIcon,{className:"size-4"})},"paper-clip"):e.jsx(v,{children:e.jsx(m.ImageIcon,{className:"size-4"})},"image-icon")})})}),e.jsx(U,{content:"send message",side:"top",align:"end",children:e.jsx(S,{size:"fit",onClick:C,disabled:u||k||I,className:"rounded-full size-8 flex items-center justify-center p-0",children:e.jsx(N.AnimatePresence,{mode:"wait",children:u||k?e.jsx(v,{snapExit:!0,children:e.jsx(m.CircleDashed,{className:"size-4 animate-spin animate-iteration-infinite"})},"loading"):e.jsx(v,{snapExit:!0,children:e.jsx(m.ArrowUpIcon,{className:"size-4"})},"send")})})})]})]})]})}function gs(){const{widgetCtx:t}=l.useWidget(),{router:o}=l.useConfig(),{canCreateNewSession:s}=l.useSessions(),{toSessionsScreen:r}=l.useWidgetRouter(),{t:n}=X();return e.jsx("div",{className:"p-2",children:e.jsxs("div",{className:"p-2 bg-muted rounded-3xl space-y-2",children:[e.jsxs("div",{className:"ps-2 flex items-center gap-1",children:[e.jsx(m.CircleCheckIcon,{className:"size-4 text-emerald-600"}),e.jsx("h2",{className:"text-sm font-medium",children:n("session-closed-lead")})]}),e.jsx("div",{children:s||o!=null&&o.chatScreenOnly?e.jsx(S,{onClick:t.resetChat,className:"rounded-2xl w-full",children:n("new-conversation")}):e.jsx(S,{onClick:r,className:"rounded-2xl w-full",children:n("back-to-conversations")})})]})})}function ws(){var i;const{initialQuestions:t,initialQuestionsPosition:o,thisWasHelpfulOrNot:s}=l.useConfig(),{sessionState:r}=l.useSessions(),{messagesState:n}=l.useMessages(),a=n.messages.length===0;return e.jsx("footer",{children:e.jsx("div",{children:e.jsx(N.AnimatePresence,{mode:"wait",children:r.session&&!((i=r.session)!=null&&i.isOpened)?e.jsx(v,{className:"overflow-hidden",overrides:{initial:{height:0},animate:{height:"auto"},exit:{height:0}},children:e.jsx(gs,{})},"session-closed"):e.jsxs(v,{className:"overflow-hidden",overrides:{initial:{height:0},animate:{height:"auto"},exit:{height:0}},children:[n.lastAIResMightSolveUserIssue&&(s==null?void 0:s.enabled)!==!1&&e.jsx(hs,{}),a&&t&&o!=="below-initial-messages"&&e.jsx("div",{className:"flex items-center flex-row justify-end gap-2 flex-wrap px-2",children:t==null?void 0:t.map((c,p)=>e.jsx(fe,{suggestion:c},`${c}-${p}`))}),e.jsx(us,{})]},"chat-input")})})})}function fs({isFirstInGroup:t,isLastInGroup:o,isAloneInGroup:s,...r}){const{componentStore:n}=l.useWidget();if(r.data.action){const i=n.getComponent(r.data.action.name);if(i)return e.jsx(i,{...r,id:r.id,isFirstInGroup:t,isLastInGroup:o,isAloneInGroup:s})}const a=n.getComponent(r.component);return a?e.jsx(a,{...r,id:r.id,isFirstInGroup:t,isLastInGroup:o,isAloneInGroup:s}):e.jsx(ee,{...r,isFirstInGroup:t,isLastInGroup:o,isAloneInGroup:s})}function ne({messages:t,agent:o,suggestedReplies:s}){return e.jsxs("div",{...g("chat/agent_msg_group/root"),className:d("flex items-end gap-2"),children:[e.jsx(U,{content:o==null?void 0:o.name,side:"right",align:"end",children:e.jsx(ae,{...g("chat/agent_msg_group/root/avatar"),agent:o,className:"hidden"})}),e.jsxs("div",{className:d("flex-1 flex flex-col gap-2"),children:[e.jsxs("div",{...g("chat/agent_msg_group/avatar_and_msgs/root"),className:d("flex items-end gap-2"),children:[e.jsx(U,{content:o==null?void 0:o.name,side:"right",align:"end",children:e.jsx(ae,{...g("chat/agent_msg_group/avatar_and_msgs/avatar"),agent:o})}),e.jsx("div",{...g("chat/agent_msg_group/avatar_and_msgs/msgs"),className:d("flex-1 flex flex-col gap-1"),children:t.map((r,n,a)=>e.jsx(fs,{isFirstInGroup:n===0,isLastInGroup:n===a.length-1,isAloneInGroup:a.length===1,...r},r.id))})]}),s&&s.length>0&&e.jsx("div",{...g("chat/agent_msg_group/suggestions"),className:d("flex flex-col gap-1 ps-8"),children:s==null?void 0:s.map((r,n)=>e.jsx(fe,{suggestion:r},`${r}-${n}`))})]})]})}function xs({message:t,isFirstInGroup:o,isLastInGroup:s,isAloneInGroup:r}){var n;return e.jsxs("div",{...g("chat/user_msg/root"),className:"w-5/6 flex flex-col items-end gap-1",children:[t.attachments&&t.attachments.length>0&&e.jsx("div",{className:"w-full flex gap-1 flex-wrap justify-end",children:(n=t.attachments)==null?void 0:n.map(a=>e.jsx(it,{attachment:a},a.id))}),t.content.length>0&&e.jsx("div",{...g("chat/user_msg/msg"),"data-first":o,"data-last":s,"data-alone":r,className:d("transition-all","w-fit py-3 px-4 rounded-3xl text-sm","bg-primary text-primary-foreground","break-words [word-break:break-word]","whitespace-pre-wrap",o&&!r&&"rounded-br-md",s&&!r&&"rounded-tr-md",!o&&!s&&!r&&"rounded-r-md"),children:t.content})]})}function vs({messages:t}){return e.jsx("div",{...g("chat/user_msg_group/root"),className:d("group","flex flex-col gap-1 justify-end items-end"),children:t.map((o,s,r)=>e.jsx(xs,{message:o,isFirstInGroup:s===0,isLastInGroup:s===r.length-1,isAloneInGroup:r.length===1},o.id))})}function bs(t){const o=[];let s=null;return t.forEach(r=>{var n,a,i,c;(!s||((n=s[0])==null?void 0:n.type)!==r.type)&&(s=[],o.push(s)),((a=s[0])==null?void 0:a.type)==="FROM_AGENT"&&r.type==="FROM_AGENT"&&((i=r.agent)==null?void 0:i.id)!==((c=s[0].agent)==null?void 0:c.id)&&(s=[],o.push(s)),s.push(r)}),o}function ys(t){var o;return((o=t==null?void 0:t[0])==null?void 0:o.type)==="FROM_USER"}function js(t){var o;return((o=t==null?void 0:t[0])==null?void 0:o.type)==="FROM_BOT"}function ks(t){var o;return((o=t==null?void 0:t[0])==null?void 0:o.type)==="FROM_AGENT"}function Cs(){const{messagesState:{messages:t}}=l.useMessages(),{isAwaitingBotReply:o}=l.useIsAwaitingBotReply(),{componentStore:s}=l.useWidget(),r=l.useConfig(),{initialQuestions:n,initialQuestionsPosition:a}=r,i=w.useMemo(()=>bs(t),[t]),c=r.persistentInitialMessages||[],p=(()=>{var h;return t.length?((h=r.advancedInitialMessages)==null?void 0:h.filter(u=>!!u.persistent))||[]:r.advancedInitialMessages||[]})(),f=(()=>{var h;return p.length?[]:t.length?[]:(h=r.initialMessages)!=null&&h.length?r.initialMessages:["Hello, how can I help you?"]})(),j=s.getComponent("loading"),k=w.useRef(null);function b(){setTimeout(()=>{const h=k.current;h&&(h.scrollTop=h.scrollHeight)},0)}return w.useEffect(()=>{b()},[t]),e.jsxs("div",{...g("chat/msgs/root"),ref:k,className:"max-h-full scroll-smooth relative flex-1 py-2 px-4 flex flex-col gap-2 overflow-auto",children:[e.jsx("div",{...g("chat/persistent_initial_msgs/root"),children:c.map((h,u,x)=>e.jsx(ee,{component:"bot_message",data:{message:h},id:h,type:"FROM_BOT",timestamp:Date.now().toString(),dataComponentNames:{messageContainer:"chat/persistent_initial_msg/root",message:"chat/persistent_initial_msg/msg"},classNames:{messageContainer:d("w-full flex flex-col items-center text-center"),message:"w-full bg-transparent border-none shadow-none text-xs"},isFirstInGroup:u===0,isLastInGroup:u===x.length-1,isAloneInGroup:x.length===1},`${h}-${u}`))}),p.length>0&&e.jsx(ne,{messages:p.map(({message:h},u)=>({component:"bot_message",data:{message:h},id:`${u}-${h}`,type:"FROM_BOT",timestamp:Date.now().toString()})),suggestedReplies:t.length===0&&a==="below-initial-messages"?n:void 0,agent:r.bot?{...r.bot,isAi:!0,id:null}:void 0}),t.length===0&&f.length>0&&e.jsx(ne,{messages:f.map((h,u)=>({component:"bot_message",data:{message:h},id:`${u}-${h}`,type:"FROM_BOT",timestamp:Date.now().toString()})),suggestedReplies:a==="below-initial-messages"?n:void 0,agent:r.bot?{...r.bot,isAi:!0,id:null}:void 0}),i.map(h=>{var I,C,T;const u=(I=h==null?void 0:h[0])==null?void 0:I.type,x=(C=h[0])==null?void 0:C.id;if(!u||!x)return null;if(ys(h))return e.jsx(vs,{messages:h},x);if(js(h)||ks(h)){const M=(T=h[0])==null?void 0:T.agent;return e.jsx(ne,{messages:h,agent:M},x)}return null}),o&&j&&e.jsx(j,{agent:r.bot})]})}function zs(){const{messagesState:{isInitialFetchLoading:t}}=l.useMessages(),{sessionState:{session:o}}=l.useSessions(),{isCanvasOpen:s}=Qt(),{theme:r}=L();ge({width:s?r.screens.chat.withCanvas.width:r.screens.chat.width,height:s?r.screens.chat.withCanvas.height:r.screens.chat.height});const n=w.useRef((o==null?void 0:o.id)||"chat").current;return e.jsx("div",{...g("chat/root"),className:d("flex flex-col overflow-hidden"),style:{width:"100vw",maxWidth:"100vw",height:"100vh",maxHeight:"100vh"},children:e.jsxs("div",{className:"size-full justify-between flex flex-col",children:[e.jsx(gt,{}),e.jsx(N.AnimatePresence,{mode:"wait",children:t?e.jsx(v,{className:"flex flex-col items-center justify-center w-full flex-1",children:e.jsx(wt,{})},"loading"):e.jsxs(v,{className:"flex items-start h-full flex-1 overflow-auto",snapExit:!0,children:[e.jsxs("div",{...g("chat/main/root"),className:d("flex flex-col h-full overflow-auto transition-all",s?"w-2/5":"w-full"),style:{transitionTimingFunction:r.screens.chat.withCanvas.transitionTimingFunction,transitionDuration:r.screens.chat.withCanvas.transitionDuration},children:[e.jsx(Cs,{}),e.jsx(ws,{})]}),e.jsx("div",{...g("chat/canvas/root"),className:d("h-full overflow-auto transition-all",s?"w-3/5":"w-0"),style:{transitionTimingFunction:r.screens.chat.withCanvas.transitionTimingFunction,transitionDuration:r.screens.chat.withCanvas.transitionDuration},children:e.jsx(es,{})})]},n)})]})})}function Ns({className:t}){return e.jsx("svg",{width:"26",height:"32",viewBox:"0 0 26 32",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:d("text-primary-foreground",t),children:e.jsx("path",{d:"M1.34103 25.6132H5.44245C5.74203 25.6228 6.02673 25.7462 6.23867 25.9582C6.45062 26.1703 6.5739 26.4551 6.58348 26.7548V30.8584C6.59305 31.1581 6.71634 31.443 6.92828 31.655C7.14023 31.8671 7.42492 31.9904 7.7245 32H18.2894C18.589 31.9904 18.8737 31.8671 19.0856 31.655C19.2976 31.443 19.4209 31.1581 19.4304 30.8584V26.7548C19.4401 26.4545 19.5638 26.1692 19.7765 25.957C19.9892 25.7449 20.2748 25.6219 20.5749 25.6132H24.659C24.9586 25.6036 25.2433 25.4803 25.4552 25.2682C25.6671 25.0562 25.7904 24.7713 25.8 24.4716V7.52839C25.7904 7.22865 25.6671 6.94381 25.4552 6.73176C25.2433 6.5197 24.9586 6.39635 24.659 6.38677H20.561C20.2603 6.37802 19.9742 6.25457 19.7614 6.04169C19.5487 5.82881 19.4253 5.54261 19.4165 5.24168V1.14161C19.4072 0.84419 19.2858 0.561291 19.0768 0.349589C18.8678 0.137887 18.5865 0.0130193 18.2894 0L7.7245 0C7.42492 0.00957792 7.14023 0.132929 6.92828 0.344983C6.71634 0.557036 6.59305 0.841878 6.58348 1.14161V5.24168C6.57477 5.54203 6.45187 5.82773 6.23983 6.04052C6.0278 6.25331 5.74262 6.37715 5.44245 6.38677H1.34103C1.04144 6.39635 0.756749 6.5197 0.544805 6.73176C0.332861 6.94381 0.209574 7.22865 0.200001 7.52839V24.4716C0.209574 24.7713 0.332861 25.0562 0.544805 25.2682C0.756749 25.4803 1.04144 25.6036 1.34103 25.6132ZM6.58348 24.4716V7.52839C6.59305 7.22865 6.71634 6.94381 6.92828 6.73176C7.14023 6.5197 7.42492 6.39635 7.7245 6.38677H18.2894C18.589 6.39635 18.8737 6.5197 19.0856 6.73176C19.2976 6.94381 19.4209 7.22865 19.4304 7.52839V24.4716C19.4209 24.7713 19.2976 25.0562 19.0856 25.2682C18.8737 25.4803 18.589 25.6036 18.2894 25.6132H7.7245C7.42492 25.6036 7.14023 25.4803 6.92828 25.2682C6.71634 25.0562 6.59305 24.7713 6.58348 24.4716Z",fill:"currentColor"})})}function xt({className:t}){const{token:o}=l.useConfig();return e.jsx("div",{className:d("flex items-center justify-center gap-2 p-2 pt-0",t),children:e.jsx(A,{children:e.jsxs("a",{href:`https://open.cx/?ref=${o}`,target:"_blank",rel:"noreferrer",className:d("text-[10px] flex items-center","text-muted-foreground/70 [&_svg]:text-muted-foreground/70","hover:text-primary [&_svg]:hover:text-primary"),children:[e.jsx("span",{children:"Powered by"}),e.jsx("span",{children:" "}),e.jsxs("span",{className:"flex items-center gap-[1px]",children:[e.jsx("span",{children:e.jsx(Ns,{className:"size-3 inline-block"})}),e.jsx("span",{className:"font-semibold",children:"open"})]})]})})})}function Ss({children:t}){return e.jsx("p",{className:"ps-4 text-xs text-muted-foreground/75 uppercase font-semibold tracking-tight",children:t})}function Ge({session:t,className:o}){const{bot:s}=l.useConfig(),{toChatScreen:r}=l.useWidgetRouter(),n=t.assignee.kind==="human"?t.assignee.name||"Support Agent":(s==null?void 0:s.name)||"AI Support Agent",a=t.assignee.kind==="human"?t.assignee.avatarUrl||"":(s==null?void 0:s.avatar)||"";return e.jsxs(S,{variant:"ghost",size:"lg",className:d("rounded-full p-2 pe-4 flex text-start justify-between w-full whitespace-normal",o),onClick:()=>r(t.id),children:[e.jsxs("div",{className:"flex-1 flex gap-2 items-center",children:[e.jsx(N.AnimatePresence,{mode:"wait",children:e.jsx(v,{snapExit:!0,children:e.jsxs(he,{className:"size-10",children:[e.jsx(me,{src:a,alt:"Agent Icon"}),e.jsx(ue,{children:e.jsx(m.UserRoundIcon,{className:"size-4"})})]})})}),e.jsxs("div",{className:"flex-1",children:[e.jsx(N.AnimatePresence,{mode:"wait",children:e.jsx(v,{snapExit:!0,children:n},n)}),e.jsx(N.AnimatePresence,{mode:"wait",children:t.lastMessage?e.jsx(v,{snapExit:!0,children:e.jsx(lt,{remarkPlugins:[Je],rehypePlugins:[Ze],className:"line-clamp-1 overflow-hidden text-ellipsis text-xs text-muted-foreground",children:t.lastMessage})},t.lastMessage||"content"):e.jsx(v,{className:"w-1/2",snapExit:!0,children:e.jsx(mt,{className:"h-4 w-full"})},"skeleton")})]})]}),e.jsx(m.ChevronRightIcon,{className:"size-4 text-muted-foreground shrink-0 rtl:-scale-100"})]})}function _s(){const{t}=X(),{toChatScreen:o}=l.useWidgetRouter(),{sessionsState:{data:s,isInitialFetchLoading:r},openSessions:n,closedSessions:a,canCreateNewSession:i}=l.useSessions();return e.jsx("div",{className:"flex-1 flex flex-col overflow-scroll py-2 px-2",children:e.jsx(N.AnimatePresence,{mode:"wait",children:r?e.jsx(v,{className:"flex-1 flex items-center justify-center",children:e.jsx(wt,{})},"loading"):e.jsx(v,{className:"flex-1 flex flex-col gap-2 relative",children:s.length?e.jsxs(e.Fragment,{children:[e.jsxs(N.AnimatePresence,{children:[n.length>0&&e.jsx(v,{fadeIn:"up",delay:.2,className:"space-y-2",snapExit:!0,children:n.map(c=>e.jsx(Ge,{session:c},c.id))},"open-sessions"),a.length>0&&e.jsxs(v,{className:"space-y-2",delay:.2,snapExit:!0,children:[e.jsx(Ss,{children:t("closed-conversations")}),a.map(c=>e.jsx(Ge,{session:c,className:"opacity-50 hover:opacity-100"},c.id))]},"closed-sessions")]}),i&&e.jsx("div",{className:"mt-auto w-full rounded-3xl sticky bottom-0 outline outline-8 outline-background bg-background",children:w.createElement(S,{...g("sessions/new_conversation_btn"),size:"lg",key:"new-session",className:"w-full",onClick:()=>o()},t("new-conversation"))})]}):e.jsxs("div",{className:"flex-1 flex flex-col gap-2 items-center",children:[e.jsx("div",{className:"flex-1 flex items-center justify-center",children:e.jsx("p",{className:"text-muted-foreground",children:t("no-conversations-yet")})}),w.createElement(S,{...g("sessions/new_conversation_btn"),size:"lg",key:"new-session",className:"w-full",onClick:()=>o()},t("new-conversation"))]})},"sessions")})})}function Is(){const{theme:t}=L();return ge({width:t.screens.sessions.width,height:t.screens.sessions.height}),e.jsx("div",{...g("sessions/root"),className:d("flex flex-col overflow-hidden bg-background"),style:{width:"100vw",maxWidth:"100vw",height:"100vh",maxHeight:"100vh"},children:e.jsxs("div",{className:"size-full flex flex-col",children:[e.jsx(gt,{}),e.jsx(_s,{}),e.jsx(xt,{})]})})}const Q=E.forwardRef(({className:t,type:o,...s},r)=>{const{isSmallScreen:n}=F();return e.jsx(A,{ref:r,children:e.jsx("input",{type:o,className:d(n?"text-[16px]":"text-sm","flex w-full rounded-xl p-2 ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-primary-foreground placeholder:text-muted-foreground/75 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 transition","rounded-2xl px-4","border shadow-sm",t),...s})})});Q.displayName="Input";function Ts(){const{contentIframeRef:t}=l.useWidget(),{inline:o}=l.useConfig(),s=w.useRef(null);return w.useEffect(()=>{const r=t==null?void 0:t.current;if(r&&s.current){const n=s.current;let a;const i=new ResizeObserver(()=>{a=requestAnimationFrame(()=>{const c=n.offsetHeight;r.style.setProperty("--opencx-widget-height",o?"100%":`${c.toFixed(1)}px`)})});return i.observe(n),()=>{cancelAnimationFrame(a),i.unobserve(n)}}},[t,o]),{observedElementRef:s}}const Ms=re.z.object({name:re.z.string().min(2),email:re.z.string().email()});function Ds(){var C,T,M,O,W,P,y,z,H;const{setIsOpen:t}=l.useWidgetTrigger(),{createUnverifiedContact:o}=l.useContact(),{isSmallScreen:s}=F(),r=l.useConfig(),{theme:n}=L(),{t:a}=X(),{data:i}=l.usePreludeData(),{observedElementRef:c}=Ts();ge({height:void 0,width:n.screens.welcome.width});const[p,f]=w.useState(((C=r.prefillUserData)==null?void 0:C.name)||""),[j,k]=w.useState(((T=r.prefillUserData)==null?void 0:T.email)||""),b=(r.extraDataCollectionFields||[]).filter(_=>_!=="name"&&_!=="email"&&!!_),[h,u]=w.useState({}),[x,I]=Dt(async _=>{_.preventDefault();const q=Ms.safeParse({name:p,email:j});q.success&&await o({email:q.data.email,non_verified_name:q.data.name},Object.values(h).filter(Boolean).length?h:void 0)},[p,j,h]);return e.jsx("div",{style:{width:"100vw",maxWidth:"100vw",minHeight:n.screens.welcome.minHeight,height:"100vh",maxHeight:"100vh",overflowY:"auto"},children:e.jsxs("div",{ref:c,className:d("flex flex-col",s&&"h-full","bg-[radial-gradient(ellipse_at_top_left,hsl(var(--opencx-primary)),transparent),radial-gradient(ellipse_at_top_right,hsl(var(--opencx-primary)),transparent)]"),children:[e.jsxs("div",{className:d("flex-1 flex flex-col px-4 py-12 text-start space-y-4 relative z-10","text-primary-foreground"),children:[s&&e.jsx(v,{className:"absolute top-6 end-6",children:e.jsx(S,{size:"selfless",onClick:()=>t(!1),children:e.jsx(m.XIcon,{className:"size-4"})})}),e.jsx("div",{className:"flex items-center justify-between w-full mb-2",children:(M=r.assets)!=null&&M.organizationLogo?e.jsx("img",{src:(O=r.assets)==null?void 0:O.organizationLogo,alt:"Company Logo",className:"h-8 w-auto object-contain"}):e.jsx("h2",{className:"font-bold text-sm",children:(W=i==null?void 0:i.data)==null?void 0:W.organizationName})}),e.jsxs("div",{className:"space-y-2",children:[e.jsx("h1",{className:"text-[1.75rem] font-semibold tracking-tight leading-none",children:((y=(P=r.textContent)==null?void 0:P.welcomeScreen)==null?void 0:y.title)||a("welcome-title")}),e.jsx("p",{className:"text-sm",children:((H=(z=r.textContent)==null?void 0:z.welcomeScreen)==null?void 0:H.description)||a("welcome-description")})]})]}),e.jsxs("div",{className:d("z-10 m-2 px-2 pt-2 bp-0 space-y-2","bg-[white]","border shadow","rounded-3xl"),children:[e.jsxs("form",{onSubmit:I,className:"space-y-2",children:[e.jsx(Q,{value:p,onChange:_=>f(_.target.value),required:!0,placeholder:a("your-name"),name:"name"}),e.jsx(Q,{required:!0,value:j,onChange:_=>k(_.target.value),type:"email",placeholder:a("your-email"),name:"email"}),b.map(_=>e.jsx(Q,{value:h[_],onChange:q=>u(Z=>({...Z,[_]:q.target.value})),placeholder:`${_} (${a("optional")})`},_)),e.jsxs(S,{disabled:x.loading,className:"w-full",size:"lg",children:[x.loading?a("starting-chat"):a("start-chat"),e.jsx(m.SendHorizontal,{className:"size-4 rtl:-scale-100"})]})]}),e.jsx(xt,{})]})]})})}function vt(){l.usePreludeData();const{routerState:{screen:t}}=l.useWidgetRouter();return e.jsxs(e.Fragment,{children:[e.jsx(se.Container,{}),e.jsx("div",{className:"relative bg-background size-full",children:e.jsx(N.AnimatePresence,{mode:"wait",children:(()=>{switch(t){case"welcome":return e.jsx(v,{fadeIn:"right",className:"size-full",snapExit:!0,children:e.jsx(Ds,{})},t);case"sessions":return e.jsx(v,{fadeIn:"right",className:"size-full",snapExit:!0,children:e.jsx(Is,{})},t);case"chat":return e.jsx(v,{fadeIn:"right",className:"size-full",snapExit:!0,children:e.jsx(zs,{})},t);default:return D.isExhaustive(t,vt.name),null}})()})})]})}const Rs=`<!DOCTYPE html>
|
|
17
|
+
)`)};return{theme:f,computed:j,cssVars:Ut({palette:f.palette,primary:f.primaryColor})}}function Ut({palette:t,primary:o}){const s=pt(t),r=Ue(o).toHsl(),n=Ue(o).isLight()?s[950]:s[50];return{"--opencx-primary":`${r.h} ${r.s*100}% ${r.l*100}%`,"--opencx-primary-foreground":n,"--opencx-background":s[100],"--opencx-foreground":s[950],"--opencx-destructive":"0 72.2% 50.6%","--opencx-destructive-foreground":s[50],"--opencx-accent":s[200],"--opencx-accent-foreground":"var(--opencx-foreground)","--opencx-secondary":s[200],"--opencx-secondary-foreground":"var(--opencx-foreground)","--opencx-muted":s[200],"--opencx-muted-foreground":s[500],"--opencx-input":s[300],"--opencx-border":s[300],"--opencx-ring":"var(--opencx-foreground)"}}function pt(t){const o={50:"0 0% 98%",100:"0 0% 96.1%",200:"0 0% 89.8%",300:"0 0% 83.1%",400:"0 0% 63.9%",500:"0 0% 45.1%",600:"0 0% 32.2%",700:"0 0% 25.1%",800:"0 0% 14.9%",900:"0 0% 9%",950:"0 0% 3.9%"},s={50:"60 9.1% 97.8%",100:"60 4.8% 95.9%",200:"20 5.9% 90%",300:"24 5.7% 82.9%",400:"24 5.4% 63.9%",500:"25 5.3% 44.7%",600:"33.3 5.5% 32.4%",700:"30 6.3% 25.1%",800:"12 6.5% 15.1%",900:"24 9.8% 10%",950:"20 14.3% 4.1%"},r={50:"0 0% 98%",100:"240 4.8% 95.9%",200:"240 5.9% 90%",300:"240 4.9% 83.9%",400:"240 5% 64.9%",500:"240 3.8% 46.1%",600:"240 5.2% 33.9%",700:"240 5.3% 26.1%",800:"240 3.7% 15.9%",900:"240 5.9% 10%",950:"240 10% 3.9%"},n={50:"210 40% 98%",100:"210 40% 96.1%",200:"214.3 31.8% 91.4%",300:"212.7 26.8% 83.9%",400:"215 20.2% 65.1%",500:"215.4 16.3% 46.9%",600:"215.3 19.3% 34.5%",700:"215.3 25% 26.7%",800:"217.2 32.6% 17.5%",900:"222.2 47.4% 11.2%",950:"222.2 84% 4.9%"};switch(t){case"neutral":return o;case"stone":return s;case"zinc":return r;case"slate":return n;default:return D.isExhaustive(t,pt.name),o}}function ht(){const{contentIframeRef:t}=l.useWidget(),{inline:o}=l.useConfig();return{setWidth:s=>{var r;(r=t==null?void 0:t.current)==null||r.style.setProperty("--opencx-widget-width",o?"100%":s)},setHeight:s=>{var r;(r=t==null?void 0:t.current)==null||r.style.setProperty("--opencx-widget-height",o?"100%":s)}}}function ge({width:t,height:o}){const{isSmallScreen:s}=F(),{setWidth:r,setHeight:n}=ht();w.useEffect(()=>{t&&r(t),o&&n(o)},[s,o,t,r,n])}const Ke=m.CircleDashedIcon;function V({name:t,className:o}){const s=(()=>{switch(t){case"Check":return m.CheckIcon;case"CheckCheck":return m.CheckCheckIcon;case"CircleCheck":return m.CircleCheckIcon;case"CircleCheckBig":return m.CircleCheckBigIcon;case"CircleX":return m.CircleXIcon;case"Expand":return m.ExpandIcon;case"Maximize":return m.MaximizeIcon;case"Maximize2":return m.Maximize2Icon;case"Minimize":return m.MinimizeIcon;case"Minimize2":return m.Minimize2Icon;case"Shrink":return m.ShrinkIcon;case"SquareCheck":return m.SquareCheckIcon;case"SquareCheckBig":return m.SquareCheckBigIcon;case"SquareX":return m.SquareXIcon;case"X":return m.XIcon;case void 0:return Ke;default:return D.isExhaustive(t,V.name),Ke}})();return e.jsx(s,{className:d("size-4",o)})}function mt({className:t,...o}){return e.jsx("div",{className:d("animate-pulse rounded-md bg-secondary",t),...o})}function we(){var n;const{data:t}=l.usePreludeData(),{routerState:{screen:o}}=l.useWidgetRouter(),{textContent:s}=l.useConfig();return(()=>{var a,i;switch(o){case"chat":return(a=s==null?void 0:s.chatScreen)==null?void 0:a.headerTitle;case"sessions":return(i=s==null?void 0:s.sessionsScreen)==null?void 0:i.headerTitle;case"welcome":return;default:D.isExhaustive(o,we.name);return}})()??((n=t==null?void 0:t.data)==null?void 0:n.organizationName)??"Chat"}function Vt(t){switch(t){case"chat":return g("chat/header");case"sessions":return g("sessions/header");case"welcome":return;default:D.isExhaustive(t,we.name);return}}function Kt(){const{router:t}=l.useConfig(),{routerState:{screen:o},toSessionsScreen:s}=l.useWidgetRouter();return o!=="chat"||t!=null&&t.chatScreenOnly?null:e.jsx(S,{variant:"ghost",size:"fit",className:"rounded-full",onClick:s,children:e.jsx(m.ChevronLeftIcon,{className:"size-4 rtl:-scale-100"})})}function Gt({button:t}){const{setIsOpen:o}=l.useWidgetTrigger(),{isSmallScreen:s}=F();if(s&&t.hideOnSmallScreen||!s&&t.hideOnLargeScreen)return null;const r=()=>{if(t.handleClick)return t.handleClick();o(!1)};return e.jsx(S,{variant:"ghost",size:"fit",className:"rounded-full",onClick:r,children:e.jsx(V,{name:t.icon})})}function ie({button:t}){const[o,s]=w.useState(!1),{routerState:{screen:r}}=l.useWidgetRouter(),{isSmallScreen:n}=F(),{theme:a}=L(),{setWidth:i,setHeight:c}=ht();if(r!=="chat"&&r!=="sessions")return null;const p=(()=>{switch(r){case"chat":return a.screens.chat.height;case"sessions":return a.screens.sessions.height;default:return D.isExhaustive(r,ie.name),a.screens.chat.height}})(),f=(()=>{switch(r){case"chat":return a.screens.chat.width;case"sessions":return a.screens.sessions.width;default:return D.isExhaustive(r,ie.name),a.screens.chat.width}})(),j=()=>{s(k=>{const b=!k;return c(b?"100vh":p),i(b?`max(40vw, ${f})`:f),b})};return n&&t.hideOnSmallScreen||!n&&t.hideOnLargeScreen?null:e.jsx(S,{variant:"ghost",size:"fit",className:"rounded-full",onClick:j,children:e.jsx(V,{name:t.icon||(o?t.shrinkIcon:t.expandIcon)})})}function ut({button:t}){var I,C;const[o,s]=w.useState(!1),{widgetCtx:r}=l.useWidget(),{setIsOpen:n}=l.useWidgetTrigger(),{resolveSession:a,sessionState:i}=l.useSessions(),{isSmallScreen:c}=F(),p=!i.session,f=((I=i.session)==null?void 0:I.isOpened)===!1,j=t.onResolved||"stay-in-chat",k=t.behaviorBeforeSessionCreation||"disabled",b=t.behaviorIfSessionIsResolved||"disabled",h=!!(i.isResolvingSession||p&&k==="disabled"||f&&b==="disabled"),u=async()=>{const{success:T,error:M}=await a();if(s(!1),!T)return console.error(M);switch(j){case"stay-in-chat":return;case"close-widget":n(!1);break;case"reset-chat":r.resetChat();break;case"reset-chat-and-close-widget":n(!1),r.resetChat();break;default:D.isExhaustive(j,ut.name);break}},x=()=>{if(p)switch(k){case"disabled":return;case"close-widget":n(!1);break;default:D.isExhaustive(k,x.name)}if(f)switch(b){case"disabled":return;case"close-widget":n(!1);break;case"reset-chat":r.resetChat();break;case"reset-chat-and-close-widget":n(!1),r.resetChat();break;default:D.isExhaustive(b,x.name)}};return c&&t.hideOnSmallScreen||!c&&t.hideOnLargeScreen?null:((C=t.confirmation)==null?void 0:C.type)==="modal"&&!f&&!p?e.jsxs(et,{open:o,onOpenChange:s,children:[e.jsx(tt,{asChild:!0,children:e.jsx(S,{variant:"ghost",size:"fit",className:"rounded-full",disabled:h,children:e.jsx(V,{name:t.icon})})}),e.jsxs(de,{children:[e.jsx(ot,{children:e.jsx(pe,{children:t.confirmation.title||"Close conversation"})}),e.jsx(rt,{children:e.jsx(at,{children:t.confirmation.description||"Are you sure you want to close this conversation?"})}),e.jsxs(nt,{children:[e.jsx(S,{variant:"secondary",onClick:()=>s(!1),disabled:i.isResolvingSession,children:t.confirmation.cancelButtonText||"No"}),e.jsx(S,{variant:"destructive",onClick:u,disabled:i.isResolvingSession,children:t.confirmation.confirmButtonText||"Yes"})]})]})]}):e.jsx(S,{variant:"ghost",size:"fit",className:"rounded-full",onClick:f||p?x:u,disabled:h,children:e.jsx(V,{name:t.icon})})}function le({button:t}){switch(t.functionality){case"close-widget":return e.jsx(Gt,{button:t});case"expand-shrink":return e.jsx(ie,{button:t});case"resolve-session":return e.jsx(ut,{button:t});default:return D.isExhaustive(t,le.name),null}}const Zt={functionality:"close-widget",hideOnLargeScreen:!0,icon:"X"};function Jt(){const{routerState:{screen:t}}=l.useWidgetRouter(),{headerButtons:o}=l.useConfig(),s=t==="chat"?o==null?void 0:o.chatScreen:t==="sessions"?o==null?void 0:o.sessionsScreen:[];return!s||s.length===0?e.jsx(le,{button:Zt}):e.jsx(e.Fragment,{children:s.map(r=>e.jsx(le,{button:r},`${r.functionality}-${r.icon}`))})}function gt(){const{routerState:{screen:t}}=l.useWidgetRouter(),{isLoading:o}=l.usePreludeData(),s=Vt(t),r=we();return e.jsx("header",{...s,className:"py-2 px-4 shrink-0",children:e.jsxs("div",{className:"flex items-center gap-2",children:[e.jsx(Kt,{}),e.jsx("div",{className:d("flex-1 h-8 flex items-center",t==="sessions"&&"ps-2"),children:e.jsx(N.AnimatePresence,{mode:"wait",children:o?e.jsx(v,{snapExit:!0,children:e.jsx(mt,{className:"h-5 w-1/2"})},"skeleton"):e.jsx(v,{children:e.jsx("h2",{className:"font-semibold",children:r})},"organization-name")})}),e.jsx(Jt,{})]})})}function wt({className:t}){return e.jsx(m.LoaderIcon,{className:d("size-4 animate-spin",t)})}function Qt(){const{messagesState:{isInitialFetchLoading:t}}=l.useMessages(),{isSmallScreen:o}=F(),{activeMode:s,Component:r}=l.useModes();return{isCanvasOpen:!t&&!o&&!!s&&!!r}}function es(){const{activeMode:t,Component:o}=l.useModes(),{sendMessage:s}=l.useMessages(),{createStateCheckpoint:r}=l.useSessions(),[n,a]=w.useState(!1),i=async c=>{try{a(!0),await s(c)}catch(p){console.error(p)}finally{a(!1)}};return!t||!o?null:e.jsx(o,{react:w,mode:t,createStateCheckpoint:r,sendMessage:i,isSendingMessage:n})}const ts={"write-a-message":"اكتب رسالة...","session-closed-lead":"تم حل مشكلتك!","new-conversation":"محادثة جديدة","welcome-title":"مرحبًا بك في دردشة الدعم الخاصة بنا","welcome-description":"نحن هنا للمساعدة! ابدأ محادثة وسنرد عليك في أقرب وقت ممكن.","your-name":"اسمك","your-email":"عنوان بريدك الإلكتروني","start-chat":"تحدث إلى الدعم","starting-chat":"جاري الاتصال...","i-need-more-help":"أحتاج المزيد من المساعدة","this-was-helpful":"كان هذا مفيدًا",optional:"اختياري","no-conversations-yet":"لا يوجد محادثات","back-to-conversations":"العودة إلى المحادثات","closed-conversations":"المحادثات المغلقة"},ss={"write-a-message":"Nachricht schreiben...","session-closed-lead":"Ihr Problem wurde gelöst!","new-conversation":"Neue Konversation","welcome-title":"Willkommen in unserem Support-Chat","welcome-description":"Wir sind hier, um zu helfen! Beginnen Sie ein Gesprách und wir werden so schnell wie mogelijk antworten.","your-name":"Ihr Name","your-email":"Ihre E-Mail-Adresse","start-chat":"Mit dem Support sprechen","starting-chat":"Verbindung wird hergestellt...","i-need-more-help":"Ich brauche weitere Hilfe","this-was-helpful":"Dies war hilfreich",optional:"Optional","no-conversations-yet":"noch keine Gespräche","back-to-conversations":"Zurück zur Konversationen","closed-conversations":"Geschlossene Konversationen"},os={"write-a-message":"Write a message...","session-closed-lead":"Your issue has been resolved!","new-conversation":"New conversation","welcome-title":"Welcome to our support chat","welcome-description":"We're here to help! Start a conversation and we'll get back to you as soon as possible.","your-name":"Your name","your-email":"Your email address","start-chat":"Talk to support","starting-chat":"Connecting...","i-need-more-help":"I need more help","this-was-helpful":"This was helpful",optional:"Optional","no-conversations-yet":"No conversations yet","back-to-conversations":"Back to conversations","closed-conversations":"Closed conversations"},rs={"write-a-message":"Écrivez un message...","session-closed-lead":"Votre problème a été résolu !","new-conversation":"Nouvelle conversation","welcome-title":"Bienvenue dans notre chat de support","welcome-description":"Nous sommes là pour vous aider ! Commencez une conversation et nous vous répondrons dès que possible.","your-name":"Votre nom","your-email":"Votre adresse e-mail","start-chat":"Parler au support","starting-chat":"Connexion...","i-need-more-help":"Je besoin d'aide plus","this-was-helpful":"C'était utile",optional:"Optionnel","no-conversations-yet":"Aucune conversation pour le moment","back-to-conversations":"Retour aux conversations","closed-conversations":"Conversations fermées"},ns={"write-a-message":"Schrijf een bericht...","session-closed-lead":"Uw probleem is opgelost!","new-conversation":"Nieuw gesprek","welcome-title":"Welkom bij onze supportchat","welcome-description":"We zijn hier om te helpen! Begin een gesprek en we nemen zo snel mogelijk contact met u op.","your-name":"Uw naam","your-email":"Uw e-mailadres","start-chat":"Praat met ondersteuning","starting-chat":"Verbinding maken...","i-need-more-help":"Ik heb nog meer hulp nodig","this-was-helpful":"Mijn vraag is opgelost",optional:"Optioneel","no-conversations-yet":"Nog geen gesprekken","back-to-conversations":"Terug naar gesprekken","closed-conversations":"Afgesloten gesprekken"},as={"write-a-message":"Escreva uma mensagem...","session-closed-lead":"Seu problema foi resolvido!","new-conversation":"Nova conversa","welcome-title":"Bem-vindo ao nosso chat de suporte","welcome-description":"Estamos aqui para ajudar! Inicie uma conversa e responderemos o mais rápido possível.","your-name":"Seu nome","your-email":"Seu endereço de email","start-chat":"Falar com o suporte","starting-chat":"Conectando...","i-need-more-help":"preciso de mais ajuda","this-was-helpful":"Isso foi útil",optional:"Opcional","no-conversations-yet":"Nenhuma conversa ainda","back-to-conversations":"Voltar para conversas","closed-conversations":"Conversas fechadas"},is={"write-a-message":"Escribe un mensaje...","session-closed-lead":"¡Tu problema fue resuelto!","new-conversation":"Nueva conversación","welcome-title":"Bienvenido a nuestro chat de soporte","welcome-description":"¡Estamos aquí para ayudarte! Inicia una conversación y responderemos lo antes posible.","your-name":"Tu nombre","your-email":"Tu correo electrónico","start-chat":"Hablar con soporte","starting-chat":"Conectando...","i-need-more-help":"Necesito más ayuda","this-was-helpful":"Esto fue útil",optional:"Opcional","no-conversations-yet":"Sin conversaciones aún","back-to-conversations":"Volver a conversaciones","closed-conversations":"Conversaciones cerradas"},ls={"write-a-message":"Bir mesaj yazın...","session-closed-lead":"Sorununuz çözüldü!","new-conversation":"Yeni konuşma","welcome-title":"Destek sohbetimize hoş geldiniz","welcome-description":"Yardım etmek için buradayız! Bir konuşma başlatın, en kısa sürede size geri döneceğiz.","your-name":"Adınız","your-email":"E-posta adresiniz","start-chat":"Destekle konuş","starting-chat":"Bağlanıyor...","i-need-more-help":"Daha fazla yardıma ihtiyacım var","this-was-helpful":"Bu yardımcı oldu",optional:"İsteğe bağlı","no-conversations-yet":"Henüz konuşma yok","back-to-conversations":"Konuşmalara geri dön","closed-conversations":"Kapatılan konuşmalar"},ft={en:os,ar:ts,nl:ns,fr:rs,de:ss,pt:as,es:is,tr:ls},cs=Object.keys(ft);function ds(t){return cs.includes(t)}function ps(t,o){const s=ft[o];return s&&s[t]||""}function X(){const{dir:t}=l.useDocumentDir(),o=l.useConfig();return w.useMemo(()=>{const s=ds(o.language)?o.language:"en";return{t:r=>ps(r,s),language:s,dir:s==="ar"?"rtl":"ltr",hostDocumentDir:t}},[o.language,t])}function fe({suggestion:t,className:o,...s}){const{sendMessage:r}=l.useMessages(),n=()=>{const a=t.trim();a&&r({content:a})};return e.jsx(S,{...g("chat/suggested_reply_btn"),size:"sm",className:d("rounded-xl w-fit",o),...s,onClick:n,children:t})}function hs(){const{t}=X(),o=[t("i-need-more-help"),t("this-was-helpful")];return e.jsx("div",{...g("chat/might_solve_user_issue_suggested_replies_container"),className:"flex items-center gap-2 p-2 pb-0 flex-wrap",children:o.map(s=>e.jsx(fe,{suggestion:s,className:"flex-1"},s))})}function ms({file:{status:t,file:o,error:s},onCancel:r}){const[n,a]=w.useState(null);w.useEffect(()=>{if(!o.type.startsWith("image/"))return;const p=new FileReader;return p.onload=()=>a(p.result),p.onerror=()=>console.error("Error reading file"),p.readAsDataURL(o),()=>p.abort()},[o]);const i=()=>{switch(t){case"uploading":return e.jsx(m.Loader2,{className:"size-4 animate-spin"});case"error":return e.jsx(m.AlertCircle,{className:"size-4 text-destructive"});default:return null}},c=()=>{const p=o.type.split("/")[0];return p==="image"&&n?e.jsx("img",{src:typeof n=="string"?n:"",className:"object-cover bg-secondary size-full",alt:o.name}):p==="audio"?e.jsx(m.FileAudio2Icon,{}):p==="video"?e.jsx(m.FileVideo2Icon,{}):e.jsx(m.FileIcon,{})};return e.jsx(U,{side:"bottom",content:t==="error"?e.jsxs("span",{className:"text-destructive",children:["Failed to upload: ",s]}):o.name,children:e.jsxs("div",{className:d(t==="uploading"&&"opacity-50","group","size-12 border rounded-2xl overflow-hidden relative","flex items-center justify-center shrink-0"),children:[e.jsx("div",{className:"absolute inset-0 flex items-center justify-center",children:i()}),e.jsx("button",{type:"button",className:d("absolute bg-black/50 inset-0 size-full z-10 opacity-0","flex items-center justify-center","opacity-0 group-hover:opacity-100 transition"),onClick:r,children:e.jsx(m.XIcon,{className:"size-4 text-primary-foreground"})}),e.jsx(c,{})]})})}function us(){var P;const{isSmallScreen:t}=F(),o=w.useRef(null),{sendMessage:s}=l.useMessages(),{sessionState:r}=l.useSessions(),{t:n}=X(),[a,i]=w.useState(""),{allFiles:c,emptyTheFiles:p,handleCancelUpload:f,appendFiles:j,isUploading:k,successFiles:b}=l.useUploadFiles(),h=!!((P=r.session)!=null&&P.isHandedOff),{isAwaitingBotReply:u}=l.useIsAwaitingBotReply(),x=y=>{j(y)},I=!a.trim()&&b.length===0,C=async()=>{if(u||I)return;k&&console.info("please wait for the file(s) to upload");const y=a.trim();s({content:y,attachments:b.flatMap(z=>z.fileUrl?[{url:z.fileUrl,type:z.file.type,name:z.file.name,id:z.id,size:z.file.size}]:[])}),i(""),p()},{getRootProps:T,getInputProps:M,open:O}=Mt.useDropzone({onDrop:x,noClick:!0,onDropRejected(){console.error("unsupported file type, or the file is too large")},maxSize:5*1024*1024,accept:h?{"text/*":[".txt"],"image/*":[".png",".jpg",".jpeg",".gif"],"application/pdf":[".pdf"]}:{"image/png":[".png"],"image/jpeg":[".jpg",".jpeg"],"image/gif":[".gif"],"image/webp":[".webp"]}}),W=y=>{const z=y.clipboardData;z&&z.files.length>0&&x(Array.from(z.files))};return e.jsxs("div",{...g("chat/input_box/root"),className:"p-2 relative space-y-1",...T(),children:[e.jsx("input",{...M()}),e.jsxs("div",{...g("chat/input_box/inner_root"),className:d("transition-all","bg-white","relative rounded-3xl flex flex-col gap-2 p-2","hover:border-primary focus-within:border-primary"),children:[e.jsxs("div",{...g("chat/input_box/textarea_and_attachments_container"),className:"flex flex-col gap-2",children:[c.length>0&&e.jsx("div",{...g("chat/input_box/attachments_container"),className:"flex items-center gap-1",children:e.jsx(N.AnimatePresence,{mode:"popLayout",children:c.map(y=>e.jsx(v,{snapExit:!0,children:e.jsx(ms,{onCancel:()=>f(y.id),file:y})},y.id))})}),e.jsx("textarea",{...g("chat/input_box/textarea"),onPaste:W,ref:o,id:"chat-input",value:a,rows:3,className:d("max-h-16 [field-sizing:content]","w-full resize-none px-2",c.length===0&&"pt-1","bg-transparent outline-none","placeholder:text-muted-foreground",t?"text-[16px]":"text-sm"),onChange:y=>i(y.target.value),onKeyDown:async y=>{y.key==="Enter"&&!y.shiftKey&&(y.preventDefault(),C())},placeholder:n("write-a-message")})]}),e.jsxs("div",{className:"gap-2 flex justify-between",children:[e.jsx(U,{side:"top",align:"start",content:"attach files, (maximum size 5mb)",children:e.jsx(S,{onClick:O,size:"fit",variant:"ghost",className:d("rounded-full size-8 flex items-center justify-center p-0 overflow-hidden"),children:e.jsx(N.AnimatePresence,{mode:"wait",children:h?e.jsx(v,{children:e.jsx(m.PaperclipIcon,{className:"size-4"})},"paper-clip"):e.jsx(v,{children:e.jsx(m.ImageIcon,{className:"size-4"})},"image-icon")})})}),e.jsx(U,{content:"send message",side:"top",align:"end",children:e.jsx(S,{size:"fit",onClick:C,disabled:u||k||I,className:"rounded-full size-8 flex items-center justify-center p-0",children:e.jsx(N.AnimatePresence,{mode:"wait",children:u||k?e.jsx(v,{snapExit:!0,children:e.jsx(m.CircleDashed,{className:"size-4 animate-spin animate-iteration-infinite"})},"loading"):e.jsx(v,{snapExit:!0,children:e.jsx(m.ArrowUpIcon,{className:"size-4"})},"send")})})})]})]})]})}function gs(){const{widgetCtx:t}=l.useWidget(),{router:o}=l.useConfig(),{canCreateNewSession:s}=l.useSessions(),{toSessionsScreen:r}=l.useWidgetRouter(),{t:n}=X();return e.jsx("div",{className:"p-2",children:e.jsxs("div",{className:"p-2 bg-muted rounded-3xl space-y-2",children:[e.jsxs("div",{className:"ps-2 flex items-center gap-1",children:[e.jsx(m.CircleCheckIcon,{className:"size-4 text-emerald-600"}),e.jsx("h2",{className:"text-sm font-medium",children:n("session-closed-lead")})]}),e.jsx("div",{children:s||o!=null&&o.chatScreenOnly?e.jsx(S,{onClick:t.resetChat,className:"rounded-2xl w-full",children:n("new-conversation")}):e.jsx(S,{onClick:r,className:"rounded-2xl w-full",children:n("back-to-conversations")})})]})})}function ws(){var i;const{initialQuestions:t,initialQuestionsPosition:o,thisWasHelpfulOrNot:s}=l.useConfig(),{sessionState:r}=l.useSessions(),{messagesState:n}=l.useMessages(),a=n.messages.length===0;return e.jsx("footer",{children:e.jsx("div",{children:e.jsx(N.AnimatePresence,{mode:"wait",children:r.session&&!((i=r.session)!=null&&i.isOpened)?e.jsx(v,{className:"overflow-hidden",overrides:{initial:{height:0},animate:{height:"auto"},exit:{height:0}},children:e.jsx(gs,{})},"session-closed"):e.jsxs(v,{className:"overflow-hidden",overrides:{initial:{height:0},animate:{height:"auto"},exit:{height:0}},children:[n.lastAIResMightSolveUserIssue&&(s==null?void 0:s.enabled)!==!1&&e.jsx(hs,{}),a&&t&&o!=="below-initial-messages"&&e.jsx("div",{className:"flex items-center flex-row justify-end gap-2 flex-wrap px-2",children:t==null?void 0:t.map((c,p)=>e.jsx(fe,{suggestion:c},`${c}-${p}`))}),e.jsx(us,{})]},"chat-input")})})})}function fs({isFirstInGroup:t,isLastInGroup:o,isAloneInGroup:s,...r}){const{componentStore:n}=l.useWidget();if(r.data.action){const i=n.getComponent(r.data.action.name);if(i)return e.jsx(i,{...r,id:r.id,isFirstInGroup:t,isLastInGroup:o,isAloneInGroup:s})}const a=n.getComponent(r.component);return a?e.jsx(a,{...r,id:r.id,isFirstInGroup:t,isLastInGroup:o,isAloneInGroup:s}):e.jsx(ee,{...r,isFirstInGroup:t,isLastInGroup:o,isAloneInGroup:s})}function ne({messages:t,agent:o,suggestedReplies:s}){return e.jsxs("div",{...g("chat/agent_msg_group/root"),className:d("flex items-end gap-2"),children:[e.jsx(U,{content:o==null?void 0:o.name,side:"right",align:"end",children:e.jsx(ae,{...g("chat/agent_msg_group/root/avatar"),agent:o,className:"hidden"})}),e.jsxs("div",{className:d("flex-1 flex flex-col gap-2"),children:[e.jsxs("div",{...g("chat/agent_msg_group/avatar_and_msgs/root"),className:d("flex items-end gap-2"),children:[e.jsx(U,{content:o==null?void 0:o.name,side:"right",align:"end",children:e.jsx(ae,{...g("chat/agent_msg_group/avatar_and_msgs/avatar"),agent:o})}),e.jsx("div",{...g("chat/agent_msg_group/avatar_and_msgs/msgs"),className:d("flex-1 flex flex-col gap-1"),children:t.map((r,n,a)=>e.jsx(fs,{isFirstInGroup:n===0,isLastInGroup:n===a.length-1,isAloneInGroup:a.length===1,...r},r.id))})]}),s&&s.length>0&&e.jsx("div",{...g("chat/agent_msg_group/suggestions"),className:d("flex flex-col gap-1 ps-8"),children:s==null?void 0:s.map((r,n)=>e.jsx(fe,{suggestion:r},`${r}-${n}`))})]})]})}function xs({message:t,isFirstInGroup:o,isLastInGroup:s,isAloneInGroup:r}){var n;return e.jsxs("div",{...g("chat/user_msg/root"),className:"w-5/6 flex flex-col items-end gap-1",children:[t.attachments&&t.attachments.length>0&&e.jsx("div",{className:"w-full flex gap-1 flex-wrap justify-end",children:(n=t.attachments)==null?void 0:n.map(a=>e.jsx(it,{attachment:a},a.id))}),t.content.length>0&&e.jsx("div",{...g("chat/user_msg/msg"),"data-first":o,"data-last":s,"data-alone":r,className:d("transition-all","w-fit py-3 px-4 rounded-3xl text-sm","bg-primary text-primary-foreground","break-words [word-break:break-word]","whitespace-pre-wrap",o&&!r&&"rounded-br-md",s&&!r&&"rounded-tr-md",!o&&!s&&!r&&"rounded-r-md"),children:t.content})]})}function vs({messages:t}){return e.jsx("div",{...g("chat/user_msg_group/root"),className:d("group","flex flex-col gap-1 justify-end items-end"),children:t.map((o,s,r)=>e.jsx(xs,{message:o,isFirstInGroup:s===0,isLastInGroup:s===r.length-1,isAloneInGroup:r.length===1},o.id))})}function bs(t){const o=[];let s=null;return t.forEach(r=>{var n,a,i,c;(!s||((n=s[0])==null?void 0:n.type)!==r.type)&&(s=[],o.push(s)),((a=s[0])==null?void 0:a.type)==="FROM_AGENT"&&r.type==="FROM_AGENT"&&((i=r.agent)==null?void 0:i.id)!==((c=s[0].agent)==null?void 0:c.id)&&(s=[],o.push(s)),s.push(r)}),o}function ys(t){var o;return((o=t==null?void 0:t[0])==null?void 0:o.type)==="FROM_USER"}function js(t){var o;return((o=t==null?void 0:t[0])==null?void 0:o.type)==="FROM_BOT"}function ks(t){var o;return((o=t==null?void 0:t[0])==null?void 0:o.type)==="FROM_AGENT"}function Cs(){const{messagesState:{messages:t}}=l.useMessages(),{isAwaitingBotReply:o}=l.useIsAwaitingBotReply(),{componentStore:s}=l.useWidget(),r=l.useConfig(),{initialQuestions:n,initialQuestionsPosition:a}=r,i=w.useMemo(()=>bs(t),[t]),c=r.persistentInitialMessages||[],p=(()=>{var h;return t.length?((h=r.advancedInitialMessages)==null?void 0:h.filter(u=>!!u.persistent))||[]:r.advancedInitialMessages||[]})(),f=(()=>{var h;return p.length?[]:t.length?[]:(h=r.initialMessages)!=null&&h.length?r.initialMessages:["Hello, how can I help you?"]})(),j=s.getComponent("loading"),k=w.useRef(null);function b(){setTimeout(()=>{const h=k.current;h&&(h.scrollTop=h.scrollHeight)},0)}return w.useEffect(()=>{b()},[t]),e.jsxs("div",{...g("chat/msgs/root"),ref:k,className:"max-h-full scroll-smooth relative flex-1 py-2 px-4 flex flex-col gap-2 overflow-auto",children:[e.jsx("div",{...g("chat/persistent_initial_msgs/root"),children:c.map((h,u,x)=>e.jsx(ee,{component:"bot_message",data:{message:h},id:h,type:"FROM_BOT",timestamp:Date.now().toString(),dataComponentNames:{messageContainer:"chat/persistent_initial_msg/root",message:"chat/persistent_initial_msg/msg"},classNames:{messageContainer:d("w-full flex flex-col items-center text-center"),message:"w-full bg-transparent border-none shadow-none text-xs"},isFirstInGroup:u===0,isLastInGroup:u===x.length-1,isAloneInGroup:x.length===1},`${h}-${u}`))}),p.length>0&&e.jsx(ne,{messages:p.map(({message:h},u)=>({component:"bot_message",data:{message:h},id:`${u}-${h}`,type:"FROM_BOT",timestamp:Date.now().toString()})),suggestedReplies:t.length===0&&a==="below-initial-messages"?n:void 0,agent:r.bot?{...r.bot,isAi:!0,id:null}:void 0}),t.length===0&&f.length>0&&e.jsx(ne,{messages:f.map((h,u)=>({component:"bot_message",data:{message:h},id:`${u}-${h}`,type:"FROM_BOT",timestamp:Date.now().toString()})),suggestedReplies:a==="below-initial-messages"?n:void 0,agent:r.bot?{...r.bot,isAi:!0,id:null}:void 0}),i.map(h=>{var I,C,T;const u=(I=h==null?void 0:h[0])==null?void 0:I.type,x=(C=h[0])==null?void 0:C.id;if(!u||!x)return null;if(ys(h))return e.jsx(vs,{messages:h},x);if(js(h)||ks(h)){const M=(T=h[0])==null?void 0:T.agent;return e.jsx(ne,{messages:h,agent:M},x)}return null}),o&&j&&e.jsx(j,{agent:r.bot})]})}function zs(){const{messagesState:{isInitialFetchLoading:t}}=l.useMessages(),{sessionState:{session:o}}=l.useSessions(),{isCanvasOpen:s}=Qt(),{theme:r}=L();ge({width:s?r.screens.chat.withCanvas.width:r.screens.chat.width,height:s?r.screens.chat.withCanvas.height:r.screens.chat.height});const n=w.useRef((o==null?void 0:o.id)||"chat").current;return e.jsx("div",{...g("chat/root"),className:d("flex flex-col overflow-hidden"),style:{width:"100vw",maxWidth:"100vw",height:"100vh",maxHeight:"100vh"},children:e.jsxs("div",{className:"size-full justify-between flex flex-col",children:[e.jsx(gt,{}),e.jsx(N.AnimatePresence,{mode:"wait",children:t?e.jsx(v,{className:"flex flex-col items-center justify-center w-full flex-1",children:e.jsx(wt,{})},"loading"):e.jsxs(v,{className:"flex items-start h-full flex-1 overflow-auto",snapExit:!0,children:[e.jsxs("div",{...g("chat/main/root"),className:d("flex flex-col h-full overflow-auto transition-all",s?"w-2/5":"w-full"),style:{transitionTimingFunction:r.screens.chat.withCanvas.transitionTimingFunction,transitionDuration:r.screens.chat.withCanvas.transitionDuration},children:[e.jsx(Cs,{}),e.jsx(ws,{})]}),e.jsx("div",{...g("chat/canvas/root"),className:d("h-full overflow-auto transition-all",s?"w-3/5":"w-0"),style:{transitionTimingFunction:r.screens.chat.withCanvas.transitionTimingFunction,transitionDuration:r.screens.chat.withCanvas.transitionDuration},children:e.jsx(es,{})})]},n)})]})})}function Ns({className:t}){return e.jsx("svg",{width:"26",height:"32",viewBox:"0 0 26 32",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:d("text-primary-foreground",t),children:e.jsx("path",{d:"M1.34103 25.6132H5.44245C5.74203 25.6228 6.02673 25.7462 6.23867 25.9582C6.45062 26.1703 6.5739 26.4551 6.58348 26.7548V30.8584C6.59305 31.1581 6.71634 31.443 6.92828 31.655C7.14023 31.8671 7.42492 31.9904 7.7245 32H18.2894C18.589 31.9904 18.8737 31.8671 19.0856 31.655C19.2976 31.443 19.4209 31.1581 19.4304 30.8584V26.7548C19.4401 26.4545 19.5638 26.1692 19.7765 25.957C19.9892 25.7449 20.2748 25.6219 20.5749 25.6132H24.659C24.9586 25.6036 25.2433 25.4803 25.4552 25.2682C25.6671 25.0562 25.7904 24.7713 25.8 24.4716V7.52839C25.7904 7.22865 25.6671 6.94381 25.4552 6.73176C25.2433 6.5197 24.9586 6.39635 24.659 6.38677H20.561C20.2603 6.37802 19.9742 6.25457 19.7614 6.04169C19.5487 5.82881 19.4253 5.54261 19.4165 5.24168V1.14161C19.4072 0.84419 19.2858 0.561291 19.0768 0.349589C18.8678 0.137887 18.5865 0.0130193 18.2894 0L7.7245 0C7.42492 0.00957792 7.14023 0.132929 6.92828 0.344983C6.71634 0.557036 6.59305 0.841878 6.58348 1.14161V5.24168C6.57477 5.54203 6.45187 5.82773 6.23983 6.04052C6.0278 6.25331 5.74262 6.37715 5.44245 6.38677H1.34103C1.04144 6.39635 0.756749 6.5197 0.544805 6.73176C0.332861 6.94381 0.209574 7.22865 0.200001 7.52839V24.4716C0.209574 24.7713 0.332861 25.0562 0.544805 25.2682C0.756749 25.4803 1.04144 25.6036 1.34103 25.6132ZM6.58348 24.4716V7.52839C6.59305 7.22865 6.71634 6.94381 6.92828 6.73176C7.14023 6.5197 7.42492 6.39635 7.7245 6.38677H18.2894C18.589 6.39635 18.8737 6.5197 19.0856 6.73176C19.2976 6.94381 19.4209 7.22865 19.4304 7.52839V24.4716C19.4209 24.7713 19.2976 25.0562 19.0856 25.2682C18.8737 25.4803 18.589 25.6036 18.2894 25.6132H7.7245C7.42492 25.6036 7.14023 25.4803 6.92828 25.2682C6.71634 25.0562 6.59305 24.7713 6.58348 24.4716Z",fill:"currentColor"})})}function xt({className:t}){const{token:o}=l.useConfig();return e.jsx("div",{className:d("flex items-center justify-center gap-2 p-2 pt-0",t),children:e.jsx(A,{children:e.jsxs("a",{href:`https://open.cx/?ref=${o}`,target:"_blank",rel:"noreferrer",className:d("text-[10px] flex items-center","text-muted-foreground/70 [&_svg]:text-muted-foreground/70","hover:text-primary [&_svg]:hover:text-primary"),children:[e.jsx("span",{children:"Powered by"}),e.jsx("span",{children:" "}),e.jsxs("span",{className:"flex items-center gap-[1px]",children:[e.jsx("span",{children:e.jsx(Ns,{className:"size-3 inline-block"})}),e.jsx("span",{className:"font-semibold",children:"open"})]})]})})})}function Ss({children:t}){return e.jsx("p",{className:"ps-4 text-xs text-muted-foreground/75 uppercase font-semibold tracking-tight",children:t})}function Ge({session:t,className:o}){const{bot:s}=l.useConfig(),{toChatScreen:r}=l.useWidgetRouter(),n=t.assignee.kind==="human"?t.assignee.name||"Support Agent":(s==null?void 0:s.name)||"AI Support Agent",a=t.assignee.kind==="human"?t.assignee.avatarUrl||"":(s==null?void 0:s.avatar)||"";return e.jsxs(S,{variant:"ghost",size:"lg",className:d("rounded-full p-2 pe-4 flex text-start justify-between w-full whitespace-normal",o),onClick:()=>r(t.id),children:[e.jsxs("div",{className:"flex-1 flex gap-2 items-center",children:[e.jsx(N.AnimatePresence,{mode:"wait",children:e.jsx(v,{snapExit:!0,children:e.jsxs(he,{className:"size-10",children:[e.jsx(me,{src:a,alt:"Agent Icon"}),e.jsx(ue,{children:e.jsx(m.UserRoundIcon,{className:"size-4"})})]})})}),e.jsxs("div",{className:"flex-1",children:[e.jsx(N.AnimatePresence,{mode:"wait",children:e.jsx(v,{snapExit:!0,children:n},n)}),e.jsx(N.AnimatePresence,{mode:"wait",children:t.lastMessage?e.jsx(v,{snapExit:!0,children:e.jsx(lt,{remarkPlugins:[Je],rehypePlugins:[Ze],className:"line-clamp-1 overflow-hidden text-ellipsis text-xs text-muted-foreground",children:t.lastMessage})},t.lastMessage||"content"):e.jsx(v,{className:"w-1/2",snapExit:!0,children:e.jsx(mt,{className:"h-4 w-full"})},"skeleton")})]})]}),e.jsx(m.ChevronRightIcon,{className:"size-4 text-muted-foreground shrink-0 rtl:-scale-100"})]})}function _s(){const{t}=X(),{toChatScreen:o}=l.useWidgetRouter(),{sessionsState:{data:s,isInitialFetchLoading:r},openSessions:n,closedSessions:a,canCreateNewSession:i}=l.useSessions();return e.jsx("div",{className:"flex-1 flex flex-col overflow-scroll py-2 px-2",children:e.jsx(N.AnimatePresence,{mode:"wait",children:r?e.jsx(v,{className:"flex-1 flex items-center justify-center",children:e.jsx(wt,{})},"loading"):e.jsx(v,{className:"flex-1 flex flex-col gap-2 relative",children:s.length?e.jsxs(e.Fragment,{children:[e.jsxs(N.AnimatePresence,{children:[n.length>0&&e.jsx(v,{fadeIn:"up",delay:.2,className:"space-y-2",snapExit:!0,children:n.map(c=>e.jsx(Ge,{session:c},c.id))},"open-sessions"),a.length>0&&e.jsxs(v,{className:"space-y-2",delay:.2,snapExit:!0,children:[e.jsx(Ss,{children:t("closed-conversations")}),a.map(c=>e.jsx(Ge,{session:c,className:"opacity-50 hover:opacity-100"},c.id))]},"closed-sessions")]}),i&&e.jsx("div",{className:"mt-auto w-full rounded-3xl sticky bottom-0 outline outline-8 outline-background bg-background",children:w.createElement(S,{...g("sessions/new_conversation_btn"),size:"lg",key:"new-session",className:"w-full",onClick:()=>o()},t("new-conversation"))})]}):e.jsxs("div",{className:"flex-1 flex flex-col gap-2 items-center",children:[e.jsx("div",{className:"flex-1 flex items-center justify-center",children:e.jsx("p",{className:"text-muted-foreground",children:t("no-conversations-yet")})}),w.createElement(S,{...g("sessions/new_conversation_btn"),size:"lg",key:"new-session",className:"w-full",onClick:()=>o()},t("new-conversation"))]})},"sessions")})})}function Is(){const{theme:t}=L();return ge({width:t.screens.sessions.width,height:t.screens.sessions.height}),e.jsx("div",{...g("sessions/root"),className:d("flex flex-col overflow-hidden bg-background"),style:{width:"100vw",maxWidth:"100vw",height:"100vh",maxHeight:"100vh"},children:e.jsxs("div",{className:"size-full flex flex-col",children:[e.jsx(gt,{}),e.jsx(_s,{}),e.jsx(xt,{})]})})}const Q=E.forwardRef(({className:t,type:o,...s},r)=>{const{isSmallScreen:n}=F();return e.jsx(A,{ref:r,children:e.jsx("input",{type:o,className:d(n?"text-[16px]":"text-sm","flex w-full rounded-xl p-2 ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-primary-foreground placeholder:text-muted-foreground/75 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 transition","rounded-2xl px-4","border shadow-sm",t),...s})})});Q.displayName="Input";function Ts(){const{contentIframeRef:t}=l.useWidget(),{inline:o}=l.useConfig(),s=w.useRef(null);return w.useEffect(()=>{const r=t==null?void 0:t.current;if(r&&s.current){const n=s.current;let a;const i=new ResizeObserver(()=>{a=requestAnimationFrame(()=>{const c=n.offsetHeight;r.style.setProperty("--opencx-widget-height",o?"100%":`${c.toFixed(1)}px`)})});return i.observe(n),()=>{cancelAnimationFrame(a),i.unobserve(n)}}},[t,o]),{observedElementRef:s}}const Ms=re.z.object({name:re.z.string().min(2),email:re.z.string().email()});function Ds(){var C,T,M,O,W,P,y,z,H;const{setIsOpen:t}=l.useWidgetTrigger(),{createUnverifiedContact:o}=l.useContact(),{isSmallScreen:s}=F(),r=l.useConfig(),{theme:n}=L(),{t:a}=X(),{data:i}=l.usePreludeData(),{observedElementRef:c}=Ts();ge({height:void 0,width:n.screens.welcome.width});const[p,f]=w.useState(((C=r.prefillUserData)==null?void 0:C.name)||""),[j,k]=w.useState(((T=r.prefillUserData)==null?void 0:T.email)||""),b=(r.extraDataCollectionFields||[]).filter(_=>_!=="name"&&_!=="email"&&!!_),[h,u]=w.useState({}),[x,I]=Dt(async _=>{_.preventDefault();const q=Ms.safeParse({name:p,email:j});q.success&&await o({email:q.data.email,non_verified_name:q.data.name},Object.values(h).filter(Boolean).length?h:void 0)},[p,j,h]);return e.jsx("div",{style:{width:"100vw",maxWidth:"100vw",minHeight:n.screens.welcome.minHeight,height:"100vh",maxHeight:"100vh",overflowY:"auto"},children:e.jsxs("div",{ref:c,className:d("flex flex-col",s&&"h-full","bg-[radial-gradient(ellipse_at_top_left,hsl(var(--opencx-primary)),transparent),radial-gradient(ellipse_at_top_right,hsl(var(--opencx-primary)),transparent)]"),children:[e.jsxs("div",{className:d("flex-1 flex flex-col px-4 py-12 text-start space-y-4 relative z-10","text-primary-foreground"),children:[s&&e.jsx(v,{className:"absolute top-6 end-6",children:e.jsx(S,{size:"selfless",onClick:()=>t(!1),children:e.jsx(m.XIcon,{className:"size-4"})})}),e.jsx("div",{className:"flex items-center justify-between w-full mb-2",children:(M=r.assets)!=null&&M.organizationLogo?e.jsx("img",{src:(O=r.assets)==null?void 0:O.organizationLogo,alt:"Company Logo",className:"h-8 w-auto object-contain"}):e.jsx("h2",{className:"font-bold text-sm",children:(W=i==null?void 0:i.data)==null?void 0:W.organizationName})}),e.jsxs("div",{className:"space-y-2",children:[e.jsx("h1",{className:"text-[1.75rem] font-semibold tracking-tight leading-none",children:((y=(P=r.textContent)==null?void 0:P.welcomeScreen)==null?void 0:y.title)||a("welcome-title")}),e.jsx("p",{className:"text-sm",children:((H=(z=r.textContent)==null?void 0:z.welcomeScreen)==null?void 0:H.description)||a("welcome-description")})]})]}),e.jsxs("div",{className:d("z-10 m-2 px-2 pt-2 bp-0 space-y-2","bg-[white]","border shadow","rounded-3xl"),children:[e.jsxs("form",{onSubmit:I,className:"space-y-2",children:[e.jsx(Q,{value:p,onChange:_=>f(_.target.value),required:!0,placeholder:a("your-name"),name:"name"}),e.jsx(Q,{required:!0,value:j,onChange:_=>k(_.target.value),type:"email",placeholder:a("your-email"),name:"email"}),b.map(_=>e.jsx(Q,{value:h[_],onChange:q=>u(Z=>({...Z,[_]:q.target.value})),placeholder:`${_} (${a("optional")})`},_)),e.jsxs(S,{disabled:x.loading,className:"w-full",size:"lg",children:[x.loading?a("starting-chat"):a("start-chat"),e.jsx(m.SendHorizontal,{className:"size-4 rtl:-scale-100"})]})]}),e.jsx(xt,{})]})]})})}function vt(){l.usePreludeData();const{routerState:{screen:t}}=l.useWidgetRouter();return e.jsxs(e.Fragment,{children:[e.jsx(se.Container,{}),e.jsx("div",{className:"relative bg-background size-full",children:e.jsx(N.AnimatePresence,{mode:"wait",children:(()=>{switch(t){case"welcome":return e.jsx(v,{fadeIn:"right",className:"size-full",snapExit:!0,children:e.jsx(Ds,{})},t);case"sessions":return e.jsx(v,{fadeIn:"right",className:"size-full",snapExit:!0,children:e.jsx(Is,{})},t);case"chat":return e.jsx(v,{fadeIn:"right",className:"size-full",snapExit:!0,children:e.jsx(zs,{})},t);default:return D.isExhaustive(t,vt.name),null}})()})})]})}const Rs="4.0.6",Ps=`<!DOCTYPE html>
|
|
18
18
|
<html>
|
|
19
19
|
<head>
|
|
20
20
|
<style>
|
|
@@ -31,7 +31,7 @@ html, body {
|
|
|
31
31
|
</head>
|
|
32
32
|
<body>
|
|
33
33
|
</body>
|
|
34
|
-
</html>`;function bt(){const{isOpen:t}=l.useWidgetTrigger(),{
|
|
34
|
+
</html>`;function bt(){const{isOpen:t}=l.useWidgetTrigger(),{contentIframeRef:o}=l.useWidget(),{cssOverrides:s,inline:r}=l.useConfig(),{theme:n,cssVars:a,computed:i}=L(),{dir:c}=X();return e.jsx(N.motion.div,{animate:t?"visible":"hidden",initial:"hidden",variants:{hidden:{opacity:0,y:8,transitionEnd:{display:"none"},transition:{duration:.15}},visible:{opacity:1,y:0,display:"block",height:r?"100%":void 0}},children:e.jsxs(ce,{ref:o,initialContent:Ps,allowFullScreen:!0,title:"OpenCX Live Chat",style:{"--opencx-widget-width":i.minWidth,"--opencx-widget-height":i.minHeight,minWidth:i.minWidth,width:"var(--opencx-widget-width)",maxWidth:i.maxWidth,minHeight:i.minHeight,height:"var(--opencx-widget-height)",maxHeight:i.maxHeight,overflow:"hidden",outline:n.widgetContentContainer.outline,outlineColor:n.widgetContentContainer.outlineColor,borderRadius:n.widgetContentContainer.borderRadius,boxShadow:n.widgetContentContainer.boxShadow,transitionProperty:n.widgetContentContainer.transitionProperty,transitionTimingFunction:n.widgetContentContainer.transitionTimingFunction,transitionDuration:n.widgetContentContainer.transitionDuration,boxSizing:"border-box",borderWidth:"0px"},children:[s&&e.jsx("style",{children:s}),e.jsx($t,{delayDuration:200,disableHoverableContent:!0,children:e.jsx("div",{style:{...a},"data-version":Rs,className:d("antialiased font-sans size-full overflow-hidden relative text-secondary-foreground"),dir:c,children:e.jsx(vt,{})})})]})})}function Es(){const{theme:t}=L();return e.jsx(te.Content,{onInteractOutside:o=>o.preventDefault(),forceMount:!0,style:{zIndex:t.widgetContentContainer.zIndex,fontSize:"16px"},side:"top",align:"end",sideOffset:t.widgetContentContainer.offset.side,alignOffset:t.widgetContentContainer.offset.align,avoidCollisions:!1,children:e.jsx(bt,{})})}function Os({className:t,style:o}){return e.jsxs("svg",{width:"32",height:"30",viewBox:"0 0 32 30",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:d("text-primary-foreground",t),style:o,children:[e.jsx("path",{d:"M0 6.94263C0 3.62892 2.68629 0.942627 6 0.942627H26C29.3137 0.942627 32 3.62892 32 6.94263V17.9426C32 21.2563 29.3137 23.9426 26 23.9426H6C2.68629 23.9426 0 21.2563 0 17.9426V6.94263Z",fill:"currentColor"}),e.jsx("path",{fillRule:"evenodd",clipRule:"evenodd",d:"M19.9945 23.8935L26.237 23.8934C26.1982 24.3557 26.1712 25.2778 26.1704 26.2318C26.1688 28.2839 26.1376 28.7041 25.974 28.868C25.583 29.2598 25.2686 29.0967 24.0616 27.8754C23.4162 27.2222 22.1141 25.9522 21.1682 25.0531L19.9945 23.8935Z",fill:"currentColor"})]})}const Ws=`<!DOCTYPE html>
|
|
35
35
|
<html>
|
|
36
36
|
<head>
|
|
37
37
|
<style>
|
|
@@ -47,5 +47,5 @@ html, body {
|
|
|
47
47
|
</head>
|
|
48
48
|
<body>
|
|
49
49
|
</body>
|
|
50
|
-
</html>`;function
|
|
50
|
+
</html>`;function As(){var a,i;const{isOpen:t}=l.useWidgetTrigger(),{cssOverrides:o,assets:s}=l.useConfig(),{theme:r,cssVars:n}=L();return e.jsxs(ce,{initialContent:Ws,style:{height:`calc(${r.widgetTrigger.size.button}px + ${$.x*2}px)`,width:`calc(${r.widgetTrigger.size.button}px + ${$.y*2}px)`,fontSize:"16px",position:"fixed",zIndex:r.widgetTrigger.zIndex,right:r.widgetTrigger.offset.right,bottom:r.widgetTrigger.offset.bottom,left:r.widgetTrigger.offset.left,boxSizing:"border-box",borderWidth:"0px",borderRadius:"100%"},children:[o&&e.jsx("style",{children:o}),e.jsx("div",{style:{...n,width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center"},children:e.jsx(te.PopoverTrigger,{className:d("font-sans flex items-center justify-center rounded-full"),style:{height:r.widgetTrigger.size.button,width:r.widgetTrigger.size.button},children:e.jsx(A,{children:e.jsx("div",{...g("trigger/btn"),className:d("relative size-full rounded-full","flex items-center justify-center","overflow-hidden","transition-all","bg-primary","text-primary-foreground"),children:e.jsx(N.AnimatePresence,{mode:"wait",children:t?e.jsx(v,{snapExit:!0,fadeIn:"up",overrides:{initial:{rotate:45},animate:{rotate:0}},children:(a=s==null?void 0:s.widgetTrigger)!=null&&a.closeIcon?e.jsx("img",{src:s.widgetTrigger.closeIcon,alt:"Widget trigger close icon",style:{width:r.widgetTrigger.size.icon,height:r.widgetTrigger.size.icon}}):e.jsx(m.ChevronDownIcon,{style:{width:r.widgetTrigger.size.icon,height:r.widgetTrigger.size.icon}})},"x-icon"):e.jsx(v,{snapExit:!0,overrides:{initial:{rotate:45},animate:{rotate:0}},children:(i=s==null?void 0:s.widgetTrigger)!=null&&i.openIcon?e.jsx("img",{src:s.widgetTrigger.openIcon,alt:"Widget trigger open icon",style:{width:r.widgetTrigger.size.icon,height:r.widgetTrigger.size.icon}}):e.jsx(Os,{style:{width:r.widgetTrigger.size.icon,height:r.widgetTrigger.size.icon},className:"mt-0.5 opacity-95"})},"message-icon")})})})})})]})}function Fs(){const{dir:t}=l.useDocumentDir();return e.jsx(te.Anchor,{style:{position:"fixed",bottom:0,right:t==="ltr"?0:void 0,left:t==="rtl"?0:void 0}})}function Hs(){const{isOpen:t,setIsOpen:o}=l.useWidgetTrigger();return e.jsxs(te.Root,{open:t,onOpenChange:o,children:[e.jsx(Fs,{}),e.jsx(As,{}),e.jsx(Es,{})]})}const qs=[{key:"loading",component:Lt},{key:"fallback",component:Ot},{key:"bot_message",component:ee},{key:"agent_message",component:ee}],Bs={get:async t=>localStorage.getItem(t),set:async(t,o)=>{localStorage.setItem(t,o)},remove:async t=>{localStorage.removeItem(t)}};function Ls({options:t,components:o=[],loadingComponent:s}){return e.jsx(l.WidgetProvider,{components:[...qs,...o],options:t,storage:Bs,loadingComponent:s,children:e.jsx(l.WidgetTriggerProvider,{children:t.inline?e.jsx(bt,{}):e.jsx(Hs,{})})})}exports.Widget=Ls;
|
|
51
51
|
//# sourceMappingURL=index.cjs.map
|