obi-sdk 0.3.11 → 0.3.13

package/dist/obi-sdk.es.js

@@ -1,5 +1,530 @@
 import { css, LitElement, html, svg, nothing } from "lit";
 const API_BASE_URL = {}.VITE_API_BASE_URL;
+const PATH_PARAM_RE = /\{[^{}]+\}/g;
+function randomID() {
+  return Math.random().toString(36).slice(2, 11);
+}
+function createClient(clientOptions) {
+  let {
+    baseUrl = "",
+    Request: CustomRequest = globalThis.Request,
+    fetch: baseFetch = globalThis.fetch,
+    querySerializer: globalQuerySerializer,
+    bodySerializer: globalBodySerializer,
+    headers: baseHeaders,
+    ...baseOptions
+  } = { ...clientOptions };
+  baseUrl = removeTrailingSlash(baseUrl);
+  const middlewares = [];
+  async function coreFetch(schemaPath, fetchOptions) {
+    const {
+      baseUrl: localBaseUrl,
+      fetch: fetch2 = baseFetch,
+      Request = CustomRequest,
+      headers,
+      params = {},
+      parseAs = "json",
+      querySerializer: requestQuerySerializer,
+      bodySerializer = globalBodySerializer ?? defaultBodySerializer,
+      body,
+      ...init
+    } = fetchOptions || {};
+    if (localBaseUrl) {
+      baseUrl = removeTrailingSlash(localBaseUrl);
+    }
+    let querySerializer = typeof globalQuerySerializer === "function" ? globalQuerySerializer : createQuerySerializer(globalQuerySerializer);
+    if (requestQuerySerializer) {
+      querySerializer = typeof requestQuerySerializer === "function" ? requestQuerySerializer : createQuerySerializer({
+        ...typeof globalQuerySerializer === "object" ? globalQuerySerializer : {},
+        ...requestQuerySerializer
+      });
+    }
+    const serializedBody = body === void 0 ? void 0 : bodySerializer(body);
+    const defaultHeaders = (
+      // with no body, we should not to set Content-Type
+      serializedBody === void 0 || // if serialized body is FormData; browser will correctly set Content-Type & boundary expression
+      serializedBody instanceof FormData ? {} : {
+        "Content-Type": "application/json"
+      }
+    );
+    const requestInit = {
+      redirect: "follow",
+      ...baseOptions,
+      ...init,
+      body: serializedBody,
+      headers: mergeHeaders(defaultHeaders, baseHeaders, headers, params.header)
+    };
+    let id;
+    let options;
+    let request = new CustomRequest(createFinalURL(schemaPath, { baseUrl, params, querySerializer }), requestInit);
+    for (const key in init) {
+      if (!(key in request)) {
+        request[key] = init[key];
+      }
+    }
+    if (middlewares.length) {
+      id = randomID();
+      options = Object.freeze({
+        baseUrl,
+        fetch: fetch2,
+        parseAs,
+        querySerializer,
+        bodySerializer
+      });
+      for (const m2 of middlewares) {
+        if (m2 && typeof m2 === "object" && typeof m2.onRequest === "function") {
+          const result = await m2.onRequest({
+            request,
+            schemaPath,
+            params,
+            options,
+            id
+          });
+          if (result) {
+            if (!(result instanceof CustomRequest)) {
+              throw new Error("onRequest: must return new Request() when modifying the request");
+            }
+            request = result;
+          }
+        }
+      }
+    }
+    let response = await fetch2(request);
+    if (middlewares.length) {
+      for (let i2 = middlewares.length - 1; i2 >= 0; i2--) {
+        const m2 = middlewares[i2];
+        if (m2 && typeof m2 === "object" && typeof m2.onResponse === "function") {
+          const result = await m2.onResponse({
+            request,
+            response,
+            schemaPath,
+            params,
+            options,
+            id
+          });
+          if (result) {
+            if (!(result instanceof Response)) {
+              throw new Error("onResponse: must return new Response() when modifying the response");
+            }
+            response = result;
+          }
+        }
+      }
+    }
+    if (response.status === 204 || response.headers.get("Content-Length") === "0") {
+      return response.ok ? { data: {}, response } : { error: {}, response };
+    }
+    if (response.ok) {
+      if (parseAs === "stream") {
+        return { data: response.body, response };
+      }
+      return { data: await response[parseAs](), response };
+    }
+    let error = await response.text();
+    try {
+      error = JSON.parse(error);
+    } catch {
+    }
+    return { error, response };
+  }
+  return {
+    /** Call a GET endpoint */
+    GET(url, init) {
+      return coreFetch(url, { ...init, method: "GET" });
+    },
+    /** Call a PUT endpoint */
+    PUT(url, init) {
+      return coreFetch(url, { ...init, method: "PUT" });
+    },
+    /** Call a POST endpoint */
+    POST(url, init) {
+      return coreFetch(url, { ...init, method: "POST" });
+    },
+    /** Call a DELETE endpoint */
+    DELETE(url, init) {
+      return coreFetch(url, { ...init, method: "DELETE" });
+    },
+    /** Call a OPTIONS endpoint */
+    OPTIONS(url, init) {
+      return coreFetch(url, { ...init, method: "OPTIONS" });
+    },
+    /** Call a HEAD endpoint */
+    HEAD(url, init) {
+      return coreFetch(url, { ...init, method: "HEAD" });
+    },
+    /** Call a PATCH endpoint */
+    PATCH(url, init) {
+      return coreFetch(url, { ...init, method: "PATCH" });
+    },
+    /** Call a TRACE endpoint */
+    TRACE(url, init) {
+      return coreFetch(url, { ...init, method: "TRACE" });
+    },
+    /** Register middleware */
+    use(...middleware) {
+      for (const m2 of middleware) {
+        if (!m2) {
+          continue;
+        }
+        if (typeof m2 !== "object" || !("onRequest" in m2 || "onResponse" in m2)) {
+          throw new Error("Middleware must be an object with one of `onRequest()` or `onResponse()`");
+        }
+        middlewares.push(m2);
+      }
+    },
+    /** Unregister middleware */
+    eject(...middleware) {
+      for (const m2 of middleware) {
+        const i2 = middlewares.indexOf(m2);
+        if (i2 !== -1) {
+          middlewares.splice(i2, 1);
+        }
+      }
+    }
+  };
+}
+function serializePrimitiveParam(name, value, options) {
+  if (value === void 0 || value === null) {
+    return "";
+  }
+  if (typeof value === "object") {
+    throw new Error(
+      "Deeply-nested arrays/objects aren’t supported. Provide your own `querySerializer()` to handle these."
+    );
+  }
+  return `${name}=${options?.allowReserved === true ? value : encodeURIComponent(value)}`;
+}
+function serializeObjectParam(name, value, options) {
+  if (!value || typeof value !== "object") {
+    return "";
+  }
+  const values = [];
+  const joiner = {
+    simple: ",",
+    label: ".",
+    matrix: ";"
+  }[options.style] || "&";
+  if (options.style !== "deepObject" && options.explode === false) {
+    for (const k2 in value) {
+      values.push(k2, options.allowReserved === true ? value[k2] : encodeURIComponent(value[k2]));
+    }
+    const final2 = values.join(",");
+    switch (options.style) {
+      case "form": {
+        return `${name}=${final2}`;
+      }
+      case "label": {
+        return `.${final2}`;
+      }
+      case "matrix": {
+        return `;${name}=${final2}`;
+      }
+      default: {
+        return final2;
+      }
+    }
+  }
+  for (const k2 in value) {
+    const finalName = options.style === "deepObject" ? `${name}[${k2}]` : k2;
+    values.push(serializePrimitiveParam(finalName, value[k2], options));
+  }
+  const final = values.join(joiner);
+  return options.style === "label" || options.style === "matrix" ? `${joiner}${final}` : final;
+}
+function serializeArrayParam(name, value, options) {
+  if (!Array.isArray(value)) {
+    return "";
+  }
+  if (options.explode === false) {
+    const joiner2 = { form: ",", spaceDelimited: "%20", pipeDelimited: "|" }[options.style] || ",";
+    const final = (options.allowReserved === true ? value : value.map((v2) => encodeURIComponent(v2))).join(joiner2);
+    switch (options.style) {
+      case "simple": {
+        return final;
+      }
+      case "label": {
+        return `.${final}`;
+      }
+      case "matrix": {
+        return `;${name}=${final}`;
+      }
+      default: {
+        return `${name}=${final}`;
+      }
+    }
+  }
+  const joiner = { simple: ",", label: ".", matrix: ";" }[options.style] || "&";
+  const values = [];
+  for (const v2 of value) {
+    if (options.style === "simple" || options.style === "label") {
+      values.push(options.allowReserved === true ? v2 : encodeURIComponent(v2));
+    } else {
+      values.push(serializePrimitiveParam(name, v2, options));
+    }
+  }
+  return options.style === "label" || options.style === "matrix" ? `${joiner}${values.join(joiner)}` : values.join(joiner);
+}
+function createQuerySerializer(options) {
+  return function querySerializer(queryParams) {
+    const search = [];
+    if (queryParams && typeof queryParams === "object") {
+      for (const name in queryParams) {
+        const value = queryParams[name];
+        if (value === void 0 || value === null) {
+          continue;
+        }
+        if (Array.isArray(value)) {
+          if (value.length === 0) {
+            continue;
+          }
+          search.push(
+            serializeArrayParam(name, value, {
+              style: "form",
+              explode: true,
+              ...options?.array,
+              allowReserved: options?.allowReserved || false
+            })
+          );
+          continue;
+        }
+        if (typeof value === "object") {
+          search.push(
+            serializeObjectParam(name, value, {
+              style: "deepObject",
+              explode: true,
+              ...options?.object,
+              allowReserved: options?.allowReserved || false
+            })
+          );
+          continue;
+        }
+        search.push(serializePrimitiveParam(name, value, options));
+      }
+    }
+    return search.join("&");
+  };
+}
+function defaultPathSerializer(pathname, pathParams) {
+  let nextURL = pathname;
+  for (const match of pathname.match(PATH_PARAM_RE) ?? []) {
+    let name = match.substring(1, match.length - 1);
+    let explode = false;
+    let style = "simple";
+    if (name.endsWith("*")) {
+      explode = true;
+      name = name.substring(0, name.length - 1);
+    }
+    if (name.startsWith(".")) {
+      style = "label";
+      name = name.substring(1);
+    } else if (name.startsWith(";")) {
+      style = "matrix";
+      name = name.substring(1);
+    }
+    if (!pathParams || pathParams[name] === void 0 || pathParams[name] === null) {
+      continue;
+    }
+    const value = pathParams[name];
+    if (Array.isArray(value)) {
+      nextURL = nextURL.replace(match, serializeArrayParam(name, value, { style, explode }));
+      continue;
+    }
+    if (typeof value === "object") {
+      nextURL = nextURL.replace(match, serializeObjectParam(name, value, { style, explode }));
+      continue;
+    }
+    if (style === "matrix") {
+      nextURL = nextURL.replace(match, `;${serializePrimitiveParam(name, value)}`);
+      continue;
+    }
+    nextURL = nextURL.replace(match, style === "label" ? `.${encodeURIComponent(value)}` : encodeURIComponent(value));
+  }
+  return nextURL;
+}
+function defaultBodySerializer(body) {
+  if (body instanceof FormData) {
+    return body;
+  }
+  return JSON.stringify(body);
+}
+function createFinalURL(pathname, options) {
+  let finalURL = `${options.baseUrl}${pathname}`;
+  if (options.params?.path) {
+    finalURL = defaultPathSerializer(finalURL, options.params.path);
+  }
+  let search = options.querySerializer(options.params.query ?? {});
+  if (search.startsWith("?")) {
+    search = search.substring(1);
+  }
+  if (search) {
+    finalURL += `?${search}`;
+  }
+  return finalURL;
+}
+function mergeHeaders(...allHeaders) {
+  const finalHeaders = new Headers();
+  for (const h2 of allHeaders) {
+    if (!h2 || typeof h2 !== "object") {
+      continue;
+    }
+    const iterator = h2 instanceof Headers ? h2.entries() : Object.entries(h2);
+    for (const [k2, v2] of iterator) {
+      if (v2 === null) {
+        finalHeaders.delete(k2);
+      } else if (Array.isArray(v2)) {
+        for (const v22 of v2) {
+          finalHeaders.append(k2, v22);
+        }
+      } else if (v2 !== void 0) {
+        finalHeaders.set(k2, v2);
+      }
+    }
+  }
+  return finalHeaders;
+}
+function removeTrailingSlash(url) {
+  if (url.endsWith("/")) {
+    return url.substring(0, url.length - 1);
+  }
+  return url;
+}
+class ObiClient {
+  constructor(config) {
+    this.client = createClient({
+      baseUrl: config.baseUrl,
+      headers: config.headers,
+      fetch: config.fetch
+    });
+  }
+  /**
+   * Set authorization header for authenticated requests
+   */
+  setAuthToken(token) {
+    this.client.use({
+      onRequest({ request }) {
+        request.headers.set("Authorization", `Bearer ${token}`);
+        return request;
+      }
+    });
+  }
+  /**
+   * Set API token for tool calls and notifications
+   */
+  setApiToken(token) {
+    this.client.use({
+      onRequest({ request }) {
+        request.headers.set("Authorization", `Token ${token}`);
+        return request;
+      }
+    });
+  }
+  // Auth endpoints
+  async getAuthUrl(type) {
+    return await this.client.GET("/auth/{type}", {
+      params: { path: { type } }
+    });
+  }
+  async getConnectUrl(type) {
+    return await this.client.GET("/connect/{type}", {
+      params: { path: { type } }
+    });
+  }
+  async logout() {
+    return await this.client.POST("/logout");
+  }
+  async getCurrentUser() {
+    return await this.client.GET("/me");
+  }
+  // Files
+  async createPresignedUploadUrl(data) {
+    return await this.client.POST("/files", {
+      body: data
+    });
+  }
+  // Knowledge blocks
+  async createKnowledgeBlock(data) {
+    return await this.client.POST("/knowledge", {
+      body: data
+    });
+  }
+  // Onboardees
+  async listOnboardees() {
+    return await this.client.GET("/onboardees");
+  }
+  async getOnboardeeWhitelistedDomains(id) {
+    return await this.client.GET("/onboardees/{id}/whitelisted-domains", {
+      params: { path: { id } }
+    });
+  }
+  // Plans
+  async listPlans() {
+    return await this.client.GET("/plans");
+  }
+  async createPlan(data) {
+    return await this.client.POST("/plans", {
+      body: data
+    });
+  }
+  async getPlan(id) {
+    return await this.client.GET("/plans/{id}", {
+      params: { path: { id } }
+    });
+  }
+  async replacePlan(id, data) {
+    return await this.client.PUT("/plans/{id}", {
+      params: { path: { id } },
+      body: data
+    });
+  }
+  async updatePlan(id, data) {
+    return await this.client.PATCH("/plans/{id}", {
+      params: { path: { id } },
+      body: data
+    });
+  }
+  // Sessions
+  async listSessions(token) {
+    return await this.client.GET("/sessions", {
+      params: { query: token ? { token } : {} }
+    });
+  }
+  async createSession(data) {
+    return await this.client.POST("/sessions", {
+      body: data
+    });
+  }
+  async getSession(id) {
+    return await this.client.GET("/sessions/{id}", {
+      params: { path: { id } }
+    });
+  }
+  async getSessionRecording(id) {
+    return await this.client.GET("/sessions/{id}/recording", {
+      params: { path: { id } }
+    });
+  }
+  async getSessionProductUrl(id) {
+    return await this.client.GET("/sessions/{id}/product-url", {
+      params: { path: { id } }
+    });
+  }
+  async getJoinToken(token, { skipIntro } = {}) {
+    return await this.client.GET("/join-token", {
+      params: {
+        query: {
+          token,
+          ...skipIntro && { skip_intro: "true" }
+        }
+      }
+    });
+  }
+  /**
+   * Get the underlying openapi-fetch client for advanced usage
+   */
+  getClient() {
+    return this.client;
+  }
+}
 function getDefaultExportFromCjs$1(x2) {
   return x2 && x2.__esModule && Object.prototype.hasOwnProperty.call(x2, "default") ? x2["default"] : x2;
 }
