obi-sdk 0.18.11 → 0.18.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +1 -1
- package/dist/obi-sdk.standalone.iife.js +1 -1
- package/dist/src/sdk.d.ts +5 -4
- package/package.json +2 -2
- package/dist/src/types.d.ts +0 -13
package/dist/index.js
CHANGED
|
@@ -59,4 +59,4 @@ a=extmap-allow-mixed`)!==-1){const r=i.sdp.split(`
|
|
|
59
59
|
50% { transform: translateX(344px); }
|
|
60
60
|
100% { transform: translateX(344px); }
|
|
61
61
|
}
|
|
62
|
-
`}),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);function a(v){A(v)}const o=TU(t.sdk,a,t.shadowHost,s);if(!o.client)return null;const c=FU((b=o.client.product)==null?void 0:b.widget_url_blacklist),l=o.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=o.client.state==="ready"&&!c&&(o.client.selectedPlan||!((U=o.client.product)!=null&&U.widget_link_only_access)),m=d?100:62,B=()=>{var v,y,E,T,F,R;return{name:(v=o.client.selectedPlan)==null?void 0:v.name,description:(y=o.client.selectedPlan)==null?void 0:y.description,appName:(E=o.client.product)==null?void 0:E.name,appLogoUrl:((T=o.client.product)==null?void 0:T.logo_url)||"",url:(F=o.client.product)==null?void 0:F.url,agentName:((R=o.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=o.client.session)==null||v.stop()},onPause:()=>{var v,y;(y=(v=o.client.session)==null?void 0:v.pause)==null||y.call(v)},onUnpause:()=>{var v,y;(y=(v=o.client.session)==null?void 0:v.unpause)==null||y.call(v)},onMessagingChange:v=>{var y,E,T,F;v?(E=(y=o.client.session)==null?void 0:y.muteMicrophone)==null||E.call(y):(F=(T=o.client.session)==null?void 0:T.unmuteMicrophone)==null||F.call(T)},onMessage:v=>{o.say(v)}})}),e&&g(yU,{open:e,courses:o.client.plans.map(v=>({id:v.uuid,name:v.name,description:v.description||"",duration:v.duration||0})),loading:!1,agentName:((w=o.client.product)==null?void 0:w.agent_name)||"Obi",onCourseSelect:v=>{const y=o.client.plans.find(E=>E.uuid===v.id)||null;y&&(o.client.selectPlan(y),A(!1),i(!0))},onClose:v=>{v==="user-initiated"&&o.client.selectPlan(null),A(!1)}}),!!o.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"&&o.client.stopSession(),i(!1)},onStart:()=>{o.client.selectedPlanUuid&&o.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)=>{var i,r;switch(A){case"update":this.updateConfig(n[0]);break;case"endSession":(r=(i=this.client)==null?void 0:i.stopSession)==null||r.call(i);break;case"say":this.say(n[0]);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())}updateConfig(e){console.debug("[obi] updating config",e),this.updateAppToken(e.apiKey),this.updateActive(e.isActive),this.updatePrimaryColour(e.primaryColour),this.updateIdentity(e.user),this.updateShowMenu(e.showMenu)}async updateAppToken(e){var A;e===void 0||e==((A=this.client)==null?void 0:A.appToken)||(console.debug("[obi] updating app token"),await this.createClient(e))}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(){const e=this.commandQueue;this.commandQueue=[],e.forEach(A=>{console.debug("[obi] dispatching command",A);try{this.dispatchCommand(A[0],A[1]||[])}catch(n){console.error("[obi] error dispatching command",n)}})}parsePassiveParams(){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;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()})();
|
|
62
|
+
`}),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[0],i);break;case"endSession":(s=(r=this.client)==null?void 0:r.stopSession)==null||s.call(r);break;case"say":this.say(n[0]);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()})();
|
|
@@ -59,4 +59,4 @@ a=extmap-allow-mixed`)!==-1){const r=i.sdp.split(`
|
|
|
59
59
|
50% { transform: translateX(344px); }
|
|
60
60
|
100% { transform: translateX(344px); }
|
|
61
61
|
}
|
|
62
|
-
`}),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);function a(v){A(v)}const o=TU(t.sdk,a,t.shadowHost,s);if(!o.client)return null;const c=FU((b=o.client.product)==null?void 0:b.widget_url_blacklist),l=o.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=o.client.state==="ready"&&!c&&(o.client.selectedPlan||!((U=o.client.product)!=null&&U.widget_link_only_access)),m=d?100:62,B=()=>{var v,y,E,T,F,R;return{name:(v=o.client.selectedPlan)==null?void 0:v.name,description:(y=o.client.selectedPlan)==null?void 0:y.description,appName:(E=o.client.product)==null?void 0:E.name,appLogoUrl:((T=o.client.product)==null?void 0:T.logo_url)||"",url:(F=o.client.product)==null?void 0:F.url,agentName:((R=o.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=o.client.session)==null||v.stop()},onPause:()=>{var v,y;(y=(v=o.client.session)==null?void 0:v.pause)==null||y.call(v)},onUnpause:()=>{var v,y;(y=(v=o.client.session)==null?void 0:v.unpause)==null||y.call(v)},onMessagingChange:v=>{var y,E,T,F;v?(E=(y=o.client.session)==null?void 0:y.muteMicrophone)==null||E.call(y):(F=(T=o.client.session)==null?void 0:T.unmuteMicrophone)==null||F.call(T)},onMessage:v=>{o.say(v)}})}),e&&g(yU,{open:e,courses:o.client.plans.map(v=>({id:v.uuid,name:v.name,description:v.description||"",duration:v.duration||0})),loading:!1,agentName:((w=o.client.product)==null?void 0:w.agent_name)||"Obi",onCourseSelect:v=>{const y=o.client.plans.find(E=>E.uuid===v.id)||null;y&&(o.client.selectPlan(y),A(!1),i(!0))},onClose:v=>{v==="user-initiated"&&o.client.selectPlan(null),A(!1)}}),!!o.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"&&o.client.stopSession(),i(!1)},onStart:()=>{o.client.selectedPlanUuid&&o.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)=>{var i,r;switch(A){case"update":this.updateConfig(n[0]);break;case"endSession":(r=(i=this.client)==null?void 0:i.stopSession)==null||r.call(i);break;case"say":this.say(n[0]);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())}updateConfig(e){console.debug("[obi] updating config",e),this.updateAppToken(e.apiKey),this.updateActive(e.isActive),this.updatePrimaryColour(e.primaryColour),this.updateIdentity(e.user),this.updateShowMenu(e.showMenu)}async updateAppToken(e){var A;e===void 0||e==((A=this.client)==null?void 0:A.appToken)||(console.debug("[obi] updating app token"),await this.createClient(e))}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(){const e=this.commandQueue;this.commandQueue=[],e.forEach(A=>{console.debug("[obi] dispatching command",A);try{this.dispatchCommand(A[0],A[1]||[])}catch(n){console.error("[obi] error dispatching command",n)}})}parsePassiveParams(){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;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()})();
|
|
62
|
+
`}),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[0],i);break;case"endSession":(s=(r=this.client)==null?void 0:r.stopSession)==null||s.call(r);break;case"say":this.say(n[0]);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()})();
|
package/dist/src/sdk.d.ts
CHANGED
|
@@ -30,8 +30,8 @@ export declare class ObiSDK extends EventEmitter {
|
|
|
30
30
|
* Update the SDK configuration. This is typically called before a plan starts,
|
|
31
31
|
* but it is possible to update the configuration during a plan.
|
|
32
32
|
*/
|
|
33
|
-
updateConfig(config: Config): void;
|
|
34
|
-
updateAppToken(appToken?: string): Promise<void>;
|
|
33
|
+
updateConfig(config: Config, planUuid?: string): void;
|
|
34
|
+
updateAppToken(appToken?: string, planUuid?: string): Promise<void>;
|
|
35
35
|
/**
|
|
36
36
|
* Update the SDK activity state. Activity controls whether the SDK is continuously
|
|
37
37
|
* visible or not.
|
|
@@ -61,14 +61,15 @@ export declare class ObiSDK extends EventEmitter {
|
|
|
61
61
|
startSession(): Promise<void>;
|
|
62
62
|
/**
|
|
63
63
|
* Dispatch all queued commands in the order they were added.
|
|
64
|
+
* TODO: Passing in the planuuid is not cool.
|
|
64
65
|
*/
|
|
65
|
-
dispatchCommandQueue(): void;
|
|
66
|
+
dispatchCommandQueue(planUuid?: string): void;
|
|
66
67
|
/**
|
|
67
68
|
* This gets set on the window object by the loader script. It is used as an abstraction to allow
|
|
68
69
|
* users to call commands without having to wait for the client to be ready. This works in tandem
|
|
69
70
|
* with the loader script, which will queue any commands that are called before the client is ready.
|
|
70
71
|
*/
|
|
71
|
-
dispatchCommand: (commandType: CommandType,
|
|
72
|
+
dispatchCommand: (commandType: CommandType, args: any, planUuid?: string) => void;
|
|
72
73
|
/**
|
|
73
74
|
* Parse passive initiation parameters from the URL and/or local storage.
|
|
74
75
|
* Passive initiation parameters are values that indicate a plan & app token to use immediately.
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "obi-sdk",
|
|
3
|
-
"version": "0.18.
|
|
3
|
+
"version": "0.18.12",
|
|
4
4
|
"description": "JavaScript SDK for Obi",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "dist/obi-sdk.umd.js",
|
|
@@ -40,8 +40,8 @@
|
|
|
40
40
|
"preact": ">=10.0.0",
|
|
41
41
|
"ts-pattern": "^5.7.0",
|
|
42
42
|
"zod": "^3.22.0",
|
|
43
|
-
"@obi/obi-client": "0.7.0",
|
|
44
43
|
"@obi/obi-components": "0.1.0",
|
|
44
|
+
"@obi/obi-client": "0.7.0",
|
|
45
45
|
"@obi/utils": "0.2.0"
|
|
46
46
|
},
|
|
47
47
|
"devDependencies": {
|
package/dist/src/types.d.ts
DELETED
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import { Identity } from "@obi/obi-client";
|
|
2
|
-
export type CommandType = "update" | "say" | "endSession";
|
|
3
|
-
export type Command = {
|
|
4
|
-
type: CommandType;
|
|
5
|
-
args: any[];
|
|
6
|
-
};
|
|
7
|
-
export type Config = {
|
|
8
|
-
apiKey?: string;
|
|
9
|
-
isActive?: boolean;
|
|
10
|
-
primaryColour?: string;
|
|
11
|
-
user?: Identity;
|
|
12
|
-
showMenu?: boolean;
|
|
13
|
-
};
|