@streamlayer/react 1.24.7 → 1.24.8-pre.84ab1b9

package/lib/es/masters2.js

@@ -1,21 +1,21 @@
 import { jsx as n, jsxs as f, Fragment as I } from "react/jsx-runtime";
-import { s as c, u as p, F as J, c as S, N as T } from "./feature.js";
+import { s as c, u as p, F as J, c as g, N as T } from "./feature.js";
 import D from "lodash.throttle";
-import { useRef as g, useState as L, useEffect as E, createContext as e2, useContext as U, useMemo as _, Suspense as s2, lazy as t2, forwardRef as n2, useLayoutEffect as r2, useCallback as b, Component as i2 } from "react";
-import { A as h, R as o2 } from "./index8.js";
-import { f as G, A as M, a as Q } from "./analytics.js";
-import { Q as a2, z as l2, T as K, I as d2, c as c2, n as C2, f as p2, w as B, a as u2, p as m2 } from "./index16.js";
+import { useRef as S, useState as L, useEffect as E, createContext as e2, useContext as U, useMemo as _, Suspense as s2, lazy as t2, forwardRef as n2, useLayoutEffect as r2, useCallback as b, Component as i2 } from "react";
+import { A as h, R as o2 } from "./index9.js";
+import { f as G, c as a2, A as M, a as Q } from "./analytics.js";
+import { Q as l2, z as d2, T as K, I as c2, n as C2, f as p2, w as B, a as u2, p as m2 } from "./index16.js";
 import { m as A } from "./theme.js";
 import { a as f2 } from "./index4.js";
 import { Q as E2, Z as L2, y as h2, f as F } from "./index13.js";
-import { O as g2, d as S2, f as _2, a as N2 } from "./index12.js";
+import { O as S2, d as g2, f as _2, a as N2 } from "./index12.js";
 import { Q as T2, S as N } from "./useStreamLayerApp2.js";
-import { B as x } from "./index7.js";
+import { M as x } from "./index5.js";
 import { createPortal as I2 } from "react-dom";
 import { e as v2 } from "./index3.js";
 import "./storage.js";
 import { e as R2 } from "./index10.js";
