@streamlayer/react 1.24.7 → 1.24.8

package/lib/es/index14.js

@@ -1,7 +1,7 @@
 import { jsxs as T, jsx as e, Fragment as le } from "react/jsx-runtime";
 import { s as n, c as Z } from "./feature.js";
-import { useState as I, useEffect as b, useCallback as v, forwardRef as ce, useRef as B } from "react";
-import { B as f } from "./index7.js";
+import { useState as I, useEffect as b, useCallback as v, forwardRef as ce, useRef as R } from "react";
+import { H as f } from "./index5.js";
 import { G as ue, d as ie, b as de } from "./index8.js";
 import { C as pe } from "./useStreamLayerApp2.js";
 const me = /* @__PURE__ */ n("div")({
@@ -66,7 +66,7 @@ const me = /* @__PURE__ */ n("div")({
   name: "Poster",
   class: "p12ow7zo",
   propsAsIs: !1
-}), R = /* @__PURE__ */ n("div")({
+}), H = /* @__PURE__ */ n("div")({
   name: "Control",
   class: "cdpal9o",
   propsAsIs: !1
@@ -94,34 +94,34 @@ const me = /* @__PURE__ */ n("div")({
   name: "WebOSIconButton",
   class: "w1q3u7py",
   propsAsIs: !1
-}), Ee = () => Y, L = /* @__PURE__ */ n(Ee())({
+}), Ee = () => Y, B = /* @__PURE__ */ n(Ee())({
   name: "WebOSIconButtonAnimation",
   class: "wdlqvum",
   propsAsIs: !0
-}), Ne = () => L, Oe = /* @__PURE__ */ n(Ne())({
+}), Ne = () => B, Oe = /* @__PURE__ */ n(Ne())({
   name: "WebOSIconButtonPlay",
   class: "w1ylz9ea",
   propsAsIs: !0
-}), Se = () => L, We = /* @__PURE__ */ n(Se())({
+}), Se = () => B, We = /* @__PURE__ */ n(Se())({
   name: "WebOSIconButtonPause",
   class: "w1iylt55",
   propsAsIs: !0
-}), Be = () => L, Re = /* @__PURE__ */ n(Be())({
+}), Re = () => B, He = /* @__PURE__ */ n(Re())({
   name: "WebOSIconButtonMute",
   class: "w8h4h7",
   propsAsIs: !0
-}), Te = () => L, Le = /* @__PURE__ */ n(Te())({
+}), Te = () => B, Be = /* @__PURE__ */ n(Te())({
   name: "WebOSIconButtonUnmute",
   class: "w12l12kt",
   propsAsIs: !0
-}), Ue = (t) => {
+}), Le = (t) => {
   for (const a of t)
     a.isIntersecting ? a.target instanceof HTMLVideoElement && a.target.autoplay && a.target.play() : a.target instanceof HTMLVideoElement && !a.target.paused && a.target.pause();
-}, ee = new IntersectionObserver(Ue, { threshold: 0.5 }), F = /* @__PURE__ */ new Set(), je = (t) => {
+}, ee = new IntersectionObserver(Le, { threshold: 0.5 }), F = /* @__PURE__ */ new Set(), Ue = (t) => {
   ee.observe(t), F.add(t);
-}, ze = (t) => {
+}, je = (t) => {
   ee.unobserve(t), F.delete(t);
-}, He = () => {
+}, ze = () => {
   for (const t of F)
     t instanceof HTMLVideoElement && !t.paused && t.pause();
 };
@@ -137,7 +137,7 @@ function qe(...t) {
     [...t]
   );
 }
-const $e = de(he), De = ({ loading: t, autoPlay: a, played: o, playing: l, isMuted: i, unmute: c, mute: d, togglePlaying: p }) => !t && !a && !o ? /* @__PURE__ */ e(R, { children: l ? /* @__PURE__ */ e(f, { name: "icon-pause" }) : /* @__PURE__ */ e(f, { name: "icon-play" }) }) : o ? /* @__PURE__ */ T(ve, { children: [
+const $e = de(he), De = ({ loading: t, autoPlay: a, played: o, playing: l, isMuted: i, unmute: c, mute: d, togglePlaying: p }) => !t && !a && !o ? /* @__PURE__ */ e(H, { children: l ? /* @__PURE__ */ e(f, { name: "icon-pause" }) : /* @__PURE__ */ e(f, { name: "icon-play" }) }) : o ? /* @__PURE__ */ T(ve, { children: [
   l ? /* @__PURE__ */ e(we, { onClick: p }) : /* @__PURE__ */ e(xe, { onClick: p }),
   /* @__PURE__ */ e(Me, { className: Z(!i && "muted"), onClick: i ? c : d })
 ] }) : null, Fe = ({
@@ -152,8 +152,8 @@ const $e = de(he), De = ({ loading: t, autoPlay: a, played: o, playing: l, isMut
   hasNotPausedVideo: y,
   hasInteractedWithAudio: C
 }) => /* @__PURE__ */ T(le, { children: [
-  !t && !(a && o) && /* @__PURE__ */ e(R, { "data-control-btn": "true", children: l ? y ? null : /* @__PURE__ */ e(Oe, { children: /* @__PURE__ */ e(f, { name: "icon-play" }) }) : i ? /* @__PURE__ */ e(We, { children: /* @__PURE__ */ e(f, { name: "icon-pause" }) }) : /* @__PURE__ */ e(Y, { "data-control-icon": "true", children: /* @__PURE__ */ e(f, { name: "icon-play" }) }) }),
-  !t && a && o && C && /* @__PURE__ */ e(R, { children: p ? /* @__PURE__ */ e(Re, { onClick: c, children: /* @__PURE__ */ e(f, { name: "iconMute" }) }) : /* @__PURE__ */ e(Le, { onClick: d, children: /* @__PURE__ */ e(f, { name: "iconUnMute" }) }) })
+  !t && !(a && o) && /* @__PURE__ */ e(H, { "data-control-btn": "true", children: l ? y ? null : /* @__PURE__ */ e(Oe, { children: /* @__PURE__ */ e(f, { name: "icon-play" }) }) : i ? /* @__PURE__ */ e(We, { children: /* @__PURE__ */ e(f, { name: "icon-pause" }) }) : /* @__PURE__ */ e(Y, { "data-control-icon": "true", children: /* @__PURE__ */ e(f, { name: "icon-play" }) }) }),
+  !t && a && o && C && /* @__PURE__ */ e(H, { children: p ? /* @__PURE__ */ e(He, { onClick: c, children: /* @__PURE__ */ e(f, { name: "iconMute" }) }) : /* @__PURE__ */ e(Be, { onClick: d, children: /* @__PURE__ */ e(f, { name: "iconUnMute" }) }) })
 ] }), Ye = ce(
   ({
     poster: t,
@@ -167,7 +167,7 @@ const $e = de(he), De = ({ loading: t, autoPlay: a, played: o, playing: l, isMut
     onRender: y,
     onMute: C,
     onMuteClick: x,
-    onQuartile: U,
+    onQuartile: L,
     autoPlay: M,
     playMuted: k,
     className: te,
@@ -175,7 +175,7 @@ const $e = de(he), De = ({ loading: t, autoPlay: a, played: o, playing: l, isMut
     webos: E,
     hasNotPausedVideo: ae
   }, se) => {
-    const u = B(null), ne = qe(u, se), j = B(!1), z = B(!1), m = B(/* @__PURE__ */ new Set()), [G, K] = I(!1), [N, O] = I(!1), [H, _] = I(!1), [J, S] = I(!0), [q, W] = I(k), [$, oe] = I(!1);
+    const u = R(null), ne = qe(u, se), U = R(!1), j = R(!1), m = R(/* @__PURE__ */ new Set()), [G, K] = I(!1), [N, O] = I(!1), [z, _] = I(!1), [J, S] = I(!0), [q, W] = I(k), [$, oe] = I(!1);
     b(() => {
       a && (W(k), K(!1));
     }, [a]);
@@ -207,7 +207,7 @@ const $e = de(he), De = ({ loading: t, autoPlay: a, played: o, playing: l, isMut
           const g = u?.current;
           if (!g)
             return;
-          He(), g.play().catch((h) => console.log(h)), S(!1);
+          ze(), g.play().catch((h) => console.log(h)), S(!1);
         }
     }, re = () => {
       u?.current?.load(), S(!0);
@@ -216,14 +216,14 @@ const $e = de(he), De = ({ loading: t, autoPlay: a, played: o, playing: l, isMut
       P();
     }, [P]), b(() => {
       const s = u.current;
-      return s ? (z.current = s.muted, W(s.muted), je(s), () => {
-        ze(s);
+      return s ? (j.current = s.muted, W(s.muted), Ue(s), () => {
+        je(s);
       }) : () => {
       };
     }, []), b(() => {
       y?.();
     }, [y]), b(() => {
-      m.current.clear(), j.current = !1;
+      m.current.clear(), U.current = !1;
     }, [a]), /* @__PURE__ */ T(
       $e,
       {
@@ -242,18 +242,18 @@ const $e = de(he), De = ({ loading: t, autoPlay: a, played: o, playing: l, isMut
               src: a,
               autoPlay: M,
               onPlay: () => {
-                K(!0), j.current && (i?.(), m.current.clear()), O(!0), S(!1), c?.(), k ? A() : Q();
+                K(!0), U.current && (i?.(), m.current.clear()), O(!0), S(!1), c?.(), k ? A() : Q();
               },
               onTimeUpdate: (s) => {
                 const r = s.target.duration, g = s.target.currentTime;
                 if (r && g) {
                   const h = Math.floor(g / r * 100);
-                  h >= 25 && h < 50 && !m.current.has(25) ? (U?.(25), m.current.add(25)) : h >= 50 && h < 75 && !m.current.has(50) ? (U?.(50), m.current.add(50)) : h >= 75 && !m.current.has(75) && (U?.(75), m.current.add(75));
+                  h >= 25 && h < 50 && !m.current.has(25) ? (L?.(25), m.current.add(25)) : h >= 50 && h < 75 && !m.current.has(50) ? (L?.(50), m.current.add(50)) : h >= 75 && !m.current.has(75) && (L?.(75), m.current.add(75));
                 }
               },
               onVolumeChange: (s) => {
                 const r = s.target.muted;
-                z.current !== r && (C?.(r), z.current = r, (r !== w || w === void 0) && (r ? P() : Q()));
+                j.current !== r && (C?.(r), j.current = r, (r !== w || w === void 0) && (r ? P() : Q()));
               },
               onError: async (s) => {
                 try {
@@ -272,7 +272,7 @@ const $e = de(he), De = ({ loading: t, autoPlay: a, played: o, playing: l, isMut
                 O(!1), d?.(), P();
               },
               onEnded: () => {
-                O(!1), j.current = !0, re(), p?.(), P();
+                O(!1), U.current = !0, re(), p?.(), P();
               },
               style: { visibility: J ? "hidden" : "visible" },
               controls: !1,
@@ -283,7 +283,7 @@ const $e = de(he), De = ({ loading: t, autoPlay: a, played: o, playing: l, isMut
           !E && /* @__PURE__ */ e(
             De,
             {
-              loading: H,
+              loading: z,
               autoPlay: M,
               played: G,
               playing: N,
@@ -296,7 +296,7 @@ const $e = de(he), De = ({ loading: t, autoPlay: a, played: o, playing: l, isMut
           E && /* @__PURE__ */ e(
             Fe,
             {
-              loading: H,
+              loading: z,
               autoPlay: M,
               playMuted: k,
               playing: N,
@@ -308,14 +308,14 @@ const $e = de(he), De = ({ loading: t, autoPlay: a, played: o, playing: l, isMut
               hasInteractedWithAudio: $
             }
           ),
-          H && /* @__PURE__ */ e(R, { children: /* @__PURE__ */ e(ie, {}) })
+          z && /* @__PURE__ */ e(H, { children: /* @__PURE__ */ e(ie, {}) })
         ]
       }
     );
   }
 );
 export {
-  He as O,
+  ze as O,
   Ye as V,
   Ze as y
 };

package/lib/es/index16.js

@@ -1,6 +1,6 @@
 import { u as Y, F as W, s } from "./feature.js";
 import { h as b2, i as y2, I as T2, d as H2, Q as k } from "./useStreamLayerApp2.js";
-import { useState as T, useEffect as V, useRef as Z, useCallback as N, Component as V2, createElement as k2, useMemo as z2 } from "react";
+import { useState as T, useEffect as V, useRef as Z, useCallback as B, Component as V2, createElement as k2, useMemo as z2 } from "react";
 import { jsxs as n, jsx as e, Fragment as S } from "react/jsx-runtime";
 import { i as z } from "./index9.js";
 import { I as g2, s as x2, N as v2, e as R2 } from "./index10.js";
@@ -8,9 +8,9 @@ import { createPortal as P } from "react-dom";
 import { A as K } from "./index8.js";
 import { u as F2 } from "./utils.js";
 import { r as I2, S as S2, R as M2, D as q2 } from "./storage.js";
-import { $ as B2 } from "./index12.js";
-import { O as E2, V as N2 } from "./index14.js";
-import { B as H } from "./index7.js";
+import { $ as E2 } from "./index12.js";
+import { O as N2, V as B2 } from "./index14.js";
+import { H } from "./index5.js";
 import { p as Z2 } from "./index11.js";
 import { f as O2 } from "./index13.js";
 import { u as W2 } from "./analytics.js";
@@ -258,7 +258,7 @@ const re = (t) => b2(t), le = (t) => {
   /* @__PURE__ */ e(H, { name: "iconCopySuccess" }),
   /* @__PURE__ */ e(v0, { children: "Link Copied to Clipboard" })
 ] }) }), A0 = (t) => {
-  const i = Z(), [a, l] = T(null), c = N(
+  const i = Z(), [a, l] = T(null), c = B(
     async (o) => {
       if (o && navigator?.clipboard?.writeText) {
         i.current && (clearTimeout(i.current), l(null));
@@ -517,17 +517,17 @@ const w0 = /* @__PURE__ */ s("div")({
     ] }),
     p
   ] });
-}, q0 = () => I2, B0 = /* @__PURE__ */ s(q0())({
+}, q0 = () => I2, E0 = /* @__PURE__ */ s(q0())({
   name: "Container",
   class: "cll3md7",
   propsAsIs: !0
-}), E0 = () => S2, N0 = /* @__PURE__ */ s(E0())({
+}), N0 = () => S2, B0 = /* @__PURE__ */ s(N0())({
   name: "ActionBtn",
   class: "a10g1iik",
   propsAsIs: !0
-}), Z0 = ({ questionId: t, ...i }) => /* @__PURE__ */ n(B0, { "data-a": "intr", "data-name": t, children: [
-  /* @__PURE__ */ e(B2, { questionId: t, ...i }),
-  /* @__PURE__ */ e(N0, { "data-a": "intr", "data-name": t, children: "View Insight" })
+}), Z0 = ({ questionId: t, ...i }) => /* @__PURE__ */ n(E0, { "data-a": "intr", "data-name": t, children: [
+  /* @__PURE__ */ e(E2, { questionId: t, ...i }),
+  /* @__PURE__ */ e(B0, { "data-a": "intr", "data-name": t, children: "View Insight" })
 ] }), O0 = () => I2, W0 = /* @__PURE__ */ s(O0())({
   name: "Container",
   class: "cl56x6b",
@@ -550,7 +550,7 @@ const w0 = /* @__PURE__ */ s("div")({
   propsAsIs: !1
 }), de = ({ questions: t, openQuestion: i, controlVideo: a }) => t ? /* @__PURE__ */ e(n2, { "data-a": "intr", onClick: (c) => {
   const o = c.target.getAttribute("data-name");
-  o && (E2(), i(o, { openedFrom: "list" }));
+  o && (N2(), i(o, { openedFrom: "list" }));
 }, children: t?.map((c) => {
   if (c.type === "question" && c.attributes?.attributes.case === "question") {
     const o = c.attributes.attributes.value;
@@ -594,7 +594,7 @@ const w0 = /* @__PURE__ */ s("div")({
   class: "a12495er",
   propsAsIs: !1
 }), e1 = ({ video: t, image: i, imageMode: a, heading: l, body: c, action: o, controlVideo: d }) => /* @__PURE__ */ n(D0, { children: [
-  t?.url && /* @__PURE__ */ e(N2, { source: t.url, poster: t.thumbnailUrl, controlVideo: d }),
+  t?.url && /* @__PURE__ */ e(B2, { source: t.url, poster: t.thumbnailUrl, controlVideo: d }),
   i && !t?.url && /* @__PURE__ */ e(Q0, { "data-rounded": a === H2.ROUNDED, children: /* @__PURE__ */ e(U0, { src: i, alt: l }) }),
   /* @__PURE__ */ n(Y0, { children: [
     /* @__PURE__ */ e(K0, { children: l }),
@@ -788,7 +788,7 @@ const w0 = /* @__PURE__ */ s("div")({
     /* @__PURE__ */ e(F1, {}),
     /* @__PURE__ */ e(M1, {})
   ] })
-] }), B1 = 118, E1 = () => O2, N1 = /* @__PURE__ */ s(E1())({
+] }), E1 = 118, N1 = () => O2, B1 = /* @__PURE__ */ s(N1())({
   name: "Container",
   class: "c10131zw",
   propsAsIs: !0
@@ -808,7 +808,7 @@ const w0 = /* @__PURE__ */ s("div")({
   name: "PointsTitle",
   class: "p1pjil1h",
   propsAsIs: !0
-}), B = /* @__PURE__ */ s("div")({
+}), E = /* @__PURE__ */ s("div")({
   name: "Subtitle",
   class: "s1iorwr9",
   propsAsIs: !1
@@ -816,7 +816,7 @@ const w0 = /* @__PURE__ */ s("div")({
   name: "SubtitleFG",
   class: "s51sv9d",
   propsAsIs: !1
-}), E = /* @__PURE__ */ s("div")({
+}), N = /* @__PURE__ */ s("div")({
   name: "AnswerText",
   class: "a1lbk2ye",
   propsAsIs: !1
@@ -848,12 +848,12 @@ const w0 = /* @__PURE__ */ s("div")({
     }, 3e3);
     return () => clearInterval(u);
   }, [l]), V(() => {
-    L.current[I] && d(L.current[I]?.getBoundingClientRect()?.height || B1);
+    L.current[I] && d(L.current[I]?.getBoundingClientRect()?.height || E1);
   }, [I, d]);
   const r = (u) => (g) => {
     L.current && (L.current[u] = g);
   }, h = (u) => ({ transform: K1(u, I, p.height) }), f = { ...p };
-  return a && f.height && typeof f.height == "number" && (f.height += 32), /* @__PURE__ */ e(N1, { style: p.height ? f : { ...p, paddingTop: 0, paddingBottom: 0 }, hiding: v, children: /* @__PURE__ */ n(
+  return a && f.height && typeof f.height == "number" && (f.height += 32), /* @__PURE__ */ e(B1, { style: p.height ? f : { ...p, paddingTop: 0, paddingBottom: 0 }, hiding: v, children: /* @__PURE__ */ n(
     Z1,
     {
       style: {
@@ -874,7 +874,7 @@ const w0 = /* @__PURE__ */ s("div")({
         ] }),
         /* @__PURE__ */ n(x, { ref: r(3), style: h(3), children: [
           /* @__PURE__ */ e(M, { children: o }),
-          /* @__PURE__ */ e(B, { children: /* @__PURE__ */ n(E, { children: [
+          /* @__PURE__ */ e(E, { children: /* @__PURE__ */ n(N, { children: [
             /* @__PURE__ */ e("span", { children: "Your Pick:" }),
             " ",
             i?.title
@@ -892,9 +892,9 @@ const w0 = /* @__PURE__ */ s("div")({
                   /* @__PURE__ */ e("br", {}),
                   "You answered correctly."
                 ] }),
-                /* @__PURE__ */ n(B, { children: [
+                /* @__PURE__ */ n(E, { children: [
                   /* @__PURE__ */ e(m2, { name: "selected" }),
-                  /* @__PURE__ */ n(E, { children: [
+                  /* @__PURE__ */ n(N, { children: [
                     /* @__PURE__ */ e("span", { children: "Your Pick:" }),
                     " ",
                     i?.title
@@ -910,9 +910,9 @@ const w0 = /* @__PURE__ */ s("div")({
               style: { ...h(5), color: "var(--color-sdk-prediction-result-success-text)" },
               children: [
                 /* @__PURE__ */ e(W1, { children: I === 5 && /* @__PURE__ */ e(Z2, { delay: 0.5, prefix: "+", suffix: " points", value: i?.points }) }),
-                /* @__PURE__ */ n(B, { children: [
+                /* @__PURE__ */ n(E, { children: [
                   /* @__PURE__ */ e(m2, { name: "selected" }),
-                  /* @__PURE__ */ n(E, { children: [
+                  /* @__PURE__ */ n(N, { children: [
                     /* @__PURE__ */ e("span", { children: "Your Pick:" }),
                     " ",
                     i?.title
@@ -930,9 +930,9 @@ const w0 = /* @__PURE__ */ s("div")({
             c,
             "."
           ] }),
-          /* @__PURE__ */ n(B, { style: { color: "var(--color-sdk-prediction-result-error-subtitle)" }, children: [
+          /* @__PURE__ */ n(E, { style: { color: "var(--color-sdk-prediction-result-error-subtitle)" }, children: [
             /* @__PURE__ */ e(D1, { name: "circleClose" }),
-            /* @__PURE__ */ n(E, { children: [
+            /* @__PURE__ */ n(N, { children: [
               /* @__PURE__ */ e("span", { children: "Your Pick:" }),
               " ",
               i?.title
@@ -944,11 +944,11 @@ const w0 = /* @__PURE__ */ s("div")({
     }
   ) });
 }, Ce = (t) => {
-  const [i, a] = T(!1), [l, c] = T(!1), o = Z(null), d = N(() => {
+  const [i, a] = T(!1), [l, c] = T(!1), o = Z(null), d = B(() => {
     c(!0), o.current && clearTimeout(o.current), o.current = setTimeout(() => {
       c(!1);
     }, 1e3);
-  }, []), p = N(async (v) => {
+  }, []), p = B(async (v) => {
     a(!0);
     const I = v.map(
       (_) => new Promise((L, r) => {
@@ -1141,11 +1141,11 @@ const w0 = /* @__PURE__ */ s("div")({
   name: "IconClose",
   class: "i1mavjt2",
   propsAsIs: !0
-}), B3 = /* @__PURE__ */ s("div")({
+}), E3 = /* @__PURE__ */ s("div")({
   name: "OnboardingFooter",
   class: "o1x0dyzv",
   propsAsIs: !1
-}), E3 = () => z3, N3 = /* @__PURE__ */ s(E3())({
+}), N3 = () => z3, B3 = /* @__PURE__ */ s(N3())({
   name: "OnboardingActionBtn",
   class: "o1jfi9c3",
   propsAsIs: !0
@@ -1175,7 +1175,7 @@ const w0 = /* @__PURE__ */ s("div")({
   V(() => {
     i?.length ? y({ ...F, steps: !0 }) : a?.length ? y({ ...F, rules: !0 }) : y({ ...F, inviteCard: !0 });
   }, []);
-  const _2 = z2(() => A.steps && g === 0 ? "Continue" : A.rules ? C || !l ? "Got it" : l : A.inviteCard ? L || "Play Now" : "Next", [A, g, C, l, L]), w2 = N(() => {
+  const _2 = z2(() => A.steps && g === 0 ? "Continue" : A.rules ? C || !l ? "Got it" : l : A.inviteCard ? L || "Play Now" : "Next", [A, g, C, l, L]), w2 = B(() => {
     i?.length && g < i.length - 1 ? m((O) => ++O) : a?.length && A.steps ? y({ ...F, rules: !0 }) : A.rules && y({ ...F, inviteCard: !0 });
   }, [g, i?.length, a?.length, A, m, y]), $2 = async () => {
     A.inviteCard ? await t.onboardingStatus.submitInplay() : A.rules && C ? $(!1) : w2();
@@ -1215,7 +1215,7 @@ const w0 = /* @__PURE__ */ s("div")({
         }
       )
     ] }),
-    /* @__PURE__ */ e(B3, { children: /* @__PURE__ */ e(z, { loading: r, style: { width: "100%" }, children: /* @__PURE__ */ e(N3, { "data-a": "intr", onClick: $2, children: _2 }) }) })
+    /* @__PURE__ */ e(E3, { children: /* @__PURE__ */ e(z, { loading: r, style: { width: "100%" }, children: /* @__PURE__ */ e(B3, { "data-a": "intr", onClick: $2, children: _2 }) }) })
   ] }) });
 }, Z3 = /* @__PURE__ */ s("button")({
   name: "Container",

package/lib/es/index2.js

@@ -1,22 +1,21 @@
-import { h as ye } from "./index6.js";
+import { h as ye } from "./index7.js";
 import { jsx as o, jsxs as v, Fragment as R } from "react/jsx-runtime";
 import { u as f, F as Ne, s as p, b as Se, c as w, a as T, N as M } from "./feature.js";
 import { l as we, S as $e, m as Ae, d as Ce, n as Ee, C as Re, y as xe, a as Le, f as V, p as De, c as Te } from "./index13.js";
-import { M as Oe, b as _e, Q as Me, z as me, c as he, T as fe, I as Be, n as Ue, f as Pe, w as Q, a as Fe, p as ze } from "./index16.js";
+import { M as Oe, b as _e, Q as Me, z as me, c as he, T as fe, I as Ue, n as Be, f as Pe, w as Q, a as Fe, p as ze } from "./index16.js";
 import F from "lodash.throttle";
-import { useState as N, useEffect as I, useRef as E, PureComponent as Ve, useCallback as z, useMemo as $, Suspense as qe, lazy as je, forwardRef as ve, useLayoutEffect as Qe, useContext as K } from "react";
+import { useState as N, useEffect as I, useRef as E, PureComponent as Ve, useCallback as z, useMemo as $, Suspense as qe, lazy as je, forwardRef as ve, useLayoutEffect as Qe, useContext as H } from "react";
 import { A as L } from "./index8.js";
-import { f as ge, u as Ke, A as He, a as We } from "./analytics.js";
+import { f as ge, u as He, A as Ke, a as We } from "./analytics.js";
 import { m as O } from "./theme.js";
 import { p as q, _ as Ge, e as Je } from "./Question.js";
 import { O as Ze } from "./index12.js";
-import { B as x } from "./index7.js";
-import { I as Xe, S as y, g as C, j as H, Q as U } from "./useStreamLayerApp2.js";
-import "@storybook/blocks";
+import { H as x } from "./index5.js";
+import { I as Xe, S as y, g as C, j as K, Q as B } from "./useStreamLayerApp2.js";
 import Ye from "react-infinite-scroller";
 import { I as et, s as tt, e as st } from "./index10.js";
 import "./storage.js";
-import "./index5.js";
+import "./index6.js";
 import { createPortal as nt } from "react-dom";
 import { e as ot } from "./index3.js";
 import { i as W, q as at, _ as rt, j as G } from "./hooks-n9ax4LRT.js";
@@ -35,18 +34,18 @@ const J = Object.keys(L), Z = () => {
     name: t,
     size: L[t]
   };
-}, X = (e) => (e.current?.getBoundingClientRect().y || 0) < -68, B = () => window.matchMedia("(orientation: landscape)").matches, it = (e) => {
+}, X = (e) => (e.current?.getBoundingClientRect().y || 0) < -68, U = () => window.matchMedia("(orientation: landscape)").matches, it = (e) => {
   const [t] = N(() => ge({
     screen: Z(),
     sdkInView: X(e),
-    sdkInDesktopView: B()
+    sdkInDesktopView: U()
   }));
   return I(() => {
     const s = F(() => {
       t.setKey("sdkInView", X(e));
     }, 200), a = F(() => {
       const n = Z();
-      t.setKey("screen", n), t.setKey("sdkInDesktopView", B());
+      t.setKey("screen", n), t.setKey("sdkInDesktopView", U());
     }, 200);
     return window.addEventListener("scroll", s), window.addEventListener("resize", a), () => {
       window.removeEventListener("scroll", s), window.removeEventListener("resize", a);
@@ -67,7 +66,7 @@ const J = Object.keys(L), Z = () => {
     })
   ), r = f(t);
   return I(() => {
-    const d = B() ? s.current : window;
+    const d = U() ? s.current : window;
     if (!d)
       return () => {
       };
@@ -76,7 +75,7 @@ const J = Object.keys(L), Z = () => {
       if (!c)
         return;
       let u = 0;
-      B() ? u = c.scrollTop : u = e.current?.getBoundingClientRect().y || 0;
+      U() ? u = c.scrollTop : u = e.current?.getBoundingClientRect().y || 0;
       const m = a.current - u;
       if (lt > Math.abs(m))
         return;
@@ -180,7 +179,7 @@ const Y = ({ title: e, active: t, onClick: s }) => /* @__PURE__ */ o(mt, { "data
   class: "awohrz6",
   propsAsIs: !0
 }), wt = ({ title: e, description: t, onClick: s, className: a }) => {
-  const [n] = Ke({
+  const [n] = He({
     type: "invitation",
     action: "sent",
     payload: {
@@ -346,7 +345,7 @@ const xt = /* @__PURE__ */ p("div")({
   name: "Name",
   class: "njsrqgr",
   propsAsIs: !1
-}), Bt = () => x, Ut = /* @__PURE__ */ p(Bt())({
+}), Ut = () => x, Bt = /* @__PURE__ */ p(Ut())({
   name: "CurrentUserBadge",
   class: "c17uc4zr",
   propsAsIs: !0
@@ -364,7 +363,7 @@ const xt = /* @__PURE__ */ p("div")({
     t ? /* @__PURE__ */ o(Dt, { alt: "leaderboard-item-avatar", src: t }) : /* @__PURE__ */ o(Tt, { children: et(s || "") }),
     /* @__PURE__ */ v(_t, { children: [
       /* @__PURE__ */ o(Mt, { children: s || "" }),
-      r && /* @__PURE__ */ o(Ut, { name: "icon-star" })
+      r && /* @__PURE__ */ o(Bt, { name: "icon-star" })
     ] })
   ] }),
   /* @__PURE__ */ o("div", { children: tt(n) })
@@ -450,7 +449,7 @@ const xt = /* @__PURE__ */ p("div")({
       })
     }), m]
   });
-}, Kt = ({
+}, Ht = ({
   gamification: e,
   scrollNode: t,
   scrollStore: s
@@ -459,7 +458,7 @@ const xt = /* @__PURE__ */ p("div")({
   gamification: e,
   scrollNode: t,
   scrollStore: s
-}) : null, Ht = ({ store: e, openQuestion: t, withPickHistory: s }) => {
+}) : null, Kt = ({ store: e, openQuestion: t, withPickHistory: s }) => {
   const { sdk: a } = q(), n = f(e);
   return I(() => {
     s.set(!0);
@@ -503,7 +502,7 @@ const xt = /* @__PURE__ */ p("div")({
     c === D.HOME && /* @__PURE__ */ v(R, { children: [
       /* @__PURE__ */ o(Ae, { children: /* @__PURE__ */ o(Ce, { children: /* @__PURE__ */ o(Wt, { userSummary: e.userSummary }) }) }),
       /* @__PURE__ */ o(Ee, { style: { flex: 1 }, children: /* @__PURE__ */ o(
-        Ht,
+        Kt,
         {
           openQuestion: e.openQuestion,
           store: e.feedList.getStore(),
@@ -511,7 +510,7 @@ const xt = /* @__PURE__ */ p("div")({
         }
       ) })
     ] }),
-    c === D.LEADERBOARD && /* @__PURE__ */ o(Re, { children: /* @__PURE__ */ o(Kt, { scrollStore: s, scrollNode: a, gamification: e }) })
+    c === D.LEADERBOARD && /* @__PURE__ */ o(Re, { children: /* @__PURE__ */ o(Ht, { scrollStore: s, scrollNode: a, gamification: e }) })
   ] });
 }, Jt = () => V, te = /* @__PURE__ */ p(Jt())({
   name: "OpenedContainer",
@@ -527,7 +526,7 @@ const xt = /* @__PURE__ */ p("div")({
 }) => {
   const s = e + t;
   return s === 0 ? 0 : Math.round(e / s * 100);
-}, xn = ({
+}, Rn = ({
   gamification: e,
   scrollStore: t,
   className: s,
@@ -665,7 +664,7 @@ var ne;
 T("grpc:stream");
 C.Unknown, C.Internal, C.DeadlineExceeded, C.ResourceExhausted, C.FailedPrecondition, C.Unavailable, C.DataLoss;
 T("grpc:retry");
-H(10, { description: "Number of attempts to retry" }), H(3e4, { description: "Max delay between retries in milliseconds" });
+K(10, { description: "Number of attempts to retry" }), K(3e4, { description: "Max delay between retries in milliseconds" });
 var S;
 (function(e) {
   e.SCHEMA = "schema", e.EXTERNAL_TOKEN = "eToken", e.TOKEN = "token";
@@ -721,7 +720,7 @@ var de;
 (function(e) {
   e.Unset = "unset", e.Required = "required", e.Optional = "optional", e.Completed = "completed", e.Disabled = "disabled", e.Unavailable = "unavailable";
 })(de || (de = {}));
-U.POLL, U.PREDICTION, U.TRIVIA;
+B.POLL, B.PREDICTION, B.TRIVIA;
 const rs = {
   [y.GAMES]: !0
 }, is = /* @__PURE__ */ p("div")({
@@ -906,7 +905,7 @@ const rs = {
   name: "Description",
   class: "d8uezec",
   propsAsIs: !1
-}), Bs = /* @__PURE__ */ p("button")({
+}), Us = /* @__PURE__ */ p("button")({
   name: "ActionButton",
   class: "a1h1bk90",
   propsAsIs: !1
@@ -918,7 +917,7 @@ const rs = {
   ] }),
   s?.titleCard?.title && /* @__PURE__ */ o(_s, { children: s?.titleCard?.title }),
   s?.titleCard?.subtitle && /* @__PURE__ */ o(Ms, { children: s?.titleCard?.subtitle }),
-  /* @__PURE__ */ o(Bs, { "data-a": "intr", onClick: t, children: "Play Now" })
+  /* @__PURE__ */ o(Us, { "data-a": "intr", onClick: t, children: "Play Now" })
 ] }), ke = [{
   graphicSrc: "https://cdn.streamlayer.io/assets/sdk-web/onboarding-steps/dark/step_1.png",
   tagline: "",
@@ -931,7 +930,7 @@ const rs = {
 }, {
   graphicSrc: "https://cdn.streamlayer.io/assets/sdk-web/onboarding-steps/dark/step_3.png",
   headline: "Win points and play against friends."
-}], Us = /* @__PURE__ */ p("div")({
+}], Bs = /* @__PURE__ */ p("div")({
   name: "OnboardingContainer",
   class: "o1xni1kr",
   propsAsIs: !1
@@ -971,8 +970,8 @@ const rs = {
     return () => {
       m();
     };
-  }, [e.$store]), /* @__PURE__ */ v(Us, {
-    children: [/* @__PURE__ */ o(Ue, {
+  }, [e.$store]), /* @__PURE__ */ v(Bs, {
+    children: [/* @__PURE__ */ o(Be, {
       loading: n,
       rules: [{
         label: "Answer as many questions as you like.",
@@ -1024,7 +1023,7 @@ const rs = {
   const {
     loading: k,
     throttled: A
-  } = Be(h);
+  } = Ue(h);
   return c && m && i && n.current ? /* @__PURE__ */ o(fe, {
     container: n,
     useContainer: !r,
@@ -1077,7 +1076,7 @@ const rs = {
   name: "InnerContainer",
   class: "iqfywam",
   propsAsIs: !1
-}), Ks = () => be, Hs = /* @__PURE__ */ p(Ks())({
+}), Hs = () => be, Ks = /* @__PURE__ */ p(Hs())({
   name: "HiddenContainer",
   class: "hokmtod",
   propsAsIs: !0
@@ -1130,7 +1129,7 @@ const rs = {
   } = q(), [l, i, c] = Zs(t.id);
   let u = i;
   return n || (u = "auto"), t.type === M.QUESTION ? /* @__PURE__ */ v(R, {
-    children: [/* @__PURE__ */ o(Hs, {
+    children: [/* @__PURE__ */ o(Ks, {
       ref: l,
       children: /* @__PURE__ */ o(Q, {
         ...t
@@ -1310,7 +1309,7 @@ const rs = {
     activeFeature: h,
     isLogged: g
   } = sn(e), k = !!m;
-  He(r, {
+  Ke(r, {
     enabled: k,
     event: "click",
     listener: We
@@ -1374,13 +1373,13 @@ const rs = {
       })]
     })
   });
-}, Ln = ({ event: e, topNavigation: t, theme: s, muted: a, withSidebarNotification: n = !0 }) => {
-  const { sdk: r, status: d } = K(W), l = at(), i = rt(), { event: c } = K(W);
+}, xn = ({ event: e, topNavigation: t, theme: s, muted: a, withSidebarNotification: n = !0 }) => {
+  const { sdk: r, status: d } = H(W), l = at(), i = rt(), { event: c } = H(W);
   if (d === G.UNSET)
     throw new Error("Wrap app in `StreamLayerProvider`");
   return d === G.CONNECTED ? /* @__PURE__ */ o("div", { className: "StreamLayerSDK", children: "wait" }) : r === null ? /* @__PURE__ */ o("div", { className: "StreamLayerSDK", children: "sdk not initialized" }) : !l.app && !l.appNotification && !l.appSidebar || !l.app && !l.appSidebar && l.appNotification && !n ? null : /* @__PURE__ */ o("div", { className: "StreamLayerSDK", children: /* @__PURE__ */ o(ye, { customTheme: s ?? i.theme, themeMode: i.themeMode, children: /* @__PURE__ */ o(an, { sdk: r, muted: a, event: c?.current || e, topNavigation: t }) }) });
 };
 export {
-  xn as B,
-  Ln as D
+  Rn as B,
+  xn as D
 };

package/lib/es/index4.js

@@ -2,7 +2,7 @@ import { jsx as P, jsxs as F } from "react/jsx-runtime";
 import { s as _, u as Se, a as mt, c as Ee } from "./feature.js";
 import $, { forwardRef as Ae, useRef as D, useState as W, useEffect as X, useLayoutEffect as ht, createContext as je, useMemo as He, useCallback as Re, memo as gt } from "react";
 import vt from "lodash.throttle";
-import { B as te } from "./index7.js";
+import { H as te } from "./index5.js";
 import { d as wt } from "./index8.js";
 import { Q as yt } from "./index13.js";
 import { f as bt, g as St, S as qe } from "./useStreamLayerApp2.js";