tybotflow-widget 0.1.0 → 0.1.2

package/dist/index.d.ts

@@ -1,3 +1,4 @@
+export { }
 /**
  * Mounts the Tybot Widget to the DOM.
  * @param config - Configuration options for the widget.

package/dist/index.es.js

@@ -48580,9 +48580,13 @@ const P0 = "https://api.tybotflow.com/api/v1", dW = "https://api.tybotflow.com/a
                       ] }),
                       e?.bot.description && /* @__PURE__ */ F.jsx("div", { className: "max-h-40 overflow-y-auto pr-1", style: { scrollbarWidth: "thin", scrollbarColor: `${h} transparent` }, children: /* @__PURE__ */ F.jsx("p", { className: "text-sm leading-relaxed whitespace-pre-line", style: { wordBreak: "break-word", color: w }, children: e?.bot.description }) }),
                       /* @__PURE__ */ F.jsxs("div", { className: "grid grid-cols-2 gap-3 text-xs", style: { color: w }, children: [
-                        e?.bot.phone_number && /* @__PURE__ */ F.jsxs("div", { className: "flex flex-col gap-0.5", children: [
+                        (e?.bot.phone_number || e?.bot?.botId === "arts-clinique") && /* @__PURE__ */ F.jsxs("div", { className: "flex flex-col gap-0.5", children: [
                           /* @__PURE__ */ F.jsx("span", { className: "uppercase tracking-wide font-bold", style: { color: w }, children: "Phone number" }),
-                          /* @__PURE__ */ F.jsx("span", { className: "font-medium break-all", children: e?.bot.phone_number })
+                          /* @__PURE__ */ F.jsx("span", { className: "font-medium break-all", children: e?.bot?.botId === "arts-clinique" ? /* @__PURE__ */ F.jsxs("span", { children: [
+                            "+212 662-300307",
+                            /* @__PURE__ */ F.jsx("br", {}),
+                            "+212 5222-58484"
+                          ] }) : e?.bot?.phone_number })
                         ] }),
                         e?.bot.personality && /* @__PURE__ */ F.jsxs("div", { className: "flex flex-col gap-0.5", children: [
                           /* @__PURE__ */ F.jsx("span", { className: "uppercase tracking-wide font-bold", style: { color: w }, children: "Personality" }),

package/dist/index.umd.js

@@ -327,4 +327,4 @@ In order to be iterable, non-array objects must have a [Symbol.iterator]() metho
 `)||""}),B.jsx("div",{className:"flex flex-wrap",dir:Zt(M.text||"")?"rtl":"ltr",children:M.choices?.map((ge,xe)=>B.jsx("button",{className:"mb-1 mr-1 text-xs px-4 py-1 hover:scale-105 transition-all duration-100",onClick:()=>{ur(ge.title)},style:{background:te,borderRadius:`${N}px`,color:G},dir:Zt(ge.title)?"rtl":"ltr",children:ge.title},xe))})]});case"image":return B.jsx(B.Fragment,{children:B.jsx("div",{className:"relative group",children:B.jsx("img",{src:M.image,className:"max-w-xs max-h-48 rounded-lg object-cover cursor-pointer hover:opacity-90 transition-opacity",onClick:()=>window.open(M.image,"_blank")})})});case"dropdown":return B.jsxs(B.Fragment,{children:[B.jsx(so,{remarkPlugins:[uo],components:$n,children:M.message?.replace(/\n/g,`  
 `)||""}),B.jsxs("div",{className:"flex flex-wrap",dir:Zt(M.message||"")?"rtl":"ltr",children:[B.jsx("p",{className:"mr-2",children:"ou"}),M.options?.map((ge,xe)=>B.jsx("button",{className:"mb-1 mr-1 px-4 py-1 text-xs hover:scale-105 transition-all duration-100",onClick:()=>{ur(ge.value)},style:{background:te,borderRadius:`${N}px`,color:G},dir:Zt(M.message||"")?"rtl":"ltr",children:ge.label},xe))]})]});case"carousel":const he=(M.items?.length||0)<2?1:2;return B.jsx("div",{className:"mt-2 w-full",children:B.jsx("div",{className:`grid grid-cols-1 sm:grid-cols-${he} gap-3`,children:M.items?.map((ge,xe)=>B.jsxs("div",{className:"flex-shrink-0 border p-3 shadow-md",style:{background:ne,borderRadius:`${N}px`},children:[ge.image&&B.jsx("img",{src:ge.image,alt:ge.title,className:"h-32 w-full object-cover rounded-md mb-2"}),B.jsx("h3",{className:"text-sm font-bold",title:ge.title,children:ge.title}),B.jsx("p",{className:"text-xs text-gray-300 mb-2 line-clamp-2",title:ge.subtitle,children:ge.subtitle}),ge.actions?.map((ht,jn)=>{let cr;try{cr=typeof ht.payload=="string"?JSON.parse(ht.payload):ht.payload}catch{cr={productName:ge.title}}return B.jsx("button",{className:"mb-1 mr-1 px-4 py-1 hover:scale-105 transition-all duration-100",onClick:()=>{ht.action==="Open URL"?window.open(ht.url,"_blank"):ht.title==="scan"?fetch(ge.image).then(nn=>nn.blob()).then(nn=>{const Ol=URL.createObjectURL(nn),Ut=document.createElement("a");Ut.href=Ol,Ut.download="qrcode.png",document.body.appendChild(Ut),Ut.click(),document.body.removeChild(Ut),URL.revokeObjectURL(Ol)}).catch(()=>{alert("Failed to download image.")}):ur(cr.productName||M.title)},style:{background:te,borderRadius:`${N}px`,color:G},children:ht.title},jn)})]},xe))})});case"card":return B.jsx("div",{className:"mt-2 w-full",children:B.jsx("div",{className:"grid grid-cols-1 gap-3",children:B.jsxs("div",{className:"flex-shrink-0 border rounded-lg p-3 shadow-md",style:{background:ne},children:[M.image&&B.jsx("img",{src:M.image,alt:M.title,className:"h-32 w-full object-cover rounded-md mb-2"}),B.jsx("h3",{className:"text-sm font-bold",children:M.title}),M.actions?.map((ge,xe)=>{let ht;try{ht=typeof ge.payload=="string"?JSON.parse(ge.payload):ge.payload}catch{ht={productName:M.title}}return B.jsx("button",{className:"mb-1 mr-1 px-4 py-1 hover:scale-105 transition-all duration-100",onClick:()=>{ge.action==="Open URL"?window.open(ge.url,"_blank"):ge.title==="scan"?M.image&&fetch(M.image).then(jn=>jn.blob()).then(jn=>{const cr=URL.createObjectURL(jn),nn=document.createElement("a");nn.href=cr,nn.download="qrcode.png",document.body.appendChild(nn),nn.click(),document.body.removeChild(nn),URL.revokeObjectURL(cr)}).catch(()=>{alert("Failed to download image.")}):ur(ht.productName||M.title)},style:{background:te,borderRadius:`${N}px`,color:G},children:ge.title},xe)})]})})})}},qn=async M=>{if(!cn)return;const he=await fetch(`${o0}/endusers/get-by-username`,{headers:{Authorization:`Bearer ${e?.token}`,"Content-Type":"application/json"},method:"POST",body:JSON.stringify({username:`web_user_${M}`})});if(!he.ok)throw new Error(`HTTP error! status: ${he.status}`);return(await he.json()).id},xo=async M=>{if(!cn)return;const he=await qn(M);let ge;Qn&&(ge={last_name:Qn.split(" ")[1]||Qn.split(" ")[0]||`web_user_${M}`,first_name:Qn.split(" ")[0]||`web_user_${M}`}),oi&&(ge={...ge,phone:oi}),wt&&(ge={...ge,email:wt});const xe=await fetch(`${o0}/endusers/${he}`,{headers:{Authorization:`Bearer ${e?.token}`,"Content-Type":"application/json"},method:"PUT",body:JSON.stringify(ge)});if(!xe.ok)throw new Error(`HTTP error! status: ${xe.status}`);return await xe.json()},kl=async M=>{M.preventDefault();const he=new Uint8Array(16);window.crypto.getRandomValues(he);const ge=Array.from(he).map(xe=>xe.toString(16).padStart(2,"0")).join("");wa(ge),localStorage.setItem("conversationId",ge),localStorage.setItem("webChatAuth","true"),lr(!0)},qr=`linear-gradient(to bottom right, ${y}, ${h}, ${y})`,No=`linear-gradient(to right, ${h}, ${m})`,Co=`linear-gradient(to right, ${E}, ${v})`;return p||!u?null:B.jsxs(B.Fragment,{children:[B.jsxs("div",{className:"fixed top-0 right-0 h-full shadow-2xl",style:{width:I+"px",transition:"transform 0.3s cubic-bezier(0.4,0,0.2,1)",transform:Ge?"translateX(0)":`translateX(${I}px)`,background:qr,zIndex:1e3},onDrop:Ro,onDragOver:Ur,onDragEnter:Br,onDragLeave:Ra,children:[B.jsx("div",{onMouseDown:Te,className:"absolute left-0 top-0 h-full w-2 cursor-ew-resize z-50 bg-transparent opacity-50 transition-colors",style:{userSelect:"none"},onMouseEnter:M=>M.currentTarget.style.background=h,onMouseLeave:M=>M.currentTarget.style.background="transparent"}),ke&&B.jsx("div",{className:"absolute inset-0 bg-opacity-20 border-2 border-dashed flex items-center justify-center z-15",style:{borderColor:h},children:B.jsxs("div",{className:"text-center ",style:{color:w},children:[B.jsx(JP,{className:"w-12 h-12 mx-auto mb-2"}),B.jsx("p",{className:"text-lg font-semibold",children:"Drop files here"})]})}),cn?B.jsxs("div",{className:"flex items-center justify-between px-4 py-1 sm:py-3 border-b",style:{background:Co,borderColor:v},children:[B.jsxs("div",{className:"flex items-center gap-3",children:[B.jsx("div",{className:"sm:size-10 size-8 flex items-center justify-center overflow-hidden rounded-full",children:B.jsx("img",{src:bn,alt:`${yn} Logo`,className:"w-full h-full"})}),B.jsx("h2",{className:"sm:text-lg text-md font-semibold",style:{color:w},children:yn})]}),B.jsxs("div",{className:"flex justify-between items-center gap-2 ml-2",children:[B.jsx("button",{onClick:()=>It(!0),className:"transition-colors p-1 rounded-full",style:{color:w},title:"Bot info","aria-label":"Bot info",onMouseEnter:M=>M.currentTarget.style.background=h,onMouseLeave:M=>M.currentTarget.style.background="transparent",children:B.jsx(GP,{className:"w-5 h-5"})}),B.jsx("button",{onClick:()=>{Je(!1),tn.current=!1},className:"transition-colors p-1 rounded-full",style:{color:w},title:"Close Chat","aria-label":"Close Chat",onMouseEnter:M=>M.currentTarget.style.background=h,onMouseLeave:M=>M.currentTarget.style.background="transparent",children:B.jsx(Ws,{className:"w-5 h-5"})})]})]}):B.jsx("div",{className:"flex items-center justify-end px-6 py-3",children:B.jsx("div",{className:"flex items-center",children:B.jsx("button",{onClick:()=>{Je(!1),tn.current=!1},className:"transition-colors p-1 rounded-full",style:{color:e?.inputTextColor||"#FFF"},title:"Close Chat","aria-label":"Close Chat",onMouseEnter:M=>M.currentTarget.style.background=h,onMouseLeave:M=>M.currentTarget.style.background="transparent",children:B.jsx(Ws,{className:"w-5 h-5"})})})}),cn&&B.jsxs("div",{ref:t,className:"flex-1 px-2 sm:px-4 py-4 overflow-y-auto space-y-4  scroll-smooth",style:{height:"calc(100% - 140px)",scrollbarWidth:"thin",scrollbarColor:`${h} transparent`},children:[ut.map(M=>B.jsxs("div",{className:`flex ${M.sender==="agent"?"flex-col sm:flex-row":""} items-start gap-3 ${M.sender==="user"?"flex-row-reverse":""}`,children:[B.jsx("div",{className:"sm:size-8 size-7 rounded-full flex items-center justify-center flex-shrink-0",style:{background:M.sender==="user"?oe:re},children:M.sender==="user"?B.jsx($P,{className:"sm:size-4 size-3",style:{color:S}}):B.jsx(yA,{className:"sm:size-4 size-3",style:{color:q}})}),B.jsxs("div",{className:`flex flex-col flex-1 ${M.sender==="user"?"items-end":"items-start"}`,children:[M.attachments&&M.attachments.length>0&&B.jsx("div",{className:"flex flex-col items-end w-[88%] mb-2 space-y-2",children:M.attachments.map(he=>B.jsx(v5,{attachment:he,formatFileSize:Ct,mainColor:h,secondaryColor:m,controlsColor:w},he.id))}),M.content&&M.sender==="user"?B.jsx("div",{className:"px-4 py-2 backdrop-blur-sm break-words w-fit",style:{wordBreak:"break-word",overflowWrap:"break-word",borderRadius:`${N}px`,maxWidth:O+"%",background:Y,color:K},children:B.jsx(so,{remarkPlugins:[uo],components:$n,children:typeof M.content=="string"?M.content.replace(/\n/g,`  
 `):""})}):typeof M.content=="object"?M.content.map((he,ge)=>B.jsx("div",{className:"mb-1 px-4 py-2 backdrop-blur-sm break-words w-fit",style:{wordBreak:"break-word",overflowWrap:"break-word",borderRadius:`${N}px`,maxWidth:O+"%",background:ne,color:$},children:li(he)},ge)):B.jsx("div",{className:"mb-1 px-4 py-2 backdrop-blur-sm break-words w-fit",style:{wordBreak:"break-word",overflowWrap:"break-word",borderRadius:`${N}px`,maxWidth:O+"%",background:ne,color:$},children:B.jsx(so,{remarkPlugins:[uo],components:$n,children:typeof M.content=="string"?M.content.replace(/\n/g,`  
-`):""})}),B.jsx("span",{className:"ml-1 text-[10px] sm:text-xs mt-1",style:{color:w},children:M.timestamp.toLocaleTimeString([],{hour:"2-digit",minute:"2-digit"})})]})]},M.id)),fe&&B.jsxs("div",{className:"flex items-start gap-3",children:[B.jsx("div",{className:"sm:size-8 size-7 rounded-full bg-gradient-to-r  flex items-center justify-center",style:{background:re},children:B.jsx(yA,{className:"sm:size-4 size-3",style:{color:q}})}),B.jsx("div",{className:"px-4 py-2",style:{background:ne,color:$,borderRadius:`${N}px`},children:B.jsxs("div",{className:"flex space-x-1",children:[B.jsx("div",{className:"size-1 sm:size-2 rounded-full animate-bounce",style:{background:$}}),B.jsx("div",{className:"size-1 sm:size-2 rounded-full animate-bounce",style:{background:$,animationDelay:"0.1s"}}),B.jsx("div",{className:"size-1 sm:size-2 rounded-full animate-bounce",style:{background:$,animationDelay:"0.2s"}})]})})]})]}),!cn&&B.jsxs("div",{className:"w-full h-full flex flex-col mt-20 items-center p-4 gap-4",children:[B.jsx("h4",{className:"text-sm font-bold mb-2",style:{color:w},children:"Veuillez fournir vos informations pour commencer à discuter"}),B.jsxs("form",{onSubmit:kl,className:"w-full max-w-xs flex flex-col gap-4 p-6 rounded-2xl shadow-lg",style:{background:h},children:[u?.formFields.includes("full_name")&&B.jsx("input",{type:"text",placeholder:"Nom et prénom",value:Qn,onChange:M=>Rl(M.target.value),className:"py-3 px-4 rounded-lg  outline-none transition-all duration-200",style:{borderRadius:"14px",backgroundColor:w,color:A,borderColor:m}},"full_name"),u?.formFields.includes("phone_number")&&B.jsx("input",{type:"text",placeholder:"Téléphone",value:oi,onChange:M=>Zn(M.target.value),className:"py-3 px-4 rounded-lg  outline-none transition-all duration-200",style:{borderRadius:"14px",backgroundColor:w,color:A,borderColor:m}},"phone_number"),u?.formFields.includes("email")&&B.jsx("input",{type:"email",placeholder:"Email",value:wt,onChange:M=>Qt(M.target.value),className:"py-3 px-4 rounded-lg  outline-none transition-all duration-200",style:{borderRadius:"14px",backgroundColor:w,color:A,borderColor:m}},"email"),B.jsx("button",{type:"submit",className:"py-3 rounded-lg font-bold uppercase outline-none shadow-lg transition-all duration-200",style:{background:`linear-gradient(90deg, ${h}, ${m})`,letterSpacing:"2px",borderRadius:"14px",color:w},children:"Submit"})]})]}),cn&&B.jsxs("div",{className:"absolute bottom-0 left-0 right-0 p-4",style:{background:`linear-gradient(to top, ${y}, transparent)`},children:[Oe.length>0&&B.jsx("div",{className:"flex flex-wrap gap-2 mb-3 p-3 bg-opacity-70 rounded-lg",style:{background:A},children:Oe.map(M=>B.jsx(zr,{attachment:M,onRemove:()=>Pr(M.id)},M.id))}),B.jsxs("div",{className:"flex items-center w-full gap-2 relative",children:[B.jsx("div",{className:"flex-1 relative",children:B.jsxs(B.Fragment,{children:[Xe!=="recording"&&Xe!=="paused"?B.jsxs(B.Fragment,{children:[B.jsx("button",{id:"upload-button-toggle",type:"button",onClick:()=>qe(M=>!M),className:"absolute left-1 bottom-[10px] sm:bottom-3 size-8 sm:size-9 rounded-full flex items-center justify-center transition-all duration-200 z-10 hover:bg-opacity-10",style:{color:w},onMouseEnter:M=>M.currentTarget.style.background=h,onMouseLeave:M=>M.currentTarget.style.background="",children:B.jsx(WP,{className:`size-4 sm:size-5 transition-transform duration-200 ${it?"rotate-45":""}`})}),B.jsx("button",{type:"button",onClick:()=>{dt()},className:"absolute right-1 bottom-[10px] sm:bottom-3 size-8 sm:size-9 rounded-full flex items-center justify-center transition-all duration-200 z-10",style:{color:w},onMouseEnter:M=>M.currentTarget.style.background=h,onMouseLeave:M=>M.currentTarget.style.background="",children:B.jsx(_P,{className:"size-4 sm:size-5"})})]}):B.jsxs(B.Fragment,{children:[B.jsx("button",{type:"button",onClick:()=>{J.current=!0,gt()},className:"absolute left-1 bottom-[10px] sm:bottom-3 size-8 sm:size-9 hover:bg-red-100 hover:bg-opacity-50 rounded-full flex items-center justify-center text-red-500 hover:text-red-600 z-10 after:w-2 after:h-2 after:bg-red-500 after:absolute after:rounded-full after:top-1/2 after:-right-3 after:-translate-y-1/2 after:animate-bounce",children:B.jsx(ZP,{className:"size-4 sm:size-5"})}),B.jsx("button",{type:"button",onClick:()=>{Ie?(Pe(!1),Bt()):(Pe(!0),Nt())},className:"absolute right-11 bottom-[10px] sm:bottom-3 size-8 sm:size-9 rounded-full flex items-center justify-center transition-all duration-200 z-10",style:{color:w},children:Ie?B.jsx(qP,{className:"size-6 sm:size-7"}):B.jsx(zP,{className:"size-6 sm:size-7"})}),B.jsxs("div",{className:"absolute left-16 bottom-4 flex items-center gap-4 z-10 ",style:{color:w},children:[B.jsx("p",{children:ie}),B.jsx("p",{className:`${Xe==="recording"?"animate-pulse":""}`,children:Xe==="recording"?"Recording...":Xe==="paused"?"Paused":"Starting..."})]}),B.jsx("button",{type:"button",onClick:()=>{gt()},className:"absolute right-1 bottom-[10px] sm:bottom-3 size-8 sm:size-9 rounded-full flex items-center justify-center transition-all duration-200 z-10",style:{color:w,background:"green"},children:B.jsx(PP,{className:"size-4 sm:size-5"})})]}),it&&B.jsxs("div",{className:"absolute bottom-12 left-0 rounded-lg shadow-xl border border-gray-700 py-2 min-w-48 z-10",style:{background:F},children:[B.jsxs("button",{id:"document-button",onClick:()=>xa("document"),className:"w-full px-4 py-3 text-left flex items-center gap-3 transition-colors",style:{color:H},onMouseEnter:M=>M.currentTarget.style.background=X,onMouseLeave:M=>M.currentTarget.style.background="",children:[B.jsx("div",{className:"w-8 h-8 bg-blue-600 rounded-full flex items-center justify-center",children:B.jsx(EA,{className:"w-4 h-4 text-white"})}),B.jsx("span",{children:"Document"})]}),B.jsxs("button",{id:"image-button",onClick:()=>xa("image"),className:"w-full px-4 py-3 text-left flex items-center gap-3 transition-colors",style:{color:H},onMouseEnter:M=>M.currentTarget.style.background=X,onMouseLeave:M=>M.currentTarget.style.background="",children:[B.jsx("div",{className:"w-8 h-8 bg-green-600 rounded-full flex items-center justify-center",children:B.jsx(HP,{className:"w-4 h-4 text-white"})}),B.jsx("span",{children:"Photos"})]}),B.jsxs("button",{id:"video-button",onClick:()=>xa("video"),className:"w-full px-4 py-3 text-left flex items-center gap-3 transition-colors",style:{color:H},onMouseEnter:M=>M.currentTarget.style.background=X,onMouseLeave:M=>M.currentTarget.style.background="",children:[B.jsx("div",{className:"w-8 h-8 bg-red-600 rounded-full flex items-center justify-center",children:B.jsx(vA,{className:"w-4 h-4 text-white"})}),B.jsx("span",{children:"Videos"})]}),B.jsxs("button",{id:"audio-button",onClick:()=>xa("audio"),className:"w-full px-4 py-3 text-left flex items-center gap-3 transition-colors",style:{color:H},onMouseEnter:M=>M.currentTarget.style.background=X,onMouseLeave:M=>M.currentTarget.style.background="",children:[B.jsx("div",{className:"w-8 h-8 bg-purple-600 rounded-full flex items-center justify-center",children:B.jsx(Wc,{className:"w-4 h-4 text-white"})}),B.jsx("span",{children:"Audio"})]})]}),B.jsx("textarea",{id:"message-input",ref:si,className:`w-full pt-3 text-xs sm:text-sm sm:pt-4 px-12 resize-none min-h-10 sm:min-h-12 max-h-32 overflow-y-auto focus:outline-none backdrop-blur-sm ${Xe==="recording"||Xe==="paused"?"cursor-default":""}`,value:Xe==="recording"||Xe==="paused"?"":vt,onChange:M=>Ht(M.target.value),placeholder:Xe==="recording"||Xe==="paused"?"":"Type your message...",rows:1,onKeyDown:M=>{M.key==="Enter"&&!M.shiftKey&&(M.preventDefault(),ur())},style:{borderRadius:`${R}px`,background:A,color:w,scrollbarWidth:"thin",scrollbarColor:`${h} transparent`},readOnly:Xe==="recording"||Xe==="paused"})]})}),(vt.trim()||Oe.length!==0)&&B.jsx("div",{className:"w-min",children:B.jsx("button",{onClick:()=>ur(),className:"w-10 h-10 rounded-full flex items-center justify-center transition-all duration-200 transform hover:scale-105",style:{background:h,color:w},children:B.jsx(XP,{className:"w-5 h-5"})})})]}),B.jsx("input",{ref:n,type:"file",multiple:!0,className:"hidden",accept:"image/*",onChange:M=>M.target.files&&Cn(M.target.files,n)}),B.jsx("input",{ref:a,type:"file",multiple:!0,className:"hidden",accept:"video/*",onChange:M=>M.target.files&&Cn(M.target.files,a)}),B.jsx("input",{ref:o,type:"file",multiple:!0,className:"hidden",accept:"audio/*",onChange:M=>M.target.files&&Cn(M.target.files,o)}),B.jsx("input",{ref:l,type:"file",multiple:!0,className:"hidden",accept:".pdf,.doc,.docx,.txt,.csv,.xlsx,.ppt,.pptx,.zip,.rar",onChange:M=>M.target.files&&Cn(M.target.files,l)})]}),ft&&B.jsx("div",{className:"fixed inset-0 z-[998] flex items-center justify-center",style:{background:"rgba(0,0,0,0.45)",backdropFilter:"blur(4px)"},onClick:()=>It(!1),children:B.jsxs("div",{className:"relative w-full max-w-md mx-4 p-6 rounded-2xl shadow-2xl border overflow-hidden animate-[fadeIn_0.25s_ease]",style:{background:`linear-gradient(145deg, ${y}, ${h}, ${m})`,borderRadius:`${R}px`,borderColor:h},onClick:M=>M.stopPropagation(),children:[B.jsx("button",{onClick:()=>It(!1),className:"absolute top-3 right-3 p-1 rounded-full transition-colors","aria-label":"Close bot info",style:{color:w},onMouseEnter:M=>M.currentTarget.style.background=h,onMouseLeave:M=>M.currentTarget.style.background="transparent",children:B.jsx(Ws,{className:"w-5 h-5"})}),e?.bot?B.jsxs("div",{className:"flex flex-col gap-4",children:[B.jsxs("div",{className:"flex items-center gap-4",children:[B.jsx("div",{className:"w-16 h-16 rounded-full p-1 flex items-center justify-center shadow-md overflow-hidden",style:{background:`linear-gradient(to bottom right, ${h}, ${m})`,borderRadius:"1.5rem"},children:B.jsx("img",{src:bn,alt:`${yn} logo`||"Bot avatar",className:"w-full h-full rounded-full",style:{borderRadius:"1.5rem"}})}),B.jsxs("div",{className:"min-w-0",children:[B.jsx("h3",{className:"text-lg font-semibold truncate",title:yn,style:{color:w},children:yn}),B.jsx("div",{className:"mt-1 flex flex-wrap gap-2",children:e?.bot.is_active!==void 0&&B.jsx("span",{className:"px-2 py-0.5 text-xs rounded-full font-medium",style:{backgroundColor:h,color:w},children:e?.bot.is_active?"Active":"Inactive"})})]})]}),e?.bot.description&&B.jsx("div",{className:"max-h-40 overflow-y-auto pr-1",style:{scrollbarWidth:"thin",scrollbarColor:`${h} transparent`},children:B.jsx("p",{className:"text-sm leading-relaxed whitespace-pre-line",style:{wordBreak:"break-word",color:w},children:e?.bot.description})}),B.jsxs("div",{className:"grid grid-cols-2 gap-3 text-xs",style:{color:w},children:[e?.bot.phone_number&&B.jsxs("div",{className:"flex flex-col gap-0.5",children:[B.jsx("span",{className:"uppercase tracking-wide font-bold",style:{color:w},children:"Phone number"}),B.jsx("span",{className:"font-medium break-all",children:e?.bot.phone_number})]}),e?.bot.personality&&B.jsxs("div",{className:"flex flex-col gap-0.5",children:[B.jsx("span",{className:"uppercase tracking-wide font-bold",style:{color:w},children:"Personality"}),B.jsx("span",{className:"font-medium break-all",children:e?.bot.personality})]}),e?.bot.botId==="arts-clinique"&&B.jsxs("div",{className:"flex flex-col gap-0.5",children:[B.jsx("span",{className:"uppercase tracking-wide font-bold",style:{color:w},children:"Website"}),B.jsx("a",{className:"break-all underline font-semibold",href:"https://artsclinic.com",target:"_blank",rel:"noopener noreferrer",children:"https://artsclinic.com"})]}),e?.bot.botId==="arts-clinique"&&B.jsxs("div",{className:"flex flex-col gap-0.5",children:[B.jsx("span",{className:"uppercase tracking-wide font-bold",style:{color:w},children:"Email"}),B.jsx("span",{className:"font-medium break-all",style:{color:w},children:"taj.contact@gmail.com"})]})]})]}):B.jsxs("div",{className:"text-center",style:{color:w},children:[B.jsx("p",{className:"text-sm",children:"No bot selected."}),B.jsx("button",{type:"button",onClick:()=>It(!1),className:"mt-4 px-4 py-2 rounded-lg text-sm font-medium bg-white/10 hover:bg-white/20 text-black transition-colors",style:{borderRadius:`${R}px`},children:"Close"})]})]})})]}),B.jsxs("button",{onClick:()=>{Je(M=>!M),tn.current=!Ge,Ge||xl()},className:"fixed top-1/2 -translate-y-1/2 px-4 py-3 shadow-lg transform",style:{right:"0",transform:Ge?`translateX(-${I}px)`:"translateX(0)",transition:"transform 0.3s cubic-bezier(0.4,0,0.2,1)",background:No,borderTopLeftRadius:`${x}px`,borderBottomLeftRadius:`${P}px`,borderTopRightRadius:`${L}px`,borderBottomRightRadius:`${z}px`,zIndex:999},children:[B.jsx("img",{src:bn,alt:"Tybot logo",className:"w-7 h-7"}),Ta>0&&!Ge?B.jsxs(B.Fragment,{children:[B.jsx("audio",{src:"https://public-assets.content-platform.envatousercontent.com/3a5b6a9c-bead-4397-bc15-393c0f6edb9f/87e342b2-9863-4e6c-83af-edeb375b338d/preview.mp3",className:"hidden",autoPlay:!0}),B.jsx("span",{className:"absolute -top-1 -left-1 bg-red-500 text-white text-xs font-medium size-5 rounded-full flex items-center justify-center",children:Ta>9?"9+":Ta})]}):null]})]})};function w5(e){const t="tybot-widget-container";let n=document.getElementById(t);n||(n=document.createElement("div"),n.id=t,document.body.appendChild(n));const a=n.shadowRoot??n.attachShadow({mode:"open"});if(!document.querySelector("#tybot-widget-fonts")){const d=document.createElement("link");d.rel="preconnect",d.href="https://fonts.googleapis.com";const p=document.createElement("link");p.rel="preconnect",p.href="https://fonts.gstatic.com",p.crossOrigin="";const f=document.createElement("link");f.id="tybot-widget-fonts",f.rel="stylesheet",f.href="https://fonts.googleapis.com/css2?family=Nunito:ital@0;1&display=swap",document.head.append(d),document.head.append(p),document.head.append(f)}if(!a.querySelector("#tybot-widget-style")){const d=document.createElement("style");d.id="tybot-widget-style",d.textContent=QI,a.appendChild(d)}const o=a.querySelector("#tybot-widget-root");o&&o.remove();const l=document.createElement("div");l.id="tybot-widget-root",a.appendChild(l),KI.createRoot(l).render(B.jsx(A5,{config:e}))}Ga.createTybotWidget=w5,Object.defineProperty(Ga,Symbol.toStringTag,{value:"Module"})});
+`):""})}),B.jsx("span",{className:"ml-1 text-[10px] sm:text-xs mt-1",style:{color:w},children:M.timestamp.toLocaleTimeString([],{hour:"2-digit",minute:"2-digit"})})]})]},M.id)),fe&&B.jsxs("div",{className:"flex items-start gap-3",children:[B.jsx("div",{className:"sm:size-8 size-7 rounded-full bg-gradient-to-r  flex items-center justify-center",style:{background:re},children:B.jsx(yA,{className:"sm:size-4 size-3",style:{color:q}})}),B.jsx("div",{className:"px-4 py-2",style:{background:ne,color:$,borderRadius:`${N}px`},children:B.jsxs("div",{className:"flex space-x-1",children:[B.jsx("div",{className:"size-1 sm:size-2 rounded-full animate-bounce",style:{background:$}}),B.jsx("div",{className:"size-1 sm:size-2 rounded-full animate-bounce",style:{background:$,animationDelay:"0.1s"}}),B.jsx("div",{className:"size-1 sm:size-2 rounded-full animate-bounce",style:{background:$,animationDelay:"0.2s"}})]})})]})]}),!cn&&B.jsxs("div",{className:"w-full h-full flex flex-col mt-20 items-center p-4 gap-4",children:[B.jsx("h4",{className:"text-sm font-bold mb-2",style:{color:w},children:"Veuillez fournir vos informations pour commencer à discuter"}),B.jsxs("form",{onSubmit:kl,className:"w-full max-w-xs flex flex-col gap-4 p-6 rounded-2xl shadow-lg",style:{background:h},children:[u?.formFields.includes("full_name")&&B.jsx("input",{type:"text",placeholder:"Nom et prénom",value:Qn,onChange:M=>Rl(M.target.value),className:"py-3 px-4 rounded-lg  outline-none transition-all duration-200",style:{borderRadius:"14px",backgroundColor:w,color:A,borderColor:m}},"full_name"),u?.formFields.includes("phone_number")&&B.jsx("input",{type:"text",placeholder:"Téléphone",value:oi,onChange:M=>Zn(M.target.value),className:"py-3 px-4 rounded-lg  outline-none transition-all duration-200",style:{borderRadius:"14px",backgroundColor:w,color:A,borderColor:m}},"phone_number"),u?.formFields.includes("email")&&B.jsx("input",{type:"email",placeholder:"Email",value:wt,onChange:M=>Qt(M.target.value),className:"py-3 px-4 rounded-lg  outline-none transition-all duration-200",style:{borderRadius:"14px",backgroundColor:w,color:A,borderColor:m}},"email"),B.jsx("button",{type:"submit",className:"py-3 rounded-lg font-bold uppercase outline-none shadow-lg transition-all duration-200",style:{background:`linear-gradient(90deg, ${h}, ${m})`,letterSpacing:"2px",borderRadius:"14px",color:w},children:"Submit"})]})]}),cn&&B.jsxs("div",{className:"absolute bottom-0 left-0 right-0 p-4",style:{background:`linear-gradient(to top, ${y}, transparent)`},children:[Oe.length>0&&B.jsx("div",{className:"flex flex-wrap gap-2 mb-3 p-3 bg-opacity-70 rounded-lg",style:{background:A},children:Oe.map(M=>B.jsx(zr,{attachment:M,onRemove:()=>Pr(M.id)},M.id))}),B.jsxs("div",{className:"flex items-center w-full gap-2 relative",children:[B.jsx("div",{className:"flex-1 relative",children:B.jsxs(B.Fragment,{children:[Xe!=="recording"&&Xe!=="paused"?B.jsxs(B.Fragment,{children:[B.jsx("button",{id:"upload-button-toggle",type:"button",onClick:()=>qe(M=>!M),className:"absolute left-1 bottom-[10px] sm:bottom-3 size-8 sm:size-9 rounded-full flex items-center justify-center transition-all duration-200 z-10 hover:bg-opacity-10",style:{color:w},onMouseEnter:M=>M.currentTarget.style.background=h,onMouseLeave:M=>M.currentTarget.style.background="",children:B.jsx(WP,{className:`size-4 sm:size-5 transition-transform duration-200 ${it?"rotate-45":""}`})}),B.jsx("button",{type:"button",onClick:()=>{dt()},className:"absolute right-1 bottom-[10px] sm:bottom-3 size-8 sm:size-9 rounded-full flex items-center justify-center transition-all duration-200 z-10",style:{color:w},onMouseEnter:M=>M.currentTarget.style.background=h,onMouseLeave:M=>M.currentTarget.style.background="",children:B.jsx(_P,{className:"size-4 sm:size-5"})})]}):B.jsxs(B.Fragment,{children:[B.jsx("button",{type:"button",onClick:()=>{J.current=!0,gt()},className:"absolute left-1 bottom-[10px] sm:bottom-3 size-8 sm:size-9 hover:bg-red-100 hover:bg-opacity-50 rounded-full flex items-center justify-center text-red-500 hover:text-red-600 z-10 after:w-2 after:h-2 after:bg-red-500 after:absolute after:rounded-full after:top-1/2 after:-right-3 after:-translate-y-1/2 after:animate-bounce",children:B.jsx(ZP,{className:"size-4 sm:size-5"})}),B.jsx("button",{type:"button",onClick:()=>{Ie?(Pe(!1),Bt()):(Pe(!0),Nt())},className:"absolute right-11 bottom-[10px] sm:bottom-3 size-8 sm:size-9 rounded-full flex items-center justify-center transition-all duration-200 z-10",style:{color:w},children:Ie?B.jsx(qP,{className:"size-6 sm:size-7"}):B.jsx(zP,{className:"size-6 sm:size-7"})}),B.jsxs("div",{className:"absolute left-16 bottom-4 flex items-center gap-4 z-10 ",style:{color:w},children:[B.jsx("p",{children:ie}),B.jsx("p",{className:`${Xe==="recording"?"animate-pulse":""}`,children:Xe==="recording"?"Recording...":Xe==="paused"?"Paused":"Starting..."})]}),B.jsx("button",{type:"button",onClick:()=>{gt()},className:"absolute right-1 bottom-[10px] sm:bottom-3 size-8 sm:size-9 rounded-full flex items-center justify-center transition-all duration-200 z-10",style:{color:w,background:"green"},children:B.jsx(PP,{className:"size-4 sm:size-5"})})]}),it&&B.jsxs("div",{className:"absolute bottom-12 left-0 rounded-lg shadow-xl border border-gray-700 py-2 min-w-48 z-10",style:{background:F},children:[B.jsxs("button",{id:"document-button",onClick:()=>xa("document"),className:"w-full px-4 py-3 text-left flex items-center gap-3 transition-colors",style:{color:H},onMouseEnter:M=>M.currentTarget.style.background=X,onMouseLeave:M=>M.currentTarget.style.background="",children:[B.jsx("div",{className:"w-8 h-8 bg-blue-600 rounded-full flex items-center justify-center",children:B.jsx(EA,{className:"w-4 h-4 text-white"})}),B.jsx("span",{children:"Document"})]}),B.jsxs("button",{id:"image-button",onClick:()=>xa("image"),className:"w-full px-4 py-3 text-left flex items-center gap-3 transition-colors",style:{color:H},onMouseEnter:M=>M.currentTarget.style.background=X,onMouseLeave:M=>M.currentTarget.style.background="",children:[B.jsx("div",{className:"w-8 h-8 bg-green-600 rounded-full flex items-center justify-center",children:B.jsx(HP,{className:"w-4 h-4 text-white"})}),B.jsx("span",{children:"Photos"})]}),B.jsxs("button",{id:"video-button",onClick:()=>xa("video"),className:"w-full px-4 py-3 text-left flex items-center gap-3 transition-colors",style:{color:H},onMouseEnter:M=>M.currentTarget.style.background=X,onMouseLeave:M=>M.currentTarget.style.background="",children:[B.jsx("div",{className:"w-8 h-8 bg-red-600 rounded-full flex items-center justify-center",children:B.jsx(vA,{className:"w-4 h-4 text-white"})}),B.jsx("span",{children:"Videos"})]}),B.jsxs("button",{id:"audio-button",onClick:()=>xa("audio"),className:"w-full px-4 py-3 text-left flex items-center gap-3 transition-colors",style:{color:H},onMouseEnter:M=>M.currentTarget.style.background=X,onMouseLeave:M=>M.currentTarget.style.background="",children:[B.jsx("div",{className:"w-8 h-8 bg-purple-600 rounded-full flex items-center justify-center",children:B.jsx(Wc,{className:"w-4 h-4 text-white"})}),B.jsx("span",{children:"Audio"})]})]}),B.jsx("textarea",{id:"message-input",ref:si,className:`w-full pt-3 text-xs sm:text-sm sm:pt-4 px-12 resize-none min-h-10 sm:min-h-12 max-h-32 overflow-y-auto focus:outline-none backdrop-blur-sm ${Xe==="recording"||Xe==="paused"?"cursor-default":""}`,value:Xe==="recording"||Xe==="paused"?"":vt,onChange:M=>Ht(M.target.value),placeholder:Xe==="recording"||Xe==="paused"?"":"Type your message...",rows:1,onKeyDown:M=>{M.key==="Enter"&&!M.shiftKey&&(M.preventDefault(),ur())},style:{borderRadius:`${R}px`,background:A,color:w,scrollbarWidth:"thin",scrollbarColor:`${h} transparent`},readOnly:Xe==="recording"||Xe==="paused"})]})}),(vt.trim()||Oe.length!==0)&&B.jsx("div",{className:"w-min",children:B.jsx("button",{onClick:()=>ur(),className:"w-10 h-10 rounded-full flex items-center justify-center transition-all duration-200 transform hover:scale-105",style:{background:h,color:w},children:B.jsx(XP,{className:"w-5 h-5"})})})]}),B.jsx("input",{ref:n,type:"file",multiple:!0,className:"hidden",accept:"image/*",onChange:M=>M.target.files&&Cn(M.target.files,n)}),B.jsx("input",{ref:a,type:"file",multiple:!0,className:"hidden",accept:"video/*",onChange:M=>M.target.files&&Cn(M.target.files,a)}),B.jsx("input",{ref:o,type:"file",multiple:!0,className:"hidden",accept:"audio/*",onChange:M=>M.target.files&&Cn(M.target.files,o)}),B.jsx("input",{ref:l,type:"file",multiple:!0,className:"hidden",accept:".pdf,.doc,.docx,.txt,.csv,.xlsx,.ppt,.pptx,.zip,.rar",onChange:M=>M.target.files&&Cn(M.target.files,l)})]}),ft&&B.jsx("div",{className:"fixed inset-0 z-[998] flex items-center justify-center",style:{background:"rgba(0,0,0,0.45)",backdropFilter:"blur(4px)"},onClick:()=>It(!1),children:B.jsxs("div",{className:"relative w-full max-w-md mx-4 p-6 rounded-2xl shadow-2xl border overflow-hidden animate-[fadeIn_0.25s_ease]",style:{background:`linear-gradient(145deg, ${y}, ${h}, ${m})`,borderRadius:`${R}px`,borderColor:h},onClick:M=>M.stopPropagation(),children:[B.jsx("button",{onClick:()=>It(!1),className:"absolute top-3 right-3 p-1 rounded-full transition-colors","aria-label":"Close bot info",style:{color:w},onMouseEnter:M=>M.currentTarget.style.background=h,onMouseLeave:M=>M.currentTarget.style.background="transparent",children:B.jsx(Ws,{className:"w-5 h-5"})}),e?.bot?B.jsxs("div",{className:"flex flex-col gap-4",children:[B.jsxs("div",{className:"flex items-center gap-4",children:[B.jsx("div",{className:"w-16 h-16 rounded-full p-1 flex items-center justify-center shadow-md overflow-hidden",style:{background:`linear-gradient(to bottom right, ${h}, ${m})`,borderRadius:"1.5rem"},children:B.jsx("img",{src:bn,alt:`${yn} logo`||"Bot avatar",className:"w-full h-full rounded-full",style:{borderRadius:"1.5rem"}})}),B.jsxs("div",{className:"min-w-0",children:[B.jsx("h3",{className:"text-lg font-semibold truncate",title:yn,style:{color:w},children:yn}),B.jsx("div",{className:"mt-1 flex flex-wrap gap-2",children:e?.bot.is_active!==void 0&&B.jsx("span",{className:"px-2 py-0.5 text-xs rounded-full font-medium",style:{backgroundColor:h,color:w},children:e?.bot.is_active?"Active":"Inactive"})})]})]}),e?.bot.description&&B.jsx("div",{className:"max-h-40 overflow-y-auto pr-1",style:{scrollbarWidth:"thin",scrollbarColor:`${h} transparent`},children:B.jsx("p",{className:"text-sm leading-relaxed whitespace-pre-line",style:{wordBreak:"break-word",color:w},children:e?.bot.description})}),B.jsxs("div",{className:"grid grid-cols-2 gap-3 text-xs",style:{color:w},children:[(e?.bot.phone_number||e?.bot?.botId==="arts-clinique")&&B.jsxs("div",{className:"flex flex-col gap-0.5",children:[B.jsx("span",{className:"uppercase tracking-wide font-bold",style:{color:w},children:"Phone number"}),B.jsx("span",{className:"font-medium break-all",children:e?.bot?.botId==="arts-clinique"?B.jsxs("span",{children:["+212 662-300307",B.jsx("br",{}),"+212 5222-58484"]}):e?.bot?.phone_number})]}),e?.bot.personality&&B.jsxs("div",{className:"flex flex-col gap-0.5",children:[B.jsx("span",{className:"uppercase tracking-wide font-bold",style:{color:w},children:"Personality"}),B.jsx("span",{className:"font-medium break-all",children:e?.bot.personality})]}),e?.bot.botId==="arts-clinique"&&B.jsxs("div",{className:"flex flex-col gap-0.5",children:[B.jsx("span",{className:"uppercase tracking-wide font-bold",style:{color:w},children:"Website"}),B.jsx("a",{className:"break-all underline font-semibold",href:"https://artsclinic.com",target:"_blank",rel:"noopener noreferrer",children:"https://artsclinic.com"})]}),e?.bot.botId==="arts-clinique"&&B.jsxs("div",{className:"flex flex-col gap-0.5",children:[B.jsx("span",{className:"uppercase tracking-wide font-bold",style:{color:w},children:"Email"}),B.jsx("span",{className:"font-medium break-all",style:{color:w},children:"taj.contact@gmail.com"})]})]})]}):B.jsxs("div",{className:"text-center",style:{color:w},children:[B.jsx("p",{className:"text-sm",children:"No bot selected."}),B.jsx("button",{type:"button",onClick:()=>It(!1),className:"mt-4 px-4 py-2 rounded-lg text-sm font-medium bg-white/10 hover:bg-white/20 text-black transition-colors",style:{borderRadius:`${R}px`},children:"Close"})]})]})})]}),B.jsxs("button",{onClick:()=>{Je(M=>!M),tn.current=!Ge,Ge||xl()},className:"fixed top-1/2 -translate-y-1/2 px-4 py-3 shadow-lg transform",style:{right:"0",transform:Ge?`translateX(-${I}px)`:"translateX(0)",transition:"transform 0.3s cubic-bezier(0.4,0,0.2,1)",background:No,borderTopLeftRadius:`${x}px`,borderBottomLeftRadius:`${P}px`,borderTopRightRadius:`${L}px`,borderBottomRightRadius:`${z}px`,zIndex:999},children:[B.jsx("img",{src:bn,alt:"Tybot logo",className:"w-7 h-7"}),Ta>0&&!Ge?B.jsxs(B.Fragment,{children:[B.jsx("audio",{src:"https://public-assets.content-platform.envatousercontent.com/3a5b6a9c-bead-4397-bc15-393c0f6edb9f/87e342b2-9863-4e6c-83af-edeb375b338d/preview.mp3",className:"hidden",autoPlay:!0}),B.jsx("span",{className:"absolute -top-1 -left-1 bg-red-500 text-white text-xs font-medium size-5 rounded-full flex items-center justify-center",children:Ta>9?"9+":Ta})]}):null]})]})};function w5(e){const t="tybot-widget-container";let n=document.getElementById(t);n||(n=document.createElement("div"),n.id=t,document.body.appendChild(n));const a=n.shadowRoot??n.attachShadow({mode:"open"});if(!document.querySelector("#tybot-widget-fonts")){const d=document.createElement("link");d.rel="preconnect",d.href="https://fonts.googleapis.com";const p=document.createElement("link");p.rel="preconnect",p.href="https://fonts.gstatic.com",p.crossOrigin="";const f=document.createElement("link");f.id="tybot-widget-fonts",f.rel="stylesheet",f.href="https://fonts.googleapis.com/css2?family=Nunito:ital@0;1&display=swap",document.head.append(d),document.head.append(p),document.head.append(f)}if(!a.querySelector("#tybot-widget-style")){const d=document.createElement("style");d.id="tybot-widget-style",d.textContent=QI,a.appendChild(d)}const o=a.querySelector("#tybot-widget-root");o&&o.remove();const l=document.createElement("div");l.id="tybot-widget-root",a.appendChild(l),KI.createRoot(l).render(B.jsx(A5,{config:e}))}Ga.createTybotWidget=w5,Object.defineProperty(Ga,Symbol.toStringTag,{value:"Module"})});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tybotflow-widget",
-  "version": "0.1.0",
+  "version": "0.1.2",
   "description": "A modern, customizable React widget for Tybot chat integration.",
   "license": "ISC",
   "main": "dist/index.umd.js",