@marketrix.ai/widget 3.8.142 → 3.8.143

package/dist/widget.mjs

@@ -34,10 +34,10 @@ return g(Dl,{align:"center",justify:"center",gap:"lg",paddingY:"2xl",paddingX:"x
 return g(Ml,{align:"start",gap:"md",children:[!n&&(()=>{switch(t){case"completed":/* @__PURE__ */return f(Ol,{name:"checkCircle",style:{color:o,marginTop:"2px",flexShrink:0},size:16});case"failed":/* @__PURE__ */return f(Ol,{name:"timesCircle",style:{opacity:.65,marginTop:"2px",flexShrink:0},size:16});case"stopped":/* @__PURE__ */return f(Ol,{name:"ban",style:{opacity:.5,marginTop:"2px",flexShrink:0},size:16});default:/* @__PURE__ */return f(kd,{size:"sm",style:{color:o,marginTop:"2px"}})}})(),/* @__PURE__ */f(Ul,{as:"span",size:"xs",weight:"medium",style:{flex:1,whiteSpace:"pre-wrap",lineHeight:"tight",opacity:"muted"===r?.5:1},children:e})]})},zd=({isWaitingForUser:e})=>/* @__PURE__ */g(Ml,{align:"center",gap:"sm",paddingY:"xs",children:[/* @__PURE__ */f(kd,{size:"sm"}),/* @__PURE__ */f(Ul,{as:"span",size:"xs",weight:"normal",variant:"faint",children:e?"Waiting for you to complete the action":"Thinking"})]}),Ed=({message:e,isLastMessage:t})=>{const{state:n}=os(),r="waiting-for-user"===(e.placeholderState||"thinking");return e.parts&&e.parts.length>0?/* @__PURE__ */g(Dl,{gap:"sm",children:[e.parts.map((t,n)=>{if("text"===t.type){let e=(r=t.content,r.replace(/\n\n__THINKING__$/,"").replace(/__THINKING__/g,"")).trim();return e=e.replace(/\(Cancelled by cleanup\)/gi,"").replace(/\s+/g," ").trim(),e?/* @__PURE__ */f(Ul,{as:"div",size:"sm",weight:"medium",style:{lineHeight:"tight",wordBreak:"break-word",whiteSpace:"pre-wrap",marginBottom:"4px"},children:e},`part-${n}`):null}return"progress"===t.type?"done"===t.browserToolName&&"done"===e.simulationStatus?null:/* @__PURE__ */f(Sd,{content:t.content,status:t.status||"in_progress",...void 0!==t.hideIcon?{hideIcon:t.hideIcon}:{},...void 0!==t.textStyle?{textStyle:t.textStyle}:{}},`part-${n}`):null;var r}),(e.isPlaceholder&&!e.parts.some(e=>"text"===e.type)||n.isSimulationRunning&&t&&("show"===e.mode||"do"===e.mode))&&/* @__PURE__ */f(zd,{isWaitingForUser:r})]}):e.isPlaceholder||n.isSimulationRunning&&t&&("show"===e.mode||"do"===e.mode)?/* @__PURE__ */f(zd,{isWaitingForUser:r}):e.content?/* @__PURE__ */f(Ul,{as:"div",size:"sm",weight:"medium",style:{lineHeight:"tight",wordBreak:"break-word",whiteSpace:"pre-wrap"},children:e.content}):/* @__PURE__ */f(Hc,{})},Id=({status:e})=>{const{config:t}=os(),n=t.widget_accent_color;switch(e){case"done":/* @__PURE__ */return f(Ol,{name:"checkCircle",style:{color:n,flexShrink:0},size:14});case"failed":/* @__PURE__ */return f(Ol,{name:"exclamationCircle",style:{color:k(n,.75),flexShrink:0},size:14});case"stopped":/* @__PURE__ */return f(Ol,{name:"circle",style:{color:k(n,.5),flexShrink:0},size:14});default:/* @__PURE__ */return f(kd,{size:"sm",style:{color:n}})}},Cd=i(function({className:e,...t},n){/* @__PURE__ */
 return f("video",{...t,ref:n,className:Ec(e)})}),Td="8px 8px 0 0",Ad="#111827",$d="rgba(255,255,255,0.7)",Md=({stream:e})=>{const t=u(null),n=u(null),[r,i]=p(!1),[o,a]=p(!1);return s(()=>{if(t.current&&e){const r=t.current;i(!1),a(!1),n.current&&(n.current.catch(()=>{}),n.current=null),r.srcObject=e;const o=()=>{i(!0)},s=()=>{a(!0),i(!1)};r.addEventListener("loadedmetadata",o),r.addEventListener("error",s);const c=r.play();return n.current=c,c.then(()=>{i(!0)}).catch(e=>{e instanceof Error&&"AbortError"!==e.name&&a(!0),n.current=null}),()=>{r.removeEventListener("loadedmetadata",o),r.removeEventListener("error",s)}}return()=>{n.current&&(n.current.catch(()=>{}),n.current=null),t.current&&(t.current.srcObject=null),i(!1),a(!1)}},[e]),e?/* @__PURE__ */g(Hc,{width:"full",overflow:"hidden",position:"relative",style:{marginBottom:"4px",borderRadius:Td,backgroundColor:"#000000",boxShadow:"0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -1px rgba(0,0,0,0.06)"},children:[!r&&!o&&/* @__PURE__ */f(Ml,{position:"absolute",inset:"0",align:"center",justify:"center",style:{backgroundColor:Ad,borderRadius:Td,zIndex:10,transition:"opacity 300ms",opacity:r?0:1},children:/* @__PURE__ */g(Ml,{direction:"column",align:"center",gap:"md",children:[/* @__PURE__ */f(kd,{size:"lg",style:{color:"white"}}),/* @__PURE__ */f(Ul,{as:"span",size:"xs",weight:"medium",style:{color:$d},children:"Loading stream..."})]})}),o&&/* @__PURE__ */f(Ml,{position:"absolute",inset:"0",align:"center",justify:"center",style:{backgroundColor:Ad,borderRadius:Td,zIndex:10},children:/* @__PURE__ */g(Ml,{direction:"column",align:"center",gap:"md",style:{textAlign:"center",paddingLeft:"16px",paddingRight:"16px"},children:[/* @__PURE__ */f(Ol,{name:"alertCircle",size:32,style:{color:"#9ca3af"}}),/* @__PURE__ */f(Ul,{as:"span",size:"xs",weight:"medium",style:{color:$d},children:"Failed to load stream"})]})}),
 /* @__PURE__ */f(Cd,{ref:t,autoPlay:!0,muted:!0,playsInline:!0,style:{width:"100%",height:"auto",maxHeight:"192px",objectFit:"contain",borderRadius:Td,transition:"opacity 500ms",opacity:r?1:0,minHeight:"120px",background:"linear-gradient(135deg, #111827 0%, #374151 100%)"}}),r&&!o&&/* @__PURE__ */g(Ml,{position:"absolute",align:"center",gap:"sm",animate:"fadeIn",style:{top:"8px",right:"8px",padding:"4px 8px",borderRadius:"9999px",backgroundColor:"rgba(55,65,81,0.9)",backdropFilter:"blur(4px)",zIndex:20,boxShadow:"0 2px 8px rgba(31, 41, 55, 0.4)"},children:[/* @__PURE__ */g(Ml,{position:"relative",align:"center",justify:"center",children:[/* @__PURE__ */f(Hc,{position:"absolute",rounded:"full",animate:"ping",style:{width:"8px",height:"8px",backgroundColor:"white",opacity:.75}}),/* @__PURE__ */f(Hc,{position:"relative",rounded:"full",style:{width:"6px",height:"6px",backgroundColor:"white"}})]}),/* @__PURE__ */f(Ul,{as:"span",size:"xs",weight:"semibold",style:{color:"white",textTransform:"uppercase",letterSpacing:"0.05em",fontSize:"10px"},children:"Live"})]}),
-/* @__PURE__ */f(Ml,{position:"absolute",inset:"0",align:"center",justify:"center",style:{borderRadius:Td,backgroundColor:"rgba(0,0,0,0)",zIndex:30,pointerEvents:"none"},children:/* @__PURE__ */f(Hc,{rounded:"lg",style:{padding:"4px 12px",backgroundColor:"rgba(0,0,0,0.7)",backdropFilter:"blur(4px)"},children:/* @__PURE__ */f(Ul,{as:"div",size:"xs",weight:"medium",style:{color:"white"},children:"Screen Sharing Active"})})})]}):null},Nd=({message:e,index:t,isLastMessage:n,onScreenAccessAllow:r,onScreenAccessDeny:i})=>{if(e.isSystemMessage)/* @__PURE__ */return f(Ml,{justify:"center",align:"center",children:/* @__PURE__ */f(Ul,{as:"span",variant:"faint",weight:"normal",style:{fontSize:"10px"},children:e.content})},`message-${e.id}-${t}`);const o="user"===e.sender;/* @__PURE__ */
+/* @__PURE__ */f(Ml,{position:"absolute",inset:"0",align:"center",justify:"center",style:{borderRadius:Td,backgroundColor:"rgba(0,0,0,0)",zIndex:30,pointerEvents:"none"},children:/* @__PURE__ */f(Hc,{rounded:"lg",style:{padding:"4px 12px",backgroundColor:"rgba(0,0,0,0.7)",backdropFilter:"blur(4px)"},children:/* @__PURE__ */f(Ul,{as:"div",size:"xs",weight:"medium",style:{color:"white"},children:"Screen Sharing Active"})})})]}):null},Nd=({message:e,index:t,isLastMessage:n,onScreenAccessAllow:r,onScreenAccessDeny:i})=>{if(e.isSystemMessage)/* @__PURE__ */return f(Ml,{justify:"center",align:"center",children:/* @__PURE__ */f(Ul,{as:"span",variant:"faint",weight:"normal",style:{fontSize:"10px"},children:e.content})},`message-${e.id}-${t}`);const o="user"===e.sender,a=o?"show"===e.mode||"do"===e.mode?"mousePointerClick":void 0:e.isScreenAccessRequest||"waiting-for-user"===e.placeholderState?"checkCircle":void 0;/* @__PURE__ */
 return g(Dl,{style:{marginTop:"10px"},role:"article","aria-roledescription":"message","aria-label":o?"You said…":"Agent says…",animate:n?"fadeIn":void 0,children:[/* @__PURE__ */g(Ml,{align:"start",gap:"sm",width:"full",children:[
 /* @__PURE__ */f(Ml,{shrink:!1,style:{width:"20px",height:"20px",marginTop:"6px"},children:!o&&/* @__PURE__ */f(Uc,{src:"data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20id='Layer_1'%20xmlns='http://www.w3.org/2000/svg'%20version='1.1'%20viewBox='0%200%20361%20360'%3e%3c!--%20Generator:%20Adobe%20Illustrator%2030.1.0,%20SVG%20Export%20Plug-In%20.%20SVG%20Version:%202.1.1%20Build%20136)%20--%3e%3cdefs%3e%3cstyle%3e%20.st0%20{%20display:%20none;%20fill:%20none;%20stroke:%20%23cdc9c2;%20stroke-width:%201.3px;%20}%20.st1%20{%20fill:%20%23fff;%20}%20.st2,%20.st3%20{%20fill:%20%237cffa6;%20}%20.st3%20{%20stroke:%20%237cffa6;%20stroke-width:%20.38px;%20}%20.st4%20{%20fill:%20%23101828;%20}%20%3c/style%3e%3c/defs%3e%3crect%20class='st4'%20x='.5'%20width='360'%20height='360'/%3e%3cpath%20class='st2'%20d='M83.37,209.58c15.35,0,27.8-12.45,27.8-27.8s-12.44-27.79-27.8-27.79-27.8,12.44-27.8,27.79,12.44,27.8,27.8,27.8Z'/%3e%3cpath%20class='st1'%20d='M85.86,68.28l152.45,223.44h67.29l-70.62-113.77,68.13-109.67h-67.29l-41.12,65.31-41.54-65.31h-67.29Z'/%3e%3cpath%20class='st3'%20d='M176.61,249.83l-35.08-51-57.82,92.71h66.85l26.05-41.7Z'/%3e%3crect%20class='st0'%20x='1.25'%20y='.65'%20width='358.7'%20height='358.7'%20rx='43.35'%20ry='43.35'/%3e%3c/svg%3e",alt:"Marketrix AI",size:20,fit:"cover",rounded:"theme",style:{border:"none",outline:"none",display:"block",backgroundColor:"transparent"}})}),
-/* @__PURE__ */g(Dl,{grow:!0,position:"relative",rounded:"theme",elevation:"card",style:{padding:e.videoStream?"0":"8px 10px",border:"1px solid transparent",backgroundColor:o?"var(--primary)":void 0,color:o?"var(--primary-foreground)":"var(--foreground)"},children:[e.videoStream&&/* @__PURE__ */f(Md,{stream:e.videoStream}),!e.videoStream&&/* @__PURE__ */f(Ed,{message:e,isLastMessage:n}),e.isScreenAccessRequest&&!e.screenShareStatus&&/* @__PURE__ */g(Ml,{align:"center",gap:"sm",style:{marginTop:"6px"},children:[/* @__PURE__ */f($l,{type:"button",variant:"primary",size:"sm",shape:"pill",onClick:()=>r?.(),children:"Yes"}),/* @__PURE__ */f($l,{type:"button",variant:"secondary",size:"sm",shape:"pill",onClick:()=>i?.(),children:"No"})]}),e.isScreenAccessRequest&&e.screenShareStatus&&/* @__PURE__ */f(Ul,{as:"div",variant:"faint",size:"xs",italic:!0,style:{marginTop:"2px"},children:"allowed"===e.screenShareStatus?"Sure":"Check HTML Instead"}),!o&&e.simulationStatus&&/* @__PURE__ */f(Ml,{position:"absolute",align:"center",justify:"center",style:{bottom:"4px",right:"4px"},children:/* @__PURE__ */f(Id,{status:e.simulationStatus})})]}),
+/* @__PURE__ */g(Dl,{grow:!0,position:"relative",rounded:"theme",elevation:"card",style:{padding:e.videoStream?"0":"8px 10px",border:"1px solid transparent",backgroundColor:o?"var(--primary)":void 0,color:o?"var(--primary-foreground)":"var(--foreground)"},children:[e.videoStream&&/* @__PURE__ */f(Md,{stream:e.videoStream}),!e.videoStream&&(a?/* @__PURE__ */g(Ml,{align:"start",gap:"sm",children:[/* @__PURE__ */f(Ml,{shrink:!1,style:{marginTop:"3px"},children:/* @__PURE__ */f(Ol,{name:a,size:13})}),/* @__PURE__ */f(Dl,{grow:!0,children:/* @__PURE__ */f(Ed,{message:e,isLastMessage:n})})]}):/* @__PURE__ */f(Ed,{message:e,isLastMessage:n})),e.isScreenAccessRequest&&!e.screenShareStatus&&/* @__PURE__ */g(Ml,{align:"center",gap:"sm",style:{marginTop:"6px"},children:[/* @__PURE__ */f($l,{type:"button",variant:"primary",size:"sm",shape:"pill",onClick:()=>r?.(),children:"Yes"}),/* @__PURE__ */f($l,{type:"button",variant:"secondary",size:"sm",shape:"pill",onClick:()=>i?.(),children:"No"})]}),e.isScreenAccessRequest&&e.screenShareStatus&&/* @__PURE__ */f(Ul,{as:"div",variant:"faint",size:"xs",italic:!0,style:{marginTop:"2px"},children:"allowed"===e.screenShareStatus?"Sure":"Check HTML Instead"}),!o&&e.simulationStatus&&/* @__PURE__ */f(Ml,{position:"absolute",align:"center",justify:"center",style:{bottom:"4px",right:"4px"},children:/* @__PURE__ */f(Id,{status:e.simulationStatus})})]}),
 /* @__PURE__ */f(Ml,{shrink:!1,style:{width:"20px"}})]}),!e.isPlaceholder&&/* @__PURE__ */f(Ul,{as:"div",variant:"faint",size:"xxs",align:"right",style:{marginTop:"2px",marginRight:"26px"},children:S(e.timestamp)})]},`message-${e.id}-${t}`)},Od={boxShadow:Ic.button,backgroundColor:"var(--card)",border:"1px solid var(--border)",pointerEvents:"auto"},Pd=({messages:e,messagesEndRef:t,config:n,onScreenAccessAllow:r,onScreenAccessDeny:i,onClearChat:o})=>{const{config:a,state:c,isPreviewMode:l}=os({config:n}),[h,m]=p(!1),[w,b]=p(!1),y=u(null),v=d(()=>({id:"welcome",content:a.widget_body??"How can I help you today?",sender:"agent",timestamp:/* @__PURE__ */new Date,isPlaceholder:!1}),[a.widget_body]),x=d(()=>[v,...e],[v,e]),_=()=>{if(y.current){const{scrollTop:e,scrollHeight:t,clientHeight:n}=y.current;m(e>200),b(!(Math.abs(t-e-n)<50)&&t>n)}};return s(()=>{window.requestAnimationFrame(()=>{t.current&&(!l&&t.current.scrollIntoView({behavior:"auto"}),!l&&_())})},[e.length,l]),s(()=>{const e=y.current;e&&!l&&e.scrollHeight-e.scrollTop-e.clientHeight<120&&window.requestAnimationFrame(()=>t.current?.scrollIntoView({behavior:"auto"}))},[e[e.length-1]?.content?.length??0,l,t]),/* @__PURE__ */g(Hc,{position:"relative",height:"full",children:[
 /* @__PURE__ */g(Hc,{ref:y,onScroll:_,role:"log","aria-relevant":"additions",height:"full",overflowY:"auto",paddingX:"lg",paddingY:"sm",style:{backgroundColor:a.widget_background_color.includes("gradient")?"transparent":a.widget_background_color,backgroundImage:a.widget_background_color.includes("gradient")?a.widget_background_color:`linear-gradient(135deg, ${a.widget_background_color} 0%, ${a.widget_background_color} 100%)`,scrollbarColor:`${k(a.widget_border_color,.3)} ${k(a.widget_border_color,.1)}`,scrollbarWidth:"thin"},children:[0===e.length&&c.isLoading&&/* @__PURE__ */f(_d,{variant:"loading",message:"Connecting…"}),x.map((e,t)=>/* @__PURE__ */f(Nd,{message:e,index:t,isLastMessage:t===x.length-1,onScreenAccessAllow:r,onScreenAccessDeny:i},`message-${e.id}-${t}`)),e.length>0&&o&&/* @__PURE__ */f(Ml,{justify:"center",style:{marginTop:"12px",marginBottom:"4px"},children:/* @__PURE__ */f($l,{type:"button",variant:"bare",onClick:()=>{const e=o();e instanceof Promise&&e.catch(e=>{})},children:/* @__PURE__ */f(Ul,{size:"xs",variant:"muted",style:{cursor:"pointer"},children:"Clear conversation"})})}),
 /* @__PURE__ */f(Hc,{ref:t},"scroll-anchor")]},"message-list-container"),h&&/* @__PURE__ */f(Ml,{position:"absolute",justify:"center",style:{top:"8px",left:0,right:0,zIndex:10,pointerEvents:"none"},children:/* @__PURE__ */f(jl,{variant:"secondary",size:"sm",label:"Scroll to top",onClick:()=>{y.current?.scrollTo({top:0,behavior:"smooth"})},style:Od,children:/* @__PURE__ */f(Ol,{name:"arrowUp",size:10,style:{color:a.widget_accent_color}})})}),w&&/* @__PURE__ */f(Ml,{position:"absolute",justify:"center",style:{bottom:"8px",left:0,right:0,zIndex:10,pointerEvents:"none"},children:/* @__PURE__ */f(jl,{variant:"secondary",size:"sm",label:"Scroll to bottom",onClick:()=>{t.current&&!l&&t.current.scrollIntoView({behavior:"smooth"})},style:Od,children:/* @__PURE__ */f(Ol,{name:"arrowDown",size:10,style:{color:a.widget_accent_color}})})})]})},Rd=class extends t.Component{constructor(e){super(e),this.state={hasError:!1}}static getDerivedStateFromError(){return{hasError:!0}}componentDidCatch(e,t){}render(){return this.state.hasError?/* @__PURE__ */f(Ul,{as:"div",size:"xs",align:"center",style:{padding:"16px",color:"var(--muted-foreground)"},children:"Something went wrong displaying messages. Please refresh."}):this.props.children}},Ld={show:"mousePointerClick",tell:"chatBubble",do:"ticktick"},jd=["tell","show","do"];var Dd=({config:e,messages:t,currentMode:n,isSimulationRunning:r=!1,onSendMessage:i,onSetMode:o,onAddMessage:a,onUpdateMessage:s,onRemoveMessage:c,onStopTask:l,onClearChat:d,onScreenSharingChange:h,onStartScreenShareRef:m,onStopScreenShareRef:w,messageInputRef:b})=>{const[y,v]=p(""),x=u(null),[k,_]=p(null),{isScreenSharing:S,showScreenAccessDialog:E,handleScreenAccessDialogAllow:I,handleScreenAccessDialogDeny:C,handleScreenAccessAllow:T,handleScreenAccessDeny:A,requestScreenAccess:$}=ad({onScreenSharingChange:h,onStartScreenShareRef:m,onStopScreenShareRef:w,onAddMessage:a,onUpdateMessage:s,onRemoveMessage:c,onSendMessage:i,pendingMessage:k,setPendingMessage:_}),M=e;/* @__PURE__ */