@streamlayer/react 1.13.1 → 1.14.1

package/lib/classic/es/notification.js

@@ -1,468 +1,482 @@
-import { Z as m, s as e, a0 as L, a1 as z, a2 as B, E as O, a3 as R, f as P, d as Q, a as U, g as V, N as T, u as F, b as W, i as G, h as K } from "./provider.js";
-import { k as p, Q as I, l as Y, S as _ } from "./useStreamLayerApp2.js";
-import { jsxs as c, jsx as s } from "react/jsx-runtime";
-import { useState as q, useEffect as E, useMemo as Z } from "react";
-const h = /* @__PURE__ */ e("div")({
+import { c as u, s, X as L, Z as O, _ as R, C as B, $ as P, O as Q, e as U, a as V, f as F, N as C, u as W, b as _, Q as G, h as K } from "./provider.js";
+import { k as m, Q as A, l as Y, S as X } from "./useStreamLayerApp2.js";
+import { jsxs as c, jsx as e } from "react/jsx-runtime";
+import { useState as y, useCallback as Z, useMemo as E, useEffect as x } from "react";
+const $ = /* @__PURE__ */ s("div")({
   name: "Media",
   class: "m1bcvojl",
   propsAsIs: !1
-}), H = () => h, J = /* @__PURE__ */ e(H())({
+}), H = () => $, J = /* @__PURE__ */ s(H())({
   name: "MediaImgBottom",
   class: "m58gin0",
   propsAsIs: !0
-}), X = () => h, N = /* @__PURE__ */ e(X())({
+}), ee = () => $, N = /* @__PURE__ */ s(ee())({
   name: "MediaImgSolid",
   class: "m1atm8do",
   propsAsIs: !0
-}), ss = () => h, es = /* @__PURE__ */ e(ss())({
+}), se = () => $, ne = /* @__PURE__ */ s(se())({
   name: "MediaImgRounded",
   class: "myx3xoi",
   propsAsIs: !0
-}), ns = () => h, ts = /* @__PURE__ */ e(ns())({
+}), te = () => $, oe = /* @__PURE__ */ s(te())({
   name: "MediaImgCentered",
   class: "m1bwv0gx",
   propsAsIs: !0
-}), os = () => h, is = /* @__PURE__ */ e(os())({
+}), ie = () => $, ae = /* @__PURE__ */ s(ie())({
   name: "MediaImgInsight",
   class: "mntjanp",
   propsAsIs: !0
-}), as = /* @__PURE__ */ e("div")({
+}), ce = /* @__PURE__ */ s("div")({
   name: "VideoIcon",
   class: "v1kofb47",
   propsAsIs: !1
-}), cs = {
-  [p.UNSET]: N,
-  [p.NONE]: N,
-  [p.ROUNDED]: es,
-  [p.CENTERED]: ts,
-  [p.TRANSPARENT]: J
-}, C = ({
+}), re = {
+  [m.UNSET]: N,
+  [m.NONE]: N,
+  [m.ROUNDED]: ne,
+  [m.CENTERED]: oe,
+  [m.TRANSPARENT]: J
+}, b = ({
   src: t,
-  imageMode: o = p.UNSET,
+  imageMode: o = m.UNSET,
   withVideo: i,
   fromInsight: a
 }) => {
-  if (o === p.NONE)
+  if (o === m.NONE)
     return null;
-  const n = a ? is : cs[o];
+  const n = a ? ae : re[o];
   return /* @__PURE__ */ c(n, {
-    children: [/* @__PURE__ */ s("img", {
+    children: [/* @__PURE__ */ e("img", {
       src: t,
       alt: ""
-    }), i && /* @__PURE__ */ s(as, {
-      children: /* @__PURE__ */ s(m, {
+    }), i && /* @__PURE__ */ e(ce, {
+      children: /* @__PURE__ */ e(u, {
         name: "icon-play"
       })
     })]
   });
-}, rs = /* @__PURE__ */ e("div")({
+}, le = /* @__PURE__ */ s("div")({
   name: "NotificationContent",
   class: "nuraq9m",
   propsAsIs: !1
-}), ls = /* @__PURE__ */ e("div")({
+}), de = /* @__PURE__ */ s("div")({
   name: "NotificationContainer",
   class: "ns1nzpg",
   propsAsIs: !1
-}), M = /* @__PURE__ */ e("div")({
+}), M = /* @__PURE__ */ s("div")({
   name: "Body",
   class: "b1j59nzs",
   propsAsIs: !1
-}), ds = /* @__PURE__ */ e("div")({
+}), pe = /* @__PURE__ */ s("div")({
   name: "Title",
   class: "t9vmnpp",
   propsAsIs: !1
-}), ps = /* @__PURE__ */ e("button")({
+}), me = /* @__PURE__ */ s("button")({
   name: "Button",
   class: "b14ivj5k",
   propsAsIs: !1
-}), ms = () => m, us = /* @__PURE__ */ e(ms())({
+}), ue = () => u, Ie = /* @__PURE__ */ s(ue())({
   name: "StyledChevronRight",
   class: "s1atci8n",
   propsAsIs: !0
-}), Is = /* @__PURE__ */ e("div")({
+}), ve = /* @__PURE__ */ s("div")({
   name: "QuoteWrap",
   class: "q4w8jgs",
   propsAsIs: !1
-}), hs = /* @__PURE__ */ e("blockquote")({
+}), he = /* @__PURE__ */ s("blockquote")({
   name: "Quote",
   class: "qaa0kez",
   propsAsIs: !1
-}), vs = /* @__PURE__ */ e("div")({
+}), Ae = /* @__PURE__ */ s("div")({
   name: "Body",
   class: "b1wvd52w",
   propsAsIs: !1
-}), As = /* @__PURE__ */ e("div")({
+}), $e = /* @__PURE__ */ s("div")({
   name: "Container",
   class: "ccvukea",
   propsAsIs: !1
-}), $s = ({ image: t, tweet: o, account: i, accountVerified: a, body: n, title: l }) => {
-  var d;
-  return /* @__PURE__ */ c(As, { children: [
-    l && /* @__PURE__ */ s(Is, { children: /* @__PURE__ */ s(hs, { children: l }) }),
-    /* @__PURE__ */ s(
+}), ye = ({ image: t, tweet: o, account: i, accountVerified: a, body: n, title: d }) => {
+  var l;
+  return /* @__PURE__ */ c($e, { children: [
+    d && /* @__PURE__ */ e(ve, { children: /* @__PURE__ */ e(he, { children: d }) }),
+    /* @__PURE__ */ e(
       L,
       {
         image: t,
-        name: (d = o == null ? void 0 : o.meta) == null ? void 0 : d.accountName,
+        name: (l = o == null ? void 0 : o.meta) == null ? void 0 : l.accountName,
         userName: i,
         verified: a,
         createdTweet: o == null ? void 0 : o.date
       }
     ),
-    /* @__PURE__ */ s(vs, { children: z(n) })
+    /* @__PURE__ */ e(Ae, { children: O(n) })
   ] });
-}, ys = ({ title: t, questionType: o, questionTypeData: i }) => /* @__PURE__ */ c(M, { children: [
-  /* @__PURE__ */ s(
-    B,
+}, fe = ({ title: t, questionType: o, questionTypeData: i }) => /* @__PURE__ */ c(M, { children: [
+  /* @__PURE__ */ e(
+    R,
     {
       questionTypeData: i,
       questionType: o,
       questionStatus: Y.UNSET
     }
   ),
-  t && /* @__PURE__ */ s(ds, { children: t })
-] }), fs = ({ tweet: t }) => t ? /* @__PURE__ */ s(M, { children: /* @__PURE__ */ s($s, { ...t, controlVideo: () => {
-} }) }) : null, gs = ({ action: t, questionType: o, inApp: i, insight: a, tweet: n }) => {
-  var l;
-  const d = O[o], r = R[o];
-  if (!d || !i || !i.notification)
+  t && /* @__PURE__ */ e(pe, { children: t })
+] }), ge = ({ tweet: t }) => t ? /* @__PURE__ */ e(M, { children: /* @__PURE__ */ e(ye, { ...t, controlVideo: () => {
+} }) }) : null, Te = ({ action: t, questionType: o, inApp: i, insight: a, tweet: n }) => {
+  var d;
+  const l = B[o], r = P[o];
+  if (!l || !i || !i.notification)
     return null;
-  const { title: v, image: A, imageMode: f } = i.notification;
-  let u = A;
-  o === I.TWEET && n != null && n.tweetMedia && (u = n.tweetMedia.image), f === p.NONE && (u = "");
-  const $ = i.useMediaFromContent && (a == null ? void 0 : a.image), g = o === I.TWEET && ((l = n == null ? void 0 : n.tweetMedia) == null ? void 0 : l.video) || o === I.FACTOID && (a == null ? void 0 : a.video);
-  return /* @__PURE__ */ s(ls, { className: "SL_InApp", onClick: t, children: /* @__PURE__ */ c(rs, { style: u ? {} : { paddingLeft: "1.5rem" }, children: [
-    u && !$ && /* @__PURE__ */ s(C, { src: u, imageMode: f, withVideo: !!g }),
-    $ && /* @__PURE__ */ s(C, { src: $, fromInsight: !0, withVideo: !!g }),
-    o === I.TWEET ? /* @__PURE__ */ s(fs, { tweet: n }) : /* @__PURE__ */ s(ys, { questionTypeData: d, questionType: o, title: v }),
-    /* @__PURE__ */ s(ps, { name: "inapp-button", children: r || "Open" }),
-    /* @__PURE__ */ s(us, { name: "chevronRight" })
+  const { title: p, image: I, imageMode: v } = i.notification;
+  let h = I;
+  o === A.TWEET && n != null && n.tweetMedia && (h = n.tweetMedia.image), v === m.NONE && (h = "");
+  const f = i.useMediaFromContent && (a == null ? void 0 : a.image), T = o === A.TWEET && ((d = n == null ? void 0 : n.tweetMedia) == null ? void 0 : d.video) || o === A.FACTOID && (a == null ? void 0 : a.video);
+  return /* @__PURE__ */ e(de, { className: "SL_InApp", onClick: t, children: /* @__PURE__ */ c(le, { style: h ? {} : { paddingLeft: "1.5rem" }, children: [
+    h && !f && /* @__PURE__ */ e(b, { src: h, imageMode: v, withVideo: !!T }),
+    f && /* @__PURE__ */ e(b, { src: f, fromInsight: !0, withVideo: !!T }),
+    o === A.TWEET ? /* @__PURE__ */ e(ge, { tweet: n }) : /* @__PURE__ */ e(fe, { questionTypeData: l, questionType: o, title: p }),
+    /* @__PURE__ */ e(me, { name: "inapp-button", children: r || "Open" }),
+    /* @__PURE__ */ e(Ie, { name: "chevronRight" })
   ] }) });
-}, Ts = /* @__PURE__ */ e("div")({
+}, Ce = /* @__PURE__ */ s("div")({
   name: "NotificationContainer",
   class: "n11jcrxe",
   propsAsIs: !1
-}), b = /* @__PURE__ */ e("img")({
+}), k = /* @__PURE__ */ s("img")({
   name: "Icon",
   class: "i1vmpt6u",
   propsAsIs: !1
-}), Ns = /* @__PURE__ */ e("div")({
+}), Ne = /* @__PURE__ */ s("div")({
   name: "IconContainer",
   class: "i180665s",
   propsAsIs: !1
-}), Cs = () => m, bs = /* @__PURE__ */ e(Cs())({
+}), be = () => u, ke = /* @__PURE__ */ s(be())({
   name: "TitleIcon",
   class: "t16zzzei",
   propsAsIs: !0
-}), ks = () => P, ws = /* @__PURE__ */ e(ks())({
+}), we = () => Q, Se = /* @__PURE__ */ s(we())({
   name: "Close",
   class: "c1sur0q2",
   propsAsIs: !0
-}), Ss = /* @__PURE__ */ e("div")({
+}), qe = /* @__PURE__ */ s("div")({
   name: "Body",
   class: "bai9j52",
   propsAsIs: !1
-}), qs = /* @__PURE__ */ e("div")({
+}), Ee = /* @__PURE__ */ s("div")({
   name: "Title",
   class: "t1bnt25p",
   propsAsIs: !1
-}), Es = /* @__PURE__ */ e("div")({
+}), xe = /* @__PURE__ */ s("div")({
   name: "Description",
   class: "dmixjec",
   propsAsIs: !1
-}), Ms = /* @__PURE__ */ e("button")({
+}), Me = /* @__PURE__ */ s("button")({
   name: "Button",
   class: "b1ubkw1q",
   propsAsIs: !1
-}), xs = ({
+}), je = ({
   open: t,
   close: o,
   ...i
 }) => {
   var a, n;
   return /* @__PURE__ */ c(
-    Ts,
+    Ce,
     {
       onClick: () => {
         t == null || t(), i && (i.instantOpen = !0);
       },
       children: [
-        /* @__PURE__ */ c(Ns, { children: [
-          /* @__PURE__ */ s(b, { className: "on-light", src: "https://cdn.streamlayer.io/assets/sdk-web/onboarding-steps/notification.png" }),
-          /* @__PURE__ */ s(
-            b,
+        /* @__PURE__ */ c(Ne, { children: [
+          /* @__PURE__ */ e(k, { className: "on-light", src: "https://cdn.streamlayer.io/assets/sdk-web/onboarding-steps/notification.png" }),
+          /* @__PURE__ */ e(
+            k,
             {
               className: "on-dark",
               src: "https://cdn.streamlayer.io/assets/sdk-web/onboarding-steps/notification-dark.png"
             }
           )
         ] }),
-        /* @__PURE__ */ c(Ss, { children: [
-          /* @__PURE__ */ c(qs, { children: [
-            /* @__PURE__ */ s(bs, { name: "icon-trophy-solid" }),
+        /* @__PURE__ */ c(qe, { children: [
+          /* @__PURE__ */ c(Ee, { children: [
+            /* @__PURE__ */ e(ke, { name: "icon-trophy-solid" }),
             (a = i == null ? void 0 : i.titleCard) == null ? void 0 : a.title
           ] }),
-          /* @__PURE__ */ c(Es, { children: [
-            /* @__PURE__ */ s("span", { children: (n = i == null ? void 0 : i.titleCard) == null ? void 0 : n.subtitle }),
-            /* @__PURE__ */ s(Ms, { name: "inapp-button", children: "Play Now" })
+          /* @__PURE__ */ c(xe, { children: [
+            /* @__PURE__ */ e("span", { children: (n = i == null ? void 0 : i.titleCard) == null ? void 0 : n.subtitle }),
+            /* @__PURE__ */ e(Me, { name: "inapp-button", children: "Play Now" })
           ] })
         ] }),
-        /* @__PURE__ */ s(
-          ws,
+        /* @__PURE__ */ e(
+          Se,
           {
-            close: (l) => {
-              l == null || l.stopPropagation(), o == null || o();
+            close: (d) => {
+              d == null || d.stopPropagation(), o == null || o();
             }
           }
         )
       ]
     }
   );
-}, js = /* @__PURE__ */ e("div")({
+}, ze = /* @__PURE__ */ s("div")({
   name: "Container",
   class: "cef8huz",
   propsAsIs: !1
-}), Ds = () => m, Ls = /* @__PURE__ */ e(Ds())({
+}), De = () => u, Le = /* @__PURE__ */ s(De())({
   name: "CheckIcon",
   class: "c1mo15kk",
   propsAsIs: !0
-}), zs = () => m, Bs = /* @__PURE__ */ e(zs())({
+}), Oe = () => u, Re = /* @__PURE__ */ s(Oe())({
   name: "PredictionIcon",
   class: "p16zkqnm",
   propsAsIs: !0
-}), Os = /* @__PURE__ */ e("div")({
+}), Be = /* @__PURE__ */ s("div")({
   name: "PredictionIconContainer",
   class: "pjszi7a",
   propsAsIs: !1
-}), Rs = /* @__PURE__ */ e("div")({
+}), Pe = /* @__PURE__ */ s("div")({
   name: "BodyContainer",
   class: "bftbmo3",
   propsAsIs: !1
-}), Ps = /* @__PURE__ */ e("div")({
+}), Qe = /* @__PURE__ */ s("div")({
   name: "Body",
   class: "barrbyu",
   propsAsIs: !1
-}), Qs = /* @__PURE__ */ e("div")({
+}), Ue = /* @__PURE__ */ s("div")({
   name: "Subtitle",
   class: "sz7237i",
   propsAsIs: !1
-}), Us = ({
+}), Ve = ({
   step: t,
   children: o,
   answer: i,
   state: a = "pending"
-}) => /* @__PURE__ */ c(js, {
-  children: [/* @__PURE__ */ s(Os, {
-    children: /* @__PURE__ */ s(Bs, {
-      name: "icon-prediction"
-    })
-  }), /* @__PURE__ */ s(Rs, {
-    children: /* @__PURE__ */ s(Ps, {
-      children: o
-    }, t)
-  }), /* @__PURE__ */ s(Qs, {
-    className: a,
-    children: /* @__PURE__ */ c("div", {
-      children: [/* @__PURE__ */ s(Ls, {
-        name: "icon-check"
-      }), "Your Pick: ", i]
-    })
-  })]
-}), Vs = /* @__PURE__ */ e("div")({
+}) => {
+  const [n, d] = y(0), [l] = y(() => new ResizeObserver((p) => {
+    var I, v;
+    d((v = (I = p == null ? void 0 : p[0]) == null ? void 0 : I.contentRect) == null ? void 0 : v.width);
+  })), r = Z((p) => {
+    p || l.disconnect(), l.observe(p);
+  }, [l]);
+  return E(() => () => {
+    l.disconnect();
+  }, [l]), /* @__PURE__ */ c(ze, {
+    children: [/* @__PURE__ */ e(Be, {
+      children: /* @__PURE__ */ e(Re, {
+        name: "icon-prediction"
+      })
+    }), /* @__PURE__ */ e(Pe, {
+      style: {
+        minWidth: `${n}px`
+      },
+      children: /* @__PURE__ */ e(Qe, {
+        children: o
+      }, t)
+    }), /* @__PURE__ */ e(Ue, {
+      ref: r,
+      className: a,
+      children: /* @__PURE__ */ c("div", {
+        children: [/* @__PURE__ */ e(Le, {
+          name: "icon-check"
+        }), "Your Pick: ", i]
+      })
+    })]
+  });
+}, Fe = /* @__PURE__ */ s("div")({
   name: "Container",
   class: "ckyzolp",
   propsAsIs: !1
-}), y = /* @__PURE__ */ e("div")({
+}), g = /* @__PURE__ */ s("div")({
   name: "Line",
   class: "l16t1zr7",
   propsAsIs: !1
-}), Fs = () => y, Ws = /* @__PURE__ */ e(Fs())({
+}), We = () => g, _e = /* @__PURE__ */ s(We())({
   name: "Line1",
   class: "le78kvg",
   propsAsIs: !0
-}), Gs = () => y, Ks = /* @__PURE__ */ e(Gs())({
+}), Ge = () => g, Ke = /* @__PURE__ */ s(Ge())({
   name: "Line2",
   class: "l1o7966d",
   propsAsIs: !0
-}), Ys = () => y, _s = /* @__PURE__ */ e(Ys())({
+}), Ye = () => g, Xe = /* @__PURE__ */ s(Ye())({
   name: "Line3",
   class: "lu9lyxq",
   propsAsIs: !0
-}), Zs = () => /* @__PURE__ */ c(Vs, {
-  children: [/* @__PURE__ */ s(Ws, {
-    children: /* @__PURE__ */ s("div", {})
-  }), /* @__PURE__ */ s(Ks, {
-    children: /* @__PURE__ */ s("div", {})
-  }), /* @__PURE__ */ s(_s, {
-    children: /* @__PURE__ */ s("div", {})
+}), Ze = () => /* @__PURE__ */ c(Fe, {
+  children: [/* @__PURE__ */ e(_e, {
+    children: /* @__PURE__ */ e("div", {})
+  }), /* @__PURE__ */ e(Ke, {
+    children: /* @__PURE__ */ e("div", {})
+  }), /* @__PURE__ */ e(Xe, {
+    children: /* @__PURE__ */ e("div", {})
   })]
-}), Hs = /* @__PURE__ */ e("div")({
+}), He = /* @__PURE__ */ s("div")({
   name: "Container",
   class: "c10jy6zf",
   propsAsIs: !1
-}), Js = () => m, Xs = /* @__PURE__ */ e(Js())({
+}), Je = () => u, es = /* @__PURE__ */ s(Je())({
   name: "CheckIcon",
   class: "c1c7scay",
   propsAsIs: !0
-}), se = () => /* @__PURE__ */ c(Hs, {
-  children: [/* @__PURE__ */ s(Xs, {
+}), ss = () => /* @__PURE__ */ c(He, {
+  children: [/* @__PURE__ */ e(es, {
     name: "icon-check"
   }), " Prediction results are in!"]
-}), ee = /* @__PURE__ */ e("div")({
+}), ns = /* @__PURE__ */ s("div")({
   name: "Container",
   class: "cf6k2yy",
   propsAsIs: !1
-}), ne = /* @__PURE__ */ e("div")({
+}), ts = /* @__PURE__ */ s("div")({
   name: "Caption",
   class: "c1c8xjus",
   propsAsIs: !1
-}), te = /* @__PURE__ */ e("div")({
+}), os = /* @__PURE__ */ s("div")({
   name: "Title",
   class: "t1d1uekn",
   propsAsIs: !1
-}), oe = ({
+}), is = ({
   title: t
-}) => /* @__PURE__ */ c(ee, {
-  children: [/* @__PURE__ */ s(ne, {
+}) => /* @__PURE__ */ c(ns, {
+  children: [/* @__PURE__ */ e(ts, {
     children: "Results for"
-  }), /* @__PURE__ */ s(te, {
+  }), /* @__PURE__ */ e(os, {
     children: t
   })]
-}), x = /* @__PURE__ */ e("div")({
+}), j = /* @__PURE__ */ s("div")({
   name: "Container",
   class: "c181a1as",
   propsAsIs: !1
-}), j = /* @__PURE__ */ e("div")({
+}), z = /* @__PURE__ */ s("div")({
   name: "Title",
   class: "t1cduox6",
   propsAsIs: !1
-}), ie = () => m, D = /* @__PURE__ */ e(ie())({
+}), as = () => u, D = /* @__PURE__ */ s(as())({
   name: "CorrectIcon",
   class: "c1onrv6j",
   propsAsIs: !0
-}), ae = () => D, ce = /* @__PURE__ */ e(ae())({
+}), cs = () => D, rs = /* @__PURE__ */ s(cs())({
   name: "InCorrectIcon",
   class: "i17n9o7e",
   propsAsIs: !0
-}), re = () => /* @__PURE__ */ c(x, {
-  children: [/* @__PURE__ */ c(j, {
-    children: ["Congratulations!", /* @__PURE__ */ s("br", {}), "You answered correctly."]
-  }), /* @__PURE__ */ s(D, {
+}), ls = () => /* @__PURE__ */ c(j, {
+  children: [/* @__PURE__ */ c(z, {
+    children: ["Congratulations!", /* @__PURE__ */ e("br", {}), "You answered correctly."]
+  }), /* @__PURE__ */ e(D, {
     name: "icon-check"
   })]
-}), le = ({
+}), ds = ({
   title: t
-}) => /* @__PURE__ */ c(x, {
-  children: [/* @__PURE__ */ c(j, {
-    children: ["Better luck next time!", /* @__PURE__ */ s("br", {}), "Correct: ", t]
-  }), /* @__PURE__ */ s(ce, {
+}) => /* @__PURE__ */ c(j, {
+  children: [/* @__PURE__ */ c(z, {
+    children: ["Better luck next time!", /* @__PURE__ */ e("br", {}), "Correct: ", t]
+  }), /* @__PURE__ */ e(rs, {
     name: "icon-cross"
   })]
-}), de = /* @__PURE__ */ e("div")({
+}), ps = /* @__PURE__ */ s("div")({
   name: "Container",
   class: "cnxgcs2",
   propsAsIs: !1
-}), pe = /* @__PURE__ */ e("div")({
+}), ms = /* @__PURE__ */ s("div")({
   name: "Title",
   class: "t903f8n",
   propsAsIs: !1
-}), me = () => m, ue = /* @__PURE__ */ e(me())({
+}), us = () => u, Is = /* @__PURE__ */ s(us())({
   name: "CheckIcon",
   class: "ceyu3qj",
   propsAsIs: !0
-}), Ie = ({
+}), vs = ({
   points: t
-}) => /* @__PURE__ */ c(de, {
-  children: [/* @__PURE__ */ c(pe, {
-    children: ["You won ", /* @__PURE__ */ s(Q, {
+}) => /* @__PURE__ */ c(ps, {
+  children: [/* @__PURE__ */ c(ms, {
+    children: ["You won ", /* @__PURE__ */ e(U, {
       delay: 0.5,
       prefix: "+",
       suffix: " points",
       value: t
     })]
-  }), /* @__PURE__ */ s(ue, {
+  }), /* @__PURE__ */ e(Is, {
     name: "icon-trophy-solid"
   })]
-}), k = /* @__PURE__ */ e("div")({
+}), w = /* @__PURE__ */ s("div")({
   name: "Container",
   class: "cq3agu2",
   propsAsIs: !1
-}), w = /* @__PURE__ */ e("div")({
+}), S = /* @__PURE__ */ s("div")({
   name: "Body",
   class: "b16qj0do",
   propsAsIs: !1
-}), S = {
+}), q = {
   1: 3e3,
   2: 4e3,
   3: 4e3,
   4: 4e3
-}, he = ({ close: t, action: o, setStep: i, votedAnswer: a, correct: n, correctAnswerTitle: l, questionTitle: d, step: r }) => {
-  if (E(() => {
+}, hs = ({ close: t, action: o, setStep: i, votedAnswer: a, correct: n, correctAnswerTitle: d, questionTitle: l, step: r }) => {
+  if (x(() => {
     if (i) {
-      const A = setTimeout(() => {
-        S[r + 1] && (n || r < 3) ? i(r + 1) : t == null || t();
-      }, S[r]);
+      const I = setTimeout(() => {
+        q[r + 1] && (n || r < 3) ? i(r + 1) : t == null || t();
+      }, q[r]);
       return () => {
-        A && clearTimeout(A);
+        I && clearTimeout(I);
       };
     }
     return () => {
     };
   }, [i, r, t, n]), r === 1)
-    return /* @__PURE__ */ s(k, { children: /* @__PURE__ */ s(w, { children: /* @__PURE__ */ s(se, {}) }) });
-  let v = "pending";
-  return (r === 3 || r === 4) && (v = n ? "correct" : "incorrect"), /* @__PURE__ */ s(k, { onClick: () => o == null ? void 0 : o(), children: /* @__PURE__ */ c(w, { children: [
-    r !== 1 && /* @__PURE__ */ s(Zs, {}, r),
-    /* @__PURE__ */ c(Us, { state: v, step: r, answer: (a == null ? void 0 : a.title) || "unknown", children: [
-      r === 2 && /* @__PURE__ */ s(oe, { title: d || "unknown" }),
-      r === 3 && n && /* @__PURE__ */ s(re, {}),
-      r === 3 && !n && /* @__PURE__ */ s(le, { title: l || "unknown" }),
-      r === 4 && /* @__PURE__ */ s(Ie, { points: (a == null ? void 0 : a.points) || 0 })
+    return /* @__PURE__ */ e(w, { children: /* @__PURE__ */ e(S, { children: /* @__PURE__ */ e(ss, {}) }) });
+  let p = "pending";
+  return (r === 3 || r === 4) && (p = n ? "correct" : "incorrect"), /* @__PURE__ */ e(w, { onClick: () => o == null ? void 0 : o(), children: /* @__PURE__ */ c(S, { children: [
+    r !== 1 && /* @__PURE__ */ e(Ze, {}, r),
+    /* @__PURE__ */ c(Ve, { state: p, step: r, answer: (a == null ? void 0 : a.title) || "unknown", children: [
+      r === 2 && /* @__PURE__ */ e(is, { title: l || "unknown" }),
+      r === 3 && n && /* @__PURE__ */ e(ls, {}),
+      r === 3 && !n && /* @__PURE__ */ e(ds, { title: d || "unknown" }),
+      r === 4 && /* @__PURE__ */ e(vs, { points: (a == null ? void 0 : a.points) || 0 })
     ] })
   ] }) });
-}, ve = ({ close: t, action: o, votedAnswer: i, correct: a, correctAnswerTitle: n, questionTitle: l }) => {
-  const [d, r] = q(1);
-  return /* @__PURE__ */ s(
-    he,
+}, As = ({ close: t, action: o, votedAnswer: i, correct: a, correctAnswerTitle: n, questionTitle: d }) => {
+  const [l, r] = y(1);
+  return /* @__PURE__ */ e(
+    hs,
     {
       close: t,
       action: o,
       votedAnswer: i,
       correct: a,
       correctAnswerTitle: n,
-      questionTitle: l,
+      questionTitle: d,
       setStep: r,
-      step: d,
+      step: l,
       title: ""
     }
   );
-}, Ae = /* @__PURE__ */ e("div")({
+}, $s = /* @__PURE__ */ s("div")({
   name: "NotificationContainer",
   class: "n1i4h28u",
   propsAsIs: !1
-}), $e = (t) => /* @__PURE__ */ s(Ae, { children: /* @__PURE__ */ s(ve, { ...t }) }), ye = ({ sdk: t }) => {
-  const [o] = q(t.getNotificationsStore()), i = U(o), a = t.getFeature(_.GAMES), n = Z(() => t.getActiveNotification(), [t, i]);
-  return E(() => {
-    n && V.emit("notification", {
+}), ys = (t) => /* @__PURE__ */ e($s, { children: /* @__PURE__ */ e(As, { ...t }) }), fs = ({ sdk: t }) => {
+  const [o] = y(t.getNotificationsStore()), i = V(o), a = t.getFeature(X.GAMES), n = E(() => t.getActiveNotification(), [t, i]);
+  return x(() => {
+    n && F.emit("notification", {
       action: "rendered",
       payload: {
         questionId: n.data.questionId,
         questionType: n.data.questionType
       }
     });
-  }, [n]), n && n.type === T.QUESTION_RESOLVED ? n.data.question && n.data.questionType === I.PREDICTION ? /* @__PURE__ */ s(
-    $e,
+  }, [n]), n && n.type === C.QUESTION_RESOLVED ? n.data.question && n.data.questionType === A.PREDICTION ? /* @__PURE__ */ e(
+    ys,
     {
       action: n.action,
       close: n.close,
       ...n.data.question
     }
-  ) : null : n && n.type === T.ONBOARDING ? n.data.onboarding ? /* @__PURE__ */ s(xs, { open: a == null ? void 0 : a.openFeature, close: n.close, ...n.data.onboarding }) : null : n && /* @__PURE__ */ s(gs, { ...n.data, action: n.action });
-}, Ce = ({ theme: t }) => {
-  const o = F(), i = W(), a = G();
-  return o && (a.appNotification || a.onboardingNotification) ? a.app && !a.onboardingNotification ? null : /* @__PURE__ */ s("div", { className: "StreamLayerSDK", children: /* @__PURE__ */ s(K, { customTheme: t ?? i.theme, themeMode: i.themeMode, children: /* @__PURE__ */ s(ye, { sdk: o }) }) }) : null;
+  ) : null : n && n.type === C.ONBOARDING ? n.data.onboarding ? /* @__PURE__ */ e(je, { open: a == null ? void 0 : a.openFeature, close: n.close, ...n.data.onboarding }) : null : n && /* @__PURE__ */ e(Te, { ...n.data, action: n.action });
+}, bs = ({ theme: t }) => {
+  const o = W(), i = _(), a = G();
+  return o && (a.appNotification || a.onboardingNotification) ? a.app && !a.onboardingNotification ? null : /* @__PURE__ */ e("div", { className: "StreamLayerSDK", children: /* @__PURE__ */ e(K, { customTheme: t ?? i.theme, themeMode: i.themeMode, children: /* @__PURE__ */ e(fs, { sdk: o }) }) }) : null;
 };
 export {
-  Ce as StreamLayerSDKNotification,
-  ye as StreamLayerSDKNotificationUI
+  bs as StreamLayerSDKNotification,
+  fs as StreamLayerSDKNotificationUI
 };