obi-sdk 0.18.0 → 0.18.2
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/package.json +1 -1
- package/dist/src/empty.test.d.ts +0 -1
- package/dist/src/index.d.ts +0 -1
- package/dist/src/loader.d.ts +0 -11
- package/dist/src/mount.d.ts +0 -1
- package/dist/src/sdk.d.ts +0 -77
- package/dist/src/sentry.d.ts +0 -39
- package/dist/src/types.d.ts +0 -12
- package/dist/src/url-matcher.d.ts +0 -16
- package/dist/src/url-matcher.test.d.ts +0 -1
- package/dist/src/widget.d.ts +0 -6
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,b,U;const[e,A]=Z(!1),[n,i]=Z(!1),[r,s]=Z(null),a=TU(t.sdk,t.shadowHost,s),o=FU((B=a.client.product)==null?void 0:B.widget_url_blacklist),c=a.client.session,l=!!c,u=l&&!e;let d;switch(c==null?void 0:c.speakingState){case"listening":d="user-speaking";break;case"speaking":d="agent-speaking";break;case"thinking":d="thinking";break;case"busy":d="busy";break}const h=c==null?void 0:c.isPaused,p=a.client.state==="ready"&&!o&&(a.client.selectedPlan||!((b=a.client.product)!=null&&b.widget_link_only_access)),f=u?100:62,m=()=>{var v,w,y,E,T,F;return{name:(v=a.client.selectedPlan)==null?void 0:v.name,description:(w=a.client.selectedPlan)==null?void 0:w.description,appName:(y=a.client.product)==null?void 0:y.name,appLogoUrl:((E=a.client.product)==null?void 0:E.logo_url)||"",url:(T=a.client.product)==null?void 0:T.url,agentName:((F=a.client.product)==null?void 0:F.agent_name)||"Obi"}};return g("div",{children:p&&g(Pe,{children:[g("div",{style:{position:"fixed",top:`calc(100vh - ${f}px)`,left:"50%",transform:"translateX(-50%)",width:"max-content"},children:g(iU,{inPlan:l,isActive:n?!1:void 0,defaultIsActive:!0,isPaused:h,messaging:(c==null?void 0:c.isMicShared)===!1?!0:void 0,speakingStatus:d,spectrum:()=>(c==null?void 0:c.audioSpectrum())||null,courseProgress:r,onOpen:()=>{A(!0)},onCancel:()=>{var v;(v=a.client.session)==null||v.stop()},onPause:()=>{var v,w;(w=(v=a.client.session)==null?void 0:v.pause)==null||w.call(v)},onUnpause:()=>{var v,w;(w=(v=a.client.session)==null?void 0:v.unpause)==null||w.call(v)},onMessagingChange:v=>{var w,y,E,T;v?(y=(w=a.client.session)==null?void 0:w.muteMicrophone)==null||y.call(w):(T=(E=a.client.session)==null?void 0:E.unmuteMicrophone)==null||T.call(E)},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:((U=a.client.product)==null?void 0:U.agent_name)||"Obi",onCourseSelect:v=>{const w=a.client.plans.find(y=>y.uuid===v.id)||null;w&&(a.client.selectPlan(w),A(!1),i(!0))},onClose:v=>{v==="user-initiated"&&a.client.selectPlan(null),A(!1)}}),!!a.client.selectedPlan&&g(QU,{open:!0,session:m(),sessionState:(c==null?void 0:c.state)||null,speakingState:(c==null?void 0:c.speakingState)||null,spectrum:()=>(c==null?void 0:c.audioSpectrum())||null,onClose:v=>{v==="user-initiated"&&a.client.stopSession(),i(!1)},onStart:()=>{a.client.selectedPlanUuid&&a.startSession()},onContinue:()=>{c==null||c.continue()},onShareMicrophone:()=>{c==null||c.shareMicrophone()}})]})})}function TU(t,e,A){const[n,i]=Z(0),[r,s]=Z(null);return qe(()=>{t.client&&(t.client.session&&s(t.client.session),t.client.on("sessionStarted",a=>{s(a),i(o=>o+1)}),t.client.on("sessionStopped",()=>{s(null),i(a=>a+1)}),t.client.on("sessionShutdown",()=>{i(a=>a+1)}),t.client.on("sessionResumed",()=>{i(a=>a+1)}),t.client.on("stateChanged",()=>{var a;t.client.state==="ready"&&e.style.setProperty("--obi-color-primary",((a=t.client.product)==null?void 0:a.primary_color)||"#9500FF"),i(o=>o+1)}),t.client.on("planSelected",()=>{i(a=>a+1)}))},[t,t.client]),qe(()=>{if(!r)return;r.on("stateChanged",()=>{i(o=>o+1)}),r.on("speakingStateChanged",()=>{i(o=>o+1)}),r.on("paused",()=>{i(o=>o+1)}),r.on("unpaused",()=>{i(o=>o+1)});const a=o=>{A(o)};return r.on&&r.on("courseProgress",a),()=>{r.off&&r.off("courseProgress",a)}},[r]),t}function FU(t){const[e,A]=Z(()=>lo(t));return qe(()=>{A(lo(t))},[t]),qe(()=>{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"))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.isActive=!1,this.primaryColour="#9500FF",this.commandQueue=[],this._resumed=!1,this.dispatchCommand=(i,...r)=>{var s,a;if(!this.client.isReady()){this.commandQueue.push({type:i,args:r});return}switch(i){case"update":this.updateConfig(r[0]);break;case"endSession":(a=(s=this.client)==null?void 0:s.stopSession)==null||a.call(s);break;case"say":this.say(r[0]);break;default:console.warn("[obi] unknown command",{commandType:i,args:r})}};let A=null;const n=this.load();if(n)try{A=vr.deserialise(n,e,"sdk",{apiBaseUrl:"http://localhost",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:"http://localhost",captureScreen:this.captureScreen.bind(this)})),this.client=A,this.client.on("stateChanged",i=>{var r;i==="ready"&&this.updateConfig({isActive:this.client.showWidget,primaryColour:((r=this.client.product)==null?void 0:r.primary_color)||"#9500FF"})}),this.client.on("sessionStarted",()=>{this.save()}),this.client.on("sessionStopped",()=>{localStorage.removeItem("obi-client")}),this.client.on("sessionShutdown",i=>{i==="invalid-room"&&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.initialise({planUuid:A}).then(()=>{this.emit("initialised"),this.dispatchCommandQueue()}).catch(n=>{console.error("[obi] error initialising client",n),this.emit("error",n)})}updateConfig(e){this.updateActive(e.isActive),this.updatePrimaryColour(e.primaryColour),this.updateIdentity(e.user)}updateActive(e){e===void 0||e==this.isActive||(this.isActive=e)}updatePrimaryColour(e){e===void 0||e==this.primaryColour||(this.primaryColour=e)}updateIdentity(e){e===void 0||e==this.client.identity||this.client.initialise({identity:e||void 0}).catch(A=>{console.error("[obi] error updating identity",A),this.emit("error",A)})}async say(e){var A,n;await((n=(A=this.client.session)==null?void 0:A.say)==null?void 0:n.call(A,e))}async startSession(){var e;await this.client.startSession((e=this.client.selectedPlan)==null?void 0:e.uuid,A=>{A.on("stateChanged",n=>{n!=="disconnecting"&&n!=="disconnected"&&n!=="error"&&n!=="connecting"&&this.save()})})}dispatchCommandQueue(){const e=this.commandQueue;this.commandQueue=[],e.forEach(A=>{try{this.dispatchCommand(A.type,...A.args)}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)}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.ObiSDK){console.warn("[obi] obi object already found on window, skipping");return}if(t||(t=(i=e==null?void 0:e.obiWidgetConfig)==null?void 0:i.apiKey),!t){console.error("[obi] no app token found");return}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,b,U;const[e,A]=Z(!1),[n,i]=Z(!1),[r,s]=Z(null),a=TU(t.sdk,t.shadowHost,s),o=FU((B=a.client.product)==null?void 0:B.widget_url_blacklist),c=a.client.session,l=!!c,u=l&&!e;let d;switch(c==null?void 0:c.speakingState){case"listening":d="user-speaking";break;case"speaking":d="agent-speaking";break;case"thinking":d="thinking";break;case"busy":d="busy";break}const h=c==null?void 0:c.isPaused,p=a.client.state==="ready"&&!o&&(a.client.selectedPlan||!((b=a.client.product)!=null&&b.widget_link_only_access)),f=u?100:62,m=()=>{var v,w,y,E,T,F;return{name:(v=a.client.selectedPlan)==null?void 0:v.name,description:(w=a.client.selectedPlan)==null?void 0:w.description,appName:(y=a.client.product)==null?void 0:y.name,appLogoUrl:((E=a.client.product)==null?void 0:E.logo_url)||"",url:(T=a.client.product)==null?void 0:T.url,agentName:((F=a.client.product)==null?void 0:F.agent_name)||"Obi"}};return g("div",{children:p&&g(Pe,{children:[g("div",{style:{position:"fixed",top:`calc(100vh - ${f}px)`,left:"50%",transform:"translateX(-50%)",width:"max-content"},children:g(iU,{inPlan:l,isActive:n?!1:void 0,defaultIsActive:!0,isPaused:h,messaging:(c==null?void 0:c.isMicShared)===!1?!0:void 0,speakingStatus:d,spectrum:()=>(c==null?void 0:c.audioSpectrum())||null,courseProgress:r,onOpen:()=>{A(!0)},onCancel:()=>{var v;(v=a.client.session)==null||v.stop()},onPause:()=>{var v,w;(w=(v=a.client.session)==null?void 0:v.pause)==null||w.call(v)},onUnpause:()=>{var v,w;(w=(v=a.client.session)==null?void 0:v.unpause)==null||w.call(v)},onMessagingChange:v=>{var w,y,E,T;v?(y=(w=a.client.session)==null?void 0:w.muteMicrophone)==null||y.call(w):(T=(E=a.client.session)==null?void 0:E.unmuteMicrophone)==null||T.call(E)},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:((U=a.client.product)==null?void 0:U.agent_name)||"Obi",onCourseSelect:v=>{const w=a.client.plans.find(y=>y.uuid===v.id)||null;w&&(a.client.selectPlan(w),A(!1),i(!0))},onClose:v=>{v==="user-initiated"&&a.client.selectPlan(null),A(!1)}}),!!a.client.selectedPlan&&g(QU,{open:!0,session:m(),sessionState:(c==null?void 0:c.state)||null,speakingState:(c==null?void 0:c.speakingState)||null,spectrum:()=>(c==null?void 0:c.audioSpectrum())||null,onClose:v=>{v==="user-initiated"&&a.client.stopSession(),i(!1)},onStart:()=>{a.client.selectedPlanUuid&&a.startSession()},onContinue:()=>{c==null||c.continue()},onShareMicrophone:()=>{c==null||c.shareMicrophone()}})]})})}function TU(t,e,A){const[n,i]=Z(0),[r,s]=Z(null);return qe(()=>{t.client&&(t.client.session&&s(t.client.session),t.client.on("sessionStarted",a=>{s(a),i(o=>o+1)}),t.client.on("sessionStopped",()=>{s(null),i(a=>a+1)}),t.client.on("sessionShutdown",()=>{i(a=>a+1)}),t.client.on("sessionResumed",()=>{i(a=>a+1)}),t.client.on("stateChanged",()=>{var a;t.client.state==="ready"&&e.style.setProperty("--obi-color-primary",((a=t.client.product)==null?void 0:a.primary_color)||"#9500FF"),i(o=>o+1)}),t.client.on("planSelected",()=>{i(a=>a+1)}))},[t,t.client]),qe(()=>{if(!r)return;r.on("stateChanged",()=>{i(o=>o+1)}),r.on("speakingStateChanged",()=>{i(o=>o+1)}),r.on("paused",()=>{i(o=>o+1)}),r.on("unpaused",()=>{i(o=>o+1)});const a=o=>{A(o)};return r.on&&r.on("courseProgress",a),()=>{r.off&&r.off("courseProgress",a)}},[r]),t}function FU(t){const[e,A]=Z(()=>lo(t));return qe(()=>{A(lo(t))},[t]),qe(()=>{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"))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.isActive=!1,this.primaryColour="#9500FF",this.commandQueue=[],this._resumed=!1,this.dispatchCommand=(i,...r)=>{var s,a;if(!this.client.isReady()){this.commandQueue.push({type:i,args:r});return}switch(i){case"update":this.updateConfig(r[0]);break;case"endSession":(a=(s=this.client)==null?void 0:s.stopSession)==null||a.call(s);break;case"say":this.say(r[0]);break;default:console.warn("[obi] unknown command",{commandType:i,args:r})}};let A=null;const n=this.load();if(n)try{A=vr.deserialise(n,e,"sdk",{apiBaseUrl:"http://localhost",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:"http://localhost",captureScreen:this.captureScreen.bind(this)})),this.client=A,this.client.on("stateChanged",i=>{var r;i==="ready"&&this.updateConfig({isActive:this.client.showWidget,primaryColour:((r=this.client.product)==null?void 0:r.primary_color)||"#9500FF"})}),this.client.on("sessionStarted",()=>{this.save()}),this.client.on("sessionStopped",()=>{localStorage.removeItem("obi-client")}),this.client.on("sessionShutdown",i=>{i==="invalid-room"&&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.initialise({planUuid:A}).then(()=>{this.emit("initialised"),this.dispatchCommandQueue()}).catch(n=>{console.error("[obi] error initialising client",n),this.emit("error",n)})}updateConfig(e){this.updateActive(e.isActive),this.updatePrimaryColour(e.primaryColour),this.updateIdentity(e.user)}updateActive(e){e===void 0||e==this.isActive||(this.isActive=e)}updatePrimaryColour(e){e===void 0||e==this.primaryColour||(this.primaryColour=e)}updateIdentity(e){e===void 0||e==this.client.identity||this.client.initialise({identity:e||void 0}).catch(A=>{console.error("[obi] error updating identity",A),this.emit("error",A)})}async say(e){var A,n;await((n=(A=this.client.session)==null?void 0:A.say)==null?void 0:n.call(A,e))}async startSession(){var e;await this.client.startSession((e=this.client.selectedPlan)==null?void 0:e.uuid,A=>{A.on("stateChanged",n=>{n!=="disconnecting"&&n!=="disconnected"&&n!=="error"&&n!=="connecting"&&this.save()})})}dispatchCommandQueue(){const e=this.commandQueue;this.commandQueue=[],e.forEach(A=>{try{this.dispatchCommand(A.type,...A.args)}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)}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}if(t||(t=(i=e==null?void 0:e.obiWidgetConfig)==null?void 0:i.apiKey),!t){console.error("[obi] no app token found");return}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,b,U;const[e,A]=Z(!1),[n,i]=Z(!1),[r,s]=Z(null),a=TU(t.sdk,t.shadowHost,s),o=FU((B=a.client.product)==null?void 0:B.widget_url_blacklist),c=a.client.session,l=!!c,u=l&&!e;let d;switch(c==null?void 0:c.speakingState){case"listening":d="user-speaking";break;case"speaking":d="agent-speaking";break;case"thinking":d="thinking";break;case"busy":d="busy";break}const h=c==null?void 0:c.isPaused,p=a.client.state==="ready"&&!o&&(a.client.selectedPlan||!((b=a.client.product)!=null&&b.widget_link_only_access)),f=u?100:62,m=()=>{var v,w,y,E,T,F;return{name:(v=a.client.selectedPlan)==null?void 0:v.name,description:(w=a.client.selectedPlan)==null?void 0:w.description,appName:(y=a.client.product)==null?void 0:y.name,appLogoUrl:((E=a.client.product)==null?void 0:E.logo_url)||"",url:(T=a.client.product)==null?void 0:T.url,agentName:((F=a.client.product)==null?void 0:F.agent_name)||"Obi"}};return g("div",{children:p&&g(Pe,{children:[g("div",{style:{position:"fixed",top:`calc(100vh - ${f}px)`,left:"50%",transform:"translateX(-50%)",width:"max-content"},children:g(iU,{inPlan:l,isActive:n?!1:void 0,defaultIsActive:!0,isPaused:h,messaging:(c==null?void 0:c.isMicShared)===!1?!0:void 0,speakingStatus:d,spectrum:()=>(c==null?void 0:c.audioSpectrum())||null,courseProgress:r,onOpen:()=>{A(!0)},onCancel:()=>{var v;(v=a.client.session)==null||v.stop()},onPause:()=>{var v,w;(w=(v=a.client.session)==null?void 0:v.pause)==null||w.call(v)},onUnpause:()=>{var v,w;(w=(v=a.client.session)==null?void 0:v.unpause)==null||w.call(v)},onMessagingChange:v=>{var w,y,E,T;v?(y=(w=a.client.session)==null?void 0:w.muteMicrophone)==null||y.call(w):(T=(E=a.client.session)==null?void 0:E.unmuteMicrophone)==null||T.call(E)},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:((U=a.client.product)==null?void 0:U.agent_name)||"Obi",onCourseSelect:v=>{const w=a.client.plans.find(y=>y.uuid===v.id)||null;w&&(a.client.selectPlan(w),A(!1),i(!0))},onClose:v=>{v==="user-initiated"&&a.client.selectPlan(null),A(!1)}}),!!a.client.selectedPlan&&g(QU,{open:!0,session:m(),sessionState:(c==null?void 0:c.state)||null,speakingState:(c==null?void 0:c.speakingState)||null,spectrum:()=>(c==null?void 0:c.audioSpectrum())||null,onClose:v=>{v==="user-initiated"&&a.client.stopSession(),i(!1)},onStart:()=>{a.client.selectedPlanUuid&&a.startSession()},onContinue:()=>{c==null||c.continue()},onShareMicrophone:()=>{c==null||c.shareMicrophone()}})]})})}function TU(t,e,A){const[n,i]=Z(0),[r,s]=Z(null);return qe(()=>{t.client&&(t.client.session&&s(t.client.session),t.client.on("sessionStarted",a=>{s(a),i(o=>o+1)}),t.client.on("sessionStopped",()=>{s(null),i(a=>a+1)}),t.client.on("sessionShutdown",()=>{i(a=>a+1)}),t.client.on("sessionResumed",()=>{i(a=>a+1)}),t.client.on("stateChanged",()=>{var a;t.client.state==="ready"&&e.style.setProperty("--obi-color-primary",((a=t.client.product)==null?void 0:a.primary_color)||"#9500FF"),i(o=>o+1)}),t.client.on("planSelected",()=>{i(a=>a+1)}))},[t,t.client]),qe(()=>{if(!r)return;r.on("stateChanged",()=>{i(o=>o+1)}),r.on("speakingStateChanged",()=>{i(o=>o+1)}),r.on("paused",()=>{i(o=>o+1)}),r.on("unpaused",()=>{i(o=>o+1)});const a=o=>{A(o)};return r.on&&r.on("courseProgress",a),()=>{r.off&&r.off("courseProgress",a)}},[r]),t}function FU(t){const[e,A]=Z(()=>lo(t));return qe(()=>{A(lo(t))},[t]),qe(()=>{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"))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.isActive=!1,this.primaryColour="#9500FF",this.commandQueue=[],this._resumed=!1,this.dispatchCommand=(i,...r)=>{var s,a;if(!this.client.isReady()){this.commandQueue.push({type:i,args:r});return}switch(i){case"update":this.updateConfig(r[0]);break;case"endSession":(a=(s=this.client)==null?void 0:s.stopSession)==null||a.call(s);break;case"say":this.say(r[0]);break;default:console.warn("[obi] unknown command",{commandType:i,args:r})}};let A=null;const n=this.load();if(n)try{A=vr.deserialise(n,e,"sdk",{apiBaseUrl:"http://localhost",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:"http://localhost",captureScreen:this.captureScreen.bind(this)})),this.client=A,this.client.on("stateChanged",i=>{var r;i==="ready"&&this.updateConfig({isActive:this.client.showWidget,primaryColour:((r=this.client.product)==null?void 0:r.primary_color)||"#9500FF"})}),this.client.on("sessionStarted",()=>{this.save()}),this.client.on("sessionStopped",()=>{localStorage.removeItem("obi-client")}),this.client.on("sessionShutdown",i=>{i==="invalid-room"&&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.initialise({planUuid:A}).then(()=>{this.emit("initialised"),this.dispatchCommandQueue()}).catch(n=>{console.error("[obi] error initialising client",n),this.emit("error",n)})}updateConfig(e){this.updateActive(e.isActive),this.updatePrimaryColour(e.primaryColour),this.updateIdentity(e.user)}updateActive(e){e===void 0||e==this.isActive||(this.isActive=e)}updatePrimaryColour(e){e===void 0||e==this.primaryColour||(this.primaryColour=e)}updateIdentity(e){e===void 0||e==this.client.identity||this.client.initialise({identity:e||void 0}).catch(A=>{console.error("[obi] error updating identity",A),this.emit("error",A)})}async say(e){var A,n;await((n=(A=this.client.session)==null?void 0:A.say)==null?void 0:n.call(A,e))}async startSession(){var e;await this.client.startSession((e=this.client.selectedPlan)==null?void 0:e.uuid,A=>{A.on("stateChanged",n=>{n!=="disconnecting"&&n!=="disconnected"&&n!=="error"&&n!=="connecting"&&this.save()})})}dispatchCommandQueue(){const e=this.commandQueue;this.commandQueue=[],e.forEach(A=>{try{this.dispatchCommand(A.type,...A.args)}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)}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.ObiSDK){console.warn("[obi] obi object already found on window, skipping");return}if(t||(t=(i=e==null?void 0:e.obiWidgetConfig)==null?void 0:i.apiKey),!t){console.error("[obi] no app token found");return}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,b,U;const[e,A]=Z(!1),[n,i]=Z(!1),[r,s]=Z(null),a=TU(t.sdk,t.shadowHost,s),o=FU((B=a.client.product)==null?void 0:B.widget_url_blacklist),c=a.client.session,l=!!c,u=l&&!e;let d;switch(c==null?void 0:c.speakingState){case"listening":d="user-speaking";break;case"speaking":d="agent-speaking";break;case"thinking":d="thinking";break;case"busy":d="busy";break}const h=c==null?void 0:c.isPaused,p=a.client.state==="ready"&&!o&&(a.client.selectedPlan||!((b=a.client.product)!=null&&b.widget_link_only_access)),f=u?100:62,m=()=>{var v,w,y,E,T,F;return{name:(v=a.client.selectedPlan)==null?void 0:v.name,description:(w=a.client.selectedPlan)==null?void 0:w.description,appName:(y=a.client.product)==null?void 0:y.name,appLogoUrl:((E=a.client.product)==null?void 0:E.logo_url)||"",url:(T=a.client.product)==null?void 0:T.url,agentName:((F=a.client.product)==null?void 0:F.agent_name)||"Obi"}};return g("div",{children:p&&g(Pe,{children:[g("div",{style:{position:"fixed",top:`calc(100vh - ${f}px)`,left:"50%",transform:"translateX(-50%)",width:"max-content"},children:g(iU,{inPlan:l,isActive:n?!1:void 0,defaultIsActive:!0,isPaused:h,messaging:(c==null?void 0:c.isMicShared)===!1?!0:void 0,speakingStatus:d,spectrum:()=>(c==null?void 0:c.audioSpectrum())||null,courseProgress:r,onOpen:()=>{A(!0)},onCancel:()=>{var v;(v=a.client.session)==null||v.stop()},onPause:()=>{var v,w;(w=(v=a.client.session)==null?void 0:v.pause)==null||w.call(v)},onUnpause:()=>{var v,w;(w=(v=a.client.session)==null?void 0:v.unpause)==null||w.call(v)},onMessagingChange:v=>{var w,y,E,T;v?(y=(w=a.client.session)==null?void 0:w.muteMicrophone)==null||y.call(w):(T=(E=a.client.session)==null?void 0:E.unmuteMicrophone)==null||T.call(E)},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:((U=a.client.product)==null?void 0:U.agent_name)||"Obi",onCourseSelect:v=>{const w=a.client.plans.find(y=>y.uuid===v.id)||null;w&&(a.client.selectPlan(w),A(!1),i(!0))},onClose:v=>{v==="user-initiated"&&a.client.selectPlan(null),A(!1)}}),!!a.client.selectedPlan&&g(QU,{open:!0,session:m(),sessionState:(c==null?void 0:c.state)||null,speakingState:(c==null?void 0:c.speakingState)||null,spectrum:()=>(c==null?void 0:c.audioSpectrum())||null,onClose:v=>{v==="user-initiated"&&a.client.stopSession(),i(!1)},onStart:()=>{a.client.selectedPlanUuid&&a.startSession()},onContinue:()=>{c==null||c.continue()},onShareMicrophone:()=>{c==null||c.shareMicrophone()}})]})})}function TU(t,e,A){const[n,i]=Z(0),[r,s]=Z(null);return qe(()=>{t.client&&(t.client.session&&s(t.client.session),t.client.on("sessionStarted",a=>{s(a),i(o=>o+1)}),t.client.on("sessionStopped",()=>{s(null),i(a=>a+1)}),t.client.on("sessionShutdown",()=>{i(a=>a+1)}),t.client.on("sessionResumed",()=>{i(a=>a+1)}),t.client.on("stateChanged",()=>{var a;t.client.state==="ready"&&e.style.setProperty("--obi-color-primary",((a=t.client.product)==null?void 0:a.primary_color)||"#9500FF"),i(o=>o+1)}),t.client.on("planSelected",()=>{i(a=>a+1)}))},[t,t.client]),qe(()=>{if(!r)return;r.on("stateChanged",()=>{i(o=>o+1)}),r.on("speakingStateChanged",()=>{i(o=>o+1)}),r.on("paused",()=>{i(o=>o+1)}),r.on("unpaused",()=>{i(o=>o+1)});const a=o=>{A(o)};return r.on&&r.on("courseProgress",a),()=>{r.off&&r.off("courseProgress",a)}},[r]),t}function FU(t){const[e,A]=Z(()=>lo(t));return qe(()=>{A(lo(t))},[t]),qe(()=>{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"))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.isActive=!1,this.primaryColour="#9500FF",this.commandQueue=[],this._resumed=!1,this.dispatchCommand=(i,...r)=>{var s,a;if(!this.client.isReady()){this.commandQueue.push({type:i,args:r});return}switch(i){case"update":this.updateConfig(r[0]);break;case"endSession":(a=(s=this.client)==null?void 0:s.stopSession)==null||a.call(s);break;case"say":this.say(r[0]);break;default:console.warn("[obi] unknown command",{commandType:i,args:r})}};let A=null;const n=this.load();if(n)try{A=vr.deserialise(n,e,"sdk",{apiBaseUrl:"http://localhost",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:"http://localhost",captureScreen:this.captureScreen.bind(this)})),this.client=A,this.client.on("stateChanged",i=>{var r;i==="ready"&&this.updateConfig({isActive:this.client.showWidget,primaryColour:((r=this.client.product)==null?void 0:r.primary_color)||"#9500FF"})}),this.client.on("sessionStarted",()=>{this.save()}),this.client.on("sessionStopped",()=>{localStorage.removeItem("obi-client")}),this.client.on("sessionShutdown",i=>{i==="invalid-room"&&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.initialise({planUuid:A}).then(()=>{this.emit("initialised"),this.dispatchCommandQueue()}).catch(n=>{console.error("[obi] error initialising client",n),this.emit("error",n)})}updateConfig(e){this.updateActive(e.isActive),this.updatePrimaryColour(e.primaryColour),this.updateIdentity(e.user)}updateActive(e){e===void 0||e==this.isActive||(this.isActive=e)}updatePrimaryColour(e){e===void 0||e==this.primaryColour||(this.primaryColour=e)}updateIdentity(e){e===void 0||e==this.client.identity||this.client.initialise({identity:e||void 0}).catch(A=>{console.error("[obi] error updating identity",A),this.emit("error",A)})}async say(e){var A,n;await((n=(A=this.client.session)==null?void 0:A.say)==null?void 0:n.call(A,e))}async startSession(){var e;await this.client.startSession((e=this.client.selectedPlan)==null?void 0:e.uuid,A=>{A.on("stateChanged",n=>{n!=="disconnecting"&&n!=="disconnected"&&n!=="error"&&n!=="connecting"&&this.save()})})}dispatchCommandQueue(){const e=this.commandQueue;this.commandQueue=[],e.forEach(A=>{try{this.dispatchCommand(A.type,...A.args)}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)}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}if(t||(t=(i=e==null?void 0:e.obiWidgetConfig)==null?void 0:i.apiKey),!t){console.error("[obi] no app token found");return}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/package.json
CHANGED
package/dist/src/empty.test.d.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
package/dist/src/index.d.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
package/dist/src/loader.d.ts
DELETED
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import { ObiSDK } from "./sdk";
|
|
2
|
-
/**
|
|
3
|
-
* Load the Obi SDK onto the current window. This takes care of any queued commands that may have
|
|
4
|
-
* been added to the window object by the loader script, and assigns the SDK class instance to the
|
|
5
|
-
* window object at "ObiSDK".
|
|
6
|
-
*/
|
|
7
|
-
export declare function loadObiSDK(appToken?: string): Promise<ObiSDK | undefined>;
|
|
8
|
-
export declare function loadObiSDKWithWindow({ appToken, window, }: {
|
|
9
|
-
appToken?: string;
|
|
10
|
-
window: any;
|
|
11
|
-
}): Promise<ObiSDK | undefined>;
|
package/dist/src/mount.d.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare function mountWidget(sdk?: any): void;
|
package/dist/src/sdk.d.ts
DELETED
|
@@ -1,77 +0,0 @@
|
|
|
1
|
-
import { EventEmitter } from "eventemitter3";
|
|
2
|
-
import type { Identity } from "@obi/obi-client";
|
|
3
|
-
import { ObiClient } from "@obi/obi-client";
|
|
4
|
-
import { Command, CommandType, Config } from "./types";
|
|
5
|
-
export declare const PLAN_URL_PARAM = "49206C6F7665204F6269_session";
|
|
6
|
-
export declare const STORAGE_KEY = "obi-url-params";
|
|
7
|
-
export type ObiSDKEvents = {
|
|
8
|
-
initialised: () => void;
|
|
9
|
-
error: (err: Error) => void;
|
|
10
|
-
};
|
|
11
|
-
export type InitialiseArgs = {
|
|
12
|
-
queuedCommands?: Command[];
|
|
13
|
-
};
|
|
14
|
-
export declare class ObiSDK extends EventEmitter {
|
|
15
|
-
client: ObiClient;
|
|
16
|
-
isActive: boolean;
|
|
17
|
-
primaryColour: string;
|
|
18
|
-
private commandQueue;
|
|
19
|
-
/** HACK: Need to prevent initialisation from being called if resumed. */
|
|
20
|
-
private _resumed;
|
|
21
|
-
/**
|
|
22
|
-
* Creates a client that should persist for the lifetime of the SDK.
|
|
23
|
-
* Resumes an ongoing session if one exists.
|
|
24
|
-
*/
|
|
25
|
-
constructor(appToken: string);
|
|
26
|
-
initialise(args?: InitialiseArgs): Promise<void>;
|
|
27
|
-
/**
|
|
28
|
-
* Update the SDK configuration. This is typically called before a plan starts,
|
|
29
|
-
* but it is possible to update the configuration during a plan.
|
|
30
|
-
*/
|
|
31
|
-
updateConfig(config: Config): void;
|
|
32
|
-
/**
|
|
33
|
-
* Update the SDK activity state. Activity controls whether the SDK is continuously
|
|
34
|
-
* visible or not.
|
|
35
|
-
* Ignores updates if the active state is undefined or the same as the current active state.
|
|
36
|
-
*/
|
|
37
|
-
updateActive(isActive?: boolean): void;
|
|
38
|
-
/**
|
|
39
|
-
* Update the SDK primary colour. This is typically called before a plan starts,
|
|
40
|
-
* but it is possible to update the primary colour during a plan.
|
|
41
|
-
* Ignores updates if the primary colour is undefined or the same as the current primary colour.
|
|
42
|
-
*/
|
|
43
|
-
updatePrimaryColour(primaryColour?: string): void;
|
|
44
|
-
/**
|
|
45
|
-
* Update the identity of the onboardee. This is typically called before a plan starts,
|
|
46
|
-
* but it is possible to update the identity during a plan.
|
|
47
|
-
* Ignores updates if the identity is undefined or the same as the current identity.
|
|
48
|
-
*/
|
|
49
|
-
updateIdentity(identity?: Identity | null): void;
|
|
50
|
-
/**
|
|
51
|
-
* Say a message to the onboardee.
|
|
52
|
-
*/
|
|
53
|
-
say(message: string): Promise<void>;
|
|
54
|
-
/**
|
|
55
|
-
* Start a new session.
|
|
56
|
-
*/
|
|
57
|
-
startSession(): Promise<void>;
|
|
58
|
-
/**
|
|
59
|
-
* Dispatch all queued commands in the order they were added.
|
|
60
|
-
*/
|
|
61
|
-
dispatchCommandQueue(): void;
|
|
62
|
-
/**
|
|
63
|
-
* This gets set on the window object by the loader script. It is used as an abstraction to allow
|
|
64
|
-
* users to call commands without having to wait for the client to be ready. This works in tandem
|
|
65
|
-
* with the loader script, which will queue any commands that are called before the client is ready.
|
|
66
|
-
*/
|
|
67
|
-
dispatchCommand: (commandType: CommandType, ...args: any[]) => void;
|
|
68
|
-
/**
|
|
69
|
-
* Parse passive initiation parameters from the URL and/or local storage.
|
|
70
|
-
* Passive initiation parameters are values that indicate a plan & app token to use immediately.
|
|
71
|
-
*/
|
|
72
|
-
parsePassiveParams(): string | null;
|
|
73
|
-
mountWidget(): void;
|
|
74
|
-
captureScreen(): Promise<string>;
|
|
75
|
-
save(): void;
|
|
76
|
-
load(): string | null;
|
|
77
|
-
}
|
package/dist/src/sentry.d.ts
DELETED
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
interface SentryContext {
|
|
2
|
-
sessionId?: string;
|
|
3
|
-
apiKey?: string;
|
|
4
|
-
widgetState?: string;
|
|
5
|
-
componentName?: string;
|
|
6
|
-
userId?: string;
|
|
7
|
-
userEmail?: string;
|
|
8
|
-
userMetadata?: any;
|
|
9
|
-
handlerName?: string;
|
|
10
|
-
lifecycle?: string;
|
|
11
|
-
changedProperties?: string[];
|
|
12
|
-
eventType?: string;
|
|
13
|
-
eventData?: Record<string, any>;
|
|
14
|
-
userJourney?: string[];
|
|
15
|
-
[key: string]: any;
|
|
16
|
-
}
|
|
17
|
-
export declare function captureException(error: any, context?: SentryContext): void;
|
|
18
|
-
export declare function captureMessage(message: string, level?: "info" | "warning" | "error", context?: SentryContext): void;
|
|
19
|
-
export declare function trackEvent(eventType: string, eventData?: Record<string, any>, componentName?: string): void;
|
|
20
|
-
export declare function setGlobalContext(context: Partial<SentryContext>): void;
|
|
21
|
-
/**
|
|
22
|
-
* Wraps an async function to automatically capture any exceptions
|
|
23
|
-
*/
|
|
24
|
-
export declare function withSentryAsyncHandler<T extends (...args: any[]) => Promise<any>>(fn: T, handlerName: string, componentName?: string): T;
|
|
25
|
-
/**
|
|
26
|
-
* Wraps a synchronous function to automatically capture any exceptions
|
|
27
|
-
*/
|
|
28
|
-
export declare function withSentryHandler<T extends (...args: any[]) => any>(fn: T, handlerName: string, componentName?: string): T;
|
|
29
|
-
/**
|
|
30
|
-
* Simple wrapper to add Sentry error tracking to component lifecycle methods
|
|
31
|
-
* Use this in your component's connectedCallback, disconnectedCallback, etc.
|
|
32
|
-
*/
|
|
33
|
-
export declare function withComponentErrorTracking(componentName: string): {
|
|
34
|
-
trackLifecycle: (lifecycleMethod: string, fn: () => void) => void;
|
|
35
|
-
trackRender: (renderFn: () => any) => any;
|
|
36
|
-
setContext: () => void;
|
|
37
|
-
};
|
|
38
|
-
export { captureException as default };
|
|
39
|
-
export type { SentryContext };
|
package/dist/src/types.d.ts
DELETED
|
@@ -1,12 +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
|
-
};
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Utility for matching URLs against glob patterns
|
|
3
|
-
*/
|
|
4
|
-
/**
|
|
5
|
-
* Check if a URL matches any of the provided glob patterns
|
|
6
|
-
* @param url The URL to check
|
|
7
|
-
* @param patterns Array of glob patterns to match against
|
|
8
|
-
* @returns true if the URL matches any pattern, false otherwise
|
|
9
|
-
*/
|
|
10
|
-
export declare function matchesUrlPattern(url: string, patterns: string[]): boolean;
|
|
11
|
-
/**
|
|
12
|
-
* Check if the current page URL is blacklisted
|
|
13
|
-
* @param blacklist Array of URL glob patterns
|
|
14
|
-
* @returns true if current URL is blacklisted, false otherwise
|
|
15
|
-
*/
|
|
16
|
-
export declare function isCurrentUrlBlacklisted(blacklist?: string[]): boolean;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|