@streamlayer/react 1.1.3 → 1.1.5

package/lib/es/app.js

@@ -1,12 +1,12 @@
-var ge = Object.defineProperty;
-var me = (e, s, n) => s in e ? ge(e, s, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[s] = n;
-var g = (e, s, n) => me(e, typeof s != "symbol" ? s + "" : s, n);
-import { jsx as t, jsxs as m, Fragment as L } from "react/jsx-runtime";
-import { a4 as V, u, F as fe, s as h, T as re, i as ke, x as ye, b as Ne, N as be, k as Se, M as Ie, g as Ee, h as Ae, C as we, j as Ce, O as ae, m as P, l as $e, n as Le, o as De, p as le, q as Te, r as xe, t as Oe, v as M, w as Re, y as de, z as U, A as Ve, B as Pe, I as Q, c as ce, E as Qe, G as _e, H as qe, e as Fe, J as x, P as G, Q as Ke, R as Me, U as Ue, a as ze, W as Be, X as We, L as _, $ as Ge, f as q, a0 as He, a1 as je, Y as Xe, Z as Ye, _ as Ze, a5 as Je, a2 as pe, a3 as H } from "./index2.js";
-import { createContext as es, useContext as z, useRef as $, useState as E, useEffect as k, useTransition as ss, lazy as ns, useMemo as C, Suspense as ts, forwardRef as os, useLayoutEffect as is, useCallback as R } from "react";
-import { C as w, c as j, Q as O, S as D } from "./useStreamLayerApp2.js";
+var fe = Object.defineProperty;
+var ke = (e, s, n) => s in e ? fe(e, s, { enumerable: !0, configurable: !0, writable: !0, value: n }) : e[s] = n;
+var m = (e, s, n) => ke(e, typeof s != "symbol" ? s + "" : s, n);
+import { jsx as t, jsxs as g, Fragment as D } from "react/jsx-runtime";
+import { a4 as P, u, F as ye, s as h, T as re, i as Ne, p as be, b as Se, N as Ie, k as Ee, M as Ae, g as Ce, h as we, C as $e, j as Le, O as le, m as q, l as De, n as Te, o as Oe, q as de, r as xe, t as Re, v as Ve, w as M, x as Pe, y as ce, z as U, A as qe, B as G, I as O, c as pe, E as _e, G as Fe, H as Qe, e as Ke, J as x, K as H, P as Me, R as Ue, U as ze, a as ue, W as Be, X as We, L as _, $ as Ge, f as F, a0 as He, a1 as je, Y as Xe, Z as Ye, _ as Ze, a5 as Je, a2 as he, a3 as j } from "./index2.js";
+import { createContext as es, useContext as z, useRef as L, useState as E, useEffect as k, useTransition as ss, lazy as ns, useMemo as w, Suspense as ts, forwardRef as os, useLayoutEffect as is, useCallback as V } from "react";
+import { C, c as X, Q as R, S as $ } from "./useStreamLayerApp2.js";
 window.dispatchEvent(new CustomEvent("grpc_devtools_loaded"));
-function rs(e) {
+function as(e) {
   return e instanceof DOMException && // everything except Firefox
   (e.code === 22 || // Firefox
   e.code === 1014 || // test name field too, because code might not be present
@@ -14,100 +14,100 @@ function rs(e) {
   e.name === "QuotaExceededError" || // Firefox
   e.name === "NS_ERROR_DOM_QUOTA_REACHED");
 }
-class as {
+class rs {
   constructor(s = "main", n = window.localStorage) {
-    g(this, "delimiter", ":");
-    g(this, "prefix");
-    g(this, "storage");
-    g(this, "clear", () => {
+    m(this, "delimiter", ":");
+    m(this, "prefix");
+    m(this, "storage");
+    m(this, "clear", () => {
       for (const s in window.localStorage)
         s.startsWith(this.prefix) && this.storage.removeItem(s);
     });
-    g(this, "generateKey", (s) => `${this.prefix}${this.delimiter}${s.join(this.delimiter)}`);
-    g(this, "write", (...s) => {
+    m(this, "generateKey", (s) => `${this.prefix}${this.delimiter}${s.join(this.delimiter)}`);
+    m(this, "write", (...s) => {
       const n = s.pop() || "", o = this.generateKey(s);
       try {
         this.storage.setItem(o, n);
-      } catch (i) {
-        rs(i) && this.storage === window.sessionStorage && (window.sessionStorage.removeItem("slstreamlogs"), this.storage.setItem(o, n));
+      } catch (a) {
+        as(a) && this.storage === window.sessionStorage && (window.sessionStorage.removeItem("slstreamlogs"), this.storage.setItem(o, n));
       }
     });
-    g(this, "read", (...s) => {
+    m(this, "read", (...s) => {
       const n = this.storage.getItem(this.generateKey(s));
       return n === null ? void 0 : n;
     });
-    g(this, "remove", (...s) => {
+    m(this, "remove", (...s) => {
       this.storage.removeItem(this.generateKey(s));
     });
     this.prefix = `sl-sdk${this.delimiter}${s}`, this.storage = n;
   }
 }
-var X;
+var Y;
 (function(e) {
   e.Init = "init", e.Ready = "ready", e.Connecting = "connecting", e.Connected = "connected", e.Disconnected = "disconnected", e.Failed = "failed", e.Reconnect = "reconnect", e.Reconnecting = "reconnecting";
-})(X || (X = {}));
-w.Unknown, w.Internal, w.DeadlineExceeded, w.ResourceExhausted, w.FailedPrecondition, w.Unavailable, w.DataLoss;
-V("grpc:retry");
-j(10, { description: "Number of attempts to retry" }), j(3e4, { description: "Max delay between retries in milliseconds" });
+})(Y || (Y = {}));
+C.Unknown, C.Internal, C.DeadlineExceeded, C.ResourceExhausted, C.FailedPrecondition, C.Unavailable, C.DataLoss;
+P("grpc:retry");
+X(10, { description: "Number of attempts to retry" }), X(3e4, { description: "Max delay between retries in milliseconds" });
 var I;
 (function(e) {
   e.SCHEMA = "schema", e.EXTERNAL_TOKEN = "eToken", e.TOKEN = "token";
 })(I || (I = {}));
-class ls extends as {
+class ls extends rs {
   constructor() {
     super("user");
     // Schema
-    g(this, "setSchema", (n) => {
+    m(this, "setSchema", (n) => {
       this.write(I.SCHEMA, n);
     });
-    g(this, "getSchema", () => this.read(I.SCHEMA));
+    m(this, "getSchema", () => this.read(I.SCHEMA));
     // Token
-    g(this, "setToken", (n) => {
+    m(this, "setToken", (n) => {
       this.write(I.TOKEN, n);
     });
-    g(this, "getToken", () => this.read(I.TOKEN));
+    m(this, "getToken", () => this.read(I.TOKEN));
     // External Token
-    g(this, "setExternalToken", (n) => {
+    m(this, "setExternalToken", (n) => {
       this.write(I.EXTERNAL_TOKEN, n);
     });
-    g(this, "getExternalToken", () => this.read(I.EXTERNAL_TOKEN));
-    g(this, "removeToken", () => {
+    m(this, "getExternalToken", () => this.read(I.EXTERNAL_TOKEN));
+    m(this, "removeToken", () => {
       this.remove(I.TOKEN);
     });
   }
 }
-var Y;
-(function(e) {
-  e.DISABLED = "disabled", e.INITIALIZATION = "initialization", e.READY = "ready", e.FAILED = "failed", e.SUSPENDED = "suspended";
-})(Y || (Y = {}));
-V("deep_link");
-V("bypass");
-new ls();
-V("video_player");
 var Z;
 (function(e) {
-  e.SHOWED = "showed";
+  e.DISABLED = "disabled", e.INITIALIZATION = "initialization", e.READY = "ready", e.FAILED = "failed", e.SUSPENDED = "suspended";
 })(Z || (Z = {}));
+P("deep_link");
+P("bypass");
+new ls();
+P("video_player");
 var J;
 (function(e) {
-  e.ALLOWED = "allowed", e.DISALLOWED = "disallowed";
+  e.SHOWED = "showed";
 })(J || (J = {}));
 var ee;
 (function(e) {
-  e.UNKNOWN = "unknown", e.ALREADY_VOTED = "already_voted";
+  e.ALLOWED = "allowed", e.DISALLOWED = "disallowed";
 })(ee || (ee = {}));
 var se;
 (function(e) {
-  e.ONBOARDING = "onboarding", e.ONBOARDING_IO = "onboarding_io";
+  e.UNKNOWN = "unknown", e.ALREADY_VOTED = "already_voted";
 })(se || (se = {}));
 var ne;
 (function(e) {
-  e.Unset = "unset", e.Required = "required", e.Optional = "optional", e.Completed = "completed", e.Disabled = "disabled", e.Unavailable = "unavailable";
+  e.ONBOARDING = "onboarding", e.ONBOARDING_IO = "onboarding_io";
 })(ne || (ne = {}));
-O.POLL, O.PREDICTION, O.TRIVIA;
+var te;
+(function(e) {
+  e.Unset = "unset", e.Required = "required", e.Optional = "optional", e.Completed = "completed", e.Disabled = "disabled", e.Unavailable = "unavailable";
+})(te || (te = {}));
+R.POLL, R.PREDICTION, R.TRIVIA;
 const ds = {
-  [D.GAMES]: !0
-}, F = /* @__PURE__ */ h("div")({
+  [$.GAMES]: !0
+}, Q = /* @__PURE__ */ h("div")({
   name: "LoadingContainer",
   class: "lclc0ej",
   propsAsIs: !1
@@ -116,30 +116,30 @@ const ds = {
   sdk: s,
   children: n,
   className: o,
-  noWait: i
+  noWait: a
 }) => {
-  const a = u(e.status), l = u(s.sdkStore.slStreamId);
-  if (!i) {
+  const r = u(e.status), l = u(s.sdkStore.slStreamId);
+  if (!a) {
     if (l != null && l.loading && !l.data)
-      return /* @__PURE__ */ t(F, {
+      return /* @__PURE__ */ t(Q, {
         className: o,
         children: "Event is loading..."
       });
     if (!(l != null && l.data))
-      return /* @__PURE__ */ t(F, {
+      return /* @__PURE__ */ t(Q, {
         className: o,
         children: "Event is forbidden..."
       });
-    if (a !== fe.Ready)
-      return /* @__PURE__ */ t(F, {
+    if (r !== ye.Ready)
+      return /* @__PURE__ */ t(Q, {
         className: o,
         children: "Wait feature..."
       });
   }
   return n;
-}, ue = es({
+}, ve = es({
   sdk: null
-}), B = () => z(ue), ps = /* @__PURE__ */ h("div")({
+}), B = () => z(ve), ps = /* @__PURE__ */ h("div")({
   name: "QuestionContainer",
   class: "q14ckf9e",
   propsAsIs: !1
@@ -150,10 +150,10 @@ const ds = {
   const {
     sdk: o
   } = B();
-  return ((s = e == null ? void 0 : e.attributes) == null ? void 0 : s.attributes.case) === "insight" ? /* @__PURE__ */ t(ye, {
+  return ((s = e == null ? void 0 : e.attributes) == null ? void 0 : s.attributes.case) === "insight" ? /* @__PURE__ */ t(be, {
     ...e.attributes.attributes.value,
     controlVideo: o == null ? void 0 : o.controlVideoPlayer
-  }) : ((n = e == null ? void 0 : e.attributes) == null ? void 0 : n.attributes.case) === "tweet" ? /* @__PURE__ */ t(Ne, {
+  }) : ((n = e == null ? void 0 : e.attributes) == null ? void 0 : n.attributes.case) === "tweet" ? /* @__PURE__ */ t(Se, {
     ...e.attributes.attributes.value,
     controlVideo: o == null ? void 0 : o.controlVideoPlayer
   }) : null;
@@ -164,44 +164,48 @@ const ds = {
 }) => {
   const {
     loading: o,
-    data: i
+    data: a
   } = e;
-  return i ? /* @__PURE__ */ t(be, {
+  return a ? /* @__PURE__ */ t(Ie, {
     vote: s,
     close: n,
-    openedQuestion: i,
+    openedQuestion: a,
     isLoading: !!o
-  }) : /* @__PURE__ */ t(Se, {});
+  }) : /* @__PURE__ */ t(Ee, {});
 }, vs = ({
-  gamification: e
+  gamification: e,
+  hideSponsor: s,
+  className: n,
+  hideHeader: o
 }) => {
-  var s, n, o;
-  const i = u(e.openedQuestion.$store), a = u(e.openedQuestion.$extendedStore);
-  if (!i)
+  var a, r, l;
+  const d = u(e.openedQuestion.$store), i = u(e.openedQuestion.$extendedStore);
+  if (!d)
     return null;
-  const l = i.type;
-  return /* @__PURE__ */ m(ps, {
-    children: [/* @__PURE__ */ t(re, {
+  const c = d.type;
+  return /* @__PURE__ */ g(ps, {
+    className: n,
+    children: [!o && /* @__PURE__ */ t(re, {
       close: e.closeQuestion,
-      type: ((s = i.attributes) == null ? void 0 : s.type) || O.UNSET
-    }), l === "question" && /* @__PURE__ */ t(hs, {
+      type: ((a = d.attributes) == null ? void 0 : a.type) || R.UNSET
+    }), c === "question" && /* @__PURE__ */ t(hs, {
       vote: e.submitAnswer,
       close: e.closeQuestion,
-      extendedQuestion: a
-    }), l !== "question" && /* @__PURE__ */ t(us, {
-      openedQuestion: i
-    }), /* @__PURE__ */ t(ke, {
-      sponsorLogo: (o = (n = a.data) == null ? void 0 : n.sponsorship) == null ? void 0 : o.logo
+      extendedQuestion: i
+    }), c !== "question" && /* @__PURE__ */ t(us, {
+      openedQuestion: d
+    }), !s && /* @__PURE__ */ t(Ne, {
+      sponsorLogo: (l = (r = i.data) == null ? void 0 : r.sponsorship) == null ? void 0 : l.logo
     })]
   });
-}, gs = /* @__PURE__ */ h("div")({
+}, ms = /* @__PURE__ */ h("div")({
   name: "InviteFriendsContainer",
   class: "i1c9dygq",
   propsAsIs: !1
-}), ms = ({
+}), gs = ({
   deepLink: e
-}) => /* @__PURE__ */ t(gs, {
-  children: /* @__PURE__ */ t(Ie, {
+}) => /* @__PURE__ */ t(ms, {
+  children: /* @__PURE__ */ t(Ae, {
     inviteLink: e,
     inviteCardTitle: "It’s More Fun With Friends",
     inviteCardSubtext: "Invite and compete against your friends for the top spot on the leaderboard."
@@ -215,53 +219,53 @@ const ds = {
   scrollNode: s,
   scrollStore: n
 }) => {
-  const o = $(null), {
-    data: i,
-    hasMore: a,
+  const o = L(null), {
+    data: a,
+    hasMore: r,
     loading: l,
     key: d
   } = u(e.leaderboardList.$store), {
-    data: r
-  } = u(e.deepLink.$store), [p, c] = Ee(o);
-  return !i.length && !l ? /* @__PURE__ */ t(ms, {
-    deepLink: r
-  }) : /* @__PURE__ */ m(L, {
-    children: [/* @__PURE__ */ t(Ae, {
-      items: i,
+    data: i
+  } = u(e.deepLink.$store), [c, p] = Ce(o);
+  return !a.length && !l ? /* @__PURE__ */ t(gs, {
+    deepLink: i
+  }) : /* @__PURE__ */ g(D, {
+    children: [/* @__PURE__ */ t(we, {
+      items: a,
       scrollNode: s,
       scrollStore: n,
       fetchMore: e.leaderboardList.fetchMore,
-      hasMore: a,
+      hasMore: r,
       openItemDetail: e.openUser,
       currentUserId: e.currentUserId.get()
-    }, d), r && /* @__PURE__ */ t(fs, {
+    }, d), i && /* @__PURE__ */ t(fs, {
       ref: o,
-      children: /* @__PURE__ */ t(we, {
-        onClick: () => p(r),
+      children: /* @__PURE__ */ t($e, {
+        onClick: () => c(i),
         title: "Invite Friends",
         description: "Challenge them now!"
       })
-    }), c]
+    }), p]
   });
 }, ys = ({ store: e, openQuestion: s }) => {
   const { sdk: n } = B(), o = u(e);
-  return /* @__PURE__ */ t(Ce, { openQuestion: s, questions: o.data, controlVideo: n == null ? void 0 : n.controlVideoPlayer });
+  return /* @__PURE__ */ t(Le, { openQuestion: s, questions: o.data, controlVideo: n == null ? void 0 : n.controlVideoPlayer });
 }, Ns = ({ userSummary: e }) => {
   var s;
   const [n, o] = E(void 0);
   return k(() => {
-    const i = e.$store.subscribe((a) => {
-      a && o(a);
+    const a = e.$store.subscribe((r) => {
+      r && o(r);
     });
     return () => {
-      i();
+      a();
     };
-  }, [e]), /* @__PURE__ */ t(ae, { loading: !(n != null && n.summary), ...n == null ? void 0 : n.summary, successRate: (s = n == null ? void 0 : n.percentage) == null ? void 0 : s.correct });
-}, bs = ({ gamification: e, className: s, scrollStore: n, scrollNode: o, appNode: i, style: a, responsiveStore: l }) => {
-  const { tabsShown: d } = u(n, { keys: ["tabsShown"] }), [r, p] = E(P.HOME), [, c] = ss(), { sdkInDesktopView: v, screen: f } = u(l, { keys: ["sdkInDesktopView"] }), N = (S) => {
-    c(() => {
+  }, [e]), /* @__PURE__ */ t(le, { loading: !(n != null && n.summary), ...n == null ? void 0 : n.summary, successRate: (s = n == null ? void 0 : n.percentage) == null ? void 0 : s.correct });
+}, bs = ({ gamification: e, className: s, scrollStore: n, scrollNode: o, appNode: a, style: r, responsiveStore: l }) => {
+  const { tabsShown: d } = u(n, { keys: ["tabsShown"] }), [i, c] = E(q.HOME), [, p] = ss(), { sdkInDesktopView: v, screen: f } = u(l, { keys: ["sdkInDesktopView"] }), N = (S) => {
+    p(() => {
       var y;
-      p(S), v === !1 && (((y = i.current) == null ? void 0 : y.getBoundingClientRect().y) || 0) < 0 && M(i, f.size, { behavior: "instant" });
+      c(S), v === !1 && (((y = a.current) == null ? void 0 : y.getBoundingClientRect().y) || 0) < 0 && M(a, f.size, { behavior: "instant" });
     });
   };
   k(() => n.subscribe((S) => {
@@ -272,23 +276,23 @@ const ds = {
     l.get().sdkInDesktopView ? n.setKey("tabsShown", S.scrollDirection === "backward") : n.setKey("tabsShown", S.scrollDirection === "forward");
   }), [n, l]);
   let b = "0px";
-  return v ? b = d ? "0px" : "calc(8px - var(--header-height) - var(--header-offset))" : b = d ? "calc(var(--header-height) + var(--header-offset) - 2px)" : "0px", /* @__PURE__ */ m($e, { className: s, style: a, children: [
+  return v ? b = d ? "0px" : "calc(8px - var(--header-height) - var(--header-offset))" : b = d ? "calc(var(--header-height) + var(--header-offset) - 2px)" : "0px", /* @__PURE__ */ g(De, { className: s, style: r, children: [
     /* @__PURE__ */ t(
-      Le,
+      Te,
       {
         style: {
           top: b
         },
-        children: /* @__PURE__ */ t(De, { activePage: r, toggleActivePage: N })
+        children: /* @__PURE__ */ t(Oe, { activePage: i, toggleActivePage: N })
       }
     ),
-    r === P.HOME && /* @__PURE__ */ m(L, { children: [
-      /* @__PURE__ */ t(le, { style: { paddingTop: "8px" }, children: /* @__PURE__ */ t(Te, { children: /* @__PURE__ */ t(Ns, { userSummary: e.userSummary }) }) }),
-      /* @__PURE__ */ t(xe, { style: { flex: 1 }, children: /* @__PURE__ */ t(ys, { openQuestion: e.openQuestion, store: e.feedList.getStore() }) })
+    i === q.HOME && /* @__PURE__ */ g(D, { children: [
+      /* @__PURE__ */ t(de, { style: { paddingTop: "8px" }, children: /* @__PURE__ */ t(xe, { children: /* @__PURE__ */ t(Ns, { userSummary: e.userSummary }) }) }),
+      /* @__PURE__ */ t(Re, { style: { flex: 1 }, children: /* @__PURE__ */ t(ys, { openQuestion: e.openQuestion, store: e.feedList.getStore() }) })
     ] }),
-    r === P.LEADERBOARD && /* @__PURE__ */ t(Oe, { children: /* @__PURE__ */ t(ks, { scrollStore: n, scrollNode: o, gamification: e }) })
+    i === q.LEADERBOARD && /* @__PURE__ */ t(Ve, { children: /* @__PURE__ */ t(ks, { scrollStore: n, scrollNode: o, gamification: e }) })
   ] });
-}, Ss = () => U, te = /* @__PURE__ */ h(Ss())({
+}, Ss = () => U, oe = /* @__PURE__ */ h(Ss())({
   name: "OpenedContainer",
   class: "ouvguos",
   propsAsIs: !0
@@ -302,76 +306,76 @@ const ds = {
 }) => {
   const n = e + s;
   return n === 0 ? 0 : Math.round(e / n * 100);
-}, mn = ({
+}, gn = ({
   gamification: e,
   scrollStore: s,
   className: n,
   appNode: o,
-  scrollNode: i,
-  responsiveStore: a
+  scrollNode: a,
+  responsiveStore: r
 }) => /* @__PURE__ */ t(bs, {
   appNode: o,
   scrollStore: s,
-  scrollNode: i,
+  scrollNode: a,
   className: n,
   gamification: e,
-  responsiveStore: a
+  responsiveStore: r
 }), As = ({
   gamification: e,
   className: s,
   appNode: n,
   responsiveStore: o
 }) => {
-  const i = u(e.openedQuestion.$store), a = u(e.openedUser), {
+  const a = u(e.openedQuestion.$store), r = u(e.openedUser), {
     sdkInDesktopView: l
   } = u(o, {
     keys: ["sdkInDesktopView"]
   }), {
     hiding: d,
-    onAnimationEnd: r
-  } = Re();
-  if (!n.current || !i && !a)
+    onAnimationEnd: i
+  } = Pe();
+  if (!n.current || !a && !r)
     return null;
-  const p = i ? /* @__PURE__ */ t(te, {
+  const c = a ? /* @__PURE__ */ t(oe, {
     className: s,
     hiding: d,
-    onAnimationEnd: r,
+    onAnimationEnd: i,
     children: /* @__PURE__ */ t(vs, {
       gamification: e
     })
-  }) : a ? /* @__PURE__ */ t(te, {
+  }) : r ? /* @__PURE__ */ t(oe, {
     className: s,
     hiding: d,
-    onAnimationEnd: r,
-    children: /* @__PURE__ */ m(Is, {
+    onAnimationEnd: i,
+    children: /* @__PURE__ */ g(Is, {
       children: [/* @__PURE__ */ t(re, {
         label: "Friend's Rank",
         close: e.closeUser
-      }), /* @__PURE__ */ t(le, {
-        children: /* @__PURE__ */ t(ae, {
-          ...a,
-          successRate: Es(a)
+      }), /* @__PURE__ */ t(de, {
+        children: /* @__PURE__ */ t(le, {
+          ...r,
+          successRate: Es(r)
         })
       })]
     })
   }) : null;
-  return /* @__PURE__ */ t(de, {
+  return /* @__PURE__ */ t(ce, {
     container: n,
     useContainer: !l,
-    children: p
+    children: c
   });
-}, ws = ns(() => import("./gamification-feature.js")), Cs = ({ sdk: e, feature: s, className: n, scrollStore: o, appNode: i, scrollNode: a, responsiveStore: l }) => {
-  const d = C(() => s && s.featureConfig.get().type === D.GAMES ? /* @__PURE__ */ t(cs, { className: n, sdk: e, feature: s, children: /* @__PURE__ */ t(
-    ws,
+}, Cs = ns(() => import("./gamification-feature.js")), ws = ({ sdk: e, feature: s, className: n, scrollStore: o, appNode: a, scrollNode: r, responsiveStore: l }) => {
+  const d = w(() => s && s.featureConfig.get().type === $.GAMES ? /* @__PURE__ */ t(cs, { className: n, sdk: e, feature: s, children: /* @__PURE__ */ t(
+    Cs,
     {
-      appNode: i,
+      appNode: a,
       scrollStore: o,
-      scrollNode: a,
+      scrollNode: r,
       className: n,
       responsiveStore: l,
       gamification: s
     }
-  ) }) : null, [e, s, n, l, o, a, i]);
+  ) }) : null, [e, s, n, l, o, r, a]);
   return /* @__PURE__ */ t(
     ts,
     {
@@ -379,7 +383,7 @@ const ds = {
       children: d
     }
   );
-}, $s = ({ feature: e, className: s, appNode: n, responsiveStore: o }) => e && e.featureConfig.get().type === D.GAMES ? /* @__PURE__ */ t(
+}, $s = ({ feature: e, className: s, appNode: n, responsiveStore: o }) => e && e.featureConfig.get().type === $.GAMES ? /* @__PURE__ */ t(
   As,
   {
     className: s,
@@ -387,7 +391,7 @@ const ds = {
     responsiveStore: o,
     gamification: e
   }
-) : null, Ls = () => ce, Ds = /* @__PURE__ */ h(Ls())({
+) : null, Ls = () => pe, Ds = /* @__PURE__ */ h(Ls())({
   name: "ButtonIcon",
   class: "b11wpe79",
   propsAsIs: !0
@@ -395,58 +399,66 @@ const ds = {
   sdk: e,
   className: s
 }, n) => {
-  const o = u(e.sdkStore.organizationSettings), i = u(e.sdkStore.streamSettings), a = u(e.getActiveFeature()), l = C(() => {
-    const r = (i == null ? void 0 : i.data) || (o == null ? void 0 : o.data);
-    return r != null && r.overlays ? r.overlays : [];
-  }, [o, i]), d = C(() => [...l.filter(({
-    enableSdkButton: r
-  }) => r).map((r) => ({
-    id: r.type,
-    onClick: () => e.openFeature(r.type),
-    disabled: !(r.type in ds),
-    label: r.name,
+  const o = u(e.sdkStore.organizationSettings), a = u(e.sdkStore.streamSettings), r = u(e.getActiveFeature()), l = w(() => {
+    const i = (a == null ? void 0 : a.data) || (o == null ? void 0 : o.data);
+    return i != null && i.overlays ? i.overlays : [];
+  }, [o, a]), d = w(() => [...l.filter(({
+    enableSdkButton: i,
+    type: c
+  }) => c === $.GAMES || i).map((i) => ({
+    id: i.type,
+    onClick: () => e.openFeature(i.type),
+    disabled: !(i.type in ds),
+    label: i.name,
     icon: /* @__PURE__ */ t("img", {
-      src: r.icon,
+      src: i.icon,
       alt: ""
     }),
     /** multiplied by 10 to add the ability to insert custom buttons between our buttons */
-    position: r.position * 10
-  }))].sort((r, p) => r.position - p.position), [l, e]);
-  return /* @__PURE__ */ m(Ve, {
+    position: i.position * 10
+  }))].sort((i, c) => i.position - c.position), [l, e]);
+  return /* @__PURE__ */ g(qe, {
     className: s,
-    children: [/* @__PURE__ */ t(Pe, {
-      children: [/* @__PURE__ */ t(Q, {
+    children: [d.length !== 0 && /* @__PURE__ */ t(G, {
+      children: [/* @__PURE__ */ t(O, {
         id: "Channels",
         onClick: () => e.closeFeature(),
         label: "Channels",
-        active: a === 0
-      }, "Channels"), ...d.map((r) => r.id === D.GAMES ? /* @__PURE__ */ t(Q, {
-        ...r,
-        active: r.id === a,
+        active: r === 0
+      }, "Channels"), ...d.map((i) => i.id === $.GAMES ? /* @__PURE__ */ t(O, {
+        ...i,
+        active: i.id === r,
         label: "StreamLayer +",
         id: "featuredGroups",
         icon: /* @__PURE__ */ t(Ds, {
           name: "icon-btn-feature-groups",
-          "data-selected": r.id === a
+          "data-selected": i.id === r
         })
-      }, r.id) : /* @__PURE__ */ t(Q, {
-        ...r,
+      }, i.id) : /* @__PURE__ */ t(O, {
+        ...i,
         icon: void 0,
-        active: r.id === a
-      }, r.id))]
+        active: i.id === r
+      }, i.id))]
+    }), !d.length && /* @__PURE__ */ t(G, {
+      children: [/* @__PURE__ */ t(O, {
+        id: "empty",
+        label: "No Features...",
+        active: !1,
+        disabled: !0
+      }, "empty")]
     }), /* @__PURE__ */ t("div", {
       ref: n
     })]
   });
-}), xs = /* @__PURE__ */ h("div")({
+}), Os = /* @__PURE__ */ h("div")({
   name: "Container",
   class: "c1qjj4d4",
   propsAsIs: !1
-}), Os = /* @__PURE__ */ h("div")({
+}), xs = /* @__PURE__ */ h("div")({
   name: "CloseIconWrap",
   class: "c1lg6b8a",
   propsAsIs: !1
-}), Rs = () => ce, Vs = /* @__PURE__ */ h(Rs())({
+}), Rs = () => pe, Vs = /* @__PURE__ */ h(Rs())({
   name: "CloseIcon",
   class: "c159el66",
   propsAsIs: !0
@@ -454,7 +466,7 @@ const ds = {
   name: "Title",
   class: "t16xmufv",
   propsAsIs: !1
-}), Qs = /* @__PURE__ */ h("img")({
+}), qs = /* @__PURE__ */ h("img")({
   name: "SponsorLogo",
   class: "s83lc21",
   propsAsIs: !1
@@ -462,11 +474,11 @@ const ds = {
   name: "PresentsTitle",
   class: "p1p7igia",
   propsAsIs: !1
-}), qs = /* @__PURE__ */ h("div")({
+}), Fs = /* @__PURE__ */ h("div")({
   name: "Subtitle",
   class: "s1eftsbu",
   propsAsIs: !1
-}), Fs = /* @__PURE__ */ h("div")({
+}), Qs = /* @__PURE__ */ h("div")({
   name: "Description",
   class: "d8uezec",
   propsAsIs: !1
@@ -474,22 +486,22 @@ const ds = {
   name: "ActionButton",
   class: "a1h1bk90",
   propsAsIs: !1
-}), oe = ({ close: e, action: s, onboarding: n }) => {
-  var o, i, a, l, d, r, p, c;
-  return /* @__PURE__ */ m(xs, { children: [
-    /* @__PURE__ */ t(Os, { onClick: e, children: /* @__PURE__ */ t(Vs, { name: "icon-cross" }) }),
-    ((i = (o = n == null ? void 0 : n.titleCard) == null ? void 0 : o.media) == null ? void 0 : i.sponsorLogo) && /* @__PURE__ */ m(Ps, { children: [
-      /* @__PURE__ */ t(Qs, { alt: "sponsor-logo", src: (l = (a = n == null ? void 0 : n.titleCard) == null ? void 0 : a.media) == null ? void 0 : l.sponsorLogo }),
+}), ie = ({ close: e, action: s, onboarding: n }) => {
+  var o, a, r, l, d, i, c, p;
+  return /* @__PURE__ */ g(Os, { children: [
+    /* @__PURE__ */ t(xs, { onClick: e, children: /* @__PURE__ */ t(Vs, { name: "icon-cross" }) }),
+    ((a = (o = n == null ? void 0 : n.titleCard) == null ? void 0 : o.media) == null ? void 0 : a.sponsorLogo) && /* @__PURE__ */ g(Ps, { children: [
+      /* @__PURE__ */ t(qs, { alt: "sponsor-logo", src: (l = (r = n == null ? void 0 : n.titleCard) == null ? void 0 : r.media) == null ? void 0 : l.sponsorLogo }),
       /* @__PURE__ */ t(_s, { children: "PRESENTS" })
     ] }),
-    ((d = n == null ? void 0 : n.titleCard) == null ? void 0 : d.title) && /* @__PURE__ */ t(qs, { children: (r = n == null ? void 0 : n.titleCard) == null ? void 0 : r.title }),
-    ((p = n == null ? void 0 : n.titleCard) == null ? void 0 : p.subtitle) && /* @__PURE__ */ t(Fs, { children: (c = n == null ? void 0 : n.titleCard) == null ? void 0 : c.subtitle }),
+    ((d = n == null ? void 0 : n.titleCard) == null ? void 0 : d.title) && /* @__PURE__ */ t(Fs, { children: (i = n == null ? void 0 : n.titleCard) == null ? void 0 : i.title }),
+    ((c = n == null ? void 0 : n.titleCard) == null ? void 0 : c.subtitle) && /* @__PURE__ */ t(Qs, { children: (p = n == null ? void 0 : n.titleCard) == null ? void 0 : p.subtitle }),
     /* @__PURE__ */ t(Ks, { onClick: s, children: "Play Now" })
   ] });
 }, K = [{
   graphicSrc: "https://cdn.streamlayer.io/assets/sdk-web/onboarding-steps/step_0.png",
   tagline: "",
-  headline: /* @__PURE__ */ m(L, {
+  headline: /* @__PURE__ */ g(D, {
     children: ["Welcome to ", /* @__PURE__ */ t("br", {}), " StreamLayer +"]
   })
 }, {
@@ -512,7 +524,7 @@ const ds = {
   name: "OnboardingNotificationContainer",
   class: "o1vnouv7",
   propsAsIs: !0
-}), ie = /* @__PURE__ */ h("div")({
+}), ae = /* @__PURE__ */ h("div")({
   name: "InnerContainer",
   class: "i59uefw",
   propsAsIs: !1
@@ -521,17 +533,17 @@ const ds = {
   onboardingOpts: s,
   notification: n,
   gamification: o,
-  loading: i,
-  sdk: a
+  loading: a,
+  sdk: r
 }) => {
-  var l, d, r, p, c, v, f;
-  const N = u(o.friends.getStore()), [b, S] = E(void 0), y = C(() => {
+  var l, d, i, c, p, v, f;
+  const N = u(o.friends.getStore()), [b, S] = E(void 0), y = w(() => {
     var A, T;
-    const W = a.getInviter();
+    const W = r.getInviter();
     return W ? (T = (A = N.data) == null ? void 0 : A.find(({
-      slId: ve
-    }) => ve === W)) == null ? void 0 : T.name : "";
-  }, [N.data, a]);
+      slId: ge
+    }) => ge === W)) == null ? void 0 : T.name : "";
+  }, [N.data, r]);
   return k(() => {
     const A = e.$store.subscribe((T) => {
       T && S(T.data);
@@ -540,8 +552,8 @@ const ds = {
       A();
     };
   }, [e.$store]), /* @__PURE__ */ t(Ms, {
-    children: /* @__PURE__ */ t(_e, {
-      loading: i,
+    children: /* @__PURE__ */ t(Fe, {
+      loading: a,
       rules: [{
         label: "Answer as many questions as you like.",
         icon: "icon-btn-feature-groups"
@@ -555,11 +567,11 @@ const ds = {
       rulesBtnLabel: (l = s.rules) == null ? void 0 : l.buttonLabel,
       rulesTitle: (d = s.rules) == null ? void 0 : d.heading,
       termsTitle: "Terms and Conditions",
-      termsText: (r = s.rules) == null ? void 0 : r.terms,
+      termsText: (i = s.rules) == null ? void 0 : i.terms,
       steps: K,
-      primaryColor: (p = s.inviteCard) == null ? void 0 : p.iconColor,
+      primaryColor: (c = s.inviteCard) == null ? void 0 : c.iconColor,
       inviteLink: b,
-      inviteCardTitle: (c = s.inviteCard) == null ? void 0 : c.heading,
+      inviteCardTitle: (p = s.inviteCard) == null ? void 0 : p.heading,
       inviteCardSubtext: (v = s.inviteCard) == null ? void 0 : v.subtext,
       inviteCardBtnLabel: (f = s.inviteCard) == null ? void 0 : f.buttonLabel,
       onClose: () => {
@@ -567,7 +579,7 @@ const ds = {
         (A = n.close) == null || A.call(n);
       },
       gamification: o,
-      sdk: a,
+      sdk: r,
       inviterName: y
     })
   });
@@ -576,11 +588,11 @@ const ds = {
   notification: s,
   saveHeight: n,
   style: o,
-  appNode: i,
-  sdkInDesktopView: a,
+  appNode: a,
+  sdkInDesktopView: r,
   responsiveStore: l
 }) => {
-  const d = $(null), r = s.data.onboarding, [p, c] = E(r == null ? void 0 : r.instantOpen), v = e.getFeature(D.GAMES), f = C(() => K == null ? void 0 : K.map(({
+  const d = L(null), i = s.data.onboarding, [c, p] = E(i == null ? void 0 : i.instantOpen), v = e.getFeature($.GAMES), f = w(() => K == null ? void 0 : K.map(({
     graphicSrc: y
   }) => y), []), {
     screen: N
@@ -594,47 +606,47 @@ const ds = {
   const {
     loading: b,
     throttled: S
-  } = Qe(f);
-  return p && v && r && i.current && !S ? /* @__PURE__ */ t(de, {
-    container: i,
-    useContainer: !a,
+  } = _e(f);
+  return c && v && i && a.current && !S ? /* @__PURE__ */ t(ce, {
+    container: a,
+    useContainer: !r,
     children: /* @__PURE__ */ t(Bs, {
       notification: s,
-      setOpened: c,
+      setOpened: p,
       gamification: v,
-      onboardingOpts: r,
+      onboardingOpts: i,
       deepLink: v.deepLink,
       loading: b,
-      renderToNode: i,
+      renderToNode: a,
       sdk: e
     })
-  }) : /* @__PURE__ */ m(L, {
-    children: [/* @__PURE__ */ t(ie, {
+  }) : /* @__PURE__ */ g(D, {
+    children: [/* @__PURE__ */ t(ae, {
       ref: d,
       style: {
         position: "absolute",
         visibility: "hidden"
       },
-      children: /* @__PURE__ */ t(oe, {
+      children: /* @__PURE__ */ t(ie, {
         close: () => {
         },
         action: () => {
         },
-        onboarding: r
+        onboarding: i
       })
     }), /* @__PURE__ */ t(zs, {
       style: o,
       hiding: s.hiding,
-      children: /* @__PURE__ */ t(ie, {
-        children: /* @__PURE__ */ t(oe, {
+      children: /* @__PURE__ */ t(ae, {
+        children: /* @__PURE__ */ t(ie, {
           close: s.close,
           action: () => {
             var y;
-            c(!0), (((y = i.current) == null ? void 0 : y.getBoundingClientRect().y) || 0) < 0 && M(i, N.size, {
+            p(!0), (((y = a.current) == null ? void 0 : y.getBoundingClientRect().y) || 0) < 0 && M(a, N.size, {
               behavior: "smooth"
             });
           },
-          onboarding: r
+          onboarding: i
         })
       })
     })]
@@ -643,11 +655,11 @@ const ds = {
   name: "Container",
   class: "c8ol1ve",
   propsAsIs: !0
-}), he = /* @__PURE__ */ h("div")({
+}), me = /* @__PURE__ */ h("div")({
   name: "InnerContainer",
   class: "iqfywam",
   propsAsIs: !1
-}), js = () => he, Xs = /* @__PURE__ */ h(js())({
+}), js = () => me, Xs = /* @__PURE__ */ h(js())({
   name: "HiddenContainer",
   class: "hokmtod",
   propsAsIs: !0
@@ -655,12 +667,12 @@ const ds = {
   name: "NotificationRefreshing",
   class: "n192d1q8",
   propsAsIs: !1
-}), Zs = () => qe, Js = /* @__PURE__ */ h(Zs())({
+}), Zs = () => Qe, Js = /* @__PURE__ */ h(Zs())({
   name: "Pill",
   class: "p1lha68t",
   propsAsIs: !0
 }), en = (e) => {
-  const [s, n] = E(0), o = $(null), i = R((l) => {
+  const [s, n] = E(0), o = L(null), a = V((l) => {
     o.current = l;
   }, []);
   k(() => {
@@ -668,58 +680,58 @@ const ds = {
     const d = (l = o.current) == null ? void 0 : l.getBoundingClientRect();
     d && n(d.height);
   }, [e]);
-  const a = R((l) => {
+  const r = V((l) => {
     n(l);
   }, []);
-  return [i, s, a];
+  return [a, s, r];
 }, sn = ({
   sdk: e,
   notification: s,
   appNode: n,
   responsiveStore: o
 }) => {
-  var i, a;
+  var a, r;
   const {
     sdkInDesktopView: l
   } = u(o, {
     keys: ["sdkInDesktopView"]
   }), {
     sdk: d
-  } = B(), [r, p, c] = en(s.id);
-  return s.type === x.QUESTION ? /* @__PURE__ */ m(L, {
+  } = B(), [i, c, p] = en(s.id);
+  return s.type === x.QUESTION ? /* @__PURE__ */ g(D, {
     children: [/* @__PURE__ */ t(Xs, {
-      ref: r,
-      children: /* @__PURE__ */ t(G, {
+      ref: i,
+      children: /* @__PURE__ */ t(H, {
         ...s
       })
-    }), /* @__PURE__ */ m(Hs, {
+    }), /* @__PURE__ */ g(Hs, {
       style: {
-        height: s.hiding ? 0 : p
+        height: s.hiding ? 0 : c
       },
       hiding: s.hiding,
-      children: [/* @__PURE__ */ t(he, {
+      children: [/* @__PURE__ */ t(me, {
         style: {
           height: "100%"
         },
-        children: /* @__PURE__ */ t(G, {
+        children: /* @__PURE__ */ t(H, {
           ...s,
           controlVideo: d == null ? void 0 : d.controlVideoPlayer
         })
       }), /* @__PURE__ */ t(Ys, {}, s.id)]
     })]
-  }) : s.type === x.QUESTION_RESOLVED && (a = (i = s.data) == null ? void 0 : i.question) != null && a.predictionResult ? /* @__PURE__ */ t(Ke, {
+  }) : s.type === x.QUESTION_RESOLVED && (r = (a = s.data) == null ? void 0 : a.question) != null && r.predictionResult ? /* @__PURE__ */ t(Me, {
     style: {
-      height: s.hiding ? 0 : p
+      height: s.hiding ? 0 : c
     },
-    saveHeight: c,
+    saveHeight: p,
     close: s.close,
     hiding: s.hiding,
     ...s.data.question
   }) : s.type === x.ONBOARDING ? /* @__PURE__ */ t(Ws, {
     style: {
-      height: s.hiding ? 0 : p
+      height: s.hiding ? 0 : c
     },
-    saveHeight: c,
+    saveHeight: p,
     sdk: e,
     notification: s,
     sdkInDesktopView: l,
@@ -731,86 +743,86 @@ const ds = {
   setPill: s,
   appNode: n,
   headerNode: o,
-  scrollNode: i,
-  responsiveStore: a,
+  scrollNode: a,
+  responsiveStore: r,
   scrollStore: l
 }) => {
-  var d, r;
+  var d, i;
   const {
-    screen: p
-  } = u(a, {
+    screen: c
+  } = u(r, {
     keys: ["screen"]
   }), {
-    tabsShown: c,
+    tabsShown: p,
     scrollPosition: v
   } = u(l, {
     keys: ["tabsShown", "scrollPosition"]
   });
   k(() => {
-    a.get().sdkInDesktopView ? v < 50 && s(null) : v > -50 && s(null);
-  }, [v, a, s]);
-  const f = a.get().sdkInDesktopView ? n : o;
-  return !e || !f.current ? null : Me.createPortal(/* @__PURE__ */ t(Js, {
-    title: e.type === x.QUESTION_RESOLVED ? "Prediction result" : `New ${((r = Ue[(d = e.data) == null ? void 0 : d.questionType]) == null ? void 0 : r.label) || "notification"}`,
+    r.get().sdkInDesktopView ? v < 50 && s(null) : v > -50 && s(null);
+  }, [v, r, s]);
+  const f = r.get().sdkInDesktopView ? n : o;
+  return !e || !f.current ? null : Ue.createPortal(/* @__PURE__ */ t(Js, {
+    title: e.type === x.QUESTION_RESOLVED ? "Prediction result" : `New ${((i = ze[(d = e.data) == null ? void 0 : d.questionType]) == null ? void 0 : i.label) || "notification"}`,
     onClick: () => {
       var N;
-      a.get().sdkInDesktopView ? (N = i.current) == null || N.scrollTo({
+      r.get().sdkInDesktopView ? (N = a.current) == null || N.scrollTo({
         top: 0,
         behavior: "smooth"
-      }) : M(n, p.size, {
+      }) : M(n, c.size, {
         behavior: "smooth"
       }), s(null);
     },
-    className: ze(c && nn, "sl-pill-button")
+    className: ue(p && nn, "sl-pill-button")
   }), f.current);
 }, on = ({
   sdk: e,
   headerNode: s,
   scrollNode: n,
   responsiveStore: o,
-  appNode: i,
-  scrollStore: a
+  appNode: a,
+  scrollStore: r
 }) => {
-  const [l] = E(e.getNotificationsStore()), d = u(l), [r, p] = E(null), c = C(() => e.getActiveNotification(), [e, d]);
+  const [l] = E(e.getNotificationsStore()), d = u(l), [i, c] = E(null), p = w(() => e.getActiveNotification(), [e, d]);
   return k(() => {
-    c && Fe.emit("notification", {
+    p && Ke.emit("notification", {
       action: "rendered",
       payload: {
-        questionId: c.data.questionId,
-        questionType: c.data.questionType
+        questionId: p.data.questionId,
+        questionType: p.data.questionType
       }
     });
-  }, [c]), k(() => {
-    c && (o.get().sdkInDesktopView || o.get().sdkInView) && (!o.get().sdkInDesktopView && o.get().sdkInView && p(c), o.get().sdkInDesktopView && window.requestAnimationFrame(() => {
-      a.get().scrollPosition !== 0 && p(c);
+  }, [p]), k(() => {
+    p && (o.get().sdkInDesktopView || o.get().sdkInView) && (!o.get().sdkInDesktopView && o.get().sdkInView && c(p), o.get().sdkInDesktopView && window.requestAnimationFrame(() => {
+      r.get().scrollPosition !== 0 && c(p);
     }));
-  }, [c]), k(() => {
-    c || p(null);
-  }, [c]), /* @__PURE__ */ m(L, {
-    children: [!r && c && /* @__PURE__ */ t(sn, {
+  }, [p]), k(() => {
+    p || c(null);
+  }, [p]), /* @__PURE__ */ g(D, {
+    children: [!i && p && /* @__PURE__ */ t(sn, {
       headerNode: s,
-      appNode: i,
+      appNode: a,
       sdk: e,
-      notification: c,
+      notification: p,
       responsiveStore: o
-    }), r && /* @__PURE__ */ t(tn, {
-      pill: r,
-      setPill: p,
-      appNode: i,
-      notification: c,
+    }), i && /* @__PURE__ */ t(tn, {
+      pill: i,
+      setPill: c,
+      appNode: a,
+      notification: p,
       headerNode: s,
       scrollNode: n,
-      scrollStore: a,
+      scrollStore: r,
       responsiveStore: o
     })]
   });
-}, rn = (e) => {
-  const s = $(""), [n, o] = E(!1), i = u(e.status), a = u(e.sdkStore.slStreamId), l = u(e.userId()), d = u(e.getActiveFeature()), r = i === "ready" && !!a.data;
+}, an = (e) => {
+  const s = L(""), [n, o] = E(!1), a = u(e.status), r = u(e.sdkStore.slStreamId), l = u(e.userId()), d = u(e.getActiveFeature()), i = a === "ready" && !!r.data;
   k(() => {
-    const v = e.getFeature(D.GAMES);
+    const v = e.getFeature($.GAMES);
     v && (v.closeQuestion(), v.closeUser());
   }, [d, e]);
-  const p = R(
+  const c = V(
     (v) => {
       s.current = v, o(!0), e.initializeApp({ skipOrganizationSettings: !0 }).then(({ enabled: f, err: N }) => {
         if (!N && f) {
@@ -822,12 +834,12 @@ const ds = {
       });
     },
     [e]
-  ), c = R(() => {
+  ), p = V(() => {
     o(!1), e.disableApp();
   }, [e]);
   return k(() => {
     if (!l) {
-      r && e.disableApp();
+      i && e.disableApp();
       return;
     }
     if (l && s.current && n) {
@@ -840,29 +852,29 @@ const ds = {
     o(!1), e.disableApp();
   }, [o, e]), {
     sdkEnabled: n,
-    sdkReady: r,
-    activateEventWithId: p,
-    deactivate: c,
+    sdkReady: i,
+    activateEventWithId: c,
+    deactivate: p,
     isLogged: !!l
   };
-}, an = ({ sdk: e, className: s, scrollStore: n, appNode: o, scrollNode: i, responsiveStore: a }) => {
+}, rn = ({ sdk: e, className: s, scrollStore: n, appNode: o, scrollNode: a, responsiveStore: r }) => {
   const [, l] = je(e);
   return /* @__PURE__ */ t(
-    Cs,
+    ws,
     {
       className: s,
-      scrollNode: i,
+      scrollNode: a,
       appNode: o,
       scrollStore: n,
       feature: l,
-      responsiveStore: a,
+      responsiveStore: r,
       sdk: e
     }
   );
 }, ln = ({ sdk: e, className: s, appNode: n, responsiveStore: o }) => {
-  const i = u(e.featuresList.getStore());
-  return i ? Array.from(i, (a) => {
-    const l = e.getFeature(a);
+  const a = u(e.featuresList.getStore());
+  return a ? Array.from(a, (r) => {
+    const l = e.getFeature(r);
     return l ? /* @__PURE__ */ t(
       $s,
       {
@@ -872,53 +884,53 @@ const ds = {
         responsiveStore: o,
         sdk: e
       },
-      a
+      r
     ) : null;
   }) : null;
 }, dn = ({ sdk: e, event: s }) => {
-  const n = $(null), o = $(null), [i] = Be(n), [a, l] = We(n, i), { sdkEnabled: d, sdkReady: r, activateEventWithId: p, deactivate: c, isLogged: v } = rn(e);
+  const n = L(null), o = L(null), [a] = Be(n), [r, l] = We(n, a), { sdkEnabled: d, sdkReady: i, activateEventWithId: c, deactivate: p, isLogged: v } = an(e);
   k(() => {
-    s ? (e.createEventSession(s), p(s)) : c();
-  }, [s, p, c, e]), _(n, { enabled: d, event: "click", listener: Xe }), _(a, {
+    s ? (e.createEventSession(s), c(s)) : p();
+  }, [s, c, p, e]), _(n, { enabled: d, event: "click", listener: Xe }), _(r, {
     enabled: d,
     event: "scrollend",
     listener: Ye,
     useDomNode: !0
-  }), _(a, {
+  }), _(r, {
     enabled: d,
     event: "click",
     listener: Ze,
     useDomNode: !0
   });
-  const f = C(() => ({ sdk: e }), [e]);
+  const f = w(() => ({ sdk: e }), [e]);
   return k(() => {
     import("./gamification-feature.js");
-  }, []), /* @__PURE__ */ t(ue.Provider, { value: f, children: /* @__PURE__ */ m(Ge, { ref: n, children: [
-    d && /* @__PURE__ */ t(Ts, { className: q, sdk: e, ref: o }),
-    /* @__PURE__ */ m(He, { className: "sl-hide-on-modal", ref: a, "data-nav": d.toString(), children: [
-      r && /* @__PURE__ */ t(
+  }, []), /* @__PURE__ */ t(ve.Provider, { value: f, children: /* @__PURE__ */ g(Ge, { ref: n, children: [
+    d && /* @__PURE__ */ t(Ts, { className: F, sdk: e, ref: o }),
+    /* @__PURE__ */ g(He, { className: "sl-hide-on-modal", ref: r, "data-nav": d.toString(), children: [
+      i && /* @__PURE__ */ t(
         on,
         {
           sdk: e,
-          scrollNode: a,
+          scrollNode: r,
           headerNode: o,
           appNode: n,
           scrollStore: l,
-          responsiveStore: i
+          responsiveStore: a
         }
       ),
-      r && /* @__PURE__ */ t(
-        an,
+      i && /* @__PURE__ */ t(
+        rn,
         {
           scrollStore: l,
-          responsiveStore: i,
-          scrollNode: a,
+          responsiveStore: a,
+          scrollNode: r,
           appNode: n,
-          className: q,
+          className: F,
           sdk: e
         }
       ),
-      r && /* @__PURE__ */ t(ln, { responsiveStore: i, appNode: n, className: q, sdk: e })
+      i && /* @__PURE__ */ t(ln, { responsiveStore: a, appNode: n, className: F, sdk: e })
     ] }),
     d && !v && /* @__PURE__ */ t(
       "div",
@@ -928,19 +940,19 @@ const ds = {
       }
     )
   ] }) });
-}, cn = ({ children: e, style: s }) => /* @__PURE__ */ t("div", { className: "StreamLayerSDKTheme", children: /* @__PURE__ */ t("div", { className: Je, style: s, children: e }) }), fn = () => {
-  const { sdk: e } = z(pe);
+}, cn = ({ children: e, customTheme: s, style: n }) => /* @__PURE__ */ t("div", { className: "StreamLayerSDKTheme", children: /* @__PURE__ */ t("div", { className: ue(Je, s), style: n, children: e }) }), fn = () => {
+  const { sdk: e } = z(he);
   return e;
 }, kn = ({ event: e }) => {
-  const { sdk: s, status: n } = z(pe);
-  if (n === H.UNSET)
+  const { sdk: s, status: n } = z(he);
+  if (n === j.UNSET)
     throw new Error("Wrap app in `StreamLayerProvider`");
-  return n === H.CONNECTED ? /* @__PURE__ */ t("div", { className: "StreamLayerSDK", children: "wait" }) : s === null ? /* @__PURE__ */ t("div", { className: "StreamLayerSDK", children: "sdk not initialized" }) : /* @__PURE__ */ t("div", { className: "StreamLayerSDK", children: /* @__PURE__ */ t(cn, { children: /* @__PURE__ */ t(dn, { sdk: s, event: e }) }) });
+  return n === j.CONNECTED ? /* @__PURE__ */ t("div", { className: "StreamLayerSDK", children: "wait" }) : s === null ? /* @__PURE__ */ t("div", { className: "StreamLayerSDK", children: "sdk not initialized" }) : /* @__PURE__ */ t("div", { className: "StreamLayerSDK", children: /* @__PURE__ */ t(cn, { children: /* @__PURE__ */ t(dn, { sdk: s, event: e }) }) });
 };
 export {
-  mn as E,
-  rn as F,
+  gn as E,
+  an as F,
   kn as S,
-  cn as i,
+  cn as d,
   fn as u
 };