@@ -22768,6 +23293,8 @@ class ObiSession {
     }
   }
 }
+const SESSION_URL_PARAM = "49206C6F7665204F6269_session";
+const API_KEY_URL_PARAM = "49206C6F7665204F6269_client";
 var extendStatics = function(d2, b2) {
   extendStatics = Object.setPrototypeOf || { __proto__: [] } instanceof Array && function(d3, b3) {
     d3.__proto__ = b3;
@@ -31658,15 +32185,15 @@ const STORAGE_KEYS = {
   SESSION_DATA: "session_data"
 };
 const storage = new StorageManager("io.obi.widget");
-var __defProp$6 = Object.defineProperty;
-var __getOwnPropDesc$6 = Object.getOwnPropertyDescriptor;
-var __decorateClass$6 = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$6(target, key) : target;
+var __defProp$7 = Object.defineProperty;
+var __getOwnPropDesc$7 = Object.getOwnPropertyDescriptor;
+var __decorateClass$7 = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$7(target, key) : target;
   for (var i2 = decorators.length - 1, decorator; i2 >= 0; i2--)
     if (decorator = decorators[i2])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$6(target, key, result);
+    __defProp$7(target, key, result);
   return result;
 };
 class NavIcon extends LitElement {
@@ -31759,16 +32286,16 @@ NavIcon.styles = css`
       height: 18px;
     }
   `;
-__decorateClass$6([
+__decorateClass$7([
   n$3({ type: String })
 ], NavIcon.prototype, "id", 2);
-__decorateClass$6([
+__decorateClass$7([
   n$3({ type: Boolean })
 ], NavIcon.prototype, "isActive", 2);
-__decorateClass$6([
+__decorateClass$7([
   n$3({ type: Boolean })
 ], NavIcon.prototype, "isSpecial", 2);
-__decorateClass$6([
+__decorateClass$7([
   n$3({ type: Function })
 ], NavIcon.prototype, "onClick", 2);
 if (!customElements.get("obi-nav-icon")) {
@@ -31817,15 +32344,15 @@ const obiIcon = html`
     alt="Obi Icon"
   />
 `;
-var __defProp$5 = Object.defineProperty;
-var __getOwnPropDesc$5 = Object.getOwnPropertyDescriptor;
-var __decorateClass$5 = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$5(target, key) : target;
+var __defProp$6 = Object.defineProperty;
+var __getOwnPropDesc$6 = Object.getOwnPropertyDescriptor;
+var __decorateClass$6 = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$6(target, key) : target;
   for (var i2 = decorators.length - 1, decorator; i2 >= 0; i2--)
     if (decorator = decorators[i2])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$5(target, key, result);
+    __defProp$6(target, key, result);
   return result;
 };
 class NavigationBar extends LitElement {
@@ -31899,36 +32426,36 @@ NavigationBar.styles = css`
       flex-direction: column;
     }
   `;
-__decorateClass$5([
+__decorateClass$6([
   n$3({ type: Boolean })
 ], NavigationBar.prototype, "isActive", 2);
-__decorateClass$5([
+__decorateClass$6([
   n$3({ type: Boolean })
 ], NavigationBar.prototype, "isScreenActive", 2);
-__decorateClass$5([
+__decorateClass$6([
   n$3({ type: Object })
 ], NavigationBar.prototype, "position", 2);
-__decorateClass$5([
+__decorateClass$6([
   n$3({ type: String })
 ], NavigationBar.prototype, "currentState", 2);
-__decorateClass$5([
+__decorateClass$6([
   n$3({ type: String })
 ], NavigationBar.prototype, "direction", 2);
-__decorateClass$5([
+__decorateClass$6([
   n$3({ type: Function })
 ], NavigationBar.prototype, "onItemSelect", 2);
 if (!customElements.get("obi-navigation-bar")) {
   customElements.define("obi-navigation-bar", NavigationBar);
 }
-var __defProp$4 = Object.defineProperty;
-var __getOwnPropDesc$4 = Object.getOwnPropertyDescriptor;
-var __decorateClass$4 = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$4(target, key) : target;
+var __defProp$5 = Object.defineProperty;
+var __getOwnPropDesc$5 = Object.getOwnPropertyDescriptor;
+var __decorateClass$5 = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$5(target, key) : target;
   for (var i2 = decorators.length - 1, decorator; i2 >= 0; i2--)
     if (decorator = decorators[i2])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$4(target, key, result);
+    __defProp$5(target, key, result);
   return result;
 };
 class Course extends LitElement {
@@ -31940,12 +32467,9 @@ class Course extends LitElement {
     this.imageSrc = "";
   }
   handleClick() {
-    if (this.onSelect) {
-      this.onSelect(this.id);
-    }
     this.dispatchEvent(
       new CustomEvent("course-select", {
-        detail: { id: this.id },
+        detail: { id: this.id, name: this.name, description: this.description },
         bubbles: true,
         composed: true
       })
@@ -32007,21 +32531,18 @@ Course.styles = css`
       margin: 0;
     }
   `;
-__decorateClass$4([
+__decorateClass$5([
   n$3({ type: String })
 ], Course.prototype, "id", 2);
-__decorateClass$4([
+__decorateClass$5([
   n$3({ type: String })
 ], Course.prototype, "name", 2);
-__decorateClass$4([
+__decorateClass$5([
   n$3({ type: String })
 ], Course.prototype, "description", 2);
-__decorateClass$4([
+__decorateClass$5([
   n$3({ type: String })
 ], Course.prototype, "imageSrc", 2);
-__decorateClass$4([
-  n$3({ type: Function })
-], Course.prototype, "onSelect", 2);
 class CourseList extends LitElement {
   constructor() {
     super(...arguments);
@@ -32029,11 +32550,6 @@ class CourseList extends LitElement {
     this.loading = false;
     this.error = "";
   }
-  handleCourseSelect(e2) {
-    if (this.onCourseSelect) {
-      this.onCourseSelect(e2.detail.id);
-    }
-  }
   render() {
     if (this.loading) {
       return html`<div class="loading">Loading...</div>`;
@@ -32054,7 +32570,6 @@ class CourseList extends LitElement {
               name=${course.name}
               description=${course.description || ""}
               imageSrc=${course.imageSrc}
-              @course-select=${this.handleCourseSelect}
             ></obi-course>
           `
     )}
@@ -32098,33 +32613,30 @@ CourseList.styles = css`
       color: #ef4444;
     }
   `;
-__decorateClass$4([
+__decorateClass$5([
   n$3({ type: Array })
 ], CourseList.prototype, "courses", 2);
-__decorateClass$4([
+__decorateClass$5([
   n$3({ type: Boolean })
 ], CourseList.prototype, "loading", 2);
-__decorateClass$4([
+__decorateClass$5([
   n$3({ type: String })
 ], CourseList.prototype, "error", 2);
-__decorateClass$4([
-  n$3({ type: Function })
-], CourseList.prototype, "onCourseSelect", 2);
 if (!customElements.get("obi-course")) {
   customElements.define("obi-course", Course);
 }
 if (!customElements.get("obi-course-list")) {
   customElements.define("obi-course-list", CourseList);
 }
-var __defProp$3 = Object.defineProperty;
-var __getOwnPropDesc$3 = Object.getOwnPropertyDescriptor;
-var __decorateClass$3 = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$3(target, key) : target;
+var __defProp$4 = Object.defineProperty;
+var __getOwnPropDesc$4 = Object.getOwnPropertyDescriptor;
+var __decorateClass$4 = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$4(target, key) : target;
   for (var i2 = decorators.length - 1, decorator; i2 >= 0; i2--)
     if (decorator = decorators[i2])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$3(target, key, result);
+    __defProp$4(target, key, result);
   return result;
 };
 class CourseModal extends LitElement {
@@ -32136,11 +32648,6 @@ class CourseModal extends LitElement {
     this.apiKey = "";
     this.apiBaseUrl = "";
   }
-  handleCourseSelect(e2) {
-    if (this.onCourseSelect) {
-      this.onCourseSelect(e2.detail.id);
-    }
-  }
   handleClose() {
     if (this.onClose) {
       this.onClose();
@@ -32195,7 +32702,6 @@ class CourseModal extends LitElement {
           .courses=${this.courses}
           .loading=${this.loading}
           .error=${this.error}
-          @course-select=${this.handleCourseSelect}
         ></obi-course-list>
       </div>
     `;
@@ -32285,25 +32791,22 @@ CourseModal.styles = css`
       color: #6b7280;
     }
   `;
-__decorateClass$3([
+__decorateClass$4([
   n$3({ type: Array })
 ], CourseModal.prototype, "courses", 2);
-__decorateClass$3([
+__decorateClass$4([
   n$3({ type: Boolean })
 ], CourseModal.prototype, "loading", 2);
-__decorateClass$3([
+__decorateClass$4([
   n$3({ type: String })
 ], CourseModal.prototype, "error", 2);
-__decorateClass$3([
+__decorateClass$4([
   n$3({ type: String })
 ], CourseModal.prototype, "apiKey", 2);
-__decorateClass$3([
-  n$3({ type: Function })
-], CourseModal.prototype, "onCourseSelect", 2);
-__decorateClass$3([
+__decorateClass$4([
   n$3({ type: Function })
 ], CourseModal.prototype, "onClose", 2);
-__decorateClass$3([
+__decorateClass$4([
   r$2()
 ], CourseModal.prototype, "apiBaseUrl", 2);
 if (!customElements.get("obi-course-modal")) {
@@ -32652,15 +33155,15 @@ const o = /* @__PURE__ */ new WeakMap(), n2 = e$1(class extends f {
     this.rt(this.ct);
   }
 });
-var __defProp$2 = Object.defineProperty;
-var __getOwnPropDesc$2 = Object.getOwnPropertyDescriptor;
-var __decorateClass$2 = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$2(target, key) : target;
+var __defProp$3 = Object.defineProperty;
+var __getOwnPropDesc$3 = Object.getOwnPropertyDescriptor;
+var __decorateClass$3 = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$3(target, key) : target;
   for (var i2 = decorators.length - 1, decorator; i2 >= 0; i2--)
     if (decorator = decorators[i2])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$2(target, key, result);
+    __defProp$3(target, key, result);
   return result;
 };
 class AudioEqualizer extends LitElement {
@@ -32670,9 +33173,11 @@ class AudioEqualizer extends LitElement {
     this.canvasRef = e();
     this.barCount = 8;
     this.animationFrame = null;
+    this.primaryColor = "#9500ff";
   }
   connectedCallback() {
     super.connectedCallback();
+    this.primaryColor = getComputedStyle(this).getPropertyValue("--obi-primary").trim() || "#9500ff";
     this.startAnimation();
   }
   disconnectedCallback() {
@@ -32764,7 +33269,7 @@ class AudioEqualizer extends LitElement {
       const spectrumValue = processedSpectrum.length > 0 ? processedSpectrum[i2] !== void 0 ? processedSpectrum[i2] : currentVolume : currentVolume;
       if (this.volume.speaker === "USER") {
         const opacity2 = Math.floor((spectrumValue * 0.5 + 0.5) * 255).toString(16).padStart(2, "0");
-        ctx.fillStyle = `var(--obi-primary)${opacity2}`;
+        ctx.fillStyle = `${this.primaryColor}${opacity2}`;
       } else {
         const opacity2 = Math.floor((spectrumValue * 0.5 + 0.5) * 255).toString(16).padStart(2, "0");
         ctx.fillStyle = `#FFFFFF${opacity2}`;
@@ -32829,24 +33334,24 @@ AudioEqualizer.styles = css`
       height: 100%;
     }
   `;
-__decorateClass$2([
+__decorateClass$3([
   n$3({ type: Object })
 ], AudioEqualizer.prototype, "volume", 2);
-__decorateClass$2([
+__decorateClass$3([
   r$2()
 ], AudioEqualizer.prototype, "canvasRef", 2);
 if (!customElements.get("obi-audio-equalizer")) {
   customElements.define("obi-audio-equalizer", AudioEqualizer);
 }
-var __defProp$1 = Object.defineProperty;
-var __getOwnPropDesc$1 = Object.getOwnPropertyDescriptor;
-var __decorateClass$1 = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$1(target, key) : target;
+var __defProp$2 = Object.defineProperty;
+var __getOwnPropDesc$2 = Object.getOwnPropertyDescriptor;
+var __decorateClass$2 = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$2(target, key) : target;
   for (var i2 = decorators.length - 1, decorator; i2 >= 0; i2--)
     if (decorator = decorators[i2])
       result = (kind ? decorator(target, key, result) : decorator(result)) || result;
   if (kind && result)
-    __defProp$1(target, key, result);
+    __defProp$2(target, key, result);
   return result;
 };
 class DotLoader extends LitElement {
@@ -32947,7 +33452,7 @@ DotLoader.styles = css`
       opacity: 1;
     }
   `;
-__decorateClass$1([
+__decorateClass$2([
   r$2()
 ], DotLoader.prototype, "activeDots", 2);
 if (!customElements.get("obi-dot-loader")) {
@@ -32980,6 +33485,205 @@ SearchingLoader.styles = css`
 if (!customElements.get("obi-searching-loader")) {
   customElements.define("obi-searching-loader", SearchingLoader);
 }
+var __defProp$1 = Object.defineProperty;
+var __getOwnPropDesc$1 = Object.getOwnPropertyDescriptor;
+var __decorateClass$1 = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$1(target, key) : target;
+  for (var i2 = decorators.length - 1, decorator; i2 >= 0; i2--)
+    if (decorator = decorators[i2])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result)
+    __defProp$1(target, key, result);
+  return result;
+};
+class SessionStartModal extends LitElement {
+  handleStart() {
+    if (this.onStart && this.session) {
+      this.onStart(this.session.id);
+    }
+  }
+  handleClose() {
+    if (this.onClose) {
+      this.onClose();
+    }
+  }
+  handleBackdropClick(e2) {
+    if (e2.target === e2.currentTarget) {
+      this.handleClose();
+    }
+  }
+  render() {
+    return html`
+      <div class="backdrop" @click=${this.handleBackdropClick}></div>
+      <div class="container">
+        <button class="close-button" @click=${this.handleClose}>×</button>
+
+        <div class="header">
+          <div class="logo">${obiIcon}</div>
+          <h1>${this.session.name}</h1>
+          <p class="subtitle">${this.session.description}</p>
+        </div>
+
+        <button class="button button-primary" @click=${this.handleStart}>Continue →</button>
+      </div>
+    `;
+  }
+}
+SessionStartModal.styles = css`
+    :host {
+      display: block;
+      font-family: "Inter", sans-serif;
+    }
+
+    .backdrop {
+      position: fixed;
+      top: 0;
+      right: 0;
+      bottom: 0;
+      left: 0;
+      background-color: rgba(0, 0, 0, 0.5);
+      z-index: 40;
+    }
+
+    .container {
+      position: fixed;
+      top: 50%;
+      left: 50%;
+      transform: translate(-50%, -50%);
+      z-index: 50;
+
+      /* Layout from user specifications */
+      display: flex;
+      width: 640px;
+      height: 380px;
+      padding: 48px 48px 32px 48px;
+      flex-direction: column;
+      justify-content: space-between;
+      align-items: center;
+      flex-shrink: 0;
+
+      /* Style from user specifications */
+      border-radius: 12px;
+      background: #fafafa;
+      box-shadow:
+        0px 10px 15px -3px rgba(0, 0, 0, 0.1),
+        0px 4px 6px -2px rgba(0, 0, 0, 0.05);
+    }
+
+    .header {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      text-align: center;
+      gap: 16px;
+    }
+
+    .logo {
+      display: flex;
+      width: 96px;
+      height: 96px;
+      padding: 8px;
+      justify-content: center;
+      align-items: center;
+      gap: 8px;
+      aspect-ratio: 1/1;
+      border-radius: var(--border-radius-lg, 8px);
+      background: var(--tailwind-colors-violet-600, #7c3aed);
+      box-shadow:
+        0px 0px 8px 0px rgba(168, 85, 247, 0.12),
+        0px 0px 8px 0px rgba(192, 132, 252, 0.24),
+        0px 0px 4px 0px rgba(192, 132, 252, 0.24),
+        0px 0px 4px 0px rgba(192, 132, 252, 0.24),
+        0px 0px 2px 0px rgba(192, 132, 252, 0.12),
+        0px 0px 1px 0px rgba(168, 85, 247, 0.24);
+    }
+
+    .logo img {
+      width: 48px;
+      height: 48px;
+      color: white;
+      fill: #fff;
+    }
+
+    h1 {
+      font-family: "Syne", sans-serif;
+      font-size: 32px;
+      font-weight: 700;
+      margin: 32px 0 0 0;
+      color: #111827;
+    }
+
+    .subtitle {
+      font-size: 16px;
+      color: #6b7280;
+      margin: 16px 0 0 0;
+      line-height: 1.5;
+    }
+
+    .button {
+      padding: 12px 24px;
+      border-radius: 8px;
+      border: none;
+      font-size: 16px;
+      font-weight: 500;
+      cursor: pointer;
+      transition: all 0.2s ease;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      gap: 8px;
+    }
+
+    .button-primary {
+      display: flex;
+      width: 100%;
+      height: var(--height-h-11, 44px);
+      padding: var(--spacing-2, 8px) var(--spacing-4, 16px);
+      justify-content: center;
+      align-items: center;
+      gap: var(--spacing-2, 8px);
+      flex-shrink: 0;
+      align-self: stretch;
+      border-radius: var(--border-radius-default, 6px);
+      background: var(--base-primary, #18181b);
+      color: white;
+    }
+
+    .button-primary:hover {
+      background: color-mix(in srgb, var(--base-primary, #18181b) 90%, white);
+    }
+
+    .close-button {
+      position: absolute;
+      top: 16px;
+      right: 16px;
+      background: none;
+      border: none;
+      cursor: pointer;
+      font-size: 24px;
+      color: #6b7280;
+      padding: 4px;
+      border-radius: 4px;
+      transition: all 0.2s ease;
+    }
+
+    .close-button:hover {
+      color: #374151;
+      background: #f3f4f6;
+    }
+  `;
+__decorateClass$1([
+  n$3({ type: Object })
+], SessionStartModal.prototype, "session", 2);
+__decorateClass$1([
+  n$3({ type: Function })
+], SessionStartModal.prototype, "onStart", 2);
+__decorateClass$1([
+  n$3({ type: Function })
+], SessionStartModal.prototype, "onClose", 2);
+if (!customElements.get("obi-session-start-modal")) {
+  customElements.define("obi-session-start-modal", SessionStartModal);
+}
 var __defProp = Object.defineProperty;
 var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
 var __decorateClass = (decorators, target, key, kind) => {
@@ -32991,7 +33695,6 @@ var __decorateClass = (decorators, target, key, kind) => {
     __defProp(target, key, result);
   return result;
 };
-const SESSION_URL_PARAM = "49206C6F7665204F6269_session";
 class ObiWidget extends LitElement {
   constructor() {
     super();
@@ -33002,6 +33705,8 @@ class ObiWidget extends LitElement {
     this.state = SDKState.READY;
     this.storedActiveState = void 0;
     this.showCourseModal = false;
+    this.showSessionStartModal = false;
+    this.selectedCourse = null;
     this.isHovering = false;
     this.navVisible = false;
     this.activeSession = null;
@@ -33014,7 +33719,41 @@ class ObiWidget extends LitElement {
     this.roomToken = null;
     this.roomUrl = null;
     this.boundSaveSessionData = null;
+    this.obiClient = null;
     this.closeNavTimeoutRef = null;
+    this.handleCourseSelectEvent = (event) => {
+      const customEvent = event;
+      this.selectedCourse = customEvent.detail;
+      this.showCourseModal = false;
+      this.showSessionStartModal = true;
+    };
+    this.handleUrlSessionEvent = async (sessionToken) => {
+      try {
+        if (!this.obiClient) {
+          console.error("ObiClient not initialized");
+          return;
+        }
+        const sessionsResponse = await this.obiClient.listSessions(this.apiKey);
+        if (sessionsResponse.data) {
+          const sessions = sessionsResponse.data.sessions;
+          const matchingSession = sessions?.find((session) => session.uuid === sessionToken);
+          if (matchingSession) {
+            const sessionWithPlan = matchingSession;
+            this.selectedCourse = {
+              id: sessionToken,
+              name: sessionWithPlan.onboarding_plan?.product?.name || "Session from URL",
+              description: sessionWithPlan.onboarding_plan?.product?.description || "Continue your session"
+            };
+            this.showSessionStartModal = true;
+          }
+        }
+      } catch (error) {
+        console.error("Failed to fetch session details:", error);
+      }
+    };
+    this.obiClient = new ObiClient({
+      baseUrl: API_BASE_URL
+    });
     const handleUnload = () => {
       if (this.activeSession && this.sessionToken && this.roomToken && this.roomUrl) {
         this.saveSessionData();
@@ -33039,13 +33778,13 @@ class ObiWidget extends LitElement {
   removeSessionFromUrl() {
     const url = new URL(window.location.href);
     url.searchParams.delete(SESSION_URL_PARAM);
+    url.searchParams.delete(API_KEY_URL_PARAM);
     window.history.replaceState({}, "", url.toString());
   }
-  async connectObi(sessionToken) {
-    if (this.activeSession) {
-      console.log("Connection already exists");
-      return;
-    }
+  /**
+   * Create a new ObiSession instance with common configuration
+   */
+  createSession(sessionToken) {
     try {
       const session = new ObiSession({
         sessionId: sessionToken,
@@ -33053,20 +33792,58 @@ class ObiWidget extends LitElement {
       });
       if (!session) {
         console.error("Failed to create session");
-        this.state = SDKState.ERROR;
-        this.activeSession = null;
-        this.removeSessionFromUrl();
+        return null;
+      }
+      return session;
+    } catch (error) {
+      console.error("Error creating session:", error);
+      return null;
+    }
+  }
+  /**
+   * Set up common event listeners for a session
+   */
+  setupSessionEventListeners(session, onError) {
+    session.on("stateChanged", (newState) => {
+      this.state = newState;
+      if (newState !== SDKState.READY) {
+        this.storedActiveState = newState;
+      }
+    });
+    session.on("volume", ({ speaker, spectrum, volume }) => {
+      this.volume = { speaker, spectrum, volume };
+    });
+    session.on("error", (error) => {
+      console.error("Session error:", error);
+      this.state = SDKState.ERROR;
+      this.activeSession = null;
+      if (onError) {
+        onError();
+      }
+    });
+  }
+  /**
+   * Handle session creation failure
+   */
+  handleSessionCreationFailure(onFailure) {
+    this.state = SDKState.ERROR;
+    this.activeSession = null;
+    if (onFailure) {
+      onFailure();
+    }
+  }
+  async connectObi(sessionToken) {
+    if (this.activeSession) {
+      console.log("Connection already exists");
+      return;
+    }
+    try {
+      const session = this.createSession(sessionToken);
+      if (!session) {
+        this.handleSessionCreationFailure(() => this.removeSessionFromUrl());
         return;
       }
-      session.on("stateChanged", (newState) => {
-        this.state = newState;
-        if (newState !== SDKState.READY) {
-          this.storedActiveState = newState;
-        }
-      });
-      session.on("volume", ({ speaker, spectrum, volume }) => {
-        this.volume = { speaker, spectrum, volume };
-      });
+      this.setupSessionEventListeners(session, () => this.removeSessionFromUrl());
       session.on("screenCaptureRequested", async () => {
         try {
           const canvas = await html2canvas(document.documentElement, {
@@ -33081,12 +33858,6 @@ class ObiWidget extends LitElement {
           this.activeSession.emit("screenCaptureComplete", "error");
         }
       });
-      session.on("error", (error) => {
-        console.error("Session error:", error);
-        this.state = SDKState.ERROR;
-        this.activeSession = null;
-        this.removeSessionFromUrl();
-      });
       const connectionInfo = await session.connect();
       if (connectionInfo) {
         this.sessionToken = sessionToken;
@@ -33097,9 +33868,7 @@ class ObiWidget extends LitElement {
       this.activeSession = session;
     } catch (error) {
       console.error("Failed to start session:", error);
-      this.state = SDKState.ERROR;
-      this.activeSession = null;
-      this.removeSessionFromUrl();
+      this.handleSessionCreationFailure(() => this.removeSessionFromUrl());
     }
   }
   async handleSessionStart(sessionToken) {
@@ -33107,7 +33876,7 @@ class ObiWidget extends LitElement {
       console.log("Connection already in progress or active session exists");
       return;
     }
-    this.showCourseModal = false;
+    this.showSessionStartModal = false;
     this.state = SDKState.LOADING;
     await this.connectObi(sessionToken);
   }
@@ -33132,31 +33901,12 @@ class ObiWidget extends LitElement {
         }
       }
       this.state = SDKState.LOADING;
-      const session = new ObiSession({
-        sessionId: sessionToken,
-        apiBaseUrl: API_BASE_URL
-      });
+      const session = this.createSession(sessionToken);
       if (!session) {
-        console.error("Failed to create session");
-        this.state = SDKState.ERROR;
-        this.clearSessionStorage();
+        this.handleSessionCreationFailure(() => this.clearSessionStorage());
         return;
       }
-      session.on("stateChanged", (newState) => {
-        this.state = newState;
-        if (newState !== SDKState.READY) {
-          this.storedActiveState = newState;
-        }
-      });
-      session.on("volume", ({ speaker, spectrum, volume }) => {
-        this.volume = { speaker, spectrum, volume };
-      });
-      session.on("error", (error) => {
-        console.error("Session error:", error);
-        this.state = SDKState.ERROR;
-        this.activeSession = null;
-        this.clearSessionStorage();
-      });
+      this.setupSessionEventListeners(session, () => this.clearSessionStorage());
       const reconnected = await session.reconnect(roomUrl, roomToken, obiState);
       if (reconnected) {
         this.activeSession = session;
@@ -33170,8 +33920,7 @@ class ObiWidget extends LitElement {
       }
     } catch (error) {
       console.error("Error reconnecting to session:", error);
-      this.state = SDKState.ERROR;
-      this.clearSessionStorage();
+      this.handleSessionCreationFailure(() => this.clearSessionStorage());
     }
   }
   /**
@@ -33202,8 +33951,9 @@ class ObiWidget extends LitElement {
     if (!this.activeSession) {
       const urlParams = new URLSearchParams(window.location.search);
       const sessionId = urlParams.get(SESSION_URL_PARAM);
-      if (sessionId) {
-        this.handleSessionStart(sessionId);
+      this.apiKey = urlParams.get(API_KEY_URL_PARAM) || this.apiKey;
+      if (sessionId && this.apiKey) {
+        await this.handleUrlSessionEvent(sessionId);
       }
     }
   }
@@ -33299,9 +34049,17 @@ class ObiWidget extends LitElement {
       </div>
       ${this.showCourseModal ? html`<obi-course-modal
             .onClose=${() => this.showCourseModal = false}
-            .onCourseSelect=${this.handleSessionStart.bind(this)}
+            @course-select=${this.handleCourseSelectEvent}
             .apiKey=${this.apiKey}
           ></obi-course-modal>` : nothing}
+      ${this.showSessionStartModal && this.selectedCourse ? html`<obi-session-start-modal
+            .session=${this.selectedCourse}
+            .onStart=${this.handleSessionStart.bind(this)}
+            .onClose=${() => {
+      this.showSessionStartModal = false;
+      this.selectedCourse = null;
+    }}
+          ></obi-session-start-modal>` : nothing}
     `;
   }
 }
@@ -33458,6 +34216,12 @@ __decorateClass([
 __decorateClass([
   r$2()
 ], ObiWidget.prototype, "showCourseModal", 2);
+__decorateClass([
+  r$2()
+], ObiWidget.prototype, "showSessionStartModal", 2);
+__decorateClass([
+  r$2()
+], ObiWidget.prototype, "selectedCourse", 2);
 __decorateClass([
   r$2()
 ], ObiWidget.prototype, "isHovering", 2);