-import { V as A2, g as y2, i as k2, j as D2 } from "./hooks-n9ax4LRT.js";
+import { _ as A2, j as y2, i as k2, k as D2 } from "./hooks-DHRXtbBc.js";
 const b2 = /* @__PURE__ */ c("div")({
   name: "SDKContainer",
   class: "s8zgqze",
@@ -46,7 +46,7 @@ const b2 = /* @__PURE__ */ c("div")({
     ...t
   });
 }, H2 = 15, $2 = (s, e, t) => {
-  const r = g(null), i = g(0), [a] = L(
+  const r = S(null), i = S(0), [a] = L(
     G({
       scrollPosition: 0,
       tabsShown: !1,
@@ -62,7 +62,7 @@ const b2 = /* @__PURE__ */ c("div")({
       const C = m.target;
       if (!C)
         return;
-      let d = 0;
+      let d;
       o.screen.size < h.lg && !t ? d = s.current?.getBoundingClientRect().y || 0 : d = C.scrollTop;
       const v = i.current - d;
       if (H2 > Math.abs(v))
@@ -154,7 +154,7 @@ const b2 = /* @__PURE__ */ c("div")({
     return null;
   const r = e.type;
   return /* @__PURE__ */ f(G2, {
-    children: [/* @__PURE__ */ n(g2, {
+    children: [/* @__PURE__ */ n(S2, {
       close: s.closeQuestion,
       type: e.attributes?.type || T2.UNSET,
       mastersApp: !0
@@ -164,7 +164,7 @@ const b2 = /* @__PURE__ */ c("div")({
       extendedQuestion: t
     }), r !== "question" && /* @__PURE__ */ n(M2, {
       openedQuestion: e
-    }), /* @__PURE__ */ n(S2, {
+    }), /* @__PURE__ */ n(g2, {
       mastersApp: !0
     })]
   });
@@ -172,11 +172,11 @@ const b2 = /* @__PURE__ */ c("div")({
   const { sdk: r } = O(), i = p(s);
   return E(() => {
     t.set(!0);
-  }, [t]), /* @__PURE__ */ n(a2, { openQuestion: e, questions: i.data, controlVideo: r?.controlVideoPlayer });
+  }, [t]), /* @__PURE__ */ n(l2, { openQuestion: e, questions: i.data, controlVideo: r?.controlVideoPlayer });
 }, Z2 = ({ userSummary: s }) => {
   const e = p(s.$store);
   return /* @__PURE__ */ n(
-    l2,
+    d2,
     {
       hideFriendsRank: !0,
       loading: !e?.summary,
@@ -269,7 +269,7 @@ const b2 = /* @__PURE__ */ c("div")({
 }), r0 = "hlc2pcy", i0 = n2(({
   className: s
 }, e) => /* @__PURE__ */ f(s0, {
-  className: S(s, r0),
+  className: g(s, r0),
   children: [/* @__PURE__ */ n(t0, {
     children: /* @__PURE__ */ f(n0, {
       children: [/* @__PURE__ */ n(x, {
@@ -346,7 +346,7 @@ const b2 = /* @__PURE__ */ c("div")({
   name: "OnboardingContainer",
   class: "on59ra",
   propsAsIs: !1
-}), h0 = () => F, g0 = /* @__PURE__ */ c(h0())({
+}), h0 = () => F, S0 = /* @__PURE__ */ c(h0())({
   name: "OnboardingNotificationContainer",
   class: "op1wk5d",
   propsAsIs: !0
@@ -354,7 +354,7 @@ const b2 = /* @__PURE__ */ c("div")({
   name: "InnerContainer",
   class: "i1i1g2vj",
   propsAsIs: !1
-}), S0 = ({
+}), g0 = ({
   deepLink: s,
   onboardingOpts: e,
   notification: t,
@@ -362,7 +362,7 @@ const b2 = /* @__PURE__ */ c("div")({
   loading: i,
   sdk: a
 }) => {
-  const o = p(r.friends ? r.friends.getStore() : c2({
+  const o = p(r.friends ? r.friends.getStore() : a2({
     data: []
   })), [l, u] = L(void 0), m = _(() => {
     const C = a.getInviter();
@@ -416,7 +416,7 @@ const b2 = /* @__PURE__ */ c("div")({
   appNode: i,
   responsiveStore: a
 }) => {
-  const o = g(null), l = e.data.onboarding, [u, m] = L(l?.instantOpen), C = s.getFeature(N.GAMES), d = _(() => Y?.map(({
+  const o = S(null), l = e.data.onboarding, [u, m] = L(l?.instantOpen), C = s.getFeature(N.GAMES), d = _(() => Y?.map(({
     graphicSrc: X
   }) => X), []), {
     screen: v
@@ -429,11 +429,11 @@ const b2 = /* @__PURE__ */ c("div")({
   const {
     loading: R,
     throttled: W
-  } = d2(d);
+  } = c2(d);
   return u && C && l && i.current && !W ? /* @__PURE__ */ n(K, {
     container: i,
     useContainer: !1,
-    children: /* @__PURE__ */ n(S0, {
+    children: /* @__PURE__ */ n(g0, {
       notification: e,
       setOpened: m,
       gamification: C,
@@ -456,7 +456,7 @@ const b2 = /* @__PURE__ */ c("div")({
         },
         onboarding: l
       })
-    }), /* @__PURE__ */ n(g0, {
+    }), /* @__PURE__ */ n(S0, {
       style: r,
       hiding: e.hiding,
       children: /* @__PURE__ */ n(w, {
@@ -493,7 +493,7 @@ const b2 = /* @__PURE__ */ c("div")({
   class: "pht79xf",
   propsAsIs: !0
 }), k0 = (s) => {
-  const [e, t] = L(0), r = g(null), i = b((o) => {
+  const [e, t] = L(0), r = S(null), i = b((o) => {
     r.current = o;
   }, []);
   E(() => {
@@ -587,7 +587,7 @@ const b2 = /* @__PURE__ */ c("div")({
         behavior: "smooth"
       }), e(null);
     },
-    className: S(m && b0, "sl-pill-button")
+    className: g(m && b0, "sl-pill-button")
   }), d.current);
 }, O0 = ({
   sdk: s,
@@ -741,7 +741,7 @@ Object.entries(V0).reduce((s, [e, t]) => `
     ${s}
     --color-${e.toLowerCase().replaceAll("_", "-")}: ${t};
   `, "");
-const w0 = "m1ojpy2l", P0 = ({ children: s, style: e }) => /* @__PURE__ */ n("div", { className: "StreamLayerSDKTheme", children: /* @__PURE__ */ n("div", { className: S("masters-theme", w0), style: e, children: s }) }), d1 = ({ sdkKey: s, plugins: e, children: t, event: r, onDeepLinkHandled: i, videoPlayerController: a, production: o = !0 }) => /* @__PURE__ */ f(
+const w0 = "m1ojpy2l", P0 = ({ children: s, style: e }) => /* @__PURE__ */ n("div", { className: "StreamLayerSDKTheme", children: /* @__PURE__ */ n("div", { className: g("masters-theme", w0), style: e, children: s }) }), d1 = ({ sdkKey: s, plugins: e, children: t, event: r, onDeepLinkHandled: i, videoPlayerController: a, production: o = !0 }) => /* @__PURE__ */ f(
   A2,
   {
     sdkKey: s,
@@ -779,10 +779,10 @@ const w0 = "m1ojpy2l", P0 = ({ children: s, style: e }) => /* @__PURE__ */ n("di
     ) : null;
   }) : null;
 }, U0 = (s) => {
-  const e = g(null);
+  const e = S(null);
   return M(e, { enabled: !0, event: "click", listener: Q }), /* @__PURE__ */ n(f2, { ref: e, ...s });
 }, G0 = ({ sdk: s, useContainer: e }) => {
-  const t = g(null), r = p(s.status), i = p(s.sdkStore.slStreamId), a = g(null), [o] = B0(t), [l, u] = $2(t, o, e), m = r === "ready" && !!i.data;
+  const t = S(null), r = p(s.status), i = p(s.sdkStore.slStreamId), a = S(null), [o] = B0(t), [l, u] = $2(t, o, e), m = r === "ready" && !!i.data;
   return E(() => {
     window.requestAnimationFrame(() => {
       s.initializeApp().then(() => {
@@ -791,8 +791,8 @@ const w0 = "m1ojpy2l", P0 = ({ children: s, style: e }) => /* @__PURE__ */ n("di
     });
   }, [s]), M(t, { enabled: !0, event: "click", listener: Q }), E(() => {
     import("./gamification-feature2.js");
-  }, []), /* @__PURE__ */ f(b2, { className: S("SDKContainer", !e && F2), ref: t, children: [
-    /* @__PURE__ */ n(i0, { className: S(A), ref: a }),
+  }, []), /* @__PURE__ */ f(b2, { className: g("SDKContainer", !e && F2), ref: t, children: [
+    /* @__PURE__ */ n(i0, { className: g(A), ref: a }),
     /* @__PURE__ */ f(O2, { className: "sl-hide-on-modal", ref: l, children: [
       m && /* @__PURE__ */ n(
         O0,

package/lib/es/notification.js

@@ -1,16 +1,16 @@
 import { jsxs as l, jsx as s } from "react/jsx-runtime";
-import { h as us } from "./index6.js";
-import { useState as I, useRef as Q, useEffect as $, useCallback as As, useMemo as fs } from "react";
+import { h as us } from "./index7.js";
+import { useState as I, useRef as W, useEffect as $, useCallback as As, useMemo as fs } from "react";
 import { s as e, c as hs, u as Is, N as M } from "./feature.js";
 import { e as $s } from "./index3.js";
-import { x as W } from "./storage.js";
+import { x as _ } from "./storage.js";
 import { D as vs, j as gs, e as K, o as ws } from "./index10.js";
-import { B as A } from "./index7.js";
-import { d, Q as f, a as G, N as x, S as bs, A as R } from "./useStreamLayerApp2.js";
-import { b as S } from "./index8.js";
+import { M as A } from "./index5.js";
+import { f as d, Q as f, b as G, N as x, S as bs, A as R } from "./useStreamLayerApp2.js";
+import { b as S } from "./index9.js";
 import { V as Ts, y as ys } from "./index14.js";
 import { p as Cs } from "./index11.js";
-import { Y as Ns, _ as ks, q as qs } from "./hooks-n9ax4LRT.js";
+import { w as Ns, q as ks, z as qs } from "./hooks-DHRXtbBc.js";
 const w = /* @__PURE__ */ e("div")({
   name: "Media",
   class: "m1bcvojl",
@@ -85,15 +85,15 @@ const w = /* @__PURE__ */ e("div")({
   name: "Button",
   class: "b14ivj5k",
   propsAsIs: !1
-}), Ys = () => A, _s = /* @__PURE__ */ e(Ys())({
+}), Ys = () => A, Qs = /* @__PURE__ */ e(Ys())({
   name: "StyledChevronRight",
   class: "s1atci8n",
   propsAsIs: !0
-}), Qs = /* @__PURE__ */ e("div")({
+}), Ws = /* @__PURE__ */ e("div")({
   name: "QuoteWrap",
   class: "q4w8jgs",
   propsAsIs: !1
-}), Ws = /* @__PURE__ */ e("blockquote")({
+}), _s = /* @__PURE__ */ e("blockquote")({
   name: "Quote",
   class: "qaa0kez",
   propsAsIs: !1
@@ -106,7 +106,7 @@ const w = /* @__PURE__ */ e("div")({
   class: "ccvukea",
   propsAsIs: !1
 }), Xs = ({ image: n, tweet: o, account: i, accountVerified: a, body: r, title: t }) => /* @__PURE__ */ l(Gs, { children: [
-  t && /* @__PURE__ */ s(Qs, { children: /* @__PURE__ */ s(Ws, { children: t }) }),
+  t && /* @__PURE__ */ s(Ws, { children: /* @__PURE__ */ s(_s, { children: t }) }),
   /* @__PURE__ */ s(
     vs,
     {
@@ -120,7 +120,7 @@ const w = /* @__PURE__ */ e("div")({
   /* @__PURE__ */ s(Ks, { children: gs(r) })
 ] }), Zs = ({ title: n, questionType: o, questionTypeData: i }) => /* @__PURE__ */ l(X, { children: [
   /* @__PURE__ */ s(
-    W,
+    _,
     {
       questionTypeData: i,
       questionType: o,
@@ -142,7 +142,7 @@ const w = /* @__PURE__ */ e("div")({
     g && /* @__PURE__ */ s(j, { src: g, fromInsight: !0, withVideo: !!b }),
     o === f.TWEET ? /* @__PURE__ */ s(Hs, { tweet: r }) : /* @__PURE__ */ s(Zs, { questionTypeData: t, questionType: o, title: c }),
     /* @__PURE__ */ s(Fs, { name: "inapp-button", children: p || "Open" }),
-    /* @__PURE__ */ s(_s, { name: "chevronRight" })
+    /* @__PURE__ */ s(Qs, { name: "chevronRight" })
   ] }) });
 }, se = () => ({
   color: n
@@ -310,7 +310,7 @@ const w = /* @__PURE__ */ e("div")({
   propsAsIs: !0
 }), Be = ({ title: n, questionType: o, questionTypeData: i, description: a, imageMode: r, webos: t }) => /* @__PURE__ */ l(Te, { imageMode: r, questionType: o, webos: t, children: [
   /* @__PURE__ */ s(
-    W,
+    _,
     {
       questionTypeData: i,
       questionType: o,
@@ -344,7 +344,7 @@ const w = /* @__PURE__ */ e("div")({
   webos: p,
   className: c
 }) => {
-  const [m, u] = I(!1), h = Q();
+  const [m, u] = I(!1), h = W();
   $(() => (a?.sponsorLogo && (u(!0), h.current = setTimeout(() => {
     u(!1);
   }, 5e3)), () => clearTimeout(h.current)), [a?.sponsorLogo]);
@@ -425,11 +425,11 @@ const w = /* @__PURE__ */ e("div")({
   name: "Icon",
   class: "i1vmpt6u",
   propsAsIs: !1
-}), _e = /* @__PURE__ */ e("div")({
+}), Qe = /* @__PURE__ */ e("div")({
   name: "IconContainer",
   class: "i180665s",
   propsAsIs: !1
-}), Qe = () => A, We = /* @__PURE__ */ e(Qe())({
+}), We = () => A, _e = /* @__PURE__ */ e(We())({
   name: "TitleIcon",
   class: "t16zzzei",
   propsAsIs: !0
@@ -465,7 +465,7 @@ const w = /* @__PURE__ */ e("div")({
       n?.(), i && i.markIstantOpen();
     },
     children: [
-      /* @__PURE__ */ l(_e, { children: [
+      /* @__PURE__ */ l(Qe, { children: [
         /* @__PURE__ */ s(P, { className: "on-light", src: "https://cdn.streamlayer.io/assets/sdk-web/onboarding-steps/notification.png" }),
         /* @__PURE__ */ s(
           P,
@@ -477,7 +477,7 @@ const w = /* @__PURE__ */ e("div")({
       ] }),
       /* @__PURE__ */ l(Xe, { children: [
         /* @__PURE__ */ l(Ze, { children: [
-          /* @__PURE__ */ s(We, { name: "icon-trophy-solid" }),
+          /* @__PURE__ */ s(_e, { name: "icon-trophy-solid" }),
           i?.titleCard?.title
         ] }),
         /* @__PURE__ */ l(He, { children: [
@@ -744,7 +744,7 @@ const w = /* @__PURE__ */ e("div")({
   name: "Body",
   class: "b1a21en",
   propsAsIs: !1
-}), _n = ({
+}), Qn = ({
   step: n,
   children: o,
   state: i = "pending"
@@ -773,7 +773,7 @@ const w = /* @__PURE__ */ e("div")({
       }, n)
     })
   });
-}, Qn = /* @__PURE__ */ e("div")({
+}, Wn = /* @__PURE__ */ e("div")({
   name: "Container",
   class: "c1nd5cu8",
   propsAsIs: !1
@@ -781,7 +781,7 @@ const w = /* @__PURE__ */ e("div")({
   name: "Line",
   class: "lgbipw0",
   propsAsIs: !1
-}), Wn = () => L, Kn = /* @__PURE__ */ e(Wn())({
+}), _n = () => L, Kn = /* @__PURE__ */ e(_n())({
   name: "Line1",
   class: "l1anth16",
   propsAsIs: !0
@@ -793,7 +793,7 @@ const w = /* @__PURE__ */ e("div")({
   name: "Line3",
   class: "lhbflsp",
   propsAsIs: !0
-}), Jn = () => /* @__PURE__ */ l(Qn, {
+}), Jn = () => /* @__PURE__ */ l(Wn, {
   children: [/* @__PURE__ */ s(Kn, {
     children: /* @__PURE__ */ s("div", {})
   }), /* @__PURE__ */ s(Xn, {
@@ -883,7 +883,7 @@ const w = /* @__PURE__ */ e("div")({
   name: "Body",
   class: "bqq1ix4",
   propsAsIs: !1
-}), _ = {
+}), Q = {
   1: 3e3,
   2: 4e3,
   3: 4e3
@@ -891,8 +891,8 @@ const w = /* @__PURE__ */ e("div")({
   if ($(() => {
     if (i) {
       const u = setTimeout(() => {
-        _[c + 1] && (r || c < 3) ? i(c + 1) : n?.();
-      }, _[c]);
+        Q[c + 1] && (r || c < 3) ? i(c + 1) : n?.();
+      }, Q[c]);
       return () => {
         u && clearTimeout(u);
       };
@@ -904,7 +904,7 @@ const w = /* @__PURE__ */ e("div")({
   let m = "pending";
   return c === 3 && (m = r ? "correct" : "incorrect"), /* @__PURE__ */ s(F, { "data-a": "intr", onClick: () => o?.(), children: /* @__PURE__ */ l(Y, { children: [
     c !== 1 && /* @__PURE__ */ s(Jn, {}, c),
-    /* @__PURE__ */ l(_n, { state: m, step: c, children: [
+    /* @__PURE__ */ l(Qn, { state: m, step: c, children: [
       c === 2 && /* @__PURE__ */ s(lo, { title: p || "unknown", answer: a?.title || "unknown" }),
       c === 3 && r && /* @__PURE__ */ s(uo, { answer: a?.title || "unknown" }),
       c === 3 && !r && /* @__PURE__ */ s(Ao, { title: t || "unknown", answer: a?.title || "unknown" })
@@ -956,7 +956,7 @@ const w = /* @__PURE__ */ e("div")({
   sponsorLogo: o,
   onClick: i
 }) => /* @__PURE__ */ s(go, { className: n, onClick: i, children: /* @__PURE__ */ s($o, { withoutPadding: !0, children: /* @__PURE__ */ s(cs, { src: o }) }) }), To = ({ className: n, ...o }) => {
-  const [i, a] = I(!1), r = Q();
+  const [i, a] = I(!1), r = W();
   return $(() => (o?.inApp?.sponsorLogo && (a(!0), r.current = setTimeout(() => {
     a(!1);
   }, 5e3)), () => clearTimeout(r.current)), [o?.inApp?.sponsorLogo]), o?.inApp?.sponsorLogo && i ? /* @__PURE__ */ s(