obi-sdk 0.18.13 → 0.18.14

package/dist/index.js

@@ -59,4 +59,4 @@ a=extmap-allow-mixed`)!==-1){const r=i.sdp.split(`
             50% { transform: translateX(344px); }
             100% { transform: translateX(344px); }
           }
-        `}),g("article",{style:t.skeletonContainer,role:"status","aria-label":"Loading content",children:[g("section",{style:t.headerSection,children:[g("div",{style:t.avatar,role:"img","aria-label":"Loading avatar",children:g("div",{style:t.shimmer})}),g("div",{style:t.textLines,children:[g("div",{style:t.textLine,role:"presentation","aria-label":"Loading text line 1",children:g("div",{style:t.shimmer})}),g("div",{style:t.textLine,role:"presentation","aria-label":"Loading text line 2",children:g("div",{style:t.shimmer})})]})]}),g("section",{style:t.contentSection,children:g("div",{style:t.contentBlock,role:"presentation","aria-label":"Loading card content",children:g("div",{style:t.shimmer})})})]})]})}function mU({}){const t={host:{display:"block"},shareContainer:{width:"480px",height:"240px",borderRadius:"12px",display:"grid",placeItems:"center",overflow:"hidden",position:"relative",backgroundColor:"var(--obi-color-tint)"},controlsRow:{zIndex:10,gridRowStart:1,gridColumnStart:1,display:"flex",alignSelf:"flex-start",marginTop:"36px",alignItems:"center",gap:"8px"},monitorIconContainer:{display:"flex",height:"40px",width:"40px",aspectRatio:"1",alignItems:"center",justifyContent:"center",gap:"8px",borderRadius:"2px",border:"1px solid #E4E4E7",background:"#F8FAFC",padding:"8px"},monitorIcon:{width:"24px",height:"24px",color:"#111827"},tabSelector:{display:"flex",width:"260px",height:"40px",padding:"4px",alignItems:"center",borderRadius:"2px",background:"#E4E4E7"},tabButton:e=>({display:"flex",flex:1,alignSelf:"stretch",alignItems:"center",justifyContent:"center",gap:"10px",borderRadius:"2px",padding:"6px 12px",border:"none",cursor:"pointer",fontFamily:"'Satoshi', sans-serif",fontSize:"14px",fontWeight:500,opacity:e?1:.4,background:e?"white":"#F8FAFC",boxShadow:e?"0 1px 2px 0 rgba(0, 0, 0, 0.05)":"none"}),skeletonContainer:{marginTop:"104px",gridColumnStart:1,gridRowStart:1,alignSelf:"center"}};return g("div",{style:t.host,children:g("div",{style:t.shareContainer,children:[g("div",{style:t.controlsRow,children:[g("div",{style:t.monitorIconContainer,children:g("svg",{style:t.monitorIcon,fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:[g("rect",{width:"20",height:"14",x:"2",y:"3",rx:"2",ry:"2"}),g("line",{x1:"8",x2:"16",y1:"21",y2:"21"}),g("line",{x1:"12",x2:"12",y1:"17",y2:"21"})]})}),g("div",{style:t.tabSelector,children:[g("button",{style:t.tabButton(!1),children:"Tab"}),g("button",{style:t.tabButton(!0),children:"Window"})]})]}),g("div",{style:t.skeletonContainer,children:g(pU,{})})]})})}function BU({session:t,speakingState:e,onAction:A}){return g(Zt,{title:"Connect your screen",subtitle:"Watch for the prompt in your browser",agentName:t.agentName||"Obi",buttonText:"Share screen",speakingState:e,description:`${t.agentName||"Obi"} will guide you through ${t.appName||"the app"} by watching your screen.`,centerVisual:g(mU,{}),actionDisabled:!0,onAction:A})}function vU({spectrum:t}){return g("div",{style:{borderRadius:"15px",boxShadow:"0 0 20px 2px var(--obi-color-primary)",backgroundColor:"var(--obi-color-primary)",transform:"scale(1.6)"},children:g(ao,{isActive:!0,children:g(jh,{getBands:t})})})}function CU({session:t,speakingState:e,spectrum:A,onAction:n}){return g(Zt,{title:"Overview",subtitle:`${t.agentName||"Obi"} will start your tutorial in a moment`,agentName:t.agentName||"Obi",speakingState:e,description:`Get ready to explore ${t.appName||"the app"} with ${t.agentName||"Obi"}.`,centerVisual:g(vU,{spectrum:A}),actionDisabled:!0,onAction:n})}function wU({id:t,name:e,description:A,duration:n=10,order:i=0,selected:r=!1,onClick:s}){return g("div",{className:`course-container ${r?"selected":""}`,onClick:()=>{s==null||s({id:t,name:e,description:A,duration:n,order:i})},children:[g("div",{className:"header-row",children:[g("h2",{className:"course-title",children:e}),g("span",{className:"duration",children:["~",n," mins"]})]}),A&&g("p",{className:"course-description",children:A})]})}function bU({courses:t=[],selectedCourseId:e=null,loading:A=!1,error:n="",onCourseSelect:i}){const[r,s]=Z(""),a=l=>{const u=l.currentTarget;s(u.value)},o=l=>{i==null||i(l)};if(A)return g("div",{className:"loading",children:"Loading..."});if(n)return g("div",{className:"error",children:n});if(!t||t.length===0)return g("div",{className:"empty",children:"No courses available"});const c=t.filter(l=>l.name.toLowerCase().includes(r.toLowerCase())||(l.description||"").toLowerCase().includes(r.toLowerCase()));return g("div",{className:"tour-select",children:[g("div",{className:"controls",children:[g("div",{className:"tabs",children:g("button",{className:"tab active",children:"All"})}),g("div",{className:"filter",children:[g("svg",{width:"14",height:"14",viewBox:"0 0 14 14",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:g("path",{d:"M10.0417 8.75002H9.42087L9.20004 8.53502C9.96921 7.63585 10.4417 6.47502 10.4417 5.20835C10.4417 2.56085 8.32254 0.441681 5.67504 0.441681C3.02754 0.441681 0.908374 2.56085 0.908374 5.20835C0.908374 7.85585 3.02754 9.97502 5.67504 9.97502C6.94171 9.97502 8.10254 9.50252 9.00171 8.73335L9.22671 8.95418V9.57502L13.2167 13.5592L14.375 12.4008L10.0417 8.75002ZM5.67504 8.75002C3.72754 8.75002 2.15837 7.18085 2.15837 5.20835C2.15837 3.23585 3.72754 1.66668 5.67504 1.66668C7.62254 1.66668 9.19171 3.23585 9.19171 5.20835C9.19171 7.18085 7.62254 8.75002 5.67504 8.75002Z",fill:"#6B7280"})}),g("input",{type:"text",placeholder:"Search...",value:r,onInput:a})]})]}),g("div",{className:"course-grid",children:c.sort((l,u)=>(l.order||0)-(u.order||0)).map(l=>{const u=l.id===e;return g(wU,{id:l.id,name:l.name,description:l.description||"",duration:l.duration,order:l.order||0,selected:u,onClick:o},l.id)})})]})}function yU({open:t,courses:e=[],loading:A=!1,error:n="",agentName:i="Obi",onClose:r,onCourseSelect:s}){const[a,o]=Z(null),c=u=>{o(u)},l=()=>{a&&s&&s(a)};return g(Nh,{open:t,onClose:r,size:"large",children:g("div",{className:"tour-select-modal-container",children:[g("div",{className:"header",children:[g("div",{className:"icon",style:{color:"white"},children:g(sf,{})}),g("div",{className:"title-section",children:A?g(Pe,{children:[g("div",{className:"skeleton skeleton-title"}),g("div",{className:"skeleton skeleton-subtitle"})]}):g(Pe,{children:[g("h1",{children:["Give ",i," a try!"]}),g("p",{className:"subtitle",children:["Pick a tutorial, share your screen, and ",i," will take it from there."]})]})})]}),g("div",{className:"course-list-wrapper",children:g(bU,{courses:e,selectedCourseId:(a==null?void 0:a.id)||"",loading:A,error:n,onCourseSelect:c})}),g("div",{className:"footer",children:[g("button",{className:"obi-button footer-button",onClick:l,disabled:!a,children:[g("span",{children:"Get started"}),g("svg",{xmlns:"http://www.w3.org/2000/svg",width:"17",height:"16",viewBox:"0 0 17 16",fill:"none",children:g("path",{d:"M3.83325 8.00065H13.1666M13.1666 8.00065L8.49992 3.33398M13.1666 8.00065L8.49992 12.6673",stroke:a?"#FAFAFA":"#999","stroke-width":"1.33","stroke-linecap":"round","stroke-linejoin":"round"})})]}),g("p",{className:"footer-text",children:"Sessions are securely recorded for quality improvement purposes."})]})]})})}function UU({session:t,sessionState:e,speakingState:A,spectrum:n,onStart:i,onContinue:r,onShareMicrophone:s,onShareScreen:a}){function o(){e==="connecting"||e==="connected"||!e?i==null||i():e==="volume-check"||e==="mic-check"?r==null||r():e==="mic-share"?s==null||s():e==="screen-share"&&(a==null||a())}return no(()=>{switch(e){case null:case"connecting":case"connected":return g(uU,{session:t,speakingState:A,onAction:o});case"volume-check":return g(gU,{session:t,speakingState:A,onAction:o});case"mic-check":return g(CU,{session:t,speakingState:A,spectrum:n,onAction:o});case"mic-share":return g(hU,{session:t,speakingState:A,onAction:o});case"screen-share":return g(BU,{session:t,speakingState:A,onAction:o});case"navigate":return g(cU,{session:t,speakingState:A,onAction:o});default:return null}},[e,A,i,r,s,a])}function QU(t){const{session:e,sessionState:A,speakingState:n,spectrum:i,onClose:r,onStart:s,onContinue:a,onShareMicrophone:o,onShareScreen:c}=t,l=(t.open??!0)&&(!A||A==="connecting"||A==="connected"||A==="volume-check"||A==="mic-check"||A==="mic-share"||A==="screen-share"||A==="navigate");return g(aU,{open:l,onClose:r,children:()=>g(UU,{session:e,sessionState:A,speakingState:n,spectrum:i,onStart:s,onContinue:a,onShareMicrophone:o,onShareScreen:c})})}function EU(t){let e=t.replace(/[.+^${}()|[\]\\]/g,"\\$&").replace(/\*\*/g,"__DOUBLE_STAR__").replace(/\*/g,"[^/]*").replace(/__DOUBLE_STAR__/g,".*").replace(/\?/g,"[^/]");return new RegExp(`^${e}$`,"i")}function SU(t,e){if(!e||e.length===0)return!1;const A=t.replace(/^https?:\/\//,"").replace(/\/$/,"");return e.some(n=>{try{const i=EU(n);return i.test(A)||i.test(t)}catch(i){return console.warn(`Invalid URL pattern: ${n}`,i),!1}})}function lo(t){if(!t||t.length===0)return!1;const e=window.location.origin+window.location.pathname;return SU(e,t)}function kU(t){var b,U,w;const[e,A]=Z(!1),[n,i]=Z(!1),[r,s]=Z(null),a=TU(t.sdk,o,t.shadowHost,s);function o(v){var y;(y=a.client)!=null&&y.session||A(v)}if(!a.client)return null;const c=FU((b=a.client.product)==null?void 0:b.widget_url_blacklist),l=a.client.session,u=!!l,d=u&&!e;let h;switch(l==null?void 0:l.speakingState){case"listening":h="user-speaking";break;case"speaking":h="agent-speaking";break;case"thinking":h="thinking";break;case"busy":h="busy";break}const p=l==null?void 0:l.isPaused,f=a.client.state==="ready"&&!c&&(a.client.selectedPlan||!((U=a.client.product)!=null&&U.widget_link_only_access)),m=d?100:62,B=()=>{var v,y,E,T,F,R;return{name:(v=a.client.selectedPlan)==null?void 0:v.name,description:(y=a.client.selectedPlan)==null?void 0:y.description,appName:(E=a.client.product)==null?void 0:E.name,appLogoUrl:((T=a.client.product)==null?void 0:T.logo_url)||"",url:(F=a.client.product)==null?void 0:F.url,agentName:((R=a.client.product)==null?void 0:R.agent_name)||"Obi"}};return g("div",{children:f&&g(Pe,{children:[g("div",{style:{position:"fixed",top:`calc(100vh - ${m}px)`,left:"50%",transform:"translateX(-50%)",width:"max-content"},children:g(iU,{inPlan:u,isActive:n?!1:void 0,defaultIsActive:!0,isPaused:p,messaging:(l==null?void 0:l.isMicShared)===!1?!0:void 0,speakingStatus:h,spectrum:()=>(l==null?void 0:l.audioSpectrum())||null,courseProgress:r,onOpen:()=>{A(!0)},onCancel:()=>{var v;(v=a.client.session)==null||v.stop()},onPause:()=>{var v,y;(y=(v=a.client.session)==null?void 0:v.pause)==null||y.call(v)},onUnpause:()=>{var v,y;(y=(v=a.client.session)==null?void 0:v.unpause)==null||y.call(v)},onMessagingChange:v=>{var y,E,T,F;v?(E=(y=a.client.session)==null?void 0:y.muteMicrophone)==null||E.call(y):(F=(T=a.client.session)==null?void 0:T.unmuteMicrophone)==null||F.call(T)},onMessage:v=>{a.say(v)}})}),e&&g(yU,{open:e,courses:a.client.plans.map(v=>({id:v.uuid,name:v.name,description:v.description||"",duration:v.duration||0})),loading:!1,agentName:((w=a.client.product)==null?void 0:w.agent_name)||"Obi",onCourseSelect:v=>{const y=a.client.plans.find(E=>E.uuid===v.id)||null;y&&(a.client.selectPlan(y),A(!1),i(!0))},onClose:v=>{v==="user-initiated"&&a.client.selectPlan(null),A(!1)}}),!!a.client.selectedPlan&&g(QU,{open:!0,session:B(),sessionState:(l==null?void 0:l.state)||null,speakingState:(l==null?void 0:l.speakingState)||null,spectrum:()=>(l==null?void 0:l.audioSpectrum())||null,onClose:v=>{v==="user-initiated"&&a.client.stopSession(),i(!1)},onStart:()=>{a.client.selectedPlanUuid&&a.startSession()},onContinue:()=>{l==null||l.continue()},onShareMicrophone:()=>{l==null||l.shareMicrophone()}})]})})}function TU(t,e,A,n){const[i,r]=Z(0),[s,a]=Z(null);return Ge(()=>{t.on("showMenu",o=>{e(o)})},[t]),Ge(()=>{t.client&&(t.client.session&&a(t.client.session),t.client.on("sessionStarted",o=>{a(o),r(c=>c+1)}),t.client.on("sessionStopped",()=>{a(null),r(o=>o+1)}),t.client.on("sessionShutdown",()=>{r(o=>o+1)}),t.client.on("sessionResumed",()=>{r(o=>o+1)}),t.client.on("stateChanged",()=>{var o;t.client.state==="ready"&&A.style.setProperty("--obi-color-primary",((o=t.client.product)==null?void 0:o.primary_color)||"#9500FF"),r(c=>c+1)}),t.client.on("planSelected",()=>{r(o=>o+1)}))},[t,t.client]),Ge(()=>{if(!s)return;s.on("stateChanged",()=>{r(c=>c+1)}),s.on("speakingStateChanged",()=>{r(c=>c+1)}),s.on("paused",()=>{r(c=>c+1)}),s.on("unpaused",()=>{r(c=>c+1)});const o=c=>{n(c)};return s.on&&s.on("courseProgress",o),()=>{s.off&&s.off("courseProgress",o)}},[s]),t}function FU(t){const[e,A]=Z(()=>lo(t));return Ge(()=>{A(lo(t))},[t]),Ge(()=>{IU();const n=()=>{A(lo(t))};return window.addEventListener("locationchange",n),window.addEventListener("popstate",n),window.addEventListener("hashchange",n),()=>{window.removeEventListener("locationchange",n),window.removeEventListener("popstate",n),window.removeEventListener("hashchange",n)}},[t]),e}function IU(){const t=window;if(t.__obi_history_patched)return;const{pushState:e,replaceState:A}=window.history,n=i=>function(...r){const s=i.apply(this,r);return window.dispatchEvent(new Event("locationchange")),s};window.history.pushState=n(e),window.history.replaceState=n(A),t.__obi_history_patched=!0}function xU(t){if(document.querySelector("obi-widget")){console.debug("[obi] widget already mounted");return}_U();const e=document.createElement("div");e.id="host",e.style.position="fixed",e.style.zIndex="9999",document.body.appendChild(e);const A=e.attachShadow({mode:"open"}),n=document.createElement("div");n.id="obi-container",n.className="parentclass",A.appendChild(n);const i=new CSSStyleSheet;i.replaceSync(Sy),A.adoptedStyleSheets=[i],Uy(g(kU,{sdk:t,shadowHost:e}),n),console.log("[obi-sdk] widget mounted")}function _U(){af("https://fonts.cdnfonts.com/css/satoshi"),af("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap")}function af(t){const e=document.createElement("link");e.href=t,e.rel="stylesheet",document.head.appendChild(e)}const of="49206C6F7665204F6269_session",cf="obi-url-params";class PU extends kr{constructor(e){super(),this.client=null,this.isActive=!1,this.primaryColour="#9500FF",this.commandQueue=[],this._resumed=!1,this.dispatchCommand=(A,n,i)=>{var r,s;switch(A){case"update":this.updateConfig(n,i);break;case"endSession":(s=(r=this.client)==null?void 0:r.stopSession)==null||s.call(r);break;case"say":this.say(n);break;default:console.warn("[obi] unknown command",{commandType:A,args:n})}},e&&this.createClient(e)}async createClient(e){if(this.client){this.client.appToken!==e&&console.warn("[obi] client already exists with different app token");return}console.debug("[obi] creating client");let A=null;const n=this.load();if(n){console.debug("[obi] attempting to load cached client");try{A=vr.deserialise(n,e,"sdk",{apiBaseUrl:"https://app.coragents.ai",captureScreen:this.captureScreen.bind(this)}),this._resumed=!0}catch(i){console.error("[obi] error loading cached client",i)}}A||(A=new vr(e,"sdk",{apiBaseUrl:"https://app.coragents.ai",captureScreen:this.captureScreen.bind(this)})),this.client=A,this.client.on("stateChanged",i=>{var r,s,a;i==="ready"&&this.updateConfig({isActive:(r=this.client)==null?void 0:r.showWidget,primaryColour:((a=(s=this.client)==null?void 0:s.product)==null?void 0:a.primary_color)||"#9500FF"})}),this.client.on("sessionStarted",()=>{this.save()}),this.client.on("sessionStopped",()=>{console.debug("[obi] removing client from local storage"),localStorage.removeItem("obi-client")}),this.client.on("sessionShutdown",i=>{i==="invalid-room"&&(console.debug("[obi] removing client from local storage"),localStorage.removeItem("obi-client"))}),this.client.session&&this.client.resumeSession(i=>{i.on("stateChanged",r=>{r!=="disconnecting"&&r!=="disconnected"&&r!=="error"&&r!=="connecting"&&this.save()}),i.on("paused",()=>{this.save()}),i.on("unpaused",()=>{this.save()})})}async initialise(e={}){const A=this.parsePassiveParams()||void 0;this.commandQueue=e.queuedCommands||[],this._resumed?(this._resumed=!1,this.dispatchCommandQueue()):this.client?(console.debug("[obi] client already exists, initialising"),this.client.initialise({planUuid:A}).then(()=>{this.emit("initialised"),this.dispatchCommandQueue()}).catch(n=>{console.error("[obi] error initialising client",n),this.emit("error",n)})):(console.debug("[obi] client does not exist, dispatching command queue"),this.dispatchCommandQueue(A))}updateConfig(e,A){console.debug("[obi] updating config",e),this.updateAppToken(e.apiKey,A),this.updateActive(e.isActive),this.updatePrimaryColour(e.primaryColour),this.updateIdentity(e.user),this.updateShowMenu(e.showMenu)}async updateAppToken(e,A){var n;e===void 0||e==((n=this.client)==null?void 0:n.appToken)||(console.debug("[obi] updating app token",{appToken:e,planUuid:A}),await this.createClient(e),this.client&&this.client.initialise({planUuid:A}).then(()=>{this.emit("initialised")}).catch(i=>{console.error("[obi] error initialising client",i),this.emit("error",i)}))}updateActive(e){e===void 0||e==this.isActive||(console.debug("[obi] updating active state",e),this.isActive=e)}updatePrimaryColour(e){e===void 0||e==this.primaryColour||(console.debug("[obi] updating primary colour",e),this.primaryColour=e)}updateIdentity(e){var A;e===void 0||e==((A=this.client)==null?void 0:A.identity)||(console.debug("[obi] updating identity",e),this.client.initialise({identity:e||void 0}).catch(n=>{console.error("[obi] error updating identity",n),this.emit("error",n)}))}updateShowMenu(e){console.debug("[obi] updating show menu",e),this.emit("showMenu",e)}async say(e){var A,n,i;await((i=(n=(A=this.client)==null?void 0:A.session)==null?void 0:n.say)==null?void 0:i.call(n,e))}async startSession(){await this.client.startSession(this.client.selectedPlan.uuid,e=>{e.on("stateChanged",A=>{A!=="disconnecting"&&A!=="disconnected"&&A!=="error"&&A!=="connecting"&&this.save()})})}dispatchCommandQueue(e){const A=this.commandQueue;this.commandQueue=[],A.forEach(n=>{console.debug("[obi] dispatching command",n);try{this.dispatchCommand(n[0],n[1]||[],e)}catch(i){console.error("[obi] error dispatching command",i)}})}parsePassiveParams(){console.debug("[obi] parsing passive params");let e={};e=JSON.parse(localStorage.getItem(cf)||"{}"),Object.keys(e).length===0&&new URLSearchParams(window.location.search).forEach((r,s)=>{e[s]=r});const A=e[of];if(!A)return null;console.debug("[obi] found plan uuid from passive params",A);const n=new URL(window.location.href);return n.searchParams.delete(of),window.history.replaceState({},"",n.toString()),localStorage.removeItem(cf),A}mountWidget(){xU(this),console.debug("[obi] widget mounted")}async captureScreen(){return(await Fv(document.documentElement,{useCORS:!0,allowTaint:!0,foreignObjectRendering:!0})).toDataURL("image/png")}save(){}load(){return localStorage.getItem("obi-client")}}async function lf(t){let e;try{e=window}catch{console.warn("[obi] no window object found"),e={}}return RU({appToken:t,window:e})}async function RU({appToken:t,window:e}){var i,r;if(e.obi){console.warn("[obi] obi object already found on window, skipping");return}t||(t=(i=e==null?void 0:e.obiWidgetConfig)==null?void 0:i.apiKey);let A;try{A=((r=e.ObiSDK)==null?void 0:r.q)||[]}catch{A=[]}const n=new PU(t);return e.ObiSDK=n.dispatchCommand,await n.initialise({queuedCommands:A}),e.obi=n,n.mountWidget(),n}document.readyState==="loading"?document.addEventListener("DOMContentLoaded",()=>{lf()}):lf()})();
+        `}),g("article",{style:t.skeletonContainer,role:"status","aria-label":"Loading content",children:[g("section",{style:t.headerSection,children:[g("div",{style:t.avatar,role:"img","aria-label":"Loading avatar",children:g("div",{style:t.shimmer})}),g("div",{style:t.textLines,children:[g("div",{style:t.textLine,role:"presentation","aria-label":"Loading text line 1",children:g("div",{style:t.shimmer})}),g("div",{style:t.textLine,role:"presentation","aria-label":"Loading text line 2",children:g("div",{style:t.shimmer})})]})]}),g("section",{style:t.contentSection,children:g("div",{style:t.contentBlock,role:"presentation","aria-label":"Loading card content",children:g("div",{style:t.shimmer})})})]})]})}function mU({}){const t={host:{display:"block"},shareContainer:{width:"480px",height:"240px",borderRadius:"12px",display:"grid",placeItems:"center",overflow:"hidden",position:"relative",backgroundColor:"var(--obi-color-tint)"},controlsRow:{zIndex:10,gridRowStart:1,gridColumnStart:1,display:"flex",alignSelf:"flex-start",marginTop:"36px",alignItems:"center",gap:"8px"},monitorIconContainer:{display:"flex",height:"40px",width:"40px",aspectRatio:"1",alignItems:"center",justifyContent:"center",gap:"8px",borderRadius:"2px",border:"1px solid #E4E4E7",background:"#F8FAFC",padding:"8px"},monitorIcon:{width:"24px",height:"24px",color:"#111827"},tabSelector:{display:"flex",width:"260px",height:"40px",padding:"4px",alignItems:"center",borderRadius:"2px",background:"#E4E4E7"},tabButton:e=>({display:"flex",flex:1,alignSelf:"stretch",alignItems:"center",justifyContent:"center",gap:"10px",borderRadius:"2px",padding:"6px 12px",border:"none",cursor:"pointer",fontFamily:"'Satoshi', sans-serif",fontSize:"14px",fontWeight:500,opacity:e?1:.4,background:e?"white":"#F8FAFC",boxShadow:e?"0 1px 2px 0 rgba(0, 0, 0, 0.05)":"none"}),skeletonContainer:{marginTop:"104px",gridColumnStart:1,gridRowStart:1,alignSelf:"center"}};return g("div",{style:t.host,children:g("div",{style:t.shareContainer,children:[g("div",{style:t.controlsRow,children:[g("div",{style:t.monitorIconContainer,children:g("svg",{style:t.monitorIcon,fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:[g("rect",{width:"20",height:"14",x:"2",y:"3",rx:"2",ry:"2"}),g("line",{x1:"8",x2:"16",y1:"21",y2:"21"}),g("line",{x1:"12",x2:"12",y1:"17",y2:"21"})]})}),g("div",{style:t.tabSelector,children:[g("button",{style:t.tabButton(!1),children:"Tab"}),g("button",{style:t.tabButton(!0),children:"Window"})]})]}),g("div",{style:t.skeletonContainer,children:g(pU,{})})]})})}function BU({session:t,speakingState:e,onAction:A}){return g(Zt,{title:"Connect your screen",subtitle:"Watch for the prompt in your browser",agentName:t.agentName||"Obi",buttonText:"Share screen",speakingState:e,description:`${t.agentName||"Obi"} will guide you through ${t.appName||"the app"} by watching your screen.`,centerVisual:g(mU,{}),actionDisabled:!0,onAction:A})}function vU({spectrum:t}){return g("div",{style:{borderRadius:"15px",boxShadow:"0 0 20px 2px var(--obi-color-primary)",backgroundColor:"var(--obi-color-primary)",transform:"scale(1.6)"},children:g(ao,{isActive:!0,children:g(jh,{getBands:t})})})}function CU({session:t,speakingState:e,spectrum:A,onAction:n}){return g(Zt,{title:"Overview",subtitle:`${t.agentName||"Obi"} will start your tutorial in a moment`,agentName:t.agentName||"Obi",speakingState:e,description:`Get ready to explore ${t.appName||"the app"} with ${t.agentName||"Obi"}.`,centerVisual:g(vU,{spectrum:A}),actionDisabled:!0,onAction:n})}function wU({id:t,name:e,description:A,duration:n=10,order:i=0,selected:r=!1,onClick:s}){return g("div",{className:`course-container ${r?"selected":""}`,onClick:()=>{s==null||s({id:t,name:e,description:A,duration:n,order:i})},children:[g("div",{className:"header-row",children:[g("h2",{className:"course-title",children:e}),g("span",{className:"duration",children:["~",n," mins"]})]}),A&&g("p",{className:"course-description",children:A})]})}function bU({courses:t=[],selectedCourseId:e=null,loading:A=!1,error:n="",onCourseSelect:i}){const[r,s]=Z(""),a=l=>{const u=l.currentTarget;s(u.value)},o=l=>{i==null||i(l)};if(A)return g("div",{className:"loading",children:"Loading..."});if(n)return g("div",{className:"error",children:n});if(!t||t.length===0)return g("div",{className:"empty",children:"No courses available"});const c=t.filter(l=>l.name.toLowerCase().includes(r.toLowerCase())||(l.description||"").toLowerCase().includes(r.toLowerCase()));return g("div",{className:"tour-select",children:[g("div",{className:"controls",children:[g("div",{className:"tabs",children:g("button",{className:"tab active",children:"All"})}),g("div",{className:"filter",children:[g("svg",{width:"14",height:"14",viewBox:"0 0 14 14",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:g("path",{d:"M10.0417 8.75002H9.42087L9.20004 8.53502C9.96921 7.63585 10.4417 6.47502 10.4417 5.20835C10.4417 2.56085 8.32254 0.441681 5.67504 0.441681C3.02754 0.441681 0.908374 2.56085 0.908374 5.20835C0.908374 7.85585 3.02754 9.97502 5.67504 9.97502C6.94171 9.97502 8.10254 9.50252 9.00171 8.73335L9.22671 8.95418V9.57502L13.2167 13.5592L14.375 12.4008L10.0417 8.75002ZM5.67504 8.75002C3.72754 8.75002 2.15837 7.18085 2.15837 5.20835C2.15837 3.23585 3.72754 1.66668 5.67504 1.66668C7.62254 1.66668 9.19171 3.23585 9.19171 5.20835C9.19171 7.18085 7.62254 8.75002 5.67504 8.75002Z",fill:"#6B7280"})}),g("input",{type:"text",placeholder:"Search...",value:r,onInput:a})]})]}),g("div",{className:"course-grid",children:c.sort((l,u)=>(l.order||0)-(u.order||0)).map(l=>{const u=l.id===e;return g(wU,{id:l.id,name:l.name,description:l.description||"",duration:l.duration,order:l.order||0,selected:u,onClick:o},l.id)})})]})}function yU({open:t,courses:e=[],loading:A=!1,error:n="",agentName:i="Obi",onClose:r,onCourseSelect:s}){const[a,o]=Z(null),c=u=>{o(u)},l=()=>{a&&s&&s(a)};return g(Nh,{open:t,onClose:r,size:"large",children:g("div",{className:"tour-select-modal-container",children:[g("div",{className:"header",children:[g("div",{className:"icon",style:{color:"white"},children:g(sf,{})}),g("div",{className:"title-section",children:A?g(Pe,{children:[g("div",{className:"skeleton skeleton-title"}),g("div",{className:"skeleton skeleton-subtitle"})]}):g(Pe,{children:[g("h1",{children:["Give ",i," a try!"]}),g("p",{className:"subtitle",children:["Pick a tutorial, share your screen, and ",i," will take it from there."]})]})})]}),g("div",{className:"course-list-wrapper",children:g(bU,{courses:e,selectedCourseId:(a==null?void 0:a.id)||"",loading:A,error:n,onCourseSelect:c})}),g("div",{className:"footer",children:[g("button",{className:"obi-button footer-button",onClick:l,disabled:!a,children:[g("span",{children:"Get started"}),g("svg",{xmlns:"http://www.w3.org/2000/svg",width:"17",height:"16",viewBox:"0 0 17 16",fill:"none",children:g("path",{d:"M3.83325 8.00065H13.1666M13.1666 8.00065L8.49992 3.33398M13.1666 8.00065L8.49992 12.6673",stroke:a?"#FAFAFA":"#999","stroke-width":"1.33","stroke-linecap":"round","stroke-linejoin":"round"})})]}),g("p",{className:"footer-text",children:"Sessions are securely recorded for quality improvement purposes."})]})]})})}function UU({session:t,sessionState:e,speakingState:A,spectrum:n,onStart:i,onContinue:r,onShareMicrophone:s,onShareScreen:a}){function o(){e==="connecting"||e==="connected"||!e?i==null||i():e==="volume-check"||e==="mic-check"?r==null||r():e==="mic-share"?s==null||s():e==="screen-share"&&(a==null||a())}return no(()=>{switch(e){case null:case"connecting":case"connected":return g(uU,{session:t,speakingState:A,onAction:o});case"volume-check":return g(gU,{session:t,speakingState:A,onAction:o});case"mic-check":return g(CU,{session:t,speakingState:A,spectrum:n,onAction:o});case"mic-share":return g(hU,{session:t,speakingState:A,onAction:o});case"screen-share":return g(BU,{session:t,speakingState:A,onAction:o});case"navigate":return g(cU,{session:t,speakingState:A,onAction:o});default:return null}},[e,A,i,r,s,a])}function QU(t){const{session:e,sessionState:A,speakingState:n,spectrum:i,onClose:r,onStart:s,onContinue:a,onShareMicrophone:o,onShareScreen:c}=t,l=(t.open??!0)&&(!A||A==="connecting"||A==="connected"||A==="volume-check"||A==="mic-check"||A==="mic-share"||A==="screen-share"||A==="navigate");return g(aU,{open:l,onClose:r,children:()=>g(UU,{session:e,sessionState:A,speakingState:n,spectrum:i,onStart:s,onContinue:a,onShareMicrophone:o,onShareScreen:c})})}function EU(t){let e=t.replace(/[.+^${}()|[\]\\]/g,"\\$&").replace(/\*\*/g,"__DOUBLE_STAR__").replace(/\*/g,"[^/]*").replace(/__DOUBLE_STAR__/g,".*").replace(/\?/g,"[^/]");return new RegExp(`^${e}$`,"i")}function SU(t,e){if(!e||e.length===0)return!1;const A=t.replace(/^https?:\/\//,"").replace(/\/$/,"");return e.some(n=>{try{const i=EU(n);return i.test(A)||i.test(t)}catch(i){return console.warn(`Invalid URL pattern: ${n}`,i),!1}})}function lo(t){if(!t||t.length===0)return!1;const e=window.location.origin+window.location.pathname;return SU(e,t)}function kU(t){var b,U,w;const[e,A]=Z(!1),[n,i]=Z(!1),[r,s]=Z(null),a=TU(t.sdk,o,t.shadowHost,s);function o(v){var y;(y=a.client)!=null&&y.session||A(v)}if(!a.client)return null;const c=FU((b=a.client.product)==null?void 0:b.widget_url_blacklist),l=a.client.session,u=!!l,d=u&&!e;let h;switch(l==null?void 0:l.speakingState){case"listening":h="user-speaking";break;case"speaking":h="agent-speaking";break;case"thinking":h="thinking";break;case"busy":h="busy";break}const p=l==null?void 0:l.isPaused,f=a.client.state==="ready"&&!c&&(a.client.selectedPlan||!((U=a.client.product)!=null&&U.widget_link_only_access)),m=d?100:62,B=()=>{var v,y,E,T,F,R;return{name:(v=a.client.selectedPlan)==null?void 0:v.name,description:(y=a.client.selectedPlan)==null?void 0:y.description,appName:(E=a.client.product)==null?void 0:E.name,appLogoUrl:((T=a.client.product)==null?void 0:T.logo_url)||"",url:(F=a.client.product)==null?void 0:F.url,agentName:((R=a.client.product)==null?void 0:R.agent_name)||"Obi"}};return g("div",{children:f&&g(Pe,{children:[g("div",{style:{position:"fixed",top:`calc(100vh - ${m}px)`,left:"50%",transform:"translateX(-50%)",width:"max-content"},children:g(iU,{inPlan:u,isActive:n?!1:void 0,defaultIsActive:!0,isPaused:p,messaging:(l==null?void 0:l.isMicShared)===!1?!0:void 0,speakingStatus:h,spectrum:()=>(l==null?void 0:l.audioSpectrum())||null,courseProgress:r,onOpen:()=>{A(!0)},onCancel:()=>{var v;(v=a.client.session)==null||v.stop()},onPause:()=>{var v,y;(y=(v=a.client.session)==null?void 0:v.pause)==null||y.call(v)},onUnpause:()=>{var v,y;(y=(v=a.client.session)==null?void 0:v.unpause)==null||y.call(v)},onMessagingChange:v=>{var y,E,T,F;v?(E=(y=a.client.session)==null?void 0:y.muteMicrophone)==null||E.call(y):(F=(T=a.client.session)==null?void 0:T.unmuteMicrophone)==null||F.call(T)},onMessage:v=>{a.say(v)}})}),e&&g(yU,{open:e,courses:a.client.plans.map(v=>({id:v.uuid,name:v.name,description:v.description||"",duration:v.duration||0})),loading:!1,agentName:((w=a.client.product)==null?void 0:w.agent_name)||"Obi",onCourseSelect:v=>{const y=a.client.plans.find(E=>E.uuid===v.id)||null;y&&(a.client.selectPlan(y),A(!1),i(!0))},onClose:v=>{v==="user-initiated"&&a.client.selectPlan(null),A(!1)}}),!!a.client.selectedPlan&&g(QU,{open:!0,session:B(),sessionState:(l==null?void 0:l.state)||null,speakingState:(l==null?void 0:l.speakingState)||null,spectrum:()=>(l==null?void 0:l.audioSpectrum())||null,onClose:v=>{v==="user-initiated"&&a.client.stopSession(),i(!1)},onStart:()=>{a.client.selectedPlanUuid&&a.startSession()},onContinue:()=>{l==null||l.continue()},onShareMicrophone:()=>{l==null||l.shareMicrophone()}})]})})}function TU(t,e,A,n){const[i,r]=Z(0),[s,a]=Z(null);return Ge(()=>{t.on("showMenu",o=>{e(o)})},[t]),Ge(()=>{t.client&&(t.client.session&&a(t.client.session),t.client.on("sessionStarted",o=>{a(o),r(c=>c+1)}),t.client.on("sessionStopped",()=>{a(null),r(o=>o+1)}),t.client.on("sessionShutdown",()=>{r(o=>o+1)}),t.client.on("sessionResumed",()=>{r(o=>o+1)}),t.client.on("stateChanged",()=>{var o;t.client.state==="ready"&&A.style.setProperty("--obi-color-primary",((o=t.client.product)==null?void 0:o.primary_color)||"#9500FF"),r(c=>c+1)}),t.client.on("planSelected",()=>{r(o=>o+1)}))},[t,t.client]),Ge(()=>{if(!s)return;s.on("stateChanged",()=>{r(c=>c+1)}),s.on("speakingStateChanged",()=>{r(c=>c+1)}),s.on("paused",()=>{r(c=>c+1)}),s.on("unpaused",()=>{r(c=>c+1)});const o=c=>{n(c)};return s.on&&s.on("courseProgress",o),()=>{s.off&&s.off("courseProgress",o)}},[s]),t}function FU(t){const[e,A]=Z(()=>lo(t));return Ge(()=>{A(lo(t))},[t]),Ge(()=>{IU();const n=()=>{A(lo(t))};return window.addEventListener("locationchange",n),window.addEventListener("popstate",n),window.addEventListener("hashchange",n),()=>{window.removeEventListener("locationchange",n),window.removeEventListener("popstate",n),window.removeEventListener("hashchange",n)}},[t]),e}function IU(){const t=window;if(t.__obi_history_patched)return;const{pushState:e,replaceState:A}=window.history,n=i=>function(...r){const s=i.apply(this,r);return window.dispatchEvent(new Event("locationchange")),s};window.history.pushState=n(e),window.history.replaceState=n(A),t.__obi_history_patched=!0}function xU(t){if(document.querySelector("obi-widget")){console.debug("[obi] widget already mounted");return}_U();const e=document.createElement("div");e.id="host",e.style.position="fixed",e.style.zIndex="9999",document.body.appendChild(e);const A=e.attachShadow({mode:"open"}),n=document.createElement("div");n.id="obi-container",n.className="parentclass",A.appendChild(n);const i=new CSSStyleSheet;i.replaceSync(Sy),A.adoptedStyleSheets=[i],Uy(g(kU,{sdk:t,shadowHost:e}),n),console.log("[obi-sdk] widget mounted")}function _U(){af("https://fonts.cdnfonts.com/css/satoshi"),af("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap")}function af(t){const e=document.createElement("link");e.href=t,e.rel="stylesheet",document.head.appendChild(e)}const of="49206C6F7665204F6269_session",cf="obi-url-params";class PU extends kr{constructor(e){super(),this.client=null,this.isActive=!1,this.primaryColour="#9500FF",this.commandQueue=[],this._resumed=!1,this.dispatchCommand=(A,n,i)=>{var r,s;switch(A){case"update":this.updateConfig(n,i);break;case"endSession":(s=(r=this.client)==null?void 0:r.stopSession)==null||s.call(r);break;case"say":this.say(n);break;default:console.warn("[obi] unknown command",{commandType:A,args:n})}},e&&this.createClient(e)}async createClient(e){if(this.client){this.client.appToken!==e&&console.warn("[obi] client already exists with different app token");return}console.debug("[obi] creating client");let A=null;const n=this.load();if(n){console.debug("[obi] attempting to load cached client");try{A=vr.deserialise(n,e,"sdk",{apiBaseUrl:"https://app.coragents.ai",captureScreen:this.captureScreen.bind(this)}),this._resumed=!0}catch(i){console.error("[obi] error loading cached client",i)}}A||(A=new vr(e,"sdk",{apiBaseUrl:"https://app.coragents.ai",captureScreen:this.captureScreen.bind(this)})),this.client=A,this.client.on("stateChanged",i=>{var r,s,a;i==="ready"&&this.updateConfig({isActive:(r=this.client)==null?void 0:r.showWidget,primaryColour:((a=(s=this.client)==null?void 0:s.product)==null?void 0:a.primary_color)||"#9500FF"})}),this.client.on("sessionStarted",()=>{this.save()}),this.client.on("sessionStopped",()=>{console.debug("[obi] removing client from local storage"),localStorage.removeItem("obi-client")}),this.client.on("sessionShutdown",i=>{i==="invalid-room"&&(console.debug("[obi] removing client from local storage"),localStorage.removeItem("obi-client"))}),this.client.session&&this.client.resumeSession(i=>{i.on("stateChanged",r=>{r!=="disconnecting"&&r!=="disconnected"&&r!=="error"&&r!=="connecting"&&this.save()}),i.on("paused",()=>{this.save()}),i.on("unpaused",()=>{this.save()})})}async initialise(e={}){const A=this.parsePassiveParams()||void 0;this.commandQueue=e.queuedCommands||[],this._resumed?(this._resumed=!1,this.dispatchCommandQueue()):this.client?(console.debug("[obi] client already exists, initialising"),this.client.initialise({planUuid:A}).then(()=>{this.emit("initialised"),this.dispatchCommandQueue()}).catch(n=>{console.error("[obi] error initialising client",n),this.emit("error",n)})):(console.debug("[obi] client does not exist, dispatching command queue"),this.dispatchCommandQueue(A))}async updateConfig(e,A){console.debug("[obi] updating config",e),await this.updateAppToken(e.apiKey,A),this.updateActive(e.isActive),this.updatePrimaryColour(e.primaryColour),await this.updateIdentity(e.user),this.updateShowMenu(e.showMenu)}async updateAppToken(e,A){var n;e===void 0||e==((n=this.client)==null?void 0:n.appToken)||(console.debug("[obi] updating app token",{appToken:e,planUuid:A}),await this.createClient(e),this.client&&await this.client.initialise({planUuid:A}).then(()=>{this.emit("initialised")}).catch(i=>{console.error("[obi] error initialising client",i),this.emit("error",i)}))}updateActive(e){e===void 0||e==this.isActive||(console.debug("[obi] updating active state",e),this.isActive=e)}updatePrimaryColour(e){e===void 0||e==this.primaryColour||(console.debug("[obi] updating primary colour",e),this.primaryColour=e)}async updateIdentity(e,A){var n;e===void 0||e==((n=this.client)==null?void 0:n.identity)||(console.debug("[obi] updating identity",e),await this.client.initialise({identity:e||void 0,planUuid:A}).then(()=>{this.emit("initialised")}).catch(i=>{console.error("[obi] error initialising client",i),this.emit("error",i)}))}updateShowMenu(e){e!==void 0&&(console.debug("[obi] updating show menu",e),this.emit("showMenu",e))}async say(e){var A,n,i;await((i=(n=(A=this.client)==null?void 0:A.session)==null?void 0:n.say)==null?void 0:i.call(n,e))}async startSession(){await this.client.startSession(this.client.selectedPlan.uuid,e=>{e.on("stateChanged",A=>{A!=="disconnecting"&&A!=="disconnected"&&A!=="error"&&A!=="connecting"&&this.save()})})}dispatchCommandQueue(e){const A=this.commandQueue;this.commandQueue=[],A.forEach(n=>{console.debug("[obi] dispatching command",n);try{this.dispatchCommand(n[0],n[1]||[],e)}catch(i){console.error("[obi] error dispatching command",i)}})}parsePassiveParams(){console.debug("[obi] parsing passive params");let e={};e=JSON.parse(localStorage.getItem(cf)||"{}"),Object.keys(e).length===0&&new URLSearchParams(window.location.search).forEach((r,s)=>{e[s]=r});const A=e[of];if(!A)return null;console.debug("[obi] found plan uuid from passive params",A);const n=new URL(window.location.href);return n.searchParams.delete(of),window.history.replaceState({},"",n.toString()),localStorage.removeItem(cf),A}mountWidget(){xU(this),console.debug("[obi] widget mounted")}async captureScreen(){return(await Fv(document.documentElement,{useCORS:!0,allowTaint:!0,foreignObjectRendering:!0})).toDataURL("image/png")}save(){}load(){return localStorage.getItem("obi-client")}}async function lf(t){let e;try{e=window}catch{console.warn("[obi] no window object found"),e={}}return RU({appToken:t,window:e})}async function RU({appToken:t,window:e}){var i,r;if(e.obi){console.warn("[obi] obi object already found on window, skipping");return}t||(t=(i=e==null?void 0:e.obiWidgetConfig)==null?void 0:i.apiKey);let A;try{A=((r=e.ObiSDK)==null?void 0:r.q)||[]}catch{A=[]}const n=new PU(t);return e.ObiSDK=n.dispatchCommand,await n.initialise({queuedCommands:A}),e.obi=n,n.mountWidget(),n}document.readyState==="loading"?document.addEventListener("DOMContentLoaded",()=>{lf()}):lf()})();

package/dist/obi-sdk.standalone.iife.js

@@ -59,4 +59,4 @@ a=extmap-allow-mixed`)!==-1){const r=i.sdp.split(`
             50% { transform: translateX(344px); }
             100% { transform: translateX(344px); }
           }
-        `}),g("article",{style:t.skeletonContainer,role:"status","aria-label":"Loading content",children:[g("section",{style:t.headerSection,children:[g("div",{style:t.avatar,role:"img","aria-label":"Loading avatar",children:g("div",{style:t.shimmer})}),g("div",{style:t.textLines,children:[g("div",{style:t.textLine,role:"presentation","aria-label":"Loading text line 1",children:g("div",{style:t.shimmer})}),g("div",{style:t.textLine,role:"presentation","aria-label":"Loading text line 2",children:g("div",{style:t.shimmer})})]})]}),g("section",{style:t.contentSection,children:g("div",{style:t.contentBlock,role:"presentation","aria-label":"Loading card content",children:g("div",{style:t.shimmer})})})]})]})}function mU({}){const t={host:{display:"block"},shareContainer:{width:"480px",height:"240px",borderRadius:"12px",display:"grid",placeItems:"center",overflow:"hidden",position:"relative",backgroundColor:"var(--obi-color-tint)"},controlsRow:{zIndex:10,gridRowStart:1,gridColumnStart:1,display:"flex",alignSelf:"flex-start",marginTop:"36px",alignItems:"center",gap:"8px"},monitorIconContainer:{display:"flex",height:"40px",width:"40px",aspectRatio:"1",alignItems:"center",justifyContent:"center",gap:"8px",borderRadius:"2px",border:"1px solid #E4E4E7",background:"#F8FAFC",padding:"8px"},monitorIcon:{width:"24px",height:"24px",color:"#111827"},tabSelector:{display:"flex",width:"260px",height:"40px",padding:"4px",alignItems:"center",borderRadius:"2px",background:"#E4E4E7"},tabButton:e=>({display:"flex",flex:1,alignSelf:"stretch",alignItems:"center",justifyContent:"center",gap:"10px",borderRadius:"2px",padding:"6px 12px",border:"none",cursor:"pointer",fontFamily:"'Satoshi', sans-serif",fontSize:"14px",fontWeight:500,opacity:e?1:.4,background:e?"white":"#F8FAFC",boxShadow:e?"0 1px 2px 0 rgba(0, 0, 0, 0.05)":"none"}),skeletonContainer:{marginTop:"104px",gridColumnStart:1,gridRowStart:1,alignSelf:"center"}};return g("div",{style:t.host,children:g("div",{style:t.shareContainer,children:[g("div",{style:t.controlsRow,children:[g("div",{style:t.monitorIconContainer,children:g("svg",{style:t.monitorIcon,fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:[g("rect",{width:"20",height:"14",x:"2",y:"3",rx:"2",ry:"2"}),g("line",{x1:"8",x2:"16",y1:"21",y2:"21"}),g("line",{x1:"12",x2:"12",y1:"17",y2:"21"})]})}),g("div",{style:t.tabSelector,children:[g("button",{style:t.tabButton(!1),children:"Tab"}),g("button",{style:t.tabButton(!0),children:"Window"})]})]}),g("div",{style:t.skeletonContainer,children:g(pU,{})})]})})}function BU({session:t,speakingState:e,onAction:A}){return g(Zt,{title:"Connect your screen",subtitle:"Watch for the prompt in your browser",agentName:t.agentName||"Obi",buttonText:"Share screen",speakingState:e,description:`${t.agentName||"Obi"} will guide you through ${t.appName||"the app"} by watching your screen.`,centerVisual:g(mU,{}),actionDisabled:!0,onAction:A})}function vU({spectrum:t}){return g("div",{style:{borderRadius:"15px",boxShadow:"0 0 20px 2px var(--obi-color-primary)",backgroundColor:"var(--obi-color-primary)",transform:"scale(1.6)"},children:g(ao,{isActive:!0,children:g(jh,{getBands:t})})})}function CU({session:t,speakingState:e,spectrum:A,onAction:n}){return g(Zt,{title:"Overview",subtitle:`${t.agentName||"Obi"} will start your tutorial in a moment`,agentName:t.agentName||"Obi",speakingState:e,description:`Get ready to explore ${t.appName||"the app"} with ${t.agentName||"Obi"}.`,centerVisual:g(vU,{spectrum:A}),actionDisabled:!0,onAction:n})}function wU({id:t,name:e,description:A,duration:n=10,order:i=0,selected:r=!1,onClick:s}){return g("div",{className:`course-container ${r?"selected":""}`,onClick:()=>{s==null||s({id:t,name:e,description:A,duration:n,order:i})},children:[g("div",{className:"header-row",children:[g("h2",{className:"course-title",children:e}),g("span",{className:"duration",children:["~",n," mins"]})]}),A&&g("p",{className:"course-description",children:A})]})}function bU({courses:t=[],selectedCourseId:e=null,loading:A=!1,error:n="",onCourseSelect:i}){const[r,s]=Z(""),a=l=>{const u=l.currentTarget;s(u.value)},o=l=>{i==null||i(l)};if(A)return g("div",{className:"loading",children:"Loading..."});if(n)return g("div",{className:"error",children:n});if(!t||t.length===0)return g("div",{className:"empty",children:"No courses available"});const c=t.filter(l=>l.name.toLowerCase().includes(r.toLowerCase())||(l.description||"").toLowerCase().includes(r.toLowerCase()));return g("div",{className:"tour-select",children:[g("div",{className:"controls",children:[g("div",{className:"tabs",children:g("button",{className:"tab active",children:"All"})}),g("div",{className:"filter",children:[g("svg",{width:"14",height:"14",viewBox:"0 0 14 14",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:g("path",{d:"M10.0417 8.75002H9.42087L9.20004 8.53502C9.96921 7.63585 10.4417 6.47502 10.4417 5.20835C10.4417 2.56085 8.32254 0.441681 5.67504 0.441681C3.02754 0.441681 0.908374 2.56085 0.908374 5.20835C0.908374 7.85585 3.02754 9.97502 5.67504 9.97502C6.94171 9.97502 8.10254 9.50252 9.00171 8.73335L9.22671 8.95418V9.57502L13.2167 13.5592L14.375 12.4008L10.0417 8.75002ZM5.67504 8.75002C3.72754 8.75002 2.15837 7.18085 2.15837 5.20835C2.15837 3.23585 3.72754 1.66668 5.67504 1.66668C7.62254 1.66668 9.19171 3.23585 9.19171 5.20835C9.19171 7.18085 7.62254 8.75002 5.67504 8.75002Z",fill:"#6B7280"})}),g("input",{type:"text",placeholder:"Search...",value:r,onInput:a})]})]}),g("div",{className:"course-grid",children:c.sort((l,u)=>(l.order||0)-(u.order||0)).map(l=>{const u=l.id===e;return g(wU,{id:l.id,name:l.name,description:l.description||"",duration:l.duration,order:l.order||0,selected:u,onClick:o},l.id)})})]})}function yU({open:t,courses:e=[],loading:A=!1,error:n="",agentName:i="Obi",onClose:r,onCourseSelect:s}){const[a,o]=Z(null),c=u=>{o(u)},l=()=>{a&&s&&s(a)};return g(Nh,{open:t,onClose:r,size:"large",children:g("div",{className:"tour-select-modal-container",children:[g("div",{className:"header",children:[g("div",{className:"icon",style:{color:"white"},children:g(sf,{})}),g("div",{className:"title-section",children:A?g(Pe,{children:[g("div",{className:"skeleton skeleton-title"}),g("div",{className:"skeleton skeleton-subtitle"})]}):g(Pe,{children:[g("h1",{children:["Give ",i," a try!"]}),g("p",{className:"subtitle",children:["Pick a tutorial, share your screen, and ",i," will take it from there."]})]})})]}),g("div",{className:"course-list-wrapper",children:g(bU,{courses:e,selectedCourseId:(a==null?void 0:a.id)||"",loading:A,error:n,onCourseSelect:c})}),g("div",{className:"footer",children:[g("button",{className:"obi-button footer-button",onClick:l,disabled:!a,children:[g("span",{children:"Get started"}),g("svg",{xmlns:"http://www.w3.org/2000/svg",width:"17",height:"16",viewBox:"0 0 17 16",fill:"none",children:g("path",{d:"M3.83325 8.00065H13.1666M13.1666 8.00065L8.49992 3.33398M13.1666 8.00065L8.49992 12.6673",stroke:a?"#FAFAFA":"#999","stroke-width":"1.33","stroke-linecap":"round","stroke-linejoin":"round"})})]}),g("p",{className:"footer-text",children:"Sessions are securely recorded for quality improvement purposes."})]})]})})}function UU({session:t,sessionState:e,speakingState:A,spectrum:n,onStart:i,onContinue:r,onShareMicrophone:s,onShareScreen:a}){function o(){e==="connecting"||e==="connected"||!e?i==null||i():e==="volume-check"||e==="mic-check"?r==null||r():e==="mic-share"?s==null||s():e==="screen-share"&&(a==null||a())}return no(()=>{switch(e){case null:case"connecting":case"connected":return g(uU,{session:t,speakingState:A,onAction:o});case"volume-check":return g(gU,{session:t,speakingState:A,onAction:o});case"mic-check":return g(CU,{session:t,speakingState:A,spectrum:n,onAction:o});case"mic-share":return g(hU,{session:t,speakingState:A,onAction:o});case"screen-share":return g(BU,{session:t,speakingState:A,onAction:o});case"navigate":return g(cU,{session:t,speakingState:A,onAction:o});default:return null}},[e,A,i,r,s,a])}function QU(t){const{session:e,sessionState:A,speakingState:n,spectrum:i,onClose:r,onStart:s,onContinue:a,onShareMicrophone:o,onShareScreen:c}=t,l=(t.open??!0)&&(!A||A==="connecting"||A==="connected"||A==="volume-check"||A==="mic-check"||A==="mic-share"||A==="screen-share"||A==="navigate");return g(aU,{open:l,onClose:r,children:()=>g(UU,{session:e,sessionState:A,speakingState:n,spectrum:i,onStart:s,onContinue:a,onShareMicrophone:o,onShareScreen:c})})}function EU(t){let e=t.replace(/[.+^${}()|[\]\\]/g,"\\$&").replace(/\*\*/g,"__DOUBLE_STAR__").replace(/\*/g,"[^/]*").replace(/__DOUBLE_STAR__/g,".*").replace(/\?/g,"[^/]");return new RegExp(`^${e}$`,"i")}function SU(t,e){if(!e||e.length===0)return!1;const A=t.replace(/^https?:\/\//,"").replace(/\/$/,"");return e.some(n=>{try{const i=EU(n);return i.test(A)||i.test(t)}catch(i){return console.warn(`Invalid URL pattern: ${n}`,i),!1}})}function lo(t){if(!t||t.length===0)return!1;const e=window.location.origin+window.location.pathname;return SU(e,t)}function kU(t){var b,U,w;const[e,A]=Z(!1),[n,i]=Z(!1),[r,s]=Z(null),a=TU(t.sdk,o,t.shadowHost,s);function o(v){var y;(y=a.client)!=null&&y.session||A(v)}if(!a.client)return null;const c=FU((b=a.client.product)==null?void 0:b.widget_url_blacklist),l=a.client.session,u=!!l,d=u&&!e;let h;switch(l==null?void 0:l.speakingState){case"listening":h="user-speaking";break;case"speaking":h="agent-speaking";break;case"thinking":h="thinking";break;case"busy":h="busy";break}const p=l==null?void 0:l.isPaused,f=a.client.state==="ready"&&!c&&(a.client.selectedPlan||!((U=a.client.product)!=null&&U.widget_link_only_access)),m=d?100:62,B=()=>{var v,y,E,T,F,R;return{name:(v=a.client.selectedPlan)==null?void 0:v.name,description:(y=a.client.selectedPlan)==null?void 0:y.description,appName:(E=a.client.product)==null?void 0:E.name,appLogoUrl:((T=a.client.product)==null?void 0:T.logo_url)||"",url:(F=a.client.product)==null?void 0:F.url,agentName:((R=a.client.product)==null?void 0:R.agent_name)||"Obi"}};return g("div",{children:f&&g(Pe,{children:[g("div",{style:{position:"fixed",top:`calc(100vh - ${m}px)`,left:"50%",transform:"translateX(-50%)",width:"max-content"},children:g(iU,{inPlan:u,isActive:n?!1:void 0,defaultIsActive:!0,isPaused:p,messaging:(l==null?void 0:l.isMicShared)===!1?!0:void 0,speakingStatus:h,spectrum:()=>(l==null?void 0:l.audioSpectrum())||null,courseProgress:r,onOpen:()=>{A(!0)},onCancel:()=>{var v;(v=a.client.session)==null||v.stop()},onPause:()=>{var v,y;(y=(v=a.client.session)==null?void 0:v.pause)==null||y.call(v)},onUnpause:()=>{var v,y;(y=(v=a.client.session)==null?void 0:v.unpause)==null||y.call(v)},onMessagingChange:v=>{var y,E,T,F;v?(E=(y=a.client.session)==null?void 0:y.muteMicrophone)==null||E.call(y):(F=(T=a.client.session)==null?void 0:T.unmuteMicrophone)==null||F.call(T)},onMessage:v=>{a.say(v)}})}),e&&g(yU,{open:e,courses:a.client.plans.map(v=>({id:v.uuid,name:v.name,description:v.description||"",duration:v.duration||0})),loading:!1,agentName:((w=a.client.product)==null?void 0:w.agent_name)||"Obi",onCourseSelect:v=>{const y=a.client.plans.find(E=>E.uuid===v.id)||null;y&&(a.client.selectPlan(y),A(!1),i(!0))},onClose:v=>{v==="user-initiated"&&a.client.selectPlan(null),A(!1)}}),!!a.client.selectedPlan&&g(QU,{open:!0,session:B(),sessionState:(l==null?void 0:l.state)||null,speakingState:(l==null?void 0:l.speakingState)||null,spectrum:()=>(l==null?void 0:l.audioSpectrum())||null,onClose:v=>{v==="user-initiated"&&a.client.stopSession(),i(!1)},onStart:()=>{a.client.selectedPlanUuid&&a.startSession()},onContinue:()=>{l==null||l.continue()},onShareMicrophone:()=>{l==null||l.shareMicrophone()}})]})})}function TU(t,e,A,n){const[i,r]=Z(0),[s,a]=Z(null);return Ge(()=>{t.on("showMenu",o=>{e(o)})},[t]),Ge(()=>{t.client&&(t.client.session&&a(t.client.session),t.client.on("sessionStarted",o=>{a(o),r(c=>c+1)}),t.client.on("sessionStopped",()=>{a(null),r(o=>o+1)}),t.client.on("sessionShutdown",()=>{r(o=>o+1)}),t.client.on("sessionResumed",()=>{r(o=>o+1)}),t.client.on("stateChanged",()=>{var o;t.client.state==="ready"&&A.style.setProperty("--obi-color-primary",((o=t.client.product)==null?void 0:o.primary_color)||"#9500FF"),r(c=>c+1)}),t.client.on("planSelected",()=>{r(o=>o+1)}))},[t,t.client]),Ge(()=>{if(!s)return;s.on("stateChanged",()=>{r(c=>c+1)}),s.on("speakingStateChanged",()=>{r(c=>c+1)}),s.on("paused",()=>{r(c=>c+1)}),s.on("unpaused",()=>{r(c=>c+1)});const o=c=>{n(c)};return s.on&&s.on("courseProgress",o),()=>{s.off&&s.off("courseProgress",o)}},[s]),t}function FU(t){const[e,A]=Z(()=>lo(t));return Ge(()=>{A(lo(t))},[t]),Ge(()=>{IU();const n=()=>{A(lo(t))};return window.addEventListener("locationchange",n),window.addEventListener("popstate",n),window.addEventListener("hashchange",n),()=>{window.removeEventListener("locationchange",n),window.removeEventListener("popstate",n),window.removeEventListener("hashchange",n)}},[t]),e}function IU(){const t=window;if(t.__obi_history_patched)return;const{pushState:e,replaceState:A}=window.history,n=i=>function(...r){const s=i.apply(this,r);return window.dispatchEvent(new Event("locationchange")),s};window.history.pushState=n(e),window.history.replaceState=n(A),t.__obi_history_patched=!0}function xU(t){if(document.querySelector("obi-widget")){console.debug("[obi] widget already mounted");return}_U();const e=document.createElement("div");e.id="host",e.style.position="fixed",e.style.zIndex="9999",document.body.appendChild(e);const A=e.attachShadow({mode:"open"}),n=document.createElement("div");n.id="obi-container",n.className="parentclass",A.appendChild(n);const i=new CSSStyleSheet;i.replaceSync(Sy),A.adoptedStyleSheets=[i],Uy(g(kU,{sdk:t,shadowHost:e}),n),console.log("[obi-sdk] widget mounted")}function _U(){af("https://fonts.cdnfonts.com/css/satoshi"),af("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap")}function af(t){const e=document.createElement("link");e.href=t,e.rel="stylesheet",document.head.appendChild(e)}const of="49206C6F7665204F6269_session",cf="obi-url-params";class PU extends kr{constructor(e){super(),this.client=null,this.isActive=!1,this.primaryColour="#9500FF",this.commandQueue=[],this._resumed=!1,this.dispatchCommand=(A,n,i)=>{var r,s;switch(A){case"update":this.updateConfig(n,i);break;case"endSession":(s=(r=this.client)==null?void 0:r.stopSession)==null||s.call(r);break;case"say":this.say(n);break;default:console.warn("[obi] unknown command",{commandType:A,args:n})}},e&&this.createClient(e)}async createClient(e){if(this.client){this.client.appToken!==e&&console.warn("[obi] client already exists with different app token");return}console.debug("[obi] creating client");let A=null;const n=this.load();if(n){console.debug("[obi] attempting to load cached client");try{A=vr.deserialise(n,e,"sdk",{apiBaseUrl:"https://app.coragents.ai",captureScreen:this.captureScreen.bind(this)}),this._resumed=!0}catch(i){console.error("[obi] error loading cached client",i)}}A||(A=new vr(e,"sdk",{apiBaseUrl:"https://app.coragents.ai",captureScreen:this.captureScreen.bind(this)})),this.client=A,this.client.on("stateChanged",i=>{var r,s,a;i==="ready"&&this.updateConfig({isActive:(r=this.client)==null?void 0:r.showWidget,primaryColour:((a=(s=this.client)==null?void 0:s.product)==null?void 0:a.primary_color)||"#9500FF"})}),this.client.on("sessionStarted",()=>{this.save()}),this.client.on("sessionStopped",()=>{console.debug("[obi] removing client from local storage"),localStorage.removeItem("obi-client")}),this.client.on("sessionShutdown",i=>{i==="invalid-room"&&(console.debug("[obi] removing client from local storage"),localStorage.removeItem("obi-client"))}),this.client.session&&this.client.resumeSession(i=>{i.on("stateChanged",r=>{r!=="disconnecting"&&r!=="disconnected"&&r!=="error"&&r!=="connecting"&&this.save()}),i.on("paused",()=>{this.save()}),i.on("unpaused",()=>{this.save()})})}async initialise(e={}){const A=this.parsePassiveParams()||void 0;this.commandQueue=e.queuedCommands||[],this._resumed?(this._resumed=!1,this.dispatchCommandQueue()):this.client?(console.debug("[obi] client already exists, initialising"),this.client.initialise({planUuid:A}).then(()=>{this.emit("initialised"),this.dispatchCommandQueue()}).catch(n=>{console.error("[obi] error initialising client",n),this.emit("error",n)})):(console.debug("[obi] client does not exist, dispatching command queue"),this.dispatchCommandQueue(A))}updateConfig(e,A){console.debug("[obi] updating config",e),this.updateAppToken(e.apiKey,A),this.updateActive(e.isActive),this.updatePrimaryColour(e.primaryColour),this.updateIdentity(e.user),this.updateShowMenu(e.showMenu)}async updateAppToken(e,A){var n;e===void 0||e==((n=this.client)==null?void 0:n.appToken)||(console.debug("[obi] updating app token",{appToken:e,planUuid:A}),await this.createClient(e),this.client&&this.client.initialise({planUuid:A}).then(()=>{this.emit("initialised")}).catch(i=>{console.error("[obi] error initialising client",i),this.emit("error",i)}))}updateActive(e){e===void 0||e==this.isActive||(console.debug("[obi] updating active state",e),this.isActive=e)}updatePrimaryColour(e){e===void 0||e==this.primaryColour||(console.debug("[obi] updating primary colour",e),this.primaryColour=e)}updateIdentity(e){var A;e===void 0||e==((A=this.client)==null?void 0:A.identity)||(console.debug("[obi] updating identity",e),this.client.initialise({identity:e||void 0}).catch(n=>{console.error("[obi] error updating identity",n),this.emit("error",n)}))}updateShowMenu(e){console.debug("[obi] updating show menu",e),this.emit("showMenu",e)}async say(e){var A,n,i;await((i=(n=(A=this.client)==null?void 0:A.session)==null?void 0:n.say)==null?void 0:i.call(n,e))}async startSession(){await this.client.startSession(this.client.selectedPlan.uuid,e=>{e.on("stateChanged",A=>{A!=="disconnecting"&&A!=="disconnected"&&A!=="error"&&A!=="connecting"&&this.save()})})}dispatchCommandQueue(e){const A=this.commandQueue;this.commandQueue=[],A.forEach(n=>{console.debug("[obi] dispatching command",n);try{this.dispatchCommand(n[0],n[1]||[],e)}catch(i){console.error("[obi] error dispatching command",i)}})}parsePassiveParams(){console.debug("[obi] parsing passive params");let e={};e=JSON.parse(localStorage.getItem(cf)||"{}"),Object.keys(e).length===0&&new URLSearchParams(window.location.search).forEach((r,s)=>{e[s]=r});const A=e[of];if(!A)return null;console.debug("[obi] found plan uuid from passive params",A);const n=new URL(window.location.href);return n.searchParams.delete(of),window.history.replaceState({},"",n.toString()),localStorage.removeItem(cf),A}mountWidget(){xU(this),console.debug("[obi] widget mounted")}async captureScreen(){return(await Fv(document.documentElement,{useCORS:!0,allowTaint:!0,foreignObjectRendering:!0})).toDataURL("image/png")}save(){}load(){return localStorage.getItem("obi-client")}}async function lf(t){let e;try{e=window}catch{console.warn("[obi] no window object found"),e={}}return RU({appToken:t,window:e})}async function RU({appToken:t,window:e}){var i,r;if(e.obi){console.warn("[obi] obi object already found on window, skipping");return}t||(t=(i=e==null?void 0:e.obiWidgetConfig)==null?void 0:i.apiKey);let A;try{A=((r=e.ObiSDK)==null?void 0:r.q)||[]}catch{A=[]}const n=new PU(t);return e.ObiSDK=n.dispatchCommand,await n.initialise({queuedCommands:A}),e.obi=n,n.mountWidget(),n}document.readyState==="loading"?document.addEventListener("DOMContentLoaded",()=>{lf()}):lf()})();
+        `}),g("article",{style:t.skeletonContainer,role:"status","aria-label":"Loading content",children:[g("section",{style:t.headerSection,children:[g("div",{style:t.avatar,role:"img","aria-label":"Loading avatar",children:g("div",{style:t.shimmer})}),g("div",{style:t.textLines,children:[g("div",{style:t.textLine,role:"presentation","aria-label":"Loading text line 1",children:g("div",{style:t.shimmer})}),g("div",{style:t.textLine,role:"presentation","aria-label":"Loading text line 2",children:g("div",{style:t.shimmer})})]})]}),g("section",{style:t.contentSection,children:g("div",{style:t.contentBlock,role:"presentation","aria-label":"Loading card content",children:g("div",{style:t.shimmer})})})]})]})}function mU({}){const t={host:{display:"block"},shareContainer:{width:"480px",height:"240px",borderRadius:"12px",display:"grid",placeItems:"center",overflow:"hidden",position:"relative",backgroundColor:"var(--obi-color-tint)"},controlsRow:{zIndex:10,gridRowStart:1,gridColumnStart:1,display:"flex",alignSelf:"flex-start",marginTop:"36px",alignItems:"center",gap:"8px"},monitorIconContainer:{display:"flex",height:"40px",width:"40px",aspectRatio:"1",alignItems:"center",justifyContent:"center",gap:"8px",borderRadius:"2px",border:"1px solid #E4E4E7",background:"#F8FAFC",padding:"8px"},monitorIcon:{width:"24px",height:"24px",color:"#111827"},tabSelector:{display:"flex",width:"260px",height:"40px",padding:"4px",alignItems:"center",borderRadius:"2px",background:"#E4E4E7"},tabButton:e=>({display:"flex",flex:1,alignSelf:"stretch",alignItems:"center",justifyContent:"center",gap:"10px",borderRadius:"2px",padding:"6px 12px",border:"none",cursor:"pointer",fontFamily:"'Satoshi', sans-serif",fontSize:"14px",fontWeight:500,opacity:e?1:.4,background:e?"white":"#F8FAFC",boxShadow:e?"0 1px 2px 0 rgba(0, 0, 0, 0.05)":"none"}),skeletonContainer:{marginTop:"104px",gridColumnStart:1,gridRowStart:1,alignSelf:"center"}};return g("div",{style:t.host,children:g("div",{style:t.shareContainer,children:[g("div",{style:t.controlsRow,children:[g("div",{style:t.monitorIconContainer,children:g("svg",{style:t.monitorIcon,fill:"none",stroke:"currentColor",viewBox:"0 0 24 24",children:[g("rect",{width:"20",height:"14",x:"2",y:"3",rx:"2",ry:"2"}),g("line",{x1:"8",x2:"16",y1:"21",y2:"21"}),g("line",{x1:"12",x2:"12",y1:"17",y2:"21"})]})}),g("div",{style:t.tabSelector,children:[g("button",{style:t.tabButton(!1),children:"Tab"}),g("button",{style:t.tabButton(!0),children:"Window"})]})]}),g("div",{style:t.skeletonContainer,children:g(pU,{})})]})})}function BU({session:t,speakingState:e,onAction:A}){return g(Zt,{title:"Connect your screen",subtitle:"Watch for the prompt in your browser",agentName:t.agentName||"Obi",buttonText:"Share screen",speakingState:e,description:`${t.agentName||"Obi"} will guide you through ${t.appName||"the app"} by watching your screen.`,centerVisual:g(mU,{}),actionDisabled:!0,onAction:A})}function vU({spectrum:t}){return g("div",{style:{borderRadius:"15px",boxShadow:"0 0 20px 2px var(--obi-color-primary)",backgroundColor:"var(--obi-color-primary)",transform:"scale(1.6)"},children:g(ao,{isActive:!0,children:g(jh,{getBands:t})})})}function CU({session:t,speakingState:e,spectrum:A,onAction:n}){return g(Zt,{title:"Overview",subtitle:`${t.agentName||"Obi"} will start your tutorial in a moment`,agentName:t.agentName||"Obi",speakingState:e,description:`Get ready to explore ${t.appName||"the app"} with ${t.agentName||"Obi"}.`,centerVisual:g(vU,{spectrum:A}),actionDisabled:!0,onAction:n})}function wU({id:t,name:e,description:A,duration:n=10,order:i=0,selected:r=!1,onClick:s}){return g("div",{className:`course-container ${r?"selected":""}`,onClick:()=>{s==null||s({id:t,name:e,description:A,duration:n,order:i})},children:[g("div",{className:"header-row",children:[g("h2",{className:"course-title",children:e}),g("span",{className:"duration",children:["~",n," mins"]})]}),A&&g("p",{className:"course-description",children:A})]})}function bU({courses:t=[],selectedCourseId:e=null,loading:A=!1,error:n="",onCourseSelect:i}){const[r,s]=Z(""),a=l=>{const u=l.currentTarget;s(u.value)},o=l=>{i==null||i(l)};if(A)return g("div",{className:"loading",children:"Loading..."});if(n)return g("div",{className:"error",children:n});if(!t||t.length===0)return g("div",{className:"empty",children:"No courses available"});const c=t.filter(l=>l.name.toLowerCase().includes(r.toLowerCase())||(l.description||"").toLowerCase().includes(r.toLowerCase()));return g("div",{className:"tour-select",children:[g("div",{className:"controls",children:[g("div",{className:"tabs",children:g("button",{className:"tab active",children:"All"})}),g("div",{className:"filter",children:[g("svg",{width:"14",height:"14",viewBox:"0 0 14 14",fill:"none",xmlns:"http://www.w3.org/2000/svg",children:g("path",{d:"M10.0417 8.75002H9.42087L9.20004 8.53502C9.96921 7.63585 10.4417 6.47502 10.4417 5.20835C10.4417 2.56085 8.32254 0.441681 5.67504 0.441681C3.02754 0.441681 0.908374 2.56085 0.908374 5.20835C0.908374 7.85585 3.02754 9.97502 5.67504 9.97502C6.94171 9.97502 8.10254 9.50252 9.00171 8.73335L9.22671 8.95418V9.57502L13.2167 13.5592L14.375 12.4008L10.0417 8.75002ZM5.67504 8.75002C3.72754 8.75002 2.15837 7.18085 2.15837 5.20835C2.15837 3.23585 3.72754 1.66668 5.67504 1.66668C7.62254 1.66668 9.19171 3.23585 9.19171 5.20835C9.19171 7.18085 7.62254 8.75002 5.67504 8.75002Z",fill:"#6B7280"})}),g("input",{type:"text",placeholder:"Search...",value:r,onInput:a})]})]}),g("div",{className:"course-grid",children:c.sort((l,u)=>(l.order||0)-(u.order||0)).map(l=>{const u=l.id===e;return g(wU,{id:l.id,name:l.name,description:l.description||"",duration:l.duration,order:l.order||0,selected:u,onClick:o},l.id)})})]})}function yU({open:t,courses:e=[],loading:A=!1,error:n="",agentName:i="Obi",onClose:r,onCourseSelect:s}){const[a,o]=Z(null),c=u=>{o(u)},l=()=>{a&&s&&s(a)};return g(Nh,{open:t,onClose:r,size:"large",children:g("div",{className:"tour-select-modal-container",children:[g("div",{className:"header",children:[g("div",{className:"icon",style:{color:"white"},children:g(sf,{})}),g("div",{className:"title-section",children:A?g(Pe,{children:[g("div",{className:"skeleton skeleton-title"}),g("div",{className:"skeleton skeleton-subtitle"})]}):g(Pe,{children:[g("h1",{children:["Give ",i," a try!"]}),g("p",{className:"subtitle",children:["Pick a tutorial, share your screen, and ",i," will take it from there."]})]})})]}),g("div",{className:"course-list-wrapper",children:g(bU,{courses:e,selectedCourseId:(a==null?void 0:a.id)||"",loading:A,error:n,onCourseSelect:c})}),g("div",{className:"footer",children:[g("button",{className:"obi-button footer-button",onClick:l,disabled:!a,children:[g("span",{children:"Get started"}),g("svg",{xmlns:"http://www.w3.org/2000/svg",width:"17",height:"16",viewBox:"0 0 17 16",fill:"none",children:g("path",{d:"M3.83325 8.00065H13.1666M13.1666 8.00065L8.49992 3.33398M13.1666 8.00065L8.49992 12.6673",stroke:a?"#FAFAFA":"#999","stroke-width":"1.33","stroke-linecap":"round","stroke-linejoin":"round"})})]}),g("p",{className:"footer-text",children:"Sessions are securely recorded for quality improvement purposes."})]})]})})}function UU({session:t,sessionState:e,speakingState:A,spectrum:n,onStart:i,onContinue:r,onShareMicrophone:s,onShareScreen:a}){function o(){e==="connecting"||e==="connected"||!e?i==null||i():e==="volume-check"||e==="mic-check"?r==null||r():e==="mic-share"?s==null||s():e==="screen-share"&&(a==null||a())}return no(()=>{switch(e){case null:case"connecting":case"connected":return g(uU,{session:t,speakingState:A,onAction:o});case"volume-check":return g(gU,{session:t,speakingState:A,onAction:o});case"mic-check":return g(CU,{session:t,speakingState:A,spectrum:n,onAction:o});case"mic-share":return g(hU,{session:t,speakingState:A,onAction:o});case"screen-share":return g(BU,{session:t,speakingState:A,onAction:o});case"navigate":return g(cU,{session:t,speakingState:A,onAction:o});default:return null}},[e,A,i,r,s,a])}function QU(t){const{session:e,sessionState:A,speakingState:n,spectrum:i,onClose:r,onStart:s,onContinue:a,onShareMicrophone:o,onShareScreen:c}=t,l=(t.open??!0)&&(!A||A==="connecting"||A==="connected"||A==="volume-check"||A==="mic-check"||A==="mic-share"||A==="screen-share"||A==="navigate");return g(aU,{open:l,onClose:r,children:()=>g(UU,{session:e,sessionState:A,speakingState:n,spectrum:i,onStart:s,onContinue:a,onShareMicrophone:o,onShareScreen:c})})}function EU(t){let e=t.replace(/[.+^${}()|[\]\\]/g,"\\$&").replace(/\*\*/g,"__DOUBLE_STAR__").replace(/\*/g,"[^/]*").replace(/__DOUBLE_STAR__/g,".*").replace(/\?/g,"[^/]");return new RegExp(`^${e}$`,"i")}function SU(t,e){if(!e||e.length===0)return!1;const A=t.replace(/^https?:\/\//,"").replace(/\/$/,"");return e.some(n=>{try{const i=EU(n);return i.test(A)||i.test(t)}catch(i){return console.warn(`Invalid URL pattern: ${n}`,i),!1}})}function lo(t){if(!t||t.length===0)return!1;const e=window.location.origin+window.location.pathname;return SU(e,t)}function kU(t){var b,U,w;const[e,A]=Z(!1),[n,i]=Z(!1),[r,s]=Z(null),a=TU(t.sdk,o,t.shadowHost,s);function o(v){var y;(y=a.client)!=null&&y.session||A(v)}if(!a.client)return null;const c=FU((b=a.client.product)==null?void 0:b.widget_url_blacklist),l=a.client.session,u=!!l,d=u&&!e;let h;switch(l==null?void 0:l.speakingState){case"listening":h="user-speaking";break;case"speaking":h="agent-speaking";break;case"thinking":h="thinking";break;case"busy":h="busy";break}const p=l==null?void 0:l.isPaused,f=a.client.state==="ready"&&!c&&(a.client.selectedPlan||!((U=a.client.product)!=null&&U.widget_link_only_access)),m=d?100:62,B=()=>{var v,y,E,T,F,R;return{name:(v=a.client.selectedPlan)==null?void 0:v.name,description:(y=a.client.selectedPlan)==null?void 0:y.description,appName:(E=a.client.product)==null?void 0:E.name,appLogoUrl:((T=a.client.product)==null?void 0:T.logo_url)||"",url:(F=a.client.product)==null?void 0:F.url,agentName:((R=a.client.product)==null?void 0:R.agent_name)||"Obi"}};return g("div",{children:f&&g(Pe,{children:[g("div",{style:{position:"fixed",top:`calc(100vh - ${m}px)`,left:"50%",transform:"translateX(-50%)",width:"max-content"},children:g(iU,{inPlan:u,isActive:n?!1:void 0,defaultIsActive:!0,isPaused:p,messaging:(l==null?void 0:l.isMicShared)===!1?!0:void 0,speakingStatus:h,spectrum:()=>(l==null?void 0:l.audioSpectrum())||null,courseProgress:r,onOpen:()=>{A(!0)},onCancel:()=>{var v;(v=a.client.session)==null||v.stop()},onPause:()=>{var v,y;(y=(v=a.client.session)==null?void 0:v.pause)==null||y.call(v)},onUnpause:()=>{var v,y;(y=(v=a.client.session)==null?void 0:v.unpause)==null||y.call(v)},onMessagingChange:v=>{var y,E,T,F;v?(E=(y=a.client.session)==null?void 0:y.muteMicrophone)==null||E.call(y):(F=(T=a.client.session)==null?void 0:T.unmuteMicrophone)==null||F.call(T)},onMessage:v=>{a.say(v)}})}),e&&g(yU,{open:e,courses:a.client.plans.map(v=>({id:v.uuid,name:v.name,description:v.description||"",duration:v.duration||0})),loading:!1,agentName:((w=a.client.product)==null?void 0:w.agent_name)||"Obi",onCourseSelect:v=>{const y=a.client.plans.find(E=>E.uuid===v.id)||null;y&&(a.client.selectPlan(y),A(!1),i(!0))},onClose:v=>{v==="user-initiated"&&a.client.selectPlan(null),A(!1)}}),!!a.client.selectedPlan&&g(QU,{open:!0,session:B(),sessionState:(l==null?void 0:l.state)||null,speakingState:(l==null?void 0:l.speakingState)||null,spectrum:()=>(l==null?void 0:l.audioSpectrum())||null,onClose:v=>{v==="user-initiated"&&a.client.stopSession(),i(!1)},onStart:()=>{a.client.selectedPlanUuid&&a.startSession()},onContinue:()=>{l==null||l.continue()},onShareMicrophone:()=>{l==null||l.shareMicrophone()}})]})})}function TU(t,e,A,n){const[i,r]=Z(0),[s,a]=Z(null);return Ge(()=>{t.on("showMenu",o=>{e(o)})},[t]),Ge(()=>{t.client&&(t.client.session&&a(t.client.session),t.client.on("sessionStarted",o=>{a(o),r(c=>c+1)}),t.client.on("sessionStopped",()=>{a(null),r(o=>o+1)}),t.client.on("sessionShutdown",()=>{r(o=>o+1)}),t.client.on("sessionResumed",()=>{r(o=>o+1)}),t.client.on("stateChanged",()=>{var o;t.client.state==="ready"&&A.style.setProperty("--obi-color-primary",((o=t.client.product)==null?void 0:o.primary_color)||"#9500FF"),r(c=>c+1)}),t.client.on("planSelected",()=>{r(o=>o+1)}))},[t,t.client]),Ge(()=>{if(!s)return;s.on("stateChanged",()=>{r(c=>c+1)}),s.on("speakingStateChanged",()=>{r(c=>c+1)}),s.on("paused",()=>{r(c=>c+1)}),s.on("unpaused",()=>{r(c=>c+1)});const o=c=>{n(c)};return s.on&&s.on("courseProgress",o),()=>{s.off&&s.off("courseProgress",o)}},[s]),t}function FU(t){const[e,A]=Z(()=>lo(t));return Ge(()=>{A(lo(t))},[t]),Ge(()=>{IU();const n=()=>{A(lo(t))};return window.addEventListener("locationchange",n),window.addEventListener("popstate",n),window.addEventListener("hashchange",n),()=>{window.removeEventListener("locationchange",n),window.removeEventListener("popstate",n),window.removeEventListener("hashchange",n)}},[t]),e}function IU(){const t=window;if(t.__obi_history_patched)return;const{pushState:e,replaceState:A}=window.history,n=i=>function(...r){const s=i.apply(this,r);return window.dispatchEvent(new Event("locationchange")),s};window.history.pushState=n(e),window.history.replaceState=n(A),t.__obi_history_patched=!0}function xU(t){if(document.querySelector("obi-widget")){console.debug("[obi] widget already mounted");return}_U();const e=document.createElement("div");e.id="host",e.style.position="fixed",e.style.zIndex="9999",document.body.appendChild(e);const A=e.attachShadow({mode:"open"}),n=document.createElement("div");n.id="obi-container",n.className="parentclass",A.appendChild(n);const i=new CSSStyleSheet;i.replaceSync(Sy),A.adoptedStyleSheets=[i],Uy(g(kU,{sdk:t,shadowHost:e}),n),console.log("[obi-sdk] widget mounted")}function _U(){af("https://fonts.cdnfonts.com/css/satoshi"),af("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap")}function af(t){const e=document.createElement("link");e.href=t,e.rel="stylesheet",document.head.appendChild(e)}const of="49206C6F7665204F6269_session",cf="obi-url-params";class PU extends kr{constructor(e){super(),this.client=null,this.isActive=!1,this.primaryColour="#9500FF",this.commandQueue=[],this._resumed=!1,this.dispatchCommand=(A,n,i)=>{var r,s;switch(A){case"update":this.updateConfig(n,i);break;case"endSession":(s=(r=this.client)==null?void 0:r.stopSession)==null||s.call(r);break;case"say":this.say(n);break;default:console.warn("[obi] unknown command",{commandType:A,args:n})}},e&&this.createClient(e)}async createClient(e){if(this.client){this.client.appToken!==e&&console.warn("[obi] client already exists with different app token");return}console.debug("[obi] creating client");let A=null;const n=this.load();if(n){console.debug("[obi] attempting to load cached client");try{A=vr.deserialise(n,e,"sdk",{apiBaseUrl:"https://app.coragents.ai",captureScreen:this.captureScreen.bind(this)}),this._resumed=!0}catch(i){console.error("[obi] error loading cached client",i)}}A||(A=new vr(e,"sdk",{apiBaseUrl:"https://app.coragents.ai",captureScreen:this.captureScreen.bind(this)})),this.client=A,this.client.on("stateChanged",i=>{var r,s,a;i==="ready"&&this.updateConfig({isActive:(r=this.client)==null?void 0:r.showWidget,primaryColour:((a=(s=this.client)==null?void 0:s.product)==null?void 0:a.primary_color)||"#9500FF"})}),this.client.on("sessionStarted",()=>{this.save()}),this.client.on("sessionStopped",()=>{console.debug("[obi] removing client from local storage"),localStorage.removeItem("obi-client")}),this.client.on("sessionShutdown",i=>{i==="invalid-room"&&(console.debug("[obi] removing client from local storage"),localStorage.removeItem("obi-client"))}),this.client.session&&this.client.resumeSession(i=>{i.on("stateChanged",r=>{r!=="disconnecting"&&r!=="disconnected"&&r!=="error"&&r!=="connecting"&&this.save()}),i.on("paused",()=>{this.save()}),i.on("unpaused",()=>{this.save()})})}async initialise(e={}){const A=this.parsePassiveParams()||void 0;this.commandQueue=e.queuedCommands||[],this._resumed?(this._resumed=!1,this.dispatchCommandQueue()):this.client?(console.debug("[obi] client already exists, initialising"),this.client.initialise({planUuid:A}).then(()=>{this.emit("initialised"),this.dispatchCommandQueue()}).catch(n=>{console.error("[obi] error initialising client",n),this.emit("error",n)})):(console.debug("[obi] client does not exist, dispatching command queue"),this.dispatchCommandQueue(A))}async updateConfig(e,A){console.debug("[obi] updating config",e),await this.updateAppToken(e.apiKey,A),this.updateActive(e.isActive),this.updatePrimaryColour(e.primaryColour),await this.updateIdentity(e.user),this.updateShowMenu(e.showMenu)}async updateAppToken(e,A){var n;e===void 0||e==((n=this.client)==null?void 0:n.appToken)||(console.debug("[obi] updating app token",{appToken:e,planUuid:A}),await this.createClient(e),this.client&&await this.client.initialise({planUuid:A}).then(()=>{this.emit("initialised")}).catch(i=>{console.error("[obi] error initialising client",i),this.emit("error",i)}))}updateActive(e){e===void 0||e==this.isActive||(console.debug("[obi] updating active state",e),this.isActive=e)}updatePrimaryColour(e){e===void 0||e==this.primaryColour||(console.debug("[obi] updating primary colour",e),this.primaryColour=e)}async updateIdentity(e,A){var n;e===void 0||e==((n=this.client)==null?void 0:n.identity)||(console.debug("[obi] updating identity",e),await this.client.initialise({identity:e||void 0,planUuid:A}).then(()=>{this.emit("initialised")}).catch(i=>{console.error("[obi] error initialising client",i),this.emit("error",i)}))}updateShowMenu(e){e!==void 0&&(console.debug("[obi] updating show menu",e),this.emit("showMenu",e))}async say(e){var A,n,i;await((i=(n=(A=this.client)==null?void 0:A.session)==null?void 0:n.say)==null?void 0:i.call(n,e))}async startSession(){await this.client.startSession(this.client.selectedPlan.uuid,e=>{e.on("stateChanged",A=>{A!=="disconnecting"&&A!=="disconnected"&&A!=="error"&&A!=="connecting"&&this.save()})})}dispatchCommandQueue(e){const A=this.commandQueue;this.commandQueue=[],A.forEach(n=>{console.debug("[obi] dispatching command",n);try{this.dispatchCommand(n[0],n[1]||[],e)}catch(i){console.error("[obi] error dispatching command",i)}})}parsePassiveParams(){console.debug("[obi] parsing passive params");let e={};e=JSON.parse(localStorage.getItem(cf)||"{}"),Object.keys(e).length===0&&new URLSearchParams(window.location.search).forEach((r,s)=>{e[s]=r});const A=e[of];if(!A)return null;console.debug("[obi] found plan uuid from passive params",A);const n=new URL(window.location.href);return n.searchParams.delete(of),window.history.replaceState({},"",n.toString()),localStorage.removeItem(cf),A}mountWidget(){xU(this),console.debug("[obi] widget mounted")}async captureScreen(){return(await Fv(document.documentElement,{useCORS:!0,allowTaint:!0,foreignObjectRendering:!0})).toDataURL("image/png")}save(){}load(){return localStorage.getItem("obi-client")}}async function lf(t){let e;try{e=window}catch{console.warn("[obi] no window object found"),e={}}return RU({appToken:t,window:e})}async function RU({appToken:t,window:e}){var i,r;if(e.obi){console.warn("[obi] obi object already found on window, skipping");return}t||(t=(i=e==null?void 0:e.obiWidgetConfig)==null?void 0:i.apiKey);let A;try{A=((r=e.ObiSDK)==null?void 0:r.q)||[]}catch{A=[]}const n=new PU(t);return e.ObiSDK=n.dispatchCommand,await n.initialise({queuedCommands:A}),e.obi=n,n.mountWidget(),n}document.readyState==="loading"?document.addEventListener("DOMContentLoaded",()=>{lf()}):lf()})();

package/dist/src/sdk.d.ts

@@ -0,0 +1,82 @@
+import { EventEmitter } from "eventemitter3";
+import type { Identity } from "@obi/obi-client";
+import { ObiClient } from "@obi/obi-client";
+import { Command, CommandType, Config } from "./types";
+export declare const PLAN_URL_PARAM = "49206C6F7665204F6269_session";
+export declare const STORAGE_KEY = "obi-url-params";
+export type ObiSDKEvents = {
+    initialised: () => void;
+    error: (err: Error) => void;
+    showMenu: (showMenu: boolean) => void;
+};
+export type InitialiseArgs = {
+    queuedCommands?: Command[];
+};
+export declare class ObiSDK extends EventEmitter {
+    client: ObiClient | null;
+    isActive: boolean;
+    primaryColour: string;
+    private commandQueue;
+    /** HACK: Need to prevent initialisation from being called if resumed. */
+    private _resumed;
+    /**
+     * Creates a client that should persist for the lifetime of the SDK.
+     * Resumes an ongoing session if one exists.
+     */
+    constructor(appToken?: string);
+    createClient(appToken: string): Promise<void>;
+    initialise(args?: InitialiseArgs): Promise<void>;
+    /**
+     * Update the SDK configuration. This is typically called before a plan starts,
+     * but it is possible to update the configuration during a plan.
+     */
+    updateConfig(config: Config, planUuid?: string): Promise<void>;
+    updateAppToken(appToken?: string, planUuid?: string): Promise<void>;
+    /**
+     * Update the SDK activity state. Activity controls whether the SDK is continuously
+     * visible or not.
+     * Ignores updates if the active state is undefined or the same as the current active state.
+     */
+    updateActive(isActive?: boolean): void;
+    /**
+     * Update the SDK primary colour. This is typically called before a plan starts,
+     * but it is possible to update the primary colour during a plan.
+     * Ignores updates if the primary colour is undefined or the same as the current primary colour.
+     */
+    updatePrimaryColour(primaryColour?: string): void;
+    /**
+     * Update the identity of the onboardee. This is typically called before a plan starts,
+     * but it is possible to update the identity during a plan.
+     * Ignores updates if the identity is undefined or the same as the current identity.
+     */
+    updateIdentity(identity?: Identity | null, planUuid?: string): Promise<void>;
+    updateShowMenu(showMenu?: boolean): void;
+    /**
+     * Say a message to the onboardee.
+     */
+    say(message: string): Promise<void>;
+    /**
+     * Start a new session.
+     */
+    startSession(): Promise<void>;
+    /**
+     * Dispatch all queued commands in the order they were added.
+     * TODO: Passing in the planuuid is not cool.
+     */
+    dispatchCommandQueue(planUuid?: string): void;
+    /**
+     * This gets set on the window object by the loader script. It is used as an abstraction to allow
+     * users to call commands without having to wait for the client to be ready. This works in tandem
+     * with the loader script, which will queue any commands that are called before the client is ready.
+     */
+    dispatchCommand: (commandType: CommandType, args: any, planUuid?: string) => void;
+    /**
+     * Parse passive initiation parameters from the URL and/or local storage.
+     * Passive initiation parameters are values that indicate a plan & app token to use immediately.
+     */
+    parsePassiveParams(): string | null;
+    mountWidget(): void;
+    captureScreen(): Promise<string>;
+    save(): void;
+    load(): string | null;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "obi-sdk",
-  "version": "0.18.13",
+  "version": "0.18.14",
   "description": "JavaScript SDK for Obi",
   "type": "module",
   "main": "dist/obi-sdk.umd.js",
@@ -41,8 +41,8 @@
     "ts-pattern": "^5.7.0",
     "zod": "^3.22.0",
     "@obi/obi-client": "0.7.0",
-    "@obi/obi-components": "0.1.0",
-    "@obi/utils": "0.2.0"
+    "@obi/utils": "0.2.0",
+    "@obi/obi-components": "0.1.0"
   },
   "devDependencies": {
     "@chromatic-com/storybook": "^4.0.0-0",