@streamlayer/react-ui 1.31.6 → 1.31.7

package/lib/app/app/Notifications/index.js

@@ -1,45 +1,45 @@
 import { jsxs as w, Fragment as b, jsx as u } from "react/jsx-runtime";
-import { cx as V } from "@linaria/core";
+import { cx as D } from "@linaria/core";
 import { useAppContext as O } from "../useAppContext.js";
 import { scrollIntoAppView as T } from "../../useSdkScroll.js";
-import { useState as k, useMemo as D, useEffect as h, useRef as E, useCallback as I } from "react";
-import { r as q } from "../../../index-DALxy-8N.js";
+import { useState as k, useMemo as V, useEffect as h, useRef as q, useCallback as I } from "react";
+import { createPortal as E } from "react-dom";
 import { useStore as y } from "@streamlayer/react-polyfills";
 import { eventBus as R } from "@streamlayer/sdk-web-interfaces";
 import { NotificationType as p } from "@streamlayer/sdk-web-notifications";
 import { QuestionTypeData as A } from "../../../ui/gamification/constants.js";
 import { Notification as N } from "../../../ui/gamification/question/notification/index.js";
 import { PredictionResult as C } from "../../../ui/gamification/question/notification/prediction-result/index.js";
-import { Onboarding as x } from "./Onboarding/index.js";
-import { HiddenContainer as P, Container as z, InnerContainer as B, NotificationRefreshing as H, Pill as S } from "./styles.js";
-const v = (n) => {
-  const [e, d] = k(0), i = E(null), l = D(() => new ResizeObserver((r) => {
+import { Onboarding as P } from "./Onboarding/index.js";
+import { HiddenContainer as x, Container as z, InnerContainer as B, NotificationRefreshing as H, Pill as S } from "./styles.js";
+const v = (r) => {
+  const [e, d] = k(0), i = q(null), l = V(() => new ResizeObserver((n) => {
     window.requestAnimationFrame(() => {
       var f;
-      if (Array.isArray(r)) {
-        for (const c of r)
+      if (Array.isArray(n)) {
+        for (const c of n)
           if (c.contentBoxSize) {
             const o = (f = i.current) == null ? void 0 : f.getBoundingClientRect();
             o && d(o.height);
           }
       }
     });
-  }), []), s = I((r) => {
-    i.current = r;
-  }, []), a = I((r) => {
-    d(r);
+  }), []), s = I((n) => {
+    i.current = n;
+  }, []), a = I((n) => {
+    d(n);
   }, []);
   return h(() => {
-    const r = i.current;
-    return r ? (l.observe(r), () => {
-      l.unobserve(r);
+    const n = i.current;
+    return n ? (l.observe(n), () => {
+      l.unobserve(n);
     }) : () => {
     };
-  }, [n]), h(() => () => {
+  }, [r]), h(() => () => {
     l.disconnect();
   }), [s, e, a];
 }, Q = ({
-  sdk: n,
+  sdk: r,
   notification: e,
   appNode: d,
   responsiveStore: i,
@@ -52,11 +52,11 @@ const v = (n) => {
     keys: ["sdkInDesktopView"]
   }), {
     sdk: a
-  } = O(), [r, f, c] = v(e.id);
+  } = O(), [n, f, c] = v(e.id);
   let o = f;
   return l || (o = "auto"), e.type === p.QUESTION ? /* @__PURE__ */ w(b, {
-    children: [/* @__PURE__ */ u(P, {
-      ref: r,
+    children: [/* @__PURE__ */ u(x, {
+      ref: n,
       children: /* @__PURE__ */ u(N, {
         ...e
       })
@@ -83,19 +83,19 @@ const v = (n) => {
     close: e.close,
     hiding: e.hiding,
     ...e.data.question
-  }) : e.type === p.ONBOARDING ? /* @__PURE__ */ u(x, {
+  }) : e.type === p.ONBOARDING ? /* @__PURE__ */ u(P, {
     style: {
       height: e.hiding ? 0 : o
     },
     saveHeight: c,
-    sdk: n,
+    sdk: r,
     notification: e,
     sdkInDesktopView: s,
     appNode: d,
     responsiveStore: i
   }) : null;
 }, F = "p7vfi6t", U = ({
-  pill: n,
+  pill: r,
   setPill: e,
   appNode: d,
   headerNode: i,
@@ -105,7 +105,7 @@ const v = (n) => {
 }) => {
   var t, m;
   const {
-    screen: r
+    screen: n
   } = y(s, {
     keys: ["screen"]
   }), {
@@ -118,22 +118,22 @@ const v = (n) => {
     s.get().sdkInDesktopView ? c < 50 && e(null) : c > -50 && e(null);
   }, [c, s, e]);
   const o = s.get().sdkInDesktopView ? d : i;
-  return !n || !o.current ? null : q.createPortal(/* @__PURE__ */ u(S, {
-    title: n.type === p.QUESTION_RESOLVED ? "Prediction result" : `New ${((m = A[(t = n.data) == null ? void 0 : t.questionType]) == null ? void 0 : m.label) || "notification"}`,
+  return !r || !o.current ? null : E(/* @__PURE__ */ u(S, {
+    title: r.type === p.QUESTION_RESOLVED ? "Prediction result" : `New ${((m = A[(t = r.data) == null ? void 0 : t.questionType]) == null ? void 0 : m.label) || "notification"}`,
     "data-a": "intr",
     onClick: () => {
       var g;
       s.get().sdkInDesktopView ? (g = l.current) == null || g.scrollTo({
         top: 0,
         behavior: "smooth"
-      }) : T(d, r.size, {
+      }) : T(d, n.size, {
         behavior: "smooth"
       }), e(null);
     },
-    className: V(f && F, "sl-pill-button")
+    className: D(f && F, "sl-pill-button")
   }), o.current);
-}, re = ({
-  sdk: n,
+}, ne = ({
+  sdk: r,
   headerNode: e,
   scrollNode: d,
   responsiveStore: i,
@@ -141,7 +141,7 @@ const v = (n) => {
   scrollStore: s,
   hasActiveFeature: a
 }) => {
-  const [r] = k(n.getNotificationsStore()), f = y(r), [c, o] = k(null), t = D(() => n.getActiveNotification(), [n, f]);
+  const [n] = k(r.getNotificationsStore()), f = y(n), [c, o] = k(null), t = V(() => r.getActiveNotification(), [r, f]);
   return h(() => {
     t && R.emit("notification", {
       action: "rendered",
@@ -163,7 +163,7 @@ const v = (n) => {
   }, [t]), /* @__PURE__ */ w(b, {
     children: [!c && t && /* @__PURE__ */ u(Q, {
       appNode: l,
-      sdk: n,
+      sdk: r,
       hasActiveFeature: a,
       notification: t,
       responsiveStore: i
@@ -180,5 +180,5 @@ const v = (n) => {
   });
 };
 export {
-  re as SDKNotifications
+  ne as SDKNotifications
 };

package/lib/app/masters/Notifications/index.js

@@ -1,32 +1,32 @@
 import { jsxs as f, Fragment as D, jsx as l } from "react/jsx-runtime";
 import { cx as T } from "@linaria/core";
 import { useMastersContext as q } from "../useMastersContext.js";
-import { scrollIntoAppView as E } from "../useSdkScroll.js";
-import { useState as p, useMemo as O, useEffect as a, useRef as b, useCallback as N } from "react";
-import { r as R } from "../../../index-DALxy-8N.js";
+import { scrollIntoAppView as O } from "../useSdkScroll.js";
+import { useState as p, useMemo as b, useEffect as g, useRef as E, useCallback as N } from "react";
+import { createPortal as R } from "react-dom";
 import { useStore as y } from "@streamlayer/react-polyfills";
 import { eventBus as C } from "@streamlayer/sdk-web-interfaces";
-import { NotificationType as g } from "@streamlayer/sdk-web-notifications";
+import { NotificationType as a } from "@streamlayer/sdk-web-notifications";
 import { QuestionTypeData as P } from "../../../ui/gamification/constants.js";
 import { Notification as V } from "../../../ui/gamification/question/notification/index.js";
 import { PredictionResult as x } from "../../../ui/gamification/question/notification/prediction-result/index.js";
 import { Onboarding as A } from "./Onboarding/index.js";
 import { HiddenContainer as B, Container as H, InnerContainer as Q, NotificationRefreshing as U, Pill as j } from "./styles.js";
-const z = (n) => {
-  const [t, c] = p(0), u = b(null), e = N((o) => {
-    u.current = o;
+const z = (o) => {
+  const [t, c] = p(0), u = E(null), e = N((n) => {
+    u.current = n;
   }, []);
-  a(() => {
+  g(() => {
     var s;
-    const o = (s = u.current) == null ? void 0 : s.getBoundingClientRect();
-    o && c(o.height);
-  }, [n]);
-  const r = N((o) => {
-    c(o);
+    const n = (s = u.current) == null ? void 0 : s.getBoundingClientRect();
+    n && c(n.height);
+  }, [o]);
+  const r = N((n) => {
+    c(n);
   }, []);
   return [e, t, r];
 }, F = ({
-  sdk: n,
+  sdk: o,
   notification: t,
   appNode: c,
   responsiveStore: u
@@ -34,8 +34,8 @@ const z = (n) => {
   var h, d;
   const {
     sdk: e
-  } = q(), [r, o, s] = z(t.id);
-  return t.type === g.QUESTION ? /* @__PURE__ */ f(D, {
+  } = q(), [r, n, s] = z(t.id);
+  return t.type === a.QUESTION ? /* @__PURE__ */ f(D, {
     children: [/* @__PURE__ */ l(B, {
       ref: r,
       children: /* @__PURE__ */ l(V, {
@@ -43,7 +43,7 @@ const z = (n) => {
       })
     }), /* @__PURE__ */ f(H, {
       style: {
-        height: t.hiding ? 0 : o
+        height: t.hiding ? 0 : n
       },
       hiding: t.hiding,
       children: [/* @__PURE__ */ l(Q, {
@@ -56,33 +56,33 @@ const z = (n) => {
         })
       }), /* @__PURE__ */ l(U, {}, t.id)]
     })]
-  }) : t.type === g.QUESTION_RESOLVED && ((d = (h = t.data) == null ? void 0 : h.question) != null && d.predictionResult) ? /* @__PURE__ */ l(x, {
+  }) : t.type === a.QUESTION_RESOLVED && ((d = (h = t.data) == null ? void 0 : h.question) != null && d.predictionResult) ? /* @__PURE__ */ l(x, {
     style: {
-      height: t.hiding ? 0 : o
+      height: t.hiding ? 0 : n
     },
     saveHeight: s,
     close: t.close,
     hiding: t.hiding,
     ...t.data.question,
     mastersApp: !0
-  }) : t.type === g.ONBOARDING ? /* @__PURE__ */ l(A, {
+  }) : t.type === a.ONBOARDING ? /* @__PURE__ */ l(A, {
     style: {
-      height: t.hiding ? 0 : o
+      height: t.hiding ? 0 : n
     },
     saveHeight: s,
-    sdk: n,
+    sdk: o,
     notification: t,
     appNode: c,
     responsiveStore: u
   }) : null;
 }, L = "p1co32q0", M = ({
-  pill: n,
+  pill: o,
   setPill: t,
   appNode: c,
   headerNode: u,
   scrollNode: e,
   responsiveStore: r,
-  scrollStore: o,
+  scrollStore: n,
   useContainer: s
 }) => {
   var I, k;
@@ -93,37 +93,37 @@ const z = (n) => {
   }), {
     tabsShown: d,
     scrollPosition: m
-  } = y(o, {
+  } = y(n, {
     keys: ["tabsShown", "scrollPosition"]
   });
-  a(() => {
+  g(() => {
     r.get().sdkInDesktopView || s ? m < 50 && t(null) : m > -50 && t(null);
   }, [m, r, t, s]);
   const i = r.get().sdkInDesktopView ? c : u;
-  return !n || !i.current ? null : R.createPortal(/* @__PURE__ */ l(j, {
-    title: n.type === g.QUESTION_RESOLVED ? "Prediction result" : `New ${((k = P[(I = n.data) == null ? void 0 : I.questionType]) == null ? void 0 : k.label) || "notification"}`,
+  return !o || !i.current ? null : R(/* @__PURE__ */ l(j, {
+    title: o.type === a.QUESTION_RESOLVED ? "Prediction result" : `New ${((k = P[(I = o.data) == null ? void 0 : I.questionType]) == null ? void 0 : k.label) || "notification"}`,
     onClick: () => {
       var w;
       r.get().sdkInDesktopView ? (w = e.current) == null || w.scrollTo({
         top: 0,
         behavior: "smooth"
-      }) : E(e, h.size, {
+      }) : O(e, h.size, {
         behavior: "smooth"
       }), t(null);
     },
     className: T(d && L, "sl-pill-button")
   }), i.current);
-}, ot = ({
-  sdk: n,
+}, nt = ({
+  sdk: o,
   headerNode: t,
   scrollNode: c,
   useContainer: u,
   responsiveStore: e,
   appNode: r,
-  scrollStore: o
+  scrollStore: n
 }) => {
-  const [s] = p(n.getNotificationsStore()), h = y(s), [d, m] = p(null), i = O(() => n.getActiveNotification(), [n, h]);
-  return a(() => {
+  const [s] = p(o.getNotificationsStore()), h = y(s), [d, m] = p(null), i = b(() => o.getActiveNotification(), [o, h]);
+  return g(() => {
     i && C.emit("notification", {
       action: "rendered",
       payload: {
@@ -131,17 +131,17 @@ const z = (n) => {
         questionType: i.data.questionType
       }
     });
-  }, [i]), a(() => {
+  }, [i]), g(() => {
     i && (e.get().sdkInDesktopView || e.get().sdkInView) && (!e.get().sdkInDesktopView && e.get().sdkInView && m(i), e.get().sdkInDesktopView && window.requestAnimationFrame(() => {
-      o.get().scrollPosition !== 0 && m(i);
+      n.get().scrollPosition !== 0 && m(i);
     }));
-  }, [i]), a(() => {
+  }, [i]), g(() => {
     i || m(null);
   }, [i]), /* @__PURE__ */ f(D, {
     children: [!d && i && /* @__PURE__ */ l(F, {
       headerNode: t,
       appNode: r,
-      sdk: n,
+      sdk: o,
       notification: i,
       responsiveStore: e
     }), d && /* @__PURE__ */ l(M, {
@@ -151,12 +151,12 @@ const z = (n) => {
       notification: i,
       headerNode: t,
       scrollNode: c,
-      scrollStore: o,
+      scrollStore: n,
       useContainer: u,
       responsiveStore: e
     })]
   });
 };
 export {
-  ot as SDKNotifications
+  nt as SDKNotifications
 };

package/lib/app/useClipboardCopy.js

@@ -1,15 +1,15 @@
 import { jsx as u } from "react/jsx-runtime";
-import { useRef as l, useState as s, useCallback as p, useEffect as f } from "react";
-import { r as m } from "../index-DALxy-8N.js";
+import { useRef as l, useState as s, useCallback as f, useEffect as p } from "react";
+import { createPortal as m } from "react-dom";
 import { CopyNotification as b } from "../ui/gamification/copyNotification/index.js";
 const T = (r) => {
-  const t = l(), [i, o] = s(null), a = p(
+  const t = l(), [c, o] = s(null), a = f(
     async (e) => {
-      var c;
-      if (e && ((c = navigator == null ? void 0 : navigator.clipboard) != null && c.writeText)) {
+      var i;
+      if (e && ((i = navigator == null ? void 0 : navigator.clipboard) != null && i.writeText)) {
         t.current && (clearTimeout(t.current), o(null));
         try {
-          await navigator.clipboard.writeText(e), r.current && (o(m.createPortal(/* @__PURE__ */ u(b, {}), r.current)), t.current = setTimeout(() => {
+          await navigator.clipboard.writeText(e), r.current && (o(m(/* @__PURE__ */ u(b, {}), r.current)), t.current = setTimeout(() => {
             o(null);
           }, 1e3));
         } catch (n) {
@@ -19,9 +19,9 @@ const T = (r) => {
     },
     [r]
   );
-  return f(() => () => {
+  return p(() => () => {
     clearTimeout(t.current);
-  }, []), [a, i];
+  }, []), [a, c];
 };
 export {
   T as useClipboardCopy

package/lib/ui/advertisement/overlay/externalAd/vast-player/useGAMPlayer.js

@@ -3,7 +3,8 @@ import { useRef as Qr, useCallback as Ui, useEffect as js } from "react";
 import { D as gg } from "../../../../../index-l-eyvmpL.js";
 import { useVastAds as mg } from "./useVastAds.js";
 import { m as _g } from "../../../../../index-DSi8Qgfs.js";
-var tn = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {};
+const tn = globalThis || void 0 || self;
+var sn = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {};
 function nr(s) {
   return s && s.__esModule && Object.prototype.hasOwnProperty.call(s, "default") ? s.default : s;
 }
@@ -26,15 +27,14 @@ function yg(s) {
     });
   }), t;
 }
-const sn = globalThis || void 0 || self;
 var Hs;
-typeof window < "u" ? Hs = window : typeof tn < "u" ? Hs = tn : typeof self < "u" ? Hs = self : Hs = {};
+typeof window < "u" ? Hs = window : typeof sn < "u" ? Hs = sn : typeof self < "u" ? Hs = self : Hs = {};
 var In = Hs;
 const A = /* @__PURE__ */ nr(In), Tg = {}, bg = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   default: Tg
 }, Symbol.toStringTag, { value: "Module" })), vg = /* @__PURE__ */ yg(bg);
-var Xl = typeof tn < "u" ? tn : typeof window < "u" ? window : {}, xg = vg, Vs;
+var Xl = typeof sn < "u" ? sn : typeof window < "u" ? window : {}, xg = vg, Vs;
 typeof document < "u" ? Vs = document : (Vs = Xl["__GLOBAL_DOCUMENT_CACHE@4"], Vs || (Vs = Xl["__GLOBAL_DOCUMENT_CACHE@4"] = xg));
 var dc = Vs;
 const W = /* @__PURE__ */ nr(dc);
@@ -21683,7 +21683,7 @@ browserWorkerPolyFill(self);
 }, Od = function(s) {
   return s.toString().replace(/^function.+?{/, "").slice(0, -1);
 }, ST = Ld(Od(function() {
-  var s = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof sn < "u" ? sn : typeof self < "u" ? self : {}, e = function() {
+  var s = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof tn < "u" ? tn : typeof self < "u" ? self : {}, e = function() {
     this.init = function() {
       var o = {};
       this.on = function(u, c) {
@@ -30187,7 +30187,7 @@ const Ab = Ld(Od(function() {
       };
     }
   }
-  var f = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof sn < "u" ? sn : typeof self < "u" ? self : {}, g;
+  var f = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof tn < "u" ? tn : typeof self < "u" ? self : {}, g;
   typeof window < "u" ? g = window : typeof f < "u" ? g = f : typeof self < "u" ? g = self : g = {};
   var T = g, w = function(M) {
     return ArrayBuffer.isView === "function" ? ArrayBuffer.isView(M) : M && M.buffer instanceof ArrayBuffer;

package/lib/ui/modal/index.js

@@ -1,8 +1,8 @@
 import { jsxs as c, Fragment as h, jsx as l } from "react/jsx-runtime";
 import { styled as y } from "@linaria/react";
-import { useState as d, useEffect as a } from "react";
-import { r as u } from "../../index-DALxy-8N.js";
-import { BREAKPOINTS as m } from "../theme/constants.js";
+import { useState as d, useEffect as u } from "react";
+import { createPortal as a } from "react-dom";
+import { BREAKPOINTS as f } from "../theme/constants.js";
 import { hideContentStyles as O } from "../theme/utils.js";
 const S = /* @__PURE__ */ y("div")({
   name: "StaticContainer",
@@ -12,49 +12,49 @@ const S = /* @__PURE__ */ y("div")({
   .sl-pill-button {
     display: none !important;
   }
-`, p = () => window.innerWidth >= m.md && window.innerWidth < m.lg ? 76 : 53, f = (e) => {
-  var r;
+`, p = () => window.innerWidth >= f.md && window.innerWidth < f.lg ? 76 : 53, m = (e) => {
+  var n;
   const t = p();
-  return Math.round((((r = e.current) == null ? void 0 : r.getBoundingClientRect().y) || 0) - t) <= 0;
-}, R = ({
+  return Math.round((((n = e.current) == null ? void 0 : n.getBoundingClientRect().y) || 0) - t) <= 0;
+}, T = ({
   children: e,
   container: t,
-  useContainer: r,
+  useContainer: n,
   staticStyles: w
 }) => {
-  const [s] = d(() => f(t)), [n, i] = d(!1);
-  return a(() => {
+  const [s] = d(() => m(t)), [r, i] = d(!1);
+  return u(() => {
     if (!t.current || !s)
       return i(!0), () => {
       };
     const o = window.scrollY;
     return i(!0), () => {
-      f(t) && window.scrollTo({
+      m(t) && window.scrollTo({
         top: o,
         behavior: "instant"
       });
     };
-  }, []), a(() => {
-    if (n && t.current && s) {
+  }, []), u(() => {
+    if (r && t.current && s) {
       const o = p();
       window.scrollTo({
         top: t.current.offsetTop - o,
         behavior: "instant"
       });
     }
-  }, [n]), !t.current || !n ? null : r ? u.createPortal(/* @__PURE__ */ c(S, {
+  }, [r]), !t.current || !r ? null : n ? a(/* @__PURE__ */ c(S, {
     className: "StaticContainer",
     children: [e, /* @__PURE__ */ l("style", {
       children: O
     }), /* @__PURE__ */ l("style", {
       children: C
     })]
-  }), t.current, "modal-node") : u.createPortal(/* @__PURE__ */ c(h, {
+  }), t.current, "modal-node") : a(/* @__PURE__ */ c(h, {
     children: [e, /* @__PURE__ */ l("style", {
       children: w
     })]
   }), t.current, "modal-node");
 };
 export {
-  R as ModalPortal
+  T as ModalPortal
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@streamlayer/react-ui",
-  "version": "1.31.6",
+  "version": "1.31.7",
   "type": "module",
   "main": "./src/index.js",
   "typings": "./lib/index.d.ts",
@@ -76,7 +76,7 @@
   ],
   "peerDependencies": {
     "@lottiefiles/react-lottie-player": "^3.5.4",
-    "@streamlayer/sl-eslib": "^5.219.0",
+    "@streamlayer/sl-eslib": "^5.221.0",
     "@types/lodash.throttle": "^4.1.9",
     "lodash.throttle": "^4.1.1",
     "react-infinite-scroller": "^1.2.6",
@@ -85,19 +85,19 @@
     "@noriginmedia/norigin-spatial-navigation": "^2.3.0",
     "react-window-infinite-loader": "^1.0.9",
     "uuid": "^11.1.0",
-    "@streamlayer/feature-gamification": "^1.22.8",
-    "@streamlayer/react-polyfills": "^0.1.43",
-    "@streamlayer/sdk-web": "^1.15.8",
-    "@streamlayer/sdk-web-analytics": "^1.12.8",
-    "@streamlayer/sdk-web-anonymous-auth": "^1.2.8",
-    "@streamlayer/sdk-web-api": "^1.13.8",
-    "@streamlayer/sdk-web-core": "^1.16.8",
-    "@streamlayer/sdk-web-features": "^1.0.83",
-    "@streamlayer/sdk-web-logger": "^1.0.83",
-    "@streamlayer/sdk-web-interfaces": "^1.7.16",
-    "@streamlayer/sdk-web-notifications": "^1.3.45",
-    "@streamlayer/sdk-web-storage": "^1.0.83",
-    "@streamlayer/sdk-web-types": "^1.15.8"
+    "@streamlayer/feature-gamification": "^1.22.9",
+    "@streamlayer/react-polyfills": "^0.1.44",
+    "@streamlayer/sdk-web": "^1.15.9",
+    "@streamlayer/sdk-web-analytics": "^1.12.9",
+    "@streamlayer/sdk-web-anonymous-auth": "^1.2.9",
+    "@streamlayer/sdk-web-api": "^1.13.9",
+    "@streamlayer/sdk-web-core": "^1.16.9",
+    "@streamlayer/sdk-web-features": "^1.0.84",
+    "@streamlayer/sdk-web-interfaces": "^1.7.17",
+    "@streamlayer/sdk-web-logger": "^1.0.84",
+    "@streamlayer/sdk-web-notifications": "^1.3.46",
+    "@streamlayer/sdk-web-storage": "^1.0.84",
+    "@streamlayer/sdk-web-types": "^1.15.9"
   },
   "nx": {
     "implicitDependencies": [
@@ -126,6 +126,7 @@
     "glob": "^11.0.0",
     "hls.js": "^1.6.13",
     "react": "18.3.1",
+    "react-dom": "18.3.1",
     "react-auth-code-input": "^3.2.1",
     "react-countdown-circle-timer": "^3.2.1",
     "react-countup": "^6.5.3",
@@ -138,7 +139,7 @@
     "vite-plugin-svgr": "^4.2.0",
     "vite-svg-loader": "^5.1.0",
     "vite-tsconfig-paths": "^5.0.1",
-    "@streamlayer/react": "^1.20.6"
+    "@streamlayer/react": "^1.20.7"
   },
   "dependencies": {
     "@dailymotion/vast-client": "^6.4.2",