obi-sdk 0.1.2 → 0.1.3

package/dist/modular/chunks/{index-634e0df5.js → obi-widget-9c0306f4.js}

@@ -190,10 +190,10 @@ class ZodError extends Error {
           fieldErrors._errors.push(mapper(issue));
         } else {
           let curr = fieldErrors;
-          let i2 = 0;
-          while (i2 < issue.path.length) {
-            const el = issue.path[i2];
-            const terminal = i2 === issue.path.length - 1;
+          let i3 = 0;
+          while (i3 < issue.path.length) {
+            const el = issue.path[i3];
+            const terminal = i3 === issue.path.length - 1;
             if (!terminal) {
               curr[el] = curr[el] || { _errors: [] };
             } else {
@@ -201,7 +201,7 @@ class ZodError extends Error {
               curr[el]._errors.push(mapper(issue));
             }
             curr = curr[el];
-            i2++;
+            i3++;
           }
         }
       }
@@ -2185,14 +2185,14 @@ class ZodArray extends ZodType {
       }
     }
     if (ctx.common.async) {
-      return Promise.all([...ctx.data].map((item, i2) => {
-        return def.type._parseAsync(new ParseInputLazyPath(ctx, item, ctx.path, i2));
+      return Promise.all([...ctx.data].map((item, i3) => {
+        return def.type._parseAsync(new ParseInputLazyPath(ctx, item, ctx.path, i3));
       })).then((result2) => {
         return ParseStatus.mergeArray(status, result2);
       });
     }
-    const result = [...ctx.data].map((item, i2) => {
-      return def.type._parseSync(new ParseInputLazyPath(ctx, item, ctx.path, i2));
+    const result = [...ctx.data].map((item, i3) => {
+      return def.type._parseSync(new ParseInputLazyPath(ctx, item, ctx.path, i3));
     });
     return ParseStatus.mergeArray(status, result);
   }
@@ -3121,7 +3121,7 @@ class ZodSet extends ZodType {
       }
       return { status: status.value, value: parsedSet };
     }
-    const elements = [...ctx.data.values()].map((item, i2) => valueType._parse(new ParseInputLazyPath(ctx, item, ctx.path, i2)));
+    const elements = [...ctx.data.values()].map((item, i3) => valueType._parse(new ParseInputLazyPath(ctx, item, ctx.path, i3)));
     if (ctx.common.async) {
       return Promise.all(elements).then((elements2) => finalizeSet(elements2));
     } else {
@@ -3949,7 +3949,7 @@ const coerce = {
   date: (arg) => ZodDate.create({ ...arg, coerce: true })
 };
 const NEVER = INVALID;
-var z$1 = /* @__PURE__ */ Object.freeze({
+var z$2 = /* @__PURE__ */ Object.freeze({
   __proto__: null,
   defaultErrorMap: errorMap,
   setErrorMap,
@@ -4065,12 +4065,17 @@ var z$1 = /* @__PURE__ */ Object.freeze({
   quotelessJson,
   ZodError
 });
-const ObiSDKConfigSchema = z$1.object({
-  apiKey: z$1.string().optional(),
-  baseUrl: z$1.string().default("https://iamobi.ai/api"),
-  enableVoice: z$1.boolean().default(true),
-  enableScreenCapture: z$1.boolean().default(true),
-  debug: z$1.boolean().default(false)
+const API_BASE_URL = "https://iamobi.ai/api";
+const ObiSDKConfigSchema = z$2.object({
+  apiKey: z$2.string().optional(),
+  enableVoice: z$2.boolean().default(true),
+  enableScreenCapture: z$2.boolean().default(true),
+  debug: z$2.boolean().default(false),
+  user: z$2.object({
+    id: z$2.string(),
+    email: z$2.string().optional(),
+    metadata: z$2.any().optional()
+  }).optional()
 });
 var EventType = /* @__PURE__ */ ((EventType2) => {
   EventType2["READY"] = "ready";
@@ -4094,229 +4099,229 @@ var SDKState = /* @__PURE__ */ ((SDKState2) => {
   SDKState2["AWAITING_USER_INPUT"] = "awaiting_user_input";
   return SDKState2;
 })(SDKState || {});
-const t = Symbol.for("@ts-pattern/matcher"), e = Symbol.for("@ts-pattern/isVariadic"), n = "@ts-pattern/anonymous-select-key", r = (t2) => Boolean(t2 && "object" == typeof t2), i = (e2) => e2 && !!e2[t], o = (n2, s2, c2) => {
-  if (i(n2)) {
-    const e2 = n2[t](), { matched: r2, selections: i2 } = e2.match(s2);
-    return r2 && i2 && Object.keys(i2).forEach((t2) => c2(t2, i2[t2])), r2;
+const t$3 = Symbol.for("@ts-pattern/matcher"), e$5 = Symbol.for("@ts-pattern/isVariadic"), n$6 = "@ts-pattern/anonymous-select-key", r$6 = (t2) => Boolean(t2 && "object" == typeof t2), i$5 = (e2) => e2 && !!e2[t$3], o$7 = (n3, s2, c2) => {
+  if (i$5(n3)) {
+    const e2 = n3[t$3](), { matched: r2, selections: i3 } = e2.match(s2);
+    return r2 && i3 && Object.keys(i3).forEach((t2) => c2(t2, i3[t2])), r2;
   }
-  if (r(n2)) {
-    if (!r(s2))
+  if (r$6(n3)) {
+    if (!r$6(s2))
       return false;
-    if (Array.isArray(n2)) {
+    if (Array.isArray(n3)) {
       if (!Array.isArray(s2))
         return false;
       let t2 = [], r2 = [], a2 = [];
-      for (const o2 of n2.keys()) {
-        const s3 = n2[o2];
-        i(s3) && s3[e] ? a2.push(s3) : a2.length ? r2.push(s3) : t2.push(s3);
+      for (const o2 of n3.keys()) {
+        const s3 = n3[o2];
+        i$5(s3) && s3[e$5] ? a2.push(s3) : a2.length ? r2.push(s3) : t2.push(s3);
       }
       if (a2.length) {
         if (a2.length > 1)
           throw new Error("Pattern error: Using `...P.array(...)` several times in a single pattern is not allowed.");
         if (s2.length < t2.length + r2.length)
           return false;
-        const e2 = s2.slice(0, t2.length), n3 = 0 === r2.length ? [] : s2.slice(-r2.length), i2 = s2.slice(t2.length, 0 === r2.length ? Infinity : -r2.length);
-        return t2.every((t3, n4) => o(t3, e2[n4], c2)) && r2.every((t3, e3) => o(t3, n3[e3], c2)) && (0 === a2.length || o(a2[0], i2, c2));
+        const e2 = s2.slice(0, t2.length), n4 = 0 === r2.length ? [] : s2.slice(-r2.length), i3 = s2.slice(t2.length, 0 === r2.length ? Infinity : -r2.length);
+        return t2.every((t3, n5) => o$7(t3, e2[n5], c2)) && r2.every((t3, e3) => o$7(t3, n4[e3], c2)) && (0 === a2.length || o$7(a2[0], i3, c2));
       }
-      return n2.length === s2.length && n2.every((t3, e2) => o(t3, s2[e2], c2));
+      return n3.length === s2.length && n3.every((t3, e2) => o$7(t3, s2[e2], c2));
     }
-    return Reflect.ownKeys(n2).every((e2) => {
-      const r2 = n2[e2];
-      return (e2 in s2 || i(a2 = r2) && "optional" === a2[t]().matcherType) && o(r2, s2[e2], c2);
+    return Reflect.ownKeys(n3).every((e2) => {
+      const r2 = n3[e2];
+      return (e2 in s2 || i$5(a2 = r2) && "optional" === a2[t$3]().matcherType) && o$7(r2, s2[e2], c2);
       var a2;
     });
   }
-  return Object.is(s2, n2);
-}, s = (e2) => {
-  var n2, o2, a2;
-  return r(e2) ? i(e2) ? null != (n2 = null == (o2 = (a2 = e2[t]()).getSelectionKeys) ? void 0 : o2.call(a2)) ? n2 : [] : Array.isArray(e2) ? c(e2, s) : c(Object.values(e2), s) : [];
-}, c = (t2, e2) => t2.reduce((t3, n2) => t3.concat(e2(n2)), []);
-function a(...t2) {
+  return Object.is(s2, n3);
+}, s$4 = (e2) => {
+  var n3, o2, a2;
+  return r$6(e2) ? i$5(e2) ? null != (n3 = null == (o2 = (a2 = e2[t$3]()).getSelectionKeys) ? void 0 : o2.call(a2)) ? n3 : [] : Array.isArray(e2) ? c$4(e2, s$4) : c$4(Object.values(e2), s$4) : [];
+}, c$4 = (t2, e2) => t2.reduce((t3, n3) => t3.concat(e2(n3)), []);
+function a$2(...t2) {
   if (1 === t2.length) {
     const [e2] = t2;
-    return (t3) => o(e2, t3, () => {
+    return (t3) => o$7(e2, t3, () => {
     });
   }
   if (2 === t2.length) {
-    const [e2, n2] = t2;
-    return o(e2, n2, () => {
+    const [e2, n3] = t2;
+    return o$7(e2, n3, () => {
     });
   }
   throw new Error(`isMatching wasn't given the right number of arguments: expected 1 or 2, received ${t2.length}.`);
 }
-function u(t2) {
-  return Object.assign(t2, { optional: () => h(t2), and: (e2) => m(t2, e2), or: (e2) => d(t2, e2), select: (e2) => void 0 === e2 ? y(t2) : y(e2, t2) });
+function u$2(t2) {
+  return Object.assign(t2, { optional: () => h$4(t2), and: (e2) => m$1(t2, e2), or: (e2) => d$2(t2, e2), select: (e2) => void 0 === e2 ? y$2(t2) : y$2(e2, t2) });
 }
-function l(t2) {
+function l$2(t2) {
   return Object.assign(((t3) => Object.assign(t3, { [Symbol.iterator]() {
-    let n2 = 0;
-    const r2 = [{ value: Object.assign(t3, { [e]: true }), done: false }, { done: true, value: void 0 }];
+    let n3 = 0;
+    const r2 = [{ value: Object.assign(t3, { [e$5]: true }), done: false }, { done: true, value: void 0 }];
     return { next: () => {
       var t4;
-      return null != (t4 = r2[n2++]) ? t4 : r2.at(-1);
+      return null != (t4 = r2[n3++]) ? t4 : r2.at(-1);
     } };
-  } }))(t2), { optional: () => l(h(t2)), select: (e2) => l(void 0 === e2 ? y(t2) : y(e2, t2)) });
+  } }))(t2), { optional: () => l$2(h$4(t2)), select: (e2) => l$2(void 0 === e2 ? y$2(t2) : y$2(e2, t2)) });
 }
-function h(e2) {
-  return u({ [t]: () => ({ match: (t2) => {
-    let n2 = {};
+function h$4(e2) {
+  return u$2({ [t$3]: () => ({ match: (t2) => {
+    let n3 = {};
     const r2 = (t3, e3) => {
-      n2[t3] = e3;
+      n3[t3] = e3;
     };
-    return void 0 === t2 ? (s(e2).forEach((t3) => r2(t3, void 0)), { matched: true, selections: n2 }) : { matched: o(e2, t2, r2), selections: n2 };
-  }, getSelectionKeys: () => s(e2), matcherType: "optional" }) });
+    return void 0 === t2 ? (s$4(e2).forEach((t3) => r2(t3, void 0)), { matched: true, selections: n3 }) : { matched: o$7(e2, t2, r2), selections: n3 };
+  }, getSelectionKeys: () => s$4(e2), matcherType: "optional" }) });
 }
-const f = (t2, e2) => {
-  for (const n2 of t2)
-    if (!e2(n2))
+const f$4 = (t2, e2) => {
+  for (const n3 of t2)
+    if (!e2(n3))
       return false;
   return true;
-}, g = (t2, e2) => {
-  for (const [n2, r2] of t2.entries())
-    if (!e2(r2, n2))
+}, g$1 = (t2, e2) => {
+  for (const [n3, r2] of t2.entries())
+    if (!e2(r2, n3))
       return false;
   return true;
 };
-function m(...e2) {
-  return u({ [t]: () => ({ match: (t2) => {
-    let n2 = {};
+function m$1(...e2) {
+  return u$2({ [t$3]: () => ({ match: (t2) => {
+    let n3 = {};
     const r2 = (t3, e3) => {
-      n2[t3] = e3;
+      n3[t3] = e3;
     };
-    return { matched: e2.every((e3) => o(e3, t2, r2)), selections: n2 };
-  }, getSelectionKeys: () => c(e2, s), matcherType: "and" }) });
+    return { matched: e2.every((e3) => o$7(e3, t2, r2)), selections: n3 };
+  }, getSelectionKeys: () => c$4(e2, s$4), matcherType: "and" }) });
 }
-function d(...e2) {
-  return u({ [t]: () => ({ match: (t2) => {
-    let n2 = {};
+function d$2(...e2) {
+  return u$2({ [t$3]: () => ({ match: (t2) => {
+    let n3 = {};
     const r2 = (t3, e3) => {
-      n2[t3] = e3;
+      n3[t3] = e3;
     };
-    return c(e2, s).forEach((t3) => r2(t3, void 0)), { matched: e2.some((e3) => o(e3, t2, r2)), selections: n2 };
-  }, getSelectionKeys: () => c(e2, s), matcherType: "or" }) });
+    return c$4(e2, s$4).forEach((t3) => r2(t3, void 0)), { matched: e2.some((e3) => o$7(e3, t2, r2)), selections: n3 };
+  }, getSelectionKeys: () => c$4(e2, s$4), matcherType: "or" }) });
 }
-function p(e2) {
-  return { [t]: () => ({ match: (t2) => ({ matched: Boolean(e2(t2)) }) }) };
+function p$2(e2) {
+  return { [t$3]: () => ({ match: (t2) => ({ matched: Boolean(e2(t2)) }) }) };
 }
-function y(...e2) {
-  const r2 = "string" == typeof e2[0] ? e2[0] : void 0, i2 = 2 === e2.length ? e2[1] : "string" == typeof e2[0] ? void 0 : e2[0];
-  return u({ [t]: () => ({ match: (t2) => {
-    let e3 = { [null != r2 ? r2 : n]: t2 };
-    return { matched: void 0 === i2 || o(i2, t2, (t3, n2) => {
-      e3[t3] = n2;
+function y$2(...e2) {
+  const r2 = "string" == typeof e2[0] ? e2[0] : void 0, i3 = 2 === e2.length ? e2[1] : "string" == typeof e2[0] ? void 0 : e2[0];
+  return u$2({ [t$3]: () => ({ match: (t2) => {
+    let e3 = { [null != r2 ? r2 : n$6]: t2 };
+    return { matched: void 0 === i3 || o$7(i3, t2, (t3, n3) => {
+      e3[t3] = n3;
     }), selections: e3 };
-  }, getSelectionKeys: () => [null != r2 ? r2 : n].concat(void 0 === i2 ? [] : s(i2)) }) });
+  }, getSelectionKeys: () => [null != r2 ? r2 : n$6].concat(void 0 === i3 ? [] : s$4(i3)) }) });
 }
-function v(t2) {
+function v$1(t2) {
   return "number" == typeof t2;
 }
-function b(t2) {
+function b$2(t2) {
   return "string" == typeof t2;
 }
 function w(t2) {
   return "bigint" == typeof t2;
 }
-const S = u(p(function(t2) {
+const S$2 = u$2(p$2(function(t2) {
   return true;
-})), O = S, j = (t2) => Object.assign(u(t2), { startsWith: (e2) => {
-  return j(m(t2, (n2 = e2, p((t3) => b(t3) && t3.startsWith(n2)))));
-  var n2;
+})), O = S$2, j$1 = (t2) => Object.assign(u$2(t2), { startsWith: (e2) => {
+  return j$1(m$1(t2, (n3 = e2, p$2((t3) => b$2(t3) && t3.startsWith(n3)))));
+  var n3;
 }, endsWith: (e2) => {
-  return j(m(t2, (n2 = e2, p((t3) => b(t3) && t3.endsWith(n2)))));
-  var n2;
-}, minLength: (e2) => j(m(t2, ((t3) => p((e3) => b(e3) && e3.length >= t3))(e2))), length: (e2) => j(m(t2, ((t3) => p((e3) => b(e3) && e3.length === t3))(e2))), maxLength: (e2) => j(m(t2, ((t3) => p((e3) => b(e3) && e3.length <= t3))(e2))), includes: (e2) => {
-  return j(m(t2, (n2 = e2, p((t3) => b(t3) && t3.includes(n2)))));
-  var n2;
+  return j$1(m$1(t2, (n3 = e2, p$2((t3) => b$2(t3) && t3.endsWith(n3)))));
+  var n3;
+}, minLength: (e2) => j$1(m$1(t2, ((t3) => p$2((e3) => b$2(e3) && e3.length >= t3))(e2))), length: (e2) => j$1(m$1(t2, ((t3) => p$2((e3) => b$2(e3) && e3.length === t3))(e2))), maxLength: (e2) => j$1(m$1(t2, ((t3) => p$2((e3) => b$2(e3) && e3.length <= t3))(e2))), includes: (e2) => {
+  return j$1(m$1(t2, (n3 = e2, p$2((t3) => b$2(t3) && t3.includes(n3)))));
+  var n3;
 }, regex: (e2) => {
-  return j(m(t2, (n2 = e2, p((t3) => b(t3) && Boolean(t3.match(n2))))));
-  var n2;
-} }), K = j(p(b)), x = (t2) => Object.assign(u(t2), { between: (e2, n2) => x(m(t2, ((t3, e3) => p((n3) => v(n3) && t3 <= n3 && e3 >= n3))(e2, n2))), lt: (e2) => x(m(t2, ((t3) => p((e3) => v(e3) && e3 < t3))(e2))), gt: (e2) => x(m(t2, ((t3) => p((e3) => v(e3) && e3 > t3))(e2))), lte: (e2) => x(m(t2, ((t3) => p((e3) => v(e3) && e3 <= t3))(e2))), gte: (e2) => x(m(t2, ((t3) => p((e3) => v(e3) && e3 >= t3))(e2))), int: () => x(m(t2, p((t3) => v(t3) && Number.isInteger(t3)))), finite: () => x(m(t2, p((t3) => v(t3) && Number.isFinite(t3)))), positive: () => x(m(t2, p((t3) => v(t3) && t3 > 0))), negative: () => x(m(t2, p((t3) => v(t3) && t3 < 0))) }), E = x(p(v)), A = (t2) => Object.assign(u(t2), { between: (e2, n2) => A(m(t2, ((t3, e3) => p((n3) => w(n3) && t3 <= n3 && e3 >= n3))(e2, n2))), lt: (e2) => A(m(t2, ((t3) => p((e3) => w(e3) && e3 < t3))(e2))), gt: (e2) => A(m(t2, ((t3) => p((e3) => w(e3) && e3 > t3))(e2))), lte: (e2) => A(m(t2, ((t3) => p((e3) => w(e3) && e3 <= t3))(e2))), gte: (e2) => A(m(t2, ((t3) => p((e3) => w(e3) && e3 >= t3))(e2))), positive: () => A(m(t2, p((t3) => w(t3) && t3 > 0))), negative: () => A(m(t2, p((t3) => w(t3) && t3 < 0))) }), P = A(p(w)), T = u(p(function(t2) {
+  return j$1(m$1(t2, (n3 = e2, p$2((t3) => b$2(t3) && Boolean(t3.match(n3))))));
+  var n3;
+} }), K = j$1(p$2(b$2)), x$1 = (t2) => Object.assign(u$2(t2), { between: (e2, n3) => x$1(m$1(t2, ((t3, e3) => p$2((n4) => v$1(n4) && t3 <= n4 && e3 >= n4))(e2, n3))), lt: (e2) => x$1(m$1(t2, ((t3) => p$2((e3) => v$1(e3) && e3 < t3))(e2))), gt: (e2) => x$1(m$1(t2, ((t3) => p$2((e3) => v$1(e3) && e3 > t3))(e2))), lte: (e2) => x$1(m$1(t2, ((t3) => p$2((e3) => v$1(e3) && e3 <= t3))(e2))), gte: (e2) => x$1(m$1(t2, ((t3) => p$2((e3) => v$1(e3) && e3 >= t3))(e2))), int: () => x$1(m$1(t2, p$2((t3) => v$1(t3) && Number.isInteger(t3)))), finite: () => x$1(m$1(t2, p$2((t3) => v$1(t3) && Number.isFinite(t3)))), positive: () => x$1(m$1(t2, p$2((t3) => v$1(t3) && t3 > 0))), negative: () => x$1(m$1(t2, p$2((t3) => v$1(t3) && t3 < 0))) }), E$1 = x$1(p$2(v$1)), A$1 = (t2) => Object.assign(u$2(t2), { between: (e2, n3) => A$1(m$1(t2, ((t3, e3) => p$2((n4) => w(n4) && t3 <= n4 && e3 >= n4))(e2, n3))), lt: (e2) => A$1(m$1(t2, ((t3) => p$2((e3) => w(e3) && e3 < t3))(e2))), gt: (e2) => A$1(m$1(t2, ((t3) => p$2((e3) => w(e3) && e3 > t3))(e2))), lte: (e2) => A$1(m$1(t2, ((t3) => p$2((e3) => w(e3) && e3 <= t3))(e2))), gte: (e2) => A$1(m$1(t2, ((t3) => p$2((e3) => w(e3) && e3 >= t3))(e2))), positive: () => A$1(m$1(t2, p$2((t3) => w(t3) && t3 > 0))), negative: () => A$1(m$1(t2, p$2((t3) => w(t3) && t3 < 0))) }), P$1 = A$1(p$2(w)), T$1 = u$2(p$2(function(t2) {
   return "boolean" == typeof t2;
-})), B = u(p(function(t2) {
+})), B$1 = u$2(p$2(function(t2) {
   return "symbol" == typeof t2;
-})), _ = u(p(function(t2) {
+})), _$1 = u$2(p$2(function(t2) {
   return null == t2;
-})), k = u(p(function(t2) {
+})), k$1 = u$2(p$2(function(t2) {
   return null != t2;
 }));
-var N = { __proto__: null, matcher: t, optional: h, array: function(...e2) {
-  return l({ [t]: () => ({ match: (t2) => {
+var N$1 = { __proto__: null, matcher: t$3, optional: h$4, array: function(...e2) {
+  return l$2({ [t$3]: () => ({ match: (t2) => {
     if (!Array.isArray(t2))
       return { matched: false };
     if (0 === e2.length)
       return { matched: true };
-    const n2 = e2[0];
+    const n3 = e2[0];
     let r2 = {};
     if (0 === t2.length)
-      return s(n2).forEach((t3) => {
+      return s$4(n3).forEach((t3) => {
         r2[t3] = [];
       }), { matched: true, selections: r2 };
-    const i2 = (t3, e3) => {
+    const i3 = (t3, e3) => {
       r2[t3] = (r2[t3] || []).concat([e3]);
     };
-    return { matched: t2.every((t3) => o(n2, t3, i2)), selections: r2 };
-  }, getSelectionKeys: () => 0 === e2.length ? [] : s(e2[0]) }) });
+    return { matched: t2.every((t3) => o$7(n3, t3, i3)), selections: r2 };
+  }, getSelectionKeys: () => 0 === e2.length ? [] : s$4(e2[0]) }) });
 }, set: function(...e2) {
-  return u({ [t]: () => ({ match: (t2) => {
+  return u$2({ [t$3]: () => ({ match: (t2) => {
     if (!(t2 instanceof Set))
       return { matched: false };
-    let n2 = {};
+    let n3 = {};
     if (0 === t2.size)
-      return { matched: true, selections: n2 };
+      return { matched: true, selections: n3 };
     if (0 === e2.length)
       return { matched: true };
     const r2 = (t3, e3) => {
-      n2[t3] = (n2[t3] || []).concat([e3]);
-    }, i2 = e2[0];
-    return { matched: f(t2, (t3) => o(i2, t3, r2)), selections: n2 };
-  }, getSelectionKeys: () => 0 === e2.length ? [] : s(e2[0]) }) });
+      n3[t3] = (n3[t3] || []).concat([e3]);
+    }, i3 = e2[0];
+    return { matched: f$4(t2, (t3) => o$7(i3, t3, r2)), selections: n3 };
+  }, getSelectionKeys: () => 0 === e2.length ? [] : s$4(e2[0]) }) });
 }, map: function(...e2) {
-  return u({ [t]: () => ({ match: (t2) => {
+  return u$2({ [t$3]: () => ({ match: (t2) => {
     if (!(t2 instanceof Map))
       return { matched: false };
-    let n2 = {};
+    let n3 = {};
     if (0 === t2.size)
-      return { matched: true, selections: n2 };
+      return { matched: true, selections: n3 };
     const r2 = (t3, e3) => {
-      n2[t3] = (n2[t3] || []).concat([e3]);
+      n3[t3] = (n3[t3] || []).concat([e3]);
     };
     if (0 === e2.length)
       return { matched: true };
-    var i2;
+    var i3;
     if (1 === e2.length)
-      throw new Error(`\`P.map\` wasn't given enough arguments. Expected (key, value), received ${null == (i2 = e2[0]) ? void 0 : i2.toString()}`);
+      throw new Error(`\`P.map\` wasn't given enough arguments. Expected (key, value), received ${null == (i3 = e2[0]) ? void 0 : i3.toString()}`);
     const [s2, c2] = e2;
-    return { matched: g(t2, (t3, e3) => {
-      const n3 = o(s2, e3, r2), i3 = o(c2, t3, r2);
-      return n3 && i3;
-    }), selections: n2 };
-  }, getSelectionKeys: () => 0 === e2.length ? [] : [...s(e2[0]), ...s(e2[1])] }) });
-}, intersection: m, union: d, not: function(e2) {
-  return u({ [t]: () => ({ match: (t2) => ({ matched: !o(e2, t2, () => {
+    return { matched: g$1(t2, (t3, e3) => {
+      const n4 = o$7(s2, e3, r2), i4 = o$7(c2, t3, r2);
+      return n4 && i4;
+    }), selections: n3 };
+  }, getSelectionKeys: () => 0 === e2.length ? [] : [...s$4(e2[0]), ...s$4(e2[1])] }) });
+}, intersection: m$1, union: d$2, not: function(e2) {
+  return u$2({ [t$3]: () => ({ match: (t2) => ({ matched: !o$7(e2, t2, () => {
   }) }), getSelectionKeys: () => [], matcherType: "not" }) });
-}, when: p, select: y, any: S, _: O, string: K, number: E, bigint: P, boolean: T, symbol: B, nullish: _, nonNullable: k, instanceOf: function(t2) {
-  return u(p(function(t3) {
+}, when: p$2, select: y$2, any: S$2, _: O, string: K, number: E$1, bigint: P$1, boolean: T$1, symbol: B$1, nullish: _$1, nonNullable: k$1, instanceOf: function(t2) {
+  return u$2(p$2(function(t3) {
     return (e2) => e2 instanceof t3;
   }(t2)));
 }, shape: function(t2) {
-  return u(p(a(t2)));
+  return u$2(p$2(a$2(t2)));
 } };
 class W extends Error {
   constructor(t2) {
     let e2;
     try {
       e2 = JSON.stringify(t2);
-    } catch (n2) {
+    } catch (n3) {
       e2 = t2;
     }
     super(`Pattern matching error: no pattern matches value ${e2}`), this.input = void 0, this.input = t2;
   }
 }
-const $ = { matched: false, value: void 0 };
-function z(t2) {
-  return new I(t2, $);
+const $$1 = { matched: false, value: void 0 };
+function z$1(t2) {
+  return new I$1(t2, $$1);
 }
-class I {
+let I$1 = class I {
   constructor(t2, e2) {
     this.input = void 0, this.state = void 0, this.input = t2, this.state = e2;
   }
@@ -4324,24 +4329,24 @@ class I {
     if (this.state.matched)
       return this;
     const e2 = t2[t2.length - 1], r2 = [t2[0]];
-    let i2;
-    3 === t2.length && "function" == typeof t2[1] ? i2 = t2[1] : t2.length > 2 && r2.push(...t2.slice(1, t2.length - 1));
+    let i3;
+    3 === t2.length && "function" == typeof t2[1] ? i3 = t2[1] : t2.length > 2 && r2.push(...t2.slice(1, t2.length - 1));
     let s2 = false, c2 = {};
     const a2 = (t3, e3) => {
       s2 = true, c2[t3] = e3;
-    }, u2 = !r2.some((t3) => o(t3, this.input, a2)) || i2 && !Boolean(i2(this.input)) ? $ : { matched: true, value: e2(s2 ? n in c2 ? c2[n] : c2 : this.input, this.input) };
+    }, u2 = !r2.some((t3) => o$7(t3, this.input, a2)) || i3 && !Boolean(i3(this.input)) ? $$1 : { matched: true, value: e2(s2 ? n$6 in c2 ? c2[n$6] : c2 : this.input, this.input) };
     return new I(this.input, u2);
   }
   when(t2, e2) {
     if (this.state.matched)
       return this;
-    const n2 = Boolean(t2(this.input));
-    return new I(this.input, n2 ? { matched: true, value: e2(this.input, this.input) } : $);
+    const n3 = Boolean(t2(this.input));
+    return new I(this.input, n3 ? { matched: true, value: e2(this.input, this.input) } : $$1);
   }
   otherwise(t2) {
     return this.state.matched ? this.state.value : t2(this.input);
   }
-  exhaustive(t2 = L) {
+  exhaustive(t2 = L$1) {
     return this.state.matched ? this.state.value : t2(this.input);
   }
   run() {
@@ -4350,15 +4355,2015 @@ class I {
   returnType() {
     return this;
   }
-}
-function L(t2) {
+};
+function L$1(t2) {
   throw new W(t2);
 }
+const t$2 = globalThis, e$4 = t$2.ShadowRoot && (void 0 === t$2.ShadyCSS || t$2.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, s$3 = Symbol(), o$6 = /* @__PURE__ */ new WeakMap();
+let n$5 = class n {
+  constructor(t2, e2, o2) {
+    if (this._$cssResult$ = true, o2 !== s$3)
+      throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
+    this.cssText = t2, this.t = e2;
+  }
+  get styleSheet() {
+    let t2 = this.o;
+    const s2 = this.t;
+    if (e$4 && void 0 === t2) {
+      const e2 = void 0 !== s2 && 1 === s2.length;
+      e2 && (t2 = o$6.get(s2)), void 0 === t2 && ((this.o = t2 = new CSSStyleSheet()).replaceSync(this.cssText), e2 && o$6.set(s2, t2));
+    }
+    return t2;
+  }
+  toString() {
+    return this.cssText;
+  }
+};
+const r$5 = (t2) => new n$5("string" == typeof t2 ? t2 : t2 + "", void 0, s$3), i$4 = (t2, ...e2) => {
+  const o2 = 1 === t2.length ? t2[0] : e2.reduce((e3, s2, o3) => e3 + ((t3) => {
+    if (true === t3._$cssResult$)
+      return t3.cssText;
+    if ("number" == typeof t3)
+      return t3;
+    throw Error("Value passed to 'css' function must be a 'css' function result: " + t3 + ". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.");
+  })(s2) + t2[o3 + 1], t2[0]);
+  return new n$5(o2, t2, s$3);
+}, S$1 = (s2, o2) => {
+  if (e$4)
+    s2.adoptedStyleSheets = o2.map((t2) => t2 instanceof CSSStyleSheet ? t2 : t2.styleSheet);
+  else
+    for (const e2 of o2) {
+      const o3 = document.createElement("style"), n3 = t$2.litNonce;
+      void 0 !== n3 && o3.setAttribute("nonce", n3), o3.textContent = e2.cssText, s2.appendChild(o3);
+    }
+}, c$3 = e$4 ? (t2) => t2 : (t2) => t2 instanceof CSSStyleSheet ? ((t3) => {
+  let e2 = "";
+  for (const s2 of t3.cssRules)
+    e2 += s2.cssText;
+  return r$5(e2);
+})(t2) : t2;
+const { is: i$3, defineProperty: e$3, getOwnPropertyDescriptor: h$3, getOwnPropertyNames: r$4, getOwnPropertySymbols: o$5, getPrototypeOf: n$4 } = Object, a$1 = globalThis, c$2 = a$1.trustedTypes, l$1 = c$2 ? c$2.emptyScript : "", p$1 = a$1.reactiveElementPolyfillSupport, d$1 = (t2, s2) => t2, u$1 = { toAttribute(t2, s2) {
+  switch (s2) {
+    case Boolean:
+      t2 = t2 ? l$1 : null;
+      break;
+    case Object:
+    case Array:
+      t2 = null == t2 ? t2 : JSON.stringify(t2);
+  }
+  return t2;
+}, fromAttribute(t2, s2) {
+  let i3 = t2;
+  switch (s2) {
+    case Boolean:
+      i3 = null !== t2;
+      break;
+    case Number:
+      i3 = null === t2 ? null : Number(t2);
+      break;
+    case Object:
+    case Array:
+      try {
+        i3 = JSON.parse(t2);
+      } catch (t3) {
+        i3 = null;
+      }
+  }
+  return i3;
+} }, f$3 = (t2, s2) => !i$3(t2, s2), b$1 = { attribute: true, type: String, converter: u$1, reflect: false, useDefault: false, hasChanged: f$3 };
+Symbol.metadata ?? (Symbol.metadata = Symbol("metadata")), a$1.litPropertyMetadata ?? (a$1.litPropertyMetadata = /* @__PURE__ */ new WeakMap());
+let y$1 = class y extends HTMLElement {
+  static addInitializer(t2) {
+    this._$Ei(), (this.l ?? (this.l = [])).push(t2);
+  }
+  static get observedAttributes() {
+    return this.finalize(), this._$Eh && [...this._$Eh.keys()];
+  }
+  static createProperty(t2, s2 = b$1) {
+    if (s2.state && (s2.attribute = false), this._$Ei(), this.prototype.hasOwnProperty(t2) && ((s2 = Object.create(s2)).wrapped = true), this.elementProperties.set(t2, s2), !s2.noAccessor) {
+      const i3 = Symbol(), h2 = this.getPropertyDescriptor(t2, i3, s2);
+      void 0 !== h2 && e$3(this.prototype, t2, h2);
+    }
+  }
+  static getPropertyDescriptor(t2, s2, i3) {
+    const { get: e2, set: r2 } = h$3(this.prototype, t2) ?? { get() {
+      return this[s2];
+    }, set(t3) {
+      this[s2] = t3;
+    } };
+    return { get: e2, set(s3) {
+      const h2 = e2?.call(this);
+      r2?.call(this, s3), this.requestUpdate(t2, h2, i3);
+    }, configurable: true, enumerable: true };
+  }
+  static getPropertyOptions(t2) {
+    return this.elementProperties.get(t2) ?? b$1;
+  }
+  static _$Ei() {
+    if (this.hasOwnProperty(d$1("elementProperties")))
+      return;
+    const t2 = n$4(this);
+    t2.finalize(), void 0 !== t2.l && (this.l = [...t2.l]), this.elementProperties = new Map(t2.elementProperties);
+  }
+  static finalize() {
+    if (this.hasOwnProperty(d$1("finalized")))
+      return;
+    if (this.finalized = true, this._$Ei(), this.hasOwnProperty(d$1("properties"))) {
+      const t3 = this.properties, s2 = [...r$4(t3), ...o$5(t3)];
+      for (const i3 of s2)
+        this.createProperty(i3, t3[i3]);
+    }
+    const t2 = this[Symbol.metadata];
+    if (null !== t2) {
+      const s2 = litPropertyMetadata.get(t2);
+      if (void 0 !== s2)
+        for (const [t3, i3] of s2)
+          this.elementProperties.set(t3, i3);
+    }
+    this._$Eh = /* @__PURE__ */ new Map();
+    for (const [t3, s2] of this.elementProperties) {
+      const i3 = this._$Eu(t3, s2);
+      void 0 !== i3 && this._$Eh.set(i3, t3);
+    }
+    this.elementStyles = this.finalizeStyles(this.styles);
+  }
+  static finalizeStyles(s2) {
+    const i3 = [];
+    if (Array.isArray(s2)) {
+      const e2 = new Set(s2.flat(1 / 0).reverse());
+      for (const s3 of e2)
+        i3.unshift(c$3(s3));
+    } else
+      void 0 !== s2 && i3.push(c$3(s2));
+    return i3;
+  }
+  static _$Eu(t2, s2) {
+    const i3 = s2.attribute;
+    return false === i3 ? void 0 : "string" == typeof i3 ? i3 : "string" == typeof t2 ? t2.toLowerCase() : void 0;
+  }
+  constructor() {
+    super(), this._$Ep = void 0, this.isUpdatePending = false, this.hasUpdated = false, this._$Em = null, this._$Ev();
+  }
+  _$Ev() {
+    this._$ES = new Promise((t2) => this.enableUpdating = t2), this._$AL = /* @__PURE__ */ new Map(), this._$E_(), this.requestUpdate(), this.constructor.l?.forEach((t2) => t2(this));
+  }
+  addController(t2) {
+    (this._$EO ?? (this._$EO = /* @__PURE__ */ new Set())).add(t2), void 0 !== this.renderRoot && this.isConnected && t2.hostConnected?.();
+  }
+  removeController(t2) {
+    this._$EO?.delete(t2);
+  }
+  _$E_() {
+    const t2 = /* @__PURE__ */ new Map(), s2 = this.constructor.elementProperties;
+    for (const i3 of s2.keys())
+      this.hasOwnProperty(i3) && (t2.set(i3, this[i3]), delete this[i3]);
+    t2.size > 0 && (this._$Ep = t2);
+  }
+  createRenderRoot() {
+    const t2 = this.shadowRoot ?? this.attachShadow(this.constructor.shadowRootOptions);
+    return S$1(t2, this.constructor.elementStyles), t2;
+  }
+  connectedCallback() {
+    this.renderRoot ?? (this.renderRoot = this.createRenderRoot()), this.enableUpdating(true), this._$EO?.forEach((t2) => t2.hostConnected?.());
+  }
+  enableUpdating(t2) {
+  }
+  disconnectedCallback() {
+    this._$EO?.forEach((t2) => t2.hostDisconnected?.());
+  }
+  attributeChangedCallback(t2, s2, i3) {
+    this._$AK(t2, i3);
+  }
+  _$ET(t2, s2) {
+    const i3 = this.constructor.elementProperties.get(t2), e2 = this.constructor._$Eu(t2, i3);
+    if (void 0 !== e2 && true === i3.reflect) {
+      const h2 = (void 0 !== i3.converter?.toAttribute ? i3.converter : u$1).toAttribute(s2, i3.type);
+      this._$Em = t2, null == h2 ? this.removeAttribute(e2) : this.setAttribute(e2, h2), this._$Em = null;
+    }
+  }
+  _$AK(t2, s2) {
+    const i3 = this.constructor, e2 = i3._$Eh.get(t2);
+    if (void 0 !== e2 && this._$Em !== e2) {
+      const t3 = i3.getPropertyOptions(e2), h2 = "function" == typeof t3.converter ? { fromAttribute: t3.converter } : void 0 !== t3.converter?.fromAttribute ? t3.converter : u$1;
+      this._$Em = e2, this[e2] = h2.fromAttribute(s2, t3.type) ?? this._$Ej?.get(e2) ?? null, this._$Em = null;
+    }
+  }
+  requestUpdate(t2, s2, i3) {
+    if (void 0 !== t2) {
+      const e2 = this.constructor, h2 = this[t2];
+      if (i3 ?? (i3 = e2.getPropertyOptions(t2)), !((i3.hasChanged ?? f$3)(h2, s2) || i3.useDefault && i3.reflect && h2 === this._$Ej?.get(t2) && !this.hasAttribute(e2._$Eu(t2, i3))))
+        return;
+      this.C(t2, s2, i3);
+    }
+    false === this.isUpdatePending && (this._$ES = this._$EP());
+  }
+  C(t2, s2, { useDefault: i3, reflect: e2, wrapped: h2 }, r2) {
+    i3 && !(this._$Ej ?? (this._$Ej = /* @__PURE__ */ new Map())).has(t2) && (this._$Ej.set(t2, r2 ?? s2 ?? this[t2]), true !== h2 || void 0 !== r2) || (this._$AL.has(t2) || (this.hasUpdated || i3 || (s2 = void 0), this._$AL.set(t2, s2)), true === e2 && this._$Em !== t2 && (this._$Eq ?? (this._$Eq = /* @__PURE__ */ new Set())).add(t2));
+  }
+  async _$EP() {
+    this.isUpdatePending = true;
+    try {
+      await this._$ES;
+    } catch (t3) {
+      Promise.reject(t3);
+    }
+    const t2 = this.scheduleUpdate();
+    return null != t2 && await t2, !this.isUpdatePending;
+  }
+  scheduleUpdate() {
+    return this.performUpdate();
+  }
+  performUpdate() {
+    if (!this.isUpdatePending)
+      return;
+    if (!this.hasUpdated) {
+      if (this.renderRoot ?? (this.renderRoot = this.createRenderRoot()), this._$Ep) {
+        for (const [t4, s3] of this._$Ep)
+          this[t4] = s3;
+        this._$Ep = void 0;
+      }
+      const t3 = this.constructor.elementProperties;
+      if (t3.size > 0)
+        for (const [s3, i3] of t3) {
+          const { wrapped: t4 } = i3, e2 = this[s3];
+          true !== t4 || this._$AL.has(s3) || void 0 === e2 || this.C(s3, void 0, i3, e2);
+        }
+    }
+    let t2 = false;
+    const s2 = this._$AL;
+    try {
+      t2 = this.shouldUpdate(s2), t2 ? (this.willUpdate(s2), this._$EO?.forEach((t3) => t3.hostUpdate?.()), this.update(s2)) : this._$EM();
+    } catch (s3) {
+      throw t2 = false, this._$EM(), s3;
+    }
+    t2 && this._$AE(s2);
+  }
+  willUpdate(t2) {
+  }
+  _$AE(t2) {
+    this._$EO?.forEach((t3) => t3.hostUpdated?.()), this.hasUpdated || (this.hasUpdated = true, this.firstUpdated(t2)), this.updated(t2);
+  }
+  _$EM() {
+    this._$AL = /* @__PURE__ */ new Map(), this.isUpdatePending = false;
+  }
+  get updateComplete() {
+    return this.getUpdateComplete();
+  }
+  getUpdateComplete() {
+    return this._$ES;
+  }
+  shouldUpdate(t2) {
+    return true;
+  }
+  update(t2) {
+    this._$Eq && (this._$Eq = this._$Eq.forEach((t3) => this._$ET(t3, this[t3]))), this._$EM();
+  }
+  updated(t2) {
+  }
+  firstUpdated(t2) {
+  }
+};
+y$1.elementStyles = [], y$1.shadowRootOptions = { mode: "open" }, y$1[d$1("elementProperties")] = /* @__PURE__ */ new Map(), y$1[d$1("finalized")] = /* @__PURE__ */ new Map(), p$1?.({ ReactiveElement: y$1 }), (a$1.reactiveElementVersions ?? (a$1.reactiveElementVersions = [])).push("2.1.0");
+const t$1 = globalThis, i$2 = t$1.trustedTypes, s$2 = i$2 ? i$2.createPolicy("lit-html", { createHTML: (t2) => t2 }) : void 0, e$2 = "$lit$", h$2 = `lit$${Math.random().toFixed(9).slice(2)}$`, o$4 = "?" + h$2, n$3 = `<${o$4}>`, r$3 = document, l = () => r$3.createComment(""), c$1 = (t2) => null === t2 || "object" != typeof t2 && "function" != typeof t2, a = Array.isArray, u = (t2) => a(t2) || "function" == typeof t2?.[Symbol.iterator], d = "[ 	\n\f\r]", f$2 = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, v = /-->/g, _ = />/g, m = RegExp(`>|${d}(?:([^\\s"'>=/]+)(${d}*=${d}*(?:[^ 	
+\f\r"'\`<>=]|("|')|))|$)`, "g"), p = /'/g, g = /"/g, $ = /^(?:script|style|textarea|title)$/i, y2 = (t2) => (i3, ...s2) => ({ _$litType$: t2, strings: i3, values: s2 }), x = y2(1), b = y2(2), T = Symbol.for("lit-noChange"), E = Symbol.for("lit-nothing"), A = /* @__PURE__ */ new WeakMap(), C = r$3.createTreeWalker(r$3, 129);
+function P(t2, i3) {
+  if (!a(t2) || !t2.hasOwnProperty("raw"))
+    throw Error("invalid template strings array");
+  return void 0 !== s$2 ? s$2.createHTML(i3) : i3;
+}
+const V = (t2, i3) => {
+  const s2 = t2.length - 1, o2 = [];
+  let r2, l2 = 2 === i3 ? "<svg>" : 3 === i3 ? "<math>" : "", c2 = f$2;
+  for (let i4 = 0; i4 < s2; i4++) {
+    const s3 = t2[i4];
+    let a2, u2, d2 = -1, y3 = 0;
+    for (; y3 < s3.length && (c2.lastIndex = y3, u2 = c2.exec(s3), null !== u2); )
+      y3 = c2.lastIndex, c2 === f$2 ? "!--" === u2[1] ? c2 = v : void 0 !== u2[1] ? c2 = _ : void 0 !== u2[2] ? ($.test(u2[2]) && (r2 = RegExp("</" + u2[2], "g")), c2 = m) : void 0 !== u2[3] && (c2 = m) : c2 === m ? ">" === u2[0] ? (c2 = r2 ?? f$2, d2 = -1) : void 0 === u2[1] ? d2 = -2 : (d2 = c2.lastIndex - u2[2].length, a2 = u2[1], c2 = void 0 === u2[3] ? m : '"' === u2[3] ? g : p) : c2 === g || c2 === p ? c2 = m : c2 === v || c2 === _ ? c2 = f$2 : (c2 = m, r2 = void 0);
+    const x2 = c2 === m && t2[i4 + 1].startsWith("/>") ? " " : "";
+    l2 += c2 === f$2 ? s3 + n$3 : d2 >= 0 ? (o2.push(a2), s3.slice(0, d2) + e$2 + s3.slice(d2) + h$2 + x2) : s3 + h$2 + (-2 === d2 ? i4 : x2);
+  }
+  return [P(t2, l2 + (t2[s2] || "<?>") + (2 === i3 ? "</svg>" : 3 === i3 ? "</math>" : "")), o2];
+};
+class N {
+  constructor({ strings: t2, _$litType$: s2 }, n3) {
+    let r2;
+    this.parts = [];
+    let c2 = 0, a2 = 0;
+    const u2 = t2.length - 1, d2 = this.parts, [f2, v2] = V(t2, s2);
+    if (this.el = N.createElement(f2, n3), C.currentNode = this.el.content, 2 === s2 || 3 === s2) {
+      const t3 = this.el.content.firstChild;
+      t3.replaceWith(...t3.childNodes);
+    }
+    for (; null !== (r2 = C.nextNode()) && d2.length < u2; ) {
+      if (1 === r2.nodeType) {
+        if (r2.hasAttributes())
+          for (const t3 of r2.getAttributeNames())
+            if (t3.endsWith(e$2)) {
+              const i3 = v2[a2++], s3 = r2.getAttribute(t3).split(h$2), e2 = /([.?@])?(.*)/.exec(i3);
+              d2.push({ type: 1, index: c2, name: e2[2], strings: s3, ctor: "." === e2[1] ? H : "?" === e2[1] ? I2 : "@" === e2[1] ? L : k }), r2.removeAttribute(t3);
+            } else
+              t3.startsWith(h$2) && (d2.push({ type: 6, index: c2 }), r2.removeAttribute(t3));
+        if ($.test(r2.tagName)) {
+          const t3 = r2.textContent.split(h$2), s3 = t3.length - 1;
+          if (s3 > 0) {
+            r2.textContent = i$2 ? i$2.emptyScript : "";
+            for (let i3 = 0; i3 < s3; i3++)
+              r2.append(t3[i3], l()), C.nextNode(), d2.push({ type: 2, index: ++c2 });
+            r2.append(t3[s3], l());
+          }
+        }
+      } else if (8 === r2.nodeType)
+        if (r2.data === o$4)
+          d2.push({ type: 2, index: c2 });
+        else {
+          let t3 = -1;
+          for (; -1 !== (t3 = r2.data.indexOf(h$2, t3 + 1)); )
+            d2.push({ type: 7, index: c2 }), t3 += h$2.length - 1;
+        }
+      c2++;
+    }
+  }
+  static createElement(t2, i3) {
+    const s2 = r$3.createElement("template");
+    return s2.innerHTML = t2, s2;
+  }
+}
+function S(t2, i3, s2 = t2, e2) {
+  if (i3 === T)
+    return i3;
+  let h2 = void 0 !== e2 ? s2._$Co?.[e2] : s2._$Cl;
+  const o2 = c$1(i3) ? void 0 : i3._$litDirective$;
+  return h2?.constructor !== o2 && (h2?._$AO?.(false), void 0 === o2 ? h2 = void 0 : (h2 = new o2(t2), h2._$AT(t2, s2, e2)), void 0 !== e2 ? (s2._$Co ?? (s2._$Co = []))[e2] = h2 : s2._$Cl = h2), void 0 !== h2 && (i3 = S(t2, h2._$AS(t2, i3.values), h2, e2)), i3;
+}
+class M {
+  constructor(t2, i3) {
+    this._$AV = [], this._$AN = void 0, this._$AD = t2, this._$AM = i3;
+  }
+  get parentNode() {
+    return this._$AM.parentNode;
+  }
+  get _$AU() {
+    return this._$AM._$AU;
+  }
+  u(t2) {
+    const { el: { content: i3 }, parts: s2 } = this._$AD, e2 = (t2?.creationScope ?? r$3).importNode(i3, true);
+    C.currentNode = e2;
+    let h2 = C.nextNode(), o2 = 0, n3 = 0, l2 = s2[0];
+    for (; void 0 !== l2; ) {
+      if (o2 === l2.index) {
+        let i4;
+        2 === l2.type ? i4 = new R(h2, h2.nextSibling, this, t2) : 1 === l2.type ? i4 = new l2.ctor(h2, l2.name, l2.strings, this, t2) : 6 === l2.type && (i4 = new z(h2, this, t2)), this._$AV.push(i4), l2 = s2[++n3];
+      }
+      o2 !== l2?.index && (h2 = C.nextNode(), o2++);
+    }
+    return C.currentNode = r$3, e2;
+  }
+  p(t2) {
+    let i3 = 0;
+    for (const s2 of this._$AV)
+      void 0 !== s2 && (void 0 !== s2.strings ? (s2._$AI(t2, s2, i3), i3 += s2.strings.length - 2) : s2._$AI(t2[i3])), i3++;
+  }
+}
+class R {
+  get _$AU() {
+    return this._$AM?._$AU ?? this._$Cv;
+  }
+  constructor(t2, i3, s2, e2) {
+    this.type = 2, this._$AH = E, this._$AN = void 0, this._$AA = t2, this._$AB = i3, this._$AM = s2, this.options = e2, this._$Cv = e2?.isConnected ?? true;
+  }
+  get parentNode() {
+    let t2 = this._$AA.parentNode;
+    const i3 = this._$AM;
+    return void 0 !== i3 && 11 === t2?.nodeType && (t2 = i3.parentNode), t2;
+  }
+  get startNode() {
+    return this._$AA;
+  }
+  get endNode() {
+    return this._$AB;
+  }
+  _$AI(t2, i3 = this) {
+    t2 = S(this, t2, i3), c$1(t2) ? t2 === E || null == t2 || "" === t2 ? (this._$AH !== E && this._$AR(), this._$AH = E) : t2 !== this._$AH && t2 !== T && this._(t2) : void 0 !== t2._$litType$ ? this.$(t2) : void 0 !== t2.nodeType ? this.T(t2) : u(t2) ? this.k(t2) : this._(t2);
+  }
+  O(t2) {
+    return this._$AA.parentNode.insertBefore(t2, this._$AB);
+  }
+  T(t2) {
+    this._$AH !== t2 && (this._$AR(), this._$AH = this.O(t2));
+  }
+  _(t2) {
+    this._$AH !== E && c$1(this._$AH) ? this._$AA.nextSibling.data = t2 : this.T(r$3.createTextNode(t2)), this._$AH = t2;
+  }
+  $(t2) {
+    const { values: i3, _$litType$: s2 } = t2, e2 = "number" == typeof s2 ? this._$AC(t2) : (void 0 === s2.el && (s2.el = N.createElement(P(s2.h, s2.h[0]), this.options)), s2);
+    if (this._$AH?._$AD === e2)
+      this._$AH.p(i3);
+    else {
+      const t3 = new M(e2, this), s3 = t3.u(this.options);
+      t3.p(i3), this.T(s3), this._$AH = t3;
+    }
+  }
+  _$AC(t2) {
+    let i3 = A.get(t2.strings);
+    return void 0 === i3 && A.set(t2.strings, i3 = new N(t2)), i3;
+  }
+  k(t2) {
+    a(this._$AH) || (this._$AH = [], this._$AR());
+    const i3 = this._$AH;
+    let s2, e2 = 0;
+    for (const h2 of t2)
+      e2 === i3.length ? i3.push(s2 = new R(this.O(l()), this.O(l()), this, this.options)) : s2 = i3[e2], s2._$AI(h2), e2++;
+    e2 < i3.length && (this._$AR(s2 && s2._$AB.nextSibling, e2), i3.length = e2);
+  }
+  _$AR(t2 = this._$AA.nextSibling, i3) {
+    for (this._$AP?.(false, true, i3); t2 && t2 !== this._$AB; ) {
+      const i4 = t2.nextSibling;
+      t2.remove(), t2 = i4;
+    }
+  }
+  setConnected(t2) {
+    void 0 === this._$AM && (this._$Cv = t2, this._$AP?.(t2));
+  }
+}
+class k {
+  get tagName() {
+    return this.element.tagName;
+  }
+  get _$AU() {
+    return this._$AM._$AU;
+  }
+  constructor(t2, i3, s2, e2, h2) {
+    this.type = 1, this._$AH = E, this._$AN = void 0, this.element = t2, this.name = i3, this._$AM = e2, this.options = h2, s2.length > 2 || "" !== s2[0] || "" !== s2[1] ? (this._$AH = Array(s2.length - 1).fill(new String()), this.strings = s2) : this._$AH = E;
+  }
+  _$AI(t2, i3 = this, s2, e2) {
+    const h2 = this.strings;
+    let o2 = false;
+    if (void 0 === h2)
+      t2 = S(this, t2, i3, 0), o2 = !c$1(t2) || t2 !== this._$AH && t2 !== T, o2 && (this._$AH = t2);
+    else {
+      const e3 = t2;
+      let n3, r2;
+      for (t2 = h2[0], n3 = 0; n3 < h2.length - 1; n3++)
+        r2 = S(this, e3[s2 + n3], i3, n3), r2 === T && (r2 = this._$AH[n3]), o2 || (o2 = !c$1(r2) || r2 !== this._$AH[n3]), r2 === E ? t2 = E : t2 !== E && (t2 += (r2 ?? "") + h2[n3 + 1]), this._$AH[n3] = r2;
+    }
+    o2 && !e2 && this.j(t2);
+  }
+  j(t2) {
+    t2 === E ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, t2 ?? "");
+  }
+}
+class H extends k {
+  constructor() {
+    super(...arguments), this.type = 3;
+  }
+  j(t2) {
+    this.element[this.name] = t2 === E ? void 0 : t2;
+  }
+}
+class I2 extends k {
+  constructor() {
+    super(...arguments), this.type = 4;
+  }
+  j(t2) {
+    this.element.toggleAttribute(this.name, !!t2 && t2 !== E);
+  }
+}
+class L extends k {
+  constructor(t2, i3, s2, e2, h2) {
+    super(t2, i3, s2, e2, h2), this.type = 5;
+  }
+  _$AI(t2, i3 = this) {
+    if ((t2 = S(this, t2, i3, 0) ?? E) === T)
+      return;
+    const s2 = this._$AH, e2 = t2 === E && s2 !== E || t2.capture !== s2.capture || t2.once !== s2.once || t2.passive !== s2.passive, h2 = t2 !== E && (s2 === E || e2);
+    e2 && this.element.removeEventListener(this.name, this, s2), h2 && this.element.addEventListener(this.name, this, t2), this._$AH = t2;
+  }
+  handleEvent(t2) {
+    "function" == typeof this._$AH ? this._$AH.call(this.options?.host ?? this.element, t2) : this._$AH.handleEvent(t2);
+  }
+}
+class z {
+  constructor(t2, i3, s2) {
+    this.element = t2, this.type = 6, this._$AN = void 0, this._$AM = i3, this.options = s2;
+  }
+  get _$AU() {
+    return this._$AM._$AU;
+  }
+  _$AI(t2) {
+    S(this, t2);
+  }
+}
+const j = t$1.litHtmlPolyfillSupport;
+j?.(N, R), (t$1.litHtmlVersions ?? (t$1.litHtmlVersions = [])).push("3.3.0");
+const B = (t2, i3, s2) => {
+  const e2 = s2?.renderBefore ?? i3;
+  let h2 = e2._$litPart$;
+  if (void 0 === h2) {
+    const t3 = s2?.renderBefore ?? null;
+    e2._$litPart$ = h2 = new R(i3.insertBefore(l(), t3), t3, void 0, s2 ?? {});
+  }
+  return h2._$AI(t2), h2;
+};
+const s$1 = globalThis;
+let i$1 = class i extends y$1 {
+  constructor() {
+    super(...arguments), this.renderOptions = { host: this }, this._$Do = void 0;
+  }
+  createRenderRoot() {
+    var _a;
+    const t2 = super.createRenderRoot();
+    return (_a = this.renderOptions).renderBefore ?? (_a.renderBefore = t2.firstChild), t2;
+  }
+  update(t2) {
+    const r2 = this.render();
+    this.hasUpdated || (this.renderOptions.isConnected = this.isConnected), super.update(t2), this._$Do = B(r2, this.renderRoot, this.renderOptions);
+  }
+  connectedCallback() {
+    super.connectedCallback(), this._$Do?.setConnected(true);
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback(), this._$Do?.setConnected(false);
+  }
+  render() {
+    return T;
+  }
+};
+i$1._$litElement$ = true, i$1["finalized"] = true, s$1.litElementHydrateSupport?.({ LitElement: i$1 });
+const o$3 = s$1.litElementPolyfillSupport;
+o$3?.({ LitElement: i$1 });
+(s$1.litElementVersions ?? (s$1.litElementVersions = [])).push("4.2.0");
+const o$2 = { attribute: true, type: String, converter: u$1, reflect: false, hasChanged: f$3 }, r$2 = (t2 = o$2, e2, r2) => {
+  const { kind: n3, metadata: i3 } = r2;
+  let s2 = globalThis.litPropertyMetadata.get(i3);
+  if (void 0 === s2 && globalThis.litPropertyMetadata.set(i3, s2 = /* @__PURE__ */ new Map()), "setter" === n3 && ((t2 = Object.create(t2)).wrapped = true), s2.set(r2.name, t2), "accessor" === n3) {
+    const { name: o2 } = r2;
+    return { set(r3) {
+      const n4 = e2.get.call(this);
+      e2.set.call(this, r3), this.requestUpdate(o2, n4, t2);
+    }, init(e3) {
+      return void 0 !== e3 && this.C(o2, void 0, t2, e3), e3;
+    } };
+  }
+  if ("setter" === n3) {
+    const { name: o2 } = r2;
+    return function(r3) {
+      const n4 = this[o2];
+      e2.call(this, r3), this.requestUpdate(o2, n4, t2);
+    };
+  }
+  throw Error("Unsupported decorator location: " + n3);
+};
+function n$2(t2) {
+  return (e2, o2) => "object" == typeof o2 ? r$2(t2, e2, o2) : ((t3, e3, o3) => {
+    const r2 = e3.hasOwnProperty(o3);
+    return e3.constructor.createProperty(o3, t3), r2 ? Object.getOwnPropertyDescriptor(e3, o3) : void 0;
+  })(t2, e2, o2);
+}
+function r$1(r2) {
+  return n$2({ ...r2, state: true, attribute: false });
+}
+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 i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
+    if (decorator = decorators[i3])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result)
+    __defProp$6(target, key, result);
+  return result;
+};
+class NavIcon extends i$1 {
+  constructor() {
+    super(...arguments);
+    this.id = "";
+    this.isActive = false;
+    this.isSpecial = false;
+  }
+  handleClick(e2) {
+    e2.preventDefault();
+    e2.stopPropagation();
+    const event = new CustomEvent("click", {
+      detail: {
+        id: this.id,
+        isActive: !this.isActive
+      },
+      bubbles: true,
+      composed: true
+    });
+    this.dispatchEvent(event);
+    if (this.onClick) {
+      this.onClick(this.id, !this.isActive);
+    }
+  }
+  render() {
+    return x`
+      <button
+        id="obi-nav-${this.id}"
+        class=${this.isSpecial ? "special" : ""}
+        ?active=${this.isActive}
+        @click=${this.handleClick}
+        aria-label="${this.id} control"
+      >
+        <slot></slot>
+      </button>
+    `;
+  }
+}
+NavIcon.styles = i$4`
+    :host {
+      display: block;
+    }
+
+    button {
+      display: flex;
+      height: 40px;
+      width: 40px;
+      align-items: center;
+      justify-content: center;
+      border-radius: 2px;
+      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+      transition: all 0.2s;
+      cursor: pointer;
+      margin: 4px 0;
+      padding: 0;
+      border: none;
+      color: black;
+    }
+
+    button.special {
+      color: #fff;
+      background-color: #000;
+    }
+
+    button.special svg {
+      stroke: #fff;
+    }
+
+    button.special.active {
+      background-color: black;
+      color: white;
+    }
+
+    button.special.active:hover {
+      background-color: #27272a;
+    }
+
+    button:not(.special) {
+      background-color: white;
+      color: black;
+    }
+
+    button:not(.special):hover {
+      background-color: #e5e5e5;
+    }
+
+    ::slotted(*) {
+      width: 18px;
+      height: 18px;
+    }
+  `;
+__decorateClass$6([
+  n$2({ type: String })
+], NavIcon.prototype, "id", 2);
+__decorateClass$6([
+  n$2({ type: Boolean })
+], NavIcon.prototype, "isActive", 2);
+__decorateClass$6([
+  n$2({ type: Boolean })
+], NavIcon.prototype, "isSpecial", 2);
+__decorateClass$6([
+  n$2({ type: Function })
+], NavIcon.prototype, "onClick", 2);
+if (!customElements.get("obi-nav-icon")) {
+  customElements.define("obi-nav-icon", NavIcon);
+}
+const navIcon = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  NavIcon
+}, Symbol.toStringTag, { value: "Module" }));
+const svgWrapper = (content) => x`
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    width="24"
+    height="24"
+    viewBox="0 0 24 24"
+    fill="none"
+    stroke="currentColor"
+    stroke-width="2"
+    stroke-linecap="round"
+    stroke-linejoin="round"
+    class="lucide"
+    style="display: block;"
+  >
+    ${content}
+  </svg>
+`;
+const pauseIcon = svgWrapper(b`
+  <rect x="14" y="4" width="4" height="16" rx="1"/><rect x="6" y="4" width="4" height="16" rx="1"/>
+`);
+const playIcon = svgWrapper(b`<polygon points="6 3 20 12 6 21 6 3"/>`);
+const powerIcon = svgWrapper(b`
+  <path d="M12 2v10"/><path d="M18.4 6.6a9 9 0 1 1-12.77.04"/>
+`);
+const closeIcon = svgWrapper(b`
+  <path d="M18 6 6 18"/><path d="m6 6 12 12"/>
+`);
+const bookOpenIcon = svgWrapper(b`
+  <path d="M12 7v14" />
+  <path
+    d="M3 18a1 1 0 0 1-1-1V4a1 1 0 0 1 1-1h5a4 4 0 0 1 4 4 4 4 0 0 1 4-4h5a1 1 0 0 1 1 1v13a1 1 0 0 1-1 1h-6a3 3 0 0 0-3 3 3 3 0 0 0-3-3z"
+  />
+`);
+const obiIcon = x`
+  <img
+    class="widget-icon"
+    src="data:image/svg+xml;base64,${btoa(`<?xml version="1.0" encoding="UTF-8"?>
+            <svg width="32" height="32" viewBox="0 0 32 34" fill="none" xmlns="http://www.w3.org/2000/svg">
+              <g id="obi-icon">
+                <g id="Subtract">
+                  <path d="M15.5845 9.29177L8.20527 5.00637L8.20527 13.4502L15.5845 17.7356L15.5845 9.29177Z" fill="white" />
+                  <path d="M15.5896 27.7146L8.21035 31.9994L8.21032 23.4698L15.5896 19.1843L15.5896 27.7146Z" fill="white" />
+                  <path d="M16.4104 27.7146L16.4104 19.1786L23.7897 23.4641L23.7897 32L16.4104 27.7146Z" fill="white" />
+                  <path d="M32 27.7142L24.6207 31.9996L24.6207 23.47L32 19.1846L32 27.7142Z" fill="white" />
+                  <path d="M24.2048 22.748L31.5911 18.4585L24.2845 14.2154L16.8983 18.5048L24.2048 22.748Z" fill="white" />
+                  <path d="M23.7948 5.01235L23.7948 13.4564L16.4156 17.7418L16.4156 9.29775L23.7948 5.01235Z" fill="white" />
+                  <path d="M16.0052 0L23.3865 4.2866L16.0003 8.57606L8.61897 4.28946L16.0052 0Z" fill="white" />
+                  <path d="M7.72042 14.2182L15.1017 18.5048L7.79445 22.7477L0.413699 18.4615L7.72042 14.2182Z" fill="white" />
+                  <path d="M7.37926 31.9997L7.37926 23.4638L0 19.1784L3.79636e-05 27.7143L7.37926 31.9997Z" fill="white" />
+                </g>
+              </g>
+            </svg>`)}"
+    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;
+  for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
+    if (decorator = decorators[i3])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result)
+    __defProp$5(target, key, result);
+  return result;
+};
+class NavigationBar extends i$1 {
+  constructor() {
+    super();
+    this.isActive = false;
+    this.isScreenActive = false;
+    this.position = { top: 0, left: 0 };
+    this.currentState = SDKState.READY;
+    this.direction = "up";
+  }
+  connectedCallback() {
+    super.connectedCallback();
+  }
+  handleIconClick(id, isActive) {
+    if (this.onItemSelect) {
+      this.onItemSelect(id, isActive);
+    }
+  }
+  render() {
+    return x`
+      ${this.isActive ? x`
+            <obi-nav-icon
+              id="pause"
+              ?isActive=${this.currentState === SDKState.PAUSED}
+              @click=${() => this.handleIconClick("pause", this.currentState === SDKState.PAUSED ? false : true)}
+            >
+              ${this.currentState === SDKState.PAUSED ? playIcon : pauseIcon}
+            </obi-nav-icon>
+            <obi-nav-icon
+              id="activate"
+              ?isActive=${this.isActive}
+              ?isSpecial=${true}
+              @click=${() => this.handleIconClick("activate", this.isActive ? false : true)}
+            >
+              ${this.isActive ? closeIcon : powerIcon}
+            </obi-nav-icon>
+          ` : x`
+            <obi-nav-icon
+              id="experiences"
+              @click=${() => this.handleIconClick("experiences", true)}
+            >
+              ${bookOpenIcon}
+            </obi-nav-icon>
+          `}
+    `;
+  }
+}
+NavigationBar.styles = i$4`
+    :host {
+      display: flex;
+      position: absolute;
+      z-index: 10000;
+      width: 40px;
+      transition: all 0.2s ease-in-out;
+      opacity: 1;
+      transform: scale(1);
+      pointer-events: auto;
+      background-color: #fff;
+    }
+
+    :host([data-direction="up"]) {
+      bottom: 64px;
+      top: auto;
+      flex-direction: column-reverse;
+    }
+
+    :host([data-direction="down"]) {
+      top: 64px;
+      bottom: auto;
+      flex-direction: column;
+    }
+  `;
+__decorateClass$5([
+  n$2({ type: Boolean })
+], NavigationBar.prototype, "isActive", 2);
+__decorateClass$5([
+  n$2({ type: Boolean })
+], NavigationBar.prototype, "isScreenActive", 2);
+__decorateClass$5([
+  n$2({ type: Object })
+], NavigationBar.prototype, "position", 2);
+__decorateClass$5([
+  n$2({ type: String })
+], NavigationBar.prototype, "currentState", 2);
+__decorateClass$5([
+  n$2({ type: String })
+], NavigationBar.prototype, "direction", 2);
+__decorateClass$5([
+  n$2({ type: Function })
+], NavigationBar.prototype, "onItemSelect", 2);
+if (!customElements.get("obi-navigation-bar")) {
+  customElements.define("obi-navigation-bar", NavigationBar);
+}
+const navigationBar = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  NavigationBar
+}, Symbol.toStringTag, { value: "Module" }));
+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 i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
+    if (decorator = decorators[i3])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result)
+    __defProp$4(target, key, result);
+  return result;
+};
+class Course extends i$1 {
+  constructor() {
+    super(...arguments);
+    this.id = "";
+    this.name = "";
+    this.description = "";
+    this.imageSrc = "";
+  }
+  handleClick() {
+    if (this.onSelect) {
+      this.onSelect(this.id);
+    }
+    this.dispatchEvent(
+      new CustomEvent("course-select", {
+        detail: { id: this.id },
+        bubbles: true,
+        composed: true
+      })
+    );
+  }
+  render() {
+    return x`
+      <div class="course-container" @click=${this.handleClick}>
+        <img src=${this.imageSrc} alt="Course Preview" class="course-image" />
+        <h2 class="course-title">${this.name}</h2>
+        ${this.description ? x`<p class="course-description">${this.description}</p>` : ""}
+      </div>
+    `;
+  }
+}
+Course.styles = i$4`
+    :host {
+      display: block;
+    }
+
+    .course-container {
+      padding: 16px 12px;
+      gap: 12px;
+      border-radius: 4px;
+      border: 1px solid #e5e7eb;
+      cursor: pointer;
+      transition: all 0.2s;
+    }
+
+    .course-container:hover {
+      background-color: #f9fafb;
+      border-color: #d1d5db;
+      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
+    }
+
+    .course-container:active {
+      transform: scale(0.98);
+    }
+
+    .course-image {
+      max-height: 160px;
+      border-radius: 2px;
+      border: 1px solid #e5e7eb;
+      object-fit: cover;
+      width: 100%;
+      margin-bottom: 12px;
+    }
+
+    .course-title {
+      font-size: 14px;
+      font-weight: bold;
+      margin: 0;
+      margin-bottom: 12px;
+    }
+
+    .course-description {
+      font-size: 14px;
+      color: #71717a;
+      margin: 0;
+    }
+  `;
+__decorateClass$4([
+  n$2({ type: String })
+], Course.prototype, "id", 2);
+__decorateClass$4([
+  n$2({ type: String })
+], Course.prototype, "name", 2);
+__decorateClass$4([
+  n$2({ type: String })
+], Course.prototype, "description", 2);
+__decorateClass$4([
+  n$2({ type: String })
+], Course.prototype, "imageSrc", 2);
+__decorateClass$4([
+  n$2({ type: Function })
+], Course.prototype, "onSelect", 2);
+class CourseList extends i$1 {
+  constructor() {
+    super(...arguments);
+    this.courses = [];
+    this.loading = false;
+    this.error = "";
+  }
+  handleCourseSelect(e2) {
+    if (this.onCourseSelect) {
+      this.onCourseSelect(e2.detail.id);
+    }
+  }
+  render() {
+    if (this.loading) {
+      return x`<div class="loading">Loading...</div>`;
+    }
+    if (this.error) {
+      return x`<div class="error">${this.error}</div>`;
+    }
+    if (!this.courses || this.courses.length === 0) {
+      return x`<div class="empty">No courses available</div>`;
+    }
+    const gridClass = this.courses.length === 1 ? "grid-cols-1" : this.courses.length === 2 ? "grid-cols-2" : "grid-cols-3";
+    return x`
+      <div class="course-grid ${gridClass}">
+        ${this.courses.map(
+      (course) => x`
+            <obi-course
+              id=${course.id}
+              name=${course.name}
+              description=${course.description || ""}
+              imageSrc=${course.imageSrc}
+              @course-select=${this.handleCourseSelect}
+            ></obi-course>
+          `
+    )}
+      </div>
+    `;
+  }
+}
+CourseList.styles = i$4`
+    :host {
+      display: block;
+    }
+
+    .course-grid {
+      display: grid;
+      gap: 12px;
+      margin-top: 24px;
+    }
+
+    .course-grid.grid-cols-1 {
+      grid-template-columns: 1fr;
+    }
+
+    .course-grid.grid-cols-2 {
+      grid-template-columns: 1fr 1fr;
+    }
+
+    .course-grid.grid-cols-3 {
+      grid-template-columns: 1fr 1fr 1fr;
+    }
+
+    .loading,
+    .error,
+    .empty {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      margin-top: 16px;
+    }
+
+    .error {
+      color: #ef4444;
+    }
+  `;
+__decorateClass$4([
+  n$2({ type: Array })
+], CourseList.prototype, "courses", 2);
+__decorateClass$4([
+  n$2({ type: Boolean })
+], CourseList.prototype, "loading", 2);
+__decorateClass$4([
+  n$2({ type: String })
+], CourseList.prototype, "error", 2);
+__decorateClass$4([
+  n$2({ 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);
+}
+const courses = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  Course,
+  CourseList
+}, Symbol.toStringTag, { value: "Module" }));
+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 i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
+    if (decorator = decorators[i3])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result)
+    __defProp$3(target, key, result);
+  return result;
+};
+class CourseModal extends i$1 {
+  constructor() {
+    super(...arguments);
+    this.courses = [];
+    this.loading = true;
+    this.error = "";
+    this.apiBaseUrl = "";
+    this.apiKey = "";
+  }
+  handleCourseSelect(e2) {
+    if (this.onCourseSelect) {
+      this.onCourseSelect(e2.detail.id);
+    }
+  }
+  handleClose() {
+    if (this.onClose) {
+      this.onClose();
+    }
+  }
+  async fetchCourses() {
+    try {
+      this.loading = true;
+      const raw_response = await fetch(`${this.apiBaseUrl}/sessions?token=${this.apiKey}`);
+      const response = await raw_response.json();
+      const mappedCourses = response.map((session) => ({
+        id: session.uuid,
+        name: session.onboarding_plan.name,
+        description: session.onboarding_plan.description,
+        imageSrc: session.onboarding_plan.screen_url || "https://corproductionsydney-storagebucket5cb7c8ea-atg4gmftc6sk.s3.amazonaws.com/static/generic-course.png"
+      }));
+      const filteredCourses = mappedCourses.filter((course) => !!course.name);
+      this.courses = [...filteredCourses];
+      this.requestUpdate();
+    } catch (err) {
+      console.error("Fetch error:", err);
+      this.error = "Failed to fetch courses";
+    } finally {
+      this.loading = false;
+      this.requestUpdate();
+    }
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    if (window.obiWidgetConfig?.apiKey) {
+      this.apiKey = window.obiWidgetConfig.apiKey;
+    }
+    this.apiBaseUrl = API_BASE_URL;
+    if (this.apiBaseUrl && this.apiKey) {
+      this.fetchCourses();
+    } else {
+      this.loading = false;
+      this.error = "API base URL or API key is missing";
+    }
+  }
+  render() {
+    return x`
+      <div class="backdrop" @click=${this.handleClose}></div>
+      <div class="container">
+        <button class="close-button" @click=${this.handleClose}>×</button>
+        <div class="header">
+          <h1>Give Obi a try!</h1>
+          <p class="subtitle">Pick a tour, share your screen, and Obi will take it from there.</p>
+        </div>
+
+        <obi-course-list
+          .courses=${this.courses}
+          .loading=${this.loading}
+          .error=${this.error}
+          @course-select=${this.handleCourseSelect}
+        ></obi-course-list>
+      </div>
+    `;
+  }
+}
+CourseModal.styles = i$4`
+    :host {
+      display: block;
+      font-family: "Syne", sans-serif;
+    }
+
+    .backdrop {
+      position: fixed;
+      top: 0;
+      right: 0;
+      bottom: 0;
+      left: 0;
+      background-color: black;
+      opacity: 0.7;
+      z-index: 40;
+    }
+
+    .container {
+      position: fixed;
+      background-color: white;
+      color: black;
+      border: 1px solid #e5e7eb;
+      width: 640px;
+      max-height: 80vh;
+      overflow-y: auto;
+      padding: 48px;
+      gap: 12px;
+      top: 50%;
+      left: 50%;
+      transform: translate(-50%, -50%);
+      border-radius: 4px;
+      z-index: 50;
+      display: flex;
+      flex-direction: column;
+      text-align: center;
+    }
+
+    .container:hover {
+      cursor: auto;
+    }
+
+    .container::-webkit-scrollbar {
+      width: 0.5rem;
+    }
+
+    .container::-webkit-scrollbar-track {
+      background-color: #f3f4f6;
+      border-radius: 9999px;
+    }
+
+    .container::-webkit-scrollbar-thumb {
+      background-color: #d1d5db;
+      border-radius: 9999px;
+    }
+
+    .header {
+      margin-bottom: 24px;
+      text-align: center;
+    }
+
+    h1 {
+      font-size: 32px;
+      font-weight: 700;
+      margin: 0;
+      margin-bottom: 8px;
+    }
+
+    .subtitle {
+      font-size: 20px;
+      color: rgb(113 113 122 / 1);
+      margin: 0;
+    }
+
+    .close-button {
+      position: absolute;
+      top: 16px;
+      right: 16px;
+      background: none;
+      border: none;
+      cursor: pointer;
+      font-size: 24px;
+      color: #6b7280;
+    }
+  `;
+__decorateClass$3([
+  n$2({ type: Array })
+], CourseModal.prototype, "courses", 2);
+__decorateClass$3([
+  n$2({ type: Boolean })
+], CourseModal.prototype, "loading", 2);
+__decorateClass$3([
+  n$2({ type: String })
+], CourseModal.prototype, "error", 2);
+__decorateClass$3([
+  n$2({ type: String })
+], CourseModal.prototype, "apiBaseUrl", 2);
+__decorateClass$3([
+  n$2({ type: String })
+], CourseModal.prototype, "apiKey", 2);
+__decorateClass$3([
+  n$2({ type: Function })
+], CourseModal.prototype, "onCourseSelect", 2);
+__decorateClass$3([
+  n$2({ type: Function })
+], CourseModal.prototype, "onClose", 2);
+if (!customElements.get("obi-course-modal")) {
+  customElements.define("obi-course-modal", CourseModal);
+}
+const courseModal = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  CourseModal
+}, Symbol.toStringTag, { value: "Module" }));
+const f$1 = (o2) => void 0 === o2.strings;
+const t = { ATTRIBUTE: 1, CHILD: 2, PROPERTY: 3, BOOLEAN_ATTRIBUTE: 4, EVENT: 5, ELEMENT: 6 }, e$1 = (t2) => (...e2) => ({ _$litDirective$: t2, values: e2 });
+class i2 {
+  constructor(t2) {
+  }
+  get _$AU() {
+    return this._$AM._$AU;
+  }
+  _$AT(t2, e2, i3) {
+    this._$Ct = t2, this._$AM = e2, this._$Ci = i3;
+  }
+  _$AS(t2, e2) {
+    return this.update(t2, e2);
+  }
+  update(t2, e2) {
+    return this.render(...e2);
+  }
+}
+const s = (i3, t2) => {
+  const e2 = i3._$AN;
+  if (void 0 === e2)
+    return false;
+  for (const i4 of e2)
+    i4._$AO?.(t2, false), s(i4, t2);
+  return true;
+}, o$1 = (i3) => {
+  let t2, e2;
+  do {
+    if (void 0 === (t2 = i3._$AM))
+      break;
+    e2 = t2._$AN, e2.delete(i3), i3 = t2;
+  } while (0 === e2?.size);
+}, r = (i3) => {
+  for (let t2; t2 = i3._$AM; i3 = t2) {
+    let e2 = t2._$AN;
+    if (void 0 === e2)
+      t2._$AN = e2 = /* @__PURE__ */ new Set();
+    else if (e2.has(i3))
+      break;
+    e2.add(i3), c(t2);
+  }
+};
+function h$1(i3) {
+  void 0 !== this._$AN ? (o$1(this), this._$AM = i3, r(this)) : this._$AM = i3;
+}
+function n$1(i3, t2 = false, e2 = 0) {
+  const r2 = this._$AH, h2 = this._$AN;
+  if (void 0 !== h2 && 0 !== h2.size)
+    if (t2)
+      if (Array.isArray(r2))
+        for (let i4 = e2; i4 < r2.length; i4++)
+          s(r2[i4], false), o$1(r2[i4]);
+      else
+        null != r2 && (s(r2, false), o$1(r2));
+    else
+      s(this, i3);
+}
+const c = (i3) => {
+  i3.type == t.CHILD && (i3._$AP ?? (i3._$AP = n$1), i3._$AQ ?? (i3._$AQ = h$1));
+};
+class f extends i2 {
+  constructor() {
+    super(...arguments), this._$AN = void 0;
+  }
+  _$AT(i3, t2, e2) {
+    super._$AT(i3, t2, e2), r(this), this.isConnected = i3._$AU;
+  }
+  _$AO(i3, t2 = true) {
+    i3 !== this.isConnected && (this.isConnected = i3, i3 ? this.reconnected?.() : this.disconnected?.()), t2 && (s(this, i3), o$1(this));
+  }
+  setValue(t2) {
+    if (f$1(this._$Ct))
+      this._$Ct._$AI(t2, this);
+    else {
+      const i3 = [...this._$Ct._$AH];
+      i3[this._$Ci] = t2, this._$Ct._$AI(i3, this, 0);
+    }
+  }
+  disconnected() {
+  }
+  reconnected() {
+  }
+}
+const e = () => new h();
+class h {
+}
+const o = /* @__PURE__ */ new WeakMap(), n2 = e$1(class extends f {
+  render(i3) {
+    return E;
+  }
+  update(i3, [s2]) {
+    const e2 = s2 !== this.G;
+    return e2 && void 0 !== this.G && this.rt(void 0), (e2 || this.lt !== this.ct) && (this.G = s2, this.ht = i3.options?.host, this.rt(this.ct = i3.element)), E;
+  }
+  rt(t2) {
+    if (this.isConnected || (t2 = void 0), "function" == typeof this.G) {
+      const i3 = this.ht ?? globalThis;
+      let s2 = o.get(i3);
+      void 0 === s2 && (s2 = /* @__PURE__ */ new WeakMap(), o.set(i3, s2)), void 0 !== s2.get(this.G) && this.G.call(this.ht, void 0), s2.set(this.G, t2), void 0 !== t2 && this.G.call(this.ht, t2);
+    } else
+      this.G.value = t2;
+  }
+  get lt() {
+    return "function" == typeof this.G ? o.get(this.ht ?? globalThis)?.get(this.G) : this.G?.value;
+  }
+  disconnected() {
+    this.lt === this.ct && this.rt(void 0);
+  }
+  reconnected() {
+    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;
+  for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
+    if (decorator = decorators[i3])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result)
+    __defProp$2(target, key, result);
+  return result;
+};
+class AudioEqualizer extends i$1 {
+  constructor() {
+    super(...arguments);
+    this.volume = { speaker: "ASSISTANT", volume: 0, spectrum: [] };
+    this.canvasRef = e();
+    this.barCount = 8;
+    this.animationFrame = null;
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.startAnimation();
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this.stopAnimation();
+  }
+  startAnimation() {
+    const animate = () => {
+      this.drawEqualizer();
+      this.animationFrame = requestAnimationFrame(animate);
+    };
+    this.animationFrame = requestAnimationFrame(animate);
+  }
+  stopAnimation() {
+    if (this.animationFrame) {
+      cancelAnimationFrame(this.animationFrame);
+      this.animationFrame = null;
+    }
+  }
+  drawEqualizer() {
+    const canvas = this.canvasRef.value;
+    if (!canvas)
+      return;
+    const ctx = canvas.getContext("2d");
+    if (!ctx)
+      return;
+    const dpr = window.devicePixelRatio || 1;
+    const displayWidth = canvas.clientWidth;
+    const displayHeight = canvas.clientHeight;
+    canvas.width = displayWidth * dpr;
+    canvas.height = displayHeight * dpr;
+    ctx.scale(dpr, dpr);
+    ctx.clearRect(0, 0, displayWidth, displayHeight);
+    const gap = 3;
+    const barWidth = Math.max(1, (displayWidth - (this.barCount - 1) * gap) / this.barCount);
+    const barMaxHeight = displayHeight / 2;
+    const currentVolume = this.volume.speaker === "USER" ? this.volume.volume : this.volume.volume;
+    const currentSpectrum = this.volume.speaker === "USER" ? this.volume.spectrum : this.volume.spectrum;
+    if (currentVolume === 0)
+      return;
+    let processedSpectrum = [];
+    if (currentSpectrum && currentSpectrum.length > 0) {
+      const spectrumLength = currentSpectrum.length;
+      const regionSize = Math.ceil(spectrumLength / 10);
+      let energyByRegion = [];
+      for (let i3 = 0; i3 < 10; i3++) {
+        const start = i3 * regionSize;
+        const end = Math.min((i3 + 1) * regionSize, spectrumLength);
+        let regionEnergy = 0;
+        for (let j2 = start; j2 < end; j2++) {
+          regionEnergy += currentSpectrum[j2] || 0;
+        }
+        energyByRegion.push({ region: i3, startIdx: start, endIdx: end, energy: regionEnergy });
+      }
+      energyByRegion.sort((a2, b2) => b2.energy - a2.energy);
+      const topRegions = energyByRegion.slice(0, 3);
+      const startIdx = Math.min(...topRegions.map((r2) => r2.startIdx));
+      const endIdx = Math.max(...topRegions.map((r2) => r2.endIdx));
+      if (endIdx > startIdx) {
+        for (let i3 = 0; i3 < this.barCount; i3++) {
+          const position = startIdx + i3 / (this.barCount - 1) * (endIdx - startIdx);
+          const index = Math.min(spectrumLength - 1, Math.floor(position));
+          processedSpectrum[i3] = currentSpectrum[index] || 0;
+        }
+      } else {
+        for (let i3 = 0; i3 < this.barCount; i3++) {
+          const position = i3 / (this.barCount - 1) * (spectrumLength / 2);
+          const index = Math.min(spectrumLength - 1, Math.floor(position));
+          processedSpectrum[i3] = currentSpectrum[index] || 0;
+        }
+      }
+      const maxSpectrumValue = Math.max(...processedSpectrum, 1);
+      const amplificationFactorRoot = this.volume.speaker === "USER" ? 0.7 : 0.6;
+      processedSpectrum = processedSpectrum.map((value, index) => {
+        const relativeValue = value / maxSpectrumValue;
+        const amplificationFactor = amplificationFactorRoot + index / (this.barCount - 1) * 0.3;
+        return Math.min(1, relativeValue * amplificationFactor);
+      });
+    } else {
+      if (this.volume.speaker !== "USER") {
+        for (let i3 = 0; i3 < this.barCount; i3++) {
+          const time = Date.now() * 2e-3;
+          const value = 0.3 + 0.2 * Math.sin(time + i3 * 0.7);
+          processedSpectrum[i3] = value;
+        }
+      }
+    }
+    for (let i3 = 0; i3 < this.barCount; i3++) {
+      const spectrumValue = processedSpectrum.length > 0 ? processedSpectrum[i3] !== void 0 ? processedSpectrum[i3] : currentVolume : currentVolume;
+      if (this.volume.speaker === "USER") {
+        ctx.fillStyle = `rgba(109, 40, 217, ${spectrumValue * 0.5 + 0.5})`;
+      } else {
+        ctx.fillStyle = `rgba(255, 255, 255, ${spectrumValue * 0.5 + 0.5})`;
+      }
+      const barHeight = Math.max(2, spectrumValue * 0.8 * barMaxHeight);
+      const x2 = displayWidth - (this.barCount - i3) * (barWidth + gap);
+      const radius = barWidth / 2;
+      ctx.beginPath();
+      ctx.moveTo(x2 + radius, displayHeight / 2 - barHeight);
+      ctx.lineTo(x2 + barWidth - radius, displayHeight / 2 - barHeight);
+      ctx.quadraticCurveTo(
+        x2 + barWidth,
+        displayHeight / 2 - barHeight,
+        x2 + barWidth,
+        displayHeight / 2 - barHeight + radius
+      );
+      ctx.lineTo(x2 + barWidth, displayHeight / 2);
+      ctx.lineTo(x2, displayHeight / 2);
+      ctx.lineTo(x2, displayHeight / 2 - barHeight + radius);
+      ctx.quadraticCurveTo(
+        x2,
+        displayHeight / 2 - barHeight,
+        x2 + radius,
+        displayHeight / 2 - barHeight
+      );
+      ctx.fill();
+      ctx.beginPath();
+      ctx.moveTo(x2, displayHeight / 2);
+      ctx.lineTo(x2 + barWidth, displayHeight / 2);
+      ctx.lineTo(x2 + barWidth, displayHeight / 2 + barHeight - radius);
+      ctx.quadraticCurveTo(
+        x2 + barWidth,
+        displayHeight / 2 + barHeight,
+        x2 + barWidth - radius,
+        displayHeight / 2 + barHeight
+      );
+      ctx.lineTo(x2 + radius, displayHeight / 2 + barHeight);
+      ctx.quadraticCurveTo(
+        x2,
+        displayHeight / 2 + barHeight,
+        x2,
+        displayHeight / 2 + barHeight - radius
+      );
+      ctx.lineTo(x2, displayHeight / 2);
+      ctx.fill();
+    }
+  }
+  render() {
+    return x` <canvas ${n2(this.canvasRef)} width="52" height="52"></canvas> `;
+  }
+}
+AudioEqualizer.styles = i$4`
+    :host {
+      display: block;
+      width: 40px;
+      height: 40px;
+      margin: 4px;
+    }
+
+    canvas {
+      width: 100%;
+      height: 100%;
+    }
+  `;
+__decorateClass$2([
+  n$2({ type: Object })
+], AudioEqualizer.prototype, "volume", 2);
+__decorateClass$2([
+  r$1()
+], AudioEqualizer.prototype, "canvasRef", 2);
+if (!customElements.get("obi-audio-equalizer")) {
+  customElements.define("obi-audio-equalizer", AudioEqualizer);
+}
+const audioEqualizer = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  AudioEqualizer
+}, Symbol.toStringTag, { value: "Module" }));
+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 i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
+    if (decorator = decorators[i3])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result)
+    __defProp$1(target, key, result);
+  return result;
+};
+class DotLoader extends i$1 {
+  constructor() {
+    super(...arguments);
+    this.activeDots = Array(5).fill(false);
+    this.numDots = 5;
+    this.containerWidth = 32;
+    this.dotSize = 2;
+    this.bounceHeight = 12;
+    this.animationDuration = 200;
+    this.pauseDuration = 300;
+    this.overlapFactor = 0.7;
+    this.color = "#FFF";
+    this.timeoutIds = [];
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.startAnimation();
+    this.style.setProperty("--dot-loader-width", `${this.containerWidth}px`);
+    this.style.setProperty("--dot-size", `${this.dotSize}px`);
+    this.style.setProperty("--dot-color", this.color);
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this.stopAnimation();
+  }
+  startAnimation() {
+    this.animateSequence();
+  }
+  stopAnimation() {
+    this.timeoutIds.forEach((id) => window.clearTimeout(id));
+    this.timeoutIds = [];
+  }
+  animateSequence() {
+    this.activeDots = Array(this.numDots).fill(false);
+    for (let i3 = 0; i3 < this.numDots; i3++) {
+      const delay = i3 * (this.animationDuration * this.overlapFactor);
+      const bounceStartId = window.setTimeout(() => {
+        this.activeDots = [...this.activeDots];
+        this.activeDots[i3] = true;
+        const bounceEndId = window.setTimeout(() => {
+          this.activeDots = [...this.activeDots];
+          this.activeDots[i3] = false;
+        }, this.animationDuration);
+        this.timeoutIds.push(bounceEndId);
+      }, delay);
+      this.timeoutIds.push(bounceStartId);
+    }
+    const nextSequenceId = window.setTimeout(
+      () => {
+        this.animateSequence();
+      },
+      this.numDots * this.animationDuration * this.overlapFactor + this.pauseDuration
+    );
+    this.timeoutIds.push(nextSequenceId);
+  }
+  render() {
+    return x`
+      <div class="dot-loader">
+        ${this.activeDots.map(
+      (isActive) => x`
+            <div
+              class="dot"
+              style="transform: ${isActive ? `translateY(-${this.bounceHeight}px)` : "translateY(0)"}"
+            ></div>
+          `
+    )}
+      </div>
+    `;
+  }
+}
+DotLoader.styles = i$4`
+    :host {
+      display: block;
+    }
+
+    .dot-loader {
+      display: flex;
+      flex-direction: row;
+      width: var(--dot-loader-width, 32px);
+      height: 14px;
+      justify-content: center;
+      align-items: center;
+      padding: 0;
+      margin: 0;
+      gap: 4px;
+    }
+
+    .dot {
+      width: var(--dot-size, 2px);
+      height: var(--dot-size, 2px);
+      border-radius: 50%;
+      background-color: var(--dot-color, #fff);
+      margin: 0;
+      padding: 0;
+      transition: transform 0.2s ease-in-out;
+      opacity: 1;
+    }
+  `;
+__decorateClass$1([
+  r$1()
+], DotLoader.prototype, "activeDots", 2);
+if (!customElements.get("obi-dot-loader")) {
+  customElements.define("obi-dot-loader", DotLoader);
+}
+const dotLoader = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  DotLoader
+}, Symbol.toStringTag, { value: "Module" }));
+class SearchingLoader extends i$1 {
+  render() {
+    return x`
+      <obi-dot-loader loading style="margin-left: 2px"></obi-dot-loader>
+      <span class="text">Searching the knowledge base</span>
+    `;
+  }
+}
+SearchingLoader.styles = i$4`
+    :host {
+      display: flex;
+      align-items: center;
+      gap: 12px;
+      background-color: #7c3aed;
+      border-radius: 12px;
+      padding: 8px 12px;
+    }
+
+    .text {
+      color: white;
+      font-weight: 500;
+      font-size: 14px;
+    }
+  `;
+if (!customElements.get("obi-searching-loader")) {
+  customElements.define("obi-searching-loader", SearchingLoader);
+}
+const searchingLoader = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  SearchingLoader
+}, Symbol.toStringTag, { value: "Module" }));
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i3 = decorators.length - 1, decorator; i3 >= 0; i3--)
+    if (decorator = decorators[i3])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result)
+    __defProp(target, key, result);
+  return result;
+};
+class ObiWidget extends i$1 {
+  constructor() {
+    super();
+    this.apiBaseUrl = API_BASE_URL;
+    this.apiKey = "";
+    this.position = "bottom-right";
+    this.user = null;
+    this.state = SDKState.READY;
+    this.showCourseModal = false;
+    this.isHovering = false;
+    this.navVisible = false;
+    this.activeSession = null;
+    this.volume = {
+      speaker: "ASSISTANT",
+      volume: 0,
+      spectrum: []
+    };
+    this.closeNavTimeoutRef = null;
+    if (window.obiWidgetConfig) {
+      if (window.obiWidgetConfig.apiKey) {
+        this.apiKey = window.obiWidgetConfig.apiKey;
+      }
+      if (window.obiWidgetConfig.position) {
+        this.position = window.obiWidgetConfig.position;
+      }
+      if (window.obiWidgetConfig.user) {
+        this.user = window.obiWidgetConfig.user;
+      }
+    }
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    if (!window.obiWidgetConfig) {
+      window.obiWidgetConfig = {
+        apiKey: this.apiKey || ""
+      };
+    }
+    if (this.apiKey) {
+      window.obiWidgetConfig.apiKey = this.apiKey;
+    }
+    this.setAttribute("position", this.position);
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    if (this.closeNavTimeoutRef !== null) {
+      window.clearTimeout(this.closeNavTimeoutRef);
+    }
+    if (this.activeSession) {
+      this.activeSession.disconnect();
+      this.activeSession = null;
+    }
+  }
+  handleMouseEnter() {
+    this.isHovering = true;
+    this.navVisible = true;
+  }
+  handleMouseLeave() {
+    this.isHovering = false;
+    if (this.closeNavTimeoutRef !== null) {
+      window.clearTimeout(this.closeNavTimeoutRef);
+    }
+    this.closeNavTimeoutRef = window.setTimeout(() => {
+      if (!this.isHovering) {
+        this.navVisible = false;
+      }
+      this.closeNavTimeoutRef = null;
+    }, 300);
+  }
+  handleItemSelect(id, itemIsActive) {
+    if (id === "experiences") {
+      this.showCourseModal = true;
+      return;
+    }
+    z$1([id, itemIsActive]).with(["pause", true], () => {
+      this.activeSession?.pauseRecording();
+    }).with(["pause", false], () => {
+      this.activeSession?.resumeRecording();
+    }).with(["activate", false], () => {
+      this.activeSession?.disconnect();
+    }).otherwise(() => {
+      return;
+    });
+  }
+  async handleSessionStart(sessionToken) {
+    this.showCourseModal = false;
+    this.state = SDKState.LOADING;
+    try {
+      const { ObiSession } = await import("./session-37970ed1.js").then((n3) => n3.s);
+      const session = new ObiSession({ token: sessionToken, apiBaseUrl: this.apiBaseUrl });
+      session.on("stateChanged", (data) => {
+        this.state = data.newState;
+      });
+      session.on("volume", (data) => {
+        this.volume = data;
+      });
+      session.on("error", (data) => {
+        console.error("Session error:", data.error);
+        this.state = SDKState.ERROR;
+        this.activeSession = null;
+      });
+      await session.connect();
+      this.activeSession = session;
+    } catch (error) {
+      console.error("Failed to connect to session:", error);
+      this.state = SDKState.ERROR;
+    }
+  }
+  render() {
+    const stateRender = z$1(this.state).with(SDKState.LOADING, () => x`<obi-dot-loader></obi-dot-loader>`).with(SDKState.RESEARCHING, () => x`<obi-searching-loader></obi-searching-loader>`).with(
+      N$1.union(SDKState.USER_SPEAKING, SDKState.AGENT_SPEAKING),
+      () => x`<obi-audio-equalizer .volume=${this.volume}></obi-audio-equalizer>`
+    ).with(SDKState.PAUSED, () => obiIcon).otherwise(() => obiIcon);
+    return x`
+      <div
+        class="widget-container ${this.state === SDKState.USER_SPEAKING || this.state === SDKState.AGENT_SPEAKING ? "pulse" : ""} ${this.state !== SDKState.READY || this.navVisible ? "rounded" : ""} ${this.state === SDKState.RESEARCHING ? "researching" : ""} ${this.state === SDKState.USER_SPEAKING ? "user-speaking" : ""}"
+        @mouseenter=${this.handleMouseEnter}
+        @mouseleave=${this.handleMouseLeave}
+      >
+        ${stateRender}
+        ${this.navVisible && this.state !== SDKState.RESEARCHING ? x`
+              <obi-navigation-bar
+                ?isActive=${this.state !== SDKState.READY}
+                .position=${this.position}
+                data-direction="up"
+                .currentState=${this.state}
+                .onItemSelect=${this.handleItemSelect.bind(this)}
+              ></obi-navigation-bar>
+            ` : E}
+      </div>
+      ${this.showCourseModal ? x`<obi-course-modal
+            .onClose=${() => this.showCourseModal = false}
+            .onCourseSelect=${this.handleSessionStart.bind(this)}
+            .apiBaseUrl=${this.apiBaseUrl}
+            .apiKey=${this.apiKey}
+          ></obi-course-modal>` : E}
+    `;
+  }
+}
+ObiWidget.styles = i$4`
+    :host {
+      display: block;
+      position: fixed;
+      z-index: 9999;
+      font-family: Arial, sans-serif;
+      --obi-primary: #7c3aed;
+      --obi-danger: #ef4444;
+      --obi-gray: #6b7280;
+    }
+
+    /* Position-specific styles */
+    :host([position="bottom-right"]) {
+      bottom: 80px;
+      right: 80px;
+    }
+
+    :host([position="bottom-left"]) {
+      bottom: 80px;
+      left: 20px;
+    }
+
+    :host([position="top-right"]) {
+      top: 20px;
+      right: 80px;
+    }
+
+    :host([position="top-left"]) {
+      top: 20px;
+      left: 20px;
+    }
+
+    /* Adjust position when in researching state to accommodate wider container */
+    :host([position="bottom-right"]) .widget-container.researching {
+      right: 20px;
+    }
+
+    :host([position="top-right"]) .widget-container.researching {
+      right: 20px;
+    }
+
+    .widget-container {
+      position: fixed;
+      width: 56px;
+      height: 56px;
+      border-radius: 28px;
+      border-color: transparent;
+      background-color: var(--obi-primary);
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+      transition: all 0.2s ease-out;
+    }
+
+    .widget-container.user-speaking {
+      background:
+        linear-gradient(0deg, #c4b5fd, #c4b5fd),
+        linear-gradient(195.84deg, rgba(192, 132, 252, 0) 11.05%, #c084fc 117.01%);
+    }
+
+    .widget-container:hover {
+      border-radius: 12px;
+    }
+
+    .widget-container.rounded {
+      border-radius: 12px;
+    }
+
+    .widget-container.researching {
+      width: 265px;
+      border-radius: 12px;
+    }
+
+    .widget-icon {
+      width: 32px;
+      height: 32px;
+      transition: transform 0.5s ease-in-out;
+    }
+
+    .widget-container.rounded .widget-icon {
+      transform: rotate(110deg);
+    }
+
+    @keyframes pulse-shadow {
+      0% {
+        box-shadow: 0 0 0 0 rgba(124, 58, 237, 0.4);
+      }
+      70% {
+        box-shadow: 0 0 0 10px rgba(124, 58, 237, 0);
+      }
+      100% {
+        box-shadow: 0 0 0 0 rgba(124, 58, 237, 0);
+      }
+    }
+
+    .pulse {
+      animation: pulse-shadow 2s ease-in-out infinite;
+    }
+  `;
+__decorateClass([
+  n$2({ type: String })
+], ObiWidget.prototype, "apiBaseUrl", 2);
+__decorateClass([
+  n$2({ type: String })
+], ObiWidget.prototype, "apiKey", 2);
+__decorateClass([
+  n$2({ type: String })
+], ObiWidget.prototype, "position", 2);
+__decorateClass([
+  n$2({ type: Object })
+], ObiWidget.prototype, "user", 2);
+__decorateClass([
+  r$1()
+], ObiWidget.prototype, "state", 2);
+__decorateClass([
+  r$1()
+], ObiWidget.prototype, "showCourseModal", 2);
+__decorateClass([
+  r$1()
+], ObiWidget.prototype, "isHovering", 2);
+__decorateClass([
+  r$1()
+], ObiWidget.prototype, "navVisible", 2);
+__decorateClass([
+  r$1()
+], ObiWidget.prototype, "activeSession", 2);
+__decorateClass([
+  r$1()
+], ObiWidget.prototype, "volume", 2);
+if (!customElements.get("obi-widget")) {
+  customElements.define("obi-widget", ObiWidget);
+}
+const obiWidget = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
+  __proto__: null,
+  ObiWidget
+}, Symbol.toStringTag, { value: "Module" }));
 export {
+  AudioEqualizer as A,
+  Course as C,
+  DotLoader as D,
   EventType as E,
-  N,
-  ObiSDKConfigSchema as O,
+  NavIcon as N,
+  ObiWidget as O,
   SDKState as S,
-  z
+  i$1 as a,
+  NavigationBar as b,
+  SearchingLoader as c,
+  CourseList as d,
+  CourseModal as e,
+  API_BASE_URL as f,
+  ObiSDKConfigSchema as g,
+  navIcon as h,
+  i$4 as i,
+  navigationBar as j,
+  courses as k,
+  courseModal as l,
+  audioEqualizer as m,
+  n$2 as n,
+  dotLoader as o,
+  obiWidget as p,
+  searchingLoader as s,
+  x,
+  z$1 as z
 };
-//# sourceMappingURL=index-634e0df5.js.map
+//# sourceMappingURL=obi-widget-9c0306f4.js.map