wemachatbotwidgetpackage/dist/cjs/index.js

wema chatbot widget npm package

"use strict";var e=require("react/jsx-runtime"),t=require("react"),s=require("axios"),n=require("uuid"),o=require("style-inject"),i=require("typewriter-effect");const r="https://alat-cs-dev-app-infoapi-weurope.azurewebsites.net/api/v1.0",a=s.create({baseURL:r,headers:{Accept:"text/plain","Content-Type":"application/json"}}),l=t.createContext(void 0),d=()=>{const e=t.useContext(l);if(!e)throw new Error("useWemaContext must be used within a WemaContextProvider");return e};function c(){const{tabNumber:s,setTabNumber:o,showFullContent:i,setShowFullContent:l,showDetailedResponse:c,setShowDetailedResponse:p,setErrorExist:h,setLoading:g,setWaterMark:x,setMessages:u,getMessage:m,setBotToken:y,setUserId:f,userId:j}=d(),[w,b]=t.useState(""),[v,S]=t.useState(!1),C=n.v4();t.useEffect((()=>{const e=localStorage.getItem("userId");e?f(e):e||localStorage.setItem("userId",C)}),[]);return t.useEffect((()=>{(async()=>{try{await a.get("/Bot/homelogo",{headers:{"Content-Type":"application/json"}}).then((e=>{b(e?.data.path)}))}catch(e){console.log(e)}})()}),[]),e.jsxs("div",{style:{color:"#050505",width:"100%",borderBottom:1!==s?"#D9D9D9 solid 1px":"none",position:"relative"},children:[1===s?e.jsx("img",{src:"https://alatcsdevstoreweurope.blob.core.windows.net/public/homepagelogo.svg",alt:"wema logo",style:{width:"72px",height:"32px"}}):e.jsxs("div",{children:[e.jsx("button",{onClick:()=>{i?l(!1):c?(l(!0),p(!1)):o(1)},style:{position:"absolute",left:"1rem"},children:e.jsx("img",{src:"https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQfLAtcnpn58lAc5j2wF9DhArhkqnXecqLNkV5GHksa-w&s",alt:"chat-icon",style:{width:"20px",height:"20px"}})}),e.jsx("button",{onClick:async()=>{h(!1),g(!0);try{const e=await fetch(`${r}/Bot/user/${j}/token/startconversation`,{method:"GET"}),{token:t,conversationId:s}=await e.json();localStorage.setItem("conversationId",s),y(t),g(!1),S(!1),x(""),g(!1),u([]),m()}catch(e){h(!0),g(!1),console.log("the catch response",e)}},onMouseEnter:()=>S(!0),onMouseLeave:()=>S(!1),className:2===s?"":"hidden",style:{position:"absolute",right:"1rem"},children:e.jsx("img",{src:"https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcToj21Ha4K1q-BULzDPCHuHLLvCtgs-YGDVd-m0s8UhTw&s",alt:"options",style:{width:"20px",height:"20px"}})}),v&&e.jsx("p",{style:{position:"absolute",top:"2px",right:"50px",padding:"0.5rem",backgroundColor:"#BABBC2",color:"white",borderRadius:"4px"},children:"clear chat"})]}),e.jsx("div",{style:{display:"flex",justifyContent:"center",alignItems:"center"},children:e.jsx("div",{children:2===s?e.jsx("p",{style:{fontWeight:700,color:"#17031D",fontSize:"18px",letterSpacing:"0.5px",marginBottom:"16px"},children:"Messages"}):3===s?e.jsx("div",{style:{width:"100%",textAlign:"center",display:"flex",justifyContent:"center"},children:e.jsx("p",{style:{fontWeight:700,color:"#17031D",fontSize:"18px",textAlign:"center",marginBottom:"16px"},children:"FAQs"})}):null})})]})}function p(){const{tabNumber:t,setTabNumber:s}=d();return e.jsx("div",{className:"theFont",style:{fontSize:"12px",fontWeight:"500",width:"100%",borderTop:"#D9D9D9 solid 2px",display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",padding:"0 1.5rem",marginBottom:"16px"},children:e.jsxs("div",{style:{display:"flex",width:"100%",justifyContent:"space-between"},children:[e.jsxs("button",{style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center"},onClick:()=>s(1),children:[1===t?e.jsx("img",{src:"https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRm4HpjvUVF5okdHbWURGVoylRUmaYeL7JZPA&s",alt:"home",style:{width:"20px",height:"20px"}}):e.jsx("img",{src:"https://www.clker.com/cliparts/Q/7/J/K/1/d/house-grey-md.png",alt:"home",style:{width:"20px",height:"20px"}}),e.jsx("p",{style:{color:1===t?"#A90836":"#050505"},children:"Home"})]}),e.jsxs("button",{style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center"},onClick:()=>s(2),children:[2===t?e.jsx("img",{src:"https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQgrfzViZydwCmDBUbMQLzU_wEQPSL83AEBNg&s",alt:"message",style:{width:"20px",height:"20px"}}):e.jsx("img",{src:"https://as1.ftcdn.net/v2/jpg/02/63/51/56/1000_F_263515657_GxaUp5s5uH0rqGRLQLomV3s0gWcm2mP8.jpg",alt:"message",style:{width:"20px",height:"20px"}}),e.jsx("p",{style:{color:2===t?"#A90836":"#050505"},children:"Messages"})]}),e.jsxs("button",{style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center"},onClick:()=>s(3),children:[3===t?e.jsx("img",{src:"https://www.kindpng.com/picc/m/71-719789_pink-question-mark-icon-pbj-management-logo-hd.png",alt:"faqs",style:{width:"20px",height:"20px"}}):e.jsx("img",{src:"https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSE-NtVDAVWrDuJTSwXDcLolM1rHbOGDY-Itpoz7qjLPg&s",alt:"faqs",style:{width:"20px",height:"20px"}}),e.jsx("p",{style:{color:3===t?"#A90836":"#050505"},children:"FAQs"})]})]})})}o("css_248z");const h=()=>{const{setTabNumber:s}=d(),[n,o]=t.useState(""),[i,r]=t.useState(""),[l,c]=t.useState("");t.useEffect((()=>{(async()=>{try{await a.get("/Home/welcomemessage",{headers:{"Content-Type":"application/json"}}).then((e=>{o(e?.data.title),r(e?.data.description)}))}catch(e){console.log(e)}})()}),[]),t.useEffect((()=>{(async()=>{try{await a.get("/Home/homeimage",{headers:{"Content-Type":"application/json"}}).then((e=>{c(e?.data.path)}))}catch(e){console.log(e)}})()}),[]);return e.jsxs("div",{className:"theFont",style:{color:"black",cursor:"pointer",padding:"0 24px",overflow:"hidden"},onClick:()=>s(2),children:[e.jsx("p",{style:{fontWeight:700,fontSize:"20px",margin:"0"},children:n}),e.jsx("p",{style:{fontSize:"14px",margin:"0"},children:i}),e.jsx("div",{style:{width:"100%",display:"flex",justifyContent:"center",marginTop:"6%"},children:e.jsx("img",{src:l,alt:"welcome",style:{width:"350px",height:"230px"}})}),e.jsxs("div",{style:{height:"70px",width:"calc(100% - 40px)",boxShadow:"0px 4px 8px rgba(0, 0, 0, 0.1)",outline:"none",fontSize:"14px",padding:"16px",position:"absolute",bottom:"8px",borderRadius:"8px",border:"1px solid #D9D9D9",backgroundColor:"#ffffff",whiteSpace:"normal"},children:[e.jsx("p",{style:{fontWeight:700},children:"Send us a message"}),e.jsx("p",{children:"We typically reply within 5 - 10 minutes"}),e.jsx("img",{src:"https://e7.pngegg.com/pngimages/841/271/png-clipart-computer-icons-send-miscellaneous-angle.png",alt:"chat with Wema",style:{position:"absolute",right:"4px",bottom:"24px",width:"20px",height:"20px"}})]})]})},g=({faq:s,questionsLenght:n,setTitleId:o,setSuggestionsExist:i})=>{const{setShowFullContent:r,showFullContent:a,setShowDetailedResponse:l}=d(),[c,p]=t.useState(!1);return e.jsx("div",{style:{position:"relative"},children:!a&&e.jsx("div",{onClick:()=>{i(!1),l(!1),r(!0),o(s.id)},onMouseEnter:()=>p(!0),onMouseLeave:()=>p(!1),style:{cursor:"pointer"},children:e.jsxs("div",{style:{borderBottom:"1px solid #EAECF0",paddingTop:"16px",paddingBottom:"16px",paddingRight:"50px",paddingLeft:"24px",backgroundColor:c?"#faf0f3":"transparent"},children:[e.jsx("p",{style:{fontWeight:"600",color:"#A90836"},children:s.name}),e.jsx("p",{style:{fontSize:"14px",color:"#101828",marginTop:"8px"},children:s.description}),e.jsx("img",{src:"https://cdn-icons-png.flaticon.com/256/12143/12143718.png",alt:"faq",style:{position:"absolute",top:"40%",right:"16px",width:"20px",height:"20px"}})]})})})},x=({response:t,setFaqId:s,setSuggestionsExist:n})=>{const{setShowFullContent:o,setShowDetailedResponse:i}=d();return e.jsxs("div",{onClick:()=>{s(t.id),n(!1),i(!0),o(!1)},style:{borderBottom:"1px solid #EAECF0",position:"relative",cursor:"pointer",paddingTop:"16px",paddingBottom:"16px",paddingLeft:"24px",paddingRight:"50px"},onMouseEnter:e=>{e.currentTarget.style.backgroundColor="#faf0f3"},onMouseLeave:e=>{e.currentTarget.style.backgroundColor="transparent"},children:[e.jsx("p",{style:{fontWeight:"600",fontSize:"14px",color:"#101828"},children:t?.question}),e.jsx("img",{src:"https://cdn-icons-png.flaticon.com/256/12143/12143718.png",alt:"faq",style:{position:"absolute",top:"40%",right:"16px",width:"20px",height:"20px"}})]})};function u({answer:t}){const s=/\n(\d+\.\s|\*\s|-\s)/.test(t),n=t=>{const s=/([.!?])\s/,n=t?.split(/\*\*(.*?)\*\*/g);return n?.map(((t,n)=>{if(n%2==1)return e.jsx("strong",{style:{fontWeight:700},children:t},n);{const o=/\n\n/g,i=t.split(o);return i.map(((t,o)=>{const r=t.split(s),a=[];for(let t=0;t<r.length;t+=2)t+1<r.length?a.push(e.jsxs("span",{children:[r[t],r[t+1]," "]},`${n}-${o}-${t}`)):a.push(e.jsxs("span",{children:[r[t]," "]},`${n}-${o}-${t}`)),(t/2+1)%2==0&&t+2<r.length&&a.push(e.jsx("br",{},`br-${n}-${o}-${t}`));return o<i.length-1&&(a.push(e.jsx("br",{},`br-${n}-${o}-1`)),a.push(e.jsx("br",{},`br-${n}-${o}-2`))),a}))}}))},o=s?e.jsx("div",{children:t.split("\n").map(((t,s)=>{if(!/^(\d+\.\s|\*\s|-\s)/.test(t))return e.jsx("p",{style:{listStyleType:"none"},children:n(t)},s);{const o=t.match(/^(\d+\.\s|\*\s|-\s)(.*)/);if(o)return e.jsxs("span",{style:{display:"block",marginBottom:"8px"},children:[e.jsx("strong",{children:o[1]})," ",n(o[2]),e.jsx("br",{})]},s)}}))}):e.jsx("p",{children:n(t)});return e.jsx("div",{children:o})}function m({answer:t}){const s=/\n\d+\.\s/.test(t)?e.jsx("div",{children:t.split("\n").map(((t,s)=>{if(/^\d+\.\s/.test(t)){const n=t.split(". ");return e.jsxs("span",{className:"text-[14px] text-[#101828] mt-2 ",children:[e.jsx("strong",{children:n[0]}),". ",n[1],e.jsx("br",{})]},s)}return e.jsx("p",{className:"text-[14px] text-[#101828] mt-2 ",style:{listStyleType:"none"},children:t},s)}))}):e.jsx("p",{children:t});return e.jsx("div",{children:s})}function y(){const{showChatBot:s,showFullContent:n,showDetailedResponse:o}=d(),[i,r]=t.useState(""),[l,c]=t.useState(!1),[p,h]=t.useState(!1),[y,f]=t.useState({loading:!1,result:[],count:0}),[j,w]=t.useState({loading:!1,result:{}}),[b,v]=t.useState(!1),[S,C]=t.useState(),[k,E]=t.useState(!1),[T,I]=t.useState(""),[B,R]=t.useState(""),[L,D]=t.useState({loading:!1,result:[],otherInfo:""}),[A,F]=t.useState({loading:!1,result:{}}),M=t.useRef(null),W=t.useRef(null);t.useEffect((()=>{W.current&&(W.current.scrollTop=0)}),[o,n]),t.useEffect((()=>{const e=e=>{M.current&&!M.current.contains(e.target)&&e.target.closest(".outside-div")&&E(!1)},t=e=>{"Escape"===e.key&&E(!1)};return document.addEventListener("click",e),document.addEventListener("keydown",t),()=>{document.removeEventListener("click",e),document.removeEventListener("keydown",t)}}),[]);const N=async()=>{v(!1);try{f({...y,loading:!0}),await a.get(`KnowledgeStore/title?searhQuery=${i}`,{headers:{"Content-Type":"application/json"}}).then((e=>{const t={...y,loading:!1,result:e.data.titles};f(t),E(!1),v(!1)}))}catch(e){f({...y,loading:!1}),console.log(e),v(!0)}},z=async()=>{v(!1);try{f({...y,loading:!0,count:0}),await a.get("/KnowledgeStore/title",{headers:{"Content-Type":"application/json"}}).then((e=>{const t={...y,loading:!1,result:e.data.titles,count:e.data.count};f(t),v(!1)}))}catch(e){f({...y,loading:!1}),v(!0),console.log(e)}};return t.useEffect((()=>{i.length>=3?(N(),(async()=>{v(!1);try{f({...y,loading:!0}),await a.get(`KnowledgeStore/title/autocomplete?searhQuery=${i}`,{headers:{"Content-Type":"application/json"}}).then((e=>{C(e.data),v(!1)}))}catch(e){f({...y,loading:!1}),console.log(e),v(!0)}})()):z()}),[s,i]),t.useEffect((()=>{S&&S?.length>=1&&E(!0)}),[S]),t.useEffect((()=>{""!==T&&((async()=>{try{F({...A,loading:!0}),await a.get(`KnowledgeStore/title/${T}/FAQs/${B}`,{headers:{"Content-Type":"application/json"}}).then((e=>{const t={...A,loading:!1,result:e.data};F(t)}))}catch(e){F({...A,loading:!1})}})(),(async()=>{try{D({...L,loading:!0});const e=""===i?`/KnowledgeStore/title/${T}/FAQs`:`/KnowledgeStore/title/${T}/FAQs/?searhQuery=${i}`;await a.get(e,{headers:{"Content-Type":"application/json"}}).then((e=>{const t={...L,loading:!1,result:e.data.faQsResponses,otherInfo:e.data.information};D(t)}))}catch(e){D({...L,loading:!1})}})(),(async()=>{v(!1);try{w({...j,loading:!0}),await a.get(`KnowledgeStore/title/${T}`,{headers:{"Content-Type":"application/json"}}).then((e=>{const t={...j,loading:!1,result:e.data};w(t),v(!1)}))}catch(e){w({...j,loading:!1}),v(!0),console.log(e)}})())}),[B,i,T]),e.jsx(e.Fragment,{children:e.jsxs("div",{ref:W,style:{height:"100%",color:"black"},children:[!o&&e.jsxs("div",{style:{position:"relative",padding:"0, 24px"},className:"relative px-[24px]",children:[e.jsx("input",{style:{width:"calc(100% - 48px)",borderRadius:"4px",margin:"2px 24px 0 24px",backgroundColor:"#F9FAFB",height:"45px",paddingLeft:"12px",paddingRight:"52px",outline:"none",borderWidth:"none"},placeholder:"Search for help",value:i,onChange:e=>{r(e.target.value)}}),e.jsx("button",{children:e.jsx("img",{src:"https://www.citypng.com/public/uploads/preview/download-black-search-icon-button-png-7017516949749341050xfl088.png",alt:"search",style:{position:"absolute",right:"36px",top:"12px",width:"20px",height:"20px"}})}),i.length>=3&&k?e.jsx("div",{ref:M,style:{width:"100%",backgroundColor:"white",boxShadow:"0px 4px 8px rgba(0, 0, 0, 0.1)",overflowY:"scroll",maxHeight:"200px",position:"absolute",top:"50px",gap:"2px",zIndex:"10",left:"0"},children:S?.map(((t,s)=>e.jsx("div",{onClick:()=>{r(t),E(!1),N()},style:{cursor:"pointer",paddingTop:"0.5rem",paddingBottom:"0.5rem",backgroundColor:p?"#fcf2f5":"transparent",fontWeight:500,borderRadius:"4px",paddingLeft:"0.75rem",paddingRight:"0.75rem",marginBottom:"0.25rem",display:"flex",justifyContent:"flex-start",alignItems:"flex-start",transitionDuration:"300ms"},children:e.jsx("p",{onMouseEnter:()=>h(!0),onMouseLeave:()=>h(!1),style:{cursor:"pointer",backgroundColor:p?"#fcf2f5":"white"},children:t},s)})))}):null]}),y.loading?e.jsx("div",{style:{width:"100%",fontSize:"34px",height:"40%",display:"flex",alignItems:"center",justifyContent:"center"},children:e.jsx("img",{src:"https://behalacollege.in/display_board/assets/images/ajax-spinner.gif",alt:"loading",className:"spinner-icon",style:{width:"60px",height:"60px"}})}):e.jsx("div",{children:b||y.result.length<1?e.jsxs("div",{style:{height:"40vh",display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",gap:"2px"},children:[e.jsx("button",{onClick:z,style:{width:"50px",height:"50px",backgroundColor:"#F9FAFB",borderRadius:"50%",display:"flex",alignItems:"center",justifyContent:"center"},children:e.jsx("img",{src:"https://e7.pngegg.com/pngimages/609/757/png-clipart-computer-icons-refresh-free-others-angle-text.png",alt:"search",style:{width:"20px",height:"20px"}})}),e.jsx("p",{style:{fontSize:"16px",color:"#101828",fontWeight:"600"},children:"Try again"}),e.jsx("p",{style:{fontSize:"14px",color:"#667085"},children:"No result found"})]}):e.jsxs("div",{style:{marginTop:"16px"},children:[!o&&!n&&e.jsxs("p",{style:{fontSize:"16px",borderBottom:"1px solid #EAECF0",color:"#101828",padding:" 16px 0 16px 24px",marginTop:"16px"},children:[y.result.length," Collections"]}),e.jsxs("div",{style:{paddingBottom:"30px"},children:[!n&&!o&&y.result.map(((t,s)=>e.jsx(g,{setSuggestionsExist:E,faq:t,setTitleId:I,searchedTitle:i,questionsLenght:y.count},s))),n&&!o&&e.jsxs("div",{style:{borderBottom:"1px solid #EAECF0",cursor:"pointer",paddingTop:"16px",paddingBottom:"16px",paddingLeft:"24px",paddingRight:"50px",backgroundColor:l?"#faf0f3":"transparent"},onMouseEnter:()=>c(!0),onMouseLeave:()=>c(!1),children:[e.jsx("p",{style:{fontSize:"16px",fontWeight:"600"},children:j?.result?.name}),e.jsx(m,{answer:j?.result?.description}),e.jsxs("button",{style:{fontSize:"14px",color:"#667085",fontWeight:"500",marginTop:"8px"},children:[L.result.length," questions"]})]}),n&&!o&&L.result.map((t=>e.jsx(x,{setSuggestionsExist:E,setFaqId:R,response:t},t.id))),o&&e.jsxs("div",{style:{paddingLeft:"24px",paddingRight:"24px",marginTop:"16px"},children:[e.jsx("p",{style:{fontSize:"16px",fontWeight:"600",marginBottom:"8px"},children:A.result.question}),e.jsx(u,{answer:A.result.answer})]})]})]})})]})})}const f=e=>{const t=new Date,s=Math.floor((t.getTime()-e.getTime())/1e3);if(s<60)return"just now";const n=Math.floor(s/60);if(n<60)return 1===n?"1 minute ago":`${n} minutes ago`;const o=Math.floor(n/60);if(o<24)return 1===o?"1 hour ago":`${o} hours ago`;const i=Math.floor(o/24);return 1===i?"1 day ago":`${i} days ago`};function j({message:t,handleResendFailedMessage:s,BotResponseLoading:n,setShowServices:o}){return e.jsxs("div",{style:{width:"100%",height:"auto"},children:[e.jsx("div",{style:{width:"100%",display:"flex",justifyContent:"flex-end",marginTop:"16px"},children:e.jsx("span",{style:{backgroundColor:"#faf0f3",width:"auto",maxWidth:"90%",padding:"8px 16px",borderRadius:"6px",color:"#A90836",marginRight:"4px"},children:e.jsx("p",{children:t.text})})}),e.jsxs("div",{style:{paddingLeft:"32px",display:"flex",gap:"8px",fontFamily:"Nunito, sans-serif",fontSize:"12px",width:"100%",justifyContent:"flex-end"},children:[t.error&&e.jsxs("div",{style:{display:"flex",gap:"4px",justifyContent:"center",alignItems:"center"},children:[e.jsx("p",{style:{color:"#ff0000",marginTop:"2px"},children:"Send failed."}),e.jsx("button",{style:{color:"#00f",marginTop:"2px",textDecoration:"underline",cursor:"pointer"},onClick:()=>s(t.text),children:"Retry"})]}),t.pending&&e.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"center"},children:[e.jsx("p",{style:{color:"#A6A7A9",marginTop:"2px"},children:"Sending"}),e.jsx(i,{options:{strings:["..."],autoStart:!0,loop:!0,cursor:""}})]}),t.delivered&&e.jsx("p",{style:{color:"#A6A7A9",marginTop:"2px"},children:"Delivered"}),e.jsx("p",{style:{color:"#9a9a9a",marginTop:"2px"},children:f(t.timestamp)})]})]})}function w({message:s,BotResponseLoading:n}){const{renderSelectedOption:o,setShowButtons:i,showButtons:r,setMessages:a}=d();return t.useEffect((()=>{s.buttons&&s.buttons.length>0&&i(!0)}),[s.buttons]),e.jsxs(e.Fragment,{children:[e.jsxs("div",{style:{width:"100%",height:"auto"},children:[s.delivered&&e.jsxs("div",{style:{width:"100%",height:"auto"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"flex-end",marginTop:"16px",rowGap:"8px"},children:[e.jsx("img",{src:"https://alatcsdevstoreweurope.blob.core.windows.net/public/homepagelogo.svg",alt:"infinion",style:{marginRight:"8px",width:"20px",height:"20px"}}),e.jsxs("span",{style:{wordBreak:"break-word",overflowWrap:"break-word",backgroundColor:"#EEEEEE",width:"auto",maxWidth:"100%",padding:"8px 16px",borderRadius:"6px",color:"#505050"},children:[e.jsx(u,{answer:s.text}),e.jsx("div",{style:{width:"100%",display:"flex",flexDirection:"column",gap:"8px",marginTop:"8px"},children:s?.buttons?.map(((t,s)=>e.jsx("button",{style:{display:"imBack"===t.type?"none":"block",border:"1px solid #A90836",width:"100%",fontWeight:"500",borderRadius:"8px",padding:"8px",transition:"background-color 0.3s, color 0.3s",cursor:"pointer"},type:"button",onClick:()=>{window.open(t.value,"_blank")},onMouseOver:e=>{const t=e.target;t.style.backgroundColor="#A90836",t.style.color="white"},onMouseOut:e=>{const t=e.target;t.style.backgroundColor="white",t.style.color="inherit"},children:t.title},s)))})]})]}),e.jsx("div",{style:{paddingLeft:"32px",display:"flex",gap:"8px",fontFamily:"Nunito, sans-serif",fontSize:"12px",width:"100%",justifyContent:"flex-start"},children:e.jsx("p",{style:{color:"#9a9a9a"},children:"WemaBot"})})]}),s.error&&e.jsxs("div",{style:{width:"100%",height:"auto"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"flex-end",marginTop:"16px"},children:[e.jsx("img",{src:"https://alatcsdevstoreweurope.blob.core.windows.net/public/homepagelogo.svg",alt:"infinion",style:{marginRight:"8px",width:"20px",height:"20px"}}),e.jsx("span",{style:{backgroundColor:"#EEEEEE",width:"auto",maxWidth:"65%",padding:"8px 16px",borderRadius:"6px",color:"#505050"},children:e.jsx("p",{children:"Error from bot"})})]}),e.jsx("div",{style:{paddingLeft:"32px",display:"flex",gap:"8px",fontFamily:"Nunito, sans-serif",fontSize:"12px",width:"100%",justifyContent:"flex-start"},children:e.jsx("p",{style:{color:"#9a9a9a"},children:"WemaBot"})})]}),(s.pending||!s.delivered)&&n()]}),s.buttonsVisible&&e.jsx("div",{style:{width:"100%",display:"flex",flexDirection:"column",gap:"8px",marginTop:"8px"},children:s?.buttons?.map(((t,n)=>e.jsx("button",{style:{display:"imBack"===t.type?"block":"none",border:"1px solid #efefef",width:"100%",fontWeight:"500",borderRadius:"8px",padding:"8px",transition:"background-color 0.3s, color 0.3s",cursor:"pointer"},type:"button",onClick:()=>{"imBack"===t.type?(o(t.value),i(!1),a((e=>e.map((e=>e===s?{...e,buttonsVisible:!1}:e))))):window.open(t.value,"_blank")},onMouseOver:e=>{const t=e.target;t.style.backgroundColor="#A90836",t.style.color="white"},onMouseOut:e=>{const t=e.target;t.style.backgroundColor="white",t.style.color="inherit"},children:t.title},n)))})]})}function b(){const{setMessages:s,messages:o,botResponseIsLoading:l,sendMessage:c,botToken:p,setBotToken:h,setUserId:g,userId:x,setErrorExist:u,errorExist:m,loading:y,setLoading:f,getMessage:b}=d(),v=t.useRef(null),[S,C]=t.useState(""),[k,E]=t.useState(!1),T=n.v4();t.useEffect((()=>{const e=localStorage.getItem("userId");e?g(e):e||localStorage.setItem("userId",T)}),[]),t.useEffect((()=>{!p.length&&p.length<=1&&x&&E(!0)}),[p,x]),t.useEffect((()=>{p.length>1||!x||(async()=>{u(!1),f(!0);try{const e=await fetch(`${r}/Bot/user/${x}/token/startconversation`,{method:"GET"}),{token:t,conversationId:s}=await e.json();localStorage.setItem("conversationId",s),h(t),f(!1),setTimeout((()=>I(t,s)),3e6),f(!1)}catch(e){u(!0),f(!1),console.log("the catch response",e)}})()}),[x,k,p.length]),t.useEffect((()=>{const e=setInterval((()=>{s((e=>[...e]))}),6e4);return()=>clearInterval(e)}),[]);const I=async(e,t)=>{u(!1),f(!0);const s=localStorage.getItem("conversationId");try{const t={token:e,conversationId:s},n=await a.post("/Home/token/refresh",t,{headers:{"Content-Type":"application/json"}}),{token:o,conversationId:i,expires_in:r}=n.data;h(o),f(!1),setTimeout((()=>I(o,i)),3e6),f(!1)}catch(e){f(!1)}};t.useEffect((()=>{v.current&&(v.current.scrollTop=v.current.scrollHeight)}),[o]);const B=()=>{""!==S.trim()&&(c(S),C(""))},R=e=>{c(e)};t.useEffect((()=>{1===o.length&&p.length>1&&"bot"===o[0].sender&&b()}),[o.length,p.length]);const L=()=>e.jsx("div",{style:{width:"100%"},children:e.jsxs("div",{style:{display:"flex",alignItems:"flex-end",marginTop:"16px"},children:[e.jsx("img",{src:"https://alatcsdevstoreweurope.blob.core.windows.net/public/homepagelogo.svg",alt:"Wema",style:{marginRight:"8px",width:"20px",height:"20px"}}),e.jsx("div",{style:{backgroundColor:"#EEEEEE",color:"#505050",width:"12%",padding:"8px 4px 8px 4px",borderRadius:"6px"},children:e.jsx(i,{options:{strings:["..."],autoStart:!0,loop:!0,cursor:""}})})]})});return e.jsx("div",{style:{height:"100%"},children:p.length>1?e.jsxs("div",{style:{height:"calc(100% - 70px)",display:"flex",flexDirection:"column"},children:[e.jsx("div",{style:{flexGrow:1,padding:"0 20px",overflowY:"auto",paddingBottom:"16px"},ref:v,children:e.jsxs("div",{style:{display:"flex",flexDirection:"column",justifyContent:"flex-end",minHeight:"100%"},children:["bot"===o[0]?.sender&&o.slice(1).map(((t,s)=>e.jsx("div",{children:"user"===t.sender?e.jsx(j,{message:t,handleResendFailedMessage:R,BotResponseLoading:L}):e.jsx(w,{message:t,BotResponseLoading:L,botResponseIsLoading:l})},s))),"user"===o[0]?.sender&&o.map(((t,s)=>e.jsx("div",{children:"user"===t.sender?e.jsx(j,{message:t,handleResendFailedMessage:R,BotResponseLoading:L}):e.jsx(w,{message:t,BotResponseLoading:L,botResponseIsLoading:l})},s)))]})}),e.jsxs("div",{style:{padding:"0 20px"},children:[e.jsx("textarea",{className:"custom-input",style:{height:"60px",display:"flex",justifyContent:"center",width:"90%",outline:"none",fontSize:"14px",paddingLeft:"12px",paddingRight:"24px",overflowY:"scroll",position:"absolute",right:"20px",bottom:"0",fontWeight:"500",whiteSpace:"normal",paddingTop:"16px",borderTop:"1px solid #e6e6e6",resize:"none"},placeholder:"Type your message",value:S,onChange:e=>{const{value:t}=e.target;C(t)},onKeyDown:e=>{const{key:t}=e;"Enter"===t&&""!==S.trim()&&(e.preventDefault(),B())}}),e.jsx("button",{type:"button",onClick:B,style:{position:"absolute",right:"24px",bottom:"28px",width:"24px",height:"24px"},children:e.jsx("img",{src:"https://e7.pngegg.com/pngimages/841/271/png-clipart-computer-icons-send-miscellaneous-angle.png",alt:"send",style:{marginRight:"8px",marginBottom:"-8px"}})})]})]}):y?e.jsx("div",{style:{width:"100%",fontSize:"34px",height:"80%",display:"flex",alignItems:"center",justifyContent:"center"},children:e.jsx("img",{src:"https://behalacollege.in/display_board/assets/images/ajax-spinner.gif",alt:"loading",style:{width:"60px",height:"60px"}})}):m?e.jsxs("div",{style:{height:"40vh",display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",gap:"8px"},children:[e.jsx("button",{onClick:()=>E(!k),style:{width:"50px",height:"50px",backgroundColor:"#F9FAFB",borderRadius:"50%",display:"flex",alignItems:"center",justifyContent:"center"},children:e.jsx("img",{src:"https://e7.pngegg.com/pngimages/609/757/png-clipart-computer-icons-refresh-free-others-angle-text.png",alt:"search",style:{}})}),e.jsx("p",{style:{fontWeight:600,color:"#101828"},children:"Try again"})]}):null})}function v(){const{tabNumber:t}=d();return e.jsxs("div",{style:{width:"100%",height:"100%",overflowX:"hidden",margin:"0",marginTop:"1rem",fontSize:"14px"},children:[1===t&&e.jsx(h,{}),2===t&&e.jsx(b,{}),3===t&&e.jsx(y,{})]})}exports.ChatBot=function(){const{tabNumber:s,setShowFullContent:n,setShowChatBot:o,showChatBot:i,setShowDetailedResponse:r}=d(),a=t.useRef(null),[l,h]=t.useState(!0),[g,x]=t.useState(""),[u,m]=t.useState(!1);return t.useEffect((()=>{const e=e=>{a.current&&!a.current.contains(e.target)&&e.target.closest(".outside-div")&&o(!1)},t=e=>{"Escape"===e.key&&o(!1)};return document.addEventListener("click",e),document.addEventListener("keydown",t),()=>{document.removeEventListener("click",e),document.removeEventListener("keydown",t)}}),[]),t.useEffect((()=>{2!==s&&(r(!1),n(!1))}),[s]),t.useEffect((()=>{(async()=>{try{const e=new URLSearchParams(window.location.search),t=Object.fromEntries(e.entries());m(!1),h(!0),x(""),"access_token"===t.secret?(o(!0),h(!1),x(""),m(!1)):t.secret?"access_token"!==t.secret&&(h(!1),m(!0),x("401")):(h(!1),m(!0),x("400"))}catch(e){console.error("Error:",e),h(!1),m(!0),x("401")}})()}),[]),e.jsxs("div",{style:{width:"100vw"},className:"theFont chatbotContainer",children:[e.jsx("div",{style:{position:"fixed",top:0,right:0,bottom:0,left:0,display:"flex",justifyContent:"flex-end",backgroundColor:"rgba(0, 0, 0, 0.5)",zIndex:50,transitionDuration:"200ms",padding:"3% 3%"},children:e.jsxs("div",{ref:a,style:{width:"100vw",maxWidth:"470px",height:"80vh",border:"none",borderRadius:"16px",backgroundColor:"white",boxShadow:"0 4px 6px rgba(0, 0, 0, 0.1)",outline:"none"},children:[i&&e.jsxs("div",{style:{width:"100%",height:"80vh"},children:[e.jsx("div",{style:{width:"100%",height:"10%",padding:"1.25rem 0"},children:e.jsx(c,{})}),e.jsx("div",{style:{width:"100%",height:2!==s?"75%":"90%",position:"relative",overflow:"hidden",paddingTop:"0.5rem"},children:e.jsx(v,{})}),2!==s&&e.jsx("div",{style:{width:"100%",height:"15%",display:"flex"},children:e.jsx(p,{})})]}),u&&e.jsxs("div",{style:{width:"100%",height:"80vh",display:"flex",alignItems:"center",justifyContent:"center",flexDirection:"column"},children:[!l&&"400"===g&&e.jsx("img",{src:"https://media.istockphoto.com/id/1457314285/vector/400-four-hundred-icon-with-reflection-on-white-background.jpg?s=612x612&w=0&k=20&c=9XIeiARR8jPCx0UdcqNAzSe4slo050ix1yXpW1NyvGg=",alt:"400",style:{width:"auto",height:"auto",maxWidth:"100%",maxHeight:"100%"}}),!l&&"401"===g&&e.jsx("img",{src:"https://lh4.googleusercontent.com/proxy/RI9KRi5cyi5n92Msn-PCl5pxvwTAHYNfKhTCdmxag4aDkQOLAFBlt3xO9pTuGjDTfBU1PwjJSj034YCYSbpu4tENe2S6Q1dscLAkxo3ot0Ga_78yjvg_",alt:"401",style:{width:"auto",height:"auto",maxWidth:"100%",maxHeight:"100%"}}),l&&e.jsx("img",{src:"https://behalacollege.in/display_board/assets/images/ajax-spinner.gif",alt:"loading",style:{width:"60px",height:"60px"}}),e.jsx("p",{style:{color:"#A90836",fontSize:"14px",fontWeight:600,marginTop:"1rem"},children:"401"===g?"Unauthorized":"400"===g?"Bad Request":""}),e.jsx("p",{children:"Contact Your Administrator"})]})]})}),e.jsx("div",{style:{opacity:0,transitionProperty:"opacity, transform",transitionTimingFunction:"ease-out",transitionDuration:"200ms",transform:"translateY(0)"}})]})},exports.WemaContextProvider=({children:s})=>{const[n,o]=t.useState(!1),[i,r]=t.useState(!1),[d,c]=t.useState(!1),[p,h]=t.useState(1),[g,x]=t.useState(""),[u,m]=t.useState([{id:"",text:"",sender:"bot",timestamp:new Date,pending:!1,delivered:!0,error:!1,buttons:[]}]),[y,f]=t.useState(!1),[j,w]=t.useState(!1),[b,v]=t.useState(""),[S,C]=t.useState(""),[k,E]=t.useState(""),[T,I]=t.useState(!1),[B,R]=t.useState(!1),L=e=>{D(e)},D=async e=>{const t=localStorage.getItem("conversationId"),s={id:"",text:e,sender:"user",timestamp:new Date,pending:!0,delivered:!1,error:!1,buttons:[]};m((e=>[...e,s]));const n={message:e};try{200===(await a.post(`Bot/user/${k}/conversations/${t}/SendMessage`,n,{headers:{BotToken:S}})).status&&(s.delivered=!0,s.pending=!1,await A())}catch(e){s.delivered=!1,s.pending=!1,s.error=!0,m((e=>[...e]))}},A=async()=>{const e=localStorage.getItem("conversationId"),t={id:"",text:"",sender:"bot",timestamp:new Date,pending:!0,delivered:!1,error:!1,buttons:[]};m((e=>[...e,t]));try{const t=await a.get(`Bot/user/${k}/conversations/${e}/GetMessages?waterMark=${g}`,{headers:{BotToken:S}});if(200===t.status){const e=t.data.botMessages.map((e=>({text:e.text,sender:"bot",timestamp:new Date,pending:!1,delivered:!0,error:!1,buttons:e.buttons||[],buttonsVisible:!0})));m((t=>[...t.map(((e,s)=>s===t.length-2&&"user"===e.sender?{...e,pending:!1,delivered:!0}:{...e,buttonsVisible:!1})).slice(0,-1),...e])),x(t.data.waterMark)}}catch(e){m((e=>[...e.map(((t,s)=>s===e.length-2&&"user"===t.sender?{...t,pending:!1,delivered:!1,error:!0}:t)).slice(0,-1)]))}};return e.jsx(l.Provider,{value:{showButtons:j,setShowButtons:w,showFullContent:d,setShowFullContent:c,fetchBotResponse:async()=>{if(n){const e={id:"",text:"",sender:"user",timestamp:new Date,pending:!0,delivered:!1,error:!1,buttons:[]};f(!0);const t={userMessage:"Hi",userMessageTimeStamp:new Date};try{const s=await a.post("/INFINIONInfo/chat",t);200===s.status&&(e.buttons=s.data.buttons,e.error=!1,e.text=s.data.botMessage,e.pending=!1,e.sender="bot",f(!1),m((t=>[...t,e])))}catch(t){console.error("Error fetching bot response:",t),e.delivered=!1,e.pending=!1,e.error=!0,e.sender="bot",e.text="Error sending message",m((t=>[...t,e]))}}},showChatBot:n,setShowChatBot:o,messages:u,setMessages:m,getMessage:A,botResponseIsLoading:y,setBotResponseIsLoading:f,sendMessage:D,handleButtonClick:L,renderSelectedOption:e=>{L(e)},tabNumber:p,setTabNumber:h,showDetailedResponse:i,setShowDetailedResponse:r,botConversationId:b,setBotConversationId:v,botToken:S,setBotToken:C,userId:k,setUserId:E,loading:T,setLoading:I,errorExist:B,setErrorExist:R,waterMark:g,setWaterMark:x},children:s})},exports.useWemaContext=d;
//# sourceMappingURL=index.js